   document.getElementById('search-bar').focus();
        };
    </script>

<!-- making the about section clealy visible when "about" or "home" is clicked -->
<script>
    function scrollToSection(event, sectionId) {
  event.preventDefault();
  const section = document.getElementById(sectionId);
  const navbarHeight = 85; // Fixed navbar height

  window.scrollTo({
    top: section.offsetTop - navbarHeight,
    behavior: 'smooth'
  });
}
</script>
<script>
    // Coordinates for the cursor