/* ========================================================== */
/* CSS para a página "Olimpíadas do Conhecimento" */
/* ========================================================== */

/* HERO PADRONIZADO COM BORDAS ARREDONDADAS */
#olimpiadas-main .hero--full-image {
   position: relative;
   display: flex;
   align-items: center;
   color: var(--color-white);
   min-height: 90vh;
   padding: 40px 20px;
   background-color: var(--color-text-dark);
   margin-bottom: 0;
   z-index: 10;
   overflow: hidden;
   border-bottom-left-radius: 70px;
   border-bottom-right-radius: 70px;
}

#olimpiadas-main .hero--full-image .hero__image-bg {
   position: absolute; top: 0; left: 0; width: 100%; height: 100%;
   background-image: url('../images/hero-olimpiadas.webp'); /* Imagem de fundo */
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
   z-index: 1;
}

#olimpiadas-main .hero--full-image .hero__overlay {
   position: absolute; top: 0; left: 0; width: 100%; height: 100%;
   background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0.1) 100%);
   z-index: 2;
}

/* Conteúdo de texto do hero alinhado à esquerda */
#olimpiadas-main .hero--full-image .hero__content {
   position: relative;
   z-index: 3;
   text-align: left;
   margin-left: 15%;
   margin-right: auto;
   max-width: 700px;
   padding-top: 0;
}

/* Título principal H1 */
#olimpiadas-main .hero--full-image .hero__title {
   font-size: clamp(2rem, 4vw, 3.5rem);
   font-weight: 800;
   line-height: 1.1;
   margin-bottom: 15px;
   text-shadow: none;
}

/* Pré-título (primeiro parágrafo) */
#olimpiadas-main .hero--full-image .hero__content > .hero__subtitle:first-of-type {
   font-size: clamp(1.1rem, 2.5vw, 1.5rem);
   font-weight: 600;
   line-height: 1.2;
   text-shadow: none;
   max-width: none;
   margin: 0;
}

/* Parágrafo de descrição (segundo parágrafo) */
#olimpiadas-main .hero--full-image .hero__content > .hero__subtitle:last-of-type {
   font-size: 1.1rem;
   font-weight: 400;
   line-height: 1.7;
   text-shadow: none;
   max-width: none;
   margin: 0;
}


/* SEÇÃO CONQUISTAS */
.achievements-section {
   padding: 100px 0;
   background-color: var(--color-white);
   margin-top: -70px; /* Efeito de sobreposição */
   position: relative; /* Contexto para o z-index */
   z-index: 5;
}
.achievements-section .super-title {
   display: block;
   font-size: 1rem;
   font-weight: 600;
   color: var(--color-primary);
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-bottom: 10px;
}
.achievements-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
   gap: 30px;
   margin-top: 40px;
}
.achievement-card {
   background-color: var(--color-bg-alt);
   border: 1px solid var(--color-border);
   padding: 40px 25px;
   border-radius: var(--radius);
   text-align: center;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.achievement-card:hover {
   transform: translateY(-8px);
   box-shadow: var(--shadow-md);
}
.achievement-card__number {
   font-size: 4rem;
   font-weight: 800;
   color: var(--color-secondary);
   line-height: 1;
   margin-bottom: 15px;
   display: block;
}
.achievement-card__text {
   font-size: 1rem;
   color: var(--color-text);
   line-height: 1.6;
}

/* SEÇÃO FEATURE (TEXTO E IMAGEM) */
.feature-section .feature-image {
   border-radius: var(--radius);
   overflow: hidden; /* Garante que a imagem seja cortada pelas bordas */
   position: relative; /* Ajuda a conter a imagem em alguns navegadores */
}
.feature-section .feature-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
}

/* SEÇÃO FEATURE COM FUNDO GRADIENTE */
.feature-section.bg-gradient {
   background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary) 100%);
}
.feature-section.bg-gradient .section-title,
.feature-section.bg-gradient .feature-text p {
   color: var(--color-white);
}
.feature-section.bg-gradient .section-title::after {
   background-color: var(--color-white);
}

/* Centralização do texto na seção de gradiente */
.feature-section.bg-gradient .feature-content.text-centered {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   text-align: center;
   position: relative; /* Necessário para posicionar os ícones animados */
   padding: 80px 0;
}

.feature-section.bg-gradient .feature-content.text-centered .feature-text {
   position: relative;
   z-index: 2; /* Garante que o texto fique acima dos ícones animados */
}

/* ====== CORREÇÃO ADICIONADA ====== */
/* Garante a centralização do título "Convertendo Saberes" e de seu traço decorativo. */
.feature-section.bg-gradient .feature-content.text-centered .section-title {
   text-align: center;
}

.feature-section.bg-gradient .feature-content.text-centered .section-title::after {
   left: 50%;
   transform: translateX(-50%);
}
/* ====== FIM DA CORREÇÃO ====== */

/* Estilização e animação dos ícones de fundo */
.animated-icon-bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   overflow: hidden;
   z-index: 1; /* Abaixo do texto */
   opacity: 0.15;
}

.animated-icon-bg i {
   position: absolute;
   color: var(--color-white);
   font-size: clamp(2rem, 6vw, 5rem);
   animation: moveIcons 25s linear infinite;
   transform: rotate(0deg);
}

.animated-icon-bg i:nth-child(1) {
   top: 15%;
   left: 5%;
   font-size: 4rem;
}

.animated-icon-bg i:nth-child(2) {
   top: 60%;
   left: 20%;
   font-size: 3rem;
}

.animated-icon-bg i:nth-child(3) {
   top: 30%;
   left: 70%;
   font-size: 5rem;
}

.animated-icon-bg i:nth-child(4) {
   top: 80%;
   left: 85%;
   font-size: 3.5rem;
}

@keyframes moveIcons {
   0% { transform: translateY(-100px) rotate(0deg); }
   100% { transform: translateY(calc(100% + 100px)) rotate(360deg); }
}


/* SEÇÃO HABILIDADES */
.skills-section {
   padding: 100px 0;
   background-color: var(--color-white);
}
.skills-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
   gap: 30px;
   margin-top: 40px;
}
.skill-card {
   background-color: var(--color-white);
   padding: 35px;
   border-radius: var(--radius);
   text-align: center;
   border: 1px solid var(--color-border);
   transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.skill-card:hover {
   transform: translateY(-8px);
   box-shadow: var(--shadow-md);
   border-color: var(--color-secondary);
}
.skill-card__icon {
   font-size: 2.5rem;
   color: var(--color-secondary);
   margin-bottom: 25px;
   transition: transform 0.3s ease;
}
.skill-card:hover .skill-card__icon {
   transform: scale(1.15) rotate(-5deg);
}
.skill-card h3 {
   font-size: 1.3rem;
   color: var(--color-text-dark);
   margin-bottom: 10px;
}
.skill-card p {
   font-size: 0.95rem;
   line-height: 1.6;
   color: var(--color-text);
}

/* SEÇÃO DE PREPARAÇÃO */
.preparation-section {
   padding: 100px 0;
}
.preparation-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
   gap: 30px;
   margin-top: 40px;
}
.preparation-card {
   background-color: var(--color-white);
   padding: 30px;
   border-radius: var(--radius);
   box-shadow: var(--shadow-sm);
   display: flex;
   align-items: flex-start;
   gap: 25px;
   text-align: left;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   border-top: 4px solid var(--color-accent);
}
.preparation-card:hover {
   transform: translateY(-8px);
   box-shadow: var(--shadow-md);
}
.preparation-card__icon {
   color: var(--color-accent);
   font-size: 1.8rem;
   font-weight: 700;
   line-height: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   min-width: 50px;
   height: 50px;
   border: 3px solid var(--color-accent);
   border-radius: 50%;
   flex-shrink: 0;
}
.preparation-card__content h3 {
   font-size: 1.3rem;
   color: var(--color-text-dark);
   margin-bottom: 10px;
}
.preparation-card__content p {
   font-size: 0.95rem;
   line-height: 1.7;
   color: var(--color-text);
}

/* SEÇÃO CARROSSEL DE OLIMPÍADAS */
.olympiads-carousel-section {
   padding: 100px 0;
}
.olympiads-carousel-section.colored-bg {
   background-color: var(--color-bg-alt);
}
.olympiads-carousel-section .section-header::after {
   display: none;
}
.olympiads-slider-wrapper {
   position: relative;
   padding: 0 50px;
}
.olympiads-slider {
   padding-bottom: 70px;
}
.olympiad-card {
   background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary) 100%);
   border-radius: 20px;
   padding: 40px 30px;
   height: 100%;
   text-align: center;
   box-shadow: var(--shadow-md);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   min-height: 250px;
   border: none;
}
.olympiad-card:hover {
   transform: translateY(-10px);
   box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}
.olympiad-card h3 {
   font-size: 1.5rem; /* Ajustado para caber textos maiores */
   color: var(--color-white);
   margin-bottom: 15px;
   font-weight: 700;
}
.olympiad-card p {
   font-size: 0.9rem; /* Ajustado para caber textos maiores */
   color: rgba(255, 255, 255, 0.9);
   line-height: 1.6;
}
.olympiads-slider-wrapper .olympiads-nav-button {
   color: var(--color-primary);
}
.olympiads-slider-wrapper .olympiads-pagination .swiper-pagination-bullet-active {
   background-color: var(--color-primary);
}

/* RESPONSIVIDADE */
@media (max-width: 992px) {
   #olimpiadas-main .hero--full-image .hero__content {
       margin-left: 10%;
   }

   .achievements-section, .skills-section, .preparation-section, .olympiads-carousel-section {
       padding: 80px 0;
   }
   .olympiads-slider-wrapper {
       padding: 0 15px;
   }
   .olympiads-slider-wrapper .swiper-button-next,
   .olympiads-slider-wrapper .swiper-button-prev {
       display: none;
   }
   .achievements-section {
       margin-top: -60px; /* Efeito de sobreposição */
       padding-top: 100px;
   }
}
@media (max-width: 768px) {
   #olimpiadas-main .hero--full-image {
       min-height: 80vh;
       border-bottom-left-radius: 40px;
       border-bottom-right-radius: 40px;
   }
   #olimpiadas-main .hero--full-image .hero__content {
       max-width: 90%;
       text-align: center;
       margin-left: auto;
       margin-right: auto;
   }

   .achievements-section, .skills-section, .preparation-section, .olympiads-carousel-section {
       padding: 60px 0;
   }
   .achievements-grid, .skills-grid, .preparation-grid {
       grid-template-columns: 1fr;
   }

   .olympiad-card h3 {
       font-size: 1.4rem;
   }
   .olympiad-card p {
       font-size: 0.85rem;
   }
   .achievements-section {
       margin-top: -40px; /* Efeito de sobreposição */
       padding-top: 80px;
   }

   /* Reduz o tamanho da fonte dos ícones animados em telas menores */
   .animated-icon-bg i {
       font-size: clamp(1rem, 4vw, 3rem);
   }
}