/* QR v16 — one surface system. Every section sits on the same ground, the same survey grid and the same light; only intensity changes. */
:root{--gut:max(60px,calc((100vw - 1240px) / 2));--sy:clamp(96px,10.5vw,164px);--body:#9AA0AF;--gold-hi:#D8C18E;--hair:rgba(213,216,232,.09);--surface:rgba(8,10,17,.6)}
@media(max-width:900px){:root{--gut:32px}}
@media(max-width:640px){:root{--gut:20px}}

/* Atmosphere: fixed grid + one particle field + one travelling key light */
canvas#topo{z-index:0;-webkit-mask-image:radial-gradient(ellipse 110% 95% at 50% 45%,#000 45%,rgba(0,0,0,.7) 100%);mask-image:radial-gradient(ellipse 110% 95% at 50% 45%,#000 45%,rgba(0,0,0,.7) 100%)}
#atmo{position:fixed;inset:0;pointer-events:none;z-index:0}
#atmo-pt{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero,.strat,.engine,.portal,.evidence,.access,footer{background:transparent!important;border-top:0!important}

/* One grid of alignment for every band */
.sb,nav,footer{padding-left:var(--gut);padding-right:var(--gut)}
.hero{padding-left:var(--gut);padding-right:var(--gut)}
.strat,.engine,.portal,.evidence,.access{padding:var(--sy) var(--gut)}
.portal{padding-bottom:calc(var(--sy) * .5)}
.sx,.st-empty,.engine-top,.ec,.dsh-intro,.ev-header,.ev-nav,.access-inner,.dsh-cap{max-width:none;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
.engine-top,.ev-header{margin-bottom:64px}
.ec{margin-top:0}
.access-layout{margin-top:64px}
.dsh-stage{margin-top:88px;margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gut))}
.charts-scroll{margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gut));padding-left:var(--gut);padding-right:var(--gut)}

/* Section divider — full-bleed rule at the exact boundary, gold mark on the content edge, soft light below */
.strat,.engine,.portal,.evidence,.access{padding-top:0}
.sec-idx{position:relative;display:flex;align-items:baseline;gap:12px;margin:0 calc(-1 * var(--gut)) calc(var(--sy) * .72);padding:26px var(--gut) 0;border-top:1px solid rgba(213,216,232,.2);font-family:var(--mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mid)}
.sec-idx::before{content:'';position:absolute;left:var(--gut);top:-2px;width:72px;height:3px;background:var(--gold)}
.sec-idx::after{content:'';position:absolute;left:0;right:0;top:0;height:180px;pointer-events:none;z-index:-1;background:linear-gradient(180deg,rgba(150,170,230,.05),rgba(150,170,230,0))}
.sec-idx b{font-weight:400;color:var(--gold-hi);font-size:13px}
.sec-idx span{color:var(--mid)}
.sec-idx.reveal{opacity:1;transform:none}

/* Type: wordmark serif, Alliance for display, DM Sans for reading, Cormorant only for spoken quotes */
.hero-logo{background:linear-gradient(180deg,#F1F3F9 0%,#CDD1DE 52%,#858B9E 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.engine-lede,.ev-note,.portal .dsh-lede,.sx-l .dsh-lede{font-size:16px;line-height:1.75;font-weight:300;color:var(--body);max-width:480px;text-wrap:pretty}
.ev-note strong,.dsh-lede .lead,.sx-l .dsh-lede .lead{color:var(--text);font-weight:400}
.access-copy h3{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(22px,1.9vw,27px);line-height:1.38;color:var(--text);letter-spacing:.005em}
.access-copy p{color:var(--body);font-size:15px}
.form-success h4{font-family:var(--brand);font-weight:400;letter-spacing:-.01em}
.sx-sec .rn{font-family:var(--mono);font-size:10px;letter-spacing:.16em;padding-top:2px}
.sx-sec p{color:var(--body)}
.sx-meta dt,.sx-sec>header .tag,.sx-num span,.sx-num em,.sx-vars span.more{color:var(--mid)}
.sx-meta dd.g,.sx-num b.g,.sx-item .w,.sx-vars span.g{color:var(--gold-hi)}
.sx-vars span.g{border-color:rgba(216,193,142,.32)}

/* Surfaces: one glass over the grid */
.ev-card{background:var(--surface);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.access-status{background:var(--surface);border-color:var(--hair);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.form-group label{color:var(--mid)}
.form-group input,.form-group select,.form-group textarea{background:var(--surface);border-color:var(--hair);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.form-group input::placeholder,.form-group textarea::placeholder{color:#4C5366}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:rgba(213,216,232,.3)}
.form-success{background:var(--surface);border-color:var(--hair)}

/* Controls: one button language */
.btn-submit{background:#E6E9F2;color:#07090F;font-size:11px;font-weight:500;letter-spacing:.24em;padding:16px;border-radius:0;box-shadow:none;transition:background .25s}
.btn-submit:hover{background:#fff}
.ev-arrow{width:44px;height:44px;font-size:14px}
.ec-rail button{color:var(--mid)}
.dsh-cap{color:var(--mid)}

/* Chrome */
.sb{gap:24px;background:rgba(3,5,8,.86)}
.sb-l{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--mid)}
.sb-r{white-space:nowrap;color:var(--mid)}
.nav-logo,.nav-link{white-space:nowrap}
footer{border-top:1px solid var(--hair)}
.footer-logo{color:var(--mid)}
@media(max-width:1180px){.nav-r{gap:24px}}
@media(max-width:1040px){.nav-link.it,.nav-r a[href="#"]:first-child{display:none}}
@media(max-width:760px){.nav-r .nav-link:not([href="#access"]){display:none}.sb-l{font-size:9px}}
@media(max-width:640px){.terminal-block{min-width:0;width:100%;font-size:10px}.t-val{white-space:normal;text-align:right}footer{flex-direction:column;align-items:flex-start;gap:16px}.footer-r{text-align:left}}

/* Strategy — one screen: intro left, five chapters as tabs right */
.sx{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(48px,6vw,96px);align-items:start}
.sx-l,.sx-l{position:relative!important;top:0!important}
.sx-l .dsh-lede{margin-top:26px}
.sx-l .strat-quote{margin-top:32px}
.sx-meta{margin-top:32px}
.sx-r{gap:0;padding-top:4px}
.sx-nav{display:flex;align-items:flex-end;gap:24px;margin-bottom:36px}
.sx-tabs{flex:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.sx-tabs button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:10px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mid);transition:color .3s}
.sx-tabs button b{font-family:var(--mono);font-weight:400;font-size:10px;color:var(--dim);transition:color .3s}
.sx-tabs button::after{content:'';height:2px;background:rgba(255,255,255,.1);transition:background .3s}
.sx-tabs button:hover,.sx-tabs button.on{color:var(--text)}
.sx-tabs button.on b{color:var(--gold-hi)}
.sx-tabs button.on::after{background:var(--gold)}
.sx-tabs button:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.sx-panels{display:grid}
.sx-panels .sx-sec{grid-area:1/1;border-top:0;padding-top:0;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .4s ease,transform .6s cubic-bezier(.16,1,.3,1),visibility 0s .4s}
.sx-panels .sx-sec.on{opacity:1;visibility:visible;transform:none;transition:opacity .55s ease .1s,transform .7s cubic-bezier(.16,1,.3,1) .1s,visibility 0s}
.sx-panels .sx-sec>h3{font-family:var(--brand);font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.15;letter-spacing:-.015em;color:#EBEDF4;margin:0 0 20px;text-wrap:balance;max-width:640px}
.sx-panels .sx-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hair);border:0;margin-top:24px}
.sx-panels .sx-item{display:flex;flex-direction:column;gap:10px;padding:16px 18px 18px;border:0;background:rgba(7,9,15,.82)}
.sx-panels .sx-item .w{padding-top:0}
.sx-panels .sx-item b{font-size:15px}
.sx-panels .sx-item p{font-size:13px;line-height:1.62}
.sx-panels .sx-rules{grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair)}
.sx-panels .sx-rule{background:rgba(7,9,15,.82);padding:16px 18px 18px;grid-template-columns:28px minmax(0,1fr);gap:10px}
.sx-num div,.sx-rule{background:rgba(7,9,15,.82)}
@media(max-width:1180px){.sx{grid-template-columns:1fr;gap:56px}}
@media(max-width:820px){.sx-panels .sx-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sx-panels .sx-rules{grid-template-columns:1fr}}
@media(max-width:560px){.sx-tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.sx-tabs button{font-size:0;letter-spacing:0}.sx-tabs button b{font-size:11px}.sx-nav .ec-arrows{display:none}.sx-panels .sx-list{grid-template-columns:1fr}}

/* Depth — six interchangeable treatments, switched by html[data-depth] */
.strat,.engine,.portal,.evidence,.access{position:relative;isolation:isolate;overflow:clip}
.strat::before,.strat::after,.engine::before,.engine::after,.portal::before,.portal::after,.evidence::before,.evidence::after,.access::before,.access::after{content:'';position:absolute;z-index:-1;pointer-events:none}
.ec-stage{position:relative;isolation:isolate}
.ec-stage::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(var(--gold),var(--gold)) 0 0/14px 1px,linear-gradient(var(--gold),var(--gold)) 0 0/1px 14px,linear-gradient(var(--gold),var(--gold)) 100% 0/14px 1px,linear-gradient(var(--gold),var(--gold)) 100% 0/1px 14px,linear-gradient(var(--gold),var(--gold)) 0 100%/14px 1px,linear-gradient(var(--gold),var(--gold)) 0 100%/1px 14px,linear-gradient(var(--gold),var(--gold)) 100% 100%/14px 1px,linear-gradient(var(--gold),var(--gold)) 100% 100%/1px 14px;background-repeat:no-repeat;opacity:.55}
.ec-side,.sx-panels,.ev-card,.dsh-stage{position:relative}
.ec-side::before{content:'';position:absolute;inset:-28px -32px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(10,13,22,.55),rgba(10,13,22,.25));border:1px solid var(--hair);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.ev-card,.sx-panels .sx-item,.sx-panels .sx-rule,.form-group input,.form-group select,.form-group textarea,.access-status{box-shadow:0 30px 60px -30px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.04)}
.sx-panels .sx-item,.sx-panels .sx-rule,.sx-num div{background:rgba(8,10,17,.6)}
@media(max-width:900px){.ec-side::before{inset:-20px -16px}}

/* 1 · Floor & Glow */
[data-depth="floor"] .strat::before,[data-depth="floor"] .engine::before,[data-depth="floor"] .portal::before,[data-depth="floor"] .evidence::before,[data-depth="floor"] .access::before{inset:0;background:radial-gradient(ellipse 48% 42% at var(--lx,30%) var(--ly,55%),rgba(92,128,255,var(--ga,.11)),rgba(92,128,255,calc(var(--ga,.11) * .32)) 55%,transparent 75%),radial-gradient(ellipse 30% 26% at var(--lx2,78%) var(--ly2,30%),rgba(216,193,142,.045),transparent 70%)}
[data-depth="floor"] .strat::after,[data-depth="floor"] .engine::after,[data-depth="floor"] .portal::after,[data-depth="floor"] .evidence::after,[data-depth="floor"] .access::after{left:-30%;right:-30%;bottom:0;height:var(--fh,46%);transform-origin:50% 100%;transform:perspective(700px) rotateX(64deg);background-image:linear-gradient(rgba(150,172,240,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(150,172,240,.22) 1px,transparent 1px);background-size:72px 72px;background-position:center bottom;-webkit-mask-image:linear-gradient(0deg,#000 0%,rgba(0,0,0,.5) 40%,transparent 92%);mask-image:linear-gradient(0deg,#000 0%,rgba(0,0,0,.5) 40%,transparent 92%);opacity:var(--fo,.5)}
[data-depth="floor"] .strat{--lx:72%;--ly:45%;--lx2:18%;--ly2:28%;--fo:.32}
[data-depth="floor"] .engine{--lx:30%;--ly:62%;--lx2:82%;--ly2:22%;--fh:52%;--fo:.6;--ga:.07}
[data-depth="floor"] .portal{--lx:50%;--ly:58%;--lx2:15%;--ly2:15%;--fh:38%;--fo:.42}
[data-depth="floor"] .evidence{--lx:22%;--ly:55%;--lx2:85%;--ly2:70%;--fo:.42}
[data-depth="floor"] .access{--lx:50%;--ly:35%;--lx2:85%;--ly2:80%;--fh:60%;--fo:.55}
[data-depth="floor"] .ec-stage::before{content:'';position:absolute;inset:-12%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(92,128,255,.1),rgba(92,128,255,.03) 55%,transparent)}

/* 2 · Glass Planes — two tilted data sheets floating at different depths, parallax on scroll */
[data-depth="planes"] .strat::before,[data-depth="planes"] .engine::before,[data-depth="planes"] .portal::before,[data-depth="planes"] .evidence::before,[data-depth="planes"] .access::before{top:12%;right:var(--pr,-4%);width:min(52%,720px);height:72%;transform:perspective(1400px) rotateY(var(--ry,-32deg)) rotateX(6deg) translateY(calc(var(--par,0) * -70px));background:linear-gradient(135deg,rgba(220,228,255,.05),rgba(220,228,255,.008) 60%),linear-gradient(rgba(170,190,255,.07) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(170,190,255,.07) 1px,transparent 1px) 0 0/48px 48px;border:1px solid rgba(210,220,250,.16);box-shadow:0 60px 120px -40px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.12)}
[data-depth="planes"] .strat::after,[data-depth="planes"] .engine::after,[data-depth="planes"] .portal::after,[data-depth="planes"] .evidence::after,[data-depth="planes"] .access::after{top:30%;left:var(--pl,-6%);width:min(34%,460px);height:46%;transform:perspective(1400px) rotateY(var(--ry2,26deg)) rotateX(-4deg) translateY(calc(var(--par,0) * -150px));background:linear-gradient(160deg,rgba(220,228,255,.07),rgba(220,228,255,.01));border:1px solid rgba(210,220,250,.2);box-shadow:0 50px 100px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.16)}
[data-depth="planes"] .engine,[data-depth="planes"] .evidence{--ry:30deg;--ry2:-24deg;--pr:auto;--pl:auto}
[data-depth="planes"] .engine::before,[data-depth="planes"] .evidence::before{right:auto;left:-4%}
[data-depth="planes"] .engine::after,[data-depth="planes"] .evidence::after{left:auto;right:-6%}

/* 3 · Light Shafts — slow volumetric beams falling from one corner */
[data-depth="shafts"] .strat::before,[data-depth="shafts"] .engine::before,[data-depth="shafts"] .portal::before,[data-depth="shafts"] .evidence::before,[data-depth="shafts"] .access::before{inset:-10% -20%;transform:scaleX(var(--sx,1));background:repeating-linear-gradient(112deg,transparent 0 90px,rgba(180,198,255,.07) 120px 150px,transparent 190px 300px,rgba(180,198,255,.045) 330px 350px,transparent 380px 520px);background-size:200% 100%;filter:blur(14px);-webkit-mask-image:radial-gradient(ellipse 75% 90% at 12% 0%,#000 0%,rgba(0,0,0,.45) 45%,transparent 80%);mask-image:radial-gradient(ellipse 75% 90% at 12% 0%,#000 0%,rgba(0,0,0,.45) 45%,transparent 80%);animation:qrShaft 60s linear infinite}
[data-depth="shafts"] .strat::after,[data-depth="shafts"] .engine::after,[data-depth="shafts"] .portal::after,[data-depth="shafts"] .evidence::after,[data-depth="shafts"] .access::after{top:-180px;left:-120px;width:620px;height:420px;transform:scaleX(var(--sx,1));transform-origin:calc(50% + 120px) 0;background:radial-gradient(closest-side,rgba(200,214,255,.14),rgba(200,214,255,.04) 50%,transparent)}
[data-depth="shafts"] .strat,[data-depth="shafts"] .portal,[data-depth="shafts"] .access{--sx:-1}
[data-depth="shafts"] .strat::after,[data-depth="shafts"] .portal::after,[data-depth="shafts"] .access::after{left:auto;right:-120px}
@keyframes qrShaft{to{background-position:-100% 0}}

/* 4 · Bokeh — out-of-focus light at two focal depths, drifting at different scroll rates */
[data-depth="bokeh"] .strat::before,[data-depth="bokeh"] .engine::before,[data-depth="bokeh"] .portal::before,[data-depth="bokeh"] .evidence::before,[data-depth="bokeh"] .access::before{inset:-20% 0;transform:translateY(calc(var(--par,0) * 60px));background:radial-gradient(circle at 14% 22%,rgba(150,175,255,.12) 0,rgba(150,175,255,.04) 38px,transparent 64px),radial-gradient(circle at 82% 18%,rgba(216,193,142,.1) 0,rgba(216,193,142,.03) 30px,transparent 52px),radial-gradient(circle at 66% 64%,rgba(150,175,255,.09) 0,rgba(150,175,255,.03) 46px,transparent 80px),radial-gradient(circle at 34% 78%,rgba(220,226,245,.08) 0,transparent 40px),radial-gradient(circle at 92% 82%,rgba(150,175,255,.1) 0,rgba(150,175,255,.03) 34px,transparent 58px),radial-gradient(circle at 48% 36%,rgba(220,226,245,.06) 0,transparent 28px),radial-gradient(circle at 6% 60%,rgba(216,193,142,.07) 0,transparent 36px);background-position:var(--bx,0) 0}
[data-depth="bokeh"] .strat::after,[data-depth="bokeh"] .engine::after,[data-depth="bokeh"] .portal::after,[data-depth="bokeh"] .evidence::after,[data-depth="bokeh"] .access::after{inset:-30% -10%;transform:translateY(calc(var(--par,0) * 180px));filter:blur(10px);background:radial-gradient(circle at 76% 30%,rgba(150,175,255,.1) 0,rgba(150,175,255,.04) 90px,transparent 150px),radial-gradient(circle at 20% 70%,rgba(216,193,142,.07) 0,rgba(216,193,142,.02) 110px,transparent 170px),radial-gradient(circle at 58% 92%,rgba(220,226,245,.06) 0,transparent 120px);background-position:var(--bx,0) 0}
[data-depth="bokeh"] .engine{--bx:-22vw}[data-depth="bokeh"] .portal{--bx:14vw}[data-depth="bokeh"] .evidence{--bx:-8vw}[data-depth="bokeh"] .access{--bx:26vw}

/* 5 · Horizon — each chapter rests on the curved limb of a dark planet with a lit atmosphere */
[data-depth="horizon"] .strat::after,[data-depth="horizon"] .engine::after,[data-depth="horizon"] .portal::after,[data-depth="horizon"] .evidence::after,[data-depth="horizon"] .access::after{left:-110%;width:320%;aspect-ratio:1;top:calc(100% - var(--hz,150px));border-radius:50%;background:radial-gradient(closest-side,#04060B 99%,transparent 100%);box-shadow:0 -2px 0 rgba(214,224,255,.28),0 -18px 50px -6px rgba(110,145,255,.2),0 -80px 160px -20px rgba(110,145,255,.1),inset 0 30px 60px -30px rgba(120,150,255,.22)}
[data-depth="horizon"] .strat::before,[data-depth="horizon"] .engine::before,[data-depth="horizon"] .portal::before,[data-depth="horizon"] .evidence::before,[data-depth="horizon"] .access::before{left:0;right:0;bottom:0;height:calc(var(--hz,150px) + 260px);background:radial-gradient(ellipse 60% 70% at 50% 100%,rgba(110,145,255,.08),transparent 70%)}
[data-depth="horizon"] .strat{--hz:110px}[data-depth="horizon"] .engine{--hz:170px}[data-depth="horizon"] .portal{--hz:90px}[data-depth="horizon"] .evidence{--hz:140px}[data-depth="horizon"] .access{--hz:200px}

/* 6 · Spotlight — a lens follows the cursor and brings the grid into focus; edges fall to shadow */
#spot{position:fixed;inset:0;pointer-events:none;z-index:0;display:none}
[data-depth="spotlight"] #spot{display:block}
#spot::before{content:'';position:absolute;inset:0;background:linear-gradient(rgba(190,205,255,.16) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,rgba(190,205,255,.16) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(rgba(190,205,255,.22) 1px,transparent 1px) 0 0/120px 120px,linear-gradient(90deg,rgba(190,205,255,.22) 1px,transparent 1px) 0 0/120px 120px;-webkit-mask-image:radial-gradient(circle 260px at var(--mx,50%) var(--my,45%),#000 0%,rgba(0,0,0,.4) 50%,transparent 100%);mask-image:radial-gradient(circle 260px at var(--mx,50%) var(--my,45%),#000 0%,rgba(0,0,0,.4) 50%,transparent 100%)}
#spot::after{content:'';position:absolute;inset:0;background:radial-gradient(circle 420px at var(--mx,50%) var(--my,45%),rgba(140,165,255,.07),transparent 70%),radial-gradient(ellipse 85% 80% at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%)}
@media(hover:none){#spot::before{-webkit-mask-image:radial-gradient(circle 320px at 50% 40%,#000,transparent);mask-image:radial-gradient(circle 320px at 50% 40%,#000,transparent)}}
@media(prefers-reduced-motion:reduce){[data-depth="shafts"] .strat::before,[data-depth="shafts"] .engine::before,[data-depth="shafts"] .portal::before,[data-depth="shafts"] .evidence::before,[data-depth="shafts"] .access::before{animation:none}}

.arch-link{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi);text-decoration:none;padding-bottom:6px;border-bottom:1px solid rgba(216,193,142,.3);transition:border-color .25s,color .25s}
.arch-link:hover{color:#fff;border-color:rgba(255,255,255,.5)}
.arch-link span{transition:transform .3s cubic-bezier(.16,1,.3,1)}.arch-link:hover span{transform:translateX(4px)}
