/* ============================================================
   OLYMPIA — Reception · Restaurant · Catering
   High-end design system (dark luxe, champagne gold)
   ============================================================ */

:root {
  --ink: #0E1626;
  --char: #16223A;
  --char-2: #131D33;
  --ivory: #F4F1EA;
  --bone: #D3DAE4;
  --gold: #A9BED8;
  --gold-soft: #8FA6C4;
  --muted: #8E9AAD;
  --line: rgba(236,239,245, 0.14);
  --line-soft: rgba(236,239,245, 0.08);

  --font-display: "Playfair Display", Georgia, serif;   /* dramatic Didone — big statements */
  --font-serif: "Cormorant Garamond", Georgia, serif;         /* warm serif — mid headings, dish names */
  --font-ui: "Archivo", "Helvetica Neue", sans-serif;  /* grotesk — labels, nav, buttons */
  --font-body: "Archivo", "Helvetica Neue", sans-serif;  /* body copy */

  --pad-x: clamp(20px, 4.5vw, 72px);
  --sec-y: clamp(90px, 12vw, 180px);
  --radius: 2px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

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

html { scroll-behavior: initial; }
html.lenis, html.lenis body { --serif-boost: 1.08; height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }

body { --serif-boost: 1.08;
  background: var(--ink);
  color: var(--ivory);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
/* premium depth — warm spotlight + base tint behind everything */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(130% 90% at 50% -15%, rgba(169,190,216, 0.10), transparent 55%),
    radial-gradient(120% 80% at 100% 100%, rgba(169,190,216, 0.06), transparent 55%),
    linear-gradient(180deg, #0B1222 0%, var(--ink) 45%, #070C17 100%);
}

::selection { background: var(--gold); color: var(--ink); }

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; background: none; border: 0; cursor: pointer; color: inherit; }

/* ---------- grain + vignette glue ---------- */
.grain {
  pointer-events: none; position: fixed; inset: -100px; z-index: 2000;
  opacity: 0.05; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.8'/%3E%3C/svg%3E");
  animation: grain-shift 0.9s steps(2) infinite;
}
@keyframes grain-shift { 0%{transform:translate(0,0)} 50%{transform:translate(-40px,25px)} 100%{transform:translate(20px,-30px)} }

/* ---------- preloader ---------- */
.loader {
  position: fixed; inset: 0; z-index: 3000; background: var(--ink);
  display: flex; align-items: center; justify-content: center;
}
.loader__mark {
  font-family: var(--font-display); font-size: clamp(28px, 4vw, 52px);
  font-weight: 500; letter-spacing: 0.34em; text-transform: uppercase;
  color: var(--ivory); opacity: 0;
}
.loader__mark em { font-style: italic; color: var(--gold); }

/* ---------- header ---------- */
.site-head {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px var(--pad-x);
  transition: transform 0.6s var(--ease), background 0.5s, padding 0.5s;
}
.site-head.is-scrolled {
  background: rgba(11,18,34, 0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding: 14px var(--pad-x);
  border-bottom: 1px solid var(--line-soft);
}
.site-head.is-hidden { transform: translateY(-110%); }

.brand { display: flex; flex-direction: column; line-height: 1; z-index: 1001; }
.brand__word {
  font-family: var(--font-display); font-size: 27px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
}
.brand__word em { font-style: italic; color: var(--gold); font-weight: 500; }
.brand__sub {
  font-family: var(--font-ui); margin-top: 7px; font-size: 8.5px; letter-spacing: 0.42em;
  text-transform: uppercase; color: var(--muted); font-weight: 400;
}

.nav { display: flex; gap: clamp(18px, 2.6vw, 40px); align-items: center; }
.nav a {
  font-family: var(--font-ui); position: relative; font-size: 12.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--bone); padding: 6px 0; font-weight: 400;
}
.nav a::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: var(--gold); transform: scaleX(0); transform-origin: right;
  transition: transform 0.5s var(--ease);
}
.nav a:hover::after, .nav a.is-active::after { transform: scaleX(1); transform-origin: left; }
.nav a.is-active { color: var(--ivory); }

.head-cta { display: flex; align-items: center; gap: 14px; }

/* ---------- buttons ---------- */
.btn {
  --btn-bg: transparent;
  font-family: var(--font-ui); font-weight: 400;
  position: relative; display: inline-flex; align-items: center; gap: 12px;
  padding: 15px 30px; border: 1px solid var(--gold);
  font-size: 11.5px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--ivory); overflow: hidden; border-radius: var(--radius);
  transition: color 0.45s var(--ease), border-color 0.45s;
  isolation: isolate;
}
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--gold); transform: translateY(101%);
  transition: transform 0.55s var(--ease);
}
.btn:hover { color: var(--ink); }
.btn:hover::before { transform: translateY(0); }
.btn--solid { background: var(--gold); color: var(--ink); }
.btn--solid::before { background: var(--ivory); transform: translateY(101%); }
.btn--solid:hover { color: var(--ink); border-color: var(--ivory); }
.btn--ghost { border-color: var(--line); }
.btn--ghost:hover { border-color: var(--gold); }

.link-arrow {
  font-family: var(--font-ui); font-weight: 400;
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold);
}
.link-arrow svg { transition: transform 0.4s var(--ease); }
.link-arrow:hover svg { transform: translateX(6px); }

/* ---------- typography ---------- */
.eyebrow {
  font-family: var(--font-ui); font-weight: 400;
  display: inline-flex; align-items: center; gap: 14px;
  font-size: 11px; letter-spacing: 0.4em; text-transform: uppercase; color: var(--gold);
}
.eyebrow::before { content: ""; width: 44px; height: 1px; background: var(--gold); }
.eyebrow--center::after { content: ""; width: 44px; height: 1px; background: var(--gold); }

.h-display {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(44px, 7.6vw, 120px); line-height: 1.0; letter-spacing: -0.018em;
}
.h-1 {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(36px, 5.4vw, 86px); line-height: 1.03; letter-spacing: -0.015em;
}
.h-2 {
  font-family: var(--font-serif); font-weight: 380;
  font-size: clamp(28px, 3.8vw, 56px); line-height: 1.08; letter-spacing: -0.005em;
}
.h-3 { font-family: var(--font-serif); font-weight: 420; font-size: clamp(21px, 2.2vw, 30px); line-height: 1.2; }
.h-display em, .h-1 em { font-style: italic; color: var(--gold); font-weight: 500; }
.h-2 em, .h-3 em { font-style: italic; color: var(--gold); font-weight: 380; }

.lead { font-size: clamp(16px, 1.4vw, 19px); color: var(--bone); line-height: 1.75; font-weight: 300; }
.body-m { font-size: 15px; color: var(--muted); line-height: 1.8; }
.caption { font-family: var(--font-ui); font-weight: 400; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted); }

/* ---------- layout helpers ---------- */
.section { position: relative; padding: var(--sec-y) var(--pad-x); }
.section--flush { padding-left: 0; padding-right: 0; }
.section--tint { background: var(--char); }
.wrap { max-width: 1480px; margin: 0 auto; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(40px, 6vw, 110px); align-items: center; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 3vw, 48px); }

.rule { height: 1px; background: var(--line-soft); border: 0; }

/* ---------- image treatment ---------- */
.img-par { position: relative; overflow: hidden; border-radius: var(--radius); }
.img-par img {
  width: 100%; height: 110%; object-fit: cover;
  will-change: transform; transform: translateY(0);
}
.img-frame { position: relative; overflow: hidden; }
.img-frame img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.img-frame:hover img { transform: scale(1.05); }
.img-veil::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,18,34,0.05) 40%, rgba(11,18,34,0.55) 100%);
  pointer-events: none;
}

/* ---------- hero ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; }
.hero__bg { position: absolute; inset: 0; overflow: hidden; }
.hero__bg img, .hero__bg video { width: 100%; height: 100%; object-fit: cover; transform-origin: center; }
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(11,18,34,0.55) 0%, rgba(11,18,34,0.18) 40%, rgba(11,18,34,0.82) 100%);
}
.hero__content { position: relative; z-index: 2; width: 100%; padding: 0 var(--pad-x) clamp(56px, 8vh, 110px); }
.hero__meta { display: flex; gap: clamp(24px, 4vw, 72px); margin-top: 36px; flex-wrap: wrap; }
.hero__meta div { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--bone); }
.hero__meta span { display: block; color: var(--gold); margin-bottom: 6px; font-size: 10px; letter-spacing: 0.34em; }
.hero__scroll {
  position: absolute; right: var(--pad-x); bottom: clamp(56px, 8vh, 110px); z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  font-size: 9.5px; letter-spacing: 0.4em; text-transform: uppercase; color: var(--muted);
  writing-mode: vertical-rl;
}
.hero__scroll::after { content: ""; width: 1px; height: 56px; background: linear-gradient(var(--gold), transparent); }

/* ---------- pillars (home triptych) ---------- */
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--ink); }
.pillar { position: relative; height: clamp(480px, 72vh, 760px); overflow: hidden; display: flex; align-items: flex-end; }
.pillar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease), filter 1.4s var(--ease); filter: brightness(0.62) saturate(0.92); }
.pillar:hover img { transform: scale(1.06); filter: brightness(0.8) saturate(1); }
.pillar::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(11,18,34,0.88)); }
.pillar__body { --serif-boost: 1.08; position: relative; z-index: 2; padding: clamp(28px, 3vw, 48px); width: 100%; }
.pillar__num { font-family: var(--font-display); font-style: italic; color: var(--gold); font-size: 15px; letter-spacing: 0.1em; }
.pillar__title { font-family: var(--font-display); font-weight: 350; font-size: clamp(28px, 2.6vw, 42px); margin: 10px 0 8px; letter-spacing: 0.04em; }
.pillar__sub { font-size: 13.5px; color: var(--bone); max-width: 34ch; margin-bottom: 18px; font-weight: 300; }

/* ---------- feature trio ---------- */
.feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--line-soft); border: 1px solid var(--line-soft); }
.feat { background: var(--char); padding: clamp(32px, 3.4vw, 56px); }
.feat__icon { color: var(--gold); margin-bottom: 22px; }
.feat h4 { font-family: var(--font-display); font-weight: 400; font-size: 21px; margin-bottom: 12px; }
.feat p { font-size: 14px; color: var(--muted); line-height: 1.75; }

/* ---------- stats strip ---------- */
.stats { display: flex; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.stat { flex: 1 1 160px; }
.stat__num {
  font-family: var(--font-display); font-weight: 320;
  font-size: clamp(44px, 5vw, 76px); line-height: 1; color: var(--ivory);
}
.stat__num em { font-style: italic; color: var(--gold); font-size: 0.6em; }
.stat__label { margin-top: 10px; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted); }

/* ---------- testimonials marquee ---------- */
.marquee { overflow: hidden; padding: 8px 0; }
.marquee__track { display: flex; gap: clamp(20px, 2vw, 32px); width: max-content; will-change: transform; }
.t-card {
  width: clamp(320px, 30vw, 460px); flex-shrink: 0;
  background: var(--char); border: 1px solid var(--line-soft);
  padding: clamp(28px, 2.6vw, 44px); border-radius: var(--radius);
  display: flex; flex-direction: column; gap: 22px;
}
.t-card__stars { color: var(--gold); letter-spacing: 4px; font-size: 13px; }
.t-card__quote { font-size: 15.5px; line-height: 1.75; color: var(--bone); font-weight: 300; flex: 1; }
.t-card__who { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--muted); }
.t-card__who b { display: block; color: var(--ivory); font-weight: 500; letter-spacing: 0.2em; margin-bottom: 4px; }

/* ---------- banquet CTA band ---------- */
.cta-band { position: relative; overflow: hidden; }
.cta-band__bg { position: absolute; inset: 0; }
.cta-band__bg img { width: 100%; height: 115%; object-fit: cover; }
.cta-band__bg::after { content: ""; position: absolute; inset: 0; background: rgba(11,18,34, 0.78); }
.cta-band__inner { position: relative; z-index: 2; text-align: center; padding: clamp(90px, 12vw, 170px) var(--pad-x); }
.cta-band__inner .h-1 { max-width: 22ch; margin: 18px auto 16px; }
.cta-band__inner .lead { max-width: 52ch; margin: 0 auto 40px; }

/* ---------- menu ---------- */
.menu-cats { position: sticky; top: 76px; z-index: 500; display: flex; gap: 8px; flex-wrap: wrap; padding: 14px var(--pad-x); background: rgba(11,18,34,0.86); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line-soft); }
.menu-cats a { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; padding: 9px 18px; border: 1px solid var(--line-soft); border-radius: 40px; color: var(--bone); transition: all 0.35s var(--ease); }
.menu-cats a:hover, .menu-cats a.is-active { border-color: var(--gold); color: var(--gold); }
.menu-sec { padding: clamp(60px, 7vw, 110px) var(--pad-x); }
.menu-sec + .menu-sec { border-top: 1px solid var(--line-soft); }
.menu-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px clamp(40px, 5vw, 90px); margin-top: 44px; }
.dish { display: flex; flex-direction: column; padding: 20px 0; border-bottom: 1px solid var(--line-soft); }
.dish__row { display: flex; align-items: baseline; gap: 12px; }
.dish__name { font-family: var(--font-display); font-size: 19px; font-weight: 400; }
.dish__dots { flex: 1; border-bottom: 1px dotted rgba(236,239,245,0.25); transform: translateY(-4px); }
.dish__price { color: var(--gold); font-size: 15px; letter-spacing: 0.04em; }
.dish__desc { margin-top: 7px; font-size: 13.5px; color: var(--muted); line-height: 1.65; max-width: 52ch; }

/* ---------- forms ---------- */
.field { position: relative; display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 10.5px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted); }
.field input, .field textarea, .field select {
  background: transparent; border: 0; border-bottom: 1px solid var(--line);
  padding: 12px 0; color: var(--ivory); font: inherit; font-size: 15px; outline: none;
  transition: border-color 0.4s; border-radius: 0;
}
.field input:focus, .field textarea:focus { border-color: var(--gold); }

/* ---------- footer ---------- */
.footer { background: var(--char); border-top: 1px solid var(--line-soft); padding: clamp(70px, 8vw, 120px) var(--pad-x) 36px; }
.footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.2fr; gap: clamp(32px, 4vw, 72px); }
.footer h5 { font-size: 11px; letter-spacing: 0.34em; text-transform: uppercase; color: var(--gold); margin-bottom: 22px; font-weight: 500; }
.footer li { margin-bottom: 12px; }
.footer li a, .footer li span { font-size: 14px; color: var(--bone); font-weight: 300; }
.footer li a { transition: color 0.3s; }
.footer li a:hover { color: var(--gold); }
.footer__brandline { font-family: var(--font-display); font-size: clamp(54px, 9vw, 150px); font-weight: 320; letter-spacing: 0.14em; text-transform: uppercase; text-align: center; color: rgba(236,239,245,0.07); margin: clamp(50px, 7vw, 100px) 0 30px; line-height: 1; user-select: none; }
.footer__base { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 28px; border-top: 1px solid var(--line-soft); }
.footer__base span { font-size: 11.5px; letter-spacing: 0.14em; color: var(--muted); }

/* ---------- reveal primitives (JS adds motion) ---------- */
html.js [data-reveal] { opacity: 0; transform: translateY(36px); }
[data-reveal-img] .rv-img { clip-path: inset(0 0 100% 0); }
/* The line-reveal mask clips to the line box, which is shorter than the type:
   descenders (y, p, g) and italic ascenders were being sliced off every
   headline on the site. Pad the mask and pull the padding back out of the
   layout, so the clip box is taller than the text but the metrics are
   unchanged. The pre-roll offset grows past the extra bottom padding so the
   line still starts fully hidden. */
.split-line { display: block; overflow: hidden;
  padding: 0.16em 0 0.24em; margin: -0.16em 0 -0.24em; }
html.js .split-line .line { display: block; transform: translateY(140%); }

/* no-js / reduced motion safety */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .split-line .line { transform: none !important; }
}

/* ---------- mobile ---------- */
.burger { display: none; z-index: 1001; flex-direction: column; gap: 6px; padding: 8px 0; }
.burger span { display: block; width: 30px; height: 1.5px; background: var(--ivory); transition: transform 0.45s var(--ease), opacity 0.3s; }
.m-nav {
  position: fixed; inset: 0; z-index: 950; background: var(--ink);
  display: flex; flex-direction: column; justify-content: center; padding: 0 var(--pad-x);
  clip-path: inset(0 0 100% 0); transition: clip-path 0.7s var(--ease);
}
.m-nav.is-open { clip-path: inset(0 0 0% 0); }
.m-nav a { font-family: var(--font-display); font-size: clamp(34px, 9vw, 54px); font-weight: 340; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.m-nav a em { font-style: italic; color: var(--gold); font-size: 0.5em; margin-right: 18px; }
.m-nav__meta { margin-top: 34px; display: flex; flex-direction: column; gap: 8px; color: var(--muted); font-size: 13px; }
body.nav-lock { overflow: hidden; }
.burger.is-open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

@media (max-width: 980px) {
  .nav, .head-cta .btn { display: none; }
  .burger { display: flex; }
  .grid-2, .menu-grid, .footer__grid { grid-template-columns: 1fr; }
  .pillars, .grid-3, .feats { grid-template-columns: 1fr; }
  .pillar { height: 68vh; }
  .hero__scroll { display: none; }
  .stats { gap: 40px; }
  .stat { flex: 1 1 40%; }
}

/* ============================================================
   PORTAL — full-screen three-panel chooser (site entry /)
   ============================================================ */
.portal { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; }
.portal__head {
  position: absolute; top: 0; left: 0; right: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  padding: 26px var(--pad-x); pointer-events: none;
}
.portal__head .brand, .portal__head .portal__links { pointer-events: auto; }
.portal__links { display: flex; gap: 26px; }
.portal__links a { font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--bone); position: relative; }
.portal__links a::after { content:""; position:absolute; left:0; bottom:-5px; height:1px; width:100%; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease); }
.portal__links a:hover::after { transform:scaleX(1); transform-origin:left; }

.portal__panels { flex: 1; display: flex; min-height: 0; }
.portal-panel {
  position: relative; flex: 1 1 0%; overflow: hidden;
  display: flex; align-items: flex-end;
  transition: flex-grow 0.9s var(--ease);
  border-right: 1px solid rgba(169,190,216,0.28);
}
.portal-panel:last-child { border-right: 0; }
.portal-panel__bg { position: absolute; inset: 0; }
.portal-panel__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(0.62) saturate(0.95); transition: filter 0.9s var(--ease), transform 1.2s var(--ease); transform: scale(1.02); }
.portal-panel::after { content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(11,18,34,0.2) 0%, transparent 40%, rgba(11,18,34,0.9) 100%); pointer-events:none; }
.portal-panel:hover { flex-grow: 1.9; }
.portal-panel:hover .portal-panel__bg img { filter: brightness(0.9) saturate(1.05); transform: scale(1.08); }

.portal-panel__inner { position: relative; z-index: 3; padding: clamp(30px,3.4vw,60px); width: 100%; }
.portal-panel__idx { font-family: var(--font-display); font-style: italic; font-size: 15px; color: var(--gold); letter-spacing: 0.06em; }
.portal-panel__title { font-family: var(--font-display); font-weight: 340; font-size: clamp(32px,3.4vw,58px); line-height: 1.02; margin: 12px 0 10px; letter-spacing: 0.02em; }
.portal-panel__sub { font-size: 14px; color: var(--bone); max-width: 30ch; font-weight: 300; opacity: 0.85; }
.portal-panel__enter {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 22px;
  font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--gold);
  opacity: 0; transform: translateY(10px); transition: opacity 0.5s var(--ease), transform 0.5s var(--ease);
}
.portal-panel:hover .portal-panel__enter { opacity: 1; transform: translateY(0); }
.portal-panel__enter svg { transition: transform 0.4s var(--ease); }
.portal-panel:hover .portal-panel__enter svg { transform: translateX(6px); }

.portal__foot {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 15;
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding: 16px var(--pad-x); pointer-events: none;
}
.portal__foot span, .portal__foot a { font-size: 11px; letter-spacing: 0.14em; color: var(--muted); pointer-events: auto; }
.portal__foot a { color: var(--bone); }
.portal__foot a:hover { color: var(--gold); }

@media (max-width: 860px) {
  .portal__panels { flex-direction: column; }
  .portal-panel { border-right: 0; border-bottom: 1px solid rgba(169,190,216,0.28); }
  .portal-panel:hover { flex-grow: 1; }
  .portal-panel__enter { opacity: 1; transform: none; }
  .portal__foot { position: static; justify-content: center; text-align: center; background: var(--char); }
  .portal__links { display: none; }
}

/* ============================================================
   TYPE ROLE ASSIGNMENTS (four-family system)
   Bodoni Moda = display · Fraunces = mid serif · Jost = UI · Hanken = body
   ============================================================ */
.pillar__num, .stat__label, .menu-cats a, .dish__price,
.field label, .footer h5, .footer__base span, .t-card__who,
.portal-panel__enter, .portal__links a, .portal__foot span, .portal__foot a,
.hero__meta div, .hero__meta span, .hero__scroll {
  font-family: var(--font-ui);
}
.stat__num, .footer__brandline, .portal-panel__title, .pillar__title {
  font-family: var(--font-display); font-weight: 500;
}
.pillar__title { letter-spacing: 0.01em; }
.portal-panel__title { letter-spacing: 0.005em; }
.feat h4, .dish__name, .portal-panel__idx { font-family: var(--font-serif); }
.portal-panel__idx { font-style: italic; }
.stat__num em { font-family: var(--font-serif); }
/* Bodoni hairlines: crisper rendering on the big display type */
.h-display, .h-1, .portal-panel__title, .pillar__title, .footer__brandline, .stat__num, .loader__mark {
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}

/* ============================================================
   VIRTUAL TOUR — Matterport (click-to-load)
   ============================================================ */
.tour{ position:relative; }
.tour__frame{
  position:relative; aspect-ratio:16/9; width:100%; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--radius); background:var(--char);
  box-shadow:0 40px 90px -50px rgba(0,0,0,.9);
}
.tour__poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.62) saturate(.95); transition:filter .8s var(--ease), transform 1.2s var(--ease); }
.tour__frame:hover .tour__poster{ filter:brightness(.78); transform:scale(1.04); }
.tour__frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,18,34,.2),rgba(11,18,34,.55)); pointer-events:none; }
.tour__cta{
  position:absolute; inset:0; z-index:3; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:22px; cursor:pointer; border:0; background:none;
}
.tour__play{
  width:92px; height:92px; border-radius:50%; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center; color:var(--gold);
  background:rgba(11,18,34,.35); backdrop-filter:blur(4px);
  transition:transform .5s var(--ease), background .5s, color .5s;
}
.tour__cta:hover .tour__play{ transform:scale(1.08); background:var(--gold); color:var(--ink); }
.tour__play svg{ margin-left:5px; }
.tour__label{ font-family:var(--font-ui); font-size:12px; letter-spacing:.32em; text-transform:uppercase; color:var(--ivory); }
.tour__label b{ display:block; font-family:var(--font-serif); font-weight:400; font-size:24px; letter-spacing:.02em; text-transform:none; color:var(--ivory); margin-top:8px; }
.tour__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.tour__note{ margin-top:16px; text-align:center; }

/* ============================================================
   SIGNATURE PLATES — styled real-dish gallery
   ============================================================ */
.plate-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line-soft); border:1px solid var(--line-soft); }
.plate{ position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--ink); }
.plate img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease), filter .8s var(--ease); filter:brightness(.92); }
.plate:hover img{ transform:scale(1.07); filter:brightness(1); }
.plate__cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:18px 18px 16px; display:flex; justify-content:space-between; align-items:flex-end; gap:10px;
  background:linear-gradient(180deg,transparent,rgba(11,18,34,.86)); transform:translateY(8px); opacity:0; transition:opacity .5s var(--ease), transform .5s var(--ease); }
.plate:hover .plate__cap{ opacity:1; transform:translateY(0); }
.plate__cap h4{ font-family:var(--font-serif); font-weight:420; font-size:16px; line-height:1.15; }
.plate__cap span{ font-family:var(--font-ui); font-size:12px; color:var(--gold); white-space:nowrap; }
@media (max-width:980px){ .plate-grid{ grid-template-columns:repeat(2,1fr);} .plate__cap{opacity:1;transform:none;} }

/* ============================================================
   REAL REELS — actual venue footage, vertical cards
   ============================================================ */
.reels{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.4vw,20px); }
.reel{ position:relative; aspect-ratio:9/16; overflow:hidden; border-radius:var(--radius);
  border:1px solid var(--line-soft); background:var(--char); }
.reel video, .reel img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.reel::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(11,18,34,.82)); }
.reel__cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:20px 18px; }
.reel__cap h4{ font-family:var(--font-serif); font-weight:420; font-size:17px; }
.reel__cap span{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold); display:block; margin-bottom:7px; }
.reel__badge{ position:absolute; top:14px; left:14px; z-index:3; font-family:var(--font-ui);
  font-size:9.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--ivory);
  background:rgba(11,18,34,.55); border:1px solid rgba(236,239,245,.22);
  padding:6px 11px; border-radius:40px; backdrop-filter:blur(6px); }
@media (max-width:980px){ .reels{ grid-template-columns:repeat(2,1fr);} }

/* ---------- hero 3D tour CTA ---------- */
.hero__tour{ display:inline-flex; align-items:center; gap:14px; margin-top:30px;
  padding:13px 22px 13px 14px; border:1px solid rgba(169,190,216,.5); border-radius:60px;
  background:rgba(11,18,34,.42); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:border-color .45s var(--ease), background .45s var(--ease); }
.hero__tour:hover{ border-color:var(--gold); background:rgba(11,18,34,.62); }
.hero__tour i{ display:flex; align-items:center; justify-content:center; width:38px; height:38px;
  border-radius:50%; background:var(--gold); color:var(--ink); flex-shrink:0;
  transition:transform .45s var(--ease); }
.hero__tour:hover i{ transform:scale(1.08); }
.hero__tour i svg{ margin-left:2px; }
.hero__tour span{ display:block; font-family:var(--font-ui); font-size:9.5px; letter-spacing:.32em;
  text-transform:uppercase; color:var(--gold); margin-bottom:4px; }
.hero__tour b{ display:block; font-family:var(--font-serif); font-weight:420; font-size:16px;
  letter-spacing:.01em; color:var(--ivory); }
@media (max-width:600px){ .hero__tour b{ font-size:14px; } }

/* ============================================================
   EVENT INQUIRY FORM
   ============================================================ */
.inquiry{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,80px); align-items:start; }
.inquiry__form{ display:grid; grid-template-columns:1fr 1fr; gap:22px 20px; }
.inquiry__form .field--full{ grid-column:1 / -1; }
.inquiry__form select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);
  background-position:calc(100% - 14px) 22px, calc(100% - 9px) 22px; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:28px; }
.inquiry__form select option{ background:var(--char); color:var(--ivory); }
.inquiry__aside{ border:1px solid var(--line-soft); background:var(--char); padding:clamp(26px,3vw,42px); border-radius:var(--radius); }
.inquiry__aside h4{ font-family:var(--font-serif); font-weight:420; font-size:20px; margin-bottom:18px; }
.inquiry__list{ display:flex; flex-direction:column; gap:16px; }
.inquiry__list li{ display:flex; gap:14px; align-items:flex-start; font-size:14.5px; color:var(--bone); font-weight:300; }
.inquiry__list li b{ color:var(--gold); font-family:var(--font-ui); font-size:11px; letter-spacing:.2em; flex-shrink:0; padding-top:3px; }
.inquiry__contact{ margin-top:28px; padding-top:24px; border-top:1px solid var(--line-soft); }
.inquiry__contact a{ display:block; font-family:var(--font-serif); font-size:22px; color:var(--ivory); margin-bottom:6px; }
.inquiry__contact a:hover{ color:var(--gold); }
.inquiry__contact span{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--muted); }
@media (max-width:980px){ .inquiry, .inquiry__form{ grid-template-columns:1fr; } }

/* ============================================================
   BOOKING MODAL + FORM STATES
   ============================================================ */
.modal{ position:fixed; inset:0; z-index:4000; display:none; align-items:center; justify-content:center; padding:20px; }
.modal.is-open{ display:flex; }
.modal__veil{ position:absolute; inset:0; background:rgba(6,10,19,.82); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.modal__box{ position:relative; z-index:2; width:min(560px,100%); max-height:90vh; overflow:auto;
  background:var(--char); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(28px,4vw,46px); box-shadow:0 50px 120px -40px #000; }
.modal__close{ position:absolute; top:16px; right:18px; width:34px; height:34px; border-radius:50%;
  border:1px solid var(--line); color:var(--bone); display:flex; align-items:center; justify-content:center;
  font-size:17px; line-height:1; transition:border-color .35s,color .35s; }
.modal__close:hover{ border-color:var(--gold); color:var(--gold); }
.modal__box .eyebrow{ margin-bottom:14px; }
.modal__box h3{ font-family:var(--font-display); font-weight:500; font-size:clamp(26px,3.2vw,36px); line-height:1.05; margin-bottom:10px; }
.modal__box h3 em{ font-style:italic; color:var(--gold); }
.modal__box > p{ color:var(--muted); font-size:14.5px; margin-bottom:26px; }
.modal__form{ display:grid; grid-template-columns:1fr 1fr; gap:20px 18px; }
.modal__form .field--full{ grid-column:1 / -1; }
.hp{ position:absolute!important; left:-9999px!important; opacity:0; height:0; width:0; }

.form-note{ grid-column:1/-1; font-size:13px; line-height:1.6; padding:14px 16px; border-radius:var(--radius); display:none; }
.form-note.is-ok{ display:block; background:rgba(169,190,216,.12); border:1px solid rgba(169,190,216,.45); color:var(--ivory); }
.form-note.is-err{ display:block; background:rgba(190,80,60,.12); border:1px solid rgba(190,80,60,.5); color:#f0d9d3; }
button.btn[disabled]{ opacity:.55; pointer-events:none; }
@media (max-width:600px){ .modal__form{ grid-template-columns:1fr; } }

/* tag-capture helper (dev) */
.tagmode{ position:fixed; left:16px; bottom:16px; z-index:5000; background:rgba(11,18,34,.92);
  border:1px solid var(--gold); border-radius:6px; padding:12px 14px; font-family:monospace;
  font-size:11.5px; color:var(--gold); max-width:340px; display:none; }
.tagmode.is-on{ display:block; }

/* ---------- dish thumbnails on the menu ---------- */
.dish{ display:flex; gap:16px; align-items:flex-start; }
.dish__thumb{ flex-shrink:0; width:84px; height:84px; overflow:hidden; border-radius:2px;
  border:1px solid var(--line-soft); background:var(--char); }
.dish__thumb img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease), filter .6s; filter:brightness(.94); }
.dish:hover .dish__thumb img{ transform:scale(1.08); filter:brightness(1.06); }
.dish__body{ flex:1; min-width:0; }
@media (max-width:600px){ .dish__thumb{ width:66px; height:66px; } }

/* ============================================================
   THE BUFFET  —  restaurant signature section
   ============================================================ */
.buffet__head{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,60px);
  align-items:end; margin-bottom:clamp(40px,5vw,72px); }
.buffet{ display:grid; grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);
  gap:clamp(24px,3.4vw,54px); align-items:start; }

.buffet__signature{ margin:0 0 clamp(22px,2.6vw,36px); padding:clamp(18px,2vw,26px);
  border:1px solid rgba(169,190,216,.28); border-radius:var(--radius);
  background:rgba(169,190,216,.05); }

/* --- price cards --- */
.buffet__prices{ display:flex; flex-direction:column; gap:14px; }
.price{ position:relative; border:1px solid var(--line-soft); background:var(--char);
  padding:clamp(22px,2.4vw,32px); border-radius:var(--radius); overflow:hidden;
  transition:border-color .5s var(--ease), transform .6s var(--ease), background .5s; }
.price::before{ content:""; position:absolute; inset:0 auto 0 0; width:2px; background:var(--gold);
  transform:scaleY(0); transform-origin:top; transition:transform .7s var(--ease); }
.price:hover{ border-color:var(--line); transform:translateY(-3px); background:var(--char-2); }
.price:hover::before{ transform:scaleY(1); }
.price__tag{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--muted); display:block; }
.price__name{ font-family:var(--font-serif); font-size:clamp(19px,1.7vw,23px); font-weight:420;
  color:var(--ivory); margin-top:9px; }
.price__fig{ display:flex; align-items:baseline; gap:3px; margin:16px 0 14px;
  font-family:var(--font-display); color:var(--gold); }
.price__fig b{ font-size:clamp(42px,4.6vw,60px); font-weight:400; line-height:.9; }
.price__fig sup{ font-size:clamp(17px,1.6vw,21px); top:-.55em; position:relative; }
.price__fig span{ font-family:var(--font-ui); font-size:11px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted); margin-left:9px; }
.price__note{ font-family:var(--font-body); font-size:14px; line-height:1.62; color:var(--bone); }
.price__note em{ color:var(--gold); font-style:italic; }
.price--feature{ background:var(--char-2); border-color:rgba(169,190,216,.34); }
.price--feature::before{ transform:scaleY(1); }
.price__ribbon{ position:absolute; top:0; right:0; background:var(--gold); color:var(--ink);
  font-family:var(--font-ui); font-size:9.5px; letter-spacing:.2em; text-transform:uppercase;
  padding:7px 13px; }

/* --- visual mosaic --- */
.buffet__vis{ display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:minmax(0,1fr); gap:14px; }
.buffet__tile{ position:relative; overflow:hidden; border-radius:var(--radius);
  border:1px solid var(--line-soft); background:var(--char); aspect-ratio:1/1; }
.buffet__tile--tall{ grid-row:span 2; aspect-ratio:auto; }
.buffet__tile--wide{ grid-column:span 2; aspect-ratio:16/9; }
.buffet__tile img, .buffet__tile video{ width:100%; height:100%; object-fit:cover; display:block;
  filter:brightness(.9); transition:transform 1.1s var(--ease), filter .6s; }
.buffet__tile:hover img, .buffet__tile:hover video{ transform:scale(1.06); filter:brightness(1.02); }
.buffet__tile figcaption{ position:absolute; left:0; right:0; bottom:0; padding:26px 18px 15px;
  font-family:var(--font-ui); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ivory); background:linear-gradient(to top, rgba(11,18,34,.9), transparent); }

/* --- foot --- */
.buffet__foot{ margin-top:clamp(34px,4vw,56px); padding-top:clamp(26px,3vw,38px);
  border-top:1px solid var(--line-soft); display:flex; justify-content:space-between;
  align-items:center; gap:24px; flex-wrap:wrap; }
.buffet__acts{ display:flex; gap:14px; flex-wrap:wrap; }

@media (max-width:980px){
  .buffet__head{ grid-template-columns:1fr; gap:18px; }
  .buffet{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .buffet__vis{ grid-template-columns:1fr; }
  .buffet__tile--tall, .buffet__tile--wide{ grid-row:auto; grid-column:auto; aspect-ratio:4/3; }
  .buffet__foot{ flex-direction:column; align-items:flex-start; }
}

/* ============================================================
   TOUR LINK  —  slim pointer to the /visit walkthrough page
   ============================================================ */
.tour-link{ display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:clamp(18px,2.4vw,34px); padding:clamp(24px,3vw,40px) clamp(22px,3vw,44px);
  border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--char);
  text-decoration:none; transition:border-color .5s var(--ease), background .5s var(--ease); }
.tour-link:hover{ border-color:rgba(169,190,216,.44); background:var(--char-2); }
.tour-link__ico{ width:clamp(50px,5vw,64px); aspect-ratio:1; border-radius:50%; flex-shrink:0;
  border:1px solid rgba(169,190,216,.5); color:var(--gold); display:grid; place-items:center;
  transition:background .5s var(--ease), color .5s var(--ease); }
.tour-link:hover .tour-link__ico{ background:var(--gold); color:var(--ink); }
.tour-link__ico svg{ margin-left:4px; }
.tour-link__txt b{ display:block; font-family:var(--font-serif); font-weight:420;
  font-size:clamp(19px,1.9vw,25px); color:var(--ivory); margin-bottom:8px; }
.tour-link__txt span{ font-family:var(--font-body); font-size:14.5px; line-height:1.62;
  color:var(--bone); display:block; max-width:60ch; }
.tour-link__go{ font-family:var(--font-ui); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold); white-space:nowrap; }
@media (max-width:820px){
  .tour-link{ grid-template-columns:auto 1fr; }
  .tour-link__go{ grid-column:1 / -1; }
}

/* ---- visit page section heads ---- */
.visit__head{ display:grid; grid-template-columns:1fr auto; gap:clamp(20px,3vw,50px);
  align-items:end; margin-bottom:clamp(30px,3.6vw,52px); }
@media (max-width:820px){ .visit__head{ grid-template-columns:1fr; } }

/* ============================================================
   RAIL  —  horizontal card scroller (signature dishes)
   ============================================================ */
.rail{ position:relative; }
.rail__track{ display:flex; gap:clamp(14px,1.8vw,24px); overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; scrollbar-width:none;
  padding-bottom:6px; cursor:grab; }
.rail__track::-webkit-scrollbar{ display:none; }
.rail__track.is-drag{ cursor:grabbing; scroll-snap-type:none; }
.rail__card{ flex:0 0 clamp(240px, 26vw, 330px); scroll-snap-align:start;
  border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--char);
  overflow:hidden; transition:border-color .5s var(--ease), transform .6s var(--ease); }
.rail__card:hover{ border-color:rgba(169,190,216,.4); transform:translateY(-4px); }
.rail__img{ aspect-ratio:1/1; overflow:hidden; }
.rail__img img{ width:100%; height:100%; object-fit:cover; display:block; filter:brightness(.92);
  transition:transform 1.1s var(--ease), filter .6s; }
.rail__card:hover .rail__img img{ transform:scale(1.07); filter:brightness(1.04); }
.rail__body{ padding:18px 18px 22px; position:relative; }
.rail__no{ font-family:var(--font-display); font-style:italic; font-size:13px; color:var(--muted);
  letter-spacing:.08em; }
.rail__row{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-top:8px; }
.rail__row h3{ font-family:var(--font-serif); font-size:clamp(17px,1.5vw,20px); font-weight:420;
  color:var(--ivory); line-height:1.25; }
.rail__row b{ color:var(--gold); font-family:var(--font-ui); font-weight:400; font-size:12.5px;
  letter-spacing:.06em; white-space:nowrap; }
.rail__body p{ margin-top:10px; font-family:var(--font-body); font-size:13.5px; line-height:1.6;
  color:var(--muted); }
.rail__ui{ display:flex; align-items:center; gap:clamp(20px,3vw,40px); margin-top:clamp(20px,2.6vw,32px); }
.rail__bar{ flex:1; height:1px; background:var(--line-soft); position:relative; overflow:hidden; }
.rail__bar span{ position:absolute; inset:0; background:var(--gold); transform-origin:left;
  transform:scaleX(.2); transition:transform .3s var(--ease); }
.rail__arrows{ display:flex; gap:10px; }
.rail__arrows button{ width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:transparent; color:var(--ivory); display:grid; place-items:center; cursor:pointer;
  transition:background .4s var(--ease), color .4s var(--ease), border-color .4s; }
.rail__arrows button:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
@media (max-width:600px){ .rail__card{ flex-basis:74vw; } }

/* rail CTA card (links to /visit) */
.rail__card--cta{ display:flex; text-decoration:none; background:var(--char-2);
  border-color:rgba(169,190,216,.3); }
.rail__body--cta{ display:flex; flex-direction:column; height:100%; padding:26px 22px; }
.rail__body--cta p{ color:var(--bone); }
.rail__card--cta:hover{ border-color:var(--gold); }

/* Screenshot/print rigs with implausibly tall viewports: keep vh sections sane. */
@media (min-height: 6000px){
  .hero{ min-height:820px; }
  .portal{ height:820px; }
}

/* ---- portal live-3D panels ---- */
.portal-panel__bg iframe{
  position:absolute; inset:-12%; width:124%; height:124%; border:0;
  pointer-events:none; opacity:0; transition:opacity 1.4s var(--ease);
  filter:brightness(0.72) saturate(0.95);
}
.portal-panel__bg iframe.is-live{ opacity:1; }
.portal-panel:hover .portal-panel__bg iframe{ filter:brightness(0.92) saturate(1.05); }
.portal-panel__live{
  position:absolute; bottom:24px; right:26px; z-index:3;
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-ui); font-size:9.5px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--ivory); background:rgba(11,18,34,.55); backdrop-filter:blur(8px);
  border:1px solid rgba(169,190,216,.4); border-radius:2px; padding:8px 13px;
}
.portal-panel__live::before{
  content:""; width:6px; height:6px; border-radius:50%; background:#A9BED8;
  animation:live-dot 2s ease-in-out infinite;
}
@keyframes live-dot{ 0%,100%{opacity:.4} 50%{opacity:1} }
@media (max-width:860px){
  /* phones: keep the poster image — two live 3D engines is too heavy */
  .portal-panel__bg iframe{ display:none; }
  .portal-panel__live{ bottom:18px; right:18px; }
}

/* ============================================================
   PORTAL v2 — framed live-3D cards with buttons below
   ============================================================ */
.portal__cards{
  min-height:0; display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(18px,2.4vw,36px); padding:clamp(14px,2vw,28px) var(--pad-x) clamp(10px,1.6vw,22px);
  align-items:stretch;
}
.portal-card{ display:flex; flex-direction:column; min-height:0; }
.portal-card__frame{
  position:relative; flex:none; aspect-ratio:16/10; min-height:0; overflow:hidden;
  border:1px solid rgba(169,190,216,.38); border-radius:var(--radius);
  background:var(--char); box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.portal-card__frame img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:brightness(.8); transition:opacity 1s var(--ease);
}
.portal-card__frame iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  opacity:0; transition:opacity 1.2s var(--ease);
}
.portal-card__frame iframe.is-live{ opacity:1; }
.portal-card__frame.is-live img{ opacity:0; pointer-events:none; }
.portal-card__live{
  position:absolute; top:16px; right:16px; z-index:3; pointer-events:none;
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-ui); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ivory); background:rgba(11,18,34,.6); backdrop-filter:blur(8px);
  border:1px solid rgba(169,190,216,.4); border-radius:2px; padding:8px 13px;
}
.portal-card__live::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--gold);
  animation:live-dot 2s ease-in-out infinite;
}
.portal-card__meta{
  display:flex; align-items:flex-end; justify-content:space-between; gap:22px;
  padding:clamp(14px,1.8vw,22px) 4px 0;
}
.portal-card__idx{ font-family:var(--font-display); font-style:italic; font-size:13px; color:var(--gold); letter-spacing:.1em; }
.portal-card__title{
  font-family:var(--font-display); font-weight:500; color:var(--ivory);
  font-size:clamp(22px,2.4vw,34px); line-height:1.05; margin-top:6px; letter-spacing:-0.01em;
}
.portal-card__sub{
  font-family:var(--font-body); font-size:13.5px; line-height:1.6; color:var(--muted);
  max-width:44ch; margin-top:8px;
}
.portal-card__meta .btn{ flex-shrink:0; white-space:nowrap; }
@media (max-width:900px){
  .portal{ height:auto; min-height:100svh; overflow:visible; }
  .portal__cards{ grid-template-columns:1fr; }
  .portal-card__frame{ flex:none; aspect-ratio:4/3; }
  .portal-card__meta{ flex-direction:column; align-items:flex-start; }
  .portal-card__meta .btn{ width:100%; justify-content:center; }
}

/* portal v2: head + foot participate in the flex column (no overlay collisions) */
.portal__head{ position:static; pointer-events:auto; padding:20px var(--pad-x) 6px; }
.portal__foot{ position:static; pointer-events:auto; padding:10px var(--pad-x) 16px; }

.portal-card__live em{ font-style:normal; }
@media (max-width:900px){
  .portal-card__live .live-more{ display:none; }
}

/* ============================================================
   OLYMPIA CIRCLE — marketing list signup (CASL-compliant)
   ============================================================ */
.circle{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(30px,4.5vw,80px); align-items:start; }
.circle__form{ display:flex; flex-direction:column; gap:24px; background:var(--char);
  border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(24px,3vw,44px); }
.circle__grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.circle__tags{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.tag-check input{ position:absolute; opacity:0; pointer-events:none; }
.tag-check span{ display:inline-block; padding:10px 16px; border:1px solid var(--line);
  border-radius:2px; font-family:var(--font-ui); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--bone); cursor:pointer;
  transition:background .35s var(--ease), color .35s, border-color .35s; }
.tag-check input:checked + span{ background:var(--gold); color:var(--ink); border-color:var(--gold); }
.tag-check input:focus-visible + span{ outline:2px solid var(--gold); outline-offset:2px; }
.check{ display:flex; gap:12px; align-items:flex-start; cursor:pointer; }
.check input{ margin-top:4px; width:15px; height:15px; accent-color:var(--gold); flex-shrink:0; }
.check span{ font-family:var(--font-body); font-size:13px; line-height:1.6; color:var(--muted); }
@media (max-width:900px){
  .circle{ grid-template-columns:1fr; }
  .circle__grid{ grid-template-columns:1fr; }
}

/* how-to-walk hint on live portal tours */
.frame-hint{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  display:flex; align-items:center; gap:10px; z-index:5; pointer-events:none;
  background:rgba(11,18,34,.82); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(169,190,216,.45); border-radius:100px;
  padding:10px 18px; color:var(--ivory); white-space:nowrap;
  font-family:var(--font-ui); font-size:11.5px; letter-spacing:.08em;
  animation:hint-pulse 3s ease-in-out infinite 2s;
}
.frame-hint svg{ color:var(--gold); flex-shrink:0; }
.frame-hint b{ color:var(--gold); font-weight:500; }
.frame-hint.is-done{ animation:none; opacity:0; transition:opacity .6s; }
@keyframes hint-pulse{ 0%,100%{ border-color:rgba(169,190,216,.45);} 50%{ border-color:rgba(169,190,216,.9);} }
@media (max-width:560px){ .frame-hint{ white-space:normal; text-align:center; max-width:86%; } }

/* language toggle */
.lang-switch{
  font-family:var(--font-ui); font-size:11px; letter-spacing:.2em; color:var(--gold)!important;
  border:1px solid rgba(169,190,216,.45); border-radius:2px; padding:6px 10px!important;
  transition:background .35s var(--ease), color .35s;
}
.lang-switch:hover{ background:var(--gold); color:var(--ink)!important; }
.nav .lang-switch::after{ display:none; }
.m-nav .lang-switch{ display:inline-block; margin:18px 0 0; font-size:12px; }

/* under-engine loading state for live tours */
.frame-loading{
  position:absolute; inset:0; z-index:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:16px;
  background:radial-gradient(90% 70% at 50% 40%, #131D31 0%, var(--char) 65%, var(--ink) 100%);
}
.frame-loading span{
  width:42px; height:42px; border-radius:50%;
  border:1.5px solid rgba(169,190,216,.25); border-top-color:var(--gold);
  animation:fl-spin 1s linear infinite;
}
.frame-loading b{
  font-family:var(--font-ui); font-weight:400; font-size:11px;
  letter-spacing:.26em; text-transform:uppercase; color:var(--muted);
}
@keyframes fl-spin{ to{ transform:rotate(360deg); } }
.portal-card__frame iframe{ z-index:1; }

/* covers Matterport's outbound logo corner with our own mark */
.frame-cap{
  position:absolute; top:0; left:0; z-index:3; pointer-events:auto; cursor:default;
  min-width:300px; padding:20px 70px 24px 18px; user-select:none;
  font-family:var(--font-display); font-size:15px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--ivory);
  background:linear-gradient(120deg, #0B1222 0%, #0B1222 62%, rgba(11,18,34,.85) 80%, transparent 100%);
  border-radius:var(--radius) 0 22px 0;
}
.frame-cap em{ font-style:italic; color:var(--gold); }
@media (max-width:700px){
  .frame-cap{ font-size:12.5px; min-width:270px; padding:16px 60px 20px 14px; }
}

/* portal photo panels (replaced the live 3D embeds) */
.portal-card__frame--photo{ display:block; cursor:pointer; }
.portal-card__frame--photo img{ width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.001); filter:brightness(.94) saturate(1.04);
  transition:transform 1.6s var(--ease), filter .8s; }
.portal-card:hover .portal-card__frame--photo img{ transform:scale(1.06); filter:brightness(1.03) saturate(1.08); }
.portal-card__live a{ color:inherit; }

/* ============================================================
   SCROLL-SCRUB HERO — the film advances as you scroll
   ============================================================ */
.hero-scrub{ position:relative; height:320vh; }
.hero-scrub__stage{ position:sticky; top:0; height:100vh; overflow:hidden; }
.hero-scrub__stage .hero__bg{ position:absolute; inset:0; }
.hero-scrub__stage .hero__bg video{ width:100%; height:100%; object-fit:cover; }
.hero-scrub__bar{ position:absolute; left:0; right:0; bottom:0; height:2px;
  background:rgba(236,239,245,.08); z-index:5; }
.hero-scrub__bar span{ display:block; height:100%; width:100%; background:var(--gold);
  transform:scaleX(0); transform-origin:left; }
@media (prefers-reduced-motion: reduce){
  .hero-scrub{ height:auto; }
  .hero-scrub__stage{ position:relative; }
  .hero-scrub__bar{ display:none; }
}

/* ============================================================
   HAUTE FINITION — agency-tier polish layer
   ============================================================ */

/* --- scrolled nav: a flush bar, not a floating capsule ---
   The capsule detached with top:10px and an inset on both sides, which left a
   strip of the page showing above and beside it — read as a stray gap rather
   than as a deliberate island. The bar now meets the top edge. --- */
.site-head.is-scrolled{
  left:0; right:0; top:0;
  border-radius:0; border:0; border-bottom:1px solid rgba(236,239,245,.10);
  box-shadow:0 18px 40px -26px rgba(0,0,0,.65);
  padding:10px var(--pad-x);
}

/* --- cinematic entrances: weight + focus pull --- */
html.js [data-reveal]{ opacity:0; transform:translateY(42px); filter:blur(10px); }
@media (prefers-reduced-motion: reduce){ [data-reveal]{ filter:none !important; } }

/* --- double-bezel: cards read as machined objects, not rectangles --- */
.price, .rail__card, .circle__form, .tour-link, .feat, .t-card{
  box-shadow: inset 0 1px 0 rgba(236,239,245,.05), 0 24px 60px -32px rgba(0,0,0,.55);
}
.img-frame, .img-par, .buffet__tile, .portal-card__frame{
  position:relative;
}
.img-frame::after, .img-par::after, .buffet__tile::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  box-shadow: inset 0 0 0 1px rgba(236,239,245,.08), inset 0 1px 0 rgba(236,239,245,.10);
}

/* --- button-in-button: solid CTAs carry a nested arrow chip --- */
.btn--solid{ gap:14px; padding-right:12px; }
.btn__chip{
  width:30px; height:30px; border-radius:50%; flex-shrink:0;
  background:rgba(11,18,34,.14); color:inherit;
  display:inline-flex; align-items:center; justify-content:center;
  transition:transform .5s var(--ease), background .5s var(--ease);
}
.btn--solid:hover .btn__chip{ transform:translate(3px,-2px); background:rgba(11,18,34,.22); }
.btn:active{ transform:scale(.98); }

/* --- staggered mask reveal for the mobile menu --- */
.m-nav a, .m-nav .m-nav__acc-head, .m-nav .m-nav__meta{
  opacity:0; transform:translateY(26px);
  transition:opacity .6s var(--ease), transform .7s var(--ease);
}
.m-nav.is-open a, .m-nav.is-open .m-nav__acc-head, .m-nav.is-open .m-nav__meta{
  opacity:1; transform:translateY(0);
}
/* the accordion sits inside a wrapper, so the nth-child stagger below
   skips it — give the wrapper and its head their own beat */
.m-nav.is-open .m-nav__acc-head{ transition-delay:.16s; }
.m-nav.is-open .m-nav__acc-body a{ transition-delay:0s; }
.m-nav.is-open a:nth-child(1){ transition-delay:.10s }
.m-nav.is-open a:nth-child(2){ transition-delay:.16s }
.m-nav.is-open a:nth-child(3){ transition-delay:.22s }
.m-nav.is-open a:nth-child(4){ transition-delay:.28s }
.m-nav.is-open a:nth-child(5){ transition-delay:.34s }
.m-nav.is-open a:nth-child(6){ transition-delay:.40s }
.m-nav.is-open a:nth-child(7){ transition-delay:.46s }
.m-nav.is-open .m-nav__meta{ transition-delay:.54s }

/* --- numerals set like a ledger --- */
.price__fig, .stat__num, .dish__price, .rail__row b{ font-variant-numeric:tabular-nums; }

/* --- bespoke scrollbar --- */
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--ink); }
::-webkit-scrollbar-thumb{ background:#1D2A42; border-radius:100px; border:3px solid var(--ink); }
::-webkit-scrollbar-thumb:hover{ background:var(--gold-soft); }
html{ scrollbar-color:#1D2A42 var(--ink); scrollbar-width:thin; }

/* --- focus ring worthy of the brand --- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--gold); outline-offset:3px; border-radius:2px;
}

/* portal photo cards: stretched cover link + interactive 3D chip */
.portal-card__cover{ position:absolute; inset:0; z-index:2; }
.portal-card__frame--photo img{ position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; filter:brightness(.88); transition:transform 1.4s var(--ease), filter .8s; }
.portal-card__frame--photo:hover img{ transform:scale(1.045); filter:brightness(1); }
a.portal-card__live{ pointer-events:auto; z-index:3; transition:background .4s var(--ease), border-color .4s; }
a.portal-card__live:hover{ background:rgba(169,190,216,.25); border-color:var(--gold); }

/* ============================================================
   ORDER / DELIVERY
   ============================================================ */
.ord-mode{ display:flex; align-items:center; gap:10px; margin-top:clamp(28px,3vw,40px); flex-wrap:wrap; }
.ord-mode button{
  font-family:var(--font-ui); font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  padding:13px 26px; border:1px solid var(--line); border-radius:100px; color:var(--bone);
  transition:background .45s var(--ease), color .45s, border-color .45s;
}
.ord-mode button.is-on{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.ord-mode button:not(.is-on):hover{ border-color:var(--gold); color:var(--ivory); }
.ord-eta{ font-family:var(--font-body); font-size:13.5px; color:var(--muted); margin-left:6px; }
.ord-mode--sm{ margin:0 0 20px; }
.ord-mode--sm button{ flex:1; padding:11px 12px; font-size:10px; }

/* sticky category bar */
.ord-bar{ position:sticky; top:0; z-index:60; background:rgba(11,18,34,.9);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.ord-bar__in{ display:flex; align-items:center; gap:18px; padding-top:14px; padding-bottom:14px; }
#ord-search{
  flex:0 0 clamp(180px,22vw,280px); background:var(--char); border:1px solid var(--line-soft);
  border-radius:100px; padding:11px 18px; color:var(--ivory); font-family:var(--font-body); font-size:14px;
}
#ord-search:focus{ outline:none; border-color:rgba(169,190,216,.5); }
.ord-nav{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; }
.ord-nav::-webkit-scrollbar{ display:none; }
.ord-nav button{
  white-space:nowrap; font-family:var(--font-ui); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted); padding:9px 14px; border-radius:100px;
  border:1px solid transparent; transition:color .4s, border-color .4s;
}
.ord-nav button:hover{ color:var(--gold); border-color:rgba(169,190,216,.35); }

/* dish grid */
.ord-cat{ margin-bottom:clamp(46px,5vw,72px); }
.ord-cat__title{ font-family:var(--font-display); font-weight:500; letter-spacing:-.01em;
  font-size:clamp(26px,3.2vw,42px); color:var(--ivory); margin-bottom:clamp(20px,2.4vw,32px); }
.ord-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:clamp(14px,1.6vw,22px); }
.ord-item{ display:flex; gap:16px; padding:14px; border:1px solid var(--line-soft);
  border-radius:var(--radius); background:var(--char);
  box-shadow:inset 0 1px 0 rgba(236,239,245,.04);
  transition:border-color .5s var(--ease), transform .5s var(--ease); }
.ord-item:hover{ border-color:rgba(169,190,216,.34); transform:translateY(-2px); }
.ord-item__img{ width:96px; height:96px; flex-shrink:0; border-radius:2px; overflow:hidden; background:var(--char-2); }
.ord-item__img img{ width:100%; height:100%; object-fit:cover; filter:brightness(.95); }
.ord-item__body{ flex:1; min-width:0; display:flex; flex-direction:column; }
.ord-item__body h3{ font-family:var(--font-serif); font-weight:420; font-size:16px; color:var(--ivory); line-height:1.25; }
.ord-item__body p{ font-family:var(--font-body); font-size:12.5px; line-height:1.55; color:var(--muted);
  margin-top:5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ord-item__foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:10px; }
.ord-item__foot b{ font-family:var(--font-display); font-size:17px; color:var(--gold); font-variant-numeric:tabular-nums; }
.ord-add{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-ui); font-size:10px;
  letter-spacing:.2em; text-transform:uppercase; color:var(--ivory); border:1px solid var(--line);
  border-radius:100px; padding:8px 14px; transition:background .4s var(--ease), color .4s, border-color .4s; }
.ord-add span{ font-size:14px; line-height:1; }
.ord-add:hover{ border-color:var(--gold); background:var(--gold); color:var(--ink); }
.ord-add.is-added{ background:var(--gold); border-color:var(--gold); color:var(--ink); }

/* cart button + fab */
.cart-btn{ font-family:var(--font-ui); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  border:1px solid var(--gold); border-radius:100px; padding:12px 22px; color:var(--ivory);
  display:inline-flex; align-items:center; gap:10px; transition:background .4s var(--ease), color .4s; }
.cart-btn:hover{ background:var(--gold); color:var(--ink); }
.cart-btn [data-cart-count]{ background:var(--gold); color:var(--ink); border-radius:100px;
  min-width:20px; height:20px; display:inline-grid; place-items:center; font-size:11px; padding:0 6px; }
.cart-fab{ position:fixed; right:clamp(16px,3vw,34px); bottom:clamp(16px,3vw,34px); z-index:800;
  width:62px; height:62px; border-radius:50%; background:var(--gold); color:var(--ink);
  display:grid; place-items:center; box-shadow:0 18px 40px -12px rgba(0,0,0,.7);
  transition:transform .5s var(--ease); }
.cart-fab:hover{ transform:scale(1.06); }
.cart-fab [data-cart-count]{ position:absolute; top:-4px; right:-4px; background:var(--ink); color:var(--gold);
  border:1px solid var(--gold); border-radius:100px; min-width:22px; height:22px; display:none;
  place-items:center; font-family:var(--font-ui); font-size:11px; padding:0 6px; }
.cart-fab [data-cart-count].is-on{ display:grid; }

/* drawer */
.cart-drawer{ position:fixed; inset:0; z-index:1500; pointer-events:none; }
.cart-drawer.is-open{ pointer-events:auto; }
.cart-drawer__scrim{ position:absolute; inset:0; background:rgba(5,8,16,.72);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; transition:opacity .5s var(--ease); }
.cart-drawer.is-open .cart-drawer__scrim{ opacity:1; }
.cart-drawer__panel{ position:absolute; top:0; right:0; height:100%; width:min(460px,100%);
  background:var(--ink); border-left:1px solid var(--line-soft); overflow-y:auto;
  padding:clamp(20px,3vw,32px); transform:translateX(100%);
  transition:transform .65s var(--ease); }
.cart-drawer.is-open .cart-drawer__panel{ transform:translateX(0); }
.cart-drawer__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.cart-close{ font-size:30px; line-height:1; color:var(--muted); transition:color .3s; }
.cart-close:hover{ color:var(--gold); }
.cart-body{ display:flex; flex-direction:column; }
.cart-empty{ text-align:center; padding:44px 0; }
.cart-empty p{ font-family:var(--font-serif); font-size:18px; color:var(--bone); }
.cart-empty span{ display:block; margin-top:8px; font-size:13px; color:var(--muted); }
.cart-row{ display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:14px;
  padding:14px 0; border-bottom:1px solid var(--line-soft); }
.cart-row__t b{ display:block; font-family:var(--font-serif); font-weight:420; font-size:14.5px; color:var(--ivory); }
.cart-row__t span{ font-size:12px; color:var(--muted); }
.cart-row__p{ font-family:var(--font-display); color:var(--gold); font-size:15px; font-variant-numeric:tabular-nums; min-width:62px; text-align:right; }
.qty{ display:inline-flex; align-items:center; gap:10px; border:1px solid var(--line-soft); border-radius:100px; padding:4px 8px; }
.qty button{ width:22px; height:22px; border-radius:50%; color:var(--gold); font-size:15px; line-height:1;
  display:grid; place-items:center; transition:background .3s; }
.qty button:hover{ background:rgba(169,190,216,.18); }
.qty span{ min-width:16px; text-align:center; font-family:var(--font-ui); font-size:13px; font-variant-numeric:tabular-nums; }
.cart-sums{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.cart-sums div{ display:flex; justify-content:space-between; align-items:baseline; padding:6px 0;
  font-family:var(--font-body); font-size:13.5px; color:var(--muted); }
.cart-sums div b{ color:var(--bone); font-variant-numeric:tabular-nums; font-weight:400; }
.cart-sums__total{ margin-top:8px; padding-top:12px !important; border-top:1px solid var(--line-soft); }
.cart-sums__total span{ font-family:var(--font-serif); font-size:16px; color:var(--ivory); }
.cart-sums__total b{ font-family:var(--font-display); font-size:24px; color:var(--gold) !important; }
.cart-min{ margin-top:10px; font-size:12.5px; color:var(--gold); }
.cart-form{ margin-top:24px; display:flex; flex-direction:column; gap:16px; }
.cart-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.cart-pay{ font-size:12.5px; line-height:1.6; color:var(--muted); }
.cart-form .btn{ width:100%; justify-content:center; }
.cart-form .btn:disabled{ opacity:.4; pointer-events:none; }

@media (max-width:700px){
  .ord-bar__in{ flex-direction:column; align-items:stretch; gap:12px; }
  #ord-search{ flex:none; width:100%; }
  .ord-grid{ grid-template-columns:1fr; }
  .cart-form__grid{ grid-template-columns:1fr; }
  .cart-btn{ display:none; }
}

/* ---- engraved brand mark on the portal photos ---- */
/* soft corner scrim so the mark reads over any photograph */
.portal-card__frame--photo::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(148deg, rgba(7,11,22,.82) 0%, rgba(7,11,22,.55) 26%,
                             rgba(7,11,22,.16) 46%, transparent 62%);
}
.portal-mark{
  position:absolute; left:clamp(20px,2.6vw,40px); top:clamp(20px,2.6vw,38px); z-index:3;
  display:flex; flex-direction:column; align-items:flex-start; pointer-events:none;
  text-shadow:0 2px 18px rgba(0,0,0,.9), 0 1px 3px rgba(0,0,0,.7);
}
.portal-mark__orn{ color:var(--gold); opacity:.9; margin-bottom:9px; }
.portal-mark__word{
  font-family:var(--font-display); font-weight:600; font-style:normal;
  font-size:clamp(24px,2.9vw,40px); letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); line-height:1;
}
.portal-mark__rule{
  width:100%; min-width:120px; height:1px; margin:11px 0 9px;
  background:linear-gradient(90deg, rgba(169,190,216,.75), rgba(169,190,216,0));
}
.portal-mark__sub{
  font-family:var(--font-ui); font-size:clamp(8.5px,.72vw,10.5px); letter-spacing:.44em;
  text-transform:uppercase; color:var(--ivory); opacity:.92;
}
@media (max-width:600px){
  .portal-mark{ left:16px; top:14px; }
  .portal-mark__rule{ min-width:92px; margin:8px 0 7px; }
}

/* ============================================================
   CHOOSE YOUR TABLE — interactive floor plan
   ============================================================ */
.tables-layout{ display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:clamp(22px,3vw,44px); align-items:start; }
.tables-map{ position:sticky; top:90px; background:var(--char);
  border:1px solid var(--line-soft); border-radius:var(--radius);
  padding:clamp(14px,1.6vw,24px);
  box-shadow:inset 0 1px 0 rgba(236,239,245,.05), 0 24px 60px -32px rgba(0,0,0,.55); }
#tablemap{ width:100%; height:auto; display:block; }

#tablemap .walls path{ fill:#0C1424; stroke:rgba(236,239,245,.28); stroke-width:2.5; }
#tablemap .landmark rect{ fill:rgba(236,239,245,.05); stroke:rgba(236,239,245,.14); }
#tablemap .landmark text, #tablemap .glass text{
  fill:var(--muted); font-family:var(--font-ui); font-size:11px; letter-spacing:.3em;
  text-anchor:middle; }
#tablemap .glass line{ stroke:rgba(140,180,220,.5); stroke-width:3; stroke-dasharray:14 8; }

#tablemap .tbl{ cursor:pointer; outline:none; }
#tablemap .tbl circle:not(.chair), #tablemap .tbl rect{
  fill:#131D33; stroke:rgba(169,190,216,.55); stroke-width:1.6;
  transition:fill .3s, stroke .3s; }
#tablemap .tbl .chair{ fill:none; stroke:rgba(236,239,245,.22); stroke-width:1.2; }
#tablemap .tbl text{
  fill:var(--bone); font-family:var(--font-display); font-size:17px;
  text-anchor:middle; pointer-events:none; }
#tablemap .tbl:hover circle:not(.chair), #tablemap .tbl:hover rect,
#tablemap .tbl:focus-visible circle:not(.chair), #tablemap .tbl:focus-visible rect{
  stroke:var(--gold); fill:#1C2B45; }
#tablemap .tbl.is-picked circle:not(.chair), #tablemap .tbl.is-picked rect{
  fill:var(--gold); stroke:var(--gold); }
#tablemap .tbl.is-picked text{ fill:var(--ink); font-weight:600; }
#tablemap .tbl--room text{ font-family:var(--font-ui); font-size:12px; letter-spacing:.24em; fill:var(--bone); }
#tablemap .tbl--room .sub{ font-family:var(--font-display); font-size:20px; }
#tablemap .tbl--room.is-picked text{ fill:var(--ink); }

.tables-legend{ display:flex; gap:22px; flex-wrap:wrap; margin-top:14px;
  font-family:var(--font-ui); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted); }
.tables-legend span{ display:inline-flex; align-items:center; gap:8px; }
.lg{ width:14px; height:14px; border-radius:3px; display:inline-block; }
.lg--tbl{ background:#131D33; border:1.6px solid rgba(169,190,216,.55); }
.lg--pick{ background:var(--gold); }
.lg--room{ background:rgba(236,239,245,.06); border:1.6px solid rgba(169,190,216,.35); }

.tables-side{ background:var(--char); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:clamp(20px,2.4vw,32px);
  box-shadow:inset 0 1px 0 rgba(236,239,245,.05), 0 24px 60px -32px rgba(0,0,0,.55); }
.picked-chip{ display:none; margin-bottom:20px; padding:14px 18px;
  border:1px solid rgba(169,190,216,.45); border-radius:2px; background:rgba(169,190,216,.08); }
.picked-chip.is-on{ display:block; }
.picked-chip span{ display:block; font-family:var(--font-ui); font-size:9.5px;
  letter-spacing:.3em; text-transform:uppercase; color:var(--muted); margin-bottom:5px; }
.picked-chip b{ font-family:var(--font-serif); font-weight:420; font-size:16px; color:var(--gold); }

@media (max-width:900px){
  .tables-layout{ grid-template-columns:1fr; }
  .tables-map{ position:static; }
}

/* ============================================================
   MENU — printed-menu rows + floating photo peek
   ============================================================ */
/* rows: name only; the old inline thumbnail disappears on fine pointers */
@media (pointer: fine){
  .dish .dish__thumb{ display:none; }
  .dish{ cursor:default; }
  .dish:hover .dish__name{ color:var(--gold); }
  .dish__name{ transition:color .35s var(--ease); }
}

/* the floating photo card */
.dish-peek{
  position:fixed; left:0; top:0; z-index:1200; width:360px; pointer-events:none;
  opacity:0; scale:.94; transition:opacity .35s var(--ease), scale .45s var(--ease);
  border:1px solid rgba(169,190,216,.5); border-radius:3px; overflow:hidden;
  background:var(--char);
  box-shadow:0 40px 90px -20px rgba(0,0,0,.85), inset 0 1px 0 rgba(236,239,245,.08);
  will-change:transform;
}
.dish-peek.is-on{ opacity:1; scale:1; }
.dish-peek img{ display:block; width:100%; height:264px; object-fit:cover; }
.dish-peek span{
  display:block; padding:10px 16px 12px;
  font-family:var(--font-serif); font-weight:420; font-size:14.5px; color:var(--ivory);
  border-top:1px solid rgba(169,190,216,.3);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* touch: tap a dish to unfold a big photo inline */
@media (pointer: coarse){
  .dish{ flex-wrap:wrap; }
  .dish .dish__thumb{
    display:block; order:2; width:100%; height:auto; aspect-ratio:16/10;
    max-height:0; opacity:0; margin-top:0; overflow:hidden; border-radius:3px;
    border-color:transparent;
    transition:max-height .6s var(--ease), opacity .5s var(--ease), margin-top .5s var(--ease);
  }
  .dish.show-photo .dish__thumb{
    max-height:340px; opacity:1; margin-top:14px;
    border-color:rgba(169,190,216,.4);
  }
  .dish .dish__thumb img{ width:100%; height:100%; object-fit:cover; }
  .dish__peek-btn{
    margin-left:12px; flex-shrink:0;
    font-family:var(--font-ui); font-size:9px; letter-spacing:.24em; text-transform:uppercase;
    color:var(--gold); border:1px solid rgba(169,190,216,.45); border-radius:100px;
    padding:5px 12px; transition:background .35s var(--ease), color .35s;
  }
  .dish.show-photo .dish__peek-btn{ background:var(--gold); color:var(--ink); }
}
@media (pointer: fine){ .dish__peek-btn{ display:none; } }

/* order cards without a photo: quiet monogram tile */
.ord-item__img--none{ display:grid; place-items:center; }
.ord-item__img--none span{
  font-family:var(--font-display); font-style:italic; font-size:30px;
  color:rgba(169,190,216,.35); }

/* ============================================================
   MENU PAGE — cuisine switch + collapsible sections
   ============================================================ */
.cuisine-bar{ position:sticky; top:0; z-index:60; background:rgba(11,18,34,.92);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.cuisine-bar__in{ display:flex; align-items:center; justify-content:space-between;
  gap:18px; padding-top:14px; padding-bottom:14px; flex-wrap:wrap; }
.cuisine-switch{ display:inline-flex; gap:6px; padding:5px;
  border:1px solid var(--line-soft); border-radius:100px; background:var(--char); }
.cuisine-switch button{
  font-family:var(--font-ui); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--bone); padding:11px 22px; border-radius:100px;
  transition:background .45s var(--ease), color .45s var(--ease); white-space:nowrap; }
.cuisine-switch button.is-on{ background:var(--gold); color:var(--ink); }
.cuisine-switch button:not(.is-on):hover{ color:var(--ivory); background:rgba(236,239,245,.05); }
.menu-expand{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); border:1px solid rgba(169,190,216,.4);
  border-radius:100px; padding:10px 18px; transition:background .4s var(--ease), color .4s; }
.menu-expand:hover{ background:var(--gold); color:var(--ink); }

.menu-wrap{ max-width:900px; }
.mcat{ border-bottom:1px solid var(--line-soft); }
.mcat__head{ width:100%; display:flex; align-items:center; gap:16px;
  padding:clamp(20px,2.4vw,30px) 0; text-align:left; }
.mcat__title{ flex:1; font-family:var(--font-display); font-weight:500;
  font-size:clamp(21px,2.6vw,32px); color:var(--ivory); letter-spacing:-.01em;
  transition:color .35s var(--ease); }
.mcat__head:hover .mcat__title{ color:var(--gold); }
.mcat__meta{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.2em; color:var(--muted); }
.mcat__chev{ width:26px; height:26px; border-radius:50%; flex-shrink:0; position:relative;
  border:1px solid rgba(169,190,216,.45); transition:background .4s var(--ease), transform .5s var(--ease); }
.mcat__chev::before, .mcat__chev::after{ content:""; position:absolute; inset:0; margin:auto;
  background:var(--gold); transition:opacity .35s var(--ease), background .35s; }
.mcat__chev::before{ width:11px; height:1.4px; }
.mcat__chev::after{ width:1.4px; height:11px; }
.mcat__head[aria-expanded="true"] .mcat__chev{ background:var(--gold); transform:rotate(180deg); }
.mcat__head[aria-expanded="true"] .mcat__chev::before{ background:var(--ink); }
.mcat__head[aria-expanded="true"] .mcat__chev::after{ opacity:0; }
.mcat__body{ overflow:hidden; max-height:0;
  transition:max-height .5s var(--ease); }
.mcat__body > .dish:last-child{ border-bottom:0; padding-bottom:26px; }
@media (max-width:600px){
  .cuisine-bar__in{ flex-direction:column; align-items:stretch; }
  .cuisine-switch{ width:100%; justify-content:space-between; }
  .cuisine-switch button{ flex:1; padding:11px 8px; font-size:9.5px; letter-spacing:.12em; }
  .menu-expand{ width:100%; }
}

/* ============================================================
   PORTAL TILES — quick-access squares under the two main cards
   ============================================================ */
.portal-tiles{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(10px,1.2vw,16px);
  padding:clamp(6px,1vw,14px) var(--pad-x) clamp(10px,1.4vw,18px);
}
.ptile{
  display:flex; align-items:center; gap:14px;
  padding:clamp(14px,1.5vw,20px) clamp(14px,1.6vw,22px);
  border:1px solid var(--line-soft); border-radius:var(--radius);
  background:var(--char); position:relative; overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(236,239,245,.05);
  transition:border-color .5s var(--ease), transform .5s var(--ease), background .5s var(--ease);
}
.ptile::after{ content:""; position:absolute; inset:0 auto 0 0; width:2px; background:var(--gold);
  transform:scaleY(0); transform-origin:top; transition:transform .55s var(--ease); }
.ptile:hover{ border-color:rgba(169,190,216,.45); transform:translateY(-3px); background:var(--char-2); }
.ptile:hover::after{ transform:scaleY(1); }
.ptile__ico{ width:38px; height:38px; flex-shrink:0; border-radius:50%;
  display:grid; place-items:center; color:var(--gold);
  border:1px solid rgba(169,190,216,.35); transition:background .45s var(--ease), color .45s; }
.ptile:hover .ptile__ico{ background:var(--gold); color:var(--ink); }
.ptile__txt{ flex:1; min-width:0; }
.ptile__txt b{ display:block; font-family:var(--font-serif); font-weight:420; font-size:14.5px;
  color:var(--ivory); line-height:1.25; }
.ptile__txt i{ display:block; margin-top:3px; font-style:normal; font-family:var(--font-body);
  font-size:11.5px; color:var(--muted); }
.ptile__go{ color:var(--gold); font-size:15px; flex-shrink:0;
  transition:transform .5s var(--ease); }
.ptile:hover .ptile__go{ transform:translateX(4px); }
@media (max-width:980px){ .portal-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .portal-tiles{ grid-template-columns:1fr; } .ptile__txt i{ display:none; } }

/* two catering services */
.cater-two{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,28px); }
.cater-card{ position:relative; padding:clamp(26px,3vw,40px);
  border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--char);
  box-shadow:inset 0 1px 0 rgba(236,239,245,.05), 0 24px 60px -32px rgba(0,0,0,.55);
  display:flex; flex-direction:column; }
.cater-card__no{ font-family:var(--font-display); font-style:italic; font-size:13px;
  color:var(--gold); letter-spacing:.1em; }
.cater-card h3{ font-family:var(--font-display); font-weight:500; letter-spacing:-.01em;
  font-size:clamp(22px,2.4vw,31px); color:var(--ivory); margin:8px 0 14px; }
.cater-card p{ font-family:var(--font-body); font-size:14.5px; line-height:1.7; color:var(--muted); }
.cater-list{ margin:20px 0 26px; display:flex; flex-direction:column; gap:9px; }
.cater-list li{ position:relative; padding-left:20px; font-family:var(--font-body);
  font-size:13.5px; color:var(--bone); }
.cater-list li::before{ content:""; position:absolute; left:0; top:8px; width:8px; height:1px; background:var(--gold); }
.cater-card .btn{ margin-top:auto; align-self:flex-start; }
@media (max-width:820px){ .cater-two{ grid-template-columns:1fr; } }

/* anchored tour sections must clear the sticky header */
#restaurant, #hall, #buffet, #reserve, #catering, #offsite, #circle{ scroll-margin-top:96px; }

/* ============================================================
   PORTAL — typographic index (no photography)
   ============================================================ */
.portal--type{ justify-content:space-between; }
.pindex{
  flex:1; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(14px,2.4vh,40px) var(--pad-x);
  max-width:1400px; width:100%; margin-inline:auto;
}
.pindex__eyebrow{
  font-family:var(--font-ui); font-size:10.5px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--muted); margin-bottom:clamp(16px,2.4vh,34px);
}
.pentry{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:clamp(18px,3vw,48px);
  padding:clamp(20px,2.6vh,38px) 0;
  border-top:1px solid var(--line-soft); position:relative; isolation:isolate;
}
.pentry:last-of-type{ border-bottom:1px solid var(--line-soft); }
.pentry::before{
  content:""; position:absolute; inset:0 -24px; z-index:-1;
  background:linear-gradient(90deg, rgba(169,190,216,.10), rgba(169,190,216,0) 70%);
  opacity:0; transition:opacity .55s var(--ease);
}
.pentry:hover::before{ opacity:1; }
.pentry__no{
  font-family:var(--font-display); font-style:italic; font-size:clamp(13px,1.2vw,16px);
  color:var(--gold); letter-spacing:.08em; align-self:start; padding-top:.6em;
}
.pentry__name{
  display:block; font-family:var(--font-display); font-weight:500;
  font-size:clamp(36px,min(6vw,9vh),84px); line-height:.98; letter-spacing:-.02em;
  color:var(--ivory); transition:transform .6s var(--ease), color .5s var(--ease);
}
.pentry:hover .pentry__name{ color:var(--gold); transform:translateX(clamp(6px,1vw,16px)); }
.pentry__sub{
  display:block; margin-top:clamp(7px,.8vw,12px); max-width:none;
  font-family:var(--font-body); font-size:clamp(12.5px,1.05vw,15px); line-height:1.65;
  color:var(--muted);
}
.pentry__go{
  color:var(--gold); opacity:.5; flex-shrink:0;
  transition:opacity .5s var(--ease), transform .6s var(--ease);
}
.pentry:hover .pentry__go{ opacity:1; transform:translateX(8px); }
.portal__tels{ display:flex; gap:clamp(12px,2vw,26px); flex-wrap:wrap; }
.portal__tels a{ color:var(--bone); transition:color .35s; }
.portal__tels a:hover{ color:var(--gold); }
@media (max-width:700px){
  .pentry{ grid-template-columns:auto 1fr; gap:14px; padding:22px 0; }
  .pentry__go{ display:none; }
  .pentry__sub{ font-size:12.5px; }
}

/* event-type chooser */
[hidden]{ display:none !important; }
.field--full{ grid-column:1 / -1; }
.evt-pick{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:10px; }
.evt-pick .evt input{ position:absolute; opacity:0; pointer-events:none; }
.evt-pick .evt span{ display:block; padding:16px 18px; border:1px solid var(--line);
  border-radius:var(--radius); cursor:pointer; transition:border-color .4s var(--ease), background .4s var(--ease); }
.evt-pick .evt span b{ display:block; font-family:var(--font-serif); font-weight:420; font-size:16px;
  color:var(--ivory); text-transform:none; letter-spacing:0; }
.evt-pick .evt span i{ display:block; margin-top:5px; font-style:normal; font-family:var(--font-body);
  font-size:12.5px; line-height:1.55; color:var(--muted); text-transform:none; letter-spacing:0; }
.evt-pick .evt input:checked + span{ border-color:var(--gold); background:rgba(169,190,216,.10); }
.evt-pick .evt input:checked + span b{ color:var(--gold); }
.evt-pick .evt input:focus-visible + span{ outline:2px solid var(--gold); outline-offset:2px; }
@media (max-width:600px){ .evt-pick{ grid-template-columns:1fr; } }

/* ============================================================
   PACKAGES — the real client price sheets
   Three tiers side by side, the inclusions strip underneath,
   and the add-on list as a plain priced index.
   ============================================================ */
.pkgs{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.6vw,24px); margin-top:clamp(24px,3vw,40px); }
.pkg{
  position:relative; padding:clamp(24px,2.4vw,36px);
  border:1px solid var(--line); border-radius:var(--radius); background:var(--char);
  display:flex; flex-direction:column;
  transition:border-color .5s var(--ease), transform .6s var(--ease);
}
.pkg:hover{ border-color:rgba(169,190,216,.45); transform:translateY(-4px); }
.pkg--feature{ border-color:rgba(169,190,216,.4); }
.pkg__tag{
  position:absolute; top:-1px; right:clamp(18px,2vw,28px); transform:translateY(-50%);
  background:var(--gold); color:var(--ink); font-family:var(--font-ui);
  font-size:9.5px; letter-spacing:.22em; text-transform:uppercase; padding:5px 10px; border-radius:2px;
}
.pkg__no{ font-family:var(--font-display); font-style:italic; font-size:14px; color:var(--gold); }
.pkg__name{ font-family:var(--font-serif); font-weight:420; font-size:clamp(19px,1.6vw,23px); color:var(--ivory); margin:10px 0 4px; }
.pkg__serve{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
.pkg__price{
  font-family:var(--font-display); font-size:clamp(34px,3.4vw,46px); line-height:1;
  color:var(--gold); margin:clamp(16px,1.8vw,24px) 0 4px;
}
.pkg__price sup{ font-size:.42em; top:-.9em; letter-spacing:.02em; }
.pkg__per{ font-family:var(--font-body); font-size:12px; color:var(--muted); }
.pkg__list{ list-style:none; margin:clamp(18px,2vw,26px) 0 0; padding:0; display:grid; gap:9px; }
.pkg__list li{
  position:relative; padding-left:16px; font-family:var(--font-body);
  font-size:13px; line-height:1.55; color:var(--bone);
}
.pkg__list li::before{ content:""; position:absolute; left:0; top:.62em; width:5px; height:1px; background:var(--gold); }
.pkg__note{ margin-top:auto; padding-top:18px; font-family:var(--font-body); font-size:11.5px; color:var(--muted); }

.incl{
  margin-top:clamp(20px,2.4vw,32px); padding:clamp(20px,2.2vw,30px);
  border:1px solid var(--line-soft); border-radius:var(--radius); background:rgba(255,255,255,.012);
}
.incl__head{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); }
.incl__grid{ margin-top:14px; display:flex; flex-wrap:wrap; gap:8px 10px; }
.incl__grid span{
  font-family:var(--font-body); font-size:12px; color:var(--bone);
  border:1px solid var(--line); border-radius:999px; padding:6px 13px;
}

.addons{ margin-top:clamp(24px,3vw,40px); }
.addon{
  display:flex; align-items:baseline; gap:14px; padding:14px 0;
  border-bottom:1px solid var(--line-soft);
}
.addon__name{ font-family:var(--font-serif); font-size:15px; color:var(--ivory); flex-shrink:0; }
.addon__desc{ font-family:var(--font-body); font-size:12.5px; color:var(--muted); flex:1; line-height:1.5; }
.addon__price{ font-family:var(--font-display); font-size:17px; color:var(--gold); white-space:nowrap; }

/* menu selector — plain disclosure, no JS */
.sel{ margin-top:clamp(24px,3vw,40px); border-top:1px solid var(--line-soft); }
.sel details{ border-bottom:1px solid var(--line-soft); }
.sel summary{
  list-style:none; cursor:pointer; padding:clamp(18px,2vw,26px) 0;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  font-family:var(--font-serif); font-weight:420; font-size:clamp(17px,1.7vw,22px); color:var(--ivory);
  transition:color .4s var(--ease);
}
.sel summary::-webkit-details-marker{ display:none; }
.sel summary:hover{ color:var(--gold); }
.sel summary i{
  font-style:normal; font-family:var(--font-ui); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); flex-shrink:0;
}
.sel details[open] summary i::after{ content:" −"; }
.sel details:not([open]) summary i::after{ content:" +"; }
.sel__body{ padding-bottom:clamp(20px,2.4vw,32px); display:grid; gap:16px; }
.sel__row{ display:grid; grid-template-columns:minmax(120px,180px) 1fr; gap:clamp(12px,2vw,28px); }
.sel__label{ font-family:var(--font-ui); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); padding-top:3px; }
.sel__items{ font-family:var(--font-body); font-size:13px; line-height:1.75; color:var(--bone); }

@media (max-width:900px){
  .pkgs{ grid-template-columns:1fr; }
  .sel__row{ grid-template-columns:1fr; gap:6px; }
  .addon{ flex-wrap:wrap; }
  .addon__desc{ order:3; flex-basis:100%; }
}

/* the three prices people phone about, straight under the pillars */
.quick{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.6vw,24px); }
.quick__card{
  display:block; padding:clamp(24px,2.4vw,34px);
  border:1px solid var(--line); border-radius:var(--radius); background:var(--char);
  transition:border-color .5s var(--ease), transform .6s var(--ease);
}
.quick__card:hover{ border-color:rgba(169,190,216,.45); transform:translateY(-4px); }
.quick__label{ font-family:var(--font-ui); font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:var(--muted); }
.quick__fig{
  display:block; margin:12px 0 10px; font-family:var(--font-display);
  font-size:clamp(32px,3vw,44px); line-height:1; color:var(--gold);
}
.quick__fig i{ font-style:normal; font-family:var(--font-body); font-size:12px; color:var(--muted); margin-left:10px; letter-spacing:.04em; }
.quick__card p{ font-family:var(--font-body); font-size:13px; line-height:1.65; color:var(--bone); margin-bottom:16px; }
@media (max-width:900px){ .quick{ grid-template-columns:1fr; } }

/* the homepage film is a bright wedding stage — the type needs more ground under it */
.hero--home .hero__bg::after{
  background:
    linear-gradient(90deg, rgba(11,18,34,.62) 0%, rgba(11,18,34,.28) 46%, rgba(11,18,34,0) 72%),
    linear-gradient(180deg, rgba(11,18,34,.60) 0%, rgba(11,18,34,.30) 34%, rgba(11,18,34,.92) 100%);
}

/* the short homepage needs its practical facts on the page, not only in the footer */
.findus{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,40px);
  border-top:1px solid var(--line-soft); padding-top:clamp(26px,3vw,44px); }
.findus__item span{ display:block; font-family:var(--font-ui); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
.findus__item a, .findus__item p{ font-family:var(--font-body); font-size:14px; line-height:1.6; color:var(--ivory); }
.findus__item a{ display:block; transition:color .35s var(--ease); }
.findus__item a:hover{ color:var(--gold); }
.findus__item p{ color:var(--muted); font-size:12.5px; margin-top:4px; }
@media (max-width:820px){ .findus{ grid-template-columns:1fr 1fr; gap:26px 18px; } }

/* ============================================================
   ENTRY — the whole offer inside one screen
   Headline above, the three businesses as glass cards resting on
   the film. Nothing here may push past 100svh at 768px tall.
   ============================================================ */
.hero--entry{
  min-height:100svh; display:grid; grid-template-rows:1fr auto; align-content:stretch;
  padding:clamp(96px,12vh,140px) var(--pad-x) clamp(26px,4vh,52px);
}
.hero--entry .hero__bg::after{
  background:
    linear-gradient(90deg, rgba(11,18,34,.72) 0%, rgba(11,18,34,.36) 48%, rgba(11,18,34,.05) 78%),
    linear-gradient(180deg, rgba(11,18,34,.58) 0%, rgba(11,18,34,.24) 38%, rgba(11,18,34,.90) 100%);
}
.entry{ position:relative; z-index:2; display:grid; grid-template-rows:1fr auto; gap:clamp(20px,3vh,44px); width:100%; }
.entry__say{ align-self:center; max-width:1400px; margin-inline:auto; width:100%; }
.entry__h{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(30px,min(4.6vw,7.4vh),62px); line-height:1.04; letter-spacing:-.015em;
  color:var(--ivory); max-width:17ch; margin-top:clamp(14px,2vh,24px);
}
.entry__h em{ font-style:italic; color:var(--gold); }

.entry__pick{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(10px,1.1vw,18px);
  max-width:1400px; margin-inline:auto; width:100%;
}
.ecard{
  display:grid; grid-template-columns:auto 1fr auto auto; align-items:center;
  gap:clamp(10px,1.1vw,18px); padding:clamp(14px,1.7vh,22px) clamp(16px,1.4vw,24px);
  border:1px solid rgba(236,239,245,.16); border-radius:var(--radius);
  background:rgba(11,18,34,.52); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  transition:background .45s var(--ease), border-color .45s var(--ease), transform .5s var(--ease);
}
.ecard:hover{ background:rgba(11,18,34,.74); border-color:rgba(169,190,216,.55); transform:translateY(-3px); }
.ecard__no{ font-family:var(--font-display); font-style:italic; font-size:12px; color:var(--gold); }
.ecard__main{ min-width:0; }
.ecard__main b{
  display:block; font-family:var(--font-serif); font-weight:420;
  font-size:clamp(15px,1.25vw,19px); color:var(--ivory); letter-spacing:.01em;
}
.ecard__main i{
  display:block; margin-top:3px; font-style:normal; font-family:var(--font-body);
  font-size:11.5px; line-height:1.4; color:var(--muted);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ecard__fig{
  font-family:var(--font-display); font-size:clamp(19px,1.7vw,26px); color:var(--gold); line-height:1; white-space:nowrap;
}
.ecard__fig em{ display:block; font-style:normal; font-family:var(--font-body); font-size:9.5px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:5px; }
.ecard__go{ color:var(--gold); opacity:.55; transition:opacity .4s var(--ease), transform .5s var(--ease); }
.ecard:hover .ecard__go{ opacity:1; transform:translateX(5px); }

@media (max-width:900px){
  .entry__pick{ grid-template-columns:1fr; gap:8px; }
  .ecard{ padding:12px 14px; gap:12px; }
  .ecard__main i{ font-size:11px; }
  .entry__h{ max-width:14ch; }
}
@media (max-height:680px){
  .entry__h{ font-size:clamp(24px,5.2vh,38px); }
  .ecard__main i{ display:none; }
}

/* the ivory film reads bright — pull the scrim back so the page stops feeling dark */
.hero--entry .hero__bg::after{
  background:
    linear-gradient(90deg, rgba(11,18,34,.55) 0%, rgba(11,18,34,.22) 46%, rgba(11,18,34,0) 74%),
    linear-gradient(180deg, rgba(11,18,34,.38) 0%, rgba(11,18,34,.10) 40%, rgba(11,18,34,.78) 100%);
}

/* ============================================================
   ARC CHOOSER — the Framer curved gallery, dark skin, on /
   ============================================================ */
.hero--arc{ height:100svh; min-height:0; display:flex; flex-direction:column;
  padding:clamp(76px,10vh,110px) 0 clamp(14px,2.2vh,28px);
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(169,190,216,.07), transparent 60%),
    var(--ink); }
.entry--arc{ position:relative; z-index:2; flex:1; display:flex; flex-direction:column; gap:0; width:100%; }
.entry--arc .entry__say{ text-align:center; padding:0 var(--pad-x); }
.entry__h--arc{ max-width:none; margin:clamp(8px,1.2vh,16px) auto 0;
  font-size:clamp(26px,min(4vw,5.6vh),50px); }
.arc-wrap{ position:relative; flex:1; min-height:0; }
.arc{ position:absolute; inset:0; overflow:hidden; touch-action:pan-y; cursor:grab; }
.arc:active{ cursor:grabbing; }
.arc__stage{ position:absolute; inset:0; perspective:1200px; perspective-origin:50% 50%; transform-style:preserve-3d; }
.arc-card{ position:absolute; left:50%; top:50%; border-radius:12px; overflow:hidden;
  transform-style:preserve-3d; backface-visibility:hidden; -webkit-backface-visibility:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.5); will-change:transform,opacity; background:var(--char); }
.arc-card img{ width:100%; height:100%; object-fit:cover; display:block;
  pointer-events:none; user-select:none; -webkit-user-drag:none; }
.arc-card__tag{ position:absolute; left:0; right:0; bottom:0; display:flex;
  justify-content:space-between; align-items:baseline; gap:10px; padding:14px 16px;
  background:linear-gradient(180deg, transparent, rgba(7,11,22,.82));
  font-family:var(--font-serif); color:var(--ivory); font-size:15px; }
.arc-card__tag i{ font-style:normal; font-family:var(--font-display); color:var(--gold); font-size:14px; white-space:nowrap; }
.arc__edge{ position:absolute; top:0; bottom:0; width:clamp(40px,9vw,150px); z-index:5; pointer-events:none; }
.arc__edge--l{ left:0; background:linear-gradient(90deg, var(--ink), transparent); }
.arc__edge--r{ right:0; background:linear-gradient(270deg, var(--ink), transparent); }
.entry__foot{ text-align:center; padding:clamp(8px,1.2vh,14px) var(--pad-x) 0; }
.entry__active{ min-height:30px; font-family:var(--font-serif); font-size:clamp(16px,1.5vw,20px); color:var(--ivory); }
.entry__active a{ color:inherit; border-bottom:1px solid var(--gold); padding-bottom:3px; }
.entry__active em{ font-style:italic; color:var(--gold); font-family:var(--font-display);
  font-size:.82em; margin-left:10px; }
.entry__btns{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:clamp(8px,1.2vh,14px); }
.btn--sm{ padding:12px 22px; font-size:10.5px; }
@media (max-width:700px){
  .hero--arc{ padding-top:76px; }
  .entry__h--arc{ font-size:clamp(26px,7.4vw,34px); }
}

/* package course lists fold away — Roma keeps first screens quiet */
.pkg__more{ margin-top:clamp(16px,1.8vw,24px); }
.pkg__more summary{
  list-style:none; cursor:pointer; font-family:var(--font-ui); font-size:10px;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  padding-bottom:6px; border-bottom:1px solid var(--line-soft);
  transition:color .35s var(--ease);
}
.pkg__more summary::-webkit-details-marker{ display:none; }
.pkg__more summary::after{ content:" +"; }
.pkg__more[open] summary::after{ content:" −"; }
.pkg__more summary:hover{ color:var(--ivory); }
.pkg__more .pkg__list{ margin-top:14px; }

/* menu page: ordering is the page's own primary action now */
.order-band{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  padding:16px 20px; margin-bottom:clamp(20px,2.4vw,32px);
  border:1px solid var(--line-soft); border-radius:var(--radius); background:rgba(169,190,216,.05); }
.order-band p{ font-family:var(--font-body); font-size:13.5px; color:var(--bone); }

/* ============================================================
   TRIO — three doors, centred, one screen
   ============================================================ */
.trio{
  flex:1; min-height:0; display:grid; grid-template-columns:repeat(3, minmax(0, 380px));
  justify-content:center; align-content:center; gap:clamp(14px,1.8vw,28px);
  padding:clamp(14px,2vh,26px) var(--pad-x) 0; width:100%;
}
.tcard{
  position:relative; border-radius:4px; overflow:hidden; display:block;
  height:min(52vh, 470px);
  border:1px solid rgba(169,190,216,.22);
  box-shadow:0 30px 70px rgba(0,0,0,.45);
  transition:transform .6s var(--ease), border-color .5s var(--ease), box-shadow .6s var(--ease);
}
.tcard:hover{ transform:translateY(-6px); border-color:rgba(169,190,216,.6);
  box-shadow:0 40px 90px rgba(0,0,0,.6); }
.tcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease); }
.tcard:hover img{ transform:scale(1.05); }
.tcard__veil{ position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,17,32,.10) 28%, rgba(10,17,32,.92) 100%),
    linear-gradient(90deg, rgba(10,17,32,.55) 0%, rgba(10,17,32,.12) 46%, rgba(10,17,32,0) 70%); }
.tcard__body{ position:absolute; left:0; right:0; bottom:0; padding:clamp(18px,2vw,28px); }
.tcard__body i{ font-style:italic; font-family:var(--font-display); font-size:13px; color:var(--gold); }
.tcard__body b{ display:block; margin-top:6px; font-family:var(--font-display); font-weight:500;
  font-size:clamp(22px,2vw,30px); letter-spacing:.01em; color:var(--ivory); }
.tcard__body em{ display:block; margin-top:6px; font-style:normal; font-family:var(--font-body);
  font-size:12.5px; line-height:1.5; color:var(--bone); opacity:.85; }
.tcard__body u{ display:inline-flex; align-items:center; gap:8px; margin-top:12px;
  text-decoration:none; font-family:var(--font-ui); font-size:10px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--gold);
  opacity:0; transform:translateY(6px); transition:opacity .45s var(--ease), transform .45s var(--ease); }
.tcard:hover .tcard__body u{ opacity:1; transform:none; }
@media (max-width:900px){
  .trio{ grid-template-columns:1fr; align-content:center; gap:10px; }
  .tcard{ height:auto; min-height:0; }
  .tcard{ height:clamp(96px,17vh,150px); }
  .tcard__body b{ font-size:19px; }
  .tcard__body em{ font-size:11.5px; }
  .tcard__body u{ display:none; }
  /* wide band: the caption sits bottom-left, so anchor the dark there */
  .tcard__veil{ background:
    linear-gradient(90deg, rgba(10,17,32,.90) 0%, rgba(10,17,32,.62) 34%, rgba(10,17,32,.22) 62%, rgba(10,17,32,.42) 100%),
    linear-gradient(180deg, rgba(10,17,32,0) 40%, rgba(10,17,32,.55) 100%); }
}

/* the real mark, in the header and on the curtain */
.brand{ display:flex; align-items:center; gap:12px; }
.brand__mark{ width:30px; height:auto; }
.loader__mark--logo{ opacity:0; text-align:center; }
.loader__mark--logo img{ width:min(38vw,190px); height:auto; }
.loader__rule{ display:block; height:1px; width:70%; margin:18px auto 0;
  background:linear-gradient(90deg, transparent, var(--gold), transparent); }

/* lockup: mark spans both rows; word and sub stack beside it */
.brand{ display:grid !important; grid-template-columns:auto auto; align-items:center;
  column-gap:12px; row-gap:0; }
.brand__mark{ grid-row:1 / 3; width:30px; }
.brand__word{ grid-column:2; }
.brand__sub{ grid-column:2; }
/* Montserrat is wider than Jost — keep the nav on one line */
.nav a{ white-space:nowrap; font-size:11px; letter-spacing:.14em; }
.head-cta .btn{ white-space:nowrap; }
@media (max-width:1200px){ .nav a{ font-size:10.5px; letter-spacing:.1em; } }

/* ============================================================
   LOGO ENTRANCE — ported from the Blanc & Or demo, dark ground.
   Gold line art draws the column mark, the real logo breathes in
   over it, the rule sweeps. main.js owns the curtain lift.
   ============================================================ */
.loader__inner{ position:relative; width:min(42vw,220px); text-align:center; }
.loader__draw{ position:absolute; inset:0; margin:auto; width:78%; height:auto; left:11%;
  animation:ldr-fadeout .5s ease 1.75s forwards; }
.dl{ stroke:var(--gold); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
  fill:none; stroke-dasharray:100 100; stroke-dashoffset:100;
  animation:ldr-draw 1.05s cubic-bezier(.6,0,.3,1) forwards; }
.dl-star {animation-delay:.05s;}
.dl-o    {animation-delay:.15s;}
.dl-star2{animation-delay:.45s;}
.dl-cap  {animation-delay:.55s;}
.dl-shaft{animation-delay:.65s;}
.dl-base {animation-delay:.8s;}
.loader__logo{ width:100%; height:auto; opacity:0; transform:scale(1.045);
  animation:ldr-in 1s var(--ease) 1.55s forwards; }
.loader__rule{ display:block; height:1px; width:0; margin:20px auto 0;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  animation:ldr-rule .7s var(--ease) 2.15s forwards; }
@keyframes ldr-draw{to{stroke-dashoffset:0;}}
@keyframes ldr-fadeout{to{opacity:0;}}
@keyframes ldr-in{to{opacity:1;transform:scale(1);}}
@keyframes ldr-rule{to{width:72%;}}
/* repeat visit in the same session: skip the draw, quick logo fade */
html.intro-seen .loader__draw{ display:none; }
html.intro-seen .loader__logo{ animation:ldr-in .5s var(--ease) .05s forwards; }
html.intro-seen .loader__rule{ animation:ldr-rule .4s var(--ease) .25s forwards; }

/* ============================================================
   SPLASH — the BMS choreography on the Olympia badge.
   Ring draws · column rises flute by flute · stars pop ·
   OLYMPIA chops in · subtitle rises · divider sweeps ·
   badge settles. GSAP lifts the curtain at 2.95s.
   ============================================================ */
.splash-badge{ width:min(46vh, 72vw, 340px); }
.splash-badge svg{ width:100%; height:auto; display:block; }
html body:has(.loader:not(.loader--done)){ overflow:hidden; }

@media (prefers-reduced-motion: no-preference){
  .splash-badge{ animation:badge-settle 2.9s var(--ease) both; }
  @keyframes badge-settle{ from{scale:.94;} 60%{scale:1;} to{scale:1;} }

  /* 1 · the O draws itself */
  .splash-badge #o-ring{ stroke-dasharray:1; stroke-dashoffset:1;
    animation:ring-draw .95s var(--ease) .05s forwards; }
  @keyframes ring-draw{ to{stroke-dashoffset:0;} }

  /* 2 · capital sweeps, flutes rise in sequence, base closes */
  .splash-badge .sp-cap{ stroke-dasharray:1; stroke-dashoffset:1;
    animation:ring-draw .5s var(--ease) .3s forwards; }
  .splash-badge .sp-flute{ stroke-dasharray:1; stroke-dashoffset:1;
    animation:ring-draw .55s var(--ease) both;
    animation-delay:calc(.5s + var(--i) * .07s); }
  .splash-badge .sp-base{ stroke-dasharray:1; stroke-dashoffset:1;
    animation:ring-draw .5s var(--ease) .95s forwards; }

  /* 3 · stars pop */
  .splash-badge .sp-star{ scale:0; transform-box:fill-box; transform-origin:center;
    animation:star-pop .4s cubic-bezier(.2,1.4,.4,1) both; }
  .splash-badge #star-mid{ animation-delay:1.1s; }
  .splash-badge #star-top{ animation-delay:1.25s; }
  @keyframes star-pop{ to{scale:1;} }

  /* 4 · the name chops in */
  .splash-badge #txtOly{ opacity:0; transform-box:fill-box; transform-origin:center;
    animation:oly-chop .42s cubic-bezier(.6,0,.2,1.2) 1.55s both; }
  @keyframes oly-chop{
    from{ opacity:0; translate:0 .24em; scale:1 .5; }
    to{ opacity:1; translate:0 0; scale:1 1; } }

  /* 5 · subtitle rises, divider sweeps out from the star */
  .splash-badge #txtSub{ opacity:0; animation:sub-rise .45s var(--ease) 1.9s both; }
  @keyframes sub-rise{ from{opacity:0; translate:0 .5em;} to{opacity:1; translate:0 0;} }
  .splash-badge .div-l{ transform-box:fill-box; transform-origin:right center; scale:0 1;
    animation:div-sweep .5s var(--ease) 2.05s both; }
  .splash-badge .div-r{ transform-box:fill-box; transform-origin:left center; scale:0 1;
    animation:div-sweep .5s var(--ease) 2.05s both; }
  @keyframes div-sweep{ to{scale:1 1;} }
  .splash-badge .div-star{ scale:0; transform-box:fill-box; transform-origin:center;
    animation:star-pop .35s cubic-bezier(.2,1.4,.4,1) 2.2s both; }
}
@media (prefers-reduced-motion: reduce){
  .loader{ display:none; }
}

/* ============================================================
   SUB-NAV — the section's services, pinned once the hero passes.
   The main header hides on scroll-down, so this owns the top.
   ============================================================ */
.subnav{
  position:sticky; top:0; z-index:60;
  display:flex; justify-content:center; align-items:center; gap:clamp(18px,3vw,44px);
  padding:15px var(--pad-x);
  background:rgba(14,22,38,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
}
.subnav a{
  font-family:var(--font-ui); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--bone); white-space:nowrap; transition:color .35s var(--ease);
}
.subnav a:hover{ color:var(--gold); }
.subnav__cta{ color:var(--gold) !important; border-bottom:1px solid var(--gold); padding-bottom:3px; }
@media (max-width:760px){
  .subnav{ justify-content:flex-start; overflow-x:auto; gap:26px; padding:13px var(--pad-x);
    scrollbar-width:none; }
  .subnav::-webkit-scrollbar{ display:none; }
}

/* gallery grid — captioned masonry */
.ggrid{ margin-top:clamp(30px,4vw,54px); columns:3 300px; column-gap:clamp(14px,1.6vw,24px); }
.gitem{ break-inside:avoid; margin:0 0 clamp(14px,1.6vw,24px); position:relative;
  border-radius:3px; overflow:hidden; border:1px solid var(--line-soft); }
/* The images are lazy and carry no intrinsic size, so before they load each
   tile collapsed to ~2px — the caption spilled out of the tile and was
   clipped, and every tile jumped to full height on load. Reserving the
   aspect ratio holds the space and removes the shift. */
.gitem img{ width:100%; height:auto; display:block; aspect-ratio:4/3; object-fit:cover;
  transition:transform 1s var(--ease); }
.gitem img[data-portrait]{ aspect-ratio:3/4; }
.gitem:hover img{ transform:scale(1.04); }
.gitem figcaption{ position:absolute; left:0; right:0; bottom:0; padding:24px 16px 12px;
  background:linear-gradient(180deg, transparent, rgba(10,17,32,.85));
  font-family:var(--font-serif); font-size:15px; color:var(--ivory); }

/* eight items + FR + a button: breathe at laptop widths */
@media (max-width:1460px){
  .nav{ gap:clamp(12px,1.6vw,22px); }
  .head-cta .btn{ padding:12px 18px; font-size:10px; }
  .brand__sub{ display:none; }
}
@media (max-width:1240px){
  .head-cta .btn{ display:none; }   /* the nav's Reserve covers it */
}

/* order page: categories fold like the menu — see the names, open what you want */
.ord-cat__toggle{ display:flex; align-items:baseline; gap:12px; width:100%; text-align:left;
  font:inherit; color:inherit; cursor:pointer; padding:6px 0; }
.ord-cat__toggle i{ font-style:normal; font-family:var(--font-ui); font-size:11px;
  letter-spacing:.14em; color:var(--gold); }
.ord-cat__toggle b{ margin-left:auto; width:11px; height:11px; position:relative; flex-shrink:0; align-self:center; }
.ord-cat__toggle b::before,.ord-cat__toggle b::after{ content:""; position:absolute; inset:0; margin:auto;
  background:var(--gold); transition:transform .35s var(--ease); }
.ord-cat__toggle b::before{ width:11px; height:1px; }
.ord-cat__toggle b::after{ width:1px; height:11px; }
.ord-cat:not(.is-closed) .ord-cat__toggle b::after{ transform:scaleY(0); }
.ord-cat.is-closed .ord-grid{ display:none; }
.ord-cat.is-closed{ padding-bottom:6px; border-bottom:1px solid var(--line-soft); }

/* dish descriptions & section notes — the printed menu's own words */
.dish__desc{ margin:6px 0 0; font-family:var(--font-body); font-size:12px; line-height:1.55;
  color:var(--muted); max-width:52ch; }
.mcat__note{ margin:0 0 18px; font-family:var(--font-serif); font-style:italic;
  font-size:14.5px; color:var(--gold); }
.sauce-guide{ margin-bottom:clamp(20px,2.4vw,32px); padding:clamp(16px,1.8vw,24px);
  border:1px solid var(--line-soft); border-radius:var(--radius); background:rgba(169,190,216,.04); }
.sauce-guide dl{ display:grid; grid-template-columns:auto 1fr; gap:7px 18px; margin:0; }
.sauce-guide dt{ font-family:var(--font-serif); font-size:14.5px; color:var(--ivory); }
.sauce-guide dd{ margin:0; font-family:var(--font-body); font-size:12.5px; color:var(--muted); align-self:baseline; }
@media (max-width:560px){ .sauce-guide dl{ grid-template-columns:1fr; gap:2px; }
  .sauce-guide dd{ margin-bottom:8px; } }

/* ============================================================
   RESTAURANT SUBMENU — dropdown on desktop, accordion on mobile
   ============================================================ */
.nav__has-sub{ position:relative; display:flex; align-items:center; }
.nav__parent{ display:inline-flex; align-items:center; gap:6px; }
.nav__caret{ transition:transform .35s var(--ease); opacity:.7; }
.nav__has-sub:hover .nav__caret,
.nav__has-sub:focus-within .nav__caret{ transform:rotate(180deg); opacity:1; }
.nav__sub{
  position:absolute; top:100%; left:50%; transform:translate(-50%,8px);
  min-width:236px; padding:14px 0 10px; margin-top:14px;
  background:rgba(18,27,46,.97); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border:1px solid var(--line); border-radius:3px;
  box-shadow:0 30px 60px rgba(0,0,0,.55);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s;
  z-index:80;
}
.nav__has-sub:hover .nav__sub,
.nav__has-sub:focus-within .nav__sub{ opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
.nav__sub::before{ content:""; position:absolute; top:-14px; left:0; right:0; height:14px; }
.nav__sub a{
  display:block; padding:9px 22px; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--bone); white-space:nowrap;
  transition:color .3s var(--ease), background .3s var(--ease);
}
.nav__sub a:hover{ color:var(--gold); background:rgba(169,190,216,.07); }
.nav__sub a::after{ display:none; }
.nav__sub-group{ margin:8px 0; padding:10px 0 4px; border-top:1px solid var(--line-soft); }
.nav__sub-label{
  display:block; padding:0 22px 7px; font-family:var(--font-ui); font-size:9.5px;
  letter-spacing:.28em; text-transform:uppercase; color:var(--muted);
}
.nav__sub-group a{ padding-left:34px; position:relative; }
.nav__sub-group a::before{
  content:""; position:absolute; left:22px; top:50%; width:5px; height:1px; background:var(--gold); opacity:.6;
}

/* mobile accordion inside the slide-out menu */
.m-nav__acc{ border:0; }
.m-nav__acc-head{
  display:flex; align-items:center; width:100%; text-align:left; font:inherit;
  color:inherit; cursor:pointer; background:none; border:0;
}
.m-nav__acc-head i{
  margin-left:auto; width:13px; height:13px; position:relative; flex-shrink:0;
}
.m-nav__acc-head i::before,.m-nav__acc-head i::after{
  content:""; position:absolute; inset:0; margin:auto; background:var(--gold);
  transition:transform .35s var(--ease);
}
.m-nav__acc-head i::before{ width:13px; height:1px; }
.m-nav__acc-head i::after{ width:1px; height:13px; }
.m-nav__acc-head[aria-expanded="true"] i::after{ transform:scaleY(0); }
.m-nav__acc-body{ display:none; padding:2px 0 10px 34px; }
.m-nav__acc-body.is-open{ display:block; }
.m-nav__acc-body a{
  display:block; padding:9px 0; font-family:var(--font-ui); font-size:12px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--bone);
}
.m-nav__acc-body a:hover{ color:var(--gold); }
.m-nav__acc-body .m-nav__acc-label{
  display:block; margin:10px 0 2px; font-size:9.5px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--muted);
}
.m-nav__acc-body .is-nested{ padding-left:16px; }

/* ============================================================
   LUNCH BUFFET — food first, price second
   ============================================================ */
.bfood{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,30px);
  margin-top:clamp(32px,4vw,56px); }
.bcourse{
  position:relative; border-radius:4px; overflow:hidden; background:var(--char);
  border:1px solid var(--line-soft); display:flex; flex-direction:column;
  transition:border-color .5s var(--ease), transform .6s var(--ease);
}
.bcourse:hover{ border-color:rgba(169,190,216,.42); transform:translateY(-4px); }
.bcourse__img{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.bcourse__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.bcourse:hover .bcourse__img img{ transform:scale(1.06); }
.bcourse__img::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 45%, rgba(14,22,38,.82)); }
.bcourse__no{
  position:absolute; top:14px; left:16px; z-index:2; font-family:var(--font-display);
  font-style:italic; font-size:13px; color:var(--gold);
}
.bcourse__body{ padding:clamp(18px,2vw,26px); flex:1; display:flex; flex-direction:column; }
.bcourse__title{
  font-family:var(--font-display); font-weight:500; font-size:clamp(19px,1.7vw,25px);
  color:var(--ivory); line-height:1.15;
}
.bcourse__lede{ margin-top:8px; font-family:var(--font-body); font-size:12.5px;
  line-height:1.6; color:var(--muted); }
.bcourse__list{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:7px; }
.bcourse__list li{
  position:relative; padding-left:15px; font-family:var(--font-serif);
  font-size:14.5px; line-height:1.4; color:var(--bone);
}
.bcourse__list li::before{ content:""; position:absolute; left:0; top:.62em;
  width:5px; height:1px; background:var(--gold); }
/* the grill anchors the grid as a 2x2 block, which also closes the
   last row cleanly — six cards otherwise leave one orphan */
.bcourse--hero{ grid-column:span 2; grid-row:span 2; }
.bcourse--hero .bcourse__img{ aspect-ratio:auto; flex:1 1 auto; min-height:260px; }
.bcourse--hero .bcourse__title{ font-size:clamp(23px,2.2vw,32px); }
.bcourse--hero .bcourse__list{ display:flex; gap:26px; flex-wrap:wrap; }

/* the two verified prices, quiet and confident */
.bprice{ display:flex; flex-wrap:wrap; gap:clamp(14px,1.8vw,26px);
  margin-top:clamp(30px,3.6vw,48px); align-items:stretch; }
.bprice__card{
  flex:1 1 260px; padding:clamp(20px,2.2vw,30px);
  border:1px solid var(--line-soft); border-radius:4px; background:rgba(169,190,216,.04);
}
.bprice__card--feature{ border-color:rgba(169,190,216,.36); }
.bprice__when{ font-family:var(--font-ui); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold); }
.bprice__name{ font-family:var(--font-display); font-weight:500; font-size:clamp(20px,1.8vw,26px);
  color:var(--ivory); margin:9px 0 6px; }
.bprice__note{ font-family:var(--font-body); font-size:12.5px; line-height:1.6; color:var(--muted); }
.bprice__fig{ margin-top:14px; font-family:var(--font-serif); font-size:15px; color:var(--bone); }
.bprice__fig b{ font-family:var(--font-display); font-weight:500; font-size:21px; color:var(--gold); }
@media (max-width:900px){
  .bfood{ grid-template-columns:1fr 1fr; }
  .bcourse--hero{ grid-column:span 2; grid-row:auto; }
  .bcourse--hero .bcourse__img{ aspect-ratio:16/9; min-height:0; }
}
@media (max-width:620px){
  .bfood{ grid-template-columns:1fr; }
  .bcourse--hero{ grid-column:span 1; grid-row:auto; }
}

/* ============================================================
   PRIVATE DINING — Moon Room & VIP as real rooms
   ============================================================ */
.priv{ display:grid; gap:clamp(20px,2.6vw,40px); margin-top:clamp(30px,4vw,52px); }
.priv__room{
  display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(20px,3vw,52px);
  align-items:center;
}
.priv__room:nth-child(even) .priv__vis{ order:2; }
.priv__vis{ position:relative; aspect-ratio:4/3; border-radius:4px; overflow:hidden;
  border:1px solid var(--line); }
.priv__vis img{ width:100%; height:100%; object-fit:cover; }
/* placeholder that reads as a design choice, not a broken image */
.priv__ph{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:16px; text-align:center;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(169,190,216,.10), transparent 62%),
    linear-gradient(160deg, #141F35, #0D1527);
}
.priv__ph img{ width:52px; height:auto; opacity:.85; object-fit:contain; }
.priv__ph span{
  font-family:var(--font-display); font-size:clamp(22px,2.4vw,34px);
  letter-spacing:.14em; text-transform:uppercase; color:rgba(236,239,245,.5);
}
.priv__ph i{ font-style:normal; font-family:var(--font-ui); font-size:9.5px;
  letter-spacing:.28em; text-transform:uppercase; color:var(--muted); }
.priv__no{ font-family:var(--font-display); font-style:italic; font-size:14px; color:var(--gold); }
.priv__name{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(28px,3vw,44px); color:var(--ivory); margin:10px 0 14px; line-height:1.05; }
.priv__copy{ font-family:var(--font-body); font-size:14.5px; line-height:1.75; color:var(--bone); max-width:46ch; }
.priv__acts{ margin-top:clamp(20px,2.4vw,30px); }
@media (max-width:860px){
  .priv__room{ grid-template-columns:1fr; }
  .priv__room:nth-child(even) .priv__vis{ order:0; }
}

/* ============================================================
   CATERING — the four-step promise
   ============================================================ */
.flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.6vw,24px);
  margin-top:clamp(28px,3.4vw,46px); }
.flow__step{ position:relative; padding:clamp(20px,2.2vw,30px);
  border:1px solid var(--line-soft); border-radius:4px; background:var(--char); }
.flow__step::after{
  content:""; position:absolute; top:50%; right:calc(-1 * clamp(12px,1.6vw,24px) / 2 - 5px);
  width:10px; height:10px; border-top:1px solid var(--gold); border-right:1px solid var(--gold);
  transform:translateY(-50%) rotate(45deg); opacity:.55;
}
.flow__step:last-child::after{ display:none; }
.flow__no{ font-family:var(--font-display); font-style:italic; font-size:13px; color:var(--gold); }
.flow__title{ font-family:var(--font-serif); font-weight:420; font-size:clamp(16px,1.5vw,20px);
  color:var(--ivory); margin:10px 0 8px; line-height:1.25; }
.flow__copy{ font-family:var(--font-body); font-size:12.5px; line-height:1.6; color:var(--muted); }
@media (max-width:900px){
  .flow{ grid-template-columns:1fr 1fr; }
  .flow__step:nth-child(2)::after{ display:none; }
}
@media (max-width:520px){
  .flow{ grid-template-columns:1fr; }
  .flow__step::after{ top:auto; bottom:-16px; right:50%; transform:translateX(50%) rotate(135deg); }
}

/* catering menu cards with real food */
.mcard{ position:relative; border-radius:4px; overflow:hidden; border:1px solid var(--line-soft); }
.mcard__img{ position:relative; width:100%; height:clamp(170px,20vw,260px); overflow:hidden; }
.mcard__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.mcard:hover .mcard__img img{ transform:scale(1.04); }
.mcard__img::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(14,22,38,.25), rgba(14,22,38,.9)); }
.mcard__cap{ position:absolute; left:0; right:0; bottom:0; padding:clamp(16px,2vw,26px);
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.mcard__cap h3{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(21px,2vw,30px); color:var(--ivory); }
.mcard__cap span{ font-family:var(--font-body); font-size:12.5px; color:var(--bone); opacity:.85; }

/* ============================================================
   PACKAGES — experience first, price as a quiet footnote
   ============================================================ */
.pkg__price{ font-size:clamp(19px,1.7vw,23px) !important; color:var(--bone) !important;
  margin:0 !important; display:inline; }
.pkg__price sup{ font-size:.62em !important; top:-.35em !important; }
.pkg__from{
  margin-top:auto; padding-top:clamp(16px,1.8vw,22px);
  border-top:1px solid var(--line-soft);
  font-family:var(--font-ui); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted);
}
.pkg__from b{ font-family:var(--font-display); font-weight:500; font-size:20px;
  letter-spacing:0; text-transform:none; color:var(--gold); }
.pkg__lede{ margin:10px 0 0; font-family:var(--font-body); font-size:13px;
  line-height:1.65; color:var(--bone); }
.pkg__img{ aspect-ratio:16/10; overflow:hidden; margin:-1px -1px clamp(16px,1.8vw,22px);
  border-bottom:1px solid var(--line-soft); }
.pkg__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.pkg:hover .pkg__img img{ transform:scale(1.05); }
.pkg:has(.pkg__img){ padding-top:0 !important; overflow:hidden; }
.pkg__img + .pkg__no{ display:block; margin-top:clamp(2px,.4vw,6px); }
.pkg--feature .pkg__tag{ z-index:3; }

/* ============================================================
   FOOTER — compact, four columns, actions in line
   ============================================================ */
.footer{ padding:clamp(48px,5.5vw,76px) var(--pad-x) 26px !important; }
.footer__grid{ grid-template-columns:1.25fr 1fr 1fr 1.15fr !important;
  gap:clamp(26px,3vw,54px) !important; }
.footer h5{ margin-bottom:15px !important; }
.footer li{ margin-bottom:8px !important; }
.footer li a, .footer li span{ font-size:13px !important; line-height:1.5; }
.footer__mark{ display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.footer__mark img{ width:26px; height:auto; }
.footer__mark b{ font-family:var(--font-display); font-weight:500; font-size:21px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ivory); }
.footer__acts{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:clamp(26px,3vw,40px); padding-top:clamp(20px,2.4vw,30px);
  border-top:1px solid var(--line-soft);
}
.footer__acts .btn{ padding:12px 20px; font-size:10px; }
.footer__brandline{ display:none !important; }
.footer__base{ margin-top:clamp(20px,2.4vw,30px); padding-top:20px !important; }
@media (max-width:860px){
  .footer__grid{ grid-template-columns:1fr 1fr !important; }
}
@media (max-width:560px){
  .footer__grid{ grid-template-columns:1fr !important; gap:26px !important; }
  .footer__acts .btn{ flex:1 1 100%; text-align:center; justify-content:center; }
}
/* tap-opened dropdown on touch devices */
.nav__has-sub.is-open .nav__sub{ opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
/* reservation: inline hint + full-width checkbox row */
.field-hint{ margin:-4px 0 4px; font-family:var(--font-body); font-size:12px;
  line-height:1.5; color:var(--gold); opacity:.85; }
.tag-check--row{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.tag-check--row span{ font-size:13px; }
/* hero: verified indicators + paired actions */
.hero__pills{ display:flex; flex-wrap:wrap; gap:9px; margin-top:24px; }
.hero__pills span{
  font-family:var(--font-ui); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--bone); border:1px solid var(--line); border-radius:999px; padding:8px 16px;
  background:rgba(14,22,38,.35); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.hero__acts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
/* the menu card sits above its disclosure summary */
.sel .mcard{ margin-top:clamp(16px,2vw,24px); }
.sel .mcard + details > summary{ padding-top:16px; }
/* with a photo on top, the ribbon sits inside the image instead of
   straddling the border where the card's overflow would clip it */
.pkg:has(.pkg__img) .pkg__tag{
  top:clamp(14px,1.4vw,18px); right:clamp(14px,1.4vw,18px);
  transform:none; z-index:3;
}
/* the banquet photo is bright on the right — give the headline ground */
.hero--cater .hero__bg::after{
  background:
    linear-gradient(90deg, rgba(10,17,32,.86) 0%, rgba(10,17,32,.55) 46%, rgba(10,17,32,.12) 82%),
    linear-gradient(180deg, rgba(10,17,32,.55) 0%, rgba(10,17,32,.2) 40%, rgba(10,17,32,.88) 100%);
}
/* a callback opt-in should look like a checkbox, not a chip */
.tag-check--row{ display:flex; align-items:center; gap:12px; margin-top:16px; cursor:pointer; }
.tag-check--row input{ position:absolute; opacity:0; pointer-events:none; }
.tag-check--row span{
  position:relative; padding:0 0 0 30px; border:0 !important; background:none !important;
  font-family:var(--font-body) !important; font-size:13px !important; letter-spacing:0 !important;
  text-transform:none !important; color:var(--bone) !important; line-height:1.5;
}
.tag-check--row span::before{
  content:""; position:absolute; left:0; top:1px; width:17px; height:17px;
  border:1px solid var(--line); border-radius:2px; background:rgba(255,255,255,.02);
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.tag-check--row span::after{
  content:""; position:absolute; left:5px; top:5px; width:8px; height:4px;
  border-left:1.6px solid var(--ink); border-bottom:1.6px solid var(--ink);
  transform:rotate(-45deg) scale(0); transition:transform .25s var(--ease);
}
.tag-check--row input:checked + span::before{ background:var(--gold); border-color:var(--gold); }
.tag-check--row input:checked + span::after{ transform:rotate(-45deg) scale(1); }
.tag-check--row input:focus-visible + span::before{ outline:2px solid var(--gold); outline-offset:2px; }
/* the accordion head is a button — give it the same weight as the links beside it */
.m-nav__acc-head{
  font-family:var(--font-display); font-size:clamp(34px,9vw,54px); font-weight:340;
  padding:10px 0; border-bottom:1px solid var(--line-soft); color:var(--ivory);
}
.m-nav__acc-head em{ font-style:italic; color:var(--gold); font-size:.5em; margin-right:18px; }
.m-nav__acc-head i{ width:16px; height:16px; }
.m-nav__acc-head i::before{ width:16px; }
.m-nav__acc-head i::after{ height:16px; }

/* ============================================================
   DA VINCI–INSPIRED RESTAURANT LAYER
   Their signature moves, translated to Olympia's palette:
   a faint column grid behind the page, a four-card access
   strip under the hero, and a service-split hours block.
   ============================================================ */

/* the column grid — five faint verticals, fixed behind everything */
.gridlines{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  display:grid; grid-template-columns:repeat(5,1fr);
  max-width:1560px; margin-inline:auto;
}
.gridlines span{ border-right:1px solid rgba(236,239,245,.045); }
.gridlines span:last-child{ border-right:0; }
/* raise the content wrappers only — a blanket body>* rule would
   override the header's absolute positioning and drop the hero */
.hero, .section, .subnav, .footer, .cta-band{ position:relative; z-index:1; }
@media (max-width:760px){ .gridlines{ grid-template-columns:repeat(3,1fr); } }

/* four-card access strip */
.quad{
  display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.8vw,28px);
  margin-top:clamp(30px,3.6vw,50px);
}
.qcard{ display:block; text-align:center; }
.qcard__img{
  display:block; position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:3px;
  border:1px solid var(--line-soft);
}
.qcard__img img{ width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease), filter .6s var(--ease); filter:brightness(.86); }
.qcard:hover .qcard__img img{ transform:scale(1.06); filter:brightness(1); }
.qcard__label{
  display:block; margin-top:clamp(12px,1.4vw,18px);
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(14px,1.25vw,18px); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); transition:color .35s var(--ease);
}
.qcard:hover .qcard__label{ color:var(--ivory); }
@media (max-width:760px){ .quad{ grid-template-columns:1fr 1fr; gap:14px; } }

/* centred heading with the flanking ornament Da Vinci uses */
.orn{ display:flex; align-items:center; justify-content:center; gap:clamp(14px,2vw,26px); }
.orn::before,.orn::after{
  content:""; width:clamp(28px,4vw,64px); height:1px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
}

/* service-split hours, their "Votre table" block */
.hours{
  display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:clamp(22px,3vw,52px);
  margin-top:clamp(28px,3.4vw,46px); padding-top:clamp(26px,3vw,40px);
  border-top:1px solid var(--line-soft); text-align:left;
}
.hours h4{
  font-family:var(--font-ui); font-size:10px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--gold); margin-bottom:12px;
}
.hours p{ font-family:var(--font-body); font-size:14px; line-height:1.75; color:var(--bone); }
.hours a{ color:var(--bone); transition:color .3s; }
.hours a:hover{ color:var(--gold); }
@media (max-width:760px){ .hours{ grid-template-columns:1fr; gap:24px; text-align:center; } }

/* the rating block — aggregate only, no invented quotes */
.rating{ text-align:center; }
.rating__stars{ font-size:clamp(17px,1.6vw,21px); color:var(--gold); letter-spacing:.28em; }
.rating__score{
  font-family:var(--font-display); font-size:clamp(40px,4.6vw,68px);
  color:var(--ivory); line-height:1; margin:14px 0 8px;
}
.rating__meta{ font-family:var(--font-ui); font-size:10.5px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--muted); }
.rating__themes{
  display:flex; flex-wrap:wrap; gap:9px; justify-content:center;
  margin-top:clamp(22px,2.6vw,32px);
}
.rating__themes span{
  font-family:var(--font-serif); font-size:14.5px; color:var(--bone);
  border:1px solid var(--line); border-radius:999px; padding:8px 17px;
}

/* nav action items carry a small icon, like Da Vinci's */
.nav a svg.nav__ico{ margin-right:7px; vertical-align:-2px; opacity:.85; }
/* ultra-wide screens: keep the header from sprawling into two lonely
   clusters — cap the row and centre it */
@media (min-width:1700px){
  .site-head{
    padding-left:calc((100vw - 1600px) / 2);
    padding-right:calc((100vw - 1600px) / 2);
  }
}
/* as a hero backdrop the placeholder must not repeat the headline —
   keep the texture and a single faint mark, drop the caption */
.hero__bg .priv__ph{ justify-content:center; }
.hero__bg .priv__ph span,
.hero__bg .priv__ph i{ display:none; }
.hero__bg .priv__ph img{ width:clamp(90px,11vw,150px); opacity:.10; }
/* the Mediterranean platter is bright and centre-weighted — push the crop
   right so the headline keeps the dark olive-wood column on the left */
.hero--med .hero__bg img{ object-position:72% 50%; }
.hero--med .hero__bg::after{
  background:
    linear-gradient(90deg, rgba(10,17,32,.92) 0%, rgba(10,17,32,.72) 30%, rgba(10,17,32,.28) 58%, rgba(10,17,32,.05) 85%),
    linear-gradient(180deg, rgba(10,17,32,.55) 0%, rgba(10,17,32,.15) 42%, rgba(10,17,32,.85) 100%);
}
@media (max-width:760px){ .hero--med .hero__bg img{ object-position:66% 50%; } }