diff --git a/src/pages/HomePage/sections/Hero.tsx b/src/pages/HomePage/sections/Hero.tsx
index b22224e..1ac8499 100644
--- a/src/pages/HomePage/sections/Hero.tsx
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -50,12 +50,8 @@ export default function HeroSection(): React.JSX.Element {
               Your Vision, Amplified. We craft data-driven strategies and compelling narratives to elevate your brand and drive measurable results. Let's grow together.
             </p>
             <div className="flex items-center justify-end gap-4">
-              <a href="#services" className="inline-flex items-center justify-center h-10 px-4 py-2 bg-primary text-primary-foreground hover:bg-primary/90 rounded-full font-medium transition-colors">
-                Our Services
-              </a>
-              <a href="#contact" className="inline-flex items-center justify-center h-10 px-4 py-2 bg-secondary text-secondary-foreground hover:bg-secondary/80 rounded-full font-medium transition-colors">
-                Contact Us
-              </a>
+              <Button href="#services" text="Our Services" variant="primary" />
+              <Button href="#contact" text="Contact Us" variant="secondary" />
             </div>
           </div>
         </div>