/* ==========================================================================
   THE COMPANY GRUPO L — animations.css
   Keyframes y utilidades de movimiento. Todo respeta prefers-reduced-motion.
   ========================================================================== */

/* ---------- Keyframes ---------- */
@keyframes fadeDown {
  from { opacity: 0; transform: translateY(-24px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes zoomIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes ripple {
  to { transform: scale(2.6); opacity: 0; }
}
@keyframes pulse {
  0%   { transform: scale(1); opacity: 0.7; }
  70%  { transform: scale(1.5); opacity: 0; }
  100% { transform: scale(1.5); opacity: 0; }
}
@keyframes scrollLine {
  0%   { transform: translateY(0); }
  100% { transform: translateY(92px); }
}
@keyframes loaderBar {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(350%); }
}
@keyframes menuItemIn {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes floatSlow {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-14px); }
}
@keyframes shine {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* ---------- Header aparición ---------- */
.header { animation: fadeDown 0.7s var(--ease) both; }

/* ---------- Hero: entrada escalonada ---------- */
.hero__content > * { opacity: 0; }
.hero.is-ready .hero__content > * { animation: fadeUp 0.9s var(--ease) forwards; }
.hero.is-ready .hero__content > *:nth-child(1) { animation-delay: 0.1s; }
.hero.is-ready .hero__content > *:nth-child(2) { animation-delay: 0.25s; }
.hero.is-ready .hero__content > *:nth-child(3) { animation-delay: 0.4s; }
.hero.is-ready .hero__content > *:nth-child(4) { animation-delay: 0.55s; }
.hero.is-ready .hero__stats { animation: fadeIn 1s var(--ease) 0.8s both; }
.hero.is-ready .scroll-cue { animation: fadeIn 1s var(--ease) 1s both; }

/* ---------- Parallax de fondo (JS ajusta --py) ---------- */
.hero__media, .page-banner__media, .cta__media { will-change: transform; }

/* ---------- Reveal helpers (fallback si AOS no carga) ---------- */
[data-reveal] { opacity: 0; transform: translateY(30px); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); }
[data-reveal].is-in { opacity: 1; transform: translateY(0); }
[data-reveal="left"] { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }
[data-reveal="left"].is-in, [data-reveal="right"].is-in { transform: translateX(0); }
[data-reveal="zoom"] { transform: scale(0.94); }
[data-reveal="zoom"].is-in { transform: scale(1); }
[data-reveal-delay="1"] { transition-delay: 0.12s; }
[data-reveal-delay="2"] { transition-delay: 0.24s; }
[data-reveal-delay="3"] { transition-delay: 0.36s; }

/* ---------- Efecto brillo (dorado) ---------- */
.shine {
  background: linear-gradient(110deg, transparent 20%, rgba(200,154,61,0.35) 50%, transparent 80%);
  background-size: 200% 100%;
  animation: shine 3.5s linear infinite;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .hero__content > * { opacity: 1 !important; }
  .scroll-cue, .wa-float::after { animation: none !important; }
}
