// Why real-estate inheritance/gift planning matters
// · 자산가 위기 통계 강화 (국세청 · 언론 인용 · 실제 사례)
const Why = () => {
  // ─── 자산가 위기 통계 · 국세청 공식 데이터 (2024년 기준) ─────
  const stats = [
    {
      num: '01',
      value: '+130.9',
      unit: '%',
      label: '상속세 신고자 · 5년간 증가율',
      detail: '2019년 8,449명 → 2024년 19,506명',
      source: '국세청 국세통계 2025',
    },
    {
      num: '02',
      value: '+174.3',
      unit: '%',
      label: '총 상속재산 · 5년간 증가율',
      detail: '2019년 20.6조원 → 2024년 56.5조원',
      source: '국세청 국세통계 2025',
    },
    {
      num: '03',
      value: '43.6',
      unit: '%',
      label: '10~20억 구간 상속자 비율',
      detail: '아파트 한 채 상속 시대 · 8,510명',
      source: '국세청 국세통계 2025',
    },
    {
      num: '04',
      value: '+75.0',
      unit: '%',
      label: '20세 미만 증여재산 증가율',
      detail: '2018년 1.6조원 → 2024년 2.8조원',
      source: '국세청 · 사전증여 급증',
    },
  ];

  // ─── 3가지 근본 이유 (기존 유지) ─────
  const cards = [
    {
      num: '01',
      title: '자산의 크기가 아닌\n구조의 문제입니다',
      body: '동일한 규모의 자산도 어떻게 구성되어 있는가에 따라 상속과 증여의 준비도는 크게 달라집니다. 부동산·현금·금융자산의 비율이 지금의 결정을 좌우합니다.',
    },
    {
      num: '02',
      title: '세금은 순간이지만\n영향은 세대에 남습니다',
      body: '상속·증여세는 한 시점의 사건처럼 보이지만, 그 결과는 가족의 다음 세대까지 이어집니다. 지금 정돈해 두는 구조가 미래의 여유를 만듭니다.',
    },
    {
      num: '03',
      title: '가족의 이야기 위에\n숫자가 놓입니다',
      body: '설계는 계산이 아닌 대화에서 시작됩니다. 가족 구조·유류분·의사결정의 우선순위 — 사람의 맥락 위에 세금과 유동성의 숫자가 자리합니다.',
    },
  ];

  return (
    <section className="why-section" id="points">
      <div className="container">
        <div className="section-head reveal">
          <div className="eyebrow">Why It Matters</div>
          <h2 className="section-title">왜 지금,<br/>부동산 상속·증여 설계인가</h2>
          <p className="section-desc">
            상속과 증여는 언젠가 마주하게 될 순간입니다. 문제는 시점이 아니라,
            그 순간에 <em>자산 구조가 얼마나 정돈되어 있는가</em> 입니다.
          </p>
        </div>

        {/* ═══════════════════════════════════════════
             🚨 자산가 위기 통계 · 국세청 공식 데이터
             ═══════════════════════════════════════════ */}
        <div className="why-alarm reveal">
          <div className="wa-head">
            <div className="wa-eyebrow mono">
              <span className="wa-red-dot"/>
              National Statistics · 국세청 국세통계 · 2025
            </div>
            <h3 className="wa-title serif">
              지난 <em>5년 사이</em>, 무엇이 달라졌나
            </h3>
            <p className="wa-desc">
              상속세는 이제 <strong>일부 초고액 자산가의 문제</strong>가 아닙니다.
              부동산 한 채가 있는 <em>보통 자산가</em>에게도 다가온 <strong>현실</strong>입니다.
            </p>
          </div>

          <div className="wa-stats">
            {stats.map(s => (
              <div key={s.num} className="wa-stat">
                <div className="was-header">
                  <span className="was-num mono">{s.num}</span>
                  <span className="was-source mono">{s.source}</span>
                </div>
                <div className="was-value serif">
                  <span className="wasv-num">{s.value}</span>
                  <span className="wasv-unit">{s.unit}</span>
                </div>
                <div className="was-label">{s.label}</div>
                <div className="was-detail">{s.detail}</div>
              </div>
            ))}
          </div>

          {/* 언론 인용 · 시장 변화 신호 */}
          <div className="wa-press">
            <div className="wap-lbl mono">Press Coverage · 시장이 움직이고 있습니다</div>

            <div className="wap-items">
              <div className="wap-item">
                <div className="wapi-headline serif">
                  종합재산신탁 잔고, <em>사상 첫 1조원 돌파</em>
                </div>
                <div className="wapi-body">
                  <strong>전년比 +50.6% 급증</strong> · 부자들의 전유물이던 신탁이
                  초고령사회 진입과 함께 <em>국민 재산 관리 수단</em>으로 자리 잡고 있다.
                </div>
                <div className="wapi-source">— 이데일리 · 2025.08</div>
              </div>

              <div className="wap-item">
                <div className="wapi-headline serif">
                  보험금청구권 신탁 계약 <em>6,715억원</em> 돌파
                </div>
                <div className="wapi-body">
                  삼성생명 <strong>첫 지급 사례 등장</strong> · 60대 여성이 딸에게
                  <em> 분할 지급 설계</em>. 상속 대안으로 활용도 커질 것.
                </div>
                <div className="wapi-source">— 한국경제 · 2026.03</div>
              </div>
            </div>
          </div>

          {/* 결론 인용 · 위기감 형성 */}
          <div className="wa-conclusion">
            <div className="wac-mark">◈</div>
            <div className="wac-body">
              <p className="wac-lead serif">
                시장은 이미 움직이고 있습니다.<br/>
                문제는 <em>내 자산 구조가 그 흐름을 따라가고 있는가</em>입니다.
              </p>
            </div>
          </div>
        </div>

        {/* 기존 3카드 · 근본 이유 (구조·세대·가족) */}
        <div className="why-grid">
          {cards.map((c, i) => (
            <article key={c.num} className={`why-card reveal reveal-delay-${i + 1}`}>
              <div className="wc-num serif">{c.num}</div>
              <h3 className="wc-title serif">
                {c.title.split('\n').map((l, j) => <span key={j}>{l}<br/></span>)}
              </h3>
              <div className="gold-rule"/>
              <p className="wc-body">{c.body}</p>
            </article>
          ))}
        </div>

        <div className="why-quote reveal">
          <div className="why-quote-mark serif">"</div>
          <p className="why-quote-text serif">
            중요한 것은 얼마를 가졌는가가 아니라,<br/>
            <span className="wq-accent">그 자산이 어떤 구조 위에 서 있는가</span> 입니다.
          </p>
        </div>
      </div>
    </section>
  );
};

Object.assign(window, { Why });