.horizontal-section {
   position: relative;
   padding: 40px 80px;
   overflow: hidden;
}

.product-slider {
   width: 100%;
   overflow: hidden;
}

.card-link {
   display: block;
   text-decoration: none;
   color: inherit;
}

.card {
   width: 100%;
   height: 350px;
   border-radius: 18px;
   overflow: hidden;
   position: relative;
   background: #fcfcfc;
   padding: 0;
   transition: transform 0.4s ease;
}

.card:hover {
   transform: translateY(-8px);
}

.card img {
   width: 100%;
   height: 100%;
   object-fit: contain;
   object-position: center;
   transition: transform 0.4s ease;
}

.card:hover img {
   transform: scale(1.05);
}

.card-title {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   margin: 0;
   padding: 15px;
   font-size: 14px;
   color: #fff;
   background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
}

/* ================= SLIDER BUTTONS ================= */

.slider-prev,
.slider-next {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   width: 50px;
   height: 50px;
   border: 0;
   border-radius: 50%;
   background: #5b342c;
   color: #fff;
   cursor: pointer;
   z-index: 10;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease;
}

.slider-prev:hover,
.slider-next:hover {
   transform: translateY(-50%) scale(1.08);
}

.slider-prev {
   left: 15px;
}

.slider-next {
   right: 15px;
}

/* DISABLED BUTTON */

.slider-prev.swiper-button-disabled,
.slider-next.swiper-button-disabled {
   opacity: 0.35;
   cursor: not-allowed;
   pointer-events: none;
}

/* ================= TABLET ================= */

@media (max-width: 991px) {
   .horizontal-section {
      padding: 30px 20px;
   }

   .card {
      height: 300px;
   }

   .slider-prev,
   .slider-next {
      display: none;
   }
}

/* ================= MOBILE ================= */

@media (max-width: 576px) {
   .horizontal-section {
      padding: 15px;
   }

   .card {
      height: 260px;
   }

   .card-title {
      font-size: 13px;
   }
}

/* ================= LARGE SCREENS ================= */

@media (min-width: 1600px) {
   .horizontal-section {
      padding: 40px 100px;
   }

   .card {
      height: 420px;
   }

   .slider-prev {
      left: 25px;
   }

   .slider-next {
      right: 25px;
   }
}