/* Zentrale Marken-Konfiguration: 4 Farben, 2 Schriften.
   Farb- und Schriftwerte werden ausschliesslich hier definiert. */

@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/fraunces-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/fraunces-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
    U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
    U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
    U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
    U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* --- Die vier Markenfarben --- */
  --color-ink: #1b1b1a;    /* Anthrazit, Text und dunkle Flaechen */
  --color-fog: #f4f3f0;    /* helles Grau, Hintergrund */
  --color-steel: #8a8983;  /* mittleres Grau, Linien und Sekundaertext */
  --color-bone: #c9bfa8;   /* gedecktes Bone, einziger Akzent */

  /* --- Die zwei Schriften --- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  /* --- Abgeleitete Rollen --- */
  --surface: var(--color-fog);
  --surface-alt: color-mix(in oklab, var(--color-fog) 94%, var(--color-ink));
  --surface-dark: var(--color-ink);
  --surface-card: color-mix(in oklab, var(--color-fog) 98%, white);

  --text: var(--color-ink);
  --text-muted: color-mix(in oklab, var(--color-ink) 62%, var(--color-fog));
  --text-invert: color-mix(in oklab, var(--color-fog) 96%, white);
  --text-invert-muted: color-mix(in oklab, var(--color-fog) 72%, var(--color-ink));

  --accent: var(--color-bone);
  --accent-ink: color-mix(in oklab, var(--color-bone) 55%, var(--color-ink));
  --accent-soft: color-mix(in oklab, var(--color-bone) 35%, var(--color-fog));

  --line: color-mix(in oklab, var(--color-steel) 45%, var(--color-fog));
  --line-strong: color-mix(in oklab, var(--color-steel) 80%, var(--color-fog));
  --veil: color-mix(in oklab, var(--color-ink) 62%, transparent);
  --shadow: 0 1px 2px color-mix(in oklab, var(--color-ink) 8%, transparent),
            0 12px 32px color-mix(in oklab, var(--color-ink) 8%, transparent);

  /* --- Typografie --- */
  --step--1: clamp(0.82rem, 0.79rem + 0.15vw, 0.9rem);
  --step-0: clamp(1rem, 0.96rem + 0.2vw, 1.09rem);
  --step-1: clamp(1.2rem, 1.12rem + 0.4vw, 1.45rem);
  --step-2: clamp(1.5rem, 1.34rem + 0.8vw, 2rem);
  --step-3: clamp(1.9rem, 1.6rem + 1.5vw, 2.9rem);
  --step-4: clamp(2.4rem, 1.8rem + 3vw, 4.5rem);

  --tracking-wide: 0.18em;
  --measure: 62ch;

  /* --- Raster --- */
  --space-1: 0.5rem;
  --space-2: 0.875rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: clamp(4rem, 8vw, 7.5rem);

  --wrap: 74rem;
  --radius: 2px;
  --radius-lg: 4px;
  --header-height: 4.25rem;
}