/*
 * Animations
 *
 * Scroll-triggered animation framework with direction and delay modifiers.
 * JS toggles the `.visible` class on elements with `.animate`.
 * Dependencies: none
 */

/* ── Base ── */
.animate {
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.animate.visible { opacity: 1; transform: none; }

/* ── Directions ── */
.animate--up    { transform: translateY(30px); }
.animate--left  { transform: translateX(-40px); }
.animate--right { transform: translateX(40px); }
.animate--scale { transform: scale(0.95); }

/* ── Stagger delays ── */
.animate--d1 { transition-delay: 0.15s; }
.animate--d2 { transition-delay: 0.3s; }
.animate--d3 { transition-delay: 0.45s; }

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  .animate { opacity: 1; transform: none; transition: none; }
}

/* ── No-JS Fallback ── */
.no-js .animate { opacity: 1; transform: none; }
