Sticky header

Paul, you didn't understand my question. I want the header sticky to appear only when scrolling down and disappear when scrolling up.
Template Helix Ultimate. Probably it is need to add some extra code to the file main.js?

The solution is

1. To add in the main.js after string 60:

        window.onscroll = function() {
            scrollFunction();
        };
   
        function scrollFunction() {
            const header = document.getElementById("sp-header");
            // Check if scrolling up/down
            if (window.scrollY < window.scroll.previousY) {
                header.classList.remove("header-hidden"); // Show header when scrolling up
            } else {
                header.classList.add("header-hidden"); // Hide header when scrolling down
            }
            window.scroll.previousY = window.scrollY; // Store current scroll position
        }
   
    2. To add some CSS to the template:
    #sp-header{
    transition: all .5s;
    &.header-hidden {
            top: -80px;
          }
       }