/* mtz. website — oversized, baseline-offset results.
   Numbers count up via motion.js. Copy from content.json (mtzContent.stats). */
function Stats() {
  const c = mtzContent.stats;
  return (
    <section className="mtz-stats-sec">
      <div className="mtz-sec-head">
        <span className="mtz-eyebrow-row">{eb(c.eyebrow)}</span>
      </div>
      <div className="mtz-stats-grid">
        {c.items.map((st) => (
          <div className="mtz-stat" key={st.label}>
            <div className="mtz-stat__value">{st.value}<span className="mtz-stat__suffix">{st.suffix}</span></div>
            <div className="mtz-stat__label">{st.label}</div>
            <p className="mtz-stat__desc">{st.desc}</p>
          </div>
        ))}
      </div>
    </section>
  );
}
window.Stats = Stats;