.testimonials {
  position: relative;
  padding: 110px 74px 98px;
  text-align: center;
}

.testimonials-heading { margin-bottom: 36px; }
.testimonials-heading .section-kicker { justify-content: center; }
.testimonials-heading h2 { margin: 0; font: 700 clamp(2.35rem, 4.7vw, 4.45rem)/0.98 Outfit, sans-serif; letter-spacing: -0.07em; }
.testimonials-heading h2 em { color: var(--green); font: 400 1em Georgia, serif; }

.testimonial-viewport { overflow: hidden; }
.testimonial-slide { display: none; max-width: 910px; margin: 0 auto; }
.testimonial-slide.is-active { display: block; animation: testimonial-in 260ms ease both; }
.testimonial-quote { margin: 0; color: var(--ink); font: 400 clamp(1.7rem, 3.2vw, 2.65rem)/1.24 Georgia, serif; letter-spacing: -0.025em; }
.testimonial-person { display: inline-flex; align-items: center; gap: 12px; margin-top: 30px; color: var(--muted); font-size: 0.84rem; line-height: 1.4; text-align: left; }
.testimonial-person strong { color: var(--ink); }
.testimonial-avatar { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: var(--lime); color: var(--ink); font: 700 0.78rem Outfit, sans-serif; }

.testimonial-control {
  position: absolute;
  top: 54%;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  font-size: 1.45rem;
  transition: transform 160ms ease, border-color 160ms ease, color 160ms ease;
}
.testimonial-control:hover, .testimonial-control:focus-visible { border-color: var(--green); color: var(--green); outline: none; transform: translateY(-2px); }
.testimonial-control.prev { left: 0; }
.testimonial-control.next { right: 0; }

.testimonial-dots { display: flex; justify-content: center; gap: 8px; margin-top: 35px; }
.testimonial-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #c9d3c7; cursor: pointer; }
.testimonial-dot[aria-current="true"] { width: 24px; border-radius: 99px; background: var(--green); }

@keyframes testimonial-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 760px) {
  .testimonials { padding: 72px 0; }
  .testimonials-heading { margin-bottom: 28px; }
  .testimonial-control { position: static; display: inline-grid; margin: 26px 6px 0; }
  .testimonial-controls { display: flex; justify-content: center; }
  .testimonial-person { margin-top: 24px; }
}
