/* ============================================================
   tighten.css
   Sitewide vertical-spacing pass. Loaded LAST so it wins.
   Goal: cut dead space without breaking section rhythm.
   ============================================================ */

/* ─── Heroes ────────────────────────────────────────────────── */
/* The legacy .hero (sub-page heroes like About / Contact / Gallery
   used 6rem top / 10rem bottom). Cut both. */
.hero {
  padding-top: 3.5rem !important;
  padding-bottom: 4rem !important;
}
.hero.home-hero { padding: 5rem 3rem !important; }

/* Decorative coral hairline 3rem off the bottom — pull it tighter */
.hero::after { bottom: 1.25rem !important; }

/* ProSeries / A·Muse / Adult Company / Merch / Gallery heroes
   all use the .ac-hero / .ps-hero / .gallery-hero / .merch-poll-hero
   pattern. They tend to be padded by clamp(80px, ...) — halve them. */
#page-adult-company > .ac-hero,
#amuse .ac-hero,
#page-about .ac-hero,
#page-gallery .ac-hero {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
  min-height: 0 !important;
}
.gallery-hero { padding: 56px 40px !important; }
.contact-hero,
.shop-hero { padding: 48px 40px !important; }

/* ─── Chapter eyebrow bands ─────────────────────────────────── */
/* The "No.04 · PERFORMANCES — UP NEXT ON STAGE" band was 64+64 padding
   around a single line of small text. Cut hard. */
.content-section {
  padding-top: 36px !important;
  padding-bottom: 36px !important;
}
/* Even tighter when it's just a chapter eyebrow with no other content */
.content-section:has(> .chapter:only-child),
.content-section .chapter:only-child {
  /* :has() may not be supported in some legacy browsers — fall through to the
     plain selector below */
}
/* Fallback / always-on: when .content-section contains only a .chapter,
   the section is decorative — kill the bottom padding so it sits flush. */
#amuse > .content-section,
#page-adult-company > .content-section:first-of-type {
  padding-top: 28px !important;
  padding-bottom: 12px !important;
}

/* ─── Cards / panels with their own margin ──────────────────── */
.collective-card {
  margin-top: 12px !important;
  margin-bottom: 16px !important;
}

/* ─── CTA banner ────────────────────────────────────────────── */
.cta-banner {
  padding-top: 32px !important;
  padding-bottom: 36px !important;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
}

/* ─── Coming-up / 2-up grids on Performances were doubly padded ── */
.coming-up,
.coming-up.three-up {
  margin-top: 4px !important;
  margin-bottom: 12px !important;
}

/* ─── ProSeries content sections (poster aesthetic) ─────────── */
#page-proseries .content-section { padding: 44px 64px !important; }
#page-proseries .ps-whatelse { padding: 36px 64px !important; }
#page-proseries .td-intro { padding: 44px 64px 24px !important; }
#page-proseries .pricing-onetime,
#page-proseries .pricing-notes { padding: 36px 64px !important; }
#page-proseries .coming-soon-banner { padding: 40px 64px !important; }
#page-proseries #proseries-interest { padding: 44px 64px !important; }
#page-proseries .cta-banner { padding: 36px 64px !important; }
#page-proseries .track-detail { padding: 40px 64px !important; }

/* ─── Teachers page bands ───────────────────────────────────── */
.tch-hero { padding: 0 !important; }
.tch-hero-text { padding: 44px 64px 36px !important; }
.tch-director { min-height: 380px !important; }
.tch-director-text { padding: 44px 56px !important; }
.tch-rotation-head { padding: 32px 64px 16px !important; }
.tch-outro { padding: 36px 64px !important; }

/* ─── Merch ──────────────────────────────────────────────────── */
#page-shop .merch-poll-hero { padding: 44px 64px !important; }
#page-shop .merch-category-card { padding: 28px 28px !important; }
#page-shop .merch-extras { padding: 32px 64px !important; }
#page-shop .merch-vote-success { padding: 40px 64px !important; }

/* ─── Performances (now A·Muse inside Collective) ──────────── */
#amuse > .cta-banner { padding: 32px 40px !important; margin: 8px 0 16px !important; }

/* ─── Home: tighten extras around the upnext card ───────────── */
.upnext-card { margin: 28px auto !important; }

/* ─── Track Record on home ──────────────────────────────────── */
.track-record { padding: 36px 40px !important; }

/* ─── About / Contact / Privacy / Early-access — generic ────── */
.about-content,
.contact-content,
.privacy-content,
.early-access-content { padding: 40px 40px !important; }

/* ─── Gallery grid ──────────────────────────────────────────── */
.gallery-grid { margin-top: 16px !important; gap: 12px !important; }

/* ─── Mobile: even tighter ──────────────────────────────────── */
@media (max-width: 720px) {
  .hero { padding: 2.5rem 1.5rem 3rem !important; }
  #page-adult-company > .ac-hero,
  #amuse .ac-hero,
  #page-about .ac-hero,
  #page-gallery .ac-hero { padding: 40px 24px !important; }
  .content-section { padding: 28px 24px !important; }
  .cta-banner { padding: 24px 24px 28px !important; }
  #page-proseries .content-section,
  #page-proseries .ps-whatelse,
  #page-proseries .td-intro,
  #page-proseries .pricing-onetime,
  #page-proseries .pricing-notes,
  #page-proseries .coming-soon-banner,
  #page-proseries #proseries-interest,
  #page-proseries .cta-banner,
  #page-proseries .track-detail { padding: 32px 24px !important; }
  .tch-hero-text,
  .tch-director-text,
  .tch-rotation-head,
  .tch-outro { padding: 28px 24px !important; }
  #page-shop .merch-poll-hero,
  #page-shop .merch-extras,
  #page-shop .merch-vote-success,
  #page-shop .merch-category-card { padding: 24px 24px !important; }
}

/* ───── Credentials strip (#page-home, below Track Record) ───── */

.creds-strip {
  max-width: 1100px;
  margin: 0 auto;
  padding: 28px 32px 56px;
  display: grid;
  gap: 14px;
}

.creds-strip-row {
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: baseline;
  gap: 18px;
}

.creds-eyebrow {
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--terracotta, #C8614B);
  white-space: nowrap;
}

.creds-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(250, 243, 232, 0.82);
}

.creds-list li {
  position: relative;
  padding-right: 16px;
}

.creds-list li:not(:last-child)::after {
  content: '·';
  position: absolute;
  right: 0;
  color: rgba(250, 243, 232, 0.35);
}

@media (max-width: 700px) {
  .creds-strip { padding: 24px 24px 40px; }
  .creds-strip-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .creds-list { font-size: 0.72rem; }
}

/* ═════════════════════════════════════════════════
   Site-wide interactivity layer
   Layers a consistent bouncy hover language on top
   of existing hovers, never overriding hard. The
   curve `--ease-spring` matches the hero pills.
   Everything respects prefers-reduced-motion below.
   ═════════════════════════════════════════════════ */
:root {
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
}

/* ── REGISTER topnav CTA: pulse like the audition pill ── */
.topnav .nav-cta {
  transition: background 0.25s ease, color 0.25s ease, transform 0.25s var(--ease-spring), box-shadow 0.25s ease !important;
  animation: nav-cta-pulse 3s ease-in-out infinite;
}
.topnav .nav-cta:hover,
.topnav .nav-cta:focus-visible {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 8px 22px rgba(200, 97, 75, 0.30);
  animation-play-state: paused;
}
.topnav .nav-cta:active { transform: translateY(0) scale(0.97); transition-duration: 0.08s; }
@keyframes nav-cta-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(200, 97, 75, 0); }
  50%      { box-shadow: 0 0 0 6px rgba(200, 97, 75, 0.15); }
}

/* ── Triptych cards: punch up the existing lift ── */
.tri-card {
  transition: transform 0.32s var(--ease-spring), box-shadow 0.32s ease, background 0.32s ease !important;
}
.tri-card:hover {
  transform: translateY(-4px) scale(1.012) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}
.tri-card:active { transform: translateY(-1px) scale(0.998) !important; transition-duration: 0.1s !important; }

/* ── Home entries (ProSeries / Collective): lift + soft glow ── */
#page-home .entries .entry {
  transition: transform 0.4s var(--ease-spring), box-shadow 0.4s ease, background 0.35s ease;
}
#page-home .entries .entry:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.40);
}

/* ── Up-next / amuse feature card on home ── */
.upnext-card {
  transition: transform 0.32s var(--ease-spring), box-shadow 0.32s ease;
}
.upnext-card:hover {
  transform: translateY(-3px) scale(1.005);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35);
}

/* ── ProSeries track-detail cards ── */
.track-detail-card,
.td-card {
  transition: transform 0.32s var(--ease-spring), box-shadow 0.32s ease;
}
.track-detail-card:hover,
.td-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.30);
}

/* ── Teacher rotation cards ── */
.tch-card {
  transition: transform 0.32s var(--ease-spring), box-shadow 0.32s ease, filter 0.32s ease !important;
}
.tch-card:hover {
  transform: translateY(-4px) scale(1.015) !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.35);
  filter: brightness(1.06);
}

/* ── Generic .btn: bouncier curve + soft shadow + tiny scale ── */
.btn {
  transition: transform 0.25s var(--ease-spring), background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, letter-spacing 0.25s ease !important;
}
.btn:hover {
  transform: translateY(-2px) scale(1.02);
}
.btn:active {
  transform: translateY(0) scale(0.98);
  transition-duration: 0.08s !important;
}

/* ── Top nav links: animated underline ── */
.topnav nav a {
  transition: color 0.22s ease;
  position: relative;
}
.topnav nav a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -4px;
  height: 1.5px;
  background: var(--rb-terracotta, #c8614b);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.28s var(--ease-spring);
}
.topnav nav a:hover::after,
.topnav nav a.active::after { transform: scaleX(1); }
.topnav nav a:hover { color: var(--rb-terracotta, #c8614b); }

/* ── Footer links: pink slide ── */
.site-footer a,
.footer-links a {
  transition: color 0.22s ease, transform 0.22s var(--ease-spring);
  display: inline-block;
}
.site-footer a:hover,
.footer-links a:hover {
  color: var(--rb-pink, #f8d7c8);
  transform: translateX(2px);
}

/* ── Social icons inside the footer (SVG wrappers) ── */
.footer-links a svg {
  transition: transform 0.28s var(--ease-spring);
}
.footer-links a:hover svg {
  transform: scale(1.18) rotate(-4deg);
}

/* ── Form inputs: focused border + lift ── */
input[type="email"],
input[type="text"],
input[type="tel"],
textarea {
  transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s var(--ease-spring);
}
input[type="email"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
textarea:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(200, 97, 75, 0.18);
}

/* ── Photo grid on home & gallery tiles: subtle zoom ── */
#page-home .photo-grid .ph,
.gallery-grid .gallery-item {
  transition: transform 0.5s var(--ease-spring);
}
#page-home .photo-grid .ph:hover,
.gallery-grid .gallery-item:hover {
  transform: translateY(-2px);
}

/* ── Track-record stat numbers: subtle bobble on hover ── */
.track-record .tr-stat {
  transition: transform 0.32s var(--ease-spring);
}
.track-record .tr-stat:hover {
  transform: translateY(-3px) scale(1.04);
}

/* ── Reduced-motion: kill all bounces, keep color transitions ── */
@media (prefers-reduced-motion: reduce) {
  .topnav .nav-cta,
  .tri-card,
  #page-home .entries .entry,
  .upnext-card,
  .track-detail-card,
  .td-card,
  .tch-card,
  .btn,
  .footer-links a,
  .footer-links a svg,
  #page-home .photo-grid .ph,
  .gallery-grid .gallery-item,
  .track-record .tr-stat {
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
    animation: none !important;
  }
  .topnav .nav-cta:hover,
  .tri-card:hover,
  #page-home .entries .entry:hover,
  .upnext-card:hover,
  .track-detail-card:hover,
  .td-card:hover,
  .tch-card:hover,
  .btn:hover,
  .footer-links a:hover,
  #page-home .photo-grid .ph:hover,
  .gallery-grid .gallery-item:hover,
  .track-record .tr-stat:hover {
    transform: none !important;
  }
  .footer-links a:hover svg { transform: none !important; }
}

/* ───── Anchor scroll offset for fixed topnav ─────
   scroll-margin-top so in-page anchor jumps clear the fixed topnav. */
#audition,
#audition-cta,
#amuse,
#proseries-tracks-full,
#proseries-interest {
  scroll-margin-top: 90px;
}
@media (max-width: 900px) {
  #audition,
  #audition-cta,
  #amuse,
  #proseries-tracks-full,
  #proseries-interest {
    scroll-margin-top: 76px;
  }
}