Changed string values to use i18n

src/Components/Pages/Services/Services.tsx

@@ -1,13 +1,16 @@
+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>
-        We've got your{" "}
+        {t("services.heading.part1")}{" "}
         <span className="relative inline-block">
-          footprint{" "}
+          {t("services.heading.part2")}{" "}
           <img
             src={Underline}
             alt="underline"
@@ -16,16 +19,12 @@ const Services = () => {
         </span>{" "}
       </h1>
       <h1>
-        bullsh
-        <span className="bg-clip-text text-transparent bg-gradient-to-br from-gold-light to-gold-dark">
-          *
-        </span>
-        t covered
+        {t("services.heading.part3")}
+        <span className="gold-text">*</span>
+        {t("services.heading.part4")}
       </h1>
 
-      <h2 className="sub-header-text">
-        Unlock the full potential of your business with our services.
-      </h2>
+      <h2 className="sub-header-text">{t("services.subheading")}</h2>
 
       <ServiceCardContainer />
     </div>