/* ==========================================================================
   Пополнение Steam — page-company.css: раскладка обзора (single-sg_company.php)
   и сравнения двух сервисов (single-sg_compare.php).

   Обзор:     .sg-co-hero (шапка обзора + мини-расчёт .sg-pay), .sg-co-id, .sg-co-rank, .sg-passport,
              .sg-anchors, .sg-cond (условия), .sg-scoretab и .sg-co-score (разбор оценки), .sg-co-promo,
              .sg-co-cta, .sg-co-mention, .sg-reviews, .sg-sources
   Сравнение: .sg-cmp-hero, .sg-duel (две стороны), .sg-verdict (вывод), .sg-paircalc (расчёт на двоих),
              .sg-vs-wrap и ячейки .sg-vs__a / .sg-vs__b (таблица бок о бок), .sg-cmp-pc, .sg-cmp-cta, .sg-cmp-build
   Общее:     .sg-paybox (плитка мини-расчёта: --a лайм, --b розовый), .sg-box (поле внутри рамки)

   Цвета сторон: А — лайм (--sg-vs-a), Б — розовый (--sg-vs-b); название сервиса всегда стоит рядом.
   Mobile-first; медиазапросы только min-width: 768px и min-width: 1200px.
   ========================================================================== */

.sg-box { padding: var(--sg-pad); }

/* ---------- Плитка мини-расчёта ---------- */
.sg-paybox { display: grid; justify-items: start; align-content: start; gap: 4px; min-width: 0; padding: 12px; background: var(--sg-sunken); }
.sg-paybox--a { border-left: 4px solid var(--sg-vs-a); }
.sg-paybox--b { border-left: 4px solid var(--sg-vs-b); }
.sg-paybox__name { color: var(--sg-muted); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-paybox__name a { color: var(--sg-ink); }
.sg-paybox__name a:hover { color: var(--sg-accent); }
.sg-paybox__sub { color: var(--sg-muted); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-paybox__hp { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; }

/* ---------- Обзор: шапка ---------- */
.sg-co-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sg-space-24); }
.sg-co-hero > * { min-width: 0; }
.sg-co-id { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; margin-top: var(--sg-space-8); }
.sg-co-id .sg-logo { --sg-s: var(--sg-logo-l); margin-top: 4px; }
.sg-co-id__kind { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: var(--sg-space-8); }
.sg-co-id__date { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-co-hero__short { margin-top: var(--sg-space-12); color: var(--sg-muted); }
.sg-co-rank { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; margin-top: var(--sg-space-16); }
.sg-co-rank__score { display: inline-block; text-decoration: none; }
.sg-co-rank__score:hover .sg-score { --sg-fc: var(--sg-accent); }
.sg-co-rank__txt { display: grid; gap: 4px; font-size: var(--sg-ui-size); line-height: 22px; }
.sg-co-rank__how { color: var(--sg-muted); font-size: var(--sg-small-size); line-height: var(--sg-small-lh); }

/* паспорт: шесть подписанных фактов; линии между ячейками — зазор сетки на фоне цвета линии */
.sg-passport { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; margin-top: var(--sg-space-20); background: var(--sg-line); }
.sg-passport__cell { display: grid; align-content: start; gap: 4px; min-width: 0; padding: 12px; background: var(--sg-surface); }
.sg-passport__cell dt { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-passport__cell dd { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: var(--sg-ui-size); line-height: 22px; }
.sg-passport__val { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.sg-passport__val .sg-ico { color: var(--sg-muted); }
.sg-passport__sub { flex-basis: 100%; color: var(--sg-muted); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }

.sg-co-hero__act { display: grid; gap: 12px; margin-top: var(--sg-space-20); }
.sg-co-hero__act .sg-btn { width: calc(100% - var(--sg-fw) * 2); }
.sg-co-hero__disc { margin-top: var(--sg-space-12); }

/* мини-расчёт «Сколько заплачу здесь» */
.sg-pay { align-content: start; }
.sg-pay__form { display: grid; gap: 12px; }
.sg-pay > .sg-paybox { margin-top: 4px; }
.sg-pay__alt { display: grid; gap: 4px; }
.sg-pay__alt .sg-paybox { grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: baseline; padding: 8px 12px; }
.sg-pay__alt .sg-paybox__name { grid-row: span 2; }
.sg-pay__alt .sg-paybox__sub { grid-column: 2; justify-self: end; }
.sg-pay__alt .sg-pay__total { justify-self: end; color: var(--sg-ink); }
.sg-pay__alt .sg-badge { grid-column: 1 / -1; }
.sg-pay__diff { margin-top: 0; }
.sg-pay__note { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }

.sg-anchors { margin-top: var(--sg-space-24); }

/* ---------- Обзор: условия «параметр — значение — источник» ---------- */
.sg-cond { display: block; width: 100%; }
.sg-cond tbody { display: block; }
.sg-cond thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sg-cond__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 12px; border-top: var(--sg-border); }
.sg-cond tbody .sg-cond__row:first-child { border-top: 0; }
.sg-cond__row > * { min-width: 0; padding: 0; }
.sg-cond__row > th { color: var(--sg-quiet); font-weight: 400; font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-cond__val { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: var(--sg-text-size); line-height: 24px; }
.sg-cond__src { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); overflow-wrap: anywhere; }
.sg-cond__src a { color: var(--sg-muted); }
.sg-cond__src a:hover { color: var(--sg-accent); }
.sg-cond__date { display: block; }

/* ---------- Обзор: разбор оценки ---------- */
.sg-co-score { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sg-space-16); }
.sg-co-score > * { min-width: 0; }
.sg-scoretab { display: block; width: 100%; }
.sg-scoretab tbody, .sg-scoretab tfoot { display: block; }
.sg-scoretab thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sg-scoretab__row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 6px 12px; align-items: center;
  grid-template-areas: "name name name" "val val val" "pts pts pts" "w c .";
  padding: 12px; border-top: var(--sg-border);
}
.sg-scoretab tbody .sg-scoretab__row:first-child { border-top: 0; }
.sg-scoretab__row > * { min-width: 0; padding: 0; }
.sg-scoretab__name { grid-area: name; font-weight: 700; font-size: var(--sg-text-size); line-height: 22px; }
.sg-scoretab__val { grid-area: val; font-size: var(--sg-ui-size); line-height: 22px; }
.sg-scoretab__why { display: block; color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-scoretab__pts { grid-area: pts; display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 12px; align-items: center; }
.sg-scoretab__pts .sg-num { text-align: right; }
.sg-scoretab__w { grid-area: w; color: var(--sg-muted); }
.sg-scoretab__c { grid-area: c; color: var(--sg-muted); }
.sg-scoretab__lab { font-size: var(--sg-micro-size); color: var(--sg-quiet); }
.sg-scoretab__row--total { background: var(--sg-surface); border-top: var(--sg-border-strong); grid-template-areas: "name name c" "val val val"; }
.sg-scoretab__row--total .sg-scoretab__pts, .sg-scoretab__row--total .sg-scoretab__w { display: none; }
.sg-scoretab__row--total .sg-scoretab__val { color: var(--sg-muted); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-scoretab__row--total .sg-scoretab__c { color: var(--sg-accent); }
.sg-co-score__side { display: grid; align-content: start; gap: 12px; padding: var(--sg-pad); font-size: var(--sg-ui-size); line-height: 22px; }
.sg-co-score__tile { display: flex; align-items: center; gap: 12px; }
.sg-co-score__tile .sg-score__of { margin-top: 0; }
.sg-co-score__not { color: var(--sg-muted); font-size: var(--sg-small-size); line-height: var(--sg-small-lh); }

/* ---------- Обзор: акция, шаги, известность ---------- */
.sg-co-promo .sg-note__title { flex-wrap: wrap; }
.sg-co-promo__src { margin-top: var(--sg-space-8); color: var(--sg-quiet); overflow-wrap: anywhere; }
.sg-note .sg-co-promo__src { font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-co-cta { display: grid; gap: 12px; margin-top: var(--sg-space-20); padding-top: var(--sg-space-16); border-top: var(--sg-border); }
.sg-co-cta p { color: var(--sg-muted); font-size: var(--sg-ui-size); line-height: 22px; }
.sg-co-cta .sg-btn { width: calc(100% - var(--sg-fw) * 2); }
.sg-co-mention { display: grid; gap: 8px 24px; align-items: center; }
.sg-co-mention__n { white-space: nowrap; }

/* ---------- Обзор: отзывы ---------- */
.sg-reviews { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sg-space-20); align-items: start; }
.sg-reviews > * { min-width: 0; }
.sg-reviews__empty { padding: var(--sg-pad); border: var(--sg-border); }
.sg-reviews__empty .sg-empty__text { margin-bottom: 0; }
.sg-reviews__form { display: grid; gap: 12px; padding: var(--sg-pad); }
.sg-field--area { align-items: stretch; padding: 12px; }
.sg-field--area textarea { min-height: 96px; resize: vertical; }
.sg-reviews__note { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-reviews__ok { display: flex; align-items: flex-start; gap: 8px; color: var(--sg-success); font-size: var(--sg-ui-size); line-height: 22px; }
.sg-reviews__ok .sg-ico { margin-top: 3px; }

/* ---------- Автор, дата проверки, источники (обзор и сравнение) ---------- */
.sg-sources { display: grid; grid-template-columns: minmax(0, 1fr); }
.sg-sources > * { min-width: 0; padding: var(--sg-pad); }
.sg-sources__who { display: grid; align-content: start; gap: var(--sg-space-16); }
.sg-sources__dates { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.sg-sources__dates dt { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-sources__list { border-top: var(--sg-border); }
.sg-sources__ul { display: grid; gap: 8px; margin-top: var(--sg-space-8); }
.sg-sources__ul li { position: relative; padding-left: 20px; font-size: var(--sg-ui-size); line-height: 22px; overflow-wrap: anywhere; }
.sg-sources__ul li::before { content: ""; position: absolute; left: 2px; top: 8px; width: 6px; height: 6px; background: var(--sg-accent); }
.sg-sources__note { margin-top: var(--sg-space-12); color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }

/* ---------- Сравнение: заголовок, две стороны, вывод ---------- */
.sg-cmp-hero .sg-h1 { margin-top: var(--sg-space-4); }
.sg-cmp-hero__disc { margin-top: var(--sg-space-12); }
.sg-duel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: var(--sg-space-16); }
.sg-duel__or { display: none; }
.sg-duel__side { display: grid; align-content: start; gap: 12px; min-width: 0; padding: 12px; }
.sg-duel__id { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; align-items: center; justify-items: start; }
.sg-duel__id > div { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.sg-duel__name { font: 700 17px/22px var(--sg-font-body); overflow-wrap: anywhere; }
.sg-duel__name a { color: var(--sg-ink); text-decoration: none; }
.sg-duel__name a:hover { color: var(--sg-accent); text-decoration: underline; }
.sg-duel__dl { display: grid; gap: 8px; }
.sg-duel__dl > div { display: grid; gap: 4px; min-width: 0; }
.sg-duel__dl dt { color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-duel__dl dd { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.sg-duel__of { color: var(--sg-quiet); }

.sg-verdict { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: var(--sg-space-16); }
.sg-verdict__cell { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; min-width: 0; padding: var(--sg-pad); border-top: var(--sg-border); }
.sg-verdict__cell:first-child { border-top: 0; }
.sg-verdict__cell > .sg-ico { color: var(--sg-accent); }
.sg-verdict__label { margin-bottom: 4px; font: 400 var(--sg-pixel-xs)/var(--sg-pixel-xs-lh) var(--sg-font-pixel); color: var(--sg-muted); }
.sg-verdict__cell p:not(.sg-verdict__label) { font-size: var(--sg-ui-size); line-height: 22px; }

/* ---------- Сравнение: расчёт на двоих ---------- */
.sg-cmp-calc { margin-top: var(--sg-space-24); }
.sg-paircalc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 12px; }
.sg-paircalc > * { min-width: 0; }
.sg-paircalc__form { display: grid; gap: 12px; }
.sg-paircalc__out { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sg-paircalc .sg-paybox__name { color: var(--sg-ink); font-weight: 700; font-size: var(--sg-ui-size); line-height: var(--sg-ui-lh); overflow-wrap: anywhere; }
.sg-paircalc .sg-pay__total { font-size: var(--sg-num-l); line-height: var(--sg-num-l-lh); }
.sg-paircalc__diff { margin-top: 0; }

/* ---------- Сравнение: таблица бок о бок (дополняет .sg-vs из components.css) ---------- */
/* до 768px подпись параметра занимает строку целиком, значения А и Б стоят под ней рядом:
   так шкала комиссии и ячейки способов оплаты помещаются и на 320px */
.sg-vs-wrap { padding: 0 12px; }
.sg-vs__head, .sg-vs__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 12px; }
.sg-vs__head { position: sticky; top: 0; z-index: 1; align-items: center; background: var(--sg-bg); border-bottom: var(--sg-border-strong); }
.sg-vs__head > .sg-vs__label { display: none; }
.sg-vs__row > .sg-vs__label { grid-column: 1 / -1; }
.sg-vs__a, .sg-vs__b { padding-left: 8px; border-left: 4px solid var(--sg-vs-a); }
.sg-vs__b { border-left-color: var(--sg-vs-b); }
.sg-vs__head--a, .sg-vs__head--b { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; }
.sg-vs__name { color: var(--sg-ink); font-weight: 700; font-size: var(--sg-ui-size); line-height: var(--sg-ui-lh); overflow-wrap: anywhere; }
a.sg-vs__name { text-decoration: none; }
a.sg-vs__name:hover { color: var(--sg-accent); text-decoration: underline; }
.sg-vs__row:last-child { border-bottom: 0; }
.sg-vs__a, .sg-vs__b { display: flex; flex-wrap: wrap; align-items: center; align-content: start; gap: 4px 8px; min-width: 0; font-size: var(--sg-ui-size); line-height: 22px; overflow-wrap: anywhere; }
.sg-vs__a.is-best, .sg-vs__b.is-best { color: var(--sg-ink); }
.sg-vs__sub { flex-basis: 100%; color: var(--sg-quiet); font-size: var(--sg-micro-size); line-height: var(--sg-micro-lh); }
.sg-vs__w { display: block; color: var(--sg-quiet); }
.sg-vs__bar { display: grid; grid-template-columns: minmax(0, 1fr) 32px; gap: 8px; align-items: center; width: 100%; }
.sg-vs__bar .sg-num { text-align: right; }
.sg-bar--b > i { background: var(--sg-vs-b); }
.sg-vs__row--total .sg-vs__label { color: var(--sg-ink); font-weight: 700; }

/* ---------- Сравнение: плюсы и минусы, кнопки, конструктор ---------- */
.sg-cmp-pc, .sg-cmp-cta { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.sg-cmp-pc__col { display: grid; align-content: start; gap: 12px; min-width: 0; }
.sg-cmp-pc__col .sg-title--s { margin-top: 4px; }
.sg-cmp-cta__col { display: grid; align-content: start; gap: 16px; min-width: 0; }
.sg-cmp-cta__col .sg-duel__id { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
.sg-cmp-cta__sum { color: var(--sg-muted); font-size: var(--sg-small-size); line-height: var(--sg-small-lh); }
.sg-cmp-cta__btns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px; }
.sg-cmp-build { margin-top: var(--sg-space-20); }
.sg-cmp-build .sg-btn { margin-top: var(--sg-space-12); width: calc(100% - var(--sg-fw) * 2); }
.sg-note__title .sg-logo { flex: none; }
.sg-title--s + .sg-links, .sg-title--s + .sg-pairs { margin-top: var(--sg-space-8); }

/* ==================== от 768px ==================== */
@media (min-width: 768px) {
  .sg-box { padding: var(--sg-pad-md); }

  .sg-co-id { gap: 16px; }
  .sg-co-id .sg-logo { --sg-s: var(--sg-logo-xl); }
  .sg-passport { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sg-passport__cell { padding: 12px 16px; }
  .sg-co-hero__act { grid-template-columns: auto auto; justify-content: start; }
  .sg-co-hero__act .sg-btn { width: auto; }
  .sg-pay { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; padding: var(--sg-pad-md); }
  .sg-pay > .sg-title, .sg-pay > .sg-pay__note { grid-column: 1 / -1; }
  .sg-pay__form { grid-column: 1; grid-row: 2 / span 3; align-content: start; }
  .sg-pay > .sg-paybox, .sg-pay__alt, .sg-pay__diff, .sg-pay > .sg-btn { grid-column: 2; }

  .sg-cond thead { position: static; display: block; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; background: var(--sg-surface-2); }
  .sg-cond__row { grid-template-columns: 220px minmax(0, 1fr) 240px; gap: 16px; padding: 12px 16px; align-items: start; }
  .sg-cond__row > th { padding-top: 3px; }
  .sg-cond__row--head { border-top: 0; padding-block: 10px; align-items: center; }
  .sg-cond__row--head > th { padding-top: 0; color: var(--sg-muted); font-weight: 700; font-size: var(--sg-th-size); line-height: var(--sg-th-lh); }
  .sg-cond tbody .sg-cond__row:first-child { border-top: 0; }
  .sg-cond__src { padding-top: 3px; }

  .sg-scoretab thead { position: static; display: block; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; background: var(--sg-surface-2); }
  .sg-scoretab__row {
    grid-template-columns: 180px minmax(0, 1fr) 180px 48px 56px; grid-template-areas: "name val pts w c"; gap: 16px; padding: 12px 16px; align-items: start;
  }
  .sg-scoretab__row--head { align-items: center; padding-block: 10px; }
  .sg-scoretab__row--head > th { color: var(--sg-muted); font-weight: 700; font-size: var(--sg-th-size); line-height: var(--sg-th-lh); }
  .sg-scoretab__row--head > th:nth-child(n+4) { text-align: right; }
  .sg-scoretab__pts { padding-top: 5px; }
  .sg-scoretab__w, .sg-scoretab__c { text-align: right; padding-top: 2px; }
  .sg-scoretab__lab { display: none; }
  .sg-scoretab__row--total { grid-template-areas: "name val pts w c"; align-items: center; }
  .sg-scoretab__row--total .sg-scoretab__pts, .sg-scoretab__row--total .sg-scoretab__w { display: block; }
  .sg-scoretab__row--total .sg-scoretab__c { padding-top: 0; }
  .sg-co-score__side { grid-template-columns: auto minmax(0, 1fr); column-gap: 20px; padding: var(--sg-pad-md); align-items: center; }
  .sg-co-score__tile { grid-row: span 2; }
  .sg-co-score__side .sg-btn { grid-column: 1 / -1; width: max-content; }
  .sg-co-score__not { grid-column: 2; }

  .sg-co-cta { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px; }
  .sg-co-cta .sg-btn { width: auto; }
  .sg-co-mention { grid-template-columns: auto minmax(0, 1fr); }
  .sg-reviews__empty, .sg-reviews__form { padding: var(--sg-pad-md); }

  .sg-sources { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .sg-sources > * { padding: var(--sg-pad-md); }
  .sg-sources__list { border-top: 0; border-left: var(--sg-border); }

  .sg-duel { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 16px; }
  .sg-duel__or { display: block; font: 400 var(--sg-pixel-xs)/var(--sg-pixel-xs-lh) var(--sg-font-pixel); color: var(--sg-quiet); text-transform: uppercase; }
  .sg-duel { align-items: stretch; }
  .sg-duel__or { align-self: center; }
  .sg-duel__side { gap: 16px; padding: 16px 20px; }
  .sg-duel__id { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .sg-duel__name { font-size: 20px; line-height: 26px; }
  .sg-duel__dl { grid-template-columns: auto minmax(0, 1fr); gap: 20px; }
  .sg-verdict { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sg-verdict__cell { padding: var(--sg-pad-md); border-left: var(--sg-border); }
  .sg-verdict__cell:nth-child(odd) { border-left: 0; }
  .sg-verdict__cell:nth-child(-n+2) { border-top: 0; }

  .sg-paircalc { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 16px 20px; padding: 16px; align-items: start; }
  .sg-paircalc__out { gap: 12px; }
  .sg-paircalc__diff { grid-column: 1 / -1; }
  .sg-paircalc .sg-pay__total { font-size: var(--sg-num-xl); line-height: var(--sg-num-xl-lh); }

  .sg-vs-wrap { padding: 0 16px; }
  .sg-vs__head, .sg-vs__row { grid-template-columns: 200px repeat(2, minmax(0, 1fr)); gap: 16px; padding: 12px 0; }
  .sg-vs__head > .sg-vs__label { display: block; }
  .sg-vs__row > .sg-vs__label { grid-column: auto; }
  .sg-vs__label { font-size: var(--sg-small-size); line-height: 22px; }
  .sg-vs--score .sg-vs__bar { max-width: 320px; }

  .sg-cmp-pc, .sg-cmp-cta { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .sg-cmp-build .sg-btn { width: auto; }
}

/* ==================== от 1200px ==================== */
@media (min-width: 1200px) {
  .sg-box { padding: var(--sg-pad-lg); }

  /* слева — кто это и паспорт, справа — расчёт суммы: данные и действие на первом экране */
  .sg-co-hero { grid-template-columns: minmax(0, 1fr) 420px; gap: 32px; align-items: start; }
  .sg-pay { display: grid; grid-template-columns: minmax(0, 1fr); padding: 20px; }
  .sg-pay > .sg-title, .sg-pay > .sg-pay__note, .sg-pay > .sg-paybox, .sg-pay > .sg-btn, .sg-pay__alt, .sg-pay__diff, .sg-pay__form { grid-column: 1; grid-row: auto; }
  .sg-anchors { margin-top: var(--sg-space-32); }

  .sg-cond__row { grid-template-columns: 280px minmax(0, 1fr) 300px; gap: 24px; padding: 12px 24px; }
  .sg-co-score { grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; }
  .sg-scoretab__row { grid-template-columns: 220px minmax(0, 1fr) 200px 48px 56px; padding: 12px 24px; }
  .sg-co-score__side { grid-template-columns: minmax(0, 1fr); padding: var(--sg-pad-lg); }
  .sg-co-score__tile { grid-row: auto; }
  .sg-co-score__not { grid-column: auto; }
  .sg-co-score__side .sg-btn { width: calc(100% - var(--sg-fw) * 2); }

  .sg-reviews { grid-template-columns: minmax(0, 1fr) 480px; gap: 28px; }
  .sg-reviews__empty, .sg-reviews__form { padding: var(--sg-pad-lg); }
  .sg-sources > * { padding: var(--sg-pad-lg); }

  .sg-duel { gap: 24px; }
  .sg-duel__side { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 20px 24px; }
  .sg-duel__dl { grid-template-columns: auto auto; }
  .sg-verdict { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sg-verdict__cell { padding: var(--sg-pad-lg) 20px; border-top: 0; }
  .sg-verdict__cell:nth-child(odd) { border-left: var(--sg-border); }
  .sg-verdict__cell:first-child { border-left: 0; }

  .sg-paircalc { grid-template-columns: 480px minmax(0, 1fr); gap: 12px 24px; padding: 16px 20px; }
  .sg-paircalc__form { grid-template-columns: 220px minmax(0, 1fr); align-items: end; }
  .sg-paircalc__form .sg-calc__err { grid-column: 1 / -1; }
  .sg-paircalc__diff { grid-column: 2; }

  .sg-vs-wrap { padding: 0 24px; }
  .sg-vs__head, .sg-vs__row { grid-template-columns: 260px repeat(2, minmax(0, 1fr)); gap: 24px; }
  .sg-cmp-pc, .sg-cmp-cta { gap: 28px; }
}