Update src/app/styles/variables.css

Merge version_1 into main

src/app/page.tsx

@@ -2,9 +2,9 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import HeroSplit from '@/components/sections/hero/HeroSplit';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
@@ -143,25 +143,28 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={false}
-      background={{ variant: "sparkles-gradient" }}
-      text="Ready to scale your business? Let's talk strategy."
-      buttons={[{ text: "Contact Us", href: "#" }]}
-    />
+      <ContactSplitForm
+        title="Ready to Monetize Your Growth?"
+        description="Submit your details to receive a custom revenue optimization strategy from our experts."
+        inputs={[
+          { name: "name", type: "text", placeholder: "Full Name", required: true },
+          { name: "email", type: "email", placeholder: "Business Email", required: true }
+        ]}
+        buttonText="Request Strategy"
+        useInvertedBackground={false}
+      />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseCard
+      <FooterLogoEmphasis
       logoText="ProfitFlow"
       columns={[
-        { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Blog", href: "#" }] },
-        { title: "Support", items: [{ label: "Help Center", href: "#" }, { label: "Contact", href: "#contact" }] },
-        { title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] }
+        { items: [{ label: "About", href: "#about" }, { label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }] },
+        { items: [{ label: "Support", href: "#" }, { label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] }
       ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5faff;
-  --card: #f1f8ff;
-  --foreground: #001122;
-  --primary-cta: #15479c;
+  --background: #fbfbfb;
+  --card: #ffffff;
+  --foreground: #111827;
+  --primary-cta: #111827;
   --primary-cta-text: #f5faff;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #f3f4f6;
   --secondary-cta-text: #001122;
-  --accent: #a8cce8;
-  --background-accent: #7ba3cf;
+  --accent: #e5e7eb;
+  --background-accent: #f9fafb;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);