diff --git a/css/main.css b/css/main.css
index 1eb92d2..b59ecee 100644
--- a/css/main.css
+++ b/css/main.css
@@ -872,20 +872,93 @@ section#reviews {
   display: grid;
   grid-template-columns: 1fr;
 }
+@media (width >= 1400px) {
+  .faq-contact-container {
+    margin-top: 7rem;
+    display: grid;
+    grid-template-columns: 0.6fr 1fr;
+    grid-template-rows: auto 1fr;
+    -moz-column-gap: 8rem;
+         column-gap: 8rem;
+    grid-template-areas: "header faq-accordion" "contact faq-accordion" "subscribe subscribe";
+    align-items: start;
+  }
+}
+@media (width >= 768px) {
+  .faq-contact-container .header {
+    justify-self: center;
+    width: 60%;
+  }
+}
+@media (width >= 1400px) {
+  .faq-contact-container .header {
+    grid-area: header;
+    justify-self: left;
+    width: 100%;
+  }
+}
 .faq-contact-container .header h2 {
   margin-top: 3rem;
   font-size: var(--fs-h4);
   font-weight: var(--fw-extra);
 }
+@media (width >= 768px) {
+  .faq-contact-container .header h2 {
+    font-size: var(--fs-h2);
+    line-height: 1.3;
+  }
+}
+@media (width >= 1400px) {
+  .faq-contact-container .header h2 {
+    text-align: left;
+  }
+}
 .faq-contact-container .header p {
   /* Poor contrast, but according to design */
   color: var(--color-gray-700);
 }
+@media (width >= 768px) {
+  .faq-contact-container .header p {
+    margin-top: 2rem;
+  }
+}
+@media (width >= 1400px) {
+  .faq-contact-container .header p {
+    text-align: left;
+  }
+}
 .faq-contact-container p {
   margin-top: 1rem;
   font-size: var(--fs-body-l);
   line-height: 1.6;
 }
+@media (width >= 1400px) {
+  .faq-contact-container p {
+    margin-top: 2rem;
+  }
+}
+@media (width >= 768px) {
+  .faq-contact-container .faq-accordion {
+    /* Start by removing FAQ borders */
+    --_faq-border: unset;
+  }
+  .faq-contact-container .faq-accordion details {
+    box-shadow: 0px 2px 5px var(--color-faqoutline);
+    border-radius: 8px;
+    /* Apply margin-top to all details-elements except first one */
+  }
+  .faq-contact-container .faq-accordion details p:first-child {
+    margin-top: 0;
+  }
+  .faq-contact-container .faq-accordion details:not(:first-child) {
+    margin-top: 1rem;
+  }
+}
+@media (width >= 1400px) {
+  .faq-contact-container .faq-accordion {
+    grid-area: faq-accordion;
+  }
+}
 .faq-contact-container .faq-accordion p {
   font-size: var(--fs-body-s);
 }
@@ -895,6 +968,17 @@ section#reviews {
   justify-content: center;
   align-items: center;
 }
+@media (width >= 768px) {
+  .faq-contact-container .contact {
+    margin-top: 2rem;
+  }
+}
+@media (width >= 1400px) {
+  .faq-contact-container .contact {
+    grid-area: contact;
+    margin-top: 3rem;
+  }
+}
 .faq-contact-container .contact-cards {
   display: none;
   width: 100%;
@@ -904,6 +988,11 @@ section#reviews {
   /* Make cards take up equal width */
   flex-basis: 100%;
 }
+@media (width >= 768px) {
+  .faq-contact-container .contact-cards {
+    display: flex;
+  }
+}
 .faq-contact-container .contact-card {
   padding: 1.5em 1.5em 2em;
   border: 1px solid var(--color-gray-300);
@@ -914,6 +1003,11 @@ section#reviews {
   line-height: 1.6;
   font-weight: var(--fw-semi);
 }
+@media (width >= 768px) {
+  .faq-contact-container .btn-contanct {
+    display: none;
+  }
+}
 .faq-contact-container .fa-comment-dots {
   /* Flip icon horizontally to match design */
   transform: scaleX(-1);
@@ -947,9 +1041,19 @@ section#reviews {
   font-size: var(--fs-body-s);
   line-height: 1.6;
 }
+@media (width >= 1400px) {
+  .footer {
+    padding: 3rem 0;
+  }
+}
 .footer span {
   color: var(--color-gray-600);
 }
+@media (width >= 768px) {
+  .footer .footer-splitter {
+    display: none;
+  }
+}
 
 a {
   color: var(--color-primary);
@@ -1022,6 +1126,11 @@ a:hover {
   line-height: 1.6;
   padding: 1em 2em;
 }
+@media (width >= 768px) {
+  .btn-contact {
+    display: none;
+  }
+}
 
 .btn-dl {
   /* Give buttons a higher z-index to make sure they aren't covered
@@ -1333,10 +1442,31 @@ a:hover {
   display: flex;
   flex-direction: column;
 }
+@media (width >= 768px) {
+  .subscribe {
+    margin-top: 2rem;
+    padding: 3rem 1rem;
+    flex-direction: row;
+  }
+}
+@media (width >= 1400px) {
+  .subscribe {
+    grid-area: subscribe;
+    margin-top: 6rem;
+    padding: 4rem 6rem;
+  }
+}
 .subscribe .cta {
   display: flex;
   align-items: center;
 }
+@media (width >= 768px) {
+  .subscribe .cta {
+    flex-basis: 50%;
+    justify-content: center;
+    margin-right: 3rem;
+  }
+}
 .subscribe .cta h2 {
   font-size: 1.375rem;
   line-height: 1.35;
@@ -1344,9 +1474,29 @@ a:hover {
 .subscribe .cta h2.desktop-text {
   display: none;
 }
+@media (width >= 1400px) {
+  .subscribe .cta h2.desktop-text {
+    display: block;
+  }
+}
+@media (width >= 1400px) {
+  .subscribe .cta h2 {
+    display: none;
+  }
+}
 .subscribe .cta img {
   margin-right: 1rem;
 }
+@media (width >= 768px) {
+  .subscribe .cta img {
+    margin-right: 2rem;
+  }
+}
+@media (width >= 768px) {
+  .subscribe .email-form {
+    flex-basis: 50%;
+  }
+}
 .subscribe .input-container {
   margin-top: 2.5rem;
   margin-bottom: 2rem;
@@ -1608,108 +1758,4 @@ a:hover {
   #darkmode-switch-whitebg {
     display: none;
   }
-}
-@media (768px <= width) {
-  /* How does it work-section */
-  /* FAQ-Contact section */
-  .faq-contact-container .header {
-    justify-self: center;
-    width: 60%;
-  }
-  .faq-contact-container .header h2 {
-    font-size: var(--fs-h2);
-    line-height: 1.3;
-  }
-  .faq-contact-container .header p {
-    margin-top: 2rem;
-  }
-  .faq-contact-container .faq-accordion {
-    /* Start by removing FAQ borders */
-    --_faq-border: unset;
-  }
-  .faq-contact-container .faq-accordion details {
-    box-shadow: 0px 2px 5px var(--color-faqoutline);
-    border-radius: 8px;
-    /* Apply margin-top to all details-elements except first one */
-  }
-  .faq-contact-container .faq-accordion details p:first-child {
-    margin-top: 0;
-  }
-  .faq-contact-container .faq-accordion details:not(:first-child) {
-    margin-top: 1rem;
-  }
-  .faq-contact-container .btn-contact {
-    /* Hide contact button and show contact cards */
-    display: none;
-  }
-  .faq-contact-container .contact-cards {
-    display: flex;
-  }
-  .faq-contact-container .contact {
-    margin-top: 2rem;
-  }
-  .faq-contact-container .subscribe {
-    margin-top: 2rem;
-    padding: 3rem 1rem;
-    flex-direction: row;
-  }
-  .faq-contact-container .subscribe .cta, .faq-contact-container .subscribe .email-form {
-    flex-basis: 50%;
-  }
-  .faq-contact-container .subscribe .cta {
-    justify-content: center;
-    margin-right: 3rem;
-  }
-  .faq-contact-container .subscribe .cta img {
-    margin-right: 2rem;
-  }
-  .footer .footer-splitter {
-    display: none;
-  }
-}
-@media (1400px <= width) {
-  /* How does it work-section */
-  /* FAQ-contact section */
-  .faq-contact-container {
-    margin-top: 7rem;
-    display: grid;
-    grid-template-columns: 0.6fr 1fr;
-    grid-template-rows: auto 1fr;
-    -moz-column-gap: 8rem;
-         column-gap: 8rem;
-    grid-template-areas: "header faq-accordion" "contact faq-accordion" "subscribe subscribe";
-    align-items: start;
-  }
-  .faq-contact-container .header {
-    grid-area: header;
-    justify-self: left;
-    width: 100%;
-  }
-  .faq-contact-container .header h2, .faq-contact-container .header p {
-    text-align: left;
-  }
-  .faq-contact-container p {
-    margin-top: 2rem;
-  }
-  .faq-contact-container .faq-accordion {
-    grid-area: faq-accordion;
-  }
-  .faq-contact-container .contact {
-    grid-area: contact;
-    margin-top: 3rem;
-  }
-  .faq-contact-container .subscribe {
-    grid-area: subscribe;
-    margin-top: 6rem;
-    padding: 4rem 6rem;
-  }
-  .faq-contact-container .subscribe h2 {
-    display: none;
-  }
-  .faq-contact-container .subscribe .cta h2.desktop-text {
-    display: block;
-  }
-  .footer {
-    padding: 3rem 0;
-  }
 }
\ No newline at end of file
diff --git a/css/scss/base/_media-width.scss b/css/scss/base/_media-width.scss
deleted file mode 100644
index edd2f97..0000000
--- a/css/scss/base/_media-width.scss
+++ /dev/null
@@ -1,428 +0,0 @@
-@media (768px <= width) {
-  // /* Change margin & padding */
-  // :root {
-  //   --header-pt: 1.5rem;
-  // }
-
-  // /* Header/navbar */
-  // .main-navbar {
-  //   .dm-text {
-  //     display: block;
-  //   }
-
-  //   .btn-burger {
-  //     margin-left: 5rem;
-  //   }
-  // }
-
-  // /* Hero section */
-  // .hero-container {
-  //   // grid-template-columns: 2fr 3fr;
-  //   // grid-template-areas:  "hero-headline hero-headline"
-  //   //                       "hero-content hero-images";
-  //   // gap: 2rem 0rem;
-
-    
-  //   // .headline {
-  //   //   font-size: var(--fs-hero-headline-tablet);
-  //   //   margin-top: 4.5rem;
-  //   // }
-  //   // .content {
-  //   //   text-align: left;
-  //   // }
-  //   // .dlbuttons {
-  //   //   margin-top: 3rem;
-  //   // }
-  //   // .discover-more-container {
-  //   //   justify-content: left;
-  //   // }
-  //   // .paragraph-splitter, .hero-images {
-  //   //   display: block;
-  //   // }
-  // }
-
-  //   /* Features section */
-  // .features-container {
-  //   // margin-bottom: 7rem;
-  //   // .brandlogo-container {
-  //   //   display: flex;
-  //   // }
-
-  //   // .headline {
-  //   //   margin-top: 4rem;
-  //   //   font-size: var(--fs-h2);
-  //   //   line-height: 1.3;
-  //   // }
-
-  //   .feature-cards {
-  //     // margin-top: 2.5rem;
-  //     // display: grid;
-  //     // grid-template-columns: 1fr 1fr;
-  //     // gap: 2.5rem 2rem;
-      
-  //     .card {
-  //       margin-bottom: 0;
-  //     }
-  //   }
-  // }
-
-  /* How does it work-section */
-  // .how-container {
-  //   // h2 {
-  //   //   font-size: 2.125rem;
-  //   // }
-
-  //   // .mobile, .desktop {
-  //   //   display: none;
-  //   // }
-  //   // .tablet {
-  //   //   display: block;
-  //   // }
-
-  //   .images-container {
-  //     // margin-top: 3rem;
-  //     // /* Increase spacing between images as container grows in width */
-  //     // width: 100%;
-  //     // max-width: 900px;
-  //     // .mobile.img, .desktop.img {
-  //     //   display: none;
-  //     // }
-  //     // .tablet.img {
-  //     //   display: block;
-  //     //   flex-shrink: 0;
-  //     //   flex-grow: 1;
-  //     // }
-  //     // .img.left {
-  //     //   text-align: right;
-  //     // }
-  //     // .img.right {
-  //     //   text-align: left;
-  //     // }
-  //   }
-
-  //   .image-description {
-  //     // margin-top: 2.5rem;
-  //     // width: 65%;
-  //     // max-width: 550px;
-  //     // h3 {
-  //     //   width: 100%;
-  //     //   font-size: 1.4rem;
-  //     //   line-height: 1.4;
-  //     // }
-  //     p {
-  //       line-height: 1.625;
-  //     }
-  //   }
-  // }
-
-  /* FAQ-Contact section */
-  .faq-contact-container {
-    .header {
-      justify-self: center;
-      width: 60%;
-
-      h2 {
-        font-size: var(--fs-h2);
-        line-height: 1.3;
-      }
-      p {
-        margin-top: 2rem;
-      }
-    }
-      
-    .faq-accordion {
-      /* Start by removing FAQ borders */
-      --_faq-border: unset;
-
-      details {
-        box-shadow: 0px 2px 5px var(--color-faqoutline);
-        border-radius: 8px;
-
-        p:first-child {
-          margin-top: 0;
-        }
-
-        /* Apply margin-top to all details-elements except first one */
-        &:not(:first-child) {
-          margin-top: 1rem;
-        }
-      }
-    }
-
-    .btn-contact {
-      /* Hide contact button and show contact cards */
-      display: none;
-    }
-    .contact-cards {
-      display: flex;
-    }
-    .contact {
-      margin-top: 2rem;
-    }
-
-    .subscribe {
-      margin-top: 2rem;
-      padding: 3rem 1rem;
-      flex-direction: row;
-      .cta, .email-form {
-        flex-basis: 50%;
-      }
-      .cta {
-        justify-content: center;
-        margin-right: 3rem;
-        img {
-          margin-right: 2rem;
-        }
-      }
-    }
-  }
-
-  .footer {
-    .footer-splitter {
-      display: none;
-    }
-  }
-}
-
-@media (1400px <= width) {
-  // /* Change margin & padding */
-  // :root {
-  //   --header-pt: 1rem;
-  // }
-
-  // /* Header/navbar */
-  // header#nav {
-  //   backdrop-filter: unset !important;
-  //   background-color: unset !important;
-  //   .burger-menu {
-  //     grid-template-rows: 0fr !important;
-  //     box-shadow: unset !important;
-  //     display: none !important;
-  //   }
-  // }
-
-  // .main-navbar {
-  //   #navbar-links, .btn-signin {
-  //     display: flex;
-  //   }
-
-  //   .btn-burger, #burger-toggle {
-  //     /* In desktop, hide burgermenubtn and its checkbox */
-  //     display: none;
-  //   }
-  // }
-
-  // /* Hero section */
-  // .hero-container {
-  //   // align-items: start;
-  //   // height: 800px;
-  //   // grid-template-columns: 1fr 1fr;
-  //   // grid-template-areas:  "hero-headline hero-images"
-  //   //                       "hero-content hero-images";
-  //   // gap: 0rem;
-
-  //   // .headline {
-  //   //   // font-size: var(--fs-hero-headline-desktop);
-  //   //   // margin-top: 9rem;
-  //   //   // text-align: left;
-  //   // }
-  //   // .content {
-  //   //   margin-top: 0;
-  //   // }
-  //   // .dlbuttons {
-  //   //   flex-direction: row;
-  //   // }
-  //   // .discover-more {
-  //   //   margin-top: 15rem;
-  //   // }
-
-  //   .hero-images {
-  //     .hero-img-shadow {
-  //       bottom: 0;
-  //       right: 425px;
-  //     }
-  //     .hero-img-back {
-  //       bottom: 0;
-  //       right: 235px;
-  //     }
-  //     .hero-img-front {
-  //       right: 0;
-  //       bottom: 0;
-  //     }
-  //   }
-    
-  //   /* Replace images with desktop versions */
-  //   .hero-img-shadow {
-  //     content: url('/assets/images/desktop/hero-shadow.png');
-  //   }
-  //   .hero-img-back {
-  //     content: url('/assets/images/desktop/hero-back.png');
-  //   }
-  //   .hero-img-front {
-  //     content: url('/assets/images/desktop/hero-front.png');
-  //   }
-  // }
-
-  // /* Features section */
-  // .features-container {
-  //   // margin-bottom: 14rem;
-  //   .content-container {
-  //     display: grid;
-  //     grid-template-columns: 1fr 2fr;
-  //     margin-top: 7rem;
-  //     gap: 8rem;
-
-  //     // .headline {
-  //     //   margin-top: 0;
-  //     // }
-  //     // .feature-cards {
-  //     //   gap: 3rem;
-  //     // }
-  //   }
-
-
-  //   // .brandlogo-container {
-  //   //   margin-top: 6rem;
-  //   //   .desktop-only {
-  //   //     display: flex;
-  //   //   }
-  //   // }
-
-  //   // .left-content {
-  //   //   display: block;
-  //   //   position: relative;
-
-  //   //   .phone-img {
-  //   //     position: absolute;
-  //   //   }
-  //   //   .card-img {
-  //   //     position: absolute;
-  //   //     top: 90px;
-  //   //     left: 25px;
-  //   //   }
-  //   // }
-
-  //   .right-content {
-  //     // grid-template-rows: min-content min-content auto;
-  //     // .headline, .paragraph {
-  //     //   text-align: left;
-  //     // }
-  //     .headline {
-  //       // font-size: var(--fs-h1);
-  //       // line-height: 1.3;
-  //     }
-  //     .paragraph {
-  //       // margin-top: .75rem;
-  //     }
-      
-  //     // .feature-cards {
-  //     //   margin-top: 4.5rem;
-  //     // }
-  //   }
-  // }
-
-  /* How does it work-section */
-  // .how-container {
-  //   // h2 {
-  //   //   margin-top: 5rem;
-  //   //   font-size: var(--fs-h1);
-  //   //   line-height: 1.3;
-  //   // }
-
-  //   // .mobile, .tablet {
-  //   //   display: none;
-  //   // }
-  //   // .desktop {
-  //   //   display: block;
-  //   // }
-
-  //   // .images-container {
-  //   //   // /* Increase spacing between images as container grows in width */
-  //   //   // max-width: unset;
-  //   //   .mobile.img, .tablet.img {
-  //   //     display: none;
-  //   //   }
-  //   //   .desktop.img {
-  //   //     display: block;
-  //   //     flex-grow: 1;
-  //   //   }
-  //   //   .img.left, .img.right {
-  //   //     text-align: center;
-  //   //   }
-  //   // }
-
-  //   .image-description {
-  //     // width: 65%;
-  //     // max-width: 550px;
-  //     // h3 {
-  //     //   width: 100%;
-  //     //   font-size: 1.44rem;
-  //     //   line-height: 1.4;  
-  //     // }
-  //     p {
-  //       margin-bottom: 6rem;
-  //       line-height: 1.625;
-  //     }
-  //   }
-  // }
-
-  // /* Payment section */
-  // section#payment {
-  //   display: block;
-  // }
-
-  // /* Reviews section */
-  // section#reviews {
-  //   display: block;
-  // }
-
-  /* FAQ-contact section */
-  .faq-contact-container {
-    margin-top: 7rem;
-    display: grid;
-    grid-template-columns: 0.6fr 1fr;
-    grid-template-rows: auto 1fr;
-    column-gap: 8rem;
-    grid-template-areas:  "header faq-accordion"
-                          "contact faq-accordion"
-                          "subscribe subscribe";
-    align-items: start;
-
-    .header {
-      grid-area: header;
-      justify-self: left;
-      width: 100%;
-
-      h2, p {
-        text-align: left;
-      }
-    }
-    p {
-      margin-top: 2rem;
-    }
-    .faq-accordion {
-      grid-area: faq-accordion;
-    }
-    .contact {
-      grid-area: contact;
-      margin-top: 3rem;
-    }
-
-    .subscribe {
-      grid-area: subscribe;
-      margin-top: 6rem;
-      padding: 4rem 6rem;
-
-      h2 {
-        display: none;
-      }
-      .cta h2.desktop-text {
-        display: block;
-      }
-    }
-  }
-
-  .footer {
-    padding: 3rem 0;
-  }
-}
\ No newline at end of file
diff --git a/css/scss/components/_buttons.scss b/css/scss/components/_buttons.scss
index 69f401a..21ce097 100644
--- a/css/scss/components/_buttons.scss
+++ b/css/scss/components/_buttons.scss
@@ -41,6 +41,10 @@
   font-weight: var(--fw-semi);
   line-height: 1.6;
   padding: 1em 2em;
+
+  @include tablet {
+    display: none;
+  }
 }
 
 .btn-dl {
diff --git a/css/scss/components/_subscribe.scss b/css/scss/components/_subscribe.scss
index ad58670..8013923 100644
--- a/css/scss/components/_subscribe.scss
+++ b/css/scss/components/_subscribe.scss
@@ -1,3 +1,5 @@
+@use '../abstracts/' as *;
+
 .subscribe {
   margin-top: 2.5rem;
   padding: 3rem 1rem 0;
@@ -7,20 +9,55 @@
   display: flex;
   flex-direction: column;
 
+  @include tablet {
+    margin-top: 2rem;
+    padding: 3rem 1rem;
+    flex-direction: row;
+  }
+  @include desktop {
+    grid-area: subscribe;
+    margin-top: 6rem;
+    padding: 4rem 6rem;
+  }
+
   .cta {
     display: flex;
     align-items: center;
 
+    @include tablet {
+      flex-basis: 50%;
+      justify-content: center;
+      margin-right: 3rem;
+    }
+
     h2 {
       font-size: 1.375rem;
       line-height: 1.35;
       &.desktop-text {
         display: none;
+
+        @include desktop {
+          display: block;
+        }
+      }
+
+      @include desktop {
+        display: none;
       }
     }
     
     img {
       margin-right: 1rem;
+
+      @include tablet {
+        margin-right: 2rem;
+      }
+    }
+  }
+
+  .email-form {
+    @include tablet {
+      flex-basis: 50%;
     }
   }
 
diff --git a/css/scss/main.scss b/css/scss/main.scss
index d17c7f6..a5754c7 100644
--- a/css/scss/main.scss
+++ b/css/scss/main.scss
@@ -6,9 +6,4 @@
 @use './utilities/' as utilities;
 @use './sections/' as sections;
 @use './components/' as components;
-@use './themes/' as themes;
-
-// Add media queries manually instead of through @forward,
-// to ensure they get added last.
-// If refactoring, set MQs on components/sections instead.
-@use './base/media-width' as media-width;
\ No newline at end of file
+@use './themes/' as themes;
\ No newline at end of file
diff --git a/css/scss/sections/_faqcontact.scss b/css/scss/sections/_faqcontact.scss
index 1185ada..8d11d46 100644
--- a/css/scss/sections/_faqcontact.scss
+++ b/css/scss/sections/_faqcontact.scss
@@ -1,16 +1,56 @@
+@use '../abstracts/' as *;
+
 .faq-contact-container {
   display: grid;
   grid-template-columns: 1fr;
 
+  @include desktop {
+    margin-top: 7rem;
+    display: grid;
+    grid-template-columns: 0.6fr 1fr;
+    grid-template-rows: auto 1fr;
+    column-gap: 8rem;
+    grid-template-areas:  "header faq-accordion"
+                          "contact faq-accordion"
+                          "subscribe subscribe";
+    align-items: start;
+  } 
+
   .header {
+    @include tablet {
+      justify-self: center;
+      width: 60%;
+    }
+    @include desktop {
+      grid-area: header;
+      justify-self: left;
+      width: 100%;
+    }
+
     h2 {
       margin-top: 3rem;
       font-size: var(--fs-h4);
       font-weight: var(--fw-extra);
+
+      @include tablet {
+        font-size: var(--fs-h2);
+        line-height: 1.3;
+      }
+      @include desktop {
+        text-align: left;
+      }
     }
+
     p {
       /* Poor contrast, but according to design */
       color: var(--color-gray-700);
+
+      @include tablet {
+        margin-top: 2rem;
+      }
+      @include desktop {
+        text-align: left;
+      }
     }
   }
 
@@ -18,6 +58,34 @@
     margin-top: 1rem;
     font-size: var(--fs-body-l);
     line-height: 1.6;
+
+    @include desktop {
+      margin-top: 2rem;
+    }
+  }
+
+  .faq-accordion {
+    @include tablet {
+      /* Start by removing FAQ borders */
+      --_faq-border: unset;
+      
+      details {
+        box-shadow: 0px 2px 5px var(--color-faqoutline);
+        border-radius: 8px;
+
+        p:first-child {
+          margin-top: 0;
+        }
+
+        /* Apply margin-top to all details-elements except first one */
+        &:not(:first-child) {
+          margin-top: 1rem;
+        }
+      }
+    }
+    @include desktop {
+      grid-area: faq-accordion;
+    }
   }
 
   .faq-accordion p {
@@ -29,6 +97,14 @@
     display: flex;
     justify-content: center;
     align-items: center;
+
+    @include tablet {
+      margin-top: 2rem;
+    }
+    @include desktop {
+      grid-area: contact;
+      margin-top: 3rem;
+    }
   }
 
   .contact-cards {
@@ -39,6 +115,10 @@
       /* Make cards take up equal width */
       flex-basis: 100%;
     }
+
+    @include tablet {
+      display: flex;
+    }
   }
 
   .contact-card {
@@ -53,6 +133,12 @@
     }
   }
 
+  .btn-contanct {
+    @include tablet {
+      display: none;
+    }
+  }
+
   .fa-comment-dots {
     /* Flip icon horizontally to match design */
     transform: scaleX(-1);
diff --git a/css/scss/sections/_footer.scss b/css/scss/sections/_footer.scss
index 665882e..a4d5df1 100644
--- a/css/scss/sections/_footer.scss
+++ b/css/scss/sections/_footer.scss
@@ -1,3 +1,5 @@
+@use '../abstracts/' as *;
+
 .footer {
   padding: 1.5rem 0;
   display: flex;
@@ -7,7 +9,17 @@
   font-size: var(--fs-body-s);
   line-height: 1.6;
 
+  @include desktop {
+    padding: 3rem 0;
+  }
+
   span {
     color: var(--color-gray-600);
   }
+
+  .footer-splitter {
+    @include tablet {
+      display: none;
+    }
+  }
 }
\ No newline at end of file