/* Конструктор модульных бань — коробочная геометрия, не разваливается при повороте */
.md-sec{padding:34px 0 46px}
.md-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:20px;align-items:start}
@media(max-width:900px){.md-grid{grid-template-columns:1fr}}
.md-scene-wrap{position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#9CC7E8 0%,#C8E0F0 55%,#A8C88C 55%,#8FB877 100%);min-height:340px;display:flex;align-items:center;justify-content:center;touch-action:none}
.md-summary{display:flex;flex-direction:column;gap:16px}
@media(min-width:901px){.md-grid{align-items:start;grid-template-rows:auto 1fr}
  .md-scene-wrap{min-height:0;height:min(70vh,540px);grid-column:1;grid-row:1}
  .md-panel{grid-column:2;grid-row:1/span 2}
  .md-summary{grid-column:1;grid-row:2}}
.md-scene{position:absolute;inset:0;perspective:1600px;perspective-origin:50% 45%}
/* мир — точка в центре сцены, все модули позиционируются от неё */
.md-box{position:absolute;left:50%;top:56%;width:0;height:0;transform-style:preserve-3d}
.md-mod{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d}
.md-face{position:absolute;left:0;top:0;background-repeat:repeat;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);backface-visibility:hidden}
.md-clipped{box-shadow:none}
.md-skin{position:absolute;inset:0;display:block;background-repeat:repeat;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.md-front{box-shadow:inset 0 0 0 1px rgba(0,0,0,.2),inset 0 -14px 26px rgba(0,0,0,.06)}
.md-face.md-clipped{box-shadow:none}
.md-roof{box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
/* окно и дверь — дети передней грани, привязаны к её центру */
.md-win,.md-door{position:absolute;left:50%;top:50%;display:block}
.md-win{background:linear-gradient(160deg,#cfe4f2 0%,#a9cade 45%,#8fb6cf 100%);border:2px solid #fff;border-radius:2px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.md-door{background:linear-gradient(180deg,#5A3B2A,#42291C);border:2px solid rgba(255,255,255,.5);border-radius:2px;box-shadow:0 2px 6px rgba(0,0,0,.22)}
.md-zoom{position:absolute;left:14px;top:14px;display:flex;gap:6px;z-index:3}
.md-zoom button{width:38px;height:38px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:20px;cursor:pointer}
.md-hint{position:absolute;bottom:10px;left:0;right:0;text-align:center;color:rgba(0,0,0,.5);font-size:12.5px;margin:0}
.md-panel{display:flex;flex-direction:column;gap:16px}
.md-block{display:flex;flex-direction:column;gap:9px}
.md-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#A9A296}
.md-label b{color:#F5F1E8;font-weight:600;text-transform:none;letter-spacing:0}
.md-counts{display:flex;gap:8px}
.md-count,.md-scheme{flex:1;padding:13px 0;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:17px;font-family:inherit;cursor:pointer;transition:.16s}
.md-count:hover,.md-scheme:hover{border-color:#D6B46A}
.md-count.on,.md-scheme.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-schemes{display:flex;gap:8px}
.md-scheme{font-size:15px;padding:12px 6px}
.md-note{margin:0;font-size:12.5px;line-height:1.45;color:#9C958A}
.md-sws{display:flex;flex-wrap:wrap;gap:8px}
.md-sw{width:46px;height:46px;border-radius:10px;border:2px solid rgba(255,255,255,.18);cursor:pointer;transition:.16s;padding:0}
.md-sw:hover{transform:translateY(-2px)}
.md-sw.on{border-color:#D6B46A;box-shadow:0 0 0 3px rgba(214,180,106,.3)}
.md-total{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 17px;border-radius:14px;border:1px solid rgba(214,180,106,.3);background:rgba(214,180,106,.07);flex-wrap:wrap}
.md-t-size{display:block;font-size:15px;color:#F5F1E8}
.md-t-area{display:block;font-size:12.5px;color:#A9A296;margin-top:2px}
.md-t-price{font-size:20px;color:#D6B46A;font-weight:700;text-align:right}
.md-t-price small{display:block;font-size:11px;color:#8C8578;font-weight:400}
.md-lead-head{display:grid;gap:5px;padding:13px 15px;border-radius:13px;border:1px solid rgba(214,180,106,.26);background:rgba(214,180,106,.06)}
.md-lead-head b{font-size:15px;color:#F5F1E8}
.md-lead-head span{font-size:12.5px;line-height:1.45;color:#A9A296}
.md-form{display:grid;gap:10px}
.md-form input{padding:12px 14px;border-radius:11px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.3);color:#F5F1E8;font-family:inherit;font-size:15px}
.md-form button{justify-content:center}
.md-form p{margin:0;font-size:13px;color:#9C958A}

/* --- зоны отделки (фасад/задняя/торцы/кровля) + уклон кровли, 14.08.2026 --- */
.md-zones{display:flex;flex-wrap:wrap;gap:6px}
.md-zone{flex:1 1 auto;min-width:88px;padding:9px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:13px;font-family:inherit;cursor:pointer;transition:.16s}
.md-zone:hover{border-color:#D6B46A}
.md-zone.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-allwalls{align-self:flex-start;padding:8px 13px;border-radius:10px;border:1px dashed rgba(214,180,106,.55);background:transparent;color:#D6B46A;font-size:12.5px;font-family:inherit;cursor:pointer;transition:.16s}
.md-allwalls:hover{background:rgba(214,180,106,.12)}
.md-allwalls[hidden]{display:none}
.md-range{width:100%;-webkit-appearance:none;appearance:none;height:5px;border-radius:4px;background:rgba(255,255,255,.16);outline:none;margin:2px 0}
.md-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#D6B46A;border:0;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.md-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#D6B46A;border:0;cursor:pointer}
.md-scale{display:flex;justify-content:space-between;font-size:11.5px;color:#8C8578;margin:-4px 0 0}

/* --- сворачиваемые группы панели (Кровля / Отделка стен) + направление ската, 15.08.2026.
   Живут в .md-panel — это СОСЕД сцены, а не её предок, поэтому overflow/transform здесь безопасны --- */
.md-group{padding:0;margin:0;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.03)}
.md-ghead{display:flex;align-items:center;gap:9px;width:100%;padding:14px 15px;background:transparent;border:0;color:#F5F1E8;font-family:inherit;font-size:15.5px;font-weight:600;text-align:left;cursor:pointer}
.md-gtitle{flex:0 0 auto}
.md-gsum{margin-left:auto;font-size:11.5px;font-weight:400;color:#A9A296;text-align:right;line-height:1.35}
.md-chev{flex:0 0 auto;width:8px;height:8px;border-right:2px solid #A9A296;border-bottom:2px solid #A9A296;transform:rotate(45deg);margin:-4px 2px 0 3px;transition:transform .18s}
.md-group.open>.md-ghead .md-chev{transform:rotate(-135deg);margin:2px 2px 0 3px}
.md-gbody{display:flex;flex-direction:column;gap:9px;padding:0 15px 15px}
.md-gbody[hidden]{display:none}
.md-dirs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.md-dir{padding:11px 3px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:13px;font-family:inherit;cursor:pointer;transition:.16s}
.md-dir:hover{border-color:#D6B46A}
.md-dir.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-cats{display:flex;flex-direction:column}
.md-cat{border-top:1px solid rgba(255,255,255,.08)}
.md-cat-head{display:flex;align-items:center;gap:8px;width:100%;padding:11px 2px;background:transparent;border:0;color:#E8E3D8;font-family:inherit;font-size:13.5px;font-weight:600;text-align:left;cursor:pointer}
.md-cat-head:hover{color:#D6B46A}
.md-cat-head em{font-style:normal;font-weight:400;font-size:11.5px;color:#8C8578;margin-left:auto}
.md-cat.open>.md-cat-head{color:#D6B46A}
.md-cat-grid{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 12px}
.md-cat-grid[hidden]{display:none}

/* --- вкладки панели: сверху ряд «Кровля / Стены / Проёмы / Сборка»,
   ниже — тело активной вкладки. Ровно та же схема, что у .palette
   большого конструктора (#pal-tabs + #pal-body), 15.08.2026 --- */
.md-panel{gap:10px}
.md-tabs{display:flex;gap:2px;border-bottom:1px solid rgba(255,255,255,.14)}
.md-tab{flex:1 1 0;min-width:0;padding:13px 3px;background:transparent;border:0;border-bottom:2px solid transparent;color:#A9A296;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:.16s}
.md-tab:hover{color:#E8E3D8}
.md-tab.on{color:#D6B46A;border-bottom-color:#D6B46A}
.md-pane{display:flex;flex-direction:column;gap:9px}
.md-pane[hidden],.md-block[hidden]{display:none}
.md-rmodes{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.md-rmode{padding:11px 4px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:13.5px;font-family:inherit;cursor:pointer;transition:.16s}
.md-rmode:hover{border-color:#D6B46A}
.md-rmode.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-dir.md-dis{opacity:.4}
/* счётчик окон */
.md-cnt{display:flex;align-items:center;gap:10px}
.md-cnt button{width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#F5F1E8;font-size:22px;line-height:1;font-family:inherit;cursor:pointer;transition:.16s}
.md-cnt button:hover{border-color:#D6B46A;color:#D6B46A}
.md-cnt b{min-width:28px;text-align:center;font-size:20px;color:#F5F1E8}
.md-cnt span{font-size:12.5px;color:#8C8578}
.md-sum2{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px;border-radius:12px;border:1px solid rgba(214,180,106,.3);background:rgba(214,180,106,.07);flex-wrap:wrap}
.md-sum2 b{font-size:14px;color:#F5F1E8;font-weight:600}
.md-sum2 span{font-size:16px;color:#D6B46A;font-weight:700}
/* на мобильном большой блок с ценой (.md-total) идёт сразу под панелью — компактный дубль не нужен */
@media(max-width:900px){.md-sum2{display:none}}

/* --- вкладка «Комплектация», 16.08.2026 -------------------------------
   Строка-опция: слева название и пояснение, справа сумма и переключатель.
   Всё живёт в .md-panel / .md-summary — это СОСЕДИ сцены, поэтому
   overflow, opacity и transition здесь безопасны. --- */
.md-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.03);cursor:pointer;transition:.16s}
.md-opt:hover{border-color:rgba(214,180,106,.5);background:rgba(214,180,106,.05)}
.md-opt-col{display:flex;flex-direction:column;align-items:stretch;gap:9px;cursor:default}
.md-opt-col:hover{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.03)}
.md-opt-txt{display:block;flex:1;min-width:0}
.md-opt-txt b{display:block;font-size:14.5px;color:#F5F1E8;font-weight:600}
.md-opt-txt em{display:block;margin-top:3px;font-style:normal;font-size:12px;line-height:1.4;color:#9C958A}
.md-opt-r{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.md-opt-sum{font-style:normal;font-size:13.5px;color:#D6B46A;font-weight:600;white-space:nowrap}
.md-opt-n{margin:0;font-size:12.5px;color:#9C958A}
.md-opt-n b{color:#D6B46A}
.md-opt-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.md-mini{padding:7px 12px;border-radius:10px;border:1px dashed rgba(214,180,106,.55);background:transparent;color:#D6B46A;font-size:12.5px;font-family:inherit;cursor:pointer;transition:.16s}
.md-mini:hover{background:rgba(214,180,106,.12)}
/* переключатель-тумблер */
.md-chk{-webkit-appearance:none;appearance:none;flex:0 0 auto;width:46px;height:26px;margin:0;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);position:relative;cursor:pointer;transition:.18s}
.md-chk::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#B9B4A8;transition:.18s}
.md-chk:checked{background:#D6B46A;border-color:#D6B46A}
.md-chk:checked::after{left:23px;background:#12100C}
.md-chk:focus-visible{outline:2px solid #D6B46A;outline-offset:2px}
.md-chk:disabled{opacity:.45;cursor:default}
/* сегменты: утепление и терраса */
.md-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.md-ins,.md-terr{padding:9px 4px;border-radius:11px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:13.5px;font-family:inherit;cursor:pointer;transition:.16s;line-height:1.25}
.md-ins span,.md-terr span{display:block;margin-top:3px;font-size:11.5px;color:#9C958A}
.md-ins:hover,.md-terr:hover{border-color:#D6B46A}
.md-ins.on,.md-terr.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-ins.on span,.md-terr.on span{color:rgba(18,16,12,.72)}
.md-seg3 .md-terr{font-size:12.5px}
/* вложенные опции внутренней отделки — плавно раскрываются */
/* закрытый блок гасит собственный gap колонки (-9px), чтобы не оставалось «дырки» */
.md-subs{display:flex;flex-direction:column;gap:8px;max-height:0;opacity:0;overflow:hidden;transition:max-height .26s ease,opacity .2s ease,margin .2s ease;margin:-9px 0 0 14px}
.md-subs.open{max-height:340px;opacity:1;margin:-2px 0 2px 14px}
.md-sub{padding:10px 12px;border-radius:12px;border-style:dashed}
.md-sub .md-opt-txt b{font-size:13.5px}
/* итоговая смета — во вкладке и под сценой */
.md-bill{display:flex;flex-direction:column;border:1px solid rgba(214,180,106,.26);border-radius:14px;background:rgba(214,180,106,.05);padding:6px 14px}
.md-bill:empty{display:none}
.md-bill-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.md-bill-row:last-child{border-bottom:0}
.md-bill-row>span{font-size:13px;color:#E8E3D8;line-height:1.35}
.md-bill-row>span em{display:block;font-style:normal;font-size:11.5px;color:#8C8578;margin-top:2px}
.md-bill-row>b{font-size:13.5px;color:#F5F1E8;white-space:nowrap}
.md-bill-total{padding-top:11px;margin-top:2px;border-top:1px solid rgba(214,180,106,.35)}
.md-bill-total>span{font-size:14px;color:#F5F1E8;font-weight:600}
.md-bill-total>b{font-size:19px;color:#D6B46A;font-weight:700}
.md-pnote{margin:0;font-size:11.5px;line-height:1.45;color:#8C8578}
/* вкладок стало пять: подписи не режем, при нехватке ширины переносим строкой */
.md-tabs{flex-wrap:wrap}
.md-tab{flex:1 1 auto;white-space:nowrap;font-size:13.5px;padding:13px 7px}
@media(max-width:900px){
  .md-tab{flex:1 1 30%;min-width:29%;font-size:13px;padding:11px 2px}
}


/* ===== парилка под ключ и площадь террасы — 15.08.2026 ===== */
.md-sauna{padding:9px 4px;border-radius:11px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#E8E3D8;font-size:12.5px;font-family:inherit;cursor:pointer;transition:.16s;line-height:1.25}
.md-sauna span{display:block;margin-top:3px;font-size:11.5px;color:#9C958A}
.md-sauna:hover{border-color:#D6B46A}
.md-sauna.on{background:#D6B46A;color:#12100C;border-color:#D6B46A;font-weight:700}
.md-sauna.on span{color:rgba(18,16,12,.72)}
.md-terr-area{display:flex;flex-direction:column;gap:5px}
.md-terr-area.md-off{opacity:.42}
.md-terr-area.md-off .md-range{pointer-events:none}
