The Svelte 5 SSG Migration (#1)

- Migrates the site to Svelte 5
- Still generates a static site with inlined critical path CSS for the ultimate in performance
- Opens up future possibilities for site growth

Reviewed-on: #1
Co-authored-by: mifi <badmf@mifi.dev>
Co-committed-by: mifi <badmf@mifi.dev>

src/lib/components/EngagementsSection.svelte

@@ -0,0 +1,65 @@
+<script lang="ts">
+    import { engagements } from '$lib/data/engagements';
+</script>
+
+<section id="engagements" class="section" aria-labelledby="engagements-heading">
+    <div class="container">
+        <h2 id="engagements-heading" class="section-title">Recent Engagements</h2>
+        <dl class="engagements-list">
+            {#each engagements as engagement (engagement.title)}
+                <div class="engagement">
+                    <dt>{engagement.title}</dt>
+                    <dd>{engagement.description}</dd>
+                </div>
+            {/each}
+        </dl>
+    </div>
+</section>
+
+<style>
+    .engagements-list {
+        max-width: var(--max-text-width);
+        margin: 0 auto;
+    }
+
+    .engagement {
+        margin-bottom: var(--space-xl);
+        padding-bottom: var(--space-lg);
+        padding-left: var(--space-md);
+        border-left: 3px solid var(--color-border);
+        transition: border-color var(--transition-base);
+
+        &:hover,
+        &:focus-within {
+            border-left-color: var(--color-primary);
+        }
+
+        &:last-child {
+            margin-bottom: 0;
+            padding-bottom: 0;
+        }
+
+        @media (max-width: 768px) {
+            padding-left: var(--space-sm);
+        }
+
+        @media (prefers-contrast: high) {
+            border-left-width: 4px;
+        }
+
+        & dt {
+            margin-bottom: var(--space-sm);
+            font-size: var(--font-size-large);
+            font-weight: var(--font-weight-semibold);
+            color: var(--color-text);
+            line-height: var(--line-height-tight);
+        }
+
+        & dd {
+            margin: 0;
+            font-size: var(--font-size-base);
+            line-height: var(--line-height-relaxed);
+            color: var(--color-text-secondary);
+        }
+    }
+</style>