Faq 4

"use client"

import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@/components/ui/accordion"
import { Badge } from "@/components/ui/badge"
import { FancyButton } from "@/components/ui/fancy-button"

type FaqItem = {
  value: string
  question: string
  answer: string
}

const faqs: FaqItem[] = [
  {
    value: "item-1",
    question: "What countries do you support?",
    answer:
      "We currently support operations in 45+ countries across North America, Europe, Asia, and Australia. We're continuously expanding our reach. Check our website for the most up-to-date list of supported countries and regions.",
  },
  {
    value: "item-2",
    question: "How secure is my financial data?",
    answer:
      "We use bank-level encryption, two-factor authentication, and comply with major global standards such as PSD2, GDPR, and SOC 2.\n\nYour financial data is encrypted both at rest and in transit, and our systems are monitored 24/7 for unusual activity. We also undergo regular third-party audits to ensure the highest level of security and compliance.",
  },
  {
    value: "item-3",
    question: "Is there a free trial available?",
    answer:
      "Yes! We offer a 14-day free trial with full access to all features. No credit card is required to start. After the trial period, you can choose a plan that best fits your needs.",
  },
  {
    value: "item-4",
    question: "How long do transfers usually take?",
    answer:
      "Most domestic transfers are completed within 1-2 business days. International transfers typically take 3-5 business days depending on the destination country and banking system. Expedited transfers are available for an additional fee.",
  },
  {
    value: "item-5",
    question: "Can I upgrade or downgrade my plan anytime?",
    answer: "Absolutely. We'll prorate any adjustments to your account.",
  },
  {
    value: "item-6",
    question: "Do you offer customer support in other languages?",
    answer:
      "We provide support in English, Spanish, French, and German during business hours.",
  },
]

export function Faq() {
  return (
    <section
      aria-label="FAQ"
      className="mx-auto flex w-full max-w-xl flex-col gap-8 text-foreground motion-reduce:**:animate-none motion-reduce:**:transition-none"
    >
      <header className="flex flex-col gap-3 md:items-center md:text-center">
        <Badge variant="secondary" className="w-fit">
          Quick guide
        </Badge>
        <div className="flex flex-col items-center gap-2">
          <h1 className="text-3xl font-semibold tracking-tight text-balance sm:text-4xl md:text-5xl">
            A numbered walkthrough
          </h1>
          <p className="text-muted-foreground">
            Six short answers covering countries, security, trials, and plans.
          </p>
        </div>
      </header>

      <h2 className="sr-only">Questions</h2>

      <Accordion className="gap-2">
        {faqs.map((item, index) => (
          <AccordionItem
            key={item.value}
            value={item.value}
            className="overflow-hidden rounded-lg border-0 bg-muted"
          >
            <AccordionTrigger className="group px-4 text-muted-foreground hover:text-foreground hover:no-underline aria-expanded:text-foreground">
              <span className="mt-0.5 mr-3 text-xs text-muted-foreground group-hover:text-foreground group-aria-expanded/accordion-trigger:text-foreground md:mt-0 md:text-sm">
                {String(index + 1).padStart(2, "0")}
              </span>
              {item.question}
            </AccordionTrigger>
            <AccordionContent className="flex flex-col gap-2 px-4 pb-2 text-pretty text-foreground">
              <p className="text-sm whitespace-pre-line">{item.answer}</p>
            </AccordionContent>
          </AccordionItem>
        ))}
      </Accordion>

      <div className="flex justify-start md:justify-center">
        <FancyButton size="lg">Get in touch</FancyButton>
      </div>
    </section>
  )
}