Update src/app/styles/variables.css

src/app/page.tsx

@@ -2,16 +2,16 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
-import FooterCard from '@/components/sections/footer/FooterCard';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
 import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
-import { Instagram } from "lucide-react";
+import { Instagram, MapPin, Phone, Mail } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -32,21 +32,13 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
+          name: "Home",          id: "#home"},
-          id: "#home",
-        },
         {
-          name: "Services",
+          name: "Services",          id: "#services"},
-          id: "#services",
-        },
         {
-          name: "Testimonials",
+          name: "Testimonials",          id: "#testimonials"},
-          id: "#testimonials",
-        },
         {
-          name: "Contact",
+          name: "Contact",          id: "#contact"},
-          id: "#contact",
-        },
       ]}
       brandName="Smoke'em Customs"
     />
@@ -56,97 +48,54 @@ export default function LandingPage() {
       <HeroBillboardTestimonial
       useInvertedBackground={false}
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       title="Precision Performance Engineering"
       description="Experience top-tier automotive care at Smoke'em Customs. We combine expert craftsmanship with state-of-the-art diagnostic technology to keep your luxury vehicle in peak condition."
       testimonials={[
         {
-          name: "Vaibhav Kanojia",
+          name: "Vaibhav Kanojia",          handle: "@vaibhav",          testimonial: "Awesome service, best prices and top notch quality.",          rating: 5,
-          handle: "@vaibhav",
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-middle-aged-man-with-beard-hairstyle-dressed-elegant-formal-suit-textured-dark-background-studio_613910-19887.jpg"},
-          testimonial: "Awesome service, best prices and top notch quality.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-middle-aged-man-with-beard-hairstyle-dressed-elegant-formal-suit-textured-dark-background-studio_613910-19887.jpg",
-        },
         {
-          name: "Pulkit Rohatgi",
+          name: "Pulkit Rohatgi",          handle: "@pulkit",          testimonial: "SmokEm is one best service provider for cars at reasonable rates.",          rating: 5,
-          handle: "@pulkit",
+          imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-confident-business-leader_1262-4808.jpg"},
-          testimonial: "SmokEm is one best service provider for cars at reasonable rates.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-confident-business-leader_1262-4808.jpg",
-        },
         {
-          name: "Trivesh Mehlawat",
+          name: "Trivesh Mehlawat",          handle: "@trivesh",          testimonial: "The staff is humble and expert in their skills.",          rating: 5,
-          handle: "@trivesh",
+          imageSrc: "http://img.b2bpic.net/free-photo/cute-young-woman-cabriolet-car_624325-2339.jpg"},
-          testimonial: "The staff is humble and expert in their skills.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/cute-young-woman-cabriolet-car_624325-2339.jpg",
-        },
         {
-          name: "Amit Sharma",
+          name: "Amit Sharma",          handle: "@amit",          testimonial: "Premium service for my luxury ride, completely satisfied.",          rating: 5,
-          handle: "@amit",
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-macho-male-dressed-suit-dark-grey-background_613910-9486.jpg"},
-          testimonial: "Premium service for my luxury ride, completely satisfied.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-macho-male-dressed-suit-dark-grey-background_613910-9486.jpg",
-        },
         {
-          name: "Rahul Verma",
+          name: "Rahul Verma",          handle: "@rahul",          testimonial: "The attention to detail here is unmatched in the city.",          rating: 5,
-          handle: "@rahul",
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-male-with-curly-hair-dressed-jacket-eyeglasses_613910-567.jpg"},
-          testimonial: "The attention to detail here is unmatched in the city.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-male-with-curly-hair-dressed-jacket-eyeglasses_613910-567.jpg",
-        },
       ]}
       buttons={[
         {
-          text: "Book Service",
+          text: "Book Service",          href: "#contact"},
-          href: "#contact",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/auto-mechanic-crossing-hands_23-2147897805.jpg"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-photographer-wearing-classic-suit-holding-retro-camera-standing-with-his-arms-crossed_613910-19282.jpg",
+          src: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-photographer-wearing-classic-suit-holding-retro-camera-standing-with-his-arms-crossed_613910-19282.jpg",          alt: "Customer"},
-          alt: "Customer",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/serious-beautiful-businesswoman-standing-window_1262-1913.jpg",
+          src: "http://img.b2bpic.net/free-photo/serious-beautiful-businesswoman-standing-window_1262-1913.jpg",          alt: "Customer"},
-          alt: "Customer",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1665.jpg",
+          src: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1665.jpg",          alt: "Customer"},
-          alt: "Customer",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/friendly-successful-business-woman-posing-with-arms-crossed_74855-2813.jpg",
+          src: "http://img.b2bpic.net/free-photo/friendly-successful-business-woman-posing-with-arms-crossed_74855-2813.jpg",          alt: "Customer"},
-          alt: "Customer",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg",
+          src: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg",          alt: "Customer"},
-          alt: "Customer",
-        },
       ]}
       marqueeItems={[
         {
-          type: "text",
+          type: "text",          text: "Premium Detailing"},
-          text: "Premium Detailing",
-        },
         {
-          type: "text",
+          type: "text",          text: "Performance Tuning"},
-          text: "Performance Tuning",
-        },
         {
-          type: "text",
+          type: "text",          text: "Engine diagnostics"},
-          text: "Engine diagnostics",
-        },
         {
-          type: "text",
+          type: "text",          text: "Suspension Work"},
-          text: "Suspension Work",
-        },
         {
-          type: "text",
+          type: "text",          text: "Ceramic Coating"},
-          text: "Ceramic Coating",
-        },
       ]}
     />
   </div>
@@ -156,18 +105,11 @@ export default function LandingPage() {
       useInvertedBackground={true}
       heading={[
         {
-          type: "text",
+          type: "text",          content: "Mastering the Art of "},
-          content: "Mastering the Art of ",
-        },
         {
-          type: "image",
+          type: "image",          src: "http://img.b2bpic.net/free-photo/auto-mechanic-opening-radiator-cap-while-repairing-car-repair-workshop_637285-4223.jpg",          alt: "Car Engine"},
-          src: "http://img.b2bpic.net/free-photo/auto-mechanic-opening-radiator-cap-while-repairing-car-repair-workshop_637285-4223.jpg",
-          alt: "Car Engine",
-        },
         {
-          type: "text",
+          type: "text",          content: " Automotive Excellence"},
-          content: " Automotive Excellence",
-        },
       ]}
     />
   </div>
@@ -179,29 +121,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "s1",
+          id: "s1",          title: "Advanced Tuning",          descriptions: [
-          title: "Advanced Tuning",
+            "Custom engine tuning and mapping."],
-          descriptions: [
+          imageSrc: "http://img.b2bpic.net/free-photo/empty-dark-room-modern-futuristic-sci-fi-background-3d-illustration_35913-2347.jpg"},
-            "Custom engine tuning and mapping.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-dark-room-modern-futuristic-sci-fi-background-3d-illustration_35913-2347.jpg",
-        },
         {
-          id: "s2",
+          id: "s2",          title: "Premium Detailing",          descriptions: [
-          title: "Premium Detailing",
+            "Ceramic coating and interior rejuvenation."],
-          descriptions: [
+          imageSrc: "http://img.b2bpic.net/free-photo/man-helmet-setting-glass-down_23-2147779109.jpg"},
-            "Ceramic coating and interior rejuvenation.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/man-helmet-setting-glass-down_23-2147779109.jpg",
-        },
         {
-          id: "s3",
+          id: "s3",          title: "Mechanical Tuning",          descriptions: [
-          title: "Mechanical Tuning",
+            "Suspension tuning and part upgrades."],
-          descriptions: [
+          imageSrc: "http://img.b2bpic.net/free-photo/top-view-many-tools_23-2147773434.jpg"},
-            "Suspension tuning and part upgrades.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-many-tools_23-2147773434.jpg",
-        },
       ]}
       title="Comprehensive Luxury Care"
       description="Tailored performance solutions for your high-end vehicle."
@@ -213,14 +143,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       names={[
-        "AutoTech",
+        "AutoTech",        "PerformancePro",        "LuxDrive",        "ShiftMaster",        "EngineHub",        "PeakPerform",        "DriveElite"]}
-        "PerformancePro",
-        "LuxDrive",
-        "ShiftMaster",
-        "EngineHub",
-        "PeakPerform",
-        "DriveElite",
-      ]}
       title="Trusted by Automotive Industry Leaders"
       description="We maintain the highest standards recognized across the industry."
     />
@@ -233,40 +156,15 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "1",
+          id: "1",          name: "Sarah J.",          handle: "@sarah",          testimonial: "Truly professional and high quality.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-customer-car-dealership_23-2149117120.jpg"},
-          name: "Sarah J.",
-          handle: "@sarah",
-          testimonial: "Truly professional and high quality.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-customer-car-dealership_23-2149117120.jpg",
-        },
         {
-          id: "2",
+          id: "2",          name: "Michael C.",          handle: "@michael",          testimonial: "Best in class service in New Delhi.",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg"},
-          name: "Michael C.",
-          handle: "@michael",
-          testimonial: "Best in class service in New Delhi.",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg",
-        },
         {
-          id: "3",
+          id: "3",          name: "Emily R.",          handle: "@emily",          testimonial: "Exceptional attention to detail.",          imageSrc: "http://img.b2bpic.net/free-photo/person-taking-care-electric-car_23-2149362816.jpg"},
-          name: "Emily R.",
-          handle: "@emily",
-          testimonial: "Exceptional attention to detail.",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-taking-care-electric-car_23-2149362816.jpg",
-        },
         {
-          id: "4",
+          id: "4",          name: "David K.",          handle: "@david",          testimonial: "Reliable experts, highly recommended.",          imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915137.jpg"},
-          name: "David K.",
-          handle: "@david",
-          testimonial: "Reliable experts, highly recommended.",
-          imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915137.jpg",
-        },
         {
-          id: "5",
+          id: "5",          name: "Alice M.",          handle: "@alice",          testimonial: "My car feels like brand new.",          imageSrc: "http://img.b2bpic.net/free-photo/woman-working-backseat-car_23-2148155086.jpg"},
-          name: "Alice M.",
-          handle: "@alice",
-          testimonial: "My car feels like brand new.",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-working-backseat-car_23-2148155086.jpg",
-        },
       ]}
       title="Client Success Stories"
       description="Hear what our premium clients have to say."
@@ -279,20 +177,11 @@ export default function LandingPage() {
       useInvertedBackground={true}
       faqs={[
         {
-          id: "q1",
+          id: "q1",          title: "Do you handle all luxury cars?",          content: "Yes, we specialize in high-end vehicle diagnostics and tune-ups."},
-          title: "Do you handle all luxury cars?",
-          content: "Yes, we specialize in high-end vehicle diagnostics and tune-ups.",
-        },
         {
-          id: "q2",
+          id: "q2",          title: "How can I book an appointment?",          content: "Use the contact form below or call us directly."},
-          title: "How can I book an appointment?",
-          content: "Use the contact form below or call us directly.",
-        },
         {
-          id: "q3",
+          id: "q3",          title: "What payment methods do you accept?",          content: "We accept all major credit cards and digital payments."},
-          title: "What payment methods do you accept?",
-          content: "We accept all major credit cards and digital payments.",
-        },
       ]}
       title="Frequently Asked Questions"
       description="Quick answers to common questions about our services."
@@ -301,47 +190,37 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplitForm
+      <ContactCTA
-      useInvertedBackground={false}
+      tag="Exclusive Booking"
-      title="Get in Touch"
+      title="Elevate Your Driving Experience"
-      description="Schedule your next service appointment today."
+      description="Book your luxury consultation today and get the premium care your vehicle deserves."
-      inputs={[
+      buttons={[
-        {
+        { text: "Schedule Appointment", href: "#contact" }
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Your Email",
-        },
-        {
-          name: "car",
-          type: "text",
-          placeholder: "Your Vehicle Model",
-        },
       ]}
-      textarea={{
+      background={{ variant: "sparkles-gradient" }}
-        name: "message",
+      useInvertedBackground={true}
-        placeholder: "Describe your requirements...",
-        rows: 4,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/darkly-atmospheric-retail-environment-rendering_23-2151153786.jpg"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterCard
+      <FooterMedia
       logoText="Smoke'em Customs"
-      copyrightText="© 2025 Smoke'em Customs. All rights reserved."
+      imageSrc="http://img.b2bpic.net/free-photo/darkly-atmospheric-retail-environment-rendering_23-2151153786.jpg"
-      socialLinks={[
+      columns={[
         {
-          icon: Instagram,
+          title: "Company",          items: [
-          href: "https://instagram.com",
+            { label: "About Us", href: "/about" },
-          ariaLabel: "Instagram",
+            { label: "Careers", href: "/careers" },
+          ]
         },
+        {
+          title: "Contact",          items: [
+            { label: "123 Luxury Lane, New Delhi", href: "#" },
+            { label: "+91 999 999 9999", href: "tel:+919999999999" },
+          ]
+        }
       ]}
+      copyrightText="© 2025 Smoke'em Customs. All rights reserved."
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
+  --background: #0a0a0a;
-  --card: #0c0c0c;
+  --card: #141414;
-  --foreground: #ffffff;
+  --foreground: #f5f5f5;
-  --primary-cta: #106EFB;
+  --primary-cta: #d4af37;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #000000;
+  --secondary-cta: #1c1c1c;
   --secondary-cta-text: #ffffff;
-  --accent: #535353;
+  --accent: #b8860b;
-  --background-accent: #106EFB;
+  --background-accent: #262626;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);