Box-shadow signifies current page link and currently hovered/focused link.

Combined pseudo-classes allow current page link to change its box-shadow changes on hover/focus.

Most of the nav hover/focus states as possible are in the Webstudio UI

Relevant to the combined states/pseudo-classes that I was suggesting for the Webstudio UI, see the first html embed.

Enable the second html embed to add behavior that makes this design make a bit more visual sense. (But that would probably always have to be CSS only, since it depends on inheritance)