/*
 * AYU Foundation Child Theme — ayu-motion.css
 * Scroll-reveal, ambient ribbon/orbit drift, SVG path-draw, and the
 * prefers-reduced-motion overrides that govern all of them.
 * Ported unchanged from the approved prototype's motion.css.
 */

/* AYU Foundation — Motion system */

/* Scroll-reveal base state: elements start hidden, JS (reveal.js) adds .is-visible via IntersectionObserver */
[data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity var(--duration-reveal) var(--ease-out),
              transform var(--duration-reveal) var(--ease-out);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal="fade"] { transform: none; }

/* Stagger children via inline --delay set by JS or inline style */
[data-reveal] { transition-delay: var(--reveal-delay, 0ms); }

/* Hero stagger (no JS dependency for above-the-fold content — animates on load) */
@keyframes hero-in {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero [data-hero-stagger] {
  opacity: 0;
  animation: hero-in var(--duration-reveal) var(--ease-out) forwards;
  animation-delay: var(--stagger-delay, 0ms);
}

/* Ambient drift for ribbon watermarks and orbit dots */
@keyframes ambient-drift {
  0%   { transform: translate(0, 0) rotate(0deg); }
  50%  { transform: translate(-1.5%, 2%) rotate(1.2deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes ambient-float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0); }
}
.is-ambient { animation: ambient-drift var(--duration-ambient) ease-in-out infinite; }
.is-floating { animation: ambient-float 18s ease-in-out infinite; }
.is-floating--slow { animation: ambient-float 25s ease-in-out infinite; }
.is-floating--delay { animation-delay: -6s; }

/* Path draw-in (ribbons/process lines with data-draw) */
.draw-path {
  stroke-dasharray: var(--path-length, 1000);
  stroke-dashoffset: var(--path-length, 1000);
  transition: stroke-dashoffset 900ms var(--ease-out);
}
.draw-path.is-visible { stroke-dashoffset: 0; }

/* Card lift handled in components.css via :hover; here we add group focus-within support */
.card:focus-within, .service-tile:focus-within, .pathway-card:focus-within {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

/* Reduced motion: kill ambient/scroll motion, show content immediately */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .hero [data-hero-stagger] {
    opacity: 1 !important;
    animation: none !important;
  }
  .is-ambient, .is-floating, .is-floating--slow {
    animation: none !important;
  }
  .draw-path {
    stroke-dashoffset: 0 !important;
    transition: none !important;
  }
  * {
    scroll-behavior: auto !important;
  }
}