Interaction performing differently on first click

I have set up an animation that is working exactly as intended except for on the very first time it is run. The animation is supposed to set a visible elements opacity to 0 and the hide it. It should then set another element to visible and animate it’s opacity from 0 to 100. This works perfectly fine as intended expect for the very first time the animation is run, when it skips the opacity animation from 0-100 for the second element.


https://preview.webflow.com/preview/coenraads-stunning-site?utm_medium=preview_link&utm_source=designer&utm_content=coenraads-stunning-site&preview=5d55a608536ba188245e4ca6047b414e&pageId=647c55b630e6e456c0d5b6f8&workflow=preview