Bob AI: add a FAQ section

src/app/page.tsx

@@ -11,6 +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';
 
 export default function LandingPage() {
   return (
@@ -227,6 +228,15 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="faq" data-section="faq">
+        <FaqSplitMedia faqs={[
+            { id: "1", title: "How do I set up my iPhone?", content: "Follow these steps to set up your new iPhone." },
+            { id: "2", title: "What are the best iPhone apps?", content: "Explore the top apps for productivity and entertainment." },
+            { id: "3", title: "How can I backup my iPhone?", content: "Learn how to backup your iPhone to iCloud or a computer." },
+            { id: "4", title: "What are the latest iPhone models?", content: "Discover the newest iPhone models with the latest features." }
+        ]} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" imageAlt="iPhone" title="iPhone FAQs" description="Find answers to common questions about your iPhone." textboxLayout="vertical" useInvertedBackground="light" />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterSimple
           columns={[