89 lines
3.9 KiB
TypeScript
89 lines
3.9 KiB
TypeScript
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
|
import { Badge } from "@/components/ui/badge"
|
|
import { Coins, Vote, Cpu, Heart } from "lucide-react"
|
|
|
|
export function AlternativesSection() {
|
|
const alternatives = [
|
|
{
|
|
icon: <Coins className="h-8 w-8 text-secondary" />,
|
|
title: "Permaculture Currencies",
|
|
description:
|
|
"Local exchange systems that value ecological regeneration, care work, and community resilience over profit extraction.",
|
|
examples: ["Community Land Trusts", "Time Banking", "Mutual Credit Systems", "Gift Economies"],
|
|
},
|
|
{
|
|
icon: <Vote className="h-8 w-8 text-secondary" />,
|
|
title: "Participatory Democracy",
|
|
description:
|
|
"Decision-making systems that give communities direct control over resources and policies affecting their lives.",
|
|
examples: ["Consensus Building", "Sociocracy", "Liquid Democracy", "Community Assemblies"],
|
|
},
|
|
{
|
|
icon: <Cpu className="h-8 w-8 text-secondary" />,
|
|
title: "Cooperative Technology",
|
|
description:
|
|
"Platform cooperatives and decentralized technologies that serve communities rather than extractive corporations.",
|
|
examples: ["Platform Co-ops", "Mesh Networks", "Open Source Tools", "Distributed Governance"],
|
|
},
|
|
{
|
|
icon: <Heart className="h-8 w-8 text-secondary" />,
|
|
title: "Care-Centered Economics",
|
|
description:
|
|
"Economic models that prioritize care work, emotional labor, and the reproduction of life over capital accumulation.",
|
|
examples: ["Universal Basic Services", "Care Income", "Commons Management", "Solidarity Economy"],
|
|
},
|
|
]
|
|
|
|
return (
|
|
<section id="alternatives" className="py-20 bg-muted/30">
|
|
<div className="container mx-auto px-4">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl md:text-5xl font-bold mb-6 text-balance">
|
|
{"Post-Capitalist "}
|
|
<span className="text-secondary">Alternatives</span>
|
|
</h2>
|
|
<p className="text-xl text-muted-foreground max-w-3xl mx-auto text-pretty leading-relaxed">
|
|
{"These aren't utopian dreams — they're practical alternatives being implemented "}
|
|
{'by communities worldwide who refuse to accept that "there is no alternative."'}
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid lg:grid-cols-2 gap-8">
|
|
{alternatives.map((alternative, index) => (
|
|
<Card key={index} className="border-secondary/20 hover:border-secondary/40 transition-all duration-300">
|
|
<CardHeader>
|
|
<div className="flex items-center gap-4 mb-4">
|
|
{alternative.icon}
|
|
<CardTitle className="text-xl">{alternative.title}</CardTitle>
|
|
</div>
|
|
<p className="text-muted-foreground leading-relaxed">{alternative.description}</p>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="flex flex-wrap gap-2">
|
|
{alternative.examples.map((example, exampleIndex) => (
|
|
<Badge
|
|
key={exampleIndex}
|
|
variant="secondary"
|
|
className="bg-secondary/10 text-secondary border-secondary/20"
|
|
>
|
|
{example}
|
|
</Badge>
|
|
))}
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
|
|
<div className="mt-16 text-center">
|
|
<blockquote className="text-2xl md:text-3xl font-medium text-secondary italic max-w-4xl mx-auto text-balance">
|
|
{'"We are in urgent need of new economic models that can facilitate managed degrowth '}
|
|
{'and support localized production in the real economy."'}
|
|
</blockquote>
|
|
<cite className="text-muted-foreground mt-4 block">— From Mycoeconomics and Permaculture Currencies</cite>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|