Update src/app/collections/prismastem/page.tsx

Merge version_3 into main

src/app/collections/[collectionId]/page.tsx

@@ -0,0 +1,126 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import { useParams } from 'next/navigation';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+// Placeholder product data for collections
+const collectionProducts: { [key: string]: any[] } = {
+  "p-aqua": [
+    { id: "p-aqua-1", name: "VitisCell Hydra Fresh Toner", price: "$250.00", imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg?_wi=1", imageAlt: "VitisCell Hydra Fresh Toner" },
+    { id: "p-aqua-2", name: "VitisCell Fresh Cleanser", price: "$180.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg?_wi=1", imageAlt: "VitisCell Fresh Cleanser" },
+    { id: "p-aqua-3", name: "Intense Hydration Serum", price: "$350.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg?_wi=1", imageAlt: "Intense Hydration Serum" },
+    { id: "p-aqua-4", name: "Dewy Glow Moisturizer", price: "$290.00", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg?_wi=1", imageAlt: "Dewy Glow Moisturizer" },
+  ],
+  "p-embercell": [
+    { id: "p-embercell-1", name: "EmberCell Resurfacing Mask", price: "$320.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg?_wi=1", imageAlt: "EmberCell Resurfacing Mask" },
+    { id: "p-embercell-2", name: "EmberCell Night Cream", price: "$420.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-luxurious-cream-golden-pot_23-2148761498.jpg", imageAlt: "EmberCell Night Cream" },
+    { id: "p-embercell-3", name: "Age-Defying Serum", price: "$490.00", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg?_wi=1", imageAlt: "Age-Defying Serum" },
+    { id: "p-embercell-4", name: "Regenerative Eye Cream", price: "$380.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg?_wi=1", imageAlt: "Regenerative Eye Cream" },
+  ],
+  "p-prismastem": [
+    { id: "p-prismastem-1", name: "Lumi-Cell Brightening Serum", price: "$450.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg?_wi=2", imageAlt: "Lumi-Cell Brightening Serum" },
+    { id: "p-prismastem-2", name: "Radiant Glow Day Cream", price: "$310.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg?_wi=1", imageAlt: "Radiant Glow Day Cream" },
+    { id: "p-prismastem-3", name: "Even Tone Cleanser", price: "$190.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg?_wi=2", imageAlt: "Even Tone Cleanser" },
+    { id: "p-prismastem-4", name: "Spot Correction Treatment", price: "$390.00", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-orange-slices-near-face_171337-1765.jpg", imageAlt: "Spot Correction Treatment" },
+  ],
+};
+
+const collectionTitles: { [key: string]: string } = {
+  "p-aqua": "Aqua Collection",  "p-embercell": "EmberCell Collection",  "p-prismastem": "PrismaStem Collection"};
+
+const consistentNavItems = [
+  { name: "Home", id: "/"},
+  { name: "Best Sellers", id: "/#best-sellers"},
+  { name: "Aqua Collection", id: "/collections/p-aqua"},
+  { name: "EmberCell Collection", id: "/collections/p-embercell"},
+  { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+  { name: "About", id: "/#about"},
+  { name: "Contact", id: "/#contact"},
+];
+
+const consistentFooterColumns = [
+  {
+    title: "SHOP",    items: [
+      { label: "Best Sellers", href: "/#best-sellers"},
+      { label: "Aqua Collection", href: "/collections/p-aqua"},
+      { label: "EmberCell Collection", href: "/collections/p-embercell"},
+      { label: "PrismaStem Collection", href: "/collections/p-prismastem"},
+    ],
+  },
+  {
+    title: "CUSTOMER SERVICE",    items: [
+      { label: "Contact Us", href: "/#contact"},
+      { label: "FAQ", href: "/#faq"},
+      { label: "Shipping & Returns", href: "#"},
+    ],
+  },
+  {
+    title: "ABOUT US",    items: [
+      { label: "Our Story", href: "/#about"},
+      { label: "Our Philosophy", href: "/#about"},
+      { label: "Careers", href: "#"},
+    ],
+  },
+  {
+    title: "LEGAL",    items: [
+      { label: "Privacy Policy", href: "#"},
+      { label: "Terms of Service", href: "#"},
+    ],
+  },
+];
+
+export default function CollectionPage() {
+  const params = useParams();
+  const collectionId = params.collectionId as string;
+  const products = collectionProducts[collectionId] || [];
+  const collectionTitle = collectionTitles[collectionId] || "Unknown Collection";
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-bubble"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="large"
+      background="circleGradient"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="layered"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={consistentNavItems}
+            brandName="Introstem"
+          />
+        </div>
+
+        <div id="collection-products" data-section="collection-products" className="py-24 md:py-32">
+          <ProductCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="three-columns-all-equal-width"
+            useInvertedBackground={false}
+            carouselMode="buttons"
+            products={products}
+            title={`${collectionTitle} Products`}
+            description={`Explore all the premium skincare products from our ${collectionTitle}.`}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={consistentFooterColumns}
+            logoText="Introstem"
+            copyrightText="© 2024 Introstem. All Rights Reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/collections/aqua/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+const consistentNavItems = [
+  { name: "Home", id: "/"},
+  { name: "Best Sellers", id: "/#best-sellers"},
+  { name: "Aqua Collection", id: "/collections/p-aqua"},
+  { name: "EmberCell Collection", id: "/collections/p-embercell"},
+  { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+  { name: "About", id: "/#about"},
+  { name: "Contact", id: "/#contact"},
+];
+
+const consistentFooterColumns = [
+  {
+    title: "SHOP",    items: [
+      { label: "Best Sellers", href: "/#best-sellers"},
+      { label: "Aqua Collection", href: "/collections/p-aqua"},
+      { label: "EmberCell Collection", href: "/collections/p-embercell"},
+      { label: "PrismaStem Collection", href: "/collections/p-prismastem"},
+    ],
+  },
+  {
+    title: "CUSTOMER SERVICE",    items: [
+      { label: "Contact Us", href: "/#contact"},
+      { label: "FAQ", href: "/#faq"},
+      { label: "Shipping & Returns", href: "#"},
+    ],
+  },
+  {
+    title: "ABOUT US",    items: [
+      { label: "Our Story", href: "/#about"},
+      { label: "Our Philosophy", href: "/#about"},
+      { label: "Careers", href: "#"},
+    ],
+  },
+  {
+    title: "LEGAL",    items: [
+      { label: "Privacy Policy", href: "#"},
+      { label: "Terms of Service", href: "#"},
+    ],
+  },
+];
+
+export default function AquaCollectionPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-bubble"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="large"
+        background="circleGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
+        </div>
+
+        <main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
+          <h1 className="text-5xl font-bold mb-4">Aqua Collection</h1>
+          <p className="text-xl text-foreground/70 mb-8 max-w-2xl">Dive into deep hydration with the Aqua Collection, designed to replenish and revitalize your skin.</p>
+          {/* Add specific product details or marketing content for Aqua Collection here */}
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={consistentFooterColumns}
+            logoText="Introstem"
+            copyrightText="© 2024 Introstem. All Rights Reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/collections/embercell/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+const consistentNavItems = [
+  { name: "Home", id: "/"},
+  { name: "Best Sellers", id: "/#best-sellers"},
+  { name: "Aqua Collection", id: "/collections/p-aqua"},
+  { name: "EmberCell Collection", id: "/collections/p-embercell"},
+  { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+  { name: "About", id: "/#about"},
+  { name: "Contact", id: "/#contact"},
+];
+
+const consistentFooterColumns = [
+  {
+    title: "SHOP",    items: [
+      { label: "Best Sellers", href: "/#best-sellers"},
+      { label: "Aqua Collection", href: "/collections/p-aqua"},
+      { label: "EmberCell Collection", href: "/collections/p-embercell"},
+      { label: "PrismaStem Collection", href: "/collections/p-prismastem"},
+    ],
+  },
+  {
+    title: "CUSTOMER SERVICE",    items: [
+      { label: "Contact Us", href: "/#contact"},
+      { label: "FAQ", href: "/#faq"},
+      { label: "Shipping & Returns", href: "#"},
+    ],
+  },
+  {
+    title: "ABOUT US",    items: [
+      { label: "Our Story", href: "/#about"},
+      { label: "Our Philosophy", href: "/#about"},
+      { label: "Careers", href: "#"},
+    ],
+  },
+  {
+    title: "LEGAL",    items: [
+      { label: "Privacy Policy", href: "#"},
+      { label: "Terms of Service", href: "#"},
+    ],
+  },
+];
+
+export default function EmberCellCollectionPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-bubble"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="large"
+        background="circleGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
+        </div>
+
+        <main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
+          <h1 className="text-5xl font-bold mb-4">EmberCell Collection</h1>
+          <p className="text-xl text-foreground/70 mb-8 max-w-2xl">Experience advanced rejuvenation with the EmberCell Collection, designed to firm and restore your skin's youthful vitality.</p>
+          {/* Add specific product details or marketing content for EmberCell Collection here */}
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={consistentFooterColumns}
+            logoText="Introstem"
+            copyrightText="© 2024 Introstem. All Rights Reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/collections/page.tsx

@@ -0,0 +1,99 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+const consistentNavItems = [
+  { name: "Home", id: "/"},
+  { name: "Best Sellers", id: "/#best-sellers"},
+  { name: "Aqua Collection", id: "/collections/p-aqua"},
+  { name: "EmberCell Collection", id: "/collections/p-embercell"},
+  { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+  { name: "About", id: "/#about"},
+  { name: "Contact", id: "/#contact"},
+];
+
+const consistentFooterColumns = [
+  {
+    title: "SHOP",    items: [
+      { label: "Best Sellers", href: "/#best-sellers"},
+      { label: "Aqua Collection", href: "/collections/p-aqua"},
+      { label: "EmberCell Collection", href: "/collections/p-embercell"},
+      { label: "PrismaStem Collection", href: "/collections/p-prismastem"},
+    ],
+  },
+  {
+    title: "CUSTOMER SERVICE",    items: [
+      { label: "Contact Us", href: "/#contact"},
+      { label: "FAQ", href: "/#faq"},
+      { label: "Shipping & Returns", href: "#"},
+    ],
+  },
+  {
+    title: "ABOUT US",    items: [
+      { label: "Our Story", href: "/#about"},
+      { label: "Our Philosophy", href: "/#about"},
+      { label: "Careers", href: "#"},
+    ],
+  },
+  {
+    title: "LEGAL",    items: [
+      { label: "Privacy Policy", href: "#"},
+      { label: "Terms of Service", href: "#"},
+    ],
+  },
+];
+
+export default function CollectionsIndexPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-bubble"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="large"
+        background="circleGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
+        </div>
+
+        <main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
+          <h1 className="text-5xl font-bold mb-4">Our Collections</h1>
+          <p className="text-xl text-foreground/70 mb-8 max-w-2xl">
+            Explore our exquisite range of skincare collections, each crafted with unique formulations to address your specific beauty needs.
+          </p>
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-6 w-full max-w-4xl">
+            <a href="/collections/aqua" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
+              <h2 className="text-2xl font-semibold">Aqua Collection</h2>
+              <p className="text-foreground/60">Deep Hydration</p>
+            </a>
+            <a href="/collections/embercell" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
+              <h2 className="text-2xl font-semibold">EmberCell Collection</h2>
+              <p className="text-foreground/60">Rejuvenating & Anti-Aging</p>
+            </a>
+            <a href="/collections/prismastem" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
+              <h2 className="text-2xl font-semibold">PrismaStem Collection</h2>
+              <p className="text-foreground/60">Radiant Brightening</p>
+            </a>
+          </div>
+        </main>
+        
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={consistentFooterColumns}
+            logoText="Introstem"
+            copyrightText="© 2024 Introstem. All Rights Reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/collections/prismastem/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+const consistentNavItems = [
+  { name: "Home", id: "/"},
+  { name: "Best Sellers", id: "/#best-sellers"},
+  { name: "Aqua Collection", id: "/collections/p-aqua"},
+  { name: "EmberCell Collection", id: "/collections/p-embercell"},
+  { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+  { name: "About", id: "/#about"},
+  { name: "Contact", id: "/#contact"},
+];
+
+const consistentFooterColumns = [
+  {
+    title: "SHOP",    items: [
+      { label: "Best Sellers", href: "/#best-sellers"},
+      { label: "Aqua Collection", href: "/collections/p-aqua"},
+      { label: "EmberCell Collection", href: "/collections/p-embercell"},
+      { label: "PrismaStem Collection", href: "/collections/p-prismastem"},
+    ],
+  },
+  {
+    title: "CUSTOMER SERVICE",    items: [
+      { label: "Contact Us", href: "/#contact"},
+      { label: "FAQ", href: "/#faq"},
+      { label: "Shipping & Returns", href: "#"},
+    ],
+  },
+  {
+    title: "ABOUT US",    items: [
+      { label: "Our Story", href: "/#about"},
+      { label: "Our Philosophy", href: "/#about"},
+      { label: "Careers", href: "#"},
+    ],
+  },
+  {
+    title: "LEGAL",    items: [
+      { label: "Privacy Policy", href: "#"},
+      { label: "Terms of Service", href: "#"},
+    ],
+  },
+];
+
+export default function PrismaStemCollectionPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-bubble"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="large"
+        background="circleGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
+        </div>
+
+        <main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
+          <h1 className="text-5xl font-bold mb-4">PrismaStem Collection</h1>
+          <p className="text-xl text-foreground/70 mb-8 max-w-2xl">Achieve radiant brightness with the PrismaStem Collection, formulated to illuminate and even out your skin tone.</p>
+          {/* Add specific product details or marketing content for PrismaStem Collection here */}
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={consistentFooterColumns}
+            logoText="Introstem"
+            copyrightText="© 2024 Introstem. All Rights Reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -8,7 +8,7 @@ import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwent
 import FooterBase from '@/components/sections/footer/FooterBase';
 import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
@@ -33,20 +33,13 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
-          name: "Shop",          id: "#shop"},
-        {
-          name: "Best Sellers",          id: "#best-sellers"},
-        {
-          name: "Collections",          id: "#collections"},
-        {
-          name: "Products",          id: "#products"},
-        {
-          name: "Concerns",          id: "#concerns"},
-        {
-          name: "About",          id: "#about"},
-        {
-          name: "Contact",          id: "#contact"},
+        { name: "Home", id: "/"},
+        { name: "Best Sellers", id: "/#best-sellers"},
+        { name: "Aqua Collection", id: "/collections/p-aqua"},
+        { name: "EmberCell Collection", id: "/collections/p-embercell"},
+        { name: "PrismaStem Collection", id: "/collections/p-prismastem"},
+        { name: "About", id: "/#about"},
+        { name: "Contact", id: "/#contact"},
       ]}
       brandName="Introstem"
     />
@@ -58,9 +51,9 @@ export default function LandingPage() {
       description="Discover beauty in all our products, harnessing the power of Grape Stem Cells in every drop."
       buttons={[
         {
-          text: "Unlock Your Skin's Youthful Radiance",          href: "#best-sellers"},
+          text: "Unlock Your Skin's Youthful Radiance",          href: "/#best-sellers"},
         {
-          text: "Learn More About Grape Stem Cells",          href: "#about"},
+          text: "Learn More About Grape Stem Cells",          href: "/#about"},
       ]}
       slides={[
         {
@@ -101,13 +94,13 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          title: "Deep Hydration",          description: "Infuse your skin with essential moisture, leaving it plump, soft, and supple throughout the day.",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg",          imageAlt: "Close-up of healthy skin with water drops, symbolizing hydration",          buttonIcon: Droplet,
+          title: "Deep Hydration",          description: "Infuse your skin with essential moisture, leaving it plump, soft, and supple throughout the day.",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg?_wi=2",          imageAlt: "Close-up of healthy skin with water drops, symbolizing hydration",          buttonIcon: Droplet,
         },
         {
           title: "Advanced Anti-Aging",          description: "Target fine lines and wrinkles, promoting a smoother, more youthful complexion with our potent formulas.",          imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-female-model-portrait_23-2149012592.jpg",          imageAlt: "Luxurious anti-aging cream jar with elegant lighting",          buttonIcon: HeartPulse,
         },
         {
-          title: "Firmer, Tighter Skin",          description: "Improve skin elasticity and firmness, giving you a visibly lifted and revitalized appearance.",          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg",          imageAlt: "Elegant serum bottle for skin firming",          buttonIcon: Nut,
+          title: "Firmer, Tighter Skin",          description: "Improve skin elasticity and firmness, giving you a visibly lifted and revitalized appearance.",          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg?_wi=2",          imageAlt: "Elegant serum bottle for skin firming",          buttonIcon: Nut,
         },
         {
           title: "Radiant Brightening",          description: "Enhance your natural glow and achieve an even skin tone, reducing the appearance of dark spots.",          imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-orange-slices-near-her-face_171337-1765.jpg",          imageAlt: "Brightening serum with a luminous effect on skin",          buttonIcon: Lightbulb,
@@ -127,17 +120,17 @@ export default function LandingPage() {
       carouselMode="buttons"
       products={[
         {
-          id: "p1",          name: "VitisCell Hydra Fresh Toner",          price: "$250.00",          imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg",          imageAlt: "Introstem VitisCell Hydra Fresh Toner bottle"},
+          id: "p1",          name: "VitisCell Hydra Fresh Toner",          price: "$250.00",          imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg?_wi=2",          imageAlt: "Introstem VitisCell Hydra Fresh Toner bottle"},
         {
-          id: "p2",          name: "VitisCell Fresh Cleanser",          price: "$180.00",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg",          imageAlt: "Introstem VitisCell Fresh Cleanser tube"},
+          id: "p2",          name: "VitisCell Fresh Cleanser",          price: "$180.00",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg?_wi=3",          imageAlt: "Introstem VitisCell Fresh Cleanser tube"},
         {
-          id: "p3",          name: "EmberCell Resurfacing Mask",          price: "$320.00",          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg",          imageAlt: "Introstem EmberCell Resurfacing Mask jar"},
+          id: "p3",          name: "EmberCell Resurfacing Mask",          price: "$320.00",          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg?_wi=2",          imageAlt: "Introstem EmberCell Resurfacing Mask jar"},
         {
-          id: "p4",          name: "Lumi-Cell Brightening Serum",          price: "$450.00",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg",          imageAlt: "Introstem Lumi-Cell Brightening Serum dropper bottle"},
+          id: "p4",          name: "Lumi-Cell Brightening Serum",          price: "$450.00",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg?_wi=3",          imageAlt: "Introstem Lumi-Cell Brightening Serum dropper bottle"},
         {
-          id: "p5",          name: "Intro Eye Cream",          price: "$290.00",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg",          imageAlt: "Introstem Intro Eye Cream jar"},
+          id: "p5",          name: "Intro Eye Cream",          price: "$290.00",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg?_wi=2",          imageAlt: "Introstem Intro Eye Cream jar"},
         {
-          id: "p6",          name: "Transforming Daily Moisturizer",          price: "$380.00",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg",          imageAlt: "Introstem Transforming Daily Moisturizer jar"},
+          id: "p6",          name: "Transforming Daily Moisturizer",          price: "$380.00",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg?_wi=2",          imageAlt: "Introstem Transforming Daily Moisturizer jar"},
       ]}
       title="Our Best Sellers"
       description="Explore our most loved facial care products, chosen by our valued customers for their exceptional results and luxurious feel."
@@ -165,44 +158,6 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="collections" data-section="collections">
-      <PricingCardEight
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      plans={[
-        {
-          id: "p-aqua",          badge: "Hydrating",          badgeIcon: Droplet,
-          price: "$599.00",          subtitle: "Aqua Collection",          buttons: [
-            {
-              text: "Explore Collection",              href: "#"},
-          ],
-          features: [
-            "Deep Hydration Complex",            "Refreshing Cleanser",            "Nourishing Moisturizer",            "Plumping Serum",            "Suitable for Dry Skin"],
-        },
-        {
-          id: "p-embercell",          badge: "Rejuvenating",          badgeIcon: Leaf,
-          price: "$899.00",          subtitle: "EmberCell Collection",          buttons: [
-            {
-              text: "Explore Collection",              href: "#"},
-          ],
-          features: [
-            "Advanced Anti-Aging Formula",            "Resurfacing Mask",            "Firming Cream",            "Restorative Serum",            "Combats Fine Lines"],
-        },
-        {
-          id: "p-prismastem",          badge: "Brightening",          badgeIcon: Sun,
-          price: "$749.00",          subtitle: "PrismaStem Collection",          buttons: [
-            {
-              text: "Explore Collection",              href: "#"},
-          ],
-          features: [
-            "Radiance-Boosting Complex",            "Brightening Cleanser",            "Tone-Correcting Moisturizer",            "Illuminating Serum",            "Evens Skin Tone"],
-        },
-      ]}
-      title="Curated Skincare Collections"
-      description="Unlock your skin's full potential with our exclusive product bundles, tailored for every need and designed to deliver comprehensive care."
-    />
-  </div>
 
   <div id="faq" data-section="faq">
       <FaqDouble
@@ -249,7 +204,7 @@ export default function LandingPage() {
       description="Have questions, need personalized skincare advice, or want to learn more about our products? Our dedicated team is here to help you achieve radiant, healthy skin."
       buttons={[
         {
-          text: "Contact Us",          href: "#"},
+          text: "Contact Us",          href: "/#contact"},
       ]}
       buttonAnimation="opacity"
     />
@@ -261,23 +216,21 @@ export default function LandingPage() {
         {
           title: "SHOP",          items: [
             {
-              label: "Best Sellers",              href: "#best-sellers"},
+              label: "Best Sellers",              href: "/#best-sellers"},
             {
-              label: "Collections",              href: "#collections"},
+              label: "Aqua Collection",              href: "/collections/p-aqua"},
             {
-              label: "Body Care",              href: "#products"},
+              label: "EmberCell Collection",              href: "/collections/p-embercell"},
             {
-              label: "Serums",              href: "#products"},
-            {
-              label: "Masks",              href: "#products"},
+              label: "PrismaStem Collection",              href: "/collections/p-prismastem"},
           ],
         },
         {
           title: "CUSTOMER SERVICE",          items: [
             {
-              label: "Contact Us",              href: "#contact"},
+              label: "Contact Us",              href: "/#contact"},
             {
-              label: "FAQ",              href: "#faq"},
+              label: "FAQ",              href: "/#faq"},
             {
               label: "Shipping & Returns",              href: "#"},
           ],
@@ -285,9 +238,9 @@ export default function LandingPage() {
         {
           title: "ABOUT US",          items: [
             {
-              label: "Our Story",              href: "#about"},
+              label: "Our Story",              href: "/#about"},
             {
-              label: "Our Philosophy",              href: "#about"},
+              label: "Our Philosophy",              href: "/#about"},
             {
               label: "Careers",              href: "#"},
           ],