/* Калькулятор стоимости + помощник (calc.js) */
.cx-fab,.cx{--cx-acc:#e8b878;--cx-acc-2:#f3cf9a;--cx-bg:#141210;--cx-card:#1a1815;--cx-field:#100f0d;--cx-line:#2d2a25;--cx-line-2:#433e36}

/* кнопка-триггер */
.cx-fab{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:12px;padding:8px 20px 8px 8px;border-radius:99px;border:1px solid rgba(232,184,120,.32);background:rgba(20,18,16,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);text-align:left;box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 22px 44px -18px #000;transition:transform .35s cubic-bezier(.3,1.3,.4,1),border-color .3s,bottom .4s,opacity .3s}
.cx-fab:hover{transform:translateY(-2px);border-color:var(--cx-acc)}
.cx-fab-i{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--cx-acc);color:#1b150d;font-size:21px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 6px 14px -6px rgba(232,184,120,.6)}
.cx-fab-t{display:grid;line-height:1.25}.cx-fab-t b{font-size:14.5px;font-weight:600}.cx-fab-t small{font-size:12px;color:var(--cx-acc-2);font-variant-numeric:tabular-nums}
.cx-fab-m{display:none}
html.cx-on .cx-fab,.cx-fab.away{opacity:0;pointer-events:none;transform:scale(.9)}

/* подложка и лист */
.cx-veil{position:fixed;inset:0;z-index:70;background:rgba(4,4,5,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .35s}
.cx-veil.in{opacity:1}.cx-veil[hidden],.cx[hidden]{display:none}
.cx{position:fixed;z-index:71;top:12px;right:12px;bottom:12px;width:min(500px,calc(100vw - 24px));display:flex;flex-direction:column;border-radius:24px;border:1px solid var(--cx-line-2);background:linear-gradient(180deg,#181613,var(--cx-bg) 220px);color:var(--ink);font-family:var(--font-text);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 50px 120px -30px #000,0 0 0 1px rgba(0,0,0,.4);overflow:clip;transform:translateX(calc(100% + 24px));transition:transform .5s cubic-bezier(.2,.9,.2,1)}
.cx.in{transform:none}
.cx button{font-family:inherit}
.cx-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 20px 14px 24px;border-bottom:1px solid var(--cx-line)}
.cx-h small{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-acc);font-weight:600;margin-bottom:6px}
.cx-h h2{font-family:var(--font-display);font-weight:400;font-size:24px;line-height:1.12;letter-spacing:-.01em}
.cx-x{width:40px;height:40px;border-radius:50%;border:1px solid var(--cx-line-2);background:transparent;color:var(--soft);display:grid;place-items:center;font-size:17px;flex:none;transition:.25s}.cx-x:hover{color:var(--ink);border-color:var(--soft);transform:rotate(90deg)}
.cx-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:6px 24px 20px;scrollbar-width:thin;scrollbar-color:var(--cx-line-2) transparent}

/* поля */
.cx-f{border:0;margin:0;padding:16px 0 4px;min-width:0}
.cx-f legend{float:left;width:100%;display:flex;align-items:center;gap:7px;padding:0;margin-bottom:10px;font-size:13px;font-weight:600;color:var(--soft)}
.cx-f legend+*{clear:both}
.cx-f legend i{font-size:16px;color:var(--cx-acc)}
.cx-f legend em{font-style:normal;font-weight:500;font-size:11px;padding:2px 8px;border-radius:99px;border:1px solid var(--cx-line-2);color:var(--dim);margin-left:2px}
.cx input[type=radio],.cx input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.cx-dir{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cx-dir span,.cx-seg span{display:flex;align-items:center;gap:10px;min-height:50px;padding:10px 14px;border-radius:14px;border:1px solid var(--cx-line);background:var(--cx-field);font-size:14px;font-weight:600;line-height:1.25;color:var(--soft);cursor:pointer;transition:border-color .25s,background .25s,color .25s,box-shadow .25s}
.cx-dir i,.cx-seg i{font-size:20px;color:var(--dim);transition:color .25s;flex:none}
.cx-dir label:hover span,.cx-seg label:hover span{border-color:var(--cx-line-2);color:var(--ink)}
.cx-dir input:checked+span,.cx-seg input:checked+span{border-color:var(--cx-acc);background:#211c15;color:var(--ink);box-shadow:0 0 0 1px var(--cx-acc) inset}
.cx-dir input:checked+span i,.cx-seg input:checked+span i{color:var(--cx-acc)}
.cx input:focus-visible+span,.cx input:focus-visible+.cx-tier-c,.cx input:focus-visible+.cx-sw-k{outline:2px solid #dce4ba;outline-offset:2px}
.cx-seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cx-seg em{font-style:normal;font-size:12px;color:var(--cx-acc-2);font-weight:600;margin-left:auto}

.cx-tiers{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cx-tier{position:relative;display:flex}
.cx-tier-c{flex:1;display:grid;align-content:start;gap:3px;padding:12px 14px 13px;border-radius:14px;border:1px solid var(--cx-line);background:var(--cx-field);cursor:pointer;transition:border-color .25s,background .25s,box-shadow .25s,transform .25s}
.cx-tier:hover .cx-tier-c{border-color:var(--cx-line-2)}
.cx-tier input:checked+.cx-tier-c{border-color:var(--cx-acc);background:#211c15;box-shadow:0 0 0 1px var(--cx-acc) inset,0 14px 30px -18px rgba(232,184,120,.45)}
.cx-tier-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.cx-tier-top small{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--dim);font-weight:600}
.cx-tier-top em{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:99px;background:rgba(183,197,158,.16);color:var(--sage);white-space:nowrap}
.cx-tier b{font-size:14.5px;font-weight:600;line-height:1.25;color:var(--ink);margin-top:2px}
.cx-tier-p{font-size:14px;font-weight:700;color:var(--cx-acc-2);font-variant-numeric:tabular-nums;margin-top:4px}
.cx-tier-d{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--dim)}
.cx-tier input:checked+.cx-tier-c .cx-tier-top small{color:var(--cx-acc)}

.cx-add{display:grid;border:1px solid var(--cx-line);border-radius:14px;background:var(--cx-field);overflow:hidden}
.cx-sw{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;transition:background .25s}
.cx-sw+.cx-sw{border-top:1px solid var(--cx-line)}
.cx-sw:hover{background:rgba(255,255,255,.02)}
.cx-sw-i{font-size:20px;color:var(--dim);flex:none}
.cx-sw-t{flex:1;min-width:0;display:grid;line-height:1.3}.cx-sw-t b{font-size:14px;font-weight:600}.cx-sw-t small{font-size:12px;color:var(--dim)}
.cx-sw-p{font-size:13.5px;font-weight:600;color:var(--soft);white-space:nowrap;font-variant-numeric:tabular-nums}
.cx-sw-k{position:relative;width:40px;height:24px;border-radius:99px;background:#2a2723;border:1px solid var(--cx-line-2);flex:none;transition:background .25s,border-color .25s}
.cx-sw-k::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#8c867c;box-shadow:0 2px 4px rgba(0,0,0,.4);transition:transform .3s cubic-bezier(.3,1.4,.5,1),background .25s}
.cx-sw input:checked~.cx-sw-k{background:var(--cx-acc);border-color:var(--cx-acc)}
.cx-sw input:checked~.cx-sw-k::after{transform:translateX(16px);background:#1b150d}
.cx-sw:has(input:checked:not(:disabled)) .cx-sw-i{color:var(--cx-acc)}
.cx-sw:has(input:checked:not(:disabled)) .cx-sw-p{color:var(--cx-acc-2)}
.cx-sw.inc{cursor:default}.cx-sw.inc .cx-sw-p{color:var(--sage);font-weight:600}.cx-sw.inc .cx-sw-k{opacity:.4}

/* помощник */
.cx-ai{margin-top:22px;border:1px solid var(--cx-line);border-radius:18px;background:#121110;overflow:hidden}
.cx-ai-h{width:100%;display:flex;align-items:center;gap:12px;padding:12px 14px;border:0;background:transparent;text-align:left}
.cx-ai-h>span:nth-child(2){flex:1;min-width:0;display:grid;line-height:1.3}.cx-ai-h b{font-size:14px;font-weight:600}.cx-ai-h small{font-size:11.5px;color:var(--dim)}
.cx-ai-h>i{font-size:16px;color:var(--dim);transition:transform .3s}
.cx-ai.shut .cx-ai-h>i{transform:rotate(-90deg)}
.cx-ai.shut .cx-ai-b{display:none}
.cx-av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;font-family:var(--font-display);font-size:14px;color:#1b150d;background:linear-gradient(140deg,#f3d9b2,var(--cx-acc));box-shadow:0 1px 0 rgba(255,255,255,.4) inset}
.cx-ai-b{border-top:1px solid var(--cx-line)}
.cx-log{display:flex;flex-direction:column;gap:8px;padding:14px}
.cx-m{max-width:88%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;animation:pop .3s}
.cx-m.bot{align-self:flex-start;background:#1e1b18;border-bottom-left-radius:4px}
.cx-m.bot a{color:var(--cx-acc-2);border-bottom:1px solid rgba(232,184,120,.4)}
.cx-m.bot ul{margin:6px 0;display:grid;gap:3px}.cx-m.bot li{position:relative;padding-left:16px}.cx-m.bot li::before{content:"";position:absolute;left:3px;top:.68em;width:5px;height:5px;border-radius:50%;background:var(--cx-acc)}
.cx-m.me{align-self:flex-end;background:var(--cta);color:#151518;border-bottom-right-radius:4px}
.cx-m.typ{align-self:flex-start;background:#1e1b18;display:flex;gap:4px;padding:13px 14px}
.cx-m.typ i{width:6px;height:6px;border-radius:50%;background:var(--dim);animation:cxDot 1s infinite}.cx-m.typ i:nth-child(2){animation-delay:.15s}.cx-m.typ i:nth-child(3){animation-delay:.3s}
@keyframes cxDot{40%{transform:translateY(-4px);background:var(--ink)}}
.cx-q{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px;transition:opacity .3s}
.cx-q button{padding:7px 12px;border-radius:99px;border:1px solid var(--cx-line-2);background:transparent;color:var(--soft);font-size:13px;transition:.25s}.cx-q button:hover{border-color:var(--cx-acc);color:var(--ink)}
.cx-q.wait{opacity:.45;pointer-events:none}
.cx-in{display:flex;gap:8px;padding:10px 12px 12px;border-top:1px solid var(--cx-line)}
.cx-in input{flex:1;min-width:0;padding:11px 14px;border-radius:99px;border:1px solid var(--cx-line-2);background:var(--cx-field);color:var(--ink);font:inherit;font-size:16px}.cx-in input:focus{outline:none;border-color:var(--cx-acc)}
.cx-in button{width:44px;height:44px;border-radius:50%;border:0;background:var(--cx-acc);color:#1b150d;display:grid;place-items:center;font-size:18px;flex:none}

/* итог */
.cx-foot{padding:14px 24px 18px;border-top:1px solid var(--cx-line);background:linear-gradient(180deg,#1b1814,#151310);box-shadow:0 -20px 40px -20px rgba(0,0,0,.6)}
.cx-tip{width:100%;display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:7px 12px 7px 7px;border-radius:14px;border:1px solid var(--cx-line);background:rgba(255,255,255,.02);text-align:left;font-size:13px;line-height:1.35;color:var(--soft);transition:border-color .25s}
.cx-tip:hover{border-color:var(--cx-line-2);color:var(--ink)}
.cx-tip .cx-av{width:28px;height:28px;font-size:12px}
.cx-tip>span:nth-child(2){flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cx-tip>i{font-size:18px;color:var(--cx-acc);flex:none}
.cx-res{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.cx-res small{display:block;font-size:12px;color:var(--dim);margin-bottom:2px}
.cx-price{display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.cx-price b{font-family:var(--font-display);font-weight:400;font-size:40px;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.cx-from,.cx-rub{font-size:18px;font-weight:600;color:var(--cx-acc-2)}
.cx-price [hidden]{display:none}
.cx.smeta .cx-price b{font-size:32px}
.cx-term{display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;background:#221e18;font-size:13px;font-weight:600;color:var(--soft);white-space:nowrap}.cx-term i{color:var(--cx-acc);font-size:15px}
.cx-cta{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:17px 22px;border-radius:14px;border:0;background:var(--cx-acc);color:#1b150d;font-size:16px;font-weight:700;line-height:1.2;box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 -2px 0 rgba(0,0,0,.12) inset,0 16px 30px -16px rgba(232,184,120,.7);transition:background .25s,transform .25s,box-shadow .25s}
.cx-cta i{font-size:18px;transition:transform .3s}
.cx-cta:hover{background:var(--cx-acc-2);transform:translateY(-1px)}.cx-cta:hover i{transform:translateX(4px)}
.cx-cta:active{transform:translateY(1px)}
.cx-note{margin-top:10px;font-size:12px;line-height:1.5;color:var(--dim)}
.cx-note a{display:inline-flex;align-items:center;gap:4px;color:var(--soft);font-weight:600;border-bottom:1px solid var(--cx-line-2);white-space:nowrap}.cx-note a:hover{color:var(--ink)}

/* поле «Ваш расчёт» в форме заявки */
.f-calc>span{display:flex;align-items:center;gap:6px}
.f-calc>span i{color:var(--amber);font-size:16px}
.f-calc>span small{font-size:11px;color:var(--dim);font-weight:500;padding:1px 7px;border:1px solid var(--line-2);border-radius:99px}
.f-calc>span button{margin-left:auto;border:0;background:none;padding:0;font-size:12px;color:var(--dim);border-bottom:1px solid var(--line-2)}.f-calc>span button:hover{color:var(--ink)}
.f-calc textarea{width:100%;resize:none;padding:13px 16px;border-radius:8px;border:1px solid rgba(224,169,109,.45);background:#120f0c;color:var(--ink);font:inherit;font-size:14px;line-height:1.55}
.f-calc.flash textarea{animation:cxFlash 1.6s ease-out}
@keyframes cxFlash{0%{box-shadow:0 0 0 0 rgba(232,184,120,.55)}100%{box-shadow:0 0 0 14px rgba(232,184,120,0)}}

@media (max-width:800px){
  .cx-fab{right:14px;bottom:16px;padding:7px 16px 7px 7px;gap:9px}
  body:has(.msticky.show) .cx-fab{opacity:0;pointer-events:none} /* на телефоне внизу уже есть панель «Обсудить проект»; калькулятор доступен из блока цен */
  .cx-fab-t{display:none}.cx-fab-m{display:block;font-size:14px;font-weight:700}
  .cx-fab-i{width:38px;height:38px;font-size:19px}
  .cx{inset:0;width:100%;border-radius:0;border:0;transform:translateY(100%)}
  .cx-h{padding:14px 14px 12px 16px}.cx-h h2{font-size:20px}
  .cx-scroll{padding:2px 16px 18px}
  .cx-foot{padding:12px 16px calc(14px + env(safe-area-inset-bottom))}
  .cx-price b{font-size:34px}.cx.smeta .cx-price b{font-size:28px}
  .cx-cta{padding:16px 18px;font-size:15.5px}
  .cx-dir span{font-size:13.5px;padding:10px 12px;gap:8px}
}
@media (max-width:370px){.cx-dir,.cx-tiers{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cx,.cx-veil,.cx-fab{transition:none}.cx-m,.cx-m.typ i,.f-calc.flash textarea{animation:none}}
/* метки обычным регистром */
.cx-h small,.cx-tier-top small{text-transform:none;letter-spacing:0;font-size:13px}
