Update src/app/portfolio/page.tsx

Merge version_4 into main

src/app/page.tsx

@@ -1,369 +1,244 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
-import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
-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 MetricCardOne from "@/components/sections/metrics/MetricCardOne";
-import FaqSplitText from "@/components/sections/faq/FaqSplitText";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import Link from "next/link";
-import {
-  Hammer,
-  Wrench,
-  Droplet,
-  Paintbrush,
-  Zap,
-  MonitorPlay,
-  Armchair,
-  Layers,
-  Clock,
-  Users,
-  CheckCircle,
-  TrendingUp,
-  Star,
-  Facebook,
-  Instagram,
-  Phone,
-} 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";
+
+const 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: "/" },
+      ],
+    },
+  ];
 
-export default function HomePage() {
   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"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleCentered
-          brandName="Earl Boys Services"
-          navItems={[
-            { name: "Home", id: "home" },
-            { 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",
-          }}
-        />
-      </div>
-
+      <NavbarLayoutFloatingOverlay
+        navItems={navItems}
+        brandName="Fast"
+        button={{ text: "Get Started", href: "contact" }}
+      />
       <div id="hero" data-section="hero">
-        <HeroBillboardCarousel
-          title="Professional Home Services in Richmond, VA"
-          description="Expert solutions for all your home improvement, repair, and maintenance needs. 10+ services to transform your home. Call 804-938-0669"
-          tag="Earl Boys Services"
-          tagIcon={Hammer}
-          tagAnimation="slide-up"
-          background={{ variant: "plain" }}
-          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",
-            },
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=1",
-              imageAlt: "Professional flooring installation",
-            },
-          ]}
+        <HeroLogo
+          logoText="Fast"
+          description="Optimized performance and lightning-fast load times for your website"
           buttons={[
-            {
-              text: "Call Now: 804-938-0669",
-              href: "tel:804-938-0669",
-            },
-            {
-              text: "Book a Service",
-              href: "contact",
-            },
+            { text: "Start Free Trial", href: "/contact" },
+            { text: "View Docs", href: "/" },
           ]}
-          buttonAnimation="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="services-home" data-section="services-home">
-        <FeatureCardTwentyFive
-          features={[
-            {
-              title: "Plumbing Services",
-              description: "Expert plumbing repairs, installations, and maintenance for all your home water systems.",
-              icon: Droplet,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=2",
-                  imageAlt: "Professional plumbing work",
-                },
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=1",
-                  imageAlt: "Plumbing project completed",
-                },
-              ],
-            },
-            {
-              title: "Painting Services",
-              description: "Interior and exterior painting with premium finishes for residential and commercial spaces.",
-              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/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=1",
-                  imageAlt: "Painting transformation",
-                },
-              ],
-            },
-            {
-              title: "Electrical Work",
-              description: "Licensed electrical services including installations, repairs, and safety inspections.",
-              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: "Professional electrical work",
-                },
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=1",
-                  imageAlt: "Electrical project completed",
-                },
-              ],
-            },
-            {
-              title: "Wall Mounting",
-              description: "Professional TV mounting, shelving installation, and wall customization services.",
-              icon: MonitorPlay,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-builder-men-with-smartphones_23-2148751993.jpg?_wi=1",
-                  imageAlt: "Professional wall mounting",
-                },
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=2",
-                  imageAlt: "Wall mounting installation",
-                },
-              ],
-            },
-            {
-              title: "Furniture Assembly",
-              description: "Quick and efficient furniture assembly for residential and commercial installations.",
-              icon: Armchair,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-hitting-nail-by-hammer_329181-3740.jpg?_wi=1",
-                  imageAlt: "Professional furniture assembly",
-                },
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=2",
-                  imageAlt: "Furniture installation completed",
-                },
-              ],
-            },
-            {
-              title: "Flooring Installation",
-              description: "Expert flooring installation for hardwood, tile, laminate, and other materials.",
-              icon: Layers,
-              mediaItems: [
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=2",
-                  imageAlt: "Professional flooring installation",
-                },
-                {
-                  imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=2",
-                  imageAlt: "Flooring project transformation",
-                },
-              ],
-            },
-          ]}
-          animationType="slide-up"
-          title="Our Expert Services"
-          description="Comprehensive home services tailored to your needs. From plumbing to painting, we handle it all with professional excellence."
-          tag="10 Services"
-          tagIcon={Wrench}
-          textboxLayout="default"
-          useInvertedBackground={false}
-          buttons={[
-            {
-              text: "View All Services",
-              href: "/services",
-            },
-          ]}
-          buttonAnimation="slide-up"
-        />
+      <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="testimonials" data-section="testimonials">
-        <TestimonialCardTwelve
-          testimonials={[
-            {
-              id: "1",
-              name: "Sarah Johnson",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-businessman-close-up_23-2148746290.jpg",
-              imageAlt: "Sarah Johnson testimonial",
-            },
-            {
-              id: "2",
-              name: "Michael Chen",
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-thumbs-up_1187-3144.jpg",
-              imageAlt: "Michael Chen testimonial",
-            },
-            {
-              id: "3",
-              name: "Emily Rodriguez",
-              imageSrc: "http://img.b2bpic.net/free-photo/headshot-euphoric-successful-businesswoman_273609-13789.jpg",
-              imageAlt: "Emily Rodriguez testimonial",
-            },
-            {
-              id: "4",
-              name: "David Williams",
-              imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-t-shirt-jacket-cap-looking-amazed-front-view_176474-57861.jpg",
-              imageAlt: "David Williams testimonial",
-            },
-          ]}
-          cardTitle="Over 2,000+ satisfied customers trust Earl Boys Services for their home improvement needs"
-          cardTag="Customer Reviews"
-          cardTagIcon={Star}
-          cardAnimation="slide-up"
-          useInvertedBackground={false}
-        />
-      </div>
-
       <div id="metrics" data-section="metrics">
-        <MetricCardOne
-          metrics={[
-            {
-              id: "1",
-              value: "15",
-              title: "Years",
-              description: "In business serving Richmond VA",
-              icon: Clock,
-            },
-            {
-              id: "2",
-              value: "2000",
-              title: "Customers",
-              description: "Satisfied homeowners and businesses",
-              icon: Users,
-            },
-            {
-              id: "3",
-              value: "98",
-              title: "Percent",
-              description: "Customer satisfaction rating",
-              icon: CheckCircle,
-            },
-            {
-              id: "4",
-              value: "10",
-              title: "Services",
-              description: "Complete home service solutions",
-              icon: Wrench,
-            },
-          ]}
-          animationType="slide-up"
-          gridVariant="uniform-all-items-equal"
-          title="By The Numbers"
-          description="Earl Boys Services is Richmond's trusted home services leader with proven results."
-          tag="Our Success"
-          tagIcon={TrendingUp}
-          textboxLayout="default"
-          useInvertedBackground={true}
-        />
+        <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">
+        <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">
-        <FaqSplitText
-          faqs={[
-            {
-              id: "1",
-              title: "What areas of Richmond do you serve?",
-              content: "We proudly serve all of Richmond, VA and surrounding areas. Our service team covers residential and commercial properties throughout the region.",
-            },
-            {
-              id: "2",
-              title: "How quickly can you respond to service requests?",
-              content: "We typically respond to service requests within 24 hours. For urgent issues, call us at 804-938-0669 for immediate assistance.",
-            },
-            {
-              id: "3",
-              title: "Do you offer warranty on your work?",
-              content: "Yes! We stand behind our workmanship with comprehensive warranties on all services. Details vary by service type.",
-            },
-            {
-              id: "4",
-              title: "Are you licensed and insured?",
-              content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications for electrical, plumbing, and other specialized services.",
-            },
-            {
-              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: "Do you provide free estimates?",
-              content: "Yes! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation.",
-            },
-          ]}
-          sideTitle="Frequently Asked Questions"
-          sideDescription="Find answers to common questions about our home services, pricing, and availability."
-          textPosition="left"
-          faqsAnimation="slide-up"
-          useInvertedBackground={false}
-          animationType="smooth"
-        />
+        <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>
       </div>
-
       <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",
-            },
-          ]}
+        <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;