/* EVATECH Video Reviews — compact mobile / 5-up desktop
   Load AFTER home-v4.css. Scoped to the existing .video-reviews section only. */

.video-reviews {
  overflow: hidden;
}

.video-reviews__swiper {
  overflow: visible;
  padding-bottom: 18px;
}

.video-reviews__slide {
  height: auto;
}

.video-reviews__card {
  width: 100%;
  aspect-ratio: 9 / 16;
  border-radius: 18px;
  overflow: hidden;
}

.video-reviews__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Mobile: compact cards. The JS patch shows ~2.15 cards at once. */
@media (max-width: 539px) {
  .video-reviews {
    padding-top: 34px;
    padding-bottom: 34px;
  }

  .video-reviews__swiper {
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 14px;
  }

  .video-reviews__card {
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.10);
  }

  /* Keep navigation arrows out of the video area on phones. */
  .video-reviews__prev,
  .video-reviews__next,
  .video-reviews .swiper-button-prev,
  .video-reviews .swiper-button-next {
    display: none !important;
  }

  .video-reviews .swiper-pagination,
  .video-reviews__pagination {
    margin-top: 12px;
  }
}

/* Small tablet: still compact, 3 cards. */
@media (min-width: 540px) and (max-width: 767px) {
  .video-reviews__card {
    border-radius: 17px;
  }
}

/* Desktop: five equal videos immediately visible. */
@media (min-width: 1024px) {
  .video-reviews__swiper {
    overflow: hidden;
  }

  .video-reviews__card {
    border-radius: 18px;
  }
}
