Merge version_2 into main

Merge version_2 into main

src/app/page.tsx

@@ -2,6 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import { useEffect, useState } from "react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
 import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
@@ -15,6 +16,18 @@ import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCar
 import { Film, Instagram, Palette, Shield, Twitter, Zap } from "lucide-react";
 
 export default function LandingPage() {
+  const [isChaseActive, setIsChaseActive] = useState(false);
+
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key.toLowerCase() === 'p') {
+        setIsChaseActive(prev => !prev);
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  }, []);
+
   return (
     <ThemeProvider
         defaultButtonVariant="hover-magnetic"
@@ -29,25 +42,23 @@ export default function LandingPage() {
         headingFontWeight="light"
     >
       <ReactLenis root>
+      {isChaseActive && (
+        <div className="fixed inset-0 z-[9999] pointer-events-none overflow-hidden">
+          <div className="absolute inset-0 bg-red-500/20 animate-pulse" />
+          <div className="absolute top-1/2 left-0 w-full h-2 bg-blue-600/50 flex justify-between px-20 animate-bounce">
+             <div className="text-6xl">🚓</div>
+             <div className="text-6xl">🏃</div>
+          </div>
+        </div>
+      )}
+
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Models", id: "models" },
-          name: "Models",
+        { name: "Customizer", id: "customizer" },
-          id: "models",
+        { name: "Performance", id: "metrics" },
-        },
+        { name: "Contact", id: "contact" },
-        {
-          name: "Customizer",
-          id: "customizer",
-        },
-        {
-          name: "Performance",
-          id: "metrics",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
       ]}
       brandName="E-Moto Lab"
     />
@@ -57,88 +68,21 @@ export default function LandingPage() {
       <HeroOverlay
       title="Configure Your Electric Future"
       description="The ultimate configurator for high-performance electric dirt bikes. Customize frames, plastics, and components in real-time."
-      buttons={[
+      buttons={[{ text: "Start Customizing", href: "#models" }, { text: "Learn More", href: "#about" }]}
-        {
-          text: "Start Customizing",
-          href: "#models",
-        },
-        {
-          text: "Learn More",
-          href: "#about",
-        },
-      ]}
       imageSrc="http://img.b2bpic.net/free-photo/spectacular-view-mountains-pines-low-gloomy-clouds-with-backpack-scooter-front_613910-2583.jpg"
-      imageAlt="Futuristic electric dirt bike configurator"
-      showBlur={true}
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/motorbike-rider-with-helmet-holding-laptop_23-2148585487.jpg",
-          alt: "Motorbike rider with helmet holding laptop",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/man-riding-dirt-bike_23-2151493473.jpg",
-          alt: "Man riding dirt bike",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/stylish-motorbike-with-laptop-top_23-2148585485.jpg",
-          alt: "Stylish motorbike with laptop on top",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/people-racing-dirt-bikes_23-2151493510.jpg",
-          alt: "People racing dirt bikes",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/positive-bearded-redhead-male-leather-jacket-holds-motorcycle-helmet-grey-background_613910-9921.jpg",
-          alt: "Positive bearded redhead male in leather jacket holds motorcycle helmet on grey background.",
-        },
-      ]}
-      avatarText="Join 5,000+ builders"
     />
   </div>
 
   <div id="models" data-section="models">
       <ProductCardThree
+      useInvertedBackground={false}
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
       products={[
-        {
+        { id: "p1", name: "Stark VARG", price: "From $12,900", imageSrc: "http://img.b2bpic.net/free-photo/happy-curly-woman-sitting-modern-motorbike_171337-17535.jpg" },
-          id: "p1",
+        { id: "p2", name: "Sur-Ron Light Bee X", price: "From $4,300", imageSrc: "http://img.b2bpic.net/free-photo/active-man-trying-repair-motorbike_23-2148585450.jpg" },
-          name: "Stark VARG",
+        { id: "p3", name: "Talaria Sting R", price: "From $4,500", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-working-laptop-cafe_1303-16281.jpg" },
-          price: "From $12,900",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-curly-woman-sitting-modern-motorbike_171337-17535.jpg",
-        },
-        {
-          id: "p2",
-          name: "Sur-Ron Light Bee X",
-          price: "From $4,300",
-          imageSrc: "http://img.b2bpic.net/free-photo/active-man-trying-repair-motorbike_23-2148585450.jpg",
-        },
-        {
-          id: "p3",
-          name: "Talaria Sting R",
-          price: "From $4,500",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-working-laptop-cafe_1303-16281.jpg",
-        },
-        {
-          id: "p4",
-          name: "E Ride Pro SS",
-          price: "From $4,999",
-          imageSrc: "http://img.b2bpic.net/free-photo/active-rider-watching-his-motorbike-desert_23-2148585482.jpg",
-        },
-        {
-          id: "p5",
-          name: "Razor MX650",
-          price: "From $799",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-three-wheeled-vehicle-mobility-fast-travel_23-2151016502.jpg",
-        },
-        {
-          id: "p6",
-          name: "Tuttio Pro",
-          price: "From $3,800",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-mini-three-wheeled-mobility-vehicle_23-2151016408.jpg",
-        },
       ]}
       title="Select Your Base Platform"
       description="Choose from our curated selection of industry-leading electric platforms for your next build."
@@ -152,21 +96,9 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={true}
       metrics={[
-        {
+        { id: "m1", value: "120km", description: "Extended Range" },
-          id: "m1",
+        { id: "m2", value: "85Nm", description: "Instant Torque" },
-          value: "120km",
+        { id: "m3", value: "45kg", description: "Ultra Lightweight" },
-          description: "Extended Range",
-        },
-        {
-          id: "m2",
-          value: "85Nm",
-          description: "Instant Torque",
-        },
-        {
-          id: "m3",
-          value: "45kg",
-          description: "Ultra Lightweight",
-        },
       ]}
       title="Build Performance Stats"
       description="Track the impact of your modifications on range, torque, and weight."
@@ -178,21 +110,9 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Advanced Customization Engine"
       metrics={[
-        {
+        { icon: Zap, label: "Custom Parts", value: "500+" },
-          icon: Zap,
+        { icon: Palette, label: "Color Options", value: "Unlimited" },
-          label: "Custom Parts",
+        { icon: Shield, label: "Safety Tested", value: "100%" },
-          value: "500+",
-        },
-        {
-          icon: Palette,
-          label: "Color Options",
-          value: "Unlimited",
-        },
-        {
-          icon: Shield,
-          label: "Safety Tested",
-          value: "100%",
-        },
       ]}
       metricsAnimation="slide-up"
     />
@@ -203,46 +123,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       testimonials={[
-        {
+        { id: "t1", title: "Game Changer", quote: "The configurator made building my Sur-Ron so intuitive.", name: "Alex R.", role: "Pro Rider", imageSrc: "http://img.b2bpic.net/free-photo/biker-girl-leather-jacket-motorcycle_158595-452.jpg" },
-          id: "t1",
-          title: "Game Changer",
-          quote: "The configurator made building my Sur-Ron so intuitive. Best interface I've used.",
-          name: "Alex R.",
-          role: "Pro Rider",
-          imageSrc: "http://img.b2bpic.net/free-photo/biker-girl-leather-jacket-motorcycle_158595-452.jpg",
-        },
-        {
-          id: "t2",
-          title: "Top Quality",
-          quote: "Incredible customization options. My Talaria looks absolutely unique now.",
-          name: "Sarah K.",
-          role: "Modder",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-adult-male-trying-repair-motorcycle_23-2148585453.jpg",
-        },
-        {
-          id: "t3",
-          title: "Highly Recommend",
-          quote: "Fast, reliable, and the visual feedback is spot on.",
-          name: "Mike J.",
-          role: "Trail Addict",
-          imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-redhead-male-leather-jacket-holds-motorcycle-helmet-grey-background_613910-9915.jpg",
-        },
-        {
-          id: "t4",
-          title: "Perfect Build",
-          quote: "Found parts I didn't even know existed. Pure perfection.",
-          name: "Leo P.",
-          role: "Mechanic",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-cycling-outdoors-with-his-bike_23-2149748610.jpg",
-        },
-        {
-          id: "t5",
-          title: "Unrivaled Style",
-          quote: "The galaxy theme and build tools are the future of bike shops.",
-          name: "Jen D.",
-          role: "Urban Rider",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-couple-love-motorcycle_285396-7717.jpg",
-        },
       ]}
       title="Rider Stories"
       description="See how our community builds their dream rides."
@@ -253,15 +134,7 @@ export default function LandingPage() {
       <SocialProofOne
       textboxLayout="default"
       useInvertedBackground={false}
-      names={[
+      names={["ODI Components", "GUTS Racing", "Sur-Ron", "Talaria", "E-Ride Labs"]}
-        "ODI Components",
-        "GUTS Racing",
-        "Sur-Ron",
-        "Talaria",
-        "E-Ride Labs",
-        "Fox Suspension",
-        "Renthal",
-      ]}
       title="Trusted by Performance Brands"
       description="We partner with top-tier manufacturers to bring you factory-direct customization."
     />
@@ -272,21 +145,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "f1", title: "Can I ship to any country?", content: "Yes, we ship our custom parts kits globally with full tracking." },
-          id: "f1",
-          title: "Can I ship to any country?",
-          content: "Yes, we ship our custom parts kits globally with full tracking.",
-        },
-        {
-          id: "f2",
-          title: "Is installation difficult?",
-          content: "All our parts come with video tutorials for easy, bolt-on installation.",
-        },
-        {
-          id: "f3",
-          title: "How do returns work?",
-          content: "We offer a 30-day return policy for unused, uninstalled components.",
-        },
       ]}
       title="Got Questions?"
       description="Here is everything you need to know about our customization process."
@@ -297,14 +156,11 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactSplit
       useInvertedBackground={false}
-      background={{
+      background={{ variant: "sparkles-gradient" }}
-        variant: "sparkles-gradient",
-      }}
       tag="Stay Updated"
       title="Join the Elite Build Crew"
       description="Get early access to new frames, exclusive part drops, and build tutorials."
       imageSrc="http://img.b2bpic.net/free-photo/mountain-biker-training-brown-hill_181624-52561.jpg"
-      mediaAnimation="slide-up"
     />
   </div>
 
@@ -313,21 +169,9 @@ export default function LandingPage() {
       logoText="E-Moto Lab"
       copyrightText="© 2025 E-Moto Lab. Build your ride."
       socialLinks={[
-        {
+        { icon: Instagram, href: "#", ariaLabel: "Instagram" },
-          icon: Instagram,
+        { icon: Film, href: "#", ariaLabel: "Youtube" },
-          href: "#",
+        { icon: Twitter, href: "#", ariaLabel: "Twitter" },
-          ariaLabel: "Instagram",
-        },
-        {
-          icon: Film,
-          href: "#",
-          ariaLabel: "Youtube",
-        },
-        {
-          icon: Twitter,
-          href: "#",
-          ariaLabel: "Twitter",
-        },
       ]}
     />
   </div>

src/app/styles/variables.css

@@ -12,13 +12,13 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #fffaf5e6;
+  --foreground: #f8f5ff;
-  --primary-cta: #ffaa70;
+  --primary-cta: #ff6207;
   --primary-cta-text: #0a0a0a;
   --secondary-cta: #1a1a1a;
   --secondary-cta-text: #fffaf5e6;
-  --accent: #737373;
+  --accent: #1f7cff;
-  --background-accent: #737373;
+  --background-accent: #e34400;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);