diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6b47c9a..2405222 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -216,22 +216,24 @@ export default function LandingPage() {
       </div>
 
       <div id="metrics" data-section="metrics">
-        <MetricCardThree
-          title="Why Choose Arez"
-          description="Trusted by 100+ clients with 95% 5-star reviews and 10+ years of expertise"
-          tag="Our Impact"
-          tagIcon={TrendingUp}
-          tagAnimation="slide-up"
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={true}
-          metrics={[
-            { id: '1', icon: Users, title: 'Satisfied Clients', value: '100+' },
-            { id: '2', icon: Award, title: 'Expert Barbers', value: '5+' },
-            { id: '3', icon: Star, title: '5-Star Reviews', value: '95%' },
-            { id: '4', icon: Clock, title: 'Years Experience', value: '10+' }
-          ]}
-        />
+        <a href="/contact" className="block">
+          <MetricCardThree
+            title="Why Choose Arez"
+            description="Trusted by 100+ clients with 95% 5-star reviews and 10+ years of expertise"
+            tag="Our Impact"
+            tagIcon={TrendingUp}
+            tagAnimation="slide-up"
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={true}
+            metrics={[
+              { id: '1', icon: Users, title: 'Satisfied Clients', value: '100+' },
+              { id: '2', icon: Award, title: 'Expert Barbers', value: '5+' },
+              { id: '3', icon: Star, title: '5-Star Reviews', value: '95%' },
+              { id: '4', icon: Clock, title: 'Years Experience', value: '10+' }
+            ]}
+          />
+        </a>
       </div>
 
       <div id="location-contact" data-section="location-contact" className="w-full py-16 md:py-20 px-4 md:px-6">