/* Mise en route en carrousel (19/10), téléphone seulement : les trois étapes deviennent des cartes à glisser,
   la suivante dépasse, des points (44 px) suivent le défilement. La frise animée d'onboarding.js garde ses
   numéros. Ordinateur et tablette inchangés.
   Pour retirer : supprimer ce fichier, mise-en-route-carrousel.js et leurs deux lignes dans index.html. */
.mer-dots{display:none}
@media(max-width:759px){
 html .ob-section .ob-steps{display:flex;gap:12px;margin:0 -20px;padding:4px 20px 18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 html .ob-section .ob-steps::-webkit-scrollbar{display:none}
 html .ob-section .ob-steps:before,html .ob-section .ob-steps:after{display:none}
 html .ob-section .ob-steps li{flex:0 0 78%;display:block;scroll-snap-align:start;box-sizing:border-box;min-height:220px;padding:20px 20px 22px;border:1px solid #2f382d1a;border-radius:22px;background:#fffaf2;box-shadow:0 14px 30px -22px #2f382d66}
 html .ob-section .ob-steps li:hover{transform:none}
 html .ob-section .ob-steps .ob-dot{margin:0 0 18px}
 html .ob-section .ob-steps h3{font-size:26px;margin-bottom:8px}
 .mer-dots{display:flex;justify-content:center;gap:0;margin:-6px 0 6px}
 .mer-dots button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;cursor:pointer}
 .mer-dots button:before{content:"";width:8px;height:8px;border-radius:99px;background:#2f382d33;transition:width .3s,background-color .3s}
 .mer-dots button[aria-current=true]:before{width:22px;background:var(--terra)}
 .mer-dots button:focus-visible{outline:2px solid var(--terra);outline-offset:-6px;border-radius:12px}
}
