/* global React */
function AIAgentPromo() {
  return (
    <section id="ai-agent" className="ai-agent-promo section section--paper-2" data-screen-label="AI Agent Promo">
      <div className="container">
        <div className="ai-agent-promo__inner reveal">
          <div className="ai-agent-promo__text">
            <span className="eyebrow">Another Service</span>
            <h2 className="ai-agent-promo__title heading-jp">
              <span>法務特化の</span>
              <em>Word AI Agent</em>
            </h2>
            <p className="ai-agent-promo__lede body-jp">
              LegalAgent は、法律事務所事業に加えて、契約書レビュー・法務文書作成を支援する Word 上の AI Agent も提供しています。<br/>
              Word ファイルに常駐し、あなたからの指示に基づいて、Word ファイルの内容を、適切に修正し、コメントを付します。<br/>
              あなた専用の優秀なアソシエイトを、Word ファイルの中に。<br/>
              Legal Agent は、契約書の修正・ドラフト作業を、10倍効率化します
            </p>
            <div className="ai-agent-promo__actions">
              <a href="https://www.legalagent.co.jp/3" target="_blank" rel="noopener" className="btn btn--gold">
                サービス詳細を見る
                <svg className="arrow" width="14" height="14" viewBox="0 0 14 14" fill="none">
                  <path d="M3 11l8-8M5 3h6v6" stroke="currentColor" strokeWidth="1.2"/>
                </svg>
              </a>
            </div>
          </div>
          <aside className="ai-agent-promo__visual" aria-hidden="true">
            <div className="ai-agent-promo__plate">
              <div className="ai-agent-promo__plate-head">
                <span className="kicker-en">PRODUCT</span>
                <span className="label">Word Add-in</span>
              </div>
              <div className="ai-agent-promo__plate-body">
                <div className="ai-agent-promo__doc">
                  <div className="ai-agent-promo__doc-line ai-agent-promo__doc-line--1"></div>
                  <div className="ai-agent-promo__doc-line ai-agent-promo__doc-line--2"></div>
                  <div className="ai-agent-promo__doc-line ai-agent-promo__doc-line--3"></div>
                  <div className="ai-agent-promo__doc-comment">
                    <span className="label">Suggestion</span>
                    <p>第3条「乙の責任」について、表現を明確化することを推奨します</p>
                  </div>
                  <div className="ai-agent-promo__doc-line ai-agent-promo__doc-line--4"></div>
                </div>
              </div>
              <div className="ai-agent-promo__plate-foot">
                <span className="kicker-en">Powered by</span>
                <strong>LegalAgent</strong>
              </div>
            </div>
          </aside>
        </div>
      </div>
    </section>
  );
}
window.AIAgentPromo = AIAgentPromo;