/* ===========================================
   2027 SEASON TICKETS | Angel City FC
   HubSpot self-contained landing page.
   Module styles carried over from the 2027 Renewals
   (acfc-rnw-*) and 2027 Deposits (acfc-dep-*) pages.
   Light theme only.
   =========================================== */


  /* =============== RENEWALS MODULES =============== */

   :root {
    --sol-rosa: #f1b1a5;
    --sol-rosa-dark: #e0a094;
    --sol-rosa-soft: rgba(241, 177, 165, 0.18);
    --sol-rosa-glow: rgba(241, 177, 165, 0.30);
  
    --rnw-dark: #111111;
    --rnw-dark-mid: #1a1a1a;
    --rnw-card-dark: #242424;
    --rnw-card-dark-border: rgba(255, 255, 255, 0.10);
  
    --rnw-surface: #fafaf8;
    --rnw-surface-warm: #f6f4f1;
    --rnw-panel: #ffffff;
    --rnw-panel-edge: #e8e6e3;
  
    /* Lighter / nostalgic "sun" palette, scoped to pillars + look-back modules */
    --rnw-cream: #f7f1e8;
    --rnw-paper: #fbf7f0;
    --rnw-paper-edge: #e6ddce;
    --rnw-sun: radial-gradient(120% 120% at 15% 0%, rgba(241, 177, 165, 0.55) 0%, rgba(247, 241, 232, 0.9) 45%, var(--rnw-cream) 100%);
    --font-serif: Georgia, 'Times New Roman', serif;
  
    --rnw-ink: #121416;
    --asphalt: #1c1c1c;
    --armour: #6b7280;
    --line-white: #ffffff;
    --pitch-black: #000000;
    --text-dark: #1c1c1c;
  
    --benefits-border-light: #ececec;
    --benefits-header-height: 3.25rem;
  
    /* Elevation scale: e1 resting hairline, e2 cards, e3 hero surfaces */
    --shadow-e1: 0 1px 2px rgba(28, 20, 16, 0.05), 0 1px 3px rgba(28, 20, 16, 0.04);
    --shadow-e2: 0 8px 28px rgba(28, 20, 16, 0.10), 0 2px 6px rgba(28, 20, 16, 0.05);
    --shadow-e3: 0 22px 60px rgba(28, 20, 16, 0.18), 0 4px 12px rgba(28, 20, 16, 0.07);
    --shadow-e3-rosa: 0 22px 60px rgba(28, 20, 16, 0.18), 0 0 0 1px rgba(241, 177, 165, 0.28);

    --shadow-sm: var(--shadow-e1);
    --shadow-card: var(--shadow-e2);
    --shadow-card-hover: var(--shadow-e3-rosa);

    /* Shared hover motion so every premium surface lifts identically */
    --lift-hover: 0 -3px;
    --lift-transition: translate 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out), border-color 0.35s ease;
  
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-full: 9999px;
  
    --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --transition: all 0.3s var(--ease-out);
    --rnw-scroll-offset: 50px;
    --rnw-faq-scroll-offset: 130px;
  
    /* Seat map tier colors */
    --tier-supporters: rgba(74, 155, 95, 0.62);
    --tier-supporters-active: rgba(74, 155, 95, 0.88);
    --tier-general: rgba(66, 133, 199, 0.58);
    --tier-general-active: rgba(66, 133, 199, 0.85);
    --tier-premium: rgba(155, 89, 182, 0.58);
    --tier-premium-active: rgba(155, 89, 182, 0.85);
    --tier-suites: rgba(212, 162, 76, 0.62);
    --tier-suites-active: rgba(212, 162, 76, 0.88);
  }
  
  *, *::before, *::after { box-sizing: border-box; }
  
  html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--rnw-scroll-offset);
  }
  
  html:has(.acfc-rnw-app) { overflow-x: hidden; }
  
  /* HubSpot SR offer bar (sr-offer-bar-01): omit on 2027 Renewals landing only */
  html:has(.acfc-rnw-app) .sr-offer-bar-01 {
    display: none !important;
  }
  
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      transition-duration: 0.01ms !important;
    }
    .acfc-rnw-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }
  }
  
  body {
    margin: 0;
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
    color: var(--text-dark);
    background: var(--rnw-surface);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
  }
  
  img { max-width: 100%; height: auto; display: block; }
  
  a { color: inherit; }
  
  /* ---------- Scroll reveal ---------- */
  
  .acfc-rnw-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.65s var(--ease-out), transform 0.65s var(--ease-out);
  }
  
  .acfc-rnw-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
  }
  
  /* Delays are listed per transitioned property (opacity, transform, then any
     hover properties) so a staggered card still reacts to hover instantly.
     Extra values are ignored on elements that only transition opacity/transform. */
  .acfc-rnw-reveal-stagger > .acfc-rnw-reveal:nth-child(2) { transition-delay: 0.08s, 0.08s, 0s, 0s, 0s; }
  .acfc-rnw-reveal-stagger > .acfc-rnw-reveal:nth-child(3) { transition-delay: 0.16s, 0.16s, 0s, 0s, 0s; }
  .acfc-rnw-reveal-stagger > .acfc-rnw-reveal:nth-child(4) { transition-delay: 0.24s, 0.24s, 0s, 0s, 0s; }
  .acfc-rnw-reveal-stagger > .acfc-rnw-reveal:nth-child(5) { transition-delay: 0.32s, 0.32s, 0s, 0s, 0s; }
  .acfc-rnw-reveal-stagger > .acfc-rnw-reveal:nth-child(6) { transition-delay: 0.40s, 0.40s, 0s, 0s, 0s; }
  
  /* Intro is above the fold on many viewports - show immediately, not on scroll */
  .acfc-rnw-intro .acfc-rnw-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  
  /* ---------- App wrapper ---------- */
  
  .acfc-rnw-app {
    width: 100%;
    max-width: 100%;
    background: var(--rnw-surface);
    cursor: default;
    -webkit-tap-highlight-color: transparent;
  }
  
  .acfc-rnw-app a,
  .acfc-rnw-app button,
  .acfc-rnw-app summary,
  .acfc-rnw-app [role="button"] {
    cursor: pointer;
  }
  
  /* ---------- Container ---------- */
  
  .angelcity2026-container {
    max-width: 1340px;
    margin: 0 auto;
    padding-left: max(24px, env(safe-area-inset-left, 0px));
    padding-right: max(24px, env(safe-area-inset-right, 0px));
  }
  
  @media (max-width: 600px) {
    .angelcity2026-container {
      padding-left: max(20px, env(safe-area-inset-left, 0px));
      padding-right: max(20px, env(safe-area-inset-right, 0px));
    }
  }
  
  /* ---------- Shared typography ---------- */
  
  .acfc-rnw-eyebrow {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.75rem, 1.8vw, 0.875rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sol-rosa);
    margin: 0 0 12px;
  }
  
  .acfc-rnw-section-head {
    text-align: center;
    margin-bottom: clamp(24px, 4vw, 40px);
  }
  
  .acfc-rnw-section-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.5rem, 3.5vw, 2.4rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--rnw-ink);
    margin: 0 0 8px;
    text-wrap: balance;
  }

  .acfc-rnw-section-title em {
    font-style: normal;
    font-weight: 900;
    color: var(--sol-rosa-dark);
  }
  
  .acfc-rnw-section-lead {
    font-size: clamp(0.95rem, 1.8vw, 1.05rem);
    color: var(--armour);
    margin: 0 auto;
    max-width: 640px;
    line-height: 1.65;
  }
  
  .acfc-rnw-section-head--light .acfc-rnw-section-title { color: var(--line-white); }
  .acfc-rnw-section-head--light .acfc-rnw-section-lead { color: rgba(255, 255, 255, 0.72); }
  
  .acfc-rnw-title--left { text-align: left; }
  .acfc-rnw-lead--left { text-align: left; margin: 0; }
  
  /* ============================================
     SIGNATURE SYSTEM - "dreams within reach"
     frosted glass · dreamy blur · image-in-text
     Shared across Why Renew / How It Works /
     Key Dates / Payment Plans / Benefits
     ============================================ */
  
  /* A section that carries a full-bleed dreamy photo backdrop */
  .acfc-rnw-signature {
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }
  
  .acfc-rnw-signature > .angelcity2026-container {
    position: relative;
    z-index: 1;
  }
  
  /* Dreamy blurred photo layer - keeps grit/intensity, never loses the image */
  .acfc-rnw-dreamy {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
  }
  
  .acfc-rnw-dreamy img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.1);
    filter: blur(8px) saturate(1.15) contrast(1.06);
  }
  
  /* Legibility scrim tuned per theme so text stays readable over the photo */
  .acfc-rnw-dreamy::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(130% 90% at 16% 0%, rgba(241, 177, 165, 0.32) 0%, transparent 52%),
      linear-gradient(180deg, rgba(251, 247, 240, 0.66) 0%, rgba(247, 241, 232, 0.78) 52%, var(--rnw-cream) 100%);
  }
  
  /* Legibility over dreamy photos - text only, no header panel */
  .acfc-rnw-signature .acfc-rnw-section-head .acfc-rnw-section-title {
    color: var(--asphalt);
    text-shadow:
      0 0 20px rgba(255, 255, 255, 0.85),
      0 1px 2px rgba(255, 255, 255, 0.9),
      0 2px 8px rgba(247, 241, 232, 0.7);
  }
  
  .acfc-rnw-signature .acfc-rnw-section-head .acfc-rnw-section-lead {
    color: rgba(28, 28, 28, 0.88);
    text-shadow:
      0 0 16px rgba(255, 255, 255, 0.8),
      0 1px 3px rgba(255, 255, 255, 0.75);
  }
  
  .acfc-rnw-signature .acfc-rnw-dates-note {
    color: rgba(28, 28, 28, 0.78);
    text-shadow:
      0 0 12px rgba(255, 255, 255, 0.75),
      0 1px 2px rgba(255, 255, 255, 0.7);
  }

  /* A quieter alternative to .acfc-rnw-signature: same section rhythm, no photo,
     just a soft tan/grey tonal wash so the module doesn't feel flat white. */
  .acfc-rnw-tonal {
    position: relative;
    isolation: isolate;
    background:
      radial-gradient(120% 100% at 18% 0%, rgba(241, 177, 165, 0.16) 0%, transparent 55%),
      linear-gradient(180deg, var(--rnw-cream) 0%, #efe8dc 48%, #e3dccf 100%);
  }

  /* Frosted-glass surface */
  .acfc-rnw-frost {
    position: relative;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-e3);
    -webkit-backdrop-filter: blur(18px) saturate(1.35);
    backdrop-filter: blur(18px) saturate(1.35);
  }

  /* Hairline highlight along the top edge reads as polished glass */
  .acfc-rnw-frost::after {
    content: '';
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 1px;
    border-radius: var(--radius-full);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
    pointer-events: none;
  }

  /* Hovering card families share one lift so it feels like one system. Lift
     uses `translate` rather than `transform` so it composes with the scroll
     reveal, which owns `transform` on these same elements. Plan and step cards
     are deliberately static - they are read, not clicked. */
  .acfc-rnw-pillar,
  .acfc-rnw-incentive,
  .acfc-rnw-spotlight-card {
    transition:
      opacity 0.65s var(--ease-out),
      transform 0.65s var(--ease-out),
      var(--lift-transition);
  }

  .acfc-rnw-pillar:hover,
  .acfc-rnw-pillar:focus-within {
    translate: var(--lift-hover);
    box-shadow: var(--shadow-card-hover);
    border-color: rgba(241, 177, 165, 0.55);
  }

  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-pillar:hover,
    .acfc-rnw-pillar:focus-within {
      translate: none;
    }
  }
  
  /* Solid fallback where backdrop-filter is unsupported */
  @supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
    .acfc-rnw-frost { background: rgba(255, 255, 255, 0.93); }
  }
  
  /* Image-in-text headline mask - player photo lives inside the type */
  .acfc-rnw-imgtext {
    background-image:
      linear-gradient(rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.28)),
      url('../../assets/315-match/03152026_vsChicago_AS-66.jpg');
    background-size: cover;
    background-position: center 26%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
  }
  
  /* "We" in the benefits headline: solid brand pink, not a photo mask */
  .acfc-rnw-imgtext--fans {
    background-image: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    color: var(--sol-rosa-dark);
    -webkit-text-fill-color: var(--sol-rosa-dark);
  }
  
  /* Solid fallback so masked type is never invisible */
  @supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    .acfc-rnw-imgtext { color: var(--asphalt); -webkit-text-fill-color: var(--asphalt); }
  }
  
  /* ---------- Buttons ---------- */
  
  .angelcity2026-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 2px solid transparent;
    border-radius: var(--radius-full);
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.015em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: var(--transition);
    padding: 0.95rem 2rem;
    white-space: nowrap;
    line-height: 1;
    -webkit-appearance: none;
    appearance: none;
  }
  
  .angelcity2026-btn-primary {
    background: var(--sol-rosa);
    color: var(--pitch-black);
    border-color: var(--sol-rosa);
  }
  
  a.angelcity2026-btn.angelcity2026-btn-primary,
  a.angelcity2026-btn.angelcity2026-btn-primary:hover,
  a.angelcity2026-btn.angelcity2026-btn-primary:focus-visible {
    color: var(--pitch-black);
  }
  
  .angelcity2026-btn-primary:hover,
  .angelcity2026-btn-primary:focus-visible {
    background: var(--sol-rosa-dark);
    border-color: var(--sol-rosa-dark);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px var(--sol-rosa-glow);
  }
  
  .angelcity2026-btn-secondary {
    background: transparent;
    color: var(--line-white);
    border-color: rgba(255, 255, 255, 0.45);
  }
  
  a.angelcity2026-btn.angelcity2026-btn-secondary,
  a.angelcity2026-btn.angelcity2026-btn-secondary:hover,
  a.angelcity2026-btn.angelcity2026-btn-secondary:focus-visible {
    color: var(--line-white);
  }
  
  .angelcity2026-btn-secondary:hover,
  .angelcity2026-btn-secondary:focus-visible {
    border-color: var(--line-white);
    background: rgba(255, 255, 255, 0.08);
  }
  
  /* Light mode override for secondary button on light backgrounds */
  [data-theme="light"] .angelcity2026-btn-secondary {
    color: var(--asphalt);
    border-color: rgba(28, 28, 28, 0.35);
  }
  
  [data-theme="light"] a.angelcity2026-btn.angelcity2026-btn-secondary,
  [data-theme="light"] a.angelcity2026-btn.angelcity2026-btn-secondary:hover,
  [data-theme="light"] a.angelcity2026-btn.angelcity2026-btn-secondary:focus-visible {
    color: var(--asphalt);
  }
  
  [data-theme="light"] .angelcity2026-btn-secondary:hover,
  [data-theme="light"] .angelcity2026-btn-secondary:focus-visible {
    border-color: var(--asphalt);
    background: rgba(28, 28, 28, 0.05);
  }

  /* The hero always sits on a dark photo/video with a fixed dark overlay,
     regardless of site theme, so its secondary button must keep the
     light-on-dark style even when the light-mode override above would
     otherwise darken it to the point of being unreadable. */
  [data-theme="light"] .acfc-rnw-hero-actions .angelcity2026-btn-secondary,
  [data-theme="light"] .acfc-rnw-hero-actions a.angelcity2026-btn.angelcity2026-btn-secondary {
    color: var(--line-white);
    border-color: rgba(255, 255, 255, 0.45);
  }

  [data-theme="light"] .acfc-rnw-hero-actions .angelcity2026-btn-secondary:hover,
  [data-theme="light"] .acfc-rnw-hero-actions .angelcity2026-btn-secondary:focus-visible,
  [data-theme="light"] .acfc-rnw-hero-actions a.angelcity2026-btn.angelcity2026-btn-secondary:hover,
  [data-theme="light"] .acfc-rnw-hero-actions a.angelcity2026-btn.angelcity2026-btn-secondary:focus-visible {
    border-color: var(--line-white);
    background: rgba(255, 255, 255, 0.08);
  }
  
  /* Disabled secondary button (e.g. "Member Hub Coming Soon"): greyed out,
     no hover/focus feedback since it isn't interactive. */
  .angelcity2026-btn-secondary[aria-disabled="true"],
  .angelcity2026-btn-secondary[aria-disabled="true"]:hover,
  .angelcity2026-btn-secondary[aria-disabled="true"]:focus-visible {
    color: rgba(255, 255, 255, 0.38);
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.04);
    cursor: not-allowed;
    pointer-events: none;
  }
  
  [data-theme="light"] .angelcity2026-btn-secondary[aria-disabled="true"],
  [data-theme="light"] .angelcity2026-btn-secondary[aria-disabled="true"]:hover,
  [data-theme="light"] .angelcity2026-btn-secondary[aria-disabled="true"]:focus-visible {
    color: rgba(28, 28, 28, 0.35);
    border-color: rgba(28, 28, 28, 0.16);
    background: rgba(28, 28, 28, 0.04);
  }
  
  .angelcity2026-btn-outline-dark {
    background: transparent;
    color: var(--asphalt);
    border-color: var(--rnw-panel-edge);
  }
  
  a.angelcity2026-btn.angelcity2026-btn-outline-dark,
  a.angelcity2026-btn.angelcity2026-btn-outline-dark:hover,
  a.angelcity2026-btn.angelcity2026-btn-outline-dark:focus-visible {
    color: var(--asphalt);
  }
  
  .angelcity2026-btn-outline-dark:hover {
    border-color: var(--sol-rosa);
    background: var(--sol-rosa-soft);
  }
  
  /* ---------- Jump nav ---------- */
  
  .acfc-rnw-jump {
    background: var(--rnw-paper);
    border-bottom: 1px solid var(--rnw-paper-edge);
    position: sticky;
    top: 0;
    z-index: 50;
  }
  
  .acfc-rnw-jump-inner {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 10px 0;
  }
  
  .acfc-rnw-jump-inner::-webkit-scrollbar { display: none; }
  
  .acfc-rnw-jump-label {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--armour);
    white-space: nowrap;
    margin-right: 4px;
  }
  
  /* Flex-centered with a fixed height instead of vertical padding: the pill
     then centres on the text box rather than on the font's line metrics,
     which sit high for all-caps text. */
  .acfc-rnw-jump-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    font-family: 'Inter', sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--asphalt);
    padding: 0 12px;
    border-radius: var(--radius-full);
    border: 1px solid rgba(28, 28, 28, 0.28);
    white-space: nowrap;
    transition: var(--transition);
  }
  
  .acfc-rnw-jump-link:hover,
  .acfc-rnw-jump-link:focus-visible {
    color: var(--pitch-black);
    background: var(--sol-rosa);
    border-color: var(--sol-rosa);
  }
  

  /* ---------- Hero ---------- */
  
  .acfc-rnw-hero {
    position: relative;
    min-height: clamp(360px, 52svh, 520px);
    display: flex;
    align-items: center;
    overflow: hidden;
    background: var(--rnw-dark);
  }
  
  .acfc-rnw-hero-media {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  
  .acfc-rnw-hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 45%;
  }
  
  .acfc-rnw-hero-fallback {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  /* Slight push on the source photo, then a one-time settle so the frame
     resolves into place instead of snapping in flat. */
  .acfc-rnw-hero-video,
  .acfc-rnw-hero-fallback {
    filter: saturate(1.06) contrast(1.04);
    animation: acfc-rnw-hero-settle 2.6s var(--ease-out) both;
  }

  @keyframes acfc-rnw-hero-settle {
    from { transform: scale(1.07); }
    to { transform: scale(1); }
  }
  
  /* Dense pocket behind the copy that clears quickly to the right, so the
     crowd stays legible rather than sitting under a flat grey wash. */
  .acfc-rnw-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      radial-gradient(125% 105% at 0% 50%, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.66) 28%, rgba(0, 0, 0, 0.22) 60%, transparent 84%),
      linear-gradient(to top, rgba(0, 0, 0, 0.74) 0%, rgba(0, 0, 0, 0.14) 36%, transparent 66%),
      radial-gradient(145% 125% at 50% 45%, transparent 52%, rgba(0, 0, 0, 0.45) 100%);
  }
  
  .acfc-rnw-hero-content {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: clamp(2rem, 4vw, 3.25rem) 0;
  }
  
  .acfc-rnw-hero-urgency {
    /*display: inline-flex;*/
    display: none;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.75rem, 1.8vw, 0.875rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sol-rosa);
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.55);
  }
  
  .acfc-rnw-hero-urgency-dot {
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--sol-rosa);
    box-shadow: 0 0 0 0 var(--sol-rosa-glow);
    animation: acfc-rnw-pulse 2s var(--ease-out) infinite;
  }
  
  @keyframes acfc-rnw-pulse {
    0% { box-shadow: 0 0 0 0 rgba(241, 177, 165, 0.6); }
    70% { box-shadow: 0 0 0 10px rgba(241, 177, 165, 0); }
    100% { box-shadow: 0 0 0 0 rgba(241, 177, 165, 0); }
  }
  
  .acfc-rnw-hero-trust {
    margin: 22px 0 0;
    font-size: clamp(0.8rem, 1.6vw, 0.92rem);
    font-weight: 600;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.88);
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.65);
  }
  
  .acfc-rnw-hero-trust span {
    color: var(--sol-rosa);
    margin: 0 6px;
  }
  
  /* A small tracked-out kicker over a heavier, larger statement line reads as
     a lockup rather than two same-weight lines stacked on top of each other -
     the size/weight/tracking all contrast on purpose. */
  .acfc-rnw-hero-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(2rem, 5.6vw, 3.65rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.035em;
    line-height: 0.98;
    text-wrap: balance;
    color: var(--line-white);
    margin: 0 0 clamp(14px, 1.6vw, 20px);
    max-width: 800px;
    /* Tight edge shadow for legibility plus a wide soft one for depth; a
       single large blur muddies the letterforms at this weight. */
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.38), 0 10px 34px rgba(0, 0, 0, 0.45);
  }

  /* Two-tier crescendo: "2027 Season Ticket" sets it up at full heading
     weight and size, then "Renewals" steps up again in scale, weight, and
     color for the payoff - no small kicker burying the year. */
  .acfc-rnw-hero-title-line {
    display: block;
  }

  .acfc-rnw-hero-title em {
    display: block;
    font-style: normal;
    font-size: 1.22em;
    font-weight: 900;
    letter-spacing: -0.045em;
    color: var(--sol-rosa);
    margin-top: 0.1em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 10px 34px rgba(0, 0, 0, 0.4);
  }
  
  .acfc-rnw-hero-lead {
    font-size: clamp(0.88rem, 1.65vw, 1.05rem);
    color: rgba(255, 255, 255, 0.92);
    max-width: 520px;
    margin: 0 0 16px;
    line-height: 1.55;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.7);
  }

  .acfc-rnw-hero-body {
    font-size: clamp(0.9rem, 1.5vw, 1.02rem);
    color: rgba(255, 255, 255, 0.82);
    max-width: 46ch;
    margin: 0 0 clamp(26px, 3vw, 34px);
    line-height: 1.55;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
  }
  
  .acfc-rnw-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
  }

  /* Hero buttons sit on photography, so they get a finer edge and a glass
     fill rather than the solid-surface treatment used elsewhere. */
  .acfc-rnw-hero-actions .angelcity2026-btn {
    border-width: 1.5px;
  }

  .acfc-rnw-hero-actions .angelcity2026-btn-primary {
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.34);
  }

  .acfc-rnw-hero-actions .angelcity2026-btn-secondary {
    background: rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  /* Cascade the hero in rather than landing every element at once. */
  .acfc-rnw-hero-title { transition-delay: 0.06s, 0.06s; }
  .acfc-rnw-hero-body { transition-delay: 0.15s, 0.15s; }
  .acfc-rnw-hero-actions { transition-delay: 0.24s, 0.24s; }
  
  @media (max-width: 768px) {
    .acfc-rnw-hero {
      min-height: clamp(300px, 60svh, 420px);
    }

    /* The left-weighted scrim is wrong once the copy centers. */
    .acfc-rnw-hero-overlay {
      background:
        linear-gradient(to top, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.55) 45%, rgba(0, 0, 0, 0.35) 100%),
        radial-gradient(140% 110% at 50% 45%, transparent 45%, rgba(0, 0, 0, 0.5) 100%);
    }
  
    .acfc-rnw-hero-content {
      padding-bottom: clamp(2.5rem, 8vw, 3.25rem);
    }
  
    .acfc-rnw-hero-content .angelcity2026-container {
      text-align: center;
    }
  
    .acfc-rnw-hero-urgency {
      justify-content: center;
    }
  
    .acfc-rnw-hero-title,
    .acfc-rnw-hero-lead,
    .acfc-rnw-hero-body {
      margin-inline: auto;
    }

    .acfc-rnw-hero-actions {
      justify-content: center;
    }
  
    .acfc-rnw-hero-trust {
      margin-top: 16px;
      font-size: 0.78rem;
      text-align: center;
    }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-hero-video {
      object-position: center 35%;
    }
  
    .acfc-rnw-hero-actions .angelcity2026-btn {
      width: 100%;
      max-width: 320px;
    }
  }
  

  /* ---------- VIP value block ---------- */
  
  .acfc-rnw-vip {
    background: var(--rnw-paper, #fafaf8);
    padding: clamp(56px, 8vw, 100px) 0;
    color: var(--asphalt);
  }

  /* Higher specificity than the plain .acfc-rnw-vip background above, so the
     tonal wash (no photo) wins when both classes are present on the section. */
  .acfc-rnw-vip.acfc-rnw-tonal {
    background:
      radial-gradient(120% 100% at 18% 0%, rgba(241, 177, 165, 0.16) 0%, transparent 55%),
      linear-gradient(180deg, var(--rnw-cream) 0%, #efe8dc 48%, #e3dccf 100%);
  }
  
  .acfc-rnw-vip-panel {
    max-width: 1100px;
    margin: 0 auto;
    padding: clamp(24px, 3vw, 34px) clamp(20px, 3vw, 34px) clamp(24px, 3vw, 32px);
    background:
      linear-gradient(160deg, rgba(241, 177, 165, 0.14) 0%, rgba(255, 255, 255, 0.72) 42%, rgba(255, 255, 255, 0.9) 100%);
    border: 1px solid rgba(241, 177, 165, 0.35);
    border-radius: var(--radius-lg, 16px);
    box-shadow: 0 18px 48px rgba(28, 28, 28, 0.06);
  }
  
  .acfc-rnw-vip-panel-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto clamp(20px, 2.6vw, 28px);
  }
  
  .acfc-rnw-vip-intro-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.5rem, 3.5vw, 2.4rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--asphalt);
    margin: 0;
  }
  
  /* "Season Ticket Benefits" is the sell, so it carries the size/weight
     emphasis; "vs Single Game Tickets" is the smaller qualifier line. */
  .acfc-rnw-vip-intro-title-line {
    display: block;
    font-size: 1.08em;
    font-weight: 900;
    letter-spacing: -0.03em;
  }

  .acfc-rnw-vip-intro-title em {
    font-style: normal;
    color: var(--sol-rosa-dark);
    display: block;
    font-size: 0.58em;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-top: 0.35em;
  }
  
  .acfc-rnw-vip-panel-lead {
    margin: 0;
    font-size: clamp(0.98rem, 1.8vw, 1.08rem);
    line-height: 1.65;
    color: rgba(28, 28, 28, 0.8);
  }
  
  @media (max-width: 768px) {
    .acfc-rnw-vip {
      padding: clamp(40px, 8vw, 72px) 0;
    }

    .acfc-rnw-vip-panel {
      padding: 28px 18px 32px;
      border-radius: var(--radius-lg, 16px);
      position: relative;
      box-shadow:
        0 0 0 1px rgba(241, 177, 165, 0.22),
        0 22px 56px rgba(28, 28, 28, 0.1);
    }

    .acfc-rnw-vip-panel-head {
      margin-bottom: 28px;
      padding: 0;
      position: relative;
      z-index: 1;
    }

    .acfc-rnw-vip-intro-title {
      font-size: clamp(1.35rem, 6.2vw, 1.8rem);
      letter-spacing: -0.02em;
      line-height: 1.05;
      margin-bottom: 16px;
    }

    .acfc-rnw-vip-intro-title-line {
      font-size: 1.05em;
    }

    .acfc-rnw-vip-intro-title em {
      margin-top: 0.3em;
      font-size: 0.56em;
    }

    .acfc-rnw-vip-panel-lead {
      font-size: 0.98rem;
      line-height: 1.7;
      max-width: 34em;
      margin-inline: auto;
    }

    .acfc-rnw-vsmatrix {
      position: relative;
      z-index: 1;
      padding-top: 20px;
    }
  }
  
  .acfc-rnw-vsmatrix {
    margin-top: 0;
    padding-top: clamp(18px, 2.5vw, 26px);
    border-top: 1px solid rgba(241, 177, 165, 0.28);
  }
  
  .acfc-rnw-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  
  /* Compact comparison matrix: one row per benefit, so the membership column
     reads as a single raised panel running the height of the table. */
  .acfc-rnw-vsmatrix-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
  }

  .acfc-rnw-vsmatrix-corner {
    width: 17%;
    background: none;
    border: 0;
  }

  .acfc-rnw-vsmatrix-head {
    width: 41.5%;
    padding: 11px clamp(12px, 1.6vw, 16px);
    text-align: left;
    vertical-align: bottom;
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.85rem, 1.7vw, 1rem);
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  .acfc-rnw-vsmatrix-head--single {
    color: rgba(28, 28, 28, 0.45);
  }

  /* Header caps the raised membership column */
  .acfc-rnw-vsmatrix-head--stm {
    color: var(--asphalt);
    background: linear-gradient(180deg, rgba(241, 177, 165, 0.88) 0%, rgba(241, 177, 165, 0.6) 100%);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    box-shadow: 0 -2px 20px rgba(241, 177, 165, 0.4);
  }

  /* Badge rides beside the name so the header stays one line tall */
  .acfc-rnw-vsmatrix-head-name {
    vertical-align: middle;
  }

  .acfc-rnw-vsmatrix-badge {
    display: inline-block;
    margin-left: 9px;
    padding: 3px 9px;
    border-radius: var(--radius-full);
    background: var(--asphalt);
    color: var(--sol-rosa);
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.5;
    vertical-align: middle;
    white-space: nowrap;
  }

  .acfc-rnw-vsmatrix-label {
    padding: clamp(11px, 1.4vw, 14px) 10px clamp(11px, 1.4vw, 14px) 0;
    text-align: left;
    vertical-align: top;
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--asphalt);
    border-bottom: 1px solid rgba(28, 28, 28, 0.09);
  }

  .acfc-rnw-vsmatrix-cell {
    padding: clamp(11px, 1.4vw, 14px) clamp(12px, 1.6vw, 16px);
    vertical-align: top;
    font-size: clamp(0.86rem, 1.4vw, 0.95rem);
    line-height: 1.45;
    border-bottom: 1px solid rgba(28, 28, 28, 0.09);
  }

  .acfc-rnw-vsmatrix-cell--single {
    color: rgba(28, 28, 28, 0.62);
  }

  .acfc-rnw-vsmatrix-cell--stm {
    color: var(--asphalt);
    background: rgba(241, 177, 165, 0.13);
    border-left: 1px solid rgba(241, 177, 165, 0.4);
    border-right: 1px solid rgba(241, 177, 165, 0.4);
  }

  .acfc-rnw-vsmatrix-table tbody tr:last-child .acfc-rnw-vsmatrix-label,
  .acfc-rnw-vsmatrix-table tbody tr:last-child .acfc-rnw-vsmatrix-cell--single {
    border-bottom: 0;
  }

  .acfc-rnw-vsmatrix-table tbody tr:last-child .acfc-rnw-vsmatrix-cell--stm {
    border-bottom: 1px solid rgba(241, 177, 165, 0.4);
    border-radius: 0 0 var(--radius-md) var(--radius-md);
  }

  .acfc-rnw-vsmatrix-val {
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }

  .acfc-rnw-vsmatrix-icon {
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    margin-top: 0.06em;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .acfc-rnw-vsmatrix-icon svg {
    width: 10px;
    height: 10px;
  }

  .acfc-rnw-vsmatrix-icon--no {
    background-color: rgba(28, 28, 28, 0.09);
    color: rgba(28, 28, 28, 0.42);
  }

  .acfc-rnw-vsmatrix-icon--yes {
    background-image: linear-gradient(135deg, var(--sol-rosa) 0%, var(--sol-rosa-dark) 100%);
    color: var(--pitch-black);
    box-shadow: 0 2px 8px rgba(241, 177, 165, 0.4);
  }

  /* Mid widths: the row labels need more room before they wrap */
  @media (min-width: 641px) and (max-width: 900px) {
    .acfc-rnw-vsmatrix-corner {
      width: 21%;
    }

    .acfc-rnw-vsmatrix-head {
      width: 39.5%;
    }

    .acfc-rnw-vsmatrix-label {
      font-size: 0.72rem;
      letter-spacing: 0.06em;
    }

    .acfc-rnw-vsmatrix-cell {
      font-size: 0.86rem;
    }
  }

  /* One legend above the list replaces the per-cell column labels on mobile,
     so each card drops two label lines and still says which chip is which. */
  .acfc-rnw-vsmatrix-legend,
  .acfc-rnw-perks-legend {
    display: none;
  }

  /* Below 640px the matrix becomes one card per benefit. Matches the
     "Compare All Benefits" tables below: the benefit name spans the top,
     then Single Game Tickets and Season Ticket Membership sit side by side
     as two equal chips, so both are always visible and aligned to each
     other instead of stacked full-width blocks. */
  @media (max-width: 640px) {
    .acfc-rnw-vsmatrix-legend {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin: 0 0 10px;
      padding: 0 13px;
      text-align: center;
    }

    .acfc-rnw-vsmatrix-legend-item {
      padding: 5px 6px;
      border: 1px solid rgba(28, 28, 28, 0.1);
      border-radius: var(--radius-sm);
      background: rgba(255, 255, 255, 0.55);
      font-size: 0.6rem;
      font-weight: 700;
      letter-spacing: 0.07em;
      line-height: 1.3;
      text-transform: uppercase;
      color: var(--armour);
    }

    .acfc-rnw-vsmatrix-legend-item--stm {
      border-color: rgba(241, 177, 165, 0.42);
      background: rgba(241, 177, 165, 0.16);
      color: var(--sol-rosa-dark);
    }

    .acfc-rnw-vsmatrix-table,
    .acfc-rnw-vsmatrix-table tbody {
      display: block;
    }

    .acfc-rnw-vsmatrix-table thead {
      display: none;
    }

    .acfc-rnw-vsmatrix-table tbody tr {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-areas: "title title" "single stm";
      column-gap: 8px;
      row-gap: 7px;
      padding: 12px;
      margin-bottom: 8px;
      border: 1px solid rgba(28, 28, 28, 0.1);
      border-radius: var(--radius-md);
      background: rgba(255, 255, 255, 0.72);
      text-align: left;
    }

    .acfc-rnw-vsmatrix-table tbody tr:last-child {
      margin-bottom: 0;
    }

    .acfc-rnw-vsmatrix-label {
      grid-area: title;
      width: auto;
      padding: 0;
      border-bottom: none;
      text-align: left;
    }

    .acfc-rnw-vsmatrix-cell {
      display: block;
      width: auto;
      padding: 8px 9px;
      border: 1px solid rgba(28, 28, 28, 0.1);
      border-radius: var(--radius-sm);
      background: rgba(255, 255, 255, 0.55);
      font-size: 0.8rem;
      line-height: 1.35;
      text-align: left;
    }

    .acfc-rnw-vsmatrix-cell--single,
    .acfc-rnw-vsmatrix-table tbody tr:last-child .acfc-rnw-vsmatrix-cell--single {
      grid-area: single;
    }

    .acfc-rnw-vsmatrix-cell--stm,
    .acfc-rnw-vsmatrix-table tbody tr:last-child .acfc-rnw-vsmatrix-cell--stm {
      grid-area: stm;
      border-color: rgba(241, 177, 165, 0.42);
      border-radius: var(--radius-sm);
      background: rgba(241, 177, 165, 0.16);
    }

    /* Icon sits inline with the value instead of on its own line */
    .acfc-rnw-vsmatrix-val {
      flex-direction: row;
      align-items: flex-start;
      text-align: left;
      gap: 7px;
    }

    .acfc-rnw-vsmatrix-icon {
      width: 16px;
      height: 16px;
      margin-top: 0.12em;
    }

    .acfc-rnw-vsmatrix-icon svg {
      width: 9px;
      height: 9px;
    }
  }
  
  .acfc-rnw-incentives {
    margin-top: clamp(48px, 6vw, 72px);
  }
  
  .acfc-rnw-incentives-head {
    margin-bottom: clamp(18px, 3vw, 28px);
  }
  
  .acfc-rnw-incentives-title,
  .acfc-rnw-events-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.5rem, 3.3vw, 2.1rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.015em;
    line-height: 1.15;
    margin: 0;
    color: var(--asphalt);
  }
  
  .acfc-rnw-incentives-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(16px, 2.5vw, 24px);
  }
  
  .acfc-rnw-incentive {
    padding: clamp(22px, 3vw, 30px);
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  
  .acfc-rnw-incentive-heading {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  
  .acfc-rnw-incentive-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--sol-rosa-dark);
  }
  
  .acfc-rnw-incentive-icon svg {
    width: 26px;
    height: 26px;
  }
  
  .acfc-rnw-incentive-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1rem, 1.8vw, 1.2rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    margin: 0;
    line-height: 1.15;
    flex: 1 1 auto;
    min-width: 0;
  }
  
  .acfc-rnw-incentive-desc {
    margin: 0;
    font-size: clamp(0.92rem, 1.6vw, 1rem);
    line-height: 1.65;
    color: rgba(28, 28, 28, 0.78);
  }

  /* STM Shirt photo reveal — image left, copy right */
  .acfc-rnw-incentive--shirt {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: clamp(200px, 28%, 340px) minmax(0, 1fr);
    align-items: center;
    gap: clamp(20px, 3.5vw, 40px);
  }

  .acfc-rnw-shirt-media {
    position: relative;
    margin: 0;
    padding: 0;
    border-radius: var(--radius-md, 10px);
    overflow: hidden;
    background: #f5f0eb;
  }

  .acfc-rnw-shirt-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--sol-rosa, #e8a0a0);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 4px 10px;
    border-radius: 100px;
    z-index: 1;
    line-height: 1.3;
  }

  .acfc-rnw-shirt-img {
    display: block;
    width: 100%;
    height: auto;
  }

  .acfc-rnw-shirt-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
  }

  .acfc-rnw-shirt-note {
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    font-size: clamp(0.8rem, 1.3vw, 0.875rem);
    line-height: 1.5;
    color: rgba(28, 28, 28, 0.62);
  }

  @media (max-width: 900px) {
    .acfc-rnw-member-value .acfc-rnw-incentive--shirt {
      grid-template-columns: 1fr;
      gap: 18px;
    }

    .acfc-rnw-shirt-media {
      max-width: 520px;
      margin-inline: auto;
      width: 100%;
    }
  }

  .acfc-rnw-events {
    margin-top: clamp(32px, 5vw, 56px);
    margin-bottom: clamp(40px, 6vw, 64px);
  }
  
  .acfc-rnw-events--lead {
    margin-top: 0;
    margin-bottom: clamp(40px, 6vw, 64px);
  }
  
  .acfc-rnw-events-head {
    margin: 0 0 12px;
    padding: 0;
    text-align: left;
  }
  
  .acfc-rnw-events-head .acfc-rnw-eyebrow {
    margin: 0 0 6px;
  }
  
  .acfc-rnw-events-title-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 6px;
    width: 100%;
  }
  
  .acfc-rnw-events-title {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    max-width: none;
  }
  
  .acfc-rnw-events-lead {
    margin: 0;
    max-width: 640px;
    font-size: clamp(0.95rem, 1.8vw, 1.05rem);
    line-height: 1.55;
    color: var(--armour);
  }
  
  .acfc-rnw-events-carousel {
    margin: 0;
  }
  
  .acfc-rnw-events-carousel-nav {
    display: flex;
    flex: 0 0 auto;
    flex-shrink: 0;
    gap: 8px;
    margin: 0;
  }
  
  .acfc-rnw-events-carousel-btn {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid rgba(28, 28, 28, 0.18);
    background: rgba(255, 255, 255, 0.9);
    color: var(--asphalt);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease;
  }
  
  .acfc-rnw-events-carousel-btn:hover,
  .acfc-rnw-events-carousel-btn:focus-visible {
    border-color: var(--sol-rosa);
    background: var(--sol-rosa);
    color: var(--pitch-black, #111);
    outline: none;
  }
  
  .acfc-rnw-events-carousel-btn:active {
    transform: scale(0.96);
  }
  
  .acfc-rnw-events-carousel-track {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    overflow-anchor: none;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 2px 12px;
    cursor: grab;
  }
  
  .acfc-rnw-events-carousel-track::-webkit-scrollbar {
    display: none;
  }
  
  .acfc-rnw-events-carousel-track:focus-visible {
    outline: 2px solid var(--sol-rosa);
    outline-offset: 4px;
  }
  
  .acfc-rnw-events-carousel-track.is-dragging {
    cursor: grabbing;
    scroll-snap-type: none;
  }
  
  .acfc-rnw-events-slide {
    flex: 0 0 min(78vw, 520px);
    margin: 0;
    scroll-snap-align: start;
    border-radius: var(--radius-lg, 16px);
    overflow: hidden;
    background: rgba(28, 28, 28, 0.06);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1);
    opacity: 1;
    transform: none;
  }
  
  .acfc-rnw-events-slide img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
  
  @media (max-width: 900px) {
    .acfc-rnw-incentives-grid,
    .acfc-rnw-stats-grid,
    .acfc-rnw-plans-grid {
      grid-template-columns: 1fr;
    }
  
    .acfc-rnw-stat {
      border-left: none;
      border-top: 1px solid var(--rnw-paper-edge);
      padding: 20px 16px;
    }
  
    .acfc-rnw-stat:first-child { border-top: none; }
  }
  
  @media (max-width: 768px) {
    .acfc-rnw-member-value .acfc-rnw-incentives-grid {
      gap: 12px;
    }
  
    .acfc-rnw-events-title-row {
      flex-wrap: wrap;
      gap: 10px;
      row-gap: 8px;
    }
  
    .acfc-rnw-events-carousel-btn {
      width: 44px;
      height: 44px;
    }
  
    .acfc-rnw-events-carousel-track {
      scroll-padding-inline: 4px;
    }
  
    .acfc-rnw-events-slide {
      flex-basis: min(85%, 360px);
    }
  }
  
  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-events-slide {
      transform: none;
      transition: none;
    }
  
    .acfc-rnw-events-carousel-btn {
      transition: none;
    }
  }
  

  /* ---------- Member moments: video + mosaic gallery ---------- */

  .acfc-rnw-moments {
    position: relative;
    background: var(--rnw-surface-warm);
    padding: clamp(56px, 8vw, 96px) 0;
    overflow: hidden;
  }

  .acfc-rnw-moments::before {
    content: '';
    position: absolute;
    inset: -20% -10% auto -10%;
    height: 60%;
    background: radial-gradient(ellipse 70% 100% at 50% 0%, var(--sol-rosa-soft) 0%, transparent 70%);
    pointer-events: none;
  }

  .acfc-rnw-moments > .angelcity2026-container {
    position: relative;
    z-index: 1;
  }

  /* Feature video */
  .acfc-rnw-moments-video {
    position: relative;
    margin: 0 0 clamp(16px, 2.5vw, 24px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    /* Cinematic letterbox: shorter than the source 16:9 so the frame does not
       dominate the section. The video is center-cropped to fill it. */
    aspect-ratio: 21 / 9;
    width: 100%;
    background: var(--rnw-card-dark);
    border: 1px solid rgba(241, 177, 165, 0.35);
    box-shadow: 0 26px 70px rgba(28, 20, 16, 0.22);
  }

  .acfc-rnw-moments-video-el {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
  }

  .acfc-rnw-moments-video-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.14) 45%, transparent 75%);
    pointer-events: none;
  }

  .acfc-rnw-moments-video-toggle {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 2;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(0, 0, 0, 0.5);
    color: var(--line-white);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s var(--ease-out);
  }

  .acfc-rnw-moments-video-toggle:hover,
  .acfc-rnw-moments-video-toggle:focus-visible {
    background: var(--sol-rosa);
    border-color: var(--sol-rosa);
    color: var(--pitch-black);
    transform: scale(1.06);
    outline: none;
  }

  .acfc-rnw-moments-video-toggle:focus-visible {
    outline: 2px solid var(--sol-rosa);
    outline-offset: 3px;
  }

  /* Mute toggle shares the play/pause button's look, pinned to the opposite corner */
  .acfc-rnw-moments-video-mute {
    top: auto;
    bottom: 16px;
    right: 16px;
  }

  .acfc-rnw-moments-icon {
    width: 18px;
    height: 18px;
    fill: currentColor;
  }

  /* Show pause while playing, play while paused */
  .acfc-rnw-moments-icon--pause { display: none; }
  .acfc-rnw-moments-icon--play { display: block; }
  .acfc-rnw-moments-video.is-playing .acfc-rnw-moments-icon--pause { display: block; }
  .acfc-rnw-moments-video.is-playing .acfc-rnw-moments-icon--play { display: none; }

  /* Show the muted (crossed-out) glyph by default, sound-wave glyph once unmuted */
  .acfc-rnw-moments-icon--muted { display: block; }
  .acfc-rnw-moments-icon--unmuted { display: none; }
  .acfc-rnw-moments-video.is-unmuted .acfc-rnw-moments-icon--muted { display: none; }
  .acfc-rnw-moments-video.is-unmuted .acfc-rnw-moments-icon--unmuted { display: block; }

  .acfc-rnw-moments-video-caption {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: clamp(18px, 3vw, 28px);
  }

  .acfc-rnw-moments-video-kicker {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--sol-rosa);
  }

  .acfc-rnw-moments-video-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.2rem, 2.7vw, 1.8rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: var(--line-white);
  }

  /* Mosaic grid: three columns to match the video width */
  .acfc-rnw-moments-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, clamp(150px, 17vw, 230px));
    gap: clamp(10px, 1.5vw, 16px);
  }

  .acfc-rnw-moments-tile {
    position: relative;
    margin: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: rgba(28, 28, 28, 0.06);
    box-shadow: 0 12px 32px rgba(28, 20, 16, 0.12);
  }

  .acfc-rnw-moments-tile--tall {
    grid-row: span 2;
  }

  .acfc-rnw-moments-tile--wide {
    grid-column: span 2;
  }

  .acfc-rnw-moments-tile img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(0.35);
    transform: scale(1.01);
    transition: filter 0.5s var(--ease-out), transform 0.6s var(--ease-out);
  }

  .acfc-rnw-moments-tile:hover img,
  .acfc-rnw-moments-tile:focus-within img {
    filter: grayscale(0);
    transform: scale(1.06);
  }

  .acfc-rnw-moments-caption {
    position: absolute;
    left: 10px;
    bottom: 10px;
    z-index: 2;
    padding: 6px 12px;
    border-radius: var(--radius-full);
    background: rgba(0, 0, 0, 0.6);
    color: var(--line-white);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.3s var(--ease-out), transform 0.3s var(--ease-out);
    display:none;
  }

  .acfc-rnw-moments-tile:hover .acfc-rnw-moments-caption,
  .acfc-rnw-moments-tile:focus-within .acfc-rnw-moments-caption {
    opacity: 1;
    transform: translateY(0);
  }

  .acfc-rnw-moments-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-top: clamp(28px, 4vw, 40px);
    text-align: center;
  }

  .acfc-rnw-moments-cta-copy {
    margin: 0;
    font-size: clamp(1rem, 2vw, 1.15rem);
    line-height: 1.5;
    color: var(--asphalt);
  }

  @media (max-width: 900px) {
    /* Two columns only works evenly with uniform tiles, so drop the spans */
    .acfc-rnw-moments-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(3, clamp(140px, 26vw, 200px));
    }

    .acfc-rnw-moments-tile--tall,
    .acfc-rnw-moments-tile--wide {
      grid-row: auto;
      grid-column: auto;
    }
  }

  @media (max-width: 768px) {
    .acfc-rnw-moments-video {
      border-radius: var(--radius-md);
      /* 21:9 collapses to a sliver at phone widths, so give the frame back some height */
      aspect-ratio: 16 / 10;
    }

    .acfc-rnw-moments-video-toggle {
      top: 12px;
      right: 12px;
    }

    .acfc-rnw-moments-video-mute {
      top: auto;
      bottom: 12px;
      right: 12px;
    }

    /* Captions are hover-only on desktop; always visible on touch */
    .acfc-rnw-moments-caption {
      opacity: 1;
      transform: none;
      font-size: 0.7rem;
      padding: 5px 10px;
    }

    .acfc-rnw-moments-tile img {
      filter: grayscale(0);
    }
  }

  @media (max-width: 560px) {
    .acfc-rnw-moments-grid {
      grid-template-columns: 1fr;
      grid-template-rows: none;
      grid-auto-rows: clamp(180px, 52vw, 260px);
    }

    .acfc-rnw-moments-tile--tall,
    .acfc-rnw-moments-tile--wide {
      grid-row: auto;
      grid-column: auto;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-moments-tile img,
    .acfc-rnw-moments-caption,
    .acfc-rnw-moments-video-toggle {
      transition: none;
    }

    .acfc-rnw-moments-tile:hover img,
    .acfc-rnw-moments-tile:focus-within img {
      transform: none;
    }
  }


  /* ---------- Benefits table ---------- */
  
  .acfc-rnw-benefits {
    background: var(--rnw-cream);
    padding: clamp(56px, 8vw, 96px) 0;
  }
  
  .acfc-rnw-benefits-head {
    max-width: 640px;
    margin: 0 auto clamp(24px, 4vw, 36px);
    text-align: center;
  }
  
  .acfc-rnw-benefits-head .acfc-rnw-eyebrow,
  .acfc-rnw-benefits-head .acfc-rnw-benefits-headline,
  .acfc-rnw-benefits-head .acfc-rnw-section-lead {
    text-align: center;
  }
  
  .acfc-rnw-benefits-head .acfc-rnw-section-lead {
    margin-left: auto;
    margin-right: auto;
    max-width: 540px;
  }
  
  .acfc-rnw-member-value {
    display: flex;
    flex-direction: column;
    gap: clamp(14px, 2vw, 20px);
    margin: 0 0 clamp(36px, 5vw, 52px);
  }
  
  .acfc-rnw-member-value .acfc-rnw-incentives-grid {
    gap: 14px;
  }
  
  .acfc-rnw-member-value .acfc-rnw-incentive {
    padding: clamp(16px, 2.4vw, 22px);
    gap: 8px;
  }

  .acfc-rnw-member-value .acfc-rnw-incentive--shirt {
    padding: clamp(18px, 2.6vw, 28px);
    gap: clamp(20px, 3.5vw, 40px);
  }
  
  .acfc-rnw-member-value .acfc-rnw-incentive-desc {
    font-size: clamp(0.88rem, 1.5vw, 0.95rem);
    line-height: 1.5;
  }
  
  .acfc-rnw-benefits-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    margin-bottom: 48px;
  }
  
  .acfc-rnw-benefits-media {
    border-radius: var(--radius-lg);
    overflow: hidden;
    aspect-ratio: 4 / 3;
    box-shadow: 0 22px 60px rgba(28, 20, 16, 0.2);
  }
  
  .acfc-rnw-benefits-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .acfc-rnw-benefits-headline {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    line-height: 1.02;
    color: var(--asphalt);
    font-size: clamp(1.85rem, 4.5vw, 2.8rem);
    margin: 6px 0 14px;
  }
  
  .acfc-rnw-benefits-headline .acfc-rnw-imgtext {
    display: inline;
  }
  
  .acfc-rnw-benefits .acfc-rnw-eyebrow { color: var(--sol-rosa-dark); }
  .acfc-rnw-benefits-table-heading { color: var(--asphalt); }
  
  /* Top-6 spotlight grid. Flexbox (not CSS Grid) so that an incomplete
     final row - e.g. 2 cards left over in a 3-column layout - centers
     itself instead of hugging the left edge with an empty trailing column. */
  .acfc-rnw-spotlight {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 0;
  }
  
  .acfc-rnw-spotlight-card {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 14px;
    row-gap: 4px;
    align-items: center;
    padding: 16px 18px;
    flex: 0 1 calc((100% - (2 * 12px)) / 3);
  }
  
  .acfc-rnw-spotlight-card.acfc-rnw-frost {
    box-shadow: none;
  }
  
  .acfc-rnw-spotlight-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--sol-rosa-soft);
    color: var(--sol-rosa-dark);
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
    margin-bottom: 0;
    padding-left: 2px;
  }
  
  .acfc-rnw-spotlight-icon svg { width: 20px; height: 20px; }
  
  .acfc-rnw-spotlight-title {
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: var(--asphalt);
    margin: 0;
    line-height: 1.15;
    grid-column: 2;
    grid-row: 1;
  }
  
  .acfc-rnw-spotlight-desc {
    font-size: 0.8rem;
    color: var(--armour);
    margin: 0;
    line-height: 1.45;
    grid-column: 2;
    grid-row: 2;
  }
  
  .acfc-rnw-benefits-table-heading {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.2rem, 2.7vw, 1.6rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.015em;
    color: var(--asphalt);
    text-align: center;
    margin: 0 0 20px;
  }

  /* Perks comparison tables (STM vs single ticket buyer) */
  .acfc-rnw-perks-compare {
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 4vw, 44px);
    margin-top: clamp(8px, 2vw, 16px);
  }

  .acfc-rnw-perks-panel {
    position: relative;
    overflow: hidden;
    padding: clamp(22px, 3.5vw, 32px);
    border: 1px solid rgba(241, 177, 165, 0.35);
    box-shadow: var(--shadow-card);
    background:
      linear-gradient(165deg, rgba(255, 255, 255, 0.97) 0%, rgba(247, 241, 232, 0.92) 100%);
  }

  .acfc-rnw-perks-panel::before {
    content: '';
    position: absolute;
    inset: auto -10% -28% -10%;
    height: 55%;
    background:
      radial-gradient(ellipse 80% 100% at 50% 100%, rgba(241, 177, 165, 0.22) 0%, transparent 72%);
    pointer-events: none;
  }

  .acfc-rnw-perks-head {
    position: relative;
    z-index: 1;
    margin-bottom: clamp(18px, 3vw, 24px);
    max-width: 720px;
  }

  .acfc-rnw-perks-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.1rem, 2.4vw, 1.4rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.015em;
    text-transform: uppercase;
    color: var(--asphalt);
    margin: 0;
  }

  @media (min-width: 769px) {
    .acfc-rnw-perks-head {
      max-width: none;
    }

    .acfc-rnw-perks-title {
      white-space: nowrap;
    }
  }

  .acfc-rnw-perks-title em {
    font-style: normal;
    font-weight: 900;
    color: var(--sol-rosa-dark);
  }

  .acfc-rnw-perks-accent {
    display: block;
    width: 52px;
    height: 4px;
    margin-top: 12px;
    background: var(--sol-rosa);
    border-radius: 2px;
  }

  .acfc-rnw-perks-table-scroll {
    position: relative;
    z-index: 1;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--sol-rosa) transparent;
    border-radius: var(--radius-md);
    border: 1px solid var(--benefits-border-light);
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(6px);
  }

  .acfc-rnw-perks-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    table-layout: fixed;
  }

  /* Header bar: quiet warm surface for the context columns, sol rosa for the
     STM column so the eye lands on the tier we are actually selling. */
  .acfc-rnw-perks-table thead th {
    padding: 0.85rem 1rem;
    font-size: clamp(0.72rem, 1.1vw, 0.78rem);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: left;
    vertical-align: middle;
    color: var(--armour);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(247, 241, 232, 0.94) 100%);
    border-bottom: 2px solid var(--sol-rosa);
  }

  .acfc-rnw-perks-th-label {
    display: block;
    line-height: 1.25;
  }

  /* Matches the sticky body cells so the column stays aligned while scrolling */
  .acfc-rnw-perks-table thead .acfc-rnw-perks-th-benefit {
    width: 38%;
    position: sticky;
    left: 0;
    z-index: 3;
    color: var(--asphalt);
    box-shadow: 4px 0 10px -6px rgba(0, 0, 0, 0.12);
  }

  .acfc-rnw-perks-table thead .acfc-rnw-perks-th-buyer {
    width: 27%;
  }

  /* Wider than the buyer column so the name and tier chip fit on one line. */
  .acfc-rnw-perks-table thead .acfc-rnw-perks-th-member {
    width: 35%;
  }

  .acfc-rnw-perks-table thead .acfc-rnw-perks-th-buyer {
    border-left: 1px solid rgba(28, 28, 28, 0.08);
  }

  .acfc-rnw-perks-table thead .acfc-rnw-perks-th-member {
    color: var(--asphalt);
    background: linear-gradient(180deg, rgba(241, 177, 165, 0.62) 0%, rgba(241, 177, 165, 0.85) 100%);
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.6);
  }

  /* The label is block-level in the other two columns; here it flows inline so
     the tier chip sits beside the column name instead of dropping below it. */
  .acfc-rnw-perks-th-member .acfc-rnw-perks-th-label {
    display: inline;
  }

  .acfc-rnw-perks-tier {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 9px;
    padding: 3px 9px;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.72);
    color: var(--asphalt);
    font-size: 0.78em;
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
  }

  /* Carry the emphasis down the Season Ticket Member column */
  .acfc-rnw-perks-table tbody td:last-child {
    background: rgba(241, 177, 165, 0.12);
    border-left-color: rgba(241, 177, 165, 0.5);
  }

  .acfc-rnw-perks-benefit {
    padding: 0.72rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--asphalt);
    text-align: left;
    vertical-align: middle;
    background: rgba(255, 255, 255, 0.65);
    border-bottom: 1px solid var(--benefits-border-light);
    position: sticky;
    left: 0;
    z-index: 2;
    box-shadow: 4px 0 10px -6px rgba(0, 0, 0, 0.12);
  }

  .acfc-rnw-perks-cell {
    padding: 0.72rem 1rem;
    vertical-align: middle;
    border-bottom: 1px solid var(--benefits-border-light);
    border-left: 1px solid rgba(241, 177, 165, 0.35);
    background: rgba(255, 255, 255, 0.45);
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--asphalt);
  }

  .acfc-rnw-perks-status {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem 0.5rem;
  }

  .acfc-rnw-perks-status strong {
    font-weight: 800;
    letter-spacing: 0.01em;
  }

  .acfc-rnw-perks-detail {
    font-size: 0.82em;
    font-style: italic;
    color: var(--armour);
    font-weight: 500;
  }

  .acfc-rnw-perks-note-ref {
    font-size: 0.7em;
    color: var(--sol-rosa-dark);
    font-weight: 700;
    margin-left: 1px;
  }

  .acfc-rnw-perks-footnote {
    margin: 14px 2px 0;
    padding-top: 12px;
    border-top: 1px solid rgba(28, 28, 28, 0.08);
    font-size: 0.78rem;
    line-height: 1.6;
    color: var(--armour);
  }

  .acfc-rnw-perks-footnote .acfc-rnw-perks-note-ref {
    margin-left: 0;
  }

  .acfc-rnw-perks-icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
  }

  .acfc-rnw-perks-icon--deny {
    color: #c94b4b;
    padding: 2px;
    border-radius: 50%;
    background: rgba(201, 75, 75, 0.12);
    box-sizing: content-box;
  }

  .acfc-rnw-perks-icon--star {
    fill: #d4a017;
    stroke: none;
    width: 16px;
    height: 16px;
  }

  .acfc-rnw-perks-cell.is-deny .acfc-rnw-perks-status {
    color: var(--armour);
  }

  .acfc-rnw-perks-cell.is-include .acfc-rnw-perks-status strong {
    color: var(--asphalt);
  }

  .acfc-rnw-perks-cell.is-premium .acfc-rnw-perks-status strong {
    color: var(--asphalt);
  }

  .acfc-rnw-perks-cell.is-neutral .acfc-rnw-perks-status {
    font-weight: 600;
    color: var(--armour);
  }

  .acfc-rnw-perks-table tbody tr:last-child .acfc-rnw-perks-benefit,
  .acfc-rnw-perks-table tbody tr:last-child .acfc-rnw-perks-cell {
    border-bottom: none;
  }

  @media (max-width: 768px) {
    .acfc-rnw-perks-panel {
      padding: 18px 14px;
    }

    .acfc-rnw-perks-head {
      text-align: center;
    }

    .acfc-rnw-perks-accent {
      margin-inline: auto;
    }

    .acfc-rnw-perks-table-scroll::after {
      content: 'Swipe to compare';
      display: block;
      text-align: center;
      font-size: 0.7rem;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--armour);
      padding: 8px 0 4px;
    }

    .acfc-rnw-perks-benefit {
      min-width: 148px;
      font-size: 0.8rem;
      padding: 0.65rem 0.75rem;
    }

    .acfc-rnw-perks-cell {
      min-width: 132px;
      padding: 0.65rem 0.75rem;
      font-size: 0.8rem;
    }

    .acfc-rnw-perks-table thead th {
      padding: 0.7rem 0.75rem;
    }

    /* These nest inside cells, so em sizing compounds down to ~9px on phones.
       Pin them to absolute sizes that stay readable. */
    .acfc-rnw-perks-tier {
      font-size: 0.7rem;
    }

    .acfc-rnw-perks-detail {
      font-size: 0.72rem;
    }
  }

  /* Below 640px the three columns no longer fit, and side-scrolling left the
     Season Ticket Member column - the entire argument - off screen behind a
     swipe. Turn each row into a card instead: the benefit name spans the
     top, then the Single Ticket Buyer and Season Ticket Member answers sit
     side by side as two evenly-sized chips, so both are always visible and
     aligned to each other rather than stacked or hidden. The column names
     are stated once in the legend above the list rather than on every row,
     which keeps each answer to a single line. */
  @media (max-width: 640px) {
    .acfc-rnw-perks-legend {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin: 0 0 10px;
      padding: 0 13px;
      text-align: center;
    }

    .acfc-rnw-perks-legend-item {
      padding: 5px 6px;
      border: 1px solid var(--benefits-border-light);
      border-radius: var(--radius-sm);
      background: rgba(255, 255, 255, 0.55);
      font-size: 0.6rem;
      font-weight: 700;
      letter-spacing: 0.07em;
      line-height: 1.3;
      text-transform: uppercase;
      color: var(--armour);
    }

    .acfc-rnw-perks-legend-item--member {
      border-color: rgba(241, 177, 165, 0.42);
      background: rgba(241, 177, 165, 0.16);
      color: var(--sol-rosa-dark);
    }

    .acfc-rnw-perks-table-scroll {
      overflow: visible;
    }

    .acfc-rnw-perks-table-scroll::after {
      content: none;
    }

    .acfc-rnw-perks-table {
      display: block;
      min-width: 0;
    }

    .acfc-rnw-perks-table thead {
      display: none;
    }

    .acfc-rnw-perks-table tbody {
      display: block;
    }

    .acfc-rnw-perks-table tr {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-areas: "title title" "buyer member";
      column-gap: 8px;
      row-gap: 7px;
      margin-bottom: 8px;
      padding: 12px;
      border: 1px solid var(--benefits-border-light);
      border-radius: var(--radius-md);
      background: rgba(255, 255, 255, 0.72);
      text-align: left;
    }

    .acfc-rnw-perks-table tbody tr:last-child {
      margin-bottom: 0;
    }

    .acfc-rnw-perks-table .acfc-rnw-perks-benefit {
      grid-area: title;
      position: static;
      width: auto;
      min-width: 0;
      padding: 0;
      font-size: 0.85rem;
      line-height: 1.3;
      text-align: left;
      background: none;
      box-shadow: none;
      border-bottom: none;
    }

    /* Both answers become equal-weight chips. The value and its detail run
       inline on one line where they fit, so a row is roughly two lines tall
       instead of five. */
    .acfc-rnw-perks-table .acfc-rnw-perks-cell {
      display: flex;
      align-items: center;
      justify-content: center;
      width: auto;
      min-width: 0;
      padding: 7px 8px;
      border: 1px solid var(--benefits-border-light);
      border-radius: var(--radius-sm);
      background: rgba(255, 255, 255, 0.55);
      font-size: 0.78rem;
      line-height: 1.35;
      text-align: center;
    }

    .acfc-rnw-perks-table .acfc-rnw-perks-cell:nth-of-type(1) {
      grid-area: buyer;
    }

    .acfc-rnw-perks-table .acfc-rnw-perks-cell:nth-of-type(2) {
      grid-area: member;
      border-color: rgba(241, 177, 165, 0.42);
      background: rgba(241, 177, 165, 0.16);
    }

    /* Column names live in the legend above the list, not on every row */
    .acfc-rnw-perks-cell::before {
      content: none;
    }

    .acfc-rnw-perks-status {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 0.15rem 0.3rem;
      text-align: center;
    }

    .acfc-rnw-perks-detail {
      font-size: 0.68rem;
    }

    .acfc-rnw-perks-icon {
      width: 15px;
      height: 15px;
    }

    .acfc-rnw-perks-icon--star {
      width: 14px;
      height: 14px;
    }
  }
  
  @media (max-width: 900px) {
    .acfc-rnw-spotlight-card {
      flex-basis: calc((100% - 12px) / 2);
    }
  }
  
  @media (max-width: 640px) {
    .acfc-rnw-spotlight-card {
      flex-basis: 100%;
      padding: 14px 16px;
    }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-benefits-head .acfc-rnw-eyebrow,
    .acfc-rnw-benefits-headline,
    .acfc-rnw-benefits-head .acfc-rnw-section-lead {
      text-align: center;
    }
  
    .acfc-rnw-benefits-headline {
      font-size: clamp(1.6rem, 7vw, 2rem);
      line-height: 1.1;
    }
  }
  

  /* ---------- Experience feature grid ---------- */
  
  .acfc-rnw-experience {
    position: relative;
    background: var(--rnw-surface);
    padding: clamp(48px, 7vw, 80px) 0;
    overflow: hidden;
  }

  /* Higher specificity than the plain .acfc-rnw-experience background above, so
     the tonal wash (no photo) wins when both classes are present on a section. */
  .acfc-rnw-experience.acfc-rnw-tonal {
    background:
      radial-gradient(120% 100% at 18% 0%, rgba(241, 177, 165, 0.16) 0%, transparent 55%),
      linear-gradient(180deg, var(--rnw-cream) 0%, #efe8dc 48%, #e3dccf 100%);
  }

  /* Sol rosa bloom behind the Member Hub showcase */
  .acfc-rnw-nextseason::before {
    content: '';
    position: absolute;
    inset: -12% -10% auto -10%;
    height: 62%;
    background: radial-gradient(ellipse 62% 100% at 50% 0%, var(--sol-rosa-soft) 0%, transparent 72%);
    pointer-events: none;
  }

  .acfc-rnw-nextseason > .angelcity2026-container {
    position: relative;
    z-index: 1;
  }
  
  .acfc-rnw-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  .acfc-rnw-nextseason .acfc-rnw-feature-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Member Hub app showcase */
  .acfc-rnw-mhub-showcase {
    position: relative;
    overflow: hidden;
    padding: clamp(24px, 3vw, 32px) clamp(16px, 2.5vw, 28px);
    margin-bottom: clamp(28px, 4vw, 40px);
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid rgba(241, 177, 165, 0.38);
    box-shadow: var(--shadow-card);
    background:
      linear-gradient(155deg, rgba(241, 177, 165, 0.16) 0%, rgba(255, 255, 255, 0.88) 38%, rgba(247, 241, 232, 0.92) 100%);
  }

  /* Alternating copy/device rows so each screen sits beside the copy it proves.
     The device column is sized to the phone itself so the copy keeps the rest. */
  .acfc-rnw-mhub-row {
    display: grid;
    grid-template-columns: minmax(0, 420px) minmax(0, 264px);
    align-items: center;
    justify-content: center;
    gap: clamp(32px, 4vw, 48px);
    padding: clamp(22px, 3.5vw, 34px) 0;
    border-top: 1px solid rgba(241, 177, 165, 0.3);
  }

  .acfc-rnw-mhub-row:first-child {
    border-top: none;
    padding-top: 0;
  }

  .acfc-rnw-mhub-row:last-child {
    padding-bottom: 0;
  }

  .acfc-rnw-mhub-row--flip {
    grid-template-columns: minmax(0, 264px) minmax(0, 420px);
  }

  .acfc-rnw-mhub-text {
    display: flex;
    flex-direction: column;
    gap: clamp(12px, 2vw, 18px);
    align-items: flex-start;
    text-align: left;
    max-width: 420px;
    justify-self: center;
  }

  /* Eyebrow is a kicker on the title, so drop its default margin and offset
     part of the column gap to keep the pair together. */
  .acfc-rnw-mhub-text .acfc-rnw-eyebrow {
    margin-bottom: -8px;
  }

  .acfc-rnw-mhub-screen {
    position: relative;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 218px;
    justify-self: center;
  }

  /* Rosa bloom fills the media column so the device reads as placed, not floating */
  .acfc-rnw-mhub-screen::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 48%;
    width: 235%;
    height: 88%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(ellipse at center, var(--sol-rosa-glow) 0%, transparent 68%);
    pointer-events: none;
  }

  .acfc-rnw-mhub-screen-frame {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 9 / 19;
    border-radius: clamp(16px, 2.2vw, 26px);
    overflow: hidden;
    background: var(--pitch-black);
    border: 3px solid #1b1b1b;
    box-shadow: 0 16px 40px rgba(28, 20, 16, 0.2);
    transition: transform 0.45s var(--ease-out), box-shadow 0.45s var(--ease-out);
  }

  /* Device speaker pill */
  .acfc-rnw-mhub-screen-frame::before {
    content: '';
    position: absolute;
    top: 7px;
    left: 50%;
    transform: translateX(-50%);
    width: 32%;
    height: 5px;
    border-radius: var(--radius-full);
    background: rgba(0, 0, 0, 0.6);
    z-index: 2;
  }

  .acfc-rnw-mhub-screen-frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .acfc-rnw-mhub-screen--feature {
    max-width: 244px;
  }

  .acfc-rnw-mhub-screen-label {
    position: relative;
    z-index: 1;
  }

  .acfc-rnw-mhub-screen--feature .acfc-rnw-mhub-screen-frame {
    box-shadow:
      0 26px 62px rgba(28, 20, 16, 0.28),
      0 0 0 1px rgba(241, 177, 165, 0.5),
      0 0 48px var(--sol-rosa-glow);
  }

  .acfc-rnw-mhub-screen:hover .acfc-rnw-mhub-screen-frame {
    transform: translateY(-4px);
  }

  .acfc-rnw-mhub-screen-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--armour);
    text-align: center;
  }

  .acfc-rnw-mhub-screen--feature .acfc-rnw-mhub-screen-label {
    color: var(--sol-rosa-dark);
  }

  .acfc-rnw-mhub-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.35rem, 2.9vw, 1.9rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: var(--asphalt);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }

  /* Neutral (non-pulsing) tag distinguishing this from the pink "NEW" badge,
     so it reads as informational rather than an exciting feature callout. */
  .acfc-rnw-mhub-soon-badge {
    display: inline-block;
    font-family: 'Inter', sans-serif;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(28, 28, 28, 0.65);
    background: rgba(28, 28, 28, 0.08);
    border: 1px solid rgba(28, 28, 28, 0.16);
    border-radius: var(--radius-full);
    padding: 4px 10px;
    vertical-align: middle;
  }

  .acfc-rnw-mhub-lead {
    margin: 0;
    font-size: clamp(0.95rem, 1.7vw, 1.05rem);
    line-height: 1.6;
    color: rgba(28, 28, 28, 0.82);
    max-width: 52ch;
  }

  .acfc-rnw-mhub-note {
    margin: 10px 0 0;
    font-size: 0.85rem;
    font-style: italic;
    color: rgba(28, 28, 28, 0.62);
  }

  .acfc-rnw-mhub-groups {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(14px, 2vw, 20px);
    width: 100%;
    max-width: 420px;
    text-align: left;
    justify-self: center;
  }

  .acfc-rnw-mhub-group {
    padding: clamp(18px, 2.4vw, 26px) clamp(18px, 2.2vw, 24px);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(241, 177, 165, 0.32);
    box-shadow: 0 8px 24px rgba(28, 20, 16, 0.06);
  }

  /* Rosa hairline under the title gives each group a clear masthead */
  .acfc-rnw-mhub-group-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.95rem, 1.6vw, 1.1rem);
    font-weight: 800;
    letter-spacing: -0.005em;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--sol-rosa-dark);
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(241, 177, 165, 0.3);
  }

  /* NEW badge for highlighted features */
  .acfc-rnw-mhub-badge {
    display: inline-block;
    font-size: 0.62rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pitch-black);
    background: var(--sol-rosa);
    border-radius: var(--radius-full);
    padding: 4px 10px;
    margin-left: 8px;
    vertical-align: middle;
    animation: pulse-glow 2s ease-in-out infinite;
  }

  @keyframes pulse-glow {
    0%, 100% { box-shadow: 0 0 8px rgba(241, 177, 165, 0.4); }
    50% { box-shadow: 0 0 16px rgba(241, 177, 165, 0.7); }
  }

  /* Highlight styling for new benefits group */
  .acfc-rnw-mhub-group--highlight {
    background: linear-gradient(135deg, rgba(241, 177, 165, 0.12) 0%, rgba(255, 255, 255, 0.92) 100%);
    border-color: var(--sol-rosa);
    box-shadow: 0 12px 32px rgba(241, 177, 165, 0.18), 0 0 0 1px rgba(241, 177, 165, 0.2);
    position: relative;
  }

  .acfc-rnw-mhub-group--highlight::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at top right, rgba(241, 177, 165, 0.15), transparent 60%);
    pointer-events: none;
  }

  .acfc-rnw-mhub-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .acfc-rnw-mhub-list li {
    position: relative;
    padding-left: 18px;
    font-size: clamp(0.88rem, 1.35vw, 0.95rem);
    line-height: 1.55;
    color: var(--asphalt);
  }

  .acfc-rnw-mhub-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sol-rosa);
    transform: translateY(-50%);
  }

  .acfc-rnw-mhub-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
  }

  /* App store buttons (ported from MobileFanApp) */
  .acfc-rnw-store-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    min-height: 48px;
    min-width: 158px;
    padding: 8px 16px 8px 12px;
    border-radius: 10px;
    background: var(--asphalt);
    color: var(--line-white);
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    transition: transform 0.2s var(--ease-out), box-shadow 0.2s ease;
  }

  a.acfc-rnw-store-btn,
  a.acfc-rnw-store-btn:hover,
  a.acfc-rnw-store-btn:focus-visible {
    color: var(--line-white);
    background: var(--asphalt);
    border-color: rgba(255, 255, 255, 0.12);
  }

  .acfc-rnw-store-btn:hover,
  .acfc-rnw-store-btn:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
    outline: none;
  }

  .acfc-rnw-store-btn:focus-visible {
    outline: 2px solid var(--sol-rosa);
    outline-offset: 3px;
  }

  .acfc-rnw-store-btn-icon {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    color: var(--line-white);
  }

  .acfc-rnw-store-btn-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.1;
    min-width: 0;
    color: inherit;
  }

  .acfc-rnw-store-btn-label {
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    opacity: 0.92;
  }

  .acfc-rnw-store-btn-name {
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.01em;
  }

  .acfc-rnw-mhub-web {
    margin: 0;
    font-size: 0.88rem;
    color: var(--armour);
  }

  .acfc-rnw-mhub-web a {
    color: var(--sol-rosa-dark);
    font-weight: 600;
    text-underline-offset: 3px;
  }

  /* Tighten just enough for both stores to sit side by side on a phone */
  @media (max-width: 480px) {
    .acfc-rnw-store-btn {
      min-width: 0;
      gap: 8px;
      padding: 8px 12px;
    }

    .acfc-rnw-store-btn-icon {
      width: 24px;
      height: 24px;
    }

    .acfc-rnw-store-btn-name {
      font-size: 0.95rem;
    }
  }

  @media (max-width: 340px) {
    .acfc-rnw-mhub-actions {
      flex-direction: column;
      align-items: stretch;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-store-btn {
      transition: none;
    }

    .acfc-rnw-store-btn:hover,
    .acfc-rnw-store-btn:focus-visible {
      transform: none;
    }
  }

  @media (max-width: 900px) {
    /* Device column stays on its own side, so the flip row needs the mirror */
    .acfc-rnw-mhub-row {
      grid-template-columns: minmax(0, 1fr) minmax(0, 200px);
      gap: clamp(16px, 2.5vw, 28px);
    }

    .acfc-rnw-mhub-row--flip {
      grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
      gap: clamp(16px, 2.5vw, 28px);
    }

    .acfc-rnw-mhub-screen,
    .acfc-rnw-mhub-screen--feature {
      max-width: 190px;
    }
  }

  @media (max-width: 768px) {
    .acfc-rnw-nextseason .acfc-rnw-feature-grid {
      grid-template-columns: 1fr;
    }

    .acfc-rnw-mhub-showcase {
      padding: 18px 14px;
    }

    /* Stack to one column, screen (proof) ahead of its copy in both
       directions so the app preview leads and the text follows. */
    .acfc-rnw-mhub-row,
    .acfc-rnw-mhub-row--flip {
      grid-template-columns: 1fr;
      gap: clamp(18px, 4vw, 26px);
    }

    .acfc-rnw-mhub-row > .acfc-rnw-mhub-screen {
      order: -1;
    }

    /* Once stacked, the row padding doubles up between sections, and three
       tall 9:19 devices make the module a long scroll. Trim both. */
    .acfc-rnw-mhub-row {
      padding: clamp(18px, 4vw, 24px) 0;
    }

    .acfc-rnw-mhub-screen {
      max-width: 176px;
    }

    .acfc-rnw-mhub-screen--feature {
      max-width: 196px;
    }

    /* Once stacked to one column, center the "Member Hub" intro copy
       (eyebrow, title + badge, lead, app buttons, note, and web link)
       instead of leaving it left-aligned inside a centered block. */
    .acfc-rnw-mhub-text {
      align-items: center;
      text-align: center;
    }

    .acfc-rnw-mhub-title {
      justify-content: center;
    }

    .acfc-rnw-mhub-lead {
      text-align: center;
    }

    .acfc-rnw-mhub-note {
      text-align: center;
    }

    .acfc-rnw-mhub-actions {
      justify-content: center;
    }

    .acfc-rnw-mhub-web {
      text-align: center;
    }
  }


  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-mhub-screen-frame {
      transition: none;
    }

    .acfc-rnw-mhub-screen:hover .acfc-rnw-mhub-screen-frame {
      transform: none;
    }
  }

  .acfc-rnw-nextseason-cta {
    margin-top: clamp(28px, 4vw, 40px);
    text-align: center;
  }

  /* Events and We Belong Here share the cream field, so the pair reads as one
     block with a single gap between them rather than stacked section padding. */
  .acfc-rnw-events-section.acfc-rnw-benefits {
    padding-bottom: 0;
  }

  .acfc-rnw-events-section .acfc-rnw-events--lead {
    margin-bottom: 0;
  }

  .acfc-rnw-events-section + .acfc-rnw-benefits {
    padding-top: clamp(40px, 6vw, 64px);
  }
  
  .acfc-rnw-feature-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    min-height: clamp(300px, 30vw, 400px);
    display: flex;
    align-items: flex-end;
  }
  
  .acfc-rnw-feature-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: grayscale(1);
    transform: scale(1.02);
    transition: filter 0.5s var(--ease-out), transform 0.6s var(--ease-out);
  }
  
  .acfc-rnw-feature-card:hover .acfc-rnw-feature-bg {
    filter: grayscale(0);
    transform: scale(1.07);
  }
  
  .acfc-rnw-feature-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.25) 55%, transparent 100%);
  }
  
  .acfc-rnw-feature-inner {
    position: relative;
    z-index: 2;
    padding: 28px 24px;
  }
  
  .acfc-rnw-feature-kicker {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--sol-rosa);
    margin-bottom: 10px;
  }
  
  .acfc-rnw-feature-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.3rem, 2.7vw, 1.6rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.015em;
    color: var(--line-white);
    margin: 0 0 10px;
    line-height: 1.1;
  }
  
  .acfc-rnw-feature-body {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.78);
    margin: 0;
    line-height: 1.6;
  }
  
  @media (max-width: 900px) {
    .acfc-rnw-feature-grid { grid-template-columns: 1fr; }
    .acfc-rnw-feature-card { min-height: 260px; }
    .acfc-rnw-feature-bg { filter: grayscale(0); }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-feature-inner { padding: 22px 18px; }
    .acfc-rnw-feature-title { font-size: 1.35rem; }
  }
  

  /* ---------- Testimonials ---------- */
  
  .acfc-rnw-quotes {
    background: var(--rnw-cream);
    padding: clamp(48px, 7vw, 80px) 0;
  }
  
  .acfc-rnw-quotes .acfc-rnw-section-title { color: var(--asphalt); }
  
  .acfc-rnw-quotes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(14px, 2vw, 22px);
    align-items: stretch;
  }
  
  .acfc-rnw-quote-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 40px 28px 26px;
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: var(--shadow-e2);
    transition:
      opacity 0.65s var(--ease-out),
      transform 0.65s var(--ease-out),
      var(--lift-transition);
  }

  .acfc-rnw-quote-card:hover,
  .acfc-rnw-quote-card:focus-within {
    translate: var(--lift-hover);
    box-shadow: var(--shadow-card-hover);
    border-color: rgba(241, 177, 165, 0.6);
  }
  
  .acfc-rnw-quote-mark {
    position: absolute;
    top: 10px;
    left: 22px;
    font-family: var(--font-serif);
    font-size: 4.5rem;
    line-height: 1;
    color: var(--sol-rosa);
    opacity: 0.85;
    pointer-events: none;
  }
  
  .acfc-rnw-quote-text {
    position: relative;
    flex: 1 1 auto;
    margin: 12px 0 22px;
    font-family: var(--font-serif);
    font-size: clamp(0.95rem, 1.6vw, 1.02rem);
    font-style: italic;
    line-height: 1.6;
    color: rgba(28, 28, 28, 0.88);
  }
  
  .acfc-rnw-quote-author {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: auto;
    border-top: 1px solid rgba(28, 28, 28, 0.1);
    padding-top: 16px;
  }
  
  @media (prefers-reduced-motion: reduce) {
    .acfc-rnw-quote-card:hover,
    .acfc-rnw-quote-card:focus-within {
      translate: none;
    }
  }
  
  .acfc-rnw-quote-name {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: var(--asphalt);
  }
  
  .acfc-rnw-quote-tier {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sol-rosa-dark);
  }
  
  @media (max-width: 900px) {
    .acfc-rnw-quotes-grid { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-quote-card { padding: 28px 20px 22px; }
    .acfc-rnw-quote-text { font-size: 0.9rem; }
  }
  

  /* ---------- FAQ ---------- */
  
  .acfc-rnw-faq {
    background: var(--rnw-paper);
    padding: clamp(48px, 7vw, 80px) 0;
  }
  
  .acfc-rnw-faq-body {
    max-width: 850px;
    margin: 0 auto;
  }
  
  .acfc-rnw-faq-tabs-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: clamp(20px, 3vw, 28px);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  
  .acfc-rnw-faq-tabs-wrap::-webkit-scrollbar {
    display: none;
  }
  
  .acfc-rnw-faq-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    padding: 5px;
    border-radius: var(--radius-full);
    border: 1px solid var(--rnw-paper-edge);
    background: var(--rnw-panel);
    box-shadow: var(--shadow-sm);
  }
  
  .acfc-rnw-faq-tab {
    font-family: 'Inter', sans-serif;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    padding: 10px 16px;
    border-radius: var(--radius-full);
    border: 1px solid transparent;
    background: transparent;
    color: var(--armour);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
  }
  
  .acfc-rnw-faq-tab:hover {
    color: var(--asphalt);
    background: var(--sol-rosa-soft);
  }
  
  .acfc-rnw-faq-tab.is-active {
    background: var(--sol-rosa);
    border-color: var(--sol-rosa);
    color: var(--pitch-black);
    box-shadow: 0 2px 10px rgba(241, 177, 165, 0.45);
  }
  
  .acfc-rnw-faq-panels {
    position: relative;
    overflow-anchor: none;
  }
  
  .acfc-rnw-faq-panel {
    display: none;
    flex-direction: column;
    gap: 10px;
    margin: 0;
  }
  
  .acfc-rnw-faq-panel.is-active {
    display: flex;
  }
  
  .acfc-rnw-faq-item {
    border: 1px solid var(--rnw-panel-edge);
    border-radius: var(--radius-md);
    background: var(--rnw-panel);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), background 0.25s var(--ease-out);
  }
  
  .acfc-rnw-faq-item[id] {
    scroll-margin-top: var(--rnw-faq-scroll-offset);
  }
  
  .acfc-rnw-faq-item[open] {
    border-color: rgba(241, 177, 165, 0.55);
    box-shadow: var(--shadow-card);
    background: linear-gradient(160deg, var(--rnw-panel) 0%, rgba(241, 177, 165, 0.08) 100%);
  }
  
  .acfc-rnw-faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.4;
    color: var(--asphalt);
    cursor: pointer;
    list-style: none;
    transition: color 0.2s var(--ease-out);
  }
  
  .acfc-rnw-faq-question:hover {
    color: var(--pitch-black);
  }
  
  .acfc-rnw-faq-question span {
    flex: 1;
    min-width: 0;
  }
  
  .acfc-rnw-faq-question::-webkit-details-marker { display: none; }
  
  .acfc-rnw-faq-chevron {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    padding: 7px;
    border-radius: 50%;
    color: var(--sol-rosa-dark);
    background: var(--sol-rosa-soft);
    border: 1px solid rgba(241, 177, 165, 0.35);
    transition: transform 0.3s var(--ease-out), background 0.2s var(--ease-out), color 0.2s var(--ease-out);
  }
  
  .acfc-rnw-faq-item[open] .acfc-rnw-faq-chevron {
    transform: rotate(180deg);
    background: var(--sol-rosa);
    color: var(--pitch-black);
    border-color: var(--sol-rosa);
  }
  
  .acfc-rnw-faq-answer {
    padding: 0 18px 18px;
    font-size: 0.9rem;
    color: var(--armour);
    line-height: 1.7;
  }
  
  .acfc-rnw-faq-answer p { margin: 0 0 10px; }
  .acfc-rnw-faq-answer p:last-child { margin-bottom: 0; }
  .acfc-rnw-faq-answer ul {
    margin: 8px 0 0;
    padding-left: 1.25rem;
  }
  .acfc-rnw-faq-answer li { margin-bottom: 6px; }
  .acfc-rnw-faq-answer li:last-child { margin-bottom: 0; }
  .acfc-rnw-faq-answer a {
    color: var(--sol-rosa-dark);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  
  .acfc-rnw-faq-answer a:hover {
    color: var(--asphalt);
  }
  
  .acfc-rnw-faq-help {
    margin: clamp(24px, 4vw, 32px) 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--rnw-paper-edge);
    text-align: center;
    font-size: 0.9rem;
    color: var(--armour);
  }
  
  .acfc-rnw-faq-help a {
    color: var(--asphalt);
    font-weight: 600;
    text-decoration: none;
  }
  
  .acfc-rnw-faq-help a:hover {
    color: var(--sol-rosa-dark);
    text-decoration: underline;
  }
  
  .acfc-rnw-faq-help span {
    margin: 0 0.35em;
    color: var(--rnw-panel-edge);
  }
  
  /* Legacy contact cards (currently commented out in HTML) */
  .acfc-rnw-faq-contact {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    max-width: 875px;
    margin: 0 auto 36px;
  }
  
  .acfc-rnw-faq-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-radius: var(--radius-md);
    background: var(--rnw-panel);
    border: 1px solid var(--rnw-panel-edge);
    color: var(--asphalt);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
  }
  
  .acfc-rnw-faq-contact-item svg {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    color: var(--sol-rosa);
  }
  
  .acfc-rnw-faq-contact-item span {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    min-width: 0;
    word-break: break-word;
  }
  
  a.acfc-rnw-faq-contact-item:hover,
  a.acfc-rnw-faq-contact-item:focus-visible {
    border-color: var(--sol-rosa);
    background: var(--sol-rosa-soft);
    color: var(--asphalt);
    box-shadow: var(--shadow-card);
  }
  
  a.acfc-rnw-faq-contact-item:hover svg,
  a.acfc-rnw-faq-contact-item:focus-visible svg {
    color: var(--sol-rosa-dark);
  }
  
  .acfc-rnw-faq-contact-label {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--armour);
  }
  
  @media (max-width: 720px) {
    .acfc-rnw-faq .acfc-rnw-section-head {
      padding-inline: 4px;
    }
  
    .acfc-rnw-faq-tabs-wrap {
      justify-content: flex-start;
      /* Room to scroll the last tab fully clear of the viewport edge
         rather than stopping flush against it. */
      padding-right: 16px;
      /* The tabs pill is now wider than the viewport (see .acfc-rnw-faq-tabs
         below), so its own rounded right edge sits off-screen and the
         visible edge is just a hard clip. Round this wrapper's own right
         corners so the scrollable edge always reads as a soft curve,
         regardless of scroll position. */
      border-top-right-radius: var(--radius-full);
      border-bottom-right-radius: var(--radius-full);
    }
  
    .acfc-rnw-faq-tabs {
      flex-wrap: nowrap;
      justify-content: flex-start;
      /* The base rule caps this at 100% of the (fixed-width) viewport, so
         the pill background never grows past that even though the tabs
         inside keep their natural width - the last tab pokes out past the
         pill's rounded edge instead of the wrap's horizontal scroll being
         able to reach it. Let it size to its full content instead. */
      width: max-content;
      max-width: none;
    }

    .acfc-rnw-faq-tab {
      flex-shrink: 0;
    }
  
    .acfc-rnw-faq-contact {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
    }
  
    .acfc-rnw-faq-contact-item {
      width: 100%;
      max-width: 360px;
    }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-faq-tab {
      font-size: 0.7rem;
      min-height: 44px;
      padding: 12px 14px;
    }
  
    .acfc-rnw-faq-question {
      font-size: 0.9rem;
      min-height: 44px;
      padding: 14px 16px;
    }
  
    .acfc-rnw-faq-answer {
      padding: 0 16px 16px;
      font-size: 0.875rem;
    }
  
    .acfc-rnw-faq-chevron {
      width: 28px;
      height: 28px;
      padding: 6px;
    }
  }
  

  /* ---------- HubSpot overrides ---------- */
  
  .container:has(.acfc-rnw-hero),
  .row:has(.acfc-rnw-hero),
  [class*="col"]:has(.acfc-rnw-hero) {
    overflow-x: visible !important;
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  

  /* ---------- Mobile coordination: fixed UI + shared CTAs ---------- */
  
  body:has(.acfc-rnw-notify.is-visible) .acfc-rnw-theme-toggle {
    bottom: calc(82px + env(safe-area-inset-bottom, 0px));
  }
  
  /*body:has(.acfc-rnw-notify.is-visible) .acfc-rnw-app {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }*/
  
  
  
  @media (max-width: 768px) {
    :root {
      --rnw-scroll-offset: 72px;
    }
  
    .acfc-rnw-jump-inner {
      padding: 8px 0 12px;
      gap: 6px;
    }
  
    .acfc-rnw-jump-link {
      min-height: 36px;
      padding: 0 14px;
      font-size: 0.7rem;
    }
  
    .acfc-rnw-theme-toggle {
      width: 44px;
      height: 44px;
      right: max(12px, env(safe-area-inset-right, 0px));
    }
  
    .acfc-rnw-cta-band {
      padding: clamp(48px, 10vw, 72px) 0 calc(48px + env(safe-area-inset-bottom, 0px));
    }
  
    .acfc-rnw-cta-band-title {
      font-size: clamp(1.45rem, 6.2vw, 1.9rem);
    }
  
    .acfc-rnw-cta-contact-item-label {
      white-space: normal;
    }
  
    .acfc-rnw-cta-band-actions,
    .acfc-rnw-sas-actions,
    .acfc-rnw-steps-cta {
      flex-direction: column;
      align-items: center;
    }
  
    .acfc-rnw-cta-band-actions .angelcity2026-btn,
    .acfc-rnw-sas-actions .angelcity2026-btn,
    .acfc-rnw-steps-cta .angelcity2026-btn,
    .acfc-rnw-midcta .angelcity2026-btn-primary {
      width: 100%;
      max-width: 320px;
      white-space: normal;
      text-align: center;
    }
  
    .acfc-rnw-faq-tab {
      min-height: 44px;
      padding: 12px 16px;
    }
  
    .acfc-rnw-events {
      margin-bottom: clamp(28px, 5vw, 40px);
    }
  
    .acfc-rnw-events-lead {
      max-width: none;
    }
  
    .angelcity2026-container {
      padding-left: max(16px, env(safe-area-inset-left, 0px));
      padding-right: max(16px, env(safe-area-inset-right, 0px));
    }
  }
  
  @media (max-width: 640px) {
    .acfc-rnw-hero-actions {
      flex-direction: column;
      align-items: stretch;
      width: 100%;
      max-width: 360px;
      margin-inline: auto;
    }
  
    .acfc-rnw-hero-actions .angelcity2026-btn {
      width: 100%;
      max-width: none;
      white-space: normal;
      text-align: center;
      padding-inline: 1.25rem;
    }
  
    .acfc-rnw-cta-contact-grid {
      flex-direction: column;
      align-items: center;
      width: fit-content;
      max-width: 100%;
      margin-inline: auto;
    }
  
    .acfc-rnw-cta-band a.acfc-rnw-cta-contact-item,
    .acfc-rnw-cta-band a.acfc-rnw-cta-contact-item:visited {
      width: 100%;
    }
  }
  
  @media (max-width: 480px) {
    .acfc-rnw-notify-btn {
      width: calc(100% - 32px);
      max-width: 360px;
      padding: 14px 24px;
    }
  
    .acfc-rnw-section-title {
      font-size: clamp(1.35rem, 6.2vw, 1.8rem);
    }
  
    .acfc-rnw-hero-title {
      font-size: clamp(1.9rem, 9.5vw, 2.4rem);
    }
  
    .acfc-rnw-member-value .acfc-rnw-incentive {
      padding: 14px 14px;
    }
  
    .acfc-rnw-incentive-title {
      font-size: clamp(0.95rem, 4.5vw, 1.15rem);
    }
  }
  


  /* =============== DEPOSITS MODULES =============== */

  :root {
    --dep-dark:      #111111;
    --dep-dark-mid:  #1a1a1a;
    --dep-card-dark: #242424;
    --dep-card-dark-border: rgba(255, 255, 255, 0.10);
    --dep-surface:      #fafaf8;
    --dep-surface-warm: #f6f4f1;
    --dep-panel:        #ffffff;
    --dep-panel-edge:   #e8e6e3;
    --dep-ink:   #121416;
    --dep-muted: rgba(255, 255, 255, 0.6);
  }

  /* ---------- Scroll-reveal ----------
     Elements are visible by default (no-JS / HubSpot fallback).
     JS adds 'acfc-dep-js' to <html> synchronously on load,
     which opts reveal items into the hidden->animated state. */
  
  .acfc-dep-reveal {
    transition: opacity 0.65s var(--ease-out), transform 0.65s var(--ease-out);
  }
  
  html.acfc-dep-js .acfc-dep-reveal {
    opacity: 0;
    transform: translateY(28px);
  }
  
  html.acfc-dep-js .acfc-dep-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
  }
  
  .acfc-dep-reveal-stagger > .acfc-dep-reveal:nth-child(2) { transition-delay: 0.08s; }
  .acfc-dep-reveal-stagger > .acfc-dep-reveal:nth-child(3) { transition-delay: 0.16s; }
  .acfc-dep-reveal-stagger > .acfc-dep-reveal:nth-child(4) { transition-delay: 0.24s; }
  .acfc-dep-reveal-stagger > .acfc-dep-reveal:nth-child(5) { transition-delay: 0.32s; }
  

  /* ---------- Shared eyebrow ---------- */
  
  .acfc-dep-eyebrow {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.75rem, 1.8vw, 0.875rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sol-rosa);
    margin: 0 0 12px;
  }
  
  /* Eyebrow on light/photo-background sections: pill badge for visibility
     without changing the color. Dark sections keep the plain text treatment. */
  .acfc-dep-why .acfc-dep-eyebrow,
  .acfc-dep-dates .acfc-dep-eyebrow,
  .acfc-dep-formsection .acfc-dep-eyebrow,
  .acfc-dep-features .acfc-dep-eyebrow {
    display: inline-flex;
    align-items: center;
    background: rgba(241, 177, 165, 0.14);
    border: 1px solid rgba(241, 177, 165, 0.40);
    border-radius: 999px;
    padding: 5px 14px 4px;
    margin-bottom: 14px;
    line-height: 1;
  }
  
  /* Why + Dates section eyebrows use black text for maximum legibility on the light bg */
  .acfc-dep-why .acfc-dep-eyebrow,
  .acfc-dep-dates .acfc-dep-eyebrow {
    color: var(--dep-ink);
  }
  

  /* ---------- FLOATING CTA BAR - GGT notify-bar pattern ---------- */
  
  .acfc-dep-notify {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000100;
    padding: 14px 16px;
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, transparent 100%);
    pointer-events: none;
    display: flex;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(100%);
    transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out), visibility 0.4s;
  }
  
  .acfc-dep-notify.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  
  .acfc-dep-notify.is-modal-open {
    opacity: 0;
    visibility: hidden;
    transform: translateY(100%);
    pointer-events: none;
  }
  
  .acfc-dep-notify-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    pointer-events: all;
    font-family: 'Inter', sans-serif;
    font-size: 0.9375rem;
    font-weight: 800;
    letter-spacing: 0.015em;
    text-transform: uppercase;
    padding: 15px 40px;
    border-radius: var(--radius-full);
    background: var(--sol-rosa);
    color: var(--pitch-black);
    border: none;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 4px 24px rgba(241, 177, 165, 0.45), 0 8px 32px rgba(0, 0, 0, 0.35);
    transition: var(--transition);
  }
  
  /* Only apply hover lift on true pointer devices. On touch screens (iOS/Android)
     the first tap fires :hover which shifts the button, requiring a second tap. */
  @media (hover: hover) {
    .acfc-dep-notify-btn:hover {
      background: var(--sol-rosa-dark);
      transform: translateY(-3px);
      box-shadow: 0 10px 36px rgba(241, 177, 165, 0.6), 0 8px 32px rgba(0, 0, 0, 0.35);
    }
  }
  
  /* Wrapper: centered, natural width - sharp image sits above the blur.
     pointer-events: none lets clicks fall through to the hero button below. */
  .acfc-dep-hero-img-wrap {
    position: relative;
    max-width: fit-content;
    margin: 0 auto;
    height: 100%;
    z-index: 4;
    pointer-events: none;
  }
  
  .acfc-dep-hero-img-wrap picture {
    display: block;
    width: 100%;
    height: 100%;
  }
  
  .acfc-dep-hero-img {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 5;
  }
  
  @media (min-width: 768px) {
    .acfc-dep-hero {
      height: auto;
      min-height: 0;
    }
  
    .acfc-dep-hero-img {
      width: 100%;
      height: auto;
      display: block;
    }
  }
  
  @media (max-width: 767px) {
    .acfc-dep-steps-grid .acfc-dep-step:nth-child(3), .acfc-dep-steps-grid .acfc-dep-step:nth-child(4) {
      margin-top: 0px !important;
  
  }
    .acfc-dep-hero {
      aspect-ratio: 1 / 1;
      height: auto;
      max-height: unset;
      min-height: unset;
      background-image: url('https://www.angelcity.com/hubfs/27SZN-Tix-Deposit-1x1.jpg');
    }
  
    /* No blur on mobile - image fills the full 4:5 frame */
    .acfc-dep-hero::before {
      display: none;
    }
  
    .acfc-dep-hero-img-wrap {
      width: 100%;
      max-width: 100%;
    }
  
    .acfc-dep-hero-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
  }
  

  .acfc-dep-section-head {
    text-align: center;
    margin-bottom: clamp(24px, 4vw, 40px);
  }
  
  .acfc-dep-section-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.5rem, 3.5vw, 2.4rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--dep-ink);
    margin: 0 0 8px;
  }
  
  .acfc-dep-section-lead {
    font-size: clamp(0.9rem, 1.8vw, 1rem);
    color: var(--armour);
    margin: 0;
    max-width: 540px;
    margin-left: auto;
    margin-right: auto;
  }

  /* ---------- EXPERIENCE HIGHLIGHTS ---------- */
  
  .acfc-dep-features {
    background: var(--dep-surface);
    padding: clamp(40px, 5.5vw, 68px) 0;
  }
  
  .acfc-dep-features .acfc-dep-eyebrow {
    color: var(--dep-ink);
  }
  
  .acfc-dep-features .acfc-dep-section-title {
    color: var(--dep-ink);
  }
  
  .acfc-dep-features .acfc-dep-section-lead {
    color: var(--armour);
  }
  
  .acfc-dep-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  
  .acfc-dep-feature-card {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    min-height: clamp(260px, 28vw, 340px);
    display: flex;
    align-items: flex-end;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  }
  
  .acfc-dep-feature-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center 30%;
    background-repeat: no-repeat;
    filter: grayscale(100%);
    transform: scale(1.03);
    transition: transform 0.55s cubic-bezier(0.23, 1, 0.32, 1), filter 0.45s ease;
  }
  
  .acfc-dep-feature-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.10) 0%,
      rgba(0, 0, 0, 0.40) 40%,
      rgba(0, 0, 0, 0.85) 75%,
      rgba(0, 0, 0, 0.95) 100%
    );
    pointer-events: none;
  }
  
  .acfc-dep-feature-inner {
    position: relative;
    z-index: 2;
    padding: 20px 22px 24px;
    width: 100%;
  }
  
  .acfc-dep-feature-card:hover {
    transform: translateY(-4px);
    border-color: rgba(241, 177, 165, 0.45);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(241, 177, 165, 0.1);
  }
  
  .acfc-dep-feature-card:hover .acfc-dep-feature-bg {
    filter: grayscale(80%);
    transform: scale(1.07);
  }
  
  .acfc-dep-feature-kicker {
    display: block;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sol-rosa);
    margin-bottom: 6px;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.8);
  }
  
  .acfc-dep-feature-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1rem, 1.4vw, 1.15rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: var(--line-white);
    margin: 0 0 8px;
    line-height: 1.15;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.9);
  }
  
  .acfc-dep-feature-body {
    font-size: 0.825rem;
    color: rgba(255, 255, 255, 0.88);
    line-height: 1.62;
    margin: 0;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.7);
  }
  

  /* ---------- CLOSING CTA BAND ---------- */
  
  .acfc-dep-cta-band {
    position: relative;
    padding: clamp(40px, 5.5vw, 68px) 0;
    text-align: center;
    background-image:
      linear-gradient(rgba(0, 0, 0, 0.70), rgba(0, 0, 0, 0.70)),
      url('https://angelcityfc-pm.web.app/assets/images/tickets-landing/tickets-faq.jpg');
    background-size: cover;
    background-position: center top;
    background-attachment: fixed;
    color: var(--line-white);
    border-bottom: 1px solid var(--sol-rosa);
  }
  
  .acfc-dep-cta-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.18) 0%, transparent 30%, transparent 70%, rgba(0,0,0,0.28) 100%);
    pointer-events: none;
  }
  
  .acfc-dep-cta-band-inner {
    max-width: 600px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
  
  .acfc-dep-cta-band-eyebrow {
    color: var(--sol-rosa) !important;
    margin-bottom: 14px;
  }
  
  .acfc-dep-cta-band-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(2rem, 5vw, 3.4rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    color: var(--line-white);
    line-height: 1.05;
    margin: 0 0 20px;
  }
  
  .acfc-dep-cta-band-title em {
    font-style: normal;
    color: var(--sol-rosa);
  }
  
  .acfc-dep-cta-band-lead {
    font-size: clamp(0.9rem, 1.8vw, 1.05rem);
    color: rgba(255, 255, 255, 0.72);
    margin: 0 0 16px;
    line-height: 1.7;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .acfc-dep-cta-band-actions {
    margin-bottom: 0;
  }
  
  .acfc-dep-cta-band .angelcity2026-btn-primary {
    background: var(--sol-rosa);
    color: var(--pitch-black);
    border-color: var(--sol-rosa);
    padding: 14px 36px;
    font-size: 1rem;
    letter-spacing: 0.04em;
  }
  
  .acfc-dep-cta-band .angelcity2026-btn-primary:hover {
    background: var(--sol-rosa-dark);
    border-color: var(--sol-rosa-dark);
    transform: translateY(-2px);
    box-shadow: 0 10px 32px var(--sol-rosa-glow);
  }
  
  .acfc-dep-cta-band-fine {
    margin-top: 20px;
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.65;
    letter-spacing: 0.02em;
  }
  
  @media (max-width: 768px) {
    .acfc-dep-cta-band {
      background-attachment: scroll;
    }
  }
  

  /* ---------- WHAT YOUR DEPOSIT SECURES ---------- */
  
  .acfc-dep-benefits {
    background: var(--dep-dark);
    color: var(--line-white);
    padding: clamp(48px, 6vw, 80px) 0;
  }
  
  .acfc-dep-benefits .acfc-dep-section-title { color: var(--line-white); }
  .acfc-dep-benefits .acfc-dep-section-lead  { color: rgba(255, 255, 255, 0.72); }
  
  .acfc-dep-benefits-layout {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(28px, 4vw, 56px);
    align-items: center;
    max-width: 1120px;
    margin: 0 auto;
  }
  
  .acfc-dep-benefits-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  
  .acfc-dep-benefits-item {
    display: grid;
    grid-template-columns: 26px 1fr;
    gap: 14px;
    align-items: start;
    padding: 14px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  }
  
  .acfc-dep-benefits-item:last-child {
    border-bottom: none;
  }
  
  .acfc-dep-benefits-check {
    width: 23px;
    height: 23px;
    flex-shrink: 0;
    margin-top: 2px;
  }
  
  .acfc-dep-benefits-check circle {
    fill: var(--sol-rosa);
  }
  
  .acfc-dep-benefits-item strong {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--line-white);
    margin-bottom: 3px;
  }
  
  .acfc-dep-benefits-item span {
    display: block;
    font-size: 0.865rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.65;
  }
  
  .acfc-dep-benefits-media {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  
  .acfc-dep-benefits-video-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  
  .acfc-dep-benefits-video-label {
    margin: 0 0 4px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--dep-muted);
  }
  
  .acfc-dep-benefits-video {
    width: 100%;
    display: block;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
    object-fit: cover;
    aspect-ratio: 16 / 9;
  }
  
  .acfc-dep-benefits-media img {
    width: 100%;
    display: block;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
    object-fit: cover;
    aspect-ratio: 16 / 9;
  }
  
  .acfc-dep-benefits-media img:last-child {
    margin-left: 24px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
  }
  
  .acfc-dep-benefits-actions {
    margin-top: 28px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
  }
  
  /* ---------- DEPOSIT INTEREST FORM (below FAQ) ---------- */
  
  .acfc-dep-formsection {
    background-image:
      linear-gradient(rgba(246, 244, 241, 0.80), rgba(246, 244, 241, 0.80)),
      url('https://angelcityfc-pm.web.app/assets/JEN33345.jpg');
    background-size: cover;
    background-position: center 30%;
    padding: clamp(48px, 6vw, 84px) 0;
    scroll-margin-top: 120px;
  }
  
  .acfc-dep-form-layout {
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: clamp(28px, 4vw, 52px);
    align-items: start;
    max-width: 1120px;
    margin: 0 auto;
    background: linear-gradient(150deg, #ffffff 0%, #fbf6f4 100%);
    border: 1px solid var(--sol-rosa);
    border-radius: var(--radius-xl);
    box-shadow: 10px 10px 0 0 rgba(242, 177, 163, 0.30);
    padding: clamp(28px, 3.5vw, 48px);
  }
  
  .acfc-dep-form-copy h2 {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.4rem, 2.8vw, 1.9rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.12;
    color: var(--dep-ink);
    margin: 0 0 14px;
  }
  
  .acfc-dep-form-copy p {
    font-size: 0.925rem;
    color: var(--armour);
    line-height: 1.72;
    margin: 0 0 16px;
  }
  
  .acfc-dep-form-contact {
    margin-top: 24px;
    padding: 20px 22px;
    border-radius: var(--radius-md);
    background: #ffffff;
    border: 1px solid rgba(241, 177, 165, 0.45);
    box-shadow: 4px 4px 0 0 rgba(241, 177, 165, 0.20);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
  
  .acfc-dep-form-contact > div {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 4px 16px 4px 0;
  }
  
  .acfc-dep-form-contact > div + div {
    padding: 4px 0 4px 16px;
    border-left: 1px solid rgba(241, 177, 165, 0.35);
  }
  
  .acfc-dep-form-contact strong {
    display: block;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--armour);
  }
  
  .acfc-dep-form-contact a {
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--dep-ink);
    text-decoration: none;
    transition: color 0.2s ease;
  }
  
  .acfc-dep-form-contact a:hover {
    color: var(--sol-rosa-dark);
  }
  
  .acfc-dep-form-shell {
    width: 100%;
    min-width: 0;
  }
  
  .acfc-dep-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    float: none;
    text-align: left;
  }
  
  .acfc-dep-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    width: 100%;
  }
  
  .acfc-dep-form-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  
  .acfc-dep-form-field.acfc-dep-full {
    grid-column: 1 / -1;
  }
  
  .acfc-dep-form-label-text {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--armour);
  }
  
  .acfc-dep-form-field input,
  .acfc-dep-form-field select,
  .acfc-dep-form-field textarea {
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    color: #374151 !important;
    background: #ffffff !important;
    border: 1.5px solid #d1d5db !important;
    border-radius: var(--radius-sm) !important;
    padding: 12px 14px;
    width: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    -webkit-appearance: none;
    appearance: none;
  }
  
  .acfc-dep-form-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 18px;
    padding-right: 38px;
  }
  
  .acfc-dep-form-field textarea {
    min-height: 118px;
    resize: vertical;
  }
  
  .acfc-dep-form-field input:focus,
  .acfc-dep-form-field select:focus,
  .acfc-dep-form-field textarea:focus {
    outline: none;
    border-color: var(--sol-rosa) !important;
    box-shadow: 0 0 0 3px var(--sol-rosa-soft) !important;
    color: #374151 !important;
  }
  
  .acfc-dep-form-field input::placeholder,
  .acfc-dep-form-field textarea::placeholder {
    color: #a9adb4;
  }
  
  /* Radio button group */
  .acfc-dep-form-radio-group {
    border: none;
    padding: 0;
    margin: 0;
  }
  
  .acfc-dep-form-radio-group legend.acfc-dep-form-label-text {
    margin-bottom: 12px;
    float: none;
    width: 100%;
  }
  
  .acfc-dep-form-radio-options {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }
  
  .acfc-dep-form-radio-options--sm {
    gap: 0px 8px;
  }
  
  .acfc-dep-subsection-group {
    border: none;
    padding: 0;
    margin: 0;
    animation: depSubsectionReveal 0.22s ease-out both;
  }
  
  @keyframes depSubsectionReveal {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  
  .acfc-dep-form-radio--sm span {
    padding: 7px 14px;
    font-size: 0.8rem;
  }
  
  .acfc-dep-form-pick-note {
    font-weight: 400;
    font-size: 0.8em;
    color: var(--dep-muted);
    letter-spacing: 0;
  }
  
  .acfc-dep-form-radio {
    display: inline-flex;
    align-items: center;
    gap: 0;
    cursor: pointer;
  }
  
  .acfc-dep-form-radio input[type="radio"],
  .acfc-dep-form-radio input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
  }
  
  .acfc-dep-form-radio span {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding: 10px 20px;
    border: 1.5px solid #d1d5db;
    border-radius: var(--radius-full);
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    background: #ffffff;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
    cursor: pointer;
    user-select: none;
  }
  
  .acfc-dep-form-radio input[type="radio"]:checked + span,
  .acfc-dep-form-radio input[type="checkbox"]:checked + span {
    border-color: var(--sol-rosa-dark);
    background: var(--sol-rosa);
    color: var(--pitch-black);
  }
  
  .acfc-dep-form-radio:hover span {
    border-color: var(--sol-rosa-dark);
  }
  
  /* ---------- FORM SUCCESS STATE ---------- */
  
  .acfc-dep-form-status { display: none; }
  .acfc-dep-form-status:not([hidden]) { display: flex; }
  
  .acfc-dep-form-status--error {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 12px;
    padding: 12px 16px;
    border-radius: var(--radius-md);
    background: rgba(248, 113, 113, 0.08);
    border: 1px solid rgba(248, 113, 113, 0.25);
    font-size: 0.875rem;
    color: #b91c1c;
  }
  
  .acfc-dep-form-status--success {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-top: 12px;
    padding: 20px 16px 16px;
    border-radius: var(--radius-md);
    text-align: center;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(241, 177, 165, 0.35) 0%, rgba(241, 177, 165, 0.18) 100%);
    border: 2px solid rgba(241, 177, 165, 0.7);
    box-shadow: 0 8px 32px rgba(241, 177, 165, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.5) inset;
    color: var(--dep-ink);
    font-weight: 500;
    animation: depSuccessPulse 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  
  @keyframes depSuccessPulse {
    0%   { transform: scale(0.8); opacity: 0; }
    50%  { transform: scale(1.05); }
    100% { transform: scale(1); opacity: 1; }
  }
  
  .acfc-dep-form-status.acfc-dep-celebrating {
    animation: depCelebrationShake 0.5s ease-in-out;
  }
  
  @keyframes depCelebrationShake {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    25%       { transform: translateX(-3px) rotate(-1deg); }
    75%       { transform: translateX(3px) rotate(1deg); }
  }
  
  .acfc-dep-celebration-anchor {
    position: relative;
  }
  
  .acfc-dep-celebration-container {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    pointer-events: none;
    z-index: 100;
  }
  
  .acfc-dep-success-logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 60px;
    filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.3));
    animation: depLogoShoot var(--duration, 1s) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
    transform-origin: center;
  }
  
  .acfc-dep-success-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    animation: depLogoSpin var(--duration, 1s) linear infinite;
  }
  
  @keyframes depLogoShoot {
    0%   { transform: translate(0, 0) scale(1); opacity: 1; }
    100% {
      transform:
        translate(
          calc(cos(var(--angle, 0deg)) * var(--distance, 150px)),
          calc(sin(var(--angle, 0deg)) * var(--distance, 150px))
        )
        scale(0.3);
      opacity: 0;
    }
  }
  
  @keyframes depLogoSpin {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  
  .acfc-dep-form-status-lead {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.01em;
    color: var(--dep-ink);
    animation: depTextFadeIn 0.4s ease-out 0.2s both;
  }
  
  .acfc-dep-form-status-lead::before {
    content: '\2713\00a0\00a0';
    font-weight: 700;
    font-size: 1.1em;
    color: var(--sol-rosa-dark);
    animation: depCheckmarkBounce 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.3s both;
    display: inline-block;
  }
  
  .acfc-dep-form-status-detail {
    display: block;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.55;
    color: var(--armour);
    animation: depTextFadeIn 0.4s ease-out 0.35s both;
  }
  
  @keyframes depTextFadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  
  @keyframes depCheckmarkBounce {
    0%   { transform: scale(0) rotate(-45deg); opacity: 0; }
    60%  { transform: scale(1.3) rotate(10deg); }
    100% { transform: scale(1) rotate(0deg); opacity: 1; }
  }
  
  .acfc-dep-form-consent {
    font-size: 0.775rem;
    color: var(--armour);
    line-height: 1.6;
    margin: 0;
    max-width: 420px;
    align-self: center;
    text-align: center;
  }
  
  .acfc-dep-form-submit {
    width: 100%;
    max-width: 400px;
    align-self: center;
  }
  
  .acfc-dep-form-submit:disabled {
    opacity: 0.6;
    cursor: progress;
    transform: none;
  }
  
  /* ---------- SUCCESS MODAL ---------- */
  
  .angelcity2026-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000300;
    background: rgba(0, 0, 0, 0.72);
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  
  .angelcity2026-modal-content {
    position: relative;
    background: var(--dep-panel);
    border-radius: var(--radius-lg);
    max-width: 480px;
    width: 100%;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.4);
    overflow: hidden;
  }
  
  .angelcity2026-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--radius-full);
    background: rgba(0, 0, 0, 0.06);
    color: var(--asphalt);
    cursor: pointer;
    transition: var(--transition);
  }
  
  .angelcity2026-modal-close:hover {
    background: var(--sol-rosa-soft);
    color: var(--sol-rosa-dark);
  }
  
  .angelcity2026-success-modal-header {
    padding: 36px 24px 8px;
    text-align: center;
  }
  
  .angelcity2026-success-modal-logo {
    width: 68px;
    height: auto;
    margin: 0 auto;
  }
  
  .angelcity2026-success-modal-body {
    padding: 8px 32px 34px;
    text-align: center;
  }
  
  .angelcity2026-success-modal-body h2 {
    font-family: 'Inter', sans-serif;
    font-size: 1.5rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    color: var(--dep-ink);
    margin: 14px 0 10px;
  }
  
  .angelcity2026-success-message {
    font-size: 0.925rem;
    color: var(--armour);
    line-height: 1.7;
    margin: 0 0 20px;
  }
  
  .angelcity2026-success-modal-close-btn {
    width: 100%;
  }
  
  /* ---------- FLOATING BAR: two actions ---------- */
  
  .acfc-dep-notify-group {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    pointer-events: none;
    flex-wrap: wrap;
    justify-content: center;
  }
  
  .acfc-dep-notify-btn--ghost {
    background: rgba(17, 17, 17, 0.88);
    color: var(--line-white) !important;
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  }
  
  .acfc-dep-notify-btn--ghost:hover {
    background: rgba(17, 17, 17, 0.96);
    border-color: var(--sol-rosa);
    color: var(--sol-rosa) !important;
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.45);
  }
  

  /* ============================================================
     RESPONSIVE
     ============================================================ */
  
  /* --- Tablet: 1024px and below --- */
  @media (max-width: 1024px) {
    /* Steps: 2-column */
    .acfc-dep-steps-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 0;
    }
    .acfc-dep-steps-grid .acfc-dep-step:nth-child(odd) {
      border-left: none;
      padding-left: 0;
    }
    .acfc-dep-steps-grid .acfc-dep-step:nth-child(3),
    .acfc-dep-steps-grid .acfc-dep-step:nth-child(4) {
      border-top: 1px solid rgba(255, 255, 255, 0.08);
      padding-top: 24px;
      margin-top: 24px;
    }
  
    /* Features: 2-column on tablet */
    .acfc-dep-features-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }
  
    /* Why cards + key dates: 2-column */
    .acfc-dep-why-grid,
    .acfc-dep-dates-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 22px;
    }
  
    /* Benefits + form: stack */
    .acfc-dep-benefits-layout,
    .acfc-dep-form-layout {
      grid-template-columns: 1fr;
    }
  
    .acfc-dep-benefits-media img {
      aspect-ratio: 16 / 10;
    }
  }
  
  /* --- Mobile: 768px and below --- */
  @media (max-width: 768px) {
  
    /* ---- Hero ---- */
    /* Hero is already handled by its own block */
  
    /* ---- Global mobile safety ----
       Long emails/URLs must wrap instead of forcing horizontal scroll, and the
       last section needs clearance so the fixed CTA bar never covers it. */
    .acfc-dep-app {
      overflow-x: hidden;
    }
    .acfc-dep-app p,
    .acfc-dep-app a,
    .acfc-dep-app strong,
    .acfc-dep-app span {
      overflow-wrap: break-word;
    }
  
    /* ---- Steps ---- */
    .acfc-dep-steps {
      padding: 32px 0;
    }
    .acfc-dep-section-head {
      text-align: center;
      margin-bottom: 20px;
    }
    .acfc-dep-steps-grid {
      grid-template-columns: 1fr;
      padding-top: 0;
      border-top: none;
      max-width: 440px;
      margin: 0 auto;
      gap: 0;
    }
  
    /* Steps: always show content on mobile - avoid empty reveal gaps.
       Must out-specify html.acfc-dep-js .acfc-dep-reveal. */
    html.acfc-dep-js .acfc-dep-steps-grid .acfc-dep-reveal {
      opacity: 1;
      transform: none;
    }
  
    /* Horizontal step row on mobile */
    .acfc-dep-step {
      display: grid;
      grid-template-columns: 44px 1fr;
      grid-template-rows: auto auto;
      column-gap: 14px;
      row-gap: 0;
      align-items: start;
      border-left: none;
      border-top: 1px solid rgba(255, 255, 255, 0.08);
      padding: 18px 0;
      text-align: left;
    }
    .acfc-dep-step:first-child {
      border-top: none;
      padding-top: 4px;
    }
  
    /* Number: column 1, rows 1+2 */
    .acfc-dep-step-number {
      grid-column: 1;
      grid-row: 1 / 3;
      font-size: 2rem;
      line-height: 1;
      margin: 0;
      padding: 0;
      border-bottom: none;
      align-self: start;
      padding-top: 2px;
    }
  
    /* Title: column 2, row 1 */
    .acfc-dep-step-title {
      grid-column: 2;
      grid-row: 1;
      margin: 0 0 4px;
      font-size: 0.875rem;
    }
  
    /* Body: column 2, row 2 */
    .acfc-dep-step-body {
      grid-column: 2;
      grid-row: 2;
      font-size: 0.82rem;
      line-height: 1.6;
    }
  
    /* ---- Features ---- */
    .acfc-dep-features-grid {
      grid-template-columns: 1fr;
      gap: 12px;
    }
    .acfc-dep-feature-card {
      min-height: clamp(220px, 60vw, 280px);
    }
  
    /* ---- FAQ ---- */
    .acfc-dep-faq {
      padding: 36px 0;
    }
    .acfc-dep-faq-question {
      font-size: 0.875rem;
      padding: 11px 16px;
    }
    .acfc-dep-faq-answer {
      padding: 0 16px 10px;
      font-size: 0.84rem;
    }
  
    /* ---- CTA Band ----
       Extra bottom padding clears the fixed CTA bar. */
    .acfc-dep-cta-band {
      background-attachment: scroll;
      padding: 52px 0 calc(68px + env(safe-area-inset-bottom, 0px));
    }
    .acfc-dep-cta-band-title {
      font-size: clamp(1.75rem, 8vw, 2.3rem);
    }
    .acfc-dep-cta-band .angelcity2026-btn-primary {
      width: 100%;
      max-width: 320px;
    }
  
    /* Force form and all children to fill width and align left */
    .acfc-dep-form {
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
      text-align: left !important;
    }
    /* Two-column grid on mobile: First/Last and Email/Phone pair up naturally.
       Full-width fields (.acfc-dep-full) already carry grid-column: 1 / -1. */
    .acfc-dep-form-grid {
      display: grid !important;
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 8px !important;
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
    }
    .acfc-dep-form-field,
    .acfc-dep-form label {
      display: flex !important;
      flex-direction: column !important;
      width: 100% !important;
      min-width: 0 !important;
      box-sizing: border-box !important;
      float: none !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }
    /* The display: flex !important above overrides the browser's [hidden] attribute
       (which sets display: none). Restore it so JS-toggled subsections stay hidden
       until the matching membership type is selected. */
    .acfc-dep-form-field[hidden],
    .acfc-dep-form label[hidden] {
      display: none !important;
    }
    /* Radio pill labels must not inherit the column-flex/full-width override above.
       Must use `label.acfc-dep-form-radio` (class + element) to beat the
       `.acfc-dep-form label` rule which is also class + element but declared above;
       the extra class raises specificity so width: auto wins. */
    .acfc-dep-form label.acfc-dep-form-radio {
      display: inline-flex !important;
      flex-direction: row !important;
      width: auto !important;
      min-width: 0 !important;
    }
    .acfc-dep-form input,
    .acfc-dep-form select,
    .acfc-dep-form textarea {
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }
    /* ---- Jump nav: single-row scroll strip instead of wrapping to 3 rows ---- */
    .acfc-dep-jump {
      padding: 12px 0;
    }
    .acfc-dep-jump-inner {
      gap: 8px;
      flex-wrap: nowrap;
      justify-content: flex-start;
      overflow-x: auto;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      /* Bleed past the container so pills scroll edge to edge */
      margin-left: max(-16px, calc(-1 * env(safe-area-inset-left, 0px) - 16px));
      margin-right: max(-16px, calc(-1 * env(safe-area-inset-right, 0px) - 16px));
      padding: 2px 16px;
    }
    .acfc-dep-jump-inner::-webkit-scrollbar {
      display: none;
    }
    .acfc-dep-jump-link {
      font-size: 0.72rem;
      padding: 9px 16px;
      flex: 0 0 auto;
      white-space: nowrap;
    }
  
    /* ---- Why + Key dates: single column ---- */
    .acfc-dep-why,
    .acfc-dep-dates,
    .acfc-dep-benefits,
    .acfc-dep-formsection {
      padding: 40px 0;
    }
    .acfc-dep-why-grid,
    .acfc-dep-dates-grid {
      grid-template-columns: 1fr;
      gap: 20px;
      max-width: 440px;
    }
    .acfc-dep-why-card,
    .acfc-dep-date-card {
      box-shadow: 6px 6px 0 0 rgba(242, 177, 163, 0.38);
      padding: 22px 20px;
    }
  
    /* ---- Why cards: tighter icon column ---- */
    .acfc-dep-why-card {
      grid-template-columns: 38px 1fr;
      column-gap: 12px;
    }
    .acfc-dep-why-icon {
      width: 38px;
      height: 38px;
    }
    .acfc-dep-why-icon svg {
      width: 20px;
      height: 20px;
    }
    .acfc-dep-why-title {
      font-size: 1rem;
    }
    .acfc-dep-why-body {
      font-size: 0.85rem;
    }
  
    /* ---- Key dates ---- */
    .acfc-dep-date-value {
      font-size: 1.35rem;
    }
    .acfc-dep-date-body {
      font-size: 0.82rem;
    }
  
    /* ---- Features ---- */
    .acfc-dep-feature-inner {
      padding: 16px 18px 20px;
    }
    .acfc-dep-feature-title {
      font-size: 1rem;
    }
    .acfc-dep-feature-body {
      font-size: 0.82rem;
    }
  
    /* ---- Benefits ---- */
    .acfc-dep-benefits-actions {
      flex-direction: column;
      align-items: stretch;
    }
    .acfc-dep-benefits-actions .angelcity2026-btn {
      width: 100%;
      max-width: 320px;
    }
    .acfc-dep-benefits-media {
      order: -1;
    }
    .acfc-dep-benefits-media img:last-child {
      display: none;
    }
    .acfc-dep-benefits-actions {
      justify-content: center;
      align-items: center;
    }
    .acfc-dep-benefits-item {
      grid-template-columns: 22px 1fr;
      gap: 11px;
      padding: 12px 0;
    }
    .acfc-dep-benefits-check {
      width: 20px;
      height: 20px;
    }
    .acfc-dep-benefits-item strong {
      font-size: 0.9rem;
    }
    .acfc-dep-benefits-item span {
      font-size: 0.825rem;
    }
  
    /* ---- Form ---- */
    .acfc-dep-form-layout {
      box-shadow: 6px 6px 0 0 rgba(242, 177, 163, 0.30);
      padding: 24px 28px 28px;
    }
    /* Center the entire copy column so the eyebrow pill, heading, and body
       all align to the middle without setting text-align on each child. */
    .acfc-dep-form-copy {
      text-align: center;
    }
    .acfc-dep-form-copy h2 {
      font-size: clamp(1.25rem, 6vw, 1.6rem);
    }
    .acfc-dep-form-copy p {
      font-size: 0.875rem;
    }
    .acfc-dep-form-copy .acfc-dep-eyebrow {
      display: inline-flex;
    }
    .acfc-dep-form-contact {
      margin-top: 18px;
      padding: 10px 14px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      text-align: left;
    }
    .acfc-dep-form-contact > div {
      padding: 0;
      border-top: none;
      flex-direction: row;
      align-items: baseline;
      gap: 8px;
    }
    .acfc-dep-form-contact > div + div {
      border-left: none;
      border-top: none;
      padding: 0;
    }
    .acfc-dep-form-contact > div:first-child {
      border-top: none;
      padding: 0;
    }
    .acfc-dep-form-contact a {
      font-size: 0.85rem;
      word-break: normal;
    }
    .acfc-dep-form-contact strong {
      font-size: 0.6rem;
      white-space: nowrap;
    }
    /* 16px min prevents iOS Safari auto-zoom on field focus */
    .acfc-dep-form-field input,
    .acfc-dep-form-field select,
    .acfc-dep-form-field textarea {
      font-size: 15px;
    }
    .acfc-dep-form-submit {
      width: 100%;
      max-width: none;
    }
    .acfc-dep-form-consent {
      max-width: none;
      text-align: center;
    }
  
    /* ---- Membership type radio pills: horizontal scroll, no wrap ---- */
    .acfc-dep-form-radio-options {
      flex-wrap: nowrap;
      overflow-x: auto;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      gap: 8px;
      padding-bottom: 4px;
    }
    .acfc-dep-form-radio-options::-webkit-scrollbar {
      display: none;
    }
    .acfc-dep-form-radio-options .acfc-dep-form-radio {
      flex: 0 0 auto;
    }
    .acfc-dep-form-radio span {
      padding: 8px 14px;
      font-size: 0.82rem;
      white-space: nowrap;
    }
  
    /* ---- Sub-section option groups (Suites / Premium): 2-column grid so options
       align cleanly instead of wrapping into uneven rows. Pills fill the cell and
       center their label so the grid reads as a structured list. ---- */
    .acfc-dep-subsection-group .acfc-dep-form-radio-options--sm {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      row-gap: 0px;
      column-gap: 8px;
    }
    .acfc-dep-subsection-group .acfc-dep-form-radio--sm {
      width: 100%;
    }
    .acfc-dep-subsection-group .acfc-dep-form-radio--sm span {
      width: 100%;
      justify-content: center;
      text-align: center;
      white-space: normal;
      line-height: 1.25;
      padding: 8px 10px;
    }
  
    /* ---- Floating bar: keep both actions on one row so it covers less screen ---- */
    .acfc-dep-notify {
      padding: 10px 12px;
      padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    }
    .acfc-dep-notify-group {
      width: 100%;
      max-width: 440px;
      flex-direction: row;
      flex-wrap: nowrap;
      gap: 8px;
    }
    .acfc-dep-notify-btn {
      flex: 1 1 0;
      min-width: 0;
      justify-content: center;
      padding: 13px 10px;
      font-size: 0.78rem;
      letter-spacing: 0.05em;
      white-space: nowrap;
    }
  }
  
  /* --- Small mobile: 480px and below --- */
  @media (max-width: 480px) {
    /* Section headings */
    .acfc-dep-section-title {
      font-size: clamp(1.35rem, 6.2vw, 1.8rem);
    }
  
    /* Steps: tighter */
    .acfc-dep-step-number {
      font-size: 2rem;
    }
  
    /* CTA band button full width */
    .acfc-dep-cta-band .angelcity2026-btn-primary {
      width: 100%;
      max-width: none;
    }
  
    /* Single column form at very small screens - all explicit */
    .acfc-dep-form {
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
      text-align: left !important;
    }
    .acfc-dep-form-grid {
      display: grid !important;
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 8px !important;
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
    }
    .acfc-dep-form-field,
    .acfc-dep-form label {
      display: flex !important;
      flex-direction: column !important;
      width: 100% !important;
      min-width: 0 !important;
      box-sizing: border-box !important;
      float: none !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }
    .acfc-dep-form-field[hidden],
    .acfc-dep-form label[hidden] {
      display: none !important;
    }
    .acfc-dep-form label.acfc-dep-form-radio {
      display: inline-flex !important;
      flex-direction: row !important;
      width: auto !important;
      min-width: 0 !important;
    }
    .acfc-dep-form input,
    .acfc-dep-form select,
    .acfc-dep-form textarea {
      width: 100% !important;
      box-sizing: border-box !important;
      float: none !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }
  }
  

  /* ============================================================
     SUCCESS MODAL
     ============================================================ */
  
  .acfc-dep-success-modal {
    position: fixed;
    inset: 0;
    z-index: 10000200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(16px, env(safe-area-inset-top, 0px))
             max(16px, env(safe-area-inset-right, 0px))
             max(16px, env(safe-area-inset-bottom, 0px))
             max(16px, env(safe-area-inset-left, 0px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .acfc-dep-success-modal[hidden] {
    display: none !important;
  }
  
  .acfc-dep-success-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  
  .acfc-dep-success-modal-panel {
    position: relative;
    width: 100%;
    max-width: 440px;
    flex: 0 1 auto;
    align-self: center;
    z-index: 1;
    background: #111;
    color: #fff;
    border-radius: var(--radius-xl);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
  }
  
  .acfc-dep-celebration-anchor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    pointer-events: none;
    z-index: 5;
  }
  
  .acfc-dep-success-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    width: 36px;
    height: 36px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background 0.15s, color 0.15s;
  }
  
  .acfc-dep-success-modal-close:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
  }
  
  .acfc-dep-success-modal-body {
    padding: 40px 32px 36px;
    text-align: center;
  }
  
  .acfc-dep-success-modal-eyebrow {
    margin: 0 0 8px;
  }
  
  .acfc-dep-success-modal-title {
    font-size: clamp(1.6rem, 5vw, 2rem);
    margin: 0 0 12px;
    color: #fff;
  }
  
  .acfc-dep-success-modal-lead {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.6;
    margin: 0 auto;
    max-width: 32ch;
  }
  
  /* Celebration burst, appended to the fixed modal overlay so it centres on the viewport */
  .acfc-dep-celebration-container {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    pointer-events: none;
    z-index: 10000300;
  }
  
  .acfc-dep-success-logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 60px;
    filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.4));
    animation: depLogoShoot var(--duration, 1s) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
    transform-origin: center;
  }
  
  .acfc-dep-success-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    animation: depLogoSpin var(--duration, 1s) linear infinite;
  }
  
  @keyframes depLogoShoot {
    0%   { transform: translate(0, 0) scale(1); opacity: 1; }
    100% {
      transform:
        translate(
          calc(cos(var(--angle, 0deg)) * var(--distance, 150px)),
          calc(sin(var(--angle, 0deg)) * var(--distance, 150px))
        )
        scale(0.5);
      opacity: 0;
    }
  }
  
  @keyframes depLogoSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
  }
  
  @media (prefers-reduced-motion: reduce) {
    .acfc-dep-success-logo,
    .acfc-dep-success-logo img { animation: none !important; }
  }
  
  /* Mobile: bottom sheet */
  @media (max-width: 600px) {
    .acfc-dep-success-modal {
      align-items: flex-end;
      padding: 0;
      overflow-y: hidden;
    }
  
    .acfc-dep-success-modal-panel {
      max-width: 100%;
      width: 100%;
      border-radius: 20px 20px 0 0;
      max-height: 92dvh;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.4);
      margin: 0 auto;
    }
  
    .acfc-dep-success-modal-panel::before {
      content: '';
      display: block;
      width: 36px;
      height: 4px;
      background: rgba(255, 255, 255, 0.2);
      border-radius: 2px;
      margin: 12px auto 0;
    }
  
    .acfc-dep-success-modal-body {
      padding: 24px 28px 36px;
      padding-bottom: calc(36px + env(safe-area-inset-bottom, 0px));
    }
  }
  


  /* ---------- Stadium seat map ----------
     Hotspot paths are traced from the chart image, so they sit in the same
     525x520 space as the <img> underneath and scale with it. */

  .acfc-dep-seatmap {
    background: var(--dep-surface-warm);
    padding: clamp(40px, 5.5vw, 68px) 0;
  }

  .acfc-dep-seatmap .acfc-dep-eyebrow {
    color: var(--dep-ink);
  }

  /* Layout */

  .acfc-dep-seatmap-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: clamp(16px, 2.5vw, 32px);
    align-items: start;
  }

  .acfc-dep-seatmap-stage-wrap {
    min-width: 0;
  }

  .acfc-dep-seatmap-stage {
    position: relative;
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    aspect-ratio: 525 / 520;
    background: var(--dep-panel);
    border: 1px solid var(--dep-panel-edge);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    overflow: hidden;
  }

  .acfc-dep-seatmap-base {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .acfc-dep-seatmap-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    /* only the zone paths are interactive, so the gaps between them stay inert */
    pointer-events: none;
  }

  /* Zones */

  .acfc-dep-seatmap-zone {
    pointer-events: all;
    cursor: pointer;
    fill: transparent;
    stroke: transparent;
    /* a hairline stroke gives the thin loge and bench strips a usable target */
    stroke-width: 2.5;
    stroke-linejoin: round;
    transition: fill 0.22s ease, stroke 0.22s ease, opacity 0.22s ease;
  }

  .acfc-dep-seatmap-zone--supporters { --zone-tint: 47, 125, 79; }
  .acfc-dep-seatmap-zone--general    { --zone-tint: 47, 111, 176; }
  .acfc-dep-seatmap-zone--premium    { --zone-tint: 139, 75, 171; }
  .acfc-dep-seatmap-zone--suites     { --zone-tint: 192, 138, 46; }

  .acfc-dep-seatmap-zone:hover,
  .acfc-dep-seatmap-zone:focus-visible,
  .acfc-dep-seatmap-zone.is-active {
    fill: rgba(var(--zone-tint), 0.62);
    stroke: #ffffff;
    outline: none;
  }

  .acfc-dep-seatmap-zone.is-active {
    fill: rgba(var(--zone-tint), 0.72);
  }

  /* Whole-map response: everything that is not the focus of attention recedes,
     so the highlighted area reads instantly instead of competing with the chart.
     The scrim and spotlight live inside the SVG so paint order is explicit. */
  .acfc-dep-seatmap-scrim {
    pointer-events: none;
    fill: #fafaf8;
    opacity: 0;
    transition: opacity 0.28s ease;
  }

  .acfc-dep-seatmap-stage.is-engaged .acfc-dep-seatmap-scrim {
    opacity: 0.66;
  }

  .acfc-dep-seatmap-spotlight {
    pointer-events: none;
    fill: rgba(var(--zone-tint, 107, 114, 128), 0.72);
    stroke: #ffffff;
    stroke-width: 2.5;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 5px var(--sol-rosa-glow));
  }

  .acfc-dep-seatmap-hint {
    margin: 12px 0 0;
    text-align: center;
    font-size: 0.78rem;
    color: var(--armour);
  }

  /* Detail panel */

  .acfc-dep-seatmap-panel {
    position: relative;
    min-height: 320px;
    padding: clamp(16px, 2vw, 22px);
    background: var(--dep-panel);
    border: 1px solid var(--dep-panel-edge);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
  }

  /* Resting state: a nested card so the panel reads as considered rather than
     empty, using the same rosa pill and hairline rules as the rest of the page. */
  .acfc-dep-seatmap-panel-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 280px;
    padding: clamp(20px, 3vw, 30px) clamp(16px, 3vw, 26px);
    border: 1px solid var(--dep-panel-edge);
    border-radius: var(--radius-sm);
    background:
      radial-gradient(120% 90% at 50% 0%, rgba(241, 177, 165, 0.16) 0%, rgba(241, 177, 165, 0) 62%),
      linear-gradient(180deg, var(--dep-panel) 0%, var(--dep-surface-warm) 100%);
    color: var(--armour);
  }

  /* the display rule above would otherwise beat the UA [hidden] default */
  .acfc-dep-seatmap-panel-empty[hidden] {
    display: none;
  }

  .acfc-dep-seatmap-panel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: var(--radius-full);
    background: var(--dep-panel);
    border: 1px solid rgba(241, 177, 165, 0.55);
    box-shadow: 0 0 0 6px rgba(241, 177, 165, 0.12), var(--shadow-sm);
  }

  .acfc-dep-seatmap-panel-icon svg {
    width: 26px;
    height: 26px;
    color: var(--sol-rosa-dark);
  }

  .acfc-dep-seatmap-panel-kicker {
    display: inline-flex;
    align-items: center;
    margin: 18px 0 0;
    padding: 5px 12px 4px;
    border-radius: var(--radius-full);
    background: rgba(241, 177, 165, 0.14);
    border: 1px solid rgba(241, 177, 165, 0.40);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    line-height: 1;
    color: var(--dep-ink);
  }

  .acfc-dep-seatmap-panel-empty .acfc-dep-seatmap-panel-title {
    margin: 12px 0 8px;
  }

  .acfc-dep-seatmap-panel-empty .acfc-dep-seatmap-panel-desc {
    max-width: 34ch;
  }

  .acfc-dep-seatmap-panel-meta {
    width: min(100%, 280px);
    margin: 20px 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--dep-panel-edge);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--armour);
  }

  .acfc-dep-seatmap-panel-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1rem, 2vw, 1.25rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: var(--dep-ink);
    margin: 0;
  }

  .acfc-dep-seatmap-panel-desc,
  .acfc-dep-seatmap-panel-blurb {
    font-size: 0.85rem;
    line-height: 1.6;
    color: var(--armour);
    margin: 0;
  }

  .acfc-dep-seatmap-panel-note {
    display: block;
    margin-top: 8px;
    font-size: 0.75rem;
    font-style: italic;
    color: var(--armour);
  }

  /* The official section images pair the chart with a price block on the
     right and a title above. The frame below shows only the chart, so no
     pricing is published here. Offsets are percentages of the frame, so the
     crop holds at any rendered size. Two variants because the artwork ships
     on two canvas heights. */
  .acfc-dep-seatmap-panel-media {
    --thumb-w: 203.4%;
    --thumb-x: -13.6%;
    --thumb-y: -22.7%;
    position: relative;
    aspect-ratio: 227 / 200;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--dep-surface-warm);
    border: 1px solid var(--dep-panel-edge);
  }

  .acfc-dep-seatmap-panel-media.is-tall-art {
    --thumb-w: 176.5%;
    --thumb-x: 1.25%;
    --thumb-y: -19.2%;
  }

  .acfc-dep-seatmap-panel-thumb {
    display: block;
    position: absolute;
    width: var(--thumb-w);
    max-width: none; /* overrides the global img rule, which would undo the crop */
    height: auto;
    left: var(--thumb-x);
    top: var(--thumb-y);
  }

  /* Flex column so the title always reads before the badge row */
  .acfc-dep-seatmap-panel-info {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  /* Title + badge on one line: badge sits just to the right of the last
     letter with a small gap. align-items: center pins the pill to the
     cap-height midpoint of the headline. */
  .acfc-dep-seatmap-panel-title-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-top: 12px;
  }

  /* All-caps has no descenders, so a symmetrically padded pill reads top-heavy.
     line-height 1 plus one extra pixel above optically centres the label. */
  .acfc-dep-seatmap-tier-badge {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    /* the right inset also drops the trailing letter-space so the label
       sits centred horizontally as well */
    padding: 6px calc(11px - 0.14em) 4px 11px;
    font-size: 0.66rem;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-radius: var(--radius-full);
    color: #ffffff;
    background: #6b7280;
  }

  .acfc-dep-seatmap-tier-badge[data-tier="supporters"] { background: #2f7d4f; }
  .acfc-dep-seatmap-tier-badge[data-tier="general"]    { background: #2f6fb0; }
  .acfc-dep-seatmap-tier-badge[data-tier="premium"]    { background: #8b4bab; }
  .acfc-dep-seatmap-tier-badge[data-tier="suites"]     { background: #a9761f; }

  .acfc-dep-seatmap-panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
  }

  /* "See It In 3D" button: inverted so it reads clearly against the panel
     background and pairs with the rosa primary button without competing. */
  .acfc-dep-seatmap-panel-actions #acfcStSeatmap3d {
    background: var(--asphalt);
    color: var(--line-white);
    border-color: var(--asphalt);
  }

  .acfc-dep-seatmap-panel-actions #acfcStSeatmap3d:hover {
    background: #1a1a1a;
    border-color: #1a1a1a;
    color: var(--line-white);
  }

  .acfc-dep-seatmap-panel-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    color: var(--dep-ink);
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--dep-panel-edge);
    border-radius: var(--radius-full);
    transition: border-color 0.25s ease, color 0.25s ease;
  }

  .acfc-dep-seatmap-panel-close svg {
    width: 15px;
    height: 15px;
  }

  .acfc-dep-seatmap-panel-close:hover,
  .acfc-dep-seatmap-panel-close:focus-visible {
    border-color: var(--sol-rosa);
    color: var(--sol-rosa-dark);
  }

  /* Zone list */

  .acfc-dep-seatmap-list-wrap {
    margin-top: clamp(24px, 3.5vw, 38px);
  }

  .acfc-dep-seatmap-list-heading {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.95rem, 1.8vw, 1.1rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    color: var(--dep-ink);
    margin: 0 0 14px;
  }

  .acfc-dep-seatmap-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 10px;
  }

  .acfc-dep-seatmap-list-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    text-align: left;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--dep-ink);
    background: var(--dep-panel);
    border: 1px solid var(--dep-panel-edge);
    border-radius: var(--radius-sm);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
  }

  .acfc-dep-seatmap-list-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .acfc-dep-seatmap-list-name {
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.2;
  }

  .acfc-dep-seatmap-list-item::before {
    content: "";
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 2px;
    background: rgb(var(--zone-tint, 107, 114, 128));
  }

  .acfc-dep-seatmap-list-item[data-tier="supporters"] { --zone-tint: 47, 125, 79; }
  .acfc-dep-seatmap-list-item[data-tier="general"]    { --zone-tint: 47, 111, 176; }
  .acfc-dep-seatmap-list-item[data-tier="premium"]    { --zone-tint: 139, 75, 171; }
  .acfc-dep-seatmap-list-item[data-tier="suites"]     { --zone-tint: 192, 138, 46; }

  .acfc-dep-seatmap-list-item:hover,
  .acfc-dep-seatmap-list-item:focus-visible,
  .acfc-dep-seatmap-list-item.is-active {
    border-color: var(--sol-rosa);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-2px);
    outline: none;
  }

  .acfc-dep-seatmap-list-item.is-dimmed {
    opacity: 0.4;
  }

  /* Tier filter: zones outside the chosen tier step back on the map */
  .acfc-dep-seatmap-zone.is-dimmed {
    opacity: 0.25;
  }

  @media (max-width: 960px) {
    .acfc-dep-seatmap-layout {
      grid-template-columns: minmax(0, 1fr);
    }

    .acfc-dep-seatmap-panel {
      min-height: 0;
    }

    .acfc-dep-seatmap-panel-empty {
      min-height: 0;
      padding: 24px 20px;
    }
  }

  /* Mobile: hide the SVG map entirely.
     The map needs enough width to read individual zone labels. Below 680px it
     shrinks past the point of usefulness, so we remove it and let the list +
     panel carry all the interaction. JS auto-selects Standing Supporters so
     the panel is never in an empty state when the map can't be seen. */
  @media (max-width: 680px) {
    .acfc-dep-seatmap-stage-wrap {
      display: none;
    }

    /* Without the map the layout column is already 1fr (960px rule above),
       so the panel now stretches full-width. Give it a bit more breathing
       room by removing the aside min-height floor. */
    .acfc-dep-seatmap-panel {
      min-height: 0;
    }

    /* Centre the zone identity block: title + badge row */
    .acfc-dep-seatmap-panel-title-row {
      justify-content: center;
    }

    .acfc-dep-seatmap-panel-title {
      text-align: center;
    }
  }

  @media (max-width: 560px) {
    .acfc-dep-seatmap-list {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .acfc-dep-seatmap-list-item {
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 6px;
    }

    /* hide the colour dot on mobile, centering makes it look orphaned */
    .acfc-dep-seatmap-list-item::before {
      display: none;
    }

    .acfc-dep-seatmap-panel-actions .angelcity2026-btn {
      width: 100%;
      justify-content: center;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .acfc-dep-seatmap-list-item:hover,
    .acfc-dep-seatmap-list-item.is-active {
      transform: none;
    }
  }


  /* =============== 2027 SEASON TICKETS PAGE =============== */

  html:has(.acfc-st-app) .sr-offer-bar-01 {
    display: none !important;
  }

  .container:has(.acfc-st-app),
  .row:has(.acfc-st-app),
  [class*="col"]:has(.acfc-st-app) {
    overflow-x: visible !important;
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* The light theme darkens secondary buttons, but these Deposits sections
     sit on dark backgrounds, so they keep the light-on-dark outline. */
  [data-theme="light"] .acfc-dep-benefits .angelcity2026-btn-secondary,
  [data-theme="light"] .acfc-dep-benefits a.angelcity2026-btn.angelcity2026-btn-secondary,
  [data-theme="light"] .acfc-dep-cta-band .angelcity2026-btn-secondary,
  [data-theme="light"] .acfc-dep-cta-band a.angelcity2026-btn.angelcity2026-btn-secondary {
    color: var(--line-white);
    border-color: rgba(255, 255, 255, 0.45);
  }

  [data-theme="light"] .acfc-dep-benefits .angelcity2026-btn-secondary:hover,
  [data-theme="light"] .acfc-dep-benefits .angelcity2026-btn-secondary:focus-visible,
  [data-theme="light"] .acfc-dep-cta-band .angelcity2026-btn-secondary:hover,
  [data-theme="light"] .acfc-dep-cta-band .angelcity2026-btn-secondary:focus-visible {
    color: var(--line-white);
    border-color: var(--line-white);
    background: rgba(255, 255, 255, 0.08);
  }

  .acfc-dep-cta-band-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }

  /* Events is followed by the moments module here, not more benefits */
  .acfc-st-app .acfc-rnw-events-section.acfc-rnw-benefits {
    padding-bottom: clamp(56px, 8vw, 96px);
  }

  /* STM shirt card, restyled to sit on the dark Membership Benefits section */
  .acfc-st-benefits-shirt {
    max-width: 1120px;
    margin: 0 auto clamp(16px, 2.2vw, 24px);
  }

  .acfc-st-benefits-shirt .acfc-rnw-incentive--shirt {
    padding: clamp(18px, 2.6vw, 28px);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-lg);
  }

  .acfc-st-benefits-shirt .acfc-rnw-incentive-icon {
    color: var(--sol-rosa);
  }

  .acfc-st-benefits-shirt .acfc-rnw-incentive-title {
    color: var(--line-white);
  }

  .acfc-st-benefits-shirt .acfc-rnw-incentive-desc {
    color: rgba(255, 255, 255, 0.78);
  }

  .acfc-st-benefits-shirt .acfc-rnw-shirt-note {
    border-top-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.58);
  }

  @media (max-width: 900px) {
    .acfc-st-benefits-shirt .acfc-rnw-incentive--shirt {
      grid-template-columns: 1fr;
      gap: 18px;
    }
  }

  .acfc-st-moments-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }

  /* Testimonials: member photo beside the name */
  .acfc-st-quote-author {
    flex-direction: row;
    align-items: center;
    gap: 14px;
  }

  .acfc-st-quote-avatar {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--sol-rosa);
    box-shadow: var(--shadow-e1);
  }

  .acfc-st-quote-meta {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
  }

  .acfc-st-quotes .acfc-rnw-quote-card {
    padding-top: 48px;
  }

  @media (max-width: 640px) {
    .acfc-st-moments-actions,
    .acfc-dep-cta-band-actions {
      flex-direction: column;
      align-items: stretch;
      width: 100%;
      max-width: 360px;
      margin-inline: auto;
    }

    .acfc-st-moments-actions .angelcity2026-btn,
    .acfc-dep-cta-band-actions .angelcity2026-btn {
      width: 100%;
      white-space: normal;
      text-align: center;
    }
  }