/* ===== PÁGINA 404 ===== */

/* ===== 404 ===== */

body.error404 header,
body.error404 footer {
    display: none;
}

.pagina-404 {
    width: 100%;
    height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;
    
    background: var(--cor-destaque);
}


/* ===== CONTEÚDO ===== */

.pagina-404-conteudo {
    display: flex;
    flex-direction: column;
    align-items: center;
}


/* ===== ÍCONE ===== */

.pagina-404-icone {
    width: 110px;
    height: 110px;

    margin-bottom: 22px;
}

.pagina-404-icone svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: var(--cor-branco);
}


/* ===== TÍTULO ===== */

.pagina-404-titulo {
    margin: 0 0 8px;

    color: var(--cor-branco);

    font-size: 28px;
    line-height: 1.2;
}


/* ===== DESCRIÇÃO ===== */

.pagina-404-descricao {
    margin: 0;

    color: var(--cor-branco);

    font-size: 16px;
    line-height: 1.5;
}


/* ===== BOTÕES ===== */

.pagina-404-botoes {
    display: flex;
    align-items: center;
    gap: 20px;

    margin-top: 22px;
}

.pagina-404-voltar,
.pagina-404-inicio {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 100px;
    height: 42px;

    padding: 0 20px;

    border-radius: 10px;

    font-size: 17px;
    font-weight: 600;

    text-decoration: none;

    cursor: pointer;
}


/* ===== VOLTAR ===== */

.pagina-404-voltar {
    border: 0;

    background: var(--cor-preto);
    color: var(--cor-branco);
}

.pagina-404-voltar:hover {
    opacity: 80%;
}


/* ===== INÍCIO ===== */

.pagina-404-inicio {
    background: var(--cor-branco);
    color: var(--cor-preto);
}

.pagina-404-inicio:hover {
    opacity: 80%;
}

@media (max-width: 767px) {

    .pagina-404 {
        min-height: calc(100vh - 70px);
        padding: 40px 20px;
    }

    .pagina-404-icone {
        width: 90px;
        height: 90px;
    }

    .pagina-404-titulo {
        font-size: 24px;
    }

    .pagina-404-descricao {
        font-size: 15px;
    }

}