/* ==========================================
   NEWSLETTER
========================================== */
.newsletter{
    position: relative;
    width: 100%;
    height: 260px;
    overflow: hidden;
   
}

/* ==========================================
IMAGEM
========================================== */

.imagem-newsletter{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 80px;
    right: 80px;
    
    width: auto;
    height: 100%;
}


.imagem-newsletter img{
    border-radius: 25px;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center;

    display:block;

}


/* ==========================================
   CONTEÚDO
========================================== */

.conteudo-newsletter{

    position:relative;

    z-index:2;

    width:100%;

    height:100%;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    text-align:center;

}


/* ==========================================
   TÍTULOS
========================================== */

.conteudo-newsletter h1{

 
    color:var(--corBranca);

    font-size:1rem;

    font-weight:300;

    text-transform:uppercase;

}


.conteudo-newsletter h2{

    margin-bottom:40px;

    color:var(--corBranca);

    font-size:2rem;

    font-weight:600;

}


/* ==========================================
   CAMPO DO EMAIL
========================================== */

.formulario-newsletter{

    position:relative;

    width:500px;

    height:48px;

}


.formulario-newsletter input{

    width:100%;

    height:100%;

    padding:0 150px 0 20px;

    border:none;

    outline:none;

    border-radius:8px;

    background:var(--corBranca);

    color:var(--azulEscuro);

    font-family:var(--fonte-principal);

    font-size:.95rem;
   font-weight: 300;

}


.formulario-newsletter input::placeholder{

    color:var(--azulEscuro);

    opacity:1;

}


/* ==========================================
   BOTÃO
========================================== */

.botao-newsletter{

    position:absolute;

    top:3px;

    right:3px;

    height:42px;

    padding:0 28px;

    border:none;

    border-radius:8px;

    background:var(--azulEscuro);

    color:var(--corBranca);

    font-family:var(--fonte-principal);

    font-size:.9rem;

    font-weight:600;

    cursor:pointer;

    transition:.3s;

}


.botao-newsletter:hover{

    background:var(--laranjaForte);

}