Interaction help while scrolling!

Hello Webflow Community,

I’m running into a bit of a snag with my blog landing page. It’s about the header behaviour during scrolling interactions. The alignment of the header text seems to be getting thrown off by the length of the heading.

When the heading has more than 8-9 words, the header centres itself as I scroll down. But with shorter headings, like less than 6 words, the header just stays at the top and doesn’t centre. This inconsistency is really throwing me off.

Here’s a ‘share-only’ link to my project: Webflow - Kaj's a-test site
Please check it out in preview mode to see what I mean.

Does anyone know how to keep the header text consistently centred, no matter the heading length? I’d really like the header to behave the same way all the time for a smoother look.

Any help or tips on this would be amazing. Thanks a ton in advance!

Here is my public share link: Webflow - Kaj's a-test site