diff --git a/src/Components/Home/HomePage.js b/src/Components/Home/HomePage.js
index f1376b6..c714297 100644
--- a/src/Components/Home/HomePage.js
+++ b/src/Components/Home/HomePage.js
@@ -31,18 +31,41 @@ const HomePage = () => {
         >
           <div className="first-section-subcontainer">
             <div className="row upper-row-one">
-              <div className="col-md-12">
+              <div className="col-md-12 mobile-col-up">
                 <div className="heading-one-container">
                   <h1 className="heading-1">Novodraft: Legal AI.</h1>
+                  <h1 className="heading-1-mobile">Novodraft</h1>
+                  <h1 className="heading-2-mobile">
+                    AI-Assisted Legal Drafting
+                  </h1>
                   <h1 className="heading-2">
                     Draft documents faster <i>and </i> smarter.
                   </h1>
                 </div>
+                <div className="mobile-lower-header-1">
+                  <div className="mobile-lower-header-top">
+                    <div className="mobile-sw-deck">Discovery requests</div>
+                    <div className="mobile-sw-deck"> dramatically fast</div>
+                    <div className="mobile-sw-reptwo">
+                      <div className="ex-arca-two">Draft responses</div>
+                      <div className="ex-arca-two">in minutes</div>
+                    </div>
+                  </div>
+                  <div className="mobile-lower-header-bottom">
+                    <div className="mobile-lower-header-bottom-up"></div>
+                    <div className="mobile-lower-header-bottom-down">
+                      <Button
+                        className="primary-button homepage-button"
+                        labelText="Try It For Free"
+                        onClick={handleNavigate}
+                      />
+                    </div>
+                  </div>
+                </div>
                 <p className="text-block-1">
                   Discovery requests done dramatically fast – discovery
                   responses ready in minutes
                 </p>
-
                 <p className="text-block-two">
                   Reclaim hours every week. Spend time growing your practice, or
                   just get home by dinner.
@@ -119,6 +142,9 @@ const HomePage = () => {
             <h2 className="section-three-header">
               AI-Powered Legal Drafting Technology{" "}
             </h2>
+            <h2 className="section-three-header-mobile">
+              Novo Drafting Technology
+            </h2>
             <p className="section-three-subhead">
               Created by litigators to give you an edge.
             </p>
@@ -231,6 +257,10 @@ const HomePage = () => {
                 <h6 className="join-heading">
                   Request a demo - let us show you how.
                 </h6>
+                <h6 className="join-heading-mobile">
+                  Revolutionize your practice.
+                </h6>
+                <h6 className="join-heading-mobile">Let us show you how.</h6>
               </div>
               <div className="col-md-6 d-flex">
                 <button className="button-2" onClick={handleDemo}>
diff --git a/src/styles/homepage.scss b/src/styles/homepage.scss
index 7e9594e..a2db78d 100644
--- a/src/styles/homepage.scss
+++ b/src/styles/homepage.scss
@@ -699,35 +699,116 @@ li.nav-item {
   padding: 0 19px;
 }
 
+@media only screen and (min-width: 498px) {
+  .mobile-lower-header-1 {
+    display: none;
+  }
+  .heading-1-mobile {
+    display: none;
+  }
+  .mobile-lower-header-top {
+    display: none;
+  }
+  .mobile-lower-header-bottom {
+    display: none;
+  }
+  .mobile-lower-header-bottom-up {
+    display: none;
+  }
+  .mobile-lower-header-bottom-down {
+    display: none;
+  }
+  .join-heading-mobile {
+    display: none;
+  }
+  .section-three-header-mobile {
+    display: none;
+  }
+}
+
 @media only screen and (max-width: 1100px) {
   .join-heading {
     width: 370px;
   }
 }
 
-@media only screen and (max-width: 430px) {
+@media only screen and (max-width: 498px) {
   ul.navbar-nav {
     margin-left: auto;
   }
 
   .heading-one-container {
-    padding: 20px 0px 10px 0px;
-    margin-top: 15px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 16px 0px 10px 0px;
+    margin-top: 0px;
     max-width: 290px;
   }
 
+  .mobile-lower-header-top {
+    height: 60%;
+
+    padding-top: 12px;
+    color: #fff;
+  }
+
+  .mobile-sw-deck {
+    color: #fff;
+    font-size: 16px;
+    font-family: Roboto;
+    font-weight: 400;
+    letter-spacing: 0.01rem;
+    margin-top: -4px;
+  }
+
+  .mobile-sw-dtrk {
+    color: #fff;
+    font-size: 16px;
+    font-family: Roboto;
+    font-weight: 400;
+    letter-spacing: 0.01rem;
+    margin-top: 58px;
+  }
+
+  .ex-arca-two {
+    color: white;
+    line-height: 1.2;
+  }
+  .mobile-sw-reptwo {
+    height: 140px;
+    padding-top: 51px;
+  }
+
+  .mobile-lower-header-bottom {
+    height: 40%;
+  }
+
+  .mobile-lower-header-bottom-up {
+    height: 50%;
+  }
+
+  .mobile-lower-header-bottom-bottom {
+    height: 50%;
+  }
   .logo-container {
     margin-left: -24px;
   }
 
   .first-section-subcontainer {
+    width: 100%;
     padding-top: 4px;
     padding-left: 0px;
   }
 
+  .mobile-col-up {
+    height: 400px;
+  }
+
   .try-it-button-box {
     align-items: end;
     margin-top: -6px;
+    display: none;
   }
 
   .try-it-button-box > button {
@@ -735,16 +816,21 @@ li.nav-item {
     margin-left: 10px;
   }
 
+  .mobile-lower-header-1 {
+    width: 60%;
+    height: 260px;
+  }
+
   .upper-row-one {
     padding-left: 10px;
   }
 
   .text-block-1 {
-    visibility: hidden;
+    visibility: none;
   }
 
   .text-block-two {
-    visibility: hidden;
+    display: none;
   }
 
   section.section-1 {
@@ -772,24 +858,18 @@ li.nav-item {
   }
 
   h1.heading-1 {
-    color: #fff;
+    display: none;
+  }
+
+  .heading-1-mobile {
     font-family: Roboto;
-    font-size: 27px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 32px; /* 140.625% */
-    text-transform: capitalize;
+    font-size: 42px;
+    color: #fff;
+    margin-bottom: 1px;
   }
 
   p.text-block-1 {
-    color: #fff;
-    font-family: Roboto;
-    font-size: 16px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 18.756px; /* 123.983% */
-    width: 100%;
-    padding: 10px 0 !important;
+    display: none;
   }
 
   .home-col-50 {
@@ -815,8 +895,11 @@ li.nav-item {
   }
 
   .heading-2-mobile {
+    margin-top: 6px;
+    font-weight: 400;
     display: flex;
     font-size: 1.365rem;
+    color: #fff;
   }
 
   button.button-1 {
@@ -913,7 +996,27 @@ li.nav-item {
   }
 
   .section-three-header {
-    font-size: 21px;
+    display: none;
+  }
+
+  .section-three-header-box {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin: 0.5rem 0rem;
+    padding: 0.3rem;
+  }
+
+  .section-three-header-mobile {
+    font-size: 20px;
+    font-family: Roboto;
+    font-weight: 400;
+    letter-spacing: 0.09px;
+    align-items: center;
+    justify-content: center;
+    margin: 12px auto 12px auto;
+    color: #757575;
+    letter-spacing: 0.13rem;
   }
 
   .section-three-subhead {
@@ -1170,7 +1273,7 @@ li.nav-item {
     justify-content: center;
   }
 
-  .join-heading {
+  .join-heading-mobile {
     width: 250px;
     font-size: 1rem;
     text-align: justify;
@@ -1181,6 +1284,11 @@ li.nav-item {
     margin-left: auto;
     margin-right: auto;
     color: #1f74a7;
+    display: flex;
+  }
+
+  .join-heading {
+    display: none;
   }
 
   button.button-2 {