Need to add hover interactions for Div Blocks within a collection item (and more help needed)

Design help Custom code
1

I wanted to pull of something like this website:

Items I need help with:

  1. I want to make the interaction where if a user hovers on a collection list item, that item is highlighted and the others and dimmed out.
  2. Also need to display the respective metadata for the collection item that the user hovers on (similar to the details showing up on the bottom when a user hovers on the card in the website linked above)

Another reference I have is this:

From this website I need the following:

  1. The out-animation and in-animation when navigating to a different page. How should I add the delay for this?
  2. On the gallery which is visible after a user opens a project, one can click on the image from the list on the right and the image is visible on the left. How can I pull this off with CMS?
  3. Horizontal scroll is implemented on this website, but a user can also swipe left-right to scroll past the cards. How should I allow the user to do this?

Here is my site Read-Only:

https://preview.webflow.com/preview/santhana-krishnan?utm_medium=preview_link&utm_source=designer&utm_content=santhana-krishnan&preview=aabe958101e7b2c1e5817bb626581d57&workflow=preview