/* カテゴリ「支援会社・サービスの選び方」専用（category-choosing-service.php）。
   .blog-hub の変数（blog-hub.css / theme-vars.css）を使う。構造のみ・色は変数から。 */
.blog-hub.cs-hub .cs-crumb{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0 0 28px; font-size:13px; color:var(--fg-dim); }
.blog-hub.cs-hub .cs-crumb a{ color:var(--fg-muted); }
.blog-hub.cs-hub .cs-crumb a:hover{ color:var(--accent); text-decoration:underline; }
.blog-hub.cs-hub .cs-crumb [aria-current]{ color:var(--fg); font-weight:600; }

/* ---------- 全体幅（既定960pxでは狭いので広げる） ---------- */
.blog-hub.cs-hub .bh-inner{ max-width:1160px; }

/* ---------- L0: 6つの切り口（3列・同じ高さに揃える） ---------- */
.blog-hub.cs-hub .cs-axes{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.blog-hub.cs-hub .cs-axis{ display:flex; flex-direction:column; background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color .2s, box-shadow .2s; }
.blog-hub.cs-hub .cs-axis:hover{ border-color:var(--accent); box-shadow:0 10px 28px var(--accent-shadow); }
.blog-hub.cs-hub .cs-axis__main{ position:relative; display:flex; flex-direction:column; gap:8px; padding:22px 22px 14px 70px; flex:none; }
.blog-hub.cs-hub .cs-axis__no{ position:absolute; left:20px; top:20px; width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); font-weight:700; font-family:var(--font-en); }
.blog-hub.cs-hub .cs-axis__name{ font-size:18px; font-weight:700; line-height:1.4; }
.blog-hub.cs-hub .cs-axis__desc{ font-size:13px; line-height:1.7; color:var(--fg-muted); }
.blog-hub.cs-hub .cs-axis__count{ font-size:12px; font-weight:600; color:var(--accent); }

/* ---------- チップ（小分類・他の切り口） ---------- */
.blog-hub.cs-hub .cs-chips{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0 22px 20px; }
.blog-hub.cs-hub .cs-chips li{ margin:0; }
.blog-hub.cs-hub .cs-chips a{ display:inline-flex; align-items:center; gap:8px; padding:7px 14px; font-size:13px; background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--radius-pill); transition:all .2s; }
.blog-hub.cs-hub .cs-chips a:hover{ background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
.blog-hub.cs-hub .cs-chips small{ font-family:var(--font-en); font-size:11px; color:var(--accent); font-weight:700; }
.blog-hub.cs-hub .cs-chips--lg{ padding:0; }
.blog-hub.cs-hub .cs-chips--lg a{ padding:10px 18px; font-size:14px; }

/* ---------- L1: 小分類カード ---------- */
.blog-hub.cs-hub .cs-groups{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.blog-hub.cs-hub .cs-group{ display:flex; flex-direction:column; padding:22px; background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); }
.blog-hub.cs-hub .cs-group__name{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 0 14px; padding:0 0 12px 15px; font-size:17px; font-weight:700; line-height:1.4; border-bottom:2px solid var(--accent-soft); position:relative; }
.blog-hub.cs-hub .cs-group__name::before{ content:""; position:absolute; left:0; top:.2em; bottom:calc(12px + .2em); width:5px; border-radius:3px; background:var(--accent); }
.blog-hub.cs-hub .cs-group__name a:hover{ color:var(--accent); }
.blog-hub.cs-hub .cs-group__name small{ flex:none; font-size:12px; color:var(--accent); font-weight:600; }
.blog-hub.cs-hub .cs-more{ margin-top:auto; padding-top:14px; font-size:13px; font-weight:600; color:var(--accent); }
.blog-hub.cs-hub .cs-more:hover{ color:var(--cv-orange); }

/* ---------- 記事リスト ---------- */
.blog-hub.cs-hub .cs-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.blog-hub.cs-hub .cs-item{ margin:0; }
.blog-hub.cs-hub .cs-item a{ display:block; padding:14px 18px; font-size:15px; line-height:1.6; background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-sm); transition:all .2s; }
.blog-hub.cs-hub .cs-item a:hover{ border-color:var(--accent); background:var(--accent-soft); }
.blog-hub.cs-hub .cs-item.is-hub a{ border-color:var(--accent); background:var(--bg-soft); font-weight:600; }
.blog-hub.cs-hub .cs-list--compact{ gap:8px; }
.blog-hub.cs-hub .cs-list--compact .cs-item a{ padding:10px 14px; font-size:13.5px; }
.blog-hub.cs-hub .cs-badge{ display:inline-block; margin-right:10px; padding:2px 9px; font-size:11px; font-weight:700; color:#fff; background:var(--accent); border-radius:var(--radius-pill); vertical-align:1px; }

@media (max-width:1000px){
  .blog-hub.cs-hub .cs-axes, .blog-hub.cs-hub .cs-groups{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px){
  .blog-hub.cs-hub .cs-axes, .blog-hub.cs-hub .cs-groups{ grid-template-columns:1fr; }
  .blog-hub.cs-hub .bh-title{ font-size:26px; }
}

/* 本文内のパンくず（ホーム›ブログ›…）を正とし、SWELL標準の重複パンくずは隠す */
body:has(.cs-hub) .p-breadcrumb{ display:none; }