/* =================================================================
   page.css
   - トップ階層の固定ページ専用スタイル（<body class="page"> スコープ）
   - /privacy/, /disclosure/, /contact/ など
   - PaperMod 既定の header/footer/main を打ち消し、
     page/single.html 側で定義した独自レイアウトのみ表示
   ================================================================= */

.page {
  --bg:           #ffffff;
  --bg-soft:      #f7f8f7;
  --ink:          #1a1f1a;
  --ink-2:        #4a4f4a;
  --ink-3:        #6a706a;
  --ink-mute:     #b3b8b3;
  --line:         #e3e5e3;
  --accent-700:   #2a7a3a;
  --accent-600:   #318a45;
  --maxw:         1080px;
  --maxw-narrow:  720px;

  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Inter", "Noto Sans JP", system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.75;
}

.page *  { box-sizing: border-box; }
.page a  { color: var(--accent-700); text-decoration: none; }
.page a:hover { text-decoration: underline; }
.page img { max-width: 100%; display: block; }

.page .wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }
.page .wrap-narrow { max-width: var(--maxw-narrow); }

/* PaperMod 既定の Header / Footer / Main 余白を打ち消す */
.page > header.header,
.page > footer.footer,
.page #site-banner { display: none !important; }
.page .main { padding: 0; max-width: none; margin: 0; }

/* ===== TOP BAR =====
   assets/css/pages/site-header.css に統合済み（2026-08-16）。
   .topbar / .brand* / .nav* はページ非スコープの共通スタイルに一本化したため、
   ここでの重複定義は削除した（.ic のアイコンサイズ指定のみ残す）。 */
.page .ic { width: 14px; height: 14px; stroke-width: 2; }

/* ===== HERO ===== */
.page-hero {
  padding: 56px 0 36px;
  background:
    radial-gradient(ellipse at top right, rgba(42,122,58,0.08), transparent 60%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg) 65%, var(--bg-soft) 100%);
  border-bottom: 1px solid var(--line);
}
.page .eyebrow {
  display: inline-block;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent-700); font-weight: 600;
  margin-bottom: 8px;
}
.page-title {
  font-size: clamp(24px, 3.4vw, 32px);
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 4px 0 12px;
  color: var(--ink);
}
.page-lede {
  color: var(--ink-2);
  font-size: 14.5px;
  line-height: 1.7;
  margin: 0;
}

/* ===== 本文 (PROSE) ===== */
.page-section { padding: 48px 0 64px; }
.page-prose {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.85;
}
.page-prose > :first-child { margin-top: 0; }
.page-prose > :last-child  { margin-bottom: 0; }

.page-prose h2 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.005em;
  color: var(--ink);
  margin: 48px 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--line);
}
.page-prose h2:first-child { margin-top: 0; }

.page-prose h3 {
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  margin: 32px 0 12px;
}

.page-prose p {
  margin: 0 0 16px;
  color: var(--ink);
}
.page-prose strong { color: var(--ink); font-weight: 600; }

.page-prose ul, .page-prose ol {
  margin: 0 0 16px;
  padding-left: 1.5em;
}
.page-prose li {
  margin-bottom: 6px;
  color: var(--ink-2);
}
.page-prose li > strong { color: var(--ink); }

.page-prose a {
  color: var(--accent-700);
  text-decoration: underline;
  text-decoration-color: rgba(42,122,58,0.4);
  text-underline-offset: 2px;
}
.page-prose a:hover {
  text-decoration-color: var(--accent-700);
}

.page-prose code {
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 2px 6px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 13px;
  color: var(--accent-700);
}
.page-prose pre {
  background: #0e1410;
  color: #d8dfd8;
  padding: 14px 18px;
  border-radius: 8px;
  overflow-x: auto;
  font-size: 13px;
  line-height: 1.7;
  margin: 0 0 20px;
}
.page-prose pre code {
  background: transparent;
  border: 0;
  padding: 0;
  color: inherit;
  font-size: inherit;
}

.page-prose hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 36px 0;
}

.page-prose blockquote {
  margin: 16px 0;
  padding: 12px 18px;
  border-left: 3px solid var(--accent-600);
  background: var(--bg-soft);
  color: var(--ink-2);
  font-size: 14px;
}

/* ===== FOOTER =====
   実際のHTML要素は <footer class="site-footer"> のみで、.page-footer は
   一致しないため元々効いていなかった。assets/css/pages/site-header.css の
   .site-footer 系スタイルに統合済み（2026-08-16）。 */

/* ===== Responsive =====
   .topbar 系のモバイル対応は assets/css/pages/site-header.css に統合済み（2026-08-16） */
@media (max-width: 640px) {
  .page-hero { padding: 40px 0 28px; }
  .page-section { padding: 32px 0 48px; }
  .page-prose h2 { font-size: 19px; margin-top: 36px; }
  .page-prose h3 { font-size: 16px; margin-top: 24px; }
}
