/* Стили карточки предложения (site/catalog/offer.html).
   Вынесены из инлайн-<style> 22.09.2026, req cs-4409d5677f: пререндер 359 адресов держал бы
   копию этих байт на каждой странице. Порядок подключения СОХРАНЁН — <link> стоит ровно там,
   где стоял <style> (после запечённой шапки, до разметки карточки), поэтому каскад не поехал.
   Владелец файла — @па-предложения, как и сам offer.html. */
/* E8.32 (owner 03.08 #1631): вторичная кнопка «Рассчитать доставку» — outline, чтобы не соперничать
   по яркости с основной лаймовой «Зарезервировать». Стиль page-specific (offer.html), вне общего
   footer/header-фрагмента и вне catalog.css — чтобы не разошёлся shared-контур и не было гонки. */
.btn-cta-outline{background:transparent;color:var(--lime,#CCFF00);border:1.5px solid var(--lime,#CCFF00);
  font-weight:700;box-shadow:none}
.btn-cta-outline:hover{background:rgba(204,255,0,.10);color:var(--lime,#CCFF00);transform:translateY(-1px)}

/* E8.33 (owner #1866 п.2, раздано @па-админ req cs-6c29b1e31e): «Этапы сделки» на карточке лота.
   Стиль page-specific (offer.html) — как .btn-cta-outline выше: catalog.css общий (зона @па-админ),
   правку туда надо запрашивать, а свой префикс .pgdf- ни с чем в общем CSS не пересекается. */
.pgdf-sub{color:var(--muted,#A0A0AE);font-size:14px;line-height:1.6;margin:0 0 18px}
.pgdf-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.pgdf-step{background:rgba(255,255,255,.03);border:1px solid var(--line,rgba(255,255,255,.08));border-radius:12px;padding:14px 12px}
.pgdf-step.is-now{border-color:var(--lime,#CCFF00);background:rgba(204,255,0,.06)}
.pgdf-ic{width:42px;height:42px;border-radius:50%;background:rgba(204,255,0,.07);border:1px solid rgba(204,255,0,.25);display:flex;align-items:center;justify-content:center;color:var(--lime,#CCFF00);margin-bottom:10px}
.pgdf-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pgdf-now{display:inline-block;background:var(--lime,#CCFF00);color:#08080D;font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:999px;margin-bottom:7px}
.pgdf-num{font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-2,#6E6B82)}
.pgdf-lbl{font-size:14px;font-weight:600;color:#fff;line-height:1.3;margin:3px 0 7px}
.pgdf-you{font-size:12.5px;line-height:1.5;color:var(--muted,#A0A0AE)}
.pgdf-you b{color:#fff}
.pgdf-you abbr{text-decoration:none;border-bottom:1px dotted var(--muted-2,#6E6B82);cursor:help}
.pgdf-more{margin-top:16px;font-size:14px;color:var(--muted,#A0A0AE)}
.pgdf-more a{color:var(--lime,#CCFF00);text-decoration:none}
.pgdf-more a:hover{text-decoration:underline}
@media(max-width:1000px){.pgdf-flow{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.pgdf-flow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.pgdf-flow{grid-template-columns:1fr}}

/* #122.4 (правка Антона B2, решение владельца 25.08): плитки этапов РАСКРЫВАЮТСЯ. Разметка плитки
   стала <details>/<summary>, поэтому свёрнутый вид оставлен прежним (те же .pgdf-* классы внутри
   summary), а свои стили добавлены только на маркер, на подсказку «подробнее» и на раскрытое
   состояние. Раскрытая плитка занимает всю ширину ряда (grid-column:1/-1) — в колонке шириной 1/6
   канон-текст этапа читать невозможно. Открыт всегда один этап (аккордеон, bindDealFlow). */
.pgdf-step>summary{list-style:none;cursor:pointer;display:block}
.pgdf-step>summary::-webkit-details-marker{display:none}
.pgdf-step>summary:focus-visible{outline:2px solid var(--lime,#CCFF00);outline-offset:2px}
.pgdf-step[open]{grid-column:1/-1;background:rgba(255,255,255,.05)}
.pgdf-tog{margin-top:9px;font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--lime,#CCFF00)}
.pgdf-tog::after{content:' \25BE'}
.pgdf-step[open] .pgdf-tog::after{content:' \25B4'}
.pgdf-bd{margin-top:12px;padding-top:12px;border-top:1px solid var(--line,rgba(255,255,255,.08));font-size:14px;line-height:1.65;color:var(--muted,#A0A0AE);max-width:900px}
.pgdf-bd-h{font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:15px;color:#fff;margin:0 0 8px}
.pgdf-bd>div{margin:0 0 9px}
.pgdf-bd b{color:#fff}
.pgdf-bd abbr{text-decoration:none;border-bottom:1px dotted var(--muted-2,#6E6B82);cursor:help}
.pgdf-bd ul.proc-check{margin:7px 0 0;padding-left:20px}
.pgdf-bd ul.proc-check li{margin:0 0 4px}

/* #122.4 (правка Антона E1): подпись под ценой в «похожих» — чтобы цифра никогда не оставалась
   без ответа на вопрос «это цена ЧЕГО». Свой префикс .pgsim-, общий catalog.css не трогаем. */
.pgsim-note{font-size:11.5px;line-height:1.35;color:var(--muted-2,#6E6B82);margin:2px 0 0}

/* #122.5 (правки Антона): галерею листают ПАЛЬЦЕМ, и каждый кадр показан ОДИН раз.
   Свой префикс .pgg-, общий catalog.css (зона @па-админ) не трогаем.
   touch-action:pan-y — ключевая строка: вертикальный скролл страницы остаётся браузеру,
   горизонтальный жест забираем себе (без неё телефон «уводит» страницу вместо листания). */
.pgg-swipe{touch-action:pan-y}
.pgg-swipe img{will-change:transform}
.pgg-count{position:absolute;right:8px;bottom:8px;z-index:2;background:rgba(8,8,13,.72);color:#fff;
  font-family:var(--head,'Barlow',sans-serif);font-weight:700;font-size:12px;letter-spacing:.04em;
  padding:3px 9px;border-radius:999px;pointer-events:none}
.pgg-hint{display:none;font-size:12.5px;line-height:1.4;color:var(--muted-2,#6E6B82);margin:6px 0 0}
@media (hover:none),(max-width:700px){.pgg-hint{display:block}}
.lightbox-overlay img{touch-action:pan-y}
.lightbox-nav[disabled]{opacity:.22;pointer-events:none}

/* #122.11 (правки Антона): видео поставщика ССЫЛКАМИ рядом с фото (решение владельца 25.08 —
   ссылка, не встроенный плеер) и блок «Состояние» с честной подписью про ДТП.
   Свои префиксы .pgv- / .pgcond-, общий catalog.css (зона @па-админ) не трогаем. */
.pgv-box{margin:10px 0 4px;padding:10px 12px;background:rgba(255,255,255,.03);
  border:1px solid var(--line,rgba(255,255,255,.08));border-radius:10px}
.pgv-h{font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted-2,#6E6B82);margin:0 0 8px}
.pgv-links{display:flex;flex-wrap:wrap;gap:7px}
.pgv-link{display:inline-flex;align-items:center;gap:6px;background:rgba(204,255,0,.07);
  border:1px solid rgba(204,255,0,.28);color:var(--lime,#CCFF00);border-radius:999px;
  padding:5px 12px;font-size:13px;text-decoration:none;line-height:1.3}
.pgv-link:hover{background:rgba(204,255,0,.14)}
.pgv-link::before{content:'▶';font-size:9px;opacity:.85}
.pgv-note{font-size:11.5px;line-height:1.45;color:var(--muted-2,#6E6B82);margin:8px 0 0}
/* cs-cc4a305f5f (18.09): ВСТРОЕННЫЙ ПЛЕЕР — В ДОПОЛНЕНИЕ к ссылкам, не вместо них. Ролики
   поставщика сняты вертикально (720x1280), поэтому ширина ограничена: без max-width плеер
   занял бы всю колонку и ушёл на два экрана в высоту. object-fit:contain — чтобы горизонтальный
   ролик не обрезался. .pgv-noplay прячет плеер, если браузер не осилил ни один source: блок
   в этом случае снова становится просто ссылками (страховка, а не пустая чёрная рамка). */
.pgv-player{margin:0 0 10px}
.pgv-video{display:block;width:100%;max-width:340px;max-height:62vh;height:auto;background:#000;
  border:1px solid var(--line,rgba(255,255,255,.08));border-radius:10px;object-fit:contain}
.pgv-cap{font-size:11.5px;line-height:1.45;color:var(--muted-2,#6E6B82);margin:6px 0 0}
.pgv-noplay .pgv-player{display:none}

.pgcond-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.pgcond-item{background:rgba(255,255,255,.03);border:1px solid var(--line,rgba(255,255,255,.08));
  border-radius:12px;padding:13px 14px}
.pgcond-h{font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted-2,#6E6B82);margin:0 0 7px}
.pgcond-v{font-size:14.5px;line-height:1.45;color:#fff}
.pgcond-note{font-size:12.5px;line-height:1.5;color:var(--muted,#A0A0AE);margin:7px 0 0}
/* Подпись основания возраста — под таблицей ТТХ, там же, где стоит сама строка. */
.pgprov-note{font-size:12px;line-height:1.5;color:var(--muted-2,#6E6B82);margin:8px 0 0}

/* #122.7 (решение владельца 25.08): лот, который уже под авансом, НЕ прячем — второй клиент
   видит пометку «Зарезервирована», а кнопки резерва не получает. Янтарь, а не лайм: это
   статус-предупреждение, а не призыв к действию, и он не должен спорить с CTA соседних блоков.
   Свой префикс .pgrs-, общий catalog.css (зона @па-админ) не трогаем. */
.pgrs-badge{display:none;align-items:center;gap:7px;background:rgba(255,176,32,.10);
  border:1px solid rgba(255,176,32,.45);color:#ffb020;border-radius:999px;
  font-family:var(--head,'Barlow',sans-serif);font-weight:800;font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;margin:10px 0 2px}
.pgrs-badge.is-on{display:inline-flex}
.pgrs-badge::before{content:'';width:7px;height:7px;border-radius:50%;background:#ffb020;flex:none}
/* Недоступная кнопка резерва: гасим её из лаймовой CTA в нейтральную рамку. Прежний вид давал
   тот же яркий призыв с opacity .6 — он читался как «кнопка просто подгружается». */
.btn-cta-lg.is-reserved,.btn-cta-lg.is-reserved:hover{background:transparent;color:var(--muted,#A0A0AE);
  border:1.5px solid var(--line,rgba(255,255,255,.18));box-shadow:none;opacity:1;
  cursor:not-allowed;transform:none}
/* Правка Антона I2: под пометкой занятого лота второй клиент получает выход — заявку. Кнопка
   НЕ лаймовая: главная CTA на этом лоте недоступна, и второй яркий призыв рядом читался бы как
   «всё-таки можно забронировать». Скромная рамка = «встать в очередь», а не «купить». */
.pgrs-alt-lead{display:inline-block;margin:8px 0 0;padding:7px 14px;border-radius:999px;
  background:transparent;color:var(--ink,#fff);border:1.5px solid rgba(255,176,32,.55);
  font:600 13px/1.3 system-ui,sans-serif;cursor:pointer}
.pgrs-alt-lead:hover{border-color:#ffb020;background:rgba(255,176,32,.10)}