/* Animaciones del sitio (las activa assets/animaciones.js) */

/* 1. Aparición al bajar */
.lc-reveal {
  opacity: 0;
  translate: 0 28px;
  transition:
    opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
    translate 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--lc-delay, 0ms);
}
.lc-reveal.is-visible {
  opacity: 1;
  translate: 0 0;
}

/* 2. Contadores: números de ancho fijo para que no salten */
.lc-contador { font-variant-numeric: tabular-nums; }

/* 3. Botón flotante de WhatsApp: onda continua y una sacudida cada 7 segundos */
.lc-wa-llamada {
  animation: lc-wa-sacudir 7s ease-in-out 3s infinite;
}
.lc-wa-llamada::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  animation: lc-wa-onda 2.4s ease-out infinite;
}
.lc-wa-llamada:hover,
.lc-wa-llamada:hover::before { animation-play-state: paused; }

@keyframes lc-wa-sacudir {
  0%, 84%, 100% { rotate: 0deg; scale: 1; }
  86% { rotate: -14deg; scale: 1.12; }
  89% { rotate: 12deg; scale: 1.12; }
  92% { rotate: -9deg; scale: 1.1; }
  95% { rotate: 6deg; scale: 1.05; }
  98% { rotate: 0deg; scale: 1; }
}
@keyframes lc-wa-onda {
  0% { box-shadow: 0 0 0 0 oklch(0.55 0.22 20 / 0.55); }
  100% { box-shadow: 0 0 0 18px oklch(0.55 0.22 20 / 0); }
}

/* 5. Tarjetas que se levantan */
.lc-levantar,
.lc-rubro,
.lc-zona,
.lc-marca {
  transition:
    translate 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease,
    background 0.3s ease;
}
.lc-levantar:hover,
.lc-rubro:hover,
.lc-zona:hover,
.lc-marca:hover {
  translate: 0 -6px;
  box-shadow: 0 18px 36px -18px oklch(0.2 0.08 249 / 0.35);
}
.lc-zona:hover { border-color: oklch(0.85 0.06 249); }

@media (prefers-reduced-motion: reduce) {
  .lc-reveal { opacity: 1; translate: none; transition: none; }
  .lc-wa-llamada, .lc-wa-llamada::before { animation: none; }
  .lc-levantar:hover, .lc-rubro:hover, .lc-zona:hover, .lc-marca:hover { translate: none; }
}
