Add scroll interaction to an element already affected by page load and button trigger

Hi, I have an open and close button that reveals a sub navigation for this page:

a tiny bit of history. I want the subnav to be open when the user loads the page but if it’s normal position is open then when link blocks are scrolled into that area after it’s closed they are not clickable. I resolved this by setting a page load animation to bring it into view and all was well until I wanted to add an on-scroll interaction.

I want the sub menu to come into view if closed when the user scrolls back up towards the top and to hide when the user scrolls down. I tried duplicating and reusing the same interactions I set for open and close. The open on scroll up worked but two issues happened. I had to click twice on the close button if I wanted it to close after the scroll up opened it and the scroll down would only trigger the opacity change in the interaction but not the move. Any help is much appreciated. THANKS.

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