Bob AI: replace about section with TextAbout

src/app/page.tsx

@@ -13,6 +13,7 @@ import { Camera, Zap, Sparkles, Monitor, Shield, Star, Heart } from "lucide-reac
 import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
 import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
 import TeamCardOne1 from '@/components/sections/team/TeamCardOne1';
+import TextAbout from '@/components/sections/about/TextAbout';
 
 export default function LandingPage() {
   return (
@@ -252,6 +253,23 @@ export default function LandingPage() {
                 />
       </div>
 
+      <div id="about" data-section="about">
+        <TextAbout tag="Discover" tagIcon="LightBulb" title="Explore the Latest iPhone Models" buttons={[
+          {
+            label: "View Products",
+            href: "#products",
+            variant: "primary",
+            icon: "ArrowRight"
+          },
+          {
+            label: "Learn More",
+            href: "#features",
+            variant: "secondary",
+            icon: "Info"
+          }
+        ]} useInvertedBackground="invertDefault" className="bg-gray-900" containerClassName="max-w-5xl" titleClassName="text-white" buttonContainerClassName="justify-center" buttonClassName="bg-white text-black hover:bg-gray-200" buttonTextClassName="text-sm" />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterBase1
                   columns={[