/* A window opens into the room. Copy stays on the paper rails. */
.room-story{--room-progress:1;height:auto}
.room-stage{position:relative;height:100svh;min-height:470px;grid-template-rows:120px minmax(0,1fr) 90px;background:var(--cream)}
.room-label{padding-bottom:18px;align-items:end}
.room-picture{overflow-anchor:none;place-self:center;width:100%;height:100%;clip-path:none;border-radius:0;overflow:hidden;margin:0;min-width:0;min-height:0}
.room-picture img{transform:none;object-position:55% 48%}
.room-sill{gap:30px;position:relative;background:var(--cream)}
.room-caption{display:flex;gap:20px;align-items:center;text-transform:none;letter-spacing:0;font:600 clamp(16px,1.65vw,26px)/1.1 var(--display)}
.room-track{height:1px;width:80px;flex-shrink:0;background:var(--line);overflow:visible;position:relative;margin-left:auto}
.room-track i{display:block;width:100%;height:1px;background:var(--green);transform-origin:left}
.room-track i::after{content:'';position:absolute;right:0;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--green)}
.motion-layout .room-story{height:220svh}
.scroll-ready .room-story{--room-progress:0}
.motion-layout .room-stage{position:sticky;top:0;min-height:0;height:100svh}
.scroll-ready .room-picture{--window-start:min(31vw,42svh);width:calc(var(--window-start) + (100% - var(--window-start)) * var(--room-progress));height:calc(66% + 34% * var(--room-progress));border-radius:calc(50% * (1 - var(--room-progress))) calc(50% * (1 - var(--room-progress))) 0 0 / calc(36% * (1 - var(--room-progress))) calc(36% * (1 - var(--room-progress))) 0 0}
.scroll-ready .room-track i{transform:scaleX(max(.025,var(--room-progress)))}
.scroll-ready [data-room-beat]{opacity:.32;transition:none}
.scroll-ready [data-room-beat="0"]{opacity:calc(.32 + .68 * clamp(0,1 - var(--room-progress) * 3,1))}
.scroll-ready [data-room-beat="1"]{opacity:calc(.32 + .68 * clamp(0,1 - (var(--room-progress) - .5) * (var(--room-progress) - .5) * 16,1))}
.scroll-ready [data-room-beat="2"]{opacity:calc(.32 + .68 * clamp(0,(var(--room-progress) - .66) * 3,1))}

/* Typesetting follows the scroll: offset lines settle and their ink fills. */
[data-scroll-scene]{--scene-progress:1;--story-ink:var(--ink)}
.story-line{--line-progress:1;display:block;position:relative;width:fit-content;max-width:100%}
.story-ink{display:inline;color:inherit}
.dining-block,.programme-card,.private-callout,.private-menu{--story-ink:var(--cream)}
.private-card{--story-ink:var(--terra)}
.scroll-ready .story-line{transform:translate3d(calc((1 - var(--line-progress)) * -28px),calc((1 - var(--line-progress)) * 12px),0)}
.scroll-ready .story-line:nth-child(even){transform:translate3d(calc((1 - var(--line-progress)) * 28px),calc((1 - var(--line-progress)) * 12px),0)}
@supports (background-clip:text){
 .scroll-ready .story-ink{background:linear-gradient(90deg,var(--story-ink) 0%,var(--story-ink) calc(var(--line-progress) * 100%),transparent calc(var(--line-progress) * 100%));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:.65px var(--story-ink)}
}
.dining-block{display:block;min-height:0}
.dining-stage{display:grid;grid-template-columns:1fr 1fr;min-height:90svh;background:var(--terra)}
.dining-copy{position:relative;overflow:hidden}
.dining-copy::after{content:'';height:1px;position:absolute;left:clamp(40px,6vw,100px);right:clamp(40px,6vw,100px);bottom:28px;background:currentColor;transform-origin:left;transform:scaleX(var(--scene-progress))}
.bar-copy,.notes-heading,.evening-card,.inner-page [data-scroll-title]{overflow:clip;overflow-clip-margin:35px}
.scroll-ready .bar-detail>span:first-child{display:block;transform:rotate(calc(-35deg + var(--scene-progress) * 70deg))}
.scroll-ready .bar-aperture{border-radius:50% 50% 0 0 / calc(44% - var(--scene-progress) * 13%) calc(44% - var(--scene-progress) * 13%) 0 0}
.scroll-ready .card-bottom{position:relative;border-top-color:transparent}
.scroll-ready .card-bottom::before{content:'';height:1px;position:absolute;left:0;right:0;top:0;background:currentColor;transform:scaleX(var(--scene-progress));transform-origin:left}
.notes-heading::after{content:'';display:block;margin-top:32px;height:1px;background:var(--ink);transform:scaleX(var(--scene-progress));transform-origin:left}
@media(min-width:900px) and (prefers-reduced-motion:no-preference){
 .motion-layout .dining-block{height:185svh}
 .motion-layout .dining-stage{position:sticky;top:0;height:100svh;min-height:0}
 .motion-layout .dining-photo{min-height:0;height:100%;overflow:hidden}
 .motion-layout .dining-copy{padding-top:125px;padding-bottom:50px;gap:30px}
 .motion-layout .dining-copy h2{font-size:clamp(52px,min(5.6vw,11svh),90px)}
 .motion-layout .dining-photo img{max-height:none}
}
@media(max-width:899px){
 .motion-layout .room-story{height:160svh}
 .room-stage{grid-template-rows:115px minmax(0,1fr) 80px}
 .scroll-ready .room-picture{--window-start:45vw;height:calc(64% + 36% * var(--room-progress))}
 .room-caption{gap:15px;font-size:18px}
 .room-track{width:45px}
 .room-sill{gap:20px}
 .dining-stage{min-height:0}
 .dining-copy::after{left:40px;right:40px;bottom:22px}
}
@media(max-width:600px){
 .room-stage{grid-template-rows:100px minmax(0,1fr) 96px}
 .scroll-ready .room-picture{--window-start:48vw;height:calc(44% + 56% * var(--room-progress))}
 .room-sill{display:grid;grid-template-columns:1fr auto;gap:8px 20px;padding-block:18px;font-size:8px}
 .room-caption{grid-column:1/-1;justify-content:space-between;gap:12px;font-size:18px}
 .room-track{grid-row:2;grid-column:2;width:55px}
 .room-sill>span:last-child{grid-row:2;grid-column:1}
 .dining-stage{display:flex;flex-direction:column}
 .dining-copy{padding-bottom:50px}
 .dining-copy::after{left:24px;right:24px;bottom:24px}
 .scroll-ready .story-line{transform:translate3d(calc((1 - var(--line-progress)) * -16px),calc((1 - var(--line-progress)) * 8px),0)}
 .scroll-ready .story-line:nth-child(even){transform:translate3d(calc((1 - var(--line-progress)) * 16px),calc((1 - var(--line-progress)) * 8px),0)}
}
@media(max-height:540px) and (min-width:900px){
 .room-stage{grid-template-rows:110px minmax(0,1fr) 60px}
 .motion-layout .dining-copy{padding-top:110px;padding-bottom:36px;gap:12px}
 .motion-layout .dining-copy h2{font-size:10svh}
 .block-bottom>p{font-size:16px}
 .motion-layout .dining-copy::after{bottom:18px}
}
@media(prefers-reduced-motion:reduce){
 .room-story,.motion-layout .room-story,.motion-layout .dining-block{height:auto}
 .room-stage,.motion-layout .room-stage{position:relative;min-height:470px}
 .room-picture,.scroll-ready .room-picture{width:100%;height:100%;border-radius:0}
 .story-line,.scroll-ready .story-line,.scroll-ready .story-line:nth-child(even){transform:none}
 .story-ink,.scroll-ready .story-ink{background:none;-webkit-text-fill-color:currentColor;-webkit-text-stroke:0}
 .scroll-ready [data-room-beat]{opacity:1}
}

/* A compact, stable opening and comfortable touch targets on phones. */
@media(max-width:600px){
 html{scroll-behavior:auto;scroll-padding-top:96px}
 .site-header,.site-header.scrolled,.inner-page .site-header{top:max(12px,env(safe-area-inset-top));height:64px}
 .header-book,.nav-toggle,.brand{min-height:44px}
 .salon-hero{padding-top:106px}
 .salon-composition{gap:24px}
 .salon-copy>.eyebrow{margin-bottom:22px}
 .salon-copy h1{min-height:2.08em}
 .salon-bottom{margin-top:18px}
 .salon-aperture{height:clamp(220px,43svh,390px)}
 .salon-sill{margin-top:22px;padding-block:12px}
 .salon-sill>a{min-height:44px}
 .salon-window figcaption{line-height:1.4;min-height:30px}
 .gallery{gap:16px;scroll-snap-type:x proximity}
 .form-grid input,.form-grid select,.form-grid textarea{font-size:16px}
 .ink-link,.text-link,.pill-link{min-height:44px}
}
@media(max-width:600px) and (max-height:650px){
 .salon-copy h1{font-size:clamp(37px,11vw,48px)}
 .salon-copy>.eyebrow{margin-bottom:17px}
 .salon-composition{gap:18px}
 .salon-bottom{margin-top:12px}
}