/* Überarbeitung mfmotion, Oktober 2026: Schrift, Lesbarkeit, Bewegung, Grafiken, GVP-Siegel.
   Wird nach site.css geladen und überschreibt nur, was hier steht. */

@font-face{font-family:"Source Sans 3";src:url("fonts/source-sans-3-latin-wght-normal.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
/* Ersatzschrift mit den Maßen von Source Sans 3, damit beim Nachladen nichts springt */
@font-face{font-family:"Source Sans 3 Ersatz";src:local("Arial"),local("Helvetica"),local("Roboto");size-adjust:90%;ascent-override:113.8%;descent-override:44.4%;line-gap-override:0%}

:root{--muted:#3d5268;--ease:cubic-bezier(.22,.8,.24,1);--kx-blue:#0b4fb3;--kx-sky:#e9f2fb;--kx-ok:#16795f;--kx-warn:#c2410c;font-family:"Source Sans 3","Source Sans 3 Ersatz","Segoe UI",Arial,Helvetica,sans-serif;font-size:19px}
body{font-family:inherit}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.small,.footer,.contact-qualifications{font-size:17px}

/* Alte Einblendung (Start bei 25 % Deckkraft, wirkte blass) abgeschaltet */
.is-seen,.reveal.is-seen,.care-scene.is-seen,.editorial-visual.is-seen{animation:none}

/* Neue Einblendung: unsichtbar bis zum Eintritt, dann weich nach oben */
.kx :is(.home-intro h1,.home-intro .prose,.target,.contact-band h2,.contact-band>.wrap>p,.contact-card,.section-heading,.preview-person,.route-links,.hero-copy>*,.kx-visual,.connection-strip li,.quick-facts li,.section-links,.editorial-split>*,.steps li,.benefit,.faq details,.team-card,.gvp-seal,.section>h2,.section>.prose,.section>p):not(.kx-in){opacity:0;transform:translateY(14px)}
.kx .kx-r{transition:opacity .5s var(--ease),transform .5s var(--ease);transition-delay:var(--kx-d,0ms)}
.kx .kx-r.kx-in{opacity:1;transform:none}
.kx .kx-visual.kx-r:not(.kx-in){transform:translateY(28px) scale(.97)}

/* Startbild: langsames Ankommen und leichte Tiefe beim Scrollen */
.region{overflow:hidden;border-radius:22px}
.region img{transform:translateY(calc(var(--kx-shift,0) * 26px)) scale(1.06)}
.kx .region img{animation:kx-settle 1.2s var(--ease) both}
@keyframes kx-settle{from{transform:scale(1.1);opacity:.6}to{transform:translateY(0) scale(1.06);filter:none;opacity:1}}

/* Knöpfe: Pfeil gleitet mit */
.button{position:relative;overflow:hidden}
/* Glanz auf Knöpfen nach Prüfbericht Punkt 11 entfernt */



/* Startseite: Zielgruppen-Karten */
.target{transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s ease}

.kx-mini{display:flex;align-items:center;gap:8px;margin:0 0 22px;min-height:58px}
.kx-mini-roster .kx-cell{flex:1;height:56px;border-radius:10px;background:#fff;border:1px solid #d3e2ef;position:relative;display:block;text-align:center;padding-top:7px;font-size:13px;font-weight:700;color:#5a7088;line-height:1.2}
.kx-mini-roster .kx-cell::after{display:none}
.kx-mini-roster .kx-cell::before{content:"";position:absolute;left:7px;right:7px;bottom:9px;height:8px;border-radius:4px;background:#bcd6ee}
.kx-mini-roster .kx-cell.is-gap{border-style:dashed;border-color:#e3a372;background:#fff8f2;transition:background-color .5s ease,border-color .5s ease}
.kx-mini-roster .kx-cell.is-gap::before{background:transparent;transition:background-color .5s ease}
.kx-mini-roster .kx-cell.is-gap.is-filled{border-style:solid;border-color:#9fd3c3;background:#effaf6}
.kx-mini-roster .kx-cell.is-gap.is-filled::before{background:var(--kx-ok)}
.kx-mini-bonus{flex-wrap:wrap}
.kx-mini-bonus{gap:6px}
.kx-mini-bonus .kx-pill{padding:8px 12px;border-radius:999px;background:#fff;border:1px solid #cfe5e1;font-size:15px;white-space:nowrap;font-weight:650;color:#2c5d63;transition:background-color .35s ease,border-color .35s ease,color .35s ease,transform .45s var(--ease),box-shadow .45s var(--ease)}
.kx-mini-bonus .kx-pill.is-on{background:var(--teal);border-color:var(--teal);color:#fff;transform:translateY(-3px);box-shadow:0 10px 20px #176c7633}
.kx-mini-bonus .kx-pill b{font-weight:800}

/* Gemeinsame Bühne der beiden großen Grafiken */
.kx-visual{margin:0;position:relative;min-width:0;padding:34px 30px;border-radius:28px;background:radial-gradient(120% 90% at 85% 10%,#d9ebfb 0,#eef5fc 45%,#f7fafd 100%);border:1px solid #d6e5f2;isolation:isolate;overflow:hidden}
.kx-visual::before{content:"";position:absolute;width:340px;height:340px;right:-120px;bottom:-140px;border-radius:50%;background:radial-gradient(circle,#bfe8ef 0,transparent 70%);opacity:.7;z-index:-1;animation:kx-drift 14s ease-in-out 2 alternate}
.kx-visual.kx-shift{background:radial-gradient(120% 90% at 85% 10%,#d7f0ec 0,#eef8f6 45%,#f8fbfb 100%);border-color:#d3e9e5}
@keyframes kx-drift{to{transform:translate(-60px,-50px) scale(1.15)}}
.kx-card{position:relative;background:#fff;border:1px solid #dbe6f0;border-radius:20px;box-shadow:0 30px 60px #15365718,0 2px 6px #1536570d;padding:22px 22px 20px}
.kx-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.kx-card-head strong{font-size:19px;color:var(--navy);display:flex;align-items:center;gap:10px}
.kx-card-head small{font-size:15px;color:#5b6f84;font-weight:600}
.kx-live{width:10px;height:10px;border-radius:50%;background:var(--kx-ok);box-shadow:0 0 0 0 #16795f66;animation:kx-ping 2s 1}
@keyframes kx-ping{70%{box-shadow:0 0 0 9px #16795f00}100%{box-shadow:0 0 0 0 #16795f00}}
.kx-float{position:absolute;display:flex;align-items:center;gap:10px;padding:11px 16px;border-radius:14px;background:#fff;border:1px solid #d6e3ee;box-shadow:0 16px 32px #15365714;font-size:15px;font-weight:650;color:var(--navy);z-index:2}
.kx-float svg{width:20px;height:20px;color:var(--teal);flex-shrink:0}
@keyframes kx-bob{50%{transform:translateY(-8px)}}

/* Dienstplan (Für Einrichtungen) */
.kx-roster .kx-card{margin:26px 0 52px}
.kx-grid{display:grid;grid-template-columns:52px repeat(7,minmax(0,1fr));gap:6px;align-items:center}
.kx-grid .kx-h{font-size:13px;font-weight:700;color:#4b6178;text-align:center;letter-spacing:.4px}
.kx-grid .kx-row{font-size:13px;font-weight:700;color:#4b6178}
.kx-cell{height:34px;border-radius:8px;background:#e6f0fa;position:relative;transition:background-color .5s ease,box-shadow .5s ease,border-color .5s ease}
.kx-cell::after{content:"";position:absolute;left:6px;right:6px;top:50%;height:6px;margin-top:-3px;border-radius:3px;background:#a9c8e8}
.kx-cell.is-gap{background:#fff;border:1.5px dashed #e2a06c}
.kx-cell.is-gap::after{content:"offen";background:none;height:auto;top:50%;margin-top:-.62em;left:0;right:0;text-align:center;font-size:12.5px;font-weight:800;color:var(--kx-warn);letter-spacing:0;transition:opacity .3s ease}
.kx-cell.is-gap.is-active{border-color:var(--kx-warn);box-shadow:0 0 0 4px #c2410c1f;animation:kx-pulse 1.6s ease-in-out 2}
@keyframes kx-pulse{50%{box-shadow:0 0 0 7px #c2410c10}}
.kx-cell.is-gap.is-filled{border:1.5px solid #8fcfba;background:#e9f8f2;animation:kx-pop .5s var(--ease)}
.kx-cell.is-gap.is-filled::after{content:"✓";color:var(--kx-ok);font-size:15px;margin-top:-.62em}
@keyframes kx-pop{40%{transform:scale(1.18)}}
.kx-roster-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid #e3ecf4;min-height:58px}
.kx-roster-count{font-size:15px;font-weight:700;color:var(--kx-warn);transition:color .4s ease}
.kx-roster-count.is-done{color:var(--kx-ok)}
.kx-match{display:flex;align-items:center;gap:10px;padding:7px 14px 7px 7px;border-radius:999px;background:var(--navy);color:#fff;font-size:14px;font-weight:600;opacity:0;transform:translateX(24px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.kx-match.is-in{opacity:1;transform:none}
.kx-token{width:30px;height:30px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;font-size:11px;font-weight:800;flex-shrink:0}
.kx-fly{position:absolute;z-index:5;pointer-events:none;box-shadow:0 8px 20px #15365740}
.kx-roster .kx-float-a{top:12px;right:18px}
.kx-roster .kx-float-b{bottom:14px;left:16px;animation-delay:-2.5s}

/* Dienst und Zuschläge (Für Pflegefachkräfte) */
.kx-shift .kx-card{margin:8px 0 64px}
.kx-wage{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.kx-wage-value{font-size:clamp(46px,5vw,64px);font-weight:750;letter-spacing:-2px;color:var(--navy);font-variant-numeric:tabular-nums;line-height:1}
.kx-wage-cur{font-size:30px;font-weight:700;color:var(--navy)}
.kx-wage-label{display:block;width:100%;font-size:15px;font-weight:650;color:#4f667d;margin-top:6px;min-height:3em}
.kx-bonuses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0 16px}
.kx-bonus{border:1px solid #d5e6e3;border-radius:12px;padding:10px 12px;background:#f7fbfb;transition:background-color .35s ease,border-color .35s ease,transform .45s var(--ease),box-shadow .45s var(--ease)}
.kx-bonus b{display:block;font-size:20px;color:var(--teal)}
.kx-bonus span{font-size:13.5px;font-weight:650;color:#4f667d;line-height:1.3;display:block}
.kx-bonus.is-on{background:var(--teal);border-color:var(--teal);transform:translateY(-4px);box-shadow:0 14px 26px #176c7638}
.kx-bonus.is-on b,.kx-bonus.is-on span{color:#fff}
.kx-leave{border-top:1px solid #e3ecf4;padding-top:14px}
.kx-leave-head{display:flex;justify-content:space-between;font-size:15px;font-weight:700;color:var(--navy);margin-bottom:9px}
.kx-leave-head span{color:#4f667d;font-weight:600}
.kx-days{display:grid;grid-template-columns:repeat(17,1fr);gap:4px}
.kx-day{aspect-ratio:1;border-radius:4px;background:#e4edf5;transition:background-color .35s ease,transform .35s var(--ease)}
.kx-day.is-on{background:#53b3a6;transform:scale(1.08)}
.kx-bubble{position:absolute;right:22px;bottom:18px;max-width:270px;display:flex;gap:10px;align-items:flex-end;opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease);z-index:3}
.kx-bubble.is-in{opacity:1;transform:none}
.kx-bubble img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 6px 14px #15365726}
.kx-bubble-text{background:#fff;border:1px solid #d6e3ee;border-radius:16px 16px 16px 4px;padding:10px 14px;box-shadow:0 16px 32px #15365714;font-size:15px;line-height:1.35;color:var(--navy)}
.kx-bubble-text small{display:block;font-size:12.5px;font-weight:700;color:var(--teal);margin-bottom:2px}
.kx-dots{display:inline-flex;gap:4px;padding:4px 0}
.kx-dots i{width:7px;height:7px;border-radius:50%;background:#9db3c8;animation:kx-type 1s infinite}
.kx-dots i:nth-child(2){animation-delay:.15s}.kx-dots i:nth-child(3){animation-delay:.3s}
@keyframes kx-type{50%{transform:translateY(-4px);opacity:.5}}
.kx-bubble .kx-said{display:none}
.kx-bubble.is-typed .kx-dots{display:none}
.kx-bubble.is-typed .kx-said{display:inline}
.kx-shift .kx-float-a{top:14px;right:18px}

/* Verbindungsleiste: Fluss zwischen Einrichtung, Kelbert, Pflegefachkraft */
.connection-strip li:not(:last-child)::after{content:"";position:absolute;right:-14px;top:50%;width:28px;height:3px;margin-top:-1.5px;z-index:2;border-radius:2px;background:repeating-linear-gradient(90deg,var(--kx-blue) 0 6px,transparent 6px 11px);background-size:22px 3px;animation:kx-flow 1s linear 6}
@keyframes kx-flow{to{background-position:22px 0}}
.connection-strip .line-icon,.benefit-icon{transition:transform .5s var(--ease)}


/* Karten mit leichter Hebung */
.benefit,.contact-card,.preview-person,.team-card,.step-copy{transition:transform .45s var(--ease),box-shadow .45s var(--ease)}

.kx .steps li.kx-in .step-number{animation:kx-pop .6s var(--ease) .25s both}
.kx-num{display:inline-block;font:inherit;color:inherit;font-variant-numeric:tabular-nums}

/* GVP-Siegel */
.gvp-seal{display:inline-flex;align-items:center;gap:16px;text-decoration:none;color:var(--muted);font-size:16px;line-height:1.4}
.gvp-seal img{width:150px;height:auto;display:block;border-radius:8px;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}

.footer-gvp{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px}
.footer-gvp .gvp-seal img{width:132px}
.kx-credit{font-size:15px;color:#5b6f84}
.kx-credit a{color:inherit}
.gvp-band{display:flex;align-items:center;gap:28px;margin:34px 0 0;padding:22px 26px;border-radius:18px;background:#f1f6fb;border:1px solid #d6e3ee}
.gvp-band p{margin:0;color:var(--muted)}
.gvp-band strong{color:var(--navy)}

@media(max-width:800px){
  .kx-visual{padding:24px 16px;border-radius:22px}
  .kx-card{padding:16px 14px}
  .kx-card-head small,.kx-leave-head span{display:none}
  .kx-card-head strong{font-size:18px}
  .kx-cell.is-gap::after{content:'!';font-size:14px}
  .kx-roster .kx-card{margin-top:34px}
  .kx-grid{grid-template-columns:40px repeat(7,minmax(0,1fr));gap:4px}
  .kx-cell{height:30px}
  .kx-bonuses{gap:6px}
  .kx-bonus{padding:8px}
  .kx-bonus b{font-size:17px}
  .kx-bubble{position:relative;right:auto;bottom:auto;margin-top:-14px;margin-left:auto}
  .kx-float{font-size:13.5px;padding:8px 12px}
  .kx-roster .kx-float-b{display:none}
  .kx-roster-foot{flex-direction:column;align-items:flex-start;min-height:0}
  .gvp-band{flex-direction:column;align-items:flex-start}
  .connection-strip li:not(:last-child)::after{display:none}
}

@media(prefers-reduced-motion:reduce){
  .kx-visual::before,.kx-float,.kx-live,.connection-strip li::after{animation:none!important}
  .region img{transform:scale(1.06)}
}
.team-photo img{width:142px;height:142px;object-fit:cover;border-radius:50%;box-shadow:0 8px 18px #15365722}

/* Runde 2 (22.10.2026): mehr Bewegung auf Wunsch des Kunden */

/* Überschriften Wort für Wort */
.kx .kx-split.kx-r { opacity: 1 !important; transform: none !important; }
.kx-w { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .12em; margin-bottom: -.12em; }
.kx-w > span { display: inline-block; transform: translateY(108%); transition: transform .95s var(--ease); transition-delay: calc(var(--kx-d, 0ms) + var(--i, 0) * 55ms); }
.kx-in .kx-w > span, .kx-in.kx-split .kx-w > span { transform: none; }
.kx-still .kx-w > span { transform: none; }

/* Icons zeichnen sich */
.kx .kx-zeichnen * { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s var(--ease) .25s; }
.kx .kx-in .kx-zeichnen *, .kx .kx-in.kx-zeichnen * { stroke-dashoffset: 0; }




/* Herzschlag im Startbild */
.region { position: relative; }
.region::after {
  content: ""; position: absolute; left: 50%; top: 48%; width: 15%; aspect-ratio: 1; transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(120, 190, 255, .55) 0, rgba(120, 190, 255, 0) 65%);
  mix-blend-mode: screen; pointer-events: none; animation: kx-herz 2.6s ease-in-out 3 forwards;
}
@keyframes kx-herz { 0%, 100% { opacity: .15; transform: translate(-50%, -50%) scale(.85) } 12% { opacity: .75; transform: translate(-50%, -50%) scale(1.08) } 24% { opacity: .3; transform: translate(-50%, -50%) scale(.95) } 36% { opacity: .65; transform: translate(-50%, -50%) scale(1.04) } }

/* Fortschrittsleiste */
.kx-leiste { position: fixed; left: 0; top: 0; height: 3px; width: 100%; z-index: 100; background: linear-gradient(90deg, #0b4fb3, #3fb6c8); transform-origin: left; transform: scaleX(0); pointer-events: none; }

/* Telefonnummern in fester Ziffernbreite, damit nichts springt */
a.phone { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  .region::after { animation: none; opacity: 0; }
  .kx-leiste { display: none; }
}
/* Wortspannen übernehmen Farbe und Schrift der Überschrift, nicht die Regeln für farbige Zeilen */
.kx-split .kx-w, .kx-split .kx-w > span, .home-intro h1 .kx-w, .home-intro h1 .kx-w > span { color: inherit; font: inherit; letter-spacing: inherit; }
.kx-split .kx-w { display: inline-block; margin-top: 0; white-space: normal; }
.kx-split .kx-w > span { display: inline-block; margin-top: 0; }
.kx .kx-split.kx-r { transition: none; }

/* Nach Design-Prüfung: Handy-Überschrift weniger gequetscht, Mini-Grafik lesbarer */
@media(max-width:680px){h1{letter-spacing:-.02em}}
.kx-mini-roster .kx-cell{font-size:14px}

/* Hover-Bewegung nur auf Geräten mit Maus (am Handy löst ein Tippen sonst den Hover aus und die Karte bleibt angehoben) */
@media (hover: hover) and (pointer: fine) {
  .target:hover{transform:translateY(-3px);box-shadow:0 20px 40px #15365712;border-color:#b9d3ea}
  .connection-strip li:hover .line-icon,.benefit:hover .benefit-icon{transform:scale(1.08)}
  .benefit:hover,.preview-person:hover,.team-card:hover,.steps li:hover .step-copy{transform:translateY(-3px);box-shadow:0 18px 36px #15365710}
  .gvp-seal:hover img{transform:translateY(-3px);box-shadow:0 12px 24px #0f3a5c2b}
}