@charset "UTF-8";
/* Общий слой дизайн-системы madaev v1: основа, шапка, подвал,
   моно-метки, ссылки-действия, карточки, вердикты, цитата.
   Значения берутся только из tokens.css. Тёмная тема — те же токены. */

*, *::before, *::after { box-sizing: border-box; }

html { background: var(--surface-100); }

body {
  margin: 0;
  background: var(--surface-100);
  color: var(--ink-900);
  font-family: var(--body-family);
  font-size: var(--body-size);
  line-height: var(--body-line);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }

.ds-skip {
  position: fixed; top: var(--space-2); left: var(--space-4); z-index: 100;
  padding: var(--space-3) var(--space-5);
  background: var(--ink-900); color: var(--surface-100);
  text-decoration: none; transform: translateY(-160%);
}
.ds-skip:focus { transform: translateY(0); }

:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

.ds-page { width: min(var(--container), calc(100% - var(--space-8))); margin: 0 auto; }

/* Общие частицы: моно-метки, мета, ссылки-действия, стрелка */
.ds-label {
  font-family: var(--label-family); font-size: var(--label-size); line-height: var(--label-line);
  font-weight: var(--label-weight); letter-spacing: var(--label-tracking); text-transform: uppercase;
}
.ds-label--clay { color: var(--clay-600); }
.ds-label--muted { color: var(--ink-600); }

.ds-meta {
  font-family: var(--meta-family); font-size: var(--meta-size); line-height: var(--meta-line);
  font-weight: var(--meta-weight); color: var(--ink-600);
}

.ds-arrow { color: var(--clay-600); }

.ds-action {
  font-size: var(--body-sm-size); line-height: var(--body-sm-line);
  text-decoration: underline; text-underline-offset: 3px;
}
.ds-action--accent { color: var(--clay-600); }
.ds-action--accent:hover { color: var(--clay-700); }
.ds-action--accent .ds-arrow { color: inherit; }

/* Шапка */
.ds-header {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-5);
  min-height: 76px; padding: var(--space-5) 0;
  border-bottom: 1px solid var(--line-200);
}
.ds-header__brand { display: flex; align-items: baseline; gap: 14px; }
.ds-header__logo { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; text-decoration: none; }
.ds-header__tag {
  font-family: var(--label-family); font-size: var(--label-size); font-weight: var(--label-weight);
  letter-spacing: var(--label-tracking); text-transform: uppercase; color: var(--ink-600);
}
.ds-header__nav { display: flex; align-items: center; gap: var(--space-6); }
.ds-header__nav a {
  min-height: 44px; display: inline-flex; align-items: center;
  font-size: var(--body-sm-size); color: var(--ink-600); text-decoration: none;
}
.ds-header__nav a:hover { color: var(--ink-900); }
.ds-header__nav a.ds-header__current { color: var(--ink-900); text-decoration: underline; text-decoration-color: var(--clay-600); text-underline-offset: 6px; }
.ds-header__contact { color: var(--clay-600) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.ds-header__contact:hover { color: var(--clay-700) !important; }
.ds-header__contact .ds-arrow { color: inherit; }

/* FeaturedCard — единственный крупный терракотовый блок на странице */
.ds-featured {
  display: block; margin-top: var(--space-7); padding: var(--space-7);
  border-radius: var(--radius-lg); text-decoration: none;
  background: linear-gradient(125deg, var(--clay-fill), var(--clay-fill-deep));
  color: var(--on-clay);
}
.ds-featured:focus-visible { outline-color: var(--on-clay); }
.ds-featured__meta { display: flex; gap: var(--space-5); color: var(--on-clay); }
.ds-featured__meta .ds-label { color: inherit; }
.ds-featured__title {
  display: block; margin-top: var(--space-6);
  font-size: var(--display-2-size); line-height: var(--display-2-line);
  font-weight: var(--display-2-weight); letter-spacing: var(--display-2-tracking);
}
.ds-featured__lead {
  display: block; margin-top: var(--space-4); max-width: 640px;
  font-size: var(--body-size); line-height: var(--body-line); color: var(--on-clay);
}
.ds-featured__foot {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-5);
  margin-top: var(--space-7);
}
.ds-featured__foot .ds-meta { color: var(--on-clay); }
.ds-featured__action {
  font-size: var(--body-sm-size); text-decoration: underline; text-underline-offset: 3px;
}
.ds-featured__action .ds-arrow { color: inherit; }
.ds-featured:hover .ds-featured__title { text-decoration: underline; text-underline-offset: 5px; }

/* ArticleCard */
.ds-card {
  display: flex; flex-direction: column; padding: var(--space-5);
  background: var(--surface-200); border: 1px solid var(--line-300);
  border-radius: var(--radius-md); text-decoration: none;
}
.ds-card:hover { border-color: var(--ink-400); }
.ds-card:hover .ds-card__title { text-decoration: underline; text-underline-offset: 5px; }
.ds-card__top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.ds-card__tags { display: flex; gap: var(--space-4); }
.ds-card__title {
  display: block; margin-top: 14px;
  font-size: var(--card-title-size); line-height: var(--card-title-line);
  font-weight: var(--card-title-weight); letter-spacing: var(--card-title-tracking);
}
.ds-card__desc {
  display: block; margin: var(--space-3) 0 var(--space-6); flex-grow: 1;
  font-size: var(--body-sm-size); line-height: var(--body-sm-line); color: var(--ink-600);
}
.ds-card__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.ds-stories__row .ds-card { flex-grow: 1; }

/* VerdictBadge — слово и глиф, цвет один смысл не несёт */
.ds-verdict {
  flex: 0 0 auto; padding: 5px 10px; border: 1.5px solid currentColor;
  border-radius: var(--radius-sm); background: transparent; white-space: nowrap;
  font-family: var(--label-family); font-size: var(--label-size); line-height: var(--label-line);
  font-weight: var(--label-weight); letter-spacing: var(--label-tracking); text-transform: uppercase;
}
.ds-verdict-text--proved { color: var(--ok-600); }
.ds-verdict-text--hypothesis { color: var(--warn-600); }
.ds-verdict-text--hype { color: var(--clay-600); }
.ds-verdict--proved { color: var(--ok-600); }
.ds-verdict--hypothesis { color: var(--warn-600); }
.ds-verdict--hype { color: var(--clay-600); }

/* PullQuote */
.ds-quote {
  display: flex; flex-direction: column; margin: 0; width: 320px; flex-shrink: 0;
  padding: var(--space-6);
  background: var(--surface-200); border: 1px solid var(--line-200); border-radius: var(--radius-lg);
}
.ds-quote__mark { font-size: 48px; line-height: 1; font-weight: 600; color: var(--clay-600); }
.ds-quote__text {
  margin: var(--space-2) 0 var(--space-4);
  font-size: var(--quote-size); line-height: var(--quote-line);
  font-weight: var(--quote-weight); letter-spacing: var(--quote-tracking);
}
.ds-quote__source {
  margin-top: auto;
  font-family: var(--meta-family); font-size: var(--meta-size); letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--ink-600);
}

/* Подвал */
.ds-footer {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-5);
  min-height: 76px; margin-top: var(--space-9);
  border-top: 1px solid var(--line-200);
  font-size: var(--body-sm-size); color: var(--ink-600);
}

@media (max-width: 860px) {
  .ds-page { width: calc(100% - var(--space-7)); }
  .ds-featured { padding: var(--space-5); }
  .ds-featured__title { font-size: 30px; }
  .ds-quote { width: auto; }
  .ds-header { flex-wrap: wrap; gap: var(--space-3); }
  .ds-header__nav { gap: var(--space-5); }
}

@media (max-width: 460px) {
  .ds-page { width: calc(100% - var(--space-6)); }
  .ds-featured__foot { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  .ds-card__top { flex-wrap: wrap; }
}