/* ==========================================================================
   anli.css —— 成功案例列表页私有样式
   页面结构：hero → 数据墙 → 案例大卡网格 → 行业分布条 → 为什么找我们 → CTA
   ========================================================================== */

/* ---------- Hero：banner-anli.jpg 做背景，叠深色渐变保证文字可读 ---------- */
.anli-hero {
  position: relative;
  color: #fbfaf6;
  padding: 130px 0 110px;
  background:
    linear-gradient(120deg, rgba(35, 36, 31, .82) 0%, rgba(63, 95, 58, .55) 55%, rgba(35, 36, 31, .35) 100%),
    url("../images/banner-anli.jpg") center / cover no-repeat;
}
.anli-hero .hero-eyebrow {
  font-size: .8rem;
  letter-spacing: .3em;
  color: #cfe0c8;
  margin-bottom: 14px;
}
.anli-hero h1 {
  color: #fbfaf6;
  margin-bottom: 18px;
}
.anli-hero .hero-sub {
  max-width: 720px;
  color: rgba(251, 250, 246, .85);
  font-size: 1.02rem;
  margin: 0;
}

/* ---------- 数据墙 ---------- */
.stats-wall { background: var(--rice-deep); }
.stats-wall .stats { gap: 16px; }
.stats-wall .stat-num { font-size: 2.4rem; }
.stats-note {
  text-align: center;
  font-size: .8rem;
  color: var(--ink-soft);
  margin-top: 22px;
}

/* ---------- 案例大卡网格 ---------- */
.case-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
.case-card {
  display: block;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.case-thumb { position: relative; }
.case-thumb img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.case-thumb .tag {
  position: absolute;
  left: 16px; bottom: 16px;
  background: rgba(251, 250, 246, .94);
}
.case-card h3 {
  margin: 20px 24px 10px;
  font-size: 1.2rem;
}
.case-card p {
  margin: 0 24px 24px;
  font-size: .92rem;
}

/* ---------- 行业分布条 ---------- */
.industry-sec { background: var(--bamboo-mist); }
.ind-bar {
  display: flex;
  height: 64px;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.ind-seg {
  background: var(--bamboo);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .82rem;
  white-space: nowrap;
  overflow: hidden;
}
.ind-seg:nth-child(1) { flex: 18; }
.ind-seg:nth-child(2) { flex: 12; }
.ind-seg:nth-child(3) { flex: 10; }
.ind-seg:nth-child(4) { flex: 9; }
.ind-seg:nth-child(5) { flex: 14; background: var(--bamboo-deep); }
.ind-seg:nth-child(6) { flex: 11; }
.ind-seg:nth-child(7) { flex: 8; }
.ind-seg:nth-child(8) { flex: 18; background: var(--bamboo-deep); }
.ind-note { font-size: .8rem; color: var(--ink-soft); margin-top: 14px; }

/* ---------- 为什么找我们 ---------- */
.why-sec { background: var(--paper); }

/* ---------- CTA 横幅：竹青实底 + 米白字 ---------- */
.cta-banner {
  background: var(--bamboo-deep);
  padding: 56px 0;
}
.cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
}
.cta-inner h2 { color: #fbfaf6; margin-bottom: 8px; }
.cta-inner p { color: rgba(251, 250, 246, .8); margin: 0; }
.btn-light {
  background: #fbfaf6;
  color: var(--bamboo-deep);
}
.btn-light:hover {
  background: #fff;
  color: var(--bamboo-deep);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, .25);
}

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  .case-grid { grid-template-columns: 1fr; }
  .ind-bar { flex-direction: column; height: auto; }
  .ind-seg { padding: 10px; justify-content: flex-start; }
}