/* Estilos para la carga suave de imágenes */
.lazy-load-bg {
  /* Un color de fondo sutil mientras la imagen real carga en segundo plano */
  background-color: #f3f4f6; /* Equivalente a gray-100 en Tailwind */
}

.lazy-loaded {
  /* Activa la animación de fundido cuando la clase se añade vía JavaScript */
  animation: fadeInImage 0.4s ease-in-out;
}

@keyframes fadeInImage {
  from {
    opacity: 0.6;
  }
  to {
    opacity: 1;
  }
}