Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -2,17 +2,17 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import FaqDouble from '@/components/sections/faq/FaqDouble';
+import FaqBase from "@/components/sections/faq/FaqBase";
-import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
+import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterBase from "@/components/sections/footer/FooterBase";
-import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
+import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
-import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
-import SplitAbout from '@/components/sections/about/SplitAbout';
+import SplitAbout from "@/components/sections/about/SplitAbout";
-import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
+import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
 import { Award, Sparkles, Star, TrendingUp, Users } from "lucide-react";
 
 export default function LandingPage() {
@@ -25,8 +25,8 @@ export default function LandingPage() {
         sizing="mediumLargeSizeMediumTitles"
         background="fluid"
         cardStyle="inset"
-        primaryButtonStyle="shadow"
+        primaryButtonStyle="radial-glow"
-        secondaryButtonStyle="layered"
+        secondaryButtonStyle="solid"
         headingFontWeight="extrabold"
     >
       <ReactLenis root>
@@ -34,134 +34,41 @@ export default function LandingPage() {
       <NavbarLayoutFloatingInline
       navItems={[
         {
-          name: "Home",
+          name: "Home",          id: "#home"},
-          id: "#home",
-        },
         {
-          name: "About",
+          name: "About",          id: "#about"},
-          id: "#about",
-        },
         {
-          name: "Services",
+          name: "Services",          id: "#services"},
-          id: "#services",
-        },
         {
-          name: "Results",
+          name: "Results",          id: "#results"},
-          id: "#results",
-        },
         {
-          name: "Clients",
+          name: "Clients",          id: "#clients"},
-          id: "#clients",
-        },
         {
-          name: "Testimonials",
+          name: "Testimonials",          id: "#testimonials"},
-          id: "#testimonials",
-        },
         {
-          name: "Pricing",
+          name: "Pricing",          id: "#pricing"},
-          id: "#pricing",
-        },
         {
-          name: "FAQ",
+          name: "FAQ",          id: "#faq"},
-          id: "#faq",
-        },
         {
-          name: "Contact",
+          name: "Contact",          id: "#contact"},
-          id: "#contact",
-        },
       ]}
       brandName="JLW Web Design"
       button={{
-        text: "Get Started",
+        text: "Get Started",        href: "#contact"}}
-        href: "#contact",
-      }}
     />
   </div>
 
   <div id="home" data-section="home">
-      <HeroOverlayTestimonial
+      <HeroBillboardScroll
       title="Crafting Digital Experiences That Convert"
       description="JLW Web Design specializes in creating stunning, high-performance websites tailored to your business goals. We build more than just websites; we build growth engines."
-      testimonials={[
-        {
-          name: "Sarah Johnson",
-          handle: "@sj_techsolutions",
-          testimonial: "JLW Web Design transformed our online presence. The new website is not only visually stunning but also incredibly intuitive and has significantly boosted our lead generation.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/pretty-business-woman-standing-with-coffee-cup_23-2148095743.jpg",
-          imageAlt: "Sarah Johnson",
-        },
-        {
-          name: "Michael Chen",
-          handle: "@michaelc_innovate",
-          testimonial: "Working with JLW was a game-changer. Their attention to detail and commitment to understanding our brand truly shone through in the final product. Highly recommend!",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/successful-male-manager-leaning-railings_1262-3653.jpg",
-          imageAlt: "Michael Chen",
-        },
-        {
-          name: "Emily Rodriguez",
-          handle: "@emilyr_marketing",
-          testimonial: "Our new e-commerce platform developed by JLW is fantastic! It's fast, secure, and has greatly improved our customer's shopping experience, leading to higher sales.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-dark-jacket-pink-background_179666-14222.jpg",
-          imageAlt: "Emily Rodriguez",
-        },
-        {
-          name: "David Kim",
-          handle: "@davidk_enterprise",
-          testimonial: "The team at JLW delivered an exceptional corporate website. Their professionalism and technical expertise were evident at every stage of the project.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",
-          imageAlt: "David Kim",
-        },
-        {
-          name: "Jessica Lee",
-          handle: "@jessical_growth",
-          testimonial: "JLW made our complex vision a reality with a beautifully designed and highly functional website. Their support post-launch has also been invaluable.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-bearded-male-wearing-stylish-sui_613910-12116.jpg",
-          imageAlt: "Jessica Lee",
-        },
-      ]}
-      testimonialRotationInterval={5000}
       buttons={[
         {
-          text: "View Our Portfolio",
+          text: "View Our Portfolio",          href: "#portfolio"},
-          href: "#portfolio",
-        },
         {
-          text: "Get a Free Quote",
+          text: "Get a Free Quote",          href: "#contact"},
-          href: "#contact",
-        },
       ]}
-      avatars={[
+      background={{ variant: 'sparkles-gradient' }}
-        {
-          src: "http://img.b2bpic.net/free-photo/big-eyed-character-face-design_53876-75089.jpg",
-          alt: "Client Avatar 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-sensual-blond-female-black-dress_613910-14355.jpg",
-          alt: "Client Avatar 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg",
-          alt: "Client Avatar 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-vector/users-set-circle-square_78370-10025.jpg",
-          alt: "Client Avatar 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/happy-cartoon-yak-faces_1308-166652.jpg",
-          alt: "Happy Cartoon Yak Faces",
-        },
-      ]}
-      avatarText="Trusted by 100+ businesses"
-      imageSrc="http://img.b2bpic.net/free-photo/aerial-view-website-content-layout-design-illustraion-notebook_53876-167124.jpg"
-      imageAlt="Modern web design studio showing a sleek website interface"
-      showBlur={true}
-      textPosition="bottom"
     />
   </div>
 
@@ -173,17 +80,11 @@ export default function LandingPage() {
       description="At JLW Web Design, we believe every business deserves an online presence that truly reflects its unique identity and drives measurable results. Our dedicated team combines artistic flair with technical expertise to deliver websites that don't just look good, but perform exceptionally."
       bulletPoints={[
         {
-          title: "Client-Centric Approach",
+          title: "Client-Centric Approach",          description: "Your vision is our blueprint. We listen, strategize, and collaborate closely to bring your ideas to life with precision and passion."},
-          description: "Your vision is our blueprint. We listen, strategize, and collaborate closely to bring your ideas to life with precision and passion.",
-        },
         {
-          title: "Cutting-Edge Technologies",
+          title: "Cutting-Edge Technologies",          description: "We leverage the latest web technologies and industry best practices to build secure, scalable, and high-performance digital platforms."},
-          description: "We leverage the latest web technologies and industry best practices to build secure, scalable, and high-performance digital platforms.",
-        },
         {
-          title: "Results-Driven Design",
+          title: "Results-Driven Design",          description: "Our focus isn't just on aesthetics; it's on crafting websites that convert visitors into customers and help you achieve your business objectives."},
-          description: "Our focus isn't just on aesthetics; it's on crafting websites that convert visitors into customers and help you achieve your business objectives.",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/group-young-businesspeople-meeting-office_171337-7269.jpg"
       imageAlt="Diverse team collaborating on web design project"
@@ -198,53 +99,21 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "f1",
+          id: "f1",          title: "Responsive Web Design",          author: "JLW Web Design",          description: "Ensure your website looks and functions perfectly on any device, from desktops to smartphones, providing an optimal user experience everywhere.",          tags: [
-          title: "Responsive Web Design",
+            "Mobile-First",            "UX/UI"],
-          author: "JLW Web Design",
+          imageSrc: "http://img.b2bpic.net/free-photo/modern-office-desk-composition-with-technological-device_23-2147916743.jpg",          imageAlt: "Website adapting to different screen sizes"},
-          description: "Ensure your website looks and functions perfectly on any device, from desktops to smartphones, providing an optimal user experience everywhere.",
-          tags: [
-            "Mobile-First",
-            "UX/UI",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/modern-office-desk-composition-with-technological-device_23-2147916743.jpg",
-          imageAlt: "Website adapting to different screen sizes",
-        },
         {
-          id: "f2",
+          id: "f2",          title: "Custom Web Development",          author: "JLW Web Design",          description: "From complex web applications to unique interactive experiences, we build bespoke solutions tailored specifically to your business needs and goals.",          tags: [
-          title: "Custom Web Development",
+            "Tailored Solutions",            "Scalability"],
-          author: "JLW Web Design",
+          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-background-with-low-poly-plexus-design_1048-13423.jpg",          imageAlt: "Abstract representation of custom code and web structure"},
-          description: "From complex web applications to unique interactive experiences, we build bespoke solutions tailored specifically to your business needs and goals.",
-          tags: [
-            "Tailored Solutions",
-            "Scalability",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-background-with-low-poly-plexus-design_1048-13423.jpg",
-          imageAlt: "Abstract representation of custom code and web structure",
-        },
         {
-          id: "f3",
+          id: "f3",          title: "E-commerce Solutions",          author: "JLW Web Design",          description: "Launch or upgrade your online store with powerful, secure, and user-friendly e-commerce platforms designed to maximize your sales and streamline operations.",          tags: [
-          title: "E-commerce Solutions",
+            "Online Store",            "Secure Payments"],
-          author: "JLW Web Design",
+          imageSrc: "http://img.b2bpic.net/free-photo/small-shopping-cart-present-near-paper-laptop_23-2148015443.jpg",          imageAlt: "E-commerce website on a laptop screen"},
-          description: "Launch or upgrade your online store with powerful, secure, and user-friendly e-commerce platforms designed to maximize your sales and streamline operations.",
-          tags: [
-            "Online Store",
-            "Secure Payments",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/small-shopping-cart-present-near-paper-laptop_23-2148015443.jpg",
-          imageAlt: "E-commerce website on a laptop screen",
-        },
         {
-          id: "f4",
+          id: "f4",          title: "SEO Optimization",          author: "JLW Web Design",          description: "Improve your search engine rankings and increase organic traffic with our expert SEO strategies integrated directly into your website's design and content.",          tags: [
-          title: "SEO Optimization",
+            "Visibility",            "Traffic Growth"],
-          author: "JLW Web Design",
+          imageSrc: "http://img.b2bpic.net/free-photo/keyword-seo-content-website-tags-search_53876-138495.jpg",          imageAlt: "Magnifying glass over search engine results"},
-          description: "Improve your search engine rankings and increase organic traffic with our expert SEO strategies integrated directly into your website's design and content.",
-          tags: [
-            "Visibility",
-            "Traffic Growth",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/keyword-seo-content-website-tags-search_53876-138495.jpg",
-          imageAlt: "Magnifying glass over search engine results",
-        },
       ]}
       title="Our Core Web Design Services"
       description="From stunning aesthetics to seamless user experiences, we offer a comprehensive suite of services to elevate your digital footprint and achieve your online goals."
@@ -258,23 +127,14 @@ export default function LandingPage() {
       useInvertedBackground={true}
       metrics={[
         {
-          id: "m1",
+          id: "m1",          icon: Sparkles,
-          icon: Sparkles,
+          title: "Projects Completed",          value: "500+"},
-          title: "Projects Completed",
-          value: "500+",
-        },
         {
-          id: "m2",
+          id: "m2",          icon: Users,
-          icon: Users,
+          title: "Client Satisfaction",          value: "98%"},
-          title: "Client Satisfaction",
-          value: "98%",
-        },
         {
-          id: "m3",
+          id: "m3",          icon: TrendingUp,
-          icon: TrendingUp,
+          title: "Average ROI Increase",          value: "200%"},
-          title: "Average ROI Increase",
-          value: "200%",
-        },
       ]}
       title="Proven Results & Client Success"
       description="Our commitment to excellence drives tangible outcomes, helping businesses like yours thrive in the digital landscape."
@@ -286,16 +146,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       names={[
-        "GlobalTech Solutions",
+        "GlobalTech Solutions",        "Innovate Ventures",        "Summit Consulting Group",        "Elevate Digital",        "Dynamic Enterprises",        "Future Forward Systems",        "Pioneer Media",        "Apex Innovations",        "Nexus Brands"]}
-        "Innovate Ventures",
-        "Summit Consulting Group",
-        "Elevate Digital",
-        "Dynamic Enterprises",
-        "Future Forward Systems",
-        "Pioneer Media",
-        "Apex Innovations",
-        "Nexus Brands",
-      ]}
       title="Trusted by Industry Leaders & Growing Businesses"
       description="Our diverse portfolio includes partnerships with innovative startups and established enterprises, all benefiting from our tailored web solutions."
     />
@@ -308,45 +159,15 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "t1",
+          id: "t1",          name: "Olivia Smith",          role: "CEO, Startup Forge",          testimonial: "JLW Web Design not only delivered a stunning website but also exceeded our expectations in terms of functionality and user experience. Their team is truly top-notch!",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67170.jpg",          imageAlt: "Olivia Smith"},
-          name: "Olivia Smith",
-          role: "CEO, Startup Forge",
-          testimonial: "JLW Web Design not only delivered a stunning website but also exceeded our expectations in terms of functionality and user experience. Their team is truly top-notch!",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67170.jpg",
-          imageAlt: "Olivia Smith",
-        },
         {
-          id: "t2",
+          id: "t2",          name: "Benjamin Carter",          role: "Founder, Evolve Digital",          testimonial: "The conversion rates on our new site have skyrocketed since JLW redesigned it. They understood our goals perfectly and implemented strategies that delivered real ROI.",          imageSrc: "http://img.b2bpic.net/free-photo/young-manager-texting-message-outdoors_1262-7351.jpg",          imageAlt: "Benjamin Carter"},
-          name: "Benjamin Carter",
-          role: "Founder, Evolve Digital",
-          testimonial: "The conversion rates on our new site have skyrocketed since JLW redesigned it. They understood our goals perfectly and implemented strategies that delivered real ROI.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-manager-texting-message-outdoors_1262-7351.jpg",
-          imageAlt: "Benjamin Carter",
-        },
         {
-          id: "t3",
+          id: "t3",          name: "Sophia Miller",          role: "Marketing Director, Aura Health",          testimonial: "Their dedication to detail and creative problem-solving made the entire process seamless. We now have a website that truly represents our brand's values.",          imageSrc: "http://img.b2bpic.net/free-photo/man-holding-laptop-looking-camera_23-2148230143.jpg",          imageAlt: "Sophia Miller"},
-          name: "Sophia Miller",
-          role: "Marketing Director, Aura Health",
-          testimonial: "Their dedication to detail and creative problem-solving made the entire process seamless. We now have a website that truly represents our brand's values.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-holding-laptop-looking-camera_23-2148230143.jpg",
-          imageAlt: "Sophia Miller",
-        },
         {
-          id: "t4",
+          id: "t4",          name: "Daniel Wilson",          role: "CTO, Quantum Solutions",          testimonial: "Technically brilliant and aesthetically pleasing – JLW Web Design delivered a robust platform that handles our high traffic with ease. Fantastic work!",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-viewer-changing-channels-television-set-with-remote-control_482257-92306.jpg",          imageAlt: "Daniel Wilson"},
-          name: "Daniel Wilson",
-          role: "CTO, Quantum Solutions",
-          testimonial: "Technically brilliant and aesthetically pleasing – JLW Web Design delivered a robust platform that handles our high traffic with ease. Fantastic work!",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-viewer-changing-channels-television-set-with-remote-control_482257-92306.jpg",
-          imageAlt: "Daniel Wilson",
-        },
         {
-          id: "t5",
+          id: "t5",          name: "Ava Thompson",          role: "Owner, Bloom Florals",          testimonial: "Our e-commerce site needed a major overhaul, and JLW delivered beyond imagination. It's beautiful, fast, and incredibly easy for our customers to use.",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2150312849.jpg",          imageAlt: "Ava Thompson"},
-          name: "Ava Thompson",
-          role: "Owner, Bloom Florals",
-          testimonial: "Our e-commerce site needed a major overhaul, and JLW delivered beyond imagination. It's beautiful, fast, and incredibly easy for our customers to use.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2150312849.jpg",
-          imageAlt: "Ava Thompson",
-        },
       ]}
       title="What Our Clients Say About Us"
       description="Hear directly from businesses that have experienced significant growth and success with JLW Web Design's tailored solutions."
@@ -360,61 +181,31 @@ export default function LandingPage() {
       useInvertedBackground={false}
       plans={[
         {
-          id: "starter",
+          id: "starter",          badge: "Essentials",          badgeIcon: Sparkles,
-          badge: "Essentials",
+          price: "$1,499",          subtitle: "For new businesses taking their first step online.",          buttons: [
-          badgeIcon: Sparkles,
-          price: "$1,499",
-          subtitle: "For new businesses taking their first step online.",
-          buttons: [
             {
-              text: "Get Started",
+              text: "Get Started",              href: "#contact"},
-              href: "#contact",
-            },
           ],
           features: [
-            "5-page custom website",
+            "5-page custom website",            "Responsive design",            "Basic SEO setup",            "1-month support"],
-            "Responsive design",
-            "Basic SEO setup",
-            "1-month support",
-          ],
         },
         {
-          id: "professional",
+          id: "professional",          badge: "Popular",          badgeIcon: Star,
-          badge: "Popular",
+          price: "$3,999",          subtitle: "Ideal for growing businesses needing a robust online presence.",          buttons: [
-          badgeIcon: Star,
-          price: "$3,999",
-          subtitle: "Ideal for growing businesses needing a robust online presence.",
-          buttons: [
             {
-              text: "Choose Plan",
+              text: "Choose Plan",              href: "#contact"},
-              href: "#contact",
-            },
           ],
           features: [
-            "10-page custom website",
+            "10-page custom website",            "Advanced SEO optimization",            "E-commerce integration",            "3-month priority support"],
-            "Advanced SEO optimization",
-            "E-commerce integration",
-            "3-month priority support",
-          ],
         },
         {
-          id: "enterprise",
+          id: "enterprise",          badge: "Premium",          badgeIcon: Award,
-          badge: "Premium",
+          price: "Custom Quote",          subtitle: "Tailored solutions for large-scale operations and unique needs.",          buttons: [
-          badgeIcon: Award,
-          price: "Custom Quote",
-          subtitle: "Tailored solutions for large-scale operations and unique needs.",
-          buttons: [
             {
-              text: "Contact Us",
+              text: "Contact Us",              href: "#contact"},
-              href: "#contact",
-            },
           ],
           features: [
-            "Unlimited pages & features",
+            "Unlimited pages & features",            "Comprehensive SEO & marketing",            "Custom web application development",            "Dedicated account manager & support"],
-            "Comprehensive SEO & marketing",
-            "Custom web application development",
-            "Dedicated account manager & support",
-          ],
         },
       ]}
       title="Flexible Pricing for Every Vision"
@@ -423,128 +214,81 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqDouble
+      <FaqBase
       textboxLayout="default"
       useInvertedBackground={true}
       faqs={[
         {
-          id: "faq1",
+          id: "faq1",          title: "What is the typical timeline for a website project?",          content: "The timeline varies depending on the complexity and scope of the project. A standard 5-page website typically takes 4-6 weeks, while more complex sites with custom features can take 8-12+ weeks. We'll provide a detailed timeline after our initial consultation."},
-          title: "What is the typical timeline for a website project?",
-          content: "The timeline varies depending on the complexity and scope of the project. A standard 5-page website typically takes 4-6 weeks, while more complex sites with custom features can take 8-12+ weeks. We'll provide a detailed timeline after our initial consultation.",
-        },
         {
-          id: "faq2",
+          id: "faq2",          title: "Do you provide website maintenance and support?",          content: "Yes, we offer various maintenance and support packages to keep your website secure, updated, and performing optimally. These can include regular backups, security monitoring, content updates, and technical support."},
-          title: "Do you provide website maintenance and support?",
-          content: "Yes, we offer various maintenance and support packages to keep your website secure, updated, and performing optimally. These can include regular backups, security monitoring, content updates, and technical support.",
-        },
         {
-          id: "faq3",
+          id: "faq3",          title: "Can you help with website content and imagery?",          content: "Absolutely! We can assist with content strategy, copywriting, and sourcing high-quality imagery or custom graphics to ensure your website is not only beautiful but also effective and engaging."},
-          title: "Can you help with website content and imagery?",
-          content: "Absolutely! We can assist with content strategy, copywriting, and sourcing high-quality imagery or custom graphics to ensure your website is not only beautiful but also effective and engaging.",
-        },
         {
-          id: "faq4",
+          id: "faq4",          title: "What platforms do you specialize in?",          content: "We primarily work with modern web technologies such as Next.js, React, Node.js, and leading CMS platforms like WordPress or headless CMS solutions, depending on your project's specific needs and scalability requirements."},
-          title: "What platforms do you specialize in?",
-          content: "We primarily work with modern web technologies such as Next.js, React, Node.js, and leading CMS platforms like WordPress or headless CMS solutions, depending on your project's specific needs and scalability requirements.",
-        },
         {
-          id: "faq5",
+          id: "faq5",          title: "Is my website mobile-friendly and responsive?",          content: "All websites we build are designed with a mobile-first approach, ensuring they are fully responsive and provide an excellent user experience across all devices, including desktops, tablets, and smartphones."},
-          title: "Is my website mobile-friendly and responsive?",
-          content: "All websites we build are designed with a mobile-first approach, ensuring they are fully responsive and provide an excellent user experience across all devices, including desktops, tablets, and smartphones.",
-        },
         {
-          id: "faq6",
+          id: "faq6",          title: "How do payments work for a web design project?",          content: "Typically, we require an upfront deposit (e.g., 50%) to commence the project, with subsequent payments staggered at key milestones. The final payment is due upon project completion and client approval."},
-          title: "How do payments work for a web design project?",
-          content: "Typically, we require an upfront deposit (e.g., 50%) to commence the project, with subsequent payments staggered at key milestones. The final payment is due upon project completion and client approval.",
-        },
       ]}
       title="Frequently Asked Questions"
       description="Find quick answers to common questions about our web design process, services, and how we help businesses succeed online."
       faqsAnimation="slide-up"
+      showCard={true}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactText
+      <ContactSplitForm
-      useInvertedBackground={false}
+      title="Let's Build Your Digital Success Story"
-      background={{
+      description="Reach out to discuss your project. Our team is ready to provide expert insights and a tailored strategy to achieve your online goals."
-        variant: "radial-gradient",
+      inputs={[
-      }}
+        { name: "name", type: "text", placeholder: "Your Name", required: true },
-      text="Ready to transform your online presence and unlock new growth opportunities? Let's build something amazing together."
+        { name: "email", type: "email", placeholder: "Your Email", required: true },
-      buttons={[
+        { name: "subject", type: "text", placeholder: "Subject (Optional)" },
-        {
-          text: "Start Your Project",
-          href: "#",
-        },
-        {
-          text: "Schedule a Consultation",
-          href: "#",
-        },
       ]}
+      textarea={{
+        name: "message",        placeholder: "Your Message",        rows: 5,
+        required: true,
+      }}
+      buttonText="Send Message"
+      onSubmit={() => console.log('Form submitted!')}
+      useInvertedBackground={false}
+      imageSrc="http://img.b2bpic.net/free-photo/diverse-group-colleagues-discussing-project_23-2148496417.jpg"
+      imageAlt="Diverse team collaborating on a project"
+      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterBase
+      logoText="JLW Web Design"
+      copyrightText="© 2025 JLW Web Design. All rights reserved."
       columns={[
         {
-          items: [
+          title: "Company",          items: [
-            {
+            { label: "About Us", href: "#about" },
-              label: "About Us",
+            { label: "Our Process", href: "#services" },
-              href: "#about",
+            { label: "Client Success", href: "#testimonials" },
-            },
+            { label: "Contact", href: "#contact" },
-            {
-              label: "Our Process",
-              href: "#services",
-            },
-            {
-              label: "Client Success",
-              href: "#testimonials",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
           ],
         },
         {
-          items: [
+          title: "Services",          items: [
-            {
+            { label: "Responsive Design", href: "#services" },
-              label: "Responsive Design",
+            { label: "Custom Development", href: "#services" },
-              href: "#services",
+            { label: "E-commerce", href: "#services" },
-            },
+            { label: "SEO", href: "#services" },
-            {
-              label: "Custom Development",
-              href: "#services",
-            },
-            {
-              label: "E-commerce",
-              href: "#services",
-            },
-            {
-              label: "SEO",
-              href: "#services",
-            },
           ],
         },
         {
-          items: [
+          title: "Legal & Support",          items: [
-            {
+            { label: "Privacy Policy", href: "#" },
-              label: "Privacy Policy",
+            { label: "Terms of Service", href: "#" },
-              href: "#",
+            { label: "Support", href: "#faq" },
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-            {
-              label: "Support",
-              href: "#faq",
-            },
           ],
         },
       ]}
-      logoText="JLW Web Design"
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f7f6f7;
+  --background: #0a0a0a;
-  --card: #ffffff;
+  --card: #1a1a1a;
-  --foreground: #0c1325;
+  --foreground: #ffffff;
-  --primary-cta: #0b07ff;
+  --primary-cta: #e34400;
   --primary-cta-text: #f7f6f7;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #010101;
   --secondary-cta-text: #0c1325;
-  --accent: #93b7ff;
+  --accent: #ff7b05;
-  --background-accent: #a8bae8;
+  --background-accent: #106efb;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);