document.addEventListener("DOMContentLoaded", function () {
  const elements = document.querySelectorAll(".fadeInUp");

  const observer = new IntersectionObserver(
    (entries, observer) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          entry.target.classList.add("active");
          observer.unobserve(entry.target); // Stops observing after animation triggers
        }
      });
    },
    { threshold: 0.2 } // Adjust this to trigger earlier or later
  );

  elements.forEach(el => observer.observe(el));
});

document.addEventListener("DOMContentLoaded", function () {
  const elements = document.querySelectorAll(".mobile_hover");

  const observer = new IntersectionObserver(
    (entries, observer) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          // Only apply hover effect on mobile devices
          if (window.innerWidth <= 768) {
            entry.target.classList.add("hover");
          }
          observer.unobserve(entry.target); // Stops observing after animation triggers
        }
      });
    },
    { threshold: 0.2 } // Adjust to trigger earlier or later
  );

  elements.forEach(el => observer.observe(el));
});

document.addEventListener("DOMContentLoaded", function () {
  const lazyIframes = document.querySelectorAll('iframe[loading="eager"]');
  lazyIframes.forEach(iframe => {
    iframe.setAttribute('loading', 'eager');
    const src = iframe.getAttribute('data-src') || iframe.src;
    iframe.src = src; // force load
  });
});

<div id="custom-loading-screen" style="position:fixed;top:0;left:0;width:100%;height:100%;background:white;z-index:9999;display:flex;align-items:center;justify-content:center;">
  <p>Loading...</p>
</div>

document.addEventListener("DOMContentLoaded", function () { 
  const elements = document.querySelectorAll(".locationHeading");

  // Clear out any placeholder immediately
  elements.forEach(el => el.textContent = "");

  fetch("https://ipapi.co/json/")
    .then(response => response.json())
    .then(data => {
      let locationText = data.region || data.country_name || "your area"; 
      elements.forEach(el => el.textContent = `Based in ${locationText}`);
    })
    .catch(() => {
      elements.forEach(el => el.textContent = "Based near you");
    });
});