/* ============================================================
   印象传媒 yingxiang1.com — CNN (edition.cnn.com) 风格改版
   cnn.css  v=20260910
   设计 token：黑 #0c0c0c / CNN红 #cc0000 / 灰 #6e6e6e / 边框 #e6e6e6
   ============================================================ */
:root{
  --red:#cc0000;
  --black:#0c0c0c;
  --ink:#262626;
  --gray:#6e6e6e;
  --border:#e6e6e6;
  --soft:#f8f8f8;
  --max:1200px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);
  background:#fff;
  font-size:16px;
  line-height:1.6;
}
a{color:inherit;text-decoration:none;transition:color .15s;}
a:hover{color:var(--red);}
img{max-width:100%;display:block;}
ul,ol{list-style:none;}
.clear{clear:both;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px;}

/* ============ 顶部黑色 Masthead ============ */
.m-top{background:var(--black);color:#fff;}
.m-top .wrap{display:flex;align-items:center;gap:24px;min-height:56px;}
.m-brand{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.m-brand .brand-zh{
  color:var(--red);font-weight:800;font-size:26px;letter-spacing:2px;line-height:1;
  font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;
}
.m-brand .brand-en{color:#fff;font-size:11px;letter-spacing:3px;text-transform:uppercase;opacity:.85;}
.m-date{color:#b1b1b1;font-size:13px;margin-left:8px;}
.m-top .m-spacer{flex:1;}
.m-searchbtn{background:none;border:0;color:#fff;cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px;padding:6px 0;}
.m-searchbtn:hover{color:var(--red);}
.m-searchbar{background:#1a1a1a;display:none;border-top:1px solid #262626;}
.m-searchbar.open{display:block;}
.m-searchbar .wrap{display:flex;gap:0;padding-top:12px;padding-bottom:12px;}
.m-searchbar input[type=text]{
  flex:1;min-width:0;background:#fff;border:0;padding:10px 14px;font-size:15px;outline:none;
}
.m-searchbar button{background:var(--red);color:#fff;border:0;padding:10px 26px;font-size:15px;cursor:pointer;}
.m-searchbar button:hover{background:#a4001e;}

/* ============ 导航条 ============ */
.m-nav{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;box-shadow:0 1px 3px rgba(0,0,0,.06);}
.m-nav .wrap{display:flex;align-items:center;}
.m-nav ul{display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.m-nav ul::-webkit-scrollbar{display:none;}
.m-nav li a{
  display:block;padding:14px 18px;font-weight:700;font-size:15px;color:var(--black);
  border-bottom:3px solid transparent;white-space:nowrap;
}
.m-nav li a:hover{color:var(--black);border-bottom-color:var(--red);}
.m-nav li.cur a{border-bottom-color:var(--red);color:var(--red);}
.m-nav .nav-toggle{display:none;background:none;border:0;font-size:22px;color:var(--black);cursor:pointer;padding:8px 4px;}

/* ============ 头条 Hero 区 ============ */
.home-hero{padding:28px 0 8px;}
.hero-grid{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);gap:36px;}
.hero-main .kicker,.rail .kicker{color:var(--red);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;}
.hero-main figure{position:relative;margin-bottom:14px;}
.hero-main figure img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#eee;}
.hero-main h1{font-size:32px;line-height:1.25;font-weight:800;margin-bottom:10px;}
.hero-main h1 a:hover{color:var(--red);}
.hero-main .desc{color:var(--gray);font-size:16px;line-height:1.7;}
.hero-subs{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.hero-sub{display:flex;gap:12px;border-top:1px solid var(--border);padding-top:14px;}
.hero-sub img{width:120px;height:80px;object-fit:cover;flex-shrink:0;background:#eee;}
.hero-sub h3{font-size:15px;line-height:1.4;font-weight:700;}
.hero-sub h3 a:hover{color:var(--red);}

/* 右栏 要闻 */
.rail h2,.sec-head h2,.side-title{
  font-size:18px;font-weight:800;letter-spacing:1px;
  padding-left:10px;border-left:4px solid var(--red);line-height:1.3;
}
.rail h2{margin-bottom:12px;}
.rail ol{counter-reset:rail;}
.rail ol li{counter-increment:rail;border-top:1px solid var(--border);padding:12px 0 12px 34px;position:relative;}
.rail ol li:first-child{border-top:0;}
.rail ol li::before{
  content:counter(rail);position:absolute;left:0;top:12px;
  color:var(--red);font-weight:800;font-size:20px;line-height:1.3;
}
.rail ol li a{font-weight:700;font-size:15px;line-height:1.45;}
.rail .rail-more{display:block;text-align:right;color:var(--red);font-size:13px;font-weight:700;padding-top:8px;}

/* ============ 分区 Section ============ */
.sec{margin:34px 0;}
.sec-head{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid var(--black);padding-bottom:8px;margin-bottom:18px;}
.sec-head .sec-more{color:var(--red);font-size:13px;font-weight:700;flex-shrink:0;margin-left:16px;}
.sec-head .sec-more:hover{color:var(--black);}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
.card{min-width:0;}
.card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#eee;margin-bottom:10px;}
.card .kicker{color:var(--red);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;}
.card h3{font-size:16px;line-height:1.4;font-weight:700;margin-bottom:6px;}
.card h3 a:hover{color:var(--red);}
.card time,.card .meta{color:var(--gray);font-size:12px;}
.card p{color:var(--gray);font-size:13px;line-height:1.6;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* 两列子区（头条下方横排小卡） */
.cards2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}

/* ============ 标签云 / 友情链接 ============ */
.chipbox{margin:34px 0;}
.chipbox .sec-head{margin-bottom:14px;}
.chips{display:flex;flex-wrap:wrap;gap:10px;}
.chips a{
  display:inline-block;padding:6px 14px;border:1px solid var(--border);border-radius:3px;
  font-size:13px;color:var(--gray);background:var(--soft);
}
.chips a:hover{border-color:var(--red);color:var(--red);background:#fff;}
.linksbox .chips a{background:#fff;}
.linksbox{border-top:1px solid var(--border);margin:34px 0 0;padding:22px 0;}
.linksbox .lb-title{font-size:14px;font-weight:800;color:var(--black);margin-bottom:12px;padding-left:10px;border-left:4px solid var(--red);}

/* ============ 列表页 ============ */
.crumb{padding:18px 0 0;color:var(--gray);font-size:13px;}
.crumb a{color:var(--gray);}
.crumb a:hover{color:var(--red);}
.crumb .sep{margin:0 6px;color:#b1b1b1;}
.page-title-block{padding:14px 0 10px;}
.page-title-block h1{font-size:26px;font-weight:800;display:inline-block;padding-bottom:8px;border-bottom:3px solid var(--red);}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;padding:10px 0 40px;}
.list-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
.list-cards .card p{-webkit-line-clamp:3;}
.pager{margin:30px 0 10px;text-align:center;}
.pager a,.pager strong,.pager span{
  display:inline-block;min-width:36px;padding:7px 12px;margin:0 4px 6px 0;
  border:1px solid var(--border);font-size:14px;color:var(--ink);background:#fff;
}
.pager strong,.pager span.cur{background:var(--black);color:#fff;border-color:var(--black);font-weight:700;}
.pager a:hover{border-color:var(--red);color:var(--red);}

/* ============ 侧栏 ============ */
.side .side-box{border:1px solid var(--border);border-radius:4px;padding:20px;margin-bottom:26px;background:#fff;}
.side .side-title{margin-bottom:14px;}
.side .num-list{counter-reset:hot;}
.side .num-list li{counter-increment:hot;border-top:1px solid var(--border);padding:10px 0 10px 30px;position:relative;}
.side .num-list li:first-child{border-top:0;}
.side .num-list li::before{content:counter(hot);position:absolute;left:0;top:10px;color:var(--red);font-weight:800;font-size:16px;}
.side .num-list li a{font-size:14px;font-weight:600;line-height:1.5;display:block;}
.side .thumb-list li{display:flex;gap:12px;border-top:1px solid var(--border);padding:12px 0;}
.side .thumb-list li:first-child{border-top:0;}
.side .thumb-list img{width:78px;height:52px;object-fit:cover;flex-shrink:0;background:#eee;}
.side .thumb-list p{font-size:14px;font-weight:600;line-height:1.5;}
.side .topnews{margin-bottom:12px;}
.side .topnews img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#eee;}
.side .topnews figcaption{font-size:14px;font-weight:700;line-height:1.5;padding-top:8px;}

/* ============ 文章页 ============ */
.art{max-width:760px;}
.art .kicker{color:var(--red);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;}
.art h1.headline{font-size:30px;line-height:1.3;font-weight:800;margin-bottom:14px;}
.art .art-meta{color:var(--gray);font-size:13px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:10px 0;margin-bottom:22px;display:flex;flex-wrap:wrap;gap:8px 22px;}
.art-body{font-size:17px;line-height:1.85;color:#1a1a1a;}
.art-body p{margin-bottom:1.2em;}
.art-body img{margin:1em auto;border-radius:2px;}
.art-body h2,.art-body h3{margin:1.4em 0 .6em;font-weight:800;}
.art-tags{margin:26px 0;display:flex;flex-wrap:wrap;gap:8px;}
.art-tags a{display:inline-block;padding:5px 12px;background:var(--soft);border:1px solid var(--border);border-radius:3px;font-size:13px;color:var(--gray);}
.art-tags a:hover{border-color:var(--red);color:var(--red);}
.art-share{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--border);border-radius:4px;padding:16px;margin:26px 0;background:var(--soft);}
.art-share img{width:110px;height:110px;object-fit:cover;flex-shrink:0;}
.art-share p{font-size:13px;color:var(--gray);margin-bottom:4px;word-break:break-all;}
.art-share p b{color:var(--black);}
.prevnext{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0;}
.prevnext a{border:1px solid var(--border);border-radius:4px;padding:14px 16px;display:block;}
.prevnext a:hover{border-color:var(--red);}
.prevnext .pn-label{color:var(--red);font-size:12px;font-weight:800;margin-bottom:6px;}
.prevnext h3{font-size:15px;font-weight:700;line-height:1.5;}
.related h2{font-size:18px;font-weight:800;padding-left:10px;border-left:4px solid var(--red);margin-bottom:14px;}
.related ul{border-top:1px solid var(--border);}
.related li{border-bottom:1px solid var(--border);}
.related li a{display:block;padding:12px 2px;font-weight:600;font-size:15px;}
.related li a:hover{color:var(--red);}

/* ============ 单页 page ============ */
.single-page{max-width:860px;margin:0 auto;padding:20px 0 50px;}
.single-page h1{font-size:26px;font-weight:800;padding-bottom:10px;border-bottom:3px solid var(--red);margin-bottom:20px;}
.single-page .content{font-size:16px;line-height:1.85;}
.single-page .content p{margin-bottom:1.1em;}
.single-page .subnav{margin-top:30px;border-top:1px solid var(--border);padding-top:14px;}
.single-page .subnav a{display:inline-block;margin-right:16px;color:var(--gray);font-size:14px;}
.single-page .subnav a:hover{color:var(--red);}

/* ============ 搜索页 ============ */
.filterbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0 22px;}
.filterbar .f-label{font-weight:800;font-size:14px;}
.filterbar a{display:inline-block;padding:6px 14px;border:1px solid var(--border);border-radius:3px;font-size:13px;color:var(--gray);}
.filterbar a.on,.filterbar a:hover{border-color:var(--red);color:var(--red);}
.search-input{display:flex;max-width:560px;margin-bottom:26px;}
.search-input input{flex:1;min-width:0;border:1px solid var(--border);border-right:0;padding:10px 14px;font-size:15px;outline:none;}
.search-input input:focus{border-color:var(--red);}
.search-input button{background:var(--red);color:#fff;border:0;padding:10px 24px;font-size:15px;cursor:pointer;}
.null-tip{color:var(--gray);padding:40px 0;text-align:center;}

/* ============ 页脚（黑色） ============ */
.m-foot{background:var(--black);color:#b1b1b1;margin-top:50px;}
.m-foot .f-top{display:flex;flex-wrap:wrap;gap:30px;padding:34px 0 22px;border-bottom:1px solid #262626;}
.m-foot .f-col{min-width:180px;flex:1;}
.m-foot .f-col h4{color:#fff;font-size:14px;font-weight:800;letter-spacing:1px;margin-bottom:12px;padding-left:8px;border-left:3px solid var(--red);}
.m-foot .f-col li{margin-bottom:8px;font-size:13px;}
.m-foot .f-col a{color:#b1b1b1;}
.m-foot .f-col a:hover{color:#fff;}
.m-foot .f-copy{padding:18px 0 26px;font-size:12px;line-height:2;color:#8c8c8c;text-align:center;}
.m-foot .f-copy a{color:#b1b1b1;}
.m-foot .f-copy a:hover{color:#fff;}
.gotop{
  position:fixed;right:24px;bottom:40px;width:44px;height:44px;line-height:44px;text-align:center;
  background:var(--black);color:#fff;border-radius:3px;font-size:13px;display:none;z-index:99;cursor:pointer;
}
.gotop:hover{background:var(--red);color:#fff;}

/* ============ 响应式 ============ */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:26px;}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr));}
  .layout{grid-template-columns:1fr;}
  .m-date{display:none;}
}
@media (max-width:600px){
  .hero-main h1{font-size:24px;}
  .art h1.headline{font-size:22px;}
  .cards{grid-template-columns:1fr;}
  .hero-subs{grid-template-columns:1fr;}
  .list-cards{grid-template-columns:1fr;}
  .prevnext{grid-template-columns:1fr;}
  .m-nav .nav-toggle{display:block;}
  .m-nav ul{display:none;width:100%;flex-direction:column;padding-bottom:8px;}
  .m-nav ul.open{display:flex;}
  .m-nav li a{border-bottom:1px solid var(--border);padding:12px 4px;}
  .m-nav li.cur a,.m-nav li a:hover{border-bottom-color:var(--red);}
}
