:root{--cream:#f8f4ea;--ink:#222d25;--forest:#202c24;--muted:#4e5549;--gold:#f5cb91;--line:#dcd5c6;--serif:"Instrument Serif",Georgia,serif;--sans:"DM Sans",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:1rem/1.6 var(--sans)}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #af6121;outline-offset:4px}
img{display:block;width:100%;object-fit:cover}
.wrap{width:min(1120px,calc(100% - 80px));margin-inline:auto}
.top{display:flex;align-items:center;justify-content:space-between;min-height:82px;gap:20px;border-bottom:1px solid var(--line)}
.brand{font:700 1.5rem var(--serif);text-decoration:none;white-space:nowrap}
nav{display:flex;gap:clamp(10px,4vw,42px);font-size:.88rem}
nav a{text-decoration:none}
nav a:hover{text-decoration:underline}
.hero{display:grid;grid-template-columns:1fr 1.06fr;gap:0 8%;align-items:center;padding-top:34px}
.intro{padding-block:26px}
.place{text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:750;margin:0 0 1.25rem}
h1,h2{font-family:var(--serif);font-weight:400;line-height:1.02;letter-spacing:-.055em;margin:0}
h1{font-size:clamp(3.7rem,8vw,7rem)}
h2{font-size:clamp(2.6rem,5vw,4.65rem)}
.lead,.stay p{color:var(--muted);max-width:39ch}
.lead{margin:1.6rem 0 1.8rem;font-size:1.13rem}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--forest);color:var(--cream);padding:.9rem 1.2rem;text-decoration:none;font-weight:650;border-radius:3px}
.button:hover{filter:brightness(1.2)}
.hero-photo{height:clamp(400px,46vw,570px);object-position:center 45%;border-radius:5px}
.facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);margin:34px 0 0;padding:21px 0}
.facts div{padding-inline:clamp(10px,3vw,32px);border-left:1px solid var(--line)}
.facts div:first-child{border:0;padding-left:0}
dt{color:var(--muted);font-size:.82rem}
dd,.rate{margin:0;font:400 clamp(1.14rem,2.6vw,2.1rem)/1.25 var(--serif)}
small{font:400 .85rem var(--sans)}
.stay{display:grid;grid-template-columns:.92fr 1fr;align-items:center;gap:9%;padding-block:90px}
.stay img{height:440px;object-position:center 42%;border-radius:5px}
.stay ul{list-style:none;padding:0;margin:1.5rem 0 0}
.stay li{padding:.52rem 0;border-top:1px solid var(--line)}
.gallery{background:#eee8db;padding:72px 0 80px}
.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:24px 16px;margin-top:28px}
.photos a{text-decoration:none}
figure{margin:0}
figure img{aspect-ratio:1/1.12;border-radius:4px;transition:filter .2s}
.photos a:hover img{filter:brightness(.87)}
figcaption{font-size:.88rem;margin-top:6px}
.booking{background:var(--forest);color:var(--cream);padding:64px 0}
.booking-inner{display:flex;justify-content:space-between;gap:24px;align-items:center}
.booking .place{color:var(--gold)}
.booking p:last-child{margin-bottom:0}
.booking .button{background:var(--gold);color:var(--forest);white-space:nowrap}
.rate{margin-bottom:.8rem}
footer{display:flex;justify-content:space-between;gap:12px;padding-block:22px;font-size:.85rem}
dialog{color:var(--cream);background:var(--forest);border:0;border-radius:5px;padding:0;max-width:calc(100% - 24px)}
dialog::backdrop{background:#101711e8}
.viewer{position:relative;width:min(720px,calc(100vw - 24px))}
.viewer img{height:min(70vh,680px);object-fit:contain}
.viewer button{border:0;color:inherit;background:#101711;border-radius:4px;cursor:pointer;font-size:1.55rem;width:44px;height:44px}
[data-close]{position:absolute;top:8px;right:8px}
.controls{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px;text-align:center}
.controls p{margin:0}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.top{min-height:65px}.hero,.stay{grid-template-columns:1fr}.hero{padding-top:8px}.intro{padding-block:30px}.hero-photo{height:clamp(310px,90vw,460px)}.facts{margin-top:22px}.stay{gap:26px;padding-block:56px}.stay img{height:310px;order:2}.gallery{padding:48px 0}.photos{grid-template-columns:repeat(2,1fr);gap:18px 12px}.booking{padding:48px 0}.booking-inner{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}figure img{transition:none}}
