feat: add landing page hero section with animated background

- Create ColorWaveBackground canvas component with animated gradient blobs
- Create HeroSection with ShieldAI branding, headline, CTAs, and trust signals
- Compose landing page in index.tsx route with background + hero
- Add unit tests for HeroSection (13 tests) and ColorWaveBackground (8 tests)
- Background respects prefers-reduced-motion accessibility preference
- Responsive layout with mobile-first text sizing and stacked buttons

web/src/routes/index.tsx

@@ -1,25 +1,16 @@
 import { Title } from "@solidjs/meta";
-import { createAsync } from "@solidjs/router";
-import Counter from "~/components/Counter";
-import { api } from "~/lib/api";
+import { ColorWaveBackground, HeroSection } from "~/components/landing";
 
 export default function Home() {
-  const hello = createAsync(() => api.example.hello.query("world"));
   return (
-    <main>
-      <Title>Hello World</Title>
-      <h1>Hello world!</h1>
-      <Counter />
-      <p>
-        Visit{" "}
-        <a href="https://start.solidjs.com" target="_blank">
-          start.solidjs.com
-        </a>{" "}
-        to learn how to build SolidStart apps.
-      </p>
-      <pre>
-        <code>{JSON.stringify(hello(), null, 2)}</code>
-      </pre>
+    <main class="relative min-h-[calc(100vh-4rem)] overflow-hidden">
+      <Title>ShieldAI — AI-Powered Identity Protection</Title>
+      <div class="absolute inset-0 z-0">
+        <ColorWaveBackground />
+      </div>
+      <div class="relative z-10">
+        <HeroSection />
+      </div>
     </main>
   );
 }