/* ==========================================================================
   Koha Service — Scroll-reveal system & keyframes
   GPU-friendly: only transform + opacity are animated.
   JS (IntersectionObserver, assets/js/scroll-animations.js) toggles
   .is-visible once per element — no scroll-linked/scrubbed animation.
   ========================================================================== */

[data-reveal] {
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.9s var(--ease-out-expo), transform 0.9s var(--ease-out-expo), filter 0.9s var(--ease-out-expo);
}

[data-reveal="fade-up"]    { transform: translateY(46px); }
[data-reveal="fade-down"]  { transform: translateY(-46px); }
[data-reveal="fade-left"]  { transform: translateX(46px); }
[data-reveal="fade-right"] { transform: translateX(-46px); }
[data-reveal="fade-in"]    { transform: none; }
[data-reveal="scale"]      { transform: scale(0.9); }
[data-reveal="blur"]       { filter: blur(14px); transform: translateY(20px); }

[data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: blur(0);
}

/* Staggering: JS sets --stagger-index on children; delay computed via CSS */
[data-stagger] > * {
  transition-delay: calc(var(--stagger-index, 0) * 90ms);
}

/* Mask reveal (images / panels) */
.mask-reveal { position: relative; overflow: hidden; }
.mask-reveal::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--c-black-950);
  transform: scaleX(1);
  transform-origin: right;
  z-index: 2;
  transition: transform 1.1s var(--ease-out-expo);
}
.mask-reveal.is-visible::before { transform: scaleX(0); }

/* Number counters just rely on JS text updates; provide subtle pop-in */
.stat-num[data-count] { transition: opacity 0.6s var(--ease-out-quart); }

/* Marquee (used for trust strip / partners if needed) */
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee 28s linear infinite;
}

/* Floating ambient shapes */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-18px); }
}
.float-el { animation: floatY 7s ease-in-out infinite; }

/* Gradient shimmer for accent glows */
@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.ambient-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.35;
  pointer-events: none;
  background: var(--grad-gold);
  background-size: 200% 200%;
  animation: gradientShift 12s ease-in-out infinite;
}

/* Page transition curtain (section-to-section reveal helper) */
.curtain {
  position: fixed;
  inset: 0;
  z-index: 8500;
  background: var(--c-black-950);
  transform: translateY(0);
  pointer-events: none;
}

/* Loading spinner (fallback, rarely visible) */
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------------- */
/* Reduced motion — accessibility first                                   */
/* ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; }
  .hero-title .line span { transform: none !important; }
  html { scroll-behavior: auto !important; }
  .hero-particles, .hero-light-sweep, .ambient-glow { display: none !important; }
  .testimonials-marquee { overflow-x: auto !important; }
  .testimonial-track { animation: none !important; transform: none !important; }
  .testimonial-card[aria-hidden="true"] { display: none !important; }
}

/* Respect reduced motion also via the JS-set .reduced-motion class */
.reduced-motion [data-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; }
.reduced-motion .hero-media .hero-slide { animation: none !important; }
.reduced-motion .hero-particles,
.reduced-motion .hero-light-sweep,
.reduced-motion .ambient-glow { display: none !important; }
.reduced-motion .testimonial-track { animation: none !important; transform: none !important; }
.reduced-motion .testimonial-card[aria-hidden="true"] { display: none !important; }