header{
    position: relative;
    width: 100%;
    aspect-ratio: 1400/627;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
}
@media only screen and (min-width: 541px), only screen and (min-device-width: 541px) {
    header{
        background-image: url("../imagens/bg-topo-desktop.png");
    }
}
@media only screen and (max-width: 540px), only screen and (max-device-width: 540px) {
    header{
        background-image: url("../imagens/bg-topo-mobile.png");
    }
}
header .logo{
    position: absolute;
}
header .logo img{
    width: 100%;
    aspect-ratio: 400/133;
}
@media only screen and (min-width: 541px), only screen and (min-device-width: 541px) {
    header .logo{
        top: 0;
        left: 10%;
        margin-top: 20%;
    }
}
@media only screen and (max-width: 540px), only screen and (max-device-width: 540px) {
    header .logo{
        top: 15%;
        left: 50%;
        transform: translateX(-50%);
    }
}