/* Variante "Blau-Gelb": Farbcodes 1:1 von der bisherigen ehconsulting.ai (CSS-Variablen dort in Klammern).
   Wird nach site.css geladen und überschreibt nur Farben. */
:root{
  --bg:#e7e8ea;          /* neutrales Hellgrau mit Hauch Blau (warmes #e6e4dd wirkte rosa) */
  --white:#f7f8f9;       /* Karten: gebrochenes Weiß, neutral */
  --ink:#112649;         /* color-brand-navy, color-fg */
  --muted:#56647a;       /* color-fg-muted */
  --grey:#56647a;        /* color-fg-muted (fg-subtle #768193 hat zu wenig Kontrast für kleine Schrift) */
  --line:#d4dbe6;        /* rule */
  --soft:#eff0f2;        /* zwischen Hintergrund und Karte */
  --panel:#d4dbe6;       /* rule */
  --c1:#112649;   --c1-ink:#ffffff;   /* color-brand-navy, color-fg-on-navy */
  --c2:#f7f59e;   --c2-ink:#112649;   /* color-brand-yellow, color-fg-on-yellow */
  --c3:#d4dbe6;   --c3-ink:#112649;   /* rule: Blaugrau, damit nicht alles gelb ist */
}
.topbar{background:rgba(231,232,234,.88)}
.links{color:#2d405f}                                   /* color-brand-navy-soft */
.area-list button{color:#56647a}                        /* color-fg-muted, auf dem dunkleren Grund gut lesbar */
.entry p,.legal p,.legal li{color:#2d405f}
.step::before{background:rgba(17,38,73,.18)}
.dot.spin{border-color:rgba(17,38,73,.2);border-top-color:var(--ink)}
.step.last b{background-image:linear-gradient(90deg,rgba(17,38,73,.35) 0%,var(--ink) 50%,rgba(17,38,73,.35) 100%)}
.about .checks{border-top-color:rgba(17,38,73,.12)}
.about .checks li{border-bottom-color:rgba(17,38,73,.12)}
.way3 .track{background:#d4dbe6}
.way3 .mover{box-shadow:0 0 0 6px rgba(17,38,73,.12)}
.ws3 .node{border-color:#b6becb}                        /* color-border-strong */
.ws3.on p{color:rgba(255,255,255,.82)}
.pill-dark:hover{background:#051127}                    /* color-brand-navy-deep */

/* Hero: Abläufe auf Nachtblau, Grundsätze in Gelb */
.panel{background:var(--c1)}
.buckles span{background:#f7f59e;color:#112649}

/* Farbkleckse hinter dem Glas in Markenfarben */
.k2 .glass-bg i:nth-child(2){background:#e1dd72;opacity:.55}   /* color-brand-yellow-deep */
.k3 .glass-bg i:nth-child(2){background:color-mix(in srgb,#112649 35%,#ffffff)}

/* Kennen Sie das: Balken und Tacho */
/* Hier bewusst Ampelfarben statt Blau-Gelb: Rot heißt Risiko bzw. "fehlt" */
.gb i{background:#d0453a}
.g-bg{stroke:#e2e5ea}.g-ok{stroke:#8cc9a0}.g-mid{stroke:#f2c14e}.g-hi{stroke:#d0453a}

@media (prefers-reduced-motion:reduce){.step.last b{background:none}}

/* Lesbarkeit: Glas in der dunklen Karte heller, Kleckse hell statt mittelblau */
.k1 .glass{background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,255,255,.72))}
.k1 .glass-bg i:nth-child(1){background:color-mix(in srgb,#112649 15%,#ffffff)}
.k1 .glass-bg i:nth-child(2){background:#f7f59e}
.prog-head .eyebrow{color:rgba(255,255,255,.75)}
.prog-head .sub{color:rgba(255,255,255,.9)}
.prog-head small{color:rgba(255,255,255,.78)}