@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}*{margin:0}body,:host{-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root,#__next,main[data-solroof]{isolation:isolate}.hidden{display:none}[data-required=true]:after{display:inline-block;position:relative;top:calc(-.2 * var(--rem));left:calc(.2 * var(--rem));content:"*"}.map-tooltip{position:fixed;color:#ff0;z-index:1000;font-family:Roboto Condensed,sans-serif;background-color:#0006;color:#fc0;padding:.5rem;font-size:.8rem}main[data-solroof]{--rem: 10px;font-family:Roboto Condensed,sans-serif;font-size:calc(1.6 * var(--rem));position:relative;padding:0 calc(2 * var(--rem))}@media (min-width: 541px){main[data-solroof]{padding:unset;width:calc(77 * var(--rem));margin:0 auto}}main[data-solroof]{--color-main: rgb(255, 204, 0);--color-main-hover: rgb(245, 178, 45);--color-background-input: rgb(246, 246, 246);--color-background-menu: rgb(255, 255, 255);--color-border: rgb(255, 237, 183);--color-border-input: rgb(240, 240, 240);--color-error: rgb(255, 229, 229);--color-sent: rgb(18, 160, 18);--color-green-energy: rgb(86, 190, 110);--color-text-default: rgb(0, 0, 0);--color-text-default-disabled: rgb(115, 115, 115);--color-background-map: rgba(0, 0, 0, .4);--border-size: calc(.1 * var(--rem))}main[data-solroof].step2,main[data-solroof].step3,main[data-solroof].step4{padding-top:calc(4 * var(--rem))}main[data-solroof].step1-locating{opacity:.5;cursor:not-allowed}main[data-solroof].step4-sent nav.main,main[data-solroof].step4-sent .steps{display:none}main[data-solroof].step4-sent .thank-you{display:unset}section{display:grid}section.progress{position:relative}section.progress label{position:absolute;transform:translate(-50%,calc(-3.4 * var(--rem)));display:grid;justify-items:center}section.progress label .progress-tooltip{font-size:calc(1.2 * var(--rem));background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='34'%20height='28'%20viewBox='0%200%2034%2028'%3e%3crect%20width='34'%20height='24'%20rx='2'%20fill='%23ffcd00'/%3e%3cpath%20d='M3.5,0,7,6H0Z'%20transform='translate(21%2028)%20rotate(180)'%20fill='%23ffcd00'/%3e%3c/svg%3e") center top no-repeat;min-height:calc(3 * var(--rem));min-width:calc(5 * var(--rem));display:grid;justify-content:center;padding:calc(.5 * var(--rem));font-weight:700}section.progress label .progress-bullet{--size: calc(1.2 * var(--rem));width:var(--size);height:var(--size);background-color:#fff;border:calc(.3 * var(--rem)) solid var(--color-main);border-radius:var(--size)}section.progress progress{--background: rgb(248, 248, 248);width:100%;height:calc(.5 * var(--rem));-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background-color:var(--background);color:var(--color-main);margin-bottom:calc(1 * var(--rem))}section.progress progress::-webkit-progress-bar{background-color:var(--background)}section.progress progress::-webkit-progress-value{background-color:var(--color-main)}section.progress progress::-moz-progress-bar{background-color:var(--color-main)}section.progress progress::-ms-fill{background-color:var(--color-main)}nav.main{margin-bottom:calc(3.7 * var(--rem))}main[data-language=es] nav.main ol li:nth-child(1) a{font-size:calc(1.2 * var(--rem))}main[data-language=es] nav.main ol li:nth-child(2) a{font-size:calc(1.4 * var(--rem))}@media (min-width: 541px){main[data-language=es] nav.main ol li:nth-child(1) a{font-size:calc(1.4 * var(--rem))}}@media (min-width: 541px){main[data-language=lt] nav.main ol li:nth-child(2) a{font-size:calc(1.4 * var(--rem))}}nav.main ol{display:flex;list-style:none;text-transform:uppercase;background-color:var(--color-background-menu);border:var(--border-size) solid var(--color-border);padding:0;counter-reset:nav}@media (min-width: 1025px){nav.main ol{display:grid;grid-template-columns:repeat(4,1fr)}}nav.main ol li{display:grid;grid-auto-flow:column;align-items:baseline;color:var(--color-text-default)}nav.main ol li:not(.active){flex:1}@media (min-width: 1025px){nav.main ol li:not(.active){flex:unset}}nav.main ol li:not(.active) .text{display:none}@media (min-width: 1025px){nav.main ol li:not(.active) .text{display:flex}}nav.main ol li:not(.active) a:before{content:counter(nav)}nav.main ol li.active{background-color:var(--color-main)}nav.main ol li[data-disabled=true] a{opacity:.5;cursor:not-allowed}nav.main ol li+li{border-left:var(--border-size) solid var(--color-border)}nav.main ol li:nth-last-child(1),nav.main ol li:nth-last-child(2){border-top:var(--border-size) solid var(--color-border)}@media (min-width: 541px){nav.main ol li:nth-last-child(1),nav.main ol li:nth-last-child(2){border-top:unset}}nav.main ol a{display:flex;justify-content:center;text-decoration:none;color:unset;font-size:calc(1.6 * var(--rem));font-weight:700;padding:calc(1.4 * var(--rem))}@media (min-width: 541px){nav.main ol a{padding:calc(.7 * var(--rem))}}nav.main ol a:before{counter-increment:nav;content:counter(nav) ".";margin:0 calc(.5 * var(--rem));display:flex;justify-content:center}@media (min-width: 1025px){nav.main ol a:before{display:none}}nav.bottom{display:flex}nav.bottom button{padding:calc(1.8 * var(--rem));border:none;font-size:calc(1.6 * var(--rem));font-weight:700;color:var(--color-text-default)}nav.bottom button[disabled]{color:var(--color-text-default-disabled)}nav.bottom button.back{background-color:var(--color-background-input)}nav.bottom button.next{background-color:var(--color-main)}nav.bottom button.next:not([disabled]):hover{background-color:var(--color-main-hover)}button{cursor:pointer}button[disabled]{cursor:not-allowed}.step{--padding: calc(1.7 * var(--rem))}.step .field{position:relative;display:grid;margin-bottom:calc(1.5 * var(--rem));transition:background-color .13s ease-in-out}@media (min-width: 541px){.step .field{margin-bottom:calc(2 * var(--rem))}}.step .field.required .select:before,.step .field.required .input:before,.step .field.required fieldset:before{position:absolute;top:calc(-.2 * var(--rem));left:calc(.4 * var(--rem));content:"*";color:#ff000080;font-size:180%}.step .field.hidden{display:none}.step .field.with-unit{grid-template-areas:"name name" "input unit" "tooltip tooltip" "error error";grid-template-columns:1fr auto}.step .field.with-unit label{grid-area:name}.step .field.with-unit input,.step .field.with-unit select{grid-area:input;border-right:var(--border-size) solid var(--color-border-input)}.step .field.with-unit .unit{grid-area:unit;background-color:var(--color-background-input);padding:0 var(--padding);display:flex;align-items:center}.step .field.with-unit .field-tooltip{display:flex;gap:calc(.5 * var(--rem));align-items:center;line-height:1.25;grid-area:tooltip;font-size:90%;margin-top:calc(1 * var(--rem));margin-left:calc(.2 * var(--rem));opacity:.76}.step .field.with-unit .field-tooltip:before{content:"🛈 ";font-size:125%}.step .field.with-unit .errors{grid-area:error}.step .field.yearlyPriceChange{position:relative}.step .field.yearlyPriceChange input{display:flex;order:3}.step .field.yearlyPriceChange .value{display:flex;order:2}.step .field .label{margin-bottom:1rem;margin-left:1rem}.step .field select,.step .field button{color:var(--color-text-default)}.step .field .select{display:grid;position:relative}.step .field .select:after{content:"";width:14px;height:8px;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='14.247'%20height='8.688'%20viewBox='0%200%2014.247%208.688'%3e%3cg%20id='select_arrow_down'%20transform='translate(14.247%208.688)%20rotate(180)'%3e%3cg%20id='Group_46'%20data-name='Group%2046'%3e%3cpath%20id='Path_62'%20data-name='Path%2062'%20d='M0,7.143,1.467,8.688,7.1,3.05l5.637,5.637,1.506-1.544L7.1,0Z'%20fill-rule='evenodd'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat;background-size:contain;transform:translateY(-50%);position:absolute;right:28px;top:calc(3 * var(--rem))}.step .field .select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;cursor:pointer}.step .field .select select:focus{border:calc(.2 * var(--rem)) solid #000;border-radius:calc(.2 * var(--rem))}.step .field input[type=text],.step .field input[type=number],.step .field textarea,.step .field select{display:flex;order:1;height:calc(6 * var(--rem));background-color:var(--color-background-input);padding:var(--padding);border:none}.step .field textarea{height:initial;resize:vertical}.step .field .errors{display:flex;flex-direction:column;order:2;margin-top:calc(1 * var(--rem));margin-left:calc(1 * var(--rem))}.step .field .errors p{display:flex;gap:calc(.5 * var(--rem));align-items:center;color:red;font-size:calc(1.4 * var(--rem));font-weight:700}.step .info{margin-bottom:calc(3.5 * var(--rem))}.initial-info .image{justify-self:center;margin-bottom:calc(2 * var(--rem))}.initial-info .title{margin:unset;margin-bottom:calc(2 * var(--rem));text-align:center;text-transform:uppercase;font-size:150%;line-height:unset}@media (min-width: 541px){.initial-info .title{font-size:200%}}main[data-language=de] .initial-info .title{text-transform:unset}.initial-info .description{text-align:center;margin-bottom:calc(3.7 * var(--rem))}main[data-language=de] .initial-info .description{text-align:start}main[data-language=de] .initial-info .description p{margin-bottom:calc(1 * var(--rem))}main[data-language=de] .initial-info .description ul{padding-left:calc(2 * var(--rem))}.step1 section:nth-child(1){align-content:start}.step1 .energy,.step1 .gutter-system,.step1 .installation-mode{display:grid;grid-template-areas:"icon description";grid-template-columns:auto 1fr;align-content:center;align-items:center;border:calc(.1 * var(--rem)) solid var(--color-main);padding:calc(2 * var(--rem));text-align:start;margin-bottom:calc(2.8 * var(--rem));gap:0 calc(2 * var(--rem))}@media (min-width: 541px){.step1 .energy,.step1 .gutter-system,.step1 .installation-mode{gap:0 calc(4 * var(--rem))}}.step1 .energy .icon,.step1 .gutter-system .icon,.step1 .installation-mode .icon{max-width:calc(7 * var(--rem));height:auto;grid-area:icon}@media (min-width: 541px){.step1 .energy .icon,.step1 .gutter-system .icon,.step1 .installation-mode .icon{max-width:calc(10 * var(--rem))}}.step1 .energy .description,.step1 .gutter-system .description,.step1 .installation-mode .description{grid-area:description;font-size:calc(1.6 * var(--rem))}.step1 .energy .description p,.step1 .gutter-system .description p,.step1 .installation-mode .description p{font-weight:700;text-transform:uppercase}.step1 .energy .description strong,.step1 .gutter-system .description strong,.step1 .installation-mode .description strong{font-size:200%}.step1 .gutter-system,.step1 .installation-mode{grid-template-areas:"icon title" "description description" "action action";grid-gap:calc(2 * var(--rem)) calc(2 * var(--rem))}@media (min-width: 541px){.step1 .gutter-system,.step1 .installation-mode{grid-template-areas:"icon title" "icon description" "icon action";grid-gap:calc(1 * var(--rem)) calc(2 * var(--rem))}}.step1 .gutter-system .title,.step1 .installation-mode .title{grid-area:title;text-align:unset;font-size:125%;font-weight:700;margin-bottom:calc(0 * var(--rem))}.step1 .gutter-system .description,.step1 .installation-mode .description{grid-area:description;font-weight:400;text-transform:unset;margin-bottom:calc(0 * var(--rem))}.step1 .gutter-system .description a,.step1 .installation-mode .description a{color:inherit;font-weight:700;text-decoration:underline}.step1 .gutter-system label,.step1 .installation-mode label{grid-area:action}.step1 .description{align-content:start}.step1 .description .title{text-align:center;margin-bottom:calc(1.5 * var(--rem))}@media (min-width: 1025px){.step1 .description .title{text-align:unset}}.step1 .description p{margin-bottom:calc(.5 * var(--rem))}.step1 .description ul{display:flex;flex-direction:column;gap:calc(1 * var(--rem));margin-bottom:calc(1.5 * var(--rem));list-style:none;padding-left:0}.step1 .description ul li{display:flex;gap:calc(.5 * var(--rem));align-items:center}.step1 .description ul li:before{content:"●";display:grid;align-self:start}.step1 nav.bottom{justify-content:end}.step1 .investment-date fieldset{display:grid;gap:calc(1.9 * var(--rem)) 0;padding:0 var(--padding)}.step1 .investment-date fieldset legend{margin-bottom:calc(2 * var(--rem));width:max-content}.step1 .investment-date fieldset div{align-items:center}.step1 .info-box{display:grid;grid-template-areas:"icon title" "icon description";gap:0 calc(2 * var(--rem));align-items:center;background:#ffedb733;margin-bottom:calc(1 * var(--rem));padding:calc(2 * var(--rem)) calc(2 * var(--rem))}.step1 .info-box.hidden{display:none}.step1 .info-box img{grid-area:icon}.step1 .info-box p.label{grid-area:title;grid-column:unset;margin:unset;margin-bottom:calc(.5 * var(--rem))}.step1 .info-box .description{grid-area:description;margin:unset;color:#000c;font-weight:100}.step1 .field.investment .label{font-weight:700}.step1 .field.investment .investment-types{display:grid;grid-template-columns:1fr 1fr;gap:0 calc(2 * var(--rem))}.step1 .field.investment .investment-types>div{display:grid}.step1 .field.investment .investment-types>div.selected .investment-type,.step1 .field.investment .investment-types>div.selected .selected{font-weight:700}.step1 .field.investment .investment-types>div.not-selected{border-width:calc(1 * var(--border-size));opacity:.5}.step1 .field.investment .investment-types fieldset{grid-column:1/span 2}.step1 .field.investment .investment-types fieldset:not(.selected){display:none}@media (min-width: 541px){.step1 .field.investment .investment-types fieldset{grid-column:unset}.step1 .field.investment .investment-types fieldset:not(.selected){display:block}}.step1 .field.investment .investment-types fieldset label{margin-bottom:calc(1 * var(--rem))}.step1 .field.investment .investment-types fieldset label.selected{font-weight:700}.step1 .field.investment .investment-type{position:relative;display:grid;justify-items:center;align-content:center;cursor:pointer;border:var(--color-main) solid calc(2 * var(--border-size));margin-bottom:calc(1.5 * var(--rem));height:calc(11 * var(--rem));padding:calc(1 * var(--rem))}@media (min-width: 541px){.step1 .field.investment .investment-type{height:calc(9 * var(--rem))}}.step1 .field.investment .investment-type input{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:100%;position:absolute;top:0;left:0}.step1 .field.investment .investment-type img{max-width:calc(7 * var(--rem));height:auto}.step1 .field.investment fieldset{display:grid}.step1 .field.investment fieldset label{display:grid;grid-template-columns:auto 1fr;gap:calc(.5 * var(--rem));align-items:baseline}@media (min-width: 541px){.step1 .info-box.address{grid-column:1/span 2}}.step1 .info-box.address .label,.step1 .info-box.project .label{font-weight:700}@media (min-width: 541px){.step1 .place{display:grid;grid-template-columns:1fr 2fr;gap:0 calc(1.4 * var(--rem))}}@media (min-width: 541px){.step1 .place .label{grid-column:1/span 2}}.step1 .place section{gap:0 calc(1.4 * var(--rem));margin-bottom:calc(2 * var(--rem));gap:calc(1.4 * var(--rem))}@media (min-width: 541px){.step1 .place section{grid-auto-flow:column;grid-column:1/span 2}}.step1 .place section .localization{display:grid;gap:calc(1.4 * var(--rem))}@media (min-width: 541px){.step1 .place section .localization{grid-template-columns:1fr auto;gap:unset}}.step1 .place section .localization input{order:1}.step1 .place section .localization input[disabled]{cursor:not-allowed}.step1 .place section .localization button{display:flex;align-items:center;gap:calc(.5 * var(--rem));order:2;border:none;background-color:var(--color-background-input);border-left:calc(.2 * var(--rem)) solid rgb(240,240,240);font-size:calc(1.2 * var(--rem));padding:calc(2 * var(--rem));justify-content:center;text-transform:uppercase;cursor:pointer}.step1 .place section .localization button[disabled]{cursor:not-allowed}.step1 .place section .localization .errors{order:3}.step1 .place fieldset legend{margin-bottom:calc(2 * var(--rem));width:max-content}.step1 .place .roof-type-wrapper{margin-top:calc(2 * var(--rem))}@media (min-width: 541px){.step1 .place .roof-type-wrapper{grid-column:1/span 2}}.step1 .place .roof-type-wrapper fieldset.roof-type{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(1.4 * var(--rem))}@media (min-width: 541px){.step1 .place .roof-type-wrapper fieldset.roof-type{grid-template-columns:repeat(7,1fr)}}.step1 .place .roof-type-wrapper fieldset.roof-type div.option{position:relative;display:grid;border:var(--color-main) solid var(--border-size);height:calc(9.5 * var(--rem))}.step1 .place .roof-type-wrapper fieldset.roof-type div.option[data-roof-type=other]{grid-column:2}@media (min-width: 541px){.step1 .place .roof-type-wrapper fieldset.roof-type div.option[data-roof-type=other]{grid-column:unset}}.step1 .place .roof-type-wrapper fieldset.roof-type div.option.selected{border:var(--color-main) solid calc(3 * var(--border-size))}.step1 .place .roof-type-wrapper fieldset.roof-type div.option:not(.selected){opacity:.5}.step1 .place .roof-type-wrapper fieldset.roof-type div.option[data-roof-type=other]{gap:unset}.step1 .place .roof-type-wrapper fieldset.roof-type div.option[data-roof-type=other] label{display:block;position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%,-50%);text-transform:uppercase;font-weight:700}.step1 .place .roof-type-wrapper fieldset.roof-type div.option label{display:none}.step1 .place .roof-type-wrapper fieldset.roof-type div.option img{position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%,-50%)}.step1 .place .roof-type-wrapper fieldset.roof-type div.option input{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;width:100%;height:100%;top:0;left:0}.step1 .place .roof-type-wrapper fieldset.roof-type div.option input:hover{cursor:pointer}.step1 .place .roof-type-wrapper fieldset.roof-type div.option input:active{border:var(--color-main) solid calc(3 * var(--border-size))}.step1 .place .roof-both-sides{grid-column:1/span 2}.step1 .place .custom-control,.step1 .place .compass-rose,.step1 .place .map-tooltip,.step1 .place .errors.hidden{display:none}.step1 .place .map-container .description .title{font-size:calc(1.6 * var(--rem));margin-bottom:calc(1 * var(--rem))}.step1 .place .map-container .description img{margin:0 auto;margin-bottom:calc(1 * var(--rem))}.step1 .place .map-container .description .text{text-align:center;font-size:calc(1.4 * var(--rem));line-height:1.4;margin:calc(1 * var(--rem)) auto calc(2 * var(--rem));max-width:80%}@media (min-width: 541px){.step1 .place .map-container{grid-column:1/span 2}}.step1 .place .map{height:calc(50 * var(--rem));position:relative}@media (min-width: 541px){.step1 .place .map{height:calc(50 * var(--rem))}}.step1 .place .map.hidden{display:none}.step1 .place .map .custom-control{width:100%;display:flex;justify-content:end;background-color:var(--color-background-map)}.step1 .place .map .custom-control button{border:none;background-color:transparent;display:flex;align-items:center;color:#fff;padding:calc(1 * var(--rem)) calc(1 * var(--rem))}.step1 .place .map .custom-control button:active{background-color:#ffffff1a}.step1 .place .map .custom-control button.help{display:none}@media (min-width: 541px){.step1 .place .map .custom-control button.help{display:none}}.step1 .place .map .compass-rose{display:none}@media (min-width: 541px){.step1 .place .map .compass-rose{width:calc(6 * var(--rem));height:calc(6 * var(--rem));background-color:var(--color-background-map);display:grid;justify-content:center;align-content:center;margin:calc(1 * var(--rem))}}.step1 .place .map .instruction{position:absolute;text-align:center;width:85%;left:50%;transform:translate(-50%,25%);font-size:calc(2 * var(--rem));line-height:1.5;padding:calc(1 * var(--rem));background-color:var(--color-background-map);color:var(--color-main);text-shadow:calc(.1 * var(--rem)) calc(.1 * var(--rem)) calc(.3 * var(--rem)) rgb(0,0,0);-webkit-backdrop-filter:blur(calc(.5 * var(--rem)));backdrop-filter:blur(calc(.5 * var(--rem)))}.step1 .place .map .instruction.hidden{display:none}.step1 .place .map .instruction [data-required=true]:after{transform:unset}@media (min-width: 541px){.step1 .place .map .instruction{transform:unset;position:absolute;display:flex;top:calc(2 * var(--rem));left:unset;right:calc(2 * var(--rem));padding:calc(2 * var(--rem));width:45%;font-size:calc(1.8 * var(--rem));line-height:1.5;text-align:center}}.step1 .place .map .instruction .image{width:100%;margin-bottom:calc(1 * var(--rem));max-height:calc(22 * var(--rem))}@media (min-width: 541px){.step1 .place .map .instruction .image{display:none}}.step1 .place .map .instruction .text.mobile{display:block}@media (min-width: 541px){.step1 .place .map .instruction .text.mobile{display:none}}.step1 .place .map .instruction .text.desktop{display:none}@media (min-width: 541px){.step1 .place .map .instruction .text.desktop{display:block}}.step1 .place .area{display:flex;align-items:center;gap:calc(.5 * var(--rem));align-content:center;background:var(--color-main);padding:calc(1 * var(--rem))}.step1 .place .area.hidden,.step1 .place .area.invalid{display:none}@media (min-width: 541px){.step1 .place .area{grid-column:1/span 2}}@media (min-width: 1025px){.step1 .place .area{padding:calc(1 * var(--rem));height:calc(6 * var(--rem))}}.step1 .place .area span{font-weight:700;font-size:calc(1.4 * var(--rem))}@media (min-width: 541px){.step1 .place .area span{font-size:calc(1.6 * var(--rem))}}.step1 .roof-details{display:grid;gap:calc(2 * var(--rem)) 0}@media (min-width: 541px){.step1 .roof-details{grid-template-columns:1fr 1fr;gap:0 calc(2 * var(--rem))}}.step1 .roof-details .label{margin-left:unset;font-weight:700;margin-bottom:unset;margin-left:calc(1 * var(--rem))}.step1 .roof-details .description{margin-bottom:calc(1.5 * var(--rem));margin-left:calc(1 * var(--rem))}.step1 .roof-details input{width:100%}@media (min-width: 541px){.step1 .roof-position{margin-bottom:calc(2 * var(--rem))}}.step1 .roof-position .label{font-weight:700;margin-left:calc(1 * var(--rem))}.step1 .roof-position .description{margin-left:calc(1 * var(--rem))}.step1 .roof-position section{display:grid;padding:calc(2 * var(--rem)) 0;gap:calc(2 * var(--rem)) 0;padding-bottom:unset}@media (min-width: 541px){.step1 .roof-position section{grid-template-columns:1fr 1fr;gap:0 calc(2 * var(--rem))}}.step1 .roof-position section .roof{display:grid;align-items:center;justify-content:center}@media (min-width: 541px){.step1 .roof-position section .roof{border:var(--color-main) solid calc(2 * var(--border-size))}}.step1 .roof-position section .roof img{width:calc(17 * var(--rem));height:auto}.step1 .roof-position section .direction{display:grid;position:relative;align-items:center;justify-content:center;justify-self:center;width:calc(20 * var(--rem));height:calc(20 * var(--rem))}.step1 .roof-position section .direction label{position:absolute;top:0;left:0}.step1 .roof-position section .direction label.N{top:0;left:50%;transform:translate(-20%)}.step1 .roof-position section .direction label.NE{left:unset;top:25%;right:0;transform:translate(-50%,-50%)}.step1 .roof-position section .direction label.E{left:unset;top:50%;right:0;transform:translate(65%,-50%)}.step1 .roof-position section .direction label.SE{top:unset;left:unset;right:0;bottom:25%;transform:translate(-50%,50%)}.step1 .roof-position section .direction label.S{top:unset;left:50%;bottom:0;transform:translate(-20%)}.step1 .roof-position section .direction label.SW{top:unset;left:20%;bottom:25%;transform:translate(-50%,50%)}.step1 .roof-position section .direction label.W{left:0;top:50%;transform:translate(-50%,-50%)}.step1 .roof-position section .direction label.NW{left:20%;top:20%;transform:translate(-50%)}.step1 .roof-position section .direction label:not(.checked) span{visibility:hidden}.step1 .roof-dimensions{grid-template-columns:auto 1fr;grid-template-areas:"icon title" "icon label" "section section";gap:0 calc(2 * var(--rem));border:var(--color-main) solid calc(2 * var(--border-size));padding:calc(2 * var(--rem))}@media (min-width: 541px){.step1 .roof-dimensions{grid-template-columns:auto 1fr;grid-template-areas:"icon title" "icon label" "icon section";padding:calc(3 * var(--rem))}}.step1 .roof-dimensions img.icon{grid-area:icon}.step1 .roof-dimensions p.label{grid-area:title;margin:unset;margin-bottom:calc(1 * var(--rem));text-transform:uppercase;font-weight:700;font-size:calc(2 * var(--rem))}.step1 .roof-dimensions>label{grid-area:label;margin:unset}.step1 .roof-dimensions section.dimensions{justify-self:center;margin-top:calc(3 * var(--rem));grid-area:section;grid-template-areas:"image" "fieldset" "button"}@media (min-width: 541px){.step1 .roof-dimensions section.dimensions{justify-self:unset;grid-template-areas:"fieldset image" "button ."}}.step1 .roof-dimensions section.dimensions fieldset{grid-area:fieldset;margin-bottom:calc(3 * var(--rem))}.step1 .roof-dimensions section.dimensions fieldset .label{display:flex;margin-bottom:calc(1 * var(--rem))}.step1 .roof-dimensions section.dimensions fieldset div.invalid{display:grid}.step1 .roof-dimensions section.dimensions fieldset div.invalid label{margin-bottom:unset}.step1 .roof-dimensions section.dimensions fieldset div.invalid .errors{margin-left:calc(2 * var(--rem));margin-bottom:calc(2 * var(--rem))}.step1 .roof-dimensions section.dimensions fieldset div label{display:flex;align-items:baseline;gap:calc(1 * var(--rem));margin-bottom:calc(1 * var(--rem))}.step1 .roof-dimensions section.dimensions fieldset div label .dimension{order:1}.step1 .roof-dimensions section.dimensions fieldset div label input{order:2}@media (min-width: 541px){.step1 .roof-dimensions section.dimensions fieldset div label input{width:50%}}.step1 .roof-dimensions section.dimensions fieldset div label .unit{order:3}@media (min-width: 541px){.step1 .roof-dimensions section.dimensions button{width:calc(12.3 * var(--rem));margin-left:1rem}}.step1 .roof-dimensions section.dimensions img{grid-area:image;height:auto;align-self:center;justify-self:center;margin-bottom:calc(2 * var(--rem));width:calc(18 * var(--rem))}@media (min-width: 541px){.step1 .roof-dimensions section.dimensions img{width:calc(22 * var(--rem));margin-bottom:calc(3 * var(--rem))}}.step1 .roof-dimensions section.dimensions button{grid-area:button;border:var(--color-main) solid calc(2 * var(--border-size));background-color:var(--color-background-input);padding:calc(1.5 * var(--rem));font-size:calc(1.6 * var(--rem));font-weight:700;text-transform:uppercase}.step1 .upload>p{margin-left:calc(1 * var(--rem))}.step1 .upload .label{font-weight:700}.step1 .upload .description{margin-bottom:calc(1 * var(--rem))}.step1 .upload .field input[type=file]{display:none}.step1 .upload .field div{display:grid;grid-template-columns:1fr 1fr}@media (min-width: 541px){.step1 .upload .field div{grid-template-columns:1fr auto}}.step1 .upload .field div button{background-color:var(--color-main);border:none;order:2;padding:0 calc(2 * var(--rem));font-size:calc(1.6 * var(--rem));font-weight:700;text-transform:uppercase}.step1 .upload .field div input,.step1 .upload .field div textarea{order:1}@media (min-width: 541px){.step1 .field{margin-bottom:calc(2 * var(--rem))}.step1 .energy,.step1 .gutter-system,.step1 .installation-mode{justify-content:center;margin-bottom:calc(2 * var(--rem))}}.step2.empty{align-items:baseline}.step2 .energy,.step2 .gutter-system{padding-bottom:unset;gap:unset;justify-content:center;margin-bottom:calc(4.7 * var(--rem));height:min-content}.step2 .energy img,.step2 .gutter-system img{max-width:unset;width:calc(8.8 * var(--rem));margin-bottom:calc(3 * var(--rem))}.step2 .energy h3,.step2 .gutter-system h3{text-transform:uppercase;font-size:calc(1.8 * var(--rem));margin-bottom:calc(4.2 * var(--rem))}.step2 .energy span,.step2 .gutter-system span{font-size:calc(1.6 * var(--rem));margin-bottom:calc(4.2 * var(--rem))}@media (min-width: 541px){.step2{grid-template-columns:1fr 1fr;gap:calc(2 * var(--rem))}.step2 nav.bottom{grid-column:1/span 2}}.step2 fieldset{margin-bottom:calc(1.5 * var(--rem))}.step2 fieldset:last-of-type{margin-bottom:calc(4.7 * var(--rem))}.step2 fieldset legend{margin-bottom:calc(1.8 * var(--rem))}.step2 fieldset>div{align-items:baseline;font-size:calc(1.4 * var(--rem));margin-bottom:calc(1.9 * var(--rem))}.step2 section{align-content:start}.step2 .field.people fieldset{display:grid;gap:calc(2 * var(--rem)) 0}.step2 .field.people fieldset label{grid-area:unset;display:flex;gap:1rem}.step2 .field.people fieldset label.large{display:grid;grid-template-areas:"radio label" ". number";grid-template-columns:auto 1fr}.step2 .field.people fieldset label input[type=radio]{grid-area:radio}.step2 .field.people fieldset label .label{grid-area:label}.step2 .field.people fieldset label input[type=number]{grid-area:number}.step2 nav.bottom,.step3 nav.bottom,.step4 nav.bottom{justify-content:space-between}.step3 table{margin-bottom:calc(1.5 * var(--rem));border-spacing:calc(.2 * var(--rem));border-collapse:separate}.step3 table.green tr td{background-color:var(--color-green-energy)}.step3 table.green tr td .inline{gap:calc(.5 * var(--rem))}.step3 table.green tr td .inline img{max-width:calc(1.3 * var(--rem))}@media (min-width: 541px){.step3 table.green{margin-bottom:calc(4.7 * var(--rem))}}.step3 table td{padding:calc(1 * var(--rem));background-color:var(--color-main)}@media (min-width: 541px){.step3 table td{padding:calc(2 * var(--rem))}}.step3 table td:nth-child(2){font-weight:700}.step3 table td:nth-child(2),.step3 table td:nth-child(3){text-align:center}.step3 table td .wrap{font-weight:700;display:flex;flex-direction:column;align-items:flex-end}.step3 table td .inline{display:flex;gap:calc(1 * var(--rem))}.step3 .chart{min-height:calc(20 * var(--rem))}@media (min-width: 541px){.step4 .field.full-width{grid-column:1/span 2}}@media (min-width: 541px){.step4{padding-top:calc(2.5 * var(--rem))}}.step4 .title{margin:unset;margin-bottom:calc(3.7 * var(--rem));text-align:center}.step4 .description{align-content:start}.step4 .description .title{text-align:center;margin-bottom:calc(1.5 * var(--rem))}@media (min-width: 1025px){.step4 .description .title{text-align:unset}}.step4 .description p{margin-bottom:calc(.5 * var(--rem))}.step4 .client{display:flex;flex-direction:column;margin-bottom:calc(2.5 * var(--rem))}@media (min-width: 541px){.step4 .client{grid-column:1/span 2;margin-bottom:calc(3.7 * var(--rem))}}.step4 .client .title{margin:0;text-transform:uppercase;margin-bottom:calc(1.5 * var(--rem))}.step4 .client .errors{margin-left:auto;margin-right:auto}.step4 .client div{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;--gap: calc(1 * var(--rem));gap:var(--gap);list-style:none;padding:0}@media (min-width: 541px){.step4 .client div{width:75%;margin:0 auto}}.step4 .client div input[type=radio]{opacity:0;position:fixed;width:0}.step4 .client div input[type=radio]:checked+label{background-color:var(--color-main);border-color:var(--color-main)}.step4 .client div label{box-sizing:border-box;padding:calc(.5 * var(--rem));border:calc(.1 * var(--rem)) solid #000;font-weight:700;text-align:center}@media (min-width: 541px){.step4 .client div label{font-size:initial}.step4 .client div label:nth-of-type(-n+3){width:calc((100% - 2 * var(--gap)) / 3)}}.step4 .client div label:hover{cursor:pointer}@media (min-width: 541px){.step4 .inputs{display:grid;gap:0 calc(1.6 * var(--rem));grid-template-columns:1fr 1fr}}.step4 .address-display{display:flex;align-items:center;justify-content:flex-start;min-height:calc(6 * var(--rem));padding:var(--padding)}.step4 .address-display .address-text{display:flex;align-items:center;color:var(--color-text-default);font-size:calc(1.4 * var(--rem));line-height:1.4;word-break:break-word}.step4.step4-sending{opacity:.5;cursor:not-allowed}.step4 .consent{margin-bottom:unset;align-items:center;font-size:calc(1.2 * var(--rem));grid-template-columns:auto 1fr;gap:0 calc(3.1 * var(--rem))}.step4 .consent.consent1{margin-bottom:calc(2 * var(--rem))}.step4 .consent.consent2{margin-bottom:calc(3.8 * var(--rem))}.step4 .consent .errors{order:3;grid-column:2;margin-left:unset}.step4 .consent label{display:flex;order:2}.step4 .consent input{display:flex;order:1}.step4 .consent a{text-decoration:underline}.step4 .city input[disabled]{cursor:not-allowed}.step4 .comments>p,.step4 .upload>p,.step4 .coupon>p{margin-bottom:calc(1.6 * var(--rem));margin-left:calc(1 * var(--rem))}.step4 .comments .field input[type=file],.step4 .upload .field input[type=file],.step4 .coupon .field input[type=file]{display:none}.step4 .comments .field div,.step4 .upload .field div,.step4 .coupon .field div{display:grid;grid-template-columns:1fr 1fr}@media (min-width: 541px){.step4 .comments .field div,.step4 .upload .field div,.step4 .coupon .field div{grid-template-columns:1fr auto}}.step4 .comments .field div button,.step4 .upload .field div button,.step4 .coupon .field div button{background-color:var(--color-main);border:none;order:2;padding:0 calc(2 * var(--rem));font-size:calc(1.6 * var(--rem));font-weight:700;text-transform:uppercase}.step4 .comments .field div input,.step4 .comments .field div textarea,.step4 .upload .field div input,.step4 .upload .field div textarea,.step4 .coupon .field div input,.step4 .coupon .field div textarea{order:1}.step4 .info{font-size:calc(1.1 * var(--rem));background-color:#ffedb736;padding:calc(2 * var(--rem))}@media (min-width: 541px){.step4 .info{font-size:calc(1.4 * var(--rem))}}.step4 nav button.back{margin-bottom:calc(1.6 * var(--rem))}.step4 button[type=submit]{text-transform:uppercase;margin-bottom:calc(1.6 * var(--rem))}.step4 button[type=submit][data-sent=true]{background-color:var(--color-sent);color:#fff;text-shadow:1px 1px 1px #000;cursor:not-allowed}.step4 .step4-error{text-align:right;font-weight:700;margin-bottom:calc(1.6 * var(--rem));color:red}fieldset{border:none;padding:0}fieldset legend{font-weight:700}fieldset div{display:flex;gap:calc(.5 * var(--rem))}fieldset div input{order:1}fieldset div label{order:2}.energy,.gutter-system,.installation-mode{display:flex;flex-direction:column;align-items:center;gap:calc(1 * var(--rem));border:calc(.1 * var(--rem)) solid var(--color-main);padding:calc(2 * var(--rem));text-align:center}.energy .icon,.gutter-system .icon,.installation-mode .icon{width:calc(10 * var(--rem));height:auto}.energy .title,.gutter-system .title,.installation-mode .title{font-size:calc(1.5 * var(--rem));font-weight:700;margin-bottom:calc(1 * var(--rem))}.energy .description,.gutter-system .description,.installation-mode .description{text-align:unset}.thank-you{display:none;background-color:#fff;align-content:center;padding:0 calc(2 * var(--rem))}.thank-you .title{text-transform:uppercase;font-size:150%}@media (min-width: 541px){.thank-you .title{font-size:200%}}.thank-you .description{margin-bottom:calc(5 * var(--rem))}.thank-you .description p{text-align:center;margin-bottom:calc(1 * var(--rem))}.thank-you section.buttons{display:grid;gap:calc(1 * var(--rem)) 0}@media (min-width: 541px){.thank-you section.buttons{grid-template-columns:repeat(3,auto);gap:0 calc(1.5 * var(--rem));justify-content:center}}.thank-you section.buttons a{font-size:calc(1.6 * var(--rem));display:grid;text-decoration:none}.thank-you section.buttons a.contact button{background-color:#000;color:#fff}.thank-you section.buttons a button{padding:calc(1.8 * var(--rem));border:none;font-size:calc(1.6 * var(--rem));font-weight:700;color:var(--color-text-default);background-color:var(--color-main);text-transform:uppercase}.thank-you section.contact{text-align:center}.thank-you section.contact h2{margin-bottom:calc(2 * var(--rem))}.thank-you section.contact strong{font-size:150%;color:var(--color-main)}.field input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;border-left:calc(var(--border-size) * 2) solid #000;border-right:calc(var(--border-size) * 2) solid #000;background-color:transparent;padding:unset;height:calc(2 * var(--rem))}.field input[type=range]:focus{outline:none}.field input[type=range]:focus::-webkit-slider-runnable-track{background-color:#000}.field input[type=range]::-webkit-slider-runnable-track{width:100%;height:var(--border-size);cursor:pointer;background:#000;border:.2px solid #010101}.field input[type=range]::-webkit-slider-thumb{width:100%;border:var(--border-size) solid #000;--size: calc(2 * var(--rem));height:var(--size);width:var(--size);border-radius:calc(.5 * var(--size));background:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-top:calc(-.5 * var(--size))}.field input[type=range]::-moz-range-track{width:100%;height:calc(2 * var(--border-size));cursor:pointer;background:#000}
