/* --- Design System (RMS TT) --- */
:root{
  --primary: #1E4FFF;   /* bleu club */
  --primary-600:#1640cc;
  --navy: #0b1320;      /* texte principal */
  --muted: #5a6b88;     /* texte secondaire */
  --soft: #f3f6ff;      /* fond clair bleu */
  --card: #ffffff;      /* fond des cartes */
  --border:#e6ebf5;     /* bordures light */
  --radius: 14px;
  --gap: 1.1rem;
  --max: 1120px;
  --shadow-sm: 0 1px 2px rgba(10, 16, 31, .06);
  --shadow-md: 0 6px 20px rgba(10, 16, 31, .08);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  color:var(--navy);
  background:#fff;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{color:inherit}

.site-header{
  position:sticky; top:0; z-index:1000;
  backdrop-filter:saturate(180%) blur(6px);
  background:rgba(255,255,255,.85);
  border-bottom:1px solid var(--border);
}
.brand{
  display:flex; align-items:center; gap:1rem;
  max-width:var(--max); margin:0 auto; padding:.6rem 1rem;
}
.logo{ width:84px; height:84px; object-fit:contain }
.brand h1{ font-size:1.35rem; margin:.1rem 0 .15rem }
.tagline{ color:var(--muted); margin:0; font-weight:500 }

.nav{
  display:flex; gap:.4rem; flex-wrap:wrap;
  max-width:var(--max); margin:0 auto; padding:0 1rem 0.6rem;
}
.nav a{
  text-decoration:none; color:#1c2b4a; font-weight:600;
  padding:.48rem .72rem; border-radius:10px;
  transition:background .2s ease, transform .05s;
}
.nav a:hover{ background:var(--soft) }
.nav a:active{ transform:translateY(1px) }

.section{ max-width:var(--max); margin:0 auto; padding:2rem 1rem }
.hero{
  background:linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
  border-bottom:1px solid var(--border);
}
.cards{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr));
  gap:var(--gap); margin-top:1rem;
}
.card{
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  padding:1.1rem; transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease;
}
.card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-md); border-color:#dde3f2 }

.list{
  list-style:none; padding:0;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr));
  gap:var(--gap);
}
.grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr));
  gap:var(--gap);
}

.badge{
  display:inline-block; font-size:.78rem; font-weight:600;
  background:#eaf0ff; color:var(--primary);
  padding:.24rem .6rem; border-radius:999px; border:1px solid #d6e2ff;
}

.gallery{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr));
  gap:var(--gap); margin-top:1rem;
}
.hidden{ display:none }

.row{ display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem }
label{ font-weight:600 }
input, select, textarea{
  padding:.72rem .8rem; font-size:1rem;
  border:1px solid var(--border); border-radius:12px; background:#fff;
  transition:border .2s ease, box-shadow .2s ease;
}
textarea{ resize:vertical }
input:focus, select:focus, textarea:focus{
  outline:none; border-color:#c7d3ef; box-shadow:0 0 0 4px rgba(30,79,255,.08);
}

/* Buttons */
button{
  --btn-bg: var(--primary);
  --btn-bg-h: var(--primary-600);
  --btn-fg: #fff;
  border:0; color:var(--btn-fg); background:var(--btn-bg);
  padding:.78rem 1rem; font-weight:700; font-size:1rem;
  border-radius:12px; cursor:pointer;
  box-shadow: 0 2px 8px rgba(30,79,255,.25);
  transition: transform .06s ease, filter .15s ease, box-shadow .2s ease, background .2s ease;
}
button:hover{ filter:brightness(1.02); box-shadow:0 6px 18px rgba(30,79,255,.28) }
button:active{ transform:translateY(1px); background:var(--btn-bg-h) }

/* Tabs */
.tabs{ display:flex; gap:.6rem }
.tab{
  background:#eef4ff; border:1px solid #d7e0f7; color:#1c2b4a; font-weight:600;
  padding:.5rem .8rem; border-radius:999px; cursor:pointer;
}
.tab.active{ border-color:var(--primary); color:var(--primary); background:#eaf0ff }

/* Footer */
.site-footer{
  border-top:1px solid var(--border);
  padding:1.25rem; text-align:center; font-size:.95rem; color:var(--muted);
}

/* Small helpers */
.legal{ color:var(--muted); font-size:.9rem }
.contact{ list-style:none; padding:0; display:grid; gap:.6rem }

/* Patch visibilité Adhésion */
#adhesion { display:block !important; visibility:visible !important; }
#adhesion .row, #adhesion form { display:block !important; }