
:root { --u-kopf-faktor: 1; --u-kopf-h: 96px; --u-kopf-unten: 0px; --kr-spalte: 38.7%; --kr-treppe: 0px; }
@media (max-width: 767px) { :root { --u-kopf-h: 76px; } }
.kr-start { padding-top: clamp(56px, 6vw, 96px); padding-bottom: clamp(90px, 11vw, 170px); }
.kr-pfad { display: flex; font-size: 13px; font-weight: 500; letter-spacing: .01em; line-height: 1.5; margin-bottom: clamp(24px, 2.6vw, 40px); }
.kr-pfad ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; }
.kr-pfad li + li::before { content: "›"; margin-right: 8px; color: var(--grau); }
.kr-pfad a { color: var(--grau); text-decoration: none; display: inline-block; padding: 16px 0; margin: -16px 0; }   
.kr-pfad a:hover { color: var(--graphit); text-decoration: underline; text-underline-offset: 3px; }
.kr-pfad [aria-current] { color: var(--graphit); }
.kr-titel { font-size: var(--u-h2-gross); font-weight: 600; letter-spacing: -.05em; line-height: .9; color: var(--graphit); max-width: 1200px; text-wrap: balance; hyphens: manual; }
.kr-titel em { font-style: italic; font-weight: 300; }
html.js:not(.ruhig) .kr-titel.fa-wartet { visibility: hidden; animation: fa-zeigen 0s 2.5s forwards; }
@keyframes fa-zeigen { to { visibility: visible; } }
.kr-mass { margin-top: clamp(48px, 4.5vw, 64px); }
.kr-station { position: relative; display: grid; grid-template-columns: var(--kr-spalte) minmax(0, 1fr); padding-top: clamp(28px, 3vw, 44px); }
.kr-station::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--linie); transform: scaleX(var(--fa-linie, 1)); transform-origin: left center; }
.kr-station.fa-ohne-linie::before { display: none; }
.kr-station + .kr-station { margin-top: clamp(56px, 5.5vw, 80px); }
.kr-etikett { grid-column: 1; padding-right: 24px; font-size: 18px; line-height: 1.3; color: var(--graphit); }
.kr-etikett em { font-style: italic; font-weight: 400; }
.kr-etikett .nr { color: var(--akzent); font-size: 13px; margin-right: 6px; }
.kr-inhalt { grid-column: 2; max-width: 640px; }
.kr-satz1 { font-size: var(--u-h3); font-weight: 600; letter-spacing: -.035em; line-height: 1.04; color: var(--graphit); text-wrap: balance; }
.kr-text { font-size: 17px; line-height: 1.6; color: var(--u-text-leise); margin-top: clamp(20px, 2vw, 28px); text-wrap: pretty; }
.kr-ganz { white-space: nowrap; }   
.kr-inhalt .einfaerben { max-width: none; margin: clamp(22px, 2.4vw, 34px) 0 0; text-wrap: pretty; }
.kr-seite .fuss { border-radius: 0; border-top: 1px solid var(--linie); }
.kr-seite ~ .unschaerfe { opacity: 0 !important; }
.km-band { position: relative; margin: clamp(40px, 4.5vw, 64px) calc(-1 * var(--rand)) 0; aspect-ratio: 5 / 1; }
.km-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.km-linie { fill: none; stroke: var(--graphit); stroke-opacity: .55; stroke-width: 1.25; stroke-linejoin: round; stroke-linecap: round; }
.km-punkt { position: absolute; left: var(--x); top: var(--y); width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px; border-radius: 50%; background: var(--akzent); }
.km-ort { position: absolute; right: calc(100% - var(--x) - 5.5px); top: calc(var(--y) + 12px); margin: 0; white-space: nowrap; pointer-events: none; }
.km-ort.etikett { margin: 0; }
.km-band + .kr-mass { margin-top: clamp(48px, 5vw, 72px); }
.km-lizenz { margin: clamp(56px, 6vw, 96px) 0 0; color: var(--grau); }
.km-lizenz a { display: inline-block; padding: 16px 0; margin: -16px 0; color: inherit; text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgba(106,117,112,.45); }
.km-an .km-flaeche, .km-an .km-ort { opacity: 0; }
.km-an .km-punkt { transform: scale(0); }
@media (min-width: 768px) and (max-width: 1023px) { :root { --kr-spalte: 26%; } }
@media (max-width: 767px) {
  .kr-start { padding-top: 48px; padding-bottom: 80px; }
  .kr-station { grid-template-columns: minmax(0, 1fr); padding-top: 24px; }
  .kr-etikett { padding-right: 0; margin-bottom: 14px; font-size: 16px; }
  .kr-inhalt { grid-column: 1; }
  .kr-text { font-size: 16px; }
  .km-band { aspect-ratio: auto; height: 220px; }
  .km-linie { stroke-width: 1.5; }
}
