For desktop, your hover code depends on this selector:
.no-touch .main-navigation li
So first check whether the no-touch class is actually present on the <html> or <body> tag. If that class is missing, the desktop hover function will never run.
You can test it by temporarily changing this:
$('.no-touch .main-navigation li').hover(
to this:
$('.main-navigation li').hover(
If the dropdown starts working, then the issue is not the menu CSS. It is the missing no-touch class.
Also, your mobile click logic only runs when .toogle-icon is visible. That is fine for mobile, but for desktop you need either a working hover rule or CSS like:
.main-navigation li:hover > ul { display: block; }
Personally, I would handle desktop dropdowns with CSS and keep jQuery only for mobile toggle. It is simpler and less likely to break.
