@charset "UTF-8";
/* =========================================================
   谷普下载站 · 专题页统一改版
   覆盖 keyall.css(专题首页) / keyword.css(专题内容页) 的绿色旧样式
   主题色与全站 gupu_pc.css 一致：主蓝 #37b1fa → #1f98ef，辅助绿 #41c35e
   ========================================================= */
:root {
  --gp-accent: #37b1fa;
  --gp-accent-2: #1f98ef;
  --gp-green: #41c35e;
  --gp-card-border: #eef2f7;
  --gp-card-shadow: 0 4px 16px rgba(28, 60, 92, 0.06);
  --gp-card-shadow-hover: 0 14px 34px rgba(31, 152, 239, 0.16);
}

/* ---------------- 通用容器 ---------------- */
.g-box-1200{ width:1200px; margin:auto; }
/* 面包屑（当前位置）：.g-box-1200{margin:auto} 会压掉 keyword.css 的 margin-bottom，这里补回 */
.g-box-1200.g-current{ margin-bottom:16px; }

/* =========================================================
   专题首页（kell / special_list）
   ========================================================= */
/* 主体盒子 */
.g-main-box{
  width:1198px; border:0 !important; border-radius:16px;
  margin-top:0; background:#fff;
  box-shadow:var(--gp-card-shadow);
  padding-bottom:26px;
}
/* 页面标题「专题合集」栏 */
.g-main-box .m-btn{
  width:auto; margin:0; padding:22px 26px 14px;
  border-bottom:1px solid #f0f4f8;
}
.g-main-box .m-btn ul{ width:auto; }
.g-main-box .m-btn ul li{
  width:auto; margin:0; float:none;
}
.g-main-box .m-btn ul li strong{
  width:auto; height:auto; line-height:1; font-size:20px; font-weight:700;
  color:#1c2333; background:none !important; border:0 !important;
  padding-left:14px; position:relative; display:inline-block;
}
.g-main-box .m-btn ul li strong::before{
  content:""; position:absolute; left:0; top:2px; bottom:2px; width:5px;
  border-radius:3px;
  background:linear-gradient(180deg,#37b1fa,#1f98ef);
}
.g-main-box .m-btn ul li.f-hover strong,
.g-main-box .m-btn ul li.f-hover strong a{ color:#1c2333; background:none; }
.g-main-box .m-btn ul li i{ display:none !important; }
.g-main-box .m-btn .u-solid{ display:none !important; }

/* 专题卡片栅格：3 列大卡 */
.g-main-box .m-cont{
  width:auto; padding:22px 24px 0; display:grid !important;
  grid-template-columns:repeat(3,1fr); gap:20px; overflow:visible;
}
.g-main-box .m-cont a{
  width:auto !important; height:auto; margin:0; float:none;
  border:1px solid var(--gp-card-border) !important; border-radius:14px;
  padding:0; overflow:hidden; background:#fff;
  box-shadow:var(--gp-card-shadow);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s;
  display:flex; flex-direction:column;
}
.g-main-box .m-cont a:hover{
  transform:translateY(-5px);
  box-shadow:var(--gp-card-shadow-hover);
  border-color:rgba(55,177,250,.35) !important;
}
.g-main-box .m-cont a img{
  width:100% !important; height:175px; object-fit:cover;
  display:block; transition:transform .35s ease;
}
.g-main-box .m-cont a:hover img{ transform:scale(1.05); }
.g-main-box .m-cont a .u-msg{
  width:auto; height:auto; margin:16px 16px 4px; display:flex;
  align-items:center; justify-content:space-between; gap:8px;
}
.g-main-box .m-cont a .u-msg strong{
  width:auto; font-size:16px; font-weight:600; color:#1c2333;
  float:none; flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.g-main-box .m-cont a:hover .u-msg strong{ color:var(--gp-accent-2); }
.g-main-box .m-cont a .u-msg b{
  width:auto; font-size:12px; font-weight:500; color:#5b6b7f; float:none;
  background:#f2f7fc; padding:3px 9px; border-radius:20px; white-space:nowrap;
}
.g-main-box .m-cont a em{ display:none !important; }
.g-main-box .m-cont a .u-excerpt{
  width:auto; height:44px; line-height:22px; font-size:13px; color:#8195a8;
  margin:4px 16px 16px; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex:none;
}

/* =========================================================
   专题内容页（keyword / index）
   ========================================================= */
/* ---- Banner 头图区 ---- */
.g-key-main{
  width:1198px; border:0 !important; border-radius:16px;
  padding:0; margin-top:0; background:linear-gradient(135deg,#f7fbff,#fff 45%);
  box-shadow:var(--gp-card-shadow); overflow:hidden;
  display:flex; align-items:stretch;
}
.g-key-main .u-img{
  width:560px; height:320px; float:left; margin:0; object-fit:cover;
  display:block; border-radius:0; flex:none;
}
.g-key-main .m-cont{
  width:auto; height:100%; float:none;
  padding:30px 32px 26px; display:flex; flex-direction:column; justify-content:center;
  box-sizing:border-box; min-height:320px; flex:1;
}
.g-key-main .m-cont h1{
  font-size:30px; font-weight:700; color:#17233d; margin:0 0 14px;
  padding-left:14px; position:relative;
}
/* 专题 · 类别标签（放在标题上方） */
.g-key-main .m-cont p.g-tag{
  width:auto; height:auto; margin:0 0 12px; padding:0 0 0 14px; display:block;
}
.g-key-main .m-cont p.g-tag i{
  display:inline-block; font-style:normal; font-size:12px; font-weight:600;
  color:#fff; line-height:1; padding:5px 12px; border-radius:20px;
  background:linear-gradient(135deg,#37b1fa,#1f98ef);
  box-shadow:0 3px 10px rgba(55,177,250,.25);
}
.g-key-main .m-cont h1::before{
  content:""; position:absolute; left:0; top:4px; bottom:4px; width:5px;
  border-radius:3px; background:linear-gradient(180deg,#37b1fa,#1f98ef);
}
.g-key-main .m-cont .u-introduction{
  max-height:none; line-height:26px; font-size:14px; color:#5b6b7f;
  margin:0 0 14px;
}
.g-key-main .m-cont span{
  height:auto; width:auto; display:inline-block; font-size:13px; color:#8a9bb0;
  margin:0; padding:0 0 0 14px;
}
.g-key-main .m-cont span i{ color:#ff6b4a; font-weight:600; }

/* ---- 应用列表卡片 ---- */
.g-list-box{
  width:1198px; border:0 !important; border-radius:16px;
  padding:22px 24px 4px; margin-top:18px; background:#fff;
  box-shadow:var(--gp-card-shadow); overflow:hidden;
}
.g-list-box .g-title{
  font-size:19px; font-weight:700; color:#1c2333; margin:0 0 18px;
  padding-left:14px; position:relative;
}
.g-list-box .g-title::before{
  content:""; position:absolute; left:0; top:4px; bottom:4px; width:5px;
  border-radius:3px; background:linear-gradient(180deg,#37b1fa,#1f98ef);
}
.g-list-box .m-cont{
  width:auto !important; display:grid !important;
  grid-template-columns:repeat(2,1fr); gap:18px; overflow:visible;
}
.g-list-box .m-cont a{
  width:auto !important; height:auto; min-height:150px; margin:0; float:none;
  border:1px solid var(--gp-card-border) !important; border-radius:14px;
  padding:18px 18px 16px; background:#fff; position:relative;
  box-shadow:var(--gp-card-shadow);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s;
  display:flex; flex-direction:column;
}
.g-list-box .m-cont a:hover{
  transform:translateY(-4px);
  box-shadow:var(--gp-card-shadow-hover);
  border-color:rgba(55,177,250,.35) !important;
}
/* 左侧信息区 */
.g-list-box .m-cont a .m-cont-left{
  width:auto; float:none; display:block; margin:0;
  padding-right:82px; box-sizing:border-box;
}
.g-list-box .m-cont a .m-cont-left strong{
  width:100%; height:auto; line-height:1.35; font-size:16px; font-weight:700;
  color:#17233d; margin:0 0 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.g-list-box .m-cont a:hover .m-cont-left strong{ color:var(--gp-accent-2); }
.g-list-box .m-cont a .m-cont-left b{
  width:100%; line-height:1.6; font-size:12.5px; color:#8195a8; margin:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.g-list-box .m-cont a .m-cont-left b i,
.g-list-box .m-cont a .m-cont-left b em,
.g-list-box .m-cont a .m-cont-left img{ display:none !important; }
/* 右侧图标 + 详情按钮 */
.g-list-box .m-cont a .m-cont-right{
  width:auto; float:none; position:absolute; right:14px; top:14px;
  display:flex; flex-direction:column; align-items:center; gap:8px; margin:0;
}
.g-list-box .m-cont a .m-cont-right img{
  width:72px; height:72px; border-radius:16px; object-fit:cover;
  box-shadow:0 6px 16px rgba(23,35,61,.14);
}
.g-list-box .m-cont a .m-cont-right b{
  width:auto; height:auto; line-height:1; font-size:12.5px; font-weight:600;
  color:#fff; text-align:center; margin:0; padding:8px 16px;
  background:linear-gradient(135deg,#37b1fa,#1f98ef);
  border-radius:20px; cursor:pointer; white-space:nowrap;
  box-shadow:0 4px 12px rgba(55,177,250,.30);
  transition:transform .18s, box-shadow .18s;
}
.g-list-box .m-cont a:hover .m-cont-right b{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(55,177,250,.45);
}
/* 底部推荐理由（padding-right 避开右侧「图标+详情」按钮列，防止文字被压） */
.g-list-box .m-cont a .m-cont-bottom{
  width:auto; height:auto; line-height:21px; font-size:12.5px; color:#8195a8;
  margin:12px 0 0; float:none; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  padding-top:12px; padding-right:92px; border-top:1px dashed #edf2f7; box-sizing:border-box;
}
.g-list-box .m-cont a .m-cont-bottom i{ font-style:normal; color:var(--gp-accent-2); margin-right:4px; }
.g-list-box .m-cont a:hover{ border-color:rgba(55,177,250,.35); }

/* =========================================================
   无 JS 时专题内容页默认标题
   ========================================================= */
.g-list-box{ position:relative; }
