/* cfg2.css — конфигуратор ПК v2 (12.09.2026).
   Подача — как в карточке сборки из переоценки (крупные фото, спокойные
   подсказки, деньги отдельной графой), палитра — витрины (style.css). */

.c2{
  --s1:#20252f; --s2:#262c38; --s3:#2f3644; --inset:#1a1f28;
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.17);
  --ink:#eef2f8; --ink2:#b3bdcb; --ink3:#8d98a8;
  --red:#e2342f; --red-h:#f0514b; --red-soft:rgba(226,52,47,.13);
  --ok:#3ddc84; --ok-soft:rgba(61,220,132,.12);
  --warn:#ffb648; --warn-soft:rgba(255,182,72,.11);
  --info:#8f9dff; --info-soft:rgba(143,157,255,.12);
  --gold:#e7c074;
  --r1:10px; --r2:14px; --r3:18px;
  --ease:cubic-bezier(.22,.61,.36,1);
  color:var(--ink); max-width:1240px; margin:0 auto; padding:0 0 60px;
  font-size:15px; line-height:1.5;
}
.c2 *,.c2-mob *{box-sizing:border-box}
.c2 button{font:inherit}
.c2 h1,.c2 h2,.c2 h3{color:#fff;margin:0}
.c2 :focus-visible,.c2-mob :focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:6px}
.c2 .c2-pr,.c2 .c2-tot b,.c2 .c2-mval,.c2-mp{font-variant-numeric:lining-nums tabular-nums}

/* ── шапка ───────────────────────────────────────────────────────── */
.c2-test{margin:0 0 14px;padding:9px 13px;border-radius:var(--r1);font-size:12.5px;
  background:var(--warn-soft);border:1px solid rgba(255,182,72,.3);color:#ffdfa6}
.c2-test a{color:#fff;text-decoration:underline}
.c2-head{padding:6px 0 4px;max-width:760px}
.c2-head h1{font-family:'Furore','Raleway',Arial,sans-serif;font-weight:400;
  font-size:clamp(27px,4.2vw,42px);line-height:1.06;text-transform:uppercase;letter-spacing:.01em}
.c2-lead{color:var(--ink2);font-size:15.5px;margin:15px 0 0;line-height:1.55;max-width:62ch;text-wrap:pretty}
.c2-meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin:14px 0 0;color:var(--ink3);font-size:12.5px}
.c2-meta b{color:var(--ink2);font-weight:700}
.c2-meta .c2-linkbtn{color:var(--ink3);text-decoration:underline dotted;font-size:inherit}
.c2-meta .c2-linkbtn:hover{color:var(--ink)}

/* ── секции ──────────────────────────────────────────────────────── */
.c2-sec{margin-top:34px}
.c2-sech{display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap;margin:0 0 14px}
.c2-sech h2{font-size:19px;font-weight:800;letter-spacing:-.01em}
.c2-sech>span{color:var(--ink3);font-size:13px;line-height:1.4}
.c2-sw{margin-left:auto;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  color:var(--ink2);font-size:13px;white-space:nowrap}
.c2-sw input{width:16px;height:16px;accent-color:var(--red);cursor:pointer}

.c2-grid{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:26px;align-items:start;margin-top:8px}
.c2-grid>*{min-width:0}
.c2-aside{position:sticky;top:127px;display:flex;flex-direction:column;gap:14px}

/* ── пресеты ─────────────────────────────────────────────────────── */
.c2-presets{display:grid;grid-template-columns:repeat(auto-fit,minmax(198px,1fr));gap:12px}
.c2-preset{position:relative;background:var(--s1);border:1px solid var(--line);border-radius:var(--r3);
  padding:15px 15px 14px;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:7px;
  color:inherit;transition:border-color .18s var(--ease),background .18s var(--ease),transform .18s var(--ease)}
.c2-preset:hover{border-color:var(--line2);background:var(--s2);transform:translateY(-2px)}
.c2-preset.on{border-color:var(--red);background:linear-gradient(180deg,var(--red-soft),transparent 62%)}
.c2-preset.on::after{content:'выбрано';position:absolute;top:12px;right:13px;font-size:10px;
  letter-spacing:.07em;text-transform:uppercase;color:var(--red);font-weight:800}
.c2-preset h3{font-size:15px;font-weight:800;padding-right:56px;line-height:1.2}
.c2-preset .sub{color:var(--ink2);font-size:12.5px;line-height:1.45}
.c2-preset .fps{color:var(--ink3);font-size:12px;line-height:1.4;flex:1}
.c2-preset .pp{font-size:21px;font-weight:800;color:#fff;letter-spacing:-.02em;margin-top:2px}
.c2-preset .pb{font-size:11.5px;color:var(--ink3);display:flex;align-items:center;gap:6px}
.c2-preset .pb i{width:6px;height:6px;border-radius:50%;background:var(--ok);flex:0 0 6px}
.c2-preset .pb.none i{background:#5d6774}

/* ── под игру ────────────────────────────────────────────────────── */
.c2-games{margin:16px 0 0;padding:15px 17px 14px;border:1px solid var(--line);
  border-radius:var(--r3);background:var(--s1)}
.c2-gh{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;margin-bottom:11px}
.c2-gh b{color:#fff;font-size:14.5px;font-weight:800;white-space:nowrap}
.c2-gh span{color:var(--ink3);font-size:12.5px;line-height:1.4}
.c2-chips{display:flex;gap:8px;flex-wrap:wrap}
.c2-game{display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;
  border:1px solid var(--line2);background:var(--inset);color:var(--ink);font:inherit;font-size:13px;
  font-weight:650;padding:7px 15px;border-radius:999px;cursor:pointer;min-height:44px;text-align:left;
  transition:border-color .18s var(--ease),background .18s var(--ease)}
.c2-game:hover{background:var(--s3)}
.c2-game em{font-style:normal;font-size:11px;font-weight:500;color:var(--ink3);line-height:1.2}
.c2-game.on{border-color:var(--red);background:var(--red-soft);color:#fff}
.c2-game.on em{color:#ff9d95}
.c2-gpanel{display:none;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.c2-gpanel.on{display:block}
.c2-gtiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.c2-gopt{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0;text-align:left;
  border:1px solid var(--line2);border-radius:var(--r2);background:var(--inset);color:inherit;font:inherit;
  padding:12px 13px;cursor:pointer;transition:border-color .18s var(--ease),background .18s var(--ease)}
.c2-gopt:hover{background:var(--s2)}
.c2-gopt.on{border-color:var(--red);background:linear-gradient(180deg,var(--red-soft),transparent 72%),var(--inset)}
.c2-gopt .gr{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.c2-gopt.on .gr{color:var(--red)}
.c2-gopt b{font-size:13.5px;color:#fff;line-height:1.3}
.c2-gopt em{font-style:normal;font-size:11.5px;color:var(--ink2);line-height:1.4}
.c2-gopt .gp{margin-top:auto;padding-top:6px;font-size:17px;font-weight:800;color:#fff;letter-spacing:-.02em}
.c2-gopt .gd{font-size:11.5px;font-weight:650;color:var(--ink3);margin-left:7px}
.c2-gnote{margin:12px 0 0;color:var(--ink3);font-size:12.5px;line-height:1.45}

/* ── стенд: как будет выглядеть ──────────────────────────────────── */
.c2-stage{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:20px;
  background:radial-gradient(120% 90% at 50% 0%,#242b36 0%,var(--inset) 72%);
  border:1px solid var(--line);border-radius:var(--r3);padding:20px}
.c2-hero{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.c2-heroimg{position:relative;width:100%;height:280px;display:flex;align-items:flex-end;justify-content:center}
.c2-heroimg img{max-width:100%;max-height:100%;object-fit:contain;
  filter:drop-shadow(0 22px 26px rgba(0,0,0,.55))}
/* Фон вырезать удалось не у всех фото. Запасной вариант — обычный снимок на
   белой плитке: так он выглядит намеренно, а не обрезанным прямоугольником. */
.c2-heroimg img.plain{background:#fff;border-radius:12px;padding:8px;filter:none}
.c2-heroimg .ph{width:130px;height:200px;border:2px dashed var(--line2);border-radius:12px;
  display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:11.5px;
  text-align:center;padding:10px;line-height:1.35;align-self:center}
.c2-heroimg::after{content:'';position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);
  width:72%;height:16px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent)}
.c2-herot{text-align:center;min-width:0}
.c2-herot b{display:block;color:#fff;font-size:13.5px;line-height:1.35;font-weight:700;overflow-wrap:anywhere}
.c2-herot span{display:block;color:var(--ink3);font-size:12px;margin-top:4px}
.c2-cut{min-width:0}
.c2-cut h3{font-size:12px;font-weight:800;color:var(--ink3);margin-bottom:10px}
.c2-cut svg{width:100%;height:auto;display:block;overflow:visible}
.c2-gauges{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.c2-gauge{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:11px;align-items:center;font-size:12.5px}
.c2-gauge .gl{color:var(--ink3)}
.c2-gauge .gb{position:relative;height:8px;border-radius:999px;background:var(--inset);
  border:1px solid var(--line);overflow:hidden}
.c2-gauge .gf{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--ok)}
.c2-gauge.warn .gf{background:var(--warn)} .c2-gauge.bad .gf{background:var(--red)}
.c2-gauge .gv{color:var(--ink2);white-space:nowrap;font-size:12px}
.c2-gauge.bad .gv{color:#ff9d95} .c2-gauge.warn .gv{color:#ffdfa6}
.c2-strip{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;
  padding-top:16px;border-top:1px solid var(--line)}
.c2-chip{width:78px;text-align:center}
.c2-chip .im{height:62px;display:flex;align-items:center;justify-content:center;margin-bottom:5px}
.c2-chip img{max-width:100%;max-height:100%;object-fit:contain}
.c2-chip .im img.plain{background:#fff;border-radius:7px;padding:3px}
.c2-chip span{display:block;font-size:10.5px;color:var(--ink3);line-height:1.25}
@media(max-width:860px){
  .c2-stage{grid-template-columns:1fr;padding:16px}
  .c2-heroimg{height:220px}
}

/* ── слоты ───────────────────────────────────────────────────────── */
.c2-slots{display:flex;flex-direction:column}
.c2-slot{display:grid;grid-template-columns:78px minmax(0,1fr) auto;gap:15px;align-items:start;
  padding:14px 0;border-top:1px solid var(--line)}
.c2-slot:first-child{border-top:none}
.c2-slot.bad{background:linear-gradient(90deg,var(--red-soft),transparent 70%);
  box-shadow:inset 0 0 0 1px rgba(226,52,47,.3);border-radius:var(--r2);padding-left:10px;padding-right:10px}
.c2-th{width:78px;height:78px;border-radius:var(--r2);background:var(--inset);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--ink3)}
.c2-th img{width:100%;height:100%;object-fit:contain;padding:5px}
.c2-th img.plain{background:#fff}
/* Запасной силуэт вместо фото — это <svg> без явных размеров, а такой тянется
   во всю ширину контейнера. Поэтому размер задаём везде, где он может появиться. */
.c2-th svg{width:26px;height:26px;color:var(--ink3)}
.c2-chip .im svg{width:30px;height:30px;color:var(--ink3)}
.c2-cand .ci svg{width:22px;height:22px;color:var(--ink3)}
.c2-btn svg{width:16px;height:16px;flex:0 0 auto}
.c2-sm{min-width:0}
.c2-cat{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.c2-cat em{font-style:normal;text-transform:none;letter-spacing:0;opacity:.75}
.c2-nm{font-size:14.5px;color:#fff;line-height:1.35;margin-top:3px;overflow-wrap:anywhere}
.c2-nm.empty{color:var(--ink3)}
.c2-sp{font-size:12.5px;color:var(--ink3);margin-top:4px;line-height:1.4}
.c2-src{font-size:11.5px;color:var(--ink3);margin-top:4px}
.c2-rt{display:flex;flex-direction:column;align-items:flex-end;gap:8px;text-align:right}
.c2-pr{font-size:17px;font-weight:800;color:#fff;letter-spacing:-.01em;white-space:nowrap}
.c2-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.c2-badge{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:650;padding:4px 9px;
  border-radius:999px;white-space:nowrap;background:var(--inset);border:1px solid var(--line);color:var(--ink3)}
.c2-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:#69737f;flex:0 0 6px}
.c2-badge.in{color:var(--ok);background:var(--ok-soft);border-color:rgba(61,220,132,.3)}
.c2-badge.in::before{background:var(--ok)}
.c2-qty{display:inline-flex;align-items:center;gap:5px;background:var(--s2);border:1px solid var(--line);
  border-radius:9px;padding:3px 5px}
.c2-qty button{background:none;border:none;color:var(--ink3);font-size:16px;cursor:pointer;width:22px;line-height:1}
.c2-qty button:hover{color:#fff}
.c2-qty span{font-size:12px;min-width:36px;text-align:center;color:var(--ink)}

/* ── кнопки ──────────────────────────────────────────────────────── */
.c2-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--s2);
  color:var(--ink);border:1px solid var(--line2);border-radius:var(--r1);padding:9px 14px;font-size:13px;
  font-weight:650;cursor:pointer;white-space:nowrap;min-height:40px;
  transition:background .16s var(--ease),border-color .16s var(--ease),color .16s var(--ease)}
.c2-btn:hover{background:var(--s3)}
.c2-btn.ghost{background:transparent}
.c2-btn.ghost:hover{background:var(--s2)}
.c2-btn.wide{width:100%;padding:13px;font-size:14px;min-height:48px}
.c2-btn.solid{background:linear-gradient(180deg,var(--red-h),#b91f1c);border:none;color:#fff;font-weight:750;
  box-shadow:0 6px 18px rgba(226,52,47,.22)}
.c2-btn.solid:hover{filter:brightness(1.07)}
.c2-btn[disabled]{opacity:.5;cursor:not-allowed;filter:none;box-shadow:none}
.c2-btn.solid[disabled]{background:var(--s2);color:var(--ink3)}

/* ── подбор замены (разворачивается прямо в списке, не модалкой) ─── */
.c2-pick{grid-column:1/-1;margin-top:12px;border:1px solid var(--line2);border-radius:var(--r2);
  background:var(--inset);padding:13px}
.c2-pickbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:11px}
.c2-pick input[type=search]{flex:1 1 210px;background:var(--s2);border:1px solid var(--line);color:var(--ink);
  border-radius:9px;padding:9px 12px;font-size:13.5px;font-family:inherit;outline:none;min-width:0}
.c2-pick input[type=search]::placeholder{color:var(--ink3)}
.c2-pick input[type=search]:focus{border-color:var(--red)}
.c2-seg{display:flex;background:var(--s2);border:1px solid var(--line);border-radius:9px;overflow:hidden}
.c2-seg button{background:none;border:none;color:var(--ink3);font-size:12.5px;padding:8px 12px;cursor:pointer;
  font-family:inherit;font-weight:650}
.c2-seg button[aria-pressed="true"]{background:var(--s3);color:#fff}
.c2-chk{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink2);cursor:pointer}
.c2-chk input{width:15px;height:15px;accent-color:var(--red)}
.c2-cands{display:grid;gap:8px;max-height:420px;overflow-y:auto;padding-right:2px}
.c2-cand{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:11px;align-items:center;
  background:var(--s1);border:1px solid var(--line);border-radius:var(--r1);padding:8px 10px;cursor:pointer;
  text-align:left;color:inherit;font-family:inherit;width:100%}
.c2-cand:hover{border-color:var(--red)}
.c2-cand.no{opacity:.62}
.c2-cand .ci{width:52px;height:52px;border-radius:9px;background:var(--inset);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.c2-cand .ci img{width:100%;height:100%;object-fit:contain;padding:3px}
.c2-cand .ci img.plain{background:#fff}
/* Название, характеристики и причина несовместимости — три строки друг под
   другом: без display:block инлайновые span склеиваются в одну строку. */
.c2-cand>span{min-width:0}
.c2-cand .cn{display:block;font-size:13px;color:#fff;line-height:1.35;overflow-wrap:anywhere}
.c2-cand .cs{display:block;font-size:11.5px;color:var(--ink3);margin-top:3px;line-height:1.35}
.c2-cand .cw{display:block;font-size:11.5px;color:#ffb0a8;margin-top:3px;line-height:1.35}
.c2-cand .cp{font-size:14px;font-weight:800;color:#fff;white-space:nowrap}
.c2-none{padding:14px;color:var(--ink3);font-size:13px;line-height:1.5}

/* ── деньги ──────────────────────────────────────────────────────── */
.c2-money{background:var(--s1);border:1px solid var(--line);border-radius:var(--r3);padding:16px}
.c2-mh{font-size:12px;font-weight:800;color:var(--ink3);margin-bottom:12px;display:flex;
  justify-content:space-between;gap:10px;align-items:baseline}
.c2-mh span{font-weight:600;font-size:11.5px}
.c2-mgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.c2-mcell{background:var(--inset);border:1px solid var(--line);border-radius:var(--r2);padding:11px 12px}
.c2-mcell .ml{font-size:11.5px;color:var(--ink3);line-height:1.3;min-height:29px}
.c2-mval{font-size:19px;font-weight:800;color:#fff;letter-spacing:-.02em;margin-top:5px}
.c2-mcell.stock .c2-mval{color:var(--ok)}
.c2-mcell.order .c2-mval{color:var(--gold)}
.c2-mcell .mn{font-size:11px;color:var(--ink3);margin-top:4px;line-height:1.3}
.c2-rows{margin-top:13px;display:flex;flex-direction:column;gap:7px}
.c2-row{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink2)}
.c2-row b{color:var(--ink);font-weight:650}
.c2-opt{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);cursor:pointer}
.c2-opt input{width:16px;height:16px;accent-color:var(--red)}
.c2-opt .hint{color:var(--ink3);font-size:11.5px}
.c2-tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:13px;
  padding-top:13px;border-top:1px solid var(--line2);font-size:14px;color:var(--ink2)}
.c2-tot b{font-size:25px;font-weight:800;color:#fff;letter-spacing:-.02em}
.c2-when{margin-top:10px;padding:9px 11px;border-radius:var(--r1);font-size:12.5px;line-height:1.45;
  background:var(--info-soft);border:1px solid rgba(143,157,255,.26);color:#c9d1ff}

/* ── совместимость ───────────────────────────────────────────────── */
.c2-checks{display:flex;flex-direction:column;gap:1px;border:1px solid var(--line);
  border-radius:var(--r2);overflow:hidden}
.c2-ck{display:flex;gap:10px;padding:11px 13px;font-size:12.5px;line-height:1.45;background:var(--s1)}
.c2-ck b{color:#fff}
.c2-ck .ic{flex:0 0 auto;margin-top:1px}
.c2-ck .ic svg{width:16px;height:16px}
.c2-ck.err{background:rgba(226,52,47,.12);color:#ffc9c9}
.c2-ck.warn{background:var(--warn-soft);color:#ffdfa6}
.c2-ck.info,.c2-ck.unk{color:var(--ink2)}
.c2-ck.ok{background:var(--ok-soft);color:#b6f2d2}

/* ── заявка ──────────────────────────────────────────────────────── */
.c2-order{background:var(--s1);border:1px solid var(--line);border-radius:var(--r3);padding:16px;
  display:flex;flex-direction:column;gap:10px}
.c2-lead{display:none;flex-direction:column;gap:9px}
.c2-lead.on{display:flex}
.c2-lead input{background:var(--inset);border:1px solid var(--line);color:var(--ink);border-radius:var(--r1);
  padding:12px 13px;font-size:14px;font-family:inherit;outline:none}
.c2-lead input::placeholder{color:var(--ink3)}
.c2-lead input:focus{border-color:var(--red)}
.c2-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.c2-fine{margin:0;font-size:11.5px;color:var(--ink3);line-height:1.45}
.c2-msg{display:none;font-size:13px;line-height:1.45;padding:10px 12px;border-radius:var(--r1)}
.c2-msg.on{display:block}
.c2-msg.ok{background:var(--ok-soft);color:#b6f2d2;border:1px solid rgba(61,220,132,.3)}
.c2-msg.err{background:rgba(226,52,47,.12);color:#ffc9c9;border:1px solid rgba(226,52,47,.3)}

/* ── мобильная панель ────────────────────────────────────────────── */
.c2-mob{position:fixed;left:0;right:0;bottom:0;z-index:9000;display:none;align-items:center;gap:12px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(19,22,28,.96);
  backdrop-filter:blur(10px);border-top:1px solid var(--line2);
  --ink:#eef2f8; --ink3:#8d98a8; --s2:#262c38; --s3:#2f3644; --line2:rgba(255,255,255,.17);
  --red-h:#f0514b; --r1:10px; --ease:cubic-bezier(.22,.61,.36,1); color:#eef2f8}
.c2-mob .c2-mp{font-size:18px;font-weight:800;color:#fff;line-height:1.1}
.c2-mob .c2-mn{font-size:11.5px;color:#8d98a8;margin-top:2px}
.c2-mob .c2-btn{margin-left:auto}

@media(max-width:1000px){
  .c2-grid{grid-template-columns:1fr;gap:20px}
  .c2-aside{position:static}  /* v3.1: без order:-1 — сначала пресеты, деньги после состава */
}
@media(max-width:700px){
  .c2{font-size:14.5px;padding-bottom:96px}
  .c2-sec{margin-top:26px}
  .c2-gtiers{grid-template-columns:1fr}
  .c2-slot{grid-template-columns:60px minmax(0,1fr);gap:12px}
  .c2-th{width:60px;height:60px}
  .c2-rt{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;
    text-align:left;flex-wrap:wrap}
  .c2-mob[hidden]{display:none}
  .c2-mob{display:flex}
  .c2-mgrid{grid-template-columns:1fr 1fr}
  .c2-gauge{grid-template-columns:96px minmax(0,1fr);row-gap:4px}
  .c2-gauge .gv{grid-column:2}
}
@media(max-width:420px){
  .c2-mgrid{grid-template-columns:1fr}
  .c2-chip{width:66px}
}
@media(prefers-reduced-motion:reduce){
  .c2 *{transition:none!important;animation:none!important}
}


/* ══ этап 2 (13.09.2026): готовые ПК, галерея, 3D, поделиться, дешевле ══ */
.c2-noan{position:fixed;left:12px;bottom:12px;z-index:9100;background:#2a1b1b;color:#ffdfa6;font-size:11.5px;
  padding:6px 10px;border-radius:8px;border:1px solid rgba(255,182,72,.3)}
.c2-banner{margin:16px 0 0;padding:12px 15px;border-radius:var(--r2);font-size:13.5px;line-height:1.5;
  background:var(--info-soft);border:1px solid rgba(143,157,255,.3);color:#dfe3ff}
.c2-banner b{color:#fff}
.c2-banner[hidden]{display:none}

/* переключатель Схема / 3D в заголовке секции */
.c2-viewseg{margin-left:auto}
.c2-viewseg[hidden]{display:none}
.c2-3d{position:relative;height:380px;border-radius:var(--r2);background:radial-gradient(90% 80% at 50% 40%,#2a3140 0%,#1a1f28 80%);
  border:1px solid var(--line);overflow:hidden;touch-action:none}
.c2-3d canvas{display:block;width:100%!important;height:100%!important}
.c2-3dload{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:13px}
.c2-3dhint{margin:10px 0 0;color:var(--ink3);font-size:12px;line-height:1.4}

/* галерея живых сборок */
.c2-gal{margin-top:14px;padding:14px 16px 12px;border:1px solid var(--line);border-radius:var(--r3);background:var(--s1)}
.c2-gal[hidden]{display:none}
.c2-galh{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;margin-bottom:10px}
.c2-galh b{color:#fff;font-size:14px;font-weight:800}
.c2-galh span{color:var(--ink3);font-size:12.5px}
.c2-galrow{display:flex;gap:9px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.c2-galph{flex:0 0 138px;height:138px;border-radius:var(--r1);overflow:hidden;border:1px solid var(--line2);background:var(--inset);
  padding:0;cursor:zoom-in;scroll-snap-align:start;transition:border-color .16s var(--ease),transform .16s var(--ease)}
.c2-galph:hover{border-color:var(--red);transform:translateY(-1px)}
.c2-galph img{width:100%;height:100%;object-fit:cover;display:block}
.c2-dlg{border:none;border-radius:var(--r3);background:#151920;color:var(--ink);padding:14px;max-width:min(92vw,980px);
  box-shadow:0 30px 80px rgba(0,0,0,.6)}
.c2-dlg::backdrop{background:rgba(6,8,12,.78);backdrop-filter:blur(3px)}
.c2-dlg img{display:block;max-width:100%;max-height:78vh;border-radius:var(--r1);margin:0 auto}
.c2-dlg p{margin:10px 0 0;text-align:center;color:var(--ink2);font-size:13px}
.c2-dlg-x{position:absolute;top:8px;right:8px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line2);
  background:rgba(0,0,0,.55);color:#fff;font-size:22px;line-height:1;cursor:pointer}

/* готовые ПК в наличии */
.c2-ready{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.c2-rpc{display:grid;grid-template-columns:118px minmax(0,1fr);gap:14px;padding:13px;border:1px solid var(--line);
  border-radius:var(--r3);background:var(--s1);min-width:0}
.c2-rpim{width:118px;height:118px;border-radius:var(--r2);overflow:hidden;background:var(--inset);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink3)}
.c2-rpim img{width:100%;height:100%;object-fit:cover;display:block}
.c2-rpim svg{width:30px;height:30px}
.c2-rpb{min-width:0;display:flex;flex-direction:column;gap:5px}
.c2-rpb .c2-nm{font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c2-rpb .c2-sp{margin-top:0}
.c2-rpf{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-top:2px}
.c2-rpb .c2-acts{justify-content:flex-start;margin-top:4px}
.c2-ready>.c2-btn.wide{grid-column:1/-1}

/* инструменты в правой колонке: поделиться, дешевле */
.c2-tools{display:flex;flex-direction:column;gap:10px}
.c2-tools>[hidden]{display:none}
.c2-share,.c2-cheap{background:var(--s1);border:1px solid var(--line);border-radius:var(--r3);padding:14px}
.c2-shh{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.c2-shh b{color:#fff;font-size:13.5px}
.c2-shh span{color:var(--ink3);font-size:12px}
.c2-shurl{display:flex;gap:7px}
.c2-shurl input{flex:1;min-width:0;background:var(--inset);border:1px solid var(--line);color:var(--ink2);border-radius:var(--r1);
  padding:9px 11px;font-size:12.5px;font-family:inherit}
.c2-shrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:7px;margin-top:10px}
.c2-shrow .c2-btn{padding:9px 6px;text-decoration:none;font-size:12.5px}
.c2-sh-vk{border-color:rgba(7,111,255,.45)} .c2-sh-tg{border-color:rgba(42,171,238,.45)}
.c2-sh-max{border-color:rgba(130,80,255,.45)} .c2-sh-wa{border-color:rgba(37,211,102,.45)}
.c2-share .c2-fine{margin-top:10px}
.c2-linkbtn{background:none;border:none;color:inherit;text-decoration:underline;font:inherit;cursor:pointer;padding:0}
.c2-cplist{display:flex;flex-direction:column}
.c2-cprow{padding:9px 0;border-top:1px solid var(--line);font-size:12.5px;line-height:1.4}
.c2-cprow:first-child{border-top:none;padding-top:0}
.c2-cprow .hd{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-bottom:3px}
.c2-cprow .hd span{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.c2-cprow .d{white-space:nowrap;font-weight:800}
.c2-cprow .d.dn{color:var(--ok)} .c2-cprow .d.up{color:var(--warn)}
.c2-cprow .was{color:var(--ink3);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.35)}
.c2-cprow .now{color:#fff}
.c2-cprow .cw{color:#ffb0a8;font-size:11.5px;margin-top:2px}
.c2-cprow .cok{color:var(--ok);font-size:11.5px;margin-top:2px}
.c2-cprow .mut{color:var(--ink3)}
.c2-cheapsum{display:flex;flex-direction:column;gap:3px;margin:12px 0;font-size:13px;color:var(--ink2)}
.c2-cheapsum b{color:#fff}
.c2-gadj{color:#dfe3ff;background:var(--info-soft);border:1px solid rgba(143,157,255,.26);border-radius:var(--r1);padding:9px 11px}

/* компактная врезка на главном сайте */
.c2-embed .c2-meta{margin-top:6px}
.c2-embed .c2-sec{margin-top:22px}
.c2-embed .c2-grid{gap:18px}
.c2-embed .c2-aside{top:8px}
.c2-embed .c2-3d{height:300px}

@media(max-width:700px){
  .c2-ready{grid-template-columns:1fr}
  .c2-rpc{grid-template-columns:92px minmax(0,1fr);gap:11px}
  .c2-rpim{width:92px;height:92px}
  .c2-3d{height:300px}
  .c2-galph{flex-basis:118px;height:118px}
  .c2-viewseg{margin-left:0}
}

/* Плавающая кнопка «ВКонтакте» витрины (base.html) перекрывала «Заявка» в мобильной
   панели конфигуратора — поднимаем её над панелью только на этой странице. */
@media(max-width:700px){
  #btc-vk-chat{bottom:86px!important}
}

/* страховка от горизонтальной прокрутки на узких экранах: длинные строки переносим */
.c2-main,.c2-aside,.c2-tools,.c2-money,.c2-order{min-width:0}
.c2-msg,.c2-when,.c2-banner,.c2-cprow,.c2-share .c2-fine,.c2-ck span:last-child{overflow-wrap:anywhere}