website poc

apps/website/components/landing/Hero.tsx

@@ -0,0 +1,34 @@
+import Button from '@/components/ui/Button';
+import Container from '@/components/ui/Container';
+import Heading from '@/components/ui/Heading';
+
+export default function Hero() {
+  return (
+    <section className="relative overflow-hidden bg-deep-graphite px-6 py-24 sm:py-32 lg:px-8">
+      {/* Subtle radial gradient overlay */}
+      <div className="absolute inset-0 bg-gradient-radial from-primary-blue/10 via-transparent to-transparent opacity-40" />
+      
+      {/* Optional motorsport grid pattern */}
+      <div className="absolute inset-0 opacity-[0.015]" style={{
+        backgroundImage: `linear-gradient(rgba(255,255,255,0.5) 1px, transparent 1px),
+                         linear-gradient(90deg, rgba(255,255,255,0.5) 1px, transparent 1px)`,
+        backgroundSize: '40px 40px'
+      }} />
+      
+      <Container size="sm" center>
+        <Heading level={1} className="text-white leading-tight tracking-tight">
+          Where iRacing League Racing Finally Comes Together
+        </Heading>
+        <p className="mt-8 text-lg leading-relaxed text-slate-400 font-light">
+          No more Discord chaos. No more spreadsheets. No more manual standings.
+          GridPilot is the dedicated home for serious iRacing leagues that want structure over chaos.
+        </p>
+        <div className="mt-12 flex items-center justify-center">
+          <Button as="a" href="#early-access" className="shadow-glow hover:shadow-glow-strong transition-shadow duration-300">
+            Get Early Access
+          </Button>
+        </div>
+      </Container>
+    </section>
+  );
+}