Bob AI: add a team section

src/app/page.tsx

@@ -11,7 +11,7 @@ import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 import { Zap, Star, Sparkles, CreditCard, Heart } from "lucide-react";
-import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import TeamCardOne from '@/components/sections/team/TeamCardOne';
 
 export default function LandingPage() {
   return (
@@ -228,12 +228,49 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="faq" data-section="faq">
+      <div id="team" data-section="team">
-        <FaqSplitMedia faqs={[
+        <TeamCardOne
-            {id: "1", title: "How do I set up my iPhone?", content: "Follow the on-screen instructions during the first setup to set up your iPhone."},
+            members={[
-            {id: "2", title: "What is iCloud?", content: "iCloud is a cloud storage and cloud computing service from Apple that allows you to store your data on remote servers managed by Apple."},
+                { id: "1", name: "John Doe", role: "Lead Developer", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "John Doe" },
-            {id: "3", title: "How can I back up my iPhone?", content: "You can back up your iPhone using iCloud or by connecting it to your computer with a USB cable."}
+                { id: "2", name: "Jane Smith", role: "UX Designer", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Jane Smith" },
-        ]} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" imageAlt="iPhone" title="iPhone FAQ" description="Have questions about your new iPhone? Find answers to the most common questions here." textboxLayout="vertical" useInvertedBackground="light" animationType="smooth" showCard={true} ariaLabel="iPhone FAQ section" className="faq-split-media" containerClassName="faq-container" textBoxTitleClassName="faq-title" textBoxDescriptionClassName="faq-description" textBoxClassName="faq-box" mediaWrapperClassName="faq-media-wrapper" mediaClassName="faq-media" faqsContainerClassName="faq-items-container" accordionClassName="faq-accordion" accordionTitleClassName="faq-accordion-title" accordionContentClassName="faq-accordion-content" />
+                { id: "3", name: "Mike Johnson", role: "Marketing Specialist", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Mike Johnson" },
+                { id: "4", name: "Emily Davis", role: "iOS Developer", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Emily Davis" }
+            ]}
+            carouselMode="buttons"
+            gridVariant="grid-2"
+            uniformGridCustomHeightClasses=""
+            animationType="3d-flip"
+            title="Our Team"
+            description="Meet the team behind the iPhone app, dedicated to bringing you the best mobile experience."
+            tag="iPhone"
+            tagIcon="Smartphone"
+            buttons={[
+                { label: "Contact", href: "#contact", variant: "primary" },
+                { label: "Learn More", href: "#about", variant: "secondary" }
+            ]}
+            textboxLayout="vertical"
+            useInvertedBackground="light"
+            ariaLabel="Team Members"
+            className=""
+            containerClassName=""
+            cardClassName=""
+            textBoxTitleClassName=""
+            textBoxTitleImageWrapperClassName=""
+            textBoxTitleImageClassName=""
+            textBoxDescriptionClassName=""
+            imageClassName=""
+            overlayClassName=""
+            nameClassName=""
+            roleClassName=""
+            gridClassName=""
+            carouselClassName=""
+            controlsClassName=""
+            textBoxClassName=""
+            textBoxTagClassName=""
+            textBoxButtonContainerClassName=""
+            textBoxButtonClassName=""
+            textBoxButtonTextClassName=""
+        />
       </div>
 
       <div id="footer" data-section="footer">