/* Kundenstrategie-Framework: Kaskade (Richtung -> Wirkung) */
.kcas { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:clamp(28px,4vw,64px); align-items:start; margin-top:36px; }
.kc-left { min-width:0; }
.kc-cap { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--muted); margin:0 0 12px; display:flex; align-items:center; gap:10px; }
.kc-cap::after { content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent); }
.kc-cap.end { margin:14px 0 0; justify-content:flex-end; }
.kc-cap.end::after { display:none; }
.kc-cap.end::before { content:""; flex:1; height:1px; background:linear-gradient(270deg,var(--line),transparent); }
.kc-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.kc-list li { position:relative; margin-left:calc(var(--i) * 3.2%); width:84%; }
.kc-list li:not(:last-child)::after { content:""; position:absolute; left:26px; bottom:-12px; width:2px; height:12px; background:linear-gradient(var(--accent),transparent); opacity:.6; }
.kc-row { display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; align-items:center; gap:14px; width:100%; padding:14px 16px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:6px; background:var(--card); color:var(--fg); text-align:left; font:inherit; cursor:pointer; transition:transform .25s ease, background .25s ease, border-color .25s ease; }
.kc-row:hover { transform:translateX(5px); background:rgba(56,171,255,.1); }
.kc-no { font-family:var(--display); font-weight:700; font-size:.95rem; color:var(--accent); min-width:1.6em; }
.kc-ic { width:28px; height:28px; flex:none; fill:none; stroke:#8fcbff; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.kc-t b { display:block; font-family:var(--display); font-weight:700; font-size:1.08rem; line-height:1.2; }
.kc-t i { display:block; font-style:normal; color:var(--muted); font-size:.86rem; line-height:1.35; margin-top:2px; }
.kc-ar { color:var(--accent); font-size:1.1rem; opacity:.7; transition:transform .25s ease; }
.kc-row:hover .kc-ar { transform:translateX(3px); opacity:1; }
.kc-row[aria-selected="true"] { background:linear-gradient(120deg,#1d8ee0,#0061B2); border-color:var(--accent); }
.kc-row[aria-selected="true"] .kc-no, .kc-row[aria-selected="true"] .kc-ic, .kc-row[aria-selected="true"] .kc-ar { color:#fff; stroke:#fff; opacity:1; }
.kc-row[aria-selected="true"] .kc-ar { stroke:none; }
.kc-row[aria-selected="true"] .kc-t i { color:#e6f3fd; }
.kc-panel { border:1px solid var(--line); border-radius:10px; background:linear-gradient(160deg,rgba(56,171,255,.07),rgba(255,255,255,.02)); padding:clamp(24px,3vw,40px); min-height:420px; display:flex; flex-direction:column; min-width:0; }
.kc-pane { display:flex; flex-direction:column; flex:1; }
.kc-pane[hidden] { display:none; }
.kc-pane .cnt { font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:600; }
.kc-pane h3 { font-size:clamp(1.5rem,2.6vw,2rem); margin:6px 0 14px; }
.kc-pane .kc-q { color:var(--fg); font-size:1.12rem; margin:0 0 .8em; max-width:58ch; }
.kc-pane p { color:var(--muted); max-width:62ch; }
.kc-res-l { font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--soft); margin:14px 0 8px; }
.kc-res { list-style:none; margin:0 0 18px; padding:0; display:grid; gap:7px; }
.kc-res li { position:relative; padding-left:24px; color:var(--fg); font-size:.97rem; }
.kc-res li::before { content:""; position:absolute; left:2px; top:.62em; width:10px; height:10px; border-radius:50%; border:1.6px solid var(--accent); background:radial-gradient(circle,var(--accent) 0 36%,transparent 40%); }
.kc-more { align-self:flex-start; margin-bottom:6px; }
.kc-panel .pnav { margin-top:auto; }
.kc-hint { color:var(--muted); font-size:.85rem; margin:14px 0 0; }
.kc-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:28px; }
.kc-two .card h3 { font-size:1.2rem; margin-bottom:8px; }
.kc-two .card .kc-tag { display:block; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--accent); margin-bottom:8px; }
body.js .kcas:not(.in) .kc-list li { opacity:0; transform:translateX(-16px); }
.kcas.in .kc-list li { animation:kcin .55s cubic-bezier(.2,.8,.3,1) both; animation-delay:calc(var(--i) * 80ms); }
@keyframes kcin { from { opacity:0; transform:translateX(-16px); } to { opacity:1; transform:none; } }
.kc-steps .step .more-l { display:inline-block; margin-top:4px; font-weight:600; font-size:.92rem; }
@media (max-width:980px) {
  .kcas { grid-template-columns:minmax(0,1fr); }
  .kc-list li { margin-left:calc(var(--i) * 1.6%); width:92%; }
  .kc-panel { min-height:0; }
  .kc-two { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:620px) {
  .kc-list li { margin-left:0; width:100%; }
  .kc-t i { display:none; }
  .kc-row { padding:12px 14px; gap:12px; }
}
@media (prefers-reduced-motion:reduce) {
  .kcas.in .kc-list li { animation:none; }
  body.js .kcas:not(.in) .kc-list li { opacity:1; transform:none; }
  .kc-row, .kc-ar { transition:none; }
}
.callout + p { margin-top:18px; }

/* TAM / SAM / SOM */
.tam{display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:40px;align-items:center;margin-top:34px}
.tam svg{width:100%;height:auto;display:block}
.tam svg text{font-family:inherit}
.tam dl{margin:0;display:grid;gap:18px}
.tam dt{font-weight:700;font-size:1.15rem;letter-spacing:.02em}
.tam dd{margin:4px 0 0;opacity:.88;line-height:1.55}
.tam .d1 dt{color:#66A0D1}.tam .d2 dt{color:#38ABFF}.tam .d3 dt{color:#fff}
@media (max-width:760px){.tam{grid-template-columns:1fr;gap:24px}}

/* Umsetzungs-Karten: Links auf einer Ebene unten, ganze Karte klickbar */
.kc-steps .step{display:flex;flex-direction:column;transition:border-color .25s,background .25s,transform .25s}
.kc-steps .step p{flex:1 1 auto}
.kc-steps .step .more-l{margin-top:auto;align-self:flex-start;position:static}
.kc-steps .step .more-l::after{content:"";position:absolute;inset:0;z-index:1}
.kc-steps .step:hover,.kc-steps .step:focus-within{border-color:var(--accent);background:rgba(56,171,255,.09);transform:translateY(-3px)}
.kc-steps .step:hover .more-l{text-decoration-thickness:2px}