/* ============================================================================
 * 美天机电官网 内页公共样式（面包屑/侧边栏/列表/详情/富文本/表单/分页）
 * 版权所有 (C) 西安尊云信息科技有限公司
 * Author: 缘境 (yvsm@zunyunkeji.com)
 * ============================================================================ */

/* ===== 内页 Banner ===== */
.page-banner{position:relative;height:260px;background:#2a2a2a center/cover no-repeat;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.page-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,20,.55),rgba(20,20,20,.78))}
.page-banner .pb-inner{position:relative;z-index:2}
.page-banner h1{font-size:38px;font-weight:800;letter-spacing:2px;margin-bottom:10px}
.page-banner .en{display:block;font-size:14px;color:var(--orange-hot);letter-spacing:.22em;text-transform:uppercase;font-family:Outfit,sans-serif}

/* ===== 面包屑 ===== */
.crumb{background:#fff;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}
.crumb .wrap{display:flex;align-items:center;gap:8px;padding:13px 0;flex-wrap:wrap}
.crumb a:hover{color:var(--orange)}
.crumb .sep{color:#ccc}
.crumb .cur{color:var(--text)}

/* ===== 内页布局 ===== */
.inner{padding:56px 0;flex:1}
.inner-grid{display:grid;grid-template-columns:260px 1fr;gap:40px;align-items:start}

/* 侧边栏 */
.side-box{background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-bottom:26px}
.side-box .side-title{background:var(--navy-dark);color:#fff;padding:18px 22px;font-size:18px;font-weight:700;position:relative}
.side-box .side-title::after{content:"";position:absolute;left:22px;bottom:12px;width:34px;height:3px;background:var(--orange)}
.side-nav a{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;font-size:15px;color:#333;border-bottom:1px solid #f0f0f0;transition:.2s}
.side-nav a:last-child{border-bottom:none}
.side-nav a .arr{color:#ccc;transition:.2s}
.side-nav a:hover,.side-nav a.active{background:#fff5f0;color:var(--orange);padding-left:28px}
.side-nav a:hover .arr,.side-nav a.active .arr{color:var(--orange)}
.side-contact{background:linear-gradient(160deg,var(--orange),var(--orange-deep));color:#fff;padding:26px 22px;text-align:center;border-radius:6px}
.side-contact h4{font-size:18px;margin-bottom:14px}
.side-contact .tel{font-size:26px;font-weight:800;font-family:Outfit,sans-serif;margin:8px 0}
.side-contact p{font-size:14px;opacity:.92;line-height:1.9}

/* 内容区标题 */
.content-head{border-bottom:2px solid var(--line);padding-bottom:16px;margin-bottom:30px;position:relative}
.content-head h2{font-size:26px;font-weight:800;color:var(--navy-dark)}
.content-head h2::after{content:"";display:block;width:54px;height:3px;background:var(--orange);margin-top:12px}
.content-head .en{display:block;font-size:14px;color:var(--orange);letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px;font-family:Outfit,sans-serif}

/* ===== 富文本（后台编辑器内容）===== */
.rich-content{font-size:15px;line-height:1.95;color:#444}
.rich-content p{margin-bottom:16px}
.rich-content h2,.rich-content h3,.rich-content h4{color:var(--navy-dark);margin:26px 0 14px;font-weight:700}
.rich-content h2{font-size:24px}
.rich-content h3{font-size:20px}
.rich-content h4{font-size:17px}
.rich-content img{max-width:100%;height:auto;border-radius:4px;margin:18px auto}
.rich-content ul,.rich-content ol{margin:0 0 16px 24px}
.rich-content ul{list-style:disc}
.rich-content ol{list-style:decimal}
.rich-content li{margin-bottom:8px}
.rich-content a{color:var(--orange);text-decoration:underline}
.rich-content blockquote{border-left:4px solid var(--orange);background:var(--bg);padding:14px 20px;margin:18px 0;color:#555;border-radius:0 4px 4px 0}
.rich-content table{width:100%;border-collapse:collapse;margin:18px 0}
.rich-content th,.rich-content td{border:1px solid var(--line);padding:10px 14px;text-align:left}
.rich-content th{background:var(--bg);font-weight:700}

/* ===== 新闻列表 ===== */
.news-items .news-item{display:flex;gap:26px;padding:26px 0;border-bottom:1px solid var(--line)}
.news-item .thumb{flex:0 0 260px;height:170px;overflow:hidden;border-radius:4px;background:#eef1f5}
.news-item .thumb img{width:100%;height:100%;object-fit:cover;transition:.4s}
.news-item:hover .thumb img{transform:scale(1.05)}
.news-item .info{flex:1;display:flex;flex-direction:column}
.news-item .date{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;margin-bottom:8px}
.news-item h3{font-size:19px;font-weight:700;color:var(--navy-dark);margin-bottom:10px;transition:.2s;line-height:1.5}
.news-item:hover h3{color:var(--orange)}
.news-item .desc{color:var(--muted);font-size:14px;line-height:1.85;margin-bottom:14px;flex:1}
.news-item .more-link{color:var(--orange);font-size:14px;font-weight:600}
.news-item .more-link:hover{color:var(--orange-deep)}

/* 简易新闻（无图）列表 */
.news-simple li{display:flex;align-items:center;gap:14px;padding:15px 0;border-bottom:1px dashed var(--line)}
.news-simple li:last-child{border-bottom:none}
.news-simple .dot{width:8px;height:8px;background:var(--orange);border-radius:50%;flex-shrink:0}
.news-simple a{flex:1;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:.2s}
.news-simple li:hover a{color:var(--orange);padding-left:4px}
.news-simple time{color:var(--muted);font-size:14px;font-family:Outfit,sans-serif;flex-shrink:0}

/* ===== 产品列表 ===== */
.prod-list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.prod-card{background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:.3s;display:flex;flex-direction:column}
.prod-card:hover{border-color:var(--orange);box-shadow:0 12px 30px rgba(244,86,8,.13);transform:translateY(-5px)}
.prod-card .pic{height:230px;overflow:hidden;background:#eef1f5;position:relative}
.prod-card .pic img{width:100%;height:100%;object-fit:cover;transition:.4s}
.prod-card:hover .pic img{transform:scale(1.06)}
.prod-card .pic .tag{position:absolute;top:12px;left:12px;background:var(--orange);color:#fff;font-size:14px;padding:3px 12px;border-radius:3px}
.prod-card .p-body{padding:20px;flex:1;display:flex;flex-direction:column;text-align:center}
.prod-card h3{font-size:17px;font-weight:700;color:var(--navy-dark);margin-bottom:10px}
.prod-card .model{color:var(--orange);font-size:14px;font-family:Outfit,sans-serif;margin-bottom:10px}
.prod-card p{color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:16px;flex:1}
.prod-card .p-link{display:inline-block;border:1px solid var(--orange);color:var(--orange);padding:8px 26px;border-radius:20px;font-size:14px;font-weight:600;transition:.2s;align-self:center}
.prod-card .p-link:hover{background:var(--orange);color:#fff}

/* 产品详情 */
.prod-detail{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.prod-gallery .main-img{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#eef1f5;margin-bottom:16px}
.prod-gallery .main-img img{width:100%;height:440px;object-fit:cover}
.prod-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.prod-thumbs img{height:84px;object-fit:cover;border:1px solid var(--line);border-radius:4px;cursor:pointer;transition:.2s;background:#eef1f5}
.prod-thumbs img:hover,.prod-thumbs img.active{border-color:var(--orange)}
.prod-info h1{font-size:28px;font-weight:800;color:var(--navy-dark);margin-bottom:8px;line-height:1.4}
.prod-info .p-model{color:var(--orange);font-size:16px;font-family:Outfit,sans-serif;margin-bottom:18px}
.prod-info .p-summary{background:var(--bg);border-radius:6px;padding:20px 22px;color:#555;font-size:14px;line-height:1.9;margin-bottom:24px}
.prod-params{width:100%;border-collapse:collapse;margin-bottom:26px}
.prod-params th,.prod-params td{border:1px solid var(--line);padding:12px 16px;font-size:14px;text-align:left}
.prod-params th{background:var(--bg);width:130px;color:var(--navy-dark);font-weight:600;white-space:nowrap}
.prod-cta{display:flex;gap:14px;flex-wrap:wrap}
.prod-cta .btn-primary{padding:13px 34px}
.prod-tabs{margin-top:60px}
.tab-bar{display:flex;border-bottom:2px solid var(--line);gap:6px;flex-wrap:wrap}
.tab-bar button{background:none;border:none;padding:14px 28px;font-size:16px;font-family:inherit;cursor:pointer;color:var(--muted);font-weight:600;position:relative;transition:.2s}
.tab-bar button.active{color:var(--orange)}
.tab-bar button.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;background:var(--orange)}
.tab-pane{display:none;padding:30px 0}
.tab-pane.active{display:block}

/* 新闻详情 */
.article-head{text-align:center;margin-bottom:30px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.article-head h1{font-size:28px;font-weight:800;color:var(--navy-dark);line-height:1.5;margin-bottom:16px}
.article-meta{display:flex;justify-content:center;gap:24px;color:var(--muted);font-size:14px;flex-wrap:wrap}
.article-meta span{display:inline-flex;align-items:center;gap:6px}
.article-cover{margin-bottom:28px;border-radius:6px;overflow:hidden}
.article-cover img{width:100%;max-height:440px;object-fit:cover}
.article-body{font-size:15px;line-height:2;color:#444}
.article-body p{margin-bottom:18px}
.article-body img{max-width:100%;height:auto;border-radius:4px;margin:20px auto}
.article-body h2,.article-body h3{color:var(--navy-dark);margin:28px 0 14px}
.article-foot{margin-top:40px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px}
.article-foot a{color:var(--muted);transition:.2s;max-width:45%}
.article-foot a:hover{color:var(--orange)}

/* ===== 联系我们 ===== */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
.contact-info-list li{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.contact-info-list .ci-ic{width:48px;height:48px;flex-shrink:0;border-radius:50%;background:#fff5f0;color:var(--orange);display:grid;place-items:center}
.contact-info-list .ci-ic svg{width:22px;height:22px;fill:var(--orange)}
.contact-info-list h4{font-size:16px;color:var(--navy-dark);margin-bottom:4px}
.contact-info-list p{font-size:14px;color:var(--muted);line-height:1.7}
.contact-map{margin-top:30px;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.contact-map img{width:100%;height:300px;object-fit:cover}
.contact-form{background:#fff;border:1px solid var(--line);border-radius:8px;padding:34px;box-shadow:0 6px 24px rgba(0,0,0,.05)}
.contact-form h3{font-size:22px;color:var(--navy-dark);margin-bottom:6px}
.contact-form .cf-sub{color:var(--muted);font-size:14px;margin-bottom:24px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-group{margin-bottom:18px}
.form-group label{display:block;font-size:14px;color:#333;margin-bottom:8px;font-weight:500}
.form-group label em{color:var(--orange);font-style:normal}
.form-group input,.form-group textarea,.form-group select{width:100%;border:1px solid var(--line);border-radius:4px;padding:12px 14px;font-size:14px;font-family:inherit;color:var(--text);transition:.2s;background:#fafafa}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--orange);background:#fff;box-shadow:0 0 0 3px rgba(244,86,8,.1)}
.form-group textarea{resize:vertical;min-height:130px}
.contact-form .btn-primary{width:100%;padding:14px;font-size:16px;border:none;cursor:pointer}
.contact-form .btn-primary:disabled{opacity:.65;cursor:not-allowed}
.contact-form .form-tip{margin-top:12px;font-size:14px;min-height:1.4em;line-height:1.5}

/* 关于我们 单页 */
.about-single .rich-content{font-size:15px}
.about-banner-imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0}
.about-banner-imgs img{height:200px;width:100%;object-fit:cover;border-radius:6px}

/* ===== 客户案例网格 ===== */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.case-item{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.07);background:#fff}
.case-item img{width:100%;height:230px;object-fit:cover;transition:.5s;display:block}
.case-item:hover img{transform:scale(1.07)}
.case-item figcaption{padding:20px 22px}
.case-item .ci-tag{display:inline-block;background:#fff5f0;color:var(--orange);font-size:14px;padding:2px 12px;border-radius:12px;margin-bottom:10px}
.case-item h4{font-size:18px;font-weight:700;color:var(--navy-dark);margin-bottom:8px}
.case-item p{font-size:14px;color:var(--muted);line-height:1.8}

/* ===== 分页：兼容主题平铺 a/span 与系统默认 ul>li ===== */
.pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:44px;
  list-style:none;
  padding:0;
}
.pagination ul{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0;
  padding:0;
}
.pagination li{
  margin:0;
  padding:0;
  list-style:none;
}
.pagination > a,
.pagination > span,
.pagination li > a,
.pagination li > span{
  box-sizing:border-box;
  min-width:42px;
  height:42px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line,#e8e8e8);
  border-radius:4px;
  font-size:14px;
  color:#555;
  background:#fff;
  text-decoration:none;
  line-height:1;
  transition:border-color .2s,color .2s,background .2s;
}
.pagination > a:hover,
.pagination li > a:hover{
  border-color:var(--orange);
  color:var(--orange);
}
.pagination > .active,
.pagination li.active > span,
.pagination li.active > a{
  background:var(--orange);
  border-color:var(--orange);
  color:#fff;
}
.pagination > .disabled,
.pagination li.disabled > span,
.pagination li.disabled > a{
  color:#ccc;
  cursor:not-allowed;
  pointer-events:none;
  background:#fff;
}

/* ===== 内页响应式 ===== */
@media(max-width:1024px){
  .inner-grid{grid-template-columns:1fr;gap:30px}
  .prod-list-grid,.case-grid{grid-template-columns:repeat(2,1fr)}
  .prod-detail,.contact-grid{grid-template-columns:1fr;gap:32px}
  .prod-gallery .main-img img{height:340px}
  .page-banner h1{font-size:30px}
}
@media(max-width:768px){
  .page-banner{height:200px}
  .page-banner h1{font-size:26px}
  .news-items .news-item{flex-direction:column;gap:16px}
  .news-item .thumb{flex:none;width:100%;height:200px}
  .about-banner-imgs{grid-template-columns:1fr}
  .contact-form{padding:24px 18px}
  .form-row{grid-template-columns:1fr;gap:0}
  .article-foot a{max-width:100%}
}
@media(max-width:640px){
  .prod-list-grid{grid-template-columns:1fr}
  .prod-gallery .main-img img{height:260px}
  .prod-info h1{font-size:22px}
  .article-head h1{font-size:22px}
}