---
interface Props {
  label?: string;
  heading: string;
  tag?: "h1" | "h2";
}

const { label, heading, tag = "h2" } = Astro.props;
const Tag = tag;
---

{label && (
  <span class="text-label-md uppercase tracking-wider text-primary-container mb-stack-md block">
    {label}
  </span>
)}
<Tag class="text-headline-lg-mobile md:text-headline-lg font-bold text-on-background leading-tight">
  {heading}
</Tag>