function Tuotteet() {
  return (
    <section className="sft-section sft-products" id="tuotteet" data-screen-label="Tuotteet">
      <div className="sft-section__inner">
        <div className="sft-section__head">
          <div className="sft-eyebrow">{window.L("Tuotteet","Products")}</div>
          <h2 className="sft-section__title">{window.L("Kaksi tuoteperhettä, sama lupaus","Two product families, one promise")}</h2>
          <p style={{ fontSize: 17, lineHeight: 1.6, color: "var(--ink-2)", margin: "8px 0 0", maxWidth: "62ch" }}>
            {window.L("Softeran tuotteet on rakennettu ratkaisemaan oikeita liiketoimintaongelmia. Molemmat tuoteperheemme kehittyvät asiakkaiden tarpeiden mukaan, ja niitä ylläpitää samat sitoutuneet tiimit vuodesta toiseen.","Softera's products are built to solve real business problems. Both product families evolve with customer needs, maintained by the same committed teams year after year.")}
          </p>
        </div>
        <div className="sft-products__grid">
          <article className="sft-product">
            <span className="sft-product__tag">{window.L("Toiminnanohjaus","Operations")}</span>
            <h3 className="sft-product__name">Softera 360°</h3>
            <p className="sft-product__tagline">
              {window.L("Kattava toiminnanohjausjärjestelmä, joka tukee tilauskäsittelyä, sopimushallintaa, laskutusta ja itsepalvelua. Räätälöityy joustavasti asiakkaan prosesseihin ja kasvaa liiketoiminnan mukana.","A comprehensive operational system supporting order handling, contract management, billing and self-service. It flexes to the customer's processes and grows with the business.")}
            </p>
            <ul className="sft-product__list">
              <li><i data-lucide="check"></i>{window.L("Tilauskäsittely ja sopimushallinta","Order handling and contract management")}</li>
              <li><i data-lucide="check"></i>{window.L("Laskutus & saatavanhallinta","Billing & receivables")}</li>
              <li><i data-lucide="check"></i>{window.L("Asiakas- ja itsepalveluportaalit","Customer and self-service portals")}</li>
              <li><i data-lucide="check"></i>{window.L("Avoimet integraatiot taustajärjestelmiin","Open integrations to back-end systems")}</li>
            </ul>
            <a className="sft-product__cta" href={window.langHref("ratkaisut#360")}>{window.L("Tutustu Softera 360°:een","Explore Softera 360°")} <i data-lucide="arrow-right"></i></a>
          </article>
          <article className="sft-product">
            <span className="sft-product__tag">{window.L("Asiakaspalvelu & myynti","Customer service & sales")}</span>
            <h3 className="sft-product__name">Softera Horizon</h3>
            <p className="sft-product__tagline">
              {window.L("Yhden näkymän työpöytä asiakaspalvelulle ja myynnille. Yhdistää puhelin-, sähköposti- ja chat-kanavat sekä asiakkaan kokonaiskuvan — ja uusimpana tekoälyavusteiset toiminnot puheluiden ja kohtaamisten käsittelyyn.","A single-view desktop for customer service and sales. It unites phone, email and chat channels and the full customer picture — and now AI-assisted features for handling calls and interactions.")}
            </p>
            <ul className="sft-product__list">
              <li><i data-lucide="check"></i>{window.L("Monikanavainen kontaktikeskus","Omnichannel contact centre")}</li>
              <li><i data-lucide="check"></i>{window.L("Asiakkaan 360°-näkymä reaaliajassa","Real-time 360° customer view")}</li>
              <li><i data-lucide="check"></i>{window.L("AI-avusteinen puheluiden käsittely","AI-assisted call handling")}</li>
              <li><i data-lucide="check"></i>{window.L("Myynnin ja palvelun yhteinen työpöytä","A shared desktop for sales and service")}</li>
            </ul>
            <a className="sft-product__cta" href={window.langHref("ratkaisut#horizon")}>{window.L("Tutustu Horizoniin","Explore Horizon")} <i data-lucide="arrow-right"></i></a>
          </article>
        </div>
      </div>
    </section>
  );
}
