Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -7,7 +7,7 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
 import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
 
 export default function LandingPage() {
@@ -29,25 +29,15 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
-          id: "home",
-        },
+          name: "Home",          id: "home"},
         {
-          name: "About",
-          id: "about",
-        },
+          name: "About",          id: "about"},
         {
-          name: "Products",
-          id: "products",
-        },
+          name: "Products",          id: "products"},
         {
-          name: "Reviews",
-          id: "testimonials",
-        },
+          name: "Reviews",          id: "testimonials"},
         {
-          name: "FAQ",
-          id: "faq",
-        },
+          name: "FAQ",          id: "faq"},
       ]}
       brandName="Lumina Skincare"
     />
@@ -56,19 +46,14 @@ export default function LandingPage() {
   <div id="home" data-section="home">
       <HeroLogoBillboard
       background={{
-        variant: "plain",
-      }}
+        variant: "plain"}}
       logoText="Lumina"
       description="Redefine your glow with our science-backed, nature-infused skincare collection."
       buttons={[
         {
-          text: "Shop Now",
-          href: "#products",
-        },
+          text: "Shop Now",          href: "#products"},
         {
-          text: "Our Story",
-          href: "#about",
-        },
+          text: "Our Story",          href: "#about"},
       ]}
       buttonAnimation="slide-up"
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-high-end-minimalist-skincare-product-s-1774858641752-34f2432e.png"
@@ -81,55 +66,32 @@ export default function LandingPage() {
       useInvertedBackground={false}
       heading={[
         {
-          type: "text",
-          content: "Pure radiance, ",
-        },
+          type: "text",          content: "Pure radiance, "},
         {
-          type: "image",
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-serene-skincare-ingredient-display-sho-1774858642118-c335ead4.png",
-          alt: "Skincare Ingredients",
-        },
+          type: "image",          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-serene-skincare-ingredient-display-sho-1774858642118-c335ead4.png",          alt: "Skincare Ingredients"},
         {
-          type: "text",
-          content: " formulated for you.",
-        },
+          type: "text",          content: " formulated for you."},
       ]}
       buttons={[
         {
-          text: "View Ingredients",
-        },
+          text: "View Ingredients"},
       ]}
     />
   </div>
 
   <div id="products" data-section="products">
-      <ProductCardFour
+      <ProductCardOne
       animationType="slide-up"
       textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
+      gridVariant="four-items-2x2-equal-grid"
       useInvertedBackground={false}
       products={[
         {
-          id: "p1",
-          name: "Radiance Serum",
-          price: "$85",
-          variant: "30ml",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/modern-glass-serum-bottle-with-elegant-d-1774858641118-68d352b4.png",
-        },
+          id: "p1",          name: "Radiance Serum",          price: "$85",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/modern-glass-serum-bottle-with-elegant-d-1774858641118-68d352b4.png"},
         {
-          id: "p2",
-          name: "Hydrating Cream",
-          price: "$65",
-          variant: "50ml",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-rich-cream-jar-with-gold-trim-and-soft-1774858641615-2904fff1.png",
-        },
+          id: "p2",          name: "Hydrating Cream",          price: "$65",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-rich-cream-jar-with-gold-trim-and-soft-1774858641615-2904fff1.png"},
         {
-          id: "p3",
-          name: "Clarifying Toner",
-          price: "$45",
-          variant: "100ml",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-delicate-toner-bottle-clean-glass-pack-1774858642535-3b459878.png",
-        },
+          id: "p3",          name: "Clarifying Toner",          price: "$45",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/a-delicate-toner-bottle-clean-glass-pack-1774858642535-3b459878.png"},
       ]}
       title="Essential Care"
       description="Premium treatments for daily rejuvenation."
@@ -141,30 +103,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "t1",
-          name: "Sarah W.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-clear-glo-1774858642823-a151fbfc.png?_wi=1",
-        },
+          id: "t1",          name: "Sarah W.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-clear-glo-1774858642823-a151fbfc.png?_wi=1"},
         {
-          id: "t2",
-          name: "Michael L.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-radiant-h-1774858642850-098163e8.png",
-        },
+          id: "t2",          name: "Michael L.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-radiant-h-1774858642850-098163e8.png"},
         {
-          id: "t3",
-          name: "Elena R.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-of-person-with-hydrated-skin-so-1774858641259-74560ff0.png",
-        },
+          id: "t3",          name: "Elena R.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-of-person-with-hydrated-skin-so-1774858641259-74560ff0.png"},
         {
-          id: "t4",
-          name: "David K.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-of-person-with-clear-healthy-sk-1774858641321-14d5480c.png",
-        },
+          id: "t4",          name: "David K.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-of-person-with-clear-healthy-sk-1774858641321-14d5480c.png"},
         {
-          id: "t5",
-          name: "Julia M.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-clear-glo-1774858642823-a151fbfc.png?_wi=2",
-        },
+          id: "t5",          name: "Julia M.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BenVx8uguzidbO4Jt2cSl94SsR/close-up-shot-of-a-person-with-clear-glo-1774858642823-a151fbfc.png?_wi=2"},
       ]}
       cardTitle="Glow Stories"
       cardTag="Our Community"
@@ -178,20 +125,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "f1",
-          title: "Are products organic?",
-          content: "Yes, we prioritize ethically sourced, natural ingredients.",
-        },
+          id: "f1",          title: "Are products organic?",          content: "Yes, we prioritize ethically sourced, natural ingredients."},
         {
-          id: "f2",
-          title: "Shipping time?",
-          content: "Standard delivery takes 3-5 business days.",
-        },
+          id: "f2",          title: "Shipping time?",          content: "Standard delivery takes 3-5 business days."},
         {
-          id: "f3",
-          title: "Do you test on animals?",
-          content: "Never. We are proudly cruelty-free.",
-        },
+          id: "f3",          title: "Do you test on animals?",          content: "Never. We are proudly cruelty-free."},
       ]}
       title="Need Help?"
       description="Answers to common skin care questions."
@@ -205,37 +143,25 @@ export default function LandingPage() {
         {
           items: [
             {
-              label: "Shop",
-              href: "#products",
-            },
+              label: "Shop",              href: "#products"},
             {
-              label: "Story",
-              href: "#about",
-            },
+              label: "Story",              href: "#about"},
           ],
         },
         {
           items: [
             {
-              label: "Support",
-              href: "#faq",
-            },
+              label: "Support",              href: "#faq"},
             {
-              label: "Contact",
-              href: "#",
-            },
+              label: "Contact",              href: "#"},
           ],
         },
         {
           items: [
             {
-              label: "Privacy",
-              href: "#",
-            },
+              label: "Privacy",              href: "#"},
             {
-              label: "Terms",
-              href: "#",
-            },
+              label: "Terms",              href: "#"},
           ],
         },
       ]}
@@ -245,4 +171,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}