.step{min-height:60dvh}.step-1__title{justify-content:space-between;display:flex}.step-1__title .left{font-family:DM Mono,monospace}.step-1__title .left span{-webkit-text-fill-color:#0000;background-image:linear-gradient(45deg,#22459c,#00c8ff);-webkit-background-clip:text;background-clip:text;font-family:inherit;font-weight:700}.step-1__body{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.step-1__body .select{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:linear-gradient(#f6f6f680 .67%,#ffffff80 98.28%);border:1px solid #fff;border-radius:.5rem;width:100%;position:relative;box-shadow:0 -2px 8px -5px #0003,0 2px #cfcfcf,0 7px 16px -9px #0000004d,inset 0 0 8px -4px #00000080,inset -2px -2px 2px #fff}.step-1__body .select:hover{background-color:#f7f7f7}.step-1__body .select .wrapper{justify-content:space-between;align-items:start;gap:1rem;width:100%;display:flex}.step-1__body .select .wrapper .circle{aspect-ratio:1;background:linear-gradient(#fff 0%,#f4f4f4 100%);border-radius:50%;outline:1px solid #00000014;width:32px;height:32px;padding:.25rem}.step-1__body .select .wrapper .circle__inner{background:#fff;border:1px solid #fff;border-radius:50%;height:100%;transition:all .2s;box-shadow:0 -2px 8px -5px #00000026,0 1px 1px #b9b9b926,0 7px 16px -9px #000,inset 0 0 8px -3px #0006,inset -2px -2px 2px #fff}.step-1__body .select .wrapper .right{margin-right:auto}.step-1__body .select .wrapper p{opacity:.5;font-size:clamp(.75rem,2vw,.85rem);line-height:1.2}.step-1__body .select .wrapper h3{margin-bottom:.25rem;font-size:clamp(.85rem,2.5vw,1rem)}.step-1__body .select label{align-items:center;height:100%;display:flex;overflow:hidden}.step-1__body .select .wrapper svg{font-size:3rem}.step-1__body .select label>.wrapper{cursor:pointer;padding:1rem 1.25rem;overflow:hidden}.step-1__body .select label>*{-webkit-user-select:none;user-select:none}.step-1__body .select input[type=checkbox]{cursor:pointer;opacity:0;width:100%;height:100%;position:absolute}.step-1__body .select:has(input:checked) .circle .circle__inner{background:#2bff00;box-shadow:0 0 8px #2bff00,0 -2px 8px -5px #00000040,0 1px 1px #b9b9b940,0 7px 16px -9px #000,inset -2px -2px 2px #0000001a,inset 2px 2px 2px #ffffff40,inset 0 0 8px -3px #00000080,inset -2px -2px 8px -2px #00000040}@media (max-width:768px){.step-1__title{align-items:end}.step-1__title h2{max-width:65vw;line-height:1}.step-1__title span{white-space:nowrap}.step-1__body{grid-template-columns:1fr}}
.option{background:linear-gradient(#f6f6f6 .67%,#fff 98.28%);border:1px solid #fff;border-radius:.5rem;justify-content:space-between;align-items:center;width:100%;padding:.85rem 1rem;display:flex;position:relative;box-shadow:0 -2px 8px -5px #0003,0 2px #cfcfcf,0 7px 16px -9px #0000004d,inset 0 0 8px -4px #00000080,inset -2px -2px 2px #fff}.option label,.option input{opacity:0;width:100%;height:100%;position:absolute;top:0;left:0}.option:has(input:checked) .circle .circle__inner{background:#2bff00;box-shadow:0 0 8px #2bff00,0 -2px 8px -5px #00000040,0 1px 1px #b9b9b940,0 7px 16px -9px #000,inset -2px -2px 2px #0000001a,inset 2px 2px 2px #ffffff40,inset 0 0 8px -3px #00000080,inset -2px -2px 8px -2px #00000040}.option p{text-transform:capitalize;font-size:clamp(.85rem,1.5vw,1rem);font-weight:800}.option .circle{background:linear-gradient(#fff 0%,#f4f4f4 100%);border-radius:50%;outline:1px solid #00000014;width:32px;height:32px;padding:.25rem}.option .circle__inner{background:#fff;border:1px solid #fff;border-radius:50%;height:100%;transition:all .2s;box-shadow:0 -2px 8px -5px #00000026,0 1px 1px #b9b9b926,0 7px 16px -9px #000,inset 0 0 8px -3px #0006,inset -2px -2px 2px #fff}
.step-2__title h2{font-weight:300}.step-2__title span{font-family:DM Serif Display,serif;font-style:italic;font-weight:600}.step-2__body{flex-flow:column wrap;gap:4rem;margin-top:2rem;display:flex}.step-2__body .budget,.step-2__body .timeline{flex-flow:column wrap;gap:.25rem;display:flex}.step-2__body .budget h3,.step-2__body .timeline h3{font-size:1.15rem;font-weight:300}.step-2__body .budget__options,.step-2__body .timeline__options{gap:2rem;display:flex}.step-2__body .budget__options p,.step-2__body .timeline__options p{font-size:1rem}@media (max-width:768px){.step-2__title{font-size:1rem;line-height:1}.step-2__body .budget__options,.step-2__body .timeline__options{flex-direction:column;gap:1rem}}
.step-3__title{line-height:1}.step-3__body{flex-direction:column;gap:2rem;width:100%;display:flex}.step-3__body .input-field.textarea label{justify-content:space-between;display:flex}.step-3__body .input-field.textarea label span{font-family:DM Mono,monospace;font-size:.75rem;font-weight:300}
.input-field{flex-direction:column;gap:.25rem;display:flex;position:relative}.input-field .error-message{color:#ff4d4f;margin-top:.25rem;font-family:DM Mono,monospace;font-size:.75rem;display:none;position:absolute;right:0}.input-field label{font-size:clamp(.85rem,1.5vw,1rem);font-weight:800}.input-field input,.input-field textarea{background:linear-gradient(#f6f6f6 .67%,#fff 98.28%);border:1px solid #fff;border-radius:.5rem;width:100%;padding:1rem;box-shadow:0 -2px 8px -5px #0003,0 2px #cfcfcf,0 7px 16px -9px #0000004d,inset 0 0 8px -4px #00000080,inset -2px -2px 2px #fff}.input-field input:invalid:not(:focus):not(:placeholder-shown),.input-field textarea:invalid:not(:focus):not(:placeholder-shown){border-color:#ff4d4f}.input-field input:invalid:not(:focus):not(:placeholder-shown)+.error-message,.input-field textarea:invalid:not(:focus):not(:placeholder-shown)+.error-message{display:block}.input-field input:focus-within,.input-field textarea:focus-within{outline:none}
.step-4{flex-direction:column;justify-content:center;align-items:center;display:flex;gap:2rem!important}.step-4__image{width:100%;height:250px;position:relative}.step-4__image img{object-fit:contain}.step-4__message{flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex}.step-4__message h1{text-align:center;text-wrap:pretty;font-family:DM Serif Display,serif;font-size:clamp(1.5rem,4vw,2.5rem);font-style:italic;line-height:1}.step-4__message p{text-align:center;max-width:600px;font-size:clamp(1rem,2.5vw,1.25rem)}
.get-quote{padding:1rem 2rem;position:relative}.get-quote__wrapper{isolation:isolate;flex-direction:column;gap:2rem;max-width:1000px;margin:0 auto;display:flex;position:relative}.get-quote .progress{justify-content:space-evenly;align-items:center;height:40px;padding:.5rem 0;display:flex;position:relative;overflow:visible;-webkit-mask-image:linear-gradient(90deg,#0000 1%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 1%,#000 10% 90%,#0000 100%)}.get-quote .progress__tree{z-index:0;background:#eee;width:100%;height:4px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.get-quote .progress__tree:after{content:"";transform-origin:0;width:100%;height:100%;transform:scaleX(calc(var(--progress,1) / 1.25));background:linear-gradient(45deg,#22459c,#00c8ff);font-size:2rem;transition:all .5s .1s;position:absolute;top:0;left:0}.get-quote .progress__step{z-index:1;background:linear-gradient(#fff 0%,#f4f4f4 100%);border-radius:50%;outline:1px inset #0000000d;width:32px;height:32px;transition:all .2s;position:relative;box-shadow:0 2px 6px -2px #0003}.get-quote .progress__step:has(~.active){background-image:linear-gradient(45deg,#22459c,#00c8ff)}.get-quote .progress__step:has(~.active):after{color:#fff}.get-quote .progress__step.active{border:1px solid #00c8ff}.get-quote .progress__step.active:after{color:#1d740b}.get-quote .progress__step:after{content:attr(data-index);color:#000;font-size:1rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.get-quote .title{z-index:1;position:relative}.get-quote .title h1{font-family:DM Serif Display,serif;font-style:italic}.get-quote .title .error{color:#e03131;background-color:#fff4f4;border:1px solid #e03131;border-radius:.25rem;align-items:center;gap:.5rem;margin-top:.5rem;padding:.5rem 1rem;font-size:.9rem;display:flex}.get-quote .steps{z-index:1;position:relative}.get-quote .steps__ctas{align-self:flex-end;gap:1rem;display:flex}.get-quote .steps .step{flex-direction:column;gap:1rem;display:flex}
.quote-confirmation{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9;background:#ffffff1a;width:100%;height:100%;padding:1rem;position:fixed;top:0;left:0}.quote-confirmation .backdrop{z-index:-1;width:100%;height:100%;position:absolute;top:0;left:0}.quote-confirmation hr{opacity:.2;margin-inline:-1rem}.quote-confirmation__wrapper{isolation:isolate;background:linear-gradient(#f6f6f6 .67%,#fff 98.28%);border:1px solid #fff;border-radius:1rem;outline:1px solid #0000001a;flex-direction:column;gap:1rem;width:100%;max-width:1000px;max-height:95vh;margin:0 auto;padding:1rem;display:flex;position:relative;overflow:scroll;box-shadow:0 -2px 8px -5px #0003,0 2px #cfcfcf,0 7px 16px -9px #0000004d,inset 0 0 8px -4px #00000080,inset -2px -2px 2px #fff}.quote-confirmation__wrapper>*{margin-bottom:.25rem}.quote-confirmation__wrapper>img{object-fit:contain;z-index:-1;position:absolute;left:unset!important;width:20vw!important;right:0!important}.quote-confirmation h3{color:#0000;background-image:linear-gradient(45deg,#22459c,#00c8ff);-webkit-background-clip:text;background-clip:text;width:fit-content;font-family:DM Serif Display,serif;font-size:clamp(1.5rem,2vw,2rem);font-style:italic}.quote-confirmation h4{font-family:DM Serif Display,serif;font-size:clamp(1.2rem,1.2vw,1.5rem);font-style:italic;font-weight:300}.quote-confirmation .contact{flex-flow:column wrap;display:flex}.quote-confirmation .contact__details{flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-top:.5rem;display:flex}.quote-confirmation .contact__details p{justify-content:center;align-items:center;gap:.25rem;display:flex}.quote-confirmation .services{flex-direction:column;gap:.5rem;display:flex}.quote-confirmation .services ul{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.quote-confirmation .services ul li{background:linear-gradient(#f6f6f6 .67%,#fff 98.28%);border:1px solid #fff;border-radius:.5rem;padding:.75rem 1rem;list-style-type:none;position:relative;box-shadow:0 -2px 8px -5px #0003,0 2px #cfcfcf,0 7px 16px -9px #0000004d,inset 0 0 8px -4px #00000080,inset -2px -2px 2px #fff}.quote-confirmation .additional-info{flex-wrap:wrap;gap:2rem;display:flex}.quote-confirmation .additional-info .budget,.quote-confirmation .additional-info .timeline{flex-direction:column;gap:.5rem;display:flex}.quote-confirmation .ctas{justify-content:flex-end;align-items:flex-end;gap:1rem;display:flex}@media (min-width:1000px){.quote-confirmation{justify-content:center;align-items:center;display:flex}}
