/* ==========================================================
   Burma Inc. — Hospitality Group
   Design language inspired by modern restaurant group sites
   (full-bleed hero, quiet editorial typography, brand tiles)
   ========================================================== */

/* Fonts loaded from Bunny Fonts — same Google Fonts catalog, but a privacy-respecting,
   GDPR-compliant CDN that does not log visitor IPs. Drop-in replacement for fonts.googleapis.com.
   For TRUE self-hosting (no third-party CDN at all), download the WOFF2 files from
   gwfh.mranftl.com/fonts/cormorant-garamond and /fonts/inter, drop them in
   assets/fonts/, then replace this @import with @font-face declarations pointing locally. */
@import url('https://fonts.bunny.net/css?family=cormorant-garamond:300,400,500,600,400i&family=inter:300,400,500,600&display=swap');

:root{
  /* Group palette — sampled directly from the brand PNGs in /Brand and colors/ */
  --bfg-red:        #cc4824;   /* Burma Food Group primary */
  --bfg-gold:       #d89c24;   /* Burma Food Group accent */
  --bfg-brown:      #60483c;
  --superstar:      #60483c;   /* Burma Superstar primary - warm brown */
  --superstar-2:    #a89060;   /* Burma Superstar accent - gold/tan */
  --love:           #e46c30;   /* Burma Love primary - coral/orange */
  --love-2:         #a89060;   /* Burma Love accent - gold */
  --love-3:         #60483c;
  --teakwood:       #b49c30;   /* Teakwood primary - olive/mustard */
  --teakwood-2:     #60483c;   /* Teakwood accent - teak brown */
  --alisios:        #486c78;   /* Alisios primary - atlantic blue */
  --alisios-2:      #c06c24;   /* Alisios accent - sunset terracotta */
  --bites:          #d84824;   /* Burma Bites primary - bright red */
  --bites-2:        #60483c;
  --blf:            #004830;   /* Burma Love Foods primary - forest emerald */
  --blf-2:          #d89c24;

  --ink:       #141210;
  --ink-soft:  #3a3430;
  --bone:      #f9f5ed;   /* was #f4efe7 — lifted toward off-white */
  --cream:     #fdfaf3;   /* was #faf6ee — lifted toward off-white */
  --line:      rgba(20,18,16,.10);
  --ink-warm:  #1f1c18;   /* softer-than-ink for dark sections — feels less heavy */

  --serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --sans:  'Inter', system-ui, -apple-system, 'Helvetica Neue', sans-serif;

  --ease: cubic-bezier(.2,.7,.2,1);

  /* Per-page defaults (overridden via body[data-brand]) */
  --brand:         var(--bfg-red);
  --brand-2:       var(--bfg-gold);
  --brand-dark:    var(--bfg-brown);
  --brand-tint:    #fdf6ef;
}

body[data-brand="burma-superstar"]{
  --brand: var(--superstar); --brand-2: var(--superstar-2); --brand-dark:#3d2e25; --brand-tint:#f5ede0;
}
body[data-brand="burma-love"]{
  --brand: var(--love); --brand-2: var(--love-2); --brand-dark:#7a2c0f; --brand-tint:#fdeee2;
}
body[data-brand="teakwood"]{
  --brand: var(--teakwood); --brand-2: var(--teakwood-2); --brand-dark:#3e3420; --brand-tint:#f6f1dc;
}
body[data-brand="alisios"]{
  --brand: var(--alisios); --brand-2: var(--alisios-2); --brand-dark:#1e3540; --brand-tint:#e6eef3;
}
body[data-brand="burma-bites"]{
  --brand: var(--bites); --brand-2: var(--bites-2); --brand-dark:#7b1f0d; --brand-tint:#fde7e0;
}
body[data-brand="burma-love-foods"]{
  --brand: var(--blf); --brand-2: var(--blf-2); --brand-dark:#002b1c; --brand-tint:#e3ebe6;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family: var(--sans);
  color: var(--ink);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: .005em;
}

img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:transparent;color:inherit}

h1,h2,h3,h4{
  font-family: var(--serif);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.01em;
  margin: 0;
}

.eyebrow{
  font-family: var(--sans);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .72rem;
  color: var(--ink-soft);
}

.container{width:min(1240px, 92%); margin-inline:auto}
.container-wide{width:min(1560px, 94%); margin-inline:auto}

/* ====== NAV — hospitality-industry horizontal bar ======
   Pattern: wordmark left · inline uppercase links center · Reserve CTA right.
   Transparent over the hero, frosted-bone after scroll. Restaurants item
   opens a full-width mega-menu listing brands + their locations. */
.nav{
  position: fixed; inset: 0 0 auto 0; z-index: 60;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  padding: 18px clamp(18px, 4vw, 48px);
  color: #fff;
  transition: background .35s var(--ease), color .35s var(--ease), padding .35s var(--ease), border-color .35s var(--ease);
  border-bottom: 1px solid rgba(255,255,255,0);
}
.nav.scrolled{
  background: rgba(250,246,238,.94);
  color: var(--ink);
  backdrop-filter: blur(14px);
  border-bottom-color: var(--line);
  padding-block: 12px;
}
.nav .brand{
  justify-self: start;
  display: inline-flex; align-items: center;
  position: relative;
  padding: 6px 10px;
  border-radius: 8px;
  transition: transform .25s var(--ease), background .25s var(--ease);
}
.nav .brand:hover{
  transform: translateY(-1px) scale(1.03);
  background: rgba(255,255,255,.08);
}
.nav.scrolled .brand:hover{
  background: rgba(107,63,30,.06);
}
.nav .brand::before{
  content: "Home";
  position: absolute;
  bottom: -22px;
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  font-size: .58rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 600;
  color: currentColor;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s var(--ease), transform .25s var(--ease);
  white-space: nowrap;
}
.nav .brand:hover::before,
.nav .brand:focus-visible::before{
  opacity: .9;
  transform: translateX(-50%) translateY(0);
}
.nav .brand .brand-mark{
  height: 56px; width: auto; display: block;
  transition: opacity .35s var(--ease), filter .35s var(--ease);
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.nav.scrolled .brand .brand-mark{
  filter: drop-shadow(0 1px 3px rgba(107,63,30,.18));
}
.nav .brand .brand-mark-dark{
  position: absolute; top: 6px; left: 10px;
  opacity: 0;
}
.nav.scrolled .brand .brand-mark-light{ opacity: 0 }
.nav.scrolled .brand .brand-mark-dark{ opacity: 1 }
@media (max-width: 900px){
  .nav .brand{ padding: 4px 8px }
  .nav .brand .brand-mark{ height: 46px }
  .nav .brand .brand-mark-dark{ top: 4px; left: 8px }
}

/* Center list */
.nav-list{
  display:flex; gap: clamp(18px, 3vw, 44px);
  list-style:none; margin:0; padding:0;
  font-size: .76rem; font-weight: 500; letter-spacing: .22em;
  text-transform: uppercase;
  justify-self: center;
}
.nav-list > li{ position: relative }
.nav-list > li > a{
  display:block; padding: 10px 2px;
  position: relative;
  opacity: .92;
  transition: opacity .2s var(--ease), color .2s var(--ease);
}
.nav-list > li > a::after{
  content:""; position:absolute; left: 0; right: 0; bottom: 4px;
  height: 1px; background: currentColor; transform: scaleX(0);
  transform-origin: left; transition: transform .35s var(--ease);
}
.nav-list > li > a:hover{ opacity: 1 }
.nav-list > li > a:hover::after,
.nav-list > li.active > a::after{ transform: scaleX(1) }
.nav-list > li.has-menu > a .caret{
  display:inline-block; margin-left: 6px; font-size: .7em; transform: translateY(-1px);
  transition: transform .3s var(--ease);
}
.nav-list > li.has-menu:hover > a .caret{ transform: translateY(1px) rotate(180deg) }

/* Right side — Reserve CTA + small hamburger (mobile only) */
.nav-right{
  justify-self: end;
  display:flex; align-items:center; gap: 14px;
}
.nav .reserve{
  display:inline-flex; align-items:center; gap:10px;
  padding: 11px 22px;
  font-size: .72rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase;
  border: 1px solid currentColor;
  border-radius: 999px;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.nav .reserve:hover{
  background: var(--brand, var(--bfg-red));
  border-color: var(--brand, var(--bfg-red));
  color: #fff;
}
.nav.scrolled .reserve{
  background: var(--brand, var(--bfg-red));
  color:#fff;
  border-color: var(--brand, var(--bfg-red));
}
.nav.scrolled .reserve:hover{ filter: brightness(1.08) }

/* Mega-menu dropdown (Restaurants) */
.mega{
  position: absolute; top: calc(100% + 10px); left: 50%; transform: translate(-50%, -8px);
  width: min(720px, 92vw);
  background: #fff; color: var(--ink);
  border-radius: 4px;
  box-shadow: 0 24px 50px -22px rgba(0,0,0,.22), 0 6px 16px -10px rgba(0,0,0,.12);
  padding: 22px 28px 18px;
  opacity: 0; pointer-events: none;
  transition: opacity .3s var(--ease), transform .3s var(--ease);
  z-index: 70;
}
.nav-list > li.has-menu:hover > .mega,
.nav-list > li.has-menu:focus-within > .mega{
  opacity: 1; pointer-events: auto;
  transform: translate(-50%, 0);
}
.mega::before{
  content:""; position:absolute; inset: -10px 0 auto 0; height: 12px;
}
.mega-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 32px;
}
.mega .group{
  padding: 6px 0;
}
.mega .group h5{
  font-family: var(--sans);
  font-size: .62rem; font-weight: 600; letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--brand, var(--bfg-red));
  margin: 0 0 4px;
}
.mega .group .title{
  font-family: var(--serif);
  font-size: 1.2rem; font-weight: 500; color: var(--ink);
  margin-bottom: 2px; letter-spacing: -.005em;
  display:block;
  text-transform: none;
}
.mega .group .title:hover{ color: var(--brand, var(--bfg-red)) }
.mega .group ul{
  list-style:none; padding:0; margin: 2px 0 0;
  display:grid; gap: 2px;
}
.mega .group ul a{
  font-family: var(--sans);
  font-size: .78rem;
  color: var(--ink-soft);
  letter-spacing: 0; text-transform: none; font-weight: 400;
  padding: 3px 0;
  display: inline-flex; align-items: center; gap: 8px;
}
.mega .group ul a::before{
  content:"→"; opacity: 0; transform: translateX(-6px);
  transition: opacity .2s var(--ease), transform .2s var(--ease);
  color: var(--brand, var(--bfg-red));
}
.mega .group ul a:hover{ color: var(--brand, var(--bfg-red)) }
.mega .group ul a:hover::before{ opacity: 1; transform: translateX(0) }
.mega .footer-row{
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center;
  font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
}
.mega .footer-row a{ color: var(--brand, var(--bfg-red)); font-weight: 600 }

/* Hamburger — always visible (desktop + mobile), companion to horizontal nav */
.hamburger{
  display: flex;
  position: relative; z-index: 72;
  width: 44px; height: 44px;
  flex-direction:column; align-items:center; justify-content:center;
  gap: 5px; padding: 0;
  border-radius: 50%;
  transition: background .25s var(--ease);
}
.hamburger:hover{ background: rgba(255,255,255,.08) }
.nav.scrolled .hamburger:hover{ background: rgba(20,18,16,.06) }
.hamburger .line{
  display:block; width: 22px; height: 1.5px; background: currentColor;
  transition: transform .4s var(--ease), opacity .2s var(--ease);
  transform-origin: center;
}
.nav.open .hamburger .line:nth-child(1){ transform: translateY(3.25px) rotate(45deg) }
.nav.open .hamburger .line:nth-child(2){ transform: translateY(-3.25px) rotate(-45deg) }

/* Mobile: hide horizontal nav & reserve, keep the hamburger */
@media (max-width: 900px){
  .nav{ grid-template-columns: 1fr auto }
  .nav-list, .nav .reserve{ display: none }
}

/* ======== MENU DRAWER ========
   Industry-standard hospitality drawer: right-docked, dark editorial panel
   with serif primary links, grouped restaurant list, Reserve CTA, and
   contact block. Opens on hamburger click, closes via X / Escape / scrim. */
.menu-scrim{
  position: fixed; inset: 0; z-index: 58;
  background: rgba(12,10,9,.55);
  backdrop-filter: blur(4px);
  opacity: 0; pointer-events: none;
  transition: opacity .4s var(--ease);
}
.menu-scrim.open{ opacity: 1; pointer-events: auto }

.menu-panel{
  position: fixed; top: 0; right: 0; bottom: 0;
  width: min(500px, 100vw);
  z-index: 60;
  background: #15110e;
  color: var(--cream);
  transform: translateX(100%);
  transition: transform .55s var(--ease);
  display: grid;
  grid-template-rows: auto 1fr auto;
  box-shadow: -30px 0 80px -20px rgba(0,0,0,.55);
  overflow-y: auto;
  /* warm editorial accent */
  background-image:
    radial-gradient(1200px 400px at 120% -10%, rgba(201,100,66,.18), transparent 60%),
    radial-gradient(800px 400px at -20% 110%, rgba(216,156,36,.10), transparent 60%);
}
.menu-panel.open{ transform: translateX(0) }

/* Head row */
.menu-panel .mp-head{
  display:flex; align-items:center; justify-content:space-between;
  padding: 22px clamp(24px, 4vw, 44px);
}
.menu-panel .mp-mark{
  font-family: var(--serif);
  font-size: 1.25rem; letter-spacing: .02em;
  color: rgba(255,255,255,.85);
}
.menu-panel .mp-close{
  width: 44px; height: 44px;
  display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 50%;
  color: var(--cream);
  transition: background .25s var(--ease), border-color .25s var(--ease), transform .3s var(--ease);
}
.menu-panel .mp-close:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.5);
  transform: rotate(90deg);
}

/* Navigation */
.menu-panel .mp-nav{
  padding: clamp(20px, 4vw, 36px) clamp(24px, 4vw, 44px) 12px;
}
.menu-panel .mp-primary{
  list-style:none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.menu-panel .mp-primary > li > a{
  display:block;
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.7rem, 3.2vw, 2.3rem);
  letter-spacing: -.008em;
  line-height: 1.1;
  padding: 10px 0;
  color: var(--cream);
  position: relative;
  transition: color .25s var(--ease), padding-left .35s var(--ease);
}
.menu-panel .mp-primary > li > a::before{
  content:""; position:absolute; left:-16px; top: 50%;
  width: 6px; height: 1px; background: var(--brand, #c96442);
  transform: scaleX(0); transform-origin: right;
  transition: transform .35s var(--ease);
}
.menu-panel .mp-primary > li > a:hover{
  color: #fff; padding-left: 14px;
}
.menu-panel .mp-primary > li > a:hover::before{ transform: scaleX(1); transform-origin: left }

.menu-panel .mp-divider{
  height: 1px; background: rgba(255,255,255,.1);
  margin: 20px 0;
}

.menu-panel .mp-section .mp-eyebrow{
  font-family: var(--sans);
  font-size: .68rem; font-weight: 600; letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(216,156,36,.85); /* warm gold */
  margin: 0 0 14px;
}
.menu-panel .mp-restaurants{
  list-style:none; margin:0; padding:0;
  display: flex; flex-direction: column; gap: 2px;
}
.menu-panel .mp-restaurants > li > a{
  display:grid; gap: 2px;
  font-family: var(--serif);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  font-weight: 300; line-height: 1.15;
  padding: 8px 0;
  color: var(--cream);
  transition: color .25s var(--ease), padding-left .35s var(--ease);
}
.menu-panel .mp-restaurants > li > a:hover{ color:#fff; padding-left: 10px }
.menu-panel .mp-restaurants .mp-sub-meta{
  display:block;
  font-family: var(--sans);
  font-size: .76rem; letter-spacing: .08em;
  color: rgba(245,239,230,.55);
  font-weight: 400;
  margin-top: 2px;
}

/* Active-state markers inside the drawer */
.menu-panel a.active{ color: var(--brand, #c96442) }

/* Foot */
.menu-panel .mp-foot{
  border-top: 1px solid rgba(255,255,255,.1);
  padding: clamp(18px, 3vw, 28px) clamp(24px, 4vw, 44px) clamp(22px, 3vw, 30px);
  display: grid; gap: 18px;
}
.menu-panel .mp-reserve{
  display: inline-flex; justify-content: center; align-items: center;
  padding: 16px 24px;
  background: var(--brand, #c96442); color: #fff;
  border: 1px solid var(--brand, #c96442);
  border-radius: 999px;
  font-family: var(--sans);
  font-size: .76rem; font-weight: 600; letter-spacing: .28em;
  text-transform: uppercase;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.menu-panel .mp-reserve:hover{
  background: transparent;
  color: var(--brand, #c96442);
  border-color: var(--brand, #c96442);
}
.menu-panel .mp-meta{
  display:grid; grid-template-columns: 1fr 1fr; gap: 18px;
}
.menu-panel .mp-meta-label{
  font-family: var(--sans);
  font-size: .62rem; font-weight: 600; letter-spacing: .28em;
  text-transform: uppercase; color: rgba(255,255,255,.5);
  margin-bottom: 4px;
}
.menu-panel .mp-meta a{
  font-family: var(--serif);
  font-size: 1rem;
  color: rgba(245,239,230,.92);
  transition: color .2s var(--ease);
}
.menu-panel .mp-meta a:hover{ color: var(--brand, #c96442) }
.menu-panel .mp-social{
  display:flex; gap: 10px; align-items:center;
  font-family: var(--sans);
  font-size: .72rem; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,255,255,.5);
}
.menu-panel .mp-social a{
  color: rgba(245,239,230,.85);
  transition: color .2s var(--ease);
}
.menu-panel .mp-social a:hover{ color: var(--brand, #c96442) }

@media (max-width: 520px){
  .menu-panel .mp-meta{ grid-template-columns: 1fr }
}

body.menu-open{ overflow: hidden }

/* ====== HERO ====== */
.hero{
  position: relative; min-height: 100vh;
  display:flex; align-items:flex-end;
  color:#fff; overflow:hidden;
  padding: 0 clamp(18px, 4vw, 48px) clamp(40px, 8vh, 90px);
}
.hero .media{
  position:absolute; inset:0; z-index:0;
  background:#0b0a08;
}
.hero .media video,
.hero .media img{
  width:100%; height:100%; object-fit:cover;
}
.hero .media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.22) 0%, rgba(0,0,0,.02) 30%, rgba(0,0,0,.5) 100%);
}
.hero .content{
  position:relative; z-index:2; max-width: 900px;
}
.hero h1{
  font-size: clamp(2.5rem, 7vw, 6rem);
  letter-spacing: -.02em;
  font-weight: 300;
}
.hero h1 em{ font-style: italic; font-weight: 300 }
.hero p.lede{
  font-family: var(--sans);
  font-size: clamp(.98rem, 1.3vw, 1.15rem);
  font-weight: 300;
  max-width: 560px;
  margin-top: 18px; opacity:.92;
}
.hero .scroll-cue{
  position:absolute; left:50%; bottom:20px; transform:translateX(-50%);
  z-index:2; font-size:.7rem; letter-spacing:.3em; text-transform:uppercase;
  opacity:.8;
}
.hero .scroll-cue::after{
  content:""; display:block; width:1px; height:44px; margin: 10px auto 0;
  background: rgba(255,255,255,.6);
  animation: cue 2.2s var(--ease) infinite;
}
@keyframes cue{
  0%{transform:scaleY(0); transform-origin:top}
  50%{transform:scaleY(1); transform-origin:top}
  51%{transform-origin:bottom}
  100%{transform:scaleY(0); transform-origin:bottom}
}

/* ====== SECTIONS ====== */
.section{ padding: clamp(70px, 10vw, 140px) 0 }
.section.tight{ padding: clamp(50px, 7vw, 90px) 0 }
.section.dark{ background: var(--ink-warm); color: var(--bone) }
.section.bone{ background: var(--bone) }
.section h2{ font-size: clamp(2rem, 4.2vw, 3.4rem) }

.intro{
  display:grid; grid-template-columns: 1fr 1.4fr; gap: clamp(30px, 6vw, 80px);
  align-items: start;
}
@media (max-width: 820px){ .intro{ grid-template-columns: 1fr } }
.intro .left .eyebrow{ margin-bottom: 18px }
.intro .right p{ font-size: clamp(1.05rem, 1.4vw, 1.3rem); line-height: 1.55; margin: 0 0 20px; color: var(--ink-soft) }

/* ====== BRAND INDEX (editorial hover-reveal) ====== */
.brand-index{
  display:grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(32px, 5vw, 80px);
  align-items: start;
}
@media (max-width: 960px){ .brand-index{ grid-template-columns: 1fr; gap: 28px } }

.bi-list{
  display:flex; flex-direction:column;
  border-top: 1px solid rgba(34,34,34,.14);
}
.bi-row{
  position:relative;
  display:grid;
  grid-template-columns: auto 1fr auto;
  align-items:center;
  gap: clamp(18px, 2.4vw, 34px);
  padding: clamp(22px, 3vw, 34px) 4px;
  border-bottom: 1px solid rgba(34,34,34,.14);
  color: var(--ink);
  text-decoration:none;
  transition: color .35s var(--ease), padding .35s var(--ease);
}
.bi-row::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0;
  width: 0;
  background: var(--accent, var(--ink));
  transition: width .45s var(--ease);
  z-index: 0;
}
.bi-row:hover{ padding-left: 22px; color: var(--accent, var(--ink)) }
.bi-row:hover::before{ width: 4px }

.bi-num{
  font-family: var(--serif);
  font-size: clamp(.85rem, 1vw, 1rem);
  letter-spacing: .14em;
  color: var(--ink-soft);
  font-feature-settings: "tnum";
}
.bi-body{ display:flex; flex-direction:column; gap: 6px; min-width: 0 }
.bi-body h3{
  margin:0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.6rem, 3.2vw, 2.8rem);
  line-height: 1.05;
  letter-spacing: -.01em;
}
.bi-meta{
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.bi-arrow{
  font-size: 1.4rem;
  color: var(--ink-soft);
  transition: transform .4s var(--ease), color .35s var(--ease);
}
.bi-row:hover .bi-arrow{ transform: translateX(6px); color: var(--accent, var(--ink)) }

/* right-side sticky preview stage */
.bi-preview{
  position: sticky;
  top: calc(var(--nav-h, 76px) + 24px);
  aspect-ratio: 4/5;
  overflow: hidden;
  background: #111;
}
.bi-pv-stage{ position:absolute; inset:0 }
.bi-pv{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity .7s var(--ease), transform 1.2s var(--ease);
  filter: brightness(.92) saturate(1.04);
}
.bi-pv.is-active{
  opacity: 1;
  transform: scale(1);
}
@media (max-width: 960px){
  .bi-preview{ position: relative; top: 0; aspect-ratio: 16/10; order: -1; margin-bottom: 10px }
}

/* ====== SPLIT STORY ====== */
.split{
  display:grid; grid-template-columns: 1fr 1fr; min-height: 80vh;
}
@media (max-width: 820px){ .split{ grid-template-columns: 1fr } }
.split .half{ display:flex; align-items:center; padding: clamp(40px, 7vw, 100px) clamp(24px, 5vw, 80px) }
.split .half.image{ padding:0; position:relative; overflow:hidden; min-height: 50vh }
.split .half.image img, .split .half.image video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.split h2{ font-size: clamp(1.8rem, 3.4vw, 2.8rem); margin-bottom: 18px }
.split p{ font-size: 1.05rem; color: var(--ink-soft); max-width: 52ch }

/* Dark variant of a split half — light text on ink */
.split .half.dark{ background: var(--ink-warm); color: var(--cream) }
.split .half.dark h2{ color: var(--cream) }
.split .half.dark p{ color: rgba(244,239,231,.85) }
.split .half.dark .eyebrow{ color: rgba(255,255,255,.7) }

/* ====== LOCATION CONTACT CARDS ======
   Reusable card for showing restaurant name, address, phone with quick link. */
.loc-contacts{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 1000px){ .loc-contacts{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width: 620px){  .loc-contacts{ grid-template-columns: 1fr } }

.loc-contact{
  display: flex; flex-direction: column; gap: 6px;
  padding: 28px 26px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 2px;
  color: var(--ink);
  position: relative;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.loc-contact:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 40px -24px rgba(0,0,0,.18);
  border-color: transparent;
}
.loc-contact .lc-eyebrow{
  font-family: var(--sans); font-weight: 600;
  font-size: .64rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--brand, var(--bfg-red));
  margin-bottom: 4px;
}
.loc-contact .lc-name{
  font-family: var(--serif); font-size: 1.45rem; font-weight: 500;
  line-height: 1.15; margin-bottom: 6px;
}
.loc-contact .lc-address{
  font-size: .92rem; color: var(--ink-soft); line-height: 1.55;
}
.loc-contact .lc-phone{
  font-family: var(--serif); font-size: 1.05rem; color: var(--ink);
  margin-top: 4px;
}
.loc-contact .lc-cta{
  margin-top: 12px;
  font-family: var(--sans); font-size: .7rem; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--brand, var(--bfg-red));
  transition: letter-spacing .3s var(--ease);
}
.loc-contact:hover .lc-cta{ letter-spacing: .28em }

/* ====== AWARDS SECTION ======
   Real press/badge art in a quiet editorial grid. Each award has an image
   and a small caption underneath with eyebrow + title + recipient line. */
.awards{ }
.award-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(20px, 3vw, 40px);
  align-items: start;
}
@media (max-width: 1000px){ .award-grid{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width: 520px){ .award-grid{ grid-template-columns: 1fr } }

.award-grid.brand-awards{
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  max-width: 880px; margin-inline: auto;
}

.award{
  margin: 0; padding: 0;
  display: flex; flex-direction: column; align-items: center;
  gap: 18px; text-align: center;
}
.award img{
  max-height: 210px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 22px rgba(0,0,0,.08));
  transition: transform .5s var(--ease);
}
.award:hover img{ transform: translateY(-4px) }
.award figcaption{
  display: grid; gap: 4px;
  max-width: 30ch;
}
.award .ac-eyebrow{
  font-family: var(--sans); font-weight: 600;
  font-size: .66rem; letter-spacing: .24em; text-transform: uppercase;
  color: var(--brand, var(--bfg-red));
}
.award .ac-title{
  font-family: var(--serif); font-size: 1.1rem; line-height: 1.3;
  color: var(--ink);
  font-weight: 500;
}
.award .ac-sub{
  font-family: var(--sans); font-size: .82rem;
  color: var(--ink-soft);
  letter-spacing: .02em;
}

/* On dark sections, soften text */
.section.dark .award .ac-title{ color: var(--cream) }
.section.dark .award .ac-sub{ color: rgba(244,239,231,.7) }

/* ====== BUTTONS ====== */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 14px 26px;
  font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 500;
  border: 1px solid currentColor; border-radius: 999px;
  transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
}
.btn:hover{ background: currentColor }
.btn:hover span{ color: var(--cream) }
.btn.solid{ background: var(--ink); color: var(--cream); border-color: var(--ink) }
.btn.solid:hover{ background: transparent; color: var(--ink) }
.btn.ghost{ color: #fff }
.btn-row{ display:flex; flex-wrap:wrap; gap: 12px; margin-top: 24px }

/* ====== LOCATION PAGE ====== */
.loc-hero{
  position:relative; min-height: 72vh;
  display:flex; align-items:flex-end; color:#fff; overflow:hidden;
  padding: 0 clamp(18px,4vw,48px) clamp(36px,6vw,60px);
}
.loc-hero .media{ position:absolute; inset:0; z-index:0 }
.loc-hero .media img{ width:100%; height:100%; object-fit:cover }
.loc-hero .media::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.5));
}
.loc-hero .content{ position:relative; z-index:2; max-width: 920px }
.loc-hero h1{ font-size: clamp(2.4rem, 6vw, 5rem); font-weight: 300 }

.loc-info{
  display:grid; grid-template-columns: 1.2fr 1fr;
  gap: clamp(30px, 6vw, 90px);
  padding: clamp(60px, 9vw, 110px) 0;
}
@media (max-width: 900px){ .loc-info{ grid-template-columns: 1fr } }
.loc-info h2{ font-size: clamp(1.8rem, 3.2vw, 2.6rem); margin-bottom: 20px }
.loc-info p{ color: var(--ink-soft); font-size: 1.05rem }
.loc-info .details{
  border-top: 1px solid var(--line); padding-top: 26px;
  display:grid; gap: 20px;
}
.loc-info .detail{ display:grid; gap:4px }
.loc-info .detail .eyebrow{ font-size:.68rem }
.loc-info .detail span{ font-size: 1.05rem; font-family: var(--serif); font-weight: 500 }
.loc-info .hours{ display:grid; gap:3px; font-family: var(--sans); font-size: .95rem; color: var(--ink-soft) }
.loc-info .hours div{ display:flex; justify-content:space-between; gap: 24px; max-width: 300px }

/* ====== GALLERY ====== */
/* Masonry layout — each image keeps its native aspect ratio.
   CSS columns naturally tile portrait + landscape photos without cropping. */
.gallery{
  column-count: 3;
  column-gap: 10px;
  padding-block: 16px;
}
.gallery .g{
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 10px;
  overflow: hidden;
  background: #111;
  border-radius: 4px;
  display: block;
}
.gallery .g img{
  width: 100%;
  height: auto;
  display: block;
  transition: transform 1.1s var(--ease), filter .5s var(--ease);
}
.gallery .g:hover img{ transform: scale(1.04) }
/* Legacy s1-s7 classes are no-ops in masonry — kept so existing markup still validates */
.gallery .g.s1,
.gallery .g.s2,
.gallery .g.s3,
.gallery .g.s4,
.gallery .g.s5,
.gallery .g.s6,
.gallery .g.s7{ /* no positional rules in masonry */ }
@media (max-width: 1100px){
  .gallery{ column-count: 2; }
}
@media (max-width: 560px){
  .gallery{ column-count: 1; }
}

/* ====== BRAND PAGE SPECIFIC ====== */
.brand-hero{
  min-height: 78vh; display:flex; align-items:center; color:#fff;
  position: relative; overflow:hidden;
  padding: 140px clamp(18px,4vw,48px) 80px;
}
.brand-hero .media{ position:absolute; inset:0; z-index:0 }
.brand-hero .media img, .brand-hero .media video{ width:100%; height:100%; object-fit:cover }
.brand-hero .media::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(0,0,0,.5), rgba(0,0,0,.22) 60%, rgba(0,0,0,.15));
}
.brand-hero .content{ position:relative; z-index:2; max-width: 920px }
.brand-hero .brand-logo{ max-height: 110px; width:auto; margin-bottom: 32px }
.brand-hero h1{ font-size: clamp(2.2rem, 5vw, 4.2rem); font-weight: 300 }
.brand-hero p{ font-size: clamp(1rem, 1.3vw, 1.2rem); max-width: 640px; margin-top: 18px; opacity:.92 }

.brand-accent{ height: 6px; background: var(--accent, var(--bfg-red)) }

/* Locations list on brand page */
.loc-cards{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
}
.loc-card{
  position:relative; display:block; aspect-ratio: 4/3; overflow:hidden;
  color:#fff; background:#111; isolation:isolate;
}
.loc-card img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition: transform .9s var(--ease), filter .5s var(--ease);
  filter: brightness(.86);
}
.loc-card:hover img{ transform: scale(1.06); filter: brightness(.96) }
.loc-card::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,.08) 55%);
}
.loc-card .body{
  position:absolute; inset: auto 0 0 0; padding: clamp(18px, 2vw, 26px); z-index:2;
}
.loc-card h3{ font-size: 1.6rem; font-weight: 400 }
.loc-card .meta{ opacity:.85; font-size:.82rem; margin-top: 4px }

/* ====== FOOTER ====== */
footer{
  background: var(--ink-warm); color: var(--bone);
  padding: 80px clamp(18px, 4vw, 48px) 40px;
}

/* Compact locations strip at top of footer */
footer .flocs-wrap{
  margin-bottom: 60px;
  padding-bottom: 50px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
footer .flocs-head{
  display:flex; align-items:baseline; justify-content:space-between;
  flex-wrap: wrap; gap: 16px;
  margin-bottom: 26px;
}
footer .flocs-head h4{
  font-family: var(--sans); font-size: .72rem; font-weight: 600;
  letter-spacing: .28em; text-transform: uppercase;
  margin: 0; opacity: .75;
}
footer .flocs-head span{
  font-family: var(--serif); font-size: 1.1rem; font-style: italic;
  color: rgba(244,239,231,.6);
}
footer .flocs{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px 36px;
}
@media (max-width: 900px){ footer .flocs{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width: 560px){ footer .flocs{ grid-template-columns: 1fr } }

footer .fl-card{
  display:block;
  padding-left: 14px;
  border-left: 1px solid rgba(255,255,255,.15);
  transition: border-color .3s var(--ease), padding-left .3s var(--ease);
}
footer .fl-card:hover{
  border-left-color: var(--brand, var(--bfg-gold));
  padding-left: 18px;
}
footer .fl-eyebrow{
  font-family: var(--sans); font-weight: 600;
  font-size: .62rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--bfg-gold);
  margin-bottom: 6px;
}
footer .fl-address{
  font-family: var(--serif);
  font-size: 1rem; line-height: 1.4;
  color: rgba(244,239,231,.92);
  margin-bottom: 4px;
}
footer .fl-phone{
  font-family: var(--sans); font-size: .86rem; letter-spacing: .04em;
  color: rgba(244,239,231,.7);
}

footer .fcols{
  display:grid; grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 40px;
}
@media (max-width: 820px){ footer .fcols{ grid-template-columns: 1fr 1fr } }
footer h4{ font-family: var(--sans); font-size:.72rem; font-weight:600; letter-spacing:.24em; text-transform:uppercase; margin-bottom: 16px; opacity:.7 }
footer ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px }
footer li a{ opacity:.8; transition: opacity .2s }
footer li a:hover{ opacity: 1 }
footer .wordmark{
  font-family: var(--serif); font-size: 2rem; letter-spacing: .01em;
  line-height:1; margin-bottom: 22px;
}
footer .copy{
  border-top: 1px solid rgba(255,255,255,.12);
  margin-top: 60px; padding-top: 22px;
  font-size: .78rem; opacity:.65;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap: 12px;
}

/* ====== REVEAL / FADES ====== */
.reveal{ opacity:0; transform: translateY(20px); transition: opacity .9s var(--ease), transform .9s var(--ease) }
.reveal.on{ opacity:1; transform: none }

/* ====== COMING SOON PLATE ====== */
.plate{
  display:grid; place-items:center; min-height: 60vh;
  padding: 60px 24px; text-align:center;
  background: var(--plate, #111); color:#fff;
}
.plate .mark{ max-height: 120px; margin-bottom: 26px }
.plate h2{ font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 300; margin-bottom: 14px }
.plate p{ max-width: 56ch; opacity:.85 }

/* ====== HERO VIDEO WITH OVERLAY TITLE ======
   Full-bleed video at the top of brand / location pages; the restaurant name,
   eyebrow, logo, blurb and CTAs sit directly on top, anchored bottom-left
   over a dark gradient for legibility. */
.hero-video{
  position: relative;
  width: 100%;
  min-height: 92vh;
  overflow: hidden;
  color: #fff;
  background: #000;
  display: flex;
  align-items: flex-end;
}
.hero-video .hv-media{
  position: absolute; inset: 0; z-index: 0;
  background: #0b0a08;
}
.hero-video .hv-media video,
.hero-video .hv-media img{
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
}
.hero-video .hv-media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom,
      rgba(0,0,0,.55) 0%,
      rgba(0,0,0,.10) 28%,
      rgba(0,0,0,.25) 55%,
      rgba(0,0,0,.80) 100%);
  pointer-events: none;
}
.hero-video .hv-overlay{
  position: relative; z-index: 2;
  width: 100%;
  padding: 120px clamp(18px, 4vw, 48px) clamp(40px, 6vw, 80px);
}
.hero-video .hv-inner{
  width: min(1240px, 94%); margin-inline: auto;
  max-width: 900px;
}
.hero-video .hv-logo{
  max-height: 84px; width: auto;
  margin-bottom: 26px;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,.35));
}
.hero-video .eyebrow{
  color: rgba(255,255,255,.85);
  letter-spacing: .26em;
  margin-bottom: 14px;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.hero-video h1{
  font-size: clamp(2.4rem, 5.6vw, 4.8rem);
  letter-spacing: -.015em;
  font-weight: 300;
  color: #fff;
  text-shadow: 0 2px 24px rgba(0,0,0,.45);
}
.hero-video h1 em{ font-style: italic; font-weight: 300; color: var(--brand-2, #fff) }
.hero-video p.lede{
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  color: rgba(255,255,255,.92);
  margin-top: 18px;
  max-width: 62ch;
  text-shadow: 0 1px 10px rgba(0,0,0,.5);
  font-weight: 300;
}
.hero-video .btn-row{ margin-top: 28px }

/* Buttons on the dark video overlay */
.hero-video .btn.ghost{
  color: #fff; border-color: rgba(255,255,255,.7);
}
.hero-video .btn.ghost:hover{ background: #fff; color: var(--brand, var(--ink)) }
.hero-video .btn.ghost:hover span{ color: var(--brand, var(--ink)) }
.hero-video .btn.brand-solid{
  background: var(--brand); color: #fff; border-color: var(--brand);
}
.hero-video .btn.brand-solid:hover{
  background: #fff; color: var(--brand); border-color: #fff;
}
.hero-video .btn.brand-solid:hover span{ color: var(--brand) }

@media (max-width: 820px){
  .hero-video{ min-height: 82vh }
  .hero-video .hv-overlay{ padding-top: 100px }
  .hero-video .hv-logo{ max-height: 64px; margin-bottom: 20px }
}

/* branded buttons */
.btn.brand{
  border-color: var(--brand); color: var(--brand);
}
.btn.brand:hover{ background: var(--brand); color: #fff }
.btn.brand:hover span{ color:#fff }
.btn.brand-solid{
  background: var(--brand); color:#fff; border-color: var(--brand);
}
.btn.brand-solid:hover{ background: transparent; color: var(--brand) }

/* Accent stripe uses page brand by default */
.brand-accent{ background: var(--brand) }

/* Section tints pick up brand color */
.section.brand-bone{ background: var(--brand-tint) }
.section.brand-dark{ background: var(--brand-dark); color: var(--cream) }


/* ====== BURMA LOVE FOODS ====== */
/* Three-up category callouts */
.foods-cats{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
@media (max-width: 960px){ .foods-cats{ grid-template-columns: 1fr } }
.fcat{
  position:relative;
  display:flex; flex-direction:column;
  justify-content:space-between;
  padding: clamp(28px, 3vw, 40px);
  min-height: 260px;
  background: var(--cream);
  border: 1px solid rgba(34,34,34,.14);
  color: var(--ink);
  text-decoration: none;
  transition: transform .4s var(--ease), border-color .4s var(--ease), background .4s var(--ease);
}
.fcat:hover{
  transform: translateY(-4px);
  border-color: var(--brand, var(--ink));
}
.fcat-eyebrow{
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color: var(--ink-soft); margin-bottom: 16px;
}
.fcat h3{
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  line-height: 1.1;
  margin: 0 0 12px;
}
.fcat p{
  font-size: 1rem; line-height: 1.55;
  color: var(--ink-soft);
  margin: 0 0 24px;
}
.fcat-arrow{
  font-size: 1.3rem;
  color: var(--brand, var(--ink));
  transition: transform .4s var(--ease);
}
.fcat:hover .fcat-arrow{ transform: translateX(8px) }

/* Product catalog — editorial, borderless */
.fp-group{ margin-top: clamp(56px, 8vw, 120px) }
.fp-group:first-child{ margin-top: 0 }

.fp-group-head{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(24px, 3.5vw, 44px);
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(34,34,34,.18);
}
.fp-kicker{
  font-size:.78rem; letter-spacing:.18em; text-transform:uppercase;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.fp-group-title{
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.9rem, 3.6vw, 3rem);
  letter-spacing: -.015em;
  line-height: 1;
  margin: 0;
  color: var(--ink);
}

.fp-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: clamp(24px, 3.6vw, 56px);
  row-gap: clamp(40px, 5.5vw, 72px);
}
@media (max-width: 900px){ .fp-grid{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width: 520px){ .fp-grid{ grid-template-columns: 1fr } }

.fp-card{
  display:flex;
  flex-direction:column;
  background: transparent;
  border: 0;
  color: var(--ink);
  text-decoration: none;
}

/* Small & minimal — products sit calmly on a soft cream tile.
   No zoom, no blend mode, no heavy filtering. */
.fp-media{
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--bone, #f3ede1);
  border: 0;
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  padding: clamp(18px, 2.4vw, 32px);
  box-shadow: 0 1px 2px rgba(34,34,34,.04);
  transition: box-shadow .35s var(--ease), transform .35s var(--ease);
}
.fp-media img{
  width: 62%;
  height: 62%;
  object-fit: contain;
  transition: transform .5s var(--ease);
}
.fp-card:hover .fp-media{
  box-shadow: 0 8px 20px rgba(34,34,34,.08), 0 2px 6px rgba(34,34,34,.04);
}
.fp-card:hover .fp-media img{
  transform: scale(1.04);
}

.fp-index{
  position: absolute;
  top: 10px;
  left: 12px;
  z-index: 2;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .22em;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
  opacity: .55;
}

/* Tone classes neutralized — uniform editorial cream */
.fp-group.tone-kits       .fp-media,
.fp-group.tone-grab       .fp-media,
.fp-group.tone-condiments .fp-media{ background: var(--bone, #f3ede1) }

.fp-body{
  padding: 18px 2px 0;
  display:flex; flex-direction:column; gap: 6px;
  border: 0;
}
.fp-body h4{
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.15rem, 1.55vw, 1.4rem);
  line-height: 1.15;
  letter-spacing: -.005em;
  margin: 0;
  color: var(--ink);
}
.fp-body p{
  font-size: .95rem;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
  max-width: 38ch;
}
.fp-arrow{
  font-size:.78rem; letter-spacing:.14em; text-transform: uppercase;
  color: var(--brand, var(--ink-soft));
}

/* Retailer grid (logos + links) */
.retailer-grid{
  margin: clamp(20px, 3vw, 32px) 0 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(34,34,34,.14);
  border: 1px solid rgba(34,34,34,.14);
}
@media (max-width: 900px){ .retailer-grid{ grid-template-columns: repeat(3, 1fr) } }
@media (max-width: 600px){ .retailer-grid{ grid-template-columns: repeat(2, 1fr) } }

.retailer{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--cream);
  padding: clamp(24px, 3.2vw, 40px) 18px;
  min-height: clamp(140px, 14vw, 180px);
  text-decoration: none;
  color: var(--ink);
  transition: background .25s ease, transform .25s ease;
}
.retailer:hover,
.retailer:focus-visible{
  background: #fff;
  transform: translateY(-1px);
  outline: none;
}
.retailer img{
  max-width: 70%;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .78;
  transition: filter .25s ease, opacity .25s ease, transform .25s ease;
}
.retailer:hover img,
.retailer:focus-visible img{
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.03);
}
.retailer-name{
  font-family: var(--serif);
  font-size: .95rem;
  letter-spacing: .01em;
  color: var(--ink-soft);
  text-align: center;
  line-height: 1.2;
}
.retailer:hover .retailer-name,
.retailer:focus-visible .retailer-name{
  color: var(--ink);
}

/* Where-to-buy regional groups — compact, scannable, clearly clickable */
.wtb-region{
  margin-top: clamp(28px, 3.5vw, 44px);
}
.wtb-region:first-of-type{
  margin-top: clamp(18px, 2.5vw, 28px);
}
.wtb-region-head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(34,34,34,.12);
}
.wtb-region-name{
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  letter-spacing: .005em;
  margin: 0;
  color: var(--ink);
}
.wtb-region-count{
  font-size: .68rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-soft);
  white-space: nowrap;
}
.wtb-grid{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
}
.wtb-card{
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  padding: 10px 32px 10px 10px;
  background: var(--cream, #fff);
  border: 1px solid rgba(34,34,34,.10);
  border-radius: 4px;
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.wtb-card .wtb-meta{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wtb-logo{
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  font-family: var(--sans, system-ui, sans-serif);
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .02em;
  color: #fff;
  background: #2a2a2a;
  text-transform: uppercase;
  line-height: 1;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
  transition: transform .2s ease;
}
.wtb-card:hover .wtb-logo{ transform: scale(1.04); }

/* Per-retailer brand colors */
.wtb-logo[data-brand="wfm"]{ background: #006B3D; }                  /* Whole Foods green */
.wtb-logo[data-brand="birite"]{ background: #C8201F; }                /* Bi-Rite red */
.wtb-logo[data-brand="mollie"]{ background: #E45A2B; }                /* Mollie Stone's orange */
.wtb-logo[data-brand="rainbow"]{
  background: linear-gradient(135deg, #E63946 0%, #F4A261 25%, #E9C46A 50%, #2A9D8F 75%, #264653 100%);
}
.wtb-logo[data-brand="woodlands"]{ background: #2F5D3A; }             /* deep forest */
.wtb-logo[data-brand="greenearth"]{ background: #4A7C2A; }            /* leaf green */
.wtb-logo[data-brand="marina"]{ background: #1F4E7A; }                /* navy */
.wtb-logo[data-brand="otheravenues"]{ background: #2A9D8F; }          /* teal */
.wtb-logo[data-brand="bbowl"]{ background: #1E5631; }                 /* Berkeley Bowl green */
.wtb-logo[data-brand="draegers"]{ background: #6B1F1F; }              /* burgundy */
.wtb-logo[data-brand="goodeggs"]{ background: #F26B3F; }              /* Good Eggs orange */
.wtb-logo[data-brand="lakeshore"]{ background: #2D7A8C; }             /* lake teal */
.wtb-logo[data-brand="village"]{ background: #6B7A3A; }               /* olive */
.wtb-logo[data-brand="alameda"]{ background: #355C7D; }               /* steel blue */
.wtb-logo[data-brand="chestnut"]{ background: #6B4423; }              /* chestnut brown */
.wtb-logo[data-brand="roberts"]{ background: #8B1E2F; }               /* wine */
.wtb-logo[data-brand="sigonas"]{ background: #B8261A; }               /* tomato */
.wtb-logo[data-brand="demartini"]{ background: #5A7C2A; }             /* orchard green */
.wtb-logo[data-brand="piazza"]{ background: #3A6B4A; }                /* fine-food green */
.wtb-logo[data-brand="guss"]{ background: #1E5631; }                  /* Gus's green */
.wtb-logo[data-brand="mitsuwa"]{ background: #1E5BA8; }               /* Mitsuwa blue */

/* When a real logo image is present, swap the monogram look for a clean white tile */
.wtb-logo img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 4px;
  background: #fff;
  border-radius: 6px;
}
.wtb-logo:has(img){
  background: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(34,34,34,.10);
  padding: 0;
}
/* Visual link affordance — arrow indicator */
.wtb-card::after{
  content: "↗";
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  font-size: .85rem;
  line-height: 1;
  color: var(--ink-soft);
  opacity: .45;
  transition: opacity .2s ease, color .2s ease, transform .2s ease;
}
.wtb-card:hover,
.wtb-card:focus-visible{
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,.05);
  border-color: var(--w-saffron, #C8772C);
  background: #fff;
  outline: none;
}
.wtb-card:hover::after,
.wtb-card:focus-visible::after{
  opacity: 1;
  color: var(--w-saffron, #C8772C);
  transform: translate(2px, calc(-50% - 2px));
}
.wtb-name{
  font-family: var(--serif);
  font-size: 1.05rem;
  letter-spacing: .005em;
  color: var(--ink);
  line-height: 1.2;
}
.wtb-locs{
  font-size: .8rem;
  letter-spacing: .03em;
  color: var(--ink-soft);
  line-height: 1.35;
}
.wtb-note{
  margin-top: clamp(20px, 2.5vw, 28px);
  text-align: center;
  font-size: .95rem;
  color: var(--ink-soft);
}
.wtb-note a{
  color: var(--w-saffron, var(--brand, var(--ink)));
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}
.wtb-note a:hover,
.wtb-note a:focus-visible{
  color: var(--ink);
}

/* Tabbed regions — show one region at a time */
.wtb-tabs{
  position: relative;
  margin-top: clamp(8px, 1.5vw, 16px);
}
.wtb-tabs > input[type="radio"]{
  position: absolute;
  opacity: 0;
  width: 1px; height: 1px;
  pointer-events: none;
  clip: rect(0,0,0,0);
}
.wtb-tablist{
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(34,34,34,.12);
  margin-bottom: 14px;
}
.wtb-tab{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 20px;
  cursor: pointer;
  font-family: var(--serif);
  font-size: 1.05rem;
  color: var(--ink-soft);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color .2s ease, border-color .2s ease;
  user-select: none;
}
.wtb-tab:hover{ color: var(--ink); }
.wtb-tab-count{
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .12em;
  color: var(--ink-soft);
  background: rgba(34,34,34,.06);
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 500;
}
.wtb-tabs > input[type="radio"]:focus-visible + .wtb-tablist .wtb-tab,
.wtb-tabs > input[type="radio"]:focus-visible ~ .wtb-tablist .wtb-tab{
  /* leave default; handled per-tab below */
}
.wtb-panel{ display: none; }
#wtb-region-sf:checked ~ .wtb-tablist label[for="wtb-region-sf"],
#wtb-region-eb:checked ~ .wtb-tablist label[for="wtb-region-eb"],
#wtb-region-sb:checked ~ .wtb-tablist label[for="wtb-region-sb"]{
  color: var(--ink);
  border-bottom-color: var(--w-saffron, #C8772C);
}
#wtb-region-sf:checked ~ .wtb-tablist label[for="wtb-region-sf"] .wtb-tab-count,
#wtb-region-eb:checked ~ .wtb-tablist label[for="wtb-region-eb"] .wtb-tab-count,
#wtb-region-sb:checked ~ .wtb-tablist label[for="wtb-region-sb"] .wtb-tab-count{
  background: var(--w-saffron, #C8772C);
  color: #fff;
}
#wtb-region-sf:checked ~ .wtb-panels .wtb-panel[data-region="sf"],
#wtb-region-eb:checked ~ .wtb-panels .wtb-panel[data-region="eb"],
#wtb-region-sb:checked ~ .wtb-panels .wtb-panel[data-region="sb"]{
  display: grid;
}

@media (max-width: 600px){
  .wtb-grid{ grid-template-columns: 1fr 1fr; gap: 6px }
  .wtb-region-head{ flex-direction: column; align-items: flex-start; gap: 4px }
  .wtb-card{ padding: 8px 26px 8px 8px; gap: 10px }
  .wtb-logo{ width: 38px; height: 38px; font-size: .74rem; border-radius: 5px }
  .wtb-name{ font-size: .98rem }
  .wtb-locs{ font-size: .74rem }
  .wtb-tab{ padding: 10px 14px; font-size: .98rem; gap: 8px }
  .wtb-tablist{ gap: 0 }
}

/* ==========================================================
   Product tabs — show one product group at a time
   ========================================================== */
.fp-tabs{
  position: relative;
}
.fp-tabs > input[type="radio"]{
  position: absolute;
  opacity: 0;
  width: 1px; height: 1px;
  pointer-events: none;
  clip: rect(0,0,0,0);
}
.fp-tablist{
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(34,34,34,.18);
  margin-bottom: clamp(28px, 4vw, 48px);
}
.fp-tab{
  display: inline-flex;
  align-items: baseline;
  gap: 12px;
  padding: 14px 22px;
  cursor: pointer;
  font-family: var(--serif);
  font-size: clamp(1.1rem, 1.6vw, 1.35rem);
  color: var(--ink-soft);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color .2s ease, border-color .2s ease;
  user-select: none;
  letter-spacing: -.01em;
}
.fp-tab:hover{ color: var(--ink); }
.fp-tab-kicker{
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-soft);
  opacity: .7;
}
.fp-panel{ display: none; }
.fp-panel > .fp-group{ margin-top: 0 }

#fp-tab-kits:checked  ~ .fp-tablist label[for="fp-tab-kits"],
#fp-tab-grab:checked  ~ .fp-tablist label[for="fp-tab-grab"],
#fp-tab-cond:checked  ~ .fp-tablist label[for="fp-tab-cond"]{
  color: var(--ink);
  border-bottom-color: var(--w-saffron, #C8772C);
}
#fp-tab-kits:checked ~ .fp-tablist label[for="fp-tab-kits"] .fp-tab-kicker,
#fp-tab-grab:checked ~ .fp-tablist label[for="fp-tab-grab"] .fp-tab-kicker,
#fp-tab-cond:checked ~ .fp-tablist label[for="fp-tab-cond"] .fp-tab-kicker{
  color: var(--w-saffron, #C8772C);
  opacity: 1;
}
#fp-tab-kits:checked ~ .fp-panels .fp-panel[data-fp="kits"],
#fp-tab-grab:checked ~ .fp-panels .fp-panel[data-fp="grab"],
#fp-tab-cond:checked ~ .fp-panels .fp-panel[data-fp="cond"]{
  display: block;
}
@media (max-width: 600px){
  .fp-tab{ padding: 12px 14px; font-size: 1rem; gap: 8px }
  .fp-tab-kicker{ display: none }
}

/* ==========================================================
   Parking mini-map — branded SVG showing route from P to ★
   ========================================================== */
.parking-map{
  margin-top: 14px;
  padding: 14px;
  background: var(--bone, #f3ede1);
  border: 1px solid rgba(34,34,34,.08);
  border-radius: 6px;
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: 16px;
  align-items: stretch;
}
.parking-map svg{
  display: block;
  width: 100%;
  height: auto;
  background: var(--cream, #fff);
  border-radius: 4px;
}
.parking-map .pm-legend{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  font-size: .82rem;
  color: var(--ink-soft);
  line-height: 1.4;
}
.parking-map .pm-row{
  display: flex;
  align-items: center;
  gap: 10px;
}
.parking-map .pm-swatch{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  flex: 0 0 22px;
  font-size: .75rem;
  font-weight: 600;
  color: #fff;
}
.parking-map .pm-swatch.star{ background: var(--w-saffron, #C8772C); font-size: .9rem }
.parking-map .pm-swatch.p{ background: var(--w-jade, #2C7A6B) }
.parking-map .pm-swatch.route{
  background: transparent;
  border: 0;
  border-top: 2px dashed var(--w-saffron, #C8772C);
  height: 0; width: 22px; border-radius: 0;
}
.parking-map .pm-label{ color: var(--ink); font-weight: 500 }
@media (max-width: 600px){
  .parking-map{
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

/* ==========================================================
   Editorial polish layer — added for homepage refresh
   Additive only; scoped to body[data-page="home"] where
   changes shouldn't leak to other pages.
   ========================================================== */

/* ---------- Ornament (rule · diamond · rule) ---------- */
.ornament{
  display: flex; align-items: center; justify-content: center;
  gap: 18px;
  color: var(--ink-soft);
  margin: clamp(10px, 2vw, 18px) auto;
  max-width: 260px;
}
.ornament::before,
.ornament::after{
  content:""; height: 1px; background: currentColor; opacity: .35;
  flex: 1;
}
.ornament .mark{
  display:inline-block; width: 7px; height: 7px;
  transform: rotate(45deg);
  background: var(--bfg-gold);
  opacity: .9;
}
.ornament.on-dark{ color: rgba(244,239,231,.6) }
.ornament.on-dark .mark{ background: var(--bfg-gold); opacity: 1 }

/* ---------- Editorial marquee ---------- */
.marquee{
  overflow: hidden;
  border-block: 1px solid var(--line);
  padding: 18px 0;
  background: var(--cream);
}
.marquee-track{
  display: inline-flex; align-items: center; gap: 42px;
  white-space: nowrap;
  padding-left: 42px;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.15rem, 1.5vw, 1.45rem);
  color: var(--ink-soft);
  animation: marquee 42s linear infinite;
  will-change: transform;
}
.marquee-track .dot{
  color: var(--bfg-gold);
  font-style: normal;
  font-size: .7em;
  opacity: .85;
}
.marquee:hover .marquee-track{ animation-play-state: paused }
@keyframes marquee{
  from{ transform: translateX(0) }
  to  { transform: translateX(-50%) }
}
@media (prefers-reduced-motion: reduce){
  .marquee-track{ animation: none }
}

/* ---------- Hero: decorative watermark ---------- */
.hero .hero-watermark{
  position: absolute;
  left: clamp(-8px, -1vw, 0);
  bottom: clamp(-30px, -3vw, -10px);
  z-index: 1;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(7rem, 20vw, 20rem);
  line-height: .82;
  color: rgba(255,255,255,.055);
  letter-spacing: -.035em;
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
.hero .hero-watermark em{
  font-style: italic;
  color: rgba(216,156,36,.12);
  margin-left: .05em;
}

/* Hero eyebrow with a leading hairline */
.hero .hero-eyebrow{
  display: inline-flex; align-items: center; gap: 14px;
  color: #fff;
  opacity: .85;
  margin-bottom: 22px;
}
.hero .hero-eyebrow::before{
  content:""; display:block; width: 30px; height: 1px;
  background: rgba(255,255,255,.65);
}

/* Home-only: gold italic accent on the word "Burmese-rooted" */
body[data-page="home"] .hero h1 em{
  color: var(--bfg-gold);
  font-style: italic;
}

/* Home-only: drop cap on the first story paragraph */
body[data-page="home"] .intro .right > p:first-of-type::first-letter{
  font-family: var(--serif);
  font-weight: 400;
  font-style: italic;
  float: left;
  font-size: 4.2rem;
  line-height: .86;
  padding: 8px 14px 0 0;
  color: var(--bfg-red);
}

/* ---------- Brand index refinements ---------- */
.bi-num{
  font-feature-settings: "tnum"; font-variant-numeric: tabular-nums;
  font-style: italic;
  color: var(--accent, var(--ink-soft));
  opacity: .55;
  transition: opacity .3s var(--ease);
}
.bi-row:hover .bi-num{ opacity: 1 }

.bi-meta{ display: inline-flex; align-items: center }
.bi-meta::before{
  content:""; display:inline-block; width:6px; height:6px;
  background: var(--accent, var(--ink-soft)); border-radius: 999px;
  margin-right: 10px;
  opacity: .85;
}

/* Sibling dim on hover: the row you point at pops, the rest fade back */
.bi-list:hover .bi-row{
  opacity: .45;
  transition: opacity .3s var(--ease), color .35s var(--ease), padding .35s var(--ease);
}
.bi-list:hover .bi-row:hover{ opacity: 1 }

/* ---------- Awards & Media (home) — editorial medallion cards ---------- */
body[data-page="home"] .awards .intro .right p{
  max-width: 56ch;
  font-size: .98rem;
  line-height: 1.65;
  color: var(--ink-soft);
}

body[data-page="home"] .awards .award-grid{
  gap: clamp(16px, 2.2vw, 24px);
  margin-top: clamp(18px, 3vw, 32px);
  align-items: stretch;
}

body[data-page="home"] .awards .award-grid .award{
  position: relative;
  padding: clamp(38px, 3.4vw, 48px) clamp(22px, 2.2vw, 30px) clamp(26px, 2.4vw, 32px);
  background: #fdfaf3;
  border: 1px solid rgba(20,18,16,.07);
  border-radius: 4px;
  gap: 14px;
  text-align: center;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 220px;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s var(--ease), background .3s var(--ease);
}
body[data-page="home"] .awards .award-grid .award::before{
  content: "★";
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  font-size: .9rem;
  color: var(--bfg-gold, #d89c24);
  line-height: 1;
}
body[data-page="home"] .awards .award-grid .award::after{
  content: "";
  position: absolute;
  top: 38px;
  left: 50%;
  transform: translateX(-50%);
  width: 28px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(216,156,36,.55), transparent);
}
body[data-page="home"] .awards .award-grid .award:hover{
  transform: translateY(-3px);
  box-shadow: 0 24px 44px -28px rgba(0,0,0,.22);
  border-color: rgba(216,156,36,.4);
  background: #fff;
}
body[data-page="home"] .awards .award figcaption{
  display: grid;
  gap: 10px;
  max-width: 28ch;
}
body[data-page="home"] .awards .award .ac-eyebrow{
  font-family: var(--sans);
  font-size: .58rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-soft);
  font-weight: 600;
}
body[data-page="home"] .awards .award .ac-title{
  font-family: var(--serif);
  font-size: 1.1rem;
  line-height: 1.32;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -.005em;
}
body[data-page="home"] .awards .award .ac-sub{
  font-family: var(--serif);
  font-size: .82rem;
  font-style: italic;
  color: var(--ink-soft);
  letter-spacing: .01em;
}

/* ---------- Tighter vertical rhythm just on home ---------- */
body[data-page="home"] .section{ padding: clamp(48px, 7vw, 96px) 0 }
body[data-page="home"] .section.tight{ padding: clamp(36px, 5vw, 64px) 0 }
body[data-page="home"] .section .intro{ margin-bottom: clamp(20px, 3vw, 36px) !important }
body[data-page="home"] .section h2{ font-size: clamp(1.8rem, 3.6vw, 2.8rem) }

/* ---------- Button shimmer on hover ---------- */
.btn{ position: relative; overflow: hidden; isolation: isolate }
.btn::after{
  content:""; position: absolute; inset: 0;
  background: linear-gradient(100deg,
    transparent 30%,
    rgba(255,255,255,.28) 50%,
    transparent 70%);
  transform: translateX(-130%);
  transition: transform .9s var(--ease);
  z-index: -1;
  pointer-events: none;
}
.btn:hover::after{ transform: translateX(130%) }

/* ---------- Warm wash on the "Order Now" dark section ---------- */
body[data-page="home"] .home-cta{
  background:
    radial-gradient(900px 420px at 15% 10%, rgba(204,72,36,.22), transparent 60%),
    radial-gradient(760px 420px at 85% 90%, rgba(216,156,36,.16), transparent 65%),
    var(--ink);
}

/* ---------- Footer: small gold ornament above locations ---------- */
body[data-page="home"] footer .flocs-wrap{ position: relative }
body[data-page="home"] footer .flocs-wrap::before{
  content:""; display:block;
  width: 36px; height: 2px;
  background: var(--bfg-gold);
  margin: 0 0 24px;
  opacity: .85;
}

/* ---------- Small refinements ---------- */
.hero .scroll-cue{ font-family: var(--sans); font-weight: 500 }
.section h2 + .ornament{ margin-top: 8px }

/* ==========================================================
   PRESS MARQUEE — auto-scrolling article tiles, rolls right
   ========================================================== */
.press-marquee{
  position: relative;
  overflow: hidden;
  padding: 8px 0 4px;
  /* soft fade at both edges */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
}

.press-tracks{
  display: inline-flex;
  align-items: stretch;
  /* the clone is appended at runtime; animate the wrapper */
  animation: press-roll 55s linear infinite;
  will-change: transform;
}
.press-marquee:hover .press-tracks,
.press-marquee:focus-within .press-tracks{
  animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce){
  .press-tracks{ animation: none }
}

/* "Rolling to the right": content starts shifted left, moves to
   natural position, then loops. Because the track is duplicated,
   positions -50% and 0 look identical → seamless loop. */
@keyframes press-roll{
  from { transform: translate3d(-50%, 0, 0) }
  to   { transform: translate3d(0, 0, 0) }
}

.press-track{
  display: flex;
  align-items: stretch;
  gap: clamp(18px, 2.4vw, 28px);
  list-style: none;
  margin: 0;
  padding: 0 clamp(12px, 1.6vw, 14px);
  flex: 0 0 auto;
}
.press-track > li{ display: flex; list-style: none }

/* ---------- Single press tile ---------- */
.press-tile{
  display: flex;
  flex-direction: column;
  width: clamp(280px, 26vw, 360px);
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 3px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  transition:
    transform .45s var(--ease),
    box-shadow .45s var(--ease),
    border-color .3s var(--ease),
    background .3s var(--ease);
}
.press-tile:hover,
.press-tile:focus-visible{
  transform: translateY(-4px);
  box-shadow: 0 30px 50px -28px rgba(0,0,0,.22);
  border-color: transparent;
  background: #fff;
  outline: none;
}

.pt-media{
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #1a1715;
}
.pt-media img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease), filter .5s var(--ease);
}
.press-tile:hover .pt-media img,
.press-tile:focus-visible .pt-media img{
  transform: scale(1.045);
  filter: saturate(1.08);
}
.pt-media::after{
  content:""; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,0) 55%);
  pointer-events: none;
}

.pt-badge{
  position: absolute;
  left: 12px; top: 12px;
  z-index: 2;
  font-family: var(--sans);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink);
  background: rgba(250,246,238,.94);
  backdrop-filter: blur(6px);
  padding: 6px 10px;
  border-radius: 2px;
}

.pt-body{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 20px 20px;
  flex: 1;
}
.pt-eyebrow{
  font-family: var(--sans);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--bfg-red);
}
.pt-title{
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.18rem;
  line-height: 1.25;
  letter-spacing: -.005em;
  margin: 0;
  color: var(--ink);
  /* clamp to 3 lines so tile heights stay tidy */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pt-link{
  margin-top: auto;
  font-family: var(--sans);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--bfg-red);
  transition: letter-spacing .3s var(--ease);
}
.press-tile:hover .pt-link,
.press-tile:focus-visible .pt-link{ letter-spacing: .28em }

/* Smaller tiles on narrow screens */
@media (max-width: 600px){
  .press-tile{ width: 240px }
  .pt-title{ font-size: 1.02rem }
  .pt-body{ padding: 14px 16px 16px }
}

/* ============================================================
   Catering / Private Events — venue sections
   ============================================================ */
.events-intro{
  text-align: center;
  max-width: 780px;
  margin: 0 auto 48px;
}
.events-intro .ornament{ margin: 16px auto 20px }
.events-jump{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 18px;
  margin: 28px auto 0;
  max-width: 820px;
}
.events-jump a{
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink);
  opacity: .7;
  padding: 8px 14px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 999px;
  transition: opacity .2s, border-color .2s, background .2s;
}
.events-jump a:hover{
  opacity: 1;
  border-color: var(--bfg-red);
  background: rgba(204,72,36,.06);
}

.venue{
  scroll-margin-top: 90px;
  padding: 52px 0;
  border-top: 1px solid rgba(0,0,0,.08);
}
.venue:first-of-type{ border-top: 0 }
.venue-head{
  max-width: 780px;
  margin: 0 auto 24px;
  text-align: center;
}
.venue-head .eyebrow{ margin-bottom: 10px }
.venue-head h3{
  font-family: var(--serif);
  font-size: clamp(1.9rem, 3.4vw, 2.6rem);
  line-height: 1.12;
  margin: 0 0 14px;
  letter-spacing: -.01em;
}
.venue-head p{
  font-size: 1rem;
  line-height: 1.6;
  opacity: .78;
  margin: 0;
}

.rooms-grid{
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  max-width: 1180px;
  margin: 0 auto;
}
/* When a venue has only one room card, don't let it stretch full-width — cap it. */
.rooms-grid:has(> .room-card:only-child){
  grid-template-columns: minmax(0, 480px);
  justify-content: center;
}
.room-card{
  background: var(--bone);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.room-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 48px -28px rgba(0,0,0,.28);
}
.room-card .rc-media{
  aspect-ratio: 16/10;
  overflow: hidden;
  background: #eee;
}
.room-card .rc-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);
}
.room-card:hover .rc-media img{ transform: scale(1.04) }
.room-card .rc-body{
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.room-card h4{
  font-family: var(--serif);
  font-size: 1.2rem;
  margin: 0;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.room-card p{
  font-size: .9rem;
  line-height: 1.5;
  opacity: .78;
  margin: 0;
}
.room-meta{
  font-family: var(--sans);
  font-size: .78rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .72;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed rgba(0,0,0,.14);
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
}
.room-meta span strong{
  font-weight: 700;
  opacity: 1;
  color: var(--ink);
}

/* Ghost buttons inside cream-colored cards need visible ink color (default ghost = #fff is invisible on light bg) */
.room-card .btn.ghost{
  color: var(--ink);
}
.room-card .btn.ghost:hover{
  background: var(--ink);
  color: #fff;
}
.room-card .btn.ghost:hover span{
  color: #fff;
}

/* Card btn-row: tighter padding + smaller text so two buttons fit side by side, even on narrow cards */
.room-card .btn-row{
  margin-top: 6px;
  gap: 8px;
}
.room-card .btn-row .btn{
  flex: 1 1 0;
  padding: 11px 14px;
  font-size: .68rem;
  letter-spacing: .14em;
  justify-content: center;
}

.events-cta{
  text-align: center;
  padding: 72px 20px 88px;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.02));
}
.events-cta h3{
  font-family: var(--serif);
  font-size: clamp(1.6rem, 2.6vw, 2rem);
  margin: 0 0 10px;
}
.events-cta p{
  font-size: 1rem;
  opacity: .78;
  margin: 0 0 24px;
}
.events-cta a.btn{ display: inline-flex }

/* ============================================================
   Partner With Us
   ============================================================ */
.partner-checklist{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
  counter-reset: partner-step;
}
.partner-checklist li{
  position: relative;
  font-family: var(--serif);
  font-size: 1.12rem;
  line-height: 1.45;
  padding: 10px 0 12px 38px;
  border-bottom: 1px dashed rgba(0,0,0,.12);
  counter-increment: partner-step;
}
.partner-checklist li:last-child{ border-bottom: 0 }
.partner-checklist li::before{
  content: counter(partner-step, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 14px;
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--bfg-red);
}

.partner-cta{
  background: var(--bone);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 8px;
  padding: clamp(28px, 5vw, 56px);
  position: relative;
  overflow: hidden;
}
.partner-cta::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(720px 360px at 0% 0%, rgba(204,72,36,.08), transparent 60%),
    radial-gradient(620px 320px at 100% 100%, rgba(216,156,36,.10), transparent 65%);
  pointer-events: none;
}
.partner-cta .pc-inner{ position: relative; max-width: 720px }
.partner-cta h2{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  margin: 8px 0 14px;
  letter-spacing: -.01em;
}
.partner-cta p{
  font-size: 1rem;
  line-height: 1.6;
  opacity: .82;
  margin: 0 0 6px;
}
.pc-fineprint{
  margin-top: 22px !important;
  font-family: var(--sans);
  font-size: .82rem;
  opacity: .68 !important;
  letter-spacing: .02em;
}
.pc-fineprint a{ color: var(--bfg-red); text-decoration: underline }

/* ---------- Brand-hero cross-fade gallery (2 slides) ---------- */
.brand-hero.hero-gallery .media{ overflow: hidden }
.brand-hero.hero-gallery .media img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  animation: hero-rotate 14s infinite ease-in-out;
  animation-fill-mode: both;
}
/* Fallback: image 1 is always visible even if animation fails */
.brand-hero.hero-gallery .media img:nth-child(1){
  opacity: 1;
  animation-delay: 0s;
}
.brand-hero.hero-gallery .media img:nth-child(2){ animation-delay: -7s }

@keyframes hero-rotate{
  0%      { opacity: 1 }
  42%     { opacity: 1 }
  50%     { opacity: 0 }
  92%     { opacity: 0 }
  100%    { opacity: 1 }
}

@media (prefers-reduced-motion: reduce){
  .brand-hero.hero-gallery .media img{ animation: none; opacity: 0 }
  .brand-hero.hero-gallery .media img:nth-child(1){ opacity: 1 }
}

/* ================== CHATBOT WIDGET ================== */
.bi-chat-launcher{
  position: fixed; right: 22px; bottom: 22px; z-index: 90;
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--bfg-red, #b3322a);
  color: #fff; border: none; cursor: pointer;
  box-shadow: 0 12px 32px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
  display: grid; place-items: center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.bi-chat-launcher:hover{ transform: translateY(-2px); box-shadow: 0 16px 38px rgba(0,0,0,.34), 0 6px 14px rgba(0,0,0,.22) }
.bi-chat-launcher:focus-visible{ outline: 3px solid #fff; outline-offset: 2px }
.bi-chat-launcher svg{ width: 26px; height: 26px; stroke: #fff; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round }
.bi-chat-launcher .icon-close{ display: none }
.bi-chat-launcher.is-open .icon-chat{ display: none }
.bi-chat-launcher.is-open .icon-close{ display: block }

.bi-chat-panel{
  position: fixed; right: 22px; bottom: 96px; z-index: 91;
  width: min(360px, calc(100vw - 32px));
  max-height: min(560px, calc(100vh - 130px));
  background: #fff; color: var(--ink, #1a1a1a);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.28), 0 8px 18px rgba(0,0,0,.14);
  display: none; flex-direction: column; overflow: hidden;
  font-family: var(--sans, system-ui, -apple-system, sans-serif);
  transform: translateY(12px); opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
  border: 1px solid rgba(0,0,0,.06);
}
.bi-chat-panel.is-open{ display: flex; transform: translateY(0); opacity: 1 }

.bi-chat-head{
  padding: 18px 20px 16px;
  background: linear-gradient(135deg, var(--bfg-red, #b3322a), #8c241d);
  color: #fff;
}
.bi-chat-head .bi-eyebrow{
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  opacity: .82; margin-bottom: 4px;
}
.bi-chat-head h3{
  font-family: var(--serif, Georgia, serif);
  font-weight: 400; font-size: 1.35rem; line-height: 1.2; margin: 0;
}
.bi-chat-head p{
  margin: 6px 0 0; font-size: .88rem; opacity: .9; line-height: 1.4;
}

.bi-chat-body{
  flex: 1 1 auto; overflow-y: auto; padding: 16px 16px 4px;
  background: #faf8f4;
}

.bi-msg{
  max-width: 86%; padding: 10px 14px; border-radius: 14px;
  font-size: .92rem; line-height: 1.45; margin-bottom: 10px;
  word-wrap: break-word;
}
.bi-msg.bot{
  background: #fff; color: var(--ink, #1a1a1a);
  border: 1px solid rgba(0,0,0,.06);
  border-top-left-radius: 4px;
}
.bi-msg.user{
  background: var(--bfg-red, #b3322a); color: #fff;
  margin-left: auto; border-top-right-radius: 4px;
}
.bi-msg a{ color: inherit; text-decoration: underline; text-underline-offset: 2px }
.bi-msg.bot a{ color: var(--bfg-red, #b3322a) }
.bi-msg ul{ margin: 6px 0 0; padding-left: 18px }
.bi-msg ul li{ margin: 3px 0 }

.bi-chips{
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 4px 16px 14px; background: #faf8f4;
  border-top: 1px solid rgba(0,0,0,.05);
}
.bi-chip{
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  color: var(--ink, #1a1a1a);
  padding: 8px 14px; border-radius: 999px;
  font-size: .85rem; font-family: inherit;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.bi-chip:hover{
  background: var(--bfg-red, #b3322a); color: #fff;
  border-color: var(--bfg-red, #b3322a);
}
.bi-chip:focus-visible{
  outline: 2px solid var(--bfg-red, #b3322a); outline-offset: 2px;
}

/* Free-text input form (sits below the chips) */
.bi-chat-form{
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(0,0,0,.08);
  background: var(--cream, #fdfaf3);
}
.bi-chat-form input{
  flex: 1;
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 999px;
  padding: 10px 14px;
  font-family: var(--sans, system-ui, sans-serif);
  font-size: .92rem;
  background: #fff;
  color: var(--ink, #222);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.bi-chat-form input:focus{
  outline: none;
  border-color: var(--bfg-red, #b3322a);
  box-shadow: 0 0 0 3px rgba(179,50,42,.12);
}
.bi-chat-send{
  flex: 0 0 auto;
  width: 38px; height: 38px;
  border: 0;
  border-radius: 50%;
  background: var(--bfg-red, #b3322a);
  color: #fff;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: filter .15s ease, transform .15s ease;
}
.bi-chat-send:hover{ filter: brightness(1.08); transform: translateY(-1px); }
.bi-chat-send:active{ transform: translateY(0); }
.bi-chat-send svg{ width: 18px; height: 18px; }
.bi-msg.thinking{ opacity: .65; font-style: italic; }
.bi-loc-list{ margin: 8px 0 0; padding-left: 18px; }
.bi-loc-list li{ margin: 4px 0; }

.bi-chat-foot{
  padding: 10px 14px 14px;
  border-top: 1px solid rgba(0,0,0,.06);
  background: #fff;
  font-size: .72rem; color: rgba(0,0,0,.55);
  text-align: center;
}
.bi-chat-foot a{ color: var(--bfg-red, #b3322a); text-decoration: none }
.bi-chat-foot a:hover{ text-decoration: underline }

@media (max-width: 480px){
  .bi-chat-launcher{ right: 14px; bottom: 14px; width: 56px; height: 56px }
  .bi-chat-panel{ right: 8px; left: 8px; bottom: 80px; width: auto; max-height: calc(100vh - 100px) }
}

@media (prefers-reduced-motion: reduce){
  .bi-chat-launcher, .bi-chat-panel{ transition: none }
}

/* ====== CAREERS PAGE ====== */
.mv-card{
  border-top: 1px solid rgba(34,34,34,.14);
  padding: clamp(20px, 2.4vw, 28px) 0 clamp(22px, 2.6vw, 32px);
}
.mv-card:last-of-type{ border-bottom: 1px solid rgba(34,34,34,.14) }
.mv-card .mv-label{
  font-family: var(--serif, "Cormorant Garamond", Georgia, serif);
  font-size: .82rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--bfg-red, #b3322a);
  margin-bottom: 10px;
}
.mv-card p{
  margin: 0;
  font-size: clamp(1.2rem, 1.7vw, 1.55rem);
  line-height: 1.45;
  color: var(--ink);
}
.mv-card p strong{ font-style: italic; font-weight: 600 }

.pillars{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 3vw, 36px);
}
@media (max-width: 820px){ .pillars{ grid-template-columns: 1fr } }
.pillar{
  background: #fff;
  border: 1px solid rgba(34,34,34,.10);
  border-radius: 6px;
  padding: clamp(26px, 3vw, 38px) clamp(24px, 2.6vw, 34px);
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  transition: transform .35s var(--ease, ease), box-shadow .35s var(--ease, ease), border-color .35s var(--ease, ease);
}
.pillar:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  border-color: rgba(179,50,42,.35);
}
.pillar .p-eyebrow{
  font-family: var(--serif, "Cormorant Garamond", Georgia, serif);
  font-style: italic;
  font-weight: 600;
  font-size: clamp(1.4rem, 2vw, 1.85rem);
  color: var(--bfg-red, #b3322a);
  margin-bottom: 10px;
  letter-spacing: .01em;
}
.pillar p{
  margin: 0;
  font-size: clamp(1rem, 1.2vw, 1.08rem);
  line-height: 1.55;
  color: var(--ink-soft, #4a4a4a);
}

.values{ text-align: center }
.values .v-eyebrow{
  font-family: var(--sans, system-ui, sans-serif);
  font-size: .78rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: rgba(255,255,255,.62);
  margin-bottom: 18px;
}
.values .v-list{
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: clamp(12px, 1.6vw, 22px);
  font-family: var(--serif, "Cormorant Garamond", Georgia, serif);
  font-size: clamp(1.4rem, 2.6vw, 2.1rem);
  letter-spacing: .04em;
  color: var(--bone, #f5efe6);
}
.values .v-list li{ text-transform: uppercase }
.values .v-list .v-sep{
  color: var(--bfg-red, #b3322a);
  opacity: .85;
  font-size: 1em;
}
@media (max-width: 640px){
  .values .v-list .v-sep{ display: none }
  .values .v-list{ gap: 8px 18px }
}

/* ==========================================================
   THEME: WARM-BRIGHT BURMESE   (scoped to body.theme-warm)
   ========================================================== */
body.theme-warm{
  --w-paper:        #FBF6EC;
  --w-paper-deep:   #F2E8D4;
  --w-saffron:      #E8A33D;
  --w-saffron-bright:#F4B340;
  --w-marigold:     #F08C2B;
  --w-jade:         #4F7F5F;
  --w-teak:         #6B3F1E;
  --w-teak-deep:    #3D2410;
  --w-rouge:        #B0382E;
  --w-gold:         #C39A3F;
  --w-ink-warm:     #2A2419;
  background: var(--w-paper);
  color: var(--w-ink-warm);
}
body.theme-warm .section.bone{ background: var(--w-paper-deep) }

/* --- MINGALABA HERO ENHANCEMENT --- */
body.theme-warm .hero .hero-eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: rgba(232,163,61,.18);
  border: 1px solid rgba(232,163,61,.55);
  padding: 8px 16px;
  border-radius: 999px;
  color: var(--w-saffron-bright);
  font-weight: 500;
  letter-spacing: .14em;
}
body.theme-warm .hero .hero-eyebrow .mingalaba{
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  font-weight: 600;
  font-size: 1.15rem;
  letter-spacing: .02em;
  text-transform: none;
  color: #FFE8B8;
}
body.theme-warm .hero h1 em{
  color: var(--w-saffron-bright);
  font-style: italic;
}

/* --- BAGAN SILHOUETTE DIVIDER BAND --- */
.bagan-band{
  position: relative;
  height: clamp(64px, 8vw, 96px);
  width: 100%;
  background: linear-gradient(180deg, transparent 0%, transparent 50%, var(--w-paper-deep, #F2E8D4) 50%, var(--w-paper-deep, #F2E8D4) 100%);
  overflow: hidden;
}
.bagan-band svg{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.bagan-band--dark{
  background: linear-gradient(180deg, var(--w-paper-deep, #F2E8D4) 0%, var(--w-paper-deep, #F2E8D4) 50%, var(--w-teak-deep, #3D2410) 50%, var(--w-teak-deep, #3D2410) 100%);
}

/* --- LOTUS DIVIDER --- */
.lotus-divider{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: clamp(36px, 5vw, 64px) 24px;
  color: var(--w-saffron, #E8A33D);
}
.lotus-divider .rule{
  flex: 0 1 240px;
  height: 1px;
  background: linear-gradient(90deg, transparent, currentColor, transparent);
  opacity: .55;
}
.lotus-divider svg{ width: 56px; height: 56px; flex-shrink: 0 }

/* --- TEXTILE PATTERN STRIP --- */
.textile-strip{
  height: 28px;
  width: 100%;
  background-color: var(--w-paper-deep, #F2E8D4);
  background-image:
    repeating-linear-gradient(45deg,
      var(--w-saffron, #E8A33D) 0 2px,
      transparent 2px 14px),
    repeating-linear-gradient(-45deg,
      var(--w-rouge, #B0382E) 0 2px,
      transparent 2px 14px),
    repeating-linear-gradient(90deg,
      var(--w-jade, #4F7F5F) 0 1px,
      transparent 1px 28px);
  background-size: 28px 28px, 28px 28px, 28px 100%;
  border-top: 1px solid rgba(107,63,30,.15);
  border-bottom: 1px solid rgba(107,63,30,.15);
}

/* --- AWARDS TRUST STRIP (compact, top-of-page) --- */
.trust-strip{
  background: var(--w-paper-deep, #F2E8D4);
  border-top: 1px solid rgba(107,63,30,.10);
  border-bottom: 1px solid rgba(107,63,30,.10);
  padding: clamp(18px, 2.4vw, 28px) 0;
}
.trust-strip .ts-inner{
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 48px);
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 40px);
  flex-wrap: wrap;
  justify-content: center;
}
.trust-strip .ts-eyebrow{
  font-size: .72rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--w-teak, #6B3F1E);
  font-weight: 500;
  white-space: nowrap;
  position: relative;
  padding-right: clamp(20px, 3vw, 40px);
}
.trust-strip .ts-eyebrow::after{
  content: "";
  position: absolute;
  right: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 24px;
  background: rgba(107,63,30,.25);
}
@media (max-width: 700px){
  .trust-strip .ts-eyebrow::after{ display: none }
}
.trust-strip .ts-list{
  display: flex; flex-wrap: wrap; gap: clamp(14px, 2vw, 28px);
  align-items: center;
  list-style: none; margin: 0; padding: 0;
}
.trust-strip .ts-item{
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(.95rem, 1.2vw, 1.1rem);
  color: var(--w-ink-warm, #2A2419);
  font-weight: 500;
}
.trust-strip .ts-item .ts-star{
  color: var(--w-saffron, #E8A33D);
  margin-right: 6px;
}

/* --- QUICK-FIND NEAREST RESTAURANT — compact rows --- */
.quickfind{
  background: var(--w-paper, #FBF6EC);
  padding: clamp(40px, 6vw, 70px) 0 clamp(36px, 5vw, 56px);
}
.quickfind .qf-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto clamp(22px, 3vw, 36px);
  padding: 0 24px;
}
.quickfind .qf-eyebrow{
  font-size: .72rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--w-saffron, #E8A33D);
  margin-bottom: 10px;
  font-weight: 600;
}
.quickfind h2{
  font-size: clamp(1.7rem, 3.6vw, 2.6rem);
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 500;
  line-height: 1.05;
}
.quickfind h2 em{ color: var(--w-rouge, #B0382E); font-style: italic }
.quickfind .qf-sub{
  margin-top: 10px;
  color: var(--w-teak, #6B3F1E);
  font-size: .95rem;
  line-height: 1.45;
}
.quickfind .qf-grid{
  max-width: 1180px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(14px, 2vw, 22px);
}
@media (max-width: 760px){ .quickfind .qf-grid{ grid-template-columns: 1fr } }

/* Card — image on left, info on right; whole card is clickable via the
   absolutely-positioned .qf-stretched link, while inner action chips sit
   above it via z-index so they remain individually clickable. */
.qf-card{
  position: relative;
  display: grid;
  grid-template-columns: clamp(120px, 20%, 180px) 1fr;
  background: #fff;
  border: 1px solid rgba(107,63,30,.10);
  border-radius: 8px;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.qf-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px -22px rgba(107,63,30,.28);
  border-color: var(--qf-accent, var(--w-saffron, #E8A33D));
}
/* Brand-color accent stripe on the left */
.qf-card::before{
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--qf-accent, var(--w-saffron, #E8A33D));
  z-index: 2;
}

/* Stretched link — covers the card, navigates to the location page. */
.qf-card .qf-stretched{
  position: absolute; inset: 0;
  z-index: 1;
  background: transparent;
}

/* Thumbnail panel */
.qf-card .qf-thumb{
  position: relative;
  overflow: hidden;
  background: rgba(107,63,30,.05);
}
.qf-card .qf-thumb img{
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s var(--ease, ease), filter .35s ease;
}
.qf-card:hover .qf-thumb img{ transform: scale(1.06); filter: brightness(.96); }

/* "Coming soon" badge for Alisios */
.qf-card .qf-coming{
  position: absolute;
  top: 10px; left: 10px;
  background: var(--qf-accent, #486c78);
  color: #fff;
  font-family: var(--sans, system-ui);
  font-size: .62rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 3px;
  z-index: 3;
}

/* Info panel */
.qf-card .qf-info{
  padding: clamp(14px, 2vw, 20px) clamp(14px, 2vw, 22px);
  display: flex; flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.qf-card .qf-brand{
  font-family: var(--sans, system-ui);
  font-size: .66rem; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--qf-accent, var(--w-rouge, #B0382E));
  margin: 0;
}
.qf-card .qf-name{
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.3rem, 2.2vw, 1.55rem);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.005em;
  margin: 2px 0 0;
  color: var(--ink, #141210);
}
.qf-card .qf-name .qf-where{
  display: block;
  font-size: .68em;
  font-style: italic;
  font-weight: 400;
  color: var(--ink-soft, #6B3F1E);
  opacity: .75;
  margin-top: 2px;
  letter-spacing: 0;
}
.qf-card .qf-addr{
  color: var(--ink-soft, #6B3F1E);
  font-size: .82rem;
  line-height: 1.4;
  opacity: .82;
  margin: 4px 0 0;
}

/* Action row — clickable chips above the stretched link */
.qf-card .qf-actions{
  margin-top: auto;
  padding-top: clamp(10px, 1.4vw, 14px);
  display: flex; flex-wrap: wrap;
  gap: 6px;
  position: relative;
  z-index: 2;
}
.qf-card .qf-act{
  display: inline-flex; align-items: center;
  font-family: var(--sans, system-ui);
  font-size: .74rem;
  letter-spacing: .04em;
  font-weight: 500;
  text-decoration: none;
  border-radius: 999px;
  padding: 6px 12px;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.qf-card .qf-act:active{ transform: translateY(1px); }

/* Order — primary chip in the card's brand color */
.qf-card .qf-act-order{
  background: var(--qf-accent, var(--w-rouge, #B0382E));
  color: #fff;
  border: 1px solid var(--qf-accent, var(--w-rouge, #B0382E));
}
.qf-card .qf-act-order:hover{ filter: brightness(1.08); }

/* Reserve — outlined chip in the brand color */
.qf-card .qf-act-reserve{
  background: transparent;
  color: var(--qf-accent, var(--w-rouge, #B0382E));
  border: 1px solid var(--qf-accent, var(--w-rouge, #B0382E));
}
.qf-card .qf-act-reserve:hover{
  background: var(--qf-accent, var(--w-rouge, #B0382E));
  color: #fff;
}

/* Call & Details — minimal text-only chips */
.qf-card .qf-act-call,
.qf-card .qf-act-details{
  background: transparent;
  color: var(--ink-soft, #6B3F1E);
  border: 1px solid transparent;
  padding: 6px 8px;
}
.qf-card .qf-act-call:hover,
.qf-card .qf-act-details:hover{
  color: var(--qf-accent, var(--w-rouge, #B0382E));
}

@media (max-width: 560px){
  .qf-card{
    grid-template-columns: 1fr;
  }
  .qf-card .qf-thumb{ aspect-ratio: 16/9; }
  .qf-card .qf-info{ padding: 16px; }
  .qf-card .qf-actions{ gap: 6px 4px; }
  .qf-card .qf-act{ font-size: .72rem; padding: 6px 10px; }
}

/* --- STICKY ACTION BAR --- */
.sticky-action{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;
  background: var(--w-teak-deep, #3D2410);
  color: #fff;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 3px solid var(--w-saffron, #E8A33D);
  box-shadow: 0 -8px 30px rgba(0,0,0,.15);
  /* hide on desktop where the nav already has Order Now */
  transform: translateY(0);
  transition: transform .35s ease;
}
.sticky-action a{
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 8px;
  color: #fff;
  text-decoration: none;
  font-size: .85rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 600;
  border-right: 1px solid rgba(255,255,255,.10);
}
.sticky-action a:last-child{ border-right: 0 }
.sticky-action a:hover{ background: rgba(232,163,61,.18) }
.sticky-action a.primary{
  background: var(--w-saffron, #E8A33D);
  color: var(--w-teak-deep, #3D2410);
}
.sticky-action a.primary:hover{ background: var(--w-saffron-bright, #F4B340) }
.sticky-action svg{ width: 16px; height: 16px; flex-shrink: 0 }

/* hide on desktop, reserve room for chat widget */
@media (min-width: 901px){
  .sticky-action{ display: none }
}
@media (max-width: 900px){
  /* lift chatbot launcher above sticky action bar */
  body.theme-warm .bi-chat-launcher{ bottom: 80px !important }
  /* extra bottom padding so footer copy isn't hidden behind sticky bar */
  body.theme-warm footer .copy{ padding-bottom: 70px }
}

/* --- SECTION HEADER ACCENTS WHEN WARM --- */
body.theme-warm .marquee{
  background: var(--w-rouge, #B0382E);
  color: #FFE8B8;
  border-block-color: rgba(255,232,184,.18);
}
body.theme-warm .marquee .marquee-track{
  color: #FFE8B8;
}
body.theme-warm .marquee .marquee-track .dot{
  color: var(--w-saffron, #E8A33D);
  opacity: .95;
}
body.theme-warm .home-cta{
  background: var(--w-teak-deep, #3D2410);
}

/* ============================================================
   STRETCHED-LINK PATTERN (article wrapper + invisible cover-link)
   Lets us nest multiple actions (call, share, etc.) inside what
   visually behaves like a single tappable card, without invalid
   nested <a> tags.
   ============================================================ */

/* ---- Footer location cards (fl-card) ---- */
footer .fl-card{ position: relative; }
footer .fl-card .fl-stretched{
  position: absolute;
  inset: 0;
  z-index: 1;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  /* invisible cover; aria-label provides accessible name */
}
footer .fl-card .fl-stretched:focus-visible{
  outline: 2px solid var(--bfg-gold, #C39A3F);
  outline-offset: 2px;
  text-indent: 0;
}
/* Inner phone link sits on top so tap-to-call works */
footer .fl-card a.fl-phone{
  position: relative;
  z-index: 2;
  display: inline-block;
  text-decoration: none;
  color: rgba(244,239,231,.7);
  transition: color .2s var(--ease);
}
footer .fl-card a.fl-phone:hover{ color: var(--bfg-gold, #C39A3F); }

/* ---- Brand-index rows (bi-row) ---- */
.bi-row{ position: relative; }
.bi-body h3 a.bi-stretched{
  color: inherit;
  text-decoration: none;
  position: static;
}
.bi-body h3 a.bi-stretched::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.bi-body h3 a.bi-stretched:focus-visible{
  outline: 2px solid var(--accent, var(--ink));
  outline-offset: 4px;
}
/* num + arrow stay above so the row reads as a single click target,
   but they don't intercept clicks because they have no link of their own */
.bi-num, .bi-arrow{ position: relative; z-index: 0; }

/* ---- Press tiles (press-tile) ---- */
.press-tile{ position: relative; }
.pt-title a.pt-stretched{
  color: inherit;
  text-decoration: none;
  position: static;
}
.pt-title a.pt-stretched::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.pt-title a.pt-stretched:focus-visible{
  outline: 2px solid var(--bfg-red, #B0382E);
  outline-offset: 2px;
}
/* Badge stays clickable region but has no link, so just keeps stacking */
.pt-badge{ z-index: 2; }

/* ============================================================
   OUR-STORY PROCESS STRIP
   4-step horizontal flow: Hand-picked → Preparation → Fermentation → Production
   ============================================================ */
.process-strip{
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 2.4vw, 28px);
  counter-reset: ps;
}
@media (max-width: 980px){
  .process-strip{ grid-template-columns: repeat(2, 1fr) }
}
@media (max-width: 540px){
  .process-strip{ grid-template-columns: 1fr }
}
.process-strip .ps-step{
  position: relative;
  background: #fff;
  border: 1px solid rgba(34,34,34,.10);
  border-radius: 6px;
  padding: clamp(22px, 2.6vw, 30px) clamp(20px, 2.4vw, 28px);
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  transition: transform .35s var(--ease, ease), box-shadow .35s var(--ease, ease), border-color .35s var(--ease, ease);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.process-strip .ps-step:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  border-color: var(--w-saffron, #E8A33D);
}
.process-strip .ps-num{
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(1.8rem, 2.2vw, 2.4rem);
  font-style: italic;
  color: var(--w-rouge, #B0382E);
  line-height: 1;
  letter-spacing: -.01em;
  font-feature-settings: "tnum";
}
.process-strip .ps-step h3{
  font-family: var(--sans, system-ui, sans-serif);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--w-teak, #6B3F1E);
  margin: 0;
}
.process-strip .ps-step p{
  margin: 0;
  font-size: clamp(.96rem, 1.05vw, 1.02rem);
  line-height: 1.55;
  color: var(--ink-soft, #4a4a4a);
}
/* Subtle arrow between steps on desktop */
@media (min-width: 981px){
  .process-strip .ps-step:not(:last-child)::after{
    content: "→";
    position: absolute;
    right: -22px; top: 50%;
    transform: translateY(-50%);
    font-family: var(--serif, Georgia, serif);
    font-size: 1.5rem;
    color: var(--w-saffron, #E8A33D);
    opacity: .7;
    pointer-events: none;
  }
}

/* ============================================================
   OUR-STORY HORIZONTAL TIMELINE RAIL
   1992 → today, scrolled left-to-right.
   ============================================================ */
.tl-rail-section{
  background: var(--w-paper, #FBF6EC);
  /* Let the rail bleed full-width while heading stays in container */
  padding-bottom: clamp(60px, 7vw, 100px);
}
.tl-rail-wrap{
  position: relative;
  /* Continuous horizontal "year line" running through cards */
}
.tl-rail-wrap::before{
  content: "";
  position: absolute;
  left: 0; right: 0;
  /* Aligns with the year stamp baseline inside cards */
  top: calc(180px + 6px);
  height: 2px;
  background: linear-gradient(
    to right,
    transparent 0,
    var(--w-saffron, #E8A33D) 8%,
    var(--w-saffron, #E8A33D) 92%,
    transparent 100%
  );
  opacity: .55;
  pointer-events: none;
  z-index: 0;
}
.tl-rail{
  list-style: none;
  margin: 0;
  padding: 0 clamp(20px, 4vw, 64px) 12px;
  display: flex;
  gap: clamp(18px, 2.4vw, 32px);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-padding-left: clamp(20px, 4vw, 64px);
  scrollbar-width: thin;
  scrollbar-color: var(--w-saffron, #E8A33D) transparent;
  position: relative;
  z-index: 1;
}
.tl-rail::-webkit-scrollbar{ height: 8px }
.tl-rail::-webkit-scrollbar-track{ background: transparent }
.tl-rail::-webkit-scrollbar-thumb{
  background: var(--w-saffron, #E8A33D);
  border-radius: 999px;
  opacity: .4;
}

.tl-card{
  flex: 0 0 clamp(280px, 30vw, 360px);
  scroll-snap-align: start;
  background: #fff;
  border: 1px solid rgba(34,34,34,.10);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  transition: transform .35s var(--ease, ease), box-shadow .35s var(--ease, ease), border-color .35s var(--ease, ease);
  position: relative;
}
.tl-card:hover,
.tl-card:focus-within{
  transform: translateY(-3px);
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
  border-color: var(--w-saffron, #E8A33D);
}
.tl-card .tl-thumb{
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #1a1715;
}
.tl-card .tl-thumb img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease, ease), filter .5s var(--ease, ease);
}
.tl-card:hover .tl-thumb img,
.tl-card:focus-within .tl-thumb img{
  transform: scale(1.04);
  filter: saturate(1.06);
}
.tl-card .tl-year{
  position: relative;
  /* The notch dot that sits ON the rail line */
  margin: 18px clamp(20px, 2.2vw, 28px) 0;
  font-family: var(--serif, "Cormorant Garamond", Georgia, serif);
  font-size: clamp(1.6rem, 2.4vw, 2.1rem);
  font-style: italic;
  color: var(--w-rouge, #B0382E);
  line-height: 1;
  letter-spacing: -.01em;
  font-feature-settings: "tnum";
  display: inline-block;
  align-self: flex-start;
}
.tl-card .tl-year::before{
  content: "";
  position: absolute;
  left: 0; bottom: -10px;
  width: 10px; height: 10px;
  background: var(--w-saffron, #E8A33D);
  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--w-paper, #FBF6EC);
}
.tl-card.tl-card--now .tl-year{ color: var(--w-saffron, #E8A33D) }
.tl-card.tl-card--now .tl-year::before{ background: var(--w-rouge, #B0382E) }

.tl-card .tl-title{
  margin: 14px clamp(20px, 2.2vw, 28px) 8px;
  font-family: var(--serif, "Cormorant Garamond", Georgia, serif);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.8vw, 1.55rem);
  line-height: 1.2;
  letter-spacing: -.005em;
  color: var(--ink, #1f1d1a);
}
.tl-card .tl-caption{
  margin: 0 clamp(20px, 2.2vw, 28px) clamp(20px, 2.2vw, 26px);
  font-size: clamp(.94rem, 1vw, 1rem);
  line-height: 1.55;
  color: var(--ink-soft, #4a4a4a);
}

.tl-rail-cue{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 14px clamp(20px, 4vw, 64px) 0;
  font-family: var(--sans, system-ui, sans-serif);
  font-size: .68rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--w-teak, #6B3F1E);
  opacity: .7;
}
.tl-rail-cue .tl-rail-arrow{
  font-size: 1rem;
  color: var(--w-saffron, #E8A33D);
  animation: tl-arrow-nudge 1.8s var(--ease, ease-in-out) infinite;
}
@keyframes tl-arrow-nudge{
  0%, 100%{ transform: translateX(0) }
  50%    { transform: translateX(6px) }
}
@media (prefers-reduced-motion: reduce){
  .tl-rail-cue .tl-rail-arrow{ animation: none }
}
@media (max-width: 640px){
  .tl-card{ flex-basis: 84vw }
  .tl-rail-wrap::before{ top: calc(160px + 6px) }
}


/* ====== RESERVE-A-TABLE PICKER MODAL ====== */
.reserve-modal{
  position: fixed; inset: 0; z-index: 200;
  display: none; align-items: center; justify-content: center;
  padding: 24px;
}
.reserve-modal.is-open{ display: flex; }
.reserve-modal .rm-scrim{
  position: absolute; inset: 0;
  background: rgba(20, 14, 8, 0.62);
  backdrop-filter: blur(2px);
  cursor: pointer;
}
.reserve-modal .rm-card{
  position: relative;
  width: 100%; max-width: 540px;
  background: var(--cream, #FBF6EC);
  color: var(--ink, #222);
  border-radius: 6px;
  padding: 36px 32px 28px;
  box-shadow: 0 24px 60px rgba(0,0,0,.32);
  animation: rmIn .26s var(--ease, ease) both;
}
@keyframes rmIn {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
.reserve-modal .rm-close{
  position: absolute; top: 10px; right: 12px;
  background: transparent; border: 0; cursor: pointer;
  font-size: 28px; line-height: 1; color: var(--ink, #222); opacity: .55;
  padding: 6px 10px; border-radius: 999px;
  transition: opacity .2s ease, background .2s ease;
}
.reserve-modal .rm-close:hover{ opacity: 1; background: rgba(0,0,0,.05); }
.reserve-modal .rm-eyebrow{
  font-family: var(--sans, system-ui);
  font-size: .68rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--ink, #222); opacity: .6;
  margin-bottom: 6px;
}
.reserve-modal .rm-title{
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(1.6rem, 3vw, 2rem);
  line-height: 1.15; margin: 0 0 6px;
}
.reserve-modal .rm-sub{
  margin: 0 0 22px;
  font-size: .92rem; opacity: .72;
}
.reserve-modal .rm-list{
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.reserve-modal .rm-item{
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 16px; row-gap: 2px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgba(34,34,34,.14);
  border-radius: 4px;
  background: #fff;
  text-decoration: none;
  color: var(--ink, #222);
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.reserve-modal .rm-item:hover{
  border-color: var(--brand, var(--bfg-red, #A6312B));
  background: #fff;
  transform: translateY(-1px);
}
.reserve-modal .rm-name{
  font-family: var(--serif, Georgia, serif);
  font-weight: 600; font-size: 1.02rem;
  grid-column: 1; grid-row: 1;
}
.reserve-modal .rm-addr{
  font-size: .82rem; opacity: .65;
  grid-column: 1; grid-row: 2;
}
.reserve-modal .rm-arrow{
  grid-column: 2; grid-row: 1 / span 2;
  font-size: 1.3rem; opacity: .55;
  transition: transform .2s ease, opacity .2s ease;
}
.reserve-modal .rm-item:hover .rm-arrow{
  opacity: 1; transform: translateX(3px);
}
.reserve-modal .rm-foot{
  margin: 18px 0 0; text-align: center;
  font-size: .76rem; opacity: .55;
}

/* ====== RESTAURANT MENU SECTION ====== */
.menu-section{
  background: var(--bone, #F2E8D4);
  padding: clamp(48px, 8vw, 96px) 0;
}
.menu-section .menu-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto clamp(32px, 5vw, 56px);
  padding: 0 24px;
}
.menu-section .menu-eyebrow{
  font-family: var(--sans, system-ui);
  font-size: .72rem; letter-spacing: .26em; text-transform: uppercase;
  opacity: .65; margin-bottom: 10px;
}
.menu-section .menu-title{
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.1; margin: 0 0 14px;
}
.menu-section .menu-sub{
  font-size: 1rem; opacity: .72;
  margin: 0;
}
.menu-cat{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  margin-bottom: clamp(40px, 6vw, 64px);
}
.menu-cat-title{
  font-family: var(--serif, Georgia, serif);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(34,34,34,.18);
}
.menu-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px 28px;
}
@media (max-width: 900px){ .menu-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){ .menu-grid{ grid-template-columns: 1fr; } }
.menu-item{ break-inside: avoid; }
.menu-item-head{
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin-bottom: 6px;
}
.menu-item-name{
  font-family: var(--sans, system-ui);
  font-size: .92rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--ink, #222);
  margin: 0;
}
.menu-item-price{
  font-family: var(--sans, system-ui);
  font-size: .92rem; font-weight: 700;
  white-space: nowrap;
  color: var(--brand, var(--bfg-red, #A6312B));
}
.menu-item-desc{
  font-size: .92rem; line-height: 1.5;
  opacity: .78;
  margin: 0 0 8px;
}
.menu-item-tags{
  font-family: var(--sans, system-ui);
  font-size: .72rem; letter-spacing: .12em;
  opacity: .55;
  font-style: italic;
}
.menu-foot{
  text-align: center;
  margin-top: clamp(24px, 4vw, 40px);
  padding: 0 24px;
}
.menu-foot p{
  font-size: .85rem; opacity: .6;
  margin: 0 0 16px;
}

/* ====== EVENTS FORM MODAL (extends .reserve-modal) ====== */
.events-modal .ev-card{ max-width: 640px; max-height: 92vh; overflow-y: auto; }
.events-modal .ev-form{ display: flex; flex-direction: column; gap: 14px; margin-top: 18px; }
.events-modal .ev-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px){ .events-modal .ev-row{ grid-template-columns: 1fr; } }
.events-modal .ev-field{ display: flex; flex-direction: column; gap: 5px; }
.events-modal .ev-label{
  font-family: var(--sans, system-ui);
  font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--ink, #222); opacity: .7;
}
.events-modal .ev-label em{ color: var(--brand, var(--bfg-red, #A6312B)); font-style: normal; letter-spacing: 0; }
.events-modal .ev-opt{ letter-spacing: .04em; text-transform: none; opacity: .55; font-size: .85em; }
.events-modal input,
.events-modal select,
.events-modal textarea{
  padding: 11px 13px;
  border: 1px solid rgba(34,34,34,.18); background: #fff;
  font-family: inherit; font-size: .95rem; border-radius: 3px;
  color: var(--ink, #222);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.events-modal textarea{ font-family: var(--serif, Georgia, serif); resize: vertical; min-height: 90px; }
.events-modal input:focus,
.events-modal select:focus,
.events-modal textarea:focus{ outline: none; border-color: var(--ink, #222); box-shadow: 0 0 0 3px rgba(34,34,34,.08); }
.events-modal .ev-actions{ margin-top: 6px; text-align: center; }
.events-modal .ev-success{ text-align: center; padding: 24px 8px; }
.events-modal .ev-success h4{ font-family: var(--serif, Georgia, serif); font-size: 1.3rem; margin: 0 0 8px; }
.events-modal .ev-success p{ opacity: .75; margin: 0 0 8px; }

.events-modal .ev-error{
  margin-top: 14px;
  font-size: .82rem;
  color: var(--brand, var(--bfg-red, #A6312B));
  opacity: .9;
}
.events-modal .ev-error a{ color: inherit; text-decoration: underline; }

/* ====== EVENT REQUEST (Tripleseat iframe embed) ====== */
.events-modal .ev-iframe-card{
  max-width: 760px;
  width: calc(100% - 24px);
  height: 92vh;
  padding: 0;
  overflow: hidden;
  position: relative;
}
.events-modal .ev-iframe-card .rm-close{
  position: absolute;
  top: 8px; right: 10px;
  z-index: 2;
  background: rgba(255,255,255,.95);
  color: #222;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}
.events-modal .ev-tripleseat-iframe{
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--cream, #FBF6EC);
}
.visually-hidden{
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 560px){
  .events-modal .ev-iframe-card{
    width: 100%;
    height: 100vh;
    max-height: 100vh;
    border-radius: 0;
  }
}

/* ====== EVENT REQUEST V2 (Tripleseat-style layout) ====== */
.events-modal .ev-card-v2{
  max-width: 760px;
  max-height: 92vh;
  overflow-y: auto;
  padding: 0 0 28px;
}
.events-modal .ev-card-v2 > *:not(.ev-banner):not(.rm-close){
  padding-left: 32px;
  padding-right: 32px;
}
.events-modal .ev-banner{
  position: relative;
  height: 140px;
  border-radius: 6px 6px 0 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 100%),
    url('../photos/group-08.jpg') center 35%/cover no-repeat;
}
.events-modal .ev-banner-logo{
  position: absolute;
  left: 20px; bottom: -16px;
  width: 96px; height: 96px;
  padding: 8px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
  object-fit: contain;
}
.events-modal .ev-card-v2 .rm-close{
  background: rgba(255,255,255,.85);
  color: #222;
  top: 10px; right: 12px;
  z-index: 2;
}
.events-modal .ev-page-title{
  font-family: var(--serif, Georgia, serif);
  font-weight: 600;
  font-size: 1.9rem;
  color: var(--brand, var(--bfg-red, #A6312B));
  margin: 36px 0 4px;
  letter-spacing: -.01em;
}
.events-modal .ev-page-intro{
  margin: 0 0 18px;
  font-size: .95rem;
  opacity: .72;
}
.events-modal .ev-form-v2{ gap: 18px; }
.events-modal .ev-section{
  display: flex; flex-direction: column;
  gap: 14px;
  padding: 16px 0 4px;
  border-top: 1px solid rgba(34,34,34,.10);
}
.events-modal .ev-section:first-of-type{ border-top: 0; padding-top: 4px; }
.events-modal .ev-section-title{
  font-family: var(--serif, Georgia, serif);
  font-weight: 500;
  font-size: 1.15rem;
  color: var(--brand, var(--bfg-red, #A6312B));
  margin: 0 0 4px;
}
.events-modal .ev-row-phone{ grid-template-columns: 2fr 1fr; }
.events-modal .ev-field-narrow input{ max-width: 140px; }
.events-modal .ev-checkbox{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: .88rem;
  line-height: 1.45;
  opacity: .85;
  padding: 4px 0;
}
.events-modal .ev-checkbox input[type="checkbox"]{
  width: 18px; height: 18px;
  margin-top: 2px;
  flex: 0 0 18px;
  accent-color: var(--brand, var(--bfg-red, #A6312B));
}
.events-modal .ev-checkbox a{
  color: var(--brand, var(--bfg-red, #A6312B));
  text-decoration: underline;
}
.events-modal .ev-field-conditional[hidden]{ display: none; }
@media (max-width: 560px){
  .events-modal .ev-card-v2{ padding: 0 0 20px; }
  .events-modal .ev-card-v2 > *:not(.ev-banner):not(.rm-close){
    padding-left: 18px; padding-right: 18px;
  }
  .events-modal .ev-banner{ height: 110px; }
  .events-modal .ev-banner-logo{ width: 72px; height: 72px; left: 14px; bottom: -12px; }
  .events-modal .ev-page-title{ font-size: 1.5rem; margin-top: 28px; }
  .events-modal .ev-row-phone{ grid-template-columns: 1fr; }
  .events-modal .ev-field-narrow input{ max-width: none; }
}