/* ================================================================
   MarketAds.co — ANIMACIONES Y KEYFRAMES
   Duración máxima: 600ms por brief
   Acciones rápidas, micro-interacciones premium
================================================================ */


/* ================================================================
   KEYFRAMES GLOBALES
================================================================ */

/* Rotación de halos */
@keyframes girar-halo {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Flotación suave — tarjetas KPI y partículas */
@keyframes flotar-tarjeta {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0); }
}

@keyframes flotar-p {
  0%   { transform: translateY(0) scale(1); }
  50%  { transform: translateY(-8px) scale(1.15); }
  100% { transform: translateY(0) scale(1); }
}

/* Pulso — dots y badge */
@keyframes pulsar-punto {
  0%, 100% { opacity: 1;   transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.75); }
}

/* Pulso WhatsApp flotante */
@keyframes pulsar-wa {
  0%   { transform: scale(0.95); opacity: 0.7; }
  50%  { transform: scale(1.35); opacity: 0; }
  100% { transform: scale(0.95); opacity: 0; }
}

/* Marquee horizontal infinito */
@keyframes marquee-desplazar {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Entrada desde abajo */
@keyframes entrada-abajo {
  from {
    opacity:   0;
    transform: translateY(28px);
  }
  to {
    opacity:   1;
    transform: translateY(0);
  }
}

/* Fade simple */
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Shimmer — skeleton loader */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

/* Progreso de barra */
@keyframes progreso-barra {
  from { width: 0%; }
}

/* Latido — indicadores de estado */
@keyframes latido {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.25); }
}


/* ================================================================
   HOVER PREMIUM — CARRUSEL DE SERVICIOS
================================================================ */

.sv-slide__ilus {
  transition: box-shadow 0.4s ease, transform 0.4s ease;
}

.sv-car:hover .sv-slide__ilus {
  box-shadow:
    0 0 0 1px rgba(109,40,255,0.15),
    0 40px 100px rgba(0,0,0,0.6),
    0 0 120px rgba(109,40,255,0.07);
}


/* ================================================================
   SHIMMER SKELETON (opcional para carga)
================================================================ */

.shimmer {
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.04) 0%,
    rgba(255,255,255,0.10) 50%,
    rgba(255,255,255,0.04) 100%
  );
  background-size: 200% auto;
  animation:       shimmer 1.5s linear infinite;
}


/* ================================================================
   REDUCCIÓN DE MOVIMIENTO — ACCESIBILIDAD
================================================================ */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration:       0.01ms !important;
    animation-iteration-count: 1     !important;
    transition-duration:      0.01ms !important;
  }
}