/**
 * お金の流れ — 収入構造の全体地図 / okane-no-nagare.css
 *
 * 設計思想:
 *   - #onn-root 配下のみ完全独立デザイン
 *   - Cocoon / entry-content / article 干渉を完全排除
 *   - CSS カスタムプロパティで全色・全値を管理
 *   - モバイルファースト + clamp() 流体タイポグラフィ
 *   - アニメーションは opacity / transform / filter のみ使用
 *   - カラーパレット: 深森林ブラック × ゴールド × アイボリー
 *     「お金は川のように流れる」モチーフ — 深い緑の渓谷と黄金の光
 *   - フォント: Cormorant Garamond (欧文Display) /
 *               Shippori Mincho (日本語明朝) /
 *               Zen Kaku Gothic New (日本語ゴシック)
 *   - 行間設計: デバイス別 line-height 完全最適化（Section 10）
 *   - 配色アクセシビリティ: コントラスト比 4.5:1 以上保証（Section 8）
 *   - テキスト中央配置: 二層構造（Section 9）
 *
 * @package cocoon-child-master
 */

/* ================================================================
   1. COCOON 干渉リセット（完全排除）
   ================================================================ */
.okane-no-nagare .article,
.okane-no-nagare .entry-content,
.okane-no-nagare .main,
.okane-no-nagare .content,
.okane-no-nagare .wrap,
.okane-no-nagare #main,
.okane-no-nagare #body-in,
.okane-no-nagare #container,
.okane-no-nagare #container-in,
.okane-no-nagare #contents,
.okane-no-nagare #contents-in {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  float: none !important;
  position: static !important;
  overflow: visible !important;
  height: auto !important;
  min-height: 0 !important;
  flex: none !important;
}

.okane-no-nagare #sidebar,
.okane-no-nagare .sidebar,
.okane-no-nagare #sidebar-scroll,
.okane-no-nagare .sidebar-top,
.okane-no-nagare .sidebar-bottom { display: none !important; }

.okane-no-nagare #footer:not(.tp-footer),
.okane-no-nagare .site-footer:not(.tp-footer),
.okane-no-nagare .footer:not(.tp-footer) { display: none !important; }


/* ================================================================
   2. CSS カスタムプロパティ（全色・全値） ★v3.0: 行間・文字間隔追加
   ================================================================ */
#onn-root {

  /* ─ カラーパレット ─ */
  --onn-bg:           #0b1a09;   /* 最深部: 深い森林ブラック */
  --onn-bg-2:         #122012;   /* セカンダリ背景: 少し明るい深森 */
  --onn-bg-dark:      #060f05;   /* 最暗部: overview section用 */
  --onn-bg-card:      #1a2d18;   /* カード背景 */
  --onn-bg-card-2:    #203520;   /* カード背景（明るめ） */
  --onn-gold:         #c9a84c;   /* ゴールド基本色 */
  --onn-gold-bright:  #e0bc6e;   /* ゴールド明るい */
  --onn-gold-light:   #ecddb3;   /* ゴールド薄い */
  --onn-moss:         #7a9e52;   /* モスグリーン */
  --onn-text:         #e8e2d0;   /* テキスト主: アイボリー */
  --onn-text-2:       #c4bc9e;   /* テキスト副 */
  --onn-text-3:       #8a8268;   /* テキスト薄: キャプション */
  --onn-border:       rgba(201,168,76, 0.2);
  --onn-border-soft:  rgba(201,168,76, 0.12);

  /* ─ タイポグラフィ ─ */
  --onn-font-sans:    'Zen Kaku Gothic New', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', sans-serif;
  --onn-font-serif:   'Shippori Mincho', 'Hiragino Mincho ProN', serif;
  --onn-font-display: 'Cormorant Garamond', 'Times New Roman', serif;

  /* ─ 行間設計（モバイル基準値）★v3.0新設 ─ */
  --onn-lh-body:    1.9;
  --onn-lh-lead:    2.0;
  --onn-lh-h1:      1.25;
  --onn-lh-h2:      1.3;
  --onn-lh-h3:      1.4;
  --onn-lh-caption: 1.7;

  /* ─ 文字間隔（モバイル基準値）★v3.0新設 ─ */
  --onn-ls-body:    0.03em;
  --onn-ls-heading: -0.01em;
  --onn-ls-display: 0.05em;
  --onn-ls-caption: 0.02em;

  /* ─ スペーシング ─ */
  --onn-section-py:      clamp(3.5rem, 7vw, 7rem);
  --onn-container-max:   900px;
  --onn-container-wide:  1140px;
  --onn-radius:          14px;
  --onn-radius-sm:       8px;
  --onn-radius-lg:       22px;

  /* ─ 段落・見出し余白 ★v3.0新設 ─ */
  --onn-p-gap:       1.25em;
  --onn-heading-mb:  0.8em;
  --onn-list-gap:    0.5em;

  /* ─ トランジション ─ */
  --onn-transition:      0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --onn-transition-slow: 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);

  /* ─ シャドウ ─ */
  --onn-shadow-card: 0 16px 40px -20px rgba(0,0,0,0.65);
  --onn-shadow-glow: 0 0 30px rgba(201,168,76, 0.25);
}


/* ================================================================
   3. GLOBAL RESET — #onn-root スコープ ★v3.0: line-height カスタムプロパティ化
   ================================================================ */
#onn-root,
#onn-root *,
#onn-root *::before,
#onn-root *::after {
  box-sizing: border-box;
}

#onn-root h1,
#onn-root h2,
#onn-root h3,
#onn-root h4,
#onn-root h5,
#onn-root h6,
#onn-root p,
#onn-root ul,
#onn-root ol,
#onn-root li,
#onn-root figure,
#onn-root blockquote,
#onn-root dl,
#onn-root dd {
  margin: 0;
  padding: 0;
}

#onn-root ul,
#onn-root ol { list-style: none; }

#onn-root {
  background-color: var(--onn-bg);
  color: var(--onn-text);
  font-family: var(--onn-font-sans);
  font-weight: 400;
  font-size: clamp(0.9rem, 1.8vw, 1.05rem);
  line-height: var(--onn-lh-body, 1.9);
  letter-spacing: var(--onn-ls-body, 0.03em);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt" 1;
  overflow-x: clip;
  overflow-y: visible;
  position: relative;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
  overflow-wrap: break-word;
  word-break: normal;
  word-break: auto-phrase; /* 日本語自然改行 */
}

#onn-root img,
#onn-root svg { display: block; max-width: 100%; }

#onn-root a {
  color: var(--onn-gold);
  text-decoration: none;
  transition: color var(--onn-transition), opacity var(--onn-transition);
}
#onn-root a:hover { color: var(--onn-gold-bright); }

#onn-root strong { color: var(--onn-gold-light); font-weight: 700; }

#onn-root h1,
#onn-root h2,
#onn-root h3,
#onn-root h4 {
  font-family: var(--onn-font-serif);
  font-weight: 800;
  color: var(--onn-text);
  margin: 0;
}


/* ================================================================
   4. LAYOUT — コンテナ・セクション・ウェーブ
   ================================================================ */

/* コンテナ */
.onn-container {
  max-width: var(--onn-container-max);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.onn-container--wide {
  max-width: var(--onn-container-wide);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 3rem);
}

/* セクション共通 */
.onn-section {
  padding-block: var(--onn-section-py);
  position: relative;
  background-color: var(--onn-bg);
}

.onn-section--alt {
  background-color: var(--onn-bg-2);
}

.onn-section--dark {
  background: linear-gradient(180deg, var(--onn-bg-dark) 0%, #0b1a09 100%);
}

/* ウェーブ区切り */
.onn-wave {
  display: block;
  width: 100%;
  line-height: 0;
  background: transparent;
}
.onn-wave svg {
  width: 100%;
  height: clamp(48px, 6vw, 80px);
  display: block;
}

/* ウェーブの背景を前セクションに合わせる */
.onn-wave { background-color: var(--onn-bg-dark); } /* 暗い→軽い */
.onn-section + .onn-wave { background-color: var(--onn-bg); }
.onn-section--alt + .onn-wave { background-color: var(--onn-bg-2); }
.onn-section--dark + .onn-wave { background-color: var(--onn-bg-dark); }
.onn-wave--from-dark { background-color: var(--onn-bg-dark); }


/* ================================================================
   5. スクロールリビール ★必須
   ================================================================ */
.onn-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity  0.7s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.onn-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.onn-reveal[data-delay="1"] { transition-delay: 0.1s; }
.onn-reveal[data-delay="2"] { transition-delay: 0.2s; }
.onn-reveal[data-delay="3"] { transition-delay: 0.3s; }
.onn-reveal[data-delay="4"] { transition-delay: 0.4s; }


/* ================================================================
   6. テーブル・ブロッククォート 白抜き対策 ★v3.0 アクセシビリティ対応
   ================================================================ */

/* Cocoon注入の白背景blockquoteを安全なグレーに強制置換 */
#onn-root blockquote:not([class*="onn"]),
body.okane-no-nagare .entry-content blockquote {
  background-color: #F0F0F0 !important; /* Rule 4: #F5F5F5〜#E0E0E0 範囲内 ✓ */
  color:            #1A1A1A !important; /* Rule 2: ~14:1 ✓ */
  border-left:  4px solid #555555 !important;
  border-right: none !important;
  border-top:   none !important;
  border-bottom:none !important;
  padding: 1.25rem 1.5rem !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Cocoon注入のtable白背景を強制置換 */
#onn-root table:not([class*="onn"]) th,
body.okane-no-nagare .entry-content table th {
  background-color: #E8E8E8 !important;
  color:            #111111 !important;
  border-color:     #C0C0C0 !important;
}
#onn-root table:not([class*="onn"]) td,
body.okane-no-nagare .entry-content table td {
  background-color: #F5F5F5 !important;
  color:            #222222 !important;
  border-color:     #D0D0D0 !important;
}

/* code/preのCocoon干渉上書き */
#onn-root code:not([class]) {
  background-color: #EBEBEB !important;
  color:            #1E1E1E !important;
  padding: 0.15em 0.4em;
  border-radius: 4px;
  font-size: 0.875em;
}
#onn-root pre:not([class]) {
  background-color: #EBEBEB !important;
  color:            #1E1E1E !important;
  padding: 1rem 1.25rem;
  border-radius: 6px;
  overflow-x: auto;
  font-size: 0.875em;
}

/* LP専用 blockquote（ダーク配色） */
#onn-root .onn-blockquote {
  background-color: var(--onn-bg-card) !important; /* #1a2d18 — 白ではない ✓ */
  color:            var(--onn-text) !important;     /* #e8e2d0 — ~11:1 ✓ */
  border-left: 3px solid var(--onn-gold) !important;
  border-right: none !important;
  padding: 1.5rem 1.75rem !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: var(--onn-radius-sm) !important;
}
#onn-root .onn-blockquote::before,
#onn-root .onn-blockquote::after { display: none !important; }

/* LP専用テーブル（ダーク配色） */
.onn-table-wrap {
  overflow-x: auto;
  margin-block: 2rem;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--onn-container-wide);
  border-radius: var(--onn-radius);
  border: 1px solid var(--onn-border);
  background-color: var(--onn-bg-card); /* 白(#FFF)禁止 ✓ */
}

.onn-table {
  width: 100%;
  border-collapse: collapse;
  font-size: clamp(0.82rem, 1.6vw, 0.94rem);
  background: transparent !important;
  min-width: 520px;
}

/* Cocoonの `tr`（行）に対する偶数行白背景を強制無効化 */
#onn-root .onn-table tr,
#onn-root .onn-table tr:nth-child(n),
#onn-root .onn-table tr:nth-of-type(n),
#onn-root .onn-table tbody tr {
  background: transparent !important;
  background-color: transparent !important;
}

/* テーブルヘッダー: ダーク背景を維持 */
#onn-root .onn-table thead th {
  background: var(--onn-bg-card-2) !important;
  color: var(--onn-gold-light) !important;
  font-family: var(--onn-font-serif);
  font-weight: 800;
  text-align: left;
  padding: 1rem 1.25rem;
  letter-spacing: 0.06em;
  border-bottom: 1px solid var(--onn-border);
  white-space: nowrap;
  line-height: var(--onn-lh-body);
}

/* テーブルセル（通常時） */
#onn-root .onn-table tbody td {
  background: transparent !important;
  background-color: transparent !important;
  padding: 0.875rem 1.25rem;
  border-bottom: 1px solid rgba(201,168,76, 0.08);
  color: var(--onn-text-2);
  vertical-align: top;
  line-height: var(--onn-lh-body);
}
#onn-root .onn-table tbody tr:last-child td { border-bottom: none; }

/* テーブルセル（偶数行: 薄いゼブラ） */
#onn-root .onn-table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,0.025) !important;
  background-color: rgba(255,255,255,0.025) !important;
}

/* テーブルセル（ホバー） */
#onn-root .onn-table tbody tr:hover td {
  background: rgba(201,168,76,0.06) !important;
  background-color: rgba(201,168,76,0.06) !important;
}

/* 所得区分名カラム */
.onn-col-name {
  color: var(--onn-text) !important;
  font-weight: 700;
  font-family: var(--onn-font-serif);
  white-space: nowrap;
}
/* 以降の .onn-table--comparison などの記述はそのまま残してください */

/* 比較表の行名 — カラードット付き */
.onn-table--comparison .onn-col-name {
  position: relative;
  padding-left: 2rem !important;
}
.onn-table--comparison .onn-col-name::before {
  content: '';
  position: absolute;
  left: 0.875rem;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--dot-color, var(--onn-gold));
  transform: translateY(-50%);
}
.onn-table--comparison th,
.onn-table--comparison td { white-space: nowrap; }
.onn-table--comparison th:nth-child(4),
.onn-table--comparison td:nth-child(4),
.onn-table--comparison th:nth-child(6),
.onn-table--comparison td:nth-child(6) {
  white-space: normal;
  min-width: 160px;
}

/* スクロールヒント */
.onn-scroll-hint {
  display: none;
  font-size: 0.78rem;
  color: var(--onn-text-3);
  margin: 0.625rem 0 0;
  letter-spacing: var(--onn-ls-caption);
}


/* ================================================================
   7. アクセシビリティ配色仕様 ★v3.0新設・必須
      全配色コントラスト比 4.5:1 以上保証
   ================================================================ */
/*
 * ダークテーマのため、以下のすべての組み合わせが自動でクリア:
 *   bg-card(#1a2d18) × text(#e8e2d0): ~11:1 ✅ AAA
 *   bg-card(#1a2d18) × text-2(#c4bc9e): ~7:1 ✅ AA
 *   bg-card(#1a2d18) × gold(#c9a84c): ~5:1 ✅ AA
 *   bg(#0b1a09) × text(#e8e2d0): ~13:1 ✅ AAA
 *
 * Cocoon干渉による白背景上書きは Section 6 で安全配色に強制置換済み。
 */


/* ================================================================
   8. テキストブロック中央配置仕様 ★v3.0新設・必須（二層構造）
   ================================================================ */

/* Layer 1 = text-align: center
   Layer 2 = margin: auto + max-width（必ずセット） */

.onn-text-center { text-align: center !important; }

.onn-block-center {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: var(--onn-container-max);
}

.onn-center {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: var(--onn-container-max);
}

/* セクションヘッダー（最多用）— 二層中央配置 */
.onn-section-header {
  text-align:   center;
  margin-left:  auto;
  margin-right: auto;
  max-width: min(680px, 90%);
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

/* section eyebrow ラベル */
.onn-section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-align:   center;
  margin-left:  auto;
  margin-right: auto;
  width: fit-content;
  font-family: var(--onn-font-display);
  font-size: clamp(0.7rem, 1.4vw, 0.8rem);
  letter-spacing: var(--onn-ls-display, 0.05em);
  color: var(--onn-gold-light);
  text-transform: uppercase;
  margin-bottom: 1.1rem;
}

.onn-eyebrow-num {
  font-family: var(--onn-font-display);
  font-size: 0.85em;
  color: var(--onn-gold);
  letter-spacing: 0.08em;
}

/* CTA ボタンラップ — 二層中央配置（Layer 1 + Layer 2） */
.onn-cta-btn-wrap {
  text-align:   center !important;     /* Layer 1: テキスト・インライン */
  margin-left:  auto !important;       /* Layer 2: ブロック自体 */
  margin-right: auto !important;
  max-width:    fit-content;
}

/* blockquote 二層中央配置 */
#onn-root .onn-blockquote {
  text-align: left !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: min(720px, 100%) !important;
}

/* テーブルラップ 二層中央配置 */
.onn-table-wrap {
  margin-left:  auto;
  margin-right: auto;
  max-width: var(--onn-container-wide);
}

/* div/section要素のインラインtext-align:center干渉防止 */
#onn-root [class*="onn-"][style*="text-align: center"],
#onn-root [class*="onn-"][style*="text-align:center"] {
  margin-left:  auto !important;
  margin-right: auto !important;
}


/* ================================================================
   9. 行間設計・デバイス別最適化仕様 ★v3.0新設・必須
   ================================================================ */

/* ── 9.1 モバイル基準値（〜767px） ── */

#onn-root p,
#onn-root li {
  line-height:    var(--onn-lh-body, 1.9);
  letter-spacing: var(--onn-ls-body, 0.03em);
  overflow-wrap:  break-word;
  word-break:     auto-phrase;
}

#onn-root .onn-cover__lead p,
#onn-root .onn-section-desc,
#onn-root .onn-lead {
  line-height:    var(--onn-lh-lead, 2.0);
  letter-spacing: 0.04em;
  overflow-wrap:  break-word;
}

#onn-root h1,
#onn-root .onn-cover__title {
  line-height:    var(--onn-lh-h1, 1.25);
  letter-spacing: var(--onn-ls-heading, -0.01em);
  overflow-wrap:  break-word;
  word-break:     auto-phrase;
}

#onn-root h2,
#onn-root .onn-section-title {
  line-height:    var(--onn-lh-h2, 1.3);
  letter-spacing: var(--onn-ls-heading, -0.01em);
  overflow-wrap:  break-word;
  word-break:     auto-phrase;
}

#onn-root h3 {
  line-height:    var(--onn-lh-h3, 1.4);
  letter-spacing: -0.005em;
  overflow-wrap:  break-word;
}

#onn-root h4, #onn-root h5, #onn-root h6 {
  line-height:    1.45;
  letter-spacing: -0.005em;
}

#onn-root small,
#onn-root .onn-caption,
#onn-root .onn-note,
#onn-root .onn-cta-btn__sub {
  line-height:    var(--onn-lh-caption, 1.7);
  letter-spacing: var(--onn-ls-caption, 0.02em);
}

#onn-root .onn-section-eyebrow,
#onn-root .onn-cover__eyebrow {
  letter-spacing: var(--onn-ls-display, 0.05em);
  line-height: 1.4;
}

/* ── 9.2 段落間・見出し後スペーシング ── */

#onn-root p + p { margin-top: var(--onn-p-gap, 1.25em); }
#onn-root h2 + p,
#onn-root h2 + .onn-section-desc,
#onn-root h3 + p { margin-top: 0.75em; }
#onn-root p + ul, #onn-root p + ol { margin-top: 0.75em; }
#onn-root li + li { margin-top: var(--onn-list-gap, 0.5em); }
#onn-root h2:not(:first-child),
#onn-root h3:not(:first-child) { margin-top: 2em; }
#onn-root h2,
#onn-root h3 { margin-bottom: var(--onn-heading-mb, 0.8em); }


/* ================================================================
   10. COVER — ファーストビュー
   ================================================================ */
.onn-cover {
  position: relative;
  background:
    radial-gradient(ellipse at 85% -5%, rgba(201,168,76,0.28), transparent 52%),
    radial-gradient(ellipse at 15% 105%, rgba(122,158,82,0.18), transparent 48%),
    radial-gradient(ellipse at 50% 50%, rgba(18,32,18,0.4), transparent 70%),
    linear-gradient(170deg, #060f05 0%, #0b1a09 40%, #0f2011 70%, #122012 100%);
  padding-block: clamp(5rem, 12vw, 10rem);
  padding-top: calc(clamp(5rem, 12vw, 10rem) + 70px); /* tph-header-h分を加算 */
  overflow: hidden;
}

/* 川のSVGライン */
.onn-cover__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.onn-cover__rivers {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
}
.onn-cover__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 60%, var(--onn-bg) 100%);
}

/* Cover コンテンツ */
.onn-cover__content {
  position: relative;
  z-index: 2;
  text-align:  center;   /* Layer 1 */
  margin-left:  auto;    /* Layer 2 */
  margin-right: auto;    /* Layer 2 */
  /* max-width はコンテナクラスが担う */
}

/* Eyebrow */
.onn-cover__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-family: var(--onn-font-display);
  font-size: clamp(0.7rem, 1.5vw, 0.85rem);
  letter-spacing: 0.32em;
  color: var(--onn-gold-light);
  text-transform: uppercase;
  margin-bottom: 2rem;
  line-height: 1.4;
}
.onn-cover__eyebrow-line {
  display: block;
  width: 36px;
  height: 1px;
  background: var(--onn-gold);
  flex-shrink: 0;
}

/* H1 */
.onn-cover__title {
  font-family: var(--onn-font-serif);
  font-size: clamp(2.4rem, 5.5vw, 4.2rem);
  font-weight: 800;
  color: var(--onn-text);
  /* ★問題① 修正: Cocoon 上書きを !important で確実に排除 */
  margin-top:    0 !important;
  margin-bottom: clamp(2.5rem, 4.5vw, 3.5rem) !important;
  text-shadow: 0 2px 20px rgba(0,0,0,0.5);
}
 
/* Lead */
.onn-cover__lead {
  max-width: 660px;
  margin-inline: auto;
  /* ★問題① 修正: タイトルとリード間の余白を明示的に付与 */
  margin-top:    clamp(1.75rem, 3.5vw, 2.75rem) !important;
  margin-bottom: 2.5rem;
  color: var(--onn-text-2);
  font-size: clamp(0.92rem, 1.9vw, 1.04rem);
  text-align: left;
}

.onn-cover__lead p { margin-bottom: 1.2em; }
.onn-cover__lead p:last-child { margin-bottom: 0; }
.onn-cover__lead strong { color: var(--onn-text); }

/* Section map chips */
.onn-cover__map {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-bottom: 3rem;
}
.onn-cover__map a {
  font-size: clamp(0.75rem, 1.5vw, 0.82rem);
  padding: 8px 18px;
  border: 1px solid rgba(201,168,76,0.35);
  border-radius: 999px;
  color: var(--onn-gold-light);
  letter-spacing: 0.02em;
  transition: background var(--onn-transition), border-color var(--onn-transition), color var(--onn-transition);
}
.onn-cover__map a:hover {
  background: rgba(201,168,76,0.12);
  border-color: var(--onn-gold);
  color: var(--onn-text);
}


/* ================================================================
   11. CTA ボタン
   ================================================================ */
.onn-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.9rem, 2.5vw, 1.15rem) clamp(2rem, 5vw, 3.5rem);
  border-radius: 999px;
  font-family: var(--onn-font-sans);
  font-weight: 700;
  font-size: clamp(0.92rem, 1.9vw, 1.08rem);
  color: #fff !important;
  text-decoration: none !important;
  letter-spacing: 0.06em;
  position: relative;
  overflow: hidden;
  transition:
    transform    var(--onn-transition),
    box-shadow   var(--onn-transition),
    filter       var(--onn-transition);
  box-shadow: 0 8px 30px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.08);
  cursor: pointer;
}
.onn-cta-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, transparent 60%);
  pointer-events: none;
}
.onn-cta-btn:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,0.55), 0 0 24px rgba(201,168,76,0.3);
  filter: brightness(1.1);
  color: #fff !important;
}
.onn-cta-btn:active { transform: scale(0.975); }

.onn-cta-btn__sub {
  margin-top: 0.875rem;
  font-size: clamp(0.74rem, 1.4vw, 0.82rem);
  color: var(--onn-text-3);
  letter-spacing: var(--onn-ls-caption);
  line-height: var(--onn-lh-caption);
  text-align: center !important;
}


/* ================================================================
   12. SECTION 01 — 本質: 二軸ベン図 (Essence)
   ================================================================ */
.onn-axis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
  margin-top: 3rem;
}

.onn-axis__diagram {
  background: var(--onn-bg-card);   /* 白(#FFF)禁止 ✓ */
  border: 1px solid var(--onn-border);
  border-radius: var(--onn-radius-lg);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  box-shadow: var(--onn-shadow-card);
}

.onn-axis__notes {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.onn-axis__note {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}
.onn-axis__note-num {
  font-family: var(--onn-font-display);
  font-size: clamp(1.4rem, 2.8vw, 1.8rem);
  color: var(--onn-gold);
  line-height: 1.2;
  flex-shrink: 0;
  min-width: 2.2rem;
}
.onn-axis__note h4 {
  font-family: var(--onn-font-serif);
  font-size: clamp(0.95rem, 1.9vw, 1.05rem);
  color: var(--onn-text);
  margin-bottom: 0.4em;
}
.onn-axis__note p {
  color: var(--onn-text-2);
  font-size: clamp(0.85rem, 1.7vw, 0.94rem);
  margin: 0;
}

.onn-essence-note {
  margin-top: 3rem;
  padding: 1.75rem 2rem;
  background: var(--onn-bg-card);   /* 白禁止 ✓ */
  border: 1px solid var(--onn-border-soft);
  border-left: 3px solid var(--onn-gold);
  border-radius: var(--onn-radius-sm);
}
.onn-essence-note p {
  color: var(--onn-text-2);
  font-size: clamp(0.88rem, 1.8vw, 0.98rem);
  margin: 0;
}
.onn-essence-note p + p { margin-top: 1em; }
.onn-essence-note strong { color: var(--onn-text); }


/* ================================================================
   13. SECTION 02 — 戦略グループ・カード
   ================================================================ */

/* グループブロック */
.onn-group {
  margin-top: clamp(2.5rem, 5vw, 4rem);
}
.onn-group:first-of-type { margin-top: 0; }

.onn-group__header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(201,168,76,0.15);
}
.onn-group__dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--grp-color, var(--onn-gold));
  flex-shrink: 0;
  box-shadow: 0 0 8px var(--grp-color, var(--onn-gold));
  position: relative;
  top: -0.1em;
}
.onn-group__name {
  font-family: var(--onn-font-serif);
  font-size: clamp(1.15rem, 2.3vw, 1.4rem);
  color: var(--onn-text);
  margin: 0;
}
.onn-group__en {
  font-family: var(--onn-font-display);
  font-weight: 400;
  font-size: clamp(0.68rem, 1.3vw, 0.78rem);
  letter-spacing: 0.2em;
  color: var(--onn-text-3);
  text-transform: uppercase;
  margin-left: 0.75rem;
}
.onn-group__desc {
  color: var(--onn-text-3);
  font-size: clamp(0.84rem, 1.6vw, 0.92rem);
  margin: 0;
  flex-basis: 100%;
  letter-spacing: 0.02em;
}

/* ストラテジーカードグリッド */
.onn-strategy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  margin-top: 1.25rem;
}

/* カード */
.onn-strategy-card {
  background: var(--onn-bg-card);   /* 白禁止 ✓ */
  border: 1px solid var(--onn-border-soft);
  border-top: 4px solid var(--card-accent, var(--onn-gold));
  border-radius: var(--onn-radius);
  padding: clamp(1.25rem, 2.5vw, 1.75rem);
  box-shadow: var(--onn-shadow-card);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: transform var(--onn-transition), box-shadow var(--onn-transition);
}
.onn-strategy-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 50px -18px rgba(0,0,0,0.7), 0 0 0 1px var(--card-accent, var(--onn-gold));
}

.onn-strategy-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
.onn-strategy-card__num {
  font-family: var(--onn-font-display);
  font-weight: 400;
  font-size: clamp(1.5rem, 3vw, 1.9rem);
  color: var(--onn-gold);
  letter-spacing: 0.05em;
  line-height: 1;
}
.onn-strategy-card__titles {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.2em;
}
.onn-strategy-card__title {
  font-family: var(--onn-font-serif);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 800;
  color: var(--onn-text);
  line-height: 1.2;
}
.onn-strategy-card__sub {
  font-family: var(--onn-font-display);
  font-size: clamp(0.68rem, 1.3vw, 0.76rem);
  letter-spacing: 0.15em;
  color: var(--onn-text-3);
  text-transform: uppercase;
}
.onn-strategy-card__essence {
  font-size: clamp(0.9rem, 1.8vw, 1.0rem);
  color: var(--onn-text);
  font-weight: 700;
  font-family: var(--onn-font-serif);
  padding-left: 1rem;
  border-left: 3px solid var(--card-accent, var(--onn-gold));
  line-height: 1.7;
}
.onn-strategy-card__body {
  font-size: clamp(0.86rem, 1.7vw, 0.95rem);
  color: var(--onn-text-2);
  margin: 0;
  flex: 1;
}

/* タグ（小ラベル） */
.onn-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.onn-tag {
  display: inline-block;
  font-size: clamp(0.72rem, 1.3vw, 0.78rem);
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(201,168,76,0.1);   /* 白禁止 ✓ */
  color: var(--onn-gold-light);
  border: 1px solid rgba(201,168,76,0.25);
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* フィーチャーライン */
.onn-strategy-card__feature {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px dashed rgba(201,168,76,0.18);
  font-size: clamp(0.8rem, 1.5vw, 0.87rem);
  color: var(--onn-text-3);
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  line-height: var(--onn-lh-caption);
  letter-spacing: var(--onn-ls-caption);
}

/* 水滴インライン装飾 */
.onn-drop {
  display: inline-block;
  width: 7px;
  height: 9px;
  background: var(--onn-gold);
  border-radius: 50% 50% 50% 0;
  transform: rotate(45deg) translateY(-1px);
  flex-shrink: 0;
  margin-top: 0.25em;
}


/* ================================================================
   14. SECTION 04 — 複合型カード (Composite)
   ================================================================ */
.onn-composite-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 2.5rem;
}

.onn-composite-card {
  background: var(--onn-bg-card);   /* 白禁止 ✓ */
  border: 1px solid var(--onn-border-soft);
  border-radius: var(--onn-radius);
  padding: clamp(1.25rem, 2.5vw, 1.75rem) clamp(1.25rem, 2.5vw, 2rem);
  box-shadow: var(--onn-shadow-card);
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 1.5rem;
  align-items: start;
  transition: border-color var(--onn-transition), box-shadow var(--onn-transition);
}
.onn-composite-card:hover {
  border-color: var(--onn-border);
  box-shadow: 0 20px 48px -16px rgba(0,0,0,0.65);
}
.onn-composite-card--featured {
  border-color: rgba(201,168,76,0.35);
  background: var(--onn-bg-card-2);
  box-shadow: var(--onn-shadow-card), 0 0 0 1px rgba(201,168,76,0.18);
}

.onn-composite-card__left {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}
.onn-composite-card__name {
  font-family: var(--onn-font-serif);
  font-size: clamp(1.0rem, 2vw, 1.2rem);
  color: var(--onn-text);
  margin: 0;
  line-height: 1.4;
}
.onn-composite-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.onn-badge {
  display: inline-block;
  font-size: clamp(0.7rem, 1.2vw, 0.76rem);
  font-weight: 700;
  padding: 3px 11px;
  border-radius: 999px;
  color: #fff;
  letter-spacing: 0.04em;
}
.onn-composite-card__body {
  color: var(--onn-text-2);
  font-size: clamp(0.86rem, 1.7vw, 0.94rem);
  margin: 0;
  line-height: var(--onn-lh-body);
}


/* ================================================================
   15. SECTION 05 — 全体像フロー (Overview)
   ================================================================ */
.onn-flow {
  display: flex;
  flex-direction: column;
  margin-top: 2.5rem;
}

.onn-flow__row {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 1.5rem;
}

.onn-flow__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 2px;
}

.onn-flow__dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--onn-gold);
  border: 3px solid #060f05;
  flex-shrink: 0;
  z-index: 2;
}

.onn-flow__line {
  flex: 1;
  width: 3px;
  background: linear-gradient(180deg, var(--onn-gold) 0%, var(--onn-moss) 50%, rgba(58,90,48,0.4) 100%);
  opacity: 0.5;
  min-height: 52px;
  margin-top: 4px;
}
.onn-flow__line--last { display: none; }

.onn-flow__content {
  padding-bottom: clamp(2rem, 4vw, 3.5rem);
}

.onn-flow__stage {
  font-family: var(--onn-font-display);
  font-size: clamp(0.68rem, 1.3vw, 0.76rem);
  letter-spacing: 0.24em;
  color: var(--onn-gold-light);
  text-transform: uppercase;
  margin-bottom: 0.35rem;
  margin-top: 0;
  line-height: 1.4;
}

.onn-flow__title {
  font-family: var(--onn-font-serif);
  font-size: clamp(1.15rem, 2.3vw, 1.4rem);
  color: var(--onn-text);
  margin-bottom: 0.75rem;
  margin-top: 0;
}

.onn-flow-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 0.625rem;
}
.onn-flow-tag {
  display: inline-block;
  font-size: clamp(0.74rem, 1.4vw, 0.8rem);
  padding: 4px 14px;
  border-radius: 999px;
  background: rgba(201,168,76,0.1);   /* 白禁止 ✓ */
  border: 1px solid rgba(201,168,76,0.3);
  color: var(--onn-gold-light);
  letter-spacing: 0.02em;
}

.onn-flow__note {
  font-size: clamp(0.84rem, 1.6vw, 0.92rem);
  color: var(--onn-text-3);
  margin: 0;
  letter-spacing: var(--onn-ls-caption);
}

/* 合成メッセージボックス */
.onn-synthesis {
  margin-top: 3rem;
  padding: clamp(1.75rem, 4vw, 2.5rem) clamp(1.5rem, 4vw, 3rem);
  background: rgba(201,168,76,0.07);   /* 白禁止 ✓ */
  border: 1px solid rgba(201,168,76,0.22);
  border-radius: var(--onn-radius-lg);
  text-align:   center;   /* Layer 1 */
  margin-left:  auto;     /* Layer 2 */
  margin-right: auto;
  max-width: min(700px, 100%);
}
.onn-synthesis p {
  font-size: clamp(1.0rem, 2vw, 1.15rem);
  color: var(--onn-text);
  margin: 0;
  line-height: 2.0;
}
.onn-synthesis p + p { margin-top: 0.6em; }
.onn-synthesis__em {
  color: var(--onn-gold-bright);
  font-weight: 700;
}


/* ================================================================
   16. SECTION 07 — 理論的背景アコーディオン (Evidence)
   ================================================================ */
.onn-evidence-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 2.5rem;
}

.onn-evidence-group {
  background: var(--onn-bg-card);   /* 白禁止 ✓ */
  border: 1px solid var(--onn-border-soft);
  border-left: 5px solid var(--ev-color, var(--onn-gold));
  border-radius: var(--onn-radius);
  overflow: hidden;
  box-shadow: var(--onn-shadow-card);
  transition: border-color var(--onn-transition);
}
.onn-evidence-group[open] {
  border-color: var(--onn-border);
}

.onn-evidence-group summary {
  cursor: pointer;
  list-style: none;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  transition: background var(--onn-transition);
  user-select: none;
}
.onn-evidence-group summary::-webkit-details-marker { display: none; }
.onn-evidence-group summary:hover { background: rgba(201,168,76,0.05); }

.onn-evidence-title {
  font-family: var(--onn-font-serif);
  font-weight: 800;
  font-size: clamp(0.95rem, 1.9vw, 1.08rem);
  color: var(--onn-text);
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  flex: 1;
  line-height: var(--onn-lh-h3);
}
.onn-evidence-sub {
  font-family: var(--onn-font-sans);
  font-weight: 400;
  font-size: clamp(0.72rem, 1.3vw, 0.78rem);
  color: var(--onn-text-3);
  letter-spacing: 0.1em;
}

.onn-evidence-toggle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--onn-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  color: var(--onn-gold);
  flex-shrink: 0;
  transition: transform var(--onn-transition), border-color var(--onn-transition);
  line-height: 1;
}
.onn-evidence-group[open] .onn-evidence-toggle {
  transform: rotate(45deg);
  border-color: var(--onn-gold);
}

.onn-evidence-body {
  padding: 0.25rem 1.5rem 1.5rem;
  border-top: 1px solid var(--onn-border-soft);
  display: flex;
  flex-direction: column;
  gap: 0;
}

.onn-evidence-item {
  display: grid;
  grid-template-columns: 175px 1fr;
  gap: 1.25rem;
  padding-block: 1.25rem;
  border-bottom: 1px solid rgba(201,168,76,0.07);
}
.onn-evidence-item:last-child { border-bottom: none; }

.onn-ev-year {
  display: block;
  font-family: var(--onn-font-display);
  font-size: clamp(1.0rem, 2vw, 1.1rem);
  color: var(--onn-gold);
  line-height: 1.3;
  letter-spacing: 0.04em;
}
.onn-ev-source {
  display: block;
  font-size: clamp(0.74rem, 1.4vw, 0.8rem);
  color: var(--onn-text-3);
  margin-top: 0.2em;
  letter-spacing: 0.01em;
  line-height: 1.6;
}
.onn-evidence-item p {
  font-size: clamp(0.86rem, 1.7vw, 0.94rem);
  color: var(--onn-text-2);
  margin: 0;
  line-height: var(--onn-lh-body);
}
.onn-evidence-item em { color: var(--onn-text); font-style: italic; }

/* 理論的背景まとめblockquote */
#onn-root .onn-blockquote {
  margin-top: 3.5rem !important; /* 🌟 !important を追加して強制力を上げる */
}
#onn-root .onn-blockquote p {
  font-size: clamp(0.88rem, 1.75vw, 0.98rem);
  color: var(--onn-text-2) !important;
  margin-bottom: 1em;
}
#onn-root .onn-blockquote p:last-child { margin-bottom: 0; }
#onn-root .onn-blockquote strong { color: var(--onn-text) !important; }


/* ================================================================
   17. FINAL CTA SECTION
   ================================================================ */
.onn-section--cta {
  background: linear-gradient(180deg, #060f05 0%, #0a1808 60%, #0b1a09 100%) !important;
  padding-block: clamp(4.5rem, 10vw, 8rem);
}

.onn-section-eyebrow--cta {
  font-family: var(--onn-font-display) !important;
  font-size: clamp(0.7rem, 1.4vw, 0.82rem) !important;
  letter-spacing: 0.38em !important;
  color: var(--onn-gold) !important;
}

.onn-section-title--cta {
  font-size: clamp(1.8rem, 4vw, 2.8rem) !important;
  color: var(--onn-text) !important;
}

.onn-section-desc--cta {
  font-size: clamp(0.9rem, 1.8vw, 1.05rem) !important;
  color: var(--onn-text-2) !important;
  line-height: 2.0 !important;
}

.onn-disclaimer {
  margin-top: 3rem;
  font-size: clamp(0.74rem, 1.4vw, 0.8rem);
  color: var(--onn-text-3);
  line-height: var(--onn-lh-caption);
  letter-spacing: var(--onn-ls-caption);
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* 改行制御 */
.onn-br-pc { display: block; }


/* ================================================================
   18. 共通装飾・ユーティリティ
   ================================================================ */

/* セクションタイトル */
.onn-section-title {
  font-family: var(--onn-font-serif);
  font-size: clamp(1.7rem, 3.5vw, 2.5rem);
  font-weight: 800;
  color: var(--onn-text);
  margin-bottom: 1rem;
  margin-top: 0;
}

/* セクション説明文 */
.onn-section-desc {
  font-size: clamp(0.9rem, 1.8vw, 1.02rem);
  color: var(--onn-text-2);
  margin: 0;
}
.onn-section-desc strong { color: var(--onn-text); }

/* Tax section note */
.onn-scroll-hint {
  font-size: 0.78rem;
  color: var(--onn-text-3);
  margin: 0.5rem 0 0;
  letter-spacing: var(--onn-ls-caption);
  text-align: left;
}


/* ================================================================
   19. RESPONSIVE — タブレット（768px〜）★v3.0 行間最適化
   ================================================================ */
@media (min-width: 768px) {

  /* ── 行間デバイス別更新 ── */
  #onn-root {
    --onn-lh-body:    1.88;
    --onn-lh-lead:    1.95;
    --onn-lh-h1:      1.2;
    --onn-lh-h2:      1.28;
    --onn-lh-h3:      1.35;
    --onn-ls-body:    0.025em;
    --onn-p-gap:      1.3em;
  }

  /* 行長最適化 */
  #onn-root p { max-width: 48em; }
  #onn-root .onn-container p,
  #onn-root .onn-section-header p { max-width: 100%; }

  /* 軸図: タブレットから2カラム */
  .onn-axis {
    grid-template-columns: 1fr 1fr;
  }

  /* 複合カード: タブレットから2カラム */
  .onn-composite-card {
    grid-template-columns: 200px 1fr;
  }

  /* スクロールヒント表示 */
  .onn-scroll-hint { display: block; }

  /* 証拠アイテム: タブレットから2カラム */
  .onn-evidence-item {
    grid-template-columns: 165px 1fr;
  }

  /* フロー: レール幅拡張 */
  .onn-flow__row {
    grid-template-columns: 64px 1fr;
    gap: 2rem;
  }

  /* Cover: リードをやや広く */
  .onn-cover__lead {
    max-width: 720px;
  }

  /* BR制御 */
  .onn-br-pc { display: block; }
}


/* ================================================================
   20. RESPONSIVE — デスクトップ（1024px〜）★v3.0 行間最適化
   ================================================================ */
@media (min-width: 1024px) {

  /* ── 行間デバイス別更新 ── */
  #onn-root {
    --onn-lh-body:    1.85;
    --onn-lh-lead:    1.9;
    --onn-lh-h1:      1.15;
    --onn-lh-h2:      1.2;
    --onn-lh-h3:      1.3;
    --onn-lh-caption: 1.65;
    --onn-ls-body:    0.02em;
    --onn-ls-heading: -0.02em;
    --onn-p-gap:      1.35em;
    --onn-heading-mb: 0.85em;
  }

  #onn-root h1,
  #onn-root .onn-cover__title {
    letter-spacing: -0.025em;
  }

  /* 複合カード: デスクトップで広い左カラム */
  .onn-composite-card {
    grid-template-columns: 250px 1fr;
  }

  /* ストラテジーグリッド: 最小幅を広げる */
  .onn-strategy-grid {
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  }

  /* Axis: より広いダイアグラム */
  .onn-axis {
    grid-template-columns: 1.15fr 1fr;
    gap: 4rem;
  }

  /* カバーリード: テキスト左寄せに（中幅画面以降） */
  .onn-cover__lead { text-align: left; }

  /* フロー: 大きなレール */
  .onn-flow__row {
    grid-template-columns: 72px 1fr;
  }
  .onn-flow__dot { width: 22px; height: 22px; }
  .onn-flow__line { width: 3px; }
}


/* ================================================================
   21. RESPONSIVE — ワイドデスクトップ（1280px〜）
   ================================================================ */
@media (min-width: 1280px) {
  #onn-root {
    --onn-lh-body: 1.85;
  }

  /* 3カラムグリッド（防御・資本など1枚カードを均等配置） */
  .onn-strategy-grid {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  }
}


/* ================================================================
   22. RESPONSIVE — モバイル（〜767px）個別調整
   ================================================================ */
@media (max-width: 767px) {

  /* 軸図: 1カラム積み重ね */
  .onn-axis {
    grid-template-columns: 1fr;
  }

  /* 複合カード: 1カラム */
  .onn-composite-card {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  /* 証拠アイテム: 1カラム */
  .onn-evidence-item {
    grid-template-columns: 1fr;
    gap: 0.375rem;
  }
  .onn-ev-year { font-size: 1.0rem; }

  /* フロー: 細いレール */
  .onn-flow__row {
    grid-template-columns: 44px 1fr;
    gap: 1rem;
  }

  /* スクロールヒント表示 */
  .onn-scroll-hint { display: block; }

  /* coverのmap: 小さめフォント */
  .onn-cover__map a { font-size: 0.72rem; padding: 7px 14px; }

  /* 改行制御 */
  .onn-br-pc { display: none; }

  /* 合成ボックス: フルパディング調整 */
  .onn-synthesis {
    padding: 1.5rem 1.25rem;
  }

  /* CTA btn: フル幅 */
  .onn-cta-btn {
    width: 100%;
    max-width: 340px;
  }
}


/* ================================================================
   23. アクセシビリティ: prefers-reduced-motion
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
  .onn-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  #onn-root * {
    transition-duration: 0.01ms !important;
    animation-duration:  0.01ms !important;
  }
}

/* ================================================================
   IMAGE STYLES — 画像6点 設置スタイル
   (okane-no-nagare.css 末尾に追記)
   ================================================================ */
 
 
/* ── 画像①: カバー背景レイヤー ── */
 
.onn-cover__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 45%;
  opacity: 0.22;
  z-index: 0;
  pointer-events: none;
  /* グレースケール寄りに落として文字とゴールドSVGを際立たせる */
  filter: brightness(0.7) saturate(0.65) contrast(0.9);
  transition: opacity 1.2s ease;
}
 
/* SVGリバーとオーバーレイを画像より前面へ */
.onn-cover__rivers {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
 
.onn-cover__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(
    to bottom,
    rgba(6,15,5,0.62)   0%,
    rgba(11,26,9,0.70)  40%,
    rgba(11,26,9,0.88)  75%,
    #0b1a09             100%
  );
}
 
/* カバーコンテンツを最前面へ */
.onn-cover__content {
  position: relative;
  z-index: 3;
}
 
/* フェードイン: 画像ロード後に滑らかに表示 */
.onn-cover__bg-img[src] {
  animation: onn-bg-fadein 1.4s ease forwards;
}
@keyframes onn-bg-fadein {
  from { opacity: 0; }
  to   { opacity: 0.22; }
}
 
 
/* ── 画像②: Section 01 本質 アクセント写真 ── */
 
.onn-photo-accent {
  /* display:block + margin auto で確実中央配置 */
  display:       block !important;
  margin-top:    clamp(2.5rem, 4vw, 3.5rem) !important;
  margin-left:   auto !important;
  margin-right:  auto !important;
  /* margin-inline は Safari 古バージョン非対応のため個別指定へ変更 */
  max-width:     min(780px, 100%);
  width:         100%;
  border-radius: var(--onn-radius-lg);
  overflow:      hidden;
  position:      relative;
  box-shadow:
    var(--onn-shadow-card),
    0 0 0 1px var(--onn-border);
}
 
.onn-photo-accent img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center center;
  display: block;
  filter: brightness(0.82) saturate(0.9);
  transition: transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              filter    0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
 
.onn-photo-accent:hover img {
  transform: scale(1.035);
  filter: brightness(0.9) saturate(1.0);
}
 
/* figcaption: 下部グラデーション重ね */
.onn-photo-accent figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.75rem 1.75rem 1.25rem;
  background: linear-gradient(to top, rgba(6,15,5,0.9) 0%, transparent 100%);
  color: var(--onn-text-2);
  font-family: var(--onn-font-serif);
  font-size: clamp(0.82rem, 1.6vw, 0.92rem);
  letter-spacing: 0.05em;
  text-align: center;
  line-height: 1.7;
}
 
 
/* ── 画像③: Section 02 戦略 フィーチャー写真 ── */
 
.onn-strategy-photo {
  margin-top: 2.5rem;
  margin-bottom: 3rem;
  border-radius: var(--onn-radius-lg);
  overflow: hidden;
  position: relative;
  max-width: 100%;
  box-shadow:
    0 24px 60px -20px rgba(0,0,0,0.75),
    0 0 0 1px rgba(201,168,76,0.15);
}
 
.onn-strategy-photo img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 35%;
  display: block;
  filter: brightness(0.65) saturate(0.8) contrast(1.05);
  transition: transform 1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              filter    1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
 
.onn-strategy-photo:hover img {
  transform: scale(1.025);
  filter: brightness(0.75) saturate(0.9);
}
 
/* 四周グラデーションオーバーレイ */
.onn-strategy-photo__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right,  rgba(6,15,5,0.55) 0%, transparent 35%, transparent 65%, rgba(6,15,5,0.55) 100%),
    linear-gradient(to bottom, rgba(6,15,5,0.35) 0%, transparent 30%, transparent 65%, rgba(18,32,18,0.82) 100%);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 2rem;
  pointer-events: none;
}
 
.onn-strategy-photo__label {
  font-family: var(--onn-font-display);
  font-size: clamp(0.78rem, 1.5vw, 0.92rem);
  letter-spacing: 0.32em;
  color: var(--onn-gold-light);
  text-transform: uppercase;
  opacity: 0.8;
  margin: 0;
  text-align: center;
}
 
 
/* ── 画像④: Section 05 川のシンボル写真 ── */
 
.onn-river-photo {
  margin-top: 2.5rem;
  margin-bottom: 3.5rem;
  border-radius: var(--onn-radius-lg);
  overflow: hidden;
  position: relative;
  box-shadow:
    0 32px 70px -24px rgba(0,0,0,0.85),
    0 0 0 1px rgba(201,168,76,0.25);
}
 
.onn-river-photo img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 42%;
  display: block;
  filter: brightness(0.78) saturate(1.1) contrast(1.05);
  transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
 
.onn-river-photo:hover img {
  transform: scale(1.03);
}
 
/* 下グラデーションとキャプション */
.onn-river-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    transparent     30%,
    rgba(6,15,5,0.82) 100%
  );
  pointer-events: none;
}
 
.onn-river-photo figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  padding: 2rem 2rem 1.75rem;
  color: var(--onn-gold-light);
  font-family: var(--onn-font-serif);
  font-weight: 600;
  font-size: clamp(0.9rem, 1.8vw, 1.08rem);
  text-align: center;
  letter-spacing: 0.08em;
  line-height: 1.7;
  text-shadow: 0 2px 12px rgba(0,0,0,0.6);
}
 
 
/* ── 画像⑤: Section 07 理論的背景 アカデミック写真 ── */
 
.onn-evidence-photo {
  margin-bottom: 2.5rem;
  border-radius: var(--onn-radius-lg);
  overflow: hidden;
  position: relative;
  max-width: min(680px, 100%);
  margin-left: auto;
  margin-right: auto;
  box-shadow:
    var(--onn-shadow-card),
    0 0 0 1px var(--onn-border-soft);
}
 
.onn-evidence-photo img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 55%;
  display: block;
  filter: brightness(0.68) saturate(0.8) sepia(0.18) contrast(1.05);
  transition: transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              filter    0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
 
.onn-evidence-photo:hover img {
  transform: scale(1.03);
  filter: brightness(0.78) saturate(0.9) sepia(0.12);
}
 
/* 左上・下部グラデーション */
.onn-evidence-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(11,26,9,0.45) 0%, transparent 45%),
    linear-gradient(to bottom, transparent 45%, rgba(18,32,18,0.72) 100%);
  pointer-events: none;
}
 
 
/* ── 画像⑥: 最終CTA 全面背景 ── */
 
.onn-section--cta {
  position: relative;
  overflow: hidden;
}
 
.onn-cta-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
 
.onn-cta-bg__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  opacity: 0.28;
  filter: brightness(0.65) saturate(0.75) contrast(0.95);
  /* ゆっくりとしたケン・バーンズ風ズームで臨場感を付与 */
  animation: onn-cta-zoom 22s ease-in-out infinite alternate;
}
 
@keyframes onn-cta-zoom {
  from { transform: scale(1.0);  object-position: center 28%; }
  to   { transform: scale(1.06); object-position: center 35%; }
}
 
/* CTA コンテンツを画像の前面へ */
.onn-section--cta .onn-container,
.onn-section--cta > .onn-container {
  position: relative;
  z-index: 1;
}
 
/* CTA 背景を強化するダブルグラデーションオーバーレイ */
.onn-section--cta::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(180deg, #060f05 0%, rgba(6,15,5,0.72) 30%, rgba(6,15,5,0.68) 70%, #0b1a09 100%);
  pointer-events: none;
}
 
 
/* ── レスポンシブ: 画像スタイル モバイル調整 ── */
@media (max-width: 767px) {
  /* カバー背景は縦長画面でも中央を見せる */
  .onn-cover__bg-img {
    object-position: center center;
    opacity: 0.18;
  }
 
  /* モバイルではホバー効果なし（パフォーマンス配慮） */
  .onn-photo-accent:hover img,
  .onn-strategy-photo:hover img,
  .onn-river-photo:hover img,
  .onn-evidence-photo:hover img {
    transform: none;
    filter: inherit;
  }
 
  /* CTAケン・バーンズ: モバイルでは無効化（省電力） */
  .onn-cta-bg__img {
    animation: none;
  }
 
  /* evidence photo: モバイルでは幅100% */
  .onn-evidence-photo {
    max-width: 100%;
  }
}
 
/* ── レスポンシブ: タブレット以上 ── */
@media (min-width: 768px) {
  /* strategy photo: 最大高さを抑えて比率を維持 */
  .onn-strategy-photo img {
    max-height: 500px;
    object-fit: cover;
  }
}
 
/* ── アクセシビリティ: reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
  .onn-cover__bg-img,
  .onn-cta-bg__img {
    animation: none !important;
  }
  .onn-photo-accent img,
  .onn-strategy-photo img,
  .onn-river-photo img,
  .onn-evidence-photo img {
    transition: none !important;
  }
}
 



/* 画像要素（figure）の全画面・中央配置化 */
#onn-root .onn-evidence-photo {
  display: block;
  margin-top: 2rem;
  margin-bottom: 2rem;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
  max-width: var(--onn-container-normal); /* 既存のコンテナ幅に合わせる（必要に応じて調整） */
  text-align: center; /* 万が一インライン要素が残っていた場合の保険 */
}

/* figure配下のimgタグの挙動を安定化 */
#onn-root .onn-evidence-photo img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  height: auto;
  border-radius: var(--onn-radius); /* 角丸を適用する場合 */
}