/* =========================================================================
   SIREH — Selera House   ·   v2 (light, editorial, minimal)
   Inspired by the restraint of Gucci Osteria — in Sireh's green & gold.
   Dark green #102F22 · Gold #B8872E · warm parchment canvas
   ========================================================================= */

:root{
  --paper:#F4EDDF;        /* main canvas (warm parchment) */
  --paper-2:#EEE6D4;      /* slightly deeper panel */
  --ink:#102F22;          /* dark green — primary text */
  --ink-2:#1C3A2B;
  --ink-soft:rgba(16,47,34,0.60);
  --gold:#B8872E;
  --gold-deep:#946C20;
  --green:#102F22;        /* dark sections */
  --green-night:#0B2117;
  --cream:#F7F1E6;

  --display:"Fraunces","Playfair Display",Georgia,serif;
  --body:"Cormorant Garamond",Georgia,serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;

  --maxw:1380px;
  --navh:76px;
  --ease:cubic-bezier(0.22,1,0.36,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--body); background:var(--paper); color:var(--ink);
  font-size:20px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }

/* selection / type */
h1,h2,h3,h4{ font-family:var(--display); font-weight:400; line-height:1.02; letter-spacing:-0.015em; }
.display{ font-family:var(--display); font-weight:340; }
.display em,.serif-em{ font-style:italic; }
.eyebrow{ font-family:var(--sans); text-transform:uppercase; letter-spacing:0.4em; font-size:0.66rem; color:var(--gold-deep); font-weight:400; }
.lead{ font-size:1.45rem; line-height:1.55; }
em{ font-style:italic; }

/* layout */
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 6vw; }
.wrap--narrow{ max-width:860px; }
.section{ padding:clamp(5rem,12vh,11rem) 0; position:relative; }
.center{ text-align:center; }
section[id]{ scroll-margin-top:100px; }
[id].menu-block{ scroll-margin-top:calc(var(--navh) + 70px); }
.hairline{ height:1px; background:linear-gradient(90deg,transparent,rgba(16,47,34,0.2),transparent); border:0; }

/* leaf glyph (subtle accent, used in marquee/dividers) */
.leaf{ display:inline-block; width:0.7em; height:0.9em; vertical-align:middle; color:var(--gold); }

/* ---------- Buttons (pill) ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.7em;
  font-family:var(--sans); font-size:.72rem; font-weight:400; letter-spacing:.22em; text-transform:uppercase;
  padding:1.05em 2.3em; border:1px solid currentColor; border-radius:100px; color:var(--ink);
  position:relative; overflow:hidden; transition:color .5s var(--ease), background .5s var(--ease), border-color .5s var(--ease);
  background:transparent;
}
.btn:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn--gold{ background:var(--gold); border-color:var(--gold); color:var(--green); }
.btn--gold:hover{ background:var(--gold-deep); border-color:var(--gold-deep); color:var(--cream); }
.btn--light{ color:var(--cream); border-color:rgba(247,241,230,0.7); }
.btn--light:hover{ background:var(--cream); color:var(--ink); border-color:var(--cream); }

.arrowlink{ display:inline-flex; align-items:center; gap:.7em; font-family:var(--sans); font-size:.72rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-deep); }
.arrowlink .ar{ width:34px; height:1px; background:currentColor; transition:width .45s var(--ease); }
.arrowlink:hover .ar{ width:56px; }

/* ---------- Nav ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:1000;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem;
  padding:1.05rem 4vw; color:var(--ink);
  background:rgba(244,237,223,0.86); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(16,47,34,0.08);
  transition:background .5s var(--ease), color .5s var(--ease), padding .5s var(--ease), border-color .5s var(--ease);
}
.nav.transparent{ background:transparent; color:var(--cream); border-color:transparent; }
.nav__group{ display:flex; align-items:center; gap:2.1rem; }
.nav__group--right{ justify-content:flex-end; }
.nav a.link{ font-family:var(--sans); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; position:relative; padding:5px 0; color:inherit; transition:opacity .3s; }
.nav a.link::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:currentColor; transition:width .4s var(--ease); }
.nav a.link:hover::after,.nav a.link.active::after{ width:100%; }
.nav__brand{ justify-self:center; }
.nav__pill{ font-family:var(--sans); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; border:1px solid currentColor; border-radius:100px; padding:.7em 1.5em; transition:background .4s,color .4s; }
.nav.transparent .nav__pill:hover{ background:var(--cream); color:var(--ink); }
.nav:not(.transparent) .nav__pill:hover{ background:var(--ink); color:var(--paper); }
.nav__toggle{ display:none; width:28px; height:15px; position:relative; }
.nav__toggle span{ position:absolute; left:0; height:1.5px; width:100%; background:currentColor; transition:.4s var(--ease); }
.nav__toggle span:nth-child(1){ top:0 } .nav__toggle span:nth-child(2){ top:50%; transform:translateY(-50%) } .nav__toggle span:nth-child(3){ bottom:0 }
body.menu-open .nav__toggle span:nth-child(1){ top:50%; transform:translateY(-50%) rotate(45deg) }
body.menu-open .nav__toggle span:nth-child(2){ opacity:0 }
body.menu-open .nav__toggle span:nth-child(3){ bottom:50%; transform:translateY(50%) rotate(-45deg) }

/* brand logo (vector asset, pre-tinted SVGs) */
.nav-logo{ height:42px; width:auto; display:block; }
.nav-logo--dark{ display:none; }
.nav.transparent .nav-logo--light{ display:block; }
.nav.transparent .nav-logo--dark{ display:none; }
.nav:not(.transparent) .nav-logo--light{ display:none; }
.nav:not(.transparent) .nav-logo--dark{ display:block; }
.foot-logo{ height:64px; width:auto; }

/* brand wordmark (legacy text fallback) */
.logo{ display:inline-flex; flex-direction:column; align-items:center; line-height:.82; }
.logo__mark{ font-family:var(--display); font-weight:700; letter-spacing:.14em; }
.logo__script{ font-family:"Yellowtail",cursive; color:var(--gold); }
.logo--sm .logo__mark{ font-size:1.4rem } .logo--sm .logo__script{ font-size:1rem; margin-top:1px }
.logo--lg .logo__mark{ font-size:clamp(3rem,7vw,5.5rem) } .logo--lg .logo__script{ font-size:clamp(1.4rem,3.4vw,2.6rem) }
.logo--md .logo__mark{ font-size:2.4rem } .logo--md .logo__script{ font-size:1.4rem }

/* ---------- HERO (full-bleed image) ---------- */
.hero{ position:relative; height:100svh; min-height:640px; overflow:hidden; color:var(--cream); }
.hero__media{ position:absolute; inset:0; }
.hero__media .ph{ width:100%; height:100%; }
.hero__media img{ width:100%; height:100%; object-fit:cover; }
/* elegant placeholder backdrop until a real photo is dropped in */
.hero__art{ position:absolute; inset:0;
  background:
    radial-gradient(70% 60% at 72% 28%, rgba(184,135,46,0.20), transparent 60%),
    linear-gradient(160deg,#1B4231 0%, #0B2117 55%, #07150E 100%); }
.hero__art::after{ content:""; position:absolute; inset:0; opacity:0.16;
  background-repeat:no-repeat; background-position:118% 58%; background-size:auto 96%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 160'%3E%3Cg fill='none' stroke='%23B8872E' stroke-width='1.3'%3E%3Cpath d='M60 6C82 20 110 46 110 80C110 116 92 140 74 146C66 149 62 142 60 128C58 142 54 149 46 146C28 140 10 116 10 80C10 46 38 20 60 6Z'/%3E%3Cpath d='M60 18C60 60 60 100 61 134'/%3E%3Cpath d='M60 44C76 56 90 66 99 82'/%3E%3Cpath d='M60 44C44 56 30 66 21 82'/%3E%3Cpath d='M60 72C73 84 84 94 91 109'/%3E%3Cpath d='M60 72C47 84 36 94 29 109'/%3E%3C/g%3E%3C/svg%3E"); }
.hero__scrim{ position:absolute; inset:0; background:
  linear-gradient(180deg, rgba(7,21,14,0.55) 0%, rgba(7,21,14,0.22) 38%, rgba(7,21,14,0.78) 100%),
  linear-gradient(90deg, rgba(7,21,14,0.6) 0%, rgba(7,21,14,0.15) 50%, rgba(7,21,14,0) 75%); }
.hero__content{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; padding:6rem 6vw 4rem; z-index:2; }
.hero__intro{ max-width:34ch; font-size:1.4rem; line-height:1.5; font-style:italic; color:#FBF6EC; margin-bottom:1.4rem; text-shadow:0 1px 14px rgba(0,0,0,0.65); opacity:0; animation:rise 1.4s var(--ease) .5s forwards; }
.hero__title{ font-family:var(--display); font-weight:300; font-size:clamp(3.2rem,11vw,10rem); line-height:0.92; letter-spacing:-0.02em; text-shadow:0 2px 34px rgba(0,0,0,0.5); opacity:0; animation:rise 1.6s var(--ease) .7s forwards; }
.hero__title em{ font-style:italic; }
.hero__cta{ margin-top:2.4rem; display:flex; gap:1rem; flex-wrap:wrap; opacity:0; animation:rise 1.6s var(--ease) 1s forwards; }
.hero__corner{ position:absolute; top:0; right:0; }
@keyframes rise{ from{ opacity:0; transform:translateY(26px) } to{ opacity:1; transform:none } }

/* ---------- MARQUEE (constant moving banner) ---------- */
.marquee{ overflow:hidden; white-space:nowrap; border-top:1px solid rgba(16,47,34,0.14); border-bottom:1px solid rgba(16,47,34,0.14); padding:1.3rem 0; }
.marquee--dark{ background:var(--green); color:var(--cream); border-color:rgba(247,241,230,0.12); }
.marquee--gold{ background:var(--gold); color:var(--green); border:0; }
.marquee__track{ display:flex; width:max-content; animation:scrollX 36s linear infinite; will-change:transform; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__group{ display:flex; align-items:center; gap:2.4rem; padding-right:2.4rem; flex:none; }
.marquee__group span:not(.dot){ font-family:var(--display); font-style:italic; font-weight:340; font-size:clamp(1.5rem,3.5vw,2.6rem); white-space:nowrap; }
.marquee .dot{ width:7px; height:7px; border-radius:50%; background:currentColor; opacity:.5; flex:none; }
@keyframes scrollX{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* ---------- Editorial statement ---------- */
.statement{ padding:clamp(6rem,16vh,14rem) 0; }
.statement p{ font-family:var(--display); font-weight:300; font-size:clamp(1.8rem,4.4vw,3.6rem); line-height:1.18; letter-spacing:-0.015em; }
.statement em{ font-style:italic; }
.statement .small{ display:block; margin-top:2.5rem; font-family:var(--body); font-size:1.25rem; font-style:italic; color:var(--ink-soft); max-width:60ch; }

/* ---------- Interactive menu reveal (cursor-follow image) ---------- */
.showcase{ position:relative; z-index:2; padding:clamp(4rem,10vh,9rem) 0; }
.showcase__head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:1rem; margin-bottom:2.5rem; }
.showcase__head h2{ font-size:clamp(2rem,5vw,3.4rem); font-weight:300; }
.rmenu{ border-top:1px solid rgba(16,47,34,0.16); }
.rmenu__item{ border-bottom:1px solid rgba(16,47,34,0.16); }
.rmenu__item a{ display:flex; align-items:baseline; gap:1.4rem; padding:clamp(1.1rem,2.6vw,2.1rem) 0.4rem; position:relative; }
.rmenu__num{ font-family:var(--sans); font-size:.7rem; letter-spacing:.2em; color:var(--gold-deep); width:2.4rem; flex:none; }
.rmenu__name{ font-family:var(--display); font-weight:300; font-size:clamp(1.9rem,5.5vw,4.2rem); line-height:1; letter-spacing:-0.02em; transition:color .4s var(--ease), transform .5s var(--ease), opacity .4s; }
.rmenu__name em{ font-style:italic; }
.rmenu__gloss{ margin-left:auto; font-family:var(--body); font-style:italic; color:var(--ink-soft); font-size:1.05rem; align-self:center; transition:opacity .4s; }
/* dim siblings on hover for focus */
.rmenu:hover .rmenu__name{ opacity:0.35; }
.rmenu__item a:hover .rmenu__name{ opacity:1; color:var(--gold-deep); transform:translateX(14px); }
@media (hover:hover){ .rmenu__item a:hover .rmenu__num{ color:var(--gold); } }

/* floating cursor image */
.rfloat{ position:fixed; top:0; left:0; width:min(20vw,235px); aspect-ratio:4/5; z-index:1; pointer-events:none;
  transform:translate(-50%,-50%) scale(0.6); opacity:0; transition:opacity .45s var(--ease), transform .55s var(--ease); will-change:transform; }
.rfloat.show{ opacity:1; transform:translate(-50%,-50%) scale(1); }
.rfloat__inner{ position:absolute; inset:0; border-radius:50%; overflow:hidden; box-shadow:0 24px 60px rgba(11,33,23,0.32); }
/* each time you move to a new category, the bubble grows in again */
@keyframes rfpop{ 0%{ transform:scale(.72) } 60%{ transform:scale(1.05) } 100%{ transform:scale(1) } }
.rfloat.pop .rfloat__inner{ animation:rfpop .5s var(--ease); }
.rfloat__card{ position:absolute; inset:0; opacity:0; transition:opacity .5s var(--ease); display:flex; align-items:flex-end; justify-content:center; }
.rfloat__card.active{ opacity:1; }
.rfloat__card img{ width:100%; height:100%; object-fit:cover; }
.rfloat__card .ph{ width:100%; height:100%; }
.rfloat__card .cap{ position:absolute; bottom:1.2rem; left:0; right:0; text-align:center; font-family:var(--sans); font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; color:var(--cream); text-shadow:0 1px 8px rgba(0,0,0,.5); }

/* ---------- Split feature ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(2rem,7vw,7rem); }
.split--rev .split__media{ order:2; }
.split--top{ align-items:start; }
.split--top .split__media{ position:sticky; top:96px; }
.split__media .ph,.split__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.split__text .eyebrow{ margin-bottom:1.3rem; }
.split__text h2{ font-size:clamp(2rem,4.6vw,3.6rem); font-weight:300; margin-bottom:1.3rem; }
.split__text p{ color:var(--ink-soft); margin-bottom:1.2rem; }
.split__text p.first::first-letter{ font-family:var(--display); font-size:3.2em; line-height:.7; float:left; padding:.05em .12em 0 0; color:var(--gold); }
.proverb{ font-family:var(--display); font-style:italic; font-size:1.5rem; color:var(--gold-deep); border-left:2px solid var(--gold); padding-left:1.3rem; margin:1.8rem 0; }

/* ---------- Visit band ---------- */
.visit{ background:var(--green); color:var(--cream); }
.visit__inner{ display:flex; gap:clamp(1.5rem,4vw,3.5rem); justify-content:space-between; text-align:center; }
.visit__col{ flex:1 1 0; }
.visit__col h3{ font-family:var(--sans); font-size:.68rem; letter-spacing:.26em; text-transform:uppercase; color:#D9B25A; margin-bottom:1.1rem; }
.visit__col p{ font-family:var(--display); font-weight:300; font-size:1.35rem; line-height:1.5; }
.visit__col p span{ display:block; }
.visit__col .small{ font-size:1.02rem; color:rgba(247,241,230,0.6); font-style:italic; margin-top:.5rem; }
.visit__div{ flex:0 0 1px; background:rgba(247,241,230,0.18); }
.visit__actions{ display:flex; flex-direction:column; gap:.9rem; align-items:center; margin-top:.6rem; }

/* ---------- Footer ---------- */
.footer{ background:var(--green-night); color:var(--cream); padding:clamp(4rem,8vh,6rem) 0 2.4rem; }
.footer__top{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:3rem; }
.footer__brand .brandmark{ color:#D9B25A; }
.footer__brand p{ color:rgba(247,241,230,0.6); margin-top:1rem; max-width:34ch; font-style:italic; }
.footer h4{ font-family:var(--sans); font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:#D9B25A; margin-bottom:1.1rem; }
.footer a{ color:rgba(247,241,230,0.62); display:block; padding:.3rem 0; transition:color .3s; }
.footer a:hover{ color:var(--gold); }
.footer__bottom{ border-top:1px solid rgba(247,241,230,0.14); margin-top:2.6rem; padding-top:1.5rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; color:rgba(247,241,230,0.5); font-size:.8rem; font-family:var(--sans); letter-spacing:.05em; }

/* ---------- Photo placeholder ---------- */
.ph{ position:relative; width:100%; height:100%; overflow:hidden;
  background:linear-gradient(140deg,#1B4231,#0B2117);
  display:flex; align-items:center; justify-content:center; }
.ph::after{ content:attr(data-label); font-family:var(--sans); font-size:.6rem; letter-spacing:.26em; text-transform:uppercase; color:rgba(247,241,230,0.5); text-align:center; padding:1rem; }
.ph--gold{ background:linear-gradient(140deg,#C9A55A,#9A6F20); }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s } .reveal.d2{ transition-delay:.2s } .reveal.d3{ transition-delay:.3s }

/* ---------- Interior: page hero ---------- */
.pagehero{ padding:clamp(9rem,18vh,13rem) 6vw clamp(3rem,6vh,5rem); text-align:center; }
.pagehero .eyebrow{ margin-bottom:1.2rem; }
.pagehero h1{ font-size:clamp(2.8rem,7vw,5.6rem); font-weight:300; }
.pagehero h1 em{ font-style:italic; color:var(--gold-deep); }
.pagehero p{ max-width:42ch; margin:1.1rem auto 0; color:var(--ink-soft); font-style:italic; font-size:1.2rem; }
.menu-legend{ font-family:var(--sans); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-top:1.6rem; display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap; justify-content:center; font-style:normal; }
.menu-legend .leg{ display:inline-flex; align-items:center; gap:.5rem; white-space:nowrap; }
.menu-legend .ic{ vertical-align:middle; }
/* journal article body */
.article{ max-width:760px; margin:0 auto; }
.article p{ font-size:1.18rem; line-height:1.75; color:var(--ink); margin-bottom:1.3rem; }
.article p.first::first-letter{ font-family:var(--display); font-size:3.4em; line-height:.7; float:left; padding:.04em .12em 0 0; color:var(--gold); }
.article .proverb{ font-family:var(--display); font-style:italic; font-size:1.5rem; color:var(--gold-deep); border-left:2px solid var(--gold); padding-left:1.3rem; margin:1.8rem 0; }
.article__hero .ph{ height:clamp(260px,42vh,460px); margin-bottom:2.5rem; }
.post{ color:var(--ink); }
.post .ph::after{ color:rgba(247,241,230,.85); }

/* ---------- Interior: HTML menu ---------- */
.menu-section{ background:var(--paper); }
.menu-nav{ position:sticky; top:var(--navh,84px); z-index:500; display:flex; gap:1.6rem; justify-content:center; flex-wrap:wrap; padding:1rem; background:rgba(244,237,223,0.95); backdrop-filter:blur(12px); border-top:1px solid rgba(16,47,34,0.10); border-bottom:1px solid rgba(16,47,34,0.12); }
.menu-nav a{ font-family:var(--sans); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-soft); transition:color .3s; }
.menu-nav a:hover{ color:var(--gold-deep); }
.menu-block{ margin-bottom:clamp(3rem,7vh,5rem); }
.menu-block__head{ text-align:center; margin-bottom:2.4rem; }
.menu-block__head h2{ font-size:clamp(1.9rem,4vw,3rem); font-weight:300; color:var(--ink); }
.menu-block__head .my{ font-family:var(--sans); font-size:.64rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-deep); margin-top:.5rem; }
.menu-cols{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,5rem); }
.menu-sub h3{ font-family:var(--sans); font-size:.72rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-deep); margin:0 0 .8rem; padding-bottom:.5rem; border-bottom:1px solid rgba(16,47,34,0.14); }
.menu-sub + .menu-sub{ margin-top:2.2rem; }
.dish{ display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; padding:.8rem 0; border-bottom:1px dotted rgba(16,47,34,.16); }
.dish__main{ min-width:0; }
.dish__top{ display:flex; align-items:center; gap:.45rem; flex-wrap:wrap; }
.dish__name{ font-family:var(--display); font-weight:500; font-size:1.2rem; color:var(--ink); line-height:1.15; }
.dish__gloss{ display:block; font-style:italic; font-size:.92rem; color:var(--ink-soft); margin-top:.15rem; }
.dish__price{ font-family:var(--sans); font-size:.98rem; letter-spacing:.03em; color:var(--gold-deep); white-space:nowrap; padding-top:.25rem; }
.tag--pop{ font-family:var(--sans); font-size:.52rem; letter-spacing:.14em; text-transform:uppercase; background:var(--gold); color:var(--green); padding:.28em .6em; border-radius:100px; }
.chefs,.spice{ display:inline-flex; align-items:center; gap:1px; }
.ic{ width:21px; height:21px; display:inline-block; background-position:center; background-repeat:no-repeat; background-size:contain; flex:none; }
.ic-chef{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23B8872E'%3E%3Cpath d='M6 19h12v-2H6z'/%3E%3Cpath d='M6 16.6c-2 0-3.6-1.6-3.6-3.6 0-1.7 1.2-3.1 2.8-3.5C5.1 7.7 6.7 6.3 8.6 6.3c.7 0 1.3.2 1.9.5C11.2 5.5 12.5 4.6 14 4.6c2.2 0 4 1.8 4 4 0 .2 0 .3-.1.5 1.4.4 2.3 1.7 2.3 3.2 0 2-1.6 3.6-3.6 3.6H6z'/%3E%3C/svg%3E"); }
.ic-chilli{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.4 4.2c1 1.5 1 2.7.2 4' fill='none' stroke='%233A7D44' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M11.4 8c5 .8 8 4.9 6 9.5-1.5 3.4-6 3.8-8.5.8C6.3 15.4 6.9 9.8 11.4 8Z' fill='%23C0492B'/%3E%3C/svg%3E"); }
.menu-note{ text-align:center; max-width:60ch; margin:0 auto; color:var(--ink-soft); font-style:italic; }

/* ---------- Interior: gallery / journal ---------- */
.gallery-grid{ columns:3; column-gap:1rem; }
.gallery-grid .g-item{ break-inside:avoid; margin-bottom:1rem; overflow:hidden; }
.g-item .ph.a{ height:360px } .g-item .ph.b{ height:480px } .g-item .ph.c{ height:300px }
.journal-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.2rem; }
.post{ background:var(--cream); border:1px solid rgba(16,47,34,0.1); overflow:hidden; transition:transform .5s var(--ease); }
.post:hover{ transform:translateY(-6px); }
.post .ph{ height:240px } .post__body{ padding:1.6rem }
.post__date{ font-family:var(--sans); font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep); }
.post__body h3{ font-size:1.45rem; font-weight:400; margin:.6rem 0 } .post__body p{ font-size:1rem; color:var(--ink-soft) }
/* journal feature */
.jfeature{ display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:stretch; background:var(--cream); border:1px solid rgba(16,47,34,.1); overflow:hidden; transition:transform .5s var(--ease); }
.jfeature:hover{ transform:translateY(-4px); }
.jfeature:hover .arrowlink .ar{ width:54px; }
.jfeature__media .ph{ height:100%; min-height:360px; }
.jfeature__text{ padding:clamp(2rem,4vw,3.6rem); display:flex; flex-direction:column; justify-content:center; }
.jfeature__text .display{ font-size:clamp(1.9rem,3.6vw,2.9rem); color:var(--ink); margin:.3rem 0 1rem; }
.jfeature__text p{ color:var(--ink-soft); margin-bottom:1.3rem; }
@media(max-width:980px){ .jfeature{ grid-template-columns:1fr; } .jfeature__media .ph{ min-height:240px; } }

/* ---------- Interior: bookings / form ---------- */
.booking-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,5rem); align-items:start; }
.contact-card{ border:1px solid rgba(16,47,34,0.14); padding:2.2rem; background:var(--cream); }
.contact-card h3{ font-weight:400; font-size:1.5rem; margin-bottom:.9rem; }
.contact-card p{ color:var(--ink-soft); margin-bottom:.35rem; }
.contact-actions{ display:flex; flex-direction:column; gap:.9rem; margin-top:1.4rem; }
.hours-line{ display:flex; justify-content:space-between; border-bottom:1px dotted rgba(16,47,34,0.2); padding:.5rem 0; }
.hours-line span:last-child{ color:var(--ink-soft) }
.form{ display:grid; gap:1.2rem }
.field{ display:flex; flex-direction:column; gap:.4rem }
.field label{ font-family:var(--sans); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep) }
.field input,.field select,.field textarea{ background:var(--paper); border:1px solid rgba(16,47,34,0.2); padding:.8rem 1rem; color:var(--ink); font-family:var(--body); font-size:1.05rem; border-radius:2px; transition:border-color .3s }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--gold) }
.field.row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem }
.form .btn{ justify-content:center }
.form__note{ font-size:.92rem; color:var(--ink-soft); font-style:italic }
.form-success{ display:none; padding:1.1rem; border:1px solid var(--gold); color:var(--gold-deep); background:rgba(184,135,46,.08) }

/* ---------- Responsive ---------- */
@media (max-width:980px){
  body{ font-size:18px; }
  .nav__toggle{ display:block; position:relative; z-index:1101; }
  .nav__group{ display:none; }
  body.menu-open{ overflow:hidden; }
  body.menu-open .nav{ position:fixed; inset:0; height:100dvh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.6rem; background:var(--paper); color:var(--ink); }
  body.menu-open .nav__group{ display:flex; flex-direction:column; align-items:center; gap:1.5rem; transform:none; background:none; }
  body.menu-open .nav__brand{ position:absolute; top:1rem; left:50%; transform:translateX(-50%); }
  body.menu-open .nav-logo--light{ display:none; } body.menu-open .nav-logo--dark{ display:block; }
  body.menu-open .nav__toggle{ position:absolute; top:1.6rem; left:6vw; }
  body.menu-open .nav__toggle span{ background:var(--ink); }
  body.menu-open .nav a.link{ color:var(--ink); font-size:1.15rem; }
  body.menu-open .nav__pill{ display:inline-block; }
  .nav a.link{ font-size:1rem; }
  .split,.split--rev .split__media{ grid-template-columns:1fr; }
  .split{ grid-template-columns:1fr; gap:2.5rem; }
  .split--rev .split__media{ order:0; }
  .visit__inner{ flex-direction:column; gap:2.2rem; } .visit__div{ display:none; }
  .menu-cols{ grid-template-columns:1fr; }
  .menu-nav{ flex-wrap:wrap; justify-content:center; gap:.45rem 1.05rem; padding:.6rem 4vw; }
  .menu-nav a{ flex:none; font-size:.6rem; letter-spacing:.15em; }
  .menu-block__head h2{ font-size:2rem; }
  [id].menu-block{ scroll-margin-top:calc(var(--navh) + 96px); }
  .section{ padding:3.4rem 0; }
  .statement{ padding:3.1rem 0; }
  .statement p{ font-size:1.75rem; }
  .statement .small{ margin-top:1.4rem; }
  .split--top .split__media{ position:static; top:auto; }
  .split__media .ph,.split__media img{ aspect-ratio:auto; height:48vh; }
  .journal-grid{ grid-template-columns:1fr; }
  .gallery-grid{ columns:2; }
  .footer__top{ grid-template-columns:1fr; gap:2rem; }
  .booking-wrap{ grid-template-columns:1fr; }
  .field.row{ grid-template-columns:1fr; }
  .rfloat{ display:none; } /* touch: no cursor reveal */
}
@media (max-width:560px){ .gallery-grid{ columns:1; } }

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