/* En-tête commun à toutes les pages (posé par appliquer-comptoir.py) :
   logo (logo_partout), menu principal et trait de rubrique (nav_partout,
   comptoir-clair/entete.js). */
a.logo-sp{display:inline-flex;align-items:center;font-family:var(--sp-police-titre);font-weight:800;font-size:25px;line-height:1;letter-spacing:-1px;color:var(--sp-encre);text-decoration:none;white-space:nowrap}
a.logo-sp span{color:var(--sp-foret);font-weight:700}
a.logo-sp i{display:inline-flex;flex:none;margin-left:9px;color:var(--sp-bronze);font-size:30px;line-height:1;font-style:normal}
a.logo-sp:hover,a.logo-sp:hover span{color:inherit}
a.logo-sp:hover span{color:var(--sp-foret)}
a.logo-sp:focus-visible{outline:2px solid var(--sp-foret);outline-offset:4px;border-radius:2px}
footer a.logo-sp{font-size:21px}
footer a.logo-sp i{font-size:25px;margin-left:8px}
@media (max-width:600px){
  a.logo-sp{font-size:22px}
  a.logo-sp i{font-size:27px;margin-left:7px}
  /* Fiches et pages texte : logo, compte et panier sur une seule ligne. */
  .barre a.logo-sp{font-size:17px;letter-spacing:-.7px}
  .barre a.logo-sp i{font-size:21px;margin-left:5px}
}

/* Menu principal : un trait glisse sous la rubrique active. */
.nav-sp{position:relative}
.nav-sp a[aria-current="page"]{color:var(--sp-foret)}
.nav-sp-trait{position:absolute;left:0;bottom:0;width:0;height:2px;border-radius:2px;background:var(--sp-bronze);opacity:0;pointer-events:none;
  transition:transform .35s cubic-bezier(.3,.7,.2,1),width .35s cubic-bezier(.3,.7,.2,1),opacity .2s}
.nav-sp.nav-sp-fixe .nav-sp-trait{transition:none}
/* Pages à barre (fiches, documents, compte, pages texte). */
.barre .nav-sp{display:flex;align-items:center;gap:20px;margin:0 auto 0 14px;padding:9px 0;font-family:var(--sp-police-texte);font-size:13px;letter-spacing:0;text-transform:none}
.barre .nav-sp a{color:var(--sp-encre);text-decoration:none;white-space:nowrap;padding:3px 0}
.barre .nav-sp a:hover{color:var(--sp-bronze)}
.barre .nav-sp a[aria-current="page"]{color:var(--sp-foret)}
@media (max-width:1150px){
  .barre .nav-sp{order:4;flex:1 0 100%;margin:0;padding:4px 0 8px;overflow-x:auto;scrollbar-width:none}
  .barre .nav-sp::-webkit-scrollbar{display:none}
}
@media (max-width:600px){.barre .nav-sp{gap:20px}}
/* Passage d'une rubrique à l'autre sans écran blanc (navigateurs récents). */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.2s}
/* L'en-tête, le même sur toutes les pages, reste en place : seul le contenu
   passe en fondu (le trait du menu glisse vers la nouvelle rubrique). */
body>header,body>.barre{view-transition-name:sp-entete}
::view-transition-old(sp-entete){display:none}
::view-transition-group(sp-entete),::view-transition-new(sp-entete){animation:none}
@media (prefers-reduced-motion:reduce){
  .nav-sp-trait{transition:none}
  @view-transition{navigation:none}
}