/* ----------------------------
   RESET E ESTILO GLOBAL
---------------------------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-family: 'Poppins', sans-serif;
  background: #094985;
  color: #333;
  overflow-x: hidden;
}

/* Exemplo de imagem de fundo só na página "Início" */
body.pagina-inicio {
  background-image: url('img-bg.png'); /* imagem de fundo da página */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* Espaço abaixo do header fixo */
main {
  flex: 1;
  padding-top: 70px;
}

/* ----------------------------
 HEADER E MENU
---------------------------- */
header {
  background: #0c1a46;
  padding: 10px 0;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

header .container {
  width: 90%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  height: 60px;
}

.icon-insta {
  width: 20px;
  height: 20px;
}

/* Ícone do menu com imagem personalizada */
.menu-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 2rem;
  color: white;
  cursor: pointer;
}

/* Navegação */
nav {
  display: flex;
}

nav a {
  color: #ffffff;
  margin-left: 20px;
  text-decoration: none;
  font-weight: bold;
  transition: 0.3s;
}

nav a:hover {
  text-decoration: underline;
  color: #bf8a35;
}

/* ----------------------------
   FOOTER PERSONALIZADO
---------------------------- */
.footer-personalizado {
  background-color: #0c1a46;
  color: white;
  padding: 20px 5%;
  font-family: 'Poppins', sans-serif;
}

/* Título "PARCEIROS" */
.footer-titulo {
  text-align: center;
  margin-bottom: 30px;
}

.footer-titulo h2 {
  font-size: 2rem;
  font-weight: 700;
  color: white;
  text-transform: uppercase;
}

/* Bloco com colunas de parceiros */
.img-parceiros {
  display: flex;
  justify-content: center;
  align-items: center; /* opcional, para alinhar verticalmente */
  margin-bottom: 50px;
  background-color: white;

}

.img-parceiros img {
  max-width: 150px;
  max-height: 150px;
  margin: 10px;
  background-color: white;
  border: 10px solid white;
  border-radius: 10px;
}

/* Bloco inferior com email, instagram e logo */
.footer-contato {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  padding-top: 20px;
  border-top: 1px solid #1e3c6c;
}

.footer-contato > div {
  flex: 1;
  min-width: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.footer-contato .email,
.footer-contato .instagram {
  justify-content: flex-start;
  font-weight: 600;
}

.footer-contato .email img,
.footer-contato .instagram img {
  width: 24px;
  height: auto;
  margin-right: 10px;
}

.logo-footer img {
  height: 80px;
  width: auto;
  max-width: 100%;
}

.logo-footer {
  justify-content: flex-end;
}

.logo-footer img {
  height: 80px;
  max-width: 100%;
}

.footer-direitos {
  text-align: center;
  font-size: 0.9rem;
  color: #ccc;
  border-top: 1px solid #1e3c6c; /* linha discreta */
  margin-top: 20px;
  padding-top: 10px;
}

.footer-direitos p {
  margin-top: 10px;
}
/* ----------------------------
 BOTÕES E LINKS
---------------------------- */
.botao {
  display: inline-block;
  background: #002b5c;
  color: white;
  padding: 12px 25px;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: 0.3s;
  margin-top: 20px;
}

.botao:hover {
  background: #004080;
  color: white;
}

.link-edital {
  display: inline-flex;
  align-items: center;
  color: #002b5c;
  text-decoration: underline;
  font-size: 1.1em;
  transition: 0.3s;
}

.link-edital img {
  width: 20px;
  margin-right: 8px;
}

.link-edital:hover {
  color: #004080;
  text-decoration: none;
  font-weight: bold;
}

/* ----------------------------
 PÁGINA INÍCIO
---------------------------- */
.inicio-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 30px;
}

/* Coluna esquerda com logo */
.inicio-esquerda {
  flex: 1 1 350px;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  padding: 50px 4% 0px 4%;
}

.logo-ciesc {
  align-items: center;
}

.logo-img {
  max-width: 70%;
  height: auto;
  padding-bottom: 30px;
}

/* Coluna direita com os eventos */
.inicio-direita {
  flex: 1 1 350px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-right: 5%;
  padding: 80px 0% 0px 0%;
}

/* ----------------------------
 BLOCOS DE EVENTOS
---------------------------- */
.bloco-evento {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #f0f0f0;
  padding: 5px 30px;
  border-radius: 10px;
  transition: 0.3s ease-in-out;
  border-left: 6px solid transparent;
}

.bloco-evento img {
  width: auto;
  height: 72px;
  max-width: 100%;
  object-fit: contain;
}

.bloco-evento h3 {
  font-size: 1.2em;
  margin: 0;
}

/* Evento destaque (azul com texto branco) */
.evento-principal {
  background-color: #0a2c5d;
  color: white;
  border-left: 6px solid #0a2c5d;
}

.evento-principal h3 {
  color: white;
}

/* Workshop (amarelo) */
.evento-workshop {
  border-left: 6px solid #c59c0c;
}

.evento-workshop h3 {
  color: #c59c0c;
}

/* Extensão (azul claro) */
.evento-extensao {
  border-left: 6px solid #1c5ca8;
}

.evento-extensao h3 {
  color: #1c5ca8;
}

/* Torneios (vermelho) */
.evento-torneios {
  border-left: 6px solid #b32121;
}

.evento-torneios h3 {
  color: #b32121;
}

.evento-prototipos {
  border-left: 6px solid #5e98ca;
}

/* Hover de todos os blocos */
.bloco-evento:hover {
  background-color: #e6e6e6;
  transform: scale(1.02);
}

/* ----------------------------
 SEÇÃO "O CIESC"
---------------------------- */
.sobre-ciesc {
  background-color: #0a2c5d;
  color: white;
  padding: 4rem 1rem;
  font-family: 'Poppins', sans-serif;
  margin-top: 100px;
  margin-left: 5%;
  margin-right: 5%;
  margin-bottom: 5%;
}

.container-ciesc {
  display: flex;
  margin: 0 auto;
  padding: 0 1rem; /* Ajuste do padding lateral */
  gap: 2rem;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}

/* Lado da imagem */
.imagem-ciesc {
  flex: 1;
  min-width: 280px;
  max-width: 100%;
  display: flex;
  justify-content: center;
}

.imagem-ciesc img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Lado do texto */
.texto-ciesc {
  flex: 2;
  min-width: 280px;
  max-width: 700px;
  text-align: justify;
}

.texto-ciesc h2 {
  font-size: 6rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  text-align: center;
}

.texto-ciesc h3 {
  text-align: center;
  font-size: 1.5rem;
  color: #bf8a35;
  font-weight: 600;
}

.divisor-amarelo {
  width: 350px;
  height: 4px;
  background-color: #bf8a35;
  border: none;
  margin: 0 auto 1.5rem;
  margin-bottom: 60px;
}

.texto-ciesc p {
  font-size: 1.1rem;
  line-height: 1.7;
  margin-bottom: 1.2rem;
}

.texto-ciesc strong {
  color: #bf8a35;
  font-weight: 600;
}

/* ----------------------------
   CRONOGRAMA CIESC
---------------------------- */

.cronograma-titulo-ciesc {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #bf8a35;
    padding-right: 30px;
}

.data-evento-ciesc {
  background-color: #002f6c;
  color: #ffffff;
  font-weight: 700;
  padding: 15px 25px;
  border-radius: 5px;
  white-space: nowrap; /* Impede a quebra de linha da data */
  text-align: center;
  font-size: 1.1rem;
  align-self: flex-start;
  min-width: 150px;
}

.descricao-evento-ciesc {
  background-color: #0c1a46;
  color: #ffffff;
  padding: 20px;
  border-radius: 5px;
  flex-grow: 1;
}




/* ----------------------------
   SEÇÃO DE INFORMAÇÕES ADICIONAIS (SUBMISSÃO, INSCRIÇÃO, EDITAIS)
---------------------------- */
.info-adicionais-ciesc {
    /*background: linear-gradient(to right, #004080, #001f4d); /* Mesmo gradiente da seção "Mais Informações" */
    color: white;
    padding: 60px 5%;
    font-family: 'Poppins', sans-serif;
    width: 100%;
}

.container-info-adicionais {
    max-width: 1200px; /* Largura máxima para o conteúdo */
    margin: 0 auto; /* Centraliza o contêiner */
    display: flex;
    justify-content: space-around; /* Distribui o espaço entre os blocos */
    gap: 30px; /* Espaço entre as colunas */
    flex-wrap: wrap; /* Permite que as colunas quebrem para a próxima linha em telas menores */
    align-items: flex-start; /* Alinha os blocos ao topo */
    height: 100%;
}

.info-bloco {
    flex: 1; /* Permite que os blocos cresçam e encolham */
    min-width: 300px; /* Largura mínima para evitar que fiquem muito apertados */
    background-color: #002f6c; /* Fundo azul escuro, similar aos outros blocos */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #bf8a35; /* Borda amarela, para contraste ou seguir o estilo de destaque */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    display: flex; /* Para flex-direction column para organizar o conteúdo interno */
    flex-direction: column;
    height: 100%; /* Garante que os blocos tenham a mesma altura */
}

.info-bloco h3 {
    font-size: 1.8rem;
    color: #bf8a35; /* Cor do título (amarelo) */
    margin-bottom: 25px;
    text-align: center;
    text-transform: uppercase;
}

.info-bloco p {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 15px;
    color: #ccc; /* Cor do texto padrão */
}

.info-bloco p strong {
    color: white; /* Deixa o texto em negrito branco */
}

.info-bloco .texto-adicional {
    margin-top: 20px;
    font-size: 0.95rem;
    color: #a0a0a0;
    font-style: italic;
}

/* Estilo para os botões dentro de Submissão */
.botoes-info-adicionais {
    margin-top: auto; /* Empurra os botões para baixo */
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 25px;
}

.botao-info-adicional {
    display: block; /* Ocupa a largura total */
    background-color: #bf8a35; /* Cor amarela do botão */
    color: #0c1a46;
    padding: 12px 20px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    text-align: center;
    transition: background-color 0.3s ease, color 0.3s ease;
    font-size: 0.95rem;
    text-transform: uppercase;
}

.botao-info-adicional:hover {
    background-color: #f4c14d;
    color: #0c1a46;
}

/* Estilo para links dentro de Inscrição */
.links-inscricao {
    margin-top: auto; /* Empurra os links para baixo */
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 25px;
}

.links-inscricao a {
    color: #bf8a35; /* Cor amarela para os links */
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
    font-size: 1rem;
    border-bottom: 1px solid rgba(244, 193, 77, 0.3); /* Linha sutil embaixo */
    padding-bottom: 5px;
}

.links-inscricao a:hover {
    color: white;
    border-bottom-color: white;
}

/* Estilo para links dentro de Editais */
.links-editais {
    margin-top: auto; /* Empurra os links para baixo */
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 25px;
}

.links-editais p {
    display: flex;
    align-items: center;
    margin-bottom: 5px; /* Ajusta a margem entre os parágrafos */
}

.links-editais p:last-child {
    margin-bottom: 0; /* Remove a margem do último item */
}

.links-editais a {
    color: #bf8a35; /* Cor amarela para os links */
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
    font-size: 1rem;
}

.links-editais a:hover {
    color: white;
}

.icon-pdf {
    width: 20px;
    height: auto;
    margin-right: 8px;
    vertical-align: middle; /* Alinha o ícone com o texto */
}

/* ----------------------------
 WORKSHOP
---------------------------- */

.workshops-ciesc {
  background: linear-gradient(to right, #bf8a35, #3e2806);
  padding: 60px 5%;
  color: white;
  font-family: 'Poppins', sans-serif;
}

.workshops-container {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* Linha superior com data à esquerda e logo à direita */
.workshops-linha-superior {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

/* ----------------------------
   INTRODUÇÃO DOS WORKSHOPS
---------------------------- */
.workshops-introducao-container {
    display: flex; /* Ativa o Flexbox para alinhar texto e imagem */
    justify-content: center; /* Centraliza os itens horizontalmente */
    align-items: center; /* Alinha os itens verticalmente */
    flex-wrap: wrap; /* Permite que os itens quebrem para a próxima linha em telas menores */
    max-width: 1200px; /* Limita a largura do container */
    margin: 40px 0 0 40px; /* Centraliza o container */
    padding: 0 20px; /* Padding interno */
    gap: 30px; /* Espaço entre texto e imagem */
}

.workshops-introducao {
    flex: 2; /* Texto pode ocupar mais espaço (ex: 2/3) */
    min-width: 200px; /* Largura mínima para o texto */
    text-align: center;
    color: white;
    line-height: 1.8;
    font-size: 1.1rem;
    padding: 10px; /* Remove padding interno, já no container pai */
}

.workshops-introducao p {
    margin-bottom: 30px;
    font-size: 1.5rem;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
}

.workshops-introducao p strong.strong-intro { /* Para o texto em negrito no parágrafo */
  color: #efb82e;
}

.workshops-introducao-imagem-wrapper {
    flex: 1; /* Imagem ocupa o espaço restante (ex: 1/3) */
    display: flex;
    justify-content: flex-end; /* Empurra a imagem para a direita dentro do wrapper */
    align-items: center;
    min-width: 250px; /* Largura mínima para a imagem */
    /* Ajuste de margem para "colar" na borda direita da tela,
       compensando o padding da .workshops-ciesc (5%) */
    margin-right: calc(-5vw - 20px); /* 5vw do padding da seção + 20px do padding interno */
    width: auto; /* Permite que a imagem ajuste sua largura */
    
}

.workshops-introducao-imagem-wrapper img {
    max-width: 100%; /* Garante que a imagem não ultrapasse seu contêiner */
    height: auto;
    display: block; /* Remove espaço extra abaixo da imagem */
    border-radius: 10px;
    border-right: 5px solid #b56f05;
    border-bottom: 5px solid #b56f05;
}




/*.strong-intro {
  color: #efb82e
}*/

.botao-inscrevase {
    display: inline-block;
    background-color: #bf8a35; /* Cor do botão inspirada no dourado do site */
    color: #ffffff; /* Cor do texto no botão */
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    font-size: 1.1rem;
    text-transform: uppercase;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para destacar o botão */
}

.botao-inscrevase:hover {
    background-color: #efb82e; /* Cor mais clara no hover */
    color: #46370c;
}

/* CURSOS WORKSHOP */

.workshops-data {
  font-size: 1.8rem;
  font-weight: 600;
  text-align: left;
  color: white;
}

.workshops-data .linha-amarela {
  width: 100%;
  height: 4px;
  background-color: #efb82e;
  margin-top: 10px;
}

/* Bloco da logo do workshop */
.workshops-cabecalho.esquerda {
  display: flex;
  justify-content: flex-end;
  margin-right: calc(-6%); /* cola na lateral direita da tela */
}

.icone-titulo {
  display: flex;
  align-items: center;
  gap: 15px;
  background: white;
  padding: 15px 200px 15px 25px; /* top, right, bottom, left */
  border-radius: 15px 0 0 15px;
}

.icone-titulo h2 {
  color: #b56f05;
  font-size: 1.8rem;
  margin: 0;
  line-height: 1.2;
  text-align: right;
}

.icone-titulo img {
  height: 100px;
  width: auto;
}

/* Bloco de descrição */
.workshops-conteudo {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.descricao-workshop {
  background: #bf8a35;
  border-radius: 15px;
  padding: 25px;
  color: white;
}

.descricao-workshop h3 {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 15px;
}

.descricao-workshop p {
  margin-bottom: 12px;
  font-size: 1rem;
  line-height: 1.6;
}

/* Lista de cursos */
.lista-cursos {
  list-style: none;
  padding-left: 0;
  margin-top: 20px;
}

.lista-cursos li {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  font-weight: 600;
}

.quadrado-amarelo {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-color: #bf8a35;
  margin-right: 10px;
  flex-shrink: 0;
}

.workshops-detalhados-container {
    display: flex;
    flex-direction: column;
    gap: 60px; /* Espaço entre os blocos de workshops */
    margin-top: 80px;
}

.bloco-workshop {
    margin: 0; /* Centraliza o bloco */
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.titulo-workshop {
    background-color: #bf8a35;
    color: #ffffff;
    padding: 15px 30px;
    font-weight: 700;
    font-size: 1.5rem;
    border-radius: 5px;
    width: fit-content; /* Largura se ajusta ao conteúdo */
    text-transform: uppercase;
}

.titulo-workshop h2 {
    margin: 0;
    font-size: 1.5rem;
}

.conteudo-workshop-detalhado {
    display: flex;
    align-items: center;
    gap: 40px;
    background-color: #bf8a35;
    padding: 40px;
    border-radius: 10px;
    border-left: 5px solid #ffffff;
}

.imagem-circulo {
  flex-shrink: 0;
  width: 150px;
  height: 150px;
  border-radius: 50%; /* Transforma o div em um círculo */
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  /*border: 12px solid #b56f05;*/
}

.imagem-circulo img {
  width: 150px;
  height: auto;
  object-fit: contain;
  border-radius: 50%;
}



/* ----------------------------
   CRONOGRAMA DE CURSOS
---------------------------- */
.cronograma-cursos {
    color: white;
    padding: 60px 5%;
    font-family: 'Poppins', sans-serif;
    display: flex;
    justify-content: center; /* Centraliza o conteúdo horizontalmente */
    align-items: center;
    min-height: 100vh;
    width: 100%;
}

.cronograma-container {
    display: flex;
    width: 100%;
    gap: 50px;
    align-items: center;
}

.cronograma-titulo {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #bf8a35;
    padding-right: 30px;
}

.cronograma-lista {
    flex-grow: 1; /* Permite que a lista ocupe o espaço restante */
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.evento-item {
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

.data-evento {
    background-color: #bf8a35;
    color: #ffffff;
    font-weight: 700;
    padding: 15px 25px;
    border-radius: 5px;
    white-space: nowrap; /* Impede a quebra de linha da data */
    text-align: center;
    font-size: 1.1rem;
    align-self: flex-start;
    min-width: 150px;
}

.descricao-evento {
    background-color: #bf8a35;
    padding: 20px;
    border-radius: 5px;
    flex-grow: 1;
}

.descricao-evento h3 {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 1.2rem;
    font-weight: 600;
    color: #ffffff;
}

.descricao-evento p {
    margin: 5px 0;
    font-size: 0.95rem;
    line-height: 1.4;
    color: #ffffff;
}

.descricao-evento .nota-evento {
    font-size: 0.8rem;
    color: #333333;
    margin-top: 10px;
    line-height: 1.3;
}

/* --------------------------
          EXTENSÃO 
---------------------------- */

.extensao-ciesc {
  background: linear-gradient(to right, #002f6c, #0c1a46);
  padding: 60px 5%;
  color: white;
  font-family: 'Poppins', sans-serif;
  width: 100%;
}

.extensao-container {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* Linha superior com data à esquerda e logo à direita */
.extensao-linha-superior {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

/* ----------------------------
   INTRODUÇÃO DOS EXTENSÃO
---------------------------- */
.extensao-introducao {
    max-width: 1000px; /* Largura máxima para o texto */
    margin: 40px auto; /* Centraliza e adiciona margem acima e abaixo */
    margin-top: 5%;
    text-align: center;
    color: white; /* Garante que o texto seja branco */
    line-height: 1.8;
    font-size: 1.1rem;
    padding: 0 20px; /* Adiciona um pequeno padding lateral para telas menores */
}

.extensao-introducao p {
    margin-bottom: 30px; /* Espaço entre o texto e o botão */
    font-size: 1.5rem;
    font-weight: 600; /* Deixa o texto mais chamativo */
    color: #ffffff; /* Cor mais chamativa para o texto */
}

.strong-intro-ext{
  color: #5e98ca;
}

.ext-introducao-imagem-wrapper {
    flex: 1; /* Imagem ocupa o espaço restante (ex: 1/3) */
    display: flex;
    justify-content: flex-end; /* Empurra a imagem para a direita dentro do wrapper */
    align-items: center;
    min-width: 250px; /* Largura mínima para a imagem */
    /* Ajuste de margem para "colar" na borda direita da tela,
       compensando o padding da .workshops-ciesc (5%) */
    margin-right: calc(-5vw - 20px); /* 5vw do padding da seção + 20px do padding interno */
    width: auto; /* Permite que a imagem ajuste sua largura */
    
}

.ext-introducao-imagem-wrapper img {
    max-width: 100%; /* Garante que a imagem não ultrapasse seu contêiner */
    height: auto;
    display: block; /* Remove espaço extra abaixo da imagem */
    border-radius: 10px;
    border-right: 5px solid #5e98ca;
    border-bottom: 5px solid #5e98ca;
}

.botao-inscrevase-ext {
    display: inline-block;
    background-color: #054985; /* Cor do botão inspirada no dourado do site */
    color: #ffffff; /* Cor do texto no botão */
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    font-size: 1.1rem;
    text-transform: uppercase;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para destacar o botão */
}

.botao-inscrevase-ext:hover {
    background-color: #054985; /* Cor mais clara no hover */
    color: #0c1a46;
}

.extensao-data {
  font-size: 1.8rem;
  font-weight: 600;
  text-align: left;
  color: white;
}

.extensao-data .linha-azul-claro {
  width: 100%;
  height: 4px;
  background-color: #5e98ca;
  margin-top: 10px;
}

.descricao-evento-ext {
    background-color: #5e98ca;
    padding: 20px;
    border-radius: 5px;
    flex-grow: 1;
    align-items: center;
}

.cronograma-titulo-ext {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #5e98ca;
    padding-right: 30px;
}

/* Bloco da logo do workshop */
.extensao-cabecalho.esquerda {
  display: flex;
  justify-content: flex-end;
  margin-right: calc(-6%); /* cola na lateral direita da tela */
}

.icone-titulo-ext {
  display: flex;
  align-items: center;
  gap: 15px;
  background: white;
  border-radius: 15px 0 0 15px;
}

.icone-titulo-ext h2 {
 padding: 15px 200px 15px 25px; /* top, right, bottom, left */
   color: #5e98ca;
  font-size: 1.8rem;
  margin: 0;
  line-height: 1.2;
  text-align: right;
}

.icone-titulo-ext img {
  height: 100px;
  width: auto;
}

/* ----------------------------
   SEÇÃO COMO PARTICIPAR E O QUE ACONTECE (EXTENSÃO)
---------------------------- */
.extensao-como-participar {
    max-width: 1000px; /* Alinhe com a largura da introdução da extensão */
    margin: 60px auto; /* Espaçamento e centralização */
    padding: 0 20px; /* Padding para evitar colar nas bordas em telas menores */
    display: flex;
    flex-direction: column;
    gap: 40px; /* Espaço entre os dois blocos (Como participar e O que acontece) */
    color: white; /* Cor do texto padrão para esta seção */
}

.bloco-info-extensao {
    background-color: #1a346e; /* Cor de fundo semelhante aos blocos de workshop detalhados */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #5e98ca; /* Borda lateral azul-claro */
}

.bloco-info-extensao h3 {
    font-size: 1.8rem;
    color: #5e98ca; /* Título em azul-claro */
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.bloco-info-extensao .titulo-passos {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 15px;
    text-align: left;
    color: #c0c0c0; /* Cor mais suave para este título */
}

.bloco-info-extensao ul {
    list-style: none; /* Remove os marcadores de lista padrão */
    padding-left: 0;
}

.bloco-info-extensao ul li {
    margin-bottom: 10px;
    line-height: 1.6;
    font-size: 1rem;
}

.bloco-info-extensao ul li strong {
    color: white; /* Garante que o texto em negrito seja branco */
}

.bloco-info-extensao ul ul li { /* Estilo para a lista aninhada (R$ 40,00 e R$ 30,00) */
    margin-left: 20px; /* Indentação */
    font-size: 0.95rem;
    color: #ccc;
    font-weight: normal;
}

.bloco-info-extensao a {
    color: #00bad7; /* Cor do link dentro do texto */
    text-decoration: underline;
    font-weight: 600;
    transition: color 0.3s ease;
}

.bloco-info-extensao a:hover {
    color: #66e0ff; /* Cor do link ao passar o mouse */
}



/* ----------------------------
   CRONOGRAMA DA EXTENSÃO
---------------------------- */
.cronograma-extensao {
    width: 100%;
    color: white;
    padding: 60px 5%;
    font-family: 'Poppins', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

/* Reutiliza as classes cronograma-container, cronograma-titulo, cronograma-lista, evento-item, descricao-evento */
/* Apenas a data-evento terá uma cor diferente para diferenciar */

.data-evento-ext {
    background-color: #5e98ca;
    color: #ffffff;
    font-weight: 700;
    padding: 15px 25px;
    border-radius: 5px;
    white-space: nowrap;
    text-align: center;
    font-size: 1.1rem;
    align-self: flex-start;
    min-width: 150px;
}

/* --------------------------
          TORNEIO 
---------------------------- */

.torneio-ciesc {
  background: linear-gradient(to right, #6c0000, #460c0c);
  padding: 60px 5%;
  color: white;
  font-family: 'Poppins', sans-serif;
  width: 100%;
}

.torneio-container {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* Linha superior com data à esquerda e logo à direita */
.torneio-linha-superior {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

/* ----------------------------
   INTRODUÇÃO DOS EXTENSÃO
---------------------------- */
.torneio-introducao {
    max-width: 970px; /* Largura máxima para o texto */
    margin: 40px auto; /* Centraliza e adiciona margem acima e abaixo */
    margin-top: 5%;
    text-align: center;
    color: white; /* Garante que o texto seja branco */
    line-height: 1.8;
    font-size: 1.1rem;
    padding: 0 20px; /* Adiciona um pequeno padding lateral para telas menores */
}

.torneio-introducao p {
    margin-bottom: 30px; /* Espaço entre o texto e o botão */
    font-size: 1.5rem;
    font-weight: 600; /* Deixa o texto mais chamativo */
    color: #ffffff; /* Cor mais chamativa para o texto */
}

.strong-intro-tor{
  color: #ff2929 ;
}

.tor-introducao-imagem-wrapper {
    flex: 1; /* Imagem ocupa o espaço restante (ex: 1/3) */
    display: flex;
    justify-content: flex-end; /* Empurra a imagem para a direita dentro do wrapper */
    align-items: center;
    min-width: 250px; /* Largura mínima para a imagem */
    /* Ajuste de margem para "colar" na borda direita da tela,
       compensando o padding da .workshops-ciesc (5%) */
    margin-right: calc(-5vw - 20px); /* 5vw do padding da seção + 20px do padding interno */
    width: auto; /* Permite que a imagem ajuste sua largura */
    
}

.tor-introducao-imagem-wrapper img {
    max-width: 100%; /* Garante que a imagem não ultrapasse seu contêiner */
    height: auto;
    display: block; /* Remove espaço extra abaixo da imagem */
    border-radius: 10px;
    border-right: 5px solid #d70000;
    border-bottom: 5px solid #d70000;
}

.botao-inscrevase-tor {
    display: inline-block;
    background-color: #d70000; /* Cor do botão inspirada no dourado do site */
    color: #ffffff; /* Cor do texto no botão */
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    font-size: 1.1rem;
    text-transform: uppercase;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para destacar o botão */
}

.botao-inscrevase-tor:hover {
    background-color: #d70000; /* Cor mais clara no hover */
    color: #460c0c;
}

.torneio-data {
  font-size: 1.8rem;
  font-weight: 600;
  text-align: left;
  color: white;
}

.torneio-data .linha-vermelha {
  width: 100%;
  height: 4px;
  background-color: #d70000;
  margin-top: 10px;
}


/* Bloco da logo do workshop */
.torneio-cabecalho.esquerda {
  display: flex;
  justify-content: flex-end;
  margin-right: calc(-6%); /* cola na lateral direita da tela */
}

.icone-titulo-tor {
  display: flex;
  align-items: center;
  gap: 15px;
  background: white;
  border-radius: 15px 0 0 15px;
}

.icone-titulo-tor h2 {
 padding: 15px 200px 15px 25px; /* top, right, bottom, left */
   color: #ffffff;
  font-size: 1.8rem;
  margin: 0;
  line-height: 1.2;
  text-align: right;
}

.icone-titulo-tor img {
  height: 100px;
  width: auto;
}

/* ----------------------------
   FASES DO TORNEIO
---------------------------- */
.torneio-fases {
    max-width: 1000px; /* Largura máxima para o conteúdo, centralizando */
    margin: 60px auto; /* Espaçamento e centralização */
    padding: 0 20px; /* Padding para evitar colar nas bordas em telas menores */
    color: white; /* Cor do texto padrão para esta seção */
}

.bloco-fase-torneio {
    background-color: #420505; /* Cor de fundo mais escura para o bloco de fases */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #d70000; /* Borda lateral vermelha */
}

.bloco-fase-torneio h3 {
    font-size: 1.8rem;
    color: #d70000; /* Título em vermelho */
    margin-bottom: 25px;
    text-align: center;
    text-transform: uppercase;
}

.bloco-fase-torneio ul {
    list-style: none; /* Remove os marcadores de lista padrão */
    padding-left: 0;
}

.bloco-fase-torneio ul li {
    margin-bottom: 15px; /* Espaçamento entre os itens da lista principal */
    line-height: 1.6;
    font-size: 1.1rem;
    font-weight: 600; /* Texto das fases em negrito */
    color: white; /* Cor do texto das fases principais */
}

.bloco-fase-torneio ul ul { /* Estilo para as sublistas (detalhes de cada fase) */
    list-style: disc; /* Adiciona marcadores de disco */
    margin-left: 30px; /* Indentação para a sublista */
    margin-top: 5px;
    margin-bottom: 15px;
}

.bloco-fase-torneio ul ul li {
    font-size: 1rem;
    font-weight: normal; /* Texto normal para os detalhes */
    color: #ccc; /* Cor mais suave para os detalhes */
    margin-bottom: 5px; /* Menor espaçamento entre os detalhes */
}

/* ----------------------------
   PREMIAÇÃO DO TORNEIO
---------------------------- */
.torneio-premiacao {
    max-width: 1000px; /* Alinhe com a largura das fases do torneio */
    margin: 40px auto 60px auto; /* Espaçamento e centralização */
    padding: 0 20px; /* Padding para evitar colar nas bordas em telas menores */
    color: white;
}

.bloco-premiacao-torneio {
    background-color: #420505; /* Mesma cor de fundo do bloco de fases */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #d70000; /* Borda lateral vermelha */
    text-align: center;
}

.bloco-premiacao-torneio h3 {
    font-size: 1.8rem;
    color: #d70000; /* Título em vermelho */
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.bloco-premiacao-torneio ul {
    list-style: none; /* Remove os marcadores de lista padrão */
    padding-left: 0;
}

.bloco-premiacao-torneio ul li {
    margin-bottom: 10px;
    line-height: 1.6;
    font-size: 1.1rem;
    color: #ccc; /* Cor mais suave para o texto */
}

.bloco-premiacao-torneio ul li strong {
    color: white; /* Garante que o texto em negrito seja branco */
}


/* ----------------------------
   CRONOGRAMA DA TOR
---------------------------- */
.cronograma-torneio {
    width: 100%;
    color: white;
    padding: 60px 5%;
    font-family: 'Poppins', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

/* Reutiliza as classes cronograma-container, cronograma-titulo, cronograma-lista, evento-item, descricao-evento */
/* Apenas a data-evento terá uma cor diferente para diferenciar */

.data-evento-tor {
    background-color: #87000f; /* Cor azul-claro da seção de extensão */
    color: #ffffff;
    font-weight: 700;
    padding: 15px 25px;
    border-radius: 5px;
    white-space: nowrap;
    text-align: center;
    font-size: 1.1rem;
    align-self: flex-start;
    min-width: 150px;
}

.extensao-data {
  font-size: 1.8rem;
  font-weight: 600;
  text-align: left;
  color: white;
}

.extensao-data .linha-vermelho {
  width: 100px;
  height: 4px;
  background-color: #87000f;
  margin-top: 10px;
}

.descricao-evento-tor {
    background-color: #87000f;
    padding: 20px;
    border-radius: 5px;
    flex-grow: 1;
}

.cronograma-titulo-tor {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #87000f;
    padding-right: 30px;
}

/* ----------------------------
   SEÇÃO PRODUÇÃO CIENTÍFICA
---------------------------- */
.oficina-ciesc {
  background: linear-gradient(to right, #002f6c, #0c1a46);
  padding: 60px 5%;
  color: white;
  font-family: 'Poppins', sans-serif;
  width: 100%;
}

.oficina-container {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* Linha superior com data à esquerda e logo à direita */
.oficina-linha-superior {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.icone-titulo-of {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #0a2c5d;
  padding: 15px 200px 15px 25px; /* top, right, bottom, left */
  border-radius: 15px 0 0 15px;
}

.icone-titulo-of h2 {
  color: #bf8a35;
  font-size: 1.8rem;
  margin: 0;
  line-height: 1.2;
  text-align: right;
}

.icone-titulo-of img {
  height: 100px;
  width: auto;
}

/* ----------------------------
   INTRODUÇÃO DOS OFICINA
---------------------------- */
.oficina-introducao {
    max-width: 970px; /* Largura máxima para o texto */
    margin-top: 5%;
    text-align: center;
    color: white; /* Garante que o texto seja branco */
    line-height: 1.8;
    font-size: 1.1rem;
    padding: 0 20px; /* Adiciona um pequeno padding lateral para telas menores */
}

.oficina-introducao p {
    margin-bottom: 30px; /* Espaço entre o texto e o botão */
    font-size: 1.5rem;
    font-weight: 600; /* Deixa o texto mais chamativo */
    color: #ffffff; /* Cor mais chamativa para o texto */
}

.strong-intro-of{
  color: #bf8a35 ;
}

.of-introducao-imagem-wrapper {
    flex: 1; /* Imagem ocupa o espaço restante (ex: 1/3) */
    display: flex;
    justify-content: flex-end; /* Empurra a imagem para a direita dentro do wrapper */
    align-items: center;
    min-width: 250px; /* Largura mínima para a imagem */
    /* Ajuste de margem para "colar" na borda direita da tela,
       compensando o padding da .workshops-ciesc (5%) */
    margin-right: calc(-5vw - 20px); /* 5vw do padding da seção + 20px do padding interno */
    width: auto; /* Permite que a imagem ajuste sua largura */
    
}

.of-introducao-imagem-wrapper img {
    max-width: 100%; /* Garante que a imagem não ultrapasse seu contêiner */
    height: auto;
    display: block; /* Remove espaço extra abaixo da imagem */
    border-radius: 10px;
    border-right: 5px solid #bf8a35;
    border-bottom: 5px solid #bf8a35;
}

.linha-dourada {
  width: 100%;
  height: 4px;
  background-color: #bf8a35;
  margin-top: 10px;
}

.botao-inscrevase-of {
    display: inline-block;
    background-color: #bf8a35; /* Cor do botão inspirada no dourado do site */
    color: #ffffff; /* Cor do texto no botão */
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    font-size: 1.1rem;
    text-transform: uppercase;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para destacar o botão */
}

.botao-inscrevase-of:hover {
    background-color: #bf8a35; /* Cor mais clara no hover */
    color: #0a2c5d;
}

/* ----------------------------
   INFO DETALHES DA OFICINA
---------------------------- */
.oficina-infos-container {
    max-width: 1000px; /* Alinhe com o conteúdo principal */
    margin: 60px auto; /* Espaçamento e centralização */
    padding: 0 20px; /* Padding para evitar colar nas bordas em telas menores */
    display: flex;
    flex-direction: column; /* Empilha os blocos */
    gap: 40px; /* Espaço entre os blocos (Por que participar, O que esperar) */
    color: white;
}

.bloco-info-oficina {
    background-color: #0a2c5d; /* Fundo azul escuro */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #bf8a35; /* Borda lateral dourada */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.bloco-info-oficina h3 {
    font-size: 1.8rem;
    color: #bf8a35; /* Título em dourado */
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.bloco-info-oficina ul {
    list-style: none; /* Remove marcadores padrão */
    padding-left: 0;
}

.bloco-info-oficina ul li {
    margin-bottom: 10px;
    line-height: 1.6;
    font-size: 1rem;
    color: #ccc;
    position: relative;
    padding-left: 20px; /* Espaço para o marcador */
}

.bloco-info-oficina ul li::before {
    content: "\2022"; /* Marcador de ponto */
    color: #b57428; /* Cor do marcador dourada */
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.oficina-texto-final {
    margin-top: 30px;
    font-size: 1.1rem;
    font-style: italic;
    color: #a0a0a0;
    text-align: center;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* --------------------------
    PROTOTIPOS
--------------------------- */
.prototipo-ciesc {
  background: linear-gradient(to right, #5e98ca, #0c3a46);
  padding: 60px 5%;
  color: white;
  font-family: 'Poppins', sans-serif;
  width: 100%;
  margin-top: -2%;
}

.icone-titulo-pt {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #ffffff;
  padding: 15px 200px 15px 25px; /* top, right, bottom, left */
  border-radius: 15px 0 0 15px;
}

.icone-titulo-pt h2 {
  color: #bf8a35;
  font-size: 1.8rem;
  margin: 0;
  line-height: 1.2;
  text-align: right;
}

.icone-titulo-pt img {
  height: 100px;
  width: auto;
}

.strong-intro-pt{
  color: #002f6c ;
}

.pt-introducao-imagem-wrapper {
    flex: 1; /* Imagem ocupa o espaço restante (ex: 1/3) */
    display: flex;
    justify-content: flex-end; /* Empurra a imagem para a direita dentro do wrapper */
    align-items: center;
    min-width: 250px; /* Largura mínima para a imagem */
    /* Ajuste de margem para "colar" na borda direita da tela,
       compensando o padding da .workshops-ciesc (5%) */
    margin-right: calc(-5vw - 20px); /* 5vw do padding da seção + 20px do padding interno */
    width: auto; /* Permite que a imagem ajuste sua largura */
    
}

.pt-introducao-imagem-wrapper img {
    max-width: 100%; /* Garante que a imagem não ultrapasse seu contêiner */
    height: auto;
    display: block; /* Remove espaço extra abaixo da imagem */
    border-radius: 10px;
    border-right: 5px solid #002f6c;
    border-bottom: 5px solid #002f6c;
}

.linha-azul {
  width: 100%;
  height: 4px;
  background-color: #002f6c;
  margin-top: 10px;
}

/* ----------------------------
   CONTAINER PRINCIPAL DE DETALHES DO PROTÓTIPO
---------------------------- */
.prototipo-detalhes-container {
    max-width: 1000px; /* Alinhe com o conteúdo principal */
    margin: 60px auto; /* Espaçamento e centralização */
    padding: 0 20px; /* Padding para evitar colar nas bordas em telas menores */
    display: flex;
    flex-direction: column; /* Empilha os blocos */
    gap: 40px; /* Espaço entre os blocos */
    color: white;
}

/* ----------------------------
   BLOCO DE INFORMAÇÕES DO PROTÓTIPO (Objetivos, Quem pode participar, Premiação)
---------------------------- */
.bloco-info-prototipo {
    background-color: #002f6c; /* Fundo azul escuro, similar a outros blocos de info */
    padding: 30px;
    border-radius: 10px;
    border-left: 5px solid #5e98ca; /* Borda lateral azul claro */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.bloco-info-prototipo h3 {
    font-size: 1.8rem;
    color: #5e98ca; /* Título em azul claro */
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.bloco-info-prototipo ul {
    list-style: none; /* Remove marcadores padrão */
    padding-left: 0;
}

.bloco-info-prototipo ul li {
    margin-bottom: 10px;
    line-height: 1.6;
    font-size: 1rem;
    color: #ccc;
    position: relative;
    padding-left: 20px; /* Espaço para o marcador */
}

.bloco-info-prototipo ul li::before {
    content: "\2022"; /* Marcador de ponto */
    color: #002f6c; /* Cor do marcador azul escuro */
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.bloco-info-prototipo p {
    font-size: 1rem;
    line-height: 1.6;
    color: #ccc;
    text-align: justify;
}

.bloco-info-prototipo p strong {
    color: white; /* Garante que o texto em negrito seja branco */
}

/* ----------------------------
   TEXTO FINAL DO PROTÓTIPO (DENTRO DO CONTAINER)
---------------------------- */
.prototipo-texto-final {
    margin-top: 30px;
    font-size: 1.1rem;
    font-style: italic;
    color: #002049;
    text-align: center;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.edital-pg {
  text-align: center;
  margin-top: 10px;
}

.edital-pg a{
  text-align: center;
  text-decoration: none;
  color: white;
}

.edital-pg a:hover{
  color: #bf8a35;
}



/* ----------------------------
   RESPONSIVIDADE
---------------------------- */
@media (max-width: 992px) {
    /* HEADER E MENU */
    header .container {
        width: 95%;
        justify-content: space-between;
    }
    nav {
        flex-direction: column;
        align-items: center;
        gap: 1.5rem;
        position: absolute;
        top: 70px;
        right: 0;
        left: 0;
        z-index: 999;
        overflow: hidden;
        max-height: 0;
        transition: max-height 0.4s ease, padding 0.4s ease;
        background-color: #081d5f;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }
    nav.active {
        max-height: 500px;
        padding: 2rem 1rem;
    }
    nav a {
        font-size: 1.2rem;
        text-align: center;
    }
    .menu-toggle {
        display: block;
        font-size: 2rem;
    }

    /* AJUSTES GERAIS DE MARGENS E PADDING */
    main {
        padding-top: 60px;
    }
    
    /* FOOTER */
    .footer-contato {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .footer-contato > div {
        justify-content: center;
        text-align: center;
    }
    .footer-contato .email,
    .footer-contato .instagram {
        justify-content: center;
    }

    /* PÁGINA INÍCIO */
    .inicio-container {
        flex-direction: column;
        align-items: center;
        padding: 100px 0% 60px 0%;
        gap: 2rem;
        text-align: center;
    }
    .inicio-direita {
        flex: 1 1 350px;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-left: 5%;
        padding-right: 5%;
        align-items: center;
        margin: 0;
    }

    
    .bloco-evento {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: 100%;
    }
    .bloco-evento img { width: auto; height: 100px; }

    /* SEÇÃO "O CIESC" */
    .sobre-ciesc {
        padding: 3rem 1rem;
        margin-top: 50px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 3%;
        width: 90%;
        text-align: center;
    }
    .container-ciesc {
        flex-direction: column;
        gap: 2rem;
        justify-content: center;
        align-items: center;
    }
    .imagem-ciesc { margin-bottom: 20px; }
    .imagem-ciesc img { max-width: 70%; }
    .texto-ciesc { width: 100%; text-align: center; }
    .texto-ciesc h2 { font-size: 3rem; }
    .divisor-amarelo { width: 70%; margin: 0 auto 1.5rem auto; }
    .texto-ciesc p { font-size: 1rem; text-align: center; }

    /* CRONOGRAMAS (Geral CIESC, Workshops, Extensão, Torneio) */
    .cronograma-cursos,
    .cronograma-extensao,
    .cronograma-torneio {
        padding: 40px 0;
        text-align: center;
    }
    .cronograma-cursos .cronograma-container,
    .cronograma-extensao .cronograma-container,
    .cronograma-torneio .cronograma-container {
        flex-direction: column;
        gap: 40px;
        padding: 0 5%;
        justify-content: center;
        align-items: center;
    }
    .cronograma-cursos .cronograma-titulo-ciesc,
    .cronograma-cursos .cronograma-titulo,
    .cronograma-extensao .cronograma-titulo-ext,
    .cronograma-torneio .cronograma-titulo-tor {
        width: 100%;
        text-align: center;
        border-right: none;
        padding-right: 0;
        padding-bottom: 20px;
        font-size: 2.5rem;
        border-bottom: 4px solid;
    }
    .cronograma-cursos .cronograma-titulo-ciesc { border-bottom-color: #bf8a35; }
    .cronograma-cursos .cronograma-titulo { border-bottom-color: #bf8a35; }
    .cronograma-extensao .cronograma-titulo-ext { border-bottom-color: #5e98ca; }
    .cronograma-torneio .cronograma-titulo-tor { border-bottom-color: #87000f; }

    .cronograma-cursos .evento-item,
    .cronograma-extensao .evento-item,
    .cronograma-torneio .evento-item {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 15px;
    }
    .cronograma-cursos .data-evento-ciesc,
    .cronograma-cursos .data-evento,
    .cronograma-cursos .data-evento-tor,
    .cronograma-cursos .data-evento-ext,
    .cronograma-extensao .data-evento-ext,
    .cronograma-torneio .data-evento-tor {
        width: 150px;
        font-size: 1.2rem;
        align-self: center;
        text-align: center;
    }
    .cronograma-cursos .descricao-evento-ciesc,
    .cronograma-cursos .descricao-evento,
    .cronograma-cursos .descricao-evento-tor,
    .cronograma-cursos .descricao-evento-ext,
    .cronograma-extensao .descricao-evento-ext,
    .cronograma-torneio .descricao-evento-tor {
        width: 100%;
        text-align: center;
    }
    .cronograma-cursos .descricao-evento-ciesc h3,
    .cronograma-cursos .descricao-evento h3,
    .cronograma-cursos .descricao-evento-tor h3,
    .cronograma-cursos .descricao-evento-ext h3,
    .cronograma-extensao .descricao-evento-ext h3,
    .cronograma-torneio .descricao-evento-tor h3 {
        font-size: 1.2rem;
        text-align: center;
    }
    .cronograma-cursos .descricao-evento-ciesc p,
    .cronograma-cursos .descricao-evento p,
    .cronograma-cursos .descricao-evento-tor p,
    .cronograma-cursos .descricao-evento-ext p,
    .cronograma-extensao .descricao-evento-ext p,
    .cronograma-torneio .descricao-evento-tor p {
        text-align: center;
    }

    /* SEÇÃO DE INFORMAÇÕES ADICIONAIS */
    .info-adicionais-ciesc { padding: 40px 3%; text-align: center; }
    .container-info-adicionais {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }
    .info-bloco {
        width: 100%;
        max-width: 500px;
        margin-bottom: 0;
        text-align: center;
    }
    .info-bloco h3 { font-size: 1.6rem; text-align: center; }
    .info-bloco p,
    .botao-info-adicional,
    .links-inscricao a,
    .links-editais a { font-size: 0.95rem; text-align: center; }
    .botoes-info-adicionais, .links-inscricao, .links-editais {
        align-items: center;
        justify-content: center;
    }
    .links-editais p { justify-content: center; }

    /* WORKSHOP GERAL */
    .workshops-ciesc { padding: 40px 5%; text-align: center; }
    .workshops-container { gap: 20px; align-items: center; }
    .workshops-data { font-size: 1.5rem; text-align: center; }
    .workshops-data .linha-amarela { width: 80px; margin: 0 auto; }
    .workshops-cabecalho.esquerda { justify-content: center; margin-right: 0; }
    .icone-titulo, .icone-titulo-ext, .icone-titulo-tor, .icone-titulo-of, .icone-titulo-pt {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 15px 25px;
        border-radius: 15px;
        gap: 15px;
        margin: 0 auto;
        width: fit-content;
        text-align: center;
    }
    .icone-titulo h2, .icone-titulo-ext h2, .icone-titulo-tor h2, .icone-titulo-of h2, .icone-titulo-pt h2 {
        font-size: 1.5rem;
        text-align: center;
        white-space: normal;
    }
    .workshops-introducao-container {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0 15px;
        margin: 30px auto;
        gap: 30px;
        position: static;
    }
    .workshops-introducao-imagem-wrapper {
        position: static;
        width: 100%;
        justify-content: center;
        margin-right: 0;
    }
    .workshops-introducao-imagem-wrapper img { max-width: 80%; }
    .workshops-introducao p { font-size: 1.2rem; text-align: center; }
    .botao-inscrevase { font-size: 1rem; padding: 12px 25px; text-align: center; }
    .workshops-detalhados-container { gap: 40px; text-align: center; }
    .bloco-workshop { gap: 20px; margin: 0 auto; }
    .titulo-workshop { font-size: 1.2rem; padding: 12px 20px; margin: 0 auto; }
    .conteudo-workshop-detalhado { flex-direction: column; text-align: center; padding: 30px; justify-content: center; align-items: center; }
    .imagem-circulo { width: 120px; height: 120px; border-width: 8px; margin: 0 auto; }
    .imagem-circulo img { width: 110px; }
    .texto-workshop-detalhado { font-size: 0.95rem; text-align: center; }
    .texto-workshop-detalhado h3 { font-size: 1.2rem; text-align: center; }
    .texto-workshop-detalhado ul { text-align: center; padding-left: 0; list-style: none; }
    .texto-workshop-detalhado ul li { font-size: 0.9rem; padding-left: 0; display: block; text-align: center; }
    .texto-workshop-detalhado ul li::before { content: ""; display: none; }

    /* EXTENSÃO GERAL */
    .extensao-ciesc { padding: 40px 5%; text-align: center; }
    .extensao-container { gap: 20px; align-items: center; }
    .extensao-data { font-size: 1.5rem; text-align: center; }
    .extensao-data .linha-azul-claro { width: 80px; margin: 0 auto; }
    .extensao-cabecalho.esquerda { justify-content: center; margin-right: 0; }
    .extensao-introducao-container { flex-direction: column; justify-content: center; align-items: center; padding: 0 15px; margin: 30px auto; gap: 30px; position: static; }
    .ext-introducao-imagem-wrapper { position: static; width: 100%; justify-content: center; margin-right: 0; }
    .ext-introducao-imagem-wrapper img { max-width: 80%; }
    .extensao-introducao p { font-size: 1.2rem; text-align: center; }
    .extensao-introducao { margin: 30px auto; font-size: 1rem; text-align: center; }
    .botao-inscrevase-ext { font-size: 1rem; padding: 12px 25px; text-align: center; }
    .extensao-como-participar { margin: 40px auto; padding: 0 15px; gap: 30px; text-align: center; }
    .bloco-info-extensao { padding: 30px; text-align: center; }
    .bloco-info-extensao h3 { font-size: 1.5rem; text-align: center; }
    .bloco-info-extensao .titulo-passos, .bloco-info-extensao ul li { font-size: 0.95rem; text-align: center; }
    .bloco-info-extensao ul { padding-left: 0; text-align: center; list-style: none; }
    .bloco-info-extensao ul li { display: block; padding-left: 0; }
    .bloco-info-extensao ul ul { list-style: none; padding-left: 0; margin-left: 0; text-align: center; }
    .bloco-info-extensao ul ul li { text-align: center; padding-left: 0; }
    
    /* TORNEIO GERAL */
    .torneio-ciesc { padding: 40px 5%; text-align: center; }
    .torneio-container { gap: 20px; align-items: center; }
    .torneio-data { font-size: 1.5rem; text-align: center; }
    .torneio-data .linha-vermelha { width: 80px; margin: 0 auto; }
    .torneio-cabecalho.esquerda { justify-content: center; margin-right: 0; }
    .torneio-introducao-container { flex-direction: column; justify-content: center; align-items: center; padding: 0 15px; margin: 30px auto; gap: 30px; position: static; }
    .tor-introducao-imagem-wrapper { position: static; width: 100%; justify-content: center; margin-right: 0; }
    .tor-introducao-imagem-wrapper img { max-width: 80%; }
    .icone-titulo-tor { padding: 15px 25px; border-radius: 15px; flex-direction: column; text-align: center; width: fit-content; margin: 0 auto; white-space: normal; }
    .icone-titulo-tor h2 { font-size: 1.5rem; text-align: center; white-space: normal; }
    .torneio-introducao { margin: 30px auto; font-size: 1rem; text-align: center; }
    .torneio-introducao p { font-size: 1.2rem; text-align: center; }
    .botao-inscrevase-tor { font-size: 1rem; padding: 12px 25px; text-align: center; }
    .torneio-fases { margin: 40px auto; padding: 0 15px; text-align: center; }
    .bloco-fase-torneio { padding: 30px; text-align: center; }
    .bloco-fase-torneio h3 { font-size: 1.5rem; text-align: center; }
    .bloco-fase-torneio ul { padding-left: 0; text-align: center; list-style: none; }
    .bloco-fase-torneio ul li { font-size: 1rem; text-align: center; display: block; padding-left: 0; }
    .bloco-fase-torneio ul ul { margin-left: 0; padding-left: 0; text-align: center; list-style: none; }
    .bloco-fase-torneio ul ul li { font-size: 0.95rem; text-align: center; padding-left: 0; }
    .torneio-premiacao { margin: 30px auto 50px auto; padding: 0 15px; text-align: center; }
    .bloco-premiacao-torneio { padding: 30px; text-align: center; }
    .bloco-premiacao-torneio h3 { font-size: 1.5rem; text-align: center; }
    .bloco-premiacao-torneio ul { padding-left: 0; text-align: center; list-style: none; }
    .bloco-premiacao-torneio ul li { font-size: 1rem; text-align: center; display: block; padding-left: 0; }

    /* PRODUÇÃO CIENTÍFICA GERAL */
    .oficina-ciesc { padding: 40px 5%; text-align: center; }
    .oficina-container { gap: 20px; align-items: center; }
    .producao-data { font-size: 1.5rem; text-align: center; }
    .producao-data .linha-azul-producao { width: 80px; margin: 0 auto; }
    .producao-cabecalho.esquerda { justify-content: center; margin-right: 0; }
    .icone-titulo-of { padding: 15px 25px; border-radius: 15px; flex-direction: column; text-align: center; width: fit-content; margin: 0 auto; white-space: normal; }
    .icone-titulo-of h2 { font-size: 1.5rem; text-align: center; white-space: normal; }
    /* INTRODUÇÃO DA PRODUÇÃO CIENTÍFICA */
    .oficina-introducao { margin: 30px auto; font-size: 1rem; text-align: center; }
    .oficina-introducao p { font-size: 1.2rem; text-align: center; }
    /* DETALHES DAS OFICINAS DE PRODUÇÃO */
    .producao-detalhes-container { gap: 40px; text-align: center; }
    .bloco-producao { gap: 20px; margin: 0 auto; }
    .titulo-producao { font-size: 1.2rem; padding: 12px 20px; margin: 0 auto; }
    .conteudo-producao-detalhado { flex-direction: column; text-align: center; padding: 30px; justify-content: center; align-items: center; }
    .producao-detalhes-container .imagem-circulo { width: 120px; height: 120px; border-width: 8px; margin: 0 auto; }
    .producao-detalhes-container .imagem-circulo img { width: 110px; }
    .texto-producao-detalhado { font-size: 0.95rem; text-align: center; }
    .texto-producao-detalhado h3 { font-size: 1.2rem; text-align: center; }
    .texto-producao-detalhado ul { text-align: center; padding-left: 0; list-style: none; }
    .texto-producao-detalhado ul li { font-size: 0.9rem; padding-left: 0; display: block; text-align: center; }
    .texto-producao-detalhado ul li::before { content: ""; display: none; }
    .producao-detalhes-container .imagem-circulo { margin: 0 auto; }

    /* SEÇÃO PROTÓTIPOS */
    .prototipo-ciesc { padding: 40px 5%; text-align: center; }
    .prototipo-detalhes-container { margin: 40px auto; padding: 0 15px; gap: 30px; }
    .bloco-info-prototipo { padding: 30px; }
    .bloco-info-prototipo h3 { font-size: 1.5rem; }
    .bloco-info-prototipo ul li { font-size: 0.95rem; }
    .bloco-info-prototipo ul ul li { font-size: 0.9rem; }
    .bloco-info-prototipo ul li, .bloco-info-prototipo ul ul li { text-align: center; display: block; padding-left: 0; }
    .bloco-info-prototipo ul li::before { content: ""; display: none; }
    .pt-introducao-imagem-wrapper {
        position: static;
        width: 100%;
        justify-content: center;
        margin-right: 0;
    }
    .pt-introducao-imagem-wrapper img { max-width: 80%; }
    .prototipo-texto-final { font-size: 0.95rem; }

    /* FOOTER */
    .footer-contato { flex-direction: column; align-items: center; text-align: center; }
    .footer-contato > div { justify-content: center; }
    .footer-contato .email, .footer-contato .instagram { justify-content: center; }

    
    .workshops-linha-superior {gap: 50px;}
    .icone-titulo img { width: 50%; height: auto;}
    .icone-titulo-of img { width: 50%; height: auto;}
    .icone-titulo-pt img { width: 50%; height: auto;}
    .torneio-linha-superior {gap: 50px;}
    .extensao-linha-superior {gap: 50px;}

     .img-parceiros {
        gap: 15px; /* Reduz o gap */
        flex-wrap: wrap;
    }
    .img-parceiros img {
        max-width: 120px; /* Reduz o tamanho máximo das imagens */
        max-height: 120px;
    }

    .cronograma-lista {
      gap: 60px;
    }

}

/* Breakpoint para celulares pequenos */
@media (max-width: 576px) {
    /* AJUSTES GERAIS */
    main {
        padding-top: 45px;
    }
    header .container {
        width: 98%;
    }
    .logo {
        height: 50px;
    }

    /* PÁGINA INÍCIO */
    .inicio-container {
        padding: 80px 0% 40px 0%;
    }
    .inicio-direita {
        padding-left: 3%;
        padding-right: 3%;
        margin-right: 0;
    }

    .inicio-direita div {
      height: 100px;
    }

    .inicio-direita img {
      height: 78px;
      width: auto;
      padding-bottom: 0;
      padding-top: 0;
    }


    /* SEÇÃO "O CIESC" */
    .sobre-ciesc {
        padding: 2rem 0.5rem;
        width: 95%;
    }
    .texto-ciesc h2 {
        font-size: 2.5rem;
    }
    .divisor-amarelo {
        width: 80%;
    }
    .texto-ciesc p {
        font-size: 0.9rem;
    }

    /* CRONOGRAMAS (Geral CIESC, Workshops, Extensão, Torneio) */
    .cronograma-cursos .cronograma-container,
    .cronograma-extensao .cronograma-container,
    .cronograma-torneio .cronograma-container {
        gap: 30px;
        padding: 0 3%;
    }
    .cronograma-cursos .cronograma-titulo-ciesc h2,
    .cronograma-cursos .cronograma-titulo h2,
    .cronograma-extensao .cronograma-titulo-ext h2,
    .cronograma-torneio .cronograma-titulo-tor h2 {
        font-size: 2rem;
    }
    .cronograma-cursos .data-evento-ciesc,
    .cronograma-cursos .data-evento-tor,
    .cronograma-cursos .data-evento-ext,
    .cronograma-extensao .data-evento-ext,
    .cronograma-torneio .data-evento-tor {
        width: 120px;
        font-size: 1rem;
        padding: 12px 8px;
    }
    .cronograma-cursos .descricao-evento-ciesc,
    .cronograma-cursos .descricao-evento, /* Adicionado */
    .cronograma-cursos .descricao-evento-tor,
    .cronograma-cursos .descricao-evento-ext,
    .cronograma-extensao .descricao-evento-ext,
    .cronograma-torneio .descricao-evento-tor {
        font-size: 0.85rem;
    }
    .cronograma-cursos .descricao-evento-ciesc h3,
    .cronograma-cursos .descricao-evento h3, /* Adicionado */
    .cronograma-cursos .descricao-evento-tor h3,
    .cronograma-cursos .descricao-evento-ext h3,
    .cronograma-extensao .descricao-evento-ext h3,
    .cronograma-torneio .descricao-evento-tor h3 {
        font-size: 1.1rem;
    }
    .cronograma-cursos .descricao-evento-ciesc p,
    .cronograma-cursos .descricao-evento p, /* Adicionado */
    .cronograma-cursos .descricao-evento-tor p,
    .cronograma-cursos .descricao-evento-ext p,
    .cronograma-extensao .descricao-evento-ext p,
    .cronograma-torneio .descricao-evento-tor p {
        font-size: 0.85rem;
    }

    /* SEÇÃO DE INFORMAÇÕES ADICIONAIS */
    .info-adicionais-ciesc { padding: 30px 2%; }
    .container-info-adicionais { gap: 30px; }
    .info-bloco { padding: 20px; }
    .info-bloco h3 { font-size: 1.4rem; }
    .info-bloco p,
    .botao-info-adicional,
    .links-inscricao a,
    .links-editais a { font-size: 0.85rem; }
    .info-bloco .texto-adicional { font-size: 0.8rem; }
    .links-inscricao a, .links-editais a { padding-bottom: 3px; }

    /* WORKSHOP GERAL */
    .workshops-ciesc { padding: 30px 3%; }
    .workshops-data { font-size: 1.2rem; }
    .workshops-data .linha-amarela { width: 60px; }
    .icone-titulo h2 { font-size: 1.2rem; }
    .workshops-introducao p { font-size: 1.1rem; }
    .botao-inscrevase { font-size: 0.9rem; padding: 10px 20px; }
    .titulo-workshop { font-size: 1rem; padding: 10px 15px; }
    .conteudo-workshop-detalhado { padding: 20px; gap: 20px; }
    .imagem-circulo { width: 100px; height: 100px; border-width: 6px; }
    .imagem-circulo img { width: 90px; }
    .texto-workshop-detalhado { font-size: 0.85rem; }
    .texto-workshop-detalhado h3 { font-size: 1.1rem; }
    .texto-workshop-detalhado ul li { font-size: 0.8rem; padding-left: 0; }
    .texto-workshop-detalhado ul li::before { content: ""; display: none; }

    .workshops-linha-superior {gap: 50px;}
    .icone-titulo img { width: 50%; height: auto;}

    /* EXTENSÃO GERAL */
    .extensao-ciesc { padding: 30px 3%; }
    .extensao-data { font-size: 1.2rem; }
    .extensao-data .linha-azul-claro { width: 60px; }
    .icone-titulo-ext h2 { font-size: 1.2rem; }
    .extensao-introducao p { font-size: 1.1rem; }
    .botao-inscrevase-ext { font-size: 0.9rem; padding: 10px 20px; }
    .extensao-como-participar { padding: 0 10px; gap: 20px; }
    .bloco-info-extensao { padding: 20px; }
    .bloco-info-extensao h3 { font-size: 1.2rem; }
    .bloco-info-extensao .titulo-passos, .bloco-info-extensao ul li { font-size: 0.85rem; }
    .bloco-info-extensao ul ul li { font-size: 0.75rem; }

    .extensao-linha-superior {gap: 50px;}

    /* TORNEIO GERAL */
    .torneio-ciesc { padding: 30px 3%; }
    .torneio-data { font-size: 1.2rem; }
    .torneio-data .linha-vermelha { width: 60px; }
    .icone-titulo-tor h2 { font-size: 1.2rem; }
    .torneio-introducao p { font-size: 1.1rem; }
    .botao-inscrevase-tor { font-size: 0.9rem; padding: 10px 20px; }
    .torneio-fases { padding: 0 10px; }
    .bloco-fase-torneio { padding: 20px; }
    .bloco-fase-torneio h3 { font-size: 1.2rem; }
    .bloco-fase-torneio ul li { font-size: 0.85rem; }
    .bloco-fase-torneio ul ul { margin-left: 0; }
    .bloco-fase-torneio ul ul li { font-size: 0.8rem; }
    .torneio-premiacao { padding: 0 10px; margin: 20px auto 40px auto; }
    .bloco-premiacao-torneio { padding: 20px; }
    .bloco-premiacao-torneio h3 { font-size: 1.2rem; }
    .bloco-premiacao-torneio ul li { font-size: 0.85rem; }

    .torneio-linha-superior {gap: 50px;}

    /* PRODUÇÃO CIENTÍFICA GERAL */
    .oficina-ciesc { padding: 30px 3%; }
    .producao-data { font-size: 1.2rem; }
    .producao-data .linha-azul-producao { width: 60px; }
    .icone-titulo-of h2 { font-size: 1.2rem; }
    .oficina-introducao p { font-size: 1.1rem; }
    .titulo-producao { font-size: 1rem; padding: 10px 15px; }
    .conteudo-producao-detalhado { padding: 20px; gap: 20px; }
    .producao-detalhes-container .imagem-circulo { width: 100px; height: 100px; border-width: 6px; }
    .producao-detalhes-container .imagem-circulo img { width: 90px; }
    .texto-producao-detalhado { font-size: 0.85rem; }
    .texto-producao-detalhado h3 { font-size: 1.1rem; }
    .texto-producao-detalhado ul li { font-size: 0.8rem; padding-left: 0; }
    .texto-producao-detalhado ul li::before { content: ""; display: none; }

    .icone-titulo-of img { width: 50%; height: auto;}
    .icone-titulo-pt img { width: 50%; height: auto;}

     .img-parceiros {
        gap: 10px; /* Reduz o gap */
        flex-wrap: wrap;
    }
    .img-parceiros img {
        max-width: 90px; /* Reduz o tamanho máximo das imagens */
        max-height: 90px;
    }

    .cronograma-lista {
      gap: 60px;
    }
}

@media (max-width: 1067px) {
  .container-info-adicionais {
    flex-wrap: unset;
  }
  
}

@media (max-width: 1399px) {
  .cronograma-titulo-ciesc {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #bf8a35;
    padding-right: 30px;
  }
  
  .cronograma-titulo {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #bf8a35;
    padding-right: 30px;
  }

  .cronograma-titulo-ext {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #5e98ca;
    padding-right: 30px;
  }

  .cronograma-titulo-tor {
    flex-shrink: 0; /* Impede que o título encolha */
    width: 30%;
    min-width: 250px;
    text-align: right;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.2;
    color: white;
    border-right: 4px solid #87000f;
    padding-right: 30px;
}
  
}