/* A. Kamen Studio — the house (B · Cinematic Proof, luxury edition) · v62 · Nov 9 2026
   Light = creamy ivory + rose gold stationery. Dark = the studio's Nocturne ink + champagne.
   All motion is gated behind prefers-reduced-motion:no-preference and html.motion. */
@font-face{font-family:Cormorant;src:url(/assets/after-hours/cormorant.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:Cormorant;src:url(/assets/after-hours/cormorant-italic.woff2) format("woff2");font-style:italic;font-weight:300 700;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/after-hours/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
html,html[data-theme="light"]{
 --paper:#f6efe4;--paper-2:#efe5d6;--paper-3:#fbf6ee;--ivory:#fdf9f2;--linen:#ebdfcf;
 --ink:#2f2522;--ink-2:#4a3b35;--muted:#76645c;
 --metal:#9a6856;--metal-2:#c99585;--metal-3:#e6c3b4;
 --panel:#f0e3d5;--panel-2:#e9d9c8;--mat:#fcf7f0;--on:#2f2522;--on-2:#6f5d55;--pm:#a87262;--pm-2:#c99585;
 --edge:rgba(156,106,88,.55);--fill:#3b2c27;--fill-on:#fbf2ea;--seal-f:hue-rotate(-18deg) saturate(.72) brightness(1.03);
 --shadow:0 46px 90px -60px rgba(92,52,40,.42);--grain:.05;
 --serif:Cormorant,"Cormorant Garamond",Georgia,serif;--sans:Inter,system-ui,-apple-system,sans-serif;
}
html[data-theme="dark"]{
 --paper:#101512;--paper-2:#141c17;--paper-3:#131a16;--ivory:#17231d;--linen:#1b2a22;
 --ink:#eee8dc;--ink-2:#dcd5c6;--muted:#b3b4a6;
 --metal:#c7ab79;--metal-2:#d9c196;--metal-3:#e8d6b0;
 --panel:#17231d;--panel-2:#122019;--mat:#0b110e;--on:#eee8dc;--on-2:#b7b8aa;--pm:#d3bf98;--pm-2:#b59a6c;
 --edge:rgba(0,0,0,.7);--fill:#c7ab79;--fill-on:#101512;--seal-f:none;
 --shadow:0 46px 90px -56px rgba(0,0,0,.8);--grain:0;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
html[data-theme="dark"]{color-scheme:dark}
body{font-family:var(--sans);font-size:16px;line-height:1.6;font-feature-settings:"lnum" 1,"kern" 1;min-height:100vh}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
[hidden]{display:none!important}
ul{list-style:none}
.skip{position:absolute;top:-80px;left:20px;background:var(--ink);color:var(--paper);padding:12px 16px;z-index:60;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.skip:focus{top:10px}
.no-script{max-width:1328px;margin:20px auto;padding:0 56px;color:var(--muted)}
/* type */
.eyebrow{font-family:var(--sans);font-size:10px;line-height:1.5;letter-spacing:.38em;text-transform:uppercase;color:var(--metal);font-weight:500;font-style:normal}
.d1,.tab h1{font-family:var(--serif);font-weight:400;line-height:.98;letter-spacing:-.012em}
.d2{font-family:var(--serif);font-weight:400;line-height:1.04;letter-spacing:-.006em}
.tab h1 em,.d1 em,.d2 em{font-style:italic;color:var(--metal)}
.lede{font-family:var(--serif);font-size:24px;line-height:1.42;color:var(--ink-2)}
.body{color:var(--muted);font-size:15.5px;line-height:1.72}
.eyebrow.eyebrow{font-family:var(--sans);font-size:10px;line-height:1.5;letter-spacing:.38em;font-style:normal;font-weight:500}
.hl{display:flex;align-items:center;justify-content:center;gap:18px}
.hl:before,.hl:after{content:"";flex:0 0 52px;height:1px;background:var(--line)}
.tlink,.text-link{white-space:nowrap;display:inline-flex;gap:12px;align-items:center;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink);font-weight:500;padding-bottom:8px;background:none;border:0}
.btn{white-space:nowrap;display:inline-flex;gap:16px;align-items:center;font-weight:500;text-transform:uppercase;border-radius:0}
/* ───── header & menu ───── */
.site-header{position:relative;max-width:1440px;margin:0 auto;padding:24px 56px 22px;display:flex;align-items:center;gap:36px;z-index:40}
.site-header:before,.site-header:after{content:"";position:absolute;left:56px;right:56px;height:1px;background:var(--line);pointer-events:none}
.site-header:before{bottom:0}.site-header:after{bottom:-4px;background:var(--line-2)}
.header-bar{display:flex;align-items:center;justify-content:space-between;flex:1}
.identity{display:inline-flex;align-items:center;gap:13px}
.identity img{width:36px;height:36px;object-fit:contain;filter:var(--seal-f)}
.identity .nameplate{display:flex;align-items:center;gap:13px;font-family:var(--serif);font-size:24px;font-weight:500;color:var(--ink);white-space:nowrap}
.identity .nameplate:before{content:"";width:1px;height:26px;background:var(--line)}
.identity .lk-house{font-style:italic;color:var(--metal);font-weight:500}
.menu-toggle{appearance:none;border:1px solid var(--line);background:transparent;width:46px;height:40px;display:inline-flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 4px var(--line-2);border-radius:0}
.menu-icon{display:grid;gap:5px;width:16px}
.menu-icon span{display:block;height:1px;background:var(--ink);transition:transform .6s var(--e),opacity .4s var(--e)}
.menu-open .menu-icon span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .menu-icon span:nth-child(2){opacity:0}
.menu-open .menu-icon span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.menu-toggle:focus-visible,:focus-visible{outline:1px solid var(--metal);outline-offset:5px}
.menu-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--ink) 18%,transparent);z-index:30}
.site-menu{position:absolute;left:20px;right:20px;top:calc(100% + 10px);background:var(--paper-3);border:1px solid var(--line);box-shadow:inset 0 0 0 6px var(--paper-3),inset 0 0 0 7px var(--line-2),var(--shadow);padding:22px 28px 14px;display:flex;flex-direction:column;z-index:41;max-height:calc(100dvh - 110px);overflow-y:auto}
.site-menu a{font-family:var(--serif);font-size:25px;color:var(--ink-2);padding:11px 0;border-bottom:1px solid var(--line-2);display:flex;justify-content:space-between;align-items:baseline}
.site-menu a[aria-current="page"]{color:var(--metal);font-style:italic}
.theme-study-control{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:10px;color:var(--muted);font-size:9.5px;letter-spacing:.26em;text-transform:uppercase}
.theme-study-choice{appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;border:0;background:none;color:inherit;letter-spacing:inherit;text-transform:inherit;position:relative}
.theme-study-choice svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.theme-study-choice[data-selected="true"]{color:var(--metal)}
.theme-study-choice[data-selected="true"]:after{content:"";position:absolute;left:26px;right:4px;bottom:10px;height:1px;background:currentColor}
.theme-study-separator{width:1px;height:12px;background:var(--line)}
@media (min-width:1180px){
 .header-bar{flex:none}
 .menu-toggle{display:none}
 .menu-overlay{display:none!important}
 .site-menu,.site-menu[hidden]{display:flex!important;position:static;flex-direction:row;align-items:center;gap:26px;margin-left:auto;background:none;border:0;box-shadow:none;padding:0;max-height:none;overflow:visible}
 .site-menu a{font-family:var(--sans);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);padding:6px 0;border:0;position:relative;transition:color .6s var(--e);white-space:nowrap}
 .site-menu a:after{content:"";position:absolute;left:50%;bottom:-2px;width:0;height:1px;background:var(--metal);transform:translateX(-50%);transition:width .8s var(--e)}
 .site-menu a:hover{color:var(--ink)}.site-menu a:hover:after{width:14px}
 .site-menu a[aria-current="page"]{color:var(--ink);font-style:normal}.site-menu a[aria-current="page"]:after{width:100%}
 .theme-study-control{margin:0 0 0 4px;padding-left:20px;border-left:1px solid var(--line-2);gap:6px}
 .theme-study-choice{min-height:34px;min-width:30px;justify-content:center;padding:0}
 .theme-study-choice span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .theme-study-choice[data-selected="true"]:after{left:8px;right:8px;bottom:4px}
 .theme-study-separator{display:none}
}
@media (min-width:1180px) and (max-width:1320px){.site-menu,.site-menu[hidden]{gap:18px}.site-menu a{letter-spacing:.16em;font-size:10px}}
:root{--e:cubic-bezier(.22,.61,.36,1);--e-slow:cubic-bezier(.25,.46,.3,1);--e-settle:cubic-bezier(.16,.8,.28,1);
 --line:color-mix(in srgb,var(--metal) 42%,transparent);--line-2:color-mix(in srgb,var(--metal) 20%,transparent);
 --pl:color-mix(in srgb,var(--pm) 34%,transparent);--pl-2:color-mix(in srgb,var(--pm) 16%,transparent);
 --gold:var(--metal);--rule:var(--line)}
body{background-color:var(--paper);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .33  0 0 0 0 .22  0 0 0 .05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
::selection{background:var(--metal-3);color:var(--ink)}
.d1 em,.d2 em,.d3 em{color:var(--metal)}
.eyebrow,.eyebrow.eyebrow{color:var(--metal);letter-spacing:.38em;font-weight:500}
.hl:before,.hl:after{background:var(--line)}
.lockup .lk{color:var(--ink)}.lockup .lk i{color:var(--metal)}.lockup .div{background:var(--line)}
.seal{filter:var(--seal-f)}
:focus-visible{outline:1px solid var(--metal);outline-offset:6px}


/* ───── buttons (Velora download language) ───── */
.btn{position:relative;isolation:isolate;overflow:hidden;color:var(--ink);background:transparent;border:1px solid color-mix(in srgb,var(--metal) 70%,transparent);
 box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 5px var(--line-2);letter-spacing:.38em;font-size:10px;padding:20px 32px 19px 38px;transition:color .7s var(--e),border-color .8s var(--e)}
.btn .ar{color:var(--metal);transition:transform .9s var(--e),color .7s var(--e)}
.btn:before{content:"";position:absolute;inset:5px;z-index:-1;background:var(--fill);clip-path:inset(100% 0 0 0);transition:clip-path .9s var(--e)}
.btn.light{color:var(--on);border-color:color-mix(in srgb,var(--pm) 60%,transparent);box-shadow:inset 0 0 0 4px var(--panel),inset 0 0 0 5px var(--pl-2)}
.btn.light .ar{color:var(--pm)}
.btn.light:before{background:var(--pm)}
.tlink{color:var(--ink);border-bottom:0;position:relative;letter-spacing:.32em;font-size:10px;transition:color .7s var(--e)}
.tlink:after{content:"";position:absolute;left:50%;bottom:0;width:100%;height:1px;background:color-mix(in srgb,var(--metal) 65%,transparent);transform:translateX(-50%);transition:width .9s var(--e)}
.tlink.on{color:var(--on)}.tlink.on:after{background:var(--pl)}
.tlink.quiet{color:var(--muted)}
@media (prefers-reduced-motion:no-preference){
 .btn:hover,.btn:focus-visible{color:var(--fill-on);background:transparent}
 .btn:hover:before,.btn:focus-visible:before{clip-path:inset(0 0 0 0)}
 .btn:hover .ar{transform:translateX(4px);color:var(--metal-3)}
 .btn.light:hover,.btn.light:focus-visible{color:var(--panel-2);background:transparent}
 .btn.light:hover .ar{color:var(--panel-2)}
 .tlink:hover:after{width:42%}
}

/* ───── vitrine window: aperture + registration corners + engraved rule + offset hairline ───── */
.vit{position:relative;display:block;background:var(--panel);padding:var(--vp,30px);
 box-shadow:0 0 0 1px var(--edge),0 0 0 10px var(--paper),0 0 0 11px var(--line),var(--shadow);transition:box-shadow 1.1s var(--e)}
.vit:before{content:"";position:absolute;inset:calc(var(--vp,30px) - 14px);border:1px solid var(--pl);pointer-events:none;transition:border-color 1.1s var(--e)}
.vit .win{position:relative;overflow:hidden;background:var(--mat);height:100%}
.vit .win:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pm) 22%,transparent);pointer-events:none}
.vit img{width:100%;height:100%;object-fit:cover;transition:transform 1.8s var(--e-slow),filter 1.2s var(--e)}
.vit .c{position:absolute;width:16px;height:16px;border:0 solid color-mix(in srgb,var(--pm) 80%,transparent);transition:opacity 1.2s var(--e)}
.vit .tl{left:8px;top:8px;border-left-width:1px;border-top-width:1px}.vit .tr{right:8px;top:8px;border-right-width:1px;border-top-width:1px}
.vit .bl{left:8px;bottom:8px;border-left-width:1px;border-bottom-width:1px}.vit .br{right:8px;bottom:8px;border-right-width:1px;border-bottom-width:1px}
.vit.sm{--vp:16px}.vit.sm:before{inset:6px}.vit.sm .c{display:none}
.vit.sm{box-shadow:0 0 0 1px var(--edge),0 0 0 6px var(--paper),0 0 0 7px var(--line),var(--shadow)}
.on-panel .vit{box-shadow:0 0 0 1px var(--pl),0 30px 70px -50px rgba(0,0,0,.6);background:var(--panel-2)}
.on-panel .vit.sm{box-shadow:0 0 0 1px var(--pl),0 30px 70px -50px rgba(0,0,0,.6)}
a:hover .vit,.vit:hover{box-shadow:0 0 0 1px var(--edge),0 0 0 10px var(--paper),0 0 0 11px var(--metal),var(--shadow)}
a:hover .vit.sm,.vit.sm:hover{box-shadow:0 0 0 1px var(--edge),0 0 0 6px var(--paper),0 0 0 7px var(--metal),var(--shadow)}
.on-panel a:hover .vit,.on-panel .vit:hover{box-shadow:0 0 0 1px color-mix(in srgb,var(--pm) 70%,transparent),0 30px 70px -50px rgba(0,0,0,.6)}
a:hover .vit:before,.vit:hover:before{border-color:color-mix(in srgb,var(--pm) 62%,transparent)}
@media (prefers-reduced-motion:no-preference){a:hover .vit img,.vit:hover img{transform:scale(1.016);filter:brightness(1.04)}}

/* ───── hero ───── */
.hero{display:grid;grid-template-columns:410px 1fr;gap:64px;padding:58px 56px 84px;max-width:1440px;margin:0 auto;align-items:stretch}
.hero .t{display:flex;flex-direction:column;justify-content:space-between;padding-top:8px}
.hero h1{font-size:72px;margin:26px 0 28px;color:var(--ink)}
.hero .sub{font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink-2);max-width:380px}
.hero .ctas{display:flex;flex-direction:column;align-items:flex-start;gap:26px;margin-top:40px}
.hero .meta{display:flex;gap:28px;border-top:1px solid var(--line);padding-top:18px;margin-top:38px;position:relative}
.hero .meta:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--line-2)}
.hero .meta div{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);line-height:1.8}
.hero .meta b{display:block;color:var(--ink);font-weight:500;font-family:var(--serif);font-size:19px;letter-spacing:0;text-transform:none}
.stage{display:flex;flex-direction:column;margin:11px 11px 0 0}
.stage>a{flex:1;display:flex;flex-direction:column}
.stage .vit{flex:1;min-height:560px}
.stage .slides{position:absolute;inset:var(--vp,30px);height:auto}
.stage .slides img{position:absolute;inset:0}
.stage .slides img+img{opacity:0}
.stage .ttl{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:baseline;margin-top:28px}
.stage .ttl .k{font-size:9.5px;letter-spacing:.36em;text-transform:uppercase;color:var(--metal);white-space:nowrap}
.stage .caps{position:relative}
.stage .cap1{font-family:var(--serif);font-size:21px;color:var(--ink);line-height:1.35}
.stage .cap1 em{color:var(--metal)}
.stage .cap1+.cap1{position:absolute;left:0;top:0;opacity:0}
.stage .count{font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:12px}
.stage .count i{display:block;width:44px;height:1px;background:var(--line-2);position:relative;overflow:hidden}
.stage .count i:after{content:"";position:absolute;inset:0;background:var(--metal);transform-origin:0 50%;transform:scaleX(.333)}

/* ───── reel (panel band) ───── */
.reel{background:var(--panel);color:var(--on);padding:116px 56px 124px;position:relative}
.reel:before,.reel:after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--pl)}
.reel:before{top:12px}.reel:after{bottom:12px}
.reel .head{max-width:1328px;margin:0 auto 72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:40px}
.reel .head .eyebrow{color:var(--pm);justify-content:flex-start}
.reel .head .eyebrow:before{display:none}.reel .head .eyebrow:after{background:var(--pl)}
.reel .head h2{font-family:var(--serif);font-weight:400;font-size:64px;line-height:1;text-align:center;color:var(--on)}
.reel .head h2 em{color:var(--pm)}
.reel .head p{max-width:340px;justify-self:end;color:var(--on-2);font-size:14px;line-height:1.75}
.strip{max-width:1328px;margin:0 auto}
.perf{height:9px;background:radial-gradient(circle at 50% 50%,var(--pl) 0 1.6px,transparent 2px) 0 0/22px 9px repeat-x;margin:0 0 40px}
.strip .perf:last-child{margin:56px 0 0}
.frames{display:grid;grid-template-columns:1fr 1fr;gap:72px 56px;padding-bottom:90px}
.fr:nth-child(2n){margin-top:90px;margin-bottom:-90px}
.fr{display:block}
.fr .vit{--vp:20px}.fr .vit:before{inset:7px}.fr .vit .c{width:11px;height:11px}
.fr .vit img{aspect-ratio:16/10}
.fr .c2{display:grid;grid-template-columns:60px 1fr auto;gap:14px;margin-top:24px;align-items:baseline;padding-top:16px;border-top:1px solid var(--pl-2)}
.fr .c2 span{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--pm);white-space:nowrap}
.fr .c2 p{font-family:var(--serif);font-size:21px;line-height:1.32;color:var(--on)}
.fr .c2 p small{display:block;font-family:var(--sans);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--on-2);margin-top:9px}
.fr .c2 b{font-weight:400;font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--on-2);border:1px solid var(--pl-2);padding:5px 8px 5px 10px;white-space:nowrap}
.reel .foot-l{max-width:1328px;margin:62px auto 0;display:flex;justify-content:center;gap:36px;align-items:center}
.reel .foot-l p{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--on-2)}

/* ───── credits / behind / footer ───── */
.credits{max-width:1328px;margin:0 auto;padding:128px 56px 40px}
.credits .eyebrow{text-align:center}
.credits h2{text-align:center;font-size:60px;margin:18px 0 64px;color:var(--ink)}
.cl{border-top:1px solid var(--line);position:relative}
.cl:before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:var(--line-2)}
.cl a{display:grid;grid-template-columns:120px 1.1fr 1fr 40px;align-items:center;padding:36px 0;border-bottom:1px solid var(--line);position:relative}
.cl a:after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--metal);transition:width 1.2s var(--e)}
.cl a:hover:after{width:100%}
.cl .n{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--metal)}
.cl h3{font-family:var(--serif);font-weight:400;font-size:46px;color:var(--ink)}
.cl p{font-family:var(--serif);font-size:21px;color:var(--muted);line-height:1.4}
.cl .ar{justify-self:end;color:var(--metal);font-size:18px;transition:transform .9s var(--e)}
.cl a:hover .ar{transform:translateX(5px)}
.behind{max-width:1328px;margin:0 auto;padding:60px 56px 100px;display:grid;grid-template-columns:auto 1fr auto;gap:34px;align-items:center}
.behind img{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 28%;box-shadow:0 0 0 5px var(--paper),0 0 0 6px var(--line),0 0 0 10px var(--paper),0 0 0 11px var(--line-2)}
.behind p{font-family:var(--serif);font-size:22px;color:var(--ink-2);max-width:760px;line-height:1.45}
.behind p span{color:var(--muted)}
.ft{max-width:1328px;margin:0 auto;padding:0 56px}
.foot{border-top:1px solid var(--line);color:var(--muted);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.foot .credit span{color:var(--ink);text-transform:none;letter-spacing:0}.foot .credit span i{color:var(--metal)}

/* host plate (new portrait, generous three-quarter crop) */
.host{max-width:1328px;margin:0 auto;padding:110px 56px 120px;display:grid;grid-template-columns:420px 1fr;gap:96px;align-items:center}
.host-pic{margin:11px}
.vit.lt{background:var(--ivory);--vp:22px}
.vit.lt:before{inset:8px;border-color:var(--line)}
.vit.lt .c{border-color:var(--metal)}
.host-pic .vit img{aspect-ratio:4/5;object-position:50% 30%}
.host-pic figcaption{display:flex;justify-content:space-between;align-items:baseline;margin-top:24px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.host-pic figcaption em{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:0;font-size:17px;color:var(--ink-2)}
.host-t h2{font-size:64px;margin:20px 0 26px;color:var(--ink)}
.host-t .lede{max-width:560px;color:var(--ink-2)}
.host-t .body{max-width:520px;margin-top:18px;color:var(--muted)}
.host-cta{display:flex;gap:36px;align-items:center;margin-top:40px}
.chip{display:inline-block;width:22px;height:22px;border-radius:50%;object-fit:cover;vertical-align:middle;margin:-3px 10px 0 0;box-shadow:0 0 0 2px var(--paper),0 0 0 3px var(--line)}
.on-panel .chip{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--pl)}
.hostline{display:flex;gap:16px;align-items:center;margin-top:30px;font-family:var(--serif);font-size:17px;color:var(--muted);line-height:1.4}
.hostline img{width:54px;height:54px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 4px var(--paper),0 0 0 5px var(--line)}
.hostline b{font-weight:500;color:var(--ink)}
/* ───── How I Work storyboard ───── */
.sb-open{max-width:1328px;margin:0 auto;padding:88px 56px 64px;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end}
.sb-open h1{font-size:84px;margin-top:22px;color:var(--ink)}
.sb-open p{font-family:var(--serif);font-size:23px;line-height:1.5;color:var(--ink-2);max-width:520px}
.sb-open p.eyebrow{font-family:var(--sans);font-size:10px;line-height:1.4;color:var(--metal)}
.sheet{max-width:1328px;margin:0 auto;padding:0 56px 110px}
.sheet .bar{display:flex;justify-content:space-between;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:14px 0;font-size:9.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);margin-bottom:56px;position:relative}
.sheet .bar:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:color-mix(in srgb,var(--ink) 45%,transparent)}
.scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:72px 44px;padding-bottom:52px}
.sc:nth-child(3n+2){margin-top:52px;margin-bottom:-52px}
.sc .lab{display:flex;justify-content:space-between;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--metal);margin-bottom:14px}
.sc .lab span:last-child{color:var(--muted)}
.sc .vit{--vp:14px}.sc .vit:before{inset:5px}
.sc .fx{position:relative;background:var(--mat);aspect-ratio:16/10;overflow:hidden}
.sc .fx img{width:100%;height:100%;object-fit:cover}
.sc h3{font-family:var(--serif);font-weight:500;font-size:29px;margin:26px 0 8px;line-height:1.1;color:var(--ink)}
.sc p{font-size:14.5px;color:var(--muted);line-height:1.65}
.sc .who{display:inline-block;margin-top:16px;font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-2);border-top:1px solid var(--line);padding-top:9px}
.sc .ill{display:block;margin-top:8px;font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--muted)}
.fx .mk{position:absolute;border:1.5px solid var(--metal-2);border-radius:50%}
.fx .nt{position:absolute;background:var(--ivory);color:var(--ink);font-family:var(--serif);font-style:italic;font-size:14px;padding:6px 10px;box-shadow:0 0 0 1px var(--line)}
.fx .nt b{font-family:var(--sans);font-style:normal;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--metal);display:block}
.fx.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:2px}
.fx.two>img{width:100%;height:100%;min-width:0;min-height:0;object-fit:cover}
.fx.two .lb{position:absolute;font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);background:color-mix(in srgb,var(--ivory) 88%,transparent);padding:3px 7px}
.fx .brief{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1.1fr;background:var(--ivory)}
.fx .brief img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.fx .brief div{padding:22px 20px;color:var(--ink)}
.fx .brief div b{font-size:8.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--metal);font-weight:600}
.fx .brief div p{font-family:var(--serif);font-size:19px;line-height:1.25;color:var(--ink);margin-top:8px}
.fx .illtag{position:absolute;right:6px;top:6px;font-size:7.5px;letter-spacing:.22em;text-transform:uppercase;background:var(--ivory);color:var(--ink);padding:3px 7px}
.loopcard{grid-column:span 3;display:flex;align-items:center;justify-content:center;gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px;font-family:var(--serif);font-size:24px;color:var(--ink-2);margin-top:24px;position:relative}
.loopcard:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--line-2)}
.loopcard em{color:var(--metal)}
.loopcard span:first-child{color:var(--metal)}

.sb-band{background:var(--panel);color:var(--on);position:relative;padding:84px 0 20px}
.sb-band:before,.sb-band:after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--pl)}
.sb-band:before{top:12px}.sb-band:after{bottom:12px}
.on-panel .sheet .bar{border-top-color:color-mix(in srgb,var(--on) 70%,transparent);border-bottom-color:var(--pl);color:var(--on-2)}
.on-panel .sheet .bar:before{background:color-mix(in srgb,var(--on) 35%,transparent)}
.on-panel .sc .lab{color:var(--pm)}.on-panel .sc .lab span:last-child{color:var(--on-2)}
.on-panel .sc h3{color:var(--on)}.on-panel .sc p,.on-panel .sc .ill{color:var(--on-2)}
.on-panel .sc .who{color:var(--on);border-top-color:var(--pl)}
.on-panel .loopcard{color:var(--on);border-color:var(--pl)}.on-panel .loopcard:before{background:var(--pl-2)}
.on-panel .loopcard em,.on-panel .loopcard span:first-child{color:var(--pm)}
.on-panel .fx .nt b{color:var(--metal)}
/* ───── Selected Work ───── */
.w-open{max-width:1328px;margin:0 auto;padding:96px 56px 96px;display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:start}
.w-open h1{font-size:96px;margin-top:24px;color:var(--ink)}
.w-open .lede{font-size:23px;color:var(--ink-2);max-width:500px}
.idx{margin-top:34px;border-top:1px solid var(--line);position:relative}
.idx:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--line-2)}
.idx a{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line-2);transition:color .6s var(--e)}
.idx a span{font-family:var(--serif);font-style:italic;color:var(--metal);font-size:17px}
.idx a b{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--ink)}
.idx a small{font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.idx a.wr b{font-style:italic;color:var(--ink-2)}
.idx a:hover small{color:var(--metal)}
.viewing{max-width:1328px;margin:0 auto;padding:0 56px}
.plate{display:grid;grid-template-columns:1fr 340px;gap:84px;align-items:center;padding:110px 0;border-top:1px solid var(--line);position:relative;scroll-margin-top:20px}
.plate:before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:var(--line-2)}
.plate.alt{grid-template-columns:340px 1fr}.plate.alt .tx{order:-1}
.plate .tx .no{font-family:var(--serif);font-style:italic;font-weight:300;font-size:96px;line-height:.8;color:var(--metal);display:block}
.plate .tx .cat{display:block;margin-top:30px;font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--metal)}
.plate .tx h2{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1.02;margin:14px 0 18px;color:var(--ink)}
.plate .tx h2 em{color:var(--metal)}
.plate .tx p{font-family:var(--serif);font-size:21px;line-height:1.45;color:var(--ink-2)}
.ledger{margin:28px 0 34px;border-top:1px solid var(--line)}
.ledger div{display:grid;grid-template-columns:86px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-2);font-size:12px;color:var(--ink-2)}
.ledger dt{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.ledger dd .live{display:inline-flex;align-items:center;gap:9px}
.ledger dd .live:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--metal);box-shadow:0 0 0 3px color-mix(in srgb,var(--metal) 18%,transparent)}
.plate .pic{position:relative;margin:11px}
.plate .pic .vit img{aspect-ratio:2/1}
.plate .ph{position:absolute;left:-34px;bottom:-62px;width:132px;z-index:2}
.plate.alt .ph{left:auto;right:-34px}
.plate .ph .vit{--vp:7px;box-shadow:0 0 0 1px var(--edge),0 0 0 5px var(--paper),0 0 0 6px var(--line),0 40px 70px -40px rgba(0,0,0,.5)}
.plate .ph .vit:before{inset:3px}
.plate .ph .vit img{aspect-ratio:9/19.5;object-position:50% 0}
.plate .pic figcaption{display:flex;justify-content:space-between;margin-top:26px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.plate .pic figcaption span{white-space:nowrap;margin-right:18px}
.plate .pic figcaption em{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:0;font-size:16px;color:var(--ink-2)}
.plate.alt .pic figcaption{padding-right:130px}.plate:not(.alt):not(.feature) .pic figcaption{padding-left:130px}
/* 01 — feature plate, full width */
.plate.feature{grid-template-columns:1fr;gap:0;padding-top:24px;border-top:0}
.plate.feature:before{display:none}
.plate.feature .pic .vit img{aspect-ratio:2.39/1;object-position:50% 46%}
.plate.feature .pic{margin:11px 11px 0}
.plate.feature .tx{display:grid;grid-template-columns:150px 1.1fr 1fr;gap:56px;align-items:start;margin-top:56px}
.plate.feature .tx .cat{margin-top:0}
.plate.feature .tx h2{margin-top:12px}
.plate.feature .ledger{margin-top:6px}
/* 05 — studio mark: the AK seal alone in the same vitrine, no site screenshot */
.plate.mark .pic .vit .win{height:auto;background:var(--mat)}
.plate.mark .mark-field{width:100%;aspect-ratio:2/1;display:grid;place-items:center;background:radial-gradient(ellipse 48% 72% at 50% 50%,color-mix(in srgb,var(--metal-3) 26%,var(--mat)) 0%,var(--mat) 70%)}
.plate.mark .mark-seal{width:34%;aspect-ratio:1;display:block;background:linear-gradient(165deg,var(--metal-2),var(--metal));-webkit-mask:url(/assets/atelier/ak-seal-mask.svg) center/contain no-repeat;mask:url(/assets/atelier/ak-seal-mask.svg) center/contain no-repeat}
/* writing coda */
.coda{max-width:860px;margin:0 auto;padding:110px 56px 128px;text-align:center;position:relative}
.coda:before{content:"";position:absolute;left:50%;top:0;width:1px;height:64px;background:var(--line)}
.coda .eyebrow{justify-content:center;margin-top:20px}
.coda .book{display:block;width:70px;height:70px;margin:36px auto 22px;background:linear-gradient(160deg,var(--metal-2),var(--metal));-webkit-mask:url(/assets/book-logo-gold.png) center/contain no-repeat;mask:url(/assets/book-logo-gold.png) center/contain no-repeat}
.coda .k{font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--muted)}
.coda h2{font-family:var(--serif);font-weight:400;font-style:italic;font-size:54px;line-height:1;margin:14px 0 18px;color:var(--ink)}
.coda p{font-family:var(--serif);font-size:22px;color:var(--ink-2);margin-bottom:30px}

/* ───── motion (only when the visitor has not asked for less) ───── */
@keyframes veil{from{opacity:0}to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes settle{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:none}}
@keyframes framein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes drawx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes track{from{opacity:0;letter-spacing:.62em}to{opacity:1;letter-spacing:.38em}}
@keyframes cfade{0%{opacity:0}6%{opacity:1}33.3%{opacity:1}39.3%{opacity:0}100%{opacity:0}}
@keyframes cbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:no-preference){
 html.motion main>.tab:not([hidden]){animation:veil .9s var(--e) both}
 html.motion .site-header{animation:veil 1.4s var(--e) .1s both}
 html.motion .cue{animation:rise 1.4s var(--e) var(--d,0s) both}
 html.motion .eyebrow.cue{animation:track 1.9s var(--e-slow) var(--d,0s) both}
 html.motion .stage .vit{animation:framein 1.6s var(--e) .35s both}
 html.motion .stage .vit .c{animation:veil 1.4s var(--e) 1.5s both}
 html.motion .stage .slides img:first-child{animation:settle 3.2s var(--e-settle) .55s both}
 html.motion .stage .ttl{animation:veil 1.4s var(--e) 1.4s both}
 html.motion .hero .meta:before,html.motion .hero .meta{animation:veil 1.4s var(--e) 1.2s both}
 /* sequenced first impression: Velora → Blood Data → Elysium, slow dissolves */
 html.motion .stage.seq .slides img{animation:cfade 21s linear infinite;opacity:0}
 html.motion .stage.seq .slides img:nth-child(1){animation:cfade 21s linear -1.26s infinite, settle 3.2s var(--e-settle) .55s backwards}
 html.motion .stage.seq .slides img:nth-child(2){animation-delay:5.74s}
 html.motion .stage.seq .slides img:nth-child(3){animation-delay:12.74s}
 html.motion .stage.seq .cap1{animation:cfade 21s linear infinite;opacity:0}
 html.motion .stage.seq .cap1:nth-child(1){animation-delay:-1.26s}
 html.motion .stage.seq .cap1:nth-child(2){animation-delay:5.74s}
 html.motion .stage.seq .cap1:nth-child(3){animation-delay:12.74s}
 html.motion .stage.seq .count i:after{animation:cbar 7s linear 0s infinite}
 /* scroll reveals: fade, gentle rise, then the image settles inside its frame */
 html.motion .rv{opacity:0;transform:translateY(24px);transition:opacity 1.4s var(--e) var(--d,0s),transform 1.8s var(--e) var(--d,0s)}
 html.motion .rv.in{opacity:1;transform:none}
 html.motion .rv .vit img,html.motion .rv.vit img{transform:scale(1.05);transition:transform 2.8s var(--e-settle) calc(var(--d,0s) + .2s),filter 1.2s var(--e)}
 html.motion .rv.in .vit img,html.motion .rv.in.vit img{transform:none}
 html.motion .rv.in a:hover .vit img,html.motion .rv.in .vit:hover img{transform:scale(1.016)}
 html.motion .rv .vit .c{opacity:0;transition:opacity 1.4s var(--e) calc(var(--d,0s) + .9s)}
 html.motion .rv.in .vit .c{opacity:1}
 html.motion .rl{transform:scaleX(0);transform-origin:0 50%;transition:transform 2s var(--e-slow) var(--d,0s)}
 html.motion .rl.in{transform:none}
 ::view-transition-old(root),::view-transition-new(root){animation-duration:1.2s;animation-timing-function:cubic-bezier(.4,0,.2,1)}
}
@media (prefers-reduced-motion:reduce){.rv,.cue,.rl{opacity:1!important;transform:none!important}}

/* ───── phone ───── */
@media (max-width:820px){
 .hero{grid-template-columns:1fr;gap:0;padding:24px 20px 56px}
 .stage{order:-1;margin:7px 7px 0}
 .stage>a{flex:none}
 .stage .vit{flex:none;min-height:0;height:262px;--vp:16px;box-shadow:0 0 0 1px var(--edge),0 0 0 6px var(--paper),0 0 0 7px var(--line),var(--shadow)}
 .vit:before{inset:6px}.vit .c{width:9px;height:9px}.vit .tl,.vit .tr{top:4px}.vit .bl,.vit .br{bottom:4px}.vit .tl,.vit .bl{left:4px}.vit .tr,.vit .br{right:4px}
 .stage .ttl{grid-template-columns:1fr auto;gap:6px 14px;margin-top:18px}
 .stage .ttl .k{grid-column:1}.stage .count{grid-column:2;grid-row:1}.stage .caps{grid-column:1/3}
 .stage .cap1{font-size:18px}
 .hero .t{padding-top:30px}
 .hero .eyebrow.eyebrow{letter-spacing:.24em;font-size:9px;white-space:nowrap}
 .hero h1{font-size:50px;margin:14px 0 16px}.hero .sub{font-size:19.5px}
 .hero .meta{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.hero .meta div{font-size:8.5px;letter-spacing:.12em}.hero .meta b{font-size:16px}
 .reel{padding:76px 20px 84px}
 .reel .head{grid-template-columns:1fr;gap:14px;margin-bottom:44px}.reel .head h2{font-size:44px;text-align:left}.reel .head p{justify-self:start}
 .frames{grid-template-columns:1fr;gap:52px;padding-bottom:0}.fr:nth-child(2n){margin:0}
 .fr .vit{--vp:12px}.fr .vit:before{inset:4px}
 .fr .c2{grid-template-columns:50px 1fr}.fr .c2 b{display:none}.fr .c2 p{font-size:19px}
 .reel .foot-l{flex-direction:column;gap:22px;text-align:center}
 .credits{padding:76px 20px 20px}.credits h2{font-size:40px;margin-bottom:34px}
 .cl a{grid-template-columns:44px 1fr 24px;gap:8px 10px;padding:22px 0}
 .cl h3{font-size:29px}.cl p{grid-column:2/3;font-size:18px}.cl .ar{grid-row:1;grid-column:3}
 .behind{grid-template-columns:auto 1fr;padding:40px 20px 60px}.behind .tlink{grid-column:span 2;justify-self:start}.behind img{width:70px;height:70px}.behind p{font-size:19px}
 .ft{padding:0 20px}
 .host{grid-template-columns:1fr;gap:40px;padding:72px 20px 80px}.host-pic{margin:7px;max-width:330px}.host-t h2{font-size:44px}.host-cta{flex-direction:column;align-items:flex-start;gap:24px}
 .vit.lt{--vp:14px}
 .sb-open{grid-template-columns:1fr;gap:20px;padding:46px 20px 36px}.sb-open h1{font-size:52px}.sb-open p{font-size:20px}
 .sheet{padding:0 20px 70px}.sheet .bar span:nth-child(2){display:none}
 .scenes{grid-template-columns:1fr;gap:52px;padding-bottom:0}.sc:nth-child(3n+2){margin:0}
 .sc .vit{box-shadow:0 0 0 1px var(--edge),0 0 0 6px var(--paper),0 0 0 7px var(--line),var(--shadow)}
 .loopcard{grid-column:auto;flex-direction:column;text-align:center;font-size:21px}
 .w-open{grid-template-columns:1fr;gap:28px;padding:48px 20px 40px}.w-open h1{font-size:56px}.w-open .lede{font-size:20px}
 .viewing{padding:0 20px}
 .plate,.plate.alt{grid-template-columns:1fr;gap:34px;padding:64px 0}
 .plate.alt .tx{order:0}
 .plate .pic{order:-1;margin:7px}
 .plate .pic .vit{--vp:12px;box-shadow:0 0 0 1px var(--edge),0 0 0 6px var(--paper),0 0 0 7px var(--line),var(--shadow)}
 .plate .ph{display:none}
 .plate .pic figcaption,.plate.alt .pic figcaption,.plate:not(.alt):not(.feature) .pic figcaption{padding:0;margin-top:18px}
 .plate .tx .no{font-size:64px}.plate .tx .cat{margin-top:20px}.plate .tx h2{font-size:40px}.plate .tx p{font-size:19px}
 .plate.feature{padding-top:8px}
 .plate.feature .pic .vit img{aspect-ratio:16/10}
 .plate.mark .mark-seal{width:36%}
 .plate.feature .tx{grid-template-columns:1fr;gap:0;margin-top:34px}
 .plate.feature .tx .cat{margin-top:20px}
 .coda{padding:80px 20px 96px}.coda h2{font-size:42px}.coda p{font-size:19px}
}

html[data-theme="dark"] body{background-image:none}
/* ───── secondary pages: one house ───── */
.secondary-page{max-width:1120px;margin:0 auto;padding:96px 56px 110px}
.secondary-page>.eyebrow{display:flex;align-items:center;gap:18px}
.secondary-page>.eyebrow:after{content:"";width:52px;height:1px;background:var(--line)}
.secondary-page h1{font-size:84px;margin:24px 0 56px;color:var(--ink)}
.career .pt{border-top:1px solid var(--line);position:relative}
.career .pt:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--line-2)}
.career .pt li{display:grid;grid-template-columns:170px 1fr 1fr;gap:6px 40px;padding:28px 0;border-bottom:1px solid var(--line-2);align-items:baseline}
.career .yr{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--metal)}
.career .r{font-family:var(--serif);font-size:28px;color:var(--ink);line-height:1.15}
.career .r b{font-weight:500;color:var(--metal);font-style:italic}
.career .w{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);justify-self:end;text-align:right}
.career .n{grid-column:2/4;font-family:var(--serif);font-size:18px;color:var(--muted)}
.about-story{display:grid;grid-template-columns:1fr;max-width:760px}
.about-body p{font-family:var(--serif);font-size:21px;line-height:1.6;color:var(--ink-2);margin-bottom:22px}
.about-body .about-lede{font-size:27px;line-height:1.45;color:var(--ink);padding-bottom:26px;margin-bottom:34px;border-bottom:1px solid var(--line)}
.about-body .about-lede:first-letter{font-size:3.1em;float:left;line-height:.82;padding:6px 12px 0 0;color:var(--metal);font-style:italic}
.about-body .about-invite{font-style:italic;color:var(--metal);margin-top:34px}
.text-link{position:relative}
.text-link:after{content:"";position:absolute;left:50%;bottom:0;width:100%;height:1px;background:color-mix(in srgb,var(--metal) 65%,transparent);transform:translateX(-50%);transition:width .9s var(--e)}
@media (prefers-reduced-motion:no-preference){.text-link:hover:after{width:42%}}
.cert-list{border-top:1px solid var(--line);position:relative}
.cert-list:before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--line-2)}
.cert-list li{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:baseline;padding:30px 0;border-bottom:1px solid var(--line-2)}
.cert-name{font-family:var(--serif);font-size:27px;color:var(--ink);line-height:1.2}
.cert-issuer{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--metal)}
.certs-note{margin-top:34px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--muted)}
.offer-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:40px;margin:24px 0 56px}
.offer-head h1{margin:0}
.offer-head span{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--muted);max-width:320px;text-align:right}
.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.offer-card{position:relative;display:flex;flex-direction:column;background:var(--ivory);padding:38px 32px 30px;border:1px solid var(--line);box-shadow:inset 0 0 0 7px var(--ivory),inset 0 0 0 8px var(--line-2),var(--shadow);transition:box-shadow 1s var(--e),border-color 1s var(--e);min-height:360px}
.offer-card:hover{border-color:var(--metal)}
.oc-num{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--metal)}
.oc-glyph{color:var(--metal);margin:26px 0 18px;display:block}
.oc-title{font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.08;color:var(--ink)}
.oc-line{font-family:var(--serif);font-size:19px;color:var(--muted);margin-top:12px;line-height:1.45;flex:1}
.oc-open{display:flex;align-items:center;gap:12px;margin-top:28px;padding-top:16px;border-top:1px solid var(--line-2);font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink)}
.oc-dash{width:18px;height:1px;background:var(--metal);transition:width .9s var(--e)}
.offer-card:hover .oc-dash{width:34px}
.oc-arrow{margin-left:auto;color:var(--metal)}
.contact-page{max-width:900px}
.contact-page .intro{font-family:var(--serif);font-size:23px;line-height:1.5;color:var(--ink-2);max-width:620px;margin-top:-26px}
.contact-reassure{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--metal);margin:18px 0 44px}
.studio-form{background:var(--ivory);padding:48px 52px 40px;border:1px solid var(--line);box-shadow:inset 0 0 0 8px var(--ivory),inset 0 0 0 9px var(--line-2),var(--shadow);position:relative}
.form-row{display:flex;flex-direction:column;gap:8px;margin-bottom:26px}
.form-row label{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.form-row .opt{letter-spacing:.1em;text-transform:none;font-style:italic;font-family:var(--serif);font-size:14px}
.form-row input,.form-row textarea{appearance:none;width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font-family:var(--serif);font-size:21px;padding:8px 0 10px;border-radius:0;transition:border-color .7s var(--e)}
.form-row textarea{resize:vertical;min-height:140px;line-height:1.5}
.form-row input::placeholder,.form-row textarea::placeholder{color:color-mix(in srgb,var(--muted) 60%,transparent);font-style:italic}
.form-row input:focus,.form-row textarea:focus{outline:none;border-bottom-color:var(--metal)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.hp-check{position:absolute;left:-9999px;opacity:0}
.form-submit{appearance:none;position:relative;isolation:isolate;overflow:hidden;display:inline-flex;gap:16px;align-items:center;margin-top:8px;background:transparent;color:var(--ink);border:1px solid color-mix(in srgb,var(--metal) 70%,transparent);box-shadow:inset 0 0 0 4px var(--ivory),inset 0 0 0 5px var(--line-2);font-size:10px;letter-spacing:.38em;text-transform:uppercase;font-weight:500;padding:20px 32px 19px 38px;border-radius:0;transition:color .7s var(--e)}
.form-submit .btn-arrow{color:var(--metal)}
.form-submit:before{content:"";position:absolute;inset:5px;z-index:-1;background:var(--fill);clip-path:inset(100% 0 0 0);transition:clip-path .9s var(--e)}
.form-submit:disabled{opacity:.6;cursor:progress}
@media (prefers-reduced-motion:no-preference){.form-submit:hover:not(:disabled){color:var(--fill-on)}.form-submit:hover:not(:disabled):before{clip-path:inset(0 0 0 0)}}
.form-status{margin-top:16px;font-family:var(--serif);font-style:italic;font-size:17px;color:var(--muted);min-height:1.4em}
.form-status.is-error{color:#9b3b2f}
html[data-theme="dark"] .form-status.is-error{color:#e39a8c}
.form-success{background:var(--ivory);padding:56px 52px;border:1px solid var(--line);box-shadow:inset 0 0 0 8px var(--ivory),inset 0 0 0 9px var(--line-2);text-align:center}
.success-eyebrow{font-size:10px;letter-spacing:.38em;text-transform:uppercase;color:var(--metal)}
.success-title{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1.02;margin:18px 0 16px;color:var(--ink)}
.success-title em{font-style:italic;color:var(--metal)}
.success-copy{font-family:var(--serif);font-size:20px;color:var(--muted);margin-bottom:24px}
.contact-secondary{margin-top:40px}
/* footer */
.site-footer{max-width:1328px;margin:0 auto;padding:34px 56px 44px;display:flex;justify-content:space-between;align-items:center;position:relative;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.site-footer:before{content:"";position:absolute;left:56px;right:56px;top:0;height:1px;background:var(--line)}
.studio-footer__links a{transition:color .6s var(--e)}.studio-footer__links a:hover{color:var(--metal)}
.studio-credit{display:flex;align-items:center;gap:11px}
.studio-credit img{width:25px;height:25px;filter:var(--seal-f)}
.studio-credit__copy{display:flex;gap:10px;align-items:baseline}
.studio-credit__name{font-family:var(--serif);font-size:17px;letter-spacing:0;text-transform:none;color:var(--ink)}
.studio-credit__name i{color:var(--metal)}
@media (min-width:821px) and (max-width:1179px){
 .hero{grid-template-columns:330px 1fr;gap:40px;padding:48px 32px 70px}.hero h1{font-size:58px}.hero .sub{font-size:20px}
 .hero .meta{gap:18px}
 .stage .vit{min-height:420px}.hero .eyebrow.eyebrow{letter-spacing:.24em;font-size:9px}.stage .ttl{grid-template-columns:1fr auto;gap:6px 16px}.stage .ttl .k{grid-column:1}.stage .count{grid-column:2;grid-row:1}.stage .caps{grid-column:1/3}
 .reel{padding:96px 32px 104px}.reel .head{grid-template-columns:1fr;gap:16px}.reel .head h2{text-align:left;font-size:54px}.reel .head p{justify-self:start}
 .frames{gap:56px 36px}
 .credits{padding:100px 32px 30px}.cl a{grid-template-columns:70px 1fr 1fr 30px;gap:20px}.cl h3{font-size:36px}.cl p{font-size:19px}
 .host{grid-template-columns:320px 1fr;gap:56px;padding:90px 32px 100px}.host-t h2{font-size:52px}.host-cta{flex-wrap:wrap;gap:22px 30px}
 .sb-open{padding:72px 32px 52px;gap:40px}.sb-open h1{font-size:66px}.sheet{padding:0 32px 90px}.scenes{gap:60px 28px}.sc h3{font-size:25px}
 .w-open{padding:80px 32px 80px;gap:48px}.w-open h1{font-size:72px}
 .viewing{padding:0 32px}.plate{grid-template-columns:1fr 290px;gap:52px}.plate.alt{grid-template-columns:290px 1fr}
 .plate .tx h2{font-size:42px}.plate .tx .no{font-size:76px}
 .plate.feature .tx{grid-template-columns:100px 1fr 1fr;gap:36px}
 .secondary-page{padding:80px 32px 96px}.offer-grid{gap:18px}.offer-card{padding:32px 24px 26px}
 .site-footer{padding:30px 32px 40px}.site-footer:before{left:32px;right:32px}
}
@media (max-width:1179px){
 .site-header{padding:18px 32px 16px}.site-header:before,.site-header:after{left:32px;right:32px}
}
@media (max-width:820px){
 .site-header{padding:16px 20px 14px}.site-header:before,.site-header:after{left:20px;right:20px}
 .identity img{width:30px;height:30px}.identity .nameplate{font-size:20px;gap:11px}.identity .nameplate:before{height:22px}
 .secondary-page{padding:52px 20px 70px}
 .secondary-page h1{font-size:50px;margin:16px 0 36px}
 .career .pt li{grid-template-columns:1fr;gap:4px;padding:22px 0}.career .w{justify-self:start;text-align:left}.career .n{grid-column:auto;font-size:17px}.career .r{font-size:25px}
 .about-body p{font-size:19px}.about-body .about-lede{font-size:23px}
 .cert-list li{grid-template-columns:1fr;gap:8px;padding:22px 0}.cert-name{font-size:23px}
 .offer-head{grid-template-columns:1fr;gap:12px}.offer-head span{text-align:left}
 .offer-grid{grid-template-columns:1fr;gap:20px}.offer-card{min-height:0;padding:30px 26px 24px}
 .contact-page .intro{font-size:20px;margin-top:-14px}
 .studio-form{padding:32px 24px 28px}.form-success{padding:40px 24px}.success-title{font-size:40px}
 .site-footer{padding:28px 20px 36px;flex-direction:column;gap:18px;align-items:flex-start}.site-footer:before{left:20px;right:20px}
}
@media (max-width:400px){.btn,.form-submit{letter-spacing:.26em;padding:18px 22px 17px 26px;gap:12px}}