Merge version_3 into main

Merge version_3 into main

src/app/page.tsx

@@ -2,17 +2,17 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
-import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
-import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
-import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
-import { Home, Sparkles } from "lucide-react";
+import ContactText from '@/components/sections/contact/ContactText';
+import FaqBase from '@/components/sections/faq/FaqBase';
+import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
+import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
+import { Home, Sparkles, User, Settings, Mail, MapPin } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -30,12 +30,12 @@ export default function LandingPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-          <NavbarStyleFullscreen
+          <NavbarStyleCentered
             navItems={[
               { name: "Home", id: "hero" },
-              { name: "The Space", id: "about" },
-              { name: "Amenities", id: "features" },
-              { name: "Residences", id: "products" },
+              { name: "About", id: "about" },
+              { name: "Features", id: "features" },
+              { name: "Pricing", id: "products" },
               { name: "Contact", id: "contact" },
             ]}
             brandName="Elysian Residences"
@@ -43,116 +43,102 @@ export default function LandingPage() {
         </div>
 
         <div id="hero" data-section="hero">
-          <HeroOverlayTestimonial
+          <HeroBillboardDashboard
             title="Experience 4BHK 3D Living"
-            description="An immersive journey into unparalleled luxury, where architectural elegance meets digital sophistication in every corner of your future home."
-            testimonials={[
-              { name: "Sarah Miller", handle: "@architect", testimonial: "The 3D immersive feel is absolutely breathtaking.", rating: 5 },
-              { name: "David Thorne", handle: "@investor", testimonial: "The most modern residential experience I've seen.", rating: 5 }
-            ]}
-            imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-loft-luxury-living-room-with-design-chandelier_105762-2226.jpg"
-            tag="Immersive Experience"
-            tagIcon={Sparkles}
-            buttons={[{ text: "Explore", href: "#products" }]}
+            description="An immersive journey into unparalleled luxury."
+            background={{ variant: "plain" }}
+            dashboard={{
+              title: "Overview",              stats: [{ title: "Units", values: [4, 8, 12], description: "Available" }, { title: "Floors", values: [1, 2, 3], description: "Total" }, { title: "Area", values: [1500, 2000, 2500], description: "Sq Ft" }],
+              logoIcon: Home,
+              sidebarItems: [{ icon: User }, { icon: Settings }],
+              buttons: [{ text: "Get Started" }],
+              listItems: [{ icon: Sparkles, title: "Luxury Amenities", status: "Active" }],
+              imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-loft-luxury-living-room-with-design-chandelier_105762-2226.jpg"
+            }}
           />
         </div>
 
         <div id="about" data-section="about">
-          <TestimonialAboutCard
-            useInvertedBackground={true}
-            tag="Architectural Marvel"
+          <TextSplitAbout
             title="A Home That Inspires"
-            description="Nestled in the heart of the city, this 4BHK apartment offers a seamless blend of modern technology and timeless luxury."
-            subdescription="Every detail reflects refined craftsmanship, from the floor-to-ceiling windows to the curated premium interior finishes."
-            icon={Home}
-            imageSrc="http://img.b2bpic.net/free-photo/modern-interior-design-interior_23-2151929511.jpg"
-            mediaAnimation="slide-up"
+            description={["Nestled in the heart of the city.", "Seamless blend of modern tech."]}
+            useInvertedBackground={false}
           />
         </div>
 
         <div id="features" data-section="features">
-          <FeatureCardTwentyFour
+          <FeatureCardTwentyNine
+            features={[{ title: "Wellness Centre", description: "Rejuvenate in our world-class fitness studio.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-doing-yoga-outdoors_23-2148732923.jpg", titleImageSrc: "", buttonText: "Learn More" }]}
+            gridVariant="bento-grid"
             animationType="slide-up"
-            textboxLayout="split"
+            textboxLayout="default"
             useInvertedBackground={false}
-            features={[
-              { id: "f1", title: "Wellness Centre", author: "Spa Level", description: "Rejuvenate in our world-class fitness studio.", tags: ["Health"], imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-doing-yoga-outdoors_23-2148732923.jpg" },
-              { id: "f2", title: "Outdoor Serenity", author: "Balcony Level", description: "Expansive terraces with city skyline views.", tags: ["Outdoor"], imageSrc: "http://img.b2bpic.net/free-photo/two-people-cafe-enjoying-time-spending-with-each-other_23-2147891123.jpg" }
-            ]}
             title="Unrivaled Amenities"
-            description="Enjoy a suite of world-class facilities designed for ultimate comfort."
+            description="Enjoy a suite of world-class facilities."
           />
         </div>
 
         <div id="products" data-section="products">
-          <ProductCardOne
+          <ProductCardThree
+            products={[{ id: "p1", name: "Master Suite A", price: "$500k", imageSrc: "http://img.b2bpic.net/free-photo/luxury-modern-style-bedroom-interior-hotel-bedroom-generative-ai-illustration_1258-151611.jpg" }]}
+            gridVariant="bento-grid"
             animationType="slide-up"
             textboxLayout="default"
-            gridVariant="bento-grid"
             useInvertedBackground={true}
-            products={[
-              { id: "p1", name: "Master Suite A", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/nice-organised-workspace-with-lamp_23-2148592289.jpg" },
-              { id: "p2", name: "Living Hall", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/luxury-modern-style-bedroom-interior-hotel-bedroom-generative-ai-illustration_1258-151611.jpg" }
-            ]}
             title="Residence Layouts"
-            description="Choose the perfect spatial arrangement that fits your lifestyle."
+            description="Choose the perfect arrangement."
           />
         </div>
 
         <div id="metrics" data-section="metrics">
-          <MetricCardEleven
-            animationType="slide-up"
+          <MetricCardSeven
+            animationType="depth-3d"
             textboxLayout="default"
             useInvertedBackground={false}
-            metrics={[
-              { id: "m1", value: "4BHK", title: "Layout", description: "Spacious residence", imageSrc: "http://img.b2bpic.net/free-photo/home-cozy-still-life-with-black-sofa-decor-living-room_169016-6439.jpg" },
-              { id: "m2", value: "1500sqft", title: "Terrace", description: "Exclusive area", imageSrc: "http://img.b2bpic.net/free-photo/popular-resort-with-pools-water-parks-turkey-hotel-resort_146671-18837.jpg" }
-            ]}
+            metrics={[{ id: "m1", value: "4BHK", title: "Layout", items: ["Luxury"] }]}
             title="Key Statistics"
             description="Excellence defined by the numbers."
           />
         </div>
 
         <div id="testimonials" data-section="testimonials">
-          <TestimonialCardTwo
+          <TestimonialCardThirteen
+            showRating={true}
             animationType="depth-3d"
             textboxLayout="default"
             useInvertedBackground={true}
-            testimonials={[
-              { id: "t1", name: "Sarah Miller", role: "Architect", testimonial: "The balcony is breathtaking.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-family-spending-time-home_23-2150231646.jpg" }
-            ]}
+            testimonials={[{ id: "t1", name: "Sarah Miller", handle: "@architect", testimonial: "Absolutely breathtaking.", rating: 5 }]}
             title="Resident Experiences"
             description="What our residents say."
           />
         </div>
 
         <div id="faq" data-section="faq">
-          <FaqSplitText
-            useInvertedBackground={false}
+          <FaqBase
             faqs={[{ id: "q1", title: "Are units furnished?", content: "Yes, fully curated." }]}
-            sideTitle="Frequently Asked Questions"
             faqsAnimation="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="FAQ"
+            description="Your questions answered."
           />
         </div>
 
         <div id="contact" data-section="contact">
-          <ContactSplitForm
+          <ContactText
+            text="Schedule a private viewing today."
+            background={{ variant: "animated-grid" }}
             useInvertedBackground={true}
-            title="Schedule a Viewing"
-            description="Book your private tour today."
-            inputs={[{ name: "name", type: "text", placeholder: "Name" }, { name: "email", type: "email", placeholder: "Email" }]}
-            imageSrc="http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167810.jpg"
           />
         </div>
 
         <div id="footer" data-section="footer">
-          <FooterMedia
-            imageSrc="http://img.b2bpic.net/free-photo/analog-city-landscape-with-buildings_23-2149661416.jpg"
+          <FooterCard
             logoText="Elysian Residences"
-            columns={[{ title: "Explore", items: [{ label: "Home", href: "#hero" }] }]}
+            socialLinks={[{ icon: Mail, href: "#", ariaLabel: "Email" }, { icon: MapPin, href: "#", ariaLabel: "Location" }]}
           />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}