/* ============================================================
   qiyeseo 样式升级层 (upgrade.css)
   说明：本文件为“叠加层”，在原 style.min.css 之后加载，同名选择器后加载者生效。
   仅做视觉升级（配色 / 圆角 / 阴影 / 间距 / 排版 / 悬停动效），
   不改动任何 HTML 板块结构（板块结构保持不变）。
   ============================================================ */

:root{
  --brand:#b10202;          /* 品牌主红 */
  --brand-2:#d4121f;        /* 悬停/渐变亮红 */
  --brand-dark:#8a0101;     /* 深红（导航选中/悬停） */
  --ink:#23262b;            /* 主文字 */
  --muted:#6b7280;          /* 次要文字 */
  --line:#e6e8eb;           /* 分隔线 */
  --surface:#ffffff;        /* 卡片底色 */
  --surface-2:#f6f8fa;      /* 浅灰块 */
  --bg:#eae9e6;             /* 页面背景 */
  --link:#1d6fb8;           /* 链接蓝 */
  --radius:12px;
  --radius-sm:8px;
  --shadow-sm:0 1px 3px rgba(17,24,39,.06);
  --shadow-md:0 4px 14px rgba(17,24,39,.08);
  --shadow-lg:0 12px 30px rgba(17,24,39,.14);
}

/* ---------- 基础 ---------- */
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",Verdana,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{ color:#444; transition:color .2s ease; }
a:hover{ color:var(--brand-2); text-decoration:none; }
img{ max-width:100%; }
::selection{ background:var(--brand); color:#fff; }
* { box-sizing:border-box; }
/* 仅对新增边框/内边距的组件使用 border-box，避免撑破栅格 */
.list-shop li,.list-news li,.qiyenews li,.post-ab li,
.pagebar .page,.search input,.search button,
.tags a,.tag a,.hottags li a,.links li a,
.article .info,.post-nav a{ box-sizing:border-box; }

/* ---------- 主框架 .main ---------- */
.main{
  background:var(--surface);
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  overflow:hidden;
}

/* ---------- 头部 header（桌面：flex 排布） ---------- */
@media (min-width:722px){
  header{
    display:flex;
    align-items:center;
    padding:14px 22px;
    background:var(--surface);
    border-bottom:1px solid var(--line);
  }
  .logo{ order:1; margin:0 16px 0 0; width:auto; height:auto; }
  .logo img{ width:64px; height:64px; border-radius:18px; }
  .website{ order:2; flex:1; padding:0; }
  .website h1,.website .name{ font-size:22px; color:var(--ink); letter-spacing:.5px; }
  .website h3{ font-size:13px; color:var(--muted); }
  .search{ order:3; margin:0 0 0 24px; }
  .wapsearch{ order:3; }
  /* 栏目简介（能量回收等栏目页可见，利于 SEO 与阅读） */
  .cate-intro{ margin:10px 0 18px; padding:14px 18px; background:var(--surface-2,#fafafa); border-left:3px solid var(--brand); border-radius:var(--radius-sm,8px); color:var(--muted,#666); font-size:14px; line-height:1.9; }
}
.search input{
  border:1px solid var(--line);
  border-radius:999px 0 0 999px;
  background:#f7f7f8;
  height:38px; line-height:38px;
  transition:border-color .2s;
  margin-right:0;
}
.search input:focus{ border:1px solid var(--brand); }
.search button{
  background:var(--brand);
  border-radius:0 999px 999px 0;
  transition:background .2s, transform .05s;
}
.search button:hover{ background:var(--brand-2); }

/* ---------- 导航（两种导航都覆盖） ---------- */
#cssmenu{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); box-shadow:var(--shadow-sm); }
#cssmenu ul ul li a{ background:var(--brand-2); }
#cssmenu ul li a:hover{ background:var(--brand-dark); text-decoration:none; }
#cssmenu > ul > li > a{ transition:background .2s; }
.pgwMenu{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); box-shadow:var(--shadow-sm); }
.pgwMenu li a:hover,.pgwMenu li a.cur{ background:var(--brand-dark); text-decoration:none; }
.pgwMenu .pm-dropDown a,.pgwMenu .pm-viewMore > ul{ background:var(--brand-2); }
.pgwMenu .pm-viewMore > ul{ box-shadow:0 6px 16px rgba(0,0,0,.18); }

/* ---------- 轮播 banner ---------- */
.ft-carousel .carousel-indicators span{ box-shadow:var(--shadow-sm); }
.ft-carousel .carousel-indicators span.active{ background:var(--brand); opacity:1; }

/* ---------- 内容区 .content ---------- */
.content{ padding:18px 22px 8px; }
.content h3{
  font-size:17px; line-height:46px; border-bottom:0;
  margin:20px 0 14px; padding:0 16px;
  background:var(--surface-2);
  border-left:4px solid var(--brand);
  border-radius:var(--radius-sm);
  color:var(--ink); font-weight:700;
  box-shadow:var(--shadow-sm);
}
.content h3 i{ float:right; font-size:12px; color:var(--muted); font-weight:400; }
.content p{ line-height:1.8; margin-bottom:12px; color:#3a3f47; }

/* 关于我们 */
.about img{ border-radius:var(--radius); box-shadow:var(--shadow-sm); margin:14px 0 10px; }
.content .about p{ color:#555; line-height:1.8; }

/* 普通文章列表（qiyenews / post-ab 两栏列表） */
.qiyenews li,.post-ab li{
  line-height:38px;
  border-bottom:1px solid var(--line);
  transition:background .15s, padding-left .15s;
}
.qiyenews li:hover,.post-ab li:hover{ background:var(--surface-2); padding-left:8px; }
.qiyenews li a,.post-ab li a{ display:block; color:var(--ink); }
.qiyenews li a:hover,.post-ab li a:hover{ color:var(--brand); }

/* 栏目/标签页列表行（list-news） */
.list-news li{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  border-radius:var(--radius-sm);
  transition:background .15s, box-shadow .15s;
}
.list-news li:hover{ background:var(--surface-2); box-shadow:var(--shadow-sm); }
.list-news li h2{ font-size:16px; line-height:26px; font-weight:600; }
.list-news li h2 a{ color:var(--ink); }
.list-news li h2 a:hover{ color:var(--brand); }

/* 产品卡片网格（list-shop）——核心视觉升级 */
.list-shop{ margin-right:-2%; padding-top:15px; overflow:hidden; }
.list-shop li{
  margin-right:2%; width:23%; float:left;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.list-shop li:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:#f0c9c9; }
.list-shop li img{ width:100%; height:170px; object-fit:cover; display:block; transition:transform .3s; }
.list-shop li:hover img{ transform:scale(1.04); }
.list-shop li h2{
  font-size:14px; font-weight:600; line-height:40px;
  text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
  border-bottom:1px solid var(--line); padding:0 10px; color:var(--ink);
}
.list-shop li h2 a{ color:var(--ink); }
.list-shop li h2 a:hover{ color:var(--brand); }
.list-shop li .info{ text-align:left; font-size:13px; line-height:24px; margin:8px 10px 14px; color:var(--muted); }
.list-shop li .info i{ margin-right:5px; color:var(--brand); }
.list-shop li .info span{ float:right; color:var(--muted); }

/* newspic 列表（搜索/其它页可能用到）兜底卡片化 */
.newspic li{ border-bottom:1px solid var(--line); padding:12px 0; }

/* ---------- 面包屑 ---------- */
.breadcrumb{ line-height:38px; border-bottom:1px solid var(--line); color:var(--muted); margin-bottom:12px; }
.breadcrumb a{ color:var(--muted); }
.breadcrumb a:hover{ color:var(--brand); }
.breadcrumb i{ margin:0 5px; color:var(--brand); }

/* 列表页 H1（模板已加 .list-h1） */
.list-h1{
  font-size:22px; line-height:1.4; color:var(--ink);
  margin:6px 0 14px; padding-left:12px;
  border-left:4px solid var(--brand); font-weight:700;
}

/* ---------- 翻页 ---------- */
.pagebar{ padding:14px 0; text-align:center; }
.pagebar .page{
  float:none; display:inline-block; color:var(--muted);
  width:34px; line-height:34px; margin:0 4px;
  border:1px solid var(--line); border-radius:999px;
  transition:all .15s;
}
.pagebar .page:hover{ color:#fff; background:var(--brand); border-color:var(--brand); }
.pagebar .now-page{ color:#fff; background:var(--brand); border:1px solid var(--brand); }

/* 上一篇/下一篇 */
.post-nav p{ text-align:center; }
.post-nav a{
  border:1px solid var(--line); border-radius:999px;
  color:var(--muted); padding:6px 16px; display:inline-block;
  background:var(--surface); transition:all .15s;
}
.post-nav a:hover{ border-color:var(--brand); color:var(--brand); box-shadow:var(--shadow-sm); }

/* ---------- 文章正文 .article ---------- */
.article{ padding:6px 0; }
.article .info{
  color:var(--muted); line-height:24px;
  margin:0 auto 18px; width:fit-content;
  text-align:center; font-size:13px;
  background:var(--surface-2); border-radius:999px; padding:6px 18px;
}
.article .info a{ color:var(--link); }
.article .info i{ margin-right:5px; color:var(--brand); }
.article img{ max-width:100%; height:auto; border-radius:var(--radius-sm); box-shadow:var(--shadow-sm); margin:10px 0; }
.article h1{
  font-size:24px; line-height:1.4; margin:8px 0 16px; text-align:center;
  color:var(--ink); padding-bottom:14px; border-bottom:2px solid var(--line); font-weight:700;
}
.article h2,.article h3,.article h4,.article h5{
  border-left:4px solid var(--brand); background:var(--surface-2); border-bottom:0;
  line-height:1.6; padding:8px 12px; margin:18px 0 12px;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0; color:var(--ink); font-weight:700;
}
.article p{ line-height:1.9; margin-bottom:14px; color:#3a3f47; }
.article table{ border-top:1px solid var(--line); border-left:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; }
.article table td{ border-bottom:1px solid var(--line); border-right:1px solid var(--line); padding:8px 12px; }
.article blockquote{
  border-left:4px solid var(--brand); background:var(--surface-2);
  margin:14px 0; padding:12px 16px;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0; color:var(--muted);
}
.article ul,.article ol{ margin:0 0 14px 22px; }
.article ul li,.article ol li{ line-height:1.9; }

/* 标签 / 热门标签 / 友情链接 —— 胶囊化 */
.tags{ margin:14px 0; }
.tags p{ display:flex; flex-wrap:wrap; gap:8px; }
.tags i{ display:none; }
.tags a,.tag a{
  color:var(--link); background:var(--surface-2);
  border:1px solid var(--line); border-radius:999px; padding:4px 12px; font-size:13px;
  transition:all .15s;
}
.tags a:hover,.tag a:hover{ background:var(--brand); color:#fff; border-color:var(--brand); }
.hottags,.links{ overflow:hidden; }
.hottags li,.links li{ margin-right:10px; line-height:34px; }
.hottags li a,.links li a{
  display:inline-block; background:var(--surface-2);
  border:1px solid var(--line); border-radius:999px; padding:4px 14px;
  color:var(--muted); transition:all .15s;
}
.hottags li a:hover,.links li a:hover{ background:var(--brand); color:#fff; border-color:var(--brand); }

/* ---------- 页脚 ---------- */
footer{
  padding:28px 20px; background:#1f2430; color:#aeb6c2;
  border-top:4px solid var(--brand); text-align:center; font-size:13px;
}
footer p{ line-height:28px; color:#aeb6c2; }
footer a{ color:#aeb6c2; }
footer a:hover{ color:#fff; }

/* ============================================================
   移动端适配（重声栅格宽度，确保叠加层不破坏原响应式）
   ============================================================ */
@media (max-width:721px){
  .main{ border-radius:0; box-shadow:none; }
  .content{ padding:14px 14px; }
  .content h3{ padding:0 12px; line-height:42px; }
  .list-shop li{ width:48%; }
  .list-shop li img{ height:150px; }
  .article .info{ width:auto; }
  .article h1{ font-size:21px; }
  header{ padding:10px 12px; }
}
@media (max-width:481px){
  .list-shop li{ width:100%; }
  .list-shop li img{ height:200px; }
  .content h3{ font-size:16px; }
  .article h1{ font-size:20px; }
  .list-news li{ padding:12px 12px; }
}