/* ==========================================
   ANIMATIONS.CSS — Entry & scroll animations
   ========================================== */

/* ---------- Page load state ---------- */
body.is-loading * {
  animation-play-state: paused !important;
}

/* ---------- Fade-up base state ---------- */
[data-animate] {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity   var(--dur-enter) var(--ease-out),
    transform var(--dur-enter) var(--ease-out);
}

[data-animate].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Delay variants */
[data-delay="100"] { transition-delay: 100ms; }
[data-delay="200"] { transition-delay: 200ms; }
[data-delay="300"] { transition-delay: 300ms; }
[data-delay="400"] { transition-delay: 400ms; }
[data-delay="500"] { transition-delay: 500ms; }

/* ---------- Header slide-down on load ---------- */
.site-header {
  animation: headerSlideIn 0.9s var(--ease-out) both;
  animation-delay: 200ms;
}

@keyframes headerSlideIn {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}