- brought changes

app/[locale]/_components/Process.jsx

@@ -25,7 +25,7 @@ const processData = [
 const Process = () => {
   const t = useTranslations("Process");
   return (
-    <div id="process" className="feature-section px-4 flex flex-col py-36">
+    <div id="process" className="feature-section px-4 flex flex-col py-36 ">
       <div className="bg-effect">
         <img
           src="/images/feature.gif"

app/[locale]/_components/ProcessCta.jsx

@@ -5,7 +5,14 @@ const ProcessCta = (props) => {
   const { title, legend } = props;
   return (
     <div className="flex flex-col">
-      <Button className="mr-auto">{title}</Button>
+      <a
+        data-cursor="pointer"
+        href="https://calendly.com/aimplify"
+        target="_blank"
+        className="text-md font-medium leading-6 w-fit text-white bg-primary-500 hover:bg-primary-700 px-6 py-2.5 rounded-full"
+      >
+        {title}
+      </a>
       <div className="flex flex-row justify-start items-center mt-5 gap-3">
         <img src="https://framerusercontent.com/images/0NGbzqzLBcVOh92Njp4JoiRxaBE.svg" />
         <span className="text-sm text-gray-400">{legend}</span>

app/[locale]/_components/Services.jsx

@@ -23,6 +23,10 @@ const servicesData = [
 
 const Services = () => {
   const t = useTranslations("Services");
+  const variants = {
+    hidden: { opacity: 0, y: 20 },
+    visible: { opacity: 1, y: 0 },
+  };
 
   return (
     <div
@@ -35,7 +39,7 @@ const Services = () => {
             key={service.localeKey}
             className={clsx(
               index % 2 === 0 ? "xl:flex-row" : "xl:flex-row-reverse",
-              `flex gap-10  px-20 items-center max-w-screen-2xl relative flex-col`
+              `flex gap-10 px-20 items-center max-w-screen-2xl relative flex-col`
             )}
           >
             <div
@@ -59,9 +63,14 @@ const Services = () => {
               <p className="font-regular text-gray-400">
                 {t(`${service.localeKey}.description`)}
               </p>
-              <Button className="md:flex hidden">
+              <a
+                data-cursor="pointer"
+                href="https://calendly.com/aimplify"
+                target="_blank"
+                className="text-md font-medium leading-6 text-center md:flex hidden w-fit text-white bg-[#2FD69E] px-6 py-2.5 rounded-full hover:bg-primary-700"
+              >
                 {t(`${service.localeKey}.ctaText`)}
-              </Button>
+              </a>
             </div>
           </div>
         );

app/[locale]/_components/WhyCta.jsx

@@ -6,7 +6,14 @@ const WhyCta = () => {
 
   return (
     <div className="flex flex-col">
-      <Button className="">{t("cta")}</Button>
+      <a
+        data-cursor="pointer"
+        href="https://calendly.com/aimplify"
+        target="_blank"
+        className="text-md font-medium leading-6 text-center  text-white bg-[#2FD69E] px-6 py-2.5 rounded-full hover:bg-primary-700"
+      >
+        {t("cta")}
+      </a>
       <div className="flex flex-row justify-center items-center mt-3 gap-2">
         <img src="https://framerusercontent.com/images/0NGbzqzLBcVOh92Njp4JoiRxaBE.svg" />
         <span className="text-sm">{t("legend")}</span>

app/[locale]/layout.js

@@ -1,18 +1,32 @@
 import { Inter, DM_Sans } from "next/font/google";
 import { NextIntlClientProvider } from "next-intl";
-import { unstable_setRequestLocale } from "next-intl/server";
-
-import { useLocale } from "next-intl";
+import {
+  unstable_setRequestLocale,
+  getFormatter,
+  getNow,
+  getTimeZone,
+  getTranslator,
+} from "next-intl/server";
 import { notFound } from "next/navigation";
 import "@/app/globals.css";
 
 const inter = Inter({ subsets: ["latin"] });
 const dmSans = DM_Sans({ subsets: ["latin"] });
 
-export const metadata = {
-  title: "Aimplifyy",
-  description: "AI Automation agency",
-};
+export async function generateMetadata({ params: { locale } }) {
+  const t = await getTranslator(locale);
+  const formatter = await getFormatter(locale);
+  const now = await getNow(locale);
+  const timeZone = await getTimeZone(locale);
+
+  return {
+    title: t("Title"),
+    other: {
+      currentYear: formatter.dateTime(now, { year: "numeric" }),
+      timeZone: timeZone || "N/A",
+    },
+  };
+}
 
 const locales = ["en", "fr"];
 

app/globals.css

@@ -206,6 +206,7 @@ p {
 
 .feature-section .feature-bg {
   position: absolute;
+  z-index: -1;
   bottom: 0;
   opacity: 0.2;
   width: 100%;

locales/en.json

@@ -1,4 +1,5 @@
 {
+  "Title": "Aimplify - AI Automation for your business",
   "Banner": {
     "title": "Accepting 3 new clients. Get started today."
   },

locales/fr.json

@@ -1,4 +1,5 @@
 {
+  "Title": "Aimplify - Automatisation IA pour votre entreprise",
   "Banner": {
     "title": "Nous acceptons 3 nouveaux clients. Lancez-vous dès aujourd'hui."
   },

package.json

@@ -16,6 +16,7 @@
     "@heroicons/react": "^2.0.18",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
+    "framer-motion": "^10.16.4",
     "lottie-react": "^2.4.0",
     "next": "^14.0.0",
     "next-intl": "^3.0.0-rc.7",