/*
  Correcties op evers.css. Dat bestand is de gebouwde stylesheet van de vorige
  site en blijft daarom onaangeroerd, zodat het byte-voor-byte te vergelijken
  blijft met wat er live staat. Alles wat we er aan willen veranderen komt
  hier, en dit bestand wordt erna geladen.
*/

/*
  Het scrollen zat op de lijst zelf. Zodra die scrollbalk verscheen nam hij
  15px breedte weg van de tekst, en dan brak een item als DE PRAKTIJK over twee
  regels. Twee regels zijn hoger dan een, dus de lijst werd nog langer en de
  scrollbalk bleef. Het paneel scrollt nu, de lijst niet meer.
*/
.off__canvas-menu {
    overflow-x: hidden;
    overflow-y: auto;
}

.header__section .menu,
.off__canvas-menu .close-x {
    appearance: none;
    padding: 0;
    border: 0;
    background: transparent;
}

.off__canvas-menu ul {
    max-height: none;
    overflow: visible;
}

.off__canvas-menu ul li a {
    white-space: nowrap;
}

.off__canvas-menu ul li:last-child {
    margin-bottom: 0;
}

/*
  De breedte van het paneel blijft precies zoals op de vorige site: volledige
  breedte tot 520px, daarboven vast op 520px en vanaf 1101px op 510px. Dat de
  pagina daardoor tussen 520px en 620px naast het menu zichtbaar blijft, is
  bewust en hoort zo.

  De lettergrootte sprong daar wel van 20px naar 32px. Die sprong loopt nu door
  over de tussenliggende breedtes, met dezelfde ankerpunten als het ontwerp:
  20px op 375px, 32px vanaf 620px en 36px op 1440px. De regelafstand volgt de
  letter met de 8px speling die de opmaak al had (28px bij 20px, 40px bij 32px).
*/
.off__canvas-menu ul li {
    font-size: clamp(20px, 4.9vw + 1.6px, 32px);
    line-height: calc(1em + 8px);
    letter-spacing: 0.22em;
}

@media (min-width: 1101px) {
    .off__canvas-menu ul li {
        font-size: clamp(32px, 1.2vw + 18.8px, 36px);
    }
}

/*
  Vanaf 1101px staat het menu op 36px met 130px ruimte erboven. Samen is dat
  meer dan een laag venster hoog is. De witruimte krimpt daarom mee, in plaats
  van dat het menu gaat scrollen.
*/
@media (min-width: 1101px) and (max-height: 800px) {
    .off__canvas-menu {
        padding-top: 96px;
    }

    .off__canvas-menu ul li {
        margin-bottom: 12px;
    }
}

@media (min-width: 520px) and (max-width: 1100px) and (max-height: 520px) {
    .off__canvas-menu {
        padding-top: 40px;
    }

    .off__canvas-menu ul li {
        margin-bottom: 0;
    }
}

/*
  Filament RichEditor (TipTap) zet tekst in list items in een <p>. De oude
  Voyager-HTML deed dat niet. Zonder deze reset winnen de globale p-stijlen
  (museo-sans, font-weight 200, padding-bottom 16px, andere line-height) van
  de li-stijlen (MarkPro, font-weight 600). Links in die <p> krijgen via
  p a per ongeluk italic; op de oude site stonden die links direct in de li.
*/
.right__text--section li > p {
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.requirements li a {
    font-style: normal;
}

/*
  NVM/KRM-logo’s in de praktijkpagina. Native 335px is te breed in de
  contentkolom; iets kleiner houdt de verhouding intact.
*/
.content-section img[src*="logos-evers"] {
    width: 260px;
    max-width: 100%;
    height: auto;
}