/* polish-v5: 読みやすさの仕上げ（2026-10-06）
   既存CSSの後ろで読み込み、既存定義は書き換えずに上書きする。 */

/* 1. 日本語の改行位置：文節で折り返し、1〜2文字だけの行（「認。」「る？」等）を作らない */
.art-v2 main :where(h2, h3, .sec-lead, .hero-title, .hero-lead, .brief-lead, .final-lead, .demo-boundary, .title-line, .qa summary, .note p, .pin p, .trail-step p, .brief-grid p, .brief-grid small, .make-list li, .story-invitation p, .folder-note, .maker-text, .production-brief .btn, .final-notes li) {
  word-break: auto-phrase;
  overflow-wrap: break-word;
  text-wrap: pretty;
}
.art-v2 main :is(h2, h3) { text-wrap: balance; }

/* 2. しくみ：中央カードの文字に「解決」スタンプが重ならないようにする */
.art-v2 .pin-center { padding-bottom: 62px; }
.art-v2 .stamp { right: -20px; bottom: -30px; }

/* 3. よくある質問：罫線が文字を横切らないようにし、Qの位置をそろえる */
.art-v2 .memo { background: var(--paper); padding: 34px 30px 18px; }
.art-v2 .qa summary { padding-block: 18px; }
.art-v2 .qa summary::before { line-height: 1; padding-top: 3px; box-sizing: border-box; }

/* 4. 小さすぎる文字を12px以上に */
.art-v2 .brand-wordmark > span { font-size: 12px; }

@media (max-width: 760px) {
  /* 5. スマホのファーストビュー：見出しを意味の切れ目で改行し、何をつくる会社かの一文を戻す */
  .art-v2 .hero-title br { display: inline; }
  .art-v2 .hero-title { align-self: stretch; margin-bottom: 10px; }
  .art-v2 .hero-lead { display: block; order: 5; align-self: stretch; margin: 0 0 8px; font-size: 14px; line-height: 1.8; }
  .art-v2 .hero-lead br.pc { display: inline; }

  /* 6. よくある質問：スマホでは左右の余白を詰め、質問文の幅を確保 */
  .art-v2 .memo { padding: 30px 14px 10px; }
  .art-v2 .qa summary { gap: 10px; padding: 16px 2px; font-size: 15px; }
  .art-v2 .qa summary::before { width: 28px; height: 28px; }

  /* 7. 導入ご担当者向け節：見出しラベルが2行に割れないように */
  .art-v2 .production-brief .label { flex-wrap: wrap; gap: 6px 10px; }
  .art-v2 .production-brief .label > span { flex: none; }

  /* 2'. しくみ：スマホでは「解決」スタンプをボードの枠内に収める */
  .art-v2 .pin-center { padding-bottom: 82px; }
  .art-v2 .stamp { right: -6px; bottom: -12px; }

  /* 8. 制作の範囲：番号と本文の間をあける */
  .art-v2 .make-list li { padding-left: 72px; }
}

@media (max-width: 640px) {
  .art-v2 .head-cta { font-size: 12px; }
}
@media (max-width: 359px) {
  .art-v2 .hero-lead { font-size: 13px; }
  /* 9. 320px幅：体験版の上部ボタンが3段に割れて「↺」が見出しに重なるのを防ぐ */
  .art-v2 .hud-time, .art-v2 .hud-btn { padding-inline: 9px; }
}