/* Chi tiết dự án - Tab Tin tức / giao diện mới */
.project-news-page {
  --pn-blue: #0965df;
  --pn-blue-dark: #071d4e;
  --pn-orange: #f18a16;
  --pn-muted: #68758a;
  --pn-border: #dce5f1;
  --pn-soft: #f7faff;
}

.project-news-content { padding: 42px 0 28px; }
.project-news-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 34px; align-items: start; }
.project-news-main, .project-news-sidebar { min-width: 0; }
.project-news-heading h2 { color: var(--pn-blue-dark); font-size: var(--font-section-title); line-height: 1.25; letter-spacing: -.025em; }
.project-news-heading p { max-width: 690px; margin-top: 9px; color: var(--pn-muted); font-size: var(--font-body-sm); line-height: 1.65; }

.project-news-search { position: relative; display: block; max-width: 650px; margin-top: 28px; }
.project-news-search input { width: 100%; height: 48px; padding: 0 50px 0 16px; color: #34425d; border: 1px solid var(--pn-border); border-radius: 10px; background: #fff; outline: none; font-size: var(--font-body-sm); }
.project-news-search input:focus { border-color: #7fb2f1; box-shadow: 0 0 0 3px rgba(9, 101, 223, .08); }
.project-news-search svg { position: absolute; top: 50%; right: 17px; width: 19px; height: 19px; color: #173563; transform: translateY(-50%); }

.project-news-categories { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.project-news-categories button { min-height: 38px; padding: 0 18px; color: #43516b; border: 1px solid #d4dfed; border-radius: 9px; background: #fff; font-size: var(--font-small); font-weight: 600; transition: .18s ease; }
.project-news-categories button:hover, .project-news-categories button:focus-visible { color: var(--pn-blue); border-color: #91bbf4; }
.project-news-categories button.is-active { color: #fff; border-color: var(--pn-blue); background: var(--pn-blue); box-shadow: 0 8px 18px rgba(9, 101, 223, .18); }

.project-news-featured { margin-top: 30px; }
.project-news-feature-card { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr); overflow: hidden; min-height: 324px; border: 1px solid var(--pn-border); border-radius: 14px; background: #fff; box-shadow: 0 10px 28px rgba(18, 58, 113, .06); }
.project-news-feature-card figure { position: relative; margin: 0; overflow: hidden; }
.project-news-feature-card figure img { width: 100%; height: 100%; min-height: 324px; object-fit: cover; transition: transform .25s ease; }
.project-news-feature-card:hover figure img { transform: scale(1.025); }
.project-news-feature-card__body { display: flex; flex-direction: column; justify-content: center; padding: 30px; }
.project-news-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: #748096; font-size: var(--font-small); }
.project-news-meta time { display: inline-flex; align-items: center; gap: 6px; }
.project-news-meta svg { width: 14px; height: 14px; }
.project-news-category-label { display: inline-flex; align-items: center; min-height: 24px; padding: 0 10px; color: #0760d6; border-radius: 999px; background: #e9f2ff; font-size: var(--font-small); font-weight: 700; text-transform: uppercase; }
.project-news-category-label[data-category="Chính sách bán hàng"] { color: #16915a; background: #e9f8ef; }
.project-news-category-label[data-category="Sự kiện"] { color: #7550c9; background: #f0ebff; }
.project-news-category-label[data-category="Thị trường khu vực"] { color: #3b5ec0; background: #edf1ff; }
.project-news-category-label[data-category="Cẩm nang"] { color: #6e4a9a; background: #f5efff; }
.project-news-feature-card h3 { margin-top: 16px; color: #0b2149; font-size: var(--font-section-title); line-height: 1.32; }
.project-news-feature-card p { margin-top: 13px; color: #66748a; font-size: var(--font-body-sm); line-height: 1.65; }
.project-news-read-more { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; align-self: flex-start; margin-top: 22px; padding: 0 18px; color: #fff; border-radius: 8px; background: var(--pn-blue); font-size: var(--font-small); font-weight: 700; }
.project-news-read-more svg { width: 15px; height: 15px; }

.project-news-latest { margin-top: 34px; }
.project-news-latest > h3 { color: var(--pn-blue-dark); font-size: var(--font-section-title); line-height: 1.25; }
.project-news-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 18px; }
.project-news-card { min-width: 0; overflow: hidden; border: 1px solid var(--pn-border); border-radius: 12px; background: #fff; box-shadow: 0 8px 22px rgba(18, 58, 113, .045); transition: transform .2s ease, box-shadow .2s ease; }
.project-news-card:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(18, 58, 113, .09); }
.project-news-card figure { margin: 0; overflow: hidden; }
.project-news-card figure img { width: 100%; aspect-ratio: 1.52 / 1; object-fit: cover; transition: transform .25s ease; }
.project-news-card:hover figure img { transform: scale(1.035); }
.project-news-card__body { padding: 14px 15px 16px; }
.project-news-card__top { display: flex; align-items: center; justify-content: space-between; gap: 9px; }
.project-news-card__top time { color: #7c879a; font-size: var(--font-small); white-space: nowrap; }
.project-news-card h4 { margin-top: 10px; color: #10264e; font-size: var(--font-body-lg); line-height: 1.45; }
.project-news-card p { min-height: 54px; margin-top: 8px; color: #6c788d; font-size: var(--font-small); line-height: 1.55; }
.project-news-card a { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: var(--pn-blue); font-size: var(--font-small); font-weight: 700; }
.project-news-card a svg { width: 14px; height: 14px; }
.project-news-empty { padding: 42px 16px; color: var(--pn-muted); text-align: center; font-size: var(--font-body-sm); }

.project-news-pagination { display: flex; justify-content: center; gap: 9px; margin-top: 30px; }
.project-news-pagination button { width: 34px; height: 34px; display: grid; place-items: center; color: #31415d; border: 1px solid var(--pn-border); border-radius: 8px; background: #fff; font-size: var(--font-small); }
.project-news-pagination button.is-active { color: #fff; border-color: var(--pn-blue); background: var(--pn-blue); }
.project-news-pagination button:disabled { opacity: .38; cursor: not-allowed; }
.project-news-pagination svg { width: 14px; height: 14px; }

.project-news-sidebar { display: grid; gap: 20px; }
.project-news-sidebar-card { padding: 20px; border: 1px solid var(--pn-border); border-radius: 14px; background: #fff; box-shadow: 0 10px 26px rgba(18, 58, 113, .05); }
.project-news-sidebar-card h3 { color: #122b58; font-size: var(--font-card-title-lg); }
.project-news-topic-card > div { display: grid; gap: 5px; margin-top: 16px; }
.project-news-topic-button { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px; color: #33435f; border: 0; border-radius: 8px; background: transparent; font-size: var(--font-small); text-align: left; }
.project-news-topic-button:hover, .project-news-topic-button.is-active { color: var(--pn-blue); background: #eef5ff; }
.project-news-topic-button strong { min-width: 31px; padding: 4px 8px; color: #174eaa; border-radius: 999px; background: #e6effe; font-size: var(--font-small); text-align: center; }

.project-news-popular-card > div { display: grid; gap: 14px; margin-top: 17px; }
.project-news-popular-item { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 12px; align-items: center; }
.project-news-popular-item img { width: 82px; height: 66px; object-fit: cover; border-radius: 9px; }
.project-news-popular-item h4 { color: #17305c; font-size: var(--font-small); line-height: 1.42; }
.project-news-popular-item time { display: flex; align-items: center; gap: 5px; margin-top: 6px; color: #7b879b; font-size: var(--font-caption); }
.project-news-popular-item time svg { width: 12px; height: 12px; }

.project-news-subscribe-card h3 { font-size: var(--font-subsection-title); }
.project-news-subscribe-card > p { margin-top: 12px; color: #65738b; font-size: var(--font-small); line-height: 1.6; }
.project-news-subscribe-card form { display: grid; gap: 11px; margin-top: 20px; }
.project-news-subscribe-card input { width: 100%; height: 44px; padding: 0 13px; border: 1px solid var(--pn-border); border-radius: 8px; outline: none; font-size: var(--font-small); }
.project-news-subscribe-card input:focus { border-color: #79adf0; box-shadow: 0 0 0 3px rgba(9, 101, 223, .08); }
.project-news-subscribe-card button { min-height: 44px; color: #fff; border: 0; border-radius: 8px; background: var(--pn-blue); font-size: var(--font-small); font-weight: 700; }
.project-news-subscribe-card small { display: flex; align-items: flex-start; gap: 7px; margin-top: 15px; color: #8a94a5; font-size: var(--font-small); line-height: 1.45; }
.project-news-subscribe-card small svg { width: 14px; height: 14px; flex: 0 0 auto; }

.project-news-newsletter { padding: 4px 0 26px; }
.project-news-newsletter__inner { position: relative; min-height: 126px; display: grid; grid-template-columns: minmax(320px, 1fr) minmax(420px, .9fr); gap: 28px; align-items: center; overflow: hidden; padding: 22px 230px 22px 30px; color: #fff; border-radius: 15px; background: linear-gradient(100deg, #0965df 0%, #4c8bf0 48%, #ffd49a 100%); box-shadow: 0 14px 30px rgba(9, 101, 223, .16); }
.project-news-newsletter__inner > div, .project-news-newsletter__inner form { position: relative; z-index: 2; }
.project-news-newsletter h2 { font-size: var(--font-section-title); line-height: 1.3; }
.project-news-newsletter p { margin-top: 6px; color: rgba(255,255,255,.9); font-size: var(--font-small); }
.project-news-newsletter form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 11px; }
.project-news-newsletter input { height: 46px; padding: 0 15px; border: 0; border-radius: 8px; outline: none; font-size: var(--font-small); }
.project-news-newsletter button { min-height: 46px; padding: 0 22px; color: #fff; border: 0; border-radius: 8px; background: #071d4e; font-size: var(--font-small); font-weight: 700; }
.project-news-newsletter img { position: absolute; right: 0; bottom: 0; width: 225px; height: 126px; object-fit: cover; mix-blend-mode: multiply; }

@media (max-width: 1199px) {
  .project-news-layout { grid-template-columns: minmax(0, 1fr) 290px; gap: 24px; }
  .project-news-feature-card { grid-template-columns: 1fr 340px; }
  .project-news-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-news-newsletter__inner { grid-template-columns: 1fr; padding-right: 230px; }
}
@media (max-width: 1023px) {
  .project-news-layout { grid-template-columns: 1fr; }
  .project-news-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-news-subscribe-card { grid-column: 1 / -1; }
  .project-news-feature-card { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .project-news-content { padding-top: 28px; }
  .project-news-heading h2 { font-size: var(--font-subsection-title); }
  .project-news-categories { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; }
  .project-news-categories::-webkit-scrollbar { display: none; }
  .project-news-categories button { flex: 0 0 auto; }
  .project-news-feature-card { grid-template-columns: 1fr; }
  .project-news-feature-card figure img { min-height: 250px; aspect-ratio: 1.55 / 1; }
  .project-news-feature-card__body { padding: 22px; }
  .project-news-feature-card h3 { font-size: var(--font-subsection-title); }
  .project-news-card-grid { grid-template-columns: 1fr; }
  .project-news-sidebar { grid-template-columns: 1fr; }
  .project-news-subscribe-card { grid-column: auto; }
  .project-news-newsletter__inner { padding: 24px 24px 120px; }
  .project-news-newsletter form { grid-template-columns: 1fr; }
  .project-news-newsletter img { width: 100%; height: 100px; }
}
@media (max-width: 479px) {
  .project-news-feature-card__body { padding: 18px; }
  .project-news-feature-card h3 { font-size: var(--font-card-title); }
  .project-news-newsletter h2 { font-size: var(--font-subsection-title); }
}

.toast-message{position:fixed;right:22px;bottom:22px;z-index:1000;padding:12px 16px;color:#fff;border-radius:10px;background:#071d4e;box-shadow:0 14px 35px rgba(7,29,78,.24);opacity:0;transform:translateY(12px);transition:.22s ease;pointer-events:none;font-size:var(--font-small)}.toast-message.is-visible{opacity:1;transform:translateY(0)}
