// K-Trust as structural planning strategy + Insurance liquidity bridge
const KTrust = () => {
  return (
    <section className="ktrust-section paper-2" id="ktrust">
      <div className="container">
        <div className="section-head center reveal">
          <div className="eyebrow" style={{justifyContent: 'center'}}>K-Trust Strategy</div>
          <h2 className="section-title">
            연속성 · 명료성 · 통제력<br/>
            <span style={{color: 'var(--gold-soft)'}}>K-Trust 설계의 세 축</span>
          </h2>
          <span className="gold-rule center"/>
          <p className="section-desc">
            일회성 계산이 아닌, 세대를 잇는 <em>구조적 설계</em>입니다.
            상속·증여의 순간 이후에도 자산은 흔들리지 않아야 합니다.
          </p>
        </div>

        <div className="pillars">
          <div className="pillar reveal">
            <div className="p-icon"><svg viewBox="0 0 40 40" width="40" height="40"><circle cx="20" cy="20" r="18" fill="none" stroke="#d4af37" strokeWidth="1"/><path d="M8 20 L14 26 L32 12" stroke="#1a3a52" strokeWidth="1.5" fill="none"/></svg></div>
            <div className="p-num serif">01</div>
            <h3 className="p-title serif">Continuity · 연속성</h3>
            <p className="p-body">한 세대에서 끝나지 않는 자산의 흐름 — 시간의 축을 따라 자연스럽게 이어지는 구조를 설계합니다.</p>
          </div>
          <div className="pillar reveal reveal-delay-1">
            <div className="p-icon"><svg viewBox="0 0 40 40" width="40" height="40"><circle cx="20" cy="20" r="18" fill="none" stroke="#d4af37" strokeWidth="1"/><path d="M12 15 H28 M12 20 H28 M12 25 H22" stroke="#1a3a52" strokeWidth="1.5"/></svg></div>
            <div className="p-num serif">02</div>
            <h3 className="p-title serif">Clarity · 명료성</h3>
            <p className="p-body">무엇을, 어떻게, 언제 — 가족 모두가 이해할 수 있는 언어로 자산의 지도를 그립니다.</p>
          </div>
          <div className="pillar reveal reveal-delay-2">
            <div className="p-icon"><svg viewBox="0 0 40 40" width="40" height="40"><circle cx="20" cy="20" r="18" fill="none" stroke="#d4af37" strokeWidth="1"/><rect x="14" y="14" width="12" height="12" fill="none" stroke="#1a3a52" strokeWidth="1.5"/><circle cx="20" cy="20" r="2" fill="#1a3a52"/></svg></div>
            <div className="p-num serif">03</div>
            <h3 className="p-title serif">Control · 통제력</h3>
            <p className="p-body">계획된 시점, 계획된 방식으로 자산을 이전할 수 있는 힘 — 결정권을 잃지 않는 설계.</p>
          </div>
        </div>

        {/* ═══════════════════════════════════════════
             🌉 브릿지 문구 · K-Trust 3축 → 보험 등장 자연 연결
             ═══════════════════════════════════════════ */}
        <div className="pillars-to-bridge reveal">
          <div className="ptb-line"/>
          <div className="ptb-text serif">
            이 세 축은 <em>하나의 도구</em>를 만나야 완성됩니다.
          </div>
          <div className="ptb-mark serif">↓</div>
        </div>

        {/* ═══════════════════════════════════════════
             보험 = 세금 방어 프레임 (완전 재구성)
             · 프리미엄 카드 · 골드 씰 다이어그램 · 세금 방어 문구
             ═══════════════════════════════════════════ */}
        <div className="bridge-block bridge-block-v2 reveal">
          {/* 좌측 · 크고 선명한 SVG 다이어그램 */}
          <div className="bridge-visual bridge-visual-v2">
            <svg viewBox="0 0 560 220" preserveAspectRatio="xMidYMid meet">
              <defs>
                {/* 골드 그라디언트 · 다리 곡선 */}
                <linearGradient id="bridgeGrad2" x1="0" x2="1">
                  <stop offset="0" stopColor="#1a3a52" stopOpacity="0.4"/>
                  <stop offset="0.3" stopColor="#d4af37"/>
                  <stop offset="0.7" stopColor="#d4af37"/>
                  <stop offset="1" stopColor="#1a3a52" stopOpacity="0.4"/>
                </linearGradient>
                {/* 골드 씰 그림자 */}
                <radialGradient id="sealGlow" cx="50%" cy="50%" r="50%">
                  <stop offset="0" stopColor="#d4af37" stopOpacity="0.4"/>
                  <stop offset="1" stopColor="#d4af37" stopOpacity="0"/>
                </radialGradient>
                {/* 좌측 자산 카드 그림자 */}
                <filter id="softShadow" x="-20%" y="-20%" width="140%" height="140%">
                  <feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
                  <feOffset dy="2"/>
                  <feComponentTransfer><feFuncA type="linear" slope="0.15"/></feComponentTransfer>
                  <feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge>
                </filter>
              </defs>

              {/* 하단 물결 (세금이 갑자기 밀려오는 흐름 상징) */}
              <line x1="130" y1="200" x2="430" y2="200" stroke="#c9c1af" strokeWidth="0.8" strokeDasharray="3 5" opacity="0.6"/>
              <line x1="130" y1="210" x2="430" y2="210" stroke="#c9c1af" strokeWidth="0.5" strokeDasharray="2 4" opacity="0.4"/>

              {/* 좌측 · 부동산 자산 (라벨 + 카드 + 서브텍스트) */}
              {/* 상단 라벨 · 더 진하게 (#6b7885 → #1a3a52 · font-weight 700) */}
              <text x="80" y="42" textAnchor="middle" fontSize="13" fill="#1a3a52" fontFamily="Pretendard" letterSpacing="1.5" fontWeight="700">비유동성</text>
              <rect x="30" y="70" width="100" height="120" fill="white" stroke="#1a3a52" strokeWidth="2" filter="url(#softShadow)"/>
              <rect x="30" y="70" width="100" height="6" fill="#1a3a52"/>
              <text x="80" y="128" textAnchor="middle" fontSize="16" fill="#1a3a52" fontFamily="Noto Serif KR" fontWeight="500">부동산</text>
              <text x="80" y="150" textAnchor="middle" fontSize="14" fill="#1a3a52" fontFamily="Noto Serif KR" fontWeight="500">자산</text>
              <text x="80" y="175" textAnchor="middle" fontSize="10" fill="#6b7885" fontFamily="JetBrains Mono" fontWeight="600">ILLIQUID</text>

              {/* 우측 · 세금 · 상속세 (라벨 + 카드 + 서브텍스트) */}
              {/* 상단 라벨 · 더 진하게 (#8a6708 유지, fontSize·fontWeight 강화) */}
              <text x="480" y="42" textAnchor="middle" fontSize="13" fill="#8a6708" fontFamily="Pretendard" letterSpacing="1.5" fontWeight="700">세금 · 6개월 이내</text>
              <rect x="430" y="70" width="100" height="120" fill="white" stroke="#8a6708" strokeWidth="2" filter="url(#softShadow)"/>
              <rect x="430" y="70" width="100" height="6" fill="#8a6708"/>
              <text x="480" y="128" textAnchor="middle" fontSize="16" fill="#8a6708" fontFamily="Noto Serif KR" fontWeight="500">상속세</text>
              <text x="480" y="150" textAnchor="middle" fontSize="14" fill="#8a6708" fontFamily="Noto Serif KR" fontWeight="500">현금 필요</text>
              <text x="480" y="175" textAnchor="middle" fontSize="10" fill="#9c7418" fontFamily="JetBrains Mono" fontWeight="600">CASH DUE</text>

              {/* 다리 곡선 · 두꺼운 골드 (2 → 4) */}
              <path d="M130 70 Q 280 -10 430 70" fill="none" stroke="url(#bridgeGrad2)" strokeWidth="4"/>
              <path d="M130 70 Q 280 -10 430 70" fill="none" stroke="#d4af37" strokeWidth="1" opacity="0.5" strokeDasharray="4 4"/>

              {/* 중앙 골드 씰 · K-TRUST 제거 · "보험" 만 크게 배치 */}
              <circle cx="280" cy="30" r="38" fill="url(#sealGlow)"/>
              <circle cx="280" cy="30" r="30" fill="white" stroke="#d4af37" strokeWidth="2"/>
              <circle cx="280" cy="30" r="26" fill="none" stroke="#d4af37" strokeWidth="0.8" strokeDasharray="1.5 1.5"/>
              <text x="280" y="37" textAnchor="middle" fontSize="18" fill="#1a3a52" fontFamily="Noto Serif KR" fontWeight="600" letterSpacing="1">보험</text>

              {/* FLOW 마커 제거 (교수님 지시) */}
            </svg>
          </div>

          {/* 우측 · 새 문구 (세금 방어 프레임) */}
          <div className="bridge-text bridge-text-v2">
            <div className="btv2-eyebrow mono">INSURANCE · Tax Defense Framework</div>
            <h3 className="btv2-title serif">
              <em>세금 방어 목적의 유동성 다리</em>
            </h3>
            <p className="btv2-body">
              부동산은 시간이 지나며 커지지만, 상속세는
              <strong> 6개월 안에 현금으로 </strong>납부해야 합니다.
              그 <em>순간의 간격</em>을 메우는 정교한 장치가 필요합니다.
            </p>
            <div className="btv2-emphasis">
              <span className="bte-mark">◈</span>
              <span className="bte-text">
                K-Trust 설계에서 보험은 <strong>상품이 아닌 구조</strong>로 자리합니다.
              </span>
            </div>
          </div>
        </div>

        {/* ═══════════════════════════════════════════
             다음 섹션(보험 계약 구조)로 자연 연결
             ═══════════════════════════════════════════ */}
        <div className="bridge-to-next reveal">
          <div className="btn-line"/>
          <div className="btn-text mono">
            그렇다면 · 어떤 <span className="btn-text-em">보험 계약 구조</span>가
            <span className="btn-text-em"> 세금을 지키는가</span>
          </div>
          <div className="btn-arrow serif">↓</div>
        </div>
      </div>
    </section>
  );
};

Object.assign(window, { KTrust });