/* Bandeau d'engagements, posé entre deux filets. */
/* Chaque colonne garde sa marge droite, et la grille ouvre une gouttiere de
   meme largeur : le filet se retrouve au milieu, a egale distance des deux
   textes. Sans elle, le texte d'une colonne collait au filet de la
   precedente. En `column-gap` et non en `gap`, pour ne rien changer quand
   les colonnes s'empilent ; et sur la grille plutot qu'en marge gauche, qui
   desalignerait la premiere colonne d'une rangee repliee. */
.dec-engage{display:grid;grid-template-columns:repeat(var(--dec-col,4),minmax(0,1fr));gap:0;column-gap:26px;
 border-top:1px solid var(--trait);border-bottom:1px solid var(--trait);margin:46px 0}
.dec-engage div{padding:26px 26px 28px 0;border-right:1px solid var(--trait)}
.dec-engage div:last-child{border-right:0;padding-right:0}
.dec-engage .n{font-family:var(--mono);font-size:10px;letter-spacing:.17em;
 text-transform:uppercase;color:var(--gris);margin-bottom:10px}
.dec-engage .t{font-size:17px;font-weight:700;letter-spacing:-.025em;line-height:1.25;
 color:var(--encre)}
@media(max-width:1080px){
 .dec-engage{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Empilees, les colonnes echangent leur filet droit contre un filet bas :
   ce basculement manquait, le trait vertical restait en place. */
@media(max-width:760px){
 .dec-engage{grid-template-columns:1fr}
 .dec-engage div{border-right:0;border-bottom:1px solid var(--trait);
  padding-right:0}
 .dec-engage div:last-child{border-bottom:0}
}