type Props = {
  title: string;
  image: string;
  subtitle: string;
};

const PageTitle = ({ title, image, subtitle }: Props) => {
  return (
    <div className=" h-52 lg:h-72">
      <img
        src={image}
        alt="Background Image"
        className="absolute top-0 object-cover w-full lg:h-96 h-80"
      />
      <div className="absolute w-full">
        <div className="lg:w-10/12 flex gap-16 px-5 lg:px-0 pt-20 md:pt-0 lg:mx-auto">
          <div className="custom-mistery font-medium text-6xl ">{title}</div>
          <div className="py-32 hidden md:block text-4xl  lg:text-6xl custom-oswald font-semibold">
            {subtitle}
          </div>
        </div>
      </div>
    </div>
  );
};

export default PageTitle;
