/* Estilo para a seção CorpoArtificial dentro do capítulo 2 */
.capitulo_2 .CorpoArtificial {
    width: 100%;
    /* Largura da seção CorpoArtificial, ocupando 89.6% da largura do seu contêiner */
    height: 88vh;
    /* Altura da seção CorpoArtificial, ocupando 88% da altura da janela de visualização */
    padding-top: 2vw;
    /* Espaçamento à direita de 5% da largura da janela */
    background-color: #D9D9D9;
    /* Cor de fundo branco */
    display: flex;
    /* Flexbox para o layout */
    flex-direction: column;
    /* Organiza os itens em uma coluna */
    align-items: center;
    /* Alinha os itens ao centro horizontalmente */
    gap: 2vh;
    /* Espaçamento de 2% da altura da janela entre os elementos  */
}

/* Estilos gerais para os capítulos 1 e 2, alinhando seus elementos */
.Capitulo_1,
.Capitulo_2 {
    width: 100%;
    /* Ocupa toda a largura disponível */
    display: flex;
    /* Flexbox para layout */
    justify-content: center;
    /* Alinha os itens horizontalmente ao centro */
    align-items: center;
    /* Alinha os itens verticalmente ao centro */
    gap: 2vw;
    /* Espaçamento de 2% da largura da janela entre os elementos  */
}

/* Estilo para a primeira linha no Capítulo 1 */
.Capitulo_1 .linha_1 {
    width: 34.8vw;
    /* Largura de 30% da largura da janela */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
    row-gap: 2vh;
    /* Espaçamento de 2% da altura da janela entre os itens */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
}

/* Estilo para o painel dentro da linha 1 no Capítulo 1 */
.Capitulo_1 .linha_1 .painel {
    width: 34.8vw;
    /* Largura de 30% da largura da janela */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
}

/* Estilo para a seção Corpo dentro do painel da linha 1 no Capítulo 1 */
.Capitulo_1 .linha_1 .Corpo {
    width: 34.8vw;
    /* Largura de 30% da largura da janela */
    height: 47vh;
    /* Altura de 47% da altura da janela */
    padding-top: 2vh;
    /* Espaçamento superior de 2% da altura da janela */
    background-color: var(--Matriz);
    /* Cor de fundo usando uma variável CSS */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
    justify-content: start;
    /* Alinha os itens ao topo */
    align-content: start;
    /* Alinha o conteúdo ao topo */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    gap: 1vw;
    /* Espaçamento entre os itens de 1% da largura da janela */
    overflow-y: auto;
    /* Habilita rolagem vertical caso o conteúdo ultrapasse a altura */
}

/* Estilo para o título (h2) dentro do Corpo no Capítulo 1 */
.Capitulo_1 .linha_1 .Corpo h2 {
    color: var(--Cor_Segundaria_5_1);
    /* Cor do título usando uma variável CSS */
    font-family: var(--font_titulo);
    /* Fonte para o título */
    font-size: 1vw;
    /* Tamanho de fonte de 1% da largura da janela */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para a seção 'cap' dentro da linha 1 no Capítulo 1 */
.Capitulo_1 .linha_1 .cap {
    width: 34.8vw;
    /* Largura de 30% da largura da janela */
    height: 5vh;
    /* Altura de 5% da altura da janela */
    background-color: var(--Cor_Segundaria_5_1);
    /* Cor de fundo usando uma variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Matriz);
    /* Cor do texto usando uma variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens ao centro horizontalmente */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para a segunda linha no Capítulo 1 */
.Capitulo_1 .linha_2 {
    width: 20vw;
    /* Largura de 20% da largura da janela */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
    row-gap: 2vh;
    /* Espaçamento de 2% da altura da janela entre os itens */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
}

/* Estilo para o painel dentro da linha 2 no Capítulo 1 */
.Capitulo_1 .linha_2 .painel {
    width: 20vw;
    /* Largura de 20% da largura da janela */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
}

/* Estilo para a seção Corpo_1 dentro da linha 2 no Capítulo 1 */
.Capitulo_1 .linha_2 .Corpo_1 {
    width: 20vw;
    /* Largura de 20% da largura da janela */
    height: 34vh;
    /* Altura de 34% da altura da janela */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    background-color: var(--Matriz);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    flex-direction: column;
    /* Organiza os itens em coluna */
    align-items: center;
    /* Alinha os itens ao centro */
    justify-content: center;
    /* Alinha os itens ao centro */
    overflow: hidden;
    /* Impede o transbordamento de conteúdo */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para o botão dentro da cap na linha 2 do Capítulo 1 */
.Capitulo_1 .linha_2 .cap button {
    background: none;
    /* Remove o fundo do botão */
    border: none;
    /* Remove a borda do botão */
    outline: none;
    /* Remove o contorno do botão */
    font-family: var(--font_titulo);
    /* Fonte usada no botão */
    font-size: 1vw;
    /* Tamanho da fonte de 1.7% da largura da janela */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
}

/* Estilo para a seção Corpo_2 dentro da linha 2 no Capítulo 1 */
.Capitulo_1 .linha_2 .Corpo_2 {
    width: 20vw;
    /* Largura de 20% da largura da janela */
    height: 8vh;
    /* Altura de 8% da altura da janela */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    background-color: var(--Matriz);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Cor_Segundaria_5_1);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens ao centro horizontalmente */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para o botão dentro da cap na linha 2 do Capítulo 1 */
.Capitulo_1 .linha_2 .cap {
    width: 20vw;
    /* Largura de 20% da largura da janela */
    height: 5vh;
    /* Altura de 5% da altura da janela */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    background-color: var(--Cor_Segundaria_5_1);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no botão */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens ao centro horizontalmente */
    overflow: hidden;
    /* Impede o transbordamento de conteúdo */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilos do painel no Capítulo 2 */
.Capitulo_2 .painel {
    width: 97%;
    /* Largura de 97% da largura do contêiner */
    height: 40vh;
    /* Altura de 40% da altura da janela */
}

/* Estilo da cap no Capítulo 2 */
.Capitulo_2 .cap {
    width: 100%;
    /* Ocupa toda a largura disponível */
    height: 5vh;
    /* Altura de 5% da altura da janela */
    background-color: var(--Cor_Segundaria_5_1);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no título */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens à direita */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para a coluna 1 dentro da cap do Capítulo 2 */
.Capitulo_2 .cap .Coluna_1 {
    width: 70%;
    /* Largura de 70% da largura da cap */
    height: 5vh;
    /* Altura de 5% da altura da cap */
    background-color: var(--Cor_Segundaria_5_1);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens à direita */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para a coluna 2 dentro da cap do Capítulo 2 */
.Capitulo_2 .cap .Coluna_2 {
    width: 30%;
    /* Largura de 30% da largura da cap */
    height: 4vh;
    /* Altura de 4% da altura da cap */
    padding-right: 4vw;
    /* Espaçamento à direita de 4% da largura da janela */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Matriz);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: right;
    /* Alinha os itens à direita */
    padding-left: 10vw;
    /* Espaçamento à esquerda de 10% da largura da janela */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Estilo para o botão dentro da coluna 2 no Capítulo 2 */
.Capitulo_2 .cap .Coluna_2 button {
    color: #D9D9D9;
    /* Cor do texto do botão */
    background-color: var(--Cor_Segundaria_5_1);
    /* Cor de fundo do botão */
    border-radius: 12vh;
    /* Borda arredondada */
    font-family: var(--font_titulo);
    /* Fonte usada no botão */
    border: 0.1vw solid var(--Matriz);
    /* Borda fina e branca */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}

/* Efeito de hover no botão da coluna 2 do Capítulo 2 */
.Capitulo_2 .cap .Coluna_2 button:hover {
    color: var(--Cor_Segundaria_5_1);
    /* Muda a cor do texto */
    background-color: #D9D9D9;
    /* Muda a cor de fundo */
    transition: 1s ease;
    /* Transição suave de 1 segundo */
}

/* Estilo do Corpo no Capítulo 2 */
.Capitulo_2 .Corpo {
    width: 100%;
    /* Ocupa toda a largura disponível */
    height: 25vh;
    /* Altura de 25% da altura da janela */
    background-color: var(--Matriz);
    /* Cor de fundo usando variável CSS */
    font-family: var(--font_titulo);
    /* Fonte usada no texto */
    color: var(--Cor_Segundaria_5_1);
    /* Cor do texto usando variável CSS */
    display: flex;
    /* Flexbox para layout */
    align-items: center;
    /* Alinha os itens ao centro verticalmente */
    justify-content: center;
    /* Alinha os itens ao centro horizontalmente */
    /* Tamanho da fonte de 2.2% da largura da janela */
    font-size: 1vw;
    /*define o tamanho da fonte*/
}