/*
THESIS: Casa Kambanda adopts the supplied reference's composed, architectural elegance.
OWN-WORLD: Warm ivory, fine serif type, modest control radii, curved photography and leaf-patterned charcoal.
STORY: See the real home, understand the whole-house offer, inspect the rooms and request dates.
FIRST VIEWPORT: Ivory copy beside one large curved photograph; the dark house-details band overlaps its base.
FORM: The user's supplied composition is the chosen reference. Preserve real content and every working route.
*/
:root {
  --ink:#1b1a17;--ink-2:#302d28;--cream:#eee8df;--paper:#f5f1eb;
  --cream-2:#e8e0d5;--muted:#635d54;--line:#d8d0c5;--tan:#6d583e;
  --serif:"Playfair Display",Georgia,serif;--sans:Inter,system-ui,-apple-system,sans-serif;
  --pad:clamp(24px,4vw,60px);--radius:16px;
}
* {box-sizing:border-box}
html {background:#e6e0d8;scroll-behavior:smooth;scroll-padding-top:108px}
body {max-width:1440px;margin:16px auto;padding-bottom:24px;border-radius:24px;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
h1,h2,h3,p,figure,dl,dd {margin:0}
h1,h2,h3 {font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.025em;text-wrap:balance}
h1 {font-size:clamp(2.7rem,5.1vw,4.75rem);max-width:17ch}
h2 {font-size:clamp(2.2rem,3.6vw,3.35rem);max-width:22ch}
h3 {font-size:1.55rem}
p+p {margin-top:1rem}
h1+p,h2+p,h3+p {margin-top:1.4rem}
a {color:inherit;text-underline-offset:.3em}
button,input,textarea {font:inherit}
button {cursor:pointer;color:inherit}
button:disabled {cursor:default;opacity:.4}
button,a,input,textarea,summary {-webkit-tap-highlight-color:transparent}
:focus-visible {outline:3px solid #97601e;outline-offset:4px}
img,video {display:block;max-width:100%}
img {height:auto}
.wrap {width:100%;max-width:1440px;padding-inline:var(--pad);margin-inline:auto}
section {padding-block:clamp(44px,4.4vw,64px)}
.lead {font-size:1.02rem;color:var(--muted);max-width:54ch}
.eyebrow {display:flex;align-items:center;gap:12px;font-size:.68rem;font-weight:500;letter-spacing:.08em;color:var(--tan);margin-bottom:18px}
.eyebrow::before {content:"";width:20px;height:1px;background:currentColor;flex-shrink:0}
.fineprint,.form-note,figcaption {font-size:.79rem;color:var(--muted);line-height:1.65}
figcaption {padding-top:12px}
.link {display:inline-flex;align-items:center;gap:16px;min-height:44px;border:0;background:transparent;padding:8px 0;font-size:.81rem;font-weight:500;text-decoration:underline;text-underline-offset:.45em;text-decoration-thickness:1px}
.link>[aria-hidden],.btn>[aria-hidden] {font-size:1.12rem;line-height:1;transition:transform .2s ease-out}
.btn {display:inline-flex;justify-content:center;align-items:center;gap:22px;min-height:50px;padding:14px 23px;border:1px solid var(--ink);border-radius:7px;text-decoration:none;font-size:.8rem;font-weight:500;line-height:1.4;transition:background .2s,color .2s}
.btn--dark {background:var(--ink);color:var(--paper)}
.btn--light {background:var(--paper);color:var(--ink);border-color:var(--paper)}
.actions {display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:28px}
.skip-link {position:fixed;top:10px;left:16px;z-index:1100;padding:12px 20px;background:var(--ink);color:#fff;transform:translateY(-160%)}
.skip-link:focus {transform:none}
header {position:sticky;top:0;z-index:1000;border-radius:24px 24px 0 0;background:var(--paper)}
.nav {position:relative;display:flex;align-items:center;gap:28px;min-height:90px}
.logo {display:inline-flex;flex-direction:column;align-items:center;flex-shrink:0;white-space:nowrap;text-decoration:none}
.brand-casa {font:500 8px/1.4 var(--sans);letter-spacing:.3em;text-transform:uppercase;margin-left:.3em}
.brand-name {font:400 30px/1.15 var(--serif);letter-spacing:.015em}
.nav-links {display:flex;align-items:center;justify-content:flex-end;gap:25px;margin-left:auto}
.nav-links>a {white-space:nowrap;text-decoration:none;font-size:.75rem;font-weight:500;padding-block:12px}
.nav-links>a:not(.btn):hover,.nav-links>a[aria-current="page"] {text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}
.nav-links>.btn {min-height:44px;padding:12px 18px;gap:18px;font-size:.74rem}
.nav-tools {display:flex;align-items:center;gap:12px}
.language {display:flex;gap:2px;flex-shrink:0}
.language button {border:0;border-bottom:1px solid transparent;background:transparent;color:var(--muted);min-width:34px;min-height:44px;padding:6px;font-size:.7rem;font-weight:500}
.language button[aria-pressed="true"] {border-color:var(--ink);color:var(--ink)}
.burger {display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;width:44px;height:44px;border:0;border-radius:7px;background:transparent}
.burger span {height:1px;width:23px;background:currentColor}
.burger[aria-expanded="true"] span:first-child {transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2) {opacity:0}
.burger[aria-expanded="true"] span:last-child {transform:translateY(-6px) rotate(-45deg)}
.hero {background:var(--paper);padding-block:10px 0}
.hero-grid {display:grid;grid-template-columns:1fr 1.06fr;grid-template-rows:auto auto;column-gap:44px;padding-right:0}
.hero-heading {grid-column:1;grid-row:1;align-self:end;padding-top:32px}
.hero-copy {grid-column:1;grid-row:2;align-self:start;min-width:0;padding:0 12px 54px 0}
.hero h1 {font-size:clamp(3.4rem,6.4vw,6rem);line-height:1.04;letter-spacing:-.035em;max-width:none}
.hero h1>span,.hero h1>em {display:block}
.hero h1>em {font-weight:400;color:var(--ink)}
.hero .eyebrow {font-size:.67rem;letter-spacing:.035em;margin-bottom:25px}
.hero .lead {max-width:40ch;margin-top:25px;font-size:.93rem}
.hero .actions {margin-top:27px;gap:12px 24px}
.hero .fineprint {margin-top:18px;font-size:.71rem}
.hero-visual {position:relative;grid-column:2;grid-row:1/3;min-width:0}
.hero-photo {position:relative;height:565px;overflow:hidden;border-radius:150px 0 0 0;background:var(--cream-2)}
.hero-photo img {width:100%;height:100%;object-fit:cover;object-position:center bottom;animation:photo-arrive .8s cubic-bezier(.16,1,.3,1) both}
.hero-photo figcaption {position:absolute;bottom:48px;left:24px;padding:10px 14px;border-radius:6px;background:var(--paper);color:var(--ink);font:400 .72rem/1.45 var(--sans)}
@keyframes photo-arrive {from {clip-path:inset(0 0 4% 0)}to {clip-path:inset(0)}}
.house-facts {position:relative;z-index:1;margin:-24px var(--pad) 0;padding:30px 34px;border-radius:18px;background:var(--ink);color:var(--paper)}
.house-facts>.wrap {padding:0}
.stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}
.stat {padding-inline:25px;min-width:0}
.stat:first-child {padding-left:0}.stat:last-child {padding-right:0}
.stat+.stat {border-left:1px solid #4b463e}
.stat-title {font:400 clamp(1.2rem,1.75vw,1.65rem)/1.2 var(--serif);hyphens:auto;overflow-wrap:anywhere}
.stat p:not(.stat-title) {font-size:.72rem;margin-top:10px;color:#d4cdc3}
.section-grid {display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.section-grid>*,.booking-grid>*,.room-inner>* {min-width:0}
.approach {background:var(--paper)}
.approach .section-grid {align-items:center;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,88px)}
.approach .section-grid>div {grid-column:1;grid-row:1}
.approach h2 {font-size:clamp(2.3rem,3.8vw,3.6rem);max-width:15ch}
.approach p:not(.eyebrow) {color:var(--muted);font-size:.91rem;max-width:54ch}
.approach .link {margin-top:14px}
.about-photo {position:relative;grid-column:2;grid-row:1;width:100%}
.about-photo img {width:100%;height:410px;object-fit:cover;object-position:center 65%;border-radius:14px 80px 14px 14px}
.about-photo figcaption {font-size:.73rem;color:var(--muted);padding-top:12px}
.projects {background:var(--cream);border-radius:20px;margin:0 24px}
.projects>.wrap {padding-inline:calc(var(--pad) - 24px)}
.section-head {display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.section-head .eyebrow {margin-bottom:14px}
.proj-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.card {position:relative;text-decoration:none;min-width:0}
.card .frame {aspect-ratio:4/3;overflow:hidden;background:var(--cream-2);border-radius:12px}
.card img {width:100%;height:100%;object-fit:cover;object-position:center 65%;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.card-caption {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;font:400 1.2rem/1.3 var(--serif)}
.card-caption>[aria-hidden] {font:400 1.1rem/1.4 var(--sans);transition:transform .2s ease-out}
.projects .proj-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}
.projects .card .frame {height:235px;aspect-ratio:auto}
.projects .card[href$="#living"] img {object-position:center bottom}
.projects .card-caption {margin-top:12px;font-size:1.14rem;align-items:start}
.projects .card-caption>[aria-hidden] {display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border:1px solid #c4b8a8;border-radius:50%;font-size:.9rem}
.services {background:var(--paper)}
.services-grid {display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,6vw,88px);align-items:start}
.services h2 {max-width:15ch;font-size:clamp(2.4rem,3.5vw,3.3rem)}
.services .intro>p {max-width:38ch;margin-top:20px;font-size:.9rem;color:var(--muted)}
.svc-list {display:grid;gap:0}
.svc {display:grid;grid-template-columns:.85fr 1.15fr;gap:22px;padding:21px 0;border-top:1px solid var(--line)}
.svc h3 {font-size:1.3rem}.svc p {margin:0;font-size:.83rem;color:var(--muted)}
.notice {padding:15px 18px;border-radius:8px;background:var(--cream-2);color:var(--ink);font-size:.87rem}
.services .notice {margin-top:16px;font-size:.79rem;padding:12px 16px}
#location {padding-block:0;background:var(--paper)}
.location {align-items:center;gap:48px}
.location>div {padding-block:20px}
.location h2 {font-size:clamp(2.2rem,3.4vw,3.1rem);max-width:17ch}
.location p:not(.eyebrow) {font-size:.91rem;color:var(--muted)}
.location figure {position:relative;height:350px}
.location img {width:100%;height:100%;object-fit:cover;object-position:center;border-radius:14px}
.location figcaption {position:absolute;bottom:18px;left:18px;right:18px;width:fit-content;padding:9px 13px;border-radius:6px;background:var(--paper);color:var(--ink);font-size:.69rem}
.location .link {margin-top:14px}
.cta-section {margin:52px var(--pad) 40px;padding:40px;border-radius:16px;background:var(--cream-2);color:var(--ink)}
.cta-section>.wrap {padding:0}
.cta-section .section-grid {align-items:center;grid-template-columns:1.2fr .8fr;gap:46px}
.cta-section h2 {font-size:clamp(2.5rem,3.8vw,3.5rem);max-width:17ch}
.cta-section p:not(.eyebrow) {color:var(--muted);max-width:48ch;font-size:.9rem}
.cta-section .btn {margin-top:24px}
.contact-callout {border-left:1px solid #c3b7a8;padding-left:34px}
.contact-callout h3 {font-size:1.65rem}
.text-contact {display:block;margin-top:14px;font-size:.83rem;overflow-wrap:anywhere}
.page-hero {padding-block:36px 30px;background:var(--paper)}
.page-hero.compact {padding-block:40px 28px}
.page-hero>.wrap {display:grid;grid-template-columns:1.15fr 1fr;column-gap:clamp(24px,5vw,72px);align-items:end}
.page-hero .eyebrow {grid-column:1/-1;margin-bottom:17px}
.page-hero h1 {grid-column:1;max-width:17ch}
.page-hero .lead {grid-column:2;font-size:.93rem;max-width:46ch;margin:0;padding-bottom:6px}
.page-hero.compact h1 {font-size:clamp(2.6rem,4.7vw,4.3rem)}
.page-hero .fineprint {grid-column:1/-1;margin-top:18px}
.jump-links {grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 22px;margin-top:26px;padding-block:10px;border-block:1px solid var(--line)}
.jump-links a {display:inline-flex;align-items:center;min-height:44px;font-size:.75rem;text-decoration:none;border-bottom:1px solid transparent}
.jump-links a:hover {border-bottom-color:var(--ink)}
.room-summary {grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:24px}
.room-summary>div {display:grid;grid-template-columns:66px 1fr;column-gap:14px;align-content:start}
.room-summary img {grid-column:1;grid-row:1/4;width:66px;height:92px;object-fit:cover;object-position:center 65%;border-radius:6px}
.room-summary h2 {font-size:1.12rem;grid-column:2}.room-summary p:not(.eyebrow) {grid-column:2;font-size:.73rem;color:var(--muted);margin-top:7px}
.room-summary .eyebrow {grid-column:2;margin-bottom:6px;font-size:.64rem}
.rooms-page #main {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 30px;padding-inline:var(--pad)}
.rooms-page .page-hero,.room-cta {grid-column:1/-1}
.rooms-page .page-hero>.wrap {padding-inline:0}
.room {background:var(--paper);padding:24px 0 32px;border-bottom:1px solid var(--line)}
.room-inner {display:grid;grid-template-columns:1fr;gap:20px;padding-inline:0}
.room-media {position:relative;width:100%;min-width:0}
.room-media .frame {position:relative;width:100%;overflow:hidden;background:var(--cream-2);border-radius:12px}
.room-media .frame>a {display:block}
.room-media img {width:100%;height:330px;object-fit:cover;object-position:center 64%;transition:transform .5s cubic-bezier(.16,1,.3,1)}
#living .room-media img {object-position:center bottom}
.room-media .photo-open {position:absolute;right:12px;bottom:12px;padding:8px 12px;border-radius:6px;background:var(--paper);color:var(--ink);font-size:.71rem;pointer-events:none}
.room-text h2 {max-width:none;font-size:2.1rem}
.room-text .eyebrow {margin-bottom:10px}
.room-text p:not(.eyebrow) {color:var(--muted);max-width:60ch;font-size:.9rem}
.room-text p.room-facts {border-top:1px solid var(--line);padding-top:12px;margin-top:14px;font-size:.77rem}
.video-details {margin-top:10px}
summary {cursor:pointer;font-weight:500;min-height:44px;padding:10px 0}
.video-details video {margin-top:12px;width:100%;max-height:560px;border-radius:8px;background:var(--ink)}
.video-details summary {font-size:.79rem;text-decoration:underline;text-underline-offset:5px}
.room-cta {text-align:center;background:var(--ink-2);color:var(--paper);margin-block:36px;border-radius:16px}
.room-cta h2,.room-cta p {margin-inline:auto}
.room-cta p {color:var(--cream-2)}
.room-cta .eyebrow {justify-content:center;color:#d8c7b2}.room-cta .btn {margin-top:24px}
.contact-section {padding-top:20px;background:var(--paper)}
.contact-section .section-grid {grid-template-columns:.9fr 1.1fr}
.contact-section h2 {font-size:2.4rem}
.contact-section .section-grid>div>p {font-size:.95rem;color:var(--muted)}
.detail {display:grid;gap:20px;margin-top:24px}
.detail>div {padding-bottom:22px;border-bottom:1px solid var(--line)}
.detail dt {font-size:.75rem;color:var(--tan);margin-bottom:8px}
.detail dd {overflow-wrap:anywhere;font-size:.95rem}.detail+ .link {margin-top:18px}
form {display:grid;gap:20px}
#contactForm {grid-template-columns:1fr 1fr;padding:34px;border:0;border-radius:16px;background:#fffdf9;box-shadow:0 8px 32px rgba(47,41,30,.06);column-gap:22px}
#contactForm>.field--wide,#contactForm>p,#contactForm>button,#contactForm>noscript {grid-column:1/-1}
.field {display:grid;gap:9px;min-width:0}
.field label {font-size:.83rem;font-weight:500;color:var(--ink)}
.field input,.field textarea {width:100%;min-width:0;max-width:100%;min-height:50px;border:1px solid #8b8173;border-radius:7px;background:#fffdf9;color:var(--ink);font-size:16px;padding:12px 14px;transition:border-color .2s}
.field textarea {resize:vertical;min-height:110px}
.field input:focus,.field textarea:focus {border-color:var(--ink)}
.form-note {min-height:1.4em}
.form-note[data-state="success"] {color:#24543d;background:#e5efe7;padding:14px;border-left:1px solid #24543d}
.form-note[data-state="error"] {color:#852f22;background:#f9eae5;padding:14px;border-left:1px solid #852f22}
.booking-section {padding-top:20px}
.booking-grid {display:grid;grid-template-columns:1.05fr 1fr;gap:32px;align-items:start}
.calendar-panel,.guest-panel {padding:34px;background:#fffdf9;border-radius:16px;box-shadow:0 8px 32px rgba(47,41,30,.06)}
.booking-grid h2 {font-size:1.8rem}
.date-inputs {display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.calendar-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:30px}
.calendar-heading h3 {font-size:1.75rem;margin-top:6px}
.calendar-heading h3::first-letter {text-transform:uppercase}
.month-controls {display:flex;gap:6px;flex-shrink:0}
.month-btn {height:44px;min-width:44px;border:1px solid var(--line);border-radius:7px;background:transparent;font-size:1.4rem}
#calendarPrompt {margin:18px 0 10px;font-size:.85rem;font-weight:500}
.calendar {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.day-name {text-align:center;font-size:.67rem;letter-spacing:.04em;font-weight:500;color:var(--muted);padding:12px 0}
.day {min-width:0;min-height:48px;display:grid;place-items:center;border:1px solid transparent;border-radius:7px;background:transparent;font-size:.94rem}
.day[aria-current="date"] {border-color:var(--tan)}
.day.past,.day.blank {color:var(--muted);opacity:.65}
.day.selected-mid {background:var(--cream-2);border-radius:0}
.day.selected-start,.day.selected-end {background:var(--ink);color:var(--paper);border-color:var(--ink)}
.calendar-bottom {display:flex;align-items:start;gap:16px;justify-content:space-between;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.calendar-bottom .fineprint {max-width:32ch}
.calendar-bottom button {flex-shrink:0;margin-top:-8px}
.conditions {margin-top:28px;padding:28px 0 0;border-top:1px solid var(--line)}
.conditions h2 {font-size:1.5rem}
.conditions p,.conditions li {font-size:.85rem;color:var(--muted)}
.conditions ul {padding-left:20px;margin:18px 0}
.conditions li+li {margin-top:12px}
.guest-panel {display:grid;gap:20px}
.stay-summary {background:var(--cream-2);border-radius:8px;padding:14px 16px;font-size:.94rem;font-weight:500;min-height:54px}
.guest-panel h2+p {margin-top:0}
.guest-panel .fineprint {margin-top:0}
#capacityHint {margin-top:-12px}
.consents {display:grid;gap:8px;border-top:1px solid var(--line);padding-top:16px}
.check-row {display:flex;align-items:flex-start;gap:12px;min-height:44px;padding-block:8px;font-size:.85rem;cursor:pointer}
.check-row input {appearance:auto;width:20px;height:20px;min-width:20px;flex:0 0 20px;margin:2px 0 0;accent-color:var(--ink)}
.check-row span {flex:1}
.guest-panel .btn {width:100%}

.contact-photo {position:relative;margin-top:24px}
.contact-photo img {width:100%;height:230px;object-fit:cover;object-position:center;border-radius:70px 12px 12px 12px}
.contact-photo figcaption {font:italic 400 1.1rem/1.4 var(--serif);padding-top:10px}

footer {background:var(--ink);color:var(--paper);padding:48px 0 24px;margin-inline:24px;border-radius:20px}
footer>.wrap {padding-inline:calc(var(--pad) - 4px)}
.foot-top {display:grid;grid-template-columns:1.25fr .7fr 1fr;gap:48px}
footer .logo {align-items:flex-start}footer .brand-casa {font-size:10px}footer .brand-name {font-size:54px}
.blurb {max-width:32ch;color:#d4cdc3;margin-top:22px;font-size:.84rem}
.fcol {display:flex;flex-direction:column;align-items:start;gap:9px;min-width:0}
.fcol h3 {font:500 .65rem/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#d8c7b2;margin-bottom:16px}
.fcol a {font-size:.83rem;color:#e5ded3;overflow-wrap:anywhere;max-width:100%}
.fcol .link {padding:0;min-height:36px;text-decoration:none}
.foot-bottom {display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;border-top:1px solid #595247;margin-top:32px;padding-top:22px;color:#cfc6ba;font-size:.7rem}
/* Reuse the approved leaves as a decorative layer behind each surface. */
.house-facts,.room-cta,footer {position:relative;isolation:isolate}
.house-facts::before,.room-cta::before,footer::before {
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:url("casa-botanical-leaves-v1.webp") center/cover no-repeat;
  mix-blend-mode:screen;opacity:.14;
}
.room-cta::before {background-position:center 62%}
footer::before {background-position:center bottom}
/* Inverting the black artwork makes its background disappear into light surfaces. */
:is(.hero,.approach,.projects,.services,#location,.cta-section,.page-hero,.room,.contact-section,.booking-section) {position:relative;isolation:isolate}
:is(.hero,.approach,.projects,.services,#location,.cta-section,.page-hero,.room,.contact-section,.booking-section)::before {
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:url("casa-botanical-leaves-v1.webp") center/cover no-repeat;
  mask-image:linear-gradient(transparent,#000 30px,#000 calc(100% - 30px),transparent);
  filter:grayscale(1) invert(1);mix-blend-mode:multiply;opacity:.12;
}
.hero::before,.page-hero::before {background-position:left top}
.approach::before,.contact-section::before {background-position:right center}
.projects::before {opacity:.09}
.cta-section::before {background-position:center 62%;opacity:.07}
@media(hover:hover) {
  .btn--dark:hover {background:var(--ink-2)}.btn--light:hover {background:var(--cream-2)}
  .btn:hover>[aria-hidden],.link:hover>[aria-hidden] {transform:translateX(4px)}
  .card:hover img,.room-media .frame>a:hover img {transform:scale(1.035)}
  .card:hover .card-caption>[aria-hidden] {transform:translate(2px,-2px)}
  .day:not(:disabled):not(.selected-start):not(.selected-end):hover,.month-btn:not(:disabled):hover {background:var(--cream-2);border-color:var(--tan)}
}

@media(max-width:1472px) {body {margin:16px}}
@media(max-width:1100px) {
  .nav {gap:20px}.nav-links {gap:18px}.nav-links>.btn {padding-inline:14px}.brand-name {font-size:28px}
  .hero-grid {column-gap:28px;grid-template-columns:1fr 1fr}
  .hero-photo {height:530px;border-top-left-radius:120px}
  .hero .actions {gap:10px 18px}.hero .btn {padding-inline:18px;gap:16px}
  .house-facts {padding:26px}.stat {padding-inline:18px}
  .projects .card .frame {height:205px}
  .room-summary {gap:16px}.room-summary>div {grid-template-columns:54px 1fr;gap:10px}.room-summary img {width:54px}
  .room-summary h2 {font-size:1.02rem}
  .services-grid {gap:36px}.svc {gap:16px}
}
@media(max-width:1000px) {
  .nav {min-height:78px}.nav-tools {margin-left:auto}.burger {display:flex}
  .js .nav-links {display:none}
  .nav-links,.js .nav-links.open {display:flex;position:absolute;top:100%;left:var(--pad);right:var(--pad);z-index:1;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px;max-height:calc(100svh - 110px);overflow-y:auto;flex-direction:column;align-items:stretch;gap:4px}
  .nav-links>a {min-height:48px;padding:12px 10px;font-size:.93rem}
  .nav-links>.btn {margin-top:8px;font-size:.81rem}
  html:not(.js) header {position:relative}html:not(.js) .nav {flex-wrap:wrap}
  html:not(.js) .nav-links {position:static;order:3;width:100%;margin-bottom:16px}html:not(.js) .burger {display:none}
  .hero .eyebrow {font-size:.59rem;gap:8px}
  .hero h1 {font-size:clamp(3rem,6.2vw,4.4rem)}
  .hero-copy {padding-bottom:48px}.hero .lead {font-size:.87rem}
  .hero .actions {gap:8px 14px}.hero .actions .link {font-size:.75rem}
  .hero .fineprint {font-size:.65rem}
  .house-facts {padding:24px}.stat {padding-inline:16px}.stat-title {font-size:1.18rem}
  .stat p:not(.stat-title) {font-size:.67rem}
  .approach .section-grid {gap:36px}.about-photo img {height:390px}
  .booking-grid {gap:24px}.calendar-panel,.guest-panel {padding:26px}
  #contactForm {padding:26px;grid-template-columns:1fr}#contactForm>* {grid-column:1}
  .room-media img {height:285px}.room-text h2 {font-size:1.9rem}
  .foot-top {gap:32px}
}
@media(max-width:850px) {
  .hero-photo {height:515px;border-top-left-radius:100px}
  .hero .actions {flex-direction:column;align-items:start;gap:7px}
  .hero .lead {margin-top:20px}.hero .actions {margin-top:20px}
  .booking-grid {grid-template-columns:1fr}
  .page-hero>.wrap {column-gap:28px}
  .room-summary {grid-template-columns:1fr;gap:16px}
  .room-summary>div {grid-template-columns:64px 1fr;column-gap:14px}
  .room-summary img {width:64px;height:82px}
  .room-summary h2 {font-size:1.15rem}
  .room-summary p:not(.eyebrow) {margin-top:5px}
  .services-grid {grid-template-columns:1fr;gap:26px}
  .services .intro {display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:28px}
  .services .intro>p {margin:0;max-width:44ch}
  .svc {grid-template-columns:.75fr 1.25fr}
  .location {gap:30px}
  .cta-section {padding:32px}.cta-section .section-grid {gap:30px}.contact-callout {padding-left:26px}
}
@media(max-width:760px) {
  :root {--pad:26px}
  body {margin:8px;padding-bottom:16px;border-radius:18px}
  html {scroll-padding-top:92px}header {border-radius:18px 18px 0 0}
  section {padding-block:42px}
  .hero {padding-top:16px}
  .hero-grid {grid-template-columns:1fr;grid-template-rows:auto auto auto;padding-inline:var(--pad)}
  .hero-heading,.hero-copy,.hero-visual {grid-column:1}
  .hero-heading {grid-row:1;padding:0}
  .hero-copy {grid-row:2;padding:0 0 24px}
  .hero-visual {grid-row:3}
  .hero .eyebrow {font-size:.65rem;margin-bottom:18px}
  .hero h1 {font-size:clamp(3.2rem,8.2vw,4.7rem)}
  .hero .lead {max-width:55ch;margin-top:20px;font-size:.92rem}
  .hero .actions {flex-direction:row;align-items:center;gap:12px 24px;margin-top:20px}
  .hero .actions .link {font-size:.8rem}.hero .fineprint {font-size:.7rem;margin-top:14px}
  .hero-photo {height:340px;border-radius:90px 12px 12px 12px}
  .hero-photo figcaption {bottom:40px;left:18px;font-size:.69rem;padding:9px 12px}
  .house-facts {margin-top:-20px;padding:24px}
  .stats {grid-template-columns:1fr 1fr;gap:22px 0;align-items:start}
  .stat {padding-inline:22px}.stat:nth-child(odd) {padding-left:0;border-left:0}
  .stat-title {font-size:1.35rem}.stat p:not(.stat-title) {font-size:.7rem;margin-top:8px}
  .section-grid {grid-template-columns:1fr;gap:28px}
  .approach .section-grid {grid-template-columns:1fr 1fr;gap:26px}
  .approach h2 {font-size:2.2rem}
  .approach p:not(.eyebrow) {font-size:.85rem}
  .about-photo img {height:370px;border-top-right-radius:60px}
  .projects {margin-inline:16px}.projects>.wrap {padding-inline:20px}
  .projects .proj-grid {grid-template-columns:1fr 1fr;gap:24px 18px}
  .projects .card .frame {height:215px}.projects .card-caption {font-size:1.1rem}
  .section-head {gap:16px}.section-head .link {max-width:15ch;font-size:.75rem}
  .services h2 {font-size:2.5rem}
  .location {grid-template-columns:1fr;gap:24px}.location>div {padding:0}
  .location figure {height:300px}.location figcaption {font-size:.68rem}
  .cta-section {margin:40px var(--pad) 28px;padding:28px}
  .cta-section .section-grid,.contact-section .section-grid {grid-template-columns:1fr;gap:26px}
  .contact-callout {border-left:0;border-top:1px solid #c3b7a8;padding:24px 0 0}
  .cta-section h2 {font-size:2.65rem}
  .page-hero,.page-hero.compact {padding-block:26px}
  .page-hero>.wrap {grid-template-columns:1fr}
  .page-hero h1,.page-hero.compact h1 {grid-column:1;font-size:clamp(2.5rem,6.6vw,3.5rem)}
  .page-hero .lead {grid-column:1;margin-top:17px;font-size:.91rem}
  .page-hero .eyebrow {margin-bottom:14px}.page-hero .fineprint {margin-top:16px}
  .jump-links {margin-top:20px;gap:0 18px;padding-block:6px}.jump-links a {font-size:.72rem}
  .rooms-page #main {grid-template-columns:1fr}
  .room {padding-block:22px 28px}.room-media img {height:360px}
  .room-cta {margin-block:30px;padding-inline:0}.room-cta>.wrap {padding-inline:24px}
  .contact-section {padding-top:12px}#contactForm {padding:24px;grid-template-columns:1fr 1fr}
  #contactForm>.field:not(.field--wide) {grid-column:auto}
  .contact-photo img {height:250px}
  .booking-section {padding-top:12px}.calendar-panel,.guest-panel {padding:26px}
  footer {margin-inline:16px;border-radius:16px;padding-top:36px}
  footer>.wrap {padding-inline:26px}
  .foot-top {grid-template-columns:1fr 1fr;gap:28px}.foot-top>div:first-child {grid-column:1/-1}
}
@media(max-width:480px) {
  :root {--pad:20px}
  .nav {gap:12px;min-height:72px}.brand-name {font-size:26px}
  .nav-tools {gap:8px}.language button {min-width:30px}
  .hero h1 {font-size:clamp(2.8rem,11.8vw,3.6rem)}
  .hero .eyebrow {font-size:.6rem;letter-spacing:.015em;gap:8px}
  .hero .lead {font-size:.88rem;margin-top:18px}
  .hero .actions {gap:10px 20px}.hero .btn {padding:13px 18px;gap:16px;min-height:48px}
  .hero .actions .link {font-size:.76rem;gap:14px}.hero .fineprint {font-size:.66rem}
  .hero-photo {height:300px;border-top-left-radius:76px}
  .hero-photo figcaption {font-size:.65rem;left:14px}
  .house-facts {padding:23px 20px;border-radius:14px}
  .stat {padding-inline:16px}.stat-title {font-size:1.15rem}.stat p:not(.stat-title) {font-size:.65rem}
  .approach .section-grid {grid-template-columns:1fr;gap:26px}
  .approach .section-grid>div,.about-photo {grid-column:1;grid-row:auto}
  .approach h2 {font-size:2.65rem}.approach p:not(.eyebrow) {font-size:.9rem}
  .about-photo img {height:320px}.about-photo figcaption {font-size:.7rem}
  .section-head {align-items:start;flex-direction:column;gap:10px}.section-head .link {max-width:none}
  .projects {margin-inline:12px}.projects>.wrap {padding-inline:16px}
  .projects .proj-grid {gap:22px 14px}.projects .card .frame {height:170px}
  .projects .card-caption {font-size:.99rem;gap:5px}
  .projects .card-caption>[aria-hidden] {width:23px;height:23px;font-size:.78rem}
  .proj-grid {grid-template-columns:1fr}
  .services .intro {grid-template-columns:1fr;gap:16px}.services h2 {font-size:2.5rem}
  .svc {grid-template-columns:1fr;gap:9px;padding-block:19px}.svc h3 {font-size:1.4rem}.svc p {font-size:.85rem}
  .location figure {height:250px}.location figcaption {font-size:.62rem;left:12px;right:12px}
  .cta-section {padding:25px}.cta-section h2 {font-size:2.4rem}
  .room-media img {height:290px}.room-text h2 {font-size:1.95rem}
  .calendar-panel,.guest-panel,#contactForm {padding:21px}#contactForm {grid-template-columns:1fr}
  .date-inputs {gap:12px}.date-inputs input {padding:10px 6px}
  .calendar-heading {gap:10px}.calendar-heading h3 {font-size:1.5rem}
  .month-controls {gap:4px}.month-btn {min-width:40px}
  .calendar-bottom {flex-direction:column;gap:6px}.day {min-height:42px}.day-name {font-size:.59rem;letter-spacing:0}
  footer {margin-inline:12px}footer>.wrap {padding-inline:22px}
  .foot-top {grid-template-columns:1fr;gap:28px}.foot-top>div:first-child {grid-column:1}
  footer .brand-name {font-size:48px}.foot-bottom {gap:10px;margin-top:28px}
}
@media(max-width:350px) {
  :root {--pad:16px}.brand-name {font-size:23px}.nav-tools {gap:4px}.nav {gap:8px}
  .hero h1 {font-size:2.65rem}.hero .actions {gap:8px 13px}
  .hero .btn {padding-inline:14px;font-size:.75rem}.hero .actions .link {font-size:.71rem;gap:8px}
  .hero .eyebrow {font-size:.55rem}
  .house-facts {padding-inline:16px}.stat {padding-inline:12px}.stat-title {font-size:1.04rem}
  .projects .card .frame {height:155px}.projects .card-caption {font-size:.9rem}
  .date-inputs {grid-template-columns:1fr}.calendar-panel,.guest-panel,#contactForm {padding:17px}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {animation:none!important;transition:none!important}
}

/* An image-led viewing frame: size to the photograph, with a compact editorial caption. */
html.gallery-open {overflow:hidden}
.house-gallery {width:max-content;min-width:min(420px,calc(100vw - 48px));max-width:min(1080px,calc(100vw - 48px));max-height:calc(100svh - 48px);padding:0;border:0;border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:0 28px 100px #0007;overflow:auto}
.house-gallery::backdrop {background:rgba(21,20,17,.88);backdrop-filter:blur(8px)}
.house-gallery[open] {animation:gallery-appear .18s ease-out}
.gallery-toolbar {position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:12px 20px;background:var(--paper)}
.gallery-toolbar p {margin:0;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tan)}
.gallery-close,.gallery-controls button {display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;padding:0;border:0;border-radius:6px;background:transparent;color:var(--ink);font-size:1.35rem;line-height:1}
.gallery-close {width:36px;height:36px;font-size:1.5rem}
.gallery-content {display:block;min-width:0}
.gallery-stage {display:flex;align-items:center;justify-content:center;min-width:0;padding:0 12px;background:var(--paper)}
.gallery-stage img {display:block;width:auto;height:auto;max-width:min(1056px,calc(100vw - 72px));max-height:calc(100svh - 230px);object-fit:contain}
.gallery-stage img[hidden] {display:none}
.gallery-stage:has(img[hidden]) {min-height:300px}
.gallery-stage p {max-width:38ch;padding:32px;color:var(--muted);font-size:.9rem;text-align:center}
.gallery-stage p:empty {display:none}
.gallery-caption {display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 24px 24px;max-width:1056px}
.gallery-caption>div:first-child {min-width:0;flex:1}
.gallery-caption h2 {font-size:1.65rem;line-height:1.15;margin:0;letter-spacing:-.025em;max-width:24ch;text-wrap:balance}
.gallery-caption p:not(.eyebrow) {font-size:.8rem;line-height:1.55;color:var(--muted);max-width:52ch;margin:10px 0 0}
.gallery-caption .link {margin-top:12px;font-size:.75rem}
.gallery-caption .link[hidden] {display:none}
.gallery-controls {display:flex;align-items:center;gap:4px;flex-shrink:0}
.gallery-controls .eyebrow {font:400 .65rem var(--sans);letter-spacing:.06em;color:var(--muted);white-space:nowrap;margin:0 12px 0 0;padding:0}
.gallery-controls .eyebrow::before {display:none}
.gallery-controls button {border:1px solid var(--line)}
.gallery-close:hover,.gallery-controls button:hover {background:var(--cream-2)}
.gallery-close:focus-visible,.gallery-controls button:focus-visible {outline:2px solid var(--tan);outline-offset:2px}

@keyframes gallery-appear {from {opacity:0;transform:translateY(8px)}to {opacity:1;transform:translateY(0)}}
@media(max-width:760px) {
 .house-gallery {min-width:0;width:calc(100vw - 24px);max-width:none;max-height:calc(100svh - 24px);border-radius:10px}
 .gallery-toolbar {padding:8px 12px;gap:12px}.gallery-toolbar p {font-size:.59rem;letter-spacing:.08em}
 .gallery-close {width:44px;height:44px}
 .gallery-stage {padding:0 8px}.gallery-stage img {max-width:100%;max-height:calc(100svh - 250px)}
 .gallery-caption {padding:16px;gap:16px;flex-wrap:wrap}
 .gallery-caption h2 {font-size:1.4rem}.gallery-caption>div:first-child {flex-basis:100%}
 .gallery-controls {width:100%;gap:6px}.gallery-controls .eyebrow {margin-right:auto}
}
@media(prefers-reduced-motion:reduce) {.house-gallery[open] {animation:none}}

