/* ==========================================================================
   新闻列表 / 新闻详情样式（浅蓝大气版，SEO 友好布局）
   ========================================================================== */

/* ---------- 新闻列表 ---------- */
.newslist{padding:54px 0 70px; background:#f5f9ff;}
.newslist article{display:flex; gap:30px; align-items:flex-start;}
.newslist-main{flex:1.6; min-width:0;}
.newslist-head{margin-bottom:24px;}
.newslist-head h1{font-size:30px; color:#0b2545; font-weight:bold; padding-left:14px; position:relative;}
.newslist-head h1:before{content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:5px; height:26px; border-radius:3px; background:linear-gradient(180deg,#0066cc,#3498db);}
.newslist-head p{font-size:14px; color:#999; margin-top:10px; padding-left:14px;}
.newslist-content{display:flex; flex-direction:column; gap:14px;}
.newslist-item>a{display:flex; align-items:center; gap:18px; background:#fff; border:1px solid #eef4fb; border-radius:14px; padding:22px 24px; transition:all .35s ease; position:relative; overflow:hidden;}
.newslist-item>a:before{content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg,#0066cc,#3498db); transform:scaleY(0); transition:.35s;}
.newslist-item>a:hover{transform:translateX(6px); border-color:#b8d4f0; box-shadow:0 12px 28px rgba(0,102,204,.12);}
.newslist-item>a:hover:before{transform:scaleY(1);}
.newslist-icon{flex-shrink:0; width:58px; height:58px; border-radius:14px; background:linear-gradient(135deg,#0066cc,#3498db); color:#fff; display:flex; align-items:center; justify-content:center; font-size:24px; transition:.4s;}
.newslist-item>a:hover .newslist-icon{transform:rotate(-10deg) scale(1.08);}
.newslist-body{flex:1; min-width:0;}
.newslist-body h2{font-size:17px; color:#0b2545; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .3s;}
.newslist-item>a:hover .newslist-body h2{color:#0066cc;}
.newslist-body p{font-size:13px; color:#999; margin-top:8px; line-height:1.7; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.newslist-body u{text-decoration:none; display:block; margin-top:10px; font-size:12px; color:#999;}
.newslist-body u i{margin-right:5px; color:#3498db;}
.newslist-arrow{flex-shrink:0; color:#b8d4f0; font-size:22px; transition:.3s;}
.newslist-item>a:hover .newslist-arrow{color:#0066cc; transform:translateX(5px);}

/* ---------- 侧栏 ---------- */
.newslist-side{flex:1; min-width:300px; display:flex; flex-direction:column; gap:22px;}
.side-box{background:#fff; border:1px solid #eef4fb; border-radius:16px; padding:24px; box-shadow:0 10px 26px rgba(11,37,69,.05);}
.side-box>h3{font-size:18px; color:#0b2545; font-weight:bold; margin-bottom:16px; padding-left:12px; border-left:4px solid #0066cc;}
.side-box>h3 i{color:#3498db; margin-right:6px;}
.side-box ul li{margin-top:12px;}
.side-box ul li a{display:flex; align-items:flex-start; gap:8px; font-size:14px; color:#555; line-height:1.6; transition:.3s;}
.side-box ul li a i{color:#3498db; margin-top:3px; transition:.3s;}
.side-box ul li a:hover{color:#0066cc; padding-left:4px;}
.side-box ul li a:hover i{transform:translateX(3px);}
.hot-list{counter-reset:hot; margin:0; padding:0;}
.hot-list li{margin-top:12px; counter-increment:hot;}
.hot-list li a{display:flex; align-items:center; gap:10px; font-size:14px; color:#555; transition:.3s;}
.hot-list li a:before{content:counter(hot); flex-shrink:0; width:22px; height:22px; line-height:22px; text-align:center; border-radius:6px; background:#f0f6ff; color:#0066cc; font-size:12px; font-weight:bold;}
.hot-list li:nth-child(-n+3) a:before{background:linear-gradient(135deg,#0066cc,#3498db); color:#fff;}
.hot-list li a span{flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.hot-list li a u{text-decoration:none; font-style:normal; font-size:12px; color:#999;}
.hot-list li a:hover{color:#0066cc;}
.side-tags>div{display:flex; flex-wrap:wrap; gap:10px;}
.side-tags a{font-size:13px; color:#666; background:#f5f9ff; border:1px solid #e5ecf5; border-radius:20px; padding:5px 14px; transition:.3s;}
.side-tags a:hover{background:#0066cc; border-color:#0066cc; color:#fff; box-shadow:0 6px 16px rgba(0,102,204,.22);}

/* ---------- 新闻详情 ---------- */
.newsdetail{padding:54px 0 70px; background:#f5f9ff;}
.newsdetail article{display:flex; gap:30px; align-items:flex-start;}
.newsdetail-content{flex:1.6; min-width:0; background:#fff; border:1px solid #eef4fb; border-radius:16px; padding:40px;}
.newsdetail-content>h1{font-size:28px; color:#0b2545; font-weight:bold; line-height:1.4;}
.newsdetail-info{display:flex; flex-wrap:wrap; gap:6px 22px; margin:18px 0 24px; padding:14px 18px; background:#f7fbff; border-radius:10px; font-size:13px; color:#999;}
.newsdetail-info b{font-weight:normal; color:#666;}
.newsdetail-info i{font-style:normal; color:#0066cc;}
.newsdetail-content aside{font-size:15px; line-height:2; color:#444; word-break:break-all;}
.newsdetail-content aside img{max-width:100%; border-radius:10px;}
.newsdetail-content dir{margin-top:34px; padding-top:24px; border-top:1px solid #e5ecf5;}
.newsdetail-content dir dl{display:flex; gap:10px; margin-top:10px; font-size:14px;}
.newsdetail-content dir dt{color:#999; flex-shrink:0;}
.newsdetail-content dir dd a{color:#555;}
.newsdetail-content dir dd a:hover{color:#0066cc;}
.newsdetail-recommend{flex:1; min-width:300px; display:flex; flex-direction:column; gap:22px;}

/* 产品详情属性卡 */
.productdetail-li{margin-bottom:22px; background:linear-gradient(135deg,#eaf3ff,#f5f9ff); border:1px solid #e5ecf5; border-radius:14px; padding:22px 24px;}
.productdetail-li p{font-size:14px; color:#555; margin:8px 0; display:flex; gap:8px; flex-wrap:wrap;}
.productdetail-li p i{font-style:normal; color:#0066cc; font-weight:bold; font-size:18px;}

@media(max-width:1200px){
  .newslist article,.newsdetail article{flex-direction:column;}
  .newslist-side,.newsdetail-recommend{width:100%; min-width:0; display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
  .side-tags{grid-column:1/-1;}
}
@media(max-width:767px){
  .newslist{padding:30px 0 34px;}
  .newslist-item>a{padding:14px 16px; gap:12px;}
  .newslist-icon{width:42px; height:42px; font-size:18px; border-radius:10px;}
  .newslist-body h2{font-size:15px;}
  .newslist-arrow{display:none;}
  .newslist-side,.newsdetail-recommend{grid-template-columns:1fr;}
  .newsdetail{padding:30px 0 34px;}
  .newsdetail-content{padding:20px 16px;}
  .newsdetail-content>h1{font-size:21px;}
}

.newslist article:after,.newsdetail article:after{display:none;}