/* Native sticky backgrounds stay synchronized with compositor scrolling. */
.opening-scene.parallax-ready { overflow:clip; }
.parallax-window { position:absolute; inset:0; overflow:clip; z-index:-2; }
.parallax-backdrop { position:sticky; top:0; height:0; width:100%; }
.opening-scene .parallax-backdrop .opening-photo,
.detail-hero .parallax-backdrop .detail-hero-photo {
 position:absolute; inset:0 auto auto 0; width:100%; height:var(--photo-height); margin:0;
}
.parallax-backdrop img { width:100%; height:100%; }
.arrow-icon { display:block; width:24px; height:24px; flex:none; overflow:visible; }
.arrow-icon path { stroke:currentColor; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }
.circle-arrow,.journal-link i,.site-footer .back-top {
 padding:0; line-height:1; letter-spacing:0; flex-shrink:0; place-items:center;
}
.site-footer .back-top { width:48px; height:48px; display:grid; }
.site-footer .back-top .arrow-icon { transform:rotate(-90deg); }
.journal-link i .arrow-icon { width:20px; height:20px; }
/* The heading occupies a margin beside the list, rather than an empty full-width row. */
.page-town .walk-list { display:grid; grid-template-columns:180px minmax(0,1fr); gap:9%; padding-block:80px; align-items:start; }
.page-town .walk-list .section-heading { display:block; margin:0; padding:0; }
.page-town .walk-list h2.vertical-heading { font-size:36px; margin:0 auto 28px; gap:20px; }
.page-town .walk-list .section-heading>p { margin:0; font-size:14px; line-height:2; text-align:center; }
.walk-stops { min-width:0; }
.page-town .walk-list article { grid-template-columns:28px minmax(0,1fr) 140px; gap:24px; padding:34px 0; }
.page-town .walk-list article:first-child { padding-top:0; border-top:0; }
.page-town .walk-list .walk-illustration { width:100%; max-width:160px; }
/* Supplied photographs carry the final invitation into the footer. */
.site-wrap .photo-cta {
 position:relative; isolation:isolate; color:#fff; background:#1e2830;
 border:0; margin:0; padding:65px 9%; min-height:410px;
}
.photo-cta>.cta-photo { position:absolute; inset:0; z-index:-2; margin:0; overflow:hidden; }
.photo-cta>.cta-photo img { width:100%; height:100%; object-fit:cover; object-position:center; }
.photo-cta::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#101a23b8,#101a2380); border:0; border-radius:0; width:auto; height:auto; transform:none; pointer-events:none; }
.photo-cta::after { display:none; }
.photo-cta h2.vertical-heading { color:#fff; margin:0; text-shadow:0 2px 16px #101a2340; }
.photo-cta .button-primary,.photo-cta .circle-arrow { background:#fff; border-color:#fff; color:#1e2830; }
.photo-cta .button-primary:hover,.photo-cta a:hover .circle-arrow { background:#e8edef; }
.photo-cta .text-link { color:#fff; border-color:#ffffff80; }
.photo-cta .text-link:hover { color:#fff; border-color:#fff; }
.photo-cta a:focus-visible { outline-color:#fff; }
.site-wrap .next-chapter.photo-cta { display:grid; align-items:center; }
.next-chapter.photo-cta>a { width:100%; justify-content:space-between; }
.page-town .quiet-night.photo-cta { display:grid; grid-template-columns:auto minmax(0,1fr); gap:25px 12%; align-items:center; text-align:left; }
.page-town .quiet-night.photo-cta h2 { grid-column:1; grid-row:1/3; }
.page-town .quiet-night.photo-cta>p { grid-column:2; align-self:end; margin:0; font-size:16px; }
.page-town .quiet-night.photo-cta>.text-link { grid-column:2; align-self:start; justify-self:start; margin:0; }
.photo-cta.reservation-check .section-copy { align-self:center; }
@media(min-width:721px) and (max-width:1100px) {
 .page-town .walk-list { grid-template-columns:110px minmax(0,1fr); gap:6%; }
 .page-town .walk-list h2.vertical-heading { font-size:30px; gap:16px; }
 .page-town .walk-list article { grid-template-columns:22px minmax(0,1fr); gap:16px; }
 .page-town .walk-list .walk-illustration { grid-column:2; justify-self:end; width:130px; margin-top:-10px; }
}
@media(max-width:720px) {
 .page-town .walk-list { display:block; padding:48px 26px; }
 .page-town .walk-list .section-heading { display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:center; gap:20px; margin-bottom:38px; }
 .page-town .walk-list h2.vertical-heading { font-size:29px; gap:16px; margin:0; }
 .page-town .walk-list .section-heading>p { max-width:9em; text-align:left; }
 .page-town .walk-list article { grid-template-columns:22px minmax(0,1fr); gap:12px 16px; padding:28px 0; }
 .page-town .walk-list .walk-illustration { grid-column:2; justify-self:end; width:140px; }
 .site-wrap .photo-cta { padding:45px 26px; min-height:380px; }
 .site-wrap .reserve-banner.photo-cta { display:flex; flex-direction:column; align-items:stretch; gap:34px; }
 .reserve-banner.photo-cta>div { min-width:0; }
 .reserve-banner.photo-cta h2 { margin:0 auto; }
 .photo-cta .button-primary { min-height:64px; }
 .page-town .quiet-night.photo-cta { display:block; text-align:center; }
 .page-town .quiet-night.photo-cta h2 { margin:0 auto 28px; }
 .page-town .quiet-night.photo-cta>.text-link { margin-top:22px; }
 .photo-cta.reservation-check h2 { margin:0 0 30px auto; }
}
@media(prefers-reduced-motion:reduce) {
 .parallax-backdrop { position:relative; }
}

/* Layout audit: keep the enquiry copy and its action together beside the title. */
.page-reserve .reservation-layout {
 display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
 gap:56px 7%; align-items:start; padding-top:76px; padding-bottom:80px;
}
.page-reserve .reservation-content {
 display:grid; grid-template-columns:max-content minmax(0,1fr);
 gap:24px 28px; align-content:start; min-width:0;
}
.page-reserve .reservation-content>h2.vertical-heading {
 grid-column:1; grid-row:1/4; margin:0; font-size:30px; gap:16px;
}
.page-reserve .reservation-content>p:not(.fine-print) { grid-column:2; grid-row:1; margin:0; }
.page-reserve .reservation-content>.button-primary {
 grid-column:2; grid-row:2; margin:0; padding:18px 22px; min-height:72px; gap:16px; font-size:15px;
}
.page-reserve .reservation-content>.reservation-phone {
 grid-column:2; grid-row:3; margin:0; padding-top:24px; min-width:0;
}
.page-reserve .reservation-phone>a { font-size:clamp(23px,2vw,30px); letter-spacing:.025em; white-space:nowrap; margin:0 0 16px; }
.page-reserve .reservation-phone .fine-print { margin:0; }
.page-reserve .reservation-at-a-glance { min-width:0; grid-template-columns:max-content minmax(0,1fr); gap:24px; padding:28px; }
.page-reserve .reservation-at-a-glance .data-list { margin:0; }
.page-reserve .reservation-at-a-glance .data-list>div { gap:6px; }
.page-reserve .reservation-at-a-glance .story-link { display:flex; justify-content:space-between; align-items:center; gap:16px; line-height:1.8; }
/* Each destination gets a full, separately readable link row. */
.page-reserve .reservation-check { grid-template-columns:max-content minmax(0,1fr); column-gap:12%; }
.page-reserve .reservation-check>h2.vertical-heading { grid-column:1; grid-row:1; margin:0; }
.page-reserve .reservation-check>.section-copy { grid-column:2; grid-row:1; display:grid; width:100%; max-width:520px; justify-self:end; }
.page-reserve .reservation-check .text-link { display:flex; width:100%; margin:0; min-height:76px; padding:20px 0; font-size:16px; gap:24px; }
.page-reserve .reservation-check .text-link>span { flex-shrink:0; }
/* Reserve the actual width of all three vertical title columns. */
.page-stay .breakfast-story { grid-template-columns:max-content minmax(0,1fr); }
@media(min-width:721px) and (max-width:1100px) {
 .page-reserve .reservation-layout { grid-template-columns:minmax(0,1fr); row-gap:48px; padding-top:60px; }
 .page-reserve .reservation-content { grid-template-columns:120px minmax(0,1fr); column-gap:32px; }
 .page-reserve .reservation-at-a-glance { grid-template-columns:120px minmax(0,1fr); gap:32px; }
 .page-reserve .reservation-at-a-glance .data-list>div { grid-template-columns:8em minmax(0,1fr); gap:16px; }
 .page-stay .editorial-row,.page-stay .editorial-row.reversed { grid-template-columns:minmax(0,1fr) 130px; gap:28px 7%; padding:65px 0; }
 .page-stay .editorial-row>figure { grid-column:1; grid-row:1; }
 .page-stay .editorial-row>h2 { grid-column:2; grid-row:1; font-size:32px; gap:16px; }
 .page-stay .editorial-row>.section-copy,.page-stay .editorial-row.reversed>.section-copy { grid-column:1/-1; grid-row:2; max-width:38em; }
 .page-stay .editorial-row.reversed { grid-template-columns:130px minmax(0,1fr); }
 .page-stay .editorial-row.reversed>figure { grid-column:2; grid-row:1; }
 .page-stay .editorial-row.reversed>h2 { grid-column:1; grid-row:1; }
 .page-stay .editorial-row#rooms figure img,.page-stay .editorial-row#dining figure img,.page-stay .editorial-row#lounge figure img { aspect-ratio:1; }
 .page-stay .breakfast-story>h2.vertical-heading { font-size:30px; gap:14px; }
}
@media(max-width:720px) {
 .page-reserve .reservation-layout { grid-template-columns:minmax(0,1fr); padding:44px 26px 56px; row-gap:40px; }
 .page-reserve .reservation-content { grid-template-columns:max-content minmax(0,1fr); gap:24px 20px; }
 .page-reserve .reservation-content>h2.vertical-heading { grid-column:1; grid-row:1; font-size:25px; gap:14px; margin:0; }
 .page-reserve .reservation-content>p:not(.fine-print) { grid-column:2; grid-row:1; }
 .page-reserve .reservation-content>.button-primary { grid-column:1/-1; grid-row:2; font-size:16px; min-height:68px; }
 .page-reserve .reservation-content>.reservation-phone { grid-column:1/-1; grid-row:3; }
 .page-reserve .reservation-phone>a { font-size:29px; }
 .page-reserve .reservation-at-a-glance { display:block; padding:26px 22px; }
 .page-reserve .reservation-at-a-glance h2.vertical-heading { margin:0 0 28px auto; font-size:25px; }
 .page-reserve .reservation-at-a-glance .data-list>div { grid-template-columns:7em minmax(0,1fr); gap:12px; }
 .page-reserve .reservation-at-a-glance .data-list dt { font-size:12px; }
 .page-reserve .reservation-at-a-glance .data-list dd { font-size:15px; }
 .page-reserve .reservation-check { display:grid; grid-template-columns:minmax(0,1fr); gap:30px; }
 .page-reserve .reservation-check>h2.vertical-heading { grid-column:1; grid-row:1; margin-left:auto; }
 .page-reserve .reservation-check>.section-copy { grid-column:1; grid-row:2; max-width:none; }
 .page-reserve .reservation-check .text-link { font-size:15px; min-height:68px; padding:17px 0; }
}
@media(max-width:360px) {
 .page-reserve .reservation-content { column-gap:16px; }
 .page-reserve .reservation-content>h2.vertical-heading { font-size:23px; gap:12px; }
 .page-reserve .reservation-at-a-glance .data-list>div { grid-template-columns:1fr; gap:5px; }
}

/* These practical headings read horizontally above their content. */
.page-reserve .reservation-content,
.page-reserve .reservation-at-a-glance {
 display:flex; flex-direction:column; align-items:stretch; gap:24px;
}
.page-reserve .reservation-layout .reservation-heading {
 margin:0; font-size:clamp(23px,2.1vw,30px); line-height:1.6;
 letter-spacing:.045em; writing-mode:horizontal-tb;
}
.page-reserve .reservation-at-a-glance .reservation-heading { font-size:26px; }
.page-reserve .reservation-content>.button-primary { width:100%; }
@media(max-width:720px) {
 .page-reserve .reservation-at-a-glance .reservation-heading { font-size:23px; }
}

/* Room story: one compact text column and one aligned photograph column. */
.page-index .folio-room {
 grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);
 gap:clamp(32px,5vw,80px); margin:0 var(--gutter) 100px; align-items:start;
}
.page-index .folio-room .room-intro { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:32px 28px; align-items:start; padding:0; }
.page-index .folio-room .journal-label { grid-column:1/-1; grid-row:1; width:auto; gap:18px; flex-wrap:wrap; }
.page-index .folio-room .journal-label small { display:block; margin:0; }
.page-index .folio-room .room-intro h2 {
 grid-column:1; grid-row:2; margin:0!important; font-size:clamp(32px,2.8vw,42px)!important; gap:20px!important;
}
.page-index .folio-room .journal-copy { grid-column:2; grid-row:2; width:100%; max-width:26em; }
.page-index .folio-room .journal-copy p { line-height:2.1; }
.page-index .folio-room .journal-copy br { display:none; }
.page-index .folio-room .journal-link { margin-top:20px; }
.page-index .folio-room .room-view { padding:0; }
.page-index .folio-room .room-view .journal-image img { aspect-ratio:3/2; max-height:600px; object-position:55% center; }
.page-index .folio-room .room-view .journal-image figcaption { padding-right:180px; margin-top:12px; }
.page-index .folio-room .room-view .illustration-tea-rest { --illustration-size:180px; --illustration-right:12px; --illustration-bottom:-28px; }
.page-index .folio-room .room-view-controls { margin:30px 0 0; gap:28px; }
.page-index .folio-room .room-facts { margin:18px 0 0; gap:20px; flex-wrap:wrap; }
@media(min-width:721px) and (max-width:1100px) {
 .page-index .folio-room { grid-template-columns:minmax(0,1fr); gap:36px; }
 .page-index .folio-room .room-intro h2 { font-size:32px!important; gap:16px!important; }
 .page-index .folio-room .journal-label small { display:none; }
 .page-index .folio-room .room-view .journal-image img { aspect-ratio:3/2; }
 .page-index .folio-room .room-view .illustration-tea-rest { --illustration-size:145px; --illustration-bottom:-24px; }
 .page-index .folio-room .room-view .journal-image figcaption { padding-right:125px; }
 .page-index .folio-room .room-view-controls { gap:18px; flex-wrap:wrap; }
}
@media(max-width:720px) {
 .page-index .folio-room { display:grid; grid-template-columns:minmax(0,1fr); gap:30px; margin:0 26px 65px; }
 .page-index .folio-room .room-intro { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:24px; }
 .page-index .folio-room .journal-label { grid-column:1/-1; grid-row:1; }
 .page-index .folio-room .room-intro h2 { grid-column:1; grid-row:2; margin:0!important; font-size:28px!important; gap:14px!important; }
 .page-index .folio-room .journal-copy { grid-column:2; grid-row:2; align-self:start; }
 .page-index .folio-room .journal-link { font-size:12px; gap:12px; }
 .page-index .folio-room .room-view .journal-image img { aspect-ratio:4/3; }
 .page-index .folio-room .room-view .illustration-tea-rest { --illustration-size:140px; --illustration-right:8px; --illustration-bottom:-24px; }
 .page-index .folio-room .room-view .journal-image figcaption { padding-right:0; margin-top:36px; }
 .page-index .folio-room .room-view-controls { margin-top:12px; gap:20px; }
 .page-index .folio-room .room-facts { gap:12px; font-size:11px; }
}
@media(max-width:360px) {
 .page-index .folio-room .room-intro { gap:22px 18px; }
 .page-index .folio-room .room-intro h2 { font-size:25px!important; gap:12px!important; }
 .page-index .folio-room .journal-link { font-size:11px; gap:8px; }
}

/* Keep complete photo blocks readable within a viewport; first views remain immersive.
   svh avoids resizing photographs as mobile browser chrome opens and closes. */
:root { --content-photo-limit:80vh; }
@supports (height:80svh) { :root { --content-photo-limit:80svh; } }
main img:not(.opening-scene img, .detail-hero img, .story-illustration) {
 max-height:var(--content-photo-limit)!important;
 min-height:0!important;
 object-fit:cover;
}
.gallery-viewport { max-height:var(--content-photo-limit); }
.folio-welcome .welcome-photo { align-self:start; }
.folio-welcome .welcome-photo img { height:auto; aspect-ratio:4/5; }
.town-scene>.journal-image { max-height:var(--content-photo-limit); }
.photo-cta>.cta-photo { max-height:var(--content-photo-limit); }
.page-shooting .shot img { object-fit:contain; }
/* Photo-backed chapters shrink with the frame, without leaving an empty white panel. */
.town-scene { min-height:min(710px,var(--content-photo-limit)); background:#1e2830; }
.site-wrap .photo-cta { min-height:min(410px,var(--content-photo-limit)); }
@media(max-height:700px) {
 .town-title { padding:24px var(--gutter); }
 .town-title .journal-label { margin-bottom:16px; }
 .town-title h2.vertical-heading { font-size:clamp(18px,5svh,34px)!important; margin-top:0; margin-bottom:0; }
}
@media(max-height:500px) {
 .site-wrap .photo-cta { padding:24px 7%; }
 .site-wrap .photo-cta h2.vertical-heading { font-size:22px; }
}

/* A softly uneven clay circle behind the opening character of section titles. */
main h2.vertical-heading>span:first-child,
main h2.reservation-heading {
 position:relative;
 isolation:isolate;
 --heading-circle:#eddbd0;
}
main h2.vertical-heading>span:first-child::before,
main h2.reservation-heading::before {
 content:"";
 position:absolute;
 z-index:-1;
 width:2em;
 height:1.9em;
 top:-.34em;
 right:-.34em;
 border-radius:46% 54% 58% 42% / 55% 44% 56% 45%;
 background:var(--heading-circle);
 transform:rotate(-13deg);
 pointer-events:none;
}
main h2.reservation-heading::before { left:-.48em; right:auto; top:-.16em; }
main :is(.folio-air,.sky-story,.town-scene,.photo-cta) h2.vertical-heading>span:first-child {
 --heading-circle:#795d50;
}

/* Let the vertical story titles lead without a second line of small labels. */
.page-index .folio-source .source-image { grid-row:1/3; }
.page-index .folio-source>h2 { grid-row:1; }
.page-index .folio-source .source-copy { grid-row:2; }
.page-index .folio-table>h2 { grid-row:1; }
.page-index .folio-table .table-main { grid-row:1/3; }
.page-index .folio-table .table-detail { grid-row:2/4; }
.page-index .folio-table .table-copy { grid-row:3; }
.page-index .folio-room .room-intro h2,
.page-index .folio-room .journal-copy { grid-row:1; }
.site-wrap main :is(.journal-section,.editorial-row,.split-copy,.bath-detail,.sky-story,.breakfast-story) h2.vertical-heading {
 font-size:clamp(38px,3.5vw,50px)!important;
}
.page-index .folio-room .room-intro h2 { font-size:clamp(36px,3.2vw,46px)!important; }
.page-index .welcome-panel h2 { font-size:40px!important; }
.page-index .morning-reading h2 { margin-top:0!important; }
@media(min-width:721px) and (max-width:1100px) {
 .site-wrap main :is(.journal-section,.editorial-row,.split-copy,.bath-detail,.sky-story,.breakfast-story) h2.vertical-heading { font-size:38px!important; }
 .page-index .welcome-panel h2 { font-size:34px!important; }
}
@media(max-width:720px) {
 .site-wrap main :is(.journal-section,.editorial-row,.split-copy,.bath-detail,.sky-story,.breakfast-story) h2.vertical-heading { font-size:33px!important; }
 .page-index .folio-source .source-image { grid-row:1; }
 .page-index .folio-table .table-copy { grid-row:4; }
 .page-index .folio-air>figure,.page-index .air-reading h2 { grid-row:1; }
 .page-index .air-reading .journal-copy { grid-row:2; }
 .page-index .folio-welcome .welcome-photo,.page-index .welcome-panel h2 { grid-row:1; }
 .page-index .welcome-panel .journal-book { grid-row:2; }
 .page-index .folio-room .room-intro { column-gap:24px; }
 .page-index .folio-room .room-intro h2 { font-size:32px!important; }
}
@media(max-width:360px) {
 .site-wrap main :is(.journal-section,.editorial-row,.split-copy,.bath-detail,.sky-story,.breakfast-story) h2.vertical-heading { font-size:29px!important; }
 .page-index .folio-room .room-intro h2 { font-size:28px!important; }
}
@media(max-height:700px) {
 .site-wrap main .town-title h2.vertical-heading { font-size:clamp(20px,5.5svh,38px)!important; }
}
