/* ============================================================
   ELISHA WEBSITE 2.0 — implementation stylesheet
   Ported from the Claude Design "Elisha Website 2.0" handoff.
   Tokens from the design system's colors_and_type.css, plus
   shared chrome (nav, footer, buttons, section headers) and
   per-page styles. Fully responsive.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Allura&family=Bebas+Neue&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Core brand */
  --color-copper:       #A5572F;
  --color-copper-deep:  #6E3A1F;
  --color-copper-soft:  #D09470;
  /* Surfaces */
  --color-terracotta:   #C28269;
  --color-terracotta-deep: #A56D56;
  --color-plaster:      #EDE3D4;
  --color-bone:         #F5EEE1;
  --color-parchment:    #FAF5EA;
  /* Warm neutrals */
  --color-oak:          #B98A5E;
  --color-oak-light:    #D6B896;
  --color-charcoal:     #2B2622;
  --color-charcoal-soft:#4A423B;
  --color-ash:          #7A6F66;
  /* Accents */
  --color-olive:        #6B6A3E;
  --color-schug:        #A63A2A;
  --color-amba:         #D99A3E;

  --fg-1: var(--color-charcoal);
  --fg-2: var(--color-charcoal-soft);
  --fg-3: var(--color-ash);
  --fg-inverse: var(--color-bone);
  --fg-brand: var(--color-copper);
  --fg-brand-hover: var(--color-copper-deep);

  --font-script: 'Allura', 'Pinyon Script', cursive;
  --font-serif:  'Cormorant Garamond', 'Cormorant', Georgia, serif;
  --font-sans:   'Manrope', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;

  --radius-lg:   12px;
  --radius-xl:   24px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(46, 30, 20, 0.06);
  --shadow-md: 0 8px 24px rgba(46, 30, 20, 0.08);
  --shadow-lg: 0 24px 48px rgba(46, 30, 20, 0.12);

  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);

  --container-max: 1440px;
  --gutter: 48px;
}

@keyframes elishaMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes elishaRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0;
  background: var(--color-plaster);
  color: var(--fg-1);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
*::selection { background: var(--color-copper); color: var(--color-bone); }
img { max-width: 100%; }
a { color: var(--fg-brand); text-decoration: none; transition: color 160ms var(--ease-standard); }
a:hover { color: var(--fg-brand-hover); }

/* ============================================================
   SHARED: container + section headers + diamond accents
   ============================================================ */
.e2-wrap { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); }

.e2-diamond { width: 7px; height: 7px; background: var(--color-copper); transform: rotate(45deg); flex: none; }

.e2-rule { /* line · diamond · line under section titles */
  display: flex; align-items: center; justify-content: center; gap: 10px; margin: 18px 0 0;
}
.e2-rule span.l { width: 46px; height: 1.5px; background: var(--color-copper); opacity: .65; }
.e2-rule span.d { width: 7px; height: 7px; background: var(--color-copper); transform: rotate(45deg); }

.e2-eyebrow {
  font-size: 13px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--color-copper);
}
.e2-spark { display: inline-block; margin: 14px 0 0; color: var(--color-copper); }

.e2-shead { text-align: center; }
.e2-shead h2 {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(40px, 5vw, 58px); line-height: 1.02; letter-spacing: -0.01em;
  color: var(--color-charcoal); margin: 14px 0 0;
}
.e2-shead h2 em { font-style: italic; color: var(--color-copper); }
.e2-shead .sub { font-family: var(--font-serif); font-style: italic; font-size: 20px; color: var(--color-charcoal-soft); margin-top: 14px; }

/* ============================================================
   BUTTONS — pill is the brand button
   ============================================================ */
.e2-btn {
  display: inline-flex; align-items: center; gap: 11px;
  font-family: var(--font-sans); font-size: 13px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  border: none; border-radius: var(--radius-pill); padding: 17px 30px;
  cursor: pointer; transition: background 240ms var(--ease-standard), transform 240ms var(--ease-standard), border-color 240ms var(--ease-standard); white-space: nowrap;
}
.e2-btn svg { flex: none; }
.e2-btn--copper { background: var(--color-copper); color: var(--color-bone); }
.e2-btn--copper:hover { background: var(--color-copper-deep); color: var(--color-bone); transform: translateY(-2px); }
.e2-btn--bone { background: var(--color-bone); color: var(--color-copper); }
.e2-btn--bone:hover { background: #fff; color: var(--color-copper); transform: translateY(-2px); }
.e2-btn--ghost-light { background: transparent; color: var(--color-bone); border: 1.5px solid rgba(245,238,225,0.5); }
.e2-btn--ghost-light:hover { background: rgba(245,238,225,0.08); border-color: rgba(245,238,225,0.8); color: var(--color-bone); }

/* ============================================================
   NAVBAR (transparent over each page's dark hero)
   ============================================================ */
.e2-nav {
  position: relative; z-index: 20;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px;
  padding: 24px 0;
}
.e2-nav-logo { line-height: 1; justify-self: start; text-decoration: none; display: inline-flex; align-items: center; }
.e2-nav-logo .lg { height: 64px; width: auto; display: block; }
.e2-nav-logo .word {
  font-family: var(--font-serif); font-weight: 600; font-size: 34px;
  letter-spacing: 0.07em; text-transform: uppercase; color: var(--color-bone);
}
.e2-nav-logo .tag { display: flex; align-items: center; gap: 6px; margin: 3px 0 2px; }
.e2-nav-logo .tag i { width: 13px; height: 1px; background: rgba(245,238,225,0.4); display: inline-block; }
.e2-nav-logo .tag b { width: 3px; height: 3px; border-radius: 50%; background: rgba(245,238,225,0.6); display: inline-block; }
.e2-nav-logo .tag span {
  font-family: var(--font-serif); font-style: italic; font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase; color: rgba(245,238,225,0.78); padding: 0 2px;
}
.e2-nav-links { display: flex; align-items: center; gap: 26px; justify-self: center; }
.e2-nav-links a {
  position: relative; white-space: nowrap;
  font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0.13em;
  text-transform: uppercase; color: var(--color-bone);
}
.e2-nav-links a:hover { color: var(--color-copper-soft); }
.e2-nav-links a.is-active { color: var(--color-copper-soft); font-weight: 700; }
.e2-nav-links a.is-active::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -8px; height: 1.5px; background: var(--color-copper-soft);
}
.e2-nav-right { justify-self: end; }
.e2-nav-burger {
  display: none; justify-self: end; background: none; border: none; cursor: pointer;
  color: var(--color-bone); padding: 6px;
}

/* mobile drawer */
.e2-drawer-backdrop {
  position: fixed; inset: 0; background: rgba(43,38,34,0.5); opacity: 0; visibility: hidden;
  transition: opacity 240ms var(--ease-standard); z-index: 90;
}
.e2-drawer-backdrop.open { opacity: 1; visibility: visible; }
.e2-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(86vw, 340px);
  background: var(--color-charcoal); z-index: 100; padding: 28px 28px 40px;
  transform: translateX(100%); transition: transform 320ms var(--ease-standard);
  display: flex; flex-direction: column; gap: 8px; overflow-y: auto;
}
.e2-drawer.open { transform: none; }
.e2-drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.e2-drawer-head .word { font-family: var(--font-serif); font-weight: 600; font-size: 28px; letter-spacing: 0.07em; text-transform: uppercase; color: var(--color-bone); }
.e2-drawer-head .lg { height: 42px; width: auto; display: block; }
.e2-drawer-close { background: none; border: none; color: var(--color-bone); font-size: 30px; line-height: 1; cursor: pointer; }
.e2-drawer a.link {
  font-family: var(--font-sans); font-size: 14px; font-weight: 600; letter-spacing: 0.13em;
  text-transform: uppercase; color: var(--color-bone); padding: 14px 0; border-bottom: 1px solid rgba(245,238,225,0.1);
}
.e2-drawer a.link.is-active { color: var(--color-copper-soft); }
.e2-drawer .e2-btn { justify-content: center; margin-top: 22px; }

/* ============================================================
   FOOTER (charcoal horizontal strip)
   ============================================================ */
.e2-foot { background: var(--color-charcoal); padding: 32px var(--gutter); }
.e2-foot-row { max-width: var(--container-max); margin: 0 auto; display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.e2-foot .brand { line-height: 1; flex: none; display: inline-flex; align-items: center; }
.e2-foot .brand .lg { height: 50px; width: auto; display: block; }
.e2-foot .brand .word { font-family: var(--font-serif); font-weight: 600; font-size: 30px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-bone); }
.e2-foot .brand .tag { display: flex; align-items: center; gap: 7px; margin-top: 4px; }
.e2-foot .brand .tag b { width: 5px; height: 5px; background: var(--color-copper-soft); transform: rotate(45deg); display: inline-block; }
.e2-foot .brand .tag span { font-family: var(--font-serif); font-style: italic; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--color-copper-soft); }
.e2-foot .vr { width: 1px; height: 42px; background: rgba(245,238,225,0.14); flex: none; }
.e2-foot .cell { display: flex; align-items: center; gap: 11px; flex: none; }
.e2-foot .cell svg { color: var(--color-copper-soft); }
.e2-foot .cell .ic { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(245,238,225,0.2); display: flex; align-items: center; justify-content: center; color: var(--color-copper-soft); flex: none; }
.e2-foot .cell .t1 { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-bone); line-height: 1.5; }
.e2-foot .cell .t2 { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: rgba(245,238,225,0.92); line-height: 1.5; }
.e2-foot .cell .t2 a { color: rgba(245,238,225,0.92); display: inline-block; padding: 5px 2px; }
.e2-foot .cell .t2 a:hover { color: var(--color-copper-soft); }
.e2-foot .spacer { flex: 1; }
.e2-foot .social .lbl { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(245,238,225,0.78); margin-bottom: 10px; }
.e2-foot .social .row { display: flex; gap: 10px; }
.e2-foot .social a { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(245,238,225,0.25); display: flex; align-items: center; justify-content: center; color: var(--color-copper-soft); transition: background 200ms, color 200ms, border-color 200ms; }
.e2-foot .social a:hover { background: var(--color-copper); color: var(--color-bone); border-color: var(--color-copper); }
.e2-foot-bottom { max-width: var(--container-max); margin: 22px auto 0; padding-top: 18px; border-top: 1px solid rgba(245,238,225,0.1); display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.e2-foot-bottom .cr { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(245,238,225,0.78); }
.e2-foot-bottom .links { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.e2-foot-bottom .links a { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(245,238,225,0.78); display: inline-block; padding: 6px 2px; }
.e2-foot-bottom .links a:hover { color: var(--color-copper-soft); }

/* ============================================================
   GENERIC DARK PAGE HERO (Story / Reviews / Catering / Hours / Menu)
   ============================================================ */
.e2-hero {
  position: relative; background: var(--color-charcoal); overflow: hidden;
}
.e2-hero .bg { position: absolute; inset: 0; z-index: 1; background-size: cover; background-position: center; }
.e2-hero .scrim { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.e2-hero .inner { position: relative; z-index: 3; }
.e2-hero-copy { padding: 70px 0 84px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.e2-hero-copy .eye { font-size: 13px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: var(--color-copper-soft); }
.e2-hero-copy .spark { margin: 16px 0 0; }
.e2-hero-copy h1 {
  font-family: var(--font-serif); font-weight: 400; font-size: clamp(50px, 6vw, 88px);
  line-height: 0.98; letter-spacing: -0.012em; color: var(--color-bone); margin: 14px 0 0;
}
.e2-hero-copy h1 em { font-style: italic; color: var(--color-copper-soft); }
.e2-hero-copy .rule { margin: 26px 0 0; }
.e2-hero-copy .rule span.l { background: var(--color-copper-soft); }
.e2-hero-copy .rule span.d { background: var(--color-copper-soft); }
.e2-hero-copy .deck { font-family: var(--font-serif); font-style: italic; font-size: 20px; line-height: 1.5; color: rgba(245,238,225,0.9); margin: 22px 0 0; max-width: 540px; }

/* ============================================================
   HOMEPAGE
   ============================================================ */
.home-fold { min-height: 100vh; display: flex; flex-direction: column; }
.home-hero { position: relative; flex: 1 1 auto; min-height: 540px; background: var(--color-charcoal); overflow: hidden; display: flex; flex-direction: column; }
.home-hero .photo { position: absolute; inset: 0; width: 100%; z-index: 1; background-size: cover; background-position: center; animation: e2ken 28s ease-in-out infinite alternate; will-change: transform; }
/* subtle ken-burns drift on the hero photo */
@keyframes e2ken { from { transform: scale(1.04) translate3d(0, 0, 0); } to { transform: scale(1.11) translate3d(-1.1%, -1.1%, 0); } }
@media (prefers-reduced-motion: reduce) { .home-hero .photo { animation: none; } }
/* light readability scrim — top + bottom only, picture stays visible */
.home-hero .photo .s1 { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(43,38,34,0.46) 0%, rgba(43,38,34,0.12) 26%, rgba(43,38,34,0.12) 56%, rgba(43,38,34,0.62) 100%); }
/* soft vignette behind the centered headline */
.home-hero .photo .s2 { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(78% 66% at 50% 44%, rgba(43,38,34,0.42) 0%, rgba(43,38,34,0) 72%); }
.home-hero .inner { position: relative; z-index: 4; flex: 1; display: flex; flex-direction: column; max-width: var(--container-max); width: 100%; margin: 0 auto; padding: 0 var(--gutter); }
.home-hero-copy { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 0; }
.home-hero-copy > div { max-width: 640px; padding: 24px 0; text-align: center; display: flex; flex-direction: column; align-items: center; text-shadow: 0 1px 3px rgba(28,24,21,0.6), 0 3px 22px rgba(28,24,21,0.6); }
.home-hero-copy .eye { font-size: 13px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-copper-soft); display: flex; align-items: center; gap: 12px; }
.home-hero-copy .eye b { width: 4px; height: 4px; border-radius: 50%; background: var(--color-copper-soft); display: inline-block; }
.home-hero-copy h1 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(54px, 6vw, 88px); line-height: 0.98; letter-spacing: -0.012em; color: var(--color-bone); margin: 18px 0 0; }
.home-hero-copy h1 em { font-style: italic; color: var(--color-bone); }
.home-hero-copy h1 .dot { font-style: italic; color: var(--color-copper); }
.home-hero-copy .deck { font-family: var(--font-sans); font-weight: 400; font-size: 18px; line-height: 1.6; color: rgba(245,238,225,0.86); margin: 0; max-width: 420px; }
.home-hero-copy .cta-row { display: flex; justify-content: center; gap: 16px; margin-top: 34px; flex-wrap: wrap; }

.home-services { flex: none; background: var(--color-plaster); padding: 24px 0 58px; }
.home-services .grid { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.svc-card {
  position: relative; overflow: hidden; border-radius: 18px; padding: 26px 26px;
  display: flex; align-items: center; gap: 18px; box-shadow: var(--shadow-md);
  transition: transform 240ms var(--ease-standard), box-shadow 240ms var(--ease-standard);
  text-decoration: none;
}
.svc-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.svc-card .dots { position: absolute; inset: 0; opacity: 0.1; pointer-events: none; background-size: 46px 46px; }
.svc-card .ic { position: relative; flex: none; width: 54px; height: 54px; border-radius: 50%; background: var(--color-bone); display: flex; align-items: center; justify-content: center; }
.svc-card .tx { position: relative; flex: 1; min-width: 0; }
.svc-card .tx .ti { font-family: var(--font-sans); font-weight: 800; font-size: 21px; letter-spacing: 0.02em; text-transform: uppercase; line-height: 1.05; }
.svc-card .tx .ds { font-family: var(--font-sans); font-weight: 600; font-size: 15px; line-height: 1.4; margin-top: 6px; }
.svc-card .arrow { position: relative; flex: none; }
.svc-card--copper { background: var(--color-copper); }
.svc-card--copper .ic { color: var(--color-copper); }
.svc-card--copper .ti { color: var(--color-bone); }
.svc-card--copper .ds { color: rgba(245,238,225,0.9); }
.svc-card--copper .arrow { color: rgba(245,238,225,0.85); }
.svc-card--charcoal { background: var(--color-charcoal); }
.svc-card--charcoal .ic { color: var(--color-charcoal); }
.svc-card--charcoal .ti { color: var(--color-bone); }
.svc-card--charcoal .ds { color: rgba(245,238,225,0.82); }
.svc-card--charcoal .arrow { color: rgba(245,238,225,0.75); }
.svc-card--olive { background: var(--color-olive); }
.svc-card--olive .ic { color: var(--color-olive); }
.svc-card--olive .ti { color: var(--color-bone); }
.svc-card--olive .ds { color: rgba(245,238,225,0.9); }
.svc-card--olive .arrow { color: rgba(245,238,225,0.85); }
.svc-card--oak { background: var(--color-oak-light); }
.svc-card--oak .ic { color: var(--color-copper-deep); }
.svc-card--oak .ti { color: var(--color-charcoal); }
.svc-card--oak .ds { color: var(--color-charcoal-soft); }
.svc-card--oak .arrow { color: var(--color-charcoal); }

.home-scroll { flex: none; background: var(--color-plaster); padding: 22px var(--gutter) 24px; }
.home-scroll .lab { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.home-scroll .lab .t { font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: var(--color-charcoal); display: flex; align-items: center; gap: 14px; }
.home-scroll .lab .t span { width: 36px; height: 1px; background: rgba(43,38,34,0.25); }
.home-scroll .lab .d { width: 6px; height: 6px; background: var(--color-copper); transform: rotate(45deg); }

/* spinning "keep scrolling" badge — sits on the seam between the cards and the marquee */
.scroll-badge {
  position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); z-index: 12;
  width: 116px; height: 116px; border-radius: 50%;
  background: var(--color-bone); box-shadow: 0 16px 36px rgba(46,30,20,0.20);
  display: grid; place-items: center;
}
.scroll-badge .ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: e2spin 18s linear infinite; }
.scroll-badge .ring text { fill: var(--color-copper); font-family: var(--font-sans); font-size: 9px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; }
.scroll-badge .arrow { position: relative; color: var(--color-copper); animation: e2nudge 1.8s var(--ease-standard) infinite; }
@keyframes e2spin { to { transform: rotate(360deg); } }
@keyframes e2nudge { 0%, 100% { transform: translateY(-2px); } 50% { transform: translateY(3px); } }

/* popular marquee */
.home-pop { position: relative; background: var(--color-parchment); padding: 74px 0 84px; }
.home-pop .head { max-width: var(--container-max); margin: 0 auto 46px; padding: 0 var(--gutter); text-align: center; }
.home-pop .head .eye { font-size: 13px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-copper); }
.home-pop .head h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(42px, 4.6vw, 60px); line-height: 1.02; letter-spacing: -0.01em; color: var(--color-charcoal); margin: 18px 0 0; }
.home-pop .head h2 em { font-style: italic; color: var(--color-copper); }
.home-pop .head .sub { font-family: var(--font-serif); font-style: italic; font-size: 21px; color: var(--color-charcoal-soft); margin-top: 12px; }
.home-pop .foot-cta { display: flex; justify-content: center; margin-top: 46px; }

.e2-marquee { position: relative; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%); }
.e2-marquee .track { display: flex; width: max-content; animation: elishaMarquee 48s linear infinite; }
.e2-marquee:hover .track { animation-play-state: paused; }
.e2-marquee .track.rev { animation-direction: reverse; }

.dish-card { position: relative; width: 228px; margin-right: 16px; flex: none; height: 332px; border-radius: 16px; overflow: hidden; background: var(--color-oak); box-shadow: var(--shadow-md); background-size: cover; background-position: center; text-decoration: none; }
.dish-card .grad { position: absolute; left: 0; right: 0; bottom: 0; height: 62%; background: linear-gradient(180deg, rgba(43,38,34,0) 0%, rgba(43,38,34,0.55) 45%, rgba(43,38,34,0.92) 100%); pointer-events: none; }
.dish-card .vg { position: absolute; top: 14px; left: 14px; width: 34px; height: 34px; border-radius: 50%; background: var(--color-olive); color: #F5EEE1; display: flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.06em; }
.dish-card .meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 16px 16px; }
.dish-card .meta .top { display: flex; align-items: baseline; gap: 10px; }
.dish-card .meta .nm { flex: 1; font-family: var(--font-sans); font-weight: 700; font-size: 13.5px; letter-spacing: 0.07em; text-transform: uppercase; color: #F5EEE1; }
.dish-card .meta .pr { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--color-copper-soft); }
.dish-card .meta .ds { font-family: var(--font-sans); font-size: 12.5px; color: rgba(245,238,225,0.78); margin-top: 5px; }

/* reviews band (dark) */
.home-rev { position: relative; background: linear-gradient(rgba(35,30,27,0.88), rgba(35,30,27,0.92)), url(/assets/photos/bg-3.jpg) center/cover; padding: 84px 0 92px; overflow: hidden; }
.home-rev .head { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: flex; flex-direction: column; align-items: center; text-align: center; }
.rev-badge { display: inline-flex; align-items: center; gap: 16px; background: rgba(245,238,225,0.05); border: 1px solid rgba(245,238,225,0.12); border-radius: 999px; padding: 13px 28px; }
.rev-badge .stars { display: flex; gap: 2px; color: var(--color-copper); }
.rev-badge .num { font-family: var(--font-serif); font-weight: 500; font-size: 26px; line-height: 1; color: var(--color-bone); }
.rev-badge .cnt { font-family: var(--font-sans); font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-ash); white-space: nowrap; }
.home-rev h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(40px, 4.4vw, 58px); line-height: 1.04; letter-spacing: -0.01em; color: var(--color-bone); margin: 24px 0 0; }
.home-rev h2 em { font-style: italic; color: var(--color-copper); }
.home-rev .rails { margin-top: 48px; }
.home-rev .e2-marquee { margin-bottom: 18px; }
.rev-card { flex: none; width: 360px; min-height: 158px; margin-right: 18px; background: rgba(245,238,225,0.045); border: 1px solid rgba(245,238,225,0.10); border-radius: 14px; padding: 22px 24px; }
.rev-card .top { display: flex; align-items: center; gap: 12px; }
.rev-card .av { flex: none; width: 40px; height: 40px; border-radius: 50%; color: #F5EEE1; display: flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-weight: 700; font-size: 13px; background: var(--color-copper); }
.rev-card .nm { font-family: var(--font-sans); font-weight: 700; font-size: 14px; color: var(--color-bone); }
.rev-card .wh { font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ash); margin-top: 2px; }
.rev-card .stars { display: flex; gap: 2px; color: var(--color-copper); margin-left: auto; }
.rev-card .tx { font-family: var(--font-serif); font-size: 16px; line-height: 1.55; color: rgba(245,238,225,0.82); margin-top: 14px; }
.home-rev .foot-cta { display: flex; justify-content: center; margin-top: 30px; }

/* contact panel (split terracotta / photo) */
.home-contact { background: var(--color-charcoal); }
.home-contact .panel { display: grid; grid-template-columns: 1fr 1fr; min-height: 460px; }
.home-contact .left { background: var(--color-copper); position: relative; overflow: hidden; padding: 72px var(--gutter); display: flex; flex-direction: column; justify-content: center; }
.home-contact .left .dots { position: absolute; inset: 0; opacity: 0.1; pointer-events: none; background-size: 52px 52px; }
.home-contact .left > * { position: relative; }
.home-contact .left .eye { font-size: 13px; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: rgba(245,238,225,0.82); }
.home-contact .left h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(40px, 4.4vw, 56px); line-height: 1.02; color: var(--color-bone); margin: 16px 0 0; }
.home-contact .left h2 em { font-style: italic; color: rgba(245,238,225,0.7); }
.home-contact .info { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 32px; margin: 34px 0 0; }
.home-contact .info h3 { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(245,238,225,0.82); margin: 0 0 7px; }
.home-contact .info p { font-family: var(--font-serif); font-size: 19px; line-height: 1.4; color: var(--color-bone); margin: 0; }
.home-contact .info p a { color: var(--color-bone); }
.home-contact .ctas { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
.home-contact .right { position: relative; background-size: cover; background-position: center; }
.home-contact .right .cap { position: absolute; left: 24px; bottom: 22px; right: 24px; font-family: var(--font-sans); font-size: 12px; color: var(--color-bone); background: rgba(43,38,34,0.5); padding: 10px 14px; border-radius: 10px; backdrop-filter: blur(4px); }

/* ============================================================
   MENU PAGE
   ============================================================ */
.menu-hero { position: relative; height: 520px; background: var(--color-charcoal); overflow: hidden; }
.menu-hero .bg { position: absolute; inset: 0; z-index: 1; background-size: cover; background-position: center; }
.menu-hero .scrim1 { position: absolute; inset: 0; pointer-events: none; z-index: 2; background: linear-gradient(180deg, rgba(43,38,34,0.78) 0%, rgba(43,38,34,0.34) 24%, rgba(43,38,34,0.32) 56%, rgba(43,38,34,0.82) 100%); }
.menu-hero .scrim2 { position: absolute; inset: 0; pointer-events: none; z-index: 2; background: radial-gradient(120% 90% at 50% 42%, rgba(43,38,34,0) 28%, rgba(43,38,34,0.42) 100%); }
.menu-hero .inner { position: relative; z-index: 4; height: 100%; display: flex; flex-direction: column; max-width: var(--container-max); width: 100%; margin: 0 auto; padding: 0 var(--gutter); }
.menu-hero-title { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding-bottom: 24px; }
.menu-hero-title .eye { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.34em; text-transform: uppercase; color: rgba(245,238,225,0.82); }
.menu-hero-title .spark { margin: 16px 0 4px; color: rgba(245,238,225,0.85); }
.menu-hero-title h1 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(48px,7vw,76px); line-height: 1; letter-spacing: -0.01em; color: var(--color-bone); margin: 8px 0 0; }
.menu-hero-title .deck { font-family: var(--font-serif); font-style: italic; font-size: 20px; line-height: 1.5; color: rgba(245,238,225,0.9); margin: 18px 0 0; max-width: 560px; }

.menu-stickywrap { position: sticky; top: 16px; z-index: 50; display: flex; justify-content: center; margin-top: -36px; padding: 0 var(--gutter); pointer-events: none; }
.menu-tabs { pointer-events: auto; display: inline-flex; align-items: center; gap: 2px; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.06); border-radius: 999px; padding: 8px; box-shadow: var(--shadow-lg); max-width: 100%; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.menu-tabs::-webkit-scrollbar { display: none; }
.menu-tabs a { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; color: var(--color-charcoal-soft); background: transparent; border-radius: 999px; padding: 12px 22px; white-space: nowrap; transition: color 200ms var(--ease-standard), background 200ms var(--ease-standard); }
.menu-tabs a:hover { color: var(--color-copper); }
.menu-tabs a.is-active { color: var(--color-bone); background: var(--color-copper); }

.menu-sec { max-width: var(--container-max); margin: 0 auto; padding: 86px var(--gutter) 30px; scroll-margin-top: 92px; }
.menu-sec .head { text-align: center; margin-bottom: 50px; }
.menu-sec .head .spark { color: var(--color-copper); margin-bottom: 14px; display: inline-block; }
.menu-sec .head h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(42px,5vw,58px); line-height: 1; letter-spacing: -0.01em; color: var(--color-charcoal); margin: 0; }
.menu-sec .head .note { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.6; color: var(--color-ash); max-width: 640px; margin: 18px auto 0; }
.menu-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.menu-grid > .menu-card { flex: 0 1 calc(25% - 18px); }
.menu-grid.is-2 { max-width: 760px; margin: 0 auto; }
.menu-card { display: flex; flex-direction: column; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.06); border-radius: 18px; padding: 12px 12px 0; box-shadow: var(--shadow-md); transition: transform 240ms var(--ease-standard), box-shadow 240ms var(--ease-standard); }
.menu-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.menu-card .pic { position: relative; height: 188px; border-radius: 12px; overflow: hidden; background: var(--color-oak) center/cover no-repeat; }
.menu-card .pic .vg { position: absolute; top: 12px; left: 12px; background: var(--color-olive); color: var(--color-bone); font-family: var(--font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.08em; padding: 5px 11px; border-radius: 999px; }
.menu-card .pic-art { display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--color-parchment) 0%, #EFE2CD 100%); }
.menu-card .pic-art svg { width: 84px; height: 84px; color: var(--color-copper); }
.menu-card .body { display: flex; flex-direction: column; flex: 1; padding: 18px 10px 20px; }
.menu-card h3 { font-family: var(--font-serif); font-weight: 500; font-size: 25px; line-height: 1.15; color: var(--color-charcoal); margin: 0; }
.menu-card .desc { font-family: var(--font-sans); font-weight: 400; font-size: 13.5px; line-height: 1.55; color: var(--color-charcoal-soft); margin: 10px 0 0; }
.menu-card .addons { font-family: var(--font-sans); font-weight: 400; font-size: 12.5px; line-height: 1.5; color: var(--color-copper); margin: 7px 0 0; }
.menu-card .addons b { font-weight: 700; }
/* "Coming Soon" sections — badge + grayed, non-interactive grid */
.menu-sec .soon-badge { display: inline-block; vertical-align: middle; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-bone); background: var(--color-ash); padding: 5px 12px; border-radius: 999px; margin-left: 12px; transform: translateY(-3px); }
.menu-sec.is-soon .menu-grid { opacity: 0.5; filter: grayscale(0.85); pointer-events: none; }
/* Lunch Special — cream 3-column layout (food rails + centered menu) */
.ls2 { position: relative; background: linear-gradient(180deg, #74332b 0%, #531e1c 100%); display: grid; grid-template-columns: 23% 1fr 23%; align-items: stretch; }
.ls2::before { content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 30px; background: #74332b; }
.ls2-side { display: flex; flex-direction: column; gap: 8px; padding: 8px; }
.ls2-side .im { flex: 1; background-size: cover; background-position: center; border-radius: 4px; min-height: 150px; }
/* center menu — stacked editorial layout (design: Elisha Lunch Special) */
.ls2-center { position: relative; padding: 66px 76px 70px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ls2-frame { position: absolute; inset: 18px; border: 1px solid rgba(245,238,225,0.5); pointer-events: none; }
.ls2-tax { font-family: var(--font-sans); font-style: italic; font-size: 12px; letter-spacing: 0.02em; color: rgba(245,238,225,0.72); text-align: center; margin-top: 8px; }

.ls2-title { font-family: 'Bebas Neue', var(--font-sans); font-size: clamp(38px, 5vw, 60px); line-height: 1; letter-spacing: 0.05em; color: var(--color-bone); white-space: nowrap; }

.ls2-hours { display: flex; align-items: center; gap: 16px; width: 100%; max-width: 560px; margin: 24px 0 4px; }
.ls2-hours .ln { flex: 1; height: 1px; background: rgba(245,238,225,0.45); }
.ls2-hours .txt { font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: var(--color-bone); }

.ls2-price { font-family: 'Bebas Neue', var(--font-sans); font-size: clamp(38px, 4.4vw, 46px); line-height: 1; letter-spacing: 0.04em; color: var(--color-bone); margin-top: 28px; }

.ls2-section { font-family: 'Bebas Neue', var(--font-sans); font-size: 27px; letter-spacing: 0.16em; color: var(--color-bone); border-bottom: 1px solid rgba(245,238,225,0.7); padding-bottom: 5px; margin-top: 32px; }
.ls2-style { font-family: var(--font-sans); font-size: 14px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-bone); margin-top: 18px; }
.ls2-list { font-family: var(--font-sans); font-size: 14.5px; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase; color: rgba(245,238,225,0.92); line-height: 2.0; margin-top: 10px; }
.ls2-list-wide { letter-spacing: 0.1em; line-height: 1.8; max-width: 500px; }
.ls2-plus { font-family: var(--font-sans); font-weight: 300; font-size: 40px; color: var(--color-bone); line-height: 1; margin: 16px 0; }

.ls2-tops { font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(245,238,225,0.86); line-height: 1.7; margin-top: 30px; max-width: 520px; }
.ls2-tops .t { font-weight: 800; color: var(--color-bone); }

.ls2-vhq { position: absolute; bottom: 34px; right: 42px; display: flex; align-items: center; gap: 9px; color: var(--color-bone); }
.ls2-vhq .mark { font-family: var(--font-serif); font-weight: 700; font-size: 26px; line-height: 0.9; letter-spacing: 0.02em; }
.ls2-vhq .lbl { font-family: var(--font-sans); font-size: 8px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.3; text-align: left; }

@media (max-width: 1080px) {
  .ls2 { grid-template-columns: 1fr; }
  .ls2-side { flex-direction: row; padding: 8px; }
  .ls2-side .im { min-height: 120px; }
  .ls2-right { display: none; }
  .ls2-center { padding: 54px var(--gutter) 60px; }
}
@media (max-width: 600px) {
  .ls2-left { display: none; }
  .ls2-title { white-space: normal; }
  .ls2-hours .txt { white-space: normal; }
  .ls2-vhq { position: static; margin-top: 30px; justify-content: center; }
}
.menu-card .grow { flex: 1; min-height: 18px; }
.menu-card .dash { border-top: 1px dashed rgba(165,87,47,0.38); margin: 16px 0 13px; }
.menu-card .sizelbl { font-family: var(--font-sans); font-size: 10.5px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-ash); margin-bottom: 5px; }
.menu-card .price { font-family: var(--font-serif); font-weight: 600; font-size: 24px; color: var(--color-copper); line-height: 1; }
/* triad price — Pita / Wrap / Plate */
.menu-card .triad { display: flex; }
.menu-card .triad .tp { flex: 1; display: flex; flex-direction: column; gap: 4px; align-items: center; text-align: center; padding: 2px 4px; }
.menu-card .triad .tp + .tp { border-left: 1px solid rgba(165,87,47,0.22); }
.menu-card .triad .tl { font-family: var(--font-sans); font-size: 9.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-ash); }
.menu-card .triad .tv { font-family: var(--font-serif); font-weight: 600; font-size: 23px; color: var(--color-copper); line-height: 1; font-variant-numeric: tabular-nums; }

/* list layout (sides/drinks) */
.menu-list { max-width: 900px; margin: 0 auto; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.06); border-radius: 18px; box-shadow: var(--shadow-md); padding: 30px 42px; }
.menu-list .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 60px; }
.menu-list .row { display: flex; align-items: baseline; gap: 10px; padding: 15px 0; border-bottom: 1px solid rgba(43,38,34,0.08); }
.menu-list .row .nm { font-family: var(--font-serif); font-weight: 500; font-size: 22px; color: var(--color-charcoal); white-space: nowrap; }
.menu-list .row .tg { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; color: var(--color-olive); }
.menu-list .row .led { flex: 1; border-bottom: 1px dotted rgba(43,38,34,0.30); transform: translateY(-5px); }
.menu-list .row .pr { font-family: var(--font-serif); font-weight: 600; font-size: 22px; color: var(--color-copper); white-space: nowrap; }

/* house sauces */
.menu-sauces { background: #FDEFD6; padding: 92px var(--gutter) 96px; scroll-margin-top: 92px; border-top: 1px solid rgba(43,38,34,0.06); border-bottom: 1px solid rgba(43,38,34,0.06); }
.menu-sauces .in { max-width: 1200px; margin: 0 auto; }
.menu-sauces .head { text-align: center; margin-bottom: 58px; }
.menu-sauces .head .spark { color: var(--color-copper); margin-bottom: 14px; display: inline-block; }
.menu-sauces .head h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(42px,5vw,58px); line-height: 1; letter-spacing: -0.01em; color: var(--color-charcoal); margin: 0; }
.menu-sauces .head .sub { font-family: var(--font-serif); font-style: italic; font-size: 18px; line-height: 1.5; color: var(--color-ash); margin: 18px auto 0; max-width: 540px; }
.menu-sauces .grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 24px; }
.menu-sauces figure { margin: 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
.menu-sauces figure .ring { width: 100%; max-width: 230px; overflow: hidden; border-radius: 50%; }
.menu-sauces figure img { display: block; width: 100%; height: auto; transition: transform 600ms var(--ease-standard); }
.menu-sauces figure:hover img { transform: scale(1.04); }
.menu-sauces figcaption { font-family: var(--font-serif); font-weight: 500; font-size: 21px; color: var(--color-charcoal); margin-top: 4px; }

/* notes strip */
.menu-notes { max-width: var(--container-max); margin: 0 auto; padding: 56px var(--gutter) 96px; }
.menu-notes .box { background: var(--color-bone); border: 1px solid rgba(43,38,34,0.06); border-radius: 16px; padding: 32px 40px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px 44px; align-items: start; }
.menu-notes .lbl { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-copper); margin-bottom: 8px; }
.menu-notes .val { font-family: var(--font-sans); font-size: 14px; line-height: 1.7; color: var(--color-charcoal-soft); }
@media (max-width: 860px) { .menu-notes .box { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .menu-notes .box { grid-template-columns: 1fr; gap: 22px; } }

/* order CTA */
.menu-cta { position: relative; overflow: hidden; background: linear-gradient(165deg, #A5572F 0%, #8C4626 100%); padding: 116px var(--gutter) 104px; text-align: center; }
.menu-cta .torn { position: absolute; top: -1px; left: 0; width: 100%; height: 54px; }
.menu-cta .dots { position: absolute; inset: 0; opacity: 0.1; pointer-events: none; background-size: 44px 44px; }
.menu-cta .in { position: relative; z-index: 2; max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.menu-cta .ic { width: 84px; height: 84px; border-radius: 50%; background: var(--color-bone); display: flex; align-items: center; justify-content: center; color: var(--color-copper); margin-bottom: 26px; }
.menu-cta .eye { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.28em; text-transform: uppercase; color: rgba(245,238,225,0.78); }
.menu-cta h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(48px,6vw,74px); line-height: 1; letter-spacing: -0.01em; color: var(--color-bone); margin: 18px 0 0; }
.menu-cta h2 em { font-style: italic; color: var(--color-copper-soft); }
.menu-cta .deck { font-family: var(--font-serif); font-size: 22px; line-height: 1.5; color: rgba(245,238,225,0.92); margin: 20px 0 0; }
.menu-cta .modes { display: flex; align-items: center; gap: 16px; margin-top: 34px; font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(245,238,225,0.82); }
.menu-cta .modes b { width: 4px; height: 4px; border-radius: 50%; background: rgba(245,238,225,0.6); display: inline-block; }

/* ============================================================
   OUR STORY PAGE
   ============================================================ */
.story-sections { background: var(--color-plaster); padding: 88px 0 64px; }
.story-sections .in { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: flex; flex-direction: column; gap: 80px; }
.story-row { display: grid; grid-template-columns: 1fr 1.12fr; gap: 64px; align-items: center; }
.story-row.flip { grid-template-columns: 1.12fr 1fr; }
.story-row h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(32px,4vw,42px); line-height: 1.08; letter-spacing: -0.01em; color: var(--color-charcoal); margin: 0; }
.story-row h2 em { font-style: italic; color: var(--color-copper); }
.story-row .mini { display: flex; align-items: center; gap: 9px; margin: 22px 0 24px; }
.story-row .mini i { width: 38px; height: 1.5px; background: var(--color-copper); }
.story-row .mini b { width: 6px; height: 6px; background: var(--color-copper); transform: rotate(45deg); }
.story-row p { font-family: var(--font-sans); font-size: 16px; line-height: 1.75; color: var(--color-charcoal-soft); margin: 0; max-width: 420px; }
.story-row .img { position: relative; height: 332px; border-radius: 18px; overflow: hidden; background: var(--color-oak) center/cover no-repeat; box-shadow: var(--shadow-md); }
.story-row .img video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.story-row.flip .img { order: -1; }

.story-values { background: var(--color-plaster); padding: 24px 0 88px; }
.story-values .in { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); }
.story-values .lead { display: flex; align-items: center; gap: 22px; margin-bottom: 44px; }
.story-values .lead i { flex: 1; height: 1px; background: rgba(43,38,34,0.16); }
.story-values .lead span { font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: var(--color-copper); }
.story-values .grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.value { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 26px; }
.value + .value { border-left: 1px solid rgba(43,38,34,0.12); }
.value .ic { width: 60px; height: 60px; border-radius: 50%; border: 1.5px solid var(--color-copper); color: var(--color-copper); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.value .ti { font-family: var(--font-serif); font-weight: 600; font-size: 19px; color: var(--color-charcoal); margin-bottom: 8px; }
.value .ds { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.6; color: var(--color-ash); max-width: 170px; }

.story-cta-band { position: relative; background: var(--color-charcoal); }
.story-cta { position: relative; background: var(--color-copper); overflow: hidden; }
.story-cta .torn-t, .story-cta .torn-b { position: absolute; left: 0; width: 100%; height: 26px; display: block; }
.story-cta .torn-t { top: -1px; }
.story-cta .torn-b { bottom: -1px; }
.story-cta .dots { position: absolute; inset: 0; opacity: 0.1; pointer-events: none; background-size: 52px 52px; }
.story-cta .in { position: relative; max-width: 760px; margin: 0 auto; padding: 92px var(--gutter) 84px; text-align: center; }
.story-cta .ic { width: 62px; height: 62px; border-radius: 50%; background: var(--color-bone); display: inline-flex; align-items: center; justify-content: center; color: var(--color-copper); margin-bottom: 24px; }
.story-cta h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(40px,4.6vw,60px); line-height: 1; letter-spacing: -0.01em; color: var(--color-bone); margin: 0; }
.story-cta h2 em { font-style: italic; color: rgba(245,238,225,0.62); }
.story-cta .deck { font-family: var(--font-serif); font-size: 20px; line-height: 1.5; color: rgba(245,238,225,0.88); margin: 16px 0 0; }
.story-cta .ctas { display: flex; gap: 16px; justify-content: center; margin-top: 36px; flex-wrap: wrap; }

/* ============================================================
   REVIEWS PAGE
   ============================================================ */
.revs { background: var(--color-plaster); padding: 70px 0 96px; }
.revs .in { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); }
.revs .agg { display: flex; flex-direction: column; align-items: center; text-align: center; margin-bottom: 54px; }
.revs .agg .top { display: flex; align-items: baseline; gap: 12px; }
.revs .agg .n { font-family: var(--font-serif); font-weight: 500; font-size: 64px; line-height: 1; color: var(--color-copper); }
.revs .agg .stars { display: flex; gap: 4px; color: var(--color-copper); transform: translateY(-6px); }
.revs .agg .cap { font-family: var(--font-sans); font-size: 13.5px; color: var(--color-ash); margin-top: 14px; }
.revs .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.rev-q { display: flex; flex-direction: column; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.08); border-radius: 16px; padding: 32px 30px; box-shadow: var(--shadow-md); }
.rev-q .stars { display: flex; gap: 4px; color: var(--color-copper); margin-bottom: 18px; }
.rev-q p { font-family: var(--font-serif); font-size: 21px; line-height: 1.5; color: var(--color-charcoal); margin: 0; flex: 1; }
.rev-q .who { display: flex; align-items: center; gap: 11px; margin-top: 26px; }
.rev-q .who i { width: 26px; height: 1.5px; background: var(--color-copper); }
.rev-q .who .nm { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-charcoal); white-space: nowrap; }
.rev-q .who .loc { font-family: var(--font-sans); font-size: 13px; color: var(--color-ash); white-space: nowrap; }
/* marquee variant of the testimonial card (fixed width for the rails) */
.revs .rails { margin-top: 8px; }
.revs .e2-marquee { margin-bottom: 22px; }
.revs .e2-marquee .track { animation-duration: 66s; }
.revs .e2-marquee .track.rev { animation-duration: 78s; }
.rev-mq { flex: none; width: 380px; margin-right: 22px; }

/* ============================================================
   CATERING PAGE
   ============================================================ */
.cat-soon { background: var(--color-plaster); padding: 116px 0 124px; }
.cat-soon .in { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: flex; flex-direction: column; align-items: center; text-align: center; }
.cat-soon .badge { width: 86px; height: 86px; border-radius: 50%; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.08); display: flex; align-items: center; justify-content: center; color: var(--color-copper); box-shadow: var(--shadow-md); }
.cat-soon .eye { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: var(--color-copper); margin-top: 30px; }
.cat-soon h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(48px,6vw,82px); line-height: 1; letter-spacing: -0.012em; color: var(--color-charcoal); margin: 16px 0 0; }
.cat-soon p { font-family: var(--font-sans); font-size: 17px; line-height: 1.75; color: var(--color-charcoal-soft); margin: 28px 0 0; max-width: 540px; }

/* ============================================================
   HOURS & INFO PAGE
   ============================================================ */
.visit-info { background: var(--color-plaster); padding: 84px 0 72px; }
.visit-info .in { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: 1fr 1px 1fr; gap: 64px; align-items: start; }
.visit-info .divider { width: 1px; align-self: stretch; background: rgba(43,38,34,0.12); }
.vi-line { display: flex; gap: 24px; align-items: flex-start; }
.vi-line .ic { flex: none; width: 62px; height: 62px; border-radius: 50%; border: 1.5px solid var(--color-copper); color: var(--color-copper); display: flex; align-items: center; justify-content: center; }
.vi-line .ic.sm { width: 50px; height: 50px; margin-left: 6px; }
.vi-lbl { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-copper); margin-bottom: 14px; }
.vi-big { font-family: var(--font-serif); font-size: 26px; line-height: 1.32; color: var(--color-charcoal); }
.vi-mid { font-family: var(--font-serif); font-size: 23px; color: var(--color-charcoal); }
.vi-hr { height: 1px; background: rgba(43,38,34,0.12); margin: 30px 0 30px 86px; }
.vi-line.center { align-items: center; gap: 22px; }
.vi-hours { display: flex; flex-direction: column; gap: 12px; max-width: 360px; }
.vi-hours .r { display: flex; justify-content: space-between; gap: 24px; }
.vi-hours .r span { font-family: var(--font-serif); font-size: 19px; color: var(--color-charcoal); }
.vi-hours .r span.v { color: var(--color-charcoal-soft); }
.vi-hours .r span.closed { color: var(--color-copper); }
.vi-note { font-family: var(--font-serif); font-style: italic; font-size: 15px; color: var(--color-ash); margin-top: 22px; }
.visit-amen { padding-left: 12px; }
.visit-amen > .vi-lbl { margin-bottom: 34px; }
.amen-list { display: flex; flex-direction: column; gap: 30px; }
.amen { display: flex; gap: 24px; align-items: flex-start; }
.amen .ti { font-family: var(--font-sans); font-size: 14px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; color: var(--color-charcoal); margin-bottom: 8px; }
.amen .ds { font-family: var(--font-sans); font-size: 15px; line-height: 1.6; color: var(--color-charcoal-soft); max-width: 320px; }

.visit-map { position: relative; height: 240px; background: #E4DAC8; overflow: hidden; }
.visit-map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.visit-map .pin { position: absolute; left: 50%; top: 46%; transform: translate(-50%, -100%); filter: drop-shadow(0 6px 10px rgba(46,30,20,0.25)); }

.visit-contact { position: relative; background: var(--color-plaster); padding: 80px 0 84px; overflow: hidden; }
.visit-contact .illus { position: absolute; left: -44px; bottom: -56px; width: 320px; height: auto; pointer-events: none; opacity: 0.5; mix-blend-mode: multiply;
  -webkit-mask-image: radial-gradient(ellipse 68% 68% at 44% 48%, #000 46%, transparent 80%);
  mask-image: radial-gradient(ellipse 68% 68% at 44% 48%, #000 46%, transparent 80%); }
.visit-contact .in { position: relative; max-width: var(--container-max); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: 0.82fr 1.18fr; gap: 72px; align-items: start; }
.visit-contact .intro h2 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(34px,4vw,46px); line-height: 1.06; letter-spacing: -0.01em; color: var(--color-charcoal); margin: 0; }
.visit-contact .intro h2 em { font-style: italic; color: var(--color-copper); }
.visit-contact .intro .mini { display: flex; align-items: center; gap: 9px; margin: 18px 0 22px; }
.visit-contact .intro .mini i { width: 38px; height: 1.5px; background: var(--color-copper); }
.visit-contact .intro .mini b { width: 6px; height: 6px; background: var(--color-copper); transform: rotate(45deg); }
.visit-contact .intro p { font-family: var(--font-sans); font-size: 15px; line-height: 1.7; color: var(--color-charcoal-soft); margin: 26px 0 0; max-width: 320px; }
.visit-form { display: flex; flex-direction: column; gap: 20px; }
.visit-form .two { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.visit-form input, .visit-form textarea { font-family: var(--font-serif); font-size: 18px; color: var(--color-charcoal); background: var(--color-bone); border: 1px solid rgba(43,38,34,0.14); border-radius: 8px; padding: 17px 20px; outline: none; transition: border-color 200ms ease, box-shadow 200ms ease; width: 100%; }
.visit-form textarea { resize: vertical; min-height: 132px; }
.visit-form input:focus, .visit-form textarea:focus { border-color: var(--color-copper); box-shadow: 0 0 0 3px rgba(165,87,47,0.1); }
.visit-form button { justify-content: center; width: 100%; padding: 20px; letter-spacing: 0.16em; font-size: 14px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .menu-grid > .menu-card { flex-basis: calc(50% - 12px); }
  .home-services .grid { grid-template-columns: repeat(2, 1fr); }
  .story-values .grid { grid-template-columns: repeat(2, 1fr); gap: 40px 0; }
  .value:nth-child(3) { border-left: none; }
}

@media (max-width: 960px) {
  :root { --gutter: 24px; }
  .e2-nav-links, .e2-nav-right { display: none; }
  .e2-nav-burger { display: inline-flex; }
  .e2-nav { grid-template-columns: 1fr auto; }
  .home-hero .photo .s1 { background: linear-gradient(180deg, rgba(43,38,34,0.5) 0%, rgba(43,38,34,0.28) 40%, rgba(43,38,34,0.4) 70%, rgba(43,38,34,0.7) 100%); }
  .home-contact .panel { grid-template-columns: 1fr; }
  .home-contact .right { min-height: 280px; }
  .visit-info .in { grid-template-columns: 1fr; gap: 48px; }
  .visit-info .divider { display: none; }
  .visit-contact .in { grid-template-columns: 1fr; gap: 40px; }
  .story-row, .story-row.flip { grid-template-columns: 1fr; gap: 28px; }
  .story-row.flip .img { order: 0; }
  .story-row .img { height: 260px; }
  .revs .grid { grid-template-columns: repeat(2, 1fr); }
  .rev-mq { width: 320px; }
  .menu-notes .box { grid-template-columns: 1fr; gap: 24px; }
  .menu-notes .col2 { border-left: none; padding-left: 0; border-top: 1px solid rgba(43,38,34,0.10); padding-top: 24px; }
  .menu-sauces .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 680px) {
  :root { --gutter: 20px; }
  .home-services .grid { grid-template-columns: 1fr; }
  .home-contact .info { grid-template-columns: 1fr; }
  .menu-grid > .menu-card { flex-basis: 100%; }
  .menu-list .grid { grid-template-columns: 1fr; }
  .revs .grid { grid-template-columns: 1fr; }
  .story-values .grid { grid-template-columns: 1fr; }
  .value + .value { border-left: none; }
  .menu-sauces .grid { grid-template-columns: repeat(2, 1fr); }
  .home-hero-copy .cta-row .e2-btn, .e2-hero-copy .cta-row .e2-btn { font-size: 12px; padding: 15px 22px; }
  .e2-nav-logo .lg { height: 50px; }
  .e2-foot .brand .lg { height: 42px; }
  .scroll-badge { width: 94px; height: 94px; }
  .dish-card { width: 200px; height: 300px; }
  .rev-card { width: 300px; }
  .e2-foot { padding: 38px var(--gutter) 30px; text-align: center; }
  .e2-foot-row { flex-direction: column; align-items: center; gap: 20px; }
  .e2-foot .vr { display: none; }
  .e2-foot .spacer { display: none; }
  .e2-foot .cell { justify-content: center; }
  .e2-foot .social { display: flex; flex-direction: column; align-items: center; }
  .e2-foot .social .lbl { margin-bottom: 12px; }
  .e2-foot .social .row { justify-content: center; }
  .e2-foot-bottom { flex-direction: column; justify-content: center; text-align: center; gap: 14px; margin-top: 8px; }
  .e2-foot-bottom .links { justify-content: center; }
}

/* ============================================================
   ORDER ONLINE PAGE
   ============================================================ */
.oo-choices { background: var(--color-plaster); padding: 52px 0 12px; }
.oo-choices .grid { max-width: 980px; margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.oo-card { background: var(--color-bone); border: 1px solid rgba(46,30,20,0.08); border-radius: 24px; padding: 42px 40px 40px; display: flex; flex-direction: column; align-items: center; text-align: center; box-shadow: var(--shadow-md); transition: transform 240ms var(--ease-standard), box-shadow 240ms var(--ease-standard); }
.oo-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.oo-card .circ { width: 204px; height: 204px; border-radius: 50%; overflow: hidden; margin-bottom: 30px; background: var(--color-parchment) center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(46,30,20,0.06); }
.oo-card .circ video { width: 100%; height: 100%; object-fit: cover; display: block; }
.oo-card .lbl { font-family: 'Bebas Neue', var(--font-sans); font-size: 34px; letter-spacing: 0.08em; color: var(--color-copper); line-height: 1; margin-bottom: 12px; }
.oo-card p { font-family: var(--font-sans); font-size: 16px; line-height: 1.55; color: var(--color-charcoal-soft); margin: 0 0 30px; }
.oo-card .cta { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 11px; font-family: var(--font-sans); font-size: 14px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; color: var(--color-bone); background: var(--color-copper); border-radius: 8px; padding: 18px 24px; text-decoration: none; transition: background 220ms var(--ease-standard); }
.oo-card .cta:hover { background: var(--color-copper-deep); color: var(--color-bone); }
.oo-card .cta-alt { margin-top: 12px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-copper); text-decoration: none; }
.oo-card .cta-alt:hover { color: var(--color-copper-deep); text-decoration: underline; }

.oo-gridhead { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 56px 0 34px; }
.oo-gridhead span { width: 48px; height: 1px; background: rgba(165,87,47,0.4); }
.oo-gridhead .t { font-family: 'Bebas Neue', var(--font-sans); font-size: 22px; letter-spacing: 0.18em; color: #8A4824; line-height: 1; }
.oo-foodgrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; width: 100%; }
.oo-tile { position: relative; aspect-ratio: 4/5; overflow: hidden; background: var(--color-oak); }
.oo-tile .img { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 600ms var(--ease-standard); }
.oo-tile:hover .img { transform: scale(1.05); }
.oo-tile .cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 16px 14px; font-family: 'Bebas Neue', var(--font-sans); font-size: 17px; letter-spacing: 0.1em; color: var(--color-bone); text-shadow: 0 1px 4px rgba(28,24,21,0.55); background: linear-gradient(180deg, rgba(43,38,34,0) 0%, rgba(43,38,34,0.78) 100%); opacity: 1; }

/* ============================================================
   RESERVATION PAGE
   ============================================================ */
.rsv2 { background: var(--color-plaster); padding: 64px var(--gutter) 96px; }
.rsv2-card { max-width: 720px; margin: 0 auto; background: var(--color-bone); border: 1px solid rgba(43,38,34,0.08); border-radius: 24px; box-shadow: var(--shadow-lg); padding: 48px 48px 40px; }
.rsv2-card .kicker { text-align: center; font-size: 11px; font-weight: 700; letter-spacing: 0.28em; text-transform: uppercase; color: var(--color-copper); margin-bottom: 12px; }
.rsv2-card h2 { text-align: center; font-family: var(--font-serif); font-weight: 400; font-size: clamp(30px,4vw,46px); line-height: 1.05; color: var(--color-charcoal); margin: 0 0 12px; }
.rsv2-card h2 em { font-style: italic; color: var(--color-copper); }
.rsv2-card .lede { text-align: center; font-family: var(--font-serif); font-style: italic; font-size: 17px; line-height: 1.5; color: var(--color-charcoal-soft); margin: 0 auto 32px; max-width: 44ch; }
.rsv2-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 16px; position: relative; }
.rsv2-form .field { display: flex; flex-direction: column; gap: 8px; }
.rsv2-form .field--full { grid-column: 1 / -1; }
.rsv2-form label { font-size: 10px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-ash); }
.rsv2-form input, .rsv2-form select, .rsv2-form textarea { font-family: var(--font-serif); font-size: 16px; color: var(--color-charcoal); background: var(--color-parchment); border: 1px solid rgba(43,38,34,0.14); border-radius: 10px; padding: 13px 16px; width: 100%; box-sizing: border-box; transition: border-color 200ms ease, box-shadow 200ms ease; }
.rsv2-form input::placeholder, .rsv2-form textarea::placeholder { color: var(--color-ash); opacity: 0.7; }
.rsv2-form input:focus, .rsv2-form select:focus, .rsv2-form textarea:focus { outline: none; border-color: var(--color-copper); box-shadow: 0 0 0 3px rgba(165,87,47,0.1); }
.rsv2-form textarea { resize: vertical; min-height: 88px; }
.rsv2-form select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 L6 6.5 L11 1.5' stroke='%23A5572F' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; cursor: pointer; }
.rsv2-form .submit-row { grid-column: 1 / -1; margin-top: 8px; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; justify-content: center; }
.rsv2-form .submit-row .or { font-family: var(--font-serif); font-style: italic; color: var(--color-ash); }
.rsv2-form .submit-row a { font-family: var(--font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-copper); }
.rsv2 .footnote { text-align: center; font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-ash); margin-top: 28px; }
.rsv2-form .hp { position: absolute; left: -9999px; opacity: 0; pointer-events: none; }
.rsv2-thanks { text-align: center; padding: 16px 0; }
.rsv2-thanks .check { width: 64px; height: 64px; border-radius: 50%; background: var(--color-copper); color: var(--color-bone); display: inline-flex; align-items: center; justify-content: center; font-size: 28px; margin-bottom: 20px; }
.rsv2-thanks h3 { font-family: var(--font-serif); font-weight: 400; font-size: clamp(28px,3.4vw,40px); color: var(--color-charcoal); margin: 0 0 12px; }
.rsv2-thanks p { font-family: var(--font-serif); font-style: italic; font-size: 17px; line-height: 1.55; color: var(--color-charcoal-soft); margin: 0 auto 24px; max-width: 44ch; }

@media (max-width: 900px) {
  .oo-extras { grid-template-columns: 1fr !important; gap: 32px !important; }
}
@media (max-width: 680px) {
  .oo-choices .grid { grid-template-columns: 1fr; }
  .oo-foodgrid { grid-template-columns: repeat(2, 1fr); }
  .oo-foodgrid .oo-tile:last-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
  .rsv2-form { grid-template-columns: 1fr; }
  .rsv2-card { padding: 36px 26px 32px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}