/* ==========================================================================
   HYPERFORMICS — ANIMATIONS
   Keyframes + reduced-motion overrides, kept auditable in one place.
   ========================================================================== */

@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee-scroll var(--marquee-duration, 40s) linear infinite;
}
.marquee-track.is-paused,
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee--reverse .marquee-track { animation-direction: reverse; }
.marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }

@keyframes node-pulse {
  0%, 100% { r: var(--node-r, 4); opacity: 1; }
  50% { r: calc(var(--node-r, 4) * 1.6); opacity: 0.55; }
}
.svg-node { animation: node-pulse 2.4s ease-in-out infinite; transform-origin: center; }

@keyframes arc-draw {
  from { stroke-dashoffset: var(--arc-len, 300); }
  to { stroke-dashoffset: 0; }
}
.svg-arc { stroke-dasharray: var(--arc-len, 300); animation: arc-draw 2.4s var(--ease-premium) forwards; }

@keyframes float-slow {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-18px) rotate(1.2deg); }
}
.float-slow { animation: float-slow 7s ease-in-out infinite; }

@keyframes glow-breathe {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}
.glow-breathe { animation: glow-breathe 4s ease-in-out infinite; }

@keyframes scroll-cue-bounce {
  0%, 100% { transform: translateY(0); opacity: 0.5; }
  50% { transform: translateY(10px); opacity: 1; }
}
.scroll-cue { animation: scroll-cue-bounce 2s ease-in-out infinite; }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes logo-draw {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}
.logo-mark path[data-draw] {
  stroke-dasharray: 1 1;
  stroke-dashoffset: 1;
  pathLength: 1;
  animation: logo-draw 1.6s var(--ease-premium) forwards;
}

@keyframes counter-glow {
  0%, 100% { text-shadow: 0 0 24px rgba(183,71,184,0.15); }
  50% { text-shadow: 0 0 24px rgba(183,71,184,0.4); }
}

@keyframes spin-slow {
  to { transform: rotate(360deg); }
}
.spin-slow { animation: spin-slow 40s linear infinite; }

/* Reduced-motion: kill every continuous/ambient loop and marquee scroll,
   the JS layer also gates particle rAF + ScrollTrigger registration. */
@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none !important; }
  .svg-node, .svg-arc, .float-slow, .glow-breathe, .scroll-cue, .device-frame, .spin-slow, .badge--live::before {
    animation: none !important;
  }
  .svg-arc { stroke-dashoffset: 0 !important; }
}