I am creating some product cards that start out with the image as the card. When you hover over them, the image fades to a gradient of the background color and shows the Name, Price and Shop Now button.
Problem I am having is the first time you hover over it, it is very fast and jarring. Then every subsequent time you hover over it, the easing that I added to the animation takes place and its very fluid. Any idea why the first hover is happening so fast and not taking any of the easing into account only on the first hover.
Here is my site Read-Only: [LINK](Webflow - KanoraSkinCare)