diff --git a/views/css/everblock.css b/views/css/everblock.css
index 0affa4b..84f8a87 100644
--- a/views/css/everblock.css
+++ b/views/css/everblock.css
@@ -96,6 +96,29 @@
     min-width: 100%;
 }
 
+.everblock-megamenu .navbar-toggler.everblock-megamenu-toggler {
+    border: 1px solid currentColor;
+    border-radius: 0.5rem;
+    padding: 0.5rem;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    color: inherit;
+    background-color: transparent;
+    z-index: calc(var(--everblock-megamenu-zindex) + 20);
+}
+
+.everblock-megamenu-toggler-icon {
+    width: 1.5rem;
+    height: 1.2rem;
+    display: block;
+    background:
+        linear-gradient(currentColor 0 0) 0 0 / 100% 2px,
+        linear-gradient(currentColor 0 0) 0 50% / 100% 2px,
+        linear-gradient(currentColor 0 0) 0 100% / 100% 2px;
+    background-repeat: no-repeat;
+}
+
 .everblock-megamenu-item > .everblock-megamenu-item-link,
 .everblock-megamenu-item > .everblock-megamenu-item-link.btn,
 .everblock-megamenu-title,
@@ -132,6 +155,33 @@
     padding: 0;
 }
 
+.everblock-megamenu-item-header {
+    gap: 0.75rem;
+}
+
+.everblock-megamenu .everblock-megamenu-toggle {
+    border: 0;
+    padding: 0.25rem;
+    background: transparent;
+    color: inherit;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.everblock-megamenu .everblock-megamenu-toggle.dropdown-toggle::after {
+    display: none;
+}
+
+.everblock-megamenu-toggle-icon {
+    width: 0.65rem;
+    height: 0.65rem;
+    border-right: 2px solid currentColor;
+    border-bottom: 2px solid currentColor;
+    transform: rotate(45deg);
+    display: inline-block;
+}
+
 .everblock-megamenu .everblock-megamenu-dropdown {
     padding: 1.5rem 0;
 }
@@ -184,10 +234,63 @@
 
 @media (max-width: 991.98px) {
     .everblock-megamenu .everblock-megamenu-collapse {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        height: 100vh;
+        overflow-y: auto;
+        padding: 4.5rem 1rem 2rem;
+        background-color: var(--everblock-megamenu-bg-active);
         width: 100vw;
         margin-left: calc(50% - 50vw);
         margin-right: calc(50% - 50vw);
     }
+
+    .everblock-megamenu .dropdown-menu {
+        position: static;
+        width: 100%;
+        box-shadow: none;
+    }
+
+    .everblock-megamenu .dropdown-menu.everblock-megamenu-dropdown {
+        padding: 0.75rem 0;
+    }
+
+    .everblock-megamenu-mobile-column + .everblock-megamenu-mobile-column {
+        border-top: 1px solid rgba(0, 0, 0, 0.1);
+    }
+
+    .everblock-megamenu-mobile-toggle {
+        width: 100%;
+        border: 0;
+        background: transparent;
+        color: inherit;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 0.75rem;
+        padding: 0.75rem 0;
+        font-weight: 600;
+    }
+
+    .everblock-megamenu-mobile-icon {
+        width: 0.7rem;
+        height: 0.7rem;
+        border-right: 2px solid currentColor;
+        border-bottom: 2px solid currentColor;
+        transform: rotate(45deg);
+        transition: transform 0.2s ease;
+        flex-shrink: 0;
+    }
+
+    .everblock-megamenu-mobile-toggle[aria-expanded="true"] .everblock-megamenu-mobile-icon {
+        transform: rotate(-135deg);
+    }
+
+    .everblock-megamenu-mobile-body {
+        padding: 0.5rem 0 1rem;
+    }
 }
 /* Lookbook product markers */
 
diff --git a/views/templates/hook/prettyblocks/prettyblock_megamenu_container.tpl b/views/templates/hook/prettyblocks/prettyblock_megamenu_container.tpl
index 8236221..358595d 100644
--- a/views/templates/hook/prettyblocks/prettyblock_megamenu_container.tpl
+++ b/views/templates/hook/prettyblocks/prettyblock_megamenu_container.tpl
@@ -35,8 +35,8 @@
     {assign var='obfme_class' value=' obfme'}
   {/if}
   <nav class="navbar navbar-expand-lg navbar-light everblock-megamenu{if $everblock_winter_mode} everblock-megamenu--winter{/if}{$prettyblock_visibility_class}" aria-label="{$menu_label|escape:'htmlall':'UTF-8'}"{if $megamenu_style_vars} style="{$megamenu_style_vars|escape:'htmlall':'UTF-8'}"{/if}>
-    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#{$collapse_id}" aria-controls="{$collapse_id}" aria-expanded="false" aria-label="Toggle navigation">
-      <span class="navbar-toggler-icon"></span>
+    <button class="navbar-toggler everblock-megamenu-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#{$collapse_id}" aria-controls="{$collapse_id}" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="everblock-megamenu-toggler-icon" aria-hidden="true"></span>
     </button>
     <div class="collapse navbar-collapse everblock-megamenu-collapse w-100" id="{$collapse_id}">
       <ul class="navbar-nav w-100">
diff --git a/views/templates/hook/prettyblocks/prettyblock_megamenu_item.tpl b/views/templates/hook/prettyblocks/prettyblock_megamenu_item.tpl
index eedd486..dcd8a71 100644
--- a/views/templates/hook/prettyblocks/prettyblock_megamenu_item.tpl
+++ b/views/templates/hook/prettyblocks/prettyblock_megamenu_item.tpl
@@ -36,15 +36,22 @@
     {assign var='obfme_class' value=' obfme'}
   {/if}
   <li id="block-{$block.id_prettyblocks}" class="nav-item{if $has_dropdown} dropdown{/if}{$prettyblock_visibility_class} everblock-megamenu-item"{if $megamenu_style_vars} style="{$megamenu_style_vars|escape:'htmlall':'UTF-8'}"{/if}>
-    {if $menu_url}
-      <a class="nav-link everblock-megamenu-item-link{if $has_dropdown} dropdown-toggle{/if}{$obfme_class}" href="{$menu_url|escape:'htmlall':'UTF-8'}" title="{$menu_label|escape:'htmlall':'UTF-8'}"{if $has_dropdown} id="{$menu_toggle_id}" role="button" data-bs-toggle="dropdown" aria-expanded="false"{/if}>
-        {$menu_label|escape:'htmlall':'UTF-8'}
-      </a>
-    {else}
-      <button class="nav-link btn btn-link everblock-megamenu-item-link{if $has_dropdown} dropdown-toggle{/if}" type="button"{if $has_dropdown} id="{$menu_toggle_id}" data-bs-toggle="dropdown" aria-expanded="false"{/if}>
-        {$menu_label|escape:'htmlall':'UTF-8'}
-      </button>
-    {/if}
+    <div class="everblock-megamenu-item-header d-flex d-lg-block align-items-center justify-content-between">
+      {if $menu_url}
+        <a class="nav-link everblock-megamenu-item-link{$obfme_class}" href="{$menu_url|escape:'htmlall':'UTF-8'}" title="{$menu_label|escape:'htmlall':'UTF-8'}">
+          {$menu_label|escape:'htmlall':'UTF-8'}
+        </a>
+      {else}
+        <span class="nav-link everblock-megamenu-item-link" aria-label="{$menu_label|escape:'htmlall':'UTF-8'}">
+          {$menu_label|escape:'htmlall':'UTF-8'}
+        </span>
+      {/if}
+      {if $has_dropdown}
+        <button class="btn everblock-megamenu-toggle dropdown-toggle d-lg-none" type="button" id="{$menu_toggle_id}" data-bs-toggle="dropdown" aria-expanded="false" aria-label="{$menu_label|escape:'htmlall':'UTF-8'}">
+          <span class="everblock-megamenu-toggle-icon" aria-hidden="true"></span>
+        </button>
+      {/if}
+    </div>
 
     {if $has_dropdown}
       <div class="dropdown-menu everblock-megamenu-dropdown{if $block.settings.full_width} w-100{/if}" aria-labelledby="{$menu_toggle_id}" data-bs-popper="static">
@@ -57,9 +64,9 @@
             </div>
           </div>
 
-          <div class="d-lg-none accordion" id="everblock-megamenu-accordion-{$block.id_prettyblocks}">
+          <div class="d-lg-none everblock-megamenu-mobile">
             {foreach from=$block.extra.columns item=column name=mobile_columns}
-              {assign var='column_title' value=$column.extra.title_label|default:$column.settings.title|default:$menu_label}
+              {assign var='column_title' value=$column.extra.title_label|default:$column.settings.title|default:''}
               {if is_array($column_title)}
                 {if isset($language.id_lang) && isset($column_title[$language.id_lang])}
                   {assign var='column_title' value=$column_title[$language.id_lang]}
@@ -67,19 +74,31 @@
                   {assign var='column_title' value=$column_title|@reset}
                 {/if}
               {/if}
-              <div class="accordion-item">
-                <div class="accordion-header h2" id="everblock-megamenu-heading-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}">
-                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#everblock-megamenu-collapse-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}" aria-expanded="false" aria-controls="everblock-megamenu-collapse-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}">
-                    {$column_title|escape:'htmlall':'UTF-8'}
-                  </button>
-                </div>
-                <div id="everblock-megamenu-collapse-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}" class="accordion-collapse collapse" aria-labelledby="everblock-megamenu-heading-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}">
-                  <div class="accordion-body">
+              {assign var='column_title' value=$column_title|default:''}
+              {assign var='has_column_title' value=($column_title|trim != '')}
+              {assign var='column_collapse_id' value="everblock-megamenu-collapse-`$block.id_prettyblocks`-`$smarty.foreach.mobile_columns.iteration`"}
+              <div class="everblock-megamenu-mobile-column{if $has_column_title} is-collapsible{/if}">
+                {if $has_column_title}
+                  <div class="everblock-megamenu-mobile-header" id="everblock-megamenu-heading-{$block.id_prettyblocks}-{$smarty.foreach.mobile_columns.iteration}">
+                    <button class="everblock-megamenu-mobile-toggle collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#{$column_collapse_id}" aria-expanded="false" aria-controls="{$column_collapse_id}">
+                      <span class="everblock-megamenu-mobile-title">{$column_title|escape:'htmlall':'UTF-8'}</span>
+                      <span class="everblock-megamenu-mobile-icon" aria-hidden="true"></span>
+                    </button>
+                  </div>
+                  <div id="{$column_collapse_id}" class="collapse">
+                    <div class="everblock-megamenu-mobile-body">
+                      <div class="row g-3">
+                        {include file='module:everblock/views/templates/hook/prettyblocks/prettyblock_megamenu_column.tpl' block=$column from_parent=true render_title=false}
+                      </div>
+                    </div>
+                  </div>
+                {else}
+                  <div class="everblock-megamenu-mobile-body">
                     <div class="row g-3">
                       {include file='module:everblock/views/templates/hook/prettyblocks/prettyblock_megamenu_column.tpl' block=$column from_parent=true render_title=false}
                     </div>
                   </div>
-                </div>
+                {/if}
               </div>
             {/foreach}
           </div>