diff --git a/src/app/page.tsx b/src/app/page.tsx
index a03d8b2..5a74bfe 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,7 +3,7 @@
 import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import HeroOverlay from "@/components/sections/hero/HeroOverlay";
+import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
 import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
 import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
 import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
@@ -42,15 +42,20 @@ export default function HvacPage() {
         </div>
 
         <div id="hero" data-section="hero">
-          <HeroOverlay
+          <HeroSplitKpi
             title="Your Comfort Is Our Priority"
             description="Professional heating, ventilation, and air conditioning services for homes and businesses. From installations to emergency repairs, we keep your climate perfect year-round."
+            kpis={[
+              { value: "2.5k+", label: "Units Installed" },
+              { value: "98%", label: "Customer Satisfaction" },
+              { value: "20+ Yrs", label: "Industry Experience" }
+            ]}
+            enableKpiAnimation={true}
             buttons={[
               { text: "Schedule Service", href: "#contact" },
               { text: "Our Services", href: "#services" },
             ]}
             imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-1.jpg"
-            showDimOverlay={true}
           />
         </div>