Merge version_4_1782165184268 into main

Bob AI: Update content to match Maru Quick provided code
2026-06-22 21:57:29 +00:00 · 2026-06-22 21:56:46 +00:00 · 2026-06-22 21:47:21 +00:00 · 2026-06-22 21:46:42 +00:00 · 2026-06-22 21:44:25 +00:00 · 2026-06-22 21:43:42 +00:00
11 changed files with 327 additions and 315 deletions
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -8,25 +8,16 @@ import { StyleProvider } from "@/components/ui/StyleProvider";
 export default function Layout() {
  const navItems = [
  {
-    "name": "About",    "href": "#about"
+    "name": "Supply Portal",    "href": "#"
  },
  {
-    "name": "Features",    "href": "#features"
-  },
-  {
-    "name": "Pricing",    "href": "#pricing"
+    "name": "Offers",    "href": "#"
  },
  {
    "name": "Contact",    "href": "#contact"
  },
  {
-    "name": "Hero",    "href": "#hero"
-  },
-  {
-    "name": "Bento",    "href": "#bento"
-  },
-  {
-    "name": "Testimonial",    "href": "#testimonial"
+    "name": "About Us",    "href": "#about"
  }
 ];

@@ -47,43 +38,55 @@ export default function Layout() {
      <SectionErrorBoundary name="footer">
        <FooterSimpleMedia
      imageSrc="http://img.b2bpic.net/free-photo/hallway-building_23-2149397604.jpg"
-      brand="DevSync"
+      brand="Maru Quick"
      columns={[
-        {
-          title: "Platform",          items: [
-            {
-              label: "Infrastructure",              href: "#"},
-            {
-              label: "Security",              href: "#"},
-            {
-              label: "Integrations",              href: "#"},
-          ],
-        },
        {
          title: "Company",          items: [
            {
-              label: "About",              href: "#"},
+              label: "About Us",              href: "#"},
            {
-              label: "Blog",              href: "#"},
+              label: "Supply Portal",              href: "#"},
            {
-              label: "Careers",              href: "#"},
+              label: "Offers",              href: "#"},
+            {
+              label: "Sign Up",              href: "#"},
+            {
+              label: "Login",              href: "#"},
          ],
        },
        {
-          title: "Legal",          items: [
+          title: "Platform",          items: [
            {
-              label: "Privacy",              href: "#"},
+              label: "POS Software",              href: "#features"},
            {
-              label: "Terms",              href: "#"},
+              label: "Card Payments",              href: "#pricing"},
+            {
+              label: "Mobile Wallets",              href: "#pricing"},
+            {
+              label: "Get Started",              href: "#faq"},
+            {
+              label: "Support",              href: "#contact"},
+          ],
+        },
+        {
+          title: "Contact",          items: [
+            {
+              label: "Gaborone, Botswana",              href: "#"},
+            {
+              label: "maruquickbotswana@gmail.com",              href: "mailto:maruquickbotswana@gmail.com"},
+            {
+              label: "+267 72 112 839",              href: "tel:+26772112839"},
          ],
        },
      ]}
-      copyright="© 2024 DevSync Platform Inc."
+      copyright="© 2025 Maru Quick. All rights reserved. Registered in Botswana."
      links={[
        {
-          label: "Twitter",          href: "#"},
+          label: "Privacy Policy",          href: "#"},
        {
-          label: "GitHub",          href: "#"},
+          label: "Terms of Service",          href: "#"},
+        {
+          label: "Contact Us",          href: "#contact"},
      ]}
    />
      </SectionErrorBoundary>
--- a/src/index.css
+++ b/src/index.css
@@ -32,21 +32,21 @@
  --width-carousel-item-3: calc(var(--width-content-width) / 3 - var(--vw-1_5) / 3 * 2);
  --width-carousel-item-4: calc(var(--width-content-width) / 4 - var(--vw-1_5) / 4 * 3);

-  /* @typography/text-sizing/medium */
-  --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
-  --text-xs: clamp(0.54rem, 0.72vw, 0.72rem);
-  --text-sm: clamp(0.615rem, 0.82vw, 0.82rem);
-  --text-base: clamp(0.69rem, 0.92vw, 0.92rem);
-  --text-lg: clamp(0.75rem, 1vw, 1rem);
-  --text-xl: clamp(0.825rem, 1.1vw, 1.1rem);
-  --text-2xl: clamp(0.975rem, 1.3vw, 1.3rem);
-  --text-3xl: clamp(1.2rem, 1.6vw, 1.6rem);
-  --text-4xl: clamp(1.5rem, 2vw, 2rem);
-  --text-5xl: clamp(2.025rem, 2.75vw, 2.75rem);
-  --text-6xl: clamp(2.475rem, 3.3vw, 3.3rem);
-  --text-7xl: clamp(3rem, 4vw, 4rem);
-  --text-8xl: clamp(3.5rem, 4.5vw, 4.5rem);
-  --text-9xl: clamp(5.25rem, 7vw, 7rem);
+  /* @typography/text-sizing/large */
+  --text-2xs: clamp(0.6rem, 0.8vw, 0.8rem);
+  --text-xs: clamp(0.7rem, 0.9vw, 0.9rem);
+  --text-sm: clamp(0.8rem, 1vw, 1rem);
+  --text-base: clamp(1rem, 1.2vw, 1.2rem);
+  --text-lg: clamp(1.1rem, 1.4vw, 1.4rem);
+  --text-xl: clamp(1.3rem, 1.7vw, 1.7rem);
+  --text-2xl: clamp(1.6rem, 2.1vw, 2.1rem);
+  --text-3xl: clamp(2rem, 2.6vw, 2.6rem);
+  --text-4xl: clamp(2.5rem, 3.4vw, 3.4rem);
+  --text-5xl: clamp(3.2rem, 4.5vw, 4.5rem);
+  --text-6xl: clamp(4rem, 5.8vw, 5.8rem);
+  --text-7xl: clamp(5rem, 7.5vw, 7.5rem);
+  --text-8xl: clamp(6.5rem, 9.5vw, 9.5rem);
+  --text-9xl: clamp(8.5rem, 12.5vw, 12.5rem);
 }

 /* @typography/text-sizing/medium (mobile) */
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -1,280 +1,36 @@
-import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
-import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
-import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
-import HeroTiltedCards from '@/components/sections/hero/HeroTiltedCards';
-import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
-import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+// AUTO-GENERATED shell by per-section-migrate.
+// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
+// files directly. Non-block content (wrappers, non-inlinable sections) is
+// preserved inline; extracted section blocks become <XSection/> refs.

-export default function HomePage() {
+import React from 'react';
+import HeroSection from './HomePage/sections/Hero';
+import AboutSection from './HomePage/sections/About';
+import FeaturesSection from './HomePage/sections/Features';
+import BentoSection from './HomePage/sections/Bento';
+import PricingSection from './HomePage/sections/Pricing';
+import TestimonialSection from './HomePage/sections/Testimonial';
+import FaqSection from './HomePage/sections/Faq';
+import ContactSection from './HomePage/sections/Contact';
+
+export default function HomePage(): React.JSX.Element {
  return (
-    <>
-  <div id="hero" data-section="hero">
-    <SectionErrorBoundary name="hero">
-          <HeroTiltedCards
-      tag="Next-Gen Infrastructure"
-      title="Sync your entire workflow in one unified platform."
-      description="DevSync empowers modern engineering teams to scale with speed, security, and seamless integration."
-      primaryButton={{
-        text: "Get Started",
-        href: "#contact",
-      }}
-      secondaryButton={{
-        text: "View Features",
-        href: "#features",
-      }}
-      items={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/illustration-geometric-shapes-with-colorful-neon-laser-lights-perfect-backgrounds_181624-34429.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-with-connecting-lines-dots-structure_1048-13636.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/cosmic-environment-with-colorful-neon-laser-lights_181624-34446.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-closeup-shot-epcot-taken-night-with-amazing-colored-textures-dark-background_181624-2158.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+<>
+  <HeroSection />

-  <div id="about" data-section="about">
-    <SectionErrorBoundary name="about">
-          <AboutMediaOverlay
-      tag="Our Mission"
-      title="We build tools that define the future of development."
-      description="With over a decade of industry expertise, we specialize in building robust tools that streamline every part of the development lifecycle, ensuring our partners stay ahead in a rapidly changing market."
-      primaryButton={{
-        text: "Read About Us",
-        href: "#",
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/student-desk-with-computer-books-notepads-wooden-table_169016-55183.jpg"
-    />
-    </SectionErrorBoundary>
-  </div>
+  <AboutSection />

-  <div id="features" data-section="features">
-    <SectionErrorBoundary name="features">
-          <FeaturesArrowCards
-      tag="Core Capabilities"
-      title="Powerful features for engineering scale."
-      description="Our suite provides complete visibility and control over your tech ecosystem, from code to production."
-      items={[
-        {
-          title: "Rapid Deployment",
-          tags: [
-            "SaaS",
-            "CI/CD",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/hand-hold-space-rocket-paper-carving-with-sky-background_53876-30288.jpg",
-        },
-        {
-          title: "Secure Infrastructure",
-          tags: [
-            "Security",
-            "Compliance",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/computer-security-with-3d-shields-with-padlocks_107791-16214.jpg",
-        },
-        {
-          title: "Cloud Orchestration",
-          tags: [
-            "Cloud",
-            "Scalability",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-vector/flat-design-data-logo-template_23-2149199478.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FeaturesSection />

-  <div id="bento" data-section="bento">
-    <SectionErrorBoundary name="bento">
-          <FeaturesImageBento
-      tag="Product Gallery"
-      title="See DevSync in action."
-      description="A glimpse into the interface and capabilities that power our enterprise-grade architecture."
-      items={[
-        {
-          title: "Global CDN",
-          description: "High availability edge networks.",
-          imageSrc: "http://img.b2bpic.net/free-photo/dark-textured-surface-with-subtle-light_84443-73009.jpg",
-        },
-        {
-          title: "Metrics",
-          description: "Deep insights in real-time.",
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-frame-background-connecting-dots-digital-network-design_53876-153345.jpg",
-        },
-        {
-          title: "Workflow",
-          description: "Automated pipelines.",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-home-using-generative-artificial-intelligence-website-make-videos_482257-119719.jpg",
-        },
-        {
-          title: "Hardware",
-          description: "Server efficiency stats.",
-          imageSrc: "http://img.b2bpic.net/free-photo/technology-background-texture_23-2148105529.jpg",
-        },
-        {
-          title: "Automation",
-          description: "Self-healing code paths.",
-          imageSrc: "http://img.b2bpic.net/free-photo/vintage-collage-couple-hugging-bird_23-2149438110.jpg",
-        },
-        {
-          title: "Input",
-          description: "Enhanced development.",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-conducting-online-psychologist-therapy_23-2149407952.jpg",
-        },
-        {
-          title: "Glass UI",
-          description: "Seamless visual control.",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913793.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <BentoSection />

-  <div id="pricing" data-section="pricing">
-    <SectionErrorBoundary name="pricing">
-          <PricingHighlightedCards
-      tag="Flexible Plans"
-      title="Transparent pricing for any scale."
-      description="Start with our free tier and scale seamlessly into our enterprise solutions."
-      plans={[
-        {
-          tag: "Basic",
-          price: "$29/mo",
-          description: "Perfect for individuals and side projects.",
-          features: [
-            "1 API key",
-            "Standard support",
-            "Basic analytics",
-          ],
-          primaryButton: {
-            text: "Get Started",
-            href: "#",
-          },
-        },
-        {
-          tag: "Professional",
-          price: "$99/mo",
-          description: "Best for growing engineering teams.",
-          features: [
-            "10 API keys",
-            "24/7 support",
-            "Advanced analytics",
-          ],
-          highlight: "Recommended",
-          primaryButton: {
-            text: "Choose Pro",
-            href: "#",
-          },
-        },
-        {
-          tag: "Enterprise",
-          price: "Custom",
-          description: "Tailored for large-scale operations.",
-          features: [
-            "Unlimited keys",
-            "Dedicated manager",
-            "SLA guarantees",
-          ],
-          primaryButton: {
-            text: "Contact Sales",
-            href: "#contact",
-          },
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <PricingSection />

-  <div id="testimonial" data-section="testimonial">
-    <SectionErrorBoundary name="testimonial">
-          <TestimonialTrustCard
-      quote="DevSync completely transformed how we ship code. We have reduced our deployment latency by over 60% since implementation."
-      rating={5}
-      author="Sarah Chen, Chief Architect at InnovateLabs"
-      avatars={[
-        {
-          name: "Sarah",
-          imageSrc: "http://img.b2bpic.net/free-photo/videographer-smiling-camera-working-computer-editing-video-footage-audio-app-sitting-mo_482257-2649.jpg",
-        },
-        {
-          name: "Mike",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
-        },
-        {
-          name: "Emma",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-smiling-kitchen_107420-12357.jpg",
-        },
-        {
-          name: "David",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-man-sitting-front-laptop-workplace_23-2148187164.jpg",
-        },
-        {
-          name: "Chloe",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-employee-happy-be-back-work_23-2148727616.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <TestimonialSection />

-  <div id="faq" data-section="faq">
-    <SectionErrorBoundary name="faq">
-          <FaqTwoColumn
-      tag="Knowledge Base"
-      title="Frequently Asked Questions"
-      description="Everything you need to know about getting started."
-      items={[
-        {
-          question: "What integrations do you support?",
-          answer: "We support all major CI/CD providers including GitHub, GitLab, and Bitbucket out of the box.",
-        },
-        {
-          question: "Is my data secure?",
-          answer: "Your data is encrypted at rest and in transit with industry-standard TLS 1.3 and AES-256.",
-        },
-        {
-          question: "Can I switch plans anytime?",
-          answer: "Yes, you can upgrade, downgrade, or cancel your plan at any time through our dashboard.",
-        },
-        {
-          question: "Do you offer enterprise SLAs?",
-          answer: "Yes, we provide 99.99% uptime guarantees for our enterprise customers.",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FaqSection />

-  <div id="contact" data-section="contact">
-    <SectionErrorBoundary name="contact">
-          <ContactCta
-      tag="Get in Touch"
-      text="Ready to accelerate your engineering productivity? Connect with our team today."
-      primaryButton={{
-        text: "Schedule a Demo",
-        href: "#",
-      }}
-      secondaryButton={{
-        text: "Talk to Sales",
-        href: "#",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <ContactSection />
    </>
  );
 }
--- a/src/pages/HomePage/sections/About.tsx
+++ b/src/pages/HomePage/sections/About.tsx
@@ -0,0 +1,25 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "about" section.
+
+import React from 'react';
+import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function AboutSection(): React.JSX.Element {
+  return (
+    <div id="about" data-section="about">
+        <SectionErrorBoundary name="about">
+              <AboutMediaOverlay
+          tag="Our Mission"
+          title="We build tools that define the future of development."
+          description="With over a decade of industry expertise, we specialize in building robust tools that streamline every part of the development lifecycle, ensuring our partners stay ahead in a rapidly changing market."
+          primaryButton={{
+            text: "Read About Us",
+            href: "#",
+          }}
+          imageSrc="http://img.b2bpic.net/free-photo/student-desk-with-computer-books-notepads-wooden-table_169016-55183.jpg"
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Bento.tsx
+++ b/src/pages/HomePage/sections/Bento.tsx
@@ -0,0 +1,57 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "bento" section.
+
+import React from 'react';
+import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function BentoSection(): React.JSX.Element {
+  return (
+    <div id="bento" data-section="bento">
+        <SectionErrorBoundary name="bento">
+              <FeaturesImageBento
+          tag="Product Gallery"
+          title="See DevSync in action."
+          description="A glimpse into the interface and capabilities that power our enterprise-grade architecture."
+          items={[
+            {
+              title: "Global CDN",
+              description: "High availability edge networks.",
+              imageSrc: "http://img.b2bpic.net/free-photo/dark-textured-surface-with-subtle-light_84443-73009.jpg",
+            },
+            {
+              title: "Metrics",
+              description: "Deep insights in real-time.",
+              imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-frame-background-connecting-dots-digital-network-design_53876-153345.jpg",
+            },
+            {
+              title: "Workflow",
+              description: "Automated pipelines.",
+              imageSrc: "http://img.b2bpic.net/free-photo/woman-home-using-generative-artificial-intelligence-website-make-videos_482257-119719.jpg",
+            },
+            {
+              title: "Hardware",
+              description: "Server efficiency stats.",
+              imageSrc: "http://img.b2bpic.net/free-photo/technology-background-texture_23-2148105529.jpg",
+            },
+            {
+              title: "Automation",
+              description: "Self-healing code paths.",
+              imageSrc: "http://img.b2bpic.net/free-photo/vintage-collage-couple-hugging-bird_23-2149438110.jpg",
+            },
+            {
+              title: "Input",
+              description: "Enhanced development.",
+              imageSrc: "http://img.b2bpic.net/free-photo/person-conducting-online-psychologist-therapy_23-2149407952.jpg",
+            },
+            {
+              title: "Glass UI",
+              description: "Seamless visual control.",
+              imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913793.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Contact.tsx
+++ b/src/pages/HomePage/sections/Contact.tsx
@@ -0,0 +1,27 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "contact" section.
+
+import React from 'react';
+import ContactCta from '@/components/sections/contact/ContactCta';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ContactSection(): React.JSX.Element {
+  return (
+    <div id="contact" data-section="contact">
+        <SectionErrorBoundary name="contact">
+              <ContactCta
+          tag="Get in Touch"
+          text="Ready to accelerate your engineering productivity? Connect with our team today."
+          primaryButton={{
+            text: "Schedule a Demo",
+            href: "#",
+          }}
+          secondaryButton={{
+            text: "Talk to Sales",
+            href: "#",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Faq.tsx
+++ b/src/pages/HomePage/sections/Faq.tsx
@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "faq" section.
+
+import React from 'react';
+import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FaqSection(): React.JSX.Element {
+  return (
+    <div id="faq" data-section="faq">
+        <SectionErrorBoundary name="faq">
+              <FaqTwoColumn
+        tag="Get Started"
+        title="Get started with Maru Quick in 5 simple steps"
+        description="Ready to get started? Sign up now — it's free"
+        items={[{"answer":"Sign Up","question":"Step 1"},{"answer":"Log In","question":"Step 2"},{"answer":"Enter KYC information","question":"Step 3"},{"answer":"Wait for KYC verification","question":"Step 4"},{"answer":"Begin using the software","question":"Step 5"}]}
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Features.tsx
+++ b/src/pages/HomePage/sections/Features.tsx
@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "features" section.
+
+import React from 'react';
+import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FeaturesSection(): React.JSX.Element {
+  return (
+    <div id="features" data-section="features">
+        <SectionErrorBoundary name="features">
+              <FeaturesArrowCards
+        tag="Features"
+        title="All your business essentials. One Maru account."
+        description="Run sales, inventory, orders and reports in one system. Cut costs. No switching between platforms. One login. One source of truth."
+        items={[{"tags":["Software"],"imageSrc":"http://img.b2bpic.net/free-photo/hand-hold-space-rocket-paper-carving-with-sky-background_53876-30288.jpg","title":"Smart sales tools. Track every sale in real time with detailed reporting and inventory sync."},{"tags":["Payments"],"imageSrc":"http://img.b2bpic.net/free-photo/computer-security-with-3d-shields-with-padlocks_107791-16214.jpg","title":"Accept card payments fast and secure through the Maru Quick application at competitive rates."}]}
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Hero.tsx
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -0,0 +1,39 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "hero" section.
+
+import React from 'react';
+import HeroTiltedCards from '@/components/sections/hero/HeroTiltedCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div id="hero" data-section="hero">
+        <SectionErrorBoundary name="hero">
+              <HeroTiltedCards
+        tag="Empowering traders across Africa"
+        title="Record Sales, Receive Payments & Track Inventory — All on One Platform Built for MSMEs"
+        description="Run sales, inventory, and payments in one place. Built for traders across Africa."
+        primaryButton={{"text":"Explore Offers","href":"#"}}
+        secondaryButton={{"href":"#features","text":"See Features"}}
+        items={[
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/illustration-geometric-shapes-with-colorful-neon-laser-lights-perfect-backgrounds_181624-34429.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-with-connecting-lines-dots-structure_1048-13636.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/cosmic-environment-with-colorful-neon-laser-lights_181624-34446.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-closeup-shot-epcot-taken-night-with-amazing-colored-textures-dark-background_181624-2158.jpg",
+            },
+          ]}
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Pricing.tsx
+++ b/src/pages/HomePage/sections/Pricing.tsx
@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "pricing" section.
+
+import React from 'react';
+import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function PricingSection(): React.JSX.Element {
+  return (
+    <div id="pricing" data-section="pricing">
+        <SectionErrorBoundary name="pricing">
+              <PricingHighlightedCards
+        tag="Payments"
+        title="Streamline your sales with powerful payment solutions"
+        description="Accept cards, mobile wallets and online payments — all in one secure platform built for Botswana businesses."
+        plans={[{"price":"24/7","description":"Always available","tag":"Availability","primaryButton":{"href":"#","text":"Start accepting payments"},"features":[]},{"price":"3.0%","description":"Transaction fee","primaryButton":{"href":"#","text":"Start accepting payments"},"tag":"Fee","features":[]},{"price":"3","description":"Payment networks","tag":"Networks","primaryButton":{"href":"#","text":"Start accepting payments"},"features":[]}]}
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Testimonial.tsx
+++ b/src/pages/HomePage/sections/Testimonial.tsx
@@ -0,0 +1,42 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "testimonial" section.
+
+import React from 'react';
+import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialSection(): React.JSX.Element {
+  return (
+    <div id="testimonial" data-section="testimonial">
+        <SectionErrorBoundary name="testimonial">
+              <TestimonialTrustCard
+          quote="DevSync completely transformed how we ship code. We have reduced our deployment latency by over 60% since implementation."
+          rating={5}
+          author="Sarah Chen, Chief Architect at InnovateLabs"
+          avatars={[
+            {
+              name: "Sarah",
+              imageSrc: "http://img.b2bpic.net/free-photo/videographer-smiling-camera-working-computer-editing-video-footage-audio-app-sitting-mo_482257-2649.jpg",
+            },
+            {
+              name: "Mike",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
+            },
+            {
+              name: "Emma",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-smiling-kitchen_107420-12357.jpg",
+            },
+            {
+              name: "David",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-man-sitting-front-laptop-workplace_23-2148187164.jpg",
+            },
+            {
+              name: "Chloe",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-employee-happy-be-back-work_23-2148727616.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
Author	SHA1	Message	Date
bender	ad4c0989fc	Merge version_4_1782165184268 into main Merge version_4_1782165184268 into main	2026-06-22 21:57:29 +00:00
kudinDmitriyUp	edf030a642	Bob AI: Update content to match Maru Quick provided code	2026-06-22 21:56:46 +00:00
bender	99b7416957	Merge version_3_1782164766008 into main Merge version_3_1782164766008 into main	2026-06-22 21:47:21 +00:00
kudinDmitriyUp	b961e11070	Bob AI: Update typography scale for maximalistic Apple-inspired aest	2026-06-22 21:46:42 +00:00
bender	5303058d99	Merge version_2_1782164550400 into main Merge version_2_1782164550400 into main	2026-06-22 21:44:25 +00:00
kudinDmitriyUp	8b5fef203c	Bob AI: Updated typography scale to large for maximalistic aesthetic	2026-06-22 21:43:42 +00:00
bender	522970b38d	Merge version_1_1782164225381 into main Merge version_1_1782164225381 into main	2026-06-22 21:38:14 +00:00