Merge version_3 into main

Merge version_3 into main

src/app/page.tsx

@@ -2,208 +2,100 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
-import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
+import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
-import { Zap } from "lucide-react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import { Eye, ShieldCheck, Zap } from "lucide-react";
 
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="hover-bubble"
-        defaultTextAnimation="background-highlight"
-        borderRadius="pill"
-        contentWidth="mediumLarge"
-        sizing="largeSizeMediumTitles"
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="soft"
+        contentWidth="medium"
+        sizing="medium"
         background="none"
-        cardStyle="subtle-shadow"
-        primaryButtonStyle="primary-glow"
+        cardStyle="outline"
+        primaryButtonStyle="flat"
         secondaryButtonStyle="solid"
-        headingFontWeight="light"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleApple
-      navItems={[
-        {
-          name: "Technology",          id: "#technology"},
-        {
-          name: "Research",          id: "#research"},
-        {
-          name: "Contact",          id: "#contact"},
-      ]}
-      brandName="BIOMETRIC"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+            <NavbarStyleFullscreen
+              navItems={[
+                { name: "Technology", id: "#technology" },
+                { name: "Research", id: "#research" },
+                { name: "Contact", id: "#contact" },
+              ]}
+              brandName="BIOMETRIC"
+              button={{ text: "Explore", href: "#" }}
+            />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardGallery
-      background={{
-        variant: "plain"}}
-      title="Revolutionizing Fashion with AI"
-      description="Experience the future of retail with our biometric smart platform, designed for ultimate personalization and fit."
-      buttons={[
-        {
-          text: "Get Started",          href: "#contact"},
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/tall-leggy-young-beautiful-elegant-model-woman-formal-wear-posed-stairs_627829-6900.jpg",          imageAlt: "Fashion Model"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/professional-photo-cute-young-brunette-woman-nice-red-summer-boho-dress-posing-studio-red-background-sitting-chair-fashion-spring-summer-photo_639032-873.jpg",          imageAlt: "Fashion Model"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female-wearing-formal-suit_23-2148880273.jpg",          imageAlt: "Fashion Model"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/young-man-portrait_23-2148830353.jpg",          imageAlt: "Fashion Model"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/flirty-young-caucasian-woman-looking-camera-making-kiss-gesture-isolated-blue-background_141793-134691.jpg",          imageAlt: "Fashion Model"},
-      ]}
-      mediaAnimation="opacity"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardTestimonial
+            title="Biometric-based Smart Online Store"
+            description="An editorial exploration into the future of retail, where biometric identity meets high-end digital precision."
+            background={{ variant: "plain" }}
+            testimonials={[]}
+            className="py-32 border-b-[0.5px] border-black"
+          />
+        </div>
 
-  <div id="technology" data-section="technology">
-      <TestimonialAboutCard
-      useInvertedBackground={false}
-      tag="Technology"
-      title="Virtual Try-On"
-      description="Using advanced VITON technology, our 2D/3D fitting room provides a realistic representation of how clothes will look on you, ensuring perfect confidence before purchase."
-      subdescription="State-of-the-art AI-driven fashion simulation."
-      icon={Zap}
-      imageSrc="http://img.b2bpic.net/free-photo/parts-plastic-doll_53876-15041.jpg"
-      mediaAnimation="slide-up"
-    />
-  </div>
+        <div id="technology" data-section="technology">
+          <FeatureCardTwentyFive
+            title="Technological Foundation"
+            description="Next-generation fashion integration tools."
+            textboxLayout="split"
+            useInvertedBackground={false}
+            animationType="blur-reveal"
+            features={[
+              { title: "Virtual Try-On", description: "Neural-mapped garment simulation.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/tall-leggy-young-beautiful-elegant-model-woman-formal-wear-posed-stairs_627829-6900.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/young-man-portrait_23-2148830353.jpg" }] },
+              { title: "Biometric Preservation", description: "Secure identity protection architecture.", icon: ShieldCheck, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female-wearing-formal-suit_23-2148880273.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/professional-photo-cute-young-brunette-woman-nice-red-summer-boho-dress-posing-studio-red-background-sitting-chair-fashion-spring-summer-photo_639032-873.jpg" }] },
+              { title: "AI Sizing", description: "Precision-engineered fit algorithms.", icon: Eye, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/flirty-young-caucasian-woman-looking-camera-making-kiss-gesture-isolated-blue-background_141793-134691.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/serious-young-redhead-curly-lady-standing-cafe-near-latrine_171337-17062.jpg" }] }
+            ]}
+            className="py-20 border-b-[0.5px] border-black"
+          />
+        </div>
 
-  <div id="research" data-section="research">
-      <FeatureCardSixteen
-      textboxLayout="default"
-      useInvertedBackground={true}
-      animationType="slide-up"
-      negativeCard={{
-        items: [
-          "Manual sizing issues",          "High return rates",          "Generic fit profiles",          "Inaccurate inventory",          "Slow purchasing flow"],
-      }}
-      positiveCard={{
-        items: [
-          "Identity-preserving biometrics",          "AI-based S/M/L/XL sizing",          "Predictive weight/height matching",          "Real-time fit visualization",          "Reduced carbon footprint"],
-      }}
-      title="Biometric Precision"
-      description="Sophisticated AI systems ensure a seamless, identity-preserving shopping experience."
-    />
-  </div>
+        <div id="research" data-section="research">
+           <MetricCardSeven
+            title="Research Insights"
+            description="Defining market readiness and software architecture for 2026."
+            animationType="blur-reveal"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            metrics={[
+                { id: "m1", value: "95%", title: "User Readiness", items: ["High adoption in Mongolian retail", "Biometric security prioritization", "Seamless digital integration"] }
+            ]}
+            className="py-20 border-b-[0.5px] border-black"
+           />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardSeven
-      animationType="slide-up"
-      textboxLayout="split-description"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "1",          value: "95%",          title: "User Acceptance",          items: [
-            "Mongolian consumer survey results",            "High satisfaction rates"],
-        },
-        {
-          id: "2",          value: "4.8/5",          title: "Accuracy Rating",          items: [
-            "Biometric fitting precision",            "Validated by fashion experts"],
-        },
-        {
-          id: "3",          value: "24/7",          title: "Availability",          items: [
-            "Secure online storefront access",            "Global server uptime"],
-        },
-      ]}
-      title="Proven Adoption"
-      description="Our technology is already setting new standards for the future of digital retail."
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactCTA
+            tag="Future Retail"
+            title="Etugen University 2026"
+            description="Join the movement defining modern digital fashion."
+            buttons={[{ text: "Get In Touch", href: "#" }]}
+            background={{ variant: "plain" }}
+            useInvertedBackground={false}
+            className="py-20 border-b-[0.5px] border-black"
+          />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFifteen
-      useInvertedBackground={true}
-      testimonial="This biometric shopping system has completely transformed how I choose my wardrobe. The sizing accuracy is unlike anything I've seen."
-      rating={5}
-      author="Bat-Erdene G., Fashion Enthusiast"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/young-beautiful-brunette-woman-posing-standing-white-wall_176420-16847.jpg",          alt: "User"},
-        {
-          src: "http://img.b2bpic.net/free-photo/handsome-businessman-wearing-fashion-eyeglasses-stylish-suit-sitting-sofa-modern-studio_496169-1399.jpg",          alt: "User"},
-        {
-          src: "http://img.b2bpic.net/free-photo/black-woman-s-portrait-dramma-look_633478-1621.jpg",          alt: "User"},
-        {
-          src: "http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg",          alt: "User"},
-        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-portrait-teenager-woman_23-2149453434.jpg",          alt: "User"},
-      ]}
-      ratingAnimation="slide-up"
-      avatarsAnimation="slide-up"
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",          title: "How is my biometric data protected?",          content: "We utilize identity-preserving algorithms that encrypt and anonymize all biometric data points."},
-        {
-          id: "q2",          title: "Can I return items if the fit is wrong?",          content: "Yes, although our AI-size guide significantly reduces this need by ensuring a precise match."},
-        {
-          id: "q3",          title: "Is this platform available in all countries?",          content: "Currently optimized for the Mongolian market, with global expansion plans underway."},
-        {
-          id: "q4",          title: "Do I need special hardware?",          content: "No, our software runs directly in any modern web browser using your device's existing camera."},
-        {
-          id: "q5",          title: "How do I start a scan?",          content: "Simply navigate to the fitting dashboard and follow the on-screen audio-visual prompts."},
-      ]}
-      sideTitle="Questions?"
-      faqsAnimation="blur-reveal"
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={true}
-      background={{
-        variant: "plain"}}
-      text="Join the revolution of digital retail. Contact us to learn more about implementing our system."
-      buttons={[
-        {
-          text: "Contact Us",          href: "mailto:hello@biometricstore.com"},
-      ]}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterMedia
-      imageSrc="http://img.b2bpic.net/free-photo/serious-young-redhead-curly-lady-standing-cafe-near-latrine_171337-17062.jpg"
-      logoText="BIOMETRIC"
-      columns={[
-        {
-          title: "Explore",          items: [
-            {
-              label: "Technology",              href: "#technology"},
-            {
-              label: "Research",              href: "#research"},
-          ],
-        },
-        {
-          title: "Support",          items: [
-            {
-              label: "Contact",              href: "#contact"},
-            {
-              label: "Privacy",              href: "#"},
-          ],
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterCard
+            logoText="BIOMETRIC"
+            copyrightText="© 2026 Etugen University. All Rights Reserved."
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -17,7 +17,7 @@
   --primary-cta-text: #ffffff;
   --secondary-cta: #ffffff;
   --secondary-cta-text: #000000;
-  --accent: #000000;
+  --accent: #e2e2e2;
   --background-accent: #f5f5f5;
 
   /* text sizing - set by ThemeProvider */