/* ============================================================
   SIWA — Design System
   Desert-sunset palette · editorial serif · cinematic
   ============================================================ */

:root{
  /* — Sand / salt — */
  --salt:        #FBF6EC;
  --sand-50:     #F6EDDD;
  --sand-100:    #EFE2CC;
  --sand-200:    #E4D2B4;
  --clay-300:    #D8B488;

  /* — Sunset — */
  --gold:        #D9A24A;
  --ochre:       #C5803A;
  --terracotta:  #B0532B;
  --rust:        #8E3A1C;
  --ember:       #6F2A14;

  /* — Earth / ink — */
  --ink:         #2A1C11;
  --ink-800:     #21150C;
  --ink-900:     #160D06;
  --ink-950:     #100A04;

  /* — Accent — */
  --palm:        #6B7144;
  --palm-deep:   #444A26;

  /* — Functional — */
  --bg:          var(--ink-900);
  --paper:       var(--salt);
  --line-warm:   rgba(216,180,136,.22);
  --line-dark:   rgba(43,28,17,.16);

  --ff-serif: "Cormorant Garamond", Georgia, serif;
  --ff-sans:  "Hanken Grotesk", "Segoe UI", system-ui, sans-serif;

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  --pad: clamp(1.4rem, 5vw, 7rem);
  --maxw: 1500px;
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--ff-sans);
  background:var(--bg);
  color:var(--salt);
  line-height:1.6;
  font-size:clamp(1rem,.55rem + .65vw,1.18rem);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--ochre); color:var(--ink-950); }

/* Hide native cursor on capable pointers; show custom */
@media (hover:hover) and (pointer:fine){
  body.cursor-on, body.cursor-on a, body.cursor-on button{ cursor:none; }
}

/* ---------- Typography ---------- */
.serif{ font-family:var(--ff-serif); font-weight:500; }
.display{
  font-family:var(--ff-serif);
  font-weight:500;
  line-height:.95;
  letter-spacing:-.01em;
  text-wrap:balance;
}
.italic{ font-style:italic; }

.eyebrow{
  font-family:var(--ff-sans);
  font-size:.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.34em;
  color:var(--gold);
  display:inline-flex;
  align-items:center;
  gap:.85em;
}
.eyebrow::before{
  content:"";
  width:2.4em; height:1px;
  background:linear-gradient(90deg,transparent,var(--ochre));
}
.eyebrow.solo::before{ display:none; }

.lede{
  font-size:clamp(1.05rem,.85rem + .7vw,1.45rem);
  line-height:1.62;
  color:color-mix(in srgb, var(--salt) 82%, transparent);
}
.measure{ max-width:62ch; }

/* ---------- Custom cursor ---------- */
.cursor-dot,.cursor-ring{
  position:fixed; top:0; left:0;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  will-change:transform;
}
.cursor-dot{
  width:7px; height:7px; border-radius:50%;
  background:var(--gold);
  transition:width .25s var(--ease), height .25s var(--ease), background .25s;
}
.cursor-ring{
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(217,162,74,.55);
  transition:width .3s var(--ease), height .3s var(--ease),
             border-color .3s, background .3s, opacity .3s;
}
.cursor-ring.is-hover{
  width:74px; height:74px;
  border-color:rgba(217,162,74,.9);
  background:rgba(217,162,74,.08);
}
.cursor-ring.is-media{
  width:92px; height:92px;
  border-color:transparent;
  background:rgba(176,83,43,.9);
  mix-blend-mode:normal;
}
.cursor-dot.is-media{ width:0; height:0; }
.cursor-label{
  position:fixed; top:0; left:0; z-index:9999;
  transform:translate(-50%,-50%);
  pointer-events:none;
  font-size:.66rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; color:var(--salt);
  opacity:0; transition:opacity .25s;
  will-change:transform;
}
.cursor-label.show{ opacity:1; }
@media (hover:none),(pointer:coarse){
  .cursor-dot,.cursor-ring,.cursor-label{ display:none; }
}

/* ---------- Buttons ---------- */
.btn{
  --c:var(--salt);
  position:relative;
  display:inline-flex; align-items:center; gap:.85em;
  font-family:var(--ff-sans);
  font-size:.78rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--c);
  padding:1.05em 0;
  isolation:isolate;
}
.btn .btn-line{
  width:2.6em; height:1px; background:currentColor;
  transition:width .45s var(--ease-out);
  opacity:.85;
}
.btn:hover .btn-line{ width:4.2em; }
.btn .btn-arrow{ transition:transform .45s var(--ease-out); }
.btn:hover .btn-arrow{ transform:translateX(.4em); }
.btn--ink{ --c:var(--ink); }

.btn-pill{
  display:inline-flex; align-items:center; gap:.7em;
  font-size:.74rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase;
  padding:.95em 1.7em;
  border:1px solid currentColor;
  border-radius:100px;
  color:var(--salt);
  transition:background .4s var(--ease), color .4s var(--ease), border-color .4s;
}
.btn-pill:hover{ background:var(--gold); color:var(--ink-950); border-color:var(--gold); }
.btn-pill--ink{ color:var(--ink); }
.btn-pill--ink:hover{ background:var(--ink); color:var(--salt); border-color:var(--ink); }
.btn-pill--gold{ background:var(--gold); color:var(--ink-950); border-color:var(--gold); }
.btn-pill--gold:hover{ background:#e7b65e; color:var(--ink-950); border-color:#e7b65e; }

/* ---------- Navigation ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:900;
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem;
  padding:1.5rem var(--pad);
  transition:background .5s var(--ease), padding .5s var(--ease),
             box-shadow .5s, backdrop-filter .5s;
}
.nav.scrolled{
  background:color-mix(in srgb, var(--ink-950) 88%, transparent);
  backdrop-filter:blur(14px) saturate(1.1);
  padding-top:.95rem; padding-bottom:.95rem;
  box-shadow:0 1px 0 var(--line-warm);
}
.nav-logo{ display:flex; align-items:center; gap:.8rem; z-index:2; }
.nav-logo .wordmark{
  font-family:var(--ff-serif); font-weight:600;
  font-size:1.7rem; letter-spacing:.42em;
  text-indent:.42em;
  color:var(--salt);
  line-height:1;
}
.nav-logo .wordmark-img{
  height:clamp(4rem,9vw,5.6rem); width:auto; display:block;
  filter:brightness(0) invert(1);
  transition:filter .5s var(--ease);
}
.nav.scrolled .wordmark-img{ filter:none; }
.nav-links{
  display:flex; align-items:center; gap:clamp(.6rem,1.7vw,2.1rem);
}
.nav-link{
  position:relative;
  font-size:.74rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  padding:.5em 0;
  color:color-mix(in srgb, var(--salt) 78%, transparent);
  transition:color .3s;
}
.nav-link:hover{ color:var(--salt); }
.nav-link::after{
  content:""; position:absolute; left:0; bottom:-.1em;
  width:100%; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left;
  transition:transform .4s var(--ease-out);
}
.nav-link:hover::after,.nav-link.active::after{ transform:scaleX(1); }
.nav-link.active{ color:var(--salt); }

.has-sub{ position:relative; }
.subnav{
  position:absolute; top:calc(100% + .6rem); left:50%;
  transform:translateX(-50%) translateY(8px);
  background:color-mix(in srgb,var(--ink-900) 96%,transparent);
  border:1px solid var(--line-warm);
  border-radius:14px;
  padding:.5rem; min-width:200px;
  display:flex; flex-direction:column; gap:.1rem;
  opacity:0; visibility:hidden;
  transition:opacity .3s, transform .3s var(--ease-out), visibility .3s;
  backdrop-filter:blur(12px);
}
.has-sub:hover .subnav{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.subnav a{
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  padding:.7em .9em; border-radius:9px;
  color:color-mix(in srgb,var(--salt) 75%,transparent);
  transition:background .25s,color .25s;
}
.subnav a:hover{ background:rgba(217,162,74,.12); color:var(--salt); }

.nav-cart{
  display:flex; align-items:center; gap:.55em;
  font-size:.74rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  padding:.6em 1.1em;
  border:1px solid var(--line-warm); border-radius:100px;
  color:var(--salt);
  transition:background .35s,border-color .35s;
}
.nav-cart:hover{ background:rgba(217,162,74,.14); border-color:var(--gold); }
.nav-cart .count{
  display:inline-grid; place-items:center;
  min-width:1.5em; height:1.5em; padding:0 .35em;
  background:var(--gold); color:var(--ink-950);
  border-radius:100px; font-size:.62rem;
}

.nav-toggle{ display:none; }

/* ---------- Layout helpers ---------- */
.section{ position:relative; padding:clamp(5rem,11vh,11rem) var(--pad); }
.section--tight{ padding-top:clamp(3rem,7vh,6rem); padding-bottom:clamp(3rem,7vh,6rem); }
.wrap{ max-width:var(--maxw); margin-inline:auto; }
.paper{ background:var(--paper); color:var(--ink); }
.paper .lede{ color:color-mix(in srgb,var(--ink) 78%,transparent); }
.paper .eyebrow{ color:var(--terracotta); }
.dark{ background:var(--ink-900); color:var(--salt); }
.darker{ background:var(--ink-950); }

/* ---------- Reveal ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(34px);
  transition:opacity 1s var(--ease-out), transform 1.1s var(--ease-out);
  transition-delay:var(--rd,0ms);
}
[data-reveal="fade"]{ transform:none; }
[data-reveal].in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  [data-reveal]{ opacity:1!important; transform:none!important; }
}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:0 var(--pad) clamp(3rem,9vh,7rem);
  overflow:hidden;
  background:var(--ink-950);
}
.hero-media{
  position:absolute; inset:-8% 0 0 0;
  z-index:0;
  background:linear-gradient(120deg,#2a1c11,#160d06);
  will-change:transform;
}
.hero-media img{
  width:100%; height:116%; object-fit:cover;
  filter:saturate(1.05) contrast(1.02);
}
.hero-scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(16,10,4,.5) 0%, rgba(16,10,4,0) 26%, rgba(16,10,4,.18) 55%, rgba(16,10,4,.86) 100%),
    radial-gradient(120% 80% at 80% 10%, rgba(197,128,58,.22), transparent 55%);
}
.hero-grain{ position:absolute; inset:0; z-index:2; opacity:.5; mix-blend-mode:overlay; pointer-events:none; }
.hero-inner{ position:relative; z-index:3; width:100%; max-width:var(--maxw); margin-inline:auto; }
.hero-title{
  font-size:clamp(3.3rem,2rem + 9vw,12rem);
  line-height:.92;
  margin:.35em 0 .5em;
  text-wrap:balance;
}
.hero-title .ln{ display:block; overflow:hidden; }
.hero-title .ln > span{ display:block; }
.hero-foot{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:2rem;
}
.hero-foot p{ max-width:40ch; color:color-mix(in srgb,var(--salt) 80%,transparent); }
.scroll-cue{
  position:absolute; left:50%; bottom:1.7rem; transform:translateX(-50%);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:.7rem;
  font-size:.6rem; letter-spacing:.34em; text-transform:uppercase;
  color:color-mix(in srgb,var(--salt) 60%,transparent);
}
.scroll-cue .bar{ width:1px; height:46px; background:linear-gradient(var(--gold),transparent); overflow:hidden; position:relative; }
.scroll-cue .bar::after{
  content:""; position:absolute; inset:0; background:var(--salt);
  animation:scrollbar 2.4s var(--ease) infinite;
}
@keyframes scrollbar{ 0%{transform:translateY(-100%)} 60%,100%{transform:translateY(100%)} }

/* ---------- Marquee strip ---------- */
.strip{
  border-block:1px solid var(--line-warm);
  padding:1.15rem 0; overflow:hidden; background:var(--ink-950);
}
.strip-track{
  display:flex; gap:3.5rem; width:max-content;
  animation:marquee 38s linear infinite;
  font-family:var(--ff-serif); font-style:italic;
  font-size:clamp(1.3rem,2.4vw,2.1rem);
  color:color-mix(in srgb,var(--salt) 70%,transparent);
}
.strip:hover .strip-track{ animation-play-state:paused; }
.strip-track span{ display:flex; align-items:center; gap:3.5rem; white-space:nowrap; }
.strip-track .dot{ width:7px; height:7px; border-radius:50%; background:var(--ochre); }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- Editorial feature ---------- */
.feature{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,6vw,7rem);
  align-items:center;
}
.feature--reverse .feature-media{ order:2; }
.feature-media{
  position:relative; border-radius:4px; overflow:hidden;
  background:linear-gradient(135deg,#3a2616,#1c1109);
  aspect-ratio:4/5;
}
.feature-media.tall{ aspect-ratio:3/4; }
.feature-media.contain{ aspect-ratio:3/2; background:linear-gradient(135deg,var(--sand-100),var(--clay-300)); }
.feature-media.contain img{ height:100%; object-fit:contain; will-change:auto; }
@media(max-width:900px){ .feature-media.contain{ aspect-ratio:4/3; } }
.feature-media img{
  width:100%; height:114%; object-fit:cover;
  will-change:transform;
}
.feature-media .tag{
  position:absolute; left:1.1rem; bottom:1.1rem; z-index:2;
  font-size:.62rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--salt);
  background:rgba(16,10,4,.5); backdrop-filter:blur(6px);
  padding:.55em 1em; border-radius:100px; border:1px solid rgba(251,246,236,.18);
}
.feature-text .display{ font-size:clamp(2rem,1.2rem + 3vw,4.2rem); margin:.4em 0 .7em; }
.feature-text p + p{ margin-top:1.1em; }
.feature-text .cta{ margin-top:2.2rem; }

/* pull quote */
.pull{
  max-width:24ch;
  font-family:var(--ff-serif);
  font-size:clamp(2.2rem,1.2rem + 4vw,5.4rem);
  line-height:1.02; font-weight:500;
}
.pull .q{ color:var(--ochre); }

/* ---------- Big statement / quote band ---------- */
.statement{ text-align:center; }
.statement .display{
  font-size:clamp(2rem,1.1rem + 4.4vw,5.6rem);
  max-width:18ch; margin-inline:auto; text-wrap:balance;
}
.statement .attrib{
  margin-top:2rem; font-size:.74rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--ochre);
}

/* ---------- Lodges ---------- */
.lodge-list{ display:flex; flex-direction:column; }
.lodge{
  position:relative;
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:clamp(1rem,4vw,3rem);
  padding:clamp(1.6rem,3vw,2.6rem) 0;
  border-top:1px solid var(--line-warm);
  transition:padding-left .5s var(--ease);
}
.lodge:last-child{ border-bottom:1px solid var(--line-warm); }
.lodge .num{
  font-family:var(--ff-serif); font-size:1rem; color:var(--ochre);
  letter-spacing:.1em;
}
.lodge .name{
  font-family:var(--ff-serif); font-weight:500;
  font-size:clamp(1.8rem,1.1rem + 2.6vw,3.4rem);
  line-height:1; transition:color .4s;
}
.lodge .kind{
  font-size:.7rem; letter-spacing:.22em; text-transform:uppercase;
  color:color-mix(in srgb,var(--salt) 60%,transparent);
  margin-top:.7em;
}
.lodge .go{
  width:2.9rem; height:2.9rem; border-radius:50%;
  border:1px solid var(--line-warm);
  display:grid; place-items:center;
  transition:background .4s,border-color .4s,transform .4s;
}
.lodge:hover{ padding-left:clamp(.5rem,2vw,2rem); }
.lodge:hover .name{ color:var(--gold); }
.lodge:hover .go{ background:var(--gold); border-color:var(--gold); transform:rotate(-45deg); }
.lodge:hover .go svg{ stroke:var(--ink-950); }
.lodge-peek{
  position:absolute; right:5rem; top:50%;
  width:230px; height:300px; transform:translateY(-50%) scale(.92) rotate(-2deg);
  border-radius:6px; overflow:hidden; pointer-events:none;
  opacity:0; z-index:5;
  box-shadow:0 30px 70px rgba(16,10,4,.6);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.lodge:hover .lodge-peek{ opacity:1; transform:translateY(-50%) scale(1) rotate(-2deg); }
.lodge-peek img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:860px){ .lodge-peek{ display:none; } }

/* ---------- Gallery (horizontal) ---------- */
.gallery{ overflow:hidden; padding-block:0; }
.gallery-track{
  display:flex; gap:1.2rem; padding-inline:var(--pad);
  will-change:transform;
}
.gallery-fig{
  position:relative; flex:0 0 auto;
  width:clamp(220px,30vw,420px); aspect-ratio:3/4;
  border-radius:4px; overflow:hidden;
  background:linear-gradient(135deg,#3a2616,#1c1109);
}
.gallery-fig img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.gallery-fig:hover img{ transform:scale(1.06); }
.gallery-fig.wide{ width:clamp(320px,44vw,640px); aspect-ratio:16/10; }
.gallery-cap{
  position:absolute; left:1rem; bottom:1rem;
  font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--salt); background:rgba(16,10,4,.45);
  padding:.5em .9em; border-radius:100px; backdrop-filter:blur(6px);
}

/* ---------- Interactive Map ---------- */
.map-section{ position:relative; }
.map-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(2rem,4vw,4rem); align-items:stretch; }
.map-stage{
  position:relative; aspect-ratio:1/1;
  background:radial-gradient(120% 120% at 50% 40%, #2a1c11, #160d06 70%);
  border:1px solid var(--line-warm); border-radius:8px;
  overflow:hidden;
}
.map-stage svg{ position:absolute; inset:0; width:100%; height:100%; }
.hot{ cursor:pointer; }
.hot .ping{ transform-origin:center; }
.hot .pin-core{ transition:r .3s var(--ease), fill .3s; }
.hot.active .pin-core,.hot:hover .pin-core{ fill:var(--gold); }
.hot .pin-ring{ opacity:.5; transition:opacity .3s; }
.hot.active .pin-ring{ opacity:1; }
.hot .hot-label{
  font-family:var(--ff-sans); font-size:9px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase;
  fill:color-mix(in srgb,var(--salt) 75%,transparent);
  transition:fill .3s;
}
.hot:hover .hot-label,.hot.active .hot-label{ fill:var(--gold); }
.map-panel{ display:flex; flex-direction:column; justify-content:center; gap:1.3rem; }
.map-card{ display:none; }
.map-card.active{ display:block; animation:cardIn .6s var(--ease-out); }
@keyframes cardIn{ from{opacity:0; transform:translateY(16px);} to{opacity:1;transform:none;} }
.map-card .mc-kind{ font-size:.7rem; letter-spacing:.26em; text-transform:uppercase; color:var(--ochre); }
.map-card .mc-name{ font-family:var(--ff-serif); font-size:clamp(2rem,1.3rem + 2.4vw,3.4rem); line-height:1; margin:.35em 0 .5em; }
.map-card .mc-body{ color:color-mix(in srgb,var(--salt) 80%,transparent); max-width:42ch; }
.map-card .mc-img{ margin-top:1.4rem; aspect-ratio:16/10; border-radius:5px; overflow:hidden; background:linear-gradient(135deg,#3a2616,#1c1109); }
.map-card .mc-img img{ width:100%; height:100%; object-fit:cover; }
.map-legend{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.6rem; }
.map-legend button{
  font-family:var(--ff-sans); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:color-mix(in srgb,var(--salt) 65%,transparent);
  border:1px solid var(--line-warm); background:transparent;
  padding:.55em 1em; border-radius:100px; transition:.3s;
}
.map-legend button:hover{ color:var(--salt); border-color:var(--ochre); }
.map-legend button.active{ background:var(--gold); color:var(--ink-950); border-color:var(--gold); }

/* tripod interactive map (photo-based) */
.tripod-stage{ position:relative; border-radius:8px; overflow:hidden; border:1px solid var(--line-strong); }
.tripod-stage img{ width:100%; display:block; }
.tripod-hot{ position:absolute; width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%; background:transparent; border:none; cursor:pointer; padding:0; }
.tripod-hot::before{ content:''; position:absolute; inset:0; border-radius:50%; border:2px solid var(--gold); box-shadow:0 0 0 4px rgba(217,162,74,.18); opacity:0; transform:scale(.6); transition:opacity .3s var(--ease), transform .3s var(--ease); }
.tripod-hot:hover::before, .tripod-hot.active::before{ opacity:1; transform:scale(1); }
.tripod-hot::after{ content:''; position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:var(--terracotta); border:2px solid #FBF6EC; box-shadow:0 1px 4px rgba(16,10,4,.4); transition:background .3s var(--ease), transform .3s var(--ease); }
.tripod-hot:hover::after, .tripod-hot.active::after{ background:var(--gold); transform:scale(1.15); }
.tripod-panel{ margin-top:1.6rem; }
.tripod-panel .map-card .mc-body{ max-width:none; }

/* gastronomy venue hover photo */
.venue{ position:relative; overflow:hidden; isolation:isolate; }
.venue-media{ position:absolute; inset:0; z-index:0; opacity:0; transition:opacity .5s var(--ease); }
.venue-media img{ width:100%; height:100%; object-fit:cover; }
.venue-media::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(16,10,4,.25),rgba(16,10,4,.82)); }
.venue > *:not(.venue-media){ position:relative; z-index:1; }
.venue:hover .venue-media{ opacity:1; }
.venue:hover .vname, .venue:hover .vdesc{ color:#FBF6EC; }
.venue:hover .vdesc{ color:rgba(251,246,236,.86); }

/* footer credit + HMS logo */
.foot-credit{ display:inline-flex; align-items:center; gap:.6rem; font-size:.92rem; }
.hms-logo{ height:2.4rem; width:auto; display:block; }

/* ---------- Gastronomy ---------- */
.venues{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.5vw,2rem); margin-top:3rem; }
.venue{
  position:relative; border:1px solid var(--line-dark); border-radius:5px;
  padding:2rem 1.7rem 1.7rem; overflow:hidden;
  transition:background .5s var(--ease), color .5s, transform .5s var(--ease), border-color .5s;
}
.venue .vnum{ font-family:var(--ff-serif); color:var(--terracotta); font-size:1rem; transition:color .5s; }
.venue .vname{ font-family:var(--ff-serif); font-size:clamp(1.6rem,1.1rem + 1.6vw,2.4rem); line-height:1.04; margin:.5em 0 .4em; }
.venue .vdesc{ font-size:.95rem; color:color-mix(in srgb,var(--ink) 70%,transparent); transition:color .5s; }
.venue:hover{ background:var(--ink); color:var(--salt); transform:translateY(-6px); border-color:var(--ink); }
.venue:hover .vdesc{ color:color-mix(in srgb,var(--salt) 76%,transparent); }
.venue:hover .vnum{ color:var(--gold); }

/* ---------- Shop ---------- */
.shop-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.5rem; }
.products{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.8rem,1.6vw,1.5rem); margin-top:3rem; }
.product{ position:relative; }
.product-media{
  position:relative; aspect-ratio:4/5; border-radius:5px; overflow:hidden;
  background:linear-gradient(135deg,var(--sand-100),var(--sand-200));
}
.product-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.product:hover .product-media img{ transform:scale(1.05); }
.product-add{
  position:absolute; right:.7rem; bottom:.7rem;
  width:2.6rem; height:2.6rem; border-radius:50%;
  background:var(--salt); color:var(--ink);
  display:grid; place-items:center;
  transform:translateY(8px); opacity:0;
  transition:opacity .4s,transform .4s,background .3s;
}
.product:hover .product-add{ opacity:1; transform:none; }
.product-add:hover{ background:var(--gold); }
.product-name{ font-family:var(--ff-serif); font-size:1.25rem; margin-top:.8rem; line-height:1.1; }
.product-meta{ display:flex; justify-content:space-between; align-items:baseline; margin-top:.2rem; }
.product-cat{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:color-mix(in srgb,var(--ink) 55%,transparent); }
.product-price{ font-family:var(--ff-serif); font-size:1.1rem; color:var(--terracotta); white-space:nowrap; }

/* ---------- Footer ---------- */
.footer{ background:var(--ink-950); padding:clamp(2.4rem,4.5vh,3.6rem) var(--pad) 1.4rem; border-top:1px solid var(--line-warm); }
.foot-top{ display:grid; grid-template-columns:1.4fr 2fr; gap:clamp(2rem,6vw,5rem); }
.foot-brand .wordmark{ font-family:var(--ff-serif); font-weight:600; font-size:2.4rem; letter-spacing:.4em; text-indent:.4em; }
.foot-brand p{ margin-top:1.4rem; max-width:34ch; color:color-mix(in srgb,var(--salt) 60%,transparent); }
.foot-social{ display:flex; gap:.7rem; margin-top:1.8rem; }
.foot-social a{
  width:2.8rem; height:2.8rem; border-radius:50%;
  border:1px solid var(--line-warm); display:grid; place-items:center;
  transition:background .3s,border-color .3s,transform .3s;
}
.foot-social a:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink-950); transform:translateY(-3px); }
.foot-cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.foot-col h4{ font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ochre); margin-bottom:1.1rem; font-weight:600; }
.foot-col a{ display:block; padding:.4em 0; font-size:.9rem; color:color-mix(in srgb,var(--salt) 70%,transparent); transition:color .25s,padding-left .25s; }
.foot-col a:hover{ color:var(--salt); padding-left:.4em; }
.foot-bottom{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-top:clamp(1.6rem,3vh,2.4rem); padding-top:1.1rem; border-top:1px solid var(--line-warm); font-size:.74rem; color:color-mix(in srgb,var(--salt) 50%,transparent); }
.foot-bottom a{ color:var(--ochre); }

/* ---------- Page hero (inner pages) ---------- */
.phero{ position:relative; min-height:72svh; display:flex; align-items:flex-end; padding:0 var(--pad) clamp(3rem,7vh,6rem); overflow:hidden; background:var(--ink-950); }
.phero-media{ position:absolute; inset:-8% 0 0 0; z-index:0; }
.phero-media img, .phero-media video{ width:100%; height:116%; object-fit:cover; will-change:transform; }

.phero-loop img{ position:absolute; inset:0; height:116%; opacity:0; animation:pheroloop 12s ease-in-out infinite; }
.phero-loop img:nth-child(1){ animation-delay:0s; }
.phero-loop img:nth-child(2){ animation-delay:4s; }
.phero-loop img:nth-child(3){ animation-delay:8s; }
@keyframes pheroloop{ 0%{opacity:0;} 6%{opacity:1;} 30%{opacity:1;} 38%{opacity:0;} 100%{opacity:0;} }
@media (prefers-reduced-motion:reduce){
  .phero-loop img{ animation:none; opacity:0; }
  .phero-loop img:first-child{ opacity:1; }
}
.phero-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(16,10,4,.55),rgba(16,10,4,.1) 40%,rgba(16,10,4,.85)); }
.phero-inner{ position:relative; z-index:2; max-width:var(--maxw); margin-inline:auto; width:100%; }
.phero-title{ font-size:clamp(2.6rem,1.6rem + 6vw,8rem); line-height:.95; margin:.3em 0 0; }
.crumbs{ display:flex; gap:.6em; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:color-mix(in srgb,var(--salt) 60%,transparent); }
.crumbs a:hover{ color:var(--gold); }

/* ---------- Inner-page components ---------- */
.xgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.6rem); }
.xcard{ position:relative; aspect-ratio:4/5; border-radius:6px; overflow:hidden; background:linear-gradient(135deg,#3a2616,#1c1109); display:flex; flex-direction:column; justify-content:flex-end; }
.xcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.xcard:hover img{ transform:scale(1.07); }
.xcard .xscrim{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(16,10,4,.08),rgba(16,10,4,.5) 55%,rgba(16,10,4,.9)); z-index:1; transition:background .5s var(--ease); }
.xcard:hover .xscrim{ background:rgba(16,10,4,.86); }
.xcard .xbody{ position:relative; z-index:2; padding:1.7rem; display:flex; flex-direction:column; justify-content:flex-end; flex:1; }
.xcard .xnum{ font-family:var(--ff-serif); color:var(--gold); font-size:.95rem; flex:0 0 auto; }
.xcard .xname{ font-family:var(--ff-serif); font-size:clamp(1.5rem,1.1rem + 1.3vw,2.3rem); line-height:1.04; margin:.2em 0 .4em; flex:0 0 auto; transition:margin .5s var(--ease); }
.xcard .xdesc{ font-size:.86rem; line-height:1.55; color:color-mix(in srgb,var(--salt) 80%,transparent); max-width:none; opacity:0; max-height:0; overflow:auto; transform:translateY(8px); transition:opacity .5s var(--ease), max-height .5s var(--ease), transform .5s var(--ease); }
.xcard:hover .xdesc{ opacity:1; max-height:70%; transform:none; }
.xcard:hover .xbody{ padding-top:0; }
@media(max-width:900px){ .xgrid{ grid-template-columns:1fr 1fr; } .xcard .xdesc{ opacity:1; max-height:none; transform:none; } }
@media(max-width:560px){ .xgrid{ grid-template-columns:1fr; } }

.lblock{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:center; }
.lblock + .lblock{ margin-top:clamp(4rem,9vh,8rem); }
.lblock--rev .lblock-media{ order:2; }
.lblock-media{ aspect-ratio:4/5; border-radius:6px; overflow:hidden; background:linear-gradient(135deg,#3a2616,#1c1109); }
.lblock-media img{ width:100%; height:114%; object-fit:cover; will-change:transform; }
.lblock .stat-row{ display:flex; gap:2.5rem; margin-top:2rem; flex-wrap:wrap; }
.lblock .stat .v{ font-family:var(--ff-serif); font-size:1.7rem; color:var(--gold); display:block; line-height:1; }
.lblock .stat .k{ font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:color-mix(in srgb,var(--salt) 60%,transparent); margin-top:.4em; display:block; }
@media(max-width:900px){ .lblock{ grid-template-columns:1fr; } .lblock--rev .lblock-media{ order:0; } .lblock-media{ aspect-ratio:16/11; } }

.lblock-media.ac-duo, .lblock-media.ac-trio{ position:relative; aspect-ratio:4/5; background:none; overflow:hidden; border-radius:6px; }
.lblock-media.ac-duo img, .lblock-media.ac-trio img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; }
.lblock-media.ac-duo img{ animation:acloop2 10s linear infinite; }
.lblock-media.ac-duo img:nth-child(1){ animation-delay:0s; }
.lblock-media.ac-duo img:nth-child(2){ animation-delay:5s; }
.lblock-media.ac-trio img{ animation:acloop3 15s linear infinite; }
.lblock-media.ac-trio img:nth-child(1){ animation-delay:0s; }
.lblock-media.ac-trio img:nth-child(2){ animation-delay:5s; }
.lblock-media.ac-trio img:nth-child(3){ animation-delay:10s; }
@keyframes acloop2{ 0%{opacity:0;} 5%{opacity:1;} 45%{opacity:1;} 50%{opacity:0;} 100%{opacity:0;} }
@keyframes acloop3{ 0%{opacity:0;} 3.3%{opacity:1;} 30%{opacity:1;} 33.3%{opacity:0;} 100%{opacity:0;} }
@media (prefers-reduced-motion:reduce){
  .lblock-media.ac-duo img, .lblock-media.ac-trio img{ animation:none; opacity:0; }
  .lblock-media.ac-duo img:first-child, .lblock-media.ac-trio img:first-child{ opacity:1; }
}

.form{ display:grid; gap:1.4rem; max-width:560px; }
.field{ display:flex; flex-direction:column; gap:.55rem; }
.field label{ font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ochre); }
.field input,.field textarea,.field select{ font-family:var(--ff-sans); font-size:1rem; color:var(--salt); background:transparent; border:none; border-bottom:1px solid var(--line-warm); padding:.7em 0; transition:border-color .3s; }
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--gold); }
.field textarea{ resize:vertical; min-height:120px; }
.field select option{ background:var(--ink-900); }
.form-note{ margin-top:.4rem; font-size:.85rem; color:color-mix(in srgb,var(--salt) 60%,transparent); }

.jgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.4rem,3vw,2.4rem); }
.jcard{ display:block; }
.jcard-media{ aspect-ratio:3/2; border-radius:6px; overflow:hidden; background:linear-gradient(135deg,#3a2616,#1c1109); }
.jcard-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.jcard:hover .jcard-media img{ transform:scale(1.05); }
.jcard .jmeta{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ochre); margin-top:1.1rem; }
.jcard .jtitle{ font-family:var(--ff-serif); font-size:clamp(1.4rem,1.1rem + 1vw,1.95rem); line-height:1.12; margin-top:.5rem; transition:color .3s; }
.jcard:hover .jtitle{ color:var(--gold); }
@media(max-width:860px){ .jgrid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .jgrid{ grid-template-columns:1fr; } }

.offer{ display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center; padding:clamp(2rem,4vw,3.5rem); border:1px solid var(--line-warm); border-radius:10px; background:radial-gradient(120% 140% at 0% 0%, rgba(197,128,58,.16), transparent 60%); }
.offer .display{ font-size:clamp(1.8rem,1.2rem + 2.4vw,3.4rem); }
@media(max-width:760px){ .offer{ grid-template-columns:1fr; } }

.offer--journey{ grid-template-columns:auto auto; justify-content:space-between; gap:clamp(1.5rem,4vw,3rem); overflow:visible; padding:clamp(1.6rem,3vw,2.4rem) clamp(2rem,4vw,3rem); }
.offer--journey > div:first-child{ max-width:34ch; }
.offer--journey .offer-media{ position:relative; border-radius:8px; overflow:visible; aspect-ratio:auto; max-height:none; justify-self:end; width:clamp(220px,20vw,280px); }
.offer--journey .offer-media img{ display:block; width:130%; max-width:none; height:auto; object-fit:cover; object-position:center 30%; border-radius:8px; box-shadow:0 30px 70px rgba(43,28,17,.28); }
@media(max-width:760px){ .offer--journey{ grid-template-columns:1fr; justify-content:normal; } .offer--journey .offer-media{ width:70%; margin-inline:auto; } .offer--journey .offer-media img{ width:100%; } }

.lede-cols{ columns:2; column-gap:clamp(2rem,5vw,4rem); }
.lede-cols p{ break-inside:avoid; }
.lede-cols p + p{ margin-top:1.1em; }
@media(max-width:760px){ .lede-cols{ columns:1; } }

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .nav-links .nav-link.collapsible{ display:none; }
}
@media (max-width:900px){
  .feature{ grid-template-columns:1fr; gap:2.2rem; }
  .feature--reverse .feature-media{ order:0; }
  .feature-media{ aspect-ratio:16/11; }
  .map-grid{ grid-template-columns:1fr; }
  .venues{ grid-template-columns:1fr; }
  .products{ grid-template-columns:repeat(2,1fr); }
  .foot-top{ grid-template-columns:1fr; }
}
@media (max-width:760px){
  .nav-links{ position:fixed; inset:0; flex-direction:column; justify-content:center;
    gap:1.4rem; background:var(--ink-950); padding:2rem;
    transform:translateX(100%); transition:transform .5s var(--ease); z-index:1; }
  .nav.open .nav-links{ transform:none; }
  .nav-links .nav-link{ font-size:1.1rem; }
  .nav-links .nav-link.collapsible{ display:block; }
  .has-sub .subnav{ position:static; transform:none; opacity:1; visibility:visible; background:none; border:none; min-width:0; align-items:center; padding-top:0; }
  .nav-toggle{ display:grid; z-index:2; place-items:center; width:2.6rem; height:2.6rem; background:none; border:1px solid var(--line-warm); border-radius:50%; }
  .nav-toggle .bar{ display:block; width:16px; height:1.5px; background:var(--salt); transition:.3s; }
  .nav-toggle .bar + .bar{ margin-top:4px; }
  .nav.open .nav-toggle .bar:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
  .nav.open .nav-toggle .bar:nth-child(2){ opacity:0; }
  .nav.open .nav-toggle .bar:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }
  .nav-cart .lbl{ display:none; }
}
@media (max-width:560px){
  .products{ grid-template-columns:1fr 1fr; }
  .foot-cols{ grid-template-columns:1fr 1fr; }
  .hero-foot{ flex-direction:column; align-items:flex-start; }
}

/* ============================================================
   Book Now button + booking modal
   ============================================================ */
.nav-book{
  display:inline-flex; align-items:center; gap:.55em;
  font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  padding:.74em 1.35em; border-radius:100px;
  background:var(--gold); color:var(--ink-950);
  border:1px solid var(--gold);
  box-shadow:0 6px 22px rgba(217,162,74,.20);
  transition:background .35s var(--ease), transform .35s var(--ease), box-shadow .35s;
}
.nav-book:hover{ background:#e7b65e; transform:translateY(-1px); box-shadow:0 10px 30px rgba(217,162,74,.34); }
.nav-book svg{ margin-top:-1px; }

.bk-overlay{ position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:1.2rem;
  opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s; }
.bk-overlay.open{ opacity:1; visibility:visible; }
.bk-backdrop{ position:absolute; inset:0; background:rgba(10,6,2,.74); backdrop-filter:blur(8px); }
.bk-modal{ position:relative; z-index:1; width:min(720px,100%); max-height:92svh; overflow:auto;
  background:linear-gradient(180deg,#241710,#160d06); border:1px solid var(--line-warm); border-radius:16px;
  padding:clamp(1.6rem,3.5vw,2.8rem);
  transform:translateY(18px) scale(.98); transition:transform .45s var(--ease);
  box-shadow:0 40px 90px rgba(8,4,1,.6); }
.bk-overlay.open .bk-modal{ transform:none; }
.bk-close{ position:absolute; top:1rem; right:1rem; width:2.6rem; height:2.6rem; border-radius:50%;
  border:1px solid var(--line-warm); background:transparent; color:var(--salt); display:grid; place-items:center; transition:.3s; }
.bk-close:hover{ background:rgba(217,162,74,.14); border-color:var(--gold); transform:rotate(90deg); }
.bk-title{ font-family:var(--ff-serif); font-size:clamp(1.9rem,1.3rem + 1.8vw,2.9rem); line-height:1; margin:.6rem 0 0; }
.bk-sub{ color:color-mix(in srgb,var(--salt) 66%,transparent); margin-top:.7rem; font-size:.95rem; max-width:46ch; }
.bk-label{ font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ochre); margin:1.9rem 0 .9rem; }
.bk-lodges{ display:grid; gap:.7rem; }
.bk-lodge{ display:flex; align-items:center; gap:1rem; padding:.8rem .9rem; border:1px solid var(--line-warm); border-radius:12px; cursor:pointer; transition:border-color .3s, background .3s; text-align:left; width:100%; background:transparent; color:inherit; }
.bk-lodge:hover{ border-color:var(--ochre); }
.bk-lodge.sel{ border-color:var(--gold); background:rgba(217,162,74,.08); }
.bk-lodge-thumb{ width:54px; height:54px; border-radius:8px; object-fit:cover; flex:0 0 auto; background:linear-gradient(135deg,#3a2616,#1c1109); }
.bk-lodge-name{ display:block; font-family:var(--ff-serif); font-size:1.3rem; line-height:1; }
.bk-lodge-kind{ display:block; font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:color-mix(in srgb,var(--salt) 55%,transparent); margin-top:.5em; }
.bk-lodge-check{ margin-left:auto; width:1.5rem; height:1.5rem; border-radius:50%; border:1px solid var(--line-warm); display:grid; place-items:center; flex:0 0 auto; transition:.3s; color:var(--ink-950); }
.bk-lodge.sel .bk-lodge-check{ background:var(--gold); border-color:var(--gold); }
.bk-lodge-check svg{ opacity:0; transition:.3s; }
.bk-lodge.sel .bk-lodge-check svg{ opacity:1; }
.bk-dates{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.bk-field{ display:flex; flex-direction:column; gap:.55rem; }
.bk-field label{ font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ochre); }
.bk-field input{ font-family:var(--ff-sans); font-size:1rem; color:var(--salt); background:rgba(251,246,236,.04); border:1px solid var(--line-warm); border-radius:10px; padding:.8em .9em; transition:border-color .3s; color-scheme:dark; }
.bk-field input:focus{ outline:none; border-color:var(--gold); }
.bk-guests{ display:flex; align-items:center; justify-content:space-between; border:1px solid var(--line-warm); border-radius:10px; padding:.55em .7em .55em 1rem; margin-top:1rem; }
.bk-guests .g-label{ font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:color-mix(in srgb,var(--salt) 72%,transparent); }
.bk-guests .g-ctrl{ display:flex; align-items:center; gap:1rem; }
.bk-guests .g-val{ font-family:var(--ff-serif); font-size:1.3rem; min-width:1.4ch; text-align:center; }
.bk-step{ width:2.2rem; height:2.2rem; border-radius:50%; border:1px solid var(--line-warm); background:transparent; color:var(--salt); font-size:1.2rem; line-height:1; display:grid; place-items:center; transition:.3s; }
.bk-step:hover{ border-color:var(--gold); color:var(--gold); }
.bk-foot{ margin-top:1.8rem; display:flex; align-items:center; justify-content:space-between; gap:1.2rem; flex-wrap:wrap; }
.bk-error{ color:#e9a571; font-size:.85rem; flex:1; min-width:12ch; }
.bk-submit{ display:inline-flex; align-items:center; gap:.7em; font-size:.76rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  padding:1em 1.9em; border-radius:100px; background:var(--gold); color:var(--ink-950); border:1px solid var(--gold);
  transition:background .35s, transform .35s, opacity .3s; }
.bk-submit:hover{ background:#e7b65e; transform:translateY(-1px); }
.bk-submit[disabled]{ opacity:.4; pointer-events:none; }
.bk-submit svg{ transition:transform .35s var(--ease); }
.bk-submit:hover svg{ transform:translateX(.35em); }
@media(max-width:560px){
  .bk-dates{ grid-template-columns:1fr; }
  .nav-book .bk-full{ display:none; }
}

/* ============================================================
   LIGHT THEME  —  brighter desert palette
   Same sunset theme, inverted to warm light surfaces.
   (Overrides the dark-first base above.)
   ============================================================ */
:root{
  --surface:    #FBF6EC;
  --surface-2:  #F3E7D3;
  --surface-3:  #EBDCC2;
  --line-strong: rgba(43,28,17,.16);
}

/* ---- base ---- */
body{ background:var(--surface); color:var(--ink); }

/* ---- section surfaces: flip dark → light, gentle alternation ---- */
.dark{ background:var(--surface); color:var(--ink);
       --salt:#2A1C11; --line-warm:rgba(43,28,17,.14); }
.darker{ background:var(--surface-2); }
.paper{ background:var(--surface); color:var(--ink); }

/* ---- foreground remap for chrome that was dark ---- */
.strip, .footer, .nav.scrolled, .subnav, .bk-modal{
  --salt:#2A1C11; --line-warm:rgba(43,28,17,.14);
}

/* ---- keep cream text where it overlays imagery / dark scrims ---- */
.hero, .phero{ color:#FBF6EC; }
.feature-media .tag,
.gallery-cap{ color:#FBF6EC; }
.xcard .xname{ color:#FBF6EC; }
.xcard .xdesc{ color:rgba(251,246,236,.86); }

/* ---- eyebrows: gold → terracotta on light for legibility ---- */
.dark .eyebrow, .darker .eyebrow, .strip .eyebrow,
.footer .eyebrow, .paper .eyebrow{ color:var(--terracotta); }

/* ---- accent / number colours that need more contrast on light ---- */
.lblock .stat .v{ color:var(--terracotta); }
.lodge:hover .name{ color:var(--terracotta); }
.jcard:hover .jtitle{ color:var(--terracotta); }

/* ---- marquee ---- */
.strip{ background:var(--surface-2); border-color:var(--line-strong); }

/* ---- nav (scrolled state now light) ---- */
.nav.scrolled{ background:color-mix(in srgb,var(--surface) 88%, transparent);
  box-shadow:0 1px 0 var(--line-strong), 0 10px 34px rgba(43,28,17,.07); }

/* ---- dropdown ---- */
.subnav{ background:color-mix(in srgb,var(--surface) 97%, transparent);
  border-color:var(--line-strong); box-shadow:0 18px 44px rgba(43,28,17,.14); }
.subnav a:hover{ background:rgba(176,83,43,.10); }

/* ---- accent band (Moka \u2014 warm brown, softer than oxido) ---- */
.accent{ background:linear-gradient(135deg,#8B7267,#6E5A50); color:#FBF6EC; }
.accent .eyebrow{ color:var(--gold); }
.accent .display{ color:#FBF6EC; }
.accent .lede{ color:rgba(251,246,236,.88); }

/* ---- lighten image-placeholder backgrounds so any gaps read bright ---- */
.feature-media,.lblock-media,.jcard-media,.gallery-fig,.map-card .mc-img{
  background:linear-gradient(135deg,var(--sand-100),var(--clay-300)); }

/* ---- interactive map → parchment ---- */
.map-stage{ background:radial-gradient(120% 120% at 50% 38%, #F3E7D3, #E2CDA6 72%);
  border-color:var(--line-strong); }
.map-stage .pin-ring{ stroke:var(--terracotta); }
.map-stage .hot:hover .hot-label,
.map-stage .hot.active .hot-label{ fill:var(--terracotta); }

/* ---- shop add button: dark disc + cream icon (visible on any media) ---- */
.product-add{ background:var(--ink); color:#FBF6EC; }
.product-add:hover{ background:var(--gold); color:var(--ink-950); }

/* ---- cards / borders on light ---- */
.venue{ border-color:var(--line-strong); }
.offer{ border-color:var(--line-strong);
  background:radial-gradient(120% 140% at 0% 0%, rgba(197,128,58,.12), transparent 60%); }

/* ---- footer → deep warm sand anchor (still bright) ---- */
.footer{ background:var(--surface-3); border-top:1px solid var(--terracotta); }

/* ---- booking modal → light ---- */
.bk-modal{ background:linear-gradient(180deg,#FFFDF7,#F3E7D3);
  border-color:var(--line-strong); box-shadow:0 40px 90px rgba(43,28,17,.30); }
.bk-backdrop{ background:rgba(28,17,9,.46); }
.bk-field input{ background:rgba(43,28,17,.04); color:var(--ink);
  color-scheme:light; border-color:var(--line-strong); }
.bk-lodge{ border-color:var(--line-strong); }
.bk-error{ color:var(--rust); }
.field select option{ background:#FBF6EC; color:var(--ink); }

/* ---- mobile menu light ---- */
@media (max-width:760px){
  .nav.open{ --salt:#2A1C11; }
  .nav.open .nav-links{ background:var(--surface); }
}

/* ============================================================
   MOTION  —  smoother theme + tasteful animations
   ============================================================ */
/* clear the fixed nav on inner-page heroes (fixes breadcrumb overlap) */
.phero{ padding-top:clamp(7rem,13vh,9.5rem); }

@media (prefers-reduced-motion:no-preference){
  html{ scroll-behavior:smooth; }
}

/* scroll-progress bar */
.scrollbar-progress{
  position:fixed; top:0; left:0; height:3px; width:0;
  z-index:1100; pointer-events:none;
  background:linear-gradient(90deg,var(--gold),var(--terracotta));
  box-shadow:0 0 12px rgba(217,162,74,.5);
}

/* hero slow zoom (Ken Burns) — img only, parallax lives on the parent */
@media (prefers-reduced-motion:no-preference){
  .hero-media img{ animation:kenburns 24s var(--ease-out) both; }
}
@keyframes kenburns{ from{ transform:scale(1.14); } to{ transform:scale(1); } }

/* reveal: add a soft blur-in for a smoother settle */
[data-reveal]{
  filter:blur(5px);
  transition:opacity 1s var(--ease-out), transform 1.1s var(--ease-out), filter 1s var(--ease-out);
}
[data-reveal].in{ filter:blur(0); }
@media (prefers-reduced-motion:reduce){
  [data-reveal]{ filter:none!important; }
}

/* gentle lift on product / journal cards */
.product{ transition:transform .55s var(--ease); }
.product:hover{ transform:translateY(-7px); }
.jcard{ transition:transform .55s var(--ease); }
.jcard:hover{ transform:translateY(-6px); }

/* nav-book subtle attention pulse on load (once) — scale only, never gates visibility */
@media (prefers-reduced-motion:no-preference){
  .nav-book{ animation:bookpop .7s var(--ease-out) both .6s; }
}
@keyframes bookpop{ from{ transform:scale(.86); } to{ transform:scale(1); } }

/* Book Now — hover dropdown (unclickable trigger) */
.nav-book-wrap{ position:relative; }
.nav-book{ cursor:default; }
.nav-book .nb-chev{ margin-left:.15em; transition:transform .35s var(--ease); opacity:.85; }
.has-sub:hover .nb-chev,
.has-sub.touch-open .nb-chev{ transform:rotate(180deg); }
.nav-book-menu{ min-width:190px; }
.has-sub.touch-open .subnav{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.nav-book-menu a[data-notice]{ color:var(--ochre); }

/* shop category filter */
.shop-filters{ display:flex; flex-wrap:wrap; gap:.6rem; margin:2.4rem 0 .5rem; }
.shop-filters button{
  font-family:var(--ff-sans); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 58%,transparent);
  border:1px solid var(--line-strong); background:transparent;
  padding:.6em 1.15em; border-radius:100px; transition:color .3s, border-color .3s, background .3s;
}
.shop-filters button:hover{ color:var(--ink); border-color:var(--ochre); }
.shop-filters button.active{ background:var(--ink); color:var(--surface); border-color:var(--ink); }
@keyframes prodin{ from{ opacity:0; transform:translateY(12px) scale(.98); } to{ opacity:1; transform:none; } }
.product.show-anim{ animation:prodin .5s var(--ease-out) both; }

/* ============================================================
   Cart drawer
   ============================================================ */
.cart-overlay{ position:fixed; inset:0; z-index:1200; opacity:0; visibility:hidden;
  transition:opacity .35s var(--ease), visibility .35s; }
.cart-overlay.open{ opacity:1; visibility:visible; }
.cart-backdrop{ position:absolute; inset:0; background:rgba(28,17,9,.46); backdrop-filter:blur(6px); }
.cart-panel{ position:absolute; top:0; right:0; height:100%; width:min(440px,100%);
  display:flex; flex-direction:column;
  background:linear-gradient(180deg,#FFFDF7,#F3E7D3);
  border-left:1px solid var(--line-strong); box-shadow:-30px 0 80px rgba(43,28,17,.22);
  transform:translateX(100%); transition:transform .45s var(--ease); }
.cart-overlay.open .cart-panel{ transform:none; }
.cart-head{ display:flex; align-items:center; justify-content:space-between;
  padding:1.5rem clamp(1.2rem,3vw,1.8rem); border-bottom:1px solid var(--line-strong); }
.cart-head .eyebrow{ color:var(--terracotta); }
.cart-close{ width:2.4rem; height:2.4rem; border-radius:50%; border:1px solid var(--line-strong);
  background:transparent; color:var(--ink); display:grid; place-items:center; transition:.3s; }
.cart-close:hover{ background:rgba(176,83,43,.1); border-color:var(--terracotta); transform:rotate(90deg); }
.cart-body{ flex:1; overflow:auto; padding:clamp(1rem,3vw,1.6rem); display:flex; flex-direction:column; gap:1rem; }
.cart-item{ display:grid; grid-template-columns:64px 1fr auto; gap:1rem; align-items:start;
  padding-bottom:1rem; border-bottom:1px solid var(--line-strong); }
.cart-item:last-child{ border-bottom:none; }
.cart-thumb{ width:64px; height:64px; border-radius:8px; overflow:hidden;
  background:linear-gradient(135deg,var(--sand-100),var(--clay-300)); }
.cart-thumb img{ width:100%; height:100%; object-fit:cover; }
.cart-info h4{ font-family:var(--ff-serif); font-weight:500; font-size:1.2rem; line-height:1.05; }
.cart-info .cart-cat{ font-size:.6rem; letter-spacing:.18em; text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 50%,transparent); display:block; margin-top:.3em; }
.cart-info .cart-price{ font-family:var(--ff-serif); color:var(--terracotta); margin-top:.4em; }
.cart-qtycol{ display:flex; flex-direction:column; align-items:flex-end; gap:.6rem; }
.cart-qty{ display:flex; align-items:center; gap:.7rem; border:1px solid var(--line-strong); border-radius:100px; padding:.25em .5em; }
.cart-qty button{ width:1.5rem; height:1.5rem; border:none; background:transparent; color:var(--ink);
  font-size:1rem; line-height:1; cursor:pointer; border-radius:50%; transition:.2s; }
.cart-qty button:hover{ background:rgba(176,83,43,.12); color:var(--terracotta); }
.cart-qty span{ font-family:var(--ff-serif); font-size:1rem; min-width:1ch; text-align:center; }
.cart-remove{ font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; background:none; border:none;
  color:color-mix(in srgb,var(--ink) 50%,transparent); cursor:pointer; transition:color .25s; }
.cart-remove:hover{ color:var(--rust); }
.cart-empty{ margin:auto; text-align:center; display:flex; flex-direction:column; align-items:center; gap:1.1rem;
  color:color-mix(in srgb,var(--ink) 60%,transparent); padding:3rem 1rem; }
.cart-empty svg{ color:var(--clay-300); }
.cart-empty p{ font-family:var(--ff-serif); font-size:1.3rem; color:var(--ink); }
.cart-foot{ padding:clamp(1.1rem,3vw,1.6rem); border-top:1px solid var(--line-strong); display:flex; flex-direction:column; gap:.8rem; }
.cart-subtotal{ display:flex; justify-content:space-between; align-items:baseline; }
.cart-subtotal span:first-child{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:color-mix(in srgb,var(--ink) 60%,transparent); }
.cart-sub-val{ font-family:var(--ff-serif); font-size:1.6rem; color:var(--ink); }
.cart-note{ font-size:.78rem; color:color-mix(in srgb,var(--ink) 52%,transparent); }
.cart-checkout{ width:100%; justify-content:center; }
.cart-continue{ background:none; border:none; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 60%,transparent); cursor:pointer; padding:.4em; transition:color .25s; }
.cart-continue:hover{ color:var(--ink); }
