.news-page {
  --catalog-width: var(--contacts-content-width);
  --catalog-blue: #d3e7ff;
  --catalog-gap: 24px;
  --catalog-radius: 6px;
  padding-top: 100px;
  background: var(--color-surface);
}
.news-page::before { display: none; }
.news-page #app { background: transparent; }
.news-page [hidden] { display: none !important; }
.news-page .site-header {
  top: 14px;
  left: 50%;
  height: 62px;
  transform: translateX(-50%);
}
.news-catalog {
  min-height: calc(100svh - 100px);
  padding: 36px 0 180px;
  background: linear-gradient(180deg, var(--color-surface) 0%, #f2f7ff 58%, var(--catalog-blue) 100%);
}
.news-catalog__inner { width: min(var(--catalog-width), calc(100% - 2 * var(--page-gutter))); margin-inline: auto; }
.news-catalog__search-row { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 24px; }
.news-catalog__count,
.news-pagination__status {
  margin: 0;
  color: var(--color-accent);
  font: 500 17px/22px var(--font-quest);
  font-variation-settings: "ELGR" 1, "ELSH" 2;
  letter-spacing: 0.17px;
  text-transform: uppercase;
}
.news-search { display: flex; width: min(760px, 65%); gap: 12px; }
.news-search input {
  width: 100%;
  min-width: 0;
  height: 52px;
  padding: 0 12px;
  border: 1px solid var(--retro-line-dark);
  border-radius: var(--catalog-radius);
  color: var(--color-ink);
  background: var(--color-surface);
  font: 400 18px/24px var(--font-quest);
  font-variation-settings: "ELGR" 1, "ELSH" 2;
}
.news-search input::placeholder { color: var(--color-ink-muted); opacity: 1; }
.news-search > button { flex: 0 0 100px; font-size: 19px; }
.catalog-button,
.news-pagination__current {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border: 1px solid var(--retro-line-dark);
  border-radius: var(--catalog-radius);
  color: var(--color-ink);
  background: var(--retro-surface);
  font: 600 18px/22px var(--font-quest);
  font-variation-settings: "ELGR" 1, "ELSH" 2;
  text-decoration: none;
  transition: transform var(--motion-duration) var(--motion-ease), background var(--motion-duration) ease;
}
.catalog-button--accent,
.news-pagination__current { background: var(--menu-quiz-surface); }
.catalog-button:hover:not(:disabled) { background: #dfdccb; transform: translateY(-1px); }
.catalog-button--accent:hover:not(:disabled) { background: #55caef; }
.catalog-button:active:not(:disabled) { transform: translateY(1px); }
.catalog-button:disabled { opacity: 0.5; cursor: default; }
.news-page :is(a, button, input):focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.news-catalog__title:focus { outline: none; }
.news-catalog__title {
  scroll-margin-top: 112px;
  margin: 24px 0;
  color: var(--color-ink);
  font: 700 48px/56px var(--font-quest);
  font-variation-settings: "ELGR" 1, "ELSH" 2;
  letter-spacing: -0.48px;
}
.news-catalog__mobile-title { display: none; }
.news-catalog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px var(--catalog-gap); }
.news-catalog .news-card { width: 100%; height: 452px; grid-column: auto; justify-self: stretch; }
.news-catalog .news-card__title { min-height: 84px; height: auto; overflow: visible; }
.news-catalog .news-card__action { min-height: 44px; text-decoration: none; }
.news-pagination { display: flex; min-height: 60px; justify-content: space-between; align-items: center; gap: 16px; margin-top: 24px; padding: 0 12px; }
.news-pagination__controls { display: flex; align-items: center; gap: 8px; }
.news-pagination .catalog-button { width: 112px; white-space: pre; }
.news-pagination__current { padding: 10px; }
.news-catalog__empty { padding: 56px 0; }
.news-catalog:has(.news-catalog__empty:not([hidden])) { min-height: calc(100svh - 100px); padding-bottom: 80px; }
.news-catalog__empty h2 { font: 700 32px/1.2 var(--font-quest); }
.news-catalog__empty p { color: var(--color-ink-muted); }
.news-catalog__empty button { margin-top: 12px; }
.catalog-skip { position: fixed; z-index: 100; top: 8px; left: 16px; padding: 12px 20px; background: var(--color-surface); color: var(--color-accent); transform: translateY(-160%); }
.catalog-skip:focus { transform: translateY(0); }

@media (max-width: 1439px) {
  .news-page .site-header { width: min(1400px, calc(100% - 44px)); }
}
@media (max-width: 1099px) {
  .news-page .quest-button { display: none; }
  .news-catalog { min-height: calc(100svh - 100px); padding-top: 32px; padding-bottom: 140px; }
  .news-catalog__search-row { flex-direction: column; align-items: stretch; gap: 12px; }
  .news-search { width: 100%; }
  .news-catalog__title { margin: 20px 0; font-size: 42px; line-height: 48px; }
  .news-catalog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 38px; }
  .news-catalog .news-card { height: 430px; }
  .news-catalog .news-card__media { height: 182px; flex-basis: 182px; }
  .news-catalog .news-card__paperclip { top: -14px; right: 0; width: 44px; height: 64px; }
  .news-pagination { margin-top: 20px; }
  .news-pagination .catalog-button { width: 96px; }
}
@media (max-width: 679px) {
  .news-page { padding-top: 88px; }
  .news-page .site-header { top: 16px; width: calc(100% - 32px); height: 56px; }
  .news-page .site-brand { top: 10px; left: 8px; width: calc(100% - 64px); height: 36px; }
  .news-page .site-brand__mark { top: 0; width: 36px; height: 36px; }
  .news-page .site-brand__title { display: none; }
  .news-page .site-brand__mobile-title { display: flex; position: absolute; top: 5px; left: 44px; flex-direction: column; color: var(--color-ink); font: 700 11px/13px var(--font-quest); text-transform: uppercase; }
  .news-page .menu-button { top: 6px; right: 6px; width: 44px; height: 44px; }
  .news-catalog { min-height: 0; padding-top: 16px; padding-bottom: 156px; }
  .news-catalog__inner { width: min(408px, calc(100% - 78px)); }
  .news-catalog__search-row { gap: 8px; }
  .news-catalog__count { color: #3b3b3b; font-size: 16px; line-height: 20px; }
  .news-search { flex-direction: column; }
  .news-search > button { flex: auto; height: 48px; }
  .news-catalog__title { margin: 16px 0; font-size: 32px; line-height: 36px; letter-spacing: 0; }
  .news-catalog__desktop-title { display: none; }
  .news-catalog__mobile-title { display: inline; text-transform: uppercase; }
  .news-catalog__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .news-catalog .news-card { width: 100%; height: auto; min-height: 430px; }
  .news-catalog .news-card__title { font-size: 23px; line-height: 28px; min-height: 100px; }
  .news-pagination { padding: 0 8px; gap: 8px; margin-top: 16px; }
  .news-pagination__status { font-size: 16px; }
  .news-pagination .catalog-button { width: 44px; padding: 10px; }
  .news-pagination .catalog-button span { display: none; }
  .news-pagination__controls { gap: 6px; }
}
@media (max-width: 359px) { .news-catalog__inner { width: calc(100% - 32px); } }
@media (prefers-reduced-motion: reduce) { .catalog-button { transition: none; } }
.news-catalog .news-card { height: auto; min-height: 452px; }
.news-catalog .news-card__action { margin-top: auto; }
.news-catalog .news-card:nth-child(3) { grid-column: auto; justify-self: stretch; }
.news-catalog .news-card__title { overflow-wrap: anywhere; }
.news-card__photo-frame > .news-card__photo { width: 100%; height: 100%; object-fit: contain; }
.catalog-load-error { padding: 24px; border: 1px solid var(--retro-line-dark); border-radius: 6px; background: var(--quest-surface); }
.catalog-load-error p { line-height: 1.5; }
@media (max-width: 679px) { .news-catalog__inner { width: min(440px, calc(100% - 32px)); } }
@media (min-width: 600px) and (max-width: 1439px) {
  .news-catalog__inner { width: var(--tablet-content); }
}
