function Process() {
  const steps = [
    { n: "01", t: "Get your free estimate", time: "60 seconds", b: "Tell us about your kitchen in our short form. We'll match you with a senior designer and confirm your offer eligibility." },
    { n: "02", t: "In-home consultation", time: "90 minutes", b: "We visit, measure, and walk through your vision together. You'll get transparent pricing — no pressure, no sales pitch." },
    { n: "03", t: "3D design rendering", time: "3–7 days", b: "We produce a photorealistic 3D rendering of your new kitchen ($500 value, on us). You approve every detail before construction begins." },
    { n: "04", t: "Build phase", time: "4–8 weeks", b: "One dedicated project manager, one in-house crew. Daily updates. We show up when we say we will." },
    { n: "05", t: "Final walk-through", time: "1 day", b: "We hand over the keys to your finished kitchen — with your free pot filler installed and a written workmanship warranty." },
  ];
  return (
    <section className="section" id="process">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow">How it works</span>
          <h2 className="h2">Five steps from <em>first call to first meal cooked.</em></h2>
          <p className="lede">No mystery, no missed deadlines. Here's exactly what your New Day remodel looks like.</p>
        </div>
        <div className="process-list">
          {steps.map(s => (
            <div className="process-step" key={s.n}>
              <div className="process-num">{s.n}</div>
              <div className="process-body">
                <h3>{s.t}</h3>
                <p>{s.b}</p>
              </div>
              <div className="process-time">{s.time}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Process = Process;
