Update theme colors

Merge version_8 into main

src/app/contact/page.tsx

@@ -1,26 +1,22 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
-import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
+import ContactForm from "@/components/form/ContactForm";
+import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
 import FaqSplitText from "@/components/sections/faq/FaqSplitText";
 import FooterCard from "@/components/sections/footer/FooterCard";
-import { Hammer, Wrench, Droplet, Paintbrush, Zap, MonitorPlay, Armchair, Layers, TrendingUp, Clock, Users, CheckCircle, Star, Facebook, Instagram, Phone } from "lucide-react";
+import { Hammer, Wrench, Mail, Star, Quote, Facebook, Instagram, Phone } from "lucide-react";
 
 export default function ContactPage() {
   const navItems = [
-    { name: "Home", id: "home" },
+    { name: "Home", id: "/" },
     { name: "Services", id: "services" },
     { name: "About", id: "about" },
-    { name: "Portfolio", id: "portfolio" },
-    { name: "Contact", id: "contact" },
+    { name: "Contact", id: "/contact" },
   ];
 
-  const contactButton = {
-    text: "Call Now",    href: "tel:804-938-0669"};
-
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
@@ -35,9 +31,8 @@ export default function ContactPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleCentered
+        <NavbarStyleApple
           navItems={navItems}
-          button={contactButton}
           brandName="Earl Boys Services"
         />
       </div>
@@ -52,108 +47,81 @@ export default function ContactPage() {
           background={{ variant: "sparkles-gradient" }}
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg",              imageAlt: "Professional home services team"},
+              imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg?_wi=2",              imageAlt: "Professional home services team"
+            },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg",              imageAlt: "Expert plumbing services"},
+              imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=3",              imageAlt: "Expert plumbing services"
+            },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg",              imageAlt: "Professional painting services"},
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=3",              imageAlt: "Professional painting services"
+            },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg",              imageAlt: "Licensed electrical work"},
+              imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=3",              imageAlt: "Licensed electrical work"
+            },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg",              imageAlt: "General maintenance services"},
+              imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=2",              imageAlt: "General maintenance services"
+            },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg",              imageAlt: "Professional flooring installation"},
+              imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=2",              imageAlt: "Professional flooring installation"
+            },
           ]}
           buttons={[
             {
-              text: "Call Now: 804-938-0669",              href: "tel:804-938-0669"},
+              text: "Call Now: 804-938-0669",              href: "tel:804-938-0669"
+            },
             {
-              text: "Quick Contact Form",              href: "#contact-form"},
+              text: "Send Message",              href: "#contact-form"
+            },
           ]}
           buttonAnimation="slide-up"
           ariaLabel="Contact page hero section for Earl Boys Services"
         />
       </div>
 
-      <div id="services" data-section="services">
-        <FeatureCardTwentyFive
-          title="How to Reach Us"
-          description="Multiple convenient ways to get in touch with Earl Boys Services. We're ready to discuss your project and provide expert recommendations."
-          tag="Contact Options"
-          tagIcon={Wrench}
-          features={[
-            {
-              title: "Phone Support",              description: "Call us directly for immediate assistance and emergency service requests.",              icon: Phone,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg",                  imageAlt: "Customer service support"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg",                  imageAlt: "Professional communication"},
-              ],
-            },
-            {
-              title: "Service Area Coverage",              description: "We proudly serve Richmond, VA and all surrounding areas with comprehensive home services.",              icon: Wrench,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-hand-holding-push-pin-blur-map_23-2147958186.jpg",                  imageAlt: "Richmond virginia map location marker"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-cleaning-office-together_23-2149345517.jpg",                  imageAlt: "Professional home services team working"},
-              ],
-            },
-            {
-              title: "Free Estimates",              description: "Schedule a free consultation and estimate for your project with our experienced team.",              icon: CheckCircle,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg",                  imageAlt: "Home improvement project"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-builder-men-with-smartphones_23-2148751993.jpg",                  imageAlt: "Professional consultation"},
-              ],
-            },
-            {
-              title: "Licensed & Insured",              description: "All services fully licensed, insured, and bonded for your peace of mind.",              icon: CheckCircle,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/cheerful-grey-haired-logistic-worker-hardhat-uniform-standing-shelves-warehouse-with-arms-folded-looking-camera-smiling-vertical-shot-labor-blue-collar-portrait-concept_74855-14227.jpg",                  imageAlt: "Professional tradesman"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/view-professional-cleaning-service-person-holding-supplies_23-2150520608.jpg",                  imageAlt: "Professional service team"},
-              ],
-            },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
+      <div id="contact-form" data-section="contact-form">
+        <ContactForm
+          title="Send us a Message"
+          description="Fill out the form below and we'll get back to you within 24 hours with a response."
+          tag="Quick Contact"
+          tagIcon={Mail}
+          inputPlaceholder="Your email address"
+          buttonText="Send Message"
+          termsText="We'll never share your information and respect your privacy."
+          onSubmit={(email) => console.log('Form submitted with email:', email)}
+          centered={true}
           useInvertedBackground={false}
-          buttons={[
-            {
-              text: "Request Service",              href: "tel:804-938-0669"},
-          ]}
-          buttonAnimation="slide-up"
         />
       </div>
 
-      <div id="metrics" data-section="metrics">
-        <MetricCardOne
-          title="Ready to Transform Your Home?"
-          description="Join thousands of satisfied customers who have trusted Earl Boys Services with their most important projects."
-          tag="Contact Details"
-          tagIcon={TrendingUp}
-          metrics={[
+      <div id="testimonials" data-section="testimonials">
+        <TestimonialCardThirteen
+          title="What Our Customers Say"
+          description="Hear from satisfied clients who have experienced Earl Boys Services excellence firsthand."
+          tag="Customer Reviews"
+          tagIcon={Star}
+          testimonials={[
             {
-              id: "1",              value: "804",              title: "938",              description: "Call us directly - Call Now",              icon: Phone,
+              id: "1",              name: "John Mitchell",              handle: "@john_m",              testimonial: "Earl Boys Services transformed our kitchen with professional craftsmanship. The team was punctual, courteous, and delivered exceptional results. Highly recommend!",              rating: 5,
+              icon: Quote
             },
             {
-              id: "2",              value: "15",              title: "Years",              description: "Experience serving Richmond VA",              icon: Clock,
+              id: "2",              name: "Sarah Thompson",              handle: "@sarah_t",              testimonial: "Outstanding plumbing work! They fixed a complex issue that other companies said was impossible. Professional, efficient, and fair pricing.",              rating: 5,
+              icon: Quote
             },
             {
-              id: "3",              value: "2000",              title: "Customers",              description: "Trust us for their home services",              icon: Users,
+              id: "3",              name: "Michael Chen",              handle: "@m_chen",              testimonial: "The electrical work on our renovation was flawless. They explained everything clearly and made sure we understood the improvements. Will definitely call again!",              rating: 5,
+              icon: Quote
             },
             {
-              id: "4",              value: "10",              title: "Services",              description: "Available in your area",              icon: Wrench,
+              id: "4",              name: "Jennifer Rodriguez",              handle: "@jen_rod",              testimonial: "Best home improvement decision we made! The painters were meticulous and the quality is outstanding. Worth every penny!",              rating: 5,
+              icon: Quote
             },
           ]}
+          showRating={true}
           animationType="slide-up"
-          gridVariant="uniform-all-items-equal"
           textboxLayout="default"
-          useInvertedBackground={true}
+          carouselMode="buttons"
+          useInvertedBackground={false}
         />
       </div>
 
@@ -163,22 +131,28 @@ export default function ContactPage() {
           sideDescription="Find answers to common questions about contacting Earl Boys Services, scheduling appointments, and our service offerings."
           faqs={[
             {
-              id: "1",              title: "What is your phone number?",              content: "You can reach us at 804-938-0669. We're available during business hours and offer emergency service for urgent issues."},
+              id: "1",              title: "What is your phone number?",              content: "You can reach us at 804-938-0669. We're available during business hours and offer emergency service for urgent issues."
+            },
             {
-              id: "2",              title: "How quickly can you respond to my request?",              content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."},
+              id: "2",              title: "How quickly can you respond to my request?",              content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."
+            },
             {
-              id: "3",              title: "What areas do you serve?",              content: "We proudly serve Richmond, VA and all surrounding areas. Our service team covers residential and commercial properties throughout the region."},
+              id: "3",              title: "What areas do you serve?",              content: "We proudly serve Richmond, VA and all surrounding areas. Our service team covers residential and commercial properties throughout the region."
+            },
             {
-              id: "4",              title: "Do you charge for consultations and estimates?",              content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."},
+              id: "4",              title: "Do you charge for consultations and estimates?",              content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."
+            },
             {
-              id: "5",              title: "What payment methods do you accept?",              content: "We accept cash, check, credit cards, and digital payments. We also offer financing options for larger projects."},
+              id: "5",              title: "What payment methods do you accept?",              content: "We accept cash, check, credit cards, and digital payments. We also offer financing options for larger projects."
+            },
             {
-              id: "6",              title: "Are you licensed and insured?",              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."},
+              id: "6",              title: "Are you licensed and insured?",              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."
+            },
           ]}
           textPosition="left"
           faqsAnimation="slide-up"
-          useInvertedBackground={false}
           animationType="smooth"
+          useInvertedBackground={false}
         />
       </div>
 
@@ -189,13 +163,16 @@ export default function ContactPage() {
           socialLinks={[
             {
               icon: Facebook,
-              href: "https://facebook.com",              ariaLabel: "Facebook"},
+              href: "https://facebook.com",              ariaLabel: "Facebook"
+            },
             {
               icon: Instagram,
-              href: "https://instagram.com",              ariaLabel: "Instagram"},
+              href: "https://instagram.com",              ariaLabel: "Instagram"
+            },
             {
               icon: Phone,
-              href: "tel:804-938-0669",              ariaLabel: "Call us"},
+              href: "tel:804-938-0669",              ariaLabel: "Call us"
+            },
           ]}
         />
       </div>

src/app/page.tsx

@@ -1,244 +1,181 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
-import HeroLogo from "@/components/sections/hero/HeroLogo";
-import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
-import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
-import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
+import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
 import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
-import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
-import ContactText from "@/components/sections/contact/ContactText";
-import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
-import { Zap, Users, TrendingUp, Award } from "lucide-react";
+import FaqDouble from "@/components/sections/faq/FaqDouble";
+import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
+import { Sparkles, CheckCircle, TrendingUp, Users } from "lucide-react";
 
-const Home = () => {
+export default function Home() {
   const navItems = [
     { name: "Home", id: "/" },
-    { name: "Portfolio", id: "/portfolio" },
-    { name: "Contact", id: "contact" },
-  ];
-
-  const features = [
-    {
-      id: 1,
-      title: "Lightning Fast Performance",      description: "Optimized for speed with advanced caching, lazy loading, and resource optimization. Achieve sub-second page loads.",      imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=500&h=500&fit=crop&_wi=1"},
-    {
-      id: 2,
-      title: "Seamless User Experience",      description: "Intuitive interface with smooth animations and responsive design. Works flawlessly on all devices.",      imageSrc: "https://images.unsplash.com/photo-1633356122544-f134324ef6db?w=500&h=500&fit=crop&_wi=1"},
-    {
-      id: 3,
-      title: "Intelligent Caching",      description: "Smart caching strategies that reduce server load and bandwidth usage while improving response times significantly.",      imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop"},
-    {
-      id: 4,
-      title: "Scalable Infrastructure",      description: "Built to handle growth. Scales automatically to meet demand without compromising performance or reliability.",      imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop"},
-  ];
-
-  const plans = [
-    {
-      id: "starter",      badge: "Great for Getting Started",      price: "$29/mo",      subtitle: "Perfect for small projects and prototypes",      buttons: [{ text: "Get Started", href: "/contact" }],
-      features: [
-        "Up to 100K monthly requests",        "5GB storage",        "Basic analytics",        "Email support"],
-    },
-    {
-      id: "professional",      badge: "Most Popular",      badgeIcon: Zap,
-      price: "$79/mo",      subtitle: "Ideal for growing businesses",      buttons: [{ text: "Start Free Trial", href: "/contact" }],
-      features: [
-        "Up to 1M monthly requests",        "100GB storage",        "Advanced analytics",        "Priority support",        "Custom domains"],
-    },
-    {
-      id: "enterprise",      badge: "For Scale",      price: "Custom",      subtitle: "Enterprise-grade performance",      buttons: [{ text: "Contact Sales", href: "/contact" }],
-      features: [
-        "Unlimited requests",        "Unlimited storage",        "Real-time analytics",        "24/7 phone support",        "Custom integrations",        "Dedicated account manager"],
-    },
-  ];
-
-  const metrics = [
-    {
-      id: "1",      icon: TrendingUp,
-      title: "Performance",      value: "99.99%"},
-    {
-      id: "2",      icon: Zap,
-      title: "Speed",      value: "<100ms"},
-    {
-      id: "3",      icon: Users,
-      title: "Users",      value: "50K+"},
-    {
-      id: "4",      icon: Award,
-      title: "Uptime",      value: "99.9%"},
-  ];
-
-  const testimonials = [
-    {
-      id: "1",      name: "Sarah Johnson",      imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop"},
-    {
-      id: "2",      name: "Michael Chen",      imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop"},
-    {
-      id: "3",      name: "Emma Davis",      imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=400&h=400&fit=crop&_wi=1"},
-    {
-      id: "4",      name: "James Wilson",      imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop&_wi=1"},
-  ];
-
-  const faqs = [
-    {
-      id: "1",      title: "How do I get started?",      content:
-        "Getting started is easy! Sign up for a free account, choose your plan, and follow our setup guide. You'll be up and running in minutes."},
-    {
-      id: "2",      title: "What makes your service fast?",      content:
-        "We use advanced caching strategies, CDN distribution, and optimized infrastructure to ensure lightning-fast performance across all regions."},
-    {
-      id: "3",      title: "Can I upgrade or downgrade anytime?",      content:
-        "Absolutely! You can change your plan at any time. Upgrades take effect immediately, and downgrades apply at the next billing cycle."},
-    {
-      id: "4",      title: "What support do you offer?",      content:
-        "We provide email support for all plans, priority support for Professional and above, and 24/7 phone support for Enterprise customers."},
-    {
-      id: "5",      title: "Is my data secure?",      content:
-        "Yes, we use enterprise-grade security with encryption at rest and in transit. All data is backed up daily and complies with industry standards."},
-    {
-      id: "6",      title: "Do you offer a free trial?",      content:
-        "Yes! We offer a 14-day free trial with full access to all Professional features. No credit card required to get started."},
-  ];
-
-  const footerColumns = [
-    {
-      title: "Product",      items: [
-        { label: "Features", href: "#features" },
-        { label: "Pricing", href: "#pricing" },
-        { label: "Security", href: "#security" },
-      ],
-    },
-    {
-      title: "Company",      items: [
-        { label: "About", href: "/" },
-        { label: "Blog", href: "/" },
-        { label: "Careers", href: "/" },
-      ],
-    },
-    {
-      title: "Resources",      items: [
-        { label: "Documentation", href: "/" },
-        { label: "API Reference", href: "/" },
-        { label: "Support", href: "/" },
-      ],
-    },
+    { name: "Services", id: "services" },
+    { name: "About", id: "about" },
+    { name: "Contact", id: "/contact" },
   ];
 
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="entrance-slide"
+      defaultTextAnimation="reveal-blur"
       borderRadius="rounded"
-      contentWidth="medium"
-      sizing="medium"
-      background="none"
+      contentWidth="smallMedium"
+      sizing="mediumLargeSizeLargeTitles"
+      background="circleGradient"
       cardStyle="solid"
-      primaryButtonStyle="gradient"
+      primaryButtonStyle="primary-glow"
       secondaryButtonStyle="glass"
       headingFontWeight="bold"
     >
-      <NavbarLayoutFloatingOverlay
-        navItems={navItems}
-        brandName="Fast"
-        button={{ text: "Get Started", href: "contact" }}
-      />
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple navItems={navItems} brandName="Earl Boys Services" />
+      </div>
+
       <div id="hero" data-section="hero">
-        <HeroLogo
-          logoText="Fast"
-          description="Optimized performance and lightning-fast load times for your website"
-          buttons={[
-            { text: "Start Free Trial", href: "/contact" },
-            { text: "View Docs", href: "/" },
+        <HeroBillboardRotatedCarousel
+          title="Transform Your Home with Professional Services"
+          description="Expert home services in Richmond, VA. From plumbing and electrical work to painting and flooring, we deliver quality craftsmanship every time."
+          tag="Earl Boys Services"
+          tagIcon={Sparkles}
+          tagAnimation="slide-up"
+          background={{ variant: "sparkles-gradient" }}
+          carouselItems={[
+            {
+              id: "1",              imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg?_wi=1",              imageAlt: "Professional home services team"},
+            {
+              id: "2",              imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=1",              imageAlt: "Expert plumbing services"},
+            {
+              id: "3",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=1",              imageAlt: "Professional painting services"},
+            {
+              id: "4",              imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=1",              imageAlt: "Licensed electrical work"},
+            {
+              id: "5",              imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=1",              imageAlt: "General maintenance services"},
+            {
+              id: "6",              imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=1",              imageAlt: "Professional flooring installation"},
           ]}
-          imageSrc="https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=1200&h=600&fit=crop"
-          imageAlt="Fast performance illustration"
+          buttons={[
+            {
+              text: "Get Free Estimate",              href: "/contact"},
+            {
+              text: "Call: 804-938-0669",              href: "tel:804-938-0669"},
+          ]}
+          buttonAnimation="slide-up"
+          ariaLabel="Hero section showcasing home services"
         />
       </div>
-      <div id="features" data-section="features">
-        <div className="py-20">
-          <FeatureCardSeven
-            title="Why Choose Our Platform"
-            description="We deliver exceptional performance and speed optimization for your business"
-            features={features}
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
-        </div>
-      </div>
-      <div id="metrics" data-section="metrics">
-        <div className="py-20">
-          <MetricCardThree
-            title="Our Performance Metrics"
-            description="Industry-leading uptime and speed performance"
-            metrics={metrics}
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
-        </div>
-      </div>
-      <div id="pricing" data-section="pricing">
-        <div className="py-20">
-          <PricingCardEight
-            title="Simple, Transparent Pricing"
-            description="Choose the perfect plan for your needs"
-            plans={plans}
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
-        </div>
+
+      <div id="services" data-section="services">
+        <FeatureCardTen
+          title="Our Services"
+          description="Comprehensive home services designed to meet all your residential needs with professional expertise and quality craftsmanship."
+          tag="What We Offer"
+          tagIcon={Sparkles}
+          features={[
+            {
+              id: "1",              title: "Plumbing Services",              description: "From routine maintenance to complex repairs, our licensed plumbers handle all your plumbing needs with precision and care.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=2",                imageAlt: "Professional plumbing work"},
+              items: [
+                { icon: CheckCircle, text: "Leak detection & repair" },
+                { icon: CheckCircle, text: "Pipe installation" },
+                { icon: CheckCircle, text: "Drain cleaning" },
+              ],
+              reverse: false,
+            },
+            {
+              id: "2",              title: "Electrical Services",              description: "Safe, reliable electrical work for all your home needs. Licensed electricians providing installations, repairs, and upgrades.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=2",                imageAlt: "Professional electrical work"},
+              items: [
+                { icon: CheckCircle, text: "Circuit installation" },
+                { icon: CheckCircle, text: "Outlet & switch repairs" },
+                { icon: CheckCircle, text: "Safety inspections" },
+              ],
+              reverse: true,
+            },
+            {
+              id: "3",              title: "Painting & Finishing",              description: "Transform your space with professional painting services. Interior and exterior work with attention to detail and quality finishes.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=2",                imageAlt: "Professional painting services"},
+              items: [
+                { icon: CheckCircle, text: "Interior painting" },
+                { icon: CheckCircle, text: "Exterior painting" },
+                { icon: CheckCircle, text: "Surface preparation" },
+              ],
+              reverse: false,
+            },
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          buttons={[
+            {
+              text: "Schedule Service",              href: "/contact"},
+          ]}
+          buttonAnimation="slide-up"
+        />
       </div>
+
       <div id="testimonials" data-section="testimonials">
-        <div className="py-20">
-          <TestimonialCardTwelve
-            testimonials={testimonials}
-            cardTitle="Join 50,000+ satisfied customers who trust our platform"
-            cardTag="Customer Testimonials"
-            cardAnimation="slide-up"
-            useInvertedBackground={false}
-          />
-        </div>
+        <TestimonialCardTwelve
+          testimonials={[
+            {
+              id: "1",              name: "John Mitchell",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOwz6pWy3usOcBMo4WS6AXnICI/uploaded-1773139927112-860778c6.png?_wi=1",              imageAlt: "John Mitchell"},
+            {
+              id: "2",              name: "Sarah Thompson",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOwz6pWy3usOcBMo4WS6AXnICI/uploaded-1773139927112-860778c6.png?_wi=2",              imageAlt: "Sarah Thompson"},
+            {
+              id: "3",              name: "Michael Chen",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOwz6pWy3usOcBMo4WS6AXnICI/uploaded-1773139927112-860778c6.png?_wi=3",              imageAlt: "Michael Chen"},
+            {
+              id: "4",              name: "Jennifer Rodriguez",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AOwz6pWy3usOcBMo4WS6AXnICI/uploaded-1773139927112-860778c6.png?_wi=4",              imageAlt: "Jennifer Rodriguez"},
+          ]}
+          cardTitle="Over 1,000 satisfied customers trust Earl Boys Services"
+          cardTag="See what they say"
+          useInvertedBackground={false}
+          cardAnimation="slide-up"
+        />
       </div>
+
       <div id="faq" data-section="faq">
-        <div className="py-20">
-          <FaqSplitMedia
-            faqs={faqs}
-            imageSrc="https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&h=600&fit=crop"
-            imageAlt="FAQ support"
-            title="Frequently Asked Questions"
-            description="Find answers to common questions about our service"
-            textboxLayout="default"
-            faqsAnimation="slide-up"
-            mediaAnimation="slide-up"
-            useInvertedBackground={false}
-          />
-        </div>
-      </div>
-      <div id="contact" data-section="contact">
-        <div className="py-20">
-          <ContactText
-            text="Ready to optimize your website performance? Start your free trial today and experience the difference."
-            animationType="entrance-slide"
-            buttons={[
-              { text: "Start Free Trial", href: "/contact" },
-              { text: "Schedule Demo", href: "/" },
-            ]}
-            background={{ variant: "plain" }}
-            useInvertedBackground={false}
-          />
-        </div>
+        <FaqDouble
+          faqs={[
+            {
+              id: "1",              title: "What areas do you serve?",              content: "We proudly serve Richmond, VA and all surrounding areas. Our service team covers residential and commercial properties throughout the region."},
+            {
+              id: "2",              title: "How quickly can you respond to my request?",              content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."},
+            {
+              id: "3",              title: "Do you charge for consultations?",              content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."},
+            {
+              id: "4",              title: "Are you licensed and insured?",              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."},
+          ]}
+          title="Frequently Asked Questions"
+          description="Find answers to common questions about our services and how we can help your home."
+          textboxLayout="default"
+          useInvertedBackground={false}
+          faqsAnimation="slide-up"
+        />
       </div>
+
       <div id="footer" data-section="footer">
-        <FooterBaseCard
-          logoText="Fast"
-          columns={footerColumns}
-          copyrightText="© 2025 Fast. All rights reserved."
+        <FooterBaseReveal
+          columns={[
+            {
+              title: "Services",              items: [
+                { label: "Plumbing", href: "services" },
+                { label: "Electrical", href: "services" },
+                { label: "Painting", href: "services" },
+              ],
+            },
+            {
+              title: "Company",              items: [
+                { label: "About", href: "about" },
+                { label: "Contact", href: "/contact" },
+                { label: "Home", href: "/" },
+              ],
+            },
+          ]}
+          copyrightText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
         />
       </div>
     </ThemeProvider>
   );
-};
-
-export default Home;
+}

src/app/portfolio/page.tsx

@@ -1,136 +1,187 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
 import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import TeamCardEleven from "@/components/sections/team/TeamCardEleven";
-import { Briefcase, Code, Palette, Users } from "lucide-react";
-
-const Portfolio = () => {
-  const navItems = [
-    { name: "Home", id: "/" },
-    { name: "Portfolio", id: "/portfolio" },
-    { name: "Contact", id: "contact" },
-  ];
-
-  const projects = [
-    {
-      title: "Brand Identity Design",      description: "Complete visual identity system including logo, color palette, and brand guidelines.",      icon: Palette,
-      mediaItems: [
-        {
-          imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=1",          imageAlt: "Brand design mockup"},
-        {
-          imageSrc: "https://images.unsplash.com/photo-1543632835-a1bf4ab86fef?w=500&h=500&fit=crop",          imageAlt: "Color palette exploration"},
-      ],
-    },
-    {
-      title: "Web Application Development",      description: "Full-stack web application with responsive design and modern architecture.",      icon: Code,
-      mediaItems: [
-        {
-          imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=500&h=500&fit=crop&_wi=2",          imageAlt: "Web application interface"},
-        {
-          imageSrc: "https://images.unsplash.com/photo-1633356122544-f134324ef6db?w=500&h=500&fit=crop&_wi=2",          imageAlt: "Mobile responsive design"},
-      ],
-    },
-    {
-      title: "Strategic Branding",      description: "Comprehensive branding strategy and positioning for market leadership.",      icon: Briefcase,
-      mediaItems: [
-        {
-          imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop&_wi=1",          imageAlt: "Strategy workshop"},
-        {
-          imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop&_wi=2",          imageAlt: "Marketing materials"},
-      ],
-    },
-    {
-      title: "User Experience Design",      description: "Intuitive user interfaces designed with user research and testing.",      icon: Palette,
-      mediaItems: [
-        {
-          imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=2",          imageAlt: "UX wireframes"},
-        {
-          imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=3",          imageAlt: "Design iterations"},
-      ],
-    },
-  ];
-
-  const teamMembers = [
-    {
-      id: "leadership",      groupTitle: "Leadership",      members: [
-        {
-          id: "1",          title: "Sarah Johnson",          subtitle: "Creative Director",          detail: "sarah.johnson@company.com",          imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop&_wi=1",          imageAlt: "Sarah Johnson"},
-        {
-          id: "2",          title: "Michael Chen",          subtitle: "Lead Strategist",          detail: "michael.chen@company.com",          imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop&_wi=1",          imageAlt: "Michael Chen"},
-      ],
-    },
-    {
-      id: "design",      groupTitle: "Design Team",      members: [
-        {
-          id: "3",          title: "Emma Davis",          subtitle: "UI/UX Designer",          detail: "emma.davis@company.com",          imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=400&h=400&fit=crop&_wi=2",          imageAlt: "Emma Davis"},
-        {
-          id: "4",          title: "James Wilson",          subtitle: "Brand Designer",          detail: "james.wilson@company.com",          imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop&_wi=2",          imageAlt: "James Wilson"},
-        {
-          id: "5",          title: "Sophie Martin",          subtitle: "Graphic Designer",          detail: "sophie.martin@company.com",          imageSrc: "https://images.unsplash.com/photo-1517849845537-1d51a20414de?w=400&h=400&fit=crop",          imageAlt: "Sophie Martin"},
-      ],
-    },
-    {
-      id: "development",      groupTitle: "Development Team",      members: [
-        {
-          id: "6",          title: "Alex Rodriguez",          subtitle: "Full Stack Developer",          detail: "alex.rodriguez@company.com",          imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop&_wi=2",          imageAlt: "Alex Rodriguez"},
-        {
-          id: "7",          title: "Lisa Anderson",          subtitle: "Frontend Developer",          detail: "lisa.anderson@company.com",          imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop&_wi=2",          imageAlt: "Lisa Anderson"},
-      ],
-    },
-  ];
+import FooterCard from "@/components/sections/footer/FooterCard";
+import {
+  Wrench,
+  Paintbrush,
+  Droplet,
+  Zap,
+  MonitorPlay,
+  Facebook,
+  Instagram,
+  Phone,
+} from "lucide-react";
 
+export default function PortfolioPage() {
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="entrance-slide"
+      defaultTextAnimation="reveal-blur"
       borderRadius="rounded"
-      contentWidth="medium"
-      sizing="medium"
-      background="none"
+      contentWidth="smallMedium"
+      sizing="mediumLargeSizeLargeTitles"
+      background="noise"
       cardStyle="solid"
-      primaryButtonStyle="gradient"
+      primaryButtonStyle="primary-glow"
       secondaryButtonStyle="glass"
       headingFontWeight="bold"
     >
-      <NavbarLayoutFloatingOverlay
-        navItems={navItems}
-        brandName="Portfolio"
-        button={{ text: "Contact Us", href: "contact" }}
-      />
-      <div id="portfolio" data-section="portfolio">
-        <div className="py-20">
-          <FeatureCardTwentyFive
-            title="Featured Projects"
-            description="Explore our latest work and successful client engagements"
-            features={projects.map((project) => ({
-              ...project,
-              mediaItems: [
-                project.mediaItems[0],
-                project.mediaItems[1] || project.mediaItems[0],
-              ],
-            }))}
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
-        </div>
+      {/* Navbar */}
+      <div id="nav" data-section="nav">
+        <NavbarStyleCentered
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "/services" },
+            { name: "About", id: "/about" },
+            { name: "Portfolio", id: "/portfolio" },
+            { name: "Contact", id: "/contact" },
+          ]}
+          button={{
+            text: "Call Now",
+            href: "tel:804-938-0669",
+          }}
+          brandName="Earl Boys Services"
+        />
       </div>
-      <div id="team" data-section="team">
-        <div className="py-20">
-          <TeamCardEleven
-            title="Our Team"
-            description="Meet the talented professionals behind our success"
-            groups={teamMembers}
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
-        </div>
+
+      {/* Portfolio Hero Section */}
+      <div id="portfolio-hero" data-section="portfolio-hero">
+        <HeroBillboardCarousel
+          title="Our Portfolio"
+          description="Explore our collection of completed projects showcasing professional home services excellence across Richmond, VA."
+          tag="Earl Boys Services"
+          tagIcon={Wrench}
+          tagAnimation="slide-up"
+          background={{ variant: "plain" }}
+          mediaItems={[
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=6",
+              imageAlt: "Before after home renovation transformation",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=5",
+              imageAlt: "Kitchen renovation before after transformation",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=5",
+              imageAlt: "Room renovation before after completion",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=5",
+              imageAlt: "Professional plumbing work",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=4",
+              imageAlt: "Professional painting service",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=5",
+              imageAlt: "Professional electrician electrical work",
+            },
+          ]}
+          buttons={[
+            {
+              text: "View Services",
+              href: "/services",
+            },
+            {
+              text: "Get a Quote",
+              href: "tel:804-938-0669",
+            },
+          ]}
+          buttonAnimation="slide-up"
+          ariaLabel="Portfolio section for Earl Boys Services"
+        />
+      </div>
+
+      {/* Featured Projects Section */}
+      <div id="projects" data-section="projects">
+        <FeatureCardTwentyFive
+          title="Featured Projects"
+          description="A selection of our most successful home improvement and repair projects completed with professional excellence and customer satisfaction."
+          tag="Project Showcase"
+          tagIcon={Wrench}
+          features={[
+            {
+              title: "Plumbing Installation",
+              description: "Complete bathroom and kitchen plumbing system installation with modern fixtures and premium finishes.",
+              icon: Droplet,
+              mediaItems: [
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=6",
+                  imageAlt: "Professional plumbing work",
+                },
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=7",
+                  imageAlt: "Project completed successfully",
+                },
+              ],
+            },
+            {
+              title: "Interior Painting",
+              description: "Professional interior painting project transforming living spaces with fresh color and premium finish.",
+              icon: Paintbrush,
+              mediaItems: [
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=5",
+                  imageAlt: "Professional painting service",
+                },
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=6",
+                  imageAlt: "Color selection and painting results",
+                },
+              ],
+            },
+            {
+              title: "Electrical Upgrades",
+              description: "Licensed electrical work including panel upgrades, outlet installation, and safety inspections for modern homes.",
+              icon: Zap,
+              mediaItems: [
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=6",
+                  imageAlt: "Professional electrician electrical work",
+                },
+                {
+                  imageSrc: "http://img.b2bpic.net/free-photo/light-switches-near-metal-door-handle-stairs-lighting-control_169016-69323.jpg",
+                  imageAlt: "Professional electrical installation",
+                },
+              ],
+            },
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      {/* Footer */}
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Earl Boys Services"
+          copyrightText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
+          socialLinks={[
+            {
+              icon: Facebook,
+              href: "https://facebook.com",
+              ariaLabel: "Facebook",
+            },
+            {
+              icon: Instagram,
+              href: "https://instagram.com",
+              ariaLabel: "Instagram",
+            },
+            {
+              icon: Phone,
+              href: "tel:804-938-0669",
+              ariaLabel: "Call us",
+            },
+          ]}
+        />
       </div>
     </ThemeProvider>
   );
-};
-
-export default Portfolio;
+}