/* ==========================================================================
   Clash官网 · compare.css
   横向评测页专属:对比总表列宽约束 + 逐款点评条目 + 结论面板
   全部取值引用 base.css 的 :root 设计令牌
   ========================================================================== */

/* --- 对比总表:控制最小宽度,窄屏交给 .table-scroll 横向滚动 --- */
.cmp-table {
  min-width: 880px;
}

.cmp-table td strong {
  color: var(--c-ink);
}

.cmp-table td .mark {
  margin-left: 6px;
}

/* --- 逐款点评条目 --- */
.cmp-list {
  border-top: 1px solid var(--c-line);
}

.cmp-item {
  border: 1px solid var(--c-line);
  border-top: 0;
  background: var(--c-pane);
  padding: 24px 26px;
  position: relative;
  overflow: hidden;
}

.cmp-item:hover {
  background: var(--c-pane-2);
}

/* 悬停:顶部一次自左向右电光蓝扫光,与全站动效语言一致 */
.cmp-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: -30%;
  width: 30%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-beam), transparent);
  opacity: 0;
  pointer-events: none;
}

.cmp-item:hover::before {
  animation: cmpSweep 0.6s ease-out 1;
}

@keyframes cmpSweep {
  0%   { left: -30%; opacity: 1; }
  100% { left: 100%; opacity: 0; }
}

.cmp-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 6px;
}

.cmp-head h3 {
  margin: 0;
  font-size: 17px;
}

.cmp-code {
  font-family: var(--f-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--c-core-deep);
  border: 1px solid var(--c-line);
  padding: 2px 8px;
  flex-shrink: 0;
}

.cmp-meta {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-ink-soft);
  margin-bottom: 12px;
}

.cmp-item > p:last-child {
  margin-bottom: 0;
  color: var(--c-ink-soft);
  font-size: 14px;
}

/* --- 结论面板 --- */
.cmp-verdict {
  border-top: 2px solid var(--c-core);
}

.cmp-verdict h2 {
  margin-bottom: 12px;
}

.cmp-verdict p {
  color: var(--c-ink-soft);
  max-width: 820px;
}

.cmp-verdict .hero-acts {
  margin-top: 20px;
  margin-bottom: 0;
}

/* --- 响应式 --- */
@media (max-width: 640px) {
  .cmp-item {
    padding: 18px;
  }
}