/**
 * News — CSS riêng của archive Category (category.php). Nguồn: docs/design-previews/news.html (.nw-*).
 * Nạp khi is_category() (xem functions.php). Token dùng chung lấy từ sjourney.css.
 */
.sj-page--news { background: var(--sj-cream); }

/* ---- Hero + filter ---- */
.nw-head { background: var(--sj-cream); padding: var(--sp-240, 240px) var(--sp-48) 0; display: flex; flex-direction: column; align-items: center; gap: var(--sp-24); }
.nw-head__title { font-size: var(--fs-72); font-weight: 500; text-transform: uppercase; line-height: 1.1; margin: 0; color: var(--sj-dark); text-align: center; }
.nw-head__intro { font-size: var(--fs-24); font-weight: 300; line-height: 1.25; color: var(--sj-gray); text-align: center; max-width: 824px; margin: 0; }

/* Chip filter: active = nền vàng + chữ trắng */
.nw-chips { display: flex; gap: 4px; padding-top: var(--sp-48); flex-wrap: wrap; justify-content: center; }
.nw-chip {
	background: #fff; border: 0; min-height: 64px; display: inline-flex; align-items: center; justify-content: center;
	padding: var(--sp-24) var(--sp-48); font-family: inherit; font-size: var(--fs-24); font-weight: 500;
	color: var(--sj-muted-nw); cursor: pointer; white-space: nowrap; text-decoration: none;
}
.nw-chip:hover { color: var(--sj-dark); }
.nw-chip.is-active { background: var(--sj-yellow); color: #fff; }

/* ---- Lưới 3×3 ---- */
.nw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: var(--sp-48) var(--sp-48) 0; align-items: stretch; }
.nw-card { display: flex; flex-direction: column; gap: var(--sp-24); background: #fff; padding-bottom: var(--sp-48); text-decoration: none; color: inherit; height: 100%; }
.nw-card__img { width: 100%; height: 420px; display: block; object-fit: cover; background: var(--sj-n3-nw); }
.nw-card__head { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; padding: 0 var(--sp-48); }
.nw-card__badge { background: var(--sj-rose-nw); color: #fff; font-size: var(--fs-20); text-transform: uppercase; padding: 4px 12px; }
.nw-card__title { font-size: clamp(24px, calc(0.67vw + 17.14px), 30px); font-weight: 500; text-transform: uppercase; color: var(--sj-dark); line-height: 1.1; margin: 0; }
.nw-card__excerpt { font-size: var(--fs-20); font-weight: 300; color: var(--sj-gray); line-height: 1.2; text-align: justify; padding: 0 var(--sp-48); margin: 0; }
.nw-card__meta { font-size: var(--fs-20); text-transform: uppercase; color: var(--sj-muted-nw); letter-spacing: -.1px; padding: 0 var(--sp-48); margin-top: auto; }

/* ---- Phân trang (paginate_links được gắn class nw-pager__*) ---- */
.nw-pager { display: flex; gap: var(--sp-24); align-items: center; justify-content: center; padding: var(--sp-48) 0 var(--sp-80); flex-wrap: wrap; }
.nw-pager__arrow, .nw-pager__num {
	min-width: var(--ico-64); height: var(--ico-64); display: inline-flex; align-items: center; justify-content: center;
	font-family: inherit; font-size: var(--fs-24); font-weight: 500; color: var(--sj-muted-nw);
	background: none; border: 0; cursor: pointer; text-decoration: none; padding: 0 8px;
}
.nw-pager__arrow { border-radius: 50%; background: #fff; font-size: 20px; color: var(--sj-dark); padding: 0; }
a.nw-pager__num:hover, a.nw-pager__arrow:hover { color: var(--sj-red); }
.nw-pager__num.is-current { background: var(--sj-red); color: var(--sj-cream); border-radius: 0; }
.nw-pager .dots { background: none; }

.nw-empty { padding: var(--sp-80) var(--sp-48); text-align: center; font-size: var(--fs-24); color: var(--sj-gray); }

@media (max-width: 1023px) {
	.nw-head { padding-top: var(--sp-160, 160px); }
	.nw-grid { grid-template-columns: 1fr; padding: var(--sp-24) 20px 0; }
	.nw-card__img { height: 280px; }
}