/* ============================================================
   PE POLISH — the "blow me away" refinement layer.
   Loads LAST on every page (after pe-letterforms.css).
   Three jobs: tactile button states, double-frame borders with
   corner flourishes, and refined small-text detailing.
   Rules: never touches .pe-metal letterforms, never changes copy,
   never flattens metal to solid. All motion honors
   prefers-reduced-motion. Barry 2026-09-25: "stepped up not
   trimmed down" — this layer ADDS craft, removes nothing.
   ============================================================ */

/* House type roles — added 2026-10-18 (applied-learning pass, BANNED-2 /
   D5-1 class fix): this sheet references var(--display)/var(--sans) but the
   roles were defined only in pe-main.css, which booked.html, privacy.html
   and the-mix do not load — on those pages the references silently fell
   back to inherited/UA fonts. Values are verbatim from pe-main.css :root,
   so pages loading both sheets see identical values (no visual change);
   pages loading this sheet alone now resolve the house roles. */
:root{--display:"Bodoni Moda",Georgia,serif;--sans:"DM Sans",sans-serif}

/* A-08 (WEB-ACCESSIBILITY, applied 2026-10-18): anchored targets carry a
   scroll margin so keyboard focus / anchor jumps never land hidden under
   the sticky bars — 96px clears the sticky header + mobile CTA bar. */
[id]{scroll-margin-top:96px}

/* ============ 1. BUTTONS — tactile depth everywhere ============ */

/* universal press: every button dips when tapped */
.btn:active,
.btn-gold:active,
.ic-text-barry:active,
.ic-wc-cta:active,
.mobile-cta:active,
.contact-action:active,
.choice:active,
.radio-pill:active,
.wz-stepper-ctl button:active,
.wz-source-row button:active,
#pe-consent-bar .pe-cbtn:active,
.city-hero .btn:active,
.venue-hero .btn:active {
  transform:translateY(1px)!important;
  filter:brightness(.95)!important;
  transition-duration:.06s;
}

/* universal focus ring: champagne, always visible for keyboard users */
.btn:focus-visible,
.btn-gold:focus-visible,
.ic-text-barry:focus-visible,
.ic-wc-cta:focus-visible,
.mobile-cta:focus-visible,
.contact-action:focus-visible,
.wz-stepper-ctl button:focus-visible,
.wz-source-row button:focus-visible,
.wz-textbtn:focus-visible,
#pe-consent-bar .pe-cbtn:focus-visible,
.city-hero .btn:focus-visible,
.venue-hero .btn:focus-visible {
  outline:2px solid #f1d18b!important;
  outline-offset:3px;
}

/* --- .btn-gold (planner gold submit) → full machined-gold grade --- */
.btn-gold {
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#fff9dd 0%,#ffedb8 13%,#f5d271 32%,#e0a83c 50%,#c68f27 64%,#a9771c 82%,#b5852c 100%)!important;
  border:1px solid rgba(56,36,6,.95)!important;
  box-shadow:
    0 0 0 1px rgba(20,12,2,.85),
    inset 0 2px 3px rgba(255,255,255,.9),
    inset 0 -5px 12px rgba(90,52,6,.5),
    inset 2px 0 5px rgba(255,255,255,.28),
    inset -2px 0 5px rgba(70,42,4,.32),
    0 12px 30px rgba(0,0,0,.6),
    0 0 36px rgba(232,195,108,.32)!important;
  text-shadow:0 1px 0 rgba(255,246,214,.85)!important;
  transition:transform .22s cubic-bezier(.2,.7,.25,1.15),box-shadow .25s ease,filter .25s ease;
}
.btn-gold::before { /* machined top glint */
  content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.75),rgba(255,255,255,0) 65%);
}
.btn-gold::after { /* sheen sweep on hover */
  content:"";position:absolute;top:-25%;bottom:-25%;left:-75%;width:45%;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.6),transparent);
  transform:skewX(-18deg);transition:left .65s ease;
}
.btn-gold:hover { filter:brightness(1.07)!important;transform:translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(20,12,2,.85),
    inset 0 2px 3px rgba(255,255,255,.95),
    inset 0 -5px 12px rgba(90,52,6,.5),
    0 16px 38px rgba(0,0,0,.62),
    0 0 60px rgba(232,195,108,.5)!important;
}
.btn-gold:hover::after { left:145%; }

/* --- .ic-text-barry (planner direct-line pill) → same machined grade --- */
.ic-text-barry {
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#fff9dd 0%,#ffe9ad 16%,#f0cd6d 36%,#dd9f36 56%,#bd8a26 78%,#cf9c33 100%)!important;
  border:1px solid rgba(56,36,6,.9)!important;
  box-shadow:
    0 0 0 1px rgba(20,12,2,.8),
    inset 0 2px 3px rgba(255,255,255,.9),
    inset 0 -4px 10px rgba(90,52,6,.45),
    0 10px 28px rgba(0,0,0,.55),
    0 0 42px rgba(233,185,95,.4)!important;
  text-shadow:0 1px 0 rgba(255,246,214,.8)!important;
  transition:transform .22s cubic-bezier(.2,.7,.25,1.15),box-shadow .25s ease,filter .25s ease;
}
.ic-text-barry::before {
  content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.7),rgba(255,255,255,0) 65%);
}
.ic-text-barry::after {
  content:"";position:absolute;top:-25%;bottom:-25%;left:-75%;width:45%;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.6),transparent);
  transform:skewX(-18deg);transition:left .65s ease;
}
.ic-text-barry:hover { filter:brightness(1.08)!important;transform:translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(20,12,2,.8),
    inset 0 2px 3px rgba(255,255,255,.95),
    inset 0 -4px 10px rgba(90,52,6,.45),
    0 14px 34px rgba(0,0,0,.6),
    0 0 64px rgba(233,185,95,.55)!important;
}
.ic-text-barry:hover::after { left:145%; }

/* --- ghost/secondary buttons: gradient-border ring + depth --- */
.btn-ghost,
.btn:not(.btn-primary):not(.btn-gold) {
  position:relative;
  border:1px solid rgba(232,195,108,.7)!important;
  background:linear-gradient(180deg,rgba(232,195,108,.2),rgba(232,195,108,.05))!important;
  box-shadow:
    inset 0 0 0 1px rgba(20,12,2,.5),
    inset 0 1px 0 rgba(255,235,180,.35),
    0 4px 16px rgba(0,0,0,.5)!important;
  transition:transform .22s cubic-bezier(.2,.7,.25,1.15),box-shadow .25s ease,background .25s ease,border-color .25s ease;
}
.btn-ghost:hover,
.btn:not(.btn-primary):not(.btn-gold):hover {
  border-color:rgba(246,219,156,.95)!important;
  background:linear-gradient(180deg,rgba(232,195,108,.34),rgba(232,195,108,.1))!important;
  box-shadow:
    inset 0 0 0 1px rgba(20,12,2,.5),
    inset 0 1px 0 rgba(255,235,180,.5),
    0 8px 24px rgba(0,0,0,.55),
    0 0 34px rgba(232,195,108,.4)!important;
  transform:translateY(-2px);
}

/* --- v19-city/venue buttons (11 venue pages): bevel + sheen + press --- */
.city-hero .btn-primary, .venue-hero .btn-primary, .city-cta .btn-primary, .venue-cta .btn-primary {
  position:relative;overflow:hidden;isolation:isolate;
  border:1px solid rgba(56,36,6,.9)!important;
  box-shadow:
    0 0 0 1px rgba(20,12,2,.7),
    inset 0 2px 3px rgba(255,255,255,.75),
    inset 0 -4px 10px rgba(90,52,6,.4),
    0 10px 28px rgba(0,0,0,.5),
    0 0 32px rgba(212,165,72,.3)!important;
  text-shadow:0 1px 0 rgba(255,246,214,.7)!important;
  transition:transform .22s cubic-bezier(.2,.7,.25,1.15),box-shadow .25s ease,filter .25s ease;
}
.city-hero .btn-primary::after, .venue-hero .btn-primary::after, .city-cta .btn-primary::after, .venue-cta .btn-primary::after {
  content:"";position:absolute;top:-25%;bottom:-25%;left:-75%;width:45%;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);transition:left .65s ease;
}
.city-hero .btn-primary:hover::after, .venue-hero .btn-primary:hover::after, .city-cta .btn-primary:hover::after, .venue-cta .btn-primary:hover::after { left:145%; }
.city-hero .btn-primary:hover, .venue-hero .btn-primary:hover, .city-cta .btn-primary:hover, .venue-cta .btn-primary:hover {
  filter:brightness(1.07);
  box-shadow:
    0 0 0 1px rgba(20,12,2,.7),
    inset 0 2px 3px rgba(255,255,255,.85),
    inset 0 -4px 10px rgba(90,52,6,.4),
    0 14px 34px rgba(0,0,0,.55),
    0 0 52px rgba(212,165,72,.45)!important;
}
.city-hero .btn-ghost, .venue-hero .btn-ghost {
  box-shadow:inset 0 1px 0 rgba(255,235,180,.25),0 4px 14px rgba(0,0,0,.4)!important;
  transition:transform .22s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease;
}
.city-hero .btn-ghost:hover, .venue-hero .btn-ghost:hover {
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,235,180,.4),0 8px 20px rgba(0,0,0,.45),0 0 26px rgba(212,165,72,.35)!important;
}

/* --- index .contact-action cards: tactile refine --- */
.contact-action {
  transition:transform .2s ease,box-shadow .25s ease,background .25s ease,color .25s ease,border-color .25s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 6px 18px rgba(0,0,0,.35);
}
.contact-action:hover, .contact-action:focus-visible {
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 26px rgba(0,0,0,.4),0 0 30px rgba(232,195,108,.28);
  transform:translateY(-2px);
}

/* --- planner choice chips: pressed + selected glow --- */
.choice, .radio-pill { transition:transform .15s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease; }
.choice:has(input:checked), .radio-pill:has(input:checked) {
  box-shadow:inset 0 1px 0 rgba(255,235,180,.25),0 0 0 1px rgba(232,189,96,.55),0 0 22px rgba(232,189,96,.22)!important;
}
.wz-source-row button { transition:transform .15s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease; }
.wz-source-row button.is-on {
  box-shadow:inset 0 1px 0 rgba(255,235,180,.3),0 0 0 1px rgba(232,189,96,.5),0 0 20px rgba(232,189,96,.25)!important;
}
.wz-stepper-ctl button { transition:transform .15s ease,background .25s ease,box-shadow .25s ease; }
.wz-stepper-ctl button:hover { box-shadow:0 0 18px rgba(232,195,108,.35); }

/* --- cookie consent buttons: machined gold + ghost ring --- */
#pe-consent-bar { box-shadow:0 -12px 40px rgba(0,0,0,.7),0 -1px 0 rgba(212,175,55,.55)!important; }
#pe-consent-bar .pe-cbtn {
  transition:transform .2s ease,box-shadow .25s ease,filter .25s ease,background .25s ease;
  box-shadow:inset 0 1px 0 rgba(255,235,180,.3),0 4px 14px rgba(0,0,0,.45);
}
#pe-consent-bar .pe-cbtn.gold {
  border:1px solid rgba(56,36,6,.9)!important;
  box-shadow:
    0 0 0 1px rgba(20,12,2,.7),
    inset 0 2px 3px rgba(255,255,255,.8),
    inset 0 -3px 8px rgba(90,52,6,.4),
    0 6px 18px rgba(0,0,0,.5),
    0 0 26px rgba(232,195,108,.3)!important;
  text-shadow:0 1px 0 rgba(255,246,214,.75);
}
#pe-consent-bar .pe-cbtn.gold:hover { filter:brightness(1.08);transform:translateY(-1px);
  box-shadow:
    0 0 0 1px rgba(20,12,2,.7),
    inset 0 2px 3px rgba(255,255,255,.9),
    inset 0 -3px 8px rgba(90,52,6,.4),
    0 8px 22px rgba(0,0,0,.55),
    0 0 40px rgba(232,195,108,.45)!important;
}
#pe-consent-bar .pe-cbtn:not(.gold):hover {
  border-color:rgba(246,219,156,.9)!important;
  box-shadow:inset 0 1px 0 rgba(255,235,180,.4),0 6px 18px rgba(0,0,0,.5),0 0 24px rgba(232,195,108,.3)!important;
  transform:translateY(-1px);
}

/* ============ 2. BORDERS — double frames + corner flourishes ============ */

/* double-frame: inner hairline gold inside the card's own border */
.mix-card {
  box-shadow:inset 0 0 0 1px rgba(212,165,72,.16),0 18px 44px rgba(0,0,0,.5)!important;
}
.mix-card:hover {
  box-shadow:inset 0 0 0 1px rgba(237,198,109,.45),0 26px 60px rgba(0,0,0,.6),0 0 46px rgba(212,165,72,.14)!important;
}
.quote {
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.16),0 20px 60px #000!important;
}
.package {
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.14),0 16px 46px rgba(21,14,2,.1)!important;
}
.package.featured {
  box-shadow:inset 0 0 0 1px rgba(237,198,109,.38),var(--shadow)!important;
}
.party-card {
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.14),0 14px 40px rgba(21,14,2,.12)!important;
}
.reel-slot {
  box-shadow:inset 0 0 0 1px rgba(231,190,99,.28),0 26px 70px #000!important;
}
.lock-panel {
  box-shadow:inset 0 0 0 1px rgba(212,165,72,.16),0 18px 44px rgba(0,0,0,.5)!important;
}
.ic-welcome-card, .ic-ch-card {
  box-shadow:inset 0 0 0 1px rgba(232,195,108,.22),0 30px 90px rgba(0,0,0,.75),0 0 70px rgba(212,165,72,.12)!important;
}
.ic-ch-card { position:relative; }
.service-card {
  box-shadow:inset 0 0 0 1px rgba(232,195,108,.2)!important;
}
.city-hero img, .venue-hero img {
  box-shadow:inset 0 0 0 1px rgba(212,165,72,.2),0 24px 60px rgba(0,0,0,.55)!important;
}

/* corner flourishes: machined gold L-corners on the flagship frames */
.package.featured::before, .ic-welcome-card::before, .ic-ch-card::before {
  content:"";position:absolute;top:9px;left:9px;width:30px;height:30px;pointer-events:none;z-index:5;
  border-top:2px solid rgba(240,205,119,.95);border-left:2px solid rgba(240,205,119,.95);
  border-top-left-radius:3px;
  filter:drop-shadow(0 0 6px rgba(240,205,119,.5));
}
.package.featured::after, .ic-welcome-card::after, .ic-ch-card::after {
  content:"";position:absolute;bottom:9px;right:9px;width:30px;height:30px;pointer-events:none;z-index:5;
  border-bottom:2px solid rgba(240,205,119,.95);border-right:2px solid rgba(240,205,119,.95);
  border-bottom-right-radius:3px;
  filter:drop-shadow(0 0 6px rgba(240,205,119,.5));
}

/* gradient hairline rules: nav, footer, mix footer, hr */
.nav { border-bottom:1px solid transparent!important;
  border-image:linear-gradient(90deg,transparent,rgba(212,165,72,.55) 18%,rgba(212,165,72,.55) 82%,transparent) 1!important;
}
footer { border-top:1px solid transparent!important;
  border-image:linear-gradient(90deg,transparent,rgba(212,165,72,.5) 20%,rgba(212,165,72,.5) 80%,transparent) 1!important;
}
.mix-foot { border-top:1px solid transparent!important;
  border-image:linear-gradient(90deg,transparent,rgba(212,165,72,.45) 25%,rgba(212,165,72,.45) 75%,transparent) 1!important;
}
hr { border:0!important;height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(212,165,72,.55),transparent)!important;
}
.overline::before, .overline::after {
  background:linear-gradient(90deg,transparent,currentColor)!important;
  height:1px!important;
}
.residency-list { border-top:1px solid transparent!important;
  border-image:linear-gradient(90deg,rgba(232,189,96,.5),rgba(232,189,96,.08)) 1!important;
}
.residency { transition:background .3s ease,padding-left .3s ease; }
.residency:hover { background:linear-gradient(90deg,rgba(232,189,96,.07),transparent 70%); }

/* ============ 3. TEXT — refined detailing ============ */

/* champagne selection */
::selection { background:rgba(212,165,72,.88);color:#141005; }

/* tabular numerals on every price, time, and stat */
.price, .tier .price, .package .price, .party-card .price, .upgrade-price,
.residency time, .lock-pct, .addon-price, .hero-meta strong, .year-stamp b {
  font-variant-numeric:tabular-nums lining-nums;
}

/* mix kickers: engraved hairline rules both sides */
.mix-kicker {
  display:inline-flex;align-items:center;gap:.8em;
  font-size:.68rem;font-weight:800;letter-spacing:.24em;text-transform:uppercase;
  color:#d9ab4c!important;
}
.mix-kicker::before, .mix-kicker::after {
  content:"";width:30px;height:5px;opacity:.75;
  border-top:1px solid currentColor;border-bottom:1px solid currentColor;
}
.mix-card-meta {
  border-top:1px solid rgba(212,165,72,.18);
  padding-top:.9rem;letter-spacing:.12em;
}

/* venue/city dek + section eyebrows: refined spacing and glow */
.city-hero > p:first-of-type, .venue-hero p {
  letter-spacing:.04em;text-shadow:0 2px 14px rgba(0,0,0,.8);
}
.city-hero .venue-eyebrow, .venue-hero .venue-eyebrow {
  letter-spacing:.3em!important;
}

/* section numbers: engraved coin numerals */
.sec-no {
  display:inline-grid;place-items:center;
  width:1.9em;height:1.9em;margin-right:.7em;
  border:1px solid rgba(212,175,55,.65);border-radius:50%;
  font-size:.72em;font-weight:800;letter-spacing:.05em;color:#efca79!important;
  box-shadow:inset 0 1px 2px rgba(255,240,200,.25),inset 0 -2px 4px rgba(0,0,0,.5),0 0 14px rgba(212,175,55,.25);
  text-shadow:0 1px 2px rgba(0,0,0,.8);
  vertical-align:.15em;
}

/* small functional text: crisper pairing */
.form-note, .faq p, .review-more, .addon span, .addon-body, .roster-card small {
  letter-spacing:.015em;
}
.field label, .choice-label {
  letter-spacing:.14em!important;
}

/* planner step numbers → machined medallions */
.step-number {
  background:radial-gradient(circle at 50% 30%,rgba(255,240,200,.28),rgba(255,240,200,0) 60%),#171208!important;
  box-shadow:inset 0 1px 2px rgba(255,240,200,.35),inset 0 -2px 5px rgba(0,0,0,.6),0 0 16px rgba(217,171,76,.35)!important;
  border:1px solid rgba(217,171,76,.85)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.9);
}

/* swipe tabs: tactile press */
.swipe-tab { transition:transform .15s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease; }
.swipe-tab:active { transform:scale(.96); }
.swipe-tab.active {
  box-shadow:inset 0 1px 0 rgba(255,235,180,.35),0 0 0 1px rgba(232,189,96,.5),0 0 24px rgba(232,189,96,.25)!important;
}

/* refined link underlines on gold links */
a.gold-u, .ig-link { text-underline-offset:3px;text-decoration-thickness:1px; }

/* ============ 4. mobile overflow repairs ============
   Pre-existing issues found in the 44-page QA sweep (2026-09-25).
   All scoped; desktop layouts untouched. */
@media (max-width:900px) {
  /* pay.html: the header Email pill duplicates the hamburger menu's
     "Email Barry" link — hiding it keeps the 390px header on-screen */
  body.page-pay .nav a.nav-text { display:none; }
}
@media (max-width:640px) {
  /* booked.html: body is display:flex (row) — the balance-auth section
     rendered squeezed side-by-side with the receipt card. Stack it. */
  body:has(#auth-wrap) { flex-direction:column; }
  #auth-wrap { width:100%;box-sizing:border-box; }
}
/* corporate.html: the 32px contact email is one unbreakable string —
   let it wrap instead of jutting 137px past the viewport */
.phone-big { overflow-wrap:anywhere; }
/* corporate.html: footer nav anchors have no whitespace between them, so the
   five links formed one unbreakable 396px row (which also stretched the fixed
   cookie bar via innerWidth). Wrapping flex, matching the other pages. */
.footer-links { display:flex;flex-wrap:wrap;gap:.5rem 1.3rem; }
.footer-links a { margin-right:0; }

/* ============ 5. reduced motion ============ */
@media (prefers-reduced-motion:reduce) {
  .btn-gold::after, .ic-text-barry::after,
  .city-hero .btn-primary::after, .venue-hero .btn-primary::after,
  .city-cta .btn-primary::after, .venue-cta .btn-primary::after { display:none; }
  .btn:active, .btn-gold:active, .ic-text-barry:active, .mobile-cta:active,
  .contact-action:active { transform:none; }
}

/* ============ 9.0 roadmap a11y system (2026-09-25, staged) ============ */
/* Item 5: skip link — first focusable element on every template */
.skip-link{position:absolute;left:-9999px;top:0;z-index:300;background:#0b0c0f;color:#f6db9c;
  padding:.9rem 1.3rem;font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;border:2px solid #e8bd60;border-radius:0 0 8px 0;
  box-shadow:0 10px 30px rgba(0,0,0,.6)}
.skip-link:focus-visible{left:.6rem;top:.6rem;color:#ffe9ad}
/* Item 6: global champagne focus-visible ring */
:focus-visible{outline:3px solid #f6db9c;outline-offset:3px}
/* Item 4: 44px minimum tap targets on nav + key CTAs (WCAG 2.2 AA) */
.nav .nav-text,.nav a.book,.nav .nav-call{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.mobile-menu a{min-height:44px;display:flex;align-items:center}
/* Item 7: reduced-motion safety net (specific fallbacks live per-component;
   video injection skips entirely under reduced-motion/save-data) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto!important}
}

/* ============ 9.0 roadmap item 8: consistent champagne-metal display headings ============
   Town/venue hero h1s previously inherited flat body ink. One bright dimensional
   champagne treatment everywhere — never flat gold, never muddy bronze. */
.city-hero h1,.venue-hero h1{color:#edc66d;-webkit-text-fill-color:#edc66d;text-shadow:0 -1px 1px rgba(255,251,235,.55), 0 1px 0 rgba(74,48,12,.55), 0 2px 0 rgba(20,12,2,.85), 0 8px 22px rgba(0,0,0,.7), 0 0 26px rgba(240,214,150,.28);filter:none;}

/* ============ 9.0 ROADMAP ITEM 9 — THE PE MOTION SYSTEM (staged 2026-09-25) ============
   ONE signature easing + 2 support curves + tokenized durations + one stagger
   direction (top→bottom, left→right, index order), applied across reveals,
   menu, decks, buttons, transitions. Density stays; the SYSTEM is the restraint.
   Signature: expo.out snap. Support 1: cinematic in-out. Support 2: tactile spring. */
:root{
  --pe-ease-sig:cubic-bezier(.16,.8,.24,1);       /* THE signature: expo.out */
  --pe-ease-io:cubic-bezier(.65,0,.35,1);         /* support 1: cinematic in-out */
  --pe-ease-spring:cubic-bezier(.2,.7,.25,1.15);  /* support 2: tactile spring */
  --pe-dur-instant:.12s;                          /* press states, tiny shifts */
  --pe-dur-fast:.22s;                             /* hovers, chips, taps */
  --pe-dur-med:.42s;                              /* card settles, menu motion */
  --pe-dur-slow:.7s;                              /* deck flings, big panels */
  --pe-dur-cine:1.05s;                            /* scroll reveals, hero intro */
  --pe-stagger:.07s;                              /* small stagger step */
  --pe-stagger-lg:.12s;                           /* large stagger step */
}
/* fold the pe26 trend-layer tokens into the same signature so the whole
   inline engine (hero choreo, lockup rise-in, domain cascade) speaks one ease */
:root{
  --pe26-ease:var(--pe-ease-sig);
  --pe26-ease-io:var(--pe-ease-io);
  --pe26-dur-1:var(--pe-dur-fast);
  --pe26-dur-2:var(--pe-dur-med);
  --pe26-dur-3:var(--pe-dur-cine);
}

/* ---- one tactile language for every interactive surface ---- */
.btn,.btn-primary,.btn-gold,.btn-ghost,.ic-text-barry,.ic-wc-cta,.mobile-cta,
.contact-action,.choice,.radio-pill,.swipe-tab,.wz-stepper-ctl button,
.wz-source-row button,#pe-consent-bar .pe-cbtn,.sn-btn,.hero-dc-btn,
.doors-btn,.mix-teaser-card,.ig-link{
  transition:transform var(--pe-dur-fast) var(--pe-ease-spring),
    box-shadow var(--pe-dur-med) var(--pe-ease-sig),
    filter var(--pe-dur-med) var(--pe-ease-sig),
    background-color var(--pe-dur-med) var(--pe-ease-sig),
    border-color var(--pe-dur-med) var(--pe-ease-sig),
    color var(--pe-dur-fast) var(--pe-ease-sig),
    opacity var(--pe-dur-fast) var(--pe-ease-sig)!important;
}
/* ---- one card language ---- */
.package,.service-card,.shot,.setup-card,.residency,.mix-card,.quote,
.party-card,.addon-item,.tier{
  transition:transform var(--pe-dur-med) var(--pe-ease-sig),
    box-shadow var(--pe-dur-med) var(--pe-ease-sig),
    border-color var(--pe-dur-med) var(--pe-ease-sig)!important;
}
/* ---- one reveal language (scroll reveals everywhere) ---- */
.pe-alive-reveal,.pe-alive-reveal-left,.pe-alive-reveal-right,.pe-alive-reveal-scale{
  transition:opacity var(--pe-dur-cine) var(--pe-ease-sig),
    transform var(--pe-dur-cine) var(--pe-ease-sig)!important;
}
/* ---- deck cards: spring settle (pe-polish loads after swipe-night.css) ---- */
.sn-card{
  transition:transform var(--pe-dur-slow) var(--pe-ease-spring),
    opacity var(--pe-dur-med) var(--pe-ease-sig)!important;
}
.sn-depth-1,.sn-depth-2{
  transition:transform var(--pe-dur-med) var(--pe-ease-spring),
    opacity var(--pe-dur-med) var(--pe-ease-sig)!important;
}

/* ---- session preloader: JS-built only (no-JS = it never exists),
   once per session, exit + hero intro run as ONE continuous timeline ---- */
#pe-preloader{
  position:fixed;inset:0;z-index:400;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1.4rem;
  background:radial-gradient(80% 60% at 50% 36%,#181208 0%,#070503 72%);
  transition:opacity var(--pe-dur-med) var(--pe-ease-sig),
    visibility var(--pe-dur-med) var(--pe-ease-sig);
}
#pe-preloader img{
  width:clamp(120px,24vw,190px);height:auto;
  filter:drop-shadow(0 0 34px rgba(232,195,108,.5)) drop-shadow(0 14px 34px rgba(0,0,0,.7));
  animation:pe-pl-pulse 1.6s var(--pe-ease-io) infinite;
}
@keyframes pe-pl-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.88}}
#pe-preloader .pe-pl-word{
  font-family:var(--display);font-weight:600;letter-spacing:.34em;text-indent:.34em;
  font-size:.78rem;color:#f6db9c;text-shadow:0 2px 14px rgba(0,0,0,.8);
}
#pe-preloader .pe-pl-bar{width:min(220px,50vw);height:2px;background:rgba(232,195,108,.18);overflow:hidden;border-radius:2px}
#pe-preloader .pe-pl-bar i{display:block;height:100%;width:40%;background:linear-gradient(90deg,transparent,#f6db9c,transparent);
  animation:pe-pl-slide 1.2s var(--pe-ease-io) infinite}
@keyframes pe-pl-slide{from{transform:translateX(-110%)}to{transform:translateX(280%)}}
/* exit: the medallion shrinks toward the hero lockup as the hero lines mask-reveal in */
#pe-preloader.pe-pl-exit{opacity:0;visibility:hidden;pointer-events:none}
#pe-preloader.pe-pl-exit img{transform:scale(.7) translateY(6vh);opacity:0;
  transition:transform var(--pe-dur-med) var(--pe-ease-sig),opacity var(--pe-dur-med) var(--pe-ease-sig)}
#pe-preloader.pe-pl-exit .pe-pl-word,#pe-preloader.pe-pl-exit .pe-pl-bar{opacity:0;
  transition:opacity var(--pe-dur-fast) var(--pe-ease-sig)}
@media (prefers-reduced-motion:reduce){#pe-preloader{display:none}}

/* ---- cinematic opening film: JS-built only (pe-signature.js), season-
   slotted ident over a black ground, above the medallion preloader.
   Exit is a 400ms crossfade into the hero (class .pe-opening-exit). ---- */
#pe-opening{
  position:fixed;inset:0;z-index:410;background:#000;
  opacity:1;transition:opacity .4s ease;
}
#pe-opening video{
  /* contain, never cover (owner fix 2026-10-20): the 16:9 film letterboxes
     centered on the layer's black ground at any viewport — cover side-cropped
     a portrait phone and clipped the ending lockup's lettering. */
  width:100%;height:100%;object-fit:contain;display:block;background:#000;
}
#pe-opening.pe-opening-exit{opacity:0;pointer-events:none}
/* Anchor the film layer to the DYNAMIC viewport so bottom-anchored
   controls (the skip button) stay inside the visible area on phones
   whose browser chrome resizes the viewport. Unsupported browsers
   ignore this and keep the inset:0 behaviour. */
#pe-opening{height:100dvh}
.pe-opening-skip{
  position:absolute;z-index:2;
  right:max(1rem,env(safe-area-inset-right));
  bottom:max(1rem,env(safe-area-inset-bottom));
  min-height:48px;padding:.8rem 1.05rem;
  border:1px solid rgba(246,219,156,.88);border-radius:999px;
  background:rgba(5,4,2,.74);color:#ffe9ad;
  font-family:var(--sans);font-size:.78rem;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer;
  box-shadow:0 12px 32px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.pe-opening-skip::after{content:"\2192";margin-left:.55rem;font-size:1rem;line-height:1}
.pe-opening-skip:hover,.pe-opening-skip:focus-visible{
  background:rgba(35,24,5,.9);color:#fff0bd;border-color:#ffe9ad;
}
.pe-opening-skip:active{transform:scale(.97)}
@media (max-width:640px){
  .pe-opening-skip{
    right:max(.85rem,env(safe-area-inset-right));
    bottom:max(.85rem,env(safe-area-inset-bottom));
    padding:.78rem .95rem;font-size:.72rem;
  }
}
/* While the film plays (html.pe-intro-on, set/removed by the film's own JS),
   no seasonal leaf or grade layer paints over it: the autumn fall host
   (z-1200) and grade (z-1100) both stack above #pe-opening (z-410). The
   layers resume untouched the moment the intro clears. */
html.pe-intro-on .autumn-fall-host,
html.pe-intro-on .autumn-grade{visibility:hidden}
/* Belt-and-braces with the consent script's own deferral: the consent bar
   never paints over the intro film (it would cover the Skip button). */
html.pe-intro-on #pe-consent-bar{display:none}
@media (prefers-reduced-motion:reduce){#pe-opening{display:none}}

/* ---- tactile error shake (wired with inline announced errors, aria-live) ---- */
@keyframes pe-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}
  40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.pe-shake{animation:pe-shake .38s var(--pe-ease-sig)}
@media (prefers-reduced-motion:reduce){.pe-shake{animation:none}}

/* ---- button morph: working → confirmed, one gesture, signature ease ---- */
.pe-btn-working{pointer-events:none;filter:saturate(.7) brightness(.94)}
.pe-btn-working::after{content:"";position:absolute;top:50%;left:50%;width:1.1em;height:1.1em;
  margin:-.55em 0 0 -.55em;border-radius:50%;
  border:2px solid rgba(32,19,3,.4);border-top-color:#201303;
  animation:pe-spin .7s linear infinite}
@keyframes pe-spin{to{transform:rotate(360deg)}}
.pe-btn-done{background:linear-gradient(180deg,#ffe9a8,#e3b94e 55%,#b98a26)!important;
  color:#241a08!important;border-color:rgba(56,36,6,.9)!important;
  box-shadow:0 0 0 1px rgba(20,12,2,.85),inset 0 2px 3px rgba(255,255,255,.85),
    0 10px 28px rgba(0,0,0,.5),0 0 44px rgba(232,195,108,.55)!important;
  transform:translateY(-1px)}
@media (prefers-reduced-motion:reduce){.pe-btn-working::after{animation:none}}

/* ---- magnetic CTAs: JS sets --pe-mx/--pe-my, CSS resolves the pull ---- */
.pe-magnet{will-change:transform}
.pe-magnet.pe-magnet-on{transform:translate(var(--pe-mx,0px),var(--pe-my,0px))}

/* ============ 9.0 ROADMAP ITEM 11 — KINETIC TYPOGRAPHY (staged 2026-09-25) ============
   NOTE (2026-09-25 QA): the masked line-reveal via clip-path inset() was
   REMOVED. Verified in Chromium: clip-path inset() transitions stick (lines
   stay invisible) when the masked element renders text — both with
   background-clip:text (.lockup-proud, .lockup-ent) and, in software
   rasterization, plain text too. The staggered opacity/translateY rise-in
   (pe26 engine, index.html) already delivers the cinematic entrance and is
   proven — the mask added risk without a reliable payoff. The live-metal
   light sweep below is unaffected. */

/* S5 (ARRIVAL-FIX-SPEC, applied 2026-10-18): the .pe-sheen-live rules were
   removed — their driver (pe-signature ITEM 11 liveSheen) targeted
   .lockup-proud, an element that does not exist in the staging hero, so
   the class was never added and these rules never rendered. */
/* the domain line's per-letter cascade already staggers at .045s — folded
   into the signature ease */
.lockup-domain .pe26-ch{transition-timing-function:var(--pe-ease-sig),var(--pe-ease-sig)}

/* kinetic headlines elsewhere: headline tightens as it travels (already in
   pe-atmosphere .pe-scroll-kinetic) — normalize its curve to the signature */
.pe-scroll-kinetic{animation-timing-function:var(--pe-ease-io)!important}

/* ============ 9.0 ROADMAP ITEM 14 — OVERLAY MENU + FOOTER AS DESTINATIONS
   (staged 2026-09-25). The mobile menu becomes a fullscreen takeover with
   oversized staggered display links (one stagger direction, signature ease);
   the footer gets viewport-scale CTA type + magnetic socials. The SEO
   local-link rows (.footer-local) are untouched. */

/* body scroll lock while the menu is open */
body.menu-open{overflow:hidden}

/* ---- fullscreen overlay menu (mobile) ---- */
@media (max-width:900px){
  .mobile-menu{
    top:0!important;left:0!important;right:0!important;bottom:0!important;
    border:0!important;border-radius:0!important;z-index:120!important;
    background:
      radial-gradient(90% 55% at 50% 0%,rgba(74,52,14,.5),transparent 70%),
      linear-gradient(180deg,#0e0b07 0%,#060608 100%);
    padding:6.2rem clamp(1.6rem,7vw,3rem) 3rem!important;
    display:flex!important;flex-direction:column;justify-content:center;gap:.15rem;
    opacity:0;visibility:hidden;transform:none!important;
    transition:opacity var(--pe-dur-med) var(--pe-ease-sig),
      visibility var(--pe-dur-med) var(--pe-ease-sig)!important;
  }
  .mobile-menu.open{opacity:1;visibility:visible}
  .mobile-menu a{
    position:relative;
    font-family:var(--display);font-weight:600;
    font-size:clamp(2.2rem,9.4vw,3.4rem)!important;line-height:1.12;
    letter-spacing:-.01em;padding:.5rem 0 .5rem 2.6rem!important;
    color:#f4ead0;border-bottom:1px solid rgba(232,195,108,.14)!important;
    opacity:0!important;transform:translateY(30px)!important;
    transition:opacity var(--pe-dur-med) var(--pe-ease-sig),
      transform var(--pe-dur-med) var(--pe-ease-sig),
      color var(--pe-dur-fast) var(--pe-ease-sig)!important;
    counter-increment:pe-mm;
  }
  /* micro index numerals — the menu reads like a setlist */
  .mobile-menu a::before{
    content:"0" counter(pe-mm);
    position:absolute;left:0;top:50%;transform:translateY(-50%);
    font-family:var(--sans);font-weight:800;font-size:.72rem;letter-spacing:.22em;
    color:#c9962e;
  }
  .mobile-menu{counter-reset:pe-mm}
  .mobile-menu.open a{opacity:1!important;transform:none!important}
  .mobile-menu.open a:nth-child(1){transition-delay:calc(var(--pe-stagger)*1)}
  .mobile-menu.open a:nth-child(2){transition-delay:calc(var(--pe-stagger)*2)}
  .mobile-menu.open a:nth-child(3){transition-delay:calc(var(--pe-stagger)*3)}
  .mobile-menu.open a:nth-child(4){transition-delay:calc(var(--pe-stagger)*4)}
  .mobile-menu.open a:nth-child(5){transition-delay:calc(var(--pe-stagger)*5)}
  .mobile-menu.open a:nth-child(6){transition-delay:calc(var(--pe-stagger)*6)}
  .mobile-menu.open a:nth-child(7){transition-delay:calc(var(--pe-stagger)*7)}
  .mobile-menu.open a:nth-child(8){transition-delay:calc(var(--pe-stagger)*8)}
  .mobile-menu a:active,.mobile-menu a:hover{color:#ffe9ad}
  /* the booking CTA stays a CTA: gold pill at the end of the setlist */
  .mobile-menu a.book{
    margin-top:1.1rem;align-self:flex-start;padding:.85rem 1.9rem!important;
    border-radius:999px;border:1px solid rgba(56,36,6,.9)!important;
    font-family:var(--sans)!important;font-size:1rem!important;font-weight:800;
    letter-spacing:.06em;text-transform:uppercase;
    background:linear-gradient(180deg,#ffedb8 0%,#f0cd6d 35%,#c9962e 100%)!important;
    color:#201303!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 8px 26px rgba(0,0,0,.5),0 0 30px rgba(232,195,108,.4);
  }
  .mobile-menu a.book::before{content:none}
}
/* keep the hamburger a 48px target with an X that snaps on the signature ease */
.menu-toggle span{transition:transform var(--pe-dur-fast) var(--pe-ease-spring),opacity var(--pe-dur-fast) var(--pe-ease-sig)}
/* the nav (logo + hamburger) stays above the open overlay so the X is always
   tappable — no dead-end fullscreen */
body.menu-open .nav{position:fixed;z-index:130}
body.menu-open .menu-toggle{position:relative;z-index:2}

/* ---- footer as destination: viewport-scale CTA type + magnetic socials ----
   .footer-local SEO rows keep their markup and position, untouched. */
.footer-cta{
  position:relative;text-align:center;overflow:hidden;
  padding:clamp(3.2rem,8vw,5.5rem) clamp(1.2rem,5vw,4rem) clamp(1rem,3vw,2rem);
}
.footer-cta::before{ /* warm up-glow behind the type */
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 90% at 50% 100%,rgba(232,195,108,.14),transparent 70%);
}
.footer-cta-kicker{
  position:relative;display:inline-block;font-size:.68rem;font-weight:800;
  letter-spacing:.3em;text-transform:uppercase;color:#d9ab4c;margin-bottom:1rem;
}
.footer-cta-big{position:relative;font-family:var(--display);font-weight:600;font-size:clamp(2.7rem,11vw,7.2rem);line-height:.94;letter-spacing:-.02em;max-width:14ch;margin:0 auto .9rem;color:#edc66d;-webkit-text-fill-color:#edc66d;text-shadow:0 -1px 1px rgba(255,251,235,.55), 0 1px 0 rgba(74,48,12,.55), 0 2px 0 rgba(20,12,2,.85), 0 10px 26px rgba(0,0,0,.7), 0 0 30px rgba(240,214,150,.28);filter:none;}
.footer-cta-sub{
  position:relative;color:#cfc9bc;font-size:clamp(.95rem,2.4vw,1.1rem);
  max-width:52ch;margin:0 auto 1.8rem;line-height:1.7;
}
.footer-cta-actions{
  position:relative;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;
  margin-bottom:2.4rem;
}
.footer-cta-actions .btn{min-height:52px}
.foot-socials{
  position:relative;display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;
  padding:1.4rem 0 0;border-top:1px solid rgba(212,165,72,.22);
}
.foot-socials a{
  display:inline-flex;align-items:center;gap:.6rem;min-height:48px;
  padding:.7rem 1.25rem;border-radius:999px;text-decoration:none;
  border:1px solid rgba(232,195,108,.5);color:#f6db9c;font-weight:700;font-size:.92rem;
  background:linear-gradient(180deg,rgba(232,195,108,.14),rgba(232,195,108,.03));
}
.foot-socials a svg{width:20px;height:20px}
.foot-socials a:hover{
  border-color:rgba(246,219,156,.95);
  box-shadow:0 8px 26px rgba(0,0,0,.5),0 0 30px rgba(232,195,108,.4);
  color:#fff;
}
@media (prefers-reduced-motion:reduce){
  .footer-cta::before{display:none}
}

/* ============ 9.0 ROADMAP ITEM 13 — "YOUR NIGHT" PINNED SCROLL SEQUENCE
   (staged 2026-09-25). One scrubbed narrative on the homepage:
   ceremony → first dance → packed floor → last song. Transform + opacity
   only, driven by a rAF-throttled scrub loop (same pattern as the hero choreo).
   Without JS / with reduced-motion: the beats stack as a normal section. */
.yn-sequence{position:relative;background:#070503;overflow:clip}
.yn-beat{ /* static fallback: stacked, fully visible */
  position:relative;opacity:1;min-height:88svh;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(3rem,8vw,5rem) clamp(1.2rem,5vw,4rem);
}
.yn-beat-media{position:absolute;inset:0;overflow:hidden}
.yn-beat-media img{width:100%;height:100%;object-fit:cover;
  filter:saturate(.9) contrast(1.1) brightness(.55)}
.yn-beat-media::after{content:"";position:absolute;inset:0;
  background:radial-gradient(85% 75% at 50% 42%,rgba(232,195,108,.14),transparent 55%),
    linear-gradient(180deg,rgba(4,5,7,.72) 0%,rgba(4,5,7,.28) 35%,rgba(4,5,7,.34) 65%,rgba(4,5,7,.88) 100%)}
.yn-beat-copy{position:relative;z-index:2;text-align:center;max-width:900px;
  padding:2.2rem 2.6rem;border-radius:18px;
  background:radial-gradient(120% 120% at 50% 45%,rgba(3,4,6,.78) 0%,rgba(3,4,6,.55) 55%,rgba(3,4,6,.28) 100%);
}
.yn-beat-no{
  display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.34em;text-indent:.34em;
  text-transform:uppercase;color:#d9ab4c;margin-bottom:1.1rem;
}
.yn-beat-no b{color:#f6db9c}
.yn-beat-title{font-family:var(--display);font-weight:600;font-size:clamp(2.6rem,10vw,6.4rem);line-height:.96;letter-spacing:-.02em;margin:0 0 1rem;color:#edc66d;-webkit-text-fill-color:#edc66d;text-shadow:0 -1px 1px rgba(255,251,235,.55), 0 1px 0 rgba(74,48,12,.55), 0 2px 0 rgba(20,12,2,.9), 0 4px 18px rgba(0,0,0,.95), 0 12px 30px rgba(0,0,0,.9), 0 0 34px rgba(240,214,150,.3);filter:none;}
.yn-beat-sub{
  font-family:var(--display);font-style:italic;font-size:clamp(1.1rem,3vw,1.6rem);
  color:#f3e9d2;text-shadow:0 2px 16px #000;max-width:44ch;margin:0 auto;line-height:1.55;
}
.yn-progress{
  position:absolute;z-index:3;left:50%;bottom:1.6rem;transform:translateX(-50%);
  display:flex;gap:.7rem;align-items:center;
}
.yn-progress i{
  width:34px;height:3px;border-radius:2px;background:rgba(246,219,156,.22);
  overflow:hidden;position:relative;
}
.yn-progress i::after{content:"";position:absolute;inset:0;background:#f6db9c;
  transform:scaleX(0);transform-origin:left center}
.yn-sr-title{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}

/* live mode: sticky pin, beats absolutely stacked, JS scrubs opacity/scale */
.yn-live{height:430svh}
.yn-live .yn-pin{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden}
.yn-live .yn-beat{position:absolute;inset:0;min-height:0;opacity:0;will-change:transform,opacity}
.yn-live .yn-progress{position:absolute}
.yn-live .yn-beat-copy{will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){
  .yn-live{height:auto}
  .yn-live .yn-pin{position:static;height:auto}
  .yn-live .yn-beat{position:relative;inset:auto;opacity:1;min-height:88svh;transform:none!important}
}
@media (max-width:640px){
  .yn-beat{min-height:80svh}
  .yn-live .yn-pin{min-height:520px}
}

/* ============ 9.0 ROADMAP ITEM 12 — BOOKING-FLOW MICRO-INTERACTIONS
   (staged 2026-09-25). Predictive hover: the package card telegraphs its
   next step — the CTA pre-activates and the card lifts before the click.
   Button morphs (working/done) live in the item-9 block; shake in item 9. */

/* predictive hover: hovering the card pre-arms its CTA */
.package .btn{
  transition:transform var(--pe-dur-fast) var(--pe-ease-spring),
    box-shadow var(--pe-dur-med) var(--pe-ease-sig),
    filter var(--pe-dur-med) var(--pe-ease-sig),
    border-color var(--pe-dur-med) var(--pe-ease-sig),
    background-color var(--pe-dur-med) var(--pe-ease-sig)!important;
}
.package:hover,.package:focus-within{transform:translateY(-6px)}
.package:hover .btn,.package:focus-within .btn{
  transform:translateY(-2px);
  border-color:rgba(246,219,156,.95)!important;
  box-shadow:inset 0 0 0 1px rgba(20,12,2,.5),inset 0 1px 0 rgba(255,235,180,.5),
    0 10px 28px rgba(0,0,0,.6),0 0 46px rgba(232,195,108,.5)!important;
  filter:brightness(1.06);
}
.package.featured:hover,.package.featured:focus-within{transform:translateY(-6px) scale(1.01)}
/* the retainer line brightens as the "this is how you lock it" hint */
.package-retainer{transition:color var(--pe-dur-fast) var(--pe-ease-sig)}
.package:hover .package-retainer,.package:focus-within .package-retainer{color:#ffe9ad}
/* wizard date-check button morphs when the date confirms open */
#wz-lock-now{position:relative}
#wz-lock-now.pe-btn-working{padding-right:2.6rem}
/* inline error text announcing into aria-live regions stays readable */
.wz-status,.bk-status,.hero-dc-result,.datecheck-result{scroll-margin-top:120px}

/* ============ 9.0 ROADMAP ITEM 15 — MEMBER SUITE MILESTONES + RECAP
   (staged 2026-09-25). Wedding countdown milestones, name/date-driven
   identity line, and the song-picker → "your night" recap surface. */

/* milestone ribbon under the countdown line */
.milestone-ribbon{
  display:flex;align-items:center;justify-content:center;gap:.7rem;
  margin:1rem auto 0;max-width:640px;flex-wrap:wrap;
}
.milestone-dot{width:9px;height:9px;border-radius:50%;background:rgba(232,195,108,.28);
  box-shadow:inset 0 1px 1px rgba(0,0,0,.5)}
.milestone-dot.is-past{background:linear-gradient(180deg,#f6db9c,#c9962e);
  box-shadow:0 0 10px rgba(232,195,108,.6)}
.milestone-dot.is-now{background:linear-gradient(180deg,#fff3c4,#e8c46a);
  box-shadow:0 0 14px rgba(232,195,108,.9);animation:pe-ms-pulse 2.2s var(--pe-ease-io) infinite}
@keyframes pe-ms-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}
.milestone-label{
  flex-basis:100%;text-align:center;font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:#e8c96a;font-weight:700;
}
/* name/date-driven identity line */
.event-identity{
  text-align:center;font-family:var(--display);font-size:clamp(1.05rem,2.8vw,1.4rem);
  color:#f6ecd2;margin:.6rem 0 0;letter-spacing:.02em;
  text-shadow:0 2px 12px rgba(0,0,0,.8);
}
.event-identity .ei-date{color:#e8c96a;white-space:nowrap}
/* "your night, so far" recap surface */
.recap-panel{
  position:relative;max-width:1060px;margin:clamp(2.5rem,6vw,4.5rem) auto;
  padding:clamp(2rem,5vw,3.2rem) clamp(1.1rem,4vw,2.8rem);
  border:1px solid rgba(212,165,72,.38);border-radius:22px;overflow:hidden;
  background:radial-gradient(80% 60% at 50% 0%,rgba(212,165,72,.12),transparent 70%),
    linear-gradient(180deg,#0e0a06 0%,#070503 100%);
  box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 0 70px rgba(212,165,72,.05);
}
.recap-panel[hidden]{display:none!important}
.recap-kicker{text-align:center;text-transform:uppercase;letter-spacing:.34em;font-size:11px;
  color:#e8c46a;margin:0 0 .7rem;font-family:var(--sans)}
.recap-title{text-align:center;font-size:clamp(2rem,5.4vw,3.4rem);line-height:1.05;
  margin:0 0 1rem;font-weight:700}
.recap-lede{text-align:center;color:#cfc9bc;max-width:58ch;margin:0 auto 1.8rem;line-height:1.7}
.recap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:1.6rem}
.recap-card{background:rgba(255,255,255,.03);border:1px solid rgba(232,195,108,.22);
  border-radius:14px;padding:1.1rem 1.25rem}
.recap-card h4{font-family:var(--sans);font-size:.68rem;font-weight:800;letter-spacing:.22em;
  text-transform:uppercase;color:#e8c46a;margin:0 0 .7rem}
.recap-card ul{margin:0;padding:0;list-style:none}
.recap-card li{margin:.4rem 0;font-size:.95rem;line-height:1.5;color:#f5efe2}
.recap-card li span{display:block;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:#a9a294}
.recap-card .recap-taste{font-style:italic;color:#f6db9c;line-height:1.65}
.recap-actions{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;margin-top:.4rem}
.recap-empty{text-align:center;color:#a9a294;font-style:italic;padding:1.6rem 0}
.recap-note{text-align:center;color:#8f887b;font-size:.84rem;margin:1.2rem 0 0;font-style:italic}
@media (prefers-reduced-motion:reduce){
  .milestone-dot.is-now{animation:none}
}

/* ============ 9.0 ITEM 9 — preloader intro hold (JS removes it on exit) ==== */
/* S1 (ARRIVAL-FIX-SPEC, applied 2026-10-18): lockup pre-arrival hide rule,
   moved verbatim from index.html's late <style id="pe26-trends"> block.
   This sheet is render-blocking and linked before the hero markup, so the
   hidden state holds from first parse — no flash-then-hide. The reveal
   rules (.js.pe26-ready …) outrank it by specificity whenever they fire. */
.js .hero-lockup>*{opacity:0;transform:translateY(46px);
  transition:opacity 1.05s var(--pe26-ease),transform 1.05s var(--pe26-ease)}

.pe-holding-intro .hero-lockup>*{
  opacity:0!important;transform:translateY(46px)!important;
}
/* item 13: JS-driven progress fill for the pinned sequence */
.yn-progress i::after{transform:scaleX(var(--yn-fill,0))}

/* ============ 9.0 roadmap URGENT bugfix (2026-09-25): mobile sheen freeze ============
   Infinite sheen sweeps on huge background-clip:text type compound the Chromium
   glyph-mask tessellation artifact ("wireframe"/ghosting, confirmed on Barry's
   phone) and jank mobile GPUs. Freeze them at mobile widths — every sheen's rest
   state parks the highlight off-canvas by design, so the static champagne metal
   still reads bright and dimensional. Desktop keeps the full motion. */
@media (max-width:700px){
  .datecheck h2,.datecheck-steps strong,
  .hero h1,.hero h1 em,.lockup-proud,
  .pe-metal,.metal-type,.xprod-h,.portal-hero h1,
  .section-head h2,.section h2,.energy h2,.residencies h2,.nights h2,.kind-words h2,
  #nights-title,.package .price,.party-card .price,.package h3,.party-card h4,
  .package-media h3,.setup-choice-head h3,.addon-menu-head h3,.production h3,.service-info h3,
  .kicker,.sec-no,.tier,.addon-price,.day,.quote p,.footer-lead strong,
  .city-hero h1,.venue-hero h1
  {animation:none!important}
}

/* ============ 9.0 ROADMAP ITEM 16 — SOUND-OFF HERO (staged 2026-09-25) ============
   "Luxury wedding DJ" is explicit in the lockup, visible with or without the
   video, before any scroll. Small kicker, same champagne material language. */
.lockup-eyebrow{
  font-family:var(--sans);font-size:.72rem;font-weight:800;
  letter-spacing:.42em;text-indent:.42em;text-transform:uppercase;
  color:#eec95e;margin:0 0 .5rem;text-shadow:0 2px 12px #000,0 0 24px rgba(232,195,108,.35);
}
@media (max-width:640px){
  .lockup-eyebrow{font-size:.62rem;letter-spacing:.32em;text-indent:.32em}
}
@media (prefers-reduced-motion:reduce){
  .lockup-eyebrow{text-shadow:0 2px 12px #000}
}

/* ============ 9.0 ROADMAP ITEM 17 — DESIGN ELEGANCE FLOW (staged 2026-09-25) ============
   The motion 7→9 climb: scroll-choreographed reveals, parallax depth layers,
   and champagne-gold accent sweeps — one grammar across all 44 pages.
   Driven by /assets/js/pe-motion.js (IO + rAF, transform/opacity only).
   - .pe-rv: JS-added pre-reveal state; .in reveals (one-way); JS cleans up
     the classes after the transition so native hover transitions return.
   - .pe-flow: section entered → its h2 gold underline re-sweeps (the
     champagne accent moment), on the signature ease.
   - [data-plx]: parallax depth layers, rAF-driven via --pe-plx-y.
   - .bn-sequence: the signature "How a Proud night is built" pinned scrub
     (build-your-night.html) — mirrors the proven yn-sequence pattern.
   Reduced-motion / no-JS: everything stays fully visible and static.
   ===================================================================================== */

/* ---- one reveal grammar ---- */
.pe-rv{
  opacity:0;
  transform:translate3d(0,34px,0);
  transition:opacity var(--pe-dur-cine) var(--pe-ease-sig),
    transform var(--pe-dur-cine) var(--pe-ease-sig);
  transition-delay:var(--pe-rv-d,0s);
}
.pe-rv:not(.in){will-change:transform,opacity}
.pe-rv.pe-rv-l{transform:translate3d(-42px,0,0)}
.pe-rv.pe-rv-r{transform:translate3d(42px,0,0)}
.pe-rv.pe-rv-s{transform:scale(.93)}
.pe-rv.pe-rv-f{transform:none}
.pe-rv.in{opacity:1;transform:none} /* transform returns to natural — hover lifts untouched */
/* low-end: simple fades, no travel, shorter run */
html.pe-simple .pe-rv{transform:none!important}
html.pe-simple .pe-rv{
  transition-duration:.5s;
}

/* ---- parallax depth layers (JS sets --pe-plx-y) ---- */
[data-plx]{transform:translate3d(0,var(--pe-plx-y,0px),0)}
[data-plx].pe-plx-on{will-change:transform}
/* bleed so drifting backgrounds never expose an edge */
.hero-bg[data-plx]{inset:-10% 0}

/* ---- champagne accent sweep: the h2 gold rule redraws as its section enters ---- */
.pe-flow h2::after{animation:none!important;transform:scaleX(0)}
@media (prefers-reduced-motion:no-preference){
  .pe-flow.in h2::after{animation:underline-sweep 1.1s var(--pe-ease-sig) .3s both}
}

/* ---- signature sequence: "HOW A PROUD NIGHT IS BUILT" ----------------------
   Pinned scrollytelling on build-your-night.html: the room → the setup →
   the light → the crowd → the moment. Same choreography as the homepage
   yn-sequence (item 13): beats crossfade + settle-scale, media breathes,
   progress dots fill. Static stacked fallback without JS / reduced motion. */
.bn-sequence{position:relative;background:#070503;overflow:clip}
.bn-beat{ /* static fallback: stacked, fully visible */
  position:relative;opacity:1;min-height:88svh;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(3rem,8vw,5rem) clamp(1.2rem,5vw,4rem);
}
.bn-beat-media{position:absolute;inset:0;overflow:hidden}
.bn-beat-media img{width:100%;height:100%;object-fit:cover;
  filter:saturate(.92) contrast(1.08) brightness(.55)}
.bn-beat-media::after{content:"";position:absolute;inset:0;
  background:radial-gradient(85% 75% at 50% 42%,rgba(232,195,108,.14),transparent 55%),
    linear-gradient(180deg,rgba(4,5,7,.74) 0%,rgba(4,5,7,.26) 35%,rgba(4,5,7,.32) 65%,rgba(4,5,7,.9) 100%)}
.bn-beat-copy{position:relative;z-index:2;text-align:center;max-width:920px;will-change:transform,opacity;
  padding:2.2rem 2.6rem;border-radius:18px;
  background:radial-gradient(120% 120% at 50% 45%,rgba(3,4,6,.78) 0%,rgba(3,4,6,.55) 55%,rgba(3,4,6,.28) 100%);
}
.bn-beat-no{
  display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.34em;text-indent:.34em;
  text-transform:uppercase;color:#d9ab4c;margin-bottom:1.1rem;
}
.bn-beat-no b{color:#f6db9c}
.bn-beat-title{font-family:var(--display,Georgia,serif);font-weight:600;font-size:clamp(2.6rem,10vw,6.4rem);line-height:.96;letter-spacing:-.02em;margin:0 0 1rem;color:#edc66d;-webkit-text-fill-color:#edc66d;text-shadow:0 -1px 1px rgba(255,251,235,.55), 0 1px 0 rgba(74,48,12,.55), 0 2px 0 rgba(20,12,2,.9), 0 4px 18px rgba(0,0,0,.95), 0 12px 30px rgba(0,0,0,.9), 0 0 34px rgba(240,214,150,.3);filter:none;}
.bn-beat-sub{
  font-family:var(--display,Georgia,serif);font-style:italic;font-size:clamp(1.1rem,3vw,1.6rem);
  color:#f3e9d2;text-shadow:0 2px 16px #000;max-width:46ch;margin:0 auto;line-height:1.55;
}
.bn-kicker{
  position:absolute;z-index:3;top:1.4rem;left:0;right:0;text-align:center;
  font-size:.66rem;font-weight:800;letter-spacing:.4em;text-indent:.4em;
  text-transform:uppercase;color:rgba(217,171,76,.85);text-shadow:0 2px 12px #000;
  pointer-events:none;
}
.bn-progress{
  position:absolute;z-index:3;left:50%;bottom:1.6rem;transform:translateX(-50%);
  display:flex;gap:.7rem;align-items:center;
}
.bn-progress i{
  width:34px;height:3px;border-radius:2px;background:rgba(246,219,156,.22);
  overflow:hidden;position:relative;
}
.bn-progress i::after{content:"";position:absolute;inset:0;background:#f6db9c;
  transform:scaleX(var(--bn-fill,0));transform-origin:left center}
.bn-sr-title{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
/* live mode: sticky pin, beats absolutely stacked, JS scrubs opacity/scale */
.bn-live{height:520svh}
.bn-live .bn-pin{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden}
.bn-live .bn-beat{position:absolute;inset:0;min-height:0;opacity:0;will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){
  .bn-live{height:auto}
  .bn-live .bn-pin{position:static;height:auto}
  .bn-live .bn-beat{position:relative;inset:auto;opacity:1;min-height:88svh;transform:none!important}
  .bn-progress{display:none}
}
@media (max-width:640px){
  .bn-beat{min-height:80svh}
  .bn-live .bn-pin{min-height:520px}
}

/* ---- reduced-motion master: the global net in pe-polish already freezes
   transitions; here we also park every elegance-flow state at rest ---- */
@media (prefers-reduced-motion:reduce){
  .pe-rv{opacity:1!important;transform:none!important;transition:none!important}
  [data-plx]{transform:none!important}
  .pe-flow h2::after{transform:scaleX(1)}
}

/* 2026-10-02 — Approved PROUD wordmark (v19): replaces CSS-text .lockup-proud (U rendered wrong) */
.lockup-proud-img{margin:.8rem 0 1.45rem;line-height:0;text-align:center}
.lockup-proud-img img{width:min(560px,72vw);height:auto;display:inline-block;filter:drop-shadow(0 10px 24px rgba(0,0,0,.85)) drop-shadow(0 0 30px rgba(240,214,150,.22))}

/* 2026-10-07 — Booking testimonial quote readability (Barry: phone screenshot — "Too dark on website", text colliding/lapping on borders) */
.booking-proof{padding:clamp(3rem,7vw,4.5rem) clamp(2.5rem,6vw,4rem)}
.booking-proof p{background:none!important;color:#f7f0dd!important;-webkit-text-fill-color:#f7f0dd!important;text-shadow:0 2px 16px rgba(0,0,0,.75),0 1px 0 rgba(0,0,0,.55)}

/* ============ 1B. BUTTON ELEVATION — Pass 2 (2026-10-19) ============
   Barry 2026-10-19 00:43: "down to our buttons... I feel we could do better
   visually" + the standing standard (2026-10-18): "so cool the little kid
   in you can't help but want to push it." Pass-2 audit (computed-style
   probes + close-up captures, qa-pass2-2026-10-19/buttons/): the site-wide
   primary already carries the v23 SATIN grade from pe-main (engraved
   label, ring, inset base shade, restrained glow) — that language is
   KEPT, not overridden. What was missing: real press travel (the generic
   :active dip was 1px with no shadow squash), any :disabled face (the
   wizard's disabled Continue probed opacity 1 wearing the full live face —
   cursor was the only signal), and living light on first-screen CTAs.
   This section adds exactly those three, in the house spring + palette. */
@keyframes pe-btn-glow {
  0%,100% { box-shadow:0 0 0 1px rgba(24,14,2,.9), inset 0 -3px 8px rgba(74,42,4,.45), 0 10px 26px rgba(0,0,0,.55), 0 0 26px rgba(232,195,108,.22); }
  50%     { box-shadow:0 0 0 1px rgba(24,14,2,.95), inset 0 -3px 8px rgba(74,42,4,.45), 0 12px 30px rgba(0,0,0,.55), 0 0 44px rgba(232,195,108,.42); }
}
/* first-screen primaries breathe — desktop only, honoring the house
   mobile freeze law for animated light (urgent block, item 16 area) */
@media (min-width:701px) and (prefers-reduced-motion:no-preference) {
  .hero .btn-primary, .footer-cta-actions .btn-primary { animation:pe-btn-glow 4.5s ease-in-out infinite; }
}
/* press: 2px of travel and the shadow squashes like a real key */
.btn-primary:active {
  transform:translateY(2px)!important;
  box-shadow:0 0 0 1px rgba(24,14,2,.95), inset 0 -1px 3px rgba(74,42,4,.5), inset 0 3px 8px rgba(60,38,4,.35), 0 4px 10px rgba(0,0,0,.5), 0 0 14px rgba(232,195,108,.18)!important;
  transition-duration:.06s;
}
.btn-gold:active {
  transform:translateY(2px)!important;
  box-shadow:0 0 0 1px rgba(20,12,2,.85), inset 0 1px 2px rgba(255,255,255,.8), inset 0 -2px 6px rgba(90,52,6,.55), inset 0 3px 8px rgba(60,38,4,.3), 0 4px 10px rgba(0,0,0,.55), 0 0 16px rgba(232,195,108,.25)!important;
  transition-duration:.06s;
}
/* disabled: a spent, unlit face (was: indistinguishable from live).
 * Pass 4 (2026-10-21): "spent" had collapsed into UNREADABLE — dark
 * olive under 75% near-black text measured ~1.3:1 (owner screenshot:
 * "Buttons look dark"). The face stays visibly muted (grey-gold, no
 * glow, no lift) but the label is full-strength and measured:
 * 6.7:1 / 4.9:1 against the two stops. A gated bride reads it. */
.btn:disabled, .btn[disabled], .btn[aria-disabled="true"] { cursor:not-allowed; }
.btn-primary:disabled, .btn-primary[disabled], .btn-primary[aria-disabled="true"],
.btn-gold:disabled, .btn-gold[disabled], .btn-gold[aria-disabled="true"] {
  background:linear-gradient(180deg,#b3a06e,#9c8753)!important;
  color:#241a06!important;
  box-shadow:inset 0 2px 6px rgba(30,20,4,.4), inset 0 -1px 0 rgba(255,240,200,.22)!important;
  text-shadow:none!important; transform:none!important; filter:none!important; animation:none!important;
}
.btn-ghost:disabled, .btn-ghost[disabled] { opacity:.6; box-shadow:none!important; transform:none!important; }
/* text-link buttons: bare underline -> lit link */
.wz-textbtn { text-underline-offset:3px; transition:color .22s ease, text-shadow .25s ease; }
.wz-textbtn:hover { color:#f6db9c; text-shadow:0 0 14px rgba(232,195,108,.35); }
/* planner swipe buttons: floor shadow + press for the base pill
   (.sn-btn--gold already carries its own gradient/lift — untouched) */
.sn-btn { box-shadow:inset 0 1px 0 rgba(255,235,180,.18), 0 6px 16px rgba(0,0,0,.4); }
.sn-btn:not(:disabled):active { transform:translateY(1px); box-shadow:inset 0 3px 8px rgba(10,6,0,.4), 0 3px 8px rgba(0,0,0,.4); }

/* Pass 2 A-19: wizard error architecture — before this, a failed send set
   one champagne sentence (identical in color to info text), no error class,
   no aria-invalid, no field highlight (Pass-2 states capture, both
   viewports). The sentence now wears the house error color used by
   .form-status.error, and the offending fields are marked + highlighted. */
.wz-status.error { color:#ffb4a6; }
#book-wizard input[aria-invalid="true"] {
  border-color:#ffb4a6!important;
  box-shadow:0 0 0 2px rgba(255,180,166,.22)!important;
}

/* ===== B-3 (2026-10-19, SCORE-RAISE build queue W1): nav / menu / footer hit
   areas >= 44px tall — internal geometry only. No type, color, spacing
   rhythm or gold-system changes; links gain min-height + centering so the
   tappable box meets the 44px floor measured in Pass 2 §2.2. ===== */
.nav a:not(.brand) { min-height:44px; display:inline-flex; align-items:center; }
footer a { min-height:44px; display:inline-flex; align-items:center; }

/* ============ B-7 (Wave 2, 2026-10-19): short-viewport hero rhythm ============
   Measured before: the hero stack (medal 302 + lockup lines + CTA) is ~917px
   tall, so at a 900px viewport the "Check Your Date" CTA bottom sits at 874
   (26px slack) and at 800px it falls to 915 — below the fold. On desktop-width
   screens up to 900px tall, compress ONLY vertical rhythm: hero padding, the
   medal's size (vh-clamped), and the lockup's internal margins. Artwork,
   words, and taller layouts are untouched; the <=620px mobile hero keeps its
   own rules (this block starts at 621px). Higher-specificity selectors so the
   block wins over the homepage's inline lockup styles at any load order. */
@media (max-height:900px) and (min-width:621px){
  .hero .hero-inner{padding-top:clamp(3.5rem,7vh,5rem);padding-bottom:clamp(1.5rem,3.5vh,2.5rem)}
  .hero .lockup-medal{width:clamp(210px,30vh,302px)}
  .hero .lockup-proud-img{margin:.5rem 0 .9rem}
  .hero .lockup-rule{margin-top:.7rem}
  .hero .lockup-tag{margin-top:.8rem}
  .hero .lockup-solo{margin-top:.55rem}
  .hero .lockup-domain{margin-top:.55rem}
  .hero .hero-actions{margin-top:1.1rem}
}

/* ============ B-8 (Wave 2, 2026-10-19): PS-09 review adjacency ============
   Real reviews at the anxiety peaks (evidence doc PS-09): the homepage date
   checker, the homepage pricing head, and Build Your Night's date step each
   carry one of the site's existing review cards — the same words, stars, and
   attribution as the Kind Words originals, in a compact strip. No new copy. */
.ps09-quote{max-width:760px;margin:1.6rem auto 0;padding:1.1rem 1.4rem;background:#121419;border-top:2px solid var(--gold);box-shadow:0 14px 34px rgba(0,0,0,.55)}
.ps09-quote .stars{color:#edc66d;letter-spacing:.2em;font-size:.85rem;margin-bottom:.45rem}
.ps09-quote p{font-family:var(--display);font-size:1.12rem;line-height:1.42;margin:0 0 .5rem;color:#f6db9c}
.ps09-quote cite{font-style:normal;color:var(--gold-pale);font-size:.8rem;line-height:1.5}
.datecheck .ps09-quote{margin:1.6rem 0 0;max-width:560px}
.byn-step .ps09-quote{margin:1.2rem 0 1.4rem;max-width:640px}

/* ============ PASS 4 (2026-10-21) — package CTA legibility ============
 * Owner screenshot: the package cards' CHECK AVAILABILITY rendered as a
 * dark slab with a near-invisible label. Cascade proof (computed styles,
 * live page, returning session): the package CTAs are plain .btn, and
 * this sheet's generic ghost face (.btn:not(.btn-primary):not(.btn-gold),
 * specificity 0-3-0, !important, later sheet) overrode pe-main's bright
 * package face (same specificity, !important) — while pe-main's dark
 * label (#1a1104, !important) survived. Result: near-black text on a
 * 5-20% gold wash over a dark card (~1.3-1.9:1). The rules below carry
 * an element+class bump (0-3-1) so the package face wins outright: the
 * bright gold standard, dark label, >= 4.6:1 against every stop. */
.packages .package a.btn, .packages .party-card a.btn,
.packages .package button.btn, .packages .party-card button.btn {
  background:linear-gradient(135deg,#f2d67f 0%,#d9a83f 48%,#a87c22 100%)!important;
  color:#1a1104!important;
  border:1px solid rgba(255,242,200,.7)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 26px rgba(217,168,63,.4)!important;
  text-shadow:none!important;
  font-weight:800!important;
}
.packages .package a.btn:hover, .packages .party-card a.btn:hover,
.packages .package button.btn:hover, .packages .party-card button.btn:hover {
  filter:brightness(1.09)!important;
}

/* finish pass FP-G5: bare links keep a designed focus ring */
a:focus-visible{outline:2px solid #e8bd60;outline-offset:2px}