/* =========================================================
   FLEXIBLE BUSINESS SYSTEMS, INC. — Motion
   ========================================================= */

/* Scroll reveal (JS toggles .is-visible via IntersectionObserver) */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-stagger > * {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity var(--dur-med) var(--ease-out), transform var(--dur-med) var(--ease-out);
}
.reveal-stagger.is-visible > * { opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay: 70ms; }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay: 140ms; }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay: 210ms; }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay: 280ms; }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay: 350ms; }
.reveal-stagger.is-visible > *:nth-child(7) { transition-delay: 420ms; }
.reveal-stagger.is-visible > *:nth-child(8) { transition-delay: 490ms; }
.reveal-stagger.is-visible > *:nth-child(9) { transition-delay: 560ms; }
.reveal-stagger.is-visible > *:nth-child(10) { transition-delay: 630ms; }

/* Schematic / trace flow animation — the site's signature motion.
   Dashed "packets" travel along connector paths to represent data
   moving between operational systems. */
.trace-path {
  stroke-dasharray: 6 10;
  animation: trace-flow 2.6s linear infinite;
}
.trace-path--slow { animation-duration: 4.2s; }
.trace-path--rev { animation-direction: reverse; }

@keyframes trace-flow {
  to { stroke-dashoffset: -160; }
}

.trace-node {
  transition: transform var(--dur-fast) var(--ease-out);
}
.trace-node-pulse {
  animation: node-pulse 3.4s ease-in-out infinite;
}
@keyframes node-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}

/* Hub glow on the central FBSIMS node */
.trace-hub-glow {
  animation: hub-glow 3s ease-in-out infinite;
}
@keyframes hub-glow {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 0.75; }
}

/* Hover/focus highlight state driven by animations.js diagram interactivity */
[data-diagram] .trace-path.is-active { stroke-width: 3.5; }
[data-diagram] .trace-node.is-active { stroke: var(--c-cyan-400); stroke-width: 2.5; }

@media (prefers-reduced-motion: reduce) {
  .trace-path, .trace-node-pulse, .trace-hub-glow {
    animation: none !important;
    stroke-dasharray: none;
  }
  .reveal, .reveal-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}