/* ==========================================================================
   case.css — 案例列表页专属样式（仅 page-case.php 挂载）
   规范：BEM 命名 / 仅使用全局 CSS 变量 / 移动端优先 / 禁止 !important
   ========================================================================== */

/* ==========================================================================
   1. 分类 Tab + 案例网格
   ========================================================================== */
.l-case-list .c-tabs {
  margin-bottom: var(--gap-lg);
  padding-bottom: 0;
}
.l-case-list {
  padding-bottom: 0;
}
.l-case-panel[hidden] {
  display: none;
}

.l-case-card .c-card__meta {
  font-weight: 600;
  color: var(--color-primary);
}

/* ==========================================================================
   2. 分页区
   ========================================================================== */
.l-case-pagination {
  padding-block: 0 var(--section-pad-desktop);
}

@media (max-width: 767px) {
  .l-case-pagination {
    padding-block: 0 var(--section-pad-mobile);
  }
}

/* ==========================================================================
   3. 能力矩阵（l-section-accent 内，浅蓝底 → 深色文字）
   ========================================================================== */
.l-case-matrix__scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
  scrollbar-width: thin;
}

.l-case-matrix__table {
  min-width: 760px;
  border-collapse: collapse;
  color: var(--color-text);
}

.l-case-matrix__table th,
.l-case-matrix__table td {
  padding: 16px 18px;
  text-align: left;
  border-bottom: 1px solid rgba(0, 96, 176, 0.18);
  font-size: 15px;
  vertical-align: middle;
}

.l-case-matrix__table thead th {
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--color-primary-dark);
  border-bottom-width: 2px;
}

.l-case-matrix__table tbody th {
  font-weight: 700;
  color: var(--color-text);
  white-space: nowrap;
}

.l-case-matrix__table td.is-yes {
  color: var(--color-primary);
}

.l-case-matrix__table td.is-yes svg {
  width: 18px;
  height: 18px;
  color: var(--color-primary);
}

.l-case-matrix__table td.is-no {
  color: var(--color-text-muted);
  text-align: center;
}

.l-case-matrix__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: var(--gap-lg);
}
