Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -2,16 +2,16 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import { Calendar, Compass, MapPin, Smartphone, Sun, FileText, CheckCircle } from "lucide-react";
+import { Calendar, Compass, MapPin, Smartphone, Sun, FileText, CheckCircle, ArrowRight } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -36,6 +36,7 @@ export default function LandingPage() {
         { name: "Activities", id: "activities" },
         { name: "Plans", id: "pricing" },
         { name: "Support", id: "faq" },
+        { name: "Contact", id: "contact" }
       ]}
       brandName="La Tehtaar"
     />
@@ -90,15 +91,15 @@ export default function LandingPage() {
   </div>
 
   <div id="pricing" data-section="pricing">
-      <PricingCardNine
+      <PricingCardThree
       animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
+      textboxLayout="split"
+      useInvertedBackground={true}
       title="Plan Your Growth"
       description="Flexible options for users and business partners in the Jordanian tourism sector."
       plans={[
-        { id: "free", title: "Explorer", price: "Free", period: "/lifetime", features: ["Custom itinerary", "Basic search", "Seasonal filters"], button: { text: "Get Started" } },
-        { id: "pro", title: "Premium", price: "29 JOD", period: "/mo", features: ["Priority support", "Advanced analytics", "Custom route optimization"], button: { text: "Upgrade" } }
+        { id: "free", name: "Explorer", price: "Free", features: ["Custom itinerary", "Basic search", "Seasonal filters"], buttons: [{ text: "Get Started" }] },
+        { id: "pro", name: "Premium", price: "29 JOD", features: ["Priority support", "Advanced analytics", "Custom route optimization"], buttons: [{ text: "Upgrade" }] }
       ]}
     />
   </div>
@@ -129,11 +130,17 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactText
-      background={{ variant: "sparkles-gradient" }}
-      text="Ready to start your Jordan adventure with La Tehtaar?"
-      buttons={[{ text: "Contact Our Team" }]}
+      <ContactSplitForm
+      title="Start Your Mobile App Journey"
+      description="Send us your website link and we'll help you convert it into a mobile app."
+      inputs={[
+        { name: "name", type: "text", placeholder: "Your Name", required: true },
+        { name: "email", type: "email", placeholder: "Email Address", required: true },
+        { name: "link", type: "url", placeholder: "Your Website Link", required: true }
+      ]}
+      textarea={{ name: "message", placeholder: "Tell us more about your project" }}
       useInvertedBackground={false}
+      buttonText="Submit Project"
     />
   </div>
 
@@ -150,4 +157,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}