Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -69,6 +69,8 @@ export default function LandingPage() {
   <div id="features" data-section="features">
       <FeatureCardNineteen
       textboxLayout="split"
+      tagAnimation="slide-up"
+      buttonAnimation="slide-up"
       useInvertedBackground={true}
       features={[
         {
@@ -85,7 +87,7 @@ export default function LandingPage() {
 
   <div id="models" data-section="models">
       <ProductCardFour
-      animationType="slide-up"
+      animationType="scale-rotate"
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
@@ -110,12 +112,17 @@ export default function LandingPage() {
 
   <div id="product" data-section="product">
       <ProductCardTwo
-      animationType="slide-up"
+      title="Latest Additions"
+      description="Check out our newest arrivals in high-performance scooters."
       textboxLayout="default"
+      animationType="blur-reveal"
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
-      title="Featured Product"
-      description="Discover our latest flagship scooter."
+      products={[
+        { id: "p1", brand: "Volt", name: "Volt Zen", price: "$1,199", rating: 4.8, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/modern-car-futuristic-road_23-2151021131.jpg?_wi=1" },
+        { id: "p2", brand: "Volt", name: "Volt Pro", price: "$1,399", rating: 4.9, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/modern-car-futuristic-road_23-2151021131.jpg?_wi=2" },
+        { id: "p3", brand: "Volt", name: "Volt Max", price: "$1,599", rating: 4.7, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/modern-car-futuristic-road_23-2151021131.jpg?_wi=3" }
+      ]}
     />
   </div>
 
@@ -163,4 +170,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -12,13 +12,13 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #f0f8ffe6;
-  --primary-cta: #cee7ff;
+  --foreground: #ffffff;
+  --primary-cta: #106efb;
   --primary-cta-text: #0a0a0a;
   --secondary-cta: #1a1a1a;
   --secondary-cta-text: #f0f8ffe6;
-  --accent: #737373;
-  --background-accent: #737373;
+  --accent: #106efb;
+  --background-accent: #1a1a1a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);