.ebmnt1-client-reviews {
  background-color: var(--ebmnt1-background-client-reviews);
  overflow: hidden;
}

.ebmnt1-client-reviews__inner {
  background-color: var(--ebmnt1-background-client-reviews-inner);
  gap: 4rem;
}

/* Slider: one review per view, scroll-snap + dots */
.ebmnt1-client-reviews__slider {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.75rem;
  width: 100%;
}

.ebmnt1-client-reviews__list {
  display: flex;
  gap: 1rem;
  width: 100%;
  padding-block: 0.5rem;
  /* Side padding lets the first and last cards sit centered, so a slice of the neighbours always shows */
  padding-inline: calc((100cqw - var(--ebmnt1-size-reviews-slide)) / 2);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  cursor: grab;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.ebmnt1-client-reviews__list::-webkit-scrollbar {
  display: none;
}

.ebmnt1-client-reviews__list > li {
  display: flex;
  flex: 0 0 var(--ebmnt1-size-reviews-slide);
  scroll-snap-align: center;
  opacity: var(--ebmnt1-opacity-reviews-inactive);
  transition: opacity var(--ebmnt1-duration-medium) ease;
}

.ebmnt1-client-reviews__list > li.ebmnt1-is-active {
  opacity: 1;
}

.ebmnt1-client-reviews__list.ebmnt1-is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}

.ebmnt1-client-reviews__list img {
  -webkit-user-drag: none;
  user-select: none;
}

.ebmnt1-client-reviews__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

.ebmnt1-client-reviews__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--ebmnt1-size-slider-arrow);
  height: var(--ebmnt1-size-slider-arrow);
  border-radius: var(--ebmnt1-radius-circle);
  background-color: var(--ebmnt1-background-slider-arrow);
  color: var(--ebmnt1-icon-slider-arrow);
  transition: all 0.5s ease;
}

.ebmnt1-client-reviews__arrow:hover {
  background-color: var(--ebmnt1-background-slider-arrow-hover);
}

.ebmnt1-client-reviews__dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.ebmnt1-client-reviews__dot {
  position: relative;
  width: var(--ebmnt1-size-reviews-dot);
  height: var(--ebmnt1-size-reviews-dot);
  border-radius: var(--ebmnt1-radius-circle);
  background-color: var(--ebmnt1-background-reviews-dot);
  transition: background-color var(--ebmnt1-duration-fast) ease;
}

.ebmnt1-client-reviews__dot::before {
  content: "";
  position: absolute;
  inset: -0.375rem;
  border: 1px solid var(--ebmnt1-border-reviews-dot-active);
  border-radius: var(--ebmnt1-radius-circle);
  transform: scaleX(0);
  transition: transform var(--ebmnt1-duration-medium) ease;
}

.ebmnt1-client-reviews__dot.ebmnt1-is-active {
  background-color: var(--ebmnt1-background-reviews-dot-active);
}

.ebmnt1-client-reviews__dot.ebmnt1-is-active::before {
  transform: scaleX(1);
}

/* Dark card: the photo is a normal part of the card (no absolute positioning, nothing outside it) */
.ebmnt1-review-card {
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-start;
  gap: 1.5rem;
  width: 100%;
  padding: 1.5rem;
  border-radius: var(--ebmnt1-radius-card);
  border-start-end-radius: var(--ebmnt1-radius-review-corner);
  background-color: var(--ebmnt1-background-review-card);
  text-align: start;
}

.ebmnt1-review-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}

.ebmnt1-review-card__quote {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.125rem;
  height: 3.125rem;
  border: 1px solid var(--ebmnt1-border-review-quote);
  border-radius: var(--ebmnt1-radius-circle);
  color: var(--ebmnt1-icon-review-quote);
  font-family: var(--ebmnt1-font-family-heading);
  font-size: var(--ebmnt1-font-size-review-quote);
  font-weight: var(--ebmnt1-font-weight-extrabold);
  line-height: 1;
}

.ebmnt1-review-card__quote span {
  padding-block-start: 0.9rem;
}

.ebmnt1-review-card__name {
  margin-block-start: 0.75rem;
  color: var(--ebmnt1-text-review-name);
  font-size: var(--ebmnt1-font-size-review-name);
  font-weight: var(--ebmnt1-font-weight-bold);
  line-height: 1.4;
}

.ebmnt1-review-card__role {
  color: var(--ebmnt1-text-review-role);
  font-size: var(--ebmnt1-font-size-review-role);
  font-weight: var(--ebmnt1-font-weight-medium);
}

.ebmnt1-review-card__text {
  margin-block: 1.25rem 1.5rem;
  color: var(--ebmnt1-text-review-body);
}

.ebmnt1-review-card__stars {
  display: flex;
  align-items: center;
  gap: 0.1875rem;
}

.ebmnt1-review-card__star {
  font-size: var(--ebmnt1-size-star);
  color: var(--ebmnt1-icon-review-star);
}

/* Photo: a plain circle with an orange ring, in the card's normal flow */
.ebmnt1-review-card__photo {
  flex-shrink: 0;
  padding: 0.375rem;
  border: 2px solid var(--ebmnt1-border-review-photo);
  border-radius: var(--ebmnt1-radius-circle);
}

.ebmnt1-review-card__photo-image {
  width: 6.5rem;
  height: 6.5rem;
  border-radius: var(--ebmnt1-radius-circle);
  object-fit: cover;
}

@media (min-width: 768px) {
  .ebmnt1-review-card {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
    padding: 2rem;
  }

  .ebmnt1-review-card__photo-image {
    width: 9rem;
    height: 9rem;
  }
}

@media (min-width: 1024px) {
  .ebmnt1-review-card__photo-image {
    width: 11.25rem;
    height: 11.25rem;
  }
}

@media (min-width: 768px) {
  :root {
    --ebmnt1-size-reviews-peek: 4rem;
  }
}
