/* Ajustes pós-migração: títulos secundários passaram de <h1> para <h2>
   (SEO: apenas um H1 por página). Estas regras mantêm o visual original. */
.search-course-area .search-course-left h2 { font-size: 36px; margin-bottom: 20px; }
@media (max-width: 991px) { .search-course-area .search-course-left h2 { font-size: 30px; } }
.cta-two-area .cta-left h2 { font-size: 36px; color: #fff; font-weight: 700; }
.info-area .info-area-right h2 { max-width: 400px; margin-bottom: 20px; }
@media (max-width: 1024px) and (min-width: 991px) { .info-area .info-area-right h2 { font-size: 23px; } }
@media (max-width: 991px) { .info-area .info-area-right h2 { max-width: 100%; } }

/* Página 404 */
.erro-404 { padding: 120px 0; text-align: center; }
.erro-404 .codigo { font-size: 96px; font-weight: 700; color: #ed1c24; line-height: 1; }
.erro-404 p { margin: 20px auto 30px; max-width: 520px; }

/* ===== Ajustes visuais mínimos (prévia de 11/11/2026). Cada bloco é independente: apagar o bloco desfaz o item. ===== */

/* 1. Fundo da home: degradê no lugar da camada azul chapada de 90%. Escuro à esquerda, onde está o texto,
   e mais claro à direita, onde está a foto. Só na home: a tarja das páginas de segmento também é .banner-area. */
.banner-area:not(.about-banner) .overlay-bg {
	background: linear-gradient(90deg, rgba(20, 22, 64, 0.94) 0%, rgba(20, 22, 64, 0.78) 45%, rgba(20, 22, 64, 0.4) 100%);
}
/* No celular o texto ocupa a largura toda e a foto aparece só pela borda direita: camada uniforme, um pouco mais leve que antes. */
@media (max-width: 767px) {
	.banner-area:not(.about-banner) .overlay-bg { background: rgba(20, 22, 64, 0.82); }
}

/* 2. Texto mais legível: #777 em fundo branco fica abaixo do contraste mínimo (WCAG AA). Peso 400 em vez de 300. */
body { color: #555; font-weight: 400; }

/* 10. Fundo novo da home (artes da Quinze, 11/11/2026). A arte já vem com o filtro azul aplicado, então a camada
   escura do item 1 apagaria os alunos: aqui ela vira só um reforço à esquerda, atrás do texto. #home limita à home. */
#home.banner-area { background: #0b0b5e url(../img/home/fundo-home-1920.webp) right center / cover no-repeat; }
@media (min-width: 1921px) {
	#home.banner-area { background-image: url(../img/home/fundo-home-2560.webp); }
}
#home.banner-area .overlay-bg {
	background: linear-gradient(90deg, rgba(11, 11, 94, 0.55) 0%, rgba(11, 11, 94, 0.25) 40%, rgba(11, 11, 94, 0) 60%);
}
/* Celular e tablet em pé: a arte 16:9 mostraria só a borda direita, então entra a vertical. Os rostos ocupam a metade
   de cima da arte; o texto desce para a faixa de baixo (o !important vence o .align-items-center do Bootstrap) e a
   camada escurece só ali, para não apagar os rostos. O padding-bottom deixa o texto acima dos cards que sobem no banner. */
@media (max-width: 991px) and (orientation: portrait) {
	#home.banner-area { background-image: url(../img/home/fundo-home-vertical-1080.webp); background-position: center top; }
	#home.banner-area .overlay-bg {
		background: linear-gradient(180deg, rgba(11, 11, 94, 0) 0%, rgba(11, 11, 94, 0.1) 45%, rgba(11, 11, 94, 0.88) 72%);
	}
	#home .row.fullscreen { align-items: flex-end !important; padding-bottom: 110px; }
}

/* 4. Chamada principal da home: botão e "Matrículas Abertas" com mais presença. */
.banner-content .primary-btn { line-height: 52px; padding-left: 40px; padding-right: 40px; font-size: 14px; letter-spacing: .5px; }
.banner-content h1 + p { font-size: 26px !important; font-weight: 500; }

/* 6. Área de toque maior nos links do rodapé, no celular (mínimo recomendado ~44 px). */
@media (max-width: 767px) {
	.footer-area ul li a { display: inline-block; padding: 8px 0; }
}

/* 7. Cards da home com canto arredondado e sombra leve, combinando com as artes novas. */
.single-popular-carusel .thumb-wrap { border-radius: 10px; overflow: hidden; box-shadow: 0 10px 28px rgba(20, 22, 64, 0.14); }

/* 8. Texto um pouco maior no celular. */
@media (max-width: 767px) {
	body { font-size: 15px; }
}

/* 9. Faixa "Ficou com alguma dúvida?": linha de apoio, dois botões (WhatsApp e /fale-conosco), alinhamento ao centro. */
.cta-two-area { background: linear-gradient(135deg, #ed1c24 0%, #c9141b 100%); padding: 70px 0; }
.cta-two-area .row { align-items: center; }
.cta-two-area .cta-left h2 { margin-bottom: 8px; }
.cta-two-area .cta-apoio { color: rgba(255, 255, 255, 0.92); font-size: 17px; margin: 0; }
.cta-two-area .cta-right { display: flex; gap: 14px; justify-content: flex-end; flex-wrap: wrap; }
.cta-two-area .cta-btn { display: inline-flex; align-items: center; gap: 10px; border-radius: 6px; padding: 14px 26px; font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.cta-two-area .cta-btn .fa { font-size: 22px; }
.cta-two-area .cta-btn-whats { background: #fff; color: #c9141b; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); }
.cta-two-area .cta-btn-whats:hover { color: #a50f15; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2); }
.cta-two-area .cta-btn-linha { border: 2px solid rgba(255, 255, 255, 0.85); color: #fff; }
.cta-two-area .cta-btn-linha:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
@media (max-width: 991px) {
	.cta-two-area .cta-left { text-align: center; margin-bottom: 24px; }
	.cta-two-area .cta-right { justify-content: center; }
}
@media (max-width: 480px) {
	.cta-two-area .cta-btn { width: 100%; justify-content: center; }
}
