/**
 * AIクロスドメイン思考 2026秋版 — ai-crossdomain-2026fall.css
 *
 * 設計思想:
 *   - #acdf-root 配下のみ完全独立デザイン
 *   - Cocoon / entry-content / article 干渉を完全排除
 *   - CSSカスタムプロパティで全色・全値を管理
 *   - モバイルファースト + clamp() 流体タイポグラフィ
 *   - アニメーションは opacity / transform / filter のみ使用
 *   - カラーパレット: 深宵紺（インディゴネイビー）× ゴールド × アイボリー。
 *     「知の航海図」をイメージした、データレポートらしい知的で品格のあるダーク高級系。
 *   - フォント: Noto Sans JP（本文）/ Shippori Mincho（日本語見出し）/ Cormorant Garamond（英数ディスプレイ）
 *   - 行間設計: デバイス別 line-height 完全最適化（Section 10）
 *   - 配色アクセシビリティ: コントラスト比 4.5:1 以上保証（Section 8）
 *   - テキスト中央配置: Flexboxラッパー構造（Section 9）
 *
 * @package cocoon-child-master
 */


/* ================================================================
   1. COCOON 干渉リセット
   ================================================================ */
.ai-crossdomain-2026fall .article,
.ai-crossdomain-2026fall .entry-content,
.ai-crossdomain-2026fall .main,
.ai-crossdomain-2026fall .content,
.ai-crossdomain-2026fall .wrap,
.ai-crossdomain-2026fall #main,
.ai-crossdomain-2026fall #body-in,
.ai-crossdomain-2026fall #container,
.ai-crossdomain-2026fall #container-in,
.ai-crossdomain-2026fall #contents,
.ai-crossdomain-2026fall #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;
}

.ai-crossdomain-2026fall #sidebar,
.ai-crossdomain-2026fall .sidebar,
.ai-crossdomain-2026fall #sidebar-scroll,
.ai-crossdomain-2026fall .sidebar-top,
.ai-crossdomain-2026fall .sidebar-bottom {
  display: none !important;
}

.ai-crossdomain-2026fall #footer:not(.tp-footer),
.ai-crossdomain-2026fall .site-footer:not(.tp-footer),
.ai-crossdomain-2026fall .footer:not(.tp-footer) {
  display: none !important;
}


/* ================================================================
   2. CSSカスタムプロパティ（全色・全値）
   ================================================================ */
#acdf-root {
  /* ─ カラーパレット：深宵紺×ゴールド×アイボリー ─ */
  --acdf-bg:          #0a0e1a;
  --acdf-bg-2:        #10152a;
  --acdf-bg-card:     #161c37;
  --acdf-bg-card-2:   #1c2444;
  --acdf-gold:        #c9a24c;
  --acdf-gold-bright: #e6c878;
  --acdf-gold-light:  #f0e2b8;
  --acdf-amber:       #c17a3f;
  --acdf-text:        #ece7d9;
  --acdf-text-2:      #b9c0d6;
  --acdf-text-3:      #8890ab;
  --acdf-border:      rgba(201, 162, 76, 0.2);
  --acdf-border-soft: rgba(201, 162, 76, 0.1);

  /* ─ タイポグラフィ ─ */
  --acdf-font-sans:    'Noto Sans JP', sans-serif;
  --acdf-font-serif:   'Shippori Mincho', serif;
  --acdf-font-display: 'Cormorant Garamond', serif;

  /* ─ 行間設計（モバイル基準値）─ */
  --acdf-lh-body:     1.9;
  --acdf-lh-lead:     2.0;
  --acdf-lh-h1:       1.55;
  --acdf-lh-h2:       1.5;
  --acdf-lh-h3:       1.55;
  --acdf-lh-caption:  1.7;

  /* ─ 文字間隔（モバイル基準値）─ */
  --acdf-ls-body:     0.03em;
  --acdf-ls-heading:  -0.01em;
  --acdf-ls-display:   0.05em;
  --acdf-ls-caption:   0.02em;

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

  /* ─ 段落・見出し余白 ─ */
  --acdf-p-gap:         1.25em;
  --acdf-heading-mb:    0.8em;
  --acdf-list-gap:      0.5em;

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


/* ================================================================
   3. GLOBAL RESET — #acdf-root スコープ
   ================================================================ */
#acdf-root,
#acdf-root *,
#acdf-root *::before,
#acdf-root *::after {
  box-sizing: border-box;
}

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

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

#acdf-root {
  background-color: var(--acdf-bg);
  color: var(--acdf-text);
  font-family: var(--acdf-font-sans);
  font-weight: 400;
  line-height: var(--acdf-lh-body, 1.9);
  letter-spacing: var(--acdf-ls-body, 0.03em);
  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;
}

#acdf-root img {
  max-width: 100%;
  display: block;
}

#acdf-root a {
  color: inherit;
  text-decoration: none;
}

#acdf-root hr {
  border: none;
  border-top: 1px solid var(--acdf-border);
  margin: 2em 0;
}

#acdf-root ::selection {
  background: rgba(201, 162, 76, 0.32);
  color: var(--acdf-gold-light);
}


/* ================================================================
   4. ベースコンポーネント
   ================================================================ */
.acdf-container {
  max-width: var(--acdf-container-max);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}

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

.acdf-section {
  padding-block: var(--acdf-section-py);
  position: relative;
}

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

.acdf-section--divider {
  border-top: 1px solid var(--acdf-border-soft);
  border-bottom: 1px solid var(--acdf-border-soft);
}

/* セクション上部の細いゴールドグラデーションライン */
.acdf-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(120px, 30%);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--acdf-gold), transparent);
  opacity: 0.5;
}

.acdf-section--no-line::before {
  content: none;
}


/* ================================================================
   5. スクロールリビール
   ================================================================ */
.acdf-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);
}

.acdf-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.acdf-reveal[data-delay="1"] { transition-delay: 0.1s; }
.acdf-reveal[data-delay="2"] { transition-delay: 0.2s; }
.acdf-reveal[data-delay="3"] { transition-delay: 0.3s; }
.acdf-reveal[data-delay="4"] { transition-delay: 0.4s; }
.acdf-reveal[data-delay="5"] { transition-delay: 0.5s; }


/* ================================================================
   6. テーブル・ブロッククォートの白抜き問題対策
   ================================================================ */
#acdf-root blockquote {
  background: var(--acdf-bg-card) !important;
  border-left: 3px solid var(--acdf-gold) !important;
  border-right: none !important;
  color: var(--acdf-text) !important;
  padding: 1.75rem 2rem !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: var(--acdf-radius-sm) !important;
}

#acdf-root blockquote::before,
#acdf-root blockquote::after {
  display: none !important;
}

.acdf-table-wrap {
  overflow-x: auto;
  margin-block: 1.5rem;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--acdf-container-wide);
  border-radius: var(--acdf-radius);
  border: 1px solid var(--acdf-border);
}

.acdf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  background: transparent !important;
}

.acdf-table thead th {
  background: var(--acdf-bg-card-2) !important;
  color: var(--acdf-gold-light);
  padding: 0.9rem 1.1rem;
  text-align: left;
  border-bottom: 1px solid var(--acdf-border);
  line-height: var(--acdf-lh-body);
  font-weight: 700;
  white-space: nowrap;
}

.acdf-table tbody td {
  background: transparent !important;
  padding: 0.85rem 1.1rem;
  border-bottom: 1px solid rgba(201, 162, 76, 0.08);
  color: var(--acdf-text-2);
  vertical-align: top;
  line-height: var(--acdf-lh-body);
}

.acdf-table tbody tr:last-child td {
  border-bottom: none;
}

.acdf-table tbody tr:hover td {
  background: rgba(201, 162, 76, 0.05) !important;
}

.acdf-table .acdf-table__num {
  color: var(--acdf-gold);
  font-family: var(--acdf-font-display);
  font-weight: 700;
  font-size: 1.05em;
  width: 2.5em;
}

.acdf-table .acdf-table__name {
  color: var(--acdf-text);
  font-weight: 600;
}


/* ================================================================
   8. アクセシビリティ配色仕様（Cocoonストライプリセット含む）
      ★省略禁止。全コード必須出力。
   ================================================================ */

/* ──
   【最重要】Cocoonテーブルストライプ背景の強制リセット
   tr:nth-of-type(even/odd) によるグレー・白の自動付与を完全無効化する
   ── */
#acdf-root .entry-content table,
#acdf-root table {
  background-color: transparent !important;
  border-collapse: collapse;
}

#acdf-root .entry-content table tr,
#acdf-root .entry-content table tr:nth-of-type(even),
#acdf-root .entry-content table tr:nth-of-type(odd),
#acdf-root table tr,
#acdf-root table tr:nth-of-type(even),
#acdf-root table tr:nth-of-type(odd) {
  background-color: var(--acdf-bg-card) !important;
  color: var(--acdf-text) !important;
}

#acdf-root .entry-content table th,
#acdf-root .entry-content table td,
#acdf-root table th,
#acdf-root table td {
  color: inherit !important;
  border-color: var(--acdf-border) !important;
}

/* ──
   Cocoonが注入した白背景のblockquoteを安全なグレーに強制置換
   ── */
#acdf-root blockquote:not([class*="acdf"]),
body.ai-crossdomain-2026fall .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を安全なグレーに強制置換
   （LPカスタムクラスを持たないテーブル = Cocoonデフォルト適用テーブル対象）
   ── */
#acdf-root table:not([class*="acdf"]) th,
body.ai-crossdomain-2026fall .entry-content table th {
  background-color: #E8E8E8 !important; /* Rule 4 ✓ */
  color:            #111111 !important; /* Rule 2: 対比比 ~16:1 ✓ */
  border-color:     #C0C0C0 !important;
}

#acdf-root table:not([class*="acdf"]) td,
body.ai-crossdomain-2026fall .entry-content table td {
  background-color: #F5F5F5 !important; /* Rule 4 ✓ */
  color:            #222222 !important; /* Rule 2: 対比比 ~15:1 ✓ */
  border-color:     #D0D0D0 !important;
}

/* ──
   code / pre のCocoon白抜き上書き
   ── */
#acdf-root code:not([class]) {
  background-color: #EBEBEB !important; /* Rule 4 ✓ */
  color:            #1E1E1E !important; /* Rule 2: ~15:1 ✓ */
  padding: 0.15em 0.4em;
  border-radius: 4px;
  font-size: 0.875em;
}

#acdf-root pre:not([class]) {
  background-color: #EBEBEB !important; /* Rule 4 ✓ */
  color:            #1E1E1E !important; /* Rule 2 ✓ */
  padding: 1rem 1.25rem;
  border-radius: 6px;
  overflow-x: auto;
  font-size: 0.875em;
}

/* ──
   ダークLP内の専用blockquote（デザイン強調用）
   ── */
#acdf-root .acdf-blockquote {
  background-color: var(--acdf-bg-card) !important;
  color:            var(--acdf-text)    !important;
  border-left: 3px solid var(--acdf-gold) !important;
  padding: 1.75rem 2rem !important;
  border-radius: var(--acdf-radius-sm) !important;
}


/* ================================================================
   9. テキストブロック中央配置仕様（Flexboxラッパー構造）
      ★margin:autoではなくFlexboxラッパーを使用すること
   ================================================================ */

/* ── Flexboxラッパー（中央配置の標準パターン）── */
.acdf-align-center-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center; /* ブロック要素自体の水平中央配置 */
  justify-content: center;
  width: 100%;
}

.acdf-align-center-wrapper .acdf-content-block {
  max-width: var(--acdf-container-max); /* 900px デフォルト */
  text-align: center; /* 内部テキストの中央揃え */
  width: 100%;
}

.acdf-align-center-wrapper .acdf-content-block--wide {
  max-width: var(--acdf-container-wide); /* 1120px */
  text-align: center;
  width: 100%;
}

/* ── セクションヘッダーの中央配置（Flexboxラッパー構造） ── */
.acdf-section-header-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.acdf-section-header {
  text-align: center;
  max-width: min(680px, 90%);
  width: 100%;
}

.acdf-section-header--wide {
  text-align: center;
  max-width: min(880px, 92%);
  width: 100%;
}

/* セクション eyebrow ラベル */
.acdf-section-eyebrow {
  text-align: center;
  display: block;
  width: fit-content;
}

/* ── CTAボタン wrap の中央配置（Flexboxラッパー構造）── */
.acdf-cta-btn-outer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.acdf-cta-btn-wrap {
  text-align: center;
  width: fit-content;
}

/* ── blockquote の中央配置（Flexboxラッパー構造）── */
.acdf-blockquote-center-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.acdf-blockquote-center-wrap blockquote,
.acdf-blockquote-center-wrap .acdf-blockquote {
  text-align: center !important;
  max-width: min(680px, 90%) !important;
  width: 100% !important;
}

/* ── テーブルラッパーの中央配置（Flexboxラッパー構造）── */
.acdf-table-outer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

/* ── 補助ユーティリティ（Flexboxラッパーが使えない場面用フォールバック）── */
.acdf-text-center {
  text-align: center !important;
}

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


/* ================================================================
   10. 行間設計・デバイス別最適化（★単一値設定禁止）
   ================================================================ */

/* ── 10.1 モバイル基準値（デフォルト: 〜767px）── */

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

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

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

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

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

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

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

#acdf-root .acdf-section-eyebrow,
#acdf-root .acdf-cover__eyebrow,
#acdf-root [class*="acdf-en-"] {
  letter-spacing: var(--acdf-ls-display, 0.05em);
  line-height: 1.4;
}

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

#acdf-root p + p {
  margin-top: var(--acdf-p-gap, 1.25em);
}

#acdf-root h2 + p,
#acdf-root h2 + .acdf-section-desc,
#acdf-root h3 + p {
  margin-top: 0.75em;
}

#acdf-root p + ul,
#acdf-root p + ol {
  margin-top: 0.75em;
}

#acdf-root li + li {
  margin-top: var(--acdf-list-gap, 0.5em);
}

#acdf-root h2:not(:first-child),
#acdf-root h3:not(:first-child) {
  margin-top: 2em;
}

#acdf-root h2,
#acdf-root h3 {
  margin-bottom: var(--acdf-heading-mb, 0.8em);
}

/* ── 10.3 タブレット最適化（768px〜1023px）── */
@media (min-width: 768px) {
  #acdf-root {
    --acdf-lh-body:    1.88;
    --acdf-lh-lead:    1.95;
    --acdf-lh-h1:      1.5;
    --acdf-lh-h2:      1.45;
    --acdf-lh-h3:      1.35;
    --acdf-ls-body:    0.025em;
    --acdf-p-gap:      1.3em;
  }

  #acdf-root .acdf-container p,
  #acdf-root .acdf-section-header p {
    max-width: 100%;
  }
}

/* ── 10.4 デスクトップ最適化（1024px〜）── */
@media (min-width: 1024px) {
  #acdf-root {
    --acdf-lh-body:    1.85;
    --acdf-lh-lead:    1.9;
    --acdf-lh-h1:      1.4;
    --acdf-lh-h2:      1.35;
    --acdf-lh-h3:      1.3;
    --acdf-lh-caption: 1.65;
    --acdf-ls-body:    0.02em;
    --acdf-ls-heading: -0.02em;
    --acdf-p-gap:      1.35em;
    --acdf-heading-mb: 0.85em;
  }

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

/* ── 10.5 ワイドデスクトップ（1280px〜）── */
@media (min-width: 1280px) {
  #acdf-root {
    --acdf-lh-body: 1.85;
  }
}


/* ================================================================
   12. リスト要素 Cocoon干渉排除（★省略禁止）
   ================================================================ */

/* ── Cocoonデフォルトリストマーカーの完全初期化 ── */
#acdf-root .entry-content ul,
#acdf-root .entry-content ol,
#acdf-root ul,
#acdf-root ol {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

#acdf-root .entry-content li,
#acdf-root li {
  position: relative;
  padding-left: 0 !important;
  margin-bottom: 0;
  list-style-type: none !important;
}

#acdf-root .entry-content li::before,
#acdf-root .entry-content li::after {
  content: none !important;
}

/* ── LP独自のマーカー設定（ゴールドドット） ── */
#acdf-root .acdf-list li {
  padding-left: 1.6em !important;
  margin-bottom: var(--acdf-list-gap, 0.5em);
  position: relative;
}

#acdf-root .acdf-list li::before {
  content: '●';
  position: absolute;
  left: 0;
  top: 0.1em;
  color: var(--acdf-gold);
  font-size: 0.6em;
  line-height: var(--acdf-lh-body);
}

/* ── チェックマーク型リスト ── */
#acdf-root .acdf-list--check li::before {
  content: '✓';
  color: var(--acdf-gold);
  font-weight: 700;
  font-size: 0.85em;
}

/* ── ナンバリングリスト ── */
#acdf-root .acdf-list--numbered {
  counter-reset: acdf-counter;
}

#acdf-root .acdf-list--numbered li {
  counter-increment: acdf-counter;
}

#acdf-root .acdf-list--numbered li::before {
  content: counter(acdf-counter);
  font-family: var(--acdf-font-display);
  color: var(--acdf-gold);
  font-weight: 600;
  font-size: 0.9em;
}


/* ================================================================
   13. タイポグラフィ基本スケール
   ================================================================ */
#acdf-root h1,
#acdf-root .acdf-cover__title {
  font-family: var(--acdf-font-serif);
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 3.5rem);
  color: var(--acdf-text);
  text-wrap: balance;
}

#acdf-root h1 em,
#acdf-root .acdf-cover__title em {
  font-style: normal;
  color: var(--acdf-gold-bright);
}

#acdf-root h2,
#acdf-root .acdf-section-title {
  font-family: var(--acdf-font-serif);
  font-weight: 700;
  font-size: clamp(1.5rem, 3.5vw, 2.5rem);
  color: var(--acdf-text);
}

#acdf-root h3 {
  font-family: var(--acdf-font-sans);
  font-weight: 700;
  font-size: clamp(1.1rem, 2.5vw, 1.5rem);
  color: var(--acdf-text);
}

#acdf-root p,
#acdf-root li {
  font-size: clamp(0.9rem, 1.8vw, 1.05rem);
  color: var(--acdf-text-2);
}

#acdf-root .acdf-section-eyebrow {
  font-family: var(--acdf-font-display);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--acdf-gold);
  text-transform: uppercase;
}


/* ================================================================
   14. HEADER 高さ調整（アンカーずれ防止）
   ================================================================ */
html.ai-crossdomain-2026fall-html {
  scroll-padding-top: 70px;
}


/* ================================================================
   15. COVER（ファーストビュー）
   ================================================================ */
.acdf-cover {
  position: relative;
  padding-block: clamp(6rem, 14vw, 10rem) clamp(5rem, 12vw, 8rem);
  overflow: hidden;
  isolation: isolate;
}

/* ── 背景写真レイヤー（最背面） ── */
.acdf-cover__bg {
  position: absolute;
  inset: 0;
  z-index: -3;
  overflow: hidden;
}

.acdf-cover__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  transform: scale(1.08);
  will-change: transform;
  filter: saturate(0.9) brightness(0.72);
}

/* 背景写真の上に敷く暗色グラデーション（本文の可読性・コントラスト確保） */
.acdf-cover__bg-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10, 14, 26, 0.55) 0%, rgba(10, 14, 26, 0.72) 45%, var(--acdf-bg) 96%),
    radial-gradient(ellipse 70% 60% at 50% 10%, rgba(10, 14, 26, 0.15), rgba(10, 14, 26, 0.75) 70%);
}

/* ── ゴールドの微光・グリッド装飾レイヤー（背景写真の上） ── */
.acdf-cover__decor {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(ellipse 80% 55% at 18% -10%, rgba(201, 162, 76, 0.14), transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 10%, rgba(120, 92, 200, 0.08), transparent 55%);
}

.acdf-cover__decor::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 162, 76, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 162, 76, 0.05) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 20%, black, transparent 75%);
}

.acdf-cover__content {
  text-align: center;
}

.acdf-cover__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--acdf-font-display);
  font-size: clamp(0.8rem, 1.6vw, 0.95rem);
  font-weight: 600;
  color: var(--acdf-gold-bright);
  margin-bottom: clamp(1.25rem, 3vw, 1.75rem);
}

.acdf-cover__eyebrow-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--acdf-gold);
  box-shadow: 0 0 10px 2px rgba(201, 162, 76, 0.6);
  flex: none;
}

.acdf-cover__sub {
  margin-top: clamp(1.5rem, 3.5vw, 2.25rem);
  max-width: 46em;
  margin-inline: auto;
  color: var(--acdf-text-2);
  text-wrap: pretty;
}

.acdf-cover__meta {
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(1.5rem, 4vw, 3rem);
  padding-top: clamp(1.75rem, 4vw, 2.5rem);
  border-top: 1px solid var(--acdf-border);
}

.acdf-cover__meta-item {
  text-align: center;
}

.acdf-cover__meta-num {
  font-family: var(--acdf-font-display);
  font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  font-weight: 700;
  color: var(--acdf-gold);
  line-height: 1;
}

.acdf-cover__meta-label {
  margin-top: 0.4em;
  font-size: 0.78rem;
  color: var(--acdf-text-3);
  letter-spacing: 0.02em;
}


/* ================================================================
   16. CTAボタン共通スタイル
   ================================================================ */
.acdf-cta-btn,
.acdf-cover__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 1.05em 2.4em;
  border-radius: 999px;
  font-weight: 700;
  font-size: clamp(0.95rem, 1.8vw, 1.05rem);
  color: #fff8ec;
  box-shadow: 0 14px 34px -14px rgba(184, 98, 44, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06) inset;
  transition: transform var(--acdf-transition), box-shadow var(--acdf-transition), filter var(--acdf-transition);
  will-change: transform;
  cursor: pointer;
  border: none;
}

.acdf-cta-btn:hover,
.acdf-cover__cta-btn:hover {
  filter: brightness(1.08);
  box-shadow: 0 18px 40px -14px rgba(184, 98, 44, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}

.acdf-cta-btn__sub {
  margin-top: 0.9em;
  color: var(--acdf-text-3);
  text-align: center;
}

.acdf-cta-btn--outline {
  background: transparent !important;
  color: var(--acdf-text) !important;
  border: 1px solid var(--acdf-border) !important;
  box-shadow: none !important;
}

.acdf-cta-btn--outline:hover {
  border-color: var(--acdf-gold) !important;
  color: var(--acdf-gold-bright) !important;
}

.acdf-hero-actions {
  margin-top: clamp(2rem, 5vw, 2.75rem);
  display: flex;
  gap: clamp(0.75rem, 2vw, 1.25rem);
  flex-wrap: wrap;
  justify-content: center;
}


/* ================================================================
   17. PROBLEM（課題提起）
   ================================================================ */
.acdf-problem-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2.5vw, 1.5rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-problem-card {
  background: var(--acdf-bg-card);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius);
  padding: clamp(1.5rem, 3vw, 2rem);
  border-left: 3px solid var(--acdf-gold);
  transition: transform var(--acdf-transition), border-color var(--acdf-transition);
}

.acdf-problem-card:hover {
  transform: translateY(-4px);
  border-color: var(--acdf-gold);
}

.acdf-problem-card__icon {
  width: clamp(56px, 9vw, 72px);
  aspect-ratio: 1 / 1;
  border-radius: var(--acdf-radius-sm);
  background: var(--acdf-bg-card-2);
  border: 1px solid var(--acdf-border);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 1.1em;
  box-shadow: 0 0 0 1px rgba(201, 162, 76, 0.06) inset;
}

.acdf-problem-card__icon img {
  width: 68%;
  height: 68%;
  object-fit: contain;
}

.acdf-problem-card__num {
  font-family: var(--acdf-font-display);
  font-size: 1.6rem;
  color: var(--acdf-gold);
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0.6em;
  display: block;
}

.acdf-problem-card h3 {
  margin-bottom: 0.6em;
}

@media (min-width: 768px) {
  .acdf-problem-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ================================================================
   18. CONTEXT（背景・市場変化）
   ================================================================ */
.acdf-context-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-context-item {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1.25rem);
  padding: clamp(1.5rem, 3vw, 2rem) 0;
  border-bottom: 1px solid var(--acdf-border-soft);
}

.acdf-context-item:last-child {
  border-bottom: none;
}

.acdf-context-num {
  font-family: var(--acdf-font-display);
  font-size: 0.95rem;
  color: var(--acdf-gold);
  font-weight: 700;
}

.acdf-context-item h3 {
  margin-bottom: 0.6em;
}

.acdf-context-item .acdf-source {
  margin-top: 0.9em;
}

@media (min-width: 640px) {
  .acdf-context-item {
    grid-template-columns: 90px 1fr;
    align-items: start;
  }
}

.acdf-source {
  display: inline-block;
  font-size: 0.8rem;
  color: var(--acdf-text-3);
  border-top: 1px solid var(--acdf-border-soft);
  padding-top: 0.6em;
}

.acdf-source a {
  color: var(--acdf-gold-bright);
  text-decoration: underline;
  text-underline-offset: 3px;
}


/* ================================================================
   19. EVIDENCE（統計データカード）
   ================================================================ */
.acdf-card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2vw, 1.25rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-data-card {
  background: var(--acdf-bg-card-2);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius);
  padding: clamp(1.5rem, 3vw, 1.85rem);
  transition: transform var(--acdf-transition), box-shadow var(--acdf-transition);
}

.acdf-data-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.5);
}

.acdf-data-card__num {
  font-family: var(--acdf-font-display);
  font-size: clamp(2.2rem, 4vw, 2.75rem);
  font-weight: 700;
  line-height: 1;
  color: var(--acdf-gold-bright);
}

.acdf-data-card__desc {
  margin-top: 0.75em;
  font-size: 0.92rem;
  color: var(--acdf-text-2);
}

.acdf-data-card .acdf-source {
  margin-top: 1.1em;
}

@media (min-width: 640px) {
  .acdf-card-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
  .acdf-card-grid { grid-template-columns: repeat(3, 1fr); }
}


/* ================================================================
   20. FRAMEWORK（7領域×14フロー 照合マップ）
   ================================================================ */
.acdf-domain-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2vw, 1.25rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-domain-card {
  background: var(--acdf-bg-card);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius);
  padding: clamp(1.5rem, 3vw, 1.85rem);
}

.acdf-domain-card-head {
  display: flex;
  align-items: baseline;
  gap: 0.75em;
  flex-wrap: wrap;
  margin-bottom: 0.75em;
}

.acdf-domain-idx {
  font-family: var(--acdf-font-display);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--acdf-gold);
  border: 1px solid var(--acdf-border);
  border-radius: 999px;
  padding: 3px 12px;
  flex: none;
}

.acdf-domain-flows {
  margin-top: 0.9em;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.acdf-flow-tag {
  font-size: 0.78rem;
  background: rgba(201, 162, 76, 0.08);
  border: 1px solid var(--acdf-border);
  border-radius: 6px;
  padding: 5px 11px;
  color: var(--acdf-text-2);
  line-height: 1.5;
}

.acdf-domain-examples {
  margin-top: 1em;
  font-size: 0.85rem;
  color: var(--acdf-text-3);
  padding-top: 0.9em;
  border-top: 1px dashed var(--acdf-border-soft);
}

@media (min-width: 900px) {
  .acdf-domain-list { grid-template-columns: 1fr 1fr; }
}

.acdf-flow-appendix {
  margin-top: clamp(3rem, 6vw, 4.5rem);
}

/* ── フレームワーク構造マップ（図解画像） ── */
.acdf-framework-map {
  margin-top: clamp(2rem, 4vw, 3rem);
  border-radius: var(--acdf-radius-lg);
  overflow: hidden;
  border: 1px solid var(--acdf-border);
  aspect-ratio: 16 / 9;
  background: var(--acdf-bg-card);
  box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.6);
}

.acdf-framework-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


/* ================================================================
   21. SELF DIAGNOSIS（自己診断）
   ================================================================ */
.acdf-diag-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.75rem, 4vw, 2.5rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-diag-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.acdf-diag-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: clamp(0.9rem, 2vw, 1.1rem) 0;
  border-bottom: 1px solid var(--acdf-border-soft);
}

.acdf-diag-check {
  appearance: none;
  -webkit-appearance: none;
  width: 22px;
  height: 22px;
  flex: none;
  margin-top: 2px;
  border: 1.5px solid var(--acdf-text-3);
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  transition: background var(--acdf-transition), border-color var(--acdf-transition);
}

.acdf-diag-check:checked {
  background: var(--acdf-gold);
  border-color: var(--acdf-gold);
}

.acdf-diag-check:checked::after {
  content: '✓';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: #10152a;
}

.acdf-diag-item label {
  cursor: pointer;
  color: var(--acdf-text-2);
}

.acdf-diag-result {
  background: var(--acdf-bg-card);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius);
  padding: clamp(1.5rem, 3vw, 2rem);
  height: fit-content;
}

.acdf-diag-result h3 {
  margin-bottom: 0.6em;
}

.acdf-diag-result__count {
  font-family: var(--acdf-font-display);
  font-weight: 700;
  color: var(--acdf-gold);
  font-size: clamp(2rem, 4vw, 2.5rem);
  line-height: 1;
}

.acdf-diag-result__text {
  margin-top: 0.9em;
  color: var(--acdf-text-2);
  font-size: 0.9rem;
}

@media (min-width: 900px) {
  .acdf-diag-grid { grid-template-columns: 1.1fr 0.9fr; }
  .acdf-diag-result { position: sticky; top: 96px; }
}


/* ================================================================
   22. FUTURE（作業者からオーケストレーターへ）
   ================================================================ */
.acdf-future-diagram {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: clamp(1.25rem, 3vw, 1.75rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}

/* ── ビフォーアフター対比図（作業者→オーケストレーター） ── */
.acdf-future-visual {
  margin-top: clamp(2rem, 4vw, 3rem);
  border-radius: var(--acdf-radius-lg);
  overflow: hidden;
  border: 1px solid var(--acdf-border);
  aspect-ratio: 16 / 9;
  background: var(--acdf-bg-card);
  box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.6);
  position: relative;
}

.acdf-future-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.acdf-future-visual figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0.9em 1.2em;
  font-size: 0.78rem;
  color: var(--acdf-text-2);
  background: linear-gradient(0deg, rgba(10, 14, 26, 0.82), transparent);
}

.acdf-future-box {
  background: var(--acdf-bg-card);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius);
  padding: clamp(1.5rem, 3vw, 2rem);
}

.acdf-future-box .acdf-tag {
  font-size: 0.78rem;
  color: var(--acdf-text-3);
  font-weight: 600;
  margin-bottom: 0.6em;
  letter-spacing: 0.04em;
}

.acdf-future-box h4 {
  font-size: clamp(1.05rem, 2.2vw, 1.3rem);
  margin-bottom: 0.6em;
  color: var(--acdf-text);
}

.acdf-future-arrow {
  font-size: 1.8rem;
  color: var(--acdf-gold);
  text-align: center;
  line-height: 1;
}

@media (min-width: 820px) {
  .acdf-future-diagram { grid-template-columns: 1fr auto 1fr; }
}
@media (max-width: 819px) {
  .acdf-future-arrow { transform: rotate(90deg); }
}

.acdf-future-roles {
  margin-top: clamp(2rem, 4vw, 2.75rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.acdf-role-chip {
  background: var(--acdf-bg-card-2);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius-sm);
  padding: clamp(0.9rem, 2vw, 1.1rem);
  text-align: center;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--acdf-gold-light);
}

@media (min-width: 700px) {
  .acdf-future-roles { grid-template-columns: repeat(4, 1fr); }
}


/* ================================================================
   23. FAQ
   ================================================================ */
.acdf-faq-list {
  margin-top: clamp(2rem, 4vw, 3rem);
}

.acdf-faq-item {
  border-bottom: 1px solid var(--acdf-border-soft);
  padding: clamp(1rem, 2vw, 1.25rem) 0;
}

.acdf-faq-item summary {
  cursor: pointer;
  font-weight: 700;
  font-size: clamp(0.98rem, 2vw, 1.08rem);
  color: var(--acdf-text);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  list-style: none;
}

.acdf-faq-item summary::-webkit-details-marker {
  display: none;
}

.acdf-faq-item summary::after {
  content: '+';
  font-size: 1.5rem;
  color: var(--acdf-gold);
  font-weight: 400;
  flex: none;
  transition: transform var(--acdf-transition);
}

.acdf-faq-item[open] summary::after {
  content: '−';
}

.acdf-faq-item p {
  margin-top: 0.9em;
  max-width: 70ch;
}


/* ================================================================
   24. 最終CTAセクション
   ================================================================ */
.acdf-cta-section {
  padding-block: clamp(3rem, 6vw, 5rem);
}

.acdf-cta-panel {
  background:
    radial-gradient(ellipse 80% 100% at 50% 0%, rgba(201, 162, 76, 0.12), transparent 60%),
    var(--acdf-bg-card);
  border: 1px solid var(--acdf-border);
  border-radius: var(--acdf-radius-lg);
  padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.5rem, 5vw, 3rem);
  text-align: center;
}

.acdf-cta-panel h2 {
  max-width: min(620px, 92%);
  margin-inline: auto;
  text-wrap: balance;
}

.acdf-cta-panel .acdf-lead {
  max-width: 46em;
  margin-inline: auto;
  margin-top: 1em;
  text-wrap: pretty;
}

.acdf-cta-disclaimer {
  margin-top: clamp(1.5rem, 3vw, 2rem);
  font-size: 0.78rem;
  color: var(--acdf-text-3);
  max-width: 60ch;
  margin-inline: auto;
}


/* ================================================================
   25. レスポンシブ改行制御ユーティリティ
   （PC / タブレット / スマホ それぞれで最適な位置に改行）
   ================================================================ */
.acdf-br-sp,
.acdf-br-tab,
.acdf-br-pc {
  display: none;
}

/* 〜767px（スマホ）: acdf-br-sp のみ表示 */
@media (max-width: 767px) {
  .acdf-br-sp { display: inline; }
}

/* 768px〜1023px（タブレット）: acdf-br-tab のみ表示 */
@media (min-width: 768px) and (max-width: 1023px) {
  .acdf-br-tab { display: inline; }
}

/* 1024px〜（デスクトップ）: acdf-br-pc のみ表示 */
@media (min-width: 1024px) {
  .acdf-br-pc { display: inline; }
}


/* ================================================================
   26. アクセシビリティ・印刷対応
   ================================================================ */
#acdf-root :focus-visible {
  outline: 2px solid var(--acdf-gold-bright);
  outline-offset: 3px;
  border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
  #acdf-root * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}