Change position of child element on parent element hover

Hey all,

Sorry in advance if there is an answer to my (maybe) stupid question but, I was struggling with creating the animation/interaction as from image attached. I need arrows to change position on parent element hover and also to change color of text and possibly SVG icon color as well.

I did try with interactions but I cant figure out how to combine all these actions, also it’s a pain to move arrow image inside of the parent wrapper
element and not affect the width of it, even though the icon itself has absolute position applied.

Any info highly appreciated.

webflow-topic-gif


Here is my public share link: LINK
(how to access public share link)