/* Aanvullingen voor kleine schermen. Het ontwerp gebruikt inline-stijlen, daarom !important. */
html { -webkit-text-size-adjust: 100%; }
img { max-width: 100%; }
@media (max-width: 820px) {
  .wrap { padding: 0 20px !important; }
  header .wrap { height: auto !important; flex-wrap: wrap !important; gap: 10px 14px !important; padding-top: 12px !important; padding-bottom: 8px !important; }
  header nav { order: 3; flex: 1 1 100% !important; margin: 0 !important; overflow-x: auto; gap: 22px !important; padding: 4px 0 6px; scrollbar-width: none; }
  header nav::-webkit-scrollbar { display: none; }
  header nav a { white-space: nowrap; }
  header button[aria-label^="Taal"] { display: none !important; }
  header .wrap > a:last-of-type { margin-left: auto; }
  h1 { font-size: clamp(36px, 10vw, 46px) !important; line-height: 1.1 !important; }
  h2 { font-size: clamp(26px, 7.5vw, 34px) !important; line-height: 1.2 !important; }
  h3 { font-size: 22px !important; }
  section { padding-top: 56px !important; padding-bottom: 56px !important; }
  section .wrap[style*="min-height"] { min-height: 0 !important; }
  [style*="flex:1 1 520px"], [style*="flex: 1 1 520px"], [style*="flex:1 1 560px"], [style*="flex:1 1 380px"], [style*="flex:1 1 340px"], [style*="flex:1 1 320px"] { flex-basis: 100% !important; min-width: 0 !important; }
  [role="img"][style*="width:310px"], [style*="width:310px;height:620px"] { transform: scale(.86); transform-origin: top center; margin-bottom: -80px; }
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .toc { position: static !important; flex-basis: 100% !important; }
  p { font-size: max(16px, 1em); }
  [role="img"] { max-width: 100% !important; overflow: hidden !important; }
  main, body > div { overflow-x: hidden; }
}

/* Taalknop verborgen tot de nieuwe pagina's vertaald zijn */
header button[aria-label^="Taal"] { display: none !important; }

/* Inhoudsopgave-sprong niet onder de vaste menubalk */
h2[id], section[id] { scroll-margin-top: 96px; }
