/* =====================================================================
   Painéis da EPT/RN · identidade visual da revista
   "Rede Estadual de EPT: História, Saberes e Transformação" (SUEP/SEEC-RN)
   ===================================================================== */
:root {
  --indigo: #222b63;
  --indigo-fundo: #1a2150;
  --azul: #4f79bb;
  --azul-escuro: #3f66a6;
  --coral: #e9584f;
  --vermelho: #d9474a;
  --amarelo: #fac133;
  --amarelo-claro: #fdd877;
  --lima: #a9c92b;
  --lima-claro: #afcf62;
  --ceu: #62b1e2;
  --papel: #fbfaf6;
  --branco: #ffffff;
  --cinza-claro: #eceae4;
  --tinta: #1d2340;
  --suave: #555c74;
  --raio-p: 12px;
  --raio: 22px;
  --raio-g: 28px;
  --sombra: 0 1px 0 var(--cinza-claro), 0 12px 26px rgba(34,43,99,.07);
  --linha: 3px;
  --titulo: "Rubik", "Segoe UI", system-ui, sans-serif;
  --texto: "Roboto", "Segoe UI", system-ui, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; font-size: 100%; scroll-behavior: smooth; }
html.fonte-menor { font-size: 93.75%; }
html.fonte-maior { font-size: 112.5%; }
html.fonte-max { font-size: 125%; }
body { margin: 0; background: var(--papel); color: var(--tinta); font-family: var(--texto); font-size: 1rem; line-height: 1.6; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--titulo); line-height: 1.12; margin: 0; }
.conteiner { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.pular { position: absolute; left: -9999px; top: 0; background: var(--amarelo); color: var(--indigo); padding: 8px 14px; z-index: 50; font-weight: 700; }
.pular:focus { left: 16px; }
:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 3px; }

/* ---------------------------------------------------------------- barra de acessibilidade */
.barra-gov { background: var(--indigo-fundo); color: #cfd6f2; font-size: 0.8125rem; }
.barra-gov .conteiner { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 38px; flex-wrap: wrap; }
.barra-gov strong { color: #fff; letter-spacing: .04em; }
.acesso { display: flex; align-items: center; gap: 4px; }
.acesso span { margin-right: 4px; }
.acesso button { font: 700 0.8125rem var(--titulo); color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.3); border-radius: var(--raio-p); min-width: 34px; height: 28px; cursor: pointer; }
.acesso button:hover { background: rgba(255,255,255,.12); }
.acesso .insta { display: inline-flex; align-items: center; gap: 6px; margin-left: 10px; color: #fff; text-decoration: none; font-weight: 500; }
.acesso .insta svg { width: 18px; height: 18px; }

.faixa-cores { display: grid; grid-template-columns: repeat(4, 1fr); height: 6px; }
.faixa-cores i:nth-child(1) { background: var(--coral); }
.faixa-cores i:nth-child(2) { background: var(--amarelo); }
.faixa-cores i:nth-child(3) { background: var(--lima); }
.faixa-cores i:nth-child(4) { background: var(--ceu); }

/* ---------------------------------------------------------------- topo */
.topo { background: var(--branco); position: sticky; top: 0; z-index: 20; box-shadow: 0 1px 0 var(--cinza-claro); }
.topo .conteiner { display: flex; align-items: center; gap: 20px; min-height: 76px; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
.marca { display: flex; align-items: center; gap: 14px; text-decoration: none; margin-right: auto; }
.marca img { height: 46px; width: auto; }
.marca .divisor { width: 2px; height: 40px; background: var(--cinza-claro); }
.marca-nome { font: 800 1.05rem/1.1 var(--titulo); color: var(--indigo); }
.marca-nome small { display: block; font: 500 0.75rem var(--texto); color: var(--suave); letter-spacing: .02em; margin-top: 2px; }
.menu { display: flex; gap: 2px; flex-wrap: wrap; align-items: center; }
.menu a { font: 600 0.9375rem var(--titulo); color: var(--indigo); text-decoration: none; padding: 10px 14px; border-radius: var(--raio-p); position: relative; }
.menu a:hover { background: #eef2fb; }
.menu a[aria-current="page"]::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 3px; border-radius: 3px; background: var(--coral); }
.menu .menu-insta { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; color: var(--coral); }
.menu .menu-insta svg { width: 22px; height: 22px; }
.menu .menu-destaque { background: var(--indigo); color: #fff; margin-left: 6px; }
.menu .menu-destaque:hover { background: var(--azul-escuro); }

/* ---------------------------------------------------------------- elementos da revista */
/* Caixa de título índigo (como "A SUEP", "EPT potiguar em números") */
.etiqueta { display: inline-block; background: var(--indigo); color: #fff; font: 800 clamp(1.6rem, 3.4vw, 2.6rem)/1.1 var(--titulo); padding: 0.45em 0.7em 0.5em; border-radius: 0.55em; }
.etiqueta em { font-style: normal; color: var(--amarelo); }
.etiqueta.pequena { font-size: clamp(1.25rem, 2.4vw, 1.7rem); }
/* contexto do título (data, parceiro, tema): só onde traz informação, em letra normal */
.sobretitulo { display: flex; width: fit-content; align-items: center; gap: 10px; font: 600 0.9688rem var(--titulo); color: var(--coral); }
.sobretitulo::before { content: ""; width: 34px; height: 3px; border-radius: 3px; background: currentColor; }

/* Moldura de linha fina com canto arredondado (o contorno que abraça os textos na revista) */
.moldura { position: relative; }
.moldura::before { content: ""; position: absolute; inset: -14px -14px auto auto; width: 70%; height: calc(100% + 28px); border-top: var(--linha) solid var(--indigo); border-right: var(--linha) solid var(--indigo); border-top-right-radius: 36px; pointer-events: none; }

.botao { display: inline-flex; align-items: center; gap: 8px; font: 700 0.9375rem var(--titulo); text-decoration: none; padding: 12px 20px; border-radius: var(--raio-p); border: 0; cursor: pointer; transition: transform .15s ease, background .15s ease; }
.botao:hover { transform: translateY(-2px); }
.botao.amarelo { background: var(--amarelo); color: var(--indigo); }
.botao.amarelo:hover { background: #ffcd4d; }
.botao.indigo { background: var(--indigo); color: #fff; }
.botao.indigo:hover { background: var(--azul-escuro); }
.botao.contorno { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.7); }
.botao.contorno:hover { background: rgba(255,255,255,.1); }
.botao.contorno-indigo { background: transparent; color: var(--indigo); box-shadow: inset 0 0 0 2px var(--indigo); }

/* ---------------------------------------------------------------- abertura (hero): azul da capa da revista */
.abertura { --azul-capa: var(--indigo); background: var(--azul-capa); color: #fff; position: relative; overflow: hidden; }
.abertura .bolha-coral { position: absolute; left: -160px; top: -120px; width: 420px; height: 420px; background: var(--coral); border-radius: 46% 54% 60% 40% / 50% 45% 55% 50%; opacity: .95; }
.abertura .conteiner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; padding-top: 64px; padding-bottom: 150px; }
.abertura .etiqueta { font-size: clamp(2rem, 4.6vw, 3.4rem); background: #3771ae; }
.abertura .colagem .contorno { border-color: var(--amarelo); }
/* contorno branco no mapa: as linhas escuras (como a hélice de cima) não somem no fundo azul-escuro */
.abertura .colagem .rn { filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 8px 14px rgba(10, 14, 40, .35)); }
.abertura .etiqueta em { display: block; } /* parte amarela sempre numa linha própria */
.etiqueta .trecho { white-space: nowrap; } /* quebra de linha só entre os pares de palavras */
.abertura-texto p { font-size: 1.1875rem; color: #eef2ff; max-width: 34ch; margin: 22px 0 28px; }
.abertura-texto .linha-verde { font: 700 1rem var(--titulo); color: var(--lima-claro); display: block; margin-top: 18px; }
.acoes { display: flex; gap: 12px; flex-wrap: wrap; }

.colagem { position: relative; min-height: 440px; }
.colagem .foto-grande { position: absolute; right: 0; top: 30px; width: 78%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--raio-g) 28px 28px 90px; box-shadow: 0 18px 40px rgba(20, 26, 70, .35); }
.colagem .foto-pequena { position: absolute; left: 0; bottom: 0; width: 46%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 8px solid var(--azul-capa); }
.colagem .contorno { position: absolute; right: -18px; top: 6px; width: 60%; height: 82%; border: var(--linha) solid var(--indigo); border-left: 0; border-bottom: 0; border-top-right-radius: 44px; }
.colagem .rn { position: absolute; left: -6%; top: -60px; width: 52%; filter: drop-shadow(0 8px 14px rgba(20,26,70,.25)); }
.engrenagem { position: absolute; color: var(--amarelo); }
.engrenagem svg { width: 100%; height: 100%; }
.abertura .engrenagem { width: 74px; height: 74px; right: 2%; bottom: 120px; }

/* ondas de cor no rodapé das seções (como na capa da revista) */
.ondas { position: absolute; left: 0; right: 0; bottom: -1px; height: 130px; }
.ondas svg { width: 100%; height: 100%; display: block; }

/* ---------------------------------------------------------------- números */
.numeros { background: var(--papel); padding: 64px 0 88px; }
.numeros-topo { display: flex; align-items: end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 32px; }
.numeros-topo h2 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); color: var(--indigo); margin-top: 12px; }
.numeros-topo p { margin: 0; max-width: 40ch; color: var(--suave); font-size: 1.0625rem; }
.numeros-grade { display: grid; grid-template-columns: 0.85fr 1.6fr; gap: 24px; }

/* destaque índigo com o número principal */
.destaque-numero { background: var(--indigo); color: #fff; border-radius: var(--raio-g); padding: 32px 30px; position: relative; overflow: hidden; display: flex; flex-direction: column; }
.destaque-numero::after { content: ""; position: absolute; right: -80px; bottom: -90px; width: 190px; height: 190px; border-radius: 50%; background: var(--coral); }
.destaque-numero::before { content: ""; position: absolute; right: 50px; bottom: -96px; width: 120px; height: 120px; border-radius: 50%; background: var(--amarelo); z-index: 1; }
.destaque-numero { padding-bottom: 64px; }
.destaque-numero .rotulo { font: 600 0.9375rem var(--titulo); color: #aeb7e3; }
.destaque-numero strong { display: block; font: 800 clamp(3.2rem, 6.4vw, 4.6rem)/1 var(--titulo); color: var(--amarelo); margin: 14px 0 6px; letter-spacing: -.02em; }
.destaque-numero .legenda-num { font-size: 1.125rem; color: #e3e7fa; }
.pilula { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px; align-self: flex-start; background: rgba(255,255,255,.1); border-radius: 99px; padding: 8px 14px 8px 8px; font: 600 0.9375rem var(--titulo); color: #fff; position: relative; z-index: 2; }
.pilula b { background: var(--lima); color: var(--indigo); border-radius: 99px; padding: 3px 10px; font-weight: 800; }
.destaque-numero p { position: relative; z-index: 2; margin: 18px 0 0; color: #c9d0ee; font-size: 0.9688rem; max-width: 30ch; }

/* gráfico de colunas limpo */
.grafico { background: var(--branco); border-radius: var(--raio-g); padding: 26px 28px 18px; box-shadow: 0 1px 0 var(--cinza-claro), 0 16px 34px rgba(34,43,99,.07); }
.grafico-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.grafico h3 { font-size: 1.0625rem; color: var(--indigo); }
.grafico-legenda { display: flex; gap: 14px; font-size: 0.8125rem; color: var(--suave); }
.grafico-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.grafico-legenda i { width: 10px; height: 10px; border-radius: 3px; background: #c7d4ef; }
.grafico-legenda i.atual { background: var(--amarelo); }
.barras { display: grid; grid-template-columns: repeat(8, 1fr); gap: 14px; align-items: end; height: 230px; margin-top: 22px; padding-bottom: 2px; border-bottom: 2px solid var(--cinza-claro); background: repeating-linear-gradient(to top, transparent 0 56px, #f1efe9 56px 57px); }
.barra { display: flex; flex-direction: column; justify-content: end; height: 100%; }
.barra small { text-align: center; font: 700 0.8125rem var(--titulo); color: var(--indigo); margin-bottom: 6px; white-space: nowrap; }
/* --h = valor em % do maior ano; 0,84 deixa espaço para o rótulo em cima */
.barra b { display: block; height: calc(var(--h) * 0.84%); background: #c7d4ef; border-radius: var(--raio-p) 10px 3px 3px; transition: background .2s ease; }
.barra:hover b { background: var(--azul); }
.barra.atual b { background: var(--amarelo); }
.barra.atual small { color: var(--indigo); font-size: 0.9375rem; }
.anos { display: grid; grid-template-columns: repeat(8, 1fr); gap: 14px; margin-top: 8px; }
.anos span { text-align: center; font: 700 0.875rem var(--titulo); color: var(--indigo); }
.anos.inst span { font: 500 0.75rem var(--texto); color: var(--suave); margin-top: 0; }
.anos.inst { margin-top: 2px; }

/* cartões de apoio */
.cifras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 24px; }
.cifra { display: flex; align-items: center; gap: 18px; background: var(--branco); border-radius: var(--raio); padding: 20px 22px; box-shadow: 0 1px 0 var(--cinza-claro); }
.cifra .icone { flex: none; width: 58px; height: 58px; padding: 13px; border-radius: var(--raio); background: var(--fundo-icone, #fde7e5); color: var(--cor-icone, var(--coral)); }
.cifra:nth-child(2) { --fundo-icone: #fdf1d2; --cor-icone: #d89a07; }
.cifra:nth-child(3) { --fundo-icone: #eef4d6; --cor-icone: #6f9a1d; }
.cifra strong { display: block; font: 800 2.1rem/1 var(--titulo); color: var(--indigo); }
.cifra span { display: block; margin-top: 4px; font-size: 0.9375rem; color: var(--suave); line-height: 1.35; }
.fonte { font-size: 0.8125rem; color: var(--suave); margin: 18px 0 0; }

/* ---------------------------------------------------------------- painéis */
.secao { padding: 80px 0; }
.secao-topo { display: flex; align-items: end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 36px; }
.secao-topo p { margin: 10px 0 0; max-width: 52ch; color: var(--suave); }
.busca { display: flex; align-items: center; gap: 10px; background: var(--branco); border: 2px solid var(--cinza-claro); border-radius: var(--raio-p); padding: 0 14px; min-width: min(320px, 100%); color: var(--suave); }
.busca input { border: 0; outline: 0; font: inherit; padding: 12px 0; width: 100%; background: transparent; color: var(--tinta); }
.busca:focus-within { border-color: var(--azul); }

.grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 28px; }
.painel { background: var(--branco); border-radius: var(--raio); overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 1px 0 var(--cinza-claro), 0 14px 30px rgba(34, 43, 99, .08); transition: transform .2s ease, box-shadow .2s ease; position: relative; }
.painel::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 8px; background: var(--cor, var(--coral)); }
.painel:nth-child(4n+2) { --cor: var(--lima); }
.painel:nth-child(4n+3) { --cor: var(--ceu); }
.painel:nth-child(4n+4) { --cor: var(--amarelo); }
.painel:hover { transform: translateY(-4px); box-shadow: 0 1px 0 var(--cinza-claro), 0 22px 40px rgba(34, 43, 99, .14); }
.painel-imagem { aspect-ratio: 16 / 9; background: var(--indigo); position: relative; }
.painel-imagem img { width: 100%; height: 100%; object-fit: cover; }
.selo { position: absolute; top: 14px; left: 14px; font: 700 0.8125rem var(--titulo); padding: 5px 12px; border-radius: 99px; background: var(--lima); color: var(--indigo); }
.selo.em-breve { background: var(--amarelo); }
.painel-corpo { padding: 22px 24px 30px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.painel h3 { font-size: 1.375rem; color: var(--indigo); }
.painel p { margin: 0; color: var(--suave); }
.temas { display: flex; gap: 6px; flex-wrap: wrap; }
.temas span { font: 600 0.75rem var(--titulo); background: #eef2fb; color: var(--azul-escuro); padding: 4px 11px; border-radius: 99px; }
.painel-rodape { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 8px; }
.painel-rodape small { color: var(--suave); }
.vazio { text-align: center; color: var(--suave); padding: 32px; }

/* ---------------------------------------------------------------- chamada para o site dos painéis */
.chamada-paineis { background: #3771ae; color: #fff; padding: 76px 0; position: relative; overflow: hidden; }
.chamada-paineis::before { content: ""; position: absolute; left: -120px; bottom: -150px; width: 340px; height: 340px; border-radius: 50%; background: var(--coral); }
.chamada-paineis .conteiner { position: relative; display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 56px; align-items: center; }
.chamada-paineis h2 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); margin-top: 14px; }
.chamada-paineis p { color: #e7edfb; font-size: 1.0625rem; margin: 16px 0 22px; max-width: 46ch; }
.chamada-lista { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 12px; }
.chamada-lista li { border-left: 4px solid var(--amarelo); padding: 2px 0 2px 14px; }
.chamada-lista li:nth-child(2) { border-left-color: var(--lima); }
.chamada-lista b { display: block; font: 700 1.0625rem var(--titulo); }
.chamada-lista span { color: #cfdaf3; font-size: 0.9375rem; }
.chamada-tela { position: relative; display: block; min-height: 340px; }
.chamada-tela img { position: absolute; width: 74%; border-radius: var(--raio); box-shadow: 0 22px 44px rgba(10, 18, 60, .4); border: 6px solid #fff; transition: transform .25s ease; }
.chamada-tela img:first-child { left: 0; top: 0; transform: rotate(-3deg); }
.chamada-tela img:last-child { right: 0; bottom: 0; transform: rotate(3deg); }
.chamada-tela:hover img:first-child { transform: rotate(-1deg) translateY(-4px); }
.chamada-tela:hover img:last-child { transform: rotate(1deg) translateY(-4px); }

/* abertura do site dos painéis */
.lista-abertura { background: var(--indigo); color: #fff; position: relative; overflow: hidden; }
.lista-abertura .conteiner { position: relative; padding-top: 52px; padding-bottom: 140px; }
.lista-abertura h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
.lista-abertura h1 em { font-style: normal; color: var(--amarelo); }
.lista-abertura p { color: #d6dcf5; font-size: 1.125rem; max-width: 58ch; margin: 18px 0 0; }
.lista-abertura .bolha { position: absolute; right: -120px; top: -140px; width: 420px; height: 420px; border-radius: 46% 54% 60% 40% / 50% 45% 55% 50%; background: #3771ae; }
.lista-abertura .bolha.coral { right: 140px; top: auto; bottom: -220px; width: 300px; height: 300px; background: var(--coral); }
.contagem { display: inline-block; margin-top: 22px; font: 700 0.875rem var(--titulo); background: rgba(255,255,255,.1); padding: 6px 14px; border-radius: 99px; color: var(--amarelo); }
.lista-corpo { margin-top: -70px; position: relative; z-index: 2; }
.lista-corpo .secao-topo { background: var(--branco); border-radius: var(--raio); padding: 18px 22px; box-shadow: 0 10px 30px rgba(34,43,99,.1); margin-bottom: 32px; align-items: center; }
.lista-corpo .secao-topo p { margin: 0; }

/* ---------------------------------------------------------------- página Documentos */
.docs-abertura { --azul-capa: #3771ae; background: var(--azul-capa); color: #fff; position: relative; overflow: hidden; }
.docs-abertura .bolha-coral { position: absolute; right: -150px; top: -170px; width: 420px; height: 420px; background: var(--coral); border-radius: 46% 54% 60% 40% / 50% 45% 55% 50%; }
.docs-abertura .conteiner { position: relative; padding-top: 56px; padding-bottom: 150px; }
.docs-abertura .etiqueta { font-size: clamp(2rem, 4.6vw, 3.2rem); }
.docs-abertura p { color: #eef2ff; font-size: 1.1875rem; max-width: 56ch; margin: 20px 0 24px; }
.docs-busca { max-width: 560px; background: #fff; border-color: transparent; }

/* divisórias: abas de pasta com as cores da revista */
.docs { margin-top: -40px; position: relative; z-index: 2; }
.divisorias { display: flex; gap: 6px; flex-wrap: wrap; align-items: flex-end; justify-content: center; }
/* abas sólidas, encostadas na borda da pasta: a ativa é mais alta, as outras mais baixas */
.divisoria { --c: var(--coral); --t: #fff; font: inherit; cursor: pointer; border: 3px solid #fff; border-bottom: 0; text-align: left; background: var(--c); color: var(--t); border-radius: var(--raio) 18px 0 0; padding: 10px 20px; min-height: 56px; display: flex; flex-direction: column; justify-content: center; box-shadow: 0 -1px 0 1px rgba(34, 43, 99, .1); transition: min-height .15s ease, filter .15s ease; }
.divisoria span { font: 700 1rem/1.2 var(--titulo); }
.divisoria small { font-size: 0.8125rem; opacity: .85; }
.divisoria:hover { filter: brightness(1.05); min-height: 60px; }
.divisoria.ativa { min-height: 70px; padding-top: 14px; box-shadow: 0 -1px 0 1px rgba(34, 43, 99, .1), 0 -6px 16px rgba(34, 43, 99, .14); }
.divisoria[data-cor="1"] { --c: var(--amarelo); --t: var(--indigo); }
.divisoria[data-cor="2"] { --c: var(--lima); --t: var(--indigo); }
.divisoria[data-cor="3"] { --c: var(--ceu); --t: var(--indigo); }
.pasta { --c: var(--coral); background: var(--branco); border-top: 8px solid var(--c); border-radius: var(--raio); box-shadow: 0 1px 0 var(--cinza-claro), 0 18px 40px rgba(34, 43, 99, .1); padding: 10px 28px 26px; }
.pasta[data-cor="1"] { --c: var(--amarelo); }
.pasta[data-cor="2"] { --c: var(--lima); }
.pasta[data-cor="3"] { --c: var(--ceu); }
.pasta[data-cor="busca"] { --c: var(--indigo); border-radius: var(--raio); }
.docs-resultado { margin: 14px 0 0; font: 600 0.9375rem var(--titulo); color: var(--indigo); }
.docs-resultado:empty { display: none; }
.doc-grupo { padding-top: 20px; }
.doc-grupo h2 { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 1.1875rem; color: var(--indigo); padding-bottom: 10px; border-bottom: 2px solid var(--cinza-claro); }
.doc-grupo h2 small { font: 500 0.8125rem var(--texto); color: var(--suave); }
.doc-lista { list-style: none; margin: 0; padding: 0; }
.doc { display: flex; align-items: center; gap: 14px; padding: 12px 6px; border-bottom: 1px solid #f0eee8; }
.doc:hover { background: #fbfaf6; }
.doc-tipo { flex: none; width: 50px; text-align: center; font: 800 0.6875rem/1 var(--titulo); letter-spacing: .04em; padding: 8px 0; border-radius: var(--raio-p); background: #fde7e5; color: #c53a32; }
.tipo-docx { background: #e3ecf8; color: #2f5b9e; }
.tipo-xlsx { background: #eef4d6; color: #587a14; }
.tipo-pptx { background: #fdf1d2; color: #a87406; }
.tipo-pasta { background: #e7eefa; color: var(--indigo); }
/* miniatura da 1ª página */
.doc-capa { flex: none; position: relative; display: block; width: 64px; height: 86px; border-radius: 6px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px var(--cinza-claro), 0 3px 8px rgba(34, 43, 99, .12); transition: transform .15s ease; }
.doc-capa img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.doc:hover .doc-capa { transform: translateY(-2px) rotate(-1.5deg); }
.doc-selo { position: absolute; left: 3px; bottom: 3px; font: 800 0.5625rem/1 var(--titulo); letter-spacing: .04em; padding: 3px 4px; border-radius: 4px; background: #fde7e5; color: #c53a32; }
.doc-selo.tipo-docx { background: #e3ecf8; color: #2f5b9e; }
.doc-selo.tipo-pptx { background: #fdf1d2; color: #a87406; }
.doc-info { flex: 1; min-width: 0; }
.doc-info strong { display: block; font: 600 1rem/1.35 var(--titulo); color: var(--tinta); }
.doc-info span { display: block; font-size: 0.8125rem; color: var(--suave); margin-top: 2px; }
.doc-botao { flex: none; padding: 9px 14px; background: var(--indigo); color: #fff; border-radius: var(--raio-p); font-size: 0.875rem; }
.doc-botao:hover { background: var(--azul-escuro); transform: none; }

/* ---------------------------------------------------------------- fotos */
.acontece { background: var(--indigo); color: #fff; position: relative; overflow: hidden; padding: 84px 0 90px; }
.acontece .conteiner { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 56px; align-items: center; position: relative; }
.acontece h2 { font-size: clamp(1.9rem, 3.6vw, 2.75rem); }
.acontece h2 em { font-style: normal; color: var(--amarelo); }
.acontece p { color: #d6dcf5; font-size: 1.0625rem; margin: 18px 0 26px; max-width: 44ch; }
.mosaico { display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: 110px; gap: 12px; }
.mosaico img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--raio); }
.mosaico .m1 { grid-column: 1 / 4; grid-row: 1 / 3; border-radius: var(--raio) 18px 18px 60px; }
.mosaico .m2 { grid-column: 4 / 7; grid-row: 1 / 2; }
.mosaico .m3 { grid-column: 4 / 6; grid-row: 2 / 4; }
.mosaico .m4 { grid-column: 6 / 7; grid-row: 2 / 4; }
.mosaico .m5 { grid-column: 1 / 4; grid-row: 3 / 4; }
.acontece .bolha-lima { position: absolute; right: -120px; bottom: -140px; width: 360px; height: 360px; border-radius: 50% 50% 46% 54% / 56% 44% 56% 44%; background: var(--lima); opacity: .9; }

/* ---------------------------------------------------------------- vozes da rede */
.vozes { background: var(--lima-claro); padding: 84px 0; }
.vozes-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 36px; }
.voz { position: relative; background: var(--branco); border-radius: 0 0 26px 26px; padding: 64px 32px 32px; margin: 18px 0 0 18px; }
.voz::before { content: ""; position: absolute; left: -18px; top: -18px; right: 16px; bottom: 26px; border: var(--linha) solid var(--indigo); border-right: 0; border-bottom-left-radius: 26px; border-top-left-radius: 26px; pointer-events: none; }
.voz-titulo { position: absolute; left: 22px; top: 14px; display: flex; align-items: center; gap: 12px; font: 800 1.0625rem var(--titulo); color: var(--coral); }
.voz-titulo svg { width: 54px; height: 34px; }
.voz blockquote { margin: 0; font: 500 1.125rem/1.55 var(--texto); color: var(--tinta); }
.voz figcaption { margin-top: 14px; font-size: 0.9375rem; color: var(--suave); }
.voz figcaption strong { color: var(--indigo); display: block; font-family: var(--titulo); }

/* ---------------------------------------------------------------- chamada Instagram */
.chamada { background: var(--coral); color: #fff; position: relative; overflow: hidden; }
.chamada .conteiner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-top: 52px; padding-bottom: 110px; position: relative; }
.fim-pagina { padding-bottom: 150px !important; }
.chamada h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
.chamada p { margin: 6px 0 0; color: #ffe9e6; }
.chamada .bolha { position: absolute; right: 18%; top: -60%; width: 300px; height: 300px; border-radius: 50%; background: var(--vermelho); opacity: .6; }

/* ---------------------------------------------------------------- página Sobre */
.sobre-abertura { background: var(--azul); color: #fff; position: relative; overflow: hidden; }
.sobre-abertura .conteiner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; padding-top: 64px; padding-bottom: 150px; position: relative; }
.sobre-abertura .etiqueta { font-size: clamp(2.6rem, 7vw, 5rem); }
.sobre-abertura p { font-size: 1.25rem; line-height: 1.55; color: #f1f4ff; margin: 26px 0 20px; max-width: 32ch; }
.arroba { display: inline-flex; align-items: center; gap: 10px; font: 700 1.125rem var(--titulo); color: #fff; text-decoration: none; }
.arroba svg { width: 30px; height: 30px; }
.sobre-foto { position: relative; }
.sobre-foto img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; border-radius: var(--raio-g) 30px 110px 30px; box-shadow: 0 18px 40px rgba(20,26,70,.35); }
.sobre-foto .contorno { position: absolute; inset: -16px -16px 30% 30%; border: var(--linha) solid var(--indigo); border-left: 0; border-bottom: 0; border-top-right-radius: 46px; }
.sobre-abertura .engrenagem { width: 96px; height: 96px; left: 44%; bottom: 112px; }
.sobre-abertura .bolha-coral { position: absolute; left: -120px; bottom: 60px; width: 260px; height: 420px; border-radius: 0 60% 60% 0 / 0 50% 50% 0; background: var(--coral); }

.movimentos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 8px; }
.movimento { background: var(--branco); border-radius: var(--raio); padding: 26px 22px; box-shadow: var(--sombra); border-top: 6px solid var(--cor, var(--coral)); }
.movimento:nth-child(2) { --cor: var(--amarelo); }
.movimento:nth-child(3) { --cor: var(--lima); }
.movimento:nth-child(4) { --cor: var(--ceu); }
.movimento .num { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--indigo); color: #fff; font: 800 1.125rem var(--titulo); margin-bottom: 14px; }
.movimento h3 { font-size: 1.1875rem; color: var(--indigo); margin-bottom: 6px; }
.movimento p { margin: 0; color: var(--suave); font-size: 0.9688rem; }
.nota-metodo { margin: 22px 0 0; color: var(--suave); max-width: 80ch; }

.pesquisa { background: var(--amarelo); position: relative; overflow: hidden; padding: 72px 0; }
.pesquisa .bolha-clara { position: absolute; left: -10%; top: -30%; width: 60%; height: 140%; background: var(--amarelo-claro); border-radius: 46% 54% 58% 42% / 50% 50% 50% 50%; }
.pesquisa .conteiner { position: relative; }
.pesquisa-grade { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: start; margin-top: 32px; }
.pesquisa .cifras { grid-template-columns: repeat(2, 1fr); gap: 22px; }
.pesquisa .cifra { display: block; text-align: left; background: rgba(255,255,255,.6); border-radius: var(--raio); padding: 18px 20px; }
.indicadores { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.indicadores li { background: var(--branco); border-radius: var(--raio); padding: 14px 18px; }
.indicadores .rotulo { display: flex; justify-content: space-between; gap: 12px; font: 600 0.9688rem var(--titulo); color: var(--indigo); }
.indicadores .rotulo b { font-weight: 800; color: var(--coral); }
.indicadores .trilho { display: block; height: 10px; border-radius: var(--raio-p); background: var(--cinza-claro); margin: 8px 0 6px; overflow: hidden; }
.indicadores .trilho i { display: block; height: 100%; border-radius: var(--raio-p); background: var(--indigo); }
.indicadores small { display: block; color: var(--suave); }

.linha-tempo { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 18px; }
.marco { display: grid; grid-template-columns: 120px 1fr; gap: 26px; align-items: stretch; }
.marco .ano { background: var(--cinza-claro); border-radius: var(--raio); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 16px 8px; font: 800 1.625rem var(--titulo); color: #8a8a8a; }
.marco .ano i { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--cor, var(--indigo)); color: #fff; }
.marco .ano svg { width: 24px; height: 24px; }
.marco .texto { border-left: 8px solid var(--cor, var(--indigo)); border-radius: 6px; padding: 8px 0 8px 20px; align-self: center; }
.marco h3 { font-size: 1.1875rem; color: var(--cor-titulo, var(--indigo)); margin-bottom: 4px; }
.marco p { margin: 0; color: var(--tinta); }
.marco.pedagogico { --cor: #8ab832; --cor-titulo: #6f9a1d; }
.marco.normativo { --cor: #e54b7a; --cor-titulo: #c9325f; }
.marco.expansao { --cor: var(--azul); --cor-titulo: var(--azul-escuro); }
.legenda { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 18px; font-size: 0.875rem; color: var(--suave); }
.legenda span { display: inline-flex; align-items: center; gap: 8px; }
.legenda i { width: 14px; height: 14px; border-radius: 50%; background: var(--indigo); }

.unidades { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.unidade { background: var(--branco); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); }
.unidade img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.unidade div { padding: 18px 22px 22px; }
.unidade h3 { font-size: 1.25rem; color: var(--indigo); margin-bottom: 6px; }
.unidade p { margin: 0; color: var(--suave); }
.cursos li a { color: inherit; text-decoration: none; }
.cursos li a:hover { text-decoration: underline; }

.cursos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cursos li { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 16px; background: var(--branco); border-radius: var(--raio-p); font: 600 1rem var(--titulo); color: var(--indigo); box-shadow: 0 1px 0 var(--cinza-claro); }
.cursos li::before { content: ""; flex: none; width: 12px; height: 12px; border-radius: 50%; background: var(--cor, var(--coral)); }
.cursos li:nth-child(4n+2) { --cor: var(--amarelo); }
.cursos li:nth-child(4n+3) { --cor: var(--lima); }
.cursos li:nth-child(4n+4) { --cor: var(--ceu); }
.modalidades { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 28px; }
.modalidade { border: var(--linha) solid var(--indigo); border-radius: var(--raio); padding: 20px 22px; background: var(--branco); }
.modalidade strong { display: block; font: 800 1.75rem var(--titulo); color: var(--coral); }
.modalidade span { color: var(--tinta); }

/* ---------------------------------------------------------------- página do painel */
.painel-abertura { background: var(--azul); color: #fff; position: relative; overflow: hidden; }
.painel-abertura .conteiner { padding-top: 40px; padding-bottom: 120px; position: relative; }
.trilha { font-size: 0.9375rem; color: #dde4fa; margin-bottom: 18px; }
.trilha a { color: #fff; font-weight: 700; }
.painel-abertura .etiqueta { font-size: clamp(1.6rem, 3.6vw, 2.5rem); max-width: 22ch; }
.painel-abertura p { color: #eef2ff; font-size: 1.125rem; max-width: 62ch; margin: 18px 0 22px; }
.quadro-envolve { margin-top: -84px; position: relative; z-index: 2; }
.quadro { background: var(--branco); border-radius: var(--raio); overflow: hidden; box-shadow: 0 20px 44px rgba(34, 43, 99, .18); }
.quadro-proporcao { position: relative; width: 100%; padding-top: calc(56.25% + 36px); }
.quadro-proporcao iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.aguardando { padding: 48px 24px; text-align: center; }
.aguardando img { width: min(420px, 85%); margin: 0 auto 22px; border-radius: var(--raio); }
.aguardando h2 { color: var(--indigo); margin-bottom: 8px; }
.aguardando p { color: var(--suave); max-width: 52ch; margin: 0 auto; }
.detalhes { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; padding: 40px 0 80px; }
.caixa { background: var(--branco); border-radius: var(--raio); padding: 24px 26px; box-shadow: 0 1px 0 var(--cinza-claro); }
.caixa h2 { font-size: 1.1875rem; color: var(--indigo); margin-bottom: 14px; }
.caixa ol { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: 24px; counter-reset: pag; }
.caixa li { break-inside: avoid; margin-bottom: 8px; display: flex; gap: 10px; align-items: baseline; counter-increment: pag; }
.caixa li::before { content: counter(pag); flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #eef2fb; color: var(--indigo); font: 700 0.8125rem var(--titulo); }
.caixa p { margin: 0; color: var(--suave); }

/* ---------------------------------------------------------------- rodapé */
.rodape { background: var(--indigo); color: #cdd3ef; font-size: 0.9375rem; position: relative; }
/* as ondas sobem sobre a seção anterior, qualquer que seja a cor dela */
.rodape-ondas { height: 70px; margin-top: -69px; position: relative; pointer-events: none; }
.rodape-ondas svg { width: 100%; height: 100%; display: block; }
.rodape-grade { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 36px; padding-top: 28px; padding-bottom: 32px; }
.rodape h2 { color: #fff; font-size: 1.0625rem; margin: 0 0 12px; }
.rodape p { margin: 0 0 6px; }
.rodape address { font-style: normal; display: flex; flex-direction: column; gap: 3px; }
.rodape a { color: #fff; }
.rodape-email { margin-top: 8px; font-weight: 700; }
.rodape-logos { background: #fff; border-radius: var(--raio); padding: 12px 14px; display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.rodape-logos img { height: 40px; width: auto; }
.rodape-insta { display: inline-flex; align-items: center; gap: 10px; background: rgba(255,255,255,.08); border-radius: var(--raio-p); padding: 10px 14px; text-decoration: none; font-weight: 700; }
.rodape-insta svg { width: 22px; height: 22px; }
.destaque-lima { color: var(--lima-claro); font-weight: 700; }
.rodape-base { border-top: 1px solid rgba(255,255,255,.12); text-align: center; padding: 16px; font-size: 0.8125rem; }
.rodape .faixa-cores { height: 6px; }

/* ---------------------------------------------------------------- telas menores */
@media (max-width: 960px) {
  .abertura .conteiner, .sobre-abertura .conteiner, .acontece .conteiner, .pesquisa-grade { grid-template-columns: 1fr; }
  .colagem { min-height: 360px; max-width: 560px; }
  .numeros-grade, .chamada-paineis .conteiner { grid-template-columns: 1fr; }
  .chamada-tela { min-height: 300px; max-width: 560px; }
  .cifras { grid-template-columns: 1fr 1fr; }  .movimentos, .unidades, .modalidades { grid-template-columns: repeat(2, 1fr); }
  .rodape-grade { grid-template-columns: 1fr 1fr; }
  .vozes-grade { grid-template-columns: 1fr; }
  .detalhes { grid-template-columns: 1fr; }
  .cursos { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .topo .conteiner { gap: 10px; }
  .marca-nome, .marca .divisor { display: none; }
  .menu a { padding: 8px 10px; font-size: 0.875rem; }
  .abertura .conteiner { padding-top: 40px; padding-bottom: 120px; }
  .colagem { min-height: 280px; }
  .cifras { grid-template-columns: 1fr; }
  .barras, .anos { gap: 5px; }
  .barras { height: 190px; }
  .barra small { font-size: 0.5625rem; }
  .barra.atual small { font-size: 0.6875rem; }
  .anos span { font-size: 0.6875rem; }
  .anos.inst { display: none; }
  .grafico { padding: 20px 16px 14px; }
  .grade { grid-template-columns: 1fr; }
  .mosaico { grid-auto-rows: 80px; gap: 8px; }
  .movimentos, .unidades, .modalidades, .rodape-grade, .cursos { grid-template-columns: 1fr; }
  .pesquisa .cifras { grid-template-columns: 1fr 1fr; }
  .marco { grid-template-columns: 86px 1fr; gap: 14px; }
  .marco .ano { font-size: 1.25rem; }
  .caixa ol { columns: 1; }
  .barra-gov .conteiner { justify-content: center; }
  .so-largo, .acesso > span { display: none; }
  .divisorias { padding-left: 0; }
  .divisoria { flex: 1 1 45%; border-radius: var(--raio-p) 14px 0 0; padding: 10px 12px; min-height: 56px; }
  .divisoria span { font-size: 0.875rem; }
  .pasta { padding: 6px 14px 18px; border-radius: 0 0 18px 18px; }
  .doc { flex-wrap: wrap; }
  .doc { gap: 12px; }
  .doc-info { flex-basis: calc(100% - 80px); }
  .doc-botao { margin-left: 76px; }
  .voz { padding: 60px 20px 24px; }
}

/* =====================================================================
   Abas do site: EPT estadual, A SUEP, Acompanhamento, Boas práticas, Agenda
   ===================================================================== */

/* ---------------------------------------------------------------- menu recolhível */
.menu-botao { display: none; place-items: center; width: 44px; height: 44px; padding: 0; color: var(--indigo); background: #eef2fb; border: 0; border-radius: var(--raio-p); cursor: pointer; }
.menu-botao span { display: grid; gap: 5px; width: 20px; }
.menu-botao i { display: block; height: 2.5px; border-radius: 2px; background: currentColor; }
.menu-cabeca, .menu-fundo { display: none; }
.menu a { padding: 10px 11px; }
.menu a[aria-current="page"]::after { left: 11px; right: 11px; }
@media (max-width: 1280px) { .marca-nome, .marca .divisor { display: none; } }
/* site público: logos e menu sempre na mesma linha */
.menu-longo .marca-nome { display: none; }
.marca { flex-shrink: 0; } /* os logos nunca encolhem para o menu caber */
.menu-longo .conteiner { flex-wrap: nowrap; }
.menu-longo .menu { flex-wrap: nowrap; }
.menu-longo .menu a { white-space: nowrap; padding: 10px 10px; }
.menu-longo .menu a[aria-current="page"]::after { left: 10px; right: 10px; }
@media (max-width: 1240px) { .menu-longo .menu a { font-size: 0.875rem; padding: 10px 8px; } .menu-longo .menu a[aria-current="page"]::after { left: 8px; right: 8px; } }
/* celular e tablet: cabeçalho compacto (☰ + logos) e gaveta de páginas pela esquerda */
@media (max-width: 1160px) {
  .topo .conteiner { display: grid; grid-template-columns: 44px 1fr 44px; gap: 8px; min-height: 60px; padding-top: 6px; padding-bottom: 6px; }
  .menu-botao { display: grid; grid-column: 1; grid-row: 1; }
  .topo .marca { grid-column: 2; grid-row: 1; justify-self: center; margin: 0; gap: 10px; }
  .topo .marca img { height: 36px; }
  .topo .marca .divisor { display: block; height: 28px; }
  .topo .menu { position: fixed; top: 0; left: 0; bottom: 0; z-index: 70; width: min(300px, 84vw); display: flex; flex-direction: column; align-items: stretch; gap: 2px; padding: 14px 14px 28px; background: var(--branco); overflow-y: auto; box-shadow: 12px 0 40px rgba(20, 26, 60, .25); transform: translateX(-105%); visibility: hidden; transition: transform .28s ease, visibility 0s linear .28s; }
  .menu-aberto .menu { transform: none; visibility: visible; transition: transform .28s ease; }
  .menu-fundo { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(20, 26, 60, .45); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
  .menu-aberto .menu-fundo { opacity: 1; pointer-events: auto; }
  .menu-cabeca { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 12px 6px; margin-bottom: 8px; border-bottom: 2px solid var(--cinza-claro); font: 800 1.125rem var(--titulo); color: var(--indigo); }
  .menu-fechar { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: var(--raio-p); background: #eef2fb; color: var(--indigo); cursor: pointer; }
  .menu-fechar svg { width: 20px; height: 20px; }
  .topo .menu a { padding: 12px 14px; font-size: 1rem; border-radius: var(--raio-p); white-space: normal; }
  .topo .menu a[aria-current="page"] { background: #eef2fb; }
  .topo .menu a[aria-current="page"]::after { left: 0; right: auto; top: 10px; bottom: 10px; width: 4px; height: auto; }
  .topo .menu .menu-insta { display: flex; align-items: center; width: auto; height: auto; padding: 12px 14px; }
  .menu .menu-insta::after { content: "Instagram da SUEP"; font: 600 1rem var(--titulo); color: var(--indigo); margin-left: 10px; }
  .topo .menu .menu-destaque { margin: 10px 0 0; text-align: center; }
  html.sem-rolagem { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) { .topo .menu, .menu-fundo { transition: none; } }

/* ---------------------------------------------------------------- grupos do menu (Quem somos, Para as escolas...) */
.menu-grupo { position: relative; }
.menu-grupo-botao { display: inline-flex; align-items: center; gap: 6px; position: relative; font: 600 0.9375rem var(--titulo); color: var(--indigo); background: none; border: 0; border-radius: var(--raio-p); padding: 10px 11px; cursor: pointer; white-space: nowrap; }
.menu-grupo-botao svg { width: 14px; height: 14px; transition: transform .2s ease; }
.menu-grupo-botao:hover, .menu-grupo.aberto .menu-grupo-botao { background: #eef2fb; }
.menu-grupo.aberto .menu-grupo-botao svg { transform: rotate(180deg); }
.menu-grupo.atual .menu-grupo-botao::after { content: ""; position: absolute; left: 11px; right: 31px; bottom: 4px; height: 3px; border-radius: 3px; background: var(--coral); }
.submenu { display: none; position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; min-width: 300px; padding: 8px; background: var(--branco); border-radius: var(--raio); box-shadow: 0 0 0 1px var(--cinza-claro), 0 18px 40px rgba(20, 26, 60, .18); }
.submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; } /* ponte para o mouse não "cair" entre o botão e a lista */
.menu-grupo:last-of-type .submenu { left: auto; right: 0; }
.menu-grupo.aberto .submenu { display: grid; gap: 2px; }
@media (hover: hover) and (min-width: 1161px) { .menu-grupo:hover .submenu { display: grid; gap: 2px; } }
.topo .submenu a { display: block; padding: 10px 12px; border-radius: var(--raio-p); white-space: normal; }
.topo .submenu a b { display: block; font: 700 0.9688rem var(--titulo); color: var(--indigo); }
.topo .submenu a span { display: block; margin-top: 2px; font: 400 0.8125rem/1.35 var(--texto); color: var(--suave); }
.topo .submenu a[aria-current="page"] { background: #eef2fb; }
.topo .submenu a[aria-current="page"]::after { left: 0; right: auto; top: 10px; bottom: 10px; width: 3px; height: auto; }

/* na gaveta (celular e tablet), cada grupo vira um título com as páginas embaixo */
@media (max-width: 1160px) {
  .topo .menu-grupo { display: block; }
  .topo .menu-grupo-botao { display: block; width: 100%; text-align: left; padding: 16px 14px 4px; font: 700 0.875rem var(--titulo); color: var(--coral); background: none; pointer-events: none; }
  .topo .menu-grupo-botao svg, .topo .menu-grupo.atual .menu-grupo-botao::after { display: none; }
  .topo .submenu { display: grid; gap: 2px; position: static; min-width: 0; padding: 0; box-shadow: none; background: none; }
  .topo .submenu::before { display: none; }
}

/* ---------------------------------------------------------------- abertura das abas (mesma da página A SUEP, com cor própria) */
.sobre-abertura { background: var(--fundo, var(--azul)); }
.sobre-abertura .etiqueta.media { font-size: clamp(2.2rem, 5.4vw, 3.8rem); }
.sobre-abertura .etiqueta.media em { display: block; }
.sobre-abertura .bolha-coral { background: var(--bolha, var(--coral)); }
/* alinhamento óptico das capas: o texto, os botões e a busca começam na mesma linha
   da letra do título, e não na borda da caixa índigo (que tem margem interna de 0,7em) */
.abertura-texto { --tam: clamp(2rem, 4.6vw, 3.4rem); }
.sobre-abertura .conteiner > div:first-child { --tam: clamp(2.6rem, 7vw, 5rem); }
.sobre-abertura .conteiner > div:first-child:has(.etiqueta.media) { --tam: clamp(2.2rem, 5.4vw, 3.8rem); }
.docs-abertura .conteiner { --tam: clamp(2rem, 4.6vw, 3.2rem); }
/* painel da capa: título, texto e botões dentro da mesma caixa, com a moldura de linha da revista no canto.
   Assim as bordas esquerda e direita do texto sempre coincidem com as do título. */
.docs-abertura .capa-texto { --tam: clamp(2rem, 4.6vw, 3.2rem); max-width: 760px; }
.abertura .abertura-texto, .sobre-abertura .conteiner > div:first-child, .docs-abertura .capa-texto {
  position: relative; background: var(--painel, var(--indigo)); color: #fff;
  border-radius: 34px; padding: clamp(26px, 3.4vw, 44px);
  box-shadow: 0 18px 40px rgba(12, 18, 54, .22);
}
.abertura .abertura-texto::before, .sobre-abertura .conteiner > div:first-child::before, .docs-abertura .capa-texto::before {
  content: ""; position: absolute; top: -14px; right: -14px; width: 58%; height: 72%;
  border-top: var(--linha) solid var(--moldura, var(--amarelo)); border-right: var(--linha) solid var(--moldura, var(--amarelo));
  border-top-right-radius: 46px; pointer-events: none;
}
.abertura .abertura-texto .etiqueta, .sobre-abertura .conteiner .etiqueta, .docs-abertura .capa-texto .etiqueta {
  display: block; font-size: var(--tam); background: none; padding: 0; border-radius: 0;
}
.abertura .abertura-texto p, .sobre-abertura .conteiner > div:first-child > p, .docs-abertura .capa-texto p {
  max-width: none; margin: 18px 0 0; color: #e6eaf8;
}
.abertura .abertura-texto .acoes { margin-top: 26px; }
.sobre-abertura .conteiner > div:first-child .arroba, .sobre-abertura .conteiner > div:first-child .abertura-chips { margin-top: 20px; }
.docs-abertura .capa-texto .docs-busca { margin-top: 22px; }
.abertura { --painel: #3771ae; }
.sobre-abertura.clara { --moldura: var(--coral); }
.sobre-abertura.clara .conteiner > div:first-child, .sobre-abertura.clara .conteiner > div:first-child p { color: #fff; }
.sobre-abertura.clara .conteiner > div:first-child p { color: #e6eaf8; }

/* capa clara (amarela): textos em índigo */
.sobre-abertura.clara { color: var(--indigo); }
.sobre-abertura.clara p { color: var(--tinta); }
.sobre-abertura.clara .sobre-foto .contorno { border-color: var(--coral); }
.abertura-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.abertura-chips span { font: 700 0.875rem var(--titulo); padding: 6px 14px; border-radius: 99px; background: rgba(255,255,255,.16); }

[id] { scroll-margin-top: 96px; } /* títulos não ficam escondidos sob o topo fixo */
.secao-cabeca { margin-bottom: 30px; }
.secao-cabeca .etiqueta { margin-top: 12px; }
.secao-cabeca p { margin: 16px 0 0; max-width: 68ch; color: var(--suave); font-size: 1.0625rem; }
.secao.cinza { background: #f3f1ea; }

/* ---------------------------------------------------------------- governança (EPT estadual) */
.governanca { display: grid; grid-template-columns: 1fr 1.1fr 1fr; gap: 18px; align-items: stretch; }
.gov-centro { grid-column: 2; grid-row: 1 / 3; background: var(--indigo); color: #fff; border-radius: var(--raio-g); padding: 34px 30px; display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; }
.gov-centro::after { content: ""; position: absolute; right: -60px; bottom: -70px; width: 170px; height: 170px; border-radius: 50%; background: var(--coral); }
.gov-centro h3 { font-size: 2.2rem; color: var(--amarelo); }
.gov-centro p { position: relative; z-index: 1; margin: 12px 0 0; color: #dfe4f8; font-size: 1.0625rem; }
.gov-centro ul { position: relative; z-index: 1; list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 8px; }
.gov-centro li { display: flex; gap: 10px; align-items: center; font: 600 0.9688rem var(--titulo); }
.gov-centro li::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--lima); }
.gov-item { background: var(--branco); border-radius: var(--raio); padding: 20px 22px; box-shadow: var(--sombra); border-left: 6px solid var(--cor, var(--coral)); }
.gov-item h3 { font-size: 1.0625rem; color: var(--indigo); margin-bottom: 4px; }
.gov-item p { margin: 0; color: var(--suave); font-size: 0.9688rem; }
.gov-item.c2 { --cor: var(--amarelo); }
.gov-item.c3 { --cor: var(--lima); }
.gov-item.c4 { --cor: var(--ceu); }
.gov-item.c5 { --cor: var(--azul); }
.gov-item.largo { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; border-left-color: var(--indigo); }
.gov-item.largo strong { font: 800 2.4rem/1 var(--titulo); color: var(--coral); }
.gov-item.largo p { flex: 1; min-width: 240px; }

/* ---------------------------------------------------------------- como a rede se organiza: de cima para baixo */
.niveis { display: grid; gap: 16px; justify-items: center; }
.rede-topo { width: 100%; background: var(--indigo); color: #fff; border-radius: var(--raio); padding: 20px 28px; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.rede-topo strong { font: 800 2.8rem/1 var(--titulo); color: var(--amarelo); }
.rede-topo span { font: 700 1.125rem var(--titulo); }
.rede-topo small { display: block; color: #c9d0ee; font: 400 0.9375rem var(--texto); margin-top: 2px; }
.nivel { width: var(--w, 100%); display: grid; grid-template-columns: 200px 1fr auto; gap: 24px; align-items: center; background: var(--branco); border-radius: var(--raio); padding: 14px 26px 14px 14px; box-shadow: var(--sombra); border-top: 6px solid var(--cor, var(--coral)); }
.nivel img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--raio); }
.nivel h3 { font-size: 1.375rem; color: var(--indigo); margin-bottom: 6px; }
.nivel p { margin: 0; color: var(--suave); }
.nivel .qtd { text-align: center; font: 800 3rem/1 var(--titulo); color: var(--cor-num, var(--coral)); }
.nivel .qtd small { display: block; font: 600 0.8125rem var(--texto); color: var(--suave); margin-top: 4px; }
.nivel.n1 { --cor: var(--coral); }
.nivel.n2 { --cor: var(--amarelo); --cor-num: #d89a07; }
.nivel.n3 { --cor: var(--lima); --cor-num: #6f9a1d; }
.nivel .qtd { min-width: 96px; }

/* outros destaques das visitas, embaixo das cifras */
.mais-destaques { grid-column: 1 / -1; background: var(--branco); border-radius: var(--raio); padding: 18px 20px 8px; }
.mais-destaques h3 { font-size: 1rem; color: var(--indigo); margin-bottom: 6px; }
.mais-destaques ul { list-style: none; margin: 0; padding: 0; }
.mais-destaques li { display: flex; align-items: baseline; gap: 14px; padding: 10px 0; border-top: 1px solid var(--cinza-claro); }
.mais-destaques li:first-child { border-top: 0; }
.mais-destaques b { flex: none; width: 3.2em; font: 800 1.375rem var(--titulo); color: var(--coral); }
.mais-destaques span { color: var(--tinta); font-size: 0.9688rem; line-height: 1.4; }
.mais-destaques small { display: block; color: var(--suave); font-size: 0.8125rem; }

/* ---------------------------------------------------------------- destaques numéricos em linha */
.destaques { display: grid; grid-template-columns: repeat(var(--n, 4), 1fr); gap: 18px; }
.destaques div { background: var(--branco); border-radius: var(--raio); padding: 20px 22px; box-shadow: 0 1px 0 var(--cinza-claro); }
.destaques strong { display: block; font: 800 clamp(1.8rem, 3vw, 2.4rem)/1 var(--titulo); color: var(--indigo); }
.destaques span { display: block; margin-top: 6px; color: var(--suave); font-size: 0.9375rem; line-height: 1.35; }
.destaques.sobre-cor div { background: rgba(255,255,255,.14); box-shadow: none; }
.destaques.sobre-cor strong { color: var(--amarelo); }
.destaques.sobre-cor span { color: #e6eaf8; }

/* ---------------------------------------------------------------- texto + fotos lado a lado */
.relato { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
.relato.invertido > :first-child { order: 2; }
.relato h3 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); color: var(--indigo); margin: 12px 0 14px; }
.relato p { margin: 0 0 14px; color: var(--tinta); }
.relato-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.relato-fotos img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--raio); }
.relato-fotos img:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; border-radius: var(--raio) 18px 18px 60px; }
.citacao { margin: 20px 0 0; background: var(--amarelo); border-radius: 0 22px 22px 22px; padding: 20px 22px; font: 500 1.0625rem/1.5 var(--texto); color: var(--indigo); }
.citacao cite { display: block; margin-top: 8px; font: 600 0.875rem var(--titulo); font-style: normal; color: var(--tinta); }

/* ---------------------------------------------------------------- A SUEP: atribuições, ações e equipe */
.atribuicoes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.atribuicao { background: var(--branco); border-radius: var(--raio); padding: 24px 22px; box-shadow: var(--sombra); }
.atribuicao .icone { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--fundo-i, #fde7e5); color: var(--cor-i, var(--coral)); margin-bottom: 14px; }
.atribuicao .icone svg { width: 28px; height: 28px; }
.atribuicao:nth-child(2) { --fundo-i: #fdf1d2; --cor-i: #c88a00; }
.atribuicao:nth-child(3) { --fundo-i: #eef4d6; --cor-i: #6f9a1d; }
.atribuicao:nth-child(4) { --fundo-i: #e3f1fb; --cor-i: #2f7fb8; }
.atribuicao h3 { font-size: 1.125rem; color: var(--indigo); margin-bottom: 6px; }
.atribuicao p { margin: 0; color: var(--suave); font-size: 0.9688rem; }
.articula { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 22px; }
.articula div { border: var(--linha) solid var(--indigo); border-radius: var(--raio); padding: 24px; background: #fff; }
.articula b { display: block; font: 800 1.125rem var(--titulo); color: var(--indigo); margin-bottom: 6px; }
.articula span { color: var(--suave); font-size: 0.9688rem; }

.acoes-suep { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.acao-suep { display: flex; flex-direction: column; background: var(--branco); border-radius: var(--raio); padding: 24px 26px; box-shadow: var(--sombra); border-top: 6px solid var(--cor, var(--coral)); }
.acao-suep:nth-child(2) { --cor: var(--amarelo); }
.acao-suep:nth-child(3) { --cor: var(--lima); }
.acao-suep:nth-child(4) { --cor: var(--ceu); }
.acao-suep h3 { font-size: 1.25rem; color: var(--indigo); margin-bottom: 8px; }
.acao-suep p { margin: 0 0 14px; color: var(--suave); }
.acao-suep .mais { margin-top: auto; font: 700 0.9375rem var(--titulo); color: var(--azul-escuro); text-decoration: none; }
.acao-suep .mais:hover { text-decoration: underline; }
.selo-nacional { margin-top: 22px; display: flex; gap: 18px; align-items: center; background: var(--indigo); color: #fff; border-radius: var(--raio); padding: 22px 26px; }
.selo-nacional svg { flex: none; width: 52px; height: 52px; color: var(--amarelo); }
.selo-nacional b { display: block; font: 700 1.125rem var(--titulo); color: var(--amarelo); }
.selo-nacional span { color: #dfe4f8; }

.equipe-chefe { display: flex; align-items: center; gap: 18px; background: var(--indigo); color: #fff; border-radius: var(--raio); padding: 20px 24px; margin-bottom: 18px; max-width: 560px; }
.equipe-chefe .avatar { width: 70px; height: 70px; font-size: 1.5rem; background: var(--amarelo); color: var(--indigo); }
.equipe-chefe b { display: block; font: 800 1.25rem var(--titulo); }
.equipe-chefe span { color: #c9d0ee; }
.equipe { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.equipe li { display: flex; align-items: center; gap: 12px; background: var(--branco); border-radius: var(--raio); padding: 10px 14px; box-shadow: 0 1px 0 var(--cinza-claro); font: 600 0.9688rem/1.3 var(--titulo); color: var(--indigo); }
.avatar { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--cor, var(--coral)); color: #fff; font: 800 0.9375rem var(--titulo); }
.equipe li:nth-child(4n+2) .avatar { --cor: #d89a07; }
.equipe li:nth-child(4n+3) .avatar { --cor: #6f9a1d; }
.equipe li:nth-child(4n+4) .avatar { --cor: #2f7fb8; }

/* ---------------------------------------------------------------- Acompanhamento: ciclo e dimensões */
.ciclo { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; counter-reset: etapa; }
.ciclo li { counter-increment: etapa; position: relative; background: var(--branco); border-radius: var(--raio); padding: 22px 18px 20px; box-shadow: var(--sombra); }
.ciclo li::before { content: counter(etapa); display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--cor, var(--coral)); color: #fff; font: 800 1.0625rem var(--titulo); margin-bottom: 12px; }
.ciclo li:not(:last-child)::after { content: ""; position: absolute; right: -13px; top: 36px; width: 9px; height: 9px; border-top: 3px solid var(--indigo); border-right: 3px solid var(--indigo); transform: rotate(45deg); }
.ciclo li:nth-child(2) { --cor: #d89a07; }
.ciclo li:nth-child(3) { --cor: #6f9a1d; }
.ciclo li:nth-child(4) { --cor: #2f7fb8; }
.ciclo li:nth-child(5) { --cor: var(--indigo); }
.ciclo b { display: block; font: 800 1.1875rem var(--titulo); color: var(--indigo); margin-bottom: 4px; }
.ciclo span { color: var(--suave); font-size: 0.9375rem; }
.dimensoes { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dimensoes li { font: 600 1rem var(--titulo); color: var(--indigo); background: var(--branco); border: 2px solid var(--indigo); border-radius: 99px; padding: 10px 18px; }

/* ---------------------------------------------------------------- Boas práticas: pódio, escolas e convite */
.podio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 26px; }
.premio { background: var(--branco); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); display: flex; flex-direction: column; }
.premio img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.premio div { padding: 18px 22px 22px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.premio .lugar { align-self: flex-start; font: 800 0.875rem var(--titulo); padding: 5px 12px; border-radius: 99px; background: var(--amarelo); color: var(--indigo); }
.premio:nth-child(2) .lugar { background: #dfe4ee; }
.premio:nth-child(3) .lugar { background: #f3c9a4; }
.premio h3 { font-size: 1.3125rem; color: var(--indigo); }
.premio p { margin: 0; color: var(--suave); font-size: 0.9375rem; }
.premio .escola { margin-top: auto; padding-top: 8px; font: 700 0.9375rem var(--titulo); color: var(--coral); }
.escolas { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 24px; }
.escolas li { break-inside: avoid; padding: 10px 0; border-bottom: 1px solid rgba(34,43,99,.15); font: 600 1rem var(--titulo); color: var(--indigo); }
.convite { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; background: var(--indigo); color: #fff; border-radius: var(--raio-g); padding: 30px 34px; position: relative; overflow: hidden; }
.convite::before { content: ""; position: absolute; right: -60px; top: -80px; width: 220px; height: 220px; border-radius: 50%; background: var(--coral); opacity: .9; }
.convite > * { position: relative; }
.convite h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); }
.convite p { margin: 8px 0 0; color: #d6dcf5; max-width: 56ch; }

/* ---------------------------------------------------------------- Agenda formativa */
.formacoes { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: acao; }
.formacao { counter-increment: acao; display: grid; grid-template-columns: 56px 1.1fr 1fr 1.3fr; gap: 20px; align-items: center; background: var(--branco); border-radius: var(--raio); padding: 16px 22px 16px 16px; box-shadow: var(--sombra); }
.formacao::before { content: counter(acao); display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--raio); background: var(--amarelo); color: var(--indigo); font: 800 1.375rem var(--titulo); }
.formacao h3 { font-size: 1.125rem; color: var(--indigo); }
.formacao .publico, .formacao .funcao { color: var(--suave); font-size: 0.9688rem; line-height: 1.4; }
.formacao small { display: block; font: 700 0.8125rem var(--titulo); color: var(--coral); margin-bottom: 2px; }
.metodo { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 8px; }
.metodo div { padding: 26px 26px 24px; color: #fff; }
.metodo div:nth-child(1) { background: var(--coral); border-radius: var(--raio) 0 0 26px; }
.metodo div:nth-child(2) { background: var(--azul); }
.metodo div:nth-child(3) { background: var(--lima); color: var(--indigo); border-radius: 0 26px 26px 0; }
.metodo b { display: block; font: 800 1.5rem var(--titulo); margin-bottom: 6px; }
.documento-destaque { display: flex; align-items: center; gap: 22px; background: var(--branco); border-radius: var(--raio); padding: 18px 24px 18px 18px; box-shadow: 0 1px 0 var(--cinza-claro), 0 12px 26px rgba(34,43,99,.08); max-width: 720px; }
.documento-destaque img { flex: none; width: 92px; height: 124px; object-fit: cover; object-position: top; border-radius: var(--raio-p); box-shadow: 0 0 0 1px var(--cinza-claro), 0 4px 10px rgba(34,43,99,.15); }
.documento-destaque h3 { font-size: 1.1875rem; color: var(--indigo); margin-bottom: 6px; }
.documento-destaque p { margin: 0 0 12px; color: var(--suave); }

/* ---------------------------------------------------------------- início: atalhos para as abas */
.atalhos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.atalho:nth-child(6) { --cor: var(--indigo); }
.atalho { display: flex; flex-direction: column; gap: 8px; text-decoration: none; background: var(--branco); border-radius: var(--raio); padding: 22px 20px; box-shadow: var(--sombra); border-bottom: 6px solid var(--cor, var(--coral)); transition: transform .15s ease; }
.atalho:hover { transform: translateY(-4px); }
.atalho:nth-child(2) { --cor: var(--amarelo); }
.atalho:nth-child(3) { --cor: var(--lima); }
.atalho:nth-child(4) { --cor: var(--ceu); }
.atalho:nth-child(5) { --cor: var(--azul); }
.atalhos.estudar .atalho:nth-child(1) { --cor: var(--ceu); }
.atalhos.estudar .atalho:nth-child(2) { --cor: var(--lima); }
.atalhos.estudar .atalho:nth-child(3) { --cor: var(--coral); }
.atalho b { font: 800 1.125rem var(--titulo); color: var(--indigo); }
.atalho span { color: var(--suave); font-size: 0.9375rem; }
.atalho i { margin-top: auto; font: 700 0.875rem var(--titulo); font-style: normal; color: var(--azul-escuro); }

@media (max-width: 960px) {
  .governanca { grid-template-columns: 1fr 1fr; }
  .gov-centro { grid-column: 1 / -1; grid-row: auto; }
  .nivel { grid-template-columns: 150px 1fr auto; }
  .destaques { grid-template-columns: repeat(2, 1fr); }
  .relato { grid-template-columns: 1fr; }
  .relato.invertido > :first-child { order: 0; }
  .atribuicoes { grid-template-columns: repeat(2, 1fr); }
  .ciclo { grid-template-columns: repeat(3, 1fr); }
  .ciclo li::after { display: none; }
  .podio { grid-template-columns: 1fr 1fr; }
  .formacao { grid-template-columns: 56px 1fr 1fr; }
  .formacao .funcao { grid-column: 2 / -1; }
  .atalhos { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .governanca, .articula, .acoes-suep, .atribuicoes, .podio, .metodo, .atalhos { grid-template-columns: 1fr; }
  .nivel { grid-template-columns: 1fr; gap: 12px; padding: 12px 18px 18px 12px; }
  .nivel img { aspect-ratio: 16 / 8; }
  .nivel .qtd { order: 1; display: flex; align-items: baseline; gap: 8px; text-align: left; font-size: 2.4rem; padding-left: 6px; }
  .nivel > div:not(.qtd) { order: 2; padding-left: 6px; }
  .ciclo { grid-template-columns: 1fr 1fr; }
  .escolas { columns: 1; }
  .formacao { grid-template-columns: 48px 1fr; gap: 12px; }
  .formacao::before { width: 48px; height: 48px; font-size: 1.125rem; }
  .formacao .publico, .formacao .funcao { grid-column: 2 / -1; }
  .metodo div:nth-child(1) { border-radius: var(--raio) 26px 0 0; }
  .metodo div:nth-child(3) { border-radius: 0 0 26px 26px; }
  .documento-destaque { flex-direction: column; align-items: flex-start; }
  .convite { padding: 26px 22px; }
}

/* ---------------------------------------------------------------- acompanhamento: práticas profissionais e mapa do estágio */
.praticas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.praticas article { background: var(--branco); border-radius: var(--raio); padding: 22px; border-top: 6px solid var(--cor, var(--coral)); box-shadow: var(--sombra); }
.praticas article:nth-child(2) { --cor: var(--amarelo); }
.praticas article:nth-child(3) { --cor: var(--lima); }
.praticas h3 { font-size: 1.1875rem; color: var(--indigo); margin-bottom: 8px; }
.praticas p { margin: 0; color: var(--suave); }
.parceiros { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 22px; }
.parceiros > span { font: 700 0.9375rem var(--titulo); color: var(--indigo); }
.parceiros ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.parceiros li { font: 600 0.875rem var(--titulo); color: var(--indigo); background: var(--branco); border-radius: 99px; padding: 7px 14px; box-shadow: 0 1px 0 var(--cinza-claro); }
.estagio { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 40px; align-items: center; }
.estagio > div > p { margin: 16px 0 20px; }
.estagio .destaques { gap: 12px; }
.estagio .destaques div { display: flex; align-items: baseline; gap: 14px; background: var(--papel); }
.estagio .destaques span { margin: 0; }
.mapa-estagio { margin: 0; }
.mapa-estagio svg { width: 100%; height: auto; display: block; }
.mapa-estagio path { fill: #efe9dc; stroke: #fff; stroke-width: 0.8; }
.mapa-estagio path.com { fill: var(--amarelo); stroke: #fff; }
.mapa-estagio path.com:hover { fill: var(--coral); }
.mapa-estagio figcaption { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 8px; font: 600 0.875rem var(--titulo); color: var(--indigo); }
.mapa-estagio .ponto { width: 14px; height: 14px; border-radius: 4px; background: var(--amarelo); }
.lista-municipios { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.lista-municipios li { font: 500 0.8125rem var(--texto); color: var(--suave); background: var(--papel); border-radius: 99px; padding: 3px 10px; }

/* ---------------------------------------------------------------- boas práticas: egressos */
.egressos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.egresso { margin: 0; display: grid; grid-template-columns: 200px 1fr; background: var(--branco); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); }
.egresso img { width: 100%; height: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.egresso figcaption { padding: 22px 24px; display: flex; flex-direction: column; gap: 6px; }
.egresso blockquote { margin: 0 0 8px; font: 500 1rem/1.55 var(--texto); color: var(--tinta); }
.egresso strong { font: 700 1.0625rem var(--titulo); color: var(--indigo); }
.egresso span { font-size: 0.9375rem; color: var(--suave); }
.egressos-titulo { font-size: 1.25rem; color: var(--indigo); margin: 34px 0 14px; }
.egressos.pequenos { grid-template-columns: repeat(3, 1fr); }
.egressos.pequenos .egresso { grid-template-columns: 1fr; }
.egressos.pequenos .egresso img { aspect-ratio: 4 / 3; object-position: center 30%; }
.egressos.pequenos figcaption { padding: 16px 20px 20px; }

@media (max-width: 960px) {
  .praticas, .egressos.pequenos { grid-template-columns: 1fr; }
  .estagio, .egressos { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .egresso { grid-template-columns: 1fr; }
  .egresso img { aspect-ratio: 4 / 3; object-position: center 25%; }
}

/* ---------------------------------------------------------------- movimento (js/animacoes.js) */
.anima .revela { opacity: 0; transform: translateY(22px); transition: opacity .6s ease var(--atraso, 0ms), transform .6s cubic-bezier(.2,.7,.2,1) var(--atraso, 0ms); }
.anima .revela.visivel { opacity: 1; transform: none; }
.anima .trilho i { transition: width 1.2s cubic-bezier(.2,.7,.2,1) .2s; }
.anima .mapa-estagio path.com { opacity: 0; transition: opacity .5s ease var(--atraso, 0ms), fill .2s ease; }
.anima .mapa-estagio.visivel path.com { opacity: 1; }

/* link com seta */
.seta { display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; font: 700 0.9688rem var(--titulo); color: var(--azul-escuro); text-decoration: none; border-bottom: 2px solid var(--amarelo); padding-bottom: 2px; }
.seta::after { content: ""; width: 8px; height: 8px; border-top: 2.5px solid currentColor; border-right: 2.5px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; }
.seta:hover::after { transform: translateX(4px) rotate(45deg); }

/* ---------------------------------------------------------------- estágio e trabalho */
.numeros-trabalho div { border-bottom: 6px solid var(--cor, var(--coral)); }
.numeros-trabalho div:nth-child(2) { --cor: var(--amarelo); }
.numeros-trabalho div:nth-child(3) { --cor: var(--lima); }
.numeros-trabalho div:nth-child(4) { --cor: var(--ceu); }
.abas-botoes { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.abas-botoes button { font: 700 1rem var(--titulo); color: var(--indigo); background: var(--branco); border: 2px solid var(--indigo); border-radius: 99px; padding: 11px 22px; cursor: pointer; transition: background .2s ease, color .2s ease; }
.abas-botoes button:hover { background: #eef2fb; }
.abas-botoes button[aria-selected="true"] { background: var(--indigo); color: #fff; }
.abas-botoes button:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 2px; }
.abas-painel { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: center; background: var(--branco); border-radius: var(--raio-g); padding: 30px; box-shadow: var(--sombra); }
.abas-painel[hidden] { display: none; }
.abas-painel h3 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); color: var(--indigo); margin-bottom: 12px; }
.abas-painel p { margin: 0 0 12px; }
.abas-painel img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--raio) 22px 22px 70px; }
.abas-painel.entrando > * { animation: entra .45s ease both; }
.abas-painel.entrando img { animation-delay: .08s; }
@keyframes entra { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.mapa-info { display: inline-block; margin: 0; font: 700 1.0625rem var(--titulo); color: var(--indigo); background: var(--amarelo); border-radius: 0 16px 16px 16px; padding: 10px 16px; min-height: 1.5em; }
.tipos-estagio { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
.tipos-estagio article { background: var(--indigo); color: #fff; border-radius: var(--raio); padding: 22px 24px; }
.tipos-estagio article:nth-child(2) { background: #3771ae; }
.tipos-estagio h3 { font-size: 1.1875rem; color: var(--amarelo); margin-bottom: 6px; }
.tipos-estagio p { margin: 0; color: #e6eaf8; }
.checagem { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.checagem li { position: relative; padding-left: 30px; font-weight: 500; }
.checagem li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--lima); }
.checagem li::after { content: ""; position: absolute; left: 6px; top: 7px; width: 5px; height: 8px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.citacao.grande { margin: 0; max-width: 900px; font-size: clamp(1.1rem, 2vw, 1.35rem); padding: 26px 30px; }
.convite-botoes { display: flex; flex-wrap: wrap; gap: 10px; position: relative; z-index: 1; }
@media (max-width: 960px) {
  .abas-painel, .tipos-estagio { grid-template-columns: 1fr; }
  .abas-painel img { order: -1; }
}
@media (prefers-reduced-motion: reduce) {
  .abas-painel.entrando > * { animation: none; }
  .egresso img, .relato-fotos img, .seta::after { transition: none; }
}

/* pódio sem foto: medalha grande */
.premio .medalha { flex: none; aspect-ratio: 3 / 2; padding: 0; display: grid; place-items: center; position: relative; overflow: hidden; background: var(--indigo); --metal: var(--amarelo); --brilho: #ffe08a; }
.premio .medalha.prata { background: #3771ae; --metal: #c9d1df; --brilho: #f2f5fa; }
.premio .medalha.bronze { background: var(--coral); --metal: #e7a46c; --brilho: #f8d2ae; }
.premio .medalha::before, .premio .medalha::after { content: ""; position: absolute; border-radius: 50%; }
.premio .medalha::before { width: 70%; aspect-ratio: 1; left: -22%; bottom: -40%; background: rgba(255,255,255,.08); }
.premio .medalha::after { width: 46%; aspect-ratio: 1; right: -12%; top: -18%; background: rgba(255,255,255,.1); }
.premio .medalha span { position: relative; z-index: 1; display: grid; place-items: center; width: 42%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--brilho), var(--metal) 60%); box-shadow: 0 0 0 10px rgba(255,255,255,.16), 0 14px 26px rgba(0,0,0,.25); font: 800 clamp(2rem, 4vw, 3rem)/1 var(--titulo); color: var(--indigo); transition: transform .4s cubic-bezier(.2,.7,.2,1.4); }
.premio:hover .medalha span { transform: rotate(-8deg) scale(1.06); }
.relato-fotos.unica { grid-template-columns: 1fr; }
.relato-fotos.unica img { aspect-ratio: 3 / 2; }

/* estágio: números por ano, barras horizontais e escolha do ano no mapa */
.numeros-ano { font-size: 1.125rem; color: var(--indigo); margin: 6px 0 12px; display: flex; align-items: center; gap: 10px; }
.numeros-ano::before { content: ""; width: 26px; height: 4px; border-radius: 4px; background: var(--coral); }
.numeros-ano + .destaques { margin-bottom: 26px; }
.duas-barras { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.duas-barras > div { background: var(--branco); border-radius: var(--raio); padding: 24px 26px; box-shadow: var(--sombra); }
.duas-barras h3 { font-size: 1.125rem; color: var(--indigo); margin-bottom: 16px; }
.barras-h { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.barras-h li { display: grid; grid-template-columns: minmax(130px, 40%) 1fr 34px; align-items: center; gap: 10px; font-size: 0.9375rem; color: var(--tinta); }
.barras-h i { display: block; height: 14px; border-radius: 99px; background: var(--indigo); width: calc(var(--v) / var(--max) * 100%); transform-origin: left; transition: transform 1s cubic-bezier(.2,.7,.2,1) .15s; }
.barras-h.coral i { background: var(--coral); }
.barras-h b { font: 800 0.9688rem var(--titulo); color: var(--indigo); text-align: right; }
.anima .revela:not(.visivel) .barras-h i { transform: scaleX(0); }
.anos-mapa { display: inline-flex; background: var(--branco); border-radius: 99px; padding: 4px; margin: 6px 0 14px; box-shadow: 0 1px 0 var(--cinza-claro); }
.anos-mapa button { font: 700 1rem var(--titulo); color: var(--indigo); background: transparent; border: 0; border-radius: 99px; padding: 9px 22px; cursor: pointer; transition: background .2s ease, color .2s ease; }
.anos-mapa button[aria-pressed="true"] { background: var(--indigo); color: #fff; }
.anos-mapa button:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 2px; }
.mapa-nota { margin: 12px 0 0; font-size: 0.9375rem; color: var(--suave); }
.mapa-estagio path.com { animation: acende .5s ease both; animation-delay: var(--atraso, 0ms); }
@keyframes acende { from { fill: #efe9dc; } }
@media (max-width: 960px) { .duas-barras { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .barras-h li { grid-template-columns: 1fr 34px; } .barras-h i { grid-column: 1 / -1; grid-row: 2; } }
@media (prefers-reduced-motion: reduce) { .mapa-estagio path.com { animation: none; } .barras-h i { transition: none; } }

/* vozes da rede em 3 colunas, mais compactas (Boas práticas) */
.vozes-grade.tres { grid-template-columns: repeat(3, 1fr); gap: 26px 24px; }
.vozes-grade.tres .voz { padding: 52px 22px 22px; margin: 14px 0 0 14px; }
.vozes-grade.tres .voz::before { left: -14px; top: -14px; }
.vozes-grade.tres .voz-titulo { left: 18px; top: 12px; font-size: 0.9375rem; gap: 10px; }
.vozes-grade.tres .voz-titulo svg { width: 42px; height: 26px; }
.vozes-grade.tres .voz blockquote { font-size: 0.9688rem; line-height: 1.5; }
.vozes-grade.tres .voz figcaption { margin-top: 10px; font-size: 0.8125rem; line-height: 1.4; }
@media (max-width: 1100px) { .vozes-grade.tres { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .vozes-grade.tres { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- movimento nas demais páginas */
.anima .grafico .barra b { transform-origin: bottom; transition: transform .9s cubic-bezier(.2,.7,.2,1), background .2s ease; }
.anima .grafico .barra:nth-child(2) b { transition-delay: .06s; } .anima .grafico .barra:nth-child(3) b { transition-delay: .12s; }
.anima .grafico .barra:nth-child(4) b { transition-delay: .18s; } .anima .grafico .barra:nth-child(5) b { transition-delay: .24s; }
.anima .grafico .barra:nth-child(6) b { transition-delay: .3s; } .anima .grafico .barra:nth-child(7) b { transition-delay: .36s; }
.anima .grafico .barra:nth-child(8) b { transition-delay: .42s; }
.anima .grafico:not(.visivel) .barra b { transform: scaleY(0); }
.anima .mosaico img.revela { transform: scale(.94); }
.anima .mosaico img.revela.visivel { transform: none; }
/* capa: ilustração flutuando e engrenagens girando devagar */
@keyframes flutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes gira { to { transform: rotate(360deg); } }
.engrenagem svg { animation: gira 24s linear infinite; }
@media (prefers-reduced-motion: reduce) {
  .engrenagem svg { animation: none; }
  .gov-item, .nivel, .modalidade, .formacao, .atribuicao, .acao-suep, .procurar article, .forma-cartao, .passos li, .marco, .sobre-foto img { transition: none; }
}
/* barra de leitura e botão de voltar ao topo */
.progresso { position: fixed; left: 0; top: 0; width: 100%; height: 4px; z-index: 200; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, var(--amarelo), var(--coral) 35%, var(--ceu) 70%, var(--lima)); pointer-events: none; }
.ao-topo { position: fixed; right: 20px; bottom: 22px; z-index: 150; width: 48px; height: 48px; border-radius: 50%; background: var(--indigo); box-shadow: 0 10px 24px rgba(20,26,70,.3); display: grid; place-items: center; opacity: 0; transform: translateY(14px); pointer-events: none; transition: opacity .25s ease, transform .25s ease, background .2s ease; }
.ao-topo::before { content: ""; width: 12px; height: 12px; border-left: 3px solid #fff; border-top: 3px solid #fff; transform: translateY(3px) rotate(45deg); }
.ao-topo.mostra { opacity: 1; transform: none; pointer-events: auto; }
.ao-topo:hover { background: var(--coral); }
.ao-topo:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .ao-topo { transition: none; } }

/* ---------------------------------------------------------------- engrenagens coloridas da logo (js/animacoes.js) */
.engrenagem { display: none; }
.engrenagens { position: absolute; pointer-events: none; z-index: 0; line-height: 0; }
.engrenagens svg { width: 100%; height: auto; display: block; overflow: visible; }
.eng-giro { transform-box: fill-box; transform-origin: center; animation: gira 34s linear infinite; }
.eng-roda.anti .eng-giro { animation-direction: reverse; animation-duration: 26s; }
.engrenagens.na-capa { width: 150px; left: -58px; bottom: -42px; z-index: 3; filter: drop-shadow(0 6px 10px rgba(10,14,40,.28)); }
.colagem .engrenagens.na-capa { left: auto; right: -26px; bottom: 14%; width: 138px; }
.docs-abertura .conteiner { position: relative; }
.docs-abertura .engrenagens.na-capa { left: auto; right: 0; bottom: auto; top: -10px; width: 130px; }
.engrenagens.no-titulo { position: relative; display: inline-block; vertical-align: middle; width: 72px; margin-left: 14px; top: -2px; }
.secao-cabeca .engrenagens.no-titulo + p, .conteiner > .engrenagens.no-titulo + p { margin-top: 14px; }
.rodape .engrenagens.no-rodape { width: 140px; right: 4%; top: -66px; z-index: 2; }
@media (max-width: 960px) { .engrenagens.na-capa { width: 104px; left: -14px; bottom: -30px; } .colagem .engrenagens.na-capa { right: 0; } .rodape .engrenagens.no-rodape { width: 104px; top: -50px; } }
@media (max-width: 560px) { .engrenagens.no-titulo { width: 54px; margin-left: 8px; } }
@media (prefers-reduced-motion: reduce) { .eng-giro { animation: none; } }

/* ---------------------------------------------------------------- ícones dos cursos (js/icones-cursos.js) */
.curso-icone { display: grid; place-items: center; flex: none; width: 54px; height: 54px; border-radius: var(--raio); background: var(--cor, var(--lima)); color: var(--indigo); transition: transform .3s cubic-bezier(.2,.7,.2,1.4); }
.curso-icone svg { width: 58%; height: 58%; }
.curso-cartao .curso-icone { margin-bottom: 4px; }
.curso-cartao:nth-child(4n+3) .curso-icone, .curso-cartao:nth-child(4n+4) .curso-icone { color: #fff; }
.curso-cartao:nth-child(4n+3) .curso-icone { color: var(--indigo); }
.curso-cartao:hover .curso-icone { transform: rotate(-8deg) scale(1.08); }
.curso-cabeca { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.curso-icone.grande { width: 72px; height: 72px; border-radius: var(--raio); background: var(--amarelo); }
.curso-icone.mini { width: 34px; height: 34px; border-radius: var(--raio-p); background: var(--cor, var(--coral)); }
.cursos li:has(.curso-icone)::before { display: none; }
.cursos li a:has(.curso-icone) { display: flex; align-items: center; gap: 12px; }
.cursos li:nth-child(4n+1) .curso-icone.mini { color: #fff; }
@media (prefers-reduced-motion: reduce) { .curso-icone { transition: none; } }

/* Inicial: o que é a EPT e como funciona */
.oque-ept { background: var(--papel); padding: 64px 0 80px; }
.oque-ept .conteiner { display: grid; grid-template-columns: 1fr 1.05fr; gap: 48px; align-items: start; }
.oque-texto h2 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); color: var(--indigo); margin: 12px 0 16px; }
.oque-lead { font-size: 1.1875rem; color: var(--tinta); margin: 0 0 14px; }
.oque-texto p { color: var(--suave); }
.oque-lead strong { color: var(--indigo); }
.oque-fatos { list-style: none; padding: 0; margin: 24px 0 28px; display: flex; gap: 12px; flex-wrap: wrap; }
.oque-fatos li { background: #fff; border-radius: var(--raio); padding: 12px 18px; box-shadow: var(--sombra); border-bottom: 5px solid var(--cor, var(--amarelo)); }
.oque-fatos li:nth-child(2) { --cor: var(--coral); }
.oque-fatos li:nth-child(3) { --cor: var(--lima); }
.oque-fatos strong { display: block; font: 800 1.5rem/1.1 var(--titulo); color: var(--indigo); }
.oque-fatos span { font-size: 0.875rem; color: var(--suave); }
.oque-passos { list-style: none; counter-reset: passo; padding: 0; margin: 0; display: grid; gap: 14px; }
.oque-passos > li { counter-increment: passo; position: relative; background: #fff; border-radius: var(--raio); padding: 20px 22px 20px 84px; box-shadow: var(--sombra); }
.oque-passos > li::before { content: counter(passo); position: absolute; left: 20px; top: 20px; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; font: 800 1.375rem var(--titulo); color: var(--indigo); background: var(--cor, var(--amarelo)); }
.oque-passos > li:nth-child(2) { --cor: var(--ceu); }
.oque-passos > li:nth-child(3) { --cor: var(--lima); }
.oque-passos > li:nth-child(4) { --cor: var(--coral); }
.oque-passos > li:nth-child(4)::before { color: #fff; }
.oque-passos h3 { font: 700 1.1875rem var(--titulo); color: var(--indigo); margin: 0 0 6px; }
.oque-passos p { margin: 0; color: var(--suave); font-size: 0.9688rem; }
.oque-passos b { color: var(--tinta); }
@media (max-width: 900px) { .oque-ept .conteiner { grid-template-columns: 1fr; gap: 32px; } }
@media (max-width: 520px) { .oque-passos > li { padding: 76px 20px 20px; } }
@media (prefers-reduced-motion: reduce) { .oque-passos > li { transition: none; } }

/* Página Programas da EPT */
.programas-atalhos .atalho:nth-child(1) { --cor: var(--ceu); }
.programas-atalhos .atalho:nth-child(2) { --cor: var(--amarelo); }
.programas-atalhos .atalho:nth-child(3) { --cor: var(--coral); }
.nota-rn { margin-top: 20px; background: #fff; border-left: 6px solid var(--lima); border-radius: 0 18px 18px 0; padding: 16px 20px; }
.nota-rn b { font: 700 1rem var(--titulo); color: var(--indigo); }
.nota-rn p { margin: 6px 0 0; color: var(--suave); }
.acoes-programa { background: var(--indigo); color: #fff; border-radius: var(--raio); padding: 28px 28px 22px; position: relative; overflow: hidden; }
.acoes-programa::after { content: ""; position: absolute; right: -70px; bottom: -80px; width: 180px; height: 180px; border-radius: 50%; background: var(--amarelo); opacity: .9; }
.acoes-programa h4 { font: 700 1.25rem var(--titulo); color: var(--amarelo); margin: 0 0 14px; position: relative; }
.acoes-programa .checagem { position: relative; z-index: 1; }
.acoes-programa .checagem li { color: #eef1fb; }
.checagem.colunas { display: block; columns: 2; column-gap: 32px; }
.checagem.colunas li { margin-bottom: 10px; }
.checagem.colunas li { break-inside: avoid; }
.comparar caption { text-align: left; font: 700 1.125rem var(--titulo); color: var(--indigo); padding-bottom: 12px; }

.mulheres-mil { position: relative; overflow: hidden; background: var(--indigo); color: #fff; padding: 80px 0 88px; }
.mulheres-mil .bolha-lima { position: absolute; right: -170px; bottom: -230px; width: 320px; height: 320px; border-radius: 50%; background: var(--lima); opacity: .9; }
.mulheres-mil .conteiner { position: relative; }
.mm-topo { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.mm-topo h2 { font-size: clamp(2.2rem, 4.6vw, 3.4rem); color: #fff; margin: 12px 0 14px; }
.mm-lead { font-size: 1.125rem; color: #dfe4f8; margin: 0; }
.mm-mais { color: #cdd3ef; margin: 14px 0 0; max-width: 68ch; }
.mm-numeros { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mm-numeros div { background: rgba(255,255,255,.07); border: 2px solid rgba(255,255,255,.12); border-radius: var(--raio); padding: 18px; }
.mm-numeros strong { display: block; font: 800 clamp(1.6rem, 3vw, 2.2rem)/1 var(--titulo); color: var(--amarelo); }
.mm-numeros div:nth-child(2) strong { color: var(--ceu); }
.mm-numeros div:nth-child(3) strong { color: var(--lima); }
.mm-numeros div:nth-child(4) strong { color: #ff8a80; }
.mm-numeros span { display: block; margin-top: 6px; font-size: 0.9063rem; color: #cfd6f2; line-height: 1.35; }
.mm-grade { display: grid; grid-template-columns: 1fr 1.25fr; gap: 20px; margin-top: 40px; }
.mm-cartao { background: #fff; color: var(--tinta); border-radius: var(--raio); padding: 26px 28px; }
.mm-cartao h3 { font: 700 1.3125rem var(--titulo); color: var(--indigo); margin: 0 0 10px; }
.mm-cartao p { margin: 0 0 10px; color: var(--suave); }
.mm-cartao ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.mm-cartao ul li { position: relative; padding-left: 26px; }
.mm-cartao ul li::before { content: ""; position: absolute; left: 0; top: .45em; width: 12px; height: 12px; border-radius: 50%; background: var(--coral); }
.mm-passos { margin: 0; padding: 0; list-style: none; counter-reset: mm; display: grid; gap: 12px; }
.mm-passos li { counter-increment: mm; position: relative; padding-left: 46px; color: var(--suave); }
.mm-passos li::before { content: counter(mm); position: absolute; left: 0; top: -2px; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font: 800 1rem var(--titulo); background: var(--amarelo); color: var(--indigo); }
.mm-passos li:nth-child(2)::before { background: var(--ceu); }
.mm-passos li:nth-child(3)::before { background: var(--lima); }
.mm-passos li:nth-child(4)::before { background: var(--coral); color: #fff; }
.mm-passos b { color: var(--indigo); }
.mm-subtitulo { font: 700 1.375rem var(--titulo); color: #fff; margin: 48px 0 18px; }
.mm-linha { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; position: relative; }
.mm-linha::before { content: ""; position: absolute; left: 0; right: 0; top: 17px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--amarelo), var(--coral), var(--ceu), var(--lima)); }
.mm-linha li { position: relative; padding-top: 0; }
.mm-linha span { position: relative; display: inline-block; font: 800 1rem var(--titulo); background: var(--amarelo); color: var(--indigo); border-radius: 999px; padding: 7px 14px; }
.mm-linha li:nth-child(2) span { background: var(--coral); color: #fff; }
.mm-linha li:nth-child(3) span { background: var(--ceu); }
.mm-linha li:nth-child(4) span { background: var(--lima); }
.mm-linha li:nth-child(5) span { background: #fff; }
.mm-linha li:nth-child(6) span { background: #ff8a80; }
.mm-linha p { margin: 12px 0 0; color: #dfe4f8; font-size: 0.9688rem; }
.mm-rn { margin-top: 44px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 28px; align-items: center; background: #2d377a; border-radius: var(--raio-g); padding: 30px 32px; }
.mm-rn h3 { font: 800 clamp(1.4rem, 2.6vw, 1.9rem) var(--titulo); color: #fff; margin: 10px 0 10px; }
.mm-rn p { margin: 0; color: #dfe4f8; }
.mm-rn-cursos { display: grid; gap: 12px; }
.mm-rn-cursos span { display: flex; align-items: center; gap: 14px; background: #fff; color: var(--indigo); border-radius: var(--raio); padding: 14px 18px; font: 600 1rem var(--titulo); }
.mm-rn-cursos b { font: 800 1.75rem var(--titulo); color: var(--coral); min-width: 2ch; }
.mm-rn-cursos span:nth-child(2) b { color: #6c8f12; }
@media (max-width: 900px) {
  .mm-topo, .mm-grade, .mm-rn { grid-template-columns: 1fr; }
  .mm-linha { grid-template-columns: 1fr 1fr 1fr; row-gap: 26px; }
  .mm-linha::before { display: none; }
  .checagem.colunas { columns: 1; }
}
@media (max-width: 520px) { .mm-numeros, .mm-linha { grid-template-columns: 1fr; } .mm-rn { padding: 24px 20px; } }

/* Mulheres Mil na rede estadual */
.mm-ciclos { display: grid; grid-template-columns: 0.8fr 1.4fr; gap: 22px; margin-top: 26px; }
.mm-ciclos-grafico, .mm-ciclo3 { background: #fff; border-radius: var(--raio); padding: 24px 26px; box-shadow: var(--sombra); }
.mm-ciclos h3 { font: 700 1.1875rem var(--titulo); color: var(--indigo); margin: 0 0 12px; }
.mm-ciclo3 p { margin: 0; color: var(--suave); }
.mm-ciclo3 h4 { font: 700 0.9375rem var(--titulo); color: var(--indigo); margin: 18px 0 8px; }
.mm-barras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: end; height: 230px; padding-top: 10px; }
.mm-barras div { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.mm-barras small { font: 800 1.0625rem var(--titulo); color: var(--indigo); margin-bottom: 6px; }
.mm-barras b { display: block; width: 100%; max-width: 74px; height: calc(var(--h) * 1.6px); border-radius: var(--raio-p) 12px 4px 4px; background: linear-gradient(180deg, var(--amarelo), #f08a24); }
.mm-barras div:nth-child(2) b { background: linear-gradient(180deg, #f8a35a, var(--coral)); }
.mm-barras div:nth-child(3) b { background: linear-gradient(180deg, #f17a8f, #d8204a); }
.mm-barras span { margin-top: 8px; font: 600 0.875rem var(--titulo); color: var(--suave); }
.mm-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.mm-chips li { background: var(--indigo); color: #fff; border-radius: 999px; padding: 6px 13px; font: 600 0.875rem var(--titulo); }
.mm-chips.claro li { background: #eef1fb; color: var(--indigo); }
.mm-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 26px; }
.mm-fotos figure { margin: 0; background: #fff; border-radius: var(--raio); overflow: hidden; box-shadow: 0 12px 26px rgba(34,43,99,.08); }
.mm-fotos img { display: block; width: 100%; aspect-ratio: 5 / 2; object-fit: cover; }
.mm-fotos figcaption { padding: 12px 16px 14px; font-size: 0.9063rem; color: var(--suave); }
@media (max-width: 900px) { .mm-ciclos, .mm-fotos { grid-template-columns: 1fr; } }

/* Chamadas para os Programas da EPT em outras páginas */
.promo-programas { padding-top: 64px; }
.promo { display: grid; grid-template-columns: 1fr 1.1fr; background: var(--indigo); color: #fff; border-radius: var(--raio-g); overflow: hidden; position: relative; }
.promo::after { content: ""; position: absolute; right: -70px; bottom: -90px; width: 220px; height: 220px; border-radius: 50%; background: var(--coral); opacity: .9; }
.promo img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; display: block; }
.promo-texto { position: relative; z-index: 1; padding: 38px 40px 40px; align-self: center; }
.promo-texto h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); color: #fff; margin: 12px 0 12px; }
.promo-texto p { color: #dfe4f8; margin: 0 0 22px; max-width: 46ch; }
.acao-suep.largo { grid-column: 1 / -1; --cor: var(--coral); }
@media (max-width: 800px) { .promo { grid-template-columns: 1fr; } .promo img { min-height: 220px; aspect-ratio: 16 / 9; } .promo-texto { padding: 26px 22px 30px; } }
.oque-texto .acoes { margin-top: 26px; }
.oque-formas { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.oque-formas li { display: grid; grid-template-columns: 9.5em 1fr; gap: 12px; align-items: baseline; padding: 7px 0; border-top: 1px solid var(--cinza-claro); font-size: 0.9688rem; }
.oque-formas li:first-child { border-top: 0; padding-top: 0; }
.oque-formas b { font: 700 0.9688rem var(--titulo); color: var(--indigo); }
.oque-formas span { color: var(--suave); }
@media (max-width: 520px) { .oque-formas li { grid-template-columns: 1fr; gap: 0; } }

/* =====================================================================
   Capa das páginas internas: faixa colorida curta, com a caixa
   do título e a foto lado a lado, descendo até o começo do conteúdo.
   Não vale para a inicial (.abertura), Onde estudar (.onde-abertura) e Documentos (.docs-abertura).
   ===================================================================== */
.sobre-abertura:not(.onde-abertura) { overflow: visible; z-index: 2; }
.sobre-abertura:not(.onde-abertura) .bolha-coral { width: 150px; height: 200px; bottom: 30px; }
.sobre-abertura:not(.onde-abertura) .ondas { height: 46px; }
.sobre-abertura:not(.onde-abertura) .conteiner { grid-template-columns: 1.18fr .82fr; gap: 36px; align-items: end; padding-top: 56px; padding-bottom: 0; }
.sobre-abertura:not(.onde-abertura) .conteiner > * { margin-bottom: -56px; z-index: 3; }
.sobre-abertura:not(.onde-abertura) .conteiner > div:first-child:has(.etiqueta) { --tam: clamp(1.9rem, 3.4vw, 2.6rem); }
.sobre-abertura:not(.onde-abertura) .conteiner > div:first-child { --tam: clamp(1.9rem, 3.4vw, 2.6rem); padding: 26px 32px 28px; box-shadow: 0 22px 44px rgba(12, 18, 54, .28); }
.sobre-abertura:not(.onde-abertura) .etiqueta.media { text-wrap: balance; }
.sobre-abertura:not(.onde-abertura) .etiqueta.media em { display: inline; }
.sobre-abertura:not(.onde-abertura) .conteiner > div:first-child > p { font-size: 1.0625rem; margin-top: 10px; }
.sobre-abertura:not(.onde-abertura) .sobre-foto { align-self: end; }
.sobre-abertura:not(.onde-abertura) .sobre-foto img { width: 100%; aspect-ratio: 16 / 10; border-radius: var(--raio-g) 24px 80px 24px; box-shadow: 0 22px 44px rgba(12, 18, 54, .28); }
.sobre-abertura:not(.onde-abertura) .sobre-foto .contorno { inset: -12px -12px 35% 35%; }
.sobre-abertura:not(.onde-abertura) .engrenagens.na-capa { width: 104px; left: -40px; bottom: -30px; }
.sobre-abertura:not(.onde-abertura) + section { padding-top: 112px; }
@media (max-width: 800px) {
  .sobre-abertura:not(.onde-abertura) .conteiner { grid-template-columns: 1fr; gap: 24px; padding-top: 32px; }
  .sobre-abertura:not(.onde-abertura) .conteiner > .sobre-foto { order: -1; margin-bottom: 0; min-height: 0; }
  .sobre-abertura:not(.onde-abertura) .sobre-foto img { position: static; height: auto; aspect-ratio: 16 / 8; }
  .sobre-abertura:not(.onde-abertura) + section { padding-top: 96px; }
}

/* Capa da inicial um pouco mais baixa */
.abertura .conteiner { padding-top: 44px; padding-bottom: 116px; }
.abertura .abertura-texto { --tam: clamp(1.9rem, 3.8vw, 2.9rem); }
.abertura .abertura-texto p { font-size: 1.0625rem; margin-top: 14px; }
.abertura .abertura-texto .acoes { margin-top: 20px; }
.abertura .ondas { height: 100px; }
.abertura .colagem { min-height: 360px; }
.abertura .colagem .foto-grande { width: 74%; top: 24px; }
.abertura .colagem .foto-pequena { width: 40%; }
.abertura .colagem .rn { width: 46%; top: -44px; }
@media (max-width: 960px) { .abertura .colagem { min-height: 320px; } }
@media (max-width: 600px) { .abertura .conteiner { padding-top: 32px; padding-bottom: 96px; } .abertura .colagem { min-height: 260px; } }

/* Programas da EPT, versão simplificada */
.pronatec-acoes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.pronatec-acoes li { background: #fff; border-radius: var(--raio); padding: 20px 22px; box-shadow: var(--sombra); border-top: 6px solid var(--cor, var(--ceu)); }
.pronatec-acoes li:nth-child(2) { --cor: var(--amarelo); }
.pronatec-acoes li:nth-child(3) { --cor: var(--lima); }
.pronatec-acoes li:nth-child(4) { --cor: var(--coral); }
.pronatec-acoes b { display: block; font: 700 1.125rem var(--titulo); color: var(--indigo); margin-bottom: 4px; }
.pronatec-acoes span { color: var(--suave); font-size: 0.9688rem; }
.tipos-estagio .exemplo { margin-top: 12px; font: 600 0.9375rem var(--titulo); color: var(--amarelo-claro); }
.mm-fatos { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mm-fatos li { background: rgba(255,255,255,.08); border: 2px solid rgba(255,255,255,.14); border-radius: var(--raio); padding: 16px 20px; color: #dfe4f8; font-size: 1.0625rem; }
.mm-fatos b { font: 800 1.375rem var(--titulo); color: var(--amarelo); }
.mm-fatos li:nth-child(2) b { color: var(--ceu); }
.mm-fatos li:nth-child(3) b { color: var(--lima); }
.mm-ciclo3.sozinho { margin-top: 22px; background: #fff; border-radius: var(--raio); padding: 24px 26px; box-shadow: var(--sombra); }
@media (max-width: 900px) { .pronatec-acoes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pronatec-acoes { grid-template-columns: 1fr; } }

/* Inicial: atalhos de Onde estudar dentro do "O que é a EPT?" */
.oque-estudar-titulo { font: 800 1.375rem var(--titulo); color: var(--indigo); margin: 28px 0 14px; }
.atalhos.empilhados { grid-template-columns: 1fr; gap: 12px; }
.atalhos.empilhados .atalho { flex-direction: row; align-items: baseline; gap: 14px; padding: 16px 20px; border-bottom-width: 0; border-left: 6px solid var(--cor, var(--coral)); }
.atalhos.empilhados .atalho b { flex: 0 0 11em; }
.atalhos.empilhados .atalho:hover { transform: translateX(4px); }
@media (max-width: 520px) { .atalhos.empilhados .atalho { flex-direction: column; gap: 4px; } .atalhos.empilhados .atalho b { flex: none; } }

/* Programas: galeria das turmas do Mulheres Mil */
.mm-galeria-titulo { font: 700 1.25rem var(--titulo); color: var(--indigo); margin: 30px 0 14px; }
.mm-galeria { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.mm-galeria figure { position: relative; margin: 0; border-radius: var(--raio); overflow: hidden; background: var(--cinza-claro); }
.mm-galeria figure.grande { grid-column: span 2; grid-row: span 2; }
.mm-galeria img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mm-galeria figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 9px; font: 600 0.8438rem var(--titulo); color: #fff;
  background: linear-gradient(180deg, transparent, rgba(16, 20, 52, .78)); }
.mm-galeria figure.grande figcaption { font-size: 1rem; padding: 34px 16px 12px; }
@media (max-width: 800px) { .mm-galeria { grid-template-columns: 1fr 1fr; } }

/* Carrossel de fotos (anda só quando a pessoa clica nas setas ou arrasta) */
.carrossel { position: relative; }
.carrossel-trilho { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 32px) / 3); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding-bottom: 2px; }
.carrossel-trilho::-webkit-scrollbar { display: none; }
.carrossel-trilho:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 4px; border-radius: var(--raio); }
.carrossel-trilho figure { position: relative; margin: 0; scroll-snap-align: start; border-radius: var(--raio); overflow: hidden; background: var(--cinza-claro); }
.carrossel-trilho img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.carrossel-trilho figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 14px 11px; font: 600 0.9375rem var(--titulo); color: #fff; background: linear-gradient(180deg, transparent, rgba(16, 20, 52, .8)); }
.carrossel-controles { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; }
.carrossel-seta { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--indigo); color: #fff; cursor: pointer; transition: background .15s ease, transform .15s ease; }
.carrossel-seta:hover:not(:disabled) { background: var(--azul-escuro); transform: scale(1.06); }
.carrossel-seta:disabled { background: var(--cinza-claro); color: #9aa0b4; cursor: default; }
.carrossel-seta:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 3px; }
.carrossel-conta { min-width: 7em; text-align: center; font: 600 0.9375rem var(--titulo); color: var(--suave); }
@media (max-width: 800px) { .carrossel-trilho { grid-auto-columns: 86%; gap: 12px; } }
@media (prefers-reduced-motion: reduce) { .carrossel-trilho { scroll-behavior: auto; } .carrossel-seta { transition: none; } }

/* rodapé com logos maiores */
.rodape-grade { grid-template-columns: 1.45fr 1fr 1fr 1fr; padding-top: 34px; }
.rodape-logos { display: flex; width: max-content; max-width: 100%; align-items: center; gap: 18px; padding: 14px 20px; border-radius: var(--raio-p); box-shadow: 0 10px 26px rgba(8, 12, 40, .35); margin-bottom: 16px; }
.rodape-logos img { height: 58px; width: auto; max-width: 100%; }
.rodape-logos img + i + img { height: 54px; }
.rodape-logos i { align-self: stretch; width: 1px; background: #dfe3f1; }
@media (max-width: 960px) { .rodape-grade { grid-template-columns: 1fr 1fr; } .rodape-grade > div:first-child { grid-column: 1 / -1; } }
@media (max-width: 640px) { .rodape-grade { grid-template-columns: 1fr; } .rodape-logos { gap: 12px; padding: 12px 14px; } .rodape-logos img { height: 46px; } .rodape-logos img + i + img { height: 42px; } }

/* Pronatec: texto e foto lado a lado */
.pronatec-topo { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.pronatec-topo .secao-cabeca { margin-bottom: 0; }
.pronatec-foto { margin: 0; }
.pronatec-foto img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--raio-g) 24px 80px 24px; box-shadow: var(--sombra); }
.pronatec-topo + .pronatec-acoes { margin-top: 36px; }
@media (max-width: 860px) { .pronatec-topo { grid-template-columns: 1fr; gap: 24px; } .pronatec-foto img { aspect-ratio: 16 / 9; } }

/* ---------------------------------------------------------------- busca no site (lupa do topo) */
.busca-botao { display: inline-grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--raio-p); background: #eef2fb; color: var(--indigo); cursor: pointer; }
.busca-botao:hover { background: #dfe7f8; }
.busca-botao svg { width: 22px; height: 22px; }
@media (max-width: 1300px) { .menu-longo .conteiner { gap: 10px; } .menu-longo .menu .menu-destaque { margin-left: 2px; } }
@media (max-width: 1200px) { .menu-longo .menu a, .menu-longo .menu-grupo-botao { padding-left: 7px; padding-right: 7px; } }
@media (max-width: 1160px) { .topo .busca-botao { grid-column: 3; grid-row: 1; } }
.busca-campo input { flex: 1; min-width: 0; border: 0; outline: none; font: 500 1.125rem var(--texto); color: var(--tinta); background: none; padding: 10px 0; }
.busca-campo input::-webkit-search-cancel-button { display: none; }
.busca-fechar { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border: 0; border-radius: var(--raio-p); background: #eef2fb; color: var(--indigo); cursor: pointer; }
.busca-fechar svg { width: 20px; height: 20px; }
.busca-corpo { overflow-y: auto; padding: 14px 12px 16px; }
.busca-aviso { margin: 0 8px 10px; font-size: 0.9375rem; color: var(--suave); }
.busca-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.busca-item { display: block; padding: 12px 14px; border-radius: var(--raio-p); text-decoration: none; color: var(--tinta); border-left: 4px solid transparent; }
.busca-item:hover, .busca-item:focus-visible, .busca-item.ativo { background: #f1f4fc; border-left-color: var(--amarelo); outline: none; }
.busca-item small { display: block; font: 600 0.8125rem var(--titulo); color: var(--coral); }
.busca-item.tipo-curso small { color: #2f86c4; }
.busca-item.tipo-cidade small, .busca-item.tipo-oferta small { color: #5f7f12; }
.busca-item b { display: block; margin-top: 2px; font: 700 1.0625rem/1.3 var(--titulo); color: var(--indigo); }
.busca-item span { display: block; margin-top: 4px; font-size: 0.9375rem; line-height: 1.45; color: var(--suave); }
.busca-item mark { background: #fde9a8; color: inherit; border-radius: 3px; padding: 0 1px; }
.busca-docs { margin-top: 6px; border-top: 2px solid var(--cinza-claro); border-radius: 0 0 var(--raio-p) var(--raio-p); }
.busca-docs small { color: var(--suave); }
.busca-sugestoes { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 8px; }
.busca-sugestoes button { font: 600 0.9375rem var(--titulo); color: var(--indigo); background: #eef2fb; border: 0; border-radius: 99px; padding: 8px 14px; cursor: pointer; }
.busca-sugestoes button:hover { background: #dfe7f8; }
/* duas lupas: dentro do menu no computador (no lugar do Instagram), ao lado dos logos no celular */
.topo .busca-botao.fora-menu { display: none; }
.menu .busca-botao.no-menu { margin-left: 4px; }
@media (max-width: 1160px) { .topo .busca-botao.fora-menu { display: inline-grid; } .topo .menu .busca-botao.no-menu { display: none; } }
/* a busca é uma barra que desce logo abaixo do cabeçalho; a página continua visível atrás */
.busca-site { position: fixed; inset: 0; z-index: 90; }
.busca-site[hidden] { display: none; }
.busca-fundo { position: absolute; inset: var(--topo-fim, 76px) 0 0 0; background: rgba(20, 26, 60, .18); }
.busca-janela { position: absolute; left: 0; right: 0; top: var(--topo-fim, 76px); background: var(--branco); box-shadow: 0 18px 36px rgba(12, 18, 54, .18); border-top: 1px solid var(--cinza-claro); }
.busca-janela > .conteiner { padding-top: 14px; padding-bottom: 14px; }
.busca-campo { display: flex; align-items: center; gap: 10px; padding: 4px 6px 4px 16px; border: 2px solid var(--indigo); border-radius: var(--raio-p); background: #fff; }
.busca-campo:focus-within { box-shadow: 0 0 0 4px rgba(250, 193, 51, .45); }
.busca-campo input { padding: 10px 0; }
.busca-ir { flex: none; padding: 10px 18px; }
.busca-corpo { max-height: min(62vh, 560px); overflow-y: auto; padding: 12px 0 2px; }
.busca-aviso { margin: 0 4px 8px; }
.busca-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }
.busca-lista > .busca-sugestoes, .busca-lista > li:last-child:has(.busca-docs) { grid-column: 1 / -1; }
.busca-sugestoes { padding: 0 4px 6px; }
@media (max-width: 860px) { .busca-lista { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .busca-ir { display: none; } .busca-corpo { max-height: calc(100vh - var(--topo-fim, 60px) - 110px); } }
.busca-site { pointer-events: none; } /* o cabeçalho continua clicável com a busca aberta */
.busca-fundo, .busca-janela { pointer-events: auto; }
.busca-campo > svg { width: 22px; height: 22px; flex: none; color: var(--indigo); }

/* revista do Mulheres Mil, na página dos programas */
.mm-revista { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 34px; padding: 24px 28px; background: var(--branco); border-radius: var(--raio); box-shadow: var(--sombra); }
.mm-revista img { display: block; width: 100%; height: auto; border-radius: var(--raio-p); box-shadow: 0 10px 22px rgba(12, 18, 54, .18); }
.mm-revista h3 { font-size: 1.375rem; color: var(--indigo); margin: 0 0 8px; }
.mm-revista p { margin: 0; color: var(--suave); max-width: 62ch; }
.mm-revista-links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 16px; }
.mm-revista-links small { font-weight: 500; opacity: .8; }
.mm-revista-links a:not(.botao) { font: 700 0.9688rem var(--titulo); color: var(--azul-escuro); }
.mm-revista .mm-revista-ppc { margin-top: 14px; font-size: 0.9375rem; }
@media (max-width: 640px) { .mm-revista { grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 18px; } .mm-revista h3 { font-size: 1.1875rem; } }

/* três fotos lado a lado (Acompanhamento, práticas profissionais) */
.fotos-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 28px 0 8px; }
.fotos-trio figure { margin: 0; }
.fotos-trio img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--raio); }
.fotos-trio figcaption { margin-top: 8px; font-size: 0.875rem; color: var(--suave); }
@media (max-width: 760px) { .fotos-trio { grid-template-columns: 1fr 1fr; } .fotos-trio figure:first-child { grid-column: 1 / -1; } }

/* painel do Power BI: aviso curto acima da moldura */
.quadro-nota { position: relative; margin: 0 0 10px; font-size: 0.9375rem; color: #eef2ff; } /* fica sobre o fundo azul da abertura */

/* carga horária anterior, ao lado da nova (ex.: EJATEC 2.400h a partir de 2027) */
.carga-antes { display: block; font-size: 0.8125rem; color: var(--suave); font-weight: 400; }