
:root{
  --night:#081C15;--green:#2D6A4F;--gold:#E8B84B;--gold2:#FFD766;--cream:#FAF7F0;--ink:#06130F;
  --muted:#60706A;--line:#E9DFD0;--shadow:0 22px 60px rgba(8,28,21,.16);--soft:0 10px 28px rgba(8,28,21,.08)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--cream);color:var(--ink);overflow-x:hidden}
a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.container{width:min(1180px,calc(100% - 70px));margin:auto}.gold{color:var(--gold)}
.btn{min-height:52px;padding:0 24px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;font-size:12px;text-transform:uppercase;font-weight:900;transition:.25s;cursor:pointer;letter-spacing:.02em}
.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--gold),var(--gold2));color:var(--night);box-shadow:0 16px 32px rgba(232,184,75,.25)}.btn-ghost{background:rgba(8,28,21,.38);color:#fff;border-color:rgba(232,184,75,.55);backdrop-filter:blur(14px)}.btn-dark{background:var(--night);color:#fff}
.badge{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:999px;border:1px solid rgba(232,184,75,.55);background:rgba(8,28,21,.42);color:var(--gold);font-size:12px;font-weight:900;text-transform:uppercase}
.header{position:fixed;top:0;left:0;right:0;z-index:100;height:72px;background:rgba(8,28,21,.92);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{height:58px;object-fit:contain}.nav{display:flex;gap:20px;color:#fff;text-transform:uppercase;font-size:12px;font-weight:900}.nav a:hover,.nav a.active{color:var(--gold)}.actions{display:flex;align-items:center;gap:10px}.round{height:40px;border-radius:999px;border:1px solid rgba(232,184,75,.45);background:rgba(8,28,21,.34);color:#fff;display:flex;align-items:center;justify-content:center;padding:0 13px;font-weight:900}
.hero{min-height:720px;color:#fff;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 23%,rgba(232,184,75,.18),transparent 22%),linear-gradient(90deg,rgba(8,28,21,.96) 0%,rgba(8,28,21,.82) 35%,rgba(8,28,21,.45) 65%,rgba(8,28,21,.15) 100%),url('../assets/hero/hero-worldcup.jpg');background-position:center center;background-size:cover;background-repeat:no-repeat;padding:152px 0 80px}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.25));pointer-events:none}.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(180deg,transparent,var(--cream))}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .82fr;gap:55px;align-items:end}.hero h1{font-family:Syne,Inter,sans-serif;font-size:clamp(34px,3.8vw,52px);line-height:1;text-transform:uppercase;letter-spacing:-1px;margin:24px 0 20px}.hero h1 span{display:block;color:var(--gold)}.hero p{font-size:18px;line-height:1.6;color:rgba(255,255,255,.90);max-width:580px;margin:0 0 28px}.hero-ctas{display:flex;gap:15px;flex-wrap:wrap}.proof{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:26px}.proof-pill{background:rgba(255,255,255,.07);border:1px solid rgba(232,184,75,.20);border-radius:16px;padding:13px 14px}.proof-pill strong{display:block;color:var(--gold);font-family:Syne;font-size:20px}.proof-pill span{display:block;color:rgba(255,255,255,.72);font-size:11px;font-weight:800;text-transform:uppercase}
.count-card{justify-self:end;width:395px;border-radius:26px;padding:24px;background:rgba(8,28,21,.70);border:1px solid rgba(232,184,75,.30);backdrop-filter:blur(20px);box-shadow:0 28px 80px rgba(0,0,0,.32)}.count-title{text-align:center;color:var(--gold);text-transform:uppercase;font-weight:900;font-size:12px;margin-bottom:18px}.count-grid{display:grid;grid-template-columns:repeat(4,1fr)}.count{text-align:center;border-right:1px solid rgba(255,255,255,.14);padding:0 10px}.count:last-child{border-right:0}.count strong{display:block;font-size:34px;line-height:1}.count span{font-size:9px;text-transform:uppercase;color:rgba(255,255,255,.75);font-weight:900}
.section{padding:58px 0}.section.compact{padding:44px 0}.section-title{font-family:Syne,Inter,sans-serif;font-size:clamp(34px,3.8vw,48px);line-height:.95;text-transform:uppercase;margin:0 0 24px;letter-spacing:-.8px}.section-title.center{text-align:center}.section-title.center:after{content:"";display:block;width:42px;height:3px;background:var(--gold);border-radius:3px;margin:13px auto 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:24px}.sub{font-size:18px;color:var(--muted);max-width:650px;line-height:1.45}
.stats,.modules,.steps,.af-news-grid,.stars,.supporter-ranking,.why-grid,.community-stats{display:grid;gap:18px}.stats{grid-template-columns:repeat(5,1fr);background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--soft);gap:0}.stat{text-align:center;padding:23px 16px;border-right:1px solid var(--line)}.stat:last-child{border-right:0}.stat strong{display:block;font-size:38px}.stat span{text-transform:uppercase;font-size:12px;font-weight:900}
.module,.step,.star,.af-news-card,.panel,.rank-card,.profile-card,.why-card,.community-stat{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--soft);position:relative}.modules{grid-template-columns:repeat(4,1fr)}.module svg{width:34px;height:34px;stroke:var(--green);stroke-width:2;fill:none}.module b,.step h4{display:block;text-transform:uppercase;margin:12px 0 8px}.module span,.step p{font-size:13px;color:var(--muted);line-height:1.45}.lock{position:absolute;top:14px;right:14px;background:rgba(232,184,75,.14);color:var(--gold);border:1px solid rgba(232,184,75,.25);padding:4px 8px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase}
.live-forum,.africa-band,.match-band,.final{background:var(--night);color:#fff;padding:60px 0}.forum-preview{display:grid;grid-template-columns:1fr 420px;gap:30px;align-items:center}.live-card{background:rgba(255,255,255,.06);border:1px solid rgba(232,184,75,.22);border-radius:22px;padding:22px}.msg{background:rgba(255,255,255,.08);border-radius:14px;padding:12px 14px;margin-bottom:10px}.msg b{color:var(--gold)}.react{font-size:12px;color:rgba(255,255,255,.65);font-weight:800;margin-top:6px}.live-dot{width:10px;height:10px;border-radius:50%;background:#52B788;display:inline-block;margin-right:8px}.flag-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.flag-pill{background:rgba(255,255,255,.06);border:1px solid rgba(232,184,75,.22);border-radius:999px;padding:8px 15px;font-weight:800;display:inline-flex;align-items:center;gap:6px}.flag-icon{width:22px;height:22px;border-radius:50%;vertical-align:middle;display:inline-block;object-fit:cover;margin-right:6px;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.why-grid{grid-template-columns:repeat(4,1fr)}.why-ico{font-size:34px;margin-bottom:12px}.why-card h3{font-family:Syne;text-transform:uppercase;margin:0 0 8px;font-size:20px}.why-card p{color:var(--muted);font-size:14px;line-height:1.45;margin:0}
.team-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.team-card-premium{height:340px;border-radius:24px;overflow:hidden;position:relative;display:flex;align-items:flex-end;box-shadow:var(--shadow);background:var(--night)}.team-card-premium img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.35s}.team-card-premium:hover img{transform:scale(1.06)}.team-card-premium:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(8,28,21,.86))}.team-overlay{position:relative;z-index:2;padding:18px;color:#fff}.team-overlay h3{font-family:Syne;text-transform:uppercase;font-size:21px;margin:0 0 5px;line-height:1;color:var(--gold)}.team-overlay span{font-size:12px;font-weight:800;color:rgba(255,255,255,.84)}.team-overlay small{display:inline-block;margin-top:12px;border:1px solid rgba(232,184,75,.45);border-radius:999px;padding:7px 12px;color:#fff;font-weight:900;font-size:10px;text-transform:uppercase}
.premium-card{background:linear-gradient(135deg,var(--night),#123524);color:#fff;border-radius:28px;padding:36px;border:1px solid rgba(232,184,75,.3);box-shadow:var(--shadow);display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}.premium-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.premium-list div{background:rgba(255,255,255,.06);border:1px solid rgba(232,184,75,.18);padding:12px;border-radius:14px;font-weight:800}.premium-price{font-family:Syne;font-size:46px;color:var(--gold);line-height:.9}.founder{display:inline-flex;background:var(--gold);color:var(--night);font-weight:900;border-radius:999px;padding:7px 12px;margin-bottom:14px}
.supporter-ranking{grid-template-columns:repeat(3,1fr)}.rank-card{display:flex;align-items:center;gap:18px}.medal{font-size:32px}.rank-card strong{display:block;font-size:18px}.rank-card span{color:var(--muted);font-weight:800}.community-stats{grid-template-columns:repeat(4,1fr)}.community-stat{text-align:center}.community-stat strong{font-family:Syne;font-size:36px;color:var(--green);display:block}.community-stat span{font-weight:900;text-transform:uppercase;font-size:12px;color:var(--muted)}
.steps{grid-template-columns:repeat(4,1fr)}.step-num{width:42px;height:42px;border-radius:50%;background:var(--night);color:var(--gold);display:grid;place-items:center;font-family:Syne;font-size:24px;margin-bottom:14px}.match-layout{display:grid;grid-template-columns:240px 1fr 360px;gap:30px;align-items:center}.match-title h2{font-family:Syne;font-size:44px;text-transform:uppercase;line-height:.93}.match-title h2 span{color:var(--gold)}.match-card{background:radial-gradient(circle at 50% 0,rgba(232,184,75,.18),transparent 28%),linear-gradient(135deg,rgba(45,106,79,.78),rgba(8,28,21,.96));border:1px solid rgba(232,184,75,.25);border-radius:26px;padding:30px;text-align:center}.teams{display:flex;align-items:center;justify-content:center;gap:44px}.team .em .flag-icon{width:60px;height:60px;margin-right:0}.vs{font-family:Syne;color:var(--gold);font-size:54px;font-weight:900}.meta{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(255,255,255,.14);padding-top:16px;margin-top:22px}.meta span{font-size:10px}.stadium{height:235px;border-radius:24px;background:url('../assets/stadiums/metlife-stadium.png') center/cover no-repeat;position:relative;overflow:hidden;box-shadow:var(--shadow)}.stadium div{position:absolute;right:22px;bottom:22px;color:#fff;font-weight:900}
.dual{display:grid;grid-template-columns:1fr 1fr;gap:28px}.tv-logos{display:flex;gap:12px;flex-wrap:wrap}.tv-logo{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px;font-size:13px;font-weight:900}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.product{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px;text-align:center;font-size:12px;font-weight:900}.product img{height:94px;width:100%;object-fit:cover;border-radius:12px}.price{display:block;color:var(--gold);font-weight:900}.af-news-grid{grid-template-columns:repeat(3,1fr)}.af-news-card{padding:0;overflow:hidden}.af-news-card img{height:165px;width:100%;object-fit:cover}.af-news-card div{padding:18px}.video-card{min-height:270px;border-radius:24px;background:linear-gradient(135deg,rgba(8,28,21,.92),rgba(45,106,79,.78)),url('../assets/backgrounds/match-bg.png') center/cover no-repeat;color:#fff;padding:32px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:var(--shadow)}.group-table{width:100%;border-collapse:collapse;background:#fff;border-radius:20px;overflow:hidden}.group-table th,.group-table td{padding:14px;border-bottom:1px solid var(--line);text-align:left}.group-table th{background:var(--night);color:#fff}.group-table .flag-icon{width:20px;height:20px}.stars{grid-template-columns:repeat(5,1fr)}.star{text-align:center}.star img{height:150px;width:100%;object-fit:cover;border-radius:16px}.final .container{display:flex;justify-content:space-between;align-items:center;gap:24px}.final-btns{display:flex;gap:12px}.footer{background:#06130F;color:#fff;padding:40px 0}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}.footer .logo{height:52px}.footer a,.footer p{display:block;color:rgba(255,255,255,.55);font-size:12px}.floating-cta{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:1000;display:none}.floating-cta.show{display:block}.floating-btn{display:inline-flex;background:var(--gold);color:var(--night);font-size:14px;font-weight:900;text-transform:uppercase;padding:13px 28px;border-radius:30px;box-shadow:0 4px 24px rgba(232,184,75,.4)}
.auth-card{max-width:520px;background:rgba(255,255,255,.08);border:1px solid rgba(232,184,75,.25);padding:26px;border-radius:24px;backdrop-filter:blur(14px)}.auth-card input{width:100%;padding:16px;border-radius:12px;border:1px solid var(--line);margin-bottom:12px;font-weight:800}
@media(max-width:1100px){.container{width:min(100% - 34px,1180px)}.nav{display:none}.actions .btn{display:none}.hero{padding:95px 0 60px}.hero-grid,.forum-preview,.premium-card,.match-layout,.dual{grid-template-columns:1fr}.count-card{width:100%}.proof,.stats,.modules,.products,.af-news-grid,.stars,.steps,.why-grid,.community-stats,.supporter-ranking{grid-template-columns:repeat(2,1fr)}.team-grid{grid-template-columns:repeat(2,1fr)}.meta{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.final .container{flex-direction:column;text-align:center}}@media(max-width:640px){.proof,.stats,.modules,.products,.af-news-grid,.stars,.steps,.team-grid,.why-grid,.community-stats,.supporter-ranking{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.logo{height:48px}.hero h1{font-size:38px}}



/* ══ NATIONS SHOWCASE — version premium aérée ══ */
.nations-section { background: #F8F5F0 !important; }
.nations-head { margin-bottom: 26px !important; }
.eyebrow {
  display: inline-block; color: #D4A017; font-size: 11px; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase; margin-bottom: 10px;
}
.nations-showcase {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.nation-tile {
  position: relative; min-height: 245px; border-radius: 18px; overflow: hidden;
  text-decoration: none; background: #081C15; box-shadow: 0 14px 34px rgba(0,0,0,.16);
  isolation: isolate; display: block; border: 1px solid rgba(8,28,21,.08);
}
.nation-tile img {
  width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0;
  transform: scale(1.02); transition: transform .35s ease;
}
.nation-tile::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.24) 42%, rgba(0,0,0,.84) 100%),
    linear-gradient(90deg, rgba(8,28,21,.42), transparent);
}
.nation-tile:hover img { transform: scale(1.08); }
.nation-tile:hover { box-shadow: 0 18px 42px rgba(0,0,0,.22); }
.nation-content { position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px; }
.nation-flag {
  display: inline-flex; width: 30px; height: 30px; border-radius: 999px;
  align-items: center; justify-content: center; background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22); margin-bottom: 10px; font-size: 18px;
}
.nation-content h3 {
  font-family: Syne, Inter, sans-serif; font-size: 18px; line-height: 1; margin: 0 0 5px;
  color: #fff; text-transform: uppercase; letter-spacing: -.02em;
}
.nation-content p { margin: 0 0 12px; font-size: 11px; color: rgba(255,255,255,.72); font-weight: 700; }
.nation-link {
  display: inline-flex; color: #D4A017; font-size: 10px; font-weight: 900;
  letter-spacing: .08em; text-transform: uppercase;
}
@media (max-width: 1024px) { .nations-showcase { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 640px) {
  .nations-showcase { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  .nation-tile { min-height: 190px; border-radius: 14px; }
  .nation-content { left: 12px; right: 12px; bottom: 12px; }
  .nation-content h3 { font-size: 14px; }
  .nation-content p { font-size: 10px; margin-bottom: 9px; }
  .nation-link { font-size: 9px; }
}




/* ==========================================
   AFRICA LIVE TICKER
========================================== */

.africa-live-ticker{
    background: linear-gradient(90deg,#E8B84B,#FFD766);
    color:#081C15;
    height:42px;
    overflow:hidden;
    display:flex;
    align-items:center;
    border-bottom:1px solid rgba(8,28,21,.08);
    position:relative;
    z-index:90;
}

.africa-live-inner{
    display:flex;
    align-items:center;
    width:100%;
    gap:15px;
}

.ticker-label{
    flex-shrink:0;
    font-weight:900;
    font-size:12px;
    text-transform:uppercase;
    padding-left:20px;
}

.ticker-viewport{
    flex:1;
    overflow:hidden;
    position:relative;
}

.ticker-track{
    display:flex;
    gap:40px;
    white-space:nowrap;
    animation:ticker-scroll 45s linear infinite;
}

.ticker-item{
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
}

@keyframes ticker-scroll{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
}

@media(max-width:640px){
    .africa-live-ticker{height:38px;}
    .ticker-label{font-size:10px;padding-left:10px;}
    .ticker-item{font-size:11px;}
}
