Use Wrap lines on the Main Hero items

Author: vyktoremario

src/components/Header/Nav/ProductNavigation/Desktop/megaMenu.module.css

@@ -33,7 +33,6 @@
 .row {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
-  border-bottom: 1px solid var(--border);
 }
 
 .row:last-child {
@@ -68,7 +67,7 @@
 .groupItem {
   display: flex;
   align-items: center;
-  padding: var(--space-6x) var(--space-8x);
+  padding: var(--space-4x) var(--space-6x);
   gap: var(--space-4x);
   text-decoration: none;
   transition: background-color 0.2s;
@@ -87,22 +86,10 @@
 .itemList {
   display: flex;
   flex-direction: column;
-}
-
-.groupItemDescription {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
+  padding: var(--space-2x);
 }
 
 .groupItemTitle {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
   font-size: 18px;
   font-weight: 500;
 }
@@ -125,6 +112,12 @@
     border-right: none;
   }
 
+  & .itemList {
+    padding-top: var(--space-0);
+    padding-left: var(--space-0);
+    padding-right: var(--space-0);
+  }
+
   & .groupItemTitle {
     display: block;
     -webkit-line-clamp: unset;