---
interface Props {
  title: string;
  description?: string;
}

const { title, description } = Astro.props;
---

<section class="gradient-header py-12">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 text-center">
    <h1 class="text-4xl font-bold gradient-text-hero mb-4">{title}</h1>
    {description && (
      <p class="text-xl text-gray-100">{description}</p>
    )}
  </div>
</section>