/* ==========================================================================
   ANIMATION: pure-CSS ambient loops + pre-reveal states for GSAP.
   GSAP/ScrollTrigger choreography lives in assets/js/animations.js.
   ========================================================================== */

/* Ambient loops (transform/opacity only) */
@keyframes sweep { from { opacity: 0; transform: translateX(-10%); } to { opacity: 1; transform: none; } }
@keyframes fly { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes dash { to { stroke-dashoffset: -64; } }
@keyframes ring { 0% { transform: scale(.4); opacity: .8; } 100% { transform: scale(2.4); opacity: 0; } }
@keyframes marching { from { background-position: 0 0; } to { background-position: -96px 0; } }
@keyframes mq { to { transform: translateX(-50%); } }
@keyframes waPulse { 0% { box-shadow: 0 0 0 0 rgba(31,168,85,.5); } 100% { box-shadow: 0 0 0 18px rgba(31,168,85,0); } }

.sweep { animation: sweep 1.6s var(--ease-out) both; }
.plane { position: absolute; left: 0; top: 0; width: 64px; height: 64px; margin: -32px 0 0 -32px; offset-path: path('M -140 190 C 380 70, 1000 170, 1580 36'); offset-rotate: auto; animation: fly 20s linear infinite; pointer-events: none; z-index: 1; }
.flow { stroke-dasharray: 7 9; animation: dash 2.6s linear infinite; }
.ring { transform-box: fill-box; transform-origin: center; animation: ring 2.8s ease-out infinite; }
.road { height: 6px; background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.55) 0 48px, transparent 48px 96px); animation: marching 3s linear infinite; }
.mq-track { animation: mq 40s linear infinite; }
.mq:hover .mq-track, .mq:focus-within .mq-track { animation-play-state: paused; }

/* Pre-reveal states: only when JS is running, motion is allowed, and GSAP booted.
   If anything fails, main.js adds .no-anim and everything shows. */
.js:not(.reduce-motion):not(.no-anim) [data-hero],
.js:not(.reduce-motion):not(.no-anim) [data-reveal],
.js:not(.reduce-motion):not(.no-anim) [data-stagger] > * { opacity: 0; visibility: hidden; }
.js:not(.reduce-motion):not(.no-anim) [data-split] { visibility: hidden; }
.js:not(.reduce-motion):not(.no-anim) [data-split].is-split { visibility: visible; }
.js:not(.reduce-motion):not(.no-anim) [data-mask] { visibility: hidden; }

/* Header never waits on animation */
.js [data-header] { opacity: 1; visibility: visible; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
  .faq-panel, .faq-a, .wd-item, .wd-desc, .wd-cta, .wd-img, .fl-img, .blog-img, .hdr, .hdr-in { transition: none !important; }
  .fab.wa { box-shadow: 0 16px 30px -10px rgba(31,168,85,.7); }
}