Update src/app/contact/page.tsx

src/app/contact/page.tsx

@@ -3,11 +3,9 @@
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
-import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
-import ContactText from "@/components/sections/contact/ContactText";
 import FooterBase from "@/components/sections/footer/FooterBase";
-import { Mail } from "lucide-react";
+import { Mail, Phone, MapPin, Clock } from "lucide-react";
 
 export default function ContactPage() {
   const navItems = [
@@ -21,28 +19,25 @@ export default function ContactPage() {
 
   const footerColumns = [
     {
-      title: "Solutions",
+      title: "Solutions",      items: [
-      items: [
+        { label: "Industrial Automation", href: "/solutions" },
-        { label: "Industrial Automation", href: "/" },
+        { label: "Robot & Cobot Systems", href: "/solutions" },
-        { label: "Robot & Cobot Systems", href: "/" },
+        { label: "Packaging Machinery", href: "/solutions" },
-        { label: "Packaging Machinery", href: "/" },
+        { label: "Smart Gate Systems", href: "/solutions" },
-        { label: "Smart Gate Systems", href: "/" },
+        { label: "Custom Engineering", href: "/solutions" },
-        { label: "Custom Engineering", href: "/" },
       ],
     },
     {
-      title: "Company",
+      title: "Company",      items: [
-      items: [
+        { label: "About Us", href: "/about" },
-        { label: "About Us", href: "/" },
         { label: "Projects & Portfolio", href: "/" },
-        { label: "Blog & Articles", href: "/blog" },
+        { label: "Blog & Articles", href: "/" },
         { label: "Careers", href: "/" },
         { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Resources",
+      title: "Resources",      items: [
-      items: [
         { label: "Case Studies", href: "/" },
         { label: "Technical Documentation", href: "/" },
         { label: "Support Portal", href: "/" },
@@ -51,8 +46,7 @@ export default function ContactPage() {
       ],
     },
     {
-      title: "Contact",
+      title: "Contact",      items: [
-      items: [
         { label: "Phone: +66 2 123 4567", href: "tel:+6621234567" },
         { label: "Email: info@milestones.co.th", href: "mailto:info@milestones.co.th" },
         { label: "LINE: @milestones-tech", href: "https://line.me" },
@@ -80,104 +74,30 @@ export default function ContactPage() {
           brandName="Milestones Technologies"
           navItems={navItems}
           button={{
-            text: "Request Quote",
+            text: "Request Quote",            href: "/contact"
-            href: "/contact",
           }}
         />
       </div>
 
-      <div id="contact-info" data-section="contact-info">
+      <div id="contact" data-section="contact">
-        <div className="mx-auto px-4 md:px-6">
+        <ContactCTA
-          <TestimonialAboutCard
+          tag="GET IN TOUCH"
-            tag="GET IN TOUCH"
+          tagIcon={Mail}
-            tagIcon={Mail}
+          tagAnimation="slide-up"
-            tagAnimation="slide-up"
+          title="Contact Milestones Technologies"
-            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."
-            description="Reach out to our team to discuss your automation and engineering needs. We're here to help you find the perfect solution for your business.",
+          buttons={[
-            subdescription="Whether you need a quick consultation, detailed proposal, or technical support, our dedicated team is ready to assist you. Contact us via phone, email, or visit our office in Bangkok."
+            {
-            icon={Mail}
+              text: "Send Message",              href: "mailto:info@milestones.co.th"
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/milestones-technologies-modern-facility--1773981137018-c41797de.png"
+            },
-            imageAlt="Milestones Technologies office"
+            {
-            mediaAnimation="slide-up"
+              text: "Call Now",              href: "tel:+6621234567"
-            useInvertedBackground={false}
+            },
-          />
+          ]}
-        </div>
+          buttonAnimation="slide-up"
-      </div>
+          background={{ variant: "animated-grid" }}
-
+          useInvertedBackground={false}
-      <div id="contact-methods" data-section="contact-methods">
+        />
-        <div className="mx-auto px-4 md:px-6">
-          <ProductCardTwo
-            gridVariant="two-columns-alternating-heights"
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-            title="Multiple Ways to Reach Us"
-            description="Choose the contact method that works best for you. Our team responds promptly to all inquiries."
-            products={[
-              {
-                id: "contact-phone",
-                brand: "Direct Line",
-                name: "Phone Support",
-                price: "24/7 Available",
-                rating: 5,
-                reviewCount: "Response in minutes",
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/industrial-robot-arm-performing-precise--1773981130354-3aca37a1.png",
-                imageAlt: "Phone support",
-              },
-              {
-                id: "contact-email",
-                brand: "Professional",
-                name: "Email Support",
-                price: "24-48 hrs",
-                rating: 5,
-                reviewCount: "Detailed responses",
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/professional-engineering-team-working-on-1773981131698-7cf7cd5d.png",
-                imageAlt: "Email support",
-              },
-              {
-                id: "contact-office",
-                brand: "In-Person",
-                name: "Office Visit",
-                price: "By appointment",
-                rating: 5,
-                reviewCount: "Bangkok location",
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/milestones-technologies-modern-facility--1773981137018-c41797de.png",
-                imageAlt: "Office location",
-              },
-              {
-                id: "contact-line",
-                brand: "Instant",
-                name: "LINE Chat",
-                price: "Quick response",
-                rating: 5,
-                reviewCount: "Popular in Thailand",
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BC5DoKtnbMRErIYJgmPK5zjs5w/smart-gate-control-system-display-with-d-1773981131975-1ea8ba37.png",
-                imageAlt: "LINE chat support",
-              },
-            ]}
-          />
-        </div>
-      </div>
-
-      <div id="contact-cta" data-section="contact-cta">
-        <div className="mx-auto px-4 md:px-6">
-          <ContactText
-            text="Don't wait to transform your operations. Contact our solutions team today for a free consultation and discover how Milestones Technologies can revolutionize your automation strategy."
-            animationType="entrance-slide"
-            background={{ variant: "grid" }}
-            buttons={[
-              {
-                text: "Start Free Consultation",
-                href: "mailto:info@milestones.co.th",
-              },
-              {
-                text: "Call Now",
-                href: "tel:+6621234567",
-              },
-            ]}
-            useInvertedBackground={false}
-          />
-        </div>
       </div>
 
       <div id="footer" data-section="footer">