src/app/page.tsx

@@ -2,10 +2,10 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqDouble from '@/components/sections/faq/FaqDouble';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import FooterCard from '@/components/sections/footer/FooterCard';
 import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
 import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
@@ -13,7 +13,7 @@ import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
-import { Sparkles } from "lucide-react";
+import { Sparkles, Facebook, Twitter, Instagram, Linkedin } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -205,7 +205,7 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqDouble
+      <FaqSplitMedia
       textboxLayout="default"
       useInvertedBackground={true}
       faqs={[
@@ -218,17 +218,24 @@ export default function LandingPage() {
         {
           id: "faq-4",          title: "What is your consultation process like?",          content: "Our process begins with a comprehensive consultation to understand your vision, preferences, and budget. We'll discuss design concepts, material options, and technical specifications to create a tailored plan."},
         {
-          id: "faq-5",          title: "Do you offer warranty on your work?",          content: "Yes, we stand behind the quality of our craftsmanship. All our work comes with a satisfaction guarantee and a specified warranty period, which will be detailed in your project agreement."},
+          id: "faq-5",          title: "Do you offer warranty on our work?",          content: "Yes, we stand behind the quality of our craftsmanship. All our work comes with a satisfaction guarantee and a specified warranty period, which will be detailed in your project agreement."}
       ]}
       title="Frequently Asked Questions"
       description="Find answers to common inquiries about our services, process, and what to expect when you choose RD CUSTOMS."
       tag="Questions Answered"
       faqsAnimation="slide-up"
+      imageSrc="http://img.b2bpic.net/free-photo/car-service-center-with-working-mechanics_23-2149021431.jpg"
+      imageAlt="Mechanics working in a car service center"
+      mediaPosition="right"
+      buttons={[
+        {
+          text: "Still have questions? Contact us!",          href: "#contact"}
+      ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCenter
+      <ContactSplit
       useInvertedBackground={false}
       background={{
         variant: "plain"}}
@@ -239,49 +246,34 @@ export default function LandingPage() {
       inputPlaceholder="Your Email Address"
       buttonText="Request a Consultation"
       termsText="By requesting a consultation, you agree to our privacy policy and terms of service."
+      imageSrc="http://img.b2bpic.net/free-photo/mechanic-fixing-car_23-2149179929.jpg"
+      imageAlt="Mechanic working on a car engine"
+      mediaPosition="left"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseCard
+      <FooterCard
       logoText="RD CUSTOMS"
-      columns={[
-        {
-          title: "Services",          items: [
-            {
-              label: "Performance Tuning",              href: "#services"},
-            {
-              label: "Interior Design",              href: "#services"},
-            {
-              label: "Paint & Finish",              href: "#services"},
-            {
-              label: "Advanced Detailing",              href: "#services"},
-          ],
-        },
-        {
-          title: "Company",          items: [
-            {
-              label: "About Us",              href: "#about"},
-            {
-              label: "Our Projects",              href: "#projects"},
-            {
-              label: "Client Testimonials",              href: "#testimonials"},
-            {
-              label: "Contact",              href: "#contact"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms of Service",              href: "#"},
-            {
-              label: "Disclaimer",              href: "#"},
-          ],
-        },
-      ]}
       copyrightText="© 2024 RD CUSTOMS. All rights reserved."
+      socialLinks={[
+        {
+          icon: Facebook,
+          href: "https://facebook.com/rdcustoms",          ariaLabel: "Facebook"
+        },
+        {
+          icon: Twitter,
+          href: "https://twitter.com/rdcustoms",          ariaLabel: "Twitter"
+        },
+        {
+          icon: Instagram,
+          href: "https://instagram.com/rdcustoms",          ariaLabel: "Instagram"
+        },
+        {
+          icon: Linkedin,
+          href: "https://linkedin.com/company/rdcustoms",          ariaLabel: "LinkedIn"
+        }
+      ]}
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f5f5;
-  --card: #ffffff;
-  --foreground: #1c1c1c;
-  --primary-cta: #1f3251;
-  --primary-cta-text: #f5f5f5;
-  --secondary-cta: #ffffff;
-  --secondary-cta-text: #1c1c1c;
-  --accent: #15479c;
-  --background-accent: #a8cce8;
+  --background: #ffffff;
+  --card: #f9f9f9;
+  --foreground: #120a00e6;
+  --primary-cta: #E34400;
+  --primary-cta-text: #ffffff;
+  --secondary-cta: #f9f9f9;
+  --secondary-cta-text: #120a00e6;
+  --accent: #e2e2e2;
+  --background-accent: #E34400;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);