:root{
  --bg:#f6f3ee;
  --ink:#2c2f30;
  --muted:#6d7376;
  --accent:#35565c;
  --accent-dk:#294247;
  --line:#dcd6cc;
  --white:#ffffff;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Jost',system-ui,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.12}
.eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);font-weight:400}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}

/* NAV */
header{
  position:fixed;top:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 42px;transition:background .4s ease,padding .4s ease,box-shadow .4s ease;
}
header.scrolled{background:rgba(246,243,238,.96);padding:14px 42px;box-shadow:0 1px 0 var(--line)}
/* pages with no hero image behind the nav: the bar needs its own background,
   otherwise page content scrolls through it */
header.solid{background:var(--bg);padding:16px 42px;box-shadow:0 1px 0 var(--line)}
.brand{font-family:'Cormorant Garamond',serif;font-size:1.5rem;letter-spacing:.06em;color:#fff;transition:color .4s}
header.scrolled .brand{color:var(--ink)}
header.solid .brand{color:var(--ink)}
nav ul{display:flex;gap:28px;list-style:none;align-items:center}
nav a{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;transition:color .4s,opacity .3s;opacity:.72;display:inline-block}
header.scrolled nav a,header.solid nav a{color:var(--ink)}
nav a:hover{opacity:1}
/* current page: full strength plus an underline, so it reads at a glance */
nav a.active{opacity:1;font-weight:500}
nav a.active:not(.book-btn)::after{content:"";display:block;height:2px;background:currentColor;margin-top:6px;border-radius:1px}
nav a.book-btn.active{background:rgba(255,255,255,.22);border-color:#fff;opacity:1}
header.scrolled nav a.book-btn.active,header.solid nav a.book-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
.book-btn{border:1px solid rgba(255,255,255,.7);padding:9px 20px;border-radius:2px;transition:all .35s}
header.scrolled .book-btn,header.solid .book-btn{border-color:var(--accent);color:var(--accent)}
.book-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff !important;opacity:1}
.menu-toggle{display:none;background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer}
header.scrolled .menu-toggle,header.solid .menu-toggle{color:var(--ink)}

/* HERO (home, full) */
.hero{position:relative;height:100vh;min-height:600px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
.hero-img{position:absolute;inset:0;z-index:0}
.hero-img img{transform:scale(1.08);animation:kenburns 14s ease-out forwards}
@keyframes kenburns{to{transform:scale(1)}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,28,30,.35),rgba(20,28,30,.15) 40%,rgba(20,28,30,.5));z-index:1}
.hero-content{position:relative;z-index:2;color:#fff;max-width:820px;padding:0 24px}
.hero-content .eyebrow{color:#efe9dd}
.hero h1{font-size:clamp(2.8rem,6.5vw,5.2rem);margin:.28em 0 .32em;color:#fff}
.hero p{font-size:clamp(1rem,1.6vw,1.28rem);font-weight:300;max-width:600px;margin:0 auto 1.8em;color:#f4efe6}
.hero .book-btn{display:inline-block;border-color:#fff;color:#fff;padding:13px 34px;letter-spacing:.2em;font-size:.78rem;text-transform:uppercase}
.hero .book-btn:hover{background:#fff;color:var(--ink) !important}

/* INNER HERO (shorter) */
.page-hero{position:relative;height:64vh;min-height:440px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;text-align:center}
.page-hero .hero-img img{transform:scale(1.06);animation:kenburns 12s ease-out forwards}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,28,30,.3),rgba(20,28,30,.5));z-index:1}
.page-hero .hero-content{padding-bottom:9vh}
.page-hero h1{font-size:clamp(2.4rem,5.5vw,4.4rem);color:#fff;margin:.2em 0 0}

/* rise-on-load stagger */
.rise{opacity:0;transform:translateY(28px);animation:riseIn 1s cubic-bezier(.22,.61,.36,1) forwards}
.d1{animation-delay:.3s}.d2{animation-delay:.55s}.d3{animation-delay:.8s}.d4{animation-delay:1.1s}
@keyframes riseIn{to{opacity:1;transform:translateY(0)}}

/* INTRO / PROSE */
.intro{max-width:760px;margin:0 auto;padding:110px 24px 90px;text-align:center}
.intro h2{font-size:clamp(2rem,4vw,2.9rem);margin:.3em 0 .5em}
.intro p{color:var(--muted);font-size:1.08rem}
.prose{max-width:720px;margin:0 auto;padding:90px 24px;text-align:center}
.prose h2{font-size:clamp(1.9rem,3.6vw,2.6rem);margin:.3em 0 .5em}
.prose p{color:var(--muted);font-size:1.06rem;margin-bottom:1.1em}

/* SPLIT */
.split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:78vh}
.split.rev .txt{order:2}
.split.rev .media{order:1}
.split .media{overflow:hidden;min-height:52vh}
.split .media img{transition:transform 1.4s ease}
.split:hover .media img{transform:scale(1.05)}
.split .txt{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,7vw,100px)}
.split .txt h2{font-size:clamp(2rem,3.6vw,3rem);margin:.28em 0 .5em}
.split .txt p{color:var(--muted);margin-bottom:1.4em}
.txt-link{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:4px;align-self:flex-start;transition:opacity .3s}
.txt-link:hover{opacity:.55}

/* activity cards */
.doings{padding:110px 42px;text-align:center;background:#efeae1}
.doings h2{font-size:clamp(2rem,4vw,2.9rem);margin-bottom:.2em}
.doings > .eyebrow{display:block;margin-bottom:.4em}
.doings .lead{color:var(--muted);max-width:620px;margin:0 auto 3.4em}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px;max-width:1080px;margin:0 auto}
.card .ph{aspect-ratio:4/3;overflow:hidden;margin-bottom:1.1em}
.card .ph img{transition:transform 1.2s ease}
.card:hover .ph img{transform:scale(1.06)}
.card h3{font-size:1.5rem;margin-bottom:.25em}
.card p{color:var(--muted);font-size:.95rem}

/* feature list (things to do detail) */
.features{max-width:1040px;margin:0 auto;padding:20px 24px 40px}
.feature{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;margin-bottom:14px;background:#fff;overflow:hidden;border:1px solid var(--line)}
.feature.rev .f-txt{order:2}.feature.rev .f-media{order:1}
.feature .f-media{min-height:300px;overflow:hidden}
.feature .f-txt{padding:clamp(30px,4vw,54px);display:flex;flex-direction:column;justify-content:center}
.feature .f-txt h3{font-size:1.7rem;margin:.2em 0 .4em}
.feature .f-txt p{color:var(--muted)}

/* gallery */
.gallery{padding:120px 24px 40px;text-align:center}
.gallery h2{font-size:clamp(2rem,4vw,2.9rem);margin:.2em 0 1.6em}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:1200px;margin:0 auto}
.grid .tile{aspect-ratio:4/3;overflow:hidden}
.grid .tile img{transition:transform 1s ease}
.grid .tile:hover img{transform:scale(1.07)}

/* faq accordion */
.faq{max-width:820px;margin:0 auto;padding:0 24px 40px}
.faq-group{margin-bottom:52px}
.faq-group > .eyebrow{display:block;margin-bottom:1.1em}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;
  font-family:'Cormorant Garamond',serif;font-size:1.32rem;line-height:1.3;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'';position:absolute;right:8px;top:50%;width:11px;height:11px;
  border-right:1px solid var(--accent);border-bottom:1px solid var(--accent);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s ease;
}
.faq details[open] summary::after{transform:translateY(-20%) rotate(225deg)}
.faq summary:hover{color:var(--accent)}
.faq .ans{padding:0 44px 24px 0;color:var(--muted);font-size:1rem}
.faq .ans p + p{margin-top:.7em}

/* signup band */
.signup{background:var(--accent);color:#fff;padding:96px 24px;text-align:center}
.signup h2{font-size:clamp(1.9rem,3.6vw,2.7rem);color:#fff;margin:.2em 0 .5em}
.signup p{max-width:560px;margin:0 auto 2em;color:#e5ecec}
.signup form{display:flex;gap:10px;max-width:480px;margin:0 auto;flex-wrap:wrap;justify-content:center}
.signup input{flex:1;min-width:220px;padding:14px 18px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);color:#fff;font-family:inherit;font-size:.95rem}
.signup input::placeholder{color:#cdd8d8}
.signup button{padding:14px 26px;background:#fff;color:var(--accent);border:none;font-family:inherit;letter-spacing:.14em;text-transform:uppercase;font-size:.76rem;cursor:pointer;transition:opacity .3s}
.signup button:hover{opacity:.82}
.signup .fine{font-size:.76rem;color:#c4d0d0;margin:1.4em auto 0}

/* CTA */
.cta{position:relative;padding:130px 24px;text-align:center;color:#fff;overflow:hidden}
.cta-img{position:absolute;inset:0;z-index:0}
.cta::after{content:"";position:absolute;inset:0;background:rgba(30,40,42,.52);z-index:1}
.cta-inner{position:relative;z-index:2;max-width:640px;margin:0 auto}
.cta h2{font-size:clamp(2.2rem,4.4vw,3.2rem);color:#fff;margin:.3em 0 .5em}
.cta p{color:#eee;margin-bottom:1.8em}
.cta .book-btn{display:inline-block;border-color:#fff;color:#fff;padding:14px 40px;letter-spacing:.2em;text-transform:uppercase;font-size:.78rem}
.cta .book-btn:hover{background:#fff;color:var(--ink) !important}

/* booking page */
/* booking page: calendar first, no hero, so it is reachable without scrolling */
.book-head{max-width:760px;margin:0 auto;padding:126px 24px 0;text-align:center}
.book-head h1{font-size:clamp(2.1rem,4.4vw,3.2rem);margin:.24em 0 .34em}
.book-head p{color:var(--muted);max-width:560px;margin:0 auto}
.book-wrap{max-width:900px;margin:0 auto;padding:34px 24px 90px}
.book-wrap .lead{text-align:center;color:var(--muted);max-width:620px;margin:0 auto 3em}
.book-note{text-align:center;color:var(--muted);font-size:.94rem;max-width:640px;margin:28px auto 0}
.rates{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:50px}
.rate{border:1px solid var(--line);background:#fff;padding:34px 26px;text-align:center}
.rate h3{font-size:1.4rem;margin-bottom:.3em}
.rate .price{font-family:'Cormorant Garamond',serif;font-size:2.2rem;color:var(--accent)}
.rate .price small{font-size:.9rem;color:var(--muted)}
.rate p{color:var(--muted);font-size:.9rem;margin-top:.6em}
.widget-slot{border:1px dashed var(--accent);background:#fff;padding:60px 24px;text-align:center;color:var(--muted)}
.widget-slot strong{color:var(--ink)}
.enquire{text-align:center;margin-top:36px}

footer{background:#23292a;color:#b9bcbb;text-align:center;padding:54px 24px;font-size:.85rem}
footer .brand-f{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:#fff;letter-spacing:.08em;margin-bottom:.5em}
footer a{color:#dcd9d2;border-bottom:1px solid #444;padding-bottom:1px}
footer .foot-nav{margin:1em 0;display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
footer .foot-nav a{border:none;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;opacity:.85}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s ease,transform 1s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.delay{transition-delay:.18s}

@media(max-width:860px){
  header{padding:18px 22px}
  header.scrolled{padding:12px 22px}
  header.solid{padding:14px 22px}
  nav ul{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);background:var(--bg);flex-direction:column;justify-content:center;gap:30px;transform:translateX(100%);transition:transform .4s ease;box-shadow:-10px 0 40px rgba(0,0,0,.15)}
  nav ul.open{transform:translateX(0)}
  nav a{color:var(--ink) !important;font-size:.9rem}
  .menu-toggle{display:block;z-index:60}
  .split,.feature{grid-template-columns:1fr}
  .split.rev .txt,.feature.rev .f-txt{order:1}
  .split.rev .media,.feature.rev .f-media{order:2}
  .cards{grid-template-columns:1fr;gap:34px}
  .grid{grid-template-columns:1fr 1fr}
  .rates{grid-template-columns:1fr}
}

/* named rooms */
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1120px;margin:0 auto;padding:0 24px}
.room .ph{aspect-ratio:4/3;overflow:hidden}
.room img{transition:transform 1s ease}
.room:hover img{transform:scale(1.05)}
.room .rname{font-family:'Cormorant Garamond',serif;font-size:1.35rem;margin-top:.5em;text-align:center}
.room .rmeta{color:var(--muted);font-size:.85rem;text-align:center}

/* map */
.map-embed{max-width:1000px;margin:24px auto 0;border:1px solid var(--line)}
.map-embed iframe{display:block;width:100%;height:420px;border:0}

/* legal pages */
.legal{max-width:760px;margin:0 auto;padding:130px 24px 80px}
.legal h1{font-size:clamp(2rem,4vw,2.8rem);margin-bottom:.15em}
.legal h2{font-size:1.35rem;margin:1.7em 0 .4em}
.legal p,.legal li{color:var(--muted);margin-bottom:.8em}
.legal ul{padding-left:1.2em}
.legal .updated{font-size:.85rem;color:var(--muted);margin-bottom:2em}
.legal .note{background:#efeae1;border:1px solid var(--line);padding:16px 18px;color:var(--ink);font-size:.9rem;margin-bottom:2em}
@media(max-width:860px){.rooms{grid-template-columns:1fr}}