From e479984bef7f24732cda303a15bc09eda09436c5 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Fri, 20 Mar 2026 14:31:48 +0000
Subject: [PATCH] Add src/app/product/page.tsx

---
 src/app/product/page.tsx | 179 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 179 insertions(+)
 create mode 100644 src/app/product/page.tsx

diff --git a/src/app/product/page.tsx b/src/app/product/page.tsx
new file mode 100644
index 0000000..0cfc408
--- /dev/null
+++ b/src/app/product/page.tsx
@@ -0,0 +1,179 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
+import TextAbout from '@/components/sections/about/TextAbout';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
+import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import { BookOpen, Brain, CheckCircle, Zap } from 'lucide-react';
+
+export default function ProductPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-bubble"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="rounded"
+      contentWidth="mediumLarge"
+      sizing="mediumLargeSizeMediumTitles"
+      background="fluid"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="Cybrain QS"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "How It Works", id: "features" },
+            { name: "Use Cases", id: "use-cases" },
+            { name: "Testimonials", id: "testimonials" },
+            { name: "FAQ", id: "faq" }
+          ]}
+          button={{ text: "Request Demo", href: "#contact" }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroBillboardTestimonial
+          title="Cybrain QS: Your Quality Knowledge System"
+          description="Transform fragmented quality documentation into intelligent, searchable knowledge. Cybrain QS links SOPs, deviations, CAPAs, and audit findings into a unified memory system that powers faster, evidence-based decisions in regulated environments."
+          tag="Product Overview"
+          tagIcon={Brain}
+          tagAnimation="slide-up"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/a-modern-quality-management-system-dashb-1773318833408-817f7c8a.png?_wi=1"
+          imageAlt="Cybrain QS Product Interface"
+          mediaAnimation="slide-up"
+          testimonials={[
+            {
+              name: "Sarah Mitchell",              handle: "QA Manager, Pharma Corp",              testimonial: "From hours of searching to minutes of insight. Cybrain QS shows us exactly what our decisions are based on.",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-woman-in-her--1773318833704-554e6935.png?_wi=1",              imageAlt: "Sarah Mitchell"
+            },
+            {
+              name: "James Rodriguez",              handle: "Quality Director, MedDevice Inc",              testimonial: "Regulatory audits used to be stressful. Now we have complete traceability showing the logic behind every decision.",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-man-in-his-50-1773318832638-1cee9840.png?_wi=1",              imageAlt: "James Rodriguez"
+            },
+            {
+              name: "Emily Chen",              handle: "Compliance Officer, BioTech Solutions",              testimonial: "Our quality memory no longer depends on who's in the room. Every decision is preserved and accessible.",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-woman-in-her--1773318832826-f81a0121.png?_wi=1",              imageAlt: "Emily Chen"
+            }
+          ]}
+          testimonialRotationInterval={5000}
+          buttons={[
+            { text: "Explore Knowledge Levels", href: "#knowledge-levels" },
+            { text: "Request live demo", href: "#contact" }
+          ]}
+          buttonAnimation="slide-up"
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="about" data-section="about">
+        <TextAbout
+          tag="What is Cybrain QS?"
+          title="Cybrain QS is the first Quality Knowledge System purpose-built for regulated industries. It doesn't replace your QMS—it enhances it by transforming SOPs, deviations, CAPAs, and audit findings into searchable, context-aware institutional memory. QA teams get instant access to relevant precedents, guidance, and evidence without manual searching through fragmented systems."
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Learn how it works", href: "#knowledge-levels" }
+          ]}
+        />
+      </div>
+
+      <div id="knowledge-levels" data-section="knowledge-levels">
+        <FeatureCardThree
+          title="Four Levels of Knowledge"
+          description="Cybrain QS organizes quality information into four interconnected knowledge levels, each building on the previous one to create institutional memory."
+          tag="Knowledge Architecture"
+          animationType="slide-up"
+          gridVariant="four-items-2x2-equal-grid"
+          features={[
+            {
+              id: "01",              title: "SOP Knowledge",              description: "The foundation of your quality system. Structured procedures, work instructions, and operational guidelines that define how things should be done. Searchable and version-controlled.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/a-close-up-interface-showing-a-context-a-1773318833229-99935359.png?_wi=1",              imageAlt: "SOP Knowledge Layer"
+            },
+            {
+              id: "02",              title: "Experiential Knowledge",              description: "Real-world deviations and how they were resolved. Every deviation becomes a learning point, capturing what actually happened versus what was planned, including root causes and corrective actions.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/an-integration-diagram-showing-cybrain-q-1773318833295-fa298989.png?_wi=1",              imageAlt: "Experiential Knowledge Layer"
+            },
+            {
+              id: "03",              title: "Audit Knowledge",              description: "Regulatory findings, corrective and preventive actions (CAPAs), and audit outcomes. Links regulatory expectations to how your organization addressed them, creating traceability that auditors need.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/a-pharmaceutical-manufacturing-facility--1773318833529-dc871bb3.png?_wi=1",              imageAlt: "Audit Knowledge Layer"
+            },
+            {
+              id: "04",              title: "Decision-Making Knowledge",              description: "The highest level. Shows what decisions were based on. When a QA professional evaluates a new deviation, they see similar past cases, relevant SOPs, audit history, and CAPA outcomes—everything needed to make an evidence-based decision.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/a-modern-quality-management-system-dashb-1773318833408-817f7c8a.png?_wi=2",              imageAlt: "Decision-Making Knowledge Layer"
+            }
+          ]}
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="decision-quote" data-section="decision-quote">
+        <TextAbout
+          tag="Core Value Proposition"
+          title="Cybrain QS shows you what your decisions are based on. Every evaluation links to SOPs, past precedents, audit outcomes, and regulatory context. No more searching. No more guessing. Just evidence-based quality decisions."
+          useInvertedBackground={false}
+          buttons={[
+            { text: "See it in action", href: "#testimonials" },
+            { text: "Request demo", href: "#contact" }
+          ]}
+        />
+      </div>
+
+      <div id="testimonials" data-section="testimonials">
+        <TestimonialCardSixteen
+          title="QA Leaders Trust Cybrain QS"
+          description="Quality managers and compliance officers across regulated industries rely on Cybrain QS to make faster, more confident decisions backed by complete evidence."
+          tag="Customer Stories"
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          testimonials={[
+            {
+              id: "1",              name: "Sarah Mitchell",              role: "QA Manager",              company: "Pharma Corp",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-woman-in-her--1773318833704-554e6935.png?_wi=2",              imageAlt: "Sarah Mitchell, QA Manager at Pharma Corp"
+            },
+            {
+              id: "2",              name: "James Rodriguez",              role: "Quality Director",              company: "MedDevice Inc",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-man-in-his-50-1773318832638-1cee9840.png?_wi=2",              imageAlt: "James Rodriguez, Quality Director at MedDevice Inc"
+            },
+            {
+              id: "3",              name: "Emily Chen",              role: "Compliance Officer",              company: "BioTech Solutions",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-woman-in-her--1773318832826-f81a0121.png?_wi=2",              imageAlt: "Emily Chen, Compliance Officer at BioTech Solutions"
+            },
+            {
+              id: "4",              name: "Michael Torres",              role: "Quality Systems Manager",              company: "RegulatedCo",              rating: 5,
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqSlSSbph46zzjSFyehxPHYM4t/professional-portrait-of-a-man-in-his-40-1773318832846-8d2f1a00.png",              imageAlt: "Michael Torres, Quality Systems Manager at RegulatedCo"
+            }
+          ]}
+          kpiItems={[
+            { value: "80%", label: "Faster decision time" },
+            { value: "100%", label: "Decision traceability" },
+            { value: "50%", label: "Knowledge retention" }
+          ]}
+        />
+      </div>
+
+      <div id="cta" data-section="cta">
+        <TextAbout
+          title="Ready to see how Cybrain QS transforms your quality decisions?"
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Request live demo", href: "#contact" },
+            { text: "Learn more", href: "https://example.com" }
+          ]}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoReveal
+          logoText="Cybrain QS"
+          leftLink={{ text: "Privacy Policy", href: "#" }}
+          rightLink={{ text: "Terms of Service", href: "#" }}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file