@font-face{font-family:Space Grotesk;src:url('/assets/fonts/space-grotesk-latin.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:JetBrains Mono;src:url('/assets/fonts/jetbrains-mono-latin.woff2') format('woff2');font-weight:400 600;font-style:normal;font-display:swap}
:root{color-scheme:dark;--bg:#04050d;--text:#e9ebf3;--blue:#1d3bff;--soft:#91a0ff;--muted:#9199b1;--mono:'JetBrains Mono',monospace;--scroll:0}
*{box-sizing:border-box}html{scrollbar-gutter:stable}html,body{margin:0;background:var(--bg);color:var(--text);font-family:'Space Grotesk',sans-serif;min-width:280px}body{overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;cursor:pointer;background:none}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid #a5b3ff;outline-offset:7px}::selection{background:#1d3bff;color:white}[hidden]{display:none!important}
.opening{height:155svh;min-height:1040px}.stage{height:100svh;min-height:680px;position:sticky;top:0;isolation:isolate;overflow:clip;background:radial-gradient(ellipse at 60% 80%,#101945 0%,#080c1d 30%,#04050d 65%)}.artwork{position:absolute;inset:0;z-index:-2;pointer-events:none}.artwork canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity 1s}.artwork.ready canvas{opacity:1}.fallback{position:absolute;width:100%;height:100%;inset:0;opacity:.9;transition:opacity .6s}.artwork.ready .fallback{opacity:0;visibility:hidden}.shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#04050d18 0%,transparent 48%,#02040a00 77%,#02040a85 100%),radial-gradient(ellipse at 0% 15%,#04050d88,transparent 63%)}
.header{height:110px;padding:0 3.7%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:10}.brand{display:block}.brand img{display:block;width:126px;height:auto}.menu-trigger{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:17px;align-items:center;padding:16px;font-size:13px}.menu-icon{width:16px;display:flex;flex-direction:column;gap:5px}.menu-icon i{height:1px;background:#cdd4ef;width:16px;display:block;transition:width .25s}.menu-trigger:hover .menu-icon i:last-child{width:10px}.header-location{font:9px/1.9 var(--mono);text-align:right;color:#a1aac3}.header-location>span{color:#69748e}
.hero-copy{position:absolute;top:18.7%;left:3.7%;right:3.7%;z-index:2;max-width:900px;transform:translateY(calc(var(--scroll) * -70px));will-change:transform}.eyebrow{font:9px var(--mono);text-transform:uppercase;letter-spacing:.18em;color:#9ba9d4;margin:0 0 24px}.hero-copy h1{font-size:clamp(48px,5.7vw,88px);font-weight:400;line-height:1.04;letter-spacing:-.065em;margin:0}.hero-copy h1 span{color:#c0cbf1}.hero-description{font-size:13px;color:#9da9c7;line-height:1.7;margin:27px 0 0;letter-spacing:-.005em}.explore-link{display:inline-block;position:relative;font-size:13px;margin-top:35px;padding:0 0 12px;min-width:130px}.link-line{position:absolute;left:0;right:0;bottom:0;height:1px;background:#9daee3}.link-line:after{content:'';position:absolute;inset:0;background:#4063ff;transform-origin:left;transform:scaleX(0);transition:transform .4s}.explore-link:hover .link-line:after{transform:scaleX(1)}
.stage-footer{position:absolute;bottom:0;left:3.7%;right:3.7%;height:78px;display:flex;align-items:center;justify-content:space-between;z-index:3;font:9px var(--mono);color:#a4afca}.studio-signature{margin:0;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:.015em;color:#c4cce3}.scroll-cue{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:center;font-size:8px}.scroll-icon{width:10px;height:15px;border:1px solid #8b9abe;border-radius:6px;position:relative}.scroll-icon:after{content:'';position:absolute;left:3px;top:3px;height:3px;width:2px;background:#becbff;animation:scroll 2s ease infinite}@keyframes scroll{50%{transform:translateY(4px);opacity:.4}}.stage-footer button{display:flex;align-items:center;gap:9px;padding:12px 0;font:8px var(--mono);color:#a4afca}.motion-icon{font-size:12px}.scroll-progress{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:4;background:#6c83e21a}.scroll-progress>span{display:block;width:100%;height:100%;background:#566eff;transform:scaleX(var(--scroll));transform-origin:left;box-shadow:0 0 12px #274eff}
dialog{position:fixed;inset:0;margin:auto;width:490px;max-width:calc(100vw - 40px);max-height:calc(100svh - 40px);overflow:auto;border:1px solid #56689a40;padding:30px 34px 22px;background:linear-gradient(145deg,#11182c,#070a15);color:var(--text);box-shadow:0 40px 120px #0008}dialog::backdrop{background:#01030c88;backdrop-filter:blur(14px)}dialog[open]{animation:menu-in .35s cubic-bezier(.2,.7,.2,1) both}@keyframes menu-in{from{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:translateY(0)}}.menu-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}.menu-eyebrow{font:9px var(--mono);color:#8495bc;letter-spacing:.1em;text-transform:uppercase}#menu-close{display:flex;gap:18px;align-items:center;padding:6px 0;font-size:12px;color:#b7c2de}#menu-close>span{font-size:24px;font-weight:300;line-height:1}dialog nav{border-top:1px solid #52618555}dialog nav>a{display:flex;align-items:center;border-bottom:1px solid #52618555;padding:23px 0;gap:19px;font-size:41px;letter-spacing:-.045em;transition:color .2s}dialog nav>a:hover{color:#9dacff}.menu-number{font:9px var(--mono);letter-spacing:0;color:#7285b3;align-self:flex-start;margin-top:9px}.menu-plus{margin-left:auto;font:22px var(--mono);color:#7186bf;transition:transform .35s}dialog nav>a:hover .menu-plus{transform:rotate(90deg);color:#c2cdff}.menu-contact{margin:43px 0}.menu-contact p{font-size:11px;color:#7986a6;margin:0 0 10px}.menu-contact>a{font-size:20px;letter-spacing:-.035em}.menu-contact>span{display:block;font:9px var(--mono);color:#96a4c5;margin-top:12px}.menu-bottom{border-top:1px solid #52618533;padding-top:20px;display:flex;justify-content:space-between;font:8px var(--mono);color:#7786a8}
.skip-link{position:fixed;top:-90px;left:20px;z-index:100;background:#152fcb;padding:12px}.skip-link:focus{top:12px}.no-script{position:fixed;top:38px;left:50%;transform:translateX(-50%);z-index:20;display:flex;gap:20px;font-size:12px}.paused .scroll-icon:after{animation:none}.paused .hero-copy{transform:none}.paused .artwork canvas{transition:none}
@media(min-width:1500px){.hero-copy{top:20%}}
@media(max-width:900px){.hero-copy h1{font-size:clamp(45px,6.5vw,65px)}.hero-copy{top:20%;max-width:690px}.header-location{font-size:8px}.hero-description{font-size:12px}}
@media(max-width:600px){.opening{height:145svh;min-height:930px}.stage{min-height:650px}.header{height:90px;padding:0 25px}.brand img{width:109px}.menu-trigger{position:static;transform:none;font-size:12px;padding:15px 0;gap:12px}.header-location{display:none}.hero-copy{left:25px;right:22px;top:19%;transform:translateY(calc(var(--scroll) * -24px))}.eyebrow{font-size:7px;letter-spacing:.12em;margin-bottom:20px}.hero-copy h1{font-size:clamp(36px,9.6vw,56px);letter-spacing:-.06em;line-height:1.08}.hero-copy h1>br{display:initial}.hero-copy h1>span{display:inline}.hero-description{font-size:10px;margin-top:22px;line-height:1.8}.explore-link{font-size:11px;margin-top:26px;padding-bottom:10px;min-width:114px}.stage-footer{left:25px;right:25px;height:72px}.studio-signature{font-size:10px}.scroll-cue{left:0;transform:none;bottom:60px;font-size:7px;gap:8px}.scroll-icon{width:8px;height:12px}.scroll-icon:after{left:2px;top:2px}.stage-footer button{font-size:7px;gap:7px}.shade{background:linear-gradient(180deg,#04050d33,transparent 55%,#02040a11 77%,#02040aa6 100%)}dialog{max-width:calc(100vw - 32px);padding:22px}.menu-top{margin-bottom:28px}dialog nav>a{font-size:36px;padding:20px 0;gap:14px}.menu-contact{margin:32px 0}.menu-bottom{font-size:7px}.no-script{top:94px;gap:24px;width:100%;justify-content:center;font-size:11px}}
@media(max-width:350px){.header{padding:0 20px}.hero-copy{left:20px;right:18px}.hero-copy h1{font-size:35px}.hero-description{font-size:9px}.stage-footer{left:20px;right:20px}dialog nav>a{font-size:31px}.menu-bottom{font-size:6px}}
@media(max-height:740px) and (min-width:601px){.header{height:88px}.hero-copy{top:18%}.eyebrow{margin-bottom:16px}.hero-copy h1{font-size:clamp(45px,5.1vw,68px)}.hero-description{margin-top:20px}.explore-link{margin-top:26px}.stage-footer{height:60px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.hero-copy{transform:none}}
