// TrustStats — data strip + certifications
function TrustStats() {
  const stats = [
    { n: '140+', l: 'Countries served', s: 'Global coverage on every trade lane' },
    { n: '100+',  l: 'Carrier integrations', s: 'Air, ocean, ground, courier' },
    { n: '20+ yrs', l: 'In freight', s: 'Moving freight since 2001' },
    { n: '14',   l: 'Bonded warehouses', s: 'Duty-deferred across 3 regions' },
  ];
  const certs = [
    { k: 'NVOCC',            d: 'FMC-licensed' },
    { k: 'C-TPAT',           d: 'Tier II validated' },
    { k: 'IAC',              d: 'TSA-approved (air)' },
    { k: 'Bonded warehouse', d: 'CBP Class 3 CBW' },
  ];
  return (
    <section style={{ background: '#fcfcfd', borderTop: '1px solid #eaecf0', borderBottom: '1px solid #eaecf0' }}>
      <div style={{ maxWidth: 1600, margin: '0 auto', padding: '72px 64px' }}>
        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 0 }}>
          {stats.map((s, i) => (
            <div key={s.l} style={{ padding: '4px 28px', borderLeft: i===0?'none':'1px solid #eaecf0' }}>
              <div style={{ fontSize: 44, fontWeight: 700, letterSpacing: '-0.03em', color: '#101828',
                fontVariantNumeric: 'tabular-nums', lineHeight: 1 }}>{s.n}</div>
              <div style={{ fontSize: 14, fontWeight: 600, color: '#101828', marginTop: 10 }}>{s.l}</div>
              <div style={{ fontSize: 13, color: '#667085', marginTop: 4 }}>{s.s}</div>
            </div>
          ))}
        </div>
        <div style={{ marginTop: 48, display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 12 }}>
          {certs.map(c => (
            <div key={c.k} style={{ display: 'flex', alignItems: 'center', gap: 10,
              padding: '12px 14px', background: '#fff', border: '1px solid #eaecf0', borderRadius: 10 }}>
              <div style={{ width: 28, height: 28, borderRadius: 6, background: 'var(--accent-soft, #EFF6FF)',
                color: 'var(--accent-dark, #1846B0)', display: 'grid', placeItems: 'center', flex: '0 0 auto' }}>
                <Icon name="shield" size={16}/>
              </div>
              <div style={{ minWidth: 0 }}>
                <div style={{ fontSize: 13, fontWeight: 700, color: '#101828', letterSpacing: '-0.005em' }}>{c.k}</div>
                <div style={{ fontSize: 11, color: '#667085' }}>{c.d}</div>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.TrustStats = TrustStats;