website refactor

apps/website/components/home/Hero.tsx

@@ -0,0 +1,65 @@
+'use client';
+
+import { Heading } from '@/ui/Heading';
+import { Text } from '@/ui/Text';
+import { Button } from '@/ui/Button';
+import { Section } from '@/ui/Section';
+import { ButtonGroup } from '@/ui/ButtonGroup';
+import { Stack } from '@/ui/Stack';
+import { Box } from '@/ui/Box';
+
+/**
+ * Hero - Refined with Dieter Rams principles.
+ * "Less, but better."
+ * Focuses on clarity, honesty, and unobtrusive design.
+ */
+export function Hero() {
+  return (
+    <Section variant="default" py={32}>
+      <Box maxWidth="54rem">
+        <Box marginBottom={24}>
+          <Text 
+            variant="primary" 
+            weight="bold" 
+            uppercase 
+            size="xs" 
+            leading="none"
+            block
+            letterSpacing="0.2em"
+            marginBottom={10}
+          >
+            Sim Racing Infrastructure
+          </Text>
+          
+          <Heading level={1} weight="bold" size="4xl">
+            Professional League Management.<br />
+            Engineered for Control.
+          </Heading>
+        </Box>
+        
+        <Box marginBottom={24}>
+          <Text size="xl" variant="med" leading="relaxed" block maxWidth="42rem">
+            GridPilot eliminates the administrative overhead of running iRacing leagues. 
+            No spreadsheets. No manual points. No protest chaos. 
+            Just pure competition, structured for growth.
+          </Text>
+        </Box>
+
+        <ButtonGroup gap={10}>
+          <Button
+            variant="primary"
+            size="lg"
+          >
+            Create Your League
+          </Button>
+          <Button
+            variant="secondary"
+            size="lg"
+          >
+            View Demo
+          </Button>
+        </ButtonGroup>
+      </Box>
+    </Section>
+  );
+}