/* ============================================================
   brand.css —— 品牌榜专属页（/brand/index.html?id=N）
   信息架构：面包屑 → 榜单头卡 → 上榜厂家列表 → 底部 CTA
   视觉语言与 provider.css 一脉相承；类名统一 bk- 前缀，避免与 pv- 冲突。
   颜色/间距全部引用 tokens.css，禁止裸 HEX。
   ============================================================ */

/* ---------- 榜单头卡 ---------- */
.bk-hero{background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-md);
  padding:var(--space-6);border-left:var(--stroke-accent) solid var(--color-primary);}
.bk-hero-top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;
  gap:var(--space-3);}
.bk-hero-text{flex:1 1 320px;min-width:0;}
.bk-title{font-size:var(--fs-h2);margin:0;line-height:var(--lh-heading);letter-spacing:var(--ls-cn-title);}
.bk-subtitle{margin-top:var(--space-2);font-size:var(--fs-body);color:var(--color-text-secondary);}
.bk-status{flex:0 0 auto;font-size:var(--fs-xs);font-weight:var(--fw-bold);white-space:nowrap;
  padding:4px 10px;border-radius:var(--radius-pill);
  background:var(--color-success-bg);color:var(--color-success-text);
  border:1px solid var(--color-success-border);}
.bk-desc{margin-top:var(--space-4);font-size:var(--fs-body);line-height:var(--lh-relaxed);
  color:var(--color-text-body);max-width:var(--container-prose);}
.bk-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--space-5);
  padding-top:var(--space-5);border-top:1px dashed var(--color-border);}
.bk-fact{display:inline-flex;align-items:baseline;gap:6px;font-size:var(--fs-xs);
  background:var(--color-brand-50);border:1px solid var(--color-brand-200);
  color:var(--color-brand-800);border-radius:var(--radius-pill);padding:5px 12px;}
.bk-fact .f-label{color:var(--color-text-tertiary);font-weight:var(--fw-bold);letter-spacing:var(--ls-tag);}

/* ---------- 上榜列表 ---------- */
.bk-block{margin-top:var(--space-10);}
.bk-block-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);
  margin-bottom:var(--space-4);flex-wrap:wrap;}
.bk-block-head h2{margin:0;font-size:var(--fs-h3);}
.bk-block-head .h-note{font-size:var(--fs-xs);color:var(--color-text-tertiary);}
.bk-list{display:grid;gap:var(--space-3);}

.bk-item{display:flex;align-items:stretch;gap:var(--space-4);
  background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-sm);
  transition:box-shadow var(--dur-std),transform var(--dur-std);}
.bk-item:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}

/* 左侧名次：前三用 CTA 橙强调，其余用主色 */
.bk-rank{flex:0 0 auto;width:56px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;align-self:center;gap:2px;padding:var(--space-2) 0;
  border-radius:var(--radius-md);background:var(--color-brand-50);
  border:1px solid var(--color-brand-200);color:var(--color-primary);}
.bk-rank.is-top{background:var(--color-accent-50);border-color:var(--color-accent-300);
  color:var(--color-cta-dark);}
.bk-rank .rk-no{font-size:var(--fs-h3);font-weight:var(--fw-bold);line-height:var(--lh-figure);
  letter-spacing:var(--ls-num);}
.bk-rank .rk-unit{font-size:var(--fs-xxs);color:var(--color-text-tertiary);}
.bk-rank.is-top .rk-unit{color:var(--color-accent-600);}

.bk-item-main{flex:1 1 auto;min-width:0;}
.bk-item-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.bk-name{font-weight:var(--fw-bold);color:var(--color-text-title);font-size:var(--fs-lead);
  line-height:var(--lh-tight);}
.bk-name:hover{color:var(--color-link-hover);}
.bk-badge{font-size:var(--fs-xxs);font-weight:var(--fw-bold);white-space:nowrap;
  padding:3px 9px;border-radius:var(--radius-pill);
  background:var(--color-cta);color:var(--color-cta-text);}
.bk-reason{margin-top:6px;font-size:var(--fs-sm);color:var(--color-text-body);
  line-height:var(--lh-relaxed);}
.bk-meta{margin-top:6px;font-size:var(--fs-xs);color:var(--color-text-tertiary);}

@media (max-width:600px){
  .bk-item{gap:var(--space-3);padding:var(--space-3);}
  .bk-rank{width:46px;}
  .bk-name{font-size:var(--fs-body);}
}

/* ---------- 底部 CTA ---------- */
.bk-cta{margin-top:var(--space-10);background:var(--color-brand-50);border:1px solid var(--color-brand-200);
  border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-wrap:wrap;
  align-items:center;justify-content:space-between;gap:var(--space-4);}
.bk-cta .t{font-weight:var(--fw-bold);color:var(--color-text-title);font-size:var(--fs-h4);}
.bk-cta .s{font-size:var(--fs-sm);color:var(--color-text-secondary);margin-top:4px;
  max-width:var(--container-prose);}

/* ---------- 未找到 / 加载态 ---------- */
.bk-missing{text-align:center;padding:var(--space-12) var(--space-4);}
.bk-missing h2{margin-bottom:var(--space-3);}

/* ---------- 栏目列表模式（全部榜单卡片） ---------- */
.bk-rankcards{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));}
.bk-rankcard{display:block;padding:var(--space-5);border:1px solid var(--border,#e5e7eb);border-radius:var(--radius,12px);background:#fff;color:inherit;text-decoration:none;transition:box-shadow .15s ease,transform .15s ease;}
.bk-rankcard:hover{box-shadow:var(--shadow,0 6px 24px rgba(0,0,0,.08));transform:translateY(-2px);}
.bk-rankcard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);}
.bk-rankcard-head .bk-title{font-size:1.06rem;margin:0;}
.bk-rankcard-head .btn{white-space:nowrap;flex-shrink:0;}
.bk-rankcard .bk-subtitle{margin:var(--space-2) 0 0;color:var(--text-2,#5f6b7a);font-size:.92rem;}
.bk-rankcard-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--space-4);}