/* Меридиан — тема «деловой газеты»: строгость, линейки вместо карточек,
   заголовки — серифные, служебный текст — моноширинный. Внешних
   зависимостей нет: системные шрифты, плейсхолдер — локальный SVG. */

/* ===== Токены ===== */
:root {
  --md-bg:       #f2f4f7;
  --md-paper:    #ffffff;
  --md-ink:      #141c2b;
  --md-text:     #1f2937;
  --md-muted:    #555f6f;
  --md-muted-2:  #6b7483;
  --md-line:     #dde2ea;
  --md-line-2:   #c6cdd8;
  --md-accent:   #1f4e8c;
  --md-accent-2: #a8452f;
  --md-dark:     #111827;
  --md-accent-hover: #183f72;
  --md-serif: Georgia, "Times New Roman", "PT Serif", "Noto Serif", serif;
  --md-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --md-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
}

/* ===== База ===== */
*,
*::before,
*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--md-bg);
  color: var(--md-text);
  font-family: var(--md-sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, p { margin: 0; }
button { font: inherit; }
::selection { background: rgba(31, 78, 140, .2); }

.md-wrap { width: min(1200px, 100% - 2.5rem); margin-inline: auto; }
.md-skip {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--md-accent-2); color: #fff;
  padding: .65rem 1.1rem; font-weight: 600; text-decoration: none;
}
.md-skip:focus { left: 0; }
:focus-visible { outline: 3px solid var(--md-accent-2); outline-offset: 2px; }
.md-live {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
main#md-app { outline: none; }

/* ===== Шапка: служебная строка ===== */
.md-strip {
  background: var(--md-dark);
  color: #c7d2e2;
  font-family: var(--md-mono);
  font-size: .72rem;
  letter-spacing: .04em;
}
.md-strip-in {
  display: flex; align-items: center; justify-content: space-between;
  gap: .8rem 1.5rem; flex-wrap: wrap; padding: .45rem 0;
}
#md-count { color: #9fb0c9; }

/* ===== Шапка: выходные данные ===== */
.md-plate {
  text-align: center;
  padding: 1.6rem 0 1.25rem;
  background: var(--md-paper);
  border-bottom: 1px solid var(--md-line);
}
.md-brand {
  display: inline-flex; flex-direction: column; align-items: center;
  gap: .45rem; text-decoration: none;
}
.md-crest { display: inline-grid; place-items: center; }
.md-crest-sm { opacity: .9; }
.md-word {
  font-family: var(--md-serif);
  font-size: clamp(1.9rem, 6vw, 3.1rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: clamp(.12em, 2.6vw, .24em);
  margin-right: calc(clamp(.12em, 2.6vw, .24em) * -1);
  color: var(--md-ink);
  line-height: 1.05;
}
.md-motto {
  display: flex; align-items: center; gap: 1rem;
  margin-top: .7rem;
  font-family: var(--md-mono);
  font-size: .68rem;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: var(--md-muted);
  white-space: nowrap;
}
.md-motto::before,
.md-motto::after {
  content: ""; flex: 1 1 4rem; height: 1px; background: var(--md-line-2);
}
.md-motto span { margin-right: calc(.38em * -1); }

/* ===== Шапка: рубрики ===== */
.md-rubrics {
  position: sticky; top: 0; z-index: 30;
  background: var(--md-paper);
  border-bottom: 2px solid var(--md-ink);
}
.md-rubrics-in {
  display: flex; align-items: baseline; gap: 1.5rem;
  padding: .78rem 0;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: thin;
}
.md-rubrics a {
  font-family: var(--md-mono);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--md-text);
  padding-bottom: .1rem;
  border-bottom: 2px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}
.md-rubrics a:hover { color: var(--md-accent-2); }
.md-rubrics a[aria-current="page"] {
  color: var(--md-accent);
  border-bottom-color: var(--md-accent);
}

/* ===== Строка дня ===== */
.md-fold {
  padding: .8rem 0;
  border-bottom: 1px solid var(--md-line);
}
.md-fold p {
  font-family: var(--md-mono);
  font-size: .76rem;
  color: var(--md-muted);
  letter-spacing: .02em;
}
.md-fold strong { color: var(--md-accent-2); font-weight: 700; }

/* ===== Первый разворот ===== */
.md-front {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  gap: 2.4rem;
  padding: 2rem 0 2.6rem;
}
.md-lead-link { display: block; text-decoration: none; }
.md-lead-media {
  aspect-ratio: 16 / 9;
  border: 1px solid var(--md-line);
  border-bottom: 3px solid var(--md-accent);
  overflow: hidden;
}
.md-lead-media img { width: 100%; height: 100%; object-fit: cover; }
.md-lead-body { padding-top: 1.1rem; }
.md-lead-title {
  font-family: var(--md-serif);
  font-size: clamp(1.45rem, 3.1vw, 2.15rem);
  font-weight: 700;
  line-height: 1.16;
  color: var(--md-ink);
  letter-spacing: 0;
  margin: .55rem 0 .7rem;
  overflow-wrap: break-word;
  transition: color .15s ease;
}
.md-lead-link:hover .md-lead-title { color: var(--md-accent); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .2em; }
.md-lead-sum {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--md-muted);
  max-width: 640px;
}

/* ===== Колонка «Главное за день» ===== */
.md-rail { border-left: 1px solid var(--md-line); padding-left: 1.8rem; }
.md-rail-list { list-style: none; margin: 0; padding: 0; counter-reset: md-rail; }
.md-rail-list li {
  counter-increment: md-rail;
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr);
  gap: .1rem .55rem;
  padding: .78rem 0;
  border-bottom: 1px solid var(--md-line);
}
.md-rail-list li:first-child { padding-top: .45rem; }
.md-rail-list li::before {
  content: counter(md-rail, decimal-leading-zero);
  font-family: var(--md-mono);
  font-size: .82rem;
  font-weight: 700;
  color: var(--md-accent-2);
  line-height: 1.45;
}
.md-rail-item { text-decoration: none; display: block; grid-column: 2; }
.md-rail-title {
  display: block;
  font-family: var(--md-serif);
  font-size: .99rem;
  font-weight: 700;
  line-height: 1.32;
  color: var(--md-ink);
  overflow-wrap: break-word;
  transition: color .15s ease;
}
.md-rail-item:hover .md-rail-title { color: var(--md-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.md-rail-meta {
  display: block;
  margin-top: .22rem;
  font-family: var(--md-mono);
  font-size: .66rem;
  letter-spacing: .03em;
  color: var(--md-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== Заголовки секций ===== */
.md-h2-row {
  display: flex; align-items: baseline; gap: 1rem;
  margin-bottom: 1rem;
}
.md-h2 {
  font-family: var(--md-mono);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--md-ink);
  white-space: nowrap;
}
.md-h2::after {
  content: ""; display: inline-block; vertical-align: middle;
  width: 2rem; height: 0; margin-left: .8rem;
  border-top: 1px solid var(--md-line-2);
  border-bottom: 1px solid var(--md-line-2);
}
.md-h2-note {
  margin-left: auto;
  font-family: var(--md-mono);
  font-size: .68rem;
  color: var(--md-muted);
  white-space: nowrap;
}

/* ===== Мета: источник и время ===== */
.md-meta { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.md-kicker {
  font-family: var(--md-mono);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--md-accent-2);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-kicker::before {
  content: ""; display: inline-block; vertical-align: middle;
  width: 1.2rem; height: 2px; margin-right: .5rem;
  background: var(--md-accent-2);
}
.md-time {
  font-family: var(--md-mono);
  font-size: .68rem;
  color: var(--md-muted);
  white-space: nowrap;
}

/* ===== Лента: строки ===== */
.md-band { padding: 0 0 2.4rem; }
.md-band-top { padding-top: 2.2rem; }
.md-rows { border-top: 2px solid var(--md-ink); }
.md-row { border-bottom: 1px solid var(--md-line); }
.md-row-link {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 1.15rem;
  padding: 1.05rem 0;
  text-decoration: none;
}
.md-row-media {
  width: 128px;
  aspect-ratio: 16 / 10;
  border: 1px solid var(--md-line);
  overflow: hidden;
  align-self: start;
  margin-top: .2rem;
}
.md-row-media img { width: 100%; height: 100%; object-fit: cover; }
.md-row-body { display: flex; flex-direction: column; gap: .4rem; min-width: 0; }
.md-row-title {
  font-family: var(--md-serif);
  font-size: 1.07rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--md-ink);
  overflow-wrap: break-word;
  transition: color .15s ease;
}
.md-row-link:hover .md-row-title { color: var(--md-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.md-row-sum {
  font-size: .92rem;
  line-height: 1.55;
  color: var(--md-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.md-band-cta { text-align: center; margin-top: 1.8rem; }

/* ===== Плейсхолдер вместо фото ===== */
.is-empty {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 54'%3E%3Ccircle cx='48' cy='27' r='16' fill='none' stroke='%231f4e8c' stroke-opacity='.3' stroke-width='5'/%3E%3Cpath d='M48 4 V50 M24 27 H72' stroke='%231f4e8c' stroke-opacity='.3' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center / 46px auto no-repeat,
    repeating-linear-gradient(135deg, #e8edf4 0 12px, #e1e7f0 12px 24px);
}

/* ===== Кнопки ===== */
.md-btn {
  display: inline-block;
  border: 2px solid var(--md-accent);
  color: var(--md-accent);
  background: transparent;
  padding: .58rem 1.25rem;
  font-weight: 600;
  font-size: .88rem;
  text-decoration: none;
  letter-spacing: .02em;
  transition: background .15s ease, color .15s ease;
}
a.md-btn:hover, button.md-btn:hover {
  background: var(--md-accent-hover);
  border-color: var(--md-accent-hover);
  color: #fff;
}

/* ===== Пагинатор ===== */
.md-pager {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: .4rem; margin: 2.1rem 0 .7rem;
}
.md-pg {
  min-width: 40px; padding: .38rem .65rem;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--md-mono);
  font-size: .8rem;
  border: 1px solid var(--md-line-2);
  background: var(--md-paper);
  color: var(--md-text);
  text-decoration: none;
  transition: border-color .14s ease, background .14s ease;
}
a.md-pg:hover { border-color: var(--md-ink); }
.md-pg.is-active {
  background: var(--md-accent);
  border-color: var(--md-accent);
  color: #fff;
}
.md-pg.is-gap, .md-pg.is-disabled { color: var(--md-muted); background: transparent; cursor: default; }
.md-pager-info {
  text-align: center;
  font-family: var(--md-mono);
  font-size: .7rem;
  color: var(--md-muted);
}

/* ===== Материал ===== */
.md-article { padding: 1.6rem 0 3rem; }
.md-back {
  display: inline-block;
  font-family: var(--md-mono);
  font-size: .76rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--md-accent);
  text-decoration: none;
  margin-bottom: 1.2rem;
}
.md-back:hover { text-decoration: underline; text-underline-offset: .2em; }
.md-sheet {
  max-width: 760px;
  background: var(--md-paper);
  border: 1px solid var(--md-line);
  border-top: 4px solid var(--md-ink);
  padding: clamp(1.3rem, 4vw, 2.6rem) clamp(1.1rem, 4.5vw, 3rem) clamp(1.6rem, 4vw, 2.8rem);
}
.md-art-title {
  font-family: var(--md-serif);
  font-size: clamp(1.5rem, 3.4vw, 2.2rem);
  font-weight: 700;
  line-height: 1.18;
  color: var(--md-ink);
  letter-spacing: 0;
  margin: .7rem 0 1.1rem;
  padding-bottom: 1.1rem;
  border-bottom: 3px double var(--md-line-2);
  overflow-wrap: break-word;
}
.md-art-hero {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 1px solid var(--md-line);
  background: #e8edf4;
  margin: 0 0 1.4rem;
}
.md-art-body { font-size: 1.02rem; }
.md-art-body p {
  line-height: 1.75;
  color: var(--md-text);
  margin-bottom: 1rem;
  overflow-wrap: break-word;
}
.md-art-body p:last-child { margin-bottom: 0; }
.md-note {
  background: #eef3fa;
  border: 1px solid #d3deee;
  border-left: 3px solid var(--md-accent-2);
  color: #3d4b60;
  font-size: .88rem;
  line-height: 1.55;
  padding: .8rem 1.05rem;
  margin: 0 0 1.3rem;
}
.md-art-actions { margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid var(--md-line); }

/* ===== Подвал ===== */
.md-footer {
  margin-top: 2.5rem;
  background: var(--md-dark);
  color: #a9b3c4;
  border-top: 4px solid var(--md-accent-2);
}
.md-footer-in {
  display: grid;
  grid-template-columns: 1.5fr 0.8fr 1.3fr;
  gap: 2.2rem;
  padding: 2.5rem 0 1.9rem;
}
.md-footer-logo {
  display: flex; align-items: center; gap: .6rem;
  margin-bottom: .9rem;
}
.md-footer-name {
  font-family: var(--md-serif);
  font-size: 1.2rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #e8ecf3;
}
.md-footer-brand p, .md-footer-col p {
  font-size: .87rem;
  line-height: 1.68;
  color: #a9b3c4;
}
.md-footer-col h2 {
  font-family: var(--md-mono);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: #dfe4ec;
  margin-bottom: 1rem;
}
.md-footer-col a {
  display: block;
  font-family: var(--md-mono);
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #a9b3c4;
  text-decoration: none;
  padding: .28rem 0;
  transition: color .15s ease;
}
.md-footer-col a:hover { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
.md-footer-bottom {
  display: flex; align-items: center; justify-content: space-between;
  gap: .8rem 1.5rem; flex-wrap: wrap;
  padding: 1rem 0 1.4rem;
  border-top: 1px solid rgba(232, 236, 243, .12);
  font-size: .8rem;
  color: #8d99ad;
}
.md-mark {
  font-family: var(--md-mono);
  font-size: .7rem;
  color: #c7d2e2;
  border: 1px solid #8d99ad;
  padding: .08rem .5rem;
  white-space: nowrap;
}

/* ===== Состояния и скелетоны ===== */
.md-status {
  text-align: center;
  padding: 3.2rem 1rem;
  color: var(--md-muted);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
}
.md-status p { font-family: var(--md-serif); font-size: 1.05rem; }
.md-sk {
  background: linear-gradient(100deg, #e2e7ee 40%, #edf1f6 50%, #e2e7ee 60%);
  background-size: 200% 100%;
  animation: md-shimmer 1.3s linear infinite;
  margin-bottom: .7rem;
}
@keyframes md-shimmer { to { background-position: -200% 0; } }
.md-skeleton { padding: 2rem 0; }
.md-sk-fold { margin-bottom: 1.6rem; }
.md-sk-front {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  gap: 2.4rem;
}
.md-sk-rail { border-left: 1px solid var(--md-line); padding-left: 1.8rem; }
.md-sk-row {
  display: flex; gap: 1.15rem; align-items: flex-start;
  padding: 1.05rem 0;
  border-bottom: 1px solid var(--md-line);
}
.md-sk-row .md-sk { margin-bottom: .45rem; flex: none; }
.md-sk-sheet {
  max-width: 760px;
  background: var(--md-paper);
  border: 1px solid var(--md-line);
  border-top: 4px solid var(--md-ink);
  padding: 2.4rem 2.6rem;
}

/* ===== Адаптив ===== */
@media (max-width: 980px) {
  .md-front { grid-template-columns: 1fr; gap: 1.8rem; padding: 1.6rem 0 2.2rem; }
  .md-rail { border-left: none; padding-left: 0; border-top: 1px solid var(--md-line); padding-top: 1.4rem; }
  .md-footer-in { grid-template-columns: 1fr 1fr; }
  .md-sk-front { grid-template-columns: 1fr; }
  .md-sk-rail { border-left: none; padding-left: 0; }
}

@media (max-width: 640px) {
  .md-wrap { width: min(1200px, 100% - 1.6rem); }
  .md-plate { padding: 1.2rem 0 1rem; }
  .md-motto { letter-spacing: .26em; gap: .8rem; }
  .md-motto span { margin-right: calc(.26em * -1); }
  .md-rubrics-in { gap: 1.1rem; }
  .md-rail-list li { grid-template-columns: 1.9rem minmax(0, 1fr); }
  .md-row-link { grid-template-columns: 96px minmax(0, 1fr); gap: .9rem; }
  .md-row-media { width: 96px; }
  .md-row-sum { -webkit-line-clamp: 3; }
  .md-footer-in { grid-template-columns: 1fr; gap: 1.7rem; }
  .md-h2-note { display: none; }
  .md-art-body { font-size: .99rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .md-sk { animation: none; }
  .md-lead-title, .md-row-title, .md-rail-title, .md-rubrics a,
  .md-btn, .md-pg, .md-footer-col a { transition: none !important; }
}
