Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -4,16 +4,16 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import { lazy, Suspense } from "react";
 
-const ContactSplitForm = lazy(() => import('@/components/sections/contact/ContactSplitForm'));
-const FaqBase = lazy(() => import('@/components/sections/faq/FaqBase'));
-const FeatureCardMedia = lazy(() => import('@/components/sections/feature/FeatureCardMedia'));
-const FooterLogoReveal = lazy(() => import('@/components/sections/footer/FooterLogoReveal'));
-const HeroBillboardScroll = lazy(() => import('@/components/sections/hero/HeroBillboardScroll'));
+const ContactCTA = lazy(() => import('@/components/sections/contact/ContactCTA'));
+const FaqSplitText = lazy(() => import('@/components/sections/faq/FaqSplitText'));
+const FeatureCardSeven = lazy(() => import('@/components/sections/feature/FeatureCardSeven'));
+const FooterCard = lazy(() => import('@/components/sections/footer/FooterCard'));
+const HeroCentered = lazy(() => import('@/components/sections/hero/HeroCentered'));
 const MetricCardFourteen = lazy(() => import('@/components/sections/metrics/MetricCardFourteen'));
-const NavbarStyleCentered = lazy(() => import('@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'));
-const ProductCardFour = lazy(() => import('@/components/sections/product/ProductCardFour'));
-const TestimonialCardSix = lazy(() => import('@/components/sections/testimonial/TestimonialCardSix'));
-const TextSplitAbout = lazy(() => import('@/components/sections/about/TextSplitAbout'));
+const NavbarStyleFullscreen = lazy(() => import('@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'));
+const ProductCardOne = lazy(() => import('@/components/sections/product/ProductCardOne'));
+const TestimonialCardThirteen = lazy(() => import('@/components/sections/testimonial/TestimonialCardThirteen'));
+const SplitAbout = lazy(() => import('@/components/sections/about/SplitAbout'));
 
 export default function LandingPage() {
   return (
@@ -30,9 +30,9 @@ export default function LandingPage() {
         headingFontWeight="bold"
     >
       <ReactLenis root>
-        <Suspense fallback={<div className="h-20" />}>
+        <Suspense fallback={<div className="h-screen w-full flex items-center justify-center" />}>
           <div id="nav" data-section="nav">
-            <NavbarStyleCentered
+            <NavbarStyleFullscreen
               navItems={[
                 { name: "About", id: "about" },
                 { name: "Menu", id: "products" },
@@ -44,57 +44,59 @@ export default function LandingPage() {
           </div>
 
           <div id="hero" data-section="hero">
-            <HeroBillboardScroll
-              background={{ variant: "gradient-bars" }}
+            <HeroCentered
               title="Craft roasted coffee, thoughtfully served daily"
               description="Explore our house-roasted beans and industrial minimalist space. From espresso to cold brew, experience specialty coffee crafted with genuine care."
+              background={{ variant: "gradient-bars" }}
+              avatars={[]}
               buttons={[{ text: "Visit us or order online", href: "#contact" }]}
-              imageSrc="http://img.b2bpic.net/free-photo/modern-cafe-interior-design_23-2151945689.jpg?w=1200&q=80"
             />
           </div>
 
           <div id="about" data-section="about">
-            <TextSplitAbout
+            <SplitAbout
               useInvertedBackground={true}
               title="Our Craft in Detroit"
-              description={[
-                "Anthology Coffee was born in Detroit, built on a foundation of transparency and craftsmanship. We source exceptional beans and roast them with an uncompromising commitment to quality.",        
-                "Our space reflects this honesty—an industrial, minimalist environment designed to celebrate the purity of the roast and the richness of the community."
+              description="Anthology Coffee was born in Detroit, built on a foundation of transparency and craftsmanship. We source exceptional beans and roast them with an uncompromising commitment to quality."
+              textboxLayout="split"
+              bulletPoints={[
+                { title: "Transparency", description: "Sourcing directly from farmers." },
+                { title: "Craftsmanship", description: "Roasting with uncompromising quality." }
               ]}
             />
           </div>
 
           <div id="features" data-section="features">
-            <FeatureCardMedia
+            <FeatureCardSeven
               animationType="slide-up"
               textboxLayout="split"
               useInvertedBackground={false}
               features={[
-                { id: "1", title: "Precision Roasting", description: "Every batch is roasted to highlight the unique origin characteristics of the bean.", tag: "Craft", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-drip-coffee-desk-table_197531-32459.jpg?w=600&q=75" },
-                { id: "2", title: "Artisan Brewing", description: "From precise pour-overs to perfect shots of espresso, we honor the preparation process.", tag: "Brew", imageSrc: "http://img.b2bpic.net/free-photo/stylish-bearded-tattooed-caucasian-black-indian-men-drinking-craft-beer-microbrewery_613910-13584.jpg?w=600&q=75" },
-                { id: "3", title: "Freshness Guaranteed", description: "We roast in small batches, ensuring you receive the freshest coffee possible every visit.", tag: "Fresh", imageSrc: "http://img.b2bpic.net/free-photo/small-roasted-linen-cafe-italian_1172-347.jpg?w=600&q=75" },
+                { title: "Precision Roasting", description: "Every batch is roasted to highlight origin.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-drip-coffee-desk-table_197531-32459.jpg?w=600&q=75" },
+                { title: "Artisan Brewing", description: "We honor the preparation process.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-bearded-tattooed-caucasian-black-indian-men-drinking-craft-beer-microbrewery_613910-13584.jpg?w=600&q=75" },
+                { title: "Freshness", description: "Small batches for fresh coffee.", imageSrc: "http://img.b2bpic.net/free-photo/small-roasted-linen-cafe-italian_1172-347.jpg?w=600&q=75" },
               ]}
               title="The Anthology Experience"
-              description="More than just a caffeine fix—discover the precision and intention behind every cup we serve."
+              description="More than just a caffeine fix—discover the intention behind every cup."
             />
           </div>
 
           <div id="products" data-section="products">
-            <ProductCardFour
+            <ProductCardOne
               animationType="slide-up"
               textboxLayout="split"
               gridVariant="four-items-2x2-equal-grid"
               useInvertedBackground={true}
               products={[
-                { id: "p1", name: "Latte", price: "$5.00", variant: "Popular", imageSrc: "http://img.b2bpic.net/free-photo/dark-coffee-mug-viewed-from_1232-1151.jpg?w=400&q=70" },
-                { id: "p2", name: "Iced Coffee", price: "$4.50", variant: "Seasonal", imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-holding-cup-coffee-cafe_1150-4324.jpg?w=400&q=70" },
-                { id: "p3", name: "Cold Brew", price: "$4.75", variant: "Smooth", imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-delicious-iced-coffee_52683-91638.jpg?w=400&q=70" },
-                { id: "p4", name: "Cortado", price: "$4.00", variant: "Balanced", imageSrc: "http://img.b2bpic.net/free-photo/tool-used-coffee-machine-coffee-making-process_23-2150187528.jpg?w=400&q=70" },
-                { id: "p5", name: "Cappuccino", price: "$4.50", variant: "Classic", imageSrc: "http://img.b2bpic.net/free-photo/2-latte-wooden-table_501050-1095.jpg?w=400&q=70" },
-                { id: "p6", name: "Whole Bean Roast", price: "$18.00", variant: "Retail", imageSrc: "http://img.b2bpic.net/free-photo/side-view-brown-coffee-beans-sack-rustic-table_141793-6964.jpg?w=400&q=70" },
+                { id: "p1", name: "Latte", price: "$5.00", imageSrc: "http://img.b2bpic.net/free-photo/dark-coffee-mug-viewed-from_1232-1151.jpg?w=400&q=70", variant: "default" },
+                { id: "p2", name: "Iced Coffee", price: "$4.50", imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-holding-cup-coffee-cafe_1150-4324.jpg?w=400&q=70", variant: "default" },
+                { id: "p3", name: "Cold Brew", price: "$4.75", imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-delicious-iced-coffee_52683-91638.jpg?w=400&q=70", variant: "default" },
+                { id: "p4", name: "Cortado", price: "$4.00", imageSrc: "http://img.b2bpic.net/free-photo/tool-used-coffee-machine-coffee-making-process_23-2150187528.jpg?w=400&q=70", variant: "default" },
+                { id: "p5", name: "Cappuccino", price: "$4.50", imageSrc: "http://img.b2bpic.net/free-photo/2-latte-wooden-table_501050-1095.jpg?w=400&q=70", variant: "default" },
+                { id: "p6", name: "Whole Bean Roast", price: "$18.00", imageSrc: "http://img.b2bpic.net/free-photo/side-view-brown-coffee-beans-sack-rustic-table_141793-6964.jpg?w=400&q=70", variant: "default" },
               ]}
               title="The Coffee Menu"
-              description="Hand-crafted beverages using our own freshly roasted beans. Taste the difference quality makes."
+              description="Hand-crafted beverages using our own freshly roasted beans."
             />
           </div>
 
@@ -104,64 +106,58 @@ export default function LandingPage() {
               title="Impact & Growth"
               tag="Our Story"
               metrics={[
-                { id: "m1", value: "4.6", description: "Avg Star Rating (450+ Reviews)" },
-                { id: "m2", value: "100%", description: "Direct Sourcing Transparency" },
-                { id: "m3", value: "12k+", description: "Cups Poured Monthly" },
+                { id: "m1", value: "4.6", description: "Avg Star Rating" },
+                { id: "m2", value: "100%", description: "Direct Sourcing" },
+                { id: "m3", value: "12k+", description: "Cups Poured" },
               ]}
-              metricsAnimation="slide-up"
             />
           </div>
 
           <div id="testimonials" data-section="testimonials">
-            <TestimonialCardSix
+            <TestimonialCardThirteen
               animationType="slide-up"
               textboxLayout="split"
               useInvertedBackground={true}
-              title="What Our Neighbors Say"
-              description="Join our community of coffee lovers who value craft, quality, and atmosphere."
+              showRating={true}
+              title="Testimonials"
+              description="What our coffee lovers say about us."
               testimonials={[
-                { id: "1", name: "Yuji Tk", handle: "@yuji_tk", testimonial: "My favorite roaster in the entire Detroit area.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-smiling-woman-holding-cup-coffee-posing-kitchen-enjoying_1258-198203.jpg?w=100&q=60" },
-                { id: "2", name: "Rosanna Ramos", handle: "@rosanna", testimonial: "The space felt cozy and toasty, with an open-air vibe.", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-using-laptop-cafe_23-2147785380.jpg?w=100&q=60" },
-                { id: "3", name: "Luke Salik", handle: "@lukes", testimonial: "Consistently came up as one of the best.", imageSrc: "http://img.b2bpic.net/free-photo/two-young-women-with-cup-coffee-looking-each-other_23-2147894404.jpg?w=100&q=60" }
+                { id: "t1", name: "Yuji Tk", handle: "@yujitk", testimonial: "My favorite roaster in the entire Detroit area.", rating: 5 }
               ]}
             />
           </div>
 
           <div id="faq" data-section="faq">
-            <FaqBase
-              textboxLayout="split"
-              useInvertedBackground={false}
-              faqs={[
-                { id: "f1", title: "Do you offer delivery?", content: "Yes, we offer local delivery through our website and partnerships." },
-                { id: "f2", title: "Is your space pet-friendly?", content: "We welcome well-behaved pets in our patio area during open hours." },
-                { id: "f3", title: "Are your beans gluten-free?", content: "Yes, all of our roasted coffee beans are gluten-free and allergen-friendly." },
-              ]}
-              title="Common Questions"
-              description="Answers to how we roast, serve, and welcome our community."
+            <FaqSplitText
               faqsAnimation="slide-up"
+              useInvertedBackground={false}
+              sideTitle="Common Questions"
+              faqs={[
+                { id: "f1", title: "Do you offer delivery?", content: "Yes, we offer local delivery." },
+                { id: "f2", title: "Is your space pet-friendly?", content: "We welcome well-behaved pets." },
+                { id: "f3", title: "Are your beans gluten-free?", content: "Yes, our beans are gluten-free." },
+              ]}
             />
           </div>
 
           <div id="contact" data-section="contact">
-            <ContactSplitForm
+            <ContactCTA
               useInvertedBackground={true}
               title="Visit Us in Detroit"
-              description="Stop by for a pour-over or order online for pickup. Visit us: https://maps.google.com/?q=1948+Division+St+Detroit"
-              inputs={[{ name: "name", type: "text", placeholder: "Your Name", required: true }, { name: "email", type: "email", placeholder: "Your Email", required: true }]}
-              textarea={{ name: "message", placeholder: "How can we help?" }}
-              imageSrc="http://img.b2bpic.net/free-photo/male-barista-holing-professional-coffee-machine_23-2148824383.jpg?w=800&q=80"
+              description="Stop by for a pour-over or order online."
+              tag="Visit"
+              buttons={[{ text: "Get Directions" }]}
+              background={{ variant: "plain" }}
             />
           </div>
 
           <div id="footer" data-section="footer">
-            <FooterLogoReveal
+            <FooterCard
               logoText="Anthology Coffee"
-              leftLink={{ text: "Privacy", href: "#" }}
-              rightLink={{ text: "Terms", href: "#" }}
             />
           </div>
         </Suspense>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}