/* Approach — 3-column principles on ink background */

function Approach({ t }) {
  return (
    <section id="approach" className="dark">
      <div className="container">
        <div className="section-head">
          <div className="num eyebrow">§ 02 / {t.sectionHeads.approach}</div>
          <h2>{t.sectionHeads.approachSub}</h2>
        </div>
        <div className="approach-grid">
          {t.approach.map((p, i) => (
            <div className="approach-item" key={i}>
              <span className="num">{String(i + 1).padStart(2, "0")}</span>
              <h3>{p.title}</h3>
              <p>{p.body}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Approach = Approach;
