@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

@import url("../cocoon/style.css");



/* ヘッダー行を2カラム化：左=max-content(ロゴ), 右=余白いっぱい(メニュー) */
#header-container .header-in.wrap.cf.nmj-header-in{
  display:grid !important;
  grid-template-columns: max-content 1fr !important;
  align-items:center !important;
  column-gap:16px;
  /* ▼ガター反映（背景は全幅のまま、中身だけ左右余白） */
  padding-left:  var(--page-gutter) !important;
  padding-right: var(--page-gutter) !important;
  box-sizing: border-box;
  width: 100%;
}

/* --- SPでは .header-in を非表示 --- */
@media (max-width: 767.98px){
 #header-container.nmj-header{ display:none !important; }
}

/* ロゴ列は中身のサイズで収まるように（Cocoonの幅100%を打消し） */
#header-container .nmj-brand{ display:inline-flex !important; align-items:center; min-width:0; }
#header-container .nmj-brand .logo-header{
  width:auto !important;      /* ← これで100%を無効化 */
  margin:0 !important;
  text-align:left !important;
}
#header-container .nmj-brand .site-name{ white-space:nowrap; }

/* メニュー列は右寄せ */
#header-container .nmj-navwrap{ justify-self:end; min-width:0; }
#header-container .nmj-navwrap .navi{
  width:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  margin:0 !important;
}
#header-container .nmj-navwrap .navi-in > ul{
  display:flex !important;
  flex-wrap:wrap;
  justify-content:flex-end !important;
  align-items:center;
  gap:8px;
  margin:0; padding:0;
}
#header-container .nmj-navwrap .navi-in > ul > li{ width:auto !important; height:auto !important; }
#header-container .nmj-navwrap .navi-in > ul > li > a{
  display:flex; align-items:center; gap:6px;
  padding:.6rem .8rem; height:auto; text-decoration:none;
  color:#0f172a !important;
}
#header-container .nmj-navwrap .navi-in > ul > li > a:hover{
  background:#f5f8fa !important; color:#0f172a !important;
}
/* 無料診断する：サブ濃い（Secondary 600） */
#navi-in .menu-header > li > a[href*="/simulationtop/"]{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 9999px !important;
  padding: .55rem 1rem !important;
  font-weight: 800 !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.12) !important;
  transition: .2s ease !important;
  background: var(--nmj-secondary-600, #9e242c) !important;
}

/* LINEで相談する：LINE/アクセントで既存CTA上書き */
#navi #menu-item-487 > a,
#navi-in #menu-item-487 > a,
#navi .menu-header.menu-pc > li#menu-item-487 > a{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 9999px !important;
  padding: .55rem 1rem !important;
  font-weight: 800 !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.12) !important;
  transition: .2s ease !important;
  background: linear-gradient(
    135deg,
    var(--nmj-btn3, #22c55e),
    var(--nmj-btn3-600, #1EAD53)
  ) !important;
}

/* hover */
#navi-in .menu-header > li > a[href*="/simulationtop/"]:hover,
#navi #menu-item-487 > a:hover,
#navi-in #menu-item-487 > a:hover,
#navi .menu-header.menu-pc > li#menu-item-487 > a:hover{
  filter: brightness(.96);
  transform: translateY(-1px);
}

/* 文字・アイコンも白固定 */
#navi-in .menu-header > li > a[href*="/simulationtop/"],
#navi-in .menu-header > li > a[href*="/simulationtop/"] .caption-wrap,
#navi-in .menu-header > li > a[href*="/simulationtop/"] .item-label,
#navi-in .menu-header > li > a[href*="/simulationtop/"] i,
#navi #menu-item-487 > a,
#navi #menu-item-487 > a .caption-wrap,
#navi #menu-item-487 > a .item-label,
#navi #menu-item-487 > a i{
  color: #fff !important;
}

/* 擬似要素の保険 */
#navi-in .menu-header > li > a[href*="/simulationtop/"]::before,
#navi-in .menu-header > li > a[href*="/simulationtop/"]::after,
#navi #menu-item-487 > a::before,
#navi #menu-item-487 > a::after{
  display: none !important;
}
/* 旧：別行の黒帯ナビがどこかで出ても非表示に（PC） */
#header-container-in > .navi{ display:none !important; }

/* ロゴ画像の高さ */
#header-container .logo-header img{ max-height:60px; height:auto; }

/* 左ブロック：ロゴ → サイト名 → キャッチフレーズ の縦配置（見出し大） */
#header-container .nmj-brand{ display:flex; align-items:center; gap:12px; }
#header-container .nmj-logo img{ max-height:60px; height:auto; }
#header-container .nmj-brand-text{
  display:flex !important; flex-direction:column !important;
  align-items:flex-start; gap:4px;
}
#header-container .nmj-site-name a{
  font-weight:900; font-size:22px; line-height:1.15; color:#0f172a; text-decoration:none;
}
#header-container .nmj-tagline{
  display:block !important; font-size:12px; line-height:1.35; color:#64748b; margin-top:2px;
}

/* Cocoonが .logo-header を幅100%にする影響を無効化（念のため） */
#header-container .logo-header{ width:auto !important; margin:0 !important; }

/* —— スマホ表示（メニュー＋アイコン＋CTAを1行で見せる） ——— */
@media (max-width: 960px){
  /* ロゴをさらに少しだけ小さく */
  #header-container .nmj-logo img{max-height:40px}
  /* サイト名は読みやすく少しだけ縮小 */
  #header-container .nmj-site-name a{font-size:20px}

  /* メニュー行は横スクロール可、折り返さない */
  .nmj-header .navi-in>ul{
    flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch; gap:6px;
  }
  .nmj-header .navi-in>ul>li{flex:0 0 auto} /* タブ状に連なる */
  .nmj-header .navi-in>ul>li>a{padding:.5rem .7rem}

  /* CTAが常に右端に来るよう、左余白を自動で押し出し */
  .nmj-header .navi-in>ul{scroll-padding-right:12px}
  .nmj-header .navi-in>ul>li:last-child{margin-left:auto}

  /* タグラインは省スペースのため非表示（必要なら削除） */
  #header-container .nmj-tagline{display:none}
}

/* ========= PC表示（>=961px） ========= */
@media (min-width: 961px){
  /* 旧：黒帯ナビ（header直後に出る .navi）を隠す */
  #header-container-in > .navi{ display:none !important; }
  /* PC用ナビ（ヘッダー右側）は表示 */
  .nmj-header .nmj-navwrap.nmj-nav--pc{ display:block !important; }
  /* 念のため、SP用の余計な包みは消す */
  .nmj-nav--sp{ display:none !important; }
}

/* ========= スマホ表示（<=960px） ========= */
/* スマホはCocoon標準の黒帯ナビを使い、ヘッダー内ナビは隠す */
@media (max-width: 960px){
  /* ヘッダー右側のPC用ナビを隠す */
  .nmj-header .nmj-navwrap.nmj-nav--pc{ display:none !important; }
  /* 旧：黒帯ナビを表示（Cocoonの初期どおり）＋ ガター適用 */
  #header-container-in > .navi{
    display:block !important;
    background:#000; /* テーマ既定の黒帯を維持したい場合だけ */
  }
  #header-container-in > .navi .navi-in{
    padding-left:  var(--page-gutter) !important;
    padding-right: var(--page-gutter) !important;
    box-sizing: border-box;
  }

  /* （もし nmj-nav--sp を出しているなら重複防止で隠す） */
  .nmj-nav--sp{ display:none !important; }
}

/* =========================
   1) ヘッダー固定（PC/SP共通）
   ========================= */
#header-container.nmj-header{
  position: sticky;      /* 常に上に張り付く */
  top: 0;
  z-index: 9999;
  background:#fff;
  box-shadow: 0 2px 14px rgba(15,23,42,.06);
}
.admin-bar #header-container.nmj-header{ top: 32px; } /* WP管理バー対策 */

/* =========================================
   3) CTA（右端メニュー）を少し大きく
   ========================================= */
#header-container .nmj-navwrap .navi-in > ul > li:last-child > a{
  padding: .75rem 1.25rem !important;   /* ← サイズUP */
  font-size: 15px;
  border-radius: 9999px;
  background: linear-gradient(135deg,#FF7A1A,#FFCC00);
  color:#fff !important;
  box-shadow: 0 6px 18px rgba(255,122,26,.25);
}
#header-container .nmj-navwrap .navi-in > ul > li:last-child > a:hover{
  filter: brightness(.96);
  transform: translateY(-1px);
}

/* テーマ既定を尊重。必要ならフルワイド時だけ調整 */
body.no-sidebar:root,
body.wide:root,
body.full-wide:root{
  /* 例：ガターを少し広げたい時だけ */
  --page-gutter: 16px;
}

/* === フルワイド（サイドバー無し）のページだけ全幅化 === */
body.no-sidebar,
body.wide,
body.full-wide {
  /* Tailwind container の最大幅を解除（本文のみ） */
  /* 既存 HTML では .content-scope を本文ラッパに使っているためそこに限定 */
}
body.no-sidebar .content-scope,
body.wide .content-scope,
body.full-wide .content-scope {
  width:100% !important;
  max-width:none !important;
}

/* パディングの上書きも “フルワイドページの本文ラッパ内” だけ */
body.no-sidebar .content-scope .px-4,
body.wide .content-scope .px-4,
body.full-wide .content-scope .px-4{
  padding-left:var(--page-gutter) !important;
  padding-right:var(--page-gutter) !important;
}
@media (min-width:640px){
  body.no-sidebar .content-scope .sm\:px-6,
  body.wide .content-scope .sm\:px-6,
  body.full-wide .content-scope .sm\:px-6{
    padding-left:var(--page-gutter) !important;
    padding-right:var(--page-gutter) !important;
  }
}
@media (min-width:1024px){
  body.no-sidebar .content-scope .lg\:px-8,
  body.wide .content-scope .lg\:px-8,
  body.full-wide .content-scope .lg\:px-8{
    padding-left:var(--page-gutter) !important;
    padding-right:var(--page-gutter) !important;
  }
}

/* ★重要：グローバルな main / .entry-content などの幅100% は削除
   （Cocoon の2カラム計算を壊すため） */
/* フルワイド系ページだけヒーローを全幅ブリード */
body.no-sidebar #hero,
body.wide #hero,
body.full-wide #hero{
  /* ビュー幅に“はみ出して”描画する定番テク */
  margin-left:  calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}


/* 4) 以前の“ヘッダーは余白0に戻す”処理を撤回し、ガター適用に変更 */
.nmj-header .header-in.wrap{
  padding-left:  var(--page-gutter) !important;
  padding-right: var(--page-gutter) !important;
}
.nmj-header .px-4,
.nmj-header .sm\:px-6,
.nmj-header .lg\:px-8{
  padding-left:  var(--page-gutter) !important;
  padding-right: var(--page-gutter) !important; /* ← タイポ修正（!important） */
}

/* ==============================
   A) ヒーロー内のCTA（TOPだけ）
   ============================== */
#hero .btn-cta{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#fff;
  border:0;
  box-shadow:0 6px 16px rgba(var(--nmj-sec-rgb,192,50,59),.18);
}
#hero .btn-cta:hover{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  filter:brightness(.96);
}
#hero .btn-cta:focus{
  outline:0;
  box-shadow:0 0 0 4px rgba(var(--nmj-sec-rgb,192,50,59),.18);
}
#hero .btn-ghost{
  /* 準CTA：結果を見る（白ゴースト） */
  color:#fff;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.35);
  backdrop-filter:saturate(180%) blur(8px);
}
#hero .btn-ghost:hover{ background:rgba(255,255,255,.25); }

/* ==============================
   B) シミュ画面（/simulation 等）
   ここから下は #nmj-sim-v8 配下のみ
   ============================== */
#nmj-sim-v8 .btn-primary,
#nmj-sim-v8 .btn-cta{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#fff;
  border:0;
  box-shadow:0 6px 16px rgba(var(--nmj-sec-rgb,192,50,59),.18);
}
#nmj-sim-v8 .btn-primary:hover,
#nmj-sim-v8 .btn-cta:hover{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  filter:brightness(.96);
}
#nmj-sim-v8 .btn-primary:focus,
#nmj-sim-v8 .btn-cta:focus{
  outline:0;
  box-shadow:0 0 0 4px rgba(var(--nmj-sec-rgb,192,50,59),.18);
}
#nmj-sim-v8 .btn-ghost{
  color:#fff;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.35);
  backdrop-filter:saturate(180%) blur(8px);
}
#nmj-sim-v8 .btn-ghost:hover{ background:rgba(255,255,255,.25); }

/* モードチップ（通常＝ニュートラル、選択時＝淡いスカイ） */
#nmj-sim-v8 .mode-chip{
  background:#FFF;
  border:1px solid #E5E7EB; /* slate-200 */
  color:#0F172A;            /* slate-900 */
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:10px; font-weight:800; cursor:pointer;
  box-shadow:0 8px 24px rgba(15,23,42,.08);
}
#nmj-sim-v8 .mode-chip svg{
  color:currentColor;
  fill:currentColor;
}
#nmj-sim-v8 .mode-chip.active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#fff;
  border-color:var(--nmj-btn1);
}

/* 結果カード内の小ボタン（役割分担で配色） */
#nmj-sim-v8 .actions .btn{
  padding:10px 12px; border-radius:10px; font-weight:800;
  transition:filter .15s ease, transform .05s ease;
}
#nmj-sim-v8 .actions .btn:hover{ filter:brightness(.98) }
#nmj-sim-v8 .btn-article{
  background:#EEF2FF; color:#3730A3; border:1px solid #C7D2FE;
}
#nmj-sim-v8 .btn-official{
  background:#ECFEFF; color:#155E75; border:1px solid #A5F3FC;
}
#nmj-sim-v8 .btn-line{
  background:#DCFCE7; color:#166534; border:1px solid #BBF7D0;
}
#nmj-sim-v8 .btn-campaign{
  background:#FFF7ED; color:#9A3412; border:1px solid #FED7AA;
}


/* ================================
   TOPページ（home/front-page）を全幅化
   ※このブロックは必ず一番最後に貼る
   ================================ */

/* 1) TOPだけ “各種ラッパー” の最大幅を解除して 100% に */
body.home,
body.front-page{
  overflow-x: hidden; /* 横スクロール防止 */
}

body.home .wrap,
body.front-page .wrap,
body.home .content-in.wrap,
body.front-page .content-in.wrap,
body.home .header-in.wrap,
body.front-page .header-in.wrap,
body.home .footer-in.wrap,
body.front-page .footer-in.wrap,
body.home .container,
body.front-page .container,
body.home #container,
body.front-page #container,
body.home #main,
body.front-page #main,
body.home .content,
body.front-page .content,
body.home .main,
body.front-page .main,
body.home .l-container,
body.front-page .l-container,
body.home .entry-content,
body.front-page .entry-content,
body.home .article,
body.front-page .article,
body.home .article-body{
  max-width: none !important;
  width: 100% !important;
}

/* 2) “全幅 + 最低限の左右ガター” を TOP だけで付与
   - セクション側に .content-scope が付く想定（あなたのマークアップに合わせてあります）
   - 本当に端までゼロ余白にしたい場合は padding を 0 にしてください */
:root{ --top-gutter: max(12px, env(safe-area-inset-left)); }
body.home  .content-scope,
body.front-page .content-scope{
  padding-left:  var(--top-gutter) !important;
  padding-right: var(--top-gutter) !important;
}

/* 3) .wrap に入っている既定パディングを一旦ゼロに（必要な余白は .content-scope で管理） */
body.home .wrap,
body.front-page .wrap{
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

/* 4) ヒーローなど “背景を完全に画面端まで” 見せたい要素にフルブリード
   - #hero や .full-bleed を使うブロックはこの指定で全面表示 */
body.home  #hero,
body.front-page #hero,
body.home  .full-bleed,
body.front-page .full-bleed{
  margin-left:  calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
}

/* 5) 横向き時のセーフエリアも考慮しておく（iOSノッチ対策） */
@media (orientation: landscape){
  body.home  .content-scope,
  body.front-page .content-scope{
    padding-left:  max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }
}

/* 6) 既存の「グローバルで1180pxに揃える」指定を TOP だけ確実に打ち消す保険 */
body.home  .wrap,
body.front-page .wrap,
body.home  .container,
body.front-page .container{
  max-width: none !important;
}

/* すべてのページ：フッターは横いっぱいに表示する */
.footer-in.wrap{
  max-width: none !important;   /* 幅制限を解除 */
  width: 100% !important;       /* 画面幅いっぱい */
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;   /* 必要なら var(--page-gutter) に変更 */
  padding-right: 0 !important;
  box-sizing: border-box !important;
}
/* =========================================
   共通ページネーション（中央寄せ）
   ========================================= */

/* コンテナ（div.nav-links / ul.page-numbers 両対応） */
.nav-links,
.pagination,
ul.page-numbers{
  display:flex !important;
  flex-wrap:wrap;
  justify-content:center;  /* 中央寄せ */
  align-items:center;
  gap:8px;
  width:100%;              /* コンテナを行いっぱいに */
  margin:24px auto;        /* 上下余白＋左右中央 */
  padding-left:0;
  text-align:center;
}


/* ul 形式のときの li をリセット */
ul.page-numbers > li{
  list-style:none;
}

/* 個々のリンク「1 / 2 / 3 / … / 次へ」 */
.nav-links .page-numbers,
ul.page-numbers > li > .page-numbers{
  float:none !important;                 /* テーマの float を無効化 */
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:40px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#ffffff;
  color:#334155;
  font-weight:700;
  text-decoration:none;
  line-height:1;
  box-shadow:0 4px 10px rgba(15,23,42,.06);
  transition:.15s ease;
}

/* 現在ページ */
.nav-links .page-numbers.current,
ul.page-numbers > li > .page-numbers.current{
  background:linear-gradient(135deg,var(--brand,#FF7A1A),var(--brand-2,#FFCC00));
  border-color:transparent;
  color:#fff;
}

/* ホバー（「…」以外） */
.nav-links .page-numbers:not(.dots):hover,
ul.page-numbers > li > .page-numbers:not(.dots):hover{
  border-color:#ffb265;
  box-shadow:0 6px 16px rgba(255,122,26,.25);
  transform:translateY(-1px);
}

/* 「…」の見た目はシンプルに */
.nav-links .page-numbers.dots,
ul.page-numbers > li > .page-numbers.dots{
  min-width:auto;
  height:auto;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
}

.fixed-btn {
  position: fixed;     /* 画面に対して固定する */
  bottom: 50px;       /* 画面下からの距離 */
  right: 50px;        /* 画面右からの距離 */
  z-index: 99999;     /* 他の要素よりも最前面に */
  height: 80px;
  width: 80px;
  display: inline-block;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3); /* 影をつけて目立たせる */
  border-radius: 50%; /* 丸いボタン風 */
  text-align: center;
  line-height: 80px;
  cursor: pointer;
}

/* 他の要素が `z-index: 99999` 以上を持っている場合に強制的に前面にする */
.fixed-btn {
  position: fixed;
  bottom: 50px;
  right: 50px;
  z-index: 2147483647 !important; /* 最大値を設定して他の要素を超える */
}

/* メディアクエリ（スマホ版） */
@media screen and (max-width: 768px) {
  .fixed-btn {
    width: 80px;   /* SP版はさらに小さく */
    height: 80px;
    bottom: 15px;  /* 画面下の余白を減らす */
    right: 15px;
  }
}

/* PCだけヒーロー内の左右余白を広げる */
@media (min-width: 1024px){
  body.home #hero .content-scope,
  body.front-page #hero .content-scope{
    padding-left: 40px !important;   /* お好みで 32〜64px くらいに調整 */
    padding-right: 40px !important;
  }
}

/* ===================== ここから最新版CSS（そのまま） ===================== */
:root{
  --brand:#f97316;
  --brand-600:#ea580c;
  --pill-bg:#fff7ed;
  --pill-bd:#fdba74;
}

/* コンテナと余白 */
.nmj-wrap{padding-inline:1rem}

/* ボタン・ピル */
.brand-btn{
  display:inline-flex;align-items:center;gap:.5rem;border-radius:.75rem;
  background:var(--brand);color:#fff;padding:.5rem 1rem;font-weight:800;
  box-shadow:0 6px 18px rgba(249,115,22,.25);transition:.2s
}
.brand-btn:hover{background:var(--brand-600);transform:translateY(-1px)}
.brand-pill{
  display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--pill-bd);
  background:var(--pill-bg);color:#9a3412;border-radius:9999px;
  padding:.25rem .75rem;font-weight:700;font-size:.9rem;transition:.15s
}
.brand-pill:hover{filter:saturate(1.1)}

/* カード */
.card{
  border-radius:1rem;background:rgba(255,255,255,.92);
  box-shadow:0 2px 10px rgba(2,6,23,.06);border:1px solid rgba(2,6,23,.06)
}
.card-hover{transition:.2s}
.card-hover:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.10)}

/* サムネ */
.thumb{
  width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.75rem;
  background:linear-gradient(135deg,#fde68a,#fca5a5)
}

/* ヒーロー */
.hero{
  padding:0;
  background-image:
    radial-gradient(1200px 600px at 90% -10%, rgba(249,115,22,0.12), transparent 70%),
    radial-gradient(800px 400px at -10% 110%, rgba(249,115,22,0.08), transparent 60%);
}
.hero-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,.85)),
    var(--nmj-hero, url('https://images.unsplash.com/photo-1511707171634-5f897ff02aa9?q=80&w=1600&auto=format&fit=crop'));
  background-size:cover;background-position:center;
}

/* グリッド共通 */
.nmj-grid{margin-top:1.5rem}

/* 横スクロール */
.nmj-hscroll .snap-start{scroll-snap-align:start}
.nmj-hscroll .grid{scroll-snap-type:x mandatory}

/* トーンカード高さ */
.nmj-tone-card{height:100%}

/* Cocoonの余白と干渉しにくい微調整 */
.entry-content .brand-btn{line-height:1.25}
.entry-content .brand-pill{line-height:1.1}

/* 投稿カードの補助（行数制御） */
.line-clamp-2{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden
}

.pills{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{display:inline-block;border:1px solid #d1d5db;border-radius:9999px;padding:.4rem .75rem;background:#fff;cursor:pointer;user-select:none}
.pill.active{background:#2563eb;border-color:#2563eb;color:#fff}

/* ========== 乗り換え名人 共通トーン ========== */

/* ベース */
html,body{color:var(--text)}

/* ▼▼ 見出しのグローバル指定を削除し、7596ページ内の .nmj-wrap のみに限定 ▼▼ */
body.page-id-7596 .nmj-wrap .sec-title,
body.page-id-7596 .nmj-wrap .sec-h2,
body.page-id-7596 .nmj-wrap h2,
body.page-id-7596 .nmj-wrap h3{
  color:var(--ink);
  font-weight:800;
  letter-spacing:.02em;
}
/* ▲▲ ここまでスコープ化（.article h2/h3/h4/h5/h6 は不干渉） ▲▲ */

.sec-h2{position:relative;padding-bottom:.4rem}
.sec-h2:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-6px;
  width:84px;
  height:6px;
  border-radius:6px;
  background:linear-gradient(90deg,var(--nmj-primary),var(--nmj-secondary))
}

/* ボタン */
.brand-btn,.btn-cta,.nmj .btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff!important;
  padding:.7rem 1.05rem;border-radius:9999px;font-weight:800;box-shadow:var(--shadow-sm);
}

.brand-btn .nmj-btn-icon{
  color:var(--nmj-secondary) !important;
}
.brand-btn:hover,.btn-cta:hover{filter:brightness(.96);transform:translateY(-1px);transition:all .2s ease}
.brand-pill{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#fff;border:1px solid var(--ring);color:var(--ink);padding:.45rem .7rem;border-radius:9999px;font-weight:800;
}
.brand-pill:hover{box-shadow:inset 0 0 0 2px rgba(245,158,11,.15);border-color:#fcd34d}

/* カード */
.card{background:var(--card);border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-sm)}
.card-hover{transition:transform .12s ease, box-shadow .2s ease}
.card-hover:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
.card .thumb{width:100%;height:auto;display:block}

/* ======= TOP：GBごとの最安 ======= */
.gb-grid{display:grid;gap:16px}
@media(min-width:768px){.gb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.gb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.gb-card{border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-sm);overflow:hidden;background:#fff}
.gb-head{display:flex;align-items:center;justify-content:space-between;padding:.6rem .9rem;background:linear-gradient(90deg,var(--brand),#ffb265);color:#111}
.gb-head .tag{background:rgba(255,255,255,.9);padding:.25rem .6rem;border-radius:.6rem;font-weight:800;font-size:.8rem}
.gb-body{padding:1rem}
.gb-line{display:flex;align-items:center;gap:.5rem;color:#334155}
.gb-price{font-size:1.6rem;font-weight:900;color:#ef4444;line-height:1}
.gb-cta{display:flex;gap:.5rem;margin-top:.75rem}
.gb-cta a{flex:1;text-align:center;padding:.55rem .8rem;border-radius:.6rem;font-weight:800}
.gb-cta .primary{background:var(--brand);color:#fff}
.gb-cta .outline{border:2px solid var(--brand);color:var(--brand);background:#fff}
.badge-pill{background:#f1f5f9;padding:.25rem .6rem;border-radius:9999px;font-weight:700;font-size:.8rem}
.card-opt{
  display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .8rem;border-radius:.9rem;border:2px solid var(--ring);background:#fff;font-weight:700
}
.card-opt.is-active{border-color:var(--brand);box-shadow:0 0 0 3px rgba(245,158,11,.15) inset}

/* ======= シミュレーション（[nmj_sim]） ======= */
.section{padding:56px 0}
.sim-card{background:#fff;border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-md);padding:18px}
.sim-group-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.sim-group-tabs .tab{
  padding:8px 12px;border-radius:999px;border:1px solid var(--ring);background:#fff;color:#0f172a;cursor:pointer;font-weight:800
}
.sim-group-tabs .tab.active{background:#0ea5e9;color:#fff;border-color:transparent}
.sim-grid{display:grid;grid-template-columns:1fr;gap:16px}
.q-block{background:#f8fafc;border-radius:12px;padding:14px;border:1px solid var(--ring)}
.q-title{font-weight:800;margin-bottom:10px;color:#0f172a;display:flex;align-items:center;gap:8px}
.q-title .num{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:999px;background:#0f172a;color:#fff;font-size:12px}
.pills{display:flex;flex-wrap:wrap;gap:10px}
.pill{padding:10px 14px;border-radius:10px;border:1px solid #dce3eb;background:#fff;color:#0f172a;cursor:pointer;font-weight:800}
.pill.active{background:var(--brand);color:#111;border-color:transparent}
.form-actions{display:flex;gap:12px;align-items:center;margin-top:6px}
.btn-search{background:var(--brand);color:#111}
.btn-reset{background:#e2e8f0;color:#111}

/* ======= 診断結果カード ======= */
.result-toolbar{display:flex;align-items:center;justify-content:space-between;margin:16px 0 8px}
.sort-tabs{display:flex;gap:8px;flex-wrap:wrap}
.sort-tabs .tab{padding:8px 12px;border-radius:999px;border:1px solid var(--ring);background:#fff;color:#0f172a;cursor:pointer;font-weight:800}
.sort-tabs .tab.active{background:#0ea5e9;color:#fff;border-color:transparent}
.match-msg{margin:10px 0 18px;padding:10px 14px;border:1px dashed #94a3b8;border-radius:10px;background:#fff;font-weight:800}
.result-list{display:grid;gap:16px}

.result-list .card .head{padding:16px 16px 8px}
.top-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:42px;border-radius:8px;object-fit:cover;border:1px solid var(--ring)}
.brand .name{font-weight:900;font-size:20px}
.pill-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f1f5ff;color:#1f2a44;border:1px solid #dbe5ff;font-weight:800}
.pill-chip .dot{width:6px;height:6px;border-radius:999px;background:#a3bffa}
.stat-chips{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-top:6px}
.stat{display:flex;align-items:center;gap:8px;border:1px dashed var(--ring);padding:10px 12px;border-radius:12px;background:#fff}
.stat .label{color:#64748b;font-weight:700;font-size:12px}
.stat .value{font-weight:900}
.stat .value.highlight{color:#ef4444}
.actions{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px;border-top:1px dashed var(--ring);border-bottom:1px dashed var(--ring);background:#fcfcfd}
.actions .btn{padding:10px 12px;border-radius:10px;font-weight:800}

/* ======= 共通横スクロール（キャンペーン） ======= */
.nmj-hscroll{overflow:hidden}
.nmj-hscroll .grid{scroll-snap-type:x mandatory}
.nmj-hscroll .card{scroll-snap-align:start}

/* ======= その他（HowTo など） ======= */
.nmj-tone-card .font-bold{color:var(--ink)}

/* ========== Base / Tone ========== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600;700;900&display=swap');


html,body{ font-family:'Noto Sans JP',system-ui,-apple-system,Segoe UI,Roboto,'Hiragino Kaku Gothic ProN','Hiragino Sans',Meiryo,sans-serif !important; color:var(--text); }
.container{ max-width:1180px; }

/* ▼▼ Headings（グローバル）を page-id-7596 の .nmj-wrap に限定 ▼▼ */
body.page-id-7596 .nmj-wrap h1,
body.page-id-7596 .nmj-wrap h2,
body.page-id-7596 .nmj-wrap h3,
body.page-id-7596 .nmj-wrap .sec-h2,
body.page-id-7596 .nmj-wrap .section-title{
  color:var(--text-strong);
  font-weight:800 !important;
  letter-spacing:.02em;
}
/* ▲▲ ここまでスコープ化（.article h4/h5/h6 は不干渉） ▲▲ */

/* Accent underline for section titles */
.sec-h2{ position:relative; padding-bottom:.4rem; }
.sec-h2:after{
  content:""; position:absolute; left:0; bottom:-6px; width:72px; height:6px; border-radius:6px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));
}

/* Buttons */
.btn-cta,.btn,.button,a.button,.cta-button,.cta,.more-btn{
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--cta-grad);
  color:#fff !important; border:none; border-radius:9999px; padding:.78rem 1.15rem; font-weight:800; text-decoration:none;
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden; transition:all .2s ease;
}
.btn-cta:hover,.btn:hover,.button:hover,a.button:hover,.cta:hover{ filter:brightness(.96); transform:translateY(-1px); }

/* Cards */
.card,.result-card,.plan-card,.faq-item,.brand-card,.gb-card,.yt-card,.article-card{
  background:var(--surface); border:1px solid var(--ring); border-radius:16px; box-shadow:var(--shadow-sm);
}
.card-hover:hover{ box-shadow:var(--shadow-md); transform:translateY(-1px); transition:all .15s ease; }

.card-opt{
  display:inline-flex; align-items:center; gap:.5rem; padding:.55rem .8rem;
  border-radius:.9rem; border:2px solid var(--ring); background:#fff; font-weight:700;
}
.card-opt.is-active{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(245,158,11,.15) inset; }

/* Chips & badges */
.q-chip,.badge,.pill,.tag{
  display:inline-flex; align-items:center; gap:.35rem; padding:.28rem .6rem;
  border-radius:999px; font-weight:700;
  color:var(--brand); background:rgba(245,158,11,.10); border:1px solid rgba(245,158,11,.20);
}

/* Dots divider */
.dot{ border-top:2px dotted #cbd5e1; opacity:.9; }

/* ===== Campaign slider ===== */
.camp-track{ display:flex; gap:16px; transition:transform .6s ease; }
.camp-card{ flex:0 0 calc(33.333% - 11px); }
@media (max-width:1024px){ .camp-card{ flex-basis: calc(50% - 8px);} }
@media (max-width:640px){ .camp-card{ flex-basis: 100%; } }

/* ===== GB cards ===== */
.gb-grid{ display:grid; grid-template-columns:repeat(1,minmax(0,1fr)); gap:16px; }
@media(min-width:768px){ .gb-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1024px){ .gb-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.gb-card{ border:1px solid var(--ring); border-radius:1rem; overflow:hidden; background:#fff; box-shadow:0 8px 20px rgba(15,23,42,.05); }
.gb-head{ display:flex; align-items:center; justify-content:space-between; padding:.6rem .9rem; background:linear-gradient(90deg,var(--brand),#ffb265); color:#111; }
.gb-head .tag{ background:rgba(255,255,255,.85); padding:.25rem .6rem; border-radius:.6rem; font-weight:800; font-size:.8rem; }
.gb-body{ padding:1rem; }
.gb-line{ display:flex; align-items:center; gap:.5rem; margin:.35rem 0; color:#334155; }
.gb-price{ font-size:1.6rem; font-weight:900; color:#ef4444; line-height:1; }
.gb-meta{ display:flex; gap:1rem; color:#475569; font-size:.9rem; }
.gb-cta{ display:flex; gap:.5rem; margin-top:.75rem; }
.gb-cta a{ flex:1; text-align:center; padding:.55rem .8rem; border-radius:.6rem; font-weight:800; }
.gb-cta .primary{ background:var(--brand); color:#fff; }
.gb-cta .outline{ border:2px solid var(--brand); color:var(--brand); background:#fff; }
.badge-pill{ background:#f1f5f9; padding:.25rem .6rem; border-radius:999px; font-weight:700; font-size:.8rem; }

/* ===== FAQ ===== */
.faq details{ border:1px solid var(--ring); border-radius:1rem; padding:1rem; background:#fff; }
.faq summary{ cursor:pointer; font-weight:800; list-style:none; display:flex; justify-content:space-between; align-items:center; }

/* Minor utils */
.link-row a{ color:var(--brand); font-weight:700; text-decoration:none; }
.link-row a:hover{ text-decoration:underline; }

/* ===== Simulation v8 inspired ===== */
.nmj-sim-hero{
  position:relative; background:#0b132a; color:#fff; padding:56px 0; isolation:isolate;
}
.nmj-sim-hero::before{
  content:""; position:absolute; inset:0;
  background: url('https://images.unsplash.com/photo-1511707171634-5f897ff02aa9?q=80&w=1600&auto=format&fit=crop') center/cover no-repeat;
  opacity:.18;
}
.nmj-sim-hero .inner{position:relative; z-index:1; max-width:1200px; margin:auto; padding:0 16px}
.nmj-sim-hero .badge{display:inline-flex;align-items:center;font-weight:800;background:#fff;color:#111;padding:8px 12px;border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.1)}
.nmj-sim-hero h1{margin:.5rem 0;font-size:clamp(28px,4vw,52px);font-weight:900;line-height:1.15}
.nmj-sim-hero p{color:#e2e8f0}
.select-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.mode-chip{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#0f172a;border:1px solid #e2e8f0;padding:10px 14px;border-radius:12px;font-weight:800;cursor:pointer;box-shadow:0 6px 16px rgba(15, 23, 42, .08)}
.mode-chip.active,
.mode-chip.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#ffffff;
  border-color:var(--nmj-btn1);
}

.nmj-sim-monthly{max-width:1200px;margin: -20px auto 0; padding:0 16px}
.nmj-sim-monthly .title-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.nmj-sim-monthly .pr{background:#dcfce7;color:#14532d;font-weight:800;border-radius:999px;padding:4px 10px}

.nmj-sim-results{max-width:1200px;margin:24px auto;padding:0 16px}
.nmj-sim-results .toolbar{display:flex;justify-content:flex-end}
.nmj-sim-results .tabs{display:flex;gap:8px}
.nmj-sim-results .tab{padding:8px 12px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;font-weight:800}
.nmj-sim-results .tab.is-active{background:#0ea5e9;color:#fff;border-color:transparent}
.nmj-sim-results .match{margin:12px 0;padding:10px 14px;border:1px dashed #94a3b8;border-radius:10px;background:#fff;font-weight:800}
.nmj-sim-results .list{display:grid;gap:16px}

/* result card */
.sim-card-v8{background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 8px 24px rgba(15,23,42,.08);overflow:hidden}
.sim-card-v8 .head{padding:16px 16px 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sim-card-v8 .brand{display:flex;align-items:center;gap:12px}
.sim-card-v8 .brand img{height:42px;border-radius:8px;object-fit:cover;border:1px solid #e5e7eb}
.sim-card-v8 .brand .name{font-weight:900;font-size:20px}
.sim-card-v8 .net-pill{margin-left:auto;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#1f2a44;border:1px solid #dbe5ff;font-weight:800}

.sim-card-v8 .stats{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin:6px 16px 0}
.sim-card-v8 .st{display:flex;align-items:center;gap:8px;border:1px dashed #e5e7eb;padding:10px 12px;border-radius:12px;background:#fff}
.sim-card-v8 .st .lb{color:#64748b;font-weight:700;font-size:12px}
.sim-card-v8 .st .vl{font-weight:900;color:#e11d48}

.sim-card-v8 .tags{display:flex;gap:8px;flex-wrap:wrap;margin:10px 16px 0}
.sim-card-v8 .tag{padding:6px 10px;border-radius:999px;background:#f8fafc;border:1px dashed #d1d5db;color:#334155;font-weight:800}

.sim-card-v8 .actions{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px;border-top:1px dashed #e5e7eb;border-bottom:1px dashed #e5e7eb;background:#fcfcfd}
.sim-card-v8 .btn-article{background:#eef2ff;color:#3730a3;padding:10px 12px;border-radius:10px;font-weight:800}
.sim-card-v8 .btn-official{background:#ecfeff;color:#155e75;padding:10px 12px;border-radius:10px;font-weight:800}
.sim-card-v8 .btn-detail{background:#fff;color:#111;border:1px solid #e2e8f0;padding:10px 12px;border-radius:10px;font-weight:800}

.sim-card-v8 .detail{padding:14px 16px 0}
.spec-table{width:100%;border-collapse:collapse;background:#fff}
.spec-table th,.spec-table td{border:1px solid #eee;padding:10px 12px;text-align:left}
.spec-table th{width:240px;background:#fafafa;color:#333;font-weight:700}

.campaign-bar{background:linear-gradient(90deg,#fff7ed,#ffe7c2);padding:10px 16px;border-top:1px dashed #fdba74;display:flex;justify-content:space-between;align-items:center}
.campaign-bar .right{font-size:12px;color:#92400e}

/* recommended (PR) banner inserted between results */
.reco-banner{border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.08);border:1px solid #e5e7eb}
.reco-banner .reco-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e5e7eb;font-weight:800}
.reco-banner .reco-head .pr{color:#0b8dc6;font-weight:800}
.reco-body{display:grid;grid-template-columns:1fr auto auto auto 160px;gap:12px;align-items:center;padding:16px}
.reco-body .logo{display:flex;align-items:center;gap:12px}
.reco-body .logo img{width:56px;height:56px;border-radius:12px;border:1px solid #e5e7eb}
.reco-body .ttl{font-weight:900}
.reco-body .badge{display:inline-block;background:#e6fffb;color:#0b8dc6;padding:4px 8px;border-radius:999px;font-weight:800}
.reco-body .label{color:#64748b;font-weight:700;font-size:12px}
.reco-body .value{font-weight:900}
.reco-body .btn-cta{
  display:inline-block;
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#fff;
  padding:10px 14px;
  border-radius:12px;
  font-weight:900;
}
.reco-foot{background:linear-gradient(90deg,#ffedd5,#ffd6a5);display:flex;align-items:center;gap:12px;padding:10px 16px;border-top:1px dashed #f59e0b}
.reco-foot .big{font-size:18px;font-weight:900;color:#ef4444}
.reco-foot .exp{margin-left:auto;font-weight:800}

@media (max-width:900px){
  .sim-card-v8 .stats{grid-template-columns:repeat(2,minmax(120px,1fr))}
  .reco-body{grid-template-columns:1fr 1fr;grid-auto-rows:minmax(32px,auto)}
  .reco-body .reco-cta{grid-column:1/-1}
}
/* ===== 最新版TOPトーン同期 ===== */
.container{ max-width:1180px; }
.sec-h2{ position:relative; font-weight:800 }
.sec-h2:after{
  content:""; position:absolute; left:0; bottom:-6px; width:120px; height:6px;
  background:linear-gradient(90deg,var(--brand),#ffb265);
}
.btn-cta{
  display:inline-flex; align-items:center; gap:.5rem;
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));
  color:#fff; border-radius:9999px;
  padding:.7rem 1.1rem; font-weight:800;
}
.btn-cta:hover{ filter:brightness(.95) }
.card{ border:1px solid var(--ring); border-radius:1rem; background:#fff; overflow:hidden; box-shadow:0 6px 18px rgba(15,23,42,.06) }

/* ===== シミュ：タブ／質問／結果 ===== */
.sim-tabbar{ display:flex; gap:.5rem; flex-wrap:wrap }
.sim-tab{
  border:1px solid var(--ring); background:#fff; border-radius:999px; padding:.5rem 1rem;
  font-weight:800; color:#334155;
}
.sim-tab.is-active{ outline:3px solid rgba(255,122,26,.15); border-color:var(--brand); }
.card-opt{ display:inline-flex; align-items:center; gap:.5rem; padding:.55rem .8rem; border-radius:.9rem; border:2px solid var(--ring); background:#fff; font-weight:700 }
.card-opt.is-active{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(255,122,26,.15) inset }
.more-btn{
  display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1.1rem;
  background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; border-radius:9999px; font-weight:800
}

/* 会社カードの共通サムネ */
.thumb{ aspect-ratio:16/9; object-fit:cover; width:100%; border-radius:.75rem; }

/* === CTA ボタン === */
#runDiag.btn-cta,
.home #runDiag.btn-cta,
.front-page #runDiag.btn-cta{
  background:var(--cta-grad) !important;
  background-image:var(--cta-grad) !important;
  color:#fff !important;
  border-color:var(--nmj-btn1, var(--brand)) !important;
  box-shadow:0 6px 18px rgba(var(--nmj-base-rgb, 249,115,22), .25) !important;
}
#runDiag.btn-cta:hover,
.home #runDiag.btn-cta:hover,
.front-page #runDiag.btn-cta:hover{
  filter:brightness(.96);
  background:var(--cta-grad) !important;
  background-image:var(--cta-grad) !important;
}

/* === クリック可能なオプション === */
.card-opt{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.5rem .75rem;border:1px solid #e5e7eb;border-radius:12px;
  background:#fff;cursor:pointer;user-select:none
}
.card-opt.is-active{border-color:#f97316;background:#fff7ed}

/* === 会社検索ツールバー === */
.nmj-company-toolbar{margin-top:.5rem}
.nmj-searchbar{
  display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:.4rem .8rem;min-width:260px
}
.nmj-searchbar i{color:#94a3b8}
.nmj-search-input{border:none;outline:none;background:transparent;width:220px}
.nmj-count{font-weight:700;background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:.35rem .6rem}

/* 結果カード */
.nmj-result-card{border:1px solid #e5e7eb;border-radius:16px;background:#fff}

.entry-content > h1:first-of-type{ display:none !important; }

/* companies_最新 風 */
.nmj-grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); }
.post-card, .company-card, .card { border:1px solid #e2e8f0; border-radius:12px; background:#fff; overflow:hidden; }
.post-card .thumb, .company-card .thumb { width:100%; aspect-ratio:16/9; object-fit:cover; }
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;border:1px solid #e5e7eb;border-radius:9999px;background:#fff}

/* 最新ショート：縦動画カード */
#social-latest .card .aspect-\[9\/16\] iframe{ border:0; border-radius:12px; }

/* 会社検索の見た目（モック準拠） */
.brand-pill select { background: transparent; border: 0; }
#companies .thumb{ aspect-ratio:16/10; object-fit:cover; border-radius:.75rem; }

/* ▼▼ ページネーション横並び：7596ページ限定 ▼▼ */
body.page-id-7596 .page-numbers{
  display:inline-flex; align-items:center; justify-content:center; padding:.4rem .7rem; margin:.15rem; border-radius:.6rem; background:#fff;
}
body.page-id-7596 .page-numbers.current{
  background:linear-gradient(90deg,#f59e0b,#f97316); color:#fff; border-color:transparent;
}
/* ▲▲ ほかのページはテーマ準拠のまま ▲▲ */

/* ================================
   Quick Patch for Cocoon（7596ページのみ）
   1) 横幅フル化（特に横画面）
   2) .page-numbers を横並び（UL/直列 両対応）
   ================================ */

/* 1) 横幅フル化（7596ページのみ） */
body.page-id-7596{
  max-width:100%;
  overflow-x:hidden;
}
body.page-id-7596 .wrap,
body.page-id-7596 .container,
body.page-id-7596 #container,
body.page-id-7596 #main,
body.page-id-7596 .content,
body.page-id-7596 .main,
body.page-id-7596 .l-container,
body.page-id-7596 .entry-content,
body.page-id-7596 .article,
body.page-id-7596 .article-body{
  max-width: none !important;
  width: 100% !important;
}

/* 横画面時は左右パディングを最小化（Safe Area 対応・7596ページのみ） */
@media (orientation: landscape){
  body.page-id-7596 .wrap,
  body.page-id-7596 .container,
  body.page-id-7596 #container,
  body.page-id-7596 #main,
  body.page-id-7596 .content,
  body.page-id-7596 .main,
  body.page-id-7596 .l-container{
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
}

/* 2) ページネーション（UL型）— 7596ページのみ */
body.page-id-7596 ul.page-numbers{
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: center;
  list-style: none;
  padding-left: 0;
  margin: 1rem 0;
}
body.page-id-7596 ul.page-numbers > li{ display: inline; }
body.page-id-7596 ul.page-numbers a,
body.page-id-7596 ul.page-numbers span{
  display: inline-flex;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  text-decoration: none;
  line-height: 1;
}
body.page-id-7596 ul.page-numbers .current{
  background: var(--brand, #0ea5e9);
  color: #fff;
  border-color: transparent;
}

/* 2) ページネーション（.nav-links直列型）— 7596ページのみ */
body.page-id-7596 .nav-links{
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: center;
  margin: 1rem 0;
}
body.page-id-7596 .nav-links > .page-numbers{
  display: inline-flex !important;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  line-height: 1;
  border-radius:8px;
}
body.page-id-7596 .nav-links > .page-numbers.current{
  background: var(--brand, #0ea5e9);
  color: #fff;
  border-color: transparent;
}

/* 念のため、テーマ側の縦積み指定を打ち消し（7596ページのみ） */
body.page-id-7596 .page-numbers,
body.page-id-7596 .nav-links > .page-numbers{
  float: none !important;
}

/* （オプション）他ページでグローバル上書きが残っていた場合の応急処置 */
@supports (all: revert){
  body:not(.page-id-7596) .page-numbers{ all: revert; }
  body:not(.page-id-7596) .nav-links > .page-numbers{ all: revert; }
}

/* ===================== ここまで最新版CSS（そのまま） ===================== */


/* =================================================================
   ▼▼ 7596ページ専用：Cocoonの見出し＆paginationを完全無効化して独自適用（修正版） ▼▼
   （このブロックは必ずファイルの一番最後に置いてください）
   ================================================================= */

/* 0) セレクタ修正ポイント：
      #post-7596 と .article が同一要素であるケースに対応 */
:root{} /* ダミー：上のコメント保持用 */
/* ===================== 7596ページ専用にスコープした差し替え版 ===================== */

/* 変数は :root ではなく対象ページの body に持たせる */
body.page-id-7596{
  --brand:#f97316;
  --brand-600:#ea580c;
  --pill-bg:#fff7ed;
  --pill-bd:#fdba74;

  --brand-2:#FFCC00;
  --ring:#E5E7EB;
  --cta-grad: linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600));

  --ink:#0f172a;
  --text:#334155;
  --muted:#64748b;
  --card:#ffffff;
  --soft:#f8fafc;
  --shadow-sm:0 6px 18px rgba(15,23,42,.06);
  --shadow-md:0 8px 24px rgba(15,23,42,.08);
}

/* コンテナと余白 */
body.page-id-7596 .nmj-wrap{padding-inline:1rem}

/* ボタン・ピル */
body.page-id-7596 .brand-btn{
  display:inline-flex;align-items:center;gap:.5rem;border-radius:.75rem;
  background:var(--brand);color:#fff;padding:.5rem 1rem;font-weight:800;
  box-shadow:0 6px 18px rgba(249,115,22,.25);transition:.2s
}
.brand-btn i,
.btn-cta i,
#runDiag i,
.brand-btn svg,
.btn-cta svg,
#runDiag svg{
  color:#ffffff !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}
body.page-id-7596 .brand-btn:hover{background:var(--brand-600);transform:translateY(-1px)}
body.page-id-7596 .brand-pill{
  display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--pill-bd);
  background:var(--pill-bg);color:#9a3412;border-radius:9999px;
  padding:.25rem .75rem;font-weight:700;font-size:.9rem;transition:.15s
}
body.page-id-7596 .brand-pill:hover{filter:saturate(1.1)}

/* カード */
body.page-id-7596 .card{
  border-radius:1rem;background:rgba(255,255,255,.92);
  box-shadow:0 2px 10px rgba(2,6,23,.06);border:1px solid rgba(2,6,23,.06)
}
body.page-id-7596 .card-hover{transition:.2s}
body.page-id-7596 .card-hover:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.10)}

/* サムネ */
body.page-id-7596 .thumb{
  width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.75rem;
  background:linear-gradient(135deg,#fde68a,#fca5a5)
}

/* ヒーロー */
body.page-id-7596 .hero{
  padding:0;
  background-image:
    radial-gradient(1200px 600px at 90% -10%, rgba(249,115,22,0.12), transparent 70%),
    radial-gradient(800px 400px at -10% 110%, rgba(249,115,22,0.08), transparent 60%);
}
body.page-id-7596 .hero-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,.85)),
    var(--nmj-hero, url('https://images.unsplash.com/photo-1511707171634-5f897ff02aa9?q=80&w=1600&auto=format&fit=crop'));
  background-size:cover;background-position:center;
}

/* グリッド共通 */
body.page-id-7596 .nmj-grid{margin-top:1.5rem}

/* 横スクロール */
body.page-id-7596 .nmj-hscroll .snap-start{scroll-snap-align:start}
body.page-id-7596 .nmj-hscroll .grid{scroll-snap-type:x mandatory}

/* トーンカード高さ */
body.page-id-7596 .nmj-tone-card{height:100%}

/* Cocoonの余白と干渉しにくい微調整 */
body.page-id-7596 .entry-content .brand-btn{line-height:1.25}
body.page-id-7596 .entry-content .brand-pill{line-height:1.1}

/* 投稿カードの補助（行数制御） */
body.page-id-7596 .line-clamp-2{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}

/* 汎用ピルUI */
body.page-id-7596 .pills{display:flex;flex-wrap:wrap;gap:.5rem}
body.page-id-7596 .pill{display:inline-block;border:1px solid #d1d5db;border-radius:9999px;padding:.4rem .75rem;background:#fff;cursor:pointer;user-select:none}
body.page-id-7596 .pill.active{background:#2563eb;border-color:#2563eb;color:#fff}

/* ========== 共通トーン（見出しは既に7596限定だったので維持） ========== */
body.page-id-7596 .nmj-wrap .sec-title,
body.page-id-7596 .nmj-wrap .sec-h2,
body.page-id-7596 .nmj-wrap h2,
body.page-id-7596 .nmj-wrap h3{
  color:var(--ink);font-weight:800;letter-spacing:.02em;
}
body.page-id-7596 .sec-h2{position:relative;padding-bottom:.4rem}
body.page-id-7596 .sec-h2:after{
  content:"";position:absolute;left:0;bottom:-6px;width:84px;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--brand),var(--brand-2))
}

/* Buttons（トーン統一もこのページだけに適用） */
body.page-id-7596 :is(.brand-btn,.btn-cta,.nmj .btn){
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--cta-grad);color:#fff!important;
  padding:.7rem 1.05rem;border-radius:9999px;font-weight:800;box-shadow:var(--shadow-sm);
}
body.page-id-7596 :is(.brand-btn:hover,.btn-cta:hover){filter:brightness(.96);transform:translateY(-1px);transition:all .2s ease}
body.page-id-7596 .brand-pill{
  display:inline-flex;align-items:center;gap:.4rem;background:#fff;border:1px solid var(--ring);color:var(--ink);
  padding:.45rem .7rem;border-radius:9999px;font-weight:800;
}
body.page-id-7596 .brand-pill:hover{box-shadow:inset 0 0 0 2px rgba(245,158,11,.15);border-color:#fcd34d}

/* カード（再定義） */
body.page-id-7596 .card{background:var(--card);border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-sm)}
body.page-id-7596 .card-hover{transition:transform .12s ease, box-shadow .2s ease}
body.page-id-7596 .card-hover:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
body.page-id-7596 .card .thumb{width:100%;height:auto;display:block}

/* ======= TOP：GBごとの最安（主要だけ抜粋・必要分をスコープ） ======= */
body.page-id-7596 .gb-grid{display:grid;gap:16px}
@media(min-width:768px){ body.page-id-7596 .gb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){ body.page-id-7596 .gb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
body.page-id-7596 .gb-card{border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-sm);overflow:hidden;background:#fff}

/* ======= シミュレーション／結果（見出し以外の主要部のみスコープ） ======= */
body.page-id-7596 .section{padding:56px 0}
body.page-id-7596 .sim-card{background:#fff;border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow-md);padding:18px}

/* ======= 横スクロール（キャンペーン） ======= */
body.page-id-7596 .nmj-hscroll{overflow:hidden}
body.page-id-7596 .nmj-hscroll .grid{scroll-snap-type:x mandatory}
body.page-id-7596 .nmj-hscroll .card{scroll-snap-align:start}

/* フォント/ベース（このページのみ） */
body.page-id-7596{ color:var(--text) }
body.page-id-7596 .container{ max-width:1180px }

/* 会社カード等のサムネ再指定 */
body.page-id-7596 .nmj-grid .company-card img.thumb,
body.page-id-7596 .nmj-grid .post-card img.thumb{ width:100%; aspect-ratio:16/10; object-fit:cover; display:block; }

/* ▼ ページネーション（すでに 7596 限定でOK。元のまま） */
body.page-id-7596 .page-numbers{ display:inline-flex; align-items:center; justify-content:center; padding:.4rem .7rem; margin:.15rem; border-radius:.6rem; background:#fff; }
body.page-id-7596 .page-numbers.current{ background:linear-gradient(90deg,#f59e0b,#f97316); color:#fff; border-color:transparent; }
/* …（以下、あなたの CSS 末尾にある 7596 専用の pagination/heading リセット群はそのまま） */

/* ▼ 記事本文の段落余白（このページだけ） */
body.page-id-7596 article .entry-content p{ margin:0 0 1.8em 0 !important; }
body.page-id-7596 article .entry-content p:last-child{ margin-bottom:0 !important; }
body.page-id-7596 article .entry-content li > p{ margin-bottom:.8em !important; }
body.page-id-7596 article .entry-content figcaption p{ margin-bottom:0 !important; }

/* ▼ TOP：おすすめ動画（右カード）補強もページ限定 */
body.page-id-7596 #social-latest .card img,
body.page-id-7596 #social-latest .card .thumb{ aspect-ratio:4/3 !important; object-fit:cover; }
body.page-id-7596 #social-latest .card .aspect-\[9\/16\] iframe{ border-radius:12px; }

/* ここより下は、元CSSで既に body.page-id-7596 が付与されているブロックは変更不要です */

/* =================================================================
   ▲▲ 7596ページ専用の完全上書きはここまで（必ずファイル末尾に配置） ▲▲
   ================================================================= */

/* ===========================================================
   Brand Unifier（特集/キャンペーンの色に全体を合わせる）
   このブロックは nmj.css の末尾に追加してください
   =========================================================== */

/* キーとなるブランドトークンを固定化（特集/キャンペーン基準） */

/* ========== CTA / ボタンのトーンを完全統一 ========== */
.brand-btn,
.btn-cta,
.btn,
.button,
a.button,
.cta-button,
.cta,
.more-btn{
  background: var(--cta-grad) !important;
  color:#fff !important;
  box-shadow:0 6px 18px rgba(255,122,26,.25) !important;
  border:none !important;
}
.brand-btn:hover,
.btn-cta:hover,
.btn:hover,
.button:hover,
a.button:hover,
.cta:hover,
.more-btn:hover{
  filter:brightness(.96);
  transform:translateY(-1px);
}

/* pill は白ベースのまま・枠線だけブランド寄りに */
.brand-pill{ border-color: #ffd09a !important; }
.brand-pill:hover{ box-shadow: inset 0 0 0 2px rgba(255,122,26,.15); border-color:#ffd09a !important; }

/* ========== 見出しのアクセントを統一（下線グラデ） ========== */
.sec-h2{ position:relative; font-weight:800 }
.sec-h2:after{
  content:""; position:absolute; left:0; bottom:-6px; height:6px; width:120px; border-radius:6px;
  background: var(--cta-grad);
}

/* ========== シミュレーション部の色味を統一 ========== */
/* タブのアクティブ色（従来の水色→ブランド） */
.sim-group-tabs .tab.active,
.sort-tabs .tab.active,
.nmj-sim-results .tab.is-active{
  color:#fff !important;
  border-color: transparent !important;
}
/* 質問チップ（.pill）アクティブ */
.pill.active{ color:#111 !important; border-color:transparent !important; }

/* ========== “TOPのおすすめ動画右カード” を少し大きく（既出の修正の補強） ========== */
#social-latest .card .aspect-\[9\/16\] iframe{ border-radius:12px; }
#social-latest .card img,
#social-latest .card .thumb{ aspect-ratio:4/3 !important; object-fit:cover; }

/* ========== “TOPの会社一覧を画像フル” の見た目を補強 ========== */
.nmj-grid .company-card img.thumb,
.nmj-grid .post-card img.thumb{ width:100%; aspect-ratio:16/10; object-fit:cover; display:block; }


/* ==== ヘッダーだけ左右ガター＋上下ゆとり（最小変更） ==== */
.nmj-header{
  position: sticky; top: 0; z-index: 999;
  background: rgba(255,255,255,.92);  /* 透明度は控えめに */
  backdrop-filter: saturate(120%) blur(6px);
}

/* ヘッダー中身の横幅＆余白だけを調整（本文側は触らない） */
#header-container .header-in{
  max-width: 1180px;         /* 中央寄せの最大幅 */
  margin-inline: auto;
  padding-inline: clamp(12px, 3vw, 24px); /* 左右のスペース */
  padding-block: 10px;       /* 上下のちょいゆとり */
  box-sizing: border-box;
}
/* === 1) 全ページ：背景は白 === */
html, body { background:#fff !important; }

//* ===========================
   参考ファイルと同じ横幅・左右余白
   （最大1180px、左右16px）
   =========================== */
:root{
  --page-max: 1180px;
  --page-gutter: 16px;              /* = .px-4 と同等 */
}

/* グローバルのラッパー幅を統一（ヘッダー/本文/フッター） */
.wrap,
.header-in.wrap,
.footer-in.wrap,
.content-in.wrap,
.sidebar-in.wrap,
#main .wrap,
.container,           /* Tailwindの .container 相当が混在してもOK */
.nmj-wrap {
  max-width: var(--page-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-right: var(--page-gutter) !important;
  box-sizing: content-box; /* 幅計算のズレ防止 */
}

/* Hero の2カラムだけ左右ガターを無効化して中央ズレを防ぐ */
#hero .content-scope > .wrap.grid.sm\:grid-cols-2.gap-8.items-start,
#hero .content-scope > .grid-cols-2.gap-8.items-start {
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* 以前の“フル幅にする”指定の打ち消し（7596ページ用の保険） */
body.page-id-7596 .wrap,
body.page-id-7596 .container,
body.page-id-7596 #container,
body.page-id-7596 #main,
body.page-id-7596 .content,
body.page-id-7596 .main,
body.page-id-7596 .l-container,
body.page-id-7596 .entry-content,
body.page-id-7596 .article,
body.page-id-7596 .article-body{
  max-width: var(--page-max) !important;
  width: auto !important;
  padding-left: var(--page-gutter) !important;
  padding-right: var(--page-gutter) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ヘッダーも同じ余白で固定（背景は白・少し透過のまま） */
.nmj-header{
  position: sticky; top: 0; z-index: 9999;
  background: rgba(255,255,255,.96);
  backdrop-filter: saturate(140%) blur(6px);
  border-bottom: 1px solid rgba(15,23,42,.06);
}
/* ヘッダーは白・固定のまま（既存があるならそのままでもOK） */
body.page-id-7596 .nmj-header{
  position: sticky; top: 0; z-index: 9999;
  background: #fff;                 /* 透明度は無し＝白 */
  border-bottom: 1px solid rgba(15,23,42,.06);
}

/* SPではpillを少しコンパクトに */
@media (max-width: 767.98px){
  #nmj-sim-v8 .pill{
    font-size: 13px;       /* 既定から-1〜-2px程度 */
    padding: 8px 10px;     /* 少しだけ詰める */
  }
}
/* --- SPでは .sim-card の装飾を無効化（背景/枠/影/丸み/余白） --- */
@media (max-width: 767.98px){
  #nmj-sim-v8 .sim-card,
  body.page-id-7596 .sim-card,
  .sim-card{
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
}

/* ===========================================================
   NMJ：Customizer Color Bridge（末尾追記）
   - PHPで出している --brand / --brand-2 / --cta-grad を使って
     固定色(#FF7A1A/#FFCC00)を強制上書き
   =========================================================== */

#header-container .nmj-navwrap .navi-in > ul > li:last-child > a,
.btn-cta,
.brand-btn,
.more-btn,
#hero .btn-cta,
#nmj-sim-v8 .btn-primary,
#nmj-sim-v8 .btn-cta{
  background: var(--cta-grad) !important;
  background-image: var(--cta-grad) !important;
  color:#fff !important;
  box-shadow:0 6px 18px rgba(var(--brand-r), var(--brand-g), var(--brand-b), .25) !important;
}

#header-container .nmj-navwrap .navi-in > ul > li:last-child > a:hover,
.btn-cta:hover,
.brand-btn:hover,
.more-btn:hover,
#hero .btn-cta:hover,
#nmj-sim-v8 .btn-primary:hover,
#nmj-sim-v8 .btn-cta:hover{
  filter:brightness(.96);
  transform:translateY(-1px);
}

/* 見出し下線（sec-h2）のグラデもブランド同期 */
.sec-h2:after{
  background: var(--cta-grad) !important;
}

/* 選択中ピル（青固定→ブランド） */
.pill.active,
#nmj-sim-v8 .pill.active{
  background: var(--brand) !important;
  border-color: transparent !important;
  color:#111 !important;
}

/* =========================
 * ヘッダー：ロゴ左 + メニュー同列（PCのみ）
 * 本体は #header-container
 * ========================= */
@media (min-width: 1024px){

  /* ロゴ(#header) と ナビ(#navi) の共通親を横並びに */
  #header-container-in{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:24px !important;
  }

  /* Cocoonの "ロゴ中央（縦積み）" を打ち消す */
  #header-container-in.hlt-center-logo #navi{
    margin-top:0 !important;
  }

  /* ロゴ側（左）を必要以上に幅100%にしない */
  #header{
    flex:0 0 auto !important;
    margin:0 !important;
  }
  #header-in.wrap{
    width:auto !important;
    max-width:none !important;
    padding:0 !important;
  }
  .logo-header{
    margin:0 !important;
  }

  /* ナビ側（右）を同じ行に */
  #navi{
    flex:1 1 auto !important;
    background:transparent !important;
    margin:0 !important;
  }
  #navi-in.wrap{
    width:auto !important;
    max-width:none !important;
    padding:0 !important;

    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
  }

  /* メニューULを横並びに */
  #navi .menu-header.menu-pc{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:12px !important;
    flex-wrap:wrap !important; /* 収まり切らない時は折り返し */
    margin:0 !important;
  }

  /* クリック範囲・見た目調整（任意） */
  #navi .menu-header.menu-pc > li > a{
    padding:10px 12px !important;
    white-space:nowrap !important;
  }

  /* ドロップダウンが崩れる場合の保険 */
  #navi .menu-header.menu-pc > li{ position:relative !important; }
  #navi .menu-header.menu-pc .sub-menu{ top:100% !important; }
}

/* ===========================================================
   FIX: グローバルメニューが表示されない件（最終パッチ）
   - SPでヘッダー本体を消さない
   - #navi / #navi-in が header内に来ても確実に表示
   =========================================================== */

/* SPでも header-in を消さない（ここが最重要） */
@media (max-width: 767.98px){
  #header-container .nmj-header-in{
    display:grid !important;
  }
}

/* 念のため “ナビ領域は必ず見える” */
#header-container #navi,
#header-container .navi{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

/* PC：ヘッダーメニューを横並びに */
@media (min-width: 961px){
  #header-container #navi-in,
  #header-container .navi-in{
    padding:0 !important;
    background:transparent !important;
  }
  #header-container ul.menu-header.menu-pc{
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:8px;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }
  #header-container ul.menu-header.menu-pc > li{ margin:0 !important; }
}

/* SP：モバイル用メニューがある場合はそれを出す（無いならPC用は隠す） */
@media (max-width: 960px){
  #header-container ul.menu-header.menu-pc{ display:none !important; }
  #header-container ul.menu-mobile{
    display:flex !important;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:6px;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    -webkit-overflow-scrolling:touch;
  }
}

/* =========================
   グローバルナビ：右端（最後のメニュー）をCTAボタン化
   ※このブロックは style.css の一番最後に追記
   ========================= */

/* PC（Cocoon標準グロナビ） */
#navi .menu-header.menu-pc > li:last-child > a,
#navi .navi-in > ul > li:last-child > a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:.72rem 1.2rem !important;
  border-radius:9999px !important;
  font-weight:800 !important;
  line-height:1.1 !important;

  background: var(--cta-grad) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 6px 18px rgba(255,122,26,.25) !important;
  text-decoration:none !important;
}

#navi .menu-header.menu-pc > li:last-child > a:hover,
#navi .navi-in > ul > li:last-child > a:hover{
  filter:brightness(.96);
  transform:translateY(-1px);
}

/* 右端CTAの手前に少し余白（詰まる時の保険） */
#navi .menu-header.menu-pc > li:last-child{
  margin-left:8px !important;
}

/* SP（もし横スクロールメニュー等がある場合の保険） */
@media (max-width: 960px){
  #navi .menu-mobile > li:last-child > a,
  #navi .menu-header.menu-sp > li:last-child > a{
    padding:.6rem 1rem !important;
    border-radius:9999px !important;
    background: var(--cta-grad) !important;
    color:#fff !important;
  }
}


/* =========================================================
   NMJ Color Unifier (Auto Patch)
   - 管理画面の色（--nmj-base / --nmj-btn1..4）を最優先で反映
   - 既存の直書きオレンジ/グラデを上書きして“オレンジ固定”を防止
   ※ファイル最下部に置くことで優先されます
   ========================================================= */
:root{
  --brand:      var(--nmj-base, #f97316);
  --brand-600:  var(--nmj-base600, #ea580c);
  --brand-2:    var(--nmj-btn1-600, #ffcc00);
  --ring:       var(--nmj-ring, #e5e7eb);
  --cta-grad:   linear-gradient(90deg, var(--nmj-btn1, var(--brand)), var(--nmj-btn1-600, var(--brand-2)));
  --cta2-grad:  linear-gradient(135deg, var(--nmj-btn2, #0ea5e9), var(--nmj-btn2-600, #0284c7));
  --line-grad:  linear-gradient(135deg, var(--nmj-btn3, #06C755), var(--nmj-btn3-600, #059C42));
  --sub-grad:   linear-gradient(135deg, var(--nmj-btn4, #64748b), var(--nmj-btn4-600, #475569));
}
/* Primary / CTA */
.brand-btn,
.btn-cta,
.more-btn,
.nmj .btn,
a.button,
.button,
.cta-button,
.cta{
  background: var(--cta-grad) !important;
  color:#fff !important;
  border:0 !important;
}

/* Secondary */
.btn-secondary,
.nmj-btn-secondary{
  background: var(--cta2-grad) !important;
  color:#fff !important;
  border:0 !important;
}

/* LINE / Accent */
.btn-line,
.nmj-btn-line,
.actions .btn-line{
  background: var(--line-grad) !important;
  color:#fff !important;
  border:0 !important;
}

/* Sub CTA / Gray */
.btn-sub,
.nmj-btn-sub,
.brand-btn-sub{
  background: var(--sub-grad) !important;
  color:#fff !important;
  border:0 !important;
}

/* Pills / active states */
.pill.active,
.card-opt.is-active,
.sim-tab.is-active{
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color:#fff !important;
}

/* Header CTA (最後のメニュー項目) */
#header-container .nmj-navwrap .navi-in > ul > li:last-child > a{
  background: var(--cta-grad) !important;
  color:#fff !important;
  box-shadow: 0 6px 18px rgba(var(--nmj-base-rgb, 249,115,22), .25) !important;
}

/* Underline gradients */
.sec-h2:after{
  background: linear-gradient(90deg, var(--brand), var(--brand-2)) !important;
}



/* ===== NMJ v92 fix: simulation page button/color stabilization ===== */
#nmj-sim-v8 .mode-chip,
#nmj-sim-v8 .pill,
#nmj-sim-v8 .card-opt,
#nmj-sim-v8 .btn-search,
#nmj-sim-v8 .btn-reset,
#nmj-sim-v8 .sort-tabs .tab{
  transition:none !important;
}
#nmj-sim-v8 .mode-chip.active,
#nmj-sim-v8 .mode-chip.is-active{
  background:var(--cta-grad) !important;
  background-image:var(--cta-grad) !important;
  color:#ffffff !important;
  border-color:var(--nmj-btn1, var(--brand)) !important;
  box-shadow:none !important;
}
#nmj-sim-v8 .pill.active,
#nmj-sim-v8 .pill.is-active,
#nmj-sim-v8 .card-opt.active,
#nmj-sim-v8 .card-opt.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  color:#ffffff !important;
  border-color:var(--nmj-btn1) !important;
  box-shadow:none !important;
}
#nmj-sim-v8 .btn-search,
#nmj-sim-v8 #runBtn,
#nmj-sim-v8 #runDiag{
  background:var(--cta-grad) !important;
  background-image:var(--cta-grad) !important;
  color:#ffffff !important;
  border-color:var(--nmj-btn1, var(--brand)) !important;
}
#nmj-sim-v8 .btn-reset,
#nmj-sim-v8 #resetBtn{
  background:#e2e8f0 !important;
  color:#111827 !important;
  border-color:#cbd5e1 !important;
}

/* TOPページだけで非表示にしたい場合 */
.home .entry-title,
.home .date-tags,
.home .nmj-sim-name {
  display: none !important;
}

/* ヘッダーロゴ */
.header-site-logo-image {
  width: 110px !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  display: block;
}

.logo-header .site-name-text {
  width: 110px !important;
  height: auto !important;
  display: inline-block;
}

.logo-header .site-name {
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.logo-header {
  display: flex;
  align-items: center;
}

/* スマホで少しだけ抑える */
@media (max-width: 767px) {
  .header-site-logo-image {
    width: 100px !important;
  }

  .logo-header .site-name-text {
    width: 100px !important;
  }
}

@media (max-width: 767px) {

  #header-in {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .logo-header {
    display: flex !important;
    justify-content: center !important;
    width: 100%;
  }

  .logo-header .site-name {
    display: flex !important;
    justify-content: center !important;
    width: 100%;
  }

  .logo-header .site-name-text {
    display: flex !important;
    justify-content: center !important;
    width: 100%;
  }

  .header-site-logo-image {
    margin: 0 auto;
  }
}

/* =========================================================
 * Phase 3 UI polish (safe overrides only)
 * =======================================================*/
:root{
  --nmj-ui-blue:#2563eb;
  --nmj-ui-blue-2:#1d4ed8;
  --nmj-ui-green:#16a34a;
  --nmj-ui-green-2:#15803d;
  --nmj-ui-sky:#0ea5e9;
  --nmj-ui-slate:#334155;
}

.nmj-search-icon,
.nmj-searchbar i{
  color:#475569 !important;
  font-size:16px;
  opacity:.95;
}
.nmj-searchbar,
#company-list .nmj-searchbar,
#kuchikomi-top .nmj-searchbar{
  min-height:48px;
  padding:0 14px;
}

.brand-btn,
.btn-cta,
#runDiag{
  justify-content:center;
  text-align:center;
}
.brand-btn i,
.btn-cta i,
#runDiag i{opacity:.96}

.brand-btn.nmj-btn--official,
.nmj-btn--official{
  background:#eff6ff !important;
  color:#1d4ed8 !important;
  border:1px solid #bfdbfe !important;
}
.brand-btn.nmj-btn--official:hover,
.nmj-btn--official:hover{background:#dbeafe !important}

.brand-btn.nmj-btn--article,
.nmj-btn--article{
  background:#f8fafc !important;
  color:#0f172a !important;
  border:1px solid #cbd5e1 !important;
}
.brand-btn.nmj-btn--article:hover,
.nmj-btn--article:hover{background:#f1f5f9 !important}

.brand-btn.nmj-btn--line,
.nmj-btn--line{
  background:linear-gradient(135deg,var(--nmj-ui-green),var(--nmj-ui-green-2)) !important;
  color:#fff !important;
  border:1px solid #15803d !important;
}
.brand-btn.nmj-btn--line:hover,
.nmj-btn--line:hover{filter:brightness(.98)}

.brand-btn.nmj-btn--search,
.nmj-btn--search{
  background:linear-gradient(135deg,var(--nmj-ui-blue),var(--nmj-ui-blue-2)) !important;
  color:#fff !important;
  border:1px solid #1d4ed8 !important;
}

#runDiag.btn-cta,
.home #runDiag.btn-cta,
.front-page #runDiag.btn-cta{
  background:linear-gradient(135deg,var(--nmj-ui-blue),var(--nmj-ui-sky)) !important;
  background-image:linear-gradient(135deg,var(--nmj-ui-blue),var(--nmj-ui-sky)) !important;
  border-color:#2563eb !important;
  box-shadow:0 10px 24px rgba(37,99,235,.24) !important;
}
#runDiag.btn-cta:hover,
.home #runDiag.btn-cta:hover,
.front-page #runDiag.btn-cta:hover{transform:translateY(-1px)}

#nmj-sim-v8 .nmj-sim-card{
  border-radius:18px;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
#nmj-sim-v8 .nmj-sim-card__top{
  align-items:center;
  gap:18px;
  padding:18px 18px 14px;
}
#nmj-sim-v8 .nmj-sim-card__nameRow{
  align-items:center;
  flex-wrap:wrap;
  row-gap:8px;
}
#nmj-sim-v8 .nmj-sim-card__logo{
  width:48px;
  height:48px;
  border-radius:12px;
}
#nmj-sim-v8 .nmj-sim-card__name{
  font-size:18px;
  line-height:1.35;
}
#nmj-sim-v8 .nmj-sim-card__company{
  width:100%;
  color:#64748b;
  font-size:12px;
  font-weight:700;
}
#nmj-sim-v8 .nmj-sim-card__sub{font-size:13px}
#nmj-sim-v8 .nmj-sim-card__body{padding:16px 18px 18px}
#nmj-sim-v8 .nmj-compat-badge,
#nmj-sim-v8 .nmj-sim-compat{
  background:linear-gradient(135deg,#ecfeff,#dcfce7) !important;
  color:#166534 !important;
  border:1px solid #bbf7d0;
  border-radius:14px;
  padding:10px 14px;
}
#nmj-sim-v8 .tag-compat{background:#ecfdf5;color:#166534;border:1px solid #bbf7d0}
#nmj-sim-v8 .nmj-sim-more{display:flex;justify-content:center}
#nmj-sim-v8 .nmj-sim-more-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--nmj-ui-blue),var(--nmj-ui-sky));
  color:#fff;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(37,99,235,.22);
}

.card .thumb,
.nmj-card-media-link .thumb,
.nmj-related-site-card img{
  transition:transform .25s ease, opacity .25s ease;
}
.card:hover .thumb,
.nmj-card-media-link:hover .thumb,
.nmj-related-site-card:hover img{transform:scale(1.03)}
.nmj-card-title{line-height:1.45}
.nmj-cta-card .brand-btn,
.card .brand-btn{min-height:42px}
.nmj-list-row-link{align-items:flex-start}

.nmj-related-site-card{position:relative;display:block;overflow:hidden}
.nmj-related-site-note{
  position:absolute;
  left:12px;
  top:12px;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(15,23,42,.72);
  color:#fff;
  font-size:12px;
  font-weight:800;
  backdrop-filter:blur(6px);
}

.faq details{
  padding:0;
  overflow:hidden;
}
.faq summary,
.faq .nmj-faq-summary{
  min-height:60px;
  padding:16px 18px;
}
.faq details > p,
.faq details > div{padding-left:18px;padding-right:18px}
.faq details > p{padding-bottom:18px}
.faq .nmj-faq-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:1.6em;color:#0f172a}
.faq .nmj-faq-toggle__minus{display:none}
.faq details[open] .nmj-faq-toggle__plus{display:none}
.faq details[open] .nmj-faq-toggle__minus{display:inline}

#company-list .brand-pill i,
#kuchikomi-top .brand-pill i,
#kuchikomi-service .brand-pill i,
#campaign .brand-pill i,
#feature .brand-pill i,
.content-scope .inline-flex.h-10.w-10 i,
.content-scope .inline-flex.h-10.w-10 svg{
  transform:translateY(0);
}

#company-list .grid.grid-cols-4 > div,
#kuchikomi-top .grid.grid-cols-4 > div,
#kuchikomi-service .grid.grid-cols-4 > div{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
#company-list .grid.grid-cols-4 > div .font-extrabold,
#kuchikomi-top .grid.grid-cols-4 > div .font-extrabold,
#kuchikomi-service .grid.grid-cols-4 > div .font-extrabold{
  line-height:1.25;
  word-break:break-word;
}

body.home #videoSide .font-bold,
body.front-page #videoSide .font-bold{line-height:1.45}
body.home #videoSide .line-clamp-2,
body.front-page #videoSide .line-clamp-2{-webkit-line-clamp:3}

@media (max-width: 768px){
  #nmj-sim-v8 .nmj-sim-card__top{
    align-items:flex-start;
    flex-direction:column;
  }
  #nmj-sim-v8 .nmj-compat-badge,
  #nmj-sim-v8 .nmj-sim-compat{align-self:center;width:100%;max-width:220px;text-align:center}
  #nmj-sim-v8 .nmj-sim-card__name{font-size:19px}
  #nmj-sim-v8 .nmj-sim-card__body{padding:14px 14px 16px}
  .nmj-list-row-link .thumb{width:108px;max-width:108px}
  #company-list .card .p-5,
  #kuchikomi-top .card .p-5,
  #kuchikomi-service .card .p-5{padding:16px}
  #company-list .grid.grid-cols-4,
  #kuchikomi-top .grid.grid-cols-4,
  #kuchikomi-service .grid.grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faq summary,
  .faq .nmj-faq-summary{padding:14px 16px}
}


/* Phase 3.1: hide +5 button on top diagnosis */
#nmjMore5,
#nmjMore5Wrap,
#nmjMore5Float{
  display:none !important;
}


/* Phase 3.2: button color mapping + CSV template/import usability */
:root{
  --nmj-main: var(--nmj-base, #f97316);
  --nmj-main-600: var(--nmj-base600, #ea580c);
  --nmj-btn1-solid: var(--nmj-btn1, #2563eb);
  --nmj-btn1-solid-600: var(--nmj-btn1-600, #1d4ed8);
  --nmj-btn2-solid: var(--nmj-btn2, #0ea5e9);
  --nmj-btn2-solid-600: var(--nmj-btn2-600, #0284c7);
  --nmj-btn4-solid: var(--nmj-btn4, #64748b);
  --nmj-btn4-solid-600: var(--nmj-btn4-600, #475569);
}

/* 虫眼鏡 = ボタンカラー1 */
.fa-magnifying-glass,
.nmj-search-icon,
.btn-cta .fa-magnifying-glass,
#runDiag .fa-magnifying-glass{
  color: var(--nmj-btn1-solid);
}

/* 記事をもっと見る = ボタンカラー2 */
a.btn-cta.inline-block.nmj-btn-more-article{
  background: linear-gradient(135deg,var(--nmj-btn2-solid),var(--nmj-btn2-solid-600)) !important;
  background-image: linear-gradient(135deg,var(--nmj-btn2-solid),var(--nmj-btn2-solid-600)) !important;
  color:#fff !important;
  border:0 !important;
}

/* 記事を読む = サブ濃い */
a.brand-btn.nmj-btn-article-read,
a.brand-btn.nmj-btn-article-read:visited{
  background: linear-gradient(135deg,var(--nmj-btn4-solid),var(--nmj-btn4-solid-600)) !important;
  background-image: linear-gradient(135deg,var(--nmj-btn4-solid),var(--nmj-btn4-solid-600)) !important;
  color:#fff !important;
  border:0 !important;
}

/* card-opt = メイン */
.card-opt,
#gbTabs .card-opt{
  border-color: var(--nmj-main) !important;
  color: var(--nmj-main) !important;
}
.card-opt.active,
.card-opt.is-active,
#gbTabs .card-opt.active,
#gbTabs .card-opt.is-active{
  background: linear-gradient(135deg,var(--nmj-main),var(--nmj-main-600)) !important;
  background-image: linear-gradient(135deg,var(--nmj-main),var(--nmj-main-600)) !important;
  border-color: var(--nmj-main) !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* 診断する = ボタンカラー4 */
#runDiag.btn-cta,
.home #runDiag.btn-cta,
.front-page #runDiag.btn-cta{
  background: linear-gradient(135deg,var(--nmj-btn4-solid),var(--nmj-btn4-solid-600)) !important;
  background-image: linear-gradient(135deg,var(--nmj-btn4-solid),var(--nmj-btn4-solid-600)) !important;
  color:#fff !important;
  border-color: var(--nmj-btn4-solid) !important;
}

/* 虫眼鏡入りの診断ボタンは文字を白に、単体虫眼鏡はbtn1 */
#runDiag.btn-cta .fa-magnifying-glass,
.home #runDiag.btn-cta .fa-magnifying-glass,
.front-page #runDiag.btn-cta .fa-magnifying-glass,
a.btn-cta.inline-block.nmj-btn-more-article .fa-magnifying-glass{
  color:#fff !important;
}


/* Phase3 v5: formal article TOC anchors clickable */
.entry-content .nmj-toc a,
.entry-content .nmj-summary-box a,
.entry-content .nmj-next a{
  pointer-events:auto !important;
  cursor:pointer;
  position:relative;
  z-index:2;
}
.entry-content .nmj-toc li,
.entry-content .nmj-summary-box li{position:relative;z-index:1;}
.entry-content .nmj-toc a[href^="#"],
.entry-content .nmj-summary-box a[href^="#"],
.entry-content .nmj-next a[href^="#"]{
  text-decoration:underline;
  text-underline-offset:2px;
}
.entry-content h2[id], .entry-content h3[id], .entry-content section[id]{scroll-margin-top:96px;}


/* ===== phase3 v8 reissue fixes ===== */
/* TOPセクション末尾リンク = Primary */
.nmj-btn-more-article,
.entry-content .nmj-btn-more-article,
a.btn-cta.inline-block.nmj-btn-more-article{
  background:#2563eb !important;
  color:#fff !important;
  border:1px solid #2563eb !important;
}
.nmj-btn-more-article:hover,
a.btn-cta.inline-block.nmj-btn-more-article:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#fff !important;
}

/* 診断する = Primary/CTA */
#runDiag,
#runDiag.btn-cta,
.home #runDiag.btn-cta,
.front-page #runDiag.btn-cta{
  background:#2563eb !important;
  background-image:none !important;
  color:#fff !important;
  border:1px solid #2563eb !important;
}
#runDiag:hover,
#runDiag.btn-cta:hover,
.home #runDiag.btn-cta:hover,
.front-page #runDiag.btn-cta:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#fff !important;
}
#runDiag .fa-magnifying-glass,
#runDiag i{color:#fff !important;opacity:1 !important}

/* 記事を読む = Secondary */
.brand-btn.nmj-btn--article,
.nmj-btn--article,
a.brand-btn.nmj-btn--article,
a.button.nmj-btn--article{
  background:#f1f5f9 !important;
  color:#0f172a !important;
  border:1px solid #cbd5e1 !important;
}
.brand-btn.nmj-btn--article:hover,
.nmj-btn--article:hover{
  background:#e2e8f0 !important;
  color:#0f172a !important;
}

/* シミュレーションページの結果を見る = Primary */
#nmj-sim-v8 a.btn.btn-ghost[href="#results"],
#nmj-sim-v8 a[href="#results"].btn,
#nmj-sim-v8 .nmj-sim-result-btn{
  background:#2563eb !important;
  color:#fff !important;
  border:1px solid #2563eb !important;
}
#nmj-sim-v8 a.btn.btn-ghost[href="#results"]:hover,
#nmj-sim-v8 a[href="#results"].btn:hover,
#nmj-sim-v8 .nmj-sim-result-btn:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#fff !important;
}

/* 公式サイトで詳細 = Secondary */
a.btn.btn-official.nmj-btn-secondary,
a.btn.btn-official,
.btn-official.nmj-btn-secondary,
#nmj-sim-v8 .btn-official,
.sim-card-v8 .btn-official{
  background:#f1f5f9 !important;
  color:#0f172a !important;
  border:1px solid #cbd5e1 !important;
}
.btn-official.nmj-btn-secondary:hover,
a.btn.btn-official:hover,
#nmj-sim-v8 .btn-official:hover,
.sim-card-v8 .btn-official:hover{
  background:#e2e8f0 !important;
  color:#0f172a !important;
}


/* ===== phase3 v9: use NMJ site color settings consistently ===== */
/* gbTabs active/inactive colors must follow NMJ site colors */
#gbTabs .card-opt,
#gbTabs .card-opt:visited{
  background:#fff !important;
  background-image:none !important;
  border:1px solid var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  box-shadow:none !important;
}
#gbTabs .card-opt:hover{
  border-color:var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) !important;
  color:var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) !important;
}
#gbTabs .card-opt.active,
#gbTabs .card-opt.is-active,
#gbTabs .card-opt[aria-pressed="true"]{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  border-color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  color:#fff !important;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--nmj-primary, var(--nmj-btn1, #f97316)) 15%, transparent) inset !important;
}
#gbTabs .card-opt.active *,
#gbTabs .card-opt.is-active *,
#gbTabs .card-opt[aria-pressed="true"] *{ color:inherit !important; }

/* TOP page section-end links = Primary */
.nmj-btn-section-end,
.home .nmj-btn-section-end,
.front-page .nmj-btn-section-end{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  border:none !important;
  color:#fff !important;
}

/* Diagnose button = button color 1 */
#runDiag,
#runDiag.btn-cta,
.home #runDiag.btn-cta,
.front-page #runDiag.btn-cta{
  background:linear-gradient(90deg,var(--nmj-btn1, var(--nmj-primary, #f97316)) 0%,var(--nmj-btn1-600, var(--nmj-primary-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1, var(--nmj-primary, #f97316)) 0%,var(--nmj-btn1-600, var(--nmj-primary-600, #ea580c)) 100%) !important;
  border:none !important;
  color:#fff !important;
}

/* Read article buttons = Secondary */
a.brand-btn.nmj-btn--article,
.brand-btn.nmj-btn--article,
a.brand-btn.nmj-btn-article-read,
.brand-btn.nmj-btn-article-read{
  background:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  border:none !important;
  color:#fff !important;
}

/* Simulation page result button = Primary */
#nmj-sim-v8 a.btn.btn-ghost[href="#results"],
#nmj-sim-v8 a[href="#results"].btn,
#nmj-sim-v8 .nmj-sim-result-btn{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  border:none !important;
  color:#fff !important;
}

/* Official detail button = Secondary */
a.btn.btn-official.nmj-btn-secondary,
a.btn.btn-official,
.btn-official.nmj-btn-secondary,
#nmj-sim-v8 .btn-official,
.sim-card-v8 .btn-official{
  background:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  border:none !important;
  color:#fff !important;
}


/* ===== phase3 v10 reissue: stronger NMJ site-color enforcement ===== */
/* All section CTA links should follow Primary site color */
a.btn-cta.inline-block,
.entry-content a.btn-cta.inline-block,
.home a.btn-cta.inline-block,
.front-page a.btn-cta.inline-block,
a.btn-cta.inline-block.nmj-btn-more-article,
a[data-ga4-link_role="purpose_article"].btn-cta,
.nmj-btn-section-end,
.home .nmj-btn-section-end,
.front-page .nmj-btn-section-end{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  border:1px solid var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  color:#fff !important;
}

a.btn-cta.inline-block:hover,
.entry-content a.btn-cta.inline-block:hover,
a.btn-cta.inline-block.nmj-btn-more-article:hover,
a[data-ga4-link_role="purpose_article"].btn-cta:hover{
  background:linear-gradient(90deg,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 0%,var(--nmj-primary, var(--nmj-btn1, #f97316)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 0%,var(--nmj-primary, var(--nmj-btn1, #f97316)) 100%) !important;
  color:#fff !important;
}

/* gbTabs inactive/active colors must visibly switch */
#gbTabs .card-opt,
#gbTabs .card-opt:visited,
#gbTabs button.card-opt,
#gbTabs button.card-opt:visited{
  background:#fff !important;
  background-image:none !important;
  border:1px solid var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  -webkit-text-fill-color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  box-shadow:none !important;
}
#gbTabs .card-opt:hover,
#gbTabs button.card-opt:hover{
  background:#fff !important;
  color:var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) !important;
  -webkit-text-fill-color:var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) !important;
  border-color:var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) !important;
}
#gbTabs .card-opt.active,
#gbTabs .card-opt.is-active,
#gbTabs .card-opt[aria-pressed="true"],
#gbTabs button.card-opt.active,
#gbTabs button.card-opt.is-active,
#gbTabs button.card-opt[aria-pressed="true"]{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  border-color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:none !important;
  opacity:1 !important;
}
#gbTabs .card-opt.active *,
#gbTabs .card-opt.is-active *,
#gbTabs .card-opt[aria-pressed="true"] *,
#gbTabs button.card-opt.active *,
#gbTabs button.card-opt.is-active *,
#gbTabs button.card-opt[aria-pressed="true"] *{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
}

/* Sort/search action buttons should follow Secondary site color */
.brand-btn.nmj-btn--search,
.nmj-btn--search,
button.brand-btn.nmj-btn--search,
a.brand-btn.nmj-btn--search{
  background:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 0%,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 100%) !important;
  border:1px solid var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) !important;
  color:#fff !important;
}
.brand-btn.nmj-btn--search:hover,
.nmj-btn--search:hover,
button.brand-btn.nmj-btn--search:hover,
a.brand-btn.nmj-btn--search:hover{
  background:linear-gradient(90deg,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 0%,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn2-600, var(--nmj-secondary-600, #0284c7)) 0%,var(--nmj-btn2, var(--nmj-secondary, #0ea5e9)) 100%) !important;
  color:#fff !important;
}


/* ===== phase3 v11: final gbTabs color fix ===== */
html body #gbTabs > button.card-opt,
html body #gbTabs > .card-opt,
html body #gbTabs .card-opt{
  background:#fff !important;
  background-image:none !important;
  color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  -webkit-text-fill-color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  border:1px solid var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
html body #gbTabs > button.card-opt.active,
html body #gbTabs > button.card-opt.is-active,
html body #gbTabs > button.card-opt[aria-pressed="true"],
html body #gbTabs > .card-opt.active,
html body #gbTabs > .card-opt.is-active,
html body #gbTabs > .card-opt[aria-pressed="true"],
html body #gbTabs .card-opt.active,
html body #gbTabs .card-opt.is-active,
html body #gbTabs .card-opt[aria-pressed="true"]{
  background:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  background-image:linear-gradient(90deg,var(--nmj-primary, var(--nmj-btn1, #f97316)) 0%,var(--nmj-primary-600, var(--nmj-btn1-600, #ea580c)) 100%) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  border-color:var(--nmj-primary, var(--nmj-btn1, #f97316)) !important;
  box-shadow:none !important;
  opacity:1 !important;
}
html body #gbTabs > button.card-opt.active *,
html body #gbTabs > button.card-opt.is-active *,
html body #gbTabs > button.card-opt[aria-pressed="true"] *,
html body #gbTabs > .card-opt.active *,
html body #gbTabs > .card-opt.is-active *,
html body #gbTabs > .card-opt[aria-pressed="true"] *,
html body #gbTabs .card-opt.active *,
html body #gbTabs .card-opt.is-active *,
html body #gbTabs .card-opt[aria-pressed="true"] *{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
}

/* ===== 2026-03-29 SP UI hotfix (requested re-fix) ===== */
@media (max-width: 767.98px){
  /* 1) Simulation result action buttons: force 2x2 instead of 3+1 */
  #nmj-sim-v8 .nmj-sim-cta,
  #nmj-sim-v8 .nmj-sim-actions,
  #nmj-sim-v8 .actions,
  .nmj-sim-cta,
  .nmj-sim-actions,
  .actions{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    align-items:stretch !important;
  }

  #nmj-sim-v8 .nmj-sim-cta .button,
  #nmj-sim-v8 .nmj-sim-actions > a,
  #nmj-sim-v8 .actions > .btn,
  .nmj-sim-cta .button,
  .nmj-sim-actions > a,
  .actions > .btn{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    flex:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    white-space:normal !important;
    line-height:1.35 !important;
    padding:12px 10px !important;
    box-sizing:border-box !important;
  }

  #nmj-sim-v8 .nmj-sim-cta .button.nmj-btn-line,
  .nmj-sim-cta .button.nmj-btn-line{
    width:100% !important;
    flex:none !important;
    grid-column:auto !important;
  }

  /* 2) Text clipping on cards */
  .post-card,
  .company-card,
  .sim-card-v8,
  .nmj-card,
  .nmj-purpose-card,
  .nmj-ranking-card,
  .me-card,
  .me-co-card,
  .gb-card,
  .card,
  .reco-banner,
  #nmj-sim-v8 .card,
  #nmj-sim-v8 .nmj-sim-card{
    min-width:0 !important;
  }

  .post-card *,
  .company-card *,
  .sim-card-v8 *,
  .nmj-card *,
  .nmj-purpose-card *,
  .nmj-ranking-card *,
  .me-card *,
  .me-co-card *,
  .gb-card *,
  .card *,
  .reco-banner *,
  #nmj-sim-v8 .card *,
  #nmj-sim-v8 .nmj-sim-card *{
    min-width:0 !important;
  }

  .post-card h3,
  .post-card h4,
  .post-card p,
  .company-card h3,
  .company-card h4,
  .company-card p,
  .sim-card-v8 h3,
  .sim-card-v8 h4,
  .sim-card-v8 p,
  .nmj-card-title,
  .nmj-card h3,
  .nmj-card h4,
  .nmj-card p,
  .nmj-purpose-card h3,
  .nmj-purpose-card h4,
  .nmj-purpose-card p,
  .nmj-ranking-card h3,
  .nmj-ranking-card h4,
  .nmj-ranking-card p,
  .me-card h3,
  .me-card h4,
  .me-card p,
  .me-co-card h3,
  .me-co-card h4,
  .me-co-card p,
  #nmj-sim-v8 .ttl,
  #nmj-sim-v8 .label,
  #nmj-sim-v8 .value,
  #nmj-sim-v8 .nmj-mini-radar-label,
  #nmj-sim-v8 .nmj-side-lab,
  #nmj-sim-v8 .nmj-service-name,
  #nmj-sim-v8 .nmj-result-title,
  #nmj-sim-v8 .nmj-result-desc{
    white-space:normal !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;
    text-overflow:clip !important;
  }

  /* keep titles readable but not cut awkwardly */
  .post-card .line-clamp-2,
  .company-card .line-clamp-2,
  .sim-card-v8 .line-clamp-2,
  .nmj-card .line-clamp-2,
  .nmj-purpose-card .line-clamp-2,
  .nmj-ranking-card .line-clamp-2,
  .me-card .line-clamp-2,
  .me-co-card .line-clamp-2{
    -webkit-line-clamp:3 !important;
    line-clamp:3 !important;
    line-height:1.45 !important;
  }

  .post-card .text-sm,
  .company-card .text-sm,
  .sim-card-v8 .text-sm,
  .nmj-card .text-sm,
  .nmj-purpose-card .text-sm,
  .nmj-ranking-card .text-sm,
  .me-card .text-sm,
  .me-co-card .text-sm{
    line-height:1.55 !important;
  }

  /* 3) Recommended plan card on SP */
  #nmj-sim-v8 .reco-body,
  .reco-body{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:14px !important;
    align-items:start !important;
  }

  #nmj-sim-v8 .reco-body .logo,
  .reco-body .logo{
    align-items:flex-start !important;
  }

  #nmj-sim-v8 .reco-body .logo img,
  .reco-body .logo img{
    width:48px !important;
    height:48px !important;
    flex:0 0 48px !important;
  }

  #nmj-sim-v8 .reco-body .ttl,
  .reco-body .ttl{
    font-size:15px !important;
    line-height:1.45 !important;
  }

  #nmj-sim-v8 .reco-body .badge,
  .reco-body .badge{
    display:inline-flex !important;
    max-width:100% !important;
    white-space:normal !important;
  }

  #nmj-sim-v8 .reco-body .btn-cta,
  .reco-body .btn-cta,
  #nmj-sim-v8 .reco-body .reco-cta,
  .reco-body .reco-cta{
    width:100% !important;
  }

  #nmj-sim-v8 .reco-foot,
  .reco-foot{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:6px !important;
  }

  #nmj-sim-v8 .reco-foot .exp,
  .reco-foot .exp{
    margin-left:0 !important;
  }

  /* 4) Fixed page hero compact only on SP */
  body.page .hero.hero-bg,
  body.page section.hero.hero-bg{
    min-height:auto !important;
    padding-top:28px !important;
    padding-bottom:28px !important;
    background-position:center center !important;
    background-size:cover !important;
  }

  body.page .hero.hero-bg h1,
  body.page section.hero.hero-bg h1{
    font-size:clamp(24px,6vw,30px) !important;
    line-height:1.25 !important;
  }

  body.page .hero.hero-bg p,
  body.page section.hero.hero-bg p,
  body.page .hero.hero-bg .lead,
  body.page section.hero.hero-bg .lead{
    line-height:1.6 !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;
  }
}


/* ===== 2026-03-29 SP/PC UI hotfix v3 ===== */
/* PC: keep simulation result buttons in a single horizontal row */
@media (min-width: 768px){
  #nmj-sim-v8 .nmj-sim-cta,
  #nmj-sim-v8 .nmj-sim-actions,
  #nmj-sim-v8 .actions,
  .nmj-sim-cta,
  .nmj-sim-actions,
  .actions{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
    align-items:stretch !important;
  }

  #nmj-sim-v8 .nmj-sim-cta .button,
  #nmj-sim-v8 .nmj-sim-actions > a,
  #nmj-sim-v8 .actions > .btn,
  .nmj-sim-cta .button,
  .nmj-sim-actions > a,
  .actions > .btn{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    box-sizing:border-box !important;
  }
}

@media (max-width: 767.98px){
  /* More aggressive text clamp release for article/video/company card titles */
  h3.line-clamp-2,
  h4.line-clamp-2,
  .line-clamp-2{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;
    -webkit-line-clamp:4 !important;
    line-clamp:4 !important;
    white-space:normal !important;
    line-height:1.45 !important;
    max-height:none !important;
    text-overflow:clip !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;
  }

  .post-card h3.line-clamp-2,
  .company-card h3.line-clamp-2,
  .sim-card-v8 h3.line-clamp-2,
  .nmj-card h3.line-clamp-2,
  .nmj-purpose-card h3.line-clamp-2,
  .nmj-ranking-card h3.line-clamp-2,
  .me-card h3.line-clamp-2,
  .me-co-card h3.line-clamp-2,
  h3.line-clamp-2.font-bold.text-sm{
    font-size:14px !important;
    line-height:1.5 !important;
  }
}


/* ===== phase4 v15: admin-color / icon / SP visibility / CTA consistency fix ===== */
:root{
  --nmj-primary: var(--nmj-base, var(--nmj-btn1, #f97316));
  --nmj-primary-600: var(--nmj-base600, var(--nmj-btn1-600, #ea580c));
  --nmj-primary-soft: color-mix(in srgb, var(--nmj-primary) 12%, white);
  --nmj-primary-soft-border: color-mix(in srgb, var(--nmj-primary) 24%, white);
}

.nmj-accent-text{color:var(--nmj-primary) !important;}
.nmj-accent-text-600{color:var(--nmj-primary-600) !important;}
.nmj-accent-soft-bg{background:var(--nmj-primary-soft) !important;}
.nmj-accent-soft-bd{border-color:var(--nmj-primary-soft-border) !important;}

/* Unset color fallback removal for GB / shortcode parts */
.gb-head,
body.page-id-7596 .gb-head{
  background:linear-gradient(90deg,var(--nmj-primary),var(--nmj-primary-600)) !important;
  color:#fff !important;
}
.gb-head .tag,
body.page-id-7596 .gb-head .tag{
  background:rgba(255,255,255,.16) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.22) !important;
}
.gb-price,
body.page-id-7596 .gb-price{
  color:var(--nmj-primary-600) !important;
}
.gb-cta .primary,
body.page-id-7596 .gb-cta .primary{
  background:linear-gradient(90deg,var(--nmj-primary),var(--nmj-primary-600)) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.gb-cta .outline,
body.page-id-7596 .gb-cta .outline{
  background:#fff !important;
  color:var(--nmj-primary) !important;
  border:2px solid var(--nmj-primary) !important;
}

/* TOP / shortcode buttons must follow admin colors */
.home .brand-pill,
.front-page .brand-pill,
.home .brand-btn,
.front-page .brand-btn,
.home .gb-cta a.primary,
.front-page .gb-cta a.primary,
.home .btn-cta,
.front-page .btn-cta,
.home .nmj-btn-article-read,
.front-page .nmj-btn-article-read{
  background:linear-gradient(90deg,var(--nmj-btn1, var(--nmj-primary)),var(--nmj-btn1-600, var(--nmj-primary-600))) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.home .gb-cta a.outline,
.front-page .gb-cta a.outline{
  background:#fff !important;
  color:var(--nmj-btn1, var(--nmj-primary)) !important;
  border:2px solid var(--nmj-btn1, var(--nmj-primary)) !important;
}

/* white icon unification for target icon chips */
.nmj-accent-soft-bg > i,
.nmj-accent-soft-bg > svg,
span.nmj-accent-soft-bg i,
span.nmj-accent-soft-bg svg{
  color:#fff !important;
  fill:#fff !important;
}

/* compatibility border removal */
#nmj-sim-v8 .nmj-compat-badge,
#nmj-sim-v8 .nmj-sim-compat,
#nmj-sim-v8 .tag-compat,
.match-msg,
.nmj-sim-results .match{
  border:none !important;
  box-shadow:none !important;
}

/* fixed-page comparison-point block: hide on SP only */
@media (max-width: 767.98px){
  .page .entry-content .card:has(.fa-lightbulb):has(.sm\:grid-cols-3),
  .page .entry-content .card:has(.fa-lightbulb):has(.grid.sm\:grid-cols-3),
  .page .entry-content .card:has(.fa-lightbulb):has(.mt-4.grid){
    display:none !important;
  }
}

/* keep it visible on desktop */
@media (min-width: 768px){
  .page .entry-content .card:has(.fa-lightbulb):has(.sm\:grid-cols-3),
  .page .entry-content .card:has(.fa-lightbulb):has(.grid.sm\:grid-cols-3),
  .page .entry-content .card:has(.fa-lightbulb):has(.mt-4.grid){
    display:block !important;
  }
}

/* company card article CTA visibility consistency */
.nmj-company-card__actions a[href=""],
.nmj-company-card__actions a:not([href]),
.brand-btn.nmj-btn-article-read[href=""],
.brand-btn.nmj-btn--article[href=""],
.btn-cta.inline-block[href=""],
.brand-pill[href=""]{
  display:none !important;
}


/* =====================================================================
   Phase5 fix: icon-color token + simulation/admin-color full sync
   ===================================================================== */
:root{
  --nmj-icon-color:#ffffff;
  --nmj-accent-main:var(--nmj-base, var(--nmj-btn1, #1f2937));
  --nmj-accent-main-600:var(--nmj-base600, var(--nmj-btn1-600, #111827));
  --nmj-accent-soft:color-mix(in srgb, var(--nmj-accent-main) 12%, white);
  --nmj-accent-soft-strong:color-mix(in srgb, var(--nmj-accent-main) 22%, white);
  --nmj-accent-soft-text:var(--nmj-accent-main);
  --nmj-icon-bg:var(--nmj-accent-main);
}

/* icon system: icon wrappers use dedicated token, icon glyph stays white */
.nmj-accent-soft-bg,
.nmj-icon-chip,
.nmj-icon-badge,
.nmj-icon-wrap,
#nmj-sim-v8 .stat .ico,
#nmj-sim-v8 .st .ico,
#nmj-sim-v8 .pill-chip .dot{
  background:var(--nmj-icon-bg) !important;
  border-color:transparent !important;
  color:var(--nmj-icon-color) !important;
}
.nmj-accent-soft-bg > i,
.nmj-accent-soft-bg > svg,
.nmj-icon-chip > i,
.nmj-icon-chip > svg,
.nmj-icon-badge > i,
.nmj-icon-badge > svg,
.nmj-icon-wrap > i,
.nmj-icon-wrap > svg,
#nmj-sim-v8 .stat .ico i,
#nmj-sim-v8 .stat .ico svg,
#nmj-sim-v8 .st .ico i,
#nmj-sim-v8 .st .ico svg,
#nmj-sim-v8 .mode-chip i,
#nmj-sim-v8 .mode-chip svg,
.home .mode-chip i,
.home .mode-chip svg,
.front-page .mode-chip i,
.front-page .mode-chip svg{
  color:var(--nmj-icon-color) !important;
  fill:var(--nmj-icon-color) !important;
  stroke:var(--nmj-icon-color) !important;
}

/* active chips/tabs/buttons must follow admin colors, not fixed orange/blue */
#nmj-sim-v8 .mode-chip.active,
#nmj-sim-v8 .mode-chip.is-active,
#nmj-sim-v8 .select-row .mode-chip.active,
#nmj-sim-v8 .tab.active,
#nmj-sim-v8 .tab.is-active,
#nmj-sim-v8 .sort-tabs .tab.active,
#nmj-sim-v8 .sort-tabs .tab.is-active,
#nmj-sim-v8 .nmj-sim-results .tab.is-active,
.home .mode-chip.active,
.home .mode-chip.is-active,
.front-page .mode-chip.active,
.front-page .mode-chip.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#ffffff !important;
}

/* simulation hero text and monthly/recommend titles must use admin color */
#nmj-sim-v8 .hero h1,
#nmj-sim-v8 .nmj-sim-hero h1,
#nmj-sim-v8 .monthly .monthly-title,
#nmj-sim-v8 .monthly h2,
#nmj-sim-v8 .monthly .title-row,
#nmj-sim-v8 .monthly .title-row .ttl,
#nmj-sim-v8 .reco-banner .ttl,
#nmj-sim-v8 .reco-body .ttl,
#nmj-sim-v8 .campaign-bar .big,
#nmj-sim-v8 .reco-foot .big,
#nmj-sim-v8 .result-title,
#nmj-sim-v8 .nmj-result-title,
#nmj-sim-v8 .nmj-sim-score,
#nmj-sim-v8 .nmj-score-number,
#nmj-sim-v8 .compat-score,
#nmj-sim-v8 .match-rate,
#nmj-sim-v8 .match-rate-value{
  color:var(--nmj-accent-main) !important;
}

/* result texts / labels / headings should not fallback to orange */
#nmj-sim-v8 .monthly .pr,
#nmj-sim-v8 .reco-banner .reco-head .pr,
#nmj-sim-v8 .campaign-bar .right,
#nmj-sim-v8 .reco-foot .right,
#nmj-sim-v8 .reco-foot .exp,
#nmj-sim-v8 .nmj-mini-radar-val,
#nmj-sim-v8 .nmj-mini-radar-label,
#nmj-sim-v8 .label,
#nmj-sim-v8 .stat .label,
#nmj-sim-v8 .st .lb,
#nmj-sim-v8 .tag,
#nmj-sim-v8 .pill-chip,
#nmj-sim-v8 .pill-chip span,
#nmj-sim-v8 .value,
#nmj-sim-v8 .stat .value,
#nmj-sim-v8 .st .vl{
  color:var(--nmj-accent-main) !important;
}

/* backgrounds that were hardcoded orange now follow admin color softly */
#nmj-sim-v8 .monthly .pr,
#nmj-sim-v8 .reco-banner .reco-head .pr,
#nmj-sim-v8 .pill-chip,
#nmj-sim-v8 .sim-card-v8 .net-pill,
#nmj-sim-v8 .sim-card-v8 .tag,
#nmj-sim-v8 .tag,
#nmj-sim-v8 .badge-pill{
  background:var(--nmj-accent-soft) !important;
  border-color:var(--nmj-accent-soft-strong) !important;
}
#nmj-sim-v8 .campaign-bar,
#nmj-sim-v8 .reco-foot{
  background:linear-gradient(90deg,var(--nmj-accent-soft),color-mix(in srgb, var(--nmj-accent-main) 18%, white)) !important;
  border-top-color:var(--nmj-accent-soft-strong) !important;
}

/* hero action buttons on simulation page */
#nmj-sim-v8 .hero .btn,
#nmj-sim-v8 .hero .btn-cta,
#nmj-sim-v8 .hero .button,
#nmj-sim-v8 .hero .button-primary,
#nmj-sim-v8 .nmj-sim-cta .button-primary{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  color:#fff !important;
  border-color:var(--nmj-btn1) !important;
}

/* result action buttons keep admin role colors */
#nmj-sim-v8 .btn-article,
#nmj-sim-v8 .sim-card-v8 .btn-article{
  background:linear-gradient(90deg,var(--nmj-btn2),var(--nmj-btn2-600)) !important;
  color:#fff !important;
  border-color:var(--nmj-btn2) !important;
}
#nmj-sim-v8 .btn-official,
#nmj-sim-v8 .sim-card-v8 .btn-official,
#nmj-sim-v8 .reco-body .btn-cta{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  color:#fff !important;
  border-color:var(--nmj-btn1) !important;
}
#nmj-sim-v8 .btn-line,
#nmj-sim-v8 #nmjLineShareBtn{
  background:linear-gradient(90deg,var(--nmj-btn3),var(--nmj-btn3-600)) !important;
  color:#fff !important;
  border-color:var(--nmj-btn3) !important;
}

/* radar colors: SVG + chart canvas fallback vars */
#nmj-sim-v8 .nmj-mini-radar svg [stroke="#f59e0b"],
#nmj-sim-v8 .nmj-mini-radar svg [stroke="#f97316"],
#nmj-sim-v8 .nmj-mini-radar svg [fill="#f59e0b"],
#nmj-sim-v8 .nmj-mini-radar svg [fill="#f97316"],
#nmj-sim-v8 .nmj-sim-radar svg [stroke="#f59e0b"],
#nmj-sim-v8 .nmj-sim-radar svg [stroke="#f97316"],
#nmj-sim-v8 .nmj-sim-radar svg [fill="#f59e0b"],
#nmj-sim-v8 .nmj-sim-radar svg [fill="#f97316"],
#nmj-sim-v8 .nmj-mini-radar-bar i{
  stroke:var(--nmj-accent-main) !important;
  fill:color-mix(in srgb, var(--nmj-accent-main) 28%, transparent) !important;
  background:var(--nmj-accent-main) !important;
}
#nmj-sim-v8 .nmj-sim-radar svg polygon:last-of-type,
#nmj-sim-v8 .nmj-mini-radar svg polygon:last-of-type,
#nmj-sim-v8 .nmj-sim-radar svg path:last-of-type,
#nmj-sim-v8 .nmj-mini-radar svg path:last-of-type{
  stroke:var(--nmj-accent-main) !important;
  fill:color-mix(in srgb, var(--nmj-accent-main) 22%, transparent) !important;
}

/* compatibility / result badge should use admin accent and no green/orange leftovers */
#nmj-sim-v8 .nmj-compat-badge,
#nmj-sim-v8 .nmj-sim-compat,
#nmj-sim-v8 .tag-compat,
#nmj-sim-v8 .match,
#nmj-sim-v8 .match-msg,
#nmj-sim-v8 .nmj-count{
  color:var(--nmj-accent-main) !important;
  background:var(--nmj-accent-soft) !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

/* specific score badge seen in screenshot */
#nmj-sim-v8 [class*="score"],
#nmj-sim-v8 [class*="compat"]{
  border-color:transparent;
}

/* keep icon circles white glyph + admin background also on top / cards */
.home .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl,
.front-page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl,
.page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl{
  color:var(--nmj-icon-color) !important;
}
.home .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl i,
.front-page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl i,
.page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl i,
.home .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl svg,
.front-page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl svg,
.page .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl svg{
  color:var(--nmj-icon-color) !important;
  fill:var(--nmj-icon-color) !important;
  stroke:var(--nmj-icon-color) !important;
}

/* =====================================================================
   Phase6 fix: global icon-token mapping + residual simulation non-admin colors
   ===================================================================== */
:root{
  --nmj-icon-accent:var(--nmj-base, var(--nmj-btn1, #0f172a));
  --nmj-icon-accent-strong:var(--nmj-base600, var(--nmj-btn1-600, #0b1220));
  --nmj-icon-soft:color-mix(in srgb, var(--nmj-icon-accent) 12%, white);
  --nmj-icon-soft-strong:color-mix(in srgb, var(--nmj-icon-accent) 24%, white);
}

/* 1) standalone icons should never keep tailwind amber/rose/red/orange leftovers */
.home .entry-content i.fa-solid,
.home .entry-content i.fa-regular,
.home .entry-content i.fa-brands,
.front-page .entry-content i.fa-solid,
.front-page .entry-content i.fa-regular,
.front-page .entry-content i.fa-brands,
.page .entry-content i.fa-solid,
.page .entry-content i.fa-regular,
.page .entry-content i.fa-brands,
#nmj-sim-v8 i.fa-solid,
#nmj-sim-v8 i.fa-regular,
#nmj-sim-v8 i.fa-brands,
.nmj-wrap i.fa-solid,
.nmj-wrap i.fa-regular,
.nmj-wrap i.fa-brands,
[class*="fa-"]{
  color:var(--nmj-icon-accent);
}
.home .entry-content svg,
.front-page .entry-content svg,
.page .entry-content svg,
#nmj-sim-v8 svg,
.nmj-wrap svg{
  color:var(--nmj-icon-accent);
  stroke:currentColor;
  fill:currentColor;
}

/* 2) section-title / heading icons */
.sec-h2 i,
.sec-title i,
.q-chip i,
.brand-pill i,
.link-row i,
.nmj-count i,
.nmj-search-toolbar i,
.nmj-filter-row i,
.nmj-toolbar i,
.nmj-sim-results .toolbar i,
.nmj-sim-monthly .title-row i,
.reco-banner .reco-head i,
.campaign-bar i,
.company-card .meta i,
.brand-meta i,
.spec-table i{
  color:var(--nmj-icon-accent) !important;
  fill:var(--nmj-icon-accent) !important;
  stroke:var(--nmj-icon-accent) !important;
}

/* 3) icon wrappers/chips = admin accent background + white glyph */
.nmj-accent-soft-bg,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full,
.nmj-icon-chip,
.nmj-icon-badge,
.nmj-icon-wrap,
.q-card .ico,
.sim-card-v8 .st .ico,
.stat .ico,
.st .ico,
.pill-chip .dot,
.company-card .chip i,
.company-card .chip svg{
  background:var(--nmj-icon-accent) !important;
  border-color:transparent !important;
  color:#fff !important;
}
.nmj-accent-soft-bg i,
.nmj-accent-soft-bg svg,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl i,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl svg,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full i,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full svg,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full i,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full svg,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full i,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full svg,
.nmj-icon-chip i,
.nmj-icon-chip svg,
.nmj-icon-badge i,
.nmj-icon-badge svg,
.nmj-icon-wrap i,
.nmj-icon-wrap svg,
.q-card .ico i,
.q-card .ico svg,
.sim-card-v8 .st .ico i,
.sim-card-v8 .st .ico svg,
.stat .ico i,
.stat .ico svg,
.st .ico i,
.st .ico svg{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 4) icons inside filled buttons/cta tabs = white */
.btn-cta i,
.btn-cta svg,
.btn i,
.btn svg,
.button i,
.button svg,
.brand-btn i,
.brand-btn svg,
.more-btn i,
.more-btn svg,
.gb-cta a i,
.gb-cta a svg,
.actions .btn i,
.actions .btn svg,
.sim-card-v8 .btn-article i,
.sim-card-v8 .btn-article svg,
.sim-card-v8 .btn-official i,
.sim-card-v8 .btn-official svg,
.sim-card-v8 .btn-detail i,
.sim-card-v8 .btn-detail svg,
#runDiag i,
#runDiag svg,
.mode-chip.active i,
.mode-chip.active svg,
.mode-chip.is-active i,
.mode-chip.is-active svg,
.sort-tabs .tab.active i,
.sort-tabs .tab.active svg,
.nmj-sim-results .tab.is-active i,
.nmj-sim-results .tab.is-active svg,
.sim-group-tabs .tab.active i,
.sim-group-tabs .tab.active svg{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 5) simulation page: text colors must map to admin colors */
#nmj-sim-v8,
.nmj-sim-hero,
.nmj-sim-monthly,
.nmj-sim-results{
  --nmj-sim-accent:var(--nmj-base, var(--nmj-btn1, #0f172a));
  --nmj-sim-accent-600:var(--nmj-base600, var(--nmj-btn1-600, #0b1220));
  --nmj-sim-soft:color-mix(in srgb, var(--nmj-sim-accent) 10%, white);
  --nmj-sim-soft-2:color-mix(in srgb, var(--nmj-sim-accent) 18%, white);
}
.nmj-sim-hero h1,
.nmj-sim-hero .q-chip,
.nmj-sim-hero .q-chip *,
#nmj-sim-v8 .hero h1,
#nmj-sim-v8 .hero .q-chip,
#nmj-sim-v8 .hero .q-chip *,
#nmj-sim-v8 .result-title,
#nmj-sim-v8 .nmj-result-title,
#nmj-sim-v8 .match-rate,
#nmj-sim-v8 .match-rate-value,
#nmj-sim-v8 .compat-score,
#nmj-sim-v8 .nmj-score-number,
#nmj-sim-v8 .nmj-count,
#nmj-sim-v8 .match-msg,
.nmj-sim-results .match,
.result-toolbar .match-msg,
.result-toolbar .nmj-count{
  color:var(--nmj-sim-accent) !important;
}

/* 6) simulation active tabs/chips and result tabs */
.nmj-sim-hero .mode-chip.active,
.nmj-sim-hero .mode-chip.is-active,
#nmj-sim-v8 .mode-chip.active,
#nmj-sim-v8 .mode-chip.is-active,
.sort-tabs .tab.active,
.sort-tabs .tab.is-active,
.nmj-sim-results .tab.active,
.nmj-sim-results .tab.is-active,
.sim-group-tabs .tab.active,
.sim-group-tabs .tab.is-active,
.sim-tab.is-active,
.card-opt.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#fff !important;
  box-shadow:none !important;
  outline:none !important;
}

/* 7) simulation inactive chips/tabs should use admin accent not orange leftovers */
.nmj-sim-hero .mode-chip,
#nmj-sim-v8 .mode-chip,
.sort-tabs .tab,
.nmj-sim-results .tab,
.sim-group-tabs .tab,
.sim-tab,
.card-opt,
.pill,
.pill-chip,
.sim-card-v8 .tag,
.sim-card-v8 .net-pill,
.badge-pill,
.reco-body .badge,
.nmj-sim-monthly .pr,
.reco-banner .reco-head .pr{
  color:var(--nmj-sim-accent) !important;
  border-color:var(--nmj-sim-soft-2) !important;
}
.pill-chip,
.sim-card-v8 .tag,
.sim-card-v8 .net-pill,
.badge-pill,
.reco-body .badge,
.nmj-sim-monthly .pr,
.reco-banner .reco-head .pr,
.match-msg,
.nmj-sim-results .match,
.nmj-count{
  background:var(--nmj-sim-soft) !important;
}

/* 8) recommendation / monthly banner / campaign band */
.nmj-sim-monthly .title-row,
.nmj-sim-monthly .title-row *,
.reco-banner .ttl,
.reco-body .ttl,
.reco-body .label,
.reco-body .value,
.campaign-bar .big,
.campaign-bar .right,
.reco-foot .big,
.reco-foot .exp,
.reco-foot .right{
  color:var(--nmj-sim-accent) !important;
}
.campaign-bar,
.reco-foot{
  background:linear-gradient(90deg,var(--nmj-sim-soft),var(--nmj-sim-soft-2)) !important;
  border-top-color:var(--nmj-sim-soft-2) !important;
}
.reco-banner .reco-head,
.nmj-sim-monthly .card,
.reco-banner,
.campaign-bar,
.reco-foot{
  border-color:var(--nmj-sim-soft-2) !important;
}

/* 9) radar color fallback for canvas/svg labels and plots */
#nmj-sim-v8 .nmj-mini-radar,
#nmj-sim-v8 .nmj-sim-radar,
.nmj-sim-results .nmj-mini-radar,
.nmj-sim-results .nmj-sim-radar{
  color:var(--nmj-sim-accent) !important;
}
#nmj-sim-v8 .nmj-mini-radar *,
#nmj-sim-v8 .nmj-sim-radar *,
.nmj-sim-results .nmj-mini-radar *,
.nmj-sim-results .nmj-sim-radar *{
  border-color:var(--nmj-sim-soft-2) !important;
}
#nmj-sim-v8 .nmj-mini-radar svg polygon:last-of-type,
#nmj-sim-v8 .nmj-mini-radar svg path:last-of-type,
#nmj-sim-v8 .nmj-sim-radar svg polygon:last-of-type,
#nmj-sim-v8 .nmj-sim-radar svg path:last-of-type,
.nmj-sim-results .nmj-mini-radar svg polygon:last-of-type,
.nmj-sim-results .nmj-mini-radar svg path:last-of-type,
.nmj-sim-results .nmj-sim-radar svg polygon:last-of-type,
.nmj-sim-results .nmj-sim-radar svg path:last-of-type{
  stroke:var(--nmj-sim-accent) !important;
  fill:color-mix(in srgb, var(--nmj-sim-accent) 20%, transparent) !important;
}

/* 10) special residual literal classes used by PHP output */
.text-amber-500,
.text-orange-500,
.text-orange-600,
.text-rose-500,
.text-red-500,
.text-red-600,
.text-slate-500,
.text-sky-500,
.text-cyan-500{
  color:var(--nmj-icon-accent) !important;
}
.bg-orange-500,
.hover\:bg-orange-600:hover,
.bg-amber-500,
.hover\:bg-amber-600:hover{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#fff !important;
}

/* 11) search/filter / review page icon leftovers */
.nmj-search-icon,
.fa-magnifying-glass,
.fa-magnifying-glass-dollar,
.fa-filter,
.fa-sliders,
.fa-comments,
.fa-comment-dots,
.fa-building,
.fa-building-columns,
.fa-wifi,
.fa-bolt,
.fa-bolt-lightning,
.fa-credit-card,
.fa-coins,
.fa-layer-group,
.fa-book,
.fa-video,
.fa-circle-question,
.fa-gauge-high,
.fa-shuffle,
.fa-star,
.fa-bullseye,
.fa-tag,
.fa-clipboard-check,
.fa-tower-cell,
.fa-mobile-screen-button,
.fa-right-left,
.fa-up-right-from-square,
.fa-newspaper,
.fa-file-lines,
.fa-link,
.fa-yen-sign,
.fa-signal,
.fa-gift{
  color:var(--nmj-icon-accent) !important;
}

/* but within solid action buttons, keep them white */
.btn-cta .fa-magnifying-glass,
#runDiag .fa-magnifying-glass,
.brand-btn .fa-up-right-from-square,
.brand-btn .fa-file-lines,
.gb-cta .fa-up-right-from-square,
.gb-cta .fa-newspaper,
.actions .fa-up-right-from-square,
.actions .fa-file-lines,
.actions .fa-newspaper,
.mode-chip.active .fa-solid,
.mode-chip.is-active .fa-solid,
.sort-tabs .tab.active .fa-solid,
.sort-tabs .tab.is-active .fa-solid,
.nmj-sim-results .tab.active .fa-solid,
.nmj-sim-results .tab.is-active .fa-solid{
  color:#fff !important;
}

/* ===== phase7fix: remaining icon/text drift cleanup ===== */
:root{
  --nmj-site-accent:var(--nmj-base, var(--nmj-btn1, #0f172a));
  --nmj-site-accent-strong:var(--nmj-base600, var(--nmj-btn1-600, #0b1220));
  --nmj-site-text:var(--nmj-base, var(--nmj-btn1, #0f172a));
  --nmj-site-soft:color-mix(in srgb, var(--nmj-site-accent) 10%, white);
  --nmj-site-soft-2:color-mix(in srgb, var(--nmj-site-accent) 18%, white);
  --nmj-site-soft-3:color-mix(in srgb, var(--nmj-site-accent) 28%, white);
}

/* 1) Header nav icons must be white */
#header-container .navi-in > ul > li > a i,
#header-container .navi-in > ul > li > a svg,
#header-container .menu-header > li > a i,
#header-container .menu-header > li > a svg,
#header-container .menu-mobile > li > a i,
#header-container .menu-mobile > li > a svg,
#navi .menu-header.menu-pc > li > a i,
#navi .menu-header.menu-pc > li > a svg,
#navi .menu-mobile > li > a i,
#navi .menu-mobile > li > a svg,
.nmj-header a i,
.nmj-header a svg{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 2) Any icon inside colored circular/square icon wrappers should be white */
.nmj-accent-soft-bg,
.nmj-icon-chip,
.nmj-icon-badge,
.nmj-icon-wrap,
.q-card .ico,
.stat .ico,
.st .ico,
.sim-card-v8 .st .ico,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full{
  background:var(--nmj-site-accent) !important;
  border-color:transparent !important;
}
.nmj-accent-soft-bg i,
.nmj-accent-soft-bg svg,
.nmj-accent-soft-bg [class*="fa-"],
.nmj-icon-chip i,
.nmj-icon-chip svg,
.nmj-icon-chip [class*="fa-"],
.nmj-icon-badge i,
.nmj-icon-badge svg,
.nmj-icon-badge [class*="fa-"],
.nmj-icon-wrap i,
.nmj-icon-wrap svg,
.nmj-icon-wrap [class*="fa-"],
.q-card .ico i,
.q-card .ico svg,
.q-card .ico [class*="fa-"],
.stat .ico i,
.stat .ico svg,
.stat .ico [class*="fa-"],
.st .ico i,
.st .ico svg,
.st .ico [class*="fa-"],
.sim-card-v8 .st .ico i,
.sim-card-v8 .st .ico svg,
.sim-card-v8 .st .ico [class*="fa-"],
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl i,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl svg,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl [class*="fa-"],
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full i,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full svg,
.inline-flex.h-8.w-8.items-center.justify-center.rounded-full [class*="fa-"],
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full i,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full svg,
.inline-flex.h-9.w-9.items-center.justify-center.rounded-full [class*="fa-"],
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full i,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full svg,
.inline-flex.h-10.w-10.items-center.justify-center.rounded-full [class*="fa-"]{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 3) Residual literal utility colors -> site color */
.text-amber-50,.text-amber-100,.text-amber-200,.text-amber-300,.text-amber-400,.text-amber-500,.text-amber-600,.text-amber-700,.text-amber-800,
.text-orange-50,.text-orange-100,.text-orange-200,.text-orange-300,.text-orange-400,.text-orange-500,.text-orange-600,.text-orange-700,.text-orange-800,
.text-red-400,.text-red-500,.text-red-600,.text-red-700,.text-red-800,
.text-rose-400,.text-rose-500,.text-rose-600,.text-rose-700,.text-rose-800,
.text-pink-400,.text-pink-500,.text-pink-600,.text-pink-700,
.text-blue-400,.text-blue-500,.text-blue-600,.text-blue-700,
.text-sky-400,.text-sky-500,.text-sky-600,.text-sky-700,
.text-cyan-400,.text-cyan-500,.text-cyan-600,
.text-indigo-400,.text-indigo-500,.text-indigo-600,.text-indigo-700{
  color:var(--nmj-site-accent) !important;
}

.bg-amber-50,.bg-amber-100,.bg-orange-50,.bg-orange-100,.bg-red-50,.bg-rose-50,.bg-pink-50,.bg-blue-50,.bg-sky-50,.bg-cyan-50,.bg-indigo-50{
  background:var(--nmj-site-soft) !important;
}
.bg-amber-500,.bg-orange-500,.bg-red-500,.bg-rose-500,.bg-pink-500,.bg-blue-500,.bg-sky-500,.bg-cyan-500,.bg-indigo-500,
.hover\:bg-amber-600:hover,.hover\:bg-orange-600:hover,.hover\:bg-red-600:hover,.hover\:bg-rose-600:hover,.hover\:bg-pink-600:hover,.hover\:bg-blue-600:hover,.hover\:bg-sky-600:hover,.hover\:bg-cyan-600:hover,.hover\:bg-indigo-600:hover{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#fff !important;
}
.border-amber-100,.border-amber-200,.border-amber-300,.border-orange-100,.border-orange-200,.border-orange-300,
.border-red-100,.border-red-200,.border-red-300,.border-rose-100,.border-rose-200,.border-rose-300,
.border-pink-100,.border-pink-200,.border-blue-100,.border-blue-200,.border-blue-300,
.border-sky-100,.border-sky-200,.border-cyan-100,.border-cyan-200,.border-indigo-100,.border-indigo-200,
.ring-orange-300,.ring-amber-300,.ring-red-300,.ring-rose-300,.ring-pink-300,.ring-blue-300,.ring-sky-300,.ring-cyan-300,.ring-indigo-300{
  border-color:var(--nmj-site-soft-3) !important;
  --tw-ring-color:var(--nmj-site-soft-3) !important;
}

/* 4) Simulation page headings / monthly plan / count strips / hero buttons */
#nmj-sim-v8 .sec-h2,
#nmj-sim-v8 .sec-title,
#nmj-sim-v8 .result-title,
#nmj-sim-v8 .nmj-result-title,
#nmj-sim-v8 .match-msg,
#nmj-sim-v8 .nmj-count,
#nmj-sim-v8 .nmj-sim-more-toggle,
#nmj-sim-v8 .reco-banner .ttl,
#nmj-sim-v8 .reco-body .ttl,
#nmj-sim-v8 .reco-body .label,
#nmj-sim-v8 .reco-body .value,
#nmj-sim-v8 .campaign-bar .big,
#nmj-sim-v8 .campaign-bar .right,
#nmj-sim-v8 .reco-foot .big,
#nmj-sim-v8 .reco-foot .exp,
#nmj-sim-v8 .reco-foot .right,
#nmj-sim-v8 .title-row,
#nmj-sim-v8 .title-row *,
#nmj-sim-v8 .reco-head,
#nmj-sim-v8 .reco-head *{
  color:var(--nmj-site-text) !important;
}
#nmj-sim-v8 .match-msg,
#nmj-sim-v8 .nmj-count,
#nmj-sim-v8 .campaign-bar,
#nmj-sim-v8 .reco-foot,
#nmj-sim-v8 .reco-banner .reco-head,
#nmj-sim-v8 .nmj-sim-monthly .card,
#nmj-sim-v8 .reco-banner,
#nmj-sim-v8 .sim-card-v8 .tag,
#nmj-sim-v8 .badge-pill,
#nmj-sim-v8 .pill-chip,
#nmj-sim-v8 .reco-body .badge,
#nmj-sim-v8 .nmj-sim-monthly .pr,
#nmj-sim-v8 .reco-banner .reco-head .pr{
  background:var(--nmj-site-soft) !important;
  border-color:var(--nmj-site-soft-2) !important;
}

#nmj-sim-v8 .match-strip,
#nmj-sim-v8 .hit-strip,
#nmj-sim-v8 .count-strip{
  background:var(--nmj-site-soft) !important;
  border-color:var(--nmj-site-soft-2) !important;
}

/* 5) Result/sort tabs and hero group buttons */
#nmj-sim-v8 .card-opt,
#nmj-sim-v8 .sim-group-tabs .tab,
#nmj-sim-v8 .sort-tabs .tab,
#nmj-sim-v8 .nmj-sim-results .tab,
#nmj-sim-v8 .mode-chip,
#hero #topGroups .card-opt{
  color:var(--nmj-site-accent) !important;
  border-color:var(--nmj-site-soft-2) !important;
  background:#fff !important;
}
#nmj-sim-v8 .card-opt.active,
#nmj-sim-v8 .card-opt.is-active,
#nmj-sim-v8 .sim-group-tabs .tab.active,
#nmj-sim-v8 .sim-group-tabs .tab.is-active,
#nmj-sim-v8 .sort-tabs .tab.active,
#nmj-sim-v8 .sort-tabs .tab.is-active,
#nmj-sim-v8 .nmj-sim-results .tab.active,
#nmj-sim-v8 .nmj-sim-results .tab.is-active,
#nmj-sim-v8 .mode-chip.active,
#nmj-sim-v8 .mode-chip.is-active,
#hero #topGroups .card-opt.active,
#hero #topGroups .card-opt.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  background-image:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#fff !important;
}
#nmj-sim-v8 .card-opt.active i,
#nmj-sim-v8 .card-opt.is-active i,
#nmj-sim-v8 .sim-group-tabs .tab.active i,
#nmj-sim-v8 .sim-group-tabs .tab.is-active i,
#nmj-sim-v8 .sort-tabs .tab.active i,
#nmj-sim-v8 .sort-tabs .tab.is-active i,
#nmj-sim-v8 .nmj-sim-results .tab.active i,
#nmj-sim-v8 .nmj-sim-results .tab.is-active i,
#nmj-sim-v8 .mode-chip.active i,
#nmj-sim-v8 .mode-chip.is-active i,
#hero #topGroups .card-opt.active i,
#hero #topGroups .card-opt.is-active i{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 6) Section title icons / list icons / filter icons on non-button surfaces -> accent */
.sec-h2 i,
.sec-title i,
.q-chip i,
.brand-pill i,
.link-row i,
.company-card i.fa-solid,
.company-card i.fa-regular,
.nmj-filter-row i,
.nmj-search-toolbar i,
.nmj-toolbar i,
.result-chip i,
.brand-meta i,
.spec-table i,
.faq-list i,
.review-toolbar i,
.review-card i,
.review-filter i,
.review-search i,
details.brand-pill summary i,
summary.brand-pill i{
  color:var(--nmj-site-accent) !important;
  fill:var(--nmj-site-accent) !important;
  stroke:var(--nmj-site-accent) !important;
}

/* 7) Buttons keep white icons */
.btn-cta i,.btn i,.button i,.brand-btn i,.more-btn i,.gb-cta a i,.actions .btn i,
.btn-cta svg,.btn svg,.button svg,.brand-btn svg,.more-btn svg,.gb-cta a svg,.actions .btn svg,
.nmj-btn--official i,.nmj-btn--article i,.nmj-btn--line i,.nmj-btn-article-read i,
#runDiag i,#runDiag svg{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}

/* 8) Inline blue/purple fallback buttons from legacy output -> site colors */
a[style*="#c7d2fe"],
a[style*="#eef2ff"],
a[style*="#3730a3"],
.button[style*="#c7d2fe"],
.button[style*="#eef2ff"],
.button[style*="#3730a3"]{
  border-color:var(--nmj-site-soft-3) !important;
  background:var(--nmj-site-soft) !important;
  color:var(--nmj-site-accent) !important;
}

/* 9) Hero copy and CTA helper chips should not show literal orange/red */
.nmj-hero h1,
.nmj-hero .q-chip,
.nmj-hero .q-chip *,
.nmj-hero-label,
.nmj-hero-title,
.nmj-hero-meta,
.nmj-hero-summary{
  color:var(--nmj-site-text) !important;
}
.nmj-hero .q-chip{
  background:var(--nmj-site-soft) !important;
  border-color:var(--nmj-site-soft-2) !important;
}

/* 10) Filter/search/select widgets and counts */
select,
.nmj-filter-row select,
.nmj-search-toolbar select,
.review-toolbar select,
.filter-toolbar select,
.nmj-select,
.searchbox,
.search-input,
.nmj-search-input{
  border-color:var(--nmj-site-soft-3) !important;
}
.search-icon,
.nmj-search-icon,
.review-search .fa-magnifying-glass,
.review-filter .fa-filter,
.review-filter .fa-sliders{
  color:var(--nmj-site-accent) !important;
}

/* 11) Underlines / decorative borders using old orange */
.sec-h2:after,
.sec-title:after,
.title-underline,
.heading-underline{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
}


/* phase8fix_v3: simulation page admin-color sync + icon states */
#nmj-sim-v8 .result-toolbar h3,
#nmj-sim-v8 .monthly .title-row h3,
#nmj-sim-v8 .hero .badge,
#nmj-sim-v8 .hero h1,
#nmj-sim-v8 .hero .lead{
  color:var(--nmj-base,var(--nmj-btn1,#0f172a)) !important;
}
#nmj-sim-v8 .hero .badge{
  border-color:color-mix(in srgb, var(--nmj-base,var(--nmj-btn1,#0f172a)) 18%, white) !important;
  background:transparent !important;
}
#nmj-sim-v8 .mode-chip,
#nmj-sim-v8 .sort-tabs .tab{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  color:var(--nmj-base,var(--nmj-btn1,#0f172a)) !important;
  border-color:color-mix(in srgb, var(--nmj-base,var(--nmj-btn1,#0f172a)) 22%, white) !important;
  background:#fff !important;
}
#nmj-sim-v8 .mode-chip i,
#nmj-sim-v8 .mode-chip svg,
#nmj-sim-v8 .sort-tabs .tab i,
#nmj-sim-v8 .sort-tabs .tab svg{
  color:currentColor !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}
#nmj-sim-v8 .mode-chip.active,
#nmj-sim-v8 .mode-chip.is-active,
#nmj-sim-v8 .sort-tabs .tab.active,
#nmj-sim-v8 .sort-tabs .tab.is-active{
  background:linear-gradient(90deg,var(--nmj-btn1),var(--nmj-btn1-600)) !important;
  border-color:var(--nmj-btn1) !important;
  color:#fff !important;
}
#nmj-sim-v8 .mode-chip.active i,
#nmj-sim-v8 .mode-chip.active svg,
#nmj-sim-v8 .mode-chip.is-active i,
#nmj-sim-v8 .mode-chip.is-active svg{
  color:#fff !important;
  fill:#fff !important;
  stroke:#fff !important;
}
#nmj-sim-v8 .nmj-compat-badge,
#nmj-sim-v8 .nmj-sim-compat,
#nmj-sim-v8 .tag-compat,
#nmj-sim-v8 .match-msg,
#nmj-sim-v8 .nmj-top-result-count,
#nmj-sim-v8 .reco-banner,
#nmj-sim-v8 .reco-banner .reco-head,
#nmj-sim-v8 .reco-banner .reco-foot{
  background:transparent !important;
}
#nmj-sim-v8 .nmj-compat-badge,
#nmj-sim-v8 .nmj-sim-compat,
#nmj-sim-v8 .tag-compat,
#nmj-sim-v8 .match-msg,
#nmj-sim-v8 .nmj-top-result-count{
  color:var(--nmj-base,var(--nmj-btn1,#0f172a)) !important;
  border-color:color-mix(in srgb, var(--nmj-base,var(--nmj-btn1,#0f172a)) 22%, white) !important;
}
.nmj-site-accent-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  border-radius:999px !important;
  padding:.125rem .5rem !important;
  background:transparent !important;
  color:var(--nmj-base,var(--nmj-btn1,#0f172a)) !important;
  border:1px solid color-mix(in srgb, var(--nmj-base,var(--nmj-btn1,#0f172a)) 22%, white) !important;
}

/* phase8fix_v4: specific white icons + heading/icon drift cleanup only */
.fa-magnifying-glass,
.fa-layer-group,
.fa-comment-dots,
.fa-circle-info,
.fa-arrow-up-wide-short,
.fa-star,
.fa-mobile-screen-button,
.fa-right-left{
  color:#fff !important;
}

/* exact heading/icon alignment blocks reported by user */
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl,
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-xl{
  flex:0 0 2.5rem !important;
  width:2.5rem !important;
  height:2.5rem !important;
  line-height:1 !important;
  vertical-align:middle !important;
}
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl > i,
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-xl > i,
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-2xl > svg,
.card .flex.items-center.gap-3 > .inline-flex.h-10.w-10.items-center.justify-center.rounded-xl > svg{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:1em !important;
  height:1em !important;
  line-height:1 !important;
  vertical-align:middle !important;
  flex:none !important;
}
.card .flex.items-center.gap-3 > h2.text-xl,
.card .flex.items-center.gap-3 > h4.font-bold,
.card .flex.items-center.gap-3 > p.font-bold{
  margin:0 !important;
  line-height:1.35 !important;
  display:block !important;
}


/* phase8fix_v5: final fallback for white icons + exact alignment */
:is(i,svg,.svg-inline--fa)[class~="fa-magnifying-glass"],
:is(i,svg,.svg-inline--fa)[class~="fa-layer-group"],
:is(i,svg,.svg-inline--fa)[class~="fa-comment-dots"],
:is(i,svg,.svg-inline--fa)[class~="fa-circle-info"],
:is(i,svg,.svg-inline--fa)[class~="fa-arrow-up-wide-short"],
:is(i,svg,.svg-inline--fa)[class~="fa-star"],
:is(i,svg,.svg-inline--fa)[class~="fa-mobile-screen-button"],
:is(i,svg,.svg-inline--fa)[class~="fa-right-left"]{color:#fff!important;fill:#fff!important;stroke:#fff!important}
:is(i,svg,.svg-inline--fa)[class~="fa-magnifying-glass"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-layer-group"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-comment-dots"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-circle-info"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-arrow-up-wide-short"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-star"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-mobile-screen-button"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-right-left"]::before{color:#fff!important}
.nmj-iconbox-fix{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 2.5rem!important;width:2.5rem!important;height:2.5rem!important;line-height:1!important;vertical-align:middle!important}
.nmj-iconbox-fix > :is(i,svg,.svg-inline--fa){display:inline-flex!important;align-items:center!important;justify-content:center!important;width:1em!important;height:1em!important;line-height:1!important;vertical-align:middle!important;flex:none!important}
.nmj-heading-fix{margin:0!important;line-height:1.35!important}


/* phase8fix_v6: white icon classes + wider search input */
:is(i,svg,.svg-inline--fa)[class~="fa-rotate"],
:is(i,svg,.svg-inline--fa)[class~="fa-fire"],
:is(i,svg,.svg-inline--fa)[class~="fa-ranking-star"],
:is(i,svg,.svg-inline--fa)[class~="fa-clock-rotate-left"],
:is(i,svg,.svg-inline--fa)[class~="fa-circle-question"],
:is(i,svg,.svg-inline--fa)[class~="fa-up-right-from-square"],
.brand-pill.cursor-pointer :is(i,svg,.svg-inline--fa),
summary.brand-pill.cursor-pointer :is(i,svg,.svg-inline--fa){color:#fff!important;fill:#fff!important;stroke:#fff!important}
:is(i,svg,.svg-inline--fa)[class~="fa-rotate"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-fire"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-ranking-star"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-clock-rotate-left"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-circle-question"]::before,
:is(i,svg,.svg-inline--fa)[class~="fa-up-right-from-square"]::before,
.brand-pill.cursor-pointer i::before,
summary.brand-pill.cursor-pointer i::before{color:#fff!important}

.nmj-search-form{width:100%!important}
.nmj-search-form .nmj-search-input-wrap{flex:1 1 42rem!important;min-width:min(100%,26rem)!important}
.nmj-search-form .nmj-search-sort{flex:0 0 auto!important;width:auto!important;min-width:11rem!important;max-width:100%!important}
.nmj-search-form .nmj-search-submit{flex:0 0 auto!important;white-space:nowrap!important}
@media (min-width: 768px){
  .nmj-search-form{display:flex!important;align-items:center!important;gap:.75rem!important}
  .nmj-search-form .nmj-search-input-wrap{min-width:0!important;width:100%!important}
}