Global Header with extra White Space above in the mobile view

Hi all,

I've created a global fullwidth header that includes a fullwidth menu on my staging website. While everything appears correctly on the laptop view, there's an unexpected blank space above the header when viewing the site on mobile devices and scrolling down. This issue persists even when the header is not set to sticky and occurs across all pages. I've ensured that all padding and margin settings are set to 0px and have not added any custom CSS. Despite clearing caches and disabling plugins, the problem remains. Additionally, inspecting the elements doesn't reveal any overlapping sections or hidden elements causing the gap. Has anyone encountered a similar issue or can provide guidance on resolving this?