<!-- Footer Start -->
<footer class="main-footer">
    <div class="container">


        <div class="row">
            <div class="col-md-12">
                <!-- Mega Footer Start -->
                <div class="mega-footer">
                    <div class="row justify-content-center text-center">
                        <div class="col-lg-12 col-12">
                            <!-- Footer About Start -->
                            <div class="footer-about">
                                <!-- Footer Logo Start -->
                                <div class="footer-logo">
                                    <img src="images/logo-1.png" alt="">
                                </div>
                                <!-- Footer Logo End -->

                                <div class="footer-menu">
                                    <ul class="d-md-flex quick-links  justify-content-center">
                                        <li><a href="#">Home</a></li>
                                        <li><a href="#">About Us</a></li>
                                        <li><a href="#">Services</a></li>
                                        <li><a href="#">Portfolio</a></li>
                                        <li><a href="#">Contact Us</a></li>
                                    </ul>
                                </div>

                                <!-- Footer Social Links Start -->
                                <div class="footer-social-links pt-3">
                                    <ul class="justify-content-center">
                                        <li><a href="#"><i class="fa-brands fa-facebook-f"></i></a></li>
                                        <li><a href="#"><i class="fa-brands fa-instagram"></i></a></li>
                                        <li><a href="#"><i class="fa-brands fa-linkedin-in"></i></a></li>
                                    </ul>
                                </div>
                                <!-- Footer Social Links End -->
                            </div>
                            <!-- Footer About End -->
                        </div>


                    </div>
                </div>
                <!-- Mega Footer End -->
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <!-- Copyright Footer Start -->
                <div class="footer-copyrights">
                    <div class="row align-items-center justify-content-center">
                        <div class="col-md-12">
                            <!-- Copyright Content Start -->
                            <div class="footer-copyright text-center">
                                <p>Copyright &copy; 2025 Sukirana Events. All Rights Reserved.</p>
                            </div>
                            <!-- Copyright Content End -->
                        </div>


                    </div>
                </div>
                <!-- Copyright Footer End -->
            </div>
        </div>
    </div>
</footer>
<!-- Footer End -->

<!-- Jquery Library File -->
<script src="js/jquery-3.7.1.min.js"></script>
<!-- Bootstrap js file -->
<script src="js/bootstrap.min.js"></script>
<!-- Validator js file -->
<script src="js/validator.min.js"></script>
<!-- SlickNav js file -->
<script src="js/jquery.slicknav.js"></script>
<!-- Swiper js file -->
<script src="js/swiper-bundle.min.js"></script>
<!-- Counter js file -->
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.counterup.min.js"></script>
<!-- Magnific js file -->
<script src="js/jquery.magnific-popup.min.js"></script>
<!-- SmoothScroll -->
<script src="js/SmoothScroll.js"></script>
<!-- Parallax js -->
<script src="js/parallaxie.js"></script>
<!-- MagicCursor js file -->
<script src="js/gsap.min.js"></script>
<script src="js/magiccursor.js"></script>
<!-- Text Effect js file -->
<script src="js/splitType.js"></script>
<script src="js/ScrollTrigger.min.js"></script>
<!-- YTPlayer js file -->
<script src="js/jquery.mb.YTPlayer.min.js"></script>
<!-- Wow js file -->
<script src="js/wow.js"></script>
<!-- Main Custom js file -->
<script src="js/function.js"></script>

<script>
    const words = ["Crafting ", "Unforgettable ", "UniExperiences,"];
    let index = 0;
    const span = document.getElementById("changing-word");

    setInterval(() => {
        span.classList.add("fade-out");
        setTimeout(() => {
            index = (index + 1) % words.length;
            span.textContent = words[index];
            span.classList.remove("fade-out");
        }, 500);
    }, 2500); // Change every 2.5 seconds
</script>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        const target = document.querySelector(".scroll-img");

        const observer = new IntersectionObserver((entries) => {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    target.classList.add("animate__animated", "animate__swing");
                } else {
                    target.classList.remove("animate__swing");
                }
            });
        }, {
            threshold: 0.5
        });

        observer.observe(document.getElementById("animeImage"));
    });
</script>

<script>
    document.addEventListener('DOMContentLoaded', () => {
        const counters = document.querySelectorAll('.counter-number');
        const duration = 3000; // total animation duration in ms
        let startTimestamp = null;
        let counted = false;

        function step(timestamp) {
            if (!startTimestamp) startTimestamp = timestamp;
            const progress = timestamp - startTimestamp;
            const progressRatio = Math.min(progress / duration, 1);

            counters.forEach(counter => {
                const target = +counter.getAttribute('data-target');
                counter.innerText = Math.floor(progressRatio * target);
            });

            if (progress < duration) {
                window.requestAnimationFrame(step);
            } else {
                // Ensure final numbers are exact
                counters.forEach(counter => {
                    counter.innerText = counter.getAttribute('data-target');
                });
            }
        }

        function isInViewport(element) {
            const rect = element.getBoundingClientRect();
            return (
                rect.top <= (window.innerHeight || document.documentElement.clientHeight) &&
                rect.bottom >= 0
            );
        }

        function runCounter() {
            if (!counted && isInViewport(counters[0])) {
                counted = true;
                window.requestAnimationFrame(step);
                window.removeEventListener('scroll', runCounter);
            }
        }

        window.addEventListener('scroll', runCounter);
        runCounter(); // initial check
    });
</script>

</body>

</html>