/* How it works */
function Process() {
  const steps = [
    { n: "01", t: "30-min discovery call", d: "We understand your business, customers, and where leads leak today." },
    { n: "02", t: "Written plan, no jargon", d: "A clear scope in plain English. You approve what's in and what's out." },
    { n: "03", t: "We build. Fast.", d: "Bot, website, ads, CRM — shipped in 2-3 weeks, live on your number." },
    { n: "04", t: "Monthly growth loop", d: "We test, report, and tune. You focus on serving the customers we bring in." },
  ];
  return (
    <section id="process" className="tight">
      <div className="wrap">
        <div className="sec-head">
          <h2>From first call to first sale — <span className="serif">in under a month</span>.</h2>
          <p>No 80-page proposals. No waiting on a designer-who-answers-to-a-manager. Just us, your business, and the work.</p>
        </div>
        <div className="steps">
          {steps.map(s => (
            <div className="step" key={s.n}>
              <div className="step-num">{s.n}</div>
              <h4>{s.t}</h4>
              <p>{s.d}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Process = Process;
