/* ============================================================
   Synergy Dynamics Balance — Animaciones
   Helpers GSAP · keyframes · estados iniciales
   ============================================================ */

/* Estados iniciales para reveal (evita FOUC; GSAP los anima a visible).
   Si JS no carga o el usuario prefiere reduced-motion, todo queda visible. */
.js [data-reveal],
.js [data-stagger] > * {
  opacity: 0;
  transform: translateY(32px);
  will-change: opacity, transform;
}
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal],
  .js [data-stagger] > * { opacity: 1 !important; transform: none !important; }
}

/* Float suave para imagen de libro */
@keyframes float {
  0%, 100% { transform: translateY(0) rotateY(-18deg) rotateX(4deg); }
  50%      { transform: translateY(-14px) rotateY(-14deg) rotateX(6deg); }
}

/* Pulso del indicador de scroll */
@keyframes scrollPulse {
  0%   { opacity: 0; transform: translateY(0); }
  40%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(12px); }
}

/* Glow ambiental del hero */
@keyframes auraDrift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(4%, -3%) scale(1.08); }
}

/* Shimmer de carga (placeholders) */
@keyframes shimmer {
  0% { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}
.shimmer {
  background: linear-gradient(90deg, var(--color-bg-alt) 25%, #e8e6df 50%, var(--color-bg-alt) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.6s infinite linear;
}

@media (prefers-reduced-motion: reduce) {
  .book-3d, .scroll-indicator span, .hero-aura { animation: none !important; }
}