Estou com um problema em programar o CSS responsivo do meu site | HTML5 e CSS3 parte 4: avançando no CSS

Estou codando uma LP para um corretor de imóv!eis e estou com problemas com tornar meu site responsivo.

![](img src="https://i.imgur.com/zqWghFO.jpg")

Nessa página eu quero diminuir o width para 50% e assim ele caber dentro do header, então codei o seguinte CSS:

@media (min-width: 375px) {

    .logocabecalho {
        width: auto;
    }
}

Mas o site não parece responder...

Já codei alguns sites e sempre funcinou, não sei o que eu deixei passar kkkkkk

Vou deixar anexo os códigos do site:

HTML:

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <title>Edge Pinheiros - Corretor Diaz</title>
        <link rel="stylesheet" href="reset.css">
        <link rel="stylesheet" href="style.css">
        <link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet">
    </head>

    <body>
    </body>
</html>

CSS:

body {
    font-family: 'Open Sans', sans-serif;
    display: inline-block;
    background: #c6c6c6;
    width: 100%;
}

h1 {
    font-size: 2em;
    font-weight: bold;
    padding: 10px;
    text-transform: uppercase;
}

p {
    font-size: 1.3em;
    padding: 10px 0;
    line-height: 1.5em;
}

header {
    background: #ED6B30;
    text-align: center;
    width: auto;
    box-shadow: 0px 5px 0px rgb(0,0,0,0.5);
    margin-bottom: 5px;
}


main {
    text-align: center;
    padding: 0 10%;
    background: url("bg.jpg");
}

.imagemfachada2 {
    width: 80%;
    padding: 10px;
}

.introtexto {
    padding: 0 20%;
}

.imagemfachada1 {
    width: 20%;
    padding-bottom: 20px;
}

.sectionbotao {
    padding: 20px;
    clear: left;

}

.sectionbotao img {
    width: 40%;
    border-radius: 25px;
    box-shadow: 0 5px 5px rgb(0, 0, 0, 0.5);
}

.sectionbotao img:hover {
    width: 60%;
}

.sectionbotao p {
    font-size: 0.8em;
}

.fotospredio {
    padding: 10px 0;
}

.fotospredio li {
    display: inline;
}

.fotospredio li img {
    width: 30%;
}

.sectionplanta img {
    width: 80%;
    padding: 10px 0;
}

.embed {
    padding: 10px 0;
}

.sectioncorretordiaz img {
    width: 30%;
}

footer {
    background: #000000;
    text-align: center;
}

footer img {
    width: 20%;
    padding: 10px;
}

//* Responsivo *//

@media (min-width: 375px) {

    .logocabecalho {
        width: auto;
    }

    html body {
        width: 100%;
        height: 100%;
        margin: 0px;
        padding: 0px;
    }



    .intro img {
        width: 100%;
    }
}

Mergulhe em programação