// Customers — three columns: Automotive / Household & Kitchen / Office Supplies.
function Customers() {
  const groups = [
    {
      title: "Automotive Parts",
      items: [
        "PT Sinar Terang Logamjaya",
        "PT Bahtera Metalindo Indonesia",
        "Indo Saluyu Karoseri",
        "SND Global",
        "SP Racing",
        "Surya Citra",
      ],
    },
    {
      title: "Household & Kitchen",
      items: ["PT Almasindo", "PT Flipper"],
    },
    {
      title: "Office Supplies",
      items: ["PT Citra Bandung Laksana"],
    },
  ];
  return (
    <section className="dep-customers" id="pelanggan">
      <div className="section-head">
        <span className="eyebrow">Our Customers</span>
        <h2>Dipercaya lintas sektor industri.</h2>
        <p className="lead">Sebagian dari mitra produksi kami di Bandung dan sekitarnya.</p>
      </div>
      <div className="dep-customers__grid">
        {groups.map((g) => (
          <div key={g.title} className="dep-customers__col">
            <h4>{g.title}</h4>
            <ul>
              {g.items.map((c) => <li key={c}>{c}</li>)}
              <li className="etc">etc.</li>
            </ul>
          </div>
        ))}
      </div>
    </section>
  );
}
window.Customers = Customers;