From c87e9ae4a9949ea039aabb2c7490e919afa7f79e Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Tue, 31 Mar 2026 23:41:20 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 361 +++++++++++++----------------------------------
 1 file changed, 97 insertions(+), 264 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index c58ec85..f7d7339 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,15 +2,15 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
-import FooterCard from '@/components/sections/footer/FooterCard';
-import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardThree from '@/components/sections/product/ProductCardThree';
-import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
-import { Award, Facebook, Instagram, Shield, Twitter, Zap } from "lucide-react";
+import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
+import ContactText from '@/components/sections/contact/ContactText';
+import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
+import { Zap, Shield, Award, LayoutDashboard, Settings, User, FileText, ChevronRight } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -27,268 +27,101 @@ export default function LandingPage() {
         headingFontWeight="normal"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "Products",
-          id: "products",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="R&A Modify"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingOverlay
+              brandName="R&A Modify"
+              navItems={[
+                { name: "Home", id: "hero" },
+                { name: "About", id: "about" },
+                { name: "Services", id: "features" },
+                { name: "Products", id: "products" },
+                { name: "Contact", id: "contact" },
+              ]}
+            />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardCarousel
-      background={{
-        variant: "gradient-bars",
-      }}
-      title="Modify to Perfection"
-      description="Extreme planning and precision engineering for automotive enthusiasts. We transform your vehicle into a high-performance masterpiece."
-      tag="R&A Modify"
-      tagAnimation="slide-up"
-      buttons={[
-        {
-          text: "Start Project",
-          href: "#contact",
-        },
-      ]}
-      buttonAnimation="slide-up"
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-car_1303-3853.jpg",
-          imageAlt: "Modified sports car",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1499.jpg",
-          imageAlt: "Precision engine parts",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-vector/gradient-mechanical-service-facebook-template_23-2150090776.jpg",
-          imageAlt: "Automotive workshop",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-vector/glowing-light-movement-futuristic-background_52683-15316.jpg",
-          imageAlt: "Racing motion",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-vector/black-blue-speedometer_1057-3274.jpg",
-          imageAlt: "Interior modification",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-making-desicion-buy-car_1303-13859.jpg",
-          imageAlt: "Widebody showcase",
-        },
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+            <HeroBillboardDashboard
+              title="Modify to Perfection"
+              description="Extreme planning and precision engineering for automotive enthusiasts. We transform your vehicle into a high-performance masterpiece."
+              tag="R&A Modify"
+              dashboard={{
+                title: "Project Performance",                stats: [
+                    { title: "Horsepower", values: [500, 550, 600], description: "Performance gains" },
+                    { title: "Projects", values: [850, 900, 950], description: "Builds completed" },
+                    { title: "Clients", values: [1200, 1250, 1300], description: "Satisfied owners" }
+                ],
+                logoIcon: Zap,
+                sidebarItems: [{ icon: LayoutDashboard, active: true }, { icon: Settings }, { icon: User }],
+                listItems: [{ icon: FileText, title: "Stage 1 Tuning", status: "Complete" }, { icon: FileText, title: "Aero Kit Install", status: "In Progress" }],
+                imageSrc: "http://img.b2bpic.net/free-photo/business-woman-car_1303-3853.jpg"
+              }}
+              background={{ variant: "gradient-bars" }}
+            />
+        </div>
 
-  <div id="about" data-section="about">
-      <AboutMetric
-      useInvertedBackground={true}
-      title="Precision Metrics"
-      metrics={[
-        {
-          icon: Zap,
-          label: "Horsepower Gains",
-          value: "500+",
-        },
-        {
-          icon: Shield,
-          label: "Satisfied Builds",
-          value: "1200+",
-        },
-        {
-          icon: Award,
-          label: "Projects Perfected",
-          value: "850+",
-        },
-      ]}
-      metricsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="about" data-section="about">
+            <InlineImageSplitTextAbout
+              heading={[{ type: 'text', content: 'Our Philosophy of ' }, { type: 'text', content: 'Perfection' }]} 
+              useInvertedBackground={true}
+            />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureCardTwelve
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        {
-          id: "f1",
-          label: "Performance",
-          title: "Engine Tuning",
-          items: [
-            "ECU Remapping",
-            "Turbo Upgrades",
-            "Exhaust Systems",
-          ],
-        },
-        {
-          id: "f2",
-          label: "Styling",
-          title: "Exterior Kits",
-          items: [
-            "Widebody Designs",
-            "Carbon Fiber Parts",
-            "Custom Paint",
-          ],
-        },
-        {
-          id: "f3",
-          label: "Interior",
-          title: "Luxury Refinement",
-          items: [
-            "Custom Leather",
-            "Racing Seats",
-            "Digital Clusters",
-          ],
-        },
-      ]}
-      title="Our Modification Services"
-      description="Expert services tailored to unlock your car's true potential."
-    />
-  </div>
+        <div id="features" data-section="features">
+            <FeatureCardTwentyFive
+              title="Extreme Planning"
+              description="Precision-engineered solutions for high-performance automotive transformation."
+              animationType="slide-up"
+              textboxLayout="split"
+              useInvertedBackground={false}
+              features={[
+                { title: "Engine Tuning", description: "Advanced ECU remapping and turbo upgrades for peak output.", icon: Zap, mediaItems: [{imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1499.jpg"}, {imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1499.jpg"}] },
+                { title: "Aero Dynamics", description: "Custom widebody designs and carbon fiber integration.", icon: Shield, mediaItems: [{imageSrc: "http://img.b2bpic.net/free-vector/gradient-mechanical-service-facebook-template_23-2150090776.jpg"}, {imageSrc: "http://img.b2bpic.net/free-vector/gradient-mechanical-service-facebook-template_23-2150090776.jpg"}] }
+              ]}
+            />
+        </div>
 
-  <div id="products" data-section="products">
-      <ProductCardThree
-      animationType="slide-up"
-      textboxLayout="split"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "p1",
-          name: "Pro Turbocharger Kit",
-          price: "$3,200",
-          imageSrc: "http://img.b2bpic.net/free-photo/different-car-accessories-assortment_23-2149030428.jpg",
-        },
-        {
-          id: "p2",
-          name: "Forged Alloy Wheels",
-          price: "$2,400",
-          imageSrc: "http://img.b2bpic.net/free-photo/car-volume-knob-multimedia-controller-auto-textured-adjustment-wheel_169016-68661.jpg",
-        },
-        {
-          id: "p3",
-          name: "Full Aerodynamic Hood",
-          price: "$1,800",
-          imageSrc: "http://img.b2bpic.net/free-photo/extreme-hard-drive-cooling_1401-422.jpg",
-        },
-      ]}
-      title="Elite Performance Parts"
-      description="Hand-picked components to achieve automotive perfection."
-    />
-  </div>
+        <div id="products" data-section="products">
+            <ProductCardOne
+              title="Performance Components"
+              description="High-grade parts to push your build further."
+              gridVariant="bento-grid"
+              animationType="slide-up"
+              textboxLayout="split"
+              products={[
+                { id: "p1", name: "Pro Turbocharger", price: "$3,200", imageSrc: "http://img.b2bpic.net/free-photo/different-car-accessories-assortment_23-2149030428.jpg" },
+                { id: "p2", name: "Alloy Wheels", price: "$2,400", imageSrc: "http://img.b2bpic.net/free-photo/car-volume-knob-multimedia-controller-auto-textured-adjustment-wheel_169016-68661.jpg" }
+              ]}
+            />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardOne
-      animationType="slide-up"
-      textboxLayout="split"
-      gridVariant="two-columns-alternating-heights"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "1",
-          name: "Sarah Johnson",
-          role: "Race Driver",
-          company: "Circuit Pro",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-holding-hands-with-his-girlfriend-outside-car_23-2148377935.jpg?_wi=1",
-        },
-        {
-          id: "2",
-          name: "Michael Chen",
-          role: "Hobbyist",
-          company: "AutoClub",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/technology-communication-two-friends-having-lively-conversation-lunch_273609-6658.jpg",
-        },
-        {
-          id: "3",
-          name: "Emily Rodriguez",
-          role: "Car Collector",
-          company: "Luxury Auto",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-calling-taxi_23-2148002436.jpg",
-        },
-        {
-          id: "4",
-          name: "David Kim",
-          role: "Tuner",
-          company: "Street Pro",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/satisfied-customer-shaking-hands-with-mechanic_1170-1275.jpg",
-        },
-        {
-          id: "5",
-          name: "Alex Rivera",
-          role: "Drifter",
-          company: "Drift King",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-holding-hands-with-his-girlfriend-outside-car_23-2148377935.jpg?_wi=2",
-        },
-      ]}
-      title="Client Perfection Stories"
-      description="Hear what our enthusiasts have to say."
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+            <TestimonialCardTwo
+              title="Client Stories"
+              description="Results that define our reputation."
+              animationType="blur-reveal"
+              textboxLayout="split"
+              testimonials={[
+                { id: "1", name: "Sarah J.", role: "Race Driver", testimonial: "The transformation was nothing short of perfection.", icon: Award }
+              ]}
+            />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactSplit
-      useInvertedBackground={true}
-      background={{
-        variant: "gradient-bars",
-      }}
-      tag="Get in touch"
-      title="Ready to Transform?"
-      description="Reach out to R&A Modify for premium automotive solutions. Start your project now."
-      imageSrc="http://img.b2bpic.net/free-photo/smartphone-laptop-high-angle_23-2148541551.jpg"
-      mediaAnimation="slide-up"
-    />
-  </div>
+        <div id="contact" data-section="contact">
+            <ContactText
+              text="Ready to transform your drive?"
+              background={{ variant: "gradient-bars" }}
+            />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="R&A Modify"
-      copyrightText="© 2025 R&A Modify. All rights reserved."
-      socialLinks={[
-        {
-          icon: Instagram,
-          href: "#",
-          ariaLabel: "Instagram",
-        },
-        {
-          icon: Facebook,
-          href: "#",
-          ariaLabel: "Facebook",
-        },
-        {
-          icon: Twitter,
-          href: "#",
-          ariaLabel: "Twitter",
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+            <FooterLogoReveal
+              logoText="R&A Modify"
+              leftLink={{ text: "Privacy", href: "#" }}
+              rightLink={{ text: "Terms", href: "#" }}
+            />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file
-- 
2.49.1