How to hover below text, but the element should be wider?

Question

css

I can’t figure out how to make it so that when hovering over the active area of ​​a menu item, a hover appears only under the text (the active area with the link itself is much wider, with a dropdown effect in general, the entire width of the screen, but the hover is needed only under the text).
codepen.io/dhatt/pen/KgOxqw
upd. Issue resolved.

Answer 1

I hope I explained clearly. Already tried a bunch of options, did not help. It's a shame, such a little crap and so much trouble. Help plz.