/* Site público - Prefeitura de Taiobeiras. CSS próprio, sem framework.
   Layout de referência: "Portal Cidadão Taiobeiras" (Stitch), tokens em docs/referencias/design-stitch.md.
   Sem recursos de terceiros: fonte servida pelo próprio site, ícones em SVG inline. */
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("../fontes/plus-jakarta-sans-latin.13d1b429e990.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --primaria: #0066cc;          /* botões e foco */
  --primaria-hover: #0052a3;
  --azul: #004e9f;              /* links e textos em azul (contraste > 7:1 no branco) */
  --institucional: #0f2d59;     /* títulos, Ouvidoria / Diário Oficial */
  --navy: #001b3f;              /* faixa superior */
  --azul-pale: #eff6ff;
  --azul-icone: #e0f2fe;
  --azul-claro: #3b82f6;
  --texto: #0f172a;
  --ardosia: #334155;           /* texto secundário */
  --cinza: #64748b;             /* só decorativo */
  --fundo: #f8fafc;
  --faixa: #f1f5fb;
  --superficie: #fff;
  --borda: #e2e8f0;
  --borda-forte: #cbd5e1;
  --img-vazia: #dbe3ee;
  --link-rodape: var(--institucional);
  --sombra-1: 0 1px 3px 0 rgba(15, 23, 42, .05), 0 1px 2px -1px rgba(15, 23, 42, .05);
  --sombra-2: 0 10px 15px -3px rgba(15, 45, 89, .08), 0 4px 6px -4px rgba(15, 45, 89, .04);
  --sombra-3: 0 20px 25px -5px rgba(15, 23, 42, .1), 0 8px 10px -6px rgba(15, 23, 42, .06);
  --raio: 8px;
  --raio-card: 12px;
  --raio-g: 16px;
  --fonte: "Plus Jakarta Sans", "Segoe UI", Roboto, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--fonte);
  font-size: 15px;
  background: var(--fundo);
  color: var(--texto);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
html.fonte-grande body { zoom: 1.15; }
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; color: var(--institucional); line-height: 1.3; }
button, input, select, textarea { font-family: inherit; }
.wrap { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.ico { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; }
.ico-p { width: 1em; height: 1em; }
.ico-g { width: 48px; height: 48px; }

/* Foco visível em tudo que é interativo (anel duplo) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--primaria);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px #fff;
}
.topo a:focus-visible, .topo button:focus-visible, .cookies button:focus-visible, .rodape .base a:focus-visible { outline-color: #fff; box-shadow: none; }
.so-leitor {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.pular {
  position: absolute; left: 8px; top: -60px; z-index: 100;
  background: var(--primaria); color: #fff; padding: 10px 16px; border-radius: 0 0 6px 6px; font-weight: 700;
}
.pular:focus { top: 0; }
#conteudo:focus { outline: none; }

/* Botões */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 18px; border-radius: var(--raio); font-weight: 600; font-size: 14px;
  border: 1px solid transparent; cursor: pointer; transition: background-color .15s, box-shadow .15s;
}
.botao-primario { background: var(--primaria); color: #fff; }
.botao-primario:hover { background: var(--primaria-hover); box-shadow: var(--sombra-2); }
.botao-institucional { background: var(--institucional); color: #fff; }
.botao-institucional:hover { background: #0a1f3f; box-shadow: var(--sombra-2); }
.botao-neutro { background: transparent; color: var(--institucional); border-color: var(--borda-forte); }
.botao-neutro:hover { background: #f1f5f9; }
.botao-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; background: var(--primaria); color: #fff; padding: 0 20px; border-radius: var(--raio); font-weight: 600; }
.botao-link:hover { background: var(--primaria-hover); }

/* Faixa superior (barra de utilidades) */
.topo { background: var(--navy); color: #dbe6ff; font-size: 12.5px; font-weight: 600; }
.topo-in { display: flex; gap: 6px 18px; justify-content: space-between; align-items: center; flex-wrap: wrap; min-height: 36px; padding-top: 4px; padding-bottom: 4px; }
.topo-links { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; }
.topo a:hover, .topo button:hover { color: #fff; text-decoration: underline; }
.topo button { display: inline-flex; align-items: center; gap: 5px; background: none; border: 0; color: inherit; font: inherit; padding: 2px 0; cursor: pointer; }
.topo button[aria-pressed="true"] { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* Cabeçalho */
.cabecalho { background: rgba(255, 255, 255, .97); position: sticky; top: 0; z-index: 30; box-shadow: 0 1px 8px rgba(0, 0, 0, .05); }
.cabecalho-in { display: flex; align-items: center; gap: 24px; min-height: 72px; padding-top: 8px; padding-bottom: 8px; }
.logo { flex: none; }
.logo img { display: block; width: 180px; max-width: none; height: auto; }
.busca-topo { position: relative; flex: 1; max-width: 560px; margin: 0 auto; }
.busca-topo .ico { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--cinza); pointer-events: none; }
.busca-topo input {
  width: 100%; height: 46px; padding: 0 16px 0 42px; border: 1px solid var(--borda-forte); border-radius: var(--raio);
  background: var(--superficie); color: var(--texto); font-size: 14px; box-shadow: var(--sombra-1);
}
.busca-topo input::placeholder { color: #5b6474; }
.entrar { flex: none; }

/* Menu principal */
.barra-menu { border-top: 1px solid var(--borda); background: var(--superficie); }
.menu { min-width: 0; }
.menu > ul { display: flex; flex-wrap: wrap; gap: 0 22px; font-weight: 600; font-size: 13.5px; color: #414753; }
.menu > ul > li { position: relative; }
.menu a { display: flex; align-items: center; gap: 6px; overflow-wrap: anywhere; }
.menu > ul > li > a { min-height: 48px; border-bottom: 2px solid transparent; }
.menu > ul > li > a:hover, .menu > ul > li:focus-within > a { color: var(--azul); border-bottom-color: var(--primaria); }
.seta-sub { font-size: 11px; }
.submenu {
  display: none; position: absolute; left: -12px; top: 100%; min-width: 240px; z-index: 5;
  background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 6px;
  box-shadow: var(--sombra-3);
}
.menu > ul > li:nth-last-child(-n+3) > .submenu { left: auto; right: -12px; } /* não vaza à direita */
.menu li:hover > .submenu, .menu li:focus-within > .submenu { display: block; }
.submenu a { font-weight: 500; padding: 9px 12px; border-radius: var(--raio); }
.submenu a:hover { background: var(--azul-pale); color: var(--azul); }
.menu-botao { display: none; align-items: center; gap: 6px; background: var(--institucional); color: #fff; border: 0; border-radius: var(--raio); min-height: 44px; padding: 0 14px; font: inherit; font-weight: 700; cursor: pointer; }

/* Cabeçalhos de seção: sobretítulo + título */
.sobretitulo { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.secao-cab { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 16px; margin: 0 0 22px; }
.secao-cab h2 { font-size: 30px; font-weight: 700; letter-spacing: -.015em; line-height: 1.25; }
.secao-cab p { margin: 4px 0 0; color: var(--ardosia); }
.link-mais { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; color: var(--azul); }
.link-mais:hover { text-decoration: underline; }
.chip { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: var(--azul-pale); color: var(--azul); }
.titulo { display: flex; align-items: center; gap: 10px; margin: 32px 0 16px; font-size: 22px; font-weight: 700; color: var(--institucional); }
.titulo a { margin-left: auto; font-size: 14px; font-weight: 600; color: var(--azul); }
.titulo a:hover { text-decoration: underline; }

/* Faixa de largura total dentro do .wrap */
.faixa { background: var(--faixa); box-shadow: 0 0 0 100vmax var(--faixa); clip-path: inset(0 -100vmax); padding: 56px 0; margin: 56px 0; }

/* Banner */
.banner { position: relative; margin: 24px 0 8px; border-radius: var(--raio-g); overflow: hidden; background: var(--institucional); box-shadow: var(--sombra-2); }
.banner-slide { display: none; }
.banner-slide.ativo, html:not(.js) .banner-slide:first-child { display: block; }
.banner-slide img { display: block; width: 100%; max-height: 420px; object-fit: cover; }
.carrossel-controles { position: absolute; right: 14px; bottom: 14px; display: flex; gap: 6px; z-index: 2; }
.carrossel-controles button { min-width: 40px; height: 40px; border-radius: 20px; border: 1px solid rgba(255,255,255,.85); background: rgba(15,23,42,.72); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; }
.carrossel-controles button:hover { background: rgba(15,23,42,.9); }
.carrossel-controles button:focus-visible { outline-color: #fff; }

/* Destaques */
.area { display: grid; grid-template-columns: 84px minmax(0, 1fr) 300px; gap: 16px; margin-top: 24px; }
.atalhos { display: flex; flex-direction: column; gap: 10px; }
.atalho {
  background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); min-height: 70px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  font-size: 11px; font-weight: 600; color: var(--ardosia); text-align: center; padding: 6px; box-shadow: var(--sombra-1);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.atalho:hover { border-color: var(--primaria); box-shadow: var(--sombra-2); transform: translateY(-2px); }
.atalho i { font-style: normal; font-size: 18px; color: var(--primaria); }
.atalho .ico { width: 22px; height: 22px; color: var(--primaria); }
.atalho.busca { background: var(--primaria); border-color: var(--primaria); color: #fff; }
.atalho.busca .ico { color: #fff; }
.destaque-carrossel { position: relative; min-width: 0; }
.destaque-carrossel .destaque { display: none; height: 100%; padding-bottom: 70px; }
.destaque-carrossel .destaque.ativo, html:not(.js) .destaque-carrossel .destaque:first-child { display: flex; }
.destaque {
  border-radius: var(--raio-g); min-height: 380px; color: #fff; display: flex; align-items: flex-end; padding: 28px;
  background: linear-gradient(0deg, rgba(15,23,42,.85), rgba(15,23,42,0) 60%), linear-gradient(135deg, #0f2d59, #0066cc);
  background-size: cover; background-position: center; box-shadow: var(--sombra-2);
}
.destaque strong { display: block; font-size: 26px; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; margin-top: 8px; }
.destaque:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.lado { display: flex; flex-direction: column; gap: 12px; }
.mini { background: var(--superficie); border-radius: var(--raio-card); overflow: hidden; border: 1px solid var(--borda); display: flex; gap: 12px; padding: 10px; box-shadow: var(--sombra-1); transition: box-shadow .15s; }
.mini:hover { box-shadow: var(--sombra-2); }
.mini img, .mini-img { display: block; flex: none; width: 92px; height: 92px; border-radius: var(--raio); object-fit: cover; background: var(--img-vazia); }
.mini p { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--institucional); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mini:hover p { color: var(--azul); }

/* Portais (Cidadão / Empresa / Servidor) */
.portais { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin: 32px 0; }
.portal { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 24px; box-shadow: var(--sombra-1); transition: box-shadow .15s; }
.portal:hover { box-shadow: var(--sombra-2); }
.portal-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
.portal-ico { width: 48px; height: 48px; border-radius: var(--raio-card); display: flex; align-items: center; justify-content: center; background: #d7e3ff; color: var(--azul); }
.portal-ico .ico { width: 26px; height: 26px; }
.portal-empresa .portal-ico { background: #d7e2ff; color: #455e8d; }
.portal-empresa .chip { background: #e8eeff; color: #2c4674; }
.portal-servidor .portal-ico { background: #dae2fd; color: var(--navy); }
.portal-servidor .chip { background: #eef1f7; color: #414753; }
.portal h2 { font-size: 22px; font-weight: 700; }
.portal > p { margin: 2px 0 14px; font-size: 13.5px; color: var(--ardosia); }
.portal li a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: var(--raio); font-size: 15px; color: var(--texto); }
.portal li a .ico { color: var(--cinza); }
.portal li a:hover { background: var(--azul-pale); color: var(--azul); }

/* Serviços em destaque */
.servicos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.servico {
  --cor-servico: var(--primaria);
  background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); height: 100%; min-height: 150px;
  display: flex; flex-direction: column; gap: 10px; padding: 20px; box-shadow: var(--sombra-1);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.servico:hover { transform: translateY(-2px); box-shadow: var(--sombra-2); border-color: var(--cor-servico); }
.servico-ico { width: 44px; height: 44px; border-radius: 50%; background: var(--azul-icone); color: var(--primaria); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.servico-ico .ico { width: 22px; height: 22px; }
.servico-ico img { max-width: 30px; max-height: 30px; width: auto; }
/* ícones vindos do Instar são glifos claros: fundo escuro para contraste */
.servico-ico-img { background: var(--institucional); }
.servico-titulo { font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--institucional); }
.servico:hover .servico-titulo { color: var(--azul); }
.servico-acao { margin-top: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--azul); }

/* Legislação e publicações (menu rápido): busca + um botão por tipo; quebra linha sozinho no celular */
.publicacoes-busca { position: relative; display: flex; gap: 8px; max-width: 720px; margin-bottom: 16px; }
.publicacoes-busca .ico { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--cinza); pointer-events: none; }
.publicacoes-busca input {
  flex: 1; min-width: 0; min-height: 44px; padding: 0 14px 0 40px; border: 1px solid var(--borda); border-radius: var(--raio);
  background: var(--superficie); color: var(--texto); font: inherit;
}
.publicacoes-tipos { display: flex; flex-wrap: wrap; gap: 8px; }
.publicacoes-tipos a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px;
  background: var(--azul-pale); color: var(--azul); font-size: 14px; font-weight: 600; border: 1px solid transparent;
  transition: border-color .15s, background .15s;
}
.publicacoes-tipos a:hover { border-color: var(--primaria); background: var(--superficie); }

/* Notícias + lateral */
/* Notícias em largura total; agenda e Instagram lado a lado logo abaixo */
.duas { display: flex; flex-direction: column; gap: 40px; margin: 56px 0; }
.coluna-lateral { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; align-items: start; }
/* Cartões de notícia com altura uniforme: foto fixa, título e resumo cortados */
.noticia { background: var(--superficie); border-radius: var(--raio-card); display: grid; grid-template-columns: 220px 1fr; grid-template-rows: 168px; overflow: hidden; margin-bottom: 14px; border: 1px solid var(--borda); box-shadow: var(--sombra-1); transition: box-shadow .15s; }
.noticia:hover { box-shadow: var(--sombra-2); }
/* sem foto (ou foto que não carregou): brasão discreto em vez de caixa cinza lisa */
.noticia .img { display: block; width: 100%; height: 168px; object-fit: cover; background: var(--img-vazia) url("../img/brasao-horizontal.489e746bf38c.png") center / 60% auto no-repeat; }
.noticia .txt { overflow: hidden; padding: 16px 20px; display: flex; flex-direction: column; }
.noticia .txt h2, .noticia .txt h3, .noticia .txt p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.noticia h3, .noticia h2 { margin: 0 0 6px; font-size: 18px; font-weight: 700; line-height: 1.35; }
.noticia h3 a:hover, .noticia p { margin: 0 0 6px; font-size: 14px; color: var(--ardosia); }
.noticia time { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: #5b6474; }
/* Notícias da home (layout de referência): destaque (7 col.) + 3 compactas (5 col.) */
.filtro-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; max-width: 100%; }
.filtro-chips a { flex: none; padding: 6px 12px; border-radius: var(--raio); background: var(--azul-pale); color: var(--ardosia); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.filtro-chips a:hover { background: #dbe6fb; color: var(--azul); }
.filtro-chips a.ativo { background: var(--azul); color: #fff; }
.noticias-grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.noticias-grade .noticia { margin: 0; }
.noticia .txt .noticia-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 6px !important; font-size: 12px !important; font-weight: 700; color: var(--azul) !important; }
.noticia-meta time { margin: 0 !important; color: #5b6474; font-weight: 600; }
.noticia-meta .tag { margin: 0; padding: 1px 8px; }
.noticia .leia { margin-top: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 700; color: #5b6474; }
.noticia:hover .leia { color: var(--azul); }
.noticia-lead { grid-column: 1 / 8; grid-row: span 3; grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
.noticia-foto { position: relative; overflow: hidden; }
.noticia-lead .img { height: 300px; transition: transform .5s; }
.noticia-lead:hover .img { transform: scale(1.04); }
.noticia-foto .tag-sobre { position: absolute; top: 16px; left: 16px; background: var(--primaria); color: #fff; padding: 4px 12px; box-shadow: var(--sombra-2); }
.noticia-lead .txt { padding: 20px 24px 22px; }
.noticia-lead .txt h3 { font-size: 22px; letter-spacing: -.01em; -webkit-line-clamp: 3; margin-bottom: 8px; }
.noticia-lead .txt > p:not(.noticia-meta) { font-size: 15px; line-height: 1.6; -webkit-line-clamp: 3; margin-bottom: 14px; }
.noticia-lead .leia { font-size: 14px; color: var(--azul); }
.noticia-compacta { grid-column: 8 / 13; grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto; gap: 16px; padding: 16px; }
.noticia-compacta .img { width: 112px; height: 112px; border-radius: var(--raio); background-size: 80% auto; transition: transform .3s; }
.noticia-compacta:hover .img { transform: scale(1.04); }
.noticia-compacta .txt { padding: 0; }
.noticia-compacta .txt h3 { font-size: 16.5px; -webkit-line-clamp: 2; }
.noticia h3 a::after { content: ""; position: absolute; inset: 0; } /* cartão inteiro clicável */
.noticia { position: relative; }
.noticia .tag-sigla { position: relative; z-index: 1; }
.ver-todas { text-align: center; margin-top: 24px; }
.botao-suave { background: #e2e7ff; color: var(--azul); box-shadow: var(--sombra-1); }
.botao-suave:hover { background: #dae2fd; }
.etiquetas { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-bottom: 6px; }
.tag { display: inline-flex; align-items: center; font-size: 11px; background: var(--azul-pale); color: var(--azul); padding: 3px 10px; border-radius: 999px; font-weight: 700; letter-spacing: .02em; }
.tag-sigla { background: #f1f5f9; color: var(--ardosia); }
a.tag-sigla:hover { text-decoration: underline; }
.tag-clara { background: #fff; color: var(--azul); }
.erro .filtros { margin: 14px 0; }
.vazio { color: var(--ardosia); font-size: 13.5px; padding: 14px 18px; margin: 0; }

/* Agenda */
.agenda { background: var(--superficie); border-radius: var(--raio-card); overflow: hidden; border: 1px solid var(--borda); box-shadow: var(--sombra-1); }
.agenda .cab { padding: 18px 20px 12px; border-bottom: 1px solid var(--borda); }
.agenda .cab h2 { font-size: 18px; font-weight: 700; margin-top: 2px; }
.agenda .ev { display: flex; gap: 14px; padding: 14px 20px; border-bottom: 1px solid var(--borda); font-size: 14px; }
.agenda .ev b { flex: none; display: flex; align-items: center; justify-content: center; min-width: 54px; height: 38px; border-radius: var(--raio); background: var(--azul-pale); color: var(--azul); font-size: 13px; }
.agenda .ev a { font-weight: 600; color: var(--institucional); }
.agenda .ev a:hover { text-decoration: underline; color: var(--azul); }
.agenda .ev span { display: flex; align-items: center; gap: 4px; color: var(--ardosia); font-size: 12.5px; margin-top: 2px; }
.agenda .ev.vazio { display: block; }
.agenda .mais { border-bottom: 0; }
.agenda .mais a { display: inline-flex; align-items: center; gap: 6px; color: var(--azul); }

/* Instagram */
.insta { background: var(--superficie); border-radius: var(--raio-card); overflow: hidden; border: 1px solid var(--borda); box-shadow: var(--sombra-1); }
.insta .cab { padding: 16px 20px; font-size: 18px; font-weight: 700; color: var(--institucional); border-bottom: 1px solid var(--borda); }
.insta .feed { max-height: 460px; overflow-y: auto; }
.post { display: block; padding: 12px 16px; border-bottom: 1px solid var(--borda); font-size: 13px; }
.post:hover .legenda { text-decoration: underline; }
.post .ft { display: block; width: 100%; height: 170px; object-fit: cover; border-radius: var(--raio); margin-bottom: 8px; background: var(--img-vazia); }
.post .quando { display: block; color: var(--ardosia); margin-top: 2px; font-size: 12px; }
.insta .seg { display: block; padding: 12px 20px; color: var(--azul); font-weight: 600; font-size: 14px; }
.insta .seg:hover { text-decoration: underline; }

/* Vídeos e fotos */
#bloco-videos_fotos { margin: 56px 0; }
.videos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.video {
  position: relative; min-height: 220px; border-radius: var(--raio-card); background: var(--institucional) center/cover; color: #fff; overflow: hidden;
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 8px; padding: 20px; box-shadow: var(--sombra-1);
  transition: box-shadow .15s, transform .15s;
}
.video:hover { box-shadow: var(--sombra-2); transform: translateY(-2px); }
.video .play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: .9; }
.video-titulo { position: relative; font-size: 16px; font-weight: 700; line-height: 1.35; }
.galeria-capa { margin: 0 0 16px; max-width: 900px; }
.galeria-capa img { display: block; width: 100%; border-radius: var(--raio-card); box-shadow: var(--sombra-1); }
.aviso-vazio { color: var(--ardosia); background: var(--superficie); border: 1px dashed var(--borda-forte); border-radius: var(--raio-card); padding: 16px 20px; max-width: 900px; }
.video-titulo small { display: block; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: #ffdcb0; }
.video:hover .video-titulo { text-decoration: underline; }
.video.galeria { background-color: #283044; }
.video.galeria.sem-capa { background: var(--img-vazia) url("../img/brasao-horizontal.489e746bf38c.png") center 30% / 45% auto no-repeat; }
.video.galeria.sem-capa .video-titulo { background: rgba(15, 23, 42, .78); color: #fff; padding: 8px 12px; border-radius: var(--raio); }

/* Faixa da Ouvidoria (antes do rodapé) */
.faixa-ouvidoria { margin-top: 56px; padding-bottom: 40px; }
.faixa-ouvidoria-in {
  display: flex; flex-wrap: wrap; align-items: center; gap: 18px 24px;
  background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-g); padding: 28px 32px; box-shadow: var(--sombra-1);
}
.faixa-ico { width: 56px; height: 56px; border-radius: var(--raio-card); background: var(--azul-pale); color: var(--azul); display: flex; align-items: center; justify-content: center; flex: none; }
.faixa-ico .ico { width: 28px; height: 28px; }
.faixa-txt { flex: 1 1 320px; }
.faixa-txt h2 { font-size: 22px; font-weight: 700; }
.faixa-txt p { margin: 2px 0 0; color: var(--ardosia); }
.faixa-botoes { display: flex; flex-wrap: wrap; gap: 10px; }

/* Rodapé */
.rodape { background: var(--superficie); color: var(--ardosia); border-top: 1px solid var(--borda); padding-top: 44px; }
.rodape .colunas { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 28px; font-size: 14px; padding-bottom: 36px; }
.rodape h2 { font-size: 15px; font-weight: 700; color: var(--institucional); margin-bottom: 12px; }
.rodape p { margin: 0 0 6px; }
.rodape li { margin-bottom: 8px; }
.rodape a { color: var(--link-rodape); }
.rodape a:hover { color: var(--azul); text-decoration: underline; text-underline-offset: 2px; }
.rodape-marca img { display: block; width: 180px; margin-bottom: 12px; }
.rodape-redes { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; font-weight: 600; }
.rodape .base { background: var(--institucional); color: #dbe6ff; font-size: 12.5px; padding: 14px 0; text-align: center; }
.rodape .base a { color: #fff; text-decoration: underline; }

/* Popup de banner */
.popup { position: fixed; inset: 0; z-index: 110; background: rgba(15,23,42,.6); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 16px; }
.popup[hidden] { display: none; }
.popup-caixa { position: relative; background: var(--superficie); border-radius: var(--raio-g); max-width: 640px; max-height: 90vh; overflow: auto; padding: 52px 14px 14px; box-shadow: var(--sombra-3); }
.popup-caixa img { display: block; width: 100%; border-radius: var(--raio); }
.popup-titulo { font-size: 16px; position: absolute; left: 18px; top: 16px; right: 60px; }
.popup-fechar { position: absolute; right: 10px; top: 8px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--borda-forte); background: var(--superficie); color: var(--texto); font-size: 22px; line-height: 1; cursor: pointer; }

/* Barra de cookies */
.cookies {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 90; background: var(--institucional); color: #fff;
  display: flex; gap: 16px; align-items: center; justify-content: center; flex-wrap: wrap; padding: 14px 20px;
  font-size: 14px; border-radius: var(--raio-card); box-shadow: var(--sombra-3);
}
.cookies[hidden] { display: none; }
.cookies p { margin: 0; max-width: 760px; }
.cookies a { color: #fff; text-decoration: underline; }
.cookies-botoes { display: flex; gap: 10px; }
/* Aceitar e Recusar com o mesmo peso visual (Guia de Cookies da ANPD) */
.cookies button.botao-cookie { background: #fff; color: var(--institucional); border: 2px solid #fff; border-radius: var(--raio); min-height: 40px; padding: 0 18px; font: inherit; font-weight: 700; cursor: pointer; min-width: 110px; }

/* Clique para carregar (mapa, vídeo) */
.embed-adiado { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; aspect-ratio: 16 / 9; width: 100%; padding: 20px; border-radius: var(--raio-card); background: var(--faixa); border: 1px dashed var(--borda-forte); color: var(--texto); font-size: 14px; }
.embed-adiado p { margin: 0; max-width: 520px; }
.embed-adiado a { color: var(--azul); text-decoration: underline; }
.botao-embed { background: var(--primaria); color: #fff; border: 0; border-radius: var(--raio); min-height: 44px; padding: 0 18px; font: inherit; font-weight: 700; cursor: pointer; }
.botao-embed:hover { background: var(--primaria-hover); }

/* Botão do VLibras: o widget só é baixado no clique */
.vlibras-botao { position: fixed; right: 0; top: 50%; z-index: 80; transform: translateY(-50%); background: var(--primaria); color: #fff; border: 0; border-radius: var(--raio) 0 0 var(--raio); padding: 14px 10px; font: inherit; font-weight: 700; font-size: 13px; cursor: pointer; writing-mode: vertical-rl; box-shadow: var(--sombra-2); }
.vlibras-botao[hidden] { display: none; }

/* Alto contraste (classe em <html>, lembrada no localStorage) */
html.alto-contraste {
  --primaria: #000; --primaria-hover: #000; --azul: #ffd400; --institucional: #fff; --navy: #000; --azul-claro: #ffd400;
  --ardosia: #fff; --cinza: #fff; --fundo: #000; --faixa: #000; --borda: #fff; --borda-forte: #fff;
  --texto: #fff; --azul-pale: #000; --azul-icone: #000; --img-vazia: #333; --superficie: #000; --link-rodape: #ffd400;
  --sombra-1: none; --sombra-2: none; --sombra-3: none;
}
html.alto-contraste a { color: #ffd400; text-decoration: underline; }
html.alto-contraste .topo, html.alto-contraste .rodape, html.alto-contraste .rodape .base, html.alto-contraste .cookies,
html.alto-contraste .barra-menu { background: #000; color: #fff; border-color: #fff; }
html.alto-contraste .cabecalho { background: #000; border-bottom: 1px solid #fff; }
html.alto-contraste .menu > ul { color: #fff; }
html.alto-contraste .topo button, html.alto-contraste .menu-botao, html.alto-contraste .cookies button,
html.alto-contraste .botao, html.alto-contraste .botao-link, html.alto-contraste .botao-embed { background: #ffd400; color: #000; border: 1px solid #fff; text-decoration: none; }
html.alto-contraste .atalho.busca, html.alto-contraste .pular { background: #000; color: #ffd400; border: 1px solid #fff; }
html.alto-contraste .atalho .ico, html.alto-contraste .atalho.busca .ico, html.alto-contraste .portal-ico, html.alto-contraste .servico-ico,
html.alto-contraste .faixa-ico, html.alto-contraste .agenda .ev b, html.alto-contraste .tag, html.alto-contraste .chip { color: #ffd400; background: #000; border: 1px solid #ffd400; }
html.alto-contraste .tag-clara { background: #000; }
html.alto-contraste .busca-topo input { background: #000; color: #fff; border-color: #fff; }
html.alto-contraste .logo img, html.alto-contraste .rodape-marca img { background: #fff; border-radius: 6px; padding: 4px; }
html.alto-contraste .faixa { box-shadow: none; clip-path: none; }
html.alto-contraste *:focus-visible { outline-color: #ffd400 !important; box-shadow: none !important; }

/* Tablet */
@media (max-width: 1100px) {
  .area { grid-template-columns: 76px minmax(0, 1fr); }
  .area .lado { grid-column: 1 / -1; flex-direction: row; }
  .area .lado .mini { flex: 1; min-width: 0; }
  .servicos { grid-template-columns: repeat(2, 1fr); }
  .entrar span { display: none; }
  .noticia-lead, .noticia-compacta { grid-column: 1 / -1; grid-row: auto; }
}
/* Mobile: uma coluna, 16px de margem lateral, sem rolagem horizontal */
@media (max-width: 820px) {
  .wrap { padding: 0 16px; }
  .topo-opcional, .topo-acess li:last-child { display: none; }
  .cabecalho { position: relative; }
  .cabecalho-in { flex-wrap: wrap; gap: 10px 12px; min-height: 0; padding-top: 10px; padding-bottom: 10px; }
  .logo { margin-right: auto; }
  .busca-topo { order: 3; flex-basis: 100%; max-width: none; }
  .barra-menu { border-top: 0; }
  .area, .duas, .servicos, .videos, .rodape .colunas, .portais { grid-template-columns: 1fr; }
  .area .lado { flex-direction: column; }
  .atalhos { flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
  .atalho { min-width: 84px; }
  .destaque { min-height: 260px; padding: 20px; }
  .destaque strong { font-size: 21px; }
  .secao-cab h2 { font-size: 24px; }
  .faixa, .duas, #bloco-videos_fotos { margin: 40px 0; }
  .faixa { padding: 40px 0; }
  .noticia { grid-template-columns: 1fr; grid-template-rows: auto auto; }
  .noticia .img { height: auto; aspect-ratio: 16 / 9; }
  .noticias-grade { grid-template-columns: 1fr; gap: 14px; }
  .noticia-lead, .noticia-compacta { grid-column: 1 / -1; grid-row: auto; }
  .noticia-lead .img { height: auto; aspect-ratio: 16 / 9; }
  .noticia-compacta { grid-template-columns: 88px minmax(0, 1fr); grid-template-rows: auto; padding: 12px; gap: 12px; }
  .noticia-compacta .img { width: 88px; height: 88px; aspect-ratio: auto; }
  .filtro-chips { width: 100%; }
  .noticia-lead .txt h3 { font-size: 20px; }
  .botao, .menu-botao { min-height: 48px; }
  .menu-botao { display: inline-flex; }
  .menu { display: none; padding: 6px 0 12px; }
  .menu.aberto { display: block; }
  .menu > ul { flex-direction: column; gap: 0; }
  .menu > ul > li > a { min-height: 48px; border-bottom: 1px solid var(--borda); }
  .submenu { display: block; position: static; box-shadow: none; border: 0; padding: 0 0 0 14px; }
  html:not(.js) .menu { display: block; }
  html:not(.js) .menu-botao { display: none; }
  .logo img { width: 150px; }
  .faixa-ouvidoria-in { padding: 22px 20px; }
  .faixa-botoes, .faixa-botoes .botao { width: 100%; }
  .cookies { left: 8px; right: 8px; bottom: 8px; font-size: 12.5px; line-height: 1.35; padding: 10px 12px; gap: 6px 10px; justify-content: space-between; }
  .cookies p { flex: 1 1 220px; }
  .cookies button { padding: 6px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .atalho, .servico, .video, .noticia, .mini, .portal { transition: none; }
  .atalho:hover, .servico:hover, .video:hover { transform: none; }
}

/* Páginas internas */
.migalhas { margin: 28px 0 6px; font-size: 13px; color: var(--ardosia); }
.migalhas ol { display: flex; flex-wrap: wrap; gap: 4px 6px; list-style: none; margin: 0; padding: 0; }
.migalhas li + li::before { content: "›"; margin-right: 6px; color: var(--cinza); }
.migalhas a { color: var(--azul); }
.migalhas a:hover { text-decoration: underline; }
.pagina-titulo { font-size: 36px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; color: var(--institucional); margin: 6px 0 24px; overflow-wrap: anywhere; }
.noticia h2 a:hover { color: var(--azul); text-decoration: underline; }
.meta, .resumo { color: var(--ardosia); }
.resumo { font-size: 18px; }
.filtros { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 16px 20px; box-shadow: var(--sombra-1); margin-bottom: 16px; }
.filtros label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--ardosia); }
.filtros select, .filtros input { font: inherit; height: 46px; padding: 0 12px; border: 1px solid var(--borda-forte); border-radius: var(--raio); background: var(--superficie); color: var(--texto); min-width: 0; max-width: 100%; }
.filtros button { background: var(--primaria); color: #fff; border: 0; border-radius: var(--raio); height: 46px; padding: 0 20px; font: inherit; font-weight: 700; cursor: pointer; }
.paginacao { display: flex; gap: 14px; align-items: center; justify-content: center; flex-wrap: wrap; margin: 18px 0; color: var(--ardosia); }
.paginacao a { color: var(--azul); font-weight: 600; padding: 8px 14px; border: 1px solid var(--borda); border-radius: var(--raio); background: var(--superficie); }
.paginacao a:hover { border-color: var(--azul); }
.detalhe, .ficha > section, .perfil { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 24px 28px; box-shadow: var(--sombra-1); margin-bottom: 16px; }
.detalhe figure { margin: 0 0 14px; }
.detalhe figcaption, .grade-fotos figcaption { font-size: 12px; color: var(--ardosia); }
.prosa { overflow-wrap: anywhere; max-width: 75ch; }
.prosa table { border-collapse: collapse; display: block; overflow-x: auto; max-width: 100%; }
.prosa th, .prosa td { border: 1px solid var(--borda); padding: 6px 10px; }
.prosa a, .cartoes a, .lista-arquivos a, .dados a, .resultados h2 a { color: var(--azul); text-decoration: underline; text-underline-offset: 2px; }
.prosa iframe, .player iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; }
.player { margin: 0 0 16px; }
.grade-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.grade-fotos figure { margin: 0; }
.grade-fotos img { display: block; width: 100%; height: 160px; object-fit: cover; border-radius: 6px; }
.cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.cartoes li { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 18px 20px; box-shadow: var(--sombra-1); overflow-wrap: anywhere; }
.cartoes li:hover { border-color: var(--azul); }
.dados { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 0; }
.dados dt { font-weight: 700; color: var(--ardosia); }
.dados dd { margin: 0; overflow-wrap: anywhere; }
.foto-chefe, .banner-unidade { display: block; max-width: 160px; border-radius: 8px; margin-bottom: 12px; }
.banner-unidade { max-width: 100%; width: 100%; max-height: 260px; object-fit: cover; margin-bottom: 16px; }
.abas-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; }
.abas-links a { background: var(--primaria); color: #fff; padding: 8px 16px; border-radius: 999px; font-weight: 600; }
.lista-arquivos li { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); padding: 12px 16px; margin-bottom: 8px; overflow-wrap: anywhere; }
.faq { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 14px 20px; margin-bottom: 8px; }
.faq summary { cursor: pointer; font-weight: 700; color: var(--institucional); }
.resultados { list-style: none; margin: 0; padding: 0; }
.resultados li { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-card); padding: 16px 20px; box-shadow: var(--sombra-1); margin-bottom: 10px; }
.resultados h2 { font-size: 17px; margin: 4px 0; }
.resultados p { margin: 0 0 4px; color: var(--ardosia); font-size: 14px; }
.organograma, .organograma ul { list-style: none; margin: 0; padding: 0; }
.organograma ul { margin-left: 14px; padding-left: 14px; border-left: 2px solid var(--borda); }
.organograma li { margin: 8px 0; overflow-wrap: anywhere; }
.organograma a { color: var(--azul); text-decoration: underline; text-underline-offset: 2px; }
html.alto-contraste .abas-links a, html.alto-contraste .filtros button { background: #ffd400; color: #000; }
@media (max-width: 820px) {
  .pagina-titulo { font-size: 26px; }
  .dados { grid-template-columns: 1fr; }
  .dados dt { margin-top: 6px; }
  .filtros label, .filtros select, .filtros input { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Política de privacidade */
.a-preencher { background: #fff3cd; color: #6b4e00; border: 1px dashed #b38600; padding: 1px 6px; border-radius: 4px; font-weight: 600; }
.privacidade .tabela { width: 100%; border-collapse: collapse; font-size: 13px; margin: 8px 0 16px; display: block; overflow-x: auto; }
.privacidade .tabela th, .privacidade .tabela td { border: 1px solid var(--borda); padding: 6px 8px; text-align: left; vertical-align: top; }