@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url("pasta-styles/header.css");
@import url("pasta-styles/carrossel.css");
@import url("pasta-styles/card.css");
@import url("pasta-styles/topicos.css");
@import url("pasta-styles/cadastro.css");
@import url("pasta-styles/rodape.css");


*{
margin: 0px;
padding: 0px;

}



:root{
    --cor-01:#FFFFFF;
    --cor-02: #EBECEE;
    --cor-azul-01:#002F52;
    --cor-azul-02:#326589;
    --fonte-01:'Poppins';
    --cor-laranja:#EB9B00;
    --fonte-02:'Josefin Sans';

}




body{
background-color: var(--cor-02);


}

.cabecalho{

}
.cabecalho__navegacao{
display: flex;
align-items: center;
justify-content: space-between;



height:80px ;

background-color: var(--cor-01);
position: relative;
}



.cabecalho__navegacao__parte01{
display: flex;
align-items: center;
gap: 15px;

}

.cabecalho__conteudo{
    display: flex;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(97.54deg,var(--cor-azul-01) 35.49%,var(--cor-azul-02) 165.37%);
    padding: 6%;
    gap: 16px;
}
.cabecalho__conteudo__titulo{
    font-family: var(--fonte-01);
    font-weight: 700;
    color: var(--cor-01);
}

.cabecalho__conteudo__texto{
text-align: center;
font-family: var(--fonte-01);
font-weight: 500;

color: var(--cor-01);
}
.cabecalho__busca{
background-color: transparent;
border: 1px solid var(--cor-01);
border-radius: 24px;
color: var(--cor-01);
padding: 1em;
width: 80%;
}

.cabecalho__busca::placeholder{
font-family: var(--fonte-01);
font-size: 14px;
font-weight: 400;
color: var(--cor-02);
text-align: center;
background: url("imagens/Pesquisa.png") no-repeat;
background-position: 0.2em;
}




.cabecalho__aviso__texto{
color:var(--cor-laranja) ;
font-family: var(--fonte-01);
text-align: center;


}

@media screen and (min-width:1024px) {

.cabecalho__conteudo__titulo{
font-size: 36px;
line-height: 54px;



}

.cabecalho__conteudo__texto{
line-height: 24px;
font-size: 16px;

}
.cabecalho__busca{
width: 50%;

}
.cabecalho__busca::placeholder{
background-position: 6em;
}
    
}