Update src/app/shop/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -11,7 +11,7 @@ import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import ContactText from '@/components/sections/contact/ContactText';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
-import { Brain, ChartLine, Clock, HelpCircle, Lightbulb, Rocket, ShieldCheck, Sparkles, Star, TrendingUp, Users } from "lucide-react";
+import { Rocket, Lightbulb, TrendingUp, Users, Clock, Brain, Star, ShieldCheck, HelpCircle, Sparkles, ChartLine } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -45,11 +45,17 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           buttons={[{text:"Get Started Free",href:"#contact"},{text:"Learn More",href:"#features"}]}
           buttonAnimation="slide-up"
-          mediaItems={[{imageSrc:"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=1",imageAlt:"AI CRM dashboard interface showing analytics and data"},{imageSrc:"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=2",imageAlt:"AI CRM dashboard interface showing analytics and data"},{imageSrc:"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=3",imageAlt:"AI CRM dashboard interface showing analytics and data"},{imageSrc:"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=4",imageAlt:"AI CRM dashboard interface showing analytics and data"},{imageSrc:"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=5",imageAlt:"AI CRM dashboard interface showing analytics and data"}]}
           ariaLabel="Hero section for AI CRM management tool"
           titleClassName="text-foreground"
           descriptionClassName="text-foreground/80"
           tagClassName="text-primary-cta"
+          mediaItems={[
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/a-futuristic-and-clean-ai-crm-dashboard--1771622895724-0d110bdb.png?_wi=1", imageAlt: "AI CRM dashboard" },
+            { imageSrc: "https://images.unsplash.com/photo-1596526131083-04230d765057?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1MDcxMzJ8MHwxfHNlYXJjaHwxfHxhYnN0cmFjdCUyMGFpJTIwbmV0d29ya3xlbnwwfHx8fDE3MTc3MjIyMDl8MA&ixlib=rb-4.0.3&q=80&w=1080", imageAlt: "Abstract AI network" },
+            { imageSrc: "https://images.unsplash.com/photo-1620280829393-01865e9ce636?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1MDcxMzJ8MHwxfHNlYXJjaHwxfHxnG93aW5nJTIwY2lyY3VpdCUyMGJvYXJkfGVufDB8fHx8MTcxNzcyMjIwOXww&ixlib=rb-4.0.3&q=80&w=1080", imageAlt: "Glowing circuit board" },
+            { imageSrc: "https://images.unsplash.com/photo-1522066228564-9ca589b35b6b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1MDcxMzJ8MHwxfHNlYXJjaHwxfHxmdXR1cmlzdGljJTIwY2l0eXNjYXBlfGVufDB8fHx8MTcxNzcyMjIwOXww&ixlib=rb-4.0.3&q=80&w=1080", imageAlt: "Futuristic cityscape" },
+            { imageSrc: "https://images.unsplash.com/photo-1593530084478-f71e5c545367?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1MDcxMzJ8MHwxfHNlYXJjaHwxfHxoG9sb2dyYXB", imageAlt: "Holographic interface interaction" }
+          ]}
         />
       </div>
       <div id="about" data-section="about">

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

@@ -89,7 +89,7 @@ function ProductPageContent({ params }: ProductPageProps) {
                 headingFontWeight="light"
             >
                 <ReactLenis root>
-                    <div id="navbar" data-section="navbar">
+                    <div id="nav" data-section="nav">
                         <NavbarStyleFullscreen
                             navItems={[{ name: "Home", id: "/" }]}
                             brandName="AI CRM Pro"
@@ -120,7 +120,7 @@ function ProductPageContent({ params }: ProductPageProps) {
                 headingFontWeight="light"
             >
                 <ReactLenis root>
-                    <div id="navbar" data-section="navbar">
+                    <div id="nav" data-section="nav">
                         <NavbarStyleFullscreen
                             navItems={[{ name: "Home", id: "/" }]}
                             brandName="AI CRM Pro"
@@ -158,7 +158,7 @@ function ProductPageContent({ params }: ProductPageProps) {
             headingFontWeight="light"
         >
             <ReactLenis root>
-                <div id="navbar" data-section="navbar">
+                <div id="nav" data-section="nav">
                     <NavbarStyleFullscreen
                         navItems={[{ name: "Home", id: "/" }]}
                         brandName="AI CRM Pro"

src/app/shop/page.tsx

@@ -30,7 +30,8 @@ export default function ShopPage() {
         getCheckoutItems,
     } = useCart();
 
-    const { checkout, isLoading: isCheckoutLoading } = useCheckout();
+    const {
+        checkout, isLoading: isCheckoutLoading } = useCheckout();
 
     const handleCheckout = useCallback(async () => {
         if (cartItems.length === 0) return;
@@ -57,7 +58,7 @@ export default function ShopPage() {
                 headingFontWeight="light"
             >
                 <ReactLenis root>
-                    <div id="navbar" data-section="navbar">
+                    <div id="nav" data-section="nav">
                         <NavbarStyleFullscreen
                             navItems={[{ name: "Home", id: "/" }]}
                             brandName="AI CRM Pro"
@@ -87,7 +88,7 @@ export default function ShopPage() {
             headingFontWeight="light"
         >
             <ReactLenis root>
-                <div id="navbar" data-section="navbar">
+                <div id="nav" data-section="nav">
                     <NavbarStyleFullscreen
                         navItems={[{ name: "Home", id: "/" }]}
                         brandName="AI CRM Pro"