Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -3,16 +3,16 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import TextAbout from '@/components/sections/about/TextAbout';
-import BlogCardOne from '@/components/sections/blog/BlogCardOne';
+import BlogCardThree from '@/components/sections/blog/BlogCardThree';
-import ContactCTA from '@/components/sections/contact/ContactCTA';
+import ContactText from '@/components/sections/contact/ContactText';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
-import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
+import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
-import { MapPin, Wifi, Coffee, Star } from "lucide-react";
+import { MapPin, BookOpen } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -30,7 +30,7 @@ export default function LandingPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingOverlay
+          <NavbarStyleFullscreen
             navItems={[
               { name: "Home", id: "hero" },
               { name: "Shops", id: "shops" },
@@ -41,23 +41,25 @@ export default function LandingPage() {
         </div>
 
         <div id="hero" data-section="hero">
-            <HeroBillboardGallery
+          <HeroSplitDoubleCarousel
             title="Find Your Perfect Flow"
             description="Discover the best coffee shops for deep work across American Samoa. Quiet, reliable, and inspiring."
             background={{ variant: "sparkles-gradient" }}
             tag="Concentration First"
             tagIcon={MapPin}
-            mediaItems={[
+            leftCarouselItems={[
-              { imageSrc: "http://img.b2bpic.net/free-photo/top-view-coffee-cookies_23-2148571119.jpg", imageAlt: "cozy workspace" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/top-view-coffee-cookies_23-2148571119.jpg?_wi=1" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/professional-artisan-job-workshop_23-2148801581.jpg", imageAlt: "modern cafe interior" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-notepad-cafe-table_23-2147962616.jpg?_wi=1" }
-              { imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-notepad-cafe-table_23-2147962616.jpg", imageAlt: "productive desk setup" }
+            ]}
+            rightCarouselItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/professional-artisan-job-workshop_23-2148801581.jpg?_wi=1" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/table-ready-lunch_1162-65.jpg?_wi=1" }
             ]}
-            mediaAnimation="blur-reveal"
           />
         </div>
 
         <div id="about" data-section="about">
-            <TextAbout
+          <TextAbout
             title="We curate spaces where productivity meets the perfect cup of coffee."
             tag="Our Philosophy"
             useInvertedBackground={false}
@@ -65,7 +67,7 @@ export default function LandingPage() {
         </div>
 
         <div id="shops" data-section="shops">
-            <ProductCardOne
+          <ProductCardFour
             title="Curated Workspaces"
             description="Only shops with proven Wi-Fi and quiet environments make our list."
             gridVariant="asymmetric-60-wide-40-narrow"
@@ -73,69 +75,73 @@ export default function LandingPage() {
             textboxLayout="split"
             useInvertedBackground={false}
             products={[
-              { id: "s1", name: "Island Brew Studio", price: "$$ - Reliable Wi-Fi", imageSrc: "http://img.b2bpic.net/free-photo/table-ready-lunch_1162-65.jpg" },
+              { id: "s1", name: "Island Brew Studio", price: "$$ - Reliable Wi-Fi", variant: "Open", imageSrc: "http://img.b2bpic.net/free-photo/table-ready-lunch_1162-65.jpg?_wi=2" },
-              { id: "s2", name: "Zen Bean Cafe", price: "$$$ - Silent Zone", imageSrc: "http://img.b2bpic.net/free-photo/photo-concentrated-readhead-bearded-businessman-reading-contract-sitting-cafeteria_171337-9893.jpg" }
+              { id: "s2", name: "Zen Bean Cafe", price: "$$$ - Silent Zone", variant: "Quiet", imageSrc: "http://img.b2bpic.net/free-photo/photo-concentrated-readhead-bearded-businessman-reading-contract-sitting-cafeteria_171337-9893.jpg" }
             ]}
           />
         </div>
 
         <div id="features" data-section="features">
-            <FeatureCardTwentySix
+          <FeatureCardThree
             title="What We Evaluate"
             description="Our criteria ensures that every recommended shop is perfect for deep work."
+            gridVariant="four-items-2x2-equal-grid"
+            animationType="slide-up"
             textboxLayout="inline-image"
             useInvertedBackground={false}
             features={[
-              { title: "High Speed Wi-Fi", description: "Consistent, fiber-grade internet access.", buttonIcon: Wifi },
+              { title: "High Speed Wi-Fi", description: "Consistent, fiber-grade internet access.", imageSrc: "http://img.b2bpic.net/free-photo/interior-nice-bar_23-2147897025.jpg?_wi=1" },
-              { title: "Locally Roasted", description: "Fresh beans from the best local roasters.", buttonIcon: Coffee },
+              { title: "Locally Roasted", description: "Fresh beans from the best local roasters.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-coffee-cookies_23-2148571119.jpg?_wi=2" },
-              { title: "Ergonomics", description: "Comfortable seating for hours of focus.", buttonIcon: Star },
+              { title: "Ergonomics", description: "Comfortable seating for hours of focus.", imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-notepad-cafe-table_23-2147962616.jpg?_wi=2" },
-              { title: "Quiet Atmosphere", description: "Low noise, low traffic environments.", buttonIcon: MapPin }
+              { title: "Quiet Atmosphere", description: "Low noise, low traffic environments.", imageSrc: "http://img.b2bpic.net/free-photo/professional-artisan-job-workshop_23-2148801581.jpg?_wi=2" }
             ]}
           />
         </div>
 
         <div id="testimonials" data-section="testimonials">
-            <TestimonialCardFifteen
+          <TestimonialCardTwo
-            testimonial="I doubled my output in just one week by finding this spot. The quiet zone is a game changer for remote freelancers!"
+            title="What Workers Say"
-            author="Alex R., Remote Developer"
+            description="Success stories from our community."
-            rating={5}
+            animationType="blur-reveal"
-            ratingAnimation="slide-up"
+            textboxLayout="split"
-            avatarsAnimation="opacity"
+            useInvertedBackground={false}
-            avatars={[{ src: "http://img.b2bpic.net/free-photo/portrait-smiling-male-worker_1162-65.jpg", alt: "User" }]}
+            testimonials={[
-            useInvertedBackground={true}
+              { id: "t1", name: "Alex R.", role: "Remote Developer", testimonial: "I doubled my output in just one week by finding this spot. The quiet zone is a game changer!", icon: BookOpen }
+            ]}
           />
         </div>
 
         <div id="faq" data-section="faq">
-            <FaqSplitText
+          <FaqSplitMedia
-            sideTitle="Your Work-From-Cafe Questions"
+            title="Work-From-Cafe FAQs"
             faqs={[
               { id: "q1", title: "How is Wi-Fi speed verified?", content: "We perform speed tests at peak and off-peak hours." },
               { id: "q2", title: "Are these family friendly?", content: "We highlight the 'Deep Work' friendly shops, which are often quieter." }
             ]}
+            description="Everything you need to know."
+            imageSrc="http://img.b2bpic.net/free-photo/interior-nice-bar_23-2147897025.jpg?_wi=2"
             faqsAnimation="slide-up"
+            textboxLayout="split"
             useInvertedBackground={false}
           />
         </div>
 
         <div id="blog" data-section="blog">
-            <BlogCardOne
+          <BlogCardThree
             title="Productivity Tips"
             description="Insights into maintaining focus while working from public spaces."
-            animationType="slide-up"
+            animationType="blur-reveal"
             textboxLayout="split"
             useInvertedBackground={false}
             blogs={[
-              { id: "b1", category: "Guide", title: "Deep Work Techniques", excerpt: "How to block distractions anywhere.", imageSrc: "http://img.b2bpic.net/free-photo/interior-nice-bar_23-2147897025.jpg", authorName: "Admin", authorAvatar: "", date: "Jan 2025" }
+              { id: "b1", category: "Guide", title: "Deep Work Techniques", excerpt: "How to block distractions anywhere.", imageSrc: "http://img.b2bpic.net/free-photo/interior-nice-bar_23-2147897025.jpg?_wi=3", authorName: "Admin", authorAvatar: "", date: "Jan 2025" }
             ]}
           />
         </div>
 
         <div id="contact" data-section="contact">
-            <ContactCTA
+          <ContactText
-            tag="Get Involved"
+            text="Found a new quiet spot? Tell us about your favorite hidden gem for deep work."
-            title="Found a new quiet spot?"
-            description="Tell us about your favorite hidden gem for deep work."
             buttons={[{ text: "Submit a Location", href: "#contact" }]}
             background={{ variant: "sparkles-gradient" }}
             useInvertedBackground={false}
@@ -143,13 +149,15 @@ export default function LandingPage() {
         </div>
 
         <div id="footer" data-section="footer">
-            <FooterLogoReveal
+          <FooterBaseCard
             logoText="DeepWork Coffee"
-            leftLink={{ text: "Privacy", href: "#" }}
+            columns={[
-            rightLink={{ text: "Contact", href: "#contact" }}
+              { title: "Links", items: [{ label: "Home", href: "#hero" }, { label: "Shops", href: "#shops" }] },
+              { title: "Support", items: [{ label: "Privacy", href: "#" }, { label: "Contact", href: "#contact" }] }
+            ]}
           />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}