.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-tab-cta-wrap{
  position:relative;
  display:inline-flex;
  flex-shrink:0;
}
.news-tab-tooltip{
  position:absolute;
  bottom:calc(100% + 13px);
  right:0;
  width:270px;
  background:#1c1b19;
  color:#fff;
  padding:14px 16px 15px;
  border-radius:10px;
  box-shadow:0 18px 44px rgba(0,0,0,0.32);
  z-index:70;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(6px);
  transition:opacity .12s ease, transform .12s ease, visibility 0s linear .12s;
}
.news-tab-cta-wrap:hover .news-tab-tooltip{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:opacity .1s ease, transform .1s ease;
}
.news-tab-tooltip-title{
  font-size:12.5px;
  font-weight:900;
  letter-spacing:0.3px;
  text-transform:uppercase;
  color:#ff5b52;
  margin-bottom:6px;
}
.news-tab-tooltip-text{
  font-size:12.5px;
  line-height:1.55;
  color:rgba(255,255,255,0.88);
  margin:0;
}
.news-tab-tooltip-text strong{color:#fff; font-weight:800;}
.news-tab-tooltip-arrow{
  position:absolute;
  top:100%;
  right:22px;
  width:0; height:0;
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-top:7px solid #1c1b19;
}

.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;
  cursor:pointer;
  transition:transform .1s;
}
.news-card:last-child{border-bottom:none;}
.news-card:hover .news-title{color:#e2231a;}
.news-card:hover .news-thumb{box-shadow:0 6px 16px rgba(226,35,26,0.16); transform:translateY(-1px);}
.news-card:active{transform:scale(0.99);}
.news-card:active .news-thumb{box-shadow:0 2px 10px rgba(226,35,26,0.28);}

/* ---- 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);
  transition:box-shadow .15s, transform .15s;
}
.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;
  transition:box-shadow .15s, transform .15s;
}
.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;
  transition:color .15s;
}

.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:flex-end;
  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;}
  .pagination{justify-content:center;}
}
