/* =====================================================================
   Kindersicherheitswelt — Unterseiten im Stil der Startseite v4 (30.09.2026)
   Teil 1: gemeinsamer Rahmen (Netz-Hintergrund, Header, Fortschritt)
   Teil 2: Artikel-Vorlage (.ka-*). Mobile first, ergänzt styles.css.
   ===================================================================== */
:root {
  --kv-ease: cubic-bezier(.2,.7,.2,1);
  --kv-ease-out: cubic-bezier(.16,1,.3,1);
  --kv-amber: #e09a2b;
  --ka-chap: 50px;
}

/* ---------- Rahmen ---------- */
.kv-sub { position: relative; background: var(--ks-cream); isolation: isolate; }
.kv-sub > section, .kv-sub > .ka-hero { position: relative; z-index: 1; }
.kv-bg { position: fixed; left: 0; top: 0; z-index: 0; pointer-events: none; transition: opacity .6s var(--kv-ease); }
.kv-dot { font-style: normal; color: var(--ks-red); display: inline-block; }
.k-header { transition: transform .45s var(--kv-ease), background .3s, box-shadow .3s, border-color .3s; }
body.kv-hdr-hide .k-header { transform: translateY(-105%); }
.kv-progress { position: fixed; left: 0; right: 0; top: 0; height: 3px; z-index: 1000; background: var(--ks-red); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
.js .kv-rv { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--kv-ease), transform 1s var(--kv-ease-out); }
.js .kv-rv.is-in { opacity: 1; transform: none; }
.ka-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- 1 Einstieg ---------- */
.ka-hero { padding: 18px 0 8px; }
.ka-hero__grid { display: grid; gap: 0; }
.ka-hero .ks-breadcrumb { margin: 0 0 14px; }
.ka-hero .ks-chip { margin: 0 0 14px; }
.ka-title { font-family: var(--f-display); font-weight: 800; letter-spacing: -.04em; line-height: 1.02; font-size: clamp(34px, 9.6vw, 68px); color: var(--ks-ink); margin: 0 0 14px; text-wrap: balance; hyphens: manual; }
.ka-meta { margin: 0 0 22px; }
.ka-hero__img { margin: 0 0 22px; }
.ka-hero__shape { position: relative; aspect-ratio: 5 / 4; overflow: hidden; border-radius: 46% 54% 42% 58% / 55% 45% 55% 45%; box-shadow: 0 40px 80px -50px rgba(107,29,34,.55); transform: scale(calc(1 - var(--p, 0) * .07)) translateY(calc(var(--p, 0) * 18px)); transform-origin: 50% 0; animation: kaMorph 18s ease-in-out infinite alternate; will-change: transform; }
.ka-hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; display: block; transform: scale(calc(1.06 + var(--p, 0) * .08)); }
@keyframes kaMorph { 0% { border-radius: 46% 54% 42% 58% / 55% 45% 55% 45%; } 100% { border-radius: 56% 44% 52% 48% / 44% 56% 44% 56%; } }
.js .ka-hero__shape { clip-path: circle(0% at 55% 55%); transition: clip-path 1.5s var(--kv-ease-out) .1s; }
.js .ka-hero.is-in .ka-hero__shape { clip-path: circle(80% at 55% 55%); }
.js .ka-hero__head > *, .js .ka-lead { opacity: 0; transform: translateY(18px); transition: opacity .8s var(--kv-ease), transform .9s var(--kv-ease-out); }
.js .ka-hero.is-in .ka-hero__head > *, .js .ka-hero.is-in .ka-lead { opacity: 1; transform: none; }
.js .ka-hero.is-in .ka-hero__head > :nth-child(2) { transition-delay: .06s; }
.js .ka-hero.is-in .ka-hero__head > :nth-child(3) { transition-delay: .12s; }
.js .ka-hero.is-in .ka-hero__head > :nth-child(4) { transition-delay: .2s; }
.js .ka-hero.is-in .ka-lead { transition-delay: .35s; }
.ka-lead { font-size: 17.5px; line-height: 1.62; color: var(--c-text); margin: 0; max-width: 620px; text-wrap: pretty; }
@media (min-width: 1000px) {
  .ka-hero { padding: 48px 0 20px; }
  .ka-hero__grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); grid-template-areas: "head img" "foot img"; column-gap: 64px; align-items: end; }
  .ka-hero__head { grid-area: head; align-self: end; }
  .ka-hero__foot { grid-area: foot; align-self: start; }
  .ka-hero__img { grid-area: img; margin: 0; align-self: center; }
  .ka-hero__shape { aspect-ratio: 1 / 1.02; }
  .ka-title { font-size: clamp(44px, 4.6vw, 70px); }
  .ka-lead { font-size: 19px; }
}

/* ---------- Lesebereich: Papier vor dem Netz ---------- */
.ka-art .ks-art { background: transparent; }
@media (min-width: 1100px) {
  .ka-art .ks-prose { background: rgba(255,255,255,.72); border-radius: 36px; padding: 44px 52px 40px; box-shadow: 0 0 0 1px rgba(107,29,34,.05); }
}

/* ---------- 2 Stapelkarten „Das Wichtigste vorab“ ---------- */
.ka-stack { margin: 8px 0 40px; }
.ks-prose .ka-stack h2 { margin: 0 0 10px; font-size: clamp(28px, 7.6vw, 40px); letter-spacing: -.035em; line-height: 1.05; }
.ka-stack__intro { font-size: 16.5px; color: var(--ks-muted); }
.ks-page .ks-prose .ka-cards { list-style: none; margin: 18px 0 0; padding: 0 0 8px; counter-reset: none; }
.ks-page .ks-prose .ka-cards > li::before { display: none; }
.ks-page .ks-prose .ka-card { position: sticky; top: calc(var(--ks-hdr) + var(--ka-chap) + 14px + var(--i) * 6px); margin: 0 0 14px; padding: 22px 22px 22px 20px; min-height: 124px; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; align-items: start; background: #fff; border-radius: 26px; box-shadow: 0 26px 50px -30px rgba(107,29,34,.5), 0 0 0 1px rgba(107,29,34,.06); line-height: 1.5; font-size: 16.5px; transform-origin: 50% 0; transform: scale(calc(1 - var(--c, 0) * .05)); transition: transform .2s linear; }
body.kv-hdr-hide .ks-page .ks-prose .ka-card { top: calc(var(--ka-chap) + 14px + var(--i) * 6px); }
.ka-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: var(--ks-cream); opacity: calc(var(--c, 0) * .55); pointer-events: none; }
.ka-card__n { font-family: var(--f-display); font-weight: 800; font-size: 34px; line-height: 1; letter-spacing: -.04em; color: var(--ks-red); padding-top: 2px; }
.ka-card__n--dot { width: 44px; height: 44px; border-radius: 14px; background: var(--ks-red-soft); position: relative; }
.ka-card__n--dot::before { content: ''; position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; background: var(--ks-red); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%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='%23000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat; }
.ka-card__t { align-self: center; color: var(--c-text); }
.ka-card__t strong { display: block; font-family: var(--f-display); font-size: 19px; line-height: 1.25; font-weight: 700; letter-spacing: -.01em; color: var(--ks-ink); margin-bottom: 2px; }
.ka-card:last-child { margin-bottom: 0; }
.ka-stack__note { position: relative; z-index: 2; margin: 18px 0 0 !important; padding: 20px 22px; border-radius: 22px; background: var(--ks-wine); color: rgba(255,255,255,.86); font-size: 16px; line-height: 1.55; }
.ka-stack__note strong { color: #fff; }
@media (min-width: 900px) {
  .ks-page .ks-prose .ka-card { grid-template-columns: 70px minmax(0, 1fr); padding: 26px 30px; min-height: 120px; }
  .ka-card__n { font-size: 42px; }
}

/* ---------- Schrittfolgen im Text (1. 2. 3. …) ---------- */
.ks-prose h3.ka-step { position: relative; display: flex; align-items: center; gap: 14px; margin-top: 34px; }
.ka-step__n { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--ks-red); color: #fff; font-size: 17px; font-weight: 800; letter-spacing: -.02em; box-shadow: 0 10px 22px -12px rgba(216,37,41,.8); }
.ks-prose h3.ka-step + p, .ks-prose h3.ka-step + p + p { padding-left: 54px; }
@media (max-width: 480px) { .ks-prose h3.ka-step + p, .ks-prose h3.ka-step + p + p { padding-left: 0; } }

/* ---------- 112-Abschnitt ---------- */
.ka-alert { margin: 40px 0 28px; padding: 24px 22px 8px; border-radius: 26px; background: linear-gradient(160deg, #fff, #fdecec); box-shadow: inset 0 0 0 1.5px rgba(216,37,41,.22), 0 30px 60px -44px rgba(216,37,41,.5); }
.ks-prose .ka-alert h2 { margin-top: 0; display: flex; gap: 12px; align-items: center; }
.ks-prose .ka-alert h2::before { content: '112'; flex-shrink: 0; display: grid; place-items: center; width: 56px; height: 34px; border-radius: 999px; background: var(--ks-red); color: #fff; font-size: 15px; font-weight: 800; letter-spacing: .02em; }
@media (min-width: 900px) { .ka-alert { padding: 30px 32px 12px; } }

/* ---------- Merkblöcke (kurze Artikel) ---------- */
.ka-key { position: relative; margin: 8px 0 40px; padding: 30px 24px 26px; border-radius: 30px; overflow: hidden; isolation: isolate; }
.ka-key::before { content: ''; position: absolute; width: 300px; height: 300px; right: -120px; top: -140px; border-radius: 50%; z-index: -1; }
.ka-key--1 { background: linear-gradient(160deg, #6b1d22, #3f1014); color: rgba(255,255,255,.86); box-shadow: 0 34px 64px -34px rgba(107,29,34,.85); }
.ka-key--1::before { background: radial-gradient(circle, rgba(216,37,41,.55), transparent 70%); }
.ka-key--2 { background: linear-gradient(160deg, #fff, #fbeee4); box-shadow: 0 30px 60px -44px rgba(107,29,34,.45), inset 0 0 0 1px rgba(107,29,34,.06); }
.ka-key--2::before { background: radial-gradient(circle, rgba(224,154,43,.35), transparent 70%); }
.ks-prose .ka-key h2 { margin: 0 0 12px; font-size: clamp(28px, 7.6vw, 40px); letter-spacing: -.035em; line-height: 1.05; }
.ks-prose .ka-key--1 h2 { color: #fff; }
.ka-key--1 .ka-key__intro, .ka-key--1 .ka-key__note { color: rgba(255,255,255,.8); }
.ka-key--1 strong { color: #fff; }
.ks-page .ks-prose .ka-key__list { margin: 16px 0 0; }
.ks-page .ks-prose .ka-key__list > li { padding: 16px 0 16px 46px; margin: 0; font-size: 17.5px; line-height: 1.5; border-top: 1px solid rgba(255,255,255,.14); }
.ka-key--2 .ka-key__list > li { border-top-color: rgba(107,29,34,.1) !important; }
.ks-page .ks-prose .ka-key__list > li::before { left: 0; top: 16px; width: 30px; height: 30px; border-radius: 50%; background: rgba(242,176,74,.2); content: ''; }
.ks-page .ks-prose .ka-key__list > li::after { content: ''; position: absolute; left: 8px; top: 24px; width: 14px; height: 14px; background: #f2b04a; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%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='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat; }
.ks-page .ks-prose .ka-key--2 .ka-key__list > li::before { background: rgba(216,37,41,.1); }
.ks-page .ks-prose .ka-key--2 .ka-key__list > li::after { background: var(--ks-red); -webkit-mask: none; mask: none; width: 8px; height: 8px; left: 11px; top: 27px; border-radius: 50%; }
.js .ka-key__list > li { opacity: 0; transform: translateX(-14px); transition: opacity .6s var(--kv-ease), transform .8s var(--kv-ease-out); transition-delay: calc(var(--i, 0) * 80ms + .1s); }
.js .ka-key.is-in .ka-key__list > li { opacity: 1; transform: none; }
.ka-key p:last-child { margin-bottom: 0; }
@media (min-width: 900px) { .ka-key { padding: 40px 44px 34px; } .ks-page .ks-prose .ka-key__list > li { font-size: 18.5px; } }

/* ---------- 3 Kapitel-Anzeige (Handy/Tablet) ---------- */
.ka-chap { position: fixed; left: 0; right: 0; top: var(--ks-hdr); z-index: 90; height: var(--ka-chap); background: rgba(250,246,240,.94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(107,29,34,.07); transform: translateY(-110%); opacity: 0; pointer-events: none; transition: transform .45s var(--kv-ease), opacity .3s, top .45s var(--kv-ease); }
.ka-chap.is-on { transform: none; opacity: 1; pointer-events: auto; }
body.kv-hdr-hide .ka-chap { top: 0; }
.ka-chap__btn { width: 100%; height: 100%; border: 0; background: none; padding: 0 var(--ks-pad); display: flex; align-items: center; gap: 12px; font-family: var(--f-body); color: var(--ks-ink); cursor: pointer; text-align: left; }
.ka-chap__n { flex-shrink: 0; font-size: 12px; font-weight: 700; color: var(--ks-red); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.ka-chap__t { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ka-chap__ic { flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: #fff; color: var(--ks-wine); box-shadow: 0 6px 16px -10px rgba(107,29,34,.5); }
.ka-chap__ic svg { width: 18px; height: 18px; }
.ka-chap__fill { position: absolute; left: 0; bottom: -1px; height: 2px; width: 100%; background: var(--ks-red); transform-origin: 0 50%; transform: scaleX(var(--pr, 0)); }
.ka-chap__t.is-swap { animation: kaSwap .4s var(--kv-ease-out); }
@keyframes kaSwap { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (min-width: 1100px) { .ka-chap { display: none; } :root { --ka-chap: 0px; } }
.ka-nw { white-space: nowrap; }
@media (max-width: 1099px) { .ka-art ~ .kv-progress { display: none; } }
/* Scroll-Ziel unter Header + Kapitel-Anzeige */
.ka-art .ks-prose h2, .ka-art .ks-prose h3 { scroll-margin-top: calc(var(--ks-hdr) + var(--ka-chap) + 16px); }

/* Inhalt als Blatt von unten */
.ka-sheet { position: fixed; inset: 0; z-index: 1200; }
.ka-sheet[hidden] { display: none; }
.ka-sheet__scrim { position: absolute; inset: 0; background: rgba(29,29,27,.45); opacity: 0; transition: opacity .35s; }
.ka-sheet__panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 78vh; overflow: auto; background: var(--ks-cream); border-radius: 28px 28px 0 0; padding: 8px 20px calc(24px + env(safe-area-inset-bottom)); transform: translateY(100%); transition: transform .45s var(--kv-ease-out); overscroll-behavior: contain; }
.ka-sheet.is-open .ka-sheet__scrim { opacity: 1; }
.ka-sheet.is-open .ka-sheet__panel { transform: none; }
.ka-sheet__head { position: sticky; top: -8px; display: flex; align-items: center; justify-content: space-between; padding: 14px 0 10px; background: var(--ks-cream); }
.ka-sheet__head::before { content: ''; position: absolute; left: 50%; top: 4px; width: 40px; height: 4px; margin-left: -20px; border-radius: 4px; background: rgba(107,29,34,.18); }
.ka-sheet__head b { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--ks-red); }
.ka-sheet__x { width: 38px; height: 38px; border-radius: 12px; border: 0; background: #fff; color: var(--ks-ink); display: grid; place-items: center; cursor: pointer; }
.ka-sheet__x svg { width: 18px; height: 18px; }
.ka-sheet__list { list-style: none; margin: 0; padding: 0; }
.ka-sheet__list li { margin: 0; }
.ka-sheet__list a { display: flex; gap: 14px; padding: 13px 4px; border-top: 1px solid var(--ks-cream2); font-size: 15px; line-height: 1.35; color: var(--c-text); text-decoration: none; }
.ka-sheet__list a span { flex-shrink: 0; width: 22px; font-size: 12px; font-weight: 700; color: var(--ks-muted); padding-top: 2px; font-variant-numeric: tabular-nums; }
.ka-sheet__list li.is-cur a { color: var(--ks-ink); font-weight: 700; }
.ka-sheet__list li.is-cur a span { color: var(--ks-red); }
body.ka-sheet-open { overflow: hidden; }

/* Desktop-Inhaltsverzeichnis: Fortschritt je Abschnitt */
.ka-art .ks-atoc__list li { position: relative; }
.ka-art .ks-atoc__list li.is-done .ks-atoc__n { color: #c01f23; }

/* ---------- 4 Abhakbare Listen ---------- */
.ka-check { position: relative; margin: 36px 0 28px; }
.ka-check__bar { position: sticky; width: fit-content; margin-left: auto !important; top: calc(var(--ks-hdr) + var(--ka-chap) + 10px); z-index: 3; display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 6px 14px 6px 6px; border-radius: 999px; background: #fff; box-shadow: 0 14px 30px -18px rgba(107,29,34,.6), 0 0 0 1px rgba(107,29,34,.06); transition: top .45s var(--kv-ease); }
body.kv-hdr-hide .ka-check__bar { top: calc(var(--ka-chap) + 10px); }
@media (min-width: 1100px) { .ka-check__bar { top: calc(var(--ks-hdr) + 16px); } body.kv-hdr-hide .ka-check__bar { top: 16px; } }
.ka-check__ring { width: 34px; height: 34px; }
.ka-check__ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ka-check__ring circle { fill: none; stroke: rgba(107,29,34,.1); stroke-width: 4; }
.ka-check__ring .ka-check__fg { stroke: var(--kv-amber); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--done, 0) * 100); transition: stroke-dashoffset .5s var(--kv-ease-out), stroke .3s; }
.ka-check.is-full .ka-check__fg { stroke: var(--ks-wine); }
.ka-check__n { font-size: 14px; font-weight: 700; color: var(--ks-ink); font-variant-numeric: tabular-nums; }
.ks-page .ks-prose .ka-ticks { display: grid; gap: 8px; margin: 0 0 22px; counter-reset: none; }
.ks-page .ks-prose .ka-ticks > li { padding: 0; margin: 0; }
.ks-page .ks-prose .ka-ticks > li::before { display: none; }
.ka-tick label { display: flex; align-items: flex-start; gap: 14px; padding: 13px 16px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px rgba(107,29,34,.08); cursor: pointer; transition: background .25s, box-shadow .25s; -webkit-tap-highlight-color: transparent; }
.ka-tick input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ka-tick__box { flex-shrink: 0; width: 24px; height: 24px; margin-top: 1px; border-radius: 8px; border: 2px solid rgba(107,29,34,.3); position: relative; transition: background .25s, border-color .25s; }
.ka-tick__box::after { content: ''; position: absolute; inset: 0; margin: auto; width: 14px; height: 14px; background: #3f1014; transform: scale(0); transition: transform .35s cubic-bezier(.3,1.6,.5,1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%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='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat; }
.ka-tick__t { font-size: 16px; line-height: 1.45; transition: color .25s; }
.ka-tick input:checked + .ka-tick__box { background: var(--kv-amber); border-color: var(--kv-amber); }
.ka-tick input:checked + .ka-tick__box::after { transform: scale(1); }
.ka-tick input:checked ~ .ka-tick__t { color: var(--ks-muted); text-decoration: line-through; text-decoration-color: rgba(107,29,34,.35); }
.ka-tick input:focus-visible + .ka-tick__box { box-shadow: 0 0 0 4px rgba(216,37,41,.25); }
.ka-tick label:has(input:checked) { background: rgba(255,255,255,.55); }
.ks-prose .ka-check h3 { font-size: 17px; margin: 22px 0 10px; }

/* ---------- 5 112 anrufen (Handy, Notfall-Artikel) ---------- */
.ka-112 { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 95; display: inline-flex; align-items: center; gap: 7px; height: 44px; padding: 0 15px 0 5px; border-radius: 999px; background: var(--ks-red); color: #fff; font-family: var(--f-body); font-size: 14px; font-weight: 700; letter-spacing: -.005em; text-decoration: none; box-shadow: 0 14px 28px -12px rgba(216,37,41,.75), 0 0 0 3px rgba(250,246,240,.9); transform: translateY(140%); transition: transform .5s var(--kv-ease-out); }
.ka-112 svg { width: 34px; height: 34px; padding: 8.5px; border-radius: 50%; background: rgba(255,255,255,.18); }
.ka-112.is-on { transform: none; }
.ka-112.is-on svg { animation: kaRing 3.2s ease-in-out 1s infinite; }
@keyframes kaRing { 0%, 80%, 100% { transform: rotate(0); } 84% { transform: rotate(-14deg); } 88% { transform: rotate(12deg); } 92% { transform: rotate(-8deg); } 96% { transform: rotate(4deg); } }
@media (min-width: 900px) { .ka-112 { display: none; } }

/* ---------- 6 Kurs-Hinweis am Ende ---------- */
.ka-art .ks-artcta.ka-final { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(160deg, #6b1d22, #3f1014); border-radius: 30px; padding: 30px 24px 26px; box-shadow: 0 34px 64px -34px rgba(107,29,34,.85); }
.ka-art .ks-artcta.ka-final::before { content: ''; position: absolute; width: 300px; height: 300px; right: -120px; top: -150px; border-radius: 50%; background: radial-gradient(circle, rgba(216,37,41,.55), transparent 70%); z-index: -1; }
.ka-art .ks-artcta.ka-final h2 { font-size: clamp(26px, 7vw, 34px); letter-spacing: -.03em; line-height: 1.08; }
@media (min-width: 900px) { .ka-art .ks-artcta.ka-final { padding: 40px 44px 36px; } }

/* ---------- 7 Weiterlesen ---------- */
.ka-more.ks-section--tint { background: transparent; }
.ka-more .ks-h2 { font-size: clamp(32px, 8.6vw, 54px); letter-spacing: -.035em; line-height: 1.02; }
.ka-more .ks-gal { perspective: 1200px; }
.ka-more .ks-ea { width: 280px; aspect-ratio: 4 / 5; border-radius: 28px; transform: scale(calc(1 - var(--off, 0) * .08)) rotateY(calc(var(--dir, 0) * var(--off, 0) * -8deg)); opacity: calc(1 - var(--off, 0) * .25); transition: transform .12s linear, opacity .12s linear; will-change: transform; }
@media (min-width: 1100px) {
  .ka-more .ks-gal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; margin: 0; padding: 8px 0 24px; }
  .ka-more .ks-ea { width: auto; transform: none; opacity: 1; transition: transform .5s var(--kv-ease-out), box-shadow .5s; }
  .ka-more .ks-ea:hover { transform: translateY(-8px) rotate(-1deg); box-shadow: 0 44px 70px -40px rgba(107,29,34,.7); }
  .ka-more .ks-arrows, .ka-more .ks-dots { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ka-hero__shape { animation: none; transform: none; }
  .js .ka-hero__shape { clip-path: none; transition: none; }
  .js .ka-hero__head > *, .js .ka-lead, .js .ka-key__list > li, .js .kv-rv { opacity: 1; transform: none; transition: none; }
  .ks-page .ks-prose .ka-card { transform: none; }
  .ka-card::after { display: none; }
  .ka-112.is-on svg { animation: none; }
  .ka-more .ks-ea { transform: none; opacity: 1; }
}
@media print {
  .kv-bg, .ka-chap, .ka-sheet, .ka-112, .kv-progress { display: none !important; }
  .ks-page .ks-prose .ka-card { position: static; transform: none; }
}

/* Fix (30.09.): 980–1099 px zeigte das Menü dauerhaft aufgeklappt ohne Burger (Bestand 10.09.) */
@media (min-width: 980px) and (max-width: 1099px) {
  .k-nav { display: none !important; }
  .k-nav.is-open { display: flex !important; }
  .k-burger { display: block !important; }
}

/* =====================================================================
   Einstiegsbild – Varianten zum Vergleich (30.09.): oval | bogen | welle | karte
   (Standard ohne Attribut = oval)
   ===================================================================== */
.ka-hero { overflow-x: clip; }
.ka-hero__img { position: relative; }

/* Bogen: Torbogen-Form (Zuhause, Schutz) mit feiner roter Kontur, die leicht versetzt mitläuft */
[data-hero="bogen"] .ka-hero__img { padding: 0 12px 0 0; }
[data-hero="bogen"] .ka-hero__img::before { content: ''; position: absolute; inset: 12px 0 -12px 12px; border-radius: 999px 999px 28px 28px; border: 1.5px solid rgba(216,37,41,.45); transform: translate(calc(var(--p, 0) * 10px), calc(var(--p, 0) * -6px)); pointer-events: none; }
[data-hero="bogen"] .ka-hero__shape { aspect-ratio: 1 / 1; border-radius: 999px 999px 28px 28px; animation: none; transform: scale(calc(1 - var(--p, 0) * .05)); transform-origin: 50% 100%; }
.js [data-hero="bogen"] .ka-hero__shape { clip-path: inset(100% 0 0 0 round 999px 999px 28px 28px); transition: clip-path 1.4s var(--kv-ease-out) .1s; }
.js [data-hero="bogen"] .ka-hero.is-in .ka-hero__shape { clip-path: inset(0 0 0 0 round 999px 999px 28px 28px); }
@media (min-width: 1000px) { [data-hero="bogen"] .ka-hero__shape { aspect-ratio: 4 / 5; max-height: 72vh; margin-left: auto; } [data-hero="bogen"] .ka-hero__img { padding: 0 16px 0 0; } [data-hero="bogen"] .ka-hero__img::before { inset: 16px 0 -16px 16px; } }

/* Welle: Bild randlos über die ganze Breite, unten weich geschwungen; Desktop: randlos nach rechts, links geschwungen */
[data-hero="welle"] .ka-hero { padding-top: 0; }
[data-hero="welle"] .ka-hero__img { order: -1; margin: 0 calc(-1 * var(--ks-pad)) 18px; }
[data-hero="welle"] .ka-hero__shape { aspect-ratio: 4 / 3.3; border-radius: 0; box-shadow: none; animation: none; clip-path: ellipse(92% 100% at 50% 0%); transform: none; }
[data-hero="welle"] .ka-hero__photo { transform: translateY(calc(var(--p, 0) * 40px)) scale(calc(1.1 + var(--p, 0) * .05)); }
.js [data-hero="welle"] .ka-hero__shape { clip-path: ellipse(92% 0% at 50% 0%); transition: clip-path 1.5s var(--kv-ease-out) .05s; }
.js [data-hero="welle"] .ka-hero.is-in .ka-hero__shape { clip-path: ellipse(92% 100% at 50% 0%); }
@media (min-width: 1000px) {
  [data-hero="welle"] .ka-hero { padding: 0; }
  [data-hero="welle"] .ka-hero__grid { align-items: center; min-height: min(78vh, 760px); }
  [data-hero="welle"] .ka-hero__head { padding-top: 48px; }
  [data-hero="welle"] .ka-hero__foot { padding-bottom: 48px; }
  [data-hero="welle"] .ka-hero__img { order: 0; align-self: stretch; margin: 0 calc(-1 * max(var(--ks-pad), (100vw - 1200px) / 2)) 0 0; }
  [data-hero="welle"] .ka-hero__shape { aspect-ratio: auto; height: 100%; clip-path: ellipse(100% 92% at 100% 50%); }
  .js [data-hero="welle"] .ka-hero__shape { clip-path: ellipse(0% 92% at 100% 50%); }
  .js [data-hero="welle"] .ka-hero.is-in .ka-hero__shape { clip-path: ellipse(100% 92% at 100% 50%); }
}

/* Karte: Foto wie ein aufgelegter Abzug, leicht gedreht, dahinter eine versetzte Fläche aus Netzpunkten; richtet sich beim Scrollen gerade */
[data-hero="karte"] .ka-hero__img { padding: 0 14px 14px 0; }
[data-hero="karte"] .ka-hero__img::before { content: ''; position: absolute; inset: 14px 0 0 14px; border-radius: 30px; background-color: rgba(216,37,41,.06); background-image: radial-gradient(rgba(216,37,41,.5) 1.2px, transparent 1.5px); background-size: 14px 14px; transform: translate(calc(var(--p, 0) * 8px), calc(var(--p, 0) * 8px)); }
[data-hero="karte"] .ka-hero__shape { aspect-ratio: 4 / 3; border-radius: 30px; animation: none; border: 6px solid #fff; box-shadow: 0 34px 60px -34px rgba(107,29,34,.6); transform: rotate(calc(-2.2deg + var(--p, 0) * 2.2deg)); transform-origin: 50% 50%; }
.js [data-hero="karte"] .ka-hero__shape { clip-path: none; opacity: 0; transform: rotate(-6deg) translateY(30px) scale(.94); transition: opacity .9s var(--kv-ease), transform 1.3s var(--kv-ease-out); }
.js [data-hero="karte"] .ka-hero.is-in .ka-hero__shape { opacity: 1; transform: rotate(calc(-2.2deg + var(--p, 0) * 2.2deg)); }
.js [data-hero="karte"] .ka-hero.is-in.is-settled .ka-hero__shape { transition: none; }
@media (min-width: 1000px) { [data-hero="karte"] .ka-hero__shape { aspect-ratio: 5 / 5.2; } [data-hero="karte"] .ka-hero__img { padding: 0 20px 20px 0; } [data-hero="karte"] .ka-hero__img::before { inset: 20px 0 0 20px; } }
@media (prefers-reduced-motion: reduce) { [data-hero] .ka-hero__shape, [data-hero] .ka-hero__img::before, [data-hero] .ka-hero__photo { transform: none !important; } .js [data-hero] .ka-hero__shape { clip-path: none; opacity: 1; transition: none; } [data-hero="welle"] .ka-hero__shape { clip-path: ellipse(92% 100% at 50% 0%) !important; } }
/* Zwischenzeile zwischen zwei Kartengruppen („Wenn ja:“ / „Wenn nein oder kaum:“) */
.ka-stack__label { position: relative; z-index: 2; margin: 26px 0 0 !important; display: inline-flex; padding: 8px 16px; border-radius: 999px; background: var(--ks-ink); color: #fff; font-size: 14.5px; font-weight: 600; }
.ka-stack__label strong { color: #fff; }
.ka-stack__intro + .ka-stack__label, .ka-stack h2 + .ka-stack__label { margin-top: 10px !important; }
.ka-key__label { margin: 22px 0 0 !important; font-weight: 700; }
.ka-key--1 .ka-key__label { color: #f2b04a; }
/* Lange Titel: Spalte darf nie breiter als der Bildschirm werden; sehr lange Titel etwas kleiner */
.ka-hero__grid { grid-template-columns: minmax(0, 1fr); }
.ka-title { overflow-wrap: break-word; }
.ka-title--long { font-size: clamp(31px, 8.4vw, 60px); }
@media (min-width: 1000px) { .ka-hero__grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); } .ka-title--long { font-size: clamp(40px, 4vw, 60px); } }

/* =====================================================================
   Themenseiten (.kt-*) – 30.09.2026
   ===================================================================== */
.kt-topic > section { position: relative; z-index: 1; }
.kt-h2 { font-family: var(--f-display); font-weight: 800; letter-spacing: -.035em; line-height: 1.04; font-size: clamp(32px, 8.8vw, 60px); color: var(--ks-ink); margin: 0 0 16px; text-wrap: balance; }
.kt-topic .ks-eyebrow { display: inline-flex; align-items: center; gap: 10px; }
.kt-topic .ks-eyebrow::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }

/* ---------- 1 Einstieg: Foto → Karte ---------- */
.kt-hero__track { position: relative; height: 175svh; }
.kt-hero__pin { position: sticky; top: 0; height: 100svh; overflow: clip; }
.kt-hero__media { position: absolute; inset: 0; --t: 13%; --s: 6%; --b: 50%; transform: rotate(calc(var(--p, 0) * -2.2deg)); transform-origin: 50% 32%; }
.kt-hero__clip, .kt-hero__frame { position: absolute; inset: calc(var(--p, 0) * var(--t)) calc(var(--p, 0) * var(--s)) calc(var(--p, 0) * var(--b)) calc(var(--p, 0) * var(--s)); border-radius: calc(var(--p, 0) * 30px); }
.kt-hero__clip { overflow: hidden; box-shadow: 0 40px 70px -40px rgba(107,29,34, calc(var(--p, 0) * .7)); }
.kt-hero__frame { border: calc(var(--p, 0) * 6px) solid #fff; pointer-events: none; }
.kt-hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; transform: scale(calc(1.12 - var(--p, 0) * .12)); }
.kt-hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(29,29,27,.35) 0%, rgba(29,29,27,.05) 35%, rgba(40,12,15,.78) 100%); opacity: calc(1 - clamp(0, (var(--p, 0) - .72) * 4, 1)); }
.kt-hero { margin-top: calc(-1 * var(--ks-hdr)); }
.kt-hero__text { position: absolute; left: 0; right: 0; top: calc((1 - var(--p, 0)) * (100svh - var(--th, 220px) - 6svh) + var(--p, 0) * var(--tt, 55svh)); --q: clamp(0, (var(--p, 0) - .8) * 6, 1); color: color-mix(in srgb, var(--ks-ink) calc(var(--q) * 100%), #fff); }
.kt-hero__text .ks-crumb a, .kt-hero__text .ks-crumb li { color: inherit; opacity: .85; }
.kt-hero__text .ks-breadcrumb { margin: 0 0 12px; font-size: 12px; }
.kt-hero__text .ks-eyebrow { color: color-mix(in srgb, var(--ks-red) calc(var(--q) * 100%), #f2b04a); margin-bottom: 12px; }
.kt-title { font-family: var(--f-display); font-weight: 800; letter-spacing: -.045em; line-height: .98; font-size: clamp(42px, 12.4vw, 104px); margin: 0; text-wrap: balance; text-shadow: 0 2px 30px rgba(0,0,0, calc((1 - var(--q)) * .35)); }
.js .kt-hero__text > * { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--kv-ease), transform 1s var(--kv-ease-out); }
.js .kt-hero.is-in .kt-hero__text > * { opacity: 1; transform: none; }
.js .kt-hero.is-in .kt-hero__text > :nth-child(2) { transition-delay: .08s; }
.js .kt-hero.is-in .kt-hero__text > :nth-child(3) { transition-delay: .16s; }
.kt-hero__cue { position: absolute; left: 50%; bottom: 14px; width: 2px; height: 34px; margin-left: -1px; background: rgba(255,255,255,.5); overflow: hidden; opacity: calc(1 - var(--p, 0) * 4); }
.kt-hero__cue::after { content: ''; position: absolute; left: 0; top: -40%; width: 100%; height: 40%; background: #fff; animation: ktCue 1.8s var(--kv-ease) infinite; }
@keyframes ktCue { to { top: 100%; } }
.kt-hero__after { position: relative; padding: 0 0 20px; }
.kt-lead { font-size: 18px; line-height: 1.6; color: var(--c-text); margin: 0 0 22px; max-width: 640px; text-wrap: pretty; }
.kt-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.kt-cta .ks-btn { flex: 1 1 auto; }
.ks-btn--ghost { background: transparent; border: 1.5px solid var(--ks-ink); color: var(--ks-ink); }
.ks-btn--ghost:hover { background: var(--ks-ink); color: #fff; }
@media (min-width: 1000px) {
  .kt-hero__track { height: 190vh; }
  .kt-hero__media { --t: 15%; --s: 0%; --b: 13%; transform-origin: 75% 50%; }
  .kt-hero__clip, .kt-hero__frame { left: calc(var(--p, 0) * 52%); right: calc(var(--p, 0) * max(40px, (100vw - 1200px) / 2)); }
  .kt-hero__text { top: calc(50vh - var(--th, 300px) / 2 + (1 - var(--p, 0)) * 22vh); max-width: 1200px; --q: clamp(0, (var(--p, 0) - .3) * 3.5, 1); }
  .kt-hero__shade { opacity: calc(1 - clamp(0, (var(--p, 0) - .2) * 2.5, 1)); }
  .kt-hero__text > * { max-width: 48%; }
  .kt-title { font-size: clamp(56px, 6.2vw, 104px); }
  .kt-hero__after > * { max-width: 48%; }
  .kt-cta .ks-btn { flex: 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .kt-hero__track { height: auto; }
  .kt-hero__pin { position: relative; height: 100svh; }
  .kt-hero { --p: 1 !important; }
  .kt-hero__after { margin-top: 0 !important; padding-top: 24px; }
  .js .kt-hero__text > * { opacity: 1; transform: none; }
}

/* ---------- 2 Einordnung ---------- */
.kt-intro { display: grid; gap: 26px; }
.kt-fill { font-family: var(--f-display); font-size: clamp(21px, 5.6vw, 32px); line-height: 1.38; font-weight: 600; letter-spacing: -.015em; margin: 0; color: var(--ks-ink); text-wrap: pretty; }
.kt-fill .kt-w { color: rgba(29,29,27,.34); transition: color .35s; } /* 30.09.: Grundton dunkler (Chris) */
.kt-fill .kt-w.is-on { color: var(--ks-ink); }
.kt-facts { background: linear-gradient(160deg, #6b1d22, #3f1014); color: #fff; border-radius: 30px; padding: 26px 22px; box-shadow: 0 34px 64px -34px rgba(107,29,34,.8); }
.kt-facts .ks-eyebrow { color: #f2b04a; margin-bottom: 8px; }
.ks-page .kt-facts ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ks-page .kt-facts li { display: flex; gap: 14px; align-items: center; padding: 14px 0; margin: 0; border-top: 1px solid rgba(255,255,255,.12); }
.ks-page .kt-facts li::before { display: none; }
.kt-facts .ks-facts__ico { flex-shrink: 0; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: rgba(242,176,74,.16); color: #f2b04a; }
.kt-facts .ks-facts__ico svg { width: 22px; height: 22px; }
.kt-facts small { display: block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); font-weight: 600; }
.kt-facts b { display: block; font-family: var(--f-display); font-size: 21px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
@media (min-width: 1000px) { .kt-intro { grid-template-columns: 1.3fr .7fr; gap: 64px; align-items: start; } .kt-facts { position: sticky; top: calc(var(--ks-hdr) + 24px); padding: 30px 28px; } }

/* ---------- 3 Artikel: Kartenstapel ---------- */
.kt-arts .ks-galhead { margin-bottom: 18px; }
.kt-deck { display: grid; gap: 14px; padding-bottom: 20px; }
.kt-deck .ks-ea, .kt-deck .ks-ea--lead { position: sticky; top: calc(var(--ks-hdr) + 14px + var(--i) * 7px); width: 100%; aspect-ratio: 4 / 3.5; border-radius: 28px; transform-origin: 50% 0; transform: scale(calc(1 - var(--c, 0) * .06)); transition: transform .15s linear; }
body.kv-hdr-hide .kt-deck .ks-ea { top: calc(14px + var(--i) * 7px); }
.kt-deck .ks-ea::after { content: ''; position: absolute; inset: 0; background: #1d1d1b; opacity: calc(var(--c, 0) * .45); pointer-events: none; border-radius: inherit; }
.kt-deck .ks-ea h3 { font-size: 25px; }
.kt-deck .ks-ea--lead h3 { font-size: 28px; }
@media (min-width: 900px) {
  .kt-deck { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .kt-deck .ks-ea, .kt-deck .ks-ea--lead { position: relative; top: auto !important; transform: none; aspect-ratio: 4 / 4.6; transition: transform .6s var(--kv-ease-out), box-shadow .6s; }
  .kt-deck .ks-ea::after { display: none; }
  .kt-deck .ks-ea--lead { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
  .kt-deck .ks-ea:hover { transform: translateY(-8px) rotate(-.8deg); box-shadow: 0 44px 70px -40px rgba(107,29,34,.7); }
}

/* ---------- 4 Bühne: Kurs / All-Access ---------- */
.kt-stage { background: radial-gradient(70% 60% at 80% 10%, color-mix(in srgb, var(--glow, #e0343a) 45%, transparent), transparent 70%), linear-gradient(180deg, #4a1418, #2a0b0e); color: #fff; padding: 64px 0 56px; margin: 30px 0; overflow: clip; }
.kt-stage::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(250,246,240,.08) 1px, transparent 1.2px); background-size: 22px 22px; pointer-events: none; }
.kt-stage .ks-wrap { position: relative; }
.kt-stage .kt-h2 { color: #fff; }
.kt-stage .ks-eyebrow { color: #f2b04a !important; }
.kt-stage .ks-course { background: transparent; box-shadow: none; overflow: visible; gap: 26px; }
.kt-stage .ks-course__vid { border-radius: 28px; overflow: hidden; aspect-ratio: 1 / 1; min-height: 0; box-shadow: 0 50px 90px -40px color-mix(in srgb, var(--glow, #e0343a) 80%, transparent), 0 0 0 1px rgba(255,255,255,.08); }
.kt-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--kv-ease); }
.kt-vid.is-playing { opacity: 1; }
.kt-stage .ks-course__body { padding: 0; }
.kt-stage .ks-lead { color: rgba(255,255,255,.8); }
.kt-stage .ks-course__list li { color: rgba(255,255,255,.9); font-size: 16px; }
.ks-page .kt-stage .ks-course__list li::before { color: #f2b04a; }
.kt-stage .ks-course__buy { border-top: 1px solid rgba(255,255,255,.14); }
.kt-stage .ks-course__price { color: #fff; font-size: 48px; }
.kt-stage .ks-course__price small { color: rgba(255,255,255,.65); }
.kt-stage .ks-play { background: rgba(255,255,255,.18); backdrop-filter: blur(8px); }
.kt-aa { background: transparent !important; box-shadow: none !important; padding: 0 !important; color: #fff; }
.kt-aa .ks-lead { color: rgba(255,255,255,.8); }
.kt-aa .ks-aa__stills { position: relative; display: block; height: 250px; margin-top: 26px; }
.kt-aa .ks-aa__stills img { position: absolute; left: 50%; top: 50%; width: 62%; aspect-ratio: 16 / 10; border-radius: 16px; border: 4px solid #fff; box-shadow: 0 30px 50px -24px rgba(0,0,0,.6);
  transform: translate(-50%, -50%) translateX(calc((var(--i) - 1.5) * var(--p, 0) * 30%)) translateY(calc((var(--i) - 1.5) * (1 - var(--p, 0)) * 6px)) rotate(calc((var(--i) - 1.5) * (4deg + var(--p, 0) * 5deg))); transition: transform .2s linear; }
.kt-aa .ks-aa__box { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); }
@media (min-width: 900px) {
  .kt-stage { padding: 96px 0 90px; margin: 50px 0; }
  .kt-stage .ks-course { grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
  .kt-aa .ks-aa__stills { height: 300px; }
}

/* ---------- 5 FAQ ---------- */
.kt-faq { display: grid; gap: 10px; max-width: 860px; }
.kt-q { background: #fff; border-radius: 22px; box-shadow: 0 24px 50px -42px rgba(29,29,27,.5), 0 0 0 1px rgba(107,29,34,.06); overflow: hidden; }
.kt-q summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 44px minmax(0, 1fr) 24px; gap: 12px; align-items: center; padding: 18px 20px; }
.kt-q summary::-webkit-details-marker { display: none; }
.kt-q__n { font-family: var(--f-display); font-size: 26px; font-weight: 800; letter-spacing: -.04em; color: var(--ks-red); }
.kt-q h3 { margin: 0; font-size: 17.5px; line-height: 1.3; font-weight: 700; color: var(--ks-ink); text-wrap: balance; }
.kt-q summary i { width: 24px; height: 24px; border-radius: 50%; background: var(--ks-cream2); position: relative; transition: transform .35s var(--kv-ease); }
.kt-q summary i::before, .kt-q summary i::after { content: ''; position: absolute; left: 50%; top: 50%; width: 10px; height: 2px; margin: -1px 0 0 -5px; background: var(--ks-wine); border-radius: 2px; }
.kt-q summary i::after { transform: rotate(90deg); transition: transform .35s var(--kv-ease); }
.kt-q[open] summary i::after { transform: rotate(0); }
.kt-q__a { padding: 0 20px 20px 76px; }
.kt-q__a p { margin: 0; font-size: 15.5px; line-height: 1.62; color: var(--c-text); }
@media (max-width: 480px) { .kt-q__a { padding-left: 20px; } }

/* ---------- 6 Partner + Abschluss ---------- */
.kt-topic .ks-partner { box-shadow: 0 24px 50px -42px rgba(29,29,27,.5); }
.kt-final.ks-cta { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(160deg, #6b1d22, #3f1014); border-radius: 32px; padding: 34px 24px 28px; flex-direction: column; align-items: flex-start; gap: 20px; box-shadow: 0 34px 64px -34px rgba(107,29,34,.85); }
.kt-final::before { content: ''; position: absolute; width: 320px; height: 320px; right: -130px; top: -160px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--glow, #e0343a) 70%, transparent), transparent 70%); z-index: -1; }
.kt-final .ks-h2 { font-size: clamp(30px, 8vw, 52px); letter-spacing: -.035em; line-height: 1.04; color: #fff; }
@media (min-width: 900px) { .kt-final.ks-cta { flex-direction: row; align-items: center; padding: 48px 52px; } }
@media (prefers-reduced-motion: reduce) { .kt-deck .ks-ea { transform: none; } .kt-deck .ks-ea::after { display: none; } .kt-aa .ks-aa__stills img { transition: none; } }

.kt-title--long { font-size: clamp(34px, 9.6vw, 96px); }
@media (min-width: 1000px) { .kt-title--long { font-size: clamp(50px, 5.2vw, 90px); } }

/* =====================================================================
   Verkaufsseiten (.ks-sales): Kurse, All-Access, Downloads – 30.09.2026
   ===================================================================== */
.ks-sales > section { position: relative; z-index: 1; }
/* ---------- Dunkler Einstieg ---------- */
.ks-dhero { background: radial-gradient(70% 55% at 85% 20%, rgba(216,37,41,.45), transparent 70%), linear-gradient(180deg, #5d181d, #2a0b0e); color: #fff; padding: 26px 0 40px; overflow: clip; }
.ks-dhero::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(250,246,240,.08) 1px, transparent 1.2px); background-size: 22px 22px; pointer-events: none; }
.ks-dhero__grid { position: relative; display: grid; gap: 30px; }
.ks-dhero .ks-crumb a, .ks-dhero .ks-crumb li { color: rgba(255,255,255,.7); }
.ks-dhero .ks-breadcrumb { margin-bottom: 14px; }
.ks-dhero .ks-eyebrow { color: #f2b04a; margin-bottom: 12px; display: inline-flex; gap: 10px; align-items: center; }
.ks-dhero .ks-eyebrow::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }
.ks-title-xl { font-family: var(--f-display); font-weight: 800; letter-spacing: -.045em; line-height: .98; font-size: clamp(40px, 11.5vw, 96px); margin: 0 0 16px; color: #fff; text-wrap: balance; }
.ks-hero-lead { font-size: 17.5px; line-height: 1.6; color: rgba(255,255,255,.82); margin: 0 0 22px; max-width: 580px; text-wrap: pretty; }
.ks-btn--glass { background: rgba(255,255,255,.1); border: 1.5px solid rgba(255,255,255,.35); color: #fff; }
.ks-btn--glass:hover { background: #fff; color: var(--ks-wine); }
.js .ks-dhero__text > * { opacity: 0; transform: translateY(20px); transition: opacity .9s var(--kv-ease), transform 1s var(--kv-ease-out); }
.js .ks-dhero.is-in .ks-dhero__text > * { opacity: 1; transform: none; }
.js .ks-dhero.is-in .ks-dhero__text > :nth-child(2) { transition-delay: .06s; }
.js .ks-dhero.is-in .ks-dhero__text > :nth-child(3) { transition-delay: .12s; }
.js .ks-dhero.is-in .ks-dhero__text > :nth-child(4) { transition-delay: .2s; }
.js .ks-dhero.is-in .ks-dhero__text > :nth-child(5) { transition-delay: .28s; }
.ks-dhero__stage { position: relative; min-height: 300px; }
@media (min-width: 1000px) {
  .ks-dhero { padding: 60px 0 70px; }
  .ks-dhero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; min-height: min(70vh, 640px); }
  .ks-dhero__stage { min-height: 460px; }
  .ks-title-xl { font-size: clamp(56px, 6vw, 96px); }
}
/* Kursbilder / Vorlagen als Fächer */
.ks-fan4, .ks-fan3 { position: absolute; inset: 0; }
.ks-fanimg { position: absolute; left: 50%; top: 50%; width: min(56%, 300px); height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 22px; border: 5px solid #fff; box-shadow: 0 40px 60px -30px rgba(0,0,0,.65);
  transform: translate(-50%, -50%) translateX(calc((var(--i) - 1.5) * var(--o, 0) * 32%)) translateY(calc(var(--o, 0) * (var(--i) - 1.5) * (var(--i) - 1.5) * 5%)) rotate(calc((var(--i) - 1.5) * (2deg + var(--o, 0) * 7deg)));
  transition: transform 1.3s var(--kv-ease-out); transition-delay: calc(var(--i) * 80ms); }
.ks-dhero.is-in .ks-fanimg { --o: 1; }
.ks-fan4:hover .ks-fanimg { --o: 1.12; }
.ks-fanimg--doc { width: min(62%, 340px); aspect-ratio: 640 / 520; object-fit: contain; border: 0; border-radius: 0; box-shadow: none; filter: drop-shadow(0 26px 30px rgba(0,0,0,.45)); transform: translate(-50%, -50%) translateX(calc((var(--i) - 1) * var(--o, 0) * 38%)) translateY(calc(var(--o, 0) * (var(--i) - 1) * (var(--i) - 1) * 6%)) rotate(calc((var(--i) - 1) * (2deg + var(--o, 0) * 8deg))); }
@media (min-width: 1000px) { .ks-fanimg { width: min(48%, 300px); } .ks-fanimg--doc { width: min(58%, 380px); } }

/* ---------- Kurse: Kurs-Leiste ---------- */
.ks-cnav { position: sticky; top: var(--ks-hdr); z-index: 80; background: rgba(250,246,240,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(107,29,34,.07); transition: top .45s var(--kv-ease); }
body.kv-hdr-hide .ks-cnav { top: 0; }
.ks-cnav__in { display: flex; gap: 8px; overflow-x: auto; padding: 10px var(--ks-pad); scrollbar-width: none; max-width: 1240px; margin: 0 auto; }
.ks-cnav__in::-webkit-scrollbar { display: none; }
.ks-cnav a { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: #fff; color: var(--ks-ink); font-size: 13.5px; font-weight: 600; text-decoration: none; box-shadow: 0 0 0 1px rgba(107,29,34,.1); transition: background .3s, color .3s; }
.ks-cnav a i { width: 9px; height: 9px; border-radius: 50%; background: var(--tone); }
.ks-cnav a.is-on { background: var(--tone); color: #fff; box-shadow: none; }
.ks-cnav a.is-on i { background: #fff; }
.ks-sales--kurse .ks-cd { scroll-margin-top: calc(var(--ks-hdr) + 70px); }
/* Kurskarten */
.ks-sales .ks-cd { border-radius: 32px; box-shadow: 0 40px 80px -50px rgba(107,29,34,.55), 0 0 0 1px rgba(107,29,34,.05); }
.ks-cd__loop { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--kv-ease); pointer-events: none; z-index: 1; }
.ks-cd__loop.is-playing { opacity: 1; }
.ks-cd__media.is-playing .ks-cd__loop { display: none; }
.ks-cd__media .ks-cd__play, .ks-cd__media .ks-kc__dur { z-index: 2; }
.ks-cd__media::after { content: ''; position: absolute; inset: 0; box-shadow: inset 0 -80px 80px -60px color-mix(in srgb, var(--tone) 70%, transparent); pointer-events: none; z-index: 1; }
.ks-cd__title { font-size: clamp(30px, 7.8vw, 48px) !important; margin-bottom: 12px !important; }
.ks-cd .ks-course__price { font-size: 42px; }

/* ---------- All-Access: Vorlagen fliegen auf einen Stapel ---------- */
.ks-pile { position: absolute; left: 50%; top: 44%; width: min(78%, 360px); aspect-ratio: 640 / 520; transform: translate(-50%, -50%); }
.ks-pdoc { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(0,0,0,.25)); opacity: 0;
  transform: translate(var(--sx), var(--sy)) rotate(var(--sr)) scale(.75); transition: transform 1.4s var(--kv-ease-out), opacity .4s; transition-delay: calc(.2s + var(--i) * 70ms); }
.ks-dhero.is-in .ks-pdoc { opacity: 1; transform: translate(var(--ex), var(--ey)) rotate(var(--er)); }
.ks-aarow { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ks-aarow figure { margin: 0; position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 1; border: 2px solid rgba(255,255,255,.7); opacity: 0; transform: translateY(16px); transition: opacity .7s var(--kv-ease), transform .8s var(--kv-ease-out); transition-delay: calc(1.1s + var(--i) * 90ms); }
.ks-dhero.is-in .ks-aarow figure { opacity: 1; transform: none; }
.ks-aarow img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ks-aarow figcaption { position: absolute; left: 4px; right: 4px; bottom: 4px; font-size: 8.5px !important; padding: 3px 5px !important; height: auto !important; white-space: normal; line-height: 1.15; }
.ks-dhero--aa .ks-dhero__stage { min-height: 380px; }
@media (min-width: 1000px) { .ks-pile { top: 42%; width: min(80%, 480px); } .ks-dhero--aa .ks-dhero__stage { min-height: 520px; } .ks-aarow figcaption { font-size: 10px !important; } }
/* Zahlen */
.ks-sales--all-access .ks-stats { gap: 10px; }
.ks-sales--all-access .ks-stat { background: #fff; border-radius: 22px; box-shadow: 0 24px 50px -40px rgba(107,29,34,.5); }
.ks-sales--all-access .ks-stat b { font-family: var(--f-display); font-size: clamp(34px, 9vw, 56px); letter-spacing: -.04em; color: var(--ks-red); font-variant-numeric: tabular-nums; }
/* Archiv: Kapitel legen sich wie Register aufeinander */
.ks-sales--all-access .ks-toc { display: grid; gap: 10px; }
.ks-sales--all-access .ks-toc__item { position: sticky; top: calc(var(--ks-hdr) + 12px + var(--i) * 6px); background: #fff; border-radius: 20px; box-shadow: 0 -10px 30px -18px rgba(107,29,34,.35), 0 0 0 1px rgba(107,29,34,.06); padding: 18px 18px; min-height: 92px; transform-origin: 50% 0; transform: scale(calc(1 - var(--c, 0) * .04)); }
body.kv-hdr-hide .ks-sales--all-access .ks-toc__item { top: calc(12px + var(--i) * 6px); }
.ks-sales--all-access .ks-toc__num { font-family: var(--f-display); font-weight: 800; color: var(--ks-red); }
.ks-sales--all-access .ks-toc__count { background: var(--ks-red-soft); color: var(--ks-red); border-radius: 999px; padding: 6px 10px; font-weight: 700; white-space: nowrap; }
@media (min-width: 900px) {
  .ks-sales--all-access .ks-toc { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .ks-sales--all-access .ks-toc__item { position: relative; top: auto !important; transform: none; transition: transform .5s var(--kv-ease-out), box-shadow .5s; }
  .ks-sales--all-access .ks-toc__item:hover { transform: translateY(-4px); box-shadow: 0 30px 50px -30px rgba(107,29,34,.5), 0 0 0 1px rgba(107,29,34,.06); }
}
.ks-sales .kt-aa .ks-aa__stills figure { position: absolute; left: 50%; top: 50%; width: 62%; margin: 0;
  transform: translate(-50%, -50%) translateX(calc((var(--i) - 1.5) * var(--p, 0) * 30%)) translateY(calc((var(--i) - 1.5) * (1 - var(--p, 0)) * 6px)) rotate(calc((var(--i) - 1.5) * (4deg + var(--p, 0) * 5deg))); transition: transform .2s linear; }
.ks-sales .kt-aa .ks-aa__stills figure img { position: static; width: 100%; transform: none; }
.ks-sales .kt-aa .ks-aa__stills figcaption { display: none; }
.kt-aa .ks-aa__list li, .kt-aa .ks-course__list li { color: rgba(255,255,255,.9); }
.ks-page .kt-aa .ks-course__list li::before { color: #f2b04a; }

/* ---------- Downloads ---------- */
.ks-sales--downloads .ks-fc { transition: transform .5s var(--kv-ease-out), box-shadow .5s; }
.ks-sales--downloads .ks-fc:hover { transform: translateY(-6px) rotate(-.6deg); }
.ks-sales--downloads .ks-fc__doc { transition: transform .6s var(--kv-ease-out); }
.ks-sales--downloads .ks-fc:hover .ks-fc__doc { transform: translateY(-6px) rotate(-2deg) scale(1.03); }
.js .ks-sales--downloads .ks-fgrid .ks-fc { animation: ksPop .7s var(--kv-ease-out) both; animation-delay: calc(var(--i, 0) * 60ms); }
@keyframes ksPop { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }
.ks-sales--downloads .ks-fc--wb { background: linear-gradient(160deg, #6b1d22, #3f1014); color: #fff; }
.ks-sales--downloads .ks-fc--wb.ks-fc--petrol { background: linear-gradient(160deg, #136e78, #0b3f45); }
.ks-sales--downloads .ks-fc--wb h4 { color: #fff; }
.ks-sales--downloads .ks-fc--wb p, .ks-sales--downloads .ks-fc--wb .ks-fc__size { color: rgba(255,255,255,.78); }
.ks-sales--downloads .ks-fc--wb .ks-fc__stage { background: rgba(255,255,255,.08); }
.ks-sales--downloads .ks-fc--wb .ks-fc__cta { background: #fff; color: var(--ks-wine); }
@media (prefers-reduced-motion: reduce) {
  .ks-fanimg { transition: none; } .js .ks-sales--downloads .ks-fgrid .ks-fc { animation: none; }
  .ks-pdoc { opacity: 1; } .ks-aarow figure { opacity: 1; transform: none; transition: none; }
  .ks-sales--all-access .ks-toc__item { transform: none; }
}
.kv-sub .kv-dot { display: inline; }
@media (max-width: 599px) { .ks-sales--downloads .ks-wbgrid { grid-template-columns: 1fr; } .ks-sales--downloads .ks-wbgrid .ks-fc__stage { height: 190px; } }
@media (max-width: 999px) { .ks-fan4 .ks-fanimg { transform: translate(-50%, -50%) translateX(calc((var(--i) - 1.5) * var(--o, 0) * 24%)) translateY(calc(var(--o, 0) * (var(--i) - 1.5) * (var(--i) - 1.5) * 5%)) rotate(calc((var(--i) - 1.5) * (2deg + var(--o, 0) * 6deg))); } }
@media (min-width: 900px) { .kt-aa .ks-aa__stills { height: 380px; } .kt-aa .ks-aa__stills img, .ks-sales .kt-aa .ks-aa__stills figure { width: 46%; } }

/* =====================================================================
   Kursseite – Variante A „Kino-Szenen“ / Variante B „Kurs-Wähler“ (30.09.)
   ===================================================================== */
.kk-scenes { position: relative; z-index: 1; }
.kk-scene { --bg: color-mix(in srgb, var(--tone) 24%, #0d0607); position: relative; background: var(--bg); color: #fff; }
.kk-scene + .kk-scene { box-shadow: 0 -1px 0 rgba(255,255,255,.06); }
.kk-track { position: relative; height: 185svh; }
.kk-pin { position: sticky; top: 0; height: 100svh; overflow: clip; }
.kk-media { position: absolute; overflow: hidden; background: #000;
  --t: calc(var(--ks-hdr) + 58px); --b: 44svh; --s: 16px;
  inset: calc(var(--p, 0) * var(--t)) calc(var(--p, 0) * var(--s)) calc(var(--p, 0) * var(--b)) calc(var(--p, 0) * var(--s));
  border-radius: calc(var(--p, 0) * 30px);
  box-shadow: 0 40px 80px -40px color-mix(in srgb, var(--tone) 80%, transparent), 0 0 0 calc(var(--p, 0) * 1px) rgba(255,255,255,.14); }
.kk-poster, .kk-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kk-poster--wide, .kk-vid--wide { display: none; }
.kk-vid { opacity: 0; transition: opacity .8s var(--kv-ease); transform: scale(calc(1.08 - var(--p, 0) * .08)); }
.kk-poster { transform: scale(calc(1.08 - var(--p, 0) * .08)); }
.kk-vid.is-playing { opacity: 1; }
.kk-tint { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, transparent 30%, color-mix(in srgb, var(--tone) 35%, rgba(8,4,5,.92)) 100%); opacity: calc(1 - var(--p, 0) * .75); }
.kk-play { position: absolute; left: 50%; top: 42%; width: 74px; height: 74px; margin: -37px 0 0 -37px; border: 0; border-radius: 50%; background: rgba(255,255,255,.16); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; cursor: pointer; display: grid; place-items: center; box-shadow: 0 0 0 1px rgba(255,255,255,.35); transition: transform .4s var(--kv-ease-out), background .3s; }
.kk-play span { width: 54px; height: 54px; border-radius: 50%; background: #fff; color: var(--tone); display: grid; place-items: center; }
.kk-play svg { width: 24px; height: 24px; margin-left: 3px; }
.kk-play:hover { transform: scale(1.08); }
.kk-play::after { content: ''; position: absolute; inset: -10px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.4); animation: kkPulse 2.4s ease-out infinite; }
@keyframes kkPulse { from { transform: scale(.85); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
.kk-scene .kk-play { top: calc(42% - var(--p, 0) * 12%); }
.kk-head { position: absolute; left: 0; right: 0; bottom: calc(5svh + env(safe-area-inset-bottom)); pointer-events: none; }
.kk-head__in { position: relative; pointer-events: auto; }
.kk-no { position: absolute; right: 0; top: -.2em; font-family: var(--f-display); font-weight: 800; font-size: clamp(90px, 30vw, 240px); line-height: .8; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.22); opacity: var(--p, 0); pointer-events: none; }
.kk-chip { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; background: var(--tone); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 12px; }
.kk-title { font-family: var(--f-display); font-weight: 800; letter-spacing: -.045em; line-height: .96; font-size: clamp(44px, 13vw, 118px); margin: 0 0 14px; color: #fff; text-wrap: balance; transform: translateY(calc((1 - var(--p, 0)) * 10px)); }
.kk-title .kv-dot { color: var(--tone); filter: brightness(1.4); }
.kk-dur { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.8); }
.kk-dur svg { width: 15px; height: 15px; }
.kk-body { position: relative; display: grid; gap: 30px; padding: 10px 0 80px; }
.kk-text { font-size: 17.5px; line-height: 1.62; color: rgba(255,255,255,.86); margin: 0 0 14px; max-width: 600px; text-wrap: pretty; }
.kk-meta { font-size: 14px; font-weight: 600; color: color-mix(in srgb, var(--tone) 55%, #fff); margin: 0 0 24px; }
.kk-buy { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 20px 22px; border-radius: 24px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); }
.kk-buy .ks-course__price { color: #fff; font-size: 46px; }
.kk-buy .ks-course__price small { color: rgba(255,255,255,.6); }
.kk-buy .ks-btn { min-height: 54px; padding: 0 28px; font-size: 16px; }
/* Lektionen als Folgen */
.kk-eps__label { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; color: color-mix(in srgb, var(--tone) 50%, #fff); margin-bottom: 14px; }
.kk-eps__label::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }
.ks-page .kk-eps__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ks-page .kk-eps__list li { margin: 0; padding: 16px 16px 18px; border-radius: 20px; background: linear-gradient(160deg, rgba(255,255,255,.1), rgba(255,255,255,.03)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); display: flex; flex-direction: column; gap: 6px; min-height: 108px; }
.ks-page .kk-eps__list li::before { display: none; }
.kk-ep small { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: color-mix(in srgb, var(--tone) 55%, #fff); }
.kk-ep b { font-family: var(--f-display); font-size: 16.5px; line-height: 1.25; font-weight: 700; color: #fff; hyphens: auto; }
.ks-page .kk-eps__list .kk-ep--more { background: var(--tone); justify-content: flex-end; }
.kk-ep--more b { font-size: 15px; }
.js .kk-ep { opacity: 0; transform: translateY(18px) scale(.97); transition: opacity .6s var(--kv-ease), transform .8s var(--kv-ease-out); transition-delay: calc(var(--i) * 80ms); }
.js .is-in .kk-ep { opacity: 1; transform: none; }
/* Kursleiste als Segmente */
.kk-bar { position: fixed; left: 0; right: 0; top: var(--ks-hdr); z-index: 85; display: flex; align-items: center; gap: 12px; height: 46px; padding: 0 var(--ks-pad); background: rgba(12,6,7,.72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); color: #fff; transform: translateY(-120%); opacity: 0; transition: transform .45s var(--kv-ease), opacity .3s, top .45s var(--kv-ease); }
.kk-bar.is-on { transform: none; opacity: 1; }
body.kv-hdr-hide .kk-bar { top: 0; }
.kk-bar__n { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; color: rgba(255,255,255,.6); }
.kk-bar__t { flex: 1; min-width: 0; font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kk-bar__seg { display: flex; gap: 5px; }
.kk-bar__seg a { position: relative; width: 26px; height: 22px; display: flex; align-items: center; }
.kk-bar__seg a::before { content: ''; position: absolute; left: 0; right: 0; height: 4px; border-radius: 4px; background: rgba(255,255,255,.2); }
.kk-bar__seg i { position: absolute; left: 0; height: 4px; border-radius: 4px; background: var(--tone); filter: brightness(1.25); width: calc(var(--f, 0) * 100%); }
@media (min-width: 1000px) {
  .kk-track { height: 190vh; }
  .kk-poster--tall, .kk-vid--tall { display: none; }
  .kk-poster--wide, .kk-vid--wide { display: block; }
  .kk-media { --t: calc(var(--ks-hdr) + 70px); --b: 10vh; --s: 0px; left: calc(var(--p, 0) * 46%); right: calc(var(--p, 0) * max(40px, (100vw - 1200px) / 2)); }
  .kk-scene .kk-play { top: 50%; width: 92px; height: 92px; margin: -46px 0 0 -46px; }
  .kk-scene .kk-play span { width: 68px; height: 68px; }
  .kk-head { bottom: 10vh; }
  .kk-head__in { max-width: calc(44% + (1 - var(--p, 0)) * 50%); }
  .kk-title { font-size: clamp(52px, 4.8vw, 92px); }
  .kk-no { right: auto; left: 0; top: auto; bottom: calc(100% + 20px); font-size: 200px; }
  .kk-body { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 60px; padding: 30px 0 110px; align-items: start; }
  .ks-page .kk-eps__list li { min-height: 124px; padding: 20px; }
  .kk-bar { left: auto; right: max(24px, (100vw - 1200px) / 2); top: calc(var(--ks-hdr) + 14px); height: 44px; border-radius: 999px; padding: 0 18px; width: 460px; }
  body.kv-hdr-hide .kk-bar { top: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .kk-track { height: auto; } .kk-pin { position: relative; height: 100svh; }
  .kk-scene { --p: 1 !important; } .kk-play::after { animation: none; }
  .js .kk-ep { opacity: 1; transform: none; }
}

/* ---------- Teaser-Fenster (beide Varianten) ---------- */
.kk-lightbox { position: fixed; inset: 0; z-index: 1300; display: grid; place-items: center; padding: 16px; background: rgba(8,4,5,.88); backdrop-filter: blur(6px); opacity: 0; transition: opacity .35s; }
.kk-lightbox.is-open { opacity: 1; }
.kk-lightbox video { width: min(1100px, 100%); max-height: 80vh; border-radius: 20px; background: #000; box-shadow: 0 40px 100px -30px rgba(0,0,0,.8); transform: scale(.94); transition: transform .5s var(--kv-ease-out); }
.kk-lightbox.is-open video { transform: none; }
.kk-lightbox__x { position: absolute; top: 16px; right: 16px; width: 46px; height: 46px; border-radius: 50%; border: 0; background: rgba(255,255,255,.14); color: #fff; cursor: pointer; display: grid; place-items: center; }
.kk-lightbox__x svg { width: 20px; height: 20px; }

/* ---------- Variante B: Kurs-Wähler ---------- */
.kb-stage { position: relative; z-index: 1; color: #fff; overflow: clip; padding: 40px 0 70px; background: color-mix(in srgb, var(--tone) 24%, #0d0607); transition: background-color .8s var(--kv-ease); }
.kb-glow { position: absolute; inset: 0; background: radial-gradient(60% 40% at 50% 18%, color-mix(in srgb, var(--tone) 60%, transparent), transparent 70%); transition: background .8s; pointer-events: none; }
.kb-stage::after { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(250,246,240,.07) 1px, transparent 1.2px); background-size: 22px 22px; pointer-events: none; }
.kb-ring { position: relative; z-index: 1; }
.kb-covers { position: relative; height: min(118vw, 520px); perspective: 1400px; touch-action: pan-y; }
.kb-cover { position: absolute; left: 50%; top: 0; width: min(64vw, 300px); aspect-ratio: 9 / 16; margin-left: calc(min(64vw, 300px) / -2); max-height: 100%;
  transform: translateX(calc(var(--d, 0) * 82%)) translateZ(calc(var(--ad, 0) * -160px)) rotateY(calc(var(--d, 0) * -24deg)); opacity: calc(1 - var(--ad, 0) * .35); z-index: calc(10 - var(--ad, 0));
  transition: transform .8s var(--kv-ease-out), opacity .6s, filter .6s; filter: saturate(calc(1 - var(--ad, 0) * .5)) brightness(calc(1 - var(--ad, 0) * .25)); cursor: pointer; }
.kb-cover.is-active { cursor: default; }
.kb-media { position: absolute; inset: 0; border-radius: 28px; overflow: hidden; background: #000; box-shadow: 0 40px 80px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.14); }
.kb-media .kk-poster--wide, .kb-media .kk-vid--wide { display: none !important; }
.kb-media .kk-poster--tall, .kb-media .kk-vid--tall { display: block !important; transform: none; }
.kb-media .kk-tint { opacity: .55; }
.kb-cover:not(.is-active) .kk-play { opacity: 0; pointer-events: none; }
.kb-cover .kk-play { top: 50%; }
.kb-nav { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 22px 0 6px; }
.kb-arrow { width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255,255,255,.1); color: #fff; cursor: pointer; display: grid; place-items: center; }
.kb-arrow svg { width: 20px; height: 20px; }
.kb-tabs { display: flex; gap: 8px; }
.kb-tabs button { width: 28px; height: 28px; border: 0; background: none; padding: 0; cursor: pointer; display: grid; place-items: center; }
.kb-tabs i { width: 10px; height: 10px; border-radius: 999px; background: rgba(255,255,255,.3); transition: width .4s var(--kv-ease-out), background .3s; }
.kb-tabs button[aria-selected="true"] i { width: 28px; background: var(--tone); filter: brightness(1.3); }
.kb-panels { position: relative; z-index: 1; margin-top: 20px; }
.kb-panel { display: none; gap: 28px; }
.kb-panel.is-active { display: grid; animation: kbIn .7s var(--kv-ease-out) both; }
@keyframes kbIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.kb-panel__main { text-align: left; }
.kb-title { font-family: var(--f-display); font-weight: 800; letter-spacing: -.045em; line-height: .98; font-size: clamp(40px, 11.5vw, 84px); margin: 0 0 12px; color: #fff; text-wrap: balance; }
.kb-title .kv-dot { color: var(--tone); filter: brightness(1.4); }
.kb-panel .kk-dur { margin-bottom: 16px; }
.kb-panel .kk-ep { opacity: 1; transform: none; }
.kb-panel.is-active .kk-ep { animation: kbIn .6s var(--kv-ease-out) both; animation-delay: calc(.15s + var(--i) * 70ms); }
@media (min-width: 1000px) {
  .kb-stage { padding: 70px 0 110px; }
  .kb-covers { height: 560px; }
  .kb-cover { width: 315px; margin-left: -157px; transform: translateX(calc(var(--d, 0) * 78%)) translateZ(calc(var(--ad, 0) * -160px)) rotateY(calc(var(--d, 0) * -24deg)); }
  .kb-panel.is-active { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 60px; align-items: start; }
  .kb-title { font-size: clamp(48px, 4.6vw, 80px); }
}
@media (prefers-reduced-motion: reduce) { .kb-cover, .kb-stage { transition: none; } .kb-panel.is-active, .kb-panel.is-active .kk-ep { animation: none; } }

/* =====================================================================
   Einzelseiten (.km-*): Wissen, Über uns, Kontakt, Rechtliches – 30.09.2026
   ===================================================================== */
.km-page > section { position: relative; z-index: 1; }
/* Wissen: Karten erscheinen gestaffelt, heben sich beim Überfahren */
.km--wissen .ks-wgrid .ks-ea { transition: transform .5s var(--kv-ease-out), box-shadow .5s; }
.js .km--wissen .ks-wgrid .ks-ea:not([hidden]) { animation: ksPop .7s var(--kv-ease-out) both; animation-delay: calc(var(--i, 0) * 50ms); }
@media (hover: hover) { .km--wissen .ks-wgrid .ks-ea:hover { transform: translateY(-6px) rotate(-.6deg); box-shadow: 0 40px 60px -36px rgba(107,29,34,.7); } }
/* Über uns */
.km-cover { margin-top: 0; }
.km-cover .ks-cover__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ks-page .km-cover li { display: flex; gap: 12px; align-items: center; padding: 12px 0; margin: 0; border-top: 1px solid rgba(255,255,255,.12); color: #fff; font-weight: 600; font-size: 15.5px; }
.ks-page .km-cover li::before { display: none; }
.km-cover li svg { flex-shrink: 0; width: 22px; height: 22px; color: #f2b04a; }
.km-deck .ks-who { transition: transform .6s var(--kv-ease-out), box-shadow .6s; }
@media (max-width: 899px) {
  .km-deck { display: grid; grid-template-columns: 1fr !important; gap: 12px; }
  .km-deck .ks-who { position: sticky; top: calc(var(--ks-hdr) + 14px + var(--i) * 8px); min-height: 170px; transform-origin: 50% 0; }
  body.kv-hdr-hide .km-deck .ks-who { top: calc(14px + var(--i) * 8px); }
}
@media (hover: hover) and (min-width: 900px) { .km-deck .ks-who:hover { transform: translateY(-6px); box-shadow: 0 40px 60px -36px rgba(107,29,34,.6); } }
.km-att.kt-stage { margin: 30px 0; }
.km-att .ks-att { background: rgba(255,255,255,.06); }
.km-lines li { transition: color .5s var(--kv-ease), background .5s, transform .6s var(--kv-ease-out) !important; }
.js .km-lines li { opacity: .35; transform: translateX(-10px); }
.js .km-lines.is-in li { opacity: 1; transform: none; transition-delay: calc(var(--n, 0) * 120ms) !important; }
.km-lines li:nth-child(1) { --n: 0; } .km-lines li:nth-child(2) { --n: 1; } .km-lines li:nth-child(3) { --n: 2; } .km-lines li:nth-child(4) { --n: 3; } .km-lines li:nth-child(5) { --n: 4; }
.km-band { overflow: hidden; }
.js .km-band .ks-band__img { clip-path: inset(12% 10% 12% 10% round 40px); transform: scale(1.12); transition: clip-path 1.4s var(--kv-ease-out), transform 1.8s var(--kv-ease-out); }
.js .km-band.is-in .ks-band__img { clip-path: inset(0 0 0 0 round 0); transform: none; }
/* Kontakt */
.km--kontakt .ks-contact__urgent { background: linear-gradient(160deg, #fff, #fdecec); box-shadow: inset 0 0 0 1.5px rgba(216,37,41,.25); }
.km--kontakt .ks-form, .km--kontakt .ks-contact__info { box-shadow: 0 34px 64px -44px rgba(107,29,34,.55), 0 0 0 1px rgba(107,29,34,.05); }
/* Rechtliches */
.km-page .ks-legalhead { padding: 34px 0 10px; }
.km-legal__title { font-size: clamp(42px, 11vw, 88px) !important; margin: 8px 0 0; }
.km-page .ks-legalhead .ks-eyebrow { display: inline-flex; gap: 10px; align-items: center; color: var(--ks-red); }
.km-page .ks-legalhead .ks-eyebrow::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }
@media (prefers-reduced-motion: reduce) { .js .km-lines li, .js .km-band .ks-band__img { opacity: 1; transform: none; clip-path: none; } .js .km--wissen .ks-wgrid .ks-ea { animation: none; } }

/* ---------- Bestätigungsseite nach Double-Opt-In (30.09.) ---------- */
.kc2 { position: relative; z-index: 1; padding: 30px 0 70px; min-height: calc(100svh - var(--ks-hdr) - 40px); display: flex; align-items: center; }
.kc2 .ks-wrap { width: min(760px, calc(100% - 2 * var(--ks-pad))); }
.kc2-card { position: relative; overflow: hidden; isolation: isolate; border-radius: 34px; padding: 40px 24px 30px; color: #fff; text-align: center;
  background: radial-gradient(70% 60% at 50% 0%, rgba(216,37,41,.5), transparent 70%), linear-gradient(170deg, #6b1d22, #3f1014); box-shadow: 0 40px 80px -40px rgba(107,29,34,.9); }
.kc2-card::after { content: ''; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(rgba(250,246,240,.08) 1px, transparent 1.2px); background-size: 20px 20px; }
.kc2-check { width: 96px; height: 96px; margin: 0 auto 18px; display: block; overflow: visible; }
.kc2-ring, .kc2-tick { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.kc2-ring { stroke: rgba(242,176,74,.9); stroke-width: 4; animation: kc2Draw 1.1s var(--kv-ease-out) .2s forwards; }
.kc2-tick { stroke: #fff; stroke-width: 8; animation: kc2Draw .7s var(--kv-ease-out) 1s forwards; }
@keyframes kc2Draw { to { stroke-dashoffset: 0; } }
.kc2-eyebrow { display: block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; color: #f2b04a; margin-bottom: 10px; }
.kc2-title { font-family: var(--f-display); font-weight: 800; letter-spacing: -.045em; line-height: 1; font-size: clamp(38px, 10.5vw, 72px); margin: 0 0 18px; color: #fff; text-wrap: balance; }
.kc2-title .kv-dot { color: var(--ks-red); filter: brightness(1.3); }
.kc2-lead { font-size: 18px; line-height: 1.6; color: rgba(255,255,255,.9); margin: 0 auto 12px; max-width: 540px; text-wrap: pretty; }
.kc2-note { font-size: 14.5px; line-height: 1.55; color: rgba(255,255,255,.7); margin: 0 auto 22px; max-width: 520px; }
.kc2-more { font-size: 15.5px; line-height: 1.55; color: rgba(255,255,255,.85); margin: 0 auto 18px; max-width: 520px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); }
.kc2-btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.kc2-btns .ks-btn { flex: 1 1 200px; max-width: 280px; }
.kc2-home { display: inline-block; margin-top: 18px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.75); text-decoration: underline; text-underline-offset: 3px; }
.kc2-home:hover { color: #fff; }
.js .kc2-card > :not(svg) { opacity: 0; transform: translateY(14px); animation: kbIn .8s var(--kv-ease-out) forwards; }
.js .kc2-card > :nth-child(2) { animation-delay: 1.1s; } .js .kc2-card > :nth-child(3) { animation-delay: 1.2s; } .js .kc2-card > :nth-child(4) { animation-delay: 1.3s; }
.js .kc2-card > :nth-child(5) { animation-delay: 1.4s; } .js .kc2-card > :nth-child(6) { animation-delay: 1.5s; } .js .kc2-card > :nth-child(7) { animation-delay: 1.6s; } .js .kc2-card > :nth-child(8) { animation-delay: 1.7s; }
@media (min-width: 900px) { .kc2-card { padding: 60px 64px 44px; } .kc2 { padding: 60px 0 90px; } }
@media (prefers-reduced-motion: reduce) { .kc2-ring, .kc2-tick { animation: none; stroke-dashoffset: 0; } .js .kc2-card > * { opacity: 1 !important; transform: none !important; animation: none !important; } }

/* ---------- Barrierefreiheit (Prüfroutine 30.09.): Kontraste auf WCAG AA angehoben, Farbwirkung unverändert ---------- */
:root { --c-muted: #63625d; --ks-muted: #63625d; }
.ks-chip--red, .ks-fc__cta, .ks-toc__count { color: #c01f23 !important; }
.ks-chip--amber { color: #8a5a0e !important; }
.ks-section--tint .ks-eyebrow, .kv-fan .ks-eyebrow, [data-thread="3"] { color: #c01f23; }
.ks-check-row a, .k-nl__consent a { text-decoration: underline; text-underline-offset: 2px; }
.kt-hero__text .ks-crumb a, .kt-hero__text .ks-crumb li { opacity: 1; color: color-mix(in srgb, var(--ks-muted) calc(var(--q, 0) * 100%), #fff); }
.kc2-title { font-size: clamp(32px, 8.6vw, 60px); }
.k-footer__partner-label { color: var(--ks-muted) !important; opacity: 1 !important; }
.kk-chip { background: color-mix(in srgb, var(--tone) 80%, #1a0a00); }
.kv-sub { overflow-x: clip; }
.k-footer__partner-link { opacity: 1 !important; }

.ka-art .ks-atoc__n { color: var(--ks-muted); }
.ka-art .ks-atoc__list li.is-active .ks-atoc__n, .ka-art .ks-atoc__list li.is-done .ks-atoc__n { color: #c01f23; }
@media (prefers-reduced-motion: reduce) { .ks-pdoc { transform: translate(var(--ex), var(--ey)) rotate(var(--er)) !important; transition: none; } .ks-fanimg { --o: 1; } }

/* ---------- Notfall-Artikel: Sofort-Schritte direkt unter dem Titel (30.09.) ---------- */
.ka-stack--now { margin: 0 0 22px; padding: 20px 18px 18px; border-radius: 26px; background: linear-gradient(160deg, #fff, #fdecec); box-shadow: inset 0 0 0 1.5px rgba(216,37,41,.22), 0 30px 60px -44px rgba(216,37,41,.5); }
.ks-prose .ka-stack--now h2, .ka-stack--now h2 { font-family: var(--f-display); font-weight: 800; font-size: clamp(24px, 6.6vw, 34px); letter-spacing: -.03em; line-height: 1.1; color: var(--ks-ink); margin: 0 0 8px; scroll-margin-top: calc(var(--ks-hdr) + var(--ka-chap) + 16px); }
.ka-stack--now .ka-stack__intro { font-size: 16px; color: var(--c-text); margin: 0 0 6px; }
.ks-page .ka-stack--now .ka-cards { list-style: none; margin: 10px 0 0; padding: 0; }
.ks-page .ka-stack--now .ka-card { position: static; transform: none !important; min-height: 0; margin: 0; padding: 12px 0; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; background: none; box-shadow: none; border-radius: 0; border-top: 1px solid rgba(216,37,41,.14); font-size: 15.5px; line-height: 1.45; }
.ks-page .ka-stack--now .ka-card:first-child { border-top: 0; }
.ka-stack--now .ka-card::after { display: none; }
.ka-stack--now .ka-card__n { width: 32px; height: 32px; border-radius: 50%; background: var(--ks-red); color: #fff; font-size: 14px; letter-spacing: 0; display: grid; place-items: center; padding: 0; }
.ka-stack--now .ka-card__n--dot { background: var(--ks-red); }
.ka-stack--now .ka-card__n--dot::before { background: #fff; width: 16px; height: 16px; }
.ka-stack--now .ka-card__t { align-self: center; }
.ka-stack--now .ka-card__t strong { display: inline; font-size: 16px; }
.ka-stack--now .ka-stack__label { margin-top: 14px !important; }
.ka-stack--now .ka-stack__note { margin-top: 14px !important; padding: 14px 16px; font-size: 15px; border-radius: 18px; }
@media (min-width: 1000px) {
  .ka-emerg .ka-hero__grid { grid-template-areas: "head img" "now img" "foot img"; }
  .ka-stack--now { grid-area: now; margin: 6px 0 22px; padding: 26px 26px 22px; }
}
/* Tastatur: 112-Knopf beim Fokus immer einblenden (Prüfung 30.09.) */
.ka-112:focus-visible { transform: none; outline: 3px solid #1d1d1b; outline-offset: 3px; }
/* Themenseiten-Kartenstapel (Prüfung 30.09.): lange Titel dürfen den Themen-Chip nicht überdecken – Karte wächst mit */
@media (max-width: 899px) {
  .kt-deck .ks-ea, .kt-deck .ks-ea--lead { aspect-ratio: auto; min-height: calc((100vw - 2 * var(--ks-pad)) * .875); }
  .kt-deck .ks-ea__body { padding-top: 64px; }
  .kt-deck .ks-ea__top { z-index: 3; }
}