Merge version_4 into main

Merge version_4 into main

src/app/page.tsx

@@ -3,6 +3,7 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
@@ -153,13 +154,18 @@ export default function LandingPage() {
   </div>
 
   <div id="booking" data-section="booking">
-      <ContactCTA
+      <ContactSplitForm
-      useInvertedBackground={false}
-      background={{ variant: "plain" }}
-      tag="AI Booking Receptionist"
       title="Ready to Book JXSON?"
-      description="I’m your AI Assistant. I can help you check availability, discuss your party vibe, and secure your date. Let's create an unforgettable experience together."
+      description="Secure your date with elite DJ services. Provide your event details below and I will get back to you to finalize the vibe and schedule."
-      buttons={[{ text: "Talk to AI Assistant", href: "#" }]}
+      inputs={[
+        { name: "name", type: "text", placeholder: "Your Name", required: true },
+        { name: "date", type: "date", placeholder: "Event Date", required: true },
+        { name: "email", type: "email", placeholder: "Your Email", required: true }
+      ]}
+      textarea={{ name: "message", placeholder: "Tell us about your event vision...", rows: 4, required: true }}
+      onSubmit={(data) => console.log("Booking Request Captured:", data)}
+      buttonText="Submit Inquiry"
+      useInvertedBackground={false}
     />
   </div>