:root{
  --ground:#0A1628; --ground2:#13243E; --deep:#070F1E; --cream:#F2EFE5; --cream2:#ECE6D8;
  --paper:#F6F3EC; --ink:#181410; --ink2:#46413A; --muted:#8C867B; --line:rgba(24,20,16,0.12);
  --red:#C8302C; --red2:#B22A26; --gold:#B8923E; --gold2:#C9A86A;
  --cl:rgba(242,239,229,0.66); --cl2:rgba(242,239,229,0.42); --clline:rgba(242,239,229,0.14);
  --serif:'Instrument Serif',Georgia,serif; --sans:'Inter Tight',system-ui,sans-serif; --mono:'JetBrains Mono',monospace;
  --max:1280px; --gut:clamp(1.25rem,4vw,2.8rem);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.6;font-size:16px;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.serif{font-family:var(--serif);font-weight:400;line-height:1.04;letter-spacing:.2px}
.serif em,em.s{font-style:italic}
.mono{font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em;font-size:11px}
.eyebrow{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--red)}
.eyebrow::before{content:"[ "}.eyebrow::after{content:" ]"}
.red{color:var(--red)} .gold{color:var(--gold)}
h1{font-family:var(--serif);font-weight:400;line-height:1.0;letter-spacing:-.5px}
h2{font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.3px}
h3{font-family:var(--serif);font-weight:400}
.sec{padding:clamp(4rem,8vw,7.5rem) 0}
.lede{font-size:clamp(1rem,1.4vw,1.18rem);color:var(--ink2);max-width:62ch;line-height:1.65}

/* ticker */
.ticker{background:var(--deep);color:var(--cl);font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:8px var(--gut);display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}
.ticker .d{width:6px;height:6px;border-radius:50%;background:var(--red);display:inline-block}
.ticker b{color:var(--cream);font-weight:500}.ticker .sep{opacity:.4}
@media(max-width:680px){.ticker .hide{display:none}}

/* nav */
.nav{position:sticky;top:0;z-index:80;background:rgba(246,243,236,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav.dark{background:rgba(10,22,40,.82);border-bottom-color:var(--clline)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:18px;color:var(--ink)}
.nav.dark .brand{color:var(--cream)}
.sq{width:23px;height:23px;border-radius:5px;background:var(--red);display:inline-block}
.brand span{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--muted)}
.nav.dark .brand span{color:var(--cl)}
.navlinks{display:flex;align-items:center;gap:22px;font-size:14px}
.navlinks a.l{color:var(--ink2);font-weight:500;transition:color .15s;position:relative}
.nav.dark .navlinks a.l{color:var(--cl)}
.navlinks a.l:hover,.navlinks a.l.active{color:var(--red)}
.navlinks a.l.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--red)}
.btn{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-weight:600;font-size:13.5px;padding:9px 18px;border-radius:999px;transition:all .18s;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.btn-line{border-color:var(--ink);color:var(--ink)} .btn-line:hover{background:var(--ink);color:var(--cream)}
.nav.dark .btn-line{border-color:var(--clline);color:var(--cream)} .nav.dark .btn-line:hover{background:var(--cream);color:var(--ground)}
.btn-red{background:var(--red);color:var(--cream)} .btn-red:hover{background:var(--red2)}
.btn-ghost{border-color:var(--clline);color:var(--cream)} .btn-ghost:hover{background:rgba(242,239,229,.07)}
.navtoggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.navtoggle span{width:22px;height:2px;background:currentColor;color:var(--ink);display:block}
.nav.dark .navtoggle span{color:var(--cream)}
.mobile{display:none;flex-direction:column;gap:2px;padding:10px var(--gut) 18px;background:var(--paper);border-bottom:1px solid var(--line)}
.mobile a{padding:11px 0;font-size:15px;border-bottom:1px solid var(--line);color:var(--ink)}
@media(max-width:940px){.navlinks{display:none}.navtoggle{display:flex}.mobile.open{display:flex}}

/* hero */
.hero{background:var(--ground);color:var(--cream);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:0;background:
  radial-gradient(ellipse 46% 40% at 14% 20%,rgba(200,48,44,.16),transparent 60%),
  radial-gradient(ellipse 50% 42% at 88% 82%,rgba(184,146,62,.11),transparent 62%),
  repeating-linear-gradient(0deg,rgba(242,239,229,.02) 0 1px,transparent 1px 88px),
  repeating-linear-gradient(90deg,rgba(242,239,229,.02) 0 1px,transparent 1px 88px)}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;padding:clamp(3.4rem,7vw,6rem) 0}
.hero h1{font-size:clamp(2.5rem,5.6vw,4.7rem);color:var(--cream);max-width:17ch;margin-bottom:1.5rem}
.hero h1 em{color:var(--gold2)}
.hero .lede{color:var(--cl);max-width:50ch;margin-bottom:1.9rem}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-sub{margin-top:1.8rem;display:flex;gap:22px;flex-wrap:wrap;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--cl2)}
@media(max-width:880px){.hero-in{grid-template-columns:1fr}.heroviz{order:-1;min-height:230px}}

/* media / duotone */
.media{position:relative;overflow:hidden;border-radius:14px;background:var(--ground2)}
.media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(.85)}
.media::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(10,22,40,.72),rgba(178,42,38,.40))}
.media .cap{position:absolute;left:14px;bottom:12px;z-index:2;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--cl)}
.media.tall{aspect-ratio:3/4}.media.wide{aspect-ratio:16/9}.media.sq{aspect-ratio:1/1}

/* hero schematic (sport-data art) */
.heroviz{position:relative;aspect-ratio:1/1;border:1px solid var(--clline);border-radius:16px;background:rgba(7,15,30,.5);overflow:hidden}
.heroviz .gl{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(242,239,229,.04) 0 1px,transparent 1px 34px),repeating-linear-gradient(90deg,rgba(242,239,229,.04) 0 1px,transparent 1px 34px)}
.heroviz .ring{position:absolute;left:50%;top:50%;width:46%;aspect-ratio:1;border:1.5px solid rgba(200,48,44,.5);border-radius:50%;transform:translate(-50%,-50%)}
.heroviz .ring.s{width:24%;border-color:rgba(201,168,106,.6)}
.heroviz .tg{position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;background:var(--red);transform:translate(-50%,-50%)}
.heroviz .lab{position:absolute;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--cl2)}
.chip{position:absolute;display:flex;align-items:center;gap:7px;background:rgba(10,22,40,.8);border:1px solid var(--clline);border-radius:7px;padding:7px 10px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--cl)}
.chip .dd{width:5px;height:5px;border-radius:50%;background:var(--red)}.chip.g .dd{background:var(--gold2)}.chip b{color:var(--cream);font-weight:500}

/* marquee */
.marq{background:var(--deep);color:var(--cl2);border-top:1px solid var(--clline);border-bottom:1px solid var(--clline);overflow:hidden;padding:16px 0}
.marq-t{display:flex;gap:50px;white-space:nowrap;font-family:var(--serif);font-size:24px;animation:scroll 40s linear infinite;width:max-content}
.marq-t .x{color:var(--red);opacity:.85}.marq-t span{opacity:.5}
@keyframes scroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marq-t{animation:none}}

/* section head */
.shead{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:end;margin-bottom:clamp(2rem,4vw,3.2rem)}
.shead .num{font-family:var(--mono);font-size:12px;color:var(--muted);margin-right:10px}
.shead h2{font-size:clamp(1.9rem,3.6vw,3rem);margin-top:.6rem;max-width:20ch}
.shead p{color:var(--ink2);max-width:44ch;font-size:15px}
.dark .shead h2{color:var(--cream)}.dark .shead p{color:var(--cl)}.dark .shead .num{color:var(--cl2)}.dark .eyebrow{color:var(--gold2)}
.center{text-align:center;max-width:46rem;margin:0 auto}

/* dark band */
.dark{background:var(--ground);color:var(--cream);position:relative;overflow:hidden}
.dark::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 40% at 84% 24%,rgba(184,146,62,.07),transparent 60%),repeating-linear-gradient(0deg,rgba(242,239,229,.016) 0 1px,transparent 1px 96px),repeating-linear-gradient(90deg,rgba(242,239,229,.016) 0 1px,transparent 1px 96px);pointer-events:none}
.dark .wrap{position:relative;z-index:2}

/* grids + cards */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.6rem)}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,1.6vw,1.4rem)}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.9rem,1.4vw,1.2rem)}
@media(max-width:900px){.g3,.g4{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:clamp(1.3rem,2vw,1.9rem);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(24,20,16,.08)}
.card .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.card.g .k{color:var(--gold)}
.card h3{font-size:1.55rem;margin-bottom:.55rem;color:var(--ground)}
.card h3 em{font-style:italic;color:var(--red)}.card.g h3 em{color:var(--gold)}
.card p{font-size:14px;color:var(--ink2);flex-grow:1}
.card .list{border-top:1px solid var(--line);margin-top:1rem;font-size:13.5px}
.card .list div{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.card .list div:last-child{border-bottom:none}
.card .list .r{color:var(--muted);font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.card .more{margin-top:1rem;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}

/* audience cards (image) */
.acard{position:relative;border-radius:16px;overflow:hidden;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--cream);background:var(--ground)}
.acard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.7) contrast(1.05);z-index:0}
.acard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,40,.2),rgba(10,22,40,.92));z-index:1}
.acard .ac{position:relative;z-index:2;padding:1.5rem}
.acard .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);margin-bottom:8px}
.acard h3{font-size:1.7rem;margin-bottom:.4rem}
.acard p{font-size:13.5px;color:var(--cl)}
.acard .go{margin-top:.8rem;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--red2)}
.acard:hover img{transform:scale(1.04)}.acard img{transition:transform .4s}

/* stat row */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.6rem)}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}}
.stat{border-top:2px solid var(--red);padding-top:12px}
.stat .n{font-family:var(--serif);font-size:clamp(2.2rem,3.4vw,3rem);color:var(--ground);line-height:1}
.dark .stat .n{color:var(--cream)} .stat .n em{font-style:italic;color:var(--red)}
.stat .l{font-size:12.5px;color:var(--ink2);margin-top:8px}.dark .stat .l{color:var(--cl)}

/* problem/solution rows */
.ps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.5rem)}
@media(max-width:760px){.ps{grid-template-columns:1fr}}
.ps .b{background:#fff;border:1px solid var(--line);border-radius:13px;padding:1.5rem}
.ps .b.prob{border-left:3px solid var(--muted)}
.ps .b.sol{border-left:3px solid var(--red)}
.ps .b .t{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.ps .b.sol .t{color:var(--red)}
.ps .b h4{font-family:var(--serif);font-size:1.3rem;color:var(--ground);margin-bottom:.5rem}
.ps .b p{font-size:13.5px;color:var(--ink2)}
.ps .b ul{list-style:none;margin-top:.7rem;font-size:13.5px}
.ps .b li{padding:7px 0;border-top:1px solid var(--line);color:var(--ink2);display:flex;gap:9px}
.ps .b li::before{content:"—";color:var(--red)}

/* callout */
.callout{background:var(--cream2);border-left:4px solid var(--red);border-radius:12px;padding:clamp(1.4rem,2.4vw,2rem)}
.callout .ql{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.callout p{font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--ground);line-height:1.4}
.callout p b{font-style:normal;font-weight:400;color:var(--red)}

/* data panel */
.panel{background:rgba(7,15,30,.6);border:1px solid var(--clline);border-radius:14px;padding:18px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.panel .bar{display:flex;justify-content:space-between;border-bottom:1px solid var(--clline);padding-bottom:11px;margin-bottom:14px}
.panel .bar .t{font-family:var(--serif);font-size:1.1rem;color:var(--cream)}
.panel .tag{font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--cl2);border:1px solid var(--clline);border-radius:4px;padding:3px 7px}
.row{display:flex;align-items:center;gap:10px;margin:9px 0}
.row .lab{width:108px;font-size:11px;color:var(--cl);font-family:var(--mono);text-transform:uppercase;letter-spacing:.04em}
.row .track{flex:1;height:8px;background:rgba(242,239,229,.08);border-radius:5px;overflow:hidden}
.row .fill{height:100%;border-radius:5px;background:linear-gradient(90deg,var(--red),#e0807d)}.row .fill.g{background:linear-gradient(90deg,var(--gold),var(--gold2))}
.row .v{width:54px;text-align:right;font-family:var(--mono);font-size:11px;color:var(--cream)}
.vchips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.vchip{font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:20px;border:1px solid var(--clline);color:var(--cl)}
.vchip.ok{color:#7CC598;border-color:rgba(124,197,152,.4)}.vchip.es{color:var(--gold2);border-color:rgba(201,168,106,.4)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,1.5vw,1.3rem)}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{border-top:2px solid var(--red);padding-top:14px}.step.g{border-color:var(--gold)}
.step .k{font-family:var(--mono);font-size:11px;color:var(--red);margin-bottom:8px}.step.g .k{color:var(--gold2)}
.step h3{font-size:1.6rem;margin-bottom:.4rem}.dark .step h3{color:var(--cream)}
.step p{font-size:13.5px;color:var(--ink2)}.dark .step p{color:var(--cl)}

/* CTA strip */
.cta-strip{text-align:center}
.cta-strip h2{font-size:clamp(2rem,3.6vw,3rem);color:var(--ground);margin:1rem 0}.cta-strip h2 em{font-style:italic;color:var(--red)}
.dark .cta-strip h2{color:var(--cream)}
.cta-strip p{color:var(--ink2);max-width:48ch;margin:0 auto 1.6rem}.dark .cta-strip p{color:var(--cl)}

/* pagehero (interior pages) */
.phero{background:var(--ground);color:var(--cream);position:relative;overflow:hidden}
.phero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 50% at 80% 30%,rgba(200,48,44,.16),transparent 60%),repeating-linear-gradient(90deg,rgba(242,239,229,.02) 0 1px,transparent 1px 88px);pointer-events:none}
.phero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.5rem);align-items:center;padding:clamp(3rem,6vw,5rem) 0}
.phero h1{font-size:clamp(2.4rem,5vw,4rem);color:var(--cream);max-width:15ch;margin:1rem 0}
.phero h1 em{color:var(--gold2)}
.phero .lede{color:var(--cl);max-width:48ch}
@media(max-width:880px){.phero-in{grid-template-columns:1fr}}

/* footer */
.foot{background:var(--ground);color:var(--cream);position:relative;overflow:hidden;padding:clamp(3.5rem,6vw,5rem) 0 2.2rem}
.foot::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 40% at 18% 20%,rgba(200,48,44,.06),transparent 60%);pointer-events:none}
.foot-grid{position:relative;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;padding-bottom:2.4rem;border-bottom:1px solid var(--clline)}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}
.foot h4{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--cl2);margin-bottom:14px}
.foot a.fl{display:block;padding:5px 0;font-size:13.5px;color:var(--cl)}.foot a.fl:hover{color:var(--gold2)}
.foot .tag{font-family:var(--serif);font-size:1.5rem;line-height:1.3;color:var(--cream);max-width:30ch;margin-top:1.1rem}.foot .tag em{font-style:italic;color:var(--gold2)}
.legal{position:relative;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--cl2);line-height:2;padding-top:1.6rem;text-transform:uppercase}

html.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
html.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.media img,.acard img{transition:none}}

/* ===== v14: svg art + signature band ===== */
.acard{background:linear-gradient(160deg,#0d1c34,#0a1628)}
.acard .art{position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;opacity:.5}
.acard .art svg{width:82%;height:82%}
.acard::after{background:linear-gradient(180deg,rgba(10,22,40,.25),rgba(10,22,40,.9))}
.artpanel{position:relative;aspect-ratio:1;border:1px solid var(--clline);border-radius:16px;background:rgba(7,15,30,.55);display:flex;align-items:center;justify-content:center;overflow:hidden}
.artpanel svg{position:relative;z-index:2;width:84%;height:84%}
.artpanel::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 70% 30%,rgba(200,48,44,.14),transparent 60%)}
.sig{background:var(--ground);color:var(--cream);position:relative;overflow:hidden;text-align:center}
.sig::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 50% 0%,rgba(200,48,44,.12),transparent 60%),repeating-linear-gradient(90deg,rgba(242,239,229,.02) 0 1px,transparent 1px 90px);pointer-events:none}
.sig .wrap{position:relative;z-index:2}
.sig .se{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold2);margin-bottom:1.1rem}
.sig h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,6vw,4.6rem);line-height:1;color:var(--cream)}
.sig h2 em{font-style:italic;color:var(--gold2)}
.sig .verbs{display:flex;justify-content:center;gap:clamp(1.4rem,4vw,3.6rem);margin-top:2.4rem;flex-wrap:wrap;text-align:left}
.sig .verb{max-width:23ch;border-top:2px solid var(--red);padding-top:12px}
.sig .verb .vk{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.sig .verb h3{font-family:var(--serif);font-size:1.5rem;color:var(--cream);margin-bottom:.3rem}
.sig .verb p{font-size:13.5px;color:var(--cl)}

/* client login button in header */
.btn-login{border-color:var(--gold2);color:var(--cream);background:rgba(201,168,106,.12)}
.btn-login:hover{background:var(--gold2);color:var(--ground);border-color:var(--gold2)}
.nav .navlinks{gap:18px}