/* Basera Hotel — shared styles (every page). Page-only styles stay inline in each page.
   Design system: Deep Charcoal #111111 · Warm White #F8F6F2 · Antique Gold #B08D57 · Soft Beige #EAE3D7
   Cormorant Garamond for headings, Inter for text, spacing on an 8px grid. */
/* ───────────────────────── TOKENS ───────────────────────── */
@font-face{font-family:'Cormorant Fallback';src:local('Georgia'),local('Times New Roman');size-adjust:92%;ascent-override:96%;descent-override:30%;line-gap-override:0%}
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('Helvetica');size-adjust:107%;ascent-override:90%;descent-override:22.5%;line-gap-override:0%}
:root{
  /* colour */
  --charcoal:#111111;          /* Deep Charcoal — text, dark bands */
  --charcoal-deep:#0B0B0B;
  --ivory:#F8F6F2;             /* Warm White — page */
  --champagne:#EAE3D7;         /* Soft Beige — panels, image placeholders */
  --beige:#EAE3D7;
  --gold:#B08D57;              /* Antique Gold — hairlines, icons, fills, gold on dark */
  --gold-ink:#7A5B2B;          /* gold TEXT on light — 5.6:1 on warm white */
  --kicker-ink:#7A5B2B;
  --gold-bright:#CFB27F;       /* gold TEXT on charcoal — 8.9:1 */
  --muted:#5F5850;             /* small meta text — 6.4:1 */
  --body-ink:#3F3B36;
  --navy:#1B2A4A;
  --line:rgba(176,141,87,.3);
  --line-soft:rgba(176,141,87,.16);
  /* type */
  --serif:'Cormorant Garamond','Cormorant Fallback',Georgia,'Times New Roman',serif;
  --sans:'Inter','Inter Fallback','Helvetica Neue',Arial,sans-serif;
  /* 8px spacing scale */
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:40px;--s6:48px;--s7:56px;--s8:64px;--s10:80px;--s12:96px;--s16:128px;
  --pad:clamp(16px,5vw,72px);
  --sec:clamp(80px,12vw,136px);
  /* shape + depth */
  --r-sm:2px;                  /* buttons, inputs, tags */
  --r:6px;                     /* cards, photographs */
  --r-lg:10px;                 /* large panels */
  --shadow-1:0 1px 2px rgba(17,17,17,.04),0 8px 24px -16px rgba(17,17,17,.18);
  --shadow-2:0 2px 4px rgba(17,17,17,.04),0 24px 48px -32px rgba(17,17,17,.34);
  /* motion — slow and quiet */
  --ease:cubic-bezier(.22,.61,.24,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --t-fast:.4s;--t:.7s;--t-slow:1.2s;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  /* keep both faces at the x-height the layout was drawn for (Cormorant runs small, Inter large) */
  font-size-adjust:.46;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(72px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ivory);color:var(--charcoal);
  font-family:var(--sans);font-weight:400;font-size:clamp(1rem,.4vw + .92rem,1.08rem);
  line-height:1.75;overflow-x:hidden;overflow-x:clip;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
::selection{background:var(--gold);color:#fff}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:fixed;left:var(--s2);top:var(--s2);z-index:300;padding:12px 20px;background:var(--charcoal);color:var(--ivory);
  border:1px solid var(--gold);border-radius:var(--r-sm);font-size:.85rem;letter-spacing:.08em;transform:translateY(-200%);transition:transform .3s}
.skip:focus{transform:none}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.1;letter-spacing:0;margin:0;text-wrap:balance}
h1{font-weight:500;letter-spacing:-.005em}
h2{font-size:clamp(2rem,5.4vw,3.5rem);line-height:1.08}
h3{font-size:clamp(1.3rem,2.4vw,1.6rem);line-height:1.2}
p{margin:0 0 1.1em;text-wrap:pretty}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
.lede{max-width:60ch;color:var(--body-ink);font-weight:300;font-size:1.06em}
/* Section intro — a gold hairline + small capitals */
.kicker{display:flex;align-items:center;gap:var(--s2);font-family:var(--sans);font-weight:500;
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--kicker-ink);margin-bottom:var(--s2)}
.kicker::before{content:"";width:40px;height:1px;background:var(--gold);flex:none}
/* ─────────────── Ogee arch: the page's one signature shape ─────────────── */
.arch{clip-path:url(#baseraArch);-webkit-clip-path:url(#baseraArch)}
/* Jaali lattice, taken from the building's facade screen */
.jaali{
  height:56px;
  background-image:
    linear-gradient(135deg,var(--line-soft) 1px,transparent 1px),
    linear-gradient(225deg,var(--line-soft) 1px,transparent 1px);
  background-size:28px 28px;
}
.jaali.on-dark{
  background-image:
    linear-gradient(135deg,rgba(176,141,87,.18) 1px,transparent 1px),
    linear-gradient(225deg,rgba(176,141,87,.18) 1px,transparent 1px);
}
/* ─────────────────── ICONS — one line set, one size ─────────────────── */
.ico{width:1.25em;height:1.25em;flex:none;display:inline-block;vertical-align:-.22em;
  fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
/* ───────────────────────── BUTTONS ─────────────────────────
   One shape everywhere: a thin gold rule, a 2px corner, and a fill that rises slowly on hover. */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s1);
  min-height:48px;padding:14px 28px;border:1px solid var(--gold);border-radius:var(--r-sm);
  font-family:var(--sans);font-size:.74rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;line-height:1.2;
  cursor:pointer;background:transparent;position:relative;overflow:hidden;isolation:isolate;text-align:center;
  transition:color var(--t) var(--ease-out),border-color var(--t) var(--ease-out),background-color var(--t) var(--ease-out);
}
.btn::after{
  content:"";position:absolute;inset:0;background:var(--gold);z-index:-1;
  transform:scaleY(0);transform-origin:50% 100%;transition:transform var(--t) var(--ease-out);
}
.btn>*{position:relative;z-index:1}
.btn:hover::after,.btn:focus-visible::after{transform:scaleY(1)}
.btn:active{opacity:.9}
/* solid — the one primary action in a view */
.btn-gold,.btn-lux{background:var(--gold);border-color:var(--gold);color:#111}
.btn-gold::after,.btn-lux::after{background:var(--charcoal)}
.btn-gold:hover,.btn-lux:hover,.btn-gold:focus-visible,.btn-lux:focus-visible{color:var(--gold-bright);border-color:var(--charcoal)}
.band .btn-gold::after,.band .btn-lux::after,.hero .btn-lux::after,.phero .btn-lux::after,.final .btn-lux::after,
.nav .btn-lux::after,.drawer .btn-gold::after,.csum .btn-lux::after,.csum .btn-gold::after{background:var(--ivory)}
.band .btn-gold:hover,.band .btn-lux:hover,.hero .btn-lux:hover,.phero .btn-lux:hover,.final .btn-lux:hover,
.nav .btn-lux:hover,.drawer .btn-gold:hover,.csum .btn-lux:hover,.csum .btn-gold:hover{color:#111;border-color:var(--ivory)}
/* outline */
.btn-line-light{color:var(--ivory)}
.btn-line-light:hover{color:#111}
.btn-line-dark{color:var(--charcoal)}
.btn-line-dark:hover{color:#fff}
/* over photography */
.btn-glass{color:var(--ivory);border-color:rgba(248,246,242,.55);background:rgba(17,17,17,.18);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.btn-glass::after{background:var(--ivory)}
.btn-glass:hover,.btn-glass:focus-visible{color:#111;border-color:var(--ivory)}
/* ───────────────────────── NAVBAR ───────────────────────── */
.nav{
  position:fixed;left:0;right:0;top:0;z-index:70;
  padding-top:env(safe-area-inset-top,0px);
  background:linear-gradient(180deg,rgba(11,11,11,.55),rgba(11,11,11,0));
  transition:background var(--t) var(--ease),backdrop-filter var(--t),box-shadow var(--t),border-color var(--t);
  border-bottom:1px solid transparent;
}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);height:80px;
  max-width:1240px;margin-inline:auto;padding-inline:var(--pad);transition:height var(--t) var(--ease)}
.nav.solid{background:rgba(17,17,17,.9);backdrop-filter:blur(20px) saturate(1.4);
  -webkit-backdrop-filter:blur(20px) saturate(1.4);border-bottom-color:rgba(176,141,87,.22);
  box-shadow:0 12px 32px -24px rgba(0,0,0,.8)}
.nav.solid .nav-in{height:64px}
.nav.solid .brand-mark{height:36px}
.nav.solid .brand-sub{opacity:0;max-height:0;margin-top:0}
.brand-mark{transition:height var(--t) var(--ease)}
.brand-sub{transition:opacity var(--t-fast),max-height var(--t) var(--ease),margin-top var(--t) var(--ease);overflow:hidden;display:block}
.brand{display:flex;align-items:center;gap:12px;color:var(--ivory)}
.brand-mark{width:auto;height:44px;flex:none;display:block}
.drawer .brand-mark{height:48px}
footer .brand-mark{height:72px}
footer .brand{align-items:flex-start}
.brand-name{font-family:var(--serif);font-weight:500;font-size:1.12rem;letter-spacing:.22em;line-height:1;white-space:nowrap}
.brand-sub{font-size:.58rem;font-weight:500;letter-spacing:.34em;color:var(--gold-bright);margin-top:6px}
.nav-links{display:none;gap:var(--s4);align-items:center}
.nav-links a{font-size:.74rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:rgba(248,246,242,.84);
  position:relative;padding-block:var(--s1);transition:color var(--t-fast)}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t) var(--ease-out)}
.nav-links a:hover{color:var(--ivory)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1)}
.nav-links a[aria-current]{color:#fff}
.nav-cta{display:none}
.nav .nav-cta{min-height:44px;padding:12px 22px}
.burger{width:44px;height:44px;display:grid;place-items:center;align-content:center;background:none;border:0;cursor:pointer}
.burger span{display:block;width:24px;height:1px;background:var(--ivory);margin:4px 0;transition:transform var(--t) var(--ease-out),opacity var(--t-fast)}
.burger span:nth-child(2){width:16px;justify-self:end}
.burger.x span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0}
.burger.x span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
@media(min-width:900px){
  .nav-links{display:flex}
  .nav-cta{display:inline-flex}
  .burger{display:none}
}
@media(min-width:900px) and (max-width:1099px){
  .nav-links{gap:var(--s3)}
  .nav-links a{letter-spacing:.14em}
}
/* small phones (320–360px): the hotel name must not run under the order bag */
@media(max-width:374px){
  .nav-in{gap:8px}
  .nav .brand{gap:9px;min-width:0}
  .nav .brand-name{font-size:1.02rem;letter-spacing:.16em}
  .nav-end{gap:.1rem}
}
@media(max-width:339px){
  .nav .brand-mark{height:38px}
  .nav .brand-name{font-size:.92rem;letter-spacing:.11em}
  .nav .brand-sub{letter-spacing:.26em}
}
/* Drawer — a quiet full-height panel; links arrive one after another */
.drawer{
  position:fixed;inset:0;z-index:80;background:var(--charcoal-deep);
  padding:calc(env(safe-area-inset-top,0px) + var(--s2)) var(--pad) calc(env(safe-area-inset-bottom,0px) + var(--s4));
  display:flex;flex-direction:column;visibility:hidden;
  opacity:0;transform:translateY(-12px);
  transition:opacity .6s var(--ease-out),transform .8s var(--ease-out),visibility 0s .8s;overflow-y:auto;
}
.drawer::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(135deg,rgba(176,141,87,.07) 1px,transparent 1px),linear-gradient(225deg,rgba(176,141,87,.07) 1px,transparent 1px);
  background-size:28px 28px}
.drawer>*{position:relative}
.drawer.open{opacity:1;transform:none;visibility:visible;transition:opacity .6s var(--ease-out),transform .8s var(--ease-out),visibility 0s}
.drawer-head{display:flex;justify-content:space-between;align-items:center;min-height:64px;margin-bottom:var(--s4)}
.drawer nav{display:flex;flex-direction:column}
.drawer nav a{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  font-family:var(--serif);font-weight:500;font-size:1.75rem;line-height:1.2;color:var(--ivory);padding:14px 0;
  border-bottom:1px solid rgba(176,141,87,.16);
  opacity:0;transform:translateY(12px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),color var(--t-fast);
}
.drawer nav a::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none;opacity:0;transition:opacity var(--t-fast)}
.drawer nav a[aria-current]{color:var(--gold-bright)}
.drawer nav a[aria-current]::after{opacity:1}
.drawer.open nav a{opacity:1;transform:none}
.drawer.open nav a:nth-child(2){transition-delay:.05s}
.drawer.open nav a:nth-child(3){transition-delay:.1s}
.drawer.open nav a:nth-child(4){transition-delay:.15s}
.drawer.open nav a:nth-child(5){transition-delay:.2s}
.drawer.open nav a:nth-child(6){transition-delay:.25s}
.drawer.open nav a:nth-child(7){transition-delay:.3s}
.drawer.open nav a:nth-child(8){transition-delay:.35s}
.drawer nav a:hover{color:var(--gold-bright)}
.drawer-foot{margin-top:auto;padding-top:var(--s4);color:rgba(248,246,242,.62);font-size:.86rem;line-height:1.8}
.drawer-foot a{color:var(--gold-bright)}
.drawer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s1);margin-top:var(--s4)}
.drawer-actions .btn{padding-inline:12px}
/* Hero entrance */
.rise{opacity:0;transform:translateY(24px);animation:rise 1.4s var(--ease-out) forwards}
@keyframes rise{to{opacity:1;transform:none}}
/* ───────────────────── STORY + COUNTERS ───────────────────── */
.story{display:grid;gap:clamp(2.4rem,6vw,4.5rem);align-items:center}
@media(min-width:940px){
  .story{grid-template-columns:.95fr 1.05fr}
}
.story-img{position:relative}
.story-img .arch{aspect-ratio:4/5;object-fit:cover;width:100%;height:auto}
.story-img::after{content:"";position:absolute;inset:14px -14px -14px 14px;border:1px solid var(--line);
  border-radius:0 0 14px 14px;z-index:-1}
.counters{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem 1rem;margin-top:2.6rem;
  padding-top:2.2rem;border-top:1px solid var(--line)}
.counter-n{font-family:var(--serif);font-weight:500;font-size:clamp(2.4rem,6vw,3.4rem);color:var(--gold-ink);line-height:1;font-variant-numeric:lining-nums tabular-nums}
.counter-l{font-size:.7rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:var(--s1)}
@media(min-width:620px){
  .counters{grid-template-columns:repeat(4,1fr)}
}
/* ───────────────────── EXPERIENCES ───────────────────── */
/* a warm band — beige with the faintest jaali, so white cards sit on it like paper on linen */
.sec-warm{position:relative;background:linear-gradient(180deg,#F3EEE5 0%,#EAE3D7 100%);border-block:1px solid rgba(176,141,87,.18)}
.sec-warm::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:linear-gradient(135deg,rgba(176,141,87,.12) 1px,transparent 1px),linear-gradient(225deg,rgba(176,141,87,.12) 1px,transparent 1px);
  background-size:28px 28px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%)}
.sec-warm>.wrap{position:relative}
.exp-grid{display:grid;gap:var(--s2)}
@media(min-width:640px){.exp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1040px){.exp-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}
.exp{position:relative;background:#fff;border:1px solid rgba(176,141,87,.2);border-radius:var(--r);padding:var(--s5) var(--s4) var(--s4);
  box-shadow:0 1px 2px rgba(17,17,17,.04),0 18px 36px -28px rgba(17,17,17,.4)}
.exp::before{content:"";position:absolute;left:var(--s4);top:0;width:40px;height:2px;background:var(--gold);transition:width 1s var(--ease-out)}
.exp:hover::before{width:calc(100% - 2 * var(--s4))}
.exp-ico{width:56px;height:56px;border-radius:50%;background:var(--charcoal);color:var(--gold-bright);
  display:grid;place-items:center;font-size:1.35rem;margin-bottom:var(--s3);box-shadow:0 10px 20px -12px rgba(17,17,17,.6);
  transition:background var(--t),color var(--t)}
.exp:hover .exp-ico{background:var(--gold);color:#111}
.exp h3{margin-bottom:var(--s1)}
.exp p{font-size:.92rem;color:var(--muted);margin:0}
@media(max-width:639px){
  .exp{display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 18px;padding:24px 20px;align-items:start}
  .exp::before{left:20px}
  .exp .exp-ico{grid-row:span 2;margin:0;width:52px;height:52px}
  .exp h3{margin:4px 0 2px;font-size:1.3rem}
}
/* ───────────────────── DARK BANDS ───────────────────── */
.band{position:relative;color:var(--ivory);background:var(--charcoal);overflow:hidden}
.band>.wrap{position:relative;z-index:2}
.band .lede{color:rgba(248,246,242,.78)}
.band .kicker{color:var(--gold)}
.glass{
  position:relative;
  background:linear-gradient(150deg,rgba(32,30,27,.58),rgba(16,16,16,.46));
  backdrop-filter:blur(30px) saturate(1.5);-webkit-backdrop-filter:blur(30px) saturate(1.5);
  border:1px solid rgba(207,178,127,.28);border-radius:var(--r-lg);
  padding:clamp(32px,4.4vw,56px);max-width:640px;
  box-shadow:0 46px 100px -46px rgba(0,0,0,.94),
             inset 0 1px 0 rgba(255,255,255,.16),
             inset 0 -1px 0 rgba(0,0,0,.34);
}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(140deg,rgba(255,255,255,.1),transparent 42%)}
/* Curved divider between bands */
.curve{display:block;width:104%;margin-left:-2%;height:clamp(46px,6vw,92px);position:relative;z-index:3}
.tick{display:grid;gap:.65rem;margin:1.6rem 0 2rem;padding:0;list-style:none}
.tick li{display:flex;gap:.7rem;align-items:flex-start;font-size:.93rem;color:rgba(248,246,242,.86)}
.tick li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none;margin-top:.62rem}
/* Banquet halls */
.halls{display:grid;gap:1.3rem;margin-top:2.8rem}
@media(min-width:760px){
  .halls{grid-template-columns:repeat(3,1fr)}
}
.hall{border:1px solid rgba(176,141,87,.32);border-radius:var(--r);padding:var(--s4) var(--s3);
  background:rgba(17,17,17,.4);backdrop-filter:blur(8px)}
.hall:hover{border-color:var(--gold)}
.hall-cap{font-family:var(--serif);font-weight:500;font-size:2.4rem;color:var(--gold-bright);line-height:1}
.hall h3{margin:.55rem 0 .3rem}
.hall p{font-size:.86rem;color:rgba(248,246,242,.7);margin:0}
/* ───────────────────── GALLERY ───────────────────── */
.gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-auto-flow:dense}
@media(min-width:760px){
  .gal{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
}
@media(min-width:1100px){
  .gal{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
}
/* square tiles, with every fifth photo running double-width as a feature —
   photos are cropped to the tile (object-fit), never stretched */
.gal figure{position:relative;margin:0;overflow:hidden;border-radius:var(--r);aspect-ratio:1/1;
  background:var(--champagne);box-shadow:var(--shadow-1);
  transition:transform 1s var(--ease-out),box-shadow 1s var(--ease-out)}
.gal figure:nth-child(5n+1){grid-column:span 2;aspect-ratio:2/1}
@media(min-width:760px){
  .gal:not(.gal--plain) figure:nth-child(5n+1){aspect-ratio:auto}
}
.gal figure>img,.gal figure>a{position:absolute!important;inset:0}
.gal.gal--plain figure{grid-column:auto;aspect-ratio:1/1}
@media(min-width:1100px){
  .gal.gal--plain{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:760px) and (max-width:1099px){
  .gal.gal--plain{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.gal figure::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  border:1px solid transparent;
  background:linear-gradient(180deg,transparent 45%,rgba(12,12,12,.78));
  opacity:.55;transition:opacity .6s var(--ease-out),border-color .6s}
.gal figure:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.gal figure:hover::after,.gal figure:focus-within::after{opacity:1;border-color:rgba(176,141,87,.6)}
.gal figure>a{display:block!important;width:100%;height:100%;min-height:0!important;color:inherit}
.gal img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;
  transform:translateZ(0);transition:transform 1.8s var(--ease-out);
  filter:saturate(.94) contrast(1.02)}
.gal figure:hover img{transform:scale(1.04)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.4rem 1.1rem .95rem;
  font-family:var(--serif);font-weight:500;font-size:1.08rem;letter-spacing:.01em;color:var(--ivory);line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;transform:translateY(10px);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out)}
.gal figure:hover figcaption,.gal figure:focus-within figcaption{opacity:1;transform:none}
@media(hover:none){
  .gal figcaption{opacity:1;transform:none}
}
@media(max-width:759px){
  .gal figcaption{font-size:.84rem;padding:1rem .8rem .7rem}
  .gal figure{border-radius:var(--r)}
}
.rev-stage{position:relative;min-height:280px;max-width:720px;margin-inline:auto}
@media(max-width:599px){.rev-stage{min-height:300px}}
.rev{position:absolute;inset:0;margin:0;opacity:0;transform:translateY(22px) scale(.985);
  transition:opacity .75s var(--ease-out),transform .75s var(--ease-out);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  pointer-events:none;padding:clamp(2.2rem,5vw,3.4rem) clamp(1.4rem,4vw,3rem);
  background:linear-gradient(150deg,rgba(255,255,255,.76),rgba(255,255,255,.44));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  border:1px solid var(--line-soft);border-radius:var(--r-lg);
  box-shadow:0 34px 76px -44px rgba(17,17,17,.5),inset 0 1px 0 rgba(255,255,255,.86)}
.rev.on{opacity:1;transform:none;pointer-events:auto}
.rev::before{content:"\201C";position:absolute;top:-.08em;left:50%;translate:-50% 0;
  font-family:var(--serif);font-size:clamp(5rem,13vw,8rem);line-height:1;
  color:var(--gold);opacity:.26;pointer-events:none}
.rev blockquote{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.3rem,3vw,1.9rem);line-height:1.45;
  max-width:26ch;margin:0 0 1.4rem;color:var(--charcoal)}
.rev cite{font-style:normal;font-size:.7rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--kicker-ink)}
.dots{display:flex;gap:1px;justify-content:center;margin-top:2rem}
/* The button is a 24px square so it satisfies WCAG 2.5.8 on its own; the dot you
   actually see is the 7px ::before drawn in the middle of it. */
.dot{width:24px;height:24px;border:0;background:transparent;padding:0;cursor:pointer;
  position:relative;border-radius:50%}
.dot::before{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;
  margin:-4.5px 0 0 -4.5px;border-radius:50%;border:1px solid var(--gold);
  transition:background .3s,transform .3s}
.dot.on::before{background:var(--gold);transform:scale(1.35)}
.dot:focus-visible{outline:2px solid var(--gold-ink);outline-offset:1px}
/* ───────────────────── FACILITIES ───────────────────── */
.facil{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line-soft);
  border:1px solid var(--line-soft);border-radius:var(--r);overflow:hidden}
@media(min-width:680px){
  .facil{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1000px){
  .facil{grid-template-columns:repeat(4,1fr)}
}
.fac{background:var(--ivory);padding:20px 4px;text-align:center;transition:background var(--t)}
@media(min-width:680px){.fac{padding:var(--s3) var(--s2)}}
.fac:hover{background:#fff}
.fac i{display:block;font-style:normal;font-size:1.5rem;line-height:1;margin-bottom:12px;color:var(--gold-ink)}
.fac i .ico{width:1em;height:1em;vertical-align:0}
.fac span{display:block;font-size:clamp(.7rem,2.6vw,.84rem);line-height:1.35;overflow-wrap:anywhere;color:var(--body-ink);letter-spacing:.01em}
.fac small{display:block;font-size:.68rem;color:var(--muted);margin-top:.15rem}
/* ───────────────────── LOCATION ───────────────────── */
.loc{display:grid;gap:2.4rem}
@media(min-width:940px){
  .loc{grid-template-columns:1fr 1.15fr;align-items:center}
}
.map{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;min-height:330px;background:var(--champagne)}
.map iframe{width:100%;height:100%;min-height:330px;border:0;display:block;filter:grayscale(.28) contrast(1.02)}
.near{list-style:none;padding:0;margin:1.8rem 0 2rem;display:grid;gap:.1rem}
.near li{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line);font-size:.92rem}
.near li span:last-child{color:var(--gold-ink);font-family:var(--serif);font-weight:600;font-size:1.05rem}
.contact-row{display:grid;gap:1.4rem;margin-bottom:2rem}
@media(min-width:560px){
  .contact-row{grid-template-columns:1fr 1fr}
}
.contact-row .f-h{font-size:1rem;margin-bottom:.35rem}
.contact-row p{font-size:.92rem;color:var(--muted);margin:0}
.contact-row a:hover{color:var(--gold-ink)}
/* ───────────────────── FINAL CTA ───────────────────── */
.final{position:relative;background:var(--charcoal-deep);color:var(--ivory);text-align:center;overflow:hidden}
.final::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(135deg,rgba(176,141,87,.08) 1px,transparent 1px),linear-gradient(225deg,rgba(176,141,87,.08) 1px,transparent 1px);background-size:28px 28px}
.final>.wrap{position:relative;z-index:2}
.final h2{font-size:clamp(2.1rem,6.4vw,4rem);margin-bottom:1.1rem}
.final p{max-width:46ch;margin:0 auto 2.2rem;color:rgba(248,246,242,.74)}
.final .hero-btns{justify-content:center}
/* ───────────────────── FOOTER ───────────────────── */
footer{position:relative;background:var(--charcoal);color:rgba(248,246,242,.7);padding-block:clamp(64px,8vw,96px) 0;
  font-size:.9rem;font-weight:300;border-top:1px solid rgba(176,141,87,.28)}
footer::before{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;background:var(--gold);transform:translateX(-50%) rotate(45deg)}
.f-grid{display:grid;gap:var(--s6)}
@media(min-width:800px){
  .f-grid{grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:var(--s5)}
}
footer .f-h{font-family:var(--sans);font-weight:500;color:var(--gold-bright);font-size:.7rem;letter-spacing:.24em;
  text-transform:uppercase;margin-bottom:var(--s2)}
footer nav{display:grid;gap:4px}
footer nav a{color:rgba(248,246,242,.74);transition:color var(--t-fast);padding-block:10px;min-height:44px}
footer a:hover{color:var(--gold-bright)}
footer .f-contact a{display:flex!important;gap:12px;align-items:flex-start;line-height:1.6}
footer .f-contact .ico{color:var(--gold);margin-top:.2em;width:1.05em;height:1.05em}
.socials{display:flex;gap:var(--s1);margin-top:var(--s3)}
.socials a{width:44px;height:44px;border:1px solid rgba(176,141,87,.4);border-radius:50%;display:grid;place-items:center;
  color:rgba(248,246,242,.82);transition:background var(--t),color var(--t),border-color var(--t)}
.socials a svg{width:17px;height:17px}
.socials a:hover{background:var(--gold);color:#111;border-color:var(--gold)}
.f-bottom{margin-top:var(--s8);border-top:1px solid rgba(176,141,87,.18);padding-block:var(--s3);
  display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);justify-content:space-between;
  font-size:.68rem;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:rgba(248,246,242,.62)}
/* ───────────────────── AI CHAT WIDGET ───────────────────── */
.chat-fab{
  position:fixed;right:clamp(1rem,3vw,2rem);z-index:75;
  bottom:calc(env(safe-area-inset-bottom,0px) + 72px);
  width:56px;height:56px;border-radius:50%;border:1px solid rgba(207,178,127,.6);
  background:var(--charcoal);
  color:var(--gold-bright);font-size:1.4rem;display:grid;place-items:center;cursor:pointer;
  box-shadow:0 12px 32px -12px rgba(0,0,0,.55);
  transition:transform var(--t) var(--ease-out),opacity var(--t-fast),background var(--t),color var(--t)}
@media(min-width:900px){
  .chat-fab{bottom:clamp(1.4rem,3vw,2rem)}
}
.chat-fab:hover{background:var(--gold);color:#111}
.chat-fab .ico{width:24px;height:24px}
.chat-fab.hide,.chat-fab.rest{opacity:0;pointer-events:none;transform:scale(.6)}
.chat{
  position:fixed;right:clamp(1rem,3vw,2rem);z-index:78;
  bottom:calc(env(safe-area-inset-bottom,0px) + 72px);
  width:min(390px,calc(100vw - 2rem));height:min(560px,calc(100svh - 150px));
  display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-lg);
  background:#141414;
  border:1px solid rgba(176,141,87,.36);
  box-shadow:0 42px 90px -36px rgba(0,0,0,.94);
  opacity:0;transform:translateY(22px) scale(.96);pointer-events:none;
  transition:opacity .45s var(--ease-out),transform .45s var(--ease-out)}
@media(min-width:900px){
  .chat{bottom:clamp(1.4rem,3vw,2rem)}
}
.chat{visibility:hidden;transition:opacity .45s var(--ease-out),transform .45s var(--ease-out),visibility 0s .45s}
.chat.open{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .45s var(--ease-out),transform .45s var(--ease-out),visibility 0s}
.chat-head{display:flex;align-items:center;gap:.8rem;padding:1.1rem 1.2rem;
  border-bottom:1px solid rgba(176,141,87,.24);background:rgba(176,141,87,.08)}
.chat-av{width:40px;height:44px;flex:none;border:1px solid var(--gold);
  border-radius:50% 50% 5px 5px/40% 40% 5px 5px;display:grid;place-items:center;
  font-family:var(--serif);color:var(--gold-bright);background:rgba(0,0,0,.3)}
.chat-head b{font-family:var(--serif);font-weight:400;color:var(--ivory);font-size:1.05rem;display:block}
.chat-head small{font-size:.72rem;color:var(--gold);letter-spacing:.06em}
.chat-x{margin-left:auto;background:none;border:0;color:rgba(248,246,242,.6);
  font-size:1.4rem;line-height:1;cursor:pointer;padding:.3rem .5rem;border-radius:8px}
.chat-x:hover{color:var(--ivory);background:rgba(255,255,255,.08)}
.chat-log{flex:1;overflow-y:auto;padding:1.2rem;display:flex;flex-direction:column;gap:.85rem;
  scrollbar-width:thin;scrollbar-color:rgba(176,141,87,.5) transparent}
.chat-log::-webkit-scrollbar{width:5px}
.chat-log::-webkit-scrollbar-thumb{background:rgba(176,141,87,.45);border-radius:9px}
.msg{max-width:85%;padding:.78rem 1rem;border-radius:var(--r);font-size:.89rem;line-height:1.6;
  animation:msgIn .45s var(--ease-out) both}
@keyframes msgIn{from{opacity:0;transform:translateY(10px)}}
.msg.bot{align-self:flex-start;background:rgba(255,255,255,.07);color:rgba(248,246,242,.92);
  border:1px solid rgba(232,216,184,.18);border-bottom-left-radius:5px}
.msg.me{align-self:flex-end;background:var(--gold);
  color:#111;border-bottom-right-radius:4px}
.msg a{color:var(--gold-bright);text-decoration:underline}
.msg.me a{color:#111}
.typing{align-self:flex-start;display:flex;gap:4px;padding:.9rem 1rem;
  background:rgba(255,255,255,.07);border-radius:var(--r);border-bottom-left-radius:5px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--gold);
  animation:dot 1.3s ease-in-out infinite}
.typing i:nth-child(2){animation-delay:.18s}
.typing i:nth-child(3){animation-delay:.36s}
@keyframes dot{0%,60%,100%{opacity:.28;transform:translateY(0)}30%{opacity:1;transform:translateY(-5px)}}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;padding:0 1.2rem .9rem}
.chip{font-size:.75rem;padding:.42rem .85rem;border-radius:var(--r-sm);cursor:pointer;
  background:transparent;border:1px solid rgba(176,141,87,.44);color:rgba(248,246,242,.84);
  transition:background .3s,border-color .3s,transform .3s}
.chip:hover{background:rgba(176,141,87,.18);border-color:var(--gold)}
.chat-form{display:flex;gap:.6rem;padding:.9rem 1.2rem 1.1rem;
  border-top:1px solid rgba(176,141,87,.22)}
.chat-form input{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(232,216,184,.2);
  border-radius:var(--r-sm);padding:.72rem 1.1rem;color:var(--ivory);font-size:.89rem;
  transition:border-color .3s,background .3s}
.chat-form input::placeholder{color:rgba(248,246,242,.42)}
.chat-form input:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.1)}
.chat-send{width:44px;height:44px;flex:none;border-radius:50%;border:0;cursor:pointer;
  background:var(--gold);color:#111;font-size:1rem;
  transition:background var(--t-fast)}
.chat-send:hover{background:var(--gold-bright)}
/* Sticky mobile action bar */
.actionbar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;
  background:rgba(17,17,17,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid rgba(176,141,87,.3);
  padding-bottom:env(safe-area-inset-bottom,0px);
  transform:translateY(110%);transition:transform .45s cubic-bezier(.2,.8,.3,1);
}
.actionbar.show{transform:none}
.actionbar a{flex:1;text-align:center;padding:16px 8px;font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory)}
.actionbar a+a{border-left:1px solid rgba(176,141,87,.2)}
.actionbar a.pri{background:var(--gold);color:#111;font-weight:600}
@media(min-width:900px){
  .actionbar{display:none}
}
body{padding-bottom:0}
@media(max-width:899px){
  body{padding-bottom:56px}
}
/* Scroll reveal */
.r{opacity:0;transform:translateY(24px);transition:opacity 1.3s var(--ease-out),transform 1.3s var(--ease-out)}
.r.in{opacity:1;transform:none;will-change:auto}
/* shown plainly if the page's scripts are late on a weak connection */
.bl-show .r,.bl-show .stagger>*{opacity:1!important;transform:none!important}
.stagger>*{opacity:0;transform:translateY(24px);transition:opacity 1.2s var(--ease-out),transform 1.2s var(--ease-out)}
.stagger.in>*{opacity:1;transform:none}
.stagger.in>:nth-child(2){transition-delay:.12s}
.stagger.in>:nth-child(3){transition-delay:.24s}
.stagger.in>:nth-child(4){transition-delay:.36s}
.stagger.in>:nth-child(5){transition-delay:.48s}
.stagger.in>:nth-child(n+6){transition-delay:.6s}
/* Shared hover lift */
.exp,.hall,.fac{transition:background var(--t),border-color var(--t),transform 1s var(--ease-out),box-shadow 1s var(--ease-out)}
.exp:hover{transform:translateY(-4px);box-shadow:0 2px 4px rgba(17,17,17,.04),0 28px 50px -30px rgba(17,17,17,.5)}
.fac:hover{background:#fff}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .r,.stagger>*{opacity:1;transform:none}
  .rise{animation:none;opacity:1;transform:none}
  .hero-bg{transform:none}
  .rev.on{animation:none}
  .room-rate{transform:none}
}
/* a visible focus ring everywhere, not just where the browser decides */
a:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold-ink);outline-offset:3px;border-radius:4px
}
/* ══════════════════ LUXE LAYER ══════════════════
   Scroll progress · heading reveal · parallax · photo reveal · page fade
   No libraries. Everything below is opt-out under prefers-reduced-motion. */
/* ── 2. Scroll progress ── */
#luxeProg{position:fixed;left:0;top:0;height:1px;width:0;z-index:99;background:var(--gold);pointer-events:none;
  transition:width .12s linear}
/* ── 4. Split-text reveal ── */
.split .lw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}
.split .lw>i{display:inline-block;font-style:inherit;transform:translateY(105%);
  transition:transform 1.3s var(--ease-out)}
.split.lit .lw>i{transform:none}
/* ── 5. Mask reveal for photography ──
   Never put the clip on the element we observe: a clipped element has zero
   visible area, so IntersectionObserver would never fire and it would stay
   hidden forever. The observer always watches an unclipped parent. */
.mask{clip-path:inset(0 0 100% 0);transition:clip-path 1.5s var(--ease-out)}
.mask.lit{clip-path:inset(0 0 0 0)}
.mask>img,.mask>a>img{transform:scale(1.05);transition:transform 2s var(--ease-out)}
.mask.lit>img,.mask.lit>a>img{transform:none}
/* for anything that already owns a clip-path (the ogee arch) — lift instead */
.rise-in{opacity:0;transform:translateY(24px);
  transition:opacity 1.3s var(--ease-out),transform 1.3s var(--ease-out)}
.rise-in.lit{opacity:1;transform:none}
/* ── 6. Parallax ── */
[data-par]{will-change:transform}
/* ── 7. Page fade ── */
body{opacity:1;transition:opacity .38s ease}
body.luxe-leaving{opacity:0}
.hcard,.rcard{transition:transform 1s var(--ease-out),box-shadow 1s var(--ease-out),border-color var(--t),color var(--t),background var(--t)}
/* ── Respect the setting, and never trap anyone ── */
@media(prefers-reduced-motion:reduce){
  .split .lw>i{transform:none!important}
  .mask{clip-path:none!important}
  .mask img,img.mask{transform:none!important}
  [data-par]{transform:none!important}
  body.luxe-leaving{opacity:1}
}
@media print{
  #luxeProg,.nav,.actionbar,.chat-fab,.chat{display:none!important}
}
/* ── Nav: food-order bag ── */
.nav-end{display:flex;align-items:center;gap:.5rem}
.nav-cart{position:relative;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;
  color:var(--ivory);transition:background .35s,color .35s}
.nav-cart:hover{background:rgba(176,141,87,.18);color:var(--gold-bright)}
.nav-cart b{position:absolute;top:3px;right:0;min-width:19px;height:19px;padding:0 5px;border-radius:10px;
  background:var(--gold);color:#111;font-size:.66rem;font-weight:600;line-height:19px;text-align:center;
  box-shadow:0 0 0 2px rgba(11,11,11,.6)}
.nav-cart b[hidden]{display:none}
/* ── Phone footer: compact, two columns ── */
@media(max-width:799px){
  .f-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 1.2rem}
  .f-grid>div:first-child,.f-grid>div:last-child{grid-column:1 / -1}
  footer nav{gap:0}
  footer nav a,.f-links a{display:inline-block;padding-block:.62rem;min-height:44px;font-size:.88rem}
  footer .f-h{margin-bottom:.4rem}
  .f-bottom{margin-top:2rem;flex-direction:column;gap:.3rem}
}
.dwrap>input{width:100%}
/* form fields always use dark text on their white boxes, even inside dark bands */
textarea{font:inherit}
.field input,.field select,.field textarea,.inp,.bf input,.bf select,.pb-f input,.pb-f select{color:var(--charcoal)}
.field input::placeholder,.field textarea::placeholder{color:#736B60}
/* lightbox */
.lbx{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  background:rgba(10,10,10,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease-out),visibility 0s .45s;
  padding:calc(env(safe-area-inset-top,0px) + 3.6rem) 1rem calc(env(safe-area-inset-bottom,0px) + 1.2rem)}
.lbx.open{opacity:1;visibility:visible;transition:opacity .45s var(--ease-out),visibility 0s}
.lbx-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:min(1180px,100%);touch-action:pan-y}
.lbx-img{max-width:100%;max-height:calc(100svh - 11rem);width:auto;height:auto;object-fit:contain;
  border-radius:var(--r);box-shadow:0 40px 90px -40px rgba(0,0,0,.95);
  opacity:0;transform:scale(.975);transition:opacity .4s var(--ease-out),transform .6s var(--ease-out)}
.lbx-img.on{opacity:1;transform:none}
.lbx-cap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.4rem 1.1rem;
  color:rgba(248,246,242,.86);text-align:center}
.lbx-cap b{font-family:var(--serif);font-weight:400;font-size:1.08rem;color:var(--ivory)}
.lbx-cap small{font-size:.76rem;letter-spacing:.14em;color:var(--gold);font-variant-numeric:tabular-nums}
.lbx-go{font-size:.8rem;letter-spacing:.08em;color:var(--gold-bright);border-bottom:1px solid rgba(176,141,87,.5);
  padding:.35rem 0;min-height:44px;display:inline-flex;align-items:center}
.lbx-go[hidden]{display:none}
.lbx-go:hover{color:#fff}
.lbx-btn{position:absolute;z-index:2;width:48px;height:48px;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;font-size:1.35rem;line-height:1;color:var(--ivory);
  background:rgba(255,255,255,.06);border:1px solid rgba(176,141,87,.45);
  transition:background .35s,border-color .35s,transform .35s var(--ease-out)}
.lbx-btn:hover{background:var(--gold);border-color:var(--gold);color:var(--charcoal)}
.lbx-x{top:calc(env(safe-area-inset-top,0px) + .9rem);right:1rem}
.lbx-x:hover{transform:rotate(90deg)}
.lbx-prev{left:1rem;top:50%;translate:0 -50%}
.lbx-next{right:1rem;top:50%;translate:0 -50%}
@media(max-width:699px){
  .lbx-prev,.lbx-next{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 1rem);translate:none;width:46px;height:46px}
  .lbx{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 5rem)}
  .lbx-img{max-height:calc(100svh - 14rem)}
}
.gal figure,.decor figure{cursor:zoom-in}
/* home gallery shows full rows only (8 · 10 · 13 photos); the lightbox still walks through all of them */
.gal.gal--home figure:nth-child(n+9){display:none}
@media(min-width:760px){.gal.gal--home figure:nth-child(-n+10){display:block}}
@media(min-width:1100px){.gal.gal--home figure:nth-child(-n+13){display:block}}
.gal-more{display:flex;justify-content:center;margin-top:var(--s4)}
@media(prefers-reduced-motion:reduce){
  .lbx,.lbx-img{transition:none}
}
/* date/time hint */
/* phones draw an empty date/time box as blank — say what goes in it */
.dwrap{position:relative;display:block;min-width:0}
.dwrap>.dph{position:absolute;left:.9rem;right:2.4rem;top:50%;translate:0 -50%;color:#736B60;font-size:.9rem;
  pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dwrap.has>.dph{display:none}
.dwrap:not(.has)>input::-webkit-datetime-edit{color:transparent}
.dwrap:not(.has)>input{color:transparent}
/* ── shared by several pages (inner-page hero, cards, forms, menu) ── */
.stars{color:var(--gold);letter-spacing:.3em;margin-bottom:1.3rem;font-size:.95rem;
  text-shadow:0 2px 10px rgba(176,141,87,.5)}
.crumb{display:flex;gap:.5rem;align-items:center;font-size:.76rem;letter-spacing:.14em;
  color:rgba(248,246,242,.62);margin-bottom:1.1rem}
.crumb a{color:var(--gold);display:inline-flex;align-items:center;min-height:24px}
.crumb a:hover{color:var(--ivory)}
.phero-tag{font-family:var(--serif);font-style:italic;color:var(--champagne);
  font-size:clamp(1.1rem,3.2vw,1.7rem);margin-bottom:1rem}
.phero-curve path{fill:var(--ivory)}
.hours{display:inline-flex;align-items:center;gap:.6rem;font-size:.84rem;letter-spacing:.05em;
  padding:.45rem 1.1rem;border-radius:var(--r-sm);border:1px solid rgba(232,216,184,.4);
  background:rgba(20,20,20,.4);backdrop-filter:blur(10px);margin-bottom:1.4rem}
.hours i{width:7px;height:7px;border-radius:50%;background:#6FCF7F;display:block}
.hours i.shut{background:#C96C5B;animation:none}
/* category navigation — a quiet row of small capitals, the active one underlined in gold */
/* veg / non-veg — the FSSAI marks: green square + dot, brown square + triangle */
.d-mark{width:14px;height:14px;flex:none;margin-top:.4rem;border-radius:2px;
  border:1.5px solid #2E7D32;display:grid;place-items:center;background:#fff}
.d-mark::after{content:"";width:6px;height:6px;border-radius:50%;background:#2E7D32}
.d-mark.nv{border-color:#7B3F1D}
.d-mark.nv::after{width:0;height:0;border-radius:0;background:none;
  border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:7px solid #7B3F1D}
/* signature ribbon */
.qv{position:fixed;inset:0;z-index:92;display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;visibility:hidden;transition:opacity .4s var(--ease-out),visibility 0s .4s}
.qv.open{opacity:1;pointer-events:auto;visibility:visible;transition:opacity .4s var(--ease-out),visibility 0s}
.qv-veil{position:absolute;inset:0;background:rgba(10,10,10,.72);backdrop-filter:blur(8px)}
.qv-card{position:relative;z-index:2;width:min(540px,100%);max-height:92svh;overflow-y:auto;
  background:var(--ivory);border:1px solid var(--line);border-radius:var(--r-lg) var(--r-lg) 0 0;
  padding:0 0 clamp(1.4rem,3.4vw,2rem);transform:translateY(40px);
  transition:transform .5s var(--ease-out);box-shadow:0 -20px 70px -28px rgba(0,0,0,.7)}
.qv-pad{padding:clamp(1.4rem,4vw,2.1rem)}
.qv-hero{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--champagne);
  border-radius:var(--r-lg) var(--r-lg) 0 0}
.qv-hero img{width:100%;height:100%;object-fit:cover;display:block;
  animation:fadeImg .45s var(--ease-out)}
@keyframes fadeImg{from{opacity:0;transform:scale(1.03)}}
.qv-sample{position:absolute;left:.85rem;bottom:.85rem;z-index:2;font-size:.66rem;letter-spacing:.12em;
  padding:.3rem .75rem;border-radius:var(--r-sm);color:var(--ivory);
  background:rgba(20,20,20,.68);backdrop-filter:blur(10px);
  border:1px solid rgba(232,216,184,.34)}
.qv.open .qv-card{transform:none}
.qv-x{position:absolute;right:1rem;top:1rem;z-index:4;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(232,216,184,.5);background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);cursor:pointer;font-size:1.2rem;line-height:1;
  box-shadow:0 6px 18px -8px rgba(0,0,0,.6);transition:background .3s,transform .35s}
.qv-x:hover{background:var(--gold);color:var(--charcoal);transform:rotate(90deg)}
.qv-arch{width:64px;height:74px;border:1px solid var(--gold);margin-bottom:1.1rem;
  border-radius:50% 50% 6px 6px/42% 42% 6px 6px;display:grid;place-items:center;font-size:1.5rem;
  background:linear-gradient(160deg,rgba(176,141,87,.2),rgba(176,141,87,.04))}
.qv-card h3{font-size:clamp(1.35rem,3.4vw,1.75rem);margin-bottom:.4rem;padding-right:2.6rem}
.qv-cat{font-size:.74rem;letter-spacing:.14em;color:var(--kicker-ink);margin-bottom:.8rem}
.qv-desc{font-size:.92rem;color:var(--muted);margin:0 0 1.2rem}
.qv-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding-top:1.2rem;border-top:1px solid var(--line)}
/* quantity stepper — hairline box, square keys */
.qty{display:inline-flex;align-items:stretch;border:1px solid rgba(176,141,87,.5);border-radius:var(--r-sm);background:#fff;overflow:hidden}
.qty button{width:44px;height:44px;border:0;border-radius:0;background:transparent;cursor:pointer;color:var(--charcoal);
  font-size:1.1rem;line-height:1;transition:background var(--t-fast),color var(--t-fast)}
.qty button:hover{background:var(--charcoal);color:var(--gold-bright)}
.qty span{min-width:36px;display:grid;place-items:center;font-weight:500;font-variant-numeric:tabular-nums;
  border-inline:1px solid var(--line-soft)}
.qv .btn{width:100%;margin-top:1.2rem}
.cart{position:fixed;inset:0;z-index:88;display:flex;justify-content:flex-end;
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease-out)}
.cart.open{opacity:1;pointer-events:auto}
.cart-veil{position:absolute;inset:0;background:rgba(10,10,10,.7);backdrop-filter:blur(6px)}
.cart-panel{position:relative;z-index:2;width:min(440px,100%);height:100%;display:flex;flex-direction:column;
  background:var(--ivory);border-left:1px solid var(--line);
  transform:translateX(100%);transition:transform .5s var(--ease-out)}
.cart.open .cart-panel{transform:none}
.cart-head{display:flex;align-items:center;gap:.8rem;padding:1.2rem var(--pad);
  border-bottom:1px solid var(--line)}
.cart-head h3{font-size:1.2rem;flex:1}
.cart-head button{background:none;border:0;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--muted)}
.cart-head button:hover{color:var(--charcoal)}
.cart-body{flex:1;min-height:30svh;overflow-y:auto;padding:1.2rem var(--pad)}
.ci{display:flex;gap:.8rem;align-items:flex-start;padding:.9rem 0;border-bottom:1px solid var(--line)}
.ci-body{flex:1;min-width:0}
.ci-body b{display:block;font-family:var(--serif);font-weight:400;font-size:.95rem;line-height:1.3;
  margin-bottom:.18rem}
.ci-body small{display:block;font-size:.76rem;color:var(--muted);line-height:1.45}
.ci .qty{transform:scale(.85);transform-origin:right center;flex:none}
.ci-rm{display:block;background:none;border:0;cursor:pointer;color:#A6412F;font-size:.74rem;
  padding:.25rem 0 0;margin:.35rem 0 0;text-decoration:underline;text-underline-offset:2px}
.ci-rm:hover{color:#7E2E20}
.cart-empty{text-align:center;padding:3.5rem 1rem;color:var(--muted)}
.cart-empty b{display:block;font-family:var(--serif);font-size:1.2rem;color:var(--charcoal);
  font-weight:400;margin-bottom:.4rem}
.cart-foot{flex:none;max-height:64svh;overflow-y:auto;border-top:1px solid var(--line);
  padding:1.1rem var(--pad) calc(1.2rem + env(safe-area-inset-bottom,0px));background:#fff}
.bill{display:grid;gap:.4rem;margin-bottom:1rem;font-size:.88rem}
.bill div{display:flex;justify-content:space-between}
.bill .tot{padding-top:.6rem;border-top:1px solid var(--line);font-family:var(--serif);font-size:1.15rem}
.bill .warn{color:#A6412F;font-size:.78rem}
.otype{display:flex;gap:.4rem;margin-bottom:1rem}
.otype button{flex:1;font-size:.8rem;padding:.55rem .4rem;border-radius:var(--r);cursor:pointer;
  background:transparent;border:1px solid var(--line);color:var(--muted);transition:all .3s}
.otype button.on{border-color:var(--gold);background:var(--gold);color:var(--charcoal)}
.cart-foot .field{margin-bottom:.8rem}
.field{display:flex;flex-direction:column;gap:.3rem}
.field label{font-size:.7rem;letter-spacing:.14em;color:var(--kicker-ink);font-weight:500}
.field input,.field textarea,.field select{border:1px solid var(--line);border-radius:10px;
  padding:.6rem .8rem;font-size:.9rem;background:#fff;transition:border-color .3s}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--gold-ink);outline-offset:1px;border-color:var(--gold)}
.field textarea{resize:vertical;min-height:62px}
.err{font-size:.74rem;color:#A6412F;display:none}
.field.bad .err{display:block}
.field.bad input,.field.bad textarea{border-color:#A6412F}
.resv{display:grid;gap:1rem;max-width:660px}
.sig{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:760px){.sig{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}}
@media(min-width:1100px){.sig{grid-template-columns:repeat(6,minmax(0,1fr))}}
.sig-c{display:flex;flex-direction:column;text-align:left;padding:0;border:1px solid var(--line-soft);border-radius:var(--r);overflow:hidden;
  background:#fff;cursor:pointer;box-shadow:var(--shadow-1);transition:transform 1s var(--ease-out),box-shadow 1s var(--ease-out),border-color var(--t)}
.sig-c:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:var(--line)}
.sig-img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--champagne)}
.sig-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease-out)}
.sig-c:hover .sig-img img{transform:scale(1.05)}
.sig-t{display:flex;flex-direction:column;gap:2px;padding:12px 14px 14px}
.sig-t small{font-size:.58rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--kicker-ink)}
.sig-t b{font-family:var(--serif);font-weight:600;font-size:1.1rem;line-height:1.25;color:var(--charcoal)}
.sig-t em{font-style:normal;font-weight:600;font-size:.86rem;color:var(--gold-ink)}
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:1.25rem 2.2rem 1.25rem 0;position:relative;
  font-family:var(--serif);font-size:clamp(1.02rem,2.2vw,1.18rem);transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--gold-ink)}
.faq summary::after{content:"";position:absolute;right:.4rem;top:50%;width:11px;height:11px;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);
  translate:0 -70%;rotate:45deg;transition:rotate .4s var(--ease-out)}
.faq details[open] summary::after{rotate:-135deg;translate:0 -30%}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 86px);z-index:95;
  translate:-50% 0;padding:.75rem 1.3rem;border-radius:var(--r-sm);font-size:.86rem;
  background:var(--charcoal);color:var(--ivory);border:1px solid rgba(232,216,184,.3);
  box-shadow:0 18px 40px -18px rgba(0,0,0,.7);
  opacity:0;pointer-events:none;transition:opacity .35s,translate .35s var(--ease-out)}
.toast.show{opacity:1;translate:-50% -10px}
.sweet{position:relative;color:var(--ivory);background:var(--charcoal-deep);overflow:hidden}
.sweet::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(58% 70% at 22% 30%,rgba(255,206,132,.20),transparent 62%),
             radial-gradient(44% 58% at 84% 78%,rgba(176,141,87,.16),transparent 66%)}
.sweet>.wrap{position:relative;z-index:2}
.sweet .kicker{color:var(--gold)}
.sweet .lede{color:rgba(248,246,242,.78)}
.sweetgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:2.6rem}
.sw{position:relative;border-radius:var(--r);overflow:hidden;background:#241f1a;
  border:1px solid rgba(176,141,87,.26);cursor:pointer;text-align:left;padding:0;
  transition:transform .6s var(--ease-out),border-color .45s,box-shadow .6s var(--ease-out)}
.sw:hover{transform:translateY(-9px);border-color:var(--gold);
  box-shadow:0 34px 62px -38px rgba(0,0,0,.9)}
.sw img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;
  transition:transform 1.4s var(--ease-out)}
.sw:hover img{transform:scale(1.09)}
.sw-body{padding:.95rem 1rem 1.1rem;position:relative;z-index:2}
.sw-body b{display:block;font-family:var(--serif);font-weight:400;font-size:1rem;
  line-height:1.3;color:var(--ivory);margin-bottom:.2rem}
.sw-body span{font-size:.86rem;color:var(--gold-bright);font-variant-numeric:tabular-nums}
.sw::after{content:"";position:absolute;left:0;right:0;top:0;height:100%;pointer-events:none;
  background:linear-gradient(180deg,transparent 52%,rgba(12,10,8,.55));opacity:0;transition:opacity .5s}
.sw:hover::after{opacity:1}
.sig{grid-template-columns:repeat(2,minmax(0,1fr))}
.rates{width:100%;border-collapse:collapse;margin-top:2.2rem;font-size:.94rem}
.rates caption{text-align:left;font-size:.84rem;color:var(--muted);padding-bottom:.9rem}
.rates th,.rates td{padding:1rem .8rem;text-align:left;border-bottom:1px solid var(--line)}
.rates thead th{font-family:var(--serif);font-weight:400;font-size:.9rem;color:var(--kicker-ink);
  letter-spacing:.06em;border-bottom-color:var(--gold)}
.rates tbody th{font-family:var(--serif);font-weight:400;font-size:1.05rem;white-space:nowrap}
.rates td b{font-weight:500;font-variant-numeric:tabular-nums}
.rates td small{display:block;font-size:.72rem;color:var(--muted);margin-top:.15rem}
.rates tbody tr{transition:background .35s}
.rates tbody tr:hover{background:rgba(176,141,87,.07)}
.rate-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.plans{display:grid;gap:.9rem;margin-top:1.6rem;grid-template-columns:1fr}
@media(min-width:640px){
  .plans{grid-template-columns:repeat(3,1fr)}
}
.plan{border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;background:#fff}
.plan b{display:block;font-family:var(--serif);font-weight:400;font-size:1rem;margin-bottom:.15rem}
.plan span{font-size:.84rem;color:var(--muted)}
.rgrid{display:grid;gap:clamp(1.6rem,3.5vw,2.4rem)}
/* Room card — shared by the home page (.room) and the rooms page (.rcard) */
.room,.rcard{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);overflow:hidden;position:relative;
  display:flex;flex-direction:column;box-shadow:var(--shadow-1);
  transition:transform 1s var(--ease-out),box-shadow 1s var(--ease-out),border-color var(--t)}
.room:hover,.rcard:hover{transform:translateY(-6px);border-color:var(--line);box-shadow:var(--shadow-2)}
.room::after,.rcard::after{content:"";position:absolute;left:var(--s3);right:var(--s3);bottom:0;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:50%;transition:transform 1s var(--ease-out)}
.room:hover::after,.rcard:hover::after{transform:scaleX(1)}
.room-img,.rcard-img{position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--champagne)}
.room-img img,.rcard-img img{width:100%;height:100%;object-fit:cover;transform:translateZ(0);transition:transform 1.8s var(--ease-out)}
.room:hover .room-img img,.rcard:hover .rcard-img img{transform:scale(1.04)}
.room-img::after,.rcard-img::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(17,17,17,.28),transparent 34%)}
/* price badge — a quiet plaque on the photograph */
.room-rate,.rcard-rate{position:absolute;right:var(--s2);top:var(--s2);z-index:2;background:rgba(17,17,17,.78);color:var(--ivory);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(207,178,127,.45);border-radius:var(--r-sm);
  padding:8px 14px;display:flex;flex-direction:column;align-items:flex-end;line-height:1.25}
.room-rate small,.rcard-rate small{font-size:.56rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:rgba(248,246,242,.8)}
.room-rate b,.rcard-rate b{font-family:var(--serif);font-weight:600;color:var(--gold-bright);font-size:1.4rem;line-height:1.1}
.rcard-count{position:absolute;left:var(--s2);top:var(--s2);z-index:2;font-size:.62rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  padding:6px 10px;border-radius:var(--r-sm);color:var(--ivory);
  background:rgba(17,17,17,.6);backdrop-filter:blur(8px);border:1px solid rgba(248,246,242,.25)}
.room-body,.rcard-body{padding:var(--s3) var(--s3) var(--s4);display:flex;flex-direction:column;flex:1}
.room-body h3,.rcard-body h3{margin-bottom:12px}
.room-meta,.rmeta{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2);margin-bottom:var(--s2);padding-bottom:var(--s2);border-bottom:1px solid var(--line-soft)}
.room-meta span,.rmeta span{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--muted)}
.room-meta .ico,.rmeta .ico{color:var(--gold-ink);width:1.1em;height:1.1em}
.room-body p,.rcard-body p{font-size:.92rem;color:var(--muted);flex:1}
.room-body .btn{align-self:flex-start}
.rcard-acts{display:flex;flex-wrap:wrap;gap:var(--s1);margin-top:var(--s1)}
.rdet{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;visibility:hidden;transition:opacity .45s var(--ease-out),visibility 0s .45s}
@media(min-width:860px){
  .rdet{align-items:center;padding:clamp(1rem,3vw,2.4rem)}
}
.rdet.open{opacity:1;pointer-events:auto;visibility:visible;transition:opacity .45s var(--ease-out),visibility 0s}
.rdet-veil{position:absolute;inset:0;background:rgba(10,10,10,.76);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rdet-panel{position:relative;z-index:2;width:min(1120px,100%);
  max-height:94svh;overflow-y:auto;overscroll-behavior:contain;
  background:var(--ivory);border:1px solid var(--line);
  border-radius:var(--r-lg) var(--r-lg) 0 0;box-shadow:0 -20px 80px -30px rgba(0,0,0,.7);
  transform:translateY(40px);transition:transform .55s var(--ease-out);
  scrollbar-width:thin;scrollbar-color:rgba(176,141,87,.5) transparent}
@media(min-width:860px){
  .rdet-panel{border-radius:var(--r-lg);transform:translateY(24px) scale(.97)}
}
.rdet.open .rdet-panel{transform:none}
.rdet-panel::-webkit-scrollbar{width:6px}
.rdet-panel::-webkit-scrollbar-thumb{background:rgba(176,141,87,.45);border-radius:9px}
.rdet-x{position:sticky;top:0;z-index:6;margin-left:auto;display:block;
  width:44px;height:44px;margin-right:.7rem;transform:translateY(.7rem);
  box-shadow:0 6px 20px -8px rgba(17,17,17,.6);
  border-radius:50%;border:1px solid var(--line);cursor:pointer;
  background:rgba(248,246,242,.9);backdrop-filter:blur(10px);
  color:var(--charcoal);font-size:1.3rem;line-height:1;
  transition:background .3s,transform .35s}
.rdet-x:hover{background:var(--gold);color:var(--charcoal);transform:translateY(.7rem) rotate(90deg)}
.rdet-grid{display:grid;gap:clamp(1.6rem,3.4vw,2.6rem);grid-template-columns:minmax(0,1fr);
  padding:0 clamp(1.15rem,3.4vw,2.4rem) clamp(2rem,4vw,2.8rem);margin-top:-2.2rem}
.rdet-grid>*{min-width:0}
@media(min-width:860px){
  .rdet-grid{grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);align-items:start}
  /* keep the photo in view while the details scroll past it */
  .rdet-gal{position:sticky;top:.6rem}
}
.rgal-main{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;
  background:var(--champagne);box-shadow:0 20px 50px -34px rgba(17,17,17,.5)}
.rgal-main img{width:100%;height:100%;object-fit:cover;
  animation:fadeImg .5s var(--ease-out)}
.rgal-nav{position:absolute;top:50%;translate:0 -50%;z-index:2;width:42px;height:42px;
  border-radius:50%;border:1px solid rgba(232,216,184,.4);cursor:pointer;
  background:rgba(20,20,20,.5);backdrop-filter:blur(10px);color:var(--ivory);font-size:1rem;
  display:grid;place-items:center;transition:background .3s,transform .3s}
.rgal-nav:hover{background:var(--gold);transform:translateY(-50%) scale(1.08);border-color:var(--gold)}
.rgal-nav.prev{left:.7rem}
.rgal-nav.next{right:.7rem}
.rgal-count{position:absolute;right:.7rem;bottom:.7rem;z-index:2;font-size:.74rem;
  padding:.28rem .7rem;border-radius:var(--r-sm);color:var(--ivory);
  background:rgba(20,20,20,.6);backdrop-filter:blur(8px);font-variant-numeric:tabular-nums}
.rgal-thumbs{display:flex;gap:.55rem;margin-top:.7rem;overflow-x:auto;padding-bottom:.3rem;
  min-width:0;scrollbar-width:none}
.rgal-thumbs::-webkit-scrollbar{display:none}
.rgal-thumbs button{flex:none;width:78px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;
  border:1px solid transparent;cursor:pointer;padding:0;opacity:.55;background:var(--champagne);
  transition:opacity .35s,border-color .35s,transform .35s}
.rgal-thumbs button img{width:100%;height:100%;object-fit:cover}
.rgal-thumbs button:hover{opacity:.85;transform:translateY(-2px)}
.rgal-thumbs button.on{opacity:1;border-color:var(--gold)}
.rdet-head{min-width:0}
.rdet-head h2{font-size:clamp(1.8rem,4.4vw,2.6rem);margin-bottom:.5rem;overflow-wrap:break-word}
.rdet-head .rmeta{max-width:100%}
.rdet-lede{color:var(--body-ink);font-size:.96rem;margin:1rem 0 0}
.rdet-price{display:flex;align-items:baseline;gap:.5rem;margin-top:1.4rem;
  padding-top:1.4rem;border-top:1px solid var(--line)}
.rdet-price b{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,4vw,2.3rem);color:var(--gold-ink)}
.rdet-price span{font-size:.84rem;color:var(--muted)}
.rsub{font-family:var(--serif);font-size:1.02rem;color:var(--kicker-ink);margin:1.8rem 0 .8rem}
.rplan{width:100%;border-collapse:collapse;font-size:.9rem;table-layout:fixed}
.rplan th:first-child{width:48%}
.rplan th,.rplan td{padding:.68rem .5rem;text-align:left;border-bottom:1px solid var(--line)}
.rplan thead th{font-size:.76rem;letter-spacing:.08em;color:var(--kicker-ink);font-weight:500}
.rplan tbody th{font-weight:400}
.rplan tbody th small{display:block;font-size:.72rem;color:var(--muted)}
.rplan td{font-variant-numeric:tabular-nums}
.ramen{display:grid;grid-template-columns:repeat(2,1fr);gap:.55rem;padding:0;margin:0;list-style:none}
.ramen li{display:flex;gap:.5rem;align-items:center;font-size:.86rem;color:var(--muted)}
.ramen li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);flex:none}
.rterms{padding:0;margin:0;list-style:none;display:grid;gap:.5rem}
.rterms li{font-size:.86rem;color:var(--muted);display:flex;gap:.55rem}
.rterms li::before{content:"·";color:var(--gold);font-weight:700}
.rdet-cta{display:flex;gap:.6rem;margin-top:1.8rem;
  position:sticky;bottom:0;z-index:4;padding:1.2rem 0 .6rem;
  background:linear-gradient(transparent,var(--ivory) 34%)}
.rdet-cta .btn{flex:1;padding-inline:1rem;white-space:nowrap}
@media(min-width:520px){
  .rdet-cta .btn{flex:0 0 auto;padding-inline:2rem}
}
.rdet-switch{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem;padding-top:1.4rem;
  border-top:1px solid var(--line)}
.rdet-switch span{font-size:.8rem;color:var(--muted);align-self:center;margin-right:.3rem}
.rdet-switch button{font-size:.8rem;padding:.4rem .9rem;border-radius:var(--r-sm);cursor:pointer;
  background:transparent;border:1px solid var(--line);color:var(--muted);
  transition:border-color .3s,background .3s,transform .3s}
.rdet-switch button:hover{border-color:var(--gold-ink);background:rgba(176,141,87,.1);transform:translateY(-2px)}
.pol{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden}
.pol>div{background:var(--ivory);padding:1.8rem 1.4rem;transition:background .4s}
.pol>div:hover{background:#fff}
.pol h3{font-size:1.05rem;margin-bottom:.6rem}
.pol p{font-size:.87rem;color:var(--muted);margin:0}
.pol p+p{margin-top:.5rem}
@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}}
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:2.2rem}
.cmp{width:100%;border-collapse:collapse;font-size:.94rem;min-width:620px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cmp th,.cmp td{padding:1rem .95rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cmp thead th{background:rgba(176,141,87,.07);font-family:var(--serif);font-weight:400;
  font-size:1.05rem;border-bottom-color:var(--gold)}
.cmp thead th small{display:block;font-family:var(--sans);font-size:.72rem;letter-spacing:.06em;
  color:var(--muted);margin-top:.15rem}
.cmp tbody th{font-weight:400;font-size:.86rem;color:var(--kicker-ink);white-space:nowrap;
  background:rgba(176,141,87,.03)}
.cmp td{color:var(--body-ink);font-variant-numeric:tabular-nums}
.cmp td b{font-family:var(--serif);font-weight:400;color:var(--gold-ink);font-size:1.05rem}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp tbody tr{transition:background .35s}
.cmp tbody tr:hover{background:rgba(176,141,87,.05)}
.cmp .yes{color:var(--gold-ink)}
.cmp .no{color:var(--muted)}
.cmp-cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.cmp-cta .btn{padding:.72rem 1.5rem;font-size:.82rem}
.season{margin-top:3rem;padding-top:2.6rem;border-top:1px solid var(--line)}
.season h3{font-size:clamp(1.3rem,2.8vw,1.65rem);margin-bottom:.4rem}
.season>p{font-size:.92rem;color:var(--muted);max-width:60ch;margin:0}
.sgrid{display:grid;gap:1rem;margin-top:1.6rem}
.scard{border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.3rem;background:#fff;
  display:flex;flex-direction:column;gap:.35rem;transition:border-color .45s,transform .55s var(--ease-out),box-shadow .55s}
.scard:hover{border-color:rgba(176,141,87,.6);transform:translateY(-5px);box-shadow:0 26px 50px -40px rgba(17,17,17,.5)}
.scard small{font-size:.7rem;letter-spacing:.16em;color:var(--kicker-ink)}
.scard b{font-family:var(--serif);font-weight:400;font-size:1.12rem}
.scard span{font-size:.86rem;color:var(--muted);line-height:1.6}
.scard em{font-style:normal;font-family:var(--serif);color:var(--gold-ink);font-size:.98rem;margin-top:auto;padding-top:.6rem}
.scard.peak{background:var(--charcoal);color:var(--ivory);border-color:rgba(176,141,87,.4)}
.scard.peak small,.scard.peak em{color:var(--gold-bright)}
.scard.peak span{color:rgba(248,246,242,.72)}
.season .btn{margin-top:1.6rem}
.ramen.ico li::before{display:none}
.ramen.ico li i{font-style:normal;width:1.6rem;flex:none;text-align:center;font-size:1rem}
/* ── after a form hands its details to WhatsApp: say so, and offer the link again ── */
.wa-note{margin:.9rem 0 0;font-size:.84rem;line-height:1.6;color:var(--muted);text-align:left}
.wa-note[hidden]{display:none}
.wa-note a{color:var(--gold-ink);font-weight:500;text-decoration:underline;text-underline-offset:3px;
  display:inline-block;padding-block:.3rem}
.band .wa-note,.esum .wa-note{color:rgba(248,246,242,.8)}
.band .wa-note a,.esum .wa-note a{color:var(--gold-bright)}

/* ── Hero copy never slides under the fixed header ──
   The hero text is anchored to the bottom of the photograph. On a short screen (iPhone SE,
   360×640 Androids, a low laptop window) the copy is taller than the space left over, and its
   first lines used to end up behind the logo and menu. Reserving the header's height at the
   top makes the hero grow instead; where the copy already fits, nothing moves. */
.hero .hero-in,.phero .phero-in{padding-top:calc(env(safe-area-inset-top,0px) + 100px)}

/* ── added after the full audit ── */
/* phones zoom the whole page when a text box is smaller than 16px; keep them at 16 */
@media (max-width:820px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}
}
/* nothing a thumb has to hit is smaller than 44px */
.chat-x{min-width:44px;min-height:44px}
.chat-log{overflow-wrap:anywhere}