diff --git a/assets/js/theme/nav/mainMenu.js b/assets/js/theme/nav/mainMenu.js
index 61f3badc1e449189561e18fd32be467392226bdc..a43851bd827f1808898e05975e168ac938678912 100644
--- a/assets/js/theme/nav/mainMenu.js
+++ b/assets/js/theme/nav/mainMenu.js
@@ -47,9 +47,16 @@ class MainMenu {
         document.documentElement.classList.toggle(CLASSES.menusOpened);
     }
 
-    toggleDropdown (button) {
-        const isExpanded = button.getAttribute('aria-expanded') === 'true';
-        button.setAttribute('aria-expanded', !isExpanded);
+    toggleDropdown (clickedButton) {
+        const isExpanded = clickedButton.getAttribute('aria-expanded') === 'true';
+        // Close all dropdowns except selected
+        this.dropdownsButtons.forEach(button => {
+            if (clickedButton === button) {
+                clickedButton.setAttribute('aria-expanded', !isExpanded);
+            } else {
+                button.setAttribute('aria-expanded', 'false');
+            }
+        });
     }
 
     onScroll () {
diff --git a/assets/sass/_theme/design-system/nav.sass b/assets/sass/_theme/design-system/nav.sass
index 6d38a5628887ab1d3ffd31bc0ae8e33ceee78794..ce2ac2ae8c5b229108ae3527db5c8a147233897f 100644
--- a/assets/sass/_theme/design-system/nav.sass
+++ b/assets/sass/_theme/design-system/nav.sass
@@ -46,8 +46,8 @@
                 display: block
             &:last-child a
                 padding-right: 0
-        li.has-children:hover
-            .dropdown-menu
+        li.has-children
+            a[aria-expanded="true"] + .dropdown-menu
                 display: block
 
     .nav-level-2