feat: Implement initial website structure, core pages, and layout components, including a redesigned homepage.

components/layout/Section.tsx

@@ -1,20 +1,32 @@
 import type { ElementType, ReactNode } from "react";
 
+type SectionVariant = "default" | "hero" | "sm" | "lg" | "flush";
+
 interface SectionProps {
   children: ReactNode;
   className?: string;
   as?: ElementType;
+  variant?: SectionVariant;
+  id?: string;
 }
 
 export function Section({
   children,
   className = "",
   as: Tag = "section",
+  variant = "default",
+  id,
 }: SectionProps) {
+  const variantClasses: Record<SectionVariant, string> = {
+    default: "section",
+    hero: "section section--hero",
+    sm: "section section--sm",
+    lg: "section section--lg",
+    flush: "section section--flush",
+  };
+
   return (
-    <Tag
-      className={`py-[var(--section-spacing-y)] ${className}`.trim()}
-    >
+    <Tag id={id} className={`${variantClasses[variant]} ${className}`.trim()}>
       {children}
     </Tag>
   );