import { cn } from "@/lib/utils";

function SectionHeading({
    title,
    subtitle,
    invertColors,
}: {
    title: string;
    subtitle: string;
    invertColors?: boolean;
}) {
    return (
        <div className="relative grid w-full place-items-center gap-2 text-center">
            <h2
                className={cn(
                    "z-10 font-serif text-lg leading-none font-semibold uppercase md:text-xl lg:text-2xl",
                    invertColors ? "text-blue-100" : "text-primary",
                )}
            >
                {subtitle}
            </h2>

            <div
                className={cn(
                    "text-3xl font-bold md:text-4xl lg:text-5xl",
                    invertColors ? "text-blue-50" : "text-primary",
                )}
            >
                {title}
            </div>
        </div>
    );
}

export default SectionHeading;
