src/app/page.tsx

@@ -9,10 +9,23 @@ import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
 import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
 import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
 import ContactCTA from "@/components/sections/contact/ContactCTA";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Award, Code, Lock, Search, ShoppingCart, Smartphone, Sparkles, TrendingUp, Zap, Rocket } from "lucide-react";
+import { Award, Code, Lock, Search, ShoppingCart, Smartphone, Sparkles, TrendingUp, Zap, Rocket, Mail, Calendar } from "lucide-react";
 
 export default function LandingPage() {
+  const handleContactFormSubmit = (data: Record<string, string>) => {
+    console.log("Contact form submitted:", data);
+    // In a real implementation, you would send this data to your backend or email service
+    alert(`Thank you! We'll be in touch at ${data.email} soon.`);
+  };
+
+  const handleSchedulingClick = () => {
+    // This would integrate with a scheduling service like Calendly, Acuity Scheduling, etc.
+    console.log("Opening scheduling interface");
+    window.open("https://calendly.com", "_blank");
+  };
+
   return (
     <ThemeProvider
       defaultButtonVariant="hover-bubble"
@@ -188,16 +201,35 @@ export default function LandingPage() {
       </div>
 
       <div id="contact" data-section="contact">
+        <ContactSplitForm
+          title="Get In Touch With Our Team"
+          description="Have a project in mind? Let's discuss your vision and create a custom web solution that drives results for your business."
+          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" },
+            { name: "phone", type: "tel", placeholder: "Phone Number" }
+          ]}
+          textarea={{ name: "message", placeholder: "Tell us about your project...", rows: 5 }}
+          useInvertedBackground={false}
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          buttonText="Send Message"
+          onSubmit={handleContactFormSubmit}
+        />
+      </div>
+
+      <div id="contact-cta" data-section="contact-cta">
         <ContactCTA
-          tag="Let's Get Started"
-          tagIcon={Rocket}
+          tag="Schedule a Consultation"
+          tagIcon={Calendar}
           tagAnimation="slide-up"
-          title="Ready to Grow Your Business Online?"
-          description="Schedule a free consultation with our team to discuss your project, goals, and how we can help you achieve them."
+          title="Ready to Schedule Your Free Consultation?"
+          description="Book a personalized meeting with our team to discuss your project goals, timeline, and budget. Let's create a roadmap to grow your business online."
           background={{ variant: "animated-grid" }}
           buttons={[
-            { text: "Schedule Consultation", href: "mailto:hello@webdevagency.ca" },
-            { text: "Call Us Today", href: "tel:+1-647-555-0123" }
+            { text: "Book Your Meeting", onClick: handleSchedulingClick },
+            { text: "Call Us at +1-647-555-0123", href: "tel:+1-647-555-0123" }
           ]}
           buttonAnimation="slide-up"
           useInvertedBackground={false}