Bob AI: [Block: faq-split-media|FAQ Split Media|/blocks/fa...

src/app/page.tsx

@@ -10,6 +10,7 @@ import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import { Sparkles, Star, Zap } from "lucide-react";
 import FAQAccordion from '@/components/sections/faq/FAQAccordion';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 
 export default function FitForcePage() {
   return (
@@ -209,6 +210,14 @@ export default function FitForcePage() {
         </FAQAccordion>
       </div>
 
+      <div id="faq" data-section="faq">
+        <FaqSplitMedia faqs={[
+            {id: "1", title: "How do I sign up for a membership?", content: "You can sign up for a FitForce membership by visiting our website and clicking the 'Join Now' button."},
+            {id: "2", title: "What equipment is available?", content: "We offer a wide range of equipment including treadmills, ellipticals, free weights, and more."},
+            {id: "3", title: "Are there any age restrictions?", content: "Our gym is open to all ages, but children under 16 must be accompanied by an adult."}
+        ]} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" imageAlt="Gym equipment" mediaPosition="left" title="Frequently Asked Questions" description="Have questions about our services? Check out our FAQ section for answers to common inquiries." textboxLayout="vertical" useInvertedBackground="light" />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterLogoEmphasis
           logoText="FitForce"

src/app/styles/variables.css

@@ -10,10 +10,10 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #fcf6ec;
+  --background: #ffffff;
   --card: #f3ede2;
   --foreground: #2e2521;
-  --primary-cta: #2e2521;
+  --primary-cta: #6c5ce7;
   --secondary-cta: #ffffff;
   --accent: #b2a28b;
   --background-accent: #b2a28b;