/* ==========================================================================
   mer-jp.css — 日本語の折り返しを整える
   内田FB: 縦画面で意味のないところで区切れる

   日本語は「文節の境目」で折らないと、助詞だけが行頭に残ったり、
   熟語が真ん中で割れたりする。`word-break: auto-phrase` は
   ブラウザが文節を判定して折ってくれる（Chrome/Edge対応・他は無視されるだけ）。
   `text-wrap: pretty` と組み合わせて、最終行に1語だけ落ちるのも避ける。
   最後に読み込む（他のCSSより後勝ち）。
   ========================================================================== */

.mer-display,
.mer-heading,
.mer-hero-note,
.mer-lead-statement,
.mer-intro,
.mer-kicker,
.mer-story__lead,
.mer-story__close,
.mer-saga h3,
.mer-saga p,
.mer-prose p,
.mer-mark__note,
.mer-mark__label,
.mer-play__card h3,
.mer-play__card p,
.mer-cta__copy,
.mer-principles h3,
.mer-principles span,
.mer-company-list dt,
.mer-company-list dd,
.mer-footer__tag,
.mer-cta__btn-main {
  word-break: auto-phrase;
  overflow-wrap: normal;
  line-break: strict;
}

/* 見出しは行の長さも揃える。ぶら下がりの1文字を作らない。 */
.mer-display,
.mer-heading,
.mer-saga h3,
.mer-play__card h3 {
  text-wrap: balance;
}

/* 本文は最終行に1語だけ落とさない。 */
.mer-hero-note,
.mer-intro,
.mer-story__lead,
.mer-story__close,
.mer-saga p,
.mer-prose p,
.mer-mark__note,
.mer-play__card p,
.mer-cta__copy {
  text-wrap: pretty;
}

@media (max-width: 980px) {
  /* 縦画面では、意味の切れ目で入れた行分けが二重に折れて読みにくくなる。
     行分けは活かしたまま、各行の中を文節で折る。 */
  .mer-hero-note .mer-line,
  .mer-story__close .mer-line,
  .mer-prose .mer-line,
  .mer-heading .mer-line {
    word-break: auto-phrase;
    text-wrap: pretty;
  }

  /* 番号と単位が離れて折れないよう、数字のかたまりは割らせない */
  .mer-mark__figure,
  .mer-ledger__figure { white-space: nowrap; }
}

/* About の見出しは「愛と強みに変換する人。」を割らない。
   実測: 1920px / 390px / 320px で2行に折れていた。器に1行で収まる上限に合わせる。 */
#about .mer-heading {
  font-size: clamp(1.85rem, 4.2vw, 3.72rem);
  text-wrap: nowrap;
}

@media (max-width: 360px) {
  #about .mer-heading { font-size: 1.58rem; }
}