/* =========================================================
   site1 内页样式（关于我们 / 列表 / 详情）— 工业橙风格
   变量来自 index.css 的 :root（--orange / --dark 等）
   ========================================================= */

/* ===================== 页头横幅 subbanner ===================== */
.subbanner{
  position:relative;
  height:300px;
  background-color:var(--dark);
  background-size:cover;
  background-position:center;
  display:flex; align-items:center; justify-content:center;
  color:#fff; text-align:center;
}
.subbanner::before{ content:''; position:absolute; inset:0; background:rgba(38,38,38,.58); }
.subbanner .warper{ position:relative; z-index:2; }
.subbanner h1{
  font-family:'Oswald','Arial Narrow',sans-serif;
  font-size:46px; font-weight:700; margin:0 0 14px;
  text-transform:uppercase; letter-spacing:1px;
}
.breadcrumb{ font-size:14px; color:#e6e6e6; }
.breadcrumb a{ color:#fff; }
.breadcrumb a:hover{ color:var(--orange); }
.breadcrumb span,
.breadcrumb i{ margin:0 8px; color:var(--orange); font-style:normal; }

/* ===================== 关于我们 ===================== */
.ab-intro{ display:flex; gap:46px; padding:64px 0; align-items:flex-start; }
.ab-intro .ab-text{ flex:1; min-width:0; }
.ab-intro .ab-text h2{
  font-family:'Oswald','Arial Narrow',sans-serif;
  font-size:32px; font-weight:700; color:#333; margin:0 0 6px;
}
.ab-intro .ab-text .sub{ color:var(--orange); font-weight:600; margin-bottom:18px; display:block; }
.ab-intro .ab-text p{ color:var(--text); line-height:1.9; margin:0 0 14px; }
.ab-intro .ab-gallery{ flex:1; display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ab-intro .ab-gallery img{ width:100%; height:100%; object-fit:cover; border-radius:6px; }
.ab-intro .ab-gallery .tall{ grid-row:span 2; }

/* 数据条 */
.ab-stats{ background:var(--dark); color:#fff; padding:46px 0; }
.ab-stats .warper{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; }
.ab-stats .st{ text-align:center; flex:1; min-width:120px; }
.ab-stats .st b{ display:block; font-family:'Oswald','Arial Narrow',sans-serif; font-size:42px; color:var(--orange); line-height:1; }
.ab-stats .st span{ font-size:14px; color:#cfcfcf; }

/* 为什么选择我们 */
.ab-why{ padding:60px 0; background:#f7f7f7; }
.ab-why .sec-h{ text-align:center; margin-bottom:40px; }
.ab-why .sec-h h2{ font-family:'Oswald','Arial Narrow',sans-serif; font-size:34px; font-weight:700; color:#333; margin:0; }
.ab-why .sec-h p{ color:var(--text); margin:8px 0 0; }
.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.feat-card{ background:#fff; border:1px solid var(--line); border-radius:6px; padding:30px 26px; transition:.3s; }
.feat-card:hover{ box-shadow:0 10px 28px rgba(0,0,0,.08); border-color:var(--orange); transform:translateY(-4px); }
.feat-card .ic{ width:58px; height:58px; border-radius:50%; background:rgba(247,161,44,.12); color:var(--orange); display:flex; align-items:center; justify-content:center; font-size:26px; margin-bottom:16px; }
.feat-card h3{ font-family:'Oswald','Arial Narrow',sans-serif; font-size:20px; color:#333; margin:0 0 10px; }
.feat-card p{ color:var(--text); font-size:14px; line-height:1.8; margin:0; }

/* ===================== 列表页 ===================== */
.list-page{ padding:54px 0; }
.list-bar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; margin-bottom:30px; }
.list-bar h2{ font-family:'Oswald','Arial Narrow',sans-serif; font-size:26px; color:#333; margin:0; }
.sub-nav{ display:flex; flex-wrap:wrap; gap:10px; }
.sub-nav a{ display:inline-block; padding:7px 16px; border:1px solid var(--line); border-radius:30px; color:#666; font-size:14px; }
.sub-nav a:hover, .sub-nav a.on{ background:var(--orange); border-color:var(--orange); color:#fff; }
.list-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.list-card{ background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden; transition:.3s; display:flex; flex-direction:column; }
.list-card:hover{ box-shadow:0 12px 30px rgba(0,0,0,.10); border-color:var(--orange); transform:translateY(-4px); }
.list-card .pic{ aspect-ratio:4/3; overflow:hidden; background:#f2f2f2; }
.list-card .pic img{ width:100%; height:100%; object-fit:cover; transition:.45s; }
.list-card:hover .pic img{ transform:scale(1.08); }
.list-card .info{ padding:18px 20px 22px; flex:1; display:flex; flex-direction:column; }
.list-card .info h3{ font-family:'Oswald','Arial Narrow',sans-serif; font-size:19px; color:#333; margin:0 0 8px; line-height:1.35; }
.list-card .info .meta{ color:#999; font-size:13px; margin-bottom:10px; }
.list-card .info p{ color:var(--text); font-size:14px; line-height:1.7; margin:0 0 14px; flex:1; }
.list-card .more{ color:var(--orange); font-weight:600; font-size:14px; }
.list-card .more i{ margin-left:6px; transition:.3s; }
.list-card:hover .more i{ margin-left:12px; }

/* ===================== 详情页 ===================== */
.content-page{ display:flex; gap:42px; padding:54px 0; align-items:flex-start; }
.content-main{ flex:1; min-width:0; }
.product-detail .content-main h1{ text-align:center; margin:0 0 24px; }
.content-side{ width:286px; flex:none; }
.content-body{ font-size:15px; line-height:1.95; color:#444; }
.content-body p{ margin:0 0 16px; }
.content-body img{ max-width:100%; height:auto; margin:16px 0; border-radius:4px; }
.content-body h2, .content-body h3, .content-body h4{ font-family:'Oswald','Arial Narrow',sans-serif; color:#333; margin:26px 0 12px; }
.content-body h2{ font-size:24px; } .content-body h3{ font-size:20px; } .content-body h4{ font-size:17px; }
.content-body ul, .content-body ol{ margin:0 0 16px 22px; } .content-body li{ margin-bottom:8px; }
.content-body a{ color:var(--orange); }
.content-meta{ color:#999; font-size:13px; border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:22px; }
.content-meta span{ margin-right:18px; }
.content-meta i{ color:var(--orange); margin-right:6px; }
.content-nav{ display:flex; justify-content:space-between; gap:16px; margin-top:34px; padding-top:20px; border-top:1px solid var(--line); font-size:14px; }
.content-nav a{ color:#555; }
.content-nav a:hover{ color:var(--orange); }
.content-nav .empty{ color:#bbb; }
.relate{ margin-top:44px; }
.relate h3{ font-family:'Oswald','Arial Narrow',sans-serif; font-size:22px; color:#333; margin:0 0 22px; padding-left:12px; border-left:4px solid var(--orange); }
.relate .list-grid{ grid-template-columns:repeat(3,1fr); }

/* 侧边栏 */
.side-box{ background:#fff; border:1px solid var(--line); border-radius:6px; margin-bottom:24px; overflow:hidden; }
.side-box h4{ background:var(--dark); color:#fff; padding:14px 18px; margin:0; font-family:'Oswald','Arial Narrow',sans-serif; font-size:16px; font-weight:500; }
.side-box ul{ list-style:none; margin:0; padding:0; }
.side-box li a{ display:block; padding:12px 18px; border-bottom:1px solid var(--line); color:#555; font-size:14px; transition:.25s; }
.side-box li:last-child a{ border-bottom:0; }
.side-box li a:hover, .side-box li a.on{ color:var(--orange); padding-left:26px; background:#fffaf2; }
.side-contact{ background:var(--orange); color:#fff; padding:22px 18px; border-radius:6px; }
.side-contact h4{ background:none; color:#fff; padding:0 0 12px; font-family:'Oswald','Arial Narrow',sans-serif; font-size:18px; border-bottom:1px solid rgba(255,255,255,.3); margin-bottom:14px; }
.side-contact p{ margin:0 0 8px; font-size:14px; }
.side-contact a{ color:#fff; }
.side-contact .side-weixin{ margin:0 0 8px; }
.side-contact .side-weixin-qr{ display:block; width:96px; max-width:100%; padding:5px; background:#fff; border-radius:4px; }

/* ===================== 分页 pagebar ===================== */
.pagebar{ text-align:center; margin:42px 0 10px; }
.pagebar a, .pagebar span, .pagebar strong, .pagebar em{
  display:inline-block; min-width:40px; height:40px; line-height:40px;
  margin:0 4px; padding:0 12px; border:1px solid var(--line); border-radius:4px;
  color:#555; font-size:14px; font-style:normal;
}
.pagebar a:hover{ border-color:var(--orange); color:var(--orange); }
.pagebar strong, .pagebar .active, .pagebar em{ background:var(--orange); border-color:var(--orange); color:#fff; }

/* ===================== 响应式 ===================== */
@media (max-width:991px){
  .ab-intro{ flex-direction:column; }
  .feat-grid{ grid-template-columns:repeat(2,1fr); }
  .list-grid{ grid-template-columns:repeat(2,1fr); }
  .content-page{ flex-direction:column; }
  .content-side{ width:100%; }
  .subbanner{ height:230px; } .subbanner h1{ font-size:34px; }
}
@media (max-width:767px){
  .ab-stats .st{ min-width:45%; }
  .feat-grid{ grid-template-columns:1fr; }
  .list-grid{ grid-template-columns:1fr; }
  .ab-intro .ab-gallery{ grid-template-columns:1fr; }
  .subbanner{ height:180px; } .subbanner h1{ font-size:26px; }
}