"use client" import { ArrowRight, ChevronDown } from "lucide-react" import Link from "next/link" import { useState } from "react" /** * Edit CONTENT / ITEMS to match your FAQ. Accordion on all breakpoints * (no motion deps). */ const CONTENT = { stamp: "FAQ", headlineBefore: "Questions we get", headlineAccent: "a lot", headlineAfter: ".", ctaLabel: "Still unsure? Talk to us", ctaHref: "/contact", } const ITEMS = [ { id: "fixed-price", category: "Engagement", question: "Why fixed-price instead of hourly?", answer: "Hourly aligns incentives against you. Fixed price means we scope carefully up-front and ship on time - if we go over, that's our problem, not yours.", }, { id: "stack", category: "Technical", question: "What stack do you use?", answer: "Next.js (App Router), TypeScript, Tailwind, Postgres / Supabase, and Vercel. Happy to work in other stacks, but we ship fastest here.", }, { id: "team", category: "Engagement", question: "Can you work with my existing team?", answer: "Yes. We slot in like a senior engineer: PR reviews, shared boards, and we adopt your conventions.", }, { id: "timeline", category: "Process", question: "How fast can we start?", answer: "Usually within a week of scope lock. Two project slots open per quarter - ask early if timing is tight.", }, ] export function Faq() { const [openId, setOpenId] = useState(ITEMS[0]?.id ?? "") return (

{CONTENT.stamp}

{CONTENT.headlineBefore}{" "} {CONTENT.headlineAccent} {CONTENT.headlineAfter}

{open ? (

{item.category}

{item.answer}

) : null}

{CONTENT.ctaLabel}

) }