function Palvelukonsepti() {
  const stages = [
    { n: '01', t: 'Kartoitus',              d: 'Käydään yhdessä aulat, sisäänkäynnit, opastepisteet.' },
    { n: '02', t: 'Laitetoimitus',          d: 'Näytöt, kiinnikkeet, mediasoittimet.' },
    { n: '03', t: 'Asennus & sähkö',         d: 'Mekaniikka, sähkö, data — yhdellä työmaakäynnillä.' },
    { n: '04', t: 'Sisältö & koulutus',       d: 'Pohjat valmiina, pääkäyttäjä oppii 20 min.' },
    { n: '05', t: 'Ylläpito',                d: 'Etovalvonta, päivitykset, takuun käsittely.' },
  ];

  return (
    <section id="palvelukonsepti" className="palvelukonsepti surface-paper">
      <div className="container">
        <div className="palvelukonsepti__head">
          <p className="eyebrow">PALVELUKONSEPTI</p>
          <h2 className="palvelukonsepti__h">
            Yksi kumppani<br/>
            <span className="palvelukonsepti__h-accent">koko kiinteistön näytöille.</span>
          </h2>
        </div>

        <div className="palvelukonsepti__grid">
          <div className="palvelukonsepti__copy">
            <p>
              Riippumatta siitä, tarvitseeko kiinteistö yhden aulanäytön vai hallinnoija
              kymmeniä kohteita kerralla — toimitamme kaiken laitteesta sisältöön, asennukseen ja
              ylläpitoon. Joko erikseen tai yhdessä, asiakkaan ehdoilla.
            </p>
            <p>
              Yritys on perustettu 2024. Organisaatiostamme löytyy osaamista monen teknologian
              osalta. Digitaalimainoksen taustalla on globaalin laitetoimittajan tuki sekä
              asiantunteva organisaatio. Tällä varmistamme laajan osaamisen sekä resurssit
              myös suurimpiin kiinteistökantoihin.
            </p>
            <p>
              Laajan partneriverkoston ansiosta emme ole paikkakuntariippuvaisia. Projektit
              toteutetaan siellä, missä ratkaisuja tarvitset — Helsingistä Rovaniemelle.
            </p>

            <div className="palvelukonsepti__chips">
              <span className="tag">Liikekiinteistöt</span>
              <span className="tag">Kauppakeskukset</span>
              <span className="tag">Kiinteistönomistajat</span>
              <span className="tag">Toimitilat</span>
              <span className="tag">Hotellit</span>
              <span className="tag">Liiketilat</span>
            </div>
          </div>

          <ol className="palvelukonsepti__stages" aria-label="Toimitusprosessi vaihe vaiheelta">
            {stages.map((s) => (
              <li key={s.n} className="stage">
                <span className="stage__num mono">{s.n}</span>
                <div className="stage__body">
                  <h3 className="stage__t">{s.t}</h3>
                  <p className="stage__d">{s.d}</p>
                </div>
              </li>
            ))}
          </ol>
        </div>
      </div>
    </section>
  );
}

window.Palvelukonsepti = Palvelukonsepti;