diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index d083331..dfe31c0 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -3,8 +3,7 @@
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import ContactCenter from "@/components/sections/contact/ContactCenter";
-import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterBase from "@/components/sections/footer/FooterBase";
 import { Mail, Phone, MapPin, Clock } from "lucide-react";
 
@@ -57,21 +56,6 @@ export default function ContactPage() {
     },
   ];
 
-  const contactMetrics = [
-    {
-      id: "email",      icon: Mail,
-      title: "Email Us",      value: "info@milestones.co.th"},
-    {
-      id: "phone",      icon: Phone,
-      title: "Call Us",      value: "+66 2 123 4567"},
-    {
-      id: "location",      icon: MapPin,
-      title: "Visit Us",      value: "Bangkok, Thailand"},
-    {
-      id: "hours",      icon: Clock,
-      title: "Business Hours",      value: "Mon-Fri 8:00-18:00"},
-  ];
-
   return (
     <ThemeProvider
       defaultButtonVariant="shift-hover"
@@ -90,33 +74,29 @@ export default function ContactPage() {
           brandName="Milestones Technologies"
           navItems={navItems}
           button={{
-            text: "Request Quote",            href: "/contact"}}
+            text: "Request Quote",            href: "/contact"
+          }}
         />
       </div>
 
-      <div id="contact-form" data-section="contact-form">
-        <ContactCenter
+      <div id="contact" data-section="contact">
+        <ContactCTA
           tag="GET IN TOUCH"
-          title="Contact Our Solutions Team"
-          description="Have questions about our automation solutions? Need a custom quote? We're here to help. Fill out the form below and our team will get back to you within 24 hours."
           tagIcon={Mail}
           tagAnimation="slide-up"
+          title="Contact Milestones Technologies"
+          description="Have questions about our automation solutions? Our team is ready to help. Contact us today for a free consultation and custom proposal for your industrial automation, robotics, packaging, or smart gate needs."
+          buttons={[
+            {
+              text: "Send Message",              href: "mailto:info@milestones.co.th"
+            },
+            {
+              text: "Call Now",              href: "tel:+6621234567"
+            },
+          ]}
+          buttonAnimation="slide-up"
           background={{ variant: "animated-grid" }}
           useInvertedBackground={false}
-          inputPlaceholder="Enter your email"
-          buttonText="Send Inquiry"
-          termsText="By clicking Send Inquiry you're confirming that you agree with our Terms and Conditions."
-        />
-      </div>
-
-      <div id="contact-info" data-section="contact-info">
-        <MetricCardThree
-          title="Contact Information & Support Options"
-          description="Reach out to us through multiple channels. Choose the method that works best for you."
-          metrics={contactMetrics}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={true}
         />
       </div>
 
@@ -129,4 +109,4 @@ export default function ContactPage() {
       </div>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file