/* Калькулятор (#kalkulyator) и квиз-подбор (#kviz) — assets/kviz.php.
   Только токены сайта (site.css :root); у каждого блока со своим фоном цвет текста объявлен вместе с фоном. */

#kalkulyator [hidden],#kviz [hidden]{display:none!important}

/* ── Калькулятор ─────────────────────────────────────────────────────────── */
.kc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;align-items:start}
.kc-form{display:grid;gap:20px;background:var(--paper,#F6F7F6);color:var(--ink,#151F26);border:1px solid var(--line,#BFC5C8);padding:26px}
.kc-form fieldset{border:0;padding:0;margin:0;min-width:0}
.kc-form legend{font-size:14px;font-weight:600;margin-bottom:8px;padding:0}
.kc-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kc-seg label,.kc-opts label{position:relative;display:block;cursor:pointer}
.kc-seg input,.kc-opts input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.kc-seg span{display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 10px;border:1px solid var(--steel,#4A5258);background:#FFFFFF;color:var(--ink,#151F26);font-weight:700;font-size:15px;text-align:center}
.kc-seg input:checked+span{background:var(--ink,#151F26);color:#FFFFFF;border-color:var(--ink,#151F26)}
.kc-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kc-opts span{display:flex;flex-direction:column;gap:2px;min-height:64px;padding:10px 12px;border:1px solid var(--steel,#4A5258);background:#FFFFFF;color:var(--ink,#151F26)}
.kc-opts b{font-size:15px;font-weight:700;line-height:1.25}
.kc-opts small{font-family:var(--mono);font-size:14px;color:var(--steel,#4A5258)}
.kc-opts input:checked+span{border:2px solid var(--ink,#151F26);padding:9px 11px;box-shadow:inset 4px 0 0 var(--accent,#CA7E26)}
.kc-seg input:focus-visible+span,.kc-opts input:focus-visible+span{outline:3px solid var(--accent,#CA7E26);outline-offset:2px}
.kc-seg label:hover span,.kc-opts label:hover span{border-color:var(--ink,#151F26)}
.kc-res{background:#FFFFFF;color:var(--ink,#151F26);border:1px solid var(--ink,#151F26);padding:26px;position:sticky;top:calc(var(--hdr-h,72px) + 16px)}
.kc-k{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text,#8A4E0C)}
.kc-price{margin-top:8px;font-family:var(--mono);font-size:clamp(30px,3.4vw,40px);font-weight:500;line-height:1.1;color:var(--ink,#151F26)}
.kc-sum{margin-top:10px;font-size:16px;color:var(--steel,#4A5258)}
.kc-list{margin:18px 0 20px;padding:0;list-style:none;display:grid;gap:8px;font-size:15px;color:var(--steel,#4A5258)}
.kc-list li{display:flex;gap:10px}
.kc-list li::before{content:'';flex:0 0 6px;width:6px;height:6px;margin-top:10px;background:var(--accent,#CA7E26)}
.kc-res .btns{display:grid;gap:10px}

/* ── Квиз ────────────────────────────────────────────────────────────────── */
.kz-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.kz-why{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.kz-why li{display:flex;gap:12px;font-size:16px;color:var(--steel,#4A5258)}
.kz-why li::before{content:'';flex:0 0 6px;width:6px;height:6px;margin-top:10px;background:var(--accent,#CA7E26)}
.kz-card{background:var(--paper,#F6F7F6);color:var(--ink,#151F26);border:1px solid var(--line,#BFC5C8);padding:28px}
.kz fieldset{border:0;padding:0;margin:0;min-width:0}
.kz-step+.kz-step{margin-top:24px}
.kz--js .kz-step+.kz-step{margin-top:0}
.kz-top{margin-bottom:18px}
.kz-prog{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel,#4A5258);margin-bottom:10px}
.kz-prog b{color:var(--ink,#151F26)}
.kz-bar{height:4px;background:var(--sunk,#E1E4E3);overflow:hidden}
.kz-bar span{display:block;height:100%;width:0;background:var(--accent,#CA7E26);transition:width .3s ease-out}
.kz legend,.kz-legend{display:block;padding:0;margin:0 0 16px;font-size:22px;font-weight:700;line-height:1.25;letter-spacing:-.01em;color:var(--ink,#151F26)}
.kz-legend{font-size:19px;margin-top:24px}
.kz-opts{display:grid;gap:10px}
.kz-opts--2{grid-template-columns:1fr 1fr}
.kz-opt{position:relative;display:block;cursor:pointer}
.kz-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.kz-opt span{display:flex;flex-direction:column;gap:2px;min-height:56px;justify-content:center;padding:12px 16px;border:1px solid var(--steel,#4A5258);background:#FFFFFF;color:var(--ink,#151F26)}
.kz-opt b{font-size:17px;font-weight:700;line-height:1.3}
.kz-opt small{font-size:14px;line-height:1.4;color:var(--steel,#4A5258)}
.kz-opt:hover span{border-color:var(--ink,#151F26)}
.kz-opt input:checked+span{border:2px solid var(--ink,#151F26);padding:11px 15px;box-shadow:inset 4px 0 0 var(--accent,#CA7E26)}
.kz-opt input:focus-visible+span{outline:3px solid var(--accent,#CA7E26);outline-offset:2px}
.kz-nav{margin-top:14px}
.kz-back{display:inline-flex;align-items:center;min-height:44px;padding:8px 4px;border:0;background:none;color:var(--steel,#4A5258);font-size:15px;font-weight:600;cursor:pointer}
.kz-back:hover{color:var(--ink,#151F26)}
.kz-res-k{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text,#8A4E0C);margin-bottom:10px}
.kz-res-k:focus{outline:none}
.kz-res{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kz-res li{background:#FFFFFF;color:var(--ink,#151F26);border:1px solid var(--line,#BFC5C8);padding:14px 16px}
.kz-res a{font-size:18px;font-weight:700;color:var(--ink,#151F26);text-decoration:underline;text-decoration-color:var(--accent,#CA7E26);text-underline-offset:4px}
.kz-res a:hover{color:var(--accent-text,#8A4E0C)}
.kz-p{margin-top:6px;font-family:var(--mono);font-size:16px;color:var(--ink,#151F26)}
.kz-m{margin-top:2px;font-size:14px;color:var(--steel,#4A5258)}
.kz-note{margin-top:12px;font-size:14px;color:var(--steel,#4A5258)}
.kz-final .f-row{margin-top:4px}
.kz-final .agree{margin-top:16px}
.kz-final .btns{margin-top:16px}
.kz-final .form-note{margin-top:10px}
.kz-card .form-done .btns{margin-top:16px}

@media (max-width:940px){
  .kc,.kz-wrap{grid-template-columns:1fr;gap:28px}
  .kc-res{position:static}
}
@media (max-width:640px){
  .kc-form,.kc-res{padding:18px}
  .kz-card{padding:18px 16px}
  .kc-opts{grid-template-columns:1fr}
  .kc-opts span{min-height:52px;flex-direction:row;justify-content:space-between;align-items:center}
  .kz-opts--2{grid-template-columns:1fr}
  .kz legend{font-size:20px}
}