
/* 深蓝主色 + 青绿点缀｜轻量无JS（原样式保留） */
.cf-detail{
  --navy:#0b2a4a;
  --navy2:#123a66;
  --cyan:#19c2ff;
  --mint:#2ee6a6;
  --text:#0f172a;
  --muted:#516070;
  --line:#e6edf7;
  --shadow:0 18px 45px rgba(11,42,74,.12);
  font-family:Arial,"Microsoft YaHei",sans-serif;
  line-height:1.7;
  color:var(--text);
}

.cf-section{margin:42px 0;}
.cf-title{
  font-size:20px;margin:0 0 14px;font-weight:900;color:var(--navy);
  position:relative;padding-left:12px;
}
.cf-title:before{
  content:"";position:absolute;left:0;top:4px;bottom:4px;width:4px;
  background:linear-gradient(180deg,var(--cyan),var(--mint));
}

.cf-kicker{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;font-weight:900;color:var(--navy);
  padding:6px 10px;border-radius:999px;
  border:1px solid rgba(25,194,255,.35);
  background:#fff;
}
.cf-kicker:before{
  content:"";width:8px;height:8px;border-radius:50%;
  background:linear-gradient(180deg,var(--cyan),var(--mint));
}

/* Hero */
.cf-hero{
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  display:flex;gap:22px;flex-wrap:wrap;
  box-shadow:var(--shadow);
  background:linear-gradient(135deg, rgba(11,42,74,.1), rgba(25,194,255,.1), rgba(46,230,166,.08));
}
.cf-hero__text{flex:1;min-width:280px;}
.cf-hero__text h1{font-size:28px;margin:10px 0;font-weight:900;color:var(--navy);}
.cf-hero__text p{color:var(--muted);margin:0 0 14px;}
.cf-hero__media{flex:1;min-width:280px;}

/* 徽章 & 数据 */
.cf-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.cf-badge{
  font-size:12px;padding:7px 12px;border-radius:999px;
  border:1px solid rgba(46,230,166,.28);
  background:#fff;font-weight:900;color:var(--navy);
}
.cf-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;}
.cf-stat{
  border:1px solid rgba(25,194,255,.22);
  border-radius:14px;padding:10px 12px;background:#fff;
}
.cf-stat__v{font-weight:900;color:var(--navy);}
.cf-stat__k{font-size:12px;color:var(--muted);}

/* 网格 */
.cf-grid{display:grid;gap:14px;align-items:stretch;} /* ✅ 让卡片等高 */
.cf-grid--3{grid-template-columns:repeat(3,1fr);}
.cf-grid--4{grid-template-columns:repeat(4,1fr);}

/* 卡片（原样式 + 底部对齐） */
.cf-card{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:#fff;
  box-shadow:0 14px 35px rgba(11,42,74,.08);
  display:flex;
  flex-direction:column;
  gap:10px;
  height:100%;
}
.cf-card__top{display:flex;gap:8px;align-items:center;}
.cf-card__body p{margin:0;color:var(--muted);}
.cf-dot{
  width:10px;height:10px;border-radius:50%;
  background:linear-gradient(180deg,var(--cyan),var(--mint));
}
.cf-tag{
  font-size:12px;font-weight:900;color:var(--navy2);
  padding:5px 10px;border-radius:999px;border:1px solid rgba(25,194,255,.2);
}

/* ✅ 统一图片比例（不改你阴影风格，只统一展示框） */
.cf-ratio{
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:14px;
  border:1px solid var(--line);
  box-shadow:0 14px 35px rgba(11,42,74,.12);
  background:#fff;
}
.cf-ratio--16x10{aspect-ratio:16/10;}
.cf-ratio > img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}

/* ✅ 媒体区：推到底部（关键） */
.cf-media{
  display:grid;
  gap:10px;
  margin-top:auto;
}
.cf-media--1{grid-template-columns:1fr;}
.cf-media--2{grid-template-columns:repeat(2, minmax(0,1fr));}

/* Split 面板（原样式 + 底部对齐） */
.cf-split{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-items:stretch;}
.cf-panel{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;background:#fff;
  display:flex;
  flex-direction:column;
  gap:10px;
  height:100%;
}
.cf-list{padding-left:18px;color:var(--muted);margin:0;}
.cf-list li::marker{color:var(--cyan);}
.cf-muted{color:var(--muted);margin:0;}

/* 标签 */
.cf-tags{display:flex;flex-wrap:wrap;gap:10px;}
.cf-tag-pill{
  border:1px solid rgba(46,230,166,.22);
  border-radius:999px;
  padding:8px 12px;
  font-size:13px;font-weight:900;
  color:var(--navy);
  background:#fff;
}

/* 表格 */
.cf-tablewrap{
  overflow:auto;border:1px solid rgba(25,194,255,.18);
  border-radius:16px;background:#fff;
}
.cf-table{width:100%;border-collapse:collapse;min-width:720px;}
.cf-table th{
  background:linear-gradient(90deg,var(--navy),var(--navy2));
  color:#fff;padding:12px;text-align:left;
}
.cf-table td{padding:12px;border-bottom:1px solid #eef2f7;color:var(--muted);}

/* 移动端 */
@media(max-width:980px){
  .cf-grid--3,.cf-grid--4{grid-template-columns:1fr;}
  .cf-split{grid-template-columns:1fr;}
  .cf-stats{grid-template-columns:1fr;}
  .cf-media--2{grid-template-columns:1fr;}
}
