Update src/app/shop/page.tsx

Merge version_5 into main

src/app/blog/page.tsx

@@ -31,9 +31,9 @@ export default function BlogPage() {
         >
             <div id="nav" data-section="nav">
                 <NavbarLayoutFloatingOverlay
-                    navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                    navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                     brandName="CRM AI"
-                    button={{ text: "Get Started", href: "#contact" }}
+                    button={{ text: "Get Started", href: "/#contact" }}
                     buttonClassName="min-w-[120px] justify-center"
                     buttonTextClassName="relative top-[0.5px]"
                     className="z-50 backdrop-blur-md"

src/app/features/page.tsx

@@ -37,9 +37,9 @@ export default function FeaturesPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingOverlay
-          navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+          navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
           brandName="CRM AI"
-          button={{text:"Get Started",href:"#contact"}}
+          button={{text:"Get Started",href:"/#contact"}}
           buttonClassName="min-w-[120px] justify-center"
           buttonTextClassName="relative top-[0.5px]"
           className="z-50 backdrop-blur-md"

src/app/page.tsx

@@ -2,7 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import HeroCentered from '@/components/sections/hero/HeroCentered';
 import AboutMetric from '@/components/sections/about/AboutMetric';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
@@ -56,17 +56,19 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroLogoBillboard
-          logoText="CRM AI"
+        <HeroCentered
+          title="CRM AI"
           description="Unleash the power of artificial intelligence to automate tasks, gain deeper customer insights, and drive unparalleled growth for your business."
           background={{variant:"sparkles-gradient"}}
+          avatars={[
+            { src: "https://via.placeholder.com/40", alt: "User Avatar 1" },
+            { src: "https://via.placeholder.com/40", alt: "User Avatar 2" },
+            { src: "https://via.placeholder.com/40", alt: "User Avatar 3" }
+          ]}
+          avatarText="Trusted by AI innovators"
           buttons={[{text:"Get Started Free",href:"#contact"},{text:"Watch Demo",href:"#features"}]}
           buttonAnimation="slide-up"
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-user-friendly-interface-showcasing-ai--1771626574716-a33c15c9.png?_wi=1"
-          imageAlt="AI-Powered Automation Interface"
-          mediaAnimation="opacity"
-          frameStyle="card"
-          className="min-h-[calc(100svh-var(--navbar-height))] md:min-h-[calc(100vh-var(--navbar-height))] pt-[var(--navbar-height))]"
+          className="min-h-[calc(100svh-var(--navbar-height))] md:min-h-[calc(100vh-var(--navbar-height))] pt-[var(--navbar-height)]"
         />
       </div>
 

src/app/shop/[id]/page.tsx

@@ -92,7 +92,7 @@ function ProductPageContent({ params }: ProductPageProps) {
                 <ReactLenis root>
                     <div id="nav" data-section="nav">
                         <NavbarLayoutFloatingOverlay
-                            navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                            navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                             brandName="CRM AI"
                             button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                             buttonClassName="min-w-[120px] justify-center"
@@ -141,7 +141,7 @@ function ProductPageContent({ params }: ProductPageProps) {
                 <ReactLenis root>
                     <div id="nav" data-section="nav">
                         <NavbarLayoutFloatingOverlay
-                            navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                            navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                             brandName="CRM AI"
                             button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                             buttonClassName="min-w-[120px] justify-center"
@@ -197,7 +197,7 @@ function ProductPageContent({ params }: ProductPageProps) {
             <ReactLenis root>
                 <div id="nav" data-section="nav">
                     <NavbarLayoutFloatingOverlay
-                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                         brandName="CRM AI"
                         button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                         buttonClassName="min-w-[120px] justify-center"

src/app/shop/page.tsx

@@ -61,7 +61,7 @@ export default function ShopPage() {
                 <ReactLenis root>
                     <div id="nav" data-section="nav">
                     <NavbarLayoutFloatingOverlay
-                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                         brandName="CRM AI"
                         button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                         buttonClassName="min-w-[120px] justify-center"
@@ -109,7 +109,7 @@ export default function ShopPage() {
             <ReactLenis root>
                 <div id="nav" data-section="nav">
                     <NavbarLayoutFloatingOverlay
-                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"#products"},{name:"Reviews",id:"#testimonials"},{name:"Contact",id:"#contact"}]}
+                        navItems={[{name:"Home",id:"/"},{name:"Features",id:"/features"},{name:"Solutions",id:"/#products"},{name:"Reviews",id:"/#testimonials"},{name:"Contact",id:"/#contact"}]}
                         brandName="CRM AI"
                         button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                         buttonClassName="min-w-[120px] justify-center"