.devis-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.devis-left{background:var(--green-900);color:var(--cream);padding:140px 60px 60px;position:relative;overflow:hidden}
.devis-left .bg-img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.15;filter:grayscale(.3);mix-blend-mode:luminosity;pointer-events:none;z-index:0}
.devis-left::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(11,61,48,.92) 0%,rgba(11,61,48,.75) 60%,rgba(11,61,48,.96) 100%);pointer-events:none;z-index:1}
.devis-left > *{position:relative;z-index:2}
.devis-preview{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:50px}
.devis-preview .anim-img{aspect-ratio:4/3;border-radius:0}
.devis-left h1{font-family:"Montserrat",sans-serif;font-size:clamp(56px,6.5vw,110px);line-height:.92;letter-spacing:-0.03em;margin-bottom:30px}
.devis-left h1 em{font-style:italic;color:var(--green-300)}
.devis-left p{font-size:17px;line-height:1.6;color:rgba(255,255,255,.78);max-width:460px;margin-bottom:40px}
.devis-left .bg-o{position:absolute;right:-160px;bottom:-120px;font-family:"Montserrat",sans-serif;font-size:620px;color:rgba(255,255,255,.04);font-style:italic;line-height:1;pointer-events:none}
.devis-left .perks{margin-top:60px;display:flex;flex-direction:column;gap:18px}
.devis-left .perk{display:flex;gap:16px;align-items:start;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}
.devis-left .perk .k{font-family:"Montserrat",sans-serif;font-size:11px;letter-spacing:.14em;color:rgba(255,255,255,.55);min-width:40px}
.devis-left .perk .v{font-size:15px;color:#fff;line-height:1.4}

.devis-right{background:var(--ivory);padding:140px 60px 80px}
.step-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;padding-bottom:18px;border-bottom:1px solid var(--rule)}
.step-head .c{font-family:"Montserrat",sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60)}
.step-head .p-bar{display:flex;gap:6px}
.step-head .p-bar span{width:30px;height:3px;background:var(--rule);border-radius:2px;transition:background .3s}
.step-head .p-bar span.on{background:var(--green-800)}

form .field{margin-bottom:28px}
form label{display:block;font-family:"Montserrat",sans-serif;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);margin-bottom:10px}
form input,form textarea,form select{width:100%;padding:14px 0;border:none;border-bottom:1px solid var(--rule);background:transparent;font-family:"Montserrat",sans-serif;font-size:18px;color:var(--ink);outline:none;transition:border-color .2s}
form input:focus,form textarea:focus,form select:focus{border-bottom-color:var(--green-800)}
form textarea{resize:vertical;min-height:120px;padding:14px 0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:10px 14px;border:1px solid var(--rule);border-radius:999px;font-size:13px;color:var(--ink);cursor:pointer;transition:all .2s}
.chip:hover{border-color:var(--green-800)}
.chip.on{background:var(--green-800);color:var(--ivory);border-color:var(--green-800)}

.range-wrap{display:flex;flex-direction:column;gap:12px}
.range-wrap .vals{display:flex;justify-content:space-between;font-family:"Montserrat",sans-serif;font-size:11px;color:var(--ink-60);letter-spacing:.1em}
.range-wrap input[type=range]{width:100%;accent-color:var(--green-800);padding:0}

.actions-row{display:flex;justify-content:space-between;align-items:center;margin-top:30px;padding-top:28px;border-top:1px solid var(--rule)}

.submit{display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border-radius:999px;background:var(--green-800);color:var(--ivory);font-size:14px;border:none;cursor:pointer;transition:background .3s, transform .3s}
.submit:hover{background:var(--green-900);transform:translateY(-2px)}
.back{font-family:"Montserrat",sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-60);cursor:pointer;transition:color .2s}
.back:hover{color:var(--ink)}

.success{text-align:center;padding:60px 0}
.success .big{font-family:"Montserrat",sans-serif;font-size:80px;color:var(--green-900);letter-spacing:-0.02em;font-style:italic;margin-bottom:24px}
.success p{color:var(--ink-60);max-width:420px;margin:0 auto;line-height:1.55}

@media (max-width:900px){
  .devis-wrap{grid-template-columns:1fr}
  .devis-left{padding:100px 24px 60px}
  .devis-right{padding:60px 24px}
  .devis-left .bg-o{display:none}
  .devis-preview{grid-template-columns:1fr 1fr;gap:8px}
}