From c42fbb8647bb38b6bb8b90a7d65fac2b426bdefc Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 25 Mar 2026 07:29:47 +0000
Subject: [PATCH] Update src/app/contact/page.tsx

---
 src/app/contact/page.tsx | 230 +++++++++++++--------------------------
 1 file changed, 75 insertions(+), 155 deletions(-)

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 7a2fdc2..b421adb 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -2,12 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import ContactForm from '@/components/sections/contact/ContactForm';
+import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
 import FooterBase from '@/components/sections/footer/FooterBase';
+import HeroContact from '@/components/sections/hero/HeroContact';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import { ArrowRight, HelpCircle } from "lucide-react";
+import { ArrowRight, Mail, Phone, Pin, Sparkles } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -28,40 +28,13 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
-          id: "home",
-          href: "/",
-        },
+          name: "Home",          id: "/"},
         {
-          name: "Services",
-          id: "services",
-          href: "#services",
-        },
+          name: "Services",          id: "/services"},
         {
-          name: "About",
-          id: "about",
-          href: "#about",
-        },
+          name: "About",          id: "/about"},
         {
-          name: "Impact",
-          id: "impact",
-          href: "#impact",
-        },
-        {
-          name: "Clients",
-          id: "clients",
-          href: "#clients",
-        },
-        {
-          name: "Testimonials",
-          id: "testimonials",
-          href: "#testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-          href: "#contact",
-        },
+          name: "Contact",          id: "/contact"}
       ]}
       brandName="Apex Social"
       bottomLeftText="Elevating Digital Presence"
@@ -69,97 +42,65 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="contact" data-section="contact">
-      <ContactSplitForm
-      useInvertedBackground={false}
-      title="Let's Build Your Social Success Story"
-      description="Ready to elevate your brand's digital presence? Fill out the form below and a member of our expert team will be in touch shortly to discuss your unique needs."
-      inputs={[
-        {
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Your Email",
-          required: true,
-        },
-        {
-          name: "company",
-          type: "text",
-          placeholder: "Company Name",
-          required: false,
-        },
-      ]}
-      textarea={{
-        name: "message",
-        placeholder: "Tell us about your project",
-        rows: 5,
-        required: true,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/close-up-people-working-office_329181-16036.jpg?_wi=12"
-      imageAlt="Contact us image showing a team discussing strategy"
-      mediaAnimation="slide-up"
-      mediaPosition="right"
-      buttonText="Send Message"
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqBase
-      textboxLayout="default"
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "1",
-          title: "What kind of brands do you work with?",
-          content: "Apex Social specializes in partnering with premium, luxury, and high-growth brands seeking to establish a distinguished and impactful social media presence. We tailor our strategies to meet the unique demands and aspirations of exclusive markets.",
-        },
-        {
-          id: "2",
-          title: "How do you measure success?",
-          content: "We believe in data-driven results. Success is measured through comprehensive analytics on engagement rates, audience growth, conversion tracking, brand sentiment analysis, and ultimately, your return on investment, all aligned with your specific business objectives.",
-        },
-        {
-          id: "3",
-          title: "What makes Apex Social different?",
-          content: "Our difference lies in our bespoke approach, combining cutting-edge strategy with creative excellence and a deep understanding of the premium brand landscape. We offer a truly partnership-driven model, ensuring transparent communication and measurable outcomes that elevate your brand.",
-        },
-        {
-          id: "4",
-          title: "What is your typical onboarding process?",
-          content: "Our onboarding begins with an in-depth discovery session to understand your brand, goals, and current digital footprint. This is followed by a tailored strategy presentation, team introductions, and a seamless transition into content creation and campaign execution.",
-        },
-      ]}
-      title="Got Questions? We Have Answers."
-      description="Find quick answers to the most common questions about our services, process, and partnership."
-      tag="FAQs"
-      tagIcon={HelpCircle}
-      faqsAnimation="slide-up"
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactCTA
-      useInvertedBackground={false}
-      background={{
-        variant: "animated-grid",
-      }}
-      tag="Next Steps"
-      tagIcon={ArrowRight}
-      title="Ready to Amplify Your Digital Voice?"
-      description="Don't let your brand's potential remain untapped. Connect with Apex Social to schedule a personalized strategy session."
+  <div id="hero" data-section="hero">
+      <HeroContact
+      title="Get in Touch: Let's Build Your Digital Future"
+      description="Have questions or ready to start a project? Reach out to Apex Social today. Our team is eager to discuss your brand's unique social media needs."
+      tag="Contact Us"
+      tagIcon={Mail}
+      tagAnimation="slide-up"
       buttons={[
         {
-          text: "Book a Strategy Call",
-          href: "/contact",
+          text: "Schedule a Call",          href: "#form"},
+      ]}
+      buttonAnimation="slide-up"
+      useInvertedBackground={false}
+      background={{
+        variant: "radial-gradient"}}
+      mediaAnimation="slide-up"
+    />
+  </div>
+
+  <div id="contact" data-section="contact">
+      <ContactForm
+      title="Send Us a Message"
+      description="Fill out the form below, and we'll get back to you within 24 hours to discuss how Apex Social can elevate your brand."
+      formFields={[
+        {
+          id: "name",          label: "Name",          type: "text",          placeholder: "Your Full Name"},
+        {
+          id: "email",          label: "Email",          type: "email",          placeholder: "Your Email Address"},
+        {
+          id: "company",          label: "Company",          type: "text",          placeholder: "Your Company Name"},
+        {
+          id: "message",          label: "Message",          type: "textarea",          placeholder: "Tell us about your project"},
+      ]}
+      submitButtonText="Send Message"
+      submitButtonIcon={ArrowRight}
+      submitButtonAnimation="opacity"
+      useInvertedBackground={false}
+      animationType="slide-up"
+    />
+  </div>
+
+  <div id="info" data-section="info">
+      <FeatureCardEight
+      title="Connect with Us"
+      description="Our dedicated team is ready to assist you. Find our contact details and office location below."
+      tag="Our Info"
+      tagIcon={Sparkles}
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      features={[
+        {
+          id: "email",          title: "Email Us",          description: "hello@apexsocial.com",          icon: Mail,
         },
         {
-          text: "Learn More About Us",
-          href: "/about",
+          id: "phone",          title: "Call Us",          description: "+1 (555) 123-4567",          icon: Phone,
+        },
+        {
+          id: "address",          title: "Our Office",          description: "123 Digital Blvd, Suite 400, Innovate City, CA 90210",          icon: Pin,
         },
       ]}
     />
@@ -169,54 +110,33 @@ export default function LandingPage() {
       <FooterBase
       columns={[
         {
-          title: "Services",
-          items: [
+          title: "Services",          items: [
             {
-              label: "Strategy",
-              href: "/services",
-            },
+              label: "Strategy",              href: "/services"},
             {
-              label: "Content Creation",
-              href: "/services",
-            },
+              label: "Content Creation",              href: "/services"},
             {
-              label: "Ad Management",
-              href: "/services",
-            },
+              label: "Ad Management",              href: "/services"},
           ],
         },
         {
-          title: "Company",
-          items: [
+          title: "Company",          items: [
             {
-              label: "About Us",
-              href: "/about",
-            },
+              label: "About Us",              href: "/about"},
             {
-              label: "Contact",
-              href: "/contact",
-            },
+              label: "Contact",              href: "/contact"},
             {
-              label: "Careers",
-              href: "#",
-            },
+              label: "Careers",              href: "#"},
           ],
         },
         {
-          title: "Resources",
-          items: [
+          title: "Resources",          items: [
             {
-              label: "Blog",
-              href: "#",
-            },
+              label: "Blog",              href: "#"},
             {
-              label: "Case Studies",
-              href: "#",
-            },
+              label: "Case Studies",              href: "#"},
             {
-              label: "FAQs",
-              href: "/contact#faqs",
-            },
+              label: "FAQs",              href: "/contact#faqs"},
           ],
         },
       ]}