.prototype{--paper:#e9e6de;--black:#181b18;--pad:clamp(22px,4vw,72px);background:var(--paper);color:#242a25}.prototype .intro-screen{display:none}.prototype .reveal{opacity:1;transform:none}.prototype .site-header{mix-blend-mode:normal;color:#242a25;background:linear-gradient(var(--paper),transparent);padding-top:28px}.prototype .brand,.prototype .menu-toggle{font-size:11px}.prototype .hero{background:var(--paper);color:#242a25;min-height:100svh;padding:130px var(--pad) 34px;border-bottom:1px solid #242a2530;position:relative;overflow:hidden}.prototype .hero-visual{display:none!important}.prototype .hero-identity{z-index:2;pointer-events:none;width:65%;margin:auto 0!important;position:relative!important;inset:auto!important}.prototype .hero-identity h1{letter-spacing:-.075em!important;font-size:clamp(72px,10.8vw,180px)!important;font-weight:300!important;line-height:.85!important}.prototype .hero-identity h1 span{margin:0!important;display:block!important}.prototype .hero-role{letter-spacing:-.035em!important;margin:25px 0!important;font-size:clamp(21px,2.5vw,40px)!important}.prototype .hero-foot{z-index:2;width:100%;color:#242a25!important;position:relative!important;inset:auto!important}.scene-caption{letter-spacing:.15em;color:#596052;font-size:9px;position:absolute;bottom:125px;right:4vw}#spatial-scene{pointer-events:none;position:absolute;inset:0}#spatial-scene canvas{width:100%;height:100%;display:block}.prototype .project-index-screen{color:var(--paper);height:auto;min-height:105svh;padding:100px var(--pad) 80px;background:#202820;grid-template-columns:36% 64%;gap:24px;overflow:hidden}.prototype .index-statement{border:0;justify-content:space-between;padding:35px 0}.prototype .index-statement h2{margin:35px 0 90px;font-size:clamp(44px,5.3vw,88px)}.prototype .index-footer{display:block}.prototype .index-footer nav{flex-wrap:wrap;gap:16px;margin-top:30px;display:flex}.prototype .index-arrow{display:none}.project-selector{min-width:0}.selector-toolbar{letter-spacing:.15em;border-top:1px solid #ffffff40;justify-content:space-between;padding:20px 0;font-size:10px;display:flex}.prototype .index-projects{perspective:1300px;touch-action:pan-y;height:62svh;min-height:390px;transform-style:preserve-3d;display:block;position:relative}.prototype .index-project{transform-origin:50%;background:#333b30;border:1px solid #ffffff30;width:76%;height:82%;transition:transform .65s cubic-bezier(.22,1,.36,1),opacity .65s,filter .65s;position:absolute;top:7%;left:12%;box-shadow:0 24px 55px #0005}.prototype .index-project>img{object-fit:cover!important;filter:none!important;width:100%!important;height:100%!important}.prototype .index-project-copy{color:#fff;background:linear-gradient(#0000 35%,#000b);padding:24px}.prototype .index-project-copy h3{font-size:40px}.selector-controls{border-top:1px solid #ffffff40;justify-content:space-between;align-items:center;gap:15px;padding-top:18px;font-size:10px;display:flex}.selector-controls button{cursor:pointer;background:0 0;border:1px solid #ffffff60;border-radius:50%;width:48px;height:48px;font-size:22px}.selector-controls button:hover{background:var(--paper);color:#202820}.prototype a:focus-visible,.prototype button:focus-visible{outline-offset:5px;outline:2px solid #c9a460}.prototype .concept-design{color:#000;background:#d9d5cc}.prototype .studio{background:var(--paper)}.prototype .approach{color:#000;background:#b9b5ac}.prototype footer{color:var(--paper);background:#000}.prototype .footer-link{overflow-wrap:anywhere;max-width:100%}@media (width<=800px){.prototype .site-header{padding-top:22px}.prototype .brand{font-size:9px}.prototype .hero{min-height:94svh;padding-top:110px}.prototype .hero-identity{width:100%;margin:15svh 0 auto!important}.prototype .hero-identity h1{font-size:19vw!important}.prototype .hero-role{font-size:27px!important}.scene-caption{font-size:8px;bottom:110px;right:22px}.prototype .hero-foot{font-size:8px}.prototype .project-index-screen{grid-template-columns:1fr;gap:10px;min-height:0;padding:65px 22px}.prototype .index-statement{min-height:0;padding:0}.prototype .index-statement h2{margin:0 0 24px;font-size:13vw}.prototype .index-footer{display:none}.prototype .index-projects{height:58svh;min-height:340px}.prototype .index-project{width:82%;left:9%}.prototype .index-project-copy h3{font-size:30px}.selector-controls span{text-align:center;max-width:180px;line-height:1.6}.prototype .footer-link{font-size:clamp(12px,3.4vw,24px)}}@media (prefers-reduced-motion:reduce){.prototype .index-project{transition:none}html{scroll-behavior:auto}}.prototype .hero{--hero-shade:.7;color:#f4f1e9;isolation:isolate;background:#191b18}.prototype .hero-visual{perspective:1600px;pointer-events:none;overflow:hidden;z-index:0!important;display:block!important;position:absolute!important;inset:0!important}.prototype .hero-visual img{transform-origin:50%;will-change:transform;transform:scale(1.07);object-fit:cover!important;object-position:50% 50%!important;filter:none!important;opacity:1!important;width:100%!important;max-width:none!important;height:100%!important;display:block!important}.prototype .hero-visual:after{content:"";z-index:1;pointer-events:none;position:absolute;inset:0;background:rgba(0,0,0,var(--hero-shade))!important}.prototype .hero-identity,.prototype .hero-foot{text-shadow:0 2px 24px #0005;color:#f4f1e9!important}.prototype .site-header{color:#f4f1e9;text-shadow:0 1px 12px #0008;background:linear-gradient(#0006,#0000)}.prototype.menu-open .site-header{color:#242a25;text-shadow:none;background:0 0}@media (width<=800px){.prototype .hero-visual img{object-position:50% 50%!important}}@media (prefers-reduced-motion:reduce){.prototype .hero-visual img{will-change:auto;transform:none!important}}.prototype .hero-visual:after{z-index:3}.hero-reassembly{z-index:2;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.prototype .hero-visual.is-assembling>img{visibility:hidden}@media (prefers-reduced-motion:reduce){.hero-reassembly{display:none}.prototype .hero-visual.is-assembling>img{visibility:visible}}html.room-boot .prototype .hero-visual,html.room-boot .prototype .hero-role,html.room-boot .prototype .hero-foot,html.room-boot .prototype .site-header{visibility:hidden}.prototype .hero{background:#000}.prototype .hero-visual.room-active>img{visibility:visible;opacity:var(--room-photo-opacity,0)!important;transform:translate3d(var(--room-x,0px),var(--room-y,0px),0) scale(1.07)!important}.room-scroll-canvas{z-index:2;pointer-events:none;width:100%;height:100%;transform:translate3d(var(--room-x,0px),var(--room-y,0px),0);display:block;position:absolute;inset:0}.prototype .hero-visual.room-active:after{z-index:3}html.room-scroll-ready{scroll-behavior:auto}@media (prefers-reduced-motion:reduce){html.room-boot .prototype .hero-visual,html.room-boot .prototype .hero-role,html.room-boot .prototype .hero-foot,html.room-boot .prototype .site-header{visibility:visible}.room-scroll-canvas{display:none}.prototype .hero-visual.room-active>img{opacity:1!important;transform:none!important}}@media (width<=800px){.prototype .hero{min-height:100svh;padding-bottom:calc(34px + 6svh)}}.prototype .hero{border-bottom:0!important}.prototype .hero-visual:after{background:linear-gradient(to bottom,rgba(0,0,0,var(--hero-shade)) 0%,rgba(0,0,0,var(--hero-shade)) 62%,#000 100%)!important}.prototype .project-index-screen{background:#000;border:0!important}.prototype .index-projects{touch-action:auto;overscroll-behavior-y:auto;overflow:hidden}.prototype .index-project{background:#111;box-shadow:0 24px 55px #0009}.prototype .selector-toolbar,.prototype .selector-controls{border-top-color:#ffffff25}.prototype .selector-controls button:hover{background:var(--paper);color:#000}@media (width<=800px){.prototype .index-projects{height:62svh;min-height:360px}}.prototype .hero:after{content:"";pointer-events:none;z-index:5;background:#000;height:4px;position:absolute;bottom:-1px;left:0;right:0}.prototype .project-index-screen{position:relative}.prototype .project-index-screen:before{content:"";pointer-events:none;z-index:2;background:#000;height:6px;position:absolute;top:-3px;left:0;right:0}.prototype .hero-identity h1{font-size:clamp(57.6px,8.64vw,144px)!important}.prototype .selector-toolbar{border-top:1px solid #fff}@media (width<=800px){.prototype .hero-identity h1{font-size:15.2vw!important}}.prototype .selector-controls{border-top:1px solid #fff}
