125 lines
6.1 KiB
TypeScript
125 lines
6.1 KiB
TypeScript
import { Card, CardContent } from "@/components/ui/card"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Check, DollarSign, Key, Shield } from "lucide-react"
|
|
|
|
export default function Pricing() {
|
|
return (
|
|
<section id="pricing" className="py-20 px-4 bg-black">
|
|
<div className="container mx-auto">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl md:text-5xl font-bold mb-6">Pricing That Makes Sense</h2>
|
|
<p className="text-xl text-gray-300 max-w-3xl mx-auto">
|
|
No subscriptions, no hidden fees, no premium tiers. Just bring your own API keys and enjoy unlimited
|
|
AI-powered meeting notes.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="max-w-4xl mx-auto">
|
|
<Card className="bg-gradient-to-r from-green-600/20 to-blue-600/20 border-2 border-green-500/50 relative overflow-hidden">
|
|
<div className="absolute top-0 left-0 right-0 bg-green-500 text-black text-center py-2 font-bold">
|
|
✨ COMPLETELY FREE FOREVER
|
|
</div>
|
|
<CardContent className="p-8 mt-8">
|
|
<div className="text-center mb-8">
|
|
<div className="flex items-center justify-center mb-4">
|
|
<DollarSign className="w-16 h-16 text-green-400" />
|
|
<span className="text-6xl font-bold text-green-400">0</span>
|
|
</div>
|
|
<h3 className="text-3xl font-bold mb-2">Free Forever</h3>
|
|
<p className="text-gray-300 text-lg">No costs, no subscriptions, no limits</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-2 gap-8 mb-8">
|
|
<div>
|
|
<h4 className="text-xl font-bold mb-4 flex items-center">
|
|
<Shield className="w-5 h-5 text-blue-400 mr-2" />
|
|
Core Features
|
|
</h4>
|
|
<ul className="space-y-3">
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Real-time transcription</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">AI-enhanced notes</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Local storage & privacy</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Unlimited meetings</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Search & export</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 className="text-xl font-bold mb-4 flex items-center">
|
|
<Key className="w-5 h-5 text-yellow-400 mr-2" />
|
|
Your API Keys
|
|
</h4>
|
|
<ul className="space-y-3">
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Bring your own OpenAI key</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">~$0.20/hour usage cost</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Full control over your data</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">No middleman or markup</span>
|
|
</li>
|
|
<li className="flex items-start space-x-3">
|
|
<Check className="w-5 h-5 text-green-400 mt-0.5 flex-shrink-0" />
|
|
<span className="text-gray-300">Stored securely on-device</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-gray-900/50 rounded-lg p-6 mb-8">
|
|
<h4 className="text-lg font-bold mb-3 text-center">💰 Cost Breakdown</h4>
|
|
<div className="grid grid-cols-2 gap-4 text-center">
|
|
<div>
|
|
<div className="text-2xl font-bold text-green-400">$0</div>
|
|
<div className="text-sm text-gray-400">App Cost</div>
|
|
</div>
|
|
<div>
|
|
<div className="text-2xl font-bold text-blue-400">~$0.20</div>
|
|
<div className="text-sm text-gray-400">Per Hour (OpenAI)</div>
|
|
</div>
|
|
</div>
|
|
<div className="mt-4 text-center text-sm text-gray-400">
|
|
<strong>Example:</strong> 10 hours of meetings = ~$2.00 total
|
|
</div>
|
|
</div>
|
|
|
|
<Button size="lg" className="bg-green-600 hover:bg-green-700 text-lg px-8 py-4" asChild>
|
|
<a href="/download">
|
|
Download Free Now
|
|
</a>
|
|
</Button>
|
|
|
|
<p className="text-sm text-gray-400 mt-4">
|
|
No credit card required • No account needed • No data collection
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|