FAQ as a row of cards in depth: a scroll-driven 3D carousel whose cards flip to reveal answers, with momentum drag, keyboard and RTL support.
import { FaqDeck } from "@/components/ui/faq-deck";
const questions = [
{
question: "How does it work?",
answer:
"You choose a vetted, independent chauffeur and send a request. The chauffeur confirms by email, then you deal with them directly: they contact you, drive you and invoice you.",
},
{
question: "Are the chauffeurs vetted?",
answer:
"Yes. Before a profile goes live we check the chauffeur’s identity and business, their professional licence, their insurance for carrying passengers and the registration of every vehicle.",
},
{
question: "How much does a private chauffeur cost?",
answer:
"Each chauffeur sets their own prices and publishes them on their profile: an hourly rate, a minimum booking and fixed airport transfers. The final price is confirmed before the ride.",
},
{
question: "How do I book?",
answer:
"Pick a chauffeur and send a request with the date, time, route and number of passengers. Until the chauffeur confirms, it is a request, not a booking.",
},
{
question: "How do I pay?",
answer: "You pay the chauffeur directly, by card, bank transfer or cash, as they accept. Nothing is charged online when you send a request.",
},
{
question: "Can I cancel?",
answer: "Yes, under the chauffeur’s cancellation policy, shown on their profile. Most chauffeurs cancel free of charge up to 24 hours before the ride.",
},
];
export default function FaqDeckDemo() {
return (
<>
<FaqDeck
title="Questions before you book"
items={questions}
allHref="#"
startAt={2}
contact={{ title: "Another question?", text: "Write to us and we will answer by email.", action: "Contact us", href: "#" }}
/>
</>
);
}