/* VergabePlaner – Daten- und Prozessfluss als CSS-Animation (15 s, Schleife). Erzeugt von ci/build-datenfluss.py, nicht von Hand bearbeiten. */
@import url(datenfluss-icons.css);
.vf{--fb:#00739F;--vs:#C4610A;--ink:#02325A;--mut:#4B6075;--bg:#E7F3F5;--li:#B9D523;--lw:130px;--ns:30px;--lo:21px;
position:relative;background:var(--bg);border-radius:16px;overflow:hidden;color:var(--ink);line-height:1.3;box-shadow:0 30px 60px -36px rgba(2,50,90,.35)}
.vf *{box-sizing:border-box}
.vf-d{padding:28px 28px 30px;display:flex;flex-direction:column;gap:22px}
.vf-cap{position:relative;height:1.4em;font-size:clamp(19px,2vw,24px);font-weight:400}
.vf-cap p{position:absolute;inset:0;margin:0;opacity:0}
.vf-cap p:nth-child(3){opacity:1}
.vf-b{position:relative;height:248px}
.vf-ln{position:absolute;z-index:3;left:0;right:0;height:52px;border-radius:10px}
.vf-ln.f{top:0;background:#CEE5EC}
.vf-ln.v{top:196px;background:#E3E3DB}
.vf-pl{position:absolute;left:12px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:999px;color:#FFFFFF;font-size:14px;font-weight:500;white-space:nowrap}
.vf-ln.f .vf-pl{background:var(--fb)}.vf-ln.v .vf-pl{background:var(--vs)}
.vf-tr{position:absolute;z-index:1;left:calc(var(--lw) + (100% - var(--lw)) / 18);right:calc((100% - var(--lw)) / 18);top:110.5px;height:3px;border-radius:2px;background:#C6DCE4}
.vf-g{position:absolute;inset:0;border-radius:2px;background:var(--fb);transform-origin:0 50%}
.vf-cs{position:relative;z-index:2;list-style:none;margin:0 0 0 var(--lw);padding:0;height:100%;display:grid;grid-template-columns:repeat(9,minmax(0,1fr))}
.vf-c{position:relative;--fx:50%;--fy:26px;--nx:50%;--ny:112px;--vx:50%;--vy:222px;--ax:var(--fx);--ay:var(--fy);--bx:var(--vx);--by:var(--vy);--pc:var(--fb)}
.vf-c::before{content:"";position:absolute;left:50%;top:26px;bottom:26px;border-left:1.5px dashed #9DB3C2}
.vf-o,.vf-n,.vf-p{position:absolute;transform:translate(-50%,-50%)}
.vf-o{width:12px;height:12px;border-radius:3px;background:#FFFFFF;border:2px solid var(--fb);left:var(--fx);top:var(--fy)}
.vf-o.v{border-color:var(--vs);left:var(--vx);top:var(--vy)}
.vf-n{left:var(--nx);top:var(--ny);width:var(--ns);height:var(--ns);border-radius:50%;background:#FFFFFF;border:1.5px solid #9DB3C2;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.vf-k{position:absolute;inset:-1.5px;border-radius:50%;background:var(--li)}
.vf-k::after{content:"";position:absolute;left:50%;top:44%;width:10px;height:5px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translate(-50%,-50%) rotate(-45deg)}
.vf-l{position:absolute;left:2px;right:2px;top:calc(var(--ny) + var(--lo));text-align:center;font-size:12px;font-weight:500;line-height:1.2;-webkit-hyphens:manual;hyphens:manual}
.vf-l span{background:var(--bg);padding:0 3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.vf-p{z-index:3;width:12px;height:12px;border-radius:3px;background:var(--pc);box-shadow:0 0 0 3px rgba(255,255,255,.7);opacity:0;left:var(--ax);top:var(--ay)}
.vf-a{align-self:center;width:min(100%,380px);display:flex;align-items:center;gap:14px;background:var(--ink);color:#FFFFFF;border-radius:10px;padding:14px 18px;box-shadow:0 16px 30px -18px rgba(2,50,90,.6)}
.vf-a svg{flex:none}
.vf-at{display:flex;flex-direction:column;gap:7px;min-width:0}
.vf-at b{font-size:15px;font-weight:500}
.vf-q{display:flex;align-items:center;gap:4px;font-size:12px;color:#CFE0EC}
.vf-q i{position:relative;display:block;width:12px;height:12px;border-radius:2px;background:#2D5679;overflow:hidden}
.vf-q i::after{content:"";position:absolute;inset:0;background:var(--li)}
.vf-q span{margin-left:6px}
.vf-t,.vf-z{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;justify-content:center;pointer-events:none;opacity:0}
.vf-t{padding:0 7%;font-size:clamp(28px,4.2vw,52px);font-weight:300;line-height:1.15}
.vf-t b{font-weight:500}
.vf-z{align-items:center;text-align:center;gap:14px;padding:0 20px}
.vf-w{display:flex;align-items:center;gap:16px;font-size:clamp(34px,5vw,60px);font-weight:300;line-height:1}
.vf-w svg{width:.9em;height:.9em}
.vf-w span span:first-child{border-bottom:3px solid var(--ink);padding-bottom:3px}
.vf-w span span+span{color:#008EC6}
.vf-z p{margin:0;font-size:clamp(16px,1.8vw,22px);color:var(--mut)}
.vf-z a,.vf-z strong{font-size:16px;font-weight:600;color:var(--fb)}
@media (max-width:859px){
.vf{--lw:0px;--ns:26px;--lo:16px;width:100%;max-width:560px;margin:0 auto}
.vf-d{padding:20px 16px 22px;gap:16px}
.vf-cap{height:2.7em;font-size:17px;line-height:1.35}
.vf-b{height:auto;padding-top:44px}
.vf-ln{top:36px !important;bottom:0;width:64px;height:auto}
.vf-ln.v{left:auto;right:0}
.vf-pl{top:-36px;left:0;transform:none;height:28px;font-size:13px;padding:0 12px}
.vf-ln.v .vf-pl{left:auto;right:0}
.vf-tr{left:calc(50% - 1.5px);right:auto;width:3px;height:auto;top:59px;bottom:35px}
.vf-g{transform-origin:50% 0}
.vf-cs{display:block;height:auto}
.vf-c{height:50px;--fx:32px;--fy:15px;--nx:50%;--ny:15px;--vx:calc(100% - 32px);--vy:15px}
.vf-c::before{left:32px;right:32px;top:15px;bottom:auto;border-left:0;border-top:1.5px dashed #9DB3C2}
.vf-n{font-size:11.5px}
.vf-p{width:14px;height:14px}
.vf-k::after{width:9px;height:4.5px}
.vf-l{left:72px;right:72px;font-size:12.5px;white-space:nowrap}
.vf-a{width:100%;justify-content:center}
.vf-t{font-size:30px;padding:0 24px}
.vf-w{font-size:36px;gap:12px}
.vf-z p{font-size:16px}
}
.vf-o{display:none}.vf-c::before{top:52px;bottom:52px}.vf-pl{z-index:1}
@media (max-width:859px){.vf-c::before{left:64px;right:64px;top:15px;bottom:auto}}
@keyframes vfmx{from{background-position-x:-880px}to{background-position-x:0}}
@keyframes vfmy{from{background-position-y:-464px}to{background-position-y:0}}
@media (prefers-reduced-motion: no-preference){.vf-ln::after{animation:vfmx 34s linear infinite}.vf-ln.v::after{animation-direction:reverse}@media (max-width:859px){.vf-ln::after{animation-name:vfmy}}}
@keyframes vft{0%,1.33%{opacity:0;transform:translateX(16px)}4.67%,12.67%{opacity:1;transform:none}15.33%,100%{opacity:0;transform:translateX(-16px)}}
@keyframes vfd{0%,14.67%{opacity:0}18%,82.67%{opacity:1}86%,100%{opacity:0}}
@keyframes vfc1{0%,16.67%{opacity:0;transform:translateX(14px)}19.33%,27.33%{opacity:1;transform:none}29.33%,100%{opacity:0;transform:translateX(-12px)}}
@keyframes vfc2{0%,29.33%{opacity:0;transform:translateX(14px)}32%,66.67%{opacity:1;transform:none}68.67%,100%{opacity:0;transform:translateX(-12px)}}
@keyframes vfc3{0%,68.67%{opacity:0;transform:translateX(14px)}71.33%,82.67%{opacity:1;transform:none}86%,100%{opacity:0;transform:translateX(-12px)}}
@keyframes vfn{0%,15.33%{transform:translate(-50%,-50%) scale(0)}17.67%{transform:translate(-50%,-50%) scale(1.15)}18.67%,100%{transform:translate(-50%,-50%) scale(1)}}
@keyframes vfgx{0%,32.67%{transform:scaleX(0)}64.67%,90%{transform:scaleX(1)}90.67%,100%{transform:scaleX(0)}}
@keyframes vfgy{0%,32.67%{transform:scaleY(0)}64.67%,90%{transform:scaleY(1)}90.67%,100%{transform:scaleY(0)}}
@keyframes vfa{0%,68.67%{box-shadow:0 16px 30px -18px rgba(2,50,90,.6),0 0 0 0 rgba(185,213,35,0);transform:none}70.67%{transform:scale(1.04)}72.67%,82.67%{box-shadow:0 16px 30px -18px rgba(2,50,90,.6),0 0 0 4px rgba(185,213,35,.9);transform:none}86%,100%{box-shadow:0 16px 30px -18px rgba(2,50,90,.6),0 0 0 0 rgba(185,213,35,0)}}
@keyframes vfz{0%,86%{opacity:0;transform:scale(.97)}89.33%,96.67%{opacity:1;transform:none}99.67%,100%{opacity:0}}
@keyframes vfp0{0%,29.33%{opacity:0;left:var(--ax);top:var(--ay)}29.67%{opacity:1;left:var(--ax);top:var(--ay)}32.67%{opacity:1;left:var(--nx);top:var(--ny)}35.67%{opacity:1;left:var(--bx);top:var(--by)}36%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk0{0%,32.67%{transform:scale(0)}33.67%{transform:scale(1.18)}34.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp1{0%,33.33%{opacity:0;left:var(--ax);top:var(--ay)}33.67%{opacity:1;left:var(--ax);top:var(--ay)}36.67%{opacity:1;left:var(--nx);top:var(--ny)}39.67%{opacity:1;left:var(--bx);top:var(--by)}40%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk1{0%,36.67%{transform:scale(0)}37.67%{transform:scale(1.18)}38.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp2{0%,37.33%{opacity:0;left:var(--ax);top:var(--ay)}37.67%{opacity:1;left:var(--ax);top:var(--ay)}40.67%{opacity:1;left:var(--nx);top:var(--ny)}43.67%{opacity:1;left:var(--bx);top:var(--by)}44%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk2{0%,40.67%{transform:scale(0)}41.67%{transform:scale(1.18)}42.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp3{0%,41.33%{opacity:0;left:var(--ax);top:var(--ay)}41.67%{opacity:1;left:var(--ax);top:var(--ay)}44.67%{opacity:1;left:var(--nx);top:var(--ny)}47.67%{opacity:1;left:var(--bx);top:var(--by)}48%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk3{0%,44.67%{transform:scale(0)}45.67%{transform:scale(1.18)}46.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp4{0%,45.33%{opacity:0;left:var(--ax);top:var(--ay)}45.67%{opacity:1;left:var(--ax);top:var(--ay)}48.67%{opacity:1;left:var(--nx);top:var(--ny)}51.67%{opacity:1;left:var(--bx);top:var(--by)}52%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk4{0%,48.67%{transform:scale(0)}49.67%{transform:scale(1.18)}50.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp5{0%,49.33%{opacity:0;left:var(--ax);top:var(--ay)}49.67%{opacity:1;left:var(--ax);top:var(--ay)}52.67%{opacity:1;left:var(--nx);top:var(--ny)}55.67%{opacity:1;left:var(--bx);top:var(--by)}56%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk5{0%,52.67%{transform:scale(0)}53.67%{transform:scale(1.18)}54.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp6{0%,53.33%{opacity:0;left:var(--ax);top:var(--ay)}53.67%{opacity:1;left:var(--ax);top:var(--ay)}56.67%{opacity:1;left:var(--nx);top:var(--ny)}59.67%{opacity:1;left:var(--bx);top:var(--by)}60%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk6{0%,56.67%{transform:scale(0)}57.67%{transform:scale(1.18)}58.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp7{0%,57.33%{opacity:0;left:var(--ax);top:var(--ay)}57.67%{opacity:1;left:var(--ax);top:var(--ay)}60.67%{opacity:1;left:var(--nx);top:var(--ny)}63.67%{opacity:1;left:var(--bx);top:var(--by)}64%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk7{0%,60.67%{transform:scale(0)}61.67%{transform:scale(1.18)}62.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@keyframes vfp8{0%,61.33%{opacity:0;left:var(--ax);top:var(--ay)}61.67%{opacity:1;left:var(--ax);top:var(--ay)}64.67%{opacity:1;left:var(--nx);top:var(--ny)}67.67%{opacity:1;left:var(--bx);top:var(--by)}68%,100%{opacity:0;left:var(--bx);top:var(--by)}}
@keyframes vfk8{0%,64.67%{transform:scale(0)}65.67%{transform:scale(1.18)}66.33%,90%{transform:scale(1)}90.67%,100%{transform:scale(0)}}
@media (prefers-reduced-motion: no-preference){.vf-t,.vf-d,.vf-cap p,.vf-n,.vf-g,.vf-a,.vf-z,.vf-p,.vf-k,.vf-q i::after{animation-duration:15s;animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:ease-in-out}.vf-t{animation-name:vft}.vf-d{animation-name:vfd}.vf-z{animation-name:vfz}.vf-a{animation-name:vfa}.vf-cap p:nth-child(1){animation-name:vfc1}.vf-cap p:nth-child(2){animation-name:vfc2}.vf-cap p:nth-child(3){animation-name:vfc3}.vf-n{animation-name:vfn}.vf-g{animation-name:vfgx;animation-timing-function:linear}@media (max-width:859px){.vf-g{animation-name:vfgy}}.vf-c:nth-child(1) .vf-n{animation-delay:0s}.vf-c:nth-child(1) .vf-p{animation-name:vfp0}.vf-c:nth-child(1) .vf-k{animation-name:vfk0}.vf-q i:nth-child(1)::after{animation-name:vfk0;animation-delay:.45s}.vf-c:nth-child(2) .vf-n{animation-delay:0.07s}.vf-c:nth-child(2) .vf-p{animation-name:vfp1}.vf-c:nth-child(2) .vf-k{animation-name:vfk1}.vf-q i:nth-child(2)::after{animation-name:vfk1;animation-delay:.45s}.vf-c:nth-child(3) .vf-n{animation-delay:0.14s}.vf-c:nth-child(3) .vf-p{animation-name:vfp2}.vf-c:nth-child(3) .vf-k{animation-name:vfk2}.vf-q i:nth-child(3)::after{animation-name:vfk2;animation-delay:.45s}.vf-c:nth-child(4) .vf-n{animation-delay:0.21s}.vf-c:nth-child(4) .vf-p{animation-name:vfp3}.vf-c:nth-child(4) .vf-k{animation-name:vfk3}.vf-q i:nth-child(4)::after{animation-name:vfk3;animation-delay:.45s}.vf-c:nth-child(5) .vf-n{animation-delay:0.28s}.vf-c:nth-child(5) .vf-p{animation-name:vfp4}.vf-c:nth-child(5) .vf-k{animation-name:vfk4}.vf-q i:nth-child(5)::after{animation-name:vfk4;animation-delay:.45s}.vf-c:nth-child(6) .vf-n{animation-delay:0.35s}.vf-c:nth-child(6) .vf-p{animation-name:vfp5}.vf-c:nth-child(6) .vf-k{animation-name:vfk5}.vf-q i:nth-child(6)::after{animation-name:vfk5;animation-delay:.45s}.vf-c:nth-child(7) .vf-n{animation-delay:0.42s}.vf-c:nth-child(7) .vf-p{animation-name:vfp6}.vf-c:nth-child(7) .vf-k{animation-name:vfk6}.vf-q i:nth-child(7)::after{animation-name:vfk6;animation-delay:.45s}.vf-c:nth-child(8) .vf-n{animation-delay:0.49s}.vf-c:nth-child(8) .vf-p{animation-name:vfp7}.vf-c:nth-child(8) .vf-k{animation-name:vfk7}.vf-q i:nth-child(8)::after{animation-name:vfk7;animation-delay:.45s}.vf-c:nth-child(9) .vf-n{animation-delay:0.56s}.vf-c:nth-child(9) .vf-p{animation-name:vfp8}.vf-c:nth-child(9) .vf-k{animation-name:vfk8}.vf-q i:nth-child(9)::after{animation-name:vfk8;animation-delay:.45s}}
.vf-c:nth-child(2){--ax:var(--vx);--ay:var(--vy);--bx:var(--fx);--by:var(--fy);--pc:var(--vs)}
.vf-c:nth-child(3){--ax:var(--vx);--ay:var(--vy);--bx:var(--fx);--by:var(--fy);--pc:var(--vs)}
.vf-c:nth-child(5){--ax:var(--vx);--ay:var(--vy);--bx:var(--fx);--by:var(--fy);--pc:var(--vs)}
.vf-c:nth-child(6){--ax:var(--vx);--ay:var(--vy);--bx:var(--fx);--by:var(--fy);--pc:var(--vs)}
.vf-c:nth-child(8){--ax:var(--vx);--ay:var(--vy);--bx:var(--fx);--by:var(--fy);--pc:var(--vs)}
