/* ============================================
   Base / Reset
   ============================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-strong);
  background: var(--surface-page);
  letter-spacing: var(--ls-base);
}
img, svg, video { max-width: 100%; }
img { height: auto; vertical-align: bottom; }
a { color: var(--link); text-decoration: none; transition: color var(--dur-fast) var(--ease-standard); }
a:hover { color: var(--link-hover); }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
table { border-collapse: collapse; width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }

/* 長い英数字・URL がコンテナを突き破らないようにする */
h1, h2, h3, h4, p, li, dd, dt, td, th, figcaption { overflow-wrap: break-word; }

/* キーボード操作時のフォーカスリング（ブランドのブルー） */
:focus-visible { outline: 2px solid var(--blue-600); outline-offset: 2px; }

/* ---- Utilities ---- */
.u-serif { font-family: var(--font-serif); }
.u-en { font-family: var(--font-latin); }
.u-gold-text {
  background: var(--grad-gold-text);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.u-gold-text--hero { background: var(--grad-gold-text-hero); -webkit-background-clip: text; background-clip: text; color: transparent; }
.u-gold-text--xl { background: var(--grad-gold-text-xl); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (forced-colors: active) {
  .u-gold-text, .u-gold-text--hero, .u-gold-text--xl { color: CanvasText; background: none; }
}

/* セクション見出しの下に続くブロックの間隔。
   PC値はPC正本、SP値は sp-top.dc.html 実測（インライン margin では SP に追従できないため） */
.u-after-head { margin-top: 64px; }
.u-after-head--stack { margin-top: 80px; }
.u-after-head--tabs { margin-top: 48px; }
.u-after-tabs { margin-top: 48px; }
.u-section-more { margin-top: 40px; }
/* 積み重ねる特集カードの間隔（PC 28px / SP 18px） */
.u-stack { display: flex; flex-direction: column; gap: var(--stack-gap); }
@media (max-width: 767px) {
  .u-after-head { margin-top: 32px; }
  .u-after-head--stack { margin-top: 40px; }
  .u-after-head--tabs { margin-top: 24px; }
  .u-after-tabs { margin-top: 20px; }
  .u-section-more { margin-top: 24px; }
}

.u-center { text-align: center; }
/* SPのみ改行する（PC/SPで改行位置が異なる見出し・リード用） */
.u-br-sp { display: none; }
@media (max-width: 767px) { .u-br-sp { display: inline; } }

.u-pc-only { display: block; }
.u-sp-only { display: none; }
@media (max-width: 767px) {
  .u-pc-only { display: none; }
  .u-sp-only { display: block; }
}

/* 動きを減らす設定を尊重（アンビエントな地球儀・流線を停止） */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
