/* Korrekturebene fuer die Artikel- und Uebersichtsseiten.
 *
 * Diese Seiten stammen aus der aelteren Fassung in Beige und Orange. Ihre
 * Tokennamen zeigen ueber tokens.css bereits auf die Hausfarben. Was hier
 * steht, sind die Stellen, die feste Werte tragen und deshalb nicht von den
 * Tokens erreicht werden, dazu die Formsprache: harte schwarze Rahmen,
 * versetzte Schatten, Versalien in Monospace.
 *
 * Wird als letztes Stylesheet geladen, damit es den Seitenblock ueberschreibt.
 * Angelegt am 07.09.2026.
 */

body{background:var(--weiss);color:var(--navy)}

/* Kopfzeile: heller Grund und Haarlinie statt zwei Millimeter Schwarz */
.nav{background:rgba(255,255,255,.92);border-bottom:1px solid var(--rand);padding:14px 32px}
.mark{font-family:var(--sans);font-weight:700;font-size:1rem;letter-spacing:-.01em;text-transform:none;color:var(--navy)}
.navlinks a{font-family:var(--sans);font-size:.95rem;letter-spacing:normal;text-transform:none;
  color:var(--grau);font-weight:500}
.navlinks a:hover{color:var(--navy)}

/* Knoepfe wie .knopf auf der Startseite */
.btn{font-family:var(--sans);font-weight:700;font-size:.97rem;letter-spacing:-.01em;text-transform:none;
  min-height:48px;padding:0 1.35rem;border-radius:10px;border:1px solid #D6D7E3;background:var(--weiss);
  color:var(--navy);box-shadow:none;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.btn:hover{border-color:#C9CAD8;transform:translateY(-1px);box-shadow:none}
.btn-accent{background:var(--violett);color:#fff;border-color:transparent;box-shadow:var(--schatten)}
.btn-accent:hover{background:var(--violett-tief);color:#fff;box-shadow:var(--schatten-hoch)}
.btn-sm{min-height:40px;padding:0 1rem;font-size:.9rem}

/* Karten: weiche Kante statt Kassettenschatten */
.post-card{border:1px solid var(--rand);border-left:3px solid var(--violett);border-radius:var(--rund);
  background:var(--weiss);box-shadow:var(--schatten);transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.post-card:hover{border-color:#CFD0E4;box-shadow:var(--schatten-hoch);transform:translateY(-2px)}

/* Der Farbbalken war siebenfarbig. Jetzt eine Linie in der Leitfarbe. */
.rule{display:block;height:3px;border-radius:999px;background:var(--violett);margin:36px 0 0}
.rule span,.rule i,.rule b{display:none}
.c-orange,.c-amber,.c-gold,.c-rose,.c-pink,.c-plum,.c-teal{background:var(--violett)}

/* Feste Grautoene der alten Palette */
.mono,.kicker,.updated{font-family:var(--sans);letter-spacing:.02em;color:var(--grau)}
.post-head .kicker,.blog-head .kicker{text-transform:none}

/* Der Knopf in der Kopfzeile wird von .navlinks a.btn spezifischer gesetzt
   als von .btn-accent, deshalb hier noch einmal mit gleicher Gewichtung. */
.navlinks a.btn{border:1px solid transparent;background:var(--violett);color:#fff;
  font-family:var(--sans);font-size:.9rem;letter-spacing:-.01em;box-shadow:var(--schatten)}
.navlinks a.btn:hover{background:var(--violett-tief);color:#fff;border-color:transparent}
.btn-accent:hover,.btn-accent:focus-visible{background:var(--violett-tief);color:#fff;border-color:transparent}

/* Versalien in Monospace waren die Handschrift der alten Fassung. */
.mono{font-family:var(--sans);text-transform:none;letter-spacing:.01em;font-size:.86rem;color:var(--grau)}
.post-card .weiter{font-family:var(--sans);text-transform:none;letter-spacing:-.01em;
  font-size:.95rem;font-weight:600;color:var(--violett-text)}
.post-card .weiter:hover{color:var(--violett-tief)}

/* Hinweiskasten im Artikel: Beschriftung war Versalien in Monospace. */
.post .ziel strong{font-family:var(--sans);font-size:.95rem;letter-spacing:-.01em;
  text-transform:none;color:var(--navy);font-weight:700}

/* Ueberschriften: Archivo Black wird auf der Seite nirgends geladen, und
   Versalien gibt es auf der Startseite nicht. Beides angeglichen. */
h1,h2,h3{font-family:"Space Grotesk",var(--font-family-sans);font-weight:700}
.post-head h1,.blog-head h1,.post h2,.faq h2,.back h2{text-transform:none;letter-spacing:-.02em}
.post-head h1,.blog-head h1{line-height:1.06}
.post h2{line-height:1.14}
footer .in{font-family:var(--sans);font-size:.9rem;letter-spacing:normal;text-transform:none;color:var(--grau)}
