/* Estilos generales */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.carousel-container {
  width: 100vw;
  height: 88vh; /* Altura adaptable para todas las pantallas */
  overflow: hidden;
  position: relative;
}

.carousel {
  display: flex;
  width: 300vw; /* 3 imágenes */
  height: 100%;
  transition: transform 0.5s ease-in-out;
}

.carousel-slide {
  width: 100vw;
  height: 100%;
  flex-shrink: 0;
}

.carousel-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

/* ✅ Media query para celulares */
@media (max-width: 600px) {
  .carousel-container {
    height: 200px; /* Más pequeño en celular si lo deseas */
  }
}