81 lines
3.0 KiB
TypeScript
81 lines
3.0 KiB
TypeScript
"use client";
|
||
import { Container } from "@/components/container";
|
||
import { Card } from "@/components/ui/card";
|
||
import { HelpCircle } from "lucide-react";
|
||
|
||
export function FAQ() {
|
||
const faqs = [
|
||
{
|
||
question: "هل الكورس مناسب للمبتدئين؟",
|
||
answer: "نعم، يبدأ من الصفر تماماً. كل شيء مشروح بطريقة بسيطة وسهلة."
|
||
},
|
||
{
|
||
question: "هل أحتاج لخبرة؟",
|
||
answer: "لا، كل شيء مشروح خطوة بخطوة. حتى لو لم تستخدمي إنستغرام من قبل."
|
||
},
|
||
{
|
||
question: "هل أحتاج لدفع شهري؟",
|
||
answer: "لا، دفعة واحدة فقط وتحصلين على الكورس مدى الحياة مع كل التحديثات."
|
||
},
|
||
{
|
||
question: "هل يمكنني البدء من الهاتف؟",
|
||
answer: "نعم، كل الأدوات تعمل على الهاتف. لا تحتاجين لجهاز كمبيوتر."
|
||
},
|
||
{
|
||
question: "متى أبدأ بعد الشراء؟",
|
||
answer: "فوراً! ستحصلين على الوصول الكامل للكورس بعد الدفع مباشرة."
|
||
},
|
||
{
|
||
question: "هل هناك ضمان؟",
|
||
answer: "نعم، ضمان استرجاع المال خلال 7 أيام إذا لم يعجبك الكورس."
|
||
}
|
||
];
|
||
|
||
return (
|
||
<section className="py-20 bg-gradient-to-br from-amber-50 to-yellow-50">
|
||
<Container>
|
||
<div className="text-center mb-12">
|
||
<h2 className="text-3xl md:text-5xl font-bold mb-4">
|
||
<span className="golden-text">الأسئلة الشائعة</span>
|
||
</h2>
|
||
<p className="text-lg text-gray-600">
|
||
إجابات على أكثر الأسئلة شيوعاً
|
||
</p>
|
||
</div>
|
||
|
||
<div className="max-w-4xl mx-auto space-y-4">
|
||
{faqs.map((faq, index) => (
|
||
<Card
|
||
key={index}
|
||
className="p-6 bg-white border-2 border-amber-200 hover:golden-shadow transition-all duration-300"
|
||
>
|
||
<div className="flex items-start gap-4">
|
||
<div className="p-2 bg-amber-100 rounded-lg flex-shrink-0">
|
||
<HelpCircle className="w-6 h-6 text-amber-600" />
|
||
</div>
|
||
<div className="flex-1">
|
||
<h3 className="font-bold text-xl text-gray-900 mb-2">
|
||
{faq.question}
|
||
</h3>
|
||
<p className="text-gray-700 leading-relaxed">
|
||
{faq.answer}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</Card>
|
||
))}
|
||
</div>
|
||
|
||
<div className="mt-12 text-center">
|
||
<Card className="inline-block p-6 bg-white border-2 border-amber-300 golden-shadow">
|
||
<p className="text-lg text-gray-700">
|
||
لديك سؤال آخر؟{" "}
|
||
<span className="font-bold golden-text">تواصلي معنا مباشرة!</span>
|
||
</p>
|
||
</Card>
|
||
</div>
|
||
</Container>
|
||
</section>
|
||
);
|
||
}
|