html { 
  font-size: 16px;
  font-family: 'Poppins', sans-serif;
}

body {
    margin: 0;
}

.main-grid {
    display: grid;
    grid-template-rows: minmax(500px, 650px) minmax(600px, 700px) minmax(600px, 700px) minmax(600px, 700px) minmax(600px, 700px);
    /* align-items: start; */
}

.cor-titulo {
    color: #197672;
}

.cor-texto-explicativo {
    color: #808080;
}

.secao-clara {
    background-color: white;
    /* align-content: center; */
}

.secao-escura {
    background-color: #E3F2E6;
    /* align-content: center; */
}

.grid-bloco-principal {
    display: grid;
    justify-content: center;
    grid-template:
        "barraOpcoes" 90px
        "conteudoDestaque" 2fr
        / minmax(400px, 966px);
}

.barra-opcoes {
    grid-area: barraOpcoes;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.menus {
    width: 525px;
}
.menus > ul {
    display: flex;
    justify-content: space-around;
    list-style-type: none;
    color: #197672;
}
.menus > ul a { 
    text-decoration: none;
    color: inherit;    
    font-weight: bold;
}
.menu-logo {
    width: 90px;
}

.conteudo-destaque {
    grid-area: conteudoDestaque;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    padding: 0px 40px 0px 40px;
    margin-top: 30px;
}

.img-prato {
    width: 450px;
    height: 480px;
}

.img-assinatura {
    width: 300px;
}

/* Blocos */
.grid-bloco {
    display: grid;
    justify-content: center;
    /* justify-items: center; */
    grid-template:
        "blocoTitulo" 1fr
        "blocoConteudo" 2fr
        / minmax(400px, 1050px);
}
.bloco-titulo {
    grid-area: blocoTitulo;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 30px;
}
.bloco-titulo > h2 {
    font-size: 2.5rem;
    margin-bottom: 10px;
}
.bloco-titulo > .subtitulo {
    font-size: 1.6rem;
    margin: 0px;
}
.bloco-conteudo {
    display: flex;
    grid-area: blocoConteudo;
    align-items: center;
    min-height: 410px;
}
.bloco-conteudo > p {
    color: #808080;
    height: fit-content;
    text-align: justify;
    font-size: 1.6rem;
    margin: 0px 30px 0px 30px;    
    max-width: 560px;
}
.bloco-conteudo > ul {
    color: #808080;
    height: fit-content;
    font-size: 1.6rem;
    margin: 0px 30px 0px 30px;
    color: #4e534f;    
}
.bloco-conteudo > img {
    max-height: 25rem;
}

.bloco-avaliacao {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 30px;
    min-width: 400px;
 }

.bloco-avaliacao > h2 {
    font-size: 2.5rem;
    margin-bottom: 45px;
}


.row-reverse {
    flex-direction: row-reverse;
}

/* Secão Final */
.secao-final {
    display: grid;
    background-color: #D2EAE9;
    height: 100%;
}

.assunto-ultimo-bloco {
    grid-area: assuntoUltimoBloco;
    justify-self: center;
    align-self: center;   
}
.assunto-ultimo-bloco > h2 {    
    font-size: 2.5rem;
    max-width: 590px;
    justify-self: center;
}
.assunto-ultimo-bloco > p {    
    font-size: 1.6rem;
    max-width: 590px;
    justify-self: center;
}

.contatos {
    grid-area: contatos;
    justify-self: center;
    margin-top: 30px;
}
.contatos > p {
    color: #82AA8A;
    font-size: 1.8rem;
    margin: 15px;
}
.contato {
    display: flex;
    align-items: center;
}
.contato img {
    margin-right: 15px;
}
.contato a {
    display: flex;
    text-decoration: none;
    color: inherit;    
}

.main-footer {
    background-color: #1F948F;    
    height: 60px;
    align-self: end;
}

.grid-ultimo-bloco {
    display: grid;
    justify-content: center;
    grid-template:
        "assuntoUltimoBloco" 1fr
        "contatos" 1fr
        / minmax(400px, 1050px);
}

.whatsapp-cta {
    width: 60px;
    height: 60px;
    border-radius: 40px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: 12px;
    bottom: 12px;
}

.whatsapp-cta > img {
    
}

/* Quando a tela for MAIOR que 1200px (Desktops Grandes) */
@media screen and (max-width: 800px) {
    .conteudo-destaque {
        flex-direction: column;
        padding-right: 30px;
        padding-left: 0px;
    }

   .grid-bloco-principal {
        display: grid;
        justify-content: center;
        grid-template:
            "conteudoDestaque barraOpcoes" 1fr        
            / minmax(400px, 1050px) 200px; 
    }

    .grid-ultimo-bloco {
        display: grid;
        justify-content: center;
        grid-template:
            "assuntoUltimoBloco" 1fr
            "contatos" 1fr
            / minmax(400px, 780px);
    }

    .barra-opcoes {
        flex-direction: column;
        justify-content: center;
        align-items: unset;
    }

    .menu-logo {
        display: none;
    }

    .img-assinatura {
        position: absolute;
        bottom: 5%;
        left: 26%;
    }

    .secao-clara {
        position: relative;
    }

    .menus {
        width: unset;
    }
    .menus > ul {
        flex-direction: column;
        align-items: center;
        padding: 0px;
        margin: 0px;
    }
    .menus > ul > li { 
        margin-top: 45px;
    }

    .cortador {
        /* width: 100%; */
        height: 450px;
        overflow: hidden;
    }
    .cortador img {
        width: 100%;
        height: 100%;       
        object-fit: cover;
        object-position: right; 
    }

    .bloco-conteudo > img {
        max-height: 18rem;
        margin-bottom: 30px;
    }
    .bloco-conteudo > p {
        font-size: 1.4rem;
    }
}

@media screen and (max-width: 680px) {
    html {
        font-size: 15px;
    }

    .main-grid {
        display: grid;
        grid-template-rows: 650px 650px 890px repeat(2, 650px);
    }

    .grid-bloco-principal {
        display: grid;
        justify-content: center;
        grid-template: "conteudoDestaque barraOpcoes" 1fr / 60% 40%;
    }

    .grid-bloco {
        display: grid;
        justify-content: center;
        grid-template:
            "blocoTitulo" 170px
            "blocoConteudo" 2fr 
            / 90%;
    }

    .grid-ultimo-bloco {
        display: grid;
        justify-content: center;
        grid-template:
            "assuntoUltimoBloco" 1fr
            "contatos" 1fr
            / minmax(350px, 525px);
    }

    .cortador {
        width: 88%;
        height: 450px;
        overflow: hidden;
    }

    .img-assinatura {
        left: 20%;
    }

    .conteudo-destaque {
        align-items: flex-start;
    }

    .bloco-conteudo {
        flex-direction: column;
    }
    /* .bloco-conteudo > p {
        font-size: 1.4rem;
    }
    .bloco-conteudo > img {
        max-height: 18rem;
    } */
    .bloco-conteudo > ul {
        margin: 0px 0px 0px 5px;
    }

    .bloco-titulo {
        margin-top: 0px;
    }
    .bloco-titulo > h2,
    .bloco-avaliacao > h2 {
        font-size: 1.7rem;
        margin-bottom: 10px;
    }
    .bloco-titulo > .subtitulo {
        font-size: 1.4rem;
    }    

    .assunto-ultimo-bloco > h2 {
        font-size: 1.7rem;
    }
    .contatos > p {
        font-size: 1.3rem;
    }
}

@media screen and (max-width: 430px) {
    html {
        font-size: 14px;
    }

    /* .main-grid {
        display: grid;
        grid-template-rows: repeat(2, 670px) 890px repeat(2, 670px);
    } */

    .grid-ultimo-bloco {
        display: grid;
        justify-content: center;
        grid-template:
            "assuntoUltimoBloco" 1fr
            "contatos" 1fr
            / minmax(350px, 370px);
    }

    .img-assinatura {
        left: 10%;
    }

    .assunto-ultimo-bloco > h2, 
    .assunto-ultimo-bloco > p {
        text-align: center;
    }
}
