/* En-tête : le logo complet, et le menu en étiquettes de prix pendues à une ficelle. Hauteur fixe (pas de saut au défilement). */
.entete { position: sticky; top: 0; z-index: 50; background: var(--papier); border-bottom: 3px double var(--encre); }
.entete::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 9px;                        /* l'auvent rayé */
  background: repeating-linear-gradient(90deg, var(--moutarde) 0 24px, var(--canard) 24px 48px); }
.entete-in { display: flex; align-items: center; gap: 22px; height: 92px; padding-top: 9px; }
.entete .marque { flex: none; display: block; }
.entete .marque img { width: 70px; height: 70px; }
.menu { margin-left: auto; position: relative; }
.menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; position: relative; }
.menu ul::before { content: ""; position: absolute; left: -6px; right: -6px; top: -3px; height: 14px;                  /* la ficelle */
  border-bottom: 1.5px solid var(--encre); border-radius: 0 0 50% 50% / 0 0 100% 100%; opacity: .7; }
.menu li { position: relative; padding-top: 12px; }
.menu li::before { content: ""; position: absolute; left: 50%; top: 2px; width: 1.5px; height: 12px; background: var(--encre); opacity: .7; }
.menu a { display: block; position: relative; padding: 6px 12px 6px 22px; background: var(--carte); color: var(--encre); text-decoration: none;
  font-family: var(--etiquette); font-weight: 500; font-size: 16px; letter-spacing: .03em; transform-origin: 50% -12px;
  clip-path: polygon(12px 0, 100% 0, 100% 100%, 12px 100%, 0 50%); box-shadow: inset 0 0 0 1.5px var(--ligne); transition: transform .3s ease; }
.menu a::before { content: ""; position: absolute; left: 9px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--papier);
  box-shadow: inset 0 0 0 1.2px var(--doux); }
.menu li:nth-child(odd) a { transform: rotate(-2deg); }
.menu li:nth-child(even) a { transform: rotate(1.6deg); }
.menu a:hover, .menu a:focus-visible { animation: balance .9s ease; background: var(--moutarde-c); }
.menu a[aria-current="page"] { background: var(--brique); color: var(--carte); box-shadow: none; }
.menu a[aria-current="page"]::before { background: var(--papier); }
@keyframes balance { 0% { transform: rotate(0); } 25% { transform: rotate(6deg); } 50% { transform: rotate(-4deg); } 75% { transform: rotate(2deg); } 100% { transform: rotate(0); } }
.entete .appli { flex: none; }
.entete .appli .btn { min-height: 46px; font-size: 16px; padding: 10px 18px 10px 30px; }
.bouton-menu { display: none; margin-left: auto; background: none; border: 2px solid var(--encre); color: var(--encre); font-family: var(--etiquette);
  font-weight: 600; font-size: 16px; letter-spacing: .05em; padding: 8px 14px; cursor: pointer; }
@media (max-width: 1080px) {
  .entete-in { height: 76px; gap: 12px; }
  .entete .marque img { width: 58px; height: 58px; }
  .bouton-menu { display: inline-flex; }
  .entete .appli { display: none; }
  .menu { position: fixed; left: 0; right: 0; top: 79px; bottom: 0; margin: 0; background: var(--papier); padding: 24px var(--gouttiere) 40px;
    transform: translateY(-110%); visibility: hidden; transition: transform .35s ease, visibility 0s .35s; overflow-y: auto; border-top: 3px double var(--encre); }
  .menu.ouvert { transform: none; visibility: visible; transition: transform .35s ease; }
  .menu ul { flex-direction: column; gap: 14px; }
  .menu ul::before, .menu li::before { display: none; }
  .menu li { padding: 0; }
  .menu a { font-size: 21px; padding: 12px 18px 12px 30px; }
  .menu .appli-mobile { display: block; margin-top: 26px; }
}
@media (min-width: 1081px) { .menu .appli-mobile { display: none; } }
