/* ============================================
   LEGENDS v6 — Brand & Hospitality System
   ============================================
   Curated in what we offer.
   Generous in how we host.
   Disciplined in how we operate.
   Confident in how we communicate.

   Design Legends, not an imagined luxury version of Legends.
   Preserve the principles, not the template.
   ============================================ */

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

:root {
  /* Warm dark ground. The room at night. */
  --ink:        #1a1612;     /* warm near-black, room walls */
  --ink-2:      #221b15;     /* card/section lift */
  --ink-3:      #2a221b;     /* hover state, depth */

  /* The accent dark. Banquette green, used quietly. */
  --moss:       #14231b;     /* deepened banquette, brand-forward */
  --moss-2:     #1c3025;
  --moss-deep:  #0f1a14;     /* darker still, for panel depth */

  /* The light. Cream, parchment. Body copy lives here. */
  --bone:       #ebe2cf;     /* primary text on dark */
  --bone-dim:   #b5a989;
  --bone-faint: rgba(235, 226, 207, 0.55);

  /* Brass for hairlines, marks, captions. Used sparingly. */
  --brass:      #a8895c;
  --brass-glow: #c4a072;

  /* The single CTA color. Used once or twice on a page. */
  --oxblood:    #5e2222;
  --oxblood-2:  #7a3030;

  /* Lines. Always thin, always restrained. */
  --hairline:   rgba(235, 226, 207, 0.12);
  --hairline-strong: rgba(235, 226, 207, 0.28);
  --rule-brass: rgba(168, 137, 92, 0.45);

  /* Type. Cormorant for everything that breathes. Inter only for tiny labels. */
  --serif: 'Cormorant Garamond', 'Garamond', 'Times New Roman', serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Rhythm */
  --max:       1280px;
  --max-text:  720px;
  --gutter:    clamp(20px, 4vw, 56px);
  --section:   clamp(120px, 14vw, 220px);   /* +20% breathing room */

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-glide: cubic-bezier(0.16, 0.84, 0.44, 1);
}

/* ============================================
   v6 CALIBRATION — homepage opt-in via body.v6
   ============================================
   Moderated section rhythm, moderated h1 scale,
   tighter eyebrows, shorter reveals. Legacy pages
   (About, Menu, Membership, Visit, Events, Careers,
   Sundays, event landing pages) remain on v5 defaults
   until migrated in a later phase.
   ============================================ */
body.v6 {
  --section: clamp(80px, 10vw, 160px);
}
body.v6 h1 {
  font-size: clamp(48px, 6.5vw, 88px);
  font-weight: 300;
  line-height: 1.02;
  letter-spacing: -0.015em;
}
body.v6 h1.h1--display {
  font-size: clamp(60px, 9vw, 132px);
  line-height: 0.98;
  letter-spacing: -0.02em;
}
body.v6 .eyebrow {
  letter-spacing: 0.22em;
  margin-bottom: 20px;
}
body.v6 .reveal {
  transition: opacity 0.85s var(--ease-glide), transform 0.85s var(--ease-glide);
}

/* v6 opt-in modifiers — available anywhere, applied only where earned. */
.section--breathing {
  padding: clamp(120px, 14vw, 220px) 0;
}
.accent-italic {
  font-style: italic;
  color: var(--brass-glow);
}

/* ---------- Reset & base ---------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 19px;
  line-height: 1.55;
  color: var(--bone);
  background: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, picture, video { display: block; max-width: 100%; height: auto; }
a { color: var(--bone); text-decoration: none; transition: color .25s var(--ease); }
a:hover { color: var(--brass-glow); }
button { font-family: inherit; cursor: pointer; }

/* ---------- Selection ---------- */
::selection { background: var(--brass); color: var(--ink); }

/* ---------- Reveal animation ---------- */
/* A slow glide upward. Never a bounce. */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 1.4s var(--ease-glide), transform 1.4s var(--ease-glide); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal--delay { transition-delay: 0.15s; }
.reveal--delay-2 { transition-delay: 0.30s; }
.reveal--delay-3 { transition-delay: 0.45s; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}
/* No-JS fallback: reveal never fires without JavaScript, so keep content visible. */
@media (scripting: none) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- Container ---------- */
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.wrap-text { max-width: var(--max-text); margin: 0 auto; padding: 0 var(--gutter); }
section { padding: var(--section) 0; }
section + section { padding-top: 0; }

/* ---------- Typography ---------- */
h1, h2, h3, h4, h5 {
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -0.005em;
  line-height: 1.05;
  margin: 0 0 0.5em;
  color: var(--bone);
}
h1 {
  font-size: clamp(54px, 9vw, 132px);
  font-weight: 300;
  line-height: 0.98;
  letter-spacing: -0.015em;
}
h2 {
  font-size: clamp(40px, 6vw, 80px);
  font-weight: 300;
  letter-spacing: -0.01em;
}
h3 {
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 400;
}
h4 {
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--brass);
  font-family: var(--sans);
}

p { margin: 0 0 1.2em; }
p.lede {
  font-size: clamp(20px, 1.6vw, 26px);
  line-height: 1.5;
  color: var(--bone);
  font-weight: 400;
  max-width: 32ch;
}
p.body {
  font-size: 19px;
  line-height: 1.65;
  color: var(--bone);
  max-width: 60ch;
}

em { font-style: italic; }
strong { font-weight: 500; }

/* ---------- Eyebrow / small caps label ---------- */
.eyebrow {
  display: inline-block;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--brass);
  margin-bottom: 24px;
}

/* ---------- Caption (italic serif under photos) ---------- */
.caption {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  color: var(--bone-dim);
  margin-top: 16px;
  letter-spacing: 0.005em;
}

/* ---------- Hairline rules ---------- */
hr {
  border: 0;
  border-top: 1px solid var(--rule-brass);
  margin: 0;
  width: 60px;
}
hr.full { width: 100%; border-color: var(--hairline); }

/* ---------- Header / Navigation ---------- */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 28px var(--gutter);
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background .4s var(--ease), padding .3s var(--ease);
  background: linear-gradient(to bottom, rgba(26, 22, 18, 0.7), transparent);
}
.site-header.is-scrolled {
  background: rgba(26, 22, 18, 0.94);
  backdrop-filter: blur(12px);
  padding: 18px var(--gutter);
  border-bottom: 1px solid var(--hairline);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--bone);
  text-decoration: none;
}
.brand-logo {
  width: 88px;
  height: 88px;
  object-fit: contain;
  transition: width .3s var(--ease), height .3s var(--ease);
}
.site-header.is-scrolled .brand-logo {
  width: 64px;
  height: 64px;
}
.brand-name { display: none; }

.nav-list {
  display: flex;
  gap: 36px;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
}
.nav-list a {
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bone);
  position: relative;
  padding: 4px 0;
}
.nav-list a:hover, .nav-list a.is-active { color: var(--brass-glow); }
.nav-list a.is-active::after {
  content: "";
  position: absolute;
  left: 50%; right: 50%;
  bottom: -4px;
  border-top: 1px solid var(--brass);
  transform: translateX(-50%);
  width: 18px;
  margin-left: -9px;
}
.nav-cta {
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  border: 1px solid var(--bone);
  color: var(--bone);
  padding: 10px 22px;
  text-decoration: none;
  transition: all .3s var(--ease);
}
.nav-cta:hover { background: var(--bone); color: var(--ink); }

/* Mobile hamburger */
.hamburger {
  display: none;
  background: none;
  border: 0;
  width: 32px;
  height: 32px;
  padding: 0;
}
.hamburger span {
  display: block;
  width: 22px;
  height: 1px;
  background: var(--bone);
  margin: 5px auto;
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.hamburger.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 900px) {
  .nav-list { display: none; }
  .nav-cta  { display: none; }
  .hamburger { display: block; }
  .site-header.is-open .nav-list {
    display: flex;
    position: absolute;
    top: 100%; left: 0; right: 0;
    flex-direction: column;
    padding: 24px var(--gutter) 36px;
    background: var(--ink);
    border-bottom: 1px solid var(--hairline);
    gap: 24px;
  }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: flex-end;
  padding: 0 var(--gutter) clamp(60px, 8vw, 120px);
  overflow: hidden;
}
.hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.hero__media video,
.hero__media img,
.hero__media picture {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: var(--ink);
}

/* Ken Burns — slow cinematic zoom+pan for landscape still heroes. */
@keyframes kenBurns {
  0%   { transform: scale(1.04) translate(0, 0); }
  100% { transform: scale(1.12) translate(-2%, -1.2%); }
}

/* Mobile-first defaults — matched specificity (class.class) with the media
   query below so the correct rule wins on desktop. */
.hero__media video.hero__media--mobile   { display: block; }
.hero__media picture.hero__media--desktop { display: none; }

@media (min-width: 900px) {
  .hero__media video.hero__media--mobile   { display: none; }
  .hero__media picture.hero__media--desktop { display: block; }
  .hero__media picture.hero__media--desktop img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    animation: kenBurns 40s ease-in-out infinite alternate;
    transform-origin: center center;
    will-change: transform;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero__media picture.hero__media--desktop img { animation: none; }
}
.hero__veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(26, 22, 18, 0.4) 0%, rgba(26, 22, 18, 0.15) 35%, rgba(26, 22, 18, 0.85) 100%);
}
.hero__inner { max-width: 900px; }
.hero__inner h1 { margin-bottom: 32px; }
.hero__sub {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(20px, 1.8vw, 26px);
  color: var(--bone);
  max-width: 32ch;
  margin: 0 0 40px;
  line-height: 1.45;
}
.hero__cta { display: flex; gap: 18px; flex-wrap: wrap; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 16px 32px;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .3s var(--ease);
}
.btn-primary {
  background: var(--oxblood);
  color: var(--bone);
  border-color: var(--oxblood);
  box-shadow: 0 0 0 rgba(196, 160, 114, 0);
}
.btn-primary:hover {
  background: var(--oxblood-2);
  border-color: var(--brass-glow);
  color: var(--bone);
  box-shadow: 0 0 24px rgba(196, 160, 114, 0.18);
}
.btn-ghost {
  background: transparent;
  color: var(--bone);
  border-color: var(--bone);
  box-shadow: 0 0 0 rgba(235, 226, 207, 0);
}
.btn-ghost:hover {
  background: var(--bone);
  color: var(--ink);
  box-shadow: 0 0 24px rgba(235, 226, 207, 0.15);
}

.btn-line {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--brass);
  padding: 6px 0;
  border-bottom: 1px solid var(--rule-brass);
  transition: all .3s var(--ease);
}
.btn-line:hover {
  color: var(--brass-glow);
  border-color: var(--brass-glow);
  gap: 16px;
}

/* ---------- Editorial moment (the core layout pattern) ---------- */
.moment {
  display: grid;
  grid-template-columns: 1fr;
  gap: 56px;
  align-items: center;
  padding: clamp(60px, 9vw, 140px) 0;
}
.moment--split {
  grid-template-columns: 1fr 1fr;
  gap: 80px;
}
.moment--split-text-right {
  grid-template-columns: 1.2fr 1fr;
}
.moment--split-text-left {
  grid-template-columns: 1fr 1.2fr;
}
@media (max-width: 900px) {
  .moment--split,
  .moment--split-text-right,
  .moment--split-text-left {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}

/* On mobile, force copy to render before the media (context before video) */
@media (max-width: 900px) {
  .moment--copy-first-mobile .moment__copy  { order: 1; }
  .moment--copy-first-mobile .moment__photo { order: 2; }
}

.moment__copy { max-width: 480px; }
.moment__copy h2 { margin-bottom: 24px; }
.moment__copy p { margin-bottom: 28px; }
.moment__photo figure { margin: 0; }
.moment__photo figcaption {
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-dim);
  margin-top: 14px;
  line-height: 1.4;
}

/* ---------- Full-bleed photo with caption ---------- */
.fullbleed {
  width: 100%;
  margin: 0;
}
.fullbleed img {
  width: 100%;
  height: auto;
  display: block;
}
.fullbleed figcaption {
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-dim);
  margin-top: 14px;
  padding: 0 var(--gutter);
  letter-spacing: 0.01em;
}

/* ---------- Moss accent panel ---------- */
.moss-panel {
  background: var(--moss);
  color: var(--bone);
  position: relative;
}
.moss-panel--deep { background: var(--moss-deep); }

/* ---------- In Residence / This Month ---------- */
.residence {
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
.residence__list {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: var(--max-text);
  margin: 0 auto;
}
.residence__list li {
  display: grid;
  grid-template-columns: 120px 1fr auto;
  gap: 32px;
  padding: 28px 0;
  border-bottom: 1px solid var(--hairline);
  align-items: baseline;
}
.residence__list li:last-child { border-bottom: 0; }
.residence__date {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
}
.residence__title {
  font-family: var(--serif);
  font-size: clamp(22px, 2.2vw, 30px);
  font-weight: 400;
  color: var(--bone);
  margin: 0;
}
.residence__note {
  font-family: var(--serif);
  font-style: italic;
  font-size: 15px;
  color: var(--bone-dim);
  white-space: nowrap;
}
@media (max-width: 720px) {
  .residence__list li {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 22px 0;
  }
  .residence__note { white-space: normal; }
}

/* ---------- An Evening at Legends — editorial spread ---------- */
/* Desktop: masonry column layout. Tablet: 2 columns.
   Mobile: horizontal scroll-snap carousel, curated subset only. */
.evening {
  padding: var(--section) 0;
  background: var(--ink);
}
.evening__head {
  max-width: var(--max-text);
  margin: 0 auto clamp(56px, 7vw, 96px);
  padding: 0 var(--gutter);
  text-align: center;
}

/* --- Mobile: horizontal scroll-snap carousel --- */
.evening__spread {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-padding-left: var(--gutter);
  padding: 0 var(--gutter);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.evening__spread::-webkit-scrollbar { display: none; }
.evening__tile {
  margin: 0;
  overflow: hidden;
  border-radius: 6px;
  background: var(--ink-2);
  /* Fade + rise on scroll (both mobile & desktop) */
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 1.1s var(--ease-glide), transform 1.1s var(--ease-glide);
  will-change: opacity, transform;
  /* Mobile flex-item defaults */
  flex: 0 0 85vw;
  scroll-snap-align: start;
  height: auto;
}
/* On mobile hide non-primary tiles (only "mobile" tiles render in the swipe) */
.evening__tile:not(.evening__tile--mobile) { display: none; }
.evening__tile.is-visible { opacity: 1; transform: none; }
.evening__tile img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 1.4s var(--ease-glide);
}
/* Zoom on hover only where a real hover exists (desktop pointer) */
@media (hover: hover) and (pointer: fine) {
  .evening__tile:hover img { transform: scale(1.04); }
}

/* Mobile-only scroll progress indicator — quietly shows position + more-to-see */
.evening__progress {
  display: block;
  height: 1px;
  background: var(--hairline);
  margin: 24px var(--gutter) 0;
  position: relative;
  overflow: hidden;
}
.evening__progress span {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 0%;
  background: var(--brass-glow);
  transition: width 0.15s linear;
}

/* --- Tablet: 2-column masonry, all tiles visible --- */
@media (min-width: 720px) {
  .evening__spread {
    display: block;
    columns: 2 320px;
    column-gap: 14px;
    overflow: visible;
    scroll-snap-type: none;
    padding: 0 var(--gutter);
    max-width: var(--max);
    margin: 0 auto;
  }
  .evening__tile {
    break-inside: avoid;
    display: block;
    flex: none;
    margin: 0 0 14px;
    scroll-snap-align: none;
  }
  .evening__tile:not(.evening__tile--mobile) { display: block; }
  .evening__progress { display: none; }
}

/* --- Desktop: 4-column masonry --- */
@media (min-width: 1024px) {
  .evening__spread { columns: 4 300px; column-gap: 14px; }
  .evening__tile { margin-bottom: 14px; }
}

/* --- Wide desktop: 5-column masonry --- */
@media (min-width: 1440px) {
  .evening__spread { columns: 5 280px; column-gap: 16px; }
  .evening__tile { margin-bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .evening__tile { opacity: 1; transform: none; transition: none; }
  .evening__tile:hover img { transform: none; }
}

/* ---------- Editorial event cards (Events page) ---------- */
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 48px;
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
@media (max-width: 900px) { .calendar-grid { grid-template-columns: 1fr; gap: 32px; } }
.calendar-card {
  border: 1px solid var(--hairline);
  padding: 56px 44px;
  background: var(--ink-2);
  transition: border-color .6s var(--ease-glide), transform .6s var(--ease-glide);
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-height: 320px;
}
.calendar-card:hover {
  border-color: var(--rule-brass);
  transform: translateY(-4px);
}
.calendar-card__month {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--brass);
}
.calendar-card__title {
  font-family: var(--serif);
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 400;
  line-height: 1.1;
  color: var(--bone);
  margin: 0;
}
.calendar-card__note {
  font-family: var(--serif);
  font-style: italic;
  font-size: 17px;
  color: var(--bone-dim);
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
.calendar-card__meta {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bone-dim);
  padding-top: 18px;
  border-top: 1px solid var(--hairline);
}

/* Clickable calendar cards — signal affordance without a heavy button */
.calendar-card--clickable {
  cursor: pointer;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.calendar-card--clickable:hover {
  border-color: var(--brass);
  transform: translateY(-6px);
}

/* Ambient photo reveal — cards with .calendar-card--with-photo contain a
   .calendar-card__bg child whose background-image is set inline. Fades in on
   scroll, brightens on hover. Dark scrim keeps copy readable. */
.calendar-card--with-photo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.calendar-card__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.7s var(--ease-glide);
  z-index: 0;
  pointer-events: none;
}
/* Hover-only reveal — clean card by default, photo appears on cursor entry */
@media (hover: hover) and (pointer: fine) {
  .calendar-card--with-photo:hover .calendar-card__bg { opacity: 0.60; }
  .calendar-card--with-photo:hover .calendar-card__scrim { opacity: 1; }
}
.calendar-card__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(26,22,18,0.55) 0%, rgba(26,22,18,0.85) 100%);
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.7s var(--ease-glide);
}
.calendar-card--with-photo > *:not(.calendar-card__bg):not(.calendar-card__scrim) {
  position: relative;
  z-index: 2;
}

/* ---------- Lightbox modal — event flyers / featured photos ---------- */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(15, 12, 10, 0.94);
  backdrop-filter: blur(8px);
  padding: 40px 20px;
  opacity: 0;
  transition: opacity 0.35s var(--ease-glide);
}
.lightbox.is-open {
  display: flex;
  opacity: 1;
}
.lightbox__inner {
  position: relative;
  max-width: 90vw;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  transform: translateY(12px) scale(0.98);
  transition: transform 0.5s var(--ease-glide);
}
.lightbox.is-open .lightbox__inner {
  transform: none;
}
.lightbox__inner img {
  max-width: 100%;
  max-height: 82vh;
  height: auto;
  width: auto;
  display: block;
  border-radius: 6px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.55);
}
.lightbox__close {
  position: absolute;
  top: -44px;
  right: 0;
  background: transparent;
  border: 1px solid var(--bone-dim);
  color: var(--bone);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s var(--ease);
}
.lightbox__close:hover {
  border-color: var(--brass-glow);
  color: var(--brass-glow);
  transform: rotate(90deg);
}
@media (max-width: 720px) {
  .lightbox__inner { max-width: 100%; }
  .lightbox__close { top: -48px; }
}

/* ---------- Two-column simple text/text grid ---------- */
.duo-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  max-width: var(--max);
  margin: 0 auto;
}
@media (max-width: 720px) {
  .duo-text { grid-template-columns: 1fr; gap: 32px; }
}

/* ---------- Hours / Address strip ---------- */
.info-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px;
  padding: 60px 0;
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
@media (max-width: 720px) {
  .info-strip { grid-template-columns: 1fr; gap: 32px; }
}
.info-strip__col h4 { margin-bottom: 12px; }
.info-strip__col p { margin: 0; font-size: 17px; line-height: 1.5; color: var(--bone); }

/* ---------- Forms ---------- */
.form { display: grid; gap: 24px; }
.form__row { display: flex; flex-direction: column; gap: 8px; }
.form__row label {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
  font-weight: 400;
}
.form__row input,
.form__row select,
.form__row textarea {
  font-family: var(--serif);
  font-size: 17px;
  color: var(--bone);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hairline-strong);
  padding: 10px 0;
  outline: none;
  transition: border-color .3s var(--ease);
}
.form__row textarea { resize: vertical; min-height: 100px; }
.form__row input:focus,
.form__row select:focus,
.form__row textarea:focus { border-bottom-color: var(--brass); }
.form__row select { -webkit-appearance: none; appearance: none; cursor: pointer; }

/* ---------- Newsletter signup ---------- */
.newsletter {
  padding: var(--section) 0;
}
.newsletter__head {
  max-width: 560px;
  margin: 0 auto 48px;
  padding: 0 var(--gutter);
  text-align: center;
}
.newsletter__form {
  max-width: 520px;
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  align-items: stretch;
  border-bottom: 1px solid var(--hairline-strong);
}
.newsletter__form input[type="email"] {
  flex: 1 1 260px;
  font-family: var(--serif);
  font-size: 18px;
  color: var(--bone);
  background: transparent;
  border: 0;
  padding: 14px 4px;
  outline: none;
  min-width: 0;
}
.newsletter__form input[type="email"]::placeholder {
  color: var(--bone-faint);
  font-style: italic;
}
.newsletter__form button {
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  background: transparent;
  color: var(--brass-glow);
  border: 0;
  padding: 14px 12px 14px 20px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .3s var(--ease);
}
.newsletter__form button:hover { color: var(--bone); }
.newsletter__form .hp {
  position: absolute;
  left: -9999px;
}
.newsletter__note {
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-dim);
  text-align: center;
  margin: 24px auto 0;
  max-width: 480px;
  padding: 0 var(--gutter);
}

/* Footer compact newsletter */
.footer-newsletter {
  border-top: 1px solid var(--hairline);
  padding: 40px 0 24px;
  margin-top: 40px;
  max-width: var(--max);
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
@media (max-width: 720px) {
  .footer-newsletter { grid-template-columns: 1fr; gap: 20px; }
}
.footer-newsletter__label h5 {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 400;
  color: var(--bone);
  margin: 0 0 6px;
  text-transform: none;
  letter-spacing: 0;
}
.footer-newsletter__label p {
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-dim);
  margin: 0;
}
.footer-newsletter__form {
  display: flex;
  border-bottom: 1px solid var(--hairline-strong);
}
.footer-newsletter__form input[type="email"] {
  flex: 1;
  font-family: var(--serif);
  font-size: 16px;
  color: var(--bone);
  background: transparent;
  border: 0;
  padding: 10px 4px;
  outline: none;
  min-width: 0;
}
.footer-newsletter__form input[type="email"]::placeholder {
  color: var(--bone-faint);
  font-style: italic;
}
.footer-newsletter__form button {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  background: transparent;
  color: var(--brass-glow);
  border: 0;
  padding: 10px 4px 10px 16px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .3s var(--ease);
}
.footer-newsletter__form button:hover { color: var(--bone); }

/* ---------- Footer ---------- */
.site-footer {
  border-top: 1px solid var(--hairline);
  padding: 80px var(--gutter) 40px;
  background: var(--ink);
  color: var(--bone-dim);
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
  max-width: var(--max);
  margin: 0 auto 48px;
}
@media (max-width: 900px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 540px) {
  .footer-grid { grid-template-columns: 1fr; }
}
.footer-grid h5 {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
  margin: 0 0 16px;
  font-weight: 500;
}
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li { margin-bottom: 8px; }
.footer-grid a { color: var(--bone-dim); font-size: 15px; }
.footer-grid a:hover { color: var(--brass-glow); }
.footer-mark {
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 400;
  color: var(--bone);
  margin: 0 0 12px;
}
.footer-tag {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
  margin-top: 18px;
}
.footer-bottom {
  max-width: var(--max);
  margin: 0 auto;
  padding-top: 24px;
  border-top: 1px solid var(--hairline);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--bone-dim);
}
.footer-bottom .legal { display: flex; gap: 28px; }
@media (max-width: 720px) {
  .footer-bottom { flex-direction: column; gap: 16px; align-items: flex-start; }
}

/* ---------- Utility ---------- */
.center { text-align: center; }
.muted { color: var(--bone-dim); }
.serif-italic { font-family: var(--serif); font-style: italic; }
.spacer-lg { height: clamp(80px, 10vw, 140px); }

/* ---------- Announcement Bar (sitewide, dismissible) ---------- */
.announce-bar {
  position: relative;
  z-index: 200;
  background: linear-gradient(180deg, #1f1a15 0%, #17130f 100%);
  border-bottom: 1px solid var(--rule-brass);
  color: var(--bone);
  font-family: var(--sans);
}
.announce-bar__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 11px 48px 11px var(--gutter);
  max-width: var(--max);
  margin: 0 auto;
  color: var(--bone);
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: opacity 0.25s ease;
}
.announce-bar__link:hover { opacity: 0.85; }
.announce-bar__desktop, .announce-bar__mobile { color: var(--bone); }
.announce-bar__mobile { display: none; }
.announce-bar__cta {
  color: var(--brass-glow);
  letter-spacing: 0.22em;
  border-bottom: 1px solid var(--brass);
  padding-bottom: 2px;
  white-space: nowrap;
}
.announce-bar__close {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: 0;
  color: var(--bone-dim);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  padding: 6px 10px;
  transition: color 0.2s ease;
}
.announce-bar__close:hover { color: var(--bone); }
body:has(.announce-bar) .site-header { top: 0; }
@media (max-width: 720px) {
  .announce-bar__link { gap: 10px; font-size: 11px; padding: 10px 44px 10px 16px; letter-spacing: 0.12em; }
  .announce-bar__desktop { display: none; }
  .announce-bar__mobile { display: inline; }
  .announce-bar__cta { letter-spacing: 0.16em; }
}
