Button bg color incorrect (initial/none state)

I just created a simple interaction animating a button’s background state. The button starts off with a pale turquoise color (the same color that’s set on its “none” state), and it’s also selected as the initial state in the hover interaction.

The hover animation has an in and out animation. The “in” animation animates the button bg color to be more saturated, and the “out” state the other way around. Although, when I preview the staging page, the button’s initial view (the “none” state shows the saturated color and not it’s original pale turquoise color. Although, once hovered it works as it should, but I would like the initial state to be the pale turquoise

Any help is greatly appreciated. The button in question is the first button shown, on the left, just below the hero section. It says “Join the waitlist.” It’s currently set to an opacity of 0%, so best viewed on the staging page. Thanks in advance!

Here is my site Read-Only: [LINK
(how to share your site Read-Only link)

Figured it out. The fix was to uncheck the “initial state” checkboxes in the interaction animation settings