#slideshow {
  position: relative;
}

#slideshow .swiper-button svg {
  display: none;
}

#slideshow .swiper-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
  max-width: 110px;
  width: fit-content;
  height: fit-content;
  bottom: calc(var(--gap-m) + 5px);
  right: calc(var(--gap-m) + 5px);
  position: absolute;
}

#slideshow .swiper-pagination .swiper-button {
  position: static;
  margin: 0;
}

/** Video on Home */

@media (min-width: 768px) {
  .home #slideshow {
    height: calc(100vh - var(--header-height));
  }

  #slideshow .header-video-container {
    width: 100%;
    aspect-ratio: 1920 / 834;
    height: calc(100vh - var(--header-height));
    overflow: hidden;
  }
}

#slideshow .header-video-container .header-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  margin-top: -1px;
}

#slideshow .header-video-container::before {
  display: block;
  position: absolute;
  height: 20.81vw;
  width: 100%;
  content: "";
  z-index: 9;
  top: -1px;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.5) 0%,
    rgba(0, 0, 0, 0.2) 50%,
    rgba(0, 0, 0, 0) 100%
  );
}
#slideshow .header-video-container::after {
  display: block;
  position: absolute;
  height: 20.81vw;
  z-index: 9;
  width: 100%;
  content: "";
  bottom: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.5) 0%,
    rgba(0, 0, 0, 0.2) 50%,
    rgba(0, 0, 0, 0) 100%
  );
}

@media (max-width: 768px) {
  #slideshow .header-video-container {
    height: 55.2vw;
  }
  #slideshow .swiper-pagination {
    bottom: var(--gap-s);
    right: var(--gap-s);
  }
}