/* Ingang op de openbare pagina's (T-083, D-082). Werkt op de calculator (--ink/--bg/--line) en op basis.html (--tekst/--vlak/--rand). */
.ingang { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.ingang-knop {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px;
  border: 1px solid var(--rand, var(--line)); border-radius: 6px; background: transparent;
  color: var(--tekst, var(--ink)); font: inherit; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.ingang-knop--primair { background: var(--tekst, var(--ink)); border-color: var(--tekst, var(--ink)); color: var(--vlak, var(--bg)); }
.ingang-knop:hover { text-decoration: underline; }
.ingang-knop:focus-visible { outline: 2px solid var(--tekst, var(--ink)); outline-offset: 2px; }
.ingang-knop[aria-current="page"] { text-decoration: underline; text-underline-offset: 3px; }
.ingang-naam { max-width: 18ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tekst, var(--ink)); }
.ingang-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.kopbalk--ingang .merk { min-width: 0; }
@media (max-width: 599.98px) {
  .ingang { gap: 6px; }
  .ingang-knop { min-height: 44px; padding: 0 10px; font-size: 14px; }
}
@media (max-width: 419.98px) {
  .ingang-naam { display: none; }
  .kopbalk--ingang .merk img { max-width: 110px; }
  .kopbalk--ingang .merk span { overflow: hidden; text-overflow: ellipsis; }
}
