/* ==========================================================
   buttons.css — pill-btn / CTAバナー / カテゴリチップ
   ========================================================== */
.topbar .pill-btn {
	min-height: 60px;
	position: relative;
}

.pill-btn{
	min-height: 80px;
  display:flex;align-items:center;gap:8px;padding:9px 18px;border-radius:6px;color:#fff;
  font-size:13px;font-weight:700;white-space:nowrap;border:none;
}
.pill-btn small{display:block;font-weight:400;font-size:10px;opacity:.9;}
.pill-line{background:var(--line-green);}
.pill-orange{background:var(--orange);}

.cta-banner{background:var(--navy-dark);color:#fff;text-align:center;padding:40px 20px 30px;}
.cta-banner h2{font-size:22px;letter-spacing:.04em;color:var(--gold);margin-bottom:8px;}
.cta-banner p{font-size:13px;color:#c9cddb;margin-bottom:22px;}
.cta-buttons{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;}
.cta-buttons > div{
  background:#fff;color:var(--navy);border-radius:8px;padding:14px 26px;
  display:flex;align-items:center;gap:12px;min-width:220px;justify-content:center;
}
.cta-buttons .num{font-size:18px;font-weight:700;}
.cta-buttons .sub{font-size:11px;color:var(--muted);}
.cta-buttons .g,
.cta-buttons .o{
  display:flex;align-items:center;justify-content:center;gap:10px;
  min-width:220px;padding:14px 26px;border-radius:8px;
  color:#fff;font-weight:700;font-size:13px;text-align:left;line-height:1.5;
}
.cta-buttons .g{background:var(--line-green);}
.cta-buttons .o{background:var(--orange);}
.cta-buttons .g svg,
.cta-buttons .o svg{flex-shrink:0;}

@media screen and (max-width: 860px) {
	.cta-buttons .g, .cta-buttons .o {
    padding: 14px 3%;
    width: 100%;
		max-width: 330px;
}
}

.mid-cta{
  background:linear-gradient(120deg,var(--navy),var(--navy-dark));color:#fff;border-radius:10px;
  padding:30px;margin:36px 0;text-align:center;
}
.mid-cta h3{color:var(--gold);font-size:17px;margin-bottom:8px;}
.mid-cta p{font-size:13px;color:#d8dbe6;margin-bottom:18px;}
.mid-cta .btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}

.article-body .mid-cta h3{
  color: var(--gold);
  font-size: 17px;
  margin-bottom: 8px;
}

.article-body .mid-cta p{font-size:13px;color:#d8dbe6;margin-bottom:18px;}

/* カテゴリ絞り込みチップ（ブログ一覧・買取事例一覧で共用） */
.cat-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:40px;}
.cat-chips.centered{justify-content:center;}
.cat-chip{
  font-size:12.5px;font-weight:600;padding:7px 16px;border-radius:20px;border:1px solid var(--border);
  color:var(--navy);background:var(--cream);
}
.cat-chip.active, .cat-chip:hover{background:var(--navy);color:#fff;border-color:var(--navy);}

.pagination{display:flex;justify-content:center;gap:8px;margin:8px 0 40px;}
.pagination a, .pagination span{
  min-width:36px;height:36px;padding:0 10px;border:1px solid var(--border);border-radius:6px;
  display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--navy);font-weight:600;
}
.pagination .current, .pagination a.active{background:var(--navy);color:#fff;border-color:var(--navy);}

@media screen and (max-width: 860px) {
	.pill-btn {
		min-width: 217px;
	}
}
