Update src/app/portfolio/page.tsx

Merge version_4 into main

src/app/contact/page.tsx

@@ -1,22 +1,26 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
 import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import ContactFaq from "@/components/sections/contact/ContactFaq";
-import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Hammer, Wrench, Phone, Mail, MessageCircle, CheckCircle } from "lucide-react";
+import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
+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";
 
 export default function ContactPage() {
   const navItems = [
-    { name: "Home", id: "/" },
+    { name: "Home", id: "home" },
     { name: "Services", id: "services" },
     { name: "About", id: "about" },
-    { name: "Testimonials", id: "testimonials" },
+    { name: "Portfolio", id: "portfolio" },
     { name: "Contact", id: "contact" },
   ];
 
+  const contactButton = {
+    text: "Call Now",    href: "tel:804-938-0669"};
+
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
@@ -31,16 +35,15 @@ export default function ContactPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
+        <NavbarStyleCentered
           navItems={navItems}
+          button={contactButton}
           brandName="Earl Boys Services"
-          bottomLeftText="Richmond, VA"
-          bottomRightText="804-938-0669"
         />
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroBillboardGallery
+        <HeroBillboardCarousel
           title="Contact Earl Boys Services"
           description="Get in touch with our team for all your home service needs. We're here to help transform your home with professional, reliable service."
           tag="Earl Boys Services"
@@ -49,24 +52,25 @@ export default function ContactPage() {
           background={{ variant: "sparkles-gradient" }}
           mediaItems={[
             {
-              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/young-cute-family-repairs-room_1157-24897.jpg",              imageAlt: "Professional home services team"},
             {
-              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/plumbing-professional-doing-his-job_23-2150721573.jpg",              imageAlt: "Expert plumbing 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/medium-shot-woman-painting-wall-home_23-2149098981.jpg",              imageAlt: "Professional painting services"},
             {
-              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/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg",              imageAlt: "Licensed electrical work"},
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=3",              imageAlt: "General maintenance services"},
+              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/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg",              imageAlt: "Professional flooring installation"},
           ]}
           buttons={[
             {
               text: "Call Now: 804-938-0669",              href: "tel:804-938-0669"},
             {
-              text: "Get Free Estimate",              href: "#contact-form"},
+              text: "Quick Contact Form",              href: "#contact-form"},
           ]}
           buttonAnimation="slide-up"
-          mediaAnimation="slide-up"
           ariaLabel="Contact page hero section for Earl Boys Services"
         />
       </div>
@@ -84,14 +88,14 @@ export default function ContactPage() {
                 {
                   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?_wi=2",                  imageAlt: "Professional communication"},
+                  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?_wi=2",                  imageAlt: "Richmond virginia map location marker"},
+                  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"},
               ],
@@ -100,7 +104,7 @@ export default function ContactPage() {
               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?_wi=2",                  imageAlt: "Home improvement project"},
+                  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"},
               ],
@@ -126,8 +130,37 @@ export default function ContactPage() {
         />
       </div>
 
-      <div id="contact-form" data-section="contact-form">
-        <ContactFaq
+      <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={[
+            {
+              id: "1",              value: "804",              title: "938",              description: "Call us directly - Call Now",              icon: Phone,
+            },
+            {
+              id: "2",              value: "15",              title: "Years",              description: "Experience serving Richmond VA",              icon: Clock,
+            },
+            {
+              id: "3",              value: "2000",              title: "Customers",              description: "Trust us for their home services",              icon: Users,
+            },
+            {
+              id: "4",              value: "10",              title: "Services",              description: "Available in your area",              icon: Wrench,
+            },
+          ]}
+          animationType="slide-up"
+          gridVariant="uniform-all-items-equal"
+          textboxLayout="default"
+          useInvertedBackground={true}
+        />
+      </div>
+
+      <div id="faq" data-section="faq">
+        <FaqSplitText
+          sideTitle="Questions About Our Services?"
+          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."},
@@ -142,49 +175,30 @@ export default function ContactPage() {
             {
               id: "6",              title: "Are you licensed and insured?",              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."},
           ]}
-          ctaTitle="Ready to Get Started?"
-          ctaDescription="Contact Earl Boys Services today for a free estimate and professional home service solutions."
-          ctaButton={{ text: "Call Now", href: "tel:804-938-0669" }}
-          ctaIcon={Phone}
+          textPosition="left"
+          faqsAnimation="slide-up"
           useInvertedBackground={false}
-          animationType="slide-up"
-          accordionAnimationType="smooth"
-          showCard={true}
+          animationType="smooth"
         />
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterSimple
-          columns={[
+        <FooterCard
+          logoText="Earl Boys Services"
+          copyrightText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
+          socialLinks={[
             {
-              title: "Services",              items: [
-                { label: "Plumbing", href: "/" },
-                { label: "Electrical", href: "/" },
-                { label: "Painting", href: "/" },
-                { label: "Maintenance", href: "/" },
-              ],
-            },
+              icon: Facebook,
+              href: "https://facebook.com",              ariaLabel: "Facebook"},
             {
-              title: "Company",              items: [
-                { label: "About Us", href: "/" },
-                { label: "Contact", href: "/contact" },
-                { label: "Testimonials", href: "/" },
-                { label: "Get Estimate", href: "tel:804-938-0669" },
-              ],
-            },
+              icon: Instagram,
+              href: "https://instagram.com",              ariaLabel: "Instagram"},
             {
-              title: "Contact",              items: [
-                { label: "Phone: 804-938-0669", href: "tel:804-938-0669" },
-                { label: "Richmond, VA", href: "#" },
-                { label: "Licensed & Insured", href: "#" },
-                { label: "Available 24/7", href: "#" },
-              ],
-            },
+              icon: Phone,
+              href: "tel:804-938-0669",              ariaLabel: "Call us"},
           ]}
-          bottomLeftText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
-          bottomRightText="Professional Home Services"
         />
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/page.tsx

@@ -1,222 +1,244 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
-import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
-import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+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 TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
-import ContactFaq from "@/components/sections/contact/ContactFaq";
-import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Hammer, Wrench, Droplet, Paintbrush, Zap, MonitorPlay, CheckCircle, Phone, Mail, MessageCircle } from "lucide-react";
+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";
 
-export default function HomePage() {
+const Home = () => {
   const navItems = [
     { name: "Home", id: "/" },
-    { name: "Services", id: "services" },
-    { name: "About", id: "about" },
-    { name: "Testimonials", id: "testimonials" },
+    { 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: "/" },
+      ],
+    },
+  ];
+
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="reveal-blur"
+      defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="smallMedium"
-      sizing="mediumLargeSizeLargeTitles"
-      background="circleGradient"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="primary-glow"
+      primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
       headingFontWeight="bold"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Earl Boys Services"
-          bottomLeftText="Richmond, VA"
-          bottomRightText="804-938-0669"
-        />
-      </div>
-
+      <NavbarLayoutFloatingOverlay
+        navItems={navItems}
+        brandName="Fast"
+        button={{ text: "Get Started", href: "contact" }}
+      />
       <div id="hero" data-section="hero">
-        <HeroBillboardGallery
-          title="Professional Home Services You Can Trust"
-          description="Earl Boys Services delivers expert plumbing, electrical, painting, and maintenance solutions for your home. With over 15 years of experience serving Richmond, VA, we're committed to quality workmanship and customer satisfaction."
-          tag="Earl Boys Services"
-          tagIcon={Hammer}
-          tagAnimation="slide-up"
-          background={{ variant: "radial-gradient" }}
-          mediaItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg?_wi=1",              imageAlt: "Professional home services team"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=1",              imageAlt: "Expert plumbing services"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=1",              imageAlt: "Professional painting services"},
-            {
-              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"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=1",              imageAlt: "General maintenance services"},
-          ]}
+        <HeroLogo
+          logoText="Fast"
+          description="Optimized performance and lightning-fast load times for your website"
           buttons={[
-            {
-              text: "Call Now",              href: "tel:804-938-0669"},
-            {
-              text: "Get Free Estimate",              href: "#contact"},
+            { text: "Start Free Trial", href: "/contact" },
+            { text: "View Docs", href: "/" },
           ]}
-          buttonAnimation="slide-up"
-          mediaAnimation="slide-up"
-          ariaLabel="Hero section for Earl Boys Services"
+          imageSrc="https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=1200&h=600&fit=crop"
+          imageAlt="Fast performance illustration"
         />
       </div>
-
-      <div id="social-proof" data-section="social-proof">
-        <SocialProofOne
-          title="Trusted by Homeowners Throughout Richmond"
-          description="Join thousands of satisfied customers who have transformed their homes with Earl Boys Services"
-          tag="Social Proof"
-          tagAnimation="slide-up"
-          names={[
-            "Family Homes",            "Small Businesses",            "Property Managers",            "Real Estate Agents",            "Contractors",            "Building Owners"]}
-          textboxLayout="default"
-          useInvertedBackground={false}
-          speed={40}
-          showCard={true}
-        />
+      <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="services" data-section="services">
-        <FeatureCardTwentyFive
-          title="Our Professional Services"
-          description="We provide comprehensive home services to keep your property in top condition"
-          tag="What We Do"
-          tagIcon={Wrench}
-          features={[
-            {
-              title: "Plumbing Services",              description: "Expert repairs, installations, and maintenance for all your plumbing needs.",              icon: Droplet,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=2",                  imageAlt: "Professional plumbing repair"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-hand-holding-push-pin-blur-map_23-2147958186.jpg?_wi=1",                  imageAlt: "Plumbing installation work"},
-              ],
-            },
-            {
-              title: "Electrical Work",              description: "Licensed electrical services including repairs, upgrades, and installations.",              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=2",                  imageAlt: "Electrical panel inspection"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=1",                  imageAlt: "Electrical service work"},
-              ],
-            },
-            {
-              title: "Painting & Finishing",              description: "Interior and exterior painting with attention to detail and quality finishes.",              icon: Paintbrush,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=2",                  imageAlt: "Professional painting service"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=1",                  imageAlt: "Interior painting project"},
-              ],
-            },
-            {
-              title: "General Maintenance",              description: "Comprehensive home maintenance and repairs to keep everything running smoothly.",              icon: Wrench,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=2",                  imageAlt: "General maintenance work"},
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg",                  imageAlt: "General repair services"},
-              ],
-            },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          buttons={[
-            {
-              text: "Request Service",              href: "tel:804-938-0669"},
-          ]}
-          buttonAnimation="slide-up"
-        />
+      <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>
-
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardTwelve
-          testimonials={[
-            {
-              id: "1",              name: "Sarah Johnson",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-man-wearing-casual-clothes_23-2149199815.jpg",              imageAlt: "Sarah Johnson testimonial"},
-            {
-              id: "2",              name: "Michael Chen",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-woman-wearing-casual-clothes_23-2149199814.jpg",              imageAlt: "Michael Chen testimonial"},
-            {
-              id: "3",              name: "Emma Davis",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-casual-clothes_23-2149199813.jpg",              imageAlt: "Emma Davis testimonial"},
-            {
-              id: "4",              name: "James Wilson",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-casual-clothes_23-2149199812.jpg",              imageAlt: "James Wilson testimonial"},
-          ]}
-          cardTitle="Over 2,000 homeowners trust Earl Boys Services for their most important projects"
-          cardTag="Testimonials"
-          cardAnimation="slide-up"
-          useInvertedBackground={false}
-        />
+        <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>
+      </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">
-        <ContactFaq
-          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: "Do you charge for estimates?",              content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."},
-            {
-              id: "3",              title: "Are you licensed and insured?",              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."},
-            {
-              id: "4",              title: "How quickly can you respond?",              content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."},
-          ]}
-          ctaTitle="Get Your Free Estimate Today"
-          ctaDescription="Contact Earl Boys Services for professional, reliable home services. We're ready to help transform your home."
-          ctaButton={{ text: "Call Now", href: "tel:804-938-0669" }}
-          ctaIcon={Phone}
-          useInvertedBackground={false}
-          animationType="slide-up"
-          accordionAnimationType="smooth"
-          showCard={true}
-        />
+        <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>
       </div>
-
       <div id="footer" data-section="footer">
-        <FooterSimple
-          columns={[
-            {
-              title: "Services",              items: [
-                { label: "Plumbing", href: "#services" },
-                { label: "Electrical", href: "#services" },
-                { label: "Painting", href: "#services" },
-                { label: "Maintenance", href: "#services" },
-              ],
-            },
-            {
-              title: "Company",              items: [
-                { label: "About Us", href: "#about" },
-                { label: "Contact", href: "#contact" },
-                { label: "Testimonials", href: "#testimonials" },
-                { label: "Get Estimate", href: "tel:804-938-0669" },
-              ],
-            },
-            {
-              title: "Contact",              items: [
-                { label: "Phone: 804-938-0669", href: "tel:804-938-0669" },
-                { label: "Richmond, VA", href: "#" },
-                { label: "Licensed & Insured", href: "#" },
-                { label: "Available 24/7", href: "#" },
-              ],
-            },
-          ]}
-          bottomLeftText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
-          bottomRightText="Professional Home Services"
+        <FooterBaseCard
+          logoText="Fast"
+          columns={footerColumns}
+          copyrightText="© 2025 Fast. All rights reserved."
         />
       </div>
     </ThemeProvider>
   );
-}
+};
+
+export default Home;

src/app/portfolio/page.tsx

@@ -1,187 +1,136 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
-import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
 import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import {
-  Wrench,
-  Paintbrush,
-  Droplet,
-  Zap,
-  MonitorPlay,
-  Facebook,
-  Instagram,
-  Phone,
-} from "lucide-react";
+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"},
+      ],
+    },
+  ];
 
-export default function PortfolioPage() {
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="reveal-blur"
+      defaultTextAnimation="entrance-slide"
       borderRadius="rounded"
-      contentWidth="smallMedium"
-      sizing="mediumLargeSizeLargeTitles"
-      background="noise"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
       cardStyle="solid"
-      primaryButtonStyle="primary-glow"
+      primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
       headingFontWeight="bold"
     >
-      {/* 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>
-
-      {/* 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,
+      <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: [
-                {
-                  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",
-                },
+                project.mediaItems[0],
+                project.mediaItems[1] || project.mediaItems[0],
               ],
-            },
-            {
-              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}
-        />
+            }))}
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+          />
+        </div>
       </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 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>
       </div>
     </ThemeProvider>
   );
-}
+};
+
+export default Portfolio;