website poc

apps/website/components/ui/Heading.tsx

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+
+interface HeadingProps {
+  level: 1 | 2 | 3;
+  children: ReactNode;
+  className?: string;
+}
+
+export default function Heading({ level, children, className = '' }: HeadingProps) {
+  const baseStyles = 'font-bold tracking-tight';
+  
+  const levelStyles = {
+    1: 'text-4xl sm:text-6xl',
+    2: 'text-3xl sm:text-4xl',
+    3: 'text-xl sm:text-2xl'
+  };
+
+  const Tag = `h${level}` as keyof JSX.IntrinsicElements;
+
+  return (
+    <Tag className={`${baseStyles} ${levelStyles[level]} ${className}`}>
+      {children}
+    </Tag>
+  );
+}