/* global React */
function Strengths() {
  const items = [
    {
      no: "01",
      en: "Expertise",
      jp: "専門性",
      head: "業界トップレベルの知識と実務ノウハウ",
      points: [
        { t: "高い専門性を持った弁護士のみが対応", d: "業界トップレベルの知識と実務ノウハウを有した弁護士のみが対応。M&A・IPO・複雑な企業法務にも、初動から確かな専門性で支援します" },
        { t: "最新判例・法改正情報のキャッチアップ", d: "常に最新の判例、法令、実務の情報を収集し、業務に反映。情報の鮮度と実務性を両立させます" },
        { t: "ナレッジ共有・情報蓄積体制", d: "メンバー間でのナレッジ共有・情報の蓄積体制が構築されているのもLegalAgentの強みです" },
      ],
    },
    {
      no: "02",
      en: "Speed",
      jp: "迅速性",
      head: "従来の法律事務所の2〜5倍の速さで対応",
      stat: { from: "5営業日", to: "1営業日", label: "標準納期" },
      points: [
        { t: "当日〜翌営業日の納品が標準", d: "ご相談を受けた当日中に返信し、原則として翌営業日までに納品。ビジネスのスピードを止めません" },
        { t: "意思決定プロセスを熟知", d: "数多くの企業や事業に寄り添ってきた経験から、スピード感ある意思決定を支えます" },
        { t: "M&Aは2〜5営業日でリスク分析", d: "資料開示から2〜5営業日で初期リスク分析を完了。法務でディールが停滞しません" },
      ],
    },
    {
      no: "03",
      en: "Business Sense",
      jp: "事業理解",
      head: "貴社の事業に踏み込み、内製化に近い形で支援",
      points: [
        { t: "Slack・Teams で常駐", d: "依頼から納品まで、Slack・Teams 上で完結。社内法務部員のように、貴社のチームの一員として対応します" },
        { t: "社内ルール・オペレーションを理解", d: "社内のレビュー基準やオペレーションフローを理解し、組織ごとに最も効率的な対応を実践します" },
        { t: "固定価格・明朗会計", d: "月額顧問・スポット案件ともに固定価格を基本とし、コストの予見性を担保。安心してご相談いただけます" },
      ],
    },
  ];

  return (
    <section id="strengths" className="strengths section section--paper-2" data-screen-label="04 Strengths">
      <div className="container">
        <div className="strengths__head">
          <span className="eyebrow">Three Strengths</span>
          <h2 className="strengths__title heading-jp">
            LegalAgentが選ばれる、<em>三つの理由</em>
          </h2>
        </div>

        {items.map((it, i) => (
          <article key={it.no} className={`strength-block ${i % 2 ? "strength-block--reverse" : ""}`}>
            <div className="strength-block__index">
              <span className="tag-num">{it.no}</span>
              <span className="kicker-en">{it.en}</span>
              <h3 className="strength-block__jp">{it.jp}</h3>
              <p className="strength-block__head">{it.head}</p>
              {it.stat && (
                <div className="strength-block__stat">
                  <span className="strength-block__stat-from">{it.stat.from}</span>
                  <svg width="40" height="14" viewBox="0 0 40 14" fill="none"><path d="M2 7h36M32 2l6 5-6 5" stroke="currentColor" strokeWidth="1"/></svg>
                  <span className="strength-block__stat-to">{it.stat.to}</span>
                  <em>{it.stat.label}</em>
                </div>
              )}
            </div>
            <div className="strength-block__points">
              {it.points.map((p, k) => (
                <div key={k} className="strength-point">
                  <span className="label">{String(k+1).padStart(2,"0")}</span>
                  <h4>{p.t}</h4>
                  <p>{p.d}</p>
                </div>
              ))}
            </div>
          </article>
        ))}
      </div>
    </section>
  );
}

window.Strengths = Strengths;