Page load weirdness

Hi there,

I create a page load with a few elements scaling up. The Z index for all elements are correct, but for some reason, one element (orange circle CTA) that should be the element on top (the circle has the highest Z index), it loads behind an image (with a lower z-index) and then after a second, it goes in front of the image as it should be from the beginning.
Anyone has any idea why this happens? When I preview the page load interaction, it works perfectly, but when I check the site, the orange CTA goes behind the image for a few seconds !

https://preview.webflow.com/preview/creativefolks-76cf47-16ea-141995917b723?utm_medium=preview_link&utm_source=designer&utm_content=creativefolks-76cf47-16ea-141995917b723&preview=2158657409e1bcc783ba805186fb6614&pageId=66e05b657fc8ba13648f0e34&locale=en&workflow=preview


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

Is it on the live Page the same? Webflows preview is sometime buggy

I did some troubleshooting, and it looks like the issue is caused by the rotations in the interaction panel. Now that you know the problem, you can focus on finding a solution! :)