/*============= CTA CSS AREA ===============*/
.cta2{
    @media #{$xs} {
        padding: 40px 0 40px;
     } 
    .hadding2-w{
        padding: 0 75px;
        p{
            color: $color-w;
            opacity: 0.7;
        }
        @media #{$xs} {
            padding: 0;
        }
        @media #{md} {
            padding: 0;
        }
        h1{
            @media #{$xs} {
                font-size: $heading3_size - 2;
                line-height: 40px;
             } 
        }
    }
}
.cta3{
    @media #{$xs} {
        padding: 40px 0 40px;
     } 
     h1{
        font-family: $font-1;
        @media #{$xs} {
            font-size: $heading3_size - 2;
            line-height: 40px;
         } 
    }
    p{
        font-family: $font-2;
        color: $title-color1;
        opacity: 0.8;
    }
}

// HOMEPAGE5 CTA STARTS //
.cta5-section-area{
    background: $color7;
    padding: 80px 0 80px;
    @media #{$xs} {
        padding: 40px 0 40px;
    }
    @media #{$md} {
        padding: 40px 0 40px;
    }
    .cta5-header{
        h2{
            font-family: $font-1;
            font-weight: $semi-bold;
            color: $color-w;
            font-size: $heading2_size - 2;
            line-height: 50px;
            @media #{$xs} {
              font-size: $heading3_size - 2;
              line-height: 40px;
            }
        }
        .theme-btn6{
            background: $color-w;
            color:$color7 !important;
            &::after{
                background: $color7;
                opacity: 0.1;
            } 
            span{
                background: $color7;
                color: $color-w;
            }
        }
        .headerbtn1{
            background: none;
            border: 1px solid $color-w;
            margin-left: 24px;
            color: $color-w !important;
            @media #{$xs} {
                margin-left: 0;
            }
            &::after{
                background: $color-w;
                opacity: 0.1;
            }
            span{
                background: $color-w;
                color: $color7;
            }
        }
    }
}
// HOMEPAGE5 CTA ENDS //

// HOMEPAGE6 CTA STARTS //
.cta6-section-area{
    padding: 80px 0 80px;
    background: $title-color1;
    position: relative;
    .vector2{
        position: absolute;
        left: -160px;
        top: 0;
    }
    .vector3{
        position: absolute;
        right: -160px;
        top: 0;
    }
    @media #{$xs} {
        padding: 40px 0 40px;
    }
    @media #{$md} {
        padding: 40px 0 40px;
    }
   .cta6-header{
    h2{
        font-family: $font-1;
        font-size: $heading2_size - 2;
        line-height: 50px;
        color: $color-w;
        font-weight: $semi-bold;
    }
    p{
        font-size: $small_font_size;
        font-family: $font-2;
        line-height: 24px;
        color: $color-w;
        font-weight: $regular;
        opacity: 0.8;
    }
    form{
        position: relative;
        z-index: 1;
        background: $color-w;
        padding: 16px 24px;
        border-radius: 35px;
        input{
            background: none;
            outline: none;
            border: none;
            font-family: $font-2;
            font-size: $small_font_size;
            color: $title-color1;
            &::placeholder{
                font-family: $font-2;
                font-size: $small_font_size;
                color: $title-color1;
                opacity: 0.7;
            }
        }
        button{
            border: none;
            outline: none;
            position: absolute;
            top: 5px;
            right: 5px;
        }
    }
   } 
}
// HOMEPAGE6 CTA ENDS //

// ctainner //
.cta6-section-area.inner{
    background: $bg-color2;
    .vector2{
        bottom: 0;
    }
    form{
        input{
            &::placeholder{
                font-family: $font-2;
                font-weight: $regular;
                color: $title-color1;
            }
        }
        button{
            &:hover{
                background: $bg-color2;
                transform: translateY(0);
            }
        }
    }
}

/*============= CTA CSS AREA ENDS ===============*/