function FAQ() {
  const [open, setOpen] = React.useState(0);
  const items = [
    { q: "How long does a typical kitchen remodel take?",
      a: "The timeline depends on the scope of the project. Minor remodels may take 4–6 weeks, while full custom renovations can range from 8–12 weeks." },
    { q: "What's the catch with the free pot filler?",
      a: "We got a great deal from our supplier on a batch of premium pot fillers. Rather than keep the margin, we figured -- why not give them away to the next 10 homeowners who book a remodel with us? So that's exactly what we're doing. No catch, no fine print. As long as this page is up, the offer stands. Once all 10 are claimed, it's gone." },
    { q: "Do I really get a photorealistic 3D rendering before you build?",
      a: "Yes. Once you approve your estimate, every New Day remodel includes a full 3D kitchen rendering so you can walk through it before we demo anything. We refine it until you love it. It’s a $500 service, included with your project." },
    { q: "Are you licensed, bonded, and insured?",
      a: "Yes — fully licensed in Washington State, bonded, and insured. We're also BBB A+ Accredited, a HomeAdvisor Elite Service provider, and a Best of Houzz Service winner for 2023 and 2024." },
    { q: "Do you work outside of Bellevue?",
      a: "We serve the greater Eastside and Seattle metro, including Kirkland, Mercer Island, Redmond, Sammamish, Issaquah, Bothell, Medina, Newcastle, Woodinville, Clyde Hill, and Renton. If you own a home in the Greater Seattle area, there's a good chance we serve you." },
    { q: "What does a kitchen remodel typically cost?",
      a: "Costs vary based on design, materials, and scope. On average, homeowners in Bellevue invest between $30,000 and $75,000 for a complete remodel, though smaller updates may cost less." },
  ];
  return (
    <section className="section section--soft" id="faq">
      <div className="container">
        <div className="section-head section-head--center">
          <span className="eyebrow">Frequently asked</span>
          <h2 className="h2">Everything you're probably wondering.</h2>
        </div>
        <div className="faq-wrap">
          {items.map((it, i) => (
            <div key={i} className={"faq-item " + (open === i ? "is-open" : "")}>
              <button className="faq-q" onClick={() => setOpen(open === i ? -1 : i)}>
                <span>{it.q}</span>
                <span className="ico"><Ic.plus size={14} /></span>
              </button>
              <div className="faq-a"><div className="faq-a-inner">{it.a}</div></div>
            </div>
          ))}
        </div>
        <div style={{display:'flex', justifyContent:'center', marginTop:48}}>
          <button className="btn btn-primary btn-lg" onClick={() => document.dispatchEvent(new CustomEvent('open-estimate'))}>
            Get Free Estimate &amp; Offer <Ic.arrow />
          </button>
        </div>
      </div>
    </section>
  );
}
window.FAQ = FAQ;