Further redesign

src/layouts/contactSection.astro

@@ -16,17 +16,23 @@ const { title } = Astro.props
 <style>
   h1 {
     color: var(--c-primary-text);
-    font-size: 26px;
+    font-size: 24px;
+    font-weight: 700;
     line-height: 32px;
-    letter-spacing: -1px;
-    margin: 0.5rem 0px 0.5rem 0.5em;
-    padding: 0.25rem 0.75rem;
+    font-family: 'Work Sans Adaptive', sans-serif;
     width: max-content;
-    background-color: var(--c-primary-background);
-    padding: 0.25rem 1rem;
     border-radius: 0.5rem;
-    padding-bottom: 0.5rem;
+    margin: 0 auto 0.5rem auto;
+    &:after {
+      content:' ';
+      display: block;
+      width: 75%;
+      margin: -2px auto auto auto;
+      border: 1px solid var(--c-accent-1);
+      box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
+    }
   }
+
   div {
     row-gap: 1em;
     column-gap: 1em;
@@ -51,6 +57,14 @@ const { title } = Astro.props
       margin-left: 3rem;
       margin-right: 3rem;
     }
+
+    h1 {
+      margin-left: 0;
+      margin-right: 0;
+      &:after {
+        margin: -2px 0 0;
+      }
+    }
   }
   @media (min-width: 1500px) {
     .base {