import { useTranslations } from "next-intl";
import { packagesHeaderConfig } from "./packagesConfig";

export default function PackagesHeader() {
  const t = useTranslations("packages");
  return (
    <div className="flex flex-col items-center text-center gap-5 md:gap-10">
      <h2 className="text-primary-dark font-bold text-[24px] md:text-[48px]">
        {t(packagesHeaderConfig.titleKey)}
      </h2>
      <p className="text-[12px] md:text-[24px] text-text">
        {t(packagesHeaderConfig.descriptionKey)}
      </p>
    </div>
  );
}