new footer layout

web/src/components/layout/footer.module.scss

@@ -7,6 +7,11 @@
   font-size: var(--font-size-caption);
   overflow: hidden;
 
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  column-gap: var(--spacing-gap-column);
+  row-gap: var(--spacing-gap-column);
+
   h2 {
     font-family: var(--font-serif);
     font-weight: 400;
@@ -18,17 +23,8 @@
   }
 }
 
-.contactList {
-  width: 100%;
-  display: grid;
-  grid-template-columns: repeat(12, 1fr);
-  column-gap: var(--spacing-gap-column);
-  row-gap: var(--spacing-gap-column);
-}
-
 .contactItem {
   list-style: none;
-  grid-column: span 4;
 
   ul {
     list-style: none;
@@ -45,10 +41,6 @@
 .social,
 .contact,
 .visit {
-  display: grid;
-  grid-template-columns: repeat(12, 1fr);
-  gap: var(--spacing-gap-column);
-  row-gap: var(--spacing-gap-row);
   margin-bottom: var(--spacing-section-bottom);
 
   ul {
@@ -61,37 +53,20 @@
   }
 }
 
-.social {
-  ul {
-    display: flex;
-    flex-wrap: wrap;
-    grid-column: span 9;
-    column-gap: var(--spacing-s);
-    row-gap: var(--spacing-xs);
-  }
-}
-
 .visit {
-
+  grid-column: span 2;
-  >div,
+  display: grid;
-  >ul {
+  grid-template-columns: 1fr 1fr;
-    grid-column: span 4;
-  }
 }
 
 .address {
   line-height: 1.78;
+  margin-bottom: 2rem;
 }
 
 .emails {
-  grid-column: span 9;
-  display: grid;
-  grid-template-columns: repeat(9, 1fr);
-  gap: var(--spacing-gap-column);
-
   >div {
-    grid-column: span 4;
+    margin-bottom: 2rem;
-    min-width: 0;
   }
 }