@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Geist Mono';
  src: url('../fonts/GeistMono-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Farben. Kein Weiß, kein Schwarz.
     Kontrast von Grafit: auf Papier 8,5:1, auf Coral-hell 5,86:1,
     auf Emerald-hell 6,43:1, auf vollem Coral 4,04:1 (dort keine kleine Schrift). */
  --papier: #F8EACD;
  --grafit: #394443;
  --coral: #F38758;
  --emerald: #70C793;
  --coral-hell: #F6B892;
  --emerald-hell: #B4D8B0;

  /* Abgeleitet aus --grafit (rgb 57 68 67), Zahl = Deckkraft in Prozent */
  --grafit-18: rgba(57, 68, 67, .18);
  --grafit-60: rgba(57, 68, 67, .6);
  --raster-grob-grafit-9: rgba(57, 68, 67, .09);
  --raster-fein-grafit-5: rgba(57, 68, 67, .05);

  --schrift: 'Geist', system-ui, sans-serif;
  --mono: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace;

  --t-text: 15px;
  --t-etikett: 10.5px;
  --t-etikett-klein: 9.5px;
  --t-max: 18px;
  --t-hero-text: 14px;
  --etikett-spur: .06em;

  --r1: 8px;
  --r2: 16px;
  --r3: 24px;
  --r4: 32px;
  --r5: 40px;
  --r6: 48px;
  --r7: 56px;
  --r8: 64px;

  --nav-hoehe: 48px;
  --nav-hoehe-zwei: 64px;

  --dauer-kurz: 150ms;
  --dauer: 400ms;
  --dauer-lang: 900ms;
  --kurve: cubic-bezier(.2, .7, .2, 1);
}

@media (max-width: 680px) {
  :root { --t-text: 14px; }
}