From 05118130b97a2c08520210b3a4e88f420ea11432 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 22 Apr 2026 01:46:10 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 372 ++++++++++++++++++-----------------------------
 1 file changed, 140 insertions(+), 232 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 5eeb91b..93dc218 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -29,247 +29,155 @@ export default function LandingPage() {
         headingFontWeight="bold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleCentered
-      navItems={[
-        {
-          name: "Services",          id: "services"},
-        {
-          name: "Reviews",          id: "reviews"},
-        {
-          name: "FAQ",          id: "faq"},
-        {
-          name: "Contact",          id: "contact"},
-      ]}
-      brandName="Locksmith 417"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Services", id: "services" },
+              { name: "Reviews", id: "reviews" },
+              { name: "FAQ", id: "faq" },
+              { name: "Contact", id: "contact" }
+            ]}
+            brandName="Locksmith 417"
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardGallery
-      background={{
-        variant: "gradient-bars"}}
-      title="Professional Auto Locksmith 30 Minutes or Less"
-      description="Sameday ignition repair, fob programming, and emergency lockout service. Fully licensed, 4.9-star rated, and 50% less than dealerships."
-      buttons={[
-        {
-          text: "Call for a Quote",          href: "tel:4175550100"},
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/car-being-taking-care-workshop_23-2149580573.jpg",          imageAlt: "Professional locksmith"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-work-van_23-2149891032.jpg",          imageAlt: "Ignition repair"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-opening-van-s-door_23-2149908130.jpg",          imageAlt: "Lockout service"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-jeweler-making-jewellery_23-2150931420.jpg",          imageAlt: "Professional locksmith"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/mechanic-examining-car-with-lamp_1170-1291.jpg",          imageAlt: "Ignition repair"},
-      ]}
-      mediaAnimation="blur-reveal"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroBillboardGallery
+            background={{ variant: "gradient-bars" }}
+            title="Professional Auto Locksmith 30 Minutes or Less"
+            description="Sameday ignition repair, fob programming, and emergency lockout service. Fully licensed, 4.9-star rated, and 50% less than dealerships."
+            buttons={[{ text: "Call for a Quote", href: "tel:4175550100" }]}
+            mediaItems={[
+              { imageSrc: "http://img.b2bpic.net/free-photo/car-being-taking-care-workshop_23-2149580573.jpg", imageAlt: "Professional locksmith" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-work-van_23-2149891032.jpg", imageAlt: "Ignition repair" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-opening-van-s-door_23-2149908130.jpg", imageAlt: "Lockout service" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/side-view-jeweler-making-jewellery_23-2150931420.jpg", imageAlt: "Professional locksmith" },
+              { imageSrc: "http://img.b2bpic.net/free-photo/mechanic-examining-car-with-lamp_1170-1291.jpg", imageAlt: "Ignition repair" }
+            ]}
+            mediaAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardSeven
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",          value: "30m",          title: "Avg Response Time",          items: [
-            "Always on time",            "Mobile service",            "Fully equipped"],
-        },
-        {
-          id: "m2",          value: "4.9★",          title: "Rating",          items: [
-            "Verified reviews",            "Top-rated",            "Client approved"],
-        },
-        {
-          id: "m3",          value: "50%",          title: "Dealer Savings",          items: [
-            "Better pricing",            "Direct savings",            "Budget friendly"],
-        },
-      ]}
-      title="Quality You Can Trust"
-      description="We pride ourselves on speed, affordability, and expert service."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+          <MetricCardSeven
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            metrics={[
+              { id: "m1", value: "30m", title: "Avg Response Time", items: ["Always on time", "Mobile service", "Fully equipped"] },
+              { id: "m2", value: "4.9★", title: "Rating", items: ["Verified reviews", "Top-rated", "Client approved"] },
+              { id: "m3", value: "50%", title: "Dealer Savings", items: ["Better pricing", "Direct savings", "Budget friendly"] }
+            ]}
+            title="Quality You Can Trust"
+            description="We pride ourselves on speed, affordability, and expert service."
+          />
+        </div>
 
-  <div id="services" data-section="services">
-      <FeatureCardTen
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "Ignition Repair",          description: "Professional repair and replacement for faulty ignition switches.",          media: {
-            imageSrc: "http://img.b2bpic.net/free-photo/close-up-driver-opening-ev-car-charging-port-flap-attaching-electric-cable_482257-130208.jpg",            imageAlt: "Ignition repair"},
-          items: [
-            {
-              text: "Stuck key removal",              icon: Wrench,
-            },
-            {
-              text: "Ignition switch fix",              icon: Settings,
-            },
-            {
-              text: "Cylinder replacement",              icon: Shield,
-            },
-          ],
-          reverse: false,
-        },
-        {
-          title: "Fob Programming",          description: "Advanced electronic key programming for all major vehicle makes.",          media: {
-            imageSrc: "http://img.b2bpic.net/free-photo/close-up-doctor-eye-working_23-2148920069.jpg",            imageAlt: "Fob programming"},
-          items: [
-            {
-              text: "Transponder keys",              icon: Zap,
-            },
-            {
-              text: "Remote entry",              icon: Smartphone,
-            },
-            {
-              text: "Key duplication",              icon: Copy,
-            },
-          ],
-          reverse: true,
-        },
-        {
-          title: "Emergency Lockouts",          description: "Fast, damage-free entry for your vehicle, anywhere in our range.",          media: {
-            imageSrc: "http://img.b2bpic.net/free-photo/man-giving-order-curbside-pickup_23-2149106378.jpg",            imageAlt: "Lockout service"},
-          items: [
-            {
-              text: "24/7 Availability",              icon: Clock,
-            },
-            {
-              text: "Damage-free entry",              icon: CheckCircle,
-            },
-            {
-              text: "Mobile service",              icon: Car,
-            },
-          ],
-          reverse: false,
-        },
-      ]}
-      title="Comprehensive Automotive Services"
-      description="From emergency lockouts to complex ignition repairs, we handle everything."
-    />
-  </div>
+        <div id="services" data-section="services">
+          <FeatureCardTen
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            features={[
+              {
+                title: "Ignition Repair",                description: "Professional repair and replacement for faulty ignition switches.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-driver-opening-ev-car-charging-port-flap-attaching-electric-cable_482257-130208.jpg", imageAlt: "Ignition repair" },
+                items: [{ text: "Stuck key removal", icon: Wrench }, { text: "Ignition switch fix", icon: Settings }, { text: "Cylinder replacement", icon: Shield }],
+                reverse: false
+              },
+              {
+                title: "Fob Programming",                description: "Advanced electronic key programming for all major vehicle makes.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-doctor-eye-working_23-2148920069.jpg", imageAlt: "Fob programming" },
+                items: [{ text: "Transponder keys", icon: Zap }, { text: "Remote entry", icon: Smartphone }, { text: "Key duplication", icon: Copy }],
+                reverse: true
+              },
+              {
+                title: "Emergency Lockouts",                description: "Fast, damage-free entry for your vehicle, anywhere in our range.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/man-giving-order-curbside-pickup_23-2149106378.jpg", imageAlt: "Lockout service" },
+                items: [{ text: "24/7 Availability", icon: Clock }, { text: "Damage-free entry", icon: CheckCircle }, { text: "Mobile service", icon: Car }],
+                reverse: false
+              }
+            ]}
+            title="Comprehensive Automotive Services"
+            description="From emergency lockouts to complex ignition repairs, we handle everything."
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <AboutMetric
-      useInvertedBackground={false}
-      title="Why Choose Locksmith 417?"
-      metrics={[
-        {
-          icon: Award,
-          label: "License",          value: "Fully Licensed"},
-        {
-          icon: Star,
-          label: "Rating",          value: "4.9/5 stars"},
-        {
-          icon: DollarSign,
-          label: "Savings",          value: "50% Savings"},
-      ],
-      metricsAnimation="slide-up"
-    />
-  </div>
+        <div id="about" data-section="about">
+          <AboutMetric
+            useInvertedBackground={false}
+            title="Why Choose Locksmith 417?"
+            metrics={[
+              { icon: Award, label: "License", value: "Fully Licensed" },
+              { icon: Star, label: "Rating", value: "4.9/5 stars" },
+              { icon: DollarSign, label: "Savings", value: "50% Savings" }
+            ]}
+            metricsAnimation="slide-up"
+          />
+        </div>
 
-  <div id="reviews" data-section="reviews">
-      <TestimonialCardTwelve
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "t1",          name: "Sarah J.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-woman-holding-car-keys_23-2148384904.jpg"},
-        {
-          id: "t2",          name: "Mark D.",          imageSrc: "http://img.b2bpic.net/free-photo/feeling-happy-pointing-self-with-excited_1194-400315.jpg"},
-        {
-          id: "t3",          name: "Emily R.",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-male-holds-car-key-while-sits-automobile_176532-8018.jpg"},
-        {
-          id: "t4",          name: "David K.",          imageSrc: "http://img.b2bpic.net/free-photo/happy-european-male-showing-face-mask-vibrant-yellow-wall_181624-52117.jpg"},
-        {
-          id: "t5",          name: "Jennifer L.",          imageSrc: "http://img.b2bpic.net/free-photo/happy-auto-repairman-handshaking-with-female-customer-workshop_637285-9789.jpg"},
-      ]}
-      cardTitle="What Our Customers Say"
-      cardTag="Trusted Reviews"
-      cardAnimation="blur-reveal"
-    />
-  </div>
+        <div id="reviews" data-section="reviews">
+          <TestimonialCardTwelve
+            useInvertedBackground={false}
+            testimonials={[
+              { id: "t1", name: "Sarah J.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-woman-holding-car-keys_23-2148384904.jpg" },
+              { id: "t2", name: "Mark D.", imageSrc: "http://img.b2bpic.net/free-photo/feeling-happy-pointing-self-with-excited_1194-400315.jpg" },
+              { id: "t3", name: "Emily R.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-male-holds-car-key-while-sits-automobile_176532-8018.jpg" },
+              { id: "t4", name: "David K.", imageSrc: "http://img.b2bpic.net/free-photo/happy-european-male-showing-face-mask-vibrant-yellow-wall_181624-52117.jpg" },
+              { id: "t5", name: "Jennifer L.", imageSrc: "http://img.b2bpic.net/free-photo/happy-auto-repairman-handshaking-with-female-customer-workshop_637285-9789.jpg" }
+            ]}
+            cardTitle="What Our Customers Say"
+            cardTag="Trusted Reviews"
+            cardAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="social" data-section="social">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "Auto Insurance Co",        "Roadside Rescue",        "Locksmith Association",        "Auto Parts Pro",        "Fleet Logistics",        "Vehicle Care Network",        "Consumer Trust"]}
-      title="Trusted Partners"
-      description="Serving insurance providers and property managers throughout the area."
-    />
-  </div>
+        <div id="social" data-section="social">
+          <SocialProofOne
+            textboxLayout="default"
+            useInvertedBackground={false}
+            names={["Auto Insurance Co", "Roadside Rescue", "Locksmith Association", "Auto Parts Pro", "Fleet Logistics", "Vehicle Care Network", "Consumer Trust"]}
+            title="Trusted Partners"
+            description="Serving insurance providers and property managers throughout the area."
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "f1",          title: "How fast do you arrive?",          content: "We aim to reach you within 30 minutes or less on average."},
-        {
-          id: "f2",          title: "Are you cheaper than a dealership?",          content: "Yes, our services are typically 50% less than standard dealership rates."},
-        {
-          id: "f3",          title: "Do you work with fleet vehicles?",          content: "Absolutely, we specialize in providing locksmith partnerships for fleet managers."},
-      ]}
-      title="Frequently Asked Questions"
-      description="Answers to common concerns about our automotive locksmith services."
-      faqsAnimation="blur-reveal"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+          <FaqDouble
+            textboxLayout="default"
+            useInvertedBackground={false}
+            faqs={[
+              { id: "f1", title: "How fast do you arrive?", content: "We aim to reach you within 30 minutes or less on average." },
+              { id: "f2", title: "Are you cheaper than a dealership?", content: "Yes, our services are typically 50% less than standard dealership rates." },
+              { id: "f3", title: "Do you work with fleet vehicles?", content: "Absolutely, we specialize in providing locksmith partnerships for fleet managers." }
+            ]}
+            title="Frequently Asked Questions"
+            description="Answers to common concerns about our automotive locksmith services."
+            faqsAnimation="blur-reveal"
+          />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactSplit
-      useInvertedBackground={false}
-      background={{
-        variant: "radial-gradient"}}
-      tag="Contact Us"
-      title="Need Help Now?"
-      description="Call us or enter your email to get a quote and professional service today."
-      mediaAnimation="slide-up"
-      imageSrc="http://img.b2bpic.net/free-photo/male-car-mechanic-working-car-repair-shop_23-2150367551.jpg"
-      imageAlt="Emergency locksmith service"
-    />
-  </div>
+        <div id="contact" data-section="contact">
+          <ContactSplit
+            useInvertedBackground={false}
+            background={{ variant: "radial-gradient" }}
+            tag="Contact Us"
+            title="Need Help Now?"
+            description="Call us or enter your email to get a quote and professional service today."
+            mediaAnimation="slide-up"
+            imageSrc="http://img.b2bpic.net/free-photo/male-car-mechanic-working-car-repair-shop_23-2150367551.jpg"
+            imageAlt="Emergency locksmith service"
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBase
-      columns={[
-        {
-          title: "Company",          items: [
-            {
-              label: "About",              href: "#about"},
-            {
-              label: "Reviews",              href: "#reviews"},
-          ],
-        },
-        {
-          title: "Services",          items: [
-            {
-              label: "Ignition Repair",              href: "#services"},
-            {
-              label: "Fob Programming",              href: "#services"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms",              href: "#"},
-          ],
-        },
-      ]}
-      logoText="Locksmith 417"
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterBase
+            columns={[
+              { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Reviews", href: "#reviews" }] },
+              { title: "Services", items: [{ label: "Ignition Repair", href: "#services" }, { label: "Fob Programming", href: "#services" }] },
+              { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] }
+            ]}
+            logoText="Locksmith 417"
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file