/* Stil für das Pinterest-Konto „Kurs-Community“ (kurs-community.net)
   Ruhig und sachlich: Petrol als Grundton, Koralle für Knöpfe. Hell und dunkel. */
:root {
  --bg: #f5f8f8;
  --flaeche: #ffffff;
  --flaeche-2: #e6f0f0;
  --rand: #d2e1e2;
  --text: #13262a;
  --text-2: #4f6569;
  --akzent: #d4583f;
  --akzent-dunkel: #a8402b;
  --akzent-weich: #fbe7e1;
  --akzent-text: #ffffff;
  --gut: #1f7a5a;
  --schlecht: #b4443f;
  --fuss-bg: #0f3a40;
  --fuss-text: #a9c6c9;

  --radius: 14px;
  --radius-gross: 22px;
  --knopf-radius: 12px;

  --schatten: 0 1px 2px rgba(15, 58, 64, .05), 0 8px 28px rgba(15, 58, 64, .07);
  --schatten-hoch: 0 2px 4px rgba(15, 58, 64, .06), 0 16px 40px rgba(15, 58, 64, .12);
  --schatten-gross: 0 2px 6px rgba(15, 58, 64, .05), 0 24px 60px rgba(15, 58, 64, .10);

  --titel: var(--schrift);
  --titel-gewicht: 800;
  color-scheme: light dark;
}

/* Dunkelmodus (folgt der Einstellung des Geräts). Weglassen = Seite immer hell. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0e1719;
    --flaeche: #152225;
    --flaeche-2: #1b2c30;
    --rand: #29403f;
    --text: #e6f1f1;
    --text-2: #9fb6b8;
    --akzent: #f08268;
    --akzent-dunkel: #f6a28d;
    --akzent-weich: #3a221d;
    --akzent-text: #1c0d09;
    --gut: #5fd0a4;
    --schlecht: #f08a85;
    --fuss-bg: #081113;
    --fuss-text: #8fa9ab;
    --schatten: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 28px rgba(0, 0, 0, .3);
    --schatten-hoch: 0 2px 4px rgba(0, 0, 0, .35), 0 16px 40px rgba(0, 0, 0, .4);
    --schatten-gross: 0 2px 6px rgba(0, 0, 0, .3), 0 24px 60px rgba(0, 0, 0, .35);
  }
}

/* Eigenheiten dieses Kontos */
h1, h2 { letter-spacing: -.02em; }
.dachzeile { color: #0f6b73; }
@media (prefers-color-scheme: dark) { .dachzeile { color: #7fc8cd; } }
.empfehlung.doppelt { grid-template-columns: 1fr; }
@media (min-width: 860px) { .empfehlung.doppelt { grid-template-columns: 1fr 1fr; } }
.ueber-mich { display: flex; gap: 16px; align-items: flex-start; }
.ueber-mich .zeichen-rund {
  flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center;
  background: var(--flaeche-2); color: #0f6b73; font-weight: 800; font-size: 20px;
}