Accordion shevron doesn't rotate in a live website but it works just as I want it to in the animation preview mode

Hi there!

I created an accordion just as in webflow video tutorial and added a shevron there which is supposed to rotate to 90 degrees when the accordion is open and back to 0 degrees when it is closed.

The animation works just as I want it to in the animation preview mode. However it doesn’t work in a website preview mode as well as in a live website.

Please, help me to figure it out. Thanks!


Here is my public share link: https://custom-accordion-animation.webflow.io/

https://preview.webflow.com/preview/custom-accordion-animation?utm_medium=preview_link&utm_source=designer&utm_content=custom-accordion-animation&preview=93a65d705c7c5cbf91ae892de0893e30&mode=preview

The “accordion-item-trigger” first click triggers two opposing animation: accordion open and accordion close. Delete the close animation.

You can see on the right.