Update mobile spacing for centered header and nav

Author: wkirby

src/styles/components/Navbar.module.scss

@@ -57,7 +57,7 @@
     margin-left: auto;
     display: flex;
     flex-direction: row;
-    gap: var(--space-2xs);
+    gap: var(--space-3xs);
 
     @media (min-width: vars.$mobile) {
       gap: var(--space-s);
@@ -69,15 +69,15 @@
     font-size: var(--font_size_sm);
     color: var(--link_color_dark);
     text-decoration: none;
-    padding: var(--space-2xs);
+    padding: var(--space-3xs);
     line-height: 1;
 
     transition:
       background-color var(--easing) var(--timing_sm),
       opacity var(--easing) var(--timing_sm);
 
     &--hide_mobile {
-      @media (max-width: var(--mobile)) {
+      @media (max-width: vars.$mobile) {
         display: none;
       }
     }

src/styles/components/PageHeader.module.scss

@@ -1,4 +1,4 @@
-@use 'styles/vars';
+@use "styles/vars";
 
 .page_header {
   display: flex;
@@ -18,5 +18,12 @@
 
   &--center {
     align-items: center;
+
+    .page_header__title {
+      text-align: center;
+    }
+    .page_header__subtitle {
+      text-align: center;
+    }
   }
 }