const valueCards = [
  { title: 'Snelheid van levering', text: 'Van idee naar werkende applicatie in weken, niet maanden. Agile development met wekelijkse demo\'s en continue feedback loops.' },
  { title: 'Veiligheid by design', text: 'Security is geen afterthought. Elke applicatie wordt gebouwd met enterprise-grade beveiliging, encryptie en compliance als fundament.' },
  { title: 'Schaalbaar zonder pijn', text: 'Clean Architecture zorgt ervoor dat uw software meegroeit. Van 10 naar 10.000 gebruikers zonder herschrijven.' },
  { title: 'Maatwerk zonder compromis', text: 'Geen off-the-shelf pakket dat 80% dekt. Wij bouwen precies wat u nodig heeft, hoe u het nodig heeft.' },
  { title: 'Transparant partnerschap', text: 'U ziet altijd wat er gebouwd wordt. Wekelijkse updates, open communicatie en een vast aanspreekpunt.' },
  { title: 'MKB-prijs', text: 'Enterprise software hoeft geen enterprise prijskaartje te hebben. Eerlijke pricing zonder verborgen kosten of lock-in.' },
];

function Values() {
  return (
    <section className="values">
      <div className="values-header">
        <span className="section-label">Waarom Nakamoto</span>
        <h2>Enterprise kwaliteit.<br />Zonder enterprise budget.</h2>
      </div>
      <div className="values-grid">
        {valueCards.map((card, i) => (
          <div className="value-card" key={i}>
            <span className="value-num">0{i + 1}</span>
            <h3>{card.title}</h3>
            <p>{card.text}</p>
          </div>
        ))}
      </div>
    </section>
  );
}

Object.assign(window, { Values });