.news-page-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:var(--space-sm);
  margin-bottom:var(--space-xl);
  padding-bottom:var(--space-md);
  border-bottom:2px solid var(--color-border);
}
.news-page-title{
  font-family:var(--font-heading);
  font-size:clamp(1.6rem,4vw,2.4rem);
  font-weight:700;
  color:var(--color-primary);
}
[data-theme="dark"] .news-page-title{color:var(--verse-color);}
.news-date-badge{
  font-family:var(--font-ui);
  font-size:.8rem;
  color:var(--color-text-muted);
  background:var(--color-surface-2);
  padding:.35rem .9rem;
  border-radius:var(--radius-full);
  border:1px solid var(--color-border);
}
.filter-bar{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  margin-bottom:var(--space-2xl);
}
.filter-pill{
  font-family:var(--font-ui);
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  padding:.4rem 1rem;
  border-radius:var(--radius-full);
  border:1.5px solid var(--color-border);
  background:var(--color-surface);
  /*color:var(--color-text-muted);*/
  transition:all var(--transition-fast);
  cursor:pointer;
  white-space:nowrap;
}
.filter-pill:hover{
  border-color:var(--verse-color);
  color:var(--verse-color);
  background:var(--color-surface-2);
}
.filter-pill.active{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
  box-shadow:var(--shadow-md);
}
.section-title{
  font-family:var(--font-heading);
  font-size:clamp(1.2rem,3vw,1.6rem);
  font-weight:700;
  color:var(--color-text);
  margin-bottom:var(--space-lg);
  padding-bottom:var(--space-sm);
  position:relative;
}
.section-title::after{
  content:'';
  position:absolute;
  bottom:0; left:0;
  width:56px; height:3px;
  background:var(--color-accent);
  border-radius:2px;
}
.featured-section{margin-bottom:var(--space-3xl);}
.featured-grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:var(--space-xl);
}
@media(max-width:900px){.featured-grid{grid-template-columns:1fr;}}
.featured-main{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  display:block;
  transition:transform var(--transition-base),box-shadow var(--transition-base);
  min-height:360px;
}
.featured-main:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);}
.featured-main img{
  width:100%; height:460px;
  object-fit:cover;
  transition:transform var(--transition-slow);
}
.featured-main:hover img{transform:scale(1.04);}
@media(max-width:600px){.featured-main img{height:260px;}}

.featured-overlay{
  position:absolute;
  bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(10,15,36,.92) 0%, rgba(10,15,36,.4) 60%, transparent 100%);
  padding:var(--space-2xl) var(--space-xl) var(--space-xl);
  color:#fff;
}
.featured-cat-badge{
  display:inline-block;
  background:var(--color-accent);
  color:var(--color-primary-dark);
  font-family:var(--font-ui);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.25rem .85rem;
  border-radius:var(--radius-full);
  margin-bottom:var(--space-sm);
}
.featured-title{
  color: var(--color-accent-light);
  font-family:var(--font-heading);
  font-size:clamp(1.2rem,3vw,1.8rem);
  font-weight:700;
  line-height:1.3;
  margin-bottom:var(--space-sm);
}
.featured-meta-row{
  display:flex;
  gap:var(--space-md);
  font-family:var(--font-ui);
  font-size:.8rem;
  color:rgba(255,255,255,.75);
  flex-wrap:wrap;
}
.featured-sidebar{
  display:flex;
  flex-direction:column;
  gap:var(--space-lg);
}
.sidebar-feature-card{
  display:flex;
  gap:var(--space-md);
  background:var(--color-surface);
  border-radius:var(--radius-md);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--color-border);
  transition:transform var(--transition-base),box-shadow var(--transition-base);
  text-decoration:none;
  color:var(--color-text);
}
.sidebar-feature-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-md);
}
.sidebar-feature-card img{
  width:110px; min-width:110px;
  height:110px;
  object-fit:cover;
  flex-shrink:0;
}
@media(max-width:480px){
  .sidebar-feature-card{flex-direction:column;}
  .sidebar-feature-card img{width:100%;height:160px;}
}
.sidebar-card-body{
  padding:var(--space-md);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.3rem;
  flex:1;
  min-width:0;
}
.sidebar-card-cat{
  font-family:var(--font-ui);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-accent);
}
.sidebar-card-title{
  font-family:var(--font-heading);
  font-size:.95rem;
  font-weight:600;
  line-height:1.4;
  color:var(--color-text);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.sidebar-card-meta{
  font-family:var(--font-ui);
  font-size:.75rem;
  color:var(--color-text-muted);
}

.latest-section{margin-bottom:var(--space-3xl);}

.news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px,1fr));
  gap:var(--space-xl);
}
@media(max-width:640px){
  .news-grid{grid-template-columns:1fr;}
}

.news-card{
  background:var(--color-surface);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--color-border);
  display:flex;
  flex-direction:column;
  transition:transform var(--transition-base),box-shadow var(--transition-base);
  text-decoration:none;
  color:var(--color-text);
  animation:fadeUp .45s ease both;
}
.news-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(18px);}
  to{opacity:1;transform:translateY(0);}
}
.news-card:nth-child(1){animation-delay:.05s;}
.news-card:nth-child(2){animation-delay:.1s;}
.news-card:nth-child(3){animation-delay:.15s;}
.news-card:nth-child(4){animation-delay:.2s;}
.news-card:nth-child(5){animation-delay:.25s;}
.news-card:nth-child(6){animation-delay:.3s;}

.news-img-wrap{
  position:relative;
  overflow:hidden;
  flex-shrink:0;
}
.news-img-wrap img{
  width:100%; height:200px;
  object-fit:cover;
  transition:transform var(--transition-slow);
}
.news-card:hover .news-img-wrap img{transform:scale(1.08);}

.news-cat-badge{
  position:absolute;
  top:var(--space-sm); left:var(--space-sm);
  background:var(--color-primary);
  color:#fff;
  font-family:var(--font-ui);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase;
  padding:.22rem .75rem;
  border-radius:var(--radius-full);
}

.news-card-body{
  padding:var(--space-lg);
  display:flex;
  flex-direction:column;
  flex:1;
  gap:var(--space-sm);
}
.news-card-title{
  font-family:var(--font-heading);
  font-size:1.1rem;
  font-weight:700;
  line-height:1.4;
  color:var(--color-text);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.news-card-excerpt{
  font-size:.88rem;
  color:var(--color-text-muted);
  line-height:1.6;
  flex:1;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.news-card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:var(--space-sm);
  border-top:1px solid var(--color-border);
  gap:var(--space-sm);
  flex-wrap:wrap;
}
.nc-author{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.nc-avatar{
  width:28px; height:28px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--color-border);
  flex-shrink:0;
}
.nc-author-name{
  font-family:var(--font-ui);
  font-size:.78rem;
  font-weight:600;
  color:var(--color-text);
}
.nc-date{
  font-family:var(--font-ui);
  font-size:.75rem;
  color:var(--color-text-light);
  white-space:nowrap;
}
.nc-stats{
  display:flex;
  gap:var(--space-sm);
  font-family:var(--font-ui);
  font-size:.72rem;
  color:var(--color-text-muted);
}
.nc-stat{display:flex;align-items:center;gap:.25rem;}

.empty-state{
  grid-column:1/-1;
  text-align:center;
  padding:var(--space-3xl) var(--space-xl);
  color:var(--color-text-muted);
  font-family:var(--font-ui);
}
.empty-state i{font-size:2.5rem;margin-bottom:var(--space-md);opacity:.4;display:block;}
.empty-state p{font-size:1rem;}
.empty-state small{font-size:.85rem;margin-top:.4rem;display:block;}

.trending-section{
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  padding:var(--space-xl);
  margin-bottom:var(--space-3xl);
  box-shadow:var(--shadow-sm);
}
.trending-list{display:flex;flex-direction:column;gap:0;}
.trending-item{
  display:flex;
  align-items:flex-start;
  gap:var(--space-lg);
  padding:var(--space-md) 0;
  border-bottom:1px solid var(--color-border);
  text-decoration:none;
  color:var(--color-text);
  transition:transform var(--transition-fast);
}
.trending-item:last-child{border-bottom:none;}
.trending-item:hover{transform:translateX(6px);}
.trending-num{
  font-family:var(--font-heading);
  font-size:2rem;
  font-weight:800;
  color:var(--color-border);
  min-width:48px;
  line-height:1;
  transition:color var(--transition-fast);
}
.trending-item:hover .trending-num{color:var(--color-accent);}
.trending-body{flex:1;min-width:0;}
.trending-title{
  font-family:var(--font-heading);
  font-size:1rem;
  font-weight:600;
  line-height:1.4;
  margin-bottom:.3rem;
  color:var(--color-text);
}
.trending-meta-row{
  font-family:var(--font-ui);
  font-size:.75rem;
  color:var(--color-text-muted);
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}
.trending-views{
  display:flex; align-items:center; gap:.25rem;
  color:var(--color-accent-dark);
  font-weight:600;
}

.notif-toast{
  position:fixed;
  bottom:24px; left:50%;
  transform:translateX(-50%) translateY(20px);
  opacity:0;
  background:var(--color-primary-dark);
  color:#fff;
  padding:.7rem 1.4rem;
  border-radius:var(--radius-full);
  font-family:var(--font-ui);
  font-size:.85rem;
  font-weight:600;
  box-shadow:var(--shadow-xl);
  z-index:9999;
  transition:opacity var(--transition-base),transform var(--transition-base);
  display:flex; align-items:center; gap:.5rem;
  pointer-events:none;
}
.notif-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.notif-toast.success{background:#166534;}
.notif-toast.error  {background:#991b1b;}

@media(max-width:480px){
  .featured-grid{gap:var(--space-md);}
  .news-grid    {gap:var(--space-md);}
  .trending-num {font-size:1.4rem;min-width:34px;}
  .section-title{font-size:1.1rem;}
}