    <!-- Footer Section -->
    @php
      $footer = $sections['footer'] ?? null;
      $footerLicenses = $sections['licenses'] ?? null;
      $footerFeatures = $sections['features'] ?? null;
      $footerContact = $sections['contact'] ?? null;
      $footerContactMeta = $footerContact->meta ?? [];
      $footerTeam = $sections['team'] ?? null;
    @endphp
    <footer class="site-footer">
      <div class="container">
        <div class="row footer-columns">
          <!-- Column 1: Logo, short description, cert logos, social -->
          <div class="col-12 col-sm-6 col-md-3">
            <img class="footer-logo" src="{{ $theme?->logoUrl() ?? asset('dsi/img/dsi2.png') }}" alt="">
            <p class="footer-desc">{{ $footer?->subtitle }}</p>

            @if (($footerLicenses->items ?? collect())->isNotEmpty())
              <div class="footer-cert-logos">
                @foreach ($footerLicenses->items as $item)
                  @if ($item->imageUrl())
                    <img src="{{ $item->imageUrl() }}" alt="{{ $item->title }}" title="{{ $item->title }}">
                  @endif
                @endforeach
              </div>
            @endif

            @if (($footerContact->items ?? collect())->isNotEmpty())
              <div class="footer-social">
                @foreach ($footerContact->items as $item)
                  <a href="{{ $item->link ?? '#' }}" target="_blank" rel="noopener noreferrer" title="{{ $item->title }}">
                    <i class="{{ $item->icon }}"></i>
                  </a>
                @endforeach
              </div>
            @endif
          </div>

          <!-- Column 2: Services list -->
          <div class="col-12 col-sm-6 col-md-3">
            <h5 class="footer-heading">{{ __('Services') }}</h5>
            <ul class="footer-list">
              @foreach ($footerFeatures->items ?? [] as $item)
                <li><a href="{{ $item->link ?: route('home').'#features' }}" @if ($item->link) target="_blank" rel="noopener noreferrer" @endif>{{ $item->title }}</a></li>
              @endforeach
            </ul>
          </div>

          <!-- Column 3: Contact info -->
          <div class="col-12 col-sm-6 col-md-3">
            <h5 class="footer-heading">{{ __('Contact') }}</h5>
            <ul class="footer-list footer-contact-list">
              @if ($footerContact?->content)
                <li><i class="fa fa-map-marker-alt"></i> {{ $footerContact->content }}</li>
              @endif
              @if (!empty($footerContactMeta['phone']))
                <li><i class="fa fa-phone"></i> {{ $footerContactMeta['phone'] }}</li>
              @endif
              @if (!empty($footerContactMeta['email']))
                <li><i class="fa fa-envelope"></i> {{ $footerContactMeta['email'] }}</li>
              @endif
            </ul>
          </div>

          <!-- Column 4: Map -->
          <div class="col-12 col-sm-6 col-md-3">
            <h5 class="footer-heading">{{ __('Location') }}</h5>
            @if ($footerTeam?->content)
              <div class="footer-map">
                <iframe src="{{ $footerTeam->content }}" frameborder="0" style="border:0" allowfullscreen loading="lazy"></iframe>
              </div>
            @endif
          </div>
        </div>

        <div class="footer-bottom row align-items-center">
          <div class="col-12 col-md-6 footer-copyright">
            <p>{{ $footer?->content }}</p>
          </div>
          <div class="col-12 col-md-6 footer-legal-links">
            @foreach ($footer->items ?? [] as $item)
              @php
                $legalHref = str_starts_with((string) $item->link, '@')
                  ? route(substr($item->link, 1))
                  : ($item->link ?: '#');
              @endphp
              <a href="{{ $legalHref }}">{{ $item->title }}</a>
            @endforeach
          </div>
        </div>
      </div>
    </footer>
    <!-- Footer Section End -->
    <!-- Go To Top Link -->
    <a href="#" class="back-to-top">
      <i class="lnr lnr-arrow-up"></i>
    </a>

    <div id="loader">
      <div class="spinner">
        <div class="double-bounce1"></div>
        <div class="double-bounce2"></div>
      </div>
    </div>

    <!-- jQuery first, then Tether, then Bootstrap JS. -->
    <script src="{{ asset('dsi/js/jquery-min.js') }}"></script>
    <script src="{{ asset('dsi/js/popper.min.js') }}"></script>
    <script src="{{ asset('dsi/js/bootstrap.min.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.mixitup.js') }}"></script>
    <script src="{{ asset('dsi/js/nivo-lightbox.js') }}"></script>
    <script src="{{ asset('dsi/js/owl.carousel.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.nav.js') }}"></script>
    <script src="{{ asset('dsi/js/scrolling-nav.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.easing.min.js') }}"></script>
    <!-- smoothscroll.js removed: it hijacked every mouse-wheel event (Chrome
         only) and replaced native OS smooth scrolling with a hand-rolled
         requestAnimationFrame animation (animationTime overridden to 1800ms
         here) — that was the actual cause of the scroll stutter, not WOW.js.
         Native wheel/touchpad scrolling is smooth on its own; no polyfill needed. -->
    <script src="{{ asset('dsi/js/jquery.slicknav.js') }}"></script>
    <script src="{{ asset('dsi/js/wow.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.vide.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.counterup.min.js') }}"></script>
    <script src="{{ asset('dsi/js/jquery.magnific-popup.min.js') }}"></script>
    <script src="{{ asset('dsi/js/waypoints.min.js') }}"></script>
    <script src="{{ asset('dsi/js/form-validator.min.js') }}"></script>
    <script src="{{ asset('dsi/js/contact-form-script.js') }}"></script>
    <script src="{{ asset('dsi/js/main.js') }}"></script>
