:root {
  /* 15px @393px  ->  18px @820px */
  font-size: clamp(15px, calc(12.24px + 0.703vw), 18px);
  --lh: 1.45;
  --space: calc(var(--lh) * 1em);
  --space-2: calc(var(--lh) * 2em);
  --grey: #8a8a8a;
  /* 22px @393px -> 48px @820pxt */
  --margin: clamp(22px, calc(-1.9px + 6.09vw), 48px);
}

*, 
*::before, 
*::after { 
  box-sizing: border-box; 
  margin: 0; 
}

img, 
svg, 
video { 
  display: block; 
  max-width: 100%; 
}

input, 
button, 
textarea, 
select { 
  font: inherit; 
}

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  padding: var(--margin);
  font-family: Verdana, Geneva, sans-serif;
  font-size: 1rem;
  line-height: var(--lh);
  color: #000;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

a { 
  color: inherit; 
  text-decoration: underline; 
  text-underline-offset: 2px; 
}

strong, b, .h { 
  font-weight: bold; 
}

.h {
  margin-top: var(--space-2);
  margin-bottom: var(--space);
}

.h:first-child { margin-top: 0; }

/* ---------- Header ---------- */
.site-header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--space);
  margin-bottom: var(--space-2);
}
.site-nav a { display: block; width: max-content; }
.site-logo { justify-self: end; }
.site-logo svg { width: 4.4rem; height: 4.4rem; }

/* ---------- Calendar ---------- */
/* "Aktuell": full lead, one per row (up to a comfortable measure) */
.current .teaser { max-width: 32em; margin-bottom: var(--space-2); }

/* "Archiv": responsive grid — 1 column on phones, 2–6 as it widens */
.archive {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15em), 1fr));
  gap: var(--space-2) var(--margin);
}

.teaser__meta { }
.teaser__title { margin-bottom: var(--space); }
.teaser__lead {
  color: var(--grey);
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: break-word;
  hyphens: auto;
  text-wrap: pretty;
}
.teaser__title a { display: inline-block; }

.show-all { margin-top: var(--space-2); }

/* ---------- Lists (Publikationen) ---------- */
.link-list a { display: block; width: max-content; max-width: 100%; }

/* ---------- Detail (Unterseite) ---------- */
.detail__meta { margin-bottom: var(--space); }
.detail__lead { color: var(--grey); margin-bottom: var(--space-2); }
.prose { max-width: 100%; }
.prose > * + * { margin-top: var(--space); }
.prose h1, .prose h2, .prose h3 { font-size: 1rem; font-weight: bold; margin-top: var(--space-2); }

/* Figures share the archive grid rhythm */
.figures {
  margin-top: var(--space-2);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15em), 1fr));
  gap: var(--space-2) var(--margin);
}
.figure figcaption { margin-top: .25em; }

.crosslinks { margin-top: var(--space-2); }

/* ---------- Footer ---------- */
.site-footer { margin-top: var(--space-2); }
.site-footer .block + .block { margin-top: var(--space-2); }
.site-footer .lines { white-space: pre-line; }

@media (min-width: 820px) {
  .site-header { grid-template-columns: 1fr auto 1fr; }
  .site-logo { grid-column: 2; justify-self: center; }
  .prose { max-width: 50%; }
}