How do I create a sticky section

I want the very top section of my site to be sticky whilst the user scrolls through the interaction I’ve created (the building image getting smaller + text coming out from either side). Once the interaction is finished, the user should be able to continue scrolling to the next section.

I’ve watched multiple videos and tried adding custom code but I just can’t get it to work. Here’s what it looks like at the moment: (9)

Any help greatly appreciated.

Here is my public share link: [LINK][1]

Update: I’ve managed to make the image sticky but it’s only working in preview mode in designer, it isn’t sticky when I publish it.

Also, it’s still scrolling further than I want it too. I want it to stay within the first fold of the site, so the user should still be able to see the nav bar when scrolling through the text + image interaction. Only when the interaction is finished should it scroll past the fold.

Has anyone got an idea of where I’m going wrong? (10)