/* v3: ruhiger, monochrom, Akte-Modus */
:root{--ok:#1450B8;--ok-bg:#E6EEFB;--warn:#5D6878;--warn-bg:#EEF1F5;interpolate-size:allow-keywords}

/* Kopfzeile mit fester CTA */
.topbar{padding:12px 16px 12px 20px;min-height:64px}
.head-cta{min-height:40px;padding:0 14px 0 12px;font-size:14px;gap:6px;border-radius:12px;box-shadow:0 4px 12px rgba(11,61,145,.22)}
.head-cta .i{width:18px;height:18px}
@media (max-width:350px){.brand-name{font-size:13px;letter-spacing:.04em}.head-cta{padding:0 10px;font-size:13px}.topbar{padding-left:14px}}

/* Kompakte Kacheln */
.tiles.compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tiles.compact .tile{min-height:0;padding:14px 10px 12px;gap:10px;align-items:center;text-align:center}
.tiles.compact .tile h3{font-size:13.5px;line-height:1.25}
.tiles.compact .ico{width:42px;height:42px}

/* Akkordeon */
details.acc{background:#fff;border:1px solid var(--line);border-radius:16px;transition:border-color .2s ease,box-shadow .2s ease}
details.acc + details.acc{margin-top:8px}
details.acc[open]{border-color:#C9D6EC;box-shadow:0 8px 22px rgba(14,26,43,.07)}
details.acc > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:60px;-webkit-tap-highlight-color:transparent}
details.acc > summary::-webkit-details-marker{display:none}
details.acc > summary .grow{flex:1;min-width:0}
details.acc > summary h3{font-size:15px}
details.acc > summary p{margin:1px 0 0;font-size:12.5px;color:var(--muted)}
details.acc > summary .chev{color:#8A94A6;transition:transform .25s ease}
details.acc[open] > summary .chev{transform:rotate(180deg)}
details.acc::details-content{height:0;overflow:hidden;transition:height .28s cubic-bezier(.2,.8,.2,1),content-visibility .28s allow-discrete}
details.acc[open]::details-content{height:auto}
.acc-body{padding:0 14px 14px 14px;display:flex;flex-direction:column;gap:12px}
.acc-body > p{margin:0;font-size:14px;color:var(--text);line-height:1.5}
.acc-actions{display:flex;gap:8px;flex-wrap:wrap}
.acc-actions .btn{min-height:44px;font-size:14px;padding:0 14px;flex:1 1 140px}
.acc-group{margin-top:8px}
.acc .ico{width:40px;height:40px;border-radius:12px;flex:none}
.help-acc > summary{min-height:72px}
.help-acc .eyebrow{margin:0;font-size:11px}

/* Pillen und Zustände */
.pill{font-size:11.5px;font-weight:700;padding:4px 9px;border-radius:999px;white-space:nowrap;background:#EEF1F5;color:var(--muted)}
.pill.on{background:var(--blue-100);color:var(--blue-800)}
.state-ico{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none;border:1.5px dashed #C6D0DE;color:#8A94A6;background:#fff}
.state-ico.on{border:0;background:var(--blue-700);color:#fff}

/* Akte: Panes */
.pane{animation:paneIn .3s cubic-bezier(.2,.8,.2,1)}
.pane.from-r{--dx:28px}.pane.from-l{--dx:-28px}
@keyframes paneIn{from{opacity:0;transform:translateX(var(--dx,0)) translateY(var(--dy,4px))}to{opacity:1;transform:none}}
.pane-head{display:flex;align-items:center;gap:10px;margin:6px 0 14px}
.pane-head h1{font-size:26px;flex:1}
.pane-head .ref-sm{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--muted);font-variant-numeric:tabular-nums}
.demo-banner{background:var(--blue-50);border-color:var(--blue-100);padding:10px 12px;margin-bottom:12px}
.demo-banner .ico-sm{background:#fff;color:var(--blue-700)}
.demo-banner .btn{min-height:40px!important}
.case-hero{padding:18px}
.case-hero .case-car{margin-top:12px}
.case-hero .case-facts{margin-top:12px}
.case-ref{background:none;border:0;padding:4px 0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12.5px;font-weight:800;letter-spacing:.08em;color:#9CC0FF}
.case-ref .i{width:14px;height:14px}

.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.stat{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px;border-radius:16px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:transform .12s ease}
.stat:active{transform:scale(.97)}
.stat .top{height:44px;display:flex;align-items:center}
.stat .big{font-size:28px;font-weight:800;letter-spacing:-.02em;color:var(--blue-800);line-height:1}
.stat b{font-size:13.5px;line-height:1.2}
.stat span.cap{font-size:11.5px;color:var(--muted);font-weight:600;margin-top:-4px}
.next-card{display:flex;align-items:center;gap:14px;margin-top:12px;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);text-decoration:none;color:var(--ink)}
.next-card .grow{flex:1;min-width:0}
.next-card .eyebrow{margin:0 0 3px;font-size:11px}
.next-card p{margin:3px 0 0;font-size:13.5px;color:var(--muted)}
.next-card .go{width:40px;height:40px;border-radius:12px;background:var(--blue-700);color:#fff;display:grid;place-items:center;flex:none}
.case-cta{margin-top:12px}
.text-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;padding:10px;border:0;background:none;color:var(--muted);font-size:13.5px;font-weight:600;cursor:pointer}

.ring-card{display:flex;align-items:center;gap:16px;padding:14px 16px;margin-bottom:12px}
.ring-card p{margin:2px 0 0;font-size:13px;color:var(--muted)}
.row-link{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border-radius:16px;background:var(--blue-50);text-decoration:none;color:var(--ink);font-size:14.5px;font-weight:650}
.row-link .grow{flex:1}
.row-link small{font-weight:600;color:var(--muted)}

/* Segmentierte Umschaltung */
.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:14px;background:#E7ECF4;margin-bottom:14px}
.seg button{position:relative;z-index:1;height:38px;border:0;background:none;border-radius:11px;font-weight:700;font-size:14px;color:var(--muted);cursor:pointer;transition:color .2s}
.seg button[aria-selected="true"]{color:var(--ink)}
.seg .seg-ind{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:11px;background:#fff;box-shadow:0 2px 8px rgba(14,26,43,.1);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.seg[data-on="1"] .seg-ind{transform:translateX(100%)}
.seg-body{animation:paneIn .25s ease}
.timeline.compact li{padding-bottom:14px}
.timeline.compact h3{font-size:15px}
.date-badge.sm{width:46px;padding:4px 0}
.date-badge.sm b{font-size:17px}

.crit{display:flex;flex-wrap:wrap;gap:6px}
.crit span{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:650;padding:5px 9px;border-radius:999px;background:#F2F4F8;color:var(--text)}
.crit .i{width:13px;height:13px;color:var(--blue-700)}

/* Untere Leiste: Wechsel in den Akte-Modus */
.tabbar{height:calc(var(--tabbar) + var(--safe-b));transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}
.tabset-main{transition:opacity .22s ease,transform .38s cubic-bezier(.2,.8,.2,1)}
.tabset-case{position:absolute;left:50%;bottom:calc(var(--safe-b) + 10px);width:min(536px,calc(100% - 24px));height:62px;display:flex;align-items:center;gap:2px;padding:7px;border-radius:22px;background:rgba(8,28,66,.95);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);box-shadow:0 16px 36px rgba(6,32,79,.34),inset 0 0 0 1px rgba(255,255,255,.07);opacity:0;transform:translate(-50%,30px) scale(.94);pointer-events:none;transition:opacity .28s ease,transform .45s cubic-bezier(.2,.9,.25,1.08)}
body.mode-case .tabbar{background:transparent;border-top-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none}
body.mode-case .tabset-main{opacity:0;transform:translateY(26px);pointer-events:none}
body.mode-case .tabset-case{opacity:1;transform:translate(-50%,0) scale(1);pointer-events:auto}
.ctab{position:relative;z-index:1;flex:1;min-width:0;height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:rgba(255,255,255,.6);font-size:10.5px;font-weight:650;text-decoration:none;border-radius:16px;transition:color .2s ease;-webkit-tap-highlight-color:transparent;white-space:nowrap}
.ctab .i{width:21px;height:21px}
.ctab[aria-current="page"]{color:#fff}
.ctab-back{flex:0 0 46px;color:#fff;background:rgba(255,255,255,.1);margin-right:4px}
.ctab-ind{position:absolute;z-index:0;top:7px;left:0;height:48px;width:0;border-radius:16px;background:rgba(255,255,255,.15);transition:transform .38s cubic-bezier(.2,.8,.2,1),width .38s cubic-bezier(.2,.8,.2,1)}
body.mode-case .toast{bottom:calc(var(--safe-b) + 84px)}
body.mode-case .app{padding-bottom:calc(var(--safe-b) + 96px)}

/* Checkliste als Gruppen */
.check-acc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.check-acc + .check-acc{margin-top:10px}
.check-acc > summary{padding:14px 16px;min-height:56px}
.check-acc .check-list{border-radius:0;box-shadow:none;border:0;border-top:1px solid var(--line)}
.count{font-size:12.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}

/* Startseite: Gut zu wissen */
.acc .steps li{padding:10px 0}
.acc .list-item{padding:10px 0}
.acc .list-item .ico{width:36px;height:36px;border-radius:10px}
