diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 7f22488..1f316dd 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -3,7 +3,7 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
-import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
+import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
 import FooterBase from "@/components/sections/footer/FooterBase";
 
 export default function AboutPage() {
@@ -37,10 +37,16 @@ export default function AboutPage() {
                     />
                 </div>
                 <div id="about-section" data-section="about-section">
-                    <InlineImageSplitTextAbout
+                    <MetricSplitMediaAbout
                         title="About Our Agency"
                         description="We are a creative agency dedicated to crafting exceptional digital experiences that drive growth and engagement."
                         useInvertedBackground={false}
+                        metrics={[
+                            { value: "10+", title: "Years Experience" },
+                            { value: "500+", title: "Projects Completed" }
+                        ]}
+                        mediaAnimation="opacity"
+                        metricsAnimation="opacity"
                     />
                 </div>
                 <div id="footer" data-section="footer">