@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');
@import url('../components/navbar.css');
@import url('../components/footer.css');

* {
    margin: 0;
    padding: 0;
}

body{
    background-color: #212121;
}

:root {
    --purple-primary: #240046;
    --purple-secondary: #3C096C;
    --purple-terciary: #7209B7;
    --purple-quartenary: #B5179E;
    --royal-blue-primary: #3F37C9;
    --royal-blue-secondary: #4361EE;
    --royal-blue-terciary: #647ff5;
    --white: #D9D9D9;
}

.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.logo_header {
    display: flex;
    justify-content: left;
}

.links_header {
    display: flex;
    gap: 20px;
}

.text_logo {
    font-family: Instrument Sans;
    color: #FEFAE0;
    display: flex;
    align-items: center;
}

.button_header {
    color: #FEFAE0;
    background-color: #7209B7CC;
    font-family: Instrument Sans;
    font-size: 20px;
    border: #7209B7CC;
    border-radius: 10px;
    width: 150px;
    margin: 10px;
    height: 41.44px;
    cursor: pointer;
}

.text_home {
    font-family: Instrument Sans;
    font-size: 20px;
    color: #FEFAE0;
    text-decoration: none;
    margin: 12px;
    margin-top: 18px;
}

.text_historia {
    font-family: Instrument Sans;
    font-size: 20px;
    color: #FEFAE0;
    text-decoration: none;
    margin: 12px;
    margin-top: 18px;
}

/*Carlos*/

.titulo-conheca{
    margin-top: 20px;
    font-size: 35px;
    text-align: center;
    color: #FEFAE0;
    font-family: Instrument Sans;
    
}

.div-conheca{
    align-items: center;
    text-align: center;
    font-family: Instrument Sans;
}

.img-conheca{
    margin-top: 20px;
    margin-bottom: 20px;
}



.informacoes-sobrenos{
    border-top: 2px solid #FEFAE0;
    height: 50rem;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    color: var(--white);
}


.perguntas {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.pergunta{
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: 2rem;
    width: 500px;
    background-color: transparent;
    border: transparent;
    cursor: pointer;
    gap: 1rem;
    color: var(--white);

}


.texto-perguntas{
    width: 45rem;
}

.texto-perguntas p {
    font-size: 1.7rem;
    font-family: Instrument Sans;
    color: var(--white);
    opacity: 1;      
    transition: opacity 0.4s ease;
    text-align: justify;
}

.ativo{
    font-size:2.1rem ;
    font-weight: bold;
    img{
        width: 100px;
    }
}
/* HIGOR */

.Box-equipes{
    display: flex;
    justify-content: center;
    height: 400px;
    font-family: "Instrument Sans", sans-serif;
}
.Textos{
    display: flex;
    flex-direction: column;
    width: 43%;
}
.number {
        font-size: 8rem;
        font-weight: bold;
        color: #3C096C;
        position: relative;
    }

.number span1 {
        width: 180px;
        position: absolute;
        top: 40%;
        left: 20px;
        font-size: 1.5rem;
        color: #B5179E;
    }
.number span2 {
        width: 480px;
        position: absolute;
        top: 60%;
        left: 22px;
        font-size: 2.0rem;
        color: #FFFFFF;
    }

.Textos p {
        font-size: 1.6rem;
        color: #D9D9D9;
        text-align: left;
}
.Logo{
    width: 43%;
    display: flex;
    justify-content: end;
}
.imgLogo{
    width: 45%;
    
}

.Box-EquipesFotos{
    display: flex;
    flex-direction: column;
    font-family: "Instrument Sans", sans-serif;
}
.Direcionador{
    display: flex;
    width: 80%;
    margin: 80px auto;
}
.card{
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 45%;
    margin: 0px 60px;
    border-radius: 22px;
    height: 600px;
    background-color: gray
}
.card p {
    align-items: center;
    font-size: 2.0rem;
    font-weight: 800;
    color: #FFFFFF;
}
.Texto-card{
    height: 15%;
    display: flex;
    align-items: center;
}
.Texto-card p {
 margin: 0px 35px;
}
.ImagemTime{
    width: 95%;
    border-radius: 22px;
    height: 75%;
    margin: 20px auto;
    background-color: red;
}