/* global React */
function Lawyers() {
  const lawyers = [
    {
      photo: "assets/lawyers/asato.jpg",
      initials: "AN",
      name: "朝戸 統覚",
      en: "Asato Noriaki",
      role: "代表 / Founder & CEO",
      spec: ["M&A", "資金調達", "ベンチャー投資", "IPO支援", "ジェネラルコーポレート"],
      bio: ["2015 一橋大学法学部 卒業 / 予備試験合格", "2016 司法試験合格 / 東京大学法科大学院 中退", "2017 アンダーソン・毛利・友常法律事務所 入所", "2020 AZX Professionals Group 入所", "2024 Legal Agent 創業（ANRI・BoostCapital より調達）"],
    },
    {
      photo: "assets/lawyers/sugai.png",
      initials: "ST",
      name: "須貝 崇史",
      en: "Sugai Takashi",
      role: "弁護士 / 企業法務Practice",
      spec: ["スタートアップ法務", "契約業務DX", "予防法務", "紛争対応", "家事事件"],
      bio: ["立教大学法学部 卒業 / 中央大学法科大学院 修了", "2019.09 司法試験合格", "2019.12 ContractS株式会社 CEO室（契約業務DX 100社以上に従事）", "2021.12 最高裁判所司法研修所", "2023.01 法律事務所アルシエン", "2026.04 Legal Agent法律事務所 参画"],
    },
    {
      photo: "assets/lawyers/hirukawa.jpg",
      initials: "HK",
      name: "比留川 浩介",
      en: "Hirukawa Kosuke",
      role: "弁護士 / 知財Practice",
      spec: ["知的財産分野全般", "特許紛争", "スタートアップ法務", "一般民事"],
      bio: ["東京工業高等専門学校 卒業", "東京工業大学 生命理工学研究科 修了", "都内特許事務所にて弁理士実務・訴訟業務に従事", "2019.04 特許庁出向（スタートアップ支援等）", "2025 Legal Agent 参加"],
    },
    {
      photo: "assets/lawyers/hayakawa.jpg",
      initials: "HD",
      name: "早川 大介",
      en: "Hayakawa Daisuke",
      role: "弁護士 / 企業法務Practice",
      spec: ["企業法務全般", "上場企業法務", "スタートアップ法務"],
      bio: ["2019 東京都立大学法科大学院 修了", "2020 司法試験合格", "2022 弁護士登録（東京弁護士会）", "上場企業・スタートアップを中心に100社以上の企業法務案件に従事", "2024 MySecond法律事務所 設立 / 2026 Legal Agent ジョイン"],
    },
  ];
  return (
    <section id="lawyers" className="lawyers section section--ink" data-screen-label="09 Lawyers">
      <div className="container">
        <div className="lawyers__head reveal">
          <span className="eyebrow">Our Counsel</span>
          <h2 className="lawyers__title heading-jp">
            専門性を持った<br/><em>所属弁護士</em>
          </h2>
        </div>
        <div className="lawyers__grid">
          {lawyers.map((l, i) => (
            <article key={i} className={`lawyer reveal reveal--delay-${i + 1} lift spotlight`}>
              <div className="lawyer__portrait" aria-hidden="true">
                {l.photo
                  ? <img src={l.photo} alt={l.name} loading="lazy" />
                  : <span>{l.initials}</span>}
                <svg viewBox="0 0 200 200" className="lawyer__portrait-ring"><circle cx="100" cy="100" r="98" fill="none" stroke="currentColor" strokeWidth="0.5"/></svg>
              </div>
              <div className="lawyer__head">
                <span className="kicker-en">{l.en}</span>
                <h3 className="lawyer__name">{l.name}</h3>
                <span className="label">{l.role}</span>
              </div>
              <div className="lawyer__spec">
                {l.spec.map((s, k) => (<span key={k}>{s}</span>))}
              </div>
              <ul className="lawyer__bio">
                {l.bio.map((b, k) => (<li key={k}>{b}</li>))}
              </ul>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Lawyers = Lawyers;