/**
 * trust.jsx — "Por Qué Nosotros": four direct claims, no icons, no cards.
 * Rendered as a single centered column that speaks like a neighbour.
 */

function Trust() {
  const { t } = useLang();

  return (
    <section className="section trust" id="confianza" data-screen-label="Por qué nosotros">
      <div className="container">
        <div className="trust__logo reveal reveal--scale-in">
          <img src="images/Logonobg.png" alt="Cerrajeros Campello 24H logo" />
        </div>
        <SectionHead
          center
          kicker={t.trust.kicker}
          title={t.trust.title}
        />

        <div className="trust__list">
          {t.trust.items.map((item, i) => (
            <div className="trust-item reveal" key={item.title} style={{ "--s": i }}>
              <p className="trust-item__title">{item.title}</p>
              <p className="trust-item__desc">{item.desc}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Trust });