
:root {
  --ink: #07150f;
  --ink-soft: #0d2018;
  --paper: #0b1d15;
  --paper-2: #12281d;
  --wood: #bb9558;
  --wood-light: #d3b06c;
  --sand: #e6dcc9;
  --line: rgba(222, 207, 177, .16);
  --white: #f5eee0;
  --radius: 26px;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}


* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--white);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
body::selection { background: var(--wood-light); color: var(--ink); }
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }

.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 999;
  opacity: .035; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E");
}
.scroll-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 1001; }
.scroll-progress span { display: block; height: 100%; width: 0; background: var(--wood-light); }

.site-header {
  position: fixed; z-index: 50; top: 0; left: 0; width: 100%;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 20px clamp(20px, 4vw, 64px); color: #fff;
  transition: background .25s ease, backdrop-filter .25s ease, box-shadow .25s ease, padding .25s ease;
}
body.scrolled .site-header { background: rgba(5,14,10,.72); backdrop-filter: blur(16px); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.brand { width: 128px; height: 54px; overflow: hidden; display: flex; align-items: center; }
.brand img { width: 132px; filter: brightness(1.25); }
.desktop-nav { display: flex; gap: 30px; align-items: center; }
.desktop-nav a { font-size: 13px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; opacity: .8; transition: opacity .2s ease, color .2s ease; }
.desktop-nav a:hover { opacity: 1; color: var(--wood-light); }
.nav-cta { justify-self: end; border: 1px solid rgba(211,176,108,.75); background: rgba(211,176,108,.14); color: var(--wood-light); border-radius: 999px; padding: 12px 20px; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; backdrop-filter: blur(10px); transition: .25s ease; }
.nav-cta:hover { background: var(--wood-light); color: var(--ink); }
.menu-toggle { display: none; background: transparent; border: 0; width: 42px; height: 42px; padding: 10px; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 6px 0; background: #fff; }
.mobile-menu { display: none; }

.hero { min-height: 100svh; position: relative; overflow: hidden; background: #020806; color: #fff; }
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.015); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,11,8,.74) 0%, rgba(4,11,8,.42) 40%, rgba(4,11,8,.18) 100%), linear-gradient(0deg, rgba(4,11,8,.76) 0%, rgba(4,11,8,.12) 45%); }
.hero-glow { position: absolute; width: 55vw; height: 55vw; border-radius: 50%; left: -25vw; top: 25vh; background: rgba(211,176,108,.10); filter: blur(90px); }
.hero-copy { position: relative; z-index: 3; padding: 24vh clamp(22px, 7vw, 110px) 0; max-width: min(56vw, 780px); }
.eyebrow, .section-kicker { font-size: 11px; letter-spacing: .24em; font-weight: 700; text-transform: uppercase; }
.eyebrow { color: rgba(230,220,201,.8); }
.hero h1, h2, h3 { font-family: var(--serif); font-weight: 400; }
.hero h1 { margin: 18px 0 18px; max-width: 900px; font-size: clamp(60px, 8vw, 126px); line-height: .9; letter-spacing: -.055em; text-wrap: balance; }
.hero h1 em, h2 em { color: var(--wood-light); font-style: italic; }
.hero-lead { max-width: 610px; margin: 0 0 30px; font-size: clamp(16px, 1.55vw, 21px); line-height: 1.68; color: rgba(255,255,255,.82); }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.button { border: 0; border-radius: 999px; padding: 14px 22px; min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--wood-light); color: #17120e; box-shadow: 0 14px 40px rgba(211,176,108,.18); }
.button-primary:hover { background: #dfbb95; }
.button-ghost { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.18); color: #fff; backdrop-filter: blur(12px); }
.play-dot { font-size: 10px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.12); }
.hero-meta { position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; background: linear-gradient(90deg, rgba(13,31,22,.92), rgba(20,47,32,.82)); border-top: 1px solid rgba(211,176,108,.16); }
.hero-meta div { min-width: 0; padding: 26px 32px; border-left: 1px solid rgba(211,176,108,.12); }
.hero-meta div:first-child { border-left: 0; }
.hero-meta strong { display: block; font-family: var(--serif); font-size: clamp(28px, 3vw, 44px); color: var(--wood-light); font-weight: 400; }
.hero-meta span { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .18em; color: rgba(245,238,224,.75); margin-top: 7px; }
.scroll-cue { position: absolute; z-index: 3; bottom: 132px; right: clamp(22px, 7vw, 110px); display: flex; align-items: center; gap: 10px; font-size: 9px; letter-spacing: .22em; color: rgba(255,255,255,.55); }
.scroll-cue span { width: 34px; height: 1px; background: rgba(255,255,255,.42); }

.hero-showcase {
  position: absolute;
  z-index: 2;
  right: clamp(24px, 6vw, 96px);
  top: 15vh;
  width: min(34vw, 490px);
  height: min(68vh, 760px);
  pointer-events: none;
}
.hero-card {
  position: absolute;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.34);
  border: 1px solid rgba(211,176,108,.18);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(10px);
}
.hero-card img { width: 100%; height: 100%; object-fit: cover; }
.hero-card-main { inset: 6% 14% 10% 0; }
.hero-card-top { width: 38%; aspect-ratio: 1/1.3; top: 0; right: 3%; }
.hero-card-bottom { width: 34%; aspect-ratio: 1/1; bottom: 0; right: 0; }
.aframe-card { clip-path: polygon(50% 0%, 100% 18%, 100% 100%, 0 100%, 0 18%); border-radius: 28px; }
.triangle-card { clip-path: polygon(50% 0%, 100% 100%, 0 100%); }
.diamond-card { clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0 50%); }

.floating-nav {
  position: fixed;
  top: 96px;
  right: 22px;
  z-index: 90;
  display: grid;
  gap: 10px;
}
.floating-arrow, .floating-fab {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(211,176,108,.28);
  background: rgba(8,23,16,.74);
  color: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 16px 45px rgba(0,0,0,.18);
  backdrop-filter: blur(14px);
  transition: transform .2s ease, background .2s ease, opacity .2s ease;
}
.floating-arrow { cursor: pointer; font-size: 22px; }
.floating-arrow:hover:not(:disabled), .floating-fab:hover { transform: translateY(-2px); background: rgba(196,154,115,.82); color: var(--ink); }
.floating-arrow:disabled { opacity: .28; cursor: default; }
.floating-actions {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 90;
  display: grid;
  gap: 10px;
}
.floating-fab svg { width: 22px; height: 22px; fill: currentColor; }



.section { padding: clamp(86px, 10vw, 150px) clamp(22px, 7vw, 110px); }
.section-kicker { color: var(--wood-light); margin: 0 0 24px; display: inline-flex; align-items: center; gap: 14px; }
.section-kicker::before { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .8; }
.intro { padding-top: 80px; background: linear-gradient(180deg, #081610 0%, #0d2218 100%); }
.intro-grid { display: grid; grid-template-columns: 1.1fr .8fr; gap: clamp(50px, 8vw, 140px); align-items: end; }
.intro h2, .section-head h2, .around h2, .booking h2, .interior h2 { margin: 0; font-size: clamp(44px, 5.3vw, 78px); line-height: 1.01; letter-spacing: -.04em; }
.intro-text { max-width: 580px; color: rgba(245,238,224,.72); line-height: 1.9; font-size: 16px; }
.intro-text p { margin: 0 0 18px; }
.cinema-card { margin-top: clamp(54px, 8vw, 120px); position: relative; overflow: hidden; border-radius: var(--radius); aspect-ratio: 16/7; background: #29241f; border: 1px solid rgba(211,176,108,.16); }
.cinema-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.8,.2,1); }
.cinema-card:hover img { transform: scale(1.035); }
.cinema-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,9,8,.55), transparent 48%); }
.cinema-caption { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 26px; display: flex; justify-content: space-between; align-items: end; color: #fff; }
.cinema-caption span { font-size: 10px; letter-spacing: .18em; opacity: .7; }
.cinema-caption strong { font-family: var(--serif); font-weight: 400; font-size: clamp(18px, 2vw, 28px); }

.houses { background: #081610; color: #fff; }
.section-head { display: flex; justify-content: space-between; gap: 50px; align-items: end; margin-bottom: 54px; }
.section-head > p { max-width: 440px; color: rgba(245,238,224,.62); line-height: 1.85; font-size: 15px; }
.houses .section-head > p { color: rgba(255,255,255,.52); }
.house-switch { width: fit-content; display: flex; padding: 5px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; margin-bottom: 34px; }
.house-switch button { border: 0; background: transparent; color: rgba(255,255,255,.55); border-radius: 999px; padding: 10px 18px; cursor: pointer; font-size: 11px; font-weight: 700; }
.house-switch button.active { background: var(--wood-light); color: var(--ink); }
.house-experience { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 600px; border: 1px solid rgba(255,255,255,.10); border-radius: var(--radius); overflow: hidden; background: #1d1a17; }
.house-photo { position: relative; min-height: 600px; overflow: hidden; }
.house-photo img { width: 100%; height: 100%; object-fit: cover; transition: opacity .35s ease, transform .9s ease; }
.house-experience:hover .house-photo img { transform: scale(1.02); }
.photo-chip { position: absolute; top: 20px; left: 20px; padding: 9px 12px; border-radius: 999px; background: rgba(0,0,0,.38); color: #fff; font-size: 9px; letter-spacing: .16em; backdrop-filter: blur(10px); }
.house-details { padding: clamp(38px, 6vw, 86px); align-self: center; }
.house-details h3 { font-size: clamp(42px, 4.8vw, 70px); line-height: 1; margin: 12px 0 22px; letter-spacing: -.04em; }
.house-details > p:not(.eyebrow) { color: rgba(255,255,255,.58); line-height: 1.75; max-width: 560px; }
.spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 34px 0; border-top: 1px solid rgba(255,255,255,.13); border-left: 1px solid rgba(255,255,255,.13); }
.spec-grid div { padding: 17px; border-right: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); }
.spec-grid strong { font-family: var(--serif); font-size: 29px; font-weight: 400; display: block; }
.spec-grid span { font-size: 10px; color: rgba(255,255,255,.48); letter-spacing: .08em; text-transform: uppercase; }
.text-link { display: inline-flex; align-items: center; gap: 15px; border-bottom: 1px solid rgba(255,255,255,.25); padding-bottom: 7px; font-size: 12px; font-weight: 700; }

.mood-break { height: 75vh; min-height: 560px; position: relative; overflow: hidden; }
.mood-break img, .mood-break video { width: 100%; height: 100%; object-fit: cover; }
.mood-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,9,8,.7), rgba(10,9,8,.05) 60%); }
.mood-copy { position: absolute; left: clamp(22px, 7vw, 110px); bottom: clamp(40px, 7vw, 90px); color: #fff; }
.mood-copy span { font-size: 10px; letter-spacing: .24em; color: var(--wood-light); }
.mood-copy p { font-family: var(--serif); font-size: clamp(38px, 5vw, 70px); line-height: 1.03; margin: 12px 0 0; }

.amenities { background: linear-gradient(180deg, #0a1812 0%, #10231a 100%); }
.amenity-grid { display: grid; grid-template-columns: 1.4fr .8fr .8fr; gap: 16px; grid-auto-rows: minmax(310px, auto); }
.amenity-card { position: relative; overflow: hidden; min-height: 340px; border-radius: 22px; background: #ddd5ca; }
.amenity-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.amenity-card:hover img { transform: scale(1.035); }
.amenity-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15,13,11,.69), transparent 62%); pointer-events: none; }
.amenity-content { position: absolute; z-index: 2; left: 22px; right: 22px; bottom: 22px; color: #fff; }
.amenity-content > span { font-size: 9px; letter-spacing: .18em; opacity: .7; }
.amenity-content h3 { font-size: 28px; margin: 5px 0 7px; }
.amenity-content p { margin: 0; color: rgba(255,255,255,.66); font-size: 12px; line-height: 1.5; max-width: 370px; }
.amenity-card-large { grid-row: span 2; min-height: 696px; }
.amenity-card-text { background: var(--paper-2); border: 1px solid var(--line); }
.amenity-card-text::after { display: none; }
.amenity-card-text .amenity-content { color: var(--white); position: relative; background: none; }
.amenity-card-text .amenity-content p { color: rgba(245,238,224,.68); }
.amenity-symbol { position: absolute; right: 25px; top: 16px; font-family: var(--serif); font-size: 82px; color: rgba(211,176,108,.25); }
.breakfast-strip { margin-top: 16px; display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; border: 1px solid var(--line); border-radius: 18px; padding: 19px 22px; }
.breakfast-icon { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: #fff; }
.breakfast-strip strong { font-family: var(--serif); font-size: 20px; font-weight: 400; }
.breakfast-strip p { margin: 3px 0 0; font-size: 12px; color: #777067; }
.breakfast-strip a { font-size: 11px; font-weight: 800; letter-spacing: .06em; }

.interior { background: #0d2018; }
.interior-grid { display: grid; grid-template-columns: 1.2fr .8fr; grid-template-rows: auto auto; gap: 16px; }
.interior-tall { grid-row: span 2; min-height: 820px; border-radius: 24px; overflow: hidden; }
.interior-tall img, .interior-small img { width: 100%; height: 100%; object-fit: cover; }
.interior-copy { padding: clamp(24px, 4vw, 58px); align-self: center; }
.interior-copy p:last-child { color: rgba(245,238,224,.68); line-height: 1.85; max-width: 450px; }
.interior-small { border-radius: 20px; overflow: hidden; min-height: 330px; }

.gallery-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 260px; gap: 14px; }
.gallery-item { appearance: none; border: 0; padding: 0; cursor: zoom-in; overflow: hidden; border-radius: 22px; grid-column: span 4; background: #10231a; box-shadow: 0 18px 40px rgba(0,0,0,.14); border: 1px solid rgba(211,176,108,.12); }
.gallery-item.tall { grid-row: span 2; }
.gallery-item.wide { grid-column: span 8; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease, filter .5s ease; }
.gallery-item:hover img { transform: scale(1.04); filter: saturate(1.02); }
.gallery-item.aframe { clip-path: polygon(50% 0%, 100% 12%, 100% 100%, 0 100%, 0 12%); }
.gallery-item.triangle { clip-path: polygon(50% 0%, 100% 100%, 0 100%); }
.gallery-item.diamond { clip-path: polygon(50% 0%, 100% 16%, 100% 84%, 50% 100%, 0 84%, 0 16%); }

.film-strip {
  position: relative;
  min-height: 74vh;
  overflow: hidden;
  background: #040a08;
  color: #fff;
}
.film-strip video { width: 100%; height: 74vh; min-height: 560px; object-fit: cover; }
.film-strip-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,9,8,.72), rgba(10,9,8,.08) 56%, rgba(10,9,8,.16)); }
.film-strip-copy { position: absolute; left: clamp(22px, 7vw, 110px); right: clamp(22px, 7vw, 110px); bottom: clamp(28px, 5vw, 70px); z-index: 2; display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.film-strip-copy span { font-size: 10px; letter-spacing: .2em; color: var(--wood-light); }
.film-strip-copy strong { max-width: 720px; text-align: right; font-family: var(--serif); font-size: clamp(28px, 4vw, 58px); line-height: 1.04; font-weight: 400; }

.around { background: linear-gradient(180deg, #0a1812 0%, #0f231a 100%); display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px, 8vw, 140px); }
.around-intro { align-self: start; position: sticky; top: 100px; }
.around-intro > p:last-child { max-width: 430px; color: rgba(245,238,224,.66); line-height: 1.85; }
.places-list { border-top: 1px solid rgba(211,176,108,.18); }
.place-row { display: grid; grid-template-columns: 90px 1fr 30px; gap: 22px; align-items: center; min-height: 116px; border-bottom: 1px solid rgba(211,176,108,.18); transition: padding .25s ease, background .25s ease; }
.place-row:hover { padding: 0 14px; background: rgba(211,176,108,.06); }
.place-distance { font-family: var(--serif); font-size: 22px; color: var(--wood-light); }
.place-row strong { font-family: var(--serif); font-size: 22px; font-weight: 400; }
.place-row p { margin: 5px 0 0; font-size: 11px; color: rgba(245,238,224,.58); }
.place-arrow { font-size: 20px; }

.location {
  background: #10231a;
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: clamp(36px, 7vw, 100px);
  align-items: center;
}
.location-copy h2 { margin: 0 0 24px; font-size: clamp(44px, 5.3vw, 78px); line-height: 1.01; letter-spacing: -.04em; }
.location-copy > p:not(.section-kicker) { color: rgba(245,238,224,.68); line-height: 1.85; max-width: 520px; }
.location-address { margin: 28px 0 24px; padding: 18px 20px; border-left: 2px solid var(--wood-light); background: rgba(255,255,255,.04); border-radius: 0 18px 18px 0; }
.location-address span { display: block; margin-bottom: 7px; font-size: 9px; font-weight: 800; letter-spacing: .18em; color: var(--wood-light); }
.location-address strong { display: block; font-family: var(--serif); font-weight: 400; font-size: 24px; line-height: 1.35; }
.location-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.location-actions .button-dark { margin: 0; height: auto; min-height: 50px; border-radius: 999px; }
.instagram-pill { display: inline-flex; align-items: center; min-height: 50px; padding: 0 18px; border: 1px solid rgba(23,21,18,.18); border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: .05em; transition: background .25s ease, color .25s ease, transform .25s ease; }
.instagram-pill:hover { background: var(--ink); color: #fff; transform: translateY(-2px); }
.location-map { min-height: 590px; border-radius: 28px; overflow: hidden; box-shadow: 0 30px 80px rgba(45,33,23,.14); border: 1px solid rgba(23,21,18,.12); background: #d2c8bb; }
.location-map iframe { width: 100%; height: 590px; border: 0; display: block; filter: saturate(.75) sepia(.08); }


.booking { background: var(--ink); color: #fff; }
.booking-shell { display: grid; grid-template-columns: .68fr 1.32fr; gap: clamp(34px, 6vw, 90px); padding: clamp(30px, 4.5vw, 66px); background: #211e1a; border: 1px solid rgba(255,255,255,.09); border-radius: 28px; align-items: start; }
.booking-side { position: sticky; top: 34px; }
.booking-side > p:not(.section-kicker) { color: rgba(255,255,255,.54); line-height: 1.75; max-width: 450px; }
.booking-promise { display: grid; grid-template-columns: auto 1fr; gap: 10px 12px; margin-top: 30px; align-items: center; }
.booking-promise span { color: var(--wood-light); }
.booking-promise p { margin: 0; font-size: 12px; color: rgba(255,255,255,.7); }
.booking-stack { min-width: 0; display: grid; gap: 16px; }

.availability-card { position: relative; overflow: hidden; padding: clamp(22px, 3vw, 34px); border-radius: 22px; color: var(--ink); background: linear-gradient(150deg, #f7f3ed 0%, #e9e0d5 100%); box-shadow: 0 20px 60px rgba(0,0,0,.16); }
.availability-card::before { content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -120px; top: -130px; background: rgba(159,116,82,.09); }
.availability-top { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; padding-bottom: 24px; border-bottom: 1px solid rgba(23,21,18,.12); }
.availability-live { display: inline-flex; align-items: center; gap: 8px; font-size: 8px; font-weight: 900; letter-spacing: .16em; color: #665748; }
.availability-live i { width: 7px; height: 7px; border-radius: 50%; background: #6f8758; box-shadow: 0 0 0 5px rgba(111,135,88,.1); }
.availability-top h3 { margin: 9px 0 5px; font-size: clamp(28px, 3vw, 40px); letter-spacing: -.03em; }
.availability-top p { margin: 0; color: #746c64; font-size: 11px; line-height: 1.55; }
.booking-house-toggle { flex: 0 0 auto; display: flex; gap: 4px; padding: 4px; background: rgba(23,21,18,.06); border: 1px solid rgba(23,21,18,.09); border-radius: 14px; }
.booking-house-toggle button { min-width: 118px; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent; color: #6e675f; cursor: pointer; font-size: 10px; font-weight: 800; transition: .2s ease; }
.booking-house-toggle button small { display: block; margin-bottom: 3px; font-size: 7px; letter-spacing: .16em; opacity: .58; }
.booking-house-toggle button.active { background: var(--ink); color: #fff; box-shadow: 0 8px 22px rgba(23,21,18,.15); }

.calendar-toolbar { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 12px; margin: 24px 0 16px; }
.calendar-nav { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(23,21,18,.13); background: rgba(255,255,255,.45); cursor: pointer; transition: .2s ease; }
.calendar-nav:hover:not(:disabled) { background: var(--ink); color: #fff; transform: translateY(-1px); }
.calendar-nav:disabled { opacity: .25; cursor: default; }
.calendar-toolbar-title { text-align: center; }
.calendar-toolbar-title span { display: block; margin-bottom: 3px; font-size: 7px; font-weight: 900; letter-spacing: .2em; color: #8d8175; }
.calendar-toolbar-title strong { font-family: var(--serif); font-size: 18px; font-weight: 400; text-transform: capitalize; }

.calendar-months { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; transition: opacity .2s ease; }
.calendar-months.is-loading { opacity: .38; pointer-events: none; }
.calendar-month { min-width: 0; }
.calendar-month-title { display: flex; align-items: baseline; justify-content: space-between; padding: 0 4px 12px; }
.calendar-month-title strong { font-family: var(--serif); font-weight: 400; font-size: 18px; text-transform: capitalize; }
.calendar-month-title span { font-size: 7px; font-weight: 900; letter-spacing: .16em; color: #9a8878; }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendar-weekdays { margin-bottom: 5px; }
.calendar-weekdays span { padding: 4px 0; text-align: center; font-size: 7px; font-weight: 900; color: #a0968c; text-transform: uppercase; }
.calendar-blank { aspect-ratio: 1; }
.calendar-day { position: relative; min-width: 0; aspect-ratio: 1; border: 1px solid transparent; border-radius: 10px; background: rgba(255,255,255,.48); color: #3c3732; cursor: pointer; display: grid; place-items: center; transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease; }
.calendar-day:hover:not(:disabled) { transform: translateY(-2px); border-color: rgba(159,116,82,.5); }
.calendar-day .day-number { font-size: 11px; font-weight: 700; }
.calendar-day .day-state { position: absolute; width: 4px; height: 4px; border-radius: 50%; bottom: 6px; background: #7f9569; }
.calendar-day.limited .day-state { background: #b58353; }
.calendar-day.busy { background: rgba(55,50,45,.07); color: #b2aaa2; text-decoration: line-through; }
.calendar-day.busy .day-state { background: #b9aea4; }
.calendar-day.past { opacity: .28; background: transparent; }
.calendar-day.today { border-color: rgba(159,116,82,.45); }
.calendar-day.in-range { background: rgba(159,116,82,.18); border-radius: 5px; }
.calendar-day.range-start, .calendar-day.range-end { background: var(--ink); color: #fff; border-color: var(--ink); border-radius: 50%; z-index: 2; }
.calendar-day.range-start .day-state, .calendar-day.range-end .day-state { background: var(--wood-light); }
.calendar-day.checkout-only { opacity: 1; color: #7a5a42; text-decoration: none; border-color: rgba(159,116,82,.35); }
.calendar-day.checkout-only::after { content: "OUT"; position: absolute; top: 3px; right: 3px; font-size: 5px; font-weight: 900; letter-spacing: .05em; color: #9f7452; }

.calendar-loading { position: absolute; z-index: 4; inset: 160px 30px auto; min-height: 120px; border-radius: 18px; display: flex; align-items: center; justify-content: center; gap: 6px; background: rgba(244,240,234,.86); backdrop-filter: blur(8px); }
.calendar-loading[hidden] { display: none; }
.calendar-loading span { width: 7px; height: 7px; border-radius: 50%; background: var(--wood); animation: calendarPulse 1s infinite ease-in-out; }
.calendar-loading span:nth-child(2) { animation-delay: .12s; }
.calendar-loading span:nth-child(3) { animation-delay: .24s; }
.calendar-loading p { margin: 0 0 0 8px; font-size: 10px; color: #6b6259; }
@keyframes calendarPulse { 0%, 100% { transform: translateY(0); opacity: .4; } 50% { transform: translateY(-5px); opacity: 1; } }

.calendar-footer { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding-top: 18px; margin-top: 18px; border-top: 1px solid rgba(23,21,18,.1); }
.calendar-legend { display: flex; flex-wrap: wrap; gap: 10px 14px; }
.calendar-legend span { display: inline-flex; align-items: center; gap: 6px; font-size: 8px; font-weight: 700; color: #766d65; }
.legend-dot { width: 6px; height: 6px; border-radius: 50%; background: #7f9569; }
.legend-dot.limited { background: #b58353; }
.legend-dot.busy { background: #b9aea4; }
.calendar-status { margin: 0; max-width: 310px; text-align: right; font-size: 9px; line-height: 1.5; color: #776c63; }
.calendar-status.success { color: #536c47; }
.calendar-status.error { color: #a2473c; }

.booking-form { position: relative; padding: clamp(24px, 3.5vw, 42px); background: #f0e8da; color: #172018; border-radius: 22px; }
.booking-selection-head { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; padding-bottom: 18px; margin-bottom: 22px; border-bottom: 1px solid #d8cfc4; }
.booking-selection-head span { font-size: 8px; font-weight: 900; letter-spacing: .17em; color: #8d7a68; }
.booking-selection-head strong { font-family: var(--serif); font-weight: 400; font-size: 18px; text-align: right; }
.booking-form label { display: block; margin-bottom: 16px; }
.form-row { display: grid; gap: 14px; }
.form-row.two { grid-template-columns: 1fr 1fr; }
.booking-form input:not([type="checkbox"]), .booking-form select, .booking-form textarea { width: 100%; border: 1px solid #d7cfc5; background: #fff; border-radius: 11px; padding: 13px 14px; outline: none; transition: border .2s ease, box-shadow .2s ease; }
.booking-form input:focus, .booking-form select:focus, .booking-form textarea:focus { border-color: var(--wood); box-shadow: 0 0 0 3px rgba(159,116,82,.12); }
.booking-form textarea { resize: vertical; }
.booking-summary { border: 1px dashed #c7b5a4; background: #eee6dc; padding: 11px 13px; border-radius: 10px; margin: -2px 0 16px; font-size: 11px; color: #745c49; }
.check-label { display: flex !important; gap: 10px; align-items: center; cursor: pointer; }
.check-label input { width: 17px; height: 17px; accent-color: var(--wood); }
.check-label span { margin: 0 !important; }
.submit-button { width: 100%; border-radius: 12px; color: var(--ink); }
.submit-button:disabled { opacity: .62; cursor: wait; transform: none; }
.form-status { margin: 12px 0 0; min-height: 18px; font-size: 12px; line-height: 1.5; color: #6d665f; }
.form-status.error { color: #9d3d32; }
.form-status.success { color: #426642; }
.form-honeypot { position: absolute !important; left: -99999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.booking-response-frame { width: 1px; height: 1px; border: 0; position: absolute; left: -9999px; }
.booking-success-card { margin-top: 18px; padding: 20px; border-radius: 16px; background: #e4eadc; border: 1px solid #c8d3bc; display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; }
.booking-success-card[hidden] { display: none; }
.success-icon { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: #5d754e; color: #fff; font-size: 18px; }
.booking-success-card small { display: block; font-size: 7px; letter-spacing: .17em; font-weight: 900; color: #607056; }
.booking-success-card h3 { margin: 4px 0 6px; font-size: 25px; }
.booking-success-card p { margin: 0 0 7px; font-size: 11px; line-height: 1.55; color: #5c6554; }
.booking-success-card strong { font-size: 10px; letter-spacing: .12em; color: #4f6245; }


.footer { padding: 46px clamp(22px, 7vw, 110px); background: #040a08; color: rgba(255,255,255,.58); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; border-top: 1px solid rgba(211,176,108,.1); }
.footer-logo { width: 150px; overflow: hidden; }
.footer-logo img { width: 150px; }
.footer-copy { text-align: center; font-size: 10px; letter-spacing: .08em; }
.footer-copy p { margin: 0 0 7px; }
.footer-copy a { color: #fff; }
.footer-links { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; }
.back-top { justify-self: end; font-size: 11px; }

.lightbox, .tour-modal { border: 0; padding: 0; background: transparent; width: min(94vw, 1300px); max-width: none; overflow: visible; }
.lightbox::backdrop, .tour-modal::backdrop { background: rgba(9,8,7,.88); backdrop-filter: blur(10px); }
.lightbox img { width: 100%; max-height: 88vh; object-fit: contain; border-radius: 16px; }
.lightbox-close, .tour-close { position: absolute; z-index: 3; right: 0; top: -48px; background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; width: 38px; height: 38px; font-size: 24px; cursor: pointer; }
.tour-video-wrap { position: relative; border-radius: 20px; overflow: hidden; background: #000; }
.tour-video-wrap video { width: 100%; max-height: 80vh; }
.tour-caption { position: absolute; left: 20px; bottom: 18px; color: #fff; display: flex; gap: 12px; align-items: center; text-shadow: 0 1px 10px rgba(0,0,0,.5); }
.tour-caption span { font-size: 9px; letter-spacing: .18em; color: var(--wood-light); }
.tour-caption strong { font-family: var(--serif); font-weight: 400; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.75,.25,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 1020px) {
  .desktop-nav { display: none; }
  .site-header { grid-template-columns: 1fr auto auto; gap: 10px; }
  .menu-toggle { display: block; }
  .mobile-menu { position: fixed; z-index: 45; inset: 0; background: rgba(20,18,15,.98); color: #fff; padding: 130px 30px 40px; flex-direction: column; gap: 22px; }
  .mobile-menu.open { display: flex; }
  .mobile-menu a { font-family: var(--serif); font-size: 36px; border-bottom: 1px solid rgba(255,255,255,.12); padding-bottom: 15px; }
  .hero-meta { left: clamp(22px, 7vw, 110px); right: auto; }
  .scroll-cue { display: none; }
  .hero-showcase { width: min(38vw, 420px); top: 18vh; }
  .intro-grid, .around, .location { grid-template-columns: 1fr; }
  .around-intro { position: static; }
  .location-map, .location-map iframe { min-height: 500px; height: 500px; }
  .house-experience { grid-template-columns: 1fr; }
  .house-photo { min-height: 520px; }
  .amenity-grid { grid-template-columns: 1fr 1fr; }
  .amenity-card-large { grid-row: span 1; min-height: 420px; grid-column: span 2; }
  .interior-grid { grid-template-columns: 1fr 1fr; }
  .interior-tall { grid-column: span 2; grid-row: span 1; min-height: 620px; }
  .interior-copy { grid-column: span 2; }
  .booking-shell { grid-template-columns: 1fr; }
  .booking-side { position: static; }
  .calendar-months { gap: 16px; }
}

@media (max-width: 720px) {
  .site-header { padding: 14px 18px; }
  .brand { width: 92px; height: 46px; }
  .brand img { width: 98px; }
  .nav-cta { display: none; }
  .hero { min-height: 830px; }
  .hero-video { object-position: 58% center; }
  .hero-copy { padding: 155px 20px 0; }
  .hero h1 { font-size: clamp(47px, 14vw, 72px); }
  .hero-lead { font-size: 15px; }
  .hero-meta { left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
  .hero-meta div { min-width: 0; padding: 18px 16px; }
    .section { padding: 78px 20px; }
  .intro { padding-top: 65px; }
  .intro-grid { gap: 28px; }
  .cinema-card { aspect-ratio: 4/5; }
  .cinema-caption { flex-direction: column; align-items: flex-start; gap: 7px; left: 18px; bottom: 18px; }
  .section-head { display: block; margin-bottom: 35px; }
  .section-head > p { margin-top: 22px; }
  .house-photo { min-height: 420px; }
  .house-details { padding: 32px 22px; }
  .spec-grid { grid-template-columns: 1fr 1fr; }
  .mood-break { min-height: 520px; height: 70vh; }
  .film-strip, .film-strip video { min-height: 560px; height: 70vh; }
  .film-strip-copy { display: block; }
  .film-strip-copy strong { display: block; margin-top: 12px; text-align: left; }
  .amenity-grid { grid-template-columns: 1fr; }
  .amenity-card-large { grid-column: span 1; min-height: 430px; }
  .amenity-card { min-height: 360px; }
  .breakfast-strip { grid-template-columns: auto 1fr; }
  .breakfast-strip a { grid-column: 2; }
  .interior-grid { grid-template-columns: 1fr; }
  .interior-tall, .interior-copy { grid-column: span 1; }
  .interior-tall { min-height: 590px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 210px; }
  .gallery-item, .gallery-item.wide { grid-column: span 1; }
  .gallery-item.tall { grid-row: span 2; }
  .gallery-item.triangle, .gallery-item.diamond, .gallery-item.aframe { clip-path: none; border-radius: 20px; }
  .floating-nav { top: 88px; right: 14px; }
  .floating-actions { left: 14px; bottom: 14px; }
  .floating-arrow, .floating-fab { width: 48px; height: 48px; border-radius: 16px; }
  .place-row { grid-template-columns: 66px 1fr 22px; gap: 12px; }
  .place-row strong { font-size: 18px; }
  .location-map, .location-map iframe { min-height: 420px; height: 420px; border-radius: 20px; }
  .location-actions { align-items: stretch; flex-direction: column; }
  .location-actions > * { width: 100%; justify-content: center; }
  .booking-shell { padding: 18px; }
  .availability-card { padding: 20px 14px; }
  .availability-top { display: block; }
  .booking-house-toggle { margin-top: 18px; width: 100%; }
  .booking-house-toggle button { min-width: 0; flex: 1; }
  .calendar-months { grid-template-columns: 1fr; }
  .calendar-month:nth-child(2) { display: none; }
  .calendar-footer { display: block; }
  .calendar-status { margin-top: 12px; text-align: left; max-width: none; }
  .calendar-day { border-radius: 9px; }
  .calendar-day .day-number { font-size: 12px; }
  .booking-form { padding: 22px 16px; }
  .booking-selection-head { display: block; }
  .booking-selection-head strong { display: block; text-align: left; margin-top: 7px; }
  .form-row.two { grid-template-columns: 1fr; gap: 0; }
  .footer { grid-template-columns: 1fr; text-align: center; }
  .footer-logo, .back-top { justify-self: center; }
  .footer-copy { order: 2; }
  .back-top { order: 3; }
}


/* WOODRA editorial refinement v2 */
.hero-copy {
  max-width: min(760px, 72vw);
  padding-top: clamp(190px, 27vh, 300px);
  padding-bottom: 180px;
}
.hero h1 {
  font-size: clamp(68px, 8.8vw, 142px);
  line-height: .82;
  font-weight: 400;
}
.hero h1 em { font-weight: 400; }
.hero-lead { max-width: 560px; }
.hero-video { object-position: center center; }
.hero-meta { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hero-meta div { padding: 24px clamp(18px, 3vw, 42px); }

/* Images stay elegant instead of being stretched beyond their role. */
.cinema-card,
.house-photo,
.amenity-card,
.interior-tall,
.interior-small,
.gallery-item,
.location-map {
  isolation: isolate;
}
.cinema-card img,
.house-photo img,
.amenity-card img,
.interior-tall img,
.interior-small img,
.gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.cinema-card { border-radius: 0; }

/* Editorial amenities, closer to the supplied reference. */
.amenity-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: 180px;
  gap: 18px;
}
.amenity-card { grid-column: span 4; grid-row: span 2; min-height: 0; border-radius: 4px; }
.amenity-card-large { grid-column: span 7; grid-row: span 4; min-height: 0; }
.amenity-card:nth-child(2) { grid-column: span 5; grid-row: span 2; }
.amenity-card:nth-child(3) { grid-column: span 5; grid-row: span 2; }
.amenity-card-text { grid-column: span 4; grid-row: span 2; min-height: 300px; display: flex; align-items: flex-end; }
.amenity-card-text .amenity-content { width: 100%; padding: 30px; }
.amenity-content h3 { font-size: clamp(28px, 2.6vw, 42px); }
.amenity-content p { font-size: 13px; line-height: 1.65; }
.breakfast-strip { border-radius: 4px; background: rgba(255,255,255,.025); }
.breakfast-strip p { color: rgba(245,238,224,.62); }

/* Image-led interior and gallery. */
.interior-grid { gap: 18px; }
.interior-tall, .interior-small { border-radius: 4px; }
.gallery-grid { gap: 18px; grid-auto-rows: 220px; }
.gallery-item { border-radius: 4px; }
.gallery-item.aframe,
.gallery-item.triangle,
.gallery-item.diamond { border-radius: 0; }
.gallery .section-head { align-items: flex-start; }
.gallery .section-head > p { display: none; }

/* Booking stays luxury, not technical. */
.booking-shell { background: #0b1c14; border-color: rgba(211,176,108,.15); }
.booking-promise { margin-top: 34px; gap: 15px 14px; }
.booking-promise span { font-size: 10px; color: var(--wood-light); }
.booking-promise p { font-size: 14px; letter-spacing: .01em; }
.deposit-note {
  margin: 12px 4px 0;
  color: #756c62;
  font-size: 11px;
  line-height: 1.6;
  text-align: center;
}

/* Gold/green controls in the location block. */
.location .button-dark { background: var(--wood-light); color: #07150f; }
.location .instagram-pill { border-color: rgba(211,176,108,.36); color: var(--white); }
.location .instagram-pill:hover { background: var(--wood-light); color: #07150f; }

@media (max-width: 1020px) {
  .hero-copy { max-width: 68vw; }
  .hero-meta { left: 0; right: 0; grid-template-columns: repeat(4, 1fr); }
  .amenity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; }
  .amenity-card,
  .amenity-card:nth-child(2),
  .amenity-card:nth-child(3),
  .amenity-card-text { grid-column: auto; grid-row: auto; min-height: 0; aspect-ratio: 4 / 5; }
  .amenity-card-large { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 16 / 9; }
  .amenity-card-text { aspect-ratio: auto; min-height: 280px; }
  .house-photo { min-height: 0; aspect-ratio: 16 / 10; }
  .interior-tall { min-height: 0; aspect-ratio: 16 / 11; }
  .interior-small { min-height: 0; aspect-ratio: 4 / 3; }
}

@media (max-width: 720px) {
  .hero { min-height: 900px; }
  .hero-video { object-position: 46% center; }
  .hero-copy {
    max-width: none;
    padding: 150px 20px 230px;
  }
  .hero h1 { font-size: clamp(64px, 19vw, 92px); line-height: .83; }
  .hero-lead { max-width: 92%; font-size: 14px; line-height: 1.7; }
  .hero-actions { align-items: stretch; }
  .hero-actions .button { min-width: 145px; }
  .hero-meta { grid-template-columns: 1fr 1fr; }
  .hero-meta div { padding: 16px 18px; }
  .hero-meta strong { font-size: 30px; }
  .hero-meta span { font-size: 9px; letter-spacing: .14em; }

  .section { padding-left: 18px; padding-right: 18px; }
  .section-head h2,
  .intro h2,
  .around h2,
  .booking h2,
  .interior h2 { font-size: clamp(46px, 13.5vw, 68px); line-height: .9; }

  .cinema-card { aspect-ratio: 3 / 4; }
  .house-photo { min-height: 0; aspect-ratio: 4 / 5; }
  .house-details { padding: 30px 20px 36px; }

  .amenity-grid { grid-template-columns: 1fr; gap: 12px; }
  .amenity-card,
  .amenity-card:nth-child(2),
  .amenity-card:nth-child(3),
  .amenity-card-large { grid-column: 1; grid-row: auto; min-height: 0; aspect-ratio: 4 / 5; }
  .amenity-card-text { grid-column: 1; grid-row: auto; min-height: 230px; aspect-ratio: auto; }
  .amenity-content { left: 18px; right: 18px; bottom: 18px; }
  .amenity-content h3 { font-size: 34px; }

  .interior-grid { grid-template-columns: 1fr; gap: 12px; }
  .interior-tall, .interior-small { min-height: 0; grid-column: 1; grid-row: auto; }
  .interior-tall { aspect-ratio: 4 / 5; }
  .interior-small { aspect-ratio: 4 / 3; }

  .gallery-grid { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 12px; }
  .gallery-item,
  .gallery-item.wide,
  .gallery-item.tall { grid-column: 1; grid-row: auto; aspect-ratio: 4 / 5; }
  .gallery-item:nth-child(2),
  .gallery-item:nth-child(7) { aspect-ratio: 4 / 3; }
  .gallery-item.triangle,
  .gallery-item.diamond,
  .gallery-item.aframe { clip-path: none; border-radius: 4px; }

  .mood-break,
  .mood-break video,
  .film-strip,
  .film-strip video { min-height: 620px; height: 78vh; }

  .location-map,
  .location-map iframe { width: 100%; min-height: 390px; height: 390px; }

  .booking-shell { border-radius: 8px; padding: 14px; gap: 28px; }
  .availability-card, .booking-form { border-radius: 8px; }
  .booking-promise p { font-size: 13px; }
  .deposit-note { font-size: 10px; }
}


/* Reference-driven refinement: A-Frame Club x Hideout Bali x Porth Eryri */
.hero-copy { max-width: min(820px, 70vw); }
.hero-lead { max-width: 600px; }
.hero-booking-teaser {
  position: absolute;
  z-index: 3;
  right: clamp(22px, 7vw, 110px);
  bottom: 150px;
  width: min(360px, 32vw);
  padding: 26px 24px;
  background: rgba(8, 23, 16, .76);
  border: 1px solid rgba(211,176,108,.28);
  backdrop-filter: blur(14px);
  box-shadow: 0 26px 70px rgba(0,0,0,.22);
  border-radius: 6px;
}
.mini-kicker {
  display: inline-block;
  margin-bottom: 12px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--wood-light);
}
.hero-booking-teaser strong {
  display: block;
  font-family: var(--serif);
  font-size: clamp(24px, 2vw, 34px);
  line-height: 1.05;
  font-weight: 400;
  color: var(--white);
}
.hero-booking-teaser p {
  margin: 12px 0 16px;
  color: rgba(245,238,224,.72);
  line-height: 1.65;
  font-size: 13px;
}
.hero-booking-teaser a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--wood-light);
}
.hero-meta strong { font-size: clamp(30px, 3vw, 46px); }
.hero-meta span { line-height: 1.45; }
.intro-text p, .section-head > p, .around-intro > p:last-child, .location-copy > p:not(.section-kicker) { font-size: 15px; }
.section-head > p { max-width: 520px; }
.house-experience { border-radius: 6px; }
.photo-chip { letter-spacing: .18em; }
.amenity-card, .amenity-card img, .interior-tall, .interior-small, .gallery-item, .gallery-item img { border-radius: 4px; }
.amenity-card:nth-child(2) img, .amenity-card:nth-child(3) img, .gallery-item img { object-position: center; }
.breakfast-strip strong { font-size: 24px; }
.breakfast-strip a { color: var(--wood-light); }
.film-strip-copy strong { max-width: 760px; }
.availability-top h3 { font-size: clamp(34px, 3.2vw, 46px); }
.availability-top p { font-size: 12px; line-height: 1.65; }
.booking-shell { border-radius: 8px; }
.booking-promise p { font-size: 13px; }
.deposit-note { max-width: 420px; margin-left: auto; margin-right: auto; }

@media (max-width: 1180px) {
  .hero-booking-teaser { width: min(340px, 36vw); right: 24px; }
}

@media (max-width: 1020px) {
  .hero-booking-teaser {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(100%, 420px);
    margin: 28px 0 0 clamp(22px, 7vw, 110px);
  }
  .hero-copy { padding-bottom: 26px; }
  .hero-meta { margin-top: 0; }
}

@media (max-width: 720px) {
  .hero-copy { padding-bottom: 24px; }
  .hero-booking-teaser {
    margin: 22px 20px 0;
    width: auto;
    padding: 18px 18px 16px;
  }
  .hero-booking-teaser strong { font-size: 28px; }
  .hero-booking-teaser p { font-size: 12px; }
  .hero-meta { position: relative; }
  .hero-meta span { font-size: 9px; }
  .breakfast-strip strong { font-size: 20px; }
}


/* WOODRA ultra-premium v4 */
.hero-overline {
  margin: 0 0 14px;
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(245,238,224,.54);
}
.hero-whisper {
  margin: 18px 0 0;
  max-width: 540px;
  font-family: var(--serif);
  font-size: clamp(24px, 2vw, 34px);
  line-height: 1.18;
  color: rgba(245,238,224,.86);
  font-style: italic;
}
.hero-booking-teaser {
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(9,24,17,.86), rgba(9,24,17,.70));
}
.hero-booking-teaser::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(211,176,108,.16);
  pointer-events: none;
}
.hero-booking-teaser a {
  border-bottom: 1px solid rgba(211,176,108,.45);
  padding-bottom: 4px;
}
.hero-meta {
  backdrop-filter: blur(10px);
}
.signature-strip {
  margin-top: 26px;
  padding: 32px;
  border: 1px solid rgba(211,176,108,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 40px;
  align-items: end;
  border-radius: 4px;
}
.signature-copy h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(32px, 3.2vw, 52px);
  line-height: .98;
  font-weight: 400;
}
.signature-copy h3 em { color: var(--wood-light); font-style: italic; }
.signature-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.signature-points div {
  padding-top: 16px;
  border-top: 1px solid rgba(211,176,108,.16);
}
.signature-points strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 400;
  color: var(--wood-light);
}
.signature-points span {
  display: block;
  color: rgba(245,238,224,.68);
  line-height: 1.65;
  font-size: 13px;
}
.house-experience,
.booking-shell,
.final-cta-card,
.availability-card,
.booking-form,
.location-map,
.breakfast-strip,
.cinema-card {
  box-shadow: 0 24px 80px rgba(0,0,0,.16);
}
.house-switch button,
.booking-house-toggle button,
.button,
.nav-cta,
.sticky-booking-cta {
  transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.house-switch button:hover,
.booking-house-toggle button:hover,
.nav-cta:hover,
.button:hover,
.sticky-booking-cta:hover {
  box-shadow: 0 16px 40px rgba(0,0,0,.15);
}
.gallery-grid-rich .gallery-item:nth-child(1) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(2) { grid-column: span 6; }
.gallery-grid-rich .gallery-item:nth-child(3) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(4) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(5) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(6) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(7) { grid-column: span 6; }
.gallery-grid-rich .gallery-item:nth-child(8) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(9) { grid-column: span 3; }
.gallery-grid-rich .gallery-item:nth-child(10) { grid-column: span 6; }
.place-row strong { font-size: clamp(22px, 2.3vw, 28px); }
.final-cta {
  padding-top: 0;
  background: linear-gradient(180deg, #0d2018 0%, #081610 100%);
}
.final-cta-card {
  padding: clamp(34px, 5vw, 72px);
  border: 1px solid rgba(211,176,108,.16);
  background: radial-gradient(circle at top right, rgba(211,176,108,.10), transparent 28%), linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  border-radius: 6px;
}
.final-cta-card h2 {
  margin: 0 0 16px;
  font-size: clamp(42px, 5vw, 78px);
  line-height: .96;
  font-family: var(--serif);
  font-weight: 400;
}
.final-cta-card p {
  max-width: 700px;
  margin: 0;
  color: rgba(245,238,224,.72);
  font-size: 16px;
  line-height: 1.8;
}
.final-cta-actions {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.sticky-booking-cta {
  position: fixed;
  z-index: 95;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  width: min(520px, calc(100vw - 30px));
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  background: rgba(9,24,17,.88);
  border: 1px solid rgba(211,176,108,.26);
  backdrop-filter: blur(16px);
  border-radius: 999px;
  box-shadow: 0 18px 60px rgba(0,0,0,.22);
}
.sticky-booking-kicker {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .18em;
  color: var(--wood-light);
  white-space: nowrap;
}
.sticky-booking-cta strong {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--white);
}
.sticky-booking-cta small {
  display: block;
  font-size: 10px;
  color: rgba(245,238,224,.62);
  white-space: nowrap;
}
.sticky-booking-cta:hover {
  transform: translateX(-50%) translateY(-2px);
  background: rgba(16,35,26,.96);
}
@media (max-width: 1020px) {
  .signature-strip {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .signature-points {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .hero-overline { font-size: 9px; }
  .hero-whisper {
    font-size: 22px;
    max-width: 92%;
  }
  .signature-strip {
    margin-top: 18px;
    padding: 22px 18px;
  }
  .signature-copy h3 {
    font-size: 38px;
    line-height: .96;
  }
  .signature-points {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .signature-points strong { font-size: 22px; }
  .final-cta-card { padding: 26px 20px; }
  .final-cta-card p { font-size: 14px; }
  .final-cta-actions { display: grid; grid-template-columns: 1fr; }
  .final-cta-actions .button { width: 100%; }
  .sticky-booking-cta {
    left: 14px;
    right: 14px;
    bottom: 12px;
    width: auto;
    transform: none;
    grid-template-columns: 1fr;
    gap: 4px;
    border-radius: 14px;
    padding: 12px 14px;
  }
  .sticky-booking-cta:hover { transform: translateY(-2px); }
  .sticky-booking-kicker { font-size: 8px; }
  .sticky-booking-cta strong { font-size: 11px; }
  .sticky-booking-cta small { font-size: 9px; white-space: normal; }
  .gallery-grid-rich .gallery-item,
  .gallery-grid-rich .gallery-item:nth-child(n) {
    grid-column: 1 !important;
  }
}


/* Final polish v5 */
.hero-card-main { animation: heroFloat 9s ease-in-out infinite; }
.hero-card-top { animation: heroFloatAlt 10s ease-in-out infinite; }
.hero-card-bottom { animation: heroFloat 11s ease-in-out infinite reverse; }
@keyframes heroFloat {
  0%,100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
}
@keyframes heroFloatAlt {
  0%,100% { transform: translateY(0px); }
  50% { transform: translateY(10px); }
}
.hero-booking-teaser strong,
.final-cta-card h2,
.signature-copy h3,
.availability-top h3,
.booking-form h3 {
  text-wrap: balance;
}
.breakfast-strip,
.house-experience,
.amenity-card,
.gallery-item,
.place-row,
.location-address,
.final-cta-card,
.booking-form,
.availability-card {
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease, background .35s ease;
}
.gallery-item:hover,
.amenity-card:hover,
.house-experience:hover,
.final-cta-card:hover,
.booking-form:hover,
.availability-card:hover {
  transform: translateY(-3px);
}
.booking-form {
  overflow: hidden;
}
.booking-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--wood-light), rgba(211,176,108,0));
}
.booking-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin: 16px 0 18px;
}
.booking-steps span {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  padding: 10px 8px;
  border-radius: 999px;
  background: rgba(7,21,15,.06);
  border: 1px solid rgba(7,21,15,.08);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #223127;
}
.booking-steps b {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: var(--wood-light);
  color: var(--ink);
  font-size: 10px;
}
.deposit-note {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(7,21,15,.05);
  border: 1px solid rgba(7,21,15,.08);
}
.sticky-booking-cta {
  animation: stickyGlow 3s ease-in-out infinite;
}
@keyframes stickyGlow {
  0%,100% { box-shadow: 0 18px 60px rgba(0,0,0,.22); }
  50% { box-shadow: 0 18px 60px rgba(0,0,0,.22), 0 0 0 5px rgba(211,176,108,.05); }
}
@media (max-width: 720px) {
  .hero {
    min-height: 100svh;
  }
  .hero-copy {
    padding-top: 132px;
  }
  .hero h1 {
    font-size: clamp(50px, 13vw, 74px);
    line-height: .9;
  }
  .hero-lead {
    max-width: 100%;
    font-size: 14px;
    line-height: 1.65;
  }
  .hero-whisper {
    font-size: 20px;
    line-height: 1.15;
  }
  .hero-booking-teaser {
    margin-top: 18px;
  }
  .hero-meta strong {
    font-size: 24px;
  }
  .hero-meta span {
    font-size: 8px;
    letter-spacing: .14em;
  }
  .booking-steps {
    grid-template-columns: 1fr;
  }
  .booking-steps span {
    justify-content: flex-start;
    padding-left: 12px;
  }
  .floating-nav {
    top: 82px;
  }
}


/* v6 desktop fixes */
@media (min-width: 1021px) {
  .hero-copy {
    max-width: min(54vw, 720px);
    padding-top: 18vh;
  }
  .hero h1 {
    font-size: clamp(74px, 6.8vw, 108px);
    line-height: .88;
    max-width: 640px;
  }
  .hero-lead {
    max-width: 520px;
    font-size: 17px;
  }
  .hero-whisper {
    max-width: 500px;
    font-size: clamp(22px, 1.9vw, 30px);
  }
  .hero-booking-teaser {
    right: max(-340px, calc(-1 * min(22vw, 300px)));
    top: 230px;
    bottom: auto;
    width: min(380px, 29vw);
  }
  .hero-meta {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.interior-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 18px;
  align-items: start;
}
.interior-tall {
  grid-column: 1;
  grid-row: 1 / span 2;
  min-height: 0;
  aspect-ratio: 4 / 5;
}
.interior-copy {
  grid-column: 2;
  grid-row: 1;
  padding: clamp(22px, 3vw, 44px) clamp(8px, 1vw, 8px) 0 clamp(10px, 1.2vw, 12px);
}
.interior-pair {
  grid-column: 2;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.interior-small {
  min-height: 0;
  aspect-ratio: 4 / 5;
}
.interior-small img,
.interior-tall img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.interior-pair .interior-small:last-child img {
  object-position: center 30%;
}

@media (max-width: 1020px) {
  .interior-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .interior-tall,
  .interior-copy,
  .interior-pair {
    grid-column: 1;
    grid-row: auto;
  }
  .interior-tall { aspect-ratio: 16 / 11; }
  .interior-pair { grid-template-columns: 1fr 1fr; }
  .interior-small { aspect-ratio: 4 / 3; }
  .interior-copy { padding: 0; }
}

@media (max-width: 720px) {
  .interior-pair { grid-template-columns: 1fr; gap: 12px; }
  .interior-tall { aspect-ratio: 4 / 5; }
  .interior-small { aspect-ratio: 4 / 3; }
}


/* v7 mobile cleanup — remove redundant booking UI and keep the hero cinematic */
@media (max-width: 720px) {
  /* The large CHECK AVAILABILITY card is desktop-only. On a phone it duplicates
     the calendar FAB and pushes the real content too far down. */
  .hero-booking-teaser {
    display: none !important;
  }

  /* Same reason: keep one clear calendar action instead of a second banner. */
  .sticky-booking-cta {
    display: none !important;
  }

  /* Use the two compact floating actions the user requested: Instagram + booking. */
  .floating-actions {
    left: 14px;
    bottom: max(14px, env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    gap: 9px;
  }
  .floating-fab {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: rgba(7, 21, 15, .88);
    border-color: rgba(211,176,108,.34);
  }

  /* Cleaner mobile first screen: one emotional statement, not two long paragraphs. */
  .hero-whisper {
    display: none;
  }
  .hero-copy {
    padding: 138px 22px 188px;
    max-width: none;
  }
  .hero-overline {
    margin-bottom: 10px;
  }
  .hero .eyebrow {
    margin: 0 0 12px;
    font-size: 9px;
    line-height: 1.6;
  }
  .hero h1 {
    margin: 8px 0 16px;
    max-width: 92%;
    font-size: clamp(54px, 15vw, 76px);
    line-height: .86;
  }
  .hero-lead {
    max-width: 94%;
    margin-bottom: 24px;
    font-size: 14px;
    line-height: 1.65;
  }
  .hero-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    max-width: 100%;
  }
  .hero-actions .button {
    min-width: 0;
    width: 100%;
    padding: 13px 12px;
    min-height: 52px;
    font-size: 11px;
  }

  /* Stats stay attached to the bottom of the hero but are much calmer. */
  .hero-meta {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    grid-template-columns: 1fr 1fr;
    background: rgba(7,21,15,.88);
    backdrop-filter: blur(12px);
  }
  .hero-meta div {
    padding: 14px 18px;
    min-height: 86px;
  }
  .hero-meta strong {
    font-size: 26px;
    line-height: 1;
  }
  .hero-meta span {
    margin-top: 7px;
    font-size: 8px;
    line-height: 1.45;
    letter-spacing: .13em;
  }

  /* Smaller right-side arrows on mobile, so they don't fight the hero. */
  .floating-nav {
    top: 92px;
    right: 12px;
    gap: 8px;
  }
  .floating-arrow {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 20px;
    background: rgba(7,21,15,.72);
  }

  /* Hero should be tall enough for the text and stats, but not endlessly tall. */
  .hero {
    min-height: 820px;
  }
}

@media (max-width: 390px) {
  .hero-copy {
    padding-left: 18px;
    padding-right: 18px;
  }
  .hero h1 {
    font-size: clamp(50px, 14.5vw, 66px);
  }
  .hero-actions {
    grid-template-columns: 1fr;
  }
  .hero-meta div {
    padding-left: 14px;
    padding-right: 14px;
  }
}


/* v8 mobile: restore compact booking bar, remove Instagram FAB */
.fab-instagram { display: none !important; }

@media (max-width: 720px) {
  .sticky-booking-cta {
    display: grid !important;
    left: 50%;
    right: auto;
    bottom: max(12px, env(safe-area-inset-bottom));
    width: min(82vw, 520px);
    transform: translateX(-50%);
    grid-template-columns: 1fr;
    gap: 2px;
    padding: 10px 16px 11px;
    border-radius: 16px;
    background: rgba(7, 21, 15, .93);
  }
  .sticky-booking-cta:hover {
    transform: translateX(-50%) translateY(-2px);
  }
  .sticky-booking-kicker {
    font-size: 7px;
    letter-spacing: .18em;
  }
  .sticky-booking-cta strong {
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: .07em;
  }
  .sticky-booking-cta small {
    font-size: 8px;
    line-height: 1.3;
  }

  /* Keep only the calendar shortcut on the left. */
  .floating-actions {
    left: 14px;
    bottom: max(82px, calc(env(safe-area-inset-bottom) + 72px));
  }
}



/* =========================================================
   WOODRA v18 STABLE LAYOUT
   Missing component styles restored. Desktop/mobile rules are
   deliberately separated below to avoid cross-breakpoint clashes.
   ========================================================= */

/* Contact strip */
.top-contact-bar {
  position: fixed; inset: 0 0 auto 0; z-index: 110;
  height: 34px; padding: 0 clamp(20px,4vw,64px);
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(4,12,8,.94); border-bottom: 1px solid rgba(211,176,108,.12);
  color: rgba(245,238,224,.78); backdrop-filter: blur(12px);
}
.top-contact-left,.top-socials,.language-switch { display:flex; align-items:center; gap:12px; }
.top-contact-link,.language-switch a { font-size:11px; line-height:1; letter-spacing:.08em; }
.language-switch span { opacity:.35; }
.language-switch a.active { color:var(--wood-light); }
.top-social-link { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(211,176,108,.18); }
.top-social-link svg { width:13px; height:13px; fill:currentColor; }
.site-header { top:34px; }

/* Hero slideshow is a background layer, never document-flow content */
.hero-slideshow { position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero-slide { position:absolute; inset:0; opacity:0; transition:opacity 1s ease; pointer-events:none; }
.hero-slide.active { opacity:1; }
.hero-slide img { width:100%; height:100%; object-fit:cover; transform:scale(1.01); }
.hero-shade { z-index:1; }
.hero-glow { z-index:1; }
.hero-slide-dots { position:absolute; z-index:4; left:clamp(22px,7vw,110px); bottom:118px; display:flex; gap:8px; }
.hero-slide-dots button { width:22px; height:3px; padding:0; border:0; border-radius:999px; background:rgba(255,255,255,.3); cursor:pointer; }
.hero-slide-dots button.active { width:42px; background:var(--wood-light); }
.hero-copy { z-index:3; }

/* Headings */
.amenities .section-head h2 { font-size:clamp(46px,4.25vw,68px); max-width:900px; }

/* Every amenity gets a real image */
.amenity-card-text .amenity-symbol { display:none; }
.amenity-card { position:relative; overflow:hidden; min-height:360px; background:#10271d; }
.amenity-card > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.amenity-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,12,9,.05) 30%,rgba(5,12,9,.82) 100%); pointer-events:none; }
.amenity-content { position:absolute; z-index:2; left:0; right:0; bottom:0; padding:25px; }
.amenity-content h3 { margin:7px 0 7px; }

/* Breakfast card */
.breakfast-card {
  margin-top:22px; border:1px solid rgba(211,176,108,.2); border-radius:24px;
  overflow:hidden; background:#10271d; box-shadow:0 22px 60px rgba(0,0,0,.16);
}
.breakfast-card-photo { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); min-height:440px; }
.breakfast-photo { min-width:0; overflow:hidden; }
.breakfast-photo img { width:100%; height:100%; object-fit:cover; }
.breakfast-body { padding:clamp(26px,4vw,52px); display:flex; flex-direction:column; justify-content:center; }
.breakfast-card-head { display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:start; }
.breakfast-icon { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:rgba(211,176,108,.14); color:var(--wood-light); }
.breakfast-eyebrow { display:block; margin-bottom:7px; color:var(--wood-light); font-size:9px; font-weight:800; letter-spacing:.18em; }
.breakfast-card-head strong { display:block; font-family:var(--serif); font-size:clamp(26px,2.3vw,36px); font-weight:400; line-height:1.05; }
.breakfast-card-head p { margin:7px 0 0; color:rgba(245,238,224,.62); line-height:1.6; }
.breakfast-price { text-align:right; white-space:nowrap; }
.breakfast-price strong { font-family:var(--serif); font-size:34px; color:var(--wood-light); }
.breakfast-price span { display:block; font-size:10px; opacity:.65; }
.breakfast-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:28px 0 24px; }
.breakfast-options div { padding:15px; border:1px solid rgba(211,176,108,.15); border-radius:14px; background:rgba(255,255,255,.025); }
.breakfast-options span { display:block; color:var(--wood-light); font-size:9px; letter-spacing:.16em; margin-bottom:8px; }
.breakfast-options p { margin:0; color:rgba(245,238,224,.76); font-size:12px; line-height:1.55; }
.breakfast-body > a { width:max-content; color:var(--wood-light); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }

/* Interior, professional photos only */
.interior-grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:28px; align-items:start; }
.interior-tall { grid-row:1 / span 2; min-height:760px; border-radius:20px; overflow:hidden; border:1px solid rgba(211,176,108,.14); }
.interior-tall img { width:100%; height:100%; min-height:760px; object-fit:cover; }
.interior-copy { padding:24px 8px 0 20px; }
.interior-slider-shell { grid-column:2; display:grid; grid-template-columns:48px minmax(0,1fr) 48px; gap:12px; align-items:center; }
.interior-slider { position:relative; overflow:hidden; min-height:470px; border:1px solid rgba(211,176,108,.18); border-radius:20px; background:#07150f; }
.interior-slide { display:none; width:100%; height:100%; }
.interior-slide.active { display:block; }
.interior-slide img { width:100%; height:470px; object-fit:cover; }
.interior-nav { width:46px; height:46px; border-radius:50%; border:1px solid rgba(211,176,108,.26); background:rgba(7,21,15,.92); color:var(--wood-light); cursor:pointer; }
.interior-dots { grid-column:1/-1; display:flex; justify-content:center; gap:7px; margin-top:2px; }
.interior-dots button { width:8px; height:8px; padding:0; border:0; border-radius:50%; background:rgba(211,176,108,.25); cursor:pointer; }
.interior-dots button.active { background:var(--wood-light); }

/* Gallery slideshows */
.gallery { background:#07150f; }
.showcase-block { margin-top:26px; padding:20px; border:1px solid rgba(211,176,108,.17); border-radius:22px; background:rgba(255,255,255,.018); }
.showcase-block + .showcase-block { margin-top:18px; }
.showcase-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-end; margin-bottom:16px; }
.showcase-kicker { display:block; margin-bottom:8px; color:var(--wood-light); font-size:9px; font-weight:800; letter-spacing:.18em; }
.showcase-head h3 { margin:0; font-size:clamp(24px,2.35vw,36px); line-height:1.08; }
.showcase-nav { display:flex; gap:8px; }
.showcase-arrow { width:46px; height:46px; border-radius:50%; border:1px solid rgba(211,176,108,.25); background:transparent; color:#fff; cursor:pointer; }
.showcase-viewport { overflow:hidden; border-radius:16px; background:#07150f; }
.showcase-track { display:flex; will-change:transform; transition:transform .45s cubic-bezier(.2,.75,.25,1); }
.showcase-slide { position:relative; flex:0 0 100%; width:100%; border:0; padding:0; background:#07150f; color:#fff; cursor:zoom-in; }
.showcase-slide img { width:100%; height:620px; object-fit:cover; object-position:center; }
.showcase-slide span { position:absolute; left:16px; bottom:16px; padding:9px 12px; border-radius:999px; background:rgba(5,15,10,.7); border:1px solid rgba(255,255,255,.13); font-size:10px; letter-spacing:.1em; }
.showcase-dots { display:flex; justify-content:center; gap:7px; margin-top:12px; }
.showcase-dots button { width:8px; height:8px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.2); cursor:pointer; }
.showcase-dots button.active { background:var(--wood-light); }

/* Prices */
.pricing { background:#f0e8da; color:#171512; }
.pricing .section-kicker { color:#8b6e40; }
.pricing .section-head > p { color:#6d655c; }
.pricing-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.pricing-card { padding:30px; border:1px solid rgba(23,21,18,.14); border-radius:20px; background:rgba(255,255,255,.5); box-shadow:0 16px 42px rgba(23,21,18,.07); }
.pricing-label { display:inline-flex; padding:8px 12px; border-radius:999px; background:#0b1d15; color:var(--wood-light); font-size:9px; font-weight:800; letter-spacing:.16em; }
.pricing-card h3 { margin:18px 0 22px; font-size:clamp(30px,3vw,44px); }
.price-lines { display:grid; gap:14px; }
.price-lines div { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; padding-bottom:13px; border-bottom:1px solid rgba(23,21,18,.1); }
.price-lines strong { font-family:var(--serif); font-size:clamp(38px,4vw,56px); font-weight:500; line-height:1; }
.price-lines span { max-width:180px; text-align:right; color:#6e665d; font-size:12px; }
.pricing-note,.pricing-extra { border:1px solid rgba(23,21,18,.1); background:rgba(255,255,255,.45); }
.pricing-note { margin-top:20px; padding:14px 16px; border-radius:14px; color:#544c45; }
.pricing-extra { margin-top:18px; padding:18px 22px; border-radius:16px; }
.pricing-extra p { margin:0 0 8px; line-height:1.7; color:#5c544c; }
.pricing-extra p:last-child { margin-bottom:0; }

/* Events */
.events { background:#0a1912; }
.events-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.event-chip { min-height:76px; display:flex; align-items:center; padding:17px 19px; border:1px solid rgba(211,176,108,.16); border-radius:14px; background:rgba(255,255,255,.025); color:rgba(245,238,224,.82); }

/* Rules were present in HTML but had no component CSS */
.rules { background:#0d2018; }
.rules-head { max-width:900px; margin-bottom:34px; }
.rules-head h2 { margin:0; font-size:clamp(44px,4.8vw,72px); line-height:1; }
.rules-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.rule-card { border:1px solid rgba(211,176,108,.15); border-radius:16px; background:rgba(255,255,255,.025); overflow:hidden; }
.rule-card summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:14px; padding:18px 20px; font-family:var(--serif); font-size:23px; }
.rule-card summary::-webkit-details-marker { display:none; }
.rule-card summary::after { content:"+"; margin-left:auto; color:var(--wood-light); font-family:var(--sans); font-size:20px; }
.rule-card[open] summary::after { content:"−"; }
.rule-card summary span { color:var(--wood-light); font-family:var(--sans); font-size:9px; font-weight:800; letter-spacing:.15em; }
.rule-card > div { padding:0 20px 19px 54px; color:rgba(245,238,224,.68); line-height:1.7; }
.rule-card > div p { margin:0 0 8px; }
.rule-card > div p:last-child { margin-bottom:0; }

/* DESKTOP ONLY */
@media (min-width: 901px) {
  .hero { min-height:100vh; }
  .hero-copy { padding-top:21vh; max-width:min(55vw,780px); }
  .hero-booking-teaser { display:none !important; }
  .hero-slide:nth-child(1) img { object-position:center 48%; }
  .hero-slide:nth-child(2) img { object-position:center 52%; }
  .hero-slide:nth-child(3) img { object-position:center 52%; }
  .hero-slide:nth-child(4) img { object-position:center 55%; }
  .hero-slide:nth-child(5) img { object-position:center 56%; }
  .hero-slide:nth-child(6) img { object-position:center 50%; }
  .desktop-nav { gap:22px; }
  .amenity-grid { grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:330px; gap:14px; }
  .amenity-card, .amenity-card-large, .amenity-card:nth-child(2), .amenity-card:nth-child(3) { grid-column:auto !important; grid-row:auto !important; min-height:0; }
  .panorama-feature { min-height:460px; }
  .showcase-slide img { height:min(46vw,540px); }
  .showcase-block { max-width:1500px; margin-left:auto; margin-right:auto; }
  .breakfast-card { max-width:1500px; margin-left:auto; margin-right:auto; }
}

/* PHONE / SMALL TABLET ONLY */
@media (max-width: 900px) {
  .top-contact-bar { display:none; }
  .site-header { top:0; padding:14px 16px; grid-template-columns:1fr auto auto; }
  .brand { width:106px; height:45px; }
  .brand img { width:108px; }
  .desktop-nav,.nav-cta { display:none; }
  .menu-toggle { display:block; }
  .hero { min-height:100svh; }
  .hero-copy { padding:19vh 20px 150px; max-width:100%; }
  .hero h1 { font-size:clamp(54px,15vw,78px); line-height:.88; }
  .hero-lead { font-size:15px; max-width:34rem; }
  .hero-slide img { object-fit:cover; }
  .hero-slide:nth-child(1) img { object-position:56% center; }
  .hero-slide:nth-child(2) img { object-position:center; }
  .hero-slide:nth-child(3) img { object-position:center; }
  .hero-slide:nth-child(4) img { object-position:58% center; }
  .hero-slide:nth-child(5) img { object-position:center 58%; }
  .hero-slide:nth-child(6) img { object-position:center 48%; }
  .hero-slide-dots { left:20px; bottom:118px; }
  .hero-booking-teaser { display:none !important; }
  .section { padding-left:18px; padding-right:18px; }
  .section-head { display:block; margin-bottom:28px; }
  .section-head > p { margin-top:16px; }
  .amenities .section-head h2 { font-size:clamp(39px,11vw,52px); line-height:.98; }
  .amenity-grid { grid-template-columns:1fr; grid-auto-rows:auto; gap:12px; }
  .amenity-card,.amenity-card-large { min-height:360px; grid-column:1 !important; grid-row:auto !important; }
  .amenity-content { padding:20px; }
  .panorama-feature { min-height:420px; }
  .breakfast-card-photo { grid-template-columns:1fr; min-height:0; }
  .breakfast-photo { aspect-ratio:4/3; }
  .breakfast-body { padding:22px 18px 24px; }
  .breakfast-card-head { grid-template-columns:auto 1fr; }
  .breakfast-price { grid-column:2; text-align:left; margin-top:6px; }
  .breakfast-options { grid-template-columns:1fr; margin:22px 0 20px; }
  .interior-grid { grid-template-columns:1fr; gap:18px; }
  .interior-tall { grid-row:auto; min-height:0; aspect-ratio:4/5; }
  .interior-tall img { min-height:0; height:100%; }
  .interior-copy { padding:0; }
  .interior h2 { font-size:clamp(42px,12vw,58px); }
  .interior-slider-shell { grid-column:1; grid-template-columns:1fr; gap:8px; }
  .interior-nav { display:none; }
  .interior-slider { min-height:0; border-radius:14px; }
  .interior-slide img { height:auto; aspect-ratio:4/3; object-fit:cover; }
  .showcase-block { padding:13px; border-radius:16px; }
  .showcase-head { align-items:flex-start; }
  .showcase-head h3 { font-size:25px; }
  .showcase-nav { flex:0 0 auto; }
  .showcase-arrow { width:40px; height:40px; }
  .showcase-slide img { height:auto; aspect-ratio:4/3; object-fit:cover; }
  .showcase-slide span { left:10px; bottom:10px; }
  .pricing-grid,.events-grid,.rules-grid { grid-template-columns:1fr; }
  .pricing-card { padding:22px 18px; }
  .price-lines div { align-items:flex-start; flex-direction:column; gap:5px; }
  .price-lines span { max-width:none; text-align:left; }
  .rules-head h2 { font-size:clamp(40px,11vw,54px); }
  .rule-card summary { font-size:21px; padding:16px; }
  .rule-card > div { padding:0 16px 17px 16px; }
  .event-chip { min-height:64px; }
}


/* v19 premium desktop polish */
.panorama-feature {
  position: relative;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid rgba(211,176,108,.18);
  border-radius: 24px;
  background: rgba(255,255,255,.02);
}
.panorama-feature > img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 320px;
  object-fit: cover;
}
.panorama-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5,12,9,.08) 28%, rgba(5,12,9,.82) 100%);
  pointer-events: none;
}
.panorama-copy {
  position: absolute;
  z-index: 2;
  left: 24px;
  right: 24px;
  bottom: 22px;
  max-width: min(620px, 84%);
}
.panorama-copy span {
  display: block;
  margin-bottom: 10px;
  color: rgba(245,238,224,.88);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.panorama-copy h3 {
  margin: 0;
  color: #fff;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.04;
}

@media (min-width: 901px) {
  .amenities .section-head h2 {
    font-size: clamp(36px, 3vw, 52px);
    max-width: 720px;
  }

  .hero {
    min-height: 100vh;
    padding-bottom: 96px;
    background: radial-gradient(circle at top right, rgba(211,176,108,.06), transparent 24%), #05100c;
  }
  .hero-slideshow {
    inset: 84px 42px 98px 42px;
    border: 1px solid rgba(211,176,108,.22);
    border-radius: 18px;
    overflow: hidden;
    background: #07130e;
    box-shadow: 0 28px 90px rgba(0,0,0,.24);
  }
  .hero-slide {
    background: #07130e;
  }
  .hero-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 16px;
    transform: none !important;
    border: 1px solid rgba(211,176,108,.38);
    border-radius: 12px;
    background: radial-gradient(circle at center, rgba(255,255,255,.03), transparent 60%), #08140f;
  }
  .hero-shade {
    background: linear-gradient(90deg, rgba(5,12,9,.82) 0%, rgba(5,12,9,.56) 34%, rgba(5,12,9,.16) 66%, rgba(5,12,9,.06) 100%), linear-gradient(0deg, rgba(5,12,9,.58) 0%, rgba(5,12,9,.06) 42%);
  }
  .hero-copy {
    max-width: min(50vw, 760px);
    padding-top: 20vh;
  }

  .panorama-feature {
    max-width: 1380px;
    margin: 18px auto 0;
    min-height: 0;
    padding: 16px;
    border-radius: 22px;
  }
  .panorama-feature > img {
    min-height: 0;
    height: min(34vw, 460px);
    object-fit: cover;
    border: 1px solid rgba(211,176,108,.34);
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0,0,0,.16);
  }
  .panorama-overlay {
    inset: 16px;
    border-radius: 14px;
  }
  .panorama-copy {
    left: 42px;
    right: 42px;
    bottom: 38px;
    max-width: 480px;
  }
  .panorama-copy span { font-size: 10px; }
  .panorama-copy h3 {
    font-size: clamp(24px, 2.4vw, 38px);
    line-height: 1.08;
  }

  .breakfast-card {
    max-width: 1220px;
    margin: 22px auto 0;
  }
  .breakfast-card-photo {
    grid-template-columns: minmax(0,.76fr) minmax(0,1.24fr);
    min-height: 360px;
  }
  .breakfast-photo { min-height: 360px; }
  .breakfast-photo img { height: 100%; object-fit: cover; }
  .breakfast-body { padding: 28px 30px 30px; }
  .breakfast-card-head strong { font-size: clamp(22px, 2vw, 30px); }
  .breakfast-card-head p { font-size: 14px; }
  .breakfast-price strong { font-size: 30px; }
  .breakfast-options { margin: 20px 0 18px; gap: 8px; }
  .breakfast-options div { padding: 12px 13px; }

  .interior-slider,
  .interior-slide img {
    min-height: 430px;
    height: 430px;
  }

  .showcase-block {
    max-width: 1420px;
    margin-left: auto;
    margin-right: auto;
    padding: 24px;
  }
  .showcase-head h3 {
    font-size: clamp(18px, 1.85vw, 26px);
  }
  .showcase-viewport {
    padding: 18px;
    border: 1px solid rgba(211,176,108,.14);
    border-radius: 18px;
    background: rgba(255,255,255,.01);
  }
  .showcase-slide {
    background: transparent;
  }
  .showcase-slide img {
    height: min(38vw, 470px);
    object-fit: contain;
    border: 1px solid rgba(211,176,108,.34);
    border-radius: 14px;
    background: #08140f;
    box-shadow: 0 24px 60px rgba(0,0,0,.14);
  }
  .showcase-slide span {
    left: 34px;
    bottom: 32px;
    background: rgba(7,18,12,.74);
    backdrop-filter: blur(8px);
  }

  .film-strip {
    max-width: 1420px;
    margin: 0 auto;
    min-height: 0;
    padding: 20px;
    border: 1px solid rgba(211,176,108,.18);
    border-radius: 22px;
    background: rgba(255,255,255,.018);
    box-shadow: 0 24px 70px rgba(0,0,0,.16);
  }
  .film-strip video {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: min(74vh, 820px);
    object-fit: contain;
    border-radius: 14px;
    border: 1px solid rgba(211,176,108,.34);
    background: #06110d;
  }
  .film-strip-overlay {
    inset: 20px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(5,12,9,.08) 0%, rgba(5,12,9,.10) 52%, rgba(5,12,9,.70) 100%);
  }
  .film-strip-copy {
    left: 48px;
    right: 48px;
    bottom: 42px;
  }
  .film-strip-copy strong {
    max-width: 650px;
    font-size: clamp(24px, 2.8vw, 42px);
  }
}


/* v20: desktop gallery, two slideshow cards per row */
@media (min-width: 901px) {
  .gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
    row-gap: 18px;
    align-items: start;
  }
  .gallery > .section-head {
    grid-column: 1 / -1;
    width: 100%;
    margin-bottom: 8px;
  }
  .gallery > .showcase-block,
  .gallery > .showcase-block + .showcase-block {
    width: 100%;
    max-width: none;
    margin: 0;
    min-width: 0;
  }
  .gallery > .showcase-block:nth-of-type(3) {
    grid-column: 1 / -1;
    width: calc(50% - 9px);
    justify-self: center;
  }
  .gallery .showcase-head {
    min-height: 74px;
    align-items: flex-start;
  }
  .gallery .showcase-head h3 {
    font-size: clamp(18px, 1.55vw, 24px);
  }
  .gallery .showcase-viewport {
    padding: 12px;
  }
  .gallery .showcase-slide img {
    height: clamp(300px, 29vw, 410px);
    object-fit: contain;
  }
  .gallery .showcase-slide span {
    left: 26px;
    bottom: 24px;
  }
}

@media (max-width: 900px) {
  .gallery { display: block; }
  .gallery > .showcase-block,
  .gallery > .showcase-block + .showcase-block,
  .gallery > .showcase-block:nth-of-type(3) {
    width: auto;
    margin-top: 18px;
  }
}


/* v21: client photo update, unzoom slides, mobile cleanup */
.showcase-slide { position: relative; }
.showcase-slide::after {
  content: "🔍";
  position: absolute;
  top: 18px;
  right: 18px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(7,18,12,.72);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  font-size: 18px;
  line-height: 1;
  pointer-events: none;
}
.showcase-slide img,
.interior-slide img {
  object-fit: contain !important;
  object-position: center center !important;
  background: #08140f;
}
@media (max-width: 900px) {
  .availability-card::before { display: none; }
  .showcase-slide::after { top: 12px; right: 12px; width: 34px; height: 34px; font-size: 16px; }
}
@media (min-width: 901px) {
  .showcase-slide img { height: clamp(300px, 27vw, 400px) !important; }
  .interior-slide img { height: clamp(320px, 28vw, 430px) !important; }
}
