/*Seguindo o modelo SMACSS, este documento CSS é o documento CSS de categoria "layout", ou seja, usado apenas nesta página do projeto.*/

:root {
    --cor-texto-curriculo-esquerda: #2F2F2F;
    --cor-texto-curriculo-direita: #202020;
    --cor-fundo-curriculo-esquerda: #FFFFFF;
    --cor-fundo-curriculo-direita: #008080;
    --cor-texto-curriculo-links: #003399; 
    --cor-texto-curriculo-links-hover: #DAA520;
}

/* MAIN CLASS */
.curriculo {
    padding: 10vh 30vh;
    display: flex;
    box-sizing: border-box;
}

/* SECAO ESQUERDA DO CURRICULO */
.curriculo > .box-esquerdo {
    color: var(--cor-texto-curriculo-esquerda);
    width: 70%;
    border-width: 4px 0 4px 4px;
    background-color: var(--cor-fundo-curriculo-esquerda);
}

/* APRESENTACAO SECTION */

.curriculo__apresentacao {
    display: flex;
    align-items: center;
    gap: 3.5vh;
    padding-bottom: 2vh;
}

.curriculo__apresentacao__conteudo {
    display: flex;
    flex-direction: column;
    gap: 3vh;
    width: 75%;
}

.curriculo__apresentacao__titulo {
    color: #000000;
    font-family: var(--font-titulo);
    font-size: 1.8rem;
}

.curriculo__apresentacao__subtitulo {
    font-family: var(--font-titulo);
    font-size: 1.4rem;
}

.curriculo__apresentacao__texto {
    font-family: var(--font-texto);
    font-size: 1.2rem;
}

.curriculo__apresentacao__imagem {
    width: 25%;
    border-radius: 160px;
}

/* Classe que separa as sections */
.separa-secao {
    margin: 1vh 0;
    border-width: 0;
    height: 1px;
    background-color: #00000048;
}

/* EXPERIENCIA SECTION */

.curriculo__experiencia__texto {
    width: 70%;
}

/* EDUCACAO SECTION */

.curriculo__educacao__ensino-um {
    display: flex;
    justify-content: space-between;
}

.curriculo__educacao__ensino-um > .box-esquerdo {
    padding-right: 20px;
}

.educacao__ensino-um__destaque {
    color: #000000;
    font-weight: 600;
}

.curriculo__educacao__ensino-um > .box-direito {
    padding-left: 20px;
    border-left: 2px solid var(--cor-borda);
}

/* EXTRACURRICULARES SECTION */

.curriculo__extracurriculares__topico {
    display: flex;
    flex-direction: column;
    gap: 0.7vh;
}

.extracurriculares__topico__links {
    text-decoration: none;
    color: var(--cor-texto-curriculo-links);
}

.extracurriculares__topico__links:hover {
    color: var(--cor-texto-curriculo-links-hover);
    font-weight: 600;
}

/* SECAO DIREITA DO CURRICULO */
.curriculo > .box-direito {
    color: var(--cor-texto-curriculo-direita);
    background-color: var(--cor-fundo-curriculo-direita);
    width: 30%;
    border-width: 4px 4px 4px 0;
}

/* SOBRE SECTION */

.curriculo__sobre {
    display: flex;
    flex-direction: column;
    padding-bottom: 2.5vh;
    gap: 2.5vh;
}

.curriculo__sobre__topico {
    display: flex;
    flex-direction: column;
    gap: 1.3vh;
}

.sobre__topico__links {
    text-decoration: none;
    color: var(--cor-texto-curriculo-links);
}

.sobre__topico__links:hover {
    color: var(--cor-texto-curriculo-links-hover);
    font-weight: 600;
}

/* HABILIDADES SECTION */

.curriculo__habilidades__lista {
    display: flex;
    flex-direction: column;
    gap: 1.8vh;
    list-style-position: inside;
}

.habilidades__lista__topico {
    position: relative;
    left: -0.7vh;
}

/* IDIOMAS SECTION */

.curriculo__idiomas__topico {
    display: flex;
    flex-direction: column;
    gap: 0.7vh;
}

.curriculo__idiomas__topico > :first-child {
    color: #101010;
    font-weight: 600;
}

/* ---BLOCO DE SELETORES - INICIO--- */

.curriculo > .box-esquerdo, 
.curriculo > .box-direito {
    padding: 3vh;
    border-style: solid;
    border-color: var(--cor-borda);
    box-sizing: border-box;
}

.curriculo__apresentacao__texto, 
.curriculo__experiencia__texto, 
.curriculo__educacao__ensino-um {
    padding-left: 1vh;
}

.curriculo__experiencia, 
.curriculo__educacao, 
.curriculo__extracurriculares, 
.curriculo__hobbies, 
.curriculo__habilidades, 
.curriculo__idiomas {
    display: flex;
    flex-direction: column;
    padding: 2vh 0;
    gap: 2.5vh;
}

.curriculo__experiencia__titulo, 
.curriculo__educacao__titulo, 
.curriculo__extracurriculares__titulo, 
.curriculo__hobbies__titulo, 
.curriculo__sobre__titulo, 
.curriculo__habilidades__titulo, 
.curriculo__idiomas__titulo {
    font-family: var(--font-titulo);
    font-size: 1.4rem;
}

.curriculo__experiencia__texto, 
.curriculo__educacao, 
.curriculo__educacao__ensino-um, 
.curriculo__extracurriculares__topico, 
.curriculo__hobbies__texto, 
.curriculo__sobre__topico, 
.curriculo__habilidades__lista, 
.curriculo__idiomas__topico {
    font-family: var(--font-texto);
    font-size: 1.2rem;
}

.curriculo__educacao__ensino-um > .box-esquerdo, 
.curriculo__educacao__ensino-um > .box-direito {
    display: flex;
    flex-direction: column;
    gap: 1vh;
    width: 50%;
    box-sizing: border-box;
}

.curriculo__extracurriculares__titulo,
.sobre__topico__email {
    word-wrap: break-word;
}

.curriculo__extracurriculares__topico, 
.curriculo__hobbies__texto {
    padding-left: 4vh;
}

/* ---BLOCO DE SELETORES - FIM--- */

/* RESPONSIVO */

@media (max-width: 1400px) {
    .cabecalho {
        padding: 8vh 15vh;
    }

    .curriculo {
        padding: 10vh 15vh;
    }

    .rodape {
        padding: 3vh 15vh;
    }
}

@media (max-width: 1200px) {
    .cabecalho__menu {
        justify-content: left;
    }

    .curriculo {
        flex-direction: column;
    }

    .curriculo > .box-esquerdo {
        border-width: 4px 4px 0 4px;
    }

    .curriculo > .box-direito {
        border-width: 0 4px 4px 4px;
    }

    .curriculo > .box-esquerdo,
    .curriculo > .box-direito {
        width: 100%;
    }

    .curriculo__sobre__topico,
    .curriculo__habilidades__lista,
    .curriculo__idiomas__topico {
        padding-left: 1vh;
    }
}

@media (max-width: 1000px) {
    .rodape {
        padding: 3vh 10vh;
    }

    .cabecalho,
    .curriculo {
        padding: 10vh;
    }

    .curriculo > .box-esquerdo,
    .curriculo > .box-direito {
        padding: 5vh;
    }
}

@media (max-width: 800px) {
    .cabecalho__menu {
        justify-content: center;
    }

    .curriculo__apresentacao {
        flex-direction: column;
        align-items: center;
    }

    .curriculo__apresentacao__imagem {
        width: auto;
    }

    .cabecalho__menu,
    .curriculo {
        text-align: center;
    }

    .curriculo__apresentacao__conteudo,
    .curriculo__experiencia__texto {
        width: 100%;
    }
    
    .curriculo__apresentacao__texto, 
    .curriculo__experiencia__texto, 
    .curriculo__educacao__ensino-um,
    .curriculo__extracurriculares__topico, 
    .curriculo__hobbies__texto,
    .curriculo__sobre__topico,
    .curriculo__habilidades__lista,
    .curriculo__idiomas__topico {
        padding-left: 0;
    }

    .curriculo__educacao__ensino-um > .box-esquerdo, 
    .curriculo__educacao__ensino-um > .box-direito {
        justify-content: space-around;
    }
}

@media (max-width: 600px) { 
    .curriculo__apresentacao__titulo {
        font-size: 1.2rem;
    }
    
    .curriculo__apresentacao__subtitulo {
        font-size: 1rem;
    }
    
    .curriculo__apresentacao__texto {
        font-size: 0.9rem;
    }
    
    .curriculo__apresentacao__imagem {
        width: 40%;
    }

    .cabecalho,
    .curriculo,
    .rodape {
        padding: 3vh;
    }
    
    .curriculo > .box-esquerdo,
    .curriculo > .box-direito {
        padding: 3vh; 
    }
    
    .curriculo__apresentacao,
    .curriculo__sobre {
        padding: 2vh 0;
    }
    
    .curriculo__experiencia__titulo, 
    .curriculo__educacao__titulo, 
    .curriculo__extracurriculares__titulo, 
    .curriculo__hobbies__titulo, 
    .curriculo__sobre__titulo, 
    .curriculo__habilidades__titulo, 
    .curriculo__idiomas__titulo {
        font-size: 1rem;
    }

    .curriculo__experiencia__texto, 
    .curriculo__educacao, 
    .curriculo__educacao__ensino-um, 
    .curriculo__extracurriculares__topico, 
    .curriculo__hobbies__texto, 
    .curriculo__sobre__topico, 
    .curriculo__habilidades__lista, 
    .curriculo__idiomas__topico {
        font-size: 0.9rem;
    }
}

@media (max-width: 400px) {
    .curriculo > .box-esquerdo,
    .curriculo > .box-direito {
       padding: 1.5vh; 
    }
}