@import url("https://fonts.googleapis.com/css2?family=Vesper+Libre:wght@400;700&display=swap");

:root {
  --font-sans: Inter, "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --font-rounded: ui-rounded, "SF Pro Rounded", system-ui, sans-serif;
  --font-serif: "Vesper Libre", Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --font-serif-heading-offset: 0.15em;
  /* Gemeinsame Mischung für kontrastreiche Serienfarbe auf hellen Flächen. */
  --series-label-strength: 68%;
  --series-label-ink: #25282b;
}

:where(h1, h2) {
  position: relative;
  top: var(--font-serif-heading-offset);
}

/* Vesper Libre sits visually high inside compact boxes. Apply this to the
   glyph inside the box so its border and surrounding layout stay untouched. */
.font-serif-glyph {
  display: inline-block;
  font-family: var(--font-serif);
  transform: translateY(var(--font-serif-heading-offset));
}
