:root{--paper:#f4f3ef;--ink:#111;--pink:#ef1596;--green:#19b34a;--blue:#1267e8;--orange:#ff6536;--yellow:#f5cf3d;--brown:#87582b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}.site-header{position:fixed;z-index:20;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:22px 3.2vw;mix-blend-mode:multiply}.site-header a{color:inherit;text-decoration:none;text-transform:uppercase;font-size:12px;letter-spacing:.2em}.site-header nav{display:flex;gap:28px}.mini-mark{font-weight:900}.mini-mark span{color:var(--pink);margin-left:6px}.ride{height:240vh}.ride-stage{position:sticky;top:0;height:100vh;overflow:hidden;background:radial-gradient(circle at 50% 50%,#fff 0 24%,transparent 60%),linear-gradient(115deg,transparent 0 47%,rgba(0,0,0,.035) 47.2% 47.5%,transparent 47.7%)}.eyebrow{position:absolute;left:3.2vw;top:12vh;font-size:12px;line-height:1.7;letter-spacing:.22em;text-transform:uppercase}.brand-lockup{position:absolute;left:5vw;top:38%;width:min(29vw,430px);transition:opacity .25s,transform .25s}.wordmark{width:100%;mix-blend-mode:multiply}.wheel-wrap{position:absolute;left:55%;top:51%;width:min(48vw,690px);aspect-ratio:1.24;transform:translate(-50%,-50%) scale(var(--zoom,1));transform-origin:center;will-change:transform}.wheel{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transform:rotate(var(--spin,0deg));will-change:transform}.scroll-cue{position:absolute;left:50%;bottom:4vh;transform:translateX(-50%);display:grid;justify-items:center;gap:10px}.scroll-cue span{height:30px;border-left:1px solid}.scroll-cue small,.select-cue{font-size:10px;letter-spacing:.26em}.select-cue{position:absolute;top:9vh;left:50%;transform:translateX(-50%);opacity:var(--select,0)}.project-nodes{position:absolute;inset:0;opacity:var(--select,0);pointer-events:none}.node{position:absolute;color:#fff;text-decoration:none;font-weight:800;font-size:clamp(10px,1vw,15px);line-height:1.05;text-align:center;padding:18px 15px;box-shadow:5px 5px 0 rgba(0,0,0,.13);transition:transform .18s,filter .18s}.node:hover,.node:focus-visible{transform:scale(1.08);filter:saturate(1.2);outline:3px solid #111;outline-offset:4px}.node-a{background:var(--pink);top:5%;left:39%;min-width:150px}.node-b{background:var(--green);top:43%;left:2%;min-width:130px}.node-c{background:var(--blue);top:43%;right:0;min-width:170px}.ride.is-select .project-nodes{pointer-events:auto}.projects{min-height:100vh;padding:90px 3vw 70px;border-top:1px solid #c9c8c2;background:#e8e7e1}.section-head{display:flex;justify-content:space-between;margin-bottom:28px;text-transform:uppercase;font-size:12px;letter-spacing:.2em}.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:min(65vw,740px);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:24px;cursor:grab;scrollbar-width:none}.carousel::-webkit-scrollbar{display:none}.carousel:active{cursor:grabbing}.card{scroll-snap-align:start;min-height:68vh;padding:26px;display:flex;flex-direction:column;justify-content:space-between;border:2px solid #111}.card p,.card span{font-size:12px;letter-spacing:.13em;text-transform:uppercase}.card h2{font-size:clamp(44px,7vw,100px);line-height:.85;margin:12px 0}.pink{background:var(--pink)}.green{background:var(--green)}.blue{background:var(--blue);color:white}.pixel-art{height:38vh;display:grid;place-items:center;overflow:hidden}.pixel-art img{height:120%;mix-blend-mode:multiply}.stage-art{height:38vh;background:#111;display:flex;align-items:flex-end;justify-content:center;gap:10%;padding:8%}.stage-art i{width:18%;height:65%;background:#eee}.stage-art i:nth-child(2){height:35%}.road-art{height:38vh;background:linear-gradient(#e5e4da 0 48%,#c4bba7 49% 100%);position:relative;overflow:hidden}.road-art:after{content:"";position:absolute;left:20%;right:20%;bottom:-20%;height:75%;background:#222;clip-path:polygon(45% 0,55% 0,100% 100%,0 100%)}.road-art i{position:absolute;width:9px;height:9px;background:var(--pink);top:28%;left:60%}.drag-note{text-align:center;font-size:10px;letter-spacing:.25em}.about{min-height:90vh;padding:13vh 6vw;display:grid;grid-template-columns:1fr 3fr;gap:5vw;align-content:center}.section-label{text-transform:uppercase;letter-spacing:.22em;font-size:12px}.about-copy{font-size:clamp(30px,5vw,70px);line-height:1.04;margin:0;max-width:1100px}.about a{grid-column:2;color:inherit;font-size:16px;margin-top:40px}
@media(max-width:760px){.site-header{padding:18px}.site-header nav{gap:12px}.site-header nav a{font-size:10px}.eyebrow{display:none}.brand-lockup{top:15%;left:50%;transform:translateX(-50%);width:70vw}.wheel-wrap{left:50%;top:55%;width:95vw}.node-a{min-width:105px;left:36%;padding:12px 8px}.node-b{min-width:95px;left:1%;padding:12px 8px}.node-c{min-width:118px;right:0;padding:10px 6px}.carousel{grid-auto-columns:88vw}.card{min-height:65vh;padding:18px}.about{grid-template-columns:1fr;padding:12vh 22px}.about a{grid-column:1}.about-copy{font-size:34px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.wheel{transform:none!important}.wheel-wrap{transform:translate(-50%,-50%) scale(1)!important}}

/* Ferris-wheel mechanics: the rotor moves, the structural base stays fixed. */
.wheel-rotor{position:absolute;left:12.1%;top:0;width:75.8%;height:82%;transform:rotate(var(--spin,0deg));transform-origin:50% 50%;will-change:transform}
.wheel-body{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.wheel-base{position:absolute;left:21%;bottom:0;width:58%;height:25%;object-fit:contain;mix-blend-mode:multiply}

/* Project titles are the pixels themselves, never glass overlays. */
.node{font-weight:900;padding:20px;color:#fff;box-shadow:none;outline:none;clip-path:polygon(10px 0,calc(100% - 10px) 0,calc(100% - 10px) 10px,100% 10px,100% calc(100% - 10px),calc(100% - 10px) calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,10px calc(100% - 10px),0 calc(100% - 10px),0 10px,10px 10px)}
.node:before,.node:after{content:"";position:absolute;width:12px;height:12px;background:inherit;z-index:-1}
.node:before{left:12px;top:-7px}.node:after{right:12px;bottom:-7px}
.node:hover,.node:focus-visible{transform:scale(1.1);filter:brightness(.88);outline:none}
@media(prefers-reduced-motion:reduce){.wheel-rotor{transform:none!important}}

.node{background-image:linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px);background-size:18px 18px;transform-origin:center;letter-spacing:.02em;scale:var(--node-scale,.08);transition:scale .35s cubic-bezier(.16,1,.3,1),filter .18s}
.node-a:before,.node-a:after{background:var(--pink)}.node-b:before,.node-b:after{background:var(--green)}.node-c:before,.node-c:after{background:var(--blue)}

.photo-mosaic{height:41vh;display:grid;gap:8px;overflow:hidden;background:#111}.photo-mosaic.three{grid-template-columns:1.2fr .8fr .8fr}.photo-mosaic.two{grid-template-columns:1.15fr .85fr}.photo-mosaic img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.05);transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .4s}.photo-mosaic img:nth-child(2){transform:translateY(12%)}.photo-mosaic img:nth-child(3){transform:translateY(-8%)}.card:hover .photo-mosaic img,.card:focus-visible .photo-mosaic img{transform:translateY(0) scale(1.025);filter:saturate(1.08) contrast(1.08)}.photo-mosaic.film img{object-position:center 44%}

.pixel-play{position:relative;height:34vh;margin-top:9vh;overflow:hidden;border-top:2px solid #111;border-bottom:2px solid #111;background:var(--paper)}.pixel-play span{position:absolute;width:clamp(18px,3vw,46px);aspect-ratio:1;background:#777;transform:translate(var(--px-x,0),var(--px-y,0)) rotate(var(--px-r,0deg));transition:transform .12s linear}.pixel-play span:nth-child(1){left:4%;top:18%;background:var(--pink)}.pixel-play span:nth-child(2){left:12%;top:55%}.pixel-play span:nth-child(3){left:23%;top:29%;background:var(--blue)}.pixel-play span:nth-child(4){left:31%;top:67%;background:#999}.pixel-play span:nth-child(5){left:42%;top:17%;background:var(--green)}.pixel-play span:nth-child(6){left:51%;top:49%;background:#222}.pixel-play span:nth-child(7){left:58%;top:72%;background:var(--yellow)}.pixel-play span:nth-child(8){left:66%;top:22%;background:#aaa}.pixel-play span:nth-child(9){left:74%;top:57%;background:var(--orange)}.pixel-play span:nth-child(10){left:83%;top:16%;background:#555}.pixel-play span:nth-child(11){left:91%;top:64%;background:var(--brown)}.pixel-play span:nth-child(12){left:47%;top:70%;width:10px;background:var(--pink)}
@media(max-width:760px){.photo-mosaic{height:36vh}.photo-mosaic.three{grid-template-columns:1fr 1fr}.photo-mosaic.three img:nth-child(3){display:none}.pixel-play{height:26vh}}

/* Pixel type system */
h1,h2,h3,.section-head,.select-cue,.assembly-label,.assembly-scroll,.card p,.card span,.drag-note,.section-label,.node{font-family:"Courier New",ui-monospace,monospace;font-weight:900;text-transform:uppercase;letter-spacing:.04em;font-variant-ligatures:none}
.card h2{letter-spacing:-.08em;text-shadow:2px 0 currentColor;image-rendering:pixelated}
.about-copy{font-family:"Courier New",ui-monospace,monospace;font-weight:900;letter-spacing:-.065em;line-height:.92;text-transform:uppercase}

/* Scroll-zero assembly: pixels fall into the logo before the ride begins. */
.assembly{height:175vh;background:#fff}.assembly-stage{position:sticky;top:0;height:100vh;overflow:hidden;background:#fff}.assembly-label{position:absolute;left:4vw;top:11vh;font-size:clamp(18px,2.2vw,34px);line-height:.92}.assembly-scroll{position:absolute;left:50%;bottom:4vh;transform:translateX(-50%);font-size:11px}.assembly-wheel{position:absolute;left:50%;top:55%;width:min(38vw,540px);aspect-ratio:1.2;transform:translate(-50%,-50%) scale(var(--assemble-scale,.82));opacity:var(--assemble-opacity,.08)}.assembly-wheel img:first-child{position:absolute;left:12%;top:0;width:76%;height:82%;object-fit:contain;mix-blend-mode:multiply}.assembly-wheel img:last-child{position:absolute;left:21%;bottom:0;width:58%;height:25%;object-fit:contain;mix-blend-mode:multiply}.falling-pixels{position:absolute;inset:0;pointer-events:none}.falling-pixels i{position:absolute;width:clamp(14px,2.3vw,34px);aspect-ratio:1;background:#8f8f8f;left:var(--sx);top:-10vh;translate:calc(var(--drift,0px) + var(--tx,0px)) calc(var(--drop,0px) + var(--ty,0px));rotate:var(--turn,0deg);opacity:var(--piece-opacity,1);will-change:translate,rotate}.falling-pixels i:nth-child(1){--sx:8%;--tx:37vw;--ty:41vh;background:var(--pink)}.falling-pixels i:nth-child(2){--sx:17%;--tx:31vw;--ty:49vh}.falling-pixels i:nth-child(3){--sx:25%;--tx:27vw;--ty:58vh;background:var(--green)}.falling-pixels i:nth-child(4){--sx:33%;--tx:20vw;--ty:45vh}.falling-pixels i:nth-child(5){--sx:42%;--tx:9vw;--ty:35vh;background:var(--blue)}.falling-pixels i:nth-child(6){--sx:49%;--tx:0vw;--ty:51vh;background:#222}.falling-pixels i:nth-child(7){--sx:57%;--tx:-7vw;--ty:64vh;background:var(--yellow)}.falling-pixels i:nth-child(8){--sx:64%;--tx:-12vw;--ty:45vh}.falling-pixels i:nth-child(9){--sx:72%;--tx:-17vw;--ty:55vh;background:var(--orange)}.falling-pixels i:nth-child(10){--sx:81%;--tx:-28vw;--ty:48vh}.falling-pixels i:nth-child(11){--sx:91%;--tx:-35vw;--ty:61vh;background:var(--brown)}.falling-pixels i:nth-child(12){--sx:12%;--tx:41vw;--ty:63vh;background:var(--red,#d82727)}.falling-pixels i:nth-child(13){--sx:70%;--tx:-20vw;--ty:37vh}.falling-pixels i:nth-child(14){--sx:37%;--tx:15vw;--ty:69vh;background:#333}

/* Titles physically emerge from their attached logo pixels. */
.node-a{translate:0 calc(var(--node-out,0px) * -1)}.node-b{translate:calc(var(--node-out,0px) * -1) 0}.node-c{translate:var(--node-out,0px) 0}

/* Scroll and pointer motion combine in the lower pixel playground. */
.pixel-play span{transform:translate(calc(var(--px-x,0px) + var(--scroll-x,0px)),calc(var(--px-y,0px) + var(--scroll-y,0px))) rotate(calc(var(--px-r,0deg) + var(--scroll-r,0deg)))}
@media(max-width:760px){.assembly-wheel{width:85vw}.assembly-label{left:20px}.falling-pixels i{width:20px}.assembly{height:150vh}}
@media(prefers-reduced-motion:reduce){.falling-pixels i{translate:var(--tx) var(--ty);rotate:0deg}.assembly-wheel{opacity:1;transform:translate(-50%,-50%)}}
.falling-pixels i{translate:var(--drift,0px) var(--drop,0px)}
.node-a{translate:0 var(--node-out-up,0px)}.node-b{translate:var(--node-out-left,0px) 0}.node-c{translate:var(--node-out-right,0px) 0}

/* One continuous object: the empty white intro assembles directly into the main wheel. */
.ride{height:360vh}.ride-stage{background:#fff}.wheel-wrap{opacity:var(--wheel-opacity,0);transform:translate(-50%,-50%) scale(var(--zoom,.78));will-change:transform,opacity}.assembly-label{z-index:5;opacity:var(--intro-opacity,1)}.falling-pixels{z-index:6}

/* Editorial project frames: offset rails and cut corners replace flat colour panels. */
.card{--accent:#111;position:relative;padding:18px;display:grid;grid-template-rows:1fr auto;gap:22px;background:#f7f7f4;color:#111;border:1px solid #111;box-shadow:10px 10px 0 var(--accent);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}.card:before{content:attr(data-index);position:absolute;z-index:3;top:0;right:0;width:70px;height:70px;display:grid;place-items:center;background:var(--accent);color:#fff;font-family:"Courier New",monospace;font-weight:900}.card:hover,.card:focus-visible{transform:translate(-5px,-5px);box-shadow:16px 16px 0 var(--accent);outline:none}.card>div:last-child{display:grid;grid-template-columns:1fr 2fr;align-items:end;border-top:8px solid var(--accent);padding:18px 6px 6px}.card h2{grid-column:2;margin:0 0 16px;font-size:clamp(44px,6vw,88px)}.card span{grid-column:2}.pink{--accent:var(--pink)}.green{--accent:var(--green)}.blue{--accent:var(--blue)}
@media(max-width:760px){.card>div:last-child{grid-template-columns:1fr}.card h2,.card span{grid-column:1}.card{box-shadow:7px 7px 0 var(--accent)}}

/* Chapter-one motion system: depth, guided paths, impact, then one continuous wheel scene. */
.falling-pixels i{border-radius:0;box-shadow:var(--trail-x,0) var(--trail-y,-22px) 0 color-mix(in srgb,currentColor 24%,transparent);transition:opacity .08s linear;animation:pixel-breathe 1.4s steps(2,end) infinite;animation-delay:calc(var(--i,0)*-.11s)}
.falling-pixels i:nth-child(3n){clip-path:polygon(0 0,100% 0,100% 50%,50% 50%,50% 100%,0 100%)}
.falling-pixels i:nth-child(4n){box-shadow:14px 0 0 currentColor,0 14px 0 currentColor,var(--trail-x,0) var(--trail-y,-22px) 0 color-mix(in srgb,currentColor 20%,transparent)}
.falling-pixels i:nth-child(5n){width:clamp(22px,3.4vw,52px);clip-path:polygon(0 0,66% 0,66% 33%,100% 33%,100% 100%,33% 100%,33% 66%,0 66%)}
@keyframes pixel-breathe{50%{filter:brightness(1.16)}}
.impact-rings{position:absolute;z-index:3;left:55%;top:51%;width:min(47vw,675px);aspect-ratio:1;translate:-50% -50%;pointer-events:none;opacity:var(--impact,0)}
.impact-rings i{position:absolute;inset:20%;border:4px solid #111;clip-path:polygon(0 0,40% 0,40% 4%,60% 4%,60% 0,100% 0,100% 40%,96% 40%,96% 60%,100% 60%,100% 100%,60% 100%,60% 96%,40% 96%,40% 100%,0 100%,0 60%,4% 60%,4% 40%,0 40%);transform:scale(var(--ring-scale,1))}
.impact-rings i:nth-child(2){border-color:var(--pink);transform:scale(calc(var(--ring-scale,1) * 1.22))}.impact-rings i:nth-child(3){border-color:var(--blue);transform:scale(calc(var(--ring-scale,1) * 1.48))}
.pixel-horizon{position:absolute;inset:0;overflow:hidden;opacity:var(--world-opacity,0);pointer-events:none}.pixel-horizon:before{content:"";position:absolute;left:0;right:0;bottom:0;height:18vh;background:linear-gradient(90deg,#ddd 0 8%,transparent 8% 11%,#e7e7e7 11% 24%,transparent 24% 31%,#d5d5d5 31% 44%,transparent 44% 52%,#ececec 52% 69%,transparent 69% 75%,#ddd 75% 100%);clip-path:polygon(0 74%,6% 74%,6% 28%,11% 28%,11% 64%,18% 64%,18% 40%,23% 40%,23% 82%,31% 82%,31% 12%,36% 12%,36% 68%,44% 68%,44% 45%,51% 45%,51% 77%,59% 77%,59% 25%,64% 25%,64% 62%,72% 62%,72% 35%,79% 35%,79% 72%,87% 72%,87% 18%,93% 18%,93% 58%,100% 58%,100% 100%,0 100%);transform:translateY(var(--horizon-y,40px))}
.pixel-horizon b{position:absolute;width:12px;height:12px;background:#aaa;left:var(--x);top:var(--y);transform:translateY(var(--float,0))}.pixel-horizon b:nth-child(1){--x:8%;--y:25%;background:var(--pink)}.pixel-horizon b:nth-child(2){--x:18%;--y:61%}.pixel-horizon b:nth-child(3){--x:32%;--y:18%;background:var(--green)}.pixel-horizon b:nth-child(4){--x:47%;--y:76%;background:#222}.pixel-horizon b:nth-child(5){--x:67%;--y:23%;background:var(--blue)}.pixel-horizon b:nth-child(6){--x:78%;--y:69%;background:var(--yellow)}.pixel-horizon b:nth-child(7){--x:89%;--y:34%;background:var(--orange)}.pixel-horizon b:nth-child(8){--x:95%;--y:82%;background:var(--brown)}

/* The next chapter remains inside the same flat, two-dimensional pixel world. */
.projects{position:relative;isolation:isolate;background:#ededeb;overflow:hidden}.projects>*:not(.project-scenery){position:relative;z-index:2}.project-scenery{position:absolute;z-index:0;inset:0;pointer-events:none;background-image:linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px);background-size:28px 28px;transform:translateY(var(--scene-y,0))}
.project-scenery:before,.project-scenery:after{content:"";position:absolute;background:#d7d7d2}.project-scenery:before{width:42vw;height:16vw;right:-7vw;top:8vh;clip-path:polygon(0 38%,18% 38%,18% 0,34% 0,34% 67%,55% 67%,55% 26%,73% 26%,73% 74%,100% 74%,100% 100%,0 100%)}.project-scenery:after{width:36vw;height:18vw;left:-5vw;bottom:8vh;clip-path:polygon(0 55%,20% 55%,20% 12%,43% 12%,43% 72%,65% 72%,65% 30%,82% 30%,82% 84%,100% 84%,100% 100%,0 100%)}
.project-scenery i{position:absolute;width:18px;height:18px;background:#999;left:var(--sx);top:var(--sy);transform:translate(var(--scene-x,0),var(--scene-float,0)) rotate(var(--scene-r,0))}.project-scenery i:nth-child(1){--sx:8%;--sy:18%;background:var(--pink)}.project-scenery i:nth-child(2){--sx:28%;--sy:76%;background:var(--green)}.project-scenery i:nth-child(3){--sx:45%;--sy:10%;background:var(--blue)}.project-scenery i:nth-child(4){--sx:63%;--sy:82%;background:var(--yellow)}.project-scenery i:nth-child(5){--sx:78%;--sy:27%;background:var(--orange)}.project-scenery i:nth-child(6){--sx:91%;--sy:67%;background:#333}
@media(max-width:760px){.impact-rings{width:92vw;left:50%}.pixel-horizon:before{height:13vh}.project-scenery:before,.project-scenery:after{width:65vw;height:28vw}}
@media(prefers-reduced-motion:reduce){.falling-pixels i{animation:none}.impact-rings{display:none}}

/* Exact source-coordinate assembly: white > emergence > lift > hold > landing. */
html,body{max-width:100%;overflow-x:clip}
.ride{height:430vh}
.wheel-wrap{opacity:1}
.wheel-rotor{overflow:visible}
.assembled-wheel{width:100%;height:100%;overflow:visible;display:block;mix-blend-mode:multiply}
.wheel-frame,.wheel-base,.fixed-crossbar{opacity:var(--wheel-opacity,0)}
.fixed-crossbar{position:absolute;left:12.1%;top:0;width:75.8%;height:82%;pointer-events:none;clip-path:inset(96.296% 0 0)}
.fixed-crossbar img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.wheel-base{clip-path:inset(0 0 36%)}
.impact-rings,.eyebrow{display:none}
.brand-lockup{transition:none}
@media(max-width:760px){.wheel-wrap{width:90vw;top:55%}.site-header nav{gap:10px}.site-header nav a{font-size:10px;letter-spacing:.12em}}
@media(prefers-reduced-motion:reduce){.wheel-frame,.wheel-base,.fixed-crossbar{opacity:1}}

/* Stationary structure, independently orbiting upright gondolas. */
.wheel-rotor{transform:none;will-change:auto}
.project-nodes .node{right:auto;transform:translate(-50%,-50%);transform-origin:center}
.project-nodes .node:hover,.project-nodes .node:focus-visible{transform:translate(-50%,-50%) scale(1.06)}
.assembled-wheel>g{will-change:transform}

/* Shared wheel axle: rotating ring/spokes, fixed bearing and stepped support. */
.axle-support{opacity:var(--wheel-opacity,0);pointer-events:none;shape-rendering:crispEdges}
@media(prefers-reduced-motion:reduce){.axle-support{opacity:1}}