/* ============================================================
   Super Hi-Fi · Slide entrance animations + ambient motion
   All entrance animations are gated on [data-anim-enter] so they
   don't burn through while the slide is hidden behind another.
   ============================================================ */

/* ──────────────────────────────────────────────────────────
   SHARED EASING
   ────────────────────────────────────────────────────────── */
:root {
  --anim-ease: cubic-bezier(.2,.8,.2,1);
  --anim-ease-soft: cubic-bezier(.4,0,.2,1);
}

/* ──────────────────────────────────────────────────────────
   SLIDE 01 — COVER
   ────────────────────────────────────────────────────────── */

/* Logo / corner / eyebrow / headline / rule / subhead / footer reveal */
.slide-cover[data-anim-enter] .cover-logo {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-cover[data-anim-enter] .cover-corner {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) 200ms forwards;
}
.slide-cover[data-anim-enter] .cover-eyebrow {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) 600ms forwards;
}
.slide-cover[data-anim-enter] .cover-headline {
  opacity: 0; animation: fade-up-strong 1100ms var(--anim-ease) 850ms forwards;
}
.slide-cover[data-anim-enter] .cover-rule {
  transform: scaleX(0); transform-origin: left center;
  animation: rule-grow 1100ms var(--anim-ease-soft) 1500ms forwards;
}
.slide-cover[data-anim-enter] .cover-subhead {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) 1700ms forwards;
}
.slide-cover[data-anim-enter] .cover-footer {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) 1900ms forwards;
}

/* Cover dial — arc draws on, then slowly rotates forever */
.slide-cover .cover-dial .dial-arc {
  transform-box: fill-box;
  transform-origin: center;
}
.slide-cover .cover-dial .dial-arc circle {
  stroke-dasharray: 2638 1000;
}
.slide-cover[data-anim-enter] .cover-dial .dial-arc {
  animation: arc-spin 75s linear 2200ms infinite;
}
.slide-cover[data-anim-enter] .cover-dial .dial-arc circle {
  stroke-dashoffset: 2638;
  animation: arc-draw 1500ms var(--anim-ease-soft) 350ms forwards;
}
@keyframes arc-spin {
  from { transform: rotate(135deg); }
  to   { transform: rotate(495deg); }
}
@keyframes arc-draw {
  to { stroke-dashoffset: 0; }
}

/* Ticks — radial wave reveal then rest */
.slide-cover .cover-dial .ticks line {
  stroke-dasharray: 80;
}
.slide-cover[data-anim-enter] .cover-dial .ticks line {
  stroke-dashoffset: 80;
  animation: tick-draw 600ms var(--anim-ease) forwards;
  animation-delay: calc(700ms + var(--i, 0) * 14ms);
}
@keyframes tick-draw {
  to { stroke-dashoffset: 0; }
}

/* Needle — sweeps in to the top, then drifts slowly clockwise around
   the dial forever (top → right → bottom → left → top, ~30s loop). */
.slide-cover .cover-dial .dial-needle {
  transform-origin: 0 0; /* parent g translates to (600,600); rotate around that */
}
.slide-cover[data-anim-enter] .cover-dial .dial-needle {
  animation:
    needle-sweep 1400ms var(--anim-ease-soft) 1100ms backwards,
    needle-drift 30s linear 2500ms infinite;
}
@keyframes needle-sweep {
  from { transform: rotate(-135deg); }
  to   { transform: rotate(-30deg); }
}
@keyframes needle-drift {
  from { transform: rotate(-30deg); }
  to   { transform: rotate(330deg); } /* +360° → same visual position, no snap */
}

/* Cover dot — gentle continuous pulse */
.slide-cover[data-anim-enter] .cover-eyebrow .dot {
  animation: dot-glow-pulse 2200ms ease-in-out infinite;
}
@keyframes dot-glow-pulse {
  0%, 100% { box-shadow: 0 0 18px rgba(252,138,20,0.85); }
  50%      { box-shadow: 0 0 28px rgba(252,138,20,1); }
}

/* VU peaks — pop in stagger, then ride continuously */
.slide-cover[data-anim-enter] .cover-vu .seg {
  transform: scaleY(0); transform-origin: bottom;
  animation: seg-rise 380ms var(--anim-ease) forwards;
  animation-delay: calc(1900ms + var(--i, 0) * 50ms);
}
@keyframes seg-rise {
  to { transform: scaleY(1); }
}
/* Peak rider — every segment flashes orange briefly, staggered by index,
   so peaks ripple up the meter. */
.slide-cover[data-anim-enter] .cover-vu .seg {
  animation:
    seg-rise 380ms var(--anim-ease) forwards,
    vu-rider 2400ms ease-in-out infinite;
  animation-delay:
    calc(1900ms + var(--i, 0) * 50ms),
    calc(2800ms + var(--i, 0) * 145ms);
}
@keyframes vu-rider {
  0%, 62%, 100% { background: rgba(245,239,228,0.18); box-shadow: none; }
  72%, 80%      { background: var(--orange); box-shadow: 0 0 10px rgba(252,138,20,0.7); }
}

/* ──────────────────────────────────────────────────────────
   SLIDE 02 — THE MOMENT
   ────────────────────────────────────────────────────────── */

.slide-moment[data-anim-enter] .s2-eyebrow,
.slide-moment[data-anim-enter] .s2-headline,
.slide-moment[data-anim-enter] .s2-body-wrap {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-moment[data-anim-enter] .s2-headline      { animation-delay: 200ms; }
.slide-moment[data-anim-enter] .s2-body-wrap    { animation-delay: 500ms; }

/* The orange rule above the callouts grows in */
.slide-moment[data-anim-enter] .s2-callouts {
  border-top-color: transparent;
}
.slide-moment[data-anim-enter] .s2-callouts::before {
  content: ""; position: absolute;
  left: 0; right: 0; top: -1px;
  height: 1px; background: var(--orange);
  transform: scaleX(0); transform-origin: left center;
  animation: rule-grow 1100ms var(--anim-ease-soft) 700ms forwards;
}

/* Callouts stagger */
.slide-moment[data-anim-enter] .s2-callout {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-moment[data-anim-enter] .s2-callout:nth-child(1) { animation-delay: 1100ms; }
.slide-moment[data-anim-enter] .s2-callout:nth-child(2) { animation-delay: 1300ms; }
.slide-moment[data-anim-enter] .s2-callout:nth-child(3) { animation-delay: 1500ms; }

/* Vertical separators between callouts grow in */
.slide-moment[data-anim-enter] .s2-callout {
  border-right-color: transparent;
  position: relative;
}
.slide-moment[data-anim-enter] .s2-callout:not(:last-child)::after {
  content: ""; position: absolute;
  right: -1px; top: 6%; bottom: 6%;
  width: 1px;
  background: rgba(252,138,20,0.35);
  transform: scaleY(0); transform-origin: top center;
  animation: rule-grow-y 800ms var(--anim-ease-soft) 1700ms forwards;
}

/* Brief red flash on the "0" callout when it crashes */
.slide-moment .s2-callout.zero .num {
  transition: color 200ms ease;
}
.slide-moment .s2-callout.zero.is-crashing .num {
  color: #ff5a3a !important;
}

/* ──────────────────────────────────────────────────────────
   SLIDE 03 — THE VISION
   ────────────────────────────────────────────────────────── */

.slide-vision[data-anim-enter] .s3-eyebrow,
.slide-vision[data-anim-enter] .s3-headline,
.slide-vision[data-anim-enter] .s3-body {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-vision[data-anim-enter] .s3-eyebrow  { animation-delay: 0ms; }
.slide-vision[data-anim-enter] .s3-headline { animation-delay: 200ms; }
.slide-vision[data-anim-enter] .s3-body     { animation-delay: 500ms; }

/* Hero image — slow Ken Burns, plus reveal-in scale */
.slide-vision .s3-stage-img {
  transform: scale(1.08);
  transform-origin: 50% 55%;
}
.slide-vision[data-anim-enter] .s3-stage {
  opacity: 0; animation: fade-up 1100ms var(--anim-ease) 100ms forwards;
}
.slide-vision[data-anim-enter] .s3-stage-img {
  animation: kenburns 24s ease-in-out 600ms infinite alternate;
}
@keyframes kenburns {
  from { transform: scale(1.04) translate(0, 0); }
  to   { transform: scale(1.12) translate(-1%, -2%); }
}

/* Phantom speakers — ripples emanating from plausible cabin speaker
   positions (front L/R, rear L/R, ceiling, sub). The image stops
   decorating spatial audio and starts demonstrating it. */
.s3-ripple {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
}
.s3-ripple .src {
  position: absolute;
  width: 70px; height: 70px;
  margin: -35px 0 0 -35px;
  border: 1.5px solid var(--orange);
  border-radius: 50%;
  opacity: 0;
}
.s3-ripple .fl   { left: 26%; top: 34%; }
.s3-ripple .fr   { left: 74%; top: 34%; }
.s3-ripple .rl   { left: 22%; top: 64%; }
.s3-ripple .rr   { left: 78%; top: 64%; }
.s3-ripple .ceil { left: 50%; top: 14%; }
.s3-ripple .sub  { left: 50%; top: 88%; }

.slide-vision[data-anim-enter] .s3-ripple .src {
  animation: s3-speaker 4.8s ease-out infinite;
}
.slide-vision[data-anim-enter] .s3-ripple .fl   { animation-duration: 4.8s; animation-delay: 1200ms; }
.slide-vision[data-anim-enter] .s3-ripple .fr   { animation-duration: 4.8s; animation-delay: 2400ms; }
.slide-vision[data-anim-enter] .s3-ripple .rl   { animation-duration: 5.4s; animation-delay: 3000ms; }
.slide-vision[data-anim-enter] .s3-ripple .rr   { animation-duration: 5.4s; animation-delay: 4200ms; }
.slide-vision[data-anim-enter] .s3-ripple .ceil { animation-duration: 6.2s; animation-delay: 1800ms; }
.slide-vision[data-anim-enter] .s3-ripple .sub  { animation-duration: 6.8s; animation-delay: 3600ms; }

@keyframes s3-speaker {
  0%   { transform: scale(0.25); opacity: 0;    border-width: 2px; }
  6%   {                          opacity: 0.6; }
  100% { transform: scale(3.5);   opacity: 0;    border-width: 0.5px; }
}

/* Pillars — fade up, then engrave the orange frame edge-by-edge
   clockwise (top → right → bottom → left), then text fades in. */
.slide-vision .s3-pillar {
  position: relative;
}
.slide-vision .s3-pillar .edge {
  position: absolute;
  background: var(--orange);
  display: block;
  pointer-events: none;
  z-index: 2;
}
.slide-vision .s3-pillar .edge-t { top: -1px;    left: -1px;  right: -1px;  height: 1px; transform-origin: left center; transform: scaleX(0); }
.slide-vision .s3-pillar .edge-r { top: -1px;    right: -1px; bottom: -1px; width: 1px;  transform-origin: top center;  transform: scaleY(0); }
.slide-vision .s3-pillar .edge-b { bottom: -1px; left: -1px;  right: -1px;  height: 1px; transform-origin: right center; transform: scaleX(0); }
.slide-vision .s3-pillar .edge-l { top: -1px;    left: -1px;  bottom: -1px; width: 1px;  transform-origin: bottom center; transform: scaleY(0); }

.slide-vision[data-anim-enter] .s3-pillar {
  opacity: 0;
  border-color: transparent;
  animation: fade-up 700ms var(--anim-ease) forwards;
}
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) { animation-delay: 600ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) { animation-delay: 800ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) { animation-delay: 1000ms; }

.slide-vision[data-anim-enter] .s3-pillar .edge-t { animation: edge-x 350ms ease-out forwards; }
.slide-vision[data-anim-enter] .s3-pillar .edge-r { animation: edge-y 350ms ease-out forwards; }
.slide-vision[data-anim-enter] .s3-pillar .edge-b { animation: edge-x 350ms ease-out forwards; }
.slide-vision[data-anim-enter] .s3-pillar .edge-l { animation: edge-y 350ms ease-out forwards; }
@keyframes edge-x { to { transform: scaleX(1); } }
@keyframes edge-y { to { transform: scaleY(1); } }

/* Per-pillar engrave timing — clockwise sweep, staggered between pillars */
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .edge-t { animation-delay: 800ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .edge-r { animation-delay: 1100ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .edge-b { animation-delay: 1400ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .edge-l { animation-delay: 1700ms; }

.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .edge-t { animation-delay: 1000ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .edge-r { animation-delay: 1300ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .edge-b { animation-delay: 1600ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .edge-l { animation-delay: 1900ms; }

.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .edge-t { animation-delay: 1200ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .edge-r { animation-delay: 1500ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .edge-b { animation-delay: 1800ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .edge-l { animation-delay: 2100ms; }

/* Pillar text fades up after that pillar's engrave finishes */
.slide-vision[data-anim-enter] .s3-pillar .label,
.slide-vision[data-anim-enter] .s3-pillar .desc {
  opacity: 0;
  animation: fade-up 600ms var(--anim-ease) forwards;
}
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .label { animation-delay: 2200ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(1) .desc  { animation-delay: 2350ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .label { animation-delay: 2400ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(2) .desc  { animation-delay: 2550ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .label { animation-delay: 2600ms; }
.slide-vision[data-anim-enter] .s3-pillar:nth-child(3) .desc  { animation-delay: 2750ms; }

/* ──────────────────────────────────────────────────────────
   SLIDE 04 — THE PRODUCT
   ────────────────────────────────────────────────────────── */

.slide-product[data-anim-enter] .s4-eyebrow,
.slide-product[data-anim-enter] .s4-headline,
.slide-product[data-anim-enter] .s4-sub {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-product[data-anim-enter] .s4-headline { animation-delay: 150ms; }
.slide-product[data-anim-enter] .s4-sub      { animation-delay: 400ms; }

.slide-product[data-anim-enter] .s4-col {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-product[data-anim-enter] .s4-col:nth-child(1) { animation-delay: 700ms; }
.slide-product[data-anim-enter] .s4-col:nth-child(2) { animation-delay: 850ms; }
.slide-product[data-anim-enter] .s4-col:nth-child(3) { animation-delay: 1000ms; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) { animation-delay: 1150ms; }

/* Icon 1 (bars) — each bar grows from left, then breathes subtly */
.slide-product .s4-col:nth-child(1) .s4-icon svg rect {
  transform-box: fill-box;
  transform-origin: left center;
  transform: scaleX(0);
}
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect {
  animation:
    bar-grow 700ms var(--anim-ease) forwards,
    bar-breathe 3.4s ease-in-out infinite;
}
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect:nth-child(1) { animation-delay: 950ms,  2100ms; animation-duration: 700ms, 3.0s; }
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect:nth-child(2) { animation-delay: 1080ms, 2300ms; animation-duration: 700ms, 3.6s; }
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect:nth-child(3) { animation-delay: 1210ms, 2500ms; animation-duration: 700ms, 3.2s; }
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect:nth-child(4) { animation-delay: 1340ms, 2700ms; animation-duration: 700ms, 3.8s; }
.slide-product[data-anim-enter] .s4-col:nth-child(1) .s4-icon svg rect:nth-child(5) { animation-delay: 1470ms, 2900ms; animation-duration: 700ms, 3.0s; }
@keyframes bar-grow { to { transform: scaleX(1); } }
@keyframes bar-breathe {
  0%, 100% { transform: scaleX(1); }
  50%      { transform: scaleX(0.78); }
}

/* Icon 2 (dial) — needle sweeps then wobbles */
.slide-product .s4-col:nth-child(2) .s4-needle {
  transform-box: fill-box;
  transform-origin: 60px 55px;
  transform: rotate(0deg);
}
.slide-product[data-anim-enter] .s4-col:nth-child(2) .s4-needle {
  animation:
    s4-needle-sweep 1200ms var(--anim-ease-soft) 1100ms backwards,
    s4-needle-wobble 4.6s ease-in-out 2500ms infinite;
}
@keyframes s4-needle-sweep {
  from { transform: rotate(-220deg); }
  to   { transform: rotate(0deg); }
}
@keyframes s4-needle-wobble {
  0%, 100% { transform: rotate(0deg); }
  50%      { transform: rotate(6deg); }
}

/* Icon 3 (sigil) — sine wave path draws on, then undulates; outer rings pulse */
.slide-product .s4-col:nth-child(3) .s4-icon svg path {
  stroke-dasharray: 80;
  stroke-dashoffset: 80;
}
.slide-product[data-anim-enter] .s4-col:nth-child(3) .s4-icon svg path {
  animation:
    s4-sigil-draw 1100ms var(--anim-ease-soft) 1300ms forwards,
    s4-sigil-undulate 3.6s ease-in-out 2500ms infinite;
}
@keyframes s4-sigil-draw {
  to { stroke-dashoffset: 0; }
}
@keyframes s4-sigil-undulate {
  0%   { d: path('M40 50 Q 50 38 60 50 Q 70 62 80 50'); }
  50%  { d: path('M40 50 Q 50 62 60 50 Q 70 38 80 50'); }
  100% { d: path('M40 50 Q 50 38 60 50 Q 70 62 80 50'); }
}
/* Two same-sized circles drift apart side-to-side, forming a slight
   Venn diagram, then merge perfectly in the center. */
.slide-product .s4-col:nth-child(3) .s4-icon svg circle:nth-child(1),
.slide-product .s4-col:nth-child(3) .s4-icon svg circle:nth-child(2) {
  transform-box: fill-box;
  transform-origin: center;
}
.slide-product[data-anim-enter] .s4-col:nth-child(3) .s4-icon svg circle:nth-child(1) {
  animation: s4-venn-l 5.5s ease-in-out 2400ms infinite;
}
.slide-product[data-anim-enter] .s4-col:nth-child(3) .s4-icon svg circle:nth-child(2) {
  animation: s4-venn-r 5.5s ease-in-out 2400ms infinite;
}
@keyframes s4-venn-l {
  0%, 100% { transform: translateX(0); }
  50%      { transform: translateX(-11px); }
}
@keyframes s4-venn-r {
  0%, 100% { transform: translateX(0); }
  50%      { transform: translateX(11px); }
}

/* Icon 4 (EQ screen) — bars dance continuously */
.slide-product .s4-col:nth-child(4) .s4-icon svg g rect {
  transform-box: fill-box;
  transform-origin: 50% 100%;
}
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect {
  animation: s4-eq-dance 1.5s ease-in-out 1400ms infinite;
}
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(1) { animation-delay: 1400ms; animation-duration: 1.4s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(2) { animation-delay: 1480ms; animation-duration: 1.7s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(3) { animation-delay: 1560ms; animation-duration: 1.5s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(4) { animation-delay: 1640ms; animation-duration: 1.9s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(5) { animation-delay: 1720ms; animation-duration: 1.3s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(6) { animation-delay: 1800ms; animation-duration: 1.6s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(7) { animation-delay: 1880ms; animation-duration: 1.8s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(8) { animation-delay: 1960ms; animation-duration: 1.4s; }
.slide-product[data-anim-enter] .s4-col:nth-child(4) .s4-icon svg g rect:nth-child(9) { animation-delay: 2040ms; animation-duration: 1.7s; }
@keyframes s4-eq-dance {
  0%   { transform: scaleY(0.4); }
  20%  { transform: scaleY(1.0); }
  40%  { transform: scaleY(0.55); }
  60%  { transform: scaleY(1.2); }
  80%  { transform: scaleY(0.7); }
  100% { transform: scaleY(0.4); }
}

/* Bottom strip rule and ticks */
.slide-product[data-anim-enter] .s4-strip {
  transform: scaleX(0); transform-origin: left center;
  animation: rule-grow 1100ms var(--anim-ease-soft) 1700ms forwards;
}
.slide-product[data-anim-enter] .s4-strip-ticks .tick {
  opacity: 0;
  animation: fade-in 400ms ease forwards;
}
.slide-product[data-anim-enter] .s4-strip-ticks .tick:nth-child(1) { animation-delay: 2400ms; }
.slide-product[data-anim-enter] .s4-strip-ticks .tick:nth-child(2) { animation-delay: 2520ms; }
.slide-product[data-anim-enter] .s4-strip-ticks .tick:nth-child(3) { animation-delay: 2640ms; }
.slide-product[data-anim-enter] .s4-strip-ticks .tick:nth-child(4) { animation-delay: 2760ms; }

/* ──────────────────────────────────────────────────────────
   SLIDE 05 — SAMPLE STATIONS
   ────────────────────────────────────────────────────────── */

.slide-stations[data-anim-enter] .s5-eyebrow,
.slide-stations[data-anim-enter] .s5-headline,
.slide-stations[data-anim-enter] .s5-sub {
  opacity: 0; animation: fade-up 850ms var(--anim-ease) forwards;
}
.slide-stations[data-anim-enter] .s5-headline { animation-delay: 150ms; }
.slide-stations[data-anim-enter] .s5-sub      { animation-delay: 380ms; }

/* Five cards stagger in with subtle scale-up */
.slide-stations[data-anim-enter] .s5-card {
  opacity: 0;
  transform: translateY(40px) scale(0.96);
  animation: card-rise 900ms var(--anim-ease) forwards;
}
.slide-stations[data-anim-enter] .s5-card:nth-child(1) { animation-delay: 600ms; }
.slide-stations[data-anim-enter] .s5-card:nth-child(2) { animation-delay: 740ms; }
.slide-stations[data-anim-enter] .s5-card:nth-child(3) { animation-delay: 880ms; }
.slide-stations[data-anim-enter] .s5-card:nth-child(4) { animation-delay: 1020ms; }
.slide-stations[data-anim-enter] .s5-card:nth-child(5) { animation-delay: 1160ms; }
@keyframes card-rise {
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Album art subtle float on hover */
.slide-stations .s5-card { transition: transform 320ms var(--anim-ease), box-shadow 320ms var(--anim-ease); }
.slide-stations .s5-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(14,14,14,0.18);
}

/* ──────────────────────────────────────────────────────────
   SLIDE 06 — DISTRIBUTION
   ────────────────────────────────────────────────────────── */

.slide-distribution[data-anim-enter] .s6-eyebrow,
.slide-distribution[data-anim-enter] .s6-headline,
.slide-distribution[data-anim-enter] .s6-sub {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-distribution[data-anim-enter] .s6-headline { animation-delay: 150ms; }
.slide-distribution[data-anim-enter] .s6-sub      { animation-delay: 350ms; }

/* Bands slide in from right, stagger */
.slide-distribution[data-anim-enter] .s6-band {
  opacity: 0;
  transform: translateX(60px);
  animation: band-in 850ms var(--anim-ease) forwards;
}
.slide-distribution[data-anim-enter] .s6-band.b1 { animation-delay: 550ms; }
.slide-distribution[data-anim-enter] .s6-band.b2 { animation-delay: 800ms; }
.slide-distribution[data-anim-enter] .s6-band.b3 { animation-delay: 1050ms; }
@keyframes band-in {
  to { opacity: 1; transform: translateX(0); }
}

/* Junction sigil pulses */
.slide-distribution[data-anim-enter] .s6-band::before {
  animation: junction-pulse 2.4s ease-in-out infinite;
  animation-delay: 1500ms;
}
@keyframes junction-pulse {
  0%, 100% { box-shadow: 0 0 12px rgba(252,138,20,0.7), 0 0 0 4px #0E0E0E; }
  50%      { box-shadow: 0 0 22px rgba(252,138,20,1),   0 0 0 4px #0E0E0E; }
}

/* Band 1 — dashboard tiles cascade, featured tile scans up */
.slide-distribution[data-anim-enter] .s6-tile {
  opacity: 0; transform: translateX(-12px);
  animation: tile-in 500ms var(--anim-ease) forwards;
}
.slide-distribution[data-anim-enter] .s6-tile:nth-child(1) { animation-delay: 950ms; }
.slide-distribution[data-anim-enter] .s6-tile:nth-child(2) { animation-delay: 1010ms; }
.slide-distribution[data-anim-enter] .s6-tile:nth-child(3) { animation-delay: 1070ms; }
.slide-distribution[data-anim-enter] .s6-tile:nth-child(4) { animation-delay: 1130ms; }
.slide-distribution[data-anim-enter] .s6-tile:nth-child(5) { animation-delay: 1190ms; }
.slide-distribution[data-anim-enter] .s6-tile:nth-child(6) { animation-delay: 1250ms; }
@keyframes tile-in {
  to { opacity: 1; transform: translateX(0); }
}
.slide-distribution[data-anim-enter] .s6-tile.featured {
  animation:
    tile-in 500ms var(--anim-ease) 950ms forwards,
    featured-glow 2.6s ease-in-out 1700ms infinite;
}
@keyframes featured-glow {
  0%, 100% { box-shadow: 0 0 14px rgba(252,138,20,0.30); }
  50%      { box-shadow: 0 0 24px rgba(252,138,20,0.65); }
}

/* Band 2 — OEM marks stagger */
.slide-distribution[data-anim-enter] .s6-oem {
  opacity: 0; transform: translateY(8px);
  animation: oem-in 550ms var(--anim-ease) forwards;
}
.slide-distribution[data-anim-enter] .s6-oem:nth-child(1) { animation-delay: 1250ms; }
.slide-distribution[data-anim-enter] .s6-oem:nth-child(2) { animation-delay: 1340ms; }
.slide-distribution[data-anim-enter] .s6-oem:nth-child(3) { animation-delay: 1430ms; }
.slide-distribution[data-anim-enter] .s6-oem:nth-child(4) { animation-delay: 1520ms; }
@keyframes oem-in {
  to { opacity: 1; transform: translateY(0); }
}

/* Band 3 — vinyl spins forever, EQ bars dance, art slides in */
.slide-distribution .s6-tv .art-cover svg circle:nth-of-type(1),
.slide-distribution .s6-tv .art-cover svg g {
  transform-box: fill-box;
  transform-origin: 50% 50%;
}
.slide-distribution[data-anim-enter] .s6-tv .art-cover svg {
  animation: vinyl-spin 6s linear 1500ms infinite;
}
@keyframes vinyl-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.slide-distribution .s6-tv .eq-strip .b {
  transform-origin: 50% 100%;
}
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b {
  animation: tv-eq-dance 1.4s ease-in-out infinite;
}
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(1)  { animation-delay: -0.05s; animation-duration: 1.3s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(2)  { animation-delay: -0.30s; animation-duration: 1.6s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(3)  { animation-delay: -0.70s; animation-duration: 1.4s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(4)  { animation-delay: -0.20s; animation-duration: 1.7s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(5)  { animation-delay: -0.55s; animation-duration: 1.3s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(6)  { animation-delay: -0.95s; animation-duration: 1.5s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(7)  { animation-delay: -0.40s; animation-duration: 1.6s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(8)  { animation-delay: -0.65s; animation-duration: 1.4s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(9)  { animation-delay: -0.10s; animation-duration: 1.7s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(10) { animation-delay: -0.85s; animation-duration: 1.5s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(11) { animation-delay: -0.50s; animation-duration: 1.4s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(12) { animation-delay: -0.25s; animation-duration: 1.6s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(13) { animation-delay: -0.75s; animation-duration: 1.3s; }
.slide-distribution[data-anim-enter] .s6-tv .eq-strip .b:nth-child(14) { animation-delay: -0.45s; animation-duration: 1.5s; }
@keyframes tv-eq-dance {
  0%   { transform: scaleY(0.35); }
  25%  { transform: scaleY(1.0); }
  50%  { transform: scaleY(0.55); }
  75%  { transform: scaleY(0.95); }
  100% { transform: scaleY(0.35); }
}

/* "Now Playing" + dot in art bug both pulse */
.slide-distribution[data-anim-enter] .s6-tv .art-bug-dot {
  animation: bug-blink 1.4s ease-in-out 1700ms infinite;
}
@keyframes bug-blink {
  0%, 100% { opacity: 1;   box-shadow: 0 0 6px var(--orange); }
  50%      { opacity: 0.35; box-shadow: 0 0 2px var(--orange); }
}

/* Bullet lists — left rule grows, items stagger */
.slide-distribution[data-anim-enter] .s6-bullets li {
  opacity: 0; transform: translateY(6px);
  animation: bullet-in 500ms var(--anim-ease) forwards;
}
.slide-distribution[data-anim-enter] .s6-band.b1 .s6-bullets li:nth-child(1) { animation-delay: 1100ms; }
.slide-distribution[data-anim-enter] .s6-band.b1 .s6-bullets li:nth-child(2) { animation-delay: 1180ms; }
.slide-distribution[data-anim-enter] .s6-band.b1 .s6-bullets li:nth-child(3) { animation-delay: 1260ms; }
.slide-distribution[data-anim-enter] .s6-band.b1 .s6-bullets li:nth-child(4) { animation-delay: 1340ms; }
.slide-distribution[data-anim-enter] .s6-band.b2 .s6-bullets li:nth-child(1) { animation-delay: 1350ms; }
.slide-distribution[data-anim-enter] .s6-band.b2 .s6-bullets li:nth-child(2) { animation-delay: 1430ms; }
.slide-distribution[data-anim-enter] .s6-band.b2 .s6-bullets li:nth-child(3) { animation-delay: 1510ms; }
.slide-distribution[data-anim-enter] .s6-band.b2 .s6-bullets li:nth-child(4) { animation-delay: 1590ms; }
.slide-distribution[data-anim-enter] .s6-band.b3 .s6-bullets li:nth-child(1) { animation-delay: 1600ms; }
.slide-distribution[data-anim-enter] .s6-band.b3 .s6-bullets li:nth-child(2) { animation-delay: 1680ms; }
.slide-distribution[data-anim-enter] .s6-band.b3 .s6-bullets li:nth-child(3) { animation-delay: 1760ms; }
.slide-distribution[data-anim-enter] .s6-band.b3 .s6-bullets li:nth-child(4) { animation-delay: 1840ms; }
@keyframes bullet-in {
  to { opacity: 1; transform: translateY(0); }
}

/* ──────────────────────────────────────────────────────────
   SLIDE 07 — UMG PARTNERSHIP
   ────────────────────────────────────────────────────────── */

/* Glow breathes continuously */
.slide-umg .s7-glow {
  opacity: 0.7;
  transform: translate(-50%, -50%) scale(1);
  transform-origin: center;
}
.slide-umg[data-anim-enter] .s7-glow {
  animation: s7-glow-breathe 6s ease-in-out infinite;
}
@keyframes s7-glow-breathe {
  0%, 100% { opacity: 0.55; transform: translate(-50%, -50%) scale(1.0); }
  50%      { opacity: 1.0;  transform: translate(-50%, -50%) scale(1.06); }
}

.slide-umg[data-anim-enter] .s7-eyebrow,
.slide-umg[data-anim-enter] .s7-headline,
.slide-umg[data-anim-enter] .s7-sub {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-umg[data-anim-enter] .s7-headline { animation-delay: 200ms; }
.slide-umg[data-anim-enter] .s7-sub      { animation-delay: 450ms; }

/* Tiles stagger with shimmer sweep */
.slide-umg .s7-tile {
  position: relative;
  overflow: hidden;
}
.slide-umg .s7-tile::after {
  content: ""; position: absolute;
  inset: 0;
  background: linear-gradient(115deg,
    transparent 0%,
    transparent 35%,
    rgba(252,138,20,0.16) 50%,
    transparent 65%,
    transparent 100%);
  transform: translateX(-100%);
  pointer-events: none;
}
.slide-umg[data-anim-enter] .s7-tile {
  opacity: 0; transform: translateY(16px);
  animation: fade-up 800ms var(--anim-ease) forwards;
}
.slide-umg[data-anim-enter] .s7-tile::after {
  animation: shimmer 1500ms cubic-bezier(.4,0,.2,1) forwards;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(1) { animation-delay: 700ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(1)::after { animation-delay: 1200ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(2) { animation-delay: 850ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(2)::after { animation-delay: 1400ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) { animation-delay: 1000ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(3)::after { animation-delay: 1600ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(4) { animation-delay: 1150ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(4)::after { animation-delay: 1800ms; }
@keyframes shimmer {
  to { transform: translateX(100%); }
}

/* Tile icon shapes draw on, then idle. Across all four tiles, the
   orange structural elements stay static after the entrance — only
   the cream/white accent shapes carry the continuous motion. */
.slide-umg .s7-icon svg :is(line, rect, path) {
  stroke-dasharray: 120;
  stroke-dashoffset: 120;
}
@keyframes s7-icon-draw {
  to { stroke-dashoffset: 0; }
}

/* Every shape gets the draw-on entrance, per-tile delay */
.slide-umg[data-anim-enter] .s7-tile:nth-child(1) .s7-icon svg :is(line, rect, path) {
  animation: s7-icon-draw 800ms var(--anim-ease-soft) 1100ms forwards;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(2) .s7-icon svg :is(line, rect, path) {
  animation: s7-icon-draw 800ms var(--anim-ease-soft) 1250ms forwards;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) .s7-icon svg :is(line, rect, path) {
  animation: s7-icon-draw 800ms var(--anim-ease-soft) 1400ms forwards;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(4) .s7-icon svg :is(line, rect, path) {
  animation: s7-icon-draw 800ms var(--anim-ease-soft) 1550ms forwards;
}

/* Tile 1 — Catalog Exclusivity: the single cream "highlighted entry"
   line gently pulses; orange catalog rows stay static. */
.slide-umg[data-anim-enter] .s7-tile:nth-child(1) .s7-icon svg line[stroke="#F5EFE4"] {
  animation:
    s7-icon-draw 800ms var(--anim-ease-soft) 1100ms forwards,
    s7-line-pulse 3.2s ease-in-out 2400ms infinite;
}

/* Tile 2 — Artist Participation: the two cream grid lines inside the
   capsule alternate brightness like an audio level meter; capsule
   and stand stay static. */
.slide-umg[data-anim-enter] .s7-tile:nth-child(2) .s7-icon svg line[stroke="#F5EFE4"]:nth-of-type(1) {
  animation:
    s7-icon-draw 800ms var(--anim-ease-soft) 1250ms forwards,
    s7-mic-grid 1.6s ease-in-out 2500ms infinite;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(2) .s7-icon svg line[stroke="#F5EFE4"]:nth-of-type(2) {
  animation:
    s7-icon-draw 800ms var(--anim-ease-soft) 1250ms forwards,
    s7-mic-grid 1.6s ease-in-out 3300ms infinite;
}

/* Tile 3 — Beyond DMCA: 3 cream "text" lines inside the document
   shimmer in cascade (top → bottom); orange document outline + slash
   stay static. */
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) .s7-icon svg line[stroke="#F5EFE4"] {
  animation:
    s7-icon-draw 800ms var(--anim-ease-soft) 1400ms forwards,
    s7-line-pulse 3.2s ease-in-out infinite;
}
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) .s7-icon svg line[stroke="#F5EFE4"]:nth-of-type(1) { animation-delay: 1400ms, 2600ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) .s7-icon svg line[stroke="#F5EFE4"]:nth-of-type(2) { animation-delay: 1400ms, 2900ms; }
.slide-umg[data-anim-enter] .s7-tile:nth-child(3) .s7-icon svg line[stroke="#F5EFE4"]:nth-of-type(3) { animation-delay: 1400ms, 3200ms; }

/* Tile 4 — Promotional Alignment: the cream wave path flips vertically;
   calendar outline + tabs stay static. */
.slide-umg[data-anim-enter] .s7-tile:nth-child(4) .s7-icon svg path {
  animation:
    s7-icon-draw 800ms var(--anim-ease-soft) 1550ms forwards,
    s7-cal-wave 3.6s ease-in-out 2800ms infinite;
}

@keyframes s7-line-pulse {
  0%, 100% { opacity: 0.5; }
  50%      { opacity: 1; }
}
@keyframes s7-mic-grid {
  0%, 100% { stroke-opacity: 0.35; }
  50%      { stroke-opacity: 1; }
}
@keyframes s7-cal-wave {
  0%, 100% { d: path('M14 36 Q 20 28 26 36 T 38 36 T 50 36'); }
  50%      { d: path('M14 36 Q 20 44 26 36 T 38 36 T 50 36'); }
}

/* Quote rises with italic settling */
.slide-umg[data-anim-enter] .s7-quote .q {
  opacity: 0; letter-spacing: 0.02em;
  animation: quote-settle 1100ms var(--anim-ease) 1900ms forwards;
}
.slide-umg[data-anim-enter] .s7-quote .attr {
  opacity: 0; animation: fade-up 600ms var(--anim-ease) 2400ms forwards;
}
@keyframes quote-settle {
  from { opacity: 0; letter-spacing: 0.04em; transform: translateY(6px); }
  to   { opacity: 1; letter-spacing: -0.018em; transform: translateY(0); }
}

/* ──────────────────────────────────────────────────────────
   SLIDE 08 — WHY THIS WINS · UMG (with VU meter)
   ────────────────────────────────────────────────────────── */

.slide-umg-wins[data-anim-enter] .sx-eyebrow,
.slide-umg-wins[data-anim-enter] .sx-headline,
.slide-umg-wins[data-anim-enter] .sx-sub {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-umg-wins[data-anim-enter] .sx-headline { animation-delay: 200ms; }
.slide-umg-wins[data-anim-enter] .sx-sub      { animation-delay: 450ms; }

.slide-umg-wins[data-anim-enter] .sx-list li {
  opacity: 0; transform: translateX(20px);
  animation: list-slide-in 750ms var(--anim-ease) forwards;
}
.slide-umg-wins[data-anim-enter] .sx-list li:nth-child(1) { animation-delay: 700ms; }
.slide-umg-wins[data-anim-enter] .sx-list li:nth-child(2) { animation-delay: 850ms; }
.slide-umg-wins[data-anim-enter] .sx-list li:nth-child(3) { animation-delay: 1000ms; }
.slide-umg-wins[data-anim-enter] .sx-list li:nth-child(4) { animation-delay: 1150ms; }
.slide-umg-wins[data-anim-enter] .sx-list li:nth-child(5) { animation-delay: 1300ms; }
@keyframes list-slide-in {
  to { opacity: 1; transform: translateX(0); }
}

/* Spine partner mark + sub fade in */
.slide-umg-wins[data-anim-enter] .partner-mark,
.slide-umg-wins[data-anim-enter] .partner-sub {
  opacity: 0; animation: fade-up 700ms var(--anim-ease) 100ms forwards;
}
.slide-umg-wins[data-anim-enter] .partner-sub { animation-delay: 280ms; }

/* VU meter — prepare a "level mask" pseudo on top, then animate level */
.slide-wins .vu-spine {
  /* the inner mask is added by JS to keep CSS clean — fall back to ::after */
  overflow: hidden;
}
.slide-wins .vu-spine::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 60%; /* the dark "above the level" region — animates */
  background: linear-gradient(180deg,
    #0E0E0E 0%,
    rgba(14,14,14,0.95) 60%,
    rgba(14,14,14,0.4) 100%);
  pointer-events: none;
}
.slide-umg-wins[data-anim-enter] .vu-spine {
  animation: vu-glow 5.5s ease-in-out 700ms infinite;
}
.slide-umg-wins[data-anim-enter] .vu-spine::after {
  animation: vu-pump 10s ease-in-out 700ms infinite;
}
@keyframes vu-pump {
  0%, 100% { height: 55%; }
  18%      { height: 38%; }
  34%      { height: 48%; }
  50%      { height: 32%; }
  66%      { height: 46%; }
  82%      { height: 36%; }
}
@keyframes vu-glow {
  0%, 100% { box-shadow: 0 0 30px rgba(252,138,20,0.55), inset 0 0 0 1px rgba(255,255,255,0.18); }
  50%      { box-shadow: 0 0 44px rgba(252,138,20,0.78), inset 0 0 0 1px rgba(255,255,255,0.22); }
}

/* ──────────────────────────────────────────────────────────
   SLIDE 09 — WHY THIS WINS · XPERI (with EQ bars)
   ────────────────────────────────────────────────────────── */

.slide-xperi-wins[data-anim-enter] .sx-eyebrow,
.slide-xperi-wins[data-anim-enter] .sx-headline,
.slide-xperi-wins[data-anim-enter] .sx-sub {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-xperi-wins[data-anim-enter] .sx-headline { animation-delay: 200ms; }
.slide-xperi-wins[data-anim-enter] .sx-sub      { animation-delay: 450ms; }

.slide-xperi-wins[data-anim-enter] .sx-list li {
  opacity: 0; transform: translateX(-20px);
  animation: list-slide-in-r 750ms var(--anim-ease) forwards;
}
.slide-xperi-wins[data-anim-enter] .sx-list li:nth-child(1) { animation-delay: 700ms; }
.slide-xperi-wins[data-anim-enter] .sx-list li:nth-child(2) { animation-delay: 850ms; }
.slide-xperi-wins[data-anim-enter] .sx-list li:nth-child(3) { animation-delay: 1000ms; }
.slide-xperi-wins[data-anim-enter] .sx-list li:nth-child(4) { animation-delay: 1150ms; }
.slide-xperi-wins[data-anim-enter] .sx-list li:nth-child(5) { animation-delay: 1300ms; }
@keyframes list-slide-in-r {
  to { opacity: 1; transform: translateX(0); }
}

.slide-xperi-wins[data-anim-enter] .partner-mark,
.slide-xperi-wins[data-anim-enter] .partner-sub {
  opacity: 0; animation: fade-up 700ms var(--anim-ease) 100ms forwards;
}
.slide-xperi-wins[data-anim-enter] .partner-sub { animation-delay: 280ms; }

/* EQ spine bars — dance dynamically with phase + duration variance */
.slide-wins .eq-spine .bar {
  transform-origin: 50% 100%;
  transition: none;
}
.slide-xperi-wins[data-anim-enter] .eq-spine .bar {
  animation: s9-eq-dance 2.8s ease-in-out infinite;
}
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(1)  { animation-delay: -0.10s; animation-duration: 2.6s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(2)  { animation-delay: -0.55s; animation-duration: 3.0s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(3)  { animation-delay: -1.20s; animation-duration: 2.8s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(4)  { animation-delay: -0.40s; animation-duration: 3.4s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(5)  { animation-delay: -1.00s; animation-duration: 2.4s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(6)  { animation-delay: -1.70s; animation-duration: 2.9s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(7)  { animation-delay: -0.75s; animation-duration: 3.2s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(8)  { animation-delay: -1.20s; animation-duration: 2.7s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(9)  { animation-delay: -0.20s; animation-duration: 3.0s; }
.slide-xperi-wins[data-anim-enter] .eq-spine .bar:nth-child(10) { animation-delay: -1.55s; animation-duration: 2.5s; }
@keyframes s9-eq-dance {
  0%   { transform: scaleY(0.34); }
  22%  { transform: scaleY(0.92); }
  44%  { transform: scaleY(0.58); }
  62%  { transform: scaleY(1.05); }
  80%  { transform: scaleY(0.62); }
  100% { transform: scaleY(0.34); }
}

/* ──────────────────────────────────────────────────────────
   SLIDE 10 — THE PATH FORWARD
   ────────────────────────────────────────────────────────── */

.slide-path[data-anim-enter] .s10-eyebrow,
.slide-path[data-anim-enter] .s10-corner,
.slide-path[data-anim-enter] .s10-headline,
.slide-path[data-anim-enter] .s10-sub {
  opacity: 0; animation: fade-up 900ms var(--anim-ease) forwards;
}
.slide-path[data-anim-enter] .s10-headline { animation-delay: 200ms; }
.slide-path[data-anim-enter] .s10-sub      { animation-delay: 500ms; }
.slide-path[data-anim-enter] .s10-corner   { animation-delay: 100ms; }

/* Rail draws left to right */
.slide-path[data-anim-enter] .s10-rail {
  transform: scaleX(0);
  transform-origin: left center;
  animation: rail-draw 1200ms var(--anim-ease-soft) 800ms forwards;
}
@keyframes rail-draw {
  to { transform: scaleX(1); }
}

/* Ticks fade in along the rail */
.slide-path[data-anim-enter] .s10-ticks .tk {
  opacity: 0;
  animation: fade-in 400ms ease forwards;
}
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(1) { animation-delay: 1100ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(2) { animation-delay: 1180ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(3) { animation-delay: 1260ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(4) { animation-delay: 1340ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(5) { animation-delay: 1420ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(6) { animation-delay: 1500ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(7) { animation-delay: 1580ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(8) { animation-delay: 1660ms; }
.slide-path[data-anim-enter] .s10-ticks .tk:nth-child(9) { animation-delay: 1740ms; }

/* Phase nodes — dot pops, then text fades up */
.slide-path[data-anim-enter] .s10-node .dot {
  opacity: 0;
  transform: scale(0);
  animation: node-pop 700ms cubic-bezier(.34,1.56,.64,1) forwards;
}
.slide-path[data-anim-enter] .s10-node:nth-child(1) .dot { animation-delay: 1900ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(2) .dot { animation-delay: 2100ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(3) .dot { animation-delay: 2300ms; }
@keyframes node-pop {
  to { opacity: 1; transform: scale(1); }
}

.slide-path[data-anim-enter] .s10-node .phase,
.slide-path[data-anim-enter] .s10-node .desc {
  opacity: 0;
  animation: fade-up 700ms var(--anim-ease) forwards;
}
.slide-path[data-anim-enter] .s10-node:nth-child(1) .phase { animation-delay: 2200ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(1) .desc  { animation-delay: 2350ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(2) .phase { animation-delay: 2400ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(2) .desc  { animation-delay: 2550ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(3) .phase { animation-delay: 2600ms; }
.slide-path[data-anim-enter] .s10-node:nth-child(3) .desc  { animation-delay: 2750ms; }

/* The Asks — columns fade in after timeline, then list items stagger */
.slide-path[data-anim-enter] .s10-ask {
  border-top-color: transparent;
}
.slide-path[data-anim-enter] .s10-ask::before {
  content: ""; position: absolute;
  left: 0; right: 0; top: 0;
  height: 1px; background: rgba(14,14,14,0.18);
  transform: scaleX(0); transform-origin: center;
  animation: rule-grow-center 900ms var(--anim-ease-soft) 6000ms forwards;
}
.slide-path[data-anim-enter] .s10-ask-col .lab {
  opacity: 0; animation: fade-up 700ms var(--anim-ease) 6200ms forwards;
}
.slide-path[data-anim-enter] .s10-ask-col:nth-child(2) .lab { animation-delay: 6350ms; }

.slide-path[data-anim-enter] .s10-ask-col li {
  opacity: 0; transform: translateY(10px);
  animation: fade-up 600ms var(--anim-ease) forwards;
}
.slide-path[data-anim-enter] .s10-ask-col:nth-child(1) li:nth-child(1) { animation-delay: 6450ms; }
.slide-path[data-anim-enter] .s10-ask-col:nth-child(1) li:nth-child(2) { animation-delay: 6550ms; }
.slide-path[data-anim-enter] .s10-ask-col:nth-child(1) li:nth-child(3) { animation-delay: 6650ms; }
.slide-path[data-anim-enter] .s10-ask-col:nth-child(2) li:nth-child(1) { animation-delay: 6600ms; }
.slide-path[data-anim-enter] .s10-ask-col:nth-child(2) li:nth-child(2) { animation-delay: 6700ms; }
.slide-path[data-anim-enter] .s10-ask-col:nth-child(2) li:nth-child(3) { animation-delay: 6800ms; }

.slide-path[data-anim-enter] .s10-foot,
.slide-path[data-anim-enter] .s10-closing-logo {
  opacity: 0; animation: fade-up 800ms var(--anim-ease) 6900ms forwards;
}

/* ──────────────────────────────────────────────────────────
   SHARED KEYFRAMES
   ────────────────────────────────────────────────────────── */

@keyframes fade-up {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fade-up-strong {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes rule-grow {
  to { transform: scaleX(1); }
}
@keyframes rule-grow-y {
  to { transform: scaleY(1); }
}
@keyframes rule-grow-center {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* Reduced-motion respect */
@media (prefers-reduced-motion: reduce) {
  [data-anim-enter] *,
  [data-anim-enter] *::before,
  [data-anim-enter] *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
  }
}