/* ============================================================================================================
   Visual "moderno" — camada POR CIMA do site.css, ligada por html[data-visual="moderno"].
   27/10/2026: 1ª versão, inspirada no protótipo de referência (camaradesalvador.figma.site).
   28/10/2026: pedido do pai do Matheus — copiar LITERALMENTE o topo e a página inicial do protótipo (fonte,
   tamanhos, pesos, cores, alturas medidos no próprio protótipo), mudando só:
     · menu: sem Agenda/TV/Rádio/Notícias/Diário; com Memorial, Centro de Cultura e Organograma (script 030);
     · abertura: colada no menu e inteira na tela; sem busca; TV, Rádio, "Conheça os vereadores" e "Acompanhe os
       projetos" como botões iguais aos outros serviços; números no pé do bloco;
     · da abertura para baixo, a ESTRUTURA do nosso site (notícias, vereadores…), com a fonte, a leveza e os tamanhos
       do protótipo.
   Medidas do protótipo (1024 px): fonte ui-sans-serif/system-ui; corpo 16px; faixa de cima 40px, gradiente
   #051a3d→#0a3d8f, links 13px; linha do logo 80px, fundo #0b1729, contêiner 1280px com 24px de lado e 24px entre
   itens; busca 40px, fundo #152238, 14px; rádio 40px, borda #243254; "Sugira" #e11d2e 16px/600; menu 49px, itens
   14px/400 #cbd5e1, 8px de lado, linha de baixo #1c2942; abertura #0a3d8f + foto, título 72px/700 −0,025em,
   texto 20px/1,625 a 75%; selo 12px +0,18em; painel 24px de raio, fundo rgba(5,26,61,.55); botões 60px, raio 14px,
   ícone 40px, título 14px/600, linha 12px a 55%; números 36px/700, rótulo 12px +0,6px a 60%.
   Volta ao desenho anterior: Painel de Aparência → Ajustes → Visual do site → Clássico.
   ============================================================================================================ */

html[data-visual="moderno"] {
  --fonte: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --serif: var(--fonte);
  --raio: 12px;
  --raio-card: 16px;
  --sombra: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px -14px rgba(15, 23, 42, .22);
  --sombra-alta: 0 2px 4px rgba(15, 23, 42, .06), 0 18px 36px -16px rgba(15, 23, 42, .30);
  --borda-suave: rgba(15, 23, 42, .09);
  --fundo: #f1f4f9;
  --noite: #0b1729;
  --cta: #e11d2e;
  --ceu: #7dd3fc;
}
/* letra base do protótipo (16px); o "Aumentar letra" da acessibilidade continua valendo por cima */
html[data-visual="moderno"]:not([data-letra]) { --base: 16px; }
html[data-visual="moderno"][data-letra="1"] { --base: 18px; }
html[data-visual="moderno"][data-letra="2"] { --base: 21px; }
html[data-visual="moderno"][data-letra="3"] { --base: 24px; }
html[data-visual="moderno"] body { font-family: var(--fonte); }

/* ---------- títulos com o peso e o ritmo do protótipo ---------- */
html[data-visual="moderno"] h1, html[data-visual="moderno"] h2, html[data-visual="moderno"] h3,
html[data-visual="moderno"] .card__titulo { font-family: var(--fonte); font-weight: 700; letter-spacing: -0.02em; }
html[data-visual="moderno"] .card__titulo { font-weight: 600; letter-spacing: -0.01em; }
html[data-visual="moderno"] .pagina-cabeca h1 { font-size: clamp(1.9rem, 3.6vw, 2.6rem); }
html[data-visual="moderno"] .titulo-secao { font-size: 1.85rem; font-weight: 700; }
html[data-visual="moderno"] .titulo-secao[data-sobre]::before {     /* "ATUALIZAÇÕES", "MESA DIRETORA" — vermelho, como no protótipo */
  content: attr(data-sobre); display: block; font-size: .75rem; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase; color: var(--cta); margin-bottom: 8px;
}
html[data-visual="moderno"][data-tema="escuro"] .titulo-secao[data-sobre]::before { color: #ff5a6b; }
html[data-visual="moderno"] .rotulo { letter-spacing: .05em; font-weight: 600; }

/* ---------- acabamento leve (estrutura continua a nossa) ---------- */
html[data-visual="moderno"] .btn, html[data-visual="moderno"] .btn--linha, html[data-visual="moderno"] .chip { border-radius: 999px; }
html[data-visual="moderno"] .btn { font-weight: 600; }
html[data-visual="moderno"] .card, html[data-visual="moderno"] .painel, html[data-visual="moderno"] .tarefa,
html[data-visual="moderno"] .ver-card, html[data-visual="moderno"] .evento, html[data-visual="moderno"] .numero,
html[data-visual="moderno"] .canal {
  border: 1px solid var(--borda-suave); border-radius: var(--raio-card); box-shadow: var(--sombra);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
html[data-visual="moderno"] a.card:hover, html[data-visual="moderno"] .tarefa:hover, html[data-visual="moderno"] a.ver-card:hover,
html[data-visual="moderno"] .canal:hover { transform: translateY(-2px); box-shadow: var(--sombra-alta); }
html[data-visual="moderno"] .card { overflow: hidden; }
html[data-visual="moderno"] .painel__cabeca .link {
  display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: .9rem; text-decoration: none; color: var(--azul);
}
html[data-visual="moderno"] .painel__cabeca .link::after { content: "→"; transition: transform .2s; }
html[data-visual="moderno"] .painel__cabeca .link:hover::after { transform: translateX(3px); }

/* ---------- campos e buscas suaves, como os do protótipo ---------- */
html[data-visual="moderno"] .campo input, html[data-visual="moderno"] .campo select, html[data-visual="moderno"] .campo textarea {
  border: 1px solid #dbe2ec; border-radius: 12px; background: #fff; min-height: 46px; font-size: .95rem;
}
html[data-visual="moderno"] .campo input:focus, html[data-visual="moderno"] .campo select:focus, html[data-visual="moderno"] .campo textarea:focus {
  border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(59, 130, 246, .15);
}
html[data-visual="moderno"] .busca--interna { border: 1px solid #dbe2ec; border-radius: 999px; background: #fff; box-shadow: none; min-height: 46px; }
html[data-visual="moderno"] .busca--interna:focus-within { border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(59, 130, 246, .15); padding: 0; }
html[data-visual="moderno"] .busca--interna input { border-radius: 999px 0 0 999px; padding-left: 20px; font-size: .95rem; }
html[data-visual="moderno"] .busca--interna > button:last-of-type { border-radius: 0 999px 999px 0; }
html[data-visual="moderno"][data-tema="escuro"] .campo input, html[data-visual="moderno"][data-tema="escuro"] .campo select,
html[data-visual="moderno"][data-tema="escuro"] .campo textarea, html[data-visual="moderno"][data-tema="escuro"] .busca--interna {
  background: #152238; border-color: #243254;
}

/* =========================================== TOPO =========================================== */
html[data-visual="moderno"] .topo, html[data-visual="moderno"] .com-foto .topo { background: var(--noite); }
html[data-visual="moderno"] .com-foto .topo--home { padding-bottom: 0; }
html[data-visual="moderno"] .com-foto .topo--home + * { margin-top: 0; }
html[data-visual="moderno"] .com-foto .topo:not(.topo--home):has(+ main > .caminho:first-child) { padding-bottom: 0; }
html[data-visual="moderno"] .com-foto .topo:not(.topo--home):has(+ main > .caminho:first-child) + main { margin-top: 0; }
html[data-visual="moderno"] .com-foto .topo:not(.topo--home) + main > .caminho:first-child { padding: 16px 0 0; color: var(--texto-2); }
html[data-visual="moderno"] .com-foto .topo:not(.topo--home) + main > .caminho:first-child a { color: var(--azul); }
html[data-visual="moderno"] .container { max-width: 1280px; padding-inline: 24px; }

/* faixa de cima: 40px, gradiente, 13px branco */
html[data-visual="moderno"] .barra-acesso, html[data-visual="moderno"] .com-foto .barra-acesso {
  background: linear-gradient(90deg, #051a3d 0%, #0a3d8f 100%); border: 0;
}
html[data-visual="moderno"] .barra-acesso__inner { min-height: 40px; }
html[data-visual="moderno"] .barra-acesso button, html[data-visual="moderno"] .servidor-topo a, html[data-visual="moderno"] .links-topo a,
html[data-visual="moderno"] .redes-topo a, html[data-visual="moderno"] .conta-topo {
  min-height: 40px; font-size: 13px; font-weight: 400; color: #fff; background: none; padding: 0 8px;
}
html[data-visual="moderno"] .barra-acesso button { font-weight: 500; }
html[data-visual="moderno"] .barra-acesso button:hover, html[data-visual="moderno"] .servidor-topo a:hover, html[data-visual="moderno"] .links-topo a:hover,
html[data-visual="moderno"] .redes-topo a:hover, html[data-visual="moderno"] .conta-topo:hover { color: var(--ceu); background: none; }
html[data-visual="moderno"] .servidor-topo { border-left: 0; margin-left: 0; padding-left: 0; }
html[data-visual="moderno"] .servidor-topo svg { display: none; }
html[data-visual="moderno"] .links-topo { display: flex; align-items: center; }
html[data-visual="moderno"] .links-topo a, html[data-visual="moderno"] .conta-topo { display: inline-flex; align-items: center; text-decoration: none; }
html[data-visual="moderno"] .barra-acesso__esq > :first-child a:first-child { padding-left: 0; }
html[data-visual="moderno"] #btn-letra, html[data-visual="moderno"] #btn-contraste { display: none; }
html[data-visual="moderno"] #btn-tema .visually-hidden { position: static !important; width: auto; height: auto; clip: auto; overflow: visible; }
html[data-visual="moderno"] .btn-tema-icone { gap: 6px; }
html[data-visual="moderno"] .btn-tema-icone svg, html[data-visual="moderno"] #btn-acess svg { width: 15px; height: 15px; }
html[data-visual="moderno"] .barra-acesso__dir .redes-topo { margin-left: 8px; padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, .2); gap: 4px; }
html[data-visual="moderno"] .barra-acesso__dir .redes-topo a { padding: 0 6px; }
html[data-visual="moderno"] .barra-acesso__dir .redes-topo svg { width: 15px; height: 15px; }

/* linha do logo: 80px, #0b1729; logo · busca · (espaço) · rádio · "Sugira um Projeto" */
html[data-visual="moderno"] .cabecalho, html[data-visual="moderno"] .com-foto .cabecalho { background: var(--noite); border-bottom: 0; }
html[data-visual="moderno"] .cabecalho__inner, html[data-visual="moderno"] .com-foto .cabecalho__inner {
  background: transparent; border: 0; box-shadow: none; border-radius: 0; margin: 0 auto; min-height: 80px; padding-block: 0; gap: 24px;
  flex-wrap: nowrap; -webkit-backdrop-filter: none; backdrop-filter: none;
}
html[data-visual="moderno"] .cabecalho__marca { background: #fff; border-radius: 10px; padding: 5px 10px; display: block; flex-shrink: 0; }
html[data-visual="moderno"] .cabecalho__marca img { height: 46px; }
html[data-visual="moderno"] .cabecalho .busca {
  position: relative; flex: 0 1 320px; max-width: 320px; margin: 0 auto 0 0; min-height: 40px; border-radius: 999px; padding: 0;
  background: #152238; border: 1px solid transparent; box-shadow: none;
}
html[data-visual="moderno"] .cabecalho .busca:focus-within { border-color: #2c4a7a; box-shadow: 0 0 0 3px rgba(125, 211, 252, .15); padding: 0; }
html[data-visual="moderno"] .cabecalho .busca input { color: #e2e8f0; font-size: 14px; padding: 0 16px 0 36px; border-radius: 999px; background: transparent; min-height: 38px; }
html[data-visual="moderno"] .cabecalho .busca input::placeholder { color: #7c8aa5; }
html[data-visual="moderno"] .cabecalho .busca > button:last-of-type {      /* a lupa fica à esquerda, dentro do campo */
  position: absolute; left: 0; top: 0; bottom: 0; width: 36px; padding: 0 0 0 12px; justify-content: flex-start;
  background: transparent; color: #7c8aa5; border-radius: 999px 0 0 999px;
}
html[data-visual="moderno"] .cabecalho .busca > button:last-of-type svg { width: 16px; height: 16px; }
html[data-visual="moderno"] .cabecalho .busca > button:last-of-type span { display: none; }
.radio-pilula {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px 0 6px; border-radius: 999px; cursor: pointer;
  background: transparent; border: 1px solid #243254; color: #f1f5f9; font: inherit; font-weight: 500; flex-shrink: 0;
}
.radio-pilula:hover, .radio-pilula[aria-pressed="true"] { background: rgba(255, 255, 255, .05); }
.radio-pilula__icone { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--cta, #e11d2e); color: #fff; }
.radio-pilula__icone svg { width: 14px; height: 14px; }
.radio-pilula[aria-pressed="true"] .radio-pilula__icone { animation: pulso-vivo 1.6s infinite; }
.radio-pilula__texto { display: flex; flex-direction: column; line-height: 1; text-align: left; gap: 2px; }
.radio-pilula__texto small { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #f1f5f9; opacity: .75; }
.radio-pilula__texto b { font-size: 14px; font-weight: 600; }
.btn-cta {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; flex-shrink: 0;
  background: var(--cta, #e11d2e); color: #fff; font-size: 16px; font-weight: 600; text-decoration: none; transition: filter .15s;
}
.btn-cta:hover { color: #fff; filter: brightness(1.08); }
/* "Entrar" foi para a faixa de cima; os painéis de quem trabalha na Câmara continuam aqui, discretos */
html[data-visual="moderno"] .cabecalho > .cabecalho__inner > a.cabecalho__conta:not(.cabecalho__aparencia) { display: none; }
html[data-visual="moderno"] .cabecalho__aparencia { color: #cbd5e1; border: 1px solid #243254; background: transparent; min-height: 40px; font-size: 14px; border-radius: 999px; }
html[data-visual="moderno"] .btn-menu { color: #fff; border: 1px solid #243254; background: transparent; min-height: 40px; border-radius: 999px; }

/* menu: 49px, itens 14px/400 #cbd5e1, linha de baixo #1c2942 */
html[data-visual="moderno"] .menu { background: var(--noite); border-top: 0; border-bottom: 1px solid #1c2942; }
html[data-visual="moderno"] .menu__inner { min-height: 48px; justify-content: flex-start; gap: 0; flex-wrap: nowrap; overflow: visible; }
html[data-visual="moderno"] .menu a { min-height: 48px; padding: 0 8px; color: #cbd5e1; font-size: 14px; font-weight: 400; border-bottom: 2px solid transparent; white-space: nowrap; gap: 6px; }
html[data-visual="moderno"] .menu a:hover { color: #fff; }
html[data-visual="moderno"] .menu a[aria-current="page"] { color: #fff; border-bottom-color: var(--cta); }
html[data-visual="moderno"] .menu a.menu__inicio svg { width: 16px; height: 16px; }
html[data-visual="moderno"] .menu a.menu__inicio { padding-left: 0; }
.menu__grupo { position: relative; display: flex; }
.menu__seta { opacity: .6; transition: transform .2s; width: 12px; height: 12px; }
.menu__sub {
  display: none; position: absolute; top: 100%; left: 0; z-index: 9100; min-width: 240px; padding: 6px;
  background: #0f1d33; border: 1px solid #1c2942; border-radius: 12px; box-shadow: 0 20px 40px -12px rgba(0, 0, 0, .6);
}
.menu__grupo:hover .menu__sub, .menu__grupo:focus-within .menu__sub { display: grid; }
.menu__grupo:hover .menu__seta, .menu__grupo:focus-within .menu__seta { transform: rotate(180deg); }
html[data-visual="moderno"] .menu .menu__sub a { min-height: 38px; padding: 8px 12px; border-radius: 8px; border-bottom: 0; font-size: 14px; }
html[data-visual="moderno"] .menu .menu__sub a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
html[data-visual="moderno"] body.rolou .menu__inner { overflow: visible; }

@media (max-width: 1100px) and (min-width: 901px) { .radio-pilula__texto small { display: none; } }
@media (max-width: 900px) {
  html[data-visual="moderno"] .cabecalho__inner { flex-wrap: wrap; min-height: 0; padding-block: 12px; gap: 12px; }
  html[data-visual="moderno"] .cabecalho__marca img { height: 40px; }
  html[data-visual="moderno"] .cabecalho .busca { order: 5; flex: 1 1 100%; max-width: none; }
  .radio-pilula { padding: 0 6px; border: 0; } .radio-pilula__texto { display: none; }
  .btn-cta { display: none; }
  html[data-visual="moderno"] .menu .menu__sub { display: none !important; }
  html[data-visual="moderno"] .menu__seta { display: none; }
  html[data-visual="moderno"] body.rolou .cabecalho { background: var(--noite); }
  html[data-visual="moderno"] .menu__inner { flex-wrap: wrap; }
}

/* ======================================== ABERTURA ======================================== */
.abertura-moderna {
  position: relative; overflow: hidden; color: #fff; isolation: isolate;
  background:
    linear-gradient(90deg, rgba(5, 26, 61, .94) 0%, rgba(8, 40, 100, .78) 45%, rgba(10, 61, 143, .45) 100%),
    var(--foto-abertura, none) center 55% / cover no-repeat, #0a3d8f;
}
.abertura-moderna__brilho { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; z-index: -1; }
.abertura-moderna__brilho--vermelho { width: 600px; height: 600px; background: rgba(225, 29, 46, .15); top: -260px; right: 10%; }
.abertura-moderna__brilho--azul { width: 500px; height: 500px; background: rgba(125, 211, 252, .20); bottom: -220px; left: -120px; }
.abertura-moderna__topo {
  max-width: 1280px; margin: 0 auto; padding: 36px 24px 32px;            /* colado no menu (o protótipo tinha 112px) */
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 48px; align-items: center;
}
.abertura-moderna__selo {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: 999px; font-size: 12px; font-weight: 400;
  letter-spacing: .18em; text-transform: uppercase; background: rgba(225, 29, 46, .15); border: 1px solid rgba(225, 29, 46, .5); color: #fff;
}
.abertura-moderna__selo i { width: 8px; height: 8px; border-radius: 50%; background: #ff3b53; }
.abertura-moderna .abertura__titulo {
  font-family: var(--fonte); color: #fff; font-size: clamp(2.6rem, 5.2vw, 72px); font-weight: 700; line-height: .95;
  letter-spacing: -0.025em; margin: 24px 0 20px;
}
.abertura-moderna .abertura__titulo span { background: linear-gradient(90deg, #fff 0%, var(--ceu, #7dd3fc) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.abertura-moderna p { color: rgba(255, 255, 255, .75); font-size: 20px; line-height: 1.625; max-width: 576px; margin: 0; }
.abertura-moderna p b { color: #fff; }

.servicos {
  border-radius: 24px; padding: 22px 24px; background: rgba(5, 26, 61, .55); border: 1px solid rgba(255, 255, 255, .12);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 24px 48px -24px rgba(0, 0, 0, .6);
}
.servicos__selo { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ceu, #7dd3fc); }
.servicos h3 { font-family: var(--fonte); color: #fff; font-size: 20px; font-weight: 600; letter-spacing: 0; margin: 4px 0 14px; }
.servicos__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; }
.servicos__lista li { min-width: 0; }
.servico {
  display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 10px; border-radius: 14px; color: #fff; text-decoration: none;
  background: transparent; border: 1px solid transparent; transition: background .2s, border-color .2s;
}
.servico:hover { color: #fff; background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .08); }
.servico > span:nth-child(2) { min-width: 0; flex: 1; }
.servico b { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.servico small { display: block; color: rgba(255, 255, 255, .55); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.servicos__icone {
  width: 40px; height: 40px; flex-shrink: 0; border-radius: 14px; display: grid; place-items: center; color: #fff;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .10);
}
.servicos__icone svg { width: 18px; height: 18px; }
.servico--no-ar .servicos__icone { background: var(--cta, #e11d2e); border-color: transparent; }
.servico__vivo { font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--cta, #e11d2e); color: #fff; padding: 2px 7px; border-radius: 999px; }
.servico__seta { flex-shrink: 0; color: var(--ceu, #7dd3fc); opacity: .8; transition: transform .2s; }
.servico:hover .servico__seta { transform: translateX(2px); opacity: 1; }

/* pé da abertura: os números, de ponta a ponta */
.abertura-moderna__pe { background: rgba(5, 26, 61, .6); border-top: 1px solid rgba(255, 255, 255, .08); }
.abertura-moderna__numeros { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.abertura-moderna__numeros div { display: flex; flex-direction: column-reverse; justify-content: center; padding: 20px 0; min-height: 96px; }
.abertura-moderna__numeros div + div { border-left: 1px solid rgba(255, 255, 255, .10); padding-left: 24px; }
.abertura-moderna__numeros dd { margin: 0; font-size: 36px; font-weight: 700; letter-spacing: -0.025em; line-height: 1; color: #fff; }
.abertura-moderna__numeros dt { font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: rgba(255, 255, 255, .6); margin-top: 8px; }

html[data-contraste="1"] .abertura-moderna, html[data-contraste="1"] .servicos { background: #000; border: 2px solid #fff; }
html[data-contraste="1"] .abertura-moderna .abertura__titulo span { color: #ffd400; background: none; }
@media (prefers-reduced-motion: reduce) { .radio-pilula[aria-pressed="true"] .radio-pilula__icone { animation: none; } }
html[data-movimento="reduzido"] .radio-pilula[aria-pressed="true"] .radio-pilula__icone { animation: none; }
@media (max-width: 1000px) { .abertura-moderna__topo { grid-template-columns: 1fr; gap: 24px; } }
@media (max-width: 640px) {
  .abertura-moderna__topo { padding: 24px 16px; }
  .abertura-moderna .abertura__titulo { font-size: 2.3rem; margin: 16px 0 12px; }
  .abertura-moderna p { font-size: 1rem; }
  .servicos { padding: 16px; }
  .servico { min-height: 48px; gap: 10px; padding: 6px; }
  .servico small, .servico__seta { display: none; }
  .servicos__icone { width: 34px; height: 34px; border-radius: 11px; }
  .abertura-moderna__numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 16px; }
  .abertura-moderna__numeros div { min-height: 76px; padding: 14px 0; }
  .abertura-moderna__numeros div:nth-child(3) { border-left: 0; padding-left: 0; }
  .abertura-moderna__numeros div:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .10); }
  .abertura-moderna__numeros dd { font-size: 28px; }
}
/* a home começa colada na abertura: o primeiro bloco da página não precisa da margem grande */
html[data-visual="moderno"] .abertura-moderna + main > .destaque:first-of-type { margin-top: 32px; }

/* ======================================= MODO ESCURO ======================================= */
html[data-visual="moderno"][data-tema="escuro"] {
  --fundo: #060d1c; --papel: #0e1a2f; --borda-suave: #1c2942;
  --sombra: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 16px 36px -20px rgba(0, 0, 0, .7);
  --sombra-alta: 0 1px 0 rgba(255, 255, 255, .05) inset, 0 24px 46px -18px rgba(0, 0, 0, .85);
}
html[data-visual="moderno"][data-tema="escuro"] body { background: #060d1c; }

@media (prefers-reduced-motion: reduce) { html[data-visual="moderno"] * { transition: none !important; } }
html[data-visual="moderno"][data-movimento="reduzido"] * { transition: none !important; }

/* ===================== MODO CLARO DO PROTÓTIPO (o padrão do nosso site) — 28/10 =====================
   No claro, o protótipo tem a linha do logo e o menu BRANCOS (texto escuro), itens do menu espalhados
   de ponta a ponta; o azul-noite fica só para o modo escuro. */
html[data-visual="moderno"]:not([data-tema="escuro"]) .topo,
html[data-visual="moderno"]:not([data-tema="escuro"]) .com-foto .topo { background: #fff; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho,
html[data-visual="moderno"]:not([data-tema="escuro"]) .com-foto .cabecalho { background: #fff; border-bottom: 1px solid #f1f5f9; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__marca { background: transparent; padding: 0; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__marca img { height: 56px; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho .busca { background: #f1f5f9; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho .busca:focus-within { border-color: #bfdbfe; box-shadow: 0 0 0 3px rgba(59, 130, 246, .12); }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho .busca input { color: #0f172a; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho .busca input::placeholder,
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho .busca > button:last-of-type { color: #64748b; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .radio-pilula { border-color: #e2e8f0; color: #0f172a; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .radio-pilula:hover { background: #f8fafc; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .radio-pilula__texto small { color: #64748b; opacity: 1; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__aparencia,
html[data-visual="moderno"]:not([data-tema="escuro"]) .btn-menu { color: #0f172a; border-color: #e2e8f0; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu { background: #fff; border-bottom: 1px solid #f1f5f9; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu a { color: #334155; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu a:hover { color: #0f172a; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu a[aria-current="page"] { color: #0f172a; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu__sub { background: #fff; border-color: #e2e8f0; box-shadow: 0 20px 40px -14px rgba(15, 23, 42, .25); }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu .menu__sub a { color: #334155; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .menu .menu__sub a:hover { background: #f1f5f9; color: #0f172a; }
html[data-visual="moderno"]:not([data-tema="escuro"]) body.rolou .cabecalho { background: #fff; }
html[data-visual="moderno"] .menu__inner { justify-content: space-between; }

/* abertura: as três camadas do protótipo por cima da foto (o prédio aparece bem mais) */
.abertura-moderna {
  background:
    linear-gradient(135deg, rgba(225, 29, 46, .18) 0%, transparent 50%, rgba(10, 61, 143, .40) 100%),
    linear-gradient(0deg, rgba(5, 26, 61, .60) 0%, transparent 50%),
    linear-gradient(90deg, rgba(5, 26, 61, .85) 0%, rgba(10, 61, 143, .60) 50%, rgba(10, 61, 143, .25) 100%),
    var(--foto-abertura, none) center 55% / cover no-repeat, #0a3d8f;
}
.abertura-moderna__topo { grid-template-columns: minmax(0, 1.44fr) minmax(0, 1fr); gap: 40px; }
/* 10 serviços em 2 colunas pedem um painel um pouco mais largo que o do protótipo (ele tinha 6 botões numa coluna) */
.abertura-moderna__topo { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 36px; }
.abertura-moderna .abertura__titulo { font-size: clamp(2.6rem, 4.9vw, 68px); }
.servicos__lista { gap: 4px 8px; }
.servico { gap: 10px; padding: 8px; }

/* ===================== rodada 28/10 (2) — pedidos do pai depois de ver no 177 ===================== */
/* página mais larga: o logo vai para o canto esquerdo e tudo se alinha por ele */
html[data-visual="moderno"] .container { max-width: 1440px; padding-inline: 32px; }
.abertura-moderna__topo, .abertura-moderna__numeros { max-width: 1440px; padding-left: 32px; padding-right: 32px; }
/* logo maior e um pouquinho transparente (menos "brilhante") */
html[data-visual="moderno"] .cabecalho__marca img { height: 64px; opacity: .9; }
html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__marca img { height: 68px; }
html[data-visual="moderno"] .cabecalho__inner { min-height: 88px; }
/* busca mais larga */
html[data-visual="moderno"] .cabecalho .busca { flex: 1 1 520px; max-width: 600px; }
/* rádio: as barrinhas subindo e descendo */
.radio-pilula__ondas { display: inline-flex; align-items: flex-end; gap: 2px; height: 16px; margin-left: 2px; }
.radio-pilula__ondas i { width: 3px; height: 100%; border-radius: 2px; background: var(--cta, #e11d2e); transform-origin: bottom; animation: radio-onda 1s ease-in-out infinite; }
.radio-pilula__ondas i:nth-child(2) { animation-delay: -.3s; } .radio-pilula__ondas i:nth-child(3) { animation-delay: -.6s; } .radio-pilula__ondas i:nth-child(4) { animation-delay: -.15s; }
@keyframes radio-onda { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .radio-pilula__ondas i { animation: none; transform: scaleY(.6); } }
html[data-movimento="reduzido"] .radio-pilula__ondas i { animation: none; transform: scaleY(.6); }
@media (max-width: 900px) { .radio-pilula__ondas { display: none; } }
/* janela da TV: sem as riscas do canto de baixo (puxar a borda continua funcionando) */
.tv-borda--se::after { display: none; }

/* abertura com a foto clara como a do protótipo e o painel mais translúcido */
.abertura-moderna { background: #0a3d8f; }
.abertura-moderna::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background: var(--foto-abertura, none) center 55% / cover no-repeat; filter: brightness(1.45) saturate(1.1) contrast(1.02);
}
.abertura-moderna__brilho--vermelho { z-index: -1; }
.abertura-moderna > .abertura-moderna__topo, .abertura-moderna > .abertura-moderna__pe { position: relative; }
.abertura-moderna::after {
  content: ""; position: absolute; inset: 0; z-index: -1; width: auto; height: auto; filter: none; border-radius: 0;
  background:
    linear-gradient(135deg, rgba(225, 29, 46, .16) 0%, transparent 50%, rgba(10, 61, 143, .35) 100%),
    linear-gradient(0deg, rgba(5, 26, 61, .55) 0%, transparent 45%),
    linear-gradient(90deg, rgba(5, 26, 61, .80) 0%, rgba(10, 61, 143, .50) 50%, rgba(10, 61, 143, .18) 100%);
}
.servicos { background: rgba(15, 40, 85, .38); border-color: rgba(255, 255, 255, .18); -webkit-backdrop-filter: blur(18px) saturate(1.2); backdrop-filter: blur(18px) saturate(1.2); }
.servico:hover { background: rgba(255, 255, 255, .10); }

/* faixa dos números menor e mais baixa */
.abertura-moderna__numeros div { min-height: 64px; padding-top: 12px; padding-bottom: 12px; }
.abertura-moderna__numeros dd { font-size: 26px; }
.abertura-moderna__numeros dt { font-size: 11px; margin-top: 4px; }

/* ---------- painel de Acessibilidade igual ao do protótipo ---------- */
.acess__icone, .acess__topo .acess__fechar { display: none; }
html[data-visual="moderno"] .acess__painel {
  width: 360px; padding: 16px; gap: 10px; border-radius: 18px; border: 1px solid #e2e8f0; background: #fff; color: #0f172a;
  box-shadow: 0 24px 48px -16px rgba(15, 23, 42, .35); top: calc(100% + 6px); font-family: var(--fonte);
}
html[data-visual="moderno"] .acess__topo { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 2px; }
html[data-visual="moderno"] .acess__topo h2 { margin: 0; font-size: 15px; font-weight: 700; color: #0f172a; }
html[data-visual="moderno"] .barra-acesso .acess__painel .acess__fechar { display: inline-grid; place-items: center; width: 30px; height: 30px; min-height: 30px; padding: 0; border-radius: 8px; color: #64748b; font-size: 20px; background: none; }
html[data-visual="moderno"] .barra-acesso .acess__painel .acess__fechar:hover { background: #f1f5f9; color: #0f172a; }
html[data-visual="moderno"] .acess__painel > div.acess__linha {          /* Tamanho do texto: caixa com − 100% + */
  flex-direction: column; align-items: stretch; gap: 12px; border: 1px solid #e2e8f0; border-radius: 14px; padding: 14px 16px; cursor: default;
}
html[data-visual="moderno"] .acess__tamanho { justify-content: space-between; }
html[data-visual="moderno"] .acess__tamanho button { width: 38px; height: 38px; border-radius: 50%; border: 0; background: #f1f5f9; color: #0f172a; font-size: 18px; }
html[data-visual="moderno"] .acess__tamanho button:hover:not(:disabled) { background: #e2e8f0; }
html[data-visual="moderno"] .acess__tamanho output { font-size: 14px; font-weight: 700; }
html[data-visual="moderno"] .barra-acesso .acess__painel button.acess__linha {
  border: 1px solid #e2e8f0; border-radius: 14px; padding: 10px 14px 10px 12px; gap: 12px; min-height: 60px; font-size: 14px; font-weight: 600; color: #0f172a; background: #fff;
}
html[data-visual="moderno"] .barra-acesso .acess__painel button.acess__linha:hover,
html[data-visual="moderno"] .barra-acesso .acess__painel button.acess__linha[aria-pressed="true"] { background: #f8fafc; border-color: #cbd5e1; }
html[data-visual="moderno"] .acess__linha > span:not(.acess__icone) { flex: 1; }
html[data-visual="moderno"] .acess__linha small { font-size: 12px; font-weight: 400; color: #64748b; margin-top: 2px; }
html[data-visual="moderno"] .acess__icone { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: #f1f5f9; color: #334155; }
html[data-visual="moderno"] .acess__chave { width: 36px; height: 20px; border-radius: 10px; background: #cbd5e1; }
html[data-visual="moderno"] .acess__chave::after { top: 2px; left: 2px; width: 16px; height: 16px; }
html[data-visual="moderno"] [aria-pressed="true"] > .acess__chave { background: #2563eb; }
html[data-visual="moderno"] [aria-pressed="true"] > .acess__chave::after { left: 18px; }
html[data-visual="moderno"] .acess__painel [data-acess="tema"] { display: none; }        /* o modo escuro fica no botão da faixa, como no protótipo */
html[data-visual="moderno"] .barra-acesso .acess__painel .acess__restaurar {
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; color: #64748b; font-size: 14px; font-weight: 500; min-height: 42px;
}
html[data-visual="moderno"] .barra-acesso .acess__painel .acess__restaurar:hover { background: #f1f5f9; color: #0f172a; }
html[data-visual="moderno"][data-tema="escuro"] .acess__painel { background: #0f1d33; border-color: #1c2942; color: #e2e8f0; }
html[data-visual="moderno"][data-tema="escuro"] .acess__topo h2,
html[data-visual="moderno"][data-tema="escuro"] .barra-acesso .acess__painel button.acess__linha { color: #e2e8f0; background: #0f1d33; border-color: #1c2942; }
html[data-visual="moderno"][data-tema="escuro"] .acess__painel > div.acess__linha { border-color: #1c2942; }
html[data-visual="moderno"][data-tema="escuro"] .acess__icone, html[data-visual="moderno"][data-tema="escuro"] .acess__tamanho button { background: #152238; color: #cbd5e1; }
/* VLibras: as mãozinhas só aparecem com a chave ligada no painel */
html[data-visual="moderno"]:not([data-libras="1"]) [vw],
html[data-visual="moderno"]:not([data-libras="1"]) [id^="vlibras"] { display: none !important; }
/* telas entre 1001 e 1250 px: sem a setinha e com ícone menor, para os nomes dos serviços caberem inteiros */
@media (min-width: 1001px) and (max-width: 1250px) {
  .servico__seta { display: none; }
  .servicos__icone { width: 34px; height: 34px; border-radius: 11px; }
  .servico { gap: 8px; padding: 8px 6px; }
  .abertura-moderna__topo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
}

/* ===== abertura 100% nas medidas do protótipo (pedido de 28/10: "não precisa mais ser menor") =====
   contêiner 1280px/24px, 112px em cima e embaixo, colunas 1,44 : 1 com 40px, título 72px, números 36px numa faixa de 108px */
.abertura-moderna__topo {
  max-width: 1280px; padding: 112px 24px; grid-template-columns: minmax(0, 1.44fr) minmax(0, 1fr); gap: 40px;
}
.abertura-moderna .abertura__titulo { font-size: clamp(2.6rem, 5.6vw, 72px); line-height: .95; letter-spacing: -0.025em; margin: 24px 0; }
.abertura-moderna p { font-size: 20px; line-height: 1.625; max-width: 576px; }
.servicos { padding: 24px; }
.servico { min-height: 60px; padding: 10px; gap: 12px; }
.servicos__icone { width: 40px; height: 40px; border-radius: 14px; }
.abertura-moderna__numeros { max-width: 1280px; padding-left: 24px; padding-right: 24px; }
.abertura-moderna__numeros div { min-height: 108px; padding-top: 0; padding-bottom: 0; }
.abertura-moderna__numeros dd { font-size: 36px; line-height: 1; letter-spacing: -0.025em; }
.abertura-moderna__numeros dt { font-size: 12px; letter-spacing: .05em; margin-top: 8px; }
@media (min-width: 1001px) and (max-width: 1250px) {
  .abertura-moderna__topo { grid-template-columns: minmax(0, 1.44fr) minmax(0, 1fr); gap: 40px; }
  .servico { padding: 10px 6px; gap: 8px; }
  .servico small { display: none; }
}
@media (max-width: 1000px) { .abertura-moderna__topo { grid-template-columns: 1fr; padding: 64px 24px; } }
@media (max-width: 640px) {
  .abertura-moderna__topo { padding: 40px 16px; }
  .abertura-moderna .abertura__titulo { font-size: 2.4rem; margin: 16px 0; }
  .abertura-moderna p { font-size: 1.05rem; }
  .servicos { padding: 16px; }
  .servico { min-height: 50px; padding: 6px; }
  .servicos__icone { width: 34px; height: 34px; }
  .abertura-moderna__numeros div { min-height: 80px; }
  .abertura-moderna__numeros dd { font-size: 28px; }
}
/* mesma altura do bloco do protótipo (lá ele tinha 2 botões grandes + busca + cartões de TV/Rádio; aqui o espaço fica) */
@media (min-width: 1001px) { .abertura-moderna__topo { min-height: 712px; } }
.servico b { white-space: normal; line-height: 1.2; }

/* ===== abertura com a RECEITA EXATA do protótipo (medida no código dele em 28/10) =====
   seção #0a3d8f · foto cobrindo tudo · camada 1: da esquerda #051a3d 85% → #0a3d8f 60% → #0a3d8f 25%
   · camada 2: de baixo #051a3d 60% → transparente na metade · brilho vermelho 600px 15% e azul-claro 500px 20%, desfoque 120px
   · painel: #051a3d 55%, desfoque 24px, borda branca 15%, raio 24px, sombra 0 25px 50px -12px preto 30%
   · grade de 12: texto em 7, painel em 5, 40px entre eles */
.abertura-moderna { background: #0a3d8f; }
.abertura-moderna::before { filter: brightness(1.3); }        /* a nossa foto é mais escura que a dele: só compensa a luz */
.abertura-moderna::after {
  background:
    linear-gradient(0deg, rgba(5, 26, 61, .60) 0%, transparent 50%),
    linear-gradient(90deg, rgba(5, 26, 61, .85) 0%, rgba(10, 61, 143, .60) 50%, rgba(10, 61, 143, .25) 100%);
}
.abertura-moderna__brilho { filter: blur(120px); }
.abertura-moderna__brilho--vermelho { width: 600px; height: 600px; top: -300px; right: -200px; background: rgba(225, 29, 46, .15); }
.abertura-moderna__brilho--azul { width: 500px; height: 500px; bottom: -250px; left: -150px; background: rgba(125, 211, 252, .20); }
.servicos {
  background: rgba(5, 26, 61, .55); border: 1px solid rgba(255, 255, 255, .15); border-radius: 24px;
  -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .30); overflow: hidden;
}
.servico:hover { background: rgba(255, 255, 255, .06); border-color: transparent; }
@media (min-width: 1001px) { .abertura-moderna__topo { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; } }

/* foto clara de dia (fachada) — sem filtro, como no protótipo */
.abertura-moderna::before { filter: none; background-position: center 40%; }

/* ===================== "Últimas notícias": painel que desliza da esquerda (28/10) =====================
   Fica POR CIMA do bloco, colado na borda esquerda; fechado, sobra só a aba. Abrir/fechar não mexe em mais nada. */
.rss { position: absolute; z-index: 3; top: 24px; bottom: 132px; left: 0; width: 296px; display: flex; transition: transform .35s ease; }
.rss--fechado { transform: translateX(-296px); }
.rss__corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; color: #fff; padding: 16px 16px 0;
  background: rgba(9, 22, 46, .82); border: 1px solid rgba(255, 255, 255, .10); border-left: 0; border-radius: 0 16px 16px 0;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .35); }
.rss__cabeca { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, .10); }
.rss__titulo { display: inline-flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 600; }
.rss__icone { color: var(--ceu, #7dd3fc); display: inline-flex; }
.rss__todas { display: inline-flex; align-items: center; gap: 4px; color: #5fb4ff; font-size: 14px; font-weight: 500; text-decoration: none; white-space: nowrap; }
.rss__todas:hover { color: var(--ceu, #7dd3fc); }
/* a aba: grudada na borda direita do painel, sempre à vista */
.rss__aba { position: absolute; top: 50%; left: 100%; transform: translateY(-50%); width: 32px; padding: 14px 0; display: flex; flex-direction: column;
  align-items: center; gap: 10px; background: rgba(9, 22, 46, .82); color: #fff; border: 1px solid rgba(255, 255, 255, .10); border-left: 0;
  border-radius: 0 12px 12px 0; cursor: pointer; font: inherit; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.rss__aba span { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.rss__aba:hover { color: var(--ceu, #7dd3fc); }
.rss__seta-abrir { transition: transform .35s; }
.rss--fechado .rss__seta-abrir { transform: rotate(180deg); }
/* o letreiro: a lista sobe sem parar; para com o mouse em cima ou com foco dentro */
.rss__janela { flex: 1; min-height: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent, #000 18px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(transparent, #000 18px, #000 calc(100% - 24px), transparent); }
.rss__lista { list-style: none; margin: 0; padding: 0; animation: rss-sobe var(--rss-tempo, 60s) linear infinite; }
.rss:hover .rss__lista, .rss:focus-within .rss__lista, .rss--fechado .rss__lista { animation-play-state: paused; }
@keyframes rss-sobe { from { transform: translateY(0); } to { transform: translateY(-50%); } }
.rss__lista li { position: relative; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.rss__lista a { display: flex; align-items: center; gap: 12px; padding: 12px 42px 12px 0; color: #fff; text-decoration: none; }
.rss__lista a:hover b { color: var(--ceu, #7dd3fc); }
.rss__foto { width: 64px; height: 64px; flex-shrink: 0; border-radius: 6px; background: #1c2942 center / cover no-repeat; }
.rss__texto { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.rss__texto small { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #5fb4ff; }
.rss__texto b { font-size: 14px; font-weight: 400; line-height: 1.35; color: #fff; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; transition: color .2s; }
.rss__texto time { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #a9b4c4; }
/* "Ouvir a notícia" de cada item: o mesmo botão dos cards (mesma voz da IA), em tamanho de painel */
.rss .rss__ouvir { right: 0; top: 50%; bottom: auto; transform: translateY(-50%); width: 36px; height: 36px; min-height: 0;
  background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); color: #fff; }
.rss .rss__ouvir:hover, .rss .rss__ouvir:focus-visible { background: #fff; color: #0a3d8f; }
.rss .rss__ouvir.tocando { background: #e11d2e; border-color: #e11d2e; color: #fff; }
/* sem movimento (acessibilidade ou sistema): lista parada, com rolagem normal */
html[data-movimento="reduzido"] .rss__lista { animation: none; }
html[data-movimento="reduzido"] .rss__janela { overflow-y: auto; }
html[data-movimento="reduzido"] .rss__lista li[aria-hidden="true"] { display: none; }
@media (prefers-reduced-motion: reduce) {
  .rss__lista { animation: none; } .rss__janela { overflow-y: auto; } .rss__lista li[aria-hidden="true"] { display: none; }
}
@media (max-width: 1000px) { .rss { display: none; } }
html[data-contraste="1"] .rss__corpo, html[data-contraste="1"] .rss__aba { background: #000; border: 2px solid #fff; }

/* Diário Oficial em vermelho no "Acesso rápido" (pedido de 28/10) */
.servico.servico--destaque { background: #e11d2e; border-color: #e11d2e; color: #fff; }
.servico.servico--destaque:hover { background: #c81526; border-color: #c81526; }
.servico.servico--destaque b { color: #fff; }
.servico.servico--destaque small, .servico.servico--destaque .servico__seta { color: rgba(255, 255, 255, .85); }
.servico.servico--destaque .servicos__icone { background: rgba(255, 255, 255, .18); color: #fff; }

/* Navbar INTEIRA fixa no alto (faixa de cima + logo/busca + menu), no computador — pedido de 28/10 */
@media (min-width: 901px) {
  html[data-visual="moderno"] .topo { position: sticky; top: 0; z-index: 8000; }
  html[data-visual="moderno"] { scroll-padding-top: 215px; }
}

/* Últimas notícias mais baixo: termina acima da janelinha da TV Câmara (canto de baixo, ~300px com a margem) — 28/10 */
.rss { bottom: auto; height: max(280px, calc(100vh - 330px)); max-height: calc(100% - 156px); }   /* o JS acerta pela TV */
/* nas outras páginas (30/10): preso na lateral esquerda, logo abaixo da navbar fixa; o JS acerta topo e altura.
   Fica abaixo da navbar (8000, por causa dos submenus) e da TV (9000). */
.rss.rss--fixo { position: fixed; z-index: 7900; top: 230px; max-height: none; }
/* aberto, o painel não cobre o texto: o que vem depois dele anda para a direita (painel 296 + aba 32 + folga).
   O <main> é o próprio .container (centraliza com margem automática), então ganha margem; faixas de largura total
   (rodapé, cabeçalhos de página) ganham recuo. */
@media (min-width: 1001px) {
  html.rss-lateral #rss ~ main.container { margin-left: max(344px, calc((100% - 1440px) / 2)); transition: margin-left .35s ease; }
  html.rss-lateral #rss ~ :is(section, footer, .previa-aviso) { padding-left: 344px; }
}

/* ===== Logo grande do topo (28/10, LOGO_TOPO): brasão + nome em pé, ENQUADRADO na linha da busca (que ficou mais
   alta para ele caber grande). Portal do Servidor e Contatos ficam à direita da faixa de cima. ===== */
@media (min-width: 901px) {
  html[data-visual="moderno"] .barra-acesso__inner { justify-content: flex-end; }
  html[data-visual="moderno"] .barra-acesso__esq { flex: 0 0 auto; margin-right: 8px; }
  html[data-visual="moderno"] .cabecalho__inner:has(.cabecalho__marca--grande) { min-height: 108px; }
  html[data-visual="moderno"] .cabecalho__marca.cabecalho__marca--grande,
  html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__marca.cabecalho__marca--grande {
    display: flex; align-items: center; padding: 0; background: transparent; border-radius: 0;
  }
  html[data-visual="moderno"] .cabecalho__marca--grande img.logo-topo,
  html[data-visual="moderno"]:not([data-tema="escuro"]) .cabecalho__marca--grande img.logo-topo { height: 92px; width: auto; opacity: 1; }
  /* no escuro o azul do logo some no fundo: vai numa placa branca com os cantos arredondados */
  html[data-visual="moderno"][data-tema="escuro"] .cabecalho__marca.cabecalho__marca--grande { background: #fff; border-radius: 12px; padding: 4px 8px; }
  html[data-visual="moderno"][data-tema="escuro"] .cabecalho__marca--grande img.logo-topo { height: 84px; }
}
@media (max-width: 900px) {
  html[data-visual="moderno"] .cabecalho__marca--grande { background: #fff; border-radius: 10px; padding: 4px 8px; }
  html[data-visual="moderno"] .cabecalho__marca--grande img.logo-topo { height: 56px; width: auto; }
}
html[data-contraste="1"] .cabecalho__marca--grande { background: #fff !important; }

/* ===== Barra de rolagem (28/10, pedido do pai): fina, nas cores do site, e começando ABAIXO da navbar fixa — o trilho
   ganha margem do tamanho do .topo (medido e escrito pelo site.js) e o vão ao lado da navbar fica da cor dela. ===== */
html[data-visual="moderno"] { --rolagem-trilho: #e8edf4; --rolagem-polegar: #9aa9be; --rolagem-polegar-hover: #1e3456;
  --rolagem-faixa: #0a3d8f; --rolagem-topo: #fff; }
html[data-visual="moderno"][data-tema="escuro"] { --rolagem-trilho: #060d1c; --rolagem-polegar: #34507a; --rolagem-polegar-hover: #5fb4ff;
  --rolagem-faixa: #0a3d8f; --rolagem-topo: #0b1729; }
html[data-visual="moderno"]::-webkit-scrollbar { width: 10px; height: 10px; background: var(--rolagem-trilho); }
html[data-visual="moderno"]::-webkit-scrollbar-track { background: var(--rolagem-trilho); }   /* margem do alto: site.js */
html[data-visual="moderno"]::-webkit-scrollbar-thumb { background: var(--rolagem-polegar); border-radius: 10px; border: 2px solid var(--rolagem-trilho); }
html[data-visual="moderno"]::-webkit-scrollbar-thumb:hover { background: var(--rolagem-polegar-hover); }
/* rolagens de dentro (listas, menus, painéis): mesma cara, mais fina */
html[data-visual="moderno"] body ::-webkit-scrollbar { width: 6px; height: 6px; background: transparent; }
html[data-visual="moderno"] body ::-webkit-scrollbar-thumb { background: var(--rolagem-polegar); border-radius: 6px; }
html[data-visual="moderno"] body ::-webkit-scrollbar-track { background: transparent; }
/* Firefox não tem as pseudo-classes acima: só afina e pinta */
@supports not selector(::-webkit-scrollbar) {
  html[data-visual="moderno"] { scrollbar-width: thin; scrollbar-color: var(--rolagem-polegar) var(--rolagem-trilho); }
}
html[data-contraste="1"] { --rolagem-trilho: #000; --rolagem-polegar: #ff0; --rolagem-faixa: #000; --rolagem-topo: #000; }

/* ===== Celular (auditoria 28/10, P1-10): a busca do cabeçalho vira lupa e abre em largura total; alvos ≥ 44 px ===== */
.btn-busca { display: none; }
@media (max-width: 900px) {
  html[data-visual="moderno"] .cabecalho .cabecalho__inner { flex-wrap: wrap; }
  html[data-visual="moderno"] .btn-busca { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: auto;
    border-radius: 999px; border: 1px solid #dbe2ec; background: #f1f5f9; color: #0f172a; cursor: pointer; }
  html[data-visual="moderno"][data-tema="escuro"] .btn-busca { background: #152238; border-color: #24365a; color: #e2e8f0; }
  html[data-visual="moderno"] .cabecalho .busca { display: none; }
  html[data-visual="moderno"] .cabecalho.busca-aberta .busca { display: flex; order: 99; flex: 1 0 100%; width: 100%; margin: 8px 0 4px; }
  html[data-visual="moderno"] .cabecalho.busca-aberta .btn-busca { background: #0a3d8f; border-color: #0a3d8f; color: #fff; }
}
@media (max-width: 900px) {
  html[data-visual="moderno"] .servidor-topo { flex: 0 0 auto; }
  html[data-visual="moderno"] .servidor-topo a { white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; }
  html[data-visual="moderno"] .servidor-topo a span { display: inline !important; }   /* sem o texto sobrava um link invisível de 8 px */
}
/* links soltos no texto do rodapé: área de toque de pelo menos 24 px de altura */
.rodape__grade p a { display: inline-block; min-height: 24px; padding: 2px 0; }

/* foto da abertura no tamanho da tela (auditoria 28/10, P2-03) */
@media (max-width: 1280px) { .abertura-moderna::before { background-image: var(--foto-abertura-m, var(--foto-abertura, none)); } }
@media (max-width: 768px) { .abertura-moderna::before { background-image: var(--foto-abertura-p, var(--foto-abertura-m, var(--foto-abertura, none))); } }

/* "Serviços ao cidadão": título e subtítulo quebram em até duas linhas em vez de cortar com reticências (auditoria 28/10, P2-04) */
.servico b, .servico small { white-space: normal; text-overflow: clip; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.servico b { display: -webkit-box; }