99 lines
4.5 KiB
TypeScript
99 lines
4.5 KiB
TypeScript
import { Container } from "@/components/container";
|
|
import { Heading } from "@/components/heading";
|
|
import { Subheading } from "@/components/subheading";
|
|
import { Card, CardContent } from "@/components/ui/card";
|
|
import { TrendingUp, Users, DollarSign, Rocket } from "lucide-react";
|
|
|
|
export function BusinessModel() {
|
|
return (
|
|
<section className="py-20 bg-blue-50">
|
|
<Container>
|
|
<div className="text-center max-w-3xl mx-auto mb-16">
|
|
<Heading level="h2" className="text-3xl md:text-4xl">Business Model & Vision</Heading>
|
|
<Subheading className="mt-4">
|
|
How we scale and sustain the impact across India.
|
|
</Subheading>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
|
<Card className="border-none shadow-sm">
|
|
<CardContent className="p-8 text-center">
|
|
<div className="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<DollarSign className="h-6 w-6 text-blue-600" />
|
|
</div>
|
|
<h3 className="text-3xl font-bold mb-2">₹500/mo</h3>
|
|
<p className="text-neutral-600 font-medium">Subscription Model</p>
|
|
<p className="text-sm text-neutral-500 mt-2">Affordable access to all premium tracks and certifications.</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-none shadow-sm">
|
|
<CardContent className="p-8 text-center">
|
|
<div className="w-12 h-12 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<TrendingUp className="h-6 w-6 text-green-600" />
|
|
</div>
|
|
<h3 className="text-3xl font-bold mb-2">75%</h3>
|
|
<p className="text-neutral-600 font-medium">Gross Margin</p>
|
|
<p className="text-sm text-neutral-500 mt-2">Highly scalable digital infrastructure with low operational overhead.</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-none shadow-sm">
|
|
<CardContent className="p-8 text-center">
|
|
<div className="w-12 h-12 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<Users className="h-6 w-6 text-purple-600" />
|
|
</div>
|
|
<h3 className="text-3xl font-bold mb-2">3.5x</h3>
|
|
<p className="text-neutral-600 font-medium">LTV / CAC Ratio</p>
|
|
<p className="text-sm text-neutral-500 mt-2">Strong unit economics driven by organic student referrals.</p>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
|
|
<div className="bg-white p-8 md:p-12 rounded-3xl shadow-sm border border-neutral-100">
|
|
<div className="flex items-center gap-3 mb-8">
|
|
<Rocket className="h-8 w-8 text-blue-600" />
|
|
<h3 className="text-2xl font-bold">Vision for Scale</h3>
|
|
</div>
|
|
|
|
<div className="space-y-8">
|
|
<div className="relative">
|
|
<div className="flex justify-between mb-2 text-sm font-bold">
|
|
<span>Phase 1: Foundation</span>
|
|
<span>1,000 Students</span>
|
|
</div>
|
|
<div className="w-full h-3 bg-neutral-100 rounded-full overflow-hidden">
|
|
<div className="w-[10%] h-full bg-blue-600 rounded-full" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="relative">
|
|
<div className="flex justify-between mb-2 text-sm font-bold">
|
|
<span>Phase 2: Growth</span>
|
|
<span>50,000 Students</span>
|
|
</div>
|
|
<div className="w-full h-3 bg-neutral-100 rounded-full overflow-hidden">
|
|
<div className="w-[40%] h-full bg-blue-400 rounded-full" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="relative">
|
|
<div className="flex justify-between mb-2 text-sm font-bold">
|
|
<span>Phase 3: Pan-India Impact</span>
|
|
<span>1,000,000+ Students</span>
|
|
</div>
|
|
<div className="w-full h-3 bg-neutral-100 rounded-full overflow-hidden">
|
|
<div className="w-[100%] h-full bg-gradient-to-r from-blue-600 to-indigo-600 rounded-full" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p className="mt-10 text-center text-neutral-600 italic">
|
|
"Our long-term goal is to become the pan-India skill platform and job marketplace for the next generation."
|
|
</p>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|