/* A composição aprovada acompanha os documentos, com destinos estáveis. */
html[data-site-navigation] #topnav{padding-inline:clamp(20px,4vw,80px);border:0;background:linear-gradient(to bottom,color-mix(in srgb,var(--color-canvas) 80%,var(--navy-deep)),transparent);gap:22px}
html[data-site-navigation] #topnav .tn-mark{display:block;width:48px;height:48px;flex:none}
html[data-site-navigation] #topnav .tn-brand{min-width:44px;min-height:44px;width:auto;max-width:none;flex-shrink:0;gap:10px;color:var(--color-display)}
html[data-site-navigation] #topnav .tn-wordmark{display:block;overflow:visible;max-width:none;font-size:21px;font-weight:900;letter-spacing:.01em;text-transform:uppercase;line-height:1;color:var(--color-display)}
html[data-site-navigation] #topnav .tn-description{display:block;margin:0;color:var(--color-display);font-size:8px;font-weight:400;letter-spacing:.55em;line-height:1.5;text-transform:uppercase}
html[data-site-navigation] #topnav .tn-links{margin-inline:auto;gap:clamp(16px,2vw,32px);justify-content:center}
html[data-site-navigation] #topnav .tn-links li{order:0}
html[data-site-navigation] #topnav .dt-link{font-size:10px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;min-height:44px}
html[data-site-navigation] #topnav .dt-link[aria-current]{color:var(--color-display);border-color:var(--color-display)}
.da-nav-statement{position:relative;font-size:9px;font-weight:300;line-height:1.4;text-transform:uppercase;letter-spacing:.13em;color:var(--color-text);padding-left:26px;flex-shrink:0}
.da-nav-statement:before{content:'';position:absolute;left:6px;top:0;width:1px;height:38px;background:var(--color-display);transform:rotate(32deg)}
html[data-site-navigation] #topnav .da-palette-label,html[data-site-navigation] #topnav .da-palette-caption{display:none}
html[data-site-navigation] #topnav .da-palette-cluster{margin:0;order:2}
html[data-site-navigation] #topnav .da-palette-switch{position:static;width:auto;height:auto;border:0;background:none}
html[data-site-navigation] #topnav .da-palette-toggle{min-width:44px;min-height:44px}
html[data-site-navigation] #topnav .da-nav-extra{display:none}
@media(max-width:1000px){
  html[data-site-navigation] #topnav .tn-wordmark{font-size:18px}
  html[data-site-navigation] #topnav .tn-mark{width:40px;height:40px}
  html[data-site-navigation] #topnav .tn-description{font-size:7px;letter-spacing:.35em}
  html[data-site-navigation] #topnav .tn-links{margin:0;gap:0;justify-content:flex-start}
  html[data-site-navigation] #topnav .dt-link{font-size:15px;min-height:48px}
  html[data-site-navigation] #topnav .da-nav-extra{display:list-item}
  .da-nav-statement{display:none}
}
@media(max-width:600px){
  html[data-site-navigation] #topnav{gap:10px}
  html[data-site-navigation] #topnav .tn-brand{gap:8px}
  html[data-site-navigation] #topnav .tn-mark{width:36px;height:36px}
  html[data-site-navigation] #topnav .tn-wordmark{font-size:clamp(12px,3.4vw,18px)}
}
/* Até 480px o menu é só o ícone (o nome segue para leitores de tela):
   marca, paleta, idioma e menu cabem sem cortar a borda. */
@media(max-width:480px){
  html[data-site-navigation] #topnav .tn-menu{width:44px;min-width:44px;padding:10px}
  html[data-site-navigation] #topnav .tn-menu>span:first-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
}
/* Sem letras guardadas a marca também precisa caber com os três controles.
   A regra da caixa já reduz a marca ao símbolo quando ela ocupa mais espaço. */
@media(max-width:360px){
  html:not(.da-has-caixa)[data-site-navigation] #topnav .tn-wordmark{width:min-content;white-space:normal;font-size:11px;line-height:1.15}
}
@media(scripting:none){html[data-site-navigation] #topnav .tn-links{flex-wrap:wrap;gap:8px 20px}html[data-site-navigation] #topnav .dt-link{font-size:12px}}