/* Shared responsive safeguards. Page-specific visual design remains in each view. */
*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; overflow-x: clip; -webkit-text-size-adjust: 100%; }
body { max-width: 100%; overflow-x: clip; }
img, picture, video, iframe, canvas, svg { max-width: 100%; }
img { height: auto; }
input, select, textarea, button { max-width: 100%; font: inherit; }
textarea { resize: vertical; }
pre, code { white-space: pre-wrap; overflow-wrap: anywhere; }
table { max-width: 100%; }
@media (max-width: 760px) {
  body { min-width: 0; }
  main, section, article, footer { min-width: 0; }
  h1 { overflow-wrap: anywhere; }
  input, select, textarea { min-width: 0; }
  .barre, .contenu, .container, .conteneur { max-width: 100%; }
  .actions, .boutons, .button-group { flex-wrap: wrap; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 420px) {
  .barre { gap: 10px; }
  .logo-texte { overflow-wrap: anywhere; }
  button, .btn, a.btn { min-height: 42px; }
}