/*
Theme Name: RettZV Lagezentrum
Theme URI: https://www.rettzv-sws.de
Author: Rettungszweckverband Südwestsachsen
Description: Eigenständiges Theme im Corporate Design des Rettungszweckverbandes „Südwestsachsen“. Gestaltungsidee „Lagezentrum“: operative dunkle Bühnen mit Koordinatenraster, HUD-Rahmen und Live-Status, dazu ruhige weiße Inhaltsflächen für beste Lesbarkeit. Vollständig über den Customizer pflegbar – ohne HTML. Schriften lokal (DSGVO), Bewegung abschaltbar, BITV/WCAG 2.1 AA im Blick.
Version: 1.6.3
Requires at least: 6.2
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rettzv-lz
Tags: custom-logo, custom-menu, one-column, full-width-template, block-patterns
*/

/* ===========================================================================
   INHALT
   0  Schriften
   1  Designsystem (Farben, Maße, Bewegung)
   2  Grundlagen & Typografie
   3  Signatur-Bausteine (Raster, HUD-Rahmen, Statuszeile, Zahlen, Marker)
   4  Kopfzeile & Navigation
   5  Startseite: Bühne
   6  Startseite: Aufgaben
   7  Startseite: Lage (Einsatz-Ticker)
   8  Startseite: Verband (Karte & Kennzahlen)
   9  Startseite: Meldungen
   10 Startseite: Kontaktband
   11 Seitenvorlagen (Banner, Inhalt, Beiträge, Archiv, Suche, 404)
   12 Fußzeile
   13 Bewegung, Barrierefreiheit, Druck
   =========================================================================== */

/* ============================ 0 · Schriften ============================== */
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('assets/fonts/ibm-plex-sans-latin.woff2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('assets/fonts/ibm-plex-sans-latin-ext.woff2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF,
    U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ========================= 1 · Designsystem ============================== */
:root {
  /* Flächen */
  --lz-ink:      #06090d;   /* operative Bühne */
  --lz-ink-2:    #0c1219;   /* abgesetzte dunkle Fläche */
  --lz-paper:    #ffffff;   /* Inhaltsfläche */
  --lz-paper-2:  #f1f4f8;   /* ruhige helle Fläche */
  --lz-hair:     #dfe5ee;   /* Linie auf hell */
  --lz-hair-ink: rgba(255,255,255,.14); /* Linie auf dunkel */

  /* Farben */
  --lz-red:      #fe0000;   /* Signal */
  --lz-red-ink:  #d10000;   /* Rot für Text auf Weiß (WCAG-sicher) */
  --lz-red-lite: #ff5a5a;   /* Rot für Text auf Schwarz */
  --lz-text:     #10151c;
  --lz-slate:    #56656f;
  --lz-slate-2:  #7d8b98;

  /* Maße */
  --lz-wide:     1240px;    /* breites Raster */
  --lz-read:     720px;     /* Lesebreite */
  --lz-gutter:   clamp(1rem, 4vw, 2rem);
  --lz-sec:      72px;      /* Sektionsabstand, im Customizer einstellbar */
  --lz-radius:   4px;       /* bewusst kantig – operativ, nicht verspielt */
  --lz-radius-l: 8px;

  /* Raster & Bewegung (über den Customizer steuerbar) */
  --lz-grid-size: 44px;
  --lz-grid-op:   1;
  --lz-motion:    1;        /* 0 = aus, 1 = normal, 2 = kräftig */
  --lz-scan:      1;
  --lz-reveal:    600ms;

  /* Maße einzelner Bausteine (alle im Customizer einstellbar) */
  --lz-head-wide:    1500px;
  --lz-menu-size:    .92rem;
  --lz-stage-veil:   .86;
  --lz-stage-panel:  .46fr;
  --lz-tasks-gap:    18px;
  --lz-tasks-ratio:  16 / 9;
  --lz-tasks-hero-h: 46%;
  --lz-tasks-zoom:   1.04;
  --lz-lage-side:    300px;
  --lz-map-size:     300px;
  --lz-map-speed:    9s;
  --lz-news-gap:     18px;
  --lz-news-lead-h:  420px;

  /* Warnstufen – ausschließlich CI-Farben (Leuchtrot, Hellgrau, Schwarz,
     Weiß). Die Eskalation entsteht über Gewicht und Fläche, nicht über einen
     fremden Farbton. Zusätzlich trägt jede Stufe ihren Klartext, damit sie
     nicht allein über Farbe erkennbar ist (WCAG 1.4.1). */
  --lz-grey-ci:  #c6c6c6;
  --lz-lvl:      var(--lz-grey-ci);
  --lz-lvl-ink:  #4a5560;

  /* Schrift – ausschließlich IBM Plex Sans (Corporate Design, lokal
     eingebunden). Die „technische" Anmutung der Beschriftungen entsteht über
     Versalien, weite Laufweite und Tabellenziffern, NICHT über eine zweite
     Schriftfamilie. Wer es dennoch mag, kann im Customizer auf eine
     Monospace-Schrift umschalten (Klasse .lz-mono-alt). */
  --lz-font: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --lz-mono: var(--lz-font);
  --lz-size: 1.05rem;
  --lz-lead: 1.65;
}

/* ====================== 2 · Grundlagen & Typografie ====================== */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  font-family: var(--lz-font);
  font-size: var(--lz-size);
  line-height: var(--lz-lead);
  color: var(--lz-text);
  background: var(--lz-paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video { max-width: 100%; height: auto; }
img { display: block; }

h1, h2, h3, h4 {
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.02em;
  margin: 0 0 .5em;
  text-wrap: balance;
}
h1 { font-size: clamp(2rem, 1.2rem + 3.2vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 1.1rem + 2vw, 2.5rem); }
h3 { font-size: clamp(1.2rem, 1rem + .8vw, 1.5rem); }
h4 { font-size: 1.05rem; }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--lz-red-ink); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--lz-red); }

ul, ol { padding-left: 1.25em; }

hr { border: 0; border-top: 1px solid var(--lz-hair); margin: 2.5rem 0; }

strong, b { font-weight: 700; }

::selection { background: var(--lz-red); color: #fff; }

:focus-visible {
  outline: 3px solid var(--lz-red);
  outline-offset: 3px;
  border-radius: 2px;
}
.lz-on-ink :focus-visible { outline-color: #fff; }

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  white-space: nowrap;
}
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--lz-red); color: #fff; padding: .8rem 1.2rem; font-weight: 700;
}
.skip-link:focus {
  left: .5rem; top: .5rem; width: auto; height: auto; clip: auto; clip-path: none;
}

/* Raster-Container */
.lz-wrap { max-width: var(--lz-wide); margin-inline: auto; padding-inline: var(--lz-gutter); }
.lz-read { max-width: var(--lz-read); }

.lz-section { position: relative; padding-block: var(--lz-sec); }
.lz-section--paper { background: var(--lz-paper); }
.lz-section--soft  { background: var(--lz-paper-2); }
.lz-section--ink   { background: var(--lz-ink); color: #fff; }
.lz-section--ink h1,
.lz-section--ink h2,
.lz-section--ink h3 { color: #fff; }
.lz-section--ink a { color: var(--lz-red-lite); }

/* ====================== 3 · Signatur-Bausteine =========================== */

/* 3.1 Koordinatenraster: feine Linien plus alle 5 Felder eine kräftigere.
   Bewusst zwei Ebenen, damit es wie ein Plan wirkt und nicht wie Millimeter-
   papier. Wird immer weich ausmaskiert, nie hart abgeschnitten. */
.lz-grid {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  opacity: var(--lz-grid-op);
  background-image:
    linear-gradient(var(--lz-hair-ink) 1px, transparent 1px),
    linear-gradient(90deg, var(--lz-hair-ink) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:
    calc(var(--lz-grid-size) * 5) calc(var(--lz-grid-size) * 5),
    calc(var(--lz-grid-size) * 5) calc(var(--lz-grid-size) * 5),
    var(--lz-grid-size) var(--lz-grid-size),
    var(--lz-grid-size) var(--lz-grid-size);
  -webkit-mask-image: radial-gradient(120% 100% at 78% 0%, #000 0%, rgba(0,0,0,.6) 42%, transparent 82%);
          mask-image: radial-gradient(120% 100% at 78% 0%, #000 0%, rgba(0,0,0,.6) 42%, transparent 82%);
}
.lz-grid--paper {
  background-image:
    linear-gradient(rgba(16,21,28,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,21,28,.10) 1px, transparent 1px),
    linear-gradient(rgba(16,21,28,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,21,28,.045) 1px, transparent 1px);
}

/* 3.2 HUD-Rahmen: vier Eckklammern statt Rahmenlinie.
   Klarer Wiedererkennungswert und deutlich weniger schwer als eine Box. */
.lz-frame { position: relative; }
.lz-frame::before,
.lz-frame::after {
  content: ""; position: absolute; width: 18px; height: 18px; pointer-events: none;
  border: 2px solid var(--lz-red);
  transition: inset .4s cubic-bezier(.2,.7,.2,1), opacity .4s;
}
.lz-frame::before { inset: -1px auto auto -1px; border-right: 0; border-bottom: 0; }
.lz-frame::after  { inset: auto -1px -1px auto; border-left: 0; border-top: 0; }
.lz-frame > .lz-frame-b { position: absolute; inset: 0; pointer-events: none; }
.lz-frame > .lz-frame-b::before,
.lz-frame > .lz-frame-b::after {
  content: ""; position: absolute; width: 18px; height: 18px;
  border: 2px solid var(--lz-red); opacity: .45;
}
.lz-frame > .lz-frame-b::before { inset: -1px -1px auto auto; border-left: 0; border-bottom: 0; }
.lz-frame > .lz-frame-b::after  { inset: auto auto -1px -1px; border-right: 0; border-top: 0; }

/* Optional: echte Monospace für die technischen Beschriftungen. */
.lz-mono-alt {
  --lz-mono: ui-monospace, 'SFMono-Regular', 'Cascadia Mono', Menlo, Consolas, 'Liberation Mono', monospace;
}

/* 3.3 Technische Beschriftung: gesperrte Versalien in IBM Plex Sans. */
.lz-label {
  font-family: var(--lz-mono);
  font-feature-settings: "tnum" 1;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--lz-red-ink);
  margin: 0 0 .6rem;
  display: flex; align-items: center; gap: .55rem;
}
.lz-section--ink .lz-label { color: var(--lz-red-lite); }
.lz-label::before {
  content: ""; width: 22px; height: 2px; background: currentColor; flex: 0 0 auto;
}
.lz-label--plain::before { display: none; }

/* 3.4 Sektionsnummer als Marke am Rand. */
.lz-sec-no {
  font-family: var(--lz-mono);
  font-size: .72rem; letter-spacing: .16em; color: var(--lz-slate-2);
}
.lz-section--ink .lz-sec-no { color: rgba(255,255,255,.45); }

/* 3.5 Zahlen: Tabellenziffern, damit sie beim Zählen nicht springen. */
.lz-num {
  font-family: var(--lz-mono);
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  letter-spacing: -.01em;
}

/* 3.6 Statuspunkt */
.lz-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--lz-grey-ci);
  box-shadow: 0 0 0 0 rgba(198,198,198,.55);
  flex: 0 0 auto;
  animation: lzPulse 2.6s ease-out infinite;
  animation-play-state: running;
}
.lz-dot--red { background: var(--lz-red); box-shadow: 0 0 0 0 rgba(254,0,0,.55); }
@keyframes lzPulse {
  0%   { box-shadow: 0 0 0 0 currentColor; opacity: 1; }
  70%  { box-shadow: 0 0 0 9px rgba(0,0,0,0); opacity: .85; }
  100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); opacity: 1; }
}

/* 3.7 Scanline – ein einzelner heller Strich, der langsam über dunkle
   Flächen wandert. Sehr dezent, aber genau der „Leitstelle“-Eindruck. */
.lz-scan {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 0;
  opacity: calc(var(--lz-scan) * .9);
}
.lz-scan::after {
  content: ""; position: absolute; left: -10%; right: -10%; height: 220px; top: -220px;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.055) 45%, rgba(254,0,0,.10) 50%, rgba(255,255,255,.05) 55%, transparent);
  animation: lzScan calc(11s / max(var(--lz-motion), .35)) linear infinite;
}
@keyframes lzScan { to { transform: translateY(calc(100vh + 440px)); } }

/* 3.8 Datenbalken */
.lz-meter { display: block; height: 3px; background: rgba(255,255,255,.14); overflow: hidden; }
.lz-section--paper .lz-meter,
.lz-section--soft  .lz-meter { background: var(--lz-hair); }
.lz-meter > i {
  display: block; height: 100%; width: var(--lz-fill, 40%);
  background: linear-gradient(90deg, var(--lz-red), #ff6a6a);
  transform-origin: left; transform: scaleX(0);
  transition: transform 1.1s cubic-bezier(.2,.7,.2,1);
}
.is-in .lz-meter > i { transform: scaleX(1); }

/* 3.9 Buttons */
.lz-btn {
  display: inline-flex; align-items: center; gap: .6rem;
  font-weight: 700; font-size: 1rem; line-height: 1;
  padding: .95rem 1.5rem;
  border: 2px solid var(--lz-red);
  background: var(--lz-red); color: #fff;
  border-radius: var(--lz-radius);
  text-decoration: none;
  position: relative; overflow: hidden;
  transition: background .25s, color .25s, transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s;
}
.lz-btn:hover, .lz-btn:focus-visible {
  color: #fff; background: #e00000; border-color: #e00000;
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -12px rgba(254,0,0,.8);
  text-decoration: none;
}
.lz-btn svg { width: 1.05em; height: 1.05em; flex: 0 0 auto; }
.lz-btn--ghost {
  background: transparent; color: var(--lz-text); border-color: currentColor;
}
.lz-btn--ghost:hover, .lz-btn--ghost:focus-visible {
  background: var(--lz-text); color: #fff; border-color: var(--lz-text); box-shadow: none;
}
.lz-on-ink .lz-btn--ghost { color: #fff; }
.lz-on-ink .lz-btn--ghost:hover,
.lz-on-ink .lz-btn--ghost:focus-visible { background: #fff; color: var(--lz-ink); border-color: #fff; }

/* 3.10 Textlink mit Pfeil */
.lz-more {
  display: inline-flex; align-items: center; gap: .45rem;
  font-weight: 700; font-size: .92rem; text-decoration: none;
  color: var(--lz-red-ink);
}
.lz-more i { font-style: normal; transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.lz-more:hover { text-decoration: none; }
.lz-more:hover i { transform: translateX(5px); }
.lz-section--ink .lz-more { color: var(--lz-red-lite); }

/* 3.11 Einblenden beim Scrollen */
.lz-reveal-on [data-lz-reveal] { opacity: 0; transform: translateY(20px); }
.lz-reveal-on [data-lz-reveal].is-in {
  opacity: 1; transform: none;
  transition: opacity var(--lz-reveal) ease, transform calc(var(--lz-reveal) * 1.2) cubic-bezier(.2,.7,.2,1);
}

/* ==================== 4 · Kopfzeile & Navigation ========================= */
.lz-topbar {
  background: var(--lz-ink-2); color: rgba(255,255,255,.82);
  font-size: .8rem; border-bottom: 1px solid var(--lz-hair-ink);
}
.lz-topbar-inner {
  max-width: var(--lz-wide); margin-inline: auto; padding: .45rem var(--lz-gutter);
  display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; align-items: center; justify-content: space-between;
}
.lz-topbar a { color: #fff; text-decoration: none; }
.lz-topbar a:hover { color: var(--lz-red-lite); text-decoration: underline; }
.lz-topbar strong { color: #fff; }
.lz-topbar-sys {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--lz-mono); font-size: .72rem; letter-spacing: .1em;
  color: rgba(255,255,255,.7);
}
@media (max-width: 860px) { .lz-topbar-sys { display: none; } }

.lz-header {
  position: sticky; top: 0; z-index: 90;
  background: rgba(6,9,13,.92);
  backdrop-filter: saturate(140%) blur(10px);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--lz-hair-ink);
  color: #fff;
}
.lz-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, var(--lz-red) 0 var(--lz-progress, 0%), transparent var(--lz-progress, 0%));
  transition: none;
}
.lz-header-inner {
  max-width: var(--lz-head-wide); margin-inline: auto; padding: .6rem var(--lz-gutter);
  display: flex; align-items: center; gap: clamp(.6rem, 1.4vw, 1.2rem);
}
.lz-brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: #fff; margin-right: auto; min-width: 0; }
.lz-brand img { width: auto; height: 46px; flex: 0 0 auto; }
.lz-brand-txt { display: block; line-height: 1.1; }
.lz-brand-name { font-weight: 700; font-size: clamp(.92rem, .82rem + .3vw, 1.02rem); letter-spacing: -.015em; white-space: nowrap; }
/* Der Markenzusatz steht im CI-Rot. Auf dem fast schwarzen Kopf ergibt
   #fe0000 ein Kontrastverhältnis von rund 5:1 und erfüllt damit WCAG AA. */
.lz-brand-name span { color: var(--lz-brand-accent, var(--lz-red)); }
.lz-brand-sub {
  display: block; font-family: var(--lz-mono); font-size: .62rem;
  letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.55); margin-top: .18rem;
}
/* Bis 1.6.1 verschwand der Name schon unter 420 px - auf einem 390-px-Handy
   stand damit nur noch das Emblem. Der Umbruchpunkt liegt jetzt in Abschnitt 19
   bei 360 px, davor wird der Name zweizeilig gesetzt. */
/* Auf mittleren Breiten weicht zuerst die Unterzeile, dann der Name. */
@media (max-width: 1400px) { .lz-brand-sub { display: none; } }

.lz-nav ul { list-style: none; display: flex; gap: .1rem; margin: 0; padding: 0; }
.lz-nav li { position: relative; }
/* Menüpunkte brechen nie um – lieber enger setzen als zweizeilig werden. */
.lz-nav > ul > li > a { white-space: nowrap; }
.lz-nav a {
  display: flex; align-items: center; gap: .3rem;
  padding: .6rem clamp(.42rem, .75vw, .75rem); color: rgba(255,255,255,.86);
  text-decoration: none; font-size: var(--lz-menu-size); font-weight: 500;
  border-radius: var(--lz-radius); position: relative;
}
/* Kleiner Winkel als Hinweis auf ein Untermenü. */
.lz-nav > ul > li.menu-item-has-children > a::before {
  content: ""; width: 5px; height: 5px; order: 2; flex: 0 0 auto;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg); opacity: .55;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), opacity .3s;
}
.lz-nav > ul > li.menu-item-has-children:hover > a::before,
.lz-nav > ul > li.menu-item-has-children:focus-within > a::before {
  transform: translateY(0) rotate(225deg); opacity: 1;
}
.lz-nav a::after {
  content: ""; position: absolute; left: .45rem; right: .45rem; bottom: .3rem; height: 2px;
  background: var(--lz-red); transform: scaleX(0); transform-origin: left;
  transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.lz-nav a:hover, .lz-nav a:focus-visible { color: #fff; }
.lz-nav a:hover::after, .lz-nav li.current-menu-item > a::after,
.lz-nav li.current-menu-ancestor > a::after { transform: scaleX(1); }
.lz-nav .sub-menu {
  position: absolute; top: 100%; left: 0; min-width: 250px; display: block;
  background: var(--lz-ink-2); border: 1px solid var(--lz-hair-ink);
  padding: .35rem; flex-direction: column; gap: 0;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(6px);
  /* visibility NICHT weich schalten: sonst bleibt das Untermenü nach dem
     Verlassen noch .22 s unsichtbar klickbar und fängt Klicks ab. */
  transition: opacity .22s, transform .22s, visibility 0s linear .22s;
  box-shadow: 0 24px 48px -20px rgba(0,0,0,.8);
}
.lz-nav li:hover > .sub-menu,
.lz-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; pointer-events: auto;
  transform: none; transition: opacity .22s, transform .22s, visibility 0s; }
/* Ab der dritten Ebene seitlich ausklappen. Ohne diese Regel läge das
   Untermenü mit top:100%/left:0 direkt auf seinem Elternpunkt. */
.lz-nav .sub-menu .sub-menu {
  top: -.35rem; left: 100%; transform: translateX(-6px);
  box-shadow: 0 24px 48px -20px rgba(0,0,0,.85);
}
.lz-nav .sub-menu li:hover > .sub-menu,
.lz-nav .sub-menu li:focus-within > .sub-menu { transform: none; }
/* Nach links öffnen, wenn rechts kein Platz mehr ist. */
.lz-nav .sub-menu .sub-menu.is-left { left: auto; right: 100%; transform: translateX(6px); }
.lz-nav .sub-menu li:hover > .sub-menu.is-left,
.lz-nav .sub-menu li:focus-within > .sub-menu.is-left { transform: none; }
/* Untermenü-Punkte mit eigenen Kindern bekommen einen Winkel nach rechts. */
.lz-nav .sub-menu li.menu-item-has-children > a { padding-right: 1.5rem; }
.lz-nav .sub-menu li.menu-item-has-children > a::before {
  content: ""; position: absolute; right: .65rem; top: 50%; width: 5px; height: 5px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(-45deg); opacity: .55; transition: opacity .3s, transform .3s;
}
.lz-nav .sub-menu li.menu-item-has-children:hover > a::before { opacity: 1; transform: translateY(-50%) translateX(2px) rotate(-45deg); }
/* Offene Zweige liegen über ihren Geschwistern. */
.lz-nav li:hover, .lz-nav li:focus-within { z-index: 3; }
.lz-nav .sub-menu a { padding: .55rem .7rem; font-size: .9rem; }
.lz-nav .sub-menu a::after { display: none; }
.lz-nav .sub-menu a:hover { background: rgba(255,255,255,.07); }

.lz-cta {
  display: inline-flex; align-items: center; gap: .45rem;
  background: var(--lz-red); color: #fff; text-decoration: none;
  font-weight: 700; font-size: .95rem; padding: .65rem 1.1rem; border-radius: var(--lz-radius);
  white-space: nowrap;
  box-shadow: 0 0 0 0 rgba(254,0,0,.55);
  animation: lzCta 3.4s ease-out infinite;
}
@keyframes lzCta { 0%,100% { box-shadow: 0 0 0 0 rgba(254,0,0,.5); } 60% { box-shadow: 0 0 0 12px rgba(254,0,0,0); } }
.lz-cta:hover, .lz-cta:focus-visible { background: #e00000; color: #fff; text-decoration: none; }

.lz-burger {
  display: none; align-items: center; gap: .5rem;
  background: transparent; border: 1px solid var(--lz-hair-ink); color: #fff;
  font: inherit; font-size: .88rem; font-weight: 600; padding: .5rem .8rem;
  border-radius: var(--lz-radius); cursor: pointer;
}
.lz-burger b { display: block; width: 16px; height: 10px; position: relative; }
.lz-burger b::before, .lz-burger b::after, .lz-burger b i {
  content: ""; position: absolute; left: 0; right: 0; height: 2px; background: currentColor;
  transition: transform .3s, opacity .2s;
}
.lz-burger b::before { top: 0; }
.lz-burger b i { top: 4px; }
.lz-burger b::after { top: 8px; }
.lz-burger[aria-expanded="true"] b::before { transform: translateY(4px) rotate(45deg); }
.lz-burger[aria-expanded="true"] b i { opacity: 0; }
.lz-burger[aria-expanded="true"] b::after { transform: translateY(-4px) rotate(-45deg); }

@media (max-width: 1180px) {
  /* WICHTIG: backdrop-filter macht die Kopfzeile zum Bezugsrahmen für
     position:fixed. Das Schubfach hat sich dadurch an der 66 px hohen
     Kopfzeile ausgerichtet statt am Bildschirm - es war 49 px hoch und lag
     hinter der Warnzeile, also praktisch unbedienbar. Auf schmalen Geräten
     entfällt der Weichzeichner darum, die Fläche wird dafür voll deckend. */
  .lz-header { backdrop-filter: none; -webkit-backdrop-filter: none; background-color: var(--lz-ink); }
  .lz-burger { display: inline-flex; }
  .lz-nav {
    position: fixed; left: 0; right: 0;
    top: var(--lz-head-h, 64px); bottom: 0; height: auto;
    z-index: 120;
    background: var(--lz-ink); border-top: 1px solid var(--lz-hair-ink);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    padding: .6rem var(--lz-gutter) max(2.5rem, env(safe-area-inset-bottom));
    transform: translateY(-8px); opacity: 0; visibility: hidden; pointer-events: none;
    /* KERNKORREKTUR (Fehlerbild: Tipp auf einen Link öffnet eine fremde Seite).
       "visibility .25s" hielt das bildschirmfüllende Schubfach nach dem
       Schließen noch eine Viertelsekunde sichtbar UND anklickbar - unsichtbar,
       weil opacity schon 0 war. Jeder Tipp in dieser Zeit landete auf einem
       Menüeintrag darunter. visibility schaltet jetzt hart am Ende um,
       pointer-events:none nimmt das geschlossene Schubfach zusätzlich
       vollständig aus der Trefferprüfung (nötig für Safari auf dem iPhone). */
    transition: opacity .25s, transform .25s, visibility 0s linear .25s;
  }
  .lz-nav.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: none;
    transition: opacity .25s, transform .25s, visibility 0s; }
  .lz-nav ul { flex-direction: column; gap: 0; }
  .lz-nav > ul > li { border-bottom: 1px solid var(--lz-hair-ink); }
  /* Fingerfreundlich: 48 px Mindesthöhe je Eintrag (WCAG 2.5.8). */
  .lz-nav a { display: flex; align-items: center; min-height: 48px;
    padding: .7rem .2rem; font-size: 1.02rem; }
  .lz-nav a::after { display: none; }
  .lz-nav > ul > li.menu-item-has-children > a::before { display: none; }
  .lz-nav .sub-menu {
    position: static; opacity: 1; transform: none;
    /* WICHTIG: "visibility: visible" hat hier die Sichtbarkeit des
       geschlossenen Schubfachs ausgehebelt - die Untermenü-Links waren
       dauerhaft unsichtbar anklickbar und lagen über dem halben Bildschirm.
       Untermenüs folgen jetzt dem Zustand des Schubfachs. */
    visibility: inherit; pointer-events: inherit;
    background: transparent; border: 0; box-shadow: none;
    padding: 0 0 .5rem .9rem; border-left: 1px solid var(--lz-hair-ink); margin-left: .2rem;
  }
  .lz-nav .sub-menu a { color: rgba(255,255,255,.72); min-height: 44px; padding: .5rem .2rem; font-size: .96rem; }
  .lz-nav .sub-menu .sub-menu { padding-left: .9rem; }
}
@media (max-width: 560px) {
  .lz-cta .lz-cta-long { display: none; }
  .lz-cta .lz-cta-short { display: inline; }
}
.lz-cta .lz-cta-short { display: none; font-weight: 700; }

/* ======================== 5 · Bühne (Hero) =============================== */
.lz-stage {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--lz-ink); color: #fff;
  min-height: clamp(520px, 78vh, 820px);
  display: grid; align-items: center;
}
.lz-stage__photo {
  position: absolute; inset: 0; z-index: -3;
  background-size: cover; background-position: center;
  transform: scale(1.04);
}
.lz-stage__veil {
  position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(100deg,
      rgba(6,9,13,calc(var(--lz-stage-veil) * 1.1)) 0%,
      rgba(6,9,13,var(--lz-stage-veil)) 34%,
      rgba(6,9,13,calc(var(--lz-stage-veil) * .48)) 62%,
      rgba(6,9,13,calc(var(--lz-stage-veil) * .82)) 100%),
    radial-gradient(90% 70% at 8% 100%, rgba(254,0,0,.20), transparent 62%);
}
.lz-stage .lz-grid { z-index: -1; }
.lz-stage .lz-scan { z-index: -1; }

.lz-stage-inner {
  position: relative; z-index: 1;
  max-width: var(--lz-wide); margin-inline: auto; width: 100%;
  padding: clamp(3rem, 7vw, 5rem) var(--lz-gutter);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, var(--lz-stage-panel));
  gap: clamp(1.6rem, 4vw, 3.5rem); align-items: center;
}
@media (max-width: 1000px) { .lz-stage-inner { grid-template-columns: 1fr; } }

/* Statuszeile: Uhrzeit, Betriebszustand, Standort – der Kern der Idee. */
.lz-status {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem;
  font-family: var(--lz-mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.78);
  border: 1px solid var(--lz-hair-ink); background: rgba(255,255,255,.04);
  padding: .45rem .8rem; border-radius: 999px; margin-bottom: 1.4rem;
}
.lz-status .lz-sep { width: 1px; height: 12px; background: var(--lz-hair-ink); }
.lz-status b { color: #fff; font-weight: 600; }

.lz-stage h1 { margin: 0 0 1rem; font-size: clamp(2.4rem, 1.2rem + 5.2vw, 4.6rem); letter-spacing: -.035em; }
.lz-stage h1 .lz-accent { color: var(--lz-red); display: block; }
.lz-stage__lead {
  font-size: clamp(1.02rem, .98rem + .3vw, 1.2rem);
  color: rgba(255,255,255,.82); max-width: 54ch; margin: 0 0 1.9rem;
}
.lz-stage__cta { display: flex; flex-wrap: wrap; gap: .8rem; }

/* Lagekarte in der Bühne: kompakte Kennzahlenliste mit HUD-Rahmen. */
.lz-stage__panel {
  position: relative;
  background: rgba(12,18,25,.72);
  border: 1px solid var(--lz-hair-ink);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  padding: 1.4rem 1.5rem 1.5rem;
}
.lz-stage__panel h2 {
  font-family: var(--lz-mono); font-size: .74rem; letter-spacing: .18em;
  text-transform: uppercase; color: rgba(255,255,255,.6); margin: 0 0 1rem;
  display: flex; align-items: center; gap: .55rem;
}
.lz-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; margin-bottom: 1.1rem; }
.lz-kpi { border-left: 2px solid var(--lz-red); padding-left: .7rem; }
.lz-kpi .lz-num { display: block; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: 700; color: #fff; line-height: 1; }
.lz-kpi span {
  display: block; margin-top: .3rem; font-family: var(--lz-mono);
  font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.55);
}
.lz-stage__list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .1rem; }
.lz-stage__list li {
  display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: baseline;
  padding: .5rem 0; border-top: 1px solid var(--lz-hair-ink); font-size: .9rem;
}
.lz-stage__list time { font-family: var(--lz-mono); font-size: .74rem; color: var(--lz-red-lite); letter-spacing: .04em; }
.lz-stage__list b { font-weight: 600; color: #fff; }
.lz-stage__list em { font-style: normal; color: rgba(255,255,255,.55); margin-left: .4rem; font-size: .84rem; }
.lz-stage__empty { color: rgba(255,255,255,.6); font-size: .9rem; padding: .6rem 0; }

/* Herunterscrollen-Hinweis */
.lz-scrollcue {
  position: absolute; left: 50%; bottom: 1.1rem; transform: translateX(-50%);
  display: inline-flex; flex-direction: column; align-items: center; gap: .35rem;
  font-family: var(--lz-mono); font-size: .6rem; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.45); text-decoration: none; z-index: 2;
}
.lz-scrollcue i {
  display: block; width: 1px; height: 26px; background: linear-gradient(180deg, var(--lz-red), transparent);
  animation: lzCue calc(2.4s / max(var(--lz-motion), .35)) ease-in-out infinite;
}
@keyframes lzCue { 0%,100% { transform: scaleY(.4); opacity: .4; } 50% { transform: scaleY(1); opacity: 1; } }
@media (max-width: 1000px) { .lz-scrollcue { display: none; } }

/* ========================= 6 · Aufgaben ================================== */
.lz-tasks .lz-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 1.5rem; margin-bottom: clamp(1.5rem, 3vw, 2.4rem); }
@media (max-width: 700px) { .lz-tasks .lz-head .lz-more, .lz-news .lz-head .lz-more { display: none; } }
.lz-tasks .lz-head h2 { margin: 0; }
.lz-tasks-grid {
  display: grid; gap: var(--lz-tasks-gap);
  grid-template-columns: repeat(var(--lz-cols, 3), minmax(0, 1fr));
}
@media (max-width: 1000px) { .lz-tasks-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 620px)  { .lz-tasks-grid { grid-template-columns: 1fr; } }

.lz-task {
  position: relative; display: block; overflow: hidden; text-decoration: none;
  border-radius: var(--lz-radius); isolation: isolate;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .3s;
}
.lz-task:hover, .lz-task:focus-visible { text-decoration: none; transform: translateY(-5px); }
.lz-task .lz-t__title { display: block; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; }
.lz-task .lz-t__text  { display: block; font-size: .87rem; line-height: 1.5; }
.lz-task .lz-t__media { display: block; position: relative; overflow: hidden; background: var(--lz-paper-2); }
.lz-task .lz-t__media img { width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .75s cubic-bezier(.2,.7,.2,1), filter .5s; }
/* KI-Hinweis: muss auf hellen wie dunklen Motiven lesbar sein. Deshalb ein
   eigener Chip mit Kontrastfläche statt halbtransparentem Text auf dem Bild. */
.lz-t__ai {
  position: absolute; z-index: 6; display: inline-flex; align-items: center; gap: .3em;
  font-size: var(--lz-ai-size, .64rem); font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; line-height: 1; white-space: nowrap;
  padding: .34em .55em .36em .45em; border-radius: 3px;
  transition: opacity .3s, background .3s;
}
.lz-t__ai svg { width: 1em; height: 1em; flex: 0 0 auto; opacity: .85; }
.lz-ai-or { top: .6rem; right: .65rem; }
.lz-ai-ur { bottom: .6rem; right: .65rem; }
.lz-ai-ul { bottom: .6rem; left: .65rem; }
.lz-ai-ol { top: .6rem; left: .65rem; }
/* Chip (Standard): dunkle Fläche, weißer Text – trägt auf jedem Motiv. */
.lz-ai--chip { background: rgba(6,9,13,.78); color: #fff;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 1px 4px rgba(6,9,13,.35); }
/* Umriss: heller Chip mit feiner Linie – für helle Karten. */
.lz-ai--outline { background: rgba(255,255,255,.9); color: var(--lz-text);
  box-shadow: inset 0 0 0 1px rgba(11,15,20,.18); }
/* Schlicht: nur Text, aber mit Schattenkante zur Sicherheit. */
.lz-ai--plain { background: transparent; color: #fff; padding-inline: 0;
  text-shadow: 0 1px 3px rgba(6,9,13,.9), 0 0 10px rgba(6,9,13,.7); }
/* Auf hellen Kartenstilen sitzt der Hinweis auf Papier – dort Umriss-Optik. */
.lz-t--passepartout .lz-ai--chip { background: rgba(255,255,255,.92); color: var(--lz-text);
  box-shadow: inset 0 0 0 1px rgba(11,15,20,.18); }
.lz-t--passepartout .lz-ai--plain { color: var(--lz-slate); text-shadow: none; }
/* Beim Überfahren tritt der Hinweis leicht zurück, damit er den Text nicht stört. */
.lz-task:hover .lz-t__ai { opacity: .75; }

/* Leerer Kachelplatz (Bild noch nicht gesetzt) */
.lz-t__ph { position: absolute; inset: 0; background: var(--lz-paper-2);
  background-image: radial-gradient(circle at 1px 1px, rgba(254,0,0,.14) 1.3px, transparent 2px);
  background-size: 11px 11px; }
.lz-t--portfolio .lz-t__ph, .lz-t--split .lz-t__ph, .lz-t--schublade .lz-t__ph {
  background: #0d1219;
  background-image: radial-gradient(circle at 1px 1px, rgba(254,0,0,.26) 1.4px, transparent 2px); }

/* ---- Stil „bild“ (vollflächig, wie bisher) ---- */
.lz-t--bild {
  display: block; background: var(--lz-ink); color: #fff;
  aspect-ratio: var(--lz-tasks-ratio);
}
/* Erste Kachel über die volle Breite. Bei den Karten-Stilen wird sie breiter,
   nicht flacher – so bleibt das Motiv in seinem Rahmen. */
.lz-task--wide { grid-column: 1 / -1; }
.lz-t--bild.lz-task--wide { aspect-ratio: auto; height: 0; padding-bottom: var(--lz-tasks-hero-h); }
.lz-t--bild.lz-task--wide > * { position: absolute; }

/* Die Motive liegen in zwei Seitenverhältnissen vor (16:9 und 5:4). Statt zu
   beschneiden – dabei ginge die eingebrannte Überschrift verloren – wird das
   Bild vollständig gezeigt und der Rahmen von einer unscharfen, abgedunkelten
   Kopie desselben Bildes gefüllt. Kein Beschnitt, trotzdem randlos. */
.lz-t__bg {
  position: absolute; inset: -8%; z-index: 0;
  background-size: cover; background-position: center;
  filter: blur(26px) saturate(.55) brightness(.5);
  transform: scale(1.08);
  transition: filter .6s ease, transform .8s cubic-bezier(.2,.7,.2,1);
}
.lz-t--bild .lz-t__media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; z-index: 1;
  filter: saturate(calc(.55 + var(--lz-motion) * .1)) contrast(1.05);
  transform: scale(1);
  transition: filter .5s ease, transform .8s cubic-bezier(.2,.7,.2,1);
}
/* Alternativ im Customizer: füllend zuschneiden. */
.lz-fit-cover .lz-t--bild .lz-t__media img { object-fit: cover; }
.lz-fit-cover .lz-t__bg { display: none; }
.lz-t__veil {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(180deg, rgba(6,9,13,.15) 0%, rgba(6,9,13,.55) 55%, rgba(6,9,13,.92) 100%);
  transition: opacity .4s;
}
.lz-t__scan {
  position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0;
  background: repeating-linear-gradient(180deg, rgba(255,255,255,.10) 0 1px, transparent 1px 4px);
  transition: opacity .4s;
}
.lz-t--bild .lz-t__body { position: absolute; inset: auto 0 0 0; z-index: 4; padding: 1.15rem 1.25rem 1.2rem; }
.lz-t--bild .lz-t__no {
  position: absolute; top: .8rem; left: 1rem; z-index: 4;
  font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .16em; color: rgba(255,255,255,.6);
}
.lz-t--bild .lz-t__title { margin: 0 0 .3rem; font-size: clamp(1.05rem, .95rem + .5vw, 1.35rem); color: #fff; }
.lz-t--bild .lz-t__text { margin: 0; color: rgba(255,255,255,.76); max-width: 46ch;
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height .45s cubic-bezier(.2,.7,.2,1), opacity .35s, margin .45s; }
.lz-t--bild .lz-t__go {
  position: absolute; right: 1.1rem; bottom: 1.2rem; z-index: 5;
  width: 34px; height: 34px; display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.4); color: #fff; border-radius: 50%;
  transition: background .3s, border-color .3s, transform .3s cubic-bezier(.2,.7,.2,1);
}
.lz-t--bild:hover .lz-t__media img, .lz-t--bild:focus-visible .lz-t__media img { filter: saturate(1) contrast(1.02); transform: scale(var(--lz-tasks-zoom)); }
.lz-task:hover .lz-task__bg, .lz-task:focus-visible .lz-t__bg { filter: blur(22px) saturate(.75) brightness(.58); }
.lz-task:hover .lz-task__scan, .lz-task:focus-visible .lz-t__scan { opacity: calc(var(--lz-motion) * .55); }
.lz-t--bild:hover .lz-t__text, .lz-t--bild:focus-visible .lz-t__text { max-height: 6em; opacity: 1; margin-top: .35rem; }
.lz-task:hover .lz-task__go, .lz-task:focus-visible .lz-t--bild .lz-t__go {
  background: var(--lz-red); border-color: var(--lz-red); transform: translateX(3px);
}
.lz-t--bild:hover .lz-frame::before, .lz-t--bild:focus-visible .lz-frame::before { inset: 7px auto auto 7px; }
.lz-t--bild:hover .lz-frame::after,  .lz-t--bild:focus-visible .lz-frame::after  { inset: auto 7px 7px auto; }
.lz-t--bild .lz-frame { position: absolute; inset: 0; z-index: 4; pointer-events: none; }


/* =================== 7 · Lage (Einsatz-Ticker) =========================== */
.lz-lage { position: relative; overflow: hidden; }
.lz-lage-inner { position: relative; z-index: 1; }
.lz-lage__box {
  display: grid; grid-template-columns: minmax(220px, var(--lz-lage-side)) 1fr;
  gap: clamp(1rem, 3vw, 2.4rem);
  border: 1px solid var(--lz-hair-ink);
  background: rgba(255,255,255,.03);
  padding: clamp(1.1rem, 2.5vw, 1.6rem);
}
@media (max-width: 820px) { .lz-lage__box { grid-template-columns: 1fr; } }
.lz-lage__side h2 { font-size: clamp(1.3rem, 1.1rem + .9vw, 1.8rem); margin: 0 0 .5rem; }
.lz-lage__side p { color: rgba(255,255,255,.7); font-size: .92rem; }
.lz-lage__meters { display: grid; gap: .8rem; margin: 1.1rem 0; }
.lz-lage__meter b { display: flex; justify-content: space-between; font-family: var(--lz-mono);
  font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.6);
  font-weight: 500; margin-bottom: .35rem; }
.lz-lage__meter b span { color: #fff; }

.lz-feed { min-width: 0; }
.lz-feed__head {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  font-family: var(--lz-mono); font-size: .66rem; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.5); border-bottom: 1px solid var(--lz-hair-ink); padding-bottom: .5rem;
}
.lz-feed__view { position: relative; overflow: hidden; margin-top: .2rem; }
.lz-feed__view::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 34px; pointer-events: none;
  background: linear-gradient(180deg, transparent, var(--lz-ink));
}
.lz-feed ul { list-style: none; margin: 0; padding: 0; }
.lz-feed li {
  display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: baseline;
  padding: .62rem .2rem; border-bottom: 1px solid var(--lz-hair-ink); font-size: .93rem;
}
.lz-feed li time { font-family: var(--lz-mono); font-size: .76rem; color: var(--lz-red-lite); white-space: nowrap; }
.lz-feed li b { font-weight: 600; color: #fff; }
.lz-feed li em { font-style: normal; color: rgba(255,255,255,.55); font-size: .84rem; white-space: nowrap; }
.lz-feed__empty { color: rgba(255,255,255,.6); padding: .8rem .2rem; font-size: .92rem; }
.lz-feed ul.is-rolling { animation: lzRoll var(--lz-roll, 26s) linear infinite; }
@keyframes lzRoll { from { transform: translateY(0); } to { transform: translateY(var(--lz-roll-end, -50%)); } }
@media (max-width: 560px) {
  .lz-feed li { grid-template-columns: 1fr; gap: .1rem; }
  .lz-feed li em { white-space: normal; }
}

/* ================= 8 · Verband (Karte & Kennzahlen) ====================== */
.lz-verband-inner { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: clamp(1.6rem,4vw,3.2rem); align-items: center; }
@media (max-width: 940px) { .lz-verband-inner { grid-template-columns: 1fr; } }
.lz-verband__text p { color: var(--lz-slate); max-width: 62ch; }
.lz-verband__text h2 { color: var(--lz-text); }

.lz-map {
  position: relative; border: 1px solid var(--lz-hair); background: var(--lz-paper);
  padding: 1.2rem 1.3rem 1.3rem;
}
.lz-map__head {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--lz-mono); font-size: .66rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--lz-slate-2); margin-bottom: .6rem;
}
.lz-map__stage { position: relative; display: flex; justify-content: center; }
.lz-map__wrap { position: relative; aspect-ratio: 1000 / 1262.4; height: var(--lz-map-size); max-width: 100%; }
.lz-map svg { display: block; width: 100%; height: 100%; overflow: visible; }
.lz-region-fill { fill: rgba(254,0,0,.09); }
.lz-region-line { fill: none; stroke: var(--lz-red); stroke-width: 9; stroke-linejoin: round; opacity: .4; }
.lz-region-draw {
  fill: none; stroke: var(--lz-red); stroke-width: 11; stroke-linejoin: round; stroke-linecap: round;
  stroke-dasharray: 1000; stroke-dashoffset: 1000;
  animation: lzDraw calc(var(--lz-map-speed) / max(var(--lz-motion), .35)) linear infinite;
}
@keyframes lzDraw {
  0%   { stroke-dashoffset: 1000; stroke-opacity: 1; }
  70%  { stroke-dashoffset: 0;    stroke-opacity: 1; }
  88%  { stroke-dashoffset: 0;    stroke-opacity: 1; }
  100% { stroke-dashoffset: 0;    stroke-opacity: 0; }
}
.lz-radar-rings circle { fill: none; stroke: var(--lz-red); stroke-width: 4; opacity: .26; stroke-dasharray: 14 22; }
.lz-radar-edge { fill: none; stroke: var(--lz-red); stroke-width: 6; opacity: .55; }
.lz-radar-sweep { animation: lzSpin calc(var(--lz-map-speed) / max(var(--lz-motion), .35)) linear infinite; }
@keyframes lzSpin { to { transform: rotate(360deg); } }
.lz-pin {
  position: absolute; transform: translate(-50%,-50%); width: 12px; height: 12px; border-radius: 50%;
  background: var(--lz-red); box-shadow: 0 0 0 3px #fff, 0 2px 6px rgba(16,24,40,.35);
}
.lz-pin i { position: absolute; inset: -8px; border-radius: 50%; border: 2px solid rgba(254,0,0,.5);
  animation: lzPing 2.6s ease-out infinite; }
.lz-pin--2 i { animation-delay: 1.3s; }
@keyframes lzPing { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(1.75); opacity: 0; } }
.lz-pin b {
  position: absolute; left: 50%; top: calc(100% + 8px); transform: translateX(-50%);
  font-family: var(--lz-mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--lz-text); white-space: nowrap; background: rgba(255,255,255,.92);
  padding: .1rem .35rem; box-shadow: 0 1px 3px rgba(16,24,40,.16);
}
.lz-map__offices { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
@media (max-width: 520px) { .lz-map__offices { grid-template-columns: 1fr; } }
.lz-map__offices li { border-left: 2px solid var(--lz-red); padding: .45rem .65rem; background: var(--lz-paper-2); }
.lz-map__offices b { display: block; font-size: .92rem; }
.lz-map__offices span { display: block; font-size: .8rem; color: var(--lz-slate); }

/* Kennzahlenreihe */
.lz-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 1rem; margin-top: clamp(2rem, 4vw, 3rem); justify-items: stretch;
}
.lz-stat {
  position: relative; background: var(--lz-paper); border: 1px solid var(--lz-hair);
  padding: 1.1rem 1.15rem 1.05rem; width: 100%;
  display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ico num" "meter meter" "label label";
  column-gap: .8rem; row-gap: .55rem; align-items: center;
  transition: border-color .3s, transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s;
}
.lz-section--soft .lz-stat { background: var(--lz-paper); }
.lz-stat:hover { transform: translateY(-3px); border-color: rgba(254,0,0,.35); box-shadow: 0 18px 36px -24px rgba(16,24,40,.5); }
.lz-stat__ico {
  grid-area: ico; width: 2.5em; height: 2.5em; font-size: 1.05rem;
  display: grid; place-items: center; border: 1px solid rgba(254,0,0,.22);
  color: var(--lz-red); background: rgba(254,0,0,.06);
}
.lz-stat__ico svg { width: 56%; height: 56%; }
.lz-stat__ico svg * { stroke-width: 1.7; }
.lz-stat__num {
  grid-area: num; display: flex; align-items: baseline; gap: .12em;
  font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.15rem); font-weight: 700; color: var(--lz-red-ink); line-height: 1;
}
.lz-stat__num sup { font-size: .44em; font-weight: 600; color: var(--lz-slate-2); top: 0; position: relative; }
.lz-stat .lz-meter { grid-area: meter; }
.lz-stat__label { grid-area: label; font-size: .88rem; line-height: 1.35; color: var(--lz-slate); text-wrap: balance; }
.lz-stat--live::after {
  content: ""; position: absolute; top: .8rem; right: .8rem; width: 8px; height: 8px; border-radius: 50%;
  background: var(--lz-red); animation: lzPing 2.2s ease-out infinite;
}

/* ========================= 9 · Meldungen ================================= */
.lz-news .lz-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem;
  padding-bottom: .9rem; border-bottom: 1px solid var(--lz-hair); margin-bottom: clamp(1.2rem, 2.5vw, 1.8rem); }
.lz-news .lz-head h2 { margin: 0; }
@media (max-width: 640px) { .lz-news .lz-head .lz-more { display: none; } }
.lz-news-grid { display: grid; gap: var(--lz-news-gap); grid-template-columns: 1.1fr .9fr; }
.lz-news-grid > .lz-post--lead { grid-row: 1 / span var(--lz-news-rows, 3); }
@media (max-width: 900px) { .lz-news-grid { grid-template-columns: 1fr; } .lz-news-grid > .lz-post--lead { grid-row: auto; } }

.lz-post {
  position: relative; background: var(--lz-paper); border: 1px solid var(--lz-hair);
  overflow: hidden; transition: border-color .3s, transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s;
}
.lz-post:hover { transform: translateY(-3px); border-color: rgba(254,0,0,.3); box-shadow: 0 22px 44px -26px rgba(16,24,40,.5); }
.lz-post__media { position: relative; overflow: hidden; background: var(--lz-paper-2); }
.lz-post__media img { width: 100%; height: 100%; object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .45s; filter: saturate(.9); }
.lz-post:hover .lz-post__media img { transform: scale(1.04); filter: none; }
.lz-post__ph { position: absolute; inset: 0; display: grid; place-items: center;
  background: var(--lz-paper-2);
  background-image: radial-gradient(circle at 1px 1px, rgba(254,0,0,.15) 1.3px, transparent 2px);
  background-size: 11px 11px; }
.lz-post__ph img { width: auto; height: 38%; max-height: 74px; opacity: .38; }
.lz-post__no { position: absolute; top: .5rem; right: .6rem; z-index: 2;
  font-family: var(--lz-mono); font-size: .66rem; letter-spacing: .1em; color: var(--lz-red-ink);
  background: rgba(255,255,255,.85); padding: .12rem .3rem; }
.lz-post__body { padding: .95rem 1.05rem 1.05rem; }
.lz-post__meta { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; margin: 0 0 .4rem;
  font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--lz-slate-2); }
.lz-post__cat { color: #fff; background: var(--lz-red); padding: .14rem .45rem .16rem .38rem;
  clip-path: polygon(0 0, 100% 0, 100% 100%, .3rem 100%); letter-spacing: .09em; }
.lz-post__title { margin: 0 0 .35rem; font-size: 1.05rem; line-height: 1.3; }
.lz-post__title a { color: var(--lz-text); text-decoration: none;
  background-image: linear-gradient(var(--lz-red), var(--lz-red)); background-size: 0% 2px;
  background-position: 0 100%; background-repeat: no-repeat;
  transition: background-size .4s cubic-bezier(.2,.7,.2,1), color .3s; }
.lz-post__title a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.lz-post:hover .lz-post__title a { background-size: 100% 2px; color: var(--lz-red-ink); }
.lz-post__title a:hover, .lz-post__title a:focus { text-decoration: none; }
.lz-post__ex { margin: 0 0 .65rem; font-size: .89rem; line-height: 1.5; color: var(--lz-slate); }

/* Aufmacher: Bild und Text als Ebenen übereinander (kein position:absolute,
   damit der Stretched Link die ganze Karte trifft). */
.lz-post--lead { display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr;
  min-height: var(--lz-news-lead-h); background: var(--lz-ink); border-color: #1a222c; }
.lz-post--lead .lz-post__media { grid-area: 1 / 1; }
.lz-post--lead .lz-post__body { grid-area: 1 / 1; align-self: end; z-index: 2; padding: 1.5rem 1.4rem 1.3rem;
  background: linear-gradient(180deg, rgba(6,9,13,0) 0%, rgba(6,9,13,.62) 42%, rgba(6,9,13,.95) 100%); }
.lz-post--lead .lz-post__title { font-size: clamp(1.2rem, 1rem + 1vw, 1.65rem); }
.lz-post--lead .lz-post__title a { color: #fff; }
.lz-post--lead:hover .lz-post__title a { color: #fff; background-image: linear-gradient(#fff,#fff); }
.lz-post--lead .lz-post__meta { color: rgba(255,255,255,.72); }
.lz-post--lead .lz-post__ex { color: rgba(255,255,255,.84); max-width: 52ch; }
.lz-post--lead .lz-more { color: #fff; }
.lz-post--lead .lz-post__ph { background: #0d1219;
  background-image: radial-gradient(circle at 1px 1px, rgba(254,0,0,.3) 1.4px, transparent 2px); background-size: 12px 12px; }
.lz-post--lead .lz-post__no { background: transparent; color: rgba(255,255,255,.6); }

/* Kompakte Karte */
.lz-post--row { display: grid; grid-template-columns: minmax(110px, 34%) 1fr; }
.lz-post--row .lz-post__media { min-height: 118px; height: 100%; }
.lz-post--row .lz-post__ex { display: none; }
@media (max-width: 520px) {
  .lz-post--row { grid-template-columns: 1fr; }
  .lz-post--row .lz-post__media { aspect-ratio: 16/9; min-height: 0; }
  .lz-post--row .lz-post__media:has(.lz-post__ph) { aspect-ratio: 32/9; }
}
/* Rasteransicht (Archiv) */
.lz-post-grid { display: grid; gap: var(--lz-news-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%,290px), 1fr)); }
.lz-post-grid .lz-post__media { aspect-ratio: 16/10; }

/* ======================= 10 · Kontaktband ================================ */
.lz-cband { position: relative; overflow: hidden; background: var(--lz-ink); color: #fff; }
.lz-cband-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr .8fr;
  gap: clamp(1.4rem, 4vw, 3rem); align-items: center; }
@media (max-width: 860px) { .lz-cband-inner { grid-template-columns: 1fr; } }
.lz-cband h2 { margin: 0 0 .6rem; }
.lz-cband p { color: rgba(255,255,255,.78); max-width: 56ch; }
.lz-cband__box { border: 1px solid var(--lz-hair-ink); padding: 1.2rem 1.3rem; background: rgba(255,255,255,.03); }
.lz-cband__box dl { margin: 0; display: grid; gap: .7rem; }
.lz-cband__box dt { font-family: var(--lz-mono); font-size: .64rem; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(255,255,255,.5); }
.lz-cband__box dd { margin: .1rem 0 0; font-size: 1.02rem; font-weight: 600; }
.lz-cband__box dd a { color: #fff; text-decoration: none; }
.lz-cband__box dd a:hover { color: var(--lz-red-lite); text-decoration: underline; }

/* ================== 11 · Seitenvorlagen & Inhalte ======================== */
/* isolation:isolate ist hier PFLICHT und war der Grund, warum das Banner
   schwarz blieb: Foto und Abdunklung liegen auf z-index -2/-1. Ohne eigenen
   Stapelkontext werden negative Ebenen HINTER dem Hintergrund des Elternteils
   gezeichnet - also hinter dem deckenden var(--lz-ink). Die Bühne (.lz-stage)
   hatte die Isolation von Anfang an, das Banner nicht. */
.lz-banner { position: relative; isolation: isolate; overflow: hidden;
  background: var(--lz-ink); color: #fff;
  min-height: var(--lz-banner-h, 360px); display: flex; align-items: flex-end; }
.lz-banner__photo { position: absolute; inset: 0; z-index: -2; background-size: cover;
  background-position: var(--lz-banner-pos, 50% 50%); background-repeat: no-repeat; }

/* Abdunklung. Ziel: das Motiv muss SICHTBAR bleiben. Darum liegt das Dunkel
   dort, wo Schrift steht (unten und links) und läuft nach rechts oben fast
   auf null aus. Unten links kommen beide Verläufe zusammen und ergeben rund
   93 % Deckung - weiße Schrift bleibt damit auf jedem Motiv sicher lesbar
   (WCAG 1.4.3). Der Regler im Customizer skaliert beide Verläufe. */
.lz-banner__veil { position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(to top,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * 1.62)) 0%,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * .55)) 46%,
      rgba(6,9,13,0) 88%),
    linear-gradient(100deg,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * 1.15)) 0%,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * .72)) 46%,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * .18)) 100%); }

/* Verlauf nur von unten - für Motive, deren Aussage links liegt. */
.lz-banner--v-unten .lz-banner__veil { background:
    linear-gradient(to top,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * 1.7)) 0%,
      rgba(6,9,13,calc(var(--lz-banner-veil, .52) * .70)) 52%,
      rgba(6,9,13,0) 92%); }

/* Gleichmäßig - für sehr unruhige Motive. */
.lz-banner--v-gleich .lz-banner__veil { background: rgba(6,9,13,var(--lz-banner-veil, .52)); }

.lz-banner-inner { position: relative; z-index: 1; width: 100%; max-width: var(--lz-wide); margin-inline: auto;
  padding: clamp(2.4rem, 5vw, 4rem) var(--lz-gutter) clamp(2rem, 4vw, 3rem); }
.lz-banner h1 { margin: .2rem 0 0; }
.lz-banner__sub { margin: .7rem 0 0; color: rgba(255,255,255,.8); max-width: 62ch; }

.lz-crumbs { font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.55); margin: 0 0 .3rem; }
.lz-crumbs a { color: rgba(255,255,255,.8); text-decoration: none; }
.lz-crumbs a:hover { color: #fff; text-decoration: underline; }
.lz-crumbs .lz-crumb-sep { margin: 0 .4rem; opacity: .5; }
.lz-crumbs .lz-crumb-current { color: #fff; }

.lz-content { padding-block: var(--lz-sec); }
.lz-content-inner { max-width: var(--lz-wide); margin-inline: auto; padding-inline: var(--lz-gutter);
  display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: clamp(1.6rem, 4vw, 3rem); align-items: start; }
.lz-content-inner--single { grid-template-columns: minmax(0,1fr); }
/* Ohne Inhaltsverzeichnis darf der Inhalt die ganze Breite nutzen. Sonst blieb
   rechts eine leere 280-px-Spalte stehen und Kachelraster des Dokumente-
   Plugins fielen auf zu wenige Spalten zurück. */
.lz-content-inner:not(:has(.lz-aside)) { grid-template-columns: minmax(0,1fr); }
@media (max-width: 940px) { .lz-content-inner { grid-template-columns: minmax(0,1fr); } }

/* Die Lesebreite gilt für Fließtext, nicht für den ganzen Block. Bilder,
   Tabellen und die Kachelraster des Dokumente-Plugins nutzen die volle
   Spaltenbreite – sonst stünden sie unnötig schmal und untereinander. */
.lz-prose { max-width: none; }
.lz-prose > p,
.lz-prose > ul,
.lz-prose > ol,
.lz-prose > h2,
.lz-prose > h3,
.lz-prose > h4,
.lz-prose > blockquote,
.lz-prose > .wp-block-heading,
.lz-prose > .wp-block-paragraph,
.lz-prose > .wp-block-list { max-width: 78ch; }
.lz-prose > * + * { margin-top: 1.15em; }
.lz-prose h2 { margin-top: 2.2em; padding-top: .3em; }
.lz-prose h2::before { content: ""; display: block; width: 44px; height: 2px; background: var(--lz-red); margin-bottom: .7rem; }
.lz-prose h3 { margin-top: 1.8em; }
.lz-prose img, .lz-prose figure { border-radius: var(--lz-radius); }
.lz-prose figcaption { font-size: .82rem; color: var(--lz-slate); margin-top: .5rem; }
.lz-prose blockquote {
  margin: 1.6em 0; padding: .2rem 0 .2rem 1.2rem; border-left: 3px solid var(--lz-red);
  font-size: 1.1rem; color: var(--lz-text);
}
.lz-prose table { width: 100%; border-collapse: collapse; font-size: .94rem; }
.lz-prose th, .lz-prose td { text-align: left; padding: .6rem .7rem; border-bottom: 1px solid var(--lz-hair); }
.lz-prose th { font-family: var(--lz-mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--lz-slate); }
.lz-prose code { font-family: var(--lz-mono); font-size: .9em; background: var(--lz-paper-2); padding: .1em .35em; }
.lz-prose ul li::marker { color: var(--lz-red); }
.lz-prose ol li::marker { color: var(--lz-red); font-family: var(--lz-mono); }

/* Seitenspalte mit Inhaltsverzeichnis */
.lz-aside { position: sticky; top: calc(var(--lz-head-h, 64px) + 1.2rem); }
.lz-toc { border: 1px solid var(--lz-hair); padding: 1rem 1.1rem; background: var(--lz-paper-2); }
.lz-toc h2 { font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--lz-slate); margin: 0 0 .6rem; }
.lz-toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; display: grid; gap: .1rem; }
.lz-toc li { counter-increment: toc; }
.lz-toc a { display: grid; grid-template-columns: 1.9rem 1fr; gap: .2rem; padding: .35rem 0;
  font-size: .9rem; color: var(--lz-text); text-decoration: none; border-top: 1px solid var(--lz-hair); }
.lz-toc li:first-child a { border-top: 0; }
.lz-toc a::before { content: counter(toc, decimal-leading-zero); font-family: var(--lz-mono);
  font-size: .7rem; color: var(--lz-slate-2); }
.lz-toc a:hover, .lz-toc a.is-current { color: var(--lz-red-ink); }
.lz-toc a.is-current::before { color: var(--lz-red); }
@media (max-width: 940px) { .lz-aside { position: static; margin-top: 2rem; } }

/* Lesefortschritt im Beitrag */
.lz-meta-row { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; align-items: center;
  font-family: var(--lz-mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--lz-slate-2); margin-bottom: 1.4rem; }
.lz-share { display: flex; gap: .5rem; align-items: center; margin-top: 2.5rem;
  padding-top: 1.2rem; border-top: 1px solid var(--lz-hair); }
.lz-share a, .lz-share button {
  font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer;
  border: 1px solid var(--lz-hair); background: var(--lz-paper); color: var(--lz-text);
  padding: .45rem .8rem; border-radius: var(--lz-radius); text-decoration: none;
}
.lz-share a:hover, .lz-share button:hover { border-color: var(--lz-red); color: var(--lz-red-ink); }

/* Blätterung */
.lz-pagination { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: center; margin-top: 2.5rem; }
.lz-pagination .page-numbers {
  display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 .6rem;
  border: 1px solid var(--lz-hair); font-family: var(--lz-mono); font-size: .85rem;
  color: var(--lz-text); text-decoration: none;
}
.lz-pagination .page-numbers:hover { border-color: var(--lz-red); color: var(--lz-red-ink); }
.lz-pagination .page-numbers.current { background: var(--lz-red); border-color: var(--lz-red); color: #fff; }

/* Filterleiste im Archiv */
.lz-filters { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.6rem; }
.lz-filters a {
  font-family: var(--lz-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  border: 1px solid var(--lz-hair); padding: .4rem .75rem; color: var(--lz-text); text-decoration: none;
}
.lz-filters a:hover { border-color: var(--lz-red); color: var(--lz-red-ink); }
.lz-filters a.is-active { background: var(--lz-text); border-color: var(--lz-text); color: #fff; }

/* Suchformular */
.lz-searchform { display: flex; gap: .5rem; max-width: 520px; }
.lz-searchform input[type="search"] {
  flex: 1 1 auto; font: inherit; padding: .75rem .9rem; border: 1px solid var(--lz-hair);
  border-radius: var(--lz-radius); background: var(--lz-paper); color: var(--lz-text); min-width: 0;
}
.lz-searchform input[type="search"]:focus-visible { border-color: var(--lz-red); }
.lz-searchform button { font: inherit; font-weight: 700; padding: .75rem 1.1rem; cursor: pointer;
  border: 0; background: var(--lz-red); color: #fff; border-radius: var(--lz-radius); }

/* 404 */
.lz-404 { text-align: center; padding-block: clamp(3rem, 8vw, 6rem); }
.lz-404__code { font-family: var(--lz-mono); font-size: clamp(4rem, 12vw, 9rem); font-weight: 700;
  line-height: 1; color: transparent; -webkit-text-stroke: 2px var(--lz-red); letter-spacing: .04em; }
.lz-404 .lz-searchform { margin: 1.6rem auto 0; }

/* Dokumentkarten (Plugin „RettZV Dokumente“ bleibt kompatibel) */
.lz-notice { border: 1px solid var(--lz-hair); border-left: 3px solid var(--lz-red);
  background: var(--lz-paper-2); padding: 1rem 1.2rem; }

/* ========================== 12 · Fußzeile =============================== */
.lz-footer { background: var(--lz-ink); color: rgba(255,255,255,.78); position: relative; overflow: hidden; }
.lz-footer-inner { position: relative; z-index: 1; max-width: var(--lz-wide); margin-inline: auto;
  padding: clamp(2.4rem,5vw,3.6rem) var(--lz-gutter) 2rem; }
.lz-footer__claim { font-size: clamp(1.5rem, 1.2rem + 1.6vw, 2.2rem); font-weight: 700; color: #fff;
  letter-spacing: -.02em; margin: 0 0 1.8rem; }
.lz-footer__claim span { color: var(--lz-red); }
.lz-footer-grid { display: grid; grid-template-columns: 1.35fr .85fr .85fr .85fr; gap: clamp(1.4rem,3vw,2.5rem);
  padding-top: 1.6rem; border-top: 1px solid var(--lz-hair-ink); }
@media (max-width: 1000px) { .lz-footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .lz-footer-grid { grid-template-columns: 1fr; } }
.lz-footer h2 { font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,255,255,.5); margin: 0 0 .8rem; font-weight: 600; }
.lz-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.lz-footer a { color: rgba(255,255,255,.82); text-decoration: none; }
.lz-footer a:hover { color: #fff; text-decoration: underline; }
.lz-footer__org { color: #fff; font-weight: 600; margin: 0 0 .1rem; }
.lz-footer__orgsub { font-size: .85rem; color: rgba(255,255,255,.55); margin: 0 0 .9rem; }
.lz-footer__offices { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: .9rem; }
@media (max-width: 560px) { .lz-footer__offices { grid-template-columns: 1fr; } }
.lz-footer__offices p { margin: 0; font-size: .88rem; }
.lz-footer__offices strong { color: #fff; }
.lz-social { display: flex; gap: .5rem; margin-top: .9rem; }
.lz-social a { border: 1px solid var(--lz-hair-ink); padding: .35rem .7rem; font-size: .82rem; }
.lz-social a:hover { border-color: var(--lz-red); text-decoration: none; }
.lz-footer-legal { border-top: 1px solid var(--lz-hair-ink); }
.lz-footer-legal-inner { max-width: var(--lz-wide); margin-inline: auto; padding: 1rem var(--lz-gutter);
  display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; justify-content: space-between; align-items: center;
  font-size: .8rem; color: rgba(255,255,255,.5); }
.lz-footer-legal a { color: rgba(255,255,255,.7); }

/* Rechtliches steht jetzt als eigene Spalte über dem Strich. Die Punkte
   bekommen einen feinen roten Marker, damit die Liste nicht wie eine
   abgelegte Restzeile wirkt. */
.lz-legal-col ul { display: grid; gap: .3rem; }
.lz-legal-col li a {
  display: inline-flex; align-items: baseline; gap: .5rem;
  color: rgba(255,255,255,.8); text-decoration: none; font-size: .92rem;
}
.lz-legal-col li a::before {
  content: ""; width: 10px; height: 1px; background: var(--lz-red); flex: 0 0 auto;
  transform-origin: left; transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.lz-legal-col li a:hover { color: #fff; text-decoration: none; }
.lz-legal-col li a:hover::before { transform: scaleX(1.8); }

/* Nach-oben-Schaltfläche */
.lz-top {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 80;
  width: 44px; height: 44px; display: grid; place-items: center;
  background: var(--lz-red); color: #fff; border: 0; border-radius: 50%; cursor: pointer;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(10px);
  transition: opacity .3s, transform .3s, visibility 0s linear .3s;
}
.lz-top.is-on { opacity: 1; visibility: visible; pointer-events: auto; transform: none;
  transition: opacity .3s, transform .3s, visibility 0s; }
.lz-top:hover { background: #e00000; }

/* ============ 13 · Bewegung, Barrierefreiheit, Druck ===================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  .lz-scan, .lz-scrollcue i { display: none; }
  .lz-reveal-on [data-lz-reveal] { opacity: 1; transform: none; }
  .lz-region-draw { stroke-dasharray: none; stroke-dashoffset: 0; }
  .lz-meter > i { transform: scaleX(1); }
}
/* Bewegung im Customizer ganz abgeschaltet */
.lz-motion-off .lz-scan,
.lz-motion-off .lz-scrollcue i { display: none; }
.lz-motion-off .lz-radar-sweep,
.lz-motion-off .lz-region-draw,
.lz-motion-off .lz-dot,
.lz-motion-off .lz-cta { animation: none; }
.lz-motion-off .lz-region-draw { stroke-dasharray: none; stroke-dashoffset: 0; }
.lz-motion-off [data-lz-reveal] { opacity: 1 !important; transform: none !important; }

@media print {
  .lz-header, .lz-topbar, .lz-footer, .lz-top, .lz-scan, .lz-grid, .lz-scrollcue,
  .lz-aside, .lz-share, .lz-pagination, .lz-filters { display: none !important; }
  body { color: #000; background: #fff; font-size: 11pt; }
  .lz-section, .lz-content { padding-block: 0; }
  a { color: #000 !important; text-decoration: underline; }
  .lz-prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; word-break: break-all; }
}


/* ===========================================================================
   14 · Warnlage
   Amtliche Warnungen (NINA/BBK) und eigene Meldungen. Die Stufe wird über eine
   Farbvariable geführt, sodass Leiste, Pille und Liste automatisch zusammen-
   passen. Die Warnleiste erscheint nur, wenn wirklich etwas anliegt.
   =========================================================================== */
.lz-lvl--klar    { --lz-lvl: var(--lz-grey-ci); --lz-lvl-ink: #4a5560; }
.lz-lvl--gering  { --lz-lvl: var(--lz-grey-ci); --lz-lvl-ink: #4a5560; }
.lz-lvl--mittel  { --lz-lvl: #ff7a7a;           --lz-lvl-ink: var(--lz-red-ink); }
.lz-lvl--hoch    { --lz-lvl: var(--lz-red);     --lz-lvl-ink: var(--lz-red-ink); }
.lz-lvl--extrem  { --lz-lvl: var(--lz-red);     --lz-lvl-ink: #000; }

/* Stufe 1 und 2 bleiben zurückhaltend: Umriss statt Fläche. */
.lz-lvl--gering .lz-warnbar__lvl,
.lz-lvl--klar   .lz-warnbar__lvl {
  background: transparent; color: var(--lz-grey-ci);
  box-shadow: inset 0 0 0 1px var(--lz-hair-ink);
}
.lz-lvl--mittel .lz-warnbar__lvl { background: transparent; color: var(--lz-lvl); box-shadow: inset 0 0 0 1px currentColor; }
.lz-lvl--gering .lz-warn__lvl { background: transparent; color: var(--lz-lvl-ink); box-shadow: inset 0 0 0 1px var(--lz-hair); }
.lz-lvl--mittel .lz-warn__lvl { background: transparent; color: var(--lz-red-ink); box-shadow: inset 0 0 0 1px currentColor; }
/* Höchste Stufe zusätzlich mit schwarz-roter Warnschraffur im Chip. */
.lz-lvl--extrem .lz-warnbar__lvl,
.lz-lvl--extrem .lz-warn__lvl {
  background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.55) 0 6px, transparent 6px 12px);
}

/* --- Leiste unter der Kopfzeile ---------------------------------------- */
.lz-warnbar {
  position: relative; overflow: hidden;
  background: var(--lz-ink-2); color: #fff;
  border-bottom: 1px solid var(--lz-hair-ink);
}
/* Warnschraffur am linken Rand – Anleihe bei der Blockmarkierung der Fahrzeuge. */
.lz-warnbar::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: 120px;
  background: repeating-linear-gradient(115deg,
    color-mix(in srgb, var(--lz-lvl) 55%, transparent) 0 10px,
    transparent 10px 20px);
  -webkit-mask-image: linear-gradient(90deg, #000, transparent);
          mask-image: linear-gradient(90deg, #000, transparent);
  opacity: .5; pointer-events: none;
}
/* Feiner Lichtsaum, der die Stufe trägt. */
.lz-warnbar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--lz-lvl), transparent 60%);
}
.lz-warnbar-inner {
  position: relative; z-index: 1;
  max-width: var(--lz-head-wide); margin-inline: auto;
  padding: .6rem var(--lz-gutter);
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem;
  font-size: .92rem;
}
.lz-warnbar__ico { display: grid; place-items: center; width: 22px; height: 22px; color: var(--lz-lvl); flex: 0 0 auto; }
.lz-warnbar__ico svg { width: 100%; height: 100%; }
.lz-lvl--hoch .lz-warnbar__ico,
.lz-lvl--extrem .lz-warnbar__ico { animation: lzBlink calc(2.4s / max(var(--lz-motion), .35)) steps(1, end) infinite; }
@keyframes lzBlink { 0%, 60% { opacity: 1; } 61%, 100% { opacity: .35; } }
.lz-warnbar__lvl {
  font-family: var(--lz-mono); font-size: .64rem; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--lz-ink); background: var(--lz-lvl);
  padding: .22rem .5rem .24rem; border-radius: 2px; flex: 0 0 auto;
}
.lz-warnbar__txt { font-weight: 600; min-width: 0; }
.lz-warnbar__area {
  font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .1em;
  text-transform: uppercase; color: inherit; opacity: .6;
  border-left: 1px solid var(--lz-hair-ink); padding-left: .9rem;
}
.lz-warnbar__more, .lz-warnbar__rest {
  margin-left: auto; display: inline-flex; align-items: center; gap: .35rem;
  color: #fff; text-decoration: none; font-weight: 700; font-size: .85rem; white-space: nowrap;
}
.lz-warnbar__rest { margin-left: 0; color: var(--lz-lvl); }
.lz-warnbar__more i { font-style: normal; transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.lz-warnbar__more:hover { color: #fff; text-decoration: none; }
.lz-warnbar__more:hover i { transform: translateX(4px); }
@media (max-width: 720px) {
  .lz-warnbar__area { display: none; }
  .lz-warnbar__more { margin-left: 0; }
}

/* --- Pille in der Bühne ------------------------------------------------- */
.lz-warnpill {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem;
  font-family: var(--lz-mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.78);
  border: 1px solid var(--lz-hair-ink); background: rgba(255,255,255,.04);
  padding: .45rem .85rem; border-radius: 999px; margin: 0 0 1.4rem;
  max-width: 100%;
}
.lz-warnpill b { color: var(--lz-lvl); font-weight: 700; }
.lz-warnpill .lz-sep { width: 1px; height: 12px; background: var(--lz-hair-ink); }
.lz-warnpill > span:last-child {
  color: inherit; opacity: .82; text-transform: none; letter-spacing: .02em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 44ch;
}
.lz-warnpill .lz-dot { background: var(--lz-lvl); }

/* --- Abschnitt mit allen Meldungen -------------------------------------- */
.lz-warnsec .lz-head { display: flex; flex-wrap: wrap; align-items: flex-end;
  justify-content: space-between; gap: 1rem 1.5rem;
  padding-bottom: .9rem; border-bottom: 1px solid var(--lz-hair); margin-bottom: 1.4rem; }
.lz-warnsec .lz-head h2 { margin: 0; }

.lz-warn-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.lz-warn {
  position: relative; display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: .9rem 1.2rem;
  background: var(--lz-paper); border: 1px solid var(--lz-hair);
  border-left: 3px solid var(--lz-lvl-ink);
  padding: .95rem 1.1rem;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s;
}
.lz-warn::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(115deg,
    color-mix(in srgb, var(--lz-lvl-ink) 12%, transparent) 0 8px, transparent 8px 16px);
  -webkit-mask-image: linear-gradient(90deg, #000, transparent 30%);
          mask-image: linear-gradient(90deg, #000, transparent 30%);
  opacity: .5;
}
.lz-warn:hover { transform: translateY(-2px); box-shadow: 0 18px 34px -24px rgba(16,24,40,.55); }
.lz-warn__lvl {
  position: relative; z-index: 1;
  font-family: var(--lz-mono); font-size: .62rem; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; text-align: center;
  color: #fff; background: var(--lz-lvl-ink);
  padding: .3rem .55rem; border-radius: 2px; white-space: nowrap;
}
.lz-warn__body { position: relative; z-index: 1; min-width: 0; }
.lz-warn__body h3 { margin: 0 0 .25rem; font-size: 1.02rem; line-height: 1.35; }
.lz-warn__meta { display: flex; flex-wrap: wrap; gap: .3rem .9rem; margin: 0;
  font-family: var(--lz-mono); font-size: .68rem; letter-spacing: .08em;
  text-transform: uppercase; color: var(--lz-slate-2); }
.lz-warn .lz-more { position: relative; z-index: 1; white-space: nowrap; }
@media (max-width: 620px) {
  .lz-warn { grid-template-columns: 1fr; gap: .55rem; }
  .lz-warn__lvl { justify-self: start; }
}

/* Entwarnung – bewusst ruhig, kein grelles Grün. */
.lz-warn-clear {
  display: flex; align-items: center; gap: .9rem;
  background: var(--lz-paper); border: 1px solid var(--lz-hair);
  padding: 1.1rem 1.2rem;
}
.lz-warn-clear .lz-dot { background: var(--lz-grey-ci); animation: none; }
.lz-warn-clear b { display: block; font-size: 1.02rem; }
.lz-warn-clear span { display: block; font-family: var(--lz-mono); font-size: .68rem;
  letter-spacing: .1em; text-transform: uppercase; color: var(--lz-slate-2); margin-top: .15rem; }
.lz-warn-note { margin: 1rem 0 0; font-size: .78rem; line-height: 1.55; color: var(--lz-slate-2); max-width: 90ch; }

/* Sprunglink im Bühnen-Panel: Pfeil zeigt nach unten und tippt leicht an. */
.lz-more--down i { animation: lzNudge calc(2.6s / max(var(--lz-motion), .35)) ease-in-out infinite; }
.lz-more--down:hover i { transform: translateY(4px); animation: none; }
@keyframes lzNudge { 0%, 100% { transform: translateY(0); } 55% { transform: translateY(3px); } }

/* Bühnen-Panel ohne Einzelmeldungen: Kennzahlen bekommen mehr Luft. */
.lz-stage__panel .lz-kpis:last-of-type { margin-bottom: 1.2rem; }

/* ===========================================================================
   15 · Kachel-Stile
   Sechs Anordnungen für dieselben Inhalte, im Customizer umschaltbar.
   Alle bleiben strikt im CI: Schwarz, Weiß, Leuchtrot, Hellgrau.
   =========================================================================== */

/* ---- A · Portfolio-Karte ------------------------------------------------ */
.lz-t--portfolio {
  display: grid; grid-template-rows: auto auto 1fr; background: var(--lz-ink);
  border-radius: 14px; padding: 1rem 1rem 1.1rem; position: relative; overflow: hidden;
}
.lz-t--portfolio::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(120% 80% at 100% 0%, rgba(254,0,0,.18), transparent 60%);
}
.lz-t--portfolio:hover { box-shadow: 0 26px 48px -26px rgba(6,9,13,.8); }
.lz-t--portfolio .lz-t__head { display: flex; align-items: center; gap: .7rem; position: relative; z-index: 1; margin-bottom: .85rem; }
.lz-t--portfolio .lz-t__no {
  width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%; display: grid; place-items: center;
  background: var(--lz-red); color: #fff; font-size: .8rem; font-weight: 700;
}
.lz-t--portfolio .lz-t__title { color: #fff; font-size: 1.02rem; }
.lz-t--portfolio .lz-t__media { position: relative; z-index: 1; border-radius: 10px; background: #0b1119; aspect-ratio: 16/10; }
.lz-t--portfolio .lz-t__media img { filter: saturate(.8) contrast(1.04); }
.lz-t--portfolio:hover .lz-t__media img { transform: scale(1.05); filter: none; }
.lz-t--portfolio .lz-t__text { position: relative; z-index: 1; color: rgba(255,255,255,.72); margin-top: .85rem; padding-right: 2.4rem; }
.lz-t--portfolio .lz-t__go {
  position: absolute; right: 1rem; bottom: 1rem; z-index: 2; width: 30px; height: 30px;
  display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%;
  color: #fff; font-size: .9rem; transition: background .3s, border-color .3s, transform .3s;
}
.lz-t--portfolio:hover .lz-t__go { background: var(--lz-red); border-color: var(--lz-red); transform: translateX(3px); }
.lz-t--portfolio.lz-task--wide { grid-template-rows: auto auto; grid-template-columns: 1fr 1fr;
  grid-template-areas: "head media" "text media"; column-gap: 1.4rem; align-content: center; }
/* Im breiten Format treffen sich Kopf und Text in der Mitte, statt an den
   Rändern der vom Bild aufgespannten Zeilen zu kleben. */
.lz-t--portfolio.lz-task--wide .lz-t__head { grid-area: head; align-self: end; margin-bottom: .4rem; }
.lz-t--portfolio.lz-task--wide .lz-t__text { grid-area: text; align-self: start; margin-top: .4rem; }
.lz-t--portfolio.lz-task--wide .lz-t__media { grid-area: media; aspect-ratio: 16/9; }
@media (max-width: 760px) {
  .lz-t--portfolio.lz-task--wide { grid-template-columns: 1fr; grid-template-areas: "head" "media" "text"; }
}

/* ---- B · Einsatzkarte (Beleg) ------------------------------------------ */
.lz-t--beleg {
  display: grid; grid-template-rows: auto auto 1fr auto; background: var(--lz-paper);
  border: 1px solid var(--lz-hair); overflow: hidden;
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.lz-t--beleg:hover { border-color: rgba(254,0,0,.4); box-shadow: 0 22px 40px -26px rgba(16,24,40,.6); }
.lz-t--beleg .lz-t__bar {
  display: flex; align-items: center; gap: .55rem; padding: .55rem .9rem;
  background: var(--lz-ink); color: #fff; font-size: .66rem; letter-spacing: .16em;
  text-transform: uppercase; font-weight: 600;
}
.lz-t--beleg .lz-t__code { color: var(--lz-red-lite); }
.lz-t--beleg .lz-t__pt { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.4); }
.lz-t--beleg .lz-t__st { color: rgba(255,255,255,.55); }
.lz-t--beleg .lz-t__media { aspect-ratio: 16/9; }
.lz-t--beleg .lz-t__media::after {
  content: ""; position: absolute; inset: 0; opacity: .5; transition: opacity .4s;
  background: repeating-linear-gradient(115deg, rgba(11,15,20,.14) 0 1px, transparent 1px 6px);
  mix-blend-mode: multiply;
}
.lz-t--beleg:hover .lz-t__media::after { opacity: 0; }
.lz-t--beleg .lz-t__body { padding: .9rem 1rem .3rem; }
.lz-t--beleg .lz-t__title { font-size: 1.02rem; color: var(--lz-text); margin-bottom: .3rem; }
.lz-t--beleg .lz-t__text { color: var(--lz-slate); }
.lz-t--beleg .lz-t__foot {
  display: flex; align-items: center; justify-content: space-between; margin-top: .8rem;
  padding: .7rem 1rem .85rem; font-size: .82rem; font-weight: 700; color: var(--lz-red-ink);
  border-top: 1px solid var(--lz-hair);
}
.lz-t--beleg .lz-t__foot i { font-style: normal; transition: transform .3s; }
.lz-t--beleg:hover .lz-t__foot i { transform: translateX(5px); }

/* ---- C · Split-Diagonale ------------------------------------------------ */
.lz-t--split { position: relative; display: block; background: var(--lz-ink); aspect-ratio: 16/11; }
.lz-t--split:hover { box-shadow: 0 24px 44px -26px rgba(6,9,13,.85); }
.lz-t--split .lz-t__media { position: absolute; inset: 0; }
.lz-t--split .lz-t__media img { filter: saturate(.75) contrast(1.05); }
.lz-t--split:hover .lz-t__media img { transform: scale(1.06); filter: saturate(1); }
.lz-t--split .lz-t__panel {
  position: absolute; inset: 0 0 0 38%; z-index: 2;
  background: linear-gradient(90deg, rgba(6,9,13,0), rgba(6,9,13,.92) 22%, var(--lz-ink) 46%);
  clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
  padding: 1.1rem 1.1rem 1.1rem 22%;
  display: flex; flex-direction: column; justify-content: center; gap: .35rem;
}
.lz-t--split .lz-t__no { font-size: .68rem; font-weight: 700; letter-spacing: .16em; color: var(--lz-red-lite); }
.lz-t--split .lz-t__title { color: #fff; font-size: 1.02rem; }
.lz-t--split .lz-t__text { color: rgba(255,255,255,.68); font-size: .82rem; }
.lz-t--split .lz-t__go { margin-top: .3rem; color: var(--lz-red-lite); font-weight: 700; transition: transform .3s; }
.lz-t--split:hover .lz-t__go { transform: translateX(5px); }
@media (max-width: 520px) {
  .lz-t--split .lz-t__panel { inset: 0; clip-path: none; padding: 1.1rem;
    background: linear-gradient(180deg, rgba(6,9,13,.2), rgba(6,9,13,.9)); justify-content: flex-end; }
}

/* ---- D · Passepartout --------------------------------------------------- */
.lz-t--passepartout {
  display: block; background: var(--lz-paper); border: 1px solid var(--lz-hair);
  padding: 14px 14px 0; position: relative;
}
.lz-t--passepartout::after {
  content: ""; position: absolute; left: 14px; right: 14px; top: 14px; height: 2px;
  background: var(--lz-red); transform: scaleX(0); transform-origin: left;
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.lz-t--passepartout:hover { border-color: #cfd8e4; box-shadow: 0 22px 40px -26px rgba(16,24,40,.5); }
.lz-t--passepartout:hover::after { transform: scaleX(1); }
.lz-t--passepartout .lz-t__media { aspect-ratio: 16/10; background: var(--lz-paper-2); }
.lz-t--passepartout .lz-t__media img { object-fit: contain; }
.lz-t--passepartout:hover .lz-t__media img { transform: scale(1.03); }
.lz-t--passepartout .lz-t__body { padding: .95rem .2rem 1.1rem; display: grid;
  grid-template-columns: auto 1fr; gap: .2rem .7rem; }
.lz-t--passepartout .lz-t__no { grid-row: 1 / 3; font-size: .72rem; font-weight: 700;
  letter-spacing: .1em; color: var(--lz-grey-ci); padding-top: .25rem; }
.lz-t--passepartout .lz-t__title { font-size: 1.02rem; color: var(--lz-text); }
.lz-t--passepartout .lz-t__text { color: var(--lz-slate); }

/* ---- E · Schublade ------------------------------------------------------ */
.lz-t--schublade { position: relative; display: block; background: var(--lz-ink); aspect-ratio: 16/11; }
.lz-t--schublade:hover { box-shadow: 0 24px 44px -26px rgba(6,9,13,.85); }
.lz-t--schublade .lz-t__media { position: absolute; inset: 0; }
.lz-t--schublade .lz-t__media img { filter: saturate(.7) contrast(1.05); }
.lz-t--schublade:hover .lz-t__media img { transform: scale(1.05); filter: saturate(1); }
.lz-t--schublade .lz-t__veil { position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgba(6,9,13,.28), rgba(6,9,13,.05) 40%, rgba(6,9,13,.72)); }
.lz-t--schublade .lz-t__no { position: absolute; top: .7rem; left: .9rem; z-index: 3;
  font-size: .66rem; font-weight: 700; letter-spacing: .14em; color: rgba(255,255,255,.75); }
.lz-t--schublade .lz-t__bar2 {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  display: flex; align-items: center; justify-content: space-between; gap: .7rem;
  padding: .75rem .95rem; background: var(--lz-red); color: #fff;
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.lz-t--schublade .lz-t__bar2 i { font-style: normal; transition: transform .3s; }
.lz-t--schublade .lz-t__draw {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  background: var(--lz-ink); color: rgba(255,255,255,.78); padding: .9rem .95rem 1rem;
  border-top: 2px solid var(--lz-red);
  transform: translateY(101%); transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.lz-t--schublade:hover .lz-t__bar2 { transform: translateY(-100%); }
.lz-t--schublade:hover .lz-t__draw { transform: translateY(0); }
.lz-t--schublade:hover .lz-t__bar2 i { transform: translateX(4px); }
.lz-t--schublade .lz-t__title { color: #fff; font-size: .98rem; }
/* Ohne Zeigegerät (Touch) bleibt die Schublade offen – sonst wäre der Text nie lesbar. */
@media (hover: none) {
  .lz-t--schublade .lz-t__bar2 { position: static; }
  .lz-t--schublade .lz-t__draw { position: static; transform: none; }
  .lz-t--schublade { aspect-ratio: auto; }
  .lz-t--schublade .lz-t__media { position: relative; aspect-ratio: 16/9; }
  .lz-t--schublade .lz-t__veil { display: none; }
}

/* ===========================================================================
   16 · Hero-Offset – die folgende Fläche schiebt sich in die Bühne
   =========================================================================== */
.lz-has-offset .lz-stage { padding-bottom: calc(var(--lz-offset, 0px) + 2.5rem); }
/* Die erste Sektion nach der Bühne schiebt sich mit runder Oberkante darüber.
   Kein zusätzlicher Wrapper nötig – der Anker hinter der Bühne dient als
   sicherer Bezugspunkt. */
.lz-has-offset #lz-after-stage + .lz-section {
  position: relative; z-index: 3; margin-top: calc(var(--lz-offset, 0px) * -1);
  border-radius: var(--lz-offset-r, 26px) var(--lz-offset-r, 26px) 0 0;
  box-shadow: 0 -22px 50px -30px rgba(6,9,13,.65);
  padding-top: calc(var(--lz-sec) + .6rem);
}
/* Kleiner Griff als Hinweis auf die Kante. */
.lz-has-offset #lz-after-stage + .lz-section::after {
  content: ""; position: absolute; left: 50%; top: 12px; transform: translateX(-50%);
  width: 46px; height: 3px; border-radius: 3px; background: var(--lz-grey-ci); opacity: .75;
}
.lz-has-offset .lz-scrollcue { bottom: calc(var(--lz-offset, 0px) + 1rem); }
@media (max-width: 760px) {
  .lz-has-offset .lz-stage { padding-bottom: calc(var(--lz-offset, 0px) * .5 + 2rem); }
  .lz-has-offset #lz-after-stage + .lz-section { margin-top: calc(var(--lz-offset, 0px) * -.5); }
}


/* ===========================================================================
   17 · Warnlage-Zeile in der Bühne – vollständig im Customizer einstellbar
   =========================================================================== */
.lz-warnpill {
  font-size: var(--lz-wp-size, .72rem);
  color: var(--lz-wp-color, rgba(255,255,255,.78));
  background: var(--lz-wp-bg, rgba(255,255,255,.04));
  border: 1px solid var(--lz-wp-border, var(--lz-hair-ink));
  border-radius: var(--lz-wp-radius, 999px);
  text-transform: var(--lz-wp-caps, uppercase);
  letter-spacing: var(--lz-wp-track, .12em);
  backdrop-filter: var(--lz-wp-blur, none);
  -webkit-backdrop-filter: var(--lz-wp-blur, none);
}
.lz-warnpill > span:last-child { max-width: var(--lz-wp-maxw, 44ch); }
.lz-warnpill b { color: var(--lz-wp-accent, var(--lz-lvl)); }
.lz-warnpill .lz-sep { background: currentColor; opacity: .28; }
/* Stil „voll“: deckende Fläche, dadurch auf hellen Fotos am sichersten. */
.lz-wp--voll { --lz-wp-blur: none; }
/* Stil „umriss“: nur Linie. */
.lz-wp--umriss { --lz-wp-blur: none; }
/* Stil „schlicht“: ohne Fläche und Rahmen. */
.lz-wp--schlicht { background: transparent; border-color: transparent; padding-inline: 0; }

/* Diagnosezeile der Warnlage – nur angemeldeter Redaktion sichtbar. */
.lz-warn-diag {
  margin: .9rem 0 0; padding: .6rem .8rem;
  border: 1px dashed var(--lz-grey-ci); border-left: 3px solid var(--lz-red);
  background: var(--lz-paper); font-size: .78rem; line-height: 1.5; color: var(--lz-slate);
}
.lz-warn-diag b { color: var(--lz-text); }

/* Warnlage-Zeile im Ruhezustand: gleiche Reihe unter dem Menü, aber ruhig.
   Größe, Versalien und Farbe folgen denselben Customizer-Werten wie die
   Zeile in der Bühne, damit beide zusammenpassen. */

.lz-warnbar--klar { background: var(--lz-ink-2); }
.lz-warnbar--klar::before { display: none; }
.lz-warnbar--klar::after { background: linear-gradient(90deg, var(--lz-grey-ci), transparent 45%); opacity: .35; }
.lz-warnbar--klar .lz-warnbar__txt { font-weight: 600; color: rgba(255,255,255,.9); }
.lz-warnbar--klar .lz-dot { animation: none; }
.lz-warnbar--klar .lz-warnbar__more { margin-left: auto; color: rgba(255,255,255,.7); font-weight: 600; }
.lz-warnbar--klar .lz-warnbar__more:hover { color: #fff; }

/* ===========================================================================
   18 · Warnlage – Gestaltung aus dem Customizer
   Nur Aussehen: Farben, Innenabstände, Schraffur, Form der Stufenkennzeichnung.
   Aufbau und Verhalten der Zeile bleiben unverändert.
   =========================================================================== */

/* Eine feste Akzentfarbe statt der Abstufung nach Warnstufe. Steht bewusst
   NACH den .lz-lvl--* Regeln, damit sie diese überschreibt. */
.lz-warn-fix { --lz-lvl: var(--lz-warn-fix, var(--lz-red)); --lz-lvl-ink: var(--lz-warn-fix, var(--lz-red-ink)); }

/* Warnschraffur abschaltbar. */
.lz-warn-nostripes.lz-warnbar::before,
.lz-warn-nostripes .lz-warn::before { display: none; }

/* --- Zeile oben --------------------------------------------------------- */
.lz-warnbar { background: var(--lz-wb-bg, var(--lz-ink-2)); }
.lz-warnbar-inner { color: var(--lz-wb-text, #fff); padding-block: var(--lz-wb-pad, 10px);
  font-size: var(--lz-wb-size, .92rem); }
.lz-warnbar__txt { text-transform: var(--lz-wb-caps, none); }
.lz-warnbar__txt, .lz-warnbar--klar .lz-warnbar__txt { color: var(--lz-wb-text, #fff); }
.lz-warnbar__more { color: var(--lz-wb-text, #fff); }
.lz-warnbar__ico { color: var(--lz-warn-ico, var(--lz-lvl)); }
.lz-warnbar .lz-dot { background: var(--lz-warn-ico, var(--lz-lvl)); }

/* --- Abschnitt ---------------------------------------------------------- */
.lz-warnsec .lz-warn {
  background: var(--lz-ws-card, var(--lz-paper));
  padding: var(--lz-ws-pad, 16px);
  /* Nur die drei neutralen Kanten einfärben – die linke bleibt die farbige
     Kennzeichnung der Warnstufe. */
  border-top-color: var(--lz-ws-border, var(--lz-hair));
  border-right-color: var(--lz-ws-border, var(--lz-hair));
  border-bottom-color: var(--lz-ws-border, var(--lz-hair));
}
.lz-warnsec .lz-warn-clear { background: var(--lz-ws-card, var(--lz-paper));
  border-color: var(--lz-ws-border, var(--lz-hair)); padding: var(--lz-ws-pad, 16px); }
.lz-warnsec .lz-warn__body h3 { color: var(--lz-ws-text, var(--lz-text)); }
.lz-warnsec .lz-warn__meta { color: var(--lz-ws-meta, var(--lz-slate-2)); }
.lz-warnsec .lz-warn-clear b { color: var(--lz-ws-text, var(--lz-text)); }
.lz-warnsec .lz-warn-clear span { color: var(--lz-ws-meta, var(--lz-slate-2)); }
.lz-warnsec .lz-warn .lz-more { color: var(--lz-ws-link, var(--lz-red-ink)); }
.lz-warnsec .lz-warn-clear .lz-dot { background: var(--lz-warn-ico, var(--lz-grey-ci)); }
/* Stufenkennzeichnung wahlweise als Umriss statt gefüllter Fläche. */
.lz-warn-chipline .lz-warn__lvl {
  background: transparent !important; background-image: none !important;
  color: var(--lz-lvl-ink); box-shadow: inset 0 0 0 1px currentColor;
}


/* ================== 19 - Handy-Feinschliff (<= 700 px) ====================
   Gesammelt an einer Stelle, damit die Handyansicht nachvollziehbar bleibt
   und nicht über die ganze Datei verstreut nachgebessert werden muss.
   Grundregeln: weniger Vorspann bis zum ersten Inhalt, größere Tippziele,
   volle Breite für Knöpfe, ruhigere Abstände. */

/* --- Obere Leiste: war 105 px hoch, drei Zeilen Kleinstschrift ----------- */
@media (max-width: 700px) {
  .lz-topbar { font-size: .78rem; }
  .lz-topbar-inner { padding-block: .35rem; gap: .1rem .8rem; justify-content: flex-start; }
  /* Die zweite Kontaktzeile steht wortgleich im Fuß und im Kontaktband.
     Auf dem Handy kostet sie nur Platz vor der eigentlichen Seite. */
  .lz-topbar-side { display: none; }
}
@media (max-width: 460px) {
  /* Die Krisenstab-Adresse ist auf dem Handy einen Fingertipp entfernt
     (Fußbereich); oben bleibt die Rufnummer, die im Ernstfall zählt. */
  .lz-topbar-mail { display: none; }
}

/* --- Kopfzeile: der Name war unter 420 px komplett verschwunden ---------- */
@media (max-width: 620px) {
  .lz-header-inner { gap: .55rem; padding-inline: 1rem; }
  .lz-brand { gap: .5rem; }
  .lz-brand img { height: 38px; }
  .lz-brand-name { font-size: .82rem; white-space: normal; line-height: 1.15; }
  .lz-burger { padding: .5rem .6rem; }
  .lz-burger-txt { display: none; }
  .lz-cta { padding-inline: .8rem; }
}
@media (max-width: 360px) { .lz-brand-txt { display: none; } }

/* --- Warnzeile: enger setzen, Tippziel bleibt groß ---------------------- */
@media (max-width: 620px) {
  .lz-warnbar-inner { padding-block: .5rem; gap: .35rem .6rem; font-size: .86rem; }
  .lz-warnbar__more, .lz-warnbar__rest { font-size: .8rem; min-height: 32px; align-items: center; }
}

/* --- Bühne: Knöpfe auf volle Breite, gleich breit ---------------------- */
@media (max-width: 560px) {
  .lz-stage-inner { padding-block: 2.6rem 2.2rem; }
  .lz-stage__cta { display: grid; grid-template-columns: 1fr; gap: .6rem; }
  .lz-stage__cta .lz-btn { width: 100%; justify-content: center; min-height: 52px; }
  .lz-stage__lead { margin-bottom: 1.4rem; }
}

/* --- Abstände: 72 px oben UND unten sind auf 390 px zu viel ------------- */
@media (max-width: 640px) {
  .lz-section { padding-block: max(44px, calc(var(--lz-sec) * .62)); }
  .lz-content { padding-block: max(36px, calc(var(--lz-sec) * .52)); }
}

/* --- Tippziele: alles Anklickbare mindestens 44 px hoch ------------------ */
@media (hover: none) and (max-width: 700px) {
  .lz-btn, .lz-cta, .lz-burger { min-height: 48px; }
  .lz-more, .lz-warn .lz-more, .lz-post a { min-height: 44px; display: inline-flex; align-items: center; }
}