import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
import { useTranslations } from "next-intl";
import React from "react";

export default function ContactHeader() {
  const t = useTranslations();
  return (
    <div className="mb-8 text-center">
      <div className="mb-4 flex items-center justify-center gap-2">
        <DotAnimatsiya />
        <span className="font-almarai text-sm font-semibold tracking-wider text-white">
          {t("contact.banner.title")}
        </span>
      </div>
      <h2
        className="uppercase font-unbounded bg-linear-to-br from-white via-white to-black
  text-transparent bg-clip-text  text-4xl font-bold tracking-wide md:text-5xl"
      >
        {t("contact.banner.subtitle")}
      </h2>
      <p className="font-almarai mt-3 text-sm text-gray-300 italic">
        {t("contact.banner.description")}
      </p>
    </div>
  );
}