Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,163 +2,174 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqDouble from '@/components/sections/faq/FaqDouble';
-import FeatureBento from '@/components/sections/feature/FeatureBento';
-import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
-import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
-import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
-import TextAbout from '@/components/sections/about/TextAbout';
-import { Leaf, ShieldCheck, Sparkles } from "lucide-react";
+import ContactText from '@/components/sections/contact/ContactText';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
+import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
+import AboutMetric from '@/components/sections/about/AboutMetric';
+import { Star, ShieldCheck, Users } from "lucide-react";
 
 export default function LandingPage() {
   return (
     <ThemeProvider
-      defaultButtonVariant="directional-hover"
-      defaultTextAnimation="reveal-blur"
-      borderRadius="pill"
-      contentWidth="medium"
-      sizing="medium"
-      background="circleGradient"
-      cardStyle="glass-elevated"
-      primaryButtonStyle="gradient"
-      secondaryButtonStyle="glass"
-      headingFontWeight="normal"
+        defaultButtonVariant="directional-hover"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="pill"
+        contentWidth="mediumLarge"
+        sizing="large"
+        background="noiseDiagonalGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-          <NavbarStyleFullscreen
+          <NavbarLayoutFloatingOverlay
             navItems={[
-              { name: "About", id: "#about" },
-              { name: "Features", id: "#features" },
-              { name: "Pricing", id: "#pricing" },
-              { name: "Contact", id: "#contact" }
+              { name: "About", id: "about" },
+              { name: "Services", id: "features" },
+              { name: "Pricing", id: "pricing" },
+              { name: "Contact", id: "contact" },
             ]}
-            brandName="PureClean"
+            brandName="Cleaning company"
+            button={{ text: "Get a Quote", href: "#contact" }}
           />
         </div>
 
         <div id="hero" data-section="hero">
-          <HeroBillboardTestimonial
-            useInvertedBackground={false}
-            background={{ variant: "gradient-bars" }}
-            title="A Spotless Home, Every Single Time"
-            description="Experience premium residential and commercial cleaning services designed for your lifestyle. We bring shine and peace of mind back to your space."
-            testimonials={[
-              { name: "Alice D.", handle: "@aliced", testimonial: "The best cleaning service I've ever used. My home was spotless!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-mother-cleaning-shelves-house_23-2148713680.jpg?_wi=1", imageAlt: "Young mother cleaning the shelves in the house" },
-              { name: "Mark S.", handle: "@marks", testimonial: "Professional, punctual, and incredibly thorough. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/husband-wife-singing-together-while-cleaning-apartment_482257-71.jpg?_wi=1", imageAlt: "Young mother cleaning the shelves in the house" },
-              { name: "Elena R.", handle: "@elenar", testimonial: "Finally found a team I can trust with my property.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-working-couch_23-2148751493.jpg?_wi=1", imageAlt: "Young mother cleaning the shelves in the house" },
-              { name: "David W.", handle: "@davidw", testimonial: "Exceptional attention to detail in every room.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-young-musician-woman-learns-how-play-ukulele-sits-sofa-with-crossed-legs_1258-204931.jpg?_wi=1", imageAlt: "Young mother cleaning the shelves in the house" },
-              { name: "Sarah P.", handle: "@sarahp", testimonial: "Refreshing clean, lovely professional staff.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-woman-wearing-rubber-gloves-cleaning_1163-2431.jpg?_wi=1", imageAlt: "Young mother cleaning the shelves in the house" }
+          <HeroBillboardGallery
+            title="Premium Cleaning for Modern Spaces"
+            description="Redefining clean with meticulous attention to detail, eco-friendly products, and a professional touch that turns your property into a sanctuary."
+            mediaAnimation="blur-reveal"
+            background={{ variant: "sparkles-gradient" }}
+            mediaItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/young-mother-cleaning-shelves-house_23-2148713680.jpg?_wi=1", imageAlt: "Professional Cleaning" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/husband-wife-singing-together-while-cleaning-apartment_482257-71.jpg?_wi=1", imageAlt: "Eco-friendly sanitization" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/woman-working-couch_23-2148751493.jpg?_wi=1", imageAlt: "Detail oriented cleaning" }
             ]}
             buttons={[{ text: "Book Now", href: "#contact" }]}
-            mediaAnimation="blur-reveal"
-            imageSrc="http://img.b2bpic.net/free-photo/young-mother-cleaning-shelves-house_23-2148713680.jpg?_wi=2"
-            imageAlt="Young mother cleaning the shelves in the house"
           />
         </div>
 
         <div id="about" data-section="about">
-          <TextAbout useInvertedBackground={true} title="Dedication to Hygiene and Perfection" tag="Our Mission" />
+          <AboutMetric
+            title="Experience The PureClean Standard"
+            useInvertedBackground={true}
+            metricsAnimation="slide-up"
+            metrics={[
+              { icon: Star, label: "Satisfaction Guaranteed", value: "100%" },
+              { icon: Users, label: "Expert Team Members", value: "50+" },
+              { icon: ShieldCheck, label: "Certified Eco-Safe", value: "Yes" }
+            ]}
+          />
         </div>
 
         <div id="features" data-section="features">
-          <FeatureBento
+          <FeatureCardTwelve
+            title="Comprehensive Cleaning Services"
+            description="Customized solutions designed to meet the unique needs of your home or commercial space."
             animationType="slide-up"
             textboxLayout="split"
             useInvertedBackground={false}
             features={[
-              { title: "Eco-Friendly Products", description: "Safe for pets and children.", bentoComponent: "reveal-icon", icon: Leaf },
-              { title: "Verified Staff", description: "Background checked professionals.", bentoComponent: "reveal-icon", icon: ShieldCheck },
-              { title: "100% Satisfaction", description: "We don't leave until it's clean.", bentoComponent: "reveal-icon", icon: Sparkles }
+              {
+                id: "f1", label: "Residential", title: "Full Home Care", items: ["Kitchen deep clean", "Bathroom sanitization", "Living space dusting", "Window interiors"],
+              },
+              {
+                id: "f2", label: "Commercial", title: "Workspace Hygiene", items: ["Desk disinfection", "Common area cleaning", "Trash removal", "Floor maintenance"],
+              },
+              {
+                id: "f3", label: "Specialized", title: "Move-In / Out", items: ["Full surface scrub", "Cabinet interior cleaning", "Baseboard detailing", "Appliance polish"],
+              }
             ]}
-            title="Why Choose PureClean?"
-            description="We blend eco-friendly practices with high-standard deep cleaning methods."
           />
         </div>
 
         <div id="metrics" data-section="metrics">
-          <MetricCardTwo
-            animationType="scale-rotate"
+          <MetricCardEleven
+            title="Our Performance"
+            description="Trust the stats that define our success."
+            animationType="blur-reveal"
             textboxLayout="split"
-            gridVariant="bento-grid"
-            useInvertedBackground={true}
+            useInvertedBackground={false}
             metrics={[
-              { id: "m1", value: "5000+", description: "Happy Clients Served" },
-              { id: "m2", value: "12+", description: "Years of Excellence" },
-              { id: "m3", value: "99%", description: "Repeat Customers" }
+              { id: "m1", value: "15,000", title: "Projects Completed", description: "Consistent excellence since 2010.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-woman-wearing-rubber-gloves-cleaning_1163-2431.jpg" },
+              { id: "m2", value: "4.9/5", title: "Client Rating", description: "Consistently rated by our community.", imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-papers-laptop_23-2148751501.jpg" }
             ]}
-            title="Proven Results"
-            description="Our numbers speak for our dedication to excellence."
           />
         </div>
 
         <div id="testimonials" data-section="testimonials">
-          <TestimonialCardTwelve
-            useInvertedBackground={false}
-            cardAnimation="slide-up"
-            cardTitle="What Our Clients Say"
-            cardTag="Reviews"
+          <TestimonialCardSixteen
+            title="Hear From Our Clients"
+            description="Join the thousands of happy homeowners and business owners who rely on us."
+            animationType="scale-rotate"
+            textboxLayout="split"
+            useInvertedBackground={true}
+            kpiItems={[
+              { value: "5k+", label: "Active Clients" },
+              { value: "98%", label: "Retention Rate" },
+              { value: "12y", label: "In Business" }
+            ]}
             testimonials={[
-              { id: "1", name: "Alice D.", imageSrc: "http://img.b2bpic.net/free-photo/husband-wife-singing-together-while-cleaning-apartment_482257-71.jpg?_wi=2" },
-              { id: "2", name: "Mark S.", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-couch_23-2148751493.jpg?_wi=2" },
-              { id: "3", name: "Elena R.", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-young-musician-woman-learns-how-play-ukulele-sits-sofa-with-crossed-legs_1258-204931.jpg?_wi=2" },
-              { id: "4", name: "David W.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-woman-wearing-rubber-gloves-cleaning_1163-2431.jpg?_wi=2" },
-              { id: "5", name: "Sarah P.", imageSrc: "http://img.b2bpic.net/free-photo/young-smiling-couple-playing-bed-home-casual-outfit-man-woman-having-fun-together-crazy-positive-emotion-happy-holding-hand-up_285396-867.jpg" }
+              { id: "t1", name: "Jane Smith", role: "Homeowner", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-mother-cleaning-shelves-house_23-2148713680.jpg" },
+              { id: "t2", name: "Mike Ross", role: "Manager", company: "Tech Hub Inc", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-working-couch_23-2148751493.jpg" }
             ]}
           />
         </div>
 
         <div id="pricing" data-section="pricing">
-          <PricingCardEight
-            animationType="slide-up"
+          <PricingCardTwo
+            title="Transparent Pricing"
+            description="Clear, honest pricing for reliable service packages."
+            animationType="blur-reveal"
             textboxLayout="split"
-            useInvertedBackground={true}
-            title="Simple Pricing for Every Home"
-            description="Transparent plans for your convenience."
+            useInvertedBackground={false}
             plans={[
-              { id: "p1", badge: "Standard", price: "$120", subtitle: "Perfect for routine upkeep.", buttons: [{ text: "Book Now" }], features: ["Kitchen", "Bathroom", "Living Room"] },
-              { id: "p2", badge: "Deep Clean", price: "$250", subtitle: "Comprehensive deep cleaning.", buttons: [{ text: "Book Now" }], features: ["Standard + Inside Fridge", "Oven", "Windows"] },
-              { id: "p3", badge: "Move-In", price: "$400", subtitle: "Total sanitization package.", buttons: [{ text: "Book Now" }], features: ["Full Home Deep Clean", "Baseboards", "Sanitization"] }
+              { id: "p1", badge: "Essential", price: "$149", subtitle: "Quick refresh service", buttons: [{ text: "Choose Plan" }], features: ["Basic dusting", "Vacuuming", "Kitchen surface wipe"] },
+              { id: "p2", badge: "Premium", price: "$299", subtitle: "Complete deep clean", buttons: [{ text: "Choose Plan" }], features: ["Everything in Essential", "Deep carpet steam", "Interior oven clean", "Inside windows"] }
             ]}
           />
         </div>
 
         <div id="faq" data-section="faq">
-          <FaqDouble
+          <FaqSplitMedia
+            title="Frequently Asked Questions"
+            description="Everything you need to know about our process."
+            faqsAnimation="slide-up"
             textboxLayout="split"
             useInvertedBackground={false}
-            title="Common Questions"
-            description="Answers to keep your home pristine."
-            faqsAnimation="slide-up"
             faqs={[
-              { id: "f1", title: "Do I need to be home?", content: "No, our team is fully insured and reliable." },
-              { id: "f2", title: "Are cleaning supplies provided?", content: "Yes, we bring premium eco-friendly supplies." },
-              { id: "f3", title: "Can I cancel my booking?", content: "Cancellation is free with 24 hours notice." }
+              { id: "q1", title: "Are you insured?", content: "Yes, our professional cleaning team is fully insured and bonded for your peace of mind." },
+              { id: "q2", title: "Can I customize my clean?", content: "Absolutely. We tailor every service package to suit your specific residential or commercial needs." }
             ]}
+            imageSrc="http://img.b2bpic.net/free-photo/man-woman-putting-rubber-gloves_23-2147766988.jpg"
           />
         </div>
 
         <div id="contact" data-section="contact">
-          <ContactCenter
-            useInvertedBackground={true}
-            background={{ variant: "radial-gradient" }}
-            tag="Booking"
-            title="Schedule Your Clean"
-            description="Get in touch today to transform your living space."
+          <ContactText
+            text="Ready to transform your environment into a pristine space?"
+            background={{ variant: "gradient-bars" }}
+            useInvertedBackground={false}
+            buttons={[{ text: "Request a quote", href: "#contact" }]}
           />
         </div>
 
         <div id="footer" data-section="footer">
-          <FooterBaseReveal
-            logoText="PureClean"
+          <FooterSimple
             columns={[
-              { title: "Services", items: [{ label: "Residential", href: "#" }, { label: "Commercial", href: "#" }] },
-              { title: "Support", items: [{ label: "Contact Us", href: "#contact" }, { label: "FAQ", href: "#" }] }
+              { title: "Company", items: [{ label: "About" }, { label: "Careers" }] },
+              { title: "Services", items: [{ label: "Residential" }, { label: "Commercial" }] }
             ]}
+            bottomLeftText="© 2024 Cleaning company"
+            bottomRightText="Terms of Service | Privacy Policy"
           />
         </div>
       </ReactLenis>