@charset "utf-8";
/* ==========================================================================
   启达软件 · MES 智能制造一体化专题页内容组件
   说明：本文件仅提供内容组件样式，整体沿用主站视觉体系
         （主色 #ff7019 橙 / 分区底色 #eee / 正文 #333 / 链接 #666 / 线条 #e5e5e5）
   ========================================================================== */

/* ---------- 面包屑 / 通用容器 ---------- */
.mes-crumb{background:#f7f7f7;border-bottom:1px solid #ececec;font-size:13px;color:#999;line-height:46px;}
.mes-crumb a{color:#666;}
.mes-crumb a:hover{color:#ff7019;}
.mes-crumb span{color:#999;}
.mes-wrap{max-width:1560px;margin:0 auto;padding:0 2%;}

/* ---------- 页面主标题区 ---------- */
.mes-hero{background:#fff;padding:36px 0 6px;text-align:center;}
.mes-hero h1{font-size:30px;color:#333;font-weight:400;letter-spacing:1px;line-height:1.5;}
.mes-hero h1 em{font-style:normal;color:#ff7019;}
.mes-hero .mes-line{width:60px;height:2px;background:#ff7019;margin:16px auto;}
.mes-hero .mes-lead{font-size:16px;color:#999;line-height:32px;max-width:1180px;margin:0 auto;text-align:justify;}
.mes-hero .mes-lead strong,.mes-hero .mes-lead b{color:#666;font-weight:600;}

/* ---------- 分区 ---------- */
.mes-sec{padding:46px 0;}
.mes-sec.alt{background:#eee;}
.mes-sec.white{background:#fff;}
.mes-sec.tint{background:#fafafa;}
.mes-sec-title{text-align:center;padding-bottom:26px;}
.mes-sec-title h2{font-size:30px;color:#333;font-weight:400;text-transform:uppercase;letter-spacing:1px;}
.mes-sec-title p{font-size:16px;color:#999;margin-top:12px;line-height:28px;max-width:1180px;margin-left:auto;margin-right:auto;}
.mes-sec-title .mes-line{width:60px;height:2px;background:#ff7019;margin:14px auto 0;}

/* ---------- 模块小标题 ---------- */
.mes-mod{display:flex;align-items:center;gap:16px;margin:0 0 22px;}
.mes-mod .n{flex:none;width:56px;height:46px;line-height:46px;text-align:center;background:#ff7019;color:#fff;font-size:20px;font-weight:700;}
.mes-mod h2{font-size:24px;color:#333;font-weight:400;}
.mes-mod p{font-size:14px;color:#999;margin-top:4px;}
.mes-mod-sub{font-size:14px;color:#999;margin:-14px 0 20px;}

/* ---------- 数据统计条 ---------- */
.mes-stats{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:2px solid #ff7019;box-shadow:0 6px 22px rgba(0,0,0,.06);margin-top:-40px;position:relative;z-index:3;}
.mes-stats .cell{text-align:center;padding:26px 10px;border-right:1px solid #f0f0f0;}
.mes-stats .cell:last-child{border-right:0;}
.mes-stats .num{font-size:34px;color:#ff7019;font-weight:700;line-height:1.2;}
.mes-stats .num i{font-style:normal;font-size:16px;color:#999;font-weight:400;margin-left:2px;}
.mes-stats .lab{font-size:14px;color:#666;margin-top:8px;}

/* ---------- 内容卡片 3 列 ---------- */
.mes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.mes-grid.two{grid-template-columns:repeat(2,1fr);}
.mes-grid.four{grid-template-columns:repeat(4,1fr);}
.mes-card{background:#fff;border:1px solid #e5e5e5;border-top:3px solid #ddd;padding:24px;transition:all .3s ease;}
.mes-card:hover{border-top-color:#ff7019;box-shadow:0 10px 26px rgba(0,0,0,.08);transform:translateY(-2px);}
.mes-card h3{font-size:18px;color:#333;font-weight:600;margin-bottom:12px;padding-left:12px;border-left:4px solid #ff7019;line-height:1.4;}
.mes-card p{font-size:14px;color:#666;line-height:26px;}
.mes-card ul{margin-top:6px;}
.mes-card li{font-size:14px;color:#666;line-height:26px;padding-left:14px;position:relative;}
.mes-card li:before{content:"";position:absolute;left:0;top:11px;width:5px;height:5px;background:#ff7019;}
.mes-card li b{color:#333;font-weight:600;}
.mes-card.dark{background:#2a2a2a;border-color:#2a2a2a;border-top-color:#ff7019;}
.mes-card.dark h3{color:#fff;border-left-color:#ff7019;}
.mes-card.dark p,.mes-card.dark li{color:#aaa;}
.mes-card.dark li:before{background:#ff7019;}

/* ---------- 小卡片（功能点） 3 列 ---------- */
.mes-pills{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.mes-pill{background:#fff;border:1px solid #e5e5e5;padding:20px 22px;transition:all .3s ease;}
.mes-pill:hover{border-color:#ff7019;box-shadow:0 8px 22px rgba(0,0,0,.07);}
.mes-pill .pt{font-size:16px;color:#333;font-weight:600;display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.5;}
.mes-pill .pt span{background:#fff2e8;color:#ff7019;border:1px solid #ffd9bf;font-size:12px;padding:1px 10px;font-weight:400;}
.mes-pill p{font-size:14px;color:#666;line-height:26px;margin-top:10px;}
.mes-pill p b{color:#333;}

/* ---------- 终端标签 ---------- */
.mes-term{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;}
.mes-term span{font-size:12px;padding:2px 10px;border:1px solid #e5e5e5;background:#f8f8f8;color:#888;}

/* ---------- 功能导览（编号卡片） ---------- */
.mes-toc{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.mes-toc a{display:block;background:#fff;border:1px solid #e5e5e5;border-top:3px solid #ddd;padding:24px;transition:all .3s ease;}
.mes-toc a:hover{border-top-color:#ff7019;box-shadow:0 12px 28px rgba(0,0,0,.08);transform:translateY(-3px);}
.mes-toc .n{font-size:28px;color:#e5e5e5;font-weight:700;line-height:1;transition:all .3s ease;}
.mes-toc a:hover .n{color:#ff7019;}
.mes-toc h3{font-size:18px;color:#333;margin-top:10px;}
.mes-toc p{font-size:13.5px;color:#999;line-height:24px;margin-top:8px;}
.mes-toc .go{display:inline-block;margin-top:14px;font-size:13px;color:#ff7019;}

/* ---------- 表格 ---------- */
.mes-tbl{overflow-x:auto;background:#fff;border:1px solid #e5e5e5;}
.mes-tbl table{width:100%;border-collapse:collapse;min-width:760px;}
.mes-tbl th{background:#ff7019;color:#fff;font-size:15px;font-weight:600;text-align:left;padding:14px 16px;white-space:nowrap;}
.mes-tbl td{padding:14px 16px;font-size:14px;color:#555;line-height:26px;border-top:1px solid #ececec;vertical-align:top;}
.mes-tbl tbody tr:nth-child(even){background:#fafafa;}
.mes-tbl tbody tr:hover{background:#fff7f2;}
.mes-tbl td.ok{color:#ff7019;font-weight:600;white-space:nowrap;}
.mes-tbl td.num{color:#333;font-weight:600;width:56px;}

/* ---------- 产品矩阵 ---------- */
.mes-prod{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.mes-prod .item{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid #e5e5e5;padding:24px;transition:all .3s ease;}
.mes-prod .item:hover{border-color:#ff7019;box-shadow:0 12px 28px rgba(0,0,0,.08);transform:translateY(-3px);}
.mes-prod .tag{display:inline-block;font-size:12.5px;color:#ff7019;background:#fff2e8;border:1px solid #ffd9bf;padding:3px 10px;margin-bottom:14px;align-self:flex-start;}
.mes-prod h3{font-size:19px;color:#333;font-weight:600;line-height:1.4;}
.mes-prod p{font-size:14px;color:#666;line-height:26px;margin:12px 0 14px;flex:1;}
.mes-prod .plink{display:block;margin-top:8px;padding-top:12px;border-top:1px solid #ececec;font-size:14px;color:#ff7019;}
.mes-prod .plink:hover{padding-left:6px;}

/* ---------- CTA ---------- */
.mes-cta{background:#222;color:#999;text-align:center;padding:52px 0;}
.mes-cta h2{font-size:28px;color:#fff;font-weight:400;}
.mes-cta p{font-size:15px;color:#999;line-height:28px;max-width:1000px;margin:14px auto 26px;}
.mes-cta .mes-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
.mes-btn{display:inline-block;padding:12px 30px;font-size:15px;color:#fff;background:#ff7019;border:1px solid #ff7019;transition:all .3s ease;}
.mes-btn:hover{background:#e96310;border-color:#e96310;color:#fff;}
.mes-btn.ghost{background:transparent;border-color:#666;color:#ddd;}
.mes-btn.ghost:hover{background:#ff7019;border-color:#ff7019;color:#fff;}

/* ---------- 时间轴 / 数据条 ---------- */
.mes-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.mes-facts .cell{background:#fff;border:1px solid #e5e5e5;text-align:center;padding:24px 12px;}
.mes-facts .num{font-size:28px;color:#ff7019;font-weight:700;}
.mes-facts .lab{font-size:13.5px;color:#666;margin-top:8px;}
.mes-time{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.mes-time .tl{background:#fff;border:1px solid #e5e5e5;border-left:4px solid #ff7019;padding:22px;}
.mes-time .yr{display:inline-block;font-size:13px;color:#fff;background:#ff7019;padding:2px 12px;margin-bottom:12px;}
.mes-time h3{font-size:17px;color:#333;margin-bottom:8px;}
.mes-time p{font-size:14px;color:#666;line-height:26px;}

/* ---------- 文章列表（MES 解析） ---------- */
/* 列表底色与正文卡片拉开明度对比，边界一目了然 */
.mes-sec.news{background:#f5f5f5;counter-reset:mesart;}
.mes-wrap.mes-news-wrap{max-width:1120px;}

/* 导读目录 */
.mes-idx{background:#fff;border:1px solid #e8e8e8;border-left:4px solid #ff7019;box-shadow:0 2px 14px rgba(0,0,0,.05);padding:24px 28px 18px;margin-bottom:34px;}
.mes-idx .hd{display:flex;align-items:center;gap:14px;padding-bottom:14px;border-bottom:1px solid #ececec;}
.mes-idx .hd .n{flex:none;width:46px;height:46px;line-height:46px;text-align:center;background:#ff7019;color:#fff;font-size:20px;font-weight:700;}
.mes-idx .hd h2{font-size:20px;color:#333;font-weight:600;line-height:1.3;}
.mes-idx .hd p{font-size:13px;color:#999;margin-top:4px;}
.mes-idx ol{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-top:6px;list-style:none;}
.mes-idx li{border-bottom:1px dashed #eee;}
.mes-idx li a{display:flex;align-items:baseline;gap:10px;padding:10px 2px;font-size:14.5px;color:#666;line-height:24px;transition:color .25s ease;}
.mes-idx li a i{flex:none;font-style:normal;color:#ff7019;font-weight:700;font-size:13px;}
.mes-idx li a:hover{color:#ff7019;}

/* 文章卡片：顶部品牌色条 + 序号章 + 投影，与上一篇文章的结尾明显区分 */
.mes-art{background:#fff;border:1px solid #e8e8e8;border-top:3px solid #ff7019;box-shadow:0 2px 14px rgba(0,0,0,.05);padding:32px 36px 28px;margin-bottom:34px;}
.mes-art:last-child{margin-bottom:0;}
.mes-art h2{counter-increment:mesart;font-size:22px;color:#333;font-weight:600;line-height:1.55;padding-bottom:16px;border-bottom:1px solid #ececec;}
.mes-art h2:before{content:counter(mesart,decimal-leading-zero);display:inline-block;min-width:44px;height:28px;line-height:28px;text-align:center;background:#ff7019;color:#fff;font-size:14px;font-weight:700;margin-right:12px;vertical-align:2px;letter-spacing:.5px;}
.mes-art .tags{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 8px;}
.mes-art .tags span{font-size:12px;color:#888;background:#f5f5f5;border:1px solid #ececec;padding:2px 10px;}
.mes-art h3{font-size:17px;color:#333;font-weight:600;margin:26px 0 10px;padding-left:12px;border-left:3px solid #ff7019;line-height:1.5;}
.mes-art h4{font-size:15.5px;color:#333;font-weight:600;margin:20px 0 8px;padding-left:10px;border-left:3px solid #ffd9bf;line-height:1.5;}
.mes-art p{font-size:15px;color:#666;line-height:30px;margin-bottom:14px;text-align:justify;}
.mes-art p strong,.mes-art p b{color:#333;}
.mes-art ul,.mes-art ol{margin:0 0 14px 22px;}
.mes-art li{font-size:15px;color:#666;line-height:30px;}
.mes-art li strong{color:#333;}
.mes-art .idx{color:#ff7019;font-weight:700;}

/* ---------- 资讯列表页：文章卡片 ---------- */
.art-list{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.art-item{position:relative;display:flex;gap:16px;background:#fff;border:1px solid #e8e8e8;border-top:3px solid #ff7019;box-shadow:0 2px 14px rgba(0,0,0,.05);padding:26px 26px 20px;transition:all .3s ease;}
.art-item:hover{box-shadow:0 12px 28px rgba(0,0,0,.09);transform:translateY(-2px);}
.art-item .n{flex:none;width:44px;height:44px;line-height:44px;text-align:center;background:#ff7019;color:#fff;font-size:16px;font-weight:700;}
.art-item .bd{flex:1;min-width:0;}
.art-item h2{font-size:18px;color:#333;font-weight:600;line-height:1.5;}
.art-item h2 a{color:#333;}
.art-item h2 a:hover{color:#ff7019;}
.art-item .tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 10px;}
.art-item .tags span{font-size:12px;color:#888;background:#f5f5f5;border:1px solid #ececec;padding:2px 10px;}
.art-item .sum{font-size:14px;color:#666;line-height:26px;text-align:justify;}
.art-item .foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #f0f0f0;font-size:13px;color:#999;}
.art-item .more{font-size:14px;color:#ff7019;}
.art-item .more:hover{padding-left:4px;}

/* ---------- 文章详情页 ---------- */
.art-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;color:#999;padding-bottom:18px;border-bottom:1px solid #ececec;margin-bottom:26px;}
.art-meta .tags{display:flex;flex-wrap:wrap;gap:8px;}
.art-meta .tags span{font-size:12px;color:#888;background:#f5f5f5;border:1px solid #ececec;padding:2px 10px;}
.art-meta .dot{color:#ddd;}
.art-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:36px;padding-top:22px;border-top:1px solid #ececec;}
.art-foot .pn{flex:1 1 300px;min-width:0;font-size:14px;color:#999;line-height:1.7;}
.art-foot .pn a{color:#666;}
.art-foot .pn a:hover{color:#ff7019;}
.art-foot .back{flex:none;display:inline-block;padding:10px 24px;font-size:14px;color:#fff;background:#ff7019;transition:all .3s ease;}
.art-foot .back:hover{background:#e96310;color:#fff;}
.art-rel{margin-top:34px;background:#fff;border:1px solid #e8e8e8;border-left:4px solid #ff7019;box-shadow:0 2px 14px rgba(0,0,0,.05);padding:22px 28px 14px;}
.art-rel h2{font-size:17px;color:#333;font-weight:600;margin-bottom:8px;}
.art-rel ul{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;list-style:none;}
.art-rel li{border-bottom:1px dashed #eee;}
.art-rel li a{display:block;padding:10px 2px;font-size:14.5px;color:#666;line-height:24px;transition:color .25s ease;}
.art-rel li a:hover{color:#ff7019;}

/* ---------- 响应式 ---------- */
@media screen and (max-width:1200px){
  .mes-grid,.mes-pills,.mes-prod,.mes-time{grid-template-columns:repeat(2,1fr);}
  .mes-toc{grid-template-columns:repeat(2,1fr);}
  .mes-stats{grid-template-columns:repeat(2,1fr);}
  .mes-stats .cell:nth-child(2){border-right:0;}
  .mes-facts{grid-template-columns:repeat(2,1fr);}
}
@media screen and (max-width:768px){
  .mes-hero{padding:24px 4% 4px;}
  .mes-hero h1{font-size:22px;}
  .mes-hero .mes-lead{font-size:14px;line-height:26px;}
  .mes-sec{padding:30px 4%;}
  .mes-sec-title h2{font-size:22px;}
  .mes-sec-title p{font-size:14px;line-height:24px;}
  .mes-mod h2{font-size:19px;}
  .mes-grid,.mes-grid.two,.mes-grid.four,.mes-pills,.mes-prod,.mes-time,.mes-toc,.mes-facts{grid-template-columns:1fr;}
  .mes-stats{grid-template-columns:1fr 1fr;margin-top:-24px;}
  .mes-stats .num{font-size:24px;}
  .mes-stats .cell{border-right:0;padding:16px 6px;}
  .mes-stats .lab{font-size:12.5px;}
  .mes-idx{padding:18px 16px 10px;margin-bottom:24px;}
  .mes-idx .hd .n{width:38px;height:38px;line-height:38px;font-size:16px;}
  .mes-idx .hd h2{font-size:17px;}
  .mes-idx ol{grid-template-columns:1fr;}
  .mes-idx li a{font-size:13.5px;line-height:22px;padding:9px 0;}
  .mes-art{padding:20px 16px 16px;margin-bottom:24px;}
  .mes-art h2{font-size:18px;padding-bottom:12px;}
  .mes-art h2:before{min-width:34px;height:24px;line-height:24px;font-size:12.5px;margin-right:8px;}
  .mes-art h3{font-size:15.5px;margin:20px 0 8px;padding-left:10px;}
  .mes-art p,.mes-art li{font-size:14px;line-height:26px;}
  .art-list{grid-template-columns:1fr;gap:18px;}
  .art-item{padding:18px 16px 16px;gap:12px;}
  .art-item .n{width:36px;height:36px;line-height:36px;font-size:14px;}
  .art-item h2{font-size:16.5px;}
  .art-item .sum{font-size:13.5px;line-height:24px;}
  .art-meta{padding-bottom:14px;margin-bottom:20px;gap:8px;}
  .art-foot{gap:10px;}
  .art-foot .pn{flex:1 1 100%;}
  .art-foot .back{width:100%;text-align:center;}
  .art-rel{padding:18px 16px 10px;}
  .art-rel ul{grid-template-columns:1fr;}
  .mes-card,.mes-pill,.mes-prod .item{padding:18px;}
  .mes-crumb{line-height:40px;font-size:12px;padding:0 4%;}
  .mes-btn{padding:10px 22px;font-size:14px;}
  .mes-cta h2{font-size:20px;}
}