/* Ordyse: Das Band. Darstellung und die eine Bewegung beim Erscheinen. */
.ob{position:relative;margin:0;--ob-ink:#121826;--ob-ink2:#3f4663;--ob-line:rgba(18,24,38,.3);--ob-knot:#c27c0e;--ob-bg:#fff;--ob-ok:#008781}
.ob-dunkel{--ob-ink:#fff;--ob-ink2:#d5daf8;--ob-line:rgba(213,218,248,.38);--ob-knot:#f2b544;--ob-bg:#0d1446;--ob-ok:#2a9f9a}
.ob-svg{display:block;width:100%;height:100%;overflow:visible}

/* Marken: Punkt auf der Bandkante, Knoten für festhängendes Geld, Haken für erledigt */
.ob-punkt,.ob-knoten,.ob-haken{position:absolute;z-index:2;transform:translate(-50%,-50%);pointer-events:none}
.ob-punkt{width:0.375rem;height:0.375rem;border-radius:50%;background:var(--ob-ink);box-shadow:0 0 0 2px var(--ob-bg)}
.ob-knoten{width:1.125rem;height:1.125rem;box-sizing:border-box;border-radius:50%;background:var(--ob-bg);border:0.25rem solid var(--ob-knot)}
.ob-knoten::after{content:"";position:absolute;inset:-0.625rem;border-radius:50%;border:0.375rem solid var(--ob-knot);opacity:.2}
.ob-haken{width:1.625rem;height:1.625rem;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--ob-ok);box-shadow:0 1px 2px rgba(5,10,40,.18)}
.ob-haken svg{width:0.8125rem;height:0.8125rem}

/* Direkte Beschriftung: Haarlinie vom Punkt zur Zahl, Längen im Raster 40 oder 80 */
.ob-text{position:absolute;z-index:2;display:flex;flex-direction:column;gap:2px;white-space:nowrap;--l:2.5rem;border-left:1px solid var(--ob-line);padding-left:0.75rem}
.ob-text b{font-weight:600;font-size:1.5rem;line-height:1.15;letter-spacing:-.02em;color:var(--ob-ink);font-variant-numeric:tabular-nums}
.ob-text span{font-size:0.9375rem;line-height:1.4;color:var(--ob-ink2)}
.ob-text.l80{--l:5rem}
.ob-oben{transform:translateY(-100%);padding-bottom:var(--l)}
.ob-unten{padding-top:var(--l)}
.ob-text.ob-rechts{border-left:0;border-right:1px solid var(--ob-line);padding-left:0;padding-right:0.75rem;align-items:flex-end;text-align:right}
.ob-oben.ob-rechts{transform:translate(-100%,-100%)}
.ob-unten.ob-rechts{transform:translateX(-100%)}

/* Bewegung: das Band zeichnet sich einmal in Flussrichtung, Beschriftungen folgen, wenn das Band sie erreicht */
.ob-warte .ob-svg{clip-path:inset(0 100% 0 0)}
.ob-senk.ob-warte .ob-svg{clip-path:inset(0 0 100% 0)}
.ob-an .ob-svg{clip-path:inset(0 0 0 0);transition:clip-path 1100ms cubic-bezier(.65,0,.35,1) 150ms}
.ob-warte .ob-punkt,.ob-warte .ob-haken,.ob-warte .ob-knoten{scale:0}
.ob-an .ob-punkt,.ob-an .ob-haken,.ob-an .ob-knoten{scale:1;transition:scale 320ms cubic-bezier(.34,1.56,.64,1) calc(150ms + var(--ob-t,0) * 1100ms)}
.ob-warte .ob-text{opacity:0;translate:0 0.375rem}
.ob-an .ob-text{opacity:1;translate:0 0;transition:opacity 360ms ease-out,translate 360ms cubic-bezier(.2,0,0,1);transition-delay:calc(270ms + var(--ob-t,0) * 1100ms)}
.ob-an .ob-knoten::after{animation:ob-halo 1200ms ease-out calc(470ms + var(--ob-t,0) * 1100ms) 2}
@keyframes ob-halo{0%{opacity:.4;transform:scale(1)}100%{opacity:0;transform:scale(1.8)}}
@media (prefers-reduced-motion:reduce){.ob-svg,.ob-text,.ob-punkt,.ob-knoten,.ob-haken{transition:none!important;animation:none!important}}

/* Hero: senkrechtes Band, das von oben in die Produktansicht mündet */
.hero-band{position:absolute;z-index:0;top:0;height:11.25rem;pointer-events:none}
.hero .wrap .stage3d{margin-top:8.25rem}
@media (max-width:860px){.hero .wrap .stage3d{margin-top:6.5rem}}
.hero-band[hidden]{display:none}
.hero-band .ob-text b{font-size:1.375rem}

/* So arbeitet Ordyse: ein Band über alle drei Schritte */
.sg-band{height:15rem;margin:5rem 0 0.5rem}
.ob-nur-schmal{display:none}
@media (max-width:860px){
  .sg-band{height:12.5rem;margin:2.25rem 0 0}
  .sg-band .ob-nur-breit{display:none}
  .sg-band .ob-nur-schmal{display:flex}
  .ob-text b{font-size:1.25rem}
  .ob-text span{font-size:0.875rem}
}

/* Prozessanalyse: kein Band (Breite heißt Fälle), sondern eine feine Zeitspur */
.fin-wk{position:relative;border-top:0!important;padding-top:1.875rem!important}
.fin-wk::before,.fin-wk::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;z-index:0}
.fin-wk li::before{z-index:1}
.fin-wk::before{background:rgba(255,255,255,.14)}
.fin-wk::after{background:linear-gradient(90deg,#2e47a9,#3c79f0 55%,#2a9f9a);transform-origin:0 50%;transform:scaleX(var(--fw,1))}
.js .fin-wk:not(.fw-an)::after{--fw:0}
.fin-wk.fw-an::after{transition:transform 1400ms cubic-bezier(.65,0,.35,1)}
.fin-wk li::before{top:-2.1875rem!important;left:0!important;width:0.625rem!important;height:0.625rem!important;background:#0d1446!important;border:2px solid #3c79f0;box-sizing:border-box}
.fin-wk li:last-child::before{background:#2a9f9a!important;border-color:#2a9f9a}
@media (max-width:860px){.fin-wk::before,.fin-wk::after{display:none}.fin-wk{padding-top:0!important}.fin-wk li::before{top:0.375rem!important}}
@media (prefers-reduced-motion:reduce){.fin-wk::after{transition:none!important;--fw:1!important}}

/* ===== Überschriften wie im Portal: General Sans ===== */
@font-face{font-family:"General Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/general-sans-500.woff2) format("woff2")}
@font-face{font-family:"General Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/general-sans-600.woff2) format("woff2")}
body h1,body h2,body h3,body .h2,body .ob-text b{font-family:"General Sans","IBM Plex Sans","Helvetica Neue",Arial,sans-serif;font-weight:600}
body h1{letter-spacing:-.022em}
body h2,body .h2{letter-spacing:-.022em}

/* ===== Knöpfe: Amber ist dem Knoten vorbehalten (dort hängt Geld) ===== */
.btn.btn-amber{background:var(--carbon,#26338F);color:#fff!important}
.btn.btn-amber:hover{background:#1d2876;color:#fff!important}
.hero .btn.btn-amber,.nav .btn.btn-amber,.msheet .btn.btn-amber,.final .btn.btn-amber,.top .btn.btn-amber,.cta .btn.btn-amber,.pl .btn.btn-amber{background:#fff;color:#0D1446!important}
.hero .btn.btn-amber:hover,.nav .btn.btn-amber:hover,.msheet .btn.btn-amber:hover,.final .btn.btn-amber:hover,.top .btn.btn-amber:hover,.cta .btn.btn-amber:hover{background:#E6E9FB;color:#0D1446!important}
.htrust svg{color:var(--periw,#8C98F0)!important}

/* ===== Hero: Text links, Produkt rechts, das Band mündet in die Karte ===== */
.hero .wrap.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,33.75rem);column-gap:4rem;align-items:center;padding-block:3.5rem 2.25rem}
.hero .hero-grid .hero-text{position:relative;z-index:2;min-width:0}
.hero .hero-grid h1{font-size:clamp(2.5rem,4.2vw,3.875rem);line-height:1.03;max-width:12.5em;margin-top:0;text-wrap:balance}
.hero .hero-grid .sub{max-width:36em}
/* Hero-Ansicht: ein Auftrag wird vor den Augen geklärt (einmal, ohne Bedienelemente) */
.hx{position:relative;z-index:3;color:#121826;min-width:0}
.hx-frame{border-radius:1.125rem;overflow:hidden;background:#fff;box-shadow:0 2px 0.25rem rgba(5,10,40,.2),0 2.75rem 5.625rem -2.125rem rgba(5,10,40,.8),0 0 0 1px rgba(255,255,255,.08)}
.hx-chrome{display:flex;align-items:center;gap:0.4375rem;height:2rem;padding:0 0.875rem;background:#F4F5F9;border-bottom:1px solid #E2E5EC}
.hx-chrome i{width:0.625rem;height:0.625rem;border-radius:50%;background:#CDD2DC}
.hx-chrome span{margin-left:0.625rem;font-size:0.7812rem;color:#5d6383}
.hx-win{display:grid;grid-template-columns:2.75rem minmax(0,1fr);background:#F5F6FA}
.hx-nav{background:#0D1446;display:flex;flex-direction:column;align-items:center;gap:1rem;padding-top:0.875rem}
.hx-nav i{width:1.125rem;height:0.1875rem;border-radius:2px;background:rgba(213,218,248,.35)}
.hx-nav i.on{background:#fff}
.hx-body{padding:1rem 1.125rem 1.125rem;display:grid;gap:0.75rem;min-width:0}
.hx-top{display:flex;justify-content:space-between;align-items:flex-start;gap:0.75rem}
.hx-crumb{margin:0 0 0.25rem;display:flex;align-items:center;gap:0.4375rem;font-size:0.8125rem;font-weight:600;color:#3f4663}
.hx-ico{width:1rem;height:1rem;border-radius:0.3125rem;background:#3a4cd0}
.hx-top h3{margin:0;font-size:1.1875rem;line-height:1.2}
.hx-sub{margin:2px 0 0;font-size:0.8125rem;color:#5d6383}
.hx-stat{display:grid;justify-items:end;gap:0.3125rem}
.hx-stat b{font-family:"General Sans",sans-serif;font-size:1.3125rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.hx-st{font-size:0.7812rem;font-weight:600;padding:2px 0.5625rem;border-radius:6.1875rem}
.hx-st.w{color:#8a5a00;background:#fbf1dc}
.hx-st.ok{display:none;color:#00695f;background:#dcf2ee}
.hx-feed{list-style:none;margin:0;padding:0;display:grid;gap:0.5rem;position:relative}
.hx-feed::before{content:"";position:absolute;left:0.3125rem;top:0.625rem;bottom:0.875rem;width:2px;border-radius:1px;background:linear-gradient(180deg,#1b2f8f,#245fd4 60%,#008781);opacity:.3}
.hx-s{display:grid;grid-template-columns:0.75rem minmax(0,1fr);gap:0.75rem;position:relative}
.hx-s>div{background:#fff;border-radius:0.75rem;box-shadow:0 0 0 1px #E4E7EE;padding:0.625rem 0.75rem;display:grid;gap:0.3125rem;min-width:0}
.hx-s p{margin:0;font-size:0.875rem;line-height:1.4}
.hx-k{font-size:0.7812rem!important;font-weight:600;color:#5d6383;display:flex;justify-content:space-between}
.hx-k time{font-weight:400}
.hx-dot{width:0.75rem;height:0.75rem;box-sizing:border-box;border-radius:50%;margin-top:0.75rem;background:#fff;border:0.1875rem solid #245fd4}
.hx-dot.w{border-color:#c27c0e;box-shadow:0 0 0 0.25rem rgba(194,124,14,.16)}
.hx-dot.ok{border-color:#008781;background:#008781}
.hx-cmp{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;font-size:0.8438rem;color:#3f4663}
.hx-cmp b{color:#121826;font-variant-numeric:tabular-nums}
.hx-cmp em{font-style:normal;font-size:0.7812rem;font-weight:600;color:#8a5a00;background:#fbf1dc;border-radius:6.1875rem;padding:1px 0.5rem}
.hx-mut{font-size:0.7812rem!important;color:#5d6383}
.hx-draft{font-size:0.8125rem!important;color:#3f4663;background:#F7F8FC;border-radius:0.5rem;padding:0.4375rem 0.5625rem}
.hx-btn{justify-self:start;display:inline-grid;margin-top:2px;min-height:2.125rem;align-items:center;padding:0 0.8125rem;border-radius:0.5625rem;background:#26338F;color:#fff;font-size:0.8438rem;font-weight:600;transition:background .3s ease}
.hx-btn .b{display:none}
.hx-replay{all:unset;cursor:pointer;position:absolute;right:0.875rem;top:2px;font-size:0.8438rem;color:#4a5490;text-decoration:underline;text-underline-offset:0.1875rem;min-height:1.75rem}
.hx-replay[hidden]{display:none!important}
.hx-replay:focus-visible{outline:2px solid #2b39b5;outline-offset:0.1875rem;border-radius:0.25rem}
/* Ablauf: Endzustand ist der Normalzustand; das Skript spielt ihn einmal ab */
.hx.spielt .hx-s{opacity:0;transform:translateY(0.5rem)}
.hx.spielt .hx-s.da{opacity:1;transform:none;transition:opacity .45s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.hx.gesendet .hx-btn{background:#e6e9f2;color:#3f4663}
.hx.gesendet .hx-btn .a{display:none}
.hx.gesendet .hx-btn .b{display:inline}
.hx.geklaert .hx-st.w{display:none}
.hx.geklaert .hx-st.ok{display:inline}
.hx:not(.spielt) .hx-btn{background:#e6e9f2;color:#3f4663}
.hx:not(.spielt) .hx-btn .a{display:none}
.hx:not(.spielt) .hx-btn .b{display:inline}
.hx:not(.spielt) .hx-st.w{display:none}
.hx:not(.spielt) .hx-st.ok{display:inline}
.hx.spielt:not(.geklaert) .hx-st.ok{display:none}
.hero .ob-knoten{transition:border-color .5s ease,background .5s ease}
.hero.geklaert .hero-band .ob-knoten,.hero.geklaert .hero-band-m .ob-knoten{border-color:#fff;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23008781' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E") center/0.75rem no-repeat;width:1.5rem;height:1.5rem}
.hero.geklaert .hero-band .ob-knoten::after{border-color:#2a9f9a}
/* Vertrauen direkt unter den Knöpfen, damit es über dem Falz steht */
.hero .hero-text .htrust{display:flex;flex-wrap:wrap;gap:0.5rem 1.375rem;margin-top:1.625rem;font-size:0.9062rem}
.hero .hero-text .htrust svg{width:1rem;height:1rem}
.hero .hero-band{position:absolute;z-index:1;height:8.75rem;top:0;left:0}
.hero .hero-band-m{display:none}
.hero .hero-band .ob-text b{font-size:1.625rem}
.hero .hero-band .ob-text span{font-size:1rem}
@media (max-width:1099px){
  .hero .wrap.hero-grid{grid-template-columns:minmax(0,1fr);padding-block:3.5rem 2rem}
  .hero .hero-grid h1{font-size:clamp(2.25rem,8.6vw,3.5rem)}
  .hero .hero-band{display:none!important}
  .hero .hero-band-m{display:block;height:6rem;margin:1.75rem calc(-1 * max(1rem, env(safe-area-inset-left,0px))) 4.375rem}
  .hx{margin-top:0;order:3}
  .hero .hero-text{order:1}
  .hero .hero-band-m{order:2}

}
@media (max-width:560px){
  .hx-win{grid-template-columns:minmax(0,1fr)}
  .hx-nav{display:none}
  .hx-body{padding:0.875rem}
  .hx-mut,.hx-draft{display:none}
  .hx-replay{position:static;display:block;margin-top:0.75rem;color:#D5DAF8}
}

/* ===== Text wie im Portal: Inter ===== */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/inter4-latin.woff2) format("woff2");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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/inter4-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
html:root{--font:"Inter","Helvetica Neue",Arial,sans-serif}
body{font-optical-sizing:auto}
body h1,body h2,body h3,body .h2,body .ob-text b{font-family:"General Sans","Inter","Helvetica Neue",Arial,sans-serif}

/* ===== Das Band zieht sich durch die Seite ===== */
/* So arbeitet Ordyse: die Schritte hängen an einem senkrechten Band */
.dd-bar{width:0.375rem!important;left:1.0625rem!important;border-radius:0.1875rem!important;background:#E6E9F2!important}
.dd-bar::after{background:linear-gradient(180deg,#1b2f8f,#245fd4 60%,#008781)!important;border-radius:0.1875rem}
.dd-step.on .dd-n{background:linear-gradient(135deg,#1b2f8f,#245fd4)!important}
/* Wo Geld festhängt: an der aktiven App sitzt der Knoten */
.fx-bl button{position:relative}
.fx-bl.on .fx-bv::before{content:"";display:inline-block;width:0.625rem;height:0.625rem;box-sizing:border-box;border-radius:50%;border:0.1875rem solid #c27c0e;margin-right:0.5rem;vertical-align:1px;box-shadow:0 0 0 0.25rem rgba(194,124,14,.16)}
/* Was in Ordyse steckt: der Weg des Vorgangs ist ein Band, der Knoten sitzt an der Preissperre */
.xr-path::before{height:.9cqw!important;top:.6cqw!important;background:linear-gradient(90deg,#1b2f8f,#245fd4 55%,#c9cedc 68%)!important}
.xr-path li.stop::before{background:#fff!important;box-shadow:inset 0 0 0 .55cqw #c27c0e,0 0 0 .7cqw rgba(194,124,14,.18)!important}
.xr-path li.stop b{color:#8a5a00!important}
/* Fluss-Linie wie im Portal auf den Hauptflächen */
.vg-hl{overflow:hidden}
/* Fluss-Linie oben: als volle Fläche mit geerbter Rundung, nur die obersten 4 px gefärbt. So folgt sie den runden Ecken. */
.vg-hl::before,.pc.on::before,.pz2-calc::before,.bd-win::before,.trust .tr::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#1b2f8f,#245fd4 55%,#008781) top/100% 0.25rem no-repeat;z-index:2}
.pc{position:relative;overflow:hidden}
.pz2-calc,.bd-win,.trust .tr{position:relative}
.final::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#2e47a9,#3c79f0 55%,#2a9f9a) top/100% 0.25rem no-repeat}

/* Inter mit normalen Ziffern im Fließtext, Tabellenziffern nur dort, wo Zahlen untereinander stehen */
html body{font-feature-settings:"cv05" 1}

.hx-head>b{white-space:nowrap}
.hero .nachher{display:none}
.hero.geklaert .nachher{display:inline}
.hero.geklaert .vorher{display:none}

/* Kein weißer Schleier am Ende des Heros: das Band läuft sauber auf dunklem Grund */
.hero .hero-fade{display:none}
.hero .wrap.hero-grid{padding-bottom:8.25rem}
@media (max-width:1099px){.hero .wrap.hero-grid{padding-bottom:2.5rem}}

/* ===== Kapitel: jedes Abschnittslabel trägt ein kleines Band ===== */
.eyebrow{display:inline-flex;align-items:center;gap:0.625rem}
.eyebrow::before{content:"";flex:none;width:1.75rem;height:0.5rem;border-radius:0.25rem;background:linear-gradient(90deg,#1b2f8f,#245fd4 60%,#008781);
  -webkit-mask:linear-gradient(90deg,#000 0 30%,rgba(0,0,0,.55) 30% 58%,#000 58%);mask:radial-gradient(circle at 44% 50%,#000 0.1562rem,transparent 0.1875rem),linear-gradient(#000,#000);}
.ax .eyebrow::before,.hero .eyebrow::before{background:linear-gradient(90deg,#2e47a9,#3c79f0 60%,#2a9f9a)}

/* ===== Wo Geld festhängt: alle Beträge als ein Band, die gezeigte App trägt den Knoten ===== */
.fx-geld{display:grid;gap:0.625rem;margin-bottom:0.375rem}
.fx-geld p{margin:0;font-size:0.9375rem;color:var(--ink-2)}
.fx-geld p b{font-family:"General Sans",sans-serif;font-size:1.375rem;color:var(--ink);letter-spacing:-.02em;margin-right:0.25rem}
.fx-geld-band{display:flex;gap:0.1875rem;height:0.875rem}
.fx-geld-band i{position:relative;flex:0 0 var(--w);border-radius:0.4375rem;background:linear-gradient(90deg,#1b2f8f,#245fd4);opacity:.32;transition:opacity .3s ease}
.fx-geld-band i:nth-child(n+3){background:linear-gradient(90deg,#245fd4,#008781)}
.fx-geld-band i.on{opacity:1}
.fx-geld-band i.on::after{content:"";position:absolute;left:50%;top:50%;width:0.875rem;height:0.875rem;box-sizing:border-box;border-radius:50%;transform:translate(-50%,-50%);background:#fff;border:0.2188rem solid #c27c0e;box-shadow:0 0 0 0.25rem rgba(194,124,14,.18)}
@media (max-width:980px){.fx-geld{display:none}}

/* ===== Abschluss: das Band kommt geklärt an ===== */
@media (min-width:861px){
.fin-wk::after{height:0.25rem!important;top:-1px!important}
.fin-wk li:last-child::before{width:1.125rem!important;height:1.125rem!important;top:-2.4375rem!important;left:-0.25rem!important;border:0!important;background:#2a9f9a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E") center/0.6875rem no-repeat!important}
}

/* ===== Bedienung: immer nur der aktuelle Schritt im Bild, die anderen treten zurück ===== */
.bd-win .bd-main>.bd-s:not(.on){opacity:0!important;transform:translateY(1.4cqw)!important;pointer-events:none}
.bd-win:not([data-s="2"]) .bd-tipped{box-shadow:none!important}

/* ===== Funktionsseite ===== */
.intro{position:relative;overflow:hidden}
.intro .wrap{padding-bottom:2.5rem!important}
.intro .f-band{height:5.625rem;margin:0 0 -0.5rem}
.kick{display:inline-flex;align-items:center;gap:0.625rem}
.kick::before{content:"";flex:none;width:1.75rem;height:0.5rem;border-radius:0.25rem;background:linear-gradient(90deg,#1b2f8f,#245fd4 60%,#008781)}
.lg section{border-top:0!important;position:relative;padding-top:1.25rem!important}
.lg section::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#1b2f8f,#245fd4 55%,#008781) top/100% 0.25rem no-repeat}
.shot{position:relative}
.shot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;background:linear-gradient(90deg,#1b2f8f,#245fd4 55%,#008781) top/100% 0.1875rem no-repeat}
.top nav a[aria-current]{box-shadow:inset 0 -2px 0 #8C98F0!important}

/* ===== Feinschliff nach Sichtprüfung (22.10.) ===== */
.fin-wk li{align-content:start}
.final li svg{flex:none}
.vg-hl{overflow:visible!important}
.vg-hl::before{inset:-2px!important;border-radius:1.25rem!important}
/* Zeitlinie der Hero-Geschichte wächst mit den Schritten, statt leer vorauszulaufen */
.hx-feed::before{transform-origin:50% 0;transform:scaleY(var(--hxp,1));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
/* Geld-Band: schmale Abschnitte bleiben breit genug für die Markierung */
.fx-geld-band i{flex:0 1 var(--w)!important;min-width:1.25rem}
@media (max-width:760px){
  .pa-row .pa{white-space:normal;line-height:1.15;padding-block:0.375rem;font-size:0.8438rem;gap:0.4375rem;hyphens:auto;-webkit-hyphens:auto}
  .dd-pin{overflow:clip;overflow-clip-margin:4rem}
  .dd-mob{border-radius:0 0 1.625rem 1.625rem!important}
}

/* ===== Gründer im Abschluss: ein Gesicht und ein direkter Weg ===== */
.gruender{display:flex;gap:1.125rem;align-items:flex-start;margin:2.125rem 0 0;padding-top:1.625rem;border-top:1px solid rgba(255,255,255,.14);max-width:35rem}
.gruender img{flex:none;width:5.5rem;height:5.5rem;border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 0 0 0.1875rem rgba(255,255,255,.12)}
.gruender figcaption{display:grid;gap:0.1875rem;min-width:0}
.gruender blockquote{margin:0 0 0.5rem;font-size:1.125rem;line-height:1.4;color:#fff;font-weight:500}
.gruender b{font-size:1rem;color:#fff;font-weight:600}
.gruender span{font-size:0.9375rem;color:#C9CEF2}
.gruender a{font-size:0.9375rem;color:#fff;text-decoration:underline;text-underline-offset:0.1875rem;width:max-content;margin-top:0.25rem;user-select:all}
@media (max-width:560px){.gruender{gap:0.875rem}.gruender img{width:4rem;height:4rem}.gruender blockquote{font-size:1.0312rem}}
@media (max-width:640px){
  #kontakt{padding-bottom:6rem}
  .hero .ctas{display:grid;grid-template-columns:1fr;gap:0.625rem}
  .hero .ctas .btn{width:100%;justify-content:center}
}

/* ===== Abschluss: Kopf, Gründer und die vier Wochen als Band, das beim Scrollen wächst ===== */
.final{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important;align-items:start!important;row-gap:2.75rem!important}
.final .fin-kopf{min-width:0}
.final .gruender{margin:0;padding:1.5rem;border:1px solid rgba(255,255,255,.12);border-top:1px solid rgba(255,255,255,.12);border-radius:1.25rem;background:rgba(255,255,255,.05);align-self:end;max-width:none}
.vw{grid-column:1/-1;position:relative;padding-top:1.875rem;border-top:1px solid rgba(255,255,255,.12);--p:0}
.vw-h{font-size:0.9375rem!important;font-weight:600;letter-spacing:0!important;color:#C9CEF2;font-family:Inter,"Helvetica Neue",Arial,sans-serif!important;margin:0 0 1.375rem}
.vw-bahn{position:relative}
.vw-spur{position:absolute;left:0.6875rem;width:calc(75% + 1.125rem);top:0.1875rem;height:1.5rem;pointer-events:none}
.vw-band{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.vw-hoch{display:none}
.vw-leer{fill:rgba(255,255,255,.12)}
.vw-voll{-webkit-mask:linear-gradient(90deg,#000 calc(var(--p) * 100%),transparent calc(var(--p) * 100% + 1.5%));mask:linear-gradient(90deg,#000 calc(var(--p) * 100%),transparent calc(var(--p) * 100% + 1.5%))}
.vw-quer .vw-voll{mask-size:100% 100%}
.vw-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;position:relative}
.final .vw-s{display:grid;gap:0.375rem;align-content:start;padding-top:2.875rem;position:relative;opacity:.55;transition:opacity .4s ease}
.final .vw-s.da{opacity:1}
.vw-dot{position:absolute;left:0;top:0.25rem;width:1.375rem;height:1.375rem;box-sizing:border-box;border-radius:50%;background:#0d1446;border:0.1875rem solid rgba(255,255,255,.28);display:grid;place-items:center;color:#fff;transition:border-color .35s ease,background .35s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
.vw-dot svg{opacity:0;transition:opacity .3s ease}
.vw-s.da .vw-dot{border-color:#3c79f0}
.vw-ziel.da .vw-dot{background:#2a9f9a;border-color:#2a9f9a;transform:scale(1.15)}
.vw-ziel.da .vw-dot svg{opacity:1}
.vw-w{font-size:0.875rem;font-weight:600;color:#C9CEF2}
.vw-s b{font-size:1.0625rem;line-height:1.3;font-weight:600;color:#fff}
.vw-t{font-size:0.9375rem;line-height:1.45;color:#C9CEF2}
@media (max-width:860px){
  .final{grid-template-columns:1fr!important;row-gap:2rem!important}
  .final .gruender{padding:1.25rem}
  .vw{padding-top:1.625rem}
  .vw-spur{left:-1px;top:0.6875rem;width:1.5rem;height:var(--vw-ende,100%)}
  .vw-quer{display:none}
  .vw-hoch{display:block}
  .vw-hoch .vw-voll{-webkit-mask:linear-gradient(180deg,#000 calc(var(--p) * 100%),transparent calc(var(--p) * 100% + 2%));mask:linear-gradient(180deg,#000 calc(var(--p) * 100%),transparent calc(var(--p) * 100% + 2%))}
  .vw-list{grid-template-columns:1fr;gap:1.625rem}
  .final .vw-s{padding:0 0 0 2.75rem;min-height:2.75rem}
  .vw-dot{top:0}
}
@media (prefers-reduced-motion:reduce){.vw{--p:1!important}.vw-s{opacity:1}}

/* ===== Feinschliff Abstände und Bedienflächen (Prüfung 22.10.) ===== */
@media (max-width:640px){
  .final .contact{display:grid;gap:0.625rem}
  .final .contact .btn{width:100%}
}
@media (max-width:560px){
  .final{padding:2rem 1.25rem!important}
  .final .gruender{padding:1rem;flex-direction:column;gap:0.75rem}
  .final .gruender img{width:3.5rem;height:3.5rem}
}
.hx-replay{min-height:2.75rem!important;display:inline-flex!important;align-items:center}
.hx-replay[hidden]{display:none!important}
.tr h3{margin-bottom:0.75rem}
/* Verweise ohne altmodischen Unterstrich: alleinstehend mit Pfeil, Aktionen mit Symbol */
.tk-all{text-decoration:none!important;gap:0.375rem}
.tk-all::after{content:"";width:1rem;height:1rem;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .18s ease}
.tk-all:hover::after{transform:translateX(0.1875rem)}
.hx-replay{text-decoration:none!important;font-weight:600;gap:0.375rem}
.hx-replay::before{content:"";width:0.9375rem;height:0.9375rem;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E") center/contain no-repeat}
.hx-replay:hover{color:#1b2580}
.ap-alt button{text-decoration:none!important}
.ap-alt button:hover{text-decoration:underline!important;text-underline-offset:0.25rem}

/* Pilotprogramm */
.pl-card{position:relative;overflow:hidden;border-radius:1.5rem;background:var(--navy);color:#fff;padding:3.5rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}
.pl-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#2e47a9,#3c79f0 55%,#2a9f9a) top/100% 0.25rem no-repeat;pointer-events:none}
.pl-k{font-size:0.9375rem;font-weight:600;color:#9FDCD6;margin:0 0 0.75rem}
.pl-h{font-family:"General Sans",Inter,sans-serif;font-weight:600;font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.1;letter-spacing:-.02em;margin:0;text-wrap:balance}
.pl-t{margin:1rem 0 0;font-size:1.0625rem;line-height:1.6;color:var(--on-navy);max-width:32.5rem}
.pl-preis{margin-top:1.75rem;display:grid;gap:0.25rem;padding:1.25rem 1.375rem;border-radius:1rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);width:fit-content;max-width:100%}
.pl-pk{font-size:0.9375rem;color:var(--on-navy)}
.pl-pz{font-family:"General Sans",Inter,sans-serif;font-weight:600;font-size:2.5rem;letter-spacing:-.02em;line-height:1.1}
.pl-pa{font-size:0.9375rem;color:var(--on-navy)}
.pl-cta{margin-top:1.75rem;display:flex;flex-wrap:wrap;align-items:center;gap:0.75rem 1.125rem}
.pl-cta span{font-size:0.9375rem;color:var(--on-navy-2)}
.pl-spalten{display:grid;gap:1.25rem;align-content:start}
.pl-sp{border-radius:1.125rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:1.625rem 1.75rem}
.pl-sp h3{font-size:1.125rem;margin:0 0 0.875rem;color:#fff}
.pl-sp ul{list-style:none;margin:0;padding:0;display:grid;gap:0.75rem}
.pl-sp li{position:relative;padding-left:1.875rem;font-size:1rem;line-height:1.5;color:var(--on-navy)}
.pl-sp li::before{content:"";position:absolute;left:0;top:0.1875rem;width:1.125rem;height:1.125rem;border-radius:50%;background:#2a9f9a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/0.75rem no-repeat}
.pl-sp:last-child li::before{background:rgba(255,255,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E") center/0.6875rem no-repeat}
@media (max-width:900px){.pl-card{grid-template-columns:1fr;gap:2rem;padding:2.25rem 1.5rem}}
@media (max-width:640px){.pl-card{padding:2rem 1.25rem;border-radius:1.25rem}.pl-cta .btn{width:100%;justify-content:center}.pl-cta span{width:100%;text-align:center}.pl-preis{width:100%}.pl-sp{padding:1.375rem 1.25rem}}

/* Fragen der Finanzleitung */
.fq-grid{display:grid;grid-template-columns:minmax(0,21.25rem) minmax(0,1fr);gap:3.5rem;align-items:start}
.fq-kopf{position:sticky;top:6rem}
.fq-t{margin:1rem 0 0;font-size:1rem;line-height:1.55;color:var(--ink-2)}
.fq-liste{border-top:1px solid var(--line)}
.fq-liste details{border-bottom:1px solid var(--line)}
.fq-liste summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:2.75rem;padding:1.25rem 0;font-size:1.125rem;font-weight:600;color:var(--ink)}
.fq-liste summary::-webkit-details-marker{display:none}
.fq-liste summary::after{content:"";flex:none;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--carbon-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2326338F' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/0.875rem no-repeat;transition:transform .2s ease}
.fq-liste details[open] summary::after{transform:rotate(45deg)}
.fq-liste summary:focus-visible{outline:2px solid var(--carbon);outline-offset:0.25rem;border-radius:0.375rem}
.fq-liste p{margin:0;padding:0 2.75rem 1.375rem 0;font-size:1rem;line-height:1.6;color:var(--ink-2);max-width:68ch}
.fq-liste p a{color:var(--carbon);font-weight:600;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:0.1875rem}
@media (max-width:900px){.fq-grid{grid-template-columns:1fr;gap:1.5rem}.fq-kopf{position:static}.fq-liste p{padding-right:0}.fq-liste summary{font-size:1.0625rem}}
@media (prefers-reduced-motion:reduce){.fq-liste summary::after{transition:none}}
@media (min-width:901px){.fq-grid{grid-template-columns:minmax(0,23.75rem) minmax(0,1fr)}}
.fq .fq-kopf h2.h2{font-size:clamp(1.75rem,2.5vw,2.25rem)!important;line-height:1.12;text-wrap:balance;hyphens:auto}
.pl .pl-cta .btn.btn-amber:hover{background:#E9ECFB}

/* Unterlagen zum Herunterladen */
.ul{margin-top:1.5rem;border-radius:1.125rem;background:var(--mist);padding:1.75rem;display:grid;grid-template-columns:minmax(0,18.75rem) minmax(0,1fr);gap:2rem}
.ul-kopf h3{font-size:1.25rem;margin:0}
.ul-kopf p{margin:0.625rem 0 0;font-size:0.9375rem;line-height:1.55;color:var(--ink-2)}
.ul-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ul-r{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.875rem 0;border-bottom:1px solid var(--line)}
.ul-tx{display:grid;gap:2px;min-width:0}
.ul-tx b{font-size:1rem;color:var(--ink)}
.ul-tx span{font-size:0.875rem;color:var(--ink-3)}
.ul-ac{display:flex;gap:0.5rem;flex:none}
.ul-dl{display:inline-flex;align-items:center;gap:0.375rem;min-height:2.5rem;padding:0 0.875rem;border-radius:0.625rem;background:#fff;border:1px solid var(--line);color:var(--carbon);font-size:0.875rem;font-weight:600;text-decoration:none!important;transition:border-color .15s ease,background .15s ease}
.ul-dl::before{content:"";width:1rem;height:1rem;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11m0 0-4-4m4 4 4-4M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11m0 0-4-4m4 4 4-4M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat}
.ul-dl:hover{border-color:var(--carbon);background:var(--carbon-soft)}
.ul-dl:focus-visible{outline:2px solid var(--carbon);outline-offset:2px}
@media (max-width:900px){.ul{grid-template-columns:1fr;gap:1rem;padding:1.375rem 1.25rem}}
@media (max-width:520px){.ul-r{flex-direction:column;align-items:flex-start;gap:0.625rem}.ul-ac .ul-dl{min-height:2.75rem}}
.ul-ac{display:grid;grid-template-columns:repeat(2,5.5rem)}
.ul-ac .ul-dl{justify-content:center}
@media (max-width:520px){.ul-ac{grid-template-columns:repeat(2,minmax(0,6.5rem))}}
.ul-hin{margin-top:1rem;display:grid;grid-template-columns:2.875rem minmax(0,1fr) auto;gap:1.125rem;align-items:center;padding:1.375rem 1.75rem;border-radius:1.125rem;background:var(--mist);color:var(--ink);text-decoration:none!important;transition:background .15s ease,box-shadow .15s ease}
.ul-hin:hover{background:var(--carbon-soft);box-shadow:inset 0 0 0 1px #c9cef2}
.ul-hin-ic{width:2.875rem;height:2.875rem;border-radius:0.75rem;background:#fff;display:grid;place-items:center;color:var(--carbon)}
.ul-hin-tx{display:grid;gap:0.25rem;min-width:0}
.ul-hin-tx b{font-size:1.125rem}
.ul-hin-tx span{font-size:0.9375rem;line-height:1.5;color:var(--ink-2)}
.ul-hin-go{display:inline-flex;align-items:center;gap:0.375rem;font-size:0.9375rem;font-weight:600;color:var(--carbon);white-space:nowrap}
.ul-hin-go::after{content:"";width:1rem;height:1rem;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .18s ease}
.ul-hin:hover .ul-hin-go::after{transform:translateX(0.1875rem)}
.ul-hin:focus-visible{outline:0.1875rem solid var(--amber);outline-offset:0.1875rem}
@media (max-width:640px){.ul-hin{grid-template-columns:2.875rem minmax(0,1fr);padding:1.25rem}.ul-hin-go{grid-column:2}}
.tk-all{display:inline-flex;align-items:center;font-weight:600;color:var(--carbon)}
@media (max-width:360px){.ob-text{white-space:normal;max-width:calc(100% - var(--l,2.5rem) - 0.5rem)}.ob-text span{font-size:0.875rem}}
/* Abschluss mobil: Wochen-Band zwischen Text und Knopf, Knopf und Gründer am Seitenende */
@media (max-width:860px){
  .final{row-gap:0!important}
  .final .fin-kopf{display:contents}
  .final .fin-kopf h2{order:1}
  .final .fin-kopf>p{order:2}
  .final .vw{order:3;margin-top:1.75rem}
  .final .contact{order:4;margin-top:1.75rem}
  .final .gruender{order:5;margin-top:1.5rem}
}
@media (max-width:860px){
  .final{padding-bottom:1.5rem!important}
  .final .gruender{flex-direction:row!important;align-items:flex-start;gap:0.875rem!important;padding:1rem!important;margin-top:1rem!important}
  .final .gruender img{width:3.25rem!important;height:3.25rem!important}
  .final .gruender blockquote{font-size:0.9688rem;line-height:1.45;margin-bottom:0.375rem}
  .final .gruender b{font-size:0.9375rem}
  .final .gruender span{font-size:0.875rem}
  .final .contact{margin-top:1.5rem!important}
}
@media (max-width:860px){
  #kontakt{padding-bottom:0!important;margin-bottom:0!important}
  #kontakt .wrap{padding-bottom:0!important}
  body>footer .wrap{margin-top:1.25rem!important;padding-top:0.25rem!important}
  body>footer a{padding:0.5625rem 0!important}
}
@media (max-width:860px) and (max-height:620px){
  body>footer .wrap>span:first-child{display:none}
  .final .contact{gap:0.375rem!important;margin-top:1.25rem!important}
  .final .contact .slots{font-size:0.8438rem}
  .final .gruender{padding:0.875rem!important;gap:0.75rem!important}
  .final .gruender img{width:2.75rem!important;height:2.75rem!important}
  .final .gruender blockquote{font-size:0.9062rem}
}
/* Eigene Ordyse-Icons */
.oi-f{display:none}
.oi-k{fill:currentColor;stroke:none}
/* ===== Statusmarken wie im Portal: feiner Rand, klarer Ton, 8px Rundung ===== */
.hx-st,.hx-cmp em{border-radius:0.5rem}
.hx-st.w,.hx-cmp em{color:#8a4b00;background:#fff7eb;box-shadow:inset 0 0 0 1px #f5d9a8}
.hx-st.ok{color:#00625e;background:#eaf7f6;box-shadow:inset 0 0 0 1px #b9e2de}

/* Sprachumschalter DE | EN (Navigation aller Seiten) */
.lang-sw{display:inline-flex;align-items:center;gap:0;font-size:0.875rem;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.lang-sw a{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;min-height:2.75rem;padding:0 0.375rem;border-radius:0.5rem;color:var(--on-navy,#D5DAF8);text-decoration:none}
.lang-sw a:hover{color:#fff}
.lang-sw a[aria-current]{color:#fff;box-shadow:inset 0 -2px 0 #8C98F0;padding-block:0}
.lang-sw a:focus-visible{outline:2px solid var(--amber,#F2B544);outline-offset:2px}
.lang-sw span{color:rgba(213,218,248,.45);font-weight:400}
.top nav .lang-sw a[aria-current]{box-shadow:inset 0 -2px 0 #8C98F0;padding-block:0}
@media (max-width:980px){.nav-act .lang-sw{display:none}}
.msheet .lang-sw{display:flex;gap:0.25rem;min-height:3.25rem;border-bottom:1px solid rgba(255,255,255,.1);font-size:1.0625rem}
.msheet .lang-sw a{min-height:3.25rem;min-width:3rem;border-bottom:0;font-size:1.0625rem;font-weight:600;padding:0 0.625rem}
.msheet .lang-sw a:first-child{padding-left:0;justify-content:flex-start}

/* ---------- Auftakt beim Laden (html.auftakt, gestartet von band.js mit html.auftakt-an) ---------- */
.hero h1 .iw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.hero h1 .iw>span{display:inline-block}
html.auftakt .hero h1:not(.geteilt){visibility:hidden}
html.auftakt .hero h1 .iw>span{transform:translateY(110%)}
html.auftakt-an .hero h1 .iw>span{transform:none;transition:transform 1.05s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0) * 42ms + 60ms)}
html.auftakt .nav>*{opacity:0}
html.auftakt-an .nav>*{opacity:1;transition:opacity .8s ease .1s}
html.auftakt .hero .sub,html.auftakt .hero .ctas,html.auftakt .hero .htrust{opacity:0;transform:translateY(1rem);filter:blur(0.5rem)}
html.auftakt-an .hero .sub,html.auftakt-an .hero .ctas,html.auftakt-an .hero .htrust{opacity:1;transform:none;filter:blur(0);
  transition:opacity .9s ease,transform 1.1s cubic-bezier(.16,1,.3,1),filter .9s ease}
html.auftakt-an .hero .sub{transition-delay:.42s}
html.auftakt-an .hero .ctas{transition-delay:.58s}
html.auftakt-an .hero .htrust{transition-delay:.72s}
html.auftakt .hero .hx{opacity:0;transform:perspective(87.5rem) translateY(2.75rem) rotateX(11deg) scale(.955);transform-origin:50% 100%}
html.auftakt .hero .hx.hx-an{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.2,.6,.2,1),transform 1.5s cubic-bezier(.16,1,.3,1)}
.hx-frame{position:relative}
.hx-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;
  background:linear-gradient(104deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.5) 50%,rgba(255,255,255,0) 62%);transform:translateX(-130%)}
html.auftakt .hero .hx.hx-an .hx-frame::after{animation:hxGlanz 1.4s cubic-bezier(.45,0,.2,1) .75s 1 both}
@keyframes hxGlanz{0%{opacity:1;transform:translateX(-130%)}85%{opacity:1}100%{opacity:0;transform:translateX(130%)}}
@media (max-width:980px){html.auftakt .hero .sub,html.auftakt .hero .ctas,html.auftakt .hero .htrust{filter:none}}
@media (prefers-reduced-motion:reduce){html.auftakt .hero h1 .iw>span,html.auftakt .hero .sub,html.auftakt .hero .ctas,html.auftakt .hero .htrust,html.auftakt .hero .hx,html.auftakt .nav>*{opacity:1;transform:none;filter:none;transition:none}}

/* ---------- Produktansicht im Hero schwebt dauerhaft leicht über dem Hintergrund ---------- */
@keyframes hxSchweben{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,-0.5625rem,0) rotate(-.22deg)}}
@keyframes hxSchatten{0%,100%{transform:scaleX(1);opacity:.85}50%{transform:scaleX(.9);opacity:.5}}
.hero .hx-frame,.hero .hx-replay{animation:hxSchweben 6.8s cubic-bezier(.45,0,.55,1) infinite;will-change:transform}
.hero .hx::before{content:"";position:absolute;z-index:-1;left:9%;right:9%;bottom:-1.875rem;height:2.5rem;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(2,5,28,.6),rgba(2,5,28,0));filter:blur(0.3125rem);animation:hxSchatten 6.8s cubic-bezier(.45,0,.55,1) infinite}
@media (prefers-reduced-motion:reduce){.hero .hx-frame,.hero .hx-replay,.hero .hx::before{animation:none}}

/* ---------- Hero: eine Hauptaktion, daneben ein ruhiger Link zum Weiterlesen (Höhen wie vorher, nichts verschiebt sich) ---------- */
.hero .ctas{align-items:center;column-gap:1.75rem}
.hero .ctas .cta-link{display:inline-flex;align-items:center;gap:0.5625rem;min-height:3rem;padding:0 2px;color:var(--on-navy,#D5DAF8);font-size:1rem;font-weight:500;
  text-decoration:none;border-radius:0.5rem}
.hero .ctas .cta-link span{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:2px;transition:background-size .35s cubic-bezier(.2,.7,.2,1)}
.hero .ctas .cta-link svg{transition:transform .35s cubic-bezier(.2,.7,.2,1);opacity:.85}
.hero .ctas .cta-link:hover{color:#fff}
.hero .ctas .cta-link:hover span{background-size:100% 1px}
.hero .ctas .cta-link:hover svg{transform:translateY(0.1875rem)}
.hero .ctas .cta-link:focus-visible{outline:2px solid var(--amber,#F2B544);outline-offset:0.25rem}
@media (max-width:640px){
  .hero .ctas{gap:0.75rem}
  .hero .ctas .cta-link{justify-self:start;min-height:3rem}
}
@media (prefers-reduced-motion:reduce){.hero .ctas .cta-link span,.hero .ctas .cta-link svg{transition:none}}

/* ---------- Hero: Zielgruppe über der Überschrift, kurze Unterzeile, Satz unter dem Button, eine ruhige Vertrauenszeile ---------- */
.hero .hero-text .hero-fuer{text-wrap:balance;margin:0 0 0.875rem;font-size:1rem;font-weight:600;letter-spacing:.005em;color:#B9C2F7}
.hero .hero-text .htrust{margin-top:1.875rem;gap:0.625rem 1.625rem;font-size:0.875rem;color:#B9C2F7;flex-wrap:wrap}
.hero .hero-text .htrust li{display:inline-flex;align-items:center;gap:0.5rem;white-space:nowrap}
.hero .hero-text .htrust svg{display:inline-block;width:1rem;height:1rem;margin:0;flex:none;opacity:.9}
.hero .hero-text .ctas{margin-top:1.75rem}
@media (max-width:980px){.hero .hero-text .sub{margin-top:1.125rem}.hero .hero-text .ctas{margin-top:1.5rem}.hero .hero-text .htrust{margin-top:1.375rem}}
html.auftakt .hero .hero-fuer{opacity:0;transform:translateY(0.75rem)}
html.auftakt-an .hero .hero-fuer{opacity:1;transform:none;transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){html.auftakt .hero .hero-fuer{opacity:1;transform:none;transition:none}}
.hero .hero-text .htrust{width:max-content;max-width:calc(100% + 2.5rem)}
@media (max-width:1240px){.hero .hero-text .htrust{width:auto;max-width:none}}
@media (max-width:1240px) and (min-width:981px),(max-width:640px){.hero .hero-text .htrust{flex-direction:column;gap:0.5rem}}

/* Simulation: ruhige Beispielkarte, einmalige Einblendung */
.sz-sec{background:var(--mist,#F4F5F8);margin-top:6rem;padding-block:6rem 5rem}
.sz-head .lead{max-width:42.5rem}
.sz-card{margin-top:3rem;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);border-radius:1.25rem;background:#fff;box-shadow:0 0 0 1px rgba(13,20,70,.06),0 2.5rem 5rem -2.5rem rgba(13,20,70,.35);overflow:hidden}
.sz-links{padding:2.25rem 2.5rem;min-width:0}
.sz-rechts{padding:2.25rem 2.5rem;min-width:0;background:linear-gradient(160deg,#141D66 0%,#0D1446 100%);color:#fff;display:flex;flex-direction:column}
.sz-k{margin:0;font-size:0.875rem;font-weight:600;color:var(--ink-3,#5E6676)}
.sz-k span{display:block;margin-top:0.25rem;font-size:1.125rem;font-weight:600;color:var(--ink,#121826)}
.sz-rechts .sz-k{color:#B9C2F7}
.sz-list{list-style:none;margin:1.5rem 0 0;padding:0;display:grid}
.sz-m{display:grid;grid-template-columns:2.75rem minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1.125rem 0;border-top:1px solid var(--line,#E2E5EC)}
.sz-m:last-child{border-bottom:1px solid var(--line,#E2E5EC)}
.sz-sw{position:relative;width:2.5rem;height:1.5rem;border-radius:0.75rem;background:#D7DBE6;transition:background-color .3s ease}
.sz-sw i{position:absolute;top:0.1875rem;left:0.1875rem;width:1.125rem;height:1.125rem;border-radius:50%;background:#fff;box-shadow:0 1px 0.1875rem rgba(13,20,70,.3);transition:transform .3s cubic-bezier(.3,1.3,.5,1)}
.sz-m.an .sz-sw{background:#008781}
.sz-m.an .sz-sw i{transform:translateX(1rem)}
.sz-mt{display:grid;gap:2px;min-width:0}
.sz-mt b{font-size:1.0312rem;color:var(--ink,#121826)}
.sz-mt span{font-size:0.9375rem;color:var(--ink-2,#3D4555)}
.sz-m em{font-style:normal;font-size:1rem;font-weight:600;color:var(--ink-3,#5E6676);font-variant-numeric:tabular-nums;white-space:nowrap;transition:color .3s ease}
.sz-m.an em{color:#00706B}
.sz-zahl{margin:auto 0 0;padding-top:1.75rem;font-family:"General Sans","Inter","Helvetica Neue",Arial,sans-serif;font-size:clamp(3rem,5vw,4.5rem);font-weight:600;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.sz-eur{color:#7FE0D6}
.sz-was{margin:0.625rem 0 0;font-size:1rem;color:#D5DAF8}
.sz-bar{display:flex;gap:0.1875rem;height:0.625rem;margin-top:1.625rem;border-radius:0.3125rem;background:rgba(255,255,255,.1);overflow:hidden}
.sz-bar i{display:block;flex:0 0 auto;height:100%;transform-origin:left;background:#3C79F0}
.sz-bar i[data-i="1"]{background:#2A9F9A}.sz-bar i[data-i="2"]{background:#8C98F0}
.sz-js .sz-bar i{transform:scaleX(0);transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.sz-js .sz-bar i.an{transform:scaleX(1)}
.sz-fakten{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.625rem 0 0;padding-top:1.25rem;border-top:1px solid rgba(185,194,247,.2)}
.sz-fakten div{display:grid;gap:0.25rem}
.sz-fakten dt{font-size:0.875rem;color:#B9C2F7}
.sz-fakten dd{margin:0;font-size:1.125rem;font-weight:600;font-variant-numeric:tabular-nums}
.sz-fakten s{color:#9AA4E6;font-weight:500;margin-right:0.25rem}
.sz-js .sz-fakten{opacity:0;transition:opacity .5s ease}
.sz-js.fertig .sz-fakten{opacity:1}
.sz-js{opacity:0;transform:translateY(3rem) scale(.97);transition:opacity .7s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.sz-js .sz-rechts{background-position:0 0}
.sz-js .sz-m{opacity:0;transform:translateX(-0.75rem);transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.sz-js.sz-da{opacity:1;transform:none}
.sz-js.sz-da .sz-m{opacity:1;transform:none}
.sz-js.sz-da .sz-m[data-i="0"]{transition-delay:.35s}.sz-js.sz-da .sz-m[data-i="1"]{transition-delay:.45s}.sz-js.sz-da .sz-m[data-i="2"]{transition-delay:.55s}
.sz-js .sz-zahl,.sz-js .sz-was{opacity:0;transition:opacity .6s ease .5s}
.sz-js.sz-da .sz-zahl,.sz-js.sz-da .sz-was{opacity:1}
.sz-foot{display:flex;justify-content:space-between;align-items:center;gap:0.75rem 2rem;flex-wrap:wrap;margin-top:1.5rem}
.sz-note{margin:0;font-size:0.875rem;color:var(--ink-3,#5E6676);max-width:42.5rem}
@media (max-width:900px){.sz-card{grid-template-columns:1fr}.sz-rechts{order:-1}}
@media (max-width:640px){.sz-sec{margin-top:4.5rem;padding-block:4rem 3.5rem}.sz-card{margin-top:2rem;border-radius:1rem}.sz-links,.sz-rechts{padding:1.5rem 1.25rem}
  .sz-m{grid-template-columns:2.5rem minmax(0,1fr);row-gap:0.25rem}.sz-m em{grid-column:2}.sz-zahl{font-size:3rem;padding-top:1rem}.sz-mt b{font-size:1rem}}
/* Hero: Kategorie als Kennzeichen über dem Titel */
.hero .hero-text .hero-fuer{display:inline-flex;align-items:center;gap:0.625rem;margin:0 0 1.375rem;padding:0.3125rem 1rem 0.3125rem 0.3125rem;border-radius:62.4375rem;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(185,194,247,.26);font-size:0.9375rem;font-weight:500;line-height:1.3;color:#D5DAF8;letter-spacing:0}
.hero .hero-text .hero-fuer b{display:inline-flex;align-items:center;padding:0.25rem 0.75rem;border-radius:62.4375rem;background:linear-gradient(90deg,#2e47a9,#3c79f0 60%,#2a9f9a);color:#fff;font-weight:600;font-size:0.875rem;white-space:nowrap;box-shadow:0 0.25rem 0.875rem -0.375rem rgba(60,121,240,.7)}
@media (max-width:480px){.hero .hero-text .hero-fuer{display:flex;flex-wrap:wrap;gap:0.5rem 0.625rem;padding:0;background:none;box-shadow:none;margin-bottom:1.125rem}}

/* Funktionen: vereinfachte Produktansichten statt Screenshots. Nur die Kernaussage, keine Navigation, keine Menüs. */
.fv{position:relative;aspect-ratio:16/10;background:#fff;color:var(--ink,#121826);display:flex;flex-direction:column;gap:clamp(0.875rem,1.4vw,1.375rem);padding:clamp(1.125rem,2.2vw,2.125rem);font-size:clamp(0.8125rem,1vw,0.9375rem);line-height:1.35}
.shot.fv{overflow:hidden;background:#fff}
.fv-kopf{display:flex;justify-content:space-between;align-items:flex-start;gap:0.75rem}
.fv-kopf>div{display:grid;gap:0.1875rem;min-width:0}
.fv-k{font-size:.86em;font-weight:600;color:var(--ink-3,#5E6676)}
.fv-t{font-size:1.18em;font-weight:600;color:var(--ink,#121826)}
.fv-pill{flex:none;padding:0.3125rem 0.6875rem;border-radius:62.4375rem;background:#ECEEFB;color:var(--carbon,#26338F);font-size:.86em;font-weight:600;white-space:nowrap}
.fv-pill.gut{background:#E3F4F2;color:#00706B}
.fv-fazit{margin:0.625rem 0 0;font-size:.95em;color:var(--ink-2,#3D4555)}
.fv-hb{position:relative;height:0.625rem;border-radius:0.3125rem;background:#EEF0F5;overflow:hidden}
.fv-hb i{position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:0.3125rem;background:#2f4fb8}
/* Landkarte */
.fv-map{position:relative;flex:1;min-height:9.375rem}
.fv-map-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fv-steps{list-style:none;margin:0;padding:0}
.fv-steps li{position:absolute;top:32%;transform:translate(-50%,-50%);padding:0.375rem 0.6875rem;border-radius:0.5625rem;background:#fff;box-shadow:0 0 0 1.5px #2f4fb8;font-weight:600;font-size:.92em;white-space:nowrap}
.fv-steps li:nth-child(1){left:10%}.fv-steps li:nth-child(2){left:30%}.fv-steps li:nth-child(3){left:50%}.fv-steps li:nth-child(4){left:70%}.fv-steps li:nth-child(5){left:90%}
.fv-steps li.eng{box-shadow:0 0 0 2px #d99a2b}
.fv-umweg{position:absolute;left:40%;top:86%;transform:translate(-50%,-50%);padding:0.3125rem 0.625rem;border-radius:0.5625rem;background:#FFF6E6;box-shadow:0 0 0 1.5px #d99a2b;font-size:.88em;font-weight:600;white-space:nowrap;color:#7A4C00}
.fv-umweg em{font-style:normal;font-weight:500;margin-left:0.25rem}
.fv-call{position:absolute;left:40%;top:4%;transform:translateX(-50%);font-size:.9em;font-weight:600;color:#8A5A00;white-space:nowrap}
/* Varianten */
.fv-var{list-style:none;margin:auto 0;padding:0;display:grid;gap:0.75rem}
.fv-var li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:0.375rem 0.875rem;align-items:center;padding:0.75rem 0.875rem;border-radius:0.75rem;background:#F7F8FB}
.fv-var .fv-bar{grid-column:1/-1;height:0.375rem;border-radius:0.1875rem;background:linear-gradient(90deg,#2f4fb8 var(--w),#E3E6EF var(--w))}
.fv-weg{display:flex;flex-wrap:wrap;gap:0.25rem;min-width:0}
.fv-weg i{font-style:normal;font-size:.82em;padding:0.1875rem 0.4375rem;border-radius:0.375rem;background:#fff;box-shadow:0 0 0 1px #E2E5EC}
.fv-weg i.um{background:#FFF6E6;box-shadow:0 0 0 1px #E8B860;color:#7A4C00;font-weight:600}
.fv-var b{font-size:1.05em}.fv-var em{font-style:normal;color:var(--ink-2,#3D4555);white-space:nowrap}
/* Soll */
.fv-soll{flex:1;display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.375rem 2rem;align-content:center;align-items:center}
.fv-big{display:grid;gap:2px}
.fv-big b{font-family:"General Sans","Inter",sans-serif;font-size:2.8em;line-height:1;font-weight:600;color:var(--carbon,#26338F)}
.fv-big span{color:var(--ink-2,#3D4555)}
.fv-plan{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0.5rem;align-self:center}
.fv-plan li{display:inline-flex;align-items:center;gap:0.375rem;padding:0.375rem 0.625rem;border-radius:0.5625rem;background:#F1F8F7;font-weight:600;font-size:.9em}
.fv-plan svg{width:0.875rem;height:0.875rem;color:#008781}
.fv-abw{grid-column:1/-1;display:grid;gap:0.25rem;padding:0.875rem 1rem;border-radius:0.75rem;background:#FFF6E6;box-shadow:inset 0.1875rem 0 0 #d99a2b}
.fv-abw-z{display:flex;flex-wrap:wrap;gap:0.375rem 1rem;color:#7A4C00;font-weight:600;font-size:.92em}
/* Durchlauf */
.fv-hist{flex:1;display:flex;flex-direction:column;gap:0.625rem;min-height:9.375rem}
.fv-hbars{position:relative;flex:1;display:flex;align-items:flex-end;gap:0.1875rem;padding-top:1.75rem;border-bottom:1px solid #D7DBE6}
.fv-hbars i{flex:1;height:var(--h);border-radius:0.1875rem 0.1875rem 0 0;background:#2f4fb8}
.fv-hbars i.aus{background:#d99a2b}
.fv-med{position:absolute;top:0;bottom:0;border-left:2px dashed #121826}
.fv-med b{position:absolute;top:0;left:0.5rem;white-space:nowrap;font-size:.9em}
.fv-hleg{display:flex;justify-content:space-between;color:var(--ink-3,#5E6676);font-size:.88em}
.fv-hleg .aus{color:#8A5A00;font-weight:600}
/* Vergleich */
.fv-vgl{flex:1;display:flex;flex-direction:column;gap:1.125rem;justify-content:center}
.fv-vz{display:grid;grid-template-columns:3.75rem minmax(0,1fr) auto;gap:0.875rem;align-items:center;font-weight:600}
.fv-vz .fv-hb{height:0.875rem;border-radius:0.4375rem}
.fv-vz.hl .fv-hb i{background:#d99a2b}
.fv-vz b{white-space:nowrap;font-variant-numeric:tabular-nums}
/* Belege */
.fv-obj{flex:1;display:flex;flex-direction:column;gap:1.25rem;justify-content:center}
.fv-lane{display:grid;grid-template-columns:6rem minmax(0,1fr);gap:0.75rem;align-items:center}
.fv-ln{font-weight:600;font-size:.92em}
.fv-tr{position:relative;height:1.375rem;border-radius:0.6875rem;background:#F1F3F8}
.fv-tr i{position:absolute;top:0;bottom:0;left:var(--x);width:var(--w);border-radius:0.6875rem}
.fv-lane.a i{background:#2f4fb8}.fv-lane.l i{background:#0a8fc4}.fv-lane.r i{background:#008781}
.fv-tr i.warn{background:repeating-linear-gradient(45deg,#d99a2b 0 0.375rem,#e9b860 0.375rem 0.75rem)}
/* Ursachen, Engpässe */
.fv-urs,.fv-eng{list-style:none;margin:auto 0;padding:0;display:grid;gap:0.875rem}
.fv-urs li{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;gap:0.875rem;align-items:center;padding:0.75rem 0.875rem;border-radius:0.75rem;background:#F7F8FB}
.fv-ut{display:grid;gap:2px;min-width:0}.fv-ut b{font-size:.95em}.fv-ut span{font-size:.86em;color:var(--ink-3,#5E6676)}
.fv-urs em{font-style:normal;font-weight:700;color:#8A5A00;font-size:1.1em}
.fv-eng li{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto auto;gap:0.875rem;align-items:center;font-size:.95em}
.fv-eng li.hl{font-weight:600}.fv-eng li.hl .fv-hb i{background:#d99a2b}
.fv-eng b,.fv-eng em{white-space:nowrap;font-variant-numeric:tabular-nums}.fv-eng em{font-style:normal;color:var(--ink-3,#5E6676);min-width:3em;text-align:right}
/* Prognose */
.fv-prog{list-style:none;margin:auto 0;padding:0;display:grid;gap:0.5rem}
.fv-prog li{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.2fr) auto;gap:0.75rem;align-items:center;padding:0.6875rem 0.875rem;border-radius:0.75rem;background:#F7F8FB;font-size:.95em}
.fv-prog li span:not(.fv-r){color:var(--ink-2,#3D4555)}
.fv-prog em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums}
.fv-r{padding:0.1875rem 0.5625rem;border-radius:62.4375rem;font-size:.82em;font-weight:700}
.fv-r.hoch{background:#FDECEA;color:#A3261A}.fv-r.mittel{background:#FFF6E6;color:#7A4C00}.fv-r.niedrig{background:#E3F4F2;color:#00706B}
/* Simulation */
.fv-sim{flex:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.125rem}
.fv-sim ul{list-style:none;margin:0;padding:0;display:grid;gap:0.625rem;align-content:center}
.fv-sim li{display:flex;align-items:center;gap:0.75rem;font-weight:600;font-size:.95em}
.fv-sw{flex:none;position:relative;width:2.125rem;height:1.25rem;border-radius:0.625rem;background:#008781}
.fv-sw::after{content:"";position:absolute;top:0.1875rem;right:0.1875rem;width:0.875rem;height:0.875rem;border-radius:50%;background:#fff}
.fv-erg{display:flex;flex-direction:column;justify-content:center;gap:0.375rem;padding:1.125rem 1.25rem;border-radius:0.875rem;background:linear-gradient(160deg,#141D66,#0D1446);color:#fff}
.fv-erg b{font-family:"General Sans","Inter",sans-serif;font-size:2.3em;line-height:1;font-weight:600;letter-spacing:-.02em}
.fv-erg span{color:#D5DAF8;font-size:.92em}.fv-erg .fv-dz{color:#fff;font-weight:600}.fv-erg s{color:#9AA4E6;font-weight:500;margin-right:0.25rem}
/* Alarme */
.fv-alarm{flex:1;display:flex;flex-direction:column;gap:0.625rem;justify-content:center}
.fv-regel{display:grid;grid-template-columns:3.5rem minmax(0,1fr);gap:0.75rem;align-items:center;padding:0.8125rem 1rem;border-radius:0.75rem;background:#F7F8FB}
.fv-wenn{font-weight:700;color:var(--carbon,#26338F)}
.fv-ausl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 0.625rem;align-items:center;margin-top:0.375rem;padding:0.8125rem 1rem;border-radius:0.75rem;background:#FDECEA}
.fv-ausl span:last-child{grid-column:2;color:#7A1C12;font-size:.92em}
.fv-punkt{width:0.625rem;height:0.625rem;border-radius:50%;background:#C8372A;box-shadow:0 0 0 0.25rem rgba(200,55,42,.18)}
/* Cockpit */
.fv-cock{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto 1fr;gap:0.75rem}
.fv-kpi{display:grid;gap:0.25rem;padding:0.875rem 1rem;border-radius:0.75rem;background:#F7F8FB}
.fv-kpi span{font-size:.88em;color:var(--ink-3,#5E6676)}
.fv-kpi b{font-family:"General Sans","Inter",sans-serif;font-size:1.6em;font-weight:600;line-height:1.1}
.fv-kpi em{font-style:normal;font-size:.86em;font-weight:600;color:var(--ink-2,#3D4555)}.fv-kpi em.gut{color:#00706B}
.fv-spark{grid-column:1/-1;width:100%;height:100%;min-height:3.75rem}
@media (max-width:640px){
  .fv{aspect-ratio:auto;min-height:0}
  .fv-map{min-height:10.625rem}
  .fv-hbars{flex:none;height:9.375rem}
  .fv-steps li{font-size:.78em;padding:0.3125rem 0.4375rem}.fv-call,.fv-umweg{font-size:.78em}
  .fv-soll{grid-template-columns:1fr}
  .fv-var li{grid-template-columns:minmax(0,1fr) auto}.fv-var em{grid-column:1/-1}
  .fv-urs li{grid-template-columns:minmax(0,1fr) auto}.fv-urs .fv-hb{grid-column:1/-1;grid-row:2}
  .fv-eng li{grid-template-columns:minmax(0,1fr) auto auto}.fv-eng .fv-hb{grid-column:1/-1;grid-row:2}
  .fv-prog li{grid-template-columns:auto minmax(0,1fr) auto}.fv-prog li span:not(.fv-r){grid-column:2/-1;grid-row:2}
  .fv-sim{grid-template-columns:1fr}
  .fv-cock{grid-template-columns:1fr 1fr}.fv-cock .fv-kpi:nth-child(3){grid-column:1/-1}
  .fv-lane{grid-template-columns:5.25rem minmax(0,1fr)}
}

/* Hero: vereinfachte Ansicht ist niedriger; sie bleibt oben an derselben Stelle stehen */
@media (min-width:981px){.hero .hero-grid>.hx{align-self:start}}
/* Große und breite Bildschirme (24 bis 34 Zoll, auch Ultrawide).
   Alle Größen stehen in rem. Hier wächst nur die Grundschrift in Stufen
   und nimmt Layout, Abstände und Schrift gemeinsam mit. Jede Stufe
   verlangt auch genug Höhe, damit flache Ultrawide-Monitore den
   ersten Bildschirm nicht abschneiden. Die Nutzereinstellung der
   Schriftgröße im Browser bleibt erhalten, weil hier Prozent stehen. */
@media (min-width:1800px) and (min-height:800px){html{font-size:112.5%}}
@media (min-width:2200px) and (min-height:960px){html{font-size:125%}}
@media (min-width:2500px) and (min-height:1100px){html{font-size:137.5%}}
@media (min-width:3000px) and (min-height:1200px){html{font-size:150%}}
