Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,15 +3,14 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
-import FeatureBento from '@/components/sections/feature/FeatureBento';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
+import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import SplitAbout from '@/components/sections/about/SplitAbout';
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
-import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
-import { Leaf, Shield, Sparkles, Star, Zap, Droplets } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -29,12 +28,12 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarStyleApple
+      <NavbarStyleCentered
       navItems={[
         { name: "Home", id: "hero" },
-        { name: "Our Story", id: "about" },
+        { name: "About", id: "about" },
         { name: "Features", id: "features" },
-        { name: "Collection", id: "products" },
+        { name: "Shop", id: "products" },
         { name: "Contact", id: "contact" },
       ]}
       brandName="Bloom & Petal"
@@ -42,82 +41,62 @@ export default function LandingPage() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardRotatedCarousel
+      <HeroSplitDoubleCarousel
       background={{ variant: "rotated-rays-animated" }}
       title="Nature’s Beauty, Delivered"
       description="Experience the freshness of hand-picked seasonal flowers designed to brighten your home or surprise someone special."
-      carouselItems={[
+      buttons={[{ text: "Shop Fresh Flowers", href: "#products" }]}
-        { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/flowers-florist-atelier_23-2147760917.jpg", imageAlt: "fresh flowers bouquet warm light" },
+      leftCarouselItems={[
-        { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-hello-spring-collage_23-2149319131.jpg", imageAlt: "elegant flower arrangement minimal" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/flowers-florist-atelier_23-2147760917.jpg" },
-        { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/side-view-beautiful-colorful-flowers-with-leaves-blue-surface-with-copy-space_141793-13723.jpg", imageAlt: "vibrant floral bouquet soft background" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/beautiful-hello-spring-collage_23-2149319131.jpg" },
-        { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/flowers-from-home-garden-vase-white-background_169016-36245.jpg", imageAlt: "delicate roses bunch floral shop" },
+      ]}
-        { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-roses-vase_23-2148387998.jpg", imageAlt: "nature inspired floral collection" },
+      rightCarouselItems={[
-        { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/flower-composition-plate_23-2147766623.jpg", imageAlt: "luxury flower shop floral display" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/side-view-beautiful-colorful-flowers-with-leaves-blue-surface-with-copy-space_141793-13723.jpg" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/flowers-from-home-garden-vase-white-background_169016-36245.jpg" },
       ]}
-      autoPlay={true}
     />
   </div>
 
   <div id="about" data-section="about">
-      <SplitAbout
+      <MetricSplitMediaAbout
-      textboxLayout="split"
-      useInvertedBackground={false}
       title="Artfully Curated Florals"
-      description="We believe in the power of flowers to transform spaces and elevate moods. Our team of expert florists carefully curates every bouquet using sustainable, locally sourced blooms to ensure freshness and longevity."
+      description="We believe in the power of flowers to transform spaces and elevate moods. Our team of expert florists carefully curates every bouquet using sustainable, locally sourced blooms."
-      bulletPoints={[
+      metrics={[
-        { title: "Sustainable Sourcing", description: "We source flowers from local farms." },
+        { value: "500+", title: "Daily Bouquets" },
-        { title: "Expert Design", description: "Handcrafted bouquets by professional artists." },
+        { value: "20", title: "Local Farms" },
-        { title: "Same-Day Delivery", description: "Freshness delivered on your schedule." },
+        { value: "15", title: "Expert Florists" },
       ]}
+      useInvertedBackground={false}
       imageSrc="http://img.b2bpic.net/free-photo/florist_23-2148013605.jpg"
-      mediaAnimation="slide-up"
-      imageAlt="florist creating beautiful arrangement"
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureBento
+      <FeatureCardThree
       animationType="slide-up"
+      gridVariant="three-columns-all-equal-width"
       textboxLayout="default"
       useInvertedBackground={false}
       title="Why Choose Our Blooms?"
       description="Excellence in service and botanical quality, designed to make every moment memorable."
       features={[
-        {
+        { title: "Freshness Guarantee", description: "Peak beauty, delivered.", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-fresh-roses-with-green-leaves-decorative-plant_23-2148071792.jpg?_wi=1" },
-          title: "Freshness Guarantee",          description: "We ensure your flowers arrive at the peak of their beauty.",          bentoComponent: "reveal-icon",          icon: Shield
+        { title: "Seasonal Collections", description: "Nature's best, curated.", imageSrc: "http://img.b2bpic.net/free-photo/watering-can-yellow-spring-flowers_23-2148433003.jpg?_wi=1" },
-        },
+        { title: "Eco-Friendly Packaging", description: "Respecting the earth.", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-tulips-white-wooden-background-top-view_169016-29617.jpg?_wi=1" },
-        {
-          title: "Seasonal Collections",          description: "Our offerings change with the seasons to reflect nature's best.",          bentoComponent: "reveal-icon",          icon: Leaf
-        },
-        {
-          title: "Eco-Friendly Packaging",          description: "Compostable and sustainable materials to respect the earth.",          bentoComponent: "reveal-icon",          icon: Droplets
-        },
-        {
-          title: "Artisan Craftsmanship",          description: "Handcrafted by masters with years of floral experience.",          bentoComponent: "reveal-icon",          icon: Sparkles
-        },
-        {
-          title: "Customer Love",          description: "Highly rated service for all your special occasions.",          bentoComponent: "reveal-icon",          icon: Star
-        },
-        {
-          title: "Swift Logistics",          description: "Optimized delivery routes for guaranteed freshness.",          bentoComponent: "reveal-icon",          icon: Zap
-        }
       ]}
     />
   </div>
 
   <div id="products" data-section="products">
-      <ProductCardOne
+      <ProductCardTwo
+      gridVariant="three-columns-all-equal-width"
       animationType="slide-up"
       textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
       products={[
-        { id: "p1", name: "Classic Roses", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-fresh-roses-with-green-leaves-decorative-plant_23-2148071792.jpg" },
+        { id: "1", brand: "Bloom", name: "Classic Roses", price: "$45", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-fresh-roses-with-green-leaves-decorative-plant_23-2148071792.jpg?_wi=2" },
-        { id: "p2", name: "Golden Sunflowers", price: "$38", imageSrc: "http://img.b2bpic.net/free-photo/watering-can-yellow-spring-flowers_23-2148433003.jpg" },
+        { id: "2", brand: "Bloom", name: "Sunflowers", price: "$38", rating: 4, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/watering-can-yellow-spring-flowers_23-2148433003.jpg?_wi=2" },
-        { id: "p3", name: "Spring Tulips", price: "$42", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-tulips-white-wooden-background-top-view_169016-29617.jpg" },
+        { id: "3", brand: "Bloom", name: "Spring Tulips", price: "$42", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-tulips-white-wooden-background-top-view_169016-29617.jpg?_wi=2" },
-        { id: "p4", name: "Lavender Dream", price: "$35", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-gardening-concept-with-copyspace_23-2148195478.jpg" },
-        { id: "p5", name: "Elegant Lilies", price: "$50", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-flower_74190-430.jpg" },
-        { id: "p6", name: "Peony Blush", price: "$55", imageSrc: "http://img.b2bpic.net/free-photo/close-up-blooming-flowers_23-2148443884.jpg" },
       ]}
       title="Our Collection"
       description="Hand-picked favorites for every occasion."
@@ -125,55 +104,51 @@ export default function LandingPage() {
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardTen
+      <TestimonialCardThirteen
+      title="From Our Happy Customers"
+      description="See why our community loves our floral designs."
+      showRating={true}
+      animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        { id: "1", title: "Great Service", quote: "The flowers were incredibly fresh and beautiful.", name: "Alice M.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-celebrating-mother-s-day_23-2151207271.jpg" },
+        { id: "1", name: "Alice M.", handle: "@alice", testimonial: "The flowers were incredibly fresh and beautiful.", rating: 5 },
-        { id: "2", title: "Stunning Bouquet", quote: "Bloom & Petal is my go-to for all gifts.", name: "Bob R.", role: "Loyal Customer", imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-woman-holding-flowers_23-2148488576.jpg" },
+        { id: "2", name: "Bob R.", handle: "@bob", testimonial: "Bloom & Petal is my go-to for all gifts.", rating: 5 },
-        { id: "3", title: "Fast Delivery", quote: "Perfect timing for our anniversary surprise.", name: "Carla S.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/pleased-woman-with-short-hair-looking-surprised-happy-smiling-cheerfully-while-receiving-bouquet-flowers-from-her-boyfriend-celebrating-international-women-s-day-march-8_141793-78802.jpg" },
-        { id: "4", title: "Exquisite Design", quote: "The artistry is simply unmatched in this area.", name: "David W.", role: "Interior Designer", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-beautiful-blond-hair-gentle-smile-dressed-green-robe-with-belt-is-working-greenhouse_197531-12309.jpg" },
-        { id: "5", title: "Always Fresh", quote: "I love how long the arrangements last.", name: "Emily P.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/smiling-portrait-blonde-young-female-florist-holding-bouquet-hand-making-ok-gesture_23-2148049427.jpg" },
       ]}
-      title="From Our Happy Customers"
-      description="See why our community loves our floral designs."
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitText
+      <FaqSplitMedia
-      useInvertedBackground={false}
       faqs={[
         { id: "q1", title: "Do you offer same-day delivery?", content: "Yes, orders placed before 1 PM are eligible for same-day delivery." },
         { id: "q2", title: "How long do the bouquets last?", content: "With proper care, our arrangements can last 5-7 days." },
-        { id: "q3", title: "Can I request custom colors?", content: "Absolutely, we specialize in custom floral commissions." },
       ]}
-      sideTitle="Common Questions"
+      title="Common Questions"
-      sideDescription="Find answers to our most popular inquiries here."
+      description="Find answers to our most popular inquiries here."
       faqsAnimation="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      imageSrc="http://img.b2bpic.net/free-photo/front-view-woman-wrapping-tulips_23-2148488462.jpg"
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactSplit
-      useInvertedBackground={false}
-      background={{ variant: "plain" }}
       tag="Contact Us"
       title="Let's Get in Touch"
       description="Have questions about our collections? Send us a message."
-      imageSrc="http://img.b2bpic.net/free-photo/front-view-woman-wrapping-tulips_23-2148488462.jpg"
+      background={{ variant: "plain" }}
-      mediaAnimation="slide-up"
+      useInvertedBackground={false}
-      imageAlt="florist creating beautiful arrangement"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterMedia
+      <FooterLogoEmphasis
-      imageSrc="http://img.b2bpic.net/free-photo/3d-green-palm-leaves-arrangement_23-2149015447.jpg"
       logoText="Bloom & Petal"
       columns={[
-        { title: "Shop", items: [{ label: "All Flowers", href: "#products" }, { label: "Custom Requests", href: "#contact" }] },
+        { items: [{ label: "Home", href: "#" }, { label: "Shop", href: "#products" }] },
-        { title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }, { label: "Features", href: "#features" }] },
+        { items: [{ label: "About", href: "#about" }, { label: "FAQ", href: "#faq" }] },
       ]}
     />
   </div>