/* The existing illustrated room film, scrubbed with native page scrolling. */
.room-scroll { --room-progress:0; background:#fff; position:relative; scroll-margin-top:76px; }
.room-scroll-stage { min-height:650px; height:calc(100svh - 76px); max-height:1000px; position:relative; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr); align-items:center; max-width:1600px; margin:auto; padding:35px 5% 65px; gap:1%; }
.room-scroll-enabled { height:170svh; }
.room-scroll-enabled .room-scroll-stage { position:sticky; top:76px; }
.room-scroll-copy { position:relative; z-index:2; min-width:0; }
.room-scroll-copy h1 { font-size:clamp(46px,5.7vw,82px); }
.room-scroll-copy #room-scroll-title,.room-scroll-copy #homepage-title { white-space:pre-line; min-height:3.3em; translate:none !important; }
.room-scroll-copy .launch-lead { min-height:7.5em; }
.room-scroll-copy .launch-lead { font-size:clamp(17px,1.5vw,21px); max-width:430px; }
.room-scroll-copy .launch-actions { gap:20px; }
.room-scroll-visual { margin:0; position:relative; width:100%; }
.room-scroll-picture { aspect-ratio:1; width:100%; position:relative; }
.room-scroll-picture img,.room-scroll-picture canvas { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; }
.room-scroll-picture canvas { visibility:hidden; }
.room-scroll-ready .room-scroll-picture canvas { visibility:visible; }
.room-scroll-ready .room-scroll-picture img { visibility:hidden; }
.room-scroll-visual figcaption { text-align:center; font-size:11px; color:#5C5C58; line-height:1.5; padding:0 12px; }
.room-scroll-controls { display:flex; align-items:center; flex-wrap:wrap; gap:20px; font-size:12px; margin-top:28px; }
.room-scroll-controls a,.room-scroll-controls button { color:#5C5C58; text-decoration:underline; text-underline-offset:4px; }
.room-scroll-controls button { appearance:none; border:0; background:none; font:inherit; cursor:pointer; padding:8px 0; }
.room-scroll-controls [hidden] { display:none; }
.room-scroll-track { position:absolute; bottom:18px; left:5%; right:5%; display:flex; gap:18px; align-items:center; border-top:1px solid #E1DDD5; padding-top:18px; color:#5C5C58; font-size:12px; }
.room-scroll-track::before { content:''; position:absolute; top:-1px; left:0; right:0; height:2px; background:#8E9775; transform:scaleX(var(--room-progress)); transform-origin:left; }
.room-scroll-track [data-room-beat] { color:#1A1714; font-variant-numeric:tabular-nums; }
.room-scroll-track .room-scroll-hint { margin-left:auto; text-transform:uppercase; letter-spacing:.1em; font-size:10px; }
.room-scroll:not(.room-scroll-enabled) .room-scroll-track { display:none; }
.room-overview { scroll-margin-top:95px; max-width:1440px; margin:0 auto; padding:60px 6%; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:8%; border-top:1px solid #E1DDD5; }
.room-overview h2 { margin-bottom:24px; }
.room-overview > div > p { max-width:420px; }
@media(min-width:801px) and (max-height:740px) {
 .room-scroll-stage { min-height:0; padding-block:20px 50px; }
 .room-scroll-copy h1 { font-size:clamp(42px,4.5vw,64px); margin-bottom:18px; }
 .room-scroll-visual { max-width:calc(100svh - 145px); justify-self:center; }
 .room-scroll-controls { margin-top:8px; }
 .room-scroll-copy .launch-actions { margin:18px 0; }
}
@media(max-width:800px) {
 .room-scroll-enabled { height:170svh; }
 .room-scroll-stage { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); height:calc(100svh - 74px); min-height:610px; padding:22px 6% 54px; gap:0; }
 .room-scroll-enabled .room-scroll-stage { top:74px; }
 .room-scroll-copy h1 { font-size:clamp(38px,7.4vw,55px); margin-bottom:12px; }
 .room-scroll-copy .launch-kicker { margin-bottom:10px; font-size:10px; }
 .room-scroll-copy .launch-lead { font-size:15px; line-height:1.5; margin-bottom:0; max-width:100%; }
 .room-scroll-copy .launch-actions { margin:14px 0 0; gap:16px; font-size:12px; }
 .room-scroll-copy .launch-actions .btn { padding:12px 18px; min-height:44px; }
 .room-scroll-controls { margin-top:4px; font-size:11px; gap:16px; }
 .room-scroll-visual { height:100%; min-height:0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
 .room-scroll-picture { height:calc(100% - 24px); width:auto; max-width:100%; }
 .room-scroll-visual figcaption { font-size:10px; }
 .room-scroll-track { left:6%; right:6%; bottom:12px; padding-top:12px; gap:12px; font-size:11px; }
 .room-scroll-track .room-scroll-hint { display:none; }
 .room-overview { grid-template-columns:1fr; gap:28px; padding-block:40px; }
}
/* Small/zoomed viewports should never pin a stage taller than the screen. */
@media(prefers-reduced-motion:reduce) {
 .room-scroll .room-scroll-picture canvas { display:none; }
 .room-scroll .room-scroll-picture img { visibility:visible; }
}

/* Give the concept more room while retaining the left-hand introduction. */
@media(min-width:801px) {
 .room-scroll-stage { grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr); max-width:1440px; gap:4%; padding-inline:5%; }
 .room-scroll-visual { width:100%; max-width:560px; justify-self:center; }
 .room-scroll-copy h1 { font-size:clamp(42px,4.5vw,64px); }
}
@media(min-width:801px) and (min-height:691px) and (max-height:740px) {
 .room-scroll-visual { max-width:calc(100svh - 145px); }
}

/* Scroll-synchronised concept images; copy stays on the left. */
.room-scroll-loop { background:#ece7dc; }
.room-scroll-loop .room-scroll-stage { max-width:none; isolation:isolate; overflow:hidden; }
.room-scroll-loop .room-scroll-visual { position:absolute; inset:0; width:100%; height:100%; max-width:none; z-index:-2; }
.room-scroll-loop .room-scroll-picture { width:100%; height:100%; aspect-ratio:auto; }
.room-scroll-loop .room-scroll-picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.room-scroll-loop [data-homepage-scene] { opacity:0; will-change:transform,opacity; }
.room-scroll-loop [data-homepage-scene="0"] { opacity:1; }
.room-scroll-loop .room-scroll-stage::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(247,243,235,.98) 0%,rgba(247,243,235,.95) 28%,rgba(247,243,235,.82) 43%,rgba(247,243,235,.12) 68%,transparent 100%); pointer-events:none; }
.room-scroll-loop .room-scroll-copy { max-width:540px; }
.room-scroll-loop .room-scroll-visual figcaption { position:absolute; right:110px; bottom:76px; background:rgba(20,25,21,.75); padding:5px 10px; border-radius:3px; color:#fff; }
.room-scroll-loop .room-scroll-track { background:rgba(247,243,235,.92); padding:14px 16px 10px; }
@media(max-width:800px) {
 .room-scroll-loop .room-scroll-stage { display:flex; align-items:flex-start; padding-top:32px; }
 .room-scroll-loop .room-scroll-stage::before { background:linear-gradient(180deg,rgba(247,243,235,.97) 0%,rgba(247,243,235,.92) 48%,rgba(247,243,235,.15) 80%); }
 .room-scroll-loop .room-scroll-copy { max-width:100%; }
 .room-scroll-loop .room-scroll-visual figcaption { left:16px; right:auto; bottom:94px; font-size:10px; }
 .room-scroll-loop .room-scroll-copy #homepage-title { min-height:2.4em; }
}
.room-scroll-loop:not(.room-scroll-enabled) .room-scroll-stage { min-height:590px; }
.room-scroll-loop:not(.room-scroll-enabled) .room-scroll-visual figcaption { bottom:15px; }

.room-scroll-build { border-top:1px solid #e1ddd5; }
.room-scroll-build .room-scroll-copy h2 { font-size:clamp(38px,4.5vw,64px); line-height:1.1; letter-spacing:-.045em; }
@media(max-width:800px) { .room-scroll-build .room-scroll-copy h2 { font-size:clamp(34px,7.4vw,55px); margin-bottom:12px; } }

/* Stable small-viewport geometry avoids toolbar-triggered resets on phones. */
[data-room-viewport] { position:absolute; width:0; height:100svh; visibility:hidden; pointer-events:none; }
.room-scroll { overflow-anchor:none; }
.room-scroll.room-scroll-enabled { height:210svh; }
.room-scroll:not(.room-scroll-enabled) { height:auto; }
.room-scroll:not(.room-scroll-enabled) .room-scroll-stage { position:relative; top:auto; height:auto; min-height:0; padding-block:35px; }
.room-scroll-build:not(.room-scroll-enabled) .room-scroll-picture { height:auto; width:100%; }
.room-scroll-build:not(.room-scroll-enabled) .room-scroll-visual { height:auto; }
.room-scroll:not(.room-scroll-enabled) .room-scroll-track { display:none; }
.room-scroll-loop:not(.room-scroll-enabled) .room-scroll-stage { min-height:590px; }