/* Canal do CSIP — linguagem visual Melo (referência do Lucas, 11/11/2026).
   Paleta fixa nos dois temas. Dourado só em fios, bordas e ícones (contraste).
   Fontes servidas daqui mesmo: nenhum pedido ao Google Fonts (anonimato). */

@font-face { font-family: "Forum"; src: url("../fonts/Forum-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

:root {
  --dourado: #B59D61; --petroleo: #024F63; --marinho: #132A36; --preto: #000; --branco: #fff;
  --azul-acinz: #4F6E81; --azul-claro: #B5C8D4; --cinza-azul: #E3E9EC;
  --oliva: #968247; --dourado-medio: #C0AC7A; --dourado-claro: #E2D2A2; --creme: #F4EDD6;
  --texto: #2c4350; --zebra: #f7f9fa;
  --critica: #B42318; --alta: #C2410C; --media: #A16207; /* gravidade: vermelho, laranja, âmbar */
  --linha-hover: #D3DEE4;
  --oliva-escuro: #6E5F33; /* oliva com contraste AA para texto branco pequeno */
  --raio: 10px; --raio-p: 6px; /* cantos arredondados (pedido do Lucas, 11/11/2026) */
  color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: light; } }
:root[data-theme="dark"] { color-scheme: light; }

* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; } /* o atributo hidden vence o display dos componentes */
html { scroll-behavior: smooth; }
body { font-family: "Montserrat", Arial, sans-serif; color: var(--marinho); background: var(--branco); line-height: 1.6; font-size: 16px; }
h1, h2, h3, .titulo { font-family: "Forum", Georgia, serif; text-transform: uppercase; font-weight: 400; letter-spacing: .02em; line-height: 1.15; }
a { color: var(--petroleo); }
:focus-visible { outline: 2px solid var(--dourado); outline-offset: 2px; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
section { padding: 64px 0; }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--petroleo); margin-bottom: 12px; display: flex; align-items: center; gap: 12px; }
.eyebrow::after { content: ""; height: 1px; width: 64px; background: var(--dourado); }
h2 { font-size: clamp(26px, 4vw, 40px); margin-bottom: 16px; }
.lead { max-width: 760px; font-size: 17px; color: var(--texto); }
.muted { color: var(--azul-acinz); font-size: 13px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* NAV */
nav.top { position: sticky; top: 0; z-index: 10; background: var(--marinho); border-bottom: 1px solid rgba(181,157,97,.4); }
nav.top .wrap { display: flex; gap: 8px 22px; align-items: center; justify-content: space-between; padding-top: 12px; padding-bottom: 12px; flex-wrap: wrap; }
nav.top .marca { display: flex; align-items: center; gap: 12px; color: var(--creme); text-decoration: none; }
nav.top .marca img { height: 34px; width: auto; }
nav.top .marca span { font-family: "Forum", serif; text-transform: uppercase; letter-spacing: .08em; font-size: 15px; }
nav.top .links { display: flex; gap: 4px 20px; flex-wrap: wrap; }
nav.top .links a { color: var(--creme); text-decoration: none; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; opacity: .85; border-bottom: 2px solid transparent; padding: 4px 0; }
nav.top .links a:hover, nav.top .links a[aria-current="page"] { opacity: 1; color: var(--dourado-claro); border-bottom-color: var(--dourado); }

/* CAPA */
.cover { position: relative; color: var(--creme); padding: 80px 0 88px; background: radial-gradient(circle at 30% 35%, var(--petroleo) 0%, var(--marinho) 75%); overflow: hidden; }
.cover::before { content: ""; position: absolute; inset: 0; opacity: .13;
  background-image:
    linear-gradient(45deg, transparent 48.6%, var(--dourado) 49%, var(--dourado) 51%, transparent 51.4%),
    linear-gradient(-45deg, transparent 48.6%, var(--dourado) 49%, var(--dourado) 51%, transparent 51.4%);
  background-size: 56px 56px; }
.cover .wrap { position: relative; text-align: center; }
.cover .tag { font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--dourado-claro); margin-bottom: 18px; }
.cover h1 { font-size: clamp(32px, 5.4vw, 60px); color: var(--branco); margin: 0 auto 20px; max-width: 900px; }
.cover h1 em { font-style: normal; color: var(--dourado-claro); }
.cover p.sub { max-width: 640px; margin: 0 auto; font-size: 17px; color: var(--dourado-claro); }

/* INICIAL: escolha do assunto e do tipo (Lucas, 12/11/2026) */
.inicio-escolha { padding-top: 0; }
.escolha { max-width: 720px; margin: -48px auto 0; position: relative; padding: 28px; box-shadow: 0 8px 24px rgba(19,42,54,.14); }
.escolha h2 { font-size: 26px; color: var(--petroleo); margin-bottom: 20px; }
.escolha .campo + .campo { margin-top: 18px; }
.escolha select { width: 100%; font-size: 16px; padding: 12px; }
.escolha select:disabled { background: var(--zebra); color: var(--azul-acinz); }
.escolha .botao { margin-top: 24px; }
.resumo-assunto:empty { display: none; }
.resumo-assunto.destaque { color: var(--critica); font-weight: 600; }
.links-inicio { max-width: 720px; font-size: 14px; color: var(--texto); margin: 18px auto 0; text-align: center; }
.links-inicio + .links-inicio { margin-top: 6px; }
.certificacoes.inicio { max-width: 720px; margin: 32px auto 0; }

/* PASSO A PASSO do assunto (tela de comunicar) */
.passos-assunto { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.passos-assunto li { display: flex; gap: 14px; align-items: flex-start; background: var(--creme); border-radius: var(--raio); padding: 16px 18px; }
.passos-assunto .num { font-family: "Forum", serif; font-size: 30px; line-height: 1; color: var(--oliva-escuro); flex: none; }
.passos-assunto b { display: block; font-size: 14.5px; color: var(--marinho); margin-bottom: 4px; }
.passos-assunto p { font-size: 13.5px; color: var(--texto); }
.assunto-destaque .passos-assunto .num { color: var(--critica); }

/* AVISOS */
.alert { padding: 16px 20px; background: var(--creme); border-left: 4px solid var(--petroleo); font-size: 14px; max-width: 980px; margin-top: 20px; }
.alert b { color: var(--petroleo); letter-spacing: .06em; text-transform: uppercase; font-size: 12px; display: block; margin-bottom: 4px; }
.alert.dourado { border-left-color: var(--dourado); }
.alert.dourado b { color: var(--marinho); }
ul.tick { list-style: none; margin-top: 8px; }
ul.tick li { position: relative; padding: 4px 0 4px 20px; font-size: 14px; }
ul.tick li::before { content: ""; position: absolute; left: 2px; top: 15px; width: 10px; height: 1.5px; background: var(--dourado); }

/* FORMULÁRIO */
.card { background: var(--branco); border-top: 3px solid var(--dourado); padding: 24px; box-shadow: 0 1px 0 var(--cinza-azul); }
fieldset { border: 0; margin-top: 24px; }
legend, label.rot { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--marinho); margin-bottom: 10px; display: block; }
.opcoes { display: grid; gap: 10px; }
.opcao { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--cinza-azul); padding: 14px 16px; cursor: pointer; }
.opcao:hover { background: var(--creme); }
.opcao input { margin-top: 4px; accent-color: var(--petroleo); }
.opcao b { display: block; font-size: 15px; }
.opcao span { display: block; font-size: 13px; color: var(--azul-acinz); }
.modo { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--dourado); }
.modo label { font-weight: 600; font-size: 13px; letter-spacing: .04em; padding: 12px 18px; cursor: pointer; }
.modo input { position: absolute; opacity: 0; }
.modo input:checked + span { color: var(--creme); }
.modo label:has(input:checked) { background: var(--marinho); color: var(--creme); }
.modo label:has(input:focus-visible) { outline: 2px solid var(--petroleo); outline-offset: -4px; }
input[type=text], input[type=password], input[type=email], textarea { width: 100%; font: inherit; color: var(--marinho); border: 1px solid var(--azul-claro); padding: 10px 12px; background: var(--branco); }
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus { border-color: var(--petroleo); outline: 2px solid var(--dourado); outline-offset: 1px; }
textarea { min-height: 180px; resize: vertical; }
.botao { display: inline-block; font: 700 13px "Montserrat", sans-serif; letter-spacing: .12em; text-transform: uppercase; padding: 14px 24px; background: var(--petroleo); color: var(--branco); border: 0; cursor: pointer; text-decoration: none; }
.botao:hover { background: var(--marinho); }
.botao[disabled] { background: var(--azul-acinz); cursor: not-allowed; }
.botao.sec { background: transparent; color: var(--petroleo); border: 1px solid var(--petroleo); }

/* GESTÃO */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 24px; }
.kpi { border: 1px solid var(--dourado-claro); background: var(--creme); padding: 20px; }
.kpi .n { font-family: "Forum", serif; font-size: clamp(30px, 3.6vw, 44px); color: var(--petroleo); line-height: 1; }
.kpi .l { font-size: 13px; margin-top: 8px; color: var(--texto); }
.tabela-wrap { overflow-x: auto; margin-top: 24px; }
table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
th { background: var(--marinho); color: var(--creme); font-weight: 600; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; text-align: left; padding: 12px 14px; }
td { padding: 14px; border-top: 1px solid var(--cinza-azul); vertical-align: top; }
tr:nth-child(even) td { background: var(--zebra); }
.selo { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; color: #fff; white-space: nowrap; }
.selo.admitida { background: var(--petroleo); } .selo.apuracao { background: var(--oliva-escuro); } .selo.arquivada { background: var(--azul-acinz); }
.faixa-amb { background: var(--dourado-claro); color: var(--marinho); text-align: center; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 4px; }

/* RODAPÉ */
footer { background: var(--preto); color: var(--azul-claro); padding: 36px 0; font-size: 12px; }
footer .rodape-titulo { font-family: "Forum", Georgia, serif; text-transform: uppercase; letter-spacing: .02em; font-size: 14px; color: var(--dourado-claro); margin-bottom: 10px; }
footer a { color: var(--dourado-medio); }
footer .legal { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.15); color: var(--azul-claro); }

/* Pular para o conteúdo: invisível até receber foco pelo teclado */
.pular { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--marinho); color: var(--creme); padding: 10px 16px; font-size: 13px; font-weight: 600; text-decoration: none; }
.pular:focus { top: 8px; outline: 2px solid var(--dourado); }
main:focus { outline: none; }

/* Garantias + selos de certificação */
.certificacoes h3 { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .18em; color: var(--petroleo); margin-bottom: 12px; }
.certificacao { display: flex; gap: 16px; align-items: center; border: 1px solid var(--dourado-claro); border-top: 3px solid var(--dourado); background: var(--branco); padding: 16px; margin-bottom: 12px; }
.certificacao img { width: 96px; height: 96px; object-fit: contain; flex: none; }
.certificacao figcaption { font-size: 12.5px; color: var(--texto); line-height: 1.5; }
.certificacao figcaption b { display: block; font-size: 14px; color: var(--marinho); }
.certificacao figcaption span { display: block; }
.certificacao figcaption a { display: inline-block; margin-top: 6px; color: var(--petroleo); font-weight: 600; }
.certificacao.vazia { display: block; border: 2px dashed var(--dourado); border-top-width: 2px; background: var(--creme); font-size: 12.5px; color: var(--texto); }
.certificacao.vazia b { display: block; color: var(--petroleo); font-size: 13px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.certificacao.vazia span { display: block; margin-bottom: 6px; }
.certificacao.vazia code { font-size: 11.5px; background: var(--branco); padding: 0 4px; }
.certificacao.vazia .nota { color: var(--azul-acinz); font-style: italic; margin: 0; }

/* ---------- Formulário de comunicação */
.coluna { max-width: 880px; margin: 0 auto; } /* telas públicas centralizadas (Lucas, 12/11/2026) */
.coluna .alert { max-width: none; }
.alert.urgente { border-left-color: var(--marinho); background: var(--cinza-azul); }
.alert.urgente b { color: var(--marinho); }
.titular { margin-top: 12px; }
.obrigatorio { margin-bottom: -8px; }
.req { color: var(--petroleo); font-weight: 700; }
.opcoes.duas { grid-template-columns: 1fr 1fr; }
.nota-modo { font-size: 14px; color: var(--texto); margin-top: 12px; max-width: 680px; }
.identificacao { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; padding: 16px; background: var(--creme); border-left: 3px solid var(--petroleo); }
/* Some quando "Anônimo" está marcado. Navegador sem :has mostra sempre (campos são opcionais). */
form:has(input[name="modo"][value="anonimo"]:checked) .identificacao { display: none; }
.campos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.campo label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; color: var(--marinho); }
.ajuda { display: block; font-size: 13px; color: var(--azul-acinz); margin-top: 6px; }
.detalhes .sim-nao { margin-top: 18px; }
.sim-nao legend { font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; margin-bottom: 8px; }
.sim-nao div { display: flex; flex-wrap: wrap; gap: 8px; }
.sim-nao label { display: inline-flex; gap: 8px; align-items: center; border: 1px solid var(--cinza-azul); padding: 8px 14px; font-size: 14px; cursor: pointer; }
.sim-nao label:hover { background: var(--creme); }
.sim-nao input { accent-color: var(--petroleo); }
input[type=file] { display: block; width: 100%; font: inherit; font-size: 14px; color: var(--marinho); border: 1px dashed var(--azul-claro); padding: 14px; background: var(--zebra); }
input[type=file]:focus-visible { outline: 2px solid var(--dourado); outline-offset: 1px; }
.antes-enviar { margin-top: 32px; padding: 20px; background: var(--creme); border-left: 4px solid var(--dourado); }
.antes-enviar h3 { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .18em; color: var(--marinho); }
.antes-enviar ul.tick li { color: var(--texto); }
.antes-enviar ul.tick li b { color: var(--marinho); }
.privacidade { font-size: 13px; color: var(--texto); margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--dourado-claro); }
.privacidade b { color: var(--marinho); }
.enviar { margin-top: 24px; }
.excluir-membros { margin-top: 16px; padding: 16px; background: var(--creme); border-left: 3px solid var(--petroleo); }
.excluir-membros legend { float: left; width: 100%; margin-bottom: 6px; }
.excluir-membros .muted { clear: both; margin-bottom: 10px; color: var(--texto); }
.excluir-membros .opcao { background: var(--branco); }
/* Só aparece com "Sim". Navegador sem :has mostra sempre. */
form:has(input[name="envolve_comite"][value="nao"]:checked) .excluir-membros { display: none; }
.nota-anexos { font-size: 13px; color: var(--texto); margin-top: 8px; padding-left: 10px; border-left: 2px solid var(--dourado); }

/* ---------- Títulos de página, acompanhar e tela do caso */
.titulo-pagina { font-size: clamp(26px, 4vw, 40px); margin-bottom: 16px; }
.acompanhar { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; align-items: start; margin-top: 28px; }
.acompanhar fieldset:first-child { margin-top: 0; }
.acompanhar .muted { margin-top: 8px; }
.campo-codigo { display: flex; gap: 8px; }
.campo-codigo input { flex: 1; min-width: 0; }
.botao.mostrar { padding: 10px 14px; font-size: 11px; white-space: nowrap; }
.info-acompanhar h2 { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .18em; color: var(--petroleo); margin-bottom: 4px; }
.info-acompanhar h2 + p, .info-acompanhar ul { margin-bottom: 20px; }
.info-acompanhar p { font-size: 14px; color: var(--texto); }
.info-acompanhar .lista-entrar { margin-bottom: 10px; }
.info-acompanhar .nota-aviso { margin-bottom: 20px; padding-left: 10px; border-left: 2px solid var(--dourado); }
.exemplo-link { padding-top: 14px; border-top: 1px solid var(--dourado-claro); }
.exemplo-link a { font-weight: 600; }
.exemplo-link span { color: var(--azul-acinz); font-size: 13px; }
.alert.exemplo { margin: 0 0 24px; }
.caso-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.caso-topo .titulo-pagina { margin-bottom: 0; }
.sair-aviso { margin-top: 8px; }
.caso-resumo { display: grid; grid-template-columns: 2fr repeat(4, 1fr); gap: 12px; margin-top: 24px; }
.caso-resumo div { border: 1px solid var(--cinza-azul); padding: 12px 14px; }
.caso-resumo span { display: block; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-acinz); }
.caso-resumo b { display: block; font-size: 14px; margin-top: 4px; }
.caso-resumo .destaque { background: var(--creme); border-color: var(--dourado-claro); }
.caso-resumo .destaque b { color: var(--petroleo); font-size: 16px; }
.rotulo-secao { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .18em; color: var(--marinho); margin: 36px 0 14px; display: flex; align-items: center; gap: 12px; }
.rotulo-secao::after { content: ""; flex: 1; height: 1px; background: var(--dourado); }
.etapas { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); counter-reset: etapa; }
.etapas li { counter-increment: etapa; position: relative; padding: 34px 12px 0 0; border-top: 3px solid var(--cinza-azul); }
.etapas li::before { content: counter(etapa); position: absolute; top: -15px; left: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: var(--branco); border: 2px solid var(--azul-claro); color: var(--azul-acinz); }
.etapas li.feita { border-top-color: var(--petroleo); }
.etapas li.feita::before { content: "✓"; background: var(--petroleo); border-color: var(--petroleo); color: var(--branco); }
.etapas li.atual { border-top-color: var(--dourado); }
.etapas li.atual::before { background: var(--marinho); border-color: var(--dourado); color: var(--creme); }
.etapas b { display: block; font-size: 14px; }
.etapas span { display: block; font-size: 13px; color: var(--azul-acinz); }
.etapas li.atual span { color: var(--marinho); font-weight: 600; }
.mensagens { list-style: none; display: grid; gap: 12px; }
.msg { padding: 14px 16px; max-width: 640px; font-size: 14.5px; color: var(--texto); }
.msg.csip { background: var(--zebra); border-left: 3px solid var(--petroleo); }
.msg.voce { background: var(--creme); border-left: 3px solid var(--dourado); margin-left: auto; width: 100%; }
.msg-cab { font-size: 12px; color: var(--azul-acinz); margin-bottom: 4px; }
.msg-cab b { color: var(--marinho); letter-spacing: .06em; text-transform: uppercase; }
.msg-anexos { list-style: none; margin-top: 8px; font-size: 13px; }
.msg-anexos li { display: inline-block; border: 1px solid var(--dourado-claro); background: var(--branco); padding: 4px 10px; }
.msg-anexos span { color: var(--azul-acinz); }
.responder { margin-top: 28px; }
.responder fieldset:first-child { margin-top: 0; }
.responder textarea { min-height: 120px; }
.responder .enviar .muted, .acompanhar .muted#aviso-construcao { margin-top: 8px; }

/* ---------- Cantos arredondados */
.alert, .card, .kpi, .certificacao, .identificacao, .excluir-membros,
.antes-enviar, .caso-resumo div, .msg, .opcao, .tabela-wrap { border-radius: var(--raio); }
.modo { border-radius: var(--raio-p); overflow: hidden; }
.botao, .sim-nao label, .msg-anexos li, .selo, .pular,
input[type=text], input[type=password], input[type=email], input[type=file], textarea { border-radius: var(--raio-p); }
.certificacao img { border-radius: var(--raio-p); }

/* ---------- Back-office (gestão) */
.usuario-nav { color: var(--azul-claro); font-size: 12px; padding: 4px 0; overflow-wrap: anywhere; }
.botao.sec[disabled] { background: transparent; color: var(--azul-acinz); border-color: var(--azul-claro); }
.botao.mini { padding: 6px 12px; font-size: 11px; }
.selo.recebida { background: var(--marinho); } .selo.triagem { background: var(--petroleo); }
.kpi.vencendo { border-color: var(--oliva); }
.kpi.atrasado { background: var(--marinho); border-color: var(--marinho); }
.kpi.atrasado .n { color: var(--creme); } .kpi.atrasado .l { color: var(--azul-claro); }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
select { font: inherit; font-size: 14px; color: var(--marinho); background: var(--branco); border: 1px solid var(--azul-claro); border-radius: var(--raio-p); padding: 9px 10px; max-width: 100%; }
select:focus { outline: 2px solid var(--dourado); outline-offset: 1px; border-color: var(--petroleo); }
.filtros .botao { padding: 10px 16px; }
table.casos td { vertical-align: top; transition: background-color .12s; }
table.casos tbody tr[data-href] { cursor: pointer; }
table.casos tbody tr[data-href]:hover td, table.casos tbody tr[data-href]:focus-within td { background: var(--linha-hover); }
table.casos tbody tr[data-href]:hover :is(.trilha, .prazo-nome), table.casos tbody tr[data-href]:focus-within :is(.trilha, .prazo-nome) { color: var(--texto); }
table.casos tbody tr[data-href]:hover :is(.trilha.sexual, .cat-sexual), table.casos tbody tr[data-href]:focus-within :is(.trilha.sexual, .cat-sexual) { color: var(--critica); }
.limpar { font-size: 13px; font-weight: 600; }
.contagem { margin-left: auto; font-size: 13px; color: var(--azul-acinz); }
.sem-quebra { white-space: nowrap; }
.protocolo { font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
.marca-caso { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; margin: 4px 4px 0 0; }
.marca-caso.nova { background: var(--petroleo); color: var(--branco); }
.marca-caso.rota { border: 1px solid var(--oliva); color: var(--marinho); background: var(--creme); }
.trilha { display: block; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-acinz); }
/* Gravidade: só a letra colorida (pedido do Lucas). Amarelo puro some no branco,
   por isso a média usa âmbar. Na linha escurecida pelo hover, tons mais fechados. */
.grav { font-size: 13px; font-weight: 700; white-space: nowrap; color: var(--marinho); }
.grav.critica { color: var(--critica); }
.grav.alta { color: var(--alta); }
.grav.media { color: var(--media); }
.grav.baixa { color: var(--texto); font-weight: 600; }
table.casos tbody tr[data-href]:hover .grav.alta, table.casos tbody tr[data-href]:focus-within .grav.alta { color: #9A3412; }
table.casos tbody tr[data-href]:hover .grav.media, table.casos tbody tr[data-href]:focus-within .grav.media { color: #854D0E; }
.prazo { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: var(--raio-p); white-space: nowrap; }
.prazo.atrasado { background: var(--marinho); color: var(--branco); }
.prazo.vencendo { background: var(--creme); color: var(--marinho); border: 1px solid var(--oliva); }
.prazo.no-prazo { color: var(--petroleo); padding-left: 0; }
.prazo.cumprido { color: var(--azul-acinz); padding-left: 0; }
.prazo-nome { display: block; font-size: 12px; color: var(--azul-acinz); margin-top: 2px; }
.voltar { margin-bottom: 16px; font-size: 14px; }
.selos-caso { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.selos-caso .marca-caso { margin: 0; }
.caso-resumo.gestao { grid-template-columns: repeat(5, 1fr); }
.caso-resumo small { display: block; font-size: 12px; color: var(--texto); margin-top: 2px; }
.caso-resumo .destaque.atrasado { background: var(--marinho); border-color: var(--marinho); }
.caso-resumo .destaque.atrasado span, .caso-resumo .destaque.atrasado small { color: var(--azul-claro); }
.caso-resumo .destaque.atrasado b { color: var(--creme); }
.nota-email { margin-top: 8px; }
.caso-grade { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; }
.relato { white-space: pre-line; font-size: 15px; color: var(--marinho); background: var(--zebra); border-left: 3px solid var(--petroleo); border-radius: var(--raio); padding: 16px 18px; }
.detalhes-caso { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; margin-top: 16px; }
.detalhes-caso dt { font-size: 12px; font-weight: 600; color: var(--azul-acinz); }
.detalhes-caso dd { font-size: 14px; }
h3.sub { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--marinho); margin: 20px 0 8px; }
.anexos-caso { list-style: none; display: grid; gap: 8px; }
.anexos-caso li { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; border: 1px solid var(--cinza-azul); border-radius: var(--raio-p); padding: 8px 12px; font-size: 14px; }
.anexos-caso span { color: var(--azul-acinz); font-size: 13px; flex: 1; }
.caso-principal .msg.voce { margin-left: 0; }
details.bloco { border: 1px solid var(--cinza-azul); border-radius: var(--raio); padding: 14px 18px; }
details summary { cursor: pointer; font-weight: 600; color: var(--petroleo); }
details[open] summary { margin-bottom: 8px; }
.campo-rel { display: block; font-size: 14px; margin-bottom: 6px; }
.caso-lateral { display: grid; gap: 16px; position: sticky; top: 84px; }
.painel-lateral { padding: 18px; }
.painel-lateral h2 { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .16em; color: var(--marinho); margin-bottom: 10px; }
.painel-lateral .rot { margin-top: 12px; }
.painel-lateral select, .painel-lateral textarea { width: 100%; }
.painel-lateral .botao { margin-top: 12px; width: 100%; }
.painel-lateral .ajuda { margin-top: 8px; }
.prazos { list-style: none; display: grid; gap: 10px; }
.prazos li { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; font-size: 13px; border-bottom: 1px solid var(--cinza-azul); padding-bottom: 8px; }
.prazos .prazo-nome-l { grid-column: 1 / -1; font-weight: 600; color: var(--marinho); }
.prazos li span:nth-child(2) { color: var(--texto); }

/* ---------- Assuntos (decisão do Lucas, 11/11/2026) */
.comite-resp { font-size: 14px; color: var(--texto); margin-top: 12px; }
.assunto-destaque .eyebrow { color: var(--critica); }
.assunto-destaque .eyebrow::after { background: var(--critica); }
.assunto-destaque .titulo-pagina { color: var(--critica); }
.assunto-destaque form.card { border-top-color: var(--critica); }
.opcoes.tres { grid-template-columns: repeat(3, 1fr); }
.evidencias { border: 2px solid var(--critica); border-radius: var(--raio); padding: 16px 18px 18px; }
.evidencias > legend { padding: 0 6px; margin-left: -6px; }
.evidencias .campo + .campo { margin-top: 14px; }
.regra-evidencia { font-size: 14px; color: var(--texto); margin-bottom: 14px; }
.regra-evidencia b { color: var(--critica); }
.erro-evidencia { margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--critica); }
.evidencias.invalido { background: #FDF2F1; }
.cat-sexual { color: var(--critica); font-weight: 700; }
.sim-nao.numerada { margin-top: 24px; }
.sim-nao.numerada > legend { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 10px; }
.trilha.sexual { color: var(--critica); }
.ver-como { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 13px; margin: -8px 0 24px; }
.ver-como span { color: var(--texto); font-weight: 600; }
.ver-como a { padding: 4px 10px; border: 1px solid var(--azul-claro); border-radius: 999px; text-decoration: none; }
.ver-como a[aria-current="page"] { background: var(--petroleo); border-color: var(--petroleo); color: var(--branco); }

@media (max-width: 900px) {
  section { padding: 48px 0; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .caso-grade { grid-template-columns: 1fr; }
  .caso-lateral { position: static; }
  .caso-resumo.gestao { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .opcoes.duas, .opcoes.tres, .identificacao, .campos, .acompanhar, .passos-assunto { grid-template-columns: 1fr; }
  .caso-resumo { grid-template-columns: 1fr 1fr; }
  .caso-resumo div:first-child, .caso-resumo .destaque { grid-column: 1 / -1; }
  .etapas { grid-template-columns: 1fr; gap: 0; margin-left: 15px; }
  .etapas li { border-top: 0; border-left: 3px solid var(--cinza-azul); padding: 2px 0 18px 26px; }
  .etapas li.feita { border-left-color: var(--petroleo); }
  .etapas li.atual { border-left-color: var(--dourado); }
  .etapas li::before { top: 0; left: -15px; }
  .card { padding: 20px 16px; }
}
@media (max-width: 520px) {
  .escolha { padding: 20px 16px; }
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi { padding: 14px; }
  .detalhes-caso { grid-template-columns: 1fr; }
  nav.top .marca span { display: none; }
}
@media print { nav.top, footer { display: none; } }