54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
"use client";
|
|
import { Container } from "@/components/container";
|
|
import { Heading } from "@/components/heading";
|
|
import { CheckCircle2 } from "lucide-react";
|
|
|
|
export function WhyChoose() {
|
|
const reasons = [
|
|
{
|
|
title: "Honest Advice",
|
|
description: "No hidden agendas. We don't sell packages or earn commissions from agencies."
|
|
},
|
|
{
|
|
title: "Multiple Options",
|
|
description: "We give you 2-3 agency options so you can choose what works best for you."
|
|
},
|
|
{
|
|
title: "No Hidden Agenda",
|
|
description: "We're independent consultants. Your satisfaction is our only goal."
|
|
},
|
|
{
|
|
title: "Budget-Friendly",
|
|
description: "Our consultation is completely free. You only pay the agency you choose."
|
|
}
|
|
];
|
|
|
|
return (
|
|
<section className="py-20 bg-neutral-50">
|
|
<Container>
|
|
<div className="text-center mb-12">
|
|
<Heading className="text-3xl md:text-4xl font-bold text-neutral-900">
|
|
Why Choose Badnaam Safar?
|
|
</Heading>
|
|
<p className="mt-4 text-lg text-neutral-600 max-w-2xl mx-auto">
|
|
We're different because we put your needs first, not our profits.
|
|
</p>
|
|
</div>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-4xl mx-auto">
|
|
{reasons.map((reason, index) => (
|
|
<div key={index} className="flex gap-4">
|
|
<div className="flex-shrink-0">
|
|
<CheckCircle2 className="h-6 w-6 text-green-700" />
|
|
</div>
|
|
<div>
|
|
<h3 className="text-xl font-semibold text-neutral-900 mb-2">{reason.title}</h3>
|
|
<p className="text-neutral-600">{reason.description}</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|