@font-face{font-family:DM;src:url("./assets/dm-sans.woff2") format("woff2");font-weight:400 750;font-display:swap}
@font-face{font-family:Print;src:url("./assets/barlow-condensed.ttf") format("truetype");font-weight:800;font-display:swap}
:root{color-scheme:dark;--wall:#191a17;--ink:#f3f1e9;--muted:#bfbdaf;--brass:#ddc185;--wood-hi:#575751;--wood-mid:#373834;--wood-dark:#161714;--wood-side:#121310;--lip:#4b4b43;--edge:#171815;--trim:#272923;--paper:#e6deca;--margin:clamp(22px,5.4vw,94px);font-family:DM,Arial,sans-serif;color:var(--ink);background:var(--wall);scroll-behavior:smooth}
:root[data-finish=white]{--wood-hi:#f3f0e6;--wood-mid:#dcd9cf;--wood-dark:#aca99f;--wood-side:#8c897e;--lip:#cfcabe;--edge:#89877e;--trim:#c7c4b9}
*{box-sizing:border-box}
body{margin:0;min-width:280px}
a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,label{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}
:focus-visible{outline:2px solid var(--brass);outline-offset:5px}
.skip,.sr{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.skip:focus{position:fixed;clip-path:none;top:8px;left:8px;width:auto;height:auto;background:#f1e9d7;color:#171815;padding:12px;z-index:10}
.site-head{height:86px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding:0 var(--margin);background:#181916;position:relative;z-index:1;border-bottom:1px solid #ffffff10}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:23px;font-weight:650;letter-spacing:-1.15px;justify-self:start;white-space:nowrap}
.brand img{display:block}
.site-head nav{display:flex;gap:34px}
.site-head nav a,.head-action,footer a,footer>span{font-size:14px}
.site-head nav a{color:#d3d1c7}.site-head nav a:hover,footer a:hover{color:var(--brass)}
.head-action{justify-self:end;border:1px solid #ffffff38;border-radius:32px;padding:10px 17px;display:flex;align-items:center;gap:17px;transition:background .2s}
.head-action:hover{background:#ffffff0e}.head-action span,.primary span{font-size:1.25em}
.hero{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);grid-template-rows:auto auto;align-content:center;column-gap:clamp(28px,4.6vw,88px);padding:clamp(40px,5.5vh,72px) var(--margin) clamp(38px,5.2vh,66px);min-height:min(820px,calc(100svh - 86px));background:radial-gradient(ellipse at 78% 29%,#49483d 0%,#383932 18%,#242620 43%,#1b1c18 72%,#191a17);scroll-margin-top:10px}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.09;background-image:url("./assets/grain.svg")}
.hero-copy{grid-area:1/1/3/2;align-self:center}
h1,h2,h3,p,figure{margin:0}
h1{font-size:clamp(64px,6.95vw,118px);font-weight:500;line-height:.99;letter-spacing:-.075em;text-wrap:nowrap}
.hero-copy p{margin-top:26px;color:#cfcec3;font-size:clamp(16px,1.27vw,21px);line-height:1.55;max-width:35ch;letter-spacing:-.018em}
.hero-actions{margin-top:28px}
.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;padding:14px 21px;border-radius:30px;background:var(--brass);color:#282319;font-size:15px;font-weight:650;transition:background .2s,transform .2s}
.primary:hover{background:#ecd6a3;transform:translateY(-2px)}.primary:active{transform:scale(.98)}
.exhibit{grid-area:1/2;align-self:center;min-width:0}
.stage{position:relative;display:grid;place-items:center;min-height:0;padding:27px 10px 29px;perspective:1100px;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none;--pitch:-.48deg;--turn:-1.28deg;--light:34%;--shadow-x:4px;--shadow-y:7px;--shift-x:0px;--shift-y:0px}
.stage:focus-visible{outline-offset:-4px;border-radius:12px}
.frame-object{position:relative;width:clamp(265px,min(31.7vw,43vh),485px);aspect-ratio:4/4.95;transform:rotateX(var(--pitch)) rotateY(var(--turn)) rotateZ(-3deg);transition:transform .14s ease-out;will-change:transform;transform-style:preserve-3d}
.frame-object::before{position:absolute;content:"";inset:6px -7px -8px 5px;background:var(--wood-side);transform:skewY(1deg);box-shadow:8px 15px 10px -4px #07080770,15px 27px 27px -9px #05060490,24px 45px 48px -18px #0007}
.wood{position:absolute;inset:0;background:repeating-linear-gradient(93deg,transparent 0 2px,#1111 2px 3px,transparent 3px 5px),linear-gradient(120deg,var(--wood-hi),var(--wood-mid) 41%,var(--wood-dark) 95%);padding:4.3%;box-shadow:inset 1px 1px 1px #fff4,inset -2px -2px 2px #0009}
.wood::after{content:"";inset:0;position:absolute;pointer-events:none;opacity:.14;background-image:url("./assets/grain.svg")}
.recess{height:100%;padding:1.9%;position:relative;background:linear-gradient(132deg,var(--edge) 16%,var(--trim) 78%,var(--lip));box-shadow:0 0 1px 1px #08090565,inset 2px 3px 3px #0007}
.art{height:100%;width:100%;position:relative;isolation:isolate;overflow:hidden;background:var(--paper);box-shadow:inset 5px 7px 13px #13130d48;container-type:inline-size}
.print-ink{position:absolute;inset:0;overflow:hidden;color:#20231d}
.print-ink::after{content:"";position:absolute;inset:0;opacity:.17;background-image:url("./assets/grain.svg")}
.print-top,.print-foot{position:absolute;left:7%;right:7%;display:flex;justify-content:space-between;align-items:center}
.print-top{top:5%;font-weight:750;font-size:3.5cqw;letter-spacing:.08em}.print-title{position:absolute;left:5.5%;top:8.7%;font:800 35cqw/.9 Print,'Arial Narrow',sans-serif;letter-spacing:-.052em;white-space:nowrap}
.track{position:absolute;top:28%;left:41%;width:24%;height:65%;transform:skewX(-21deg);background:#d1c4a8}
.track-thin{left:68%;width:1.6%;background:#b4a584}
.print-foot{bottom:5%;align-items:end}.print-foot strong{font-family:Print,sans-serif;font-size:6.8cqw;font-weight:800;text-transform:uppercase;line-height:1}.print-foot span{font-size:2.65cqw;line-height:1.2;text-align:right}
.miniature{position:absolute;width:auto;height:62%;left:52%;top:52%;transform:translate(calc(-50% + var(--shift-x)),calc(-50% + var(--shift-y))) rotate(20deg);filter:drop-shadow(var(--shadow-x) var(--shadow-y) 3px #332b1c80);pointer-events:none}
.reflection{position:absolute;inset:0;background:linear-gradient(115deg,transparent calc(var(--light) - 31%),#ffffff16 calc(var(--light) - 9%),#ffffff1f var(--light),#ffffff04 calc(var(--light) + 1.4%),transparent calc(var(--light) + 24%));box-shadow:inset 3px 4px 8px #18190c29;pointer-events:none}
.scene-caption{display:flex;justify-content:center;gap:9px;color:#cfccbd;font-size:12px;letter-spacing:.015em}.scene-caption span:nth-child(2){color:#929385}
.finish-line{grid-area:2/2;display:flex;justify-content:center;margin-top:15px;align-self:start}
.finishes{display:inline-flex;gap:2px;padding:4px;margin:0;min-width:0;border:1px solid #fff2;border-radius:30px;background:linear-gradient(140deg,#ffffff0c,#d4d3b904);box-shadow:inset 0 1px #fff1,0 4px 20px #0002;backdrop-filter:blur(8px)}
.finishes label{position:relative;cursor:pointer}.finishes input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.finishes label>span{display:flex;align-items:center;gap:7px;border-radius:24px;padding:9px 13px;color:#d0cec3;font-size:13px;line-height:1.2;transition:.2s ease}
.finishes input:checked+span{color:#f8f5e9;background:#eae8cf1a;box-shadow:inset 0 0 0 1px #f4f0dc31}
.finishes input:focus-visible+span{outline:2px solid var(--brass);outline-offset:3px}
.chip{width:13px;height:13px;display:block;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff4d}.chip.black{background:#242520}.chip.white{background:#e0ddd2}
.study{padding:clamp(65px,7vw,118px) var(--margin);background:#171815}
.study-lead{display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:start;margin-bottom:46px}
h2{font-size:clamp(38px,4vw,72px);letter-spacing:-.06em;font-weight:500;line-height:1.02}
.study-lead p,.material-copy p{color:var(--muted);line-height:1.55;max-width:44ch;font-size:clamp(15px,1.13vw,18px)}
.material-study{background:#242520;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;scroll-margin-top:24px;overflow:hidden}
.material-visual{position:relative;display:grid;place-items:center;min-height:340px;height:clamp(340px,27vw,420px);perspective:850px;background:radial-gradient(ellipse at 42% 55%,#434339,#30322a 55%,#292b25);overflow:hidden}
.assembly{width:154px;aspect-ratio:4/5;position:relative;transform-style:preserve-3d;transform:rotateX(53deg) rotateZ(-32deg);margin-top:72px}
.sample-board,.sample-glass{position:absolute;inset:0;transition:transform .45s,opacity .35s;will-change:transform}
.sample-board{background:#ddd4bc;border:7px solid var(--wood-mid);box-shadow:0 11px 0 var(--wood-side),0 26px 22px #0005;overflow:hidden;color:#262923}
.sample-board b{position:absolute;top:1%;left:5%;font:800 56px/1 Print,sans-serif;letter-spacing:-3px}
.sample-board span{position:absolute;background:#b8aa8d;width:33%;height:82%;left:20%;top:28%;transform:skewX(-20deg)}
.sample-car{height:72%;width:auto;position:absolute;left:29%;top:14%;transform:translateZ(53px) rotate(16deg);filter:drop-shadow(4px 7px 3px #10120c55);transition:transform .45s,opacity .35s}
.sample-glass{transform:translateZ(101px);border:2px solid #e0e5d772;background:linear-gradient(120deg,#fff1,#fff2 36%,#fff0 38%,#fff1);box-shadow:inset 1px 1px #fff6}
[data-layer=print] .sample-car{transform:translateZ(66px) rotate(16deg);opacity:.32}
[data-layer=print] .sample-glass{transform:translateZ(116px);opacity:.28}
[data-layer=glass] .sample-glass{transform:translateZ(117px);background-color:#f9fff316}
[data-layer=glass] .sample-car{opacity:.72}
.material-copy{padding:36px clamp(25px,4vw,72px)}h3{font-weight:500;letter-spacing:-.045em;font-size:clamp(31px,3vw,52px);line-height:1.05}
.layer-options{display:flex;gap:4px;margin:24px 0 18px}
.layer-options button{font-size:14px;border:0;padding:11px 16px;background:transparent;color:#c7c8bc;border-radius:22px}
.layer-options button[aria-pressed=true]{background:#ddd5bc;color:#24251f}.layer-options button:hover{box-shadow:inset 0 0 0 1px #b1af9a77}
.material-copy p{min-height:4.8em}
footer{display:flex;align-items:center;gap:20px;padding:30px var(--margin);background:#12130f;color:#d8d6ca}footer .footer-brand{font-size:18px}footer>span{color:#aaa99b}footer>a:last-child{margin-left:auto}
@media(min-width:1600px){.hero{column-gap:9vw}.headline{font-size:110px}}
@media(max-width:800px) and (min-width:651px){h1{font-size:clamp(47px,7.6vw,62px)}.hero{column-gap:15px;min-height:625px}.frame-object{width:min(37vw,325px)}.site-head{height:72px}.site-head nav{gap:18px}.hero-copy p{font-size:16px}.study-lead{grid-template-columns:1fr 1fr}}
@media(max-width:650px){
 :root{--margin:clamp(17px,5.5vw,27px)}
 .site-head{height:62px;display:flex;justify-content:space-between;gap:15px}.brand{font-size:21px;gap:7px}.brand img{width:30px;height:30px}.site-head nav{display:none}.head-action{font-size:12px;padding:8px 13px;gap:12px}
 .hero{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:auto;padding:30px var(--margin) 28px;background:radial-gradient(ellipse at 60% 58%,#44453a 0%,#2b2d25 36%,#1b1d18 73%)}
 .hero-copy{display:contents}.hero-copy h1{align-self:stretch;font-size:clamp(46px,11vw,67px);line-height:.99;letter-spacing:-.065em}.hero-copy p{align-self:stretch;font-size:15px;line-height:1.42;max-width:39ch;margin-top:11px}
 .exhibit{width:100%;order:1}.stage{padding:24px 4px 19px}
 .frame-object{width:clamp(172px,min(53vw,29svh),265px)}
 .scene-caption{font-size:11.5px;gap:8px}
 .finish-line{order:2;align-self:center;margin-top:10px}.finishes label>span{padding:10px 14px;font-size:13px}
 .hero-actions{order:3;align-self:stretch;margin:18px 0 0;padding:0}.primary{width:100%;justify-content:center;gap:18px;padding:12px 20px}
 .study{padding:52px var(--margin)}.study-lead{display:block;margin-bottom:25px}.study-lead p{margin-top:13px}.material-study{grid-template-columns:1fr}.material-visual{height:265px;min-height:265px}.assembly{width:127px}.material-copy{padding:24px}.material-copy p{min-height:3em}
 footer{padding:23px var(--margin);flex-wrap:wrap;gap:10px}footer>span,footer>a:last-child{font-size:12px}footer .footer-brand{font-size:16px;gap:5px}.footer-brand img{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.frame-object{transform:none;will-change:auto}.reflection{background:linear-gradient(115deg,transparent 24%,#fff1 40%,transparent 42%)}}

.carousel-viewport{width:100%;overflow:hidden;padding:35px 0 40px}.carousel-rail{display:flex;transition:transform .65s cubic-bezier(.22,.8,.25,1)}.carousel-slide{flex:0 0 100%;display:grid;place-items:center}.stage{padding:0;display:block}.carousel-controls{display:flex;justify-content:center;align-items:center;gap:5px;margin-top:14px}.carousel-controls button{background:transparent;border:0;color:#d5d1c1;font-size:12px;padding:9px 7px;border-radius:20px}.carousel-controls button[aria-pressed=true]{background:#ddd5bc;color:#222}.car-choices{display:flex;gap:1px}.print-ink{color:var(--poster-ink,#20231d)}.track{background:var(--poster-stripe,#d1c4a8)}.wood{padding:5.5%}.recess{padding:5%;box-shadow:inset 7px 10px 8px #000a}.frame-object::before{inset:10px -17px -19px 10px;box-shadow:12px 22px 15px -4px #07080790,22px 40px 38px -10px #050604a0}.frame-object{transform:rotateX(var(--pitch)) rotateY(calc(var(--turn) - 5deg)) rotateZ(-3deg)}.finishes{margin-top:4px}
@media(max-width:650px){.carousel-viewport{padding:23px 0 27px}.carousel-controls{margin-top:8px}.carousel-controls button{padding:8px 6px;font-size:11px}.frame-object{width:clamp(172px,min(53vw,29svh),265px)}}
@media(prefers-reduced-motion:reduce){.carousel-rail{transition:none}.frame-object{transform:none}}
