.play-pause-wrapper{ 
    width: 40px;
    height: 40px;
    bottom: 16px;
    right: 16px;
    background-color: var(--tint-dark-25);
    z-index: 2;
    border-radius: var(--radius-xxl);
    cursor:pointer;
    font-size:2.4rem;
}
.simple-hero-banner__bg{position:relative;}
.simple-hero-banner__bg video{object-fit: cover;
    object-position: bottom;}
.simple-hero-banner__description:has(.modal.show) {
    z-index: 1060;
}

@media (max-width:575.98px) {
  .simple-hero-banner .video {
    aspect-ratio: 16/9;
    height: auto
  }
  .simple-hero-banner .video iframe {
    width: 100vw
  }
}
@media (min-width:768px) {
  .simple-hero-banner__description::before {
    content: "";
    background: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),color-stop(15.8%,rgba(0,0,0,.42)),to(rgba(0,0,0,0)));
    background: linear-gradient(90deg,rgba(0,0,0,.5) 0,rgba(0,0,0,.42) 15.8%,rgba(0,0,0,0) 100%);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 1;
    left: 0
  }
  .simple-hero-banner--center .simple-hero-banner__description::before {
    background: rgba(0,0,0,.5)
  }
  .simple-hero-banner__bg {
    top: 0;
    left: 0;
    overflow: hidden;
    position: absolute;
    z-index: 1
  }
  .simple-hero-banner__content-wrapper {
    min-height: 44rem
  }
}
@media (min-width:992px) {
  .simple-hero-banner__content-wrapper {
    min-height: 80rem
  }
  .simple-hero-banner__content-wrapper.simple-hero-banner--full-height {
    min-height: 100vh
  }
}
.carousel-banner__iframe {
  height: 55.25vw
}
.carousel-banner__wrapper .carousel-banner__bg {
  position: relative;
  height: 21.2rem
}
.carousel-banner__wrapper .carousel-banner__bg::after {
  content: "";
  background: -webkit-gradient(linear,left top,left bottom,color-stop(81.68%,rgba(0,0,0,0)),to(rgba(0,0,0,.2))),-webkit-gradient(linear,left bottom,left top,from(var(--tint-dark-25,rgba(0,0,0,.25))),to(var(--tint-dark-25,rgba(0,0,0,.25)))),-webkit-gradient(linear,left top,right top,color-stop(2.72%,rgba(0,0,0,.5)),color-stop(81.25%,rgba(255,255,255,0)));
  background: linear-gradient(180deg,rgba(0,0,0,0) 81.68%,rgba(0,0,0,.2) 100%),linear-gradient(0deg,var(--tint-dark-25,rgba(0,0,0,.25)) 0,var(--tint-dark-25,rgba(0,0,0,.25)) 100%),linear-gradient(90deg,rgba(0,0,0,.5) 2.72%,rgba(255,255,255,0) 81.25%);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  z-index: 1;
  left: 0
}
.carousel-banner__video-bg {
  vertical-align: top;
  width: 100vw;
  height: 56.25vw
}
.carousel-banner__bg {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden
}
.carousel-banner .carousel-navigation {
  position: absolute;
  top: 16.4rem;
  z-index: 10;
  width: 100%
}
.carousel-banner .carousel-arrow {
  border: none;
  line-height: normal;
  width: 32px;
  height: 32px;
  color: var(--base-5);
  background: 0 0
}
.carousel-banner .carousel-arrow.carousel-arrow.swiper-button-disabled {
  opacity: .25
}
.carousel-banner .carousel-arrow .carousel-pagination .fraction.swiper-pagination-bullet-active {
  background: 0 0
}
.carousel-banner--arrow .carousel-navigation {
  top: 18rem
}
.carousel-banner--arrow .carousel-pagination .swiper-pagination-bullet {
  background: 0 0;
  display: none
}
.carousel-banner--arrow .carousel-pagination .swiper-pagination-bullet-active {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
}
.carousel-banner--arrow .carousel-arrow {
  background: var(--base-5);
  color: var(--base-1)
}
.carousel-banner--line .carousel-pagination .swiper-pagination-bullet {
  height: .4rem;
  width: 3.5rem;
  background-color: var(--base-5);
  border-radius: 2px;
  opacity: .25
}
.carousel-banner--line .carousel-pagination .swiper-pagination-bullet-active {
  background-color: var(--base-5);
  opacity: 1
}
@media (min-width:768px) {
  .carousel-banner__video-bg {
    position: absolute;
    min-height: 100vh;
    min-width: 177.77vh;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
  }
  .carousel-banner__content-wrapper {
    min-height: 440px
  }
  .carousel-banner__wrapper .carousel-banner__bg {
    position: absolute;
    height: 100%
  }
  .carousel-banner .carousel-navigation {
    top: auto;
    bottom: 0
  }
}
@media (min-width:992px) {
  .carousel-banner__content-wrapper {
    min-height: 80rem
  }
}