Change all header elements on hover

Site URL: https://www.rituelsdujour.com/

Hi everyone! 

I'm looking to replicate a header from an old Squarespace 7.0 template (https://fecastleberry.com/). You can see here how the hovered item doesn't change, but the other elements increase in opacity.

I've tried quite a few different things but would love some help on this!

Let me know if I can clarify anything!

-Tess

I figured it out! In case anyone has this issue

// Header Navigation hover
.header-nav-item{
  opacity: 1;
}
.header-nav-list:hover .header-nav-item{
  opacity: 0.4;
}
.header-nav-list .header-nav-item:hover{
  opacity: 1;
}