/* style.css */

/*
  Asegura la transición suave del scroll a las secciones (Scroll-Behavior: smooth)
  Se incluyó 'class="scroll-smooth"' en la etiqueta <html> del HTML.
*/

/* --- Animaciones CSS para Simular Framer Motion --- */

/* Animación para los pasos del proceso */
.process-step {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.process-step.in-view {
  opacity: 1;
  transform: scale(1);
}

/* Animación para los pasos de madurez en IA */
.maturity-step {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.maturity-step.in-view {
  opacity: 1;
  transform: translateX(0);
}

/* Animación para la barra de progreso de Madurez en IA */
#progress-bar {
    width: 0%;
    transition: width 1.5s ease-out; /* Duración de la animación */
}

#progress-bar.in-view {
    width: 100% !important;
}

/* Animación para las cards de Casos de Éxito */
#casos .rounded-2xl {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}

#casos .rounded-2xl.in-view {
    opacity: 1;
    transform: translateY(0);
}


/* Tailwind utility to ensure icons are rendered */
[data-lucide] {
  display: inline-block;
}