fixedunderrefactor

includes/layout/head.php

@@ -11,6 +11,12 @@
             visibility: hidden !important;
             transition: none !important; /* No transition on first load */
         }
+
+        /* Ensure header is transparent sitewide when not sticky */
+        .header-hide-until-scroll:not(.sticky-container-active) {
+            background-color: transparent !important;
+            box-shadow: none !important;
+        }
     </style>
     <link crossorigin data-rocket-preconnect href="https://fonts.googleapis.com" rel="preconnect">
     <link crossorigin data-rocket-preconnect href="https://8ded8880.delivery.rocketcdn.me" rel="preconnect">

includes/layout/header.php

@@ -592,3 +592,23 @@
                 </div>
             </div>
         </header>
+        <script>
+            (function($) {
+                $(function() {
+                    // Header scroll visibility logic - Globalized
+                    const $header = $('.header-hide-until-scroll');
+                    
+                    // Show header once the page has started to load to avoid flicker
+                    // but maintain the hide-until-scroll behavior if needed
+                    $header.addClass('header-visible-scrolled');
+
+                    $(window).on('scroll', function() {
+                        const scrollTop = $(this).scrollTop();
+                        // Maintain visibility after scroll
+                        if (scrollTop >= 0) {
+                            $header.addClass('header-visible-scrolled');
+                        }
+                    });
+                });
+            })(jQuery);
+        </script>

index.php

@@ -525,24 +525,7 @@
     <script>
         (function($) {
             $(window).on('load', function() {
-                // Header scroll visibility
+                // Apply shrink to sections after hero (Homepage specific)
-                const $header = $('.header-hide-until-scroll');
-
-                // Show header once the page has fully loaded to avoid the initial flicker
-                // but keep it visible even in the landing section.
-                $header.addClass('header-visible-scrolled');
-
-                $(window).scroll(function() {
-                    const scrollTop = $(this).scrollTop();
-
-                    // Keep it visible throughout, but we can add logic if we want 
-                    // a specific effect. Since the user wants it visible in landing too:
-                    if (scrollTop >= 0) {
-                        $header.addClass('header-visible-scrolled');
-                    }
-                });
-
-                // Apply shrink to sections after hero
                 $('.elementor-61 > .e-parent').not(':first').addClass('section-shrink');
             });
         })(jQuery);