From 338216c67bea183d8b0759f86743c2959fd6259b Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Tue, 5 May 2026 22:02:37 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 368 ++++++++++++++++-------------------------------
 1 file changed, 120 insertions(+), 248 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index bdbfa6d..43a480b 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -29,263 +29,135 @@ export default function LandingPage() {
         headingFontWeight="light"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleApple
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "How it Works",
-          id: "how-it-works",
-        },
-        {
-          name: "Skills",
-          id: "skills",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="STEMAZ"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "How it Works", id: "how-it-works" },
+              { name: "Skills", id: "skills" },
+              { name: "Contact", id: "contact" },
+            ]}
+            brandName="STEMAZ"
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardRotatedCarousel
-      background={{
-        variant: "rotated-rays-animated",
-      }}
-      title="Build. Measure. Improve."
-      description="The ultimate platform for applied STEM education, empowering students to solve real-world challenges through a unique 5D skill system."
-      buttons={[
-        {
-          text: "Start a Challenge",
-          href: "#contact",
-        },
-      ]}
-      carouselItems={[
-        {
-          id: "1",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-child-making-diy-project-from-upcycled-materials_23-2149391061.jpg",
-          imageAlt: "student tablet robotics education",
-        },
-        {
-          id: "2",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-analyzing-data-charts-files-computer-plan-financial-project-business-woman-wokring-with-documents-design-marketing-strategy-company-development_482257-33674.jpg",
-          imageAlt: "coding student dashboard",
-        },
-        {
-          id: "3",
-          imageSrc: "http://img.b2bpic.net/free-photo/coworkers-office-with-architecture-plans-computer_329181-12372.jpg",
-          imageAlt: "teamwork engineering project",
-        },
-        {
-          id: "4",
-          imageSrc: "http://img.b2bpic.net/free-photo/trigonometry-algebra-equation-knowledge-learn-concept_53876-123006.jpg",
-          imageAlt: "radar chart skill assessment",
-        },
-        {
-          id: "5",
-          imageSrc: "http://img.b2bpic.net/free-vector/gradient-sliders-collection_23-2150173999.jpg",
-          imageAlt: "student progress bar UI",
-        },
-        {
-          id: "6",
-          imageSrc: "http://img.b2bpic.net/free-photo/international-day-education-futuristic-style_23-2150998697.jpg",
-          imageAlt: "global STEM education community",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardRotatedCarousel
+            background={{ variant: "rotated-rays-animated" }}
+            title="Build. Measure. Improve."
+            description="The ultimate platform for applied STEM education, empowering students to solve real-world challenges through a unique 5D skill system."
+            buttons={[{ text: "Start a Challenge", href: "#contact" }]}
+            carouselItems={[
+              { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/young-child-making-diy-project-from-upcycled-materials_23-2149391061.jpg", imageAlt: "student tablet robotics education" },
+              { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-analyzing-data-charts-files-computer-plan-financial-project-business-woman-wokring-with-documents-design-marketing-strategy-company-development_482257-33674.jpg", imageAlt: "coding student dashboard" },
+              { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/coworkers-office-with-architecture-plans-computer_329181-12372.jpg", imageAlt: "teamwork engineering project" },
+              { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/trigonometry-algebra-equation-knowledge-learn-concept_53876-123006.jpg", imageAlt: "radar chart skill assessment" },
+              { id: "5", imageSrc: "http://img.b2bpic.net/free-vector/gradient-sliders-collection_23-2150173999.jpg", imageAlt: "student progress bar UI" },
+              { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/international-day-education-futuristic-style_23-2150998697.jpg", imageAlt: "global STEM education community" }
+            ]}
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <TestimonialAboutCard
-      useInvertedBackground={true}
-      tag="About STEMAZ"
-      title="Transforming Education Through Challenges"
-      description="STEMAZ bridges the gap between theoretical classroom learning and practical problem-solving. We provide the tools for schools and teachers to inspire the next generation of engineers and innovators."
-      subdescription="Our mission is to help every student track their growth using a data-driven approach to holistic skill development."
-      icon={Sparkles}
-      imageSrc="http://img.b2bpic.net/free-photo/female-scientist-observing-girls-experimenting-with-chemistry_23-2148571320.jpg"
-      mediaAnimation="slide-up"
-      imageAlt="student problem solving"
-    />
-  </div>
+        <div id="about" data-section="about">
+          <TestimonialAboutCard
+            useInvertedBackground={true}
+            tag="About STEMAZ"
+            title="Transforming Education Through Challenges"
+            description="STEMAZ bridges the gap between theoretical classroom learning and practical problem-solving. We provide the tools for schools and teachers to inspire the next generation of engineers and innovators."
+            subdescription="Our mission is to help every student track their growth using a data-driven approach to holistic skill development."
+            icon={Sparkles}
+            imageSrc="http://img.b2bpic.net/free-photo/female-scientist-observing-girls-experimenting-with-chemistry_23-2148571320.jpg"
+            mediaAnimation="slide-up"
+            imageAlt="student problem solving"
+          />
+        </div>
 
-  <div id="how-it-works" data-section="how-it-works">
-      <FeatureCardMedia
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        {
-          id: "f1",
-          title: "Define Challenge",
-          description: "Educators create customized challenges mapped to real-world problems.",
-          tag: "Create",
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-tulips-clipboard-light-table_23-2148100653.jpg",
-          imageAlt: "teamwork lab environment",
-        },
-        {
-          id: "f2",
-          title: "Submit Project",
-          description: "Students build solutions in teams and submit their work for review.",
-          tag: "Build",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-digital-tablet-meeting_1098-487.jpg",
-          imageAlt: "data metrics tracking icon",
-        },
-        {
-          id: "f3",
-          title: "5D Evaluation",
-          description: "Assess skills across Engineering, Creativity, Management, Enterprise, and Communication.",
-          tag: "Evaluate",
-          imageSrc: "http://img.b2bpic.net/free-photo/innovation-development-rocket-graphic-concept_53876-120019.jpg",
-          imageAlt: "skills assessment 5D chart",
-        },
-      ]}
-      title="The STEMAZ Workflow"
-      description="A seamless pipeline designed for efficiency and engagement."
-    />
-  </div>
+        <div id="how-it-works" data-section="how-it-works">
+          <FeatureCardMedia
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            features={[
+              { id: "f1", title: "Define Challenge", description: "Educators create customized challenges mapped to real-world problems.", tag: "Create", imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-tulips-clipboard-light-table_23-2148100653.jpg", imageAlt: "teamwork lab environment" },
+              { id: "f2", title: "Submit Project", description: "Students build solutions in teams and submit their work for review.", tag: "Build", imageSrc: "http://img.b2bpic.net/free-photo/close-up-digital-tablet-meeting_1098-487.jpg", imageAlt: "data metrics tracking icon" },
+              { id: "f3", title: "5D Evaluation", description: "Assess skills across Engineering, Creativity, Management, Enterprise, and Communication.", tag: "Evaluate", imageSrc: "http://img.b2bpic.net/free-photo/innovation-development-rocket-graphic-concept_53876-120019.jpg", imageAlt: "skills assessment 5D chart" }
+            ]}
+            title="The STEMAZ Workflow"
+            description="A seamless pipeline designed for efficiency and engagement."
+          />
+        </div>
 
-  <div id="skills" data-section="skills">
-      <MetricCardSeven
-      animationType="depth-3d"
-      textboxLayout="split"
-      useInvertedBackground={true}
-      metrics={[
-        {
-          id: "m1",
-          value: "5",
-          title: "Core Dimensions",
-          items: [
-            "Engineering",
-            "Creativity",
-            "Management",
-            "Enterprise",
-            "Communication",
-          ],
-        },
-      ]}
-      title="The 5D Skill Model"
-      description="Move beyond traditional grading with our comprehensive radar-chart approach to measuring success."
-    />
-  </div>
+        <div id="skills" data-section="skills">
+          <MetricCardSeven
+            animationType="depth-3d"
+            textboxLayout="split"
+            useInvertedBackground={true}
+            metrics={[
+              { id: "m1", value: "5", title: "Core Dimensions", items: ["Engineering", "Creativity", "Management", "Enterprise", "Communication"] }
+            ]}
+            title="The 5D Skill Model"
+            description="Move beyond traditional grading with our comprehensive radar-chart approach to measuring success."
+          />
+        </div>
 
-  <div id="audience" data-section="audience">
-      <ProductCardFour
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "p1",
-          name: "For Schools",
-          price: "Management",
-          variant: "Institution-wide",
-          imageSrc: "http://img.b2bpic.net/free-photo/girl-looking-through-microscope-teacher-standing-nearby_259150-60326.jpg",
-          imageAlt: "student tablet robotics education",
-        },
-        {
-          id: "p2",
-          name: "For Teachers",
-          price: "Operations",
-          variant: "Classroom control",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-boy-holding-laptop-while-wearing-virtual-reality-headset_23-2148556177.jpg",
-          imageAlt: "coding student dashboard",
-        },
-        {
-          id: "p3",
-          name: "For Students",
-          price: "Growth",
-          variant: "Personal profile",
-          imageSrc: "http://img.b2bpic.net/free-photo/tech-people-trying-achieve-ambitious-sustainability-goals_23-2150950196.jpg",
-          imageAlt: "teamwork engineering project",
-        },
-      ]}
-      title="Who STEMAZ Serves"
-      description="Tailored solutions for every member of the education ecosystem."
-    />
-  </div>
+        <div id="audience" data-section="audience">
+          <ProductCardFour
+            textboxLayout="default"
+            gridVariant="three-columns-all-equal-width"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            products={[
+              { id: "p1", name: "For Schools", price: "Management", variant: "Institution-wide", imageSrc: "http://img.b2bpic.net/free-photo/girl-looking-through-microscope-teacher-standing-nearby_259150-60326.jpg", imageAlt: "student tablet robotics education" },
+              { id: "p2", name: "For Teachers", price: "Operations", variant: "Classroom control", imageSrc: "http://img.b2bpic.net/free-photo/front-view-boy-holding-laptop-while-wearing-virtual-reality-headset_23-2148556177.jpg", imageAlt: "coding student dashboard" },
+              { id: "p3", name: "For Students", price: "Growth", variant: "Personal profile", imageSrc: "http://img.b2bpic.net/free-photo/tech-people-trying-achieve-ambitious-sustainability-goals_23-2150950196.jpg", imageAlt: "teamwork engineering project" }
+            ]}
+            title="Who STEMAZ Serves"
+            description="Tailored solutions for every member of the education ecosystem."
+          />
+        </div>
 
-  <div id="social-proof" data-section="social-proof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={true}
-      names={[
-        "TechAcademy",
-        "InnovateLab",
-        "STEMForce",
-        "EduBuilder",
-        "FutureSchool",
-        "GlobalSTEM",
-        "NextGenInnovations",
-      ]}
-      title="Trusted by Forward-Thinking Institutions"
-      description="Joining a global community of educators shaping the next generation."
-    />
-  </div>
+        <div id="social-proof" data-section="social-proof">
+          <SocialProofOne
+            textboxLayout="default"
+            useInvertedBackground={true}
+            names={["TechAcademy", "InnovateLab", "STEMForce", "EduBuilder", "FutureSchool", "GlobalSTEM", "NextGenInnovations"]}
+            title="Trusted by Forward-Thinking Institutions"
+            description="Joining a global community of educators shaping the next generation."
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",
-          title: "How does the evaluation work?",
-          content: "Teachers use our 5-dimensional slider interface to evaluate student performance, instantly generating a radar chart.",
-        },
-        {
-          id: "q2",
-          title: "Can I integrate with my LMS?",
-          content: "We support standard CSV exports and are actively building API integrations for popular LMS platforms.",
-        },
-        {
-          id: "q3",
-          title: "Is the platform mobile responsive?",
-          content: "Absolutely, the platform is designed to be fully responsive for students to work on tablets and laptops.",
-        },
-      ]}
-      sideTitle="Questions? We have answers."
-      faqsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqSplitText
+            useInvertedBackground={false}
+            faqs={[
+              { id: "q1", title: "How does the evaluation work?", content: "Teachers use our 5-dimensional slider interface to evaluate student performance, instantly generating a radar chart." },
+              { id: "q2", title: "Can I integrate with my LMS?", content: "We support standard CSV exports and are actively building API integrations for popular LMS platforms." },
+              { id: "q3", title: "Is the platform mobile responsive?", content: "Absolutely, the platform is designed to be fully responsive for students to work on tablets and laptops." }
+            ]}
+            sideTitle="Questions? We have answers."
+            faqsAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCTA
-      useInvertedBackground={true}
-      background={{
-        variant: "sparkles-gradient",
-      }}
-      tag="Get Started"
-      title="Start your STEM journey today"
-      description="Join the waitlist or schedule a demo to see how STEMAZ can revolutionize your STEM curriculum."
-      buttons={[
-        {
-          text: "Request a Demo",
-          href: "#",
-        },
-      ]}
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactCTA
+            useInvertedBackground={true}
+            background={{ variant: "sparkles-gradient" }}
+            tag="Get Started"
+            title="Start your STEM journey today"
+            description="Join the waitlist or schedule a demo to see how STEMAZ can revolutionize your STEM curriculum."
+            buttons={[{ text: "Request a Demo", href: "#" }]}
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="STEMAZ"
-      leftLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
-      rightLink={{
-        text: "Contact Support",
-        href: "#contact",
-      }}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoText="STEMAZ"
+            leftLink={{ text: "Privacy Policy", href: "#" }}
+            rightLink={{ text: "Contact Support", href: "#contact" }}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file