/* Inter: latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(assets/fonts/inter-latin-ext-a28eb6d3.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Inter: latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(assets/fonts/inter-latin-c9407645.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Josefin Sans: latin-ext */
@font-face {
  font-family: 'Josefin Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(assets/fonts/josefin-sans-latin-ext-31ba5e65.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Josefin Sans: latin */
@font-face {
  font-family: 'Josefin Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(assets/fonts/josefin-sans-latin-1190b4f5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Marcellus: latin-ext */
@font-face {
  font-family: 'Marcellus';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/marcellus-latin-ext-75505cec.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Marcellus: latin */
@font-face {
  font-family: 'Marcellus';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/marcellus-latin-be9d4883.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: dark;
  --bg: #242424;
  --deep: #1b1b1b;
  --surface: #303030;
  --ink: #f4efe3;
  --muted: #c6c3bd;
  --gold: #c7aa70;
  --line: rgba(199,170,112,.25);
  --body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --serif: "Marcellus", Georgia, "Times New Roman", serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body {
  margin: 0; background-color: var(--bg); color: var(--ink); font: 15px/1.5 var(--body);
}
body.viewer-open { overflow: hidden; }
button, input, select, textarea { font: inherit; }
button, a, summary, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, summary, a { touch-action: manipulation; }
button { cursor: pointer; color: inherit; }
a { color: var(--gold); text-underline-offset: 4px; }
button:disabled { cursor: default; opacity: .45; }
a:hover, summary:hover { color: var(--ink); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
button { border: 0; background: transparent; padding: 0; }
[hidden] { display: none !important; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.16; }
h1 { font-size: clamp(25px, 6.7vw, 34px); letter-spacing: -.025em; }
h2 { font-size: clamp(25px, 6.4vw, 30px); letter-spacing: -.02em; }
p + p { margin-top: 7px; }
img { display: block; max-width: 100%; }
section { scroll-margin-top: 16px; }
.icon-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 22px; height: 22px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-width: 44px; height: 44px; color: var(--gold); border-radius: 2px; }
.icon-button:hover { background: #ffffff0b; color: var(--ink); }
.icon-button:focus-visible { outline-offset: -3px; }
.small { font-size: 13px; line-height: 1.5; }
.muted { color: var(--muted); }
.strong { font-weight: 550; }
.center { text-align: center; }
.skip-link { position: fixed; top: -80px; left: 16px; background: var(--ink); color: var(--deep); padding: 12px; z-index: 99; }
.skip-link:focus { top: 10px; }
.site-header {
  max-width: 1120px; min-height: 62px; margin: auto; padding: 0 16px;
  display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items: center; gap: 12px;
  border-bottom: 1px solid var(--line); background: var(--deep); position: relative; z-index: 10;
}
.wordmark { font-family: "Josefin Sans", var(--body); font-weight: 300; text-transform: uppercase; letter-spacing: .095em; font-size: 15px; color: var(--ink); text-decoration: none; white-space: nowrap; }
.brand { display: grid; place-items: center; width: 44px; height: 44px; color: var(--ink); text-decoration: none; }
.site-header > .wordmark { text-align: center; min-width: 0; font-size: clamp(12px,3.6vw,15px); letter-spacing: .075em; }
.brand-logo { width: 44px; height: 44px; flex-shrink: 0; object-fit: contain; }
.header-actions { display: flex; align-items: center; }
.header-actions { gap: 9px; }
.site-menu summary { display: grid; place-items: center; width: 44px; height: 44px; list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
.site-menu nav { position: absolute; right: 0; top: 100%; min-width: 240px; padding: 12px 16px; border: 1px solid var(--line); background: var(--deep); box-shadow: 0 20px 35px #0006; }
.site-menu nav a { display: block; padding: 11px 12px; color: var(--ink); text-decoration: none; }
.site-menu nav a:hover { background: var(--surface); }
.site-menu nav .menu-primary { color: var(--gold); border-bottom: 1px solid var(--line); margin-bottom: 5px; font-weight: 600; }
.cover-page .site-header { position: fixed; inset: 0 0 auto; max-width: none; padding-inline: max(16px,calc((100vw - 1072px) / 2)); padding-top: env(safe-area-inset-top); min-height: calc(62px + env(safe-area-inset-top)); }
.cover-page:not(.cover-passed) .site-header { background: transparent; border-color: transparent; padding-left: max(16px,env(safe-area-inset-left)); padding-right: max(16px,env(safe-area-inset-right)); }
.cover-page:not(.cover-passed) .site-header > .brand,
.cover-page:not(.cover-passed) .site-header > .wordmark { visibility: hidden; }
.cover-page:not(.cover-passed) .site-menu summary { background: #171b19a6; border: 1px solid #ffffff30; border-radius: 50%; color: #fff; }
.cover-page .site-menu nav { right: max(16px,calc((100vw - 1072px) / 2)); max-height: calc(100dvh - 92px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow-y: auto; }
.cover-page:not(.cover-passed) .site-menu nav { right: max(16px,env(safe-area-inset-right)); }
.arrival { position: relative; isolation: isolate; height: 100vh; height: 100dvh; min-height: 400px; overflow: hidden; background: #132624; }
.arrival-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 37% center; }
.arrival-video { opacity: 0; pointer-events: none; transition: opacity 800ms ease; }
.arrival-video.is-playing { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .arrival-video { display: none; } }
.arrival::after { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, #0000000a 35%, #07161608 46%, #0716168c 78%, #071616bb); }
.arrival-brand { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: max(106px,13%); text-align: center; color: #fffaf0; text-shadow: 0 2px 22px #061e25a6; }
.arrival-emblem { display: block; position: relative; width: 66px; height: 66px; margin: 0 auto 24px; }
.arrival-emblem::after { content: ''; position: absolute; inset: 5%; border: 1.25px solid #fffaf0; box-shadow: 0 0 8px #061e2540; pointer-events: none; }
.arrival-logo { width: 100%; height: 100%; object-fit: contain; }
.arrival-brand h1 { font-family: "Josefin Sans",var(--body); font-weight: 300; text-transform: uppercase; font-size: clamp(27px,7.8vw,44px); line-height: 1.35; letter-spacing: .17em; }
.arrival-brand h1 span { display: block; padding-left: .17em; }
.arrival-brand h1 span + span { margin-top: 5px; font-size: .72em; letter-spacing: .34em; padding-left: .34em; }
.arrival-brand p { font-family: var(--serif); font-size: clamp(14px,4vw,18px); margin-top: 21px; line-height: 1.5; }
.arrival-explore { position: absolute; z-index: 1; bottom: max(20px,env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 5px; min-height: 48px; padding: 4px 15px; color: #fff5e1; text-decoration: none; }
.arrival-explore span { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.arrival-explore .icon { width: 20px; height: 20px; }
.welcome { position: relative; isolation: isolate; overflow: clip; max-width: 960px; margin: auto; padding: 42px 24px 56px; text-align: center; scroll-margin-top: -14px; }
.welcome h2 { font-size: clamp(26px,6.9vw,42px); line-height: 1.25; text-wrap: balance; }
.welcome h2 span { display: block; color: var(--gold); margin-top: 8px; }
.journal-corner { position: absolute; width: 170px; height: auto; z-index: -1; pointer-events: none; opacity: .9; }
.journal-corner-top { left: 0; top: 0; }
.journal-corner-bottom { right: -28px; bottom: -8px; width: 160px; transform: rotate(180deg); }
.journal-motif { display: flex; align-items: center; gap: 12px; width: 154px; margin: 0 auto 18px; }
.journal-motif::before, .journal-motif::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
.journal-motif img { width: 34px; height: auto; opacity: .88; }
.journal-divider { width: 200px; height: auto; margin: 14px auto; opacity: .9; }
.journal-heading-divider { margin: 12px auto 0; }
.welcome-copy { max-width: 660px; margin: 18px 12px 0; color: var(--muted); font-size: 16px; line-height: 1.55; text-align: left; text-wrap: pretty; }
.welcome-copy p { display: flow-root; }
.illuminated-initial { float: left; width: 66px; margin: 0 12px 0 -9px; }
.illuminated-initial-g { width: 78px; }
.illuminated-word { display: inline-block; }
.illuminated-word::first-letter { font-size: 0; }
.illuminated-initial img { width: 100%; height: auto; opacity: .9; }
.villa-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 960px; margin: 0 24px 12px; padding: 0; list-style: none; border-block: 1px solid var(--line); text-align: center; }
.villa-facts li { min-width: 0; padding: 13px 6px; }
.villa-facts li:nth-child(even) { border-left: 1px solid var(--line); }
.villa-facts li:nth-child(n+3) { border-top: 1px solid var(--line); }
.villa-fact { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 52px; color: var(--gold); text-decoration: none; }
a.villa-fact:hover { color: var(--gold); }
.villa-fact:focus-visible { outline-offset: 5px; border-radius: 2px; }
.fact-value { font: 26px/1.15 var(--serif); white-space: nowrap; }
.fact-unit, .fact-star { font-size: .62em; }
.fact-label { color: var(--muted); font: 11px/1.45 var(--body); letter-spacing: .015em; }
.photo-tour { max-width: 1120px; margin: 0 auto; }
.photo-chapter { padding-top: 10px; margin-top: 15px; border-top: 1px solid var(--line); }
.photo-chapter.opening { padding-top: 24px; margin-top: 0; border: 0; }
.chapter-heading { padding: 0 12px 8px; display: flex; align-items: center; justify-content: space-between; gap: 2px; }
.static-gallery .chapter-heading { display: block; text-align: center; padding: 0 20px 22px; }
.static-gallery h2 { font-size: 34px; letter-spacing: -.025em; line-height: 1.12; }
.hero-intro { max-width: 620px; margin: 12px auto 0; font-size: 15px; line-height: 1.55; color: var(--muted); text-wrap: pretty; }
.gallery-controls { display: flex; align-items: center; flex-shrink: 0; }
.gallery-controls .icon-button { width: 36px; min-width: 36px; height: 44px; }
.gallery-controls .icon { width: 18px; height: 18px; }
.photo-count { color: var(--muted); font-size: 11px; white-space: nowrap; font-variant-numeric: tabular-nums; min-width: 29px; text-align: center; }
.main-photo { position: relative; background: #151515; aspect-ratio: 3/2; overflow: hidden; }
.photo-open { width: 100%; height: 100%; display: block; touch-action: pan-y pinch-zoom; }
.photo-open img { width: 100%; height: 100%; object-fit: contain; }
.static-gallery .main-photo { aspect-ratio: auto; }
.static-gallery .photo-open, .static-gallery .photo-open img { height: auto; }
.photo-open:focus-visible { outline-offset: -5px; }
.photo-caption { position: absolute; bottom: 0; left: 0; right: 0; min-height: 45px; padding: 19px 10px 7px; display: flex; align-items: flex-end; justify-content: space-between; gap: 5px; background: linear-gradient(transparent, #000a); pointer-events: none; }
.photo-caption .gallery-controls { pointer-events: auto; margin: -9px -3px -6px 0; }
.photo-caption .gallery-controls .icon-button { color: #fff; width: 36px; min-width: 36px; }
.photo-caption .photo-count { color: #fff; }
.photo-label { font-size: 14px; text-shadow: 0 1px 5px #000; }
.expand-hint { display: flex; padding: 1px 2px; opacity: .9; }
.expand-hint .icon { width: 18px; height: 18px; }
.photo-previews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; padding: 5px 0 0; }
.previews-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.photo-preview { aspect-ratio: 3/2; position: relative; min-width: 0; overflow: hidden; text-align: left; border: 1px solid transparent; background: var(--deep); }
.photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.photo-preview span { position: absolute; inset: auto 0 0; padding: 15px 6px 5px; background: linear-gradient(transparent,#000c); color: #fff; font-size: clamp(11px, 2.8vw, 14px); line-height: 1.15; text-shadow: 0 1px 5px #000; }
.photo-preview.is-current { border-color: var(--gold); }
.photo-preview:hover { border-color: var(--ink); }
.photo-preview:focus-visible { outline-offset: -4px; }
.highlights-heading { margin: 48px auto 0; padding-inline: 20px; text-align: center; text-wrap: balance; color: var(--ink); }
.hero-highlights { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: first baseline; gap: 36px 18px; list-style: none; padding: 0 16px; margin: 36px 0 26px; text-align: center; }
.hero-highlights li { min-width: 0; }
.hero-highlights .highlight-desktop-only { display: none; }
.highlight-art { display: block; width: 116px; max-width: 100%; height: 78px; object-fit: contain; margin: 0 auto 9px; opacity: .85; mask-image: radial-gradient(ellipse at center, #000 62%, #0009 85%, transparent 100%); }
.highlight-art--sculpted { width: 110px; height: 110px; opacity: 1; mask-image: none; }
.hero-highlights h3 { font: 400 16px/1.25 var(--serif); color: var(--ink); text-wrap: balance; }
.highlight-link { display: block; color: inherit; text-decoration: none; }
.highlight-link h3 { text-decoration: underline; text-decoration-color: rgb(199 170 112 / .6); text-underline-offset: 3px; }
.hero-highlights .highlight-link:hover h3 { color: var(--gold); }
.hero-highlights p { margin: 5px auto 0; max-width: 22ch; color: var(--muted); font-size: 13px; line-height: 1.45; text-wrap: balance; }
.gallery-detail-link { display: flex; justify-content: center; padding: 5px 12px 2px; }
.gallery-detail-link .text-link { justify-content: center; text-align: center; font: 400 16px/1.4 var(--serif); }
.suite-facts { padding: 12px 12px 0; font-size: 14px; line-height: 1.45; }
.suite-facts p + p { margin-top: 5px; }
/* Native sleeping disclosure; live labels remain readable independently of the art. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.sleeping-guide { position: relative; isolation: isolate; max-width: 1000px; }
.suite-engraving { display: block; width: 100%; height: auto; object-fit: contain; }
.private-suite-list { display: grid; gap: 24px; }
.suite-entry { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1fr); align-items: center; gap: 16px; }
.suite-entry-copy { min-width: 0; }
.suite-entry h5 { margin: 0; font: 400 clamp(22px,5.5vw,28px)/1.2 var(--serif); letter-spacing: -.015em; }
.suite-entry p { color: var(--muted); font: 400 14px/1.5 var(--body); }
.suite-bed { display: flex; align-items: center; gap: 7px; }
.suite-bed > img { flex: 0 0 22px; width: 22px; height: 22px; }
.suite-entry .suite-bed { margin-top: 9px; }
.suite-entry .suite-bath { margin-top: 6px; }
.connected-rooms-guide { margin-top: 34px; }
.sleeping-section-heading { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 0 0 20px; color: var(--gold); font: 400 clamp(23px,4.3vw,31px)/1.25 var(--serif); text-align: center; text-wrap: balance; }
.sleeping-section-heading::before, .sleeping-section-heading::after { content: ''; flex: 1; border-top: 1px solid var(--line); min-width: 12px; }
.connected-diagram { margin: 0; }
.connected-map { position: relative; }
.connected-illustration { position: relative; }
.connected-cutaway { display: block; width: 100%; height: auto; }
.connected-labels { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 14px; margin-top: 18px; text-align: center; }
.connected-label { min-width: 0; }
.connected-label h5 { margin: 0; color: var(--ink); font: 400 23px/1.15 var(--serif); }
.connected-label h5 span { display: block; }
.connected-label .suite-bed { justify-content: center; margin-top: 6px; color: var(--muted); font: 400 14px/1.4 var(--body); }
.connected-facility-title { color: var(--ink); font: 400 18px/1.25 var(--serif); }
.connected-facility-detail { margin-top: 4px; color: var(--muted); font: 400 14px/1.4 var(--body); }
.connected-entry { display: none; }
.connected-doors { max-width: 50ch; margin: 20px auto 0; text-align: center; color: var(--muted); font: 400 14px/1.5 var(--body); text-wrap: balance; }
.connected-access { margin: 23px auto 0; max-width: 40ch; text-align: center; color: var(--ink); font: 400 clamp(18px,2.2vw,23px)/1.45 var(--serif); text-wrap: balance; }
.sleeping-footer { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 27px; }
.sleeping-footer::before, .sleeping-footer::after { content: ''; flex: 1; max-width: 250px; border-top: 1px solid var(--line); }
.sleeping-bed-total { color: var(--gold); font: 400 clamp(20px,3.2vw,28px)/1.3 var(--serif); text-align: center; text-wrap: balance; }
@media (min-width: 700px) {
  .private-suite-list { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
  .suite-entry { display: flex; flex-direction: column; align-items: stretch; gap: 13px; text-align: center; }
  .suite-entry h5 { font-size: 26px; }
  .suite-entry .suite-bed { justify-content: center; }
  .suite-entry p { font-size: 14px; }
  .connected-rooms-guide { margin-top: 36px; }
}
@media (min-width: 1000px) {
  .connected-illustration { width: calc(100% - 72px); }
  .connected-labels { display: block; position: absolute; inset: 0; margin: 0; }
  .connected-label { position: absolute; transform: translateX(-50%); text-align: center; color: #2e211b; }
  .connected-label h5 { color: inherit; font-size: clamp(19px,2.4vw,25px); }
  .connected-label h5 span { display: inline; }
  .connected-label .suite-bed { color: inherit; font-size: clamp(12px,1.35vw,14px); margin-top: 4px; gap: 5px; }
  .connected-label .suite-bed > img { width: 19px; height: 19px; flex-basis: 19px; filter: brightness(.5); }
  .connected-zen { left: 18%; top: 76.5%; width: 30%; }
  .connected-bonsai { left: 79.5%; top: 76.5%; width: 32%; }
  .connected-bathroom { left: 47.5%; top: 20.5%; width: 25%; }
  .connected-closet { left: 47.5%; top: 73%; width: 25%; color: #fff5df; text-shadow: 0 1px 3px #24190f; }
  .connected-facility-title { color: inherit; font-family: var(--body); font-size: clamp(13px,1.55vw,18px); }
  .connected-facility-detail { color: inherit; font-size: clamp(11px,1.2vw,13px); margin-top: 2px; }
  .connected-closet .connected-facility-title { font-size: clamp(12px,1.25vw,14px); }
  .connected-entry { display: grid; gap: 1px; position: absolute; right: 0; top: 49%; width: 64px; text-align: center; color: var(--ink); font: 400 13px/1.25 var(--body); }
  .connected-entry-arrow { color: var(--gold); font: 400 40px/.8 var(--serif); }
}
.gallery-detail { padding: 0 12px; }
.gallery-detail summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: center; gap: 6px; width: fit-content; max-width: 100%; margin: 0 auto; color: var(--gold); text-decoration: underline; text-underline-offset: 4px; min-height: 44px; font-size: 13px; }
.gallery-detail summary .icon, .text-link .icon { width: 15px; height: 15px; }
.gallery-detail[open] summary .icon { transform: rotate(90deg); }
.detail-copy { max-width: 720px; margin: 0 auto; padding: 10px 0 22px; color: var(--muted); font-size: 15px; }
.detail-copy p + p { margin-top: 12px; }
.room-list { margin: 0 0 14px; }
.room-list div { padding: 10px 0; border-bottom: 1px solid var(--line); }
.room-list dt { color: var(--ink); margin-bottom: 3px; }
.room-list dd { margin: 0; }
.practical { padding: 0 16px; max-width: 1120px; margin: 18px auto 0; }
.section { border-top: 1px solid var(--line); padding: 20px 0; }
.section h2 { margin-bottom: 12px; display: flex; gap: 9px; align-items: center; }
.heading-icon { color: var(--gold); width: 24px; height: 24px; }
.distances { margin: 0 0 9px; }
.distances div { display: flex; justify-content: space-between; gap: 20px; padding: 3px 0; }
.distances dd { margin: 0; color: var(--muted); }
.text-link { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; font-size: 13px; color: var(--gold); text-decoration: underline; text-underline-offset: 4px; }
.services { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 12px 0; gap: 4px; }
.services a { text-decoration: none; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 9px; color: var(--ink); font-size: 11px; line-height: 1.4; padding: 6px 0; }
.services .icon { color: var(--gold); width: 30px; height: 30px; }
.services a:hover .icon { color: var(--ink); }
.price { font: 36px/1.15 var(--serif); margin: 4px 0; }
.price span { font-size: 24px; }
.booking-layout { margin-top: 12px; }
.calendar { padding: 8px 8px 12px; border: 1px solid var(--line); border-radius: 3px; }
.calendar-header { display: flex; justify-content: space-between; align-items: center; }
.calendar-header h3 { font: 550 15px/1.3 var(--body); }
.weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.weekdays { color: var(--muted); font-size: 12px; text-align: center; padding: 8px 0 3px; }
.calendar-day { min-height: 44px; font-size: 14px; border-radius: 2px; }
.calendar-day:not(:disabled):hover { background: var(--surface); }
.calendar-day.in-range { background: #c7aa7017; }
.calendar-day.selected, .calendar-day.selected:hover { background: var(--gold); color: var(--deep); font-weight: 600; }
.calendar-day.today:not(.selected) { text-decoration: underline; text-underline-offset: 5px; }
.calendar-status { text-align: center; margin-top: 12px; color: var(--muted); }
.preview-notice { color: var(--muted); font-size: 11px; text-align: center; margin-top: 8px; }
form { margin-top: 16px; display: grid; gap: 10px; }
form label { font-size: 12px; display: grid; gap: 4px; color: var(--muted); min-width: 0; }
form label > .muted { display: contents; }
.date-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
input, select, textarea { display: block; width: 100%; min-width: 0; max-width: 100%; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 3px; min-height: 46px; padding: 11px; font-size: 16px; line-height: 1.3; }
input[type=date] { padding: 10px 7px; min-height: 46px; }
input::placeholder, textarea::placeholder { color: #b9b6b0; opacity: 1; }
textarea { resize: vertical; min-height: 74px; }
.primary-button { background: var(--gold); color: #202020; min-height: 48px; padding: 12px 18px; font-size: 16px; font-weight: 600; border-radius: 3px; }
.primary-button:hover { background: #d8bd84; }
.confirmation-note { text-align: center; color: var(--muted); font-size: 11px; }
.request-result { padding: 16px; background: var(--surface); border: 1px solid var(--gold); border-radius: 3px; overflow-wrap: anywhere; }
.request-result h3 { font-size: 23px; margin-bottom: 8px; }
.request-result p + p { margin-top: 9px; }
.answer { border-bottom: 1px solid var(--line); }
.answer summary { list-style: none; padding: 14px 24px 14px 0; min-height: 48px; position: relative; cursor: pointer; font-size: 14px; }
.answer summary::after { content: ""; border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold); width: 7px; height: 7px; transform: rotate(45deg); position: absolute; right: 4px; top: 20px; }
.answer[open] summary::after { transform: rotate(225deg); top: 24px; }
.answer > div { color: var(--muted); padding: 2px 0 18px; font-size: 14px; }
.answer ul { padding-left: 19px; margin: 12px 0; }
.answer li + li { margin-top: 7px; }
.contact { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.contact h2 { font-size: 23px; margin-bottom: 4px; }
.contact-links { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.contact-links a { min-height: 44px; display: flex; align-items: center; }
/* The photo, its title and navigation stay together as one centered composition. */
#photo-viewer { background: var(--deep); color: var(--ink); border: 0; margin: 0; padding: calc(68px + env(safe-area-inset-top)) 0 calc(52px + env(safe-area-inset-bottom)); width: 100%; max-width: none; height: 100vh; height: 100dvh; max-height: none; }
#photo-viewer::backdrop { background: var(--deep); }
#photo-viewer[open] { display: flex; align-items: center; justify-content: center; }
.viewer-content { width: 100%; max-width: 1120px; margin: auto; }
.viewer-header { text-align: center; padding: 0 20px 24px; }
.viewer-header p { color: var(--muted); font-size: 12px; line-height: 1.5; letter-spacing: .05em; margin-bottom: 8px; }
.viewer-header h2 { font-size: 26px; line-height: 1.2; letter-spacing: -.02em; text-wrap: balance; }
#photo-viewer .icon-button { width: 44px; min-width: 44px; height: 44px; border-radius: 50%; background: var(--surface); border: 1px solid #ffffff10; }
#photo-viewer .icon-button:hover { background: #3b3b3b; }
#photo-viewer .icon-button:active { background: #444; }
.viewer-close { position: absolute; top: max(16px,env(safe-area-inset-top)); right: max(16px,env(safe-area-inset-right)); z-index: 1; }
.viewer-stage { min-height: 0; position: relative; touch-action: pan-y pinch-zoom; display: grid; place-items: center; }
.viewer-stage img { width: 100%; height: auto; max-height: calc(100vh - 272px); max-height: calc(100dvh - 272px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); object-fit: contain; }
#viewer-error { padding: 40px 20px; text-align: center; color: var(--muted); }
.viewer-toolbar { display: flex; align-items: center; justify-content: center; gap: 26px; padding: 24px 12px 0; }
#viewer-count { min-width: 48px; text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; color: var(--muted); }
.viewer-play { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; min-width: 72px; font-size: 13px; color: var(--gold); }
.viewer-play .icon { width: 18px; height: 18px; }
/* The illustrated journal is deliberately scoped away from the photo-led homepage. */
.difference-page { background: #242424; }
.villa-journal { max-width: 1064px; padding: 14px 24px 40px; margin: auto; }
.journal-back { border: 0; font-size: 13px; margin-bottom: 10px; }
.journal-opening { text-align: center; max-width: 710px; margin: 0 auto 42px; }
.journal-opening h1 { max-width: 660px; margin: 0 auto 22px; font-size: clamp(32px,7.7vw,50px); line-height: 1.16; letter-spacing: -.025em; text-wrap: balance; }
.journal-opening h1 span { color: var(--gold); white-space: nowrap; }
.journal-opening p { color: var(--ink); font-size: 16px; line-height: 1.7; text-wrap: pretty; }
.journal-chapter { max-width: 680px; margin: 0 auto 42px; }
.journal-chapter-title { display: flex; align-items: center; gap: 15px; margin-bottom: 20px; }
.journal-chapter-title h2 { color: var(--gold); font-size: clamp(26px,6.5vw,34px); line-height: 1.22; text-wrap: balance; }
.journal-chapter-title > img { width: 25px; height: auto; flex-shrink: 0; opacity: .9; }
.journal-chapter-title::after { content: ""; order: 1; flex: 1 0 18px; border-top: 1px solid var(--line); }
.journal-chapter-title > img { order: 2; }
.journal-chapter p { color: #ddd8ce; font-size: 16px; line-height: 1.75; text-wrap: pretty; }
.journal-chapter p + p { margin-top: 18px; }
.journal-first-paragraph { display: flow-root; }
.journal-signoff { margin: 22px 0 8px; text-align: right; }
.journal-signature { display: inline-block; width: min(280px,100%); height: auto; }
.journal-initial { float: left; width: 58px; height: auto; margin: 1px 12px 3px -5px; }
.journal-scene { position: relative; margin: 14px -16px 24px; }
.journal-scene > img { width: 100%; height: auto; }
.journal-scene figcaption { max-width: 680px; margin: 10px auto 0; padding-inline: 16px; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.6; }
.journal-pool { padding-left: 14px; }
.journal-pool > .journal-frond { position: absolute; bottom: 4%; left: -6px; width: 25%; max-width: 160px; pointer-events: none; }
.journal-cave { margin-top: -6px; }
.journal-break { display: flex; justify-content: center; margin: 8px auto 34px; max-width: 680px; }
.journal-break img { width: 210px; height: auto; opacity: .9; }
.journal-finale { margin-bottom: 30px; }
.journal-next { text-align: center; max-width: 760px; margin: 12px auto 0; padding: 0 0 16px; }
.journal-next .journal-motif { margin-bottom: 18px; }
.journal-tour-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 10px 0; border-bottom: 1px solid var(--gold); font-size: 13px; letter-spacing: .13em; text-transform: uppercase; text-decoration: none; }
.journal-next > div { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; column-gap: 24px; row-gap: 4px; margin-top: 16px; }
.journal-next .text-link { font-size: 13px; }
.inside-villa-page .journal-opening { max-width: 800px; }
.inside-villa-page .journal-opening > p { max-width: 680px; margin-inline: auto; }
.villa-entry-scene { margin: 12px -16px 24px; }
.villa-entry-scene img { width: 100%; height: auto; }
.inside-villa-page .journal-spread { display: flex; flex-direction: column; }
.villa-room-copy { display: contents; }
.villa-room-copy > p { order: 3; }
.villa-room-copy > p:first-of-type { order: 1; }
.inside-villa-page .journal-spread > .journal-scene { order: 2; }
.inside-villa-page .journal-scene { margin-block: 20px; }
@media (max-width: 1099px) {
  .inside-villa-page .villa-room-copy > p:nth-of-type(2) { margin-top: 0; }
}
@media (max-width: 600px) {
  .inside-villa-page .journal-chapter-title::after,
  .inside-villa-page .journal-chapter-title > img { display: none; }
}
@media (min-width: 900px) {
  .villa-journal { padding-top: 20px; padding-bottom: 60px; }
  .journal-opening { margin-bottom: 56px; }
  .journal-opening p { font-size: 18px; }
  .journal-chapter { margin-bottom: 52px; }
  .journal-chapter p { font-size: 17px; line-height: 1.8; }
  .journal-chapter-title { gap: 24px; margin-bottom: 24px; }
  .journal-chapter-title > img { width: 30px; }
  .journal-initial { width: 70px; margin-right: 18px; }
  .journal-scene { margin: 12px clamp(-120px,calc((728px - 100vw) / 2),-16px) 32px; }
  .journal-pool { padding-left: 70px; }
  .journal-pool > .journal-frond { left: 4px; width: 19%; max-width: 180px; }
  .journal-cave { margin-top: -6px; }
  .journal-dining { max-width: 1016px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.06fr); column-gap: 28px; }
  .journal-dining .journal-chapter-title { grid-column: 1 / -1; max-width: 680px; margin-inline: auto; }
  .journal-dining p { grid-column: 1; }
  .journal-dining p + p { margin-top: 18px; }
  .journal-dining figure + p { margin-top: 18px; }
  .journal-palapa { grid-column: 2; grid-row: 2 / 5; align-self: center; margin: 0 -15px 0 -10px; }
  .journal-break { margin-bottom: 44px; }
  .journal-tour-link { font-size: 15px; }
}
/* Broad illustrated spreads for desktop; phone and tablet composition is unchanged. */
@media (min-width: 1100px) {
  .villa-journal { max-width: 1248px; }
  .journal-opening { margin-bottom: 88px; }
  .journal-chapter { margin-bottom: 88px; }
  .journal-spread {
    --journal-rows: 4;
    --journal-text-column: 2;
    --journal-art-column: 1;
    display: grid;
    grid-template-columns: minmax(0,1.14fr) minmax(0,1fr);
    column-gap: clamp(40px,4.4vw,64px);
    max-width: 1200px;
    align-items: start;
  }
  .journal-art-right {
    --journal-text-column: 1;
    --journal-art-column: 2;
    grid-template-columns: minmax(0,1fr) minmax(0,1.14fr);
  }
  .journal-spread[data-journal-rows="3"] { --journal-rows: 3; }
  .journal-spread[data-journal-rows="5"] { --journal-rows: 5; }
  .journal-spread .journal-chapter-title {
    grid-column: var(--journal-text-column);
    grid-row: 1;
    max-width: none;
    margin-inline: 0;
    gap: 16px;
  }
  .journal-spread > p,
  .journal-spread > .journal-signoff { grid-column: var(--journal-text-column); }
  .journal-spread > p { margin: 0; }
  .journal-spread > p ~ p { margin-top: 18px; }
  .journal-spread > .journal-scene {
    grid-column: var(--journal-art-column);
    grid-row: 1 / span var(--journal-rows);
    align-self: center;
    margin: 0 -24px;
  }
  .journal-spread .journal-pool { padding-left: 30px; }
  .journal-spread .journal-frond { width: 18%; }
  .journal-inset { max-width: 1100px; }
  .journal-inset[aria-labelledby="privacy"] { margin-left: 0; }
  .journal-inset[aria-labelledby="noord-location"] { margin-right: 0; }
  .inside-villa-page .journal-spread { display: grid; align-items: center; }
  .inside-villa-page .villa-room-copy { display: block; grid-column: var(--journal-text-column); grid-row: 1; }
  .inside-villa-page .journal-spread > .journal-scene { grid-row: 1; }
  .journal-break { margin-top: -8px; margin-bottom: 70px; }
}
@media (max-width: 360px) {
  .wordmark { font-size: 12px; }
  .site-header { padding-inline: 12px; gap: 4px; }
  .header-actions { gap: 3px; }
  .chapter-heading { padding-inline: 9px; }
  .chapter-heading h2 { font-size: 23px; }
  .gallery-controls .icon-button { min-width: 30px; width: 30px; }
  .brand-logo { width: 38px; height: 38px; }
  .hero-highlights { gap: 32px 12px; padding-inline: 12px; }
  .highlight-art { width: 104px; height: 70px; }
  .highlight-art--sculpted { width: 100px; height: 100px; }
  .hero-highlights h3 { font-size: 15px; }
  .contact { flex-wrap: wrap; gap: 5px; }
}
@media (min-width: 700px) {
  .site-header { min-height: 78px; padding-inline: 24px; }
  .cover-page .site-header { min-height: calc(78px + env(safe-area-inset-top)); }
  .wordmark { font-size: 19px; }
  .site-header > .wordmark { font-size: 19px; letter-spacing: .095em; }
  .header-actions { gap: 18px; }
  .photo-tour { padding: 0 24px; }
  .photo-chapter { margin-top: 30px; padding-top: 18px; }
  .photo-chapter.opening { padding-top: 36px; }
  h1 { font-size: 44px; }
  h2 { font-size: 34px; }
  .static-gallery h2 { font-size: 48px; }
  .arrival-photo { object-position: center; }
  .arrival-brand { bottom: max(100px,12%); }
  .arrival-brand h1 { font-size: clamp(42px,4.5vw,64px); }
  .arrival-brand p { font-size: 20px; margin-top: 20px; }
  .welcome { padding-top: 64px; padding-bottom: 72px; scroll-margin-top: 0; }
  .welcome h2 { max-width: 800px; margin-inline: auto; }
  .welcome-copy { font-size: 17px; margin: 28px auto 0; line-height: 1.8; }
  .journal-corner { width: 210px; }
  .journal-corner-bottom { width: 190px; }
  .journal-motif { width: 180px; margin-bottom: 22px; }
  .journal-motif img { width: 38px; }
  .journal-divider { width: 240px; margin-block: 28px; }
  .journal-heading-divider { margin-bottom: 0; }
  .illuminated-initial { width: 76px; margin-right: 16px; margin-left: -12px; }
  .illuminated-initial-g { width: 86px; }
  .villa-facts { grid-template-columns: repeat(4,minmax(0,1fr)); width: calc(100% - 48px); margin-inline: auto; padding-block: 18px; }
  .villa-facts li { padding: 8px 10px; }
  .villa-facts li:nth-child(n+3) { border-top: 0; }
  .villa-facts li + li { border-left: 1px solid var(--line); }
  .fact-value { font-size: 29px; }
  .fact-label { font-size: 12px; }
  .hero-intro { font-size: 17px; margin-top: 15px; }
  .static-gallery .chapter-heading { padding-bottom: 30px; }
  .chapter-heading { padding: 0 0 12px; }
  .main-photo { width: 100%; }
  .photo-previews { gap: 9px; padding-top: 9px; }
  .previews-4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .previews-6 { grid-template-columns: repeat(6,minmax(0,1fr)); }
  .previews-3 .photo-preview { aspect-ratio: 2/1; }
  .photo-preview span { font-size: 14px; padding: 25px 10px 10px; }
  .photo-label { font-size: 18px; }
  .photo-caption { padding: 30px 18px 15px; }
  .gallery-controls .icon-button { width: 44px; min-width: 44px; }
  .photo-count { font-size: 12px; min-width: 42px; }
  .hero-highlights { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 44px 40px; max-width: 1000px; margin: 46px auto 30px; }
  .highlight-art { width: 160px; height: 108px; margin-bottom: 10px; }
  .highlight-art--sculpted { width: 150px; height: 150px; }
  .hero-highlights .highlight-desktop-only { display: list-item; }
  .hero-highlights h3 { font-size: 20px; }
  .hero-highlights p { font-size: 14px; }
  .suite-facts { text-align: center; font-size: 15px; }
  .gallery-detail summary { font-size: 14px; min-height: 48px; }
  .practical { padding: 0 24px; margin-top: 35px; }
  .section { padding-block: 28px; }
  .practical-intro, .answers-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
  .services a { font-size: 12px; }
  .booking-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 22px; align-items: start; }
  form { margin: 0; }
  .calendar { padding: 12px 18px 18px; }
  .calendar-day { min-height: 52px; }
  .calendar-header h3 { font-size: 17px; }
  .contact h2 { font-size: 28px; }
  .viewer-header h2 { font-size: 30px; }
  .viewer-stage { padding-inline: max(24px,env(safe-area-inset-left),env(safe-area-inset-right)); }
  .viewer-stage img { max-height: calc(100dvh - 286px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
}
@media (max-height: 500px) {
  .arrival { min-height: 300px; }
  .arrival-brand { bottom: 70px; }
  .arrival-emblem { width: 40px; height: 40px; margin-bottom: 10px; }
  .arrival-brand h1 { font-size: 27px; }
  .arrival-brand p { font-size: 14px; margin-top: 10px; }
  .arrival-explore { bottom: 10px; }
  #photo-viewer { padding-block: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-bottom)); }
  .viewer-header { padding: 0 76px 12px; }
  .viewer-header p { display: none; }
  .viewer-header h2 { font-size: 23px; }
  .viewer-stage img { max-height: calc(100vh - 132px); max-height: calc(100dvh - 132px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .viewer-toolbar { padding-top: 12px; }
  .viewer-close { top: max(12px,env(safe-area-inset-top)); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

@media (max-width: 360px) {
  .journal-corner-top { width: 132px; }
}

/* Garden article practical note; all illustrated layout uses the shared journal. */
.gardens-page .garden-safety-note { max-width: 680px; margin: 24px auto 0; text-align: center; font-size: 14px; line-height: 1.7; color: var(--muted); }
.gardens-page .journal-opening p + p { margin-top: 18px; }
.gardens-page .journal-chapter p a { color: inherit; text-decoration-color: var(--gold); text-underline-offset: 3px; }

@media (min-width: 1000px) {
  .gardens-page .journal-chapter-title::after { flex-basis: 56px; min-width: 56px; }
}

/* Thumbnail focal point in external CSS, compatible with the preview CSP. */
.photo-preview img[data-thumbnail-position="50% 80%"] { object-position: 50% 80%; }

/* Background changes now separate the homepage sections. */
.cover-page :is(.villa-facts, .photo-chapter:not(.opening), .floor-plan-section, .location-section, .villa-services, #terms, #questions, #contact, .site-footer) { border-top: 0; }
.cover-page .villa-facts { border-bottom: 0; }
.cover-page .services-rule { display: none; }

/* Owner-selected burgundy bands alternate with the original charcoal. */
.cover-page .photo-tour { max-width: none; padding-inline: 0; }
.cover-page .photo-chapter { max-width: 1072px; margin-inline: auto; }
.cover-page .palette-band { display: flow-root; background-color: var(--bg); }
.cover-page .palette-burgundy { --bg: #3d252d; }
.cover-page .palette-band > .photo-chapter { margin-top: 0; padding-top: 24px; padding-bottom: 26px; }
.cover-page .palette-band > .location-section { margin-block: 0; }

/* Shared footer: the Transfers layout, with Bali's identity and palette. */
.site-footer { width: 100%; max-width: none; margin: 0; padding: 28px 32px 14px; background: #3d252d; color: #f4efe3; border: 0; }
.footer-inner { max-width: 1240px; margin-inline: auto; }
.footer-top { display: grid; grid-template-columns: 1fr 1.6fr; gap: 40px; align-items: center; padding-bottom: 22px; }
.footer-brand { display: inline-flex; align-items: center; gap: 14px; width: fit-content; max-width: 100%; color: #f4efe3; text-decoration: none; }
.footer-brand img { display: block; width: 62px; height: 62px; flex: 0 0 62px; }
.footer-brand > span { font: 300 24px/1.3 "Josefin Sans", var(--body); letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.footer-brand small { display: block; margin-top: 5px; color: var(--gold); font: 300 14px/1.3 "Josefin Sans", var(--body); letter-spacing: .4em; text-align: center; }
.footer-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.footer-contact-link { display: flex; align-items: center; gap: 12px; min-height: 44px; width: fit-content; max-width: 100%; color: #f4efe3; font: 400 18px/1.4 var(--body); text-decoration: none; }
.footer-contact-link svg { width: 23px; height: 23px; flex: 0 0 23px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.footer-contact p { margin: 0 0 0 35px; color: #ded0d3; font-size: 13px; line-height: 1.5; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 9px; border-top: 1px solid #c7aa704d; }
.footer-bottom nav { display: flex; align-items: center; flex-wrap: wrap; gap: 26px; }
.footer-bottom a { display: inline-flex; align-items: center; min-height: 44px; color: #f4efe3; font-size: 13px; text-underline-offset: 4px; }
.footer-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; color: #ded0d3; }
.footer-meta small, .footer-meta a { font-size: 12px; }
.footer-meta a { color: #ded0d3; }
.site-footer a:hover { color: var(--gold); }
.footer-contact-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.site-footer :focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (min-width: 901px) {
  .footer-top { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  .footer-contact { display: contents; }
  .footer-message { justify-self: center; }
  .footer-phone { justify-self: end; text-align: right; }
  .footer-phone .footer-contact-link { margin-left: auto; }
  .footer-phone p { margin-left: 0; }
}
@media (max-width: 900px) {
  .footer-top { grid-template-columns: 1fr; gap: 20px; }
  .footer-brand { margin-inline: auto; }
  .footer-contact-link { margin-inline: auto; }
  .footer-contact p { margin-left: 0; text-align: center; }
}
@media (max-width: 600px) {
  .site-footer { padding: 24px 22px 20px; text-align: center; }
  .footer-top { gap: 18px; padding-bottom: 18px; }
  .footer-brand { gap: 12px; }
  .footer-brand img { width: 56px; height: 56px; flex-basis: 56px; }
  .footer-brand > span { font-size: 22px; }
  .footer-brand small { font-size: 13px; }
  .footer-contact { grid-template-columns: 1fr; gap: 16px; }
  .footer-contact-link { font-size: 19px; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .footer-bottom nav { justify-content: center; gap: 25px; }
  .footer-meta { justify-content: center; gap: 12px; }
}
@media (max-width: 359px) {
  .footer-brand > span { font-size: 20px; }
  .footer-bottom nav { gap: 20px; }
}
@media (min-width: 700px) {
  .cover-page .photo-chapter { width: calc(100% - 48px); }
  .cover-page .palette-band > .photo-chapter { padding-top: 30px; padding-bottom: 30px; }
}

/* Compact sleeping-guide disclosure; native interaction also works without JS. */
.sleeping-guide { width: calc(100% - 32px); padding: 0; margin: 24px auto 0; overflow: visible; }
.sleeping-summary { display: grid; justify-items: center; gap: 9px; max-width: 760px; margin-inline: auto; padding: 8px 0; list-style: none; cursor: pointer; text-align: center; }
.sleeping-summary:hover { color: var(--ink); }
.sleeping-summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 6px; border-radius: 4px; }
.sleeping-summary-copy { display: grid; justify-items: center; gap: 5px; min-width: 0; }
.sleeping-title { color: var(--ink); font: 400 clamp(23px,6.2vw,26px)/1.15 var(--serif); letter-spacing: -.02em; }
.sleeping-capacity { font: 400 14px/1.45 var(--body); color: var(--ink); }
.sleeping-description { max-width: 38ch; font: 400 13px/1.4 var(--body); color: var(--muted); }
.sleeping-action-row { display: flex; align-items: center; gap: 12px; width: 100%; max-width: 480px; }
.sleeping-action-row::before, .sleeping-action-row::after { content: ""; height: 1px; flex: 1; background: var(--gold); opacity: .65; }
.sleeping-action { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 36px; padding: 8px 16px; border-radius: 999px; background: var(--gold); color: #31221e; font: 500 13px/1.35 var(--body); }
.sleeping-summary:hover .sleeping-action { background: #d5bb86; }
.sleeping-action-close { display: none; }
.sleeping-guide[open] .sleeping-action-open { display: none; }
.sleeping-guide[open] .sleeping-action-close { display: block; }
.sleeping-chevron { flex: 0 0 9px; width: 9px; height: 9px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s ease; }
.sleeping-guide[open] .sleeping-chevron { transform: translateY(2px) rotate(225deg); }
.sleeping-content { padding: 28px 12px 12px; }
@media (min-width: 600px) {
  .sleeping-guide { margin-top: 36px; }
  .sleeping-summary { gap: 12px; padding: 10px 0; }
  .sleeping-summary-copy { gap: 7px; }
  .sleeping-title { font-size: 32px; }
  .sleeping-capacity { font-size: 16px; }
  .sleeping-description { max-width: none; font-size: 14px; }
  .sleeping-action { min-height: 40px; padding-inline: 20px; font-size: 14px; }
  .sleeping-content { padding: 32px 30px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .sleeping-chevron { transition: none; }
}

.legacy-anchor { scroll-margin-top: 100px; }

.visitor-guide figure{margin:24px 0}.visitor-guide img{display:block;width:100%;height:auto;border-radius:12px}.visitor-guide figcaption{font-size:14px;color:var(--muted);margin-top:10px}.visitor-guide h3{font-family:var(--serif);font-weight:400;font-size:25px;color:var(--gold)}.visitor-guide section,.visitor-guide article{scroll-margin-top:110px}.visitor-guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.visitor-guide-links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 30px;margin:26px auto;color:var(--gold)}.visitor-guide-links a{color:inherit;text-underline-offset:5px}.visitor-guide details{border-bottom:1px solid #b6a06a55;padding:18px 0}.visitor-guide summary{cursor:pointer;font-size:19px}.visitor-guide .guide-note{font-size:15px;color:var(--muted)}@media(max-width:600px){.visitor-guide-grid{grid-template-columns:1fr;gap:16px}}