import { useTranslation } from "react-i18next";
import Underline from "../../../assets/Underline.svg";
import ServiceCardContainer from "./ServiceCardContainer";

const Services = () => {
  const { t } = useTranslation();

  return (
    <div className="header-text">
      <h1>
        {t("services.heading.part1")}
        <span className="relative inline-block">
          {t("services.heading.part2")}{" "}
          <img
            src={Underline}
            alt="underline"
            className="absolute bottom-0 left-0"
          />
        </span>{" "}
      </h1>
      <h1>
        {t("services.heading.part3")}
      </h1>
      <ServiceCardContainer />
    </div>
  );
};
export default Services;