function CustomersPage() {
  const studies = [
    { co: 'Moreno Builders', who: 'Julia Moreno', role: 'PM · mid-rise residential', quote: "My PMs were writing daily logs at 9pm. Now the assistant drafts them from what the crew captured during the day, and they approve on the drive home.", stats: [['−92%','time to finalised log'],['14','inputs avg / day'],['3','projects in program']] },
    { co: 'Cascade Subs', who: 'Ray Park', role: 'Superintendent · electrical', quote: "The auto-tagged photo gallery alone paid for it. Instead of digging through 400 shots I type 'rebar grid C' and it's right there.", stats: [['247','photos · 1 week'],['8','pending tag review'],['0','lost finds to date']] },
    { co: 'Pacific Forge', who: 'Miguel Torres', role: 'GC · commercial', quote: "We set a per-user credit budget when we rolled out assistant access. Nobody's blown through it, and I can read the invoice CSV like a bank statement.", stats: [['50k','monthly cap'],['Observe →','Enforce mode'],['1 CSV','closes the month']] },
  ];
  return (
    <>
      <section className="section-tight pt-16">
        <Container>
          <Eyebrow>Customers</Eyebrow>
          <h1 className="m-display mt-3 max-w-3xl">Crews shipping real work, not demos.</h1>
          <p className="m-lede mt-5 max-w-2xl">We're in early access. Every engagement is hands-on, because the point is honest feedback — not logos on a grid.</p>
        </Container>
      </section>

      <section className="pb-16">
        <Container>
          <div className="space-y-6">
            {studies.map(s => (
              <div key={s.co} className="card p-8 grid md:grid-cols-12 gap-6 items-start">
                <div className="md:col-span-7">
                  <div className="sb-eyebrow">{s.co}</div>
                  <blockquote className="mt-2 text-[22px] leading-snug font-medium" style={{ letterSpacing: '-0.015em' }}>"{s.quote}"</blockquote>
                  <div className="mt-4 flex items-center gap-3">
                    <div className="w-9 h-9 rounded-full grid place-items-center" style={{ background: 'var(--bg-muted)', fontSize: 13, fontWeight: 600 }}>{s.who.split(' ').map(x=>x[0]).join('')}</div>
                    <div>
                      <div className="text-[13px] font-medium">{s.who}</div>
                      <div className="text-[12px]" style={{ color: 'var(--fg2)' }}>{s.role}</div>
                    </div>
                  </div>
                </div>
                <div className="md:col-span-5 grid grid-cols-3 gap-3">
                  {s.stats.map(st => (
                    <div key={st[1]} className="card-flat p-4" style={{ background: 'var(--bg-muted)' }}>
                      <div className="sb-display" style={{ fontSize: 22 }}>{st[0]}</div>
                      <div className="text-[11px] mt-1" style={{ color: 'var(--fg2)' }}>{st[1]}</div>
                    </div>
                  ))}
                </div>
              </div>
            ))}
          </div>
        </Container>
      </section>

      <CTABand />
    </>
  );
}
Object.assign(window, { CustomersPage });