/* ============================================================
   RM AXIS — animations.css
   Subtle, premium scroll-reveal choreography.
   The user should notice the sophistication before the motion.
   ============================================================ */

/* Base reveal state (applied via .reveal in markup) */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity .8s var(--ease),
    transform .8s var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Fade only (for large media / bands) */
.reveal--fade { transform: none; }

/* Title line reveal (clip-style) */
.reveal--title {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.reveal--title.is-visible { opacity: 1; transform: none; }

/* Sequential children (cards / steps) — stagger via --i in markup */
.stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.stagger.is-visible > * {
  opacity: 1;
  transform: none;
}
.stagger.is-visible > * { transition-delay: calc(var(--i, 0) * 90ms); }

/* Draw the left axis line down as it enters */
.axis-rule {
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 1.1s var(--ease);
}
.axis-rule.is-visible { transform: scaleY(1); }

/* Number counter subtle pop handled in JS; keep hook here */
.count-up { font-variant-numeric: tabular-nums; }

/* Hover lift utility already in components; ambient watermark drift */
@keyframes axis-drift {
  from { transform: translateY(0) rotate(0deg); }
  to   { transform: translateY(-10px) rotate(2deg); }
}
.axis-watermark--drift {
  animation: axis-drift 9s ease-in-out infinite alternate;
}

/* ---------- Respect reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal--title,
  .stagger > *,
  .axis-rule {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .axis-watermark--drift { animation: none; }
  .impact__bg { transform: none !important; }
  * { scroll-behavior: auto !important; }
}
