@import 'partials';
.get-banner{ background:url(../img/get-banner.png) no-repeat top center / cover; min-height: 410px; position: relative; display: flex; padding: 80px 0;
    @media ($sm-1679){min-height: 390px;}
    @media ($sm-1441){min-height: 340px;}
    @media ($sm-991){min-height: 300px;}
    @media ($sm-479){ padding-top: 40px;}
    .title{font-size: 62px; color: $dark; font-weight: 400; margin: 0 0 10px 0; padding: 0;
        @media ($sm-1679){ font-size: 54px;}
        @media ($sm-1441){font-size: 50px;}
        @media ($sm-1199){font-size:46px; margin-bottom: 5px;}
        @media ($sm-991){font-size: 42px;}
        @media ($sm-767){font-size: 40px;}
        @media ($sm-579){font-size: 38px;}
        @media ($sm-479){font-size: 34px;}
        span{color: $primary;}
    }
    .para{color: $dark; font-size: 24px; margin: 0; padding: 0; line-height: 1.6;
        @media ($sm-1679){font-size: 22px; line-height: 1.4;}
        @media ($sm-1441){font-size: 20px;}
        @media ($sm-1199){font-size: 18px;}
        @media ($sm-767){font-size: 16px;}
    }
    .contact-write-wrap{width: auto; position: absolute; bottom: 0; display: flex; background: #CC98DC; border-radius: 15px 15px 0 0; margin: 0; padding: 0; overflow: hidden;
        @media ($sm-579){width: 100%;}
        @media ($sm-479){flex-direction: column;}
        .ico-arrow{ width:16px; margin-left: auto;
            @media ($sm-579){width: 12px;}
            path{fill: #f1c7ff;}
        }
        .ico-img{width: 52px; margin-right: 10px;
            @media ($sm-1679){width: 40px;}
            @media ($sm-991){width: 35px;}
            @media ($sm-579){width: 30px;}
        }
        .txt{ font-size: 16px; line-height: 1.6; color: $white;
            span{display: block;}
            @media ($sm-991){font-size: 15px; line-height: 1.4;}
            @media ($sm-579){font-size: 14px;}
        }
        .contact-wrap,.write-wrap{display: flex; align-items: center; padding: 20px 20px 10px 20px; min-width: 340px;
            @media ($sm-1679){min-width: 300px; padding: 15px 15px 10px 15px;}
            @media ($sm-991){min-width: 250px; padding: 10px;}
            @media ($sm-579){min-width: inherit; width: 50%;}
            @media ($sm-479){width: 100%;}
        }
        .write-wrap{ background: $primary;}
    }
}
.form-wrap{ background: url(../img/newsletter-bg.png) no-repeat center / cover; padding: 100px 0; position: relative;
    @media ($sm-1679){padding: 70px 0;}
    @media ($sm-991){ padding: 50px 0 30px 0;}
    @media ($sm-579){padding: 30px 0 20px 0;}
    .flower1{ position: absolute; bottom: 400px;  left: 0;
        @media ($sm-1679){width: 180px;}
        @media ($sm-1441){ display: none;}
    }
    .flower2{ position: absolute; top: 100px; right: 0;
        @media ($sm-1679){width: 180px;}
        @media ($sm-1441){ display: none;}
    }
    .form-container{max-width: 1070px; margin: 0 auto;
        @media ($sm-1199){max-width: 962px;}
        @media ($sm-991){max-width: 735px;}
        @media ($sm-767){max-width: 550px;}
        @media ($sm-579){max-width: 100%; padding: 0 30px;}
    }
    .red{color: #FF0000; vertical-align: super;padding-left: 10px;}
    .input-wrap{ padding-bottom: 30px;
        .label-text{ font-size: 18px; color: $dark; font-weight: 400; display: block; margin-bottom: 15px; display: flex; cursor: pointer;
            @media ($sm-1679){font-size: 16px;}
            @media ($sm-767){font-size: 14px; margin-bottom: 5px;}
        }
        .text{height: 72px; border: 1px solid #DCC6E3; border-radius:50px; background: $white; font-size: 18px; color: #3B003B; outline: 0; width: 100%; padding: 20px 30px;
            @media ($sm-1679){font-size: 16px; height: 62px;}
            @media ($sm-767){ font-size: 14px; height: 50px; padding: 15px;}
            &::placeholder{opacity: 1; color: #3B003B;}
        }
        .textarea{height: 190px; border: 1px solid #DCC6E3; border-radius:20px; background: $white; font-size: 18px; color: #3B003B; outline: 0; width: 100%; padding: 20px 30px; vertical-align: top; resize: inherit;
            @media ($sm-1679){font-size: 16px; height: 160px;}
            @media ($sm-767){ font-size: 14px; padding: 15px; height: 130px;}
            &::placeholder{opacity: 1; color: #3B003B;}
        }
        &.location{
            .location-input-wrap{position: relative;
                &:after{position: absolute; inset:0 20px 0 auto; background: url(../img/location.svg) no-repeat top center / cover; content: ''; width:24px ; height:24px ; margin: auto; } 
            }
        }
        &.comments{
            .text{height: 110px; border-radius: 20px; vertical-align: top; resize: none;}
        }
        .select-wrap{ position: relative;
            .select{height: 72px; border: 1px solid #DCC6E3; border-radius:50px; background: $white; font-size: 18px; color: #3B003B; outline: 0; width: 100%; padding: 20px 30px; box-shadow: none; appearance: none;
                @media ($sm-1679){font-size: 16px;}
            }
            &:before{position: absolute; content: ''; inset: 0 25px 0 auto; margin: auto; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #3B003B; width: 0; height: 0;}
        }
    }
    .head{display: flex; justify-content: center; position: relative; margin: 0 0 20px 0;
        .txt{ color: $dark; font-size: 20px; background: $white; padding: 0 20px 5px 20px; border-radius: 30px;
            @media ($sm-1679){font-size: 18px;}
            @media ($sm-991){font-size: 16px;}
            @media ($sm-767){font-size: 14px;}
        }
        &::before{width: 100%; height: 1px; background: #DCC6E3; content: ''; position: absolute; inset: 0; margin: auto; z-index: -1;}
    }
    .radio-wrap{display: flex; align-items: center; justify-content: center; padding: 0 0 50px 0; flex-wrap: wrap;
        .form-check{ margin: 10px 20px 0 20px; padding: 0;
            @media ($sm-579){font-size: 14px; margin: 10px 10px 0 10px;}
            .form-check-input{margin:7px 5px 0 0; padding: 0; box-shadow: none; width: 18px; height: 18px;
                @media ($sm-991){width: 14px; height: 14px; margin: 9px 5px 0 0;}
                @media ($sm-579){ margin: 4px 5px 0 0;}
            }
            .form-check-label{color: $dark; font-size: 18px; margin: 0; padding: 0;
                @media ($sm-1679){font-size: 16px;}
                @media ($sm-767){ font-size: 14px;}
            }
        }
    }
    .btn-wrap{padding: 0; margin: 60px 0 0 0; display: flex; justify-content: end;
        @media ($sm-1679){margin: 40px 0 0 0;}
        @media ($sm-767){margin: 10px 0 0 0;}
        .btn{text-decoration: none; outline: 0; padding:5px 20px; margin: 0; width: 230px; height: 52px; border-radius: 30px; background: $primary; cursor: pointer; display: flex; justify-content: space-between; align-items: center;
            @media ($sm-1679){ height: 42px; width: 200px;}
            @media ($sm-767){  width:160px;}
            span{ color: $white; font-size: 16px; font-weight: 700;
                @media ($sm-1679){font-size: 15px;}
            }
            .img{max-width: 24px;
                @media ($sm-1679){max-width: 20px;}
            }
        }
    }
}
.captcha-btn-wrap{ display: flex; justify-content: space-between; margin: 60px 0 0 0; align-items: center;
    .captcha{}
    .btn-wrap{margin: 0 0 0 0;}
}