Add theme toggle, hero snippet, and reorganize homepage components

- Set up next-themes with a light/dark toggle in the header and move all
  sections onto theme tokens; dark mode stays pure black
- Replace the hero terminal line with the AI Elements Snippet component
- Restructure components into layout/, sections/, and shared/ with
  site-wide config in lib/site.ts

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

app/layout.tsx

@@ -1,10 +1,12 @@
 import type { Metadata } from 'next';
+
+import { ThemeProvider } from '@/components/layout/theme-provider';
+import { siteConfig } from '@/lib/site';
 import './globals.css';
 
 export const metadata: Metadata = {
-  title: 'Vertex — Build. Preview. Ship.',
-  description:
-    'Vertex gives frontend teams the tooling and cloud infrastructure to build, preview, and ship a faster web.',
+  title: siteConfig.title,
+  description: siteConfig.description,
 };
 
 export default function RootLayout({
@@ -13,9 +15,16 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="en" className="dark h-full antialiased">
-      <body className="min-h-full flex flex-col bg-black text-white font-sans selection:bg-white selection:text-black">
-        {children}
+    <html lang="en" suppressHydrationWarning className="h-full antialiased">
+      <body className="min-h-full flex flex-col bg-background text-foreground font-sans selection:bg-foreground selection:text-background">
+        <ThemeProvider
+          attribute="class"
+          defaultTheme="dark"
+          enableSystem
+          disableTransitionOnChange
+        >
+          {children}
+        </ThemeProvider>
       </body>
     </html>
   );