import React from 'react'

export interface PageHeaderProps {
  title: string
  subtitle?: string | null
}

export const PageHeaderBlock: React.FC<PageHeaderProps> = ({ title, subtitle }) => {
  return (
    <section className="bg-card border-b border-border py-16 md:py-20 mb-12">
      <div className="container-premium text-center max-w-4xl mx-auto">
        <h1 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight leading-tight">
          {title}
        </h1>
        {subtitle && (
          <p className="mt-4 text-lg md:text-xl text-foreground/70 leading-relaxed max-w-2xl mx-auto">
            {subtitle}
          </p>
        )}
      </div>
    </section>
  )
}