:root{
/* ── Core palette — Midnight Navy + Warm Gold ── */
--color-ink:#0a0e14;
--color-paper:#edf0f7;
--color-cream:#d8dff0;
--color-gold:#d4b06a;
--color-gold-light:#eed9a0;
--color-gold-glow:rgba(212,176,106,.28);
  --accent-gradient: linear-gradient(135deg,#f2ede6 0%,#eadcbe 50%,#e2cb95 100%);
--color-gold-a04:rgba(212,176,106,.04);
--color-gold-a10:rgba(212,176,106,.10);
--color-gold-a16:rgba(212,176,106,.16);
--color-gold-a18:rgba(212,176,106,.18);
--color-gold-a32:rgba(212,176,106,.32);
--color-gold-a38:rgba(212,176,106,.38);
--color-gold-a40:rgba(212,176,106,.40);
--color-mist:rgba(237,240,247,.65);
--color-line:rgba(237,240,247,.14);
--color-line-light:rgba(237,240,247,.07);
--color-dark-line:rgba(10,14,20,.08);
--color-warm-bg:#0f141c;

/* ── Shades & overlays ────────────────────── */
--shade-heavy:rgba(10,14,20,.95);
--shade-medium:rgba(10,14,20,.62);
--shade-light:rgba(10,14,20,.32);
--shade-gradient:linear-gradient(
  180deg,
  rgba(10,14,20,.97) 0%,
  rgba(10,14,20,.52) 30%,
  rgba(10,14,20,.88) 100%
);

/* Unified site overlay — control all section darkening from this one place.
   Change alpha values here → every section updates. */
--overlay-site: linear-gradient(180deg,
  rgba(10,22,40,.42) 0%,
  rgba(10,22,40,.18) 35%,
  rgba(10,22,40,.18) 65%,
  rgba(10,22,40,.45) 100%);

/* ─── Z-INDEX LADDER ─────────────────────────────
   Every section follows this order. Keep changes here, not scattered. */
--z-bg:        0;      /* section backgrounds */
--z-overlay:   1;      /* overlay shades */
--z-content:   2;      /* section content wrappers */
--z-section:   5;      /* toplines, headers inside sections */
--z-cta:      10;      /* arrows, dots, floating CTAs */
--z-nav:    1000;      /* fixed top navbar */
--z-modal: 99999;      /* edit panels, modals */
--z-toast:999999;      /* toasts, critical overlays */

/* ── Cards & surfaces ─────────────────────── */
--card-bg:rgba(10,14,20,.70);
--card-border:rgba(237,240,247,.06);
--card-hover-border:var(--color-gold-a38);
--card-shadow:0 1.2rem 3rem rgba(0,0,0,.40);

/* ── Buttons ──────────────────────────────── */
--btn-primary-bg:var(--color-gold);
--btn-primary-text:#0a0e14;
--btn-primary-glow:0 0 22px var(--color-gold-a32);
--btn-outline-border:rgba(237,240,247,.18);
--btn-outline-hover:var(--color-gold-light);

/* ── Typography ───────────────────────────── */
--font-display:"Cormorant Garamond",Georgia,serif;
--font-sans:"DM Sans",Arial,sans-serif;
--text-xs:clamp(.62rem,.7vw,.72rem);
--text-sm:clamp(.76rem,.9vw,.9rem);
--text-base:clamp(.9rem,1vw,1rem);
--text-lg:clamp(1.05rem,1.5vw,1.3rem);
--text-hero:clamp(4rem,9vw,9.7rem);
--leading-tight:.84;
--leading-body:1.6;
--tracking-caps:.15em;

/* ── Spacing ──────────────────────────────── */
--space-1:.5rem;--space-2:.75rem;--space-3:1rem;--space-4:1.5rem;
--space-5:2rem;--space-6:3rem;--space-7:4.5rem;--space-8:6rem;
--space-9:8rem;--space-10:10rem;

/* ── Layout ───────────────────────────────── */
--page-pad:clamp(1.25rem,4vw,4.75rem);
--nav-height:clamp(4.75rem,9vw,6.5rem);
--radius-sm:8px;
--radius-card:1.25rem;
--radius-pill:999px;

/* ── Effects ──────────────────────────────── */
--shadow-card:0 1rem 2.5rem rgba(0,0,0,.38);
--shadow-button:0 .5rem 1.5rem rgba(0,0,0,.32);
--shadow-glow:0 0 20px var(--color-gold-glow);
--ease-out:cubic-bezier(.22,1,.36,1);
--ease-spring:cubic-bezier(.34,1.56,.64,1);
--duration:360ms;
--duration-slow:600ms;
}

/* ── Reset ────────────────────────────────── */
@import url('token.css');
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;background: #0d0e11;color:var(--color-paper);font-family:var(--font-sans);line-height:var(--leading-body)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit}


/* ═══════════════════════════════════════════════════════════════
   FORCED Z-INDEX — every section, every page, no exceptions.
   Applies after all other rules. Overrides any leftover hardcoded
   z-index from section files.
   ═══════════════════════════════════════════════════════════════ */

/* ── Backgrounds: always 0 ── */
.hero__photo,
.about__background,
.s3-bg, .s4-bg, .s6-bg, .s7-bg,
.gallery-slide__bg,
.contact-bg, .loc-bg,
.v-slide__media {
  z-index: var(--z-bg, 0) !important;
}

/* ── Overlays: always 1 ── */
.hero__shade,
.about__overlay,
.s3-shade, .s4-shade, .s6-shade, .s7-shade,
.gallery-slide__shade,
.contact-shade, .loc-shade,
.booking-intro__shade,
.v-slide__veil,
.loc-map__frame-overlay {
  z-index: var(--z-overlay, 1) !important;
  background: var(--overlay-site) !important;
}

/* ── Content wrappers: always 2 ── */
.s3-scroll, .s4-scroll, .s6-scroll, .s7-scroll,
.contact-scroll, .loc-scroll,
.gallery-slide__card,
.booking-intro__copy,
.hero__copy,
.snap-content {
  z-index: var(--z-content, 2) !important;
  position: relative;
}

/* ── Headers / toplines: always 5 ── */
.s3-topline, .s4-topline, .s6-topline, .s7-topline,
.gallery__topline, .gallery__heading,
.contact-topline, .loc-topline,
.s3-hd, .s4-hd, .s6-hd, .s7-hd,
.loc-hd, .about__topline, .about__heading,
.venues__topline {
  z-index: var(--z-section, 5) !important;
  position: relative;
}

/* ── CTA / arrows / dots: always 10 ── */
.gallery__arrow, .gallery__dots, .gallery__dot,
.venues__arrow, .venues__nav,
.hero__actions, .s7-cta__actions,
.loc-btn, .contact-form-submit {
  z-index: var(--z-cta, 10) !important;
}

/* ── Fixed nav: always on top ── */
.nav, .nav-pill, .nav__links {
  z-index: var(--z-nav, 1000) !important;
}

/* ═══════════════════════════════════════════════════════════════
   FORCED LAYER ORDER — every section, every page.
   Loads last → wins over any hardcoded value in section CSS.
   ═══════════════════════════════════════════════════════════════ */

/* Backgrounds: tier 0 */
.hero__photo, .about__background,
.s3-bg, .s4-bg, .s6-bg, .s7-bg,
.gallery-slide__bg, .contact-bg, .loc-bg,
.v-slide__media {
  z-index: 0 !important;
}

/* Overlays: tier 1 */
.hero__shade, .about__overlay,
.s3-shade, .s4-shade, .s6-shade, .s7-shade,
.gallery-slide__shade, .contact-shade, .loc-shade,
.booking-intro__shade, .v-slide__veil,
.loc-map__frame-overlay {
  z-index: 1 !important;
}

/* Content: tier 2 — the big fix: EVERY content element */
.snap-content,
.s3-scroll, .s4-scroll, .s6-scroll, .s7-scroll,
.contact-scroll, .loc-scroll,
.hero__copy, .hero__intro, .hero__actions, .hero__footer,
.hero__side,
.about__topline, .about__heading, .about__line, .cards, .card,
.s3-topline, .s3-hd, .s3-grid, .s3-card, .s3-cta,
.s4-topline, .s4-hd, .s4-exp-grid, .s4-exp-card, .s4-events,
.s6-topline, .s6-hd, .s6-list, .s6-item,
.s7-topline, .s7-cta, .s7-footer,
.gallery-slide__card,
.contact-topline, .contact-layout, .contact-intro, .contact-accordion,
.contact-eyebrow, .contact-title, .contact-intro__desc, .contact-intro__rule,
.loc-topline, .loc-hd, .loc-grid, .loc-card, .loc-desc,
.booking-intro__copy, .booking-intro__side, .booking-intro__footer,
.v-slide__content, .v-slide__numeral {
  position: relative;
  z-index: 2 !important;
}

/* Arrows / dots / floating CTAs: tier 3 */
.gallery__arrow, .gallery__dots,
.venues__arrow, .venues__nav,
.s7-cta__actions,
.loc-btn, .contact-form-submit {
  z-index: 3 !important;
}

/* Fixed nav: tier 1000 */
.nav, .nav-pill {
  z-index: 1000 !important;
}

