/* Apneural — light system. Same class vocabulary as the dark build, inverted:
   white ground with blue-tinted neutrals, glass as white-over-tint with soft
   shadow, and a deep blue / deep teal pair that both clear WCAG AA on paper. */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600&family=Poppins:wght@500;600;700&display=swap');

:root{
 --void:#FFFFFF;
 --void-2:#EDF2F8;
 --card:#F4F7FB;
 --card-2:#E9EFF6;
 --void-3:#FFFFFF;
 --glass:rgba(255,255,255,0.78);
 --glass-2:rgba(255,255,255,0.94);
 --edge:#E4EBF3;
 --edge-2:#C9D7E6;
 --text:#0B1520;
 --text-2:#4A5A6C;
 --text-3:#6B7B8E;
 --blue:#0B63D6;
 --blue-deep:#084BA4;
 --blue-soft:#EAF2FD;
 --teal:#0A4FA8;
 --teal-soft:#E8EFFA;
 --amber:#8A5200;
 --amber-soft:#FBF0E0;
 --text-1:#0B1520;
 --sans:'Instrument Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
 --display:'Poppins',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
 --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,monospace;
 --shadow-sm:0 1px 2px rgba(11,21,32,0.04),0 4px 14px -6px rgba(11,21,32,0.07);
 --shadow-md:0 2px 4px rgba(11,21,32,0.03),0 18px 40px -18px rgba(11,21,32,0.16);
 --shadow-lg:0 30px 70px -30px rgba(11,21,32,0.24);
 --page:1240px;
 --gut:44px;
 --sec-y:104px;
}

*{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--void);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.6;text-wrap:pretty}
img{max-width:100%}
a{color:var(--blue);text-underline-offset:3px}
a:hover{color:var(--blue-deep)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:3px}
::selection{background:rgba(11,99,214,0.14)}

.wrap{max-width:var(--page);margin:0 auto;padding:0 var(--gut)}

/* Soft ambient tint, fixed behind everything. Light and barely-there. */
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none}
.aurora::before,.aurora::after{content:"";position:absolute;border-radius:50%;filter:blur(130px)}
.aurora::before{width:56vw;height:56vw;top:-18vw;left:-10vw;background:radial-gradient(circle,rgba(11,99,214,0.13),transparent 68%)}
.aurora::after{width:46vw;height:46vw;top:38vh;right:-14vw;background:radial-gradient(circle,rgba(14,124,116,0.10),transparent 68%)}
.page{position:relative;z-index:1}

.label{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;letter-spacing:0.01em;color:var(--teal)}
.label::before{content:"";width:16px;height:1px;background:var(--teal);opacity:0.55}

.h1{font-family:var(--display);font-weight:600;font-size:clamp(45px,6.7vw,100px);line-height:1;letter-spacing:-0.03em;margin:0}
.h2{font-family:var(--display);font-weight:600;font-size:clamp(31px,4.3vw,58px);line-height:1.07;letter-spacing:-0.026em;margin:0}
.h3{font-family:var(--display);font-weight:600;font-size:clamp(20px,2vw,27px);line-height:1.24;letter-spacing:-0.017em;margin:0}
.grad{color:var(--blue)}
.lede{font-size:clamp(17.5px,1.4vw,20px);line-height:1.58;color:var(--text-2);margin:0;max-width:60ch}
.body{font-size:16.5px;line-height:1.66;color:var(--text-2);margin:0;max-width:64ch}
.small{font-size:14px;line-height:1.6;color:var(--text-3);margin:0}
.tnum{font-variant-numeric:tabular-nums}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-weight:600;font-size:15px;line-height:1;padding:16px 26px;border-radius:8px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform 260ms cubic-bezier(.2,.8,.2,1),box-shadow 260ms,border-color 260ms,background 260ms,color 260ms}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 10px 26px -12px rgba(11,99,214,0.7)}
.btn-primary:hover{background:var(--blue-deep);color:#fff;transform:translateY(-2px);box-shadow:0 18px 40px -14px rgba(11,99,214,0.6)}
.btn-ghost{background:#fff;color:var(--text);border-color:var(--edge-2)}
.btn-ghost:hover{color:var(--blue);border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow-sm)}

.glass{background:var(--card);border:1px solid var(--edge);border-radius:10px;box-shadow:var(--shadow-sm)}

.sec{position:relative;padding:var(--sec-y) 0}
.sec-sm{position:relative;padding:calc(var(--sec-y) * .62) 0}
.sec-tint{background:var(--void-2);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.sec-head{max-width:780px;margin-bottom:46px}
.sec-head .h2{margin-top:0}
.sec-head .lede{margin-top:20px}

/* GSAP owns these; .no-motion (set on <html> in markup) neutralises every
   start state, and is removed only once GSAP is confirmed loaded. */
.fx{opacity:0;transform:translateY(30px)}
.fx-word{display:inline-block;opacity:0;transform:translateY(0.5em)}
html.no-motion .fx,html.no-motion .fx-word{opacity:1!important;transform:none!important}

@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .fx,.fx-word{opacity:1!important;transform:none!important}
 *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* One rhythm for the whole page. A tint band carries borders, so it earns the
   full gap on both sides. Two plain sections in a row share a shorter seam
   rather than stacking into a 200px trench — but never zero: a heading jammed
   against the band above it was the old failure. */
.sec:not(.sec-tint) + .sec:not(.sec-tint),
.sec:not(.sec-tint) + .sec-sm:not(.sec-tint),
.sec-sm:not(.sec-tint) + .sec:not(.sec-tint),
.sec-sm:not(.sec-tint) + .sec-sm:not(.sec-tint){padding-top:calc(var(--sec-y) * .5)}
/* The founders ticker is its own band; the section under it starts clean. */
.founders-band + .sec{padding-top:var(--sec-y)}

@media(max-width:900px){:root{--gut:22px;--sec-y:68px}body{font-size:16px}}