/* Kundenseiten im Design v3 (Entwurf freigegeben 05.11.2026): Empfehlerseite, Landingpage, Portal-Login, Portal.
   Eigener Namensraum k-*, damit style.css (Admin/Partner) unberührt bleibt. Tokens aus style.css (Design v3). */

body.k-seite { font-size: 15px; line-height: 1.6; background: #fff; color: var(--text); overflow-x: hidden; }
body.k-seite.k-portal-seite, body.k-seite.k-login-seite { background: var(--flaeche); }
body.k-seite > .fuss { display: none; }
.k-seite h1, .k-seite h2, .k-seite h3, .k-seite h4, .k-seite p { margin: 0; }
.k-seite h1, .k-seite h2, .k-seite h3 { line-height: 1.15; color: #0B0B0C; }
.k-seite a { color: inherit; }
.k-seite :focus-visible { outline: 2px solid #0B0B0C; outline-offset: 2px; }
.k-seite .icon.k-ic { width: 18px; height: 18px; vertical-align: middle; }
.k-grau { color: var(--grau); }
.k-klein { font-size: 13px; }
.k-seite .knopf { gap: 10px; font-size: 15px; text-align: center; }
.k-seite .knopf:active { transform: scale(.98); }
.k-seite .knopf.voll { width: 100%; }
.k-seite .knopf .pfeil { transition: transform .3s var(--ease); }
.k-seite .knopf:hover .pfeil { transform: translateX(3px); }
.k-seite .knopf.dunkel { background: #0B0B0C; color: #fff; border-color: #0B0B0C; }
.k-seite .knopf.primaer { color: #0B0B0C; }
.k-seite form .knopf.klein[type=submit], .k-seite .knopf.klein { width: auto; }

/* Kopf (sticky, Milchglas) */
.k-kopf { position: sticky; top: 0; z-index: 6; background: rgba(255,255,255,.88); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid var(--linie); }
.k-kopf .innen { display: flex; align-items: center; justify-content: space-between; height: 64px; gap: 12px; }
.k-kopf.mitte .innen { justify-content: center; }
.k-logo { height: 34px; width: auto; display: block; }
@media (max-width: 380px) { .k-kopf .k-logo { height: 28px; } .k-kopf .knopf.klein { padding: 0 14px; } }

/* Abschnitte */
.k-abschnitt { padding-block: 56px; }
.k-abschnitt.grau { background: var(--flaeche); }
@media (min-width: 900px) { .k-abschnitt { padding-block: 88px; } }
.k-held { padding-top: 40px; }
.k-zentriert { text-align: center; display: grid; justify-items: center; gap: 14px; }
.k-titel-gross { font-size: clamp(30px, 6.4vw, 52px); }
.k-titel-mittel { font-size: clamp(26px, 5vw, 40px); }
.k-lead { font-size: clamp(15px, 2.2vw, 18px); color: var(--grau); max-width: 52ch; }
.k-held-raster { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .k-held-raster { grid-template-columns: 1.05fr 1fr; gap: 64px; } .k-held-raster .k-foto { min-height: 440px; } }
.k-held-text { display: grid; gap: 18px; justify-items: start; }
.k-foto { position: relative; border-radius: 18px; overflow: hidden; background: linear-gradient(160deg, #2A2D31 0%, #101113 70%); min-height: 220px; }
.k-foto-mittel { min-height: 300px; }
.k-szene { position: absolute; inset: 0; width: 100%; height: 100%; }

.k-schritte { display: grid; gap: 16px; margin-top: 40px; }
@media (min-width: 900px) { .k-schritte { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.k-schritt { padding: 26px; border: 1px solid var(--linie); border-radius: var(--radius); background: #fff; display: grid; gap: 10px; align-content: start; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .3s, opacity .8s var(--ease); }
.k-schritt:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -24px rgba(0,0,0,.25); border-color: transparent; }
.k-schritt-nr { font-size: 46px; font-weight: 300; line-height: 1; color: #0B0B0C; font-variant-numeric: tabular-nums; }
.k-schritt-nr::after { content: ""; display: block; width: 28px; height: 3px; background: var(--gelb); border-radius: 2px; margin-top: 12px; }
.k-schritt h3 { font-size: 18px; font-weight: 500; letter-spacing: -0.01em; margin-top: 6px; }
.k-schritt p { color: var(--grau); font-size: 14.5px; }

.k-zwei { display: grid; gap: 32px; align-items: center; }
@media (min-width: 900px) { .k-zwei { grid-template-columns: 1fr 1fr; gap: 72px; } .k-zwei.unten { align-items: end; } }
.k-zwei > * { min-width: 0; }
.k-text { display: grid; gap: 18px; justify-items: start; }
.k-text p { color: var(--grau); font-size: 15.5px; max-width: 54ch; }
.k-haken-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.k-haken-liste li { display: flex; gap: 12px; align-items: center; font-size: 15px; }
.k-haken-liste .h { width: 26px; height: 26px; border-radius: 50%; background: var(--gelb-weich); display: grid; place-items: center; flex: none; }
.k-haken-liste .h svg { width: 14px; height: 14px; stroke-width: 2; }

/* Prämien */
.k-praemien-raster { display: grid; gap: 14px; margin-top: 36px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.k-praemien-raster.drei { margin-top: 14px; }
@media (min-width: 900px) { .k-praemien-raster.drei { grid-template-columns: repeat(3, 1fr); } }
.k-praemie { border: 1px solid var(--linie); border-radius: var(--radius); background: #fff; padding: 22px; display: grid; gap: 10px; align-content: start; transition: transform .35s var(--ease), box-shadow .35s var(--ease), opacity .8s var(--ease); }
.k-praemie:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -24px rgba(0,0,0,.25); }
.k-praemie .k-bild { height: 140px; border-radius: 14px; background: var(--flaeche); display: grid; place-items: center; overflow: hidden; }
.k-praemie.besonders .k-bild { background: var(--gelb-weich); }
.k-pbild { width: 112px; height: 112px; transition: transform .5s var(--ease); }
.k-praemie:hover .k-pbild, .k-praemie-gross:hover .k-pbild { transform: scale(1.06) rotate(-2deg); }
.k-praemie h3 { font-size: 17px; font-weight: 500; letter-spacing: -0.01em; }
.k-praemie p { font-size: 13.5px; color: var(--grau); }
.k-praemie-gross { margin-top: 36px; border: 1px solid var(--linie); border-radius: var(--radius); background: #fff; padding: 22px; display: grid; gap: 22px; align-items: center; transition: box-shadow .35s var(--ease), opacity .8s var(--ease), transform .8s var(--ease); }
.k-praemie-gross:hover { box-shadow: 0 18px 36px -24px rgba(0,0,0,.25); }
@media (min-width: 700px) { .k-praemie-gross { grid-template-columns: 260px 1fr; padding: 26px; gap: 36px; } }
.k-praemie-gross .k-bild { height: 200px; border-radius: 14px; background: var(--gelb-weich); display: grid; place-items: center; }
.k-praemie-gross .k-pbild { width: 160px; height: 160px; }
.k-praemie-text { display: grid; gap: 12px; justify-items: start; }
.k-praemie-text h3 { font-size: clamp(22px, 3.6vw, 32px); font-weight: 300; }
.k-betrag { font-weight: 600; }
.k-praemie-text p { color: var(--grau); font-size: 15px; max-width: 56ch; }

.k-kennzahl { display: grid; gap: 2px; margin-top: 8px; }
.k-kennzahl b { font-size: 48px; font-weight: 300; letter-spacing: -0.03em; line-height: 1; }
.k-sterne { display: flex; gap: 3px; color: var(--gelb); }
.k-sterne svg { width: 18px; height: 18px; fill: currentColor; stroke: none; }

.k-ziel-liste { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.k-ziel-liste li { display: grid; grid-template-columns: 10px 1fr; gap: 14px; }
.k-ziel-liste li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gelb); margin-top: 9px; }
.k-ziel-liste b { font-weight: 500; font-size: 16px; display: block; }
.k-ziel-liste span { color: var(--grau); font-size: 14.5px; }

.k-faq { display: grid; margin-top: 36px; max-width: 820px; width: 100%; text-align: left; }
.k-faq details { border-top: 1px solid var(--linie); }
.k-faq details:last-child { border-bottom: 1px solid var(--linie); }
.k-faq summary { list-style: none; cursor: pointer; padding: 20px 0; display: grid; grid-template-columns: 34px 1fr 18px; gap: 16px; align-items: center; font-size: 16px; font-weight: 500; }
.k-faq summary::-webkit-details-marker { display: none; }
.k-frage { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--linie); display: grid; place-items: center; font-size: 14px; font-weight: 400; }
.k-plus { width: 18px; height: 18px; position: relative; }
.k-plus::before, .k-plus::after { content: ""; position: absolute; left: 0; right: 0; top: 8.5px; height: 1px; background: var(--text); transition: transform .35s var(--ease); }
.k-plus::after { transform: rotate(90deg); }
.k-faq details[open] .k-plus::after { transform: rotate(0); }
.k-faq details > div { padding: 0 0 22px 50px; color: var(--grau); font-size: 14.5px; animation: v3-rein .4s var(--ease); }

.k-cta-dunkel { background: var(--dunkel); color: #fff; }
.k-cta-dunkel h2 { color: #fff; }
.k-cta-dunkel .innen { display: grid; gap: 26px; justify-items: start; padding-block: 64px; }
@media (min-width: 900px) { .k-cta-dunkel .innen { grid-template-columns: 1fr auto; align-items: end; padding-block: 88px; } }
.k-fuss-dunkel { background: var(--dunkel); color: rgba(255,255,255,.7); border-top: 1px solid rgba(255,255,255,.1); font-size: 13.5px; }
.k-fuss-dunkel .innen { display: grid; gap: 28px; padding-block: 40px 48px; }
.k-fuss-dunkel .innen.mitte { justify-items: center; text-align: center; gap: 14px; }
@media (min-width: 900px) { .k-fuss-dunkel .drei { grid-template-columns: 1.2fr 1fr 1fr; } }
.k-fuss-dunkel .k-logo { height: 32px; margin-bottom: 12px; }
.k-fuss-dunkel h4 { margin: 0 0 8px; color: #fff; font-weight: 500; font-size: 14px; }
.k-fuss-dunkel p + p { margin-top: 8px; }
.k-fuss-dunkel a { color: rgba(255,255,255,.7); text-decoration: none; display: block; padding: 2px 0; }
.k-fuss-dunkel a:hover { color: #fff; }
.k-fuss-links { display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; }
.k-steuer { margin-top: 12px !important; font-size: 12px; }
.k-fuss-hell { border-top: 1px solid var(--linie); padding: 22px 16px; display: flex; justify-content: center; gap: 40px; font-size: 13.5px; background: #fff; }
.k-fuss-hell a { text-decoration: none; }
.k-fuss-hell a:hover { text-decoration: underline; }

/* Formularteile */
.k-feld { display: grid; gap: 4px; }
.k-feld .schwebe input { background: #fff; }
.k-feld.fehlt .schwebe input { border-color: #B42318; }
.k-fehler { font-size: 12.5px; color: #B42318; padding-left: 4px; }
.k-formular-box .k-fehler, .k-formular-box .k-haken + .k-fehler { color: #FFB4AB; }
.k-reihe2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
@media (max-width: 380px) { .k-reihe2 { grid-template-columns: 1fr; } }
.k-haken { display: grid; grid-template-columns: 20px 1fr; gap: 10px; font-size: 12.5px; color: var(--grau); line-height: 1.5; cursor: pointer; text-align: left; }
.k-haken input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: #0B0B0C; }
.k-haken a { text-decoration: underline; }
.k-formular { display: grid; gap: 12px; }
.k-label { font-size: 13.5px; font-weight: 500; color: var(--text); }
.k-info { text-align: center; color: var(--grau); font-size: 14.5px; }
.k-info.links { text-align: left; font-size: 14px; }
.k-info.klein { font-size: 13px; }
.k-info b { color: var(--text); font-weight: 600; word-break: break-word; }
.k-ok { display: flex; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 14px; background: var(--gruen-weich, #E6F3EC); color: #1F7A4D; font-size: 13.5px; }
.k-linkfeld { display: flex; align-items: center; gap: 8px; border: 1px solid var(--linie); border-radius: 14px; padding: 4px 4px 4px 14px; min-width: 0; min-height: 46px; background: #fff; }
.k-seite .k-linkfeld input { flex: 1; min-width: 0; border: 0; padding: 0; min-height: 36px; height: 36px; font-size: 13.5px; color: var(--grau); background: transparent; box-shadow: none; text-overflow: ellipsis; }
.k-mini { min-height: 38px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--linie); background: #fff; cursor: pointer; font: inherit; font-size: 13px; font-weight: 500; display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; color: var(--text); transition: background .2s, border-color .2s, color .2s; }
.k-mini:hover { border-color: var(--text); }
.k-mini.ok { background: #E6F3EC; border-color: #E6F3EC; color: #1F7A4D; }
.k-seite textarea.k-nachricht { width: 100%; min-height: 150px; border: 1px solid var(--linie); border-radius: 14px; padding: 14px; font: inherit; font-size: 14px; line-height: 1.6; color: var(--text); resize: vertical; background: var(--flaeche); }
.k-seite textarea.k-nachricht:focus { background: #fff; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Teilen-Fenster */
.k-fenster-hg:target { display: grid !important; } /* ohne JS: öffnen über #teilen */
.k-fenster-kopf { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.k-fenster-kopf h2 { font-size: 26px; }
.k-zu { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--linie); background: #fff; cursor: pointer; display: grid; place-items: center; flex: none; text-decoration: none; }
.k-zu:hover { border-color: var(--text); }
.k-stapel { display: grid; gap: 10px; }
.k-post { width: 64px; height: 64px; justify-self: center; border-radius: 50%; background: var(--gelb-weich); display: grid; place-items: center; animation: k-schweben 3s ease-in-out infinite; }
.k-post .k-ic { width: 28px; height: 28px; }
@keyframes k-schweben { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

/* Landingpage */
.k-landing { max-width: 640px; margin: 0 auto; padding: 36px 22px 56px; display: grid; gap: 26px; text-align: center; }
.k-zielgruppe { font-size: 13px; font-weight: 500; }
.k-landing h1 { font-size: clamp(26px, 5.4vw, 38px); }
.k-landing h1 b { font-weight: 600; }
.k-landing > p { font-size: 15px; }
.k-landing > p b { font-weight: 600; }
.k-sprung { text-decoration: underline; }
.k-badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: -8px; }
.k-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; padding: 6px 12px; border-radius: 999px; background: var(--flaeche); border: 1px solid var(--linie); }
.k-badge .k-ic { width: 15px; height: 15px; }
.k-video { position: relative; aspect-ratio: 16/9; max-width: 100%; border-radius: 18px; overflow: hidden; background: linear-gradient(160deg, #2A2D31, #0E0F11); }
.k-video video, .k-video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; }
.k-formular-box { background: #0B0B0C; border-radius: 22px; padding: 22px; display: grid; gap: 12px; text-align: left; }
.k-formular-box .schwebe input { border-color: transparent; }
.k-formular-box .k-feld.fehlt .schwebe input { border-color: #FFB4AB; }
.k-formular-box .k-haken { color: rgba(255,255,255,.8); }
.k-formular-box .k-haken a { color: #fff; }
.k-formular-box .k-haken input { accent-color: var(--gelb); }
.k-danke { background: #0B0B0C; color: #fff; border-radius: 22px; padding: 28px 24px; display: grid; gap: 12px; justify-items: center; text-align: center; }
.k-danke svg { width: 64px; height: 64px; }
.k-danke circle { stroke: var(--gelb); stroke-width: 2; fill: none; stroke-dasharray: 189; stroke-dashoffset: 189; animation: k-zeichnen .7s var(--ease) forwards; }
.k-danke path { stroke: #fff; stroke-width: 2.5; fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: k-zeichnen .45s .55s var(--ease) forwards; }
@keyframes k-zeichnen { to { stroke-dashoffset: 0; } }
.k-danke p { font-size: 17px; font-weight: 300; }
.k-person { display: flex; gap: 18px; align-items: center; justify-content: center; text-align: left; }
.k-avatar { width: 96px; height: 96px; border-radius: 50%; flex: none; background: var(--flaeche); display: grid; place-items: center; font-size: 26px; font-weight: 300; border: 3px solid var(--gelb); object-fit: cover; }
.k-person b { font-size: 18px; font-weight: 500; display: block; }
.k-person span { display: block; font-size: 14px; }
.k-person .k-klein { color: var(--grau); }
.k-person a { text-decoration: none; }

/* Portal-Login */
.k-login-buehne { padding: 56px 22px 72px; display: grid; place-items: center; background: var(--flaeche); min-height: calc(100vh - 70px); }
.k-login-karte { width: min(100%, 520px); background: #fff; border: 1px solid var(--linie); border-radius: 22px; padding: 36px 28px 28px; display: grid; gap: 20px; box-shadow: 0 24px 48px -32px rgba(0,0,0,.25); }
.k-login-karte > .k-logo { justify-self: center; height: 40px; }
.k-login-karte h1 { font-size: 24px; text-align: center; }
.k-login-karte h1 b { font-weight: 600; }
.k-login-fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; }
.k-zurueck { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--linie); background: #fff; display: grid; place-items: center; text-decoration: none; }
.k-zurueck:hover { border-color: var(--text); }
.k-rechts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13.5px; color: var(--grau); }
.k-faq-klein details { border-top: 1px solid var(--linie); }
.k-faq-klein details:last-child { border-bottom: 1px solid var(--linie); }
.k-faq-klein summary { list-style: none; cursor: pointer; padding: 14px 4px; display: flex; justify-content: space-between; gap: 12px; font-size: 14.5px; font-weight: 500; }
.k-faq-klein summary::-webkit-details-marker { display: none; }
.k-faq-klein summary svg { transition: transform .35s var(--ease); }
.k-faq-klein details[open] summary svg { transform: rotate(180deg); }
.k-faq-klein p { padding: 0 4px 14px; font-size: 13.5px; color: var(--grau); animation: v3-rein .4s var(--ease); }

/* Portal */
.k-portal { padding-block: 36px 56px; display: grid; gap: 32px; }
.k-gruss h1 { font-size: clamp(28px, 5vw, 40px); }
.k-gruss h1 b { font-weight: 600; }
.k-gruss p { color: var(--grau); margin-top: 4px; }
.k-karte { background: #fff; border-radius: var(--radius); padding: 24px; display: grid; gap: 16px; align-content: start; min-width: 0; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 14px 36px -22px rgba(0,0,0,.22); transition: box-shadow .35s var(--ease), opacity .8s var(--ease), transform .8s var(--ease); }
.k-karte:hover { box-shadow: 0 1px 2px rgba(0,0,0,.05), 0 20px 44px -22px rgba(0,0,0,.28); }
@media (max-width: 480px) { .k-karte { padding: 18px; } }
.k-karte-kopf { display: flex; gap: 14px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--linie); }
.k-karte-kopf .ico { width: 42px; height: 42px; border-radius: 12px; background: var(--gelb-weich); display: grid; place-items: center; flex: none; }
.k-karte-kopf h2 { font-size: 19px; font-weight: 400; letter-spacing: -0.01em; }
.k-karte-kopf p { font-size: 12.5px; color: var(--grau); }
.k-raster-a, .k-raster-b, .k-raster-c { display: grid; gap: 22px; }
.k-raster-a > *, .k-raster-b > *, .k-raster-c > * { min-width: 0; }
@media (min-width: 1000px) { .k-raster-a { grid-template-columns: 1.7fr 1fr; } .k-raster-b { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .k-raster-c { grid-template-columns: 1.4fr 1fr; align-items: start; } }
.k-seite select.k-auswahl { width: 100%; height: 50px; border: 1px solid var(--linie); border-radius: 14px; padding: 0 14px; font: inherit; font-size: 14.5px; background: #fff; }
.k-zeile-knopf { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.k-zeile-knopf .k-mini { min-height: 46px; }
@media (max-width: 520px) { .k-zeile-knopf { grid-template-columns: 1fr; } }
.k-kanaele { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 620px) { .k-kanaele { grid-template-columns: 1fr 1fr; } }
.k-kanaele .knopf { min-height: 46px; padding: 0 12px; font-size: 14px; }
.k-tipp { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--gelb-weich); font-size: 13.5px; }
.k-tipp b { font-weight: 500; }
.k-tipp .k-ic { margin-top: 1px; }
.k-stat-raster { display: grid; grid-template-columns: 1fr 1fr; }
.k-stat { padding: 18px 8px; display: grid; justify-items: center; gap: 6px; text-align: center; }
.k-stat:nth-child(odd) { border-right: 1px solid var(--linie); }
.k-stat:nth-child(-n+2) { border-bottom: 1px solid var(--linie); }
.k-stat .ico { width: 40px; height: 40px; border-radius: 12px; background: var(--flaeche); display: grid; place-items: center; }
.k-stat .was { font-size: 12.5px; color: var(--grau); }
.k-stat .wert { font-size: 26px; font-weight: 300; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; line-height: 1; color: #0B0B0C; }
.k-hinweis-box { border: 1px solid var(--linie); border-radius: 14px; padding: 12px; text-align: center; font-size: 13px; color: var(--grau); }

.k-stand-legende { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--grau); }
.k-stand-legende b { font-weight: 500; color: var(--text); }
.k-werkzeugleiste { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; }
.k-suche { display: flex; align-items: center; gap: 8px; border: 1px solid var(--linie); border-radius: 12px; padding: 0 12px; height: 44px; min-width: 0; flex: 1 1 200px; max-width: 360px; color: var(--grau); }
.k-seite .k-suche input { border: 0; outline: 0; font: inherit; font-size: 14px; min-width: 0; flex: 1; background: transparent; min-height: 0; height: 40px; padding: 0; box-shadow: none; color: var(--text); }
.k-tab-wrap { overflow-x: auto; }
.k-tabelle { width: 100%; border-collapse: collapse; font-size: 14px; }
.k-tabelle th { text-align: left; font-weight: 500; font-size: 12.5px; color: var(--grau); padding: 10px 12px; border-bottom: 1px solid var(--linie); white-space: nowrap; }
.k-tabelle td { padding: 14px 12px; border-bottom: 1px solid var(--linie); white-space: nowrap; vertical-align: middle; }
.k-tabelle tbody tr { transition: background .2s; }
.k-tabelle tbody tr:hover { background: var(--flaeche); }
.k-beleg { display: inline-grid; place-items: center; }
.k-tab-fuss { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--grau); }
.k-leer { padding: 22px; border: 1px dashed var(--linie); border-radius: 14px; text-align: center; color: var(--grau); font-size: 14px; }
/* Handy: Tabelle als Karten */
@media (max-width: 640px) {
  .k-tabelle thead { display: none; }
  .k-tabelle, .k-tabelle tbody, .k-tabelle tr, .k-tabelle td { display: block; width: 100%; }
  .k-tabelle tr { border: 1px solid var(--linie); border-radius: 14px; padding: 10px 14px; margin-bottom: 10px; }
  .k-tabelle td { border: 0; padding: 6px 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; white-space: normal; }
  .k-tabelle td::before { content: attr(data-titel); font-size: 12px; color: var(--grau); }
  .k-tabelle td[data-titel="Name"] { font-weight: 500; font-size: 15px; }
  .k-tabelle td[data-titel="Name"]::before { content: none; }
  .k-tabelle td[data-titel="Stand"] { display: block; }
  .k-tabelle td[data-titel="Stand"]::before { content: none; }
}

.k-stand { display: grid; gap: 6px; min-width: 170px; }
.k-stand-text { font-size: 13px; font-weight: 500; display: inline-flex; align-items: center; gap: 6px; }
.k-stand-text::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gelb); flex: none; }
.k-stand.offen .k-stand-text::before { animation: k-puls 2s infinite; }
.k-stand.kunde .k-stand-text { color: #1F7A4D; }
.k-stand.kunde .k-stand-text::before { background: #1F7A4D; }
.k-stand.aus .k-stand-text, .k-stand.spaeter .k-stand-text { color: var(--grau); }
.k-stand.aus .k-stand-text::before { background: #C9CDD1; }
.k-stand.spaeter .k-stand-text::before { background: #8A8F96; }
.k-stand-balken { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; max-width: 180px; }
.k-stand-balken i { height: 4px; border-radius: 4px; background: var(--flaeche2); position: relative; overflow: hidden; }
.k-stand-balken i.an::after { content: ""; position: absolute; inset: 0; background: #0B0B0C; transform-origin: left; animation: k-fuellen .6s var(--ease) both; }
.k-stand-balken i.an:nth-child(2)::after { animation-delay: .12s; } .k-stand-balken i.an:nth-child(3)::after { animation-delay: .24s; } .k-stand-balken i.an:nth-child(4)::after { animation-delay: .36s; }
.k-stand.kunde .k-stand-balken i.an::after { background: #1F7A4D; }
.k-stand.aus .k-stand-balken i.an::after { background: #C9CDD1; }
.k-stand.spaeter .k-stand-balken i.an::after { background: #8A8F96; }
@keyframes k-fuellen { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes k-puls { 0%, 100% { box-shadow: 0 0 0 0 rgba(247,198,0,.6); } 50% { box-shadow: 0 0 0 5px rgba(247,198,0,0); } }

.k-bonus { display: grid; grid-template-columns: 96px 1fr; gap: 18px; align-items: center; }
@media (max-width: 480px) { .k-bonus { grid-template-columns: 72px 1fr; } }
.k-bonus .k-bild { aspect-ratio: 1; border-radius: 14px; background: var(--gelb-weich); display: grid; place-items: center; }
.k-bonus .k-pbild { width: 86%; height: 86%; }
.k-bonus h3 { font-size: 20px; font-weight: 500; letter-spacing: -0.01em; }
.k-bonus p { font-size: 14px; }
.k-bonus p b { color: var(--text); font-weight: 600; }
.k-balken-zeile { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--grau); margin-top: 6px; }
.k-balken { height: 8px; border-radius: 99px; background: var(--flaeche2); overflow: hidden; margin-top: 6px; }
.k-balken > i { display: block; height: 100%; width: var(--w, 0); border-radius: 99px; background: #0B0B0C; transition: width 1.3s var(--ease); }
.js .k-balken > i { width: 0; } /* common.js füllt per data-breite */
.k-bonus-zahlen { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--linie); border-radius: 14px; }
.k-bonus-zahlen > div { padding: 12px 14px; display: grid; gap: 2px; }
.k-bonus-zahlen > div + div { border-left: 1px solid var(--linie); }
.k-bonus-zahlen .was { font-size: 12.5px; color: var(--grau); }
.k-bonus-zahlen b { font-size: 22px; font-weight: 300; font-variant-numeric: tabular-nums; }
.k-alle { border: 1px solid var(--linie); border-radius: 14px; }
.k-alle summary { list-style: none; cursor: pointer; display: flex; gap: 12px; align-items: center; padding: 12px 14px; }
.k-alle summary::-webkit-details-marker { display: none; }
.k-alle summary .ico { width: 34px; height: 34px; border-radius: 10px; background: var(--gelb-weich); display: grid; place-items: center; flex: none; }
.k-alle summary b { font-weight: 500; }
.k-alle .pfeil-ab { margin-left: auto; transition: transform .35s var(--ease); }
.k-alle[open] .pfeil-ab { transform: rotate(180deg); }
.k-alle ul { list-style: none; margin: 0; padding: 0 14px 10px; }
.k-alle li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--linie); font-size: 13.5px; }
.k-alle li.erreicht span:first-child::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #1F7A4D; margin-right: 8px; vertical-align: 2px; }

.k-rang-eigen { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: var(--gelb-weich); }
.k-rang-eigen b { font-weight: 500; font-size: 16px; }
.k-rang-top { display: grid; justify-items: end; font-size: 12px; text-align: right; }
.k-rang-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.k-rang-liste li { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 12px 14px; border: 1px solid var(--linie); border-radius: 14px; font-size: 14px; }
.k-rang-liste li.du { border-color: #0B0B0C; font-weight: 500; }
.k-rang-liste .meta { font-size: 12px; color: var(--grau); font-weight: 400; }
.k-rang-liste .platz { font-size: 18px; font-weight: 300; }
.k-feed { list-style: none; margin: 0; padding: 0; display: grid; }
.k-feed li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--linie); font-size: 13.5px; }
.k-feed li:last-child { border-bottom: 0; }
.k-feed .fi { width: 30px; height: 30px; border-radius: 10px; background: var(--flaeche); display: grid; place-items: center; }
.k-feed .fi svg { width: 15px; height: 15px; }
.k-feed time { display: block; font-size: 11.5px; color: var(--grau); }

.k-story { position: relative; aspect-ratio: 9/14; max-width: 100%; border-radius: 16px; overflow: hidden; background: linear-gradient(170deg, #1E2023, #0B0B0C); color: #fff; display: grid; align-content: center; justify-items: center; gap: 12px; padding: 18px 18px 60px; text-align: center; }
.k-sticker { background: #fff; color: #0B0B0C; border-radius: 10px; padding: 8px 12px; font-size: 13.5px; font-weight: 500; line-height: 1.35; max-width: 90%; }
.k-sticker.gelb { background: var(--gelb); }
.k-story-qr { width: 112px; height: 112px; border-radius: 10px; background: #fff; padding: 6px; }
.k-linkchip { background: #fff; color: #0B0B0C; border-radius: 999px; padding: 6px 14px; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.k-linkchip .k-ic { width: 14px; height: 14px; }
.k-aktionen { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; justify-content: space-between; }
.k-aktionen a, .k-aktionen button { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.18); display: grid; place-items: center; color: #fff; border: 0; cursor: pointer; padding: 0; }
.k-aktionen a:hover, .k-aktionen button:hover { background: rgba(255,255,255,.3); }
.k-sun { position: absolute; right: 18px; top: 18px; width: 34px; height: 34px; border-radius: 50%; background: var(--gelb); box-shadow: 0 0 40px 10px rgba(247,198,0,.35); }
.k-hilfe { display: grid; gap: 12px; align-content: start; justify-items: start; padding: 20px; border-radius: 16px; background: var(--flaeche); }
.k-hilfe h3 { font-size: 18px; font-weight: 500; letter-spacing: -0.01em; }
.k-hilfe p { font-size: 13.5px; color: var(--grau); }
.k-abmelden { display: flex; justify-content: center; }

@media (prefers-reduced-motion: reduce) {
  .k-post { animation: none; }
  .k-stand.offen .k-stand-text::before { animation: none; }
  .k-balken > i { transition: none; }
}

/* Überschreibt die allgemeine .teilen-knoepfe-Anordnung aus style.css */
.k-seite .teilen-knoepfe.k-stapel { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0; }
.k-seite .teilen-knoepfe.k-stapel .knopf { grid-column: auto; width: 100%; }
.k-seite .teilen-knoepfe.k-kanaele { margin: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.k-seite .teilen-knoepfe.k-kanaele [data-kanal=whatsapp] { grid-column: auto; }
.k-seite .teilen-knoepfe.k-kanaele .knopf { min-width: 0; white-space: nowrap; }
@media (max-width: 620px) { .k-seite .teilen-knoepfe.k-kanaele { grid-template-columns: 1fr 1fr; } }
.k-linkfeld:focus-within { border-color: #0B0B0C; box-shadow: 0 0 0 4px var(--gelb-weich); }
.k-seite .k-linkfeld input:focus, .k-seite .k-linkfeld input:focus-visible { outline: none; box-shadow: none; }
.k-seite .k-suche:focus-within { border-color: #0B0B0C; }
.k-seite .k-suche input:focus, .k-seite .k-suche input:focus-visible { outline: none; box-shadow: none; }
/* Tabelle: globale Admin-Tabellenoptik (schwarzer Kopf, Zebra) aus style.css neutralisieren */
.k-seite .k-tabelle th { background: transparent; color: var(--grau); border-radius: 0; }
.k-seite .k-tabelle tbody tr:nth-child(even) td { background: transparent; }
.k-seite .k-tabelle tbody tr:hover td { background: var(--flaeche); }
.k-person .k-avatar { display: grid; font-size: 26px; color: #0B0B0C; }
.k-landing h1 .hl { white-space: nowrap; }
.k-formular-box .knopf { padding: 0 16px; }
.k-seite .k-post .k-ic { width: 28px; height: 28px; }