78 lines
2.5 KiB
TypeScript
78 lines
2.5 KiB
TypeScript
"use client";
|
|
import { Container } from "@/components/container";
|
|
import { motion } from "framer-motion";
|
|
import { CheckCircle2 } from "lucide-react";
|
|
|
|
const reasons = [
|
|
{
|
|
textBn: "Enam Group দ্বারা বিশ্বস্ত",
|
|
textEn: "Trusted by Enam Group"
|
|
},
|
|
{
|
|
textBn: "চাকরি-ভিত্তিক দক্ষতা উন্নয়ন",
|
|
textEn: "Job-oriented skill development"
|
|
},
|
|
{
|
|
textBn: "শক্তিশালী চাকরি সহায়তা",
|
|
textEn: "Strong job assistance support"
|
|
},
|
|
{
|
|
textBn: "স্বচ্ছ ও নৈতিক প্রক্রিয়া",
|
|
textEn: "Transparent & ethical process"
|
|
},
|
|
{
|
|
textBn: "শুরু থেকে শেষ পর্যন্ত গাইডেন্স",
|
|
textEn: "End-to-end guidance"
|
|
}
|
|
];
|
|
|
|
export function WhyChooseUs() {
|
|
return (
|
|
<section className="py-20 bg-neutral-50">
|
|
<Container>
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="text-center mb-16"
|
|
>
|
|
<h2 className="text-3xl md:text-5xl font-bold text-[#7A1F2B] mb-4">
|
|
কেন আমাদের বেছে নেবেন?
|
|
</h2>
|
|
<h3 className="text-2xl md:text-3xl font-semibold text-neutral-700">
|
|
Why Choose Us?
|
|
</h3>
|
|
</motion.div>
|
|
|
|
<div className="max-w-3xl mx-auto">
|
|
<div className="grid md:grid-cols-2 gap-6">
|
|
{reasons.map((reason, index) => (
|
|
<motion.div
|
|
key={index}
|
|
initial={{ opacity: 0, x: -20 }}
|
|
whileInView={{ opacity: 1, x: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ delay: index * 0.1, duration: 0.5 }}
|
|
className="flex items-start gap-4 bg-white rounded-xl p-6 shadow-md hover:shadow-lg transition-shadow duration-300"
|
|
>
|
|
<div className="flex-shrink-0">
|
|
<CheckCircle2 className="w-6 h-6 text-[#7A1F2B]" />
|
|
</div>
|
|
<div>
|
|
<p className="font-bold text-lg text-neutral-800 mb-1">
|
|
{reason.textBn}
|
|
</p>
|
|
<p className="text-neutral-600">
|
|
{reason.textEn}
|
|
</p>
|
|
</div>
|
|
</motion.div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|