Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-22 18:03:10 +00:00

View File

@@ -2,6 +2,7 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import { Smartphone, Target, TrendingUp, Wallet } from "lucide-react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
@@ -12,411 +13,181 @@ import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatin
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import { Smartphone, Target, TrendingUp, Wallet } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="large"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "The Problem",
id: "#problem",
},
{
name: "How It Works",
id: "#how-it-works",
},
{
name: "Our Strategy",
id: "#strategy",
},
{
name: "About Us",
id: "#about",
},
{
name: "Contact",
id: "#contact",
},
]}
brandName="SikaGrow"
button={{
text: "Get Started",
href: "#contact",
}}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="SikaGrow"
navItems={[
{ name: "Problem", id: "problem" },
{ name: "How It Works", id: "how-it-works" },
{ name: "Strategy", id: "strategy" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Get Started", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
background={{
variant: "plain",
}}
title="Grow Your Money, Your Way"
description="Zambia's first micro-investment platform. Start from just K50 via MTN MoMo or Airtel Money. No bank account needed."
buttons={[
{
text: "Get Started",
href: "#contact",
},
{
text: "See How It Works",
href: "#how-it-works",
},
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/smartphone-displaying-financial-data-charts_23-2152020638.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/minimalistic-still-life-assortment-with-cryptocurrency_23-2149102100.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
{
imageSrc: "http://img.b2bpic.net/free-vector/modern-minimalist-mobile-financing-template_141793-1.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/worker-examines-phone-with-greenscreen_482257-76605.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/stockholder-working-from-apartment-using-mockup-mobile-phone_482257-121882.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/business-person-looking-finance-graphs_23-2150461319.jpg",
imageAlt: "SikaGrow Dashboard App Mockup",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
background={{ variant: "plain" }}
title="Grow Your Money, Your Way"
description="Zambia's first micro-investment platform. Start from just K50 via MTN MoMo or Airtel Money. No bank account needed."
buttons={[
{ text: "Get Started", href: "#contact" },
{ text: "See How It Works", href: "#how-it-works" }
]}
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/smartphone-displaying-financial-data-charts_23-2152020638.jpg", imageAlt: "SikaGrow Dashboard App Mockup" },
{ imageSrc: "http://img.b2bpic.net/free-photo/minimalistic-still-life-assortment-with-cryptocurrency_23-2149102100.jpg", imageAlt: "SikaGrow Dashboard App Mockup" },
{ imageSrc: "http://img.b2bpic.net/free-vector/modern-minimalist-mobile-financing-template_141793-1.jpg", imageAlt: "SikaGrow Dashboard App Mockup" },
{ imageSrc: "http://img.b2bpic.net/free-photo/worker-examines-phone-with-greenscreen_482257-76605.jpg", imageAlt: "SikaGrow Dashboard App Mockup" },
{ imageSrc: "http://img.b2bpic.net/free-photo/stockholder-working-from-apartment-using-mockup-mobile-phone_482257-121882.jpg", imageAlt: "SikaGrow Dashboard App Mockup" },
{ imageSrc: "http://img.b2bpic.net/free-photo/business-person-looking-finance-graphs_23-2150461319.jpg", imageAlt: "SikaGrow Dashboard App Mockup" }
]}
/>
</div>
<div id="problem" data-section="problem">
<MediaAbout
useInvertedBackground={true}
title="A gap that costs people their financial future"
description="\"During my internship I watched a coworker come to me in a panic, needing to borrow money for a family emergency. He wasn't reckless he simply had no financial cushion.\""
imageSrc="http://img.b2bpic.net/free-photo/indoor-shot-handsome-young-blogger-headwear-working-new-post-his-blog-using-wi-fi-generic-laptop-pc-holding-hand-his-chin-looking-ahead-him-with-thoughtful-expression_273609-1713.jpg"
imageAlt="Young Zambian entrepreneur looking thoughtful in a professional office environment"
/>
</div>
<div id="problem" data-section="problem">
<MediaAbout
useInvertedBackground={true}
title="A gap that costs people their financial future"
description="During my internship I watched a coworker come to me in a panic, needing to borrow money for a family emergency. He wasn't reckless — he simply had no financial cushion."
imageSrc="http://img.b2bpic.net/free-photo/indoor-shot-handsome-young-blogger-headwear-working-new-post-his-blog-using-wi-fi-generic-laptop-pc-holding-hand-his-chin-looking-ahead-him-with-thoughtful-expression_273609-1713.jpg"
imageAlt="Young Zambian entrepreneur looking thoughtful in a professional office environment"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "60%",
title: "Limited resilience",
description: "Zambians lacking financial cushioning",
imageSrc: "http://img.b2bpic.net/free-photo/sign-up-membership-registration-follow-concept_53876-123675.jpg",
},
{
id: "m2",
value: "69.4%",
title: "Inclusion rate",
description: "Current national financial access",
imageSrc: "http://img.b2bpic.net/free-vector/banking-app-interface-set_23-2148590975.jpg",
},
{
id: "m3",
value: "K50",
title: "Start investing",
description: "Minimum deposit to begin growth",
imageSrc: "http://img.b2bpic.net/free-photo/3d-character-emerging-from-smartphone_23-2151336577.jpg",
},
]}
title="Financial Inclusion Metrics"
description="Making investing accessible to every Zambian."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{ id: "m1", value: "60%", title: "Limited resilience", description: "Zambians lacking financial cushioning", imageSrc: "http://img.b2bpic.net/free-photo/sign-up-membership-registration-follow-concept_53876-123675.jpg" },
{ id: "m2", value: "69.4%", title: "Inclusion rate", description: "Current national financial access", imageSrc: "http://img.b2bpic.net/free-vector/banking-app-interface-set_23-2148590975.jpg" },
{ id: "m3", value: "K50", title: "Start investing", description: "Minimum deposit to begin growth", imageSrc: "http://img.b2bpic.net/free-photo/3d-character-emerging-from-smartphone_23-2151336577.jpg" }
]}
title="Financial Inclusion Metrics"
description="Making investing accessible to every Zambian."
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureHoverPattern
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
icon: Smartphone,
title: "Sign Up",
description: "Use your mobile number — no paperwork required.",
},
{
icon: Target,
title: "Choose Goal",
description: "Set your path for business, education, or emergencies.",
},
{
icon: Wallet,
title: "Deposit",
description: "Start from K50 via MTN MoMo or Airtel Money.",
},
{
icon: TrendingUp,
title: "Watch it Grow",
description: "Enjoy 2028% annual returns.",
},
]}
title="Simple. Safe. For Every Zambian."
description="Join the growing community of SikaGrow investors in four simple steps."
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureHoverPattern
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{ icon: Smartphone, title: "Sign Up", description: "Use your mobile number — no paperwork required." },
{ icon: Target, title: "Choose Goal", description: "Set your path for business, education, or emergencies." },
{ icon: Wallet, title: "Deposit", description: "Start from K50 via MTN MoMo or Airtel Money." },
{ icon: TrendingUp, title: "Watch it Grow", description: "Enjoy 2028% annual returns." }
]}
title="Simple. Safe. For Every Zambian."
description="Join the growing community of SikaGrow investors in four simple steps."
/>
</div>
<div id="app-screens" data-section="app-screens">
<ProductCardFour
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={true}
products={[
{
id: "p1",
name: "Sign Up",
price: "Step 1",
variant: "Fast & Easy",
imageSrc: "http://img.b2bpic.net/free-vector/location-app-screens_23-2148685899.jpg",
},
{
id: "p2",
name: "Dashboard",
price: "Step 2",
variant: "Track Progress",
imageSrc: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038414.jpg",
},
{
id: "p3",
name: "Learn & Earn",
price: "Step 3",
variant: "Build Wealth",
imageSrc: "http://img.b2bpic.net/free-photo/cool-different-types-buttons_23-2150170585.jpg",
},
{
id: "p4",
name: "Goals",
price: "Step 4",
variant: "Target Driven",
imageSrc: "http://img.b2bpic.net/free-vector/doing-exercises-workout-tracer-mobile-app_23-2148647115.jpg",
},
{
id: "p5",
name: "Support",
price: "Access",
variant: "24/7 Chat",
imageSrc: "http://img.b2bpic.net/free-vector/login-screen-design_1040-1055.jpg",
},
{
id: "p6",
name: "Referrals",
price: "Bonus",
variant: "Grow Together",
imageSrc: "http://img.b2bpic.net/free-vector/banking-app-interface-theme_23-2148589531.jpg",
},
]}
title="Experience SikaGrow"
description="Powerful tools designed to simplify your financial journey."
/>
</div>
<div id="app-screens" data-section="app-screens">
<ProductCardFour
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={true}
animationType="slide-up"
products={[
{ id: "p1", name: "Sign Up", price: "Step 1", variant: "Fast & Easy", imageSrc: "http://img.b2bpic.net/free-vector/location-app-screens_23-2148685899.jpg" },
{ id: "p2", name: "Dashboard", price: "Step 2", variant: "Track Progress", imageSrc: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038414.jpg" },
{ id: "p3", name: "Learn & Earn", price: "Step 3", variant: "Build Wealth", imageSrc: "http://img.b2bpic.net/free-photo/cool-different-types-buttons_23-2150170585.jpg" },
{ id: "p4", name: "Goals", price: "Step 4", variant: "Target Driven", imageSrc: "http://img.b2bpic.net/free-vector/doing-exercises-workout-tracer-mobile-app_23-2148647115.jpg" },
{ id: "p5", name: "Support", price: "Access", variant: "24/7 Chat", imageSrc: "http://img.b2bpic.net/free-vector/login-screen-design_1040-1055.jpg" },
{ id: "p6", name: "Referrals", price: "Bonus", variant: "Grow Together", imageSrc: "http://img.b2bpic.net/free-vector/banking-app-interface-theme_23-2148589531.jpg" }
]}
title="Experience SikaGrow"
description="Powerful tools designed to simplify your financial journey."
/>
</div>
<div id="strategy" data-section="strategy">
<PricingCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "plan1",
tag: "Core",
price: "50%",
period: "T-Bills",
description: "Core engine yielding 20-28% annually.",
button: {
text: "Learn More",
},
featuresTitle: "Allocations",
features: [
"Government Regulated",
"Highest Security",
"Consistent Returns",
],
},
{
id: "plan2",
tag: "Buffer",
price: "25%",
period: "Bank Deposits",
description: "Liquidity buffer yielding 12-18% annually.",
button: {
text: "Learn More",
},
featuresTitle: "Allocations",
features: [
"Fixed Interest",
"High Liquidity",
"Stable Growth",
],
},
{
id: "plan3",
tag: "Growth",
price: "15%",
period: "Govt Bonds",
description: "Long term growth yielding 22-30% annually.",
button: {
text: "Learn More",
},
featuresTitle: "Allocations",
features: [
"Capital Preservation",
"High Yield",
"Government Backed",
],
},
{
id: "plan4",
tag: "Diversified",
price: "10%",
period: "Money Market",
description: "Diversification yielding 15-22% annually.",
button: {
text: "Learn More",
},
featuresTitle: "Allocations",
features: [
"Risk Managed",
"Steady Growth",
"Daily Liquidity",
],
},
]}
title="Your Money is Always Protected"
description="65% backed by the Government of Zambia. Zero exposure to crypto, equities, or speculation."
/>
</div>
<div id="strategy" data-section="strategy">
<PricingCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{ id: "plan1", tag: "Core", price: "50%", period: "T-Bills", description: "Core engine yielding 20-28% annually.", button: { text: "Learn More" }, featuresTitle: "Allocations", features: ["Government Regulated", "Highest Security", "Consistent Returns"] },
{ id: "plan2", tag: "Buffer", price: "25%", period: "Bank Deposits", description: "Liquidity buffer yielding 12-18% annually.", button: { text: "Learn More" }, featuresTitle: "Allocations", features: ["Fixed Interest", "High Liquidity", "Stable Growth"] },
{ id: "plan3", tag: "Growth", price: "15%", period: "Govt Bonds", description: "Long term growth yielding 22-30% annually.", button: { text: "Learn More" }, featuresTitle: "Allocations", features: ["Capital Preservation", "High Yield", "Government Backed"] },
{ id: "plan4", tag: "Diversified", price: "10%", period: "Money Market", description: "Diversification yielding 15-22% annually.", button: { text: "Learn More" }, featuresTitle: "Allocations", features: ["Risk Managed", "Steady Growth", "Daily Liquidity"] }
]}
title="Your Money is Always Protected"
description="65% backed by the Government of Zambia. Zero exposure to crypto, equities, or speculation."
/>
</div>
<div id="target-audience" data-section="target-audience">
<TeamCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
members={[
{
id: "t1",
name: "Young Employees",
role: "18-35 years old",
imageSrc: "http://img.b2bpic.net/free-photo/concentrated-thinking-young-man-sitting-table-office_171337-17739.jpg",
},
{
id: "t2",
name: "Students",
role: "Habit Builders",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-executive-daydreaming_1139-146.jpg",
},
{
id: "t3",
name: "Middle Income",
role: "Emergency Focused",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-woman-professional-blazer-outdoors_23-2150296635.jpg",
},
]}
title="Built for the Overlooked Majority"
description="We cater to individuals striving for a better financial future."
/>
</div>
<div id="target-audience" data-section="target-audience">
<TeamCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
members={[
{ id: "t1", name: "Young Employees", role: "18-35 years old", imageSrc: "http://img.b2bpic.net/free-photo/concentrated-thinking-young-man-sitting-table-office_171337-17739.jpg" },
{ id: "t2", name: "Students", role: "Habit Builders", imageSrc: "http://img.b2bpic.net/free-photo/close-up-executive-daydreaming_1139-146.jpg" },
{ id: "t3", name: "Middle Income", role: "Emergency Focused", imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-woman-professional-blazer-outdoors_23-2150296635.jpg" }
]}
title="Built for the Overlooked Majority"
description="We cater to individuals striving for a better financial future."
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Born from a Real Problem"
description="Emmanuel Ethan Ngoma founded SikaGrow in 2025 after witnessing firsthand the financial struggles of everyday Zambians. Mission: To empower every Zambian to grow their money, make smart financial decisions, and achieve their financial goals through accessible micro-investing."
imageSrc="http://img.b2bpic.net/free-photo/portrait-male-freelancer-enjoying-cup-coffee-studio-holding-mug-with-latte-beverage-work-break-timeout-executive-manager-smiling-drinking-espresso-breakfast_482257-42245.jpg"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Born from a Real Problem"
description="Emmanuel Ethan Ngoma founded SikaGrow in 2025 after witnessing firsthand the financial struggles of everyday Zambians."
imageSrc="http://img.b2bpic.net/free-photo/portrait-male-freelancer-enjoying-cup-coffee-studio-holding-mug-with-latte-beverage-work-break-timeout-executive-manager-smiling-drinking-espresso-breakfast_482257-42245.jpg"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Join SikaGrow"
title="Start Growing Today"
description="Reach out to us for enquiries: info@sikagrow.co.zm | FB: @SikaGrowZambia | IG: @sikagrow_zm | Twitter: @SikaGrowZambia"
imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-customizing-avatar-concept_23-2150729044.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={true}
background={{ variant: "plain" }}
tag="Join SikaGrow"
title="Start Growing Today"
description="Reach out to us for enquiries: info@sikagrow.co.zm | FB: @SikaGrowZambia | IG: @sikagrow_zm | Twitter: @SikaGrowZambia"
imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-customizing-avatar-concept_23-2150729044.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="SikaGrow"
columns={[
{
title: "Platform",
items: [
{
label: "The Problem",
href: "#problem",
},
{
label: "How It Works",
href: "#how-it-works",
},
{
label: "Investment Strategy",
href: "#strategy",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Social",
items: [
{
label: "Facebook",
href: "https://facebook.com",
},
{
label: "Instagram",
href: "https://instagram.com",
},
{
label: "Twitter",
href: "https://twitter.com",
},
],
},
]}
copyrightText="© 2025 SikaGrow. All rights reserved. Growing your money, growing your future."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="SikaGrow"
columns={[
{ title: "Platform", items: [{ label: "Problem", href: "#problem" }, { label: "How It Works", href: "#how-it-works" }, { label: "Strategy", href: "#strategy" }] },
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
{ title: "Social", items: [{ label: "Facebook", href: "https://facebook.com" }, { label: "Instagram", href: "https://instagram.com" }, { label: "Twitter", href: "https://twitter.com" }] }
]}
copyrightText="© 2025 SikaGrow. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}