.vp-snap-wrap {
  position: relative;
  min-width: 0;
}

.vp-track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding: .5rem .25rem 1rem;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-color: #9261aa #e9ecef;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}

.vp-track::-webkit-scrollbar {
  height: 10px;
}

.vp-track::-webkit-scrollbar-track {
  background: #e9ecef;
  border-radius: 1rem;
}

.vp-track::-webkit-scrollbar-thumb {
  background: #9261aa;
  border: 2px solid #e9ecef;
  border-radius: 1rem;
}

.vp-slide {
  flex: 0 0 calc((100% - 2rem) / 3);
  min-width: 0;
  scroll-snap-align: start;
}

.vp-slide .card img {
  display: block;
  width: 100%;
  height: auto;
}

.vp-pagelist-carousel .carousel-control-prev,
.vp-pagelist-carousel .carousel-control-next {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  padding: 0;
  border: 0;
  opacity: 1;
  transform: translateY(-50%);
}

.vp-pagelist-carousel .carousel-control-prev {
  left: -3rem;
}

.vp-pagelist-carousel .carousel-control-next {
  right: -3rem;
}

.vp-pagelist-carousel .carousel-control-prev-icon,
.vp-pagelist-carousel .carousel-control-next-icon {
  width: 2.75rem;
  height: 2.75rem;
  background-color: #9261aa;
  background-position: center;
  background-size: 60%;
  border-radius: 50%;
  box-shadow: 0 4px 14px rgb(0 0 0 / 18%);
}

.vp-pagelist-carousel button:disabled {
  opacity: .2;
  pointer-events: none;
}

@media (max-width: 991.98px) {
  .vp-slide {
    flex-basis: calc((100% - 1rem) / 2);
  }

  .vp-pagelist-carousel .carousel-control-prev {
    left: .5rem;
  }

  .vp-pagelist-carousel .carousel-control-next {
    right: .5rem;
  }
}

@media (max-width: 575.98px) {
  .vp-slide {
    flex-basis: 85%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vp-track {
    scroll-behavior: auto;
  }
}