✨ feat: enhance HeroBlock with SPA navigation for anchor links and update feature card styles

frontend/src/blocks/HeroBlock.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
     import { reveal } from "../lib/actions/reveal"
+    import { spaLink } from "../lib/navigation"
 
     let { block }: { block: ContentBlockEntry } = $props()
 
     const hasImage = $derived(block.heroImage?.externalUrl || block.heroImage?.image)
+    const isAnchorLink = $derived(block.callToAction?.buttonLink?.startsWith("#"))
 </script>
 
 <section
@@ -53,6 +55,7 @@
                 <a
                     href={block.callToAction.buttonLink || "#"}
                     target={block.callToAction.buttonTarget || undefined}
+                    use:spaLink={{ noScroll: isAnchorLink }}
                     class="inline-flex items-center gap-2 bg-brand-500 hover:bg-brand-400 text-white font-bold px-8 py-4 rounded-xl text-lg transition-all duration-300 hover:shadow-lg hover:shadow-brand-500/25 hover:-translate-y-0.5"
                 >
                     {block.callToAction.buttonText}

frontend/src/css/style.css

@@ -128,8 +128,14 @@
 }
 
 .feature-card .feature-icon {
-    font-size: 2.5rem;
     margin-bottom: 1rem;
+    color: var(--color-brand-600);
+    line-height: 1;
+}
+
+.feature-card .feature-icon svg {
+    width: 2.5rem;
+    height: 2.5rem;
 }
 
 .feature-card h3 {

frontend/src/lib/navigation.ts

@@ -173,6 +173,16 @@ export const spaLink = (node: HTMLAnchorElement, options: SpaNavigateOptions = {
             return
         }
 
+        // Handle anchor links: scroll to element instead of SPA navigation
+        if (href.startsWith("#")) {
+            event.preventDefault()
+            const target = document.getElementById(href.slice(1))
+            if (target) {
+                target.scrollIntoView({ behavior: "smooth" })
+            }
+            return
+        }
+
         // Skip if target is set (e.g., _blank)
         if (node.target && node.target !== "_self") {
             return