const NsTeam = () => {
  const expertise = [
    { name: 'Accounting & Financial Reporting', role: 'รายงานทางการเงิน', line: 'TFRS, pre-audit, accounting adjustment, financial reporting readiness', accent: 'var(--ns-svc-accounting)', initials: 'FR' },
    { name: 'Internal Control', role: 'ระบบควบคุมภายใน', line: 'COSO, SOPs, authority matrix, governance and IPO internal control readiness', accent: 'var(--ns-svc-ic)', initials: 'IC' },
    { name: 'Internal Audit & Risk', role: 'ตรวจสอบภายในและบริหารความเสี่ยง', line: 'Risk-based audit, control assessment, ERM framework and remediation support', accent: 'var(--ns-svc-ipo)', initials: 'IA' },
    { name: 'IPO Readiness', role: 'เตรียมความพร้อมเข้าตลาดหลักทรัพย์', line: 'Capital-market readiness, governance structure and cross-functional implementation', accent: 'var(--ns-svc-success)', initials: 'IPO' },
  ];

  return (
    <section className="ns-section ns-section--deep" id="team">
      <div className="ns-container ns-team">
        <div className="ns-team__copy">
          <div className="ns-eyebrow">Our Team</div>
          <h2>ทีมที่เข้าใจทั้ง <span>มาตรฐาน</span> และการนำไปใช้จริง</h2>
          <div className="ns-gold-line" />
          <p>
            ทีมงานของเรามีประสบการณ์กว่า 20 ปี ในสายงานตรวจสอบบัญชี ตรวจสอบภายใน การให้คำปรึกษาด้านบัญชี ระบบควบคุมภายใน และการเตรียมความพร้อมสำหรับบริษัทที่ต้องการเติบโตอย่างเป็นระบบ
          </p>
          <p>
            เราทำงานร่วมกับผู้บริหารและทีมปฏิบัติงานของลูกค้าอย่างใกล้ชิด เพื่อแปลงมาตรฐาน วิชาชีพ และข้อกำหนดที่ซับซ้อนให้เป็นระบบงาน นโยบาย และแนวทางปฏิบัติที่ใช้งานได้จริง
          </p>
          <div className="ns-stats">
            <div><strong>20+</strong><span>ปีประสบการณ์</span></div>
            <div><strong>10+</strong><span>IPO Success Cases</span></div>
            <div><strong>Multi</strong><span>Sector Experience</span></div>
          </div>
        </div>

        <div className="ns-team-grid">
          {expertise.map(item => (
            <article className="ns-team-card" key={item.name} style={{ '--card-accent': item.accent }}>
              <div className="ns-team-card__bar" />
              <div className="ns-team-card__avatar">{item.initials}</div>
              <h3>{item.name}</h3>
              <p>{item.role}</p>
              <div className="ns-team-card__rule" />
              <strong>{item.line}</strong>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
};

window.NsTeam = NsTeam;