/* ==========================================================
   animations.css
   ========================================================== */

@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.8)} }
@keyframes slide { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes rise  { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }

/* ---------- hero load sequence ---------------------------- */

.lead-copy h1, .lead-copy .lede, .lead-actions, .lead-facts {
  animation: rise 800ms var(--ease-out) both;
}
.lead-copy h1    { animation-delay:  80ms; }
.lead-copy .lede { animation-delay: 200ms; }
.lead-actions    { animation-delay: 300ms; }
.lead-facts      { animation-delay: 380ms; }

/* ---------- scroll reveal --------------------------------- */

[data-reveal] {
  opacity: 0; transform: translateY(26px);
  transition: opacity 820ms var(--ease-out), transform 820ms var(--ease-out);
}
[data-reveal].is-revealed { opacity: 1; transform: translateY(0); }

[data-reveal-group] > * {
  opacity: 0; transform: translateY(22px);
  transition: opacity 720ms var(--ease-out), transform 720ms var(--ease-out);
}
[data-reveal-group].is-revealed > * { opacity: 1; transform: translateY(0); }
[data-reveal-group].is-revealed > *:nth-child(1){transition-delay:0ms}
[data-reveal-group].is-revealed > *:nth-child(2){transition-delay:90ms}
[data-reveal-group].is-revealed > *:nth-child(3){transition-delay:180ms}
[data-reveal-group].is-revealed > *:nth-child(4){transition-delay:270ms}
[data-reveal-group].is-revealed > *:nth-child(5){transition-delay:360ms}

@media (prefers-reduced-motion: reduce) {
  .lead-copy h1,.lead-copy .lede,.lead-actions,.lead-facts { animation: none; }
  .marquee-track { animation: none; }
  [data-reveal],[data-reveal-group] > * { opacity:1; transform:none; transition:none; }
}

/* ---------- visualiser ------------------------------------ */

@keyframes ping {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--vis-accent) 70%, transparent); }
  70%  { box-shadow: 0 0 0 10px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}

@keyframes flash {
  from { opacity: .2; }
  to   { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .vis-hint .ring { animation: none; }
  .vis.did-paint .vis-stage::after { animation: none; opacity: 0; }
}
