feat: Update MegaMenu styles and grid layout for improved responsiveness

src/extensions/megaMenu/MegaMenu.module.scss

@@ -187,7 +187,7 @@ $menuLayer: var(--megaMenuZIndex, 6000);
         box-sizing: border-box;
         visibility: hidden;
         opacity: 0;
-        border: 1px solid $neutralLight;
+        border: 1px solid #edebe9;
         border-top: 0;
         background: $white;
         box-shadow: $menuShadow;
@@ -203,11 +203,11 @@ $menuLayer: var(--megaMenuZIndex, 6000);
 
     .mega-menu-grid {
         display: grid;
-        grid-template-columns: repeat(var(--megaMenuColumnCount, 4), minmax(0, 1fr));
+        grid-template-columns: repeat(var(--megaMenuColumnCount, 6), minmax(0, 1fr));
         box-sizing: border-box;
         width: 100%;
         max-width: var(--megaMenuContentWidth, 1200px);
-        margin: 0 auto;
+        margin: 0;
         padding: 24px;
         gap: 24px 32px;
         background: $white;

src/extensions/megaMenu/MegaMenuRenderer.ts

@@ -726,7 +726,7 @@ export class MegaMenuRenderer {
 
     private getColumnCount(items?: IMenuItem[]): string {
         const itemCount = items ? items.length : 0;
-        const columnCount = Math.min(Math.max(itemCount, 1), 4);
+        const columnCount = Math.min(Math.max(itemCount, 1), 6);
         return columnCount.toString();
     }