function Arvot() {
  const items = [
    {
      n: "01",
      t: window.L("Pitkäjänteisyys","Commitment for the long term"),
      b: window.L("Ohjelmistot, joita teemme, ovat asiakkaidemme käytössä vuosikymmeniä. Niin ovat usein myös tekijätkin: monen softeralaisen ura yhtiössä lasketaan kymmenissä vuosissa.","The software we build serves our customers for decades. So, often, do the people who build it: many Softera careers are counted in tens of years.")
    },
    {
      n: "02",
      t: window.L("Asiantuntijuus","Expertise"),
      b: window.L("Meillä jokainen pääsee tekemään merkityksellistä työtä oman alansa huippuasiantuntijoiden kanssa. Tieto ei jää siiloihin – apua saa aina.","Everyone here gets to do meaningful work alongside top experts in their field. Knowledge doesn't stay in silos — help is always at hand.")
    },
    {
      n: "03",
      t: window.L("Joustavuus","Flexibility"),
      b: window.L("Pieni yritys, jossa kukaan ei ole vain ratas isossa koneessa. Työajat, elämäntilanteet ja rooliin liittyvät kiinnostukset huomioidaan aidosti.","A small company where no one is just a cog in a big machine. Working hours, life situations and role-related interests are genuinely taken into account.")
    },
    {
      n: "04",
      t: window.L("Vastuu ja vapaus","Responsibility and freedom"),
      b: window.L("Jokainen softeralainen on tietyllä tavalla itsensä pomo: asetat tavoitteita, ratkot ongelmia ja näet työsi jäljen valmiissa tuotteissa.","Every Softera person is, in a way, their own boss: you set goals, solve problems and see the mark of your work in finished products.")
    }
  ];
  return (
    <section className="sft-section y-values" id="arvot" data-screen-label="Arvot">
      <div className="sft-section__inner">
        <div className="sft-section__head">
          <div className="sft-eyebrow">{window.L("Arvot & tapa tehdä","Values & way of working")}</div>
          <h2 className="sft-section__title">{window.L("Miten työ Softerassa tehdään","How work gets done at Softera")}</h2>
          <p style={{ fontSize: 17, lineHeight: 1.6, color: "rgba(255,255,255,0.82)", margin: "8px 0 0", maxWidth: "62ch" }}>
            {window.L("Uskomme siihen, että hyvin tehty työ kestää aikaa, ja että asiakas hyötyy eniten silloin, kun ratkaisu rakennetaan kerralla huolella. Tämä asenne näkyy sekä tuotteissamme että Softerassa työpaikkana.","We believe well-made work stands the test of time, and that the customer benefits most when a solution is built carefully the first time. That attitude shows in our products and in Softera as a workplace.")}
          </p>
        </div>
        <div className="y-values__grid">
          {items.map(it => (
            <div key={it.n} className="y-value">
              <div className="y-value__num">{it.n}</div>
              <div className="y-value__title">{it.t}</div>
              <div className="y-value__body">{it.b}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}