/* Hero carousel for KC Headsets */

.hero-carousel {
  position: relative;
  width: 100%;
  max-height: 430px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #f4f4f4;
}

.hero-carousel__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  animation: kcHeroFade 20s infinite;
}

/* Each image begins 5 seconds after the previous image */

.hero-carousel__slide--one {
  animation-delay: 0s;
}

.hero-carousel__slide--two {
  animation-delay: 5s;
}

.hero-carousel__slide--three {
  animation-delay: 10s;
}

.hero-carousel__slide--four {
  animation-delay: 15s;
}

@keyframes kcHeroFade {
  0% {
    opacity: 0;
  }

  5% {
    opacity: 1;
  }

  25% {
    opacity: 1;
  }

  30% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

/* Respect reduced-motion accessibility preference */

@media (prefers-reduced-motion: reduce) {
  .hero-carousel__slide {
    animation: none;
    opacity: 0;
  }

  .hero-carousel__slide--one {
    opacity: 1;
  }
}