/* ============================================================
   案例详情页（case-hanshu.html）专用样式
   ============================================================ */

.case-hero{ padding:150px 0 80px; }
.case-hero h1{ font-size:clamp(30px,4.6vw,52px); }

.case-kpi-strip{
  display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:44px;
}
.case-kpi-strip > div{
  background:rgba(196,166,90,.07); border:1px solid var(--line);
  border-radius:var(--radius); padding:20px 12px; text-align:center;
}
.case-kpi-strip strong{ display:block; font-size:clamp(17px,2vw,24px); font-weight:800; color:var(--gold); }
.case-kpi-strip span{ display:block; font-size:12.5px; color:var(--muted); margin-top:6px; }

/* 目标卡 */
.goal{
  background:linear-gradient(165deg,var(--card),var(--bg-alt));
  border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:30px 26px;
  transition:transform .3s var(--ease), border-color .3s;
}
.goal:hover{ transform:translateY(-4px); border-color:var(--line); }
.goal-tag{
  display:inline-block; font-size:12px; color:var(--gold-lt); border:1px solid var(--line);
  border-radius:100px; padding:4px 14px; background:rgba(196,166,90,.08); margin-bottom:16px;
}
.goal h3{ font-size:17.5px; font-weight:700; margin-bottom:10px; }
.goal p{ color:var(--muted); font-size:14.2px; }

/* 策略条 */
.strat{
  background:linear-gradient(165deg,rgba(23,41,63,.85),rgba(11,29,45,.55));
  border:1px solid var(--line-soft); border-left:2px solid var(--gold);
  border-radius:var(--radius); padding:26px 28px; margin-bottom:16px;
  transition:border-color .3s;
}
.strat:hover{ border-color:var(--line); }
.strat-head{ display:flex; align-items:baseline; gap:14px; margin-bottom:10px; flex-wrap:wrap; }
.strat-step{
  font-size:12px; font-weight:800; letter-spacing:1.5px; color:#16233A;
  background:linear-gradient(135deg,var(--gold-lt),var(--gold));
  padding:3px 12px; border-radius:100px; white-space:nowrap;
}
.strat-head h3{ font-size:17.5px; font-weight:700; }
.strat p{ color:var(--muted); font-size:14.2px; }

.value-row{ margin-top:30px; }
.value{
  background:rgba(196,166,90,.06); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:26px 24px;
}
.value h3{ font-size:16.5px; color:var(--gold-lt); font-weight:700; margin-bottom:10px; }
.value p{ color:var(--muted); font-size:13.8px; }

/* 时间轴 */
.tl{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; position:relative; }
.tl::before{
  content:""; position:absolute; top:7px; left:6%; right:6%; height:1px;
  background:linear-gradient(90deg,transparent,var(--line),var(--line),transparent);
}
.tl-item{ position:relative; padding-top:30px; }
.tl-item::before{
  content:""; position:absolute; top:0; left:0; width:15px; height:15px; border-radius:50%;
  background:var(--bg); border:2.5px solid var(--gold);
}
.tl-date{
  display:inline-block; font-size:12.5px; font-weight:700; color:var(--gold);
  letter-spacing:.6px; margin-bottom:10px;
}
.tl-item h3{ font-size:16.5px; font-weight:700; margin-bottom:8px; }
.tl-item p{ color:var(--muted); font-size:13.8px; }

/* 数据区 */
.data-cols{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:34px; }
.data-block{
  background:linear-gradient(165deg,var(--card),var(--bg-alt));
  border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:30px 28px;
}
.data-block h3{ font-size:17px; font-weight:700; color:var(--gold-lt); margin-bottom:16px; }
.data-block ul li{
  color:var(--muted); font-size:14px; padding-left:16px; position:relative; margin-bottom:9px;
}
.data-block ul li b{ color:var(--text); font-weight:700; }
.data-block ul li::before{ content:"▪"; position:absolute; left:0; color:var(--gold); }
.eff-row{
  display:flex; gap:14px; margin-top:20px;
}
.eff-row > div{
  flex:1; text-align:center; background:rgba(196,166,90,.08);
  border:1px solid var(--line); border-radius:var(--radius); padding:14px;
}
.eff-row span{ display:block; font-size:12px; color:var(--muted); letter-spacing:1px; }
.eff-row b{ display:block; font-size:24px; font-weight:800; color:var(--gold); margin-top:4px; }

.tbl-title{ font-size:15.5px; font-weight:700; color:var(--gold-lt); margin-bottom:14px; }
.tbl-wrap{ overflow-x:auto; border:1px solid var(--line-soft); border-radius:var(--radius); }
.kpi-table{ width:100%; border-collapse:collapse; min-width:560px; font-size:13.8px; }
.kpi-table th{
  text-align:left; font-weight:700; color:var(--gold); font-size:12.5px; letter-spacing:.5px;
  background:rgba(196,166,90,.09); padding:12px 16px; border-bottom:1px solid var(--line-soft);
}
.kpi-table td{ padding:12px 16px; border-bottom:1px solid var(--line-soft); color:var(--muted); font-variant-numeric:tabular-nums; }
.kpi-table td:first-child{ color:var(--text); font-weight:600; }
.kpi-table tbody tr:last-child td{ border-bottom:0; }
.kpi-table tbody tr:hover td{ background:rgba(196,166,90,.05); }

.second-field{
  margin-top:34px; border:1px solid var(--line); border-radius:var(--radius-lg);
  background:rgba(196,166,90,.05); padding:32px 30px;
}
.second-field > h3{ font-size:18px; font-weight:800; color:var(--gold-lt); margin-bottom:20px; }
.sf-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.sf-grid > div{
  background:rgba(255,255,255,.03); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:20px 18px;
}
.sf-grid b{ display:block; font-size:14.5px; color:var(--gold-lt); margin-bottom:8px; }
.sf-grid p{ color:var(--muted); font-size:13.5px; }

/* 阶段卡 */
.ph-tag{
  display:inline-block; font-size:12px; color:var(--gold-lt); border:1px solid var(--line);
  border-radius:100px; padding:4px 12px; background:rgba(196,166,90,.08); margin-bottom:14px;
}
.phase{
  background:linear-gradient(165deg,var(--card),var(--bg-alt));
  border:1px solid var(--line-soft); border-radius:var(--radius-lg); padding:26px 22px;
  transition:transform .3s var(--ease), border-color .3s;
}
.phase:hover{ transform:translateY(-4px); border-color:var(--line); }
.phase h3{ font-size:16.5px; font-weight:700; margin-bottom:10px; }
.phase p{ color:var(--muted); font-size:13.6px; }

/* 报告截图 */
.report-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.report-shot{
  background:rgba(255,255,255,.03); border:1px solid var(--line-soft);
  border-radius:var(--radius-lg); overflow:hidden;
  transition:transform .3s var(--ease), border-color .3s;
}
.report-shot:hover{ transform:translateY(-4px); border-color:var(--line); }
.report-shot img{ width:100%; display:block; aspect-ratio:16/9; object-fit:cover; }
.report-shot figcaption{
  padding:13px 18px; font-size:13px; color:var(--muted);
  border-top:1px solid var(--line-soft); text-align:center;
}

/* 整合进首页后的补充样式 */
.sub-title{
  font-size:clamp(16px,1.9vw,19px); font-weight:700; color:var(--gold-lt);
  margin:48px 0 20px; padding-left:14px; border-left:3px solid var(--gold); line-height:1.5;
}
.spotlight .sub-title:first-of-type{ margin-top:36px; }
.report-hint{ color:var(--muted); font-size:13.5px; margin:-10px 0 18px; }
.spotlight .grid-3,.spotlight .grid-4{ margin-bottom:0; }
.spotlight .tbl-title{ margin-top:30px; }

/* 案例页底部 CTA */
.case-cta{
  margin-top:40px; display:flex; align-items:center; justify-content:space-between; gap:24px;
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px 36px;
  background:
    radial-gradient(520px 200px at 90% 50%, rgba(196,166,90,.15), transparent 70%),
    linear-gradient(160deg,#132438,#0A1B2B);
  flex-wrap:wrap;
}
.case-cta h3{ font-size:19px; font-weight:800; }
.case-cta p{ color:var(--muted); font-size:14.2px; margin-top:6px; }

@media (max-width:1024px){
  .case-kpi-strip{ grid-template-columns:repeat(3,1fr); }
  .tl{ grid-template-columns:repeat(2,1fr); row-gap:30px; }
  .tl::before{ display:none; }
  .sf-grid{ grid-template-columns:1fr; }
}

@media (max-width:768px){
  .case-hero{ padding:130px 0 60px; }
  .case-kpi-strip{ grid-template-columns:repeat(2,1fr); }
  .data-cols{ grid-template-columns:1fr; }
  .tl{ grid-template-columns:1fr; }
  .report-grid{ grid-template-columns:1fr; }
  .case-cta{ flex-direction:column; align-items:flex-start; padding:28px 24px; }
  .case-cta .btn{ width:100%; }
}