@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600&display=swap');
:root{--bg:#060708;--ink:#efefed;--muted:#96999b;--line:#ffffff22;--font:Manrope,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0;background:var(--bg);color:var(--ink);font:12px/1.6 var(--font);-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{background:none;border:0;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:1px solid #fff;outline-offset:7px}img{display:block;max-width:100%}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip{position:fixed;top:-60px;left:20px;z-index:100;background:white;color:black;padding:10px}.skip:focus{top:10px}.header{position:absolute;left:4%;right:4%;top:32px;z-index:10;display:flex;align-items:center;gap:30px}.brand{font-size:18px;font-weight:500;letter-spacing:.13em;display:flex;align-items:center;gap:27px}.brand span{font-size:6px;font-weight:400;letter-spacing:.09em;opacity:.45;max-width:105px}.header nav{margin-left:auto;display:flex;gap:28px;border:1px solid #ffffff30;border-radius:40px;padding:12px 25px;background:#080a0ba6;backdrop-filter:blur(15px);font-size:9px}.mode{font-size:8px;color:#999;white-space:nowrap}.hero{height:100svh;min-height:690px;position:relative;isolation:isolate;overflow:hidden;background:#070809}.hero:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 25%,#03040599 100%);pointer-events:none;z-index:-1}#atmosphere{position:absolute;inset:0;width:100%;height:100%;z-index:-3;opacity:.8}.hero-coordinate{position:absolute;left:4%;top:145px;font-size:6px;letter-spacing:.16em;color:#a2a5a5;writing-mode:vertical-rl;transform:rotate(180deg)}.hero-media{position:absolute;inset:15% 13% 23%;z-index:-2;perspective:1400px;touch-action:pan-y;cursor:grab}.hero-media:active{cursor:grabbing}.hero-media img,.hero-media canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.hero-media canvas{opacity:0;transition:opacity .6s}.hero-media.ready canvas{opacity:1}.hero-media.ready img{opacity:0}.hero-media img{filter:drop-shadow(0 20px 50px #0008)}.hero-media.switching{animation:reel-shift .85s cubic-bezier(.18,.7,.25,1)}@keyframes reel-shift{0%{opacity:.1;transform:translateX(calc(var(--direction,1)*90px)) rotateY(calc(var(--direction,1)*9deg)) scale(.91)}100%{opacity:1;transform:none}}.hero-copy{position:absolute;left:8%;right:8%;bottom:16.5%;text-align:center;pointer-events:none}.micro{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:#9da0a1}.hero-copy .micro{font-size:7px;margin-bottom:18px;letter-spacing:.21em}h1{font-weight:300;font-size:clamp(36px,5.2vw,86px);line-height:1.04;letter-spacing:-.045em}.scene-open{pointer-events:auto;font-size:9px;display:inline-flex;gap:35px;align-items:center;border-bottom:1px solid #ffffff55;padding:10px 0;margin-top:19px}.scene-open span{font-size:17px}.hero-index{position:absolute;left:50%;bottom:45px;transform:translateX(-50%);display:flex;gap:22px}.hero-index button{font-size:8px;width:25px;padding:12px 0;border-top:1px solid #ffffff30;color:#74797b}.hero-index button.active{color:white;border-color:#fff}.reel-controls{position:absolute;left:5%;bottom:139px;display:flex;gap:18px;align-items:center}.reel-controls button{width:36px;height:36px;border:1px solid #ffffff25;border-radius:50%;font-size:15px;transition:background .25s}.reel-controls button:hover{background:#ffffff15}.reel-controls span{font-size:8px;letter-spacing:.1em;color:#acafb0}.hero-bottom{position:absolute;left:4%;right:4%;bottom:24px;display:flex;justify-content:space-between;font-size:6px;letter-spacing:.1em;color:#8b9193}.reel-hint{position:absolute;right:0;bottom:100px;writing-mode:vertical-rl;font-size:6px;letter-spacing:.12em;opacity:.6}.work{padding:110px 8% 120px;background:#090b0c}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:35px}.section-head h2{margin-top:25px}h2{font-size:clamp(42px,6vw,90px);font-weight:300;line-height:1.02;letter-spacing:-.05em}h2 span{color:#7c8386}.section-head>p{color:#92999b;font-size:11px;line-height:1.9}.filters{display:flex;gap:30px;margin:45px 0 35px;border-bottom:1px solid var(--line);flex-wrap:wrap}.filters button{padding:12px 0;font-size:9px;color:#838b8e;border-bottom:1px solid transparent}.filters button[aria-pressed=true]{border-color:white;color:white}sup{font-size:7px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px 35px}.project{min-width:0}.project-wide{grid-column:1/-1}.project-image{position:relative;display:block;width:100%;aspect-ratio:1.6;background:#0d1113;overflow:hidden;padding:30px 15px}.project-wide .project-image{aspect-ratio:2.1;padding:20px}.project-image img{height:100%;width:100%;object-fit:contain;transition:transform .8s}.project-image:hover img{transform:scale(1.025)}.project-number{position:absolute;left:16px;top:14px;font-size:6px;letter-spacing:.14em;color:#b0b5b6}.project-open{position:absolute;right:15px;bottom:15px;background:#0a0c0ddd;border:1px solid #ffffff30;border-radius:25px;font-size:7px;padding:8px 14px;opacity:0;transition:opacity .25s}.project-image:hover .project-open,.project-image:focus-visible .project-open{opacity:1}.project-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:20px}.project-caption h3{font-size:20px;font-weight:300;letter-spacing:-.03em}.project-caption>span{font-size:7px;color:#8c9598;text-align:right}.about{padding:90px 0 110px;margin:0 8%;display:grid;grid-template-columns:1fr 3fr;gap:40px;border-top:1px solid var(--line)}.about div>p{font-size:14px;color:#a0a7a9;max-width:620px;line-height:1.9;margin-top:25px}.about-links{margin-top:30px;font-size:10px}.about-links a{border-bottom:1px solid #ffffff44;padding-bottom:7px}footer{padding:70px 8% 25px;border-top:1px solid var(--line);background:#090b0c}.contact-title{font-size:clamp(50px,7vw,110px);margin-top:30px}.contact-detail{max-width:800px;margin-top:45px}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:35px}#contact-form label{display:block;font-size:10px;letter-spacing:.04em;color:#9aa2a5;margin-bottom:28px}#contact-form input,#contact-form textarea{display:block;width:100%;border:0;border-bottom:1px solid #ffffff40;border-radius:0;background:transparent;color:var(--ink);font:300 15px/1.7 var(--font);padding:12px 0;outline:none}#contact-form input:focus,#contact-form textarea:focus{border-color:#deded5}#contact-form textarea{resize:vertical;min-height:110px}.contact-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-submit-row{display:flex;align-items:center;gap:30px;min-height:50px}#contact-submit{display:flex;align-items:center;justify-content:space-between;gap:55px;font-size:11px;padding:12px 0;border-bottom:1px solid #b5b6af75;min-width:160px}#contact-submit span{font-size:20px}#contact-submit:disabled{opacity:.5;cursor:wait}#contact-status{font-size:11px;line-height:1.8;color:#bbbdb5;max-width:420px}#contact-status[data-state=error]{color:#e4bdb5}.footer-line{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:70px;padding-top:22px;font-size:7px;color:#798388}dialog{width:min(1250px,95vw);max-width:none;height:92svh;max-height:92svh;background:#090c0e;color:var(--ink);border:1px solid var(--line);padding:0}dialog::backdrop{background:#020506ed;backdrop-filter:blur(18px)}.dialog-bar{position:sticky;top:0;z-index:2;background:#090c0e;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:18px 4%;font-size:8px;letter-spacing:.12em}.dialog-bar button{font-size:12px;padding:7px}.detail-head{padding:40px 5%}.detail-head h2{font-size:clamp(40px,7vw,90px);margin:20px 0 25px}.detail-head p{color:#9ba6aa;max-width:680px;font-size:13px;line-height:1.8}.detail-figure{margin:0 5% 35px}.detail-figure img{width:100%;height:auto}.detail-figure figcaption{display:flex;justify-content:space-between;gap:20px;margin-top:12px;color:#98a5aa;font-size:9px}.cursor{display:none}.simple-view .hero{height:auto;min-height:0;padding:150px 8% 50px}.simple-view .hero-copy{position:static;text-align:left}.simple-view #atmosphere,.simple-view .hero-media,.simple-view .hero-index,.simple-view .hero-bottom,.simple-view .hero-coordinate,.simple-view .reel-controls{display:none}.simple-view .hero-copy .scene-open{display:none}.simple-view .work{padding-top:50px}.simple-view .project-wide{grid-column:auto}.simple-view .project-wide .project-image{aspect-ratio:1.6}.simple-view h1{font-size:clamp(45px,6vw,90px)}@media(max-width:800px){.brand span{display:none}.hero-media{inset:19% 5% 28%}.hero-copy{bottom:22%}.hero-index{bottom:60px}.reel-controls{bottom:133px;left:5%}.hero-bottom{font-size:5px}.header nav{gap:20px}.reel-hint{display:none}.work{padding-left:6%;padding-right:6%}}@media(max-width:550px){.header{top:22px;left:6%;right:6%;gap:16px;flex-wrap:wrap}.brand{font-size:13px;letter-spacing:.12em}.header nav{font-size:8px;gap:16px;padding:9px 16px}.header nav a:nth-child(2){display:none}.mode{font-size:7px;margin-left:auto}.hero{height:100svh;min-height:690px}.hero-coordinate{top:110px;font-size:5px;left:5%}.hero-media{inset:18% 0 33%}.hero-copy{left:5%;right:5%;bottom:24%}h1{font-size:11vw;letter-spacing:-.05em}.hero-copy .micro{font-size:6px;letter-spacing:.14em;margin-bottom:15px}.scene-open{font-size:8px;margin-top:15px;gap:30px}.hero-index{bottom:70px;gap:18px}.hero-index button{font-size:7px}.reel-controls{left:50%;transform:translateX(-50%);bottom:132px;gap:22px}.reel-controls button{width:31px;height:31px}.reel-controls span{font-size:7px}.hero-bottom{left:6%;right:6%;bottom:25px;line-height:1.8}.hero-bottom>span{max-width:170px}.work{padding:65px 7%}.section-head{display:block}.section-head>p{margin-top:20px;font-size:10px}.micro{font-size:7px}h2{font-size:53px}.filters{gap:18px;margin-top:25px}.filters button{font-size:8px}.project-grid{grid-template-columns:1fr;gap:40px}.project-wide{grid-column:auto}.project-wide .project-image{aspect-ratio:1.6;padding:30px 10px}.project-image{padding:30px 10px}.project-caption h3{font-size:19px}.project-caption>span{font-size:6px}.project-open{opacity:1}.about{margin:0 7%;padding:65px 0;grid-template-columns:1fr;gap:25px}.about div>p{font-size:12px}.about h2{font-size:44px}footer{padding:60px 7% 25px}.contact-title{font-size:52px}.contact-detail{margin-top:35px}.contact-fields{grid-template-columns:1fr;gap:0}.contact-submit-row{flex-direction:column;align-items:flex-start;gap:16px}#contact-form input,#contact-form textarea{font-size:16px}.footer-line{font-size:6px;flex-wrap:wrap}.footer-line>span:first-child{width:100%}.simple-view .hero{padding:130px 7% 40px}.detail-head p{font-size:12px}.detail-figure figcaption{font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.hero-media canvas,#atmosphere{display:none}.hero-media.ready img{opacity:1}.project-image:hover img{transform:none}}

.hero-media{inset:7% 0 16%}.reel-hint{writing-mode:initial;bottom:115px;right:0;font-size:6px;white-space:nowrap}@media(max-width:800px){.hero-media{inset:17% 0 30%}}@media(max-width:550px){.hero-media{inset:15% 0 32%}}
