/**
 * Grundschul Rose design-token register.
 *
 * Block A records the pre-migration live values. Block B contains the approved
 * unified values. Since Phase 2, only product pages wire Block B to semantic
 * component tokens; the remaining site areas continue to use Block A.
 *
 * Compatibility expiry: remove the product-related Block-A aliases after the
 * Phase 2 acceptance checks and remove all remaining Block-A aliases after the
 * separately approved site-wide migration (Phase 3).
 */

:root {
    /* BLOCK A — IST-WERTE (eingefroren, unverändert) */

    /* IST — ersetzt: --gsr-modern-rose, --gsr-clean-accent — betrifft: Startseite, Karten/Buttons — Ziel (Phase 2): --gsr-unified-accent */
    --gsr-modern-rose: #a84e69;
    --gsr-clean-accent: #a84e69;

    /* IST — ersetzt: --gsr-menu-accent — betrifft: Header-Navigation — Ziel (Phase 2): --gsr-unified-accent */
    --gsr-menu-accent: #9c4a62;

    /* IST/ZIEL — --gsr-focus-ring — betrifft: Fokuszustand/Barrierefreiheit — Phase 2 erledigt, siehe Phase-2-Anweisung Abschnitt 0 */
    --gsr-focus-ring: 2px solid var(--gsr-unified-accent);

    /* IST/ZIEL — --gsr-focus-ring-soft — betrifft: Fokuszustand/Barrierefreiheit — Phase 2 erledigt, siehe Phase-2-Anweisung Abschnitt 0 */
    --gsr-focus-ring-soft: 0 0 0 4px rgba(214, 92, 146, 0.35);

    /* IST — ersetzt: --gsr-modern-ink, --gsr-clean-ink, --gsr-menu-ink — betrifft: Startseite, Karten, Header — Ziel (Phase 2): --gsr-unified-ink */
    --gsr-modern-ink: #3f3436;
    --gsr-clean-ink: #3f3436;
    --gsr-menu-ink: #3f3436;

    /* IST — ersetzt: --gsr-material-card-text — betrifft: Produktkarten im Grid — Ziel (Phase 2): --gsr-unified-ink */
    --gsr-material-card-text: #3f3131;

    /* IST — ersetzt: --gsr-modern-muted — betrifft: Startseite, Hero- und Kartentexte — Ziel (Phase 2): --gsr-unified-muted */
    --gsr-modern-muted: #756b6d;

    /* IST — ersetzt: --gsr-clean-muted — betrifft: Karten, Beschreibungen und Sekundärtexte — Ziel (Phase 2): --gsr-unified-muted */
    --gsr-clean-muted: #6f6261;

    /* IST — ersetzt: --gsr-menu-muted — betrifft: Header-Navigation und Flyout-Hinweise — Ziel (Phase 2): --gsr-unified-muted */
    --gsr-menu-muted: #6f6261;

    /* IST — ersetzt: --gsr-modern-rose-dark — betrifft: Startseite, aktive und kräftige Akzentzustände — Ziel (Phase 2): --gsr-unified-accent */
    --gsr-modern-rose-dark: #80374d;

    /* IST — ersetzt: --gsr-modern-rose-soft — betrifft: Startseite, helle Akzentflächen — Ziel (Phase 2): --gsr-unified-accent-light */
    --gsr-modern-rose-soft: #f4e4e8;

    /* IST — ersetzt: --gsr-clean-accent-hover — betrifft: Karten/Buttons im Hover-Zustand — Ziel (Phase 2): --gsr-unified-accent */
    --gsr-clean-accent-hover: #8f4058;

    /* IST — ersetzt: --gsr-clean-green — betrifft: semantische Erfolgszustände — Ziel (Phase 2): bleibt semantischer Statuswert, kein Block-B-Farbtoken */
    --gsr-clean-green: #4f8f70;

    /* IST — ersetzt: --gsr-clean-sale — betrifft: semantische Sale-Hinweise — Ziel (Phase 2): bleibt semantischer Statuswert, kein Block-B-Farbtoken */
    --gsr-clean-sale: #9a6a35;

    /* IST — ersetzt: --gsr-modern-sage — betrifft: Startseite, ergänzende ruhige Akzentflächen — Ziel (Phase 2): bleibt semantischer Zusatzwert, kein Block-B-Farbtoken */
    --gsr-modern-sage: #e4ece5;

    /* IST — ersetzt: --gsr-modern-cream, --gsr-clean-surface, --gsr-menu-surface — betrifft: Startseite, Karten, Header — Ziel (Phase 2): --gsr-unified-cream / --gsr-unified-surface */
    --gsr-modern-cream: #fffdfa;
    --gsr-clean-surface: #fffdf9;
    --gsr-menu-surface: #fffdf9;

    /* IST — ersetzt: --gsr-clean-surface-soft — betrifft: Karten, Bild- und Sekundärflächen — Ziel (Phase 2): --gsr-unified-cream */
    --gsr-clean-surface-soft: #fbf6f1;

    /* IST — ersetzt: --gsr-menu-soft — betrifft: Header-Flyouts und Hover-Flächen — Ziel (Phase 2): --gsr-unified-cream */
    --gsr-menu-soft: #f8f2ee;

    /* IST — ersetzt: --gsr-material-card-soft — betrifft: Produktkarten im Grid — Ziel (Phase 2): --gsr-unified-accent-light */
    --gsr-material-card-soft: #f6e4e4;

    /* IST — ersetzt: --gsr-material-card-soft-light — betrifft: Bildflächen der Produktkarten — Ziel (Phase 2): --gsr-unified-cream */
    --gsr-material-card-soft-light: #fff8fb;

    /* IST — ersetzt: --gsr-modern-line — betrifft: Startseite, Trennlinien und Kartenränder — Ziel (Phase 2): bleibt bis zur Festlegung eines einheitlichen Border-Tokens bestehen */
    --gsr-modern-line: rgba(83,62,68,.13);

    /* IST — ersetzt: --gsr-clean-border — betrifft: Karten und Inhaltsflächen — Ziel (Phase 2): bleibt bis zur Festlegung eines einheitlichen Border-Tokens bestehen */
    --gsr-clean-border: #e7dcd5;

    /* IST — ersetzt: --gsr-menu-border — betrifft: Header-Navigation und Flyouts — Ziel (Phase 2): bleibt bis zur Festlegung eines einheitlichen Border-Tokens bestehen */
    --gsr-menu-border: #e4d9d2;

    /* IST — ersetzt: --gsr-material-card-border — betrifft: Produktkarten im Grid — Ziel (Phase 2): bleibt bis zur Festlegung eines einheitlichen Border-Tokens bestehen */
    --gsr-material-card-border: #ead5d5;

    /* IST — ersetzt: --gsr-clean-radius — betrifft: Karten/Buttons — Ziel (Phase 2): --gsr-unified-radius-sm */
    --gsr-clean-radius: 8px;

    /* IST — ersetzt: --gsr-material-card-radius — betrifft: Produktkarten im Grid — Ziel (Phase 2): --gsr-unified-radius-md */
    --gsr-material-card-radius: 22px;

    /* IST — ersetzt: --gsr-modern-shadow — betrifft: Startseite und erhöhte Karten — Ziel (Phase 2): --gsr-unified-shadow-raised */
    --gsr-modern-shadow: 0 22px 58px rgba(83,54,64,.12);

    /* IST — ersetzt: --gsr-clean-shadow — betrifft: Karten und dezente Hover-Zustände — Ziel (Phase 2): --gsr-unified-shadow-soft */
    --gsr-clean-shadow: 0 10px 24px rgba(62, 48, 48, 0.06);

    /* IST — ersetzt: --gsr-clean-shadow-hover — betrifft: Karten im Hover-Zustand — Ziel (Phase 2): --gsr-unified-shadow-soft */
    --gsr-clean-shadow-hover: 0 14px 28px rgba(62, 48, 48, 0.09);

    /* IST — ersetzt: --gsr-modern-page-gutter — betrifft: Startseite und moderne Seitenlayouts — Ziel (Phase 2): bleibt layoutspezifisch */
    --gsr-modern-page-gutter: clamp(16px,2.2vw,42px);

    /* IST — ersetzt: --gsr-modern-page-gutter-double — betrifft: Startseite und moderne Seitenlayouts — Ziel (Phase 2): bleibt layoutspezifisch */
    --gsr-modern-page-gutter-double: clamp(32px,4.4vw,84px);

    /* IST — ersetzt: --gsr-modern-heading-font — betrifft: Überschriften auf modernen Seiten — Ziel (Phase 2): bereits am Ziel Manrope, kein Wechsel nötig */
    --gsr-modern-heading-font: Manrope,Inter,"Avenir Next","Segoe UI",Arial,sans-serif;

    /* IST — ersetzt: --gsr-modern-body-font — betrifft: Fließtext auf modernen Seiten — Ziel (Phase 2): bereits am Ziel Inter, kein Wechsel nötig */
    --gsr-modern-body-font: Inter,"Avenir Next","Segoe UI",Arial,sans-serif;

    /* IST — ersetzt: --gsr-modern-type-body — betrifft: Fließtext auf modernen Seiten — Ziel (Phase 2): bleibt typografiespezifische Skala */
    --gsr-modern-type-body: clamp(.98rem,.95rem + .12vw,1.04rem);

    /* IST — ersetzt: --gsr-modern-type-h1 — betrifft: H1 auf modernen Seiten — Ziel (Phase 2): bleibt typografiespezifische Skala */
    --gsr-modern-type-h1: clamp(1.65rem,3.4vw,3.25rem);

    /* IST — ersetzt: --gsr-modern-type-h2 — betrifft: H2 auf modernen Seiten — Ziel (Phase 2): bleibt typografiespezifische Skala */
    --gsr-modern-type-h2: clamp(1.45rem,2.25vw,2.3rem);

    /* IST — ersetzt: --gsr-modern-type-h3 — betrifft: H3 auf modernen Seiten — Ziel (Phase 2): bleibt typografiespezifische Skala */
    --gsr-modern-type-h3: clamp(1.16rem,1.35vw,1.42rem);

    /* IST — ersetzt: --gsr-product-ink — betrifft: Produktseite — Ziel (Phase 2): --gsr-unified-ink */
    --gsr-product-ink: #44363f;

    /* IST — ersetzt: --gsr-product-rose — betrifft: Produktseite, helle Akzentflächen — Ziel (Phase 2): --gsr-unified-accent-light; bereits am Ziel */
    --gsr-product-rose: #f3bfd0;

    /* IST — ersetzt: --gsr-product-rose-strong — betrifft: Produktseite, primäre Akzente — Ziel (Phase 2): --gsr-unified-accent; bereits am Ziel */
    --gsr-product-rose-strong: #d65c92;

    /* IST — ersetzt: --gsr-product-cream — betrifft: Produktseite, Grund- und Kartenflächen — Ziel (Phase 2): --gsr-unified-cream; bereits am Ziel */
    --gsr-product-cream: #fff9f3;

    /* IST — ersetzt: --gsr-product-surface — betrifft: Produktseite, erhöhte Flächen — Ziel (Phase 2): --gsr-unified-surface; bereits am Ziel */
    --gsr-product-surface: #fffdfb;

    /* IST — ersetzt: --gsr-product-border — betrifft: Produktseite, Karten- und Trennlinien — Ziel (Phase 2): bleibt bis zur Festlegung eines einheitlichen Border-Tokens bestehen */
    --gsr-product-border: rgba(154, 102, 128, 0.18);

    /* IST — ersetzt: --gsr-product-radius-sm — betrifft: Produktseite, kleine Karten/Chips — Ziel (Phase 2): --gsr-unified-radius-sm; bereits am Ziel */
    --gsr-product-radius-sm: 12px;

    /* IST — ersetzt: --gsr-product-radius-md — betrifft: Produktseite, Karten/Buttons — Ziel (Phase 2): --gsr-unified-radius-md; bereits am Ziel */
    --gsr-product-radius-md: 20px;

    /* IST — ersetzt: --gsr-product-radius-pill — betrifft: Produktseite, Pills/Tags — Ziel (Phase 2): --gsr-unified-radius-pill; bereits am Ziel */
    --gsr-product-radius-pill: 999px;

    /* IST — ersetzt: --gsr-product-space-xs — betrifft: Produktseite, Abstandsskala — Ziel (Phase 2): bestehende Produkt-Abstandsskala, bereits Zielbasis */
    --gsr-product-space-xs: 8px;

    /* IST — ersetzt: --gsr-product-space-sm — betrifft: Produktseite, Abstandsskala — Ziel (Phase 2): bestehende Produkt-Abstandsskala, bereits Zielbasis */
    --gsr-product-space-sm: 12px;

    /* IST — ersetzt: --gsr-product-space-md — betrifft: Produktseite, Abstandsskala — Ziel (Phase 2): bestehende Produkt-Abstandsskala, bereits Zielbasis */
    --gsr-product-space-md: 16px;

    /* IST — ersetzt: --gsr-product-space-lg — betrifft: Produktseite, Abstandsskala — Ziel (Phase 2): bestehende Produkt-Abstandsskala, bereits Zielbasis */
    --gsr-product-space-lg: 24px;

    /* IST — ersetzt: --gsr-product-space-xl — betrifft: Produktseite, Abstandsskala — Ziel (Phase 2): bestehende Produkt-Abstandsskala, bereits Zielbasis */
    --gsr-product-space-xl: 32px;

    /* IST — ersetzt: --gsr-product-shadow — betrifft: Produktseite — Ziel (Phase 2): --gsr-unified-shadow-raised */
    --gsr-product-shadow: 0 18px 40px rgba(79, 48, 62, 0.09);

    /* IST — ersetzt: --gsr-product-shadow-soft — betrifft: Produktseite, dezente Karten-/Buttonzustände — Ziel (Phase 2): --gsr-unified-shadow-soft; bereits am Ziel */
    --gsr-product-shadow-soft: 0 8px 20px rgba(79, 48, 62, 0.07);
}

:root {
    /* BLOCK B — ZIEL-WERTE (vorbereitet, NICHT verdrahtet) */

    --gsr-unified-ink: #44363f;
    --gsr-unified-muted: #6f6261;
    --gsr-unified-accent: #d65c92;
    --gsr-unified-accent-light: #f3bfd0;
    --gsr-unified-cream: #fff9f3;
    --gsr-unified-surface: #fffdfb;
    --gsr-unified-radius-sm: 12px;
    --gsr-unified-radius-md: 20px;
    --gsr-unified-radius-pill: 999px;
    --gsr-unified-shadow-raised: 0 24px 48px rgba(79, 48, 62, 0.12);
    --gsr-unified-shadow-soft: 0 8px 20px rgba(79, 48, 62, 0.07);
}

/*
 * Phase 2 product-page wiring.
 * These aliases deliberately stay product-scoped so Startseite, Materialsuche
 * and Header do not change before their separately approved migration.
 */
body.single-product {
    --color-ink: var(--gsr-unified-ink);
    --color-muted: var(--gsr-unified-muted);
    --color-rose-strong: var(--gsr-unified-accent);
    --color-rose: var(--gsr-unified-accent-light);
    --color-cream: var(--gsr-unified-cream);
    --color-surface: var(--gsr-unified-surface);

    --radius-sm: var(--gsr-unified-radius-sm);
    --radius-md: var(--gsr-unified-radius-md);
    --radius-pill: var(--gsr-unified-radius-pill);

    --shadow-raised: var(--gsr-unified-shadow-raised);
    --shadow-soft: var(--gsr-unified-shadow-soft);
    --shadow-hover: 0 12px 24px rgba(79, 48, 62, 0.16);

    --space-1: 8px;
    --space-2: 12px;
    --space-3: 16px;
    --space-4: 24px;
    --space-5: 32px;
    --space-6: 48px;

    /* Do not use the stale theme preset here: it currently resolves to Manrope. */
    --font-heading: Marcellus, Georgia, serif;
    --font-body: Inter, "Avenir Next", "Segoe UI", Arial, sans-serif;
    --gsr-product-body-font: "IBM Plex Sans", Inter, "Avenir Next", "Segoe UI", Arial, sans-serif;

    --gsr-focus-ring: 2px solid var(--gsr-unified-accent);
    --gsr-focus-ring-soft: 0 0 0 4px rgba(214, 92, 146, 0.35);
}