﻿/* Desenvolvido por Luiz Fernando de Oliveira Matos */
:root {
  --topbar-height: 40px; /* Aproxima a altura real da topbar */
  --anchor-offset: 200px; /* Ajuste a altura do scroll para ancoras */
}

@media (max-width: 720px) {
  :root {
    --anchor-offset: 120px; /* Offset menor no mobile */
  }
}

html {
  font-family: 'Open Sans', sans-serif;
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Open Sans', sans-serif;
}

button,
input,
select,
textarea {
  font-family: 'Open Sans', sans-serif;
}

/* WhatsApp floating button + modal */
.whatsapp-fab {
  position: fixed;
  right: 18px;
  bottom: 24px;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: #25d366;
  color: #ffffff;
  border: none;
  display: grid;
  place-items: center;
  font-size: 30px;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.22);
  z-index: 1600;
  cursor: pointer;
}

.whatsapp-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f97316;
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  display: grid;
  place-items: center;
}

.whatsapp-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 1550;
}

.whatsapp-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.whatsapp-modal {
  position: fixed;
  inset: auto;
  right: 18px;
  bottom: calc(24px + 62px + 12px);
  left: auto;
  top: auto;
  display: block;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 1560;
}

.whatsapp-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.whatsapp-modal-card {
  width: min(280px, 86vw);
  background: #f1ebe4;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.25);
}

.whatsapp-modal-header {
  background: #2f7f74;
  color: #ffffff;
  padding: 10px 12px;
  font-weight: 700;
}

.whatsapp-modal-header p {
  margin: 0;
  font-size: 13px;
}

.whatsapp-modal-body {
  padding: 6px 12px 10px;
  display: grid;
  gap: 6px;
}

.whatsapp-option {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 4px;
  text-decoration: none;
  color: #374151;
  border-bottom: 1px solid rgba(55, 65, 81, 0.12);
}

.whatsapp-option:last-child {
  border-bottom: 0;
}

.whatsapp-option-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #25d366;
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 16px;
}

.whatsapp-option-text {
  display: grid;
  gap: 2px;
}

.whatsapp-option-label {
  font-size: 10px;
  color: #6b7280;
  font-weight: 700;
}

.whatsapp-option-strong {
  font-size: 12px;
  font-weight: 800;
  color: #374151;
}

.whatsapp-close {
  position: absolute;
  top: 4px;
  right: 6px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.25);
  color: #ffffff;
  font-size: 16px;
  cursor: pointer;
}

.mobile-info-fab,
.mobile-info-backdrop,
.mobile-info-panel {
  display: none;
}

.mobile-info-fab {
  position: fixed;
  right: 18px;
  bottom: 100px;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(11, 87, 162, 0.6);
  background: rgba(11, 87, 162, 0.78);
  color: #ffffff;
  place-items: center;
  font-size: 20px;
  backdrop-filter: blur(6px);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18);
  z-index: 1500;
  cursor: pointer;
}

.mobile-info-fab.is-open {
  background: #f2c94c;
  border-color: #f2c94c;
  color: #0b57a2;
}

.mobile-info-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 1400;
}

.mobile-info-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.mobile-info-panel {
  position: fixed;
  right: 16px;
  bottom: 160px;
  width: min(320px, 86vw);
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 20px 36px rgba(15, 23, 42, 0.2);
  padding: 14px 16px;
  gap: 12px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 1450;
}

.mobile-info-panel.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.mobile-info-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: #9ca3af;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0;
}

.mobile-info-block {
  display: grid;
  gap: 10px;
}

.mobile-info-card {
  background: #f0f6ff;
  border-radius: 16px;
  padding: 10px 12px;
}

.mobile-info-item {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #0b57a2;
  font-weight: 700;
  font-size: 14px;
}

.mobile-info-item i {
  font-size: 18px;
}

.mobile-info-tag {
  margin-left: auto;
  background: #e0ecfb;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 999px;
}

.mobile-info-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.mobile-info-social {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: #2f2f2f;
  color: #ffffff;
  display: grid;
  place-items: center;
  text-decoration: none;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.18);
}

.mobile-info-social i {
  font-size: 18px;
}

.mobile-info-flags {
  display: flex;
  gap: 10px;
  align-items: center;
}

.mobile-info-flag {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  color: #111827;
  background: #f3f4f6;
  padding: 6px 10px;
  border-radius: 999px;
}

.mobile-info-flag img {
  width: 22px;
  height: 14px;
  border-radius: 999px;
  object-fit: cover;
}

.scroll-top-btn {
  position: fixed;
  left: 50%;
  bottom: 52px;
  width: 40px;
  height: 40px;
  border-radius: 9px;
  border: 2px solid rgba(17, 24, 39, 0.85);
  background: rgba(255, 255, 255, 0.35);
  color: #0b57a2;
  display: grid;
  place-items: center;
  font-size: 16px;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 6px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
  backdrop-filter: blur(6px);
  z-index: 1500;
  cursor: pointer;
}

.scroll-top-btn.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.scroll-top-btn:hover,
.scroll-top-btn:active {
  background: #f2c94c;
  border-color: #f2c94c;
  color: #0b57a2;
}

.scroll-top-btn:focus-visible {
  outline: 2px solid #005fa9;
  outline-offset: 2px;
}

main {
  margin-top: 0;
}

/* Scrollbar global - sem setas */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #e6eef5;
}

::-webkit-scrollbar-thumb {
  background: #005fa9;
  border-radius: 999px;
  border: 2px solid #e6eef5;
}

::-webkit-scrollbar-thumb:hover {
  background: #004c87;
}

::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #005fa9 #e6eef5;
}

/* Barra azul de cima com telefones, redes e endereço */
.topbar {
  font-family: 'Open Sans'; /* Fonte personalizada */
  display: flex;              /* Coloca os itens lado a lado */
  justify-content: space-between; /* Afasta os grupos para as extremidades */
  align-items: center;        /* Centraliza verticalmente */
  background: #005FA9;        /* Fundo azul */
  color: #fff;                /* Texto branco */
  padding: 11px 20px;          /* Espaçamento interno */
  font-size: 14px;            /* Tamanho do texto */
  position: sticky;           /* Mantem a faixa no topo ao rolar */
  top: 0;
  z-index: 1100;              /* Acima do menu */
}

/* Grupos esquerdo, central e direito dentro da topbar */
.topbar-left,
.topbar-center,
.topbar-right {
  display: flex;   /* Coloca itens do grupo na mesma linha */
  align-items: center;
  gap: 12px;       /* Espaço entre os itens do grupo */
}

/* Estilo dos links e ícones no meio da barra */
.topbar-center a,
.topbar-center span {
  color: #fff;           /* Mantém tudo branco no fundo azul */
  text-decoration: none; /* Remove sublinhado dos links */
  font-weight: 600;      /* Deixa o texto um pouco mais forte */
}

/* Pequeno espaço entre o ícone de telefone e o número */
.phone .icon {
  margin-right: 4px;
}

.phone a {
  text-decoration: none;   /* remove o sublinhado */
  color: white;            /* coloca a cor que você quiser */
}

/* Menu branco abaixo da barra azul */
.menu {
  display: flex;                    /* Itens lado a lado */
  justify-content: space-between;   /* Logo à esquerda, links no meio, selos à direita */
  align-items: center;              /* Centraliza verticalmente */
  padding: 12px 16px;               /* Espaçamento interno */
  background: #fff;                 /* Fundo branco */
  color: #005FA9;                   /* Texto azul para combinar com a marca */
  border-bottom: 2px solid #e6e6e6; /* Linha sutil separando do conteúdo abaixo */
  position: sticky;                 /* Fica fixo ao rolar, logo abaixo da topbar */
  top: var(--topbar-height);
  z-index: 1000;
  transition: padding 0.25s ease,   /* animação suave ao encolher */
              box-shadow 0.25s ease,
              background-color 0.25s ease;
}

/* Logo à esquerda */
.menu > a {
  order: 1;
}

/* Logo ou nome da instituição */
.logo {
  font-weight: 800;      /* Mais grosso para destaque */
  letter-spacing: 1px;   /* Espaço entre letras para melhorar leitura */
}

/* Lista de links do menu */
.menu-links {
  font-family: 'Open Sans'; /* Fonte personalizada */
  list-style: none; /* Remove marcadores padrão */
  display: flex;    /* Coloca os links na mesma linha */
  gap: 25px;        /* Espaço entre cada link */
  margin: 0 0 0 30px; /* Afasta os links do logo */
  padding: 0;
  order: 2;
}

/* Estilo dos links individuais */
.menu-links a {
  text-decoration: none;  /* Sem sublinhado */
  color: black;         /* Azul da marca */
  font-weight: 700;       /* Negrito moderado */
  padding: 6px 10px;      /* Área de clique maior */
  border-radius: 4px;     /* Cantos levemente arredondados */
}

/* Efeito ao passar o mouse nos links */
.menu-links a:hover {
  color: #005FA9; /* Muda a cor do texto ao passar o mouse */

}

/* Mantem referencia para a linha ativa */
.menu-links > li > a {
  position: relative;
}

.menu-links > li > a.is-active {
  color: #005FA9;
}

.menu-links > li > a.is-active::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: -8px;
  height: 3px;
  background: #005FA9;
  border-radius: 999px;
}

/* Dropdown Menu */
 .dropdown {
  position: relative;
  display: inline-block;
  overflow: visible; 
}

.dropdown-content {
position: absolute;
top: 100%;
left: 0;
background: white;
min-width: max-content;  
width: auto;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
border-radius: 0 0 8px 8px;  /* arredonda só os cantos inferiores */
opacity: 0;
transform: translateY(-10px);
transition: all 0.3s;
pointer-events: none;
border-radius: 0.5rem;
z-index: 999;
list-style: none;
white-space: nowrap; 
padding: 6px 0;
overflow: visible;
}

.dropdown:hover .dropdown-content {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.dropdown-content a {
  color: #374151;
  padding: 0.5rem 1rem;
  text-decoration: none;
  display: block;
}

.dropdown-content::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;              /* fica na base, dentro da caixa */
  height: 4px;            /* grossura */
  background: #005FA9;
  border-radius: 0 0 8px 8px;  /* mesmos cantos inferiores */
  box-shadow: 0 6px 14px rgba(255,122,45,0.12);
  pointer-events: none;
}

.dropdown-content a:hover {
  background: #f3f4f6;
}


/* Área onde ficam os selos à direita */
.selos {
  display: flex; /* Coloca selos lado a lado */
  gap: 15px;     /* Espaço entre selos */
  align-items: center;
  order: 3;
  margin-left: auto;
}

/* Estilo simples dos selos (substitua por imagens depois) */
.selo {
  border-radius: 4px;        /* Cantos arredondados */
  font-size: 12px;           /* Texto menor */
}

/*Fontes variáveis Open Sans*/
@font-face {
  font-family: 'Open Sans';
  src: url('../assets/fonts/OpenSans-VariableFont_wdth\,wght.ttf') format('truetype');
  font-weight: 100 900;  /* intervalos suportados */
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../assets/fonts/OpenSans-Italic-VariableFont_wdth\,wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
}




.hero-carousel {
  position: relative;                  /* Referência para posicionar elementos filhos absolutos (setas, dots etc.) */
  width: 100%;                         /* Ocupa toda a largura disponível */
  min-height: 620px;                   /* Altura mínima do carrossel */
  max-height: 760px;                   /* Altura máxima do carrossel (para não esticar demais) */
  overflow: hidden;                    /* Esconde qualquer coisa que sair da área do carrossel (slides, imagens) */
  background: #005FA9;                 /* Cor de fundo azul padrão */
  color: white;                        /* Cor padrão do texto dentro do carrossel */
  font-family: 'Open Sans', sans-serif;/* Fonte padrão do conteúdo */
}

.hero-track {
  display: grid;                       /* Usa grid para organizar os slides */
  grid-auto-flow: column;              /* Cada item é colocado ao lado do outro na horizontal (colunas) */
  grid-auto-columns: 100%;             /* Cada slide ocupa 100% da largura do carrossel */
  transition: transform 0.6s ease;     /* Transição suave quando o track é movido (no JS) */
  position: relative;                  /* Mantém o fundo dentro da área do carrossel */
}

.hero-slide {
  position: relative;                  /* Base para posicionar elementos internos relativos ao slide */
  overflow: hidden;                    /* Garante que o background fique dentro do slide */
  display: flex;                       /* Layout em flexbox para dividir texto e imagem */
  align-items: stretch;                /* Faz os filhos (texto/imagem) esticarem na altura do slide */
  opacity: 0;                          /* Começa invisível por padrão */
  pointer-events: none;                /* Não recebe cliques enquanto estiver invisível */
  transition: opacity 0.5s ease;       /* Fade in/out suave ao ativar/desativar o slide */
}

.hero-slide.active {
  opacity: 1;                          /* Slide ativo fica visível */
  pointer-events: auto;                /* Passa a receber cliques normalmente */
}

.hero-bg {
  position: absolute;                  /* Fica "colado" dentro do slide, atrás do conteúdo */
  inset: 0;                            /* top/right/bottom/left: 0 - ocupa todo o slide */
  width: 100%;                         /* Garante ocupação total em largura */
  height: 100%;                        /* Garante ocupação total em altura */
  object-fit: cover;                   /* Cobre toda a  rea, cortando o excesso sem distorcer */
  transform: scale(1.08);
  transform-origin: center;
  z-index: 0;                          /* Fica atrás do texto/imagem do slide */
}

.hero-content {
  position: relative;                  /* Faz o conteúdo ficar acima do fundo */
  z-index: 1;
  width: min(1200px, 100%);            /* Largura máxima 1200px, mas nunca maior que 100% da tela */
  margin: 0 auto;                      /* Centraliza o conteúdo na horizontal */
  display: grid;                       /* Usa grid para dividir em duas colunas (texto e figura) */
  grid-template-columns: 1.35fr 0.65fr;  /* Coluna do texto um pouco maior que a da imagem */
  gap: 24px;                           /* Espaço entre as colunas */
  padding: 0 32px 48px;               /* Espaçamento interno: top/right/bottom */
  align-items: center;                 /* Alinha verticalmente no centro */
  margin-top: 80px;                   /* Move o conteúdo para cima */
}

.hero-text h1 {
  margin: 0 0 16px;                    /* Remove margem superior, deixa só margem embaixo */
  font-size: clamp(38px, 4.5vw, 52px);   /* Fonte responsiva entre 38px e 52px, usando 4.5vw como base */
  line-height: 1.05;                   /* Espaçamento entre linhas mais compacto */
  font-weight: 800;                    /* Bem negrito */
  color: white;                        /* Título em branco */
}

/* Variação de cor para partes do título (ex: palavras em amarelo) */
.title {
  color: #f1f2f7;                      /* Branco levemente suave */
  font-weight: 700;
}

.gold {
  color: #ffd34f;                      /* Amarelo/dourado para destacar palavras */
}

.hero-text .subcopy {
  margin: 0 0 22px;                    /* Margem apenas embaixo */
  font-size: clamp(18px, 2vw, 22px);   /* Tamanho responsivo entre 18px e 22px */
  color: white;                        /* Subtítulo em branco */
  max-width: 520px;                    /* Limita largura do texto para melhor leitura */
}

.hero-cta {
  display: flex;                       /* Coloca os botões em linha */
  gap: 12px;                           /* Espaçamento entre os botões */
  flex-wrap: wrap;                     /* Quebra linha se não couber na horizontal */
}

.btn-primary {
  display: inline-block;               /* Permite definir padding, width etc. como bloco inline */
  padding: 15px 25px;                  /* Espaçamento interno vertical e horizontal */
  border-radius: 999px;                /* Deixa as bordas totalmente arredondadas (pílula) */
  background: linear-gradient(135deg, #F3D147, #F3D147); /* Gradiente (aqui uniforme) amarelo */
  color: #fff;                         /* Texto branco */
  font-weight: 800;                    /* Negrito forte */
  text-decoration: none;               /* Remove sublinhado de links */
  font-size: 22px;                     /* Tamanho da fonte do botão */
  box-shadow: 0 14px 36px rgb(255, 255, 255); /* Sombra abaixo do botão */
  transition: transform 0.15s ease, 
              box-shadow 0.15s ease;   /* Anima posição e sombra ao passar o mouse */
}

.btn-primary:hover {
  transform: translateY(-1px);         /* Sobe levemente no hover para dar sensação de clique */
  box-shadow: 0 16px 40px rgb(255, 255, 255); /* Sombra mais forte no hover */
}

.hero-figure {
  display: flex;                       /* Usa flex para controlar posição da imagem */
  justify-content: right;              /* Alinha a imagem para a direita da área */
  position: relative;                  /* Mantém a imagem acima do fundo */
  z-index: 1;
}

/* Regras individuais para cada imagem do carrossel */
.hero-figure .hero-img-1 {
  max-height: 980px;                   /* Altura máxima da imagem para não ficar gigante */
  width: auto;                         /* Largura ajusta proporcionalmente */
  object-fit: contain;                 /* Garante que a imagem inteira apareça sem cortar */
  filter: drop-shadow(0 18px 38px rgba(0, 0, 0, 0.25)); /* Sombra projetada sob a imagem */
}

.hero-figure .hero-img-2 {
  max-height: 1800px !important;       /* Altura máxima aumentada para imagem 2 */
  width: auto;                         /* Largura ajusta proporcionalmente */
  object-fit: contain;                 /* Garante que a imagem inteira apareça sem cortar */
  filter: drop-shadow(0 18px 38px rgba(0, 0, 0, 0.25)); /* Sombra projetada sob a imagem */
  transform: scale(1.2);               /* Aumenta 20% o tamanho */
}

.hero-figure .hero-img-3 {
  max-height: 1400px !important;       /* Altura máxima aumentada para imagem 3 */
  width: auto;                         /* Largura ajusta proporcionalmente */
  object-fit: contain;                 /* Garante que a imagem inteira apareça sem cortar */
  filter: drop-shadow(0 18px 38px rgba(0, 0, 0, 0.25)); /* Sombra projetada sob a imagem */
  transform: scale(1.2);               /* Aumenta 20% o tamanho */
}

.hero-figure .hero-img-4 {
  max-height: 1400px !important;       /* Altura máxima aumentada para imagem 4 */
  width: auto;                         /* Largura ajusta proporcionalmente */
  object-fit: contain;                 /* Garante que a imagem inteira apareça sem cortar */
  filter: drop-shadow(0 18px 38px rgba(0, 0, 0, 0.25)); /* Sombra projetada sob a imagem */
  transform: scale(1.2);               /* Aumenta 20% o tamanho */
}

.hero-arrow {
  position: absolute;                  /* Posiciona em relação ao .hero-carousel */
  top: 50%;                            /* Meio vertical do carrossel */
  transform: translateY(-50%);         /* Corrige para ficar exatamente central */
  width: 48px;
  height: 48px;
  border-radius: 50%;                  /* Deixa o botão em forma de círculo */
  border: 1px solid rgba(0, 0, 0, 0.08);/* Borda suave em volta */
  background: #fff;                    /* Fundo branco do botão */
  color: #444;                         /* Cor do ícone/flecha dentro do botão */
  cursor: pointer;                     /* Mostra cursor de clique */
  display: grid;                       /* Permite usar place-items para centralizar ícone */
  place-items: center;                 /* Centraliza horizontal e verticalmente o ícone */
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12); /* Sombra do botão de navegação */
  transition: transform 0.15s ease, 
              box-shadow 0.2s ease;    /* Animações ao interagir */
  z-index: 10;                         /* Garante que as setas fiquem acima das imagens */
}

.hero-arrow:hover {
  transform: translateY(-50%) scale(1.10); /* Mantém centrado e aumenta um pouco */
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.16); /* Sombra mais intensa no hover */
  color: #F3D147;
}

.hero-arrow.prev { 
  left: 20px;                          /* Botão de voltar fica à esquerda */
  font-size: 20px;
}

.hero-arrow.next { 
  right: 20px;                         /* Botão de avançar fica à direita */
  font-size: 20px;
}

.hero-dots {
  position: absolute;                  /* Posicionado sobre o carrossel */
  bottom: 8px;                        /* Distância da parte inferior */
  left: 50%;                           /* Começa no meio da tela */
  transform: translateX(-50%);         /* Centraliza horizontalmente */
  display: flex;                       /* Organiza os dots lado a lado */
  gap: 10px;                           /* Espaço entre os dots */
  z-index: 4;                          /* Fica acima da maioria dos elementos */
}

.hero-dots button {
  width: 10px;
  height: 10px;
  border-radius: 50%;                  /* Cada dot é um círculo */
  border: none;                        /* Sem borda */
  background: rgba(0, 0, 0, 0.28);     /* Cor padrão mais escura/transparente */
  cursor: pointer;                     /* Mostra que é clicável */
  transition: transform 0.15s ease, 
              background 0.2s ease;    /* Anima tamanho e cor ao ativar */
}

.hero-dots button.active {
  background: #F3D147;                 /* Dot ativo fica amarelo */
  transform: scale(1.15);              /* Aumenta levemente o tamanho */
}

/* Estado compacto do menu quando a página é rolada */
.menu.menu--compact {
  padding: 6px 16px;                    /* Menu mais baixo */
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.menu.menu--compact > a img {
  width: 90px;                          /* Logo menor */
  height: auto;
  transition: width 0.25s ease;
}

.menu.menu--compact .menu-links a {
  padding: 4px 8px;                     /* Links mais compactos */
  font-size: 0.95rem;
}

/* Offset for in-page anchors under sticky header */
#pre-aprendizagem,
#apprentice,
#internship,
#estrutura,
#team,
#pre-aprendizagem-title,
#apprentice-title,
#historia,
#values-title,
#presidents-title,
#certifications-title,
#compliance,
#compliance-highlight,
#contratar,
#empresas {
  scroll-margin-top: var(--anchor-offset);
}

#team{
  scroll-margin-top: 350px;
}

 #estrutura-title{
    scroll-margin-top: 100px;
  }

#documentos{
  scroll-margin-top: 90px;
}

#contratar{
  scroll-margin-top: 90px;
}


.anchor-target {
  display: block;
  height: 0;
  scroll-margin-top: var(--anchor-offset);
}


/* ========================= */
/*   SEÇÃO SOBRE NÓS         */
/* ========================= */
.about-section {
  padding: 72px 20px 80px;
  background: #fff;
  color: #0f172a;
  font-family: 'Open Sans', sans-serif;
}

.about-grid {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}

.about-text {
  display: grid;
  gap: 14px;
}

.about-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 800;
  font-size: 14px;
  color: #005fa9;
}

.about-title {
  margin: 0;
  font-size: clamp(28px, 3vw, 34px);
  font-weight: 800;
  color: #111;
}

.about-lead {
  margin: 0;
  line-height: 1.6;
  font-size: 17px;
}

.about-highlight {
  margin: 0;
  line-height: 1.6;
  font-size: 17px;
}

.about-cta {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  font-size: 18px;
}

.about-media img {
  width: 100%;
  height: 100%;
  max-height: 420px;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}



/*Barra de rolagem personalizada*/
/* WebKit (Chrome, Edge, Safari) */
::-webkit-scrollbar {
  width: 2px;              /* espessura vertical */
  height: 2px;             /* espessura horizontal */
}

::-webkit-scrollbar-track {
  background: #e6eef5;       /* cor do trilho */
}

::-webkit-scrollbar-thumb {
  background: #005fa9;       /* cor do “pino” */
  border-radius: 999px;
  border: 2px solid #e6eef5; /* cria “folga” entre thumb e track */
}

::-webkit-scrollbar-thumb:hover {
  background: #004c87;       /* cor no hover */
}

/* Firefox */
* {
  scrollbar-width: thin;          /* thin | auto */
  scrollbar-color: #005fa9 #e6eef5; /* thumb | track */
}


.about-media.video-embed {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}

.about-media.video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


       

/* ========================= */
/*   SECAO PROGRAMAS PAGE    */
/* ========================= */
.programs-page {
  background: #f8fafc;
}

/* ========================= */
/*   SECAO EMPRESA PAGE      */
/* ========================= */
.company-page {
  background: #f7fafc;
  font-family: 'Open Sans', sans-serif;
}

.company-hero {
  padding: 86px 20px 110px;
  background: linear-gradient(180deg, #f7fafc 0%, #eef5fb 100%);
}

.company-hero-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
  position: relative;
}

.company-hero-inner::before {
  content: "";
  position: absolute;
  inset: -30px -20px auto auto;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 95, 169, 0.08), transparent 70%);
  pointer-events: none;
}

.company-hero-content {
  display: grid;
  gap: 18px;
}

.company-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 8px 18px;
  border-radius: 999px;
  background: #0b4c9a;
  color: #f3d147;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  font-weight: 800;
}

.company-title {
  margin: 0;
  font-size: clamp(36px, 4.4vw, 56px);
  line-height: 1.05;
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.company-title span {
  display: block;
  color: #f3b500;
}

.company-subtitle {
  margin: 0;
  color: #516073;
  font-size: 18px;
  line-height: 1.7;
  max-width: 540px;
}

.company-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.company-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 30px;
  border-radius: 999px;
  background: #0b4c9a;
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 14px 30px rgba(11, 76, 154, 0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.company-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(11, 76, 154, 0.4);
}

.company-call {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #0b4c9a;
  font-weight: 700;
}

.company-call-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #f3d147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 20px;
  box-shadow: 0 10px 20px rgba(243, 209, 71, 0.35);
}

.company-call-label {
  display: block;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: #7b8aa2;
}

.company-call-number {
  display: inline-block;
  color: #0b4c9a;
  text-decoration: none;
  font-size: 18px;
  font-weight: 800;
}

.company-call-number:hover {
  text-decoration: underline;
}

.company-hero-card {
  position: relative;
  background: #ffffff;
  border-radius: 34px;
  padding: 26px;
  box-shadow: 0 30px 70px rgba(15, 23, 42, 0.16);
  border: 1px solid rgba(11, 76, 154, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.company-hero-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 36px 78px rgba(15, 23, 42, 0.2);
  border-color: rgba(11, 76, 154, 0.18);
}

.company-card-inner {
  background: #ffffff;
  border-radius: 28px;
  padding: 40px 36px;
  text-align: center;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.05);
}

.company-card-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: rgba(11, 76, 154, 0.12);
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 34px;
  margin: 0 auto 16px;
}

.company-hero-card h3 {
  margin: 0 0 10px;
  color: #0b4c9a;
  font-size: 20px;
  font-weight: 900;
  text-transform: uppercase;
}

.company-hero-card p {
  margin: 0;
  color: #6b7a90;
  font-size: 15px;
  line-height: 1.6;
  font-style: italic;
}

.company-card-corner {
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 62px;
  height: 62px;
  border-radius: 18px 18px 18px 6px;
  background: linear-gradient(135deg, rgba(11, 76, 154, 0.06), rgba(243, 209, 71, 0.2));
  transform: rotate(-10deg);
}

.company-steps {
  padding: 92px 20px 110px;
  background: #ffffff;
}

.company-steps-title {
  width: min(1200px, 100%);
  margin: 0 auto 32px;
  text-align: center;
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.company-steps-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 56px;
  align-items: center;
}

.company-steps-media {
  position: relative;
  display: grid;
  justify-items: start;
}

.company-photo-frame {
  position: relative;
  background: #b7c7f0;
  padding: 16px;
  border-radius: 28px;
  box-shadow: 0 22px 50px rgba(15, 23, 42, 0.16);
  margin-top: -120px;
}

.company-photo {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
}

.company-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
}

.company-photo img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
  transition: transform 0.25s ease;
  transform-origin: center;
}

.company-photo:hover img {
  transform: scale(1.04);
}

.company-photo-badge {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: #f3d147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 28px;
  border: 6px solid #ffffff;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.2);
}

.company-photo-caption {
  position: absolute;
  left: -26px;
  bottom: -64px;
  background: #ffffff;
  border-radius: 26px;
  padding: 22px 26px;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.15);
  max-width: 260px;
}

.company-photo-caption h2 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.company-photo-caption p {
  margin: 0;
  font-size: 13px;
  color: #65748b;
  line-height: 1.5;
}

.company-steps-content {
  display: grid;
  gap: 22px;
}

.company-step-card {
  background: #ffffff;
  border-radius: 26px;
  padding: 22px 26px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: start;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.12);
  border: 1px solid rgba(15, 23, 42, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.company-step-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px rgba(15, 23, 42, 0.16);
  border-color: rgba(11, 76, 154, 0.16);
}

.company-step-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: #eef5fb;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 24px;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.company-step-card:hover .company-step-icon {
  background: #0b4c9a;
  color: #ffffff;
  transform: translateY(-2px);
}

.company-step-card h3 {
  margin: 2px 0 8px;
  font-size: 18px;
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.company-step-card p {
  margin: 0;
  color: #5a6a80;
  line-height: 1.6;
  font-size: 14px;
}

.company-steps-cta {
  margin-top: 6px;
  justify-self: start;
  align-self: start;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 34px;
  border-radius: 999px;
  background: #f3d147;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 16px 30px rgba(243, 209, 71, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.company-steps-cta i {
  font-size: 18px;
}

.company-steps-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 36px rgba(243, 209, 71, 0.45);
}

.company-diff {
  padding: 96px 20px 110px;
  background: #0b4c9a;
  position: relative;
  overflow: hidden;
}

.company-diff::before {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 0 0 90px rgba(255, 255, 255, 0.04),
              0 0 0 180px rgba(255, 255, 255, 0.03);
  pointer-events: none;
}

.company-diff-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 40px;
  position: relative;
  z-index: 1;
}

.company-diff-header h2 {
  margin: 0;
  text-align: center;
  color: #ffffff;
  font-size: clamp(26px, 3.8vw, 40px);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.company-diff-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px;
}

.company-diff-card {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 28px;
  padding: 30px 22px 34px;
  text-align: center;
  color: #e6eef8;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 16px 36px rgba(1, 28, 68, 0.35);
  backdrop-filter: blur(2px);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.company-diff-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px rgba(1, 28, 68, 0.45);
  border-color: rgba(243, 209, 71, 0.4);
}

.company-diff-icon {
  width: 60px;
  height: 60px;
  border-radius: 18px;
  background: #f3d147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 28px;
  margin: 0 auto 16px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18);
}

.company-diff-card h3 {
  margin: 0 0 10px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.company-diff-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  line-height: 1.6;
}

.company-steps {
    scroll-margin-top: 80px; /* ajuste conforme a altura do topo */
}

/* ========================= */
/*   EMPRESAS PARCEIRAS      */
/* ========================= */
.partners-page {
  background: #f2f6fb;
}

.partners-hero {
  padding: 56px 20px 24px;
}

.partners-hero-inner {
  width: min(1320px, 100%);
  margin: 0 auto;
}

.partners-title {
  margin: 0;
  color: #0b4c9a;
  font-size: clamp(34px, 5vw, 62px);
  font-weight: 900;
  text-transform: uppercase;
}

.partners-subtitle {
  margin: 12px 0 0;
  color: #5f6f86;
  font-size: 18px;
}

.partners-list-section {
  padding: 14px 20px 72px;
}

.partners-list-inner {
  width: min(1320px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 20px;
}

.partners-list-title {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: #0b4c9a;
  text-transform: uppercase;
}

.partners-grid-page {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
}

.partner-logo-card {
  min-height: 148px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid #e7edf5;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
  display: grid;
  place-items: center;
  padding: 18px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.partner-logo-card:hover {
  transform: scale(1.04);
  border-color: rgba(110, 161, 255, 0.3);
  box-shadow: 0 24px 50px rgba(255, 243, 187, 0.55);
}

.partner-logo-card img {
  width: 100%;
  max-width: 170px;
  max-height: 88px;
  object-fit: contain;
}

.programs-hero {
  padding: 72px 20px 40px;
  background: #f8fafc;
  color: #0b3560;
  font-family: 'Open Sans', sans-serif;
}

.programs-hero-inner {
  width: min(1100px, 100%);
  margin: 0 auto;
  text-align: center;
  display: grid;
  gap: 16px;
  position: relative;
}

.programs-hero-pill {
  position: static;
  background: #0b4c9a;
  color: #f3d147;
  padding: 8px 18px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: 0 12px 24px rgba(11, 76, 154, 0.2);
  display: inline-flex;
  justify-self: center;
  margin-bottom: 4px;
}

.programs-hero-title {
  margin: 0;
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 900;
  line-height: 1.05;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.programs-hero-title-main {
  color: #0b4c9a;
}

.programs-hero-title-accent {
  color: #f3d147;
}

.programs-hero-subtitle {
  margin: 0 auto;
  max-width: 720px;
  font-size: clamp(16px, 2vw, 20px);
  color: #475569;
  line-height: 1.6;
}

.programs-detail {
  padding: 40px 20px 110px;
  background: #f8fafc;
  color: #0f172a;
  font-family: 'Open Sans', sans-serif;
}

.programs-detail-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: start;
}

.programs-detail-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #c7921a;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 14px;
  margin-bottom: 12px;
}

.programs-detail-kicker i {
  font-size: 20px;
}

.programs-detail-title {
  margin: 0 0 8px;
  font-size: clamp(22px, 2.8vw, 30px);
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.programs-detail-subtitle {
  margin: 0 0 16px;
  color: #0b4c9a;
  font-weight: 700;
}

.programs-age-subtitle {
  color: #0b4c9a;
}

.programs-detail-heading {
  margin: 28px 0 10px;
  font-size: 18px;
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.programs-detail-description {
  margin: 0 0 12px;
  color: #475569;
  line-height: 1.7;
  font-size: 15px;
}

.programs-steps-card {
  margin-top: 24px;
  background: #ffffff;
  border-radius: 28px;
  padding: 28px 30px;
  box-shadow: 0 22px 40px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.06);
}

.programs-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 22px;
}

.programs-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.programs-step h4 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.programs-step p {
  margin: 0;
  color: #5b6472;
  font-size: 14px;
  line-height: 1.6;
}

.programs-step-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: #eef4ff;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 24px;
  flex: 0 0 auto;
  box-shadow: 0 10px 20px rgba(11, 76, 154, 0.12);
}

.programs-detail-media {
  display: grid;
  gap: 24px;
  justify-items: end;
  align-content: start;
}

.programs-media-frame {
  position: relative;
  width: 100%;
  max-width: 420px;
  margin-top: 24px;
  border-radius: 18px;
  padding: 10px;
  background: #ffffff;
  border: 2px solid #f3d147;
  box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.programs-media-frame img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  transition: transform 0.25s ease, filter 0.25s ease;
}

.programs-media-frame:hover {
  transform: translateY(-4px);
  box-shadow: 0 28px 60px rgba(15, 23, 42, 0.16);
}

.programs-media-frame:hover img {
  transform: scale(1.03);
  filter: saturate(1.05);
}

.programs-media-icon {
  position: absolute;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #f3d147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 28px;
  border: 6px solid #ffffff;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.15);
}

.programs-media-icon--top {
  top: -22px;
  right: -22px;
}

.programs-media-icon--bottom {
  bottom: -22px;
  left: -22px;
}

.programs-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 34px;
  border-radius: 999px;
  background: #f3d147;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.16);
}

.programs-cta i {
  font-size: 20px;
}

.programs-cta:hover {
  background: #f3d147;
}

.apprentice-section {
  padding: 90px 20px 120px;
  background: #eef4fb;
  font-family: 'Open Sans', sans-serif;
  color: #0f172a;
}

.apprentice-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 52px;
  align-items: center;
}

.apprentice-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1d4ed8;
}

.apprentice-kicker i {
  font-size: 20px;
}

.apprentice-subtitle {
  margin: 8px 0 0;
  color: #0b4c9a;
  font-weight: 700;
}

.apprentice-title {
  margin: 14px 0 12px;
  font-size: clamp(30px, 3.6vw, 44px);
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
  line-height: 1.05;
}

.apprentice-text {
  margin: 0 0 26px;
  color: #475569;
  line-height: 1.7;
  font-size: 16px;
  max-width: 520px;
}

.apprentice-benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 28px;
}

.apprentice-benefit {
  background: #ffffff;
  border-radius: 18px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
  font-weight: 700;
  color: #0b4c9a;
}

.apprentice-benefit-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #dcfce7;
  color: #16a34a;
  display: grid;
  place-items: center;
  font-size: 16px;
  flex: 0 0 auto;
}

.apprentice-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  border-radius: 999px;
  background: #0b4c9a;
  color: #ffffff;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 16px 30px rgba(11, 76, 154, 0.3);
}

.apprentice-cta:hover {
  background: #0a4284;
}

.apprentice-media {
  position: relative;
  display: grid;
  justify-items: end;
  gap: 18px;
}

.apprentice-frame {
  width: 100%;
  max-width: 520px;
  background: #0b4c9a;
  padding: 16px;
  border-radius: 36px;
  overflow: hidden;
  box-shadow: 0 26px 60px rgba(11, 76, 154, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.apprentice-frame img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 28px;
  object-fit: cover;
  transform: scale(1.05);
  transition: transform 0.25s ease;
}

.apprentice-frame:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 70px rgba(11, 76, 154, 0.3);
}

.apprentice-frame:hover img {
  transform: scale(1.08);
}

.internship-section {
  padding: 96px 20px 110px;
  background: #ffffff;
  font-family: 'Open Sans', sans-serif;
  color: #0f172a;
}

.internship-header {
  width: min(1200px, 100%);
  margin: 0 auto 40px;
  text-align: center;
  display: grid;
  gap: 10px;
  justify-items: center;
}

.internship-header-title {
  margin: 0;
  color: #f3d147;
  font-weight: 900;
  text-transform: uppercase;
  font-size: 20px;
  letter-spacing: 0.06em;
}

.internship-header-line {
  width: 120px;
  height: 3px;
  background: #d7e2f0;
  border-radius: 999px;
}

.internship-hero {
  width: min(1200px, 100%);
  margin: 0 auto 60px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}

.internship-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f3d147;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 13px;
}

.internship-kicker i {
  font-size: 18px;
}

.internship-title {
  margin: 12px 0;
  font-size: clamp(30px, 3.6vw, 42px);
  font-weight: 900;
  color: #0b4c9a;
  line-height: 1.05;
  text-transform: uppercase;
}

.internship-text {
  margin: 0 0 20px;
  color: #475569;
  line-height: 1.7;
  font-size: 15px;
  max-width: 520px;
}

.internship-highlight {
  background: #fdf9e8;
  border-radius: 16px;
  padding: 18px 20px;
  border-left: 4px solid #0b4c9a;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.08);
}

.internship-highlight h3 {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #0b4c9a;
  font-weight: 900;
}

.internship-highlight p {
  margin: 0;
  color: #475569;
  font-size: 13px;
  line-height: 1.6;
}

.internship-media {
  display: grid;
  justify-items: end;
}

.internship-photo {
  background: #0b4c9a;
  padding: 14px;
  border-radius: 28px;
  box-shadow: 0 26px 60px rgba(11, 76, 154, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.internship-photo img {
  display: block;
  width: 100%;
  max-width: 520px;
  height: auto;
  border-radius: 22px;
  object-fit: cover;
  transition: transform 0.25s ease;
}

.internship-photo:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 70px rgba(11, 76, 154, 0.3);
}

.internship-photo:hover img {
  transform: scale(1.03);
}

.internship-differentials {
  width: min(1200px, 100%);
  margin: 28px auto 44px;
}

.internship-differentials-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.internship-differentials-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  text-transform: uppercase;
  color: #0b4c9a;
}

.internship-diff-marker {
  width: 4px;
  height: 22px;
  background: #f3d147;
  border-radius: 999px;
}

.internship-differentials-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.internship-diff-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 22px 18px;
  text-align: center;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.06);
  display: grid;
  gap: 10px;
  min-height: 190px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.internship-diff-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 36px rgba(15, 23, 42, 0.12);
  border-color: rgba(11, 76, 154, 0.2);
}

.internship-diff-card i {
  font-size: 28px;
  color: #0b4c9a;
}

.internship-diff-card h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  color: #0b4c9a;
}

.internship-diff-card p {
  margin: 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.internship-process {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.internship-process-card {
  background: #f8fafc;
  border-radius: 28px;
  padding: 36px 38px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 32px;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
}

.internship-section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.internship-section-title.right {
  justify-content: flex-end;
}

.internship-section-title h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
  color: #0b4c9a;
}

.internship-section-mark {
  width: 4px;
  height: 20px;
  background: #f3d147;
  border-radius: 999px;
}

.internship-requirements ul {
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  color: #475569;
  font-size: 13px;
  line-height: 1.6;
}

.internship-requirements li::before {
  content: "o";
  color: #0b4c9a;
  font-weight: 900;
  margin-right: 8px;
}

.internship-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  background: #f3d147;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
}

.internship-steps {
  display: grid;
  gap: 20px;
}

.internship-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  text-align: center;
}

.internship-step {
  display: grid;
  gap: 8px;
  justify-items: center;
  font-weight: 800;
  color: #0b4c9a;
}

.internship-step-icon {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #f3d147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 24px;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.16);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.internship-step-icon:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.2);
}

.internship-step h4 {
  margin: 0;
  font-size: 14px;
}

.internship-step p {
  margin: 0;
  font-size: 10px;
  text-transform: uppercase;
  color: #475569;
}

@media (max-width: 980px) {
  .programs-detail-inner {
    grid-template-columns: 1fr;
  }

  .programs-detail-media {
    justify-items: start;
  }

  .apprentice-inner {
    grid-template-columns: 1fr;
  }

  .apprentice-media {
    justify-items: start;
  }

  .internship-hero {
    grid-template-columns: 1fr;
  }

  .internship-media {
    justify-items: start;
  }

  .internship-differentials-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .internship-process-card {
    grid-template-columns: 1fr;
  }

  .internship-section-title.right {
    justify-content: flex-start;
  }

  .internship-steps-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .programs-hero {
    padding: 56px 16px 24px;
  }

  .programs-hero-pill {
    position: static;
    justify-self: center;
  }

  .programs-detail {
    padding: 24px 16px 80px;
  }

  .programs-steps-card {
    padding: 24px;
  }

  .programs-media-icon--top,
  .programs-media-icon--bottom {
    width: 54px;
    height: 54px;
    font-size: 24px;
  }

  .programs-media-icon--top {
    top: -18px;
    right: -18px;
  }

  .programs-media-icon--bottom {
    bottom: -18px;
    left: -18px;
  }

  .apprentice-section {
    padding: 72px 16px 90px;
  }

  .apprentice-benefits {
    grid-template-columns: 1fr;
  }

  .apprentice-frame {
    padding: 18px;
    border-radius: 28px;
  }

  .apprentice-frame img {
    border-radius: 22px;
    object-fit: contain;
    transform: none;
    width: 92%;
    height: auto;
    margin: 0 auto;
  }

  .internship-section {
    padding: 72px 16px 90px;
  }

  .internship-differentials-grid {
    grid-template-columns: 1fr;
  }

  .internship-process-card {
    padding: 28px 24px;
  }

  .internship-steps-grid {
    grid-template-columns: 1fr;
  }
}

/* ========================= */
/*   SEÇÃO PROGRAMAS         */
/* ========================= */
.programs-section {
  padding: 86px 20px 96px;
  background: #f8fafc;
  color: #0f172a;
  font-family: 'Open Sans', sans-serif;
}

.programs-section .container {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.programs-header {
  text-align: center;
  margin: 0 0 56px;
  display: grid;
  gap: 10px;
  justify-items: center;
}

.programs-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 800;
  font-size: 15px;
  color: #005fa9;
}

.programs-title {
  margin: 0;
  font-size: clamp(38px, 4.8vw, 64px);
  font-weight: 900;
  line-height: 1.05;
  color: #005fa9;
}

.programs-underline {
  width: 132px;
  height: 10px;
  border-radius: 999px;
  background: #f3d147;
  margin-top: 6px;
}

.programs-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 60px;
  align-items: stretch;
}

.program-card {
  background: #fff;
  border-radius: 44px;
  padding: 56px 40px 44px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.06);
  border: 1px solid rgba(15, 23, 42, 0.06);
  display: grid;
  gap: 18px;
  justify-items: center;
  min-height: 420px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.program-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.09);
  background: #005fa9;
  border-color: rgba(255, 255, 255, 0.16);
}

.program-card:hover .program-name,
.program-card:hover .program-desc {
  color: #ffffff;
}

.program-card:hover .program-link,
.program-card:hover .program-link i {
  color: #f3d147;
}

.program-card:hover .program-link:hover {
  background: rgba(243, 209, 71, 0.14);
}

.program-icon {
  width: 104px;
  height: 104px;
  border-radius: 26px;
  background: #f3d147;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
}

.program-icon i {
  font-size: 48px;
  line-height: 1;
  color: #005fa9;
}

.program-name {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 900;
  font-size: 28px;
  color: #005fa9;
}

.program-desc {
  margin: 0;
  color: #475569;
  font-size: 18px;
  line-height: 1.7;
  max-width: 340px;
}

.program-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 999px;
  color: #005fa9;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 18px;
  transition: transform 0.15s ease, background-color 0.15s ease;
}

.program-link i {
  font-size: 22px;
  line-height: 1;
}

.program-link:hover {
  transform: translateY(-1px);
  background: rgba(0, 95, 169, 0.08);
}

@media (max-width: 1024px) {
  .programs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .programs-section {
    padding: 64px 16px 74px;
  }

  .programs-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .program-card {
    border-radius: 32px;
    padding: 40px 26px 34px;
    min-height: unset;
  }

  .program-name {
    font-size: 24px;
  }

  .program-desc {
    font-size: 16px;
  }
}

/* ========================= */
/*   SEÇÃO EMPRESA PARCEIRA  */
/* ========================= */
/* ========================= */
/*   SECAO NUMEROS           */
/* ========================= */
.numbers-section {
  position: relative;
  padding: 96px 20px;
  color: #eaf2ff;
  font-family: 'Open Sans', sans-serif;
  background: linear-gradient(180deg, #0b4c9a 0%, #073b74 100%),
    url('../assets/images/jovem_empresa.png') center/cover no-repeat;
  background-blend-mode: multiply;
}

.numbers-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.8fr);
  gap: 60px;
  align-items: center;
}

.numbers-kicker {
  margin: 0 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 800;
  font-size: 14px;
  color: #f3d147;
}

.numbers-title {
  margin: 0 0 18px;
  font-size: clamp(44px, 5.4vw, 72px);
  font-weight: 900;
  line-height: 1.05;
}

.numbers-title span {
  color: #f3d147;
}

.numbers-text {
  margin: 0;
  font-size: 18px;
  line-height: 1.7;
  color: #dbe7f5;
  max-width: 460px;
}

.numbers-cta {
  margin-top: 28px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 22px;
  border-radius: 999px;
  background: #f3d147;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 700;
  border: 0;
  box-shadow: 0 14px 30px rgba(7, 31, 64, 0.35);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.numbers-cta:hover {
  transform: translateY(-2px);
  background: #f6dc67;
  box-shadow: 0 20px 40px rgba(7, 31, 64, 0.45);
}

.numbers-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "left-top right-top"
    "left-bottom right-bottom";
  gap: 26px;
}

.numbers-reveal {
  opacity: 0;
  filter: blur(6px);
  transition: opacity 0.5s ease, filter 0.5s ease;
}

.numbers-reveal.is-visible {
  opacity: 1;
  filter: blur(0);
}

.numbers-card {
  padding: 30px 28px 34px;
  text-align: left;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid #dbe6f5;
  box-shadow: 0 20px 46px rgba(7, 31, 64, 0.18);
  min-height: 240px;
  display: grid;
  gap: 12px;
  transform: translateY(0);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  animation: numbers-float 6s ease-in-out infinite;
  animation-play-state: paused;
}

.numbers-stats .numbers-card:first-child {
  grid-area: left-top;
  animation-delay: 0s;
}

.numbers-card-bottom {
  grid-area: left-bottom;
  animation-delay: 1.1s;
}

.numbers-card-right {
  grid-area: right-top;
  animation-delay: 0.6s;
  position: relative;
  top: 175px;
}

.numbers-stats::after {
  content: "";
  grid-area: right-bottom;
}

.numbers-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 26px 60px rgba(7, 31, 64, 0.24);
  border-color: rgba(11, 76, 154, 0.2);
}

.numbers-card.numbers-reveal.is-visible {
  animation-play-state: running;
}

.numbers-icon {
  width: 62px;
  height: 62px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: #e6eef5;
  color: #0b4c9a;
  font-size: 28px;
}

.numbers-value {
  margin: 4px 0 0;
  font-size: clamp(30px, 3.8vw, 46px);
  font-weight: 900;
  color: #0b4c9a;
}

.numbers-plus {
  color: #f3d147;
  margin-right: 4px;
}

.numbers-sub {
  margin: 0;
  color: #1f3b63;
  font-weight: 700;
  font-size: 18px;
}

.numbers-label {
  margin: 6px 0 0;
  color: #526b86;
  font-size: 15px;
  line-height: 1.6;
}

.numbers-icon-green {
  color: #1f7a5a;
}

.numbers-icon-purple {
  color: #f3d147;
}

@keyframes numbers-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

@media (max-width: 1024px) {
  .numbers-inner {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 40px;
  }

  .numbers-text {
    margin: 0 auto;
  }

  .numbers-cta {
    margin-inline: auto;
  }

  .numbers-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    grid-template-areas:
      "left-top left-bottom"
      "right-top right-top";
  }

  .numbers-card {
    text-align: center;
    justify-items: center;
    animation: none;
  }

  .numbers-card-right {
    top: 0;
  }
}

@media (max-width: 680px) {
  .numbers-section {
    padding: 72px 16px;
  }

  .numbers-stats {
    grid-template-columns: 1fr;
    grid-template-areas:
      "left-top"
      "left-bottom"
      "right-top";
    transform: translateX(26px);
  }

  .numbers-card-right {
    top: 0;
  }

}

@media (prefers-reduced-motion: reduce) {
  .numbers-card {
    animation: none;
    transition: none;
  }
}

.partner-section {
  padding: 90px 20px;
  background: #f3d147;
  font-family: 'Open Sans', sans-serif;
}

.partner-grid {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
}

.partner-media {
  border-radius: 44px;
  overflow: hidden;
  border: 10px solid rgba(0, 95, 169, 0.35);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.18);
  background: rgba(255, 255, 255, 0.25);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.partner-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  min-height: 420px;
  transition: transform 0.25s ease;
}

.partner-media:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 80px rgba(15, 23, 42, 0.24);
  border-color: rgba(243, 209, 71, 0.8);
}

.partner-media:hover img {
  transform: scale(1.03);
}

.partner-title {
  margin: 0;
  font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.05;
  font-weight: 900;
  color: #005fa9;
}

.partner-title .accent {
  color: #0b3560;
}

.partner-lead {
  margin: 18px 0 0;
  color: #0b3560;
  font-size: 18px;
  line-height: 1.7;
  max-width: 560px;
}

.partner-features {
  margin-top: 34px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 28px;
}

.partner-feature {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 14px;
  align-items: start;
}

.partner-feature .icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: #005fa9;
  display: grid;
  place-items: center;
}

.partner-feature .icon i {
  color: #f3d147;
  font-size: 26px;
  line-height: 1;
}

.partner-feature h3 {
  margin: 0;
  color: #005fa9;
  font-weight: 900;
  font-size: 18px;
}

.partner-feature p {
  margin: 6px 0 0;
  color: #0b3560;
  line-height: 1.6;
  font-size: 15px;
}

.btn-partner {
  margin-top: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 34px;
  border-radius: 999px;
  background: #005fa9;
  color: #ffffff;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
  box-shadow: 0 18px 36px rgba(0, 95, 169, 0.25);
}

.btn-partner:hover {
  background: #004c87;
  transform: translateY(-2px);
  box-shadow: 0 24px 50px rgba(0, 95, 169, 0.32);
}

.btn-partner:focus-visible {
  outline: 3px solid rgba(0, 95, 169, 0.45);
  outline-offset: 4px;
}

@media (max-width: 1024px) {
  .partner-grid {
    grid-template-columns: 1fr;
  }

  .partner-media img {
    min-height: 320px;
  }
}

@media (max-width: 680px) {
  .partner-section {
    padding: 64px 16px;
  }

  .partner-features {
    grid-template-columns: 1fr;
  }

  .btn-partner {
    width: 100%;
  }
}

/* ========================= */
/*  EMPRESAS (CARROSSEL)     */
/* ========================= */
.trusted-section {
  padding: 96px 20px 110px;
  background: radial-gradient(circle at top, rgba(0, 122, 255, 0.12), transparent 60%),
            #ffffff;
  font-family: 'Open Sans', sans-serif;
  color: #e2e8f0;
}

.trusted-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.trusted-header {
  text-align: center;
  margin: 0 0 54px;
  display: grid;
  gap: 16px;
  justify-items: center;
}



.trusted-title {
  margin: 0;
  color: black;
  font-size: clamp(30px, 3.8vw, 52px);
  font-weight: 900;
  letter-spacing: -0.01em;
}

.trusted-title span {
  color: #F3D147;
}

.trusted-subtitle {
  margin: 0;
  max-width: 740px;
  color: black;
  font-size: 18px;
  line-height: 1.7;
}

.companies-carousel {
  display: grid;
  grid-template-columns: 56px 1fr 56px;
  align-items: center;
  gap: 22px;
}

.companies-arrow {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 0;
  background: rgba(255, 255, 255, 0.08);
  color: #6ea1ff;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 18px 40px rgba(188, 233, 248, 0.45);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.companies-arrow i {
  font-size: 26px;
  line-height: 1;
}

.companies-arrow:hover {
  transform: translateY(-1px);
  background: rgba(110, 161, 255, 0.2);
  box-shadow: 0 22px 46px rgba(255, 243, 187, 0.55);
}

.companies-arrow:focus-visible {
  outline: 3px solid rgba(110, 161, 255, 0.4);
  outline-offset: 4px;
}

.companies-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 8px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.companies-viewport::-webkit-scrollbar {
  display: none;
}

.companies-track {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 12px 4px;
  margin: 0;
  list-style: none;
}

.company-card {
  flex: 0 0 auto;
  width: clamp(200px, 20vw, 260px);
  height: 140px;
  background: linear-gradient(#FFFFFF);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(188, 233, 248, 0.45);
  display: grid;
  place-items: center;
  scroll-snap-align: center;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.company-card:hover {
  transform: translateY(-6px);
  border-color: rgba(110, 161, 255, 0.3);
  box-shadow: 0 24px 50px rgba(255, 243, 187, 0.55);
}

.company-card img {
  width: auto;
  height: 80px;
  max-width: 85%;
  object-fit: contain;
  display: block;
}

.company-fallback {
  font-weight: 900;
  color: #e2e8f0;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-size: 18px;
}

/* ========================= */
/*          RODAPE           */
/* ========================= */
.site-footer {
  background: #233d63;
  color: #e8f1ff;
  padding: 64px 16px 40px;
  font-family: 'Open Sans', sans-serif;
}

.footer-inner {
  width: min(1180px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.footer-card {
  background: linear-gradient(145deg, rgba(25, 42, 72, 0.96), rgba(18, 33, 57, 0.94));
  border: 1px solid rgba(142, 182, 231, 0.18);
  border-radius: 16px;
  padding: 22px 20px;
  box-shadow: 0 14px 30px rgba(12, 23, 41, 0.5);
  display: grid;
  gap: 14px;
  opacity: 0;
  transform: translateY(10px);
  animation: footer-fade 0.6s ease forwards;
}

.footer-card:nth-child(1) { animation-delay: 0.05s; }
.footer-card:nth-child(2) { animation-delay: 0.15s; }
.footer-card:nth-child(3) { animation-delay: 0.25s; }

.footer-reveal { opacity: 0; }
.footer-reveal.footer-visible { opacity: 1; }

.footer-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.footer-card-header.center {
  justify-content: center;
}

.footer-card-header h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: #ffffff;
}

.footer-pill {
  width: 5px;
  height: 22px;
  background: #7ec8ff;
  border-radius: 999px;
  display: inline-block;
}

.footer-tile {
  padding: 16px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(142, 182, 231, 0.18);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
}

.tile-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(126, 200, 255, 0.16);
  color: #7ec8ff;
  display: grid;
  place-items: center;
  font-size: 24px;
}

.tile-icon.pin {
  background: rgba(88, 216, 158, 0.16);
  color: #58d89e;
}

.tile-icon.clock {
  background: rgba(243, 209, 71, 0.18);
  color: #f3d147;
}

.tile-label {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  font-size: 12px;
  color: #ffffff;
}

.tile-main {
  margin: 0;
  font-size: 19px;
  font-weight: 800;
  color: #ffffff;
}

.tile-desc {
  margin: 2px 0 0;
  color: #ffffff;
  font-size: 13px;
}

.tile-strong {
  margin: 4px 0 0;
  color: #ffffff;
  font-size: 15px;
  font-weight: 800;
}

.footer-list {
  display: grid;
  gap: 8px;
}

.footer-label {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
  color: #7ec8ff;
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer-label.whatsapp {
  color: #5ae0a0;
}

.footer-label.email {
  color: #f3d147;
}

.footer-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}

.footer-list li {
  display: flex;
  justify-content: space-between;
  color: #ffffff;
  font-size: 15px;
}

.footer-list a {
  color: #93d3ff;
  text-decoration: none;
}

.footer-list a:hover {
  text-decoration: underline;
}

.footer-text {
  margin: 0;
  text-align: center;
  color: #ffffff;
  line-height: 1.6;
  font-size: 15px;
}

.footer-social-buttons {
  display: grid;
  grid-template-columns: repeat(4, 48px);
  justify-content: center;
  column-gap: 14px;
  row-gap: 14px;
  width: fit-content;
  margin: 10px auto 0;
}

.footer-social-buttons a {
  flex: 0 0 48px;
}

.footer-social-buttons a:nth-child(-n+4) {
  order: 1;
}

.footer-social-buttons a:nth-child(n+5) {
  order: 2;
}

.footer-social-buttons a:nth-child(5) {
  grid-column: 2;
}

.footer-social-buttons a:nth-child(6) {
  grid-column: 3;
}

.footer-social-buttons a {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(142, 182, 231, 0.2);
  display: grid;
  place-items: center;
  color: #c2d2e9;
  font-size: 22px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}

.footer-social-buttons a:hover {
  transform: translateY(-4px);
  color: #93d3ff;
  box-shadow: 0 18px 32px rgba(12, 23, 41, 0.45);
}

.map-frame {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.map-frame iframe {
  width: 100%;
  height: 200px;
  border: 0;
  filter: none;
}

.hours-tile {
  border: 1px solid rgba(243, 209, 71, 0.2);
  box-shadow: 0 16px 34px rgba(12, 23, 41, 0.45);
}

.footer-seals {
  width: 100%;
  margin: 36px 0 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 12px 12px;
  overflow: hidden;
  opacity: 0;
  animation: footer-fade 0.7s ease forwards 0.35s;
}

.seals-track {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.seals-track img {
  width: auto;
  max-width: 220px;
  height: clamp(56px, 7vw, 90px);
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.25));
}

.seal-rotary {
  height: 98px;
}

.seal-social {
  height: 94px;
}

.seal-transparencia,
.seal-ong {
  height: 86px;
  background: #ffffff;
  padding: 14px;
  border-radius: 999px;
}

.seal-globalsign {
  height: 78px;
  max-width: 230px;
}

.footer-bottom {
  width: min(1200px, 100%);
  margin: 22px auto 0;
  text-align: center;
  color: #c2d2e9;
  font-size: 14px;
}

.footer-credits {
  margin: 8px 0 0;
  font-size: 12px;
  color: rgba(194, 210, 233, 0.8);
}

.footer-credits a {
  color: inherit;
  text-decoration: none;
  font-weight: 700;
}

.footer-credits a:hover {
  text-decoration: underline;
}

@keyframes footer-fade {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 960px) {
  .companies-carousel {
    grid-template-columns: 48px 1fr 48px;
    gap: 14px;
  }

  .companies-arrow {
    width: 48px;
    height: 48px;
  }

  .companies-track {
    gap: 18px;
  }

  .company-card {
    width: clamp(180px, 42vw, 230px);
  }

  .footer-inner {
    grid-template-columns: 1fr;
  }

  .footer-card {
    animation-delay: 0s !important;
  }

  .seals-track {
    justify-content: center;
    gap: 18px;
  }
}

@media (max-width: 560px) {
  .trusted-section {
    padding: 68px 16px 76px;
  }

  .trusted-title {
    margin-bottom: 0;
  }

  .companies-carousel {
    grid-template-columns: 40px 1fr 40px;
  }

  .companies-arrow {
    width: 40px;
    height: 40px;
  }

  .companies-arrow i {
    font-size: 22px;
  }

  .company-card {
    height: 120px;
  }
}

/* ========================= */
/*   SECAO JOVEM PAGE        */
/* ========================= */
.youth-page {
  background: #f3f6fb;
}

.youth-hero {
  position: relative;
  overflow: hidden;
  padding: 80px 20px 140px;
  color: #ffffff;
  background: linear-gradient(120deg, #005fa9 0%, #00579b 55%, #004c87 100%);
}

.youth-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.08), transparent 55%);
  opacity: 0.7;
}

.youth-hero::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -140px;
  width: 42%;
  height: 140%;
  background: #2d6b78;
  clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);
  opacity: 0.95;
}

.youth-hero-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 520px) 1fr;
  gap: 40px;
  align-items: center;
}

.youth-hero-text {
  display: grid;
  gap: 18px;
}

.youth-hero-title {
  margin: 0;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.05;
  font-weight: 900;
  text-transform: uppercase;
}

.youth-hero-title span {
  display: block;
  color: #f3d147;
}

.youth-hero-subtitle {
  margin: 0;
  max-width: 520px;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.6;
  color: #e6f1ff;
}

.youth-paths {
  position: relative;
  margin-top: -90px;
  padding: 0 20px 90px;
}

.youth-paths-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.youth-card {
  background: #ffffff;
  border-radius: 26px;
  padding: 34px 28px 30px;
  display: grid;
  gap: 14px;
  box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12);
  position: relative;
  min-height: 320px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.youth-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 8px;
  border-radius: 0 0 26px 26px;
  background: #f3d147;
}

.youth-card--blue::after {
  background: #1d6fd8;
}

.youth-card-icon {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 2px solid #f3d147;
  color: #f3d147;
  display: grid;
  place-items: center;
  font-size: 26px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.youth-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 54px rgba(15, 23, 42, 0.18);
}

.youth-card:hover .youth-card-icon {
  transform: translateY(-2px);
  box-shadow: 0 10px 18px rgba(11, 76, 154, 0.2);
}

.youth-card--blue .youth-card-icon {
  border-color: #1d6fd8;
  color: #1d6fd8;
}

.youth-card h2 {
  margin: 4px 0 0;
  font-size: 18px;
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.youth-card p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.6;
  font-style: italic;
}

.youth-card-cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border-radius: 999px;
  background: #0b4c9a;
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
  box-shadow: 0 10px 20px rgba(11, 76, 154, 0.2);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.youth-card-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgba(11, 76, 154, 0.3);
}

@media (max-width: 1024px) {
  .youth-hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .youth-hero-subtitle {
    margin: 0 auto;
  }

  .youth-paths {
    margin-top: -70px;
  }

  .youth-paths-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .youth-card {
    min-height: 0;
  }
}

@media (max-width: 720px) {
  .youth-hero {
    padding: 70px 18px 110px;
  }

  .youth-hero-title span {
    display: inline;
  }

  .youth-paths {
    margin-top: -50px;
    padding-bottom: 70px;
  }

  .youth-paths-inner {
    grid-template-columns: 1fr;
  }

  .youth-card {
    text-align: center;
  }

  .youth-card-icon {
    margin: 0 auto;
  }

  .youth-card-cta {
    justify-self: center;
    width: 100%;
  }
}

/* ========================= */
/*   SECAO INSTITUCIONAL     */
/* ========================= */
.institutional-page {
  background: #f2f6fb;
  color: #0f172a;
  font-family: 'Open Sans', sans-serif;
}

.institutional-hero {
  padding: 86px 20px 90px;
  background: radial-gradient(circle at 12% 20%, rgba(0, 95, 169, 0.08), transparent 55%),
              linear-gradient(120deg, #f3f7fb, #eaf2fb);
}

.institutional-grid {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 52px;
  align-items: center;
}

.institutional-copy {
  display: grid;
  gap: 18px;
}

.institutional-pill {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  padding: 8px 18px;
  border-radius: 999px;
  background: #005fa9;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 800;
  font-size: 12px;
  box-shadow: 0 12px 26px rgba(0, 95, 169, 0.25);
}

.institutional-title {
  margin: 0;
  font-size: clamp(34px, 4.8vw, 54px);
  line-height: 1.05;
  font-weight: 900;
  color: #0b3560;
}

.institutional-lead {
  margin: 0;
  font-size: 18px;
  line-height: 1.7;
  color: #334155;
  max-width: 540px;
}

.institutional-quote {
  margin: 0;
  padding: 18px 22px;
  background: #ffffff;
  border-radius: 18px;
  border-left: 6px solid #f3d147;
  font-size: 17px;
  font-style: italic;
  color: #1e293b;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.1);
}

.institutional-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.institutional-cta {
  font-size: 18px;
  padding: 12px 26px;
  box-shadow: 0 14px 30px rgba(243, 209, 71, 0.4);
}

.institutional-media {
  position: relative;
  display: grid;
  place-items: center;
}

.institutional-blob {
  position: absolute;
  inset: -26px -22px -30px 24px;
  border-radius: 40px;
  background: #f3d147;
  transform: rotate(-2deg);
  z-index: 0;
  box-shadow: 0 26px 60px rgba(243, 209, 71, 0.4);
}

.institutional-photo {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 36px;
  border: 8px solid #ffffff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
}

.history-section {
  padding: 94px 20px 110px;
  background: #ffffff;
}

.history-grid {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
}

.history-text {
  display: grid;
  gap: 16px;
}

.history-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 800;
  font-size: 12px;
  color: #005fa9;
}

.history-title {
  margin: 0;
  font-size: clamp(30px, 3.8vw, 48px);
  line-height: 1.1;
  font-weight: 900;
  color: #0b3560;
}

.history-text p {
  margin: 0;
  color: #475569;
  line-height: 1.7;
  font-size: 16px;
}

.history-list {
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
  display: grid;
  gap: 10px;
  color: #334155;
  font-size: 16px;
}

.history-list li {
  position: relative;
  padding-left: 22px;
}

.history-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #f3d147;
}

.history-media {
  display: grid;
  gap: 16px;
  justify-items: center;
  text-align: center;
}

.history-ring {
  width: min(360px, 80vw);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 10px solid #f3d147;
  position: relative;
  display: grid;
  place-items: center;
  box-shadow: 0 22px 50px rgba(15, 23, 42, 0.16);
}

.history-ring::after {
  content: "";
  position: absolute;
  inset: 16px;
  border-radius: 50%;
  border: 6px solid #005fa9;
}

.history-photo {
  width: calc(100% - 52px);
  height: calc(100% - 52px);
  border-radius: 50%;
  object-fit: cover;
  border: 6px solid #ffffff;
  z-index: 1;
}

.history-controls {
  display: flex;
  gap: 12px;
}

.history-arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(0, 95, 169, 0.2);
  background: #ffffff;
  color: #005fa9;
  display: grid;
  place-items: center;
  font-size: 20px;
  cursor: pointer;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
  transition: transform 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.history-arrow:hover {
  transform: translateY(-2px);
  color: #f3d147;
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.16);
}

.history-caption {
  margin: 0;
  color: #64748b;
  font-size: 14px;
}

.values-section {
  padding: 96px 20px 110px;
  background: #f8fafc;
}

.values-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 28px;
}

.values-header {
  text-align: center;
  display: grid;
  gap: 10px;
}

.values-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 800;
  font-size: 12px;
  color: #005fa9;
}

.values-title {
  margin: 0;
  font-size: clamp(28px, 3.6vw, 44px);
  font-weight: 900;
  color: #0b3560;
}

.values-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 340px));
  gap: 32px;
  justify-content: center;
}

.values-card {
  background: #ffffff;
  border-radius: 26px;
  padding: 40px 32px;
  display: grid;
  gap: 18px;
  min-height: 340px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
  border: 2px solid rgba(15, 23, 42, 0.06);
  text-align: center;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.values-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.14);
  border-color: rgba(0, 95, 169, 0.18);
}

.values-icon {
  width: 86px;
  height: 86px;
  border-radius: 18px;
  background: rgba(243, 209, 71, 0.12);
  color: #f3d147;
  display: grid;
  place-items: center;
  font-size: 40px;
  margin: 0 auto;
}

.values-card h3 {
  margin: 0;
  color: #005fa9;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 22px;
  font-weight: 900;
}

.values-card p {
  margin: 0;
  color: #475569;
  line-height: 1.7;
  font-size: 15px;
}

.values-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  color: #475569;
  font-size: 15px;
  line-height: 1.65;
}

.values-card li::before {
  content: "•";
  color: #f3d147;
  margin-right: 8px;
}

.values-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 6px;
}

.values-divider span {
  width: min(360px, 36vw);
  height: 2px;
  background: #f3d147;
  display: block;
}

.values-divider i {
  font-size: 22px;
  color: #005fa9;
  background: #ffffff;
  border: 2px solid #f3d147;
  border-radius: 999px;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.12);
}

.structure-section {
  padding: 96px 20px 110px;
  background: #f2f6fb;
}

.structure-stage {
  display: grid;
  gap: 24px;
}

.structure-panel {
  display: none;
}

.structure-panel.is-active {
  display: block;
}

.structure-card {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  background: #ffffff;
  border-radius: 36px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(15, 23, 42, 0.12);
}

.structure-media {
  position: relative;
  min-height: 360px;
}

.structure-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.structure-media-controls {
  position: absolute;
  left: 24px;
  bottom: 24px;
  display: flex;
  gap: 10px;
}

.structure-carousel-btn {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #ffffff;
  color: #0b4c9a;
  border: 0;
  display: grid;
  place-items: center;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
  cursor: pointer;
  font-size: 20px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.structure-carousel-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.25);
}

.structure-content {
  padding: 54px 52px;
  display: grid;
  gap: 18px;
  align-content: center;
}

.structure-title {
  margin: 0;
  font-size: clamp(28px, 3.6vw, 44px);
  font-weight: 900;
  color: #005fa9;
}

.structure-text {
  margin: 0;
  color: #475569;
  line-height: 1.7;
  font-size: 16px;
}

.structure-actions {
  display: flex;
  gap: 20px;
  margin-top: 10px;
}

.structure-action {
  display: grid;
  gap: 8px;
  justify-items: center;
  text-decoration: none;
  color: #005fa9;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 12px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.structure-icon {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #0b4c9a;
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 28px;
  box-shadow: 0 14px 30px rgba(11, 76, 154, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.structure-action:hover .structure-icon {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(11, 76, 154, 0.45);
}

.structure-label {
  color: #0b4c9a;
}

.structure-panel {
  padding: 80px 20px;
  background: #ffffff;
}

.structure-panel-card {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  border-radius: 36px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 26px 60px rgba(15, 23, 42, 0.12);
}

.structure-panel-media {
  position: relative;
  min-height: 360px;
  background: linear-gradient(180deg, #f1f5f9 0%, #e2e8f0 100%);
}

.structure-panel-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.structure-panel-arrows {
  position: absolute;
  left: 24px;
  bottom: 24px;
  display: flex;
  gap: 12px;
}

.structure-panel-arrows .structure-carousel-btn {
  width: 44px;
  height: 44px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
}

.structure-panel-content {
  padding: 54px 52px;
  display: grid;
  gap: 18px;
  align-content: center;
}

.structure-panel-title {
  margin: 0;
  font-size: clamp(26px, 3.4vw, 40px);
  color: #0b4c9a;
  font-weight: 900;
}

.structure-panel-content p {
  margin: 0;
  color: #475569;
  line-height: 1.7;
  font-size: 16px;
}

.structure-back {
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 26px;
  border-radius: 999px;
  background: #f3d147;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  box-shadow: 0 16px 30px rgba(243, 209, 71, 0.35);
  border: 0;
  cursor: pointer;
}

.structure-back:hover {
  background: #f1c933;
}

.team-section {
  padding: 96px 20px 110px;
  background: #f8fafc;
}

.team-stage {
  display: grid;
  gap: 24px;
}

.team-panel {
  display: none;
}

.team-panel.is-active {
  display: block;
}

.team-card {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 40px;
  background: #ffffff;
  border-radius: 36px;
  padding: 40px;
  box-shadow: 0 30px 70px rgba(15, 23, 42, 0.12);
  align-items: center;
}

.team-media {
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 20px 44px rgba(15, 23, 42, 0.18);
}

.team-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  min-height: 320px;
}

.team-content {
  display: grid;
  gap: 18px;
}

.team-title {
  margin: 0;
  font-size: clamp(28px, 3.8vw, 46px);
  font-weight: 900;
  color: #005fa9;
}

.team-text {
  margin: 0;
  color: #475569;
  line-height: 1.7;
  font-size: 16px;
}

.team-cta {
  width: fit-content;
  padding: 14px 32px;
  border-radius: 999px;
  border: 0;
  background: #f3d147;
  color: #0b4c9a;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: 0 16px 30px rgba(243, 209, 71, 0.35);
}

.team-directory {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 28px;
}

.team-back {
  justify-self: start;
  border: 0;
  background: none;
  color: #0b4c9a;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.team-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.team-filter {
  border: 0;
  padding: 10px 22px;
  border-radius: 999px;
  background: #ffffff;
  color: #0b4c9a;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
  cursor: pointer;
}

.team-filter.is-active {
  background: #0b4c9a;
  color: #ffffff;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(240px, 1fr));
  gap: 24px;
  justify-items: stretch;
}

.team-break {
  grid-column: 1 / -1;
  height: 0;
  padding: 0;
  margin: 0;
}

@media (min-width: 1024px) {
  .team-grid .team-member:nth-child(1) {
    grid-column: 1;
    transform: translate(135px);
  }

  .team-grid .team-member:nth-child(2) {
    grid-column: 2;
    transform: translateX(135px);
  }

  .team-grid .team-member:nth-child(3) {
    grid-column: 3;
    transform: translateX(135px);
  }
}


.team-member {
  background: #ffffff;
  border-radius: 26px;
  padding: 28px 20px;
  text-align: center;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.1);
  display: grid;
  gap: 10px;
  min-height: 260px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  will-change: transform, opacity;
}

.team-member:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 40px rgba(15, 23, 42, 0.16);
}

.team-member img {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto;
  border: 6px solid #f1f5f9;
}

.team-member h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: 18px;
  font-weight: 900;
}

.team-member p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 600;
}

.team-member a {
  color: #0b4c9a;
  font-weight: 700;
  text-decoration: none;
  font-size: 13px;
  display: block;
  min-height: 34px;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.team-member a:hover {
  text-decoration: underline;
}

.team-grid.is-animating .team-member {
  animation: team-fade-up 0.45s ease both;
}

@keyframes team-fade-up {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.presidents-section {
  padding: 96px 20px 110px;
  background: #ffffff;
}

.presidents-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 36px;
}

.presidents-header {
  display: grid;
  gap: 12px;
}

.presidents-title {
  margin: 0;
  font-size: clamp(28px, 4vw, 44px);
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.presidents-subtitle {
  margin: 0;
  color: #475569;
  font-size: 16px;
  line-height: 1.6;
}

.presidents-carousel {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
}

.presidents-arrow {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 0;
  display: grid;
  place-items: center;
  font-size: 24px;
  cursor: pointer;
  color: #ffffff;
  background: #0b4c9a;
  box-shadow: 0 16px 30px rgba(11, 76, 154, 0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.presidents-arrow:disabled {
  background: #9fb5d5;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.8;
}

.presidents-arrow:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 36px rgba(11, 76, 154, 0.35);
}

.presidents-window {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.presidents-track {
  list-style: none;
  display: flex;
  gap: 28px;
  margin: 0;
  padding: 10px 4px;
  scroll-snap-align: start;
}

.president-card {
  background: transparent;
  border-radius: 0;
  padding: 0;
  text-align: center;
  box-shadow: none;
  border: 0;
  transition: transform 0.18s ease;
  flex: 0 0 auto;
  width: clamp(200px, 20vw, 240px);
  scroll-snap-align: center;
}

.president-card:hover {
  transform: translateY(-3px);
}

.president-card.is-active {
  transform: translateY(-4px);
}

.president-card.is-active img {
  box-shadow: 0 0 0 2px rgba(248, 209, 71, 0.45), 0 8px 18px rgba(248, 209, 71, 0.28);
}

.president-card img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
  border: 6px solid #f1f5f9;
  margin: 0 auto 12px;
  display: block;
  transition: box-shadow 0.18s ease;
}

.president-card:hover img {
  box-shadow: 0 6px 14px rgba(11, 76, 154, 0.14);
}

.president-card h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 800;
}

.president-card p {
  margin: 10px 0 0;
  color: #94a3b8;
  font-weight: 600;
  font-size: 12px;
}

.presidents-window::-webkit-scrollbar {
  display: none;
}

.presidents-progress {
  display: grid;
  gap: 10px;
  justify-items: center;
}

.presidents-progress-track {
  width: min(600px, 80vw);
  height: 4px;
  background: #e2e8f0;
  border-radius: 999px;
  position: relative;
  overflow: hidden;
}

.presidents-progress-fill {
  position: absolute;
  inset: 0;
  width: 16.66%;
  background: #f3d147;
  border-radius: 999px;
  transition: width 0.2s ease;
}

.presidents-progress-label {
  color: #94a3b8;
  font-weight: 700;
}

.certifications-section {
  padding: 96px 20px 110px;
  background: #f8fafc;
}

.certifications-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 36px;
}

.certifications-header {
  text-align: center;
  display: grid;
  gap: 12px;
  justify-items: center;
}

.certifications-title {
  margin: 0;
  font-size: clamp(30px, 4vw, 46px);
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.certifications-underline {
  width: 110px;
  height: 4px;
  border-radius: 999px;
  background: #f3d147;
}

.certifications-subtitle {
  margin: 0;
  color: #0b4c9a;
  font-size: 16px;
}

.certifications-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 26px;
}

.certification-card {
  background: #ffffff;
  border-radius: 28px;
  padding: 32px 26px 48px;
  display: grid;
  gap: 12px;
  text-align: center;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.08);
  position: relative;
  min-height: 240px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  grid-column: span 3;
}

.certification-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 42px rgba(15, 23, 42, 0.12);
}

.certification-card:nth-child(-n + 3) {
  grid-column: span 4;
  min-height: 320px;
  padding: 40px 32px 56px;
}

.certification-icon {
  width: 68px;
  height: 68px;
  border-radius: 20px;
  background: rgba(0, 95, 169, 0.08);
  color: #005fa9;
  display: grid;
  place-items: center;
  margin: 0 auto 6px;
  font-size: 30px;
}

.certification-card h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: 16px;
  font-weight: 900;
}

.certification-card h4 {
  margin: 10px 0 0;
  color: #0b4c9a;
  font-size: 14px;
  font-weight: 900;
}

.certification-card p {
  margin: 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

.certification-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
  color: #64748b;
  font-size: 11px;
  line-height: 1.5;
}

.certification-card ul li::before {
  content: "•";
  color: #f3d147;
  margin-right: 6px;
}

.certification-note {
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: #94a3b8;
}

.certification-validity {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: #28a745;
  color: #ffffff;
  font-weight: 800;
  padding: 10px 12px;
  border-radius: 0 0 24px 24px;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
}

.documents-section {
  padding: 96px 20px 110px;
  background: #ffffff;
}

.documents-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 32px;
}

.documents-header {
  text-align: center;
  display: grid;
  gap: 10px;
}

.documents-title {
  margin: 0;
  font-size: clamp(28px, 4vw, 44px);
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.documents-subtitle {
  margin: 0;
  color: #0b4c9a;
  font-size: 14px;
}

.documents-note {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 22px;
  border-radius: 24px;
  background: #0b4c9a;
  color: #f3f7ff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12),
              0 18px 36px rgba(11, 76, 154, 0.22);
  max-width: 640px;
  margin: 0 auto;
}

.documents-note-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(243, 209, 71, 0.2);
  color: #f3d147;
  font-size: 18px;
  flex-shrink: 0;
}

.documents-note p {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
}

.compliance-highlight {
  display: grid;
  place-items: center;
  margin-top: 24px;
}

.compliance-highlight-card {
  width: min(1100px, 100%);
  box-sizing: border-box;
  background: #fffaf2;
  border: 2px solid #f3d147;
  border-radius: 42px;
  padding: 42px 48px;
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 32px;
  align-items: center;
  box-shadow: 0 20px 46px rgba(15, 23, 42, 0.12);
}

.compliance-highlight-icon {
  width: 130px;
  height: 130px;
  border-radius: 8px;
  background: #0b4c9a;
  color: #f3d147;
  display: grid;
  place-items: center;
  font-size: 62px;
  box-shadow: 0 16px 30px rgba(11, 76, 154, 0.28);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.compliance-highlight-icon:hover {
  background: #0a3f7f;
  transform: translateY(-3px);
  box-shadow: 0 20px 36px rgba(11, 76, 154, 0.35);
}

.compliance-highlight-content h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: clamp(22px, 2.8vw, 32px);
  font-weight: 900;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.compliance-highlight-content p {
  margin: 12px 0 0;
  color: #1f3b63;
  font-size: 16px;
  line-height: 1.7;
  max-width: 720px;
}

.compliance-highlight-btn {
  margin-top: 22px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 32px;
  border-radius: 999px;
  background: #0b4c9a;
  color: #ffffff;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 16px 34px rgba(11, 76, 154, 0.3);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.compliance-highlight-btn:hover {
  background: #083d7b;
  transform: translateY(-2px);
  box-shadow: 0 20px 40px rgba(11, 76, 154, 0.35);
}

.compliance-highlight-btn:focus-visible {
  outline: 3px solid rgba(11, 76, 154, 0.35);
  outline-offset: 4px;
}

.documents-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
}

.documents-card {
  background: #f8fafc;
  border-radius: 26px;
  padding: 24px;
  display: grid;
  gap: 16px;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
}

.documents-card-wide {
  margin: 0 auto;
  width: min(900px, 100%);
}

.documents-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.documents-card-header h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 900;
}

.documents-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  background: #0b4c9a;
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 22px;
}

.documents-list {
  display: grid;
  gap: 12px;
}

.documents-list-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.document-item {
  background: #ffffff;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.06);
  position: relative;
}

.document-item > div {
  min-width: 0;
  flex: 1 1 auto;
}

.document-open {
  position: absolute;
  inset: 0;
  border-radius: 12px;
  z-index: 1;
  cursor: pointer;
}

.document-item h4 {
  margin: 0;
  font-size: 12px;
  color: #0b4c9a;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.document-item p {
  margin: 4px 0 0;
  font-size: 10px;
  color: #64748b;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.document-download {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #0b4c9a;
  color: #ffffff;
  display: grid;
  place-items: center;
  text-decoration: none;
  flex: 0 0 auto;
  position: relative;
  z-index: 2;
  font-size: 14px;
}

.documents-tabs {
  margin-left: auto;
  display: flex;
  gap: 6px;
}

.documents-tab {
  border: 1px solid rgba(11, 76, 154, 0.2);
  background: #ffffff;
  color: #0b4c9a;
  border-radius: 8px;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.documents-tab.is-active {
  background: #f3d147;
  border-color: #f3d147;
}

.documents-scroll {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
}

.documents-scroll-body {
  max-height: 290px;
  overflow-y: auto;
  padding-right: 6px;
}

.documents-scroll-body::-webkit-scrollbar {
  width: 6px;
}

.documents-scroll-body::-webkit-scrollbar-thumb {
  background: #9fb5d5;
  border-radius: 999px;
}

.documents-scroll-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 0;
  background: #e2e8f0;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  cursor: pointer;
}

.documents-list[data-doc-year] {
  display: none;
}

.documents-list[data-doc-year].is-active {
  display: grid;
}

@media (max-width: 960px) {
  .institutional-grid,
  .history-grid {
    grid-template-columns: 1fr;
  }

  .institutional-hero,
  .history-section {
    padding: 72px 16px;
  }

  .company-hero {
    padding: 72px 16px 90px;
  }

  .company-hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .company-hero-inner::before {
    inset: -40px auto auto 50%;
    transform: translateX(-50%);
  }

  .company-hero-content {
    justify-items: center;
  }

  .company-hero-actions {
    justify-content: center;
  }

  .company-steps-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .company-steps-media {
    justify-items: center;
  }

  .company-photo-caption {
    left: 50%;
    transform: translateX(-50%);
  }

  .company-steps-cta {
    justify-self: center;
  }

  .company-diff-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .institutional-copy,
  .history-text {
    text-align: center;
  }

  .institutional-pill {
    justify-self: center;
  }

  .institutional-actions {
    justify-content: center;
  }

  .structure-card,
  .structure-panel-card {
    grid-template-columns: 1fr;
  }

  .structure-content,
  .structure-panel-content {
    padding: 40px 32px 48px;
    text-align: center;
  }

  .structure-actions {
    justify-content: center;
  }

  .team-card {
    grid-template-columns: 1fr;
    padding: 32px;
    text-align: center;
  }

  .team-cta {
    justify-self: center;
  }

  .team-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .values-grid {
    grid-template-columns: 1fr;
  }

  .presidents-carousel {
    grid-template-columns: 44px 1fr 44px;
  }

  .presidents-arrow {
    width: 44px;
    height: 44px;
    font-size: 20px;
  }

  .certifications-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .certification-card,
  .certification-card:nth-child(-n + 3) {
    grid-column: span 1;
    min-height: 260px;
    padding: 32px 26px 48px;
  }

  .compliance-highlight-card {
    grid-template-columns: 1fr;
    text-align: center;
    padding: 34px 32px;
  }

  .compliance-highlight-icon {
    margin: 0 auto;
  }

  .compliance-highlight-btn {
    justify-content: center;
  }

  .documents-grid {
    grid-template-columns: 1fr;
  }

  .documents-list-grid {
    grid-template-columns: 1fr;
  }
}

/* ========================= */
/*      PAGINA APROVADOS     */
/* ========================= */
.approved-page {
  background: #f2f6fb;
  color: #0f172a;
  font-family: 'Open Sans', sans-serif;
}

.approved-main {
  display: grid;
  gap: 0;
}

.approved-hero {
  position: relative;
  padding: 96px 20px 140px;
  background: radial-gradient(circle at 50% 40%, rgba(255, 255, 255, 0.12), transparent 55%),
              linear-gradient(120deg, #004c87 0%, #005fa9 60%, #00407a 100%);
  color: #ffffff;
  overflow: hidden;
}

.approved-hero::before {
  content: "";
  position: absolute;
  inset: -120px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0 30%, transparent 30% 100%);
  opacity: 0.6;
}

.approved-hero-inner {
  width: min(1100px, 100%);
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
}

.approved-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 12px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.78);
}

.approved-title {
  margin: 0;
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 900;
  letter-spacing: -0.01em;
}

.approved-subtitle {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
}

.approved-divider {
  width: 82px;
  height: 4px;
  border-radius: 999px;
  background: #f3d147;
  margin: 10px auto 0;
}

.approved-info {
  padding: 20px 20px 96px;
  margin-top: -40px;
}

.approved-search {
  margin-top: -120px;
  padding: 60px 20px 30px;
  position: relative;
  z-index: 3;
}

.approved-main-closed .approved-search {
  margin-top: 0;
  padding-top: 90px;
  padding-bottom: 90px;
}

.approved-main-closed .approved-search-inner {
  width: min(720px, 100%);
}

.approved-search-inner {
  width: min(1100px, 100%);
  margin: 0 auto;
  background: #ffffff;
  border-radius: 44px;
  padding: 40px 44px 48px;
  box-sizing: border-box;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
  display: grid;
  gap: 20px;
}

.approved-search-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.approved-search-header h2 {
  margin: 0;
  text-transform: uppercase;
  font-weight: 900;
  color: #0b4c9a;
  font-size: 24px;
}

.approved-search-header p {
  margin: 4px 0 0;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 11px;
  font-weight: 700;
}

.approved-search-form {
  display: flex;
  gap: 10px;
  align-items: center;
  background: #f1f5f9;
  border-radius: 999px;
  padding: 10px 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  flex: 0 1 420px;
  max-width: 100%;
  box-sizing: border-box;
}

.approved-search-form input {
  flex: 1 1 auto;
  min-width: 0;
  border: none;
  background: transparent;
  padding: 0;
  font-size: 14px;
  color: #475569;
}

.approved-search-form i {
  color: #94a3b8;
  font-size: 16px;
}

.approved-search-message,
.approved-search-feedback {
  margin: 0;
  font-size: 14px;
  color: #475569;
  text-align: center;
}

.approved-results-card {
  background: #ffffff;
  border-radius: 26px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.approved-results-head {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 12px;
  background: #0b4c9a;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 11px;
  padding: 16px 22px;
  font-weight: 700;
}

.approved-results-body {
  min-height: 220px;
  background: #ffffff;
  padding: 20px 22px;
  display: grid;
  gap: 14px;
  max-height: 420px;
  overflow-y: auto;
}

.approved-results-row {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 12px;
  align-items: center;
  font-size: 14px;
  color: #1f3b63;
}

.approved-results-row strong {
  font-weight: 800;
}

.approved-results-row span {
  color: #64748b;
  font-size: 13px;
}

.approved-results-row span small {
  display: block;
  color: #94a3b8;
}

.approved-results-empty {
  display: grid;
  justify-items: center;
  align-content: center;
  text-align: center;
  gap: 12px;
  color: #cbd5f5;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.08em;
  min-height: 160px;
}

.approved-results-icon {
  width: 54px;
  height: 30px;
  border-radius: 20px;
  background: #e2e8f0;
  position: relative;
}

.approved-results-icon::before,
.approved-results-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 34px;
  height: 6px;
  border-radius: 999px;
  background: #cbd5e1;
  transform: translateX(-50%);
}

.approved-results-icon::before {
  top: 8px;
}

.approved-results-icon::after {
  top: 18px;
  width: 22px;
}

.approved-closed-card {
  display: grid;
  justify-items: center;
  gap: 16px;
  padding: 40px 28px;
  border-radius: 36px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #ffffff;
  box-shadow: 0 24px 40px rgba(15, 23, 42, 0.12);
}

.approved-closed-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: #fff3c4;
  color: #d19600;
  display: grid;
  place-items: center;
  font-size: 32px;
  box-shadow: 0 14px 28px rgba(209, 150, 0, 0.2);
}

.approved-closed-icon i {
  animation: approved-bounce 1.4s ease-in-out infinite;
}

.approved-closed-title {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  font-weight: 900;
  font-size: 28px;
  color: #0b4c9a;
}

.approved-closed-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #64748b;
  max-width: 520px;
}

.approved-closed-text strong {
  color: #0b4c9a;
}

.approved-closed-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  background: #eef5ff;
  color: #0b4c9a;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.approved-closed-pill i {
  font-size: 14px;
}

@keyframes approved-bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

.approved-results h2 {
  margin: 0 0 10px;
  font-size: 16px;
  color: #0b4c9a;
  text-transform: uppercase;
  font-weight: 900;
}

.approved-results ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.approved-results li {
  background: #f8fbff;
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(11, 76, 154, 0.1);
  display: grid;
  gap: 4px;
}

.approved-results li span {
  font-size: 12px;
  color: #475569;
}

.approved-info-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 32px;
  align-items: start;
}

.approved-panel {
  background: #ffffff;
  border-radius: 28px;
  padding: 32px;
  box-shadow: 0 22px 40px rgba(15, 23, 42, 0.12);
  display: grid;
  gap: 18px;
}

.approved-panel-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.approved-panel-bar {
  width: 4px;
  height: 28px;
  border-radius: 999px;
  background: #f3d147;
}

.approved-panel-header h2 {
  margin: 0;
  font-size: 20px;
  text-transform: uppercase;
  font-weight: 900;
  color: #0b4c9a;
}

.approved-panel-text {
  margin: 0;
  color: #475569;
  line-height: 1.6;
  font-size: 15px;
}

.approved-docs-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.approved-doc-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(11, 76, 154, 0.1);
  background: #f8fbff;
}

.approved-doc-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(11, 76, 154, 0.12);
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 20px;
}

.approved-doc-card h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: #0b4c9a;
  text-transform: uppercase;
}

.approved-doc-card p {
  margin: 2px 0 0;
  font-size: 12px;
  color: #64748b;
}

.approved-alert {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 16px;
  border-radius: 16px;
  background: #fff1f1;
  color: #b42318;
  border: 1px solid rgba(220, 38, 38, 0.2);
}

.approved-alert-icon {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  background: rgba(220, 38, 38, 0.12);
  display: grid;
  place-items: center;
}

.approved-alert p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 600;
}

.approved-location-card {
  display: grid;
  gap: 16px;
  padding: 18px;
  border-radius: 20px;
  background: #f6f9ff;
  border: 1px solid rgba(11, 76, 154, 0.12);
}

.approved-location-info {
  display: grid;
  gap: 8px;
}

.approved-location-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: #0b4c9a;
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 20px;
}

.approved-location-info h3 {
  margin: 0;
  color: #0b4c9a;
  font-size: 16px;
  font-weight: 800;
}

.approved-location-info p {
  margin: 0;
  font-size: 13px;
  color: #475569;
}

.approved-location-link {
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #0b4c9a;
  text-decoration: none;
}

.approved-location-card-alt {
  background: #0b4c9a;
  color: #ffffff;
  border-radius: 32px;
  padding: 28px;
  display: grid;
  gap: 18px;
  box-shadow: 0 24px 48px rgba(11, 76, 154, 0.32);
}

.approved-location-header h2 {
  margin: 0;
  text-transform: uppercase;
  font-weight: 900;
  font-size: 20px;
}

.approved-location-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
}

.approved-location-item h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
}

.approved-location-item p {
  margin: 4px 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
}

.approved-location-card-alt .approved-location-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.14);
  color: #f3d147;
  display: grid;
  place-items: center;
  font-size: 22px;
}

.approved-location-card-alt .approved-map iframe {
  border-radius: 20px;
  height: 230px;
}

.approved-location-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 20px;
  box-sizing: border-box;
  max-width: 100%;
  border-radius: 999px;
  background: #f3c633;
  color: #0b4c9a;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
}

.approved-map iframe {
  width: 100%;
  height: 220px;
  border: 0;
  border-radius: 16px;
}

.approved-help {
  background: #0b4c9a;
  color: #ffffff;
  padding: 24px;
  border-radius: 24px;
  display: grid;
  gap: 16px;
  box-shadow: 0 20px 36px rgba(11, 76, 154, 0.25);
}

.approved-help h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.approved-help-actions {
  display: grid;
  gap: 10px;
}

.approved-help-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
  text-decoration: none;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.approved-help-item span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.approved-help-item:hover {
  background: rgba(255, 255, 255, 0.25);
}

.approved-download:hover {
  background: #f3d147;
  color: #0b4c9a;
}

.approved-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 999px;
  background: #ffffff;
  color: #0b4c9a;
  text-decoration: none;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
}

@media (max-width: 720px) {
  .team-grid {
    grid-template-columns: 1fr;
  }

  .certifications-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .institutional-photo {
    border-radius: 24px;
  }

  .institutional-blob {
    inset: -16px -10px -22px 16px;
    border-radius: 28px;
  }

  .company-hero-card {
    padding: 18px;
  }

  .company-card-inner {
    padding: 28px 22px;
  }

  .company-photo-frame {
    padding: 12px;
  }

  .company-photo img {
    height: 300px;
  }

  .company-steps-inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .company-steps-media,
  .company-steps-content {
    display: contents;
  }

  .company-photo-frame {
    order: 1;
  }

  .company-step-card {
    order: 2;
  }

  .company-photo-caption {
    order: 3;
  }

  .company-steps-cta {
    order: 4;
  }

  .company-steps {
    padding-top: 56px;
  }

  .company-steps-title {
    padding: 0 6px;
    margin-bottom: 24px;
  }

  .company-photo-frame {
    margin-top: 0;
  }

  .company-photo-caption {
    position: static;
    transform: none;
    margin-top: 18px;
    max-width: 100%;
    text-align: center;
  }

  .company-step-card {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }

  .company-diff-grid {
    grid-template-columns: 1fr;
  }

  .documents-section {
    padding: 72px 14px 90px;
  }

  .documents-inner {
    width: 100%;
  }

  .compliance-highlight {
    padding: 0 10px;
    justify-items: center;
  }

  .compliance-highlight-card {
    width: 100%;
    max-width: 520px;
    border-radius: 30px;
    padding: 24px 18px;
    margin: 0 auto;
  }

  .compliance-highlight-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    white-space: normal;
    line-height: 1.2;
    font-size: 12px;
    padding: 12px 16px;
    letter-spacing: 0.02em;
    max-width: 260px;
    margin: 12px auto 0;
  }

  .documents-card {
    padding: 20px;
  }

  .documents-note {
    max-width: 100%;
  }
}
html {
  overflow-x: hidden;
}

body {
  overflow-x: visible;
}

/* Vagas */
.jobs-page {
  background: #f3f6fb;
}

.jobs-hero {
  background: linear-gradient(135deg, #0b4a8a 0%, #0b6db5 60%, #0a5ea2 100%);
  color: #fff;
  padding: 100px 0 160px;
  position: relative;
  overflow: hidden;
}

.jobs-hero::before,
.jobs-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}

.jobs-hero::before {
  width: 520px;
  height: 520px;
  top: -200px;
  right: 10%;
}

.jobs-hero::after {
  width: 360px;
  height: 360px;
  bottom: -160px;
  left: 8%;
}

.jobs-hero-inner {
  width: min(1200px, 92%);
  margin: 0 auto;
  text-align: center;
  display: grid;
  gap: 16px;
}

.jobs-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  margin: 0 auto;
}

.jobs-title {
  font-size: clamp(36px, 4.5vw, 64px);
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}

.jobs-title span {
  color: #f6c21c;
}

.jobs-underline {
  width: 120px;
  height: 6px;
  border-radius: 999px;
  background: #dbe4f1;
  margin: 12px auto 0;
}

.jobs-hero p {
  font-size: 16px;
  margin: 0 auto;
  max-width: 640px;
  color: rgba(255, 255, 255, 0.8);
}

.jobs-section {
  margin-top: -110px;
  padding: 0 0 120px;
}

.jobs-container {
  width: min(1200px, 92%);
  margin: 0 auto;
  display: grid;
  gap: 32px;
}

.jobs-empty {
  background: #fff;
  border-radius: 32px;
  padding: 48px;
  text-align: center;
  box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12);
}

.jobs-empty h2 {
  margin: 0 0 12px;
  color: #0b4a8a;
}

  .job-card {
    display: grid;
    grid-template-columns: 260px 1fr;
    background: #fff;
    border-radius: 36px;
    overflow: hidden;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12);
  }

  .job-card-left {
    background: linear-gradient(180deg, #0b3d74 0%, #0b6db5 100%);
    color: #fff;
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
  }

  .job-card-left::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, 0.15) 1px, transparent 1px);
    background-size: 18px 18px;
    opacity: 0.65;
    pointer-events: none;
  }

  .job-card-left > * {
    position: relative;
    z-index: 1;
  }

.job-type {
  background: #f6c21c;
  color: #0b4a8a;
  font-weight: 800;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  text-transform: uppercase;
}

  .job-title-stack {
    font-size: 58px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 0.95;
  }

.job-company {
  font-weight: 700;
  background: rgba(255, 255, 255, 0.18);
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
}

.job-logo {
  max-width: 120px;
  height: auto;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.1);
  padding: 8px;
}

.job-card-right {
  padding: 32px 36px 28px;
  display: grid;
  gap: 20px;
}

.job-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}

.job-badge {
  display: inline-block;
  background: #eff5ff;
  color: #0b4a8a;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  text-transform: uppercase;
}

.job-header h2 {
  margin: 12px 0 0;
  font-size: 28px;
  color: #0b4a8a;
}

.job-cover {
  width: 200px;
  height: 120px;
  border-radius: 24px;
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 0 16px 28px rgba(15, 23, 42, 0.15);
}

.job-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

  .job-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 28px;
    align-items: start;
  }

  .job-details {
    display: grid;
    gap: 18px;
  }

  .job-info-item {
    --accent: #f6c21c;
    display: grid;
    gap: 8px;
  }

  .job-info-item--courses {
    --accent: #f6c21c;
  }

  .job-info-item--requirements {
    --accent: #18b37f;
  }

  .job-info-item--activities {
    --accent: #2a71d0;
  }

  .job-info-label {
    font-weight: 800;
    color: #0b4a8a;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.08em;
    position: relative;
    padding-left: 14px;
  }

  .job-info-label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 4px;
    height: 14px;
    border-radius: 999px;
    background: var(--accent);
  }

  .job-info-item p {
    margin: 0;
    color: #374151;
    line-height: 1.5;
  }

  .job-requirements {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 8px;
  }

  .job-requirements li {
    margin: 0;
    padding-left: 22px;
    position: relative;
    color: #4b5563;
  }

  .job-requirements li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    border: 2px solid #18b37f;
  }

  .job-benefits-card {
    background: #f5f8ff;
    border-radius: 26px;
    padding: 22px;
    box-shadow: inset 0 0 0 1px #e2eaf6;
    box-sizing: border-box;
    display: grid;
    gap: 12px;
  }

  .job-benefits-card h4 {
    margin: 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #7a8ba7;
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }

  .job-benefits-card h4 i {
    color: #f6c21c;
  }

  .job-benefits-body {
    font-weight: 700;
    color: #0b4a8a;
    line-height: 1.5;
  }

.job-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-weight: 600;
  color: #0b4a8a;
}

.job-meta span {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  background: #eef4ff;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
}

  .job-apply {
    background: #f5f8ff;
    border-radius: 24px;
    padding: 18px 20px;
    display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}

.job-apply-text {
  display: grid;
  gap: 10px;
}

.job-apply-text span {
  font-weight: 800;
  color: #0b4a8a;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.08em;
}

  .job-apply-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .job-apply-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
  }

  .job-apply-qr {
    border: 2px dashed #f6c21c;
    border-radius: 18px;
    padding: 10px;
    background: #fff;
    min-width: 110px;
    min-height: 110px;
    display: grid;
    place-items: center;
  }

  .job-apply-qr img {
    width: 90px;
    height: 90px;
    object-fit: contain;
  }

.job-apply-btn.email {
  background: #e6f2ff;
  color: #0b4a8a;
}

.job-apply-btn.whatsapp {
  background: #1fb05d;
  color: #fff;
}

.job-apply-btn.link {
  background: #f6c21c;
  color: #0b4a8a;
}

.job-apply-note {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
}

.job-apply-qr img {
  width: 88px;
  height: 88px;
  border-radius: 16px;
  background: #fff;
  padding: 6px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
}

.jobs-inline {
  padding: 40px 0 120px;
  background: #f3f6fb;
}

.jobs-inline .jobs-hero-inner {
  width: min(1200px, 92%);
  margin: 0 auto 30px;
  text-align: center;
}

.jobs-inline .jobs-title {
  font-size: clamp(32px, 3.5vw, 48px);
  color: #0b4a8a;
}

.jobs-inline .jobs-underline {
  margin: 12px auto 0;
}

.jobs-inline .jobs-hero-inner p {
  margin: 0;
  color: #64748b;
}

/* Vagas - nova listagem e detalhes */
.jobs-page,
.job-detail-page {
  --jobs-navy: #0b3a6a;
  --jobs-navy-dark: #082f57;
  --jobs-gold: #f6c21c;
  --jobs-light: #f3f6fb;
  background: var(--jobs-light);
  color: #0b2a52;
}

.jobs-main {
  padding-bottom: 110px;
}

.jobs-hero {
  background: linear-gradient(135deg, #083d73 0%, #0b6db5 60%, #0a5ea2 100%);
  color: #fff;
  padding: 90px 0 140px;
  position: relative;
  overflow: hidden;
}

.jobs-hero::before,
.jobs-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}

.jobs-hero::before {
  width: 520px;
  height: 520px;
  top: -220px;
  right: 8%;
}

.jobs-hero::after {
  width: 360px;
  height: 360px;
  bottom: -160px;
  left: 6%;
}

.jobs-hero-inner {
  width: min(1100px, 92%);
  margin: 0 auto;
  text-align: center;
  display: grid;
  gap: 16px;
  position: relative;
  z-index: 1;
}

.jobs-hero-inner strong {
  color: var(--jobs-gold);
}

.jobs-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.15);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  margin: 0 auto;
}

.jobs-title {
  font-size: clamp(34px, 4.2vw, 58px);
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}

.jobs-title span {
  color: var(--jobs-gold);
}

.jobs-hero p {
  max-width: 640px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.85);
}

.jobs-search {
  width: min(1100px, 92%);
  margin: -70px auto 0;
  background: #fff;
  border-radius: 30px;
  box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12);
  padding: 30px 32px;
  display: grid;
  gap: 20px;
  position: relative;
  z-index: 2;
}

.jobs-search-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  background: #f2f6ff;
  border-radius: 999px;
  padding: 10px 12px;
}

.jobs-search-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--jobs-navy);
}

.jobs-search input {
  border: none;
  background: transparent;
  font-size: 16px;
  color: #12335b;
  outline: none;
}

.jobs-search-btn {
  border: none;
  background: var(--jobs-navy);
  color: #fff;
  padding: 12px 26px;
  border-radius: 999px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.jobs-search-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(11, 58, 106, 0.18);
}

.jobs-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: #f5f6fb;
  border-radius: 999px;
  padding: 6px;
  gap: 6px;
}

.jobs-tab {
  border: none;
  border-radius: 999px;
  padding: 10px 12px;
  background: transparent;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 12px;
  color: #5a6a85;
  cursor: pointer;
}

.jobs-tab.is-active {
  background: #fff;
  color: var(--jobs-navy);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.jobs-results {
  margin: 0;
  font-weight: 600;
  color: #3c4c68;
}

.jobs-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-areas:
    "search search search tabs"
    "type city deadline actions";
  gap: 16px;
  align-items: end;
}

.jobs-search-inner {
  grid-area: search;
}

.jobs-tabs {
  grid-area: tabs;
}

.jobs-filter-type {
  grid-area: type;
}

.jobs-filter-city {
  grid-area: city;
}

.jobs-filter-deadline {
  grid-area: deadline;
}

.jobs-filter-actions {
  grid-area: actions;
}

.jobs-filter-group {
  display: grid;
  gap: 8px;
}

.jobs-filter-group label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: #52627a;
}

.jobs-filter-group input,
.jobs-filter-group select {
  height: 44px;
  border-radius: 999px;
  border: 1px solid #d8dfeb;
  padding: 0 16px;
  font-size: 14px;
  color: #12335b;
  background: #fff;
}

.jobs-filter-actions {
  display: grid;
  gap: 8px;
  justify-items: start;
}

.jobs-filter-btn {
  border: none;
  background: var(--jobs-navy);
  color: #fff;
  padding: 12px 22px;
  border-radius: 999px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.jobs-filter-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(11, 58, 106, 0.18);
}

.jobs-filter-clear {
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6b7a94;
}

.jobs-section {
  width: min(1100px, 92%);
  margin: 40px auto 0;
}

.jobs-grid {
  display: grid;
  column-gap: 120px;
  row-gap: 50px;
  grid-template-columns: repeat(3, minmax(300px, 1fr));
  justify-content: center;
}

.jobs-pagination {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.jobs-see-all {
  margin-top: 32px;
  display: flex;
  justify-content: center;
}

.jobs-page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  padding: 10px 16px;
  border-radius: 999px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 12px;
  background: #fff;
  color: var(--jobs-navy);
  border: 1px solid rgba(11, 58, 106, 0.18);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.jobs-page-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(11, 58, 106, 0.12);
}

.jobs-page-btn.is-active {
  background: var(--jobs-navy);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 10px 18px rgba(11, 58, 106, 0.22);
}

.jobs-page-btn.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}

/* ===== Card padrão (vagas) ===== */
.vaga-card {
  width: 380px;
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 16px;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  overflow: visible;
  font-family: 'Open Sans', sans-serif;
  justify-self: center;
  position: relative;
}

.vaga-card.is-hidden {
  display: none;
}

.vaga-card__body {
  padding: 46px 26px 20px;
  text-align: center;
}

.vaga-card__logo {
  width: 64px;
  height: 64px;
  margin: 0;
  border-radius: 50%;
  border: 2px solid #e6eef7;
  background: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}

.vaga-card__logo img {
  width: 78%;
  height: 78%;
  object-fit: contain;
  border-radius: 50%;
  display: block;
}

.vaga-card__title {
  margin: 0 0 14px;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 600;
  color: #0b57d0;
}

.vaga-card__sub {
  margin: 0 0 18px;
  font-size: 16px;
  color: #333;
}

/* ========================= */
/*   SECAO PROJETOS PAGE     */
/* ========================= */
.projects-page {
  background: #f7fafc;
  font-family: 'Open Sans', sans-serif;
  color: #1f2a37;
}

.projects-hero {
  padding: 90px 20px 110px;
  background: linear-gradient(180deg, #f7fafc 0%, #eef5fb 100%);
}

.projects-hero-inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}

.projects-hero-content {
  display: grid;
  gap: 18px;
}

.projects-pill {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  font-weight: 800;
  color: #0b4c9a;
  text-transform: uppercase;
  letter-spacing: 0.22em;
}

.projects-pill::before {
  content: "";
  width: 36px;
  height: 3px;
  border-radius: 999px;
  background: #F3D147;
}

.projects-title {
  margin: 0;
  font-size: clamp(38px, 5vw, 64px);
  line-height: 1.05;
  text-transform: uppercase;
  font-weight: 900;
  color: #0b4c9a;
}

.projects-title .accent {
  color: #F3D147;
}

.projects-subtitle {
  margin: 0;
  color: #4b5b70;
  font-size: 18px;
  line-height: 1.7;
  max-width: 540px;
}

.projects-subtitle strong {
  color: #0b4c9a;
}

.projects-hero-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 16px;
  align-items: center;
}

.projects-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  min-height: 46px;
  background: #0b4c9a;
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 14px;
  box-shadow: 0 14px 30px rgba(11, 76, 154, 0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.projects-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(11, 76, 154, 0.4);
}

.projects-ghost {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border-radius: 999px;
  min-height: 46px;
  border: 1px solid rgba(11, 76, 154, 0.25);
  color: #0b4c9a;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  background: #ffffff;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  font-size: 14px;
}

.projects-ghost:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(11, 76, 154, 0.2);
}

.projects-hero-media {
  position: relative;
  display: grid;
  justify-items: end;
}

.projects-image-card {
  position: relative;
  background: #ffffff;
  border-radius: 36px;
  padding: 18px;
  max-width: 440px;
  box-shadow: 0 28px 60px rgba(15, 23, 42, 0.18);
  border: 1px solid rgba(11, 76, 154, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.projects-image-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 34px 70px rgba(15, 23, 42, 0.22);
}

.projects-image-card img {
  width: 100%;
  height: auto;
  border-radius: 28px;
  display: block;
  filter: none;
}

.projects-float-icon {
  position: absolute;
  left: 26px;
  bottom: 26px;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: #F3D147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 24px;
  box-shadow: 0 14px 28px rgba(243, 181, 0, 0.35);
}

.projects-eixos {
  padding: 90px 20px 110px;
  background: #ffffff;
}

.projects-section-header {
  width: min(1100px, 100%);
  margin: 0 auto 56px;
  text-align: center;
}

.projects-section-header h2 {
  margin: 0 0 10px;
  font-size: clamp(28px, 3.6vw, 42px);
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
}

.projects-section-header p {
  margin: 0;
  color: #7b8aa2;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 12px;
  font-weight: 700;
}

.projects-eixos-grid {
  width: min(1100px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 28px;
}

.projects-eixo-card {
  background: #ffffff;
  border-radius: 32px;
  padding: 38px 32px;
  text-align: center;
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
  border: 1px solid #eff3f7;
  display: grid;
  gap: 18px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.projects-eixo-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 50px rgba(15, 23, 42, 0.12);
  border-color: rgba(11, 76, 154, 0.2);
}

.projects-eixo-icon {
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: #F3D147;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  margin: 0 auto;
  font-size: 35px;
  box-shadow: 0 12px 22px rgba(243, 181, 0, 0.3);
}

.projects-eixo-card h3 {
  margin: 0;
  font-size: 23px;
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.projects-eixo-card p {
  margin: 0;
  color: #6b7a90;
  font-size: 17px;
  line-height: 1.7;
}

.projects-eixo-link {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: #0b4c9a;
  text-decoration: none;
}

.projects-eixo-link i {
  font-size: 16px;
}

.projects-eixo-link:hover {
  text-decoration: underline;
}

.projects-impact {
  padding: 90px 20px 110px;
  background: #002D5A;
  color: #FFFFFF;
}

.projects-impact-inner {
  width: min(1100px, 100%);
  margin: 0 auto;
}

.projects-impact-header {
  text-align: center;
  margin-bottom: 48px;
}

.projects-impact-header h2 {
  margin: 0;
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 900;
  text-transform: uppercase;
  color: #FFFFFF;
}

.projects-impact-header h2 span {
  color: #F8D147;
}

.projects-impact-underline {
  width: 70px;
  height: 4px;
  border-radius: 999px;
  background: #F8D147;
  margin: 14px auto 0;
}

.projects-impact-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 20px;
}

.projects-impact-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 24px;
  padding: 28px 22px;
  text-align: center;
  box-shadow: inset 0 0 0 1px rgba(0, 51, 102, 0.6);
  display: grid;
  gap: 12px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.projects-impact-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 36px rgba(0, 51, 102, 0.35);
  border-color: rgba(255, 255, 255, 0.2);
}

.projects-impact-icon {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: rgba(248, 209, 71, 0.2);
  color: #F8D147;
  display: grid;
  place-items: center;
  margin: 0 auto;
  font-size: 30px;
}

.projects-impact-card h3 {
  margin: 0;
  font-size: clamp(16px, 1.6vw, 20px);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 800;
}

.projects-impact-card p {
  margin: 0;
  font-size: clamp(14px, 1.2vw, 16px);
  color: #BFDBFE;
  line-height: 1.6;
}

/* =============================== */
/*   SECAO AUXILIO TRANSPORTE      */
/* =============================== */
.transport-page {
  background: #f4f8ff;
  font-family: 'Open Sans', sans-serif;
  color: #1f2a37;
}

.transport-hero {
  padding: 90px 0 40px;
}

@media (min-width: 981px) {
  .transport-page.transport-donation-page .transport-hero {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.transport-hero-inner {
  width: min(1560px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  gap: 28px;
  align-items: center;
}

.transport-aux-page .transport-hero-inner {
  width: min(1320px, 100%);
  grid-template-columns: 1.05fr 0.95fr;
  gap: 48px;
}

.transport-back {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
  font-size: 12px;
  color: #0b4c9a;
  text-decoration: none;
}

.transport-back i {
  font-size: 18px;
}

.transport-back:hover {
  text-decoration: underline;
}

.transport-top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 28px;
}

.transport-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #F8D147;
  font-size: 15px;
}

.transport-pill i {
  font-size: 24px;
  color: #0b4c9a;
}

.transport-title {
  margin: 18px 0 16px;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  color: #0b4c9a;
  text-transform: uppercase;
  line-height: 1.05;
}

.transport-subtitle {
  margin: 0 0 24px;
  font-size: 18px;
  line-height: 1.7;
  color: #5b6c80;
  max-width: 560px;
}

.transport-benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 220px));
  gap: 16px;
  max-width: 460px;
}

.transport-benefit {
  background: #ffffff;
  border-radius: 18px;
  padding: 16px 18px;
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08);
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 800;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #0b4c9a;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.transport-benefit:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 36px rgba(15, 23, 42, 0.12);
}

.transport-benefit-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: #e5f6ea;
  color: #1f8f4a;
  display: grid;
  place-items: center;
  font-size: 18px;
}

.transport-media {
  display: grid;
  justify-items: end;
}

.transport-media .transport-grid {
  width: min(820px, 100%);
  margin: 0;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  justify-content: end;
  gap: 20px;
}

.transport-media .transport-card {
  padding: 20px 22px 24px;
  border-radius: 42px;
}

.transport-media .transport-card h3 {
  font-size: 22px;
}

.transport-media .transport-card-icon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  font-size: 30px;
}

.transport-media .transport-card.pix .transport-pix-wrap {
  grid-template-columns: 1fr;
}

.transport-media .transport-qr {
  width: 100%;
}

.transport-media .transport-qr img {
  width: 100%;
  max-width: 240px;
}

.transport-media .transport-pix-box {
  padding: 18px;
}

.transport-image-card {
  background: #ffffff;
  border-radius: 40px;
  padding: 16px;
  border: 10px solid #0b4c9a;
  box-shadow: 0 28px 60px rgba(11, 76, 154, 0.2);
  max-width: 440px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.transport-image-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 34px 70px rgba(11, 76, 154, 0.26);
}

.transport-image-card img {
  width: 100%;
  height: auto;
  border-radius: 28px;
  display: block;
  object-fit: cover;
}

.transport-contrib {
  padding: 80px 20px 110px;
  background: #ffffff;
}

.transport-header {
  width: min(1100px, 100%);
  margin: 0 auto 48px;
  text-align: center;
}

.transport-header h2 {
  margin: 0 0 10px;
  font-size: clamp(28px, 3.6vw, 42px);
  font-weight: 900;
  text-transform: uppercase;
  color: #0b4c9a;
}

.transport-header p {
  margin: 0;
  color: #8a98ad;
  font-size: 12px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  font-weight: 700;
}

.transport-grid {
  width: min(1100px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 520px));
  justify-content: center;
  gap: 28px;
}

.transport-card {
  background: #f7fbff;
  border-radius: 60px;
  padding: 24px 32px 32px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  border: 1px solid #F1F5F9;
  display: grid;
  gap: 10px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.transport-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 40px 80px rgba(15, 23, 42, 0.18);
}

.transport-card.dark {
  background: #00468B;
  color: #ffffff;
  border: none;
}

.transport-card-icon {
  width: 80px;
  height: 80px;
  border-radius: 24px;
  background: #0b4c9a;
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 40px;
  box-shadow: 0 16px 26px rgba(11, 76, 154, 0.3);
}

.transport-card-head {
  display: flex;
  align-items: center;
  gap: 20px;
}

.transport-card-head h3 {
  margin: 0;
}

.transport-card.dark .transport-card-icon {
  background: #F3D147;
  color: #0b4c9a;
  box-shadow: 0 16px 26px rgba(243, 181, 0, 0.3);
}

.transport-card h3 {
  margin: 0;
  font-size: 30px;
  color: #0b4c9a;
  font-weight: 900;
  text-transform: uppercase;
}

.transport-card.dark h3 {
  color: #ffffff;
}

.transport-pix-box {
  background: #ffffff;
  border-radius: 24px;
  padding: 24px;
  display: grid;
  gap: 6px;
  box-shadow: 0 16px 26px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.06);
  margin-bottom: 16px;
}

.transport-pix-wrap {
  display: grid;
  grid-template-columns: 176px 1fr;
  gap: 24px;
  align-items: center;
  margin-top: 0;
}

.transport-card.pix h3 {
  margin-top: 0;
}

.transport-card.pix .transport-pix-wrap {
  margin-top: 0;
}

.transport-card.pix-aux {
  min-height: 560px;
}



.transport-qr {
  background: #ffffff;
  border-radius: 40px;
  padding: 24px;
  display: grid;
  gap: 8px;
  justify-items: center;
  box-shadow: 0 25px 50px -12px rgba(248, 209, 71, 0.1);
  width: 100%;
  box-sizing: border-box;
}

.transport-qr img {
  width: 200px;
  height: 200px;
  display: block;
  border-radius: 16px;
}

.transport-qr span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #8a98ad;
  font-weight: 700;
}

.transport-pix-label {
  font-size: 10px;
  text-transform: uppercase;
  color: #8a98ad;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.transport-pix-value {
  font-size: 18px;
  font-weight: 800;
  color: #0b4c9a;
}

.transport-pix-hint {
  margin: 8px 0 0;
  font-size: 14px;
  color: #8a98ad;
  font-weight: 600;
}

.transport-pix-action {
  margin-left: auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: none;
  background: #f1f5f9;
  color: #0b4c9a;
  display: grid;
  place-items: center;
  font-size: 20px;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
  cursor: pointer;
}

.transport-pix-action.is-copied {
  background: #0b4c9a;
  color: #ffffff;
  transform: scale(1.05);
}

.transport-note {
  background: #93C5FD;
  border-radius: 24px;
  padding: 24px;
  font-size: 14px;
  color: #0b4c9a;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-weight: 600;
}

.transport-note i {
  font-size: 18px;
}

.transport-card.dark .transport-note {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

.transport-card.dark .transport-note i {
  color: #F8D147;
}

.transport-card.dark .transport-note strong {
  color: #93C5FD;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.transport-note-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #F8D147;
  text-decoration: none;
}

.transport-note-link:hover {
  text-decoration: underline;
}

.transport-cta {
  display: flex;
  width: calc(100% - 26px);
  margin-right: 26px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
  font-size: 14px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.transport-cta + .transport-cta,
.transport-cta + .transport-hours {
  margin-top: 10px;
}

.transport-cta i {
  font-size: 20px;
}

.transport-cta:hover {
  background: rgba(255, 255, 255, 0.22);
}

.transport-hours {
  display: flex;
  gap: 12px;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  padding: 14px 18px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.85);
  font-size: 13px;
}

.transport-hours i {
  font-size: 18px;
}

.vaga-card__divider {
  height: 1px;
  background: #ededed;
  margin: 18px 0 22px;
}

.vaga-card__meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}

.vaga-card__meta-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.vaga-card__icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2px solid #1aa0ff;
  color: #1aa0ff;
  background: #fff;
}

.vaga-card__icon i {
  font-size: 22px;
}

.vaga-card__meta-text {
  font-size: 14px;
  color: #6a6a6a;
  text-align: center;
  max-width: 110px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.vaga-card__btn {
  display: inline-block;
  width: 100%;
  padding: 14px 16px;
  border-radius: 10px;
  background: #0a4a84;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0.2px;
  transition: 0.15s ease;
  box-sizing: border-box;
  text-align: center;
  line-height: 1.3;
  white-space: normal;
}

.vaga-card__btn:hover {
  filter: brightness(1.05);
}

.vaga-card__footer {
  padding: 14px 22px 18px;
  border-top: 1px solid #ededed;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #8a8a8a;
  font-size: 14px;
}

.vaga-card__footer i {
  font-size: 16px;
  color: #b0b0b0;
}

@media (max-width: 1024px) {
  .jobs-grid {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
  }

  .jobs-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "search search"
      "tabs tabs"
      "type city"
      "deadline actions";
  }

  .jobs-filter-actions {
    grid-column: auto;
    grid-template-columns: 1fr 1fr;
    justify-items: stretch;
  }
}

@media (max-width: 680px) {
  .jobs-grid {
    grid-template-columns: 1fr;
  }

  .jobs-filters {
    grid-template-columns: 1fr;
    grid-template-areas:
      "search"
      "tabs"
      "type"
      "city"
      "deadline"
      "actions";
  }

  .jobs-filter-actions {
    grid-column: auto;
    grid-template-columns: 1fr;
  }
}

.job-card {
  background: #fff;
  border-radius: 28px;
  border: none;
  box-shadow: 0 18px 32px rgba(15, 23, 42, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  max-width: 400px;
  min-height: 240px;
  width: 100%;
  justify-self: center;
  overflow: visible;
  margin-top: 24px;
}

.job-card.is-hidden {
  display: none;
}

.job-card-link {
  display: grid;
  gap: 8px;
  padding: 48px 22px 16px;
  text-decoration: none;
  color: inherit;
  height: 100%;
  min-height: 240px;
  justify-items: stretch;
  text-align: left;
}

.job-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 40px rgba(15, 23, 42, 0.12);
}

.job-card-tag {
  display: none;
  align-self: flex-start;
  justify-self: flex-start;
  background: #f6c21c;
  color: #0b4a8a;
  font-weight: 800;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 11px;
  text-transform: uppercase;
}

.job-card-logo {
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.16);
  display: grid;
  place-items: center;
  z-index: 2;
}

.job-card-logo img {
  width: 46px;
  height: 46px;
  object-fit: contain;
}

.job-card-title {
     font-size: 20px;
    padding: 0;
    line-height: 26px;
    text-align: center;
    overflow: hidden;
    display: grid;
    transform: none;
    margin-top: 4px;
    width: 100%;
    max-width: none;
}

.job-card-company {
  display: none;
  margin: 0;
  font-weight: 700;
  color: #5a6a85;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
}

.job-card-meta {
  display: grid;
  gap: 6px;
  font-size: 12px;
  color: #6b7b95;
  transform: translateY(-14px);
}

.job-card-link > * {
  max-width: 100%;
}

.job-card-count {
  display: none;
}

.job-card-divider {
  display: none;
}

.job-card-meta span {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

.job-card-icons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 70px;
  width: 100%;
  margin-top: 0;
  justify-items: center;
  transform: translate(38px, -24px);
}

.job-card-icon {
  text-align: center;
  font-size: 14px;
  color: #6b7b95;
  display: grid;
  gap: 2px;
}

.job-card-icon span {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  margin: 0 auto 2px;
  border-radius: 18px;
  background: #edf3ff;
  color: #0b4a8a;
  font-size: 24px;
}

.job-card-cta {
  margin-top: 0;
  margin-bottom: 4px;
  transform: translate(40px, -16px);
  background: #0b4a8a;
  color: #fff;
  text-align: center;
  padding: 10px 22px;
  border-radius: 999px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 13px;
  width: fit-content;
  max-width: 100%;
  justify-self: center;
}

.job-card-deadline {
  font-size: 11px;
  color: #9aa6bd;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  text-transform: none;
  letter-spacing: 0.02em;
  margin-top: 6px;
}

.jobs-empty {
  background: #fff;
  border-radius: 28px;
  padding: 32px;
  text-align: center;
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
}

.jobs-empty.is-hidden {
  display: none;
}

.youth-jobs-cta {
  background: linear-gradient(135deg, #0b3d74 0%, #0b6db5 100%);
  color: #fff;
  padding: 64px 0;
}

.youth-jobs-cta-inner {
  width: min(900px, 90%);
  margin: 0 auto;
  text-align: center;
  display: grid;
  gap: 16px;
}

.youth-jobs-cta-btn {
  justify-self: center;
  background: #f6c21c;
  color: #0b2a52;
  padding: 12px 28px;
  border-radius: 999px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.job-detail {
  width: min(1200px, 92%);
  margin: 0 auto;
  padding: 48px 0 110px;
}

.job-detail-header {
  margin-bottom: 24px;
}

.job-detail-back {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--jobs-navy);
  font-weight: 700;
  text-decoration: none;
}

.job-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 32px;
  align-items: start;
}

.job-detail-title h1 {
  margin: 0 0 10px;
  font-size: 32px;
  color: #0b2a52;
}

.job-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: #5a6a85;
  font-size: 14px;
}

.job-detail-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.job-detail-section {
  margin-top: 32px;
}

.job-detail-section h2 {
  margin: 0 0 12px;
  color: var(--jobs-navy);
}

.job-detail-section ul {
  margin: 0;
  padding-left: 18px;
  color: #40506b;
  display: grid;
  gap: 8px;
}

.job-benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 16px;
  margin-bottom: 16px;
}

.job-benefit-item {
  background: #fff;
  border-radius: 20px;
  padding: 16px;
  display: grid;
  gap: 8px;
  text-align: center;
  box-shadow: 0 12px 20px rgba(15, 23, 42, 0.06);
}

.job-benefit-item small {
  font-size: 12px;
  color: #7a879f;
}

.job-benefit-icon {
  width: 54px;
  height: 54px;
  margin: 0 auto;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: #edf3ff;
  color: var(--jobs-navy);
  font-size: 22px;
}

.job-benefits-extra {
  margin: 0;
  padding-left: 18px;
  color: #51607a;
}

.job-detail-sidebar {
  position: sticky;
  top: 120px;
}

.job-sidebar-card {
  background: #fff;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 20px 36px rgba(15, 23, 42, 0.1);
}

.job-sidebar-map iframe {
  width: 100%;
  height: 220px;
  border: none;
}

.job-sidebar-body {
  padding: 22px;
  display: grid;
  gap: 16px;
}

.job-sidebar-company {
  color: #6b7b95;
}

.job-sidebar-actions {
  display: grid;
  gap: 10px;
}

.job-sidebar-btn {
  text-decoration: none;
  text-align: center;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 700;
}

.job-sidebar-btn.primary {
  background: var(--jobs-navy);
  color: #fff;
}

.job-sidebar-btn.secondary {
  background: #eaf1ff;
  color: var(--jobs-navy);
}

.job-sidebar-countdown {
  font-size: 12px;
  color: #6b7b95;
  display: grid;
  gap: 8px;
}

.job-sidebar-progress {
  height: 6px;
  background: #edf1f7;
  border-radius: 999px;
  overflow: hidden;
}

.job-sidebar-progress span {
  display: block;
  height: 100%;
  background: var(--jobs-gold);
}

.job-sidebar-share {
  display: grid;
  gap: 10px;
  font-size: 12px;
  color: #6b7b95;
}

.job-sidebar-share-icons {
  display: flex;
  gap: 12px;
}

.job-sidebar-share-icons a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #f3f6fb;
  color: var(--jobs-navy);
}

.job-detail-empty {
  background: #fff;
  border-radius: 28px;
  padding: 40px;
  text-align: center;
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
}

.job-detail-back-btn {
  display: inline-flex;
  margin-top: 18px;
  background: var(--jobs-navy);
  color: #fff;
  padding: 12px 26px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
}

@media (max-width: 1024px) {
  .job-detail {
    width: min(1200px, 94%);
    padding: 34px 0 90px;
  }

  .job-detail-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .job-detail-sidebar {
    position: static;
    top: auto;
  }

  .job-sidebar-card {
    border-radius: 24px;
  }
}

@media (max-width: 680px) {
  .jobs-hero {
    padding: 70px 0 100px;
  }

  .jobs-search {
    width: min(1100px, 94%);
    margin-top: -54px;
    padding: 18px 14px;
    border-radius: 24px;
    gap: 14px;
  }

  .jobs-search-inner {
    gap: 8px;
    padding: 8px 10px;
  }

  .jobs-search input {
    min-width: 0;
    font-size: 15px;
  }

  .jobs-search-btn {
    padding: 10px 14px;
    font-size: 12px;
    letter-spacing: 0.02em;
  }

  .jobs-tabs {
    padding: 4px;
    gap: 4px;
  }

  .jobs-tab {
    padding: 10px 8px;
    font-size: 11px;
  }

  .jobs-filter-group input,
  .jobs-filter-group select {
    height: 42px;
  }

  .jobs-filter-btn {
    width: 100%;
  }

  .jobs-results {
    font-size: 14px;
  }

  .jobs-grid {
    row-gap: 36px;
  }

  .vaga-card {
    width: 100%;
    max-width: 360px;
  }

  .job-detail {
    width: min(1200px, 94%);
    padding: 24px 0 80px;
  }

  .job-detail-header {
    margin-bottom: 16px;
  }

  .job-detail-title h1 {
    font-size: clamp(30px, 8.4vw, 42px);
    line-height: 1.15;
  }

  .job-detail-meta {
    gap: 10px;
    font-size: 13px;
  }

  .job-detail-section {
    margin-top: 24px;
  }

  .job-sidebar-body {
    padding: 18px;
    gap: 14px;
  }

  .job-sidebar-share-icons {
    gap: 10px;
  }

  .job-sidebar-share-icons a {
    width: 34px;
    height: 34px;
  }
}

@media (max-width: 420px) {
  .jobs-search-inner {
    grid-template-columns: auto 1fr;
  }

  .jobs-search-btn {
    grid-column: 1 / -1;
    width: 100%;
  }
}



/* Trabalhe Conosco */
.career-page {
  background: #f6f8fc;
}

.career-hero {
  background: linear-gradient(135deg, #083d73 0%, #0b6db5 60%, #0a5ea2 100%);
  padding: 70px 0 40px;
  text-align: center;
}

.career-hero-inner {
  width: min(900px, 92%);
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.career-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #0b4a8a;
  font-weight: 700;
}

.career-hero h1 {
  font-size: clamp(32px, 5vw, 52px);
  color: #FFFFFF;
  font-weight: 800;
  line-height: 1.1;
}

.career-accent {
  color: #f3c21c;
}

.career-hero p {
  color: #FFFFFF;
  font-size: 17px;
  margin: 0 auto;
}

.career-form-section {
  padding: 30px 0 90px;
}

.career-card {
  width: min(780px, 92%);
  margin: 0 auto;
  background: #ffffff;
  border-radius: 34px;
  padding: 40px 48px 46px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
}

.career-title {
  text-align: center;
  display: grid;
  gap: 6px;
  margin-bottom: 24px;
}

.career-title h2 {
  color: #0b4a8a;
  font-size: 22px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.career-title p {
  color: #8a97ad;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.career-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 22px;
}

.career-field {
  display: grid;
  gap: 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #8a97ad;
  font-weight: 700;
}

.career-input {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: #f5f7fb;
  border-radius: 16px;
  border: 1px solid transparent;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.career-input i {
  color: #9aa6bd;
  font-size: 16px;
}

.career-input input {
  border: 0;
  outline: none;
  background: transparent;
  font-size: 14px;
  color: #22324a;
  width: 100%;
}

.career-input input::placeholder {
  color: #9aa6bd;
}

.career-input:focus-within {
  border-color: #c5d7f2;
  box-shadow: 0 0 0 3px rgba(15, 90, 170, 0.12);
}

.career-upload-group {
  margin-top: 22px;
  display: grid;
  gap: 10px;
}

.career-upload-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #8a97ad;
  font-weight: 700;
}

.career-upload-group input[type="file"] {
  display: none;
}

.career-upload {
  border: 2px dashed #d8e2f2;
  border-radius: 22px;
  padding: 26px;
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 8px;
  color: #6b7b95;
  background: #fafcff;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.career-upload:hover {
  border-color: #a8c0e6;
  background: #f1f6ff;
  transform: translateY(-2px);
}

.career-upload-icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: #eef4ff;
  display: grid;
  place-items: center;
  color: #0b4a8a;
  font-size: 20px;
}

.career-upload span {
  font-size: 12px;
  color: #9aa6bd;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.career-file-meta {
  font-size: 13px;
  color: #0b4a8a;
  font-weight: 600;
}

.career-file-error {
  font-size: 12px;
  color: #d64545;
}

.career-submit {
  margin-top: 24px;
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 14px 22px;
  background: #f3c21c;
  color: #0b2a52;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.career-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

.career-submit:not(:disabled):hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.2);
}

.career-form.is-hidden {
  display: none;
}

.career-success {
  display: none;
  text-align: center;
  gap: 12px;
}

.career-success.is-active {
  display: grid;
}

.career-success-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #e8f7ee;
  color: #1f9d55;
  display: grid;
  place-items: center;
  font-size: 28px;
  margin: 0 auto 6px;
  box-shadow: 0 0 0 10px rgba(31, 157, 85, 0.12);
}

.career-success h3 {
  color: #0b4a8a;
  font-size: 22px;
  font-weight: 800;
}

.career-success p {
  color: #6b7b95;
  max-width: 420px;
  margin: 0 auto;
}

.career-reset {
  margin: 12px auto 0;
  border: 0;
  border-radius: 999px;
  padding: 12px 26px;
  background: #0b4a8a;
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  box-shadow: 0 12px 22px rgba(11, 74, 138, 0.22);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.career-reset:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 26px rgba(11, 74, 138, 0.3);
}

.footer-only-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: #233d63;
}

.footer-only-page .site-footer {
  margin-top: auto;
}
