diff --git a/patterns/left-navigation.html b/patterns/left-navigation.html
index 6019d1b..8ae2c85 100644
--- a/patterns/left-navigation.html
+++ b/patterns/left-navigation.html
@@ -57,7 +57,7 @@
 
       const setMenuState = (expanded) => {
         menu.hidden = !expanded;
-        menu.style.display = expanded ? '' : 'none';
+        menu.classList.toggle('sg-left-navigation-pattern__menu--collapsed', !expanded);
         toggle.setAttribute('aria-expanded', String(expanded));
         toggle.textContent = expanded ? 'Ausblenden' : 'Einblenden';
         toggle.classList.add('sg-button--active');
@@ -76,7 +76,7 @@
         }
 
         menu.hidden = false;
-        menu.style.display = '';
+        menu.classList.remove('sg-left-navigation-pattern__menu--collapsed');
         toggle.setAttribute('aria-expanded', 'true');
         toggle.textContent = 'Ausblenden';
         toggle.classList.add('sg-button--active');
diff --git a/styles/29-patterns-left-navigation.css b/styles/29-patterns-left-navigation.css
index 61631de..fcea361 100644
--- a/styles/29-patterns-left-navigation.css
+++ b/styles/29-patterns-left-navigation.css
@@ -24,6 +24,10 @@
   display: none;
 }
 
+.sg-left-navigation-pattern__menu--collapsed {
+  display: none;
+}
+
 .sg-left-navigation-pattern__group-card {
   min-width: 0;
 }