:root {
  --testimonial-navy: #0b253d;
  --testimonial-teal: #18b5ae;
  --testimonial-teal-dark: #0f8f8b;
  --testimonial-teal-soft: #eaf9f8;

  --testimonial-text: #4d6272;
  --testimonial-muted: #758795;

  --testimonial-bg: #f7fafb;
  --testimonial-border: #dfe9ed;

  --testimonial-star: #f1a51c;
}


/* =========================================================
   SECTION
========================================================= */

.gpv-testimonials-section {
  position: relative;

  padding:
    95px 0 85px;

  overflow: hidden;

  background:
    #f7fafb;
}


/* =========================================================
   HEADING
========================================================= */

.gpv-testimonials-heading {
  width:
    min(
      820px,
      100%
    );

  margin:
    0 auto 55px;

  text-align: center;
}


.gpv-testimonials-label {
  display: block;

  margin-bottom: 13px;

  color:
    var(--testimonial-teal-dark);

  font-size: 13px;

  font-weight: 800;

  letter-spacing: 2px;
}


.gpv-testimonials-heading h2 {
  margin:
    0 0 18px;

  color:
    var(--testimonial-navy);

  font-size:
    clamp(
      40px,
      4.5vw,
      54px
    );

  line-height: 1.12;

  font-weight: 800;

  letter-spacing:
    -1.4px;
}


.gpv-testimonials-heading
h2 span {
  color:
    var(--testimonial-teal);
}


.gpv-testimonials-heading p {
  width:
    min(
      690px,
      100%
    );

  margin:
    0 auto;

  color:
    var(--testimonial-muted);

  font-size: 17px;

  line-height: 1.8;
}


/* =========================================================
   SLIDER
========================================================= */

.gpv-testimonials-slider {
  position: relative;
}


.gpv-testimonial-viewport {
  overflow: hidden;

  padding:
    10px 3px 20px;
}


.gpv-testimonial-track {
  display: flex;

  align-items: stretch;

  will-change:
    transform;
}


/* =========================================================
   CARD
========================================================= */

.gpv-testimonial-card {
  min-height: 350px;

  margin:
    0 12px;

  padding:
    30px 30px 27px;

  display: flex;

  flex-direction: column;

  overflow: hidden;

  background:
    #ffffff;

  border:
    1px solid
    var(--testimonial-border);

  border-radius: 22px;

  box-shadow:
    0 12px 35px
    rgba(11,37,61,.06);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}


.gpv-testimonial-card:hover {
  transform:
    translateY(-4px);

  border-color:
    rgba(24,181,174,.35);

  box-shadow:
    0 20px 42px
    rgba(11,37,61,.1);
}


/* =========================================================
   TOP
========================================================= */

.gpv-testimonial-card-top {
  display: flex;

  align-items: center;

  justify-content:
    space-between;

  gap: 15px;

  margin-bottom: 24px;
}


.gpv-testimonial-quote-icon {
  width: 46px;

  height: 46px;

  display: grid;

  place-items: center;

  color:
    var(--testimonial-teal-dark);

  background:
    var(--testimonial-teal-soft);

  border-radius: 13px;

  font-size: 18px;
}


.gpv-testimonial-stars {
  display: flex;

  gap: 4px;

  color:
    var(--testimonial-star);

  font-size: 13px;
}


/* =========================================================
   QUOTE
========================================================= */

.gpv-testimonial-card
blockquote {
  flex: 1;

  margin:
    0 0 25px;

  color:
    var(--testimonial-text);

  font-size: 16px;

  line-height: 1.9;

  font-weight: 500;
}


/* =========================================================
   AUTHOR WITH IMAGE
========================================================= */

.gpv-testimonial-author {
  display: flex;

  align-items: center;

  gap: 13px;

  margin-top: auto;

  padding-top: 20px;

  border-top:
    1px solid
    #ebf0f2;
}


/* IMAGE */

.gpv-testimonial-photo {
  width: 62px;

  height: 62px;

  flex: none;

  padding: 3px;

  border:
    2px solid
    var(--testimonial-teal);

  border-radius: 50%;

  background:
    #ffffff;
}


.gpv-testimonial-photo img {
  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  border-radius: 50%;
}


/* AUTHOR TEXT */

.gpv-testimonial-author-details {
  min-width: 0;

  flex: 1;
}


.gpv-testimonial-author-details strong {
  display: block;

  margin-bottom: 4px;

  color:
    var(--testimonial-navy);

  font-size: 15px;

  line-height: 1.4;

  font-weight: 800;
}


.gpv-testimonial-author-details small {
  color:
    var(--testimonial-muted);

  font-size: 12px;

  line-height: 1.4;
}


.gpv-testimonial-author-line {
  width: 27px;

  height: 3px;

  flex: none;

  background:
    var(--testimonial-teal);

  border-radius: 10px;
}


/* =========================================================
   ARROWS
========================================================= */

.gpv-testimonial-arrow {
  position: absolute;

  top: 50%;

  z-index: 15;

  width: 46px;

  height: 46px;

  display: grid;

  place-items: center;

  border:
    1px solid
    #d8e4e8;

  border-radius: 50%;

  color:
    var(--testimonial-teal-dark);

  background:
    #ffffff;

  font-size: 14px;

  cursor: pointer;

  box-shadow:
    0 8px 20px
    rgba(11,37,61,.08);

  transform:
    translateY(-50%);

  transition:
    .2s ease;
}


.gpv-testimonial-prev {
  left: -58px;
}


.gpv-testimonial-next {
  right: -58px;
}


.gpv-testimonial-arrow:hover {
  color:
    #ffffff;

  border-color:
    var(--testimonial-teal-dark);

  background:
    var(--testimonial-teal-dark);
}


/* =========================================================
   DOTS
========================================================= */

.gpv-testimonial-dots {
  margin-top: 18px;

  min-height: 15px;

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 7px;
}


.gpv-testimonial-dot {
  width: 8px;

  height: 8px;

  padding: 0;

  border: 0;

  border-radius: 20px;

  background:
    #cfdddf;

  cursor: pointer;

  transition:
    .25s ease;
}


.gpv-testimonial-dot.active {
  width: 28px;

  background:
    var(--testimonial-teal);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1150px) {

  .gpv-testimonial-prev {
    left: 0;
  }


  .gpv-testimonial-next {
    right: 0;
  }


  .gpv-testimonial-viewport {
    padding-left: 40px;

    padding-right: 40px;
  }

}


@media (max-width: 1050px) {

  .gpv-testimonials-section {
    padding:
      78px 0 70px;
  }


  .gpv-testimonial-card {
    min-height: 345px;
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

  .gpv-testimonials-section {
    padding:
      65px 0 60px;
  }


  .gpv-testimonials-heading {
    margin-bottom: 38px;
  }


  .gpv-testimonials-label {
    font-size: 11px;
  }


  .gpv-testimonials-heading h2 {
    font-size: 32px;
  }


  .gpv-testimonials-heading p {
    font-size: 14px;
  }


  .gpv-testimonial-viewport {
    padding:
      8px 29px 18px;
  }


  .gpv-testimonial-card {
    min-height: 350px;

    margin:
      0 5px;

    padding:
      24px 21px;
  }


  .gpv-testimonial-card
  blockquote {
    font-size: 14px;

    line-height: 1.85;
  }


  .gpv-testimonial-photo {
    width: 55px;

    height: 55px;
  }


  .gpv-testimonial-arrow {
    width: 38px;

    height: 38px;

    font-size: 12px;
  }


  .gpv-testimonial-prev {
    left: -1px;
  }


  .gpv-testimonial-next {
    right: -1px;
  }

}