body.immersive{background:#191c19}body.immersive header{position:absolute;inset:0 0 auto;color:#efeee6;height:90px;pointer-events:none}body.immersive header a,body.immersive header button{pointer-events:auto}.immersive header .wordmark{font-size:32px;letter-spacing:-2px}.immersive header .wordmark::after{content:' / NATE EAMES';font-family:'DM Sans',sans-serif;font-weight:400;letter-spacing:.02em;font-size:10px;margin-left:25px;vertical-align:middle}.immersive header .wordmark span{display:none}.immersive header .header-label{display:none}.immersive header nav{font-size:11px;gap:26px}.immersive header nav a:hover{color:#fa563b}.journey{height:1100svh;position:relative;isolation:isolate}.journey-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:#191c19;color:#efeee6;--scene-accent:#fa563b;perspective:1800px}.journey-grain{position:absolute;inset:0;opacity:.035;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23n)'/%3E%3C/svg%3E");z-index:41}.chapter-header{position:absolute;top:115px;left:var(--pad);right:var(--pad);z-index:35;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.09em;line-height:1.5}.chapter-header>span:first-child{display:none}.chapter-location{margin-left:auto}.scene-title{position:absolute;inset:27% auto auto var(--pad);z-index:24;width:60%;pointer-events:none;will-change:transform,opacity}.scene-kicker{font-size:9px;letter-spacing:.1em;display:block;margin-bottom:23px}.scene-title h1{font-family:'Manrope',sans-serif;font-size:clamp(60px,8.2vw,145px);font-weight:500;line-height:.98;letter-spacing:-.065em;margin:0}.scene-title h1 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.065em;color:var(--scene-accent)}.scene-title>p{font-size:14px;line-height:1.6;max-width:330px;margin:30px 0 0;opacity:.8}.scene-world{position:absolute;inset:0;transform-style:preserve-3d;z-index:12;pointer-events:none;will-change:transform}.scene-panel{position:absolute;top:50%;left:50%;width:25vw;transform-style:preserve-3d;pointer-events:auto;will-change:transform,opacity;box-shadow:0 24px 80px #0003;backface-visibility:hidden}.scene-panel-inner{aspect-ratio:1.65;position:relative;overflow:hidden;background:#161816;transform-style:preserve-3d}.scene-panel img,.scene-panel video{width:100%;height:100%;object-fit:cover;display:block}.scene-panel video{position:absolute;inset:0;opacity:0;transition:opacity .5s}.scene-panel:hover video{opacity:1}.scene-panel:hover .panel-caption{opacity:1}.scene-panel:hover{cursor:none}.panel-caption{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;color:white;font-size:9px;padding:30px 13px 13px;background:linear-gradient(transparent,#0009);opacity:0;transition:opacity .3s}.brand-mark{position:absolute;top:50%;left:50%;font-family:'Manrope',sans-serif;font-weight:800;font-size:35vw;letter-spacing:-.09em;pointer-events:none;z-index:3;white-space:nowrap;opacity:0}.brand-mark span{color:var(--scene-accent)}.workflow-constellation{position:absolute;inset:0;pointer-events:none;z-index:16}.workflow-node{position:absolute;left:50%;top:50%;background:#eaf0dd;color:#20291f;width:18vw;min-width:180px;padding:22px;box-shadow:0 20px 70px #0002;opacity:0;border-radius:2px;will-change:transform,opacity}.workflow-node:nth-child(2){background:#d7c3f0}.workflow-node:nth-child(3){background:#c6f78d}.workflow-node:nth-child(4){background:#f4b89b}.workflow-node:nth-child(5){background:#d8e6f5}.node-number{font-size:8px;letter-spacing:.1em}.workflow-node h3{font-family:'Manrope';font-size:25px;letter-spacing:-.05em;font-weight:600;margin:22px 0 10px}.workflow-node p{font-size:11px;margin:0}.node-port{width:7px;height:7px;border:1px solid #20291f;border-radius:50%;display:block;position:absolute;right:10px;top:10px}.scene-note{position:absolute;bottom:105px;left:var(--pad);z-index:30;font-size:10px;pointer-events:none}.scene-note-label{font-size:8px;letter-spacing:.1em;opacity:.5}.scene-note p{line-height:1.7;margin:10px 0 0}.scene-actions{position:absolute;bottom:110px;right:var(--pad);z-index:32;display:flex;gap:15px;align-items:center}.scene-case,.scene-watch{border:1px solid currentColor;border-radius:40px;padding:13px 20px;display:flex;align-items:center;gap:20px;font-size:11px;background:none;transition:background .2s,color .2s}.scene-case:hover,.scene-watch:hover{background:var(--scene-accent);color:#191c19;border-color:var(--scene-accent)}.scene-watch[hidden]{display:none}.scene-actions svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.2}.journey-bottom{position:absolute;bottom:26px;left:var(--pad);right:var(--pad);display:flex;align-items:center;gap:30px;z-index:35}.journey-scroll,.journey-percentage{font-size:8px;letter-spacing:.09em;white-space:nowrap}.journey-progress{height:1px;background:#7a817a60;flex:1}.journey-progress i{display:block;height:2px;background:var(--scene-accent);transform:scaleX(0);transform-origin:left}.chapter-nav{position:absolute;right:var(--pad);top:35%;z-index:36;display:flex;flex-direction:column;gap:16px;align-items:flex-end}.chapter-nav button{display:flex;gap:10px;align-items:center;background:none;border:0;color:inherit;font-size:9px;letter-spacing:.03em;opacity:.4;padding:3px}.chapter-nav button[aria-current]{opacity:1}.chapter-dot{width:4px;height:4px;border:1px solid currentColor;border-radius:50%;order:2}.chapter-nav button[aria-current] .chapter-dot{background:var(--scene-accent);border-color:var(--scene-accent);width:6px;height:6px}.chapter-nav button:hover{opacity:1}.scene-cursor{position:absolute;left:0;top:0;transform:translate(-50%,-50%) scale(.6);pointer-events:none;width:70px;height:70px;display:grid;place-items:center;background:var(--scene-accent);color:#171a16;border-radius:50%;font-size:8px;letter-spacing:.05em;z-index:40;opacity:0;transition:opacity .2s,transform .2s}.scene-cursor.on{opacity:1;transform:translate(-50%,-50%) scale(1)}.experience-after{padding:110px var(--pad);background:var(--paper);color:var(--ink)}.experience-after>h2{font-family:'Manrope';font-size:clamp(50px,7vw,110px);font-weight:500;letter-spacing:-.065em;line-height:1;margin:45px 0 30px}.experience-after>p{font-size:16px;line-height:1.5;max-width:450px;margin-bottom:70px}.experience-list>a{display:grid;grid-template-columns:35px 1fr 100px 20px;align-items:center;gap:20px;border-top:1px solid var(--line);padding:22px 0}.experience-list>a>span,.experience-list small{font-size:10px}.experience-list h3{font-size:clamp(22px,2.7vw,40px);font-weight:400;letter-spacing:-.04em;margin:0;transition:transform .3s}.experience-list>a:hover h3{transform:translateX(12px);color:var(--red)}.experience-list svg{width:20px;fill:none;stroke:currentColor;stroke-width:1}.experience-upcoming{margin-top:70px;border-top:1px solid var(--line);padding-top:25px}.experience-upcoming>a{display:flex;justify-content:space-between;align-items:center;font-size:25px;letter-spacing:-.03em;padding-top:25px}.experience-upcoming>a span{font-size:10px;letter-spacing:0}.film-dialog{background:#111510;color:var(--paper);padding:80px var(--pad) 30px}.film-close{display:flex;align-items:center;gap:20px;position:absolute;right:var(--pad);top:25px;background:none;border:0;color:inherit;font-size:12px}.film-close svg{width:20px;fill:none;stroke:currentColor;stroke-width:1}.film-screen{height:75svh;display:grid;place-items:center}.film-screen video{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.film-dialog>p{font-size:11px}.chapter-anchor{position:absolute;pointer-events:none}.immersive #project-index{background:#e6462d}.immersive footer svg{width:12vw;fill:none;stroke:var(--red);stroke-width:.7}
@media(max-width:760px){.journey{height:1000svh}.immersive header{height:78px}.immersive header .wordmark::after{display:none}.immersive header nav{gap:22px}.chapter-header{top:90px;font-size:8px}.scene-title{top:19%;width:90%;z-index:24}.scene-title h1{font-size:clamp(46px,10.5vw,78px);line-height:1}.scene-kicker{font-size:7px;margin-bottom:16px}.scene-title>p{max-width:240px;font-size:11px;line-height:1.5;margin-top:18px}.scene-world{top:14%}.workflow-constellation{top:10%}.scene-panel-inner{aspect-ratio:1.5}.scene-panel{box-shadow:0 12px 40px #0004}.chapter-nav{right:var(--pad);top:auto;bottom:73px;left:var(--pad);flex-direction:row;gap:0;justify-content:space-between;align-items:center}.chapter-nav button{font-size:8px;flex-direction:column;gap:7px}.chapter-dot{order:0}.scene-note{bottom:175px;font-size:8px;max-width:155px}.scene-note-label{font-size:7px}.scene-actions{bottom:165px;gap:8px}.scene-case,.scene-watch{font-size:9px;padding:10px 13px;gap:10px}.scene-watch{position:absolute;right:0;bottom:45px;white-space:nowrap}.scene-actions svg{width:12px;height:12px}.journey-bottom{gap:15px;bottom:27px}.journey-scroll{font-size:7px;max-width:100px;white-space:normal;line-height:1.5}.journey-percentage{font-size:7px}.workflow-node{width:38vw;min-width:0;padding:15px}.workflow-node h3{font-size:19px;margin:16px 0 8px}.workflow-node p{font-size:9px}.node-number{font-size:6px}.brand-mark{font-size:50vw}.experience-after{padding-top:70px}.experience-after>h2{font-size:51px}.experience-list>a{grid-template-columns:20px 1fr 15px;gap:12px}.experience-list small{display:none}.experience-list h3{font-size:25px}.experience-upcoming>a{font-size:20px;gap:20px}.experience-upcoming>a span{font-size:8px;white-space:nowrap}.scene-cursor{display:none}.film-screen{height:65svh}}
@media(prefers-reduced-motion:reduce){.journey{height:100svh}.scene-panel{transform:none}.chapter-nav{display:none}.scene-cursor{display:none}.scene-panel video{display:none}.scene-world{pointer-events:auto}.journey-scroll{visibility:hidden}}

.scene-title{text-shadow:0 1px 18px color-mix(in srgb,var(--scene-bg) 50%,transparent)}.scene-title>p{background:color-mix(in srgb,var(--scene-bg) 80%,transparent);backdrop-filter:blur(8px);padding:5px 7px 5px 0;width:fit-content}.scene-actions a,.scene-actions button{background:color-mix(in srgb,var(--scene-bg) 85%,transparent);backdrop-filter:blur(12px)}.journey-stage[data-chapter="2"] .scene-title{top:14%;width:62%}.journey-stage[data-chapter="2"] .scene-title h1{font-size:clamp(50px,6vw,105px)}.journey-stage[data-chapter="3"] .scene-title{top:15%}.journey-stage[data-chapter="3"] .scene-title h1{font-size:clamp(50px,6vw,105px)}.workflow-node{width:16vw}
@media(max-width:760px){.journey-stage[data-chapter="2"] .scene-title,.journey-stage[data-chapter="3"] .scene-title{top:17%;width:90%}.journey-stage[data-chapter="2"] .scene-title h1,.journey-stage[data-chapter="3"] .scene-title h1{font-size:11vw}.workflow-node{width:35vw;padding:12px}.workflow-node h3{font-size:17px;margin:12px 0 6px}.workflow-node p{font-size:8px}.journey-stage[data-chapter="2"] .scene-note{display:none}.journey-stage[data-chapter="2"] .scene-actions{top:41%;bottom:auto}.scene-title>p{max-width:220px}.chapter-nav{background:color-mix(in srgb,var(--scene-bg) 80%,transparent);backdrop-filter:blur(8px);padding:8px 0}}
/* Settled compositions: one readable foreground artifact per chapter. */
.scene-title,.journey-stage[data-chapter="2"] .scene-title,.journey-stage[data-chapter="3"] .scene-title{top:13%;width:54%;text-shadow:none}
.scene-title h1,.journey-stage[data-chapter="2"] .scene-title h1,.journey-stage[data-chapter="3"] .scene-title h1{font-size:clamp(35px,4vw,68px);line-height:1.05;letter-spacing:-.05em}
.scene-kicker{margin-bottom:14px;font-size:8px}
.scene-title>p{position:absolute;left:calc(58vw - var(--pad));top:24px;width:23vw;max-width:320px;background:none;backdrop-filter:none;padding:0;margin:0;font-size:12px;line-height:1.65;opacity:.8}
.journey-stage[data-chapter="0"] .scene-title,.journey-stage[data-chapter="5"] .scene-title{top:29%;left:0;width:100%;text-align:center}
.journey-stage[data-chapter="0"] .scene-title h1,.journey-stage[data-chapter="5"] .scene-title h1{font-size:clamp(58px,8.2vw,145px);line-height:.98;letter-spacing:-.065em}
.journey-stage[data-chapter="0"] .scene-title>p,.journey-stage[data-chapter="5"] .scene-title>p{position:relative;left:auto;top:auto;width:360px;max-width:80%;margin:28px auto 0;font-size:14px}
.scene-world{top:0;perspective:none;transform-style:flat}
.scene-panel{will-change:transform,opacity;transition:filter .2s;box-shadow:0 20px 70px #0002}
.scene-panel.is-primary{box-shadow:0 26px 100px #0003}
.scene-panel.is-primary .scene-panel-inner{outline:1px solid #ffffff20}
.scene-panel.is-primary .scene-panel-inner img{object-fit:contain}
.scene-panel.is-primary .panel-caption{display:none}
.scene-panel:not(.is-primary) .panel-caption{display:none}
.focus-asset-label{position:absolute;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.12em;z-index:25;white-space:nowrap;pointer-events:none}
.scene-note{background:color-mix(in srgb,var(--scene-bg) 85%,transparent);padding:8px 10px 8px 0;backdrop-filter:blur(8px)}
.workflow-constellation{top:0;inset:0;z-index:16;transform-origin:50% 57%;will-change:opacity,transform}
.workflow-board{position:absolute;left:50%;top:57%;transform:translate(-50%,-50%);width:min(58vw,74.25vh);height:45vh;background:#edf1e4;color:#20291f;padding:25px 30px;box-shadow:0 26px 100px #0003;display:flex;flex-direction:column}
.board-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid #20291f25}
.board-heading strong{font-family:'Manrope';font-size:32px;letter-spacing:-.08em;line-height:1;font-weight:800}
.board-heading>span{text-align:right;font-size:8px;line-height:1.5;letter-spacing:.03em}
.board-flow{display:grid;grid-template-columns:1fr 70px 1.3fr;align-items:center;flex:1;min-height:0;gap:0}
.board-context{padding:20px 0}
.board-context small{font-size:7px;letter-spacing:.07em}
.board-context h3{font-family:'Manrope';font-size:clamp(20px,2.6vw,40px);line-height:1.03;font-weight:500;letter-spacing:-.05em;margin:12px 0}
.board-context p{font-size:8px;line-height:1.6;margin:0;opacity:.65}
.board-wires{width:100%;height:75%;overflow:visible}
.board-wires path{fill:none;stroke:#617b55;stroke-width:1;vector-effect:non-scaling-stroke}
.board-outputs{display:flex;flex-direction:column;justify-content:space-around;height:90%;gap:8px}
.board-outputs>div{background:#d7e5c7;padding:12px 15px}
.board-outputs>div:nth-child(2){background:#dcd0ea}
.board-outputs>div:nth-child(3){background:#e9cdbd}
.board-outputs span{font-size:6px;letter-spacing:.1em}
.board-outputs h3{font-size:clamp(11px,1.25vw,18px);letter-spacing:-.025em;font-weight:500;margin:7px 0 0}
.board-foot{display:flex;justify-content:space-between;border-top:1px solid #20291f25;padding-top:12px;font-size:7px;letter-spacing:.01em}
.chapter-nav{background:color-mix(in srgb,var(--scene-bg) 90%,transparent);backdrop-filter:blur(10px);padding:12px 10px;border-radius:4px;margin-right:-10px}
@media(max-width:760px){
 .scene-title,.journey-stage[data-chapter="2"] .scene-title,.journey-stage[data-chapter="3"] .scene-title{top:14%;width:90%;left:var(--pad)}
 .scene-title h1,.journey-stage[data-chapter="2"] .scene-title h1,.journey-stage[data-chapter="3"] .scene-title h1{font-size:8.6vw;line-height:1.04}
 .scene-title>p{position:relative;left:auto;top:auto;width:80%;max-width:320px;font-size:10px;line-height:1.5;margin:14px 0 0}
 .scene-kicker{font-size:7px;margin-bottom:10px}
 .journey-stage[data-chapter="0"] .scene-title,.journey-stage[data-chapter="5"] .scene-title{left:0;top:29%;width:100%}
 .journey-stage[data-chapter="0"] .scene-title h1,.journey-stage[data-chapter="5"] .scene-title h1{font-size:12vw}
 .journey-stage[data-chapter="0"] .scene-title>p,.journey-stage[data-chapter="5"] .scene-title>p{font-size:12px;max-width:75%}
 .scene-world{top:0}
 .focus-asset-label{font-size:7px;letter-spacing:.08em}
 .workflow-constellation{inset:0;top:0}
 .workflow-board{width:86vw;height:auto;aspect-ratio:1.65;padding:13px 16px}
 .board-heading{padding-bottom:9px}
 .board-heading strong{font-size:22px}
 .board-heading>span{font-size:6px}
 .board-flow{grid-template-columns:1fr 28px 1.3fr}
 .board-context{padding:10px 0}
 .board-context small{font-size:5px}
 .board-context h3{font-size:21px;margin:8px 0}
 .board-context p{font-size:5px}
 .board-outputs{gap:5px;height:88%}
 .board-outputs>div{padding:6px 8px}
 .board-outputs span{font-size:4px}
 .board-outputs h3{font-size:9px;margin-top:3px}
 .board-foot{font-size:5px;padding-top:7px}
 .journey-stage[data-chapter="2"] .scene-actions{top:auto;bottom:165px}
 .chapter-nav{left:var(--pad);right:var(--pad);padding:8px 0;margin:0}
}

/* Reveal playing videos on touch screens as well as desktop hover. */
.scene-panel.is-playing video{opacity:1}
.scene-panel video{pointer-events:none}

/* Billboard uses a frame from the real film as its still poster, then reveals playback. */
