Update src/app/about/page.tsx

src/app/about/page.tsx

@@ -3,16 +3,14 @@
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
 import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
-import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
-import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
+import FooterCard from "@/components/sections/footer/FooterCard";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { User } from "lucide-react";
+import { History } from "lucide-react";
 
 export default function AboutPage() {
     const navItems = [
         { name: "Home", id: "/" },
-        { name: "Services", id: "/services" },
-        { name: "Pricing", id: "/pricing" },
+        { name: "About", id: "/about" },
         { name: "Contact", id: "/contact" },
     ];
 
@@ -33,36 +31,27 @@ export default function AboutPage() {
                 <div id="nav" data-section="nav">
                     <NavbarLayoutFloatingInline
                         navItems={navItems}
-                        brandName="Coach"
+                        brandName="St. Jerome"
+                        button={{ text: "Join Us", href: "/contact" }}
                     />
                 </div>
-                <div id="about-hero" data-section="about-hero">
-                    <MetricSplitMediaAbout
-                        title="Dedicated to Your Success"
-                        description="With over 12 years of experience in executive and business coaching, I have dedicated my career to helping leaders like you navigate the complexities of growth."
-                        metrics={[{ value: "12+", title: "Years Experience" }, { value: "500+", title: "Clients Coached" }]}
-                        useInvertedBackground={false}
-                        mediaAnimation="slide-up"
-                        metricsAnimation="slide-up"
-                    />
-                </div>
-                <div id="team" data-section="team">
-                    <TeamCardTwo
-                        title="Meet Your Coach"
-                        members={[
-                            {
-                                id: "1",                                name: "John Anderson",                                role: "Lead Business Strategist",                                description: "Expert in executive coaching and team alignment."
-                            }
-                        ]}
-                        gridVariant="uniform-all-items-equal"
-                        animationType="slide-up"
-                        textboxLayout="default"
-                        useInvertedBackground={true}
-                    />
-                </div>
-                <FooterBaseReveal
-                    logoText="Coach"
-                    columns={[{ title: "Company", items: [{ label: "Home", href: "/" }, { label: "Contact", href: "/contact" }] }]}
+                <main className="pt-32">
+                    <div id="about" data-section="about">
+                        <MetricSplitMediaAbout
+                            title="Our History & Mission"
+                            description="Founded with a vision of community and spiritual growth, St. Jerome has been a pillar of the neighborhood for decades. We are dedicated to nurturing faith through tradition, sacraments, and active engagement with our local mission."
+                            tag="Faith in Action"
+                            tagIcon={History}
+                            metrics={[{ value: "100+", title: "Years Served" }, { value: "500+", title: "Families" }]}
+                            useInvertedBackground={false}
+                            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CPYUJPeaDgYc4FSlAZFCKnMOqE/uploaded-1776289077687-hlsfoa09.jpg"
+                            imageAlt="Church History"
+                        />
+                    </div>
+                </main>
+                <FooterCard
+                    logoText="St. Jerome"
+                    copyrightText="© 2025 St. Jerome Roman Catholic Church"
                 />
             </ReactLenis>
         </ThemeProvider>