/* ═══════════════════════════════════════════════
   SPORT.CSS — Sport-specific theme (uses --sport vars from tokens)
═══════════════════════════════════════════════ */

/* Override shared CSS color references */
.section-eyebrow { color: var(--sport-b); }
.s-tab.active { color: var(--sport-b); border-bottom-color: var(--sport-b); }
.s-tab.active .tab-pip { background: var(--sport-b); }
.nav-btn-ghost:hover { border-color: var(--sport-b); color: var(--sport-b); }
.nav-btn-solid { background: var(--sport); }
.nav-btn-solid:hover { background: var(--sport-b); }
.logo-wordmark em { color: var(--sport-b); }
.btn-primary { background: var(--sport); box-shadow: 0 4px 20px rgba(0,0,0,.25); }
.btn-primary:hover { background: var(--sport-b); box-shadow: 0 8px 28px rgba(0,0,0,.3); }
.btn-outline { color: var(--sport-b); border-color: rgba(var(--sport-rgb,0,0,0),.25); }
.btn-outline:hover { background: var(--sport-l); border-color: var(--sport-b); }
.feature-card::before { background: var(--sport-b); }
.notify-sec { background: var(--sport-l); border-color: rgba(0,0,0,.08); }
.notify-h em { color: var(--sport); }
.notify-input:focus { border-color: var(--sport-b); }
.notify-submit { background: var(--sport); }
.notify-submit:hover { background: var(--sport-b); }
.notify-chip.active { color: var(--sport); border-color: var(--sport-b); background: rgba(0,0,0,.03); }
.notify-ok { color: var(--sport); }
.signal-tag.highlight { color: var(--sport-bright); border-color: rgba(0,0,0,.1); background: rgba(0,0,0,.03); }
.signal-tag:hover { border-color: var(--sport-b); background: rgba(0,0,0,.02); }
.ft-wordmark em { color: var(--sport-bright); }
.fm-quote em { color: var(--sport-bright); }

/* ── HERO ── */
.hero { background: var(--dark); min-height: calc(100dvh - var(--offset)); position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
.hero-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px); background-size:52px 52px; mask-image:radial-gradient(ellipse 100% 100% at 50% 0%,black 20%,transparent 80%); }
.orb { position:absolute; border-radius:50%; pointer-events:none; filter:blur(80px); }
.orb1 { width:clamp(200px,45vw,600px); height:clamp(200px,45vw,600px); top:-15%; right:5%; animation:drift 11s ease-in-out infinite; }
.orb2 { width:clamp(150px,28vw,350px); height:clamp(150px,28vw,350px); bottom:10%; left:3%; animation:drift 14s ease-in-out infinite reverse; }
.orb3 { width:clamp(100px,18vw,240px); height:clamp(100px,18vw,240px); top:40%; right:30%; animation:drift 18s ease-in-out infinite 2s; }
.hero-content { position:relative; z-index:10; max-width:1300px; margin:0 auto; width:100%; padding:3rem 1rem 6rem; display:flex; flex-direction:column; gap:2rem; }
@media(min-width:768px){ .hero-content{flex-direction:row;align-items:center;gap:5rem;padding:4rem 2rem} .hero-left{flex:1;max-width:580px} .hero-right{flex:0 0 420px} }
@media(min-width:1100px){ .hero-right{flex:0 0 460px} }
.hero-kicker { display:inline-flex; align-items:center; gap:8px; font-size:10px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--sport-bright); border:1px solid rgba(0,0,0,.1); padding:6px 16px; border-radius:99px; margin-bottom:1.75rem; animation:riseIn .9s cubic-bezier(.22,1,.36,1) both; align-self:flex-start; }
.hero-kicker::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--sport-bright); animation:blink 1.6s infinite; }
.hero-h1 { font-family:var(--font-display); font-weight:900; font-size:clamp(58px,11vw,108px); line-height:.88; text-transform:uppercase; letter-spacing:-2px; color:#fff; margin-bottom:1.5rem; animation:riseIn .9s .08s cubic-bezier(.22,1,.36,1) both; }
.hero-h1 .accent { color:var(--sport-bright); font-style:italic; display:block; }
.hero-h1 .dim { color:rgba(255,255,255,.15); font-size:.58em; letter-spacing:-1px; font-style:normal; font-weight:700; display:block; }
.hero-desc { font-size:clamp(15px,2.5vw,17px); color:rgba(255,255,255,.38); line-height:1.75; max-width:480px; font-weight:300; margin-bottom:2.5rem; animation:riseIn .9s .16s cubic-bezier(.22,1,.36,1) both; }
.hero-desc strong { color:rgba(255,255,255,.7); font-weight:500; }
.hero-ctas { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:2.5rem; animation:riseIn .9s .24s cubic-bezier(.22,1,.36,1) both; }
.hero-pills { display:flex; gap:7px; flex-wrap:wrap; animation:riseIn .9s .32s cubic-bezier(.22,1,.36,1) both; }
.hero-pill { display:inline-flex; align-items:center; gap:5px; font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; padding:5px 12px; border-radius:99px; }
.hp-beta { background:rgba(0,0,0,.08); color:var(--sport-bright); border:1px solid rgba(0,0,0,.1); }
.hp-beta::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--sport-bright); animation:blink 1.3s infinite; }
.hp-info { background:rgba(255,255,255,.04); color:rgba(255,255,255,.3); border:1px solid rgba(255,255,255,.07); }

/* HERO PANEL */
.hero-panel { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-xl); animation:riseIn .9s .22s cubic-bezier(.22,1,.36,1) both; }
.hp-header { background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.07); padding:14px 18px; display:flex; align-items:center; justify-content:space-between; }
.hp-title { font-family:var(--font-display); font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.4); }
.hp-status { display:flex; align-items:center; gap:5px; font-size:9px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--sport-bright); }
.hp-status::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--sport-bright); animation:blink 1.2s infinite; }
.hp-body { padding:1.75rem 1.5rem; }
.hp-countdown-label { font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.3); margin-bottom:1rem; text-align:center; }
.hp-countdown-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:1.5rem; }
.hp-countdown-unit { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:var(--r-md); padding:14px 8px; text-align:center; }
.hp-cd-val { font-family:var(--font-display); font-size:32px; font-weight:900; color:var(--sport-bright); line-height:1; letter-spacing:-1px; }
.hp-cd-lbl { font-size:9px; font-weight:600; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,.25); margin-top:5px; }
.hp-divider { height:1px; background:rgba(255,255,255,.06); margin:1.25rem 0; }
.hp-features { display:flex; flex-direction:column; gap:10px; }
.hp-feature { display:flex; align-items:center; gap:10px; }
.hp-feature-icon { width:32px; height:32px; border-radius:var(--r-sm); background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; }
.hp-feature-text { font-size:13px; color:rgba(255,255,255,.5); line-height:1.4; }
.hp-feature-text strong { color:rgba(255,255,255,.8); font-weight:500; }
.hp-footer { padding:12px 18px; border-top:1px solid rgba(255,255,255,.06); background:rgba(0,0,0,.2); display:flex; align-items:center; justify-content:space-between; }
.hp-footer-txt { font-size:10px; color:rgba(255,255,255,.2); display:flex; align-items:center; gap:4px; }
.hp-footer-txt::before { content:''; width:4px; height:4px; border-radius:50%; background:var(--sport-bright); }
.hp-footer-link { font-size:11px; font-weight:600; color:var(--sport-bright); }
.hp-footer-link:hover { opacity:.75; }
.scroll-cue { position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:6px; color:rgba(255,255,255,.18); font-size:9px; letter-spacing:2px; text-transform:uppercase; animation:riseIn 1s .7s ease both; pointer-events:none; }
.scroll-arr { width:16px; height:16px; border-right:1.5px solid rgba(255,255,255,.18); border-bottom:1.5px solid rgba(255,255,255,.18); transform:rotate(45deg); animation:bounce 1.8s ease-in-out infinite; }

/* COUNTDOWN STRIP */
.countdown-strip { background:var(--sport); padding:1.25rem 1rem; }
.countdown-strip-inner { max-width:1300px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:.5rem; text-align:center; }
@media(min-width:640px){ .countdown-strip-inner{flex-direction:row;justify-content:center;gap:2rem;text-align:left} }
.cs-label { font-family:var(--font-display); font-size:14px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.6); }
.cs-countdown { display:flex; gap:1rem; align-items:center; }
.cs-unit { text-align:center; }
.cs-val { font-family:var(--font-display); font-size:28px; font-weight:900; color:#fff; line-height:1; letter-spacing:-1px; }
.cs-lbl { font-size:9px; font-weight:600; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,.45); margin-top:2px; }
.cs-sep { font-family:var(--font-display); font-size:24px; font-weight:900; color:rgba(255,255,255,.3); margin-top:-8px; }

/* ALGORITHM SECTION */
.algo-sec { background:var(--dark2); padding:5rem 1rem; position:relative; overflow:hidden; }
@media(min-width:1024px){ .algo-sec{padding:6rem 2rem} }
.algo-sec::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px); background-size:56px 56px; pointer-events:none; }
.algo-inner { max-width:1300px; margin:0 auto; position:relative; z-index:1; }
.algo-header { display:grid; grid-template-columns:1fr; gap:2.5rem; margin-bottom:3.5rem; }
@media(min-width:768px){ .algo-header{grid-template-columns:1fr 1fr;gap:5rem;align-items:start} }
.algo-eyebrow { font-size:10px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--sport-bright); margin-bottom:.65rem; }
.algo-title { font-family:var(--font-display); font-size:clamp(38px,6vw,62px); font-weight:900; color:#fff; text-transform:uppercase; letter-spacing:-1.5px; line-height:.9; }
.algo-title em { color:var(--sport-bright); font-style:italic; display:block; }
.algo-desc { font-size:15px; color:rgba(255,255,255,.35); line-height:1.75; font-weight:300; margin-bottom:1rem; }
.algo-stats-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
@media(min-width:480px){ .algo-stats-grid{grid-template-columns:repeat(4,1fr)} }
.algo-stat { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); border-radius:var(--r-md); padding:.9rem 1rem; text-align:center; }
.algo-stat-val { font-family:var(--font-display); font-size:26px; font-weight:900; color:var(--sport-bright); line-height:1; }
.algo-stat-lbl { font-size:9px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; color:rgba(255,255,255,.25); margin-top:4px; }
.algo-groups { display:grid; grid-template-columns:1fr; gap:14px; }
@media(min-width:600px){ .algo-groups{grid-template-columns:1fr 1fr} }
@media(min-width:1100px){ .algo-groups{grid-template-columns:repeat(4,1fr)} }
.algo-group { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:var(--r-xl); padding:1.5rem; display:flex; flex-direction:column; gap:.9rem; transition:transform .2s,border-color .2s; position:relative; overflow:hidden; }
.algo-group::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--sport-b); border-radius:var(--r-xl) var(--r-xl) 0 0; }
.algo-group:hover { transform:translateY(-3px); border-color:rgba(255,255,255,.12); }
.algo-group-icon { font-size:22px; }
.algo-group-name { font-family:var(--font-display); font-size:18px; font-weight:800; color:#fff; text-transform:uppercase; letter-spacing:.3px; line-height:1.1; }
.algo-group-desc { font-size:12px; color:rgba(255,255,255,.35); line-height:1.6; flex:1; }
.algo-group-signals { display:flex; flex-wrap:wrap; gap:5px; }
.algo-footer { margin-top:2.5rem; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:var(--r-xl); padding:2rem; display:flex; flex-direction:column; gap:1.5rem; align-items:flex-start; }
@media(min-width:640px){ .algo-footer{flex-direction:row;align-items:center;gap:3rem} }
.af-title { font-family:var(--font-display); font-size:22px; font-weight:800; color:#fff; text-transform:uppercase; letter-spacing:.3px; margin-bottom:.35rem; }
.af-sub { font-size:13px; color:rgba(255,255,255,.32); line-height:1.6; max-width:560px; }

/* FEATURES */
.features-sec { padding:4rem 1rem; background:var(--paper); }
@media(min-width:1024px){ .features-sec{padding:5rem 2rem} }
.features-inner { max-width:1300px; margin:0 auto; }
.features-header { margin-bottom:2.5rem; }
.features-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:480px){ .features-grid{grid-template-columns:1fr 1fr} }
@media(min-width:900px){ .features-grid{grid-template-columns:repeat(3,1fr)} }
@media(min-width:1100px){ .features-grid{grid-template-columns:repeat(4,1fr)} }

/* NETWORK */
.network-sec { background:var(--ink); padding:4rem 1rem; }
@media(min-width:1024px){ .network-sec{padding:5rem 2rem} }
.network-inner { max-width:1300px; margin:0 auto; }
.network-header { margin-bottom:2.5rem; }
.network-header .section-eyebrow { color:rgba(255,255,255,.35); }
.network-header .section-title { color:#fff; }
.network-header .section-body { color:rgba(255,255,255,.38); font-weight:300; }
.network-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:480px){ .network-grid{grid-template-columns:1fr 1fr} }
@media(min-width:900px){ .network-grid{grid-template-columns:repeat(4,1fr)} }
.network-card-dark { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:var(--r-lg); padding:1.5rem; transition:transform .2s,border-color .2s; display:block; color:inherit; }
.network-card-dark:hover { transform:translateY(-3px); border-color:rgba(255,255,255,.14); }
.network-card-dark.current { border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.06); }
.ncd-sport { font-family:var(--font-display); font-size:24px; font-weight:900; text-transform:uppercase; letter-spacing:.8px; margin-bottom:4px; }
.ncd-domain { font-family:var(--font-mono); font-size:10px; color:rgba(255,255,255,.25); margin-bottom:10px; }
.ncd-badge { font-size:9px; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:3px 9px; border-radius:99px; display:inline-block; margin-bottom:.85rem; }
.ncd-live { background:rgba(74,222,128,.12); color:#4ade80; }
.ncd-beta { background:rgba(255,255,255,.1); color:rgba(255,255,255,.7); }
.ncd-soon { background:rgba(255,255,255,.06); color:rgba(255,255,255,.3); }
.ncd-desc { font-size:12px; color:rgba(255,255,255,.32); line-height:1.6; margin-bottom:1rem; }
.ncd-link { font-size:11px; font-weight:600; color:var(--sport-bright); display:inline-flex; align-items:center; gap:4px; transition:gap .15s; }
.network-card-dark:hover .ncd-link { gap:8px; }
