/* En-tête sur deux lignes : ligne 1 logo centré, ligne 2 menu + FR EN PT centrés (30 oct 2026).
   Chargé après premium.css / site.css / thèmes. Variante A : header.hdr-a ; variante B : header.hdr-b.
   Deux polices seulement (Inter pour le menu ; le logo est une image). Pas d'en-tête collant (comme avant). */
header.hdr2{--logo-h:54px;--tap:44px}
header.hdr2 .wrap{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;height:auto;max-width:none;margin:0 auto;padding:0 var(--gut)}
header.hdr2 .logo{display:block;padding:20px 0 4px;line-height:0}
header.hdr2 .logo img,header.hdr2 .logo-img{display:block;height:var(--logo-h);width:auto}
header.hdr2 .nav{display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;gap:0 36px;width:100%;margin:0;padding:0 0 6px;
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1}
header.hdr2 .nav > :first-child{margin-left:auto}
header.hdr2 .nav > :last-child{margin-right:auto}
header.hdr2 .nav a,header.hdr2 .langs a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0;border:0;white-space:nowrap;
  font-size:12px;font-weight:600;letter-spacing:inherit;color:var(--ink);text-decoration:none;text-underline-offset:6px;text-decoration-thickness:1px}
header.hdr2 .nav a:hover{text-decoration:underline}
header.hdr2 .nav .hide-m{display:inline-flex}
header.hdr2 .langs{display:flex;align-items:center;gap:0 14px;padding:0;border:0;flex:none}
header.hdr2 .langs::before{content:"";width:1px;height:16px;background:var(--line);margin-right:14px}
header.hdr2 .langs a{color:var(--mute)}
header.hdr2 .langs a.on{color:var(--ink)}
/* Accueil A : pas de logo dans l'en-tête, seulement la ligne de menu */
header.hdr-a .nav:first-child{padding-top:4px}
/* A, pages hors accueil : plus d'air entre le logo et le menu (Marc, 30 oct 21h49) */
header.hdr-a .logo{padding-bottom:26px}

/* B : logo nettement plus grand */
header.hdr-b{--logo-h:96px}
header.hdr-b .logo{padding:24px 0 6px}

/* Hauteur d'en-tête utilisée par l'ouverture photo de l'accueil (home-hero.css) */
body.hdr2-a.v2-home .hero.hero-full{min-height:calc(100svh - 58px)}
body.hdr2-b.v2-home .hero.hero-full{min-height:calc(100svh - 176px)}

@media (max-width:860px){
  header.hdr2{--logo-h:40px}
  header.hdr2 .logo{padding:14px 0 2px}
  header.hdr-a .logo{padding-bottom:18px}
  header.hdr2 .nav{gap:0 22px;letter-spacing:.12em;padding-bottom:4px}
  header.hdr2 .langs{gap:0 12px}
  header.hdr2 .langs::before{margin-right:12px}
  /* Menu mobile : plus de bande qui défile. Le menu passe sur deux lignes centrées,
     coupure fixe après le 4e lien : ligne 1 Coaching Guides Blog Recettes, ligne 2 Ebook About | FR EN PT.
     Aucun mot coupé, langues toujours visibles, pas d'indice de défilement nécessaire. */
  header.hdr-a{--tap:40px}
  header.hdr-a .nav{flex-wrap:wrap;justify-content:center;row-gap:0;column-gap:22px;overflow:visible;width:auto;align-self:stretch;margin:0 -12px;padding:0 0 4px;-webkit-mask-image:none;mask-image:none}
  /* le menu peut mordre de 12 px sur chaque marge latérale : marge de sécurité pour la ligne 1 */
  header.hdr-a .nav > :first-child,header.hdr-a .nav > :last-child{margin-left:0;margin-right:0}
  header.hdr-a .nav > a:nth-child(-n+4){order:1}
  header.hdr-a .nav::after{content:"";flex:0 0 100%;height:0;order:2}
  header.hdr-a .nav > a:nth-child(n+5){order:3}
  header.hdr-a .nav > .langs{order:4}
  header.hdr-a .nav:first-child{padding-top:4px}
  /* B : le menu passe sur deux lignes centrées, tout reste visible */
  header.hdr-b{--logo-h:64px;--tap:40px}
  header.hdr-b .logo{padding:16px 0 4px}
  header.hdr-b .nav{flex-wrap:wrap;justify-content:center;gap:0 20px;padding-bottom:6px}
  header.hdr-b .nav > :first-child,header.hdr-b .nav > :last-child{margin:0}
  body.hdr2-a.v2-home .hero.hero-full{min-height:calc(100svh - 88px)} /* en-tête accueil mobile : 2 lignes de menu, 88 px */
  body.hdr2-b.v2-home .hero.hero-full{min-height:calc(100svh - 170px)}
}
@media (max-width:380px){
  header.hdr2 .nav{letter-spacing:.1em}
  header.hdr-b .nav{gap:0 16px}
  header.hdr-a .nav{column-gap:18px}
}
