diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 3bd9ea9..eed2e75 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -3,16 +3,14 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import { useState } from "react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 
 export default function ContactPage() {
   const [submitted, setSubmitted] = useState(false);
 
   const handleSubmit = (email: string) => {
-    // Simulate form submission
     console.log("Form submitted with email:", email);
     setSubmitted(true);
   };
@@ -23,72 +21,50 @@ export default function ContactPage() {
         defaultTextAnimation="reveal-blur"
         borderRadius="pill"
         contentWidth="small"
-        sizing="largeSizeMediumTitles"
-        background="aurora"
+        sizing="medium"
+        background="circleGradient"
         cardStyle="glass-elevated"
-        primaryButtonStyle="double-inset"
-        secondaryButtonStyle="radial-glow"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
         headingFontWeight="normal"
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingInline
-            navItems={[
-              { name: "Home", id: "/" },
-              { name: "Services", id: "/services" },
-              { name: "Portfolio", id: "/portfolio" },
-              { name: "About", id: "/about" },
-              { name: "Contact", id: "/contact" },
-            ]}
-            brandName="Lance Digital"
-            button={{ text: "Get Started" }}
-          />
+            <NavbarStyleApple
+              navItems={[
+                { name: "Home", id: "/" },
+                { name: "Contact", id: "/contact" }
+              ]}
+              brandName="Lance Digital"
+            />
         </div>
 
-        <div id="contact-section" data-section="contact-section">
+        <div id="contact-form" data-section="contact-form">
             {submitted ? (
               <div className="flex flex-col items-center justify-center py-20 px-4 text-center">
                 <h2 className="text-3xl font-bold mb-4">Thank You!</h2>
                 <p className="text-lg">Your inquiry has been sent successfully. We'll be in touch soon.</p>
               </div>
             ) : (
-              <ContactSplitForm
-                useInvertedBackground={false}
+              <ContactCTA
+                tag="Contact Us"
                 title="Let’s Build Your Website"
-                description="Ready to get more customers? Fill out the form below and we'll reach out to discuss your project. You can also reach us directly at 971-471-6843."
-                inputs={[
-                  { name: "name", type: "text", placeholder: "Name", required: true },
-                  { name: "email", type: "email", placeholder: "Email", required: true },
-                ]}
-                textarea={{ name: "message", placeholder: "Tell us about your business", rows: 4, required: true }}
-                imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKYvzBp9a3Jl3YoTTFUEK2LbOU/a-high-end-clean-dashboard-interface-for-1776222697285-536dbf67.png?_wi=1"
-                onSubmit={(email) => handleSubmit(email)}
+                description="Ready to get more customers? Fill out the form below and we'll reach out to discuss your project."
+                buttons={[{ text: "Submit Inquiry", onClick: () => handleSubmit("user@example.com") }]}
+                background={{ variant: "plain" }}
+                useInvertedBackground={false}
               />
             )}
         </div>
 
-        <div id="contact" data-section="contact">
-            <ContactSplit
-            useInvertedBackground={false}
-            background={{ variant: "plain" }}
-            tag="Stay Connected"
-            title="Join Our Newsletter"
-            description="Receive monthly web design tips to help your business grow."
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKYvzBp9a3Jl3YoTTFUEK2LbOU/a-high-end-clean-dashboard-interface-for-1776222697285-536dbf67.png?_wi=2"
-            mediaAnimation="opacity"
-          />
-        </div>
-
-        <div id="footer-main" data-section="footer-main">
-            <FooterMedia
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKYvzBp9a3Jl3YoTTFUEK2LbOU/a-high-end-clean-dashboard-interface-for-1776222706904-a1fdaf26.png"
-            logoText="Lance Digital"
-            columns={[
-              { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] },
-              { title: "Services", items: [{ label: "Web Design", href: "/services" }, { label: "SEO", href: "/services" }] },
-            ]}
-            copyrightText="© 2025 Lance Digital. All rights reserved."
-          />
+        <div id="footer" data-section="footer">
+            <FooterBaseCard
+              logoText="Lance Digital"
+              columns={[
+                { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Contact", href: "/contact" }] },
+              ]}
+              copyrightText="© 2025 Lance Digital. All rights reserved."
+            />
         </div>
       </ReactLenis>
     </ThemeProvider>