.prev-carousel-btns {
  margin: 1rem auto 1rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
}

.prev-carousel-btns button {
  cursor: pointer;
  padding: 1rem 2rem;
  border: none;
  background-color: #097d25;
  border: 2px solid white;
}

.prev-carousel-btns button:hover {
  /* background-color: ; */
}

.swiper {
  margin: 1rem auto 4rem;
  width: 100%;
  aspect-ratio: 16 / 9;
  position: relative;
}

.swiper-buttons > div {
  fill: white;
}

.swiper-buttons > div::after {
  content: unset;
}

.swiper-pagination {
  z-index: 1;
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.swiper-title {
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: 100%;
  padding: 1rem 2rem;
  background-color: rgba(0, 0, 0, 0.45);
  animation: fade 200ms linear;
}

@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media screen and (max-width: 600px) {
  .swiper-title h1 {
    text-align: center;
    font-size: 12pt !important;
  }

  .swiper-title p {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .swiper {
    aspect-ratio: 4 / 3;
  }
}

@media screen and (max-width: 980px) {
  .swiper-title h1 {
    font-size: 20pt;
  }

  .swiper-title p {
    font-size: 12pt;
  }
}