/* 页面专属样式：cases.html
   由内联 <style> 抽离而来，仅在 cases.html 引用，避免污染其它页面。
   加载顺序须在 pages.css 之后以保持覆盖优先级。 */

/* ===== 原 cases.html 内联 <style> 第1块 ===== */
  .section-story{background:var(--paper,#FBF7F0)}
  .story-placeholder{margin-top:34px}
  .sp-note{background:#fff7e6;border:1px dashed #e0c98a;color:#8a6d2f;padding:12px 16px;border-radius:10px;font-size:14px;line-height:1.7;margin-bottom:22px}
  .story-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:30px;background:#fff;border:1px solid var(--line,#eee);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm)}
  .story-media{padding:26px;display:flex;align-items:center;justify-content:center;background:var(--paper-2,#f5f1e8)}
  .sp-img{width:100%;aspect-ratio:4/3;border:2px dashed #d8d2c4;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#a59e8c;font-size:15px;background:#faf8f2}
  .story-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;display:block}
  .story-body{padding:28px 30px}
  .sp-name{font-family:var(--font-serif);font-size:24px;font-weight:800;color:var(--ink);margin:0 0 14px}
  .sp-meta{list-style:none;padding:0;margin:0 0 18px;display:flex;gap:30px;flex-wrap:wrap}
  .sp-meta li{font-size:14px;color:var(--ink-soft)}
  .sp-meta b{display:block;color:var(--muted);font-weight:600;font-size:12.5px;margin-bottom:3px}
  .sp-block{margin-bottom:16px}
  .sp-label{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.04em;color:var(--brand,#1A2B8A);background:#eef1fb;padding:3px 10px;border-radius:6px;margin-bottom:7px}
  .sp-block p{margin:0;color:var(--ink-soft);line-height:1.8}
  @media(max-width:820px){.story-card{grid-template-columns:1fr}}

/* ===== 原 cases.html 内联 <style> 第2块 ===== */
/* 案例页顶部统计数字色块 */
.case-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:20px;max-width:720px;margin-left:auto;margin-right:auto}
.case-stats .cs-stat{flex:1;min-width:180px;max-width:220px;padding:22px 18px;border:none;border-radius:16px;color:#fff;text-align:center;box-shadow:0 10px 30px rgba(26,43,138,.18)}
.case-stats .cs-stat:nth-child(1){background:linear-gradient(135deg,#1A2B8A 0%,#3A52C8 100%)}
.case-stats .cs-stat:nth-child(2){background:linear-gradient(135deg,#1E7A52 0%,#2FA877 100%)}
.case-stats .cs-stat:nth-child(3){background:linear-gradient(135deg,#8A2B3A 0%,#C24A63 100%)}
.case-stats .cs-stat b{color:#fff;font-family:var(--font-serif);font-size:30px;font-weight:800;line-height:1}
.case-stats .cs-stat span{color:rgba(255,255,255,.88);font-size:13px;margin-top:8px}

/* ===== 原 cases.html 内联 <style> 第3块 ===== */
/* cases 独有：案例卡渐隐遮罩 */
.case-card .thumb,.card .thumb{position:relative;overflow:hidden}
.case-card .thumb::after,.card .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(27,21,16,.68),transparent 50%);transition:opacity .4s var(--ease);opacity:.8}
.case-card:hover .thumb::after,.card:hover .thumb::after{opacity:1}
.case-card .thumb .case-label,.card .thumb .case-label{position:absolute;bottom:12px;left:16px;right:16px;z-index:2;color:#fff}
.case-card .thumb .case-label b,.card .thumb .case-label b{font-family:var(--font-serif);font-size:16px;font-weight:700;text-shadow:0 1px 4px rgba(0,0,0,.5)}
/* case-group 内卡片间距 */
.case-group{gap:20px}
.case-group .card{margin-bottom:8px}
/* 顶部统计区玻璃拟态 */
.case-stats{background:rgba(255,253,248,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--radius);padding:20px 28px;border:1px solid rgba(201,161,92,.12)}
.cs-stat b{font-family:var(--font-serif);background:linear-gradient(135deg,var(--gold-3),var(--gold-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}