// Update the SectionHeading component to use h2 for main headings
import { cn } from "@/lib/utils"

interface SectionHeadingProps {
  title: string
  description?: string
  className?: string
}

export function SectionHeading({ title, description, className }: SectionHeadingProps) {
  return (
    <div className={cn("space-y-3 mb-8", className)}>
      <h2 className="text-3xl font-semibold tracking-tight">{title}</h2>
      {description && <p className="text-base text-muted-foreground leading-relaxed">{description}</p>}
    </div>
  )
}

export function SubsectionHeading({ title, description, className }: SectionHeadingProps) {
  return (
    <div className={cn("space-y-2 mb-6", className)}>
      <h3 className="text-xl font-semibold tracking-tight">{title}</h3>
      {description && <p className="text-sm text-muted-foreground leading-relaxed">{description}</p>}
    </div>
  )
}

export function ComponentHeading({ title, description, className }: SectionHeadingProps) {
  return (
    <div className={cn("space-y-1 mb-4", className)}>
      <h4 className="text-lg font-medium tracking-tight">{title}</h4>
      {description && <p className="text-sm text-muted-foreground">{description}</p>}
    </div>
  )
}