Update src/app/page.tsx

Merge version_51 into main

src/app/page.tsx

@@ -2,10 +2,10 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
-import FooterSimple from '@/components/sections/footer/FooterSimple';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
@@ -218,25 +218,34 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactSplitForm
       useInvertedBackground={true}
-      background={{
-        variant: "radial-gradient"}}
-      tag="GET STARTED"
       title="Transform Your Listings Today"
       description="Ready to generate high-quality leads without spending a fortune on ads? Send us your listing details, and we'll show you the ReelEstate difference with a free sample. Let's close more deals."
       imageSrc="http://img.b2bpic.net/free-photo/business-man-working-hotel-room_1150-6380.jpg"
       imageAlt="ReelEstate contact form mockup"
       mediaAnimation="slide-up"
       mediaPosition="right"
-      inputPlaceholder="Your Email Address"
       buttonText="Send Listing"
-      termsText="By clicking Send Listing you're confirming that you agree with our Terms and Conditions."
+      inputs={[
+        {name: "name", type: "text", placeholder: "Your Name", required: true},
+        {name: "email", type: "email", placeholder: "Your Email Address", required: true},
+        {name: "phone", type: "tel", placeholder: "Your Phone Number", required: false}
+      ]}
+      multiSelect={{
+        name: "subject",        label: "How can we help?",        options: ["General Inquiry", "Free Sample Request", "Partnership", "Other"]
+      }}
+      textarea={{
+        name: "message",        placeholder: "Your Message",        rows: 5,
+        required: false
+      }}
+      onSubmit={(data) => console.log(data)}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterSimple
+      <FooterBaseCard
+      logoText="ReelEstate"
       columns={[
         {
           title: "Services",          items: [
@@ -271,8 +280,8 @@ export default function LandingPage() {
           ],
         },
       ]}
-      bottomLeftText="© 2024 ReelEstate. All rights reserved."
+      copyrightText="© 2024 ReelEstate. All rights reserved."
-      bottomRightText="Made with AI for Dubai Realty"
+      onPrivacyClick={() => console.log('Privacy policy clicked')}
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f7f6f7;
+  --background: #f5f5f5;
   --card: #ffffff;
-  --foreground: #1b0c25;
+  --foreground: #1c1c1c;
-  --primary-cta: #1b0c25;
+  --primary-cta: #df7226;
-  --primary-cta-text: #f7f6f7;
+  --primary-cta-text: #000000;
   --secondary-cta: #ffffff;
-  --secondary-cta-text: #1b0c25;
+  --secondary-cta-text: #f67208;
-  --accent: #ff93e4;
+  --accent: #ee8919;
-  --background-accent: #e8a8c3;
+  --background-accent: #32cf3e;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);