.news-catalog-page { background: #f5f8f9; }
.news-banner { padding-top: 24px; }
.news-banner img { width: 100%; height: auto; display: block; aspect-ratio: 96 / 19; object-fit: cover; border-radius: 6px; background: #eaf3ff; }
.news-catalog-section { padding: 34px 0 76px; }
.news-source-tabs { min-height: 42px; display: flex; align-items: center; gap: 34px; overflow-x: auto; border-bottom: 1px solid #e4eaed; scrollbar-width: none; }
.news-source-tabs::-webkit-scrollbar { display: none; }
.news-source-tab { position: relative; flex: 0 0 auto; height: 42px; padding: 0; border: 0; color: #5f6b70; font-size: 14px; background: transparent; }
.news-source-tab::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; content: ""; background: transparent; }
.news-source-tab:hover, .news-source-tab.is-active { color: var(--brand); }
.news-source-tab.is-active { font-weight: 600; }
.news-source-tab.is-active::after { background: var(--brand); }
.news-filter-bar { display: grid; grid-template-columns: 220px 220px minmax(280px, 1fr) 48px; gap: 14px; padding: 24px 0; }
.news-filter-bar .form-select, .news-keyword-field .form-control { height: 44px; border: 1px solid #e2e8eb; border-radius: 3px; color: #536169; font-size: 13px; background-color: #fff; box-shadow: none; }
.news-filter-bar .form-select:focus, .news-keyword-field .form-control:focus { border-color: #8ddab6; box-shadow: 0 0 0 3px rgba(8, 185, 104, .1); }
.news-keyword-field { position: relative; min-width: 0; }
.news-keyword-field .form-control { width: 100%; padding-right: 42px; }
.news-keyword-field i { position: absolute; top: 50%; right: 15px; color: #607079; font-size: 18px; transform: translateY(-50%); }
.news-search-button { display: none; }
.news-reset-button { width: 48px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 3px; color: #fff; font-size: 19px; background: #24342d; transition: background .2s ease; }
.news-reset-button:hover { background: var(--brand-dark); }
.news-result-count { height: 18px; margin: 0 0 8px; color: #98a2a7; font-size: 12px; }
.news-list { min-height: 480px; border-top: 1px solid #e4eaed; }
.news-list-item { min-height: 142px; display: grid; grid-template-columns: 112px minmax(0, 1fr) 232px; align-items: center; gap: 26px; padding: 18px 20px 18px 0; border-bottom: 1px solid #e4eaed; color: inherit; background: transparent; transition: background .2s ease; }
.news-list-item:hover { color: inherit; background: #fff; }
.news-list-date { position: relative; height: 104px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #26333a; transition: color .2s ease, background .2s ease; }
.news-list-date strong { font-size: 28px; font-weight: 500; line-height: 1; }
.news-list-date span { margin-top: 8px; color: #899499; font-size: 11px; }
.news-list-item:hover .news-list-date { color: #fff; background: var(--brand); }
.news-list-item:hover .news-list-date span { color: rgba(255, 255, 255, .82); }
.news-list-item:hover .news-list-date::after { position: absolute; top: 50%; right: -10px; width: 0; height: 0; content: ""; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid var(--brand); transform: translateY(-50%); }
.news-list-copy { min-width: 0; }
.news-list-copy h2 { margin: 0 0 8px; overflow: hidden; color: #26333a; font-size: 15px; font-weight: 600; line-height: 1.55; text-overflow: ellipsis; white-space: nowrap; }
.news-list-source { display: block; margin-bottom: 7px; color: #899499; font-size: 11px; }
.news-list-copy p { margin: 0; display: -webkit-box; overflow: hidden; color: #7e8a90; font-size: 12px; line-height: 1.75; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.news-list-cover { width: 232px; height: 96px; object-fit: cover; border-radius: 4px; background: #e9eef0; }
.news-list-skeleton { height: 112px; margin: 15px 0; }
.news-list > .state-panel { margin-top: 18px; }
.news-pagination { min-height: 32px; display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 34px; }
.news-pagination button { min-width: 30px; height: 30px; padding: 0 8px; border: 1px solid #dce4e8; border-radius: 3px; color: #68757b; font-size: 12px; background: #fff; }
.news-pagination button:hover:not(:disabled), .news-pagination button.is-active { border-color: var(--brand); color: #fff; background: var(--brand); }
.news-pagination button:disabled { cursor: not-allowed; opacity: .45; }
.news-page-gap { color: #879297; font-size: 12px; }
.news-source-tab:focus-visible, .news-reset-button:focus-visible, .news-pagination button:focus-visible, .news-list-item:focus-visible { outline: 2px solid rgba(8, 185, 104, .38); outline-offset: 2px; }

@media (max-width: 899px) {
  .news-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-keyword-field { grid-column: 1 / -2; }
  .news-list-item { grid-template-columns: 86px minmax(0, 1fr) 180px; gap: 18px; }
  .news-list-cover { width: 180px; height: 86px; }
}

@media (max-width: 639px) {
  .news-banner { width: 100%; padding-top: 0; }
  .news-banner img { border-radius: 0; }
  .news-catalog-section { padding: 22px 0 50px; }
  .news-source-tabs { gap: 24px; }
  .news-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)) 44px; gap: 9px; padding: 18px 0; }
  .news-keyword-field { grid-column: 1 / 3; }
  .news-reset-button { width: 44px; }
  .news-list-item { min-height: 126px; grid-template-columns: 58px minmax(0, 1fr) 92px; gap: 12px; padding-right: 0; }
  .news-list-date { height: 88px; }
  .news-list-date strong { font-size: 22px; }
  .news-list-copy h2 { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .news-list-copy p { display: none; }
  .news-list-cover { width: 92px; height: 72px; }
}