:root {
  /* Desktop */
  --swiper-image-ratio: 33.3%; /* height relative to width */
  --swiper-width: 60%; /* width of each slide */
  --swiper-inactive-scale: 0.85;

  /* Mobile / Tablet */
  --swiper-mobile-width: 90%;
  --swiper-mobile-inactive-scale: 0.95;
}
.swiper-wrapper{    padding: 0 0 60px;}
.swiper-wrapper h3{
      font-size: 36px;
    line-height: 40px;
}
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

/* Default slides */
.swiper-slide {
  width: var(--swiper-width);
  transform: scale(var(--swiper-inactive-scale));
  opacity: 0.4;
  transition: all 0.3s ease;
}

.swiper-slide.swiper-slide-active {
  transform: scale(1);
  opacity: 1;
}
.fade-edges {
  position: relative;
}

.fade-edges::before,
.fade-edges::after {
  content: "";
  position: absolute;
  top: 0;
  width: 180px;
  height: 100%;
  z-index: 10;
  pointer-events: none;
}

.fade-edges::before {
  left: 0;
  background: linear-gradient(to right, #fff, transparent);
}

.fade-edges::after {
  right: 0;
  background: linear-gradient(to left, #fff, transparent);
}

.swiper-image .text {
   background: #fff;
  color: #2A2A2A;
  padding: 1rem;
  text-align: center;
  border-radius: 28px;
  padding: 50px 90px;;
  height: 350px;
  border: 1px solid #E0C6AA;
}

/* Pagination dots */
.swiper-pagination {
  text-align: center;
  margin-top: 15px;
}

.swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background:#C4A686;
  border-radius: 50%;
  margin: 0 4px;
  cursor: pointer;
  transition: background 0.3s;
}

.swiper-pagination-bullet-active {
  background: #C4A686;
}

/* Responsive: Tablet / Mobile */
@media (max-width: 1024px) {
  .swiper-slide {
    width: 70%;
    transform: scale(0.9);
  }

  .swiper-slide.swiper-slide-active {
    transform: scale(1);
  }
}

@media (max-width: 768px) {
  .swiper-slide {
     width: 54%;
    transform: scale(var(--swiper-mobile-inactive-scale));
  }

  .swiper-slide.swiper-slide-active {
    transform: scale(1);
  }
}


@media (max-width: 768px) {
  .swiper-slide {
    flex-shrink: 0;
  }
}