/* Dekorativer Seitenhintergrund (Farbband + Protokollzeilen), siehe patterns/hintergrund.php.
   Das Markup steht per wp_body_open direkt am Anfang von <body>, der Inhalt (.wp-site-blocks) liegt darüber. */

body { position: relative; }

.hintergrund {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden; /* Unschärfe und Zeilen nie über den Seitenrand hinaus (kein waagrechtes Scrollen) */
  pointer-events: none;
  user-select: none;
  /* eigene Ebene: Hover im Inhalt löst kein Neuzeichnen der Unschärfe aus (sonst Kacheln und Ränder, die flackern) */
  contain: strict;
  transform: translateZ(0);
}
.hintergrund picture { display: contents; }
.hintergrund img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }

/* Tasten (nur Startseite): statisch, Werte aus der Vorlage (.taste + .schwebt ohne Weichzeichner und Animation) */
.taste-hg {
  position: absolute; display: flex; align-items: center; justify-content: center;
  border-radius: 16px; font-weight: 700; color: #6F959A; opacity: .45; pointer-events: none;
  background: linear-gradient(180deg, #123A41 0%, #0A262B 100%);
  border: 1px solid rgba(159, 195, 200, .18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 34px rgba(0, 0, 0, .5);
}

.log { position: absolute; white-space: nowrap; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; line-height: 1; color: #1B454C; }
.log b { font-weight: 700; color: #2A5D65; }
.log i { font-style: normal; color: #5C4A0E; }

/* Seiteninhalt über dem Hintergrund; Seitengrund #041519 bleibt am body. Keine eigenen Flächen oder Trennlinien. */
.wp-site-blocks { position: relative; z-index: 1; }

/* Abschnitte mit Schimmer laufen oben und unten weich aus */
.weich {
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 220px, #000 calc(100% - 220px), transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 220px, #000 calc(100% - 220px), transparent 100%);
}

/* Schmale Bildschirme: Zeilen am Rand würden sonst Text überlagern */
@media (max-width: 700px) {
  .hintergrund .log { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hintergrund, .hintergrund * { animation: none !important; transition: none !important; }
}