export function LegalPageHeader({
  title,
  intro,
  effectiveDate,
}: {
  title: string;
  intro: string;
  effectiveDate: string;
}) {
  return (
    <div className="border-b border-navy-100 pb-6">
      <h1 className="text-3xl font-serif font-bold text-navy-800">{title}</h1>
      <p className="mt-3 text-sm text-navy-600">{intro}</p>
      <dl className="mt-4 grid grid-cols-2 gap-x-6 gap-y-1 text-xs text-navy-500 sm:flex sm:gap-x-8">
        <div className="flex gap-1">
          <dt className="font-semibold text-navy-700">Effective date:</dt>
          <dd>{effectiveDate}</dd>
        </div>
        <div className="flex gap-1">
          <dt className="font-semibold text-navy-700">Operated by:</dt>
          <dd>Triora Living (Private) Limited</dd>
        </div>
      </dl>
    </div>
  );
}