// FAQ — Golden Hour room.
function FAQ() {
  const items = [
    {
      q: "What's in the prep kit vs. the monthly refill?",
      a: "Your first order is the prep kit: a storage box, walkthrough cards, site-rotation body map, and digital walkthrough. Yours to keep. Every month after that, a refill lands: 10 insulin syringes (31g, 8mm), 2 mixing syringes with needles (3ml, 23g), 20 alcohol wipes, 4 date labels, and a cycle log card. Sterile, sealed, right-sized. You source your own bacteriostatic water separately.",
    },
    {
      q: "Do you sell peptides?",
      a: "No. We sell the supplies and the knowledge to use them properly. The peptide is between you and your clinician. We drew that line on purpose. It's what lets us focus entirely on making the injection process safe, clean, and easy to follow.",
    },
    {
      q: "How is the refill sized?",
      a: "Each monthly refill covers four weeks of weekly dosing. If your protocol runs daily or every other day, the quantities scale. The dose calculator on the get-started page works out the exact numbers for your vial.",
    },
    {
      q: "What if something arrives wrong or missing?",
      a: "We replace it. One message, one fix.",
    },
    {
      q: "Is the packaging discreet?",
      a: "Every refill ships in a limited-edition collectible pouch. New design each month. Looks like premium skincare, not medical supplies. No return address that gives anything away.",
    },
    {
      q: "What if I want to stop?",
      a: "Message us. Your next refill stops. If your most recent refill is within 14 days, we refund that too.",
    },
    {
      q: "What actually are peptides?",
      a: "Short chains of amino acids. The same building blocks your body already makes. Different peptides do different things: some support recovery, some target fat loss, some help with sleep or skin. They're not steroids, not hormones, and not new. Clinics have used them for decades. What's new is people running protocols at home instead of paying clinic markup.",
    },
    {
      q: "Is this legal in Thailand?",
      a: "Everything in the kit (syringes, alcohol pads, the cards) is a legal medical supply in Thailand. No prescription needed for any of it. Bacteriostatic water, which you source separately, is also a legal medical supply. The peptide itself is a separate question with a separate answer depending on which one. That's a conversation for you and a clinician, not a supplies company.",
    },
    {
      q: "I've never injected anything before. Is this for me?",
      a: "Yes. Most of our customers started exactly where you are. The kit is designed for first-timers: the walkthrough card has every step in order, the syringes are 31-gauge (thinner than a hair), and the whole process takes about four minutes. You don't need medical training. You need the right supplies and clear instructions. That's what this is.",
    },
    {
      q: "How do I know if a peptide source is legit?",
      a: "Ask for third-party purity testing (a certificate of analysis from an independent lab, not the seller's own). Check that the peptide arrives as lyophilised powder, not pre-mixed liquid. Look for a real company behind the storefront, not just a Telegram handle. We don't sell peptides, but we care that you're not injecting mystery powder. We're building a guide on this. Drop your email and we'll send it when it's ready.",
    },
  ];
  const [open, setOpen] = React.useState(0);
  return (
    <section id="faq" style={{ background: "var(--paper-2)" }}>
      <div className="container">
        <div className="section-head" style={{ marginBottom: 48 }}>
          <h2 className="display section-title">Specifics.</h2>
        </div>
        <div style={{ maxWidth: 820 }}>
          {items.map((it, i) => (
            <div key={i} style={{ borderBottom: "1px solid var(--line)" }}>
              <button onClick={() => setOpen(open === i ? -1 : i)}
                style={{ width: "100%", padding: "20px 0", display: "flex", justifyContent: "space-between", alignItems: "center", background: "transparent", border: 0, textAlign: "left", cursor: "pointer", fontFamily: "var(--font-body)" }}>
                <span style={{ fontSize: 16, fontWeight: 600, color: "var(--ink)" }}>{it.q}</span>
                {open === i ? <IMinus size={18} stroke="var(--ink-3)" /> : <IPlus size={18} stroke="var(--ink-3)" />}
              </button>
              {open === i && (
                <div style={{ paddingBottom: 20, color: "var(--ink-3)", fontSize: 15, maxWidth: "62ch", lineHeight: 1.6 }}>{it.a}</div>
              )}
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { FAQ });
