/*==================================================
    NEWSLETTER
==================================================*/

.newsletter{

    padding:70px 0;

    background:#082C6C;

    overflow:hidden;

}

/*==================================================
    WRAPPER
==================================================*/

.newsletter__wrapper{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

}

/*==================================================
    CONTENT
==================================================*/

.newsletter__content{

    max-width:520px;

}

.newsletter__tag{

    display:inline-block;

    margin-bottom:18px;

    padding:8px 18px;

    border-radius:30px;

    background:#F5B51D;

    color:#082C6C;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

}

.newsletter__content h2{

    margin:0 0 18px;

    color:#ffffff;

    font-size:38px;

    font-weight:800;

    line-height:1.3;

}

.newsletter__content p{

    margin:0;

    color:rgba(255,255,255,.85);

    font-size:17px;

    line-height:1.8;

}

/*==================================================
    FORM
==================================================*/

.newsletter__form{

    display:flex;

    width:100%;

    max-width:560px;

    background:#ffffff;

    border-radius:60px;

    overflow:hidden;

}

.newsletter__form input{

    flex:1;

    border:none;

    outline:none;

    padding:20px 26px;

    font-size:16px;

}

.newsletter__form button{

    border:none;

    padding:0 36px;

    background:#F5B51D;

    color:#082C6C;

    font-size:16px;

    font-weight:700;

    cursor:pointer;

    transition:.3s ease;

}

.newsletter__form button:hover{

    background:#E9A900;

}

/*==================================================
    RESPONSIVE
==================================================*/

@media (max-width:992px){

    .newsletter__wrapper{

        flex-direction:column;

        text-align:center;

    }

    .newsletter__content{

        max-width:100%;

    }

    .newsletter__form{

        width:100%;

    }

}

@media (max-width:576px){

    .newsletter__form{

        flex-direction:column;

        border-radius:12px;

    }

    .newsletter__form input{

        width:100%;

    }

    .newsletter__form button{

        padding:18px;

    }

}