/* Inicio Home */
#home{
    height:700px;
}
#home .homeElementos{
    width:700px;
}
#home .homeElementos h1{
    color:var(--verde);
    font-size: 42px;
    margin-top:40px;
}
#home img{
    width:600px;
}
/* Fim Home */

/* Inicio Produto */
#produtos{
    margin-top:110px;
    display:flex;
    flex-direction: column;
    gap:50px;
    align-items: center;
}
#produtos h2{
    color: var(--azul);
    font-size:32px;
}
#produtos .produtoCard{
    display:flex;
    flex-direction: column;
    gap:50px;
    align-items: center; 
    padding:60px 20px;
    width:70%;
}
#produtos .verde{
    background-color:#00e67732;
    border:5px solid var(--verde);
}
#produtos .amarelo{
    background-color:#FFC10732;
    border:5px solid var(--amarelo);
}
#produtos .produtoCard h3{
    font-size:35px;
    color:var(--azul);
}
#produtos .produtoCard .cardElementos{
    display:flex;
    align-items: center;
    justify-content: space-around;
}
#produtos .produtoCard .cardElementos .cardConteudo{
    width:50%;
    display:flex;
    flex-direction: column;
    gap:30px;
}
#produtos .produtoCard .cardElementos .cardConteudo ul{
    display:flex;
    flex-direction: column;
    gap:20px;
    list-style: none;
    padding-left:10px;
}
#produtos .produtoCard .cardElementos .cardConteudo ul li:before {
    content: '';
    width:8px;
    height:8px;
    border-radius:5em;
    background-color: var(--azul);
    display: block;
    position: absolute;
    color:var(--azul);
    margin-top:8px;
    margin-left:-20px;
}
#produtos .produtoCard .cardElementos .cardConteudo .bloqueado{
    background-color:#ff5151;
    cursor:auto;
}
#produtos .produtoCard .cardElementos .cardConteudo .bloqueado:hover{
    background-color:#ad2424;
}
#produtos .produtoCard .cardElementos .cardConteudo button{
    width:50%;
    padding:8px 0px;
    background-color: var(--azul);
    color:var(--cor-texto2);
    box-shadow: 2px 2px 5px #000;
}
#produtos .produtoCard .cardElementos .cardConteudo button:hover{
    background-color: var(--verde);
}
#produtos .produtoCard .cardElementos img{
    width:300px;
}
/* Fim Produto */

/* Inicio encerramento */
#encerramento{
    display:flex;
    justify-content: center;
    align-items: center;
    gap:50px;
    margin-top:150px;
}
#encerramento img{
    width:400px;
}
#encerramento .encerramentoConteudo{
    width:40%;
    display:flex;
    flex-direction: column;
    gap:30px;
}
#encerramento .encerramentoConteudo h2{
    color: var(--azul);
    font-size:50px;
}
/* Fim encerramento */

/* Inicio versão mobile -------------------------------------------- */

@media (max-width: 1000px) {

    /* --- Home (Ajustes Adicionais) --- */
    #home {
        height: auto;
        padding-top: 100px;
    }
    #home .homeElementos {
        width: 90%;
        max-width: 450px;
        align-items: center;
    }
    #home .homeElementos h1 {
        font-size: 32px;
        margin-top: 20px;
    }
    #home img {
        width: 90%;
        max-width: 350px;
    }

    /* --- Produtos --- */
    #produtos {
        margin-top: 60px;
        gap: 30px;
    }
    #produtos h2 {
        font-size: 28px;
        padding: 0 20px;
        text-align: center;
    }
    #produtos .produtoCard {
        width: 90%;
        padding: 40px 10px;
    }
    #produtos .produtoCard h3 {
        font-size: 28px;
        text-align: center;
    }
    #produtos .produtoCard .cardElementos {
        flex-direction: column;
        gap: 30px;
        width: 100%;
    }
    #produtos .produtoCard .cardElementos img {
        width: 80%;
        max-width: 250px;
        order: 1;
    }
    #produtos .produtoCard .cardElementos .cardConteudo {
        width: 90%;
        order: 2;
    }
    #produtos .produtoCard .cardElementos .cardConteudo button {
        width: 100%;
        margin: 0 auto;
    }

    /* --- Encerramento --- */
    #encerramento {
        flex-direction: column;
        margin-top: 80px;
        gap: 40px;
        padding: 0 20px;
    }
    #encerramento img {
        width: 90%;
        max-width: 300px;
        order: 1;
    }
    #encerramento .encerramentoConteudo {
        width: 90%;
        max-width: 450px;
        text-align: center;
        order: 2;
    }
    #encerramento .encerramentoConteudo h2 {
        font-size: 40px;
    }
}