Update src/app/about/page.tsx

Merge version_13 into main

src/app/about/page.tsx

@@ -3,8 +3,10 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import FooterSimple from '@/components/sections/footer/FooterSimple';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
+import FeatureBento from '@/components/sections/feature/FeatureBento';
 
 export default function AboutPage() {
   return (
@@ -22,7 +24,7 @@ export default function AboutPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-          <NavbarLayoutFloatingInline
+          <NavbarStyleCentered
             navItems={[
               { name: "Home", id: "/" },
               { name: "How It Works", id: "/how-it-works" },
@@ -36,7 +38,7 @@ export default function AboutPage() {
           />
         </div>
 
-        <div id="about-header" data-section="about-header">
+        <div id="about-header" data-section="about-header" style={{ backgroundColor: "#F5F5F0" }}>
           <TextSplitAbout
             title="Ronnie Konishi"
             description={[
@@ -46,7 +48,7 @@ export default function AboutPage() {
           />
         </div>
 
-        <div id="about-story" data-section="about-story">
+        <div id="about-story" data-section="about-story" style={{ backgroundColor: "#F5F5F0" }}>
           <TextSplitAbout
             title="The Story"
             description={[
@@ -56,7 +58,7 @@ export default function AboutPage() {
           />
         </div>
 
-        <div id="about-mission" data-section="about-mission">
+        <div id="about-mission" data-section="about-mission" style={{ backgroundColor: "#F5F5F0" }}>
           <TextSplitAbout
             title="Why I Founded Palante STS"
             description={[
@@ -67,6 +69,40 @@ export default function AboutPage() {
           />
         </div>
 
+        <div id="bring-to-family" data-section="bring-to-family" style={{ backgroundColor: "#F5F5F0" }}>
+          <MetricSplitMediaAbout
+            title="What I Bring to Your Family"
+            description="My role is to be your anchor. I combine professional real estate strategy with deep senior care knowledge to ensure you never have to navigate this journey alone."
+            metrics={[
+              { value: "20 Years", title: "Real Estate Expertise" },
+              { value: "Compassion", title: "Personalized Guidance" },
+              { value: "Complete", title: "End-to-End Transition" }
+            ]}
+            useInvertedBackground={false}
+            mediaAnimation="slide-up"
+            metricsAnimation="slide-up"
+          />
+        </div>
+
+        <div id="who-i-serve" data-section="who-i-serve" style={{ backgroundColor: "#F5F5F0" }}>
+          <FeatureBento
+            title="Who I Serve"
+            description="I partner with families in Southern California seeking professional guidance during senior transitions."
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={true}
+            features={[
+              {
+                title: "Families in Transition",                description: "Supporting adult children caring for aging parents.",                bentoComponent: "media-stack",                items: [
+                  { imageSrc: "https://images.unsplash.com/photo-1554629947-320078873099" },
+                  { imageSrc: "https://images.unsplash.com/photo-1544005313-94ddf0286df2" },
+                  { imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d" }
+                ]
+              }
+            ]}
+          />
+        </div>
+
         <div id="footer" data-section="footer">
           <FooterSimple
             columns={[
@@ -80,4 +116,4 @@ export default function AboutPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/page.tsx

@@ -65,10 +65,10 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       features={[
-        { title: "Free Consultation", description: "We listen first — no pressure, no scripts.", icon: Users, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/uniform-healthcare-medical-icons-computer_1134-959.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/uniform-healthcare-medical-icons-computer_1134-959.jpg?_wi=2" }] },
-        { title: "Personalized Plan", description: "Every situation is different. Yours gets a custom roadmap.", icon: Map, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6pdsjv&_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6pdsjv&_wi=2" }] },
-        { title: "Execution", description: "We coordinate home sales, tours, and downsizing for you.", icon: Briefcase, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-vector/25-task-project-management-flat-color-icon-pack_1142-22695.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-vector/25-task-project-management-flat-color-icon-pack_1142-22695.jpg?_wi=2" }] },
-        { title: "Move-In Day", description: "From your parent's old living room to their new home, set up and ready.", icon: Home, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/paper-cut-key-heart-as-symbol-love_1232-3647.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/paper-cut-key-heart-as-symbol-love_1232-3647.jpg?_wi=2" }] }
+        { title: "Free Consultation", description: "We listen first — no pressure, no scripts.", icon: Users, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776662612141-6oey12mw.jpg?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776662612141-6oey12mw.jpg?_wi=2" }] },
+        { title: "Personalized Plan", description: "Every situation is different. Yours gets a custom roadmap.", icon: Map, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776662872184-zqbg85kc.jpg?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776662872184-zqbg85kc.jpg?_wi=2" }] },
+        { title: "Execution", description: "We coordinate home sales, tours, and downsizing for you.", icon: Briefcase, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776663052480-67qzt7g8.jpg?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776663052480-67qzt7g8.jpg?_wi=2" }] },
+        { title: "Move-In Day", description: "From your parent's old living room to their new home, set up and ready.", icon: Home, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776663133033-7zneotse.jpg?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgAzSnGoyjp2WRFEpWFU41xUOw/uploaded-1776663133033-7zneotse.jpg?_wi=2" }] }
       ]}
       title="A Trusted, Four-Step Process"
       description="We simplify your parent's transition with clear steps and compassionate support."
@@ -134,4 +134,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}