/* ═══════════════════════════════════════════════════════════
   LE VRAI TRADITIONNEL — main.css
   Shared stylesheet for all pages. Brand-tokenized, production-ready.
   ═══════════════════════════════════════════════════════════ */

/* ───── 1. DESIGN TOKENS ───── */
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:500 800;
  font-display:optional;
  src:url("../fonts/cormorant-garamond-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Raleway';
  font-style:normal;
  font-weight:300 700;
  font-display:optional;
  src:url("../fonts/raleway-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  /* Palette */
  --burgundy:#4B0A0A;
  --burgundy-deep:#35060A;
  --gold:#DD9A3F;
  --gold-hi:#F0B85C;
  --sand:#F4C87C;
  --forest:#1F2A13;
  --lavender:#CFCCD6;
  --cream:#FFF6E9;
  --offwhite:#F9E8D0;
  --ink:#141413;

  /* Type */
  --font-display:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:'Raleway', 'Helvetica Neue', Arial, sans-serif;

  --text-hero: clamp(2.6rem, 5.5vw, 4.75rem);
  --text-h1:   clamp(2.5rem, 5vw, 3.75rem);
  --text-h2:   clamp(1.75rem, 3.5vw, 2.5rem);
  --text-h3:   clamp(1.125rem, 2vw, 1.375rem);
  --text-body: clamp(0.925rem, 1.2vw, 1.0625rem);
  --text-small:clamp(0.6875rem, 1vw, 0.8125rem);
  --tag: 0.72rem;

  /* Spacing */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  /* Easing */
  --e-dramatic: cubic-bezier(0.16,1,0.3,1);
  --e-welcome:  cubic-bezier(0.22,1,0.36,1);
  --e-reveal:   cubic-bezier(0.25,0.46,0.45,0.94);
  --e-elastic:  cubic-bezier(0.34,1.56,0.64,1);

  --maxw:1280px;
  --pad-x: clamp(24px, 5vw, 64px);
  --nav-h: 84px;
}

/* ───── 2. RESET ───── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;max-width:100%}
body{
  font-family:var(--font-body);
  font-weight:400;
  font-size:var(--text-body);
  line-height:1.7;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
  overflow-y:scroll;
  cursor:none;
  scrollbar-width:none;
}
body::-webkit-scrollbar{display:none}
img,video{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;border:0;background:none;cursor:none;color:inherit;-webkit-tap-highlight-color:transparent}
ul{list-style:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.1;letter-spacing:.01em}
::selection{background:var(--gold);color:var(--burgundy)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  body{cursor:auto}
  #cursor,#cursor-ring{display:none!important}
  .reveal,.word,.hero__title .line{opacity:1!important;transform:none!important}
}

/* ───── 3. LOADING SCREEN (home only) ───── */
body:not([data-page="home"]) #loader{display:none!important}
#loader{
  position:fixed;inset:0;z-index:200;background:var(--cream);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--s-5);
  transition:opacity .1s ease, visibility .1s;
}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
#loader .mandala{
  width:88px;height:88px;
  background:url("../logos/mandala.png") center/contain no-repeat;
  animation:spin 4s linear infinite;
  filter:drop-shadow(0 0 20px rgba(221,154,63,.35));
}
#loader .wordmark{
  font-family:var(--font-display);font-size:1.25rem;letter-spacing:.25em;
  text-transform:uppercase;color:var(--burgundy);opacity:.85;
}
#loader .since{
  font-family:var(--font-display);font-style:italic;font-size:.78rem;
  letter-spacing:.18em;color:var(--burgundy);opacity:.55;
  margin-top:calc(var(--s-3) * -1);
}
#loader .bar{width:180px;height:1px;background:rgba(75,10,10,.12);position:relative;overflow:hidden}
#loader .bar::after{
  content:"";position:absolute;inset:0;background:var(--gold);
  transform-origin:left;animation:fill .4s var(--e-dramatic) forwards;
}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes titleLineIn{from{opacity:0;transform:translateY(.45em)}to{opacity:1;transform:none}}

/* ───── 4. CURSOR ───── */
#cursor,#cursor-ring{
  position:fixed;top:0;left:0;pointer-events:none;z-index:190;border-radius:50%;
  transform:translate(-50%,-50%);will-change:transform,width,height;
  mix-blend-mode:difference;
}
#cursor{width:8px;height:8px;background:var(--gold);transition:width .2s, height .2s}
#cursor-ring{width:36px;height:36px;border:1px solid rgba(221,154,63,.55);transition:width .25s var(--e-elastic), height .25s var(--e-elastic), border-color .2s}
.cursor-hover #cursor{width:0;height:0}
.cursor-hover #cursor-ring{width:64px;height:64px;border-color:var(--gold)}
@media (hover:none),(max-width:900px){
  body{cursor:auto}
  #cursor,#cursor-ring{display:none}
}

/* ───── 5. SCROLL PROGRESS ───── */
#scroll-progress{
  position:fixed;top:0;left:0;height:2px;width:0%;
  background:linear-gradient(90deg, var(--gold), var(--gold-hi));
  z-index:150;transition:width .1s linear;
  box-shadow:0 0 10px rgba(221,154,63,.6);
}

/* ───── 6. ZELLIGE BG ───── */
.zellige-bg{
  position:fixed;top:0;left:0;width:100%;height:100%;
  z-index:0;pointer-events:none;opacity:.07;
  background-image:url("../logos/zellige-pattern.png");
  background-image:image-set(url("../logos/zellige-pattern-840w.webp") type("image/webp"),url("../logos/zellige-pattern.png") type("image/png"));
  background-position:top left;background-size:420px;background-repeat:repeat;
  will-change:auto;
  -webkit-mask-image:linear-gradient(to bottom, black 0%, black 30%, transparent 65%);
  mask-image:linear-gradient(to bottom, black 0%, black 30%, transparent 65%);
}

/* ───── 7. NAVBAR ───── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:var(--s-4) var(--pad-x);
  display:flex;align-items:center;justify-content:space-between;
  gap:clamp(12px, 2vw, 24px);
  transition:background .4s var(--e-reveal), backdrop-filter .4s, border-color .4s, padding .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled,
.nav.solid{
  background:rgba(255,246,233,.94);
  backdrop-filter:blur(10px) saturate(1.1);
  -webkit-backdrop-filter:blur(10px) saturate(1.1);
  padding:var(--s-3) var(--pad-x);
  border-bottom-color:rgba(75,10,10,.08);
}
.nav__brand{display:flex;align-items:center;gap:var(--s-2);flex-shrink:0}
.nav__brand .mark{
  width:36px;height:36px;
  background:url("../logos/mandala.png") center/contain no-repeat;
  transition:transform .5s var(--e-dramatic);
}
.nav__brand:hover .mark{transform:rotate(15deg)}
.nav__brand .word{
  font-family:var(--font-display);font-size:clamp(0.65rem, 0.9vw, 0.78rem);letter-spacing:.14em;
  text-transform:uppercase;color:var(--cream);font-weight:600;white-space:nowrap;
  transition:color .4s;
}
.nav.scrolled .nav__brand .word,
.nav.solid .nav__brand .word{color:var(--burgundy)}
.nav__links{display:flex;align-items:center;gap:clamp(14px, 2vw, 32px)}
.nav__links li{white-space:nowrap}
.nav__links a{
  font-family:var(--font-body);font-weight:600;text-transform:uppercase;
  font-size:clamp(0.6rem, 0.75vw, 0.72rem);letter-spacing:.12em;color:var(--cream);
  position:relative;padding:var(--s-2) 0;transition:color .3s;
  white-space:nowrap;
}
.nav.scrolled .nav__links a,
.nav.solid .nav__links a{color:var(--ink)}
.nav__links a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e-dramatic);
}
.nav__links a:hover::after,
.nav__links a.current::after{transform:scaleX(1);transform-origin:left}
.nav__langs{
  display:flex;align-items:center;gap:6px;color:var(--cream);
  margin-left:clamp(6px, 1vw, 14px);padding-left:clamp(8px, 1.2vw, 16px);
  border-left:1px solid rgba(255,246,233,.2);
  font-size:clamp(0.58rem, 0.7vw, 0.65rem);letter-spacing:.06em;
}
.nav.scrolled .nav__langs,
.nav.solid .nav__langs{color:var(--ink);border-left-color:rgba(20,20,19,.12)}
.nav__langs .current-lang{color:var(--gold);font-weight:700}
.nav__langs a{font-size:inherit;letter-spacing:inherit}
.nav__langs span{opacity:.35;font-size:0.55rem}
.nav__cta{
  font-family:var(--font-body);font-weight:600;text-transform:uppercase;
  font-size:clamp(0.58rem, 0.7vw, 0.68rem);letter-spacing:.1em;white-space:nowrap;flex-shrink:0;
  padding:clamp(8px, 0.8vw, 12px) clamp(14px, 1.4vw, 22px);
  border:1px solid var(--gold);color:var(--gold);
  transition:background .35s var(--e-welcome), color .35s, box-shadow .4s;
}
.nav__cta:hover{background:var(--gold);color:var(--ink);box-shadow:0 0 30px rgba(221,154,63,.45)}
.nav.scrolled .nav__cta,
.nav.solid .nav__cta{background:var(--gold);color:var(--ink)}

.nav__burger{display:none;width:44px;height:44px;flex-direction:column;justify-content:center;gap:6px;align-items:flex-end;position:relative;z-index:102;background:transparent;border:0;padding:0;cursor:pointer;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(0,0,0,.55))}
.nav__burger span{display:block;width:28px;height:3px;background:var(--cream);transition:background .3s, transform .4s, width .4s;border-radius:2px}
.nav.scrolled .nav__burger,
.nav.solid .nav__burger{filter:none}
.nav.scrolled .nav__burger span,
.nav.solid .nav__burger span{background:var(--ink)}
.nav__burger span:nth-child(2){width:22px}
.nav.open .nav__burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav.open .nav__burger span:nth-child(2){opacity:0}
.nav.open .nav__burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg);width:28px}

/* Mobile menu overlay */
.nav__mobile{
  position:fixed;inset:0;background:var(--burgundy);z-index:99;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-5);
  padding:var(--s-8) var(--s-7);
  visibility:hidden;transition:visibility 0s linear .5s;
  text-align:center;
}
.nav.open ~ .nav__mobile{visibility:visible;transition-delay:0s}
.nav__mobile > a{
  font-family:var(--font-display);color:var(--cream);
  font-size:clamp(1.35rem, 4.5vw, 1.75rem);letter-spacing:.1em;
  text-transform:uppercase;font-weight:600;position:relative;
  white-space:nowrap;text-align:center;
  transform:translateY(20px);opacity:0;
  transition:transform .6s var(--e-dramatic), opacity .6s;
}
.nav__mobile > a:hover{color:var(--gold)}
.nav__mobile > a::after{
  content:"";position:absolute;left:50%;right:50%;bottom:-4px;height:1px;
  background:var(--gold);transition:left .4s var(--e-dramatic), right .4s var(--e-dramatic);
}
.nav__mobile > a:hover::after{left:20%;right:20%}
.nav.open ~ .nav__mobile a{transform:translateY(0);opacity:1}
.nav.open ~ .nav__mobile a:nth-child(1){transition-delay:.15s}
.nav.open ~ .nav__mobile a:nth-child(2){transition-delay:.22s}
.nav.open ~ .nav__mobile a:nth-child(3){transition-delay:.29s}
.nav.open ~ .nav__mobile a:nth-child(4){transition-delay:.36s}
.nav.open ~ .nav__mobile a:nth-child(5){transition-delay:.43s}
.nav.open ~ .nav__mobile a:nth-child(6){transition-delay:.5s}
.nav__mobile-langs{
  display:flex;align-items:center;gap:var(--s-3);color:var(--cream);
  margin-top:var(--s-3);padding-top:var(--s-4);
  border-top:1px solid rgba(221,154,63,.25);
}
.nav__mobile-langs a{font-size:1rem;letter-spacing:.06em;font-weight:500}
.nav__mobile-langs .current-lang{color:var(--gold);font-weight:700}
.nav__mobile-langs span{opacity:.35;font-size:.85rem}
.nav__mobile .btn{
  color:var(--ink);white-space:nowrap;
  margin-top:var(--s-3);
  padding:14px 36px;
  font-size:0.75rem;letter-spacing:.14em;
  width:auto;max-width:90%;text-align:center;justify-content:center;
}

@media (max-width:1080px){
  .nav__links{display:none}
  .nav__langs{display:none}
  .nav__burger{display:flex}
  .nav__cta{display:none}
}

/* Floating mobile CTA */
.float-cta{
  display:none;position:fixed;bottom:20px;right:20px;z-index:95;
  width:56px;height:56px;border-radius:50%;background:var(--gold);
  align-items:center;justify-content:center;
  box-shadow:0 10px 30px rgba(221,154,63,.45);
}
.float-cta svg{width:22px;height:22px;fill:var(--ink)}
.float-cta.visible{animation:popIn .5s var(--e-elastic) forwards}
@keyframes popIn{from{transform:scale(0)}to{transform:scale(1)}}
@media (max-width:1080px){.float-cta{display:flex}}

/* ───── 8. BUTTONS ───── */
.btn{
  display:inline-flex;align-items:center;gap:var(--s-3);
  padding:16px 32px;font-family:var(--font-body);font-weight:600;
  font-size:var(--tag);letter-spacing:.15em;text-transform:uppercase;
  position:relative;overflow:hidden;
  transition:transform .4s var(--e-elastic), box-shadow .4s, background .3s, color .3s;
}
.btn--primary{background:var(--gold);color:var(--ink);-webkit-tap-highlight-color:transparent}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(221,154,63,.4), 0 0 60px rgba(221,154,63,.2)}
.btn--primary:active{transform:translateY(0);background:var(--gold-hi);box-shadow:0 6px 20px rgba(221,154,63,.45)}
.btn--primary:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}

/* ───── 8a. FOCUS-VISIBLE (keyboard a11y, WCAG 2.4.7) ─────
   body{cursor:none} hides the cursor sitewide so keyboard users
   need explicit focus rings on every interactive surface. */
.dish:focus-visible,
.dish__link:focus-visible,
.gitem:focus-visible,
.faq-item__q:focus-visible,
.faq-item summary:focus-visible,
.nav__links a:focus-visible,
.nav__mobile a:focus-visible,
.nav__cta:focus-visible,
.nav__burger:focus-visible,
.btn--ghost:focus-visible,
.btn--dark:focus-visible,
.btn--outline:focus-visible{
  outline:2px solid var(--gold-hi);outline-offset:3px;border-radius:2px;
}
.chip:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px;border-radius:999px}
.tm-badge:focus-visible,
.tm-badge--google:focus-visible,
.tm-badge--tripadvisor:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px;border-radius:12px}

.btn--primary::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.4) 50%,transparent 80%);
  transform:translateX(-120%);transition:transform .7s var(--e-dramatic);
}
.btn--primary:hover::before{transform:translateX(120%)}
@media (hover:none){
  .btn--primary:hover{transform:none;box-shadow:none;background:var(--gold)}
  .btn--primary:hover::before{transform:translateX(-120%)}
  .btn--primary:active{background:var(--gold-hi);transform:scale(.98);box-shadow:0 6px 20px rgba(221,154,63,.45)}
}
.btn--ghost{border:1px solid rgba(255,246,233,.55);color:var(--cream)}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
.btn--dark{background:var(--burgundy);color:var(--cream);border:1px solid var(--burgundy)}
.btn--dark:hover{background:var(--burgundy-deep);transform:translateY(-2px)}
.btn--outline{border:1px solid var(--gold);color:var(--gold);background:transparent}
.btn--outline:hover{background:var(--gold);color:var(--ink);transform:translateY(-2px)}
.btn__arrow{width:14px;height:1px;background:currentColor;position:relative;transition:width .3s}
.btn__arrow::after{content:"";position:absolute;right:0;top:50%;width:7px;height:7px;border-right:1px solid currentColor;border-top:1px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.btn:hover .btn__arrow{width:22px}

/* ───── 9. HERO (home) ───── */
.hero{
  position:relative;min-height:100vh;min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;isolation:isolate;background:var(--burgundy-deep);
}
.hero__bg{
  position:absolute;inset:0;z-index:-2;
  width:100%;height:100%;
  object-fit:cover;object-position:center;
  filter:saturate(1.05) contrast(1.05) brightness(.75);
}
/* iframe variant of .hero__bg (YouTube embed): cover the viewport at 16:9 and
   scale up to crop player chrome. Override inset/width/height from .hero__bg
   so the iframe stays decorative and fills viewport on both desktop & mobile. */
iframe.hero__bg{
  position:absolute;inset:auto;top:50%;left:50%;
  width:max(100vw, calc(100vh * 16 / 9));
  height:max(100vh, calc(100vw * 9 / 16));
  transform:translate(-50%, -50%) scale(1.5);
  transform-origin:center center;
  border:0;pointer-events:none;
  opacity:0;transition:opacity .9s ease;
}
iframe.hero__bg.hero__video--in{opacity:1}
/* picture variant of .hero__bg (static facade poster): wraps an <img> that
   covers the viewport. The picture element itself takes the absolute layer;
   the <img> child fills it with object-fit. Fades out once the iframe is
   injected and playing. */
picture.hero__bg{
  display:block;overflow:hidden;
  filter:saturate(1.05) contrast(1.05) brightness(.75);
  transition:opacity .8s ease;
}
picture.hero__bg img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  display:block;filter:none;
}
.hero__poster--out{opacity:0}
.hero__play{
  position:absolute;z-index:3;
  bottom:clamp(16px, 3vw, 28px);right:clamp(16px, 3vw, 28px);
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 18px 10px 14px;border-radius:999px;
  background:rgba(20,20,19,.55);color:var(--cream);
  border:1px solid rgba(221,154,63,.55);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;
  cursor:pointer;
  transition:transform .3s var(--e-out), background .3s var(--e-out), opacity .4s ease;
}
.hero__play svg{color:var(--gold);flex-shrink:0}
.hero__play:hover{transform:translateY(-2px);background:rgba(75,10,10,.8)}
.hero__play:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.hero__play--hidden{opacity:0;pointer-events:none;transform:translateY(6px)}
@media (max-width:560px){
  .hero__play{padding:9px 12px;font-size:.62rem}
  .hero__play span{display:none}
}
@keyframes kenBurns{
  0%{transform:scale(1.06) translate(-1%,0)}
  100%{transform:scale(1.14) translate(1%,-1.5%)}
}
.hero__overlay{
  position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(ellipse at 50% 35%, rgba(20,20,19,0) 0%, rgba(20,20,19,.55) 55%, rgba(20,20,19,.85) 100%),
    linear-gradient(180deg, rgba(20,20,19,.55) 0%, rgba(20,20,19,.25) 40%, rgba(20,20,19,.8) 100%);
}
#mandala-canvas{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen}
.hero__content{
  position:relative;z-index:2;max-width:1100px;padding:calc(var(--nav-h) + var(--s-8)) var(--pad-x) 0;
  text-align:center;color:var(--cream);
  display:flex;flex-direction:column;align-items:center;gap:var(--s-6);
}
.hero__kicker{
  display:inline-flex;align-items:center;gap:var(--s-4);
  font-size:var(--tag);letter-spacing:.35em;text-transform:uppercase;
  color:var(--sand);font-weight:500;
  opacity:0;transform:translateY(10px);
  animation:fadeUp 1.2s .4s var(--e-dramatic) forwards;
}
.hero__kicker::before,.hero__kicker::after{content:"";width:40px;height:1px;background:var(--gold);display:inline-block}
.hero__title{
  font-family:var(--font-display);font-weight:600;font-size:var(--text-hero);line-height:1.05;
  color:var(--cream);text-shadow:0 2px 40px rgba(0,0,0,.5);max-width:18ch;
}
.hero__title .line{display:block;overflow:hidden;padding-bottom:.08em;animation:titleLineIn .95s var(--e-dramatic) both}
.hero__title .line + .line{animation-delay:.12s}
.hero__title .word{display:inline;transform:none;opacity:1;will-change:auto}
.hero__title em{
  font-style:italic;font-weight:500;
  color:var(--gold);
}
@keyframes shimmer{to{background-position:200% 0}}
.hero__sub{
  font-weight:400;font-size:clamp(.95rem,1.4vw,1.125rem);
  letter-spacing:.04em;color:rgba(255,246,233,.88);max-width:52ch;
  opacity:0;transform:translateY(14px);
  animation:fadeUp 1.1s 1.6s var(--e-dramatic) forwards;
}
.hero__actions{
  display:flex;gap:var(--s-5);flex-wrap:wrap;justify-content:center;
  margin-bottom:var(--s-5);
  opacity:0;transform:translateY(14px);
  animation:fadeUp 1.1s 1.85s var(--e-dramatic) forwards;
}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
.hero__hint{
  position:relative;z-index:2;margin-top:var(--s-4);
  color:var(--sand);font-size:var(--tag);letter-spacing:.25em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:var(--s-3);
  opacity:0;animation:fadeUp 1s 2.2s var(--e-reveal) forwards;
}
.hero__hint .line{width:1px;height:48px;background:linear-gradient(180deg,var(--gold),transparent);animation:drip 2.4s ease-in-out infinite}
@keyframes drip{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}
.hero__badge{
  position:absolute;top:50%;right:var(--pad-x);z-index:2;transform:translateY(-50%);
  writing-mode:vertical-rl;color:var(--sand);font-size:var(--tag);letter-spacing:.3em;
  text-transform:uppercase;display:flex;gap:var(--s-4);align-items:center;
  opacity:0;animation:fadeInRight 1s 1.4s var(--e-reveal) forwards;
}
@keyframes fadeInRight{from{opacity:0;transform:translateY(-50%) translateX(20px)}to{opacity:.85;transform:translateY(-50%) translateX(0)}}
.hero__badge span{display:flex;align-items:center;gap:6px}
@media (max-width:1080px){.hero__badge{display:none}}

/* Page hero variant (for inner pages) */
.page-hero{
  position:relative;min-height:60vh;padding:calc(var(--nav-h) + var(--s-8)) var(--pad-x) var(--s-8);
  display:flex;align-items:flex-end;isolation:isolate;overflow:hidden;background:var(--burgundy-deep);color:var(--cream);
}
.page-hero--tall{min-height:72vh}
.page-hero__bg{position:absolute;inset:-8%;z-index:-2;background-size:cover;background-position:center;filter:brightness(.55) saturate(1.05);transform:scale(1.08);animation:kenBurns 22s ease-in-out infinite alternate}
.page-hero__overlay{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at center,rgba(20,20,19,.35) 0%,rgba(20,20,19,.88) 100%)}
.page-hero__inner{max-width:var(--maxw);margin:0 auto;width:100%;display:flex;flex-direction:column;gap:var(--s-4)}
.page-hero__eyebrow{font-size:var(--tag);letter-spacing:.35em;text-transform:uppercase;color:var(--gold);font-weight:600;display:inline-flex;align-items:center;gap:var(--s-4)}
.page-hero__eyebrow::before{content:"";width:32px;height:1px;background:var(--gold)}
.page-hero__title{font-family:var(--font-display);font-weight:700;font-size:var(--text-hero);line-height:1.05;max-width:18ch}
.page-hero__title em{font-style:italic;font-weight:500;
  background:linear-gradient(120deg,var(--gold) 0%,var(--sand) 50%,var(--gold) 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 6s linear infinite;
}
.page-hero__sub{max-width:56ch;color:rgba(255,246,233,.78);font-size:clamp(.95rem,1.4vw,1.0625rem)}

/* ───── 10. SECTION BASE ───── */
section{position:relative;z-index:1}
.section{padding:var(--s-10) var(--pad-x);max-width:var(--maxw);margin:0 auto}
.section--tight{padding:var(--s-9) var(--pad-x)}
.section--full{max-width:none;padding-left:0;padding-right:0}
.eyebrow{
  display:inline-flex;align-items:center;gap:var(--s-4);
  font-size:var(--tag);letter-spacing:.3em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:var(--s-5);
}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--gold)}
.section__title{
  font-family:var(--font-display);font-weight:800;font-size:var(--text-h1);
  color:var(--burgundy);line-height:1.05;max-width:20ch;
}
.section__title em{font-style:italic;font-weight:500;color:var(--gold)}
.section__lead{
  font-weight:400;color:rgba(20,20,19,.72);max-width:62ch;margin-top:var(--s-5);
  font-size:clamp(1rem,1.35vw,1.125rem);line-height:1.75;
}
.star-divider{
  width:20px;height:20px;
  background-image:url("../logos/zellige-pattern.png");
  background-image:image-set(url("../logos/zellige-pattern-840w.webp") type("image/webp"),url("../logos/zellige-pattern.png") type("image/png"));
  background-position:center;background-size:contain;background-repeat:no-repeat;
  opacity:.85;margin:var(--s-5) 0;
}

/* Reveal class */
.reveal{opacity:0;transform:translateY(40px);will-change:transform,opacity}
.reveal.in{animation:inUp 1s var(--e-dramatic) forwards}
@keyframes inUp{to{opacity:1;transform:translateY(0)}}

/* ───── 11. WELCOME ───── */
.welcome{background:var(--cream);position:relative;overflow:hidden;padding:var(--s-10) 0}
.welcome__grid{
  display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s-10);align-items:center;
  max-width:var(--maxw);margin:0 auto;padding:0 var(--pad-x);
}
.welcome__text{max-width:58ch;padding-right:var(--s-5)}
.welcome__text p{
  font-family:var(--font-display);font-weight:500;font-style:italic;
  font-size:clamp(1.125rem,1.65vw,1.35rem);line-height:1.6;color:var(--ink);
  letter-spacing:.005em;margin-bottom:var(--s-5);
}
.welcome__text p.body{
  font-family:var(--font-body);font-style:normal;font-weight:400;
  font-size:clamp(1rem,1.3vw,1.0625rem);line-height:1.85;color:rgba(20,20,19,.72);
}
.welcome__signature{
  margin-top:var(--s-6);display:flex;align-items:center;gap:var(--s-4);
  font-family:var(--font-display);font-style:italic;font-size:1.25rem;color:var(--burgundy);
}
.welcome__signature::before{content:"";width:60px;height:1px;background:var(--gold)}
.welcome__media{position:relative;aspect-ratio:3/4;box-shadow:0 40px 120px -30px rgba(75,10,10,.35)}
.welcome__media img{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.02)}
.welcome__media::before{
  content:"";position:absolute;inset:-16px;border:1px solid var(--gold);
  z-index:-1;transform:translate(18px,18px);transition:transform .6s var(--e-dramatic);
}
.welcome__media:hover::before{transform:translate(10px,10px)}
.welcome__media .tag{
  position:absolute;top:var(--s-5);left:var(--s-5);
  background:var(--cream);color:var(--burgundy);padding:8px 16px;
  font-size:var(--tag);letter-spacing:.2em;text-transform:uppercase;font-weight:600;
}
@media (max-width:900px){
  .welcome__grid{grid-template-columns:1fr;gap:var(--s-7)}
  .welcome__media{order:-1;aspect-ratio:4/5}
}

/* ───── 11b. QUOTE BRIDGE ───── */
.quote-bridge{
  background:var(--cream);text-align:center;
  padding:var(--s-7) var(--pad-x) var(--s-8);
}
.quote-bridge p{
  font-family:var(--font-display);font-weight:600;font-style:italic;
  font-size:clamp(1.25rem,2.8vw,1.875rem);line-height:1.4;
  color:var(--burgundy);max-width:48ch;margin:0 auto;
}
.quote-bridge p em{color:var(--gold);font-style:inherit}

/* ───── 12. DISHES RAIL ───── */
.dishes{background:var(--offwhite);padding:var(--s-10) 0;position:relative;overflow:hidden}
.dishes__head{
  max-width:var(--maxw);margin:0 auto var(--s-9);padding:0 var(--pad-x);
  display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-6);flex-wrap:wrap;
}
.dishes__head .side{max-width:44ch}
.dishes__rail{
  display:flex;gap:var(--s-6);
  padding:var(--s-5) var(--pad-x) var(--s-7);
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
}
.dishes__rail::-webkit-scrollbar{display:none}
.dishes.pinned .dishes__rail{overflow:visible;scroll-snap-type:none}
.dish{
  min-width:min(295px,75vw);scroll-snap-align:start;
  position:relative;background:var(--cream);
  transition:transform .5s var(--e-dramatic);
}
.dish__img{position:relative;aspect-ratio:3/3.5;overflow:hidden}
.dish__img img{
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.02);transition:transform 1.2s var(--e-dramatic), filter .8s;
  filter:saturate(1.05);
}
.dish:hover .dish__img img{transform:scale(1.08)}
.dish__img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%, rgba(20,20,19,.55) 100%)}
.dish__curtain{position:absolute;inset:0;background:var(--gold);transform-origin:right;z-index:2}
.dish__num{
  position:absolute;top:var(--s-4);left:var(--s-4);z-index:3;
  font-family:var(--font-display);font-size:1.75rem;color:var(--cream);font-weight:500;
  text-shadow:0 2px 20px rgba(0,0,0,.5);
}
.dish__meta{padding:var(--s-4) var(--s-4) var(--s-5);display:flex;flex-direction:column;gap:var(--s-2)}
.dish__name{font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:var(--burgundy);line-height:1.1}
.dish__desc{color:rgba(20,20,19,.7);font-size:.8125rem;line-height:1.55}
.dish__foot{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid rgba(75,10,10,.12);
}
.dish__price{font-family:var(--font-display);color:var(--gold);font-weight:700;font-size:1.1rem}
.dish__price sup{font-size:.65em;margin-left:2px}
.dish__link{
  font-size:var(--tag);letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--burgundy);display:flex;align-items:center;gap:var(--s-2);transition:gap .3s;
}
.dish__link:hover{gap:var(--s-4)}
.dishes__scrollhint{
  max-width:var(--maxw);margin:0 auto;padding:0 var(--pad-x);
  display:flex;align-items:center;gap:var(--s-4);
  font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:600;
}
.dishes__scrollhint .track{flex:1;max-width:240px;height:1px;background:rgba(221,154,63,.25);position:relative}
.dishes__scrollhint .track span{position:absolute;left:0;top:0;height:100%;background:var(--gold);width:14%;transition:width .2s}

/* ───── 13. STORY PREVIEW ───── */
.story{
  background:var(--burgundy);
  color:var(--cream);position:relative;overflow:hidden;padding:var(--s-10) var(--pad-x);
}
.story__inner{
  max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s-10);align-items:center;
  position:relative;z-index:1;
}
.story__portrait{position:relative;aspect-ratio:4/5}
.story__portrait img{width:100%;height:100%;object-fit:cover;filter:sepia(.5) contrast(1.05) brightness(.95) saturate(.85)}
.story__portrait::after{content:"";position:absolute;inset:-1px;border:1px solid rgba(221,154,63,.55);transform:translate(16px,16px);transition:transform .6s var(--e-dramatic)}
.story__portrait:hover::after{transform:translate(8px,8px)}
.story__grain{
  position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.12;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/></svg>");
}
.story__postcard{
  position:absolute;bottom:-40px;right:-40px;width:220px;aspect-ratio:4/3;
  transform:rotate(3deg);box-shadow:0 20px 60px rgba(75,10,10,.25);
  border:4px solid #fff;z-index:3;
}
.story__postcard img{width:100%;height:100%;object-fit:cover;filter:sepia(.65) contrast(.92) brightness(.92)}
.story__text .eyebrow{color:var(--gold)}
.story__title{
  font-family:var(--font-display);font-weight:700;
  font-size:var(--text-h1);line-height:1.05;color:var(--cream);
  margin-bottom:var(--s-5);max-width:18ch;
}
.story__title em{font-style:italic;font-weight:500;color:var(--gold-hi)}
.story__quote{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:clamp(1.125rem,1.6vw,1.375rem);color:rgba(255,246,233,.9);line-height:1.55;
  max-width:58ch;margin-bottom:var(--s-5);position:relative;padding-left:var(--s-6);
}
.story__quote::before{
  content:"\201C";position:absolute;left:-6px;top:-16px;
  font-size:4rem;color:var(--gold);opacity:.7;font-family:var(--font-display);line-height:1;
}
.story__body{color:rgba(255,246,233,.78);max-width:58ch;margin-bottom:var(--s-6);font-size:1.0625rem}
.story__stats{
  display:flex;gap:var(--s-8);margin:var(--s-7) 0;flex-wrap:wrap;
  padding:var(--s-5) 0;border-top:1px solid rgba(221,154,63,.28);border-bottom:1px solid rgba(221,154,63,.28);
}
.story__stat .num{font-family:var(--font-display);font-weight:700;font-size:2.75rem;color:var(--gold);line-height:1;display:block}
.story__stat .lbl{font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,246,233,.65);font-weight:600}
@media (max-width:900px){
  .story__inner{grid-template-columns:1fr;gap:var(--s-8)}
  .story__postcard{display:none}
}

/* ───── 14. CUSTOMER MOMENTS ───── */
.moments{padding:var(--s-10) 0;background:var(--ink);overflow:hidden}
.moments__header{text-align:center;padding:0 var(--pad-x);margin-bottom:var(--s-8)}
.moments__header .section__title{margin:var(--s-3) auto var(--s-3)}
.moments__sub{color:rgba(255,246,233,.6);font-size:clamp(.9rem,1.2vw,1rem);max-width:48ch;margin:0 auto}

.moments__track-wrap{
  -webkit-mask-image:linear-gradient(to right, transparent, black 8%, black 92%, transparent);
  mask-image:linear-gradient(to right, transparent, black 8%, black 92%, transparent);
}
.moments__track{
  display:flex;gap:var(--s-5);
  animation:momentsScroll 40s linear infinite;
  will-change:transform;width:max-content;
}
.moments__track:hover{animation-play-state:paused}
@keyframes momentsScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

.mcard{
  flex:none;width:180px;
  border-radius:16px;overflow:hidden;
  position:relative;cursor:pointer;
  border:2px solid transparent;
  background:linear-gradient(var(--ink),var(--ink)) padding-box,
             linear-gradient(135deg,var(--gold),#c8753a,var(--gold)) border-box;
  transition:transform .3s var(--e-out), box-shadow .3s var(--e-out);
}
.mcard:hover{transform:scale(1.04);box-shadow:0 12px 40px rgba(0,0,0,.5)}
.mcard__media{aspect-ratio:9/16;overflow:hidden}
.mcard__media img,
.mcard__media video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--e-out)}
.mcard:hover .mcard__media img,
.mcard:hover .mcard__media video{transform:scale(1.06)}
.mcard__badge{
  position:absolute;bottom:0;left:0;right:0;
  padding:var(--s-4) var(--s-3) var(--s-3);
  background:linear-gradient(to top, rgba(20,20,19,.9) 0%, transparent 100%);
  color:rgba(255,246,233,.85);font-size:.7rem;letter-spacing:.04em;
  display:flex;align-items:center;gap:5px;font-weight:500;
}
.mcard__badge svg{flex-shrink:0;color:var(--gold)}

/* ───── 15. TESTIMONIALS ───── */
.testimonials{background:var(--cream);padding:var(--s-10) var(--pad-x);position:relative;overflow:hidden}
.testimonials__header{text-align:center;max-width:600px;margin:0 auto var(--s-8)}
.testimonials__header .section__lead{color:var(--gold);font-weight:600;font-size:var(--tag);letter-spacing:.18em;text-transform:uppercase;margin-top:var(--s-4);max-width:none;margin-inline:auto}
.tm-badges{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(16px, 2.5vw, 32px);
  flex-wrap:nowrap;margin-top:var(--s-5);
}
.tm-badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 16px;background:rgba(255,255,255,.85);
  border:1px solid rgba(0,0,0,.06);border-radius:12px;
  text-decoration:none;color:var(--ink);
  transition:all .3s var(--e-out);
  box-shadow:0 2px 12px rgba(0,0,0,.05);
  flex-shrink:0;
}
.tm-badge:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.1)}
.tm-badge__text{text-align:left;line-height:1.2}
.tm-badge__stars{color:#FBBC05;font-size:.8rem;letter-spacing:1px}
.tm-badge__stars strong{color:var(--ink);margin-left:4px;font-size:.88rem}
.tm-badge__label{font-size:.68rem;color:rgba(20,20,19,.65);margin-top:2px;font-weight:500;white-space:nowrap}
.tm-badge--guru{
  background:transparent;border:none;box-shadow:none;
  padding:0;flex-shrink:0;
}
.tm-badge--guru #b-rcircle{
  margin:0;
  transform:scale(0.72);transform-origin:center;
}
.tm-badge--guru:hover{transform:none;box-shadow:none}
@media (max-width:800px){
  .tm-badges{flex-wrap:wrap;gap:var(--s-3)}
  .tm-badge{padding:10px 14px}
  .tm-badge__label{font-size:.66rem}
  .tm-badge--guru #b-rcircle{transform:scale(0.65)}
}
@media (max-width:480px){
  .tm-badge--guru #b-rcircle{transform:scale(0.58)}
  .tm-badge__stars{font-size:.75rem}
}

.testimonials__columns{
  display:flex;justify-content:center;gap:var(--s-6);
  max-height:660px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
  mask-image:linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
}
.testimonials__col{flex:0 0 min(320px,85vw);overflow:hidden}

.testimonials__scroll{
  display:flex;flex-direction:column;gap:var(--s-5);padding-bottom:var(--s-5);
  animation:tmScroll var(--col-duration,22s) linear infinite;
  will-change:transform;
}
.testimonials__col--reverse .testimonials__scroll{
  animation-name:tmScrollReverse;
}
@keyframes tmScroll{
  0%{transform:translateY(0)}
  100%{transform:translateY(-50%)}
}
@keyframes tmScrollReverse{
  0%{transform:translateY(-50%)}
  100%{transform:translateY(0)}
}

.tm-card{
  background:var(--offwhite);border:1px solid rgba(75,10,10,.08);
  border-radius:16px;padding:var(--s-6);
  box-shadow:0 4px 24px rgba(75,10,10,.06);
}
.tm-card__text{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:1.05rem;line-height:1.55;color:var(--ink);margin-bottom:var(--s-4);
}
.tm-card__stars{color:var(--gold);letter-spacing:.12em;font-size:.9rem;margin-bottom:var(--s-3)}
.tm-card__author{display:flex;flex-direction:column;gap:2px}
.tm-card__author strong{font-size:.875rem;color:var(--burgundy);font-weight:700;letter-spacing:.04em}
.tm-card__author span{font-size:var(--tag);color:rgba(20,20,19,.5);letter-spacing:.15em;text-transform:uppercase;font-weight:500}
.tm-src{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:20px;font-size:.7rem;letter-spacing:.02em;text-transform:none;font-weight:600;width:fit-content;margin-top:4px}
.tm-src svg{flex-shrink:0}
.tm-src--google{background:rgba(66,133,244,.08);color:#1f1f1f;border:1px solid rgba(66,133,244,.2)}
.tm-src--tripadvisor{background:rgba(0,175,135,.08);color:#1f1f1f;border:1px solid rgba(0,175,135,.25)}

@media (max-width:900px){
  .testimonials__columns{gap:var(--s-4)}
  .testimonials__col:nth-child(3){display:none}
}
@media (max-width:600px){
  .testimonials__col:nth-child(2){display:none}
  .testimonials__col{flex:0 0 100%}
}

/* ───── 15. VISIT US ───── */
.visit{
  background:var(--cream);padding:var(--s-10) var(--pad-x);position:relative;overflow:hidden;
}
.visit::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("../logos/zellige-tile.png");
  background-image:image-set(url("../logos/zellige-tile-400w.webp") type("image/webp"),url("../logos/zellige-tile.png") type("image/png"));
  background-position:center center;background-size:260px;background-repeat:repeat;
  opacity:.035;
}
.visit__inner{
  max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:1fr 1.15fr;gap:var(--s-8);
  align-items:stretch;position:relative;z-index:1;
}
.visit__info{display:flex;flex-direction:column;gap:var(--s-4);justify-content:center}
.visit__title{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.05;letter-spacing:-.01em;
  color:var(--ink);margin:var(--s-3) 0 var(--s-3);
}
.visit__title em{color:var(--gold);font-style:italic;font-weight:400}
.visit__lead{
  color:rgba(20,20,19,.72);line-height:1.7;max-width:46ch;
  font-size:clamp(1rem,1.25vw,1.0625rem);margin-bottom:var(--s-4);
}
.visit__details{display:flex;flex-direction:column;gap:var(--s-4);margin-bottom:var(--s-5)}
.visit__row{display:flex;align-items:flex-start;gap:var(--s-4)}
.visit__icon{
  width:44px;height:44px;border-radius:50%;
  background:rgba(221,154,63,.1);color:var(--gold);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  border:1px solid rgba(221,154,63,.25);
}
.visit__rowtext{padding-top:4px}
.visit__label{
  font-size:var(--tag);letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:4px;
}
.visit__value{color:var(--ink);font-size:1rem;line-height:1.5;font-weight:500}
.visit__value a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.visit__value a:hover{border-color:var(--gold)}
.visit__actions{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-3)}
.visit__actions .btn{flex:1 1 0;min-width:0;justify-content:center;padding:16px 20px}
.visit__actions .btn--ghost{color:var(--burgundy);border-color:rgba(75,10,10,.35)}
.visit__actions .btn--ghost:hover{color:var(--gold);border-color:var(--gold)}

.visit__media{
  position:relative;
  min-height:620px;
}
.visit__photo,.visit__map{
  position:relative;
  border-radius:var(--r-lg);overflow:hidden;
  box-shadow:0 24px 70px rgba(75,10,10,.18), 0 2px 8px rgba(0,0,0,.06);
  border:1px solid rgba(221,154,63,.3);
}
.visit__photo{
  width:82%;height:78%;
  position:absolute;top:0;left:0;z-index:1;
}
.visit__map{
  width:58%;height:52%;
  position:absolute;bottom:0;right:0;z-index:2;
}
.visit__photo{background:var(--ink)}
.visit__photo img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .8s var(--e-out);
}
.visit__photo:hover img{transform:scale(1.04)}
.visit__photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top, rgba(20,20,19,.55) 0%, transparent 45%);
}
.visit__photo-tag{
  position:absolute;left:var(--s-5);bottom:var(--s-5);right:var(--s-5);
  color:var(--cream);z-index:1;
  display:flex;flex-direction:column;gap:6px;
}
.visit__photo-tag-eyebrow{
  font-size:var(--tag);letter-spacing:.35em;text-transform:uppercase;
  color:var(--gold);font-weight:600;
}
.visit__photo-tag-text{
  font-family:var(--font-display);font-size:1.75rem;line-height:1.15;
  font-weight:500;letter-spacing:.02em;
}
.visit__photo-tag-text em{
  display:block;font-style:italic;font-size:.85rem;font-weight:400;
  color:rgba(255,246,233,.8);margin-top:4px;letter-spacing:.15em;text-transform:uppercase;
}

.visit__map-frame{
  position:absolute;inset:0;
  filter:saturate(1.05) contrast(1.02);
}
.visit__map-frame iframe{
  width:100%;height:100%;border:0;display:block;
  filter:grayscale(.1);
  transition:filter .5s var(--e-out);
}
.visit__map:hover .visit__map-frame iframe{filter:grayscale(0)}

.visit__map-card{
  position:absolute;left:var(--s-3);bottom:var(--s-3);
  background:rgba(255,251,242,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(221,154,63,.3);
  border-radius:14px;padding:12px 16px;
  display:flex;align-items:center;gap:12px;
  max-width:calc(100% - var(--s-5));
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.visit__map-card-mark{
  width:38px;height:38px;flex-shrink:0;
  background:url("../logos/mandala.png") center/contain no-repeat;
}
.visit__map-card-name{
  font-family:var(--font-display);font-size:1rem;font-weight:600;
  color:var(--ink);letter-spacing:.02em;line-height:1.2;
}
.visit__map-card-sub{
  font-size:.78rem;color:#FBBC05;margin-top:2px;letter-spacing:.5px;
}

@media (max-width:900px){
  .visit__inner{grid-template-columns:1fr;gap:var(--s-7)}
  .visit__info{order:1}
  .visit__media{order:2;min-height:auto;display:flex;flex-direction:column;gap:var(--s-4)}
  .visit__photo,.visit__map{position:relative;width:100%;height:auto}
  .visit__photo{min-height:380px;aspect-ratio:16/10}
  .visit__map{min-height:340px}
}
@media (max-width:640px){
  .visit__media{gap:var(--s-3)}
  .visit__photo{min-height:260px;aspect-ratio:4/3}
  .visit__map{min-height:300px}
  .visit__map-card{left:var(--s-3);bottom:var(--s-3);padding:10px 14px;gap:10px}
  .visit__map-card-mark{width:34px;height:34px}
  .visit__map-card-name{font-size:.95rem}
  .visit__actions .btn{width:100%;justify-content:center}
  .visit__photo-tag-text{font-size:1.35rem}
}

/* ───── 16. GALLERY ───── */
.gallery{background:var(--cream);padding:var(--s-10) var(--pad-x);position:relative}
.gallery__head{max-width:var(--maxw);margin:0 auto var(--s-8);text-align:center}
.gallery__head .eyebrow{justify-content:center}
.gallery__head .eyebrow::before{display:none}
.gallery__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:120px;gap:var(--s-4)}
.gitem{position:relative;overflow:hidden;transition:transform .6s var(--e-dramatic)}
.gitem img,.gitem video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--e-dramatic);filter:saturate(1.05)}
.gitem:hover img,.gitem:hover video{transform:scale(1.06)}
.gitem__wipe{position:absolute;inset:0;background:var(--gold);transform-origin:left;z-index:2}
.gitem::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 50%,rgba(20,20,19,.35) 100%);opacity:0;transition:opacity .5s}
.gitem:hover::after{opacity:1}
.gitem .cap{position:absolute;left:var(--s-5);bottom:var(--s-5);z-index:3;color:var(--cream);font-size:var(--tag);letter-spacing:.2em;text-transform:uppercase;opacity:0;transform:translateY(10px);transition:opacity .5s, transform .5s}
.gitem:hover .cap{opacity:1;transform:translateY(0)}
.g1{grid-column:span 3;grid-row:span 3}
.g2{grid-column:span 3;grid-row:span 2}
.g3{grid-column:span 2;grid-row:span 3}
.g4{grid-column:span 2;grid-row:span 2}
.g5{grid-column:span 2;grid-row:span 2}
.g6{grid-column:span 3;grid-row:span 2}
.g7{grid-column:span 3;grid-row:span 2}
.g1 img{object-position:center 85%} /* Show the salad plate clearly */
.g7 img{object-position:bottom}    /* Show the rooftop tagine clearly */
/* ── mobile: film-roll mosaic — staggered widths, alternating sides, gold thread ── */
@media (max-width:900px){
  .gallery{padding-left:0;padding-right:0}
  .gallery__head{padding:0 var(--pad-x)}
  .gallery__grid{
    grid-template-columns:repeat(12,1fr);
    grid-auto-rows:auto;
    gap:var(--s-3) var(--s-2);
    padding:0 var(--pad-x);
    position:relative;
  }
  .gallery__grid::before{
    content:"";position:absolute;left:50%;top:8%;bottom:8%;width:1px;z-index:0;pointer-events:none;
    background:linear-gradient(180deg,transparent,rgba(221,154,63,.35) 20%,rgba(221,154,63,.35) 80%,transparent);
  }
  .gitem{aspect-ratio:auto;grid-row:auto;z-index:1}
  .g1{grid-column:1 / -1; aspect-ratio:16 / 11}
  .g2{grid-column:3 / -1; aspect-ratio:4 / 5}
  .g3{grid-column:1 / 11; aspect-ratio:3 / 4}
  .g4{grid-column:4 / -1; aspect-ratio:4 / 5}
  .g5{grid-column:1 / 9;  aspect-ratio:1 / 1}
  .g6{grid-column:1 / 7;  aspect-ratio:4 / 5}
  .g7{grid-column:7 / 13; aspect-ratio:4 / 5}

  /* always-visible caption chip on mobile (hover captions are invisible without a pointer) */
  .gitem .cap{
    opacity:1;transform:none;z-index:4;
    left:10px;bottom:10px;padding:5px 10px;
    background:rgba(75,10,10,.92);color:var(--cream);
    font-size:9.5px;letter-spacing:.18em;
    border:1px solid rgba(221,154,63,.35);
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  }
}

/* ───── 15b. MOBILE IMAGE FLOURISHES (home — welcome / story / visit / moments) ───── */
@media (max-width:900px){
  /* "Unveil": pure opacity + filter exposure-lift. No transforms → no overflow conflict,
     so decorative offset frames (like .welcome__media::before) stay fully visible.        */
  @keyframes mImgUnveil{
    0%   {opacity:0;filter:brightness(.82) saturate(.7) contrast(1.02)}
    100% {opacity:1;filter:saturate(1.05) contrast(1.02)}
  }
  @keyframes mImgUnveilSepia{
    0%   {opacity:0;filter:sepia(.65) brightness(.78) saturate(.6) contrast(1.05)}
    100% {opacity:1;filter:sepia(.5) brightness(.95) saturate(.85) contrast(1.05)}
  }
  @keyframes mImgUnveilPlain{
    0%   {opacity:0;filter:brightness(.82) saturate(.7)}
    100% {opacity:1;filter:brightness(1) saturate(1)}
  }

  /* welcome — keep the offset gold frame from desktop; img unveils inside it */
  .welcome__media.reveal.in img{animation:mImgUnveil 1.6s var(--e-welcome) both}

  /* story portrait — sepia softens as the print "develops" */
  .story__portrait.reveal.in img{animation:mImgUnveilSepia 1.8s var(--e-welcome) both}

  /* visit photo — same gentle unveil, slightly delayed so map and photo don't pop together */
  .visit__media.reveal.in .visit__photo img{animation:mImgUnveilPlain 1.6s .18s var(--e-welcome) both}

  /* moments marquee — soft edge fade so cards drift in/out of view instead of hard-cutting */
  .moments__track-wrap{
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
            mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
  }
}

/* ───── 16. BOOKING CALLOUT ───── */
.booking-cta{position:relative;min-height:80vh;display:flex;align-items:center;justify-content:center;overflow:hidden;text-align:center;color:var(--cream);isolation:isolate}
.booking-cta__bg{position:absolute;inset:-10%;z-index:-2;background-image:url("../images/_MG_1119.jpg");background-image:image-set(url("../images/_MG_1119-1280w.webp") type("image/webp"),url("../images/_MG_1119.jpg") type("image/jpeg"));background-position:center;background-size:cover;background-repeat:no-repeat;filter:brightness(.55) saturate(1.05);transform:scale(1.08)}
.booking-cta__overlay{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at center, rgba(20,20,19,.3) 0%, rgba(20,20,19,.85) 100%)}
.booking-cta__content{max-width:880px;padding:var(--s-9) var(--pad-x);display:flex;flex-direction:column;align-items:center;gap:var(--s-5)}
.booking-cta__mark{width:72px;height:72px;background:url("../logos/mandala.png") center/contain no-repeat;filter:drop-shadow(0 0 20px rgba(221,154,63,.45));margin-bottom:var(--s-3)}
.booking-cta__title{font-family:var(--font-display);font-weight:700;font-size:clamp(2.5rem,5vw,4.25rem);line-height:1.05;color:var(--cream);max-width:18ch}
.booking-cta__title em{font-style:italic;font-weight:500;
  background:linear-gradient(120deg,var(--gold) 0%,var(--sand) 50%,var(--gold) 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 6s linear infinite;
}
.booking-cta__info{display:flex;gap:var(--s-8);flex-wrap:wrap;justify-content:center;margin:var(--s-5) 0;color:rgba(255,246,233,.8);font-size:var(--tag);letter-spacing:.2em;text-transform:uppercase;font-weight:500}
.booking-cta__info .dot{width:4px;height:4px;border-radius:50%;background:var(--gold);align-self:center}
.booking-cta .btn--primary{animation:breathe 4s ease-in-out infinite}
@keyframes breathe{
  0%,100%{box-shadow:0 0 20px rgba(221,154,63,.3),0 0 60px rgba(221,154,63,.15)}
  50%{box-shadow:0 0 40px rgba(221,154,63,.6),0 0 120px rgba(221,154,63,.3)}
}

/* ───── 17. FOOTER ───── */
footer{background:var(--forest);color:rgba(255,246,233,.72);padding:var(--s-9) var(--pad-x) var(--s-6);position:relative;overflow:hidden}
footer::before{
  content:"";position:absolute;inset:0;
  background-image:url("../logos/zellige-pattern.png");
  background-image:image-set(url("../logos/zellige-pattern-840w.webp") type("image/webp"),url("../logos/zellige-pattern.png") type("image/png"));
  background-position:center top;background-size:420px;background-repeat:repeat;
  opacity:.03;mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(to bottom, black 82%, transparent 96%);
  mask-image:linear-gradient(to bottom, black 82%, transparent 96%);
}
@media (max-width:768px){
  footer::before{
    background-image:url("../logos/zellige-pattern.png");
    background-image:image-set(url("../logos/zellige-pattern-840w.webp") type("image/webp"),url("../logos/zellige-pattern.png") type("image/png"));
    background-position:center;background-size:cover;background-repeat:no-repeat;
    opacity:.04;
    mix-blend-mode:screen;
    -webkit-mask-image:linear-gradient(to bottom, black 82%, transparent 96%);
    mask-image:linear-gradient(to bottom, black 82%, transparent 96%);
  }
}
.foot{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--s-7);padding-bottom:var(--s-7);border-bottom:1px solid rgba(221,154,63,.15)}
.foot h5{font-family:var(--font-body);font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:var(--s-5);font-weight:600}
.foot ul{display:flex;flex-direction:column;gap:var(--s-3)}
.foot a{transition:color .3s,padding .3s}
.foot a:hover{color:var(--gold);padding-left:6px}
.foot__brand{display:flex;flex-direction:column;gap:var(--s-4)}
.foot__brand .mark{width:56px;height:56px;background:url("../logos/mandala.png") center/contain no-repeat}
.foot__brand .word{font-family:var(--font-display);font-size:1.0625rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);font-weight:600}
.foot__brand .tagline{font-family:var(--font-display);font-style:italic;color:rgba(255,246,233,.7);max-width:40ch;line-height:1.55;font-size:1.0625rem}
.foot__socials{display:flex;gap:var(--s-3);margin-top:var(--s-2)}
.foot__socials a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(221,154,63,.35);display:inline-flex;align-items:center;justify-content:center;color:var(--gold);transition:all .3s var(--e-out)}
.foot__socials a:hover{background:var(--gold);color:var(--ink);border-color:var(--gold);transform:translateY(-2px)}
.foot__bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--s-5);font-size:.8125rem;color:rgba(255,246,233,.5);flex-wrap:wrap;gap:var(--s-4)}
.foot__bottom em{color:var(--gold);font-style:normal}
.foot__legal{display:flex;gap:var(--s-2);align-items:center;color:rgba(255,246,233,.45)}
.foot__legal a{color:rgba(255,246,233,.75);transition:color .3s;padding:0}
.foot__legal a:hover{color:var(--gold);padding-left:0}
@media (max-width:900px){.foot__grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot__grid{grid-template-columns:1fr 1fr;gap:var(--s-5)}.foot__brand{grid-column:1 / -1}}

/* ═══════════════════════════════════════════════════════════
   STORY PAGE
   ═══════════════════════════════════════════════════════════ */
.story-page{background:var(--cream)}
.story-timeline{position:fixed;left:var(--s-6);top:50%;transform:translateY(-50%);z-index:50;display:flex;flex-direction:column;gap:var(--s-5);pointer-events:none}
.story-timeline .line{position:absolute;left:8px;top:0;bottom:0;width:1px;background:rgba(75,10,10,.15);transition:background .4s}
.story-timeline .fill{position:absolute;left:8px;top:0;width:1px;background:var(--gold);height:0%;box-shadow:0 0 10px rgba(221,154,63,.6);transition:height .1s linear}
.story-timeline .node{position:relative;display:flex;align-items:center;gap:var(--s-4);padding-left:0}
.story-timeline .node .dot{width:18px;height:18px;border-radius:50%;border:1px solid var(--gold);background:var(--cream);transition:background .4s, transform .4s, border-color .4s}
.story-timeline .node.passed .dot{background:var(--gold);transform:scale(1.15);box-shadow:0 0 20px rgba(221,154,63,.6)}
.story-timeline .node .year{font-family:var(--font-display);font-weight:600;color:var(--burgundy);font-size:.875rem;letter-spacing:.1em;opacity:0;transform:translateX(-6px);transition:opacity .4s, transform .4s, color .4s}
.story-timeline .node.passed .year{opacity:1;transform:translateX(0)}
.story-timeline.is-dark .line{background:rgba(255,246,233,.2)}
.story-timeline.is-dark .node .year{color:var(--gold)}
.story-timeline.is-stopped{position:absolute;transform:none}
@media (max-width:1100px){.story-timeline{display:none}}

.chapter{padding:var(--s-10) var(--pad-x);position:relative;max-width:var(--maxw);margin:0 auto}
.chapter--dark{background:var(--burgundy);color:var(--cream);max-width:none;padding-left:var(--pad-x);padding-right:var(--pad-x)}
.chapter__inner{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr;gap:var(--s-7)}
.chapter__inner--split{grid-template-columns:1fr 1fr;align-items:center}
.chapter__num{font-family:var(--font-display);font-size:clamp(3rem,6vw,5rem);font-weight:500;color:var(--gold);line-height:1;opacity:.55;font-style:italic}
.chapter__year{display:inline-block;padding:6px 14px;border:1px solid var(--gold);color:var(--gold);font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;font-weight:600;margin-bottom:var(--s-4)}
.chapter__title{font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,4vw,3rem);line-height:1.05;color:var(--burgundy);margin-bottom:var(--s-5);max-width:22ch}
.chapter--dark .chapter__title{color:var(--cream)}
.chapter__body{font-size:clamp(1rem,1.35vw,1.125rem);line-height:1.85;color:rgba(20,20,19,.78);max-width:62ch}
.chapter--dark .chapter__body{color:rgba(255,246,233,.8)}
.chapter__body p{margin-bottom:var(--s-4)}
.chapter__body em{color:var(--gold);font-style:italic;font-family:var(--font-display);font-weight:600}
.chapter__img{position:relative;aspect-ratio:4/5;overflow:hidden}
.chapter__img img{width:100%;height:100%;object-fit:cover}
.chapter__img--sepia img{filter:sepia(.6) contrast(1.05) brightness(.95) saturate(.8)}
.chapter__img::before{content:"";position:absolute;inset:-1px;border:1px solid var(--gold);transform:translate(14px,14px);z-index:-1}
.chapter__pullquote{
  font-family:var(--font-display);font-weight:500;font-style:italic;
  font-size:clamp(1.5rem,3vw,2.25rem);line-height:1.3;color:var(--gold);
  max-width:30ch;margin:var(--s-7) 0;padding-left:var(--s-6);border-left:2px solid var(--gold);
}
@media (max-width:900px){
  .chapter__inner--split{grid-template-columns:1fr}
}

/* ───── Moulay Driss travelling portrait (story page, MotionPath zigzag) ───── */
.story-chapters{position:relative;overflow:visible}
.moulay-floater{
  position:absolute;top:0;left:0;
  width:180px;height:220px;
  z-index:5;pointer-events:none;
  opacity:0;
  will-change:transform,opacity;
}
.moulay-floater img{
  width:100%;height:100%;object-fit:cover;
  filter:sepia(.55) contrast(1.05) brightness(.92) saturate(.85);
  box-shadow:0 30px 60px rgba(0,0,0,.45);
}
.moulay-floater::after{
  content:"";position:absolute;inset:-1px;
  border:1px solid rgba(221,154,63,.6);
  transform:translate(10px,10px);
  pointer-events:none;
}
@media (max-width:900px){
  .moulay-floater::after{transform:translate(8px,8px)}
}

/* ───── Story page: mid-page bridge CTA (between chapters) ───── */
.story-cta-bridge{
  padding:var(--s-7) var(--pad-x);
  text-align:center;
  background:var(--cream);
  border-top:1px solid rgba(221,154,63,.3);
  border-bottom:1px solid rgba(221,154,63,.3);
}
.story-cta-bridge__inner{max-width:640px;margin:0 auto}
.story-cta-bridge__line{
  font-family:var(--font-display);
  font-style:italic;
  font-size:clamp(1.25rem,2.2vw,1.625rem);
  color:var(--burgundy);
  line-height:1.4;
  margin:0 0 var(--s-5);
}
.story-cta-bridge__line em{color:var(--gold);font-style:italic}

/* ───── Story page: Meet the Family panel ───── */
.meet-family{padding:var(--s-9) var(--pad-x);background:var(--cream)}
.meet-family__inner{max-width:var(--maxw);margin:0 auto}
.meet-family__head{text-align:center;margin-bottom:var(--s-7)}
.meet-family__eyebrow{
  display:inline-block;
  font-size:var(--tag);
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600;
  margin-bottom:var(--s-3);
}
.meet-family__title{
  font-family:var(--font-display);
  font-size:clamp(2rem,4vw,3rem);
  color:var(--burgundy);
  font-weight:700;
  line-height:1.1;
  max-width:24ch;
  margin:0 auto;
}
.meet-family__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--s-6);
}
.meet-family__card{display:flex;flex-direction:column}
.meet-family__photo{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  margin-bottom:var(--s-4);
}
.meet-family__photo img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1s var(--e-dramatic);
}
.meet-family__card:hover .meet-family__photo img{transform:scale(1.04)}
.meet-family__photo::before{
  content:"";position:absolute;inset:-1px;
  border:1px solid var(--gold);
  transform:translate(10px,10px);
  z-index:-1;
}
.meet-family__name{
  font-family:var(--font-display);
  font-size:1.5rem;
  color:var(--burgundy);
  font-weight:700;
  margin-bottom:4px;
}
.meet-family__role{
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600;
  margin-bottom:var(--s-3);
}
.meet-family__bio{
  font-size:.95rem;
  line-height:1.7;
  color:rgba(20,20,19,.78);
  max-width:38ch;
}
@media (max-width:900px){
  .meet-family__grid{grid-template-columns:1fr;gap:var(--s-7)}
  .meet-family__bio{max-width:none}
}

/* ═══════════════════════════════════════════════════════════
   MENU PAGE
   ═══════════════════════════════════════════════════════════ */
.menu-tabs{
  position:sticky;top:var(--menu-tabs-top, var(--nav-h));z-index:40;background:rgba(255,246,233,.95);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(75,10,10,.08);padding:var(--s-4) 0;
}
/* JS-managed sticky fallback: Lenis scrolls html, body{overflow-y:scroll} makes body
   the CSS sticky container but its scrollTop never changes → sticky breaks without this */
.menu-tabs.is-pinned{position:fixed!important;top:var(--menu-tabs-top, var(--nav-h));left:0;right:0;width:100%}
.menu-tabs__inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad-x);display:flex;gap:var(--s-5);overflow-x:auto;scrollbar-width:none}
.menu-tabs__inner::-webkit-scrollbar{display:none}
.menu-tabs a{
  font-size:var(--tag);letter-spacing:.15em;text-transform:uppercase;font-weight:600;
  color:rgba(20,20,19,.55);white-space:nowrap;padding:var(--s-3) 0;
  border-bottom:2px solid transparent;transition:color .3s, border-color .3s;
}
.menu-tabs a:hover{color:var(--burgundy)}
.menu-tabs a.active{color:var(--burgundy);border-bottom-color:var(--gold)}

@media (max-width:768px){
  .menu-tabs{padding:var(--s-2) 0}
}

.menu-cat{padding:var(--s-9) var(--pad-x);max-width:var(--maxw);margin:0 auto;position:relative}
.menu-cat__header{display:flex;align-items:baseline;gap:var(--s-5);margin-bottom:var(--s-8);position:relative}
.menu-cat__header::after{content:"";flex:1;height:1px;background:rgba(221,154,63,.35)}
.menu-cat__num{font-family:var(--font-display);font-weight:500;font-style:italic;color:var(--gold);font-size:1.5rem;opacity:.7}
.menu-cat__title{font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,3.5vw,2.75rem);color:var(--burgundy);letter-spacing:.02em;text-transform:uppercase}
.menu-cat__intro{
  max-width:60ch;margin:0 auto var(--s-6);padding:0 var(--s-5);
  text-align:center;color:rgba(20,20,19,.7);
  font-family:var(--font-body);font-size:1.0625rem;line-height:1.65;
  font-style:italic;
}
.menu-items{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-7) var(--s-9)}
.menu-item{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-4);padding-bottom:var(--s-4);border-bottom:1px dashed rgba(75,10,10,.15)}
.menu-item__info h4{font-family:var(--font-display);font-weight:700;font-size:1.375rem;color:var(--burgundy);line-height:1.15;margin-bottom:6px}
.menu-item__info p{font-size:.9375rem;color:rgba(20,20,19,.6);line-height:1.55;max-width:42ch}
.menu-item__price{font-family:var(--font-display);color:var(--gold);font-weight:700;font-size:1.375rem;white-space:nowrap}
.menu-item__price sup{font-size:.6em;margin-left:2px}
.menu-item--feature{
  grid-column:1 / -1;display:grid;grid-template-columns:1fr 1.4fr;gap:var(--s-6);
  padding:var(--s-6);background:var(--offwhite);border-bottom:0;margin:var(--s-4) 0;
}
.menu-item--feature .menu-item__img{aspect-ratio:4/3;overflow:hidden}
.menu-item--feature .menu-item__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e-dramatic)}
.menu-item--feature:hover .menu-item__img img{transform:scale(1.05)}
.menu-item--feature .menu-item__body{display:flex;flex-direction:column;justify-content:center;padding-right:var(--s-5)}
.menu-item--feature h4{font-size:1.875rem;margin-bottom:var(--s-3)}
.menu-item--feature p{font-size:1rem;margin-bottom:var(--s-4);max-width:56ch}
@media (max-width:768px){
  .menu-items{grid-template-columns:1fr;gap:var(--s-5)}
  .menu-item--feature{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════════════
   BOOKING PAGE
   ═══════════════════════════════════════════════════════════ */
.booking-main{background:var(--cream);padding:var(--s-10) var(--pad-x);overflow:hidden}
.booking-main__inner{max-width:720px;margin:0 auto;text-align:center;position:relative}
.booking-main__inner::before{content:"";position:absolute;inset:-80px;background:url("../logos/mandala.png") center/520px no-repeat;opacity:.04;pointer-events:none}
.booking-widget{
  margin-top:var(--s-7);padding:0;background:var(--cream);
  border:0;position:relative;
}
.booking-widget::before{display:none}
.booking-widget__note{color:rgba(20,20,19,.6);font-size:.875rem;margin-top:var(--s-5);font-style:italic}
.booking-embed{position:relative;width:100%;height:594px;overflow:hidden;background:var(--cream)}
.booking-embed::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(110deg, var(--offwhite) 0%, var(--cream) 45%, var(--offwhite) 90%);
  background-size:220% 100%;background-position:0 0;
  animation:bookingShimmer 2s linear infinite;
}
.booking-embed iframe{position:relative;z-index:1;width:100%;height:100%;border:0;display:block;background:var(--cream)}
@keyframes bookingShimmer{0%{background-position:200% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){
  .booking-embed::before{animation:none;background:linear-gradient(110deg, var(--offwhite) 0%, var(--cream) 50%, var(--offwhite) 100%)}
}
@media (max-width:640px){.booking-embed{height:688px}}

.booking-form{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5);text-align:left}
.booking-form .full{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:var(--tag);letter-spacing:.18em;text-transform:uppercase;color:var(--burgundy);font-weight:600}
.field input,.field select,.field textarea{
  padding:12px 14px;border:1px solid rgba(75,10,10,.2);background:var(--cream);
  font:inherit;color:var(--ink);transition:border-color .3s, box-shadow .3s;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(221,154,63,.12)}
.field textarea{resize:vertical;min-height:100px}
@media (max-width:640px){.booking-form{grid-template-columns:1fr}}

.expect{padding:var(--s-9) var(--pad-x);background:var(--offwhite)}
.expect__inner{max-width:var(--maxw);margin:0 auto}
.expect__head{text-align:center;margin-bottom:var(--s-8)}
.expect__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6)}
.expect__card{position:relative}
.expect__card .img{aspect-ratio:4/5;overflow:hidden;margin-bottom:var(--s-4);position:relative}
.expect__card .img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e-dramatic)}
.expect__card:hover .img img{transform:scale(1.05)}
.expect__card h4{font-family:var(--font-display);font-weight:700;font-size:1.5rem;color:var(--burgundy);margin-bottom:6px}
.expect__card p{color:rgba(20,20,19,.65);font-size:.9375rem}
@media (max-width:900px){.expect__grid{grid-template-columns:1fr;gap:var(--s-5)}}

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE
   ═══════════════════════════════════════════════════════════ */
.contact-main{background:var(--cream);padding:var(--s-10) var(--pad-x)}
.contact-main__inner{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1.2fr;gap:var(--s-9)}
.contact-info h2{margin-bottom:var(--s-5)}
.contact-info__block{margin-bottom:var(--s-7);padding-bottom:var(--s-5);border-bottom:1px solid rgba(75,10,10,.12)}
.contact-info__block:last-child{border-bottom:0}
.contact-info__block h5{font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:var(--s-3)}
.contact-info__block p,.contact-info__block a{font-family:var(--font-display);font-size:1.375rem;color:var(--burgundy);font-weight:500;display:block;line-height:1.35}
.contact-info__block a:hover{color:var(--gold)}
.contact-info__hours{display:grid;grid-template-columns:auto 1fr;gap:var(--s-3) var(--s-5);font-family:var(--font-body);font-size:1rem;color:var(--ink)}
.contact-info__hours dt{color:rgba(20,20,19,.55);letter-spacing:.08em;text-transform:uppercase;font-size:var(--tag);font-weight:600;align-self:center}
.contact-info__hours dd{color:var(--burgundy);font-weight:500}
.contact-socials{display:flex;gap:var(--s-3);margin-top:var(--s-4);flex-wrap:wrap}
.contact-socials a{
  width:44px;height:44px;border-radius:50%;border:1px solid rgba(221,154,63,.4);
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .3s, border-color .3s, color .3s, transform .3s;
  color:var(--gold);
}
.contact-socials a:hover{background:var(--gold);color:var(--ink);border-color:var(--gold);transform:translateY(-2px)}

.contact-map{position:relative;aspect-ratio:4/5;min-height:500px;overflow:hidden;border:1px solid rgba(221,154,63,.25)}
.contact-map iframe{width:100%;height:100%;border:0;filter:sepia(.25) contrast(1.05) saturate(.9)}

.directions{padding:var(--s-9) var(--pad-x);background:var(--offwhite)}
.directions__inner{max-width:780px;margin:0 auto;text-align:center}
.directions ol{text-align:left;margin-top:var(--s-6);counter-reset:step}
.directions li{list-style:none;counter-increment:step;padding:var(--s-4) 0 var(--s-4) var(--s-8);border-bottom:1px dashed rgba(75,10,10,.15);position:relative;font-size:1.0625rem;color:rgba(20,20,19,.78)}
.directions li::before{
  content:counter(step,decimal-leading-zero);position:absolute;left:0;top:var(--s-4);
  font-family:var(--font-display);font-weight:700;color:var(--gold);font-size:1.5rem;
}
@media (max-width:900px){
  .contact-main__inner{grid-template-columns:1fr;gap:var(--s-7)}
  .contact-map{min-height:380px}
}

/* ───── 18. UTILITIES ───── */
.only-mobile{display:none}
@media (max-width:900px){
  .only-mobile{display:block}
  .only-desktop{display:none}
}

/* ═══════════════════════════════════════════════════════════
   19. GALLERY PAGE  ·  "The House in Frames"
   Four-act editorial: atlas, four-hours, film strip, polaroid
   Cream / burgundy / gold — matches brand DNA
   ═══════════════════════════════════════════════════════════ */
.gal-page{background:var(--cream);color:var(--ink)}
.gal-page .zellige-bg{display:none}

/* Side index */
.galx-index{
  position:fixed;right:max(20px,2vw);top:50%;transform:translateY(-50%);
  z-index:60;pointer-events:none;
}
.galx-index ol{list-style:none;display:flex;flex-direction:column;gap:14px;pointer-events:auto}
.galx-index a{
  display:flex;align-items:center;gap:10px;color:rgba(75,10,10,.45);
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;
  transition:color .3s, gap .3s;
}
.galx-index a::before{
  content:attr(data-num);font-family:var(--font-display);font-style:italic;
  font-size:14px;color:var(--gold);letter-spacing:.05em;
}
.galx-index a::after{
  content:"";width:26px;height:1px;background:rgba(221,154,63,.55);transition:width .4s, background .3s;
}
.galx-index a span{opacity:0;transform:translateX(6px);transition:opacity .3s, transform .3s;pointer-events:none}
.galx-index a:hover,
.galx-index a.active{color:var(--burgundy);gap:16px}
.galx-index a:hover::after,
.galx-index a.active::after{width:42px;background:var(--burgundy)}
.galx-index a:hover span,
.galx-index a.active span{opacity:1;transform:translateX(0)}
@media (max-width:960px){.galx-index{display:none}}

/* ─── HERO ─── */
.galx-hero{
  position:relative;min-height:100vh;min-height:100svh;
  display:flex;align-items:flex-end;padding:calc(var(--nav-h) + var(--s-7)) var(--pad-x) var(--s-9);
  isolation:isolate;overflow:hidden;background:#0a0a09;
}
.galx-hero__bg{
  position:absolute;inset:-6%;z-index:-3;background-size:cover;background-position:center;
  filter:brightness(.45) saturate(1.15) contrast(1.1);
  transform:scale(1.08);animation:kenBurns 26s ease-in-out infinite alternate;
}
.galx-hero__grain{
  position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:.25;mix-blend-mode:overlay;
  background:
    radial-gradient(circle at 20% 30%, rgba(221,154,63,.08), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(221,154,63,.06), transparent 50%);
}
.galx-hero__overlay{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg, rgba(14,14,13,.5) 0%, rgba(14,14,13,.1) 45%, rgba(14,14,13,.95) 100%),
    radial-gradient(ellipse at 30% 60%, rgba(75,10,10,.35), transparent 55%);
}
.galx-hero__inner{max-width:var(--maxw);margin:0 auto;width:100%}
.galx-hero__eyebrow{
  display:inline-flex;align-items:center;gap:14px;
  font-size:var(--tag);letter-spacing:.4em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:var(--s-5);
}
.galx-hero__eyebrow span{width:42px;height:1px;background:var(--gold)}
.galx-hero__title{
  font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;
  font-size:clamp(3rem,7vw,7rem);line-height:.98;color:var(--cream);
  margin:0 0 var(--s-5);
}
.galx-hero__title em{
  font-style:italic;font-weight:500;
  background:linear-gradient(120deg,var(--gold) 0%,#F0D58C 45%,var(--gold) 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 7s linear infinite;
}
.galx-hero__sub{max-width:55ch;color:rgba(255,246,233,.72);line-height:1.7;font-size:1.0625rem;margin-bottom:var(--s-6)}
.galx-hero__meta{
  display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center;
  padding-top:var(--s-5);border-top:1px solid rgba(221,154,63,.2);
  font-size:var(--tag);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,246,233,.55);
}
.galx-hero__meta strong{color:var(--gold);font-family:var(--font-display);font-size:1.25rem;font-weight:600;letter-spacing:.02em;text-transform:none;margin-right:6px}
.galx-hero__meta em{width:6px;height:6px;border-radius:50%;background:rgba(221,154,63,.4);font-style:normal}
.galx-hero__scroll{
  position:absolute;left:var(--pad-x);bottom:24px;
  display:flex;align-items:center;gap:14px;
  font-size:var(--tag);letter-spacing:.3em;text-transform:uppercase;color:rgba(255,246,233,.5);font-weight:600;
}
.galx-hero__scroll .line{width:80px;height:1px;background:rgba(221,154,63,.5);position:relative;overflow:hidden}
.galx-hero__scroll .line::after{
  content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;background:var(--gold);
  animation:scrollLine 2.4s ease-in-out infinite;
}
@keyframes scrollLine{0%{left:-40%}100%{left:100%}}

/* ─── ACT BASE ─── */
.galx-act{position:relative;padding:var(--s-10) var(--pad-x);max-width:100%;overflow:hidden}
.galx-act__head{max-width:640px;margin-bottom:var(--s-8)}
.galx-act__head--center{max-width:640px;margin:0 auto var(--s-8);text-align:center}
.galx-act__num{
  font-family:var(--font-display);font-style:italic;color:var(--gold);
  font-size:1rem;letter-spacing:.25em;text-transform:uppercase;margin-bottom:var(--s-3);
  display:flex;align-items:center;gap:14px;
}
.galx-act__head--center .galx-act__num{justify-content:center}
.galx-act__num::before,.galx-act__num::after{content:"";width:32px;height:1px;background:var(--gold)}
.galx-act__head:not(.galx-act__head--center) .galx-act__num::before{display:none}
.galx-act__title{
  font-family:var(--font-display);font-weight:600;letter-spacing:-.01em;
  font-size:clamp(2.25rem,5vw,4.5rem);line-height:1;color:var(--burgundy);
  margin-bottom:var(--s-5);
}
.galx-act__title em{
  font-style:italic;font-weight:500;color:transparent;
  background:linear-gradient(120deg,var(--gold),#C07C28,var(--gold));
  -webkit-background-clip:text;background-clip:text;background-size:200% 100%;
  animation:shimmer 6s linear infinite;
}
.galx-act__lead{color:rgba(20,20,19,.72);max-width:56ch;line-height:1.75;font-size:1rem}

/* ─── ACT I · LE REPAS (editorial atlas grid) ─── */
#act-food{background:var(--cream);position:relative}
#act-food::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 20% 0%, rgba(221,154,63,.10), transparent 55%);
}
.galx-atlas{
  position:relative;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:200px;
  gap:16px;max-width:var(--maxw);margin:0 auto;
}
.atlas{
  position:relative;overflow:hidden;margin:0;background:#fff;
  border:1px solid rgba(75,10,10,.12);
  box-shadow:0 4px 16px rgba(75,10,10,.06);
  transition:transform .6s var(--e-out), box-shadow .5s, border-color .4s;
}
.atlas img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.3s var(--e-out), filter .6s;
  filter:saturate(1.05) contrast(1.04);
}
.atlas:hover{transform:translateY(-6px);box-shadow:0 30px 60px rgba(75,10,10,.18);border-color:var(--gold)}
.atlas:hover img{transform:scale(1.06);filter:saturate(1.15) contrast(1.08)}
.atlas__num{
  position:absolute;top:14px;left:16px;z-index:2;pointer-events:none;
  font-family:var(--font-display);font-style:italic;color:var(--cream);
  font-size:1.35rem;font-weight:500;letter-spacing:.02em;
  text-shadow:0 2px 10px rgba(0,0,0,.55);
}
.atlas__label{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px 20px;
  background:linear-gradient(180deg,transparent 0%,rgba(53,6,10,.82) 100%);
  color:var(--cream);
  transform:translateY(100%);opacity:0;transition:transform .5s var(--e-out), opacity .3s;
}
.atlas:hover .atlas__label{transform:translateY(0);opacity:1}
.atlas__label span{
  display:block;color:var(--gold);font-family:var(--font-display);
  font-style:italic;font-size:.95rem;letter-spacing:.04em;
}
.atlas__label strong{
  display:block;font-family:var(--font-display);font-weight:500;font-size:1.1rem;
  margin-top:2px;letter-spacing:.01em;
}
.atlas--a{grid-column:span 7;grid-row:span 2}
.atlas--b{grid-column:span 5;grid-row:span 1}
.atlas--c{grid-column:span 5;grid-row:span 1}
.atlas--d{grid-column:span 4;grid-row:span 1}
.atlas--e{grid-column:span 4;grid-row:span 1}
.atlas--f{grid-column:span 4;grid-row:span 1}
.atlas--g{grid-column:span 8;grid-row:span 2}
.atlas--h{grid-column:span 4;grid-row:span 1}
.atlas--i{grid-column:span 4;grid-row:span 1}
.atlas--j{grid-column:span 12;grid-row:span 1}
@media (max-width:960px){
  .galx-atlas{grid-template-columns:repeat(6,1fr);grid-auto-rows:170px}
  .atlas--a{grid-column:span 6;grid-row:span 2}
  .atlas--b,.atlas--c{grid-column:span 3;grid-row:span 1}
  .atlas--d,.atlas--e,.atlas--f{grid-column:span 2;grid-row:span 1}
  .atlas--g{grid-column:span 6;grid-row:span 2}
  .atlas--h,.atlas--i{grid-column:span 3;grid-row:span 1}
  .atlas--j{grid-column:span 6;grid-row:span 1}
}
@media (max-width:560px){
  /* ── Chapter 1 mobile: scrapbook — polaroid frames, varied widths, gentle rotations,
        italic gold numbers escape the frame; captions flow underneath like museum labels. ── */
  .galx-atlas{
    display:flex; flex-direction:column;
    gap:var(--s-7);
    grid-template-columns:none; grid-auto-rows:auto;
    max-width:100%;
    padding-block:var(--s-3);
  }
  .atlas{
    position:relative;
    width:var(--w, 100%);
    align-self:var(--align, stretch);
    background:#fffaf0;        /* warm paper, slightly warmer than --cream */
    padding:8px;               /* polaroid frame */
    border:1px solid rgba(221,154,63,.28);
    border-radius:4px;
    overflow:visible;          /* let the gold number escape */
    aspect-ratio:auto;
    grid-row:auto; grid-column:auto;
    transform:rotate(var(--rot, 0deg));
    box-shadow:
      0 28px 50px -22px rgba(75,10,10,.32),
      0 6px 18px -6px rgba(75,10,10,.18);
    transition:transform .6s var(--e-out), box-shadow .5s, border-color .4s;
  }
  .atlas img{
    width:100%; height:auto;
    object-fit:cover; display:block;
    aspect-ratio:4/5;
    border-radius:0;
    filter:saturate(1.05) contrast(1.04);
  }
  /* heroes a / g get a wider cinematic ratio; finale j is letterbox 16:9 */
  .atlas--a img, .atlas--g img{aspect-ratio:16/11}
  .atlas--j img{aspect-ratio:16/9}

  /* per-tile width / alignment / handcrafted rotation */
  .atlas--a{--w:100%; --align:stretch;    --rot:0deg}
  .atlas--b{--w:86%;  --align:flex-end;   --rot:-1.4deg}
  .atlas--c{--w:78%;  --align:flex-start; --rot:1.6deg}
  .atlas--d{--w:94%;  --align:center;     --rot:-.5deg}
  .atlas--e{--w:74%;  --align:flex-end;   --rot:1.2deg}
  .atlas--f{--w:88%;  --align:flex-start; --rot:-1deg}
  .atlas--g{--w:100%; --align:stretch;    --rot:0deg}
  .atlas--h{--w:82%;  --align:flex-end;   --rot:1deg}
  .atlas--i{--w:74%;  --align:flex-start; --rot:-1.4deg}
  .atlas--j{--w:100%; --align:stretch;    --rot:0deg}

  /* italic gold drop-cap number, escapes the polaroid edge */
  .atlas__num{
    position:absolute;
    font-family:var(--font-display);
    font-style:italic; font-weight:500;
    font-size:clamp(2.4rem, 12vw, 3.6rem);
    color:var(--gold);
    line-height:.9; letter-spacing:-.02em;
    text-shadow:
      0 4px 18px rgba(75,10,10,.4),
      0 0 28px rgba(255,246,233,.55);
    z-index:3;
  }
  /* alternate corners for visual rhythm */
  .atlas--a .atlas__num,
  .atlas--c .atlas__num,
  .atlas--e .atlas__num,
  .atlas--g .atlas__num,
  .atlas--i .atlas__num{top:-14px; left:-4px; right:auto; bottom:auto}
  .atlas--b .atlas__num,
  .atlas--d .atlas__num,
  .atlas--f .atlas__num,
  .atlas--h .atlas__num,
  .atlas--j .atlas__num{bottom:-16px; right:-4px; top:auto; left:auto}

  /* label drops into normal flow, beneath the photo, museum-label style */
  .atlas__label{
    position:static;
    background:transparent;
    padding:10px 4px 0;
    text-align:left;
    transform:none; opacity:1;
    color:var(--ink);
  }
  .atlas__label::before{
    content:""; display:block;
    width:30px; height:1px; background:var(--gold);
    margin-bottom:7px; opacity:.7;
  }
  .atlas__label span{
    color:rgba(75,10,10,.55);
    font-style:normal; font-family:var(--font-body); font-weight:600;
    font-size:.62rem; letter-spacing:.26em; text-transform:uppercase;
    display:block;
  }
  .atlas__label strong{
    color:var(--burgundy); font-weight:500; font-style:italic;
    font-size:1.05rem; margin-top:3px; display:block;
    line-height:1.25;
  }

  /* rotation-aware reveal animation — overrides .reveal default inUp so rotation persists */
  .atlas.reveal{opacity:0;transform:translateY(36px) rotate(var(--rot, 0deg))}
  @keyframes mAtlasIn{
    from{opacity:0;transform:translateY(36px) rotate(var(--rot, 0deg))}
    to  {opacity:1;transform:translateY(0)    rotate(var(--rot, 0deg))}
  }
  .atlas.reveal.in{animation:mAtlasIn 1.1s var(--e-dramatic) forwards}

  /* neutralize desktop hover-lift; rotation stays in place */
  .atlas:hover{transform:rotate(var(--rot, 0deg))}
  .atlas:hover img{transform:none;filter:saturate(1.05) contrast(1.04)}
}

/* ─── ACT II · LA SALLE IN FOUR HOURS ─── */
#act-room{
  background:linear-gradient(180deg,var(--cream) 0%,#F9E9C9 100%);
  position:relative;padding-block:var(--s-10);
}
/* Asymmetric mosaic styled like the homepage "Come linger with us" gallery —
   4 cards in a pinwheel pattern with mixed spans (BIG hero + square + tall +
   wide), gold-wipe reveal via clip-path, dark gradient overlay on hover, gold
   inset frame, roman-numeral marker top-left, refined caption-meta fades up.  */
.galx-hours{
  max-width:1180px;margin:0 auto;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:120px;
  gap:var(--s-4);
  position:relative;
  counter-reset:hour-num;
}

.hour{
  position:relative;margin:0;overflow:hidden;
  isolation:isolate;
  transition:transform .6s var(--e-dramatic), box-shadow .6s var(--e-out);
  box-shadow:
    0 18px 40px rgba(75,10,10,.12),
    inset 0 0 0 1px rgba(221,154,63,.18);
}
.hour:hover{
  transform:translateY(-3px);
  box-shadow:
    0 32px 70px rgba(75,10,10,.28),
    inset 0 0 0 1px rgba(221,154,63,.55);
}

.hour img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(1.05) brightness(.95);
  transition:transform 1.4s var(--e-dramatic), filter 1s;
  will-change:transform;
}
.hour:hover img{
  transform:scale(1.07);
  filter:saturate(1.15) brightness(1.02) contrast(1.04);
}

/* dark gradient overlay — sits between image and meta, intensifies on hover
   so the bottom caption stays legible without flat-dimming the whole photo */
.hour::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,
    transparent 30%,
    rgba(20,20,19,.35) 70%,
    rgba(20,20,19,.78) 100%);
  opacity:.65;
  transition:opacity .5s;
}
.hour:hover::after{opacity:1}

/* roman-numeral marker — top-left, gold italic, subtle */
.hour::before{
  counter-increment:hour-num;
  content:counter(hour-num, upper-roman);
  position:absolute;top:var(--s-3);left:var(--s-4);
  z-index:3;
  font-family:var(--font-display);font-style:italic;font-weight:400;
  font-size:1.05rem;letter-spacing:.1em;
  color:var(--gold);
  text-shadow:0 2px 14px rgba(0,0,0,.55);
  opacity:.86;
  transition:opacity .5s, transform .55s var(--e-out), letter-spacing .55s;
}
.hour:hover::before{opacity:1;transform:translateX(3px);letter-spacing:.16em}

/* meta block — pinned to the bottom of the tile, fades up + reveals gold rule */
.hour__meta{
  position:absolute;left:0;right:0;bottom:0;
  z-index:3;
  padding:var(--s-4) var(--s-5) calc(var(--s-4) + 2px);
  color:var(--cream);
  transform:translateY(6px);
  opacity:.92;
  transition:transform .55s var(--e-out), opacity .5s;
}
.hour:hover .hour__meta{transform:translateY(0);opacity:1}

/* thin gold underline draws across the bottom on hover */
.hour__meta::after{
  content:'';position:absolute;left:var(--s-5);right:var(--s-5);bottom:0;
  height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .9s var(--e-dramatic);
}
.hour:hover .hour__meta::after{transform:scaleX(1)}

.hour__time{
  display:block;font-family:var(--font-display);font-weight:500;
  font-size:clamp(1.15rem,1.7vw,1.55rem);line-height:1.1;
  color:var(--cream);letter-spacing:-.005em;
  margin-bottom:5px;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}
.hour__label{
  display:block;font-family:var(--font-display);font-style:italic;
  font-size:.86rem;line-height:1.4;
  color:rgba(255,246,233,.82);
  text-shadow:0 1px 10px rgba(0,0,0,.45);
}
.hour__label em{color:var(--gold);font-style:normal;font-weight:500;letter-spacing:.01em}

/* gold-wipe reveal — clip-path slides off from left to right.
   CSS-only auto-fire (animation-fill-mode:both) so the tiles always render
   even if the IntersectionObserver never adds `.in`. Staggered per tile. */
@keyframes mHourMosaicReveal{
  from{opacity:0;clip-path:inset(0 100% 0 0)}
  to  {opacity:1;clip-path:inset(0 0 0 0)}
}
.hour{animation:mHourMosaicReveal 1.4s var(--e-dramatic) both}
.hour:nth-child(1){animation-delay:.05s}
.hour:nth-child(2){animation-delay:.19s}
.hour:nth-child(3){animation-delay:.33s}
.hour:nth-child(4){animation-delay:.47s}

/* Pinwheel mosaic — 4 cards in mixed spans on a 6-col / 5-row grid */
.hour:nth-child(1){grid-column:span 4;grid-row:span 3}  /* BIG hero top-left */
.hour:nth-child(2){grid-column:span 2;grid-row:span 2}  /* square top-right */
.hour:nth-child(3){grid-column:span 2;grid-row:span 3}  /* tall right bottom */
.hour:nth-child(4){grid-column:span 4;grid-row:span 2}  /* wide bottom-left */

/* tablet — recompose to 4-col so the asymmetry still reads */
@media (max-width:900px){
  .galx-hours{
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:110px;
    gap:var(--s-3);
    max-width:780px;
  }
  .hour:nth-child(1){grid-column:span 4;grid-row:span 3}
  .hour:nth-child(2){grid-column:span 2;grid-row:span 2}
  .hour:nth-child(3){grid-column:span 2;grid-row:span 2}
  .hour:nth-child(4){grid-column:span 4;grid-row:span 2}
}
/* phone — single column, captions always visible */
@media (max-width:520px){
  .galx-hours{
    grid-template-columns:1fr;
    grid-auto-rows:auto;
    gap:var(--s-3);
    max-width:420px;
  }
  .hour:nth-child(1),.hour:nth-child(2),.hour:nth-child(3),.hour:nth-child(4){
    grid-column:1;grid-row:auto;aspect-ratio:4 / 3;
  }
  .hour__meta{transform:none;opacity:1}
  .hour::after{opacity:.9}
}

@media (prefers-reduced-motion:reduce){
  .hour,.hour:hover{transition:none;transform:none;animation:none;opacity:1;clip-path:none}
  .hour img,.hour:hover img{transition:none;transform:none}
  .hour::after{transition:none}
  .hour::before{transition:none}
  .hour:hover::before{transform:none;letter-spacing:.1em}
  .hour__meta{transition:none;transform:none;opacity:1}
  .hour__meta::after{transition:none}
  .hour:hover .hour__meta::after{transform:scaleX(1)}
}

/* ─── ACT III · DUAL FILM STRIP ─── */
#act-night{background:linear-gradient(180deg,#F9E9C9 0%,var(--cream) 50%,#F9E9C9 100%);padding-inline:0;overflow:hidden}
.galx-act--film .galx-act__head{padding-inline:var(--pad-x)}
.galx-film{position:relative;display:flex;flex-direction:column;gap:22px;padding:30px 0}
.galx-film__edge{position:absolute;top:0;bottom:0;width:120px;z-index:3;pointer-events:none}
.galx-film__edge--left{left:0;background:linear-gradient(90deg,var(--cream) 0%,transparent 100%)}
.galx-film__edge--right{right:0;background:linear-gradient(270deg,var(--cream) 0%,transparent 100%)}
.galx-film__row{
  display:flex;gap:22px;width:max-content;
  animation:filmRoll 85s linear infinite;
}
.galx-film__row--rtl{animation:filmRoll 95s linear infinite reverse}
.galx-film__row figure{
  margin:0;position:relative;flex-shrink:0;
  width:400px;height:280px;overflow:hidden;
  border:1px solid rgba(75,10,10,.15);
  box-shadow:0 16px 40px rgba(75,10,10,.14);
}
.galx-film__row figure img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--e-out);filter:saturate(1.02) brightness(.98)}
.galx-film__row figure:hover img{transform:scale(1.08);filter:saturate(1.15) brightness(1.04)}
@keyframes filmRoll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media (max-width:640px){
  .galx-film__row figure{width:260px;height:180px}
  .galx-film__edge{width:60px}
}

/* ─── ACT IV · CARNET DE MÉDINA (field-journal cards) ─── */
#act-medina{background:linear-gradient(180deg,#F9E9C9 0%,var(--cream) 100%);padding-bottom:var(--s-10)}
.galx-medina{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);
  max-width:1200px;margin:0 auto;
}
.mcard{
  margin:0;position:relative;background:#fff;padding:14px 14px 18px;
  box-shadow:0 14px 30px rgba(75,10,10,.12);
  border:1px solid rgba(75,10,10,.08);
  transition:transform .55s var(--e-out), box-shadow .5s, border-color .4s;
  cursor:pointer;
}
.mcard:hover{transform:translateY(-6px);box-shadow:0 26px 54px rgba(75,10,10,.22);border-color:var(--gold)}
.mcard__frame{position:relative;overflow:hidden;aspect-ratio:4/5;background:#f6efe0}
.mcard__frame::after{
  content:"";position:absolute;inset:0;border:1px solid rgba(221,154,63,.35);
  pointer-events:none;z-index:2;
}
.mcard__frame img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.3s var(--e-out), filter .6s;
  filter:saturate(1.04) contrast(1.03);
}
.mcard:hover .mcard__frame img{transform:scale(1.06);filter:saturate(1.15) contrast(1.08)}
.mcard figcaption{
  display:flex;align-items:baseline;gap:14px;padding:16px 4px 0;
  border-top:1px solid rgba(75,10,10,.08);margin-top:14px;
}
.mcard__num{
  font-family:var(--font-display);font-style:italic;color:var(--gold);
  font-size:1.5rem;font-weight:500;line-height:1;min-width:30px;
}
.mcard__label{
  flex:1;display:flex;flex-direction:column;gap:2px;
}
.mcard__label strong{
  display:block;font-family:var(--font-display);font-weight:500;color:var(--burgundy);
  font-size:1.05rem;letter-spacing:.01em;
}
.mcard__label span{
  font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;
  color:rgba(75,10,10,.55);font-weight:600;
}
@media (max-width:900px){
  .galx-medina{grid-template-columns:repeat(2,1fr);gap:var(--s-5)}
}
@media (max-width:560px){
  .galx-medina{grid-template-columns:1fr}
}

/* Act V removed — people/founder story belongs on Our Story page */

/* ─── CLOSING ─── */
.galx-closing{
  position:relative;background:var(--burgundy-deep);padding:0 0 var(--s-10);
  border-top:1px solid rgba(221,154,63,.25);
}
.galx-closing__marquee{
  overflow:hidden;padding:var(--s-6) 0;border-bottom:1px solid rgba(221,154,63,.2);
  mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent);
}
.galx-closing__track{
  display:flex;gap:var(--s-5);width:max-content;
  animation:filmRoll 40s linear infinite;font-family:var(--font-display);
  align-items:center;
}
.galx-closing__track span{
  font-size:clamp(1.75rem,3.5vw,3rem);font-style:italic;font-weight:500;
  color:var(--cream);white-space:nowrap;letter-spacing:-.01em;
}
.galx-closing__track em{color:var(--gold);font-size:2rem;font-style:normal}
.galx-closing__cta{
  max-width:640px;margin:var(--s-9) auto 0;text-align:center;padding:0 var(--pad-x);
}
.galx-closing__title{
  font-family:var(--font-display);font-weight:600;letter-spacing:-.01em;
  font-size:clamp(2.25rem,5vw,4rem);line-height:1.02;color:var(--cream);margin:var(--s-4) 0 var(--s-5);
}
.galx-closing__title em{
  font-style:italic;font-weight:500;color:transparent;
  background:linear-gradient(120deg,var(--gold),#F0D58C,var(--gold));
  -webkit-background-clip:text;background-clip:text;background-size:200% 100%;
  animation:shimmer 6s linear infinite;
}
.galx-closing__cta p{color:rgba(255,246,233,.78);margin-bottom:var(--s-6);line-height:1.7}
.galx-closing__btns{display:flex;gap:var(--s-4);flex-wrap:wrap;justify-content:center}

/* ─── LIGHTBOX ─── */
.galx-lb{
  position:fixed;inset:0;z-index:200;background:rgba(5,5,4,.96);
  display:none;align-items:center;justify-content:center;
  padding:var(--s-5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.galx-lb.open{display:flex;animation:fadeIn .3s ease both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.galx-lb__img{
  max-width:92vw;max-height:86vh;object-fit:contain;
  border:1px solid rgba(221,154,63,.3);box-shadow:0 40px 100px rgba(0,0,0,.7);
}
.galx-lb__close,.galx-lb__prev,.galx-lb__next{
  position:absolute;background:transparent;border:1px solid rgba(221,154,63,.35);
  color:var(--cream);width:52px;height:52px;border-radius:50%;cursor:pointer;
  font-size:1.8rem;font-family:var(--font-display);line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .25s, border-color .25s, transform .25s;
}
.galx-lb__close{top:20px;right:20px}
.galx-lb__prev{left:max(20px,3vw);top:50%;transform:translateY(-50%)}
.galx-lb__next{right:max(20px,3vw);top:50%;transform:translateY(-50%)}
.galx-lb__close:hover,.galx-lb__prev:hover,.galx-lb__next:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.galx-lb__prev:hover,.galx-lb__next:hover{transform:translateY(-50%) scale(1.08)}
.galx-lb__counter{
  position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  font-family:var(--font-display);font-style:italic;color:var(--gold);
  font-size:1rem;letter-spacing:.1em;
}
@media (max-width:640px){
  .galx-lb__prev,.galx-lb__next{width:44px;height:44px;font-size:1.4rem}
}

/* ═══════════════════════════════════════════════════════════
   BLOG / JOURNAL PAGE  (body[data-page="blog"])
   ═══════════════════════════════════════════════════════════ */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.btn-link{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-body);font-weight:600;font-size:var(--text-small);
  letter-spacing:.18em;text-transform:uppercase;color:var(--burgundy);
  border-bottom:1px solid var(--gold);padding-bottom:6px;transition:color .25s, gap .3s var(--e-dramatic), border-color .25s;
}
.btn-link:hover{color:var(--gold);gap:.9rem;border-color:var(--burgundy)}

.blog-page{background:var(--cream)}

/* Hero meta strip (sits in page-hero) */
.blog-hero__meta{
  margin-top:var(--s-6);display:flex;gap:var(--s-5);align-items:center;flex-wrap:wrap;
  font-size:var(--text-small);letter-spacing:.22em;text-transform:uppercase;
  color:rgba(255,246,233,.7);
}
.blog-hero__meta strong{color:var(--gold);font-weight:700;letter-spacing:.05em;font-family:var(--font-display);font-size:1.05rem}
.blog-hero__meta em{width:24px;height:1px;background:rgba(221,154,63,.45)}

/* Featured article — editorial split */
.blog-featured{padding:var(--s-10) var(--pad-x);background:var(--cream)}
.blog-featured__inner{
  max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:1.05fr .95fr;gap:var(--s-9);align-items:center;
}
.blog-featured__media{position:relative;aspect-ratio:5/6;overflow:hidden;box-shadow:0 40px 120px -30px rgba(75,10,10,.4)}
.blog-featured__media a{display:block;width:100%;height:100%;position:relative}
.blog-featured__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--e-dramatic);filter:saturate(1.05)}
.blog-featured__media:hover img{transform:scale(1.04)}
.blog-featured__media::before{
  content:"";position:absolute;inset:-14px;border:1px solid var(--gold);z-index:-1;
  transform:translate(18px,18px);transition:transform .6s var(--e-dramatic);
}
.blog-featured__media:hover::before{transform:translate(10px,10px)}
.blog-featured__badge{
  position:absolute;top:var(--s-5);left:var(--s-5);background:var(--burgundy);color:var(--cream);
  padding:8px 14px;font-size:var(--tag);letter-spacing:.28em;text-transform:uppercase;font-weight:600;
  border:1px solid var(--gold);
}
.blog-featured__body{padding-right:var(--s-5)}
.blog-featured__title{
  font-family:var(--font-display);font-weight:700;color:var(--burgundy);
  font-size:clamp(2rem,3.6vw,2.875rem);line-height:1.08;letter-spacing:-.005em;
  margin:var(--s-4) 0 var(--s-5);max-width:22ch;
}
.blog-featured__excerpt{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.65;color:rgba(20,20,19,.78);
  max-width:54ch;margin-bottom:var(--s-7);
}
.blog-featured__byline{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);flex-wrap:wrap}
.byline{display:flex;align-items:center;gap:var(--s-4)}
.byline__avatar{
  width:44px;height:44px;border-radius:50%;background:var(--offwhite) center/cover no-repeat;
  filter:sepia(.35);border:1px solid var(--gold);
}
.byline__name{font-family:var(--font-display);font-weight:600;font-size:1.0625rem;color:var(--burgundy);line-height:1.2}
.byline__meta{font-size:var(--text-small);color:rgba(20,20,19,.55);letter-spacing:.05em;margin-top:2px}

@media (max-width:900px){
  .blog-featured{padding:var(--s-9) var(--pad-x)}
  .blog-featured__inner{grid-template-columns:1fr;gap:var(--s-7)}
  .blog-featured__body{padding-right:0}
  .blog-featured__media{aspect-ratio:4/5}
}

/* Sticky filters */
.blog-filters{
  position:sticky;top:var(--nav-h);z-index:20;
  background:rgba(255,246,233,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid rgba(75,10,10,.08);border-bottom:1px solid rgba(75,10,10,.08);
}
.blog-filters__inner{
  max-width:var(--maxw);margin:0 auto;padding:var(--s-4) var(--pad-x);
  display:flex;align-items:center;gap:var(--s-5);flex-wrap:wrap;
}
.blog-filters__label{
  font-size:var(--tag);letter-spacing:.3em;text-transform:uppercase;color:var(--burgundy);font-weight:600;
}
.blog-filters__chips{display:flex;gap:8px;flex-wrap:wrap;flex:1;min-width:0}
.chip{
  font-family:var(--font-body);font-size:var(--text-small);font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink);
  padding:8px 16px;border:1px solid rgba(75,10,10,.18);border-radius:999px;
  background:transparent;cursor:pointer;transition:all .25s var(--e-dramatic);white-space:nowrap;
}
.chip:hover{border-color:var(--burgundy);color:var(--burgundy)}
.chip.is-active{background:var(--burgundy);color:var(--cream);border-color:var(--burgundy)}
.blog-filters__count{font-size:var(--text-small);color:rgba(20,20,19,.55);letter-spacing:.05em;font-style:italic}
.blog-filters__count strong,.blog-filters__count [data-count]{font-family:var(--font-display);color:var(--gold);font-style:normal;font-weight:700}

@media (max-width:720px){
  .blog-filters__inner{padding:var(--s-3) var(--pad-x);gap:var(--s-3)}
  .blog-filters__chips{order:3;flex-basis:100%;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;padding-bottom:4px}
  .blog-filters__chips::-webkit-scrollbar{display:none}
  .blog-filters__count{margin-left:auto}
}

/* Cards grid */
.blog-grid{padding-top:var(--s-9)}
.blog-grid .section__title{margin-top:var(--s-3)}
.blog-cards{
  margin-top:var(--s-8);
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-7) var(--s-6);
}
.bcard{
  display:flex;flex-direction:column;background:var(--cream);
  transition:transform .5s var(--e-dramatic);
}
.bcard.hide{display:none}
.bcard__media{
  display:block;position:relative;aspect-ratio:4/5;overflow:hidden;
  background:var(--offwhite);
}
.bcard__media img{
  width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--e-dramatic), filter .6s;
  filter:saturate(1.02);
}
.bcard__media::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,20,19,.35) 100%);
  opacity:.7;transition:opacity .5s;
}
.bcard:hover .bcard__media img{transform:scale(1.06)}
.bcard:hover .bcard__media::after{opacity:.4}
.bcard__body{padding:var(--s-5) 0 0}
.bcard__cat{
  display:inline-block;font-size:var(--tag);letter-spacing:.28em;text-transform:uppercase;
  font-weight:600;color:var(--gold);margin-bottom:var(--s-3);
}
.bcard__title{
  font-family:var(--font-display);font-weight:700;color:var(--burgundy);
  font-size:clamp(1.25rem,1.7vw,1.5rem);line-height:1.18;letter-spacing:-.005em;margin-bottom:var(--s-3);
}
.bcard__title a{display:inline;background-image:linear-gradient(var(--gold),var(--gold));background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .5s var(--e-dramatic),color .25s}
.bcard:hover .bcard__title a{background-size:100% 1px;color:var(--burgundy-deep)}
.bcard__excerpt{
  font-size:var(--text-body);line-height:1.65;color:rgba(20,20,19,.7);margin-bottom:var(--s-4);
  max-width:42ch;
}
.bcard__meta{
  display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);
  font-size:var(--text-small);color:rgba(20,20,19,.5);letter-spacing:.06em;
  padding-top:var(--s-3);border-top:1px solid rgba(75,10,10,.08);
}
.bcard__meta span:first-child{font-family:var(--font-display);font-style:italic;font-size:.95rem;color:var(--burgundy)}

.blog-empty{
  margin:var(--s-8) auto 0;text-align:center;font-family:var(--font-display);font-style:italic;
  font-size:1.25rem;color:rgba(20,20,19,.55);
}
.blog-grid__more{margin-top:var(--s-9);display:flex;justify-content:center}
.blog-grid__more .btn--ghost{color:var(--burgundy);border-color:rgba(75,10,10,.3)}
.blog-grid__more .btn--ghost:hover{color:var(--gold);border-color:var(--gold)}
.blog-grid__more .btn[disabled]{opacity:.55;cursor:not-allowed}

@media (max-width:1024px){
  .blog-cards{grid-template-columns:repeat(2,1fr);gap:var(--s-7) var(--s-5)}
}
@media (max-width:640px){
  .blog-cards{grid-template-columns:1fr;gap:var(--s-7)}
  .bcard__media{aspect-ratio:5/4}
}

/* Newsletter / "letter" CTA */
.blog-letter{
  padding:var(--s-10) var(--pad-x);
  background:var(--burgundy);color:var(--cream);position:relative;overflow:hidden;
  /* isolation:isolate prevents footer's mix-blend-mode from bleeding into this section */
  isolation:isolate;
}
.blog-letter::after{
  content:"";position:absolute;left:50%;top:0;width:1px;height:48px;background:var(--gold);transform:translateX(-50%);z-index:0;
}
.blog-letter__inner{
  max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s-9);align-items:center;
  position:relative;
}
.blog-letter__text .eyebrow{color:var(--gold)}
.blog-letter__text .eyebrow::before{background:var(--gold)}
.blog-letter__title{
  font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,4vw,3rem);
  line-height:1.05;color:var(--cream);margin:var(--s-4) 0 var(--s-5);max-width:18ch;
}
.blog-letter__title em{font-style:italic;font-weight:500;color:var(--gold)}
.blog-letter__text p{color:rgba(255,246,233,.78);max-width:54ch;font-size:1.0625rem;line-height:1.7}
.blog-letter__form{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.blog-letter__form input{
  flex:1;min-width:240px;padding:16px 18px;background:transparent;color:var(--cream);
  border:1px solid rgba(255,246,233,.35);font-family:var(--font-body);font-size:1rem;letter-spacing:.02em;
  transition:border-color .25s, background .25s;outline:none;
}
.blog-letter__form input::placeholder{color:rgba(255,246,233,.45)}
.blog-letter__form input:focus{border-color:var(--gold);background:rgba(255,246,233,.04)}
.blog-letter__form .btn{padding:16px 26px}
.blog-letter__fine{
  flex-basis:100%;font-size:var(--text-small);color:rgba(255,246,233,.55);
  letter-spacing:.05em;margin-top:4px;
}
@media (max-width:900px){
  .blog-letter{padding:var(--s-9) var(--pad-x)}
  .blog-letter__inner{grid-template-columns:1fr;gap:var(--s-6)}
}

/* ═══════════════════════════════════════════════════════════
   BLOG POST / ARTICLE PAGE  (body[data-page="blog-post"])
   ═══════════════════════════════════════════════════════════ */
.post-page{background:var(--cream)}

/* Hero */
.post-hero{
  position:relative;min-height:60vh;
  padding:calc(var(--nav-h) + var(--s-8)) var(--pad-x) var(--s-8);
  display:flex;align-items:flex-end;isolation:isolate;overflow:hidden;
  background:var(--burgundy-deep);color:var(--cream);
}
.post-hero__bg{
  position:absolute;inset:-6%;z-index:-2;background-size:cover;background-position:center;
  filter:brightness(.38) saturate(1.1);transform:scale(1.06);
  animation:kenBurns 22s ease-in-out infinite alternate;
}
.post-hero__overlay{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,20,19,.35) 0%,rgba(20,20,19,.55) 50%,rgba(20,20,19,.9) 100%);
}
.post-hero__inner{max-width:780px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:var(--s-4)}
.post-crumb{
  font-size:var(--tag);letter-spacing:.32em;text-transform:uppercase;color:var(--gold);
  display:inline-flex;align-items:center;gap:var(--s-3);font-weight:600;
}
.post-crumb a{color:var(--gold);border-bottom:1px solid transparent;transition:border-color .2s}
.post-crumb a:hover{border-color:var(--gold)}
.post-crumb span[aria-hidden]{opacity:.5}
.post-hero__title{
  font-family:var(--font-display);font-weight:700;color:var(--cream);
  font-size:clamp(2rem,4.5vw,3.5rem);line-height:1.1;letter-spacing:-.01em;
  max-width:22ch;
}
.post-hero__title em{
  font-style:italic;font-weight:500;
  background:linear-gradient(120deg,var(--gold) 0%,var(--sand) 50%,var(--gold) 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 6s linear infinite;
}
.post-hero__deck{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.6;color:rgba(255,246,233,.8);
  max-width:58ch;
}
.post-hero__meta{
  margin-top:var(--s-4);display:flex;flex-wrap:wrap;gap:var(--s-5);align-items:center;justify-content:space-between;
  border-top:1px solid rgba(221,154,63,.25);padding-top:var(--s-4);
}
.post-hero__meta .byline__name{color:var(--cream)}
.post-hero__meta .byline__meta{color:rgba(255,246,233,.6)}
.post-hero__tags{display:flex;flex-wrap:wrap;gap:6px}
.post-tag{
  font-size:var(--tag);letter-spacing:.22em;text-transform:uppercase;font-weight:600;
  color:var(--gold);padding:5px 10px;border:1px solid rgba(221,154,63,.35);border-radius:999px;
  font-size:.65rem;
}

/* Article body */
.post{padding:var(--s-9) var(--pad-x);background:var(--cream)}
.post__shell{max-width:680px;margin:0 auto;color:var(--ink)}
.post__shell > p,
.post__shell > h2,
.post__shell > h3,
.post__shell > blockquote,
.post__shell > figure,
.post__shell > hr,
.post__shell > aside,
.post__shell > .post__foot{margin-bottom:var(--s-6)}
.post__shell > p{
  font-family:var(--font-body);font-weight:400;
  font-size:clamp(1rem,1.2vw,1.0625rem);line-height:1.85;color:rgba(20,20,19,.82);
  letter-spacing:.008em;
}
.post__shell h2{
  font-family:var(--font-display);font-weight:700;color:var(--burgundy);
  font-size:clamp(1.5rem,2.4vw,1.875rem);line-height:1.15;letter-spacing:-.005em;
  margin-top:var(--s-8);max-width:24ch;
}
.post__shell h2::before{
  content:"";display:block;width:32px;height:1px;background:var(--gold);margin-bottom:var(--s-3);
}

/* Lead paragraph + drop cap */
.post__lead{font-size:clamp(1.0625rem,1.4vw,1.1875rem)!important;color:var(--ink)!important;line-height:1.75!important}
.dropcap{
  float:left;font-family:var(--font-display);font-weight:700;color:var(--burgundy);
  font-size:4.5rem;line-height:.82;padding:.35rem .55rem 0 0;
}

/* Inline figures */
.post__figure{
  margin:var(--s-6) 0;display:flex;flex-direction:column;gap:var(--s-2);
  align-items:center;
}
.post__figure img{
  width:100%;max-height:420px;object-fit:cover;display:block;
  background:var(--offwhite);border-radius:6px;
  box-shadow:0 8px 30px -8px rgba(75,10,10,.12);
}
.post__figure figcaption{
  font-family:var(--font-display);font-style:italic;font-size:.9rem;color:rgba(20,20,19,.55);
  line-height:1.5;max-width:52ch;text-align:center;padding-top:var(--s-1);
}
/* Wide figure breaks the prose column slightly for emphasis */
.post__figure--wide{
  margin-left:calc(50% - min(430px, 42vw));
  margin-right:calc(50% - min(430px, 42vw));
  max-width:none;align-items:center;
}
.post__figure--wide img{
  max-width:860px;width:100%;max-height:480px;object-fit:cover;
  border-radius:8px;
  box-shadow:0 20px 60px -15px rgba(75,10,10,.2);
}
.post__figure--wide figcaption{padding:0 var(--pad-x);text-align:center}

/* Pull quote */
.post__pull{
  margin:var(--s-7) 0;padding:var(--s-5) var(--s-6);border-left:2px solid var(--gold);
  background:linear-gradient(180deg,rgba(255,246,233,.5) 0%,rgba(249,232,208,.35) 100%);
  position:relative;border-radius:0 6px 6px 0;
}
.post__pull::before{
  content:"\201C";font-family:var(--font-display);font-style:italic;
  font-size:4rem;line-height:1;color:var(--gold);opacity:.3;
  position:absolute;top:4px;left:10px;
}
.post__pull p{
  font-family:var(--font-display);font-style:italic;font-weight:600;
  font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.4;color:var(--burgundy);
  margin:0 0 var(--s-2);position:relative;
}
.post__pull cite{
  font-family:var(--font-body);font-style:normal;font-size:var(--text-small);
  letter-spacing:.16em;text-transform:uppercase;color:rgba(20,20,19,.5);font-weight:600;
}

/* Decorative rule */
.post__rule{
  border:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--gold) 50%,transparent 100%);
  margin:var(--s-8) auto;width:100px;opacity:.6;
}

/* Author card */
.post__author{
  display:grid;grid-template-columns:auto 1fr;gap:var(--s-4);align-items:flex-start;
  padding:var(--s-5);background:var(--offwhite);border-left:2px solid var(--gold);
  border-radius:0 8px 8px 0;
}
.post__author-avatar{
  width:68px;height:68px;border-radius:50%;background:var(--cream) center/cover no-repeat;
  filter:sepia(.3);border:1px solid var(--gold);
}
.post__author-name{
  font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:var(--burgundy);
  margin-bottom:4px;
}
.post__author-bio{
  font-size:var(--text-body);line-height:1.7;color:rgba(20,20,19,.68);max-width:52ch;
}

/* Foot — back link + share */
.post__foot{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s-4);
  padding-top:var(--s-5);border-top:1px solid rgba(75,10,10,.1);margin-top:var(--s-7);
}
.post__share{
  display:flex;align-items:center;gap:var(--s-3);font-size:var(--text-small);
  letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:rgba(20,20,19,.45);
}
.post__share a{color:var(--burgundy);border-bottom:1px solid transparent;transition:color .2s,border-color .2s;padding-bottom:2px}
.post__share a:hover{color:var(--gold);border-color:var(--gold)}
.post__share em{width:14px;height:1px;background:rgba(75,10,10,.15);display:inline-block}

@media (max-width:720px){
  .post-hero{min-height:55vh;padding:calc(var(--nav-h) + var(--s-6)) var(--pad-x) var(--s-6)}
  .post-hero__meta{flex-direction:column;align-items:flex-start;gap:var(--s-4)}
  .post{padding:var(--s-8) var(--pad-x)}
  .post__shell h2{margin-top:var(--s-6)}
  .post__pull{padding:var(--s-4)}
  .post__figure--wide{margin-left:0;margin-right:0}
  .post__figure--wide img{max-width:100%;max-height:360px}
  .post__figure--wide figcaption{padding:0;text-align:left}
  .post__figure img{max-height:320px}
  .post__author{grid-template-columns:1fr;text-align:left}
  .post__author-avatar{width:56px;height:56px}
  .dropcap{font-size:3.5rem}
}

/* Related & booking nudge */
.post-related{padding-top:var(--s-9);padding-bottom:var(--s-9)}
.post-cta{
  margin-top:var(--s-7);padding:var(--s-9) var(--pad-x);
  background:var(--burgundy);color:var(--cream);text-align:center;position:relative;overflow:hidden;
}
.post-cta__inner{max-width:680px;margin:0 auto;position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--s-4)}
.post-cta__inner .eyebrow{color:var(--gold);justify-content:center}
.post-cta__inner .eyebrow::before{background:var(--gold)}
.post-cta__title{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.1;color:var(--cream);max-width:22ch;
}
.post-cta__title em{font-style:italic;font-weight:500;color:var(--gold)}
.post-cta p{color:rgba(255,246,233,.78);max-width:50ch;font-size:1rem;line-height:1.7}
.post-cta .btn{margin-top:var(--s-4)}

/* ═══════════════════════════════════════════════════════════
   QUICK FACTS BAR  (home page — at-a-glance strip)
   ═══════════════════════════════════════════════════════════ */
.quick-facts{
  background:var(--burgundy-deep);color:var(--cream);
  padding:var(--s-5) var(--pad-x);
  border-bottom:1px solid rgba(221,154,63,.2);
}
.quick-facts__inner{
  max-width:var(--maxw);margin:0 auto;
  display:flex;flex-wrap:wrap;gap:var(--s-4) var(--s-8);
  align-items:center;
}
.qf-item{display:flex;align-items:baseline;gap:var(--s-3);font-size:var(--text-small);}
.qf-label{
  font-family:var(--font-body);font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);font-size:.68rem;white-space:nowrap;
}
.qf-val{color:rgba(255,246,233,.82);font-family:var(--font-body);}
@media(max-width:640px){
  .quick-facts__inner{flex-direction:column;gap:var(--s-4);}
  .qf-item{flex-direction:column;gap:var(--s-1);}
}

/* ═══════════════════════════════════════════════════════════
   FAQ SECTION  (home page — visible Q&A for AI citation)
   ═══════════════════════════════════════════════════════════ */
.faq-section{background:var(--cream);padding:var(--s-9) var(--pad-x);}
.faq-section__inner{
  max-width:780px;margin:0 auto;
  display:flex;flex-direction:column;gap:var(--s-6);
}
.faq-section__inner .eyebrow,.faq-section__inner .section__title{text-align:left;}
.faq-section__inner .section__title{margin-bottom:var(--s-2);}
.faq-section__list{display:flex;flex-direction:column;gap:var(--s-3);}
.faq-item{
  border:1px solid rgba(75,10,10,.15);border-radius:6px;
  overflow:hidden;background:var(--offwhite);
}
.faq-item__q{
  cursor:pointer;list-style:none;
  padding:var(--s-5) var(--s-6);
  font-family:var(--font-display);font-weight:600;font-size:var(--text-h3);
  color:var(--burgundy);line-height:1.3;
  display:flex;justify-content:space-between;align-items:center;gap:var(--s-4);
  transition:background .2s;
}
.faq-item__q::-webkit-details-marker{display:none;}
.faq-item__q::after{
  content:'↓';font-size:.9em;color:var(--gold);flex-shrink:0;
  transition:transform .25s var(--e-welcome);
}
.faq-item[open] .faq-item__q::after{transform:rotate(180deg);}
.faq-item[open] .faq-item__q{background:rgba(75,10,10,.04);}
.faq-item__a{
  padding:0 var(--s-6) var(--s-5);
  font-family:var(--font-body);font-size:var(--text-body);
  color:var(--ink);line-height:1.75;
}
@media(max-width:640px){
  .faq-item__q{padding:var(--s-4) var(--s-5);font-size:var(--text-body);}
  .faq-item__a{padding:0 var(--s-5) var(--s-4);}
}

/* Reservation hero — social proof bar */
.page-hero__proof{
  margin-top:var(--s-5);
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:var(--s-2) var(--s-3);
  font-family:var(--font-body);
  font-size:.875rem;letter-spacing:.02em;
  color:rgba(255,246,233,.88);
}
.page-hero__proof .sep{color:var(--gold);opacity:.7;}
@media(max-width:640px){
  .page-hero__proof{font-size:.8125rem;gap:var(--s-1) var(--s-3);}
}

/* Reservation — Quick answers block */
.booking-quick{
  max-width:640px;margin:0 auto var(--s-7);
  text-align:left;
  background:rgba(75,10,10,.03);
  border:1px solid rgba(75,10,10,.10);
  border-radius:8px;
  padding:var(--s-5) var(--s-6);
}
.booking-quick__title{
  font-family:var(--font-display);
  font-size:1.125rem;font-weight:600;
  color:var(--burgundy);
  margin:0 0 var(--s-4);
  letter-spacing:.02em;
}
.booking-quick__list{margin:0;display:flex;flex-direction:column;gap:var(--s-3);}
.booking-quick__row{
  display:grid;grid-template-columns:140px 1fr;gap:var(--s-4);
  padding-bottom:var(--s-3);
  border-bottom:1px solid rgba(75,10,10,.08);
}
.booking-quick__row:last-child{border-bottom:none;padding-bottom:0;}
.booking-quick__row dt{
  font-family:var(--font-display);
  font-weight:600;font-size:.9375rem;
  color:var(--burgundy);
  letter-spacing:.03em;
}
.booking-quick__row dd{
  margin:0;
  font-family:var(--font-body);font-size:.9375rem;
  color:var(--ink);line-height:1.6;
}
.booking-quick__row dd a{color:var(--gold);font-weight:500;text-decoration:underline;text-underline-offset:2px;}
@media(max-width:640px){
  .booking-quick{padding:var(--s-4) var(--s-5);}
  .booking-quick__row{grid-template-columns:1fr;gap:var(--s-1);}
  .booking-quick__row dt{font-size:.875rem;}
}

/* ───── 26. HOME TITLE HIERARCHY BALANCE ───── */
/* Tames headings that read as overpowering against their supporting copy.
   Scoped to selectors that only appear on the home page; ES/IT rules use the
   :root [lang] attribute set on each translated index.html. */

.hero__title{
  display:flex;flex-direction:column;align-items:center;
  font-size:clamp(2.2rem, 5.2vw, 4.4rem);
  font-weight:500;
  line-height:1.08;
  letter-spacing:-.005em;
  max-width:none;
  margin:0;
}
.hero__title .line{padding-bottom:.06em}
.hero__title-main{
  display:block;
  max-width:22ch;
  text-wrap:balance;
}
.hero__title-flourish{
  display:block;
  margin-top:.3em;
  max-width:38ch;
  font-family:var(--font-display);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.2rem, 2.5vw, 1.95rem);
  line-height:1.32;
  letter-spacing:.005em;
  text-wrap:balance;
  padding-bottom:0;
}
.hero__title-flourish em{
  font-style:italic;color:var(--gold);font-weight:500;
}
html[lang="fr"] .hero__title-flourish{
  font-size:clamp(1.1rem, 2.25vw, 1.7rem);
  max-width:42ch;
  letter-spacing:.002em;
}
html[lang="it"] .hero__title-flourish{
  font-size:clamp(1.15rem, 2.4vw, 1.85rem);
  max-width:40ch;
}
.hero__sub{
  max-width:46ch;
  font-size:clamp(.98rem, 1.25vw, 1.125rem);
  line-height:1.65;
  letter-spacing:.015em;
  text-wrap:pretty;
}
@media (max-width:600px){
  .hero__content{gap:var(--s-5)}
  .hero__title{
    font-size:clamp(1.65rem, 6.6vw, 2.2rem);
    line-height:1.16;
  }
  .hero__title-main{max-width:20ch}
  .hero__title-flourish{
    margin-top:.35em;
    font-size:clamp(.95rem, 3.8vw, 1.18rem);
    line-height:1.4;
    max-width:28ch;
  }
  /* FR / ES / IT mobile rebalance.
     Strategy: treat main + flourish as ONE composed statement.
     Main shrinks so it fits on a single line; flourish lifts to about 75%
     of main; both share the same horizontal axis (max-width). Italic em
     stays gold. The result reads as a two-line couplet, not a giant
     headline stacked on a small caption. Then a real gap to .hero__sub
     restores hierarchy with the paragraph below. */
  html[lang="fr"] .hero__title,
  html[lang="es"] .hero__title,
  html[lang="it"] .hero__title{
    font-size:clamp(1.4rem, 5.4vw, 1.75rem);
    line-height:1.18;
    font-weight:600;
    letter-spacing:-.005em;
    margin-bottom:var(--s-3);
  }
  html[lang="fr"] .hero__title-main,
  html[lang="es"] .hero__title-main,
  html[lang="it"] .hero__title-main{
    max-width:30ch;
    text-wrap:balance;
    padding-bottom:0;
  }
  html[lang="fr"] .hero__title-flourish,
  html[lang="es"] .hero__title-flourish,
  html[lang="it"] .hero__title-flourish{
    margin-top:.18em;
    font-size:clamp(1.05rem, 4.05vw, 1.3rem);
    line-height:1.28;
    max-width:30ch;
    font-weight:500;
    letter-spacing:.002em;
    text-wrap:balance;
    opacity:.96;
  }
  /* FR-only: the poetic flourish "Ici, on sert quatre-vingts ans de cuisine."
     is 42 chars — at the shared size it spills onto a 3rd line. Shrink it
     and widen the line so it lands as a single line on ≥360px phones,
     gracefully balancing onto 2 lines only on the smallest devices. */
  html[lang="fr"] .hero__title-flourish{
    font-size:clamp(.88rem, 3.55vw, 1.05rem);
    line-height:1.32;
    max-width:46ch;
    margin-top:.32em;
    letter-spacing:.005em;
  }
  /* IT-only: bump title scale by ~5% across main + flourish. */
  html[lang="it"] .hero__title{
    font-size:clamp(1.47rem, 5.67vw, 1.84rem);
  }
  html[lang="it"] .hero__title-flourish{
    font-size:clamp(1.1rem, 4.25vw, 1.37rem);
  }
  .hero__sub{
    max-width:34ch;
    font-size:.95rem;
    line-height:1.62;
    opacity:.88;
  }
}
@media (max-width:380px){
  html[lang="fr"] .hero__title,
  html[lang="es"] .hero__title,
  html[lang="it"] .hero__title{
    font-size:clamp(1.25rem, 5.7vw, 1.5rem);
  }
  html[lang="es"] .hero__title-flourish,
  html[lang="it"] .hero__title-flourish{
    font-size:clamp(1rem, 4.2vw, 1.15rem);
    max-width:28ch;
  }
  html[lang="fr"] .hero__title-flourish{
    font-size:clamp(.82rem, 3.7vw, .95rem);
    max-width:44ch;
    line-height:1.34;
  }
  html[lang="it"] .hero__title{
    font-size:clamp(1.31rem, 5.99vw, 1.58rem);
  }
  html[lang="it"] .hero__title-flourish{
    font-size:clamp(1.05rem, 4.4vw, 1.21rem);
  }
}

.welcome .section__title,
.dishes .section__title,
.testimonials .section__title,
.moments .section__title,
.gallery .section__title,
.faq-section .section__title{
  font-size:clamp(1.85rem, 3.4vw, 2.75rem);
  font-weight:700;
  line-height:1.12;
  max-width:22ch;
  text-wrap:balance;
}
.welcome .section__title{
  font-size:clamp(1.75rem, 3.2vw, 2.55rem);
  font-weight:600;
  line-height:1.16;
  letter-spacing:-.005em;
  max-width:20ch;
  margin-bottom:var(--s-3);
  text-wrap:balance;
}
@media (max-width:600px){
  .welcome .section__title{
    font-size:clamp(1.55rem, 6.4vw, 1.95rem);
    line-height:1.2;
    max-width:18ch;
  }
  .welcome__text p{
    font-size:clamp(1.05rem, 4vw, 1.2rem);
    line-height:1.55;
  }
}
.testimonials .section__title,
.moments .section__title,
.gallery .section__title{
  margin-inline:auto;
  text-align:center;
}
.faq-section .section__title{
  margin-inline:0;
  text-align:left;
}

html[lang="es"] .story__title,
html[lang="es"] .story .story__title{
  font-size:clamp(1.55rem, 3vw, 2.4rem);
  line-height:1.18;
  max-width:24ch;
}

html[lang="it"] .gallery .section__title,
html[lang="it"] .gallery .gallery__head .section__title{
  font-size:clamp(1.55rem, 3vw, 2.4rem);
  line-height:1.2;
  max-width:22ch;
}

/* ───── Consent banner (GDPR / Consent Mode v2) ───── */
#lvt-consent{
  position:fixed;
  left:50%;
  bottom:var(--s-4);
  transform:translateX(-50%);
  width:min(calc(100% - var(--s-5)), 720px);
  z-index:9999;
  background:var(--burgundy-deep);
  color:var(--cream);
  border:1px solid rgba(255,246,233,0.18);
  border-radius:14px;
  box-shadow:0 18px 48px rgba(0,0,0,0.42);
  font-family:var(--font-body);
  animation:lvt-consent-in .45s var(--e-welcome) both;
}
@keyframes lvt-consent-in{
  from{ opacity:0; transform:translate(-50%, 24px); }
  to  { opacity:1; transform:translate(-50%, 0); }
}
.lvt-consent--gone{
  opacity:0;
  transform:translate(-50%, 24px) !important;
  transition:opacity .3s ease, transform .3s ease;
}
.lvt-consent__inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-4);
  padding:var(--s-4) var(--s-5);
}
.lvt-consent__msg{
  flex:1 1 260px;
  margin:0;
  font-size:0.9rem;
  line-height:1.45;
  color:var(--cream);
}
.lvt-consent__msg a{
  color:var(--gold-hi);
  text-decoration:underline;
  text-underline-offset:2px;
}
.lvt-consent__msg a:hover{ color:var(--cream); }
.lvt-consent__btns{
  display:flex;
  gap:var(--s-2);
  flex:0 0 auto;
}
.lvt-consent__btn{
  appearance:none;
  border:1px solid transparent;
  border-radius:999px;
  padding:8px 18px;
  font:600 0.82rem/1 var(--font-body);
  letter-spacing:0.03em;
  cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.lvt-consent__btn--primary{
  background:var(--gold);
  color:var(--burgundy-deep);
}
.lvt-consent__btn--primary:hover{ background:var(--gold-hi); }
.lvt-consent__btn--ghost{
  background:transparent;
  color:var(--cream);
  border-color:rgba(255,246,233,0.4);
}
.lvt-consent__btn--ghost:hover{
  background:rgba(255,246,233,0.08);
  border-color:var(--cream);
}
.lvt-consent__btn:focus-visible{
  outline:2px solid var(--gold-hi);
  outline-offset:2px;
}
@media (max-width:520px){
  #lvt-consent{
    bottom:var(--s-3);
    width:calc(100% - var(--s-4));
    border-radius:12px;
  }
  .lvt-consent__inner{ padding:var(--s-3) var(--s-4); gap:var(--s-3); }
  .lvt-consent__btns{ width:100%; }
  .lvt-consent__btn{ flex:1 1 auto; }
}
@media (prefers-reduced-motion: reduce){
  #lvt-consent, .lvt-consent--gone{ animation:none; transition:none; }
}