70 lines
3.6 KiB
TypeScript
70 lines
3.6 KiB
TypeScript
import Link from "next/link"
|
|
import { BookOpen, ExternalLink, ShoppingBag } from "lucide-react"
|
|
|
|
export function CTASection() {
|
|
return (
|
|
<section className="py-20">
|
|
<div className="container">
|
|
<div className="mx-auto max-w-4xl">
|
|
<div className="text-center mb-12">
|
|
<h2
|
|
className="text-4xl md:text-5xl font-bold mb-4 text-balance"
|
|
style={{ fontFamily: "var(--font-crimson)" }}
|
|
>
|
|
Welcome to the Myco-Economic Future
|
|
</h2>
|
|
<p className="text-lg text-muted-foreground text-balance">
|
|
Dive deeper into regenerative economics and permaculture currencies
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-3 gap-6">
|
|
<Link href="https://book.mycofi.earth" target="_blank" className="group">
|
|
<div className="h-full p-6 rounded-lg border-2 border-border hover:border-primary transition-all hover:shadow-lg bg-card">
|
|
<div className="mb-4 inline-flex items-center justify-center w-12 h-12 rounded-full bg-primary/10 text-primary group-hover:bg-primary group-hover:text-primary-foreground transition-colors">
|
|
<BookOpen className="h-6 w-6" />
|
|
</div>
|
|
<h3 className="text-xl font-bold mb-2">The Book</h3>
|
|
<p className="text-sm text-muted-foreground mb-4">
|
|
Read the full exploration of mycoeconomics and regenerative systems
|
|
</p>
|
|
<div className="flex items-center gap-2 text-sm font-medium text-primary">
|
|
Read Now <ExternalLink className="h-4 w-4" />
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
|
|
<Link href="https://shop.mycofi.earth" target="_blank" className="group">
|
|
<div className="h-full p-6 rounded-lg border-2 border-border hover:border-secondary transition-all hover:shadow-lg bg-card">
|
|
<div className="mb-4 inline-flex items-center justify-center w-12 h-12 rounded-full bg-secondary/10 text-secondary group-hover:bg-secondary group-hover:text-secondary-foreground transition-colors">
|
|
<ShoppingBag className="h-6 w-6" />
|
|
</div>
|
|
<h3 className="text-xl font-bold mb-2">The Shop</h3>
|
|
<p className="text-sm text-muted-foreground mb-4">
|
|
Support the movement with books, resources, and more
|
|
</p>
|
|
<div className="flex items-center gap-2 text-sm font-medium text-secondary">
|
|
Visit Shop <ExternalLink className="h-4 w-4" />
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
|
|
<Link href="https://links.mycofi.earth" target="_blank" className="group">
|
|
<div className="h-full p-6 rounded-lg border-2 border-border hover:border-accent transition-all hover:shadow-lg bg-card">
|
|
<div className="mb-4 inline-flex items-center justify-center w-12 h-12 rounded-full bg-accent/10 text-accent group-hover:bg-accent group-hover:text-accent-foreground transition-colors">
|
|
<ExternalLink className="h-6 w-6" />
|
|
</div>
|
|
<h3 className="text-xl font-bold mb-2">All Links</h3>
|
|
<p className="text-sm text-muted-foreground mb-4">Connect with the MycoFi community across platforms</p>
|
|
<div className="flex items-center gap-2 text-sm font-medium text-accent">
|
|
View Links <ExternalLink className="h-4 w-4" />
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|