.news-section{
  --ns-border:#eceae5;
  --ns-thumb:#e7e5df;
  --ns-title:#181818;
  --ns-meta:#79776f;
  --ns-avatar:#d8d5cc;
}
html.dark-mode .news-section{
  --ns-border:#2c2d31;
  --ns-thumb:#33343a;
  --ns-title:#f0efe9;
  --ns-meta:#9a9890;
  --ns-avatar:#45464c;
}

.news-heading-row{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  padding-bottom:12px;
  margin-bottom:20px;
  border-bottom:1px solid var(--ns-border);
}

.news-heading{
  font-family:'Inter', 'Helvetica Neue', Arial, sans-serif;
  font-size:20px;
  font-weight:700;
  color:var(--ns-title);
  margin:0;
  flex-shrink:0;
  white-space:nowrap;
}

.news-heading-sep{
  flex-shrink:0;
  font-size:16px;
  font-weight:400;
  color:var(--ns-border);
}

/* ---- Category tab menu ---- */
.news-tabs-wrap{
  flex:1;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -webkit-mask-image:linear-gradient(to right, #000 0, #000 calc(100% - 24px), transparent 100%);
  mask-image:linear-gradient(to right, #000 0, #000 calc(100% - 24px), transparent 100%);
}
.news-tabs-wrap::-webkit-scrollbar{display:none;}

.news-tabs{
  display:flex;
  align-items:center;
  gap:20px;
}
.news-tab{
  flex-shrink:0;
  padding:4px 0;
  font-family:'Inter', 'Helvetica Neue', Arial, sans-serif;
  font-size:13.5px;
  font-weight:600;
  color:var(--ns-meta);
  text-decoration:none;
  white-space:nowrap;
  transition:color .15s;
}

.news-tab:hover{color:#e2231a;}
.news-tab.is-active{color:#fff; font-weight:700; background:#e2231a; padding:5px 12px; border-radius:7px;}

.news-tab-sep{
  flex-shrink:0;
  font-size:14px;
  color:var(--ns-border);
}
.news-tab-cta{
  flex-shrink:0;
  white-space:nowrap;
  color:#fff;
  font-family:'Inter', 'Helvetica Neue', Arial, sans-serif;
  font-size:13.5px;
  font-weight:700;
  text-decoration:none !important;
  background:#e2231a;
  padding:7px 14px;
  border-radius:7px;
  transition:background .15s;
}
.news-tab-cta:hover,
.news-tab-cta:focus,
.news-tab-cta:active{color:#fff; background:#c41d15; text-decoration:none !important;}

.news-columns{
  column-count:2;
  column-gap:20px;
}
@media (max-width:640px){
  .news-columns{column-count:1;}
  .news-heading-row{flex-wrap:wrap; row-gap:10px;}
  .news-heading-sep{display:none;}
  .news-tabs-wrap{flex:1 0 100%;}
}
@media (max-width:400px){
  .news-card.compact{gap:10px;}
  .news-card.compact .news-thumb{width:104px; height:80px;}
  .news-card.compact .news-title{font-size:13.5px;}
  .news-card.featured .news-thumb{height:180px;}
}

.news-card{
  break-inside:avoid;
  margin-bottom:20px;
  padding-bottom:20px;
  border-bottom:1px solid var(--ns-border);
  text-decoration:none;
  display:block;
}
.news-card:last-child{border-bottom:none;}

/* ---- Compact card: thumb left, text right ---- */
.news-card.compact{
  display:flex;
  gap:14px;
}
.news-card.compact .news-thumb{
  width:140px;
  height:100px;
  flex-shrink:0;
  border-radius:8px;
  background:var(--ns-thumb);
}
.news-card.compact .news-body{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.news-card.compact .news-title{
  font-size:14.5px;
  margin-bottom:8px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ---- Featured card: full-width image on top ---- */
.news-card.featured .news-thumb{
  width:100%;
  height:240px;
  border-radius:8px;
  background:var(--ns-thumb);
  margin-bottom:14px;
}
.news-card.featured .news-title{
  font-size:18px;
  margin-bottom:10px;
}

.news-title{
  font-weight:700;
  color:var(--ns-title);
  line-height:1.35;
  margin:0 0 8px;
}

.news-meta{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--ns-meta);
  margin-top:auto;
}
.news-avatar{
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--ns-avatar);
  flex-shrink:0;
}
.news-dot{opacity:0.5;}

/* ---- Pagination ---- */
.pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-top:8px;
  padding-top:24px;
  border-top:1px solid var(--ns-border);
}
.pg-btn{
  width:34px;
  height:34px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  border:1px solid var(--ns-border);
  background:transparent;
  color:var(--ns-meta);
  cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
}
.pg-btn svg{width:15px; height:15px;}
.pg-btn:hover:not(:disabled){border-color:#e2231a; color:#e2231a;}
.pg-btn:disabled{opacity:0.35; cursor:not-allowed;}

.pg-pages{
  display:flex;
  align-items:center;
  gap:4px;
  margin:0 4px;
}
.pg-num{
  min-width:34px;
  height:34px;
  padding:0 4px;
  border-radius:8px;
  border:1px solid transparent;
  background:transparent;
  color:var(--ns-meta);
  font-size:13px;
  font-weight:700;
  font-family:'Inter', 'Helvetica Neue', Arial, sans-serif;
  cursor:pointer;
  transition:background .15s, color .15s;
}
.pg-num:hover{background:var(--ns-thumb); color:var(--ns-title);}
.pg-num.is-active{background:#e2231a; color:#fff;}
.pg-ellipsis{
  color:var(--ns-meta);
  font-size:13px;
  padding:0 4px;
  user-select:none;
}

@media (max-width:480px){
  .pg-btn, .pg-num{width:30px; height:30px; min-width:30px; font-size:12px;}
}
