/* Barra de navegação da trilha. Extraído do protótipo no E0 — era byte-idêntico
   nas 12 páginas que a usam. Editar aqui vale para todas. */
.intnav{position:sticky;top:0;z-index:99999;display:flex;align-items:center;gap:14px;
  background:#275750;color:#F5F7F3;font-family:'Hanken Grotesk',-apple-system,'Segoe UI',sans-serif;
  font-size:13.5px;line-height:1;padding:0 18px;height:46px;box-shadow:0 2px 12px rgba(39,87,80,.28);
  -webkit-font-smoothing:antialiased}
.intnav a{color:#CFE0D6;text-decoration:none;transition:color .15s}
.intnav a:hover{color:#FF6842}
.intnav .intnav-brand{font-weight:700;letter-spacing:.02em;color:#F5F7F3;display:inline-flex;align-items:center;gap:7px;flex-shrink:0}
.intnav .intnav-brand::before{content:"";width:8px;height:8px;border-radius:50%;background:#FF6842;flex-shrink:0}
/* o nome do produto vinha grudado na logo, lendo como uma coisa só. Afasta e
   torna secundário: a logo "Intentia" é a marca; "Mapeamento Estratégico" é o
   subtítulo. */
.intnav .intnav-brand span:not(.intnav-logo){margin-left:9px;font-weight:600;color:#BFD6CC}
.intnav .intnav-crumb{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;white-space:nowrap}
/* divisor entre o nome do produto (marca) e a localização atual, para o olho
   parar de ler "Intentia Mapeamento Estratégico Início da trilha" como uma frase */
.intnav .intnav-crumb::before{content:"";width:1px;height:16px;background:rgba(255,255,255,.22);flex-shrink:0;margin-right:2px}
.intnav .intnav-crumb .sep{color:#5f867d;flex-shrink:0}
/* localização = secundária: legível, mas sem competir com a marca */
.intnav .intnav-crumb .crumb-capa{color:#9FBBB0}
.intnav .intnav-crumb .cur{color:#CFE0D6;font-weight:600;overflow:hidden;text-overflow:ellipsis}
.intnav .intnav-spacer{flex:1 1 auto}
.intnav .intnav-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
.intnav .intnav-jornada{font-weight:600}
.intnav .intnav-pill{border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:6px 12px;
  font-size:12.5px;font-weight:600;color:#F5F7F3;white-space:nowrap;background:none}
.intnav .intnav-pill:hover{border-color:#FF6842;color:#FF6842}
.intnav .intnav-pill.disabled{opacity:.32;pointer-events:none}
.intnav .intnav-menu{position:relative;flex-shrink:0}
.intnav .intnav-menu-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid rgba(255,255,255,.22);
  border-radius:999px;color:#F5F7F3;font:inherit;font-size:12.5px;font-weight:600;padding:6px 12px;cursor:pointer;white-space:nowrap}
.intnav .intnav-menu-btn:hover{border-color:#FF6842;color:#FF6842}
.intnav .intnav-menu-btn .caret{transition:transform .18s}
.intnav .intnav-menu.open .intnav-menu-btn .caret{transform:rotate(180deg)}
.intnav .intnav-menu-panel{position:absolute;top:calc(100% + 8px);right:0;left:auto;min-width:196px;background:#fff;
  border:1px solid #DAE6E1;border-radius:12px;box-shadow:0 14px 34px rgba(39,87,80,.24);padding:6px;
  display:none;flex-direction:column;z-index:100000}
.intnav .intnav-menu.open .intnav-menu-panel{display:flex}
.intnav .intnav-menu-panel a{color:#20332F;padding:9px 12px;border-radius:8px;font-size:13.5px;font-weight:500;white-space:nowrap}
.intnav .intnav-menu-panel a:hover{background:#EFF2EE;color:#275750}
.intnav .intnav-menu-panel a.atual{color:#275750;font-weight:700;background:#F4FAF7}
@media(max-width:620px){
  .intnav{gap:9px;padding:0 12px;font-size:12.5px}
  .intnav .intnav-brand span{display:none}
  .intnav .intnav-crumb .crumb-capa,.intnav .intnav-crumb .sep-capa{display:none}
  .intnav .intnav-jornada{display:none}
  .intnav .intnav-menu-btn .lbl{display:none}
  .intnav .intnav-pill .lbl{display:none}
  .intnav .intnav-pill{padding:6px 10px}
}