/* ==========================================================================
   Motion: scroll-reveal, marquee, floating glow dots
   All respect prefers-reduced-motion via the blanket override in base.css.
   ========================================================================== */

@keyframes ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes orbit-float {
  0%, 100% { transform: translateY(0) translateX(0); }
  50% { transform: translateY(-18px) translateX(10px); }
}

/* Scroll-reveal: elements start hidden, animations.js adds .is-visible
   when they enter the viewport via IntersectionObserver. */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 800ms cubic-bezier(.2,.8,.2,1), transform 800ms cubic-bezier(.2,.8,.2,1);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal="fade"] { transform: none; }
[data-reveal="left"] { transform: translateX(-24px); }
[data-reveal="left"].is-visible { transform: translateX(0); }
[data-reveal="right"] { transform: translateX(24px); }
[data-reveal="right"].is-visible { transform: translateX(0); }
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal="scale"].is-visible { transform: scale(1); }

/* Stagger children of a [data-reveal-group] */
[data-reveal-group] > [data-reveal]:nth-child(1) { transition-delay: 0ms; }
[data-reveal-group] > [data-reveal]:nth-child(2) { transition-delay: 90ms; }
[data-reveal-group] > [data-reveal]:nth-child(3) { transition-delay: 180ms; }
[data-reveal-group] > [data-reveal]:nth-child(4) { transition-delay: 270ms; }
[data-reveal-group] > [data-reveal]:nth-child(5) { transition-delay: 360ms; }
[data-reveal-group] > [data-reveal]:nth-child(6) { transition-delay: 450ms; }

/* Toggled via IntersectionObserver in animations.js on continuous/infinite
   animations (ticker marquee, orbit dots) once they scroll far out of view,
   so they don't keep burning CPU/battery off-screen. */
.is-paused { animation-play-state: paused !important; }

/* ---------- Scroll-driven reading progress bar ---------- */
.scroll-progress {
  position: fixed; top: 0; left: 0;
  height: 3px; width: 100%;
  background: linear-gradient(90deg, var(--red), var(--amber));
  transform-origin: left;
  transform: scaleX(0);
  z-index: 300;
  pointer-events: none;
}
/* Modern browsers: driven natively by scroll position, no JS/scroll-listener
   needed - the animation's progress *is* the scroll progress. animations.js
   only attaches a scroll-listener fallback when this isn't supported. */
@supports (animation-timeline: scroll()) {
  .scroll-progress {
    animation: scroll-progress-fill linear;
    animation-timeline: scroll(root);
  }
}
@keyframes scroll-progress-fill {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; }
  .logo-ticker__track { animation: none; }
  .orbit-dot { animation: none; }
}