/* Elementor's JS never fires its widget-ready hooks in this static mirror, so Owl
   Carousel never initializes and the hero slider stays "display:none" (its default
   before JS runs) — the transparent header then overlaps whatever comes next on the
   page. Show it as a plain static hero (first slide only) without needing the JS. */
.ts-slider-area.owl-carousel {
  display: block !important;
}
.ts-slider-area.owl-carousel > .slider-items {
  display: none;
}
.ts-slider-area.owl-carousel > .slider-items:first-child {
  display: block;
}

/* Same cause, the homepage testimonials ("Clients Love"): the live site shows 2
   cards side by side via JS-built owl-stage columns. Fake that with a 2-col flex
   layout instead — no working pagination without JS, but the look matches. */
.testimonial-standard.owl-carousel {
  display: flex !important;
  flex-wrap: wrap;
  gap: 20px;
}
.testimonial-standard.owl-carousel > .testimonial-item-single {
  flex: 1 1 calc(50% - 20px);
  min-width: 280px;
}

/* The About page's testimonial-slide widget is a single narrow (max-width:440px)
   quote box, one at a time — show just the first like the hero. */
.testimonial-slide.owl-carousel {
  display: block !important;
}
.testimonial-slide.owl-carousel > .testimonial-item {
  display: none;
}
.testimonial-slide.owl-carousel > .testimonial-item:first-child {
  display: block;
}

/* Client-logo strip (Swiper, not Owl): without JS each .swiper-slide is width:100%
   per its own CSS, so the logos stack full-width instead of sitting in a row. */
.elementor-image-carousel-wrapper.swiper-container .swiper-wrapper {
  justify-content: center;
  align-items: center;
  gap: 30px;
}
.elementor-image-carousel-wrapper.swiper-container .swiper-slide {
  width: 150px !important;
  height: auto !important;
  flex-shrink: 1;
}