:root {
  --color-text: #000000;
  --color-blue: #0C4DA2;
  --color-cyan: rgba(48, 161, 210, 1);
  --color-yellow: #F5FF02;
  --color-wave: #BEF0F4;

  --font-base: "Noto Sans JP", sans-serif;
}

/* ページ内アンカーへ滑らかにスクロール（視差軽減設定のユーザーには即時ジャンプ） */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body {
  font-family: var(--font-base);
  color: var(--color-text);
  line-height: 1.8;
}

/* ========================================================================
   スクロールリビール（.js-reveal）
   - 画面に入ると下から現れる（main.js の IntersectionObserver が .is-shown を付与）
   - html.is-reveal-ready は main.js が付与。JS 無効時はクラスが付かず要素は表示のまま
   - prefers-reduced-motion 時は常に表示
   ======================================================================== */
.is-reveal-ready .js-reveal {
  opacity: 0;
  transform: translateY(28px);   /* translate プロパティは古いブラウザ非対応のため transform を使う */
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.is-reveal-ready .js-reveal.is-shown {
  opacity: 1;
  transform: none;
}

/* ========================================================================
   非公開ページの案内（管理画面でセクションを非表示にしたページの直アクセス時）
   - ページ固有CSSは読み込まれないため、共通CSSでスタイルを完結させる
   ======================================================================== */
.p-unpublished {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50vh;
  padding: 80px 24px;
}
.p-unpublished-inner {
  max-width: 680px;
  text-align: center;
}
.p-unpublished-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--color-blue);
  margin: 0 0 12px;
}
.p-unpublished-text {
  color: #5a7186;
  margin: 0 0 28px;
}
.p-unpublished-home {
  display: inline-block;
  padding: 12px 28px;
  border-radius: 999px;
  background: var(--color-blue);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
.p-unpublished-home:hover {
  opacity: 0.88;
}