Mobile Menu Hamburger Disappearing

Hello! I was wondering if someone would be able to guide me a bit in the right direction on how to animate my mobile menu in the most efficient way. On my home screen for tablet and below, I am wanting to have a transparent nav bar that becomes opaque as the page is scrolled down. I think I got the basic gist right using two nav bars and showing/hiding each of them, but now my hamburger menu buttons disappear whenever they are clicked and I cannot figure out why. (Perhaps two nav bars isn’t the most efficient way of designing this effect – I am open to any feedback!)

Am I missing a super basic z-index or something inside my interactions where the menu button is hiding itself? Thanks a million!

See any of my other pages other than the home page for an example of when the menu sort of works.

Here is my public share link:
(how to access public share link)

hi @ksammm using two navbars isn’t the best way to achieve this effect. Here is a link to video tutorial that may give you an idea to create navbar the way you need but there is more resources out there.