Update src/app/page.tsx

src/app/page.tsx

@@ -12,7 +12,7 @@ import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarS
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
-import { Award, Shield, Zap } from "lucide-react";
+import { Zap, Shield, Award, Gauge, BatteryCharging, Zap as Power } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -22,32 +22,20 @@ export default function LandingPage() {
         borderRadius="rounded"
         contentWidth="small"
         sizing="largeSmall"
-        background="floatingGradient"
+        background="noise"
-        cardStyle="gradient-radial"
+        cardStyle="glass-depth"
-        primaryButtonStyle="double-inset"
+        primaryButtonStyle="primary-glow"
-        secondaryButtonStyle="glass"
+        secondaryButtonStyle="solid"
-        headingFontWeight="normal"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",
+        { name: "The Fleet", id: "products" },
-          id: "hero",
+        { name: "Technology", id: "features" },
-        },
+        { name: "Contact", id: "contact" },
-        {
-          name: "Models",
-          id: "products",
-        },
-        {
-          name: "Features",
-          id: "features",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
       ]}
       brandName="Vertex Motors"
     />
@@ -55,24 +43,13 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroLogoBillboard
-      background={{
+      background={{ variant: "radial-gradient" }}
-        variant: "gradient-bars",
-      }}
       logoText="Vertex Motors"
-      description="Redefining the future of luxury transportation with precision engineering and breathtaking 3D design aesthetics."
+      description="Pushing the boundaries of performance and style. Our fleet defines the future of automotive motion."
-      buttons={[
+      buttons={[{ text: "View Models", href: "#products" }, { text: "Inquire", href: "#contact" }]}
-        {
-          text: "Explore Models",
-          href: "#products",
-        },
-        {
-          text: "Contact Sales",
-          href: "#contact",
-        },
-      ]}
       buttonAnimation="slide-up"
-      imageSrc="http://img.b2bpic.net/free-photo/view-3d-car-model_23-2151138937.jpg"
+      imageSrc="https://img.b2bpic.net/free-photo/view-3d-car-model_23-2151138937.jpg"
-      imageAlt="Futuristic luxury car"
+      imageAlt="Futuristic luxury car concept"
       mediaAnimation="blur-reveal"
     />
   </div>
@@ -81,24 +58,15 @@ export default function LandingPage() {
       <SplitAbout
       textboxLayout="split"
       useInvertedBackground={false}
-      title="Engineering Perfection"
+      title="Engineering Artistry"
-      description="At Vertex, we combine artisanal craftsmanship with bleeding-edge digital manufacturing to push boundaries."
+      description="Where high-performance meets design. Every Vertex vehicle is crafted for the ultimate driving experience."
       bulletPoints={[
-        {
+        { title: "Carbon Monocoque", description: "Ultra-lightweight chassis for maximum agility.", icon: Shield },
-          title: "Precision Design",
+        { title: "Direct Drive", description: "Instant torque delivery on every acceleration.", icon: Zap },
-          description: "Every curve is mathematically optimized.",
+        { title: "Precision Tuning", description: "Handling dynamics refined in wind tunnel testing.", icon: Award },
-        },
-        {
-          title: "Advanced Materials",
-          description: "Carbon fiber integration for extreme efficiency.",
-        },
-        {
-          title: "Zero Emissions",
-          description: "Pure electric power without compromise.",
-        },
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/high-angle-hard-drive-components-blue-light_23-2149417059.jpg"
+      imageSrc="https://img.b2bpic.net/free-photo/luxury-car-speeds-by-modern-building-dusk-generative-ai_188544-8048.jpg?_wi=1"
-      imageAlt="Engine tech detail"
+      imageAlt="Car in motion"
       mediaAnimation="slide-up"
     />
   </div>
@@ -109,64 +77,13 @@ export default function LandingPage() {
       textboxLayout="default"
       gridVariant="bento-grid"
       useInvertedBackground={true}
+      title="The Signature Fleet"
+      description="Discover our precision-engineered electric sports cars."
       products={[
-        {
+        { id: "1", brand: "Vertex", name: "Hyperion", price: "$280k", rating: 5, reviewCount: "45", imageSrc: "https://img.b2bpic.net/free-photo/exterior-modern-white-luxury-car_181624-23559.jpg" },
-          id: "1",
+        { id: "2", brand: "Vertex", name: "V-Racer", price: "$190k", rating: 5, reviewCount: "62", imageSrc: "https://img.b2bpic.net/free-photo/luxury-car-speeds-by-modern-building-dusk-generative-ai_188544-8048.jpg?_wi=2" },
-          brand: "Vertex",
+        { id: "3", brand: "Vertex", name: "Aerodyn", price: "$210k", rating: 5, reviewCount: "38", imageSrc: "https://img.b2bpic.net/free-photo/stylish-rear-light-new-silver-automobile_23-2147963009.jpg?_wi=1" }
-          name: "V-Sport",
-          price: "$120,000",
-          rating: 5,
-          reviewCount: "120",
-          imageSrc: "http://img.b2bpic.net/free-photo/exterior-modern-white-luxury-car_181624-23559.jpg",
-        },
-        {
-          id: "2",
-          brand: "Vertex",
-          name: "V-Aerotech",
-          price: "$150,000",
-          rating: 5,
-          reviewCount: "98",
-          imageSrc: "http://img.b2bpic.net/free-photo/luxury-car-speeds-by-modern-building-dusk-generative-ai_188544-8048.jpg",
-        },
-        {
-          id: "3",
-          brand: "Vertex",
-          name: "V-Coupe",
-          price: "$180,000",
-          rating: 4,
-          reviewCount: "75",
-          imageSrc: "http://img.b2bpic.net/free-photo/stylish-rear-light-new-silver-automobile_23-2147963009.jpg",
-        },
-        {
-          id: "4",
-          brand: "Vertex",
-          name: "V-SUV",
-          price: "$135,000",
-          rating: 5,
-          reviewCount: "210",
-          imageSrc: "http://img.b2bpic.net/free-photo/family-with-cute-daughter-choosing-car-car-showroom_1303-26825.jpg",
-        },
-        {
-          id: "5",
-          brand: "Vertex",
-          name: "V-Sedan",
-          price: "$110,000",
-          rating: 4,
-          reviewCount: "55",
-          imageSrc: "http://img.b2bpic.net/free-photo/hands-wheel-when-driving-high-speed-from-inside-car_169016-39107.jpg",
-        },
-        {
-          id: "6",
-          brand: "Vertex",
-          name: "V-Chassis",
-          price: "$250,000",
-          rating: 5,
-          reviewCount: "15",
-          imageSrc: "http://img.b2bpic.net/free-photo/back-view-people-talking-about-car_23-2150171274.jpg",
-        },
       ]}
-      title="Our Signature Series"
-      description="Explore the collection of our latest high-performance vehicles."
     />
   </div>
 
@@ -175,194 +92,76 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
+      title="Performance Stats"
+      description="The core metrics of our latest engineering breakthrough."
       metrics={[
-        {
+        { id: "m1", icon: Gauge, title: "Top Speed", value: "240mph" },
-          id: "m1",
+        { id: "m2", icon: BatteryCharging, title: "Range", value: "600 miles" },
-          icon: Zap,
+        { id: "m3", icon: Power, title: "Peak Torque", value: "1,500Nm" },
-          title: "HP Output",
-          value: "1,200+",
-        },
-        {
-          id: "m2",
-          icon: Shield,
-          title: "Safety Rating",
-          value: "5 Stars",
-        },
-        {
-          id: "m3",
-          icon: Award,
-          title: "Design Awards",
-          value: "45+",
-        },
       ]}
-      title="Performance at a Glance"
-      description="The numbers behind our revolutionary automotive technology."
     />
   </div>
 
   <div id="features" data-section="features">
       <FeatureCardTwentyFour
       animationType="slide-up"
+      title="Performance Tech"
+      description="State-of-the-art innovation inside every machine."
       textboxLayout="default"
       useInvertedBackground={true}
       features={[
-        {
+        { id: "f1", title: "Active Aero", author: "R&D", description: "Dynamic wing adjustments for track performance.", tags: ["Performance"], imageSrc: "https://img.b2bpic.net/free-photo/stylish-rear-light-new-silver-automobile_23-2147963009.jpg?_wi=2" },
-          id: "f1",
+        { id: "f2", title: "Neural-Dash", author: "Digital", description: "Predictive AI interface for driver safety.", tags: ["UX"], imageSrc: "https://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg" }
-          title: "Advanced Motors",
-          author: "Engineering",
-          description: "Electric motors designed for maximum efficiency.",
-          tags: [
-            "Tech",
-            "Power",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-researcher-working-with-magnifier_23-2148925543.jpg",
-        },
-        {
-          id: "f2",
-          title: "Smart UI",
-          author: "Software",
-          description: "Intelligent dash interface for real-time monitoring.",
-          tags: [
-            "UX",
-            "Digital",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg",
-        },
-        {
-          id: "f3",
-          title: "Aerodynamics",
-          author: "R&D",
-          description: "Wind-tunnel verified airflow systems.",
-          tags: [
-            "Performance",
-            "Physics",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/person-using-ar-technology-perform-their-occupation_23-2151137456.jpg",
-        },
       ]}
-      title="Advanced Features"
-      description="Experience superior driving dynamics through state-of-the-art tech."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardSixteen
       animationType="slide-up"
+      title="Driver Reviews"
+      description="What our performance enthusiasts have to say."
       textboxLayout="default"
       useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "t1",
-          name: "Sarah Johnson",
-          role: "CEO",
-          company: "TechCorp",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/trendy-rich-caucasian-man-is-sitting-new-modern-car-seriously-looking-straight-through-windscreen_8353-10899.jpg",
-        },
-        {
-          id: "t2",
-          name: "Michael Chen",
-          role: "CTO",
-          company: "InnovateLab",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-happy-corporate-woman-suit-stands-street-smiles-poses-near-office-bu_1258-119148.jpg",
-        },
-        {
-          id: "t3",
-          name: "Emily Rodriguez",
-          role: "Director",
-          company: "GrowthCo",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/full-length-portrait-confident-mature-businessman-formals-standing-isolated-white-background_613910-10632.jpg",
-        },
-        {
-          id: "t4",
-          name: "David Kim",
-          role: "Manager",
-          company: "StartupXYZ",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",
-        },
-        {
-          id: "t5",
-          name: "Alice Wang",
-          role: "Lead",
-          company: "EcoDesign",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-blue-lights-visual-effects_23-2149419525.jpg",
-        },
-      ]}
       kpiItems={[
-        {
+        { value: "0-60", label: "1.9s" },
-          value: "98%",
+        { value: "5-Star", label: "Safety Rating" },
-          label: "Retention",
+        { value: "100%", label: "Electric" }
-        },
+      ]}
-        {
+      testimonials={[
-          value: "4.9/5",
+        { id: "t1", name: "Alex V.", role: "Track Enthusiast", company: "Racing Club", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/trendy-rich-caucasian-man-is-sitting-new-modern-car-seriously-looking-straight-through-windscreen_8353-10899.jpg" },
-          label: "Customer Satisfaction",
+        { id: "t2", name: "Mia L.", role: "Luxury Auto Collector", company: "Luxury Motors", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/portrait-beautiful-happy-corporate-woman-suit-stands-street-smiles-poses-near-office-bu_1258-119148.jpg" }
-        },
-        {
-          value: "10k+",
-          label: "Happy Drivers",
-        },
       ]}
-      title="Owner Testimonials"
-      description="See why industry leaders choose Vertex."
     />
   </div>
 
   <div id="faq" data-section="faq">
       <FaqDouble
+      title="Frequently Asked Questions"
+      description="Your path to owning a Vertex vehicle."
       textboxLayout="default"
       useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "Is charging free?",
-          content: "Yes, at all Vertex stations.",
-        },
-        {
-          id: "q2",
-          title: "How long for delivery?",
-          content: "Typically 4-6 weeks.",
-        },
-        {
-          id: "q3",
-          title: "Can I customize?",
-          content: "Yes, through our configurator.",
-        },
-      ]}
-      title="Frequently Asked"
-      description="Have questions? We have answers."
       faqsAnimation="slide-up"
+      faqs={[
+        { id: "q1", title: "How do I pre-order?", content: "Visit our online configurator to start your build." },
+        { id: "q2", title: "Are they road legal?", content: "Fully compliant in all major markets." },
+        { id: "q3", title: "Maintenance?", content: "Over-the-air updates for software; bi-annual physical service." }
+      ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactSplitForm
+      title="Start Your Build"
+      description="Reach out to our specialists today."
       useInvertedBackground={false}
-      title="Get In Touch"
-      description="Ready to configure your dream car?"
       inputs={[
-        {
+        { name: "name", type: "text", placeholder: "Full Name", required: true },
-          name: "name",
+        { name: "email", type: "email", placeholder: "Your Email", required: true }
-          type: "text",
-          placeholder: "Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Email",
-          required: true,
-        },
       ]}
-      textarea={{
+      textarea={{ name: "message", placeholder: "Describe your dream configuration..." }}
-        name: "message",
+      imageSrc="https://img.b2bpic.net/free-photo/empty-floor-front-modern-building_1127-2885.jpg"
-        placeholder: "Your message here...",
+      imageAlt="Modern showroom entrance"
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/empty-floor-front-modern-building_1127-2885.jpg"
-      imageAlt="Car Showroom"
     />
   </div>
 
@@ -370,32 +169,8 @@ export default function LandingPage() {
       <FooterBaseCard
       logoText="Vertex Motors"
       columns={[
-        {
+        { title: "Brand", items: [{ label: "About Us", href: "#about" }, { label: "Gallery", href: "#products" }] },
-          title: "Company",
+        { title: "Connect", items: [{ label: "Contact", href: "#contact" }, { label: "Legal", href: "#" }] }
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-          ],
-        },
       ]}
     />
   </div>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f5f5;
+  --background: #0a0a0a;
-  --card: #ffffff;
+  --card: #1a1a1a;
-  --foreground: #1c1c1c;
+  --foreground: #ffffff;
-  --primary-cta: #511f1f;
+  --primary-cta: #1f7cff;
   --primary-cta-text: #f5f5f5;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #010101;
   --secondary-cta-text: #1c1c1c;
-  --accent: #e63946;
+  --accent: #1f7cff;
-  --background-accent: #e8bea8;
+  --background-accent: #f96b2f;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);