/*
 * Tema Nova Identidade (escolhido no painel; app/Suporte/tema.php), baseado no visual que a empresa fez em
 * novo.jfempregos.com.br: logo novo, azul-índigo #28397f, amarelo #fec345 nos botões (texto índigo),
 * laranja #f07a24 só como detalhe e o creme #fff8e7 em faixas. Mudanças em relação à referência: Fredoka
 * nos títulos (o mesmo desenho arredondado do logo) e Nunito Sans no texto, no lugar das serifas pesadas;
 * sem rótulos em caixa alta espaçada, sem setas em todo link, sem fotos de banco de imagem.
 */
html.tema-identidade {
    /* componentes (assets/temas/componentes.css) */
    --jt-primaria: #28397f; --jt-primaria-escura: #1c2a63; --jt-primaria-suave: #eef0f8;
    --jt-acao: #fec345; --jt-acao-texto: #28397f; --jt-destaque: #f07a24; --jt-destaque-texto: #ffffff;
    --jt-texto: #24325b; --jt-titulo-cor: #28397f; --jt-cinza: #4f5973; --jt-fio: #e6e0cf; --jt-borda: #8e97b5;
    --jt-fundo: #fff8e7; --jt-raio: 10px; --jt-raio-campo: 8px; --jt-raio-botao: 8px;
    --jt-fonte-titulo: 'Fredoka', 'Nunito Sans', sans-serif; --jt-fonte-corpo: 'Nunito Sans', 'Segoe UI', sans-serif; --jt-titulo-peso: 600;
    --jt-faixa-fundo: #28397f; --jt-faixa-texto: #ffffff; --jt-faixa-borda: 0; --jt-faixa-tamanho: 34px;
    --ti-indigo: #28397f;
    --ti-indigo-escuro: #1c2a63;
    --ti-amarelo: #fec345;
    --ti-amarelo-claro: #ffd986;
    --ti-laranja: #f07a24;
    --ti-creme: #fff8e7;
    --ti-tinta: #24325b;
    --ti-cinza: #4f5973;
    --ti-fio: #e6e0cf;
    --jt-largura: 1200px;
}

/* ---- base ---------------------------------------------------------------------------------- */
html.tema-identidade body { font-family: var(--jt-fonte-corpo); color: var(--ti-tinta); background: #ffffff; font-size: 16px; }
html.tema-identidade body p, html.tema-identidade body li, html.tema-identidade body td, html.tema-identidade body label, html.tema-identidade body input,
html.tema-identidade body select, html.tema-identidade body textarea, html.tema-identidade body button { font-family: var(--jt-fonte-corpo); }
html.tema-identidade h1, html.tema-identidade h2, html.tema-identidade h3, html.tema-identidade h4,
html.tema-identidade .display-1, html.tema-identidade .display-2, html.tema-identidade .display-3, html.tema-identidade .display-4 { font-family: var(--jt-fonte-titulo); font-weight: 600; letter-spacing: 0; }
html.tema-identidade .text-primary, html.tema-identidade .text-primary-light { color: var(--ti-indigo) !important; }
html.tema-identidade .btn { font-family: var(--jt-fonte-corpo); font-weight: 700; box-shadow: none; }
html.tema-identidade .btn-primary, html.tema-identidade .bg-primary { background-color: var(--ti-indigo) !important; border-color: var(--ti-indigo) !important; }
html.tema-identidade .btn-primary { color: #ffffff !important; }
html.tema-identidade .btn-secondary { background: var(--ti-amarelo) !important; border-color: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; }
html.tema-identidade .btn-outline-primary { color: var(--ti-indigo) !important; border-color: var(--jt-borda) !important; background: #ffffff !important; }

/* ---- cabeçalho (app/views/temas/comum/topo.php, com o logo novo) ------------------------- */
html.tema-identidade .jt-topo { position: relative; z-index: 1020; }
html.tema-identidade .jt-cabecalho { background: #ffffff; border-bottom: 1px solid var(--ti-fio); }
html.tema-identidade .jt-cabecalho .jt-wrap { display: flex; align-items: center; gap: 28px; min-height: 80px; }
html.tema-identidade .jt-logo img { height: 38px; width: auto; display: block; }
html.tema-identidade .jt-menu { display: flex; gap: 22px; flex-grow: 1; justify-content: center; font-weight: 700; font-size: 15px; }
html.tema-identidade .jt-menu a { color: var(--ti-indigo); padding: 6px 0; }
html.tema-identidade .jt-menu a:hover, html.tema-identidade .jt-menu a.atual { color: var(--ti-indigo); text-decoration: none; box-shadow: inset 0 -3px 0 var(--ti-amarelo); }
html.tema-identidade .jt-acoes { display: flex; align-items: center; gap: 18px; }
html.tema-identidade .jt-entrar { color: var(--ti-indigo); font-weight: 700; }
html.tema-identidade .jt-botao { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border-radius: 8px; background: var(--ti-amarelo); color: var(--ti-indigo) !important; font-weight: 800; text-decoration: none !important; white-space: nowrap; }
html.tema-identidade .jt-botao:hover { background: var(--ti-amarelo-claro); }
html.tema-identidade .jt-botao.jt-vazado { background: transparent; border: 2px solid #ffffff; color: #ffffff !important; }
html.tema-identidade .jt-abrir { color: var(--ti-indigo); }
html.tema-identidade .jt-menu-celular { background: var(--ti-indigo); color: #ffffff; }
html.tema-identidade .jt-menu-celular .jt-fechar { color: #ffffff; }
html.tema-identidade .jt-menu-celular nav a { color: #ffffff; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 24px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
@media (max-width: 1100px) {
    html.tema-identidade .jt-menu, html.tema-identidade .jt-acoes { display: none; }
    html.tema-identidade .jt-logo img { height: 30px; }
    html.tema-identidade .jt-cabecalho .jt-wrap { min-height: 64px; }
}

/* ---- página inicial: chamada --------------------------------------------------------------- */
html.tema-identidade .ti-chamada { background: var(--ti-indigo); color: #ffffff; padding: 44px 0 0; }
html.tema-identidade .ti-chamada-grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: center; }   /* uma coluna desde 13/11/2026 (sem a peça da campanha) */
html.tema-identidade .ti-chamada-texto { max-width: 760px; }
html.tema-identidade .ti-chamada-texto > p.ti-numero { max-width: none; }   /* vagas abertas e atalhos numa linha no computador */
html.tema-identidade .ti-chamada-texto { display: flex; flex-direction: column; gap: 18px; }
html.tema-identidade .ti-chamada h1 { margin: 0; color: #ffffff; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 54px; line-height: 1.05; }
html.tema-identidade .ti-chamada h1 span { color: var(--ti-amarelo); display: block; }
html.tema-identidade .ti-chamada-texto > p { margin: 0; font-size: 18px; color: #d9def0; max-width: 520px; }
html.tema-identidade form.ti-busca { display: flex !important; flex-direction: column; gap: 8px; margin: 6px 0 0; }
html.tema-identidade .ti-busca label { margin: 0; font-weight: 700; font-size: 15px; color: #ffffff; }
html.tema-identidade .ti-busca div { display: flex; gap: 8px; }
html.tema-identidade .ti-busca input { background: #ffffff !important; flex: 1 1 auto; min-width: 0; height: 52px; border: 0 !important; border-radius: 8px !important; padding: 0 16px; font-size: 17px; color: var(--ti-tinta); margin: 0 !important; width: auto !important; }
html.tema-identidade .ti-busca button { height: 52px; padding: 0 22px; border: 0; border-radius: 8px; background: var(--ti-amarelo); color: var(--ti-indigo); font-weight: 800; font-size: 16px; cursor: pointer; white-space: nowrap; }
html.tema-identidade .ti-busca button:hover { background: var(--ti-amarelo-claro); }
html.tema-identidade .ti-numero { margin: 0; font-size: 15px; color: #d9def0; }
html.tema-identidade .ti-numero strong { color: var(--ti-amarelo); font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 20px; }
html.tema-identidade .ti-numero a { color: #ffffff; text-decoration: underline; text-underline-offset: 3px; }
html.tema-identidade .ti-campanha { display: block; position: relative; }
html.tema-identidade .ti-campanha img { width: 100%; height: auto; display: block; }   /* peça transparente: sem moldura */
html.tema-identidade .ti-acesso { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 36px; border-top: 1px solid rgba(255, 255, 255, .18); }
html.tema-identidade .ti-acesso > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 18px 0; }
html.tema-identidade .ti-acesso > div:first-child { padding-right: 28px; }   /* o mesmo respiro dos dois lados da linha do meio */
html.tema-identidade .ti-acesso > div + div { border-left: 1px solid rgba(255, 255, 255, .18); padding-left: 28px; }
html.tema-identidade .ti-acesso strong { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 20px; }
html.tema-identidade .ti-acesso span { color: #d9def0; flex-grow: 1; }
html.tema-identidade .ti-botao { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 8px; background: var(--ti-amarelo); color: var(--ti-indigo) !important; font-weight: 800; text-decoration: none !important; }
html.tema-identidade .ti-botao.ti-claro { background: #ffffff; }
/* banners da home: cantos e sombra iguais aos da campanha, mesmo espaço entre os blocos */
html.tema-identidade .jfe-banners { margin-top: 32px !important; }
html.tema-identidade .jfe-banners > .row { margin-bottom: 0 !important; }
html.tema-identidade .banner-mantenedores .slick-list { border-radius: 12px; overflow: hidden; box-shadow: 0 4px 14px rgba(28, 42, 99, .12); transition: box-shadow .2s ease, transform .2s ease; }
html.tema-identidade .banner-mantenedores:hover .slick-list { box-shadow: 0 8px 22px rgba(28, 42, 99, .2); transform: translateY(-1px); }
html.tema-identidade .banner-mantenedores img { display: block; border-radius: 12px; }
@media (max-width: 991px) {   /* artes de alturas diferentes: o canto e a sombra ficam em cada imagem, sem caixa branca */
    html.tema-identidade .banner-mantenedores .slick-list, html.tema-identidade .banner-mantenedores:hover .slick-list { border-radius: 0; box-shadow: none; transform: none; }
}
@media (max-width: 575.98px) {   /* celular: as artes são 600x240 (5:2); a mais baixa fica no meio da mesma caixa, sem buraco embaixo */
    html.tema-identidade .banner-mantenedores .d-sm-none { display: flex !important; align-items: center; aspect-ratio: 5 / 2; }
    html.tema-identidade .banner-mantenedores .d-sm-none > a, html.tema-identidade .banner-mantenedores .d-sm-none > img { width: 100%; }
}
html.tema-identidade main.layout-portal > .container-md > .ti-whatsapp-area.container { margin-top: 32px !important; margin-bottom: 0 !important; }
html.tema-identidade .ti-whatsapp { display: flex; align-items: center; gap: 18px; padding: 20px 24px; border: 1px solid #bfe6cc; border-radius: 12px; background: #eef9f1; color: var(--ti-tinta) !important; text-decoration: none !important; box-shadow: 0 4px 14px rgba(28, 42, 99, .08); transition: box-shadow .2s ease, transform .2s ease; }
html.tema-identidade .ti-whatsapp:hover, html.tema-identidade .ti-whatsapp:focus-visible { box-shadow: 0 8px 22px rgba(28, 42, 99, .16); transform: translateY(-1px); }
html.tema-identidade .ti-whatsapp-icone { flex: none; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; background: #128c4a; color: #ffffff; }
html.tema-identidade .ti-whatsapp-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html.tema-identidade .ti-whatsapp-texto strong { font-family: var(--jt-fonte-titulo); font-size: 22px; font-weight: 600; color: var(--ti-indigo); }
html.tema-identidade .ti-whatsapp-texto span { color: var(--ti-cinza); }
html.tema-identidade .ti-whatsapp-botao { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 8px; background: #128c4a; color: #ffffff; font-weight: 800; }
@media (max-width: 700px) {
    html.tema-identidade .ti-whatsapp { flex-wrap: wrap; padding: 18px; gap: 14px; }
    html.tema-identidade .ti-whatsapp-texto { flex-basis: calc(100% - 68px); }
    html.tema-identidade .ti-whatsapp-texto strong { font-size: 19px; }
    html.tema-identidade .ti-whatsapp-botao { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
    html.tema-identidade .banner-mantenedores .slick-list, html.tema-identidade .ti-whatsapp { transition: none; transform: none !important; }
}
html.tema-identidade .ti-perfis { background: var(--ti-creme); margin-top: 32px; border-top: 1px solid var(--ti-fio); border-bottom: 1px solid var(--ti-fio); }
html.tema-identidade .ti-perfis-grade { display: grid; grid-template-columns: minmax(0, 1fr) 220px minmax(0, 1fr); gap: 32px; align-items: end; padding-top: 40px; }
html.tema-identidade .ti-perfil { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; padding-bottom: 40px; }
html.tema-identidade .ti-perfil h2 { margin: 0; font-size: 30px; color: var(--ti-indigo); }
html.tema-identidade .ti-perfil ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
html.tema-identidade .ti-perfil li { color: var(--ti-cinza); padding-left: 26px; position: relative; }
html.tema-identidade .ti-perfil li::before { content: ""; position: absolute; left: 0; top: 7px; width: 12px; height: 12px; border-radius: 50%; background: var(--ti-amarelo); box-shadow: 0 0 0 3px #ffe9b0; }
html.tema-identidade .ti-perfil li b { color: var(--ti-tinta); }
html.tema-identidade .ti-perfil .btn { background: var(--ti-indigo) !important; color: #ffffff !important; border: 0 !important; padding: 11px 20px; border-radius: 8px !important; }
html.tema-identidade .ti-personagem { width: 100%; height: auto; display: block; align-self: end; }
@media (max-width: 900px) {
    html.tema-identidade .ti-chamada { padding-top: 28px; }
    html.tema-identidade .ti-chamada-grade { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    html.tema-identidade .ti-chamada h1 { font-size: 38px; }
    html.tema-identidade .ti-busca div { flex-direction: column; }
    html.tema-identidade .ti-acesso { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
    html.tema-identidade .ti-acesso > div:first-child { padding-right: 0; }
    html.tema-identidade .ti-acesso > div + div { border-left: 0; padding-left: 0; border-top: 1px solid rgba(255, 255, 255, .18); }
    html.tema-identidade .ti-acesso > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    html.tema-identidade .ti-acesso strong, html.tema-identidade .ti-acesso span { grid-column: 1 / -1; }
    html.tema-identidade .ti-acesso .ti-botao { justify-content: center; }
    html.tema-identidade .ti-perfis-grade { grid-template-columns: minmax(0, 1fr); gap: 0; }
    html.tema-identidade .ti-personagem { display: none; }
}

/* ---- seções da página inicial (HTML de sempre) ------------------------------------------- */
html.tema-identidade #vagasDestaque h2, html.tema-identidade #secaoAtuacao h2, html.tema-identidade .layout-portal h3.display-3 { font-family: var(--jt-fonte-titulo); font-weight: 600; color: var(--ti-indigo) !important; }
html.tema-identidade #vagasDestaque hr { border: 0; border-top: 3px solid var(--ti-amarelo); width: 64px; }
html.tema-identidade .bxDestaque { border: 1px solid var(--ti-fio) !important; border-radius: 10px !important; box-shadow: none !important; background: #ffffff; }
html.tema-identidade .bxDestaque h3 { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 18px; color: var(--ti-indigo) !important; }
html.tema-identidade .bxDestaque .tipo { border-radius: 6px !important; background: var(--jt-primaria-suave) !important; color: var(--ti-indigo) !important; }
html.tema-identidade .bxAtuacao { border-radius: 10px !important; box-shadow: none !important; }
html.tema-identidade .bg-cyan-100 { background: var(--ti-creme) !important; }

/* ---- lista de vagas (app/views/site/cartao-vaga.php) ------------------------------------ */
html.tema-identidade .boxTabelas, html.tema-identidade .notTable { border: 1px solid var(--ti-fio) !important; border-radius: 10px !important; box-shadow: none !important; background: #ffffff; }
html.tema-identidade .boxTabelas:hover, html.tema-identidade .notTable:hover { border-color: var(--jt-borda) !important; }
html.tema-identidade .boxTabelas h3, html.tema-identidade .notTable h3 { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 19px; color: var(--ti-indigo) !important; text-transform: none; }
html.tema-identidade .boxTabelas .tipo, html.tema-identidade .notTable .tipo { background: var(--jt-primaria-suave) !important; color: var(--ti-indigo) !important; }
html.tema-identidade .boxTabelas img, html.tema-identidade .notTable img { border-radius: 8px; border: 1px solid var(--ti-fio); }

/* ---- rodapé -------------------------------------------------------------------------------- */
html.tema-identidade .jt-rodape { background: var(--ti-indigo); color: #d9def0; font-size: 15px; margin-top: 40px; }
html.tema-identidade .jt-rodape a { color: #d9def0; }
html.tema-identidade .jt-rodape a:hover { color: var(--ti-amarelo); }
html.tema-identidade .jt-rodape-colunas { display: flex; flex-wrap: wrap; gap: 40px; padding-top: 44px; padding-bottom: 28px; }
html.tema-identidade .jt-rodape-marca { flex: 1 1 260px; display: flex; flex-direction: column; gap: 8px; }
html.tema-identidade .jt-rodape-marca img { width: 200px; height: auto; margin-bottom: 10px; }
html.tema-identidade .jt-rodape-marca p { margin: 0 0 4px; }
html.tema-identidade .jt-rodape nav { display: flex; flex-direction: column; gap: 8px; min-width: 160px; }
html.tema-identidade .jt-rodape h2 { margin: 0 0 4px; color: #ffffff; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 17px; }
html.tema-identidade .jt-rodape-base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; border-top: 1px solid rgba(255, 255, 255, .16); padding-top: 16px; padding-bottom: 22px; font-size: 13px; }

/* =============================================================================================
 * Seções repaginadas (31/10/2026): tudo o que ainda era a identidade antiga na home e nas listas.
 * #vagasDestaque e #secaoAtuacao: até 31/10/2026 a API dos parceiros lia o HTML dos dois; não lê mais (app/Servicos/class.ApiParceiros.php).
 * ============================================================================================= */

/* ---- títulos de seção ---------------------------------------------------------------------- */
html.tema-identidade .ti-secao-cabeca { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
html.tema-identidade .ti-secao-cabeca h2 { margin: 0; font-size: 34px; color: var(--ti-indigo); }
html.tema-identidade .ti-secao-cabeca a, html.tema-identidade .ti-link-forte { font-weight: 800; color: var(--ti-indigo); text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; text-underline-offset: 5px; }
html.tema-identidade #vagasDestaque h2, html.tema-identidade #secaoAtuacao > .container > .row > .col-md-12 > h2 { font-size: 34px !important; text-align: left !important; margin: 0 !important; }
html.tema-identidade #vagasDestaque hr, html.tema-identidade #secaoAtuacao > .container > .row > .col-md-12 > hr { margin: 12px 0 0 !important; width: 56px !important; border: 0 !important; border-top: 4px solid var(--ti-amarelo) !important; border-radius: 2px; }
html.tema-identidade #vagasDestaque .row.text-center { text-align: left; }
html.tema-identidade #vagasDestaque .container, html.tema-identidade #secaoAtuacao > .container { max-width: var(--jt-largura); width: 100%; padding: 0 24px; box-sizing: border-box; }

/* ---- vagas recentes (#vagasDestaque, carrossel slick) ------------------------------------- */
html.tema-identidade #vagasDestaque { background: var(--ti-creme) !important; border-top: 1px solid var(--ti-fio); border-bottom: 1px solid var(--ti-fio); padding: 56px 0 44px !important; margin: 0 !important; }
html.tema-identidade #vagasDestaque .slideVagas { padding: 0 6px; }
html.tema-identidade #vagasDestaque .slick-slide { padding: 0 8px; box-sizing: border-box; }
html.tema-identidade .bxDestaque { border: 1px solid var(--ti-fio) !important; border-radius: 12px !important; background: #ffffff !important; overflow: hidden; height: auto !important; min-height: 132px; transition: border-color 150ms, transform 150ms; }
html.tema-identidade .bxDestaque:hover { border-color: var(--ti-indigo) !important; transform: translateY(-2px); }
html.tema-identidade .bxDestaque > a { display: flex !important; gap: 14px; align-items: flex-start; padding: 16px; color: var(--ti-tinta) !important; text-decoration: none !important; }
html.tema-identidade .bxDestaque figure, html.tema-identidade .bxDestaque figure.full { flex: 0 0 64px !important; width: 64px !important; height: 64px !important; margin: 0 !important; border: 1px solid var(--ti-fio); border-radius: 10px; overflow: hidden; background: #ffffff; float: none !important; }
html.tema-identidade .bxDestaque figure img { width: 100% !important; height: 100% !important; object-fit: contain !important; }
html.tema-identidade .bxDestaque .txt { flex: 1 1 0; min-width: 0; padding: 0 !important; float: none !important; width: auto !important; display: flex; flex-direction: column; gap: 3px; }
html.tema-identidade .bxDestaque h3 { margin: 0 !important; font-size: 17px !important; line-height: 1.25 !important; color: var(--ti-indigo) !important; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
html.tema-identidade .bxDestaque p { margin: 0 !important; font-size: 14px !important; color: var(--ti-cinza) !important; }
html.tema-identidade .bxDestaque .classificacao { order: -1; font-size: 13px !important; font-weight: 700; color: var(--ti-laranja) !important; }
html.tema-identidade .bxDestaque .empresa b { color: var(--ti-tinta); font-weight: 700; }
html.tema-identidade .bxDestaque .tipo { position: static !important; align-self: flex-start; margin-top: 6px; padding: 2px 10px !important; border-radius: 999px !important; background: var(--jt-primaria-suave) !important; color: var(--ti-indigo) !important; font-size: 12px !important; font-weight: 700; }
html.tema-identidade #vagasDestaque .slick-dots { position: static !important; margin-top: 18px !important; }
html.tema-identidade #vagasDestaque .slick-dots li button, html.tema-identidade #vagasDestaque .slick-dots li { width: 10px !important; height: 10px !important; margin: 0 3px !important; }
html.tema-identidade #vagasDestaque .slick-dots li button { background: #d9d3bf !important; border-radius: 50% !important; border: 0 !important; font-size: 0 !important; padding: 0 !important; }
html.tema-identidade #vagasDestaque .slick-dots li.slick-active button { background: var(--ti-indigo) !important; width: 26px !important; border-radius: 5px !important; }
html.tema-identidade #vagasDestaque .slick-dots li.slick-active { width: 26px !important; }
html.tema-identidade #vagasDestaque .slick-dots li button:before { display: none !important; }
html.tema-identidade #vagasDestaque .slick-prev, html.tema-identidade #vagasDestaque .slick-next { width: 44px !important; height: 44px !important; border-radius: 50% !important; background: #ffffff !important; border: 1px solid var(--ti-fio) !important; z-index: 2; }
html.tema-identidade #vagasDestaque .slick-prev:before, html.tema-identidade #vagasDestaque .slick-next:before { color: var(--ti-indigo) !important; opacity: 1 !important; }
/* 11/11/2026: "Ver todas as vagas" ao lado do título, salário e "Publicada há" no cartão; até 991 px, faixa de arrastar
 * (o slick não é criado: assets/js/site.js) com o cartão quase na largura toda e um pedaço do próximo aparecendo */
html.tema-identidade .jfe-rec-cabeca { position: relative; }
html.tema-identidade .jfe-rec-todas { position: absolute; right: 15px; bottom: 6px; font-weight: 800; font-size: 15px; color: var(--ti-indigo) !important; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; text-underline-offset: 4px; }
html.tema-identidade .bxDestaque .jfe-rec-salario { font-weight: 800; color: var(--ti-tinta) !important; }
html.tema-identidade .bxDestaque .jfe-rec-publicada { font-size: 12.5px !important; }
html.tema-identidade #vagasDestaque .slideVagas ul:not(.slick-initialized) { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 24px; margin: 0 -24px; padding: 2px 24px 12px; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
html.tema-identidade #vagasDestaque .slideVagas ul:not(.slick-initialized) > li { flex: 0 0 calc((100% - 28px) / 3); min-width: 0; scroll-snap-align: start; display: flex; }
html.tema-identidade #vagasDestaque .slideVagas ul:not(.slick-initialized) > li > .bxDestaque { flex: 1 1 auto; margin: 0 !important; }
html.tema-identidade .bxDestaque .txt p, html.tema-identidade .bxDestaque h3 { overflow-wrap: break-word; }
@media (max-width: 991.98px) {
    html.tema-identidade #vagasDestaque .slideVagas { padding: 0 !important; }
    html.tema-identidade #vagasDestaque .slideVagas ul:not(.slick-initialized) > li { flex-basis: min(82%, 340px); }
    html.tema-identidade #vagasDestaque .row.clearfix { margin: 0; }
}
@media (max-width: 560px) {
    html.tema-identidade .jfe-rec-todas { position: static; display: inline-block; margin-top: 14px; }
}

/* ---- áreas de atuação (#secaoAtuacao) ----------------------------------------------------- */
html.tema-identidade #secaoAtuacao { background: #ffffff !important; padding: 56px 0 24px !important; }
html.tema-identidade #secaoAtuacao #banner-plugin { margin-top: 24px; }
html.tema-identidade .bxAtuacao { position: relative; border: 1px solid var(--ti-fio) !important; border-top: 0 !important; border-radius: 12px !important; background: #ffffff !important; overflow: hidden; box-shadow: none !important; display: flex; flex-direction: column; margin-bottom: 20px; }
html.tema-identidade .bxAtuacao header { background: var(--ti-indigo) !important; color: #ffffff !important; padding: 18px 20px 16px !important; border: 0 !important; margin: 0 !important; }
html.tema-identidade #estagio.bxAtuacao header { background: var(--ti-laranja) !important; }
html.tema-identidade #aprendiz.bxAtuacao header { background: var(--ti-amarelo) !important; }
html.tema-identidade #pcd.bxAtuacao header { background: #1f7a6d !important; }
html.tema-identidade .bxAtuacao header h3 { margin: 0 !important; font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; font-size: 22px !important; color: inherit !important; border: 0 !important; }
html.tema-identidade .bxAtuacao header p, html.tema-identidade .bxAtuacao header p b { margin: 2px 0 0 !important; color: inherit !important; opacity: .9; font-size: 14px !important; }
html.tema-identidade #aprendiz.bxAtuacao header, html.tema-identidade #aprendiz.bxAtuacao header h3 { color: var(--ti-indigo) !important; }
html.tema-identidade .bxAtuacao header h3 a, html.tema-identidade .bxAtuacao header h3 span { color: inherit !important; }
html.tema-identidade .bxAtuacao .bxVagasAtuacao { padding: 8px 8px 10px !important; height: auto !important; max-height: none; overflow: visible !important; }
/* 11/11/2026: os 6 cargos com mais vagas, sem rolagem interna (antes a lista tinha 300 px e o último item saía cortado);
 * cartões da mesma altura, cabeçalhos iguais e, no celular e no tablet, lado a lado para arrastar */
html.tema-identidade .bxAtuacao li:nth-child(n+7) { display: none !important; }
html.tema-identidade .jfe-areas { display: flex; flex-wrap: nowrap; gap: 16px; margin: 0 !important; }
html.tema-identidade .jfe-areas::before, html.tema-identidade .jfe-areas::after { display: none !important; }
html.tema-identidade .jfe-areas > .col-md-3 { float: none !important; width: auto !important; flex: 1 1 0; min-width: 0; padding: 0 !important; display: flex; }
html.tema-identidade .jfe-areas .bxAtuacao { flex: 1 1 auto; width: 100%; margin: 0 !important; }
html.tema-identidade .bxAtuacao li a { flex: 1 1 auto; min-width: 0; line-height: 1.3; overflow-wrap: break-word; }
@media (min-width: 992px) { html.tema-identidade .jfe-areas .bxAtuacao header { min-height: 106px !important; } }
@media (max-width: 991.98px) {
    /* a faixa vai até a borda da tela (o container tem 24 px de recuo), para o próximo cartão aparecer cortado */
    html.tema-identidade .jfe-areas { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 24px; margin: 0 -24px !important; padding: 0 24px 8px !important; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
    html.tema-identidade .jfe-areas > .col-md-3 { flex: 0 0 min(80%, 320px); scroll-snap-align: start; }
}
html.tema-identidade .bxAtuacao ul { margin: 0 !important; padding: 0 !important; }
html.tema-identidade .bxAtuacao li { display: flex !important; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 10px !important; border-radius: 8px; border: 0 !important; font-size: 14px !important; }
html.tema-identidade .bxAtuacao li:hover { background: var(--ti-creme); }
html.tema-identidade .bxAtuacao li a { color: var(--ti-tinta) !important; float: none !important; }
html.tema-identidade .bxAtuacao li span { float: none !important; flex-shrink: 0; min-width: 28px; text-align: center; padding: 1px 8px; border-radius: 999px; background: var(--jt-primaria-suave); color: var(--ti-indigo) !important; font-weight: 700; font-size: 12px !important; }
html.tema-identidade .bxAtuacao footer { border-top: 1px solid var(--ti-fio) !important; background: #ffffff !important; padding: 12px 18px !important; margin-top: auto; text-align: left !important; }
html.tema-identidade .bxAtuacao footer a { color: var(--ti-indigo) !important; font-weight: 800; text-transform: none !important; font-size: 15px !important; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; text-underline-offset: 4px; }

/* ---- JF+ Inclusão (dentro de #secaoAtuacao; repaginado em 11/11/2026) ----------------------------------
 * Cartões no padrão das áreas de atuação: foto, nome, frase, total de vagas, os 5 cargos com mais vagas (número
 * em selo, sem cortar) e "Ver mais". No celular e no tablet os cartões ficam lado a lado, para arrastar (antes: 4
 * cartões empilhados, ~2.000 px de rolagem). HTML em app/Site/inicio.php (classes jfe-inc-*). */
html.tema-identidade .jfe-inclusao { display: flex; flex-wrap: wrap; align-items: stretch; margin: 32px 0 0 !important; padding: 32px 12px 28px; background: var(--ti-creme); border: 1px solid var(--ti-fio); border-radius: 16px; }
html.tema-identidade .jfe-inclusao::before, html.tema-identidade .jfe-inclusao::after, html.tema-identidade .jfe-inc-cartoes::before, html.tema-identidade .jfe-inc-cartoes::after { display: none !important; }
html.tema-identidade .jfe-inc-intro { float: none !important; width: 22% !important; padding: 0 16px 0 12px !important; }
html.tema-identidade .jfe-inc-intro img { max-width: 200px; margin-bottom: 14px; }
html.tema-identidade .jfe-inc-intro p { color: var(--ti-cinza); font-size: 15px; line-height: 1.55; margin: 0; }
html.tema-identidade .jfe-inc-intro .jfe-inc-acoes { margin-top: 18px; }
html.tema-identidade .jfe-inc-cta { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; line-height: 1.25; border-radius: 10px; background: var(--ti-indigo); color: #ffffff !important; font-weight: 800; font-size: 15px; text-decoration: none !important; }
html.tema-identidade .jfe-inc-cta:hover, html.tema-identidade .jfe-inc-cta:focus { background: var(--jt-primaria-escura); }
html.tema-identidade .jfe-inclusao > .col-md-9 { float: none !important; width: 78% !important; padding: 0 12px 0 0 !important; }
html.tema-identidade .jfe-inc-cartoes { display: flex; gap: 14px; margin: 0 !important; height: 100%; }
html.tema-identidade .jfe-inc-cartoes > .col-md-3 { float: none !important; width: auto !important; flex: 1 1 0; min-width: 0; padding: 0 !important; display: flex; flex-direction: column; gap: 16px; }
html.tema-identidade .modalidade-bloco { flex: 1 1 auto; background: #ffffff; border: 1px solid var(--ti-fio); border-radius: 12px; padding: 0; margin: 0 !important; display: flex; flex-direction: column; overflow: hidden; }
html.tema-identidade .modalidade-bloco > img { display: block; width: 100%; aspect-ratio: 2 / 1; object-fit: cover; margin: 0; }
html.tema-identidade .modalidade-bloco h4 { margin: 14px 16px 0 !important; line-height: 1.2 !important; }
html.tema-identidade .modalidade-bloco h4, html.tema-identidade .modalidade-bloco h4 a { color: var(--ti-indigo) !important; font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; font-size: 19px !important; }
html.tema-identidade .modalidade-bloco h4 br { display: none; }
html.tema-identidade .modalidade-bloco h4 span { display: block; margin-top: 2px; color: var(--ti-cinza) !important; font-family: var(--jt-fonte-corpo); font-size: 13px !important; font-weight: 400 !important; }
html.tema-identidade .jfe-inc-total { align-self: flex-start; margin: 8px 16px 6px; padding: 2px 10px; border-radius: 999px; background: var(--jt-primaria-suave); color: var(--ti-indigo); font-size: 12px; font-weight: 800; }
html.tema-identidade .modalidade-bloco .bxVagasAtuacao { margin: 0 !important; padding: 2px 8px 12px !important; height: auto !important; max-height: none; overflow: visible; font-size: 13.5px; }
html.tema-identidade .modalidade-bloco .bxVagasAtuacao > div { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 5px 6px; border-radius: 6px; }
html.tema-identidade .modalidade-bloco .bxVagasAtuacao > div.jfe-inc-extra { display: none; }
html.tema-identidade .modalidade-bloco .bxVagasAtuacao > div:hover { background: var(--ti-creme); }
html.tema-identidade .modalidade-bloco .bxVagasAtuacao a { flex: 1 1 auto; min-width: 0; color: var(--ti-tinta) !important; line-height: 1.3; overflow-wrap: break-word; }
html.tema-identidade .jfe-inc-num { flex: none; min-width: 26px; text-align: center; padding: 1px 8px; border-radius: 999px; background: var(--jt-primaria-suave); color: var(--ti-indigo) !important; font-weight: 700; font-size: 12px; line-height: 18px; }
html.tema-identidade .jfe-inc-num::before, html.tema-identidade .jfe-inc-num::after { content: none; }
html.tema-identidade .modalidade-bloco > .col-md-12 { float: none !important; width: auto !important; margin-top: auto; padding: 0 !important; }
html.tema-identidade .modalidade-bloco footer { background: #ffffff !important; border-top: 1px solid var(--ti-fio); padding: 12px 16px !important; border-radius: 0 !important; text-align: left; }
html.tema-identidade .modalidade-bloco footer a, html.tema-identidade .modalidade-bloco .btnVerMais { color: var(--ti-indigo) !important; font-weight: 800; font-size: 15px; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; text-underline-offset: 4px; }
@media (max-width: 991.98px) {
    html.tema-identidade .jfe-inclusao { padding: 24px 0 20px; }
    html.tema-identidade .jfe-inc-intro, html.tema-identidade .jfe-inclusao > .col-md-9 { width: 100% !important; padding: 0 16px !important; }
    html.tema-identidade .jfe-inc-intro { margin-bottom: 20px; }
    html.tema-identidade .jfe-inc-intro img { max-width: 170px; }
    html.tema-identidade .jfe-inclusao > .col-md-9 { padding: 0 !important; }
    html.tema-identidade .jfe-inc-cartoes { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; padding: 0 16px 8px !important; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
    html.tema-identidade .jfe-inc-cartoes > .col-md-3 { flex: 0 0 min(78%, 300px); scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) { html.tema-identidade .jfe-inc-cartoes { scroll-behavior: auto; } }

/* ---- notícias da home (app/views/temas/identidade/site/home-noticias.php) ---------------- */
html.tema-identidade .ti-noticias { background: #ffffff; padding: 56px 0; }
html.tema-identidade .ti-noticias-grade { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; }
html.tema-identidade .ti-noticia-destaque { display: flex; flex-direction: column; gap: 8px; color: var(--ti-tinta); text-decoration: none !important; }
html.tema-identidade .ti-noticia-destaque img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; }
html.tema-identidade .ti-noticia-destaque strong { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 26px; line-height: 1.2; color: var(--ti-indigo); }
html.tema-identidade .ti-noticia-destaque:hover strong, html.tema-identidade .ti-noticias-lista a:hover strong { text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; }
html.tema-identidade .ti-noticia-coluna { font-size: 13px; font-weight: 800; color: var(--ti-laranja); }
html.tema-identidade .ti-noticia-data { font-size: 13px; color: var(--ti-cinza); }
html.tema-identidade .ti-noticias-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
html.tema-identidade .ti-noticias-lista li + li { border-top: 1px solid var(--ti-fio); }
html.tema-identidade .ti-noticias-lista a { display: flex; gap: 16px; padding: 14px 0; color: var(--ti-tinta); text-decoration: none !important; }
html.tema-identidade .ti-noticias-lista li:first-child a { padding-top: 0; }
html.tema-identidade .ti-noticias-lista img { width: 120px; height: 80px; object-fit: cover; border-radius: 10px; flex-shrink: 0; }
html.tema-identidade .ti-noticias-lista a > span { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
html.tema-identidade .ti-noticias-lista strong { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 18px; line-height: 1.25; color: var(--ti-indigo); }
@media (max-width: 900px) {
    html.tema-identidade .ti-noticias-grade { grid-template-columns: minmax(0, 1fr); }
    html.tema-identidade .ti-noticia-destaque strong { font-size: 22px; }
    html.tema-identidade .ti-noticias-lista img { width: 96px; height: 68px; }
    html.tema-identidade .ti-noticias-lista strong { font-size: 16px; }
    html.tema-identidade .ti-secao-cabeca h2, html.tema-identidade #vagasDestaque h2, html.tema-identidade #secaoAtuacao > .container > .row > .col-md-12 > h2 { font-size: 28px !important; }
}

/* ---- empresas (app/views/temas/identidade/site/empresas-parceiras.php) ------------------- */
html.tema-identidade .ti-banner-rs { margin-top: 40px; margin-bottom: 0; }
html.tema-identidade .ti-banner-rs img { width: 100%; height: auto; display: block; border-radius: 12px; }
@media (max-width: 768px) { html.tema-identidade .ti-banner-rs { display: none; } }   /* 13/11/2026: arte pequena no celular; vai ser refeita */
html.tema-identidade section.ti-empresas { background: var(--ti-creme) !important; background-image: none !important; border-top: 1px solid var(--ti-fio); padding: 56px 0 !important; margin-top: 40px; }
html.tema-identidade .ti-empresas-grade { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 44px; align-items: start; }
html.tema-identidade .ti-empresas-texto { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
html.tema-identidade .ti-empresas h2 { margin: 0; font-size: 34px; line-height: 1.15; color: var(--ti-indigo) !important; text-align: left; }
html.tema-identidade .ti-empresas h2 span { color: var(--ti-laranja); }
html.tema-identidade .ti-empresas-texto p { margin: 0; color: var(--ti-cinza); font-size: 16px; }
html.tema-identidade form#buscaEmp { display: flex !important; gap: 8px; width: 100%; margin: 6px 0 0 !important; max-width: none !important; background: none !important; }
html.tema-identidade #buscaEmp input { flex: 1 1 0; min-width: 0; height: 48px; border: 1px solid var(--jt-borda) !important; border-radius: 8px !important; padding: 0 14px !important; background: #ffffff !important; font-size: 16px; margin: 0 !important; width: auto !important; }
html.tema-identidade #buscaEmp button { height: 48px; padding: 0 18px; border: 0; border-radius: 8px; background: var(--ti-indigo); color: #ffffff; font-weight: 800; cursor: pointer; }
html.tema-identidade .ti-empresas-novas-titulo { margin: 0 0 12px; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 20px; color: var(--ti-indigo); }
html.tema-identidade .ti-empresas-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
html.tema-identidade .ti-empresas-lista a { display: flex; gap: 14px; align-items: center; height: 100%; box-sizing: border-box; padding: 14px; background: #ffffff; border: 1px solid var(--ti-fio); border-radius: 12px; color: var(--ti-tinta); text-decoration: none !important; transition: border-color 150ms; }
html.tema-identidade .ti-empresas-lista a:hover { border-color: var(--ti-indigo); }
html.tema-identidade .ti-empresas-lista img { width: 64px; height: 64px; object-fit: contain; border: 1px solid var(--ti-fio); border-radius: 10px; background: #ffffff; flex-shrink: 0; }
html.tema-identidade .ti-empresas-lista span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
html.tema-identidade .ti-empresas-lista strong { font-weight: 800; color: var(--ti-indigo); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.tema-identidade .ti-empresas-lista small { color: var(--ti-cinza); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.tema-identidade .ti-empresas-lista em { font-style: normal; font-weight: 700; font-size: 13px; color: var(--ti-laranja); }
@media (max-width: 900px) {
    html.tema-identidade .ti-empresas-grade { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    html.tema-identidade .ti-empresas-lista { grid-template-columns: minmax(0, 1fr); }
    html.tema-identidade .ti-empresas h2 { font-size: 28px; }
}

/* ---- cartão de vaga (app/views/temas/identidade/site/cartao-vaga.php) -------------------- */
html.tema-identidade .ti-vaga { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 18px 20px; margin-bottom: 12px; background: #ffffff; border: 1px solid var(--ti-fio); border-radius: 14px; transition: border-color 150ms; }
html.tema-identidade .ti-vaga:hover { border-color: var(--ti-indigo); }
html.tema-identidade .ti-vaga-logo img { width: 72px; height: 72px; object-fit: contain; border: 1px solid var(--ti-fio); border-radius: 12px; background: #ffffff; display: block; }
html.tema-identidade .ti-vaga-corpo { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.tema-identidade .ti-vaga-etiquetas { margin: 0; display: flex; gap: 6px; flex-wrap: wrap; }
html.tema-identidade .ti-vaga-nivel { font-size: 13px; font-weight: 800; color: var(--ti-laranja); }
html.tema-identidade .ti-vaga-pcd { font-size: 12px; font-weight: 800; color: #1f7a6d; background: #e3f3ef; padding: 1px 8px; border-radius: 999px; }
html.tema-identidade .ti-vaga h3 { margin: 0; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 20px; line-height: 1.25; }
html.tema-identidade .ti-vaga h3 a { color: var(--ti-indigo) !important; text-decoration: none; }
html.tema-identidade .ti-vaga h3 a:hover { text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 3px; }
html.tema-identidade .ti-vaga-empresa { margin: 0; color: var(--ti-tinta); font-weight: 700; font-size: 15px; }
html.tema-identidade .ti-vaga-empresa a { color: var(--ti-tinta) !important; }
html.tema-identidade .ti-vaga-empresa span { color: var(--ti-cinza); font-weight: 400; }
/* selo "Empresa que dá retorno" (SeloRetorno::icone): roseta dourada no canto da logo */
html.tema-identidade .ti-selo { display: inline-block; width: 26px; height: 26px; line-height: 0; filter: drop-shadow(0 1px 2px rgba(80, 55, 0, 0.35)); }
html.tema-identidade .ti-selo svg { width: 100%; height: 100%; display: block; }
html.tema-identidade .ti-vaga-logo { position: relative; display: block; }
html.tema-identidade .ti-vaga-logo .ti-selo, html.tema-identidade .ti-logo-selo .ti-selo { position: absolute; right: -7px; bottom: -7px; }
html.tema-identidade .ti-logo-selo { position: relative; display: inline-block; flex-shrink: 0; line-height: 0; }
html.tema-identidade .ti-logo-selo-grande .ti-selo { width: 36px; height: 36px; right: -8px; bottom: -8px; }
html.tema-identidade .ti-vaga-compacta .ti-vaga-logo .ti-selo { width: 22px; height: 22px; right: -6px; bottom: -6px; }
html.tema-identidade .ti-retorno-bloco { display: flex; gap: 10px; align-items: flex-start; margin: 12px 0 0; padding: 12px 14px; border-radius: 10px;
    background: #fff8e3; border: 1px solid #f1d98f; color: var(--ti-tinta); font-size: 14px; line-height: 1.45; }
html.tema-identidade .ti-retorno-bloco .ti-selo { flex-shrink: 0; width: 28px; height: 28px; }
html.tema-identidade .ti-retorno-bloco strong { display: block; color: #7a5600; font-weight: 800; margin-bottom: 2px; }
html.tema-identidade .ti-retorno-bloco p { margin: 0; }
html.tema-identidade .ti-vaga-dados { margin: 4px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
html.tema-identidade .ti-vaga-dados li { font-size: 13px; color: var(--ti-tinta); background: var(--ti-creme); border: 1px solid var(--ti-fio); padding: 2px 10px; border-radius: 999px; }
html.tema-identidade .ti-vaga-ver { display: inline-flex; align-items: center; min-height: 42px; padding: 0 18px; border-radius: 8px; background: var(--ti-amarelo); color: var(--ti-indigo) !important; font-weight: 800; text-decoration: none !important; white-space: nowrap; }
html.tema-identidade .ti-vaga-ver:hover { background: var(--ti-amarelo-claro); }
html.tema-identidade .ti-vaga-compacta { grid-template-columns: 56px minmax(0, 1fr); padding: 14px; }
html.tema-identidade .ti-vaga-compacta .ti-vaga-logo img { width: 56px; height: 56px; }
html.tema-identidade .ti-vaga-compacta h3 { font-size: 17px; }
html.tema-identidade .ti-vaga-compacta .ti-vaga-ver { display: none; }
@media (max-width: 700px) {
    html.tema-identidade .ti-vaga { grid-template-columns: 56px minmax(0, 1fr); gap: 14px; padding: 16px; }
    html.tema-identidade .ti-vaga-logo img { width: 56px; height: 56px; }
    html.tema-identidade .ti-vaga-ver { grid-column: 1 / -1; justify-content: center; }
    html.tema-identidade .ti-vaga h3 { font-size: 18px; }
}

/* ---- lista de vagas e de empresas: filtros (#cpbusca) ------------------------------------ */
html.tema-identidade #cpbusca { background: transparent !important; border: 0 !important; padding: 0 !important; }
html.tema-identidade #cpbusca > h3 { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 22px; color: var(--ti-indigo); margin: 0 0 4px; }
html.tema-identidade #cpbusca .wrapSele { border: 1px solid var(--ti-fio) !important; border-radius: 12px !important; background: #ffffff !important; padding: 14px !important; margin-bottom: 12px; }
html.tema-identidade #cpbusca .wrapSele .cab { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: baseline; }
html.tema-identidade #cpbusca .wrapSele h4 { font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; font-size: 17px !important; color: var(--ti-indigo) !important; margin: 0 !important; }
html.tema-identidade #cpbusca .wrapSele hr { display: none; }
html.tema-identidade #cpbusca .clr { font-size: 12px; color: var(--ti-laranja) !important; font-weight: 700; margin: 0; cursor: pointer; }
html.tema-identidade #cpbusca .listSel { height: 210px; margin-top: 10px; }
html.tema-identidade #cpbusca .listSel a { padding: 4px 0 4px 26px !important; margin-bottom: 4px !important; font-size: 14px !important; }
html.tema-identidade #cpbusca .listSel a:before { width: 16px !important; height: 16px !important; top: 5px !important; border-radius: 4px !important; border: 1.5px solid var(--jt-borda) !important; background: #ffffff; }
html.tema-identidade #cpbusca .listSel a.act:before, html.tema-identidade #cpbusca .listSel a:hover:before { background: var(--ti-indigo) !important; border-color: var(--ti-indigo) !important; box-shadow: inset 0 0 0 3px #ffffff; }
html.tema-identidade #cpbusca input[type=text] { height: 44px; border: 1px solid var(--jt-borda) !important; border-radius: 8px !important; padding: 0 12px !important; width: 100%; }
html.tema-identidade .bxTags span { background: var(--ti-indigo) !important; color: #ffffff !important; }

/* ---- página da vaga e da empresa ----------------------------------------------------------- */
html.tema-identidade .cabEmpresa { padding: 28px 0 24px !important; }
html.tema-identidade .cabEmpresa .container { max-width: var(--jt-largura); width: 100%; }
html.tema-identidade .cabEmpresa figure { background: #ffffff; border-radius: 14px !important; padding: 6px; }
html.tema-identidade .cabEmpresa h2 { font-size: 30px !important; font-weight: 600 !important; margin-top: 8px; }
html.tema-identidade .cabEmpresa p { color: #d9def0 !important; }
html.tema-identidade .cabEmpresa .botoes a { background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; border-radius: 8px !important; font-weight: 800 !important; }
html.tema-identidade p.acesso { margin: 12px 0 0; }
html.tema-identidade p.acesso a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 8px; border: 1px solid var(--jt-borda); background: #ffffff; color: var(--ti-indigo) !important; font-weight: 800; margin-right: 8px; text-decoration: none !important; }
html.tema-identidade .wrapbranco { border-radius: 14px !important; padding: 24px !important; }
html.tema-identidade .wrapbranco h2 { font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; font-size: 30px !important; color: var(--ti-indigo) !important; text-transform: none; }
html.tema-identidade .wrapbranco h3, html.tema-identidade .wrapbranco h4, html.tema-identidade .wrapbranco h5 { font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; color: var(--ti-indigo) !important; }
html.tema-identidade .wrapbranco hr, html.tema-identidade hr.bv { border-color: var(--ti-fio) !important; }
html.tema-identidade .wrapbranco > .tipo { display: inline-block; background: transparent !important; color: var(--ti-laranja) !important; padding: 0 !important; font-weight: 800; font-size: 14px !important; }
html.tema-identidade .wrapbranco .table td { border: 0 !important; vertical-align: middle !important; }
html.tema-identidade div.circ { width: 48px !important; height: 48px !important; line-height: 48px !important; border-radius: 12px !important; background: var(--ti-creme) !important; border: 1px solid var(--ti-fio); color: var(--ti-indigo) !important; font-weight: 800; }
html.tema-identidade div.circ span { font-size: 22px !important; padding-top: 12px !important; color: var(--ti-indigo) !important; }
html.tema-identidade .bigbt { background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; border-radius: 10px !important; font-size: 17px !important; font-weight: 800 !important; max-width: 320px !important; }
html.tema-identidade .bigbt:hover { background: var(--ti-amarelo-claro) !important; }

/* ---- lista de empresas (/empresas) e de notícias (/noticias, /blog) ---------------------- */
html.tema-identidade .wrapbrancoRz { height: auto !important; min-height: 240px; border-radius: 14px !important; padding: 18px !important; display: flex; flex-direction: column; transition: border-color 150ms; }
html.tema-identidade .wrapbrancoRz:hover { border-color: var(--ti-indigo) !important; }
html.tema-identidade .wrapbrancoRz figure, html.tema-identidade .wrapbrancoRz .vemp { border-radius: 12px; overflow: hidden; }
html.tema-identidade .wrapbrancoRz strong { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 16px !important; text-transform: none !important; color: var(--ti-indigo); }
html.tema-identidade .wrapbrancoRz b { color: var(--ti-laranja) !important; font-weight: 800; }
html.tema-identidade .bigChamada { border: 1px solid var(--ti-fio); border-radius: 14px; overflow: hidden; background: #ffffff; margin-bottom: 20px; }
html.tema-identidade .bigChamada figure img { border-radius: 0; aspect-ratio: 16 / 9; object-fit: cover; width: 100%; height: auto; }
html.tema-identidade .bigChamada h3, html.tema-identidade .bigChamada p, html.tema-identidade .bigChamada h2 { font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; color: var(--ti-indigo) !important; padding: 0 16px; }
html.tema-identidade .bigChamada .categoria { background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; border-radius: 999px !important; font-weight: 800; }
html.tema-identidade .container-filtros .list-filters .button-filter, html.tema-identidade .container-filtros .list-filters .item.active .button-filter { border-radius: 8px !important; }
html.tema-identidade .container-filtros .list-filters .item.active .button-filter { background: var(--ti-indigo) !important; color: #ffffff !important; }

/* ---- rodapé: logo novo inteiro ------------------------------------------------------------- */
html.tema-identidade .jt-rodape-marca img { width: 210px !important; max-width: 100%; height: auto !important; object-fit: contain; }

html.tema-identidade .bxAtuacao header { min-height: 88px; display: flex; flex-direction: column; justify-content: center; }
html.tema-identidade section.layout-portal > .mt-8.bg-cyan-100 { margin-top: 0 !important; background: var(--jt-primaria-suave) !important; border-top: 1px solid #dfe3f1; border-bottom: 1px solid #dfe3f1; }
html.tema-identidade section.layout-portal > .mt-8.bg-cyan-100 h5 { font-family: var(--jt-fonte-corpo) !important; font-weight: 600 !important; color: var(--ti-cinza) !important; font-size: 17px !important; }
html.tema-identidade section.layout-portal > .mt-8.bg-cyan-100 .btn { background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; border: 0 !important; font-weight: 800; padding: 10px 24px; }
html.tema-identidade #vagasDestaque .slideVagas { position: relative; padding: 0 56px; }
html.tema-identidade #vagasDestaque .slick-prev { left: 0 !important; }
html.tema-identidade #vagasDestaque .slick-next { right: 0 !important; }
html.tema-identidade #vagasDestaque .slick-prev, html.tema-identidade #vagasDestaque .slick-next { font-size: 0 !important; color: transparent !important; top: 50% !important; transform: translateY(-50%); }
/* Seta desenhada (duas bordas giradas), centrada pela geometria: o "‹ ›" da fonte ficava abaixo do centro do círculo */
html.tema-identidade #vagasDestaque .slick-prev, html.tema-identidade #vagasDestaque .slick-next { padding: 0 !important; line-height: 0 !important; }
html.tema-identidade #vagasDestaque .slick-prev:before, html.tema-identidade #vagasDestaque .slick-next:before { content: "" !important; position: absolute; top: 50%; left: 50%; width: 11px; height: 11px; border: solid var(--ti-indigo); border-width: 0 0 3px 3px; border-radius: 1px; box-sizing: border-box; font-size: 0 !important; line-height: 0 !important; }
html.tema-identidade #vagasDestaque .slick-prev:before { transform: translate(-30%, -50%) rotate(45deg); }
html.tema-identidade #vagasDestaque .slick-next:before { transform: translate(-70%, -50%) rotate(-135deg); }
html.tema-identidade #vagasDestaque .slick-prev:hover, html.tema-identidade #vagasDestaque .slick-next:hover { border-color: var(--ti-indigo) !important; }
@media (max-width: 700px) { html.tema-identidade #vagasDestaque .slideVagas { padding: 0 44px; } }

/* ---- ajustes depois da revisão (31/10/2026) ------------------------------------------------ */
html.tema-identidade #vagasDestaque .slideVagas ul.slick-slider { position: relative; }
html.tema-identidade #vagasDestaque .slick-prev, html.tema-identidade #vagasDestaque .slick-next { position: absolute !important; top: 50% !important; margin-top: -22px !important; transform: none !important; }
html.tema-identidade #vagasDestaque .slick-prev { left: -54px !important; right: auto !important; }
html.tema-identidade #vagasDestaque .slick-next { right: -54px !important; left: auto !important; }
@media (max-width: 700px) {
    html.tema-identidade #vagasDestaque .slick-prev { left: -42px !important; }
    html.tema-identidade #vagasDestaque .slick-next { right: -42px !important; }
}
/* filtros: título e "limpar" na mesma linha; o resto (busca, caixa de PcD) embaixo */
html.tema-identidade #cpbusca .wrapSele .cab { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 6px 10px; flex-direction: initial; }
html.tema-identidade #cpbusca .wrapSele .cab > * { grid-column: 1 / -1; float: none !important; }
html.tema-identidade #cpbusca .wrapSele .cab > h4 { grid-column: 1; grid-row: 1; }
html.tema-identidade #cpbusca .wrapSele .cab > .clr { grid-column: 2; grid-row: 1; }
html.tema-identidade #cpbusca form#chave { position: relative; margin: 4px 0 0 !important; }
html.tema-identidade #cpbusca form#chave input[type=submit] { position: absolute; right: 4px; top: 4px; width: 36px; height: 36px; border: 0; border-radius: 6px; background: var(--ti-amarelo) url(/assets/imagens/icone-busca.png) no-repeat center / 16px; }
html.tema-identidade #cpbusca #label-deficientes { display: flex; gap: 8px; align-items: center; margin-top: 8px; font-size: 14px; }
/* página da vaga: "Página da empresa" e "Oportunidades" */
html.tema-identidade p.acesso a { background: #ffffff !important; color: var(--ti-indigo) !important; border: 1px solid var(--jt-borda) !important; }
html.tema-identidade p.acesso a:hover { border-color: var(--ti-indigo) !important; }
/* blog: lateral dos colunistas */
html.tema-identidade #novosidebar { background: var(--ti-creme) !important; border-right: 1px solid var(--ti-fio); }
html.tema-identidade #novosidebar .title, html.tema-identidade #novosidebar .nome { color: var(--ti-indigo) !important; font-family: var(--jt-fonte-titulo); }
html.tema-identidade #novosidebar .icon img, html.tema-identidade .container-sobre-colunista .icon img { border: 3px solid var(--ti-amarelo) !important; }
html.tema-identidade .container-sobre-colunista .nome { font-family: var(--jt-fonte-titulo) !important; color: var(--ti-indigo) !important; }
html.tema-identidade .ti-empresa-vagas { padding-top: 8px; padding-bottom: 24px; }
@media (max-width: 700px) { html.tema-identidade .ti-vaga { align-items: start; } }
/* cartão de vaga: salário, modelo, data e salvar (07/11/2026) */
html.tema-identidade .ti-vaga { position: relative; }
html.tema-identidade .ti-vaga-modelo { font-size: 12px; font-weight: 800; color: #3d2f8f; background: #ece9fb; padding: 1px 8px; border-radius: 999px; }
html.tema-identidade .ti-vaga-quando { font-size: 12px; color: var(--ti-cinza); }
html.tema-identidade .ti-vaga-dados li.ti-vaga-salario { background: #e7f5ea; border-color: #bfe3c8; color: #1d6b34; font-weight: 800; }
html.tema-identidade .ti-vaga-salvar { position: absolute; top: 10px; right: 12px; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 999px; color: var(--ti-cinza); }
html.tema-identidade .ti-vaga-salvar svg { fill: none; stroke: currentColor; stroke-width: 2; }
html.tema-identidade .ti-vaga-salvar:hover, html.tema-identidade .ti-vaga-salvar:focus-visible { color: #d6336c; background: #fdecf2; }
html.tema-identidade .ti-vaga-salvar.salva { color: #d6336c; }
html.tema-identidade .ti-vaga-salvar.salva svg { fill: currentColor; }
html.tema-identidade .ti-vaga:not(.ti-vaga-compacta) .ti-vaga-ver { margin-top: 26px; }
@media (max-width: 700px) { html.tema-identidade .ti-vaga:not(.ti-vaga-compacta) .ti-vaga-ver { margin-top: 0; } html.tema-identidade .ti-vaga-corpo { padding-right: 30px; } }

/* ---- cabeçalho próprio (07/11/2026, app/views/temas/identidade/site/cabecalho.php) ----------------------- */
html.tema-identidade .jt-cabecalho { border-bottom: 0; box-shadow: 0 1px 0 var(--ti-fio), 0 6px 18px -12px rgba(28, 42, 99, .35); position: relative; }
html.tema-identidade .jt-cabecalho .jt-wrap { min-height: 84px; }
html.tema-identidade .jt-logo img { height: 40px; }
html.tema-identidade .jt-menu { align-items: center; gap: 6px; font-size: 15.5px; }
html.tema-identidade .jt-menu > a, html.tema-identidade .jt-menu-vagas { padding: 10px 12px; border-radius: 10px; }
html.tema-identidade .jt-menu > a:hover, html.tema-identidade .jt-menu-vagas:hover { background: var(--ti-creme); box-shadow: none; }
html.tema-identidade .jt-menu > a.atual, html.tema-identidade .jt-menu-vagas.atual { box-shadow: inset 0 -3px 0 var(--ti-amarelo); border-radius: 0; }
html.tema-identidade .jt-suspenso { position: relative; }
html.tema-identidade .jt-menu-vagas, html.tema-identidade .jt-conta-botao { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; font: inherit; font-weight: 700; color: var(--ti-indigo); cursor: pointer; }
html.tema-identidade .jt-menu-vagas svg, html.tema-identidade .jt-conta-botao svg { transition: transform .2s; }
html.tema-identidade .jt-suspenso.aberto > button svg { transform: rotate(180deg); }
html.tema-identidade .jt-painel { position: absolute; top: calc(100% + 12px); z-index: 1040; background: #ffffff; border: 1px solid var(--ti-fio); border-radius: 16px; box-shadow: 0 18px 40px -12px rgba(28, 42, 99, .35); }
html.tema-identidade .jt-painel[hidden] { display: none; }
html.tema-identidade .jt-painel::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }   /* ponte para o mouse */
html.tema-identidade .jt-painel-vagas { left: 50%; transform: translateX(-36%); width: 720px; padding: 22px 24px 16px; font-weight: 400; }
html.tema-identidade .jt-painel-colunas { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 24px; }
html.tema-identidade .jt-painel-titulo { margin: 0 0 8px; font-size: 13px; font-weight: 800; color: var(--ti-cinza); }
html.tema-identidade .jt-painel ul { list-style: none; margin: 0; padding: 0; }
html.tema-identidade .jt-painel li a { display: flex; justify-content: space-between; gap: 10px; padding: 7px 8px; margin: 0 -8px; border-radius: 8px; color: var(--ti-tinta) !important; font-size: 14.5px; font-weight: 600; line-height: 1.3; text-decoration: none; }
html.tema-identidade .jt-painel li a:hover, html.tema-identidade .jt-painel li a:focus-visible { background: var(--ti-creme); color: var(--ti-indigo) !important; }
html.tema-identidade .jt-painel li a small { color: var(--ti-cinza); font-weight: 700; font-size: 12px; background: var(--ti-creme); border-radius: 999px; padding: 1px 8px; align-self: center; }
html.tema-identidade .jt-painel-todas { display: block; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ti-fio); font-weight: 800; color: var(--ti-indigo) !important; text-decoration: none !important; }
html.tema-identidade .jt-painel-todas:hover span { margin-left: 4px; }
html.tema-identidade .jt-conta { display: flex; align-items: center; gap: 6px; }
html.tema-identidade .jt-conta[hidden] { display: none; }
html.tema-identidade .jt-salvas { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 999px; color: #d6336c; }
html.tema-identidade .jt-salvas svg { fill: none; stroke: currentColor; stroke-width: 2; }
html.tema-identidade .jt-salvas:hover { background: #fdecf2; }
html.tema-identidade .jt-conta-botao { gap: 8px; padding: 5px 10px 5px 5px; border: 1px solid var(--ti-fio); border-radius: 999px; }
html.tema-identidade .jt-conta-botao:hover, html.tema-identidade .jt-suspenso.aberto .jt-conta-botao { border-color: var(--ti-indigo); }
html.tema-identidade .jt-avatar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 999px; background: var(--ti-indigo); color: var(--ti-amarelo); font-weight: 800; font-size: 15px; }
html.tema-identidade .jt-painel-conta { right: 0; width: 240px; padding: 10px 14px; }
/* submenus Ferramentas e Para empresas (jfe_tema_menu_grupos) */
html.tema-identidade .jt-painel-grupo { left: 0; width: 320px; padding: 10px; }
html.tema-identidade .jt-painel-grupo ul { list-style: none; margin: 0; padding: 0; }
html.tema-identidade .jt-painel-grupo a { display: flex; flex-direction: column; gap: 1px; padding: 9px 12px; border-radius: 10px; color: var(--ti-indigo) !important; text-decoration: none !important; box-shadow: none !important; }
html.tema-identidade .jt-painel-grupo a:hover, html.tema-identidade .jt-painel-grupo a:focus-visible { background: var(--ti-creme); }
html.tema-identidade .jt-painel-grupo strong { font-weight: 800; font-size: 15px; }
html.tema-identidade .jt-painel.jt-painel-grupo li a small { display: block; align-self: flex-start; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; color: var(--ti-cinza); font-weight: 400; font-size: 13px; text-align: left; }
html.tema-identidade .jt-painel-conta .jt-sair { border-top: 1px solid var(--ti-fio); margin-top: 6px; padding-top: 6px; }
html.tema-identidade .jt-painel-conta .jt-sair a { color: #a3341a !important; }
/* celular: "Vagas" abre a lista dentro do menu; a conta, os links e Sair */
html.tema-identidade .jt-celular-vagas summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; color: #ffffff; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 24px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
html.tema-identidade .jt-celular-vagas summary::-webkit-details-marker { display: none; }
html.tema-identidade .jt-celular-vagas summary::after { content: "▾"; font-size: 18px; transition: transform .2s; }
html.tema-identidade .jt-celular-vagas[open] summary::after { transform: rotate(180deg); }
html.tema-identidade .jt-celular-vagas div { display: flex; flex-direction: column; padding: 6px 0 10px 12px; border-bottom: 1px solid rgba(255, 255, 255, .14); }
html.tema-identidade .jt-menu-celular nav .jt-celular-vagas div a { font-family: var(--jt-fonte-corpo); font-weight: 600; font-size: 16px; padding: 8px 0; border: 0; color: #d9def0; }
html.tema-identidade .jt-celular-conta { display: flex; flex-direction: column; gap: 2px; }
html.tema-identidade .jt-celular-conta[hidden] { display: none; }
html.tema-identidade .jt-celular-conta .jt-painel-titulo { color: #aab3d8; }
html.tema-identidade .jt-celular-conta > a:not(.jt-botao) { color: #ffffff; font-weight: 700; padding: 8px 0; }
html.tema-identidade .jt-celular-conta .jt-botao { margin-top: 10px; }
@media (max-width: 1240px) { html.tema-identidade .jt-menu { gap: 0; } html.tema-identidade .jt-menu > a, html.tema-identidade .jt-menu-vagas { padding: 10px 9px; } }
@media (max-width: 1100px) { html.tema-identidade .jt-cabecalho .jt-wrap { min-height: 64px; } html.tema-identidade .jt-logo img { height: 32px; } }
html.tema-identidade .jt-menu > a, html.tema-identidade .jt-menu-vagas { white-space: nowrap; }
html.tema-identidade .jt-cabecalho .jt-wrap { gap: 20px; }
@media (max-width: 1320px) { html.tema-identidade .jt-menu { font-size: 15px; } html.tema-identidade .jt-logo img { height: 36px; } }
html.tema-identidade .jt-celular-vagas .jt-painel-titulo { margin: 12px 0 2px; color: #aab3d8; }
html.tema-identidade .jt-menu-celular nav .jt-celular-vagas div a.jt-celular-todas { color: var(--ti-amarelo); font-weight: 800; }
/* entrar/cadastrar (ou a conta) separados do menu: linha vertical e botões, como o logo é separado (07/11/2026) */
html.tema-identidade .jt-acoes { gap: 10px; margin-left: 4px; padding-left: 24px; border-left: 1px solid var(--ti-fio); align-self: stretch; }
html.tema-identidade .jt-acoes .jt-entrar { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1.5px solid var(--ti-indigo); border-radius: 8px; color: var(--ti-indigo) !important; font-weight: 800; text-decoration: none !important; white-space: nowrap; }
html.tema-identidade .jt-acoes .jt-entrar:hover { background: var(--ti-indigo); color: #ffffff !important; }
@media (max-width: 1320px) { html.tema-identidade .jt-acoes { padding-left: 18px; } html.tema-identidade .jt-acoes .jt-entrar { padding: 0 12px; } }
/* menu: no hover, só o fundo creme; a barra amarela marca a página atual e o "Vagas" com o painel aberto (07/11/2026) */
html.tema-identidade .jt-menu > a:focus-visible, html.tema-identidade .jt-menu-vagas:focus-visible { background: var(--ti-creme); }
html.tema-identidade .jt-suspenso-vagas.aberto .jt-menu-vagas { background: var(--ti-creme); box-shadow: inset 0 -3px 0 var(--ti-amarelo); border-radius: 10px 10px 0 0; }
html.tema-identidade .jt-menu > a.atual:hover, html.tema-identidade .jt-menu-vagas.atual:hover { box-shadow: inset 0 -3px 0 var(--ti-amarelo); border-radius: 10px 10px 0 0; }

/* ---- entrar e recuperar a senha (07/11/2026, app/views/temas/identidade/modais/) ------------------------- */
html.tema-identidade .jt-modal .modal-dialog { width: auto; max-width: 440px; margin: 40px auto; padding: 0 16px; }
html.tema-identidade .jt-modal .modal-dialog.jt-modal-largo { max-width: 520px; }
html.tema-identidade .jt-modal .modal-content { position: relative; border: 0; border-radius: 22px; box-shadow: 0 30px 70px -20px rgba(20, 26, 60, .55); padding: 28px 28px 24px; text-align: left; background: #ffffff; }
html.tema-identidade .modal-backdrop.in { opacity: .6; background: #141a3c; }
html.tema-identidade .jt-modal-fechar { position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 0; border-radius: 999px; background: transparent; color: var(--ti-cinza); cursor: pointer; }
html.tema-identidade .jt-modal-fechar:hover { background: var(--ti-creme); color: var(--ti-indigo); }
html.tema-identidade .jt-modal-topo { display: flex; align-items: center; justify-content: space-between; margin: -10px -10px 10px 0; min-height: 40px; }
html.tema-identidade .jt-modal-topo .jt-modal-fechar { position: static; }
html.tema-identidade .jt-modal-voltar { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; font-size: 14px; color: var(--ti-indigo) !important; text-decoration: none !important; padding: 6px 10px 6px 4px; margin-left: -4px; border-radius: 8px; }
html.tema-identidade .jt-modal-voltar:hover { background: var(--ti-creme); }
html.tema-identidade .jt-modal-titulo { margin: 0 0 6px; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 28px; line-height: 1.15; color: var(--ti-indigo); padding-right: 36px; }
html.tema-identidade .jt-modal-topo + .jt-modal-selo + .jt-modal-titulo { padding-right: 0; }
html.tema-identidade .jt-modal-sub { margin: 0 0 18px; color: var(--ti-cinza); font-size: 15.5px; line-height: 1.5; }
html.tema-identidade .jt-modal-selo { display: inline-block; margin-bottom: 10px; padding: 3px 12px; border-radius: 999px; background: #fff3d6; color: #8a5a00; font-size: 13px; font-weight: 800; }
/* 1º passo: dois cartões */
html.tema-identidade .jt-login-escolha { display: flex; flex-direction: column; gap: 12px; margin: 6px 0 18px; }
html.tema-identidade .jt-login-cartao { display: flex; align-items: center; gap: 16px; padding: 16px 18px; border: 1.5px solid var(--ti-fio); border-radius: 16px; background: #ffffff; color: var(--ti-tinta) !important; text-decoration: none !important; transition: border-color .15s, box-shadow .15s, transform .15s; }
html.tema-identidade .jt-login-cartao:hover, html.tema-identidade .jt-login-cartao:focus-visible { border-color: var(--ti-indigo); box-shadow: 0 10px 24px -14px rgba(28, 42, 99, .5); transform: translateY(-1px); }
html.tema-identidade .jt-login-icone { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 14px; background: var(--ti-amarelo); color: var(--ti-indigo); }
html.tema-identidade .jt-login-texto { flex: 1; display: flex; flex-direction: column; gap: 2px; }
html.tema-identidade .jt-login-texto strong { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 20px; color: var(--ti-indigo); }
html.tema-identidade .jt-login-texto small { font-size: 14px; color: var(--ti-cinza); line-height: 1.4; }
html.tema-identidade .jt-login-seta { flex-shrink: 0; color: var(--ti-indigo); }
html.tema-identidade .jt-modal-rodape { margin: 16px 0 0; padding-top: 16px; border-top: 1px solid var(--ti-fio); text-align: center; color: var(--ti-cinza); font-size: 15px; }
html.tema-identidade .jt-modal-rodape a { font-weight: 800; color: var(--ti-indigo) !important; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 2px; text-underline-offset: 3px; }
html.tema-identidade .jt-modal-banner { display: block; margin-top: 16px; }
html.tema-identidade .jt-modal-banner img { display: block; width: 100%; height: auto; border-radius: 12px; }
/* formulário */
html.tema-identidade .jt-form { display: flex; flex-direction: column; margin: 14px 0 0; }
html.tema-identidade .jt-form label { margin: 0 0 6px; font-size: 14px; font-weight: 800; color: var(--ti-tinta); }
html.tema-identidade .jt-form-linha { display: flex; justify-content: space-between; align-items: baseline; margin-top: 14px; }
html.tema-identidade .jt-form-linha a { font-size: 13.5px; font-weight: 700; color: var(--ti-indigo) !important; }
html.tema-identidade .jt-form input[type=text], html.tema-identidade .jt-form input[type=password], html.tema-identidade .jt-form input[type=email] {
    display: block; width: 100%; height: 50px; margin: 0; padding: 0 14px !important; border: 1.5px solid var(--jt-borda) !important; border-radius: 12px !important;
    background: #ffffff !important; background-image: none !important; font-size: 16px; color: var(--ti-tinta); box-shadow: none; box-sizing: border-box; }
html.tema-identidade .jt-form input:focus { outline: none; border-color: var(--ti-indigo) !important; box-shadow: 0 0 0 3px rgba(254, 195, 69, .45) !important; }
html.tema-identidade .jt-form input::placeholder { color: #a3a9b8; }
html.tema-identidade .jt-senha { position: relative; }
html.tema-identidade .jt-form-senhas .jt-senha + label { margin-top: 14px; }   /* alterar a senha: três campos */
html.tema-identidade .jt-senha input { padding-right: 52px !important; }
html.tema-identidade .jt-senha-ver { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 42px; border: 0; border-radius: 10px; background: transparent; color: var(--ti-cinza); cursor: pointer; }
html.tema-identidade .jt-senha-ver:hover { color: var(--ti-indigo); background: var(--ti-creme); }
html.tema-identidade .jt-form .jt-form-enviar { margin-top: 18px; height: 52px; width: 100%; border: 0; border-radius: 12px; background: var(--ti-amarelo); color: var(--ti-indigo); font-family: inherit; font-size: 17px; font-weight: 800; cursor: pointer; text-transform: none; }
html.tema-identidade .jt-form .jt-form-enviar:hover { background: var(--ti-amarelo-claro); }
html.tema-identidade .jt-form .jfe-turnstile { margin: 12px 0 0 !important; }
html.tema-identidade .jt-modal .jfe-google { margin: 16px 0 0 !important; }
html.tema-identidade .jt-modal .jfe-google a { width: 100%; justify-content: center; height: 48px; border-radius: 12px !important; border: 1.5px solid var(--jt-borda) !important; }
html.tema-identidade .jt-modal-ajuda { margin: 16px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--ti-creme); color: var(--ti-cinza); font-size: 13.5px; line-height: 1.5; }
html.tema-identidade .jt-modal-ajuda a { color: var(--ti-indigo) !important; font-weight: 700; }
@media (max-width: 480px) {
    html.tema-identidade .jt-modal .modal-dialog { margin: 16px auto; padding: 0 12px; }
    html.tema-identidade .jt-modal .modal-content { padding: 22px 18px 18px; border-radius: 18px; }
    html.tema-identidade .jt-modal-titulo { font-size: 24px; }
    html.tema-identidade .jt-login-cartao { padding: 14px; gap: 12px; }
    html.tema-identidade .jt-login-icone { width: 44px; height: 44px; }
    html.tema-identidade .jt-login-texto strong { font-size: 18px; }
}

/* ---- página indisponível / não encontrada (07/11/2026, app/views/site/indisponivel.php) ------------------ */
html.tema-identidade .jt-indisponivel { margin: 64px auto 80px !important; }
html.tema-identidade .jt-indisponivel-icone { display: inline-flex; align-items: center; justify-content: center; width: 84px; height: 84px; border-radius: 24px; background: var(--ti-amarelo); color: var(--ti-indigo); margin-bottom: 18px; }
html.tema-identidade .jt-indisponivel h1 { font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 38px !important; color: var(--ti-indigo); }
html.tema-identidade .jt-indisponivel-texto { color: var(--ti-cinza); line-height: 1.55; }
html.tema-identidade .jt-indisponivel-busca { display: flex; gap: 8px; margin: 26px auto 0; max-width: 560px; }
html.tema-identidade .jt-indisponivel-busca input { flex: 1; min-width: 0; height: 52px; padding: 0 16px; border: 1.5px solid var(--jt-borda); border-radius: 12px; font-size: 16px; }
html.tema-identidade .jt-indisponivel-busca input:focus { outline: none; border-color: var(--ti-indigo); box-shadow: 0 0 0 3px rgba(254, 195, 69, .45); }
html.tema-identidade .jt-indisponivel-busca button { height: 52px; padding: 0 22px; border: 0; border-radius: 12px; background: var(--ti-amarelo); color: var(--ti-indigo); font-weight: 800; font-size: 16px; cursor: pointer; }
html.tema-identidade .jt-indisponivel-acoes { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 18px; }
html.tema-identidade .jt-indisponivel-principal { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px !important; border: 0 !important; border-radius: 10px !important; background: var(--ti-indigo) !important; color: #ffffff !important; font-weight: 800; }
html.tema-identidade .jt-indisponivel-link { font-weight: 800; color: var(--ti-indigo) !important; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 2px; text-underline-offset: 3px; }
@media (max-width: 560px) { html.tema-identidade .jt-indisponivel-busca { flex-direction: column; } html.tema-identidade .jt-indisponivel h1 { font-size: 30px !important; } }

/* ---- alertas do site (SweetAlert, assets/js/sweetalert2.min.js) com a identidade (07/11/2026) ---------- */
html.tema-identidade .sweet-overlay { background-color: rgba(20, 26, 60, .6) !important; }
html.tema-identidade .sweet-alert { border-radius: 22px !important; padding: 28px 28px 24px !important; box-shadow: 0 30px 70px -20px rgba(20, 26, 60, .55) !important; font-family: var(--jt-fonte-corpo) !important; width: 440px !important; max-width: calc(100vw - 32px); margin-left: -220px !important; left: 50% !important; box-sizing: border-box; }
html.tema-identidade .sweet-alert h2 { font-family: var(--jt-fonte-titulo) !important; font-weight: 600 !important; font-size: 24px !important; color: var(--ti-indigo) !important; margin: 14px 0 6px !important; }
html.tema-identidade .sweet-alert p { font-size: 16px !important; line-height: 1.55 !important; color: var(--ti-tinta) !important; }
html.tema-identidade .sweet-alert .sa-button-container, html.tema-identidade .sweet-alert .sa-confirm-button-container { display: inline-flex; gap: 10px; }
html.tema-identidade .sweet-alert button { min-width: 120px; height: 48px; margin: 18px 4px 0 !important; padding: 0 26px !important; border: 0 !important; border-radius: 12px !important; background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; font-family: inherit !important; font-size: 16px !important; font-weight: 800 !important; box-shadow: none !important; }
html.tema-identidade .sweet-alert button:hover { background: var(--ti-amarelo-claro) !important; }
html.tema-identidade .sweet-alert button.cancel { background: #ffffff !important; border: 1.5px solid var(--jt-borda) !important; color: var(--ti-indigo) !important; }
html.tema-identidade .sweet-alert button.cancel:hover { border-color: var(--ti-indigo) !important; }
html.tema-identidade .sweet-alert input { border-radius: 12px !important; border: 1.5px solid var(--jt-borda) !important; height: 48px !important; }
@media (max-width: 480px) { html.tema-identidade .sweet-alert { margin-left: 0 !important; left: 16px !important; right: 16px; width: auto !important; } }

/* ---- aviso de cookies (07/11/2026, app/views/site/rodape.php #politicas): cartão no canto, não faixa ------ */
html.tema-identidade #politicas { width: auto !important; max-width: 420px; left: 20px !important; right: auto; bottom: 20px !important; padding: 20px 20px 16px !important; border-radius: 18px; background: #ffffff !important; color: var(--ti-tinta) !important; border: 1px solid var(--ti-fio); box-shadow: 0 24px 60px -18px rgba(20, 26, 60, .45); font-size: 14px; }
html.tema-identidade #politicas::before { content: "Sua privacidade"; display: block; margin-bottom: 6px; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 19px; color: var(--ti-indigo); }
html.tema-identidade #politicas span { display: block !important; width: auto !important; padding: 0 !important; line-height: 1.5 !important; color: var(--ti-cinza); }
html.tema-identidade #politicas a { color: var(--ti-indigo) !important; font-weight: 700; }
html.tema-identidade #politicas button { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; height: 44px; margin: 14px 8px 0 0 !important; padding: 0 18px !important; border: 0 !important; border-radius: 10px; background: var(--ti-amarelo) !important; color: var(--ti-indigo) !important; font-weight: 800; font-size: 14.5px; }
html.tema-identidade #politicas button.secundario { background: #ffffff !important; border: 1.5px solid var(--jt-borda) !important; color: var(--ti-indigo) !important; }
html.tema-identidade #politicas button:hover { filter: brightness(.97); }
@media (max-width: 560px) {
    html.tema-identidade #politicas { left: 12px !important; right: 12px; bottom: 12px !important; max-width: none; text-align: left !important; }
    html.tema-identidade #politicas span { text-align: left !important; font-size: 13.5px; }
    html.tema-identidade #politicas button { width: calc(50% - 8px) !important; margin: 14px 0 0 !important; padding: 0 10px !important; font-size: 14px; }
    html.tema-identidade #politicas button + button { margin-left: 8px !important; }
}

/* Teste das fontes do portal de referência (?fontes=novas; app/Suporte/tema.php): títulos em Bevan, subtítulos em
   Yeseva One, texto corrido continua em Nunito Sans (as duas são fontes de destaque, ruins para parágrafos). */
html.tema-identidade.fontes-novas { --jt-fonte-titulo: 'Bevan', 'Fredoka', serif; --jt-titulo-peso: 400; }
html.tema-identidade.fontes-novas h1, html.tema-identidade.fontes-novas .ti-chamada h1 { font-family: 'Bevan', 'Fredoka', serif !important; font-weight: 400 !important; letter-spacing: 0; }
html.tema-identidade.fontes-novas h2, html.tema-identidade.fontes-novas h3 { font-family: 'Yeseva One', 'Fredoka', serif !important; font-weight: 400 !important; letter-spacing: 0; }
html.tema-identidade .fontes-teste { position: fixed; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 1040; padding: 8px 14px; border-radius: 999px;
    background: #24325b; color: #fff !important; font: 700 13px/1.3 'Nunito Sans', sans-serif; text-decoration: none !important; box-shadow: 0 4px 14px rgba(0, 0, 0, .25); max-width: calc(100vw - 32px); text-align: center; }

/* =============================================================================================
 * 11/11/2026: celular mais curto e recrutamento repaginado
 * ============================================================================================= */

/* ---- recrutamento e seleção (app/views/temas/identidade/site/home-recrutamento.php) ----------------------- */
html.tema-identidade .ti-recrutamento { background: #ffffff; padding: 48px 0 8px; }
html.tema-identidade .ti-recrutamento-cartao { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 32px; align-items: center; padding: 32px 36px; border-radius: 16px; background: var(--ti-indigo); color: #ffffff; }
html.tema-identidade .ti-recrutamento-chapeu { margin: 0 0 6px; color: var(--ti-amarelo); font-weight: 800; font-size: 14px; }
html.tema-identidade .ti-recrutamento h2 { margin: 0 0 10px; font-family: var(--jt-fonte-titulo); font-weight: 600; font-size: 30px; line-height: 1.15; color: #ffffff; }
html.tema-identidade .ti-recrutamento-texto > p:not([class]) { margin: 0; color: #d9def0; font-size: 16px; line-height: 1.55; }
html.tema-identidade .ti-recrutamento-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 20px 0 0; }
html.tema-identidade .ti-recrutamento-botao { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; border-radius: 10px; background: var(--ti-amarelo); color: var(--ti-indigo) !important; font-weight: 800; font-size: 16px; text-decoration: none !important; }
html.tema-identidade .ti-recrutamento-botao:hover, html.tema-identidade .ti-recrutamento-botao:focus { background: var(--ti-amarelo-claro); }
html.tema-identidade .ti-recrutamento-link { color: #ffffff !important; font-weight: 800; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 2px; text-underline-offset: 4px; }
html.tema-identidade .ti-recrutamento-etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; counter-reset: tr; }
html.tema-identidade .ti-recrutamento-etapas li { counter-increment: tr; position: relative; padding: 14px 16px 14px 54px; border-radius: 12px; background: rgba(255, 255, 255, .08); display: flex; flex-direction: column; gap: 2px; }
html.tema-identidade .ti-recrutamento-etapas li::before { content: counter(tr); position: absolute; left: 14px; top: 14px; width: 28px; height: 28px; border-radius: 50%; background: var(--ti-amarelo); color: var(--ti-indigo); font-weight: 800; font-size: 14px; display: flex; align-items: center; justify-content: center; }
html.tema-identidade .ti-recrutamento-etapas strong { font-size: 16px; color: #ffffff; }
html.tema-identidade .ti-recrutamento-etapas span { font-size: 14px; line-height: 1.45; color: #d9def0; }
html.tema-identidade .ti-perfil li a[href="#recrutamento"] { color: var(--ti-indigo); font-weight: 700; text-decoration: underline; text-decoration-color: var(--ti-amarelo); text-decoration-thickness: 2px; text-underline-offset: 3px; }
@media (max-width: 900px) {
    html.tema-identidade .ti-recrutamento-cartao { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 26px 22px; }
    html.tema-identidade .ti-recrutamento h2 { font-size: 25px; }
}
@media (max-width: 560px) {
    html.tema-identidade .ti-recrutamento { padding-top: 32px; }
    html.tema-identidade .ti-recrutamento-etapas { gap: 8px; }
    html.tema-identidade .ti-recrutamento-etapas li { padding: 10px 10px 10px 44px; justify-content: center; min-height: 48px; }
    html.tema-identidade .ti-recrutamento-etapas li::before { left: 10px; top: 50%; margin-top: -13px; width: 26px; height: 26px; font-size: 13px; }
    html.tema-identidade .ti-recrutamento-etapas strong { font-size: 14px; line-height: 1.25; }
    html.tema-identidade .ti-recrutamento-etapas span { display: none; }
    html.tema-identidade .ti-recrutamento-acoes { flex-direction: column; align-items: stretch; text-align: center; }
    html.tema-identidade .ti-recrutamento-botao { justify-content: center; }
}

/* ---- topo da home no celular: a primeira vaga mais perto (antes ~2.300 px até as áreas) --------------------- */
@media (max-width: 700px) {
    /* candidato e empresa: uma linha cada, sem a frase de apoio */
    html.tema-identidade .ti-acesso { margin-top: 18px; }
    html.tema-identidade .ti-acesso > div { display: flex !important; align-items: center; flex-wrap: nowrap; gap: 8px; padding: 12px 0 !important; }
    html.tema-identidade .ti-acesso strong { flex: 1 1 auto; min-width: 0; font-size: 18px; }
    html.tema-identidade .ti-acesso span { display: none; }
    html.tema-identidade .ti-acesso .ti-botao { flex: none; min-height: 40px; padding: 0 14px !important; font-size: 15px; }
    /* peça da campanha um pouco menor */
    html.tema-identidade .ti-campanha { max-width: 320px; margin: 0 auto; }
    /* números: uma faixa de arrastar */
    html.tema-identidade .jm-numeros ul { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; padding: 0 !important; }
    html.tema-identidade .jm-numeros li { flex: 0 0 auto; min-width: 42%; scroll-snap-align: start; border-left: 1px solid var(--ti-fio) !important; border-top: 0 !important; }
    html.tema-identidade .jm-numeros li:first-child { border-left: 0 !important; }
    html.tema-identidade .jm-numeros a { padding: 14px 16px !important; }
    /* grupo do WhatsApp: título e botão, sem a frase */
    html.tema-identidade main.layout-portal > .container-md > .ti-whatsapp-area.container { margin-top: 20px !important; }
    html.tema-identidade .ti-whatsapp { flex-wrap: nowrap !important; padding: 12px 14px !important; gap: 12px !important; }
    html.tema-identidade .ti-whatsapp-icone { width: 40px !important; height: 40px !important; }
    html.tema-identidade .ti-whatsapp-icone svg { width: 22px; height: 22px; }
    html.tema-identidade .ti-whatsapp-texto { flex: 1 1 auto !important; }
    html.tema-identidade .ti-whatsapp-texto strong { font-size: 16px !important; line-height: 1.2; }
    html.tema-identidade .ti-whatsapp-texto span { display: none; }
    html.tema-identidade .ti-whatsapp-botao { width: auto !important; min-height: 40px !important; padding: 0 14px !important; font-size: 14px; }
    /* para quem procura / contrata: mais justo */
    html.tema-identidade .ti-perfis { margin-top: 20px; }
    html.tema-identidade .ti-perfis-grade { padding-top: 24px; }
    html.tema-identidade .ti-perfil { gap: 10px; padding-bottom: 24px; }
    html.tema-identidade .ti-perfil h2 { font-size: 23px; }
    html.tema-identidade .ti-perfil ul { gap: 6px; }
    html.tema-identidade .ti-perfil li { font-size: 15px; line-height: 1.4; }
}
