import React, { memo } from "react";
import { cn } from "@/lib/utils";

const Title = ({
  Tag = "h2",
  text,
  className = "",
  style = {},
}: {
  Tag?: React.ElementType;
  text: string;
  className?: string;
  style?: React.CSSProperties;
}) => {
  const defaultStyles =
    "text-[#28241E] font-times-sans capitalize leading-[1.1] text-[clamp(30px,10.7vw,36px)] md:text-[72px] lg:text-[80px]";

  return (
    <Tag aria-label={text} className={cn(defaultStyles, className)} style={style}>
      {text}
    </Tag>
  );
};

export default memo(Title);