/* Marken-Bruecke fuer vishnu-artists.de — ERZEUGT von tools/build-marke-bruecke.js.
   Nicht von Hand aendern: Farben in f/vf.css pflegen, dann den Generator laufen lassen.
   Stand: 2026-09-04

   Diese Datei bringt die alten Seiten dieser Domain in die Gestaltung von
   vishnuartists.com, ohne ihr Markup anzufassen: sie belegt die Variablen der
   alten Seiten mit den Marken-Farben neu und tauscht die Schrift. Alles andere
   — Raster, Abstaende, Reihenfolge — bleibt, wie es war.

   Eingebunden wird sie als LETZTE Zeile im <head>, nach dem eigenen <style> der
   Seite. Nur dort gewinnt sie, ohne dass irgendwo !important stehen muss. */

/* Schriften von der Marken-Domain — eine Quelle fuer beide Haeuser. */
@import url("https://vishnuartists.com/fonts.css");

/* ——— Marken-Token, ausgelesen aus f/vf.css ——— */
:root{
  --paper:#faf8f2;
  --surface:#f3f0e6;
  --card:#ffffff;
  --ink:#1c2314;
  --sub:#686f5d;
  --line:#e6e2d4;
  --line-strong:#d5d0bd;
  --green:#89c527;
  --green-d:#4f7418;
  --green-soft:#eef4de;
  --amber-d:#8a6008;
  --amber-soft:#fdf0d4;
  --shadow:0 2px 12px rgba(40,46,28,.07);
}

/* Auf dunklen Flaechen gelten die hellen Werte — sonst steht Oliv auf Nachtblau. */
:root{
  --ink-auf-dunkel: #edf1e2;
  --sub-auf-dunkel: #a8b295;
}

/* ——— Die Variablen der alten Seiten auf die Marke umlegen ———
   Links steht, wie die alte Seite es nennt; rechts, was die Marke dafuer hat.
   Dadurch aendert sich das Aussehen ueberall dort mit, wo die alte Seite ihre
   eigenen Variablen benutzt — und das tut sie fast durchgehend. */
:root{
  --bg: var(--paper);
  --brand: var(--green);
  --brand2: var(--green);
  --brand-dark: var(--green-d);
  /* Das alte --accent war ein fast schwarzes Blaugrau (#0c1013). Die Marke hat
     dafuer ihr dunkles Oliv — dieselbe Rolle, aber aus der Palette. */
  --accent: #1c2314;
  --radius: 16px;
}

/* ——— Schrift ———
   Die alten Seiten setzen Poppins. Die Marke schreibt Inter im Fliesstext und
   Instrument Serif in den Ueberschriften; das ist der sichtbarste Unterschied
   zwischen den beiden Haeusern und deshalb der erste, der weg muss. */
/* Der Hintergrund wird hier gesetzt und nicht nur ueber --bg: die Dankesseite
   schreibt #f0f0f0 als feste Farbe und wuerde sonst als einzige Seite grau bleiben. */
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.65;
  background:var(--paper);color:var(--ink)}
h1,h2,h3,.serif{font-family:'Instrument Serif',Georgia,'Times New Roman',serif;
  font-weight:400;line-height:1.1;letter-spacing:-.01em}
h1 em,h2 em{font-style:italic;color:var(--green-d)}
/* Auszeichnungen im Fliesstext bleiben Inter — sonst wird die Serife zur Deko. */
strong,b,.sub-h,.kick{font-family:Inter,system-ui,sans-serif}

/* ——— Knoepfe ———
   Die Marke hat runde, ruhige Knoepfe; die alte Seite eckigere mit Schlagschatten.
   Form angleichen, Farben kommen schon ueber die Token. */
.btn{border-radius:999px;font-weight:700;letter-spacing:.1px;transition:background .15s,color .15s,border-color .15s}
.btn:hover{transform:none}
.btn-primary{background:var(--green);color:#122005}
.btn-primary:hover{background:#9ed83a;color:#122005}
.btn-sec,.btn-ghost{background:transparent;border:1.5px solid var(--line-strong);color:var(--ink)}
.btn-sec:hover,.btn-ghost:hover{border-color:var(--green-d);color:var(--green-d);background:transparent}

/* ——— Flaechen ——— */
.card,.price-box{border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow)}
.hero{background:linear-gradient(160deg,#1c2314 0%,#26331a 58%,var(--green-d) 135%)}
header{background:var(--accent);border-bottom:4px solid var(--green)}

/* ——— Kleinigkeiten, die sonst auffallen ——— */
a{color:var(--green-d)}
.sub-h{color:var(--sub)}

/* ——— Kontrast ———
   Zwei Stellen, die das Kontrast-Audit nach der Umstellung gemeldet hat. Das
   helle Marken-Gruen (#89c527) traegt auf Weiss nur 2,08:1 — es ist eine
   Flaechenfarbe, keine Schriftfarbe. Auf hellem Grund gilt --green-d.
   (Auf dunklem Grund bleibt das helle Gruen richtig, deshalb nur diese
   beiden Selektoren und keine pauschale Regel.) */
section h2 span{color:var(--green-d)}
.zfx{color:var(--sub)}

/* Die Reifegrad-Marken auf kmm.html tragen die Farbskala des Kanban Maturity
   Model (Gelb → Orange → Rot → Violett). Als Schriftfarbe schafft die Skala
   nirgends beide Enden: Gelb auf Weiss sind 1,9:1, dunkles Violett auf einem
   dunklen Chip 2,8:1. Die Farbe ist Bedeutung, nicht Schmuck — sie darf also
   weder abgedunkelt noch aufgehellt werden.
   Deshalb der uebliche barrierefreie Weg: die Farbe wird ein Punkt, der Text
   steht in lesbarer Tinte. Die Stufe bleibt farbcodiert, und wer die Farben
   nicht unterscheiden kann, liest sie trotzdem.
   (Die feste Schriftfarbe im Markup ist dafuer entfallen — sie haette jede
   Regel hier ueberstimmt.) */
.ovcard b{color:var(--ink)}
.ovcard b.mlnr::before{content:'';display:inline-block;width:.7em;height:.7em;
  border-radius:3px;background:var(--pc);margin-right:.45em;vertical-align:-.02em}

/* Die WIP-Limit-Zeile in der Board-Nachbildung (personal-compass) sitzt auf
   einer dunklen Flaeche (#131a23) und stand in 10 px Graublau — 3,97:1, unter
   dem Soll fuer Kleintext. Der erste Versuch mit --sub machte es schlimmer
   (3,35): das Oliv der hellen Palette gehoert nicht auf Nachtblau. Richtig ist
   der helle Nebenton aus dem Dunkel-Satz. */
.mcol .lim{color:var(--sub-auf-dunkel)}
