/* ============================================================
   MEANTIME — Shared Stylesheet
   Design system: dark/gold, Playfair Display + DM Sans + Libre Baskerville
   ============================================================ */

/* Fonts are loaded from each page head via <link rel="preconnect"> + <link rel="stylesheet">, so the browser discovers them earlier than a CSS-level import would allow. */

/* ─── TOKENS ──────────────────────────────────────────────── */
:root {
  --bg:          #0e0e0e;
  --surface:     #161616;
  --surface-hi:  #1e1e1e;
  --gold:        #c9a96e;
  --gold-dim:    #a08350;
  --cream:       #f5f0e8;
  --muted:       #a19b94;
  --ember:       #d4622b;
  --safe-green:  #4a6b4a;
  --wine:        #7a2e3a;
  --border:      rgba(201,169,110,0.15);
  --border-bright: rgba(201,169,110,0.35);
  --max-w:       960px;
  --nav-h:       72px;
}

/* ─── VENUE (set on <html> before first paint; venue.js keeps it in sync) ── */
html[data-active-venue="hamilton"] [data-venue="entrance"],
html[data-active-venue="entrance"] [data-venue="hamilton"] { display: none !important; }
/* Entrance visitors get their homepage hero from CSS before first paint, so the
   Hamilton hero in the inline style is never fetched for them. */
html[data-active-venue="entrance"] .hero.hero-bg { background-image: url('images/entrance-outdoor-hero.jpg') !important; }

/* ─── RESET ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--cream);
  font-family: 'DM Sans', sans-serif;
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; } /* height:auto so width/height attributes only inform aspect-ratio */
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ─── TYPOGRAPHY ──────────────────────────────────────────── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 400;
  line-height: 1.2;
  color: var(--cream);
}

h1 { font-size: clamp(2.4rem, 5vw, 4.5rem); }
h2 { font-size: clamp(1.8rem, 3.5vw, 3rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.6rem); }

p { color: var(--cream); opacity: 0.88; }

.section-label {
  display: block;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.2rem;
}

.pull-quote {
  font-family: 'Libre Baskerville', serif;
  font-style: italic;
  font-size: clamp(1.3rem, 2.5vw, 2rem);
  color: var(--gold);
  line-height: 1.5;
}

/* ─── LAYOUT ──────────────────────────────────────────────── */
.container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 1.5rem;
}

section {
  padding: 5rem 0;
}

/* ─── DIVIDER ─────────────────────────────────────────────── */
.divider {
  width: 60px;
  height: 1px;
  background: var(--gold-dim);
  opacity: 0.4;
  margin: 0 auto 4rem;
  border: none;
}

/* ─── NAV ─────────────────────────────────────────────────── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: var(--nav-h);
  background: var(--bg);
  display: flex;
  align-items: center;
  transition: border-bottom 0.3s;
}

.nav.scrolled {
  border-bottom: 1px solid var(--border);
}

.nav__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 1.5rem;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav__logo {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--cream);
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

.nav__logo-img {
  height: 32px;
  width: auto;
  display: block;
  object-fit: contain;
}

@media (max-width: 768px) {
  .nav__logo-img {
    height: 26px;
  }
}

.nav__voucher {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold) !important;
  border: 1px solid rgba(201,169,110,0.3);
  border-radius: 20px;
  padding: 0.25rem 0.7rem;
}

.nav__book {
  background: var(--gold);
  color: #0e0e0e !important;
  border-radius: 2rem;
  padding: 0.5rem 1.2rem;
  font-weight: 500;
  font-size: 0.82rem;
  white-space: nowrap;
  transition: opacity 0.2s;
}

.nav__book:hover { opacity: 0.85; }

.nav__links {
  display: flex;
  align-items: center;
  gap: 1.4rem;
}

.nav__links a {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--cream);
  opacity: 0.8;
  transition: opacity 0.2s, color 0.2s;
  white-space: nowrap;
}

.nav__links a:hover { opacity: 1; color: var(--gold); }

.nav__links .btn-nav {
  opacity: 1;
  padding: 0.45rem 1.2rem;
  border: 1px solid var(--gold);
  border-radius: 2rem;
  color: var(--gold);
  font-size: 0.85rem;
  font-weight: 500;
  transition: background 0.2s, color 0.2s;
}

.nav__links .btn-nav:hover {
  background: var(--gold);
  color: var(--bg);
}

/* Hamburger */
.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
  background: none;
  border: none;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 1.5px;
  background: var(--cream);
  transition: transform 0.3s, opacity 0.3s;
}

/* Mobile Drawer */
.nav__drawer {
  display: none;
  position: fixed;
  top: var(--nav-h);
  right: 0;
  bottom: 0;
  width: min(320px, 85vw);
  background: var(--surface);
  border-left: 1px solid var(--border);
  padding: 2.5rem 2rem;
  flex-direction: column;
  gap: 1.5rem;
  z-index: 999;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.nav__drawer.open {
  transform: translateX(0);
}

.nav__drawer a {
  font-size: 1rem;
  color: var(--cream);
  opacity: 0.85;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
  transition: color 0.2s;
}

.nav__drawer a:hover { color: var(--gold); opacity: 1; }
.nav__drawer a:last-child { border-bottom: none; }

/* ─── VENUE GATE ─────────────────────────────────────────── */
.venue-gate {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.92);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

.venue-gate.is-open {
  display: flex;
}

.venue-gate__inner {
  background: #161616;
  border: 1px solid rgba(201,169,110,0.2);
  border-radius: 16px;
  padding: 2.5rem 2rem;
  text-align: center;
  max-width: 480px;
  width: 100%;
}

.venue-gate__logo {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  color: #f5f0e8;
  margin-bottom: 0.3rem;
}

.venue-gate__logo-img {
  height: 44px;
  width: auto;
  display: block;
  margin: 0 auto;
  object-fit: contain;
}

.venue-gate__sub {
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #8a8580;
  margin-bottom: 2rem;
  text-wrap: balance;
}

.venue-gate__question {
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: #a08350;
  font-weight: 500;
  margin-bottom: 1.2rem;
}

.venue-gate__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.venue-gate__card {
  background: #0e0e0e;
  border: 1px solid rgba(201,169,110,0.15);
  border-radius: 12px;
  padding: 1.25rem 1rem;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.2s ease;
  width: 100%;
}

.venue-gate__card:hover {
  border-color: rgba(201,169,110,0.5);
}

.venue-gate__card.is-selected {
  border-color: #c9a96e;
  border-width: 2px;
}

.venue-gate__card-icon {
  width: 28px;
  height: 28px;
  background: rgba(201,169,110,0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.75rem;
}

.venue-gate__card-icon svg {
  width: 13px;
  height: 13px;
  stroke: #c9a96e;
}

.venue-gate__card-name {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  color: #f5f0e8;
  margin-bottom: 0.2rem;
}

.venue-gate__card-loc {
  font-size: 0.75rem;
  color: #8a8580;
  margin-bottom: 0.6rem;
}

.venue-gate__card-tag {
  display: inline-block;
  font-size: 0.65rem;
  padding: 2px 8px;
  border-radius: 20px;
  background: rgba(74,107,74,0.2);
  color: #7ab87a;
  letter-spacing: 0.03em;
}

.venue-gate__confirm {
  width: 100%;
  background: #c9a96e;
  color: #0e0e0e;
  border: none;
  border-radius: 30px;
  padding: 0.9rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.venue-gate__confirm:hover {
  opacity: 0.88;
}

.venue-gate__note {
  font-size: 0.7rem;
  color: #8a8580;
  margin-top: 0.75rem;
}

@media (max-width: 540px) {
  .venue-gate__cards {
    grid-template-columns: 1fr;
  }
  .venue-gate__card {
    display: flex;
    flex-wrap: wrap;            /* icon + name + tag on one row; address drops below */
    align-items: center;
    gap: 0.35rem 1rem;
    padding: 1rem 1.25rem;
  }
  .venue-gate__card-icon {
    flex-shrink: 0;
    margin-bottom: 0;
  }
  .venue-gate__card-name {
    font-size: 1rem;
    margin-bottom: 0;
    flex: 1 1 auto;
  }
  .venue-gate__card-tag {
    margin-left: auto;
  }
  .venue-gate__card-loc {
    flex-basis: 100%;
    order: 4;
    margin: 0 0 0 calc(28px + 1rem); /* align under the name, clear of the icon */
  }
}

/* ─── VENUE INDICATOR BAR ────────────────────────────────── */
.venue-indicator {
  margin-top: var(--nav-h);
  background: #111;
  border-bottom: 1px solid rgba(201,169,110,0.08);
  padding: 0.55rem 1.5rem;
}

.venue-indicator__inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 0;
}

.venue-indicator__active {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.venue-indicator__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c9a96e;
  flex-shrink: 0;
}

.venue-indicator__name {
  font-size: 0.78rem;
  color: #c9a96e;
  font-weight: 500;
}

.venue-indicator__sep {
  width: 1px;
  height: 13px;
  background: rgba(201,169,110,0.2);
  margin: 0 0.9rem;
}

.venue-indicator__switch {
  background: none;
  border: none;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.75rem;
  color: #8a8580;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  padding: 0;
  transition: color 0.2s ease;
}

.venue-indicator__switch:hover {
  color: #c9a96e;
}

/* ─── PROMO BAR ───────────────────────────────────────────── */
.promo-bar {
  background: rgba(201,169,110,0.08);
  border-bottom: 1px solid var(--border);
  text-align: center;
  padding: 0.75rem 1.5rem;
  font-size: 0.85rem;
  font-weight: 400;
  color: var(--gold);
  letter-spacing: 0.01em;
}

.promo-bar a {
  color: var(--gold);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ─── BUTTONS ─────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 2rem;
  border-radius: 2rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.9rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: all 0.25s ease;
  border: 1px solid var(--gold);
  color: var(--gold);
  background: transparent;
}

.btn:hover {
  background: var(--gold);
  color: var(--bg);
}

.btn--primary {
  background: var(--gold);
  color: var(--bg);
}

.btn--primary:hover {
  background: transparent;
  color: var(--gold);
}

.btn--sm {
  padding: 0.5rem 1.4rem;
  font-size: 0.82rem;
}

/* ─── CARDS ───────────────────────────────────────────────── */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2rem;
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.card:hover {
  transform: translateY(-2px);
  border-color: var(--border-bright);
}

/* ─── REVIEW CARDS ────────────────────────────────────────── */
.review-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.review-card:hover {
  transform: translateY(-2px);
  border-color: var(--border-bright);
}

.review-card__quote-mark {
  font-family: 'Playfair Display', serif;
  font-size: 3rem;
  color: var(--gold);
  line-height: 0.5;
  opacity: 0.6;
}

.review-card__text {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--cream);
}

.review-card__stars {
  color: var(--gold);
  font-size: 0.9rem;
  letter-spacing: 0.1em;
}

.review-card__attribution {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--gold);
  letter-spacing: 0.03em;
}

/* ─── HERO ────────────────────────────────────────────────── */
.hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(201,169,110,0.06) 0%, transparent 70%);
  pointer-events: none;
}

/* ─── HERO BACKGROUND IMAGE ─────────────────────────────── */
.hero-bg {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.hero-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(14,14,14,0.55) 0%, rgba(14,14,14,0.2) 40%, rgba(14,14,14,0.8) 100%);
  z-index: 0;
}
.hero-bg > * { position: relative; z-index: 1; }
.hero-bg .hero__inner { position: relative; z-index: 1; }

.hero__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 5rem 1.5rem;
  text-align: center;
}

.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1.2rem;
  border: 1px solid var(--gold);
  border-radius: 2rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--gold);
  margin-bottom: 2rem;
  letter-spacing: 0.02em;
}

.hero h1 {
  margin-bottom: 1.5rem;
}

.hero__sub {
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  color: var(--cream);
  opacity: 0.75;
  max-width: 600px;
  margin: 0 auto 2.5rem;
  font-weight: 300;
}

.hero__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

/* Page hero (non-full-height) */
.page-hero {
  padding: 5rem 0;
  text-align: center;
}

.page-hero h1 { margin-bottom: 1.2rem; }

.page-hero__sub {
  font-size: 1.1rem;
  color: var(--cream);
  opacity: 0.75;
  max-width: 580px;
  margin: 0 auto;
}

/* ─── GRID LAYOUTS ────────────────────────────────────────── */
.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.grid-4 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

/* ─── SECTION HEADING LAYOUT ──────────────────────────────── */
.section-head {
  text-align: center;
  margin-bottom: 3.5rem;
}

.section-head h2 { margin-bottom: 1rem; }
.section-head p {
  max-width: 560px;
  margin: 0 auto;
  opacity: 0.75;
}

/* ─── FUNCTION SPACE CARD ─────────────────────────────────── */
.space-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 12px;
  padding: 2.5rem;
  transition: transform 0.25s, border-color 0.25s;
}

.space-card:hover {
  transform: translateY(-2px);
  border-color: var(--border-bright);
  border-left-color: var(--gold);
}

.space-card h3 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: var(--gold);
}

.space-card__detail {
  display: flex;
  gap: 0.75rem;
  margin-bottom: 0.6rem;
  font-size: 0.9rem;
}

.space-card__detail-label {
  color: var(--muted);
  min-width: 160px;
  font-size: 0.82rem;
  letter-spacing: 0.02em;
}

.space-card__detail-value {
  color: var(--cream);
  font-weight: 400;
}

.space-card__features {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.feature-pill {
  padding: 0.3rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: 2rem;
  font-size: 0.78rem;
  color: var(--muted);
  background: var(--surface-hi);
}

/* ─── PATH CARDS ──────────────────────────────────────────── */
.path-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: transform 0.25s, border-color 0.25s;
}

.path-card:hover { transform: translateY(-2px); border-color: var(--border-bright); }

.path-card__icon {
  width: 40px;
  height: 40px;
  color: var(--gold);
}

.path-card h3 {
  font-size: 1.4rem;
  color: var(--cream);
}

.path-card p { opacity: 0.7; font-size: 0.9rem; }

.path-card__link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--gold);
  font-size: 0.85rem;
  font-weight: 500;
  transition: gap 0.2s;
}

.path-card__link:hover { gap: 0.7rem; }

/* ─── LOCATION CARD ───────────────────────────────────────── */
.location-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.location-card h3 {
  font-size: 1.4rem;
  color: var(--gold);
  margin-bottom: 0.5rem;
}

.location-card__sub {
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 1rem;
}

.location-card__row {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  font-size: 0.9rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--border);
}

.location-card__row:last-of-type { border-bottom: none; }

.location-card__row-label {
  color: var(--muted);
  min-width: 80px;
  font-size: 0.8rem;
  padding-top: 0.1rem;
}

.location-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

/* ─── STEPS ───────────────────────────────────────────────── */
/* Hamilton 3-column steps */
.steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.step {
  text-align: center;
  padding: 2rem;
}

.step__number {
  width: 48px;
  height: 48px;
  border: 1px solid var(--gold);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem;
  color: var(--gold);
  margin: 0 auto 1.5rem;
}

.step h3 { font-size: 1.1rem; margin-bottom: 0.5rem; }
.step p { font-size: 0.9rem; opacity: 0.7; }

/* Entrance vertical steps */
.steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 640px;
}

.steps .step {
  display: flex;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid rgba(201,169,110,0.08);
  text-align: left;
}

.steps .step:last-child { border-bottom: none; }

.step__num {
  font-family: 'Playfair Display', serif;
  font-size: 1.8rem;
  color: rgba(201,169,110,0.25);
  flex-shrink: 0;
  width: 2rem;
  line-height: 1;
  margin-top: 0.2rem;
}

.step__content h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.05rem;
  color: var(--cream);
  margin-bottom: 0.4rem;
}

.step__content p {
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.6;
}

/* ─── FEATURE LIST ────────────────────────────────────────── */
.feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.feature-list li {
  padding: 0.5rem 0 0.5rem 1.2rem;
  border-bottom: 1px solid rgba(201,169,110,0.08);
  font-size: 0.88rem;
  color: var(--muted);
  position: relative;
}

.feature-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold-dim);
}

.feature-list li:last-child { border-bottom: none; }

/* ─── FEATURE CARD ────────────────────────────────────────── */
.feature-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2rem;
}

.feature-card h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem;
  color: var(--cream);
  margin-bottom: 1rem;
}

/* ─── INFO CARDS ──────────────────────────────────────────── */
.info-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.5rem;
}

.info-card__label {
  font-size: 0.62rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--gold-dim);
  margin-bottom: 0.5rem;
}

.info-card__value {
  font-size: 0.95rem;
  color: var(--cream);
  line-height: 1.4;
}

/* ─── FAQ ─────────────────────────────────────────────────── */
.faq-list {
  max-width: 680px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.faq-item {
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(201,169,110,0.08);
}

.faq-item:last-child { border-bottom: none; }

.faq-q {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  color: var(--cream);
  margin-bottom: 0.5rem;
}

.faq-a {
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.65;
}

/* (legacy feature-item — kept for compatibility) */
.feature-item {
  display: flex;
  gap: 1.2rem;
  align-items: flex-start;
}

.feature-item__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  margin-top: 0.55rem;
}

.feature-item h4 {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 0.35rem;
}

.feature-item p { font-size: 0.88rem; opacity: 0.7; }

/* ─── MENU / PRICE LIST ───────────────────────────────────── */
.menu-section { margin-bottom: 3.5rem; }

.menu-section h3 {
  font-size: 1.1rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  margin-bottom: 1.2rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid var(--border);
}

.menu-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 0.65rem 0;
  border-bottom: 1px solid rgba(201,169,110,0.06);
  gap: 1rem;
}

.menu-item:last-child { border-bottom: none; }

.menu-item__name {
  font-size: 0.95rem;
  color: var(--cream);
  font-weight: 400;
}

.menu-item__desc {
  font-size: 0.8rem;
  color: var(--muted);
  margin-top: 0.15rem;
}

.menu-item__price {
  font-size: 0.9rem;
  color: var(--gold);
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
}

.menu-item__price--glass-bottle {
  font-size: 0.8rem;
  color: var(--muted);
  display: flex;
  gap: 0.75rem;
}

.menu-item__price--glass-bottle span { color: var(--gold); font-weight: 500; }

.badge-ngf {
  display: inline-block;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  padding: 0.15rem 0.5rem;
  border: 1px solid rgba(212,98,43,0.5);
  border-radius: 2rem;
  color: var(--ember);
  margin-left: 0.5rem;
  vertical-align: middle;
}

.badge-premium {
  display: inline-block;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  padding: 0.15rem 0.5rem;
  border: 1px solid rgba(201,169,110,0.3);
  border-radius: 2rem;
  color: var(--gold);
  margin-left: 0.5rem;
  vertical-align: middle;
}

/* Two Bays highlight */
.two-bays-group {
  background: rgba(201,169,110,0.04);
  border: 1px solid rgba(201,169,110,0.12);
  border-radius: 8px;
  padding: 1rem 1.2rem;
  margin-bottom: 0.75rem;
}

/* ─── PILLAR CARDS ────────────────────────────────────────── */
.pillar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2.5rem;
  text-align: center;
}

.pillar-card__icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 1.5rem;
  color: var(--gold);
}

.pillar-card h3 { font-size: 1.15rem; margin-bottom: 0.75rem; }
.pillar-card p { font-size: 0.9rem; opacity: 0.72; }

/* ─── PLATTER GRID ────────────────────────────────────────── */
.platter-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

.platter-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.85rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
}

.platter-item__name { color: var(--cream); }
.platter-item__price { color: var(--gold); font-weight: 500; }

/* ─── FULL-BLEED QUOTE SECTION ────────────────────────────── */
.quote-section {
  padding: 6rem 0;
  text-align: center;
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.quote-section .pull-quote {
  max-width: 680px;
  margin: 0 auto 1.5rem;
}

.quote-section__attr {
  font-size: 0.82rem;
  color: var(--muted);
  letter-spacing: 0.04em;
}

/* ─── HERO QUOTE (DRINKS) ─────────────────────────────────── */
.hero-quote {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem 1.5rem;
  text-align: center;
  background: var(--bg);
}

.hero-quote .pull-quote {
  font-size: clamp(2rem, 5vw, 3.5rem);
  max-width: 700px;
  margin: 0 auto 1rem;
}

/* ─── GIFT CARD ───────────────────────────────────────────── */
.gift-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 3rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  transition: transform 0.25s, border-color 0.25s;
}

.gift-card:hover { transform: translateY(-2px); border-color: var(--border-bright); }
.gift-card h3 { font-size: 1.4rem; }
.gift-card p { opacity: 0.7; font-size: 0.9rem; }

/* ─── FOOTER ──────────────────────────────────────────────── */
.footer {
  background: var(--surface);
  border-top: 1px solid var(--border);
  padding: 4rem 0 2.5rem;
}

.footer__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 3rem;
}

.footer__brand { display: flex; flex-direction: column; gap: 0.75rem; }

.footer__address {
  display: block;
  font-size: 0.82rem;
  color: var(--muted);
  opacity: 0.7;
  margin-top: 0.25rem;
  line-height: 1.5;
  transition: color 0.2s;
}
.footer__address:hover { color: var(--gold); opacity: 1; }

.footer__logo {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--cream);
  margin-bottom: 1rem;
}

.footer__logo-img {
  height: 36px;
  width: auto;
  display: block;
  object-fit: contain;
  opacity: 0.9;
}

.footer__tagline {
  font-size: 0.85rem;
  color: var(--muted);
  opacity: 1;
  margin-bottom: 1.5rem;
}

.footer__social {
  display: flex;
  gap: 1rem;
}

.footer__social a {
  width: 36px;
  height: 36px;
  border: 1px solid var(--border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 0.8rem;
  transition: border-color 0.2s, color 0.2s;
}

.footer__social a:hover { border-color: var(--gold); color: var(--gold); }

.footer__col h4 {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 1.2rem;
  font-weight: 500;
}

.footer__col ul { display: flex; flex-direction: column; gap: 0.6rem; }

.footer__col ul li a {
  font-size: 0.88rem;
  color: var(--cream);
  opacity: 0.7;
  transition: opacity 0.2s, color 0.2s;
}

.footer__col ul li a:hover { opacity: 1; color: var(--gold); }

.footer__contact { display: flex; flex-direction: column; gap: 0.5rem; }

.footer__contact a {
  font-size: 0.88rem;
  color: var(--cream);
  opacity: 0.7;
  transition: opacity 0.2s, color 0.2s;
}

.footer__contact a:hover { opacity: 1; color: var(--gold); }

.footer__bottom {
  max-width: var(--max-w);
  margin: 3rem auto 0;
  padding: 1.5rem 1.5rem 0;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.78rem;
  color: var(--muted);
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* ─── ANIMATIONS ──────────────────────────────────────────── */
html.js .fade-up {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

html.js .fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays for children */
.stagger > *:nth-child(1) { transition-delay: 0.05s; }
.stagger > *:nth-child(2) { transition-delay: 0.12s; }
.stagger > *:nth-child(3) { transition-delay: 0.19s; }
.stagger > *:nth-child(4) { transition-delay: 0.26s; }
.stagger > *:nth-child(5) { transition-delay: 0.33s; }
.stagger > *:nth-child(6) { transition-delay: 0.40s; }

/* ─── HORIZONTAL POINTS LIST ──────────────────────────────── */
.points-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

.point {
  padding: 1.5rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.point__title {
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  color: var(--gold);
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.point__title::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
}

.point p { font-size: 0.88rem; opacity: 0.7; }

/* ─── CTA SECTION ─────────────────────────────────────────── */
.cta-section {
  padding: 5rem 0;
  text-align: center;
}

.cta-section h2 { margin-bottom: 1rem; }
.cta-urgency {
  font-size: 0.88rem;
  color: var(--muted);
  margin-bottom: 2rem;
  font-style: italic;
}

/* ─── FOOD DISH CARD ──────────────────────────────────────── */
.dish-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 3rem;
}

.dish-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1.5rem;
  transition: transform 0.25s, border-color 0.25s;
}

.dish-card:hover { transform: translateY(-2px); border-color: var(--border-bright); }

.dish-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  color: var(--cream);
  margin-bottom: 0.4rem;
}

.dish-card__desc { font-size: 0.82rem; color: var(--muted); }

.dish-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.75rem;
  gap: 0.5rem;
}

.dish-card__price {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--gold);
}

.dish-card__badges {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}

.badge-dietary {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.4rem;
  border-radius: 3px;
  border: 1px solid rgba(201,169,110,0.3);
  color: var(--gold);
  background: rgba(201,169,110,0.08);
}

.menu-note {
  font-size: 0.78rem;
  color: var(--muted);
  font-style: italic;
  margin-top: 0.3rem;
}

.sauces-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1.5rem;
}

.sauce-pill {
  font-size: 0.82rem;
  color: var(--muted);
  background: var(--surface-hi);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 0.3rem 0.85rem;
}

/* ─── COELIAC PILLAR ──────────────────────────────────────── */
.coeliac-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

/* ─── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .nav__links { display: none; }
  .nav__hamburger { display: flex; }
  .nav__drawer { display: flex; }

  .grid-2,
  .grid-3,
  .grid-4,
  .steps-grid,
  .platter-grid,
  .points-list,
  .dish-grid,
  .coeliac-pillars {
    grid-template-columns: 1fr;
  }

  .footer__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .hero__inner { padding: 4rem 1.5rem; }

  section { padding: 3.5rem 0; }

  .space-card__detail-label { min-width: 120px; }
}

@media (max-width: 480px) {
  h1 { font-size: 2.2rem; }
  h2 { font-size: 1.7rem; }

  .btn { padding: 0.65rem 1.5rem; font-size: 0.85rem; }

  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { text-align: center; justify-content: center; }

  .card, .review-card, .space-card, .path-card, .location-card {
    padding: 1.5rem;
  }
}

/* ─── REDUCED MOTION ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.js .fade-up { opacity: 1; transform: none; transition: none; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}

/* ─── FOCUS VISIBILITY ────────────────────────────────────── */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

/* ─── VENUE GATE — mobile overflow safety ────────────────── */
/* The card may shrink inside its grid cell, but venue names and tags never break
   mid-word: on narrow screens the row wraps instead (see the 540px block above). */
.venue-gate__card { min-width: 0; }
.venue-gate__card-name,
.venue-gate__card-tag { white-space: nowrap; }
.venue-gate__card-loc { max-width: 100%; }

/* ─── SKIP LINK ───────────────────────────────────────────── */
.skip-link {
  position: absolute; left: 1rem; top: -60px;
  background: var(--gold); color: var(--bg);
  padding: 0.6rem 1.2rem; border-radius: 4px;
  font-family: 'DM Sans', sans-serif; font-size: 0.85rem; font-weight: 500;
  z-index: 10000; transition: top 0.2s ease;
}
.skip-link:focus { top: 1rem; }

/* ─── UTILITY ─────────────────────────────────────────────── */
.text-gold { color: var(--gold); }
.text-muted { color: var(--muted); }
.text-center { text-align: center; }
.mt-1 { margin-top: 1rem; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }
.mb-1 { margin-bottom: 1rem; }
.mb-2 { margin-bottom: 2rem; }
.mb-3 { margin-bottom: 3rem; }

/* ─── FOUNDER SECTION ─────────────────────────────────────── */
.section--founder {
  padding: 5rem 0;
}

.founder-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 3rem;
  position: relative;
  overflow: hidden;
}

.founder-card > .section-label {
  display: block;
  margin-bottom: 2rem;
}

.founder-card::before {
  content: '\201C';
  position: absolute;
  top: 1rem;
  right: 2rem;
  font-family: 'Playfair Display', serif;
  font-size: 9rem;
  line-height: 1;
  color: var(--gold);
  opacity: 0.07;
  pointer-events: none;
}

.founder-inner {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 3rem;
  align-items: start;
}

.founder-name {
  margin: 0 0 0.25rem;
  font-size: 1.8rem;
}

.founder-role {
  color: var(--gold);
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 2rem;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
}

.founder-quote {
  font-family: 'Libre Baskerville', serif;
  font-style: italic;
  color: var(--cream);
  opacity: 0.85;
  line-height: 1.85;
}

.founder-quote p {
  margin: 0 0 1.25rem;
}

.founder-quote p:last-child {
  margin-bottom: 0;
}

.founder-attribution {
  margin-top: 2rem;
  font-size: 0.875rem;
  color: var(--gold);
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.founder-photo-placeholder {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: var(--surface-hi);
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: sticky;
  top: calc(var(--nav-h) + 2rem);
}

.founder-initials {
  font-family: 'Playfair Display', serif;
  font-size: 2.5rem;
  color: var(--gold);
  opacity: 0.5;
  line-height: 1;
}

.founder-photo-note {
  font-size: 0.7rem;
  color: var(--muted);
  margin: 0.5rem 0 0;
  text-align: center;
  font-family: 'DM Sans', sans-serif;
}

/* Real photo — swap in when sally.jpg is available */
.founder-photo {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  border: 1px solid var(--border);
  display: block;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .founder-card {
    padding: 2rem 1.5rem;
  }

  .founder-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .founder-photo-placeholder,
  .founder-photo {
    width: 140px;
    height: 140px;
    margin: 0 auto;
    position: static;
  }
}

/* ─── PLATTER + SPACE-CARD IMAGES (2026-04-30) ──────────────── */
.platter-item {
  display: block;            /* override existing flex */
  padding: 0;                /* override existing 0.85rem 1rem */
  overflow: hidden;
}

.platter-item__img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #0a0a0a;
}

.platter-item__diptych {
  display: grid;
  grid-template-columns: 1fr 1fr;
  aspect-ratio: 4 / 3;
}

.platter-item__diptych img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #0a0a0a;
}

.platter-item__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.85rem 1rem;
  font-size: 0.9rem;
}

.space-card {
  overflow: hidden;          /* clip image to rounded corners */
}

.space-card__image {
  display: block;
  width: calc(100% + 5rem);
  margin: -2.5rem -2.5rem 1.5rem;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #0a0a0a;
}

@media (max-width: 720px) {
  .space-card__image { aspect-ratio: 16 / 10; }
  .platter-item__img,
  .platter-item__diptych { aspect-ratio: 16 / 10; }
}

@media (max-width: 480px) {
  /* match the .space-card padding override (1.5rem) at this breakpoint */
  .space-card__image {
    width: calc(100% + 3rem);
    margin: -1.5rem -1.5rem 1rem;
  }
}

/* ═══ STAGE B ADDITIONS ═══════════════════════════════════════════
   Root chooser, breadcrumbs, persistent mobile actions, hero note.  */

/* Root venue chooser: real links, keyboard operable, no modal */
.chooser { padding: calc(var(--nav-h) + 3.5rem) 1.5rem 4rem; text-align: center; }
.chooser__inner { max-width: var(--max-w); margin: 0 auto; }
.chooser__sub { max-width: 640px; margin: 1rem auto 2.5rem; opacity: 0.85; line-height: 1.7; }
.chooser__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; text-align: left; }
.chooser__card { display: block; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; color: inherit; text-decoration: none; transition: border-color 0.2s ease, transform 0.2s ease; }
.chooser__card:hover, .chooser__card:focus-visible { border-color: var(--gold); transform: translateY(-2px); }
.chooser__card:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.chooser__card.is-remembered { border-color: rgba(201,169,110,0.6); }
.chooser__img { width: 100%; height: 220px; object-fit: cover; display: block; }
.chooser__body { padding: 1.5rem; }
.chooser__eyebrow { display: block; font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); }
.chooser__name { font-size: 1.6rem; margin: 0.4rem 0 0.2rem; }
.chooser__addr { font-size: 0.85rem; color: var(--muted); margin-bottom: 0.6rem; }
.chooser__blurb { font-size: 0.92rem; opacity: 0.85; line-height: 1.6; margin-bottom: 1rem; }
.chooser__hint { display: block; font-size: 0.75rem; color: var(--gold); margin-bottom: 0.75rem; }
.chooser__btn { display: inline-block; }
.chooser__alt { margin-top: 2rem; font-size: 0.9rem; color: var(--muted); }
.chooser__alt a { color: var(--gold); }
@media (max-width: 700px) {
  .chooser { padding-top: calc(var(--nav-h) + 2rem); }
  .chooser__cards { grid-template-columns: 1fr; }
  .chooser__img { height: 180px; }
}

/* Breadcrumbs */
.breadcrumbs { max-width: var(--max-w); margin: 0 auto; padding: 0.75rem 1.5rem 0; font-size: 0.8rem; color: var(--muted); }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; padding: 0; }
.breadcrumbs li + li::before { content: "\203A"; margin-right: 0.4rem; opacity: 0.6; }
.breadcrumbs a { color: var(--muted); }
.breadcrumbs a:hover { color: var(--gold); }

/* Venue indicator switch is now a link, not a button */
a.venue-indicator__switch { text-decoration: underline; text-underline-offset: 3px; }

/* Hero note (seasonal message lives in the hero, not a permanent bar) */
.hero__note { margin-top: 1.25rem; font-size: 0.85rem; color: var(--muted); }
.hero__note a { color: var(--gold); }

/* Persistent mobile actions: one primary matched to page intent, one secondary */
.cta-bar { display: none; }
@media (max-width: 768px) {
  .cta-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: flex; gap: 0.5rem; padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom, 0px)); background: rgba(14,14,14,0.96); border-top: 1px solid var(--border); backdrop-filter: blur(8px); }
  .cta-bar a { flex: 1; min-height: 44px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0.7rem 0.9rem; border-radius: 30px; font-size: 0.9rem; text-decoration: none; }
  .cta-bar__primary { background: var(--gold); color: #0e0e0e; font-weight: 600; }
  .cta-bar__secondary { border: 1px solid var(--border); color: var(--cream); }
  body.is-venue-hamilton, body.is-venue-entrance { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
}

/* ═══ STAGE B FIXES (build review 6 Sep) ════════════════════════ */
/* B02: .hero::before is the 600px gold glow; on hero-bg the same pseudo must be the full-size contrast overlay */
.hero-bg::before { width: auto; height: auto; transform: none; top: 0; left: 0; }
.hero-bg::after  { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 600px; height: 600px; background: radial-gradient(circle, rgba(201,169,110,0.06) 0%, transparent 70%); pointer-events: none; z-index: 0; }
/* B06: a closed drawer is out of the tab order and can scroll when open on short screens */
.nav__drawer:not(.open) { visibility: hidden; }
.nav__drawer { transition: transform 0.3s ease, visibility 0s linear 0.3s; max-height: calc(100vh - var(--nav-h)); overflow-y: auto; -webkit-overflow-scrolling: touch; }
.nav__drawer.open { visibility: visible; transition-delay: 0s; }
/* remembered-venue hint: keep [hidden] semantics */
.chooser__hint[hidden] { display: none; }
/* sticky bar: let long labels wrap without hiding content beneath */
.cta-bar a { white-space: normal; line-height: 1.2; }
@media (max-width: 768px) { body.is-venue-hamilton, body.is-venue-entrance { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); } }
/* reduced motion: decorative hover/focus movement disappears, not just its duration */
@media (prefers-reduced-motion: reduce) {
  .card:hover, .chooser__card:hover, .chooser__card:focus-visible, .path-card:hover, .btn:hover { transform: none !important; }
}

/* First-screen content bypasses the reveal entirely: headings and primary actions are never gated on a script */
html.js .hero .fade-up, html.js .page-hero .fade-up, html.js .chooser .fade-up,
html.js .hero .fade-up.visible, html.js .page-hero .fade-up.visible, html.js .chooser .fade-up.visible { opacity: 1; transform: none; transition: none; }

/* ═══ COMPOSITION PASS (6 Sep) ═══════════════════════════════════ */
/* 1. Hero height: content-driven on phones, capped on desktop */
.hero { min-height: min(100vh, 720px); }
@media (max-width: 768px) {
  .hero { min-height: 0; }
  .hero__inner { padding: 3.25rem 1.5rem 2.75rem; }
  .hero__sub { margin-bottom: 1.75rem; }
}
/* 2. Menu access: shorter page hero on phones, category bar, anchor offset under the fixed nav */
@media (max-width: 768px) { .page-hero { padding: 2.75rem 0 2.25rem; } }
.menu-nav { position: sticky; top: var(--nav-h); z-index: 50; background: rgba(14,14,14,0.96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--border); }
.menu-nav ul { list-style: none; margin: 0; padding: 0.6rem 1rem; display: flex; gap: 0.4rem; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.menu-nav ul::-webkit-scrollbar { display: none; }
.menu-nav a { flex: 0 0 auto; padding: 0.45rem 0.9rem; border: 1px solid var(--border); border-radius: 20px; font-size: 0.8rem; color: var(--cream); text-decoration: none; white-space: nowrap; min-height: 36px; display: inline-flex; align-items: center; }
.menu-nav a:hover, .menu-nav a:focus-visible { border-color: var(--gold); color: var(--gold); }
.menu-nav a[aria-current="true"] { border-color: var(--gold); color: var(--gold); }
.menu-nav__hint { display: block; text-align: center; font-size: 0.7rem; color: var(--muted); padding: 0 1rem 0.4rem; }
h2[id^="cat-"] { scroll-margin-top: calc(var(--nav-h) + var(--menu-nav-h, 64px) + 8px); }
/* 3. One primary action on screen: the sticky bar appears once the in-hero actions have scrolled away.
   Gated only when its controller has initialised (html.cta-gated, set by site.js), so a script failure leaves
   the bar usable. Hidden = moved off-screen AND visibility:hidden, so nothing inside it can take focus. */
html.cta-gated .cta-bar { transform: translateY(110%); visibility: hidden; transition: transform 0.25s ease, visibility 0s linear 0.25s; }
html.cta-gated body.cta-visible .cta-bar { transform: none; visibility: visible; transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) { html.cta-gated .cta-bar { transition: none; } }
/* 4. Compact venue choices on phones: both cards inside the first screen */
@media (max-width: 700px) {
  .chooser { padding-top: calc(var(--nav-h) + 1.5rem); padding-bottom: 2.5rem; }
  .chooser__sub { margin-bottom: 1.5rem; font-size: 0.95rem; }
  .chooser__cards { gap: 0.9rem; }
  .chooser__card { display: grid; grid-template-columns: 108px 1fr; align-items: stretch; }
  .chooser__img { height: 100%; min-height: 120px; aspect-ratio: auto; }
  .chooser__body { padding: 0.85rem 0.95rem; }
  .chooser__eyebrow { font-size: 0.62rem; }
  .chooser__name { font-size: 1.15rem; margin: 0.25rem 0 0.1rem; }
  .chooser__addr { font-size: 0.78rem; margin-bottom: 0.4rem; }
  .chooser__blurb { display: none; }
  .chooser__hint { font-size: 0.7rem; margin-bottom: 0.4rem; }
  .chooser__btn { padding: 0.45rem 0.85rem; font-size: 0.8rem; }
}
/* Sticky bar clearance follows the bar's measured height (set by site.js); 88px is the no-JS reserve */
@media (max-width: 768px) { body.is-venue-hamilton, body.is-venue-entrance { padding-bottom: calc(var(--cta-h, 88px) + 16px + env(safe-area-inset-bottom, 0px)); } }


/* ============================================================================================================
   PORTED PAGE STYLES (Stage B, 6 Sep 2026)
   The live pages carried per-page <style> blocks in their <head>; the port kept only the <body>, which left every
   class below unstyled on staging. Rules are copied from those blocks with these deliberate omissions:
   the functions page's old fixed sticky/mobile bars (Stage B has its own cta-bar), its promo-bar link rule, its
   global focus-visible rule and body padding, and the red "todo" colour (no placeholder may ship). The room-card
   CTA hover used the light text token as a background, which is unreadable on the dark theme; it now uses gold.
   ============================================================================================================ */

/* --- terms / privacy layout (collective-terms.html, privacy.html; identical blocks) --- */
.tc-container {
    max-width: 720px;
    margin: 0 auto;
    padding: 6rem 2rem 4rem;
    color: #e8e4dc;
    font-family: 'DM Sans', sans-serif;
    font-weight: 300;
    line-height: 1.8;
  }
  .tc-container h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(2rem, 4vw, 2.8rem);
    font-weight: 400;
    color: #f5f0e8;
    margin-bottom: 0.5rem;
    text-align: center;
  }
  .tc-updated {
    text-align: center;
    font-size: 0.85rem;
    color: #8a8580;
    font-style: italic;
    margin-bottom: 3rem;
  }
  .tc-container h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c9a96e;
    margin: 2.5rem 0 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(201,169,110,0.15);
  }
  .tc-container p {
    font-size: 0.92rem;
    color: #8a8580;
    margin-bottom: 1rem;
  }
  .tc-container ul {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
  }
  .tc-container li {
    font-size: 0.92rem;
    color: #8a8580;
    padding: 0.35rem 0 0.35rem 1.2rem;
    position: relative;
  }
  .tc-container li::before {
    content: '\2013';
    position: absolute;
    left: 0;
    color: rgba(201,169,110,0.4);
  }
  .tc-container a {
    color: #c9a96e;
    text-decoration: none;
    border-bottom: 1px solid rgba(201,169,110,0.3);
    transition: border-color 0.3s ease;
  }
  .tc-container a:hover {
    border-color: #c9a96e;
  }
  .tc-back {
    text-align: center;
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(201,169,110,0.15);
  }
  .tc-back a {
    font-size: 0.85rem;
    color: #c9a96e;
    text-decoration: none;
    border-bottom: 1px solid rgba(201,169,110,0.3);
  }
  @media (max-width: 600px) {
    .tc-container { padding: 4rem 1.5rem 3rem; }
  }

/* --- Meantime Collective (collective.html) --- */
:root {
    --col-bg: #0e0e0e;
    --col-surface: #161616;
    --col-surface-raised: #1e1e1e;
    --col-gold: #c9a96e;
    --col-gold-dim: #a08350;
    --col-cream: #f5f0e8;
    --col-text: #e8e4dc;
    --col-text-dim: #8a8580;
    --col-border: rgba(201,169,110,0.15);
  }
  .collective-hero { text-align:center; padding:8rem 2rem 5rem; max-width:720px; margin:0 auto; }
  .collective-hero-badge { display:inline-block; font-family:'DM Sans',sans-serif; font-weight:500; font-size:0.65rem; letter-spacing:0.35em; text-transform:uppercase; color:var(--col-gold); border:1px solid var(--col-border); padding:0.45rem 1.4rem; border-radius:2rem; margin-bottom:2.5rem; }
  .collective-hero h1 { font-family:'Playfair Display',serif; font-size:clamp(2.4rem,6vw,3.8rem); font-weight:400; line-height:1.15; color:var(--col-cream); margin-bottom:1.5rem; }
  .collective-hero p { font-size:1.05rem; color:var(--col-text-dim); max-width:540px; margin:0 auto 2.5rem; line-height:1.8; }
  .collective-hero-actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
  .collective-btn { display:inline-block; font-family:'DM Sans',sans-serif; font-size:0.85rem; font-weight:500; letter-spacing:0.05em; text-decoration:none; padding:0.85rem 2rem; border-radius:4px; transition:all 0.3s ease; cursor:pointer; }
  .collective-btn-gold { background:var(--col-gold); color:var(--col-bg); }
  .collective-btn-gold:hover { background:#d4b87a; transform:translateY(-1px); }
  .collective-btn-outline { background:transparent; color:var(--col-gold); border:1px solid var(--col-gold-dim); }
  .collective-btn-outline:hover { border-color:var(--col-gold); background:rgba(201,169,110,0.08); }
  .collective-divider { width:60px; height:1px; background:var(--col-gold-dim); margin:0 auto; opacity:0.4; }
  .collective-section { max-width:800px; margin:0 auto; padding:5rem 2rem; }
  .collective-section-label { font-family:'DM Sans',sans-serif; font-weight:500; font-size:0.6rem; letter-spacing:0.4em; text-transform:uppercase; color:var(--col-gold); margin-bottom:0.8rem; text-align:center; }
  .collective-section h2 { font-family:'Playfair Display',serif; font-size:clamp(1.6rem,3.5vw,2.2rem); font-weight:400; color:var(--col-cream); margin-bottom:2.5rem; text-align:center; line-height:1.25; }
  .collective-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:2rem; margin-top:1rem; }
  .collective-step { text-align:center; padding:1.5rem; }
  .collective-step-number { font-family:'Playfair Display',serif; font-size:2.8rem; color:rgba(201,169,110,0.15); font-weight:700; margin-bottom:0.5rem; line-height:1; }
  .collective-step h3 { font-family:'Playfair Display',serif; font-size:1.1rem; color:var(--col-cream); margin-bottom:0.6rem; font-weight:400; }
  .collective-step p { font-size:0.88rem; color:var(--col-text-dim); line-height:1.6; }

  .collective-rewards-section { background:var(--col-surface); border-top:1px solid var(--col-border); border-bottom:1px solid var(--col-border); }
  .collective-rewards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1px; background:var(--col-border); border:1px solid var(--col-border); border-radius:8px; overflow:hidden; max-width:700px; margin:0 auto; }
  .collective-reward-card { background:var(--col-surface); padding:1.8rem 1.5rem; text-align:center; transition:background 0.3s ease; }
  .collective-reward-card:hover { background:var(--col-surface-raised); }
  .collective-reward-points { font-family:'Playfair Display',serif; font-size:2rem; color:var(--col-gold); margin-bottom:0.3rem; line-height:1; }
  .collective-reward-points span { font-size:0.8rem; color:var(--col-gold-dim); font-family:'DM Sans',sans-serif; letter-spacing:0.1em; }
  .collective-reward-name { font-size:0.9rem; color:var(--col-cream); margin-top:0.5rem; }
  .collective-rewards-note { text-align:center; margin-top:2rem; font-size:0.9rem; color:var(--col-text-dim); font-style:italic; }
  .collective-earn-grid { max-width:520px; margin:0 auto; }
  .collective-earn-row { display:flex; justify-content:space-between; align-items:center; padding:1rem 0; border-bottom:1px solid rgba(255,255,255,0.04); }
  .collective-earn-row:last-child { border-bottom:none; }
  .collective-earn-action { font-size:0.92rem; color:var(--col-text); }
  .collective-earn-points { font-family:'Playfair Display',serif; font-size:1.1rem; color:var(--col-gold); white-space:nowrap; }
  .collective-faq-list { max-width:640px; margin:0 auto; }
  .collective-faq-item { border-bottom:1px solid rgba(255,255,255,0.04); padding:1.5rem 0; }
  .collective-faq-item:last-child { border-bottom:none; }
  .collective-faq-q { font-family:'Playfair Display',serif; font-size:1.05rem; color:var(--col-cream); margin-bottom:0.6rem; font-weight:400; cursor:default; }
  .collective-faq-a { font-size:0.9rem; color:var(--col-text-dim); line-height:1.7; }
  .collective-cta-section { text-align:center; padding:5rem 2rem 6rem; max-width:600px; margin:0 auto; }
  .collective-cta-section h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,4vw,2.4rem); font-weight:400; color:var(--col-cream); margin-bottom:1.5rem; }
  .collective-cta-actions { display:flex; flex-direction:column; align-items:center; gap:1rem; margin-bottom:2rem; }
  .collective-cta-signin { font-size:0.85rem; color:var(--col-text-dim); }
  .collective-cta-signin a { color:var(--col-gold); text-decoration:none; border-bottom:1px solid rgba(201,169,110,0.3); transition:border-color 0.3s ease; }
  .collective-cta-signin a:hover { border-color:var(--col-gold); }
  .collective-cta-date { font-size:0.8rem; color:var(--col-text-dim); letter-spacing:0.1em; margin-top:0.5rem; }
  .collective-pull-quote { text-align:center; padding:3rem 2rem; max-width:600px; margin:0 auto; }
  .collective-pull-quote p { font-family:'Playfair Display',serif; font-style:italic; font-size:1.15rem; color:var(--col-gold); line-height:1.6; }
  @media (max-width:600px) {
    .collective-hero { padding:5rem 1.5rem 3rem; }
    .collective-section { padding:3.5rem 1.5rem; }
    .collective-steps { grid-template-columns:1fr; gap:1rem; }
    .collective-rewards-grid { grid-template-columns:repeat(2,1fr); }
    .collective-hero-actions { flex-direction:column; align-items:center; }
    .collective-btn { width:100%; max-width:280px; text-align:center; }
  }

/* --- menu switch row, vegan-menu button, dietary row (food.html, kids.html, vegan.html, specials.html) --- */
/* Vegan Menu button — gold outline, sits in dietary bar */
  .vegan-menu-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    color: var(--gold, #c9a85a);
    text-decoration: none;
    border: 2px solid var(--gold, #c9a85a);
    padding: 0.45rem 1rem;
    border-radius: 3px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: background 0.2s, color 0.2s;
    line-height: 1;
  }
  .vegan-menu-btn:hover,
  .vegan-menu-btn:focus {
    background: var(--gold, #c9a85a);
    color: #1a1a1a;
    outline: none;
  }
  /* Menu-switch row — own centered line, above the dietary notes */
  .menu-switch-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
  }
  /* Dietary notes row — centering lives here so venue.js can't clobber it */
  .dietary-row { display:flex; flex-wrap:wrap; gap:1.25rem; align-items:center;
    justify-content:center; width:100%; font-size:0.82rem; color:var(--muted); }

/* --- dish cards with a photo (vegan.html, kids.html; specials use portrait 3:4 tiles via .dish-card--portrait) --- */
/* Dish card with photo — used only on vegan page */
  .dish-card--photo {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .dish-card--photo .dish-card__photo {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #1a1a1a;
    margin: -1.25rem -1.25rem 1rem -1.25rem;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
  }
  .dish-card--photo .dish-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
  }
  .dish-card--photo:hover .dish-card__photo img {
    transform: scale(1.04);
  }
  .dish-card--photo.dish-card--portrait .dish-card__photo { aspect-ratio: 3 / 4; }
.specials-note { max-width: 680px; margin: 0 auto; text-align: center; font-size: 0.9rem;
    color: var(--gold, #c9a85a); letter-spacing: 0.02em; }

/* --- Hamilton functions page additions (functions.html) --- */
  .fn-hero-facts{font-family:'DM Sans',sans-serif;font-size:0.75rem;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold);margin:1.25rem auto 0;max-width:720px;line-height:1.9;}
  .fn-hero-facts span{white-space:nowrap;}
  .fn-hero-facts .fn-sep{margin:0 0.6rem;}
  .fx-actions .btn{white-space:normal;text-align:center;justify-content:center;display:inline-flex;align-items:center;gap:0.5rem;}
  .fx-actions .btn svg{width:15px;height:15px;flex:none;}
  .fx-actions .btn span{overflow-wrap:anywhere;}
  @media (max-width:640px){
    .fn-hero-facts span{display:block;}
    .fn-hero-facts .fn-sep{display:none;}
    .fx-actions{flex-direction:column;align-items:stretch;}
    .fx-actions .btn{width:100%;}
  }
  .fx-actions{display:flex;flex-wrap:wrap;gap:0.75rem;align-items:center;justify-content:center;margin-top:1.75rem;}
  .fx-actions--left{justify-content:flex-start;}
  .btn--call{background:transparent;border:1px solid currentColor;}
  .fx-emaillink{display:inline-block;margin-top:0.9rem;font-size:0.9rem;text-decoration:underline;text-underline-offset:3px;}
  .fx-contactline{font-size:0.9rem;margin-top:0.85rem;opacity:0.85;}
  .fx-contactline a{text-decoration:underline;text-underline-offset:3px;}
  .space-card__cta{display:inline-block;margin-top:1.25rem;font-size:0.8rem;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;
    padding:0.75rem 1.25rem;border:1px solid var(--border);border-radius:4px;text-decoration:none;transition:background .2s,color .2s,border-color .2s;}
  .space-card__cta:hover,.space-card__cta:focus-visible{background:var(--gold);color:#0e0e0e;border-color:var(--gold);}
  .fx-faq{max-width:760px;margin:0 auto;}
  .fx-faq details{border-bottom:1px solid var(--border);padding:1.1rem 0;}
  .fx-faq summary{cursor:pointer;font-weight:600;font-size:1rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center;}
  .fx-faq summary::-webkit-details-marker{display:none;}
  .fx-faq summary::after{content:'+';font-size:1.3rem;line-height:1;opacity:0.55;flex:0 0 auto;}
  .fx-faq details[open] summary::after{content:'\2013';}
  .fx-faq p{margin:0.85rem 0 0;font-size:0.95rem;opacity:0.85;}
  .fx-eventtypes{display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:center;margin-top:1.5rem;}
  .fx-eventtypes span{font-size:0.78rem;letter-spacing:0.06em;padding:0.45rem 0.9rem;border:1px solid var(--border);border-radius:100px;opacity:0.85;}

/* --- Paddles & Pals enquiry dialog and hero (paddles-and-pals.html) --- */
.pp-form-open { font: inherit; cursor: pointer; }
    .pp-dialog {
      position: fixed;
      width: min(760px, calc(100vw - 2rem));
      max-height: calc(100vh - 2rem);
      overflow: auto;
      border: 1px solid var(--border, #4a433b);
      border-radius: 8px;
      padding: 2rem;
      background: var(--surface, #211d19);
      color: var(--text, #f6efe6);
      box-shadow: 0 24px 80px rgba(0,0,0,.52);
    }
    .pp-dialog::backdrop { background: rgba(0,0,0,.78); }
    .pp-dialog__close {
      position: absolute;
      top: .75rem;
      right: .9rem;
      border: 0;
      background: transparent;
      color: inherit;
      font-size: 2rem;
      line-height: 1;
      cursor: pointer;
    }
    .pp-dialog__title { margin: .4rem 2.5rem .5rem 0; }
    .pp-dialog__intro { opacity: .75; margin-bottom: 1.5rem; }
    .pp-grid { display: grid; gap: 1rem; }
    .pp-grid--2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .pp-field { display: grid; gap: .45rem; margin-bottom: 1rem; }
    .pp-field > span { font-size: .82rem; font-weight: 600; }
    .pp-field input,
    .pp-field select,
    .pp-field textarea {
      width: 100%;
      box-sizing: border-box;
      border: 1px solid #cfc6ba;
      border-radius: 4px;
      padding: .85rem .9rem;
      font: inherit;
      color: #1a1714;
      background: #fff;
    }
    .pp-field input:focus,
    .pp-field select:focus,
    .pp-field textarea:focus {
      outline: 2px solid var(--gold, #c69b58);
      outline-offset: 1px;
    }
    .pp-field textarea { resize: vertical; }
    .pp-field small { color: var(--muted, #b7aea4); font-size: .75rem; }
    .pp-consent { display: flex; align-items: flex-start; gap: .7rem; margin: .25rem 0 1.25rem; font-size: .82rem; }
    .pp-consent input { margin-top: .2rem; }
    .pp-submit { width: 100%; text-align: center; }
    .pp-submit[disabled] { opacity: .55; cursor: wait; }
    .pp-message { padding: .8rem 1rem; border-radius: 4px; margin-bottom: 1rem; font-size: .84rem; }
    .pp-message--error { background: #fbeaea; color: #8f1c1c; border: 1px solid #e8bcbc; }
    .pp-success { text-align: center; padding: 2rem 0 1rem; }
    .pp-success__reference { margin: 1rem 0 1.5rem; }
    .pp-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
    body.pp-dialog-open { overflow: hidden; }
    @media (max-width: 640px) {
      .pp-dialog { padding: 1.4rem 1rem; }
      .pp-grid--2 { grid-template-columns: 1fr; }
    }

    /* Local hero clone: keeps venue.js from overriding this page's hero images */
    .pp-hero-bg {
      position: relative;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
    }
    .pp-hero-bg::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to bottom, rgba(14,14,14,0.55) 0%, rgba(14,14,14,0.2) 40%, rgba(14,14,14,0.8) 100%);
      z-index: 0;
    }
    .pp-hero-bg > * { position: relative; z-index: 1; }

/* Paddles & Pals: the two booking actions, and their explanatory line */
  .pp-actions{display:flex;flex-wrap:wrap;gap:0.75rem;align-items:center;margin-top:2rem;}
  .pp-actions--center{justify-content:center;}
  .pp-actions--center .pp-smallgroup{text-align:center;}