:root { --bg:#0b0f12; --card:#12181d; --accent:#0ea5e9; --muted:#8b9aaa; --ok:#22c55e; --danger:#ef4444; }
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu; background:var(--bg);color:#e5eef4}
a{color:#e5eef4;text-decoration:none} a:hover{opacity:.85}

/* Topbar */
.topbar{position:sticky;top:0;backdrop-filter:saturate(1.2) blur(8px); background:rgba(11,15,18,.6); border-bottom:1px solid #1f2630; z-index:50}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1100px;margin:auto;padding:10px 16px}
.logo{height:36px;width:auto}
.brand{display:flex;align-items:center;gap:10px}
.brand-name{font-weight:700;letter-spacing:.5px}
.nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pill{padding:6px 10px;border:1px solid #2a3440;border-radius:999px;background:#17202a}
.btn{padding:8px 12px;border-radius:10px;background:var(--accent);color:#031e2b;font-weight:600}
.user{display:flex;align-items:center;gap:8px;opacity:.9}
.avatar{height:24px;width:24px;border-radius:50%}

/* Cover index */
.hero{min-height:62vh;display:grid;place-items:center;background:linear-gradient(160deg,#0b0f12 0%,#0b2433 100%)}
.hero-inner{max-width:1100px;margin:auto;padding:48px 16px;text-align:center}
.hero h1{font-size:clamp(28px,4vw,48px);margin:0 0 12px}
.hero p{color:var(--muted);max-width:760px;margin:0 auto 24px}
.action-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.page{max-width:1100px;margin:auto;padding:16px}

/* Cards */
.card{background:var(--card);border:1px solid #1b2330;border-radius:16px;padding:18px}

/* Règlement */
.reg-wrap{display:grid;grid-template-columns:280px 1fr;gap:16px}
.reg-toc{position:sticky;top:68px}
.reg-toc a{display:block;padding:8px;border-radius:8px;border:1px solid #1b2330;margin-bottom:8px}
.reg-section h2{margin-top:0}

/* Staff grid */
.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.staff-card{background:var(--card);border:1px solid #1b2330;border-radius:16px;padding:16px;text-align:center}
.staff-card img{height:64px;width:64px;border-radius:50%;margin-bottom:8px}

/* Footer */
.site-footer{border-top:1px solid #1f2630;opacity:.8;text-align:center;padding:24px 16px;margin-top:24px}

/* Responsive */
@media (max-width:900px){ .reg-wrap{grid-template-columns:1fr} .reg-toc{position:static} }

/* ===== Hero video ===== */
.hero-video { position: relative; min-height: 62vh; display: grid; place-items: center; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-scrim { position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(80% 60% at 50% 50%, rgba(0,0,0,.15), rgba(0,0,0,.55)),
              linear-gradient(160deg, rgba(11,15,18,.4), rgba(11,36,51,.6));
}
.hero-video .hero-inner { position: relative; z-index: 2; padding: 48px 16px; text-align: center; }
.hero-video h1 { color: #fff; text-shadow: 0 2px 24px rgba(0,0,0,.35); }
.hero-video p { color: #e5eef4; opacity: .9; }