@font-face{font-family:"Satoshi";src:url("../../assets/font/satoshi-var.woff2") format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"IS";src:url(../../assets/font/instrumentserif-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IS";src:url(../../assets/font/instrumentserif-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
:root{--c1:#EDE5D8;--c2:#5B6B3A;--c3:#B5512E;--bg:#EDE5D8;--ink:#2C3020;--mute:#6b6a58;--line:rgba(44,48,32,.16);--cur:#6B7440;
 --f-body:"Satoshi",system-ui,sans-serif;--f-ui:"Satoshi",system-ui,sans-serif;--f-s:"IS",Georgia,serif;--ease:cubic-bezier(.16,1,.3,1);--ease2:cubic-bezier(.76,0,.24,1);--acc:cubic-bezier(.65,0,.15,1)}
html,body{background:var(--bg);transition:background-color .9s var(--ease)}
body{color:var(--ink)}
em{font-style:italic}
::selection{background:var(--c3);color:#fff}
.eyebrow{margin:0;font:600 12px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
h2{margin:16px 0 0;font:400 clamp(52px,6vw,104px)/.92 var(--f-s);letter-spacing:-.02em}
h2 em{color:var(--c3)}
.pill{display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 24px;border-radius:999px;font:600 15px/1 var(--f-ui);text-decoration:none;border:1px solid var(--ink);color:var(--ink);transition:background .3s,color .3s}
.pill svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.pill:hover svg{transform:translateX(4px)}
.pill:hover{background:var(--ink);color:var(--bg)}
.pill-solid{background:var(--c3);border-color:var(--c3);color:#fff}
.pill-solid:hover{background:var(--ink);border-color:var(--ink)}
main{position:relative}
/* nav */
.topnav{position:fixed;z-index:92;top:58px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;height:42px;padding:0 4px 0 16px;border-radius:999px;background:color-mix(in srgb,var(--bg) 80%,transparent);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.tn-logo{display:flex;align-items:center;gap:3px;margin-right:10px;font:italic 400 24px/1 var(--f-s);text-decoration:none}
.tn-logo i{width:6px;height:6px;border-radius:50%;background:var(--cur);margin-top:7px}
.tn-link{font:600 13px/1 var(--f-ui);text-decoration:none;padding:10px 14px;border-radius:99px}
.tn-cta{background:var(--ink);color:var(--bg)}
h2{font-size:clamp(46px,13vw,60px)}
/* hero */
.hero{padding:114px 18px 30px;display:flex;flex-direction:column;gap:14px}
.hero-l{display:contents}
.hero-l .eyebrow{order:1;font-size:10px}
.hl1{order:2;margin:0;font:400 clamp(52px,15vw,66px)/.9 var(--f-s);letter-spacing:-.03em}
.hl1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hl1 .ln>span{display:inline-block}
.hl1 em{color:var(--c3)}
.lede{order:3;margin:0;font:400 15px/1.5 var(--f-body);color:var(--mute)}
.stage{order:4;position:relative;height:44svh;min-height:300px;margin:0 -18px;touch-action:pan-y}
.stage::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 58%,color-mix(in srgb,var(--cur) 26%,transparent),transparent 70%)}
#chairGl{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.stage-tag{position:absolute;left:0;right:0;bottom:8px;margin:0;display:flex;flex-direction:column;align-items:center;gap:5px;pointer-events:none}
.stage-tag span{font:italic 400 24px/1 var(--f-s);display:inline-block}
.stage-tag small{font:600 10px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.counter{order:5;display:flex;align-items:flex-end;gap:10px}
.odo{display:inline-flex;font:400 92px/.8 var(--f-s);letter-spacing:-.04em;height:.8em;overflow:hidden}
.odo .dg{display:inline-block;height:.8em;overflow:hidden}
.odo .dg>span{display:flex;flex-direction:column;transition:transform 1s var(--ease2)}
.odo .dg>span>span{height:.8em;line-height:.8;display:block}
.of{font:400 24px/1 var(--f-s);color:var(--mute);margin-bottom:4px}
.arrows{display:flex;gap:8px;margin:0 0 2px auto}
.arr{width:48px;height:48px;border-radius:50%;border:1px solid var(--ink);background:transparent;display:grid;place-items:center}
.arr svg{width:20px;height:20px}
/* accordion: stacked rows, tap to expand */
.acc{order:6;display:flex;flex-direction:column;gap:6px}
.bar{position:relative;height:56px;border:0;border-radius:20px;background:var(--bc);color:#fff;padding:0;overflow:hidden;text-align:left;transition:height .7s var(--acc);display:block;width:100%}
.bar.on{height:212px}
.bar::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.1),transparent 40%,rgba(0,0,0,.14));pointer-events:none}
.bar[data-i="2"]{color:#3a3526}
.bar-n{position:absolute;top:21px;left:18px;font:600 11px/1 var(--f-ui);letter-spacing:.1em;opacity:.8}
.bar-v{position:absolute;top:14px;left:52px;font:italic 400 26px/1 var(--f-s);transition:opacity .3s}
.bar.on .bar-v{opacity:0}
.bar-body{position:absolute;left:18px;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(12px);transition:opacity .3s,transform .4s var(--ease)}
.bar.on .bar-body{opacity:1;transform:none;transition:opacity .5s .3s,transform .8s .25s var(--ease)}
.bar-k{font:600 10px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.bar-t{font:400 38px/.95 var(--f-s);letter-spacing:-.02em}
.bar-p{font:400 14px/1.45 var(--f-body);opacity:.92}
.bar-cta{display:none}
/* materials */
.materials{padding:12svh 18px 8svh;display:grid;gap:26px}
.m-p{margin:16px 0 0;font:400 15px/1.55 var(--f-body);color:var(--mute)}
.m-grid{display:grid;gap:16px}
.chips{display:flex;gap:8px;overflow-x:auto;margin:0 -18px;padding:2px 18px 6px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{position:relative;flex:none;display:flex;align-items:center;gap:8px;height:50px;padding:0 16px 0 6px;border-radius:99px;border:1px solid var(--line);background:color-mix(in srgb,#fff 40%,transparent);font:600 13px/1 var(--f-ui);overflow:hidden}
.chip.on{border-color:var(--ink)}
.chip-sw{width:38px;height:38px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.chip .rp{position:absolute;border-radius:50%;background:var(--sw);opacity:.35;transform:scale(0);animation:rp .7s var(--ease) forwards;pointer-events:none}
@keyframes rp{to{transform:scale(1);opacity:0}}
.m-view{position:relative;display:grid;grid-template-rows:170px auto;border-radius:26px;overflow:hidden;border:1px solid var(--line);isolation:isolate}
.ripple{position:absolute;z-index:-1;border-radius:50%;width:10px;height:10px;background:var(--rc,#C9B48E);transform:translate(-50%,-50%) scale(0);pointer-events:none}
.m-swatch{margin:12px 12px 0;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.m-info{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;color:var(--mi,var(--ink))}
.m-k{margin:0;font:600 11px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.m-info h3{margin:0;font:400 34px/1 var(--f-s);letter-spacing:-.02em}
.m-dl{margin:6px 0 0;display:grid}
.m-dl div{display:flex;justify-content:space-between;padding:11px 0;border-top:1px solid color-mix(in srgb,currentColor 22%,transparent);font:400 14px/1 var(--f-body)}
.m-dl dt{opacity:.7}
.m-dl dd{margin:0;font-weight:600}
.sw-boucle{background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.55) 0 2px,transparent 3px) 0 0/9px 9px,radial-gradient(circle at 70% 70%,rgba(0,0,0,.12) 0 2px,transparent 3px) 0 0/11px 11px,var(--sw2,#D8C7A2)}
.sw-linen{background:repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(0,0,0,.1) 0 1px,transparent 1px 3px),var(--sw2,#8E9A6A)}
.sw-velvet{background:radial-gradient(120% 90% at 20% 10%,rgba(255,255,255,.35),transparent 50%),radial-gradient(90% 90% at 90% 100%,rgba(0,0,0,.35),transparent 60%),var(--sw2,#3E5137)}
.sw-wool{background:repeating-linear-gradient(45deg,rgba(255,255,255,.12) 0 3px,transparent 3px 7px),repeating-linear-gradient(-45deg,rgba(0,0,0,.12) 0 3px,transparent 3px 7px),var(--sw2,#B5512E)}
.sw-cord{background:repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 4px,rgba(0,0,0,.14) 4px 5px,transparent 5px 9px),var(--sw2,#C47E5A)}
.chip .chip-sw{--sw2:var(--sw)}
/* room */
.room{height:260svh}
.room-sticky{position:sticky;top:0;height:100svh;overflow:hidden}
#roomGl{position:absolute;inset:0;width:100%;height:100%;display:block}
.room-cap{position:absolute;left:18px;right:18px;bottom:7svh;color:#fff;text-shadow:0 2px 24px rgba(30,20,8,.4)}
.room-cap .eyebrow{color:rgba(255,255,255,.85)}
.rc-h{position:relative;height:2.1em;font-size:40px}
.rc{position:absolute;left:0;bottom:0;opacity:0;transform:translateY(24px);transition:opacity .6s,transform .8s var(--ease)}
.rc.on{opacity:1;transform:none}
.rc em{color:#ffd9a8}
.room-prog{margin-top:16px;width:160px;height:2px;background:rgba(255,255,255,.3);overflow:hidden}
.room-prog i{display:block;height:100%;background:#fff;transform-origin:left;transform:scaleX(0)}
/* size */
.size{padding:12svh 18px 8svh;display:grid;gap:28px}
.units{position:relative;display:inline-flex;margin-top:22px;padding:4px;border-radius:99px;border:1px solid var(--line)}
.u{position:relative;z-index:1;width:60px;height:42px;border:0;border-radius:99px;background:transparent;font:600 14px/1 var(--f-ui);transition:color .4s}
.u.on{color:var(--bg)}
.u-ind{position:absolute;top:4px;left:4px;width:60px;height:42px;border-radius:99px;background:var(--ink);transition:transform .5s var(--ease)}
.units.in .u-ind{transform:translateX(60px)}
.dim{width:100%;height:auto;color:var(--ink);overflow:visible}
.chair-l path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2s var(--ease)}
.dims .dl{fill:none;stroke:var(--c3);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ease) .8s}
.dims .dt{stroke:var(--c3);stroke-width:3;opacity:0;transition:opacity .5s 1.5s}
.dv{font:400 40px/1 var(--f-s);fill:var(--ink);text-anchor:middle;opacity:0;transition:opacity .6s 1.6s}
.dk{font:600 15px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;fill:var(--mute);text-anchor:middle;opacity:0;transition:opacity .6s 1.7s}
.dv-v,.dk-v,.dv-l,.dk-l{text-anchor:start}
.dim.in .chair-l path,.dim.in .dl{stroke-dashoffset:0}
.dim.in .dt,.dim.in .dv,.dim.in .dk{opacity:1}
/* visit */
.visit{min-height:80svh;padding:10svh 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;background:radial-gradient(70% 50% at 50% 55%,color-mix(in srgb,var(--cur) 22%,transparent),transparent 70%)}
.v-h{margin:0;font:400 clamp(64px,19vw,90px)/.88 var(--f-s);letter-spacing:-.035em}
.v-h em{color:var(--c3)}
.v-p{margin:0;font:400 16px/1.5 var(--f-body);color:var(--mute)}
.v-cta{display:grid;gap:10px;width:100%}
.v-cta .pill{justify-content:center}
.v-note{margin:4px 0 0;font:500 11px/1.4 var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
@media (prefers-reduced-motion:reduce){.room{height:auto}.room-sticky{position:relative;height:80svh}.rc{position:relative;display:block;opacity:1;transform:none}.rc-h{height:auto}}

/* design pass apply (7994e000, Oct 27) */
/* body/UI Inter Tight -> Satoshi. Tabular odometer; colour bars read as a swatch book (hairlines, not gaps). */
.odo,.bar-n{font-variant-numeric:tabular-nums}
.acc{gap:0}
.bar{border-radius:0;box-shadow:inset -1px 0 0 rgba(255,255,255,.28)}
.bar:first-child{border-radius:26px 0 0 26px}
.bar:last-child{border-radius:0 26px 26px 0;box-shadow:none}
.pill{font-weight:500;letter-spacing:.02em}

/* glass body (helper) */
.topnav.lg-rim{position:fixed}
.topnav.lg-rim{position:fixed}
.topnav.lg{--lg-alpha:76%}
.tn-cta.lg{--lg-ink:#2C3020}
.pill-solid.lg{--lg-ink:#A84A29}
.chip.lg{--lg-tint:#fff;--lg-alpha:38%}
.chips.lg-seg{border-radius:0}
.chips.lg-seg>.chip.on{color:#2C3020!important}
.lg.lg--ink{--_al:96%}
.v-cta .pill.lg:not(.pill-solid):hover{color:var(--ink)}