@font-face { font-family: Cormorant; src: url('assets/fonts/cormorant-regular.ttf'); }
@font-face { font-family: Cormorant; src: url('assets/fonts/cormorant-medium.ttf'); font-weight: 500; }
@font-face { font-family: Cormorant; src: url('assets/fonts/cormorant-italic.ttf'); font-style: italic; }
@font-face { font-family: Manrope; src: url('assets/fonts/manrope-regular.ttf'); }
@font-face { font-family: Manrope; src: url('assets/fonts/manrope-semibold.ttf'); font-weight: 600; }
@font-face { font-family: Allura; src: url('assets/fonts/allura-regular.ttf'); }

:root {
  --cream: #f4efe4;
  --ink: #182018;
  --forest: #35482e;
  --terracotta: #ce6944;
  --muted: #6c735f;
  --paper-pattern: url('assets/decor/paper-texture.svg');
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; overflow-x: hidden; color: var(--ink); background: var(--cream) var(--paper-pattern) repeat; font-family: Manrope, Arial, sans-serif; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.site-header { position: absolute; inset: 0 0 auto; z-index: 20; height: 82px; display: flex; align-items: center; overflow: visible; background: var(--cream) var(--paper-pattern) repeat; }
.brand { position: absolute; top: 0; left: 0; z-index: 4; isolation: isolate; width: 370px; height: 168px; display: flex; flex-direction: column; align-items: center; overflow: visible; padding-top: 10px; color: var(--ink); text-decoration: none; }
.brand::before { content: ""; position: absolute; inset: 0; z-index: 0; background: var(--cream) var(--paper-pattern) repeat; -webkit-mask: url('assets/decor/brand-plaque.svg') left top / 100% 100% no-repeat; mask: url('assets/decor/brand-plaque.svg') left top / 100% 100% no-repeat; filter: drop-shadow(0 1px 0 rgba(82,70,46,.04)); }
.brand > .brand-leaf, .brand > span { position: relative; z-index: 2; }
.brand-leaf { width: 88px; height: 45px; }
.brand-name { margin-top: -2px; font: 500 2.8rem/.9 Cormorant, serif; letter-spacing: .045em; }
.brand-sub { margin-top: 7px; font-size: .62rem; letter-spacing: .55em; }
.brand-location { margin-top: 8px; color: #6a6c5d; font-size: .52rem; letter-spacing: .42em; }
.desktop-nav { position: absolute; z-index: 6; top: 31px; left: 38%; display: flex; gap: 55px; }
.desktop-nav a { color: #161b16; text-decoration: none; font-size: 1.15rem; }
.desktop-nav a:hover { color: var(--terracotta); }
.header-cta { position: absolute; z-index: 6; top: 18px; right: 145px; height: 52px; display: flex; align-items: center; gap: 26px; padding: 0 27px 0 31px; border: 0; border-radius: 28px; color: white; background: var(--forest); cursor: pointer; }
.header-cta img { width: 19px; filter: brightness(0) invert(1); }
.menu-button { position: absolute; z-index: 7; top: 22px; right: 50px; width: 46px; height: 40px; display: grid; place-items: center; border: 0; background: none; cursor: pointer; }
.menu-button img { width: 39px; height: 39px; }

.hero { position: relative; height: 635px; overflow: hidden; background: #b8c7ad; }
.hero-photo { position: absolute; inset: 72px 0 0; width: 100%; height: 563px; object-fit: cover; object-position: center 58%; filter: saturate(1.06) contrast(.97) brightness(1.02); }
.hero-shade { position: absolute; inset: 72px 0 0; background: linear-gradient(90deg,rgba(7,19,10,.68) 0,rgba(7,19,10,.37) 35%,rgba(7,19,10,0) 65%),linear-gradient(0deg,rgba(7,19,10,.25),transparent 42%); }
.foreground-foliage { position: absolute; z-index: 6; object-fit: contain; pointer-events: none; will-change: transform; filter: saturate(.98) brightness(.78) contrast(1.08) drop-shadow(0 12px 18px rgba(15,31,15,.18)); }
.foreground-foliage-left { top: 72px; left: -168px; width: 610px; height: 520px; object-position: left top; opacity: .7; transform-origin: 9% 18%; animation: hero-breeze 7.5s ease-in-out infinite alternate; }
.foreground-foliage-right { top: 160px; right: -112px; width: 500px; height: 425px; object-position: right bottom; opacity: .58; transform-origin: 50% 34%; -webkit-mask-image: linear-gradient(to bottom,transparent 0,#000 11%,#000 100%); mask-image: linear-gradient(to bottom,transparent 0,#000 11%,#000 100%); animation: hero-breeze-right 8.8s ease-in-out -2.1s infinite alternate; }
@keyframes hero-breeze {
  0% { transform: rotate(-1.1deg) translate3d(-3px,1px,0) skewY(-.25deg); }
  48% { transform: rotate(.35deg) translate3d(3px,-1px,0) skewY(.16deg); }
  100% { transform: rotate(1.25deg) translate3d(7px,2px,0) skewY(.42deg); }
}
@keyframes hero-breeze-right {
  0% { transform: scaleX(-1) rotate(-.7deg) translate3d(-2px,1px,0) skewY(.18deg); }
  55% { transform: scaleX(-1) rotate(.55deg) translate3d(4px,-2px,0) skewY(-.22deg); }
  100% { transform: scaleX(-1) rotate(1.35deg) translate3d(8px,2px,0) skewY(-.4deg); }
}
.hero-copy { position: absolute; z-index: 7; top: 252px; left: 5%; color: white; }
.hero-copy h1 { margin: 0; font: 500 clamp(6rem,7.65vw,8rem)/.7 Cormorant, serif; letter-spacing: -.025em; }
.hero-script { margin: 15px 0 0; color: #f3dfbd; font: italic clamp(2.5rem,3.25vw,3.4rem)/1 Cormorant, serif; }
.hero-line { margin: 14px 0 28px; font-size: 1.22rem; }
.hero-actions { display: flex; gap: 20px; align-items: center; }
.primary-button { min-width: 258px; min-height: 60px; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 0 28px 0 36px; border: 0; border-radius: 32px; color: white; background: var(--terracotta); text-decoration: none; font-size: 1.03rem; cursor: pointer; }
.primary-button > img { width: 20px; filter: brightness(0) invert(1); }
.play-button { display: flex; gap: 14px; align-items: center; border: 0; color: white; background: transparent; cursor: pointer; }
.play-icon { width: 52px; height: 52px; display: grid; place-items: center; border: 2px solid white; border-radius: 50%; }
.play-icon img { width: 18px; filter: brightness(0) invert(1); transform: translateX(1px); }
.play-button strong { font-weight: 500; font-size: 1.03rem; }
.hero-rail { position: absolute; z-index: 6; top: 112px; right: 15px; width: 112px; padding: 0 8px; color: #616653; text-align: center; }
.hero-rail p { margin: 0; font-size: .56rem; line-height: 1.75; letter-spacing: .34em; white-space: normal; word-break: keep-all; }
.hero-rail i { display: block; width: 38px; height: 1px; margin: 18px auto; background: #77796d; }
.hero-organic-frame { position: absolute; z-index: 4; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hero-organic-frame path { fill: var(--cream); }
.hero-leaf-mark { position: absolute; z-index: 5; top: 205px; right: -56px; width: 210px; height: 350px; object-fit: contain; opacity: .58; pointer-events: none; }

.experiences { position: relative; min-height: 310px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 37px; overflow: visible; padding: 20px 5.3% 58px; background: var(--cream) var(--paper-pattern) repeat; }
.experience-leaf-mark { position: absolute; z-index: 0; left: -95px; bottom: -145px; width: 285px; opacity: .48; transform: rotate(18deg); }
.experience-weave { position: absolute; z-index: 1; right: -20px; bottom: -12px; width: 310px; opacity: 1; }
.experience-card { position: relative; z-index: 2; height: 227px; overflow: hidden; border-radius: 35px; color: var(--ink); text-decoration: none; box-shadow: 0 1px 0 rgba(72,61,43,.05); }
.experience-card > img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.experience-card:hover > img { transform: scale(1.035); }
.experience-card:nth-of-type(1) > img { object-position: center 54%; }
.experience-card:nth-of-type(2) > img { object-position: center 55%; }
.experience-card:nth-of-type(3) > img { object-position: center 54%; }
.card-copy { position: absolute; left: 0; bottom: 0; width: 78%; height: 126px; padding: 48px 26px 0; background: url('assets/decor/card-caption-curve.svg') left bottom / 100% 100% no-repeat; }
.card-copy h2 { margin: 0; font: 500 2.35rem/.9 Cormorant, serif; }
.card-copy p { margin: 8px 0 0; font-size: .56rem; line-height: 1.65; letter-spacing: .27em; }
.card-copy .card-arrow { position: absolute; right: 30px; bottom: 23px; width: 19px; height: 19px; }
.side-caption { position: absolute; z-index: 6; top: -70px; right: 16px; width: 105px; color: #656955; font-size: .55rem; line-height: 1.75; letter-spacing: .33em; }
.side-caption span { display: block; width: 31px; height: 1px; margin-bottom: 14px; background: #646858; }
.side-caption p { margin: 0; }
.footer-motto { position: absolute; z-index: 3; left: 50%; bottom: 17px; transform: translateX(-50%); display: flex; align-items: center; gap: 20px; margin: 0; color: #6e725f; white-space: nowrap; font-size: .56rem; letter-spacing: .34em; }
.footer-motto i { width: 42px; height: 1px; background: #8a8b7d; }
.footer-motto b { font-weight: 400; }

.menu-panel { position: fixed; inset: 0; z-index: 30; overflow: auto; color: white; background: rgba(18,34,24,.985); opacity: 0; visibility: hidden; transform: translateY(-14px); transition: opacity .3s ease, transform .3s ease, visibility .3s; scrollbar-width: none; }
.menu-panel::-webkit-scrollbar { display: none; }
.menu-panel::before { content: ""; position: absolute; inset: 0; opacity: .07; background: var(--paper-pattern); pointer-events: none; }
.menu-panel.open { opacity: 1; visibility: visible; transform: none; }
.menu-shell { position: relative; z-index: 1; min-height: calc(100vh - 82px); display: grid; grid-template-columns: minmax(360px,.78fr) minmax(0,1.22fr); gap: clamp(40px,6vw,110px); padding: 76px 6vw 96px; }
.menu-copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.menu-kicker { margin: 0 0 25px; color: #b9c2b8; font-size: .61rem; letter-spacing: .37em; }
.menu-panel nav { width: 100%; display: grid; border-top: 1px solid rgba(255,255,255,.16); }
.menu-panel nav a { display: grid; grid-template-columns: 34px 1fr auto; gap: 14px; align-items: center; padding: 11px 2px; border-bottom: 1px solid rgba(255,255,255,.16); color: white; text-decoration: none; }
.menu-panel nav a > span { color: #ce8d67; font-size: .56rem; letter-spacing: .18em; }
.menu-panel nav strong { font: 500 clamp(2.25rem,4vw,4.25rem)/.9 Cormorant,serif; transition: color .2s, transform .2s; }
.menu-panel nav em { color: #97a39a; font-size: .64rem; font-style: normal; letter-spacing: .14em; text-transform: uppercase; }
.menu-panel nav a:hover strong { color: #df9b72; transform: translateX(8px); }
.menu-copy .primary-button { margin-top: 28px; }
.menu-gallery { min-width: 0; display: flex; gap: 10px; overflow: hidden; border-radius: 140px 24px 24px 24px; }
.menu-image { position: relative; flex: 1; min-width: 0; overflow: hidden; color: white; background: #263a2b; text-decoration: none; transition: flex .45s ease; }
.menu-image-main { flex: 1.25; }
.menu-image:hover { flex: 1.55; }
.menu-image::after { content: ""; position: absolute; inset: 42% 0 0; background: linear-gradient(transparent,rgba(5,15,8,.82)); }
.menu-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.menu-image:hover img { transform: scale(1.045); }
.menu-image span, .menu-image small { position: absolute; z-index: 2; left: 22px; }
.menu-image span { bottom: 43px; font: 500 2rem Cormorant,serif; }
.menu-image small { bottom: 23px; font-size: .54rem; letter-spacing: .28em; }
.menu-bottom { position: absolute; z-index: 3; right: 6vw; bottom: 23px; left: 6vw; display: flex; align-items: center; justify-content: space-between; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.16); color: #aab5ad; font-size: .75rem; }
.menu-bottom p { margin: 0; }
.menu-bottom a { color: white; text-decoration: none; }
.menu-socials { display: flex; gap: 9px; }
.menu-socials a { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.menu-socials img { width: 16px; filter: brightness(0) invert(1); }
.close-menu { position: absolute; z-index: 5; top: 23px; right: 31px; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; background: rgba(15,29,20,.45); cursor: pointer; }
.close-menu img { width: 34px; filter: brightness(0) invert(1); }

dialog { width: min(560px,calc(100% - 32px)); max-height: calc(100dvh - 24px); overflow: auto; overscroll-behavior: contain; padding: 45px; border: 0; border-radius: 30px; color: var(--ink); background: var(--cream) var(--paper-pattern) repeat; box-shadow: 0 30px 100px rgba(0,0,0,.3); }
dialog::backdrop { background: rgba(12,24,12,.72); backdrop-filter: blur(6px); }
dialog h2 { margin: 5px 0 12px; font: 500 3.5rem/.95 Cormorant, serif; }
.dialog-kicker { margin: 0; color: var(--muted); font-size: .65rem; letter-spacing: .3em; }
.dialog-close { position: absolute; top: 16px; right: 19px; width: 36px; height: 36px; border: 0; background: none; cursor: pointer; }
.dialog-close img { width: 25px; }
.booking-dialog form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 24px 0; }
.booking-dialog label { display: grid; gap: 7px; color: #626657; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; }
.booking-dialog input, .booking-dialog select { width: 100%; height: 46px; padding: 0 10px; border: 1px solid #c8c2b3; border-radius: 8px; color: var(--ink); background: white; }
.booking-dialog label:nth-child(3), .booking-dialog form .primary-button { grid-column: 1/-1; }
.booking-dialog small { color: var(--muted); }
.story-dialog .primary-button { margin-top: 16px; }

/* Shared long-page system */
.section-pad { position: relative; padding: 120px 0; }
.section-shell { width: min(100%, 1680px); margin: 0 auto; padding-inline: 5.3%; }
.section-kicker { margin: 0 0 18px; color: var(--terracotta); font-size: .66rem; font-weight: 600; letter-spacing: .34em; }
.section-heading { display: block; margin-bottom: 54px; }
.section-heading h2, .about-copy h2, .services-copy h2, .contact-copy h2, .booking-banner h2, .reviews-inner h2 { margin: 0; font: 500 clamp(3.4rem,5.4vw,5.9rem)/.86 Cormorant,serif; letter-spacing: -.035em; }
.section-heading.light { color: white; }
.section-heading.light .section-kicker { color: #d9ad7a; }
.heading-aside, .heading-copy { max-width: 480px; margin: 0; color: #667062; line-height: 1.75; }
.section-heading.light .heading-aside { color: #c8d0c5; }
.section-coda { display: grid; grid-template-columns: 1fr minmax(300px,500px); gap: 55px; align-items: start; margin-top: 48px; padding-top: 25px; border-top: 1px solid rgba(53,67,55,.28); }
.section-coda > span { color: #7c8479; font-size: .56rem; letter-spacing: .3em; }
.section-coda > p, .section-coda > div { width: 100%; max-width: 500px; justify-self: end; }
.section-coda p { margin: 0; color: #606a61; line-height: 1.7; }
.section-coda .outline-button { margin-top: 18px; }
.section-coda-light { border-color: rgba(255,255,255,.2); }
.section-coda-light > span, .section-coda-light p { color: #b9c5bc; }
.outline-button { min-height: 52px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 22px; padding: 0 23px; border: 1px solid #969b8f; border-radius: 28px; color: var(--ink); background: transparent; text-decoration: none; cursor: pointer; }
.outline-button.light { color: white; border-color: rgba(255,255,255,.45); }
.outline-button img { width: 18px; }
.outline-button.light img { filter: brightness(0) invert(1); }
.text-link { display: inline-flex; align-items: center; gap: 30px; margin-top: 27px; color: var(--ink); text-decoration: none; font-weight: 600; }
.text-link img { width: 20px; transition: transform .2s; }
.text-link:hover img { transform: translateX(5px); }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.reveal.in-view { opacity: 1; transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Story */
.about-section { overflow: hidden; background: var(--cream) var(--paper-pattern) repeat; }
.about-leaf { position: absolute; left: -155px; bottom: -250px; width: 430px; opacity: .55; }
.about-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; align-items: center; }
.about-copy { position: relative; z-index: 2; max-width: 580px; }
.about-copy .section-intro { margin: 34px 0 18px; color: #374238; font-size: 1.22rem; line-height: 1.75; }
.about-copy > p:not(.section-kicker,.section-intro) { color: #687067; line-height: 1.85; }
.about-visual { position: relative; min-height: 660px; }
.about-visual figure { margin: 0; overflow: hidden; }
.about-photo-main { position: absolute; top: 0; right: 0; width: 73%; height: 535px; border-radius: 180px 34px 160px 34px; }
.about-photo-main img, .about-photo-small img { width: 100%; height: 100%; object-fit: cover; }
.about-photo-small { position: absolute; left: 0; bottom: 0; width: 42%; height: 330px; border: 13px solid var(--cream); border-radius: 110px 25px 90px 25px; }
.about-visual blockquote { position: absolute; right: 0; bottom: 4px; width: 52%; margin: 0; color: var(--forest); font: 2.1rem/1.05 Allura,cursive; }
.vertical-label { position: absolute; right: -34px; top: 115px; color: #737867; font-size: .58rem; letter-spacing: .3em; writing-mode: vertical-rl; }

/* Rooms */
.rooms-section { overflow: hidden; color: white; background: #1d3026; }
.rooms-section::before { content: ""; position: absolute; inset: 0; opacity: .13; background: var(--paper-pattern); mix-blend-mode: screen; }
.rooms-weave { position: absolute; right: -140px; top: -110px; width: 520px; opacity: .38; filter: brightness(1.35); }
.rooms-section .section-shell { position: relative; z-index: 1; }
.room-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.room-card { overflow: hidden; border-radius: 150px 150px 24px 24px; background: #f4efe4; color: var(--ink); }
.room-image { position: relative; height: 330px; overflow: hidden; }
.room-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.room-card:hover .room-image img { transform: scale(1.04); }
.room-image span { position: absolute; right: 18px; bottom: 18px; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; color: white; background: rgba(23,39,31,.88); font-size: .65rem; box-shadow: 0 5px 18px rgba(0,0,0,.18); }
.room-body { padding: 28px 28px 30px; }
.room-type { margin: 0; color: var(--terracotta); font-size: .6rem; letter-spacing: .28em; }
.room-body h3 { margin: 10px 0 7px; font: 500 2rem/1 Cormorant,serif; }
.room-body > p:not(.room-type) { min-height: 52px; color: #687067; font-size: .88rem; line-height: 1.6; }
.room-body a { display: flex; align-items: center; justify-content: space-between; padding-top: 18px; border-top: 1px solid #d8d3c8; color: var(--ink); text-decoration: none; font-size: .83rem; font-weight: 600; }
.room-body a img { width: 18px; }

/* Services */
.services-section { overflow: hidden; background: var(--cream) var(--paper-pattern) repeat; }
.services-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; }
.services-photo { position: relative; height: 720px; overflow: hidden; border-radius: 260px 38px 220px 38px; }
.services-photo > img { width: 100%; height: 100%; object-fit: cover; }
.services-photo-note { position: absolute; right: 22px; bottom: 22px; width: 235px; padding: 28px; border-radius: 90px 18px 75px 18px; color: white; background: rgba(45,64,49,.94); }
.services-photo-note span { font-size: .55rem; letter-spacing: .25em; }
.services-photo-note strong { display: block; margin-top: 8px; font: 500 1.9rem/.95 Cormorant,serif; }
.services-copy { max-width: 650px; }
.service-list { margin-top: 42px; border-top: 1px solid #cfc9ba; }
.service-list article { display: grid; grid-template-columns: 36px 42px 1fr; gap: 18px; align-items: start; padding: 21px 0; border-bottom: 1px solid #cfc9ba; }
.service-list article > span { color: var(--terracotta); font-size: .63rem; }
.service-list article > img { width: 25px; }
.service-list h3 { margin: -4px 0 4px; font: 500 1.55rem/1 Cormorant,serif; }
.service-list p { margin: 0; color: #687067; font-size: .85rem; line-height: 1.55; }

/* Facilities */
.facilities-section { background: #e8e9df; }
.facility-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 65px; align-items: center; }
.facility-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.facility-grid article { min-height: 180px; padding: 28px 28px 24px 0; border-top: 1px solid #b9bdb1; }
.facility-grid article:nth-child(odd) { border-right: 1px solid #b9bdb1; }
.facility-grid article:nth-child(even) { padding-left: 28px; }
.facility-grid article > img { width: 27px; height: 27px; }
.facility-grid h3 { margin: 15px 0 6px; font: 500 1.55rem Cormorant,serif; }
.facility-grid p { max-width: 250px; margin: 0; color: #697068; font-size: .82rem; line-height: 1.55; }
.facility-photo { position: relative; height: 620px; margin: 0; overflow: hidden; border-radius: 48% 48% 24px 24px; }
.facility-photo img { width: 100%; height: 100%; object-fit: cover; }
.facility-photo figcaption { position: absolute; right: 22px; bottom: 20px; padding: 12px 18px; border-radius: 22px; color: white; background: rgba(28,46,36,.85); font-size: .55rem; letter-spacing: .25em; }

/* Gallery */
.gallery-section { color: white; background: #17231c; }
.gallery-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); grid-template-rows: 230px 210px 180px; gap: 12px; }
.gallery-tile { position: relative; overflow: hidden; padding: 0; border: 0; border-radius: 24px; color: white; background: #26362c; cursor: pointer; }
.gallery-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.gallery-tile:hover > img { transform: scale(1.035); }
.gallery-feature { grid-column: 1 / 8; grid-row: 1 / 3; border-radius: 180px 24px 24px 24px; }
.gallery-room { grid-column: 8 / 10; grid-row: 1; }
.gallery-table { grid-column: 10 / 13; grid-row: 1; }
.gallery-garden { grid-column: 8 / 13; grid-row: 2; }
.gallery-wide { grid-column: 1 / 8; grid-row: 3; }
.gallery-count { grid-column: 8 / 13; grid-row: 3; }
.gallery-tile::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent,rgba(0,0,0,.62)); }
.gallery-tile small { position: absolute; z-index: 2; left: 18px; bottom: 16px; letter-spacing: .25em; }
.tile-play { position: absolute; z-index: 2; inset: 50% auto auto 50%; transform: translate(-50%,-50%); display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-radius: 28px; background: rgba(19,34,25,.78); }
.tile-play img { width: 17px; filter: brightness(0) invert(1); }
.gallery-count span { position: absolute; z-index: 2; inset: 50% auto auto 50%; transform: translate(-50%,-50%); font: 500 3rem Cormorant,serif; }

/* Property family */
.properties-section { overflow: hidden; background: var(--cream) var(--paper-pattern) repeat; }
.property-grid { display: grid; grid-template-columns: 1.25fr .8fr .8fr; gap: 18px; }
.property-card { position: relative; min-height: 520px; overflow: hidden; border-radius: 28px; }
.property-card.live > img { width: 100%; height: 100%; object-fit: cover; }
.property-card.live::after { content: ""; position: absolute; inset: 30% 0 0; background: linear-gradient(transparent,rgba(13,27,18,.85)); }
.property-card > div { position: absolute; z-index: 2; right: 30px; bottom: 30px; left: 30px; color: white; }
.property-card span, .property-card small { font-size: .58rem; letter-spacing: .26em; }
.property-card h3 { margin: 10px 0 2px; font: 500 2.7rem/.95 Cormorant,serif; }
.property-card p { margin: 0 0 20px; }
.property-card a { display: flex; align-items: center; justify-content: space-between; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.45); color: white; text-decoration: none; }
.property-card a img { width: 20px; filter: brightness(0) invert(1); }
.property-card.coming { color: var(--ink); background: #dbe0d1; }
.property-card.coming.warm { background: #c96b49; }
.property-card.coming > img { position: absolute; width: 115%; height: 115%; object-fit: contain; opacity: .75; }
.property-card.coming > div { color: var(--ink); }
.property-card.coming.warm > div { color: white; }
.property-card.coming small { display: block; margin-top: 55px; }

/* Reviews */
.reviews-section { isolation: isolate; overflow: hidden; padding-block: 145px; background: #aeb9a4; }
.reviews-section::before, .reviews-section::after { content: ""; position: absolute; z-index: 0; background: url('assets/decor/leaf-watermark.svg') center / contain no-repeat; opacity: .22; pointer-events: none; }
.reviews-section::before { left: -78px; bottom: -155px; width: 520px; height: 600px; transform: rotate(16deg); opacity: .78; }
.reviews-section::after { top: -92px; right: -62px; width: 440px; height: 540px; transform: scaleX(-1) rotate(-12deg); opacity: .6; }
.reviews-inner { max-width: 1000px; position: relative; z-index: 1; text-align: center; }
.review-quote { width: 75px; opacity: .18; }
.reviews-inner h2 { margin-top: 12px; }
.review-placeholder { max-width: 660px; margin: 30px auto; color: #374339; font-size: 1.12rem; line-height: 1.8; }
.review-actions { display: flex; align-items: center; justify-content: center; gap: 28px; }

/* Contact */
.contact-section { min-height: 870px; overflow: hidden; }
.contact-photo { position: absolute; inset: 0; }
.contact-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(16,34,22,.72),rgba(16,34,22,.16)); }
.contact-photo img { width: 100%; height: 100%; object-fit: cover; }
.contact-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .8fr 1.2fr; gap: 9vw; align-items: center; }
.contact-copy { color: white; }
.contact-copy p:not(.section-kicker) { max-width: 500px; margin: 28px 0; line-height: 1.8; }
.contact-copy > a, .contact-copy > span { display: flex; align-items: center; gap: 13px; margin: 13px 0; color: white; text-decoration: none; }
.contact-copy img { width: 20px; filter: brightness(0) invert(1); }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; padding: 48px; border-radius: 80px 20px 80px 20px; background: var(--cream) var(--paper-pattern) repeat; }
.contact-form label { display: block; margin-bottom: 8px; color: #676d63; font-size: .65rem; letter-spacing: .16em; text-transform: uppercase; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid #bdb8aa; outline: 0; color: var(--ink); background: transparent; resize: vertical; }
.contact-form .full, .contact-form .primary-button, .contact-form .form-status { grid-column: 1/-1; }
.contact-form .primary-button { justify-self: start; margin-top: 5px; }
.form-status { min-height: 20px; margin: 0; color: #4c684e; font-size: .82rem; }

/* Booking banner */
.booking-banner { position: relative; min-height: 390px; display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; overflow: hidden; padding: 70px 7%; color: white; background: #31482f; }
.booking-banner > img { position: absolute; top: -290px; left: -130px; width: 800px; opacity: .42; }
.booking-banner > div { position: relative; z-index: 1; }
.booking-banner .section-kicker { color: #e7b17f; }
.booking-banner-actions { display: flex; align-items: center; justify-content: flex-end; gap: 28px; }
.booking-banner-actions > a { color: white; }

/* Large footer */
.site-footer { position: relative; overflow: hidden; padding: 95px 6% 28px; color: #d9dfd7; background: #101a14; }
.footer-weave { position: absolute; inset: 0 0 auto; height: 10px; background: repeating-linear-gradient(90deg,#bd6c49 0 12px,#d3a06d 12px 24px,#53634a 24px 36px); }
.footer-leaf { position: absolute; right: -90px; bottom: -250px; width: 470px; opacity: .16; filter: brightness(1.7); }
.footer-top { position: relative; z-index: 1; display: grid; grid-template-columns: 1.6fr repeat(4,1fr); gap: 55px; padding-bottom: 70px; }
.footer-brand > span { display: block; color: white; font: 500 3.3rem/.9 Cormorant,serif; }
.footer-brand > small { letter-spacing: .35em; }
.footer-brand p { max-width: 360px; margin-top: 25px; color: #99a49c; line-height: 1.75; }
.site-footer h3 { margin: 0 0 20px; color: white; font: 500 1.35rem Cormorant,serif; }
.site-footer nav a, .footer-contact > a { display: block; margin: 11px 0; color: #aab4ac; text-decoration: none; font-size: .84rem; }
.footer-contact p { color: #aab4ac; }
.socials { display: flex; gap: 10px; margin-top: 24px; }
.socials a { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid #48534c; border-radius: 50%; }
.socials img { width: 17px; filter: brightness(0) invert(1); }
.footer-newsletter { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: end; padding: 38px 0; border-top: 1px solid #334038; border-bottom: 1px solid #334038; }
.footer-newsletter h3 { margin-bottom: 5px; font-size: 2rem; }
.footer-newsletter p { margin: 0; color: #93a096; }
.footer-newsletter form { position: relative; display: flex; align-items: center; }
.footer-newsletter input { width: 100%; padding: 16px 55px 16px 0; border: 0; border-bottom: 1px solid #78837b; outline: 0; color: white; background: transparent; }
.footer-newsletter button { position: absolute; right: 0; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--terracotta); }
.footer-newsletter button img { width: 18px; filter: brightness(0) invert(1); }
.footer-newsletter .form-status { position: absolute; top: 52px; color: #c8d6ca; }
.footer-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 25px; padding-top: 27px; color: #7d8980; font-size: .75rem; }
.footer-bottom p { margin: 0; }
.footer-bottom div { display: flex; gap: 24px; }
.footer-bottom a { color: inherit; text-decoration: none; }
.back-to-top { width: 48px; height: 48px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid #566159; border-radius: 50%; transition: background .2s, border-color .2s; }
.back-to-top:hover { border-color: #ce8a62; background: #26372c; }
.back-to-top img { width: 19px; filter: brightness(0) invert(1); transform: rotate(-90deg); }

/* Full-screen video and image gallery */
.media-viewer { position: fixed; inset: 0; z-index: 100; display: none; width: 100%; height: 100dvh; overflow: hidden; color: white; background: #080c09; }
.media-viewer.open { display: block; }
.viewer-header { height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; border-bottom: 1px solid #2e3530; }
.viewer-header > div { display: flex; gap: 18px; align-items: baseline; }
.viewer-header strong { font: 500 1.8rem Cormorant,serif; letter-spacing: .08em; }
.viewer-header span { color: #8f9991; font-size: .58rem; letter-spacing: .27em; }
.viewer-header p { margin-left: auto; margin-right: 35px; color: #8f9991; }
.viewer-header p span { color: white; font-size: 1rem; }
.viewer-header button { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #445047; border-radius: 50%; background: transparent; }
.viewer-header button img { width: 21px; filter: brightness(0) invert(1); }
.viewer-layout { height: calc(100vh - 78px); display: grid; grid-template-columns: 54px minmax(0,1fr) 54px minmax(220px,260px); gap: 12px; align-items: center; padding: 16px; }
.viewer-stage { position: relative; height: 100%; min-height: 0; display: grid; grid-template-rows: minmax(0,1fr) auto; place-items: center; overflow: hidden; border-radius: 12px; background: #111612; }
.viewer-stage video, .viewer-stage > img { max-width: 100%; max-height: calc(100vh - 235px); object-fit: contain; }
.viewer-stage > img { display: none; }
.viewer-caption { position: static; width: 100%; padding: 17px 24px 19px; background: #101711; pointer-events: none; }
.viewer-caption span { color: #d3a06d; font-size: .58rem; letter-spacing: .3em; }
.viewer-caption h2 { margin: 5px 0 2px; font: 500 2rem Cormorant,serif; }
.viewer-caption p { margin: 0; color: #bac1bc; font-size: .8rem; }
.viewer-arrow { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #3d473f; border-radius: 50%; background: transparent; }
.viewer-arrow img { width: 22px; filter: brightness(0) invert(1); }
.viewer-playlist { width: 100%; height: 100%; min-width: 0; display: grid; align-content: start; gap: 9px; overflow-y: auto; padding-right: 2px; scrollbar-width: none; }
.viewer-playlist::-webkit-scrollbar { display: none; }
.playlist-item { display: grid; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; padding: 6px; border: 1px solid transparent; border-radius: 9px; color: white; background: transparent; text-align: left; cursor: pointer; }
.playlist-item.active { border-color: #b17552; background: #192019; }
.playlist-item img { width: 78px; height: 52px; object-fit: cover; border-radius: 5px; }
.playlist-item span { font-size: .73rem; line-height: 1.3; }
.playlist-item small { display: block; margin-top: 3px; color: #89928b; font-size: .56rem; letter-spacing: .16em; }
.site-toast { position: fixed; right: 22px; bottom: 22px; z-index: 120; padding: 12px 16px; border-radius: 12px; color: white; background: #203228; opacity: 0; transform: translateY(10px); transition: .2s; pointer-events: none; }
.site-toast.show { opacity: 1; transform: none; }

@media (max-width: 1280px) {
  .brand { width: 330px; height: 154px; }
  .brand-leaf { width: 78px; height: 40px; }
  .brand-name { font-size: 2.45rem; }
  .desktop-nav { left: 34%; gap: 34px; }
  .header-cta { right: 112px; padding-inline: 24px; }
  .menu-button { right: 34px; }
  .hero-copy { left: 4.8%; }
  .hero-copy h1 { font-size: clamp(5.5rem,8vw,6.6rem); }
  .hero-rail { display: none; }
  .experiences { gap: 18px; }
  .card-copy { width: 84%; }
  .room-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .footer-top { grid-template-columns: 1.4fr repeat(2,1fr); gap: 40px; }
}

@media (max-width: 1100px) {
  .section-pad { padding: 88px 0; }
  .header-cta { display: none; }
  .desktop-nav { left: 36%; gap: 28px; }
  .hero-leaf-mark { display: none; }
  .about-grid, .services-grid, .facility-layout, .contact-grid { gap: 48px; }
  .property-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .property-card.live { grid-column: span 2; }
  .section-coda { grid-template-columns: 1fr minmax(280px,440px); }

  .gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: 340px 220px 220px 180px; }
  .gallery-feature { grid-column: 1 / 3; grid-row: 1; border-radius: 120px 24px 24px 24px; }
  .gallery-room { grid-column: 1; grid-row: 2; }
  .gallery-table { grid-column: 2; grid-row: 2; }
  .gallery-garden { grid-column: 1; grid-row: 3; }
  .gallery-wide { grid-column: 2; grid-row: 3; }
  .gallery-count { grid-column: 1 / 3; grid-row: 4; }

  .menu-shell { grid-template-columns: minmax(310px,.8fr) minmax(0,1.2fr); gap: 40px; padding-inline: 4vw; }
  .menu-panel nav strong { font-size: clamp(2rem,4vw,3.2rem); }
  .menu-panel nav em { display: none; }
  .menu-panel nav a { grid-template-columns: 30px 1fr; }
  .menu-bottom { right: 4vw; left: 4vw; }

  .viewer-layout { grid-template-columns: 48px minmax(0,1fr) 48px 220px; gap: 8px; padding: 12px; }
  .playlist-item { grid-template-columns: 64px 1fr; }
  .playlist-item img { width: 64px; height: 46px; }
}

@media (max-width: 860px) {
  .site-header { position: fixed; height: 72px; }
  .brand { width: 224px; height: 108px; align-items: flex-start; padding: 8px 0 0 24px; }
  .brand-leaf { width: 53px; height: 28px; margin-left: 42px; }
  .brand-name { font-size: 1.86rem; }
  .brand-sub { margin: 4px 0 0 40px; font-size: .42rem; }
  .brand-location { margin: 5px 0 0 22px; font-size: .43rem; letter-spacing: .3em; }
  .desktop-nav, .header-cta { display: none; }
  .menu-button { top: 16px; right: 17px; }

  .hero { height: 700px; }
  .hero-photo { inset: 72px 0 0; height: 628px; object-position: 52% center; }
  .hero-shade { inset: 72px 0 0; background: linear-gradient(0deg,rgba(8,21,10,.8),rgba(8,21,10,.08) 72%); }
  .foreground-foliage-left { top: 72px; left: -182px; width: 520px; height: 450px; opacity: .62; }
  .foreground-foliage-right { top: 235px; right: -112px; left: auto; width: 460px; height: 390px; opacity: .5; }
  .hero-copy { top: auto; right: 24px; bottom: 62px; left: 24px; }
  .hero-copy h1 { font-size: clamp(4.4rem,15vw,6.4rem); }
  .hero-script { margin-top: 20px; font-size: clamp(2rem,7vw,3rem); }
  .hero-line { font-size: 1rem; }
  .hero-organic-frame, .hero-rail, .hero-leaf-mark { display: none; }

  .experiences { min-height: auto; grid-template-columns: 1fr; gap: 18px; padding: 24px 22px 78px; }
  .experience-card { height: 275px; }
  .side-caption { display: none; }
  .footer-motto { width: 90%; justify-content: center; white-space: normal; text-align: center; line-height: 1.8; }
  .footer-motto i { display: none; }

  .section-pad { padding: 70px 0; }
  .section-shell { padding-inline: 24px; }
  .about-grid, .services-grid, .facility-layout, .contact-grid { grid-template-columns: 1fr; gap: 38px; }
  .about-copy, .services-copy { max-width: none; }
  .about-visual { min-height: 580px; }
  .services-photo { height: 580px; }
  .facility-photo { height: 510px; }
  .contact-section { min-height: 0; }
  .contact-grid { align-items: stretch; }
  .contact-form { grid-template-columns: 1fr; padding: 38px; }
  .contact-form .full, .contact-form .primary-button, .contact-form .form-status { grid-column: auto; }
  .contact-form input, .contact-form select, .contact-form textarea { min-width: 0; font-size: 16px; }
  .section-coda { grid-template-columns: 1fr; gap: 18px; }
  .section-coda > p, .section-coda > div { justify-self: start; }

  .booking-banner { min-height: 0; grid-template-columns: 1fr; gap: 28px; padding: 58px 24px; }
  .booking-banner-actions { justify-content: flex-start; }
  .site-footer { padding: 70px 24px 24px; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 34px 24px; padding-bottom: 48px; }
  .footer-brand, .footer-contact { grid-column: 1 / -1; }
  .footer-newsletter { grid-template-columns: 1fr; gap: 25px; }
  .footer-newsletter form, .footer-newsletter input { min-width: 0; }
  .footer-newsletter .form-status { position: static; align-self: center; margin-top: 8px; }

  dialog { width: min(540px,calc(100% - 24px)); max-height: calc(100dvh - 20px); padding: 40px 30px 30px; border-radius: 24px; }
  dialog h2 { padding-right: 32px; font-size: clamp(2.45rem,8vw,3.2rem); }
  .booking-dialog form { grid-template-columns: 1fr; }
  .booking-dialog label:nth-child(3), .booking-dialog form .primary-button { grid-column: auto; }
  .booking-dialog input, .booking-dialog select { min-width: 0; font-size: 16px; }

  .menu-shell { min-height: auto; grid-template-columns: 1fr; gap: 28px; padding: 66px 24px 95px; }
  .menu-copy .primary-button { display: none; }
  .menu-kicker { margin-bottom: 15px; }
  .menu-panel nav a { padding: 7px 0; }
  .menu-panel nav strong { font-size: clamp(2rem,7vw,3rem); }
  .menu-gallery { height: 190px; border-radius: 70px 16px 16px 16px; }
  .menu-image span { bottom: 34px; left: 14px; font-size: 1.35rem; }
  .menu-image small { bottom: 18px; left: 14px; }
  .menu-bottom { right: 24px; bottom: 18px; left: 24px; }

  .viewer-header { height: 68px; min-width: 0; padding: 0 16px; }
  .viewer-header > div { min-width: 0; }
  .viewer-header strong { white-space: nowrap; }
  .viewer-header button { flex: 0 0 auto; }
  .viewer-header p { margin-right: 15px; }
  .viewer-layout { position: relative; height: calc(100dvh - 68px); grid-template-columns: 46px minmax(0,1fr) 46px; gap: 7px; padding: 10px; }
  .viewer-playlist { display: none; }
  .viewer-stage video, .viewer-stage > img { max-height: calc(100dvh - 220px); }

  .site-toast { right: 12px; bottom: 12px; left: 12px; text-align: center; }
}

@media (max-width: 600px) {
  .brand { width: 194px; height: 96px; padding: 8px 0 0 18px; }
  .brand-leaf { width: 46px; height: 24px; margin-left: 38px; }
  .brand-name { font-size: 1.65rem; }
  .brand-sub { margin-left: 34px; }
  .brand-location { display: none; }
  .hero { height: 720px; }
  .hero-photo { height: 648px; object-position: 46% center; }
  .hero-copy { right: 20px; bottom: 54px; left: 20px; }
  .hero-copy h1 { font-size: 4.15rem; }
  .hero-script { font-size: 2.05rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
  .primary-button { min-width: 0; width: min(100%,280px); }
  .foreground-foliage-left { top: 72px; left: -205px; width: 475px; height: 420px; opacity: .58; }
  .foreground-foliage-right { top: 330px; right: -118px; left: auto; width: 420px; height: 350px; opacity: .46; }

  .experience-card { height: 242px; }
  .card-copy { width: 88%; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .about-copy h2, .services-copy h2, .contact-copy h2, .booking-banner h2, .reviews-inner h2 { font-size: clamp(2.9rem,14vw,4.2rem); }
  .room-grid, .property-grid, .contact-form { grid-template-columns: 1fr; }
  .property-card.live { grid-column: auto; }
  .room-image { height: 290px; }
  .about-visual { min-height: 500px; }
  .about-photo-main { width: 88%; height: 400px; }
  .about-photo-small { width: 48%; height: 230px; }
  .about-visual blockquote { width: 60%; font-size: 1.75rem; }
  .vertical-label { display: none; }
  .services-photo { height: 500px; }
  .services-photo-note { width: 200px; padding: 22px; }
  .facility-grid { grid-template-columns: 1fr 1fr; }
  .facility-grid article { min-height: 165px; padding: 22px 16px 20px 0; }
  .facility-grid article:nth-child(even) { padding-left: 16px; }
  .facility-photo { height: 400px; }
  .contact-form { padding: 29px 22px; border-radius: 50px 16px 50px 16px; }
  .contact-form .full, .contact-form .primary-button, .contact-form .form-status { grid-column: auto; }

  .gallery-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 270px 165px 165px 145px; gap: 9px; }
  .gallery-feature { grid-column: 1 / 3; grid-row: 1; border-radius: 90px 18px 18px 18px; }
  .gallery-room { grid-column: 1; grid-row: 2; }
  .gallery-table { grid-column: 2; grid-row: 2; }
  .gallery-garden { grid-column: 1; grid-row: 3; }
  .gallery-wide { grid-column: 2; grid-row: 3; }
  .gallery-count { grid-column: 1 / 3; grid-row: 4; }
  .tile-play { font-size: .72rem; }

  .reviews-section { padding-block: 92px; }
  .review-actions { justify-content: center; }
  .booking-banner .primary-button { width: 100%; }
  .footer-bottom { align-items: flex-start; flex-wrap: wrap; }
  .footer-bottom div { order: 3; width: 100%; flex-wrap: wrap; gap: 10px 18px; }
  .back-to-top { margin-left: auto; }

  .menu-shell { padding-inline: 18px; }
  .menu-panel nav em { display: none; }
  .menu-gallery { height: 155px; }
  .menu-image:not(.menu-image-main) span { font-size: 1.05rem; }
  .menu-bottom { right: 18px; left: 18px; }
  .menu-bottom p { max-width: 210px; line-height: 1.5; }
  .close-menu { top: 15px; right: 16px; }

  .viewer-header > div span, .viewer-header > p { display: none; }
  .viewer-layout { grid-template-columns: 38px minmax(0,1fr) 38px; padding: 7px; }
  .viewer-arrow { width: 38px; height: 38px; }
  .viewer-caption { padding: 14px 16px 16px; }
  .viewer-caption h2 { font-size: 1.55rem; }
  .viewer-caption p { font-size: .72rem; }
  .booking-dialog { padding: 38px 22px 26px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .foreground-foliage { animation: none; }
  .experience-card > img, .menu-panel, .menu-image, .menu-image img, .reveal { transition: none; }
}

/* Enquiry forms, 2026-09-18 ------------------------------------------------
   The booking dialog now asks for a name and contact details as well as
   dates, and both forms carry a hidden trap field for spam robots. The
   original rules placed the dialog's fields by position (nth-child), which
   the new fields would have thrown off, so the layout is stated outright. */
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.booking-dialog form label:nth-child(3) { grid-column: auto; }
.booking-dialog form .primary-button,
.booking-dialog form .form-status { grid-column: 1 / -1; }
.booking-dialog .form-status { min-height: 18px; margin: 0; color: #4c684e; font-size: .82rem; }
.booking-dialog form label input { width: 100%; }

/* The hotel's own logo, 2026-09-18 ------------------------------------------
   Replaces the drawn leaf and set type that stood in for it. The logo file is
   transparent, so it sits on the cream plaque in the header and on the dark
   footer alike. Sizes follow the plaque at each breakpoint. */
.brand > .brand-logo { position: relative; z-index: 2; display: block; width: auto; height: 116px; margin-top: 4px; }
.brand-location { margin-top: 6px; }
.footer-logo { display: block; width: auto; height: 104px; margin-bottom: 14px; }
.menu-logo { display: block; width: auto; height: 86px; margin-bottom: 18px; }
@media (max-width: 1280px) { .brand > .brand-logo { height: 104px; } }
@media (max-width: 860px) { .brand > .brand-logo { height: 72px; margin: 0 0 0 30px; } }
@media (max-width: 600px) {
  .brand > .brand-logo { height: 62px; margin-left: 24px; }
  .footer-logo { height: 84px; }
  .menu-logo { height: 64px; }
}

/* Anything the Website app hides stays hidden, even where a rule above sets
   display (the social icons are display: grid, which beat [hidden]). */
[hidden] { display: none !important; }

/* The side rail only clears the photo's curved edge on very wide screens;
   below that the curve cuts through its words, so it is left out. */
@media (max-width: 1500px) { .hero-rail { display: none; } }

/* Live availability from the hotel system. */
.room-live { margin: 6px 0 10px; color: #4c684e; font-size: .78rem; font-weight: 600; letter-spacing: .02em; }
.room-live:empty { display: none; }
.room-live.is-full { color: #a0442f; }
.booking-dialog form label.full { grid-column: 1 / -1; }

/* Developer credit (footer) */
.footer-bottom .site-credit a { text-decoration: underline; text-underline-offset: 3px; }
.footer-bottom .site-credit a:hover { color: #e8efe9; }

/* Full width on phones (21 Oct 2026): leaves and weaves that hang past the
   edge must never widen the page — a wider page leaves a strip on the right
   of every section. */
html, body { max-width: 100%; overflow-x: clip; }
main > section, .site-footer, .booking-banner, .hero { overflow-x: clip; }

/* The menu's three photos, each an arch of its own, and the ways to reach
   the hotel under them (21 Oct 2026). */
.menu-gallery { border-radius: 0; overflow: visible; gap: 12px; }
.menu-image { border-radius: 999px 999px 22px 22px; }
.menu-image-main { flex: 1; }
.menu-social { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px; align-self: start; }
.menu-social a { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; transition: background .2s, border-color .2s; }
.menu-social a:hover { background: rgba(255,255,255,.1); border-color: #df9b72; }
.menu-social img { width: 19px; height: 19px; filter: brightness(0) invert(1); }
@media (max-width: 860px) {
  .menu-social { grid-column: auto; justify-content: space-between; gap: 6px; }
  .menu-social a { width: 48px; height: 48px; }
  .menu-gallery { height: 210px; }
  .menu-image span { bottom: 32px; left: 0; right: 0; text-align: center; }
  .menu-image small { left: 0; right: 0; text-align: center; }
}
/* Buttons keep their words on one line on phones (21 Oct 2026). */
@media (max-width: 600px) { .primary-button { white-space: nowrap; font-size: .95rem; gap: 12px; } }