77 lines
3.1 KiB
TypeScript
77 lines
3.1 KiB
TypeScript
"use client";
|
||
import { Container } from "@/components/container";
|
||
import { Button } from "@/components/ui/button";
|
||
import { Sparkles, ArrowLeft } from "lucide-react";
|
||
|
||
export function FinalCTA() {
|
||
const scrollToPricing = () => {
|
||
document.getElementById('pricing')?.scrollIntoView({ behavior: 'smooth' });
|
||
};
|
||
|
||
return (
|
||
<section className="py-20 relative overflow-hidden">
|
||
{/* Golden gradient background */}
|
||
<div className="absolute inset-0 golden-gradient opacity-90"></div>
|
||
|
||
{/* Animated particles */}
|
||
<div className="absolute inset-0">
|
||
<div className="absolute top-10 left-10 w-3 h-3 bg-white/30 rounded-full animate-pulse"></div>
|
||
<div className="absolute top-20 right-20 w-2 h-2 bg-white/40 rounded-full animate-bounce"></div>
|
||
<div className="absolute bottom-20 left-1/4 w-2 h-2 bg-white/30 rounded-full animate-ping"></div>
|
||
<div className="absolute top-1/3 right-1/3 w-3 h-3 bg-white/40 rounded-full animate-pulse"></div>
|
||
</div>
|
||
|
||
<Container className="relative z-10">
|
||
<div className="max-w-4xl mx-auto text-center text-white">
|
||
<div className="inline-block p-3 bg-white/20 rounded-full mb-6">
|
||
<Sparkles className="w-12 h-12" />
|
||
</div>
|
||
|
||
<h2 className="text-3xl md:text-5xl lg:text-6xl font-bold mb-6 leading-tight">
|
||
ابدئي الآن
|
||
</h2>
|
||
|
||
<p className="text-xl md:text-2xl mb-8 leading-relaxed">
|
||
افتحي باب الدخل الرقمي اليوم
|
||
<br />
|
||
بخطوات بسيطة ونتائج مضمونة
|
||
</p>
|
||
|
||
<div className="flex flex-col sm:flex-row gap-4 justify-center items-center mb-8">
|
||
<Button
|
||
size="lg"
|
||
onClick={scrollToPricing}
|
||
className="bg-white text-amber-900 font-bold text-xl px-10 py-8 rounded-full hover:scale-110 transition-transform duration-300 shadow-2xl hover:shadow-white/50"
|
||
>
|
||
<Sparkles className="w-6 h-6 ml-2" />
|
||
اشتري الآن - 39$ فقط
|
||
<ArrowLeft className="w-6 h-6 mr-2" />
|
||
</Button>
|
||
</div>
|
||
|
||
<div className="space-y-3 text-white/90">
|
||
<p className="flex items-center justify-center gap-2">
|
||
✅ دفعة واحدة فقط
|
||
</p>
|
||
<p className="flex items-center justify-center gap-2">
|
||
✅ وصول مدى الحياة
|
||
</p>
|
||
<p className="flex items-center justify-center gap-2">
|
||
✅ ضمان استرجاع المال
|
||
</p>
|
||
</div>
|
||
|
||
<div className="mt-12 p-6 bg-white/10 backdrop-blur-sm rounded-2xl border-2 border-white/30">
|
||
<p className="text-2xl font-bold mb-2">
|
||
⏰ العرض محدود - لا تفوتي الفرصة!
|
||
</p>
|
||
<p className="text-lg">
|
||
انضمي لـ 500+ طالبة بدأن رحلتهن نحو الحرية المالية
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</Container>
|
||
</section>
|
||
);
|
||
}
|