/* ==========================================================================
   Trang "Tin tức" — dùng kèm common.css (header/footer/social/nút nổi chung).
   Số đo px lấy từ Figma: desktop 1920, mobile 390.
   ========================================================================== */

.news { font-family: var(--font-2); }
.news a { color: inherit; }
.news a:hover { color: #f27226; }

.nw-date { margin-top: 0; font-size: 13px; line-height: 19.5px; color: #5d5d5d; }
.nw-excerpt {
  margin-top: 10px; font-size: 16px; line-height: 24px; color: #5d5d5d;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- Tin nổi bật + 5 tin mới ---------- */
.nw-top { padding: 89px 0 40px; }
.nw-top-grid { display: flex; align-items: flex-start; gap: 24px; }
.nw-feat { width: 768px; flex-shrink: 0; }
.nw-feat-img { display: block; }
.nw-feat-img img { display: block; width: 100%; height: auto; aspect-ratio: 768 / 438.84; object-fit: cover; }
.nw-feat-title {
  margin: 20px 0 10px; font-family: var(--font-2); font-weight: 700; font-size: 20px; line-height: 30px; color: #333;
}
.nw-feat-excerpt { height: 88px; -webkit-line-clamp: 3; }

.nw-side { flex: 1; min-width: 0; margin: 0; padding: 0; list-style: none; }
.nw-side-item { display: flex; align-items: flex-start; gap: 15px; }
.nw-side-item > div { padding-bottom: 10px; }
.nw-side-item + .nw-side-item { margin-top: 24px; }
.nw-side-thumb { flex-shrink: 0; }
.nw-side-thumb img { display: block; width: 100px; height: 100px; object-fit: cover; }
.nw-side-title { margin: 0; font-family: var(--font-2); font-weight: 600; font-size: 16px; line-height: 24px; color: #333; }

/* ---------- Danh sách tin + sidebar ---------- */
.nw-main { background: #f2f3f5; padding: 80px 0; }
.nw-main-grid { display: flex; align-items: flex-start; gap: 24px; }
.nw-list { width: 776px; flex-shrink: 0; }
.nw-item { display: flex; align-items: flex-start; gap: 24px; }
.nw-item + .nw-item { margin-top: 50px; }
.nw-item-img { flex-shrink: 0; }
.nw-item-img img { display: block; width: 275px; height: 160px; object-fit: cover; }
.nw-item-body { flex: 1; min-width: 0; }
.nw-item-title { margin: 0; font-family: var(--font-2); font-weight: 600; font-size: 16px; line-height: 24px; color: #333; }

.nw-pager {
  display: flex; justify-content: center; align-items: center; gap: 19.7px; margin-top: 50px;
  font-weight: 600; font-size: 16px; line-height: 24px;
}
.nw-pager a { color: #464646; }
.nw-pager a.is-current, .nw-pager .nw-dots { color: #f27226; }

.nw-aside { flex: 1; min-width: 0; }
.nw-aside-title {
  display: flex; align-items: center; height: 30px; margin: 0;
  font-family: var(--font-2); font-weight: 700; font-size: 24px; line-height: 28.8px; color: #192f5f;
}
.nw-search-ico { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-right: 12px; flex-shrink: 0; }
.nw-search-ico img { display: block; width: 23.76px; height: 30px; }
.nw-sub { margin-top: 50px; padding: 50px 40px; background: #192f5f; }
.nw-sub-title { font-weight: 600; font-size: 24px; line-height: 36px; letter-spacing: .36px; color: #fff; text-align: center; }
.nw-sub-form { width: 100%; margin-top: 16px; }
.nw-social { justify-content: center; margin-top: 35px; }

/* ==========================================================================
   TABLET (992 – 1199)
   ========================================================================== */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .nw-feat { width: 62%; }
  .nw-list { width: 64%; }
  .nw-item-img img { width: 220px; height: 128px; }
}

/* ==========================================================================
   MOBILE (< 992) — artboard 390
   ========================================================================== */
@media (max-width: 991.98px) {
  .news .container { padding-left: 8.39px; padding-right: 8.39px; }

  .nw-top { padding: 31px 0 28px; }
  .nw-top-grid { flex-direction: column; align-items: stretch; gap: 0; }
  .nw-feat { width: 100%; }
  .nw-feat-img img { aspect-ratio: 373.22 / 213.27; }
  .nw-feat-title { margin: 19.5px 0 10.5px; }
  .nw-feat-excerpt { height: 72px; }
  .nw-side { margin-top: 24px; }

  .nw-main { padding: 56px 0; }
  .nw-main-grid { flex-direction: column; align-items: stretch; gap: 0; }
  .nw-list { width: 100%; }
  .nw-item { flex-direction: column; gap: 0; }
  .nw-item + .nw-item { margin-top: 24px; }
  .nw-item-img { width: 100%; }
  .nw-item-img img { width: 100%; height: auto; aspect-ratio: 373.22 / 217.14; }
  .nw-item-body { margin-top: 24px; }
  .nw-pager { margin-top: 24px; }
  .nw-list > .nw-item:last-child { margin-bottom: 24px; }
  .nw-aside-title { font-size: 16.8px; line-height: 20.16px; }
  .nw-sub { margin-top: 35px; padding: 35px 28px; }
  .nw-sub-form { margin-top: 11.18px; }
  .nw-social { margin-top: 24.5px; }
}

/* ---------- Tab lọc tin + nút Xem thêm (Sheet 7) ---------- */
.nw-tabs { padding-top: 11px; }
.nw-tabs ul { display: flex; flex-wrap: wrap; gap: 10px; }
.nw-tabs a {
  display: inline-flex; align-items: center; height: 38px; padding: 0 18px;
  border: 1px solid #cfdbea; border-radius: 50px; font-size: 16px; color: var(--ink); background: #fff;
}
.nw-tabs a:hover { border-color: var(--blue); color: var(--blue); }
.nw-tabs a.active { border-color: var(--blue); background: var(--blue); color: #fff; }
.nw-tabs + .nw-top { padding-top: 40px; }
.nw-more { display: inline-block; margin-top: 10px; font-weight: 600; font-size: 15px; color: var(--blue); }
.nw-more::after { content: " →"; }
.nw-more:hover { text-decoration: underline; }
@media (max-width: 991.98px) {
  .nw-tabs { padding-top: 24px; }
  .nw-tabs ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .nw-tabs ul::-webkit-scrollbar { display: none; }
  .nw-tabs li { flex-shrink: 0; }
  .nw-tabs a { height: 34px; font-size: 14px; padding: 0 14px; }
  .nw-tabs + .nw-top { padding-top: 16px; }
}