/* ---- _src/css/00-global.css ---- */
/* v2: estilos globais novos (frente global) */

/* ==== BLOCO COMPARTILHADO DAS 4 PÁGINAS DE PRODUTO (decisão nº 17) =======================================
   Movido em 12/10/2026 (v2) do <style> inline de cidades-inteligentes e seguranca para cá, sem mudar o desenho:
   topo .pa-heroi (.topo--midia + carimbo + legenda CFTV), subíndice fixo "Nesta página" com CTA, ciclo de 4 etapas
   e bloco de fabricantes. Vale para as 4 páginas: a cópia prefixada que existia no 21-dc-av.css saiu na revisão
   adversarial, e lá ficam só as diferenças de data-center e AV (título do herói mais largo, lead em 620 px, H2 de
   fabricantes no token do H2). Ajustes de tipografia da v2 (VEREDITO): lista de fabricantes em 400 no token do lead
   (300 nunca abaixo de 24 px); "Nesta página" (celular/tablet) é rótulo de navegação: Plex Sans 500, não mono.
   O selo do herói (.d/.m) troca na MESMA media query do pôster e do vídeo verticais (MQ_VERTICAL do build.py e
   mqVert do site.js): até 760 px e, em retrato, até 1100 px. ======================================================== */
.pa-heroi { min-height: clamp(680px, 96svh, 960px); padding-bottom: clamp(24px, 3vw, 40px); }
.pa-heroi .wrap { position: relative; }
.pa-heroi.topo--midia::after { background:
  linear-gradient(180deg, rgba(10, 10, 9, .74) 0, rgba(10, 10, 9, 0) 260px),
  linear-gradient(90deg, rgba(10, 10, 9, .92) 0%, rgba(10, 10, 9, .84) 36%, rgba(10, 10, 9, .5) 60%, rgba(10, 10, 9, .16) 84%),
  linear-gradient(0deg, rgba(10, 10, 9, .88) 0%, rgba(10, 10, 9, 0) 46%); }
.pa-heroi__rot { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; color: var(--claro); }
.pa-heroi__rot span + span::before { content: "·"; margin: 0 .75em; color: rgba(241, 240, 235, .6); }
.pa-heroi .topo__titulo { max-width: 11em; margin-top: 16px; }
.pa-heroi .topo__lead { max-width: 600px; color: var(--claro); }
.pa-heroi .acoes { margin-top: 32px; }
.pa-heroi__carimbo { margin: clamp(40px, 5vw, 64px) 0 0; background: rgba(12, 12, 11, .84); border-color: rgba(241, 240, 235, .22); --fio: rgba(241, 240, 235, .22); --texto-3: rgba(241, 240, 235, .72); --acento: var(--laranja-claro); }
.pa-heroi__carimbo > div { border-color: rgba(241, 240, 235, .22); }
.pa-heroi__cftv { position: absolute; z-index: 3; top: calc(var(--hdr-h) + 24px); right: var(--gut); display: flex; align-items: center; gap: 8px; }
.pa-heroi__cftv .midia__selo, .pa-heroi__cftv .midia__pausa { position: static; height: 34px; }
.pa-heroi__cftv .midia__selo .m { display: none; }

.pa-indice { position: sticky; top: var(--hdr-h); z-index: 40; background: var(--papel); color: var(--tinta); border-bottom: 1px solid rgba(20, 20, 19, .14); transition: opacity .25s, visibility .25s; }
.pa-indice.is-recolhido { opacity: 0; visibility: hidden; }
.pa-indice__in { display: flex; align-items: center; gap: 4px 22px; min-height: 58px; }
.pa-indice__rot { color: var(--laranja-texto); white-space: nowrap; }
.pa-indice__links { display: flex; align-items: center; gap: 4px 22px; min-width: 0; overflow: hidden; }
.pa-indice a:not(.btn) { display: inline-block; font-size: 14.5px; font-weight: 500; color: #4A4A49; white-space: nowrap; padding: 4px 0 3px; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.pa-indice a:not(.btn):hover, .pa-indice a.is-atual { color: var(--tinta); border-bottom-color: var(--laranja); }
.pa-indice__cta { margin-left: auto; flex: none; }
.pa-indice__menu { display: none; }
.pa-sec { scroll-margin-top: 58px; }

.pa-ciclo { margin-top: clamp(64px, 8vw, 112px); }
.pa-ciclo > .rotulo { color: var(--acento); }
.pa-ciclo .ciclo { margin-top: 22px; grid-template-columns: repeat(4, minmax(0, 1fr)); }

.pa-fab { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 10px; padding-top: 22px; border-top: 1px solid var(--fio); margin-bottom: clamp(56px, 7vw, 104px); }
.pa-fab > .rotulo { grid-column: 1 / span 3; color: var(--acento); padding-top: 10px; }
.pa-fab > div { grid-column: 4 / -1; }
.pa-fab h2 { font-size: clamp(26px, 2.4vw, 36px); line-height: 1.1; letter-spacing: -.02em; font-weight: 300; }   /* um degrau abaixo do H2: fabricantes ficam em segundo plano (o 21-dc-av usa o token do H2) */
.pa-fab__lista { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px 32px; font-size: var(--t-lead); font-weight: 400; line-height: 1.35; padding-top: 16px; border-top: 1px solid var(--fio); overflow: hidden; }
/* a barra fica no vão ANTES de cada nome; a do primeiro nome de cada linha cai fora da lista e o overflow a corta.
   Assim nenhuma linha termina ou começa com "/" quando a lista quebra no celular (achado vis-a-06) */
.pa-fab__lista li { position: relative; display: inline-flex; align-items: baseline; }
.pa-fab__lista li::before { content: "/"; content: "/" / ""; position: absolute; left: -20px; color: var(--texto-3); }
.pa-fab__lista small { font-size: .72em; color: var(--texto-2); margin-left: .4em; }
.pa-fab .nota { margin-top: 14px; }

@media (max-width: 1180px) {
  .pa-indice__links, .pa-indice__rot { display: none; }
  .pa-indice__in { min-height: 52px; }
  .pa-indice__menu { display: block; position: relative; }
  .pa-indice__menu summary { list-style: none; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; font-size: 12.5px; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; }
  .pa-indice__menu summary::-webkit-details-marker { display: none; }
  .pa-indice__menu summary .ic { width: 12px; height: 12px; transition: transform .2s; }
  .pa-indice__menu[open] summary .ic { transform: rotate(180deg); }
  .pa-indice__menu ul { position: absolute; left: calc(var(--gut) * -1); top: calc(100% + 4px); width: min(360px, 100vw); background: var(--papel); border: 1px solid rgba(20, 20, 19, .14); border-top: 2px solid var(--laranja); box-shadow: 0 18px 40px rgba(0, 0, 0, .18); padding: 6px 0; }
  .pa-indice__menu li a:not(.btn) { display: block; padding: 12px var(--gut); font-size: 16px; border-bottom: 0; }
  .pa-indice__menu li a.is-atual { box-shadow: inset 3px 0 0 var(--laranja); }
  .pa-sec { scroll-margin-top: 52px; }
}
@media (max-width: 1080px) {
  .pa-fab > .rotulo, .pa-fab > div { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .pa-heroi { min-height: 0; padding-top: calc(var(--hdr-h) + 76px); }
  .pa-heroi.topo--midia::after { background: linear-gradient(0deg, rgba(10, 10, 9, .95) 0%, rgba(10, 10, 9, .84) 46%, rgba(10, 10, 9, .68) 74%, rgba(10, 10, 9, .76) 100%); }
  .pa-heroi__rot { flex-direction: column; align-items: flex-start; gap: 4px; }
  .pa-heroi__rot span + span::before { display: none; }
  .pa-heroi .acoes { margin-top: 24px; gap: 14px 22px; }
  .pa-heroi .acoes .btn { width: 100%; white-space: normal; text-align: left; justify-content: space-between; }
  .pa-heroi__carimbo { margin-top: 30px; }
  .pa-heroi__cftv { top: calc(var(--hdr-h) + 14px); }
  .pa-ciclo .ciclo { grid-template-columns: 1fr; }
}
/* selo do herói: troca o texto longo (.d) pelo curto (.m) junto com a foto/vídeo vertical. Sem isso, um tablet em
   retrato (ex.: 820×1180) via o pôster vertical com a legenda da versão paisagem (achado cross-13). */
@media (max-width: 760px), (orientation: portrait) and (max-width: 1100px) {
  .pa-heroi__cftv .midia__selo .d { display: none; }
  .pa-heroi__cftv .midia__selo .m { display: inline; }
}
@media (max-width: 480px) {
  /* v2: "Nesta página" e o CTA numa linha em 390 px (antes o rótulo quebrava em duas); abaixo de ~370 px ele volta a quebrar, sem estourar */
  .pa-indice__in { gap: 4px 14px; }
  .pa-indice__cta .ic { display: none; }
}
/* ==== fim do bloco compartilhado ==== */

/* ==== botões de chamada que quebram em duas linhas (celular): sem palavra sozinha na 2ª linha (achado vis-a-13).
   Forma longa de propósito: o atalho text-wrap: balance também liga text-wrap-mode: wrap e anularia o white-space: nowrap
   de todos os .btn do site.css. Navegador sem suporte ignora a regra. */
.btn { text-wrap-style: balance; }

/* ==== figura de cronograma nas páginas legais (Gantt do comunicado aos stakeholders): no celular a imagem com texto
   embutido ficava com rótulos de ~4 px. Ela passa a ter 640 px e rola na horizontal dentro da própria moldura; a legenda
   fica parada. A tabela logo acima traz as mesmas datas (achado vis-d-14). */
@media (max-width: 760px) {
  .legal__texto:has(.legal-figura) { min-width: 0; }   /* item de grid: sem isto a trilha cresce para os 640 px da imagem */
  .legal__texto figure:has(.legal-figura) { min-width: 0; max-width: 100%; }
  .legal__texto figure > picture:has(.legal-figura) { display: block; width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }   /* bloco: inline não rola e empurrava a página para 679 px */
  .legal__texto figure .legal-figura { width: 640px; max-width: none; }
}

/* Popup "Trabalhe conosco" (v3.1) */
.popup { border: 0; padding: 0; max-width: min(92vw, 30rem); background: transparent; color: inherit; }
.popup::backdrop { background: rgba(29, 29, 27, .62); }
.popup__caixa { position: relative; background: var(--papel, #F3F1EC); color: var(--tinta, #1D1D1B); padding: 2.25rem 2rem 2rem; border-top: 3px solid var(--laranja, #E84F0F); }
.popup__titulo { font-weight: 400; font-size: var(--t-h3, 1.5rem); margin: .5rem 0 .75rem; }
.popup__caixa p { margin: 0 0 1.5rem; color: var(--texto-2, #3F3F3D); }
.popup__caixa p a { color: inherit; font-weight: 500; }
.popup__fechar { position: absolute; top: .5rem; right: .75rem; background: none; border: 0; font-size: 1.75rem; line-height: 1; color: var(--grafite, #636363); cursor: pointer; padding: .25rem .5rem; }
.popup__fechar:focus-visible { outline: 2px solid var(--laranja, #E84F0F); outline-offset: 2px; }

/* ---- _src/css/10-home.css ---- */
/* =============================================================================
   10-home.css · frente Home (v3, 13/10/2026) — páginas / (body.pg-inicio) e /solucoes/ (body.pg-solucoes)
   Tipografia: tokens do site.css (IBM Plex; --t-h1, --t-h2, --t-h3, --t-num, --t-lead…). Nenhum título em 700.
   Retorno de design de 13/10: o cinza da logo (--grafite #636363) e o grafite escuro da marca (--tinta-2 #3C3C3D)
   entram no lugar do preto nas faixas da home; nesses fundos o texto é branco/claro e o laranja fica só em fio e
   marcador (laranja em texto pequeno não passa AA sobre cinza). Nenhum fundo laranja nesta frente além do CTA final.
   ========================================================================== */

.pg-inicio { --sec-y: clamp(64px, 7vw, 104px); }

/* ---------- cinza da logo: temas oficiais .tema-grafite (#636363) e .tema-grafite-escuro (#3C3C3D) do site.css ---------- */

/* ---------- topo: título do briefing, sem legenda CFTV; deixa o topo das frentes aparecer na primeira dobra ---------- */
.pg-inicio .ini-hero { min-height: max(600px, calc(100svh - var(--util-h) - 88px)); }
.pg-inicio .hero__texto { max-width: min(100%, 980px); }
.pg-inicio .ini-hero__titulo {
  font-weight: 400; font-size: min(var(--t-h1), clamp(34px, min(3.9vw, 6.6vh), 58px));
  line-height: 1.1; letter-spacing: -.015em; max-width: 17em;
}
.pg-inicio .ini-hero__pos { color: var(--laranja-claro); }
.pg-inicio .hero__sobre span:last-child { white-space: normal; }
.pg-inicio .ini-hero__pausa { top: calc(var(--hdr-h) + 24px); right: var(--gut); bottom: auto; }

/* ---------- frentes (v3.1, BASE §12.6): 4 principais em destaque (cards em cinza da logo) + 2 complementares menores ---------- */
:is(.pg-inicio, .pg-solucoes) .fr-rot { color: var(--texto-3); margin-bottom: 18px; }
:is(.pg-inicio, .pg-solucoes) .fr-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--col-gap); }
:is(.pg-inicio, .pg-solucoes) .fr-card { display: flex; }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk { display: flex; flex-direction: column; width: 100%; background: var(--grafite); color: var(--branco); transition: background-color .25s; }
:is(.pg-inicio, .pg-solucoes) .fr-card__midia { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--tinta-2); }
:is(.pg-inicio, .pg-solucoes) .fr-card__midia picture { position: absolute; inset: 0; }
:is(.pg-inicio, .pg-solucoes) .fr-card__midia img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
:is(.pg-inicio, .pg-solucoes) .fr-card__img--dc { object-position: 50% 60%; }
:is(.pg-inicio, .pg-solucoes) .fr-card__img--seg { object-position: 50% 18%; }
:is(.pg-inicio, .pg-solucoes) .fr-card__img--av { object-position: 50% 58%; }   /* estúdio do CFM (MIDIAS-V2: card de Comunicação AV) */
:is(.pg-inicio, .pg-solucoes) .fr-card__corpo { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 24px 24px 26px; box-shadow: inset 0 3px 0 var(--laranja); }
:is(.pg-inicio, .pg-solucoes) .fr-card h3 { font-size: calc(var(--t-h2) * .72); font-weight: 400; line-height: 1.12; letter-spacing: -.012em; }
:is(.pg-inicio, .pg-solucoes) .fr-card p { font-size: 16px; line-height: 1.5; color: var(--branco); }
:is(.pg-inicio, .pg-solucoes) .fr-card .fr-card__entrega { font-size: 15.5px; color: #F4F4F1; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .3); }
:is(.pg-inicio, .pg-solucoes) .fr-card__mais { margin-top: auto; padding-top: 10px; display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; letter-spacing: .01em; }
:is(.pg-inicio, .pg-solucoes) .fr-card__mais .ic-seta { color: var(--branco); transition: transform .25s var(--ease); }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk:hover { background: var(--tinta-2); }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk:hover img { transform: scale(1.03); }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk:hover .fr-card__mais { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk:hover .ic-seta { transform: translateX(3px); }
:is(.pg-inicio, .pg-solucoes) .fr-card__lnk:focus-visible { outline-offset: 4px; }

:is(.pg-inicio, .pg-solucoes) .fr-comp { margin-top: clamp(40px, 4.4vw, 64px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 16px; padding-top: 20px; border-top: 1px solid var(--fio); }
:is(.pg-inicio, .pg-solucoes) .fr-comp > h2 { grid-column: 1 / span 3; color: var(--texto-3); padding-top: 2px; }
:is(.pg-inicio, .pg-solucoes) .fr-comp ul { grid-column: 4 / span 9; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
:is(.pg-inicio, .pg-solucoes) .fr-comp li { display: flex; }
:is(.pg-inicio, .pg-solucoes) .fr-comp a { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) 16px; grid-template-rows: auto 1fr; column-gap: 12px; row-gap: 8px; align-content: start; padding: 18px 20px 20px; border: 1px solid rgba(99, 99, 99, .45); border-top: 3px solid var(--grafite); transition: background-color .25s, border-color .25s; }
:is(.pg-inicio, .pg-solucoes) .fr-comp strong { font-size: var(--t-h3); font-weight: 500; line-height: 1.24; color: var(--texto); }
:is(.pg-inicio, .pg-solucoes) .fr-comp .ic-seta { margin-top: 4px; color: var(--grafite); }
:is(.pg-inicio, .pg-solucoes) .fr-comp span { grid-column: 1 / -1; font-size: 15px; line-height: 1.5; color: var(--texto-2); }
:is(.pg-inicio, .pg-solucoes) .fr-comp a:hover { background: var(--painel); border-color: var(--grafite); }
:is(.pg-inicio, .pg-solucoes) .fr-comp a:hover strong { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* /solucoes/: topo claro curto, frentes logo abaixo */
.pg-solucoes .fr-topo { padding-bottom: clamp(36px, 4vw, 56px); }
.pg-solucoes .fr-topo .topo__titulo { max-width: 15em; }
.pg-solucoes .fr-topo .topo__lead { max-width: 640px; }

/* ---------- escala e setores (cinza da logo) ---------- */
.pg-inicio .ini-escala .cab { margin-bottom: clamp(32px, 3.6vw, 52px); }
.pg-inicio .ini-escala .cab__titulo { max-width: 18em; }
.pg-inicio .ini-escala__kpis { border-top-color: var(--laranja); grid-template-columns: repeat(5, minmax(0, 1fr)); }   /* v3.1: 5 números do §12.1 */
.pg-inicio .ini-escala .kpi__valor { font-size: min(var(--t-num), 4.4vw, 68px); }
.pg-inicio .ini-escala .kpi__valor small { margin-left: .14em; }
.pg-inicio .ini-escala .kpi__rotulo { font-size: 17px; font-weight: 500; }
.pg-inicio .ini-setores { margin-top: clamp(40px, 4.4vw, 64px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 16px; padding-top: 20px; border-top: 1px solid var(--fio); }
.pg-inicio .ini-setores > h2 { grid-column: 1 / span 3; padding-top: 2px; }
.pg-inicio .ini-setores ul { grid-column: 4 / span 9; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--col-gap); }
.pg-inicio .ini-setores li { display: flex; align-items: center; gap: 12px; padding: 14px 0 15px; border-bottom: 1px solid var(--fio); font-size: var(--t-h3); line-height: 1.3; }
.pg-inicio .ini-setores li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--laranja); }
/* v3.1 (conferência final, BASE §12.1): nomes das cidades logo abaixo do +60 (partial lista-cidades-compacta) */
.pg-inicio .ini-cid { margin-top: 28px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 12px; align-items: baseline; padding-top: 20px; border-top: 1px solid var(--fio); }
.pg-inicio .ini-cid > .rotulo { grid-column: 1 / span 3; }
.pg-inicio .ini-cid .cid-compacta { grid-column: 4 / span 9; display: flex; flex-wrap: wrap; row-gap: 4px; font-size: 16px; line-height: 1.55; }
.pg-inicio .ini-cid .cid-compacta li { white-space: nowrap; }
.pg-inicio .ini-cid .cid-compacta li:not(:last-child)::after { content: "·"; margin: 0 .55em; color: var(--laranja); font-weight: 500; }
.pg-inicio .ini-cid .cid-compacta__uf { font-size: .86em; opacity: .8; }
.pg-inicio .ini-escala__pe { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px 24px; }
/* v4 (BASE §12.17): frase de escala dos municípios logo abaixo dos 5 números (texto em Light, não um 6º número) */
.pg-inicio .ini-escala__frase { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 28px; margin-top: 26px; }
.pg-inicio .ini-escala__frase > span { font-size: clamp(22px, 2vw, 30px); font-weight: 300; line-height: 1.25; letter-spacing: -.015em; color: var(--texto); }
.pg-inicio .ini-escala__frase .lnk { font-size: 16px; }

/* ---------- resultados ---------- */
.pg-inicio .ini-res .cab { margin-bottom: clamp(32px, 3.6vw, 52px); }
.pg-inicio .ini-res__grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.pg-inicio .ini-res__grade > li { display: flex; }
.pg-inicio .ini-res__card { width: 100%; display: flex; flex-direction: column; gap: 12px; padding: 22px 22px 24px; background: var(--painel); box-shadow: inset 0 3px 0 var(--laranja); transition: box-shadow .25s; }
.pg-inicio .ini-res__card > .rotulo { color: var(--texto-3); }
.pg-inicio .ini-res__card h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.3; letter-spacing: -.004em; }
.pg-inicio .ini-res__num { display: block; margin: 6px 0 10px; font-size: clamp(48px, 4.2vw, 68px); font-weight: 300; line-height: .95; letter-spacing: -.025em; font-variant-numeric: tabular-nums lining-nums; color: var(--grafite); }
.pg-inicio .ini-res__num i { font-style: normal; font-size: .5em; font-weight: 400; margin-left: .04em; }
.pg-inicio .ini-res__num small { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: var(--texto-3); }
.pg-inicio .ini-res__card--frase h3 { margin-top: 6px; font-size: calc(var(--t-h2) * .72); font-weight: 400; line-height: 1.18; letter-spacing: -.01em; color: var(--grafite); }
.pg-inicio .ini-res__card p { font-size: 15.5px; line-height: 1.5; color: var(--texto-2); }
.pg-inicio .ini-res__mais { margin-top: auto; padding-top: 6px; }
.pg-inicio a.ini-res__card:hover { box-shadow: inset 0 3px 0 var(--laranja), inset 0 0 0 1px var(--grafite); }

/* ---------- como contratar + atas (grafite escuro da marca) ---------- */
.pg-inicio .ini-contratar .cab { margin-bottom: clamp(32px, 3.6vw, 52px); }
.pg-inicio .ini-contratar .cab__titulo { max-width: 21em; }
.pg-inicio .ini-modos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--col-gap); margin-left: calc((100% + var(--col-gap)) / 12 * 3); }
.pg-inicio .ini-modo { padding: 22px 0 0; border-top: 2px solid var(--laranja); }
.pg-inicio .ini-modo h3 { display: flex; align-items: baseline; gap: 12px; font-size: calc(var(--t-h2) * .8); font-weight: 400; line-height: 1.15; }
.pg-inicio .ini-modo h3 span { font-size: var(--t-rotulo); font-weight: 500; letter-spacing: .07em; color: var(--texto-3); }
.pg-inicio .ini-modo p { margin-top: 14px; font-size: 16.5px; line-height: 1.55; color: var(--texto-2); max-width: 34em; }
.pg-inicio .ini-modos__pe { margin: 24px 0 0 calc((100% + var(--col-gap)) / 12 * 3); display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px 24px; }
.pg-inicio .ini-atas { margin: clamp(40px, 4.4vw, 64px) 0 0 calc((100% + var(--col-gap)) / 12 * 3); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; padding: 24px 28px; background: var(--grafite); }
.pg-inicio .ini-atas > div { flex: 1 1 26em; }
.pg-inicio .ini-atas h3 { font-size: var(--t-h3); font-weight: 500; color: var(--branco); }
.pg-inicio .ini-atas p { margin-top: 6px; font-size: 16px; line-height: 1.5; color: var(--branco); max-width: 40em; }

/* ---------- tablet ---------- */
@media (max-width: 1080px) {
  :is(.pg-inicio, .pg-solucoes) .fr-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :is(.pg-inicio, .pg-solucoes) .fr-comp > h2, :is(.pg-inicio, .pg-solucoes) .fr-comp ul { grid-column: 1 / -1; }
  .pg-inicio .ini-setores > h2, .pg-inicio .ini-setores ul { grid-column: 1 / -1; }
  .pg-inicio .ini-cid > .rotulo, .pg-inicio .ini-cid .cid-compacta { grid-column: 1 / -1; }
  .pg-inicio .ini-res__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-inicio .ini-modos, .pg-inicio .ini-modos__pe, .pg-inicio .ini-atas { margin-left: 0; }
}

/* v3.1: 5 números lado a lado no tablet, com respiro menor */
@media (min-width: 761px) and (max-width: 1080px) {
  .pg-inicio .ini-escala .kpi { padding-right: 12px; }
  .pg-inicio .ini-escala .kpi + .kpi { padding-left: 12px; }
  .pg-inicio .ini-escala .kpi__rotulo { font-size: 15.5px; }
}

/* ---------- celular ---------- */
@media (max-width: 760px) {
  .pg-inicio .ini-hero { min-height: 0; }
  .pg-inicio .ini-hero__titulo { font-size: clamp(30px, 8.4vw, 38px); line-height: 1.1; }
  .pg-inicio .hero__veu { background: linear-gradient(0deg, rgba(10, 10, 9, .94) 0%, rgba(10, 10, 9, .74) 50%, rgba(10, 10, 9, .4) 70%, rgba(10, 10, 9, .1) 86%), linear-gradient(180deg, rgba(10, 10, 9, .6) 0%, rgba(10, 10, 9, 0) 26%); }
  .pg-inicio .ini-hero__pausa { top: calc(var(--hdr-h) + 14px); }

  :is(.pg-inicio, .pg-solucoes) .fr-grade { grid-template-columns: 1fr; gap: 16px; }
  :is(.pg-inicio, .pg-solucoes) .fr-card__midia { aspect-ratio: 16 / 10; }
  :is(.pg-inicio, .pg-solucoes) .fr-card__corpo { padding: 20px 20px 22px; gap: 10px; }
  :is(.pg-inicio, .pg-solucoes) .fr-card h3 { font-size: 26px; }
  :is(.pg-inicio, .pg-solucoes) .fr-comp ul { grid-template-columns: 1fr; gap: 10px; }
  :is(.pg-inicio, .pg-solucoes) .fr-comp a { padding: 14px 16px 16px; }

  .pg-inicio .ini-escala .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-inicio .ini-escala .kpi { padding: 16px 10px 20px 0; border-right: 0; }
  .pg-inicio .ini-escala .kpi:nth-child(2n) { padding-left: 14px; border-left: 1px solid var(--fio); }
  .pg-inicio .ini-escala .kpi:nth-child(n+3) { border-top: 1px solid var(--fio); }
  .pg-inicio .ini-escala .kpi:last-child:nth-child(odd) { grid-column: 1 / -1; }   /* v3.1: o 5º número ocupa a linha inteira */
  .pg-inicio .ini-escala .kpi__valor { font-size: min(var(--t-num), 12vw); }
  .pg-inicio .ini-escala .kpi__rotulo { font-size: 15.5px; }
  .pg-inicio .ini-setores ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  .pg-inicio .ini-cid .cid-compacta { font-size: 15px; }
  .pg-inicio .ini-escala__frase { margin-top: 22px; gap: 6px 20px; }
  .pg-inicio .ini-escala__frase > span { font-size: 21px; }
  .pg-inicio .ini-setores li { font-size: 16.5px; align-items: flex-start; }
  .pg-inicio .ini-setores li::before { margin-top: .5em; }

  .pg-inicio .ini-res__grade { grid-template-columns: 1fr; }
  .pg-inicio .ini-modos { grid-template-columns: 1fr; gap: 28px; }
  .pg-inicio .ini-atas { padding: 20px; }
  .pg-inicio .ini-atas .btn { width: 100%; }
}
/* zoom de 400% (320 px): CTAs longos quebram a linha em vez de criar rolagem horizontal */
@media (max-width: 400px) { :is(.pg-inicio, .pg-solucoes) .btn { white-space: normal; text-align: left; line-height: 1.25; padding-top: 10px; padding-bottom: 10px; } }

/* ---- _src/css/20-cidades-seguranca.css ---- */
/* v2/v3 · frente Cidades Inteligentes + Segurança
   Páginas: /solucoes/cidades-inteligentes/ (.pg-solucoes-cidades-inteligentes) e /solucoes/seguranca/ (.pg-solucoes-seguranca).
   Sem font-family e sem tamanhos grandes fixos: títulos e números usam os tokens e as classes do site.css
   (var(--t-h3), .lead, .declaracao, .cab__titulo, .case__num, .faixa-numeros). Nenhum título em peso 700. */

/* =========================================================================================== CIDADES INTELIGENTES */
/* v3 (briefing da diretoria, 13/10/2026): página curta (topo → desafio → o que entregamos → resultados → como contratar →
   fabricantes → CTA). O cinza da marca (--grafite, #636363) ganha a faixa "O que entregamos": texto branco em peso 400–500
   (branco 6,0:1; --texto-3 a .85 dá 4,8:1). Laranja ali só como acento gráfico (ponto e haste do .cab, fio dos itens). */
.pg-solucoes-cidades-inteligentes { --ci-recuo: calc(25% + var(--col-gap) / 4); }   /* início da coluna 4 da grade de 12 (alinha com .cab__titulo) */

/* ---- topo: a promessa é longa, título um pouco mais largo ---- */
.pg-solucoes-cidades-inteligentes .pa-heroi .topo__titulo { max-width: 15em; }

/* ---- o desafio ---- */
.pg-solucoes-cidades-inteligentes .ci-desafio { grid-column: 4 / span 8; }
.pg-solucoes-cidades-inteligentes .ci-desafio .declaracao { max-width: 24em; }
.pg-solucoes-cidades-inteligentes .ci-desafio .lead { margin-top: clamp(20px, 2.2vw, 30px); max-width: 40em; }

/* ---- faixa no cinza da marca ---- */
/* tokens no .tema-grafite oficial (site.css); aqui só os ajustes da página */
.pg-solucoes-cidades-inteligentes .ci-grafite .cab__titulo { font-weight: 400; }
.pg-solucoes-cidades-inteligentes .ci-grafite .cab__lead { color: var(--texto); }

/* ---- o que entregamos ---- */
.pg-solucoes-cidades-inteligentes .ci-entrega { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 36px; align-items: start; }
.pg-solucoes-cidades-inteligentes .ci-entrega__foto { grid-column: 1 / span 3; grid-row: 1 / span 2; }
.pg-solucoes-cidades-inteligentes .ci-entrega__foto .midia { aspect-ratio: 3 / 4; }
.pg-solucoes-cidades-inteligentes .ci-entrega__foto img { object-position: 50% 30%; }
.pg-solucoes-cidades-inteligentes .ci-entrega__lista { grid-column: 4 / -1; grid-row: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px var(--col-gap); }
.pg-solucoes-cidades-inteligentes .ci-entrega__lista li { position: relative; padding-top: 18px; border-top: 1px solid var(--fio); }
.pg-solucoes-cidades-inteligentes .ci-entrega__lista li::before { content: ""; position: absolute; left: 0; top: -2px; width: 28px; height: 3px; background: var(--laranja); }
.pg-solucoes-cidades-inteligentes .ci-entrega__lista h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.24; letter-spacing: -.004em; }
.pg-solucoes-cidades-inteligentes .ci-entrega__lista p { margin-top: 8px; font-size: 16px; line-height: 1.55; color: var(--texto-2); }
.pg-solucoes-cidades-inteligentes .ci-totem { grid-column: 4 / -1; grid-row: 2; align-self: end; padding-top: 20px; border-top: 1px solid var(--fio); display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 32px; font-size: var(--t-lead); line-height: 1.5; }
.pg-solucoes-cidades-inteligentes .ci-totem .lnk { color: var(--texto); white-space: nowrap; }

/* ---- resultados ---- */
.pg-solucoes-cidades-inteligentes .ci-res .case h3 { font-weight: 500; }
.pg-solucoes-cidades-inteligentes .ci-res__txt { display: grid; gap: 10px; align-content: start; justify-items: start; }
.pg-solucoes-cidades-inteligentes .ci-res .case--resultado .case__corpo { padding: 26px 24px; gap: 12px; }
.pg-solucoes-cidades-inteligentes .ci-res .case--resultado .case__corpo > div { margin-bottom: 6px; }
.pg-solucoes-cidades-inteligentes .ci-res__pe { margin-top: 32px; display: flex; justify-content: flex-end; }

/* ---- como contratar ---- */
.pg-solucoes-cidades-inteligentes .ci-modos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px var(--col-gap); margin-left: var(--ci-recuo); }
.pg-solucoes-cidades-inteligentes .ci-modos article { padding-top: 18px; border-top: 2px solid var(--fio-forte); }
.pg-solucoes-cidades-inteligentes .ci-modos .rotulo { color: var(--acento); }
.pg-solucoes-cidades-inteligentes .ci-modos h3 { margin-top: 10px; font-size: var(--t-h3); font-weight: 500; line-height: 1.24; letter-spacing: -.004em; }
.pg-solucoes-cidades-inteligentes .ci-modos p:not(.rotulo) { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--texto-2); }
.pg-solucoes-cidades-inteligentes .ci-modos .ci-modos__orc { margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--fio); font-size: 13.5px; font-weight: 500; letter-spacing: .02em; color: var(--grafite); }
.pg-solucoes-cidades-inteligentes .ci-modos__pe { margin: 28px 0 0 var(--ci-recuo); gap: 10px 28px; }
.pg-solucoes-cidades-inteligentes .ci-atas { margin: clamp(40px, 4.5vw, 64px) 0 0 var(--ci-recuo); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 32px; align-items: center; padding: 22px 24px; background: var(--painel); border-left: 3px solid var(--grafite); }
.pg-solucoes-cidades-inteligentes .ci-atas .rotulo { color: var(--grafite); }
.pg-solucoes-cidades-inteligentes .ci-atas__txt { font-size: 16.5px; line-height: 1.5; max-width: 40em; }
.pg-solucoes-cidades-inteligentes .ci-atas .btn { grid-column: 2; grid-row: 1 / span 2; }

@media (max-width: 1080px) {
  .pg-solucoes-cidades-inteligentes .ci-desafio { grid-column: 1 / -1; }
  .pg-solucoes-cidades-inteligentes .ci-entrega__foto { grid-column: 1 / span 4; }
  .pg-solucoes-cidades-inteligentes .ci-entrega__lista, .pg-solucoes-cidades-inteligentes .ci-totem { grid-column: 5 / -1; }
  .pg-solucoes-cidades-inteligentes .ci-entrega__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px var(--col-gap); }
  .pg-solucoes-cidades-inteligentes .ci-modos,
  .pg-solucoes-cidades-inteligentes .ci-modos__pe, .pg-solucoes-cidades-inteligentes .ci-atas { margin-left: 0; }
}
@media (max-width: 760px) {
  .pg-solucoes-cidades-inteligentes .ci-entrega__foto, .pg-solucoes-cidades-inteligentes .ci-entrega__lista, .pg-solucoes-cidades-inteligentes .ci-totem { grid-column: 1 / -1; grid-row: auto; }
  .pg-solucoes-cidades-inteligentes .ci-entrega__foto .midia { aspect-ratio: 4 / 3; }
  .pg-solucoes-cidades-inteligentes .ci-entrega__lista { grid-template-columns: 1fr; gap: 26px; }
  .pg-solucoes-cidades-inteligentes .ci-totem { font-size: 16.5px; }
  .pg-solucoes-cidades-inteligentes .ci-totem .lnk { white-space: normal; }
  .pg-solucoes-cidades-inteligentes .ci-res__pe .btn { width: 100%; justify-content: space-between; }
  .pg-solucoes-cidades-inteligentes .ci-modos { grid-template-columns: 1fr; }
  .pg-solucoes-cidades-inteligentes .ci-atas { grid-template-columns: 1fr; padding: 20px 18px; }
  .pg-solucoes-cidades-inteligentes .ci-atas .btn { grid-column: 1; grid-row: auto; margin-top: 10px; width: 100%; white-space: normal; text-align: left; justify-content: space-between; }
}

/* ---- v3.1 (BASE §12): linha de cinco cases pequenos (Brumadinho voltou) ---- */
.pg-solucoes-cidades-inteligentes .ci-res__linha { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.pg-solucoes-cidades-inteligentes .ci-res__linha > .case { grid-column: auto; }
.pg-solucoes-cidades-inteligentes .ci-res__linha .case h3 { font-size: 19px; line-height: 1.26; }

/* ---- v3.1 (BASE §12): +60 cidades inteligentes, sempre com a lista (partial lista-cidades) ---- */
.pg-solucoes-cidades-inteligentes .ci-cid { margin-top: clamp(56px, 6vw, 96px); padding-top: clamp(26px, 2.6vw, 36px); border-top: 2px solid var(--fio-forte); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; align-items: start; }
.pg-solucoes-cidades-inteligentes .ci-cid__cab { grid-column: 1 / span 3; }
.pg-solucoes-cidades-inteligentes .ci-cid .cid-lista { grid-column: 4 / -1; }
.pg-solucoes-cidades-inteligentes .ci-cid__t b { display: block; font-weight: 300; font-size: clamp(64px, 6.4vw, 104px); line-height: .9; letter-spacing: -.035em; font-variant-numeric: tabular-nums lining-nums; color: var(--texto); }
.pg-solucoes-cidades-inteligentes .ci-cid__t span { display: block; margin-top: 14px; font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--grafite); }
.pg-solucoes-cidades-inteligentes .ci-cid__lead { margin-top: 14px; max-width: 17em; font-size: 16px; line-height: 1.55; color: var(--texto-2); }

/* =========================================================================================== LISTA DE CIDADES (compartilhada)
   Partial _src/partials/lista-cidades.html, fonte única em /solucoes/cidades-inteligentes/ e /mapa-de-atuacao/.
   Três colunas (Centro-Oeste · Sudeste · Norte, Nordeste e Sul); estado em versalete no cinza da marca; cidades em linha. */
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px clamp(24px, 3vw, 48px); align-items: start; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista__col { display: grid; gap: 28px; align-content: start; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista__reg { position: relative; padding-top: 14px; border-top: 1px solid var(--fio-forte); }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista__reg::before { content: ""; position: absolute; left: 0; top: -2px; width: 28px; height: 3px; background: var(--laranja); }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista__reg-t { font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -.005em; color: var(--texto); }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista dt { margin-top: 14px; font-size: 12px; font-weight: 500; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; color: var(--grafite); }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista dd { margin: 4px 0 0; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista ul { display: inline; margin: 0; padding: 0; list-style: none; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista li { display: inline; white-space: nowrap; font-size: 16.5px; font-weight: 400; line-height: 1.65; color: var(--texto); }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista li:not(:last-child)::after { content: "·"; margin: 0 .1em 0 .4em; color: var(--laranja); font-weight: 500; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista a { border-bottom: 1px solid var(--fio-forte); transition: color .2s, border-color .2s; }
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista a:hover,
:is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista a:focus-visible { color: var(--acento); border-color: var(--acento); }

/* mapa de atuação (nesta rodada, dono cidades-mapa): lista abaixo do cabeçalho da 40-empresa.css e faixa com cinco números */
.pg-mapa-de-atuacao .pm-ufs .cid-lista { margin-top: 26px; }
@media (min-width: 761px) {
  .pg-mapa-de-atuacao .pm-numeros { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 1080px) {
  .pg-solucoes-cidades-inteligentes .ci-res__linha { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-solucoes-cidades-inteligentes .ci-cid__cab, .pg-solucoes-cidades-inteligentes .ci-cid .cid-lista { grid-column: 1 / -1; }
  .pg-solucoes-cidades-inteligentes .ci-cid__cab { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 28px; }
  .pg-solucoes-cidades-inteligentes .ci-cid__lead { margin-top: 0; max-width: 24em; }
}
@media (max-width: 760px) {
  .pg-solucoes-cidades-inteligentes .ci-res__linha { grid-template-columns: 1fr; }
  :is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista { grid-template-columns: 1fr; gap: 24px; }
  :is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista__col { gap: 24px; }
  :is(.pg-solucoes-cidades-inteligentes, .pg-mapa-de-atuacao) .cid-lista li { font-size: 16px; }
  .pg-mapa-de-atuacao .pm-numeros > div:last-child { grid-column: 1 / -1; }
}

/* SEGURANÇA: as regras da v2 (psg-*, sg-esp*, desenho--pe, cases h3) saíram na conferência final v3 (13/10/2026);
   a página usa o _src/css/22-seguranca.css (classes sgr-*). */

/* ---- _src/css/21-dc-av.css ---- */
/* ==========================================================================================================
   21-dc-av.css · /solucoes/data-center/ (body.pg-solucoes-data-center) e peças .dci-* também em
   /solucoes/infraestrutura-de-ti/ (body.pg-solucoes-infraestrutura-de-ti). Tudo prefixado para não vazar.
   Conferência final v3 (13/10/2026): saíram as regras sem uso da v2 — .pg-av/.pav-* (a página de AV usa o
   24-av-software.css), .pg-solucoes (pa-quad, pa-tile__osd, pa-frentes, pa-matriz, pa-modos, sol-fab, escala__pe:
   /solucoes/ usa os componentes .fr-* do 10-home.css) e as peças comuns da v2 (dca-ficha, pa-inline, pa-credito,
   pa-recuo, pa-fab h2). Títulos nos tokens do site.css; nada de peso 700 em título.
   ========================================================================================================== */

/* ajuste sobre o bloco compartilhado .pa-heroi (00-global.css): título mais largo e balanceado, lead em 620 px */
.pg-solucoes-data-center .pa-heroi .topo__titulo { max-width: 12em; text-wrap: balance; }
.pg-solucoes-data-center .pa-heroi .topo__lead { max-width: 620px; }

/* ==========================================================================================================
   /solucoes/data-center/ e peças comuns com /solucoes/infraestrutura-de-ti/ (rodada v3, 13/10/2026)
   Página curta: desafio → o que entregamos → resultados → como contratar → fabricantes → CTA. Saíram o rack 42U, o
   corte A–A, as fichas técnicas, o respiro em vídeo e os números (v3.1: o destaque de Igarapé e o bloco de empresas
   voltaram, sem números e sem nomes de clientes privados).
   Retorno de design: o cinza da logo (--grafite, #636363) aparece mais; a faixa "O desafio" é toda nele.
   ========================================================================================================== */

/* ---- faixa no cinza da marca (Data Center e Infraestrutura de TI) ----
   Contraste conferido sobre #636363: branco 6,0:1 · texto-2 (branco a 92%) 5,4:1 · texto-3 #E6E6E3 4,8:1.
   O laranja não serve de texto aqui (2:1): fica só como fio decorativo. Título em 400, nunca light sobre o cinza. */
/* tokens no .tema-grafite oficial (site.css) */
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio { padding: clamp(64px, 8vw, 128px) 0; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 18px; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__rot { grid-column: 1 / span 3; padding-top: 14px; border-top: 3px solid var(--laranja); align-self: start; justify-self: start; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__txt { grid-column: 4 / span 8; display: grid; gap: 22px; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__tit { font-size: var(--t-h2); font-weight: 400; line-height: 1.14; letter-spacing: -.018em; max-width: 18em; text-wrap: balance; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__txt > p { font-size: var(--t-lead); line-height: 1.6; color: var(--texto-2); max-width: 38em; text-wrap: pretty; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__txt > .dci-desafio__muda { padding-left: 18px; border-left: 3px solid var(--laranja); color: var(--texto); }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__muda strong { font-weight: 500; }

/* ---- resultados: cartões de case (fotos em 16:10; as verticais com o enquadramento no meio) ---- */
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-cases .case h3 { text-wrap: pretty; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-cases .case--contorno { min-height: 220px; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-cases .case--contorno h3 { font-size: calc(var(--t-h3) * 1.08); }
.pg-solucoes-data-center .dci-cases__alto img { object-position: 50% 42%; }
.pg-solucoes-data-center .dci-cases__fachada img { object-position: 50% 18%; }

/* ---- como contratar: dois caminhos lado a lado ---- */
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminhos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 32px); }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminho { display: grid; align-content: start; gap: 12px; padding: 22px 0 6px; border-top: 2px solid var(--fio-forte); }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminho .rotulo { color: var(--grafite); }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminho h3 { font-size: clamp(22px, 1.8vw, 27px); font-weight: 400; line-height: 1.2; letter-spacing: -.012em; max-width: 18em; text-wrap: balance; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminho p:not(.rotulo) { font-size: 16px; line-height: 1.6; color: var(--texto-2); max-width: 34em; text-wrap: pretty; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminhos__pe { margin-top: clamp(28px, 3vw, 40px); padding-top: 16px; border-top: 1px solid var(--fio); display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 32px; }
:is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminhos__pe .nota { font-size: 14px; color: var(--texto-2); }

/* ---- Data Center: o que entregamos (ciclo de quatro etapas, sem foto: a página fica mais curta) ---- */
.pg-solucoes-data-center .dci-ciclo { margin-top: 0; }
.pg-solucoes-data-center .dci-ciclo .ciclo { margin-top: 0; }
.pg-solucoes-data-center .dci-ciclo .ciclo .rotulo { color: var(--grafite); }

/* ==========================================================================================================
   v3.1 (BASE §12 item 5, 13/10/2026): o "recheio" em destaque e os cases de data center da v2 de volta, sem números
   nem fichas. Os dois painéis em destaque usam o .tema-grafite oficial (cinza da logo); título em 400, nunca 700.
   ========================================================================================================== */

/* ---- O que entregamos: o recheio (foto do rack de servidores + texto), logo abaixo do ciclo ---- */
.pg-solucoes-data-center .dci-recheio { margin-top: clamp(56px, 7vw, 96px); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.pg-solucoes-data-center .dci-recheio__midia { position: relative; min-height: 360px; overflow: hidden; background: #0d0d0c; }
.pg-solucoes-data-center .dci-recheio__midia > picture { position: absolute; inset: 0; }
.pg-solucoes-data-center .dci-recheio__midia img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.pg-solucoes-data-center .dci-recheio__txt { padding: clamp(28px, 4vw, 56px); display: grid; align-content: center; gap: 18px; }
.pg-solucoes-data-center .dci-recheio__rot { padding-top: 12px; border-top: 3px solid var(--laranja); justify-self: start; }
.pg-solucoes-data-center .dci-recheio__tit { font-size: var(--t-h2); font-weight: 400; line-height: 1.14; letter-spacing: -.018em; max-width: 16em; text-wrap: balance; }
.pg-solucoes-data-center .dci-recheio__lead { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); max-width: 34em; text-wrap: pretty; }
.pg-solucoes-data-center .dci-recheio__lista { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(20px, 2.4vw, 36px); }
.pg-solucoes-data-center .dci-recheio__lista li { display: grid; align-content: start; gap: 4px; padding: 14px 0 16px; border-top: 1px solid var(--fio); }
.pg-solucoes-data-center .dci-recheio__lista b { font-size: 18px; font-weight: 500; color: var(--texto); }
.pg-solucoes-data-center .dci-recheio__lista span { font-size: 15.5px; line-height: 1.5; color: var(--texto-2); }
.pg-solucoes-data-center .dci-recheio__prova { padding-left: 16px; border-left: 3px solid var(--laranja); font-size: 15.5px; line-height: 1.5; color: var(--texto); max-width: 36em; }

/* ---- Resultados: Igarapé em destaque (texto, sem foto própria) e grade de cases ---- */
.pg-solucoes-data-center .dci-destaque { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 16px; padding: clamp(28px, 4vw, 56px); margin-bottom: 16px; }
.pg-solucoes-data-center .dci-destaque__rot { grid-column: 1 / span 3; padding-top: 12px; border-top: 3px solid var(--laranja); align-self: start; justify-self: start; }
.pg-solucoes-data-center .dci-destaque__txt { grid-column: 4 / span 8; display: grid; gap: 16px; justify-items: start; }
.pg-solucoes-data-center .dci-destaque__tit { font-size: var(--t-h2); font-weight: 400; line-height: 1.14; letter-spacing: -.018em; max-width: 18em; text-wrap: balance; }
.pg-solucoes-data-center .dci-destaque__txt > p { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); max-width: 38em; text-wrap: pretty; }
.pg-solucoes-data-center .dci-destaque .lnk { color: var(--branco); }
.pg-solucoes-data-center .dci-cases .dci-cases__largo { grid-column: span 6; }
.pg-solucoes-data-center .dci-cidades { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pg-solucoes-data-center .dci-cidades li { font-size: 15.5px; line-height: 1.3; padding: 7px 12px 6px; border: 1px solid var(--fio); color: var(--texto); }
.pg-solucoes-data-center .dci-cidades a { color: inherit; text-decoration: underline; text-decoration-color: var(--acento); text-underline-offset: 3px; }
.pg-solucoes-data-center .dci-cidades a:hover { color: var(--acento); }
.pg-solucoes-data-center .dci-privados { display: grid; gap: 0; margin: 4px 0 0; }
.pg-solucoes-data-center .dci-privados > div { display: grid; gap: 4px; padding: 12px 0; border-top: 1px solid var(--fio); }
.pg-solucoes-data-center .dci-privados dt { font-size: 15.5px; font-weight: 500; color: var(--texto); }
.pg-solucoes-data-center .dci-privados dd { margin: 0; font-size: 15.5px; line-height: 1.5; color: var(--texto-2); }

@media (max-width: 1080px) {
  :is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__rot { grid-column: 1 / -1; }
  .pg-solucoes-data-center .dci-recheio { grid-template-columns: minmax(0, 1fr); }
  .pg-solucoes-data-center .dci-recheio__midia { min-height: 0; aspect-ratio: 16 / 10; }
  .pg-solucoes-data-center .dci-destaque__rot, .pg-solucoes-data-center .dci-destaque__txt { grid-column: 1 / -1; }
  :is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__txt { grid-column: 1 / -1; }
  :is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-cases .case--contorno { min-height: 0; }
}
@media (max-width: 760px) {
  :is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-caminhos { grid-template-columns: 1fr; }
  :is(.pg-solucoes-data-center, .pg-solucoes-infraestrutura-de-ti) .dci-desafio__txt > p { font-size: 17px; }
  .pg-solucoes-data-center .dci-recheio__lista { grid-template-columns: 1fr; }
  .pg-solucoes-data-center .dci-recheio__midia { aspect-ratio: 4 / 3; }
  .pg-solucoes-data-center .dci-cases .dci-cases__largo { grid-column: 1 / -1; }
  .pg-solucoes-data-center :is(.dci-recheio__lead, .dci-destaque__txt > p) { font-size: 17px; }
}

/* ---- _src/css/22-seguranca.css ---- */
/* ==== /solucoes/seguranca/ — v3 (briefing da diretoria e retorno de design, 13/10/2026) — dono "seguranca" ====================
   Prefixo .pg-solucoes-seguranca; classes novas sgr-*. As regras psg-* / sg-esp* da v2 saíram do 20-cidades-seguranca.css.
   Cinza da logo: as faixas escuras desta página usam var(--grafite) como fundo (.tema-grafite oficial do site.css, mais
   .sgr-grafite para os ajustes da página). Texto branco ou quase branco (4,8:1 a 6,1:1 sobre #636363); o laranja fica só nos fios e marcadores
   (laranja-claro sobre grafite dá 2:1 e não serve para texto). Títulos em 300–500, nunca 700. ===================================== */

.pg-solucoes-seguranca .sgr-grafite .cab__meta .rotulo + .rotulo { color: var(--texto-3); }

/* topo: sem carimbo, o título é a promessa (frase longa: um pouco mais largo que o padrão de 11em) */
.pg-solucoes-seguranca .pa-heroi .topo__titulo { max-width: 13em; }

/* ---- desafio: problema → o que muda, em duas colunas alinhadas ao título ---- */
.pg-solucoes-seguranca .sgr-desafio { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; }
.pg-solucoes-seguranca .sgr-desafio > div { grid-column: 4 / span 4; display: flex; flex-direction: column; gap: 12px; padding-top: 18px; border-top: 1px solid var(--fio); }
.pg-solucoes-seguranca .sgr-desafio > div + div { grid-column: 9 / span 4; border-top-color: var(--grafite); }
.pg-solucoes-seguranca .sgr-desafio .rotulo { color: var(--grafite); }
.pg-solucoes-seguranca .sgr-desafio > div + div .rotulo { color: var(--acento); }
.pg-solucoes-seguranca .sgr-desafio p:not(.rotulo) { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); }

/* ---- o que entregamos: quatro frentes com foto ---- */
.pg-solucoes-seguranca .sgr-entregas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px var(--col-gap); }
.pg-solucoes-seguranca .sgr-entregas article { display: flex; flex-direction: column; gap: 12px; }
.pg-solucoes-seguranca .sgr-entregas .midia { aspect-ratio: 4 / 5; margin-bottom: 8px; }
.pg-solucoes-seguranca .sgr-entregas h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.24; padding-top: 14px; border-top: 2px solid var(--grafite); }
.pg-solucoes-seguranca .sgr-entregas p { font-size: 16px; line-height: 1.55; color: var(--texto-2); }

/* ---- totem e drones (faixa grafite) ---- */
.pg-solucoes-seguranca .sgr-td { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; align-items: start; }
.pg-solucoes-seguranca .sgr-td__fig { grid-column: 1 / span 5; margin: 0; }
/* v3.1: imagem de produto da Hikvision (fundo branco, cinco vistas): painel branco, imagem inteira */
.pg-solucoes-seguranca .sgr-td__foto { aspect-ratio: 800 / 566; background: var(--branco); }
.pg-solucoes-seguranca .sgr-td__foto img { object-fit: contain; }
.pg-solucoes-seguranca .sgr-td__txt { grid-column: 7 / span 6; display: flex; flex-direction: column; gap: clamp(32px, 3.5vw, 48px); }
.pg-solucoes-seguranca .sgr-td__bloco { display: flex; flex-direction: column; gap: 14px; padding-top: 18px; border-top: 1px solid var(--fio); position: relative; }
.pg-solucoes-seguranca .sgr-td__bloco::before { content: ""; position: absolute; left: 0; top: -2px; width: 48px; height: 3px; background: var(--laranja); }
.pg-solucoes-seguranca .sgr-td__bloco h3 { font-size: clamp(22px, 1.9vw, 28px); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; color: var(--branco); }
.pg-solucoes-seguranca .sgr-td__bloco p { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); max-width: 34em; }
.pg-solucoes-seguranca .sgr-td__ref { font-weight: 500; color: var(--branco) !important; }
/* v3.1: drone em miniatura ao lado do texto (a imagem tem 480 px) */
.pg-solucoes-seguranca .sgr-td__bloco--drone { display: grid; grid-template-columns: minmax(0, 1fr) clamp(150px, 15vw, 220px); column-gap: clamp(20px, 2.4vw, 32px); align-items: start; }
.pg-solucoes-seguranca .sgr-td__bloco-txt { display: flex; flex-direction: column; gap: 14px; }
.pg-solucoes-seguranca .sgr-td__mini { margin: 4px 0 0; }
.pg-solucoes-seguranca .sgr-td__mini .midia { aspect-ratio: 4 / 3; }
.pg-solucoes-seguranca .sgr-td .legenda { margin-top: 10px; font-size: 12.5px; }

/* ---- resultados: Esplanada em destaque + três cases curtos ---- */
.pg-solucoes-seguranca .sgr-destaque { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); background: var(--painel); }
.pg-solucoes-seguranca .sgr-destaque__foto { min-height: 100%; aspect-ratio: 16 / 9; }
.pg-solucoes-seguranca .sgr-destaque__txt { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: clamp(28px, 3vw, 44px); border-top: 3px solid var(--laranja); }
.pg-solucoes-seguranca .sgr-destaque__txt .rotulo { color: var(--grafite); }
.pg-solucoes-seguranca .sgr-destaque__txt h3 { font-size: clamp(24px, 2.1vw, 32px); font-weight: 400; line-height: 1.2; letter-spacing: -.01em; }
.pg-solucoes-seguranca .sgr-destaque__txt p:not(.rotulo) { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); }
.pg-solucoes-seguranca .sgr-destaque__txt .lnk { margin-top: auto; }
.pg-solucoes-seguranca .sgr-cases { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pg-solucoes-seguranca .sgr-cases li { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 22px 24px 26px; background: var(--painel); border-top: 3px solid var(--grafite); }
.pg-solucoes-seguranca .sgr-cases .rotulo { color: var(--grafite); }
.pg-solucoes-seguranca .sgr-cases h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.3; }
.pg-solucoes-seguranca .sgr-cases .lnk { margin-top: auto; padding-top: 4px; }

/* ---- condomínios (faixa grafite) ---- */
.pg-solucoes-seguranca #condominios .cab { margin-bottom: clamp(28px, 3vw, 44px); }
.pg-solucoes-seguranca .sgr-cond { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 28px; }
.pg-solucoes-seguranca .sgr-cond .lead { grid-column: 4 / span 7; color: var(--texto-2); max-width: 40em; }
.pg-solucoes-seguranca .sgr-cond .acoes { grid-column: 4 / span 7; }

/* ---- como contratar: investimento ou serviço ---- */
.pg-solucoes-seguranca .sgr-modelos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pg-solucoes-seguranca .sgr-modelo { display: flex; flex-direction: column; gap: 14px; padding: clamp(24px, 2.6vw, 36px); background: var(--painel); border-top: 3px solid var(--grafite); }
.pg-solucoes-seguranca .sgr-modelo--servico { border-top-color: var(--laranja); }
.pg-solucoes-seguranca .sgr-modelo .rotulo { color: var(--grafite); }
.pg-solucoes-seguranca .sgr-modelo--servico .rotulo { color: var(--acento); }
.pg-solucoes-seguranca .sgr-modelo h3 { font-size: clamp(22px, 1.9vw, 28px); font-weight: 400; line-height: 1.2; letter-spacing: -.008em; }
.pg-solucoes-seguranca .sgr-modelo p:not(.rotulo) { font-size: 16.5px; line-height: 1.55; color: var(--texto-2); }
.pg-solucoes-seguranca .sgr-modelos__pe { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.pg-solucoes-seguranca .sgr-modelos__pe .nota { font-size: 15px; color: var(--grafite); max-width: 46em; }

/* ---- tablet ---- */
@media (max-width: 1080px) {
  .pg-solucoes-seguranca .sgr-desafio > div, .pg-solucoes-seguranca .sgr-desafio > div + div { grid-column: span 6; }
  .pg-solucoes-seguranca .sgr-entregas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-solucoes-seguranca .sgr-entregas .midia { aspect-ratio: 4 / 3; }
  .pg-solucoes-seguranca .sgr-td__fig { grid-column: 1 / span 5; }
  .pg-solucoes-seguranca .sgr-td__txt { grid-column: 6 / span 7; }
  .pg-solucoes-seguranca .sgr-destaque { grid-template-columns: 1fr; }
  .pg-solucoes-seguranca .sgr-destaque__foto { min-height: 0; }
  .pg-solucoes-seguranca .sgr-cond .lead, .pg-solucoes-seguranca .sgr-cond .acoes { grid-column: 1 / -1; }
}

/* ---- celular ---- */
@media (max-width: 760px) {
  .pg-solucoes-seguranca .pa-heroi .topo__titulo { max-width: none; }
  .pg-solucoes-seguranca .sgr-desafio > div, .pg-solucoes-seguranca .sgr-desafio > div + div { grid-column: 1 / -1; }
  .pg-solucoes-seguranca .sgr-entregas { grid-template-columns: 1fr; gap: 36px; }
  .pg-solucoes-seguranca .sgr-entregas .midia { aspect-ratio: 16 / 10; }
  .pg-solucoes-seguranca .sgr-td__fig, .pg-solucoes-seguranca .sgr-td__txt { grid-column: 1 / -1; }
  .pg-solucoes-seguranca .sgr-td__bloco--drone { grid-template-columns: minmax(0, 1fr); row-gap: 18px; }
  .pg-solucoes-seguranca .sgr-td__mini { max-width: 280px; margin-top: 0; }
  .pg-solucoes-seguranca .sgr-destaque__foto { aspect-ratio: 4 / 3; }
  .pg-solucoes-seguranca .sgr-cases, .pg-solucoes-seguranca .sgr-modelos { grid-template-columns: 1fr; }
  .pg-solucoes-seguranca .sgr-modelos__pe { flex-direction: column; align-items: flex-start; }
}

/* ---- _src/css/23-infra.css ---- */
/* ==========================================================================================================
   23-infra.css · /solucoes/infraestrutura-de-ti/ (body.pg-solucoes-infraestrutura-de-ti), frente complementar (v3, 13/10/2026)
   Mesma linguagem das páginas de solução: topo .pa-heroi, subíndice .pa-indice e as peças comuns com Data Center
   (.tema-grafite do site.css, .dci-desafio, .dci-cases, .dci-caminhos), que ficam no 21-dc-av.css. Aqui só o que é desta página.
   Sem font-family nem peso 700 em título; tamanhos pelos tokens do site.css.
   ========================================================================================================== */

/* topo: foto (cabos de rede nos switches). O véu do .pa-heroi já escurece a esquerda, onde fica o texto */
.pg-solucoes-infraestrutura-de-ti .pa-heroi .topo__fundo img { object-position: 64% 50%; }
.pg-solucoes-infraestrutura-de-ti .pa-heroi .topo__titulo { max-width: 12em; text-wrap: balance; }
.pg-solucoes-infraestrutura-de-ti .pa-heroi .topo__lead { max-width: 620px; }

/* o que entregamos: seis frentes em 3 × 2, sem numeração; um marcador no cinza da marca abre cada título */
.pg-solucoes-infraestrutura-de-ti .inf-capacidades .capacidade { padding-top: 26px; }
.pg-solucoes-infraestrutura-de-ti .inf-capacidades .capacidade h3 { display: flex; align-items: baseline; gap: 12px; margin-top: 0; }
.pg-solucoes-infraestrutura-de-ti .inf-capacidades .capacidade h3::before { content: ""; flex: none; width: 10px; height: 10px; background: var(--grafite); transform: translateY(-1px); }
.pg-solucoes-infraestrutura-de-ti .inf-capacidades .capacidade p { max-width: 30em; text-wrap: pretty; }

/* ---- _src/css/24-av-software.css ---- */
/* v3 (13/10/2026): frentes complementares Comunicação: áudio e vídeo e Software e plataformas (dono av-software).
   Classes .cx3-* compartilhadas pelas duas páginas, sempre sob a classe do <body> (.pg-solucoes-comunicacao-audio-e-video,
   .pg-solucoes-software-e-plataformas). Sem aninhamento de CSS (navegadores antigos de órgãos públicos).
   Retorno de design de 13/10: o cinza da logo (--grafite, #636363) aparece mais: faixa do desafio, fio dos cartões de
   contratação, rótulos dos cases, fundo das fotos. Laranja só como acento e no CTA final (partial global). Nenhum título em 700.
   Contrastes: branco sobre #636363 = 6,0:1; #636363 sobre branco = 6,0:1, sobre papel 5,3:1, sobre off-white 4,7:1. */

/* ---------- topo (frente complementar: altura do .topo--midia padrão, sem carimbo nem selo) ---------- */
.pg-solucoes-comunicacao-audio-e-video .cx3-topo .topo__titulo,
.pg-solucoes-software-e-plataformas .cx3-topo .topo__titulo { max-width: 13em; margin-top: 14px; }
.pg-solucoes-comunicacao-audio-e-video .cx3-topo .topo__lead,
.pg-solucoes-software-e-plataformas .cx3-topo .topo__lead { max-width: 620px; }
.pg-solucoes-comunicacao-audio-e-video .cx3-topo__rot,
.pg-solucoes-software-e-plataformas .cx3-topo__rot { color: var(--laranja-claro); }
.pg-solucoes-software-e-plataformas .cx3-topo .topo__fundo img { object-position: 38% 50%; }   /* a tela do mapa fica no recorte vertical */

/* ---------- faixa grafite (cinza da marca) ---------- */
/* tokens no .tema-grafite oficial (site.css); aqui só a largura da declaração */
/* Light sobre o cinza médio fica fino demais: a declaração vai a 400 nesta faixa */
.pg-solucoes-comunicacao-audio-e-video .cx3-grafite .declaracao,
.pg-solucoes-software-e-plataformas .cx3-grafite .declaracao { font-weight: 400; max-width: 30em; }
.pg-solucoes-comunicacao-audio-e-video .cx3-desafio__muda,
.pg-solucoes-software-e-plataformas .cx3-desafio__muda { grid-column: 4 / span 8; margin-top: 6px; max-width: 44em; font-size: var(--t-lead); line-height: 1.55; font-weight: 400; color: var(--texto-2); }

/* ---------- o que entregamos ---------- */
.pg-solucoes-comunicacao-audio-e-video .cx3-entregas .capacidade h3,
.pg-solucoes-software-e-plataformas .cx3-entregas .capacidade h3 { margin-top: 0; }
.pg-solucoes-comunicacao-audio-e-video .cx3-entregas .capacidade p,
.pg-solucoes-software-e-plataformas .cx3-entregas .capacidade p { color: var(--tinta-2); }

/* ---------- resultados ---------- */
.pg-solucoes-comunicacao-audio-e-video .cx3-cases .case__corpo,
.pg-solucoes-software-e-plataformas .cx3-cases .case__corpo { gap: 12px; }
.pg-solucoes-comunicacao-audio-e-video .cx3-cases .case p,
.pg-solucoes-software-e-plataformas .cx3-cases .case p { color: var(--tinta-2); }
.pg-solucoes-comunicacao-audio-e-video .cx3-cases .case__midia,
.pg-solucoes-software-e-plataformas .cx3-cases .case__midia { background: var(--grafite); }
.pg-solucoes-comunicacao-audio-e-video .cx3-cases .rotulo--suave,
.pg-solucoes-software-e-plataformas .cx3-cases .rotulo--suave { color: var(--grafite); }

/* ---------- como contratar ---------- */
.pg-solucoes-comunicacao-audio-e-video .cx3-modos,
.pg-solucoes-software-e-plataformas .cx3-modos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pg-solucoes-comunicacao-audio-e-video .cx3-modo,
.pg-solucoes-software-e-plataformas .cx3-modo { background: var(--painel); box-shadow: inset 0 3px 0 var(--grafite); padding: 26px 28px 30px; display: grid; gap: 10px; align-content: start; }
.pg-solucoes-comunicacao-audio-e-video .cx3-modo .rotulo,
.pg-solucoes-software-e-plataformas .cx3-modo .rotulo { color: var(--acento); }
.pg-solucoes-comunicacao-audio-e-video .cx3-modo .rotulo span,
.pg-solucoes-software-e-plataformas .cx3-modo .rotulo span { color: var(--grafite); }
.pg-solucoes-comunicacao-audio-e-video .cx3-modo h3,
.pg-solucoes-software-e-plataformas .cx3-modo h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.24; }
.pg-solucoes-comunicacao-audio-e-video .cx3-modo p:not(.rotulo),
.pg-solucoes-software-e-plataformas .cx3-modo p:not(.rotulo) { font-size: 15.5px; line-height: 1.55; color: var(--tinta-2); max-width: 34em; }
.pg-solucoes-comunicacao-audio-e-video .cx3-modos__pe,
.pg-solucoes-software-e-plataformas .cx3-modos__pe { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 32px; }
.pg-solucoes-comunicacao-audio-e-video .cx3-modos__pe .nota,
.pg-solucoes-software-e-plataformas .cx3-modos__pe .nota { max-width: 46em; }

/* ---------- Software: bloco do itBuzz ---------- */
.pg-solucoes-software-e-plataformas .cx3-itbuzz { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 24px; align-items: center; margin-bottom: clamp(40px, 5vw, 72px); background: var(--painel); }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__foto { grid-column: 1 / span 6; margin: 0; }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__foto .midia { aspect-ratio: 16 / 10; background: var(--grafite); }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo { grid-column: 7 / span 6; display: grid; gap: 14px; justify-items: start; padding: clamp(24px, 3vw, 40px) clamp(24px, 3vw, 40px) clamp(24px, 3vw, 40px) 0; }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo > .rotulo { color: var(--acento); }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo h3 { font-size: var(--t-h2); font-weight: 300; line-height: 1.1; letter-spacing: -.014em; }
.pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo p:not(.rotulo):not(.case__selo) { font-size: var(--t-lead); line-height: 1.55; color: var(--tinta-2); max-width: 30em; }
.pg-solucoes-software-e-plataformas .cx3-itbuzz .case__selo { border-color: var(--grafite); color: var(--tinta-2); }

@media (max-width: 760px) {
  .pg-solucoes-comunicacao-audio-e-video .cx3-desafio__muda,
  .pg-solucoes-software-e-plataformas .cx3-desafio__muda { grid-column: 1 / -1; }
  .pg-solucoes-comunicacao-audio-e-video .cx3-modos,
  .pg-solucoes-software-e-plataformas .cx3-modos { grid-template-columns: 1fr; }
  .pg-solucoes-comunicacao-audio-e-video .cx3-modo,
  .pg-solucoes-software-e-plataformas .cx3-modo { padding: 22px 20px 24px; }
  .pg-solucoes-software-e-plataformas .cx3-itbuzz__foto,
  .pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo { grid-column: 1 / -1; }
  .pg-solucoes-software-e-plataformas .cx3-itbuzz__corpo { padding: 0 20px 26px; }
}

/* ==========================================================================================================
   v3.1 (13/10/2026, BASE §12 item 6): /solucoes/comunicacao-audio-e-video/ volta ao formato da v2 (commit 1eff510).
   A página volta a ter o invólucro div.pg-av; as regras abaixo são as da v2 (antes no 21-dc-av.css, removidas de lá
   na v3), sob o prefixo .pg-av. As regras .cx3-* com o prefixo da página de AV acima ficam sem uso (a v2 não usa .cx3-*)
   e seguem valendo para Software e plataformas. Ajustes da v3.1: carimbo do topo sem a linha "Prancha" (3 colunas),
   bloco curto de atas em um cartão só, sem o parágrafo de fabricantes (o partial fabricantes-av faz esse papel).
   ========================================================================================================== */
/* ajustes sobre o bloco compartilhado .pa-heroi (00-global.css) */
.pg-av .pa-heroi .topo__titulo { max-width: 12em; text-wrap: balance; }
.pg-av .pa-heroi .topo__lead { max-width: 620px; }
.pg-av .pa-heroi__carimbo { grid-template-columns: 1.2fr 1.5fr 1.7fr; }
/* o <picture> do herói troca a foto do TRT-17 pelo estúdio do CFM na MQ_VERTICAL do build.py
   ("(max-width: 760px), (orientation: portrait) and (max-width: 1100px)"): o selo .d/.m troca junto */
@media (orientation: portrait) and (max-width: 1100px) {
  .pg-av .pa-heroi__cftv .midia__selo .d { display: none; }
  .pg-av .pa-heroi__cftv .midia__selo .m { display: inline; }
}
@media (max-width: 760px) {
  .pg-av .pa-heroi__carimbo { grid-template-columns: 1fr 1fr; }
  .pg-av .pa-heroi__carimbo > div:last-child { grid-column: 1 / -1; }
}
/* ficha técnica discreta (dado em segundo plano) e link no meio do texto */
.pg-av .dca-ficha { margin-top: 24px; padding-top: 12px; border-top: 1px solid var(--fio); }
.pg-av .dca-ficha .rotulo { color: var(--texto-3); }
.pg-av .dca-ficha ul { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 2px 1.2em; overflow: hidden; font-size: 13.5px; line-height: 1.5; color: var(--texto-2); }
.pg-av .dca-ficha li { position: relative; }
.pg-av .dca-ficha li + li::before { content: "·"; position: absolute; left: -.75em; color: var(--texto-3); }
.pg-av .pa-inline { color: var(--acento); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.pg-av .pa-inline:hover { text-decoration-thickness: 2px; }

.pg-av .pa-heroi .topo__fundo img { object-position: 62% 56%; }

.pg-av .pav-intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: clamp(28px, 3vw, 44px); }
.pg-av .pav-intro p { grid-column: 4 / span 6; }
.pg-av .pav-quem { margin-top: clamp(72px, 8vw, 120px); }
.pg-av .pav-quem .capacidade h3 { font-size: var(--t-h3); }

/* projetos recentes: CADE, CFM e MPGO em três colunas, fotos pequenas em formato de card (nunca esticadas) */
.pg-av .pav-rec { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 32px); }
.pg-av .pav-rec__item { display: flex; flex-direction: column; border-top: 2px solid var(--fio-forte); padding-top: 16px; }
.pg-av .pav-rec__foto .midia { aspect-ratio: 4 / 5; }
.pg-av .pav-rec__foto .legenda { font-size: 12px; }
.pg-av .pav-rec__corpo { display: flex; flex-direction: column; gap: 12px; padding-top: 20px; flex: 1; }
.pg-av .pav-rec__rot { color: var(--acento); }
.pg-av .pav-rec__corpo h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.25; letter-spacing: -.01em; text-wrap: balance; }
.pg-av .pav-rec__corpo > p:not(.rotulo):not(.case__selo) { font-size: 15.5px; line-height: 1.55; color: var(--texto-2); text-wrap: pretty; }
.pg-av .pav-rec__corpo .dca-ficha { margin-top: 2px; }
.pg-av .pav-rec__corpo .case__selo { margin-top: 2px; line-height: 1.35; }
.pg-av .pav-rec__lnk { align-self: flex-start; margin-top: auto; }

.pg-av .pav-amb { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; margin-bottom: clamp(44px, 5vw, 72px); }
.pg-av .pav-amb figure { display: flex; flex-direction: column; }
.pg-av .pav-amb .midia { flex: 1; }
.pg-av .pav-amb__larga .midia { aspect-ratio: 16 / 10; flex: none; }
.pg-av .pav-amb__alta .midia { aspect-ratio: auto; min-height: 0; }
.pg-av .pav-amb__alta img { object-position: 50% 55%; }
.pg-av .capacidades--9 .capacidade .rotulo { font-size: 12.5px; }

.pg-av .desenho--elev { grid-template-columns: 300px minmax(0, 1fr); }
.pg-av .desenho--elev .desenho__tela { padding: 46px 18px 40px; }
.pg-av .pav-mic circle { fill: #3a3a37; stroke: #8f8e88; stroke-width: .8; transition: fill .35s ease, stroke .35s ease; transition-delay: calc(var(--i) * 26ms + .5s); }
.pg-av .desenho.is-in .pav-mic circle { fill: var(--laranja); stroke: var(--laranja); }
.no-js .pg-av .pav-mic circle { fill: var(--laranja); stroke: var(--laranja); }
.pg-av .pav-legenda { margin-top: 24px; max-width: 760px; }

.pg-av .pav-console-grade { margin-top: clamp(72px, 8vw, 112px); align-items: stretch; }
.pg-av .pav-console-grade .av-foto { height: 100%; display: flex; flex-direction: column; }
.pg-av .pav-console-grade .av-foto__quadro { flex: 1; display: flex; }
.pg-av .pav-console-grade .av-foto__quadro > .midia { flex: 1; aspect-ratio: 4 / 3; }
.pg-av .pav-console { width: min(400px, 56%); }
.pg-av .mapa-assentos text { font-size: 11px; }
.pg-av .pav-console__selo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 10px 14px 12px; border-top: 1px solid rgba(255, 255, 255, .1); font-family: var(--mono); font-size: 11.5px; letter-spacing: .04em; line-height: 1.4; color: rgba(241, 240, 235, .62); }
.pg-av .pav-sessao { display: flex; flex-direction: column; gap: 22px; }
.pg-av .pav-sessao h3 { font-size: calc(var(--t-h2) * .88); font-weight: 300; line-height: 1.16; letter-spacing: -.016em; text-wrap: balance; }   /* h3: um degrau abaixo do H2 da seção */
.pg-av .pav-sessao ol { border-top: 1px solid var(--fio); counter-reset: s; }
.pg-av .pav-sessao li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--fio); }
.pg-av .pav-sessao li::before { counter-increment: s; content: counter(s, decimal-leading-zero); font-family: var(--mono); font-size: 13px; letter-spacing: .06em; color: var(--acento); padding-top: 3px; }
.pg-av .pav-sessao li b { display: block; font-weight: 500; font-size: 17px; line-height: 1.3; }
.pg-av .pav-sessao li span { display: block; font-size: 15px; line-height: 1.5; color: var(--texto-2); margin-top: 2px; }

.pg-av .pav-case-trt .case__midia img { object-position: 50% 96%; }
.pg-av .pav-mais .pav-case-trt { grid-column: span 6; grid-row: span 2; }
/* com o TRT ocupando 2 linhas da grade, a foto em 16/10 esticava TJMS e Setor privado e deixava um vão dentro das
   molduras. Em 21/9 o cartão do TRT baixa e os da direita esticam menos; o 96% mantém os faders no quadro (revisão C, vis-b-11) */
@media (min-width: 1081px) {
  .pg-av .pav-case-trt .case__midia { aspect-ratio: 21 / 9; }
}
.pg-av .pav-mais > .case:not(.pav-case-trt) { grid-column: span 6; }
.pg-av #cases .case p { text-wrap: pretty; }

/* bloco curto de atas (briefing, etapa 4): um cartão só, sem listar atas, com o botão para o formulário */
.pg-av .pav-atas { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 760px; gap: 16px; margin-top: clamp(32px, 4vw, 48px); }
.pg-av .pav-ata { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; border: 1px solid var(--fio); border-left: 3px solid var(--laranja); background: var(--painel); }
.pg-av .pav-ata__rot { color: var(--acento); }
.pg-av .pav-ata h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.25; letter-spacing: -.01em; }
.pg-av .pav-ata p:not(.rotulo) { font-size: 15px; line-height: 1.55; color: var(--texto-2); }
.pg-av .pav-ata__acoes { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: auto; padding-top: 6px; }
.pg-av .pav-atas + .contratar__nota { margin-top: clamp(24px, 3vw, 36px); }


.pg-av .pav-faq-grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
.pg-av .pav-faq-grade .faq { grid-column: 4 / span 9; }

@media (max-width: 1240px) {
  .pg-av .desenho--elev { grid-template-columns: 260px minmax(0, 1fr); }
  .pg-av .pav-sessao h3 { font-weight: 400; }
}
@media (max-width: 1080px) {
  .pg-av .pav-intro p { grid-column: 1 / span 9; }
  .pg-av .pav-rec { grid-template-columns: 1fr; gap: 28px; }
  .pg-av .pav-rec__item { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 28px; }
  .pg-av .pav-rec__corpo { padding-top: 0; }
  .pg-av .desenho--elev { grid-template-columns: 1fr; }
  .pg-av .pav-faq-grade .faq { grid-column: 1 / -1; }
  .pg-av .pav-console-grade .av-foto { height: auto; }
  .pg-av .pav-mais .pav-case-trt { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-width: 760px) {
  .pg-av .pav-intro p { grid-column: 1 / -1; }
  .pg-av .pav-rec__item { display: flex; }
  .pg-av .pav-rec__foto .midia { aspect-ratio: 4 / 3; }
  .pg-av .pav-rec__corpo { padding-top: 16px; }
  .pg-av .pav-amb { grid-template-columns: 1fr; }
  .pg-av .pav-amb__alta .midia { aspect-ratio: 4 / 3; flex: none; }
  .pg-av .desenho--elev .desenho__tela { padding: 40px 6px 0; }
  .pg-av .desenho--elev .desenho__tela .chamada text { font-size: 18px; }   /* ≈ 11,5 px na tela com o scale(1.9) (vis-b-09) */
  .pg-av .pav-console { width: 100%; }
  .pg-av .mapa-assentos text { font-size: 13px; }
  .pg-av .pav-console-grade .av-foto__quadro { display: block; }
  .pg-av .pav-console-grade .av-foto__quadro > .midia { aspect-ratio: 4 / 3; }
  .pg-av .pav-sessao { order: -1; }
  .pg-av .pav-sessao h3 { font-weight: 400; }
  .pg-av .capacidade { padding-top: 18px; padding-bottom: 20px; }
  .pg-av .capacidade h3 { font-size: 19px; margin: 6px 0 6px; }
  .pg-av .capacidade p { font-size: 15px; }
  .pg-av .pav-mais > .case:not(.pav-case-trt) { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .pg-av .pav-mic circle { fill: var(--laranja); stroke: var(--laranja); }
}

/* ---- _src/css/30-cases.css ---- */
/* ===========================================================================
   Frente CASES (v3, 13/10/2026): lista /cases/ (prefixo .csl) e páginas de case (prefixo .cs).
   Só tokens e classes do site.css; nunca peso 700 em título.
   v3: sem ficha técnica, sem esquemas, sem legenda de CFTV. O cinza da marca (--grafite) aparece mais: faixa de resultado,
   topo sem foto, cartões de texto da lista e "próximo case". Sobre o grafite, texto branco (contraste ≥ 4,5:1);
   o laranja fica só nos detalhes gráficos (bolinha e haste do .cab), nunca em texto sobre o cinza.
   =========================================================================== */

/* ============================================================ tema local: cinza da marca (grafite #636363) */
.cs-faixa, .cs-topo--texto, .csl-texto {
  --fundo: var(--grafite); --texto: var(--branco); --texto-2: rgba(255, 255, 255, .92); --texto-3: rgba(255, 255, 255, .88);
  --fio: rgba(255, 255, 255, .3); --fio-2: rgba(255, 255, 255, .14); --fio-forte: var(--branco);
  --acento: var(--branco); --acento-forte: var(--branco); --painel: rgba(20, 20, 19, .18); --painel-2: rgba(20, 20, 19, .26);
  --btn-fundo: var(--branco); --btn-texto: var(--tinta); --btn-hover: var(--papel);
  background: var(--fundo); color: var(--texto);
}

/* ============================================================ CASE: topo */
.cs-topo .topo__titulo { max-width: 15em; font-weight: 400; text-wrap: balance; }
.cs-topo .topo__lead { max-width: 600px; text-wrap: pretty; }
.cs-topo .topo__titulo + .topo__lead { margin-top: 20px; }
.cs-topo__rot { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 16px; color: rgba(241, 240, 235, .86); }
.cs-topo__rot span { display: inline-flex; align-items: center; gap: 14px; }
.cs-topo__rot span:first-child { color: var(--laranja-claro); }
.cs-topo__rot span + span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--laranja); }
/* variante tela (vídeo ou foto em tela cheia) */
.cs-topo.topo--midia { min-height: clamp(560px, 82vh, 820px); padding-bottom: clamp(40px, 5vw, 64px); }
.cs-topo.topo--midia .cs-topo__txt { max-width: 700px; }
.cs-topo.topo--midia::after { background: linear-gradient(90deg, rgba(10, 10, 9, .9) 0%, rgba(10, 10, 9, .78) 38%, rgba(10, 10, 9, .3) 64%, rgba(10, 10, 9, .06) 84%), linear-gradient(0deg, rgba(10, 10, 9, .8), rgba(10, 10, 9, 0) 50%), linear-gradient(180deg, rgba(10, 10, 9, .55), rgba(10, 10, 9, 0) 26%); }
/* variante quadro: grafite escuro da marca (--tinta-2), sem a trama de prancha; foto emoldurada */
.cs-topo.cs-topo--quadro { --fundo: var(--tinta-2); --acento: var(--claro); --texto-3: rgba(241, 240, 235, .78); background: var(--fundo); }
.cs-topo--quadro .cs-topo__rot span:first-child, .cs-topo--texto .cs-topo__rot span:first-child { color: var(--claro); }
.cs-topo__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 40px; align-items: end; }
.cs-topo--quadro .cs-topo__txt { grid-column: 1 / span 6; padding-bottom: 4px; }
.cs-quadro { grid-column: 7 / span 6; margin: 0; }
.cs-quadro__tela { position: relative; background: var(--carvao); }
.cs-quadro__tela .midia { border: 0; }
.cs-quadro .legenda { margin-top: 10px; }
/* foto em retrato de baixa resolução (CADE): no máximo o tamanho de origem, alinhada à direita */
.cs-quadro--retrato { justify-self: end; width: 100%; max-width: 340px; }
.cs-topo__grade--57 .cs-topo__txt { grid-column: 1 / span 5; }
.cs-topo__grade--57 .cs-quadro { grid-column: 6 / span 7; }
.cs-topo__grade--75 .cs-topo__txt { grid-column: 1 / span 7; }
.cs-topo__grade--75 .cs-quadro { grid-column: 8 / span 5; }
/* variante texto (sem foto própria, ex.: Igarapé): só o texto, sobre o cinza da marca */
.cs-topo--texto { padding-bottom: clamp(56px, 7vw, 104px); }
.cs-topo--texto .cs-topo__txt { max-width: 760px; }
.cs-topo--texto .cs-topo__rot { color: var(--texto-2); }
.cs-topo--texto .topo__lead { color: var(--texto-2); }
/* legenda de foto no topo: local e crédito (sem linguagem de câmera) */
.cs-topo__leg { position: absolute; z-index: 3; right: var(--gut); bottom: clamp(40px, 5vw, 64px); max-width: 360px; margin: 0; padding: 7px 11px 6px; background: rgba(12, 12, 11, .82); font-size: 12.5px; letter-spacing: .02em; line-height: 1.4; color: var(--claro); }
.cs-topo__cred { display: block; color: rgba(241, 240, 235, .78); }
.cs-credito { position: absolute; z-index: 2; right: 0; bottom: 0; padding: 4px 8px 3px; background: rgba(12, 12, 11, .82); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--claro); }
.cs-nobr { white-space: nowrap; }

/* ============================================================ CASE: a história (três tempos) */
.cs-hist__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 40px; align-items: start; }
.cs-hist__txt { grid-column: 4 / span 5; display: grid; gap: 30px; }
.cs-hist__fig { grid-column: 9 / span 4; margin: 0; position: sticky; top: calc(var(--hdr-h) + 24px); }
.cs-hist__grade--sem-fig .cs-hist__txt { grid-column: 4 / span 9; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--col-gap); }
.cs-passo { padding-top: 16px; border-top: 1px solid var(--fio); }
.cs-passo:first-child { border-top-color: var(--fio-forte); }
/* o entregável (último tempo) fecha a história com o fio no cinza da marca */
.cs-passo:last-child { border-top: 2px solid var(--grafite); }
.cs-passo__t { font-size: var(--t-rotulo); line-height: 1.4; letter-spacing: .07em; text-transform: uppercase; font-weight: 500; color: var(--acento); margin-bottom: 10px; }
.cs-passo:last-child .cs-passo__t { color: var(--grafite); }
.cs-passo p { font-size: var(--t-lead); line-height: 1.6; color: var(--texto-2); text-wrap: pretty; }
.cs-passo:first-child p, .cs-passo:last-child p { color: var(--texto); }

/* ============================================================ CASE: resultado (faixa no cinza da marca) */
.cs-result { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; align-items: stretch; }
.cs-result__kpis { grid-column: 4 / span 9; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); }
.cs-result--premio .cs-result__kpis { grid-column: 1 / span 5; grid-template-columns: 1fr; }
.cs-result__kpis .kpi:last-child { border-right: 0; }
.cs-result__kpis .kpi__rotulo { max-width: 20em; }
.cs-result__premio { grid-column: 6 / span 7; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); background: var(--painel); }
.cs-result__premio .midia { min-height: 100%; aspect-ratio: auto; }
.cs-result__premio > div { padding: 24px 26px 26px; display: flex; flex-direction: column; gap: 14px; }
.cs-result__premio h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.3; }

/* ============================================================ CASE: galeria */
.cs-galeria .galeria { row-gap: 28px; }
.cs-galeria .legenda b { color: var(--texto-2); }
.cs-galeria .galeria figure { margin: 0; }

/* ============================================================ CASE: fim (soluções usadas e próximo case) */
.cs-fim__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 0; align-items: start; }
.cs-fim__cab { grid-column: 1 / span 4; display: grid; gap: 14px; align-content: start; justify-items: start; padding-top: 16px; }
.cs-fim__cab .rotulo { color: var(--texto-3); }
.cs-sol { grid-column: 5 / span 8; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--col-gap); border-top: 2px solid var(--fio-forte); margin-bottom: clamp(48px, 6vw, 80px); }
.cs-sol a { display: grid; grid-template-columns: minmax(0, 1fr) 20px; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--fio); transition: padding .3s var(--ease); }
.cs-sol a:hover { padding-left: 8px; }
.cs-sol strong { display: block; font-size: var(--t-h3); font-weight: 500; line-height: 1.25; }
.cs-sol small { display: block; font-size: 14px; color: var(--texto-3); margin-top: 2px; }
/* próximo case no cinza da marca; no hover, o grafite escuro */
.cs-proximo { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); background: var(--grafite); color: var(--branco); overflow: hidden; position: relative; transition: background .3s; }
.cs-proximo:hover { background: var(--tinta-2); }
.cs-proximo--sem-midia { grid-template-columns: minmax(0, 1fr); }
.cs-proximo__midia { position: relative; min-height: 340px; overflow: hidden; background: var(--carvao); }
.cs-proximo__midia > picture, .cs-proximo__midia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.cs-proximo:hover .cs-proximo__midia img { transform: scale(1.035); }
.cs-proximo__corpo { padding: clamp(24px, 3vw, 40px); display: flex; flex-direction: column; gap: 14px; }
.cs-proximo--sem-midia .cs-proximo__corpo { min-height: 260px; }
.cs-proximo__corpo .rotulo { color: var(--branco); }
.cs-proximo__lugar { font-size: var(--t-rotulo); font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: rgba(255, 255, 255, .9); }
.cs-proximo h3 { font-size: var(--t-declaracao); font-weight: 300; line-height: 1.22; max-width: 15em; text-wrap: balance; }
.cs-proximo .lnk { margin-top: auto; align-self: flex-start; color: var(--branco); }
.cs-proximo:hover .lnk { text-decoration: underline; text-underline-offset: 4px; }
/* foto em retrato de baixa resolução (CADE): inteira, no tamanho de origem */
.cs-proximo__midia--retrato > picture img { object-fit: contain; }
.cs-proximo:hover .cs-proximo__midia--retrato img { transform: none; }

/* ============================================================ LISTA /cases/ */
.csl-topo__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 28px; align-items: end; }
.csl-topo__tit { grid-column: 1 / span 7; }
.csl-topo__tit .topo__titulo { max-width: 13em; font-weight: 300; text-wrap: balance; margin-top: 14px; }
.csl-topo__lado { grid-column: 9 / span 4; padding-bottom: 6px; }
.csl-topo__lado .topo__lead { margin-top: 0; text-wrap: pretty; }
.csl-topo__lado .acoes { margin-top: 26px; }
/* filtro pelas 6 frentes: principais, depois as complementares (separadas por um fio) */
.csl-filtro { display: grid; gap: 10px; padding-bottom: 20px; margin-bottom: 28px; border-bottom: 1px solid var(--fio); }
.csl-filtro > .rotulo { color: var(--texto-3); }
.csl-filtro .chips { margin: 0; }
.csl-chip--comp { position: relative; margin-left: 14px; }
.csl-chip--comp::before { content: ""; position: absolute; left: -11px; top: 18%; bottom: 18%; width: 1px; background: var(--fio); }
/* grade: 1 destaque + 2 ao lado, depois 3 por linha */
.csl-cases .case--xl { grid-column: span 8; grid-row: span 2; }
.csl-cases .case--xl .case__midia { flex: 1 1 auto; aspect-ratio: auto; min-height: 360px; }
.csl-cases .case--xl .case__corpo { flex: none; }
.csl-cases .case--lado { grid-column: span 4; }
.csl-cases .case--lado .case__midia { flex: 1 1 auto; aspect-ratio: auto; min-height: 210px; }
.csl-cases .case--m { grid-column: span 4; }
.csl-cases .case--m .case__midia { aspect-ratio: 16 / 10; }
.csl-cases .case__num small { font-size: .34em; font-weight: 400; letter-spacing: 0; margin-left: .18em; vertical-align: baseline; }
.csl-pre { display: inline-block; width: min-content; margin: .2em .35em 0 0; font-size: .3em; font-weight: 400; letter-spacing: 0; line-height: 1.1; vertical-align: top; }
.csl-cases h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.28; text-wrap: balance; }
.csl-cases .case--xl h3 { font-size: var(--t-declaracao); font-weight: 300; line-height: 1.2; }
.csl-cases .case__corpo > p:not(.case__num):not(.case__unid):not(.csl-sol) { text-wrap: pretty; }
.csl-loc { color: var(--acento); }
.csl-cases .case p.csl-sol { font-size: var(--t-rotulo); line-height: 1.4; letter-spacing: .07em; font-weight: 500; color: var(--texto-3); }
.csl-cases h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.csl-cases h3 a:focus-visible { outline: none; }
.csl-cases .case:has(h3 a:focus-visible) { outline: 2px solid var(--laranja); outline-offset: 3px; }
.csl-cases .case:hover h3 a { color: var(--acento); }
.csl-cases .case__mais { margin-top: auto; align-self: flex-start; }
.csl-credito { position: absolute; z-index: 2; right: 0; bottom: 0; padding: 4px 8px 3px; background: rgba(12, 12, 11, .82); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--claro); }
.csl-cade img { object-position: 50% 24%; }
.csl-xl__corpo { display: grid; gap: 12px; }
/* cartões de texto no cinza da marca (Anápolis: resultado com a fonte; Igarapé: sem foto própria) */
.csl-cases .csl-texto .case__corpo { padding: 24px 24px 24px; gap: 12px; }
.csl-cases .csl-texto .case__num { color: var(--branco); }
.csl-cases .csl-texto .case__unid { color: var(--texto-2); max-width: 22em; }
.csl-cases .csl-texto h3 { margin-top: 6px; }
.csl-cases .csl-texto .case__mais { color: var(--branco); }
.csl-cases .csl-texto:hover h3 a { color: var(--branco); text-decoration: underline; text-underline-offset: 4px; }
.csl-fonte { font-size: 14px !important; color: var(--texto-3) !important; }
.csl-cases .csl-texto .case__corpo > .csl-sol { margin-top: auto; }
/* faixa de texto na largura toda (TJGO, sem foto própria): número à esquerda, título à direita; com filtro ou no celular, vira cartão comum */
.csl-cases .csl-faixa { grid-column: 1 / -1; }
.csl-cases .csl-faixa .case__corpo { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--col-gap); align-items: end; padding: 28px 28px 30px; }
.csl-faixa__num, .csl-faixa__txt { display: grid; gap: 10px; align-content: end; }
.csl-cases .csl-faixa h3 { margin-top: 0; font-size: var(--t-declaracao); font-weight: 300; line-height: 1.2; max-width: 18em; }
.csl-cases .csl-faixa .case__unid { max-width: 24em; }
.csl-cases.is-filtrado .csl-faixa .case__corpo { display: flex; flex-direction: column; gap: 12px; padding: 24px; }
.csl-cases.is-filtrado .csl-faixa h3 { font-size: var(--t-h3); font-weight: 500; }
.csl-vazio { grid-column: 1 / -1; padding: 28px 24px; border: 1px dashed var(--fio); color: var(--texto-2); font-size: 16px; }
/* com filtro ativo, todos os cartões do mesmo tamanho */
.csl-cases.is-filtrado .case { grid-column: span 4; grid-row: auto; }
.csl-cases.is-filtrado .case__midia { flex: none; aspect-ratio: 16 / 10; min-height: 0; }
.csl-cases.is-filtrado .case--xl .case__corpo { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; }
.csl-cases.is-filtrado .case.case--xl .case__num { font-size: inherit; }
.csl-cases.is-filtrado .case--xl h3 { font-size: var(--t-h3); font-weight: 500; }
/* outros projetos */
.csl-mais h2 { font-size: var(--t-h3); font-weight: 500; grid-column: 1 / span 3; }
.csl-mais .tabela td:nth-child(3) { font-size: var(--t-rotulo); font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: var(--texto-3); }
.csl-mais .csl-anon { display: block; margin-top: 4px; font-size: 13px; letter-spacing: 0; color: var(--texto-3); font-weight: 400; }
.csl-mais .nota, .csl-mais .acoes { grid-column: 4 / span 9; }
/* perguntas */
.csl-faq { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
.csl-faq .faq { grid-column: 4 / span 9; }

/* ============================================================ responsivo */
@media (max-width: 1080px) {
  .cs-topo--quadro .cs-topo__txt, .cs-quadro, .cs-topo__grade--57 .cs-topo__txt, .cs-topo__grade--57 .cs-quadro, .cs-topo__grade--75 .cs-topo__txt, .cs-topo__grade--75 .cs-quadro { grid-column: 1 / -1; }
  .cs-topo__grade--75 .cs-quadro { max-width: 560px; }
  .cs-quadro--retrato { justify-self: start; max-width: 300px; }
  .cs-hist__txt { grid-column: 1 / span 7; }
  .cs-hist__fig { grid-column: 8 / span 5; }
  .cs-hist__grade--sem-fig .cs-hist__txt { grid-column: 1 / -1; }
  .cs-result__kpis, .cs-result--premio .cs-result__kpis, .cs-result__premio { grid-column: 1 / -1; }
  .cs-fim__cab { grid-column: 1 / -1; padding-top: 0; margin-bottom: 18px; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; }
  .cs-sol { grid-column: 1 / -1; }
  .csl-topo__tit, .csl-topo__lado { grid-column: 1 / -1; }
  .csl-topo__lado .topo__lead { max-width: 640px; }
  .csl-cases .case--xl { grid-column: 1 / -1; grid-row: auto; }
  .csl-cases .case--xl .case__midia { flex: none; aspect-ratio: 16 / 9; min-height: 0; }
  .csl-cases .case--lado, .csl-cases .case--m { grid-column: span 6; }
  .csl-cases .case--lado .case__midia { flex: none; aspect-ratio: 16 / 10; min-height: 0; }
  .csl-cases.is-filtrado .case { grid-column: span 6; }
  .csl-mais .nota, .csl-mais .acoes { grid-column: 1 / -1; }
  .csl-faq .faq { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .cs-topo .topo__lead { margin-top: 16px; }
  .cs-topo .acoes { margin-top: 22px; }
  .cs-topo .acoes .btn { width: 100%; }
  .cs-topo.topo--midia { min-height: max(600px, 90svh); padding-top: calc(var(--hdr-h) + 150px); }
  .cs-topo__leg { top: calc(var(--hdr-h) + 12px); bottom: auto; left: var(--gut); right: auto; max-width: calc(100% - var(--gut) * 2); font-size: 11.5px; }
  /* celular: o texto começa por volta de 35% da altura; o véu escurece antes disso para o rótulo e o título não brigarem com a foto */
  .cs-topo.topo--midia::after { background: linear-gradient(180deg, rgba(10, 10, 9, .72) 0%, rgba(10, 10, 9, .36) 16%, rgba(10, 10, 9, .86) 28%, rgba(10, 10, 9, .92) 48%, rgba(10, 10, 9, .96) 100%); }
  /* rótulo do topo em duas linhas, sem a bolinha virar marcador no começo da linha (vis-c-10) */
  .cs-topo__rot { flex-direction: column; align-items: flex-start; gap: 2px; }
  .cs-topo__rot span + span::before { display: none; }
  .cs-hist__txt, .cs-hist__fig { grid-column: 1 / -1; }
  .cs-hist__fig { position: static; }
  .cs-hist__grade--sem-fig .cs-hist__txt { grid-template-columns: 1fr; }
  .cs-hist__txt { gap: 24px; }
  .cs-result__kpis { grid-template-columns: 1fr 1fr; }
  .cs-result__premio { grid-template-columns: 1fr; }
  .cs-result__premio .midia { aspect-ratio: 3 / 2; min-height: 0; }
  .cs-galeria .galeria { row-gap: 20px; }
  .cs-proximo { grid-template-columns: 1fr; }
  .cs-proximo__midia { min-height: 0; aspect-ratio: 16 / 10; }
  .cs-sol { grid-template-columns: 1fr; }
  .csl-topo__lado .acoes .btn { width: 100%; }
  .csl-filtro .chip { font-size: 13.5px; padding: 7px 10px; }
  .csl-chip--comp { margin-left: 0; }
  .csl-chip--comp::before { display: none; }
  .csl-cases .case--lado, .csl-cases .case--m, .csl-cases.is-filtrado .case { grid-column: 1 / -1; }
  .csl-cases .csl-faixa .case__corpo { display: flex; flex-direction: column; gap: 12px; padding: 24px; }
  .csl-cases .csl-faixa h3 { font-size: var(--t-h3); font-weight: 500; }
  .csl-cases .case--xl .case__corpo { display: flex; flex-direction: column; gap: 10px; padding: 20px 18px 22px; }
  .csl-cases .case--xl h3 { font-size: var(--t-h3); font-weight: 500; }
  .csl-mais h2 { grid-column: 1 / -1; }
  .csl .tabela--nomes tbody tr:nth-child(n+5) { display: grid; }
  .csl .tabela--nomes td:nth-child(3) { display: block; grid-column: 1 / -1; padding-top: 4px; }
  .csl .tabela--nomes td:nth-child(4) { padding-top: 2px; }
  /* topo com a foto inteira no alto e o texto embaixo, sobre fundo sólido (Paraíso do Tocantins: vis-c-07).
     --foto-h: altura da foto abaixo do cabeçalho; --foto-txt: onde o texto começa (na parte de baixo da foto, já escurecida) */
  .cs-topo--foto-topo.topo--midia { min-height: 0; padding-top: calc(var(--hdr-h) + var(--foto-txt)); background: #0a0a09; }
  .cs-topo--foto-topo .topo__fundo { bottom: auto; height: calc(var(--hdr-h) + var(--foto-h)); }
  .cs-topo--foto-topo .topo__fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 10, 9, .6) 0, rgba(10, 10, 9, 0) 22%, rgba(10, 10, 9, 0) 64%, rgba(10, 10, 9, .85) 84%, #0a0a09 100%); }
  .cs-topo--foto-topo.topo--midia::after { display: none; }
}
@media (max-width: 400px) { .cs-topo .btn, .csl-topo .btn, .csl .btn { white-space: normal; max-width: 100%; } }

/* ============================================================ CASE CURTO (v4, 14/10/2026; BASE §12.18): gerado de _gerador/curtos/*.json
   Reusa o topo de texto (.cs-topo--texto), a história (.cs-hist, três tempos: o problema → o que entregamos → o resultado) e o fim
   (.cs-fim). Só o que é novo: "02 · Em resumo" (fatos em duas colunas e, quando há, as cidades do projeto) e a foto em retrato. */
.cs-hist__fig--retrato { max-width: 380px; }
.cs-resumo__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 44px; }
.cs-fatos { grid-column: 4 / span 9; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--col-gap); border-top: 2px solid var(--fio-forte); }
.cs-fatos li { position: relative; padding: 16px 0 18px 26px; border-bottom: 1px solid var(--fio); font-size: 16.5px; line-height: 1.5; color: var(--texto-2); text-wrap: pretty; }
.cs-fatos li::before { content: ""; position: absolute; left: 0; top: 27px; width: 12px; height: 2px; background: var(--laranja); }
.cs-cidades { grid-column: 4 / span 9; }
.cs-cidades > .rotulo { display: block; margin-bottom: 14px; color: var(--texto-3); }
.cs-cidades__lista { list-style: none; margin: 0; padding: 0; columns: 3; column-gap: var(--col-gap); font-size: 15.5px; line-height: 1.5; color: var(--texto-2); }
.cs-cidades__lista li { break-inside: avoid; padding: 5px 0; border-bottom: 1px solid var(--fio); }
@media (max-width: 1080px) {
  .cs-fatos, .cs-cidades { grid-column: 1 / -1; }
  .cs-cidades__lista { columns: 2; }
}
@media (max-width: 760px) {
  .cs-hist__fig--retrato { max-width: 100%; }
  .cs-fatos { grid-template-columns: 1fr; }
  .cs-cidades__lista { columns: 1; }
}

/* ---- _src/css/31-eace.css ---- */
/* ===========================================================================
   Case único do Projeto EACE (/cases/eace-escolas-conectadas/), rodada v4 (14/10/2026). Dono "eace".
   Prefixo .pg-cases-eace-escolas-conectadas .ea-*; o topo, a história, o fim e o "próximo case" vêm do 30-cases.css (.cs-*).
   Só tokens do site.css; nenhum título em 700; cantos retos; laranja só como acento (faixa de escala no off-white, não em laranja sólido).
   =========================================================================== */

/* ---------- faixa de escala: quatro números (escolas, municípios, estados, meses) */
.pg-cases-eace-escolas-conectadas .ea-faixa { padding-top: clamp(28px, 3.5vw, 48px); padding-bottom: clamp(28px, 3.5vw, 48px); }
.pg-cases-eace-escolas-conectadas .ea-faixa__kpis { border-top-color: var(--fio-forte); }
.pg-cases-eace-escolas-conectadas .ea-faixa .kpi__rotulo { max-width: 16em; }

/* ---------- a história: o cab ganha um lead mais largo (o programa em três linhas) */
.pg-cases-eace-escolas-conectadas .cs-hist .cab__lead { max-width: 760px; }

/* ---------- mapa do Brasil com DF, GO, PR e RS em destaque (SVG inline, caminhos do assets/js/mapa-uf.js) */
.pg-cases-eace-escolas-conectadas .ea-mapa { margin: 0; }
.pg-cases-eace-escolas-conectadas .ea-mapa__svg { display: block; width: 100%; height: auto; max-width: 420px; }
.pg-cases-eace-escolas-conectadas .ea-mapa__svg path { fill: #D3D2CA; stroke: var(--fundo); stroke-width: 2; stroke-linejoin: round; }
.pg-cases-eace-escolas-conectadas .ea-mapa__svg path.is-on { fill: var(--laranja); }
.pg-cases-eace-escolas-conectadas .ea-mapa .legenda { margin-top: 12px; max-width: 420px; }

/* ---------- 02 em cada escola: quatro etapas numeradas (rótulo só numérico ganha rotulo--num pelo build) */
.pg-cases-eace-escolas-conectadas .ea-etapas__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 28px; border-top: 2px solid var(--fio-forte); }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista li { position: relative; padding: 18px 24px 8px 0; border-right: 1px solid var(--fio); }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista li + li { padding-left: 24px; }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista li:last-child { border-right: 0; padding-right: 0; }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista li::before { content: ""; position: absolute; left: 0; top: -2px; width: 28px; height: 3px; background: var(--laranja); }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista li + li::before { left: 24px; }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista .rotulo { color: var(--acento); }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista h3 { margin-top: 12px; font-size: var(--t-h3); font-weight: 500; line-height: 1.25; text-wrap: balance; }
.pg-cases-eace-escolas-conectadas .ea-etapas__lista p { margin-top: 10px; font-size: 16.5px; line-height: 1.55; color: var(--texto-2); text-wrap: pretty; }

/* ---------- 03 os 63 municípios por estado: grade compacta, nomes em linha separados por um ponto laranja */
.pg-cases-eace-escolas-conectadas .ea-ufs .cab__lead { max-width: 640px; }
.pg-cases-eace-escolas-conectadas .ea-ufs__grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px clamp(24px, 4vw, 64px); align-items: start; }
.pg-cases-eace-escolas-conectadas .ea-uf { position: relative; padding-top: 14px; border-top: 1px solid var(--fio-forte); }
.pg-cases-eace-escolas-conectadas .ea-uf::before { content: ""; position: absolute; left: 0; top: -2px; width: 28px; height: 3px; background: var(--laranja); }
.pg-cases-eace-escolas-conectadas .ea-uf__t { display: flex; align-items: baseline; gap: 10px; font-size: var(--t-h3); font-weight: 500; line-height: 1.25; letter-spacing: -.005em; }
.pg-cases-eace-escolas-conectadas .ea-uf__sigla { font-size: var(--t-rotulo); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--grafite); }
.pg-cases-eace-escolas-conectadas .ea-uf__n { margin-top: 6px; }
.pg-cases-eace-escolas-conectadas .ea-uf__lista { margin: 10px 0 0; padding: 0; list-style: none; display: inline; }
.pg-cases-eace-escolas-conectadas .ea-uf__lista li { display: inline; white-space: nowrap; font-size: 16.5px; font-weight: 400; line-height: 1.7; color: var(--texto); }
.pg-cases-eace-escolas-conectadas .ea-uf__lista li:not(:last-child)::after { content: "·"; margin: 0 .1em 0 .4em; color: var(--laranja); font-weight: 500; }
.pg-cases-eace-escolas-conectadas .ea-ufs__pe { margin-top: 28px; max-width: 760px; }

/* ---------- fim: com uma só solução, a grade de soluções e o mapa de atuação dividem a linha */
.pg-cases-eace-escolas-conectadas .cs-sol strong { text-wrap: balance; }

@media (max-width: 1080px) {
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:nth-child(2n) { border-right: 0; padding-right: 0; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:nth-child(2n+1) { padding-left: 0; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:nth-child(2n+1)::before { left: 0; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:nth-child(n+3) { border-top: 1px solid var(--fio); }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:nth-child(n+3)::before { display: none; }
  .pg-cases-eace-escolas-conectadas .ea-mapa { position: static; }
  .pg-cases-eace-escolas-conectadas .ea-mapa__svg { max-width: 360px; }
}
@media (max-width: 760px) {
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista { grid-template-columns: 1fr; row-gap: 0; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li, .pg-cases-eace-escolas-conectadas .ea-etapas__lista li + li { padding: 16px 0 20px; border-right: 0; border-top: 1px solid var(--fio); }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:first-child { border-top: 0; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li::before, .pg-cases-eace-escolas-conectadas .ea-etapas__lista li + li::before { display: none; }
  .pg-cases-eace-escolas-conectadas .ea-etapas__lista li:first-child::before { display: block; left: 0; }
  .pg-cases-eace-escolas-conectadas .ea-ufs__grade { grid-template-columns: 1fr; gap: 26px; }
  .pg-cases-eace-escolas-conectadas .ea-uf__lista li { font-size: 16px; }
  .pg-cases-eace-escolas-conectadas .ea-mapa__svg { max-width: 300px; }
  .pg-cases-eace-escolas-conectadas .ea-faixa .kpi__rotulo { max-width: none; }
}

/* ---- _src/css/40-empresa.css ---- */
/* =============================================================================
   Frente EMPRESA (v2): /sobre-nos/, /mapa-de-atuacao/, /como-contratar/,
   /pesquisa-desenvolvimento-e-inovacao/ e /trabalhe-conosco/.
   Tudo prefixado pela classe da página (.pg-…). Sem font-family literal e sem
   tamanho grande fixo: títulos e destaques usam os tokens do site.css
   (--t-h2, --t-h3, --t-declaracao, --t-lead), que a frente global ajusta.
   Os estilos que antes ficavam em <style> dentro de cada página moraram aqui.
   ========================================================================== */

/* ---------------------------------------------------------------- comuns */
/* v3 (retorno de design 13/10/2026): o cinza da logo (--grafite, #636363) mais presente. Bloco em grafite com
   texto branco (6,0:1; secundário .86 = 4,9:1). Laranja aqui só como fio decorativo: laranja sobre o grafite
   não passa o contraste de texto. Conferência final: tokens e anel de foco no .tema-grafite oficial do site.css. */
.pg-sobre-nos .faq__resp a, .pg-mapa-de-atuacao .faq__resp a, .pg-como-contratar .faq__resp a,
.pg-pesquisa-desenvolvimento-e-inovacao .faq__resp a, .pg-trabalhe-conosco .faq__resp a { color: var(--acento); text-decoration: underline; text-underline-offset: 3px; }
.pg-sobre-nos .em-faq, .pg-mapa-de-atuacao .em-faq, .pg-como-contratar .em-faq,
.pg-pesquisa-desenvolvimento-e-inovacao .em-faq, .pg-trabalhe-conosco .em-faq { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
.pg-sobre-nos .em-faq .faq, .pg-mapa-de-atuacao .em-faq .faq, .pg-como-contratar .em-faq .faq,
.pg-pesquisa-desenvolvimento-e-inovacao .em-faq .faq, .pg-trabalhe-conosco .em-faq .faq { grid-column: 4 / span 9; }
@media (max-width: 1080px) {
  .pg-sobre-nos .em-faq .faq, .pg-mapa-de-atuacao .em-faq .faq, .pg-como-contratar .em-faq .faq,
  .pg-pesquisa-desenvolvimento-e-inovacao .em-faq .faq, .pg-trabalhe-conosco .em-faq .faq { grid-column: 1 / -1; }
}
@media (max-width: 400px) {
  .pg-sobre-nos .btn, .pg-mapa-de-atuacao .btn, .pg-como-contratar .btn,
  .pg-pesquisa-desenvolvimento-e-inovacao .btn, .pg-trabalhe-conosco .btn { white-space: normal; max-width: 100%; }
}

/* =============================================================================
   /sobre-nos/
   ========================================================================== */
.pg-sobre-nos .sn-topo .topo__lead { margin-top: 18px; max-width: 620px; }
/* rótulo sobre o vídeo: laranja mais claro que o --laranja-claro para passar de 4,5:1 nos quadros claros do vídeo (tec-b-contraste-02) */
.pg-sobre-nos .sn-topo > .wrap > .rotulo { color: #FF8F66; margin-top: 28px; }
.pg-sobre-nos .sn-topo::after { background: linear-gradient(90deg, rgba(10, 10, 9, .88) 0%, rgba(10, 10, 9, .72) 40%, rgba(10, 10, 9, .3) 72%, rgba(10, 10, 9, .12) 100%), linear-gradient(0deg, rgba(10, 10, 9, .55), rgba(10, 10, 9, 0) 50%); }

.pg-sobre-nos .sn-meta { display: flex; flex-direction: column; gap: 6px; }
.pg-sobre-nos .sn-meta .rotulo:first-child { color: var(--acento); }
.pg-sobre-nos .sn-meta .rotulo + .rotulo { color: var(--texto-3); }

/* 01 · quem somos */
.pg-sobre-nos .sn-quem { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: clamp(36px, 4vw, 56px); }
.pg-sobre-nos .sn-quem .lead { grid-column: 4 / span 6; }
.pg-sobre-nos .sn-frentes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));   /* v3.1: quatro frentes principais (BASE §12.6) */
  border-top: 2px solid var(--fio-forte); margin-top: clamp(44px, 5vw, 72px); }
.pg-sobre-nos .sn-frentes a { position: relative; display: grid; grid-template-rows: auto auto 1fr auto; gap: 8px; height: 100%; min-height: 176px; padding: 18px 22px 22px 0; border-right: 1px solid var(--fio); }
.pg-sobre-nos .sn-frentes li + li a { padding-left: 22px; }
.pg-sobre-nos .sn-frentes li:last-child a { border-right: 0; }
.pg-sobre-nos .sn-frentes a::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 2px; background: var(--laranja); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.pg-sobre-nos .sn-frentes a:hover::before, .pg-sobre-nos .sn-frentes a:focus-visible::before { transform: scaleX(1); }
.pg-sobre-nos .sn-frentes .rotulo { color: var(--acento); }
.pg-sobre-nos .sn-frentes h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.18; letter-spacing: -.01em; }
.pg-sobre-nos .sn-frentes small { font-size: 14px; line-height: 1.4; color: var(--texto-3); }
.pg-sobre-nos .sn-frentes .ic-seta { align-self: end; color: var(--acento); }

/* v3: frentes complementares ("Também entregamos"), menores, abaixo das principais */
.pg-sobre-nos .sn-comp { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 32px; padding: 18px 0; border-bottom: 1px solid var(--fio); }
.pg-sobre-nos .sn-comp > .rotulo { color: var(--texto-3); }
.pg-sobre-nos .sn-comp ul { display: flex; flex-wrap: wrap; gap: 10px 32px; }
.pg-sobre-nos .sn-comp a { display: inline-flex; align-items: center; gap: 8px; font-size: 16.5px; font-weight: 500; color: var(--texto); }
.pg-sobre-nos .sn-comp a .ic-seta { color: var(--acento); }
.pg-sobre-nos .sn-comp a:hover, .pg-sobre-nos .sn-comp a:focus-visible { color: var(--acento); }

/* v3.1 · Escala: os 5 números da BASE §12.1 e a lista de cidades que acompanha o +60 (§12.1/§12.2). Texto branco 500 do tema laranja. */
.pg-sobre-nos .sn-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pg-sobre-nos .sn-kpis .kpi__valor { font-size: min(var(--t-num), 4.4vw, 68px); }
.pg-sobre-nos .sn-cid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); column-gap: var(--col-gap); row-gap: 12px; align-items: baseline; padding: 24px 0 28px; border-top: 1px solid var(--fio); }
.pg-sobre-nos .cid-compacta { display: flex; flex-wrap: wrap; row-gap: 4px; font-size: 16px; line-height: 1.55; }
.pg-sobre-nos .cid-compacta li { white-space: nowrap; }
.pg-sobre-nos .cid-compacta li:not(:last-child)::after { content: "·"; margin: 0 .55em; }
.pg-sobre-nos .cid-compacta__uf { font-size: .86em; }
.pg-sobre-nos .sn-cid__mapa { display: inline-flex; align-items: center; gap: 8px; text-decoration: underline; text-underline-offset: 4px; }
/* v4 (BASE §12.17): frase de escala dos municípios entre os 5 números e a lista de cidades (texto em Light, branco do tema laranja) */
.pg-sobre-nos .sn-escala__frase { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 28px; padding: 22px 0 24px; }
.pg-sobre-nos .sn-escala__frase > span { font-size: clamp(22px, 2vw, 30px); font-weight: 300; line-height: 1.25; letter-spacing: -.015em; }

/* 02 · como trabalhamos (usa o .ciclo do sistema) */
.pg-sobre-nos .sn-ciclo { margin-top: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pg-sobre-nos .sn-ciclo li { display: flex; flex-direction: column; padding-right: 20px; }
.pg-sobre-nos .sn-ciclo .midia { aspect-ratio: 4 / 5; margin-bottom: 18px; }

/* 03 · história: linha do tempo em capítulos */
.pg-sobre-nos .sn-linha { position: relative; border-top: 1px solid var(--fio); }
.pg-sobre-nos .sn-linha::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc((100% + var(--col-gap)) * 5 / 12); width: 1px; background: var(--fio); }
.pg-sobre-nos .sn-cap { --cap-pad: clamp(30px, 3.4vw, 48px); position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding: var(--cap-pad) 0; border-bottom: 1px solid var(--fio); }
.pg-sobre-nos .sn-cap::after { content: ""; position: absolute; left: calc((100% + var(--col-gap)) * 5 / 12 - 6px); top: calc(var(--cap-pad) + 8px); width: 13px; height: 13px; box-sizing: border-box; border-radius: 50%; border: 2px solid var(--laranja); background: var(--fundo); }
.pg-sobre-nos .sn-cap:last-child::after { background: var(--laranja); }
.pg-sobre-nos .sn-cap__anos { grid-column: 1 / span 4; display: grid; gap: 10px; align-content: start; }
.pg-sobre-nos .sn-cap__anos b { font-size: var(--t-h2); font-weight: 300; line-height: 1; letter-spacing: -.025em; font-variant-numeric: tabular-nums lining-nums; color: var(--texto); }
.pg-sobre-nos .sn-cap__anos .rotulo { color: var(--texto-3); }
.pg-sobre-nos .sn-cap__corpo { grid-column: 6 / span 6; display: grid; gap: 12px; align-content: start; padding-left: clamp(24px, 2.4vw, 40px); }
.pg-sobre-nos .sn-cap h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.22; letter-spacing: -.01em; }
.pg-sobre-nos .sn-cap p { font-size: 16.5px; line-height: 1.62; color: var(--texto-2); max-width: 36em; }
.pg-sobre-nos .sn-fecho { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding-top: clamp(36px, 4vw, 60px); }
.pg-sobre-nos .sn-fecho > div { grid-column: 6 / span 7; display: grid; gap: 14px; padding-left: clamp(24px, 2.4vw, 40px); }
.pg-sobre-nos .sn-fecho p:first-child { font-size: var(--t-lead); line-height: 1.5; color: var(--texto-2); max-width: 34em; }

/* 04 · marca, missão e visão */
.pg-sobre-nos .sn-dir { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px clamp(32px, 5vw, 96px); align-items: start; }
.pg-sobre-nos .sn-marca { display: grid; gap: 22px; }
.pg-sobre-nos .sn-marca .simb-tec { max-width: 400px; }
.pg-sobre-nos .sn-marca h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.25; letter-spacing: -.01em; max-width: 18em; }
.pg-sobre-nos .sn-marca p { font-size: 16px; line-height: 1.6; color: var(--texto-2); max-width: 440px; }
.pg-sobre-nos .sn-marca .sn-ass { padding-top: 14px; border-top: 1px solid var(--fio); color: var(--texto-3); }
.pg-sobre-nos .sn-mvv { border-top: 2px solid var(--fio-forte); }
.pg-sobre-nos .sn-mvv > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 8px 24px; padding: 26px 0 30px; border-bottom: 1px solid var(--fio); }
.pg-sobre-nos .sn-mvv dt { padding-top: 8px; color: var(--acento); }
.pg-sobre-nos .sn-mvv dd { font-size: var(--t-declaracao); line-height: 1.22; letter-spacing: -.015em; font-weight: 300; }

/* 04 · valores INOTEC (v3: dentro da Direção, um parágrafo curto por valor) */
.pg-sobre-nos .sn-val { margin-top: clamp(48px, 5vw, 80px); }
.pg-sobre-nos .sn-val__cab { display: flex; justify-content: space-between; align-items: baseline; gap: 10px 24px; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 2px solid var(--fio-forte); }
.pg-sobre-nos .sn-val__cab h3 { font-size: var(--t-h3); font-weight: 500; letter-spacing: -.01em; }
.pg-sobre-nos .sn-val__cab .rotulo { color: var(--texto-3); }
.pg-sobre-nos .sn-val__lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(28px, 3vw, 48px); }
.pg-sobre-nos .sn-val__lista li { display: grid; gap: 6px; align-content: start; padding: 20px 0 22px; border-bottom: 1px solid var(--fio); }
.pg-sobre-nos .sn-val__lista b { display: flex; align-items: baseline; gap: 10px; font-size: 18px; font-weight: 500; letter-spacing: -.01em; }
.pg-sobre-nos .sn-val__lista b .rotulo { flex: none; width: 18px; color: var(--acento); }
.pg-sobre-nos .sn-val__lista li > span { padding-left: 28px; font-size: 15.5px; line-height: 1.55; color: var(--texto-2); }

/* 05 · estrutura */
.pg-sobre-nos .sn-estr { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px clamp(32px, 5vw, 96px); align-items: start; }
.pg-sobre-nos .sn-estr .midia { aspect-ratio: 890 / 905; }
.pg-sobre-nos .sn-estr__txt .titulo-sec { margin: 14px 0 20px; }
.pg-sobre-nos .sn-estr__txt > p { font-size: 17px; line-height: 1.6; color: var(--texto-2); max-width: 600px; }
.pg-sobre-nos .sn-escr { margin-top: 32px; border-top: 2px solid var(--fio-forte); }
.pg-sobre-nos .sn-escr li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 6px 24px; padding: 18px 0; border-bottom: 1px solid var(--fio); }
.pg-sobre-nos .sn-escr .rotulo { padding-top: 4px; color: var(--texto-3); }
.pg-sobre-nos .sn-escr li:first-child .rotulo { color: var(--acento); }
.pg-sobre-nos .sn-escr h3 { font-size: 20px; font-weight: 500; letter-spacing: -.01em; line-height: 1.25; }
.pg-sobre-nos .sn-escr address { font-size: 15px; line-height: 1.5; color: var(--texto-2); margin-top: 2px; }
.pg-sobre-nos .sn-atend { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px 32px; margin-top: 28px; }
.pg-sobre-nos .sn-atend__tel { display: grid; gap: 4px; }
.pg-sobre-nos .sn-atend__tel .rotulo { color: var(--texto-3); }
.pg-sobre-nos .sn-atend__tel a { font-size: var(--t-h2); font-weight: 300; letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.pg-sobre-nos .sn-atend .acoes { gap: 12px 28px; }

/* 06 · Tecnautas */
.pg-sobre-nos .sn-pessoas { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 40px clamp(32px, 5vw, 80px); align-items: end; }
.pg-sobre-nos .sn-pessoas__txt { display: grid; gap: 20px; padding-bottom: 8px; }
.pg-sobre-nos .sn-pessoas__txt p { font-size: 17px; line-height: 1.6; color: var(--texto-2); }
.pg-sobre-nos .sn-pessoas .midia { aspect-ratio: 2 / 1; }

/* 07 · prêmios */
.pg-sobre-nos .sn-qp { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 44px; border-top: 2px solid var(--fio-forte); }
.pg-sobre-nos .sn-qp > li { position: relative; display: grid; grid-template-rows: auto 1fr; gap: 18px; padding: 24px 0 6px; }
.pg-sobre-nos .sn-qp > li + li::before { content: ""; position: absolute; left: -22px; top: 0; bottom: 0; border-left: 1px solid var(--fio); }
.pg-sobre-nos .sn-qp__foto { position: relative; height: clamp(280px, 25vw, 370px); overflow: hidden; background: var(--painel-2); }
.pg-sobre-nos .sn-qp__foto picture { display: block; width: 100%; height: 100%; }
.pg-sobre-nos .sn-qp__foto img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.pg-sobre-nos .sn-qp > li:hover .sn-qp__foto img { transform: scale(1.03); }
.pg-sobre-nos .sn-qp__foto--alto img { object-position: 50% 32%; }
.pg-sobre-nos .sn-qp__foto--doc img { object-position: 50% 0; }
.pg-sobre-nos .sn-qp__txt { display: grid; gap: 6px; align-content: start; }
.pg-sobre-nos .sn-qp .ano { color: var(--acento); }
.pg-sobre-nos .sn-qp h3 { font-size: 19px; font-weight: 500; line-height: 1.3; letter-spacing: -.01em; }
.pg-sobre-nos .sn-qp p { font-size: 14.5px; line-height: 1.5; color: var(--texto-2); }
.pg-sobre-nos .sn-qp .rotulo:last-child { color: var(--texto-3); margin-top: 4px; }

/* 09 · integridade */
.pg-sobre-nos .sn-integ { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px clamp(32px, 6vw, 112px); align-items: end; }
.pg-sobre-nos .sn-integ .titulo-sec { margin-top: 14px; }
.pg-sobre-nos .sn-integ p { font-size: 17px; line-height: 1.6; color: var(--texto-2); max-width: 560px; }
.pg-sobre-nos .sn-integ .acoes { margin-top: 24px; }

@media (max-width: 1080px) {
  .pg-sobre-nos .sn-frentes { grid-template-columns: 1fr 1fr; }
  .pg-sobre-nos .sn-frentes li:nth-child(2n) a { border-right: 0; }
  .pg-sobre-nos .sn-frentes li:nth-child(2n+1) a { padding-left: 0; }
  .pg-sobre-nos .sn-frentes li:nth-child(n+3) a { border-top: 1px solid var(--fio); }
  .pg-sobre-nos .sn-kpis .kpi { padding-right: 12px; }
  .pg-sobre-nos .sn-kpis .kpi + .kpi { padding-left: 12px; }
  .pg-sobre-nos .sn-kpis .kpi__rotulo { font-size: 15.5px; }
  .pg-sobre-nos .sn-quem .lead { grid-column: 1 / -1; max-width: 640px; }
  .pg-sobre-nos .sn-val__lista { grid-template-columns: 1fr 1fr; }
  .pg-sobre-nos .sn-ciclo { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 36px; }
  .pg-sobre-nos .sn-ciclo::before, .pg-sobre-nos .sn-ciclo::after { display: none; }
  .pg-sobre-nos .sn-ciclo li { padding-top: 0; }
  .pg-sobre-nos .sn-ciclo li::before { display: none; }
  .pg-sobre-nos .sn-linha::before { left: 0; }
  .pg-sobre-nos .sn-cap__anos { grid-column: 1 / -1; padding-left: clamp(24px, 2.4vw, 40px); margin-bottom: 14px; }
  .pg-sobre-nos .sn-cap__corpo { grid-column: 1 / -1; }
  .pg-sobre-nos .sn-cap::after { left: -6px; top: calc(var(--cap-pad) + 4px); }
  .pg-sobre-nos .sn-fecho > div { grid-column: 1 / -1; }
  .pg-sobre-nos .sn-dir, .pg-sobre-nos .sn-estr, .pg-sobre-nos .sn-pessoas, .pg-sobre-nos .sn-integ { grid-template-columns: 1fr; }
  .pg-sobre-nos .sn-estr .midia { aspect-ratio: 16 / 10; }
  .pg-sobre-nos .sn-qp { grid-template-columns: 1fr 1fr; }
  .pg-sobre-nos .sn-qp > li { padding: 24px 0 28px; }
  .pg-sobre-nos .sn-qp > li:nth-child(odd)::before { display: none; }
  .pg-sobre-nos .sn-qp > li:nth-child(n+3) { border-top: 1px solid var(--fio); }
}
@media (max-width: 760px) {
  .pg-sobre-nos .sn-topo::after { background: linear-gradient(0deg, rgba(10, 10, 9, .94) 0%, rgba(10, 10, 9, .84) 55%, rgba(10, 10, 9, .72) 100%); }
  .pg-sobre-nos .sn-topo .acoes .btn { width: 100%; }
  .pg-sobre-nos .sn-frentes { grid-template-columns: 1fr; }
  .pg-sobre-nos .sn-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-sobre-nos .sn-kpis .kpi + .kpi { padding-left: 0; }
  .pg-sobre-nos .sn-kpis .kpi:nth-child(2n) { padding-left: 14px; }
  .pg-sobre-nos .sn-kpis .kpi:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .pg-sobre-nos .sn-kpis .kpi__valor { font-size: min(var(--t-num), 12vw); }
  .pg-sobre-nos .sn-cid { grid-template-columns: 1fr; }
  .pg-sobre-nos .cid-compacta { font-size: 15px; }
  .pg-sobre-nos .sn-frentes a, .pg-sobre-nos .sn-frentes li + li a { min-height: 0; padding: 16px 0 18px; border-right: 0; grid-template-columns: 40px minmax(0, 1fr) 20px; grid-template-rows: auto auto; column-gap: 12px; }
  .pg-sobre-nos .sn-frentes li + li a { border-top: 1px solid var(--fio); }
  .pg-sobre-nos .sn-frentes .rotulo { grid-row: 1 / span 2; padding-top: 4px; }
  .pg-sobre-nos .sn-frentes small { grid-column: 2; }
  .pg-sobre-nos .sn-frentes .ic-seta { grid-column: 3; grid-row: 1 / span 2; align-self: center; }
  .pg-sobre-nos .sn-comp, .pg-sobre-nos .sn-comp ul { flex-direction: column; align-items: flex-start; }
  .pg-sobre-nos .sn-val__lista { grid-template-columns: 1fr; }
  .pg-sobre-nos .sn-ciclo { grid-template-columns: 1fr; row-gap: 0; }
  .pg-sobre-nos .sn-ciclo::before, .pg-sobre-nos .sn-ciclo::after { display: block; }
  .pg-sobre-nos .sn-ciclo li { padding: 0 0 30px 52px; }
  .pg-sobre-nos .sn-ciclo li::before { display: block; }
  .pg-sobre-nos .sn-ciclo li:first-child::before { display: none; }
  .pg-sobre-nos .sn-ciclo .midia { aspect-ratio: 16 / 10; margin-bottom: 14px; }
  .pg-sobre-nos .sn-cap p { font-size: 16px; }
  .pg-sobre-nos .sn-mvv > div { grid-template-columns: 1fr; padding: 20px 0 24px; }
  .pg-sobre-nos .sn-mvv dt { padding-top: 0; }
  .pg-sobre-nos .sn-escr li { grid-template-columns: 1fr; }
  .pg-sobre-nos .sn-qp { grid-template-columns: 1fr; }
  .pg-sobre-nos .sn-qp > li, .pg-sobre-nos .sn-qp > li:nth-child(odd) { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto; gap: 16px; padding: 18px 0; border-top: 0; border-bottom: 1px solid var(--fio); }
  .pg-sobre-nos .sn-qp > li::before { display: none; }
  .pg-sobre-nos .sn-qp__foto { height: auto; aspect-ratio: 4 / 5; }
}

/* =============================================================================
   /mapa-de-atuacao/
   ========================================================================== */
.pg-mapa-de-atuacao .pm-topo { padding-top: clamp(32px, 4vw, 60px); padding-bottom: clamp(40px, 4vw, 64px); }
.pg-mapa-de-atuacao .pm-topo__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; align-items: center; }
.pg-mapa-de-atuacao .pm-topo__txt { grid-column: 1 / span 6; }
.pg-mapa-de-atuacao .pm-topo__txt .topo__titulo { max-width: 11em; }
.pg-mapa-de-atuacao .pm-topo__mapa { grid-column: 7 / span 6; margin: 0; }
.pg-mapa-de-atuacao .pm-topo__mapa img { width: 100%; height: auto; max-width: 640px; margin-left: auto; }
.pg-mapa-de-atuacao .pm-topo__mapa .legenda { justify-content: flex-end; }
/* v4 (BASE §12.17): SVG sem pinos + um marcador HTML por UF da lista (25), posicionado em % do mapa e ligado ao bloco do estado em #municipios */
.pg-mapa-de-atuacao .pm-mapa { position: relative; max-width: 640px; margin-left: auto; }
.pg-mapa-de-atuacao .pm-mapa img { display: block; margin: 0; max-width: none; }
.pg-mapa-de-atuacao .pm-mapa__pinos { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
.pg-mapa-de-atuacao .pm-mapa__pino { position: absolute; left: var(--x); top: var(--y); width: 12px; height: 12px; transform: translate(-50%, -50%); border-radius: 50%; background: var(--laranja); box-shadow: 0 0 0 1.2px #FFFFFF, 0 0 0 7px rgba(232, 79, 15, .22); transition: box-shadow .2s; }
.pg-mapa-de-atuacao .pm-mapa__pino::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: #FFFFFF; }
.pg-mapa-de-atuacao .pm-mapa__pino:hover, .pg-mapa-de-atuacao .pm-mapa__pino:focus-visible { box-shadow: 0 0 0 1.2px #FFFFFF, 0 0 0 10px rgba(232, 79, 15, .34); z-index: 2; }
.pg-mapa-de-atuacao .pm-mapa__pino:focus-visible { outline-offset: 10px; }
.pg-mapa-de-atuacao .pm-mapa__pino::before { content: attr(data-rotulo); position: absolute; left: 50%; bottom: calc(100% + 12px); transform: translateX(-50%); padding: 5px 9px 4px; white-space: nowrap; font-size: 12px; font-weight: 500; letter-spacing: .04em; line-height: 1.3; color: var(--claro); background: var(--tinta); opacity: 0; pointer-events: none; transition: opacity .15s; }
.pg-mapa-de-atuacao .pm-mapa__pino:hover::before, .pg-mapa-de-atuacao .pm-mapa__pino:focus-visible::before { opacity: 1; }
.pg-mapa-de-atuacao .pm-numeros { margin-top: clamp(40px, 4vw, 64px); }
.pg-mapa-de-atuacao .pm-numeros b small { font-weight: 400; }

/* 01 · cidades */
.pg-mapa-de-atuacao .pm-hist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px var(--col-gap); }
.pg-mapa-de-atuacao .pm-hist figure { display: grid; gap: 0; align-content: start; }
.pg-mapa-de-atuacao .pm-hist .midia { aspect-ratio: 4 / 3; }
.pg-mapa-de-atuacao .pm-hist__txt { display: grid; gap: 10px; padding-top: 18px; }
.pg-mapa-de-atuacao .pm-hist__txt .rotulo { color: var(--acento); }
.pg-mapa-de-atuacao .pm-hist__txt h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.22; letter-spacing: -.01em; }
.pg-mapa-de-atuacao .pm-hist__txt p { font-size: 16px; line-height: 1.6; color: var(--texto-2); }
.pg-mapa-de-atuacao .pm-hist__txt .lnk { justify-self: start; margin-top: 4px; }
.pg-mapa-de-atuacao .pm-ufs { margin-top: clamp(56px, 6vw, 96px); }
.pg-mapa-de-atuacao .pm-ufs__cab { display: flex; justify-content: space-between; align-items: baseline; gap: 12px 24px; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 2px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-ufs__cab h3 { font-size: var(--t-h3); font-weight: 500; letter-spacing: -.01em; }
/* lista única em ordem alfabética (sem títulos por estado: a UF vem discreta depois do nome) */
.pg-mapa-de-atuacao .pm-cid { columns: 4; column-gap: clamp(28px, 3.4vw, 56px); }
.pg-mapa-de-atuacao .pm-cid li { break-inside: avoid; padding: 11px 0 10px; border-bottom: 1px solid var(--fio); font-size: clamp(16px, 1.2vw, 17.5px); font-weight: 400; line-height: 1.35; letter-spacing: -.005em; }
.pg-mapa-de-atuacao .pm-cid__uf { font-size: .8em; letter-spacing: .03em; color: var(--texto-3); white-space: nowrap; }
.pg-mapa-de-atuacao .pm-cid li a { border-bottom: 1px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-cid li a:hover, .pg-mapa-de-atuacao .pm-cid li a:focus-visible { color: var(--acento); border-color: var(--acento); }
.pg-mapa-de-atuacao .pm-ufs__pe { margin-top: 16px; }


/* 02 · municípios (v4, BASE §12.17): resumo, busca e grade compacta por estado em colunas; faixa 1 (cidade inteligente) com ponto laranja */
.pg-mapa-de-atuacao .pm-mun__cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 18px 32px; padding-bottom: 18px; border-bottom: 2px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-mun__resumo { display: flex; flex-wrap: wrap; gap: 8px 40px; margin: 0; }
.pg-mapa-de-atuacao .pm-mun__resumo > div { display: grid; gap: 4px; }
.pg-mapa-de-atuacao .pm-mun__resumo dt { color: var(--texto-3); }
.pg-mapa-de-atuacao .pm-mun__resumo dd { margin: 0; font-size: clamp(34px, 3vw, 44px); font-weight: 300; line-height: 1; letter-spacing: -.025em; font-variant-numeric: tabular-nums lining-nums; }
.pg-mapa-de-atuacao .pm-mun__ferr { display: grid; gap: 12px; justify-items: end; }
.pg-mapa-de-atuacao .pm-mun__legenda { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13.5px; line-height: 1.45; color: var(--texto-3); }
.pg-mapa-de-atuacao .pm-mun__busca { display: flex; align-items: center; gap: 14px; }
.pg-mapa-de-atuacao .pm-mun__busca input { width: min(320px, 70vw); font: inherit; font-size: 15.5px; color: var(--tinta); background: var(--painel); border: 0; border-bottom: 1.5px solid var(--grafite); border-radius: 0; padding: 9px 12px 8px; appearance: none; -webkit-appearance: none; }
.pg-mapa-de-atuacao .pm-mun__busca input:focus-visible { outline: 2px solid var(--laranja); outline-offset: 0; border-bottom-color: var(--tinta); }
.pg-mapa-de-atuacao .pm-mun__busca .rotulo { white-space: nowrap; }
.pg-mapa-de-atuacao .pm-mun { margin-top: 8px; columns: 3; column-gap: clamp(28px, 3.4vw, 56px); }
.pg-mapa-de-atuacao .pm-mun__uf { break-inside: avoid; padding: 18px 0 20px; border-bottom: 1px solid var(--fio); }
.pg-mapa-de-atuacao .pm-mun__uf[hidden] { display: none; }
.pg-mapa-de-atuacao .pm-mun__uf h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -.005em; }
.pg-mapa-de-atuacao .pm-mun__uf h3 small { font-size: 12px; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: var(--texto-3); }
.pg-mapa-de-atuacao .pm-mun__uf ul { margin: 8px 0 0; padding: 0; list-style: none; }
.pg-mapa-de-atuacao .pm-mun__uf li { display: inline; font-size: 15.5px; line-height: 1.7; color: var(--texto); }
.pg-mapa-de-atuacao .pm-mun__uf li[hidden] { display: none; }
.pg-mapa-de-atuacao .pm-mun__uf li:not(:last-child)::after { content: "·"; margin: 0 .12em 0 .4em; color: var(--laranja); font-weight: 500; }
.pg-mapa-de-atuacao .pm-mun__uf li a { border-bottom: 1px solid var(--fio-forte); transition: color .2s, border-color .2s; }
.pg-mapa-de-atuacao .pm-mun__uf li a:hover, .pg-mapa-de-atuacao .pm-mun__uf li a:focus-visible { color: var(--acento); border-color: var(--acento); }
.pg-mapa-de-atuacao .pm-mun__ci { font-weight: 500; white-space: nowrap; }
.pg-mapa-de-atuacao .pm-mun__ci::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--laranja); vertical-align: .12em; }
.pg-mapa-de-atuacao .pm-mun__pe { margin-top: 20px; }

/* 03 · instituições (filtro por solução) */
.pg-mapa-de-atuacao .pm-org__filtro { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 18px; }
.pg-mapa-de-atuacao .pm-org__filtro .chips { margin: 0; }
.pg-mapa-de-atuacao .pm-org__filtro .rotulo { color: var(--texto-3); }
.pg-mapa-de-atuacao .pm-org { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 4vw, 64px); border-top: 2px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-org li { align-content: start; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 20px; align-items: baseline; padding: 16px 0 15px; border-bottom: 1px solid var(--fio); }
.pg-mapa-de-atuacao .pm-org li[hidden] { display: none; }
.pg-mapa-de-atuacao .pm-org b { font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -.005em; }
.pg-mapa-de-atuacao .pm-org__o { grid-column: 1 / -1; font-size: 15px; line-height: 1.45; color: var(--texto-2); }
.pg-mapa-de-atuacao .pm-org .rotulo { grid-column: 2; grid-row: 1; color: var(--texto-3); text-align: right; white-space: nowrap; }
.pg-mapa-de-atuacao .pm-org b a { border-bottom: 1px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-org b a:hover, .pg-mapa-de-atuacao .pm-org b a:focus-visible { color: var(--acento); border-color: var(--acento); }
.pg-mapa-de-atuacao .pm-org__filtro [data-pm-conta] { margin-left: auto; }
.pg-mapa-de-atuacao .pm-org__pe { margin-top: 16px; }

/* 03 · escritórios */
.pg-mapa-de-atuacao .pm-escr { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px clamp(32px, 6vw, 112px); align-items: start; }
.pg-mapa-de-atuacao .pm-escr__txt { display: grid; gap: 18px; }
.pg-mapa-de-atuacao .pm-escr__txt p { font-size: 17px; line-height: 1.6; color: var(--texto-2); max-width: 30em; }
.pg-mapa-de-atuacao .pm-escr ul { border-top: 2px solid var(--fio-forte); }
.pg-mapa-de-atuacao .pm-escr li { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 6px 24px; padding: 18px 0; border-bottom: 1px solid var(--fio); }
.pg-mapa-de-atuacao .pm-escr li .rotulo { padding-top: 4px; color: var(--texto-3); }
.pg-mapa-de-atuacao .pm-escr li:first-child .rotulo { color: var(--acento); }
.pg-mapa-de-atuacao .pm-escr h3 { font-size: 20px; font-weight: 500; letter-spacing: -.01em; line-height: 1.25; }
.pg-mapa-de-atuacao .pm-escr address { margin-top: 2px; font-size: 15px; line-height: 1.5; color: var(--texto-2); }

@media (max-width: 1080px) {
  .pg-mapa-de-atuacao .pm-topo__txt, .pg-mapa-de-atuacao .pm-topo__mapa { grid-column: 1 / -1; }
  .pg-mapa-de-atuacao .pm-topo__mapa img { margin: 0 auto; max-width: 560px; }
  .pg-mapa-de-atuacao .pm-mapa { margin: 0 auto; max-width: 560px; }
  .pg-mapa-de-atuacao .pm-topo__mapa .legenda { justify-content: center; }
  .pg-mapa-de-atuacao .pm-hist { grid-template-columns: 1fr 1fr; }
  .pg-mapa-de-atuacao .pm-cid { columns: 3; }
  .pg-mapa-de-atuacao .pm-mun { columns: 2; }
  .pg-mapa-de-atuacao .pm-mun__ferr { justify-items: start; }
  .pg-mapa-de-atuacao .pm-escr { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .pg-mapa-de-atuacao .pm-topo .acoes .btn { width: 100%; }
  .pg-mapa-de-atuacao .pm-hist { grid-template-columns: 1fr; }
  .pg-mapa-de-atuacao .pm-cid { columns: 2; column-gap: 20px; }
  .pg-mapa-de-atuacao .pm-cid li { font-size: 15.5px; }
  .pg-mapa-de-atuacao .pm-mun { columns: 1; }
  .pg-mapa-de-atuacao .pm-mun__resumo { gap: 8px 28px; }
  .pg-mapa-de-atuacao .pm-mun__busca { flex-wrap: wrap; gap: 8px 14px; }
  .pg-mapa-de-atuacao .pm-mun__busca input { width: 100%; }
  .pg-mapa-de-atuacao .pm-mapa__pino { width: 10px; height: 10px; box-shadow: 0 0 0 1px #FFFFFF, 0 0 0 5px rgba(232, 79, 15, .22); }
  .pg-mapa-de-atuacao .pm-mapa__pino::after { inset: 3px; }
  .pg-mapa-de-atuacao .pm-org { grid-template-columns: 1fr; }
  .pg-mapa-de-atuacao .pm-org li { grid-template-columns: 1fr; }
  .pg-mapa-de-atuacao .pm-org .rotulo { grid-column: 1; grid-row: auto; text-align: left; white-space: normal; }
  .pg-mapa-de-atuacao .pm-escr li { grid-template-columns: 1fr; }
}

/* =============================================================================
   /como-contratar/  (v3, 13/10/2026: investimento ou serviço; atas só no bloco curto)
   ========================================================================== */
.pg-como-contratar .cc-topo { padding-bottom: clamp(48px, 5vw, 80px); }
.pg-como-contratar .cc-topo .topo__titulo { max-width: 15em; }
.pg-como-contratar .cc-topo .topo__lead { max-width: 640px; }

/* 01 · dois caminhos */
.pg-como-contratar .cc-cam { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--col-gap); }
.pg-como-contratar .cc-cam__item { display: flex; flex-direction: column; gap: 16px; padding: clamp(24px, 2.6vw, 40px); background: var(--painel); border-top: 3px solid var(--grafite); scroll-margin-top: calc(var(--hdr-h) + 24px); }
.pg-como-contratar .cc-cam__sigla { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--fio); }
.pg-como-contratar .cc-cam__sigla > span:first-child { font-size: var(--t-h3); font-weight: 500; letter-spacing: -.01em; color: var(--texto); }
.pg-como-contratar .cc-cam__sigla .rotulo { color: var(--grafite); }
.pg-como-contratar .cc-cam__item h3 { font-size: var(--t-declaracao); font-weight: 400; line-height: 1.22; letter-spacing: -.015em; max-width: 20em; }
.pg-como-contratar .cc-cam__item > p:not([class]) { font-size: 16.5px; line-height: 1.6; color: var(--texto-2); max-width: 34em; }
.pg-como-contratar .cc-cam__nota { padding: 14px 16px; box-shadow: inset 3px 0 0 var(--laranja); background: var(--fundo); font-size: 15.5px; line-height: 1.55; color: var(--texto-2); }
.pg-como-contratar .cc-cam__nota b { font-weight: 500; color: var(--texto); }
.pg-como-contratar .cc-cam__item .lnk { align-self: flex-start; margin-top: auto; padding-top: 4px; }

/* setor público: faixa no cinza da logo (.tema-grafite, ver "comuns") */
.pg-como-contratar .cc-pub { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 24px clamp(32px, 5vw, 88px); margin-top: var(--col-gap); padding: clamp(24px, 2.6vw, 40px); box-shadow: inset 0 3px 0 var(--laranja); }
.pg-como-contratar .cc-pub > div { display: grid; gap: 10px; align-content: start; }
.pg-como-contratar .cc-pub p { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.5; max-width: 34em; }
.pg-como-contratar .cc-pub b { font-weight: 500; }
.pg-como-contratar .cc-pub .lnk { justify-self: start; margin-top: 4px; }

/* 02 · comparativo (critério na linha, um caminho por coluna) */
.pg-como-contratar .cc-comp thead th:nth-child(n+2) { color: var(--texto); }
.pg-como-contratar .cc-comp tbody th { width: 28%; padding: 16px 24px 16px 0; border-bottom: 1px solid var(--fio); vertical-align: top; text-align: left; text-transform: none; letter-spacing: -.005em; font-size: 16.5px; font-weight: 500; line-height: 1.4; color: var(--texto); }
.pg-como-contratar .cc-comp td { width: 36%; padding-top: 16px; padding-bottom: 16px; font-size: 16px; line-height: 1.5; }
.pg-como-contratar .cc-comp__pe { margin-top: 16px; }

/* 03 · atas (bloco curto) */
.pg-como-contratar .cc-atas { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px clamp(32px, 6vw, 112px); align-items: end; }
.pg-como-contratar .cc-atas .titulo-sec { margin-top: 14px; }
.pg-como-contratar .cc-atas p { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.55; color: var(--texto-2); max-width: 34em; }
.pg-como-contratar .cc-atas .acoes { margin-top: 22px; }

@media (max-width: 1080px) {
  .pg-como-contratar .cc-pub, .pg-como-contratar .cc-atas { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .pg-como-contratar .cc-topo .acoes .btn, .pg-como-contratar .cc-atas .acoes .btn { width: 100%; }
  .pg-como-contratar .cc-cam { grid-template-columns: 1fr; }
  .pg-como-contratar .cc-comp tbody th { width: auto; padding: 0 0 8px; border: 0; }
  .pg-como-contratar .cc-comp td { width: auto; padding: 4px 0; }
  .pg-como-contratar .cc-comp td[data-rot] { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; }
  .pg-como-contratar .cc-comp td[data-rot]::before { content: attr(data-rot); padding-top: 3px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); }
}

/* =============================================================================
   /pesquisa-desenvolvimento-e-inovacao/
   ========================================================================== */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo { padding-bottom: clamp(56px, 6vw, 96px); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo__grade { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 44px clamp(32px, 5vw, 88px); align-items: center; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo .topo__titulo { margin-top: 14px; max-width: 11em; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo .topo__lead { max-width: 560px; }

/* tela do produto em moldura de janela */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela { position: relative; background: var(--branco); border: 1px solid var(--fio); box-shadow: 12px 12px 0 -1px var(--painel-2), 12px 12px 0 0 var(--fio); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__barra { display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border-bottom: 1px solid var(--fio); background: #ECEBE5; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__barra i { width: 9px; height: 9px; border-radius: 50%; border: 1px solid rgba(20, 20, 19, .35); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__barra span { margin-left: 10px; color: var(--texto-3); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__img { position: relative; aspect-ratio: 1280 / 700; overflow: hidden; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__img picture, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__pe { display: flex; justify-content: space-between; gap: 6px 16px; flex-wrap: wrap; padding: 10px 14px; border-top: 1px solid var(--fio); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__pe .rotulo { color: var(--texto-3); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela__pe .rotulo:first-child { color: var(--acento); }

/* 01 · laço do método: o .ciclo do sistema na ida e a volta tracejada pelo campo */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco { position: relative; padding-top: 36px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-ciclo { margin-top: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-bottom: 64px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-ciclo li { padding-right: clamp(16px, 3.4vw, 64px); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-ciclo h3 { font-size: var(--t-h3); margin: 10px 0; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-ciclo p { font-size: 16px; max-width: 26em; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot { position: absolute; top: 0; color: var(--texto-3); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--ini { left: 0; color: var(--acento); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--fim { right: 0; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--volta { top: auto; bottom: -8px; left: 50%; transform: translateX(-50%); padding: 0 16px; background: var(--fundo); white-space: nowrap; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__fim { position: absolute; right: -13px; top: 39px; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--tinta); background: radial-gradient(circle, var(--tinta) 0 4px, transparent 4.5px), var(--fundo); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta { position: absolute; left: -32px; right: -32px; top: 52px; bottom: 0; border: 2px dashed var(--laranja); border-top: 0; pointer-events: none; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta::before, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta::after { content: ""; position: absolute; top: -1px; border-top: 2px dashed var(--laranja); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta::before { left: 0; width: 30px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta::after { right: 0; width: 18px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__seta { position: absolute; left: -15px; top: 46px; width: 10px; height: 10px; border-top: 2px solid var(--laranja); border-right: 2px solid var(--laranja); transform: rotate(45deg); }

/* 02 · produto itBuzz */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 40px; align-items: start; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt { grid-column: 1 / span 5; }
/* títulos dos produtos (h3) abaixo dos H2 da página, como na home; peso 300 nunca abaixo de 24 px */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt .prancha__titulo { font-size: max(24px, calc(var(--t-h2) * .88)); line-height: 1.12; letter-spacing: -.01em; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt .prancha__titulo small { display: block; margin-top: 14px; color: var(--laranja-claro); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt .prova { margin-top: 28px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt .acoes { margin-top: 28px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__midia { grid-column: 7 / span 6; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-par { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: stretch; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-par__tela { aspect-ratio: 1280 / 1505; background: #fff; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-par__tela img { object-position: top center; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-par__foto { aspect-ratio: auto; min-height: 100%; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-par__foto img { object-position: 50% 30%; }



/* v3: ligação com a frente Software e plataformas (itWise e itHey saíram do site) */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-sw { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 40px; margin-top: clamp(40px, 4vw, 64px); padding-top: 24px; border-top: 1px solid var(--fio); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-sw p { max-width: 46em; font-size: 17px; line-height: 1.6; color: var(--texto-2); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-sw b { font-weight: 500; color: var(--texto); }
.pg-pesquisa-desenvolvimento-e-inovacao #metodo .cab__lead a { color: var(--acento); text-decoration: underline; text-underline-offset: 3px; }

/* 03 · reconhecimento */
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 40px; align-items: start; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__video { grid-column: 1 / span 4; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__video .midia { max-height: 680px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__lista { grid-column: 6 / span 7; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios { border-top: 2px solid var(--fio-forte); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios li { display: grid; grid-template-columns: 132px minmax(0, 1fr) auto; gap: 8px 28px; align-items: start; padding: 26px 0 28px; border-bottom: 1px solid var(--fio); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios__data { padding-top: 6px; color: var(--acento); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios h3 { font-size: var(--t-h3); font-weight: 500; line-height: 1.2; letter-spacing: -.01em; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios p { margin-top: 10px; font-size: 16px; line-height: 1.55; color: var(--texto-2); max-width: 34em; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios .rotulo { display: block; margin-top: 12px; color: var(--texto-3); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios__doc { width: 104px; padding: 6px; background: var(--branco); border: 1px solid var(--fio); }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios__doc img { display: block; width: 100%; height: auto; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__telao { margin-top: 28px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__telao .midia { aspect-ratio: 1500 / 560; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__telao img { object-position: 50% 70%; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__pe { margin-top: 22px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px 28px; }
.pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__pe p { font-size: 16px; line-height: 1.55; color: var(--texto-2); max-width: 36em; }


@media (max-width: 1080px) {
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo__grade { grid-template-columns: 1fr; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela { max-width: 720px; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__txt, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-prod__midia { grid-column: 1 / -1; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__video { grid-column: 1 / span 5; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__lista { grid-column: 6 / span 7; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios li { grid-template-columns: minmax(0, 1fr) auto; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios__data { grid-column: 1 / -1; padding-top: 0; }
}
@media (max-width: 860px) {
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__video, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__lista { grid-column: 1 / -1; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-rec__video { max-width: 320px; }
}
@media (max-width: 760px) {
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco { padding-top: 0; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-ciclo { grid-template-columns: 1fr; padding-bottom: 0; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--ini, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--fim, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__fim, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__volta, .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__seta { display: none; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-laco__rot--volta { position: static; transform: none; padding: 6px 0 0 52px; background: none; white-space: normal; color: var(--acento); }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-topo .acoes .btn { width: 100%; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-tela { box-shadow: none; }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios li { grid-template-columns: minmax(0, 1fr); }
  .pg-pesquisa-desenvolvimento-e-inovacao .pdi-premios__doc { width: 88px; }
}

/* =============================================================================
   /trabalhe-conosco/
   ========================================================================== */
.pg-trabalhe-conosco .tc-topo__lead { margin-top: 22px; max-width: 30em; font-size: var(--t-declaracao); line-height: 1.25; letter-spacing: -.012em; font-weight: 400; color: var(--claro); }   /* sobre vídeo: 400 (VEREDITO) */
.pg-trabalhe-conosco .tc-topo::after { background: linear-gradient(90deg, rgba(10, 10, 9, .9) 0%, rgba(10, 10, 9, .72) 38%, rgba(10, 10, 9, .28) 70%, rgba(10, 10, 9, .1) 100%), linear-gradient(0deg, rgba(10, 10, 9, .6), rgba(10, 10, 9, 0) 50%); }
.pg-trabalhe-conosco .tc-topo .topo__titulo { max-width: 13em; }
/* rótulo sobre o vídeo (tec-b-contraste-02) */
.pg-trabalhe-conosco .tc-topo > .wrap > .rotulo { color: #FF8F66; margin-top: 28px; }

/* 01 · o trabalho */
.pg-trabalhe-conosco .tc-lead { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: clamp(32px, 4vw, 56px); }
.pg-trabalhe-conosco .tc-lead .lead { grid-column: 4 / span 7; }
.pg-trabalhe-conosco .tc-tri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: clamp(48px, 6vw, 88px); }
.pg-trabalhe-conosco .tc-tri figure { display: grid; gap: 0; align-content: start; }
.pg-trabalhe-conosco .tc-tri .midia { aspect-ratio: 4 / 5; }
.pg-trabalhe-conosco .tc-tri__onde { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; padding: 14px 0 0; border-top: 2px solid var(--fio-forte); margin-top: 14px; }
.pg-trabalhe-conosco .tc-tri__onde b { font-size: var(--t-h3); font-weight: 400; letter-spacing: -.01em; line-height: 1.15; }
.pg-trabalhe-conosco .tc-tri__onde .rotulo { color: var(--texto-3); text-align: right; }
.pg-trabalhe-conosco .tc-tri__cred { flex-basis: 100%; text-align: right; font-size: 12px; letter-spacing: .04em; color: var(--texto-3); }

/* 02 · fórmula da marca */
.pg-trabalhe-conosco .tc-formula { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 28px; align-items: end; }
.pg-trabalhe-conosco .tc-formula__txt { grid-column: 1 / span 7; display: grid; gap: 18px; }
.pg-trabalhe-conosco .tc-formula__txt .rotulo { color: var(--acento); }
.pg-trabalhe-conosco .tc-formula__lado { grid-column: 9 / span 4; font-size: 17px; line-height: 1.6; color: var(--texto-2); }
.pg-trabalhe-conosco .tc-areas { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: clamp(48px, 5vw, 80px); }
.pg-trabalhe-conosco .tc-areas__cab { grid-column: 1 / span 3; display: grid; gap: 6px; align-content: start; }
.pg-trabalhe-conosco .tc-areas__cab .rotulo:first-child { color: var(--acento); }
.pg-trabalhe-conosco .tc-areas__cab .rotulo + .rotulo { color: var(--texto-3); }
.pg-trabalhe-conosco .tc-areas__corpo { grid-column: 4 / span 9; }
.pg-trabalhe-conosco .tc-areas ol { border-top: 2px solid var(--fio-forte); }
.pg-trabalhe-conosco .tc-areas li { display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(0, 1.4fr); gap: 4px 20px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--fio); }
.pg-trabalhe-conosco .tc-areas li .rotulo { color: var(--acento); }
.pg-trabalhe-conosco .tc-areas li b { font-size: var(--t-h3); font-weight: 400; letter-spacing: -.01em; line-height: 1.2; }
.pg-trabalhe-conosco .tc-areas li span:last-child { font-size: 15.5px; line-height: 1.5; color: var(--texto-2); }
.pg-trabalhe-conosco .tc-areas .nota { margin-top: 14px; }

/* 03 · valores em linha */
.pg-trabalhe-conosco .tc-val { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--fio); }
.pg-trabalhe-conosco .tc-val li { padding: 24px 22px 28px 0; border-bottom: 1px solid var(--fio); }
.pg-trabalhe-conosco .tc-val li + li { padding-left: 22px; border-left: 1px solid var(--fio); }
.pg-trabalhe-conosco .tc-val h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 8px; font-size: 19px; font-weight: 500; letter-spacing: -.01em; }
.pg-trabalhe-conosco .tc-val__l { flex: none; color: var(--acento); }
.pg-trabalhe-conosco .tc-val p { font-size: 15px; line-height: 1.5; color: var(--texto-2); text-wrap: balance; }
.pg-trabalhe-conosco .tc-val__pe { display: flex; justify-content: space-between; align-items: center; gap: 14px 28px; flex-wrap: wrap; padding-top: 22px; }
.pg-trabalhe-conosco .tc-val__pe .rotulo { color: var(--texto-3); }

/* 04 · ambiente */
.pg-trabalhe-conosco .tc-amb { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 40px; align-items: center; }
.pg-trabalhe-conosco .tc-amb__txt { grid-column: 1 / span 5; display: grid; gap: 22px; }
.pg-trabalhe-conosco .tc-amb__txt > p { font-size: 17px; line-height: 1.6; color: var(--texto-2); max-width: 520px; }
.pg-trabalhe-conosco .tc-amb__foto { grid-column: 7 / span 6; }
.pg-trabalhe-conosco .tc-amb .fatos { margin-top: 0; }
.pg-trabalhe-conosco .tc-amb__midia img { object-position: 0 50%; }
.pg-trabalhe-conosco .tc-meta { display: flex; flex-direction: column; gap: 6px; }
.pg-trabalhe-conosco .tc-meta .rotulo:first-child { color: var(--acento); }
.pg-trabalhe-conosco .tc-meta .rotulo + .rotulo { color: var(--texto-3); }

/* 05 · candidatura (usa o .ciclo do sistema com 3 etapas) */
.pg-trabalhe-conosco .tc-ciclo { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
.pg-trabalhe-conosco .tc-ciclo li { padding-right: clamp(16px, 4vw, 72px); }
.pg-trabalhe-conosco .tc-ciclo h3 { font-size: var(--t-h3); }
.pg-trabalhe-conosco .tc-ciclo p { font-size: 16px; max-width: 28em; }

/* CTA final (laranja): vagas. v3: texto branco em 500 sobre o laranja (tokens do .tema-laranja da frente global) */
.pg-trabalhe-conosco .tc-cta { padding: clamp(72px, 9vw, 136px) 0; }
.pg-trabalhe-conosco .tc-cta__grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 32px; align-items: end; }
.pg-trabalhe-conosco .tc-cta__txt { grid-column: 1 / span 7; display: grid; gap: 22px; }
.pg-trabalhe-conosco .tc-cta__titulo { font-size: var(--t-h2); line-height: 1.08; letter-spacing: -.02em; font-weight: 500; max-width: 14em; }
.pg-trabalhe-conosco .tc-cta__acao { grid-column: 9 / span 4; display: grid; gap: 18px; justify-items: start; }
.pg-trabalhe-conosco .tc-cta__acao p { font-size: 18px; line-height: 1.5; font-weight: 500; }
.pg-trabalhe-conosco .tc-cta__links { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: clamp(24px, 3vw, 48px); border-top: 2px solid var(--fio-forte); }
.pg-trabalhe-conosco .tc-cta__links a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--fio); font-weight: 500; }
.pg-trabalhe-conosco .tc-cta__links small { display: block; font-weight: 500; font-size: 15px; }

@media (max-width: 1080px) {
  .pg-trabalhe-conosco .tc-lead .lead { grid-column: 1 / -1; max-width: 640px; }
  .pg-trabalhe-conosco .tc-formula__txt, .pg-trabalhe-conosco .tc-formula__lado { grid-column: 1 / -1; }
  .pg-trabalhe-conosco .tc-areas__cab, .pg-trabalhe-conosco .tc-areas__corpo, .pg-trabalhe-conosco .tc-amb__txt, .pg-trabalhe-conosco .tc-amb__foto { grid-column: 1 / -1; }
  .pg-trabalhe-conosco .tc-areas__cab { margin-bottom: 20px; }
  .pg-trabalhe-conosco .tc-val { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-trabalhe-conosco .tc-val li:nth-child(4) { padding-left: 0; border-left: 0; }
  .pg-trabalhe-conosco .tc-cta__txt, .pg-trabalhe-conosco .tc-cta__acao { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .pg-trabalhe-conosco .tc-topo::after { background: linear-gradient(0deg, rgba(10, 10, 9, .94) 0%, rgba(10, 10, 9, .84) 55%, rgba(10, 10, 9, .72) 100%); }
  .pg-trabalhe-conosco .tc-topo .acoes .btn { width: 100%; }
  .pg-trabalhe-conosco .tc-topo__lead { margin-top: 18px; font-size: var(--t-lead); line-height: 1.5; letter-spacing: 0; }   /* lead no padrão das internas (vis-b-15) */
  .pg-trabalhe-conosco .tc-tri { grid-template-columns: 1fr; gap: 28px; }
  .pg-trabalhe-conosco .tc-tri .midia { aspect-ratio: 16 / 11; }
  .pg-trabalhe-conosco .tc-areas li { grid-template-columns: 44px minmax(0, 1fr); }
  .pg-trabalhe-conosco .tc-areas li span:last-child { grid-column: 2; }
  .pg-trabalhe-conosco .tc-val { grid-template-columns: 1fr; }
  .pg-trabalhe-conosco .tc-val li, .pg-trabalhe-conosco .tc-val li + li { padding: 18px 0 20px; border-left: 0; }
  .pg-trabalhe-conosco .tc-ciclo { grid-template-columns: 1fr; }
  .pg-trabalhe-conosco .tc-cta__links { grid-template-columns: 1fr; }
  .pg-trabalhe-conosco .tc-cta__acao .btn { width: 100%; }
}

/* ---- _src/css/60-fabricantes.css ---- */
/* Fabricantes parceiros (v3, 13/10/2026). Dono: "fabricantes".
   Partials _src/partials/fabricantes-{cidades,data-center,seguranca,infraestrutura,av,todos}.html,
   gerados por midia/v3/fabricantes/_src/partials_v3.py. Grade estática (sem animação), logos em grafite (#636363)
   sobre fundo branco (a seção fixa tema-branco). Cada <li> traz --h = altura ótica do logo em px (base 32). */
.fab-v3 .fab-v3__cab { display: grid; gap: 14px; max-width: 46em; }
.fab-v3 .fab-v3__cab > p { font-size: var(--t-lead); line-height: 1.55; color: var(--texto-2); }

.fab-v3 .fab-v3__grade { list-style: none; margin: clamp(32px, 3.6vw, 48px) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--fio); border-bottom: 1px solid var(--fio);
  padding-block: clamp(8px, 1vw, 16px); }
.fab-v3 .fab-v3__grade li { display: flex; align-items: center; justify-content: center; min-height: clamp(88px, 7.6vw, 112px);
  padding: 18px 12px; }
.fab-v3 .fab-v3__grade img { display: block; width: auto; height: calc(var(--h, 32) * 1px); max-width: 100%; object-fit: contain; }

/* "todos" (Sobre nós): grupos nomeados por frente */
.fab-v3 .fab-v3__grupo { margin-top: clamp(40px, 4.4vw, 64px); }
.fab-v3 .fab-v3__grupo-titulo { font-size: var(--t-h3); line-height: 1.3; font-weight: 500; letter-spacing: -.005em; color: var(--texto); }
.fab-v3 .fab-v3__grupo .fab-v3__grade { margin-top: 16px; }

/* marcas ainda sem logo oficial local: só o nome (mesmo padrão do .fab da home) */
.fab-v3 .fab-v3__nomes { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding-top: 18px; }
.fab-v3 .fab-v3__nomes .rotulo { color: var(--texto-3); }
.fab-v3 .fab-v3__nomes ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; font-size: 17px; color: var(--texto-3); }
.fab-v3 .fab-v3__nomes li + li::before { content: "/"; margin: 0 12px; }

.fab-v3 .fab-v3__nota { margin-top: 20px; }

@media (max-width: 1100px) {
  .fab-v3 .fab-v3__grade { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .fab-v3 .fab-v3__grade { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fab-v3 .fab-v3__grade img { height: calc(var(--h, 32) * .86px); }
}
@media (max-width: 520px) {
  .fab-v3 .fab-v3__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fab-v3 .fab-v3__grade li { min-height: 80px; padding: 14px 10px; }
  .fab-v3 .fab-v3__grade img { height: calc(var(--h, 32) * .8px); }
}