feat: replace metrics section with gradient cards

Merge version_18_1778231790767 into main

src/pages/HomePage.tsx

@@ -2,8 +2,8 @@ import AboutFeaturesSplit from '@/components/sections/about/AboutFeaturesSplit';
 import ContactCta from '@/components/sections/contact/ContactCta';
 import FeaturesRevealCards from '@/components/sections/features/FeaturesRevealCards';
 import HeroOverlay from '@/components/sections/hero/HeroOverlay';
-import MetricsFeatureCards from '@/components/sections/metrics/MetricsFeatureCards';
+import MetricsGradientCards from '@/components/sections/metrics/MetricsGradientCards';
-import ProductMediaCards from '@/components/sections/product/ProductMediaCards';
+import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
 import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
 import { Leaf, ShieldCheck, Sparkles } from "lucide-react";
 
@@ -50,6 +50,10 @@ export default function HomePage() {
         },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/people-making-notes-about-flower_23-2147768470.jpg"
+      primaryButton={{
+        text: "Learn More",
+        href: "#",
+      }}
     />
   </div>
 
@@ -84,77 +88,63 @@ export default function HomePage() {
   </div>
 
   <div id="portfolio" data-section="portfolio">
-      <ProductMediaCards
+      <FeaturesDetailedSteps
-      tag="Our Portfolio"
+        tag="Our Process"
-      title="Inspired Outdoor Creations"
+        title="From Vision to Reality"
-      description="Explore a gallery of our completed projects, showcasing diverse styles and innovative designs. See the quality and artistry we bring to every landscape."
+        description="Our systematic approach ensures every project is a seamless and rewarding experience for our clients. We handle every detail with precision and care."
-      products={[
+        steps={[
           {
-          name: "Backyard Oasis",
+            tag: "Step 1",
-          price: "Luxury Residential",
+            title: "Consultation",
-          imageSrc: "http://img.b2bpic.net/free-photo/suburban-housing_53876-14307.jpg",
+            subtitle: "Understanding Your Vision",
+            description: "We start with a thorough consultation to understand your needs, preferences, and the unique characteristics of your property. This allows us to create a tailored plan that aligns with your goals and budget.",
+            imageSrc: "https://images.unsplash.com/photo-1585345322958-15e8342b6c49?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
           },
           {
-          name: "Modern Frontage",
+            tag: "Step 2",
-          price: "Curb Appeal Boost",
+            title: "Design",
-          imageSrc: "http://img.b2bpic.net/free-photo/plants-pot-with-watering-can_23-2148905227.jpg",
+            subtitle: "Crafting the Blueprint",
+            description: "Our design team creates a detailed landscape plan, incorporating your ideas into a beautiful and functional design. We use 3D renderings to help you visualize the final outcome before we break ground.",
+            imageSrc: "http://img.b2bpic.net/free-photo/greenhouse-with-flowers_1398-4315.jpg",
           },
           {
-          name: "Urban Rooftop Garden",
+            tag: "Step 3",
-          price: "Cityscape Green",
+            title: "Installation",
-          imageSrc: "http://img.b2bpic.net/free-photo/artists-garden-filled-with-variety-plants-beautiful-flowers_1258-296326.jpg",
+            subtitle: "Bringing the Design to Life",
+            description: "Our skilled professionals execute the plan with meticulous attention to detail. We use high-quality materials and proven techniques to ensure a flawless installation that stands the test of time.",
+            imageSrc: "http://img.b2bpic.net/free-photo/gardener-woman-holding-flower-pot_1157-25532.jpg",
           },
           {
-          name: "Tranquil Water Feature",
+            tag: "Step 4",
-          price: "Natural & Serene",
+            title: "Maintenance",
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-gardening-concept_23-2148127956.jpg",
+            subtitle: "Ensuring Lasting Beauty",
-        },
+            description: "We offer comprehensive maintenance services to keep your new landscape looking its best. From seasonal care to ongoing upkeep, we ensure your outdoor space continues to thrive and bring you joy.",
-        {
+            imageSrc: "http://img.b2bpic.net/free-photo/gardener-checking-his-plants_23-2147656308.jpg",
-          name: "Commercial Grounds",
-          price: "Business Park",
-          imageSrc: "http://img.b2bpic.net/free-photo/city-square_1359-1040.jpg",
-        },
-        {
-          name: "Custom Pergola & Patio",
-          price: "Outdoor Living",
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-pavilion-garden_1339-3182.jpg",
           },
         ]}
       />
     </div>
 
   <div id="metrics" data-section="metrics">
-      <MetricsFeatureCards
+      <MetricsGradientCards
       tag="Our Impact"
       title="Proven Excellence in Landscaping"
       description="Our commitment to quality and customer satisfaction is reflected in our achievements and long-lasting client relationships."
       metrics={[
         {
           value: "15+",
-          title: "Years of Experience",
+          label: "Years of Experience",
-          features: [
+          description: "Local industry leaders, skilled & certified team, reliable service delivery.",
-            "Local industry leaders",
-            "Skilled & certified team",
-            "Reliable service delivery",
-          ],
         },
         {
           value: "500+",
-          title: "Projects Completed",
+          label: "Projects Completed",
-          features: [
+          description: "Residential & commercial, diverse design styles, on-time & on-budget.",
-            "Residential & commercial",
-            "Diverse design styles",
-            "On-time & on-budget",
-          ],
         },
         {
           value: "98%",
-          title: "Customer Satisfaction",
+          label: "Customer Satisfaction",
-          features: [
+          description: "Glowing testimonials, repeat clientele, and dedicated support.",
-            "Glowing testimonials",
-            "Repeat clientele",
-            "Dedicated support",
-          ],
         },
       ]}
     />