/* Hallmark · macrostructure: Long Document (multi-page system) · genre: editorial
 * theme: custom (tuned) · vibe: "Alsatian warmth, half-timbered, family-run"
 * paper: oklch(96.5% 0.010 72) · accent: oklch(50% 0.115 58)
 * display: Cormorant Garamond 700 · body: Jost 400 (free Avenir Next substitute)
 * axes: light / classical-serif / warm-amber · studied: no · context: explicit
 * pre-emit critique: P5 H4 E4 S5 R4 V4 · contrast: 14/14 pass · v1.1.0
 * ------------------------------------------------------------------
 * Ritter'Hoft — Auberge & Restaurant, Morsbronn-les-Bains
 * Legacy token names below are ALIASED, not removed: 814 lines of existing
 * rules and 108 pages of inline styles depend on them. Do not delete.
 * ============================================================ */
:root{
  /* ---- Hallmark palette (OKLCH, all neutrals tinted warm) ---- */
  --color-white:       oklch(99.0% 0.004 75);
  --color-paper:       oklch(96.5% 0.010 72);
  --color-paper-2:     oklch(93.5% 0.014 72);
  --color-paper-3:     oklch(90.0% 0.016 72);
  --color-rule:        oklch(88.0% 0.014 72);
  --color-rule-2:      oklch(91.5% 0.012 72);

  --color-ink:         oklch(22.0% 0.012 60);
  --color-ink-2:       oklch(37.0% 0.012 60);
  --color-muted:       oklch(52.0% 0.012 62);

  /* accent = the brand taupe, deepened into a real accent band */
  --color-accent:      oklch(50.0% 0.115 58);
  --color-accent-deep: oklch(38.0% 0.095 55);
  --color-accent-brt:  oklch(93.0% 0.030 70);
  --color-accent-ink:  oklch(99.0% 0.004 75);
  --color-focus:       oklch(55.0% 0.170 58);

  /* taupe retained verbatim — it is the nav bar, and it earns its place */
  --color-taupe:       oklch(66.0% 0.041 62);
  --color-taupe-deep:  oklch(58.0% 0.042 60);
  --color-taupe-lift:  oklch(72.0% 0.036 62);   /* button hover */
  --color-taupe-nav:   oklch(60.5% 0.035 62);   /* .header.scrolled */

  /* timber = dark UI ground. Replaces the old "teal" (chroma 0.0026 = dead grey) */
  --color-timber:      #4A4C4C;   /* original brand charcoal — restored */
  --color-timber-700:  #3A3C3C;   /* original brand charcoal — restored */

  /* ---- Type ---- */
  --font-display: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --font-body:    "Jost", "Avenir Next", ui-sans-serif, "Segoe UI", sans-serif;
  --font-wordmark:"Cormorant Garamond", Georgia, serif;

  /* 1.25 major third, 17px base */
  --text-xs:   0.696rem;
  --text-sm:   0.87rem;
  --text-base: 1.0625rem;
  --text-md:   1.328rem;
  --text-lg:   1.66rem;
  --text-xl:   2.075rem;
  --text-2xl:  2.594rem;
  --text-3xl:  3.242rem;
  --text-display:   clamp(2.75rem, 5vw + 1rem, 5.25rem);
  --text-display-s: clamp(2.35rem, 4.5vw, 4.25rem);

  /* ---- 4pt spacing scale ---- */
  --space-3xs: 4px;  --space-2xs: 8px;  --space-xs:  12px;
  --space-sm:  16px; --space-md:  24px; --space-lg:  32px;
  --space-xl:  48px; --space-2xl: 72px; --space-3xl: 112px;

  /* ---- Motion: three named easings, never the browser default ---- */
  --ease-out:    cubic-bezier(.16, 1, .3, 1);
  --ease-in:     cubic-bezier(.7, 0, .84, 0);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-short: 200ms; --dur-mid: 320ms; --dur-long: 520ms;

  --radius:    4px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --shadow-sm: 0 1px 2px oklch(22% .012 60 / .05), 0 6px 18px oklch(22% .012 60 / .06);
  --shadow-md: 0 8px 24px oklch(22% .012 60 / .08), 0 24px 56px oklch(22% .012 60 / .10);
  --shadow-lg: 0 30px 70px oklch(22% .012 60 / .20);

  --maxw: 1320px;
  --gutter: clamp(20px, 5vw, 72px);
  --measure: 68ch;
  --cream:   var(--color-paper-2);   /* used by .soiree-etape */

  /* ================= LEGACY ALIASES — do not remove =================
     Every name below is referenced by existing rules or by inline
     style="" attributes across 108 pages. Re-pointed, never dropped. */
  --white:     var(--color-white);
  --paper:     var(--color-paper);
  --paper-2:   var(--color-paper-2);
  --ink:       var(--color-ink);
  --ink-soft:  var(--color-ink-2);
  --ink-faint: var(--color-muted);
  --line:      var(--color-rule);

  --teal:      var(--color-timber);
  --teal-700:  var(--color-timber-700);
  --teal-900:  var(--color-timber);      /* original: same as --teal */

  --taupe:       var(--color-taupe);
  --gold:        var(--color-accent);
  --gold-deep:   var(--color-accent-deep);
  --gold-bright: var(--color-accent-brt);
  --rouge:       var(--color-accent);
  --rouge-deep:  var(--color-accent-deep);

  --ease:  var(--ease-out);
  --serif: var(--font-display);
  --sans:  var(--font-body);
  --logo:  var(--font-wordmark);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:clip; }
body{
  margin:0;
  font-family:var(--font-body);
  font-weight:400;
  font-size:var(--text-base);
  line-height:1.7;
  color:var(--color-ink);
  background:var(--color-white);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-variant-numeric:oldstyle-nums;
  overflow-x:clip;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }

/* Display type: roman only. Italic headers are a reliable AI tell (gate 38a);
   italic survives solely as .accent emphasis inside running copy. */
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  font-style:normal;
  line-height:1.08;
  margin:0;
  letter-spacing:-.015em;
  text-wrap:balance;
  overflow-wrap:anywhere;
  min-width:0;
}
p{ margin:0; }

/* Focus is a first-class state: visible, high-contrast, never animated. */
:focus-visible{
  outline:2px solid var(--color-focus);
  outline-offset:3px;
  border-radius:2px;
  transition:none;
}

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(72px,9vw,128px); }

.eyebrow{
  display:inline-flex; align-items:center; gap:var(--space-xs);
  font-size:var(--text-xs); font-weight:600; letter-spacing:.26em;
  text-transform:uppercase; color:var(--color-accent-deep);
  font-variant-numeric:lining-nums;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--color-accent); }
.eyebrow.center{ justify-content:center; }
.eyebrow.center::after{ content:""; width:26px; height:1px; background:var(--color-accent); }
.eyebrow.light{ color:var(--color-accent-brt); }
.eyebrow.light::before,.eyebrow.light.center::after{ background:var(--color-accent-brt); }

.h2{ font-size:clamp(2.1rem,4.4vw,3.4rem); margin-top:var(--space-sm); }
.lede{
  font-size:clamp(1.04rem,1.4vw,1.18rem);
  color:var(--color-ink-2); font-weight:400; line-height:1.75;
  max-width:var(--measure);
}
.lede-center,.lead-center .lede{ margin-inline:auto; }
.accent{ font-style:italic; color:var(--color-accent-deep); font-weight:500; }
/* Gate 38a: italic survives as body-copy emphasis, never inside display type. */
h1 .accent,h2 .accent,h3 .accent,h4 .accent,.h2 .accent{ font-style:normal; color:var(--color-accent); }

/* ---- Button voice: squared, letterspaced, eight states ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2xs);
  font-family:var(--font-body);
  font-weight:500; font-size:var(--text-xs); letter-spacing:.2em;
  text-transform:uppercase;
  padding:var(--space-sm) var(--space-lg);
  border-radius:2px; border:1px solid transparent;
  min-height:48px; white-space:nowrap;
  transition:background var(--dur-short) var(--ease-out),
             color var(--dur-short) var(--ease-out),
             border-color var(--dur-short) var(--ease-out),
             box-shadow var(--dur-mid) var(--ease-out),
             transform var(--dur-mid) var(--ease-out);
}
.btn:active{ transform:translateY(1px); }
.btn[disabled],.btn[aria-disabled="true"]{
  opacity:.5; cursor:not-allowed; transform:none; box-shadow:none;
}
.btn[data-state="loading"]{ cursor:progress; opacity:.75; }

.btn-gold{ background:var(--color-taupe); color:var(--color-ink); }
.btn-gold:hover{ background:var(--color-taupe-lift); color:var(--color-ink); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-teal{ background:var(--color-timber); color:var(--color-accent-ink); }
.btn-teal:hover{ background:var(--color-timber-700); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-outline{ background:transparent; color:var(--color-ink); border-color:var(--color-rule); }
.btn-outline:hover{ border-color:var(--color-accent-deep); color:var(--color-accent-deep); transform:translateY(-2px); }
.btn-light{
  background:oklch(99% .004 75 / .18); color:var(--color-accent-ink);
  border-color:oklch(99% .004 75 / .85);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
}
.btn-light:hover{ background:oklch(99% .004 75 / .30); transform:translateY(-2px); }

.link-arrow{
  display:inline-flex; align-items:center; gap:var(--space-2xs);
  font-size:var(--text-xs); font-weight:500; letter-spacing:.14em;
  text-transform:uppercase; color:var(--color-accent-deep);
}
.link-arrow svg{ width:16px; height:16px; transition:transform var(--dur-mid) var(--ease-out); }
.link-arrow:hover svg{ transform:translateX(4px); }

/* icon divider */
.divider{ display:flex; align-items:center; justify-content:center; gap:var(--space-sm); color:var(--color-accent); }
.divider span{ height:1px; width:54px; background:var(--color-rule); }
.divider svg{ width:34px; height:34px; }

.skip-link{
  position:fixed; top:-64px; left:16px; z-index:200;
  background:var(--color-timber); color:var(--color-accent-ink);
  padding:13px 22px; border-radius:var(--radius);
  font-size:var(--text-sm); letter-spacing:.12em; text-transform:uppercase;
  transition:top var(--dur-mid) var(--ease-out); box-shadow:var(--shadow-md);
}
.skip-link:focus{ top:16px; }

/* ---- Landing-page gallery: exact-tiling mosaic ----
   7 tiles previously spanned 11 cells in a 4-col grid, leaving the whole
   bottom-right quadrant empty and stretching the last portrait to 414px.
   Spans below total exactly 12 cells = 4 cols x 3 rows, so it tiles flush.
   Driven by :nth-child so no HTML changes are needed in any of the 4 locales. */
#galerie .gallery__grid > a{ grid-column:auto; grid-row:auto; }
#galerie .gallery__grid > a:nth-child(1){ grid-column:span 2; grid-row:span 2; }
#galerie .gallery__grid > a:nth-child(2){ grid-column:span 2; }
#galerie .gallery__grid > a:nth-child(5){ grid-column:span 2; }
#galerie .gallery__grid > a:nth-child(n+8){ display:none; }

@media (max-width:760px){
  /* 2 cols: hero stays full-bleed and square-ish, the rest pair up = 8 cells */
  #galerie .gallery__grid > a:nth-child(1){ grid-column:span 2; grid-row:span 2; }
  #galerie .gallery__grid > a:nth-child(2){ grid-column:span 2; }
  #galerie .gallery__grid > a:nth-child(5){ grid-column:span 2; }
  #galerie .gallery__grid > a:nth-child(n+7){ display:none; }
}

.es-note{ font-size:.82rem; color:var(--color-muted); margin-top:14px; }

/* Rooms: one quiet fade, no vertical travel. The track holds 6+ cards, so a
   26px lift on the whole strip plus per-card motion reads as chaos. */
.rooms__track.reveal{ transform:none; transition:opacity .6s var(--ease-out); }
.rooms__track.reveal.in{ transform:none; }

/* Drawer: `.drawer a` (0,1,1) out-specifies `.btn` (0,1,0), so the booking
   button was inheriting the 1.7rem Cormorant nav-link styling and overflowing
   its box. Scope the nav-link rule away from buttons. Pre-existing bug. */
.drawer a:not(.btn){ font-family:var(--font-display); font-size:1.7rem; }
.drawer .btn{ font-family:var(--font-body); font-size:var(--text-xs); letter-spacing:.2em; }
/* Match the landing-page primary CTA rather than the charcoal variant. */
.drawer .btn-teal{ background:var(--color-taupe); color:var(--color-ink); border-color:var(--color-taupe); }
.drawer .btn-teal:hover{ background:var(--color-taupe-lift); color:var(--color-ink); }

/* ---- Real, verifiable social proof (replaces 3 invented testimonials) ----
   Deliberately NOT marked up as aggregateRating schema: Google treats
   self-published ratings on a LocalBusiness page as self-serving and the star
   feature is disabled outright, and re-publishing another platform's score in
   markup is separately prohibited. As visible copy it is simply a true fact,
   readable by both guests and AI crawlers. */
.proof-bar{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px;
  background:var(--color-rule); border:1px solid var(--color-rule); margin-top:34px; }
.proof{ background:var(--color-white); display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:6px; padding:30px 18px; text-align:center; }
.proof__val{ font-family:var(--font-display); font-weight:700; font-size:clamp(2.1rem,3.4vw,2.9rem);
  line-height:1; color:var(--color-ink); font-variant-numeric:lining-nums; }
.proof__max{ font-size:.44em; color:var(--color-muted); font-weight:600; margin-left:1px; }
.proof__val--stars{ color:var(--color-taupe); letter-spacing:.12em; font-size:clamp(1.5rem,2.4vw,2rem); }
.proof__src{ font-size:var(--text-xs); letter-spacing:.16em; text-transform:uppercase;
  color:var(--color-accent-deep); font-weight:600; }
.proof__n{ font-size:.82rem; color:var(--color-muted); }
.proof-note{ margin-top:14px; font-size:.78rem; color:var(--color-muted); text-align:center; }
.proof-cta{ margin-top:20px; text-align:center; }
@media (max-width:820px){ .proof-bar{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:420px){ .proof{ padding:22px 12px; } .proof__src{ letter-spacing:.1em; } }


/* Gate 49 — no two-line clickable text. At the 320px floor the uppercase
   tracking on .link-arrow and footer links pushes long French labels
   ("Réserver en demi-pension", "Préférences cookies") onto a second line. */
@media (max-width:374px){
  .link-arrow{ letter-spacing:.08em; font-size:.66rem; gap:6px; }
  .link-arrow svg{ width:14px; height:14px; }
  .footer a,.footer__bottom a{ letter-spacing:.04em; }
}

/* Spatial motion collapses to an opacity crossfade. Nothing starts at
   opacity:0 in CSS — motion.js uses GSAP .from(), so a hidden start state
   would leave content invisible when reduced-motion skips the animation. */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:150ms !important;
    scroll-behavior:auto !important;
  }
  .btn:hover,.btn-gold:hover,.btn-teal:hover,.btn-outline:hover,.btn-light:hover{ transform:none; }
}


/* ============ Topbar ============ */
.topbar{ background:var(--teal-900); color:#FFFFFF; font-size:.74rem; letter-spacing:.04em; }
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:42px; padding-block:8px; }
.topbar .t-left{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.topbar .stars{ color:var(--gold-bright); letter-spacing:.16em; }
.topbar .dot{ width:3px; height:3px; border-radius:50%; background:rgba(217,224,229,.4); }
.topbar a{ display:inline-flex; align-items:center; gap:7px; color:#FFFFFF; transition:color .25s; }
.topbar a:hover{ color:var(--gold-bright); }
.topbar svg{ width:13px; height:13px; }
@media (max-width:760px){ .topbar .hide-sm{ display:none; } }

/* ============ Header ============ */
.header{ position:sticky; top:0; z-index:60; background:transparent; margin-bottom:-104px; transition:background .45s var(--ease), box-shadow .45s var(--ease), backdrop-filter .45s var(--ease); }
.header.scrolled{ background:oklch(60.5% .035 62 / .94); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:0 6px 24px rgba(26,25,25,.16); }
.header:not(.scrolled) .menu a, .header:not(.scrolled) .brand{ text-shadow:0 1px 14px rgba(0,0,0,.35); }
.nav{ display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:104px; }
.brand{ display:flex; align-items:center; gap:13px; line-height:1; color:#fff; flex:0 0 auto; }
.brand .mark{ width:42px; height:46px; flex:0 0 auto; }
.brand .wm{ display:flex; flex-direction:column; gap:4px; }
.brand .stars{ font-size:.58rem; letter-spacing:.34em; color:#fff; opacity:.92; }
.brand .name{ font-family:var(--logo); font-weight:600; font-size:1.6rem; letter-spacing:.16em; line-height:.9; }
.menu{ display:flex; align-items:center; gap:2px; }
.menu a{ font-size:.76rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.9); padding:10px 13px; position:relative; transition:color .25s; white-space:nowrap; }
.menu a::after{ content:""; position:absolute; left:13px; right:13px; bottom:8px; height:1.5px; background:#fff; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.menu a:hover::after,.menu a.active::after{ transform:scaleX(1); }
.menu a:hover,.menu a.active{ color:#fff; }
.nav-cta{ display:flex; align-items:center; gap:12px; }
.nav-cta .btn-teal{ background:#fff; color:var(--ink); border-color:#fff; }
.nav-cta .btn-teal:hover{ background:rgba(255,255,255,.86); color:var(--ink); }
.nav-cta .btn-outline{ border-color:rgba(255,255,255,.55); color:#fff; }
.nav-cta .btn-outline:hover{ border-color:#fff; background:rgba(255,255,255,.12); color:#fff; }
.lang-switcher{ position:relative; display:inline-flex; align-items:center; }
.lang-current{ height:38px; min-width:72px; display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid rgba(255,255,255,.36); border-radius:999px; background:rgba(255,255,255,.12); color:#fff; font-family:var(--sans); font-size:.72rem; line-height:1; letter-spacing:.08em; font-weight:600; padding:0 12px; cursor:pointer; transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease); }
.lang-current::after{ content:""; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg) translateY(-2px); margin-left:2px; }
.lang-current:hover,.lang-switcher.open .lang-current{ background:#fff; color:var(--ink); border-color:#fff; }
.lang-menu{ position:absolute; top:calc(100% + 8px); right:0; min-width:96px; padding:6px; border:1px solid rgba(255,255,255,.32); border-radius:18px; background:var(--taupe); box-shadow:0 14px 34px rgba(26,25,25,.22); opacity:0; transform:translateY(-4px); pointer-events:none; transition:opacity .2s var(--ease), transform .2s var(--ease); z-index:90; }
.lang-switcher.open .lang-menu,.lang-switcher:focus-within .lang-menu{ opacity:1; transform:translateY(0); pointer-events:auto; }
.lang-pill{ min-width:74px; height:34px; display:inline-flex; align-items:center; justify-content:center; gap:5px; border-radius:999px; color:#fff; font-family:var(--sans); font-size:.72rem; line-height:1; letter-spacing:.08em; font-weight:600; transition:background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease); }
.lang-menu .lang-pill{ width:100%; }
.lang-pill span,.lang-current span{ font-size:1rem; line-height:1; }
.lang-pill b,.lang-current b{ font-weight:600; }
.lang-pill:hover,.lang-pill.active{ background:#fff; color:var(--ink); transform:translateY(-1px); }
.burger{ display:none; width:46px; height:46px; border:1px solid rgba(255,255,255,.5); background:transparent; border-radius:var(--radius); padding:0; align-items:center; justify-content:center; }
.burger span,.burger span::before,.burger span::after{ display:block; width:20px; height:1.5px; background:#fff; transition:.3s; }
.burger span{ position:relative; }
.burger span::before,.burger span::after{ content:""; position:absolute; left:0; }
.burger span::before{ top:-6px; } .burger span::after{ top:6px; }
.burger[aria-expanded="true"] span{ background:transparent; }
.burger[aria-expanded="true"] span::before{ top:0; transform:rotate(45deg); }
.burger[aria-expanded="true"] span::after{ top:0; transform:rotate(-45deg); }
@media (max-width:1380px){ .menu,.nav-cta .btn-resto{ display:none; } .burger{ display:inline-flex; } }
/* Language switcher: same control on phone as on desktop. It used to be
   hidden below 1380px and replaced by a flat 4-pill row inside the drawer,
   so the two versions behaved differently. Now the header dropdown is the
   single control everywhere, and the drawer duplicate is dropped. */
@media (max-width:1380px){ .nav-cta .lang-switcher{ display:inline-flex; } }
@media (max-width:560px){ .nav-cta .btn-teal{ display:none; } }

.drawer{ position:fixed; inset:0; z-index:70; background:var(--white); transform:translateX(100%); transition:transform .45s var(--ease); display:flex; flex-direction:column; padding:92px var(--gutter) 40px; overflow-y:auto; }
.drawer.open{ transform:translateX(0); }
.drawer a{ font-family:var(--serif); font-size:1.7rem; color:var(--ink); padding:14px 0; border-bottom:1px solid var(--line); }
.drawer a:hover{ color:var(--gold-deep); }
.drawer .btn{ margin-top:24px; }
.drawer-lang{ display:flex; gap:8px; justify-content:center; margin:10px 0 12px; }
.drawer-lang .lang-pill{ color:var(--ink); border:1px solid var(--line); background:var(--paper); padding:0; border-bottom:0; font-family:var(--sans); font-size:.72rem; }
.drawer-lang .lang-pill:hover,.drawer-lang .lang-pill.active{ background:var(--taupe); color:#fff; }
.drawer-close{ position:absolute; top:24px; right:var(--gutter); width:46px; height:46px; border-radius:var(--radius); border:1px solid var(--line); background:#fff; font-size:1.3rem; color:var(--ink); }
body.no-scroll{ overflow:hidden; }

/* ============ Hero ============ */
.hero{ position:relative; min-height:min(94svh,980px); display:flex; align-items:flex-end; isolation:isolate; }
.hero > .wrap{ width:100%; }
.hero__bg{ position:absolute; inset:0; z-index:-2; overflow:hidden; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06); animation:zoom 20s ease-out forwards; }
@keyframes zoom{ to{ transform:scale(1); } }
.hero__scrim{ position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(14,14,16,.44) 0%, rgba(16,16,18,.18) 26%, rgba(16,16,18,.24) 55%, rgba(14,14,16,.78) 100%); }
.hero__inner{ color:#fff; padding-block:0 clamp(120px,13vh,140px); max-width:920px; text-align:left; }
.hero__inner .eyebrow{ color:var(--gold-bright); justify-content:flex-start; }
.hero__inner .eyebrow::before,.hero__inner .eyebrow::after{ background:var(--gold-bright); }
.hero h1{ font-size:var(--text-display-s); color:#fff; margin-top:24px; letter-spacing:0; line-height:1.02; font-weight:600; text-shadow:0 3px 34px rgba(0,0,0,.55); overflow-wrap:normal; hyphens:none; }
.hero h1 em{ font-style:normal; color:var(--color-accent-brt); font-weight:500; }
.hero__sub{ font-size:clamp(1.06rem,1.5vw,1.28rem); color:rgba(255,253,247,.94); max-width:580px; margin:24px 0 0; font-weight:400; line-height:1.7; text-shadow:0 2px 18px rgba(0,0,0,.5); }
.hero__actions{ display:flex; gap:14px; justify-content:flex-start; flex-wrap:wrap; margin-top:38px; }
.scrollcue{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%); z-index:1; color:#fff; display:flex; flex-direction:column; align-items:center; gap:9px; font-size:.6rem; letter-spacing:.32em; text-transform:uppercase; }
.scrollcue .line{ width:1px; height:42px; background:linear-gradient(rgba(255,255,255,.7),rgba(255,255,255,0)); animation:cue 2.2s var(--ease) infinite; }
@keyframes cue{ 0%{transform:scaleY(.3);transform-origin:top;opacity:0;} 40%{opacity:1;} 100%{transform:scaleY(1);transform-origin:top;opacity:0;} }
@media (max-width:720px){ .scrollcue{ display:none; } .hero__inner{ padding-block:0 clamp(64px,9vh,96px); } }

/* ============ Experience selector ============ */
.exp{ background:var(--paper); }
.exp__head{ text-align:center; max-width:760px; margin:0 auto 32px; }
.exp__head .eyebrow{ font-size:clamp(.82rem,1.2vw,1.02rem); letter-spacing:.42em; color:var(--gold-deep); }
.exp__head .eyebrow::before,.exp__head .eyebrow.center::after{ width:64px; background:var(--gold); }
.es-tabs{ display:inline-flex; gap:6px; padding:6px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); margin:0 auto 40px; }
.es-tabs-wrap{ text-align:center; }
.es-tab{ border:0; background:transparent; padding:13px 30px; border-radius:8px; font-size:.78rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); transition:background .25s, color .25s; }
.es-tab[aria-selected="true"]{ background:var(--teal); color:#fff; }
.es-panel{ display:none; }
.es-panel.active{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(28px,4vw,64px); align-items:center; animation:fade .5s var(--ease); }
@keyframes fade{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:none; } }
.es-panel img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.es-panel .k{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); }
.es-panel h3{ font-size:clamp(1.7rem,3vw,2.4rem); margin-top:10px; }
.es-panel p{ color:var(--ink-soft); margin-top:14px; font-weight:400; }
.es-panel ul{ list-style:none; margin:18px 0 24px; padding:0; display:grid; gap:10px; }
.es-panel li{ display:flex; align-items:center; gap:11px; font-size:.95rem; color:var(--ink-soft); }
.es-panel li svg{ width:18px; height:18px; color:var(--teal); flex:0 0 auto; }
@media (max-width:820px){ .es-panel.active{ grid-template-columns:1fr; } .es-panel img{ order:-1; } }

/* ============ Intro ============ */
.intro{ text-align:center; }
.intro .wrap{ max-width:820px; }
.intro h2{ font-size:clamp(2.1rem,4.2vw,3.2rem); margin-top:26px; }
.intro p{ margin-top:22px; }
.intro .accent{ color:var(--gold-deep); }
.intro .stats{ display:grid; grid-template-columns:repeat(4,auto); justify-content:center; gap:clamp(22px,4.5vw,64px); margin-top:52px; }
@media (max-width:560px){ .intro .stats{ grid-template-columns:repeat(2,1fr); gap:30px 18px; } }
.intro .stat .num{ font-family:var(--serif); font-size:3.2rem; color:var(--gold-deep); line-height:1; font-weight:600; }
.intro .stat .lab{ font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); margin-top:9px; }
.intro-hosts img{ box-shadow:none; }
.intro-hosts figcaption{ color:var(--ink-faint); }

/* ============ Rooms carousel ============ */
.rooms{ background:var(--paper); overflow:hidden; }
.rooms__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:36px; }
.rooms__nav{ display:flex; gap:10px; }
.rooms__nav button{ width:50px; height:50px; border-radius:50%; border:1px solid var(--line); background:var(--white); color:var(--teal); display:grid; place-content:center; transition:.25s; }
.rooms__nav button:hover{ background:var(--teal); color:#fff; border-color:var(--teal); }
.rooms__nav svg{ width:20px; height:20px; }
.rooms__track{ display:grid; grid-auto-flow:column; grid-auto-columns:clamp(260px,30%,360px); gap:22px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding-bottom:8px; margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter); scrollbar-width:none; }
.rooms__track::-webkit-scrollbar{ display:none; }
.room{ scroll-snap-align:start; background:#FFFFFF; border:0; border-radius:var(--radius-lg); overflow:hidden; box-shadow:0 2px 14px rgba(46,32,20,.07); display:flex; flex-direction:column; transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.room:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.room__img{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.room__img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.room:hover .room__img img{ transform:scale(1.06); }
.room__tag{ position:absolute; top:14px; left:14px; background:rgba(253,252,248,.94); color:var(--gold-deep); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; padding:7px 13px; border-radius:var(--radius); }
.room__body{ padding:22px 22px 24px; display:flex; flex-direction:column; gap:6px; }
.room__body h3{ font-size:1.5rem; }
.room__body p{ font-size:.9rem; color:var(--ink-soft); font-weight:400; line-height:1.6; }
.room__foot{ display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding-top:16px; border-top:1px solid var(--line); }
.room__price{ font-family:var(--serif); color:var(--ink); font-size:1.05rem; }
.room__price b{ color:var(--gold-deep); font-family:var(--serif); font-size:1.3rem; }
.room__price small{ display:block; font-family:var(--sans); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); }

/* ============ Restaurant ============ */
.resto__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,80px); align-items:center; }
.resto__media{ position:relative; }
.resto__media > img{ width:100%; aspect-ratio:2/3; object-fit:cover; object-position:center top; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.resto__media .badge{ position:absolute; right:-18px; bottom:24px; background:var(--teal); color:var(--color-accent-brt); padding:18px 22px; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); text-align:center; }
.resto__media .badge b{ display:block; font-family:var(--serif); font-size:1.6rem; color:#fff; }
.resto__media .badge span{ font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; }
.resto__body p{ color:var(--ink-soft); font-weight:400; margin-top:18px; }
.menu-cards{ display:grid; gap:14px; margin-top:28px; }
.menu-card{ display:flex; align-items:center; gap:16px; padding:18px 20px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--white); transition:.3s; }
.menu-card:hover{ border-color:var(--gold); box-shadow:var(--shadow-sm); transform:translateX(4px); }
.menu-card .ic{ width:46px; height:46px; flex:0 0 auto; border-radius:50%; background:var(--paper); color:var(--gold-deep); display:grid; place-content:center; }
.menu-card .ic svg{ width:22px; height:22px; }
.menu-card h4{ font-family:var(--sans); font-weight:600; font-size:.95rem; letter-spacing:.02em; }
.menu-card p{ margin:2px 0 0; font-size:.85rem; color:var(--ink-soft); font-weight:400; }
.resto__actions{ margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; }
@media (max-width:880px){ .resto__grid{ grid-template-columns:1fr; } .resto__media{ max-width:520px; } }

/* ============ Offers ============ */
.offers{ background:var(--teal-900); color:#FFFFFF; }
.offers__head{ text-align:center; max-width:620px; margin:0 auto 50px; }
.offers .eyebrow{ color:var(--gold-bright); } .offers .eyebrow::before,.offers .eyebrow.center::after{ background:var(--gold-bright); }
.offers h2{ color:#fff; }
.offers__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.offer{ background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.28); border-radius:var(--radius-lg); padding:30px 32px; transition:.3s; }
.offer:hover{ background:rgba(255,255,255,.16); transform:translateY(-4px); }
.offer .ic{ width:50px; height:50px; border-radius:50%; border:1px solid rgba(241,217,174,.4); color:var(--gold-bright); display:grid; place-content:center; margin-bottom:18px; }
.offer .ic svg{ width:24px; height:24px; }
.offer h3{ font-size:1.5rem; color:#fff; }
.offer p{ color:#fff; font-weight:400; margin-top:8px; font-size:.95rem; }
.offer a{ margin-top:16px; color:var(--gold-bright); }
.offers__foot{ text-align:center; margin-top:42px; }
@media (max-width:680px){ .offers__grid{ grid-template-columns:1fr; } }

/* ============ Split (séminaires & bien-être) ============ */
.split__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,80px); align-items:center; }
.split--rev .split__media{ order:2; }
.split__media{ overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.split__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.split__body p{ color:var(--ink-soft); font-weight:400; margin-top:18px; }
.split__body ul{ list-style:none; margin:24px 0; padding:0; display:grid; gap:12px; }
.split__body li{ display:flex; align-items:center; gap:12px; font-size:.96rem; color:var(--ink-soft); }
.split__body li svg{ width:19px; height:19px; color:var(--gold-deep); flex:0 0 auto; }
.split--tint{ background:var(--paper); }
@media (max-width:880px){ .split__grid{ grid-template-columns:1fr; } .split--rev .split__media{ order:-1; } .split__media{ max-width:560px; } }

/* ============ Gallery ============ */
.gallery__head{ text-align:center; max-width:600px; margin:0 auto 40px; }
.gallery__grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(140px,14.5vw,205px); gap:10px; }
.gallery__grid a{ overflow:hidden; border-radius:var(--radius); position:relative; }
.gallery__grid img{ width:100%; height:100%; object-fit:cover; transition:transform var(--dur-long) var(--ease-out); }
.gallery__grid a:hover img{ transform:scale(1.04); }
.g-tall{ grid-row:span 2; } .g-wide{ grid-column:span 2; }
@media (max-width:760px){ .gallery__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; } }

/* ============ Testimonials ============ */
.tst{ background:var(--paper); }
.tst__head{ text-align:center; max-width:620px; margin:0 auto 48px; }
.tst__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.tst-card{ background:#FFFFFF; border:0; border-radius:var(--radius-lg); padding:34px 32px; display:flex; flex-direction:column; box-shadow:0 2px 14px rgba(46,32,20,.06); }
.tst-card .tst-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tst-card .stars{ color:var(--gold); letter-spacing:.16em; }
.tst-card .date{ font-size:.7rem; letter-spacing:.05em; color:var(--ink-faint); white-space:nowrap; }
.tst-card blockquote{ margin:16px 0 0; font-family:var(--serif); font-style:italic; font-size:1.42rem; line-height:1.5; font-weight:500; color:var(--ink); }
.tst-card .who{ margin-top:auto; padding-top:22px; display:flex; align-items:center; gap:12px; }
.tst-card .av{ width:44px; height:44px; flex:0 0 44px; aspect-ratio:1; border-radius:50%; background:var(--teal); color:var(--color-accent-brt); display:grid; place-content:center; font-family:var(--serif); font-size:1.05rem; }
.tst-card .nm{ font-weight:600; font-size:.92rem; }
.tst-card .meta{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); margin-top:2px; }
@media (max-width:820px){ .tst__grid{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; } }

/* ============ Instagram ============ */
.insta__head{ text-align:center; max-width:560px; margin:0 auto 36px; }
.insta__head a{ color:var(--gold-deep); font-weight:500; }
.insta__grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.insta__grid a{ position:relative; aspect-ratio:1; overflow:hidden; border-radius:var(--radius); }
.insta__grid img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease), filter .3s; filter:saturate(.95); }
.insta__grid a:hover img{ transform:scale(1.08); filter:saturate(1.1); }
@media (max-width:760px){ .insta__grid{ grid-template-columns:repeat(3,1fr); } }

/* ============ CTA ============ */
.cta{ position:relative; isolation:isolate; color:#fff; text-align:center; }
.cta__bg{ position:absolute; inset:0; z-index:-2; }
.cta__bg img{ width:100%; height:100%; object-fit:cover; }
.cta::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(rgba(10,12,14,.86),rgba(10,12,14,.93)); }
.cta .wrap{ max-width:760px; }
.cta h2{ color:#fff; font-size:clamp(2.2rem,4.6vw,3.6rem); }
.cta p{ color:#fff; margin-top:18px; font-weight:500; font-size:1.12rem; text-shadow:0 2px 16px rgba(0,0,0,.65); }
.cta__actions{ margin-top:34px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.cta .guar{ margin-top:22px; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:#E7D9CC; display:inline-flex; align-items:center; gap:9px; }
.cta .guar svg{ width:16px; height:16px; }

/* ============ Footer ============ */
.footer{ background:var(--teal-900); color:#fff; padding-block:clamp(56px,6vw,84px) 30px; font-size:.92rem; font-weight:400; }
.footer__grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:42px; }
.footer h4{ font-family:var(--sans); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:#fff; margin-bottom:18px; font-weight:600; }
.footer a{ color:#fff; transition:color .25s; } .footer a:hover{ color:var(--gold-bright); }
.footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.footer .brand .fstars{ display:block; color:#fff; letter-spacing:.34em; font-size:.74rem; margin-bottom:8px; }
.footer .brand .name{ font-family:var(--logo); font-weight:600; color:#fff; font-size:1.9rem; letter-spacing:.16em; }
.footer .blurb{ margin-top:16px; max-width:34ch; color:#fff; line-height:1.7; }
.footer .labels{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.footer .labels span{ font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; font-weight:400; border:1px solid rgba(255,255,255,.45); padding:6px 11px; border-radius:var(--radius); }
.footer .socials{ display:flex; gap:10px; margin-top:20px; }
.footer .socials a{ width:40px; height:40px; border-radius:50%; border:1px solid rgba(185,196,204,.24); display:grid; place-content:center; }
.footer .socials a:hover{ border-color:var(--gold-bright); background:rgba(249,173,77,.1); }
.footer .socials svg{ width:18px; height:18px; }
.footer__bottom{ margin-top:48px; padding-top:24px; border-top:1px solid rgba(255,255,255,.25); display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:.78rem; color:#fff; }
.footer__bottom a{ color:#fff; }
.footer__bottom a:hover{ color:var(--gold-bright); }
@media (max-width:880px){ .footer__grid{ grid-template-columns:1fr 1fr; gap:34px; } }
@media (max-width:520px){ .footer__grid{ grid-template-columns:1fr; } }

/* ============ Mobile action bar ============ */
.mobilebar{ display:none; }
@media (max-width:560px){
  .mobilebar{ display:grid; grid-template-columns:1fr 1.4fr; gap:9px; position:fixed; left:0; right:0; bottom:0; z-index:66; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(255,255,255,.97); backdrop-filter:blur(10px); border-top:1px solid var(--line); }
  .mobilebar a{ min-height:50px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; gap:8px; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; font-weight:500; }
  .mobilebar svg{ width:16px; height:16px; }
  .mb-call{ border:1px solid var(--line); color:var(--teal); background:#fff; }
  .mb-book{ background:var(--color-taupe); color:var(--color-ink); }
  body{ padding-bottom:78px; }
}

/* ============ Reveal ============ */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; } .reveal.d3{ transition-delay:.24s; }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; } .reveal{ opacity:1; transform:none; } .hero__bg img{ transform:none; } }

/* ============ Logo image ============ */
.brand img{ height:82px; width:auto; max-width:none; flex:0 0 auto; display:block; object-fit:contain; transition:height .4s var(--ease); filter:drop-shadow(0 1px 10px rgba(0,0,0,.3)); }
.header.scrolled .brand img{ height:56px; filter:none; }
.footer .brand img{ height:60px; width:auto; }
@media (max-width:560px){ .nav{ min-height:82px; } .brand img{ height:58px; } .header{ margin-bottom:-82px; } .header.scrolled .brand img{ height:46px; } }

/* ============ Responsive image heights (avoid over-tall photos) ============ */
img{ height:auto; }
/* Experience: business spec tiles + mirrored layout */
.es-specs{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:20px 0 24px; }
.spec{ border:1px solid var(--line); border-radius:var(--radius); padding:14px 16px; background:var(--white); }
.spec b{ display:block; font-family:var(--logo); font-size:1.7rem; line-height:1; color:var(--gold-deep); font-weight:500; }
.spec span{ font-size:.78rem; color:var(--ink-faint); }
.es-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.es-panel--biz.active{ grid-template-columns:1fr 1.1fr; }
@media (max-width:820px){ .es-panel--biz.active{ grid-template-columns:1fr; } }
@media (max-width:420px){ .es-specs{ grid-template-columns:1fr; } }

/* Reservation dropdown (nav) */
.resa{ position:relative; }
.resa-btn{ padding:12px 22px; gap:7px; }
.resa-btn .caret{ width:15px; height:15px; transition:transform .25s var(--ease); }
.resa.open .resa-btn .caret{ transform:rotate(180deg); }
.resa-menu{ position:absolute; top:calc(100% + 10px); right:0; min-width:210px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-md); padding:6px; display:none; z-index:80; }
.resa.open .resa-menu{ display:block; }
.resa-menu a{ display:block; padding:12px 14px; border-radius:4px; font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink); }
.resa-menu a:hover{ background:var(--paper-2); color:var(--gold-deep); }
@media (max-width:560px){ .resa{ display:none; } }

@media (max-width:600px){
  .es-panel img{ aspect-ratio:16/10; }
  .resto__media img{ aspect-ratio:4/3; }
  .split__media img{ aspect-ratio:16/10; }
  .room__img{ aspect-ratio:4/3; }
  .gallery__grid{ grid-auto-rows:130px; }
  .hero{ min-height:88svh; }
}

/* ============================================================
   SUBPAGE COMPONENTS
   ============================================================ */

/* Page hero (compact, image + charcoal overlay) */
.page-hero{ position:relative; isolation:isolate; color:#fff; text-align:center; padding-block:calc(clamp(70px,12vw,140px) + 84px) clamp(48px,7vw,84px); }
.page-hero__bg{ position:absolute; inset:0; z-index:-2; overflow:hidden; }
.page-hero__bg img{ width:100%; height:100%; object-fit:cover; }
.page-hero::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(12,13,15,.58), rgba(12,13,15,.42) 30%, rgba(12,13,15,.74)); }
.page-hero .eyebrow{ color:var(--gold-bright); justify-content:center; }
.page-hero .eyebrow::before,.page-hero .eyebrow::after{ background:var(--gold-bright); }
.page-hero h1{ font-size:clamp(2.7rem,6vw,4.6rem); color:#fff; margin-top:18px; font-weight:600; letter-spacing:0; }
.page-hero p{ max-width:680px; margin:18px auto 0; color:#fff; font-weight:500; font-size:1.12rem; text-shadow:0 2px 16px rgba(0,0,0,.65); }

/* Breadcrumb */
.crumb{ font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); }
.crumb a{ color:var(--ink-faint); } .crumb a:hover{ color:var(--gold-deep); }
.crumb .sep{ margin:0 8px; opacity:.6; }
.page-hero .crumb{ color:#fff; font-weight:700; text-shadow:0 1px 10px rgba(0,0,0,.7); }
.page-hero .crumb a{ color:#fff; } .page-hero .crumb a:hover{ color:var(--gold-bright); }

/* Prose / article body */
.prose{ max-width:760px; }
.prose.center{ margin-inline:auto; }
.prose p{ color:var(--ink-soft); font-weight:400; margin-top:18px; line-height:1.85; }
.prose h2{ font-size:clamp(1.7rem,3vw,2.4rem); margin-top:48px; }
.prose h3{ font-size:1.4rem; margin-top:32px; }
.prose ul,.prose ol{ margin-top:16px; padding-left:20px; color:var(--ink-soft); font-weight:400; }
.prose li{ margin-top:8px; }
.prose a{ color:var(--gold-deep); text-decoration:underline; text-underline-offset:3px; }
.prose img{ width:100%; border-radius:var(--radius-lg); margin-top:28px; box-shadow:var(--shadow-md); }
.prose blockquote{ margin:28px 0; padding:6px 0 6px 24px; border-left:3px solid var(--gold); font-family:var(--logo); font-style:italic; font-size:1.5rem; color:var(--ink); }

/* Feature grid (reusable cards) */
.features{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.feature{ background:#FFFFFF; border:0; border-radius:var(--radius-lg); padding:32px 30px; box-shadow:0 2px 14px rgba(46,32,20,.06); }
.feature .ic{ width:52px; height:52px; border-radius:50%; background:var(--paper); color:var(--gold-deep); display:grid; place-content:center; margin-bottom:18px; }
.feature .ic svg{ width:24px; height:24px; }
.feature h3{ font-size:1.3rem; }
.feature p{ color:var(--ink-soft); font-weight:400; margin-top:8px; font-size:.95rem; }
@media (max-width:880px){ .features{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .features{ grid-template-columns:1fr; } }

/* Detailed room rows */
.roomrow{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,64px); align-items:center; }
.roomrow + .roomrow{ margin-top:clamp(40px,5vw,72px); }
.roomrow:nth-child(even) .roomrow__media{ order:2; }
.roomrow__media{ overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.roomrow__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.roomrow__body h2{ font-size:clamp(1.8rem,3vw,2.4rem); }
.roomrow__body .price{ font-family:var(--logo); font-size:1.2rem; color:var(--gold-deep); margin-top:6px; }
.roomrow__body p{ color:var(--ink-soft); font-weight:400; margin-top:14px; }
.roomrow__feats{ list-style:none; margin:18px 0 22px; padding:0; display:flex; flex-wrap:wrap; gap:10px 18px; }
.roomrow__feats li{ display:flex; align-items:center; gap:8px; font-size:.9rem; color:var(--ink-soft); }
.roomrow__feats svg{ width:16px; height:16px; color:var(--gold-deep); }
@media (max-width:820px){ .roomrow{ grid-template-columns:1fr; } .roomrow:nth-child(even) .roomrow__media{ order:-1; } }

/* Menu list (restaurant) */
.menu-block{ max-width:760px; margin-inline:auto; }
.menu-block + .menu-block{ margin-top:48px; }
.menu-block h2{ text-align:center; font-size:1.8rem; }
.menu-block .sub{ text-align:center; color:var(--ink-faint); margin-top:6px; font-size:.9rem; }
.dish{ display:flex; align-items:baseline; gap:12px; padding:16px 0; border-bottom:1px solid var(--line); }
.dish .nm{ font-weight:500; }
.dish .dots{ flex:1; border-bottom:1px dotted var(--line); transform:translateY(-4px); }
.dish .pr{ font-family:var(--logo); font-size:1.15rem; color:var(--gold-deep); white-space:nowrap; }
.dish .ds{ display:block; font-size:.85rem; color:var(--ink-faint); font-weight:500; margin-top:3px; }

/* Contact */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4vw,60px); }
.info-list{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.info-list li{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); align-items:flex-start; }
.info-list .ic{ width:46px; height:46px; flex:0 0 auto; border-radius:var(--radius); background:var(--paper-2); display:grid; place-content:center; color:var(--teal); }
.info-list .ic svg{ width:21px; height:21px; }
.info-list .k{ font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); }
.info-list .v{ font-size:1.05rem; margin-top:3px; font-weight:500; }
.info-list a.v:hover{ color:var(--gold-deep); }
.form{ display:grid; gap:16px; }
.form .row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field-l{ display:flex; flex-direction:column; gap:7px; }
.field-l label{ font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); }
.field-l input,.field-l textarea,.field-l select{ font-family:var(--sans); font-size:1rem; padding:13px 15px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); color:var(--ink); }
.field-l input:focus,.field-l textarea:focus,.field-l select:focus{ outline:none; border-color:var(--taupe); box-shadow:0 0 0 3px rgba(165,141,121,.18); }
.field-l textarea{ min-height:130px; resize:vertical; }
.contact-map{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); border:1px solid var(--line); min-height:360px; }
.contact-map iframe{ width:100%; height:100%; min-height:360px; border:0; filter:grayscale(.25); }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } .form .row{ grid-template-columns:1fr; } }

/* Blog */
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.blog-card{ display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.blog-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.blog-card__img{ aspect-ratio:3/2; overflow:hidden; }
.blog-card__img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.blog-card:hover .blog-card__img img{ transform:scale(1.06); }
.blog-card__body{ padding:24px; display:flex; flex-direction:column; flex:1; }
.blog-card .cat{ font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); }
.blog-card h3{ font-size:1.35rem; margin-top:10px; line-height:1.25; }
.blog-card p{ color:var(--ink-soft); font-weight:400; font-size:.93rem; margin-top:10px; }
.blog-card .more{ margin-top:auto; padding-top:18px; }
@media (max-width:880px){ .blog-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .blog-grid{ grid-template-columns:1fr; } }

/* Article meta + share */
.post-head{ max-width:760px; margin-inline:auto; text-align:center; }
.post-head .meta{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin-top:16px; }
.post-cta{ max-width:760px; margin:48px auto 0; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px; text-align:center; }
.post-cta h3{ font-size:1.5rem; }
.post-cta p{ color:var(--ink-soft); font-weight:400; margin-top:8px; }
.post-cta .btn{ margin-top:18px; }
.post-nav{ max-width:760px; margin:40px auto 0; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; }

/* FAQ (native details) */
.faq{ max-width:760px; margin-inline:auto; }
.faq details{ border-bottom:1px solid var(--line); padding:6px 0; }
.faq summary{ cursor:pointer; list-style:none; padding:18px 0; font-weight:500; font-size:1.05rem; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-size:1.4rem; color:var(--gold-deep); transition:transform .25s; }
.faq details[open] summary::after{ content:"–"; }
.faq p{ color:var(--ink-soft); font-weight:400; padding:0 0 18px; margin:0; }

/* Gallery (full) with category filter look */
.gal{ columns:3 300px; column-gap:16px; }
.gal a{ position:relative; display:block; overflow:hidden; border-radius:var(--radius); margin-bottom:16px; break-inside:avoid; }
.gal img{ width:100%; height:auto; transition:transform .8s var(--ease); }
.gal a:hover img{ transform:scale(1.05); }
@media (max-width:760px){ .gal{ columns:2 150px; column-gap:12px; } .gal a{ margin-bottom:12px; } }

/* Simple alt section tint */
.tint{ background:var(--paper); }
.section-sm{ padding-block:clamp(54px,7vw,90px); }
.lead-center{ max-width:680px; margin:0 auto clamp(40px,5vw,60px); text-align:center; }

/* GEO-CSS-START */
.geo-answer{ background:linear-gradient(180deg,#fff 0%, var(--paper) 100%); }
.geo-answer .lede{ max-width:920px; margin:16px auto 0; text-align:center; }
.geo-facts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:34px; }
.geo-facts article{ background:rgba(255,255,255,.78); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow-sm); }
.geo-facts strong{ display:block; color:var(--gold-deep); font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; margin-bottom:8px; }
.geo-facts span{ display:block; color:var(--ink-soft); line-height:1.65; }
.geo-faq .faq{ max-width:920px; margin:34px auto 0; }
.article-depth .prose{ max-width:880px; }
.article-depth .prose p{ color:var(--ink-soft); font-size:1.03rem; line-height:1.85; margin-top:18px; }
@media (max-width:980px){ .geo-facts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){ .geo-facts{ grid-template-columns:1fr; } .geo-facts article{ padding:18px; } }
/* GEO-CSS-END */


/* Restaurant page upgrade */
.hero-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:26px; }
.resto-story{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr); gap:clamp(30px,5vw,72px); align-items:center; }
.resto-story__copy p{ margin-top:18px; color:#000; line-height:1.85; font-size:1.03rem; }
.resto-story__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.resto-proof{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:26px; }
.resto-proof article,.hours-grid article{ border:1px solid var(--line); background:var(--white); border-radius:var(--radius-md); padding:16px 18px; box-shadow:var(--shadow-sm); }
.resto-proof b{ display:block; font-family:var(--serif); font-size:1.35rem; color:var(--teal); }
.resto-proof span,.hours-grid span,.formula span{ display:block; color:#000; font-size:.86rem; line-height:1.45; margin-top:3px; }
.resto-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }
.center-actions{ justify-content:center; }
.resto-menu-head{ max-width:820px; margin-inline:auto; }
.resto-menu-layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,360px); gap:28px; align-items:start; margin-top:34px; }
.menu-block.menu-block--card{ max-width:none; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,4vw,40px); box-shadow:var(--shadow-sm); }
.menu-block.menu-block--card h3,.resto-side-card h3{ font-size:clamp(1.6rem,3vw,2.15rem); margin:0; }
.resto-side-card{ position:sticky; top:104px; background:var(--teal); color:#fff; border-radius:var(--radius-lg); padding:30px 28px; box-shadow:var(--shadow-md); }
.resto-side-card .eyebrow{ color:#E7D9CC; }
.resto-side-card h3{ color:#fff; }
.formula{ border-top:1px solid rgba(255,255,255,.22); padding:18px 0; }
.formula b{ color:#fff; font-weight:600; }
.formula span{ color:#F3E9DE; }
.resto-side-card .btn{ width:100%; justify-content:center; margin-top:12px; }
.hours-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:820px; margin:30px auto 0; }
.hours-grid article{ text-align:center; }
.hours-grid b{ font-family:var(--serif); font-size:1.35rem; color:var(--ink); font-weight:600; }
@media (max-width:900px){ .resto-story,.resto-menu-layout{ grid-template-columns:1fr; } .resto-side-card{ position:static; } }
@media (max-width:640px){ .hero-actions,.resto-actions{ flex-direction:column; } .hero-actions .btn,.resto-actions .btn{ width:100%; justify-content:center; } .resto-proof,.hours-grid{ grid-template-columns:1fr; } .menu-block.menu-block--card{ padding:22px 18px; } .dish{ grid-template-columns:1fr auto; gap:8px 12px; } .dish .dots{ display:none; } }


/* Restaurant actual menu correction */
.subtle-actions{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:26px; }
.actual-menu{ display:grid; gap:26px; margin-top:34px; }
.actual-menu__block{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,4vw,42px); box-shadow:var(--shadow-sm); }
.actual-menu__block h3{ font-size:clamp(1.55rem,2.6vw,2.1rem); text-align:center; margin-bottom:18px; }
.actual-menu__block .dish{ padding:14px 0; border-bottom:1px solid rgba(33,39,37,.09); }
.actual-menu__block .dish:last-child{ border-bottom:0; }
.menu-source-note{ max-width:760px; margin:30px auto 0; text-align:center; }
.menu-source-note p{ color:#000; line-height:1.65; margin-bottom:16px; }
.menu-images{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; margin-top:34px; }
.menu-images img{ width:100%; height:auto; border-radius:var(--radius-md); border:1px solid var(--line); background:#fff; box-shadow:var(--shadow-sm); }
@media (max-width:860px){ .menu-images{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; } }
@media (max-width:640px){ .subtle-actions{ flex-direction:column; } .subtle-actions .btn{ width:100%; justify-content:center; } }


/* Restaurant refinement pass */
.restaurant-facts{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:22px; }
.restaurant-facts span{ border:1px solid var(--line); border-radius:999px; padding:9px 14px; color:var(--ink); background:rgba(255,255,255,.72); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; }
.menu-jump{ display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:24px; }
.menu-jump a{ min-height:42px; display:inline-flex; align-items:center; justify-content:center; padding:10px 16px; border:1px solid var(--line); border-radius:999px; background:var(--white); color:var(--ink); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; transition:.2s ease; }
.menu-jump a:hover{ border-color:var(--gold); color:var(--gold-deep); transform:translateY(-1px); }
.menu-section-kicker{ text-align:center; color:var(--gold-deep); letter-spacing:.18em; text-transform:uppercase; font-size:.72rem; margin-bottom:8px; }
.actual-menu__block{ scroll-margin-top:110px; }
.actual-menu__block .dish .nm{ color:var(--ink); }
.actual-menu__block .dish .pr{ font-variant-numeric:tabular-nums; background:var(--paper-2); border-radius:999px; padding:4px 10px; font-size:1rem; }
.restaurant-hours-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; max-width:820px; margin:28px auto 28px; }
.restaurant-hours-grid article{ border:1px solid var(--line); border-radius:var(--radius-md); background:var(--white); box-shadow:var(--shadow-sm); text-align:center; padding:18px 16px; }
.restaurant-hours-grid span{ display:block; color:var(--gold-deep); letter-spacing:.14em; text-transform:uppercase; font-size:.72rem; margin-bottom:4px; }
.restaurant-hours-grid b{ font-family:var(--serif); color:var(--ink); font-size:1.28rem; font-weight:600; }
.restaurant-final-cta{ color:var(--ink); background:linear-gradient(180deg,#f7f3ef,#efe7df); }
.restaurant-final-cta .cta__bg{ display:none; }
.restaurant-final-cta::after{ background:transparent; }
.restaurant-final-cta .eyebrow.light{ color:var(--gold-deep); }
.restaurant-final-cta .eyebrow.light::before,.restaurant-final-cta .eyebrow.light.center::after{ background:var(--gold); }
.restaurant-final-cta h2{ color:var(--ink); }
.restaurant-final-cta p{ color:#000; }
@media (max-width:720px){ .restaurant-hours-grid{ grid-template-columns:1fr; } .menu-jump a{ flex:1 1 calc(50% - 10px); } .restaurant-facts span{ flex:1 1 100%; } .actual-menu__block .dish .pr{ padding:3px 8px; } }

.restaurant-final-cta .btn-light{ color:var(--ink); border-color:rgba(33,39,37,.18); background:rgba(255,255,255,.55); }
.restaurant-final-cta .btn-light:hover{ background:#fff; color:var(--ink); }


/* Restaurant engagement layer */
.restaurant-engage{ background:linear-gradient(180deg,#fff,#faf7f3); }
.restaurant-engage__grid{ display:grid; grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr); gap:clamp(28px,5vw,72px); align-items:center; }
.restaurant-engage__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); }
.restaurant-engage__copy p{ color:#000; line-height:1.82; margin-top:18px; }
.signature-grid{ display:grid; gap:12px; margin-top:26px; }
.signature-grid article{ border:1px solid var(--line); border-radius:var(--radius-md); background:rgba(255,255,255,.82); padding:16px 18px; box-shadow:var(--shadow-sm); transition:.2s ease; }
.signature-grid article:hover{ transform:translateY(-2px); border-color:rgba(171,140,118,.45); }
.signature-grid span{ display:block; color:var(--gold-deep); letter-spacing:.14em; text-transform:uppercase; font-size:.68rem; margin-bottom:4px; }
.signature-grid b{ display:block; font-family:var(--serif); font-size:1.32rem; color:var(--ink); font-weight:600; line-height:1.25; }
.signature-grid small{ display:block; color:#000; opacity:.76; margin-top:4px; line-height:1.45; }
.restaurant-engage__actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:26px; }
.menu-assurance{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:16px; }
.menu-assurance span{ display:inline-flex; align-items:center; min-height:34px; padding:7px 12px; border-radius:999px; background:rgba(255,255,255,.75); border:1px solid rgba(171,140,118,.20); color:#000; font-size:.78rem; }
@media (max-width:900px){ .restaurant-engage__grid{ grid-template-columns:1fr; } .restaurant-engage__media{ order:2; } }
@media (max-width:640px){ .restaurant-engage__actions{ flex-direction:column; } .restaurant-engage__actions .btn{ width:100%; justify-content:center; } .menu-assurance span{ flex:1 1 100%; justify-content:center; } }


/* Restaurant food collage */
.food-collage{ display:grid; grid-template-columns:1.15fr .85fr; gap:12px; align-items:stretch; }
.food-collage img{ width:100%; height:100%; object-fit:cover; border-radius:var(--radius-md); border:1px solid rgba(171,140,118,.18); box-shadow:var(--shadow-sm); background:#fff; }
.food-collage__main{ aspect-ratio:4/5; }
.food-collage__stack{ display:grid; gap:12px; }
.food-collage__stack img{ aspect-ratio:4/3; }
@media (max-width:900px){ .food-collage{ max-width:720px; margin-inline:auto; } }
@media (max-width:560px){ .food-collage{ grid-template-columns:1fr; } .food-collage__main,.food-collage__stack img{ aspect-ratio:4/3; } }



/* Blog editorial index - preserves original header/font */
.blog-index{ background:linear-gradient(180deg,#fff 0%, var(--paper) 100%); }
.blog-intro{ max-width:920px; margin:0 auto 36px; text-align:center; }
.blog-intro .lede{ margin-top:16px; color:#000; }
.blog-topics{ display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:24px; }
.blog-topics a{ min-height:40px; display:inline-flex; align-items:center; justify-content:center; padding:9px 15px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font-size:.72rem; font-weight:500; letter-spacing:.13em; text-transform:uppercase; box-shadow:var(--shadow-sm); }
.blog-topics a:hover{ background:var(--paper-2); color:var(--gold-deep); border-color:var(--gold); transform:translateY(-1px); }
.blog-section-head{ display:flex; align-items:end; justify-content:space-between; gap:22px; margin:40px 0 24px; border-top:1px solid var(--line); padding-top:26px; }
.blog-section-head h2{ font-size:clamp(1.8rem,3vw,2.45rem); }
.blog-section-head p{ color:#000; max-width:520px; line-height:1.7; }
.blog-grid--magazine{ align-items:stretch; }
.blog-card{ opacity:1 !important; transform:none !important; min-height:100%; scroll-margin-top:110px; }
.blog-card--featured{ grid-column:span 2; display:grid; grid-template-columns:1.05fr .95fr; }
.blog-card--featured .blog-card__img{ aspect-ratio:auto; min-height:100%; }
.blog-card--featured .blog-card__body{ padding:clamp(28px,4vw,42px); }
.blog-card--featured h3{ font-size:clamp(1.6rem,2.8vw,2.25rem); }
.blog-card__body{ gap:7px; }
.blog-card h3 a{ color:var(--ink); }
.blog-card h3 a:hover{ color:var(--gold-deep); }
.blog-card .cat{ color:var(--gold-deep); font-weight:500; }
.blog-meta{ display:inline-flex; color:var(--ink-faint); font-size:.72rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; margin-top:2px; }
.blog-card p{ color:#000; line-height:1.65; }
.blog-card .more a{ min-height:38px; padding:6px 0; color:var(--gold-deep); font-weight:500; }
.blog-card__img:not(:has(img)){ display:none !important; }
.blog-card:not(:has(img)){ min-height:0; }
.blog-card:not(:has(img)) .blog-card__body{ padding-top:28px; min-height:280px; }
@media (max-width:980px){ .blog-card--featured{ grid-column:span 2; grid-template-columns:1fr; } .blog-card--featured .blog-card__img{ aspect-ratio:16/9; } .blog-section-head{ align-items:start; flex-direction:column; } }
@media (max-width:560px){ .blog-card--featured{ grid-column:span 1; } .blog-topics a{ flex:1 1 calc(50% - 10px); } }






/* Rich sourced blog articles */
.article-rich{ max-width:860px; }
.article-rich .article-lead{ font-size:clamp(1.12rem,1.7vw,1.28rem); color:var(--ink); line-height:1.85; font-weight:400; }
.article-rich h2{ margin-top:42px; }
.article-rich p{ color:#000; line-height:1.85; margin-top:14px; }
.article-rich ul{ margin-top:16px; color:#000; line-height:1.8; }
.article-facts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:28px 0 10px; }
.article-facts span{ display:flex; align-items:center; justify-content:center; min-height:58px; padding:10px 12px; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--paper); color:var(--ink); text-align:center; font-size:.78rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
.article-note{ margin-top:24px; padding:20px 22px; border-left:4px solid var(--gold); background:var(--paper); color:#000; border-radius:0 var(--radius-md) var(--radius-md) 0; line-height:1.75; }
.source-note{ margin-top:30px !important; padding-top:18px; border-top:1px solid var(--line); color:var(--ink-faint) !important; font-size:.92rem; }
@media (max-width:760px){ .article-facts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:460px){ .article-facts{ grid-template-columns:1fr; } }


/* Blog GEO authority panel */
.blog-authority-panel{ max-width:920px; margin:26px auto 0; padding:22px 24px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--paper); text-align:left; box-shadow:var(--shadow-sm); }
.blog-authority-panel strong{ display:block; font-family:var(--serif); font-size:1.35rem; color:var(--ink); font-weight:600; }
.blog-authority-panel p{ margin-top:8px; color:#000; line-height:1.75; }


/* Richer blog authority modules */
.article-strength{ margin-top:42px; padding:26px; border:1px solid var(--line); border-radius:var(--radius-lg); background:linear-gradient(180deg,var(--paper),#fff); box-shadow:var(--shadow-sm); }
.article-strength h2{ margin-top:0; }
.article-related{ margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.article-related strong{ display:block; color:var(--ink); letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; }
.article-related ul{ display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; margin:12px 0 0; }
.article-related a{ display:inline-flex; padding:9px 12px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); text-decoration:none; font-size:.86rem; }
.article-related a:hover{ border-color:var(--gold); color:var(--teal); }
.article-faq{ margin-top:42px; }
.article-faq details{ border:1px solid var(--line); border-radius:var(--radius-md); padding:16px 18px; background:#fff; margin-top:12px; }
.article-faq summary{ cursor:pointer; font-weight:600; color:var(--ink); }
.article-faq details p{ margin-top:10px; }


/* Soirée étape explanation */
.soiree-etape{ background:var(--cream); }
.soiree-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-top:34px; }
.soiree-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow-sm); }
.soiree-card h3{ font-family:var(--serif); font-size:1.35rem; color:var(--ink); font-weight:600; }
.soiree-card p{ margin-top:10px; color:#000; line-height:1.7; }
.soiree-note{ max-width:900px; margin:24px auto 0; padding:18px 20px; border-left:4px solid var(--gold); background:#fff; border-radius:0 var(--radius-md) var(--radius-md) 0; color:#000; line-height:1.75; }
.soiree-actions{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:26px; }
@media (max-width:980px){ .soiree-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){ .soiree-grid{ grid-template-columns:1fr; } }


/* Cookie consent - subtle brand-consistent GDPR banner */
.cookie-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:10000;display:flex;justify-content:center;pointer-events:none}
.cookie-consent__card{width:min(920px,100%);background:rgba(255,252,247,.98);color:#2f2924;border:1px solid rgba(165,141,121,.35);box-shadow:0 20px 60px rgba(30,24,18,.22);border-radius:18px;padding:18px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:end;pointer-events:auto;backdrop-filter:blur(12px)}
.cookie-consent__intro strong{font-family:"Cormorant Garamond",serif;font-size:1.35rem;font-weight:600;color:var(--color-ink)}.cookie-consent__intro p{margin:.35rem 0 .45rem;line-height:1.55;font-size:.94rem}.cookie-consent__policy{font-size:.86rem;text-decoration:underline;text-underline-offset:3px;color:var(--color-accent-deep)}.cookie-consent__prefs{grid-column:1/-1;display:grid;gap:10px}.cookie-consent__prefs[hidden]{display:none}.cookie-consent__row{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid oklch(66% .041 62 / .28);border-radius:14px;padding:12px;background:#fff}.cookie-consent__row span{display:grid;gap:3px}.cookie-consent__row small{color:var(--color-muted);line-height:1.35}.cookie-consent__row input{width:22px;height:22px;accent-color:var(--color-accent)}.cookie-consent__row--disabled{opacity:.78}.cookie-consent__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.cookie-btn{min-height:44px;border-radius:999px;padding:0 16px;border:1px solid rgba(47,41,36,.2);font-family:inherit;font-weight:600;cursor:pointer}.cookie-btn--ghost{background:#fff;color:var(--color-ink-2)}.cookie-btn--primary{background:var(--color-taupe);color:var(--color-ink);border-color:var(--color-taupe)}.cookie-btn:hover{transform:translateY(-1px)}.cookie-policy h1{font-family:"Cormorant Garamond",serif;font-size:clamp(2rem,4vw,3rem);margin-top:0}.cookie-policy h2{margin-top:2rem;color:var(--color-ink-2)}.cookie-policy [hidden]{display:none!important}
@media (max-width:760px){.cookie-consent{left:10px;right:10px;bottom:74px}.cookie-consent__card{grid-template-columns:1fr;padding:15px;border-radius:16px}.cookie-consent__actions{display:grid;grid-template-columns:1fr;justify-content:stretch}.cookie-btn{width:100%}}


/* Uploaded room and bathroom photo strip */
.uploaded-room-details{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}
.uploaded-room-details img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line)}
@media (max-width:760px){.uploaded-room-details{grid-template-columns:1fr}}

/* Enhancement 2026: hosts portrait */
.intro-hosts{ max-width:880px; margin:46px auto 4px; }
.intro-hosts .intro-hosts__frame, .intro-hosts > img{ border-radius:var(--radius-lg); }
.intro-hosts figure, .intro-hosts{ overflow:visible; }
.intro-hosts img{ width:100%; display:block; border-radius:var(--radius-lg); box-shadow:none; clip-path:inset(0 round var(--radius-lg)); }
.intro-hosts figcaption{ margin-top:16px; font-size:.7rem; font-family:var(--sans); font-style:normal; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); text-align:center; }

@media (max-width:600px){ .hero__inner .eyebrow{ font-size:.6rem; letter-spacing:.22em; } }

/* Hero text link (secondary action) */
.hero-link{ display:inline-flex; align-items:center; gap:9px; color:#fff; font-size:.74rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; padding:15px 6px; border-bottom:1px solid rgba(255,255,255,.55); transition:border-color .25s, color .25s; }
.hero-link svg{ width:15px; height:15px; transition:transform .3s var(--ease); }
.hero-link:hover{ border-color:#fff; }
.hero-link:hover svg{ transform:translateX(4px); }
/* page-hero parallax needs room */
.page-hero__bg img{ will-change:transform; }

/* ============ Lightbox ============ */
.lb{ position:fixed; inset:0; z-index:120; background:rgba(14,13,12,.94); display:none; align-items:center; justify-content:center; padding:34px; }
.lb.open{ display:flex; }
.lb figure{ margin:0; max-width:min(1400px,92vw); text-align:center; }
.lb img{ max-width:92vw; max-height:82vh; width:auto; height:auto; margin-inline:auto; border-radius:6px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.lb figcaption{ color:rgba(255,255,255,.82); font-size:.9rem; margin-top:14px; letter-spacing:.02em; }
.lb button{ position:absolute; background:transparent; border:1px solid rgba(255,255,255,.35); color:#fff; border-radius:50%; width:52px; height:52px; font-size:1.5rem; line-height:1; display:grid; place-content:center; transition:background .25s, border-color .25s; }
.lb button:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.lb-close{ top:22px; right:22px; }
.lb-prev{ left:18px; top:50%; transform:translateY(-50%); }
.lb-next{ right:18px; top:50%; transform:translateY(-50%); }
@media (max-width:640px){ .lb{ padding:16px; } .lb-prev{ left:8px; } .lb-next{ right:8px; } .lb button{ width:44px; height:44px; } }

/* ============ Hero slideshow ============ */
.hero__bg.is-slideshow img{ animation:none; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; will-change:transform,opacity; }
/* ============ Gallery tile captions ============ */
.gallery__grid a{ position:relative; }
.tile-cap{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:30px 14px 12px; font-size:.76rem; letter-spacing:.04em; color:#fff; background:linear-gradient(transparent, rgba(10,10,10,.6)); opacity:0; transform:translateY(10px); transition:opacity .35s var(--ease), transform .35s var(--ease); pointer-events:none; }
.gal a:hover .tile-cap, .gal a:focus-visible .tile-cap,
.gallery__grid a:hover .tile-cap, .gallery__grid a:focus-visible .tile-cap{ opacity:1; transform:none; }
@media (hover:none){ .tile-cap{ display:none; } }
/* ============ Lightbox entrance ============ */
.lb.open figure{ animation:lbIn .4s var(--ease); }
@keyframes lbIn{ from{ opacity:0; transform:scale(.965); } }

/* Transparent header state: booking CTA as frosted ghost, solid when frosted */
.header:not(.scrolled) .nav-cta .resa-btn{ background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.75); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.header:not(.scrolled) .nav-cta .resa-btn:hover{ background:#fff; color:var(--ink); border-color:#fff; }

/* ============ Menu cards as links ============ */
a.menu-card{ color:inherit; }
.menu-card{ transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s; }
a.menu-card:hover{ transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.09); border-color:var(--gold-deep); }

/* ============ Intro: breakout family photo ============ */
.intro-hosts{ width:min(1160px, calc(100vw - 2*var(--gutter))); max-width:none; margin:52px 0 10px calc(50% - min(580px, 50vw - var(--gutter))); }

/* ============ Travel-mode: page adapts to traveler type ============ */
main#contenu{ display:flex; flex-direction:column; }
main#contenu > *{ order:10; }
main#contenu > .hero{ order:1; }
main#contenu > .exp{ order:2; }
/* #seminaires section removed from the homepage (merged into the affaires tab) */
body.travel-affaires main#contenu > .offers{ order:4; }

/* ============ Food collage: columns always level ============ */
.food-collage__stack{ grid-template-rows:1fr 1fr; }
.food-collage__stack img{ aspect-ratio:auto; height:100%; }

/* ============ Soirée étape formula cards ============ */
.etape-formules{ display:flex; flex-direction:column; gap:10px; margin-top:22px; }
.ef{ border:1px solid rgba(171,140,118,.28); border-radius:var(--radius-md); padding:13px 18px; background:#fff; }
.ef-top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.ef-top h4{ margin:0; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); }
.ef-price{ font-family:var(--serif); font-size:1.55rem; font-weight:600; color:var(--gold-deep); line-height:1; white-space:nowrap; }
.ef-inc{ margin:5px 0 0; font-size:.88rem; color:var(--ink-faint); line-height:1.55; }
.ef-note{ margin:12px 0 0; font-size:.78rem; letter-spacing:.02em; color:var(--ink-faint); }

/* ============ Offers: richer cards (dark section) ============ */
.offers__lede{ text-align:center; color:rgba(255,255,255,.82); margin:14px auto 0; max-width:560px; font-size:.98rem; }
.offer__price{ font-family:var(--serif); font-size:1.35rem; font-weight:600; color:var(--gold-bright); margin-top:4px; }
.offer__inc{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.9rem; color:rgba(255,255,255,.88); }
.offer__inc li{ display:flex; gap:9px; align-items:flex-start; }
.offer__inc svg{ width:15px; height:15px; flex:none; margin-top:3px; color:var(--gold-bright); }
.offers__proof{ display:block; text-align:center; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.72); margin-bottom:16px; }
@media (min-width:901px){ .offers__grid{ grid-template-columns:repeat(3,1fr); } }

/* ============================================================
   Affaires tab — two stacked blocks (soirée étape, then réunions).
   Appended last, and scoped with #panel-affaires (id) so it beats the
   earlier `.es-panel.active{display:grid}` and `.es-panel--biz.active`
   column rules regardless of source order.
   ============================================================ */
#panel-affaires.es-panel--biz.active{ display:block; grid-template-columns:none; }
#panel-affaires .biz-block{
  display:grid; grid-template-columns:1fr 1.1fr;
  gap:clamp(28px,4vw,64px); align-items:center;
}
#panel-affaires .biz-block--rev{ grid-template-columns:1.1fr 1fr; }
#panel-affaires .biz-block + .biz-block{
  margin-top:clamp(40px,5vw,72px); padding-top:clamp(40px,5vw,72px);
  border-top:1px solid var(--color-rule);
}
#panel-affaires .biz-block > img{
  width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--radius-lg); box-shadow:var(--shadow-md); align-self:stretch;
}
#panel-affaires .es-text{ min-width:0; }
@media (max-width:820px){
  #panel-affaires .biz-block,
  #panel-affaires .biz-block--rev{ grid-template-columns:1fr; }
  #panel-affaires .biz-block > img{ order:-1; }
}

/* ---- Real Google reviews ----
   Separate block from .proof-bar above: 4 stat columns and 3 review columns
   cannot align, so merging them into one framed panel made the internal
   dividers clash. Uses the site's standard card language (.soiree-card /
   .blog-card): white, hairline border, radius-lg, subtle shadow. */
.rev-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px; margin-top:clamp(30px,3.4vw,46px);
}
.rev{ margin:0; background:var(--color-white);
  border:1px solid var(--color-rule); border-radius:var(--radius-lg);
  padding:26px 26px 24px; box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column; gap:14px; }
.rev__top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.rev .stars{ color:var(--color-taupe); letter-spacing:.14em; font-size:.9rem; }
.rev__src{ font-size:var(--text-xs); letter-spacing:.16em; text-transform:uppercase;
  color:var(--color-accent-deep); font-weight:600; }
.rev blockquote{ margin:0; font-family:var(--font-body); font-style:normal;
  font-size:.95rem; line-height:1.65; color:var(--color-ink-2); }
.rev__who{ margin-top:auto; display:flex; flex-direction:column; gap:3px;
  padding-top:14px; border-top:1px solid var(--color-rule-2); }
.rev__who b{ font-weight:600; color:var(--color-ink); }
.rev__meta{ font-size:.8rem; color:var(--color-muted); }
@media (max-width:900px){ .rev-grid{ grid-template-columns:1fr; gap:14px; } }

/* The drawer's 4-pill language row is redundant now that the header dropdown
   shows on phones too. Declared here because .drawer-lang{display:flex} is
   defined further up the file and would otherwise win on source order. */
@media (max-width:1380px){ .drawer-lang{ display:none !important; } }

/* Narrow phones: keep logo + language + burger on one line comfortably. */
@media (max-width:420px){
  .nav-cta{ gap:8px; }
  .lang-current{ min-width:62px; height:36px; padding:0 9px; font-size:.68rem; }
  .lang-current span{ font-size:.9rem; }
}