How to properly make scrollMagic and gsap animations in React?

Question

css

I want to make an animation of the header shrinking when scrolling, that is, first, when scrolling, the header shrinks to 292px, for example, and then it scrolls and the next section goes, but I don’t understand why there is a white space between the header and the section and how to fix it

Code example here