/* Identidade visual comum. Somente apresentação; formulários e estados mantêm suas regras. */
@media screen {
  :root{--ngq-navy:#123f55;--ngq-teal:#347b76;--ngq-line:#dae4e5;--ngq-paper:#f5f7f5;--ngq-shadow:0 3px 16px #123f5508;--azul2:#1565a0;--azul-2:#1565a0}
  body:not(.entrada){font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background-color:var(--ngq-paper);background-image:linear-gradient(#f5f8f6c9,#f5f8f6c9),url('/static/ngq-visual/textura-paginas.webp');background-size:auto,640px 640px;background-repeat:repeat;color:#243b46}
  body:not(.entrada)::before{opacity:.025}
  body:not(.entrada) :is(.topbar,.topo){position:relative;top:auto;z-index:auto;overflow:visible;background:linear-gradient(110deg,#123f55 10%,#184f60 72%,#2a6666);box-shadow:0 3px 18px #123f5515;color:#fff}
  /* O logo atravessa o limite da barra e rola com a página, sem ocupar espaço no menu. */
  body:not(.entrada) :is(.topbar,.topo)::before{--ngq-logo-overlap:64px;content:"";position:absolute;top:calc(100% - var(--ngq-logo-overlap));left:max(20px,calc((100% - 1140px)/2));width:min(580px,calc(100% - 40px));aspect-ratio:900/248;background:linear-gradient(to bottom,#d9efea30 0 var(--ngq-logo-overlap),#0f3d5c16 var(--ngq-logo-overlap) 100%);-webkit-mask:url('/static/ngq-visual/logo-ngq.png') center/contain no-repeat;mask:url('/static/ngq-visual/logo-ngq.png') center/contain no-repeat;pointer-events:none;z-index:0}
  body:not(.entrada) .topbar{padding:0}
  body:not(.entrada) :is(.topbar,.topo)>.wrap{position:relative;z-index:1;max-width:1180px;min-height:70px;padding:12px 20px;gap:16px;align-items:center}
  body:not(.entrada)>:is(main.wrap,.container){position:relative;z-index:1}
  body:not(.entrada) :is(.topbar,.topo) nav{gap:4px}
  body:not(.entrada) :is(.topbar,.topo) nav a{font-size:.83rem;font-weight:500;padding:8px 10px;border-radius:9px;line-height:1.35;color:#fff}
  body:not(.entrada) :is(.topbar,.topo) nav a:is(.ativo,[aria-current="page"]){background:#ffffff20;box-shadow:inset 0 -2px #acd8ca;font-weight:650}
  body:not(.entrada) :is(.topbar,.topo) nav a:hover{background:#ffffff18;text-decoration:none}
  body:not(.entrada) .brand{gap:12px;color:#fff}
  body:not(.entrada) .brand-txt strong{font-size:.92rem;letter-spacing:-.015em;white-space:normal;line-height:1.25}
  body:not(.entrada) .brand-txt small{display:block;color:#c6dfe1;font-size:.61rem;font-weight:400;margin-top:3px}
  body:not(.entrada) .marca .brand-txt strong{display:block}
  body:not(.entrada) .topbar nav :is(.ngq-inicio,.ngq-troca){border-color:#ffffff45}
  body:not(.entrada) :is(.card,.cartao,.overview-panel,.cw-compose-inline,.cw-note-card,.cw-post){border-color:var(--ngq-line);border-radius:15px;box-shadow:var(--ngq-shadow)}
  body:not(.entrada) .btn{border-radius:10px;font-family:inherit;font-weight:650;line-height:1.4}
  body:not(.entrada) :is(input,select,textarea){font-family:inherit;border-radius:9px}
  body:not(.entrada) :is(.filtros-acoes,.bs-acoes){flex-wrap:wrap}
  body:not(.entrada) .filtros-card .filtros{min-width:0}
  body:not(.entrada) .seg-opt{position:relative}
  body:not(.entrada) .seg-opt>input[type="radio"]{width:1px;height:1px;inset:0;padding:0;border:0;margin:0}
  body:not(.entrada) .seg-opt>input:focus-visible+span{outline:3px solid #6caa9b;outline-offset:3px}
  body:not(.entrada) :is(.card h1,.page-head h1){font-weight:700;letter-spacing:-.035em;color:var(--ngq-navy)}
  body:not(.entrada) :is(.card h2,.page-head h2){letter-spacing:-.015em;color:var(--ngq-navy)}
  body:not(.entrada) :is(.tabela,.overview-table table) thead th{background:#eef4f3;color:#38515c;font-size:.77rem;font-weight:650;letter-spacing:.01em}
  body:not(.entrada) :is(a,button):focus-visible{outline:3px solid #6caa9b;outline-offset:3px}
  body:not(.entrada)>footer{font-size:.76rem;color:#637882;padding:24px 20px;line-height:1.6}
  @media(max-width:800px){
    body:not(.entrada) :is(.topbar,.topo)::before{--ngq-logo-overlap:46px;left:16px;width:min(480px,calc(100% - 32px))}
    body:not(.entrada) :is(.topbar,.topo)>.wrap{gap:10px;padding:10px 16px}
    body:not(.entrada) :is(.topbar,.topo) nav a{font-size:.78rem;padding:7px 9px}
    body:not(.entrada) .brand-txt strong{font-size:.85rem}
    body:not(.entrada) .brand-txt small{font-size:.59rem}
    body:not(.entrada) .checklist .grid-2>.campo{min-width:0}
    body:not(.entrada) .checklist .campo>div:has(>#data_referencia){flex-wrap:wrap}
  }
  @media(prefers-reduced-motion:reduce){body:not(.entrada) .ngq-module{transition:none}}
}
