/* ===== 変えたいことから探す：追加CSS（/assets/css/needs.css として新規作成） ===== */
/* トップ・ハブのカード。既存 .section-card をそのまま使い、見出しサイズだけ調整 */
.need-card .card-head h3{font-size:19px;margin:6px 0 0}
.need-card .card-body p{margin:0 0 14px}
/* 8枚目「まだ言葉にできない」だけ紺にして相談の入口と分かるようにする */
.need-card--consult .card-head{background:var(--navy);border-top-color:var(--navy)}
.need-card--consult .card-head h3,.need-card--consult .card-head span{color:#fff}
/* 要望ページ：何を変えるのか（番号付き） */
.need-steps{padding-left:1.4em}
.need-steps li{margin-bottom:8px}
.need-method{font-weight:700}
.need-method a{color:var(--orange)}
/* 要望ページ末尾のCTA（既存 .cta-block を記事幅で使う） */
.need-cta{margin-top:48px}
.need-cta h2{border:0;padding:0;color:#fff}
/* ハブページ：手段の言葉の対応表 */
.need-phrase-table{width:100%;border-collapse:collapse;font-size:15px}
.need-phrase-table th,.need-phrase-table td{border:1px solid var(--line);padding:14px;text-align:left;vertical-align:top}
.need-phrase-table thead th{background:var(--navy);color:#fff}
.need-phrase-table tbody th{background:var(--soft);width:34%}
.need-phrase-table a{color:var(--orange);font-weight:700}
@media(max-width:800px){
  .need-phrase-table thead{display:none}
  .need-phrase-table tr{display:block;border:1px solid var(--line);margin-bottom:12px}
  .need-phrase-table th,.need-phrase-table td{display:block;border:0;width:auto}
	.need-phrase-table tbody th{width:auto;}
}

/* トップ：hero-panel 削除後、ヒーローを1カラムにする */
.hero-layout--single{grid-template-columns:1fr}
.hero-layout--single .hero-copy p{max-width:900px}
/* ハブ：カード2列 */
.need-hub-grid{margin-bottom:8px}
