@font-face{font-family:StudioSerif;src:url('/luma/fonts/newsreader.ttf') format('truetype');font-weight:400 600;font-display:swap}
@font-face{font-family:StudioPoster;src:url('/luma/fonts/poster-barlow-condensed.ttf') format('truetype');font-weight:800;font-display:swap}
:root{color-scheme:dark;--ease:cubic-bezier(.22,.72,.18,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#20261e;color:#f6f4e9;font:400 16px/1.5 Manrope,Arial,sans-serif}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid currentColor;outline-offset:6px}
figure,p,h1,h2{margin:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.stage,.scene{--paper:#273b28;--ink:#f3f3d8;--muted:#d6ddc8;--accent:#e8ebcc;background:var(--paper);color:var(--ink)}
[data-style="scrapbook"]{--paper:#2445ed;--ink:#e2f85b;--muted:#f7f8ed;--accent:#e2f85b}
[data-style="surrealism"]{--paper:#efece5;--ink:#20384b;--muted:#475c67;--accent:#20384b}
[data-style="glass"]{--paper:#142820;--ink:#f0f7ed;--muted:#dce9df;--accent:#e2d19b}
[data-style="bohemian"]{--paper:#eff371;--ink:#20251f;--muted:#3b4435;--accent:#20251f}
.studio-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 48px;min-height:96px;background:#20261e;color:#f6f4e9}
.brand{display:flex;align-items:baseline;gap:16px;white-space:nowrap}
.brand>span:first-child{font-size:28px;letter-spacing:.08em}
.brand>span:last-child{font-size:14px}
.scroll-cue{display:none;gap:16px;align-items:center;font-size:14px;position:absolute;top:32px;left:50%;transform:translateX(-50%);z-index:10;white-space:nowrap}
.scroll-cue>span{font-size:24px}
.languages{display:flex;gap:4px}
.languages a{display:grid;place-items:center;min-width:44px;min-height:44px;font-size:14px}
.languages [aria-current]{text-decoration:underline;text-underline-offset:6px}
.scene{position:relative;min-height:720px;padding:64px 64px 136px;overflow:hidden;scroll-margin-top:88px}
.preview{position:relative;min-height:520px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);grid-template-rows:1fr auto;gap:32px 48px;align-items:center;max-width:1600px;margin:auto}
.statement{grid-area:1/1;font-size:clamp(64px,7.7vw,128px);line-height:.98;letter-spacing:-.055em;align-self:end;position:relative;z-index:2;font-weight:400}
.statement>span{display:block}
.statement>span>span{display:block}
.scene-meta{grid-area:2/1;align-self:start;position:relative;z-index:2}
.style-heading{display:flex;align-items:baseline;gap:16px}
.scene-number{font-size:13px;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
h2{font-weight:500;font-size:20px;line-height:1.3}
.description{color:var(--muted);font-size:15px;margin-top:12px;max-width:320px}
.open{display:inline-flex;gap:32px;align-items:center;justify-content:space-between;margin-top:24px;min-height:48px;padding:12px 24px;border-radius:40px;background:var(--ink);color:var(--paper);font-size:16px}
.open svg{flex-shrink:0;transition:transform 240ms var(--ease)}
.screen{grid-area:1/2/3/3;position:relative;min-width:0;transform:translateY(var(--lift,0px)) rotate(calc(var(--tilt,-4deg) + var(--turn,0deg))) scale(var(--zoom,1));transform-origin:center;z-index:1}
.screen::before{content:'';position:absolute;inset:16px -16px -16px 16px;background:var(--ink);opacity:.12;border-radius:8px}
.screen img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:8px;box-shadow:0 24px 64px #0003;position:relative}
.scene[data-style="scrapbook"] .statement{font-size:clamp(64px,7.1vw,112px);font-weight:600;letter-spacing:-.065em}
.scene[data-style="scrapbook"] .screen{--tilt:4deg}
.scene[data-style="scrapbook"] :is(.open,.screen img,.screen::before){border-radius:0}
.scene[data-style="scrapbook"] .screen::before{opacity:1;background:#e2f85b;inset:16px -16px -16px 16px}
.scene[data-style="scrapbook"] .open{color:#17211d}
.scene[data-style="surrealism"] .statement{font-family:StudioSerif,Georgia,serif;font-size:clamp(64px,6vw,96px);letter-spacing:-.035em}
.scene[data-style="surrealism"] .screen{--tilt:0deg;align-self:center}
.scene[data-style="surrealism"] .screen::before{display:none}
.scene[data-style="surrealism"] .screen img{border-radius:0;box-shadow:0 24px 64px #20384b1a}
.scene[data-style="glass"] .screen{--tilt:-3deg}
.scene[data-style="glass"] .screen img{border-radius:24px}
.scene[data-style="glass"] .screen::before{border-radius:24px;opacity:.16;background:#e2d19b;inset:-16px 16px 16px -16px}
.scene[data-style="bohemian"] .statement{font-family:StudioPoster,Impact,sans-serif;font-size:clamp(80px,8.8vw,144px);line-height:.92;letter-spacing:-.025em;font-weight:800}
.scene[data-style="bohemian"] .screen{--tilt:3deg}
.scene[data-style="bohemian"] :is(.open,.screen img,.screen::before){border-radius:0}
.scene[data-style="bohemian"] .screen::before{opacity:1;inset:12px -12px -12px 12px}
.style-nav{position:sticky;z-index:20;top:0;left:0;right:0;display:flex;gap:24px;padding:16px 48px 24px;background:#20261e;color:#f6f4e9}
.style-nav a{position:relative;flex:1;min-width:0;display:flex;gap:12px;align-items:center;min-height:48px;padding:12px 0;border-top:1px solid #ffffff40;font-size:14px}
.nav-index{font-variant-numeric:tabular-nums}
.nav-progress{position:absolute;height:2px;top:-1px;left:0;width:100%;transform-origin:left;transform:scaleX(0);background:currentColor}
.style-nav [aria-current] .nav-progress{transform:scaleX(1)}
.is-motion{height:500svh}
.is-motion .stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate}
.is-motion .studio-header{position:absolute;inset:0 0 auto;background:var(--paper);color:var(--ink)}
.is-motion .scene{position:absolute;inset:0;min-height:0;padding:112px 64px 128px;visibility:hidden}
.is-motion .scene:first-child{visibility:visible}
.is-motion .preview{height:100%;min-height:0}.is-motion .scroll-cue{display:flex}
.stage[data-last="true"] .scroll-cue{visibility:hidden}
.is-motion .style-nav{position:absolute;top:auto;bottom:0;background:var(--paper);color:var(--ink)}
.is-motion .style-nav a{border-color:color-mix(in srgb,currentColor 30%,transparent)}
.is-motion .style-nav [aria-current] .nav-progress{transform:scaleX(var(--local-progress,0))}
.stage.is-entering .scene:first-child .statement>span{overflow:hidden}
.stage.is-entering .scene:first-child .statement>span>span{animation:studio-type 900ms var(--ease) both}
.stage.is-entering .scene:first-child .statement>span:nth-child(2)>span{animation-delay:100ms}
.stage.is-entering .scene:first-child .screen{animation:studio-screen 1100ms var(--ease) both}
@keyframes studio-type{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes studio-screen{from{opacity:0;transform:translateY(80px) rotate(7deg) scale(.88)}to{opacity:1;transform:rotate(-4deg)}}
@media(hover:hover){.preview:hover .open svg{transform:translateX(4px)}.style-nav a:hover .nav-name{text-decoration:underline;text-underline-offset:4px}}
@media(min-width:1600px){.is-motion .scene{padding-inline:96px}}
@media(max-width:1100px){.preview{gap:24px 32px;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}.scene,.is-motion .scene{padding-inline:40px}.studio-header{padding-inline:32px}.style-nav{padding-inline:32px;gap:16px}.nav-name{font-size:14px}.statement{font-size:clamp(56px,7.7vw,96px)}}
@media(max-width:700px){.studio-header{padding:12px 24px;min-height:72px;gap:16px}.brand{gap:12px}.brand>span:first-child{font-size:22px}.brand>span:last-child{font-size:14px}.scroll-cue{display:none}.is-motion .scroll-cue{display:flex;top:auto;bottom:80px;font-size:12px;gap:12px}.is-motion .scroll-cue>span{font-size:18px}.scene{padding:40px 24px 112px;min-height:720px}.preview{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:24px;min-height:0}.statement{grid-area:1/1;font-size:clamp(52px,12vw,80px);align-self:start;line-height:1}.screen{grid-area:2/1;max-width:560px;width:100%;justify-self:center}.scene-meta{grid-area:3/1}.style-heading{gap:12px}h2{font-size:18px}.description{font-size:14px;margin-top:8px;max-width:none}.open{margin-top:16px;min-height:44px;padding:8px 20px;gap:24px}.screen::before{inset:8px -8px -8px 8px}.screen img{box-shadow:0 16px 32px #0003}.scene[data-style="scrapbook"] .statement{font-size:clamp(48px,11.5vw,72px)}.scene[data-style="surrealism"] .statement{font-size:clamp(52px,12vw,80px)}.scene[data-style="bohemian"] .statement{font-size:clamp(60px,14vw,88px)}.scene[data-style="scrapbook"] .screen::before{inset:8px -8px -8px 8px}.scene[data-style="glass"] .screen::before{inset:-8px 8px 8px -8px}.scene[data-style="bohemian"] .screen::before{inset:8px -8px -8px 8px}.style-nav{gap:16px;padding:12px 24px max(16px,env(safe-area-inset-bottom))}.style-nav a{justify-content:center;font-size:15px;min-height:44px}.nav-name{display:none}.is-motion .scene{padding:88px 24px 96px}.is-motion .preview{align-content:center;grid-template-rows:auto auto auto;height:100%;gap:24px}.is-motion .statement{align-self:auto}.is-motion .screen{max-width:520px}.scene[data-style="glass"] .screen img{border-radius:16px}.scene[data-style="glass"] .screen::before{border-radius:16px}}
@media(max-width:360px){.studio-header{padding-inline:16px}.brand>span:last-child{display:none}.scene,.is-motion .scene{padding-inline:20px}.is-motion .preview{gap:20px}.style-nav{padding-inline:20px}.statement{font-size:50px}.scene-number{font-size:12px}.style-heading{gap:8px}.description{line-height:1.45}.open{margin-top:12px}}
@media(max-height:700px) and (min-width:701px){.scene,.is-motion .scene{padding-top:96px;padding-bottom:112px}.preview{min-height:440px}.statement{font-size:64px}.scene[data-style="scrapbook"] .statement{font-size:64px}.scene[data-style="surrealism"] .statement{font-size:72px}.scene[data-style="bohemian"] .statement{font-size:80px}.description{font-size:14px}.open{margin-top:16px}.screen{max-width:720px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.screen{transform:none!important}.scroll-cue{display:none}}



@media(max-height:599px) and (min-width:701px){.scene{padding:40px 32px 64px;min-height:0}.preview{min-height:360px}.statement,.scene[data-style="scrapbook"] .statement{font-size:48px}.scene[data-style="surrealism"] .statement{font-size:52px}.scene[data-style="bohemian"] .statement{font-size:64px}}