fix: ui component updates and project formatting

components/ui/Heading.tsx

@@ -32,9 +32,9 @@ export function Heading({
   const effectiveSize = size || String(level) as HeadingSize;
   
   const sizes: Record<string, string> = {
-    'hero': 'font-heading text-4xl md:text-5xl lg:text-6xl font-black tracking-tight !leading-[0.9]',
+    'hero': 'font-heading text-3xl md:text-5xl lg:text-6xl font-black tracking-tight !leading-[0.9]',
     'section': 'font-heading text-3xl md:text-4xl lg:text-5xl font-extrabold tracking-tight !leading-[0.95]',
-    'subsection': 'font-heading text-2xl md:text-3xl lg:text-4xl font-bold tracking-tight leading-tight',
+    'subsection': 'font-heading text-xl md:text-3xl lg:text-4xl font-bold tracking-tight leading-tight',
     'card': 'text-xl md:text-2xl font-bold leading-snug',
     'small': 'text-lg font-semibold leading-snug',
     // Legacy support

components/ui/Section.tsx

@@ -3,7 +3,7 @@ import { cn } from './utils';
 
 export function Section({ className, children, ...props }: React.HTMLAttributes<HTMLElement>) {
   return (
-    <section className={cn('py-16 md:py-28 lg:py-36 overflow-hidden content-visibility-auto', className)} {...props}>
+    <section className={cn('py-12 md:py-28 lg:py-36 overflow-hidden content-visibility-auto', className)} {...props}>
       {children}
     </section>
   );