Moved hero to bottom and removed WIP notice.

src/scss/styles.scss

@@ -16,9 +16,9 @@ $primary: $red; // Default: $blue
 @import "bootstrap/scss/variables-dark";
 
 // Include any default map overrides here
-$carousel-dark-indicator-active-bg:  $white;
-$carousel-dark-caption-color:        $white;
-$carousel-dark-control-icon-filter:  unset;
+$carousel-dark-indicator-active-bg: $white;
+$carousel-dark-caption-color:       $white;
+$carousel-dark-control-icon-filter: unset;
 
 // Include remainder of required parts
 @import "bootstrap/scss/maps";
@@ -190,7 +190,8 @@ h6:hover .anchor-link {
   color: var(--bs-primary);
 }
 
-.navbar {
+.navbar,
+.hero-body {
   background-image: none !important;
   background-color: rgba(22, 23, 25, 0.6) !important;
   transition: background-color 0.5s;
@@ -204,11 +205,38 @@ body.is-scrolled .navbar {
   max-width: fit-content;
 }
 
-.nav-item,
-.nav-link {
+.hero {
+  height: 100vh;
+}
+
+.hero-body {
+  width: 100%;
+  padding: 1rem;
+  @extend .h5;
+  @extend .text-center;
   @extend .text-white;
-  font-family: 'Eras ITC',
-  var(--#{$prefix}font-sans-serif);
+
+  .btn {
+    @extend .text-white;
+    @extend .h5;
+  }
+}
+
+.nav-item {
+
+  .nav-link,
+  .btn {
+    @extend .text-white;
+    @extend .h5;
+  }
+}
+
+.btn {
+
+  .fa-regular,
+  .fa-solid {
+    color: inherit;
+  }
 }
 
 .navbar-nav .btn {
@@ -218,10 +246,6 @@ body.is-scrolled .navbar {
   padding-left: var(--bs-navbar-nav-link-padding-x);
 }
 
-.hero {
-  height: 100vh;
-}
-
 .row {
   margin-top: unset;
   --bs-gutter-y: var(--bs-gutter-x);