import type { ReactNode } from "react";

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

export const Subheading = ({
  children,
  className,
  as = "p",
}: {
  children: ReactNode;
  className?: string;
  as?: "h1" | "h2" | "p";
}) => {
  const Tag = as;

  return (
    <Tag
      className={cn(
        "font-inter max-w-xl text-base text-neutral-500 md:text-lg dark:text-neutral-400",
        className,
      )}
    >
      {children}
    </Tag>
  );
};
