/*=================
  CAROUSEL TESTIMONIAL
=================*/

.carousel-testimonial {
  background: var(--color-p-10);
  padding: var(--space-7) 0px;
}

.carousel-testimonial h2 {
  max-width: 905px;
  margin-bottom: var(--space-3);
}
.carousel-testimonial .copy p:last-of-type {
  max-width: 905px;
  margin-bottom: var(--space-6);
}

.carousel-testimonial .swiper-slide {
  padding: var(--space-4);
  border: 2px solid var(--color-p);
}
.carousel-testimonial .swiper-slide svg {
  display: block;
  width: 34px;
  height: 34px;
  margin-bottom: var(--space-3);
}
.carousel-testimonial .swiper-slide blockquote {
  margin-bottom: var(--space-1);
}
.carousel-testimonial .swiper-slide em {
  display: block;
  font-weight: 700;
  color: var(--color-p);
}

.carousel-testimonial-swiper {
  overflow: hidden;
}

.carousel-testimonial-swiper .carousel-navigation {
  display: flex;
  gap: var(--space-1);
  margin-top: var(--space-4);
}
.carousel-testimonial-swiper .carousel-navigation .swiper-prev,
.carousel-testimonial-swiper .carousel-navigation .swiper-next {
  padding: 0px 12px 4px;
  border: 2px solid var(--color-p);
  transition: .15s;
}
.carousel-testimonial-swiper .carousel-navigation .swiper-prev:hover,
.carousel-testimonial-swiper .carousel-navigation .swiper-next:hover {
  background: var(--color-p)
}
.carousel-testimonial-swiper .carousel-navigation .swiper-prev svg {
  rotate: 180deg;
}
.carousel-testimonial-swiper .carousel-navigation svg {
  width: 24px;
}

@media (prefers-color-scheme: dark) {
  .carousel-testimonial {
    background: var(--color-s);
  }
  .carousel-testimonial-swiper .carousel-navigation svg path {
    stroke: var(--color-n-white);
  }
}

@media only screen and (max-width: 992px) {
  .carousel-testimonial {
    padding: var(--space-6) 0px;
  }
}