function Process() {
  return (
    <section className="process" id="process">
      <div className="container">
        <div className="process-wrap">
          <Reveal className="process-head">
            <Eyebrow>How It Works</Eyebrow>
            <h2>A clear path from first call to final handoff.</h2>
            <div className="rule" />
            <p>You know what happens next, when it happens, and who is responsible. Every step is structured to keep your renovation organized, transparent, and professionally managed.</p>
          </Reveal>

          <div className="process-list">
            {window.PROCESS_STEPS.map((s) => (
              <Reveal key={s.number} className="process-step">
                <div className="process-num">{s.number}</div>
                <div className="process-image">
                  <img src={s.image} alt={s.title} loading="lazy" />
                </div>
                <div className="process-text">
                  <div className="eyb">Step {s.number}</div>
                  <h3>{s.title}</h3>
                  <p>{s.body}</p>
                </div>
              </Reveal>
            ))}
          </div>
        </div>
      </div>
    </section>
  );
}
window.Process = Process;