My application (2 pages):

• Page 1 contains a list of cards. Clicking on a card redirects to Page 2 and triggers layoutId animations.
• Page 2 contains the details of the list item. Clicking on overlay or back button redirects to Page 1 and triggers both layoutId animations AND enter animation (both animations overlap - that's the issue).

Demo link

I would like to know if it was possible to have a better control with the different types of framer-motion animations.

I would like to keep the enter animation when I arrive on Page 1 except if there is a layoutId animation (For example, when I go to Page 1 from Page 2, I don't want the enter animation to overlap with layoutId animation).