Merge version_4 into main

Merge version_4 into main

src/app/page.tsx

@@ -3,9 +3,9 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import { useState, useEffect } from "react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import FooterBase from '@/components/sections/footer/FooterBase';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import HeroLogo from '@/components/sections/hero/HeroLogo';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
@@ -19,7 +19,6 @@ export default function LandingPage() {
 
   useEffect(() => {
     const fetchData = async () => {
-      // Simulated asynchronous data work
       setData({ loaded: true });
     };
     fetchData();
@@ -164,34 +163,20 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
-      useInvertedBackground={false}
-      background={{ variant: "gradient-bars" }}
+      <ContactCTA
       tag="Contact Us"
-      title="Ready to Start Your Project?"
-      description="Get in touch with us at our Parkmore offices today. We look forward to creating exceptional branding for you."
-      imageSrc="http://img.b2bpic.net/free-photo/graphic-2d-colorful-wallpaper-with-grainy-gradients_23-2151001633.jpg"
-      buttonText="Send Inquiry"
+      title="Ready to Elevate Your Brand?"
+      description="Partner with Sandton's premier branding experts to create lasting impressions with high-quality promotional products."
+      buttons={[{ text: "Get a Quote", href: "#contact" }]}
+      background={{ variant: "sparkles-gradient" }}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
-      columns={[
-        {
-          title: "About Us",          items: [
-            { label: "Our Story", href: "#about" },
-            { label: "Services", href: "#products" },
-          ],
-        },
-        {
-          title: "Contact",          items: [
-            { label: "70 11th St, Parkmore", href: "#" },
-            { label: "010 065 1362", href: "tel:0100651362" },
-          ],
-        },
-      ]}
+      <FooterLogoReveal
       logoText="Maz Branding"
+      leftLink={{ text: "Privacy Policy", href: "#" }}
+      rightLink={{ text: "Contact", href: "#contact" }}
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

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