:root{--cobalt:#1B2AE6;--deep:#0B1480;--violet:#8A3FFF;--teal:#27C7BE;--cyan:#19D3FF;--navy:#0B1033;--grad:linear-gradient(60deg,#1B2AE6 0%,#5A46F5 55%,#A03BFF 100%);--gline:linear-gradient(90deg,#19D3FF,#1B2AE6,#A03BFF);--shadow-c:0 24px 64px -20px rgba(38,64,255,.35);--paper:#F2F3F7;--ink:#0F1020;--mute:#5B5E72;--line:rgba(15,16,32,.14);--green:#12A15F;--green-soft:#DDF5E8;--white:#FBFBFD;--pad:clamp(20px,3.4vw,52px);--gutter:max(var(--pad),calc((100vw - 1360px) / 2))}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
html.lenis{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;font-variation-settings:"opsz" 14,"wdth" 100;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:6px}
/* above the fixed header (z-index 2147483000), or a focused skip link sits under the logo */
.skip{position:fixed;left:-9999px;top:8px;z-index:2147483647;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px}
.skip:focus{left:8px}
.mono{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.it{font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;letter-spacing:-.02em}
.disp{font-variation-settings:"opsz" 96,"wdth" 90;font-weight:700;letter-spacing:-.045em;line-height:.9}
.mask{display:block;overflow:hidden}
.mask>span{display:block;will-change:transform}
.wrap{max-width:1360px;margin:0 auto}
.prose p{font-size:clamp(17px,1.35vw,20px);line-height:1.55;max-width:60ch}
.prose p+p{margin-top:1em}
.eyebrow{display:block;margin-bottom:18px;color:var(--cobalt)}
.eyebrow::after{content:"";display:block;width:52px;height:3px;border-radius:2px;background:var(--gline);margin-top:10px}
.btn-grad{display:inline-flex;align-items:center;gap:12px;text-decoration:none;background:var(--grad);color:#fff;font-family:"Geist Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:16px 24px;border-radius:999px;box-shadow:0 18px 48px -12px rgba(38,64,255,.55);position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.btn-grad::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s ease}
.btn-grad:hover{transform:translateY(-3px);box-shadow:0 26px 60px -14px rgba(38,64,255,.7)}
.btn-grad:hover::after{transform:translateX(120%)}
.btn-grad svg{width:16px;height:16px}

.top{position:fixed;left:0;right:0;top:0;z-index:2147483000;display:flex;align-items:center;justify-content:space-between;padding:18px max(var(--pad),calc((100% - 1360px) / 2));color:var(--white);transition:color .3s,background .3s}
.top.ink{color:var(--ink);background:rgba(242,243,247,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.logo{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:700;font-size:22px;letter-spacing:-.04em;font-variation-settings:"opsz" 24,"wdth" 95}
.dots{display:inline-flex;gap:3px;transform:translateY(3px)}
.dots b{display:block;width:6px;height:6px;border-radius:50%;background:currentColor;animation:typ 1.25s ease-in-out infinite}
.dots b:nth-child(2){animation-delay:.14s}.dots b:nth-child(3){animation-delay:.28s}
@keyframes typ{0%,55%,100%{transform:translateY(0)}28%{transform:translateY(-4px)}}
.nav{display:flex;gap:clamp(12px,1.8vw,26px)}
.nav a{text-decoration:none;opacity:.8;position:relative;padding-bottom:4px}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nav a:hover{opacity:1}
.nav a:hover::after{transform:scaleX(1)}
.top .cta{text-decoration:none;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:#fff;background:var(--grad);padding:11px 16px;border-radius:999px;box-shadow:0 12px 30px -10px rgba(38,64,255,.6);transition:transform .3s,box-shadow .3s}
.top .cta:hover{transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(38,64,255,.75)}

/* HERO WORLD: gradient sky behind a transparent WebGL field */
.hero{position:relative;height:100svh;color:var(--white);overflow:hidden;background:linear-gradient(180deg,var(--deep) 0%,#1526C8 9%,var(--cobalt) 17%,var(--cobalt) 100%)}
.sky{position:absolute;inset:-20% -10% 40% -10%;pointer-events:none;background:radial-gradient(42% 55% at 22% 30%,rgba(106,75,255,.55),transparent 70%),radial-gradient(38% 50% at 78% 22%,rgba(39,199,190,.32),transparent 70%),radial-gradient(60% 40% at 55% 70%,rgba(255,255,255,.08),transparent 70%);filter:blur(30px);animation:sky 26s ease-in-out infinite alternate}
@keyframes sky{0%{transform:translate3d(-3%,0,0) scale(1)}100%{transform:translate3d(4%,3%,0) scale(1.08)}}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.hud{position:absolute;inset:0;pointer-events:none}
.scrim{position:absolute;inset:0;background:radial-gradient(ellipse 66% 78% at 16% 96%,rgba(27,42,230,.92),rgba(27,42,230,0) 72%)}
.t1{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(64px,10vh,120px)}
.t1 .k{display:inline-block;margin-bottom:22px;max-width:44ch;font-size:12px;padding:8px 12px;border-radius:8px;background:rgba(11,20,128,.62)}
.t1 .big{display:block;font-size:clamp(54px,9.4vw,168px);max-width:12ch}
.t1 .it{font-size:1.06em}
.spec{position:absolute;right:var(--gutter);top:clamp(96px,15vh,150px);max-width:300px;text-align:right}
.spec p{font-size:16px;line-height:1.5;font-weight:500;opacity:.92}
.t2{position:absolute;left:var(--gutter);top:clamp(100px,16vh,180px);font-size:clamp(40px,6.6vw,116px);max-width:12ch;opacity:0}
.t3{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(64px,10vh,120px);display:flex;align-items:flex-end;justify-content:space-between;gap:30px;opacity:0}
.t3 h2{font-size:clamp(64px,11vw,200px)}
.t3 .go{pointer-events:auto}
.hint{position:absolute;left:var(--gutter);bottom:22px;opacity:.7;display:flex;align-items:center;gap:10px}
.hint i{display:block;width:34px;height:1px;background:currentColor;animation:hint 1.6s ease-in-out infinite;transform-origin:left}
@keyframes hint{0%{transform:scaleX(0)}60%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:0}}
.cnt{position:absolute;right:var(--gutter);bottom:22px;opacity:.7;font-variant-numeric:tabular-nums}

/* COVERS: what the site is */
.covers{background:linear-gradient(180deg,#EEF3FF 0%,var(--paper) 60%);padding:clamp(80px,10vw,150px) var(--pad) 0;position:relative;overflow:hidden}
.covers::before{content:"";position:absolute;right:-10%;top:-10%;width:60vw;height:60vw;max-width:900px;max-height:900px;border-radius:50%;background:radial-gradient(closest-side,rgba(27,42,230,.09),transparent);pointer-events:none}
.covers .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,5vw,80px);position:relative}
.covers h2{font-size:clamp(34px,4.4vw,72px);max-width:12ch}
.covers h2 em{color:var(--cobalt)}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.pills a{text-decoration:none;font-size:14px;font-weight:550;padding:9px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;transition:transform .3s,border-color .3s,background .3s}
.pills a:hover{transform:translateY(-2px);border-color:var(--cobalt);background:#EEF0FF}
.collage{position:relative;max-width:1360px;margin-left:auto;margin-right:auto;height:clamp(420px,46vw,620px);margin-top:clamp(40px,6vw,90px);perspective:1500px;perspective-origin:50% 40%}
.collage .glow{position:absolute;left:50%;top:55%;width:70%;height:60%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(38,64,255,.28),transparent);filter:blur(30px);pointer-events:none}
.shot{position:absolute;width:clamp(300px,30vw,420px);background:#fff;border-radius:16px;box-shadow:var(--shadow-c),0 2px 0 rgba(15,16,32,.04);padding:18px 20px;transform-style:preserve-3d;will-change:transform;border:1px solid rgba(15,16,32,.06)}
.shot .hd{display:flex;justify-content:space-between;align-items:center;color:var(--mute);margin-bottom:12px}
.shot h3{font-size:20px;font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.03em;line-height:1.1}
.shot p{font-size:14px;line-height:1.5;color:#2F3145;margin-top:8px}
.shot .kpi{display:flex;gap:18px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.shot .kpi b{display:block;font-size:22px;font-variation-settings:"opsz" 32,"wdth" 85;font-weight:750;letter-spacing:-.04em;color:var(--cobalt)}
.shot .kpi span{font-size:11px;color:var(--mute)}
.shot.s1{left:4%;top:8%;--rx:8deg;--ry:14deg;--z:0px}
.shot.s2{left:50%;top:0;margin-left:calc(clamp(300px,30vw,420px) / -2);--rx:6deg;--ry:0deg;--z:60px;z-index:2}
.shot.s3{right:4%;top:14%;--rx:8deg;--ry:-14deg;--z:0px}
.shot{transform:translateY(var(--py,0px)) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(var(--z));animation:float 7s ease-in-out infinite}
.shot.s2{animation-delay:-2.3s}.shot.s3{animation-delay:-4.6s}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -14px}}
.shot .bar{height:8px;border-radius:4px;background:#ECEDF3;margin-top:8px}
.shot .bar.b1{width:70%}.shot .bar.b2{width:92%}.shot .bar.b3{width:55%}
.shot .ok{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--green)}
.shot .ok i{width:7px;height:7px;border-radius:50%;background:var(--green)}

/* NUMBERS: navy band, Digital Silk register */
.numbers{position:relative;color:#fff;background:linear-gradient(130deg,#070B2A 10%,#0F1670 65%,#1B2AE6 130%);padding:clamp(70px,9vw,130px) var(--pad);overflow:hidden}
.numbers::before{content:"";position:absolute;right:-10%;top:-40%;width:50vw;height:50vw;border-radius:50%;background:radial-gradient(closest-side,rgba(25,211,255,.35),transparent);filter:blur(20px)}
.numbers::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--gline)}
.numbers .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(28px,5vw,80px);align-items:center}
.numbers .eyebrow{color:var(--cyan)}
.numbers h2{font-size:clamp(34px,4.4vw,72px);max-width:11ch}
.ngrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden}
.ngrid div{background:rgba(7,11,42,.55);padding:26px 26px 24px}
.ngrid b{display:block;font-variation-settings:"opsz" 96,"wdth" 82;font-weight:800;font-size:clamp(44px,4.6vw,76px);letter-spacing:-.05em;line-height:.9;color:#fff;font-variant-numeric:tabular-nums}
.ngrid span{display:block;margin-top:10px;font-size:14px;line-height:1.45;color:rgba(255,255,255,.8)}

/* SEQUENCE */
.seq{position:relative;background:var(--paper);color:var(--ink)}
.seq-pin{height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.seq-head{padding:0 var(--gutter);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;margin-bottom:clamp(20px,3vh,40px)}
.seq-head h2{font-size:clamp(34px,4.4vw,72px);max-width:15ch}
.seq-head p{font-size:15px;color:var(--mute);margin-top:12px;max-width:44ch;line-height:1.5}
.day{text-align:right;line-height:1;display:grid;justify-items:end;gap:6px}
.day b{display:block;font-variation-settings:"opsz" 96,"wdth" 80;font-weight:800;font-size:clamp(64px,8vw,128px);letter-spacing:-.06em;line-height:.8;font-variant-numeric:tabular-nums}
.day b small{font-size:.38em;font-weight:600;letter-spacing:-.02em;color:var(--mute);margin-left:.15em}
.day .st{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--ink);font-size:11px}
.day .st i{width:7px;height:7px;border-radius:50%;background:var(--cobalt)}
.day .play{border:0;cursor:pointer;padding:12px 18px;font-size:11px;margin-top:4px}
.stage{perspective:1400px;perspective-origin:50% 50%}
.track{display:flex;gap:clamp(16px,2vw,28px);padding:0 var(--gutter);will-change:transform;width:max-content;transform-style:preserve-3d}
.msg{width:clamp(320px,36vw,540px);height:clamp(300px,34vh,340px);flex:none;background:var(--white);border:1px solid var(--line);border-radius:18px;padding:22px 24px 20px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow-c),0 1px 0 rgba(15,16,32,.04);position:relative;will-change:transform;transform-style:preserve-3d}
.msg .hd{display:flex;justify-content:space-between;align-items:center;color:var(--mute)}
.msg .ch{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:600;font-size:14px;letter-spacing:0;text-transform:none;font-family:"Bricolage Grotesque",sans-serif}
.msg .ch svg{width:18px;height:18px}
.msg h3{font-size:clamp(22px,2.1vw,30px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.035em;line-height:1.05}
.msg p{font-size:16px;line-height:1.55;color:#2F3145;max-width:48ch}
.tag{font-family:"Geist Mono",monospace;font-size:13px;background:#ECEDF3;border-radius:5px;padding:1px 6px;color:var(--ink)}
.msg .ft{margin-top:auto;display:flex;justify-content:space-between;color:var(--mute);padding-top:10px;border-top:1px solid var(--line)}
.stamp{position:absolute;right:22px;bottom:58px;font-family:"Geist Mono",monospace;font-size:13px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;border:2px solid #C8320F;color:#C8320F;padding:6px 10px;border-radius:4px;opacity:0;transform:rotate(-9deg) scale(1.8);transition:opacity .28s,transform .38s cubic-bezier(.2,1.2,.3,1)}
.stamp.ok{border-color:var(--green);color:var(--green)}
.stamp.on{opacity:1;transform:rotate(-9deg) scale(1)}
.msg.reply{padding:0;border:0;background:transparent;box-shadow:none}
.msg.reply .face{position:absolute;inset:0;border-radius:18px;padding:22px 24px 20px;display:flex;flex-direction:column;gap:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.msg.reply .flipper{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.msg.reply .flipper.on{transform:rotateY(180deg)}
.msg.reply .front{background:var(--white);border:1px solid var(--line);color:var(--ink)}
.who{display:flex;align-items:center;gap:12px}
.who .pfp{width:40px;height:40px;border-radius:50%;background:#D5D7E4}
.who b{display:block;font-size:15px}
.who span{font-size:13px;color:var(--mute)}
.bubble{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:12px;background:#EEF0FF;color:var(--cobalt);padding:14px 18px;border-radius:18px 18px 18px 4px}
.bubble .dots b{width:9px;height:9px;background:var(--cobalt)}
.bubble span{font-size:14px;font-weight:550}
.msg.reply .back{transform:rotateY(180deg);background:var(--green-soft);border:1px solid #BFE8D2;color:var(--ink)}
.msg.reply .back .ch{color:var(--green)}
.msg.reply .back .ft{border-color:#BFE8D2;color:var(--green)}
.ruler{margin:clamp(20px,3vh,40px) var(--gutter) 0;position:relative;height:1px;background:var(--line)}
.ruler i{position:absolute;left:0;top:0;height:1px;width:0;background:var(--ink)}
.ruler span{position:absolute;top:10px;transform:translateX(-50%);color:var(--mute)}
.ruler span::before{content:"";position:absolute;left:50%;top:-14px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:var(--paper);border:1px solid var(--ink)}
.ruler span:last-child::before{background:var(--green);border-color:var(--green)}

/* STEPS: LinkedIn lead generation, step by step (a real sequence, so it is numbered) */
.steps{background:var(--paper);padding:clamp(60px,8vw,120px) var(--pad) clamp(80px,10vw,150px)}
.steps .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(28px,5vw,80px)}
.steps .lhs{position:sticky;top:110px;align-self:start}
.steps h2{font-size:clamp(34px,4.4vw,72px);max-width:10ch}
.steps .lhs p{margin-top:18px;font-size:17px;line-height:1.55;color:#2F3145;max-width:40ch}
.stepl{list-style:none;border-top:1px solid var(--line)}
.stepl li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:20px;padding:26px 0;border-bottom:1px solid var(--line);opacity:.7;transition:opacity .4s}
.stepl li.on{opacity:1}
.stepl .n{font-variation-settings:"opsz" 96,"wdth" 80;font-weight:800;font-size:44px;letter-spacing:-.05em;line-height:.9;color:var(--cobalt)}
.stepl h3{font-size:clamp(20px,1.8vw,28px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.03em;line-height:1.1}
.stepl p{margin-top:10px;font-size:16px;line-height:1.55;color:#2F3145;max-width:56ch}

/* GLOSSARY TYPED */
.gloss{background:var(--ink);color:var(--white);position:relative}
.gloss .intro{padding:clamp(70px,10vh,120px) var(--gutter) clamp(40px,6vh,80px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:end}
.gloss .intro h2{font-size:clamp(34px,4.4vw,72px);max-width:13ch}
.gloss .intro h2::before{content:"";display:block;width:52px;height:3px;border-radius:2px;background:var(--gline);margin-bottom:22px}
.gloss .intro p{font-size:17px;line-height:1.55;opacity:.78;max-width:46ch;justify-self:end}
.term{position:sticky;top:0;height:100svh;margin-bottom:45svh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);padding:0 var(--gutter);align-content:center;align-items:center;--wd:75;background:radial-gradient(70% 60% at 20% 80%,rgba(106,75,255,.16),transparent 70%),var(--ink);box-shadow:0 -40px 80px -40px rgba(0,0,0,.6)}
.term:nth-of-type(2n){background:radial-gradient(70% 60% at 80% 20%,rgba(39,199,190,.12),transparent 70%),#151634}
.term:last-of-type{margin-bottom:0}
.term .w{font-size:clamp(80px,12.5vw,236px);font-variation-settings:"opsz" 96,"wdth" var(--wd);font-weight:800;letter-spacing:-.06em;line-height:.82}
.term .w small{display:block;font-size:clamp(14px,1.3vw,20px);font-weight:500;letter-spacing:0;font-variation-settings:"opsz" 20,"wdth" 100;margin-top:22px;opacity:.6}
.term .d p{font-size:clamp(22px,2.3vw,36px);line-height:1.28;letter-spacing:-.02em;font-weight:400;max-width:34ch}
.term .d .c{opacity:.14}
.term .d .c.on{opacity:1}
.term .d .mono{display:block;margin-bottom:22px;color:rgba(251,251,253,.55)}
.term .d a{display:inline-block;margin-top:28px;text-decoration:none;border-bottom:1px solid rgba(251,251,253,.4);padding-bottom:3px;font-weight:500}
.wall{position:relative;background:var(--ink);color:var(--white);padding:clamp(60px,8vw,120px) var(--gutter);border-top:1px solid rgba(251,251,253,.12)}
.wall h2{font-size:clamp(30px,3.6vw,56px);max-width:16ch}
.wall .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(251,251,253,.12);margin-top:clamp(28px,4vw,56px);border:1px solid rgba(251,251,253,.12)}
.wall a{display:block;text-decoration:none;background:var(--ink);padding:22px 20px;min-height:118px;position:relative;overflow:hidden;transition:color .3s}
.wall a::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--cobalt),var(--violet));transform:translateY(101%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.wall a:hover::before{transform:translateY(0)}
.wall a b,.wall a span{position:relative}
.wall a b{display:block;font-size:clamp(18px,1.5vw,22px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.03em;line-height:1.1}
.wall a span{display:block;margin-top:10px;font-size:13px;opacity:.6}
.wall .az{display:flex;flex-wrap:wrap;gap:2px;margin-top:26px}
.az a{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;text-decoration:none;font-weight:600;font-size:14px;transition:background .2s,color .2s;background:transparent;min-height:0;padding:0}
.az a::before{display:none}
.az a:hover{background:var(--white);color:var(--ink)}

/* SHELVES */
.shelves{background:var(--paper);padding:clamp(80px,10vw,150px) 0 0;position:relative}
.shelves .hd{padding:0 var(--gutter);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(30px,4vw,56px)}
.shelves h2{font-size:clamp(34px,4.4vw,72px);max-width:11ch}
.shelves .hd p{font-size:16px;line-height:1.55;color:var(--mute);max-width:36ch;text-align:right}
.row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.4fr) minmax(0,1fr) 60px;gap:24px;align-items:center;padding:clamp(22px,3vw,40px) var(--gutter);border-top:1px solid var(--line);text-decoration:none;position:relative;isolation:isolate}
.row:last-of-type{border-bottom:1px solid var(--line)}
.row::before{content:"";position:absolute;inset:0;background:var(--c);transform:scaleY(0);transform-origin:bottom;transition:transform .5s cubic-bezier(.2,.8,.2,1);z-index:-1}
.row:hover::before{transform:scaleY(1)}
.row b{font-size:clamp(28px,3.2vw,52px);font-variation-settings:"opsz" 96,"wdth" 86;font-weight:700;letter-spacing:-.045em;line-height:.92;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.row b small{display:block;font-size:clamp(13px,1vw,15px);font-weight:500;letter-spacing:0;font-variation-settings:"opsz" 14,"wdth" 100;color:var(--mute);margin-top:8px}
.row:hover b{transform:translateX(14px)}
.row .d{font-size:clamp(16px,1.25vw,18px);line-height:1.5;color:#2F3145;max-width:42ch}
.row .peek{list-style:none;color:var(--mute);line-height:1.8;font-size:14px}
.row .peek li{transition:transform .45s cubic-bezier(.2,.8,.2,1),color .3s}
.row:hover .peek li{color:var(--ink)}
.row:hover .peek li:nth-child(1){transform:translateX(10px)}
.row:hover .peek li:nth-child(2){transform:translateX(18px)}
.row:hover .peek li:nth-child(3){transform:translateX(26px)}
.row .ar{width:44px;height:44px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;justify-self:end;transition:background .3s,color .3s,transform .4s}
.row:hover .ar{background:var(--ink);color:var(--paper);transform:rotate(-45deg)}
.row .ar svg{width:18px;height:18px}
.row:nth-of-type(1){--c:#DCE7FF}.row:nth-of-type(2){--c:#E4E0FF}.row:nth-of-type(3){--c:#DDF5E8}.row:nth-of-type(4){--c:#FFE7D6}.row:nth-of-type(5){--c:#FFF1C2}.row:nth-of-type(6){--c:#DCF2F5}.row:nth-of-type(7){--c:#EFE6FF}

/* WHO + HOW */
.who2{background:var(--paper);padding:clamp(80px,10vw,150px) var(--pad);position:relative;overflow:hidden}
.who2::before{content:"";position:absolute;left:-10%;bottom:-20%;width:50vw;height:50vw;max-width:760px;max-height:760px;border-radius:50%;background:radial-gradient(closest-side,rgba(39,199,190,.12),transparent);pointer-events:none}
.who2 .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,80px);position:relative}
.who2 h2{font-size:clamp(30px,3.6vw,56px);margin-bottom:22px;max-width:14ch}
.who2 ul{list-style:none;border-top:1px solid var(--line)}
.who2 li{padding:16px 0;border-bottom:1px solid var(--line);font-size:17px;line-height:1.5;display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:16px}
.who2 li b{font-weight:650}
.who2 li a{text-decoration:none;border-bottom:1px solid var(--line)}
.who2 li a:hover{border-color:var(--ink)}

/* METHOD */
.method{background:var(--paper);padding:0 var(--pad) clamp(80px,10vw,150px)}
.method h2{font-size:clamp(34px,4.4vw,72px);max-width:14ch}
.msteps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,32px);margin-top:clamp(36px,5vw,64px);position:relative}
.msteps::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.msteps i.bar{position:absolute;left:0;top:0;height:1px;width:0;background:linear-gradient(90deg,var(--cobalt),var(--teal))}
.mstep{padding-top:26px}
.mstep .n{display:block;font-size:12px;color:var(--mute);margin-bottom:14px}
.mstep h3{font-size:clamp(20px,1.7vw,26px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.03em;line-height:1.1}
.mstep p{margin-top:12px;font-size:15px;line-height:1.55;color:#2F3145}

/* FAQ */
.faq{background:var(--paper);padding:0 var(--pad) clamp(80px,10vw,150px)}
.faq .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(28px,5vw,80px)}
.faq h2{font-size:clamp(34px,4.4vw,72px);max-width:10ch}
.faq .wrap>div:first-child{position:sticky;top:110px;align-self:start}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-size:clamp(18px,1.6vw,24px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:600;letter-spacing:-.025em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;transition:transform .35s,background .3s,color .3s}
.faq summary i::before{content:"+";font-style:normal;font-weight:500;line-height:1}
.faq details[open] summary i{transform:rotate(45deg);background:var(--ink);color:var(--paper)}
.faq details p{padding:0 0 24px;font-size:17px;line-height:1.55;color:#2F3145;max-width:60ch}

/* COMPOSE */
.compose{position:relative;color:var(--white);background:linear-gradient(160deg,var(--deep) 0%,var(--cobalt) 45%,#2D3BF0 100%)}
.compose::before{content:"";position:absolute;inset:0;background:radial-gradient(40% 50% at 80% 20%,rgba(106,75,255,.5),transparent 70%),radial-gradient(35% 40% at 15% 85%,rgba(39,199,190,.3),transparent 70%);filter:blur(20px);pointer-events:none}
.compose-pin{height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding:0 var(--gutter);overflow:hidden;perspective:1600px;position:relative}
.compose h2{font-size:clamp(34px,4.4vw,72px);max-width:9ch}
.compose .lead{margin-top:26px;font-size:clamp(17px,1.4vw,21px);line-height:1.5;max-width:40ch;opacity:.86}
.win{background:var(--white);color:var(--ink);border-radius:20px;overflow:hidden;box-shadow:0 60px 120px -40px rgba(25,211,255,.35),0 40px 80px -30px rgba(0,0,40,.6);min-width:0;transform:rotateY(-6deg) rotateX(2deg);transform-style:flat;isolation:isolate;backface-visibility:hidden;-webkit-mask-image:-webkit-radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}
.win .bar{border-radius:20px 20px 0 0}
.win .send{border-radius:0 0 20px 20px}
.win .bar{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);color:var(--mute);transition:background .4s,color .4s}
.win .bar b{color:var(--ink);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;font-family:"Bricolage Grotesque",sans-serif;transition:color .4s}
.win .fld{display:flex;gap:14px;padding:12px 18px;border-bottom:1px solid var(--line);font-size:15px}
.win .fld span{color:var(--mute);width:56px;flex:none}
.win .body{padding:18px;font-size:16px;line-height:1.6;min-height:220px;white-space:pre-wrap}
.win .body .c{opacity:0}
.win .body .c.on{opacity:1}
.win .body .cur{display:inline-block;width:2px;height:1.1em;background:var(--ink);vertical-align:-.2em;margin-left:1px;animation:blink 1s steps(2) infinite}
.win .send{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-top:1px solid var(--line)}
.win .send button{border:0;background:var(--ink);color:#fff;font:600 15px/1 "Bricolage Grotesque",sans-serif;padding:12px 18px;border-radius:999px;cursor:pointer;transition:background .3s,transform .2s}
.win.sent .bar{background:var(--green);color:#fff}
.win.sent .bar b{color:#fff}
.win.sent .send button{background:var(--green);transform:scale(.96)}
.win.sent .body .cur{display:none}
@keyframes blink{50%{opacity:0}}
.rin{position:absolute;right:var(--gutter);bottom:clamp(28px,6vh,60px);width:min(380px,80vw);background:var(--white);color:var(--ink);border-radius:16px;padding:14px 16px;display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;box-shadow:0 30px 60px -30px rgba(0,0,40,.6);opacity:0;pointer-events:none}
.rin .pfp{width:40px;height:40px;border-radius:50%;background:#D5D7E4}
.rin b{font-size:14px;display:block}
.rin p{font-size:13px;line-height:1.45;color:#3C3E46;margin-top:2px}
.rin .mono{color:var(--green);margin-top:6px;display:block}

/* FOOT */
.foot{background:var(--navy);color:#fff;padding:clamp(60px,9vw,130px) var(--gutter) 30px;position:relative;overflow:hidden}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--gline)}
.foot::after{content:"";position:absolute;left:-10%;bottom:-30%;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(closest-side,rgba(27,42,230,.35),transparent);pointer-events:none}
.foot>*{position:relative;z-index:1}
.foot .big{font-size:clamp(90px,21vw,400px);font-variation-settings:"opsz" 96,"wdth" 85;font-weight:800;letter-spacing:-.06em;line-height:.78;display:flex;align-items:baseline;gap:.08em}
.foot .big .dots b{width:.11em;height:.11em}
.foot .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:clamp(40px,6vw,90px);padding-top:26px;border-top:1px solid rgba(255,255,255,.14)}
.foot .cols a{display:block;text-decoration:none;font-size:15px;line-height:1.8}
.foot .cols .mono{color:var(--cyan);margin-bottom:8px}
.foot .fine{margin-top:50px;color:rgba(255,255,255,.55);display:flex;justify-content:space-between;gap:20px}

@media (max-width:900px){
  .nav{display:none}
  .spec,.hint{display:none}
  .t1 .big{font-size:clamp(46px,12vw,72px)}
  .ruler span:not(:first-of-type):not(:last-child){display:none}
  .seq-head{grid-template-columns:minmax(0,1fr)}
  .day{justify-items:start;text-align:left}
  .day b{font-size:56px}
  .seq-head p{display:none}
  .t3{flex-direction:column;align-items:flex-start}
  .covers .wrap,.steps .wrap,.who2 .wrap,.faq .wrap,.gloss .intro,.numbers .wrap{grid-template-columns:minmax(0,1fr)}
  .collage{height:auto;perspective:none;display:grid;gap:14px;padding-bottom:40px}
  .shot{position:static;width:auto;transform:none;animation:none;margin:0}
  .ngrid{grid-template-columns:minmax(0,1fr)}
  .day .play{display:none}
  .steps .lhs,.faq .wrap>div:first-child{position:static}
  .gloss .intro p{justify-self:start}
  .term{position:static;height:auto;margin-bottom:0;grid-template-columns:minmax(0,1fr);gap:24px;padding:100px var(--pad) 60px;box-shadow:none}
  .wall .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .row{grid-template-columns:minmax(0,1fr) 44px;gap:12px}
  .row .peek{display:none}
  .row .d{grid-column:1/-1}
  .row .ar{grid-column:2;grid-row:1}
  .who2 li{grid-template-columns:minmax(0,1fr)}
  .msteps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .compose-pin{grid-template-columns:minmax(0,1fr);align-content:center;gap:24px}
  .compose h2{font-size:clamp(40px,11vw,80px)}
  .win{transform:none}
  .win .body{min-height:160px;font-size:14px}
  .rin{display:none}
  .foot .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.dots b,.hint i,.sky{animation:none}}

/* v5: the field is a fixed layer; hero, sequence and kit band ride on it */
.skyfix{position:fixed;inset:0;z-index:0;background:linear-gradient(180deg,var(--deep) 0%,#1526C8 9%,var(--cobalt) 17%,var(--cobalt) 100%)}
.skyfix::before{content:"";position:absolute;inset:-20% -10% 40% -10%;background:radial-gradient(42% 55% at 22% 30%,rgba(138,63,255,.5),transparent 70%),radial-gradient(38% 50% at 78% 22%,rgba(25,211,255,.3),transparent 70%);filter:blur(30px);animation:sky 26s ease-in-out infinite alternate}
#gl{position:fixed;inset:0;width:100%;height:100%;z-index:0}
main{position:relative;z-index:1}
.hero{background:transparent}
.hero .sky{display:none}
.seq{background:transparent;color:#fff}
.seq::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,20,128,.78) 0%,rgba(11,20,128,.45) 40%,rgba(11,20,128,0) 62%,rgba(7,11,42,.75) 100%);pointer-events:none}
.seq-pin{position:relative}
.seq-head h2{color:#fff}
.seq-head p{color:rgba(255,255,255,.85)}
.seq-head .eyebrow{display:block;color:var(--cyan)}
.seq-head .eyebrow::after{background:linear-gradient(90deg,#fff,var(--cyan))}
.day b{color:#fff}
.day b small{color:rgba(255,255,255,.6)}
.day .st{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:#fff}
.day .st i{background:var(--cyan)}
.msg{color:var(--ink);box-shadow:0 30px 70px -30px rgba(0,0,40,.7);border-color:rgba(255,255,255,.5)}
.msg.reply .front{box-shadow:0 30px 70px -30px rgba(0,0,40,.7)}
.ruler{background:rgba(255,255,255,.25)}
.ruler i{background:var(--cyan)}
.ruler span{color:rgba(255,255,255,.75)}
.ruler span::before{background:var(--cobalt);border-color:#fff}
.numbers .eyebrow::after,.kitband .eyebrow::after{background:linear-gradient(90deg,#fff,var(--cyan))}
.gloss .intro h2::before{background:linear-gradient(90deg,#fff,var(--cyan),var(--violet))}
/* kit band: the field returns behind the offer */
.kitband{position:relative;color:#fff;min-height:88svh;display:grid;align-items:center;padding:clamp(80px,10vw,140px) var(--pad)}
.kitband::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,11,42,.88) 0%,rgba(7,11,42,.7) 45%,rgba(27,42,230,.1) 100%);pointer-events:none}
.kitband .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,80px);align-items:center}
.kitband .eyebrow{color:var(--cyan)}
.kitband h2{font-size:clamp(34px,4.4vw,72px);max-width:11ch}
.kitband .lead{margin-top:22px;font-size:clamp(17px,1.35vw,20px);line-height:1.5;max-width:44ch;opacity:.9}
.kitband .partner{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.2);font-size:15px;line-height:1.55;max-width:48ch;opacity:.9}
.kitband .partner a{color:var(--cyan)}
.kit{background:#fff;color:var(--ink);border-radius:20px;padding:26px 26px 22px;box-shadow:0 40px 90px -30px rgba(0,0,40,.6),0 0 0 1px rgba(255,255,255,.4);position:relative;overflow:hidden;justify-self:end;width:min(460px,100%)}
.kit::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--gline)}
.kit .mono{color:var(--cobalt)}
.kit h3{font-size:clamp(24px,2.1vw,30px);font-variation-settings:"opsz" 32,"wdth" 92;font-weight:650;letter-spacing:-.035em;line-height:1.05;margin-top:10px}
.kit ul{list-style:none;margin:16px 0 18px;display:grid;gap:9px}
.kit li{display:flex;gap:10px;font-size:15px;line-height:1.4;color:#2F3145}
.kit li i{flex:none;width:18px;height:18px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:700;margin-top:2px}
.kit form{display:grid;gap:10px}
.kit input{width:100%;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font:500 15px/1.2 "Bricolage Grotesque",sans-serif;color:var(--ink);background:#F7F8FC;outline:none;transition:border-color .2s,box-shadow .2s}
.kit input:focus{border-color:var(--cobalt);box-shadow:0 0 0 3px rgba(27,42,230,.15)}
.kit button{width:100%;justify-content:center}
.kit small{display:block;margin-top:12px;font-size:12px;color:var(--mute);line-height:1.5}
@media (max-width:900px){.kitband .wrap{grid-template-columns:minmax(0,1fr)}.kit{justify-self:stretch;width:auto}}

/* v6: fit short viewports, denser sections, visible flow */
.t1 .big{font-size:clamp(44px,min(9.4vw,15vh),168px)}
.t1 .k{margin-bottom:14px}
@media (max-height:780px){.spec{display:none}.t1 .k{font-size:11px;padding:6px 10px}}
@media (max-height:640px){.t1 .k{display:none}}
.collage{height:clamp(380px,36vw,500px);margin-top:clamp(64px,8vw,120px)}
.shot.s1{top:24%}.shot.s2{top:14%}.shot.s3{top:28%}
/* glossary: no more sticky stack, three compact acts */
.term{position:relative;top:auto;height:auto;min-height:0;margin:0;padding:clamp(70px,9vw,110px) var(--gutter);box-shadow:none;align-content:start;border-top:1px solid rgba(251,251,253,.1)}
.term .w{font-size:clamp(72px,11vw,200px)}
.gloss .intro{padding-bottom:clamp(30px,4vh,50px)}
/* section rhythm: every light section opens with the same header line */
.solid,.shelves,.steps,.who2,.method,.faq,.covers{position:relative}
.rule{height:3px;background:var(--gline);width:52px;border-radius:2px;margin-bottom:18px}
.shelves .hd,.who2 .wrap,.method .wrap,.faq .wrap{position:relative}
.sec-eyebrow{display:block;margin-bottom:14px;color:var(--cobalt)}
.sec-eyebrow::after{content:"";display:block;width:52px;height:3px;border-radius:2px;background:var(--gline);margin-top:10px}
.who2,.method,.faq{padding-top:clamp(70px,9vw,120px)}
.method,.faq{border-top:1px solid var(--line)}
.steps{border-top:1px solid var(--line)}
.thread{position:relative;height:72px;background:var(--paper)}
.thread::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(180deg,transparent,var(--cobalt),transparent)}
/* footer stays visible even when scroll-driven reveals never fire */
.foot .big .mask>span{transform:none!important}

.band{position:relative;color:#fff;background:var(--grad);padding:clamp(40px,5vw,64px) var(--pad);overflow:hidden}
.band::before{content:"";position:absolute;right:-10%;top:-60%;width:40vw;height:40vw;border-radius:50%;background:radial-gradient(closest-side,rgba(25,211,255,.4),transparent);filter:blur(20px);pointer-events:none}
.band .wrap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.band .mono{display:block;color:rgba(255,255,255,.75);margin-bottom:10px}
.band h2{font-size:clamp(26px,3vw,46px);max-width:22ch}
.band a.white{display:inline-flex;align-items:center;gap:10px;text-decoration:none;background:#fff;color:var(--cobalt);font-family:"Geist Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:16px 24px;border-radius:999px;box-shadow:0 18px 40px -14px rgba(0,0,40,.6);transition:transform .3s}
.band a.white:hover{transform:translateY(-3px)}

/* v7: headline legibility, back to top */
.scrim{background:radial-gradient(ellipse 72% 88% at 12% 100%,rgba(7,11,42,.94),rgba(7,11,42,.55) 40%,rgba(7,11,42,0) 74%)}
.t1,.t2,.t3 h2{text-shadow:0 2px 28px rgba(7,11,42,.6),0 0 2px rgba(7,11,42,.4)}
.t1 .k{background:rgba(7,11,42,.72)}
.totop{position:fixed;right:22px;bottom:22px;z-index:2147482000;width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;background:var(--grad);color:#fff;display:grid;place-items:center;box-shadow:0 14px 34px -10px rgba(38,64,255,.7);opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .3s,transform .3s}
.totop.on{opacity:1;pointer-events:auto;transform:translateY(0)}
.totop svg{width:20px;height:20px}
.totop:hover{transform:translateY(-3px)}

/* intro runs in CSS so the headline can never stay hidden if a script stalls */
.intro .t1 .mask > span{animation:none}
.intro .t1 .mask:nth-child(2) > span{animation-delay:.12s}
.intro .t1 .k,.intro .spec,.intro .hint,.intro .cnt{animation:none}
@keyframes rise{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.intro .t1 .mask > span,.intro .t1 .k,.intro .spec,.intro .hint,.intro .cnt{animation:none}}
.spec{display:none}

/* scene: quiet background material for dark bands (paper messages in perspective, grid, horizon) */
.scene{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.scene .sfield{position:absolute;left:0;right:0;bottom:0;height:46%;background-image:linear-gradient(90deg,transparent 0 6%,rgba(255,255,255,.22) 6% 14%,transparent 14% 100%),linear-gradient(180deg,transparent 0 30%,rgba(255,255,255,.14) 30% 70%,transparent 70% 100%);background-size:9% 100%,100% 22%;transform:perspective(900px) rotateX(58deg) scale(1.35);transform-origin:50% 100%;opacity:.4;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%);mask-image:linear-gradient(180deg,transparent,#000 40%)}
.scene .shorizon{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gline);opacity:.8;box-shadow:0 0 24px 4px rgba(25,211,255,.4)}
.scene .pk{position:absolute;top:0;bottom:0;left:var(--gutter);right:var(--gutter)}
.scene i{position:absolute;display:block;width:min(var(--w,240px),20vw);aspect-ratio:1.45;border-radius:12px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);transform:perspective(900px) rotateX(var(--rx,54deg)) rotateZ(var(--rz,-8deg));animation:sfloat 9s ease-in-out infinite;animation-delay:var(--d,0s)}
.scene i::before,.scene i::after{content:"";position:absolute;left:12%;right:30%;top:22%;height:7%;border-radius:3px;background:rgba(255,255,255,.28)}
.scene i::after{top:42%;right:52%}
.scene i:nth-child(1){left:0;bottom:1%;--w:280px;--rz:-10deg}
.scene i:nth-child(2){left:31%;bottom:7%;--w:200px;--rz:6deg;--d:-2.5s}
.scene i:nth-child(3){right:1%;top:5%;--w:250px;--rz:9deg;--d:-4s}
.scene i:nth-child(4){right:31%;bottom:9%;--w:180px;--rz:-4deg;--d:-6s}
.scene~*{z-index:1}
.scene~*:not(.rin){position:relative}
@keyframes sfloat{0%,100%{translate:0 0}50%{translate:0 -14px}}
@media (max-width:1200px){.scene i:nth-child(4){display:none}}
@media (max-width:900px){.scene i:nth-child(n+3){display:none}.scene i{--w:140px}}
.kitband .scene .pk,.kitband .scene .sfield{display:none}
@media (prefers-reduced-motion:reduce){.scene i{animation:none}}


/* mobile menu */
/* The popover attribute brings user agent styles with it: a fixed box with a border and a
   background. Undo them, because above 900px this element is an ordinary row in the header.
   These two live below the marker so the homepage stylesheet, which is sliced from here, gets them. */
.nav[popover]{position:static;inset:auto;width:auto;height:auto;max-width:none;max-height:none;margin:0;padding:0;border:0;background:none;color:inherit;overflow:visible}
.nav .navtop{display:none}
/* The native popover, no script. Without :popover-open support the panel never hides, so the
   links stay in the header instead of disappearing behind a button that does nothing.
   NOTE: theme/build.mjs slices home.css from the exact marker above. Do not reword that line. */
.burger{display:none;font:inherit;background:transparent;border:1px solid currentColor;color:inherit;padding:9px 12px;border-radius:999px;cursor:pointer;line-height:1}
@media (max-width:900px){
  .top .cta{padding:10px 12px;font-size:10px}
}
@supports selector(:popover-open){
  @media (max-width:900px){
    .burger{display:inline-flex;margin-left:auto;margin-right:10px}
    .nav[popover]:not(:popover-open){display:none}
    .nav[popover]:popover-open{display:flex;flex-direction:column;position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0 var(--pad) 40px;gap:0;overflow:auto;overscroll-behavior:contain;color:#fff;background:linear-gradient(160deg,var(--deep),var(--cobalt) 55%,#5A46F5)}
    .nav[popover]::backdrop{background:transparent}
    .nav[popover]:popover-open::before{content:"";position:absolute;right:-20%;bottom:-10%;width:80vw;height:80vw;border-radius:50%;background:radial-gradient(closest-side,rgba(25,211,255,.35),transparent);filter:blur(20px);pointer-events:none}
    .nav .navtop{display:flex;align-items:center;padding:18px var(--pad) 74px;margin:0 calc(var(--pad) * -1)}
    .nav .navtop .logo{font-family:"Bricolage Grotesque",sans-serif;font-size:22px;font-weight:700;letter-spacing:-.04em;text-transform:none;opacity:1}
    .nav .navtop .burger{display:inline-flex;margin-left:auto;margin-right:10px}
    .nav[popover] a:not(.logo):not(.cta){position:relative;font-family:"Bricolage Grotesque",sans-serif;font-size:30px;font-variation-settings:"opsz" 32,"wdth" 92;font-weight:600;letter-spacing:-.03em;text-transform:none;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.18);opacity:1}
    .nav[popover] a:not(.logo):not(.cta)::after{display:none}
  }
}

/* pipeline flow diagram and score table (shared by term and guide bodies) */
.flow{--n:5;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));align-items:center;margin-top:1.4em;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 18px}
.flow div{position:relative;text-align:center;padding:16px 8px;border-radius:12px;border:1px solid var(--line);margin:0 8px;font-weight:650;font-size:15px;letter-spacing:-.01em}
.flow div small{display:block;font-weight:500;color:var(--mute);font-size:12px;margin-top:4px}
.flow div.hi{background:var(--cobalt);color:#fff;border-color:var(--cobalt);box-shadow:0 18px 40px -16px rgba(38,64,255,.7)}
.flow div.hi small{color:rgba(255,255,255,.75)}
.flow div+div::before{content:"";position:absolute;right:100%;top:50%;width:17px;height:2px;background:var(--gline)}
.flow .own{grid-column:1/-1;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));margin-top:10px}
.flow:has(>div:nth-child(4)){--n:3}.flow:has(>div:nth-child(5)){--n:4}.flow:has(>div:nth-child(6)){--n:5}.flow:has(>div:nth-child(7)){--n:6}.flow:has(>div:nth-child(8)){--n:7}.flow:has(>div:nth-child(9)){--n:8}
@media (max-width:640px){
.flow{grid-template-columns:minmax(0,1fr) 96px;grid-auto-flow:row dense;column-gap:12px;row-gap:14px;padding:18px 14px}
.flow>div:not(.own){grid-column:1;margin:0;text-align:left;padding:12px 14px}
.flow div+div::before{right:auto;left:24px;top:auto;bottom:100%;width:2px;height:14px}
.flow .own{display:contents}
.flow .own span{grid-column:2;text-align:left;align-self:center;line-height:1.4}
}
.flow .own::before{display:none}
.flow .own span{text-align:center;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.score{margin-top:1.2em;border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.score .row{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,1fr);gap:12px 24px;padding:12px 16px;border-top:1px solid var(--line);font-size:15px;align-items:center}
.score .row:first-child{border-top:0;background:var(--navy);color:#fff;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.score .row b{text-align:right;text-wrap:balance;font-variant-numeric:tabular-nums;color:var(--cobalt)}
.score .row.sum{background:var(--green-soft);font-weight:650}
.score .row.sum b{color:#0B7A46}
.score .row:first-child b{color:rgba(255,255,255,.72)}
.bar{height:8px;border-radius:4px;background:#ECEDF3;overflow:hidden}
.bar i{display:block;height:100%;background:var(--gline);border-radius:4px}

/* scene: quiet background material for dark bands (paper messages in perspective, grid, horizon) */
.scene{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.scene .sfield{position:absolute;left:0;right:0;bottom:0;height:46%;background-image:linear-gradient(90deg,transparent 0 6%,rgba(255,255,255,.22) 6% 14%,transparent 14% 100%),linear-gradient(180deg,transparent 0 30%,rgba(255,255,255,.14) 30% 70%,transparent 70% 100%);background-size:9% 100%,100% 22%;transform:perspective(900px) rotateX(58deg) scale(1.35);transform-origin:50% 100%;opacity:.4;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%);mask-image:linear-gradient(180deg,transparent,#000 40%)}
.scene .shorizon{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gline);opacity:.8;box-shadow:0 0 24px 4px rgba(25,211,255,.4)}
.scene .pk{position:absolute;top:0;bottom:0;left:var(--gutter);right:var(--gutter)}
.scene i{position:absolute;display:block;width:min(var(--w,240px),20vw);aspect-ratio:1.45;border-radius:12px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);transform:perspective(900px) rotateX(var(--rx,54deg)) rotateZ(var(--rz,-8deg));animation:sfloat 9s ease-in-out infinite;animation-delay:var(--d,0s)}
.scene i::before,.scene i::after{content:"";position:absolute;left:12%;right:30%;top:22%;height:7%;border-radius:3px;background:rgba(255,255,255,.28)}
.scene i::after{top:42%;right:52%}
.scene i:nth-child(1){left:0;bottom:1%;--w:280px;--rz:-10deg}
.scene i:nth-child(2){left:31%;bottom:7%;--w:200px;--rz:6deg;--d:-2.5s}
.scene i:nth-child(3){right:1%;top:5%;--w:250px;--rz:9deg;--d:-4s}
.scene i:nth-child(4){right:31%;bottom:9%;--w:180px;--rz:-4deg;--d:-6s}
.scene~*{z-index:1}
.scene~*:not(.rin){position:relative}
@keyframes sfloat{0%,100%{translate:0 0}50%{translate:0 -14px}}
@media (max-width:1200px){.scene i:nth-child(4){display:none}}
@media (max-width:900px){.scene i:nth-child(n+3){display:none}.scene i{--w:140px}}
.kitband .scene .pk,.kitband .scene .sfield{display:none}
@media (prefers-reduced-motion:reduce){.scene i{animation:none}}