From c35c841ffc896b8272b9e0287e922e68b2e33a9d Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 15 Apr 2026 21:42:40 +0000
Subject: [PATCH] Update src/app/contact/page.tsx

---
 src/app/contact/page.tsx | 38 ++++++++++++++++++++------------------
 1 file changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 975d23b..8c0534f 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -2,16 +2,15 @@
 
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import ContactCTA from "@/components/sections/contact/ContactCTA";
-import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
+import ContactCenter from "@/components/sections/contact/ContactCenter";
+import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { MapPin } from "lucide-react";
 
 export default function ContactPage() {
     const navItems = [
         { name: "Home", id: "/" },
         { name: "About", id: "/about" },
-        { name: "Services", id: "/services" },
-        { name: "Pricing", id: "/pricing" },
         { name: "Contact", id: "/contact" },
     ];
 
@@ -32,22 +31,25 @@ export default function ContactPage() {
                 <div id="nav" data-section="nav">
                     <NavbarLayoutFloatingInline
                         navItems={navItems}
-                        brandName="Coach"
+                        brandName="St. Jerome"
+                        button={{ text: "Join Us", href: "/contact" }}
                     />
                 </div>
-                <div id="contact" data-section="contact">
-                    <ContactCTA 
-                        tag="Contact"
-                        title="Let's Connect"
-                        description="Reach out to us."
-                        buttons={[{ text: "Send Message", href: "#" }]}
-                        background={{ variant: "plain" }}
-                        useInvertedBackground={false}
-                    />
-                </div>
-                <FooterBaseReveal
-                    logoText="Coach"
-                    columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
+                <main className="pt-32">
+                    <div id="contact" data-section="contact">
+                        <ContactCenter
+                            title="Contact Information"
+                            description="We are located in the heart of our community. Feel free to visit, reach out via phone, or send us a message through our parish office. We look forward to welcoming you."
+                            tag="Visit Us"
+                            tagIcon={MapPin}
+                            background={{ variant: "radial-gradient" }}
+                            useInvertedBackground={false}
+                        />
+                    </div>
+                </main>
+                <FooterCard
+                    logoText="St. Jerome"
+                    copyrightText="© 2025 St. Jerome Roman Catholic Church"
                 />
             </ReactLenis>
         </ThemeProvider>