/* ==========================================
   ANIMACIONES Y TRANSICIONES
   ========================================== */

/* Keyframes */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes floatLight {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes pulseGlow {
  0%, 100% { opacity: 0.8; }
  50% { opacity: 1; }
}

/* Scroll Reveal Classes (IntersectionObserver) */
.revelar {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--lento) var(--curva), transform var(--lento) var(--curva);
  will-change: opacity, transform;
}

.revelar.activo {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays */
.revelar-delay-1 { transition-delay: 80ms; }
.revelar-delay-2 { transition-delay: 160ms; }
.revelar-delay-3 { transition-delay: 240ms; }
.revelar-delay-4 { transition-delay: 320ms; }
.revelar-delay-5 { transition-delay: 400ms; }
.revelar-delay-6 { transition-delay: 480ms; }

/* Micro-interacciones hover en tarjetas */
.hover-escala-img {
  transition: transform var(--medio) var(--curva);
}
.tarjeta:hover .hover-escala-img {
  transform: scale(1.04);
}