/* ============================================================
   客户案例模块专用样式  page-cases.css
   ============================================================ */

/* ---------- 案例中心 Hero ---------- */
.case-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0e2a4d 0%,#14507f 45%,#0f7a5f 100%);color:#fff;padding:150px 0 110px}
.case-hero .phub-breadcrumb a{color:rgba(255,255,255,.75)}
.case-hero .phub-breadcrumb em{color:#7fe0c0}
.case-title{font-size:clamp(30px,4.4vw,54px);line-height:1.2;margin:18px 0 16px;font-weight:800}
.case-title em{font-style:normal;color:#5fd7b0}
.case-hero p{max-width:720px;color:rgba(255,255,255,.82);font-size:17px;line-height:1.9}

/* ---------- 案例筛选 ---------- */
.case-filter{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:40px}
.case-filter button{border:1px solid #d8e8f8;background:#fff;color:#3a5168;padding:10px 22px;border-radius:999px;font-size:14.5px;cursor:pointer;transition:.25s;font-family:inherit}
.case-filter button:hover{border-color:#2F7CF6;color:#1E5FD8}
.case-filter button.active{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff;border-color:transparent}

/* ---------- 案例卡片墙 ---------- */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.case-card{background:#fff;border:1px solid #e4eef8;border-radius:16px;overflow:hidden;transition:.35s}
.case-card:hover{transform:translateY(-8px);box-shadow:0 22px 48px rgba(22,80,140,.14)}
.case-card .cc-img{position:relative;overflow:hidden;height:210px}
.case-card .cc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:.5s}
.case-card:hover .cc-img img{transform:scale(1.06)}
.case-card .cc-tag{position:absolute;left:16px;top:16px;background:rgba(15,122,95,.92);color:#fff;font-size:12.5px;padding:6px 14px;border-radius:999px;font-weight:600}
.case-card .cc-body{padding:22px}
.case-card .cc-body h4{font-size:17.5px;margin-bottom:10px;line-height:1.5}
.case-card .cc-body h4 a{color:inherit}
.case-card .cc-body h4 a:hover{color:#1E5FD8}
.case-card .cc-body p{font-size:14px;color:#5c7086;line-height:1.8;margin-bottom:14px}
.case-card .cc-meta{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:#8aa0b8;border-top:1px dashed #e4eef8;padding-top:14px}
.case-card .cc-meta a{color:#1E5FD8;font-weight:600}

/* ---------- 案例详情 Hero ---------- */
.cdetail-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0e2a4d,#0f7a5f);color:#fff;padding:140px 0 70px}
.cdetail-hero .phub-breadcrumb a{color:rgba(255,255,255,.75)}
.cdetail-hero .phub-breadcrumb em{color:#7fe0c0}
.cdetail-hero h1{font-size:clamp(26px,3.6vw,42px);line-height:1.3;margin:16px 0 14px;font-weight:800;max-width:900px}
.cdetail-hero .cd-sub{color:rgba(255,255,255,.82);font-size:16px;line-height:1.9;max-width:840px}
.cdetail-hero .cd-meta{display:flex;flex-wrap:wrap;gap:22px;margin-top:26px;font-size:14px;color:rgba(255,255,255,.8)}
.cdetail-hero .cd-meta b{color:#8fe6c8;font-weight:700;margin-right:4px}

/* ---------- 案例指标 ---------- */
.cd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cd-stat{background:#fff;border:1px solid #e4eef8;border-radius:16px;padding:28px 20px;text-align:center;box-shadow:0 10px 26px rgba(22,80,140,.06)}
.cd-stat b{display:block;font-size:30px;line-height:1.1;margin-bottom:8px;font-weight:800;background:linear-gradient(135deg,#1E5FD8,#2EBF8B);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cd-stat span{font-size:14px;color:#5c7086}

/* ---------- 项目背景 ---------- */
.cd-sec{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.cd-sec img{width:100%;border-radius:16px;display:block;box-shadow:0 18px 40px rgba(22,80,140,.12)}
.cd-block h3{font-size:24px;margin-bottom:16px}
.cd-block h3 em{font-style:normal;color:#1E5FD8}
.cd-block p{font-size:15.5px;color:#455a70;line-height:2;margin-bottom:14px}

/* ---------- 实施路径 ---------- */
.cd-road{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.cd-road::before{content:"";position:absolute;top:30px;left:8%;right:8%;height:2px;background:linear-gradient(90deg,#2F7CF6,#2EBF8B);opacity:.3}
.cd-road-step{position:relative;text-align:center;padding:0 14px}
.cd-road-step .crs-num{width:60px;height:60px;margin:0 auto 14px;border-radius:50%;background:#fff;border:2px solid #d8e8f8;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;color:#1E5FD8;position:relative;z-index:2}
.cd-road-step h4{font-size:15.5px;margin-bottom:6px}
.cd-road-step p{font-size:13px;color:#5c7086;line-height:1.7}

/* ---------- 方案亮点 ---------- */
.cd-gain{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cd-gain-item{background:#fff;border:1px solid #e4eef8;border-radius:14px;padding:24px 22px}
.cd-gain-item .cgi-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:14px}
.cd-gain-item h4{font-size:16px;margin-bottom:8px}
.cd-gain-item p{font-size:13.8px;color:#5c7086;line-height:1.8}

/* ---------- 客户评价 ---------- */
.cd-quote{position:relative;background:#fff;border:1px solid #e4eef8;border-radius:18px;padding:40px 44px;box-shadow:0 14px 34px rgba(22,80,140,.08)}
.cd-quote .cq-mark{font-size:64px;line-height:1;color:#2EBF8B;font-family:Georgia,serif}
.cd-quote p{font-size:17px;line-height:2.05;color:#33475c;margin:6px 0 22px}
.cd-quote .cq-who{display:flex;align-items:center;gap:14px}
.cd-quote .cq-who .cq-av{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:17px}
.cd-quote .cq-who b{display:block;font-size:15px}
.cd-quote .cq-who span{font-size:13px;color:#8aa0b8}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .case-grid{grid-template-columns:repeat(2,1fr)}
  .cd-stats{grid-template-columns:repeat(2,1fr)}
  .cd-road{grid-template-columns:repeat(2,1fr);gap:28px}
  .cd-road::before{display:none}
  .cd-sec{grid-template-columns:1fr}
}
@media (max-width:680px){
  .case-grid,.cd-stats,.cd-gain{grid-template-columns:1fr}
  .cd-road{grid-template-columns:1fr}
}