feat(content): reconcile homepages and restore HSA/FSA section

www/src/components/home/HomeHsaFsa.astro

@@ -0,0 +1,22 @@
+---
+import type { HsaFsaSection } from '../../types/home-sections';
+interface Props { section: HsaFsaSection }
+const { section } = Astro.props;
+---
+<section class="section section-tint hsa-fsa-section">
+  <div class="container feature-grid hsa-fsa-grid">
+    <img src={`/assets/images/${section.image}`} alt={section.imageAlt} loading="lazy" />
+    <div>
+      <h2>{section.heading}</h2>
+      <p>{section.body}</p>
+    </div>
+  </div>
+</section>
+
+<style>
+  .hsa-fsa-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
+  .hsa-fsa-grid img { width: 100%; max-width: 500px; max-height: 425px; object-fit: contain; justify-self: center; }
+  @media (max-width: 760px) {
+    .hsa-fsa-grid { grid-template-columns: minmax(0, 1fr); }
+  }
+</style>

www/src/components/home/HomeLogos.astro

@@ -0,0 +1,20 @@
+---
+import type { LogosSection } from '../../types/home-sections';
+interface Props { section: LogosSection }
+const { section } = Astro.props;
+---
+<div class="section home-logos">
+  <div class="container logo-grid">
+    {section.items.map(({ file, alt }) => (
+      <img src={`/assets/images/${file}`} {alt} loading="lazy" />
+    ))}
+  </div>
+</div>
+
+<style>
+  .logo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); align-items: center; }
+  .logo-grid img { max-width: 100%; height: auto; justify-self: center; }
+  @media (max-width: 760px) {
+    .logo-grid { grid-template-columns: minmax(0, 1fr); }
+  }
+</style>

www/src/components/home/HomeProcess.astro

@@ -7,10 +7,19 @@ const { section } = Astro.props;
   <div class="container">
     <h2>{section.heading}</h2>
     <div class="process-grid">
-      {section.steps.map(({ icon, label }) => (
+      {section.steps.map(({ icon, label, href }) => (
         <div>
-          <img src={`/assets/images/${icon}`} alt="" />
-          <p>{label}</p>
+          {href ? (
+            <a href={href}>
+              <img src={`/assets/images/${icon}`} alt="" />
+              <p>{label}</p>
+            </a>
+          ) : (
+            <>
+              <img src={`/assets/images/${icon}`} alt="" />
+              <p>{label}</p>
+            </>
+          )}
         </div>
       ))}
     </div>
@@ -23,6 +32,8 @@ const { section } = Astro.props;
   .process-grid div { background: white; min-height: 190px; padding: 3.2rem 1rem; position: relative; text-align: center; transition: transform .3s ease-in-out; }
   .process-grid div:hover { transform: scale(1.05); z-index: 1; }
   .process-grid img { margin: 0 auto 1rem; width: 42%; }
+  .process-grid a { display: block; color: inherit; text-decoration: none; }
+  .process-grid a:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 8px; }
   @media (max-width: 760px) {
     .process-grid { grid-template-columns: 1fr 1fr; }
   }