Home page content, some more styling for headings & the page nav

src/css/compositions/stack.css

@@ -1,15 +1,23 @@
 [class*="stack"] > * + * {
-	margin-block-start: var(--vertical-spacing, 1.5rem);
+  margin-block-start: var(--vertical-spacing, 1.5rem);
 }
 
 .stack-sm {
-	--vertical-spacing: var(--space-size-s);
+  --vertical-spacing: var(--space-size-s);
 }
 
 .stack-md {
-	--vertical-spacing: var(--space-size-m);
+  --vertical-spacing: var(--space-size-m);
 }
 
 .stack-lg {
-	--vertical-spacing: var(--space-size-l);
-}
+  --vertical-spacing: var(--space-size-l);
+}
+
+.stack-xl {
+  --vertical-spacing: var(--space-size-xl);
+}
+
+.stack-2xl {
+  --vertical-spacing: var(--space-size-2xl);
+}

src/css/exceptions/site-title.css

@@ -0,0 +1,6 @@
+.site-title {
+  font-size: var(--text-size-xl);
+  letter-spacing: -0.5rem;
+  line-height: 1;
+  text-decoration: none;
+}

src/css/globals.css

@@ -14,21 +14,24 @@ h5 {
   display: flex;
   font-weight: bold;
   gap: 1ch;
-  line-height: 1.2;
+  line-height: 1;
   margin: 0;
 }
 
 h1 {
   font-size: var(--text-size-2xl);
   word-wrap: normal;
+  text-underline-offset: var(--space-size-2xs);
 }
 
 h2 {
   font-size: var(--text-size-xl);
+  text-underline-offset: var(--space-size-3xs);
 }
 
 h3 {
   font-size: var(--text-size-l);
+  text-underline-offset: var(--space-size-3xs);
 }
 
 a {
@@ -50,10 +53,24 @@ nav {
 }
 
 header {
+  align-items: center;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
   padding-top: var(--space-size-s);
   padding-bottom: var(--space-size-s);
 }
 
+p {
+  line-height: 1.4;
+  max-width: 50ch;
+}
+
+footer {
+  padding-top: var(--space-size-l);
+  width: 100vw;
+}
+
 @media (min-width: 50em) {
   h1::before {
     content: "#";