:root{
  --navy-950:#04060B;
  --navy-900:#0A0F1C;
  --navy-800:#111828;
  --navy-700:#1B2438;
  --line-dark:rgba(255,255,255,0.09);
  --line-dark-strong:rgba(255,255,255,0.16);
  --paper:#F6F6F3;
  --paper-2:#EFEFEA;
  --ink:#0A0F1C;
  --ink-soft:#374056;
  --slate:#8892A6;
  --slate-light:#69728A;
  --line-light:rgba(10,15,28,0.10);
  --green:#22C56E;
  --green-dim:#173A29;
  --gold:#E3B341;
  --red:#EF5A52;
  --white:#FFFFFF;

  --f-display:"Big Shoulders Display",sans-serif;
  --f-body:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;
  --f-mono:"JetBrains Mono",monospace;

  --wrap-max:1280px;
  --wrap-pad:32px;
  --section-y:120px;
  --section-head-mb:52px;
  --hero-pad-top:96px;
  --hero-pad-bottom:136px;
  --pre-footer:32px;
  --card-pad:24px;
  --card-radius:14px;
  --grid-gap:20px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{
  scroll-behavior:smooth;
  overflow-x:clip;
}
body{
  font-family:var(--f-body);
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
@supports not (overflow:clip){
  html{ overflow-x:hidden; }
  body{ overflow-x:visible; }
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit; cursor:pointer;}

::selection{background:var(--green); color:var(--navy-950);}
:focus-visible{outline:2px solid var(--green); outline-offset:3px;}

.skip-link{
  position:absolute;
  left:16px;
  top:-48px;
  z-index:500;
  background:var(--green);
  color:#04180E;
  padding:10px 16px;
  font-weight:600;
  font-size:14px;
  border-radius:8px;
}
.skip-link:focus{top:12px;}

.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.wrap{
  max-width:var(--wrap-max);
  margin:0 auto;
  padding:0 var(--wrap-pad);
  width:100%;
}

.eyebrow{
  font-family:var(--f-mono);
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow .dot{width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block;}
.eyebrow-muted{ color:var(--slate-light); }
.eyebrow-accent{ color:var(--green); }

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:var(--section-head-mb);
  flex-wrap:wrap;
}
.section-title{
  font-family:var(--f-display);
  font-weight:800;
  font-size:clamp(32px,4.2vw,48px);
  line-height:1.02;
  letter-spacing:-0.01em;
  text-transform:uppercase;
}
.section-sub{
  color:var(--slate-light);
  font-size:16px;
  max-width:460px;
  margin-top:12px;
  line-height:1.6;
}
.section-pad{ padding:var(--section-y) 0; }
.section-alt{ background:var(--paper-2); }

.hero{
  background:
    radial-gradient(1200px 480px at 12% -10%, rgba(34,197,110,0.10), transparent 60%),
    var(--navy-950);
  color:var(--white);
  padding:var(--hero-pad-top) 0 var(--hero-pad-bottom);
  position:relative;
  z-index:1;
  border-bottom:1px solid var(--line-dark);
  overflow-x:clip;
}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,0.8fr);
  gap:56px;
  align-items:center;
}
.hero-copy{ min-width:0; }
.hero-eyebrow{ color:var(--green); margin-bottom:24px; }
.hero h1{
  font-family:var(--f-display);
  font-weight:900;
  text-transform:uppercase;
  font-size:clamp(42px,5.6vw,72px);
  line-height:0.96;
  letter-spacing:-0.01em;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
}
.hero h1 .line2{ color:var(--green); display:block; }
.hero-copy p{
  color:#AAB2C5;
  font-size:17.5px;
  line-height:1.7;
  max-width:500px;
  margin:28px 0 36px;
}
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-stats-strip{
  display:flex;
  gap:40px;
  margin-top:56px;
  flex-wrap:wrap;
}
.hero-stats-strip div{ border-left:2px solid var(--line-dark-strong); padding-left:16px; min-width:0; }
.hero-stats-strip .num{ font-family:var(--f-mono); font-size:22px; font-weight:700; color:var(--white); }
.hero-stats-strip .lbl{ font-size:12.5px; color:var(--slate); margin-top:4px; line-height:1.4; }

.live-section{ background:var(--navy-950); color:var(--white); border-bottom:1px solid var(--line-dark); }
.live-section .section-title{ color:var(--white); }
.live-section .eyebrow{ color:var(--green); }
.live-section .section-sub{ color:var(--slate); }
.live-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--grid-gap);
}

.ai-section{ background:var(--paper); position:relative; }
.ai-shell{
  background:var(--navy-950);
  color:var(--white);
  border-radius:20px;
  padding:64px 56px;
  position:relative;
  overflow:hidden;
  border:1px solid var(--line-dark);
}
.ai-shell::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(600px 300px at 90% 0%, rgba(227,179,65,0.10), transparent 60%),
    radial-gradient(600px 300px at 0% 100%, rgba(34,197,110,0.10), transparent 60%);
  pointer-events:none;
}
.ai-top{ position:relative; z-index:1; margin-bottom:48px; max-width:680px; }
.ai-top .eyebrow{ color:var(--gold); margin-bottom:18px; }
.ai-top h2{
  font-family:var(--f-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(30px,4.2vw,48px); line-height:1.04; letter-spacing:-0.01em;
}
.ai-body{
  position:relative; z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);
  gap:56px;
  align-items:start;
}
.ai-roadmap{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; gap:10px; margin-top:44px;
  padding-top:32px; border-top:1px solid var(--line-dark);
}

.fixtures-list{ display:flex; flex-direction:column; }

.players-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
}

.results-list{ display:flex; flex-direction:column; }

.numbers-section{ background:var(--navy-950); color:var(--white); }
.numbers-intro{ padding-top:var(--section-y); padding-bottom:0; }
.numbers-section .section-head{ margin-bottom:0; padding-bottom:var(--section-head-mb); }
.numbers-section .section-title{ color:#fff; }
.numbers-grid-wrap{ padding-bottom:0; }
.numbers-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  border-top:1px solid var(--line-dark);
  border-left:1px solid var(--line-dark);
}

.news-grid{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:48px;
  align-items:start;
}
.news-side{ display:flex; flex-direction:column; min-width:0; }

.newsletter{ background:var(--paper-2); border-top:1px solid var(--line-light); border-bottom:1px solid var(--line-light); }
.newsletter-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
  flex-wrap:wrap;
  padding-top:var(--section-y);
  padding-bottom:calc(var(--section-y) + var(--pre-footer));
}
.newsletter-inner > *{
  min-width:0;
  max-width:100%;
}
.newsletter h2{
  font-family:var(--f-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(28px,3.4vw,40px); max-width:440px; line-height:1.06;
}
.newsletter p{ color:var(--slate-light); margin-top:14px; font-size:15.5px; max-width:420px; line-height:1.6; }

footer{ background:var(--navy-950); color:var(--slate); padding:80px 0 32px; }
.footer-top{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));
  gap:48px;
  padding-bottom:56px;
  border-bottom:1px solid var(--line-dark);
}
.footer-brand .logo{ margin-bottom:16px; }
.footer-brand p{ font-size:14.5px; max-width:280px; line-height:1.65; }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:28px; flex-wrap:wrap; gap:12px; font-size:12.5px; color:#5D677E;
}
.footer-social{ display:flex; gap:12px; }

.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .live-badge .pulse{ animation:none; }
  .primary-nav,
  .nav-backdrop{ transition:none; }
  .btn-primary:hover,
  .live-mini:hover{ transform:none; }
}