/* KI-Anleitung: ergänzt style.css, nutzt dessen Variablen */
.ki .page-head .lead{max-width:46rem}
.ki-meta{margin:1rem 0 0;font-size:.9rem;color:var(--muted)}
.ki-toc{margin:1.5rem 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:.5rem}
.ki-toc a{display:inline-block;padding:.4rem .85rem;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--link);font-size:.9rem;font-weight:500;text-decoration:none}
.ki-toc a:hover{border-color:var(--primary);color:var(--primary-dark)}
.ki-body{max-width:50rem}
.ki-body h2{margin:0 0 .75rem}
.ki-body h3{margin:2rem 0 .6rem;font-family:var(--font-head);font-size:1.15rem}
.ki-body p{margin:0 0 1rem}
.ki-body ul,.ki-body ol{margin:0 0 1.25rem;padding-left:1.35rem}
.ki-body li{margin:.35rem 0}
.ki-body code{padding:.1rem .35rem;border-radius:.3rem;background:var(--primary-soft);font-size:.9em}
.ki-code{position:relative;margin:0 0 1.5rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;overflow:hidden}
.ki-code figcaption{padding:.5rem 1rem;border-bottom:1px solid var(--border);background:var(--primary-soft);font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-dark)}
.ki-code pre{margin:0;padding:1rem;overflow-x:auto;font:400 .88rem/1.55 ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;white-space:pre-wrap;word-break:break-word;color:var(--text)}
.ki-tablewrap{margin:0 0 1.5rem;overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff}
.ki-table{width:100%;border-collapse:collapse;font-size:.95rem}
.ki-table th,.ki-table td{padding:.7rem .9rem;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.ki-table thead th{background:var(--bg-alt);font-weight:600}
.ki-table tbody tr:last-child td{border-bottom:0}
.ki-table td:first-child{font-weight:600;white-space:nowrap}
.ki-ampel{display:inline-block;min-width:4.2rem;padding:.15rem .6rem;border-radius:999px;font-size:.8rem;font-weight:700;text-align:center}
.ki-ampel.gruen{background:#d7f0dc;color:#14532d}
.ki-ampel.gelb{background:#fdecb9;color:#5c4200}
.ki-ampel.rot{background:#f9d4d4;color:#7a1a1a}
.ki-ampel.schwarz{background:#2b2f33;color:#fff}
.ki-check{list-style:none;padding-left:0}
.ki-check li{position:relative;padding-left:1.9rem}
.ki-check li::before{content:"";position:absolute;left:0;top:.3rem;width:1.05rem;height:1.05rem;border:2px solid var(--primary);border-radius:.25rem;background:#fff}
.ki-note{margin:0 0 1.5rem;padding:1rem 1.15rem;border-left:4px solid var(--primary);border-radius:var(--radius);background:var(--primary-soft)}
.ki-note p:last-child{margin-bottom:0}
@media (max-width:640px){.ki-table td:first-child{white-space:normal}}
@media print{.ki-toc,.site-header,.site-footer,.skip{display:none}.ki-code,.ki-tablewrap{break-inside:avoid}}

/* Überblick-Karten */
.ki-overview{padding-top:clamp(1.5rem,3vw,2.25rem);padding-bottom:clamp(1.5rem,3vw,2.25rem)}
.ki-card{display:block;color:inherit;text-decoration:none}
.ki-card h2{margin:0 0 .4rem;font-size:1.2rem}
.ki-card p{margin:0}
.ki-card:hover{border-color:var(--primary);color:inherit}
.ki-card:focus-visible{outline:3px solid var(--primary);outline-offset:2px}

/* Einklappbare Vorlagen */
.ki-vorlage{margin:0 0 1.5rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;overflow:hidden}
.ki-vorlage summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;background:var(--primary-soft);color:var(--primary-dark);font-weight:600;cursor:pointer;list-style:none}
.ki-vorlage summary::-webkit-details-marker{display:none}
.ki-vorlage summary::after{content:"";flex:none;width:.6rem;height:.6rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s var(--ease)}
.ki-vorlage[open] summary::after{transform:rotate(-135deg)}
.ki-vorlage summary:focus-visible{outline:3px solid var(--primary);outline-offset:-3px}
.ki-vorlage .ki-code{margin:0;border:0;border-top:1px solid var(--border);border-radius:0}
.ki-copy{position:absolute;top:.6rem;right:.6rem;padding:.35rem .8rem;border:1px solid var(--primary);border-radius:var(--radius);background:#fff;color:var(--primary-dark);font:600 .85rem var(--font);cursor:pointer}
.ki-copy:hover{background:var(--primary);color:#fff}
.ki-copy:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.ki-code pre{padding-right:6.5rem}

/* Ampel-Karten */
.ki-ampel-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));margin:0 0 1.5rem}
.ki-ampelcard{padding:1.1rem 1.15rem;border:1px solid var(--border);border-top-width:6px;border-radius:var(--radius-lg);background:#fff}
.ki-ampelcard.gruen{border-top-color:#2e9e4f}
.ki-ampelcard.gelb{border-top-color:#e0a800}
.ki-ampelcard.rot{border-top-color:#cc3030}
.ki-ampelcard.schwarz{border-top-color:#2b2f33}
.ki-ampelcard h4{margin:.7rem 0 .4rem;font-family:var(--font-head);font-size:1.05rem}
.ki-ampelcard p{margin:0 0 .6rem;font-size:.95rem}
.ki-ampelcard .ki-regel{margin:0;padding-top:.6rem;border-top:1px dashed var(--border)}
@media (prefers-reduced-motion:reduce){.ki-vorlage summary::after{transition:none}}
@media print{.ki-vorlage:not([open]) .ki-code{display:block}.ki-copy{display:none}}