/* Sous 1141 px : bouton de menu dessiné, panneau animé, accordéons. Chargé après en-tete.css et mega-menu.css, qu'il surcharge. */
@media (max-width:1140px){
  .mast > .wrap{min-height:66px;gap:12px}
  .logo img{height:36px}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:#fff;border-bottom:2px solid var(--navy);display:none;
    padding:6px var(--pad) 22px}
  .nav[data-open="true"]{display:flex}
  .nav__i{display:block;border-bottom:1px solid var(--line-s)}
  .nav__b,.nav__lk{width:100%;padding:16px 0;font-size:1rem;justify-content:space-between}
  .nav__lk{display:flex;border-bottom:1px solid var(--line-s)}
  .nav__b::after,.nav__lk::after{left:0;right:auto;width:26px;bottom:0}
  .mm{position:static;border:0;box-shadow:none;background:var(--wash);
    border-bottom:1px solid var(--line-s)}
  .mm__in{display:block;padding:14px 0 20px}
  .mm__cols{display:block}
  .mm__col + .mm__col{margin-top:18px}
  .mm__l a{padding-left:11px;border-left-color:var(--line)}
  .mm__hi{margin-top:18px}
  .mm__hiph{display:none}
  .tools{border-left:0;padding-left:0;margin-left:0;margin-top:16px;gap:10px}
  .tools .btn{flex:1} .icobtn{margin-right:0}
  .burger{display:inline-flex}
}

/* ================= mobile : barre utilitaire, bouton de menu, menu animé ================= */
.burger{display:none;place-items:center;width:52px;height:52px;padding:0;border:0;gap:0;
  background:var(--navy);align-self:center;margin-left:auto;cursor:pointer;
  transition:background .2s}
.burger:hover,.burger[aria-expanded="true"]{background:var(--blue)}
/* Trois traits égaux, comme partout : la barre du milieu plus courte et bleue se lisait comme une icône de liste. */
.burger__l{position:relative;display:block;width:24px;height:18px}
.burger__l i{position:absolute;left:0;height:2px;width:24px;background:#fff}
.burger__l i:nth-child(1){top:0}
.burger__l i:nth-child(2){top:8px;transform-origin:center}
.burger__l i:nth-child(3){top:16px}

/* L'ouverture se lit en deux temps : les traits se rejoignent, puis se croisent ; la fermeture fait l'inverse.
   Les deux traits extérieurs bougent par `top` puis par `transform`, celui du milieu se rétracte depuis son centre. */
.burger__l i:nth-child(1),.burger__l i:nth-child(3){
  transition:top .2s cubic-bezier(.3,0,.2,1) .2s,transform .22s cubic-bezier(.3,0,.2,1)}
.burger__l i:nth-child(2){transition:transform .16s ease .12s,opacity .12s ease .12s}
.burger[aria-expanded="true"] .burger__l i:nth-child(1),
.burger[aria-expanded="true"] .burger__l i:nth-child(3){
  top:8px;transition:top .2s cubic-bezier(.3,0,.2,1),transform .22s cubic-bezier(.3,0,.2,1) .18s}
.burger[aria-expanded="true"] .burger__l i:nth-child(1){transform:rotate(45deg)}
.burger[aria-expanded="true"] .burger__l i:nth-child(3){transform:rotate(-45deg)}
.burger[aria-expanded="true"] .burger__l i:nth-child(2){transform:scaleX(0);opacity:0;transition-delay:0s}

/* Fermé, le survol écarte les traits d'un pixel : le bouton répond sans bouger de place */
.burger[aria-expanded="false"]:hover .burger__l i:nth-child(1){top:-1px}
.burger[aria-expanded="false"]:hover .burger__l i:nth-child(3){top:17px}
/* La règle générale de base.css raccourcit les durées, pas les retards : ici, les deux temps s'effacent aussi */
@media (prefers-reduced-motion:reduce){.burger__l i{transition-delay:0s!important}}
@keyframes mmIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (max-width:1140px){
  .burger{display:grid}
  .nav{display:flex;visibility:hidden;opacity:0;clip-path:inset(0 0 100% 0);
    transform:translateY(-6px);max-height:calc(100vh - 67px);max-height:calc(100dvh - 67px);
    overflow-y:auto;overscroll-behavior:contain;
    box-shadow:0 28px 40px -30px rgba(21,42,56,.7);
    transition:clip-path .42s cubic-bezier(.22,.72,.28,1),opacity .24s ease,
      transform .42s cubic-bezier(.22,.72,.28,1),visibility 0s linear .42s}
  .nav[data-open="true"]{visibility:visible;opacity:1;clip-path:inset(0 0 0 0);transform:none;
    transition-delay:0s}
  .nav > *{opacity:0;transform:translateY(12px);
    transition:opacity .3s ease,transform .42s cubic-bezier(.22,.72,.28,1)}
  .nav[data-open="true"] > *{opacity:1;transform:none}
  .nav[data-open="true"] > :nth-child(1){transition-delay:.08s}
  .nav[data-open="true"] > :nth-child(2){transition-delay:.125s}
  .nav[data-open="true"] > :nth-child(3){transition-delay:.17s}
  .nav[data-open="true"] > :nth-child(4){transition-delay:.215s}
  .nav[data-open="true"] > :nth-child(5){transition-delay:.26s}
  .nav[data-open="true"] > :nth-child(6){transition-delay:.305s}
  .mm:not([hidden]){animation:mmIn .3s cubic-bezier(.22,.72,.28,1)}
}