/* cn3-plus / mobile: единые боковые поля сайта.
   Принцип как у Apple: один токен --gutter на весь сайт, контент не шире экрана,
   горизонтальные ленты выходят к краям, заголовки блоков — по левому краю. */
:root { --gutter: 16px; }
@media (min-width: 601px) { :root { --gutter: 24px; } }
@media (min-width: 901px) { :root { --gutter: 28px; } }

@media (max-width: 1100px) {
  /* все обёртки страниц получают одно и то же поле (иначе у каждой своё: 12, 16, 18, 20, 32px) */
  body .container,
  body .re-archive,
  body .re-single,
  body .cn3-wrap,
  body .cn3-mfr-arc .cn3-wrap,
  body .cn3-thub-single .cn3-wrap,
  body .cn3-folio .cn3-wrap,
  body .cn3-evt-wrap,
  body .cn3-evt-hero__inner,
  body .cn3-hsec .container,
  body .cn3-trendbar .container,
  body .cn3-feat .container,
  body .konkursy-block .container {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
  }
  body .container--single { max-width: 800px; }
  /* вложенные обёртки не удваивают поле */
  body .container .container,
  body .cn3-wrap .container,
  body .re-archive .container,
  body .cn3x-mag .container { padding-left: 0; padding-right: 0; }
  body .single-post--l2 .cn3-l2-hero__inner { padding-left: var(--gutter); padding-right: var(--gutter); }
}

/* телефон: ленты выходят к краям экрана, карточка первой начинается у поля */
@media (max-width: 680px) {
  body .konkursy-block .kk-head { padding-right: 0; }
  body .konkursy-block .kk-cards {
    margin-inline: calc(var(--gutter) * -1);
    padding: 4px var(--gutter) 14px;
    scroll-padding-inline: var(--gutter);
  }
  body .cn3x-history__list { margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  body .cn3-trendbar__scroll { margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  /* текст на телефоне читается слева; по центру — только пустые состояния и кнопки */
  body .container__title--center { text-align: left; }
}

/* шапка записи: «…» больше не налезает на «Аа» и «Поделиться» */
@media (max-width: 700px) {
  body .post-info { padding-right: 48px; min-height: 40px; align-items: center; }
  body .post-info-ellipses__wrap { top: 50%; bottom: auto; right: 0; transform: translateY(-50%); }
  body .post-info-ellipses__wrap.is-moved { transform: translateY(-50%) rotate(-90deg); }
  body .post-info .cn3x-tools { margin-left: auto; padding-left: .6rem; }
  body .post-info-mobile { right: 0; }
}