// Process + Stack
function Process() {
  return (
    <section className="process" id="process">
      <div className="container">
        <div className="process-head">
          <span className="eyebrow">/ cómo trabajamos</span>
          <h2 className="process-title">
            Del problema al{" "}
            <span className="gradient-text" style={{ fontStyle: "italic", fontWeight: 400 }}>commit</span>{" "}
            en producción.
          </h2>
        </div>

        <div className="process-list">
          {window.PROCESS_STEPS.map((s, i) => (
            <div className="process-row" key={i}>
              <span className="process-num">/ {s.n}</span>
              <span className="process-step-title">
                {s.title}
                <span className="slash">/</span>
              </span>
              <span className="process-step-desc">{s.desc}</span>
              <span className="process-step-time">{s.time}</span>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Process = Process;
