script.js

// Watches which section is on screen and highlights the right nav link

var sections = document.querySelectorAll('section[id]');
var navLinks = document.querySelectorAll('.nav-links a');

window.addEventListener('scroll', function () {

    var scrollPosition = window.scrollY + 120; // 120px offset for the sticky navbar

    sections.forEach(function (section) {
        var sectionTop = section.offsetTop;
        var sectionHeight = section.offsetHeight;
        var sectionId = section.getAttribute('id');

        // map section ids to nav hrefs
        // "home" and "about" both live in the hero/about area → highlight "Home"
        var navHref = '#' + sectionId;
        if (sectionId === 'about') navHref = '#home'; // about is part of home scroll area

        if (scrollPosition >= sectionTop && scrollPosition < sectionTop + sectionHeight) {
            navLinks.forEach(function (link) {
                link.classList.remove('active');
                if (link.getAttribute('href') === navHref) {
                    link.classList.add('active');
                }
            });
        }
    });

});