/* Réglages communs pour les écrans tactiles */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

img,
video {
  max-width: 100%;
}

@media (min-width: 861px) and (max-width: 1180px) {
  .nav-inner {
    gap: 0.55rem !important;
  }

  .nav-logo {
    font-size: 0.9rem !important;
    white-space: nowrap;
  }

  .nav-links {
    gap: 0.55rem !important;
  }

  .nav-links a {
    font-size: 0.72rem !important;
    letter-spacing: 0.04em !important;
  }
}

@media (max-width: 860px) {
  .sh-burger {
    border: 2px solid #e8bf6a !important;
    background: rgba(232, 191, 106, 0.16) !important;
    width: 48px !important;
    height: 48px !important;
    box-shadow: 0 0 12px rgba(232, 191, 106, 0.24);
  }

  .sh-burger span {
    width: 26px !important;
    height: 3px !important;
    background-color: #ffd873 !important;
  }

  .sh-burger:focus-visible {
    outline: 3px solid #ffd873;
    outline-offset: 3px;
  }

  body {
    font-size: 1rem !important;
  }

  body p,
  body li,
  body td,
  body blockquote {
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  h1:not(.hero-logo) {
    font-size: clamp(2rem, 5.2vw, 2.8rem) !important;
    line-height: 1.1 !important;
  }

  h2,
  .section-head-title,
  .marker-title,
  .toc-title,
  .section-title {
    font-size: clamp(1.4rem, 3.4vw, 2rem) !important;
    line-height: 1.2 !important;
  }

  main img,
  .section-illustration {
    max-height: min(52vh, 420px);
    object-fit: contain;
  }

  table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 600px) {
  body p,
  body li,
  body td,
  body blockquote {
    font-size: 0.96rem !important;
  }

  h1:not(.hero-logo) {
    font-size: clamp(1.8rem, 7vw, 2.35rem) !important;
  }

  .hero-logo {
    font-size: clamp(2.8rem, 12vw, 4rem) !important;
  }

  main img,
  .section-illustration {
    max-height: min(46vh, 340px);
  }
}