/* About, Works en Experiences gebruiken dezelfde ruimte rond de titel.
   De afstanden volgen de kaartbreedte, onafhankelijk van de woordlengte. */
.work-title {
  /* reserve voor oudere browsers zonder container queries */
  margin: calc(min(40px, max(20px, calc(var(--title-inner-width) * .31 - 52px))) + var(--title-mobile-space, 0px))
          0 calc(min(calc(var(--title-inner-width) * .173), 48px) + var(--title-mobile-space, 0px));

}

/* Voorkom dat een ongeldige cqw-regel de terugvalmarge wist. */
@supports (font-size: 1cqw) {
  .work-title {
    margin: calc(min(40px, max(20px, calc(31cqw - 52px))) + var(--title-mobile-space, 0px))
          0 calc(min(17.3cqw, 48px) + var(--title-mobile-space, 0px));
  }
}

/* Op kleine telefoons vervalt de extra mobiele titelruimte. */
@media (max-width: 499px) {
  .work-title { --title-mobile-space: 0px; }
}
@media (min-width: 768px) {
  .work-title { margin: 40px 0 64px; }
}