/*
 * PEACE NET Diagnosis — 事業まるごと課題診断（STEP1）追加スタイル
 *
 * assets/diagnosis.css（共通の card / btn / opts / rail / radar 等の
 * 基礎デザイン）を土台に読み込む前提。ここでは5カテゴリ固有の配色と、
 * 集客課題診断にはない新規パーツ（カテゴリカード・診断の先にある
 * ものセクション・すみ分け注記）のみを追加する。
 *
 * 配色は既存 diagnosis.css と同じ考え方（サイト側CSS変数を
 * var(--サイト側変数, フォールバック値) の形で参照）を踏襲しつつ、
 * 5カテゴリ分の識別用カラーを追加している。keiei/shukyaku/jouhou は
 * 既存の M/P 相当の色をそのまま再利用し、gyomu は既存 R の色を再利用、
 * hito のみ新規（属人化パターンへの注意喚起として、落ち着いたテラコッタ系）。
 */

.pnd-company-app{
  --keiei:var(--color-primary-dark, #1B2E3F);
  --shukyaku:var(--color-primary, #2C5273);
  --gyomu:var(--color-taupe, #8A8577);
  --hito:#A3372B;
  --jouhou:var(--color-accent-text, #8FA9BF);
}

/* カテゴリ紹介カード（診断前セクション） */
.pnd-company-app .cat-grid{
  display:flex; flex-direction:column; gap:10px;
  margin:24px 0 26px;
}
.pnd-company-app .cat-card{
  display:flex; flex-direction:column; gap:4px;
  background:var(--tint); border:1px solid var(--line); border-radius:10px;
  padding:14px 16px;
}
.pnd-company-app .cat-card b{font-size:14.5px; color:var(--ink); font-weight:700}
.pnd-company-app .cat-card span{font-size:13.5px; color:var(--muted)}

/* 「診断の先にあるもの」セクション */
.pnd-company-app .journey{
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:20px 0; margin:6px 0 22px;
}
.pnd-company-app .journey h2{font-size:17px; margin-bottom:8px}
.pnd-company-app .journey .lead{margin-bottom:0}

/* 結果ページ下部のすみ分け注記（既存診断との案内）
   ※ .note 自体のスタイルは共有 diagnosis.css 側の .pnd-app .note に
   統合済み（[pnd_company_diagnosis] のルート要素は .pnd-app と
   .pnd-company-app の両方を持つため、そちらが適用される）。 */

@media (max-width:480px){
  .pnd-company-app .cat-card{padding:12px 14px}
}