/* Jonder – Barrierefreiheit (gemeinsam für Website und App) */
@font-face{font-family:'Atkinson Hyperlegible';src:url(/fonts/atkinson-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url(/fonts/atkinson-700.woff2) format('woff2');font-weight:700;font-display:swap}

/* Schaltfläche in der Kopfzeile */
.a11y-btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:999px;border:1px solid currentColor;border-color:rgba(127,140,170,.35);
  background:transparent;color:inherit;font:inherit;font-weight:600;font-size:14px;cursor:pointer;line-height:1;white-space:nowrap}
.a11y-btn:hover{border-color:currentColor}
.a11y-btn.a11y-on{background:#1D4ED8;color:#fff;border-color:#1D4ED8}
.a11y-btn svg{flex-shrink:0}
@media (max-width:720px){.a11y-btn .a11y-lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.a11y-btn{padding:0 9px}}

/* Panel */
#a11y-panel{position:fixed;z-index:2147483000;top:72px;right:16px;width:min(420px,calc(100vw - 32px));max-height:calc(100vh - 90px);overflow:auto;
  background:#fff;color:#0F172A;border:1px solid #E2E8F0;border-radius:20px;box-shadow:0 30px 80px -20px rgba(15,23,42,.45),0 4px 14px rgba(15,23,42,.08);
  padding:18px;font-family:Inter,'Segoe UI',system-ui,sans-serif;font-size:14px;line-height:1.4;letter-spacing:0;word-spacing:0}
#a11y-panel[hidden]{display:none}
#a11y-panel .a11y-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
#a11y-panel .a11y-head b{display:block;font-size:17px}
#a11y-panel .a11y-head span{display:block;color:#475569;font-size:13px;margin-top:2px}
#a11y-panel button{font:inherit;color:inherit;cursor:pointer}
#a11y-panel .a11y-x{width:36px;height:36px;border-radius:50%;border:1px solid #E2E8F0;background:#F8FAFC;font-size:22px;line-height:1;flex-shrink:0}
#a11y-panel .a11y-size{display:flex;justify-content:space-between;align-items:center;background:#F1F5F9;border-radius:14px;padding:10px 12px;margin-bottom:12px;font-weight:600}
#a11y-panel .a11y-size div{display:flex;align-items:center;gap:8px}
#a11y-panel .a11y-size button{width:42px;height:36px;border-radius:10px;border:1px solid #CBD5E1;background:#fff;font-weight:800}
#a11y-panel .a11y-size output{min-width:52px;text-align:center;font-weight:700}
#a11y-panel .a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#a11y-panel .a11y-opt{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:12px;border-radius:14px;border:1.5px solid #E2E8F0;background:#fff;min-height:92px}
#a11y-panel .a11y-opt svg{color:#1D4ED8;margin-bottom:4px}
#a11y-panel .a11y-opt b{font-size:13.5px}
#a11y-panel .a11y-opt small{color:#64748B;font-size:12px}
#a11y-panel .a11y-opt[aria-pressed="true"]{border-color:#1D4ED8;background:#EEF3FF;box-shadow:inset 0 0 0 1px #1D4ED8}
#a11y-panel .a11y-opt[aria-pressed="true"]::after{content:'✓ an';font-size:11px;font-weight:800;color:#1D4ED8;margin-top:2px}
#a11y-panel .a11y-read{margin-top:12px;padding:12px;border-radius:14px;background:linear-gradient(135deg,#EEF3FF,#E0F2FE)}
#a11y-panel .a11y-readbtn{display:inline-flex;gap:8px;align-items:center;background:#1D4ED8;color:#fff!important;border:0;border-radius:10px;padding:10px 14px;font-weight:700}
#a11y-panel .a11y-read small{display:block;color:#475569;margin-top:8px;font-size:12px}
#a11y-panel .a11y-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
#a11y-panel .a11y-foot button{border:1px solid #CBD5E1;background:#fff;border-radius:10px;padding:8px 12px;font-weight:600}
#a11y-panel .a11y-foot a{color:#1D4ED8;font-weight:600;font-size:13px}
#a11y-panel .a11y-msg{margin-top:10px;color:#B45309;font-weight:600}
#a11y-panel :focus-visible{outline:3px solid #F59E0B;outline-offset:2px}

/* ── Wirkungen ─────────────────────────────────────────────── */
/* Schriftgröße: Website (rem-basiert) */
html.site.a11y-fs-1{font-size:112%}html.site.a11y-fs-2{font-size:125%}html.site.a11y-fs-3{font-size:140%}html.site.a11y-fs-4{font-size:160%}
/* Schriftgröße: App (px-basiert) */
html:not(.site).a11y-fs-1 body>*:not(#a11y-panel):not(#a11y-guide){zoom:1.12}html:not(.site).a11y-fs-2 body>*:not(#a11y-panel):not(#a11y-guide){zoom:1.25}html:not(.site).a11y-fs-3 body>*:not(#a11y-panel):not(#a11y-guide){zoom:1.4}html:not(.site).a11y-fs-4 body>*:not(#a11y-panel):not(#a11y-guide){zoom:1.6}

html.a11y-font body,html.a11y-font body *:not(svg):not(svg *):not(code):not(pre){font-family:'Atkinson Hyperlegible',Verdana,sans-serif!important}
html.a11y-spacing body *:not(svg):not(svg *){line-height:1.8!important;letter-spacing:.05em!important;word-spacing:.16em!important}
html.a11y-spacing p,html.a11y-spacing li{margin-bottom:.9em}
html.a11y-links a:not(.btn):not([class*="btn"]){text-decoration:underline!important;text-underline-offset:3px;text-decoration-thickness:2px!important;font-weight:700}
html.a11y-links a:not(.btn):not([class*="btn"]):hover,html.a11y-links a:focus{background:#FDE047!important;color:#111!important}
html.a11y-motion *,html.a11y-motion *::before,html.a11y-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.a11y-cursor,html.a11y-cursor *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 9-6.5 1.6L9 19z' fill='%23000' stroke='%23fff' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2,auto!important}
html.a11y-focus *:focus,html.a11y-focus *:focus-visible{outline:4px solid #F59E0B!important;outline-offset:3px!important;box-shadow:0 0 0 7px rgba(245,158,11,.3)!important}
html.a11y-gray{filter:grayscale(1)}
#a11y-guide{position:fixed;left:0;right:0;top:0;height:36px;z-index:2147482999;pointer-events:none;background:rgba(253,224,71,.18);border-top:2px solid rgba(202,138,4,.8);border-bottom:2px solid rgba(202,138,4,.8)}

/* Hoher Kontrast – App-Variablen */
html.a11y-contrast:not(.site){--t1:#000;--t2:#111827;--t3:#1F2937;--t4:#374151;--line:#475569;--line2:#64748B;--bg:#fff;--blue:#1E3A8A;--blue-600:#1E3A8A}
html.a11y-contrast:not(.site) .card,html.a11y-contrast:not(.site) .kpi,html.a11y-contrast:not(.site) .btn{border:2px solid #000!important}
/* Hoher Kontrast – Website-Variablen */
html.site.a11y-contrast{--ink:#000;--tx:#000;--tx2:#111;--tx3:#1F2937;--line:#1F2937;--bg:#fff;--bg2:#fff;--blue:#1E3A8A;--card:#fff}
html.site.a11y-contrast .hero,html.site.a11y-contrast .dark{background:#000!important}
html.site.a11y-contrast .card,html.site.a11y-contrast .tile{border:2px solid #000!important}

/* Dunkles Design */
html.a11y-dark:not(.site){--bg:#0B1220;--card:#111A2E;--line:#23304A;--line2:#1A2540;--t1:#F1F5F9;--t2:#CBD5E1;--t3:#94A3B8;--t4:#64748B;--blue-light:#172554;--blue-mid:#1E3A8A}
html.a11y-dark:not(.site) body{background:var(--bg)}
html.a11y-dark:not(.site) input,html.a11y-dark:not(.site) select,html.a11y-dark:not(.site) textarea{background:#0F172A;color:#F1F5F9;border-color:#334155}
html.site.a11y-dark{--bg:#070B1A;--bg2:#0C1328;--card:#101935;--tx:#F1F5F9;--tx2:#CBD5E1;--tx3:#94A3B8;--line:#1E2A48}
html.site.a11y-dark body{background:var(--bg)}html.site.a11y-dark .tile:not(.ink),html.site.a11y-dark .step,html.site.a11y-dark .kpi,html.site.a11y-dark .chart,html.site.a11y-dark .q,html.site.a11y-dark .plan,html.site.a11y-dark .addon,html.site.a11y-dark .faq details,html.site.a11y-dark .post,html.site.a11y-dark .card2,html.site.a11y-dark .form,html.site.a11y-dark .ri,html.site.a11y-dark .fg,html.site.a11y-dark .vs .c.old,html.site.a11y-dark table.cmp,html.site.a11y-dark .sealtoggle,html.site.a11y-dark .ep div{background:var(--card);border-color:var(--line)}html.site.a11y-dark .top.light{background:rgba(7,11,26,.9);color:#fff}
html.a11y-dark #a11y-panel{background:#0F172A;color:#F1F5F9;border-color:#334155}
html.a11y-dark #a11y-panel .a11y-opt,html.a11y-dark #a11y-panel .a11y-size button,html.a11y-dark #a11y-panel .a11y-foot button,html.a11y-dark #a11y-panel .a11y-x{background:#111A2E;border-color:#334155}
html.a11y-dark #a11y-panel .a11y-size{background:#1E293B}
html.a11y-dark #a11y-panel .a11y-opt[aria-pressed="true"]{background:#172554}
html.a11y-dark #a11y-panel .a11y-read{background:#172554}
html.a11y-dark #a11y-panel small,html.a11y-dark #a11y-panel .a11y-head span{color:#94A3B8}

/* Skip-Link */
.skip{position:absolute;left:12px;top:-60px;z-index:2147483001;background:#1D4ED8;color:#fff;padding:10px 16px;border-radius:10px;font-weight:700;text-decoration:none}
.skip:focus{top:12px}
