Update src/app/page.tsx

Merge version_27 into main

src/app/contact/page.tsx

@@ -2,9 +2,10 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { ExternalLink } from "lucide-react";
 
 export default function ContactPage() {
   return (
@@ -21,36 +22,56 @@ export default function ContactPage() {
         headingFontWeight="light"
     >
       <ReactLenis root>
-        <NavbarStyleApple
-            navItems={[
-                { name: "Home", id: "/" },
-                { name: "Products", id: "/products" },
-                { name: "FAQ", id: "/faq" },
-                { name: "Contact", id: "/contact" }
-            ]}
-            brandName="Peptify"
-        />
-        <div className="pt-32 pb-20">
-          <ContactCTA 
-            tag="Get in Touch"
-            title="Contact Our Team"
-            description="Reach out for wholesale inquiries, custom orders, or any questions regarding our high-purity research peptides. You can reach us at pepscience22@gmail.com or follow us on Instagram @peptify."
-            buttons={[
-              { text: "Email Us", href: "mailto:pepscience22@gmail.com" },
-              { text: "Instagram", href: "https://instagram.com/peptify" }
-            ]}
-            background={{ variant: "plain" }}
-            useInvertedBackground={false}
-          />
+        <div id="nav" data-section="nav">
+            <NavbarStyleApple
+                navItems={[
+                    { name: "Home", id: "/" },
+                    { name: "Products", id: "/products" },
+                    { name: "FAQ", id: "/faq" },
+                    { name: "Contact", id: "/contact" },
+                ]}
+                brandName="Peptify"
+            />
+        </div>
+
+        <div id="contact" data-section="contact">
+            <ContactSplitForm
+                title="Contact Our Team"
+                description="Reach out for inquiries, research support, or partnership opportunities. We aim to respond within 24-48 hours."
+                inputs={[
+                    { name: "name", type: "text", placeholder: "Full Name", required: true },
+                    { name: "email", type: "email", placeholder: "Email Address", required: true },
+                    { name: "subject", type: "text", placeholder: "Subject" }
+                ]}
+                textarea={{ name: "message", placeholder: "How can we help you?", required: true, rows: 5 }}
+                useInvertedBackground={false}
+                mediaPosition="right"
+                imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/a-futuristic-scientific-laboratory-setti-1775505033478-f138a781.png?_wi=1"
+            />
+            
+            <div className="flex justify-center items-center gap-4 py-8">
+                <p className="text-lg font-medium">Connect with us on Instagram: <span className="text-primary">@peptifydr</span></p>
+                <a 
+                    href="https://instagram.com/peptifydr" 
+                    target="_blank" 
+                    rel="noopener noreferrer" 
+                    className="flex items-center gap-2 px-6 py-2 bg-primary text-white rounded-full hover:opacity-90 transition-opacity"
+                >
+                    Follow Us <ExternalLink size={16} />
+                </a>
+            </div>
+        </div>
+
+        <div id="footer" data-section="footer">
+            <FooterSimple
+                columns={[
+                    { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
+                    { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
+                ]}
+                bottomLeftText="© 2024 Peptify. For Research Use Only."
+                bottomRightText="All rights reserved."
+            />
         </div>
-        <FooterSimple
-            columns={[
-                { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
-                { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
-            ]}
-            bottomLeftText="© 2024 Peptify. For Research Use Only."
-            bottomRightText="All rights reserved."
-        />
       </ReactLenis>
     </ThemeProvider>
   );

src/app/klow/page.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function KlowPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Products", id: "/products" },
+            { name: "FAQ", id: "/faq" },
+            { name: "Contact", id: "/contact" },
+            { name: "Klow", id: "/klow" },
+            { name: "Mots-c", id: "/mots-c" },
+            { name: "NAD+", id: "/nad-plus" },
+          ]}
+          brandName="Peptify"
+        />
+        <div className="container mx-auto py-24">
+          <h1 className="text-4xl font-bold mb-6">Klow</h1>
+          <div className="prose max-w-none">
+            <p>Details about Klow, its effects on the human body, key benefits, and research-grade usage guidelines.</p>
+          </div>
+        </div>
+        <FooterSimple
+          columns={[
+            { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
+            { title: "Compounds", items: [{ label: "Klow", href: "/klow" }, { label: "Mots-c", href: "/mots-c" }, { label: "NAD+", href: "/nad-plus" }] },
+            { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
+          ]}
+          bottomLeftText="© 2025 Peptify"
+          bottomRightText="All rights reserved"
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/mots-c/page.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function MotsCPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Products", id: "/products" },
+            { name: "FAQ", id: "/faq" },
+            { name: "Contact", id: "/contact" },
+            { name: "Klow", id: "/klow" },
+            { name: "Mots-c", id: "/mots-c" },
+            { name: "NAD+", id: "/nad-plus" },
+          ]}
+          brandName="Peptify"
+        />
+        <div className="container mx-auto py-24">
+          <h1 className="text-4xl font-bold mb-6">Mots-c</h1>
+          <div className="prose max-w-none">
+            <p>Details about Mots-c, its effects on the human body, key benefits, and research-grade usage guidelines.</p>
+          </div>
+        </div>
+        <FooterSimple
+          columns={[
+            { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
+            { title: "Compounds", items: [{ label: "Klow", href: "/klow" }, { label: "Mots-c", href: "/mots-c" }, { label: "NAD+", href: "/nad-plus" }] },
+            { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
+          ]}
+          bottomLeftText="© 2025 Peptify"
+          bottomRightText="All rights reserved"
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/nad-plus/page.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function NadPlusPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Products", id: "/products" },
+            { name: "FAQ", id: "/faq" },
+            { name: "Contact", id: "/contact" },
+            { name: "Klow", id: "/klow" },
+            { name: "Mots-c", id: "/mots-c" },
+            { name: "NAD+", id: "/nad-plus" },
+          ]}
+          brandName="Peptify"
+        />
+        <div className="container mx-auto py-24">
+          <h1 className="text-4xl font-bold mb-6">NAD+</h1>
+          <div className="prose max-w-none">
+            <p>Details about NAD+, its effects on the human body, key benefits, and research-grade usage guidelines.</p>
+          </div>
+        </div>
+        <FooterSimple
+          columns={[
+            { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
+            { title: "Compounds", items: [{ label: "Klow", href: "/klow" }, { label: "Mots-c", href: "/mots-c" }, { label: "NAD+", href: "/nad-plus" }] },
+            { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
+          ]}
+          bottomLeftText="© 2025 Peptify"
+          bottomRightText="All rights reserved"
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -32,6 +32,9 @@ export default function LandingPage() {
         { name: "Products", id: "/products" },
         { name: "FAQ", id: "/faq" },
         { name: "Contact", id: "/contact" },
+        { name: "Klow", id: "/klow" },
+        { name: "Mots-c", id: "/mots-c" },
+        { name: "NAD+", id: "/nad-plus" },
       ]}
       brandName="Peptify"
     />
@@ -62,9 +65,9 @@ export default function LandingPage() {
       useInvertedBackground={false}
       buttons={[{ text: "Contact for Pricing", href: "/contact" }]}
       products={[
-        { id: "1", name: "Tirzepatide", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-tirzepatide-in-a-sterile-1775505032194-38e18dca.png?_wi=1", imageAlt: "Tirzepatide Vial", variant: "10mg" },
-        { id: "2", name: "Retatrutide", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-retatrutide-in-a-sterile-1775505032674-eda4960c.png?_wi=1", imageAlt: "Retatrutide Vial", variant: "10mg" },
-        { id: "3", name: "BPC + TB 10MG", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-bpc-tb-in-a-sterile-envi-1775505031642-de9329a9.png?_wi=1", imageAlt: "BPC+TB Vial", variant: "10mg" },
+        { id: "1", name: "Tirzepatide", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-tirzepatide-in-a-sterile-1775505032194-38e18dca.png?_wi=1", imageAlt: "Tirzepatide Vial", variant: "10mg", onProductClick: () => window.location.href = "/products/tirzepatide" },
+        { id: "2", name: "Retatrutide", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-retatrutide-in-a-sterile-1775505032674-eda4960c.png?_wi=1", imageAlt: "Retatrutide Vial", variant: "10mg", onProductClick: () => window.location.href = "/products/retatrutide" },
+        { id: "3", name: "BPC + TB 10MG", price: "Contact for pricing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BzpXIQ8WhJ8WvoMuxtEmg0ewMo/medical-vial-of-bpc-tb-in-a-sterile-envi-1775505031642-de9329a9.png?_wi=1", imageAlt: "BPC+TB Vial", variant: "10mg", onProductClick: () => window.location.href = "/products/bpc-tb" },
       ]}
       title="Premium Research Compounds"
       description="Pharmaceutical grade compounds in high-potency concentrations."
@@ -114,6 +117,7 @@ export default function LandingPage() {
       <FooterSimple
       columns={[
         { title: "Company", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/products" }, { label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
+        { title: "Compounds", items: [{ label: "Klow", href: "/klow" }, { label: "Mots-c", href: "/mots-c" }, { label: "NAD+", href: "/nad-plus" }] },
         { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Disclaimer", href: "/disclaimer" }, { label: "Terms", href: "/terms" }] },
       ]}
       bottomLeftText="© 2024 Peptify. For Research Use Only."
@@ -123,4 +127,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/products/bpc-tb/page.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function BpcTbPage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple navItems={[{name: 'Home', id: '/'}, {name: 'Products', id: '/products'}]} brandName="Peptify" />
+        </div>
+        <main className="container mx-auto px-6 py-24">
+          <h1 className="text-4xl font-bold mb-6">BPC + TB 10MG</h1>
+          <p className="text-lg mb-8">Synergistic blend for advanced study.</p>
+          <h2 className="text-2xl font-semibold mb-4">Usage Highlights</h2>
+          <ul className="list-disc pl-6 mb-8">
+            <li>Synergistic peptide action</li>
+            <li>Sterile-tested components</li>
+            <li>Batch-certified</li>
+          </ul>
+        </main>
+        <FooterSimple columns={[]} bottomLeftText="© 2024 Peptify." bottomRightText="For Research Use Only." />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/products/retatrutide/page.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function RetatrutidePage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple navItems={[{name: 'Home', id: '/'}, {name: 'Products', id: '/products'}]} brandName="Peptify" />
+        </div>
+        <main className="container mx-auto px-6 py-24">
+          <h1 className="text-4xl font-bold mb-6">Retatrutide</h1>
+          <p className="text-lg mb-8">Advanced agonist compound for research applications.</p>
+          <h2 className="text-2xl font-semibold mb-4">Key Results</h2>
+          <ul className="list-disc pl-6 mb-8">
+            <li>Stabilized molecular structure</li>
+            <li>Consistent batch performance</li>
+            <li>Pharmaceutical grade precision</li>
+          </ul>
+        </main>
+        <FooterSimple columns={[]} bottomLeftText="© 2024 Peptify." bottomRightText="For Research Use Only." />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/products/tirzepatide/page.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function TirzepatidePage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple navItems={[{name: 'Home', id: '/'}, {name: 'Products', id: '/products'}]} brandName="Peptify" />
+        </div>
+        <main className="container mx-auto px-6 py-24">
+          <h1 className="text-4xl font-bold mb-6">Tirzepatide</h1>
+          <p className="text-lg mb-8">High-purity Tirzepatide for metabolic and physiological research.</p>
+          <h2 className="text-2xl font-semibold mb-4">Benefits</h2>
+          <ul className="list-disc pl-6 mb-8">
+            <li>Supports metabolic pathways</li>
+            <li>High potency formulation</li>
+            <li>HPLC verified purity</li>
+          </ul>
+          <h2 className="text-2xl font-semibold mb-4">Recommended Uses</h2>
+          <p className="mb-8">For exclusive use in controlled laboratory research environments.</p>
+        </main>
+        <FooterSimple columns={[]} bottomLeftText="© 2024 Peptify." bottomRightText="For Research Use Only." />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}