/* En-tête horizontale et menu mobile — partagés par toutes les pages du site. */
/* Les jetons de couleur (--route, --craie…) sont définis par site.css, page.css ou legal.css. */

  /* --- menu burger (sous 1100px, là où la nav disparaissait) --- */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;
  background:none;border:1px solid rgba(26,21,18,.3);cursor:pointer;padding:0 11px;flex-shrink:0}
.burger span{display:block;height:2px;background:var(--nuit);transition:transform .22s,opacity .18s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1100px){.burger{display:flex}}

.menuM{position:fixed;inset:0;z-index:80;background:var(--papier);display:flex;flex-direction:column;padding:clamp(1.25rem,5vw,3rem);overflow-y:auto;overscroll-behavior:contain}
.menuM[hidden]{display:none}
.menuM__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:2rem}
.menuM ol{list-style:none;display:grid;gap:.15rem;flex:1;align-content:start}
.menuM li{border-bottom:1px solid rgba(26,21,18,.18)}
.menuM a{display:flex;align-items:baseline;gap:1rem;padding:1.05rem .25rem;text-decoration:none;
  font-family:var(--display);font-size:1.6rem;font-weight:700;text-transform:uppercase;line-height:1}
.menuM a b{font-family:var(--mono);font-size:.62rem;font-weight:400;color:#8A6314;letter-spacing:.1em;min-width:1.6rem}
.menuM a:hover,.menuM a:focus-visible{color:#8A6314}
.menuM__foot{margin-top:2rem;display:grid;gap:.6rem}
.menuM__foot .btn{justify-content:center}
.menuM__legal{display:flex;flex-wrap:wrap;gap:.5rem 1.1rem;margin-top:1.2rem;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--brume)}
.menuM__legal a{font-size:inherit;font-family:inherit;font-weight:400;text-transform:uppercase;padding:0;display:inline}


/* ═══════════════ EN-TÊTE HORIZONTALE ═══════════════ */
.entete{position:sticky;top:0;z-index:60;background:rgba(251,247,239,.97);backdrop-filter:blur(12px);border-bottom:1px solid rgba(26,21,18,.14)}
.entete__in{max-width:1280px;margin:0 auto;padding:.7rem var(--pad);display:flex;align-items:center;gap:1.6rem}
.entete .mark{font-size:1.28rem;flex-shrink:0}
.menus{display:flex;align-items:center;gap:.2rem;list-style:none;margin:0 auto 0 .8rem;padding:0}
.menus>li{position:relative}
.menus>li>a,.menus__b{display:inline-flex;align-items:center;gap:.4rem;background:none;border:none;cursor:pointer;
  font-family:var(--mono);font-size:.69rem;letter-spacing:.09em;text-transform:uppercase;color:#5C5147;
  text-decoration:none;padding:.7rem .75rem;transition:color .15s}
.menus>li>a:hover,.menus__b:hover,.menus__b[aria-expanded="true"]{color:var(--nuit)}
.menus>li>a[aria-current="page"]{color:#8A6314}
.menus__b::after{content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-1px);transition:transform .18s}
.menus__b[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-2px)}

.tiroir{position:absolute;top:100%;left:0;z-index:70;min-width:270px;background:#FFFFFF;border:1px solid rgba(26,21,18,.14);padding:.4rem;display:grid;gap:1px;box-shadow:0 18px 42px rgba(26,21,18,.16)}
.tiroir[hidden]{display:none}
.tiroir a{display:block;padding:.7rem .8rem;text-decoration:none;transition:background .13s}
.tiroir a:hover,.tiroir a:focus-visible{background:#FBF7EF}
.tiroir b{display:block;font-family:var(--display);font-size:1.05rem;font-weight:700;text-transform:uppercase;
  line-height:1.1;color:var(--nuit)}
.tiroir a[aria-current="page"] b{color:#8A6314}
.tiroir em{display:block;font-style:normal;font-size:.8rem;color:#5C5147;margin-top:.15rem;line-height:1.45}
.entete__cta{flex-shrink:0;padding:.72rem 1.1rem;font-size:.68rem}

/* la route, en horizontal, sous l'en-tête */
.fil{background:var(--craie);border-bottom:1px solid rgba(26,21,18,.12);overflow-x:auto;scrollbar-width:none}
.fil::-webkit-scrollbar{display:none}
.fil__in{max-width:1280px;margin:0 auto;padding:0 var(--pad);display:flex;align-items:center;
  position:relative;min-height:42px;gap:0}
.fil__in::before{content:"";position:absolute;left:var(--pad);right:var(--pad);top:50%;height:2px;transform:translateY(-50%);
  background:repeating-linear-gradient(90deg,rgba(181,122,21,.45) 0 9px,transparent 9px 18px)}
.fil a{position:relative;flex:1 0 auto;display:flex;flex-direction:column;align-items:center;gap:.22rem;
  padding:.45rem .7rem;text-decoration:none;min-width:76px}
.fil i{font-style:normal;width:9px;height:9px;border-radius:50%;background:var(--nuit);
  border:2px solid rgba(181,122,21,.5);transition:.15s}
.fil span{font-family:var(--mono);font-size:.5rem;letter-spacing:.1em;text-transform:uppercase;color:#6E6259;white-space:nowrap}
.fil a:hover i{background:var(--route);border-color:var(--route)}
.fil a:hover span{color:var(--brume)}
.fil a[aria-current="page"] i{background:var(--route);border-color:var(--route);transform:scale(1.4)}
.fil a[aria-current="page"] span{color:#8A6314}

@media(max-width:1100px){
  .menus,.entete__cta{display:none}
  .entete__in{justify-content:space-between;gap:1rem}
  .fil{display:none}
}
.page{min-height:100vh;display:flex;flex-direction:column}


/* boutons — repris ici pour que l'en-tête soit autonome sur toutes les pages */
.entete .btn,.menuM .btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;padding:.9rem 1.4rem;border:1px solid transparent;transition:transform .18s,filter .18s;cursor:pointer}
.entete .btn:hover,.menuM .btn:hover{transform:translateY(-2px)}
.entete .btn--wa,.menuM .btn--wa{background:var(--route);color:#1A1512}
.entete .btn--wa:hover,.menuM .btn--wa:hover{filter:brightness(1.1)}
.menuM .btn--ghost{border-color:currentColor;opacity:.85;background:none;color:inherit}
.menuM .btn--ghost:hover{background:currentColor;color:var(--nuit);opacity:1}
.entete .btn svg,.menuM .btn svg{width:15px;height:15px;fill:currentColor;flex-shrink:0}

/* ═══ HORIZON ═══ en-tête clair. L'or vif n'est lisible que sur le sombre :
   ici on emploie l'or foncé (--or-texte), qui tient 5,4:1 sur crème. */
.entete .mark{color:var(--nuit)}
.entete .btn--wa{color:#1A1512}
.fil a span{color:var(--brume)}
.fil a[aria-current] i{background:var(--or)}
.fil a[aria-current] span{color:var(--or-texte)}

/* ── menu mobile : mêmes sections que la barre du haut ──
   Sous 1100 px la barre disparaît ; sans ces règles le burger sortait une
   liste à plat, et la navigation changeait de forme d'un écran à l'autre. */
.menuM nav{flex:1}
.menuM__sec{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:#8A6314;margin:1.7rem 0 .3rem}
.menuM nav > .menuM__sec:first-child{margin-top:0}
.menuM__sec a{font:inherit;color:inherit;padding:0;display:inline;letter-spacing:inherit}
.menuM ul{list-style:none;display:grid;gap:0;margin:0}
.menuM ul a{display:block;padding:.8rem .25rem;font-family:var(--display);
  font-size:1.22rem;font-weight:700;text-transform:uppercase;line-height:1.12}
.menuM ul a b{font-family:inherit;font-size:inherit;font-weight:inherit;
  color:inherit;letter-spacing:inherit;min-width:0;display:block}
.menuM ul a em{display:block;font-family:var(--body);font-size:.78rem;font-weight:400;
  font-style:normal;text-transform:none;letter-spacing:0;color:var(--brume);margin-top:.2rem}