:root {
    /* =========================
       SALBEI-PALETTE (Basis: #78946E)
       ========================= */
    /* Kernfarbe */
    --c-sage: #78946E;
    /* Helle Abstufungen (Flächen/Hintergründe) */
    --c-sage-50: #F2F6F1; /* sehr hell */
    --c-sage-100: #E8EFE5; /* hell */
    --c-sage-150: #DCE7D8; /* etwas kräftiger */
    /* Dunkle Abstufungen (Text/ Kontrast) */
    --c-forest: #1F2E25; /* dunkles Salbei/Forest */
    --c-ink: #111B1E; /* bleibt als „Neutral-Schwarz“ verfügbar */
    /* =========================
       THEME MAPPING (für dein System)
       ========================= */
    /* Grundflächen */
    --bg: var(--c-sage-50);
    --surface: rgba(244, 248, 243, 0.88); /* leicht salbeige Card-Fläche */
    --surface-strong: rgba(232, 239, 229, 0.96); /* stärker/Drawer/Header-Panels */
    /* Linien / Rahmen */
    --stroke: rgba(120, 148, 110, 0.22);
    --stroke-strong: rgba(120, 148, 110, 0.38);
    /* Texte */
    --text: rgba(31, 46, 37, 0.94); /* salbei-dunkel statt hart schwarz */
    --muted: rgba(31, 46, 37, 0.72);
    /* Akzentfarben (Primary/CTA) */
    --accent: var(--c-sage); /* Hauptakzent = Salbei */
    --accent-2: #DBA259; /* optional: Gold als Secondary (z.B. Highlights) */
    /* =========================
       LAYOUT / UI TOKENS
       ========================= */

    --container: 1120px;
    --r-1: 12px;
    --r-2: 18px;
    /* Schatten: minimal „weicher“ und natürlicher */
    --shadow-1: 0 10px 28px rgba(17, 27, 30, 0.10);
    --shadow-2: 0 18px 48px rgba(17, 27, 30, 0.14);
    /* Header-Höhe (bei größeren Brand-Fonts ggf. auf 80–88px erhöhen) */
    --header-h: 72px;
    /* Focus-Ring klar salbeifarben */
    --focus: 0 0 0 3px rgba(120, 148, 110, 0.45);
    /* =========================
       TYPOGRAFIE (Segoe UI Look)
       ========================= */
    /* Segoe UI zuerst, dann system-ui für macOS/iOS/Android/Linux, saubere Fallbacks */
    --font-sans: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    --font-serif: ui-serif, Georgia, "Times New Roman", Times, serif;
    /* =========================
       OPTIONAL: alte Logo-Farben als „Legacy“
       (falls du später noch einzelne Akzente brauchst)
       ========================= */
    --c-cream: #F7F6E0;
    --c-sand: #F3DDA9;
    --c-gold: #DBA259;
    --c-teal: #9FC7C3;
    --c-slate: #54605B;
}
