:root {
  --ca-bronze: #8E5F31;   
  --ca-grau: #646E69;     
  --ca-platz: #C2CAC5;    
}
.u-titel em { font-style: italic; font-weight: 300; white-space: nowrap; }
.u-titel .z-mask { padding-bottom: .1em; margin-bottom: -.1em; }
.ca-kopf-aufruf { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 34px; }
.ca-zusatz { font-size: 14px; font-weight: 500; color: rgba(246,248,245,.74); }
.ca-kopf-aufruf .pfeil { color: var(--schnee); font-size: 15px; }
.ca-kopf-laender .kennung { margin-bottom: 10px; }
.ca-kopf-laender ul { list-style: none; margin: 0; padding: 0; }
.u-kopf .u-pfad, .ca-zusatz, .ca-kopf-laender { text-shadow: 0 1px 14px rgba(6,17,14,.7); }
html.unterseite .u-kopf .ca-kopf-aufruf { margin-top: 20px; }
@media (min-width: 1180px) {
  .ca-kopf-laender { position: absolute; right: var(--rand); bottom: var(--u-kopf-unten); width: clamp(220px, 19vw, 300px); }
  .ca-kopf-laender ul { border-top: 1px solid rgba(246,248,245,.22); }
  .ca-kopf-laender li { border-bottom: 1px solid rgba(246,248,245,.22); padding: 8px 0 9px; font-size: clamp(15px, 1.15vw, 18px); font-weight: 500; letter-spacing: -.01em; }
  .u-kopf > :not(.ca-kopf-laender) { max-width: calc(100% - clamp(220px, 19vw, 300px) - 60px); }
}
@media (max-width: 1179px) {
  .ca-kopf-laender { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: 18px; }
  .ca-kopf-laender .kennung { margin: 0; font-size: 14px; }
  .ca-kopf-laender ul { display: flex; flex-wrap: wrap; gap: 4px 10px; }
  .ca-kopf-laender li { font-size: 14px; font-weight: 500; color: rgba(246,248,245,.92); }
  .ca-kopf-laender li + li::before { content: "·"; margin-right: 10px; color: var(--akzent-hell); }
}
.ca-so, .ca-jetzt, .ca-ehrlich, .ca-fundament, .ca-vorgehen { padding-top: clamp(64px, 7vw, 120px); padding-bottom: clamp(40px, 5vw, 80px); }
.ca-vorgehen { padding-bottom: clamp(80px, 9vw, 150px); }
.u-abschnitt .etikett { color: var(--ca-bronze); }
.u-abschnitt .nr { color: var(--ca-bronze); }
.ca-h2 { font-size: var(--u-h2-klein); font-weight: 600; letter-spacing: -.045em; line-height: .98; margin-bottom: clamp(24px, 2.8vw, 40px); max-width: 900px; }
.ca-h2 em { font-style: italic; font-weight: 300; letter-spacing: -.02em; }
.ca-zwei { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(40px, 6vw, 110px); align-items: center; }
.ca-text > p:not(.etikett):not(.ca-knopfreihe) { color: var(--u-text-leise); max-width: 600px; font-size: 18px; line-height: 1.5; }
.ca-text > p + p { margin-top: 14px; }
.ca-text > .ca-satz { color: var(--graphit) !important; font-size: var(--u-satz) !important; font-weight: 500; letter-spacing: -.02em; line-height: 1.25 !important; max-width: 640px; margin-bottom: 22px; }
.ca-knopfreihe { margin-top: clamp(32px, 4vw, 52px); }
.ca-text p:not(.ca-knopfreihe) a, .ca-ehrlich-spalten a, .ca-schritte a { color: var(--graphit); text-decoration-color: var(--akzent); text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.ca-chat { margin: 0; }
.ca-chat-fenster { background: #fff; border: 1px solid var(--linie); border-radius: var(--u-radius-karte); overflow: hidden;
  box-shadow: 0 -12px 40px rgba(14,44,38,.07), 0 30px 60px -40px rgba(14,44,38,.35);
  min-height: 570px; display: flex; flex-direction: column; color: var(--graphit); font-size: 15px; line-height: 1.5; }
.ca-chat svg { fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.ca-chat-leiste { display: flex; align-items: center; gap: 6px; padding: 14px clamp(18px, 2vw, 26px); }
.ca-chat-marke { font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.ca-chat-pfeil { color: var(--ca-grau); }
.ca-chat-verlauf { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 4px clamp(18px, 2.4vw, 34px) 0; }
.ca-chat-frage { align-self: flex-end; max-width: 80%; background: #F4F4F4; border-radius: 22px; padding: 9px 16px; }
.ca-chat-antwort { margin-top: 20px; margin-bottom: 20px; }
.ca-chat-antwort ul { margin: 8px 0 0; padding-left: 20px; }
.ca-chat-antwort li { padding-left: 2px; }
.ca-chat-antwort li + li { margin-top: 4px; }
.ca-chat-antwort li::marker { color: var(--graphit); }
.ca-ch-name { display: inline-block; width: var(--b); height: .62em; border-radius: 4px; background: var(--ca-platz); margin-right: 8px; vertical-align: .02em; }
.ca-chat-antwort > p + p, .ca-chat-antwort ul + p { margin-top: 10px; }
.ca-chat-aktionen { display: flex; gap: 14px; color: var(--ca-grau); }
.ca-chat-anzeige { margin-top: auto; margin-bottom: 14px; border: 1px solid var(--linie); border-radius: 16px; padding: 14px 16px 16px; background: var(--schnee); position: relative; }
.ca-chat-anzeige::before { content: ""; position: absolute; left: -1px; top: 18px; bottom: 18px; width: 2px; background: var(--akzent); border-radius: 2px; }
.ca-sk-kopf { display: flex; align-items: center; gap: 10px; }
.ca-sk-logo { width: 28px; height: 28px; flex: 0 0 auto; border-radius: 8px; border: 1.5px dashed var(--ca-grau); background: #fff; }
.ca-sk-firma { font-size: 15px; font-weight: 600; }
.ca-sk-kennung { margin-left: auto; font-size: 14px; font-weight: 500; color: var(--ca-grau); border: 1px solid var(--linie); border-radius: 999px; padding: 1px 10px; background: #fff; }
.ca-sk-rumpf { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: 16px; align-items: start; margin-top: 12px; }
.ca-sk-titel { font-size: 17px; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; hyphens: auto; hyphenate-limit-chars: 10 5 5; overflow-wrap: break-word; }
.ca-sk-text { font-size: 15px; color: var(--u-text-leise); margin-top: 4px; line-height: 1.4; }
.ca-sk-link { display: flex; align-items: center; gap: 4px; font-size: 14px; color: var(--ca-grau); margin-top: 8px; }
.ca-sk-bild { position: relative; display: block; aspect-ratio: 1; border-radius: 10px; overflow: hidden;
  background: linear-gradient(150deg, #8A9590 0%, #5E6964 45%, #3B4541 100%); }
.ca-sk-bild i { position: absolute; inset: 20% 20%; border-radius: 6px; background-color: var(--nacht);
  background-image: radial-gradient(circle, var(--akzent-hell) 0 1.6px, transparent 2.2px), linear-gradient(160deg, var(--fichte-tief), var(--nacht));
  background-size: 25% 22%, 100% 100%; background-position: 12% 20%, 0 0;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.25); }
.ca-sk-bild::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(255,255,255,.22) 0 18%, rgba(255,255,255,0) 40%); }
.ca-chat-eingabe { display: flex; align-items: center; justify-content: space-between; margin: 0 clamp(14px, 1.6vw, 22px) clamp(14px, 1.6vw, 22px);
  border: 1px solid var(--linie); border-radius: 999px; padding: 8px 8px 8px 14px; color: var(--ca-grau);
  box-shadow: 0 6px 18px -10px rgba(14,44,38,.25); }
.ca-chat-senden { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--graphit); color: #fff; }
@media (prefers-reduced-motion: no-preference) and (min-width: 901px) {
  html:not(.ruhig) .ca-chat-frage { animation: ca-hoch .45s cubic-bezier(.2,.7,.2,1) .25s both; }
  html:not(.ruhig) .ca-ch { animation: ca-tippen .38s linear both; }
  html:not(.ruhig) .ca-ch1 { animation-delay: .75s; }
  html:not(.ruhig) .ca-ch2 { animation-delay: .95s; }
  html:not(.ruhig) .ca-ch3 { animation-delay: 1.1s; }
  html:not(.ruhig) .ca-ch4 { animation-delay: 1.25s; }
  html:not(.ruhig) .ca-ch5 { animation-delay: 1.4s; }
  html:not(.ruhig) .ca-chat-anzeige { animation: ca-anzeige .5s cubic-bezier(.2,.7,.2,1) 1.45s both; }
}
@media (prefers-reduced-motion: no-preference) and (max-width: 900px) {
  @supports (animation-timeline: view()) {
    html:not(.ruhig) .ca-chat { view-timeline: --ca-chat block; }
    html:not(.ruhig) .ca-chat-frage,
    html:not(.ruhig) .ca-ch,
    html:not(.ruhig) .ca-chat-anzeige { animation: linear both; animation-timeline: --ca-chat; }
    html:not(.ruhig) .ca-chat-frage { animation-name: ca-hoch; animation-range: entry 0% entry 8%; }
    html:not(.ruhig) .ca-ch { animation-name: ca-tippen; }
    html:not(.ruhig) .ca-ch1 { animation-range: entry 7% entry 14%; }
    html:not(.ruhig) .ca-ch2 { animation-range: entry 12% entry 19%; }
    html:not(.ruhig) .ca-ch3 { animation-range: entry 17% entry 24%; }
    html:not(.ruhig) .ca-ch4 { animation-range: entry 22% entry 29%; }
    html:not(.ruhig) .ca-ch5 { animation-range: entry 27% entry 34%; }
    html:not(.ruhig) .ca-chat-anzeige { animation-name: ca-anzeige; animation-range: entry 33% entry 45%; }
  }
}
@keyframes ca-hoch { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes ca-tippen { from { opacity: 0; clip-path: inset(-4px 100% -4px -28px); } 30% { opacity: 1; } to { opacity: 1; clip-path: inset(-4px -2% -4px -28px); } }
@keyframes ca-anzeige { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }
.ca-zwei-umgekehrt .ca-rang { order: -1; }
.ca-rang ol { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linie); }
.ca-rang li { display: flex; align-items: baseline; gap: 18px; height: 76px; padding: 0 16px; align-items: center; border-bottom: 1px solid var(--linie);
  font-size: clamp(22px, 2.3vw, 34px); font-weight: 500; letter-spacing: -.025em; color: var(--ca-grau); }
.ca-rang li .nr { font-size: 14px; color: var(--ca-grau); }
.ca-rang .ca-rang-hervor { background: #fff; color: var(--graphit); font-weight: 600; border-left: 3px solid var(--akzent); padding-left: 13px; }
.ca-rang .ca-rang-hervor .nr { color: var(--graphit); }
.ca-rang .quelle { display: inline-block; margin-top: 18px; color: var(--ca-grau); font-size: 14px; }
.ca-ehrlich-innen { border-top: 1px solid var(--graphit); border-bottom: 1px solid var(--linie); padding: clamp(36px, 4vw, 60px) 0 clamp(40px, 4.5vw, 68px); }
.ca-ehrlich .ca-h2 { max-width: none; }
.ca-ehrlich-spalten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3.4vw, 56px); margin-top: clamp(16px, 2vw, 28px); }
.ca-ehrlich-spalten p { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.45; color: var(--graphit); border-top: 1px solid var(--linie); padding-top: 18px; position: relative; }
.ca-ehrlich-spalten p::before { content: ""; position: absolute; left: 0; top: -1px; width: 72px; height: 1px; background: var(--akzent); }
.ca-ehrlich-spalten .nr { display: block; margin-bottom: 12px; font-size: 14px; }
.ca-code { margin: 0; }
.ca-code pre { margin: 0; background: var(--nacht); color: var(--schnee); border-radius: var(--u-radius-karte); padding: clamp(24px, 3vw, 44px);
  font-family: var(--mono); font-size: clamp(14px, 1.25vw, 18px); line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; min-height: 220px;
  box-shadow: 0 30px 60px -36px rgba(6,17,14,.6); }
.ca-code code { font-family: inherit; font-size: inherit; }   
.ca-code-schluessel { color: var(--akzent-hell); }
.ca-code figcaption, .ca-chat figcaption { margin-top: 14px; color: var(--ca-grau); font-size: 14px; }   
.ca-schritte { list-style: none; margin: clamp(24px, 3vw, 44px) 0 0; padding: 0; border-bottom: 1px solid var(--linie); }
.ca-schritte li { display: grid; grid-template-columns: 90px minmax(0, 4fr) minmax(0, 6fr); gap: 20px clamp(20px, 3vw, 48px); align-items: baseline;
  border-top: 1px solid var(--linie); padding: clamp(24px, 2.6vw, 38px) 0; position: relative; }
.ca-schritte li::before { content: ""; position: absolute; left: 0; top: -1px; width: 72px; height: 1px; background: var(--akzent); }
.ca-schritte h3 { font-size: clamp(24px, 2.25vw, 34px); font-weight: 500; letter-spacing: -.03em; line-height: 1.06; }
.ca-schritte p { color: var(--u-text-leise); font-size: 18px; max-width: 620px; }
@media (max-width: 900px) {
  .ca-zwei { grid-template-columns: minmax(0, 1fr); }
  .ca-zwei-umgekehrt .ca-rang { order: 0; }      
  .ca-ehrlich-spalten { grid-template-columns: minmax(0, 1fr); }
  .ca-schritte li { grid-template-columns: 56px minmax(0, 1fr); }
  .ca-schritte li p { grid-column: 2; }
}
@media (max-width: 767px) {
  .ca-so { padding-top: 64px; }
  .ca-jetzt, .ca-ehrlich, .ca-fundament, .ca-vorgehen { padding-top: 56px; }
  .ca-text > p:not(.etikett):not(.ca-knopfreihe), .ca-schritte p { font-size: 16px; }
  .ca-chat-fenster { min-height: 0; font-size: 14px; }
  .ca-chat-anzeige { margin-top: 2px; }
  .ca-chat-frage { max-width: 88%; }
  .ca-code pre { min-height: 0; }
  .ca-sk-rumpf { grid-template-columns: minmax(0, 1fr) 64px; gap: 12px; }
  .ca-sk-titel { font-size: 16px; }
  .ca-sk-text { font-size: 14px; }
  .ca-rang li { height: 60px; font-size: 22px; }
  .ca-schritte li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .ca-schritte li p { grid-column: auto; }
  .ca-ehrlich-spalten p { font-size: 17px; }
  .ca-knopfreihe .knopf { width: 100%; justify-content: center; }
}
@media (max-width: 560px) {
  .ca-sk-rumpf { grid-template-columns: minmax(0, 1fr) 52px; }
}
.nw { white-space: nowrap; }