@font-face{font-family:Heebo;src:url('assets/heebo-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Heebo;src:url('assets/heebo-black.ttf') format('truetype');font-weight:900;font-display:swap}
:root{--ink:#f4f3ef;--muted:#aaa8a3;--bg:#020202;--pad:clamp(23px,3.6vw,64px);--font-scale:1;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Heebo,Arial,sans-serif;overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid #89adff;outline-offset:6px}.skip{position:fixed;top:10px;right:12px;z-index:99;background:#fff;color:#000;padding:10px;transform:translateY(-150%)}.skip:focus{transform:none}
.site-header{position:fixed;z-index:20;inset:0 0 auto;display:flex;align-items:center;gap:40px;padding:22px var(--pad);background:linear-gradient(#020202 0%,#020202ee 55%,#02020200 100%)}.brand{font-family:Arial,sans-serif;font-size:29px;font-weight:900;letter-spacing:-1.4px}.site-header nav{display:flex;gap:24px;font-size:12px}.site-header nav a{padding:8px 0}.site-header button{margin-right:auto;border:1px solid #494949;padding:8px 12px;background:#090909;font-size:11px}.site-header button[aria-pressed=true]{background:#eee;color:#111}.site-header button:disabled{cursor:default}
.hero{position:relative;height:100svh;min-height:850px;isolation:isolate;overflow:hidden}.hero-visual{position:absolute;inset:0 auto 0 0;width:61%;margin:0;will-change:transform,opacity;z-index:-1}.hero-visual img{width:100%;height:100%;object-fit:contain;display:block}.hero-visual figcaption{position:absolute;left:38%;bottom:7%;font-size:10px;color:var(--muted)}.hero-copy{position:absolute;right:var(--pad);top:50%;transform:translateY(-48%);width:46%;max-width:710px;padding-left:25px;will-change:transform,opacity}.eyebrow{font-size:calc(12px * var(--font-scale));font-weight:400;color:var(--muted);margin:0 0 18px;letter-spacing:.035em;line-height:1.5}.hero h1{font-size:clamp(96px,10vw,148px);font-weight:900;line-height:.95;letter-spacing:-.075em;margin:0 0 28px;padding-left:.08em}.hero h2{font-weight:900;font-size:clamp(29px,3vw,43px);line-height:1.2;letter-spacing:-.04em;margin:0 0 22px}.body-copy{font-size:calc(17px * var(--font-scale));line-height:1.85;color:var(--muted);margin:0;max-width:365px}.hero .body-copy{margin-right:0;margin-left:auto}.line-link{display:inline-flex;align-items:center;gap:24px;border-bottom:1px solid #605f5b;padding:8px 0;margin-top:28px;font-size:calc(14px * var(--font-scale))}.line-link span{font:23px Arial}
.scene-footer{position:absolute;bottom:32px;left:var(--pad);right:var(--pad);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.04em;z-index:4}.scene-footer>span:first-child{display:flex;gap:14px}.scene-footer b{font:11px monospace;color:#ddd}.scene-cue{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}.small-brand{font:11px Arial;letter-spacing:.18em}.scroll-scene{position:relative}.sticky-stage{position:sticky;top:0;height:100svh;min-height:680px;overflow:hidden;background:#020202;isolation:isolate}.craft{height:440svh}.worlds{height:380svh}
.craft-heading{position:absolute;right:var(--pad);top:16%;width:47%}.craft h2,.worlds h2{font-size:clamp(57px,6.7vw,98px);font-weight:900;line-height:1.06;letter-spacing:-.065em;margin:0 0 25px}.particle-stage{position:absolute;left:0;top:8%;width:51%;height:81%;touch-action:pan-y}.particle-stage canvas{display:block;width:100%;height:100%}.particle-caption{position:absolute;left:50%;bottom:3%;transform:translateX(-50%);white-space:nowrap;font-size:10px;color:#939391}.craft-fallback{display:none}.step-content{position:absolute;right:var(--pad);bottom:18%;width:43%;min-height:155px}.step{position:absolute;inset:0}.step[hidden]{display:none}.step .step-count{font:11px monospace;color:#939393;display:block;margin-bottom:16px}.step h3{font-weight:900;font-size:clamp(35px,4.1vw,60px);line-height:1.15;letter-spacing:-.05em;margin:0 0 16px}.step p{color:#b2b0ab;line-height:1.8;font-size:calc(16px * var(--font-scale));max-width:410px;margin:0}.step-nav,.project-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:8px;direction:ltr}.step-nav button,.project-nav button{border:0;border-bottom:2px solid transparent;background:transparent;min-width:40px;min-height:40px;color:#969591;font:11px monospace}.step-nav button[aria-current=step],.project-nav button[aria-current=true]{color:#fff;border-color:#fff}.step-nav button:hover,.project-nav button:hover{color:#fff}
.world-heading{position:absolute;left:var(--pad);top:17%;width:44%}.world-heading .body-copy{font-size:calc(16px * var(--font-scale));max-width:380px;margin-right:0;margin-left:auto}.world-media{position:absolute;right:0;top:0;bottom:0;width:49%;z-index:-1}.world-media>img{position:absolute;width:100%;height:100%;object-fit:contain;display:block}.world-breath{position:absolute;inset:0;will-change:transform;opacity:0}.world-media.ready .world-breath{opacity:1}.world-media.ready>img{opacity:0}#world-stage{position:absolute;inset:0;perspective:1000px;overflow:hidden}.world-panel{position:absolute;inset:0;will-change:transform,opacity;backface-visibility:hidden}.world-panel img{display:block;width:100%;height:100%;object-fit:contain}.world-panel img[hidden]{display:none}.media-error{position:absolute;inset:45% 15% auto;text-align:center;color:var(--muted);font-size:14px}.project-captions,.step-content{will-change:transform,opacity}.asset-caption{position:absolute;bottom:9%;left:0;right:0;text-align:center;font-size:10px;color:var(--muted)}.project-captions{position:absolute;left:var(--pad);bottom:15%;width:44%;height:220px}.project-caption{position:absolute;inset:auto 0 0}.project-caption[hidden]{display:none}.project-caption .eyebrow{margin-bottom:13px}.project-caption h3{font-size:clamp(72px,8.8vw,130px);line-height:1;letter-spacing:-.05em;margin:0 0 12px;font-weight:900}.project-caption h3.long{font-size:clamp(54px,5.8vw,82px)}.project-caption p:last-child{font-size:calc(17px * var(--font-scale));color:#c2c0bb;margin:0}.static-projects{display:none}
.closing{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:120px var(--pad) 80px}.closing h2{font-size:clamp(58px,9vw,132px);line-height:1.03;font-weight:900;letter-spacing:-.055em;margin:0}.closing .eyebrow{margin-bottom:30px}.review-note{color:#969591;font-size:11px;line-height:1.8;margin:80px 0 0;max-width:580px}.progress-track{position:fixed;z-index:30;bottom:0;left:0;right:0;height:9px;background:#111;direction:ltr;pointer-events:none}.progress-track>div{height:100%;width:100%;transform:scaleX(0);transform-origin:left;background:repeating-linear-gradient(90deg,#e6e5e1 0 2px,transparent 2px 11px);border-block:2px solid #e6e5e1;will-change:transform}
.high-contrast{--muted:#e0e0df}.underline-links a{text-decoration:underline;text-underline-offset:4px}
.project-caption h3,.static-project h3{text-align:right}
@media(min-width:768px) and (max-height:800px){.hero{min-height:680px}.hero h1{font-size:clamp(86px,9vw,130px);margin-bottom:20px}.hero h2{margin-bottom:14px}.hero .line-link{margin-top:16px}.craft-heading,.world-heading{top:16%}.craft h2,.worlds h2{font-size:clamp(54px,6vw,88px)}.step-content{bottom:16%}.project-caption h3{font-size:clamp(68px,7vw,103px)}}
@media(min-width:768px) and (max-width:1050px){.hero h1{font-size:95px}.hero h2{font-size:29px}.body-copy{font-size:15px}.craft h2,.worlds h2{font-size:59px}.project-caption h3{font-size:85px}.project-caption h3.long{font-size:55px}.step h3{font-size:38px}.step-content{bottom:17%}.site-header{gap:28px}}
@media(max-width:767px){
 :root{--pad:23px}.site-header{padding-top:20px;gap:24px}.brand{font-size:24px}.site-header nav{font-size:10px;gap:16px}.site-header button{font-size:9px;padding:7px 8px}.hero{min-height:780px}.hero-visual{width:100%;height:42%;inset:48px 0 auto}.hero-visual figcaption{left:var(--pad);bottom:11%;font-size:9px}.hero-copy{top:auto;bottom:99px;transform:none;right:var(--pad);left:var(--pad);width:auto;max-width:none;padding:0}.hero .eyebrow{font-size:10px;margin-bottom:12px}.hero h1{font-size:clamp(74px,21vw,92px);line-height:.97;letter-spacing:-.068em;margin-bottom:17px}.hero h1 br{display:none}.hero h2{font-size:28px;margin-bottom:14px;letter-spacing:-.035em}.body-copy{font-size:calc(14px * var(--font-scale));line-height:1.7;max-width:320px}.hero .body-copy{max-width:305px}.line-link{font-size:12px;gap:18px;margin-top:16px;padding-bottom:5px}.line-link span{font-size:18px}.scene-footer{bottom:29px;font-size:9px}.small-brand{display:none}.scene-cue{font-size:8px;left:45%}.sticky-stage{min-height:720px}.craft{height:400svh}.worlds{height:300svh}.craft-heading,.world-heading{inset:99px var(--pad) auto;width:auto}.craft-heading .eyebrow,.world-heading .eyebrow{font-size:9px;margin-bottom:8px}.craft h2,.worlds h2{font-size:36px;line-height:1.09;letter-spacing:-.055em;margin:0}.craft h2 br,.worlds h2 br{display:none}.particle-stage{top:19%;left:0;width:100%;height:44%}.particle-caption{font-size:9px;bottom:0}.step-content{bottom:100px;right:var(--pad);left:var(--pad);width:auto;min-height:125px}.step h3{font-size:32px;margin-bottom:10px}.step p{font-size:13px;line-height:1.75;max-width:345px}.step .step-count{font-size:10px;margin-bottom:11px}.step-nav{left:30%;gap:0}.step-nav button,.project-nav button{min-width:34px;min-height:34px;font-size:10px}.world-heading .body-copy{display:none}.world-media{width:100%;height:60%;top:14%;bottom:auto}.asset-caption{bottom:5%;text-align:right;left:var(--pad);right:var(--pad);font-size:9px}.project-captions{bottom:96px;left:var(--pad);right:var(--pad);width:auto;height:142px}.project-caption h3{font-size:66px;letter-spacing:-.045em;margin-bottom:9px}.project-caption h3.long{font-size:48px}.project-caption .eyebrow{font-size:10px;margin-bottom:7px}.project-caption p:last-child{font-size:13px}.project-nav{left:26%}.closing{min-height:max(740px,100svh);padding-block:130px 90px}.closing h2{font-size:58px}.review-note{margin-top:60px;font-size:10px}
}
/* Reading mode is a full content layout, not a frozen pinned scene. */
.reduced .hero-visual,.reduced .hero-copy{will-change:auto!important;opacity:1!important}.reduced .hero-visual{transform:none!important}.reduced .hero-copy{transform:translateY(-48%)!important}.reduced .scroll-scene{height:auto!important}.reduced .sticky-stage{position:relative;height:auto;min-height:0;overflow:visible;padding:120px var(--pad) 100px}.reduced .craft-heading,.reduced .world-heading{position:static;width:auto;max-width:1000px;margin:0 auto 50px}.reduced .craft h2,.reduced .worlds h2{font-size:clamp(40px,6vw,82px)}.reduced .particle-stage{display:none}.reduced .craft-fallback{display:block;max-width:380px;margin:0 auto 50px}.reduced .craft-fallback img{display:block;width:100%;height:auto}.reduced .craft-fallback figcaption{font-size:11px;color:var(--muted);text-align:center}.reduced .step-content{position:static;width:auto;max-width:1000px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:55px}.reduced .step{position:static;display:block!important}.reduced .step h3{font-size:calc(32px * var(--font-scale))}.reduced .step p{font-size:calc(16px * var(--font-scale))}.reduced .step-nav,.reduced .project-nav{display:none}.reduced .world-media,.reduced .project-captions{display:none}.reduced .static-projects{display:block;max-width:1100px;margin:auto}.static-project{margin:0 0 70px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}.static-project img{display:block;width:100%;height:auto}.static-project h3{font-size:clamp(45px,6vw,80px);line-height:1.1;margin:10px 0 20px;letter-spacing:-.04em}.static-project p{font-size:calc(16px * var(--font-scale));color:var(--muted)}.static-project figcaption{font-size:11px;color:var(--muted)}.reduced .world-heading .body-copy{display:block}.reduced .progress-track{display:none}
@media(max-width:767px){.reduced .hero-copy{transform:none!important}.reduced .sticky-stage{padding-top:105px}.reduced .step-content{grid-template-columns:1fr;gap:45px}.reduced .craft-fallback{max-width:280px}.static-project{grid-template-columns:1fr;gap:0}.static-project figure{margin:0}.static-project img{max-height:500px;object-fit:contain}.static-project h3{font-size:45px}.reduced .world-heading,.reduced .craft-heading{margin-bottom:30px}.reduced .world-heading .body-copy{font-size:14px;margin-top:25px}.reduced .scroll-scene .scene-footer{position:static;margin-top:55px}}
@media(max-width:360px){.site-header{gap:15px}.site-header nav{gap:12px}.site-header button{font-size:8px}.hero{min-height:810px}.hero h1{font-size:71px}.hero h2{font-size:24px}.scene-cue{display:none}.closing h2{font-size:49px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.reduced .step-content{will-change:auto;opacity:1!important;transform:none!important}.reduced .world-breath{will-change:auto}

/* Revision 3: independent sharp device layers, three completed poses per project. */
.world-panel{background:#020202;overflow:hidden}
.world-panel .device{position:absolute;object-fit:contain;will-change:transform;backface-visibility:hidden}
.world-panel .device-desktop{width:94%;height:74%;left:0;top:10%;z-index:1}
.world-panel .device-phone{width:28%;height:51%;left:7%;top:33%;z-index:2;filter:drop-shadow(0 8px 14px #0008)}
.composition-glow{position:absolute;width:75%;height:10%;left:14%;top:78%;background:radial-gradient(ellipse,#407bb030,transparent 70%);opacity:var(--complete,0);transform:scaleX(calc(.6 + var(--complete,0)*.4))}
.story-note{position:absolute;top:calc(100% + 22px);right:0;display:flex;align-items:center;gap:18px;color:#939ba7;font-size:12px;white-space:nowrap}
.story-marks{display:flex;gap:5px;direction:rtl}.story-marks i{display:block;width:17px;height:2px;background:#30343b}.story-marks i.active{background:#9bb5d2}
@media(max-width:767px){
 .world-panel .device-desktop{width:94%;height:77%;top:2%;left:0}
 .world-panel .device-phone{height:52%;width:28%;top:27%;left:7%}
 .composition-glow{top:72%}
 .story-note{top:calc(100% + 13px);font-size:10px;gap:12px}
 .story-marks i{width:13px}
}

.device svg{display:block;width:100%;height:100%;overflow:hidden}

.device-labels{position:absolute;left:10%;right:10%;top:83%;display:flex;justify-content:space-between;color:#aab6c5;font-size:10px;opacity:var(--complete,0);transform:translateY(calc((1 - var(--complete,0))*8px))}.device-labels span{display:flex;align-items:center;gap:8px}.device-labels span:before{content:'';width:20px;height:1px;background:#5a738e}
@media(max-width:767px){.world-panel .device-desktop{width:88%;left:3%}.device-labels{top:82%;left:10%;right:10%;font-size:9px}}

/* One continuous Vanta surface. No section owns or restarts the background. */
body{background:#01060c;isolation:isolate}
#site-waves{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 65% 20%,#142131,#01060c 75%)}
#site-waves:after{content:'';position:absolute;inset:0;z-index:1;background:rgba(1,6,12,.32);pointer-events:none}
#site-waves canvas{display:block}
.sticky-stage,.world-panel{background:transparent}
.hero-visual img,.craft-fallback img,.static-project img,#film-fallback{mix-blend-mode:lighten;mask-image:radial-gradient(ellipse at center,#000 40%,transparent 73%)}
.site-header{background:linear-gradient(#01060ce8,#01060c80 65%,transparent)}
.world-heading,.craft-heading,.project-caption,.step,.hero-copy{text-shadow:0 2px 24px #01060c80}
@media(prefers-reduced-motion:reduce){#site-waves{background:#01060c}}
