/* Калькулятор дома (MVP) — поверх стилей конструктора */
.kc-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(20px,4vw,56px);align-items:end;margin-bottom:22px}
.kc-head h1{font-size:clamp(36px,4.2vw,64px);line-height:1.02;letter-spacing:-.032em}
.kc-head>p{color:var(--ink-2);max-width:58ch}

.kc-steps{display:flex;gap:6px;margin:0 0 20px;padding:0;list-style:none;overflow-x:auto;scrollbar-width:none}
.kc-steps::-webkit-scrollbar{display:none}
.kc-steps button{display:flex;align-items:center;gap:8px;min-height:42px;padding:0 14px 0 6px;border:1.5px solid var(--line);border-radius:999px;background:var(--card);font:500 14.5px/1 var(--display);color:var(--ink-2);white-space:nowrap;cursor:pointer}
.kc-steps button span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--bg);font-weight:650;font-size:13px;color:var(--pine)}
.kc-steps button[aria-current]{background:var(--pine);border-color:var(--pine);color:#fff}
.kc-steps button[aria-current] span{background:var(--honey);color:var(--on-honey)}
.kc-steps button:disabled{opacity:.45;cursor:default}

.kc-grid{align-items:start}
.cx-viewer{position:relative}
.kc-badge{position:absolute;left:14px;top:14px;z-index:2;margin:0;padding:7px 14px;border-radius:999px;background:rgba(24,37,31,.82);color:#fff;font:600 14px/1.2 var(--display);pointer-events:none}
.kc-hint{position:absolute;left:16px;bottom:12px;z-index:2;margin:0;font-size:13px;color:rgba(24,37,31,.62);pointer-events:none}
.cx-viewer canvas{position:absolute;inset:0}

.kc-side{display:flex;flex-direction:column;gap:14px;scroll-margin-top:92px}
.kc-panel{padding:20px;border-radius:var(--r);background:var(--card);box-shadow:var(--shadow);scroll-margin-top:92px}
.kc-panel-h{margin-bottom:14px}
.kc-panel-h span{font:600 13px/1.2 var(--display);letter-spacing:.04em;text-transform:uppercase;color:#8a6a2e}
.kc-panel-h h2{margin-top:4px;font-size:clamp(24px,2.2vw,30px);letter-spacing:-.02em}
.kc-panel-h p{margin-top:2px;color:var(--ink-3);font-size:15px}
.kc-group+.kc-group{margin-top:18px}
.kc-group header{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.kc-group h3{font-size:17px}
.kc-group header span{font-size:13px;color:var(--ink-3);text-align:right}
.kc-delta{font-style:normal;font:600 12.5px/1.2 var(--display);color:var(--pine-2);font-variant-numeric:tabular-nums}

.kc-houses{display:grid;gap:10px}
.kc-house{display:flex;align-items:center;gap:14px;padding:8px;border:1.5px solid var(--line);border-radius:16px;background:#fff;text-align:left;cursor:pointer;transition:border-color .2s var(--ease)}
.kc-house:hover{border-color:var(--pine-2)}
.kc-house.is-on{border-color:var(--pine);background:#eef3ee;box-shadow:inset 0 0 0 1px var(--pine)}
.kc-house img{width:120px;aspect-ratio:4/3;object-fit:cover;border-radius:10px;flex:none}
.kc-house b{display:block;font:600 18px/1.2 var(--display);color:var(--pine)}
.kc-house small{display:block;margin-top:3px;font-size:14px;color:var(--ink-3);line-height:1.4}

.kc-soon{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.kc-soon h3{font-size:16px}
.kc-soon p{margin-top:2px;font-size:14px;color:var(--ink-3)}
.kc-soon ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:12px 0 0;padding:0;list-style:none}
.kc-soon li{display:flex;align-items:center;gap:8px;padding:6px;border:1.5px dashed var(--line);border-radius:12px;color:var(--ink-3);font:500 14px/1.2 var(--display)}
.kc-soon img{width:44px;height:34px;object-fit:cover;border-radius:6px;filter:grayscale(1);opacity:.6;flex:none}
.kc-soon small{display:block;font:400 12.5px/1.3 inherit}

.kc-note{margin-bottom:14px;padding:12px 14px;border-radius:12px;background:#fbf1dc;border:1.5px solid #e2c27a;color:#5a3f0f;font-size:15px}
.kc-note a{color:inherit}

.kc-nav{display:flex;justify-content:space-between;gap:10px}
.kc-nav .btn{flex:1}
.kc-nav .btn[hidden]{display:none}
.kc-nav .btn svg{width:18px;height:18px}

.kc-sum{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:16px 20px;border-radius:var(--r);background:var(--pine);color:var(--on-pine)}
.kc-sum span{width:100%;font:600 12.5px/1.2 var(--display);letter-spacing:.05em;text-transform:uppercase;color:var(--honey)}
.kc-sum b{font:650 clamp(26px,2.4vw,34px)/1.1 var(--display);color:#fff;font-variant-numeric:tabular-nums}
.kc-sum small{font-size:14px;color:var(--on-pine-2)}

.kc-bill{display:grid;gap:10px}
.kc-bill-g{border-top:1px solid var(--line);padding-top:8px}
.kc-bill-g>b{display:block;margin-bottom:4px;font:600 12.5px/1.2 var(--display);letter-spacing:.05em;text-transform:uppercase;color:#8a6a2e}
.kc-bill-g div{display:flex;justify-content:space-between;gap:12px;padding:3px 0;font-size:15px}
.kc-bill-g small{display:block;font-size:12.5px;color:var(--ink-3)}
.kc-bill-g i{font-style:normal;white-space:nowrap;font-variant-numeric:tabular-nums}
.kc-bill-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:10px;border-top:2px solid var(--pine);font:600 17px/1.2 var(--display);color:var(--pine)}
.kc-bill-total b{font-size:24px;font-variant-numeric:tabular-nums}
.kc-assume{margin-top:12px;font-size:13.5px;line-height:1.45;color:var(--ink-3)}
.kc-assume b{color:var(--pine)}
.kc-final{display:grid;gap:8px;margin-top:16px}
.kc-final svg{width:20px;height:20px}

@media (max-width:1180px){.kc-head{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .kc-house img{width:92px}
  .kc-group header{flex-direction:column;gap:2px}
  .kc-group header span{text-align:left}
  .kc-panel{padding:16px}
  .kc-sum{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:40;padding:12px 16px}
  .kc-sum span{display:none}
  .kc-sum b{font-size:24px}
  .cx-phone{display:none}
}
.kc-sum[hidden]{display:none}

/* анимации: смена шага, итог, выбор опции */
@keyframes kcFwd{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}
@keyframes kcBack{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
@keyframes kcRise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.kc-panel.is-fwd > *{animation:kcFwd .5s var(--ease) both}
.kc-panel.is-back > *{animation:kcBack .5s var(--ease) both}
.kc-panel.is-fwd .cx-opt,.kc-panel.is-back .cx-opt,.kc-panel.is-fwd .kc-house,.kc-panel.is-back .kc-house{animation:kcRise .45s var(--ease) both}
.kc-panel .cx-opts > :nth-child(2),.kc-panel .kc-houses > :nth-child(2){animation-delay:.05s}
.kc-panel .cx-opts > :nth-child(3),.kc-panel .kc-houses > :nth-child(3){animation-delay:.1s}
.kc-panel .cx-opts > :nth-child(4){animation-delay:.15s}
.kc-panel .cx-opts > :nth-child(5){animation-delay:.2s}
.kc-panel .cx-opts > :nth-child(n+6){animation-delay:.25s}
.cx-opt,.kc-house{transition:border-color .2s var(--ease),background-color .25s var(--ease),transform .2s var(--ease),box-shadow .25s var(--ease)}
.cx-opt:active,.kc-house:active{transform:scale(.985)}
.cx-opt:hover,.kc-house:hover{transform:translateY(-1px);box-shadow:0 10px 22px -18px rgba(24,37,31,.5)}
.kc-sum.is-bump b{animation:kcBump .6s var(--ease)}
@keyframes kcBump{0%{transform:none}30%{transform:scale(1.035)}100%{transform:none}}
.kc-sum b{display:inline-block;transform-origin:left center}
.kc-steps button{transition:background-color .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),opacity .3s var(--ease)}
.cx-conflict:not([hidden]){animation:kcPop .4s var(--ease) both}
@keyframes kcPop{from{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){
  .kc-panel > *,.kc-panel .cx-opt,.kc-panel .kc-house,.kc-sum b,.cx-conflict{animation:none !important}
  .cx-opt:hover,.kc-house:hover,.cx-opt:active{transform:none}
}
/* ноутбуки 900–1180px: модель и шаги остаются рядом, чтобы видеть, как меняется дом */
@media (max-width:1180px) and (min-width:901px){
  .kc-grid{grid-template-columns:minmax(0,11fr) minmax(0,10fr);gap:20px}
  .kc-grid .cx-stage{position:sticky;top:88px}
  .kc-grid .cx-viewer{height:min(58vh,560px);min-height:320px}
  .kc-head{grid-template-columns:minmax(0,1fr)}
}