/* En-tête commun au site et à l'atlas : la première rangée reprend
   exactement le bandeau de thierrystpierre.com, la seconde porte la
   navigation propre à l'atlas. La hauteur totale est relue par
   atlas-shell.js (--atlas-header-h), la carte se cale donc dessous.
   Les couleurs sont écrites en clair : certaines pages de l'atlas redéfinissent
   --line ou --bg pour leur propre usage, et l'en-tête doit rester identique
   d'une page à l'autre. Valeurs de assets/site/styles/tokens.css du site. */

.atlas-header{
  --e-panel:#ffffff;
  --e-panel-2:#f7f9fa;
  --e-ink:#0e1417;
  --e-mut:#61707a;
  --e-line:#d5dde1;
  --e-acc:#1b4965;
}

.atlas-header.site-header{
  display:block;
  padding:0;
  gap:0;
  background:var(--e-panel) !important;
  border-top:0 !important;
  border-bottom:1px solid var(--e-line) !important;
  box-shadow:none !important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  font-family:"Archivo",system-ui,sans-serif;
}

.atlas-header .rangee{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:0 26px;
}
.atlas-header .rangee-site{height:54px}
.atlas-header .rangee-atlas{
  height:38px;
  background:var(--e-panel-2);
  border-top:1px solid var(--e-line);
}

.atlas-header .mark{font-family:"IBM Plex Mono",monospace;font-size:12.5px;font-weight:500;
  color:var(--e-ink);text-decoration:none}
.atlas-header .mark span{color:var(--e-mut)}

.atlas-header nav{display:flex;gap:1px;flex-wrap:nowrap}
.atlas-header nav a{
  font-family:"IBM Plex Mono",monospace;
  font-size:11.7px;
  font-weight:400;
  letter-spacing:0;
  text-transform:none;
  color:var(--e-mut);
  text-decoration:none;
  padding:5px 9px;
  border:0;
  border-radius:2px;
  transition:color .15s,background .15s;
}
.atlas-header nav a:hover{color:var(--e-ink);background:var(--e-panel-2);border:0}
.atlas-header nav a[aria-current]{color:var(--e-acc);border:0}
.atlas-header .rangee-atlas nav a:hover{background:var(--e-panel)}

.atlas-header .atlas-title{
  justify-self:auto;
  font-family:"IBM Plex Mono",monospace;
  font-size:10.2px;
  font-weight:400;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--e-mut);
  white-space:nowrap;
}

@media (max-width:820px){
  .atlas-header .rangee{padding:0 14px}
  .atlas-header nav{overflow-x:auto;scrollbar-width:none}
  .atlas-header nav::-webkit-scrollbar{display:none}
  .atlas-header .atlas-title{display:none}
  .atlas-header .rangee-atlas{justify-content:flex-start}
}

.atlas-header.site-header::before,.atlas-header.site-header::after{display:none !important}