// Specs strip — figures sourced directly from proposal validation studies

const SPECS = [
  { num: ">55", unit: "%", label: "K⁺ reduction",
    note: "In simulated CPB, achieved within ~6 minutes of activation." },
  { num: "35×", unit: "faster", label: "vs. conventional management",
    note: "Twice the corrective effect in roughly one thirty-fifth of the time of dilution-based methods." },
  { num: "300K", unit: "/ year", label: "U.S. cardiac surgeries on bypass",
    note: "Every one of them depends on a sixty-year-old chemistry playbook." },
  { num: "$1B+", unit: "/ year", label: "Cost of bypass-related kidney injury",
    note: "Acute kidney injury affects 20–30% of patients and is the largest preventable line item in cardiac care." }
];

function Specs() {
  return (
    <section className="section section--tight">
      <div className="wrap">
        <div className="section-head" style={{marginBottom: 32}}>
          <div className="section-head__label">
            <span className="eyebrow">
              <span className="dot" aria-hidden="true"></span>
              <span className="num">005</span>
              <span>By the numbers</span>
            </span>
          </div>
          <div>
            <h2 className="h2 section-head__title">
              Validated against <em>conventional management,</em> head-to-head.
            </h2>
          </div>
        </div>

        <div className="specs">
          {SPECS.map((s, i) => (
            <div className="spec" key={i}>
              <div className="spec__num">{s.num}<span className="unit">{s.unit}</span></div>
              <div className="spec__label">{s.label}</div>
              <div className="spec__note">{s.note}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Specs = Specs;