Update src/app/mission/page.tsx

src/app/mission/page.tsx

@@ -2,7 +2,7 @@
 
 import React from "react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { Heart, Users, MapPin } from "lucide-react";
+import { Heart, Users } from "lucide-react";
 
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import MediaAbout from '@/components/sections/about/MediaAbout';
@@ -27,8 +27,15 @@ export default function MissionPage() {
   return (
     <ThemeProvider
       defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="background-highlight"
       borderRadius="soft"
       contentWidth="smallMedium"
+      sizing="largeSmallSizeMediumTitles"
+      background="fluid"
+      cardStyle="solid"
+      primaryButtonStyle="shadow"
+      secondaryButtonStyle="solid"
+      headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingOverlay brandName="Paws & Hearts" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
@@ -41,6 +48,7 @@ export default function MissionPage() {
           tag="Who We Are" 
           tagIcon={Heart}
           imageSrc="https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg" 
+          imageAlt="Volunteer smiling with a dog"
           buttons={[{ text: 'Volunteer Now', href: '/contact' }]} 
           useInvertedBackground={false} 
         />
@@ -55,6 +63,7 @@ export default function MissionPage() {
             { id: 'm3', value: '150+', description: 'Dedicated volunteers working round the clock for welfare.' },
             { id: 'm4', value: '500k', description: 'Meals provided to homeless pets in the last year alone.' }
           ]} 
+          metricsAnimation="opacity"
           useInvertedBackground={true} 
         />
       </div>