.roof-treatment-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.roof-treatment-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-width:0;padding:16px;background:#28282b;color:var(--ink);border:1px solid #66666a;border-radius:12px;text-align:left;transition:border-color .2s,background .2s,transform .2s}.roof-treatment-card:hover{border-color:#d18568;transform:translateY(-2px)}.roof-treatment-card.selected{border:2px solid #cb7558;background:#3b302e;padding:15px}.roof-treatment-card strong{font-size:23px;line-height:1.15}.roof-treatment-desc{font:14px/1.5 Oswald,sans-serif;color:#c4c0bd;min-height:42px}.roof-treatment-tag{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#f2b69d}.roof-treatment-card small{font-size:11px;color:#bcbcc1}.roof-card-price{font-size:20px;line-height:1.3;margin-top:auto}.roof-card-check{position:absolute;right:12px;top:13px;width:20px;height:20px;border-radius:50%;background:#bd6244;color:white;text-align:center;font:13px/20px sans-serif;visibility:hidden}.selected .roof-card-check{visibility:visible}.roof-card-context{display:block;color:var(--muted);margin-top:16px;font-size:12px}.roof-mini{position:relative;display:block;width:100%;height:65px;overflow:hidden;background:linear-gradient(180deg,#51616b,#83918f);border-radius:7px}.roof-mini i{position:absolute;width:100px;height:60px;background:#c2c6bc;left:calc(50% - 50px);top:35px}.roof-mini b,.roof-mini em{position:absolute;width:135px;height:50px;left:calc(50% - 67px);top:9px;clip-path:polygon(50% 0,100% 76%,0 76%);background:repeating-linear-gradient(0deg,#6c5146 0 7px,#806055 8px 10px)}.roof-mini em{background:#c27a59;animation:roof-mini-sweep 5s ease-in-out infinite;transform-origin:left}.roof-mini--softwash em{background:#92a791}.roof-mini--impregnation em{background:#a5c9d2b0}.roof-mini--sealing em{background:#494a4e}.roof-mini--metal b{background:repeating-linear-gradient(90deg,#7d8588 0 9px,#c1c6c6 10px 12px)}.roof-mini--metal em{background:repeating-linear-gradient(90deg,#343b40 0 9px,#858e91 10px 12px)}@keyframes roof-mini-sweep{0%,10%{clip-path:polygon(50% 0,50% 0,0 76%,0 76%)}70%,100%{clip-path:polygon(50% 0,100% 76%,0 76%)}}
.roof-calc-field{border:0;margin:0 0 18px;padding:0;min-width:0}.roof-calc-field>label,.roof-calc-field>legend{display:block;margin:0 0 9px;font-size:16px;font-weight:500}.roof-calc-field select{width:100%;min-height:48px;padding:10px 12px;border:1px solid #6d6d70;border-radius:7px;background:#242426;color:var(--ink);font-size:15px}.roof-scope-toggle,.roof-basis-toggle{display:flex;gap:6px;padding:5px;border-radius:9px;background:#222225;margin-bottom:19px}.roof-scope-toggle button,.roof-basis-toggle button{flex:1;padding:11px 8px;border:0;background:transparent;border-radius:6px;color:#c6c6c8;font-size:14px;min-width:0}.roof-scope-toggle button[aria-pressed=true],.roof-basis-toggle button[aria-pressed=true]{background:#b34e32;color:#fff}.roof-basis-toggle{margin-bottom:10px}.roof-field-help,.roof-draft-example{font-size:12px;line-height:1.5;color:#bcbcc1;margin:8px 0 14px}.roof-area-number{display:flex;justify-content:space-between;align-items:center;margin:12px 0}.roof-area-number label{font-size:16px}.roof-area-number>div,.roof-garage-number{display:flex;gap:8px;align-items:center}.roof-area-number input,.roof-garage-number input{width:110px!important;min-height:48px!important;font-size:25px!important;border:1px solid #8e756a!important;background:#242426!important;padding:7px 10px!important;border-radius:8px!important;color:var(--ink)!important}.roof-area-number span,.roof-garage-number span{font-size:15px;color:#bcbcc1}#roofCalcSlider{appearance:none;width:100%;height:7px;min-height:7px;padding:0;border:0;border-radius:10px;background:linear-gradient(to right,#c47657 var(--roof-fill,30%),#505054 var(--roof-fill,30%));cursor:pointer;margin:17px 0}#roofCalcSlider::-webkit-slider-thumb{appearance:none;width:25px;height:25px;background:#f1e3dc;border:4px solid #b35e40;border-radius:50%;box-shadow:0 2px 8px #0005}.roof-range-labels{display:flex;justify-content:space-between;font-size:11px;color:#bcbcc1;margin-top:-7px}.roof-calc-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.roof-live-result{margin:8px 0 12px;padding:20px;border-radius:11px;border:1px solid #b47760;background:linear-gradient(125deg,#41342e,#2e2e30)}.roof-live-result>span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#e0b6a2}.roof-live-result strong{display:block;font-size:34px;line-height:1.25;margin:8px 0;letter-spacing:-.5px}.roof-live-result small{font-size:12px;color:#d8c2b7}.roof-live-result p{font-size:12px;line-height:1.5;color:#c3bdb9;margin:10px 0 0}.roof-price-details{border-top:1px solid #505054;padding-top:14px}.roof-price-details summary{font-size:14px;cursor:pointer}.roof-price-details p{font-size:13px;color:#bcbcc1;line-height:1.6;margin:12px 0}.roof-calculator-step h1{margin-bottom:18px}.price-dock #live-total{font-variant-numeric:tabular-nums}
@media(max-width:760px){.roof-treatment-cards{gap:9px}.roof-treatment-card{padding:12px;gap:8px}.roof-treatment-card.selected{padding:11px}.roof-treatment-card strong{font-size:19px}.roof-treatment-desc{font-size:12px;min-height:54px}.roof-card-price{font-size:17px}.roof-treatment-tag{font-size:8px}.roof-card-context{font-size:11px}.roof-mini{height:57px}.roof-calc-fields{gap:0 10px}.roof-calc-field select{font-size:13px;padding:10px 7px}.roof-live-result{padding:16px}.roof-live-result strong{font-size:29px}.roof-area-number label{font-size:14px}.roof-area-number input{width:95px!important}.price-dock #live-total{font-size:clamp(19px,5.6vw,27px)}.roof-basis-toggle button,.roof-scope-toggle button{font-size:13px}}
@media(prefers-reduced-motion:reduce){.roof-mini em{animation:none}.roof-treatment-card{transition:none}}

@media(min-width:761px){body.has-price.roof-live-active{padding-bottom:180px}body.roof-live-active .price-dock{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:calc(100% - 48px);max-width:1166px;z-index:8;box-shadow:0 8px 30px #0008;background:#242426f5}}
