/*
************
*************************
08. cta
******************************************************* 
*************************************************************** */
 @use '../abstracts/variables' as *;

 .bz {
    &-cta {
        background-color: rgba(130, 155, 133, 0.3);

        &-wrap {

            &-content {
                // margin-bottom: 40px;

                &.mb-40 {
                    @media #{$xs} {
                        margin-bottom: 20px;
                    }
                }

                &-subtitle {
                    color: #F55F1E;
                    font-size: 16px;
                    display: inline-block;
                    margin-bottom: 10px;
                    font-weight: 500;
                    @media #{$xs} {
                        font-size: 15px;
                    }
                }

                &-title {
                    font-size: 34px;
                    line-height: 1.29;
                    margin-bottom: 0;

                    @media #{$xs} {
                        font-size: 26px;
                        line-height: 1.5;
                        br {
                            display: none;
                        }
                    }
                    @media #{$sm} {
                        font-size: 30px;
                        line-height: 1.33;
                    }
                }
            }

            &-form {
                margin: 0 60px;
                position: relative;

                @media #{$lg} {
                    margin: 0 30px;
                }
                @media #{$xs} {
                    margin: 0 10px;
                }
    
                & input {
                    width: 100%;
                    border: none;
                    background-color: transparent;
                    border-bottom: 1px solid #6E6E6E;
                    height: 40px;
                    line-height: 40px;
                    padding-right: 40px;
                    color: #6E6E6E;
                    font-size: 16px;
                }
                & button {
                    position: absolute;
                    background: transparent;
                    border: none;
                    top: 0;
                    right: 0;
                    width: 40px;
                    height: 40px;
                    text-align: right;
                    font-size: 18px;
                    color: #6E6E6E;

                    &:hover {
                        color: var(--clr-color-orange);
                    }
                }
            }
        }
    }
 }