/* ── ANIMATIONS ──────────────────────────────────────────────────────────────
   Scroll reveal initial states, hero entrance keyframes, pulse.
   GSAP handles the reveal transitions; CSS only sets initial hidden state.
   ──────────────────────────────────────────────────────────────────────── */

/* ── SCROLL REVEAL (initial state — GSAP animates to visible) ── */
.reveal {
  clip-path: inset(0% 0% 100% 0%);
  transform: translateY(28px);
  will-change: clip-path, transform;
}

/* Wrapper divs use opacity fade — clip-path on a parent clips children */
div.reveal {
  clip-path: none;
  opacity: 0;
  will-change: opacity, transform;
}

/* ── HERO ENTRANCE (initial state — GSAP timeline handles entrance) ── */
.hero-label, h1, .hero-sub, .hero-support, .hero-actions {
  opacity: 1;
}

/* ── MARQUEE ── */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-50% - 16px)); }
}

/* ── AVAILABILITY DOT PULSE ── */
@keyframes pulse {
  0%, 100% { opacity: 1;   }
  50%       { opacity: 0.3; }
}