apply bold font family to the home page

Author: thescientist13

src/components/build-with-friends/build-with-friends.module.css

@@ -4,8 +4,8 @@
 }
 
 .heading {
+  font-family: var(--font-primary-bold);
   font-size: var(--font-size-6);
-  font-weight: var(--font-weight-9);
 }
 
 .subHeading {
@@ -32,7 +32,6 @@
 
 .icon span {
   vertical-align: middle;
-  font-weight: var(--font-weight-9);
   display: inline-block;
 }
 

src/components/capabilities/capabilities.css

@@ -9,6 +9,7 @@
 }
 
 .heading {
+  font-family: var(--font-primary-bold);
   font-size: var(--font-size-6);
 }
 

src/components/get-started/get-started.module.css

@@ -6,8 +6,8 @@
 }
 
 .heading {
+  font-family: var(--font-primary-bold);
   font-size: var(--font-size-5);
-  font-weight: var(--font-weight-9);
 }
 
 .snippet {

src/components/hero-banner/hero-banner.module.css

@@ -5,15 +5,14 @@
 }
 
 .heading {
-  font-size: var(--font-size-7);
-  font-weight: var(--font-weight-7);
+  font-family: var(--font-primary-bold);
+  font-size: var(--font-size-6);
   margin-block-start: 0;
   margin-block-end: 0;
 }
 
 .headingEmphasis {
-  font-size: var(--font-size-7);
-  font-weight: var(--font-weight-7);
+  font-size: var(--font-size-6);
   font-style: italic;
 }
 
@@ -104,6 +103,11 @@
 }
 
 @media (min-width: 768px) {
+  .heading,
+  .headingEmphasis {
+    font-size: var(--font-size-7);
+  }
+
   .buttonBlitz,
   .buttonStarted {
     width: 45%;

src/components/run-anywhere/run-anywhere.module.css

@@ -5,8 +5,8 @@
 }
 
 .heading {
+  font-family: var(--font-primary-bold);
   font-size: var(--font-size-5);
-  font-weight: var(--font-weight-9);
   margin: 0;
   padding: var(--size-fluid-1) 0;
   text-align: center;

src/components/why-greenwood/why-greenwood.module.css

@@ -7,8 +7,8 @@
 }
 
 .heading {
+  font-family: var(--font-primary-bold);
   font-size: var(--font-size-6);
-  font-weight: var(--font-weight-9);
   font-style: italic;
 }
 

src/styles/home.css

@@ -16,6 +16,13 @@ app-hero-banner {
 }
 
 @media (min-width: 1024px) {
+  app-hero-banner,
+  app-latest-post {
+    width: 80%;
+  }
+}
+
+@media (min-width: 1440px) {
   app-hero-banner,
   app-latest-post {
     width: 70%;