@media (max-width: 768px) {

  /* Wrapper of the image section */
  .benefits-section,
  .benefits-image,
  .skincare-banner {
    width: 100%;
    overflow: hidden;
  }

  /* The image itself */
  .benefits-section img,
  .benefits-image img,
  .skincare-banner img {
    width: 100%;
    height: auto;        /* ✅ KEY FIX */
    max-height: 60vh;    /* control mobile height */
    object-fit: contain;/* show full image */
    display: block;
  }



.carousel {
  background: #fff;
}

.carousel-cell {
  width: 170vh;
  height: 50vh;
  margin-right: 20px;
  background: #eff1f3;
  counter-increment: gallery-cell;
}

/* cell number */
.carousel-cell:before {
  display: block;
  text-align: center;
  /* content: counter(gallery-cell); */
  line-height: 200px;
  font-size: 80px;
  color: white;
}
/* Image MUST cover fully */
.carousel-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* 🔥 MOST IMPORTANT */
  object-position: right center; /* keeps subject on right */
  display: block;
}
/* VIDEO FULL COVER */
.carousel-cell video {
  width: 100%;
  height: 100%;
  object-fit: cover;               /* 🔥 KEY */
  object-position: right center;   /* subject stays right */
  display: block;
}