/*
  SANNA TV Loop — animations.css
  Pre-animation initial states (prevent flash-of-unstyled-content before GSAP
  runs), the inter-slide fade-to-black overlay, and GPU hints. All motion itself
  is driven by GSAP in js/. Colors come from tokens.css.
*/

/* GPU hints for animated elements */
.headline .word,
.eyebrow,
.prioridades__lead,
.priority-row,
.priority-banner,
.vs-card,
.vs-item,
.vs-coverage,
.vs-note,
.rstep,
.rarrow,
.recorrido__cta {
  will-change: transform, opacity;
}

/* Initial hidden states — GSAP animates these to their visible values.
   Guards against a one-frame flash on the first slide before its timeline
   sets its own start values. */
.headline .word,
.eyebrow,
.prioridades__lead,
.priority-row,
.priority-banner,
.vs-card,
.vs-item,
.vs-coverage,
.vs-note,
.rstep,
.rarrow,
.recorrido__cta {
  opacity: 0;
}

/* ─── INTER-SLIDE FADE-TO-BLACK OVERLAY ────────────────────────────────── */

#fade-overlay {
  position: absolute;
  inset: 0;
  z-index: 100;
  background: var(--color-black);
  opacity: 0;
  pointer-events: none;
}