(() => {
  window.MamoruApp = window.MamoruApp || {};

  const { C, NS, Wrap } = window.MamoruApp;

  window.MamoruApp.TrustBar = function TrustBar() {
    const items = [
      { label: "夜道に特化", desc: "帰宅時や夜の外出で使いやすい備えを優先" },
      { label: "怖さを煽らない", desc: "知る・備える・選ぶ流れで次の行動へ整理" },
      { label: "確認点も明記", desc: "所持・使用・設置の注意点も合わせて掲載" },
    ];

    return (
      <section style={{ background: C.navy, padding: "48px 0" }}>
      <Wrap>
        <div className="trust-grid" style={{ display: "grid", gridTemplateColumns: "repeat(3,1fr)", gap: 40 }}>
          {items.map((item, i) => (
            <div key={i} style={{ textAlign: "center" }}>
              <div style={{ width: 32, height: 1, background: C.accent, margin: "0 auto 16px" }} />
              <div style={{ fontSize: 14, fontFamily: NS, fontWeight: 700, color: "#fff", marginBottom: 8, letterSpacing: "0.02em" }}>{item.label}</div>
              <div style={{ fontSize: 13, fontFamily: NS, color: "rgba(255,255,255,0.66)", lineHeight: 1.8 }}>{item.desc}</div>
            </div>
          ))}
        </div>
      </Wrap>
      </section>
    );
  };
})();