:root {
  --swiper-navigation-size: 3vmin !important;
  --swiper-pagination-top: 0px !important;
}
.swiper {
  width: 100%;
  padding: 3em 0;
}
.swiper-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
}
.swiper-slide {
  position: relative;
  width: 100%;
  height: 100%;
  transform: scale(1.3);
  transition: 0.5s;
}
.swiper-slide-active {
  transform: scale(1);
}
.swiper-slide .img-wrapper {
  width: 100%;
  height: 100%;
  transform: scale(1.3);
  transition: 0.5s;
}
.swiper-slide-active .img-wrapper {
  transform: scale(1);
}
.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  filter: grayscale(1);
}
.swiper-slide-active img {
  filter: grayscale(0);
}

.videoWrapper {
  position: relative;
  grid-area: 1 / 1 / 2 / 2;
  width: 90%;
  height: 100%;
  margin: 0 auto;
  /* overflow: hidden; */
  align-content: center;
}
.videoWrapper video {
  position: relative;
  width: 99%;
  border-radius: 5px;
}
.video-description p {
  grid-area: 2 / 1 / 3 / 2;
  margin: 0 !important;
  user-select: none;
  text-align: center;
}

.hero-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hero-left {
  display: flex;
  flex-direction: column;
  font-family: "Manrope", sans-serif;
  /* margin-top: 20px; */
  height: 40px;
}

.hero-left h2 {
  text-align: center;
}
.hero-left .left-description {
  font-size: clamp(16px, 2vw, 20px);
  text-align: center;
}
.hero-right {
  /* width: 90%; */
  margin: 0 auto;
  /* display: grid; */
  /* grid-template-rows: minmax(360px, auto); */
  row-gap: 2vh;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-horizontal.swiper-pagination-bullets {
  top: var(--swiper-pagination-top, auto);
}
.swiper-button-next,
.swiper-button-prev {
  margin-top: calc(0px - var(--swiper-navigation-size) / 2);
  /* top: var(--swiper-navigation-top-offset, 20px) !important; */
  top: var(--swiper-navigation-top-offset, 30%) !important;
}
.swiper-button-next,
.swiper-button-prev {
  align-items: center;
  /* color: var(--swiper-navigation-color,var(--swiper-theme-color)); */
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
  cursor: pointer;
  display: flex;
  height: var(--swiper-navigation-size);
  justify-content: center;
  position: absolute;
  width: var(--swiper-navigation-size);
  z-index: 10;

  /* background: var(--accent);
  padding: 5px;
  border-radius: 100vmax; */
}

.swiper-pagination-bullet-active {
  background: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-pagination-bullet-inactive {
  background: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-pagination-bullet {
  background: var(--text-color) !important;
}
@media screen and (max-width: 768px) {
  #hero-container {
    flex-direction: column;
  }
  #hero-left {
    width: 100%;
    height: 25vh;
  }
  #hero-right {
    width: 100%;
    /* height: 65vh; */
    grid-template-rows: minmax(200px, auto);
  }
  .swiper-button-next,
  .swiper-button-prev {
    /* display: none !important; */
  }
}
