/* ═══════════════ VORTIX · Dzypher × STIST — v4 (electric blue) ═══════════════ */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wdth,wght@12..96,75..100,200..800&family=Familjen+Grotesk:wght@400;500;700&family=Martian+Mono:wght@300;400;600&family=Instrument+Serif:ital@0;1&display=swap');

:root{
  --ink:#07070c;--ink2:#0f0f18;--paper:#EEF0F7;--paper2:#DADFEE;
  --blue:#2A19FF;--ele:#6A5BFF;--ice:#CFE0FF;--cyan:#00E5FF;--hot:#FF3DCE;--acid:#C8FF3D;--acc:var(--ele);
  --gblue:linear-gradient(120deg,#2A19FF 0%,#6A5BFF 45%,#00C6FF 100%);--gele:linear-gradient(120deg,#6A5BFF,#00E5FF);--gacid:linear-gradient(120deg,#C8FF3D,#00E5FF);
  --line:rgba(255,255,255,.14);--line-d:rgba(7,7,12,.16);
  --disp:'Bricolage Grotesque',sans-serif;--body:'Familjen Grotesk',sans-serif;--mono:'Martian Mono',ui-monospace,monospace;--serif:'Instrument Serif',serif;
  --pad:clamp(1.1rem,4vw,3.2rem);
  --logo:url('../assets/vortix-logo.png');
  --lc:1;                 /* fraction of the wordmark that is "VORTIX" (crops the '26) */
  --lratio:7.254;            /* 957*.72/96 */
  --dz:url('../assets/dzypher-logo-white.png');
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
main{overflow-x:clip}
body{background:var(--ink);color:var(--paper);transition:background-color .9s;font-family:var(--body);line-height:1.4;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:none}
::selection{background:var(--acid);color:#000}
.acid{color:var(--acid)}
::-webkit-scrollbar{width:9px}::-webkit-scrollbar-track{background:#000}::-webkit-scrollbar-thumb{background:var(--ele)}
.grain{position:fixed;inset:-150%;z-index:299;pointer-events:none;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 700ms steps(3) infinite}
@keyframes grain{0%{transform:translate(0,0)}33%{transform:translate(-4%,3%)}66%{transform:translate(3%,-2%)}100%{transform:translate(-2%,-3%)}}
.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--gacid);z-index:310}

/* cropped VORTIX wordmark (hides the '26 baked into the PNG) */
.vlogo{display:block;overflow:hidden;aspect-ratio:var(--lratio);position:relative}
.vlogo img{height:100%;width:auto;max-width:none;filter:brightness(0) invert(1)}
.vlogo.dark img{filter:brightness(0)}
.vbg{background-image:var(--logo);background-size:auto 100%;background-repeat:no-repeat;background-position:left center}

/* type */
h1,h2,h3,h4{font-family:var(--disp);font-weight:800;line-height:.88;letter-spacing:-.045em;text-transform:uppercase;font-variation-settings:'wdth' 100,'opsz' 72}
.h-xl{font-size:clamp(3rem,11.5vw,10.5rem)}.h-l{font-size:clamp(2.2rem,6vw,5.2rem)}.h-m{font-size:clamp(1.7rem,4vw,3.2rem)}
.mono{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}
.lead{font-size:clamp(1rem,1.5vw,1.28rem);max-width:54ch;line-height:1.5;opacity:.82}
.serif{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:-.02em;font-weight:400}
.stroke{-webkit-text-fill-color:transparent;-webkit-text-stroke:1.4px currentColor}
.ele{color:var(--ele)}.ice{color:var(--ice)}.cyan{color:var(--cyan)}.hot{color:var(--hot)}
.grad{background:linear-gradient(90deg,var(--acid),var(--cyan) 50%,var(--ele));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* word art */
.wa-fill{--p:0%;background:linear-gradient(90deg,currentColor var(--p),transparent var(--p));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.2px rgba(238,240,247,.35)}
.paper .wa-fill{-webkit-text-stroke-color:rgba(7,7,12,.35)}
.wa-echo{position:relative;display:inline-block}
.wa-echo i{position:absolute;inset:0;font-style:normal;pointer-events:none;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px currentColor;opacity:.3}
.wa-alt .char:nth-child(even){-webkit-text-fill-color:transparent;-webkit-text-stroke:1.2px currentColor}
.wa-rot{display:inline-grid;vertical-align:bottom;overflow:hidden;line-height:.9}
.wa-rot span{grid-area:1/1;display:block;will-change:transform}
.wa-para .w{display:inline-block}
.wa-wave .char{display:inline-block;transition:transform .35s cubic-bezier(.16,1,.3,1),color .35s}
.wa-wave:hover .char{transform:translateY(calc(-8px * var(--s,1)));color:var(--cyan)}
.wa-wave .char:nth-child(3n){--s:1.6}.wa-wave .char:nth-child(3n+1){--s:.6}
.wa-glow{text-shadow:0 0 30px rgba(106,91,255,.55),0 0 80px rgba(42,25,255,.35)}
.wa-tilt .word:nth-child(odd){transform:rotate(-2deg)}.wa-tilt .word:nth-child(even){transform:rotate(2deg);color:var(--ele)}
.line-mask{overflow:hidden;display:block;padding-bottom:.08em;margin-bottom:-.08em}
.char,.word{display:inline-block}
.circ{width:150px;height:150px;position:relative;flex:none}
.circ svg{width:100%;height:100%;overflow:visible}
.circ .core{position:absolute;inset:0;display:grid;place-items:center}
.circ .core img{width:44%;opacity:.9}

/* frame */
.wrap{padding-inline:var(--pad)}
.rule{height:1px;background:var(--line);width:100%}
section{position:relative;padding-block:clamp(3.5rem,7vw,6.5rem);background:transparent}
.sec-tag{display:flex;align-items:center;gap:.9rem;margin-bottom:clamp(1.6rem,3vw,2.6rem);border-bottom:1px solid var(--line);padding-bottom:.8rem}
.sec-tag b{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;font-weight:600;text-transform:uppercase}
.sec-tag>span:last-child{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;opacity:.55;margin-left:auto;text-align:right;text-transform:uppercase}
.sec-tag .sq{width:9px;height:9px;background:var(--acid);flex:none}
.paper{background:var(--paper);color:var(--ink)}
.paper .rule{background:var(--line-d)}.paper .sec-tag{border-color:var(--line-d)}.paper .sec-tag .sq{background:var(--blue)}
.paper ::selection{background:var(--blue);color:#fff}
.bluebg{background:var(--gblue);color:#fff}.bluebg .sec-tag{border-color:rgba(255,255,255,.3)}.bluebg .sec-tag .sq{background:#fff}
.icebg{background:var(--ice);color:var(--ink)}.icebg .sec-tag{border-color:rgba(7,7,12,.25)}.icebg .sec-tag .sq{background:var(--blue)}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem var(--pad);mix-blend-mode:difference;border-bottom:1px solid transparent;transition:transform .5s cubic-bezier(.76,0,.24,1),background .45s,padding .45s,border-color .45s}
.nav.solid{mix-blend-mode:normal;background:rgba(7,7,12,.86);backdrop-filter:blur(14px) saturate(1.2);border-bottom-color:var(--line);padding-block:.6rem}
.nav.hide{transform:translateY(-110%)}
.nav .vlogo{height:20px}
.nav-links{display:flex;gap:.15rem;list-style:none}
.nav-links a{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;padding:.55rem .75rem;display:block;position:relative}
.nav-links a::after{content:"";position:absolute;left:.75rem;right:.75rem;bottom:.42rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.16,1,.3,1)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.nav-links a[aria-current]{color:var(--cyan)}
.navcta{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid currentColor;padding:.55rem 1rem;display:flex;gap:.5rem;align-items:center}
.burger{display:none;width:34px;height:20px;position:relative;z-index:210}
.burger i{position:absolute;left:0;right:0;height:2px;background:currentColor;transition:.35s cubic-bezier(.16,1,.3,1)}
.burger i:first-child{top:2px}.burger i:last-child{bottom:2px}
.burger.on i:first-child{top:9px;transform:rotate(45deg)}.burger.on i:last-child{bottom:9px;transform:rotate(-45deg)}
@media(max-width:1000px){
  .nav{mix-blend-mode:normal}
  .nav-links{position:fixed;inset:0;z-index:199;background:var(--ink);flex-direction:column;justify-content:center;gap:0;padding:5rem var(--pad) var(--pad);clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.76,0,.24,1);overflow-y:auto;overscroll-behavior:contain}
  .nav-links.open{clip-path:inset(0 0 0 0)}
  .nav-links li{border-bottom:1px solid var(--line)}
  .nav-links a{font-family:var(--disp);font-size:clamp(2rem,9vw,3.4rem);letter-spacing:-.04em;padding:.5rem 0;font-weight:800}
  .nav-links a::after{display:none}.burger{display:block}.navcta{display:none}
}

/* cursor */
.cur{position:fixed;top:0;left:0;width:11px;height:11px;border-radius:50%;background:var(--cyan);z-index:400;pointer-events:none;mix-blend-mode:difference;will-change:transform}
.cur-l{position:fixed;top:0;left:0;z-index:400;pointer-events:none;font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;background:var(--cyan);color:#000;padding:.35rem .6rem;border-radius:99px;opacity:0;white-space:nowrap;will-change:transform}
.trail{position:fixed;top:0;left:0;width:5px;height:5px;border-radius:50%;background:var(--ele);pointer-events:none;z-index:399;mix-blend-mode:screen;will-change:transform}
@media(hover:none),(max-width:860px){.cur,.cur-l,.trail{display:none}}

/* preloader (Loomix → Vortix) */
.pre{position:fixed;inset:0;z-index:500;background:var(--ink);display:grid;place-items:center;overflow:hidden}
.pre .ring{position:absolute;left:50%;top:50%;border:1px solid rgba(106,91,255,.35);border-radius:50%;transform:translate(-50%,-50%) scale(0);width:60vmin;height:60vmin}
.pre .lx{width:min(46vw,300px);opacity:0;filter:blur(20px)}
.pre .pres{position:absolute;top:calc(50% + min(14vw,110px));font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,3vw,2rem);opacity:0;color:var(--ice)}
.pre .vx{position:absolute;width:min(70vw,640px);opacity:0}
.pre .n{position:absolute;bottom:var(--pad);left:var(--pad);font-family:var(--disp);font-size:clamp(3rem,12vw,9rem);font-weight:800;letter-spacing:-.05em;line-height:.8;opacity:.9}
.pre .cap{position:absolute;bottom:var(--pad);right:var(--pad);max-width:24ch;text-align:right;line-height:1.7;opacity:.55}
.pre .bar{position:absolute;bottom:0;left:0;height:4px;background:var(--cyan);width:0}
.pre .dot{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:50%;background:var(--ele);transform:translate(-50%,-50%) scale(0)}

/* hero */
.hero{min-height:calc(100svh - 3.4rem);min-height:calc(100vh - 3.4rem);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:6.5rem var(--pad) 0;border-bottom:1px solid var(--line);background:#07070c}
#vx{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.dz-static{position:absolute;left:50%;top:38%;width:min(44vw,360px);transform:translate(-50%,-50%);opacity:0;pointer-events:none;z-index:0}
.hero-mark,.hero-tag,.hero-sub,.hero-foot{position:relative;z-index:1}
.hero-top{position:absolute;top:5.2rem;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;gap:1rem;border-top:1px solid var(--line);padding-top:.7rem;z-index:2}
.hero-mark{width:min(94vw,1120px);aspect-ratio:var(--lratio);display:flex;filter:url(#liquid);will-change:transform;transform-style:preserve-3d}
.hero-mark i{display:block;height:100%;flex:none;background-image:var(--logo);background-repeat:no-repeat;filter:brightness(0) invert(1);will-change:transform}
.hero-tag .wa-rot span{background:var(--gacid);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.1em}
.hero-tag{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:-.04em;font-size:clamp(1.3rem,3.8vw,3rem);line-height:.95;margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:.3em;align-items:baseline}
.hero-sub{display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(1rem,4vw,3.4rem);border-top:1px solid var(--line);padding-top:1.1rem;margin-top:1.6rem}
.dl{display:grid;gap:.35rem}.dl dt{font-family:var(--mono);font-size:.58rem;letter-spacing:.18em;opacity:.55;text-transform:uppercase}
.dl dd{font-family:var(--disp);font-weight:800;font-size:clamp(.95rem,1.8vw,1.35rem);letter-spacing:-.03em;text-transform:uppercase}
.hero-cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-left:auto;align-items:center}
.hero-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0 1.2rem;margin-top:2rem;border-top:1px solid var(--line)}
.hero-rail{position:absolute;left:var(--pad);top:24vh;writing-mode:vertical-rl;font-family:var(--mono);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;opacity:.6;display:flex;gap:1.6rem;align-items:center;z-index:2}
.hero-rail::after{content:"";width:1px;height:18vh;background:linear-gradient(var(--acid),transparent)}
.hero .circ{position:absolute;right:var(--pad);top:8rem;z-index:2;width:120px;height:120px}
.hero-hint{position:absolute;right:var(--pad);top:17.5rem;text-align:right;opacity:.55;line-height:1.7;z-index:2}
.hero-stats{position:absolute;right:var(--pad);top:31vh;z-index:2;display:grid;gap:.7rem;text-align:right}
.hero-stats b{font-family:var(--disp);font-weight:800;font-size:clamp(1.6rem,3.4vw,3rem);letter-spacing:-.05em;line-height:.9;display:block;background:var(--gacid);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-stats span{font-family:var(--mono);font-size:.55rem;letter-spacing:.2em;opacity:.55;text-transform:uppercase}
.cube{position:absolute;width:var(--s);height:var(--s);transform-style:preserve-3d;z-index:1;pointer-events:none;will-change:transform}
.cube i{position:absolute;inset:0;border:1px solid rgba(207,224,255,.55);background:linear-gradient(135deg,rgba(106,91,255,.35),rgba(0,229,255,.12));backdrop-filter:blur(2px);box-shadow:inset 0 0 30px rgba(207,224,255,.25)}
.cube i:nth-child(1){transform:translateZ(calc(var(--s)/2))}.cube i:nth-child(2){transform:rotateY(180deg) translateZ(calc(var(--s)/2))}
.cube i:nth-child(3){transform:rotateY(90deg) translateZ(calc(var(--s)/2))}.cube i:nth-child(4){transform:rotateY(-90deg) translateZ(calc(var(--s)/2))}
.cube i:nth-child(5){transform:rotateX(90deg) translateZ(calc(var(--s)/2))}.cube i:nth-child(6){transform:rotateX(-90deg) translateZ(calc(var(--s)/2))}
@media(max-width:860px),(max-height:560px){
  .hero{padding-top:5.5rem;min-height:calc(100svh - 3rem);min-height:calc(100vh - 3rem)}.hero-top{top:4.6rem;flex-direction:column;gap:.15rem}
  .hero-rail{top:8.5rem;font-size:.52rem}.hero-rail::after{height:9vh}
  .hero-hint{position:static;text-align:left;font-size:.52rem;margin-bottom:.8rem;z-index:1;order:0}
  .hero-mark{order:1}.hero-tag{order:2}.hero-stats{order:3}.hero-sub{order:4}.hero-foot{order:5}
  .hero-stats{position:static;display:flex;gap:1.4rem;text-align:left;margin:1.2rem 0 .2rem;z-index:1}
  .hero-stats b{font-size:1.5rem}
  .hero .circ{width:72px;height:72px;bottom:auto;top:7.6rem;right:var(--pad)}
  .hero-cta{margin-left:0;width:100%}.hero-foot{flex-direction:column;align-items:flex-start;gap:.5rem}
  .cube{--s:40px!important}
}


/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:.7rem;padding:1rem 1.6rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;border:1px solid currentColor;overflow:hidden;isolation:isolate;cursor:pointer;width:fit-content}
.btn span{position:relative;z-index:2}
.btn::before{content:"";position:absolute;inset:0;background:var(--gele);transform:translateY(101%);transition:transform .5s cubic-bezier(.76,0,.24,1);z-index:1}
.btn:hover::before{transform:translateY(0)}.btn:hover{color:#fff;border-color:var(--ele)}
.btn-fill{background:var(--gele);color:#fff;border-color:transparent}.btn-fill::before{background:var(--acid)}.btn-fill:hover{color:#000;border-color:var(--acid)}
.btn .dotmark{width:6px;height:6px;background:currentColor;border-radius:50%;position:relative;z-index:2}

/* ticker */
.ticker{display:flex;overflow:hidden;white-space:nowrap;border-block:1px solid var(--line);padding:.85rem 0;background:rgba(7,7,12,.55)}
.ticker.bluebg{background:var(--gblue);color:#fff;border-color:transparent}
.ticker.acidbg{background:var(--gacid);color:#000;border-color:transparent}.ticker.acidbg .vlogo img,.ticker.acidbg .dzl{filter:brightness(0)}
.acidbg{background:var(--gacid);color:#000}.acidbg .sec-tag{border-color:rgba(0,0,0,.3)}.acidbg .sec-tag .sq{background:#000}.acidbg .logo-strips i{filter:brightness(0)}.ticker.icebg{background:var(--ice);color:var(--ink);border-color:#000}
.ticker.tilt{transform:rotate(-2.5deg) scale(1.04);margin-block:1rem}
.ticker-row{display:flex;flex:none;gap:2.4rem;padding-right:2.4rem;will-change:transform;align-items:center}
.ticker b{font-family:var(--disp);font-weight:800;font-size:clamp(1.1rem,2.6vw,2rem);letter-spacing:-.03em;text-transform:uppercase}
.ticker b:nth-child(4n+3){-webkit-text-fill-color:transparent;-webkit-text-stroke:1px currentColor}
.ticker i{font-style:normal;display:grid;place-items:center;font-size:1rem;opacity:.7}
.ticker .vlogo{height:1.5em}.ticker.icebg .vlogo img{filter:brightness(0)}
.ticker .dzl{height:1.8em;width:auto;opacity:.9}.ticker.icebg .dzl{filter:brightness(0)}

/* layout */
.split2{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.8rem,4.5vw,4.5rem);align-items:start}
@media(max-width:900px){.split2{grid-template-columns:1fr}}
.imgmask{overflow:hidden;position:relative;background:var(--ink2)}
.imgmask img,.imgmask video,.imgmask .ph{width:100%;height:100%;object-fit:cover;will-change:transform}
.ratio-4x5{aspect-ratio:4/5}.ratio-16x9{aspect-ratio:16/9}.ratio-1x1{aspect-ratio:1/1}.ratio-3x4{aspect-ratio:3/4}.ratio-21x9{aspect-ratio:21/9}
.ph{background:repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 10px,transparent 10px 20px),var(--ink2);display:grid;place-items:center;text-align:center;padding:1rem;border:1px dashed rgba(255,255,255,.22);position:relative}
.ph b{font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;opacity:.65;text-transform:uppercase;line-height:1.6}
.ph::after{content:"+";position:absolute;top:.6rem;right:.8rem;font-family:var(--mono);opacity:.4}
.paper .ph{background:repeating-linear-gradient(135deg,rgba(7,7,12,.07) 0 10px,transparent 10px 20px),var(--paper2);border-color:rgba(7,7,12,.25)}
.tag{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;border:1px solid var(--line);padding:.32rem .6rem;text-transform:uppercase}
.paper .tag{border-color:var(--line-d)}.tags{display:flex;gap:.4rem;flex-wrap:wrap}
.caption{position:absolute;left:.8rem;bottom:.8rem;font-family:var(--mono);font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(7,7,12,.75);padding:.4rem .6rem;backdrop-filter:blur(6px)}

/* numbered list */
.nlist{border-top:1px solid var(--line)}.paper .nlist{border-color:var(--line-d)}
.nrow{display:grid;grid-template-columns:4.2rem 1fr auto;gap:1.4rem;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid var(--line);transition:padding .5s cubic-bezier(.16,1,.3,1)}
.paper .nrow{border-color:var(--line-d)}.nrow:hover{padding-left:1rem}
.nrow .n{font-family:var(--mono);font-size:.64rem;opacity:.5}
.nrow h3{font-size:clamp(1.5rem,3.6vw,2.6rem)}.nrow p{max-width:44ch;opacity:.7;font-size:.94rem;margin-top:.5rem}
.nrow .go{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;opacity:0;transform:translateX(-10px);transition:.45s cubic-bezier(.16,1,.3,1)}
.nrow:hover .go{opacity:1;transform:none}
@media(max-width:700px){.nrow{grid-template-columns:2.6rem 1fr}.nrow .go{grid-column:2;opacity:.6;transform:none;font-size:.55rem}}

/* ORBIT arenas */
.orbit{height:100vh;height:100svh;position:relative;overflow:hidden;perspective:1400px;display:grid;place-items:center;background:radial-gradient(60vw 60vh at 50% 60%,rgba(42,25,255,.45),transparent 65%)}
.orbit .bigword{position:absolute;left:50%;top:22%;transform:translate(-50%,-50%);font-family:var(--disp);font-weight:800;font-size:clamp(4rem,18vw,16rem);letter-spacing:-.06em;text-transform:uppercase;white-space:nowrap;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px rgba(207,224,255,.22);pointer-events:none}
.orbit .bigword span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}
.orbit .hud{position:absolute;left:var(--pad);right:var(--pad);top:6rem;display:flex;justify-content:space-between;z-index:3;gap:1rem}
.orbit .hud .idx{font-family:var(--disp);font-weight:800;font-size:clamp(2rem,5vw,4rem);letter-spacing:-.05em;line-height:1}
.orbit .hud .idx small{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;opacity:.5;display:block;margin-bottom:.3rem}
.orbit .foot{position:absolute;left:var(--pad);right:var(--pad);bottom:2rem;display:flex;justify-content:space-between;z-index:3;gap:1rem;opacity:.6}
.ring{position:relative;width:1px;height:1px;transform-style:preserve-3d;will-change:transform}
.oc{position:absolute;left:50%;top:50%;width:min(70vw,360px);height:min(54vh,440px);margin:calc(min(54vh,440px)/-2) 0 0 calc(min(70vw,360px)/-2);transform-style:preserve-3d;border:1px solid rgba(207,224,255,.25);background:linear-gradient(160deg,rgba(15,15,24,.92) 0%,rgba(42,25,255,.45) 70%,rgba(0,198,255,.35) 100%);backdrop-filter:blur(10px);padding:1.6rem;display:flex;flex-direction:column;justify-content:space-between;--ac:var(--ele);backface-visibility:hidden;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.oc::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--ac)}
.oc .k{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;color:var(--ac);text-transform:uppercase}
.oc .em{font-family:var(--disp);font-weight:800;font-size:clamp(4rem,10vw,7rem);line-height:.8;letter-spacing:-.06em;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px var(--ac);opacity:.9}
.oc h3{font-size:clamp(1.6rem,3.4vw,2.5rem)}.oc p{opacity:.78;font-size:.9rem;margin-top:.7rem;max-width:34ch}
.oc .tags{margin-top:1rem}
.oc:nth-child(1){--ac:var(--ice)}.oc:nth-child(2){--ac:var(--ele)}.oc:nth-child(3){--ac:var(--cyan)}.oc:nth-child(4){--ac:var(--hot)}.oc:nth-child(5){--ac:var(--acid)}

/* horizontal */
.hpin{overflow:hidden;position:relative}
.htrack{display:flex;gap:clamp(1rem,3vw,2.5rem);padding-inline:var(--pad);will-change:transform}

.ed{flex:none;width:min(78vw,620px);border:1px solid var(--line);background:var(--ink2);display:flex;flex-direction:column}
.ed .top{display:flex;justify-content:space-between;align-items:baseline;padding:1.1rem 1.3rem;border-bottom:1px solid var(--line)}
.ed .yr{font-family:var(--disp);font-weight:800;font-size:clamp(2.4rem,6vw,4.4rem);letter-spacing:-.05em;line-height:.85}
.ed .body{padding:1.3rem;display:grid;gap:.9rem;justify-items:start}
.ed h3{font-size:1.3rem}.ed p{opacity:.72;font-size:.94rem}
.ed .ph,.ed .imgmask{aspect-ratio:16/10;width:100%}
@media(max-width:700px){.ed{width:84vw}}

/* figures */
.figs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.figs>div{padding:clamp(1.4rem,3vw,2.6rem) 1rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.figs>div:last-child{border-right:none}
.figs b{font-family:var(--disp);font-weight:800;font-size:clamp(2.6rem,8vw,6rem);letter-spacing:-.05em;display:block;line-height:.85;background:var(--gele);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.paper .figs b{background-image:linear-gradient(120deg,#2A19FF,#6A5BFF)}
.figs b span{-webkit-text-fill-color:inherit}
.figs span{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;opacity:.55;text-transform:uppercase;display:block;margin-top:.7rem}
.paper .figs,.paper .figs>div{border-color:var(--line-d)}
@media(max-width:760px){.figs{grid-template-columns:1fr 1fr}.figs>div:nth-child(2n){border-right:none}.figs b{font-size:clamp(2.2rem,13vw,3.4rem)}}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(.6rem,1.6vw,1.1rem)}
.gal .g{position:relative;overflow:hidden;cursor:pointer}
.gal .g img,.gal .g video,.gal .g .ph{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.gal .g:hover img{transform:scale(1.08)}
.gal .g .meta{position:absolute;left:0;bottom:0;padding:.55rem .75rem;background:var(--acid);color:#000;font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;transform:translateY(101%);transition:transform .45s cubic-bezier(.76,0,.24,1);text-transform:uppercase}
.gal .g:hover .meta{transform:none}.gal .g.hide{display:none}
.g-3{grid-column:span 3}.g-4{grid-column:span 4}.g-5{grid-column:span 5}.g-6{grid-column:span 6}.g-7{grid-column:span 7}.g-8{grid-column:span 8}
@media(max-width:860px),(max-height:560px){.gal{grid-template-columns:repeat(6,1fr)}.g-3,.g-4,.g-5{grid-column:span 3}.g-6,.g-7,.g-8{grid-column:span 6}}
.filters{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.6rem}
.filters button{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.5rem .9rem;border:1px solid var(--line);cursor:pointer;transition:.3s}
.filters button.on{background:var(--gacid);color:#000;border-color:transparent}
.lb{position:fixed;inset:0;z-index:450;background:rgba(7,7,12,.96);display:grid;place-items:center;opacity:0;pointer-events:none;padding:var(--pad)}
.lb.on{opacity:1;pointer-events:auto}.lb img,.lb video{max-width:92vw;max-height:84vh;object-fit:contain}.lb video{display:none;background:#000}
.lb .x{position:absolute;top:var(--pad);right:var(--pad);cursor:pointer}

/* people */
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.prs{background:var(--ink);position:relative;overflow:hidden}
.prs .im{aspect-ratio:3/4;overflow:hidden;background:var(--ink2)}
.prs img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15);transition:filter .5s,transform .8s cubic-bezier(.16,1,.3,1)}
.prs:hover img{filter:none;transform:scale(1.06)}
.prs .cap{padding:.8rem .9rem;display:flex;justify-content:space-between;gap:.6rem;align-items:baseline;border-top:1px solid var(--line)}
.prs .cap b{font-family:var(--disp);font-size:.95rem;font-weight:800;text-transform:uppercase;letter-spacing:-.02em}
.prs .cap span{font-family:var(--mono);font-size:.52rem;letter-spacing:.12em;opacity:.55;text-align:right;text-transform:uppercase}
.paper .people{background:var(--line-d);border-color:var(--line-d)}.paper .prs{background:var(--paper)}.paper .prs .cap{border-color:var(--line-d)}.paper .prs .im{background:var(--paper2)}
@media(max-width:600px){.people{grid-template-columns:1fr 1fr}}

/* schedule */
.tabs{display:flex;border:1px solid var(--line);margin-bottom:1.6rem;width:fit-content;max-width:100%;flex-wrap:wrap}
.tabs button{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.85rem 1.3rem;border-right:1px solid var(--line);cursor:pointer;transition:.25s}
.tabs button:last-child{border-right:none}.tabs button.on{background:var(--ice);color:var(--ink)}
.day{display:none}.day.on{display:block}
.slot{display:grid;grid-template-columns:8.5rem 1fr 15rem;gap:1.6rem;padding:1.5rem 0;border-bottom:1px solid var(--line);align-items:start;transition:background .4s,padding .4s}
.slot:first-child{border-top:1px solid var(--line)}.slot:hover{background:rgba(106,91,255,.08);padding-inline:1rem}
.slot .tm{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;color:var(--cyan);padding-top:.3rem}
.slot h4{font-family:var(--disp);font-weight:800;font-size:clamp(1.3rem,2.6vw,2rem);text-transform:uppercase;letter-spacing:-.03em}
.slot p{opacity:.66;font-size:.92rem;margin-top:.4rem;max-width:46ch}
.fac{display:flex;flex-wrap:wrap;gap:.7rem}.fac div{display:flex;gap:.55rem;align-items:center}
.fac img{width:38px;height:38px;object-fit:cover;filter:grayscale(1);flex:none}
.fac b{font-size:.78rem;display:block;font-weight:700}.fac span{font-family:var(--mono);font-size:.52rem;opacity:.55;letter-spacing:.08em}
@media(max-width:880px){.slot{grid-template-columns:1fr;gap:.8rem}.slot .tm{padding-top:0}}

/* faq */
.faq details{border-bottom:1px solid var(--line-d);padding:1.3rem 0}
.faq summary{list-style:none;cursor:pointer;display:flex;gap:1rem;align-items:baseline;font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:clamp(1rem,2.2vw,1.5rem);letter-spacing:-.03em}
.faq summary::-webkit-details-marker{display:none}.faq summary .q{font-family:var(--mono);font-size:.6rem;opacity:.5;flex:none}
.faq summary::after{content:"+";margin-left:auto;font-family:var(--mono);font-size:1.1rem;transition:transform .35s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{opacity:.72;margin:.9rem 0 0 3.2rem;max-width:56ch;font-size:.95rem}
@media(max-width:600px){.faq p{margin-left:0}}

/* logo art */
.logo-strips{width:100%;max-width:1300px;margin-inline:auto;aspect-ratio:var(--lratio);display:flex;flex-direction:column;gap:2px}
.logo-strips i{display:block;flex:1;background-image:var(--logo);background-size:auto var(--sh);background-repeat:no-repeat;filter:brightness(0) invert(1);will-change:transform}
.paper .logo-strips i,.icebg .logo-strips i{filter:brightness(0)}
.logo-echo{position:relative;height:clamp(120px,22vw,300px)}
.logo-echo .vlogo{position:absolute;left:0;top:0;width:100%;will-change:transform}
.logo-echo .vlogo:nth-child(2) img{filter:brightness(0) invert(64%) sepia(93%) saturate(2000%) hue-rotate(155deg)}
.logo-echo .vlogo:nth-child(3) img{filter:brightness(0) invert(38%) sepia(90%) saturate(4000%) hue-rotate(235deg)}
.logo-echo .vlogo:nth-child(4) img{filter:brightness(0) invert(50%) sepia(90%) saturate(4000%) hue-rotate(290deg)}
.logo-zoom{position:relative;overflow:hidden;height:70vh;display:grid;place-items:center}
.logo-zoom .vlogo{width:min(80vw,900px);will-change:transform}
.logo-spin{width:min(60vw,420px);margin-inline:auto;will-change:transform}
.logo-glitch{position:relative;display:block;width:100%}
.logo-glitch::before,.logo-glitch::after{content:"";position:absolute;inset:0;background-image:var(--logo);background-size:auto 100%;background-repeat:no-repeat;opacity:0;filter:brightness(0) invert(1)}
.logo-glitch:hover::before{opacity:1;clip-path:inset(20% 0 55% 0);transform:translateX(-1.2%);filter:brightness(0) invert(64%) sepia(93%) saturate(2000%) hue-rotate(155deg);animation:gl 1s steps(2) infinite}
.logo-glitch:hover::after{opacity:1;clip-path:inset(60% 0 10% 0);transform:translateX(1.2%);filter:brightness(0) invert(50%) sepia(90%) saturate(4000%) hue-rotate(290deg);animation:gl 1.3s steps(2) infinite reverse}
@keyframes gl{0%{clip-path:inset(10% 0 80% 0)}25%{clip-path:inset(60% 0 20% 0)}50%{clip-path:inset(30% 0 50% 0)}75%{clip-path:inset(80% 0 5% 0)}100%{clip-path:inset(40% 0 40% 0)}}
.logo-flip{perspective:1200px}.logo-flip .vlogo{width:min(70vw,700px);margin-inline:auto;transform-style:preserve-3d;will-change:transform}
/* dzypher mark art */
.dz-liquid{width:min(60vw,420px);filter:url(#liquid2);will-change:transform}
.dz-slices{position:relative;width:min(60vw,480px);aspect-ratio:868/548;margin-inline:auto}
.paper .dz-slices i{background-image:url('../assets/dzypher-logo.png')}
.dz-slices i{position:absolute;left:0;width:100%;background-image:var(--dz);background-size:100% auto;background-repeat:no-repeat;will-change:transform}
.dz-orbit{position:relative;width:min(70vw,520px);aspect-ratio:1;margin-inline:auto;display:grid;place-items:center}
.dz-orbit img{width:60%}
.dz-orbit .o{position:absolute;inset:0;border:1px solid rgba(207,224,255,.25);border-radius:50%}
.dz-orbit .o:nth-child(2){inset:12%}.dz-orbit .o:nth-child(3){inset:24%;border-style:dashed}
.dz-orbit .sat{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--cyan);box-shadow:0 0 20px var(--cyan);left:50%;top:0;margin:-6px 0 0 -6px;transform-origin:6px calc(min(70vw,520px)/2)}

/* card maker */
.maker{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}
@media(max-width:860px),(max-height:560px){.maker{grid-template-columns:1fr}}
.maker canvas{width:100%;height:auto;border:1px solid var(--line);background:#000;display:block;box-shadow:0 30px 80px rgba(42,25,255,.35)}
.maker .ctrl{display:grid;gap:.8rem}
.maker input,.maker select{background:transparent;border:1px solid var(--line-d);padding:1rem 1.1rem;color:inherit;font-family:var(--body);font-size:1rem;width:100%}
.maker input:focus{outline:none;border-color:var(--blue)}
.maker .sw{display:flex;gap:.5rem}.maker .sw button{width:36px;height:36px;border:1px solid var(--line-d);cursor:pointer}
.maker .sw button.on{outline:2px solid var(--ink);outline-offset:2px}

/* cta */
.bigcta{position:relative;overflow:hidden;background:var(--gblue);color:#fff;padding-block:clamp(4rem,9vw,8rem);text-align:center}
.bigcta .wrap{display:flex;flex-direction:column;align-items:center;position:relative}
.bigcta .ghost{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--disp);font-weight:800;font-size:clamp(8rem,30vw,26rem);opacity:.12;letter-spacing:-.06em;pointer-events:none;white-space:nowrap}
.bigcta .lead{text-align:center}
.bigcta .btn{border-color:#fff}.bigcta .btn-fill{background:#fff;color:var(--blue);border-color:#fff}

/* forms */
.form{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.form .fr{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
@media(max-width:640px){.form .fr{grid-template-columns:1fr}}
.form input,.form textarea,.form select{background:var(--ink);border:none;padding:1.1rem 1.2rem;color:var(--paper);font-family:var(--body);font-size:1rem;width:100%}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;background:#15151f}
.form ::placeholder{color:rgba(238,240,247,.4)}
.form button{background:var(--gacid);color:#000;padding:1.15rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}

/* footer */
footer{border-top:1px solid var(--line);padding-top:clamp(3rem,6vw,5rem);overflow:hidden}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;padding-bottom:3rem}
@media(max-width:840px){.fgrid{grid-template-columns:1fr 1fr}}
footer h5{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;opacity:.5;margin-bottom:1rem;text-transform:uppercase}
footer ul{list-style:none;display:grid;gap:.5rem;font-size:.92rem}footer ul a{opacity:.75}footer ul a:hover{opacity:1;color:var(--cyan)}
.fbot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;opacity:.55;border-top:1px solid var(--line);padding:1rem var(--pad);text-transform:uppercase;align-items:center}
.fbot a{color:var(--cyan)}.fbot img{height:16px;width:auto;display:inline-block;vertical-align:middle;margin-left:.4rem;opacity:.9}
.trans{position:fixed;inset:0;z-index:480;background:var(--ele);transform:translateY(100%);pointer-events:none}

/* page head */
.phead{padding:clamp(7rem,14vw,11rem) var(--pad) clamp(2rem,5vw,4rem);border-bottom:1px solid var(--line);position:relative;overflow:hidden;background:radial-gradient(70vw 60vh at 80% 20%,rgba(42,25,255,.45),transparent 60%),var(--ink)}
.phead .idx{display:block;opacity:.55;margin-bottom:1.2rem}
.phead .lead{margin-top:1.6rem;position:relative}
.phead > *{position:relative;z-index:1}
.phead .pin-logo{position:absolute;right:var(--pad);top:6rem;width:min(30vw,300px);opacity:.2;z-index:0;will-change:transform}
.phead .pin-dz{position:absolute;right:var(--pad);top:5rem;width:min(28vw,260px);opacity:.14;z-index:0;will-change:transform}

body.spin main{animation:spinall 1.2s cubic-bezier(.76,0,.24,1)}
@keyframes spinall{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}.dz-static{opacity:.8}}

/* dzypher wordmark */
.dzw{height:1.1em;width:auto;display:inline-block;vertical-align:middle;opacity:.9}
.hero-top .dzw{height:1.6em;margin-right:.5rem}
.paper .dzw,.acidbg .dzw,.icebg .dzw{filter:brightness(0)}
.dz-lockup{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.dz-lockup img{height:clamp(26px,4vw,44px);width:auto}

/* ═══ v5 hero: kinetic type + photo cards ═══ */
.blob{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0;opacity:.75;mix-blend-mode:screen}
.b1{width:70vw;height:70vw;max-width:900px;max-height:900px;left:-15vw;top:-20vw;background:radial-gradient(circle,#2A19FF,#6A5BFF 40%,transparent 70%);animation:blob 14s ease-in-out infinite alternate}
.b2{width:50vw;height:50vw;max-width:640px;max-height:640px;right:-10vw;bottom:-10vw;background:radial-gradient(circle,#C8FF3D,#00E5FF 40%,transparent 70%);opacity:.35;animation:blob 18s ease-in-out infinite alternate-reverse}
@keyframes blob{to{transform:translate(12vw,8vw) scale(1.2)}}
.kin{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;justify-content:center;gap:.4em;pointer-events:none;overflow:hidden;opacity:.9}
.kin-row{white-space:nowrap;font-family:var(--disp);font-weight:800;font-size:clamp(4rem,12vw,11rem);line-height:.95;letter-spacing:-.04em;text-transform:uppercase;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px rgba(207,224,255,.18);will-change:transform}
.kin-row.alt{-webkit-text-stroke-color:rgba(200,255,61,.16)}
.kin-row span{display:inline-block;padding-right:1em;animation:kin 40s linear infinite}
.kin-row.alt span{animation-direction:reverse;animation-duration:50s}
@keyframes kin{to{transform:translateX(-50%)}}
.pcs{position:absolute;inset:0;z-index:1;pointer-events:none}
.pc{position:absolute;margin:0;width:var(--w,15vw);max-width:260px;min-width:130px;pointer-events:auto;background:#fff;padding:.45rem .45rem 1.6rem;box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08);transform:rotate(var(--r,0deg));will-change:transform;cursor:none}
.pc .pc-m{aspect-ratio:4/3;overflow:hidden;background:#111}
.pc img,.pc video{width:100%;height:100%;object-fit:cover;display:block}
.pc figcaption{position:absolute;left:.5rem;bottom:.35rem;font-family:var(--mono);font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;color:#111}
.pc::after{content:"";position:absolute;top:-.55rem;left:50%;width:44%;height:1rem;transform:translateX(-50%) rotate(var(--t,-3deg));background:rgba(200,255,61,.85);mix-blend-mode:multiply}
.pc1{--w:17vw;--r:-7deg;--t:4deg;left:5%;top:16%}.pc2{--w:13vw;--r:5deg;--t:-2deg;left:25%;top:13%}.pc3{--w:16vw;--r:-3deg;--t:2deg;right:18%;top:13%}
.pc4{--w:12vw;--r:8deg;--t:-5deg;right:31%;top:36%}.pc5{--w:14vw;--r:-9deg;--t:3deg;left:10%;top:42%}.pc6{--w:15vw;--r:4deg;--t:-3deg;right:5%;top:38%}.pc7{--w:11vw;--r:-5deg;--t:5deg;left:43%;top:13%}
.pc:hover{z-index:5}
.stk{position:absolute;z-index:3;display:inline-flex;flex-direction:column;gap:.1rem;padding:.6rem .9rem;border:1.5px solid #000;background:var(--acid);color:#000;transform:rotate(var(--r,-6deg));box-shadow:4px 4px 0 #000;font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em}
.stk span{font-size:.5rem;opacity:.7}.stk b{font-family:var(--disp);font-size:1.05rem;letter-spacing:-.02em;display:flex;align-items:center;gap:.4rem}
.stk b i{display:inline-block;width:52px;height:8px;border:1.5px solid #000;position:relative;overflow:hidden}
.stk b i::after{content:"";position:absolute;inset:0;width:38%;background:#000;animation:load 2.4s steps(6) infinite}
@keyframes load{to{width:100%}}
.stk-a{--r:-6deg;right:calc(var(--pad) + 120px);bottom:9.4rem}.stk-b{--r:4deg;right:var(--pad);bottom:12.4rem;background:var(--cyan)}
.shine{position:absolute;left:var(--pad);right:var(--pad);height:0;z-index:2;pointer-events:none}
.hero-mark{position:relative;z-index:2}
.hero-mark::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);mix-blend-mode:overlay;transform:translateX(-120%);animation:sweep 5s ease-in-out infinite}
@keyframes sweep{20%{transform:translateX(-120%)}60%{transform:translateX(120%)}100%{transform:translateX(120%)}}
@media(max-width:860px),(max-height:560px){
  .pc{max-width:150px;min-width:100px;padding:.3rem .3rem 1.1rem}.pc figcaption{font-size:.42rem}
  .pc{max-width:132px;min-width:92px}
  .pc1{--w:25vw;left:1.5%;top:15%}.pc2{--w:21vw;left:37%;top:13.5%}.pc3{--w:25vw;right:1.5%;top:15%}
  .pc4{--w:21vw;right:2%;top:26.5%}.pc5{--w:23vw;left:4%;top:26.5%}.pc6{--w:21vw;left:39.5%;top:28.5%}.pc7{display:none}
  .hero .circ{top:auto;left:auto;right:var(--pad);bottom:.9rem;transform:none;width:58px;height:58px;z-index:4}
  .hero-sub{gap:.7rem 1.4rem;padding-top:.8rem;margin-top:1rem}.dl dd{font-size:.82rem}.dl dt{font-size:.5rem}.hero-tag{font-size:1.5rem;margin-top:.8rem}
  .hero-foot{padding:.7rem 0 .9rem;margin-top:1.2rem}.stk{padding:.45rem .7rem}.stk b{font-size:.9rem}.stk-b{margin-top:-2.6rem}.hero-cta .btn{padding:.85rem 1.2rem}
  .stk{position:relative;right:auto;left:auto;bottom:auto;top:auto;order:3;align-self:flex-start;margin-top:.9rem;--r:-3deg}.stk-b{align-self:flex-end;margin-top:-2.2rem;--r:3deg}
  .hero-mark{order:1}.hero-tag{order:2}.hero-sub{order:4}.hero-foot{order:5}
  .kin-row{font-size:clamp(3rem,22vw,6rem)}
  .hero-hint{display:none}
}

/* ═══ story (pinned numbers) ═══ */
.story{height:100vh;height:100svh;position:relative;overflow:hidden;padding:0;display:grid;place-items:center;color:#fff}
.st-bg{position:absolute;inset:0;z-index:0}
.st-ph{position:absolute;inset:0;overflow:hidden;will-change:transform}
.st-ph i{position:absolute;inset:0;background-size:cover;background-position:50% 30%;will-change:transform}
.st-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,12,.55),rgba(7,7,12,.85))}
.st-hud,.st-foot{position:absolute;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:center;z-index:3;opacity:.8}
.st-hud{top:5.6rem}.st-foot{bottom:1.6rem}
.st-dots{display:flex;gap:.4rem}.st-dots i{width:22px;height:3px;background:rgba(255,255,255,.25);transition:background .3s}.st-dots i.on{background:var(--acid)}
.st-slides{position:relative;z-index:2;width:min(1100px,92vw);height:60vh}
.st{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;will-change:transform,opacity}
.st b{font-family:var(--disp);font-weight:800;font-size:clamp(6rem,22vw,20rem);line-height:.8;letter-spacing:-.06em;background:var(--gacid);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:block}
.st h3{font-size:clamp(1.6rem,4vw,3.4rem);margin-top:.6rem}
.st p{max-width:44ch;opacity:.8;margin-top:.8rem;font-size:clamp(.95rem,1.4vw,1.15rem)}
@media(max-width:700px){.st b{font-size:clamp(5rem,30vw,9rem)}.st h3{font-size:1.6rem}}

/* ═══ v5.1 ═══ */
/* faces sit in the upper third of most of these frames — keep them */
.pc img,.pc video,.gal .g img,.gal .g video,.imgmask img,.imgmask video,.prs img{object-position:50% 28%}

/* film strips */
.strips{overflow:hidden;display:grid;gap:.7rem;padding-block:.5rem}
.strip{display:flex;gap:.7rem;width:max-content;will-change:transform}
.strip img,.strip video{height:clamp(110px,16vw,190px);width:auto;aspect-ratio:3/2;object-fit:cover;object-position:50% 28%;display:block;border:1px solid var(--line)}
.credit{display:inline-flex;align-items:center;gap:.4em;white-space:nowrap;padding:.35em .8em;border:1px solid rgba(238,240,247,.14);border-radius:99px;background:rgba(106,91,255,.07);position:relative;overflow:hidden;transition:border-color .4s,background .4s}
.credit::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(106,91,255,.35),transparent);transform:translateX(-120%);animation:creditSweep 6s ease-in-out infinite}
@keyframes creditSweep{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.credit:hover{border-color:rgba(106,91,255,.6);background:rgba(106,91,255,.14)}
.credit>*{position:relative;z-index:1}
.credit a{color:var(--paper);opacity:.9;transition:color .3s}
.credit .lx-mark{height:1.35em;width:auto;margin-left:.15em;opacity:.85;transition:opacity .3s,transform .4s}
.credit:hover .lx-mark{opacity:1;transform:scale(1.06)}
.credit:hover a{color:var(--ele)}
.heart-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;width:1.05em;height:1.05em}
.heart{width:1.05em;height:1.05em;fill:var(--ele);display:block;transform-origin:center;filter:drop-shadow(0 0 5px rgba(106,91,255,.8))}
.heart-wrap::after{content:"";position:absolute;inset:-2px;border:1.5px solid var(--ele);border-radius:50%;opacity:0;animation:heartRing 1.8s ease-out infinite}
@keyframes heartRing{0%{transform:scale(.6);opacity:.7}70%{transform:scale(1.9);opacity:0}100%{opacity:0}}
/* mobile perf */
@media(max-width:860px),(max-height:560px){.grain{animation:none;opacity:.09}.blob{filter:blur(60px)}.kin{opacity:.7}}



@media(max-width:860px),(max-height:560px){.gal .g.night{grid-column:span 6}}
.gal .g.night img{object-position:50% 50%;object-fit:contain;background:#0b0b10}
.gal .g.night:hover img{transform:scale(1.03)}

/* ═══ v5.2 mobile hero: in-flow photo deck, no overlaps on any phone ═══ */
@media(max-width:860px),(max-height:560px){
  .hero{padding:4.3rem var(--pad) 0;justify-content:flex-start;min-height:calc(100svh - 3rem);min-height:calc(100dvh - 3rem)}
  .hero-top{position:static;order:0;flex-direction:row;justify-content:space-between;flex-wrap:wrap;gap:.3rem 1rem;padding-top:.55rem;margin-bottom:.7rem;font-size:.5rem}
  .hero-top .mono{font-size:.5rem}.hero-top .dzw{height:1.5em}
  .hero-rail,.hero-hint{display:none}
  .pcs{position:relative;inset:auto;order:1;height:clamp(170px,46vw,240px);margin:0 calc(var(--pad) * -.4) .3rem;flex:none}
  .pc{max-width:none;min-width:0;padding:.28rem .28rem 1rem}
  .pc figcaption{font-size:.4rem;bottom:.2rem;left:.35rem}
  .pc::after{height:.7rem;top:-.4rem}
  .pc1{--w:30%;left:0;top:4%}.pc2{--w:27%;left:35%;top:0}.pc3{--w:30%;right:0;left:auto;top:5%}
  .pc5{--w:28%;left:4%;top:50%;right:auto}.pc6{--w:27%;left:37%;top:47%;right:auto}.pc4{--w:28%;right:2%;left:auto;top:52%}.pc7{display:none}
  .pc1,.pc2{right:auto}
  .hero-mark{order:2;margin-top:.35rem}
  .hero-tag{order:3;font-size:clamp(1.15rem,5.6vw,1.5rem);margin-top:.55rem}
  .stk{order:4;position:relative;right:auto;left:auto;top:auto;bottom:auto;padding:.4rem .65rem;margin-top:.7rem}
  .stk span{font-size:.44rem}.stk b{font-size:.85rem}.stk b i{width:40px;height:7px}
  .stk-a{align-self:flex-start;--r:-3deg}.stk-b{align-self:flex-end;margin-top:-2.45rem;--r:3deg}
  .hero-sub{order:5;display:grid;grid-template-columns:repeat(3,auto);justify-content:space-between;gap:.55rem .8rem;padding-top:.7rem;margin-top:.8rem}
  .dl{gap:.2rem}.dl dt{font-size:.44rem}.dl dd{font-size:.72rem}
  .hero-cta{grid-column:1/-1;display:flex;flex-wrap:nowrap;gap:.5rem;margin:0;width:100%}
  .hero-cta .btn{padding:.78rem .9rem;font-size:.56rem;letter-spacing:.12em;flex:1;justify-content:center;white-space:nowrap;gap:.45rem}
  .hero-foot{order:6;position:relative;padding:.6rem 64px .7rem 0;margin-top:.8rem;gap:.25rem}
  .hero-foot .mono{font-size:.5rem}
  .hero .circ{bottom:.55rem;right:var(--pad);width:50px;height:50px;top:auto;left:auto;transform:none}
  .kin-row{font-size:clamp(2.6rem,17vw,5rem)}
}
@media(max-width:360px){.hero-cta .btn{font-size:.5rem;padding:.72rem .6rem}.dl dd{font-size:.64rem}}

@media(max-width:860px),(max-height:560px){.hero-sub{align-items:start}}
@media(max-width:860px) and (max-height:660px),(max-height:560px) and (max-height:660px){
  .hero{padding-top:3.9rem}
  .hero-top{margin-bottom:.45rem;padding-top:.45rem}
  .pcs{height:clamp(150px,42vw,176px)}
  .pc{padding:.22rem .22rem .8rem}.pc figcaption{font-size:.36rem}
  .pc1{--w:25%;left:1%;top:3%}.pc2{--w:23%;left:37%;top:0}.pc3{--w:25%;right:1%;top:4%}
  .pc5{--w:24%;left:8%;top:47%}.pc6{--w:23%;left:39%;top:45%}.pc4{--w:24%;right:5%;top:48%}
  .hero-tag{margin-top:.35rem;font-size:clamp(1.05rem,5vw,1.3rem)}
  .stk{margin-top:.45rem;padding:.3rem .55rem}.stk b{font-size:.75rem}.stk-b{margin-top:-2.1rem}
  .hero-sub{margin-top:.5rem;padding-top:.5rem;gap:.4rem .7rem}
  .hero-cta .btn{padding:.65rem .8rem}
  .hero-foot{margin-top:.5rem;padding-top:.45rem;padding-bottom:.5rem}
  .hero .circ{width:42px;height:42px;bottom:.4rem}
}

@media(max-width:860px),(max-height:560px){
  .pcs{flex:1 1 auto;height:auto;min-height:clamp(170px,46vw,240px);max-height:none}
}
@media(max-width:860px) and (max-height:660px),(max-height:560px) and (max-height:660px){.pcs{min-height:clamp(150px,42vw,176px);max-height:220px}}

@media(max-width:860px),(max-height:560px){.pc{max-width:190px}.pc3,.pc4{right:1%}}
@media(min-width:600px) and (max-width:860px){.pcs{max-height:none}.pc{max-width:230px}.pc2{left:40%}.pc6{left:41%}.hero-mark{margin-top:1.2rem}}

/* large system text (Android accessibility): buttons stack instead of clipping */
@media(max-width:860px),(max-height:560px){
  .hero-cta{flex-wrap:wrap}
  .hero-cta .btn{flex:1 1 max-content;min-width:max-content}
}

/* landscape phones & short windows: one-row photo deck sized by height */
@media(orientation:landscape) and (max-height:560px){
  .hero{padding-top:3.8rem}
  .pcs{flex:none;height:clamp(110px,30vh,150px);min-height:0;max-height:none;margin-inline:0}
  .pc{--w:auto!important;width:auto;height:92%;aspect-ratio:auto;max-width:none;padding:.22rem .22rem .8rem}
  .pc .pc-m{height:100%;aspect-ratio:4/3}
  .pc figcaption{font-size:.36rem}
  .pc1,.pc2,.pc3,.pc5,.pc6{right:auto}
  .pc1{left:0;top:4%}.pc2{left:17%;top:0}.pc5{left:34%;top:6%}.pc6{left:51%;top:1%}.pc3{left:68%;top:5%}.pc4{left:auto;right:0;top:2%}.pc7{display:none}
  .pc{height:auto;width:auto}
  .pc .pc-m{--ph:calc(clamp(110px,30vh,150px) - 1.6rem);height:var(--ph);width:calc(var(--ph) * 4 / 3);aspect-ratio:auto}
  .pc .pc-m img,.pc .pc-m video{width:100%;height:100%}
  .hero-mark{width:min(70vw,620px);margin-top:.4rem}
  .hero-tag{font-size:1.1rem;margin-top:.35rem}
  .stk{margin-top:.4rem}.stk-b{margin-top:-2.1rem;align-self:flex-start;margin-left:11rem}
  .hero-sub{grid-template-columns:repeat(3,auto) 1fr;align-items:end}
  .hero-cta{grid-column:auto;justify-content:flex-end}
  .hero-cta .btn{flex:0 0 auto}
}

/* ═══ v5.3 Android perf: same animations, cheaper to paint ═══ */
@media(max-width:860px),(max-height:560px),(hover:none){
  /* backdrop-filter is the #1 scroll cost on Android GPUs */
  .nav.solid{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(7,7,12,.95)}
  .oc,.cube i,.caption,.pill{backdrop-filter:none;-webkit-backdrop-filter:none}
  .oc{background:linear-gradient(160deg,#10101a 0%,#1d1470 70%,#0b3a55 100%)}
  /* blend modes force full-layer recomposite every frame */
  .pc::after{mix-blend-mode:normal;opacity:.8}
  .blob{mix-blend-mode:normal;filter:none;opacity:.55}
  .b1{background:radial-gradient(circle,rgba(42,25,255,.9),rgba(106,91,255,.35) 40%,transparent 70%)}
  .b2{background:radial-gradient(circle,rgba(200,255,61,.5),rgba(0,229,255,.18) 40%,transparent 70%)}
  .hero-mark::after{mix-blend-mode:normal;opacity:.35}
  .progress{mix-blend-mode:normal}
  /* static grain, no giant off-screen layer */
  .grain{inset:0;animation:none;opacity:.07}
  /* keep text-stroke kinetic rows on their own layer */
  .kin-row span{will-change:transform}
  .oc{box-shadow:none}.pc{box-shadow:0 14px 28px rgba(0,0,0,.5)}
  .gal .g img{transition:none}
}

@media(max-width:860px) and (orientation:portrait){.hero-foot{margin-top:.8rem}}

/* v5.4 menu: guaranteed full-screen, above everything, nav bar solid while open */
@media(max-width:1000px){
  .nav-links{height:100vh;height:100dvh;z-index:205;overflow-y:auto;padding-top:5rem}
  .nav:has(.nav-links.open){background:var(--ink);transform:none!important}
  .nav .burger{z-index:210;position:relative}
  .nav > a:first-child{position:relative;z-index:210}
}

/* menu open: nav bar sits solid on top of the overlay, never hides */
body.menu-open .nav{mix-blend-mode:normal;background:var(--ink);transform:none!important;z-index:220}
body.menu-open .nav-links{display:flex}
