/* СПРАВОЧНЫЕ ПОСАДОЧНЫЕ В РЕДИЗАЙНЕ 10.2026 (WP-G, скил vinpasi-design): /banki, /banki/{slug},
   /ganbajeba, /proverki, /taxi и seo/error.html. Грузится после seo_v2.css: общий слой `.seo`
   (шрифты, чернила вместо синего, кнопки 44px, заголовки без капса) уже действует, здесь —
   только раскладка и данные этих страниц. Все селекторы под `.seo.gw` (класс из блока
   `main_class`), сетка `.lp` страниц /ceny сюда не доходит.

   Перестановка — только CSS (grid + места в сетке): порядок в документе, тексты, ссылки,
   JSON-LD — как в main. Обёртки `gw-side` / `gw-aside` и классы секций — без нового текста.

   Плотность «интеллект» (SKILL.md): таблицы — главное содержимое, числа табличные и вправо,
   подписи тихие. Десктоп — та же схема, что у /ceny: слева читают подряд, справа узкая
   колонка (340px, как --lp-side) с тем, во что заглядывают, и с кнопкой в выдачу. */

:root {
  --gw-side: 340px;
  --gw-gap: 40px;
  /* Стрелка селекта — Solar alt-arrow-down-linear, цвет --ink-dim. Нативная стрелка Safari
     серая и мелкая и стоит не на той линии, что текст. */
  --gw-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23596270' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m19 9l-7 6l-7-6'/%3E%3C/svg%3E");
}

/* ================================================================ 1. ОБЩЕЕ ДЛЯ ПАКЕТА */

/* seo.css делает `.seo-hero` сеткой «текст + 340px» под панель действий /ceny. У G второго
   ребёнка в герое нет — справа стояла пустая полоса 340px, а лид сжимался до 60% ширины. */
.seo.gw .seo-hero { display: block; }
.seo.gw .seo-hero-copy { max-width: none; }
.seo.gw .seo-hero-copy > .lead, .seo.gw > .lead { font-size: 17px; line-height: 1.55; color: var(--ink); max-width: 64ch; margin: 0 0 10px; }
.seo.gw .seo-hero-copy > .why, .seo.gw > .why { max-width: 72ch; }
.seo.gw .crumbs { margin-top: 16px; }
/* Низ страницы: 72px `.wrap` + поля последнего блока давали ~140px пустоты над подвалом (G2). */
.seo.gw { padding-bottom: 40px; }

/* Списки без маркеров: строка по линии, как ряды таблиц. */
.seo.gw ul.plain { list-style: none; margin: 0; padding: 0; }
.seo.gw ul.plain li { padding: 10px 0; border-top: 1px solid var(--line); font-size: 14.5px; line-height: 1.45; }
.seo.gw ul.plain li:first-child { border-top: 0; padding-top: 2px; }

/* Таблицы. Числа табличные и по правому краю, текст по левому; шапка тихая, без капса,
   с линией чуть темнее строк — чтобы было видно, где кончаются подписи. */
.seo.gw table.grid { margin: 4px 0 10px; font-size: 14.5px; line-height: 1.4; }
.seo.gw table.grid th, .seo.gw table.grid td {
  padding: 11px 16px 11px 0; border-bottom: 1px solid var(--line);
  vertical-align: middle; font-variant-numeric: tabular-nums;
}
.seo.gw table.grid tr > :last-child { padding-right: 0; }
.seo.gw table.grid thead th {
  padding-top: 0; padding-bottom: 8px; vertical-align: bottom;
  border-bottom-color: var(--line-strong);
  font-size: 12.5px; font-weight: 500; line-height: 1.3; color: var(--ink-faint);
}
.seo.gw table.grid tbody th { font-weight: 400; color: var(--ink-dim); text-align: left; }
.seo.gw table.grid td a, .seo.gw table.grid th a {
  color: var(--ink); font-weight: 600;
  text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px;
}
.seo.gw table.grid td a:hover, .seo.gw table.grid th a:hover { text-decoration-color: var(--ink); }
.seo.gw table.grid tbody tr:hover > * { background: var(--panel); }

/* Таблицы-рейтинги /banki и /taxi: первая колонка — имя (ссылка), остальные — числа. */
.seo.gw .gw-table table.grid td, .seo.gw .gw-table table.grid thead th { text-align: right; }
.seo.gw .gw-table table.grid tr > :first-child { text-align: left; }
.seo.gw .gw-table table.grid td:first-child { color: var(--ink); font-weight: 500; }
/* Текстовые колонки среди чисел — по левому краю и с зазором, иначе «газ 48%» липнет к цене. */
.seo.gw-banki .gw-table table.grid tr > :nth-child(2),
.seo.gw-taxi .gw-table table.grid tr > :nth-child(4) { text-align: left; padding-left: 8px; }
.seo.gw-banki .gw-table table.grid td:nth-child(2) { color: var(--ink-dim); }
.seo.gw .gw-table + .why, .seo.gw .gw-table > .why { margin-top: 8px; }
@media (max-width: 1099px) {
  /* /taxi на телефоне (G2): «газ 48%, дизель 22%» ломалось в три строки и растягивало ряд до
     160px; одной строкой ряд вдвое ниже, колонка уезжает в прокрутку таблицы. */
  .seo.gw-taxi .gw-table table.grid td:nth-child(4) { white-space: nowrap; }
}

/* Боковые справки (стоянки, акциз под такси): тихий лист — не карточка с тенью. */
.seo.gw .gw-lots, .seo.gw .gw-duty { font-size: 14.5px; }
.seo.gw .gw-lots h2, .seo.gw .gw-duty h2 { font-size: 17px; margin: 0 0 10px; }
.seo.gw .gw-lots > .lead { font-size: 16px; font-weight: 600; line-height: 1.45; margin: 0 0 4px; }
.seo.gw .gw-duty > .lead { font-size: 15px; line-height: 1.55; margin: 0 0 10px; }

/* Кнопка в выдачу — одна на странице. Лист «следить» несёт ту же «Смотреть N» по тому же
   адресу, что и строка под карточками (`picker`, тот же текст): там она скрыта, счёт
   «10 из N» остаётся. РЕШЕНИЕ G: две одинаковые кнопки стояли одна под другой. */
.seo.gw:has(.follow-box .btn) .cars-cta .btn { display: none; }
.seo.gw .cars-cta { margin-top: 12px; }
.seo.gw .follow-box .lead { font-size: 15px; font-weight: 500; line-height: 1.45; color: var(--ink); margin: 0 0 14px; max-width: 60ch; }
.seo.gw .follow-box p:has(> .btn) { margin: 0; }
.seo.gw .follow-box .btn { min-height: 48px; font-size: 15px; padding: 0 22px; }
.seo.gw .gw-side > .why { margin: 16px 0 0; font-size: 14px; }
.seo.gw .gw-side > .stamp { margin: 6px 0 0; }

/* Широкие таблицы на телефоне и планшете едут вбок внутри своей рамки. Имя закреплено слева
   (responsive.md: «horizontally scrollable columns with stable attribute labels»), справа —
   тень, пока есть что листать: без неё обрезанная колонка выглядела как сломанная вёрстка. */
@media (max-width: 1099px) {
  .seo.gw .scroll-x {
    background:
      linear-gradient(to left, var(--bg) 40%, rgba(255, 255, 255, 0)) right center / 40px 100% no-repeat local,
      linear-gradient(to left, rgba(21, 25, 30, .14), rgba(21, 25, 30, 0)) right center / 16px 100% no-repeat scroll;
  }
  .seo.gw .scroll-x > table.grid tr > :first-child {
    position: sticky; left: 0; z-index: 1; background: var(--bg);
    box-shadow: inset -1px 0 0 var(--line); padding-right: 12px;
  }
  .seo.gw .scroll-x > table.grid thead tr > :first-child { box-shadow: inset -1px 0 0 var(--line-strong); }
  .seo.gw table.grid tbody tr:hover > * { background: none; }
  .seo.gw .scroll-x > table.grid tbody tr:hover > :first-child { background: var(--bg); }
}

/* ================================================================ 2. ДЕСКТОП: ДВЕ КОЛОНКИ */

@media (min-width: 1100px) {
  /* /banki, /banki/{slug}, /taxi: герой слева, справка справа (стоянки / акциз), таблица во
     всю ширину, машины слева, колонка действия справа липнет — как панель ответа /ceny. */
  .seo.gw-banki, .seo.gw-bank, .seo.gw-taxi {
    display: grid; grid-template-columns: minmax(0, 1fr) var(--gw-side);
    column-gap: var(--gw-gap); align-items: start;
  }
  .seo.gw-banki > *, .seo.gw-bank > *, .seo.gw-taxi > * { grid-column: 1 / -1; min-width: 0; }
  .seo.gw-banki > .crumbs, .seo.gw-bank > .crumbs, .seo.gw-taxi > .crumbs { grid-row: 1; }
  .seo.gw-banki > .seo-hero, .seo.gw-bank > .seo-hero, .seo.gw-taxi > .seo-hero { grid-row: 2; grid-column: 1; }
  .seo.gw-banki > .gw-lots, .seo.gw-bank > .gw-lots, .seo.gw-taxi > .gw-duty {
    grid-row: 2; grid-column: 2;
    /* Верх листа — на линии верха h1 (у h1 сверху 18px). */
    margin-top: 18px; padding: 18px 20px 20px;
    border: 0; border-radius: var(--r); background: var(--panel);
  }
  .seo.gw-banki > .gw-table { grid-row: 3; }
  /* /taxi (G2): лист «почему возраст важнее цены» вдвое выше героя — под лидом слева стояла
     пустота ~270px (r0/w0, зона 832×1104 в metrics). Таблица уходит в левую колонку (семь
     колонок, ширина 780px — scrollWidth = clientWidth на ru и ka), лист справа липнет рядом
     с ней: правило акциза видно, пока читают столбец «Акциз». */
  .seo.gw-taxi > .gw-table { grid-row: 3; grid-column: 1; }
  .seo.gw-taxi > .gw-duty {
    grid-row: 2 / span 2; align-self: start;
    position: sticky; top: calc(var(--h-top) + 24px);
  }
  .seo.gw-banki > .cars-block, .seo.gw-taxi > .cars-block { grid-row: 4; grid-column: 1; }
  .seo.gw-bank > .cars-block { grid-row: 3; grid-column: 1; }
  .seo.gw-banki > .gw-side, .seo.gw-taxi > .gw-side, .seo.gw-bank > .gw-side {
    grid-column: 2; position: sticky; top: calc(var(--h-top) + 24px);
    /* Лист действия встаёт на линию, которой открывается блок машин (margin 32 у .block). */
    margin-top: 32px;
  }
  .seo.gw-banki > .gw-side, .seo.gw-taxi > .gw-side { grid-row: 4; }
  .seo.gw-bank > .gw-side { grid-row: 3; }
  /* Нет справки — герой во всю ширину; нет машин — колонка действия во всю ширину и не липнет. */
  .seo.gw-banki:not(:has(> .gw-lots)) > .seo-hero,
  .seo.gw-bank:not(:has(> .gw-lots)) > .seo-hero { grid-column: 1 / -1; }
  .seo.gw-banki:not(:has(> .cars-block)) > .gw-side,
  .seo.gw-taxi:not(:has(> .cars-block)) > .gw-side,
  .seo.gw-bank:not(:has(> .cars-block)) > .gw-side { grid-column: 1 / -1; position: static; max-width: 620px; }

  /* Лист действия справа: полная ширина колонки, кнопка во всю ширину листа. */
  .seo.gw .gw-side .follow-box { margin: 0; padding: 20px; }
  .seo.gw .gw-side .follow-box .btn { display: flex; width: 100%; }

  /* /proverki: слева ответ (лид и таблица находок), справа — где находится, чего не хватает,
     откуда числа и выход в выдачу. Правая колонка начинается на линии h1. */
  .seo.gw-proverki {
    display: grid; grid-template-columns: minmax(0, 1fr) var(--gw-side);
    grid-template-rows: auto auto auto 1fr; column-gap: var(--gw-gap); align-items: start;
  }
  .seo.gw-proverki > * { grid-column: 1; min-width: 0; }
  .seo.gw-proverki > h1 { grid-row: 1; }
  .seo.gw-proverki > .lead { grid-row: 2; }
  .seo.gw-proverki > .why { grid-row: 3; }
  .seo.gw-proverki > .gw-loud { grid-row: 4; }
  .seo.gw-proverki > .gw-aside { grid-column: 2; grid-row: 1 / span 4; padding-top: 18px; }
  .seo.gw-proverki:not(:has(> .gw-aside)) > * { grid-column: 1 / -1; }
  .seo.gw-proverki .gw-aside > .block:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
  .seo.gw-proverki .gw-aside > .block { margin-top: 24px; padding-top: 20px; }
  .seo.gw-proverki .gw-aside h2 { font-size: 17px; margin: 0 0 8px; }
  .seo.gw-proverki .gw-aside .lead { font-size: 14px; line-height: 1.5; color: var(--ink-dim); }
  /* G2: правая колонка кончалась на ~1 150px, дальше 1 250px пустоты рядом с таблицей, а
     единственный выход страницы («Смотреть машины») стоял ниже первого экрана. Колонка
     тянется на всю высоту сетки, кнопка встаёт первой (order, порядок в документе тот же)
     и липнет под шапкой сайта; полоса фона над и под ней закрывает уезжающий текст. */
  .seo.gw-proverki > .gw-aside { align-self: stretch; display: flex; flex-direction: column; }
  .seo.gw-proverki .gw-aside > .cta {
    order: -1; position: sticky; top: var(--h-top); z-index: 2;
    margin: -16px 0 8px; padding: 16px 0; background: var(--bg);
  }
  /* «Откуда числа» липнет под кнопкой: после первого экрана справа от длинной таблицы стояла
     одна кнопка над пустой колонкой. Справки «не хватает данных» и «где находится» уезжают
     под неё (фон закрывает), объяснение способа остаётся рядом с числами до конца таблицы. */
  .seo.gw-proverki .gw-aside > .gw-method {
    position: sticky; top: calc(var(--h-top) + 88px); z-index: 1; background: var(--bg);
  }

  /* /ganbajeba: форма строкой во всю ширину, под ней ответ слева и «по годам» справа —
     выбранный год подсвечен в таблице рядом с суммой. Тариф — под ответом. */
  .seo.gw-calc {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 48px; align-items: start;
  }
  .seo.gw-calc > * { grid-column: 1 / -1; min-width: 0; }
  .seo.gw-calc > .result { grid-row: 4; grid-column: 1; }
  .seo.gw-calc > .gw-years { grid-row: 4 / span 2; grid-column: 2; }
  .seo.gw-calc > .gw-rules { grid-row: 5; grid-column: 1; }
}
/* G2: «по годам» короче левой колонки (ответ + тариф) на ~300px — под таблицей справа была
   пустота до подвала (зона 864×880 в metrics r0). Таблица липнет и стоит рядом с тарифом.
   Только когда окно её вмещает (≈780px с шапкой), иначе низ таблицы был бы недоступен. */
@media (min-width: 1100px) and (min-height: 860px) {
  .seo.gw-calc > .gw-years { position: sticky; top: calc(var(--h-top) + 8px); }
}

/* ================================================================ 3. /banki, /banki/{slug}, /taxi */

/* Телефон: справки идут по порядку документа, но тоже листом — отделены от прозы героя. */
@media (max-width: 1099px) {
  .seo.gw .gw-lots, .seo.gw .gw-duty { border-top: 1px solid var(--line); }
}

/* ================================================================ 4. /proverki */

/* Имя проверки — чернилами, способ — тихой второй строкой: в main они шли одной строкой
   одного серого, и где кончается название, было не видно. */
.seo.gw-proverki .gw-loud tbody th { color: var(--ink); font-weight: 500; line-height: 1.4; }
.seo.gw-proverki .gw-loud tbody th .muted { display: block; margin-top: 3px; font-size: 13px; font-weight: 400; line-height: 1.45; color: var(--ink-faint); }
.seo.gw-proverki .gw-loud table.grid td { text-align: right; white-space: nowrap; width: 1%; padding-left: 16px; }
.seo.gw-proverki .gw-loud table.grid thead th:not(:first-child) { text-align: right; padding-left: 16px; }
.seo.gw-proverki .gw-loud table.grid td:nth-child(2) { font-weight: 600; color: var(--ink); }
.seo.gw-proverki .gw-loud .scroll-x > table.grid { min-width: 0; }
.seo.gw-proverki .gw-worst table.grid td { text-align: right; width: 1%; padding-left: 16px; }
.seo.gw-proverki .gw-worst table.grid tbody th { color: var(--ink); font-weight: 500; }
.seo.gw-proverki .gw-silent .why { font-size: 13.5px; }

/* «Смотреть машины» — единственный выход страницы в выдачу: чернильная кнопка, не ссылка
   под двухпиксельной чертой. */
.seo.gw-proverki .cta { border-top: 0; margin: 28px 0 0; }
.seo.gw-proverki .cta a {
  display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px;
  border-radius: var(--radius); background: var(--ink); color: #fff;
  font-size: 15px; font-weight: 600; text-decoration: none;
}
.seo.gw-proverki .cta a:hover { background: #000; }

/* Телефон: четыре колонки не помещаются — строка таблицы становится блоком «название и
   способ, под ними три числа». Шапка липнет под шапкой сайта и подписывает числа на каждом
   экране. Без прокрутки вбок: колонка «Смогла оценить» в main была за краем. */
@media (max-width: 760px) {
  .seo.gw-proverki .gw-loud .scroll-x { overflow: visible; background: none; }
  .seo.gw-proverki .gw-loud table.grid,
  .seo.gw-proverki .gw-loud thead,
  .seo.gw-proverki .gw-loud tbody { display: block; }
  .seo.gw-proverki .gw-loud thead {
    position: sticky; top: var(--h-top); z-index: 2; background: var(--bg);
    border-bottom: 1px solid var(--line-strong);
  }
  .seo.gw-proverki .gw-loud tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 12px;
    padding: 12px 0; border-bottom: 1px solid var(--line);
  }
  .seo.gw-proverki .gw-loud thead tr { padding: 8px 0 6px; border: 0; }
  /* Специфичность (0,5,2)/(0,5,3) — не ниже липкой первой колонки `.scroll-x` (≤1099) и
     правого выравнивания шапки чисел: в w0 они перебивали сброс, шапка стояла вправо над
     числами слева, а тень липкой колонки рисовала вертикальную черту у правого края. */
  .seo.gw-proverki .gw-loud .scroll-x > table.grid tr > *,
  .seo.gw-proverki .gw-loud .scroll-x > table.grid thead tr > *,
  .seo.gw-proverki .gw-loud .scroll-x > table.grid tbody tr > * {
    position: static; box-shadow: none; border: 0; padding: 0; width: auto;
    text-align: left; background: none;
  }
  .seo.gw-proverki .gw-loud tr > :first-child { grid-column: 1 / -1; }
  .seo.gw-proverki .gw-loud tbody th { margin-bottom: 8px; font-size: 15px; }
  .seo.gw-proverki .gw-loud thead th:first-child { margin-bottom: 2px; }
  .seo.gw-proverki .gw-loud table.grid td { font-size: 15px; }
}

/* ================================================================ 5. /ganbajeba */

/* Форма — пульт: лист панели, поля 44px, подписи над полями, кнопка чернилами. */
.seo.gw-calc form.calc {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 12px 16px; align-items: end;
  margin: 20px 0 0; padding: 16px 20px 20px;
  background: var(--panel); border: 0; border-radius: var(--r);
}
.seo.gw-calc form.calc label { gap: 6px; min-width: 0; }
.seo.gw-calc form.calc label span { font-size: 13px; font-weight: 500; color: var(--ink-dim); }
.seo.gw-calc form.calc input, .seo.gw-calc form.calc select {
  width: 100%; min-width: 0; height: 44px; padding: 0 12px;
  border: 1px solid var(--line-strong); border-radius: var(--r-sm); background-color: var(--bg);
  font: inherit; font-size: 15px; font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums;
}
.seo.gw-calc form.calc select {
  -webkit-appearance: none; appearance: none; padding-right: 36px;
  background-image: var(--gw-chev); background-repeat: no-repeat; background-position: right 10px center; background-size: 18px;
}
.seo.gw-calc form.calc input:hover, .seo.gw-calc form.calc select:hover { border-color: var(--ink-faint); }
.seo.gw-calc form.calc input:focus-visible, .seo.gw-calc form.calc select:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; border-color: var(--ink); }
.seo.gw-calc form.calc button {
  height: 44px; padding: 0 26px; border: 0; border-radius: var(--radius);
  background: var(--ink); color: #fff; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.seo.gw-calc form.calc button:hover { background: #000; }
.seo.gw-calc form.calc button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

/* Ответ: подпись запроса тихо, сумма — главное число страницы, разбивка — колонка цифр. */
.seo.gw-calc .result h2 { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--ink-dim); margin: 0 0 4px; }
.seo.gw-calc .result .total { font-size: 44px; font-weight: 700; letter-spacing: -.03em; line-height: 1.05; margin: 0 0 18px; }
.seo.gw-calc .result table.grid tbody th { width: 40%; }
.seo.gw-calc .result table.grid td:nth-child(2) { text-align: right; color: var(--ink); white-space: nowrap; }
.seo.gw-calc .result table.grid td.muted { padding-left: 20px; font-size: 13px; color: var(--ink-faint); }
.seo.gw-calc .result table.grid tr.sum > * { border-top: 1px solid var(--ink); border-bottom: 0; }
.seo.gw-calc .result table.grid tr.sum td.muted { color: var(--ink-dim); font-weight: 500; }
.seo.gw-calc .result .why { margin: 6px 0 0; }

/* По годам: строки плотнее (Давид листает), выбранный год — подложкой и весом. */
.seo.gw-calc .gw-years > .lead { font-size: 15px; line-height: 1.55; color: var(--ink-dim); max-width: 60ch; }
.seo.gw-calc .gw-years table.grid th, .seo.gw-calc .gw-years table.grid td { padding-top: 8px; padding-bottom: 8px; }
.seo.gw-calc .gw-years table.grid tr > :not(:first-child) { text-align: right; }
.seo.gw-calc .gw-years table.grid tr.on td { background: var(--panel-2); font-weight: 700; color: var(--ink); }
/* Поле 10px слева и справа у ВСЕХ строк, а не только у выделенной: в r2 «2019» и «9 615»
   выделенной строки стояли на 10px в стороне от колонки (UX P2). Черта — во внутреннем поле. */
.seo.gw-calc .gw-years table.grid tr > :first-child { padding-left: 10px; }
.seo.gw-calc .gw-years table.grid tr > :last-child { padding-right: 10px; }
.seo.gw-calc .gw-years table.grid tr.on td:first-child { box-shadow: inset 3px 0 0 var(--ink); }

/* Тариф: ставки — колонка цифр, правила — тихие строки по линии. */
.seo.gw-calc .gw-rules table.grid td { text-align: right; width: 30%; }
.seo.gw-calc .gw-rules table.grid thead th:last-child { text-align: right; }
.seo.gw-calc .gw-rules > p:not(.stamp) { font-size: 14.5px; line-height: 1.5; color: var(--ink-dim); max-width: 68ch; margin: 0; padding: 9px 0; border-bottom: 1px solid var(--line); }
.seo.gw-calc .gw-rules > p.stamp { margin-top: 14px; }

@media (max-width: 1099px) {
  /* Планшет и телефон: два поля в строку, кнопка во всю ширину под ними. */
  .seo.gw-calc form.calc { grid-template-columns: 1fr 1fr; padding: 14px 14px 16px; gap: 12px; }
  .seo.gw-calc form.calc button { grid-column: 1 / -1; width: 100%; height: 48px; }
}
@media (max-width: 640px) {
  .seo.gw-calc > .lead { font-size: 15px; color: var(--ink-dim); }
  .seo.gw-calc form.calc { margin-top: 16px; }
  .seo.gw-calc .result.block { margin-top: 24px; padding-top: 20px; }
  .seo.gw-calc .result .total { font-size: 38px; margin-bottom: 12px; }
  .seo.gw-calc .result table.grid tbody th { width: auto; }
  .seo.gw-calc .result table.grid td.muted { padding-left: 12px; }
}

/* ================================================================ 6. ОШИБКА (seo/error.html) */

/* Страница-развилка: что случилось — и куда дальше. Главная кнопка — «следить», если срез
   существует, иначе «Цены»; вторые — контуром. Синие ссылки старого сайта уходят. */
.seo.gw-error { padding-top: 16px; padding-bottom: 80px; }
.seo.gw-error h1 { margin-top: 32px; max-width: 28ch; }
.seo.gw-error .lead { max-width: 60ch; color: var(--ink-dim); }
.seo.gw-error .gw-go { margin: 24px 0 0; }
.seo.gw-error .gw-exits { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.seo.gw-error:not(:has(.gw-go)) .gw-exits { margin-top: 24px; }
.seo.gw-error .gw-exits p { margin: 0; }
.seo.gw-error .gw-go a, .seo.gw-error .gw-exits a {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px;
  border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--bg);
  color: var(--ink); font-size: 15px; font-weight: 600; text-decoration: none;
}
.seo.gw-error .gw-go a, .seo.gw-error:not(:has(.gw-go)) .gw-exits p:first-child a { background: var(--ink); border-color: var(--ink); color: #fff; }
.seo.gw-error .gw-exits a:hover { border-color: var(--ink); }
.seo.gw-error .gw-go a:hover, .seo.gw-error:not(:has(.gw-go)) .gw-exits p:first-child a:hover { background: #000; }
@media (max-width: 640px) {
  .seo.gw-error h1 { margin-top: 20px; }
  .seo.gw-error .gw-go a { display: flex; width: 100%; }
  .seo.gw-error .gw-exits p { flex: 1 1 0; }
  .seo.gw-error .gw-exits a { width: 100%; }
}

/* ================================================================ 7. ТЕЛЕФОН, ОБЩЕЕ */

@media (max-width: 640px) {
  /* 118px снизу seo.css держал под плавающую панель /ceny; на страницах G её нет. */
  .seo.gw { padding-bottom: 32px; }
  .seo.gw .seo-hero-copy > .lead { font-size: 16px; }
  .seo.gw .seo-hero-copy > .why { font-size: 13.5px; }
  .seo.gw h2 { font-size: 18px; }
  .seo.gw table.grid { font-size: 14px; }
  .seo.gw table.grid th, .seo.gw table.grid td { padding: 10px 14px 10px 0; }
  .seo.gw .follow-box .btn { display: flex; width: 100%; }
}

/* ================================================================ 8. ПОСЛЕ СУДЕЙ r1 (G2)
   Судьи r1 (UX + Нино + Давид, judge/G/r1): на телефоне действия раздела не было на первом
   экране, решающие колонки таблиц /banki и /taxi стояли за краем, шапка свода /proverki
   читалась как «Проверка / Провал» в одной ячейке, у ошибки на десктопе пустовала правая
   половина. Всё ниже — только CSS: порядок в документе, тексты и ссылки как в main. */

/* --- Телефон и планшет: лист «Смотреть N» сразу под героем --- */
@media (max-width: 1099px) {
  /* Колонка действия `.gw-side` растворяется (display: contents), её лист встаёт под героя
     через order. Стоянки /banki и /banki/{slug} — после машин (Давид: до первой машины три
     экрана текста). Кнопка под карточками на телефоне снова видна: её и лист разделяют
     десять машин — это уже не дубль подряд (РЕШЕНИЕ G «скрыть дубль» остаётся для десктопа). */
  .seo.gw-banki, .seo.gw-bank, .seo.gw-taxi { display: flex; flex-direction: column; }
  .seo.gw-banki > *, .seo.gw-bank > *, .seo.gw-taxi > * { order: 2; min-width: 0; }
  .seo.gw-banki > .crumbs, .seo.gw-bank > .crumbs, .seo.gw-taxi > .crumbs,
  .seo.gw-banki > .seo-hero, .seo.gw-bank > .seo-hero, .seo.gw-taxi > .seo-hero { order: 0; }
  .seo.gw-banki > .gw-lots, .seo.gw-bank > .gw-lots { order: 3; }
  .seo.gw > .gw-side { display: contents; }
  .seo.gw > .gw-side > .follow-box { order: 1; }
  .seo.gw > .gw-side > :not(.follow-box) { order: 4; }
  .seo.gw:has(.follow-box .btn) .cars-cta .btn { display: inline-flex; }

  /* /proverki: «Смотреть машины» — сразу под вводом, до свода в 28 строк (UX K2 M5). */
  .seo.gw-proverki { display: flex; flex-direction: column; }
  .seo.gw-proverki > * { order: 2; min-width: 0; }
  .seo.gw-proverki > h1, .seo.gw-proverki > .lead, .seo.gw-proverki > .why { order: 0; }
  .seo.gw-proverki > .gw-aside { display: contents; }
  .seo.gw-proverki > .gw-aside > .cta { order: 1; margin-top: 20px; }
  .seo.gw-proverki > .gw-aside > :not(.cta) { order: 2; }
}

/* --- Телефон: решающие колонки /banki и /taxi без сдвига --- */
@media (max-width: 760px) {
  /* Таблица — сетка: thead/tbody/tr растворены, ячейки встают в колонки по grid-column, а
     `dense` кладёт каждую в первую строку, где её колонка свободна, — шапка над своими
     числами, строка за строкой. На экране 390 — имя и три решающие колонки, остальное
     листается вбок за закреплённым именем. Порядок ячеек в документе не меняется. */
  .seo.gw-banki .gw-table .scroll-x > table.grid,
  .seo.gw-taxi .gw-table .scroll-x > table.grid {
    display: grid; grid-auto-flow: row dense; width: max-content; min-width: 100%;
  }
  .seo.gw-banki .gw-table table.grid :is(thead, tbody, tr),
  .seo.gw-taxi .gw-table table.grid :is(thead, tbody, tr) { display: contents; }
  .seo.gw-banki .gw-table table.grid :is(th, td),
  .seo.gw-taxi .gw-table table.grid :is(th, td) { display: grid; align-content: center; }
  .seo.gw-banki .gw-table table.grid thead th,
  .seo.gw-taxi .gw-table table.grid thead th { align-content: end; }
  /* После r2 (без судей): колонки после имени — min-content, то есть по самому длинному
     слову подписи или числу. В r2 ширины были заданы числом, и «ровесникам», «провалом»,
     грузинские «თანატოლებთან», «მანქანა» рвались посреди слова, а «Акциз, лари» вплотную
     наезжало на «На доске» (UX P1 r2). Числа не переносятся; между колонками 16px. На ka
     четвёртая колонка уходит под сдвиг — сознательно, слова целые. */
  .seo.gw-banki .gw-table table.grid tr > :not(:first-child),
  .seo.gw-taxi .gw-table table.grid tr > :not(:first-child) { padding-left: 6px; padding-right: 10px; }
  .seo.gw-banki .gw-table table.grid td:not(:first-child),
  .seo.gw-taxi .gw-table table.grid td:not(:first-child) { white-space: nowrap; }
  /* /taxi: модель · медиана · возраст · акциз | на доске · км в год · не бензин.
     Возраст и акциз — то, ради чего страница («возраст важнее цены»). */
  .seo.gw-taxi .gw-table .scroll-x > table.grid {
    grid-template-columns: 116px repeat(6, min-content);
  }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(1) { grid-column: 1; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(3) { grid-column: 2; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(5) { grid-column: 3; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(7) { grid-column: 4; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(2) { grid-column: 5; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(6) { grid-column: 6; }
  .seo.gw-taxi .gw-table table.grid tr > :nth-child(4) { grid-column: 7; }
  /* /banki: кредитор · цена к ровесникам · с провалом · машин | медиана цены · пробега · с VIN · вид.
     Выгода и риск — первыми: ради них таблица. */
  .seo.gw-banki .gw-table .scroll-x > table.grid {
    grid-template-columns: 108px repeat(7, min-content);
  }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(1) { grid-column: 1; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(4) { grid-column: 2; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(5) { grid-column: 3; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(3) { grid-column: 4; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(7) { grid-column: 5; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(8) { grid-column: 6; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(6) { grid-column: 7; }
  .seo.gw-banki .gw-table table.grid tr > :nth-child(2) { grid-column: 8; }
  .seo.gw-banki .gw-table table.grid td:nth-child(4) { font-weight: 600; }

  /* /proverki: подпись «Проверка» над колонкой названий на телефоне скрыта визуально (для
     чтения с экрана остаётся): судьи r1 читали её как подпись первой числовой колонки.
     РЕШЕНИЕ G2 — записано в PROGRESS. Описания и знаменатель — на тон темнее (Нино). */
  .seo.gw-proverki .gw-loud .scroll-x > table.grid thead tr > :first-child {
    position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap;
  }
  .seo.gw-proverki .gw-loud thead tr { padding-top: 10px; }
}
.seo.gw-proverki .gw-loud tbody th .muted { color: var(--ink-dim); }
.seo.gw-proverki .gw-loud table.grid td.muted { color: var(--ink-dim); }

/* --- Десктоп --- */
@media (min-width: 1100px) {
  /* /banki/{slug}: лист стоянок ниже героя на ~170px — между ним и листом действия стоял
     разрыв (UX P1 bank-1440). Лист тянется до низа героя: колонка справа идёт без дыры. */
  .seo.gw-banki > .gw-lots, .seo.gw-bank > .gw-lots { align-self: stretch; }
  /* /proverki: шапка «Модель / Провалов» прилипала к абзацу над ней. */
  .seo.gw-proverki .gw-worst table.grid { margin-top: 14px; }
}

/* --- /ganbajeba --- */
/* «Сверху хранение и брокер» — тоже деньги покупателя (Нино): чернилами, а не серым. */
.seo.gw-calc .result > table + .why { color: var(--ink); }
.seo.gw-calc .result table.grid td.muted { color: var(--ink-dim); font-size: 13.5px; }
@media (max-width: 640px) {
  /* Пояснение строки (ставка, возраст) — под суммой во всю ширину, а не третьей колонкой
     шириной в слово: «Итого государству» и «Возраст 7 лет» больше не теснят друг друга. */
  .seo.gw-calc .result table.grid, .seo.gw-calc .result table.grid tbody { display: block; }
  .seo.gw-calc .result table.grid tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: baseline;
    padding: 11px 0; border-bottom: 1px solid var(--line);
  }
  .seo.gw-calc .result table.grid tr > *,
  .seo.gw-calc .result table.grid tr.sum > * { border: 0; padding: 0; width: auto; }
  .seo.gw-calc .result table.grid td.muted { grid-column: 1 / -1; padding: 3px 0 0; }
  .seo.gw-calc .result table.grid td.muted:empty { display: none; }
  .seo.gw-calc .result table.grid tr.sum { border-top: 1px solid var(--ink); border-bottom: 0; }
}

/* --- Ошибка --- */
/* Подвал — до низа окна: короткая страница оставляла под ним белую полосу (UX P1). */
body:has(> main.gw-error) { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body:has(> main.gw-error) > main.gw-error { flex: 1 0 auto; width: 100%; }
@media (min-width: 1100px) {
  /* Десктоп: одна колонка по центру (760px) вместо левой трети при пустых 900px справа,
     и все три выхода — одной строкой: главный чернилами, два контуром одной ширины. */
  /* Блок стоит по центру высоты между шапкой и подвалом: пустота делится сверху и снизу,
     а не копится 250px под кнопками. */
  .seo.gw-error {
    max-width: 760px; display: grid; grid-template-columns: max-content minmax(0, 1fr);
    align-content: center; column-gap: 10px; padding-top: 24px; padding-bottom: 24px;
  }
  .seo.gw-error > * { grid-column: 1 / -1; }
  .seo.gw-error > h1 { margin-top: 0; }
  .seo.gw-error > .gw-go { grid-column: 1; margin: 28px 0 0; }
  .seo.gw-error > .gw-go + .gw-exits { grid-column: 2; margin-top: 28px; }
  .seo.gw-error .gw-exits a { min-width: 148px; }
}