/**
 * ============================================================================
 * GORILLA NUTRITION SINALOA - Animaciones CSS
 * ============================================================================
 *
 * Todas las animaciones @keyframes del tema.
 * Cada animación está documentada con su uso principal.
 *
 * @package Gorilla_Nutrition
 * @since   1.0.0
 */

/* ─── Shimmer Dorado ──────────────────────────────────────────────────── */
/**
 * Efecto de brillo que recorre el texto con gradiente dorado.
 * Usado en: Logo GORILLA (nav y hero), texto del footer.
 */
@keyframes shimmerGold {
  0%   { background-position: -300% center; }
  100% { background-position: 300% center; }
}

/* ─── Pulse Rojo ──────────────────────────────────────────────────────── */
/**
 * Efecto de pulso con sombra roja que se expande y desvanece.
 * Usado en: Botón CTA principal del hero y sección final.
 */
@keyframes pulseRed {
  0%, 100% { box-shadow: 0 0 0 0 rgba(212, 32, 32, 0.5); }
  60%      { box-shadow: 0 0 0 18px rgba(212, 32, 32, 0); }
}

/* ─── Movimiento Hero - Izquierda ─────────────────────────────────────── */
/**
 * Entrada desde la izquierda para elementos del hero.
 */
@keyframes heroLeft {
  from { transform: translateX(-44px); }
  to   { transform: translateX(0); }
}

/* ─── Movimiento Hero - Derecha ───────────────────────────────────────── */
/**
 * Entrada desde la derecha para elementos del hero.
 */
@keyframes heroRight {
  from { transform: translateX(44px); }
  to   { transform: translateX(0); }
}

/* ─── Movimiento Hero - Arriba ────────────────────────────────────────── */
/**
 * Entrada desde abajo para elementos del hero.
 */
@keyframes heroUp {
  from { transform: translateY(22px); }
  to   { transform: translateY(0); }
}

/* ─── Rotación Lenta ──────────────────────────────────────────────────── */
/**
 * Rotación lenta en sentido horario.
 * Uso decorativo (elementos de fondo).
 */
@keyframes rotateSlow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ─── Rotación Lenta Inversa ──────────────────────────────────────────── */
/**
 * Rotación lenta en sentido antihorario.
 */
@keyframes rotateCCW {
  from { transform: rotate(0deg); }
  to   { transform: rotate(-360deg); }
}

/* ─── Pulse Spotlight ─────────────────────────────────────────────────── */
/**
 * Efecto de parpadeo suave para elementos de acento.
 */
@keyframes pulseSpot {
  0%, 100% { opacity: 0.6; }
  50%      { opacity: 1; }
}

/* ─── Stripe Diagonal ─────────────────────────────────────────────────── */
/**
 * Movimiento diagonal de patrón de rayas.
 * Usado como fondo decorativo sutil.
 */
@keyframes stripeDiag {
  0%   { background-position: 0 0; }
  100% { background-position: 80px 80px; }
}