/* Pfotenzirkel – Design-Tokens aus brand/tokens.css (Hell + Dunkel). Fonts lokal (DSGVO). */
@font-face { font-family: "Young Serif"; src: url("../Fonts/YoungSerif-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Bricolage Grotesque"; src: url("../Fonts/BricolageGrotesque-Variable.ttf") format("truetype"); font-weight: 200 800; font-display: swap; }

:root {
  --brombeere: #3A1F3D;
  --on-brombeere: #F6F1E7;
  --mohn: #E0643C;
  --mohn-tinte: #A9401C;
  --pistazie: #C9D88F;
  --fell: #E7D3BC;
  --hafer: #F6F1E7;
  --hafer-tief: #EDE5D6;
  --tinte: #2A1A2C;
  --tinte-leise: #6B5A68;
  --bleistift: #D8CCBA;
  --space-2: 8px;
  --space-4: 16px;
  --space-6: 24px;
  --space-10: 40px;
  --radius-sm: 8px;
  --radius-lg: 28px;
  --radius-rund: 999px;
  --font-display: "Young Serif", Georgia, serif;
  --font-sans: "Bricolage Grotesque", system-ui, sans-serif;

  /* Ergänzt aus design/startseite.html, nicht im Brandset benannt */
  --hilfslinie: #BFAE98;
  --brombeere-linie: #6E4F70;
  --brombeere-leise: #E3D6E2;
  --feld: #FFFFFF;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brombeere: #A774A4;
    --on-brombeere: #1E1420;
    --mohn: #F07A50;
    --mohn-tinte: #F49A78;
    --pistazie: #A9B873;
    --fell: #8C6E58;
    --hafer: #1E1420;
    --hafer-tief: #2A1D2D;
    --tinte: #F6EEE6;
    --tinte-leise: #C2B3BE;
    --bleistift: #3E2F41;
    --hilfslinie: #5E4A60;
    --brombeere-linie: #7E557C;
    --brombeere-leise: #2E1F31;
    --feld: #2A1D2D;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --brombeere: #A774A4;
  --on-brombeere: #1E1420;
  --mohn: #F07A50;
  --mohn-tinte: #F49A78;
  --pistazie: #A9B873;
  --fell: #8C6E58;
  --hafer: #1E1420;
  --hafer-tief: #2A1D2D;
  --tinte: #F6EEE6;
  --tinte-leise: #C2B3BE;
  --bleistift: #3E2F41;
  --hilfslinie: #5E4A60;
  --brombeere-linie: #7E557C;
  --brombeere-leise: #2E1F31;
  --feld: #2A1D2D;
  color-scheme: dark;
}