From b4ff83f7f4250f5d3a48910ec98f7105cfbfd8fb Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 18 Mar 2026 16:10:18 +0000
Subject: [PATCH] Update src/app/about/page.tsx

---
 src/app/about/page.tsx | 200 ++++++++++++++++++++++-------------------
 1 file changed, 109 insertions(+), 91 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 7c9ccde..ecf17ef 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -5,10 +5,19 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
 import HeroSplit from "@/components/sections/hero/HeroSplit";
 import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
-import TimelineHorizontalCardStack from "@/components/cardStack/layouts/timelines/TimelineHorizontalCardStack";
+import TimelineProcessFlow from "@/components/cardStack/layouts/timelines/TimelineProcessFlow";
+import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
 import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
 import FooterMedia from "@/components/sections/footer/FooterMedia";
-import { Award, Heart, Zap, TrendingUp, Facebook } from "lucide-react";
+import {
+  Award,
+  Heart,
+  Zap,
+  TrendingUp,
+  Facebook,
+  Users,
+  Target,
+} from "lucide-react";
 
 export default function AboutPage() {
   const navItems = [
@@ -25,13 +34,13 @@ export default function AboutPage() {
       title: "Quick Links",      items: [
         { label: "Home", href: "/" },
         { label: "Menu", href: "/menu" },
-        { label: "Gallery", href: "/" },
+        { label: "Gallery", href: "/gallery" },
         { label: "Reviews", href: "/" },
       ],
     },
     {
       title: "Order & Contact",      items: [
-        { label: "Order Online", href: "/" },
+        { label: "Order Online", href: "/menu" },
         { label: "Call Us", href: "tel:2397850423" },
         { label: "Locations & Hours", href: "/" },
         { label: "Contact", href: "/" },
@@ -55,6 +64,51 @@ export default function AboutPage() {
     },
   ];
 
+  const timelineItems = [
+    {
+      id: "founded",      content: (
+        <div>
+          <h3 className="text-xl font-bold mb-2">Founded Caribbean Flair</h3>
+          <p>Teria Bryant and Deb Farrell launch their dream of bringing authentic Jamaican cuisine to Lehigh Acres with passion and purpose.</p>
+        </div>
+      ),
+      media: (
+        <div className="bg-gradient-to-br from-orange-400 to-red-500 rounded-lg h-full flex items-center justify-center text-white text-3xl font-bold">
+          2023
+        </div>
+      ),
+      reverse: false,
+    },
+    {
+      id: "community",      content: (
+        <div>
+          <h3 className="text-xl font-bold mb-2">Community Reception</h3>
+          <p>The community embraces Caribbean Flair, supporting Black-owned and women-owned business excellence and authentic Caribbean culture.</p>
+        </div>
+      ),
+      media: (
+        <div className="bg-gradient-to-br from-blue-400 to-purple-500 rounded-lg h-full flex items-center justify-center text-white text-3xl font-bold">
+          2024
+        </div>
+      ),
+      reverse: true,
+    },
+    {
+      id: "growth",      content: (
+        <div>
+          <h3 className="text-xl font-bold mb-2">Expansion & Recognition</h3>
+          <p>Caribbean Flair becomes a beloved staple in Lehigh Acres, serving thousands of satisfied customers and earning 5-star recognition.</p>
+        </div>
+      ),
+      media: (
+        <div className="bg-gradient-to-br from-green-400 to-emerald-500 rounded-lg h-full flex items-center justify-center text-white text-3xl font-bold">
+          2025
+        </div>
+      ),
+      reverse: false,
+    },
+  ];
+
   return (
     <ThemeProvider
       defaultButtonVariant="bounce-effect"
@@ -81,19 +135,19 @@ export default function AboutPage() {
       {/* Hero Section */}
       <div id="hero" data-section="hero">
         <HeroSplit
-          title="Our Caribbean Journey"
-          description="Meet the visionaries behind Caribbean Flair: Teria Bryant and Deb Farrell. Bringing authentic island flavors and Black & women-owned excellence to Lehigh Acres."
-          tag="About Our Story"
+          title="Our Island Story"
+          description="Teria Bryant and Deb Farrell: Two passionate entrepreneurs bringing authentic Jamaican soul and Caribbean excellence to Lehigh Acres through authentic flavors and community-first business."
+          tag="Community Leaders"
           tagIcon={Award}
           tagAnimation="slide-up"
           background={{ variant: "glowing-orb" }}
           buttons={[
             {
-              text: "Order Online Now",              href: "/menu"},
+              text: "Order Now",              href: "/menu"},
           ]}
           buttonAnimation="slide-up"
           imageSrc="http://img.b2bpic.net/free-vector/summer-label-collectio_23-2148160410.jpg"
-          imageAlt="Caribbean Flair Story"
+          imageAlt="Caribbean Flair About Us"
           mediaAnimation="opacity"
           imagePosition="right"
           ariaLabel="About us hero section"
@@ -104,7 +158,7 @@ export default function AboutPage() {
       <div id="owners-spotlight" data-section="owners-spotlight">
         <TeamCardTwo
           title="Meet the Island Visionaries"
-          description="Teria Bryant and Deb Farrell: Passionate Black-owned, women-owned entrepreneurs bringing authentic Caribbean soul to Lehigh Acres with decades of culinary expertise and community commitment."
+          description="Teria Bryant and Deb Farrell: Passionate Black-owned, women-owned entrepreneurs bringing authentic Caribbean soul to Lehigh Acres."
           tag="Our Founders"
           tagIcon={Heart}
           tagAnimation="slide-up"
@@ -115,7 +169,7 @@ export default function AboutPage() {
           members={[
             {
               id: "teria-bryant",              name: "Teria Bryant",              role: "Founder & Head Chef",              description:
-                "Teria brings 15+ years of Caribbean culinary expertise and authentic island passion to every dish. Her vision transformed Caribbean Flair from a dream into a premium dining destination serving Lehigh Acres with pride. With deep roots in Jamaican cooking traditions, Teria ensures every plate delivers the bold flavors and soul that define our brand.",              imageSrc:
+                "Teria brings 15+ years of Caribbean culinary expertise and authentic island passion to every dish. Her vision transformed Caribbean Flair from a dream into a premium dining destination serving Lehigh Acres with pride and excellence.",              imageSrc:
                 "http://img.b2bpic.net/free-photo/medium-shot-professional-chef-working_23-2151232185.jpg?_wi=1",              imageAlt: "Teria Bryant, founder of Caribbean Flair",              socialLinks: [
                 {
                   icon: Facebook,
@@ -124,7 +178,7 @@ export default function AboutPage() {
             },
             {
               id: "deb-farrell",              name: "Deb Farrell",              role: "Co-Owner & Operations Lead",              description:
-                "Deb ensures every customer experience is smooth, welcoming, and unforgettable. Together with Teria, she's building a thriving Black- and women-owned business that celebrates Caribbean culture and community impact. With a passion for hospitality and business excellence, Deb has been instrumental in creating the warm, authentic atmosphere that defines Caribbean Flair.",              imageSrc:
+                "Deb ensures every customer experience is smooth, welcoming, and unforgettable. Together with Teria, she's building a thriving Black- and women-owned business that celebrates Caribbean culture and community impact.",              imageSrc:
                 "http://img.b2bpic.net/free-photo/successful-business-woman-blue-suit_158595-5024.jpg?_wi=1",              imageAlt: "Deb Farrell, co-owner of Caribbean Flair",              socialLinks: [
                 {
                   icon: Facebook,
@@ -137,109 +191,73 @@ export default function AboutPage() {
 
       {/* Brand Story Timeline */}
       <div id="brand-story" data-section="brand-story">
-        <TimelineHorizontalCardStack
-          title="Our Island Journey"
-          description="From concept to community favorite: the authentic story of Caribbean Flair's growth and commitment to excellence."
-          tag="Our Timeline"
-          tagIcon={Zap}
+        <TimelineProcessFlow
+          title="Our Journey"
+          description="From vision to reality—the Caribbean Flair story of authentic flavors, community pride, and culinary excellence."
+          tag="Our Evolution"
+          tagIcon={Target}
           tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="slide-up"
+          items={timelineItems}
           buttons={[
             {
-              text: "Explore Our Menu",              href: "/menu"},
+              text: "Join Our Story",              href: "/menu"},
           ]}
-          buttonAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={true}
-        >
-          <div className="flex gap-6 overflow-x-auto pb-6 px-4">
-            {[
-              {
-                year: "2020",                milestone: "The Dream Begins",                description: "Teria and Deb unite their culinary passion and business vision to create Caribbean Flair, dreaming of bringing authentic island flavors to Lehigh Acres."},
-              {
-                year: "2021",                milestone: "Launch Day",                description: "Caribbean Flair opens its doors with a full menu of signature dishes, jerk specialties, and authentic Caribbean sides prepared fresh daily."},
-              {
-                year: "2022",                milestone: "Community Love",                description: "Rapidly becomes a local favorite. Customers praise the authenticity, quality, and genuine warmth of Teria and Deb's hospitality."},
-              {
-                year: "2023",                milestone: "Expansion & Recognition",                description: "Expanded menu offerings, grew customer base, and received recognition as a standout Black & women-owned business in the community."},
-              {
-                year: "2024",                milestone: "Island Excellence",                description: "Continues to deliver premium authentic Caribbean cuisine while expanding delivery options and growing community presence."},
-            ].map((item, index) => (
-              <div
-                key={index}
-                className="flex-shrink-0 w-80 bg-[var(--card)] rounded-lg p-6 border border-[var(--accent)]/20 hover:border-[var(--accent)]/50 transition-colors"
-              >
-                <div className="text-3xl font-bold text-[var(--primary-cta)] mb-2">
-                  {item.year}
-                </div>
-                <h3 className="text-xl font-semibold text-[var(--foreground)] mb-2">
-                  {item.milestone}
-                </h3>
-                <p className="text-[var(--foreground)]/70">{item.description}</p>
-              </div>
-            ))}
-          </div>
-        </TimelineHorizontalCardStack>
+        />
       </div>
 
       {/* Community Impact Section */}
       <div id="community-impact" data-section="community-impact">
+        <SocialProofOne
+          names={[
+            "Supporting Local Economy",            "Women Empowerment",            "Black Business Excellence",            "Community Events",            "Authentic Jamaican Culture",            "Local Partnerships"]}
+          title="Community Impact"
+          description="Caribbean Flair is more than a restaurant—we're a force for community pride, Black excellence, and women empowerment in Lehigh Acres."
+          tag="Making a Difference"
+          tagIcon={Users}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={true}
+          showCard={true}
+          buttons={[
+            {
+              text: "Support Local Business",              href: "/menu"},
+          ]}
+        />
+      </div>
+
+      {/* Final CTA Section */}
+      <div id="final-cta" data-section="final-cta">
         <FeatureCardTen
-          title="Community Impact & Our Commitment"
-          description="Caribbean Flair is more than a food truck—we're committed to celebrating Black and women-owned excellence, supporting local communities, and bringing authentic Caribbean culture to Lehigh Acres."
-          tag="Community First"
-          tagIcon={Heart}
+          title="Experience Our Island Story"
+          description="Join Teria, Deb, and the Caribbean Flair community. Every meal supports Black- and women-owned business excellence and authentic Caribbean culture."
+          tag="Be Part of Our Journey"
+          tagIcon={Zap}
           tagAnimation="slide-up"
           buttons={[
             {
-              text: "Support Local",              href: "/menu"},
+              text: "Order Now",              href: "/menu"},
+            {
+              text: "Call (239) 785-0423",              href: "tel:2397850423"},
           ]}
           buttonAnimation="slide-up"
           textboxLayout="default"
           animationType="slide-up"
-          useInvertedBackground={false}
+          useInvertedBackground={true}
           features={[
             {
-              id: "authentic-flavors",              title: "Authentic Island Flavors",              description:
-                "Every dish is prepared with traditional Jamaican techniques and the freshest ingredients, honoring Caribbean culinary heritage.",              media: {
+              id: "mission",              title: "Our Mission",              description:
+                "Deliver authentic Caribbean excellence while uplifting our community through Black- and women-owned business pride.",              media: {
                 imageSrc:
-                  "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Afn0reuidgadYlHif4J2xHlmq8/uploaded-1773849790665-2gw0wih3.jpg"},
-              items: [
-                {
-                  icon: Award,
-                  text: "Authentic recipes passed down through generations"},
-                {
-                  icon: TrendingUp,
-                  text: "Fresh ingredients sourced with care"},
-              ],
-              reverse: false,
-            },
-            {
-              id: "women-empowerment",              title: "Women & Black Business Excellence",              description:
-                "As a Black & women-owned enterprise, we're proud to inspire our community and demonstrate the power of entrepreneurship, passion, and determination.",              media: {
-                imageSrc:
-                  "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Afn0reuidgadYlHif4J2xHlmq8/uploaded-1773849790665-wha24yfi.jpg"},
+                  "http://img.b2bpic.net/free-photo/side-view-smiley-man-getting-coffee_23-2149663609.jpg?_wi=1"},
               items: [
                 {
                   icon: Heart,
-                  text: "Celebrating Black & women entrepreneurs"},
-                {
-                  icon: Zap,
-                  text: "Building generational wealth through excellence"},
-              ],
-              reverse: true,
-            },
-            {
-              id: "community-engagement",              title: "Community Engagement & Support",              description:
-                "We're invested in our Lehigh Acres community, supporting local events, collaborations, and initiatives that strengthen our neighborhood.",              media: {
-                imageSrc:
-                  "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Afn0reuidgadYlHif4J2xHlmq8/uploaded-1773849790665-qcfdeh7f.jpg"},
-              items: [
-                {
-                  icon: Award,
-                  text: "Active in local community events"},
+                  text: "Authentic Flavors"},
                 {
                   icon: TrendingUp,
-                  text: "Supporting neighborhood growth & connection"},
+                  text: "Community Pride"},
               ],
               reverse: false,
             },