.reviews-banner-section {
  padding-top: 6.5rem;
  padding-bottom: 5rem;
  background: linear-gradient(
    180deg,
    rgba(var(--bs-primary-rgb), 0.08) 0%,
    rgba(var(--bs-primary-rgb), 0.02) 100%
  );
}

.reviews-banner-inner {
  width: 100%;
  --reviews-slide-width-desktop: clamp(21rem, 30vw, 26rem);
  --reviews-slide-width-tablet: clamp(20rem, 44vw, 24rem);
  --reviews-slide-width-mobile: min(80vw, 23rem);
  --reviews-slide-height-desktop: 37rem;
  --reviews-slide-height-tablet: 35rem;
  --reviews-slide-height-mobile: 31rem;
}

.reviews-banner-heading {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.reviews-banner-intro {
  max-width: 42rem;
  margin: 0 auto;
}

.reviews-banner-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1.5rem 1rem 0.75rem;
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--bs-primary-rgb), 0.45)
    rgba(var(--bs-primary-rgb), 0.12);
}

.reviews-banner-track::-webkit-scrollbar {
  height: 0.7rem;
}

.reviews-banner-track::-webkit-scrollbar-track {
  background: rgba(var(--bs-primary-rgb), 0.1);
  border-radius: 999px;
}

.reviews-banner-track::-webkit-scrollbar-thumb {
  background: rgba(var(--bs-primary-rgb), 0.42);
  border-radius: 999px;
}

.reviews-banner-dots {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-top: 0.85rem;
}

.reviews-banner-dot {
  width: 0.65rem;
  height: 0.65rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(var(--bs-primary-rgb), 0.22);
  transition:
    transform 0.18s ease,
    background-color 0.18s ease;
}

.reviews-banner-dot.is-active {
  background: var(--bs-primary);
  transform: scale(1.15);
}

.reviews-banner-slide {
  flex: 0 0 var(--reviews-slide-width-desktop);
  width: var(--reviews-slide-width-desktop);
  max-width: var(--reviews-slide-width-desktop);
  height: var(--reviews-slide-height-desktop);
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

@media (max-width: 991px) {
  .reviews-banner-slide {
    flex-basis: var(--reviews-slide-width-tablet);
    width: var(--reviews-slide-width-tablet);
    max-width: var(--reviews-slide-width-tablet);
    height: var(--reviews-slide-height-tablet);
  }
}

@media (max-width: 767px) {
  .reviews-banner-section {
    padding-top: 5rem;
    padding-bottom: 4rem;
  }

  .reviews-banner-inner {
    --reviews-mobile-slide-width: var(--reviews-slide-width-mobile);
    --reviews-mobile-side-pad: calc(
      (100% - var(--reviews-mobile-slide-width)) / 2
    );
  }

  .reviews-banner-heading {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .reviews-banner-track {
    gap: 0.85rem;
    padding: 1.25rem var(--reviews-mobile-side-pad) 0.35rem;
    margin-top: 1rem;
    scroll-padding-left: var(--reviews-mobile-side-pad);
    scroll-padding-right: var(--reviews-mobile-side-pad);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .reviews-banner-track::-webkit-scrollbar {
    display: none;
  }

  .reviews-banner-slide {
    flex: 0 0 var(--reviews-mobile-slide-width);
    width: var(--reviews-mobile-slide-width);
    max-width: var(--reviews-mobile-slide-width);
    height: var(--reviews-slide-height-mobile);
  }

  .reviews-banner-dots {
    display: flex;
  }
}
