/* header{ background-color:#0c005b; color:white; padding:0px; } */

/* Estilo del Precio y Texto */
.precios{color:white;font-size:30;font-weight:bold;}
.texto-negro{color:black;font-size:28;}

/* Estilo del Contenido */
.content {background:black; /* linear-gradient(100deg,white,black) */}
.h4 {color:red;}
movil {color:var(--Color);font-size:50px;}

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);
*{box-sizing:border-box; }


/* Contenedor del slideshow - tamaño fijo o adaptable */
.slideshow {
  position: relative;
  width: 100%;
  /* Ajusta la relación de aspecto según tus imágenes (1200x600 = 2:1) */
  aspect-ratio: 2 / 1;
  background-color: #000; /* color mientras carga */
  overflow: hidden;
}

/* Cada imagen ocupa todo el contenedor y se apila */
.slideshow li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* La imagen ocupa todo el espacio de su <li> */
.slideshow li img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; /* cubre el área sin deformar, recorta si es necesario */
  opacity: 0;
  animation: imageAnimation 36s linear infinite 0s;
}

/* Duración y retraso para cada imagen (debes tener 7 imágenes; ajústalo) */
.slideshow li:nth-child(1) img { animation-delay: 0s; }
.slideshow li:nth-child(2) img { animation-delay: 6s; }
.slideshow li:nth-child(3) img { animation-delay: 12s; }
.slideshow li:nth-child(4) img { animation-delay: 18s; }
.slideshow li:nth-child(5) img { animation-delay: 24s; }
.slideshow li:nth-child(6) img { animation-delay: 30s; }
.slideshow li:nth-child(7) img { animation-delay: 36s; } /* si tienes 7, la última arranca a los 36s */

/* Definición de la animación (similar a la que ya tenías, pero adaptada) */
@keyframes imageAnimation {
  0% { opacity: 0; animation-timing-function: ease-in; }
  8% { opacity: 1; transform: scale(1); animation-timing-function: ease-out; }
  17% { opacity: 1; transform: scale(0.85); }
  22% { opacity: 0; transform: scale(0.85) translateX(-20%); }
  25% { opacity: 0; transform: scale(0.65) translateX(-100%); }
  100% { opacity: 0; }
}