MenuList: fix tablet size

- remove the three different css classes use one class in @media css

src/pages/menu/components/MenuList/MenuList.module.css

@@ -33,12 +33,24 @@
   transition: color 0.3s ease;
 }
 
+.menuItemsGrid {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
 /* Enhanced responsive menu section headers */
 @media (min-width: 769px) and (max-width: 1024px) {
   .menuSection h3 {
     margin: 40px 0px 20px 0px;
     font-size: 24px;
   }
+
+  .menuItemsGrid {
+    grid-template-columns: repeat(2, 1fr);
+    gap: 16px;
+    margin-bottom: 20px;
+  }
 }
 
 @media (min-width: 1025px) {
@@ -46,39 +58,19 @@
     margin: 50px 0px 25px 0px;
     font-size: 28px;
   }
-}
 
-.menuItemsGrid {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.menuItemsGridMobile {
-  gap: 12px;
-  grid-template-columns: 1fr;
-}
-
-.menuItemsGridTablet {
-  grid-template-columns: repeat(2, 1fr);
-  gap: 16px;
-  padding: 0 12px;
-  margin-bottom: 20px;
-}
-
-.menuItemsGridDesktop {
-  grid-template-columns: repeat(3, 1fr);
-  gap: 20px;
-  padding: 0 16px;
-  margin-bottom: 24px;
+  .menuItemsGrid {
+    grid-template-columns: repeat(3, 1fr);
+    gap: 20px;
+    margin-bottom: 24px;
+  }
 }
 
 /* Enhanced responsive menu items grid */
 @media (min-width: 1280px) {
-  .menuItemsGridDesktop {
+  .menuItemsGrid {
     grid-template-columns: repeat(3, 1fr);
     gap: 24px;
-    padding: 0 20px;
     margin-bottom: 28px;
   }
 }