/* ===== PRAEMON 2b – gemeinsame Bausteine für Animationen und Belege (Plattform, Leitstand, Monitoring) =====
   Nur HTML, SVG und CSS, keine Bibliotheken und kein Skript.
   Grundzustand jeder Animation = ruhige Fassung (das erklärende Endbild). Bewegung kommt nur bei
   prefers-reduced-motion:no-preference dazu; bei „Bewegung reduzieren“ stoppt der Rahmen ohnehin alle Animationen. */

/* --- Bühne oben auf der Seite (ersetzt das große Bildschirmfoto) --- */
.pa-fig{margin:0;position:relative;z-index:1}
.pa-stage{container-type:inline-size;container-name:pa;background:var(--pm-nacht);border:1px solid var(--pm-nacht-line);border-radius:16px;box-shadow:0 30px 80px rgba(15,27,38,.28);color:var(--pm-auf-nacht);overflow:hidden;position:relative;font-variant-numeric:tabular-nums}
.pa-stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:32px 32px;pointer-events:none}
.pa-stage-bar{position:relative;display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--pm-nacht-line);background:var(--pm-nacht-2)}
.pa-stage-bar b{color:var(--pm-weiss);font-size:14px;font-weight:700;letter-spacing:-.005em}
.pa-stage-bar > span{font-size:12.5px;color:var(--pm-grau-hell)}
.pa-tag{margin-left:auto;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--pm-grau-hell);border:1px solid var(--pm-nacht-line);border-radius:999px;padding:2px 10px;white-space:nowrap}
.pa-stage-body{position:relative;padding:28px}
.pa-k{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--pm-gold)}

/* Schritte unter einer Animation (Hervorhebung je Seite im Takt der Animation) */
.pa-seq{position:relative;list-style:none;margin:0;padding:0 28px 26px;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:14px}
.pa-seq li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:start;padding-top:14px;border-top:2px solid var(--pm-nacht-line);font-size:13.5px;line-height:1.45;color:var(--pm-auf-nacht)}
.pa-seq li > span{width:24px;height:24px;border-radius:50%;background:rgba(253,206,4,.14);color:var(--pm-gold);font-size:11.5px;font-weight:700;display:grid;place-items:center}
.pa-seq b{display:block;color:var(--pm-weiss);font-size:14px;margin-bottom:2px}
.pa-seq p{margin:0}

/* Farben auf dunklem Grund */
.pa-ok{color:var(--pm-punkt)}.pa-warn{color:var(--pm-warn)}.pa-krit{color:#ff6b5a}.pa-gold{color:var(--pm-gold)}
.pa-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:1px 9px;font-size:11px;font-weight:700;line-height:1.6;white-space:nowrap}
.pa-chip-ok{background:rgba(47,208,127,.14);color:var(--pm-punkt)}
.pa-chip-warn{background:rgba(243,156,18,.16);color:#ffb84d}
.pa-chip-krit{background:rgba(221,75,57,.2);color:#ff8a7d}
.pa-chip-grau{background:rgba(143,163,179,.16);color:var(--pm-grau-hell)}
.pa-chip-gold{background:var(--pm-gold);color:var(--pm-nacht)}
.pa-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--pm-punkt);flex:none}

/* --- Bereich als Karte mit Symbol-Animation statt Mini-Bildschirmfoto („Eins statt vier“) --- */
.pa-sym{position:relative;height:150px;background:var(--pm-nacht);border-bottom:1px solid var(--pm-rand);overflow:hidden}
.pa-sym::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:24px 24px}
.pa-sym > svg{position:absolute;left:50%;top:50%;width:300px;height:130px;transform:translate(-50%,-50%);overflow:visible}
.pa-sym .pm-new{position:absolute;top:12px;left:12px;z-index:2}
.pa-sym-s{height:120px}
.pa-sym-s > svg{height:104px;width:240px}
.pa-area .pm-area-body h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-cardsym{display:flex;flex-direction:column;padding:0;overflow:hidden}
.pa-cardsym .pa-body{padding:22px 24px 24px}
.pa-cardsym .pm-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-cardsym p{margin:0;font-size:14.5px;color:var(--pm-schiefer)}
/* gemeinsame Strichstärken der Symbol-Animationen */
.pa-sym .s-l{fill:none;stroke:#3a5168;stroke-width:2}
.pa-sym .s-w{fill:none;stroke:#c9d4dd;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pa-sym .s-g{fill:none;stroke:var(--pm-gold);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pa-sym .f-n2{fill:#15283a}.pa-sym .f-n3{fill:#1c3348}.pa-sym .f-g{fill:var(--pm-gold)}.pa-sym .f-ok{fill:#2fd07f}.pa-sym .f-krit{fill:#dd4b39}.pa-sym .f-warn{fill:#f39c12}.pa-sym .f-b{fill:rgba(253,206,4,.16)}

/* --- Kleine Szene in einem Abschnitt (statt Bildschirmfoto) --- */
.pa-mini{container-type:inline-size;container-name:pam;background:var(--pm-nacht);border:1px solid var(--pm-nacht-line);border-radius:16px;box-shadow:var(--pm-shadow-l);color:var(--pm-auf-nacht);padding:22px 24px 24px;position:relative;overflow:hidden;font-variant-numeric:tabular-nums}
.pa-mini::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.pa-mini > *{position:relative}
.pa-mini-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.pa-mini-head b{color:var(--pm-weiss);font-size:15px}
.pa-mini-head > span:not(.pa-tag){font-size:12px;color:var(--pm-grau-hell)}
.pa-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 14px;border:1px solid var(--pm-nacht-line);border-radius:10px;background:var(--pm-nacht-2);font-size:13.5px;line-height:1.45}
.pa-row + .pa-row{margin-top:8px}
.pa-row b{color:var(--pm-weiss);font-weight:700}
.pa-row small{display:block;color:var(--pm-grau-hell);font-size:12px}
.pa-bars{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pa-bars li{display:grid;grid-template-columns:44px minmax(0,1fr) 34px;gap:8px;align-items:center;font-size:11.5px;color:var(--pm-auf-nacht)}
.pa-bars i{display:block;height:7px;border-radius:4px;background:#0f1b26;position:relative;overflow:hidden}
.pa-bars i::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:4px;background:var(--pm-gold)}
.pa-bars b{text-align:right;color:var(--pm-weiss);font-weight:600}
.pa-capm{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:14px}

/* --- Beleg: echtes Bildschirmfoto, groß, mit nummerierten Punkten; Klick vergrößert --- */
.pa-mkbox{position:relative}
.pa-mkbox .pm-mk{pointer-events:none}
.pa-zoomhint{display:inline-flex;align-items:center;gap:6px}
.pa-beleg .pm-anat-list{position:static}
.pa-beleg-wide{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.pa-beleg-wide .pm-anat-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 28px}
@container pm (max-width:1080px){.pa-beleg-wide .pm-anat-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container pm (max-width:700px){.pa-beleg-wide .pm-anat-list{grid-template-columns:minmax(0,1fr)}}
.pa-modlist{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:2px}
.pa-modlist li{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--pm-rand)}
.pa-modlist li:last-child{border-bottom:0}
.pa-modlist li > span{width:28px;height:28px;border-radius:50%;background:var(--pm-gold);color:var(--pm-nacht);font-size:12.5px;font-weight:600;display:grid;place-items:center}
.pa-modlist b{display:block;font-size:15.5px;color:var(--pm-tinte);margin-bottom:2px}
.pa-modlist p{margin:0;font-size:14.5px;color:var(--pm-schiefer);line-height:1.55}

/* --- Liste auf dunklem Grund (statt Kacheln, deren Texte sonst ungleich umbrechen) --- */
.pa-nliste{list-style:none;margin:0;padding:0;border-top:1px solid var(--pm-nacht-line)}
.pa-nliste li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:18px 0;border-bottom:1px solid var(--pm-nacht-line)}
.pa-nliste-i{width:40px;height:40px;border-radius:10px;background:rgba(253,206,4,.12);box-shadow:inset 0 0 0 1px rgba(253,206,4,.35);color:var(--pm-gold);display:grid;place-items:center}
.pa-nliste-i svg{width:20px;height:20px}
.pa-nliste .pm-label{color:var(--pm-gold);margin-bottom:2px}
.pa-nliste b{display:block;color:var(--pm-weiss);font-size:17px;margin-bottom:3px}
.pa-nliste p{margin:0;font-size:14.5px;color:var(--pm-auf-nacht)}

/* --- Karten im Raster wie die Bereiche (3 / 2 / 1 Spalten), ohne Link --- */
.pa-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.pa-card{display:flex;flex-direction:column;border:1px solid var(--pm-rand);border-radius:18px;overflow:hidden;background:var(--pm-weiss);min-width:0}
.pa-card .pa-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.pa-card h3{font-family:var(--pm-display-s);font-size:19px;margin:0;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-card p{margin:0;font-size:14.5px;color:var(--pm-schiefer)}
.pa-card .pm-ico{margin-bottom:6px}
@container pm (max-width:1080px){.pa-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container pm (max-width:560px){.pa-cards{grid-template-columns:minmax(0,1fr)}}

@container pa (max-width:860px){
  .pa-stage-body{padding:20px}
  .pa-seq{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 20px 20px}
}
@container pa (max-width:520px){
  .pa-stage-bar{padding:10px 14px}
  .pa-stage-bar > span:not(.pa-tag){display:none}
  .pa-stage-body{padding:14px}
  .pa-seq{grid-template-columns:minmax(0,1fr);gap:8px;padding:0 14px 16px}
  .pa-seq li{padding-top:10px;font-size:13px}
}
@container pm (max-width:560px){
  .pa-sym{height:132px}
  .pa-mini{padding:18px 16px 18px}
}

/* ===== Bereiche mit Symbol-Animation (Plattform, Startseite) ===== */
.pa-s-scan{stroke:var(--pm-gold);stroke-width:2;opacity:.6}
.pa-s-ring{fill:none;stroke:var(--pm-gold);stroke-width:7;stroke-dasharray:78 100;stroke-linecap:round}
.pa-s-rot{fill:#dd4b39}
.pa-s-srv rect{fill:#dd4b39}
.pa-s-red{fill:#dd4b39}
.pa-s-arc{stroke-dasharray:1}
.pa-s-wave{fill:none;stroke:#2fd07f;stroke-width:1.8;stroke-linejoin:round}
.pa-s-dev3{fill:#f39c12}
.pa-s-pk{fill:var(--pm-gold);opacity:0}
.pa-s-u{fill:#3a5168}.pa-s-u3{fill:var(--pm-gold)}
.pa-s-dl{fill:#c9d4dd}
.pa-s-typ{opacity:0}
.pa-s-line,.pa-s-chk{stroke-dasharray:1}
.pa-s-file,.pa-s-pk,.pa-s-q,.pa-s-a,[class*="pa-s-al"],[class*="pa-s-dl"],[class*="pa-s-u"]{transform-box:fill-box;transform-origin:left center}

@media (min-width:0){
  /* Bereiche: kleine Schleifen */
  .pa-s-mon .pa-s-line{animation:sLine 7s infinite}
  .pa-s-mon .pa-s-pt{animation:sPt 7s infinite;transform-box:fill-box;transform-origin:center}
  @keyframes sLine{0%{stroke-dashoffset:1}55%,100%{stroke-dashoffset:0}}
  @keyframes sPt{0%,52%{opacity:0;transform:scale(.4)}58%{opacity:1;transform:scale(1.4)}64%,72%{transform:scale(1)}78%{transform:scale(1.3)}84%,100%{opacity:1;transform:scale(1)}}
  .pa-s-sec .pa-s-scan{animation:sScan 3.2s ease-in-out infinite}
  .pa-s-sec .pa-s-chk{animation:sChk 6.4s infinite}
  .pa-s-sec .pa-s-ring{animation:sRing 6.4s infinite}
  .pa-s-sec .pa-s-d2{animation:sBlink 1.6s infinite}
  @keyframes sScan{0%,100%{transform:translateY(0);opacity:0}10%{opacity:.7}50%{transform:translateY(64px);opacity:.7}60%{opacity:0}}
  @keyframes sChk{0%,40%{stroke-dashoffset:1}55%,100%{stroke-dashoffset:0}}
  @keyframes sRing{0%{stroke-dasharray:0 100}50%,100%{stroke-dasharray:78 100}}
  @keyframes sBlink{0%,100%{opacity:1}50%{opacity:.25}}
  .pa-s-lage .pa-s-rot{animation:sBlink 1.4s infinite}
  .pa-s-lage .pa-s-c1{animation:sChip 6s infinite}
  .pa-s-lage .pa-s-c2{animation:sChip 6s .35s infinite}
  .pa-s-lage .pa-s-c3{animation:sChip 6s .7s infinite}
  @keyframes sChip{0%,20%{fill:#1c3348}28%,85%{fill:#dd4b39}95%,100%{fill:#1c3348}}
  .pa-s-wall .pa-s-red{animation:sRed 6s infinite}
  .pa-s-wall .pa-s-arc{animation:sLine 6s infinite}
  .pa-s-wall .pa-s-wave{animation:sWave 1.2s linear infinite}
  @keyframes sRed{0%,40%{fill:#1c3348}46%,90%{fill:#dd4b39}96%,100%{fill:#1c3348}}
  @keyframes sWave{0%{transform:translateX(0)}50%{transform:translateX(-2px)}100%{transform:translateX(0)}}
  .pa-s-dev .pa-s-dev3{animation:sDev 6s infinite}
  @keyframes sDev{0%,35%{fill:#2fd07f}42%,90%{fill:#f39c12}96%,100%{fill:#2fd07f}}
  .pa-s-net .pa-s-pk1{animation:sPk1 2.4s linear infinite}
  .pa-s-net .pa-s-pk2{animation:sPk2 2.4s .6s linear infinite}
  .pa-s-net .pa-s-pk3{animation:sPk3 2.4s 1.2s linear infinite}
  .pa-s-net .pa-s-pk4{animation:sPk4 2.4s 1.8s linear infinite}
  @keyframes sPk1{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(76px,33px)}}
  @keyframes sPk2{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(76px,-33px)}}
  @keyframes sPk3{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(-76px,33px)}}
  @keyframes sPk4{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(-76px,-33px)}}
  .pa-s-web .pa-s-file{animation:sFile 7s infinite}
  @keyframes sFile{0%,6%{opacity:0;transform:translateX(-24px)}14%,50%{opacity:1;transform:none}66%,86%{opacity:1;transform:translate(176px,-20px) scale(.45)}94%,100%{opacity:0;transform:translate(176px,-20px) scale(.45)}}
  .pa-s-inv .pa-s-u1{animation:sU 7s infinite}
  .pa-s-inv .pa-s-u2{animation:sU 7s .4s infinite}
  .pa-s-inv .pa-s-u3{animation:sU 7s .8s infinite}
  .pa-s-inv .pa-s-u4{animation:sU 7s 1.2s infinite}
  .pa-s-inv .pa-s-dl1{animation:sDl 7s 2.2s infinite}
  .pa-s-inv .pa-s-dl2{animation:sDl 7s 2.5s infinite}
  .pa-s-inv .pa-s-dl3{animation:sDl 7s 2.8s infinite}
  .pa-s-inv .pa-s-dl4{animation:sDl 7s 3.1s infinite}
  @keyframes sU{0%{opacity:0;transform:translateX(-10px)}8%,80%{opacity:1;transform:none}92%,100%{opacity:0}}
  @keyframes sDl{0%{opacity:0;transform:scaleX(0)}8%,62%{opacity:1;transform:scaleX(1)}74%,100%{opacity:0;transform:scaleX(1)}}
  .pa-s-ai .pa-s-q{animation:sQ 7s infinite}
  .pa-s-ai .pa-s-typ{animation:sTyp 7s infinite}
  .pa-s-ai .pa-s-a{animation:sA 7s infinite}
  .pa-s-ai .pa-s-al1{animation:sAl 7s infinite}
  .pa-s-ai .pa-s-al2{animation:sAl 7s .3s infinite}
  .pa-s-ai .pa-s-al3{animation:sAl 7s .6s infinite}
  @keyframes sQ{0%,4%{opacity:0;transform:translateY(6px)}10%,90%{opacity:1;transform:none}97%,100%{opacity:0}}
  @keyframes sTyp{0%,14%{opacity:0}18%,22%{opacity:1}26%{opacity:.3}30%,34%{opacity:1}38%{opacity:.3}42%{opacity:1}44%,100%{opacity:0}}
  @keyframes sA{0%,44%{opacity:0;transform:translateY(6px)}50%,90%{opacity:1;transform:none}97%,100%{opacity:0}}
  @keyframes sAl{0%,50%{transform:scaleX(0)}62%,100%{transform:scaleX(1)}}
}

/* ===== Über uns: Bühne „Vom eigenen Werkzeug zur Plattform“ – Zeitleiste, die Plattform wächst =====
   Ruhige Fassung: alle Stationen mit ihren Bereichen, Strecke voll. Animation (16 s): Ein Punkt fährt von Station zu
   Station, an jeder Station kommen ihre Bereiche dazu; die Säulen wachsen von unten. */
.uu-zl-body{padding:30px 28px 26px}
.uu-zl-list{position:relative;z-index:1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.uu-st{display:grid;grid-template-rows:minmax(0,1fr) 36px 58px;grid-template-areas:"m" "n" "k";min-width:0}
.uu-st-k{grid-area:k;min-width:0}
.uu-st-n{grid-area:n;display:flex;align-items:center}
.uu-mods{grid-area:m;align-self:end;list-style:none;margin:0 0 4px;padding:0;display:grid;gap:6px}
.uu-jahr{display:block;font-size:22px;font-weight:800;line-height:1.2;letter-spacing:-.01em;color:var(--pm-weiss);white-space:nowrap}
.uu-st-k h3{margin:3px 0 0;font-size:13px;font-weight:600;line-height:1.35;color:var(--pm-grau-hell);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uu-st-n i{position:relative;width:22px;height:22px;border-radius:50%;background:var(--pm-gold);box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 6px rgba(253,206,4,.35)}
.uu-st-n i::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--pm-nacht)}
.uu-st4 .uu-st-n i{background:var(--pm-nacht);box-shadow:inset 0 0 0 2px var(--pm-gold),0 0 0 5px var(--pm-nacht),0 0 0 6px rgba(253,206,4,.25)}
.uu-st4 .uu-st-n i::after{inset:7px;background:rgba(253,206,4,.55)}
.uu-st4 .uu-jahr{color:var(--pm-gold)}
.uu-mods > li{display:block;height:32px;line-height:30px;padding:0 10px;border:1px solid var(--pm-nacht-line);border-radius:8px;background:var(--pm-nacht-2);font-size:12.5px;font-weight:600;color:var(--pm-weiss);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uu-mods > li > svg{width:14px;height:14px;color:var(--pm-gold);vertical-align:-2px;margin-right:8px}
.uu-mods > li > .uu-logo-i.uu-logo-i{width:14px;height:14px;vertical-align:-2px;margin-right:8px;display:inline-block}
.uu-mods > li.uu-logo{border-color:rgba(253,206,4,.45);background:rgba(253,206,4,.08)}
.uu-plan > li{position:relative;display:grid;grid-template-columns:16px minmax(0,1fr);gap:9px;align-items:center;height:auto;line-height:1.3;padding:8px 10px 11px;border-style:dashed;border-color:#3a5168;background:rgba(21,40,58,.6);white-space:normal}
.uu-plan > li > svg{margin:0;vertical-align:0;width:15px;height:15px}
.uu-plan b{display:block;font-size:12.5px;color:var(--pm-weiss);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uu-plan small{display:block;font-size:11px;font-weight:500;color:var(--pm-grau-hell);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uu-plan small a{color:var(--pm-gold);text-decoration:underline;text-underline-offset:2px}
.uu-plan .uu-bar{position:absolute;left:10px;right:10px;bottom:4px;height:3px;border-radius:2px;background:repeating-linear-gradient(-45deg,rgba(253,206,4,.9) 0 6px,rgba(253,206,4,.3) 6px 12px)}
.uu-plan > li.uu-mdm{border:1.5px solid var(--pm-gold);background:linear-gradient(135deg,rgba(253,206,4,.16),rgba(253,206,4,0) 70%),var(--pm-nacht-2);padding-bottom:8px}
.uu-track{position:absolute;z-index:0;left:calc(28px + 11px);right:calc((100% - 110px) / 4 + 17px);bottom:calc(26px + 58px + 18px - 1px);height:2px;background:#22384b;border-radius:2px}
.uu-fill{position:absolute;inset:0;background:linear-gradient(90deg,rgba(253,206,4,.45),var(--pm-gold));transform-origin:left;border-radius:2px}
.uu-leg{position:absolute;z-index:2;left:28px;top:28px;display:grid;gap:7px;font-size:11.5px;color:var(--pm-grau-hell)}
.uu-leg span{display:flex;align-items:center;gap:9px;white-space:nowrap}
.uu-leg i{width:22px;height:12px;border-radius:3px;border:1px solid var(--pm-nacht-line);background:var(--pm-nacht-2)}
.uu-leg .uu-leg-d{border:1px dashed #5b7488;background:repeating-linear-gradient(-45deg,rgba(253,206,4,.5) 0 3px,transparent 3px 6px) no-repeat left bottom / 100% 3px}
.uu-leg .uu-leg-m{border:1.5px solid var(--pm-gold)}
.uu-tok{position:absolute;top:-7px;left:0;margin-left:-8px;width:16px;height:16px;border-radius:50%;background:var(--pm-gold);box-shadow:0 0 0 5px rgba(253,206,4,.18),0 0 22px rgba(253,206,4,.9);opacity:0}

@container pa (max-width:1180px){
  .uu-zl-list{gap:14px}
  .uu-mods > li{padding:0 8px;font-size:11.5px}
  .uu-mods > li > svg{margin-right:6px}
  .uu-plan > li{gap:7px;padding:8px 8px 11px}
  .uu-plan small{font-size:10.5px}
  .uu-track{right:calc((100% - 98px) / 4 + 17px)}
}
/* Schmal: Stationen untereinander, Strecke links */
@container pa (max-width:1000px){
  .uu-zl-body{padding:24px 22px 8px}
  .uu-zl-list{grid-template-columns:minmax(0,1fr);gap:0}
  .uu-st{position:relative;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;grid-template-areas:"n k" ". m";column-gap:12px;padding-bottom:22px}
  .uu-st:not(:last-child)::before{content:"";position:absolute;left:10px;top:26px;bottom:2px;width:2px;background:linear-gradient(var(--pm-gold),rgba(253,206,4,.35))}
  .uu-st-n{align-items:flex-start;padding-top:2px}
  .uu-st-k{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
  .uu-jahr{font-size:18px}
  .uu-st-k h3{margin:0}
  .uu-mods{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
  .uu-mods > li{height:30px;line-height:28px;font-size:12px}
  .uu-plan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .uu-plan > li{height:auto;line-height:1.3}
  .uu-track,.uu-leg{display:none}
}
@container pa (max-width:560px){
  .uu-zl-body{padding:18px 14px 4px}
  .uu-st{grid-template-columns:24px minmax(0,1fr);column-gap:10px;padding-bottom:18px}
  .uu-st-n i{width:20px;height:20px}
  .uu-st-n i::after{inset:6px}
  .uu-st:not(:last-child)::before{left:9px;top:24px}
  .uu-jahr{font-size:16px}
  .uu-st-k{gap:2px 10px}
  .uu-st-k h3{font-size:12px}
  .uu-mods{gap:5px}
  .uu-mods > li{height:28px;line-height:26px;padding:0 9px;font-size:11.5px}
  .uu-mods > li > svg{margin-right:6px}
  .uu-plan{grid-template-columns:minmax(0,1fr)}
  .uu-plan > li{height:auto;line-height:1.3;padding:7px 9px 10px}
}

@media (min-width:0){
  .uu-zl .uu-fill{animation:uuFill 16s infinite}
  .uu-zl .uu-tok{animation:uuTok 16s infinite}
  .uu-zl .uu-st1 .uu-mods > li{animation:uuIn1 16s infinite backwards}
  .uu-zl .uu-st2 .uu-mods > li{animation:uuIn2 16s infinite backwards}
  .uu-zl .uu-st3 .uu-mods > li{animation:uuIn3 16s infinite backwards}
  .uu-zl .uu-st4 .uu-mods > li{animation:uuIn4 16s infinite backwards}
  .uu-zl .uu-mods > li:nth-child(2){animation-delay:.16s}
  .uu-zl .uu-mods > li:nth-child(3){animation-delay:.32s}
  .uu-zl .uu-mods > li:nth-child(4){animation-delay:.48s}
  .uu-zl .uu-mods > li:nth-child(5){animation-delay:.64s}
  .uu-zl .uu-mods > li:nth-child(6){animation-delay:.8s}
  .uu-zl .uu-mods > li:nth-child(7){animation-delay:.96s}
  .uu-zl .uu-mods > li:nth-child(8){animation-delay:1.12s}
  .uu-zl .uu-st1 .uu-st-n i{animation:uuDot1 16s infinite}
  .uu-zl .uu-st2 .uu-st-n i{animation:uuDot2 16s infinite}
  .uu-zl .uu-st3 .uu-st-n i{animation:uuDot3 16s infinite}
  .uu-zl .uu-st4 .uu-st-n i{animation:uuDot4 16s infinite}
  .uu-zl .uu-st2 .uu-st-k{animation:uuK2 16s infinite}
  .uu-zl .uu-st3 .uu-st-k{animation:uuK3 16s infinite}
  .uu-zl .uu-st4 .uu-st-k{animation:uuK4 16s infinite}
  .uu-zl .uu-st1 .uu-jahr{animation:uuJ1 16s infinite}
  .uu-zl .uu-st2 .uu-jahr{animation:uuJ2 16s infinite}
  .uu-zl .uu-st3 .uu-jahr{animation:uuJ3 16s infinite}
  .uu-zl .uu-bar{animation:uuBar 1.2s linear infinite}
  @keyframes uuFill{0%,5%{transform:scaleX(0);opacity:1}24%,27%{transform:scaleX(.3333)}46%,49%{transform:scaleX(.6667)}68%,94%{transform:scaleX(1);opacity:1}98%{transform:scaleX(1);opacity:0}100%{transform:scaleX(0);opacity:0}}
  @keyframes uuTok{0%{left:0;opacity:0}3%,5%{left:0;opacity:1}24%,27%{left:33.333%}46%,49%{left:66.667%}68%,92%{left:100%;opacity:1}96%,100%{left:100%;opacity:0}}
  @keyframes uuIn1{0%,4%{opacity:0;transform:translateY(10px) scale(.96)}7%,94%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
  @keyframes uuIn2{0%,25%{opacity:0;transform:translateY(10px) scale(.96)}28%,94%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
  @keyframes uuIn3{0%,47%{opacity:0;transform:translateY(10px) scale(.96)}50%,94%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
  @keyframes uuIn4{0%,69%{opacity:0;transform:translateY(10px) scale(.96)}72%,94%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
  @keyframes uuDot1{0%,2%{transform:scale(1);box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 6px rgba(253,206,4,.35)}6%{transform:scale(1.25);box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 12px rgba(253,206,4,.45)}22%,100%{transform:scale(1);box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 6px rgba(253,206,4,.35)}}
  @keyframes uuDot2{0%,23%{transform:scale(1);opacity:.4}27%{transform:scale(1.25);opacity:1;box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 12px rgba(253,206,4,.45)}44%,95%{transform:scale(1);opacity:1}99%,100%{opacity:.4}}
  @keyframes uuDot3{0%,45%{transform:scale(1);opacity:.4}49%{transform:scale(1.25);opacity:1;box-shadow:0 0 0 5px var(--pm-nacht),0 0 0 12px rgba(253,206,4,.45)}66%,95%{transform:scale(1);opacity:1}99%,100%{opacity:.4}}
  @keyframes uuDot4{0%,67%{transform:scale(1);opacity:.4}71%{transform:scale(1.25);opacity:1}76%,95%{transform:scale(1);opacity:1}99%,100%{opacity:.4}}
  @keyframes uuK2{0%,23%{opacity:.35}27%,95%{opacity:1}99%,100%{opacity:.35}}
  @keyframes uuK3{0%,45%{opacity:.35}49%,95%{opacity:1}99%,100%{opacity:.35}}
  @keyframes uuK4{0%,67%{opacity:.35}71%,95%{opacity:1}99%,100%{opacity:.35}}
  @keyframes uuJ1{0%,3%{color:var(--pm-weiss)}6%,22%{color:var(--pm-gold)}25%,100%{color:var(--pm-weiss)}}
  @keyframes uuJ2{0%,25%{color:var(--pm-weiss)}28%,44%{color:var(--pm-gold)}47%,100%{color:var(--pm-weiss)}}
  @keyframes uuJ3{0%,47%{color:var(--pm-weiss)}50%,66%{color:var(--pm-gold)}69%,100%{color:var(--pm-weiss)}}
  @keyframes uuBar{from{background-position:0 0}to{background-position:17px 0}}
}

/* ===== Geschichte: Fünf Programme, ein Portal ===== */
.uu-eins-grid{display:grid;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);gap:10px;align-items:center}
.uu-alt{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.uu-alt li{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--pm-nacht-line);border-radius:8px;background:var(--pm-nacht-2);font-size:13px;color:var(--pm-grau-hell);min-width:0}
.uu-alt li i{width:14px;height:11px;border-radius:2px;border:1.5px solid #8fa3b3;border-top-width:3px;flex:none;opacity:.8}
.uu-alt s{text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:linear-gradient(rgba(221,75,57,.8),rgba(221,75,57,.8)) no-repeat 0 56% / 100% 2px;padding:0 2px}
.uu-pfeil{display:grid;place-items:center;color:var(--pm-gold)}
.uu-pfeil svg{width:24px;height:24px}
.uu-portal{border:1px solid var(--pm-nacht-line);border-radius:10px;background:#0b1620;overflow:hidden;box-shadow:0 0 0 3px rgba(253,206,4,.08)}
.uu-portal-bar{padding:10px 12px;border-bottom:1px solid var(--pm-nacht-line);background:var(--pm-nacht-2)}
.uu-portal-bar .uu-portal-logo{display:block;height:15px;width:auto}
.uu-menu{list-style:none;margin:0;padding:8px;display:grid;gap:4px}
.uu-menu li{display:flex;align-items:center;gap:9px;padding:6px 10px;border-radius:6px;font-size:13px;font-weight:600;color:var(--pm-weiss);background:rgba(253,206,4,.07);white-space:nowrap;overflow:hidden}
.uu-menu svg{width:15px;height:15px;color:var(--pm-gold);flex:none}
@container pam (max-width:500px){
  .uu-eins-grid{grid-template-columns:minmax(0,1fr)}
  .uu-pfeil svg{transform:rotate(90deg)}
}
@media (min-width:0){
  .uu-eins .uu-alt s{animation:uuStrike 10s infinite backwards}
  .uu-eins .uu-alt li{animation:uuAltLi 10s infinite backwards}
  .uu-eins .uu-menu li{animation:uuMenu 10s infinite backwards}
  .uu-eins .uu-alt .uu-a2 s,.uu-eins .uu-alt .uu-a2,.uu-eins .uu-menu .uu-n2{animation-delay:1.2s}
  .uu-eins .uu-alt .uu-a3 s,.uu-eins .uu-alt .uu-a3,.uu-eins .uu-menu .uu-n3{animation-delay:2.4s}
  .uu-eins .uu-alt .uu-a4 s,.uu-eins .uu-alt .uu-a4,.uu-eins .uu-menu .uu-n4{animation-delay:3.6s}
  .uu-eins .uu-alt .uu-a5 s,.uu-eins .uu-alt .uu-a5,.uu-eins .uu-menu .uu-n5{animation-delay:4.8s}
  .uu-eins .uu-pfeil{animation:uuPfeil 1.6s ease-in-out infinite}
  @keyframes uuStrike{0%,8%{background-size:0 2px;color:var(--pm-weiss)}16%,90%{background-size:100% 2px;color:var(--pm-grau-hell)}97%,100%{background-size:0 2px;color:var(--pm-weiss)}}
  @keyframes uuAltLi{0%,8%{opacity:1;border-color:var(--pm-nacht-line)}11%{border-color:rgba(221,75,57,.7)}18%,90%{opacity:.55;border-color:var(--pm-nacht-line)}97%,100%{opacity:1}}
  @keyframes uuMenu{0%,13%{opacity:0;transform:translateX(-10px);background:rgba(253,206,4,.07)}17%{opacity:1;transform:none;background:rgba(253,206,4,.35)}26%,90%{opacity:1;transform:none;background:rgba(253,206,4,.07)}97%,100%{opacity:0}}
  @keyframes uuPfeil{0%,100%{transform:translateX(-3px)}50%{transform:translateX(4px)}}
}
@container pam (max-width:500px){@media (min-width:0){.uu-eins .uu-pfeil{animation:none}}}

/* ===== Der Name: Logo und „im Voraus warnen“ ===== */
.uu-logo-m{margin-top:28px}
.uu-lg{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:center}
.uu-lg-schild{position:relative;width:150px;height:150px}
.uu-lg-schild .uu-lg-img{display:block;width:150px;height:150px}
.uu-lg-puls{position:absolute;top:50%;left:16%;width:20%;height:14px;margin-top:-7px;border-radius:50%;background:radial-gradient(closest-side,rgba(253,206,4,.75),rgba(253,206,4,0));opacity:0}
.uu-lg-k{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.uu-lg-k li{position:relative;padding-left:34px}
.uu-lg-k li::before{content:"";position:absolute;left:0;top:9px;width:24px;height:2px;background:var(--pm-gold)}
.uu-lg-k li::after{content:"";position:absolute;left:-4px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--pm-gold)}
.uu-lg-k b{display:block;color:var(--pm-weiss);font-size:16px;line-height:1.35}
.uu-lg-wort{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:18px;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid var(--pm-nacht-line)}
.uu-lg-wort .uu-lg-wm{display:block;height:24px;width:auto}
.uu-lg-e{justify-self:start;display:grid;gap:5px;padding:7px 10px;border:1px dashed #3a5168;border-radius:8px}
.uu-lg-e i{display:block;width:26px;height:5px;border-radius:1px;background:var(--pm-weiss)}
.uu-lg-e i:nth-child(2){width:20px;background:var(--pm-gold)}
.uu-lg-et{font-size:13px;line-height:1.45;color:var(--pm-auf-nacht)}
.uu-lg-et .pa-k{margin-bottom:2px}
@container pam (max-width:470px){
  .uu-lg{grid-template-columns:96px minmax(0,1fr);gap:16px}
  .uu-lg-schild,.uu-lg-schild .uu-lg-img{width:96px;height:96px}
  .uu-lg-k b{font-size:14px}
  .uu-lg-wort{grid-template-columns:auto auto;gap:12px 14px}
  .uu-lg-et{grid-column:1 / -1}
  .uu-lg-wort .uu-lg-wm{height:20px}
}
@media (min-width:0){
  .uu-logo-m .uu-lg-puls{animation:uuPuls 3.2s ease-in-out infinite}
  .uu-logo-m .uu-lk1{animation:uuLk 9s infinite backwards}
  .uu-logo-m .uu-lk2{animation:uuLk 9s .8s infinite backwards}
  .uu-logo-m .uu-lg-e i{animation:uuE 9s infinite backwards}
  .uu-logo-m .uu-lg-e i:nth-child(1){animation-delay:1.8s}
  .uu-logo-m .uu-lg-e i:nth-child(2){animation-delay:2.1s}
  .uu-logo-m .uu-lg-e i:nth-child(3){animation-delay:2.4s}
  .uu-logo-m .uu-lg-et{animation:uuLk 9s 2.6s infinite backwards}
  @keyframes uuPuls{0%{left:12%;opacity:0}10%{opacity:1}80%{opacity:1}100%{left:68%;opacity:0}}
  @keyframes uuLk{0%,4%{opacity:0;transform:translateX(-8px)}10%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
  @keyframes uuE{0%,3%{transform:scaleX(0);transform-origin:left}9%,92%{transform:scaleX(1);transform-origin:left}98%,100%{transform:scaleX(0);transform-origin:left}}
}

.uu-vor{margin-top:22px}
.uu-vor-l{list-style:none;margin:0;padding:0}
.uu-vor-l li{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:18px;align-items:center;padding:12px 0;border-top:1px solid var(--pm-nacht-line)}
.uu-vor-l li:first-child{border-top:0;padding-top:2px}
.uu-v-t{font-size:12px;line-height:1.4;color:var(--pm-grau-hell)}
.uu-v-t b{display:block;font-size:13.5px;color:var(--pm-weiss)}
.uu-axis{position:relative;height:44px}
.uu-axis::before{content:"";position:absolute;left:0;right:0;top:15px;height:2px;background:#2b4459;border-radius:2px}
.uu-axis::after{content:"";position:absolute;right:-2px;top:11px;border-left:8px solid #3a5168;border-top:5px solid transparent;border-bottom:5px solid transparent}
.uu-v-w{position:absolute;left:14%;top:4px;width:24px;height:24px;margin-left:-12px;border-radius:50%;background:var(--pm-gold);color:var(--pm-nacht);display:grid;place-items:center;box-shadow:0 0 0 4px rgba(253,206,4,.2);z-index:1}
.uu-v-w svg{width:13px;height:13px}
.uu-v-zeit{position:absolute;left:14%;right:16%;top:13px;height:6px;border-radius:3px;background:linear-gradient(90deg,rgba(253,206,4,.75),rgba(253,206,4,.18));transform-origin:left}
.uu-v-e{position:absolute;right:16%;top:6px;width:20px;height:20px;margin-right:-10px;border-radius:50%;border:2px dashed #dd4b39;background:var(--pm-nacht);opacity:.75}
.uu-axis em{position:absolute;left:14%;bottom:0;margin-left:-12px;font-style:normal;font-size:10.5px;color:var(--pm-grau-hell);white-space:nowrap}
.uu-vor-leg{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;padding-top:12px;border-top:1px solid var(--pm-nacht-line);font-size:11.5px;color:var(--pm-grau-hell)}
.uu-vor-leg span{display:inline-flex;align-items:center;gap:7px}
.uu-vor-leg i{display:inline-block}
.uu-lw{width:10px;height:10px;border-radius:50%;background:var(--pm-gold)}
.uu-lz{width:18px;height:5px;border-radius:3px;background:linear-gradient(90deg,rgba(253,206,4,.75),rgba(253,206,4,.2))}
.uu-le{width:10px;height:10px;border-radius:50%;border:1.5px dashed #dd4b39}
@container pam (max-width:480px){
  .uu-vor-l li{grid-template-columns:minmax(0,1fr);gap:6px}
}
@media (min-width:0){
  .uu-vor .uu-v-w{animation:uuVw 8s infinite backwards}
  .uu-vor .uu-v-zeit{animation:uuVz 8s infinite backwards}
  .uu-vor .uu-v-e{animation:uuVe 8s infinite backwards}
  .uu-vor .uu-axis em{animation:uuVem 8s infinite backwards}
  .uu-vor li.uu-v2 *{animation-delay:.6s}
  .uu-vor li.uu-v3 *{animation-delay:1.2s}
  @keyframes uuVw{0%,8%{transform:scale(0);opacity:0}13%{transform:scale(1.3);opacity:1}18%,90%{transform:scale(1);opacity:1}96%,100%{transform:scale(0);opacity:0}}
  @keyframes uuVz{0%,16%{transform:scaleX(0)}52%,90%{transform:scaleX(1);opacity:1}96%,100%{transform:scaleX(1);opacity:0}}
  @keyframes uuVe{0%,40%{opacity:.25;transform:scale(.8)}52%{opacity:1;transform:scale(1.15)}60%,90%{opacity:.75;transform:scale(1)}96%,100%{opacity:.25}}
  @keyframes uuVem{0%,14%{opacity:0}20%,90%{opacity:1}96%,100%{opacity:0}}
}

/* ===== Deutschland: Liste und „Wo Ihre Daten liegen“ ===== */
.uu-de-split{align-items:start}
.uu-de-split .pm-seal{margin-top:10px}
.uu-weg-fig{margin-top:48px}
.uu-weg{background:var(--pm-nacht-2)}
.uu-weg-grid{display:grid;grid-template-columns:minmax(0,150px) minmax(50px,.5fr) minmax(0,2.2fr) minmax(50px,.45fr) minmax(0,170px);align-items:center}
.uu-weg-src ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:7px}
.uu-weg-src li{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--pm-nacht-line);border-radius:8px;background:var(--pm-nacht);font-size:12.5px;font-weight:600;color:var(--pm-weiss)}
.uu-weg-src svg{width:15px;height:15px;color:#c9d4dd;flex:none}
.uu-weg-ln{position:relative;height:40px;margin:0 8px}
.uu-weg-ln i{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:repeating-linear-gradient(90deg,var(--pm-gold) 0 6px,transparent 6px 12px);opacity:.85}
.uu-weg-ln span{position:absolute;left:50%;top:0;transform:translateX(-50%);font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--pm-gold)}
.uu-weg-ln2 i{background:repeating-linear-gradient(90deg,#dd4b39 0 5px,transparent 5px 11px);opacity:.7}
.uu-weg-ln2 b{position:absolute;left:50%;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;display:grid;place-items:center;background:#3b1d1f;border:2px solid #dd4b39;color:#ff8a7d;font-size:12px;line-height:1}
.uu-weg-de{border:1.5px solid rgba(253,206,4,.55);border-radius:14px;padding:14px 16px 12px;background:rgba(253,206,4,.04);box-shadow:0 0 0 5px rgba(253,206,4,.05)}
.uu-weg-de-h{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.uu-weg-de-h .pm-de{width:22px;height:14px;display:flex;flex-direction:column;border-radius:2px;overflow:hidden;flex:none}
.uu-weg-de-h b{color:var(--pm-weiss);font-size:15px}
.uu-weg-de-h small{font-size:11.5px;color:var(--pm-grau-hell)}
.uu-rz-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.uu-rz{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--pm-nacht-line);border-radius:10px;background:var(--pm-nacht)}
.uu-rz-i{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--pm-weiss);white-space:nowrap}
.uu-rz-i svg{width:14px;height:14px;color:var(--pm-gold);flex:none}
.uu-weg-hw{display:block;margin-top:10px;font-size:11.5px;color:var(--pm-grau-hell)}
.uu-weg-cloud{display:grid;justify-items:center;gap:4px;text-align:center;padding:12px 10px;border:1px dashed #3a5168;border-radius:12px;color:var(--pm-grau-hell);font-size:12px;line-height:1.35;opacity:.8}
.uu-weg-cloud svg{width:28px;height:28px;color:#8fa3b3}
.uu-weg-cloud em{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#ff8a7d}
@container pam (max-width:860px){
  .uu-weg-grid{grid-template-columns:minmax(0,1fr)}
  .uu-weg-src ul{display:flex;flex-wrap:wrap}
  .uu-weg-ln{height:34px;margin:4px 0}
  .uu-weg-ln i{left:50%;right:auto;top:0;bottom:0;width:2px;height:auto;margin:0 0 0 -1px;background:repeating-linear-gradient(180deg,var(--pm-gold) 0 6px,transparent 6px 12px)}
  .uu-weg-ln2 i{background:repeating-linear-gradient(180deg,#dd4b39 0 5px,transparent 5px 11px)}
  .uu-weg-ln span{left:calc(50% + 10px);top:50%;transform:translateY(-50%)}
  .uu-weg-cloud{grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:10px}
  .uu-weg-cloud svg{grid-row:span 2}
}
@container pam (max-width:420px){
  .uu-rz-row{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:0){
  .uu-weg .uu-weg-ln1 i{animation:uuStream 1s linear infinite}
  .uu-weg .uu-rz{animation:uuRz 4s infinite}
  .uu-weg .uu-rz2{animation-delay:2s}
  .uu-weg .uu-weg-ln2 b{animation:uuBlock 2.4s ease-in-out infinite}
  @keyframes uuStream{from{background-position:0 0}to{background-position:12px 0}}
  @keyframes uuRz{0%,100%{border-color:var(--pm-nacht-line);box-shadow:none}15%{border-color:rgba(253,206,4,.7);box-shadow:0 0 0 3px rgba(253,206,4,.12)}40%{border-color:var(--pm-nacht-line);box-shadow:none}}
  @keyframes uuBlock{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
}
@media (min-width:0){@keyframes uuStreamV{from{background-position:0 0}to{background-position:0 12px}}}
@container pam (max-width:860px){@media (min-width:0){.uu-weg .uu-weg-ln1 i{animation-name:uuStreamV}}}

/* ===== Warum PRAEMON: Karten mit Symbol-Animation, zwei Spalten ===== */
.pa-cards.uu-why{grid-template-columns:repeat(2,minmax(0,1fr))}
.uu-why .pa-card{flex-direction:row}
.uu-why .pa-sym{width:30%;flex:none;height:auto;min-height:160px;border-bottom:0;border-right:1px solid var(--pm-rand)}
.uu-why .pa-sym > svg{width:220px;height:96px}
.uu-why .pa-body{justify-content:center}
@container pm (max-width:1180px){
  .pa-cards.uu-why{grid-template-columns:minmax(0,1fr)}
  .uu-why .pa-sym{width:34%}
  .uu-why .pa-sym > svg{width:250px;height:110px}
}
@container pm (max-width:600px){
  .uu-why .pa-card{flex-direction:column}
  .uu-why .pa-sym{width:auto;min-height:0;height:132px;border-right:0;border-bottom:1px solid var(--pm-rand)}
  .uu-why .pa-sym > svg{width:240px;height:104px}
}
.uu-sj rect{fill:#1c3348;stroke:#2b4459}
.uu-sj .uu-sj5{fill:rgba(253,206,4,.2);stroke:var(--pm-gold)}
.uu-sj-ln{stroke-dasharray:1}
.uu-ds-c rect{fill:#15283a;stroke:#3a5168}
.uu-ds-c text,.uu-h text,.uu-ki-t{font-family:var(--pm-font);font-size:11px;font-weight:700;fill:#c9d4dd;text-anchor:middle}
.uu-ki-t{fill:#ff8a7d;font-size:10px}
.uu-ki-p{stroke-dasharray:1}
.uu-ki-pk{fill:var(--pm-gold)}
.uu-h rect{fill:#15283a;stroke:#3a5168}
.uu-h1 rect{fill:rgba(253,206,4,.16);stroke:var(--pm-gold)}
.uu-h-br{stroke-dasharray:1}
.uu-sj rect,.uu-ds-c,.uu-h{transform-box:fill-box;transform-origin:center bottom}
@media (min-width:0){
  .uu-s-jahre .uu-sj rect{animation:uuSj 7s infinite backwards}
  .uu-s-jahre .uu-sj .uu-sj2{animation-delay:.25s}.uu-s-jahre .uu-sj .uu-sj3{animation-delay:.5s}.uu-s-jahre .uu-sj .uu-sj4{animation-delay:.75s}.uu-s-jahre .uu-sj .uu-sj5{animation-delay:1s}
  .uu-s-jahre .uu-sj-ln{animation:sLine 7s infinite}
  .uu-s-jahre .uu-sj-pt{animation:sBlink 1.4s infinite}
  @keyframes uuSj{0%,4%{transform:scaleY(0)}14%,88%{transform:scaleY(1)}96%,100%{transform:scaleY(0)}}
  .uu-s-ds .uu-ds-c{animation:uuDs 6s infinite backwards}
  .uu-s-ds .uu-ds-c2{animation-delay:.5s}.uu-s-ds .uu-ds-c3{animation-delay:1s}
  .uu-s-ds .uu-ds-k{animation:sBlink 1.6s infinite}
  @keyframes uuDs{0%,6%{opacity:0;transform:scale(.6)}14%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
  .uu-s-ki .uu-ki-p{animation:sLine 4s infinite}
  .uu-s-ki .uu-ki-pk{animation:uuKiPk 2.2s linear infinite}
  .uu-s-ki .uu-ki-x{animation:sBlink 2.2s infinite}
  @keyframes uuKiPk{0%{transform:translateX(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(44px);opacity:0}}
  .uu-s-hand .uu-h{animation:uuH 7s infinite backwards}
  .uu-s-hand .uu-h2{animation-delay:.4s}.uu-s-hand .uu-h1{animation-delay:.8s}
  .uu-s-hand .uu-h-br{animation:uuBr 7s infinite}
  @keyframes uuH{0%,4%{opacity:0;transform:translateY(-14px)}14%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
  @keyframes uuBr{0%,30%{stroke-dashoffset:1}44%,100%{stroke-dashoffset:0}}
}

/* ===== Werte: Erst bei uns, dann bei Ihnen ===== */
.uu-filter{margin-top:26px}
.uu-f-row{display:grid;grid-template-columns:auto minmax(24px,1fr) auto minmax(24px,1fr) auto;align-items:start}
.uu-f-st{display:grid;justify-items:center;gap:8px;text-align:center}
.uu-f-st > svg{width:46px;height:46px;padding:11px;border-radius:12px;background:var(--pm-nacht-2);border:1px solid var(--pm-nacht-line);color:#c9d4dd;box-sizing:border-box}
.uu-f-own > svg{color:var(--pm-gold);border-color:rgba(253,206,4,.5)}
.uu-f-kd > svg{color:var(--pm-nacht);background:var(--pm-gold);border-color:var(--pm-gold)}
.uu-f-st .pa-k{font-size:10px;white-space:nowrap}
.uu-f-st .pa-chip{font-size:10.5px}
.uu-f-ln{position:relative;height:2px;margin:44px 8px 0;background:#2b4459}
.uu-f-pk{position:absolute;top:-9px;left:0;padding:0 8px;border-radius:999px;background:var(--pm-gold);color:var(--pm-nacht);font-size:9.5px;font-weight:800;line-height:18px;font-style:normal;letter-spacing:.04em;white-space:nowrap;box-shadow:0 0 12px rgba(253,206,4,.6);opacity:0}
.uu-f-pk2{background:#8fa3b3;box-shadow:none}
.uu-f-drop{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:6px;font-size:11px;color:var(--pm-grau-hell)}
.uu-f-drop i{width:2px;height:22px;background:repeating-linear-gradient(180deg,#dd4b39 0 4px,transparent 4px 8px)}
@container pam (max-width:430px){
  .uu-f-st > svg{width:40px;height:40px;padding:9px}
  .uu-f-ln{margin-top:38px;margin-inline:5px}
  .uu-f-st .pa-k{font-size:9px;letter-spacing:.06em}
}
@media (min-width:0){
  .uu-filter .uu-f-pk1{animation:uuPk1 10s infinite}
  .uu-filter .uu-f-pk2{animation:uuPk2 10s infinite}
  .uu-filter .uu-f-pk3{animation:uuPk3 10s infinite}
  .uu-filter .uu-f-ok{animation:uuOk 10s infinite}
  .uu-filter .uu-f-no{animation:uuNo 10s infinite}
  .uu-filter .uu-f-drop{animation:uuDrop 10s infinite}
  .uu-filter .uu-f-kd > svg{animation:uuKd 10s infinite}
  .uu-filter .uu-f-own > svg{animation:uuOwn 10s infinite}
  @keyframes uuPk1{0%,5%{left:0;transform:none;opacity:0}7%{opacity:1}20%{left:100%;transform:translateX(-100%);opacity:1}22%,100%{left:100%;transform:translateX(-100%);opacity:0}}
  @keyframes uuPk3{0%,34%{left:0;transform:none;opacity:0}36%{opacity:1}48%{left:100%;transform:translateX(-100%);opacity:1}50%,100%{left:100%;transform:translateX(-100%);opacity:0}}
  @keyframes uuPk2{0%,54%{left:0;transform:none;opacity:0}56%{opacity:1}68%{left:100%;transform:translateX(-100%);opacity:1}70%,100%{left:100%;transform:translateX(-100%);opacity:0}}
  @keyframes uuOwn{0%,20%,48%,68%,100%{box-shadow:none}24%,32%,72%,80%{box-shadow:0 0 0 5px rgba(253,206,4,.18)}}
  @keyframes uuOk{0%,24%{opacity:0;transform:scale(.6)}28%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
  @keyframes uuNo{0%,72%{opacity:0;transform:scale(.6)}76%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
  @keyframes uuDrop{0%,76%{opacity:0;transform:translateY(-8px)}82%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
  @keyframes uuKd{0%,48%{box-shadow:none}52%{box-shadow:0 0 0 7px rgba(253,206,4,.35)}62%,100%{box-shadow:0 0 0 0 rgba(253,206,4,0)}}
}

/* Kopfzeilen der kleinen Szenen: schmal nur Titel und Kennzeichen */
@container pam (max-width:470px){
  .uu-eins .pa-mini-head > span:not(.pa-tag),.uu-vor .pa-mini-head > span:not(.pa-tag),.uu-weg .pa-mini-head > span:not(.pa-tag),.uu-filter .pa-mini-head > span:not(.pa-tag){display:none}
  .pa-mini-head .pa-tag{margin-left:auto}
}