<!-- ======= SPONSORS Section ======= -->
<section id="sponsors" class="section py-5">
  <div class="container" data-aos="fade-up">

    <div class="mb-3">
      <h2 class="h4 mb-1">Sponsors</h2>
      <p class="text-secondary small mb-0">Thanks to our partners</p>
    </div>

    <div class="sponsors-slider swiper init-swiper" data-aos="fade-up" data-aos-delay="150">
      <script type="application/json" class="swiper-config">
        {
          "loop": true,
          "speed": 9000,
          "autoplay": {
            "delay": 0,
            "disableOnInteraction": false,
            "pauseOnMouseEnter": true
          },
          "freeMode": {
            "enabled": true,
            "momentum": false,
            "sticky": false
          },
          "grabCursor": true,
          "allowTouchMove": true,
          "slidesPerView": 2,
          "spaceBetween": 18,
          "breakpoints": {
            "576": { "slidesPerView": 3, "spaceBetween": 18 },
            "992": { "slidesPerView": 4, "spaceBetween": 22 }
          }
        }
      </script>

      <div class="swiper-wrapper align-items-center">
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 1" title="Sponsor 1">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-1.png" alt="Sponsor 1 logo" loading="lazy">
          </a>
        </div>
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 2" title="Sponsor 2">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-2.png" alt="Sponsor 2 logo" loading="lazy">
          </a>
        </div>
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 3" title="Sponsor 3">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-3.png" alt="Sponsor 3 logo" loading="lazy">
          </a>
        </div>
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 4" title="Sponsor 4">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-4.png" alt="Sponsor 4 logo" loading="lazy">
          </a>
        </div>
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 5" title="Sponsor 5">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-5.png" alt="Sponsor 5 logo" loading="lazy">
          </a>
        </div>
        <div class="swiper-slide">
          <a class="sponsor-logo" href="#" aria-label="Sponsor 6" title="Sponsor 6">
            <img src="<?php echo DIR_WS_TEMPLATES . TEMPLATE_NAME; ?>/assets/img/sponsors/client-6.png" alt="Sponsor 6 logo" loading="lazy">
          </a>
        </div>
      </div>
    </div>

  </div>
</section>
<!-- End SPONSORS Section -->