/* Coaching-Planet · Design «Zukunft», Steigerung «Dynamik» (oeffentliche Seiten)
   Laedt NACH zukunft.css. Nur Darstellung, nur Tokens aus zukunft.css (--zk-*), keine
   externen Quellen. Dazu gehoert assets/js/zukunft-dynamik.js.
   Bausteine: Andock-Ecken und Kantenlicht der Karten, Tiefe der Coach-Karten, Flugbahn
   zwischen den Coach-Portraits mit Parallaxe, Sternkarte der Themen, Flugleiste am Rand,
   Kurs-Zeile der Filter, Startimpuls, Startrampe mit Countdown, Radar der Kennzahlen.
   Bewegung: nur mit html:not(.zk-still) (kein «Bewegung reduzieren», keine Pause, keine
   Lesetexte) und nur transform/opacity; ausserhalb des Sichtfelds pausiert .zk-aus. */

@property --zk-spot { syntax: '<color>'; inherits: false; initial-value: rgba(105, 225, 245, 0); }

.alp {
  --zk-cyan-50: rgba(105, 225, 245, .5);
  --zk-cyan-90: rgba(105, 225, 245, .9);
  --zk-mint-90: rgba(154, 245, 212, .9);
  --zk-violet-75: rgba(164, 146, 255, .75);
}

/* ---------- Karten: Andock-Ecken, Lichtfleck, Kantenlicht ---------- */
.alp :is(.alp-card:not(.alp-legal), .alp-topic, .alp-form-card, .alp-demo-window) {
  --dock: var(--zk-cyan-50);
  position: relative;
  background-image:
    linear-gradient(var(--dock), var(--dock)), linear-gradient(var(--dock), var(--dock)),
    linear-gradient(var(--dock), var(--dock)), linear-gradient(var(--dock), var(--dock)),
    radial-gradient(260px circle at var(--sx, 50%) var(--sy, 0%), var(--zk-spot), transparent 72%),
    var(--zk-glass);
  background-repeat: no-repeat;
  background-size: 16px 1.5px, 1.5px 16px, 16px 1.5px, 1.5px 16px, auto, auto;
  background-position: left 10px top 10px, left 10px top 10px, right 10px bottom 10px, right 10px bottom 10px, 0 0, 0 0;
  transition: opacity .6s ease, transform var(--alp-transition), box-shadow var(--alp-transition), border-color var(--alp-transition), rotate .22s ease-out, --zk-spot .4s;
}
.alp :is(.alp-card:not(.alp-legal), .alp-topic).alp-reveal { transition: opacity .6s ease, transform .6s ease, box-shadow var(--alp-transition), border-color var(--alp-transition), rotate .22s ease-out, --zk-spot .4s; }
.alp :is(.alp-card:not(.alp-legal), .alp-topic, .alp-form-card, .alp-demo-window):is(:hover, :focus-within) {
  --dock: var(--zk-mint-90); --zk-spot: rgba(105, 225, 245, .11);
}
.alp .alp-form-card:hover, .alp .alp-demo-window:hover { --zk-spot: rgba(105, 225, 245, .07); }
.alp :is(.alp-card:not(.alp-legal), .alp-topic, .alp-form-card, .alp-demo-window)::after {
  content: ''; position: absolute; inset: 0; z-index: 3; border-radius: inherit; padding: 1px; pointer-events: none;
  opacity: 0; transition: opacity .35s;
  background: conic-gradient(from var(--edge, 200deg), transparent 0 55%, var(--zk-cyan-90) 78%, var(--zk-violet-75) 88%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.alp :is(.alp-card:not(.alp-legal), .alp-topic, .alp-form-card, .alp-demo-window):is(:hover, :focus-within)::after { opacity: 1; }
/* Themen-Karten tragen ihre Themenfarbe bis in das Kantenlicht */
.alp .alp-topic::after { background: conic-gradient(from var(--edge, 200deg), transparent 0 55%, color-mix(in srgb, var(--topic-c, #2b8fb0) 55%, #fff) 78%, var(--zk-violet-75) 88%, transparent 100%); }
/* Lesetexte und Ratgeber bleiben ruhig */
.alp.zk-ruhig :is(.alp-card, .alp-form-card)::after { display: none; }
.alp.zk-ruhig :is(.alp-card, .alp-form-card) { background-image: var(--zk-glass); }

/* Tiefe: Coach-Karten und Themen-Karten neigen sich leicht zum Zeiger */
.alp-coach-grid, .zk-themen .alp-grid { perspective: 1200px; }
.alp :is(.coach-card, .zk-themen .alp-topic) { rotate: var(--tilt, none); }
.alp .coach-card .coach-card-photo-wrap { transition: translate .22s ease-out; }
.alp .coach-card .coach-card-photo-wrap { translate: var(--fx, 0) var(--fy, 0); }

/* ---------- Kennzahlen im Seitenkopf (Missionsdaten) ---------- */
.zk-daten { display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 2.2em 0 0; padding: 0; max-width: 520px; }
.zk-daten li { display: flex; flex-direction: column; gap: 4px; padding: 2px 26px 2px 0; margin-right: 26px; border-right: 1px solid var(--zk-hair); }
.zk-daten li:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.zk-daten-wert { font: 700 2.3rem/1 var(--alp-font-head); color: var(--zk-cyan); font-variant-numeric: tabular-nums; }
.zk-daten li:nth-child(2) .zk-daten-wert { color: var(--zk-violet); }
.zk-daten li:nth-child(3) .zk-daten-wert { color: var(--zk-mint); }
.zk-daten-label { font: 500 11px/1.3 var(--zk-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--alp-muted); }

/* ---------- Seitenkopf: Flugbahn zwischen den Coaches, Andock-Ringe, Parallaxe ---------- */
.zk-route { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; pointer-events: none; opacity: 0; transition: opacity .8s .3s; }
.zk-route.is-bereit { opacity: 1; }
.zk-route-linie { fill: none; stroke: rgba(105, 225, 245, .42); stroke-width: 1.3; stroke-dasharray: 2 8; stroke-linecap: round; }
.zk-route-licht { fill: none; stroke: var(--zk-mint); stroke-width: 2.2; stroke-linecap: round; filter: drop-shadow(0 0 6px var(--zk-cyan)); }
.zk-route-punkt { fill: #fff; filter: drop-shadow(0 0 8px var(--zk-cyan)) drop-shadow(0 0 16px var(--zk-violet)); }
.alp-hero-visual .alp-hero-portrait::before {
  content: ''; position: absolute; inset: -10px; border-radius: inherit; pointer-events: none;
  border: 1.5px dashed rgba(105, 225, 245, .28); transition: border-color .4s, box-shadow .4s, inset .4s;
}
.alp-hero-visual .alp-hero-portrait--2::before { border-radius: 36px; }
.alp-hero-visual .alp-hero-portrait.is-signal::before { border-color: var(--zk-mint); inset: -13px; box-shadow: 0 0 22px rgba(154, 245, 212, .35); }
/* Parallaxe: Portraits und Bahn wandern gemeinsam, Rakete und Ringe gegenlaeufig */
.alp-hero-visual { --px: 0; --py: 0; }
.alp-hero-visual :is(.alp-hero-portrait, .zk-route) { translate: calc(var(--px) * 14px) calc(var(--py) * 10px); }
.alp-hero-visual .zk-scene { translate: calc(var(--px) * -16px) calc(var(--py) * -12px); }
.alp-hero-visual .zk-rocket { rotate: 0 0 1 calc(var(--px) * 3deg); }

/* ---------- Sternkarte der Themen ---------- */
.zk-karte { display: none; }
@media (min-width: 900px) {
  .zk-karte { display: block; position: relative; height: 380px; margin: 24px 0 0; perspective: 1500px; perspective-origin: 50% 20%; }
}
.zk-buehne { position: absolute; left: 50%; top: 46%; width: 0; height: 0; transform-style: preserve-3d; transform: rotateX(66deg); }
.zk-bahn {
  --w0: 20deg;
  position: absolute; left: 0; top: 0; width: var(--d); height: var(--d); margin: calc(var(--d) / -2) 0 0 calc(var(--d) / -2);
  border: 1px solid var(--bahnfarbe); border-radius: 50%; transform-style: preserve-3d;
}
.zk-bahn-1 { --d: 290px; --t: 70s; --w0: 25deg; --bahnfarbe: rgba(154, 245, 212, .32); }
.zk-bahn-2 { --d: 500px; --t: 110s; --w0: 105deg; --bahnfarbe: rgba(105, 225, 245, .28); }
.zk-bahn-3 { --d: 730px; --t: 160s; --w0: 65deg; --bahnfarbe: rgba(164, 146, 255, .3); }
.zk-bahn-2, .zk-bahn-3 { border-style: dashed; }
.zk-bahn-ring { position: absolute; inset: 0; transform-style: preserve-3d; }
.zk-ort { position: absolute; inset: 0; transform-style: preserve-3d; rotate: var(--w); --w: var(--w0); }
.zk-ort-2 { --w: calc(var(--w0) + 180deg); }
.zk-ort-3 { --w: calc(var(--w0) + 90deg); }
.zk-planet { position: absolute; left: 50%; top: 0; width: 0; height: 0; transform-style: preserve-3d; rotate: calc(var(--w) * -1); transform: rotateZ(0deg) rotateX(-66deg); display: block; text-decoration: none; pointer-events: none; }
.zk-planet-kugel {
  position: absolute; left: -25px; top: -25px; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; pointer-events: auto; cursor: pointer;
  color: color-mix(in srgb, var(--topic-c, #2b8fb0) 38%, #fff);
  background: radial-gradient(circle at 34% 28%, color-mix(in srgb, var(--topic-c, #2b8fb0) 55%, #fff) 0, var(--topic-c, #2b8fb0) 46%, #0b1120 118%);
  border: 1px solid color-mix(in srgb, var(--topic-c, #2b8fb0) 50%, #fff);
  box-shadow: inset -6px -8px 14px rgba(4, 7, 14, .55);
  transition: transform .3s;
}
.zk-planet-kugel .alp-icon { width: 22px; height: 22px; color: #fff; }
.zk-planet-name {
  position: absolute; left: 34px; top: -14px; padding: 6px 12px; border-radius: 999px; white-space: nowrap; pointer-events: none;
  font: 600 12px/1.2 var(--zk-mono); letter-spacing: .04em; color: var(--alp-heading);
  background: rgba(7, 10, 19, .92); border: 1px solid var(--zk-hair-strong); opacity: 0; translate: -6px 0; transition: opacity .25s, translate .25s;
}
.zk-planet:hover .zk-planet-kugel { transform: scale(1.18); }
.zk-planet:hover .zk-planet-name { opacity: 1; translate: 0 0; }
.zk-sonne { position: absolute; left: -36px; top: -36px; width: 72px; height: 72px; border-radius: 50%; transform: rotateX(-66deg); pointer-events: none; }
.zk-sonne::before { content: ''; position: absolute; inset: -34px; border-radius: 50%; background: radial-gradient(circle, rgba(105, 225, 245, .34), rgba(101, 80, 219, .2) 46%, transparent 70%); }
.zk-sonne img { position: relative; display: block; width: 72px; height: 72px; padding: 6px; border-radius: 50%; background: #0b1120; border: 1px solid var(--zk-cyan); box-shadow: 0 0 30px rgba(105, 225, 245, .5); }
.zk-karte-code { position: absolute; left: 0; bottom: 14px; font: 500 11px/1.4 var(--zk-mono); letter-spacing: .14em; color: var(--alp-muted); }
.zk-karte-code::after { content: ' · ZEIGER AUF EINEN PLANETEN'; color: var(--alp-muted); }

/* Monde: ein Punkt je Coach im Thema (hoechstens fuenf) auf einer Bahn um das Symbol */
.alp-topic-icon { position: relative; }
.zk-monde { position: absolute; inset: -10px; border-radius: 50%; pointer-events: none; border: 1px dashed color-mix(in srgb, var(--topic-c, #2b8fb0) 55%, transparent); }
.zk-mond { position: absolute; inset: 0; }
.zk-mond::before { content: ''; position: absolute; left: 50%; top: -3.5px; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; background: color-mix(in srgb, var(--topic-c, #2b8fb0) 30%, #fff); box-shadow: 0 0 8px color-mix(in srgb, var(--topic-c, #2b8fb0) 70%, transparent); }
.zk-mond-1-1 { rotate: 35deg; }
.zk-mond-2-1 { rotate: 35deg; } .zk-mond-2-2 { rotate: 215deg; }
.zk-mond-3-1 { rotate: 35deg; } .zk-mond-3-2 { rotate: 155deg; } .zk-mond-3-3 { rotate: 275deg; }
.zk-mond-4-1 { rotate: 35deg; } .zk-mond-4-2 { rotate: 125deg; } .zk-mond-4-3 { rotate: 215deg; } .zk-mond-4-4 { rotate: 305deg; }
.zk-mond-5-1 { rotate: 35deg; } .zk-mond-5-2 { rotate: 107deg; } .zk-mond-5-3 { rotate: 179deg; } .zk-mond-5-4 { rotate: 251deg; } .zk-mond-5-5 { rotate: 323deg; }

/* ---------- Kompass: Kurs setzen, die Schritte zuenden nacheinander ---------- */
@media (max-width: 779.98px) {
  .zk-flug .alp-step::before { transform-origin: top; }
}
@media (min-width: 780px) {
  .zk-flug .alp-step::before { transform-origin: left; }
}
.zk-flug .alp-step:nth-child(1) { --d: 0s; }
.zk-flug .alp-step:nth-child(2) { --d: .8s; }
.zk-flug .alp-step:nth-child(3) { --d: 1.6s; }
.zk-flug .alp-step:nth-child(4) { --d: 2.4s; }
.zk-flug.is-flown .alp-step:nth-child(n) { --d: 0s; }

/* ---------- Flugleiste am Rand (ab 1240 px), nur dekorativ ---------- */
.zk-rail { display: none; position: fixed; z-index: 40; right: 6px; top: 50%; translate: 0 -50%; flex-direction: column; list-style: none; margin: 0; padding: 12px 0; opacity: 0; transition: opacity .5s; pointer-events: none; }
@media (min-width: 1240px) { .zk-rail { display: flex; } }
.zk-rail.is-on { opacity: 1; }
.zk-rail li { position: relative; display: flex; align-items: center; justify-content: flex-end; height: 26px; padding-right: 17px; font: 500 10px/1 var(--zk-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--alp-muted); }
.zk-rail li span { opacity: 0; translate: 6px 0; transition: opacity .3s, translate .3s, color .3s; }
.zk-rail li.is-now span { opacity: 1; translate: 0 0; color: var(--zk-cyan); }
.zk-rail li::before { content: ''; position: absolute; right: 3px; top: 0; bottom: 0; width: 1px; background: var(--zk-hair-strong); }
.zk-rail li:first-child::before { top: 50%; }
.zk-rail li:last-child::before { bottom: 50%; }
.zk-rail li::after { content: ''; position: absolute; right: 0; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border: 1px solid var(--alp-muted); border-radius: 50%; background: var(--zk-bg); transition: background .3s, border-color .3s, box-shadow .3s; }
.zk-rail li.is-past::before { background: linear-gradient(var(--zk-violet), var(--zk-cyan)); }
.zk-rail li.is-past::after { border-color: var(--zk-violet); background: var(--zk-violet); }
.zk-rail li.is-now::after { border-color: var(--zk-cyan); background: var(--zk-cyan); box-shadow: 0 0 14px var(--zk-cyan); }
.zk-rail li:last-child.is-now span { color: var(--zk-mint); }
.zk-rail li:last-child.is-now::after { border-color: var(--zk-mint); background: var(--zk-mint); box-shadow: 0 0 14px var(--zk-mint); }

/* ---------- Startimpuls beim Klick auf die grossen Knoepfe ---------- */
.zk-launch { position: fixed; inset: 0; z-index: 70; overflow: hidden; pointer-events: none; visibility: hidden; }
.zk-launching .zk-launch { visibility: visible; }
.zk-launch-ring { position: absolute; left: var(--lx, 50%); top: var(--ly, 50%); width: 44px; height: 44px; margin: -22px 0 0 -22px; border: 2px solid var(--zk-cyan); border-radius: 50%; opacity: 0; }
.zk-launch-strahl { position: absolute; left: var(--lx, 50%); top: var(--ly, 50%); width: 3px; height: 46vh; margin-left: -1.5px; border-radius: 3px; opacity: 0; transform: translateY(-100%);
  background: linear-gradient(to top, transparent, var(--zk-cyan) 55%, #fff); box-shadow: 0 0 28px var(--zk-cyan), 0 0 60px var(--zk-violet); }
.zk-launching .zk-launch-ring { animation: zk-ring .9s cubic-bezier(.2, .7, .2, 1) both; }
.zk-launching .zk-launch-strahl { animation: zk-strahl 1.05s cubic-bezier(.5, 0, .9, .5) both; }
@keyframes zk-ring { from { transform: scale(.3); opacity: .95; } to { transform: scale(11); opacity: 0; } }
@keyframes zk-strahl { 0% { opacity: 0; transform: translateY(-100%); } 12% { opacity: 1; } 100% { opacity: 0; transform: translateY(calc(-100% - 115vh)); } }

/* ---------- Filterleiste: Chips rasten ein, Kurs-Zeile zeigt die gewaehlten Filter ---------- */
.alp-themenfilter .alp-chip { transition: background .25s, border-color .25s, color .25s, transform .25s, box-shadow .25s; }
.alp a.alp-chip:hover { transform: translateY(-2px); }
.alp-chip--aktiv { box-shadow: 0 0 0 1px rgba(154, 245, 212, .5), 0 6px 22px rgba(101, 80, 219, .4); }
.zk-kurs { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 16px; padding: 12px 14px; border: 1px dashed var(--zk-hair-strong); border-radius: 12px; background: rgba(4, 7, 14, .35); }
.zk-kurs[hidden] { display: none; }
.zk-kurs-label { font: 500 11px/1 var(--zk-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--zk-mint); }
.zk-kurs-label::before { content: '// '; color: var(--zk-violet); }
.zk-kurs-liste { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.zk-kurs-liste li { min-width: 0; max-width: 100%; }
.zk-kurs-chip {
  display: inline-flex; align-items: center; gap: 8px; max-width: 100%; min-height: 34px; padding: 5px 12px; border-radius: 999px;
  font: 600 .86rem/1.2 var(--alp-font-body); color: var(--alp-heading); background: rgba(105, 225, 245, .1); border: 1px solid rgba(105, 225, 245, .55);
}
.zk-kurs-chip span { min-width: 0; overflow-wrap: anywhere; }
.zk-kurs-chip b { flex: none; font: 500 10.5px/1 var(--zk-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--alp-muted); }

/* ---------- Radar hinter den Kennzahlen der Coach-Suche ---------- */
.zk-radar-feld { position: relative; isolation: isolate; align-items: center; }
.zk-radar-feld > .alp-stat { position: relative; z-index: 1; }
.zk-radar { display: none; }
@media (min-width: 900px) {
  .zk-radar { display: block; position: absolute; z-index: -1; left: 50%; top: 50%; width: 250px; height: 250px; margin: -125px 0 0 -125px; pointer-events: none; }
}
.zk-radar-ring { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(105, 225, 245, .2); }
.zk-radar-ring + .zk-radar-ring { inset: 50px; border-color: rgba(154, 245, 212, .2); border-style: dashed; }
.zk-radar-strahl { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0 72%, rgba(105, 225, 245, .05) 84%, rgba(105, 225, 245, .28) 100%); }
.zk-radar::before, .zk-radar::after { content: ''; position: absolute; background: rgba(105, 225, 245, .14); }
.zk-radar::before { left: 0; right: 0; top: 50%; height: 1px; }
.zk-radar::after { top: 0; bottom: 0; left: 50%; width: 1px; }

/* ---------- Startrampe am Ende der Startseite ---------- */
.zk-rampe { position: relative; overflow: hidden; text-align: center; padding-bottom: 300px; }
.zk-rampe .alp-container { position: relative; }
.zk-rampe::before {
  content: ''; position: absolute; z-index: 0; left: 50%; bottom: -1250px; width: 1400px; height: 1400px; margin-left: -700px; border-radius: 50%; pointer-events: none;
  border-top: 1px solid rgba(154, 245, 212, .55);
  background: radial-gradient(circle at 50% 0, rgba(105, 225, 245, .2), rgba(26, 36, 72, .9) 5%, var(--zk-bg) 14%);
  box-shadow: 0 -6px 36px rgba(105, 225, 245, .2), 0 -36px 130px rgba(164, 146, 255, .26);
}
.zk-rampe .alp-lead { max-width: 520px; margin-inline: auto; }
.zk-cd { display: inline-flex; align-items: center; gap: 14px; margin: 0 0 22px; padding: 8px 18px 8px 14px; border: 1px solid var(--zk-hair-strong); border-radius: 999px; background: rgba(105, 225, 245, .08); font: 500 11px/1 var(--zk-mono); letter-spacing: .18em; color: var(--alp-muted); }
.zk-cd-n { font: 700 27px/1 var(--alp-font-head); letter-spacing: .02em; color: var(--zk-cyan); min-width: 2.3em; text-align: left; }
.cd-fire .zk-cd-n, .cd-fire .zk-cd-text { color: var(--zk-mint); }
.zk-rampe-knoepfe { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 1.6em; position: relative; z-index: 1; }
.zk-rampe-pad { position: absolute; z-index: 0; left: 50%; bottom: -178px; width: 56px; height: 108px; margin-left: -28px; pointer-events: none; }
.zk-rampe-pad .zk-rakete-mini { width: 100%; height: 100%; }
.zk-rampe-pad::after { content: ''; position: absolute; left: 50%; bottom: 8px; width: 2px; height: 250px; margin-left: -1px; border-radius: 2px; opacity: 0; transition: opacity 1.2s 2s;
  background: linear-gradient(to top, rgba(154, 245, 212, .5), rgba(105, 225, 245, .2) 45%, transparent); }
.cd-fire .zk-rampe-pad::after { opacity: .7; }
.zk-rampe-rauch { position: absolute; left: 50%; bottom: -8px; width: 150px; height: 34px; margin-left: -75px; border-radius: 50%; background: radial-gradient(ellipse, rgba(164, 146, 255, .34), transparent 70%); opacity: 0; }
.cd-wait .zk-rampe-pad .zk-exhaust-core { opacity: 0; animation: none; }
.zk-rampe-pad .zk-exhaust-core { transform-origin: 300px 350px; }

/* ---------- Bewegung ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* Kompass: Linien fahren aus, Knoten zuenden; nur wenn das Skript laeuft und die Reihe noch nicht angeflogen ist */
  html.zk-dyn:not(.zk-still) .zk-flug:not(.is-fly) .alp-step::before { transform: scaleX(0); }
  html.zk-dyn:not(.zk-still) .zk-flug:not(.is-fly) .alp-step-num { border-color: var(--zk-hair-strong); color: var(--alp-muted); box-shadow: none; }
  html.zk-dyn:not(.zk-still) .zk-flug .alp-step::before { transition: transform .8s calc(var(--d) + .35s) cubic-bezier(.4, 0, .2, 1); }
  html.zk-dyn:not(.zk-still) .zk-flug .alp-step-num { transition: border-color .4s var(--d), color .4s var(--d), box-shadow .6s var(--d), background var(--alp-transition); }
  html.zk-dyn:not(.zk-still) .zk-flug.is-fly .alp-step-num { box-shadow: 0 0 22px rgba(154, 245, 212, .35); }
  @media (max-width: 779.98px) {
    html.zk-dyn:not(.zk-still) .zk-flug:not(.is-fly) .alp-step::before { transform: scaleY(0); }
  }

  /* Sternkarte */
  html:not(.zk-still) .zk-bahn-ring { animation: zk-umlauf var(--t) linear infinite; }
  html:not(.zk-still) .zk-bahn-2 .zk-bahn-ring, html:not(.zk-still) .zk-bahn-2 .zk-planet { animation-direction: reverse; }
  html:not(.zk-still) .zk-planet { animation: zk-gegenlauf var(--t) linear infinite; }
  html:not(.zk-still) .zk-bahn-2 .zk-planet { animation-direction: reverse; }
  html:not(.zk-still) .zk-karte:hover :is(.zk-bahn-ring, .zk-planet) { animation-play-state: paused; }
  html:not(.zk-still) .zk-sonne::before { animation: zk-puls 4.5s ease-in-out infinite alternate; }

  /* Monde */
  html:not(.zk-still) .zk-monde { animation: zk-umlauf 18s linear infinite; }
  html:not(.zk-still) .alp-topic:hover .zk-monde { animation-duration: 6s; }

  /* Radar */
  html:not(.zk-still) .zk-radar-strahl { animation: zk-umlauf 9s linear infinite; }

  /* Filter: Chips fliegen gestaffelt ein und rasten ein */
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip { animation: zk-chip-ein .55s cubic-bezier(.2, .8, .2, 1) both; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(2) { animation-delay: .06s; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(3) { animation-delay: .12s; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(4) { animation-delay: .18s; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(5) { animation-delay: .24s; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(6) { animation-delay: .3s; }
  html.zk-dyn:not(.zk-still) .alp-themenfilter .alp-chip:nth-child(n+7) { animation-delay: .36s; }
  html.zk-dyn:not(.zk-still) .alp-chip--aktiv { animation-name: zk-chip-ein, zk-einrasten; animation-duration: .55s, .9s; animation-delay: .1s, .6s; }
  html.zk-dyn:not(.zk-still) .zk-kurs-chip.is-neu { animation: zk-einrasten .7s cubic-bezier(.2, .8, .2, 1) both; }

  /* Startrampe: Countdown, Beben, Abheben */
  html:not(.zk-still) .cd-run .zk-rampe-pad .zk-rakete-mini { animation: zk-beben .12s linear infinite; }
  html:not(.zk-still) .cd-run .zk-rampe-pad::after { content: ''; position: absolute; left: 50%; bottom: 8px; width: 2px; height: 250px; margin-left: -1px; border-radius: 2px; opacity: 0; transition: opacity 1.2s 2s;
  background: linear-gradient(to top, rgba(154, 245, 212, .5), rgba(105, 225, 245, .2) 45%, transparent); }
.cd-fire .zk-rampe-pad::after { opacity: .7; }
.zk-rampe-rauch { animation: zk-rauch 1.2s ease-in-out infinite alternate; }
  html:not(.zk-still) .cd-fire .zk-rampe-pad .zk-rakete-mini { animation: zk-abheben 2.8s cubic-bezier(.55, 0, .85, .35) both; }
  html:not(.zk-still) .cd-fire .zk-rampe-pad::after { content: ''; position: absolute; left: 50%; bottom: 8px; width: 2px; height: 250px; margin-left: -1px; border-radius: 2px; opacity: 0; transition: opacity 1.2s 2s;
  background: linear-gradient(to top, rgba(154, 245, 212, .5), rgba(105, 225, 245, .2) 45%, transparent); }
.cd-fire .zk-rampe-pad::after { opacity: .7; }
.zk-rampe-rauch { animation: zk-rauchwolke 2.6s ease-out both; }
  html:not(.zk-still) .cd-fire .zk-rampe-knoepfe .alp-btn-primary { animation: zk-bereit 1.6s ease-in-out 2.6s 3; }
}
@keyframes zk-umlauf { to { transform: rotate(360deg); } }
@keyframes zk-gegenlauf { from { transform: rotateZ(0deg) rotateX(-66deg); } to { transform: rotateZ(-360deg) rotateX(-66deg); } }
@keyframes zk-puls { from { opacity: .65; transform: scale(.92); } to { opacity: 1; transform: scale(1.08); } }
@keyframes zk-chip-ein { from { opacity: 0; transform: translateY(14px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes zk-einrasten { 0% { transform: scale(1.18); box-shadow: 0 0 0 0 rgba(105, 225, 245, .7); } 55% { transform: scale(.96); } 100% { transform: none; box-shadow: 0 0 0 12px rgba(105, 225, 245, 0); } }
@keyframes zk-beben { 0% { transform: translateX(-.7px); } 50% { transform: translateX(.7px); } 100% { transform: translateX(-.7px); } }
@keyframes zk-rauch { from { opacity: .25; transform: scaleX(.9); } to { opacity: .6; transform: scaleX(1.1); } }
@keyframes zk-rauchwolke { 0% { opacity: .6; transform: scale(1); } 30% { opacity: .85; } 100% { opacity: 0; transform: scale(2.6, 1.6); } }
@keyframes zk-abheben { 0% { transform: translateY(0); opacity: 1; } 40% { opacity: 1; } 100% { transform: translateY(-270px); opacity: 0; } }
@keyframes zk-bereit { 0%, 100% { box-shadow: 0 8px 28px rgba(101, 80, 219, .36); } 50% { box-shadow: 0 0 46px rgba(105, 225, 245, .55), 0 0 0 4px rgba(105, 225, 245, .2); } }

/* Ausserhalb des Sichtfelds und im versteckten Tab steht alles */
html.zk-versteckt *, html.zk-versteckt *::before, html.zk-versteckt *::after { animation-play-state: paused !important; }
.zk-aus, .zk-aus *, .zk-aus *::before, .zk-aus *::after { animation-play-state: paused !important; }

/* ---------- Schmale Bildschirme ---------- */
@media (max-width: 899.98px) {
  .zk-daten { margin-top: 1.6em; }
  .zk-rampe { padding-bottom: 280px; }
}
@media (max-width: 560px) {
  .zk-daten li { padding-right: 18px; margin-right: 18px; }
  .zk-daten-wert { font-size: 1.9rem; }
  .zk-cd { letter-spacing: .1em; gap: 10px; }
  .zk-rampe::before { width: 1000px; height: 1000px; margin-left: -500px; bottom: -850px; }
  .zk-kurs { padding: 10px; }
}

/* ---------- Druck, Kontrast, Transparenz ---------- */
@media print {
  .zk-rail, .zk-launch, .zk-karte, .zk-route, .zk-radar, .zk-monde, .zk-cd, .zk-rampe-pad, .zk-rampe::before { display: none !important; }
  .alp :is(.alp-card, .alp-topic, .alp-form-card, .alp-demo-window) { background-image: none !important; }
  .alp :is(.alp-card, .alp-topic, .alp-form-card)::after { display: none !important; }
}
@media (prefers-reduced-transparency: reduce) {
  .alp :is(.alp-card:not(.alp-legal), .alp-topic, .alp-form-card, .alp-demo-window) {
    background-image: linear-gradient(var(--dock), var(--dock)), linear-gradient(var(--dock), var(--dock)), linear-gradient(var(--dock), var(--dock)), linear-gradient(var(--dock), var(--dock));
    background-size: 16px 1.5px, 1.5px 16px, 16px 1.5px, 1.5px 16px;
    background-position: left 10px top 10px, left 10px top 10px, right 10px bottom 10px, right 10px bottom 10px;
  }
}
@media (forced-colors: active) {
  .zk-rail, .zk-launch, .zk-karte, .zk-route, .zk-radar, .zk-monde, .zk-rampe::before, .zk-rampe-pad { display: none; }
  .alp :is(.alp-card, .alp-topic, .alp-form-card, .alp-demo-window) { background-image: none; }
  .alp :is(.alp-card, .alp-topic, .alp-form-card, .alp-demo-window)::after { display: none; }
  .zk-kurs-chip { border-color: ButtonText; }
}
@media (prefers-reduced-motion: reduce) {
  .zk-launch { display: none; }
  .zk-route { transition: none; }
}