Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,15 +3,15 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactCTA from '@/components/sections/contact/ContactCTA';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import ContactText from '@/components/sections/contact/ContactText';
+import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
-import FooterCard from '@/components/sections/footer/FooterCard';
+import FooterBase from '@/components/sections/footer/FooterBase';
 import HeroOverlay from '@/components/sections/hero/HeroOverlay';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
-import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
-import { Award, Linkedin, TrendingUp, Twitter, Users } from "lucide-react";
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
+import { Award, TrendingUp, Users } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -31,85 +31,35 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingInline
       navItems={[
-        {
-          name: "Home",
-          id: "home",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "services",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Home", id: "home" },
+        { name: "About", id: "about" },
+        { name: "Testimonials", id: "testimonials" },
+        { name: "FAQ", id: "faq" },
+        { name: "Contact", id: "contact" },
       ]}
-      brandName="BusinessPro"
+      brandName="BusinessPro Saudi Arabia"
+      button={{ text: "Get Started", href: "#contact" }}
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroOverlay
       title="Elevating Your Business Vision"
-      description="We provide innovative strategies and high-quality solutions to help your business scale efficiently in the modern marketplace."
-      buttons={[
-        {
-          text: "Get Started",
-          href: "#contact",
-        },
-      ]}
+      description="We provide innovative strategies and high-quality solutions to help your business scale efficiently in the Saudi Arabian market."
+      buttons={[{ text: "Get Started", href: "#contact" }]}
       imageSrc="http://img.b2bpic.net/free-photo/angry-female-ceo-yelling-her-executive-assistants-due-business-failure_482257-120044.jpg"
       showBlur={true}
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-blonde-confident-young-businesswoman-against-gray-background_23-2148029500.jpg",
-          alt: "Client 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg",
-          alt: "Client 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/happy-smiling-businesswoman-looking-camera-with-arms-crossed-portrait_1163-4337.jpg",
-          alt: "Client 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/young-blonde-businesswoman-smiling-happy-standing-city_839833-14128.jpg",
-          alt: "Client 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/businessman-smiling-looking-camera_23-2148112827.jpg",
-          alt: "Client 5",
-        },
-      ]}
-      avatarText="Trusted by 500+ professionals"
     />
   </div>
 
   <div id="about" data-section="about">
       <AboutMetric
       useInvertedBackground={false}
-      title="Impact Driven Growth"
+      title="Impact Driven Growth in KSA"
       metrics={[
-        {
-          icon: Users,
-          label: "Clients Served",
-          value: "500+",
-        },
-        {
-          icon: TrendingUp,
-          label: "Growth Rate",
-          value: "150%",
-        },
-        {
-          icon: Award,
-          label: "Awards Won",
-          value: "25+",
-        },
+        { icon: Users, label: "Clients Served", value: "500+" },
+        { icon: TrendingUp, label: "Growth Rate", value: "150%" },
+        { icon: Award, label: "Awards Won", value: "25+" },
       ]}
       metricsAnimation="slide-up"
     />
@@ -119,23 +69,11 @@ export default function LandingPage() {
       <FeatureCardTwentyOne
       useInvertedBackground={false}
       title="Comprehensive Business Services"
-      description="Explore our core services tailored for modern business growth and optimization."
+      description="Tailored solutions for modern business growth and operations in Saudi Arabia."
       accordionItems={[
-        {
-          id: "f1",
-          title: "Strategic Consulting",
-          content: "Tailored roadmaps for sustainable growth.",
-        },
-        {
-          id: "f2",
-          title: "Digital Transformation",
-          content: "Modernizing legacy systems with latest tech.",
-        },
-        {
-          id: "f3",
-          title: "Brand Development",
-          content: "Creating identities that resonate globally.",
-        },
+        { id: "f1", title: "Strategic Consulting", content: "Roadmaps aligned with Vision 2030 objectives." },
+        { id: "f2", title: "Digital Transformation", content: "Modernizing legacy systems with localized tech solutions." },
+        { id: "f3", title: "Brand Development", content: "Creating identities that resonate with the Saudi market." },
       ]}
       mediaAnimation="slide-up"
       imageSrc="http://img.b2bpic.net/free-photo/multiethnic-leaders-business-meeting-brainstorming-growth-strategy_482257-124049.jpg"
@@ -149,143 +87,65 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
       products={[
-        {
-          id: "p1",
-          name: "Starter Toolkit",
-          price: "$199",
-          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-office-desk-arrangement_23-2148707946.jpg",
-        },
-        {
-          id: "p2",
-          name: "Analytics Pro",
-          price: "$499",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-carpenter-showing-digital-tablet-his-hand_23-2147945078.jpg",
-        },
-        {
-          id: "p3",
-          name: "SaaS Platform",
-          price: "$899",
-          imageSrc: "http://img.b2bpic.net/free-photo/staistics-business-strategy-planning-research-digital-tablet-concept_53876-26413.jpg",
-        },
-        {
-          id: "p4",
-          name: "Growth Suite",
-          price: "$299",
-          imageSrc: "http://img.b2bpic.net/free-photo/glossy-gradient-facebook-logo_23-2152009926.jpg",
-        },
-        {
-          id: "p5",
-          name: "Efficiency Pack",
-          price: "$399",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-business-desk-arrangement_23-2148128260.jpg",
-        },
-        {
-          id: "p6",
-          name: "Ultimate Hub",
-          price: "$999",
-          imageSrc: "http://img.b2bpic.net/free-vector/abstract-modern-business-card_1017-8642.jpg",
-        },
+        { id: "p1", name: "KSA Starter Toolkit", price: "SAR 750", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-office-desk-arrangement_23-2148707946.jpg" },
+        { id: "p2", name: "Analytics Pro", price: "SAR 1900", imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-carpenter-showing-digital-tablet-his-hand_23-2147945078.jpg" },
+        { id: "p3", name: "SaaS Enterprise", price: "SAR 3400", imageSrc: "http://img.b2bpic.net/free-photo/staistics-business-strategy-planning-research-digital-tablet-concept_53876-26413.jpg" },
       ]}
       title="Strategic Toolkits"
-      description="Premium resources and tools to jumpstart your business operations."
+      description="Premium resources and tools optimized for the local market."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFifteen
+      <TestimonialCardThirteen
+      title="Customer Success Stories"
+      description="What our partners across the Kingdom say about working with us."
+      showRating={true}
       useInvertedBackground={false}
-      testimonial="The service provided was exceptional. Our growth metrics have doubled in six months thanks to their strategic guidance."
-      rating={5}
-      author="Sarah Miller"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-portrait-professional-business-woman-smiling-outdoor_1391-4.jpg",
-          alt: "Client 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/pensive-middle-aged-man-with-beard-hairstyle-dressed-elegant-blue-suit-textured-dark-background-studio_613910-19917.jpg",
-          alt: "Client 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/smiley-tattoo-artist-indoors-side-view_23-2149445974.jpg",
-          alt: "Client 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-confident-male-employee-white-collar-shirt-smiling-camera-standing-self-assured-against-studio-background_1258-26761.jpg",
-          alt: "Client 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
-          alt: "Client 5",
-        },
+      animationType="slide-up"
+      textboxLayout="default"
+      testimonials={[
+        { id: "t1", name: "Sarah Miller", handle: "@smiller", testimonial: "Exceptional service that helped us grow significantly in the Saudi market.", rating: 5 },
+        { id: "t2", name: "John Davis", handle: "@jdavis", testimonial: "Strategic guidance provided was truly transformative for our regional operations.", rating: 5 },
+        { id: "t3", name: "Amira Khalid", handle: "@akhalid", testimonial: "Professionalism and efficiency at every step. Excellent local insights.", rating: 5 },
       ]}
-      ratingAnimation="slide-up"
-      avatarsAnimation="slide-up"
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",
-          title: "Do you offer consultations?",
-          content: "Yes, we offer complimentary initial discovery calls.",
-        },
-        {
-          id: "q2",
-          title: "What industries do you serve?",
-          content: "We support a wide array of sectors from tech to retail.",
-        },
-        {
-          id: "q3",
-          title: "How do we get started?",
-          content: "Simply fill out our contact form and our team will follow up.",
-        },
-      ]}
-      sideTitle="Common Inquiries"
+      <FaqBase
+      title="Payment Plans"
+      description="Everything you need to know about our local payment options."
       faqsAnimation="slide-up"
+      useInvertedBackground={false}
+      textboxLayout="split"
+      faqs={[
+        { id: "q1", title: "Do you support local payment methods?", content: "Yes, we support Mada, STC Pay, and all major regional banking transfers." },
+        { id: "q2", title: "Is VAT applicable?", content: "Yes, all prices mentioned are subject to 15% VAT as per KSA regulations." },
+        { id: "q3", title: "Can I pay in SAR?", content: "Absolutely, our services are priced and invoiced in SAR for local businesses." },
+      ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCTA
+      <ContactText
+      text="Our Riyadh and Jeddah offices are ready to assist you. Contact us for local inquiries."
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Get in touch"
-      title="Ready to transform your business?"
-      description="Let's build something great together. Our experts are standing by."
-      buttons={[
-        {
-          text: "Contact Us",
-          href: "mailto:hello@business.com",
-        },
-      ]}
+      background={{ variant: "plain" }}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="BusinessPro"
-      copyrightText="© 2025 BusinessPro. All rights reserved."
-      socialLinks={[
-        {
-          icon: Twitter,
-          href: "https://twitter.com",
-          ariaLabel: "Twitter",
-        },
-        {
-          icon: Linkedin,
-          href: "https://linkedin.com",
-          ariaLabel: "LinkedIn",
-        },
+      <FooterBase
+      logoText="BusinessPro KSA"
+      copyrightText="© 2025 BusinessPro Saudi Arabia. All rights reserved."
+      columns={[
+        { title: "Operations", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
+        { title: "Compliance", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
       ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,14 +10,14 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f5f5;
-  --card: #ffffff;
+  --background: #ffffff;
+  --card: #f9f9f9;
   --foreground: #1c1c1c;
-  --primary-cta: #1c1c1c;
+  --primary-cta: #15479c;
   --primary-cta-text: #f5f5f5;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #e2e2e2;
   --secondary-cta-text: #1c1c1c;
-  --accent: #15479c;
+  --accent: #0a7039;
   --background-accent: #a8cce8;
 
   /* text sizing - set by ThemeProvider */