/* ============================================================
   utility.css — 微調整（u-）。増やしすぎない
   ============================================================ */

.u-mt-2  { margin-block-start: var(--space-2); }
.u-mt-4  { margin-block-start: var(--space-4); }
.u-mt-6  { margin-block-start: var(--space-6); }
.u-mt-8  { margin-block-start: var(--space-8); }
.u-mt-10 { margin-block-start: var(--space-10); }
.u-mt-14 { margin-block-start: var(--space-14); }

.u-text-accent { color: var(--color-accent); }
.u-text-muted  { color: var(--color-text-72); }
.u-text-en {
  font-family: var(--font-en);
  letter-spacing: var(--ls-2xl);
}

.u-lead {
  font-size: var(--fs-md);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-md);
  color: var(--color-text-72);
}

/* 文の途中で切れないようにする塊。入りきらないときは文の頭で折り返す */
.u-nobreak { display: inline-block; }

/* 語を折り返さない（箱にしない）。u-nobreak は inline-block で箱になるため、横並び（flex）の中や1行目の測定を壊す。文中の語の固定は u-nowrap を使う（2026-09-09） */
.u-nowrap { white-space: nowrap; }

/* --- ふわっと表示（JSが .js-reveal を付け、画面に入ったら .is-shown）2026-09-11 ---- */
.js-reveal {
  opacity: 0;
  translate: 0 1rem;
  transition: opacity 0.7s var(--ease), translate 0.7s var(--ease);
  transition-delay: var(--reveal-delay, 0s);
}
.js-reveal.is-shown { opacity: 1; translate: 0 0; }
/* 動きを減らす設定のときは即表示（検査の撮影もこの設定で行う） */
@media (prefers-reduced-motion: reduce) {
  .js-reveal { opacity: 1; translate: none; transition: none; }
}
