<!-- Footer -->
    <footer class="footer bg-dark text-white py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-4 mb-4">
                    <h4>Popular Computer Institute</h4>
                    <p>Providing quality education and training in computer science and technology since 2005.</p>
                    <div class="social-icons mt-3 justify-content-start">
                        <a href="#" class=" me-3 text-decoration-none"><i class="fab fa-facebook-f"></i></a>
                        <a href="#" class=" me-3 text-decoration-none"><i class="fab fa-twitter"></i></a>
                        <a href="#" class=" me-3 text-decoration-none"><i class="fab fa-instagram"></i></a>
                        <a href="#" class=" text-decoration-none"><i class="fab fa-youtube"></i></a>
                    </div>
                </div>
                <div class="col-md-2 mb-4">
                    <h5>Quick Links</h5>
                    <ul class="list-unstyled ">
                        <li><a href="index.php" class="text-white text-decoration-none">Home</a></li>
                        <li><a href="about.php" class="text-white text-decoration-none">About Us</a></li>
                        <li><a href="courses.php" class="text-white text-decoration-none">Courses</a></li>
                        <li><a href="contact.php" class="text-white text-decoration-none">Contact</a></li>
                    </ul>
                </div>
                <div class="col-md-3 mb-4">
                    <h5>Popular Courses</h5>
                    <ul class="list-unstyled">
                        <li><a href="#" class="text-white text-decoration-none">Computer Basics</a></li>
                        <li><a href="#" class="text-white text-decoration-none">Web Development</a></li>
                        <li><a href="#" class="text-white text-decoration-none">Office Applications</a></li>
                        <li><a href="#" class="text-white text-decoration-none">Graphic Design</a></li>
                    </ul>
                </div>
                <div class="col-md-3 mb-4">
                    <h5>Contact Info</h5>
                    <address>
                        <p><i class="fas fa-map-marker-alt me-2"></i> Bhimpura No.1, Ballia</p>
                        <p><i class="fas fa-phone-alt me-2"></i> +91 1234567890</p>
                        <p><i class="fas fa-envelope me-2"></i> [email protected]</p>
                    </address>
                </div>
            </div>
            <hr class="my-4">
            <div class="row">
                <div class="col-md-6">
                    <p class="mb-0">&copy; <?php echo date('Y'); ?> Popular Computer Institute. All rights reserved.</p>
                </div>
                <div class="col-md-6 text-md-end">
                    <p class="mb-0">Designed with <i class="fas fa-heart text-danger"></i> by Popular Computer</p>
                </div>
            </div>
             <!-- Developer Information with contact  details -->
                
             
        </div>
    </footer>
    
    <!-- Bootstrap JS Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
    
    <!-- Modal backdrop fix -->
    <script src="assets/js/modal-fix.js"></script>
    
    <!-- jQuery (for added compatibility) -->
    <script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>

    <!-- Animation Libraries -->
    <script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>

    <!-- Custom JS -->
    <script src="assets/js/homepage.js"></script>
    
    <script>
        // Initialize WOW.js
        new WOW().init();
        
        // Initialize AOS
        if (typeof AOS !== 'undefined') {
            AOS.init({
                duration: 1000,
                once: true
            });
        }
    </script>

    <!-- Initialize hero slider if it exists on the page -->
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Check if hero slider exists on this page
            if (document.querySelector('.hero-slider')) {
                // Initialization is handled in the hero_slider.php file
                console.log('Hero slider detected and initialized');
            }
        });
    </script>
</body>
</html>