/* AssistUK – Design System (assistuk.net-nah) */
/* Fonts self-hosted — DSGVO-konform, kein Google Fonts CDN */

/* DM Sans variable */
@font-face {
  font-family: 'DM Sans';
  src: url('fonts/dmsans-var-normal-latin-ext.woff2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Sans';
  src: url('fonts/dmsans-var-normal-latin.woff2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  src: url('fonts/dmsans-var-italic-latin-ext.woff2') format('woff2');
  font-weight: 100 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Sans';
  src: url('fonts/dmsans-var-italic-latin.woff2') format('woff2');
  font-weight: 100 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Merriweather variable */
@font-face {
  font-family: 'Merriweather';
  src: url('fonts/merriweather-var-latin-ext.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Merriweather';
  src: url('fonts/merriweather-var-latin.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --c-bg:#fdf8f4;--c-bg-primary:#fffdfb;--c-bg-secondary:#f7ede4;--c-bg-tertiary:#ecdccd;
  --c-bg-glass:rgba(255,253,251,0.74);--c-bg-glass-heavy:rgba(255,253,251,0.9);
  --c-text:#2b2724;--c-text-secondary:#5f5650;--c-text-tertiary:#6e635b;
  --c-link:#a8345a;--c-link-hover:#7f2742;--c-accent:#a8345a;--c-accent-2:#7f2742;
  --c-green:#2e8b78;--c-orange:#e07a3f;--c-teal:#3a9d8e;--c-warm:#b07a52;
  --c-border:rgba(70,45,35,0.09);--c-border-strong:rgba(70,45,35,0.18);
  --c-shadow:rgba(90,55,45,0.05);--c-shadow-md:rgba(90,55,45,0.09);--c-shadow-lg:rgba(90,55,45,0.14);
  --c-focus:#a8345a;--c-tts-word:#ffd60a;--c-tts-word-text:#2b2724;
  --gradient-hero:linear-gradient(135deg,#7a2440 0%,#a8345a 50%,#c25a4e 100%);
  --gradient-accent:linear-gradient(135deg,#a8345a,#e0976a);
  --f-body:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,sans-serif;
  --f-display:'Merriweather',Georgia,serif;
  --f-heading:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,sans-serif;
  --f-size-base:17px;--f-scale:1;--line-height:1.65;
  --letter-tight:-0.022em;--letter-body:-0.01em;
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;
  --s-10:40px;--s-12:48px;--s-16:64px;--s-20:80px;--s-24:96px;
  --max-w:1120px;--radius-sm:10px;--radius-md:16px;--radius-lg:22px;--radius-xl:28px;
  --blur:20px;--blur-heavy:40px;
  --ease-out:cubic-bezier(0.25,1,0.5,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --duration:0.35s;--duration-slow:0.6s;
}
[data-fontsize="large"]{--f-scale:1.2}[data-fontsize="xlarge"]{--f-scale:1.4}
[data-contrast="high"]{--c-bg:#fff;--c-bg-primary:#fff;--c-bg-secondary:#f0f0f0;--c-bg-tertiary:#e0e0e0;--c-bg-glass:rgba(255,255,255,0.95);--c-bg-glass-heavy:rgba(255,255,255,0.98);--c-text:#000;--c-text-secondary:#1a1a1a;--c-text-tertiary:#333;--c-border:rgba(0,0,0,0.3);--c-border-strong:rgba(0,0,0,0.6);--c-link:#00338a;--c-link-hover:#001f5c;--c-accent:#00338a;--c-accent-2:#001f5c;--c-focus:#cc6600;--c-tts-word:#ff8c00;--c-tts-word-text:#000;--gradient-hero:linear-gradient(135deg,#000 0%,#1a1a1a 50%,#333 100%);--gradient-accent:linear-gradient(135deg,#00338a,#0055cc);line-height:1.8;letter-spacing:0.02em}
[data-contrast="high"] html,[data-contrast="high"]{font-size:calc(var(--f-size-base)*var(--f-scale)*1.1)}
[data-contrast="dark"]{--c-bg:#000;--c-bg-primary:#1c1c1e;--c-bg-secondary:#2c2c2e;--c-bg-tertiary:#3a3a3c;--c-bg-glass:rgba(28,28,30,0.78);--c-bg-glass-heavy:rgba(28,28,30,0.92);--c-text:#f5f5f7;--c-text-secondary:#a1a1a6;--c-text-tertiary:#8e8e93;--c-link:#6ba4dc;--c-link-hover:#8fbde8;--c-accent:#6ba4dc;--c-accent-2:#8fbde8;--c-border:rgba(255,255,255,0.08);--c-border-strong:rgba(255,255,255,0.18);--c-shadow:rgba(0,0,0,0.3);--c-shadow-lg:rgba(0,0,0,0.5);--c-focus:#ffb340;--c-tts-word:#ff9f0a;--c-tts-word-text:#000;--gradient-hero:linear-gradient(135deg,#000 0%,#1c1c1e 50%,#2c2c2e 100%);--gradient-accent:linear-gradient(135deg,#6ba4dc,#5ac8fa)}
[data-contrast="sepia"]{--c-bg:#f4ecd8;--c-bg-primary:#faf5e6;--c-bg-secondary:#ede5d0;--c-bg-tertiary:#e0d5be;--c-bg-glass:rgba(244,236,216,0.85);--c-bg-glass-heavy:rgba(244,236,216,0.92);--c-text:#3e2f1c;--c-text-secondary:#5a4a36;--c-text-tertiary:#5a4a36;--c-link:#6b4226;--c-link-hover:#8b5e3c;--c-accent:#6b4226;--c-accent-2:#8b5e3c;--c-border:rgba(62,47,28,0.1);--c-border-strong:rgba(62,47,28,0.2);--c-shadow:rgba(62,47,28,0.06);--c-shadow-md:rgba(62,47,28,0.1);--c-shadow-lg:rgba(62,47,28,0.15);--c-focus:#8b5e3c;--c-tts-word:#e8c97a;--c-tts-word-text:#3e2f1c;--gradient-hero:linear-gradient(135deg,#3e2f1c 0%,#5a4a36 40%,#7a6a56 100%);--gradient-accent:linear-gradient(135deg,#6b4226,#c49a6c)}
[data-contrast="bluefilter"]{--c-bg:#1a1410;--c-bg-primary:#241e18;--c-bg-secondary:#2e2620;--c-bg-tertiary:#3a3028;--c-bg-glass:rgba(36,30,24,0.85);--c-bg-glass-heavy:rgba(36,30,24,0.92);--c-text:#e8d5b8;--c-text-secondary:#c4a882;--c-text-tertiary:#b8a080;--c-link:#d4a060;--c-link-hover:#e8b878;--c-accent:#d4a060;--c-accent-2:#e8b878;--c-border:rgba(232,213,184,0.08);--c-border-strong:rgba(232,213,184,0.18);--c-shadow:rgba(0,0,0,0.4);--c-shadow-md:rgba(0,0,0,0.5);--c-shadow-lg:rgba(0,0,0,0.6);--c-focus:#e8b878;--c-tts-word:#d4a060;--c-tts-word-text:#1a1410;--gradient-hero:linear-gradient(135deg,#1a1410 0%,#2e2620 50%,#3a3028 100%);--gradient-accent:linear-gradient(135deg,#d4a060,#e8b878)}
.easy-language-content{display:none}[data-language="easy"] .easy-language-content{display:block}[data-language="easy"] .standard-content{display:none}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:calc(var(--f-size-base)*var(--f-scale));scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--f-body);color:var(--c-text);background:var(--c-bg);line-height:var(--line-height);letter-spacing:var(--letter-body);overflow-x:hidden}
:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px;border-radius:4px}
.skip-link{position:absolute;top:-200%;left:var(--s-4);background:var(--c-accent);color:#fff;padding:var(--s-3) var(--s-5);border-radius:var(--radius-sm);z-index:10000;font-weight:600;text-decoration:none;font-size:0.9rem;transition:top var(--duration) var(--ease-out)}.skip-link:focus{top:var(--s-4)}
h1,h2,h3,h4{letter-spacing:var(--letter-tight);color:var(--c-text);line-height:1.15;font-weight:700}
h1{font-family:var(--f-display);font-size:clamp(2.2rem,5vw,3.8rem);font-weight:700;margin-bottom:var(--s-6)}
h2{font-family:var(--f-heading);font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:var(--s-5);font-weight:700;letter-spacing:-0.01em}
h3{font-family:var(--f-heading);font-size:clamp(1.1rem,2vw,1.35rem);margin-bottom:var(--s-3);font-weight:700}
p{margin-bottom:var(--s-4);max-width:68ch;color:var(--c-text-secondary)}
a{color:var(--c-link);text-decoration:none;transition:color var(--duration) var(--ease-out)}a:hover{color:var(--c-link-hover)}
strong{font-weight:600;color:var(--c-text)}ul,ol{padding-left:var(--s-6);margin-bottom:var(--s-4)}li{margin-bottom:var(--s-2);color:var(--c-text-secondary)}img{max-width:100%;height:auto;display:block}

.a11y-toolbar{background:var(--c-bg-glass-heavy);backdrop-filter:blur(var(--blur-heavy));-webkit-backdrop-filter:blur(var(--blur-heavy));border-bottom:0.5px solid var(--c-border);padding:var(--s-2) 0;position:sticky;top:0;z-index:1001}
.a11y-toolbar__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6);display:flex;align-items:center;justify-content:center;gap:var(--s-2);row-gap:var(--s-2);flex-wrap:wrap}
.a11y-toolbar__group{display:flex;align-items:center;gap:var(--s-2);flex-shrink:0}
.a11y-toolbar__label{display:none}
.a11y-toolbar__separator{width:1px;height:18px;background:var(--c-border-strong);margin:0 var(--s-1)}
.a11y-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-1);padding:var(--s-1) var(--s-3);border:1.5px solid var(--c-border-strong);background:var(--c-bg-primary);color:var(--c-text);border-radius:var(--radius-sm);cursor:pointer;font-size:0.8rem;font-family:var(--f-body);font-weight:600;transition:all var(--duration) var(--ease-out);min-height:44px;min-width:44px;line-height:1;white-space:nowrap;flex-shrink:0}
.a11y-btn:hover{background:var(--c-accent);color:#fff;border-color:var(--c-accent);transform:scale(1.04)}
.a11y-btn[aria-pressed="true"],.a11y-btn.active{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}
.a11y-btn svg{width:16px;height:16px;flex-shrink:0}
.tts-voice-select{min-height:44px;max-width:145px;padding:var(--s-1) var(--s-2);border:1.5px solid var(--c-border-strong);background:var(--c-bg-primary);color:var(--c-text);border-radius:var(--radius-sm);font-family:var(--f-body);font-weight:600;font-size:0.78rem;cursor:pointer;text-overflow:ellipsis}
/* Flaggen-Sprachpicker (25 Sprachen) */
.lang-picker{position:relative;flex-shrink:0}
.lang-toggle{gap:var(--s-2);max-width:175px}
.lang-toggle__flag{width:22px;height:15px;border-radius:2px;object-fit:cover;flex:0 0 auto;box-shadow:0 0 0 1px var(--c-border-strong)}
.lang-toggle__name{font-size:0.8rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px}
.lang-toggle:hover .lang-toggle__flag{box-shadow:0 0 0 1px #fff}
.lang-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:1100;width:300px;max-width:92vw;max-height:64vh;overflow-y:auto;background:var(--c-bg-glass-heavy);backdrop-filter:blur(var(--blur-heavy));-webkit-backdrop-filter:blur(var(--blur-heavy));border:0.5px solid var(--c-border-strong);border-radius:var(--radius-md);box-shadow:0 8px 40px var(--c-shadow-lg),0 0 0 0.5px var(--c-border);padding:var(--s-3)}
.lang-panel[hidden]{display:none}
.lang-search{width:100%;padding:var(--s-2) var(--s-3);margin-bottom:var(--s-2);border:1.5px solid var(--c-border-strong);background:var(--c-bg-primary);color:var(--c-text);border-radius:var(--radius-sm);font-family:var(--f-body);font-size:0.85rem;min-height:42px}
.lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-1)}
.lang-opt{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2);border:1.5px solid transparent;border-radius:var(--radius-sm);background:none;color:var(--c-text);cursor:pointer;text-align:left;min-height:44px;font-family:var(--f-body);font-size:0.82rem;font-weight:600;line-height:1.12}
.lang-opt:hover{background:var(--c-bg-secondary)}
.lang-opt.active{border-color:var(--c-accent);color:var(--c-accent)}
.lang-opt__flag{width:24px;height:16px;border-radius:2px;object-fit:cover;flex:0 0 auto;box-shadow:0 0 0 1px var(--c-border-strong)}
.lang-opt__name{overflow:hidden;text-overflow:ellipsis}
[dir="rtl"] .lang-panel{right:auto;left:0}
@media (max-width:640px){.lang-toggle__name{display:none}.lang-grid{grid-template-columns:1fr}.lang-panel{width:240px}}
/* Aktivit\00E4ts-Galerie auf den App-Detailseiten */
.activity-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--s-4);margin-top:var(--s-4)}
.activity-gallery img{width:100%;height:auto;display:block;border-radius:var(--radius-lg,16px);box-shadow:0 6px 20px rgba(0,0,0,0.12);background:var(--c-bg-secondary);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.activity-gallery img:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 14px 30px rgba(0,0,0,0.18)}
.tts-active-indicator{display:none;width:8px;height:8px;border-radius:50%;background:var(--c-green);animation:pulse-dot 1.2s infinite}.tts-active-indicator.visible{display:inline-block}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.4;transform:scale(0.7)}}
.tts-word{border-radius:3px;padding:0;margin:0;display:inline;line-height:inherit;font-size:inherit;vertical-align:baseline}
.tts-heading-words{min-width:0}
.tts-word-active{background:var(--c-tts-word)!important;color:var(--c-tts-word-text)!important;border-radius:3px;padding:0;margin:0}

.site-header{background:var(--c-bg-glass);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));border-bottom:0.5px solid var(--c-border);position:sticky;top:0;z-index:1000}
.a11y-toolbar+.site-header{position:relative}
/* Barriere-Toolbar standardmaessig eingeklappt (auch auf Desktop): nur Vorlesen, Stopp,
   Einfache Sprache + Sprachwahl sichtbar; Schrift/Kontrast/Stimme/Tempo erst nach Klick auf "Mehr". */
.a11y-toolbar__toggle{display:inline-flex;align-items:center;gap:var(--s-1);min-height:44px;padding:var(--s-1) var(--s-3);border:1.5px solid var(--c-border-strong);background:var(--c-bg-primary);color:var(--c-text);border-radius:var(--radius-sm);font-family:var(--f-body);font-weight:600;font-size:0.85rem;cursor:pointer;transition:background var(--duration),border-color var(--duration)}
.a11y-toolbar__toggle:hover{background:var(--c-bg-secondary);border-color:var(--c-accent)}
.a11y-toolbar__chev{transition:transform var(--duration) var(--ease-out)}
.a11y-toolbar.is-open .a11y-toolbar__chev{transform:rotate(180deg)}
.a11y-toolbar:not(.is-open) .a11y-toolbar__inner>*:not(.tts-controls):not(.easy-controls):not(.lang-picker):not(.a11y-toolbar__toggle){display:none}
.a11y-toolbar:not(.is-open) .tts-controls>*:not(#btn-read-page):not(#btn-tts-stop){display:none}
@media(max-width:768px){
  .a11y-toolbar__inner{flex-wrap:wrap}
  /* Auf dem Handy wandert auch die Sprachwahl hinter "Mehr" (Platz) */
  .a11y-toolbar:not(.is-open) .a11y-toolbar__inner>.lang-picker{display:none}
  /* Eingeklappt kompakt: kleinere Knoepfe, alles in EINE Zeile (kein Umbruch) */
  .a11y-btn{min-height:40px;min-width:0;padding:var(--s-1) var(--s-2);font-size:0.76rem}
  .a11y-btn svg{width:15px;height:15px}
  .a11y-toolbar__toggle{min-height:40px;padding:var(--s-1) var(--s-2);font-size:0.76rem}
  .a11y-toolbar__toggle-label{display:none}
  /* Bei grosser Schrift umbrechen statt abschneiden -> "Mehr" bleibt immer erreichbar */
  .a11y-toolbar:not(.is-open) .a11y-toolbar__inner{flex-wrap:wrap;gap:var(--s-1);justify-content:flex-start;padding-left:var(--s-3);padding-right:var(--s-3)}
  .a11y-toolbar:not(.is-open) #btn-easy-language .btn-label{white-space:nowrap}
  /* Ausgeklappt: Gruppen umbrechen lassen, damit nichts (v. a. die Stimmen-Auswahl) über den Rand ragt */
  .a11y-toolbar__inner{max-width:100%}
  .a11y-toolbar__group,.tts-speed-group{flex-wrap:wrap;max-width:100%}
  .tts-voice-select{flex:1 1 100%;max-width:100%;min-width:0}
}
.site-header__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6);display:flex;align-items:center;justify-content:space-between;height:60px}
.site-logo{text-decoration:none;display:flex;align-items:center}.site-logo__text{font-family:var(--f-body);font-size:1.25rem;font-weight:700;color:var(--c-text);letter-spacing:-0.03em}.site-logo__text span{color:var(--c-accent)}
.nav-toggle{display:none;gap:var(--s-1);align-items:center;justify-content:center;background:transparent;border:1.5px solid var(--c-border-strong);color:var(--c-text);cursor:pointer;padding:var(--s-1) var(--s-3);min-height:44px;border-radius:var(--radius-sm);transition:background var(--duration),border-color var(--duration)}.nav-toggle:hover{background:var(--c-bg-secondary);border-color:var(--c-accent)}.nav-toggle__icon{font-size:1.35rem;line-height:1}.nav-toggle__label{font-family:var(--f-body);font-weight:700;font-size:0.95rem;letter-spacing:-0.01em}
.main-nav{display:flex;align-items:center}
.nav-list{display:flex;list-style:none;gap:0;align-items:center}.nav-item{position:relative}
.nav-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:var(--s-1) var(--s-2);min-height:54px;color:var(--c-text);text-decoration:none;text-align:center;transition:color var(--duration) var(--ease-out),background var(--duration);border-radius:var(--radius-md)}
.nav-link svg{width:23px;height:23px;flex-shrink:0}
.nav-link__cap{display:flex;align-items:center;justify-content:center;gap:2px;white-space:nowrap;line-height:1.1}
.nav-link__text{font-size:0.72rem;font-weight:600;letter-spacing:-0.01em;white-space:nowrap}
.nav-link:hover{color:var(--c-accent);background:var(--c-bg-secondary)}.nav-link[aria-current="page"]{color:var(--c-accent);font-weight:700}
/* Vorlesen-Schnellzugriff im Kopf entfernt: die sticky Barriere-Toolbar bietet Vorlesen dauerhaft sichtbar (kein Doppel-Button, mehr Platz fuers Menue) */
.dropdown-arrow{font-size:0.5rem;opacity:0.5;flex-shrink:0;transition:transform var(--duration) var(--ease-out)}
.nav-dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%);background:var(--c-bg-glass-heavy);backdrop-filter:blur(var(--blur-heavy));-webkit-backdrop-filter:blur(var(--blur-heavy));border:0.5px solid var(--c-border-strong);border-radius:var(--radius-md);box-shadow:0 8px 40px var(--c-shadow-lg),0 0 0 0.5px var(--c-border);min-width:220px;display:none;z-index:200;padding:var(--s-2);padding-top:var(--s-3);opacity:0;transition:opacity 0.2s ease-out,transform 0.2s ease-out}
.nav-item::after{content:'';position:absolute;top:100%;left:0;right:0;height:12px}
.nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown,.nav-item.open .nav-dropdown{display:block;opacity:1}
.nav-dropdown a{display:flex;align-items:center;padding:var(--s-2) var(--s-3);color:var(--c-text);text-decoration:none;font-size:0.85rem;border-radius:var(--radius-sm);transition:background var(--duration);min-height:36px}.nav-dropdown a:hover{background:var(--c-bg-secondary)}.nav-dropdown a.lang-current{font-weight:700;color:var(--c-accent)}
.nav-dropdown__header{display:block;padding:var(--s-2) var(--s-3) 2px;font-size:0.66rem;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;color:var(--c-text-tertiary);cursor:default;-webkit-user-select:none;user-select:none}
.nav-dropdown__header:not(:first-child){margin-top:var(--s-1);border-top:1px solid var(--c-border);padding-top:var(--s-3)}
.nav-badge{margin-left:auto;font-size:0.6rem;font-weight:700;letter-spacing:0.02em;line-height:1.6;padding:1px 7px;border-radius:999px;background:var(--c-accent);color:var(--c-on-accent,#fff);white-space:nowrap}
.nav-dropdown--lang{right:0;left:auto;transform:none;max-height:380px;overflow-y:auto;min-width:200px}
.nav-item:hover .nav-dropdown--lang,.nav-item:focus-within .nav-dropdown--lang,.nav-item.open .nav-dropdown--lang{transform:none}

/* Mega-Men\00FC (mehrspaltig): Apps & Tools — Header-Gruppen als zusammenh\00E4ngende Spalten */
.nav-dropdown--mega{width:500px;max-width:94vw;padding:var(--s-3);columns:2;column-gap:var(--s-6)}
.nav-dropdown--mega .nav-dropdown__col{-webkit-column-break-inside:avoid;break-inside:avoid;page-break-inside:avoid;display:block;margin:0 0 var(--s-3)}
.nav-dropdown--mega .nav-dropdown__col:last-child{margin-bottom:0}
.nav-dropdown--mega .nav-dropdown__header{margin-top:0;border-top:none;padding-top:0}
@media(max-width:1080px){
  .nav-dropdown--mega{columns:1;width:auto;max-width:none;padding-top:var(--s-2);padding-right:var(--s-2);padding-bottom:var(--s-2)}
  .nav-dropdown--mega .nav-dropdown__col{margin-bottom:var(--s-2)}
}

.hero{background:var(--gradient-hero);color:#fff;padding:var(--s-24) 0 var(--s-20);text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(60,18,34,0.42) 0%,rgba(120,40,50,0.24) 50%,rgba(80,28,40,0.38) 100%);z-index:0}
.hero::after{content:'';position:absolute;bottom:-40%;left:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(224,151,106,0.12),transparent 70%);border-radius:50%;animation:hero-glow 10s ease-in-out infinite alternate-reverse}
@keyframes hero-glow{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.15) translate(30px,-20px)}}
.hero__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6);position:relative;z-index:1}
.hero h1{color:#f5f5f7;font-size:clamp(2.8rem,6vw,5rem);margin-bottom:var(--s-6);animation:fade-up 0.8s var(--ease-out) both}
.hero p{font-size:clamp(1.05rem,2vw,1.25rem);max-width:600px;margin:0 auto var(--s-8);color:rgba(245,245,247,0.8);line-height:1.55;animation:fade-up 0.8s var(--ease-out) 0.15s both}
/* Fettdruck im Hero hell halten (globale strong-Regel = dunkel waere auf dem Verlauf unlesbar) */
.hero strong,.page-hero:not(.page-hero--light) strong{color:#fff}
@keyframes fade-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}

.page-hero{background:var(--gradient-hero);color:#fff;padding:var(--s-20) 0 var(--s-16);text-align:center;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:rgba(50,55,60,0.3);z-index:0}
.page-hero__inner{position:relative;z-index:1}
.page-hero--light{color:var(--c-text)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.page-hero--light::before{opacity:0}
.page-hero--light h1{color:var(--c-text)}
.page-hero__logo{max-width:320px;height:auto;margin:0 auto var(--s-4);display:block;filter:drop-shadow(0 2px 8px rgba(0,0,0,0.3))}
@media(max-width:600px){.page-hero__logo{max-width:220px}}
.page-hero__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6)}.page-hero h1{color:#f5f5f7;animation:fade-up 0.7s var(--ease-out) both}.page-hero p{color:rgba(245,245,247,0.8);max-width:550px;margin:0 auto}
/* Dekoratives Hero-Linien-Icon: weiss statt blassem Akzentblau (sonst auf dem Verlauf kaum sichtbar) */
.page-hero__inner > svg{stroke:#fff;stroke-width:2;opacity:0.9}
.page-hero__subtitle{font-family:var(--f-display);font-size:clamp(1.1rem,2.5vw,1.5rem);font-weight:700;color:var(--c-accent);letter-spacing:-0.01em;margin:0 auto;text-align:center;max-width:600px}
.page-hero--light .page-hero__subtitle{color:var(--c-accent)}
/* Hero mit thematischem Aquarell rechts (zweispaltig; auf Mobil gestapelt) */
.page-hero.page-hero--media{padding:var(--s-10) 0 var(--s-8)}
.page-hero--media .page-hero__inner{display:grid;grid-template-columns:1.4fr minmax(0,240px);gap:var(--s-8);align-items:center;text-align:left;max-width:var(--max-w)}
.page-hero--media .page-hero__text h1{margin:0 0 var(--s-2)}
.page-hero--media .page-hero__text p{max-width:none;margin:0}
.page-hero--media .page-hero__media{display:flex;justify-content:center}
.page-hero--media .hero-media-img{width:100%;max-width:220px;height:auto;border-radius:var(--radius-lg);box-shadow:0 12px 32px rgba(40,15,25,.32);display:block}
@media(max-width:760px){
  .page-hero.page-hero--media{padding:var(--s-8) 0 var(--s-6)}
  .page-hero--media .page-hero__inner{grid-template-columns:1fr;text-align:center;gap:var(--s-5)}
  .page-hero--media .hero-media-img{max-width:190px;margin:0 auto}
}
/* Abschnitt mit kleinerem Aquarell rechts (etwas kleiner als das Hero) */
.section--media .section__inner{display:grid;grid-template-columns:1fr minmax(0,190px);gap:var(--s-8);align-items:start}
.section--media .section__body{min-width:0}
.section--media .section__aside{display:flex;justify-content:center;align-items:flex-start}
.section--media .section-media-img{width:100%;max-width:170px;height:auto;border-radius:var(--radius-lg);box-shadow:0 10px 26px rgba(40,15,25,.18);display:block}
@media(max-width:760px){
  .section--media .section__inner{grid-template-columns:1fr}
  .section--media .section__aside{display:none}
}
.breadcrumb{max-width:var(--max-w);margin:0 auto;padding:var(--s-4) var(--s-6);font-size:0.8rem;color:var(--c-text-tertiary)}.breadcrumb a{color:var(--c-text-tertiary)}.breadcrumb a:hover{color:var(--c-accent)}.breadcrumb span[aria-hidden]{margin:0 var(--s-1);opacity:0.5}

.btn{display:inline-flex;align-items:center;gap:var(--s-2);padding:var(--s-3) var(--s-6);border:none;border-radius:980px;font-family:var(--f-body);font-weight:600;font-size:0.95rem;text-decoration:none;cursor:pointer;transition:all var(--duration) var(--ease-out);min-height:44px;letter-spacing:-0.01em}
.btn--primary{background:var(--c-accent);color:#fff}.btn--primary:hover{background:var(--c-accent-2);color:#fff;transform:scale(1.04);box-shadow:0 4px 20px rgba(168,52,90,0.35)}
.btn--outline{background:rgba(255,255,255,0.12);color:#f5f5f7;border:1.5px solid rgba(255,255,255,0.25)}.btn--outline:hover{background:rgba(255,255,255,0.2);color:#fff;transform:scale(1.04)}
.btn--secondary{background:var(--c-bg-secondary);color:var(--c-accent);border:1.5px solid var(--c-border-strong)}.btn--secondary:hover{background:var(--c-bg-tertiary);color:var(--c-accent);border-color:var(--c-accent);transform:scale(1.04)}.btn--secondary:hover *{color:var(--c-text)}
/* Primaerer CTA auf dunklem Hero-Verlauf: helle Pille, in allen Kontrastmodi lesbar (accent-Schrift waere in Dunkel-/Blaulicht-Modus zu hell) */
.hero .btn--primary,.page-hero .btn--primary{background:#fff;color:#7f2742}
.hero .btn--primary:hover,.page-hero .btn--primary:hover{background:#fff;color:#5f1d31;box-shadow:0 6px 24px rgba(0,0,0,0.28)}

.section{padding:var(--s-20) 0}.section--alt{background:var(--c-bg-secondary)}
/* Helle Schrift auf dunklem/farbigem Hintergrund: auch fett (strong) + Listen weiss,
   da die globale Regel strong{color:var(--c-text)} sonst dunkel bleibt. */
.section--on-dark,.section--on-dark p,.section--on-dark li,.section--on-dark strong,.section--on-dark h2,.section--on-dark h3{color:#fff}
.section__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6)}.section__header{text-align:center;margin-bottom:var(--s-12)}.section__header h2{color:var(--c-text)}.section__header p{max-width:560px;margin:0 auto;font-size:1.05rem}

.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--s-5)}
.card{background:var(--c-bg-primary);border:0.5px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--s-8);transition:all var(--duration) var(--ease-out);display:flex;flex-direction:column;position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-accent);opacity:0;transition:opacity var(--duration) var(--ease-out)}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 40px var(--c-shadow-lg);border-color:var(--c-border-strong)}.card:hover::before{opacity:1}
.card__icon{width:48px;height:48px;background:var(--c-bg-secondary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:var(--s-5);transition:all var(--duration) var(--ease-out)}
.card:hover .card__icon{background:var(--c-accent);color:var(--c-on-accent,#fff);transform:scale(1.08)}
.card h3{font-size:1.1rem;color:var(--c-text)}.card p{font-size:0.9rem;flex:1}
.card__link{display:inline-flex;align-items:center;gap:var(--s-1);margin-top:var(--s-4);font-weight:600;font-size:0.9rem;color:var(--c-accent)}
.card__link:first-of-type::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}
.card__link+.card__link{position:relative;z-index:2}
.card:has(.card__link){cursor:pointer}
.card__tts{position:absolute;top:var(--s-3);right:var(--s-3);background:var(--c-accent);color:#fff;border:none;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0.7;transition:all var(--duration) var(--ease-out);font-size:0.85rem;z-index:2}
/* Vorlese-Button mittig zum Karten-Icon ausrichten (nur auf Karten mit Icon) */
.card__icon ~ .card__tts{top:calc(var(--s-8) + 2px)}
.card__tts svg{width:20px;height:20px}
.card__tts:hover,.card__tts:focus{opacity:1;transform:scale(1.1);box-shadow:0 2px 8px var(--c-shadow-lg)}
.card__tts[aria-pressed="true"]{background:var(--c-orange);opacity:1}
.card__tts.reading{animation:tts-card-pulse 1.5s ease-in-out infinite}
@keyframes tts-card-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,149,0,0.5)}50%{box-shadow:0 0 0 8px rgba(255,149,0,0)}}
@media(prefers-reduced-motion:reduce){.card__tts.reading{animation:none}}
.card__link::after{content:'→';transition:transform var(--duration) var(--ease-out);font-size:1.1em}.card:hover .card__link::after{transform:translateX(5px)}

.content-page{max-width:780px;margin:0 auto;padding:var(--s-12) var(--s-6)}
.content-page h2{margin-top:var(--s-10);padding-top:var(--s-6);border-top:0.5px solid var(--c-border)}.content-page h2:first-child{margin-top:0;padding-top:0;border-top:none}
.read-section-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:1.5px solid var(--c-accent);border-radius:980px;padding:8px 16px;min-height:44px;font-size:0.85rem;color:var(--c-accent);cursor:pointer;font-family:var(--f-body);font-weight:600;transition:all var(--duration) var(--ease-out);flex-shrink:0;white-space:nowrap;line-height:1.4}
.read-section-btn svg{flex-shrink:0;width:16px;height:16px}
.read-section-btn:hover,.read-section-btn:focus-visible,.read-section-btn.reading{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}
.read-section-btn.reading{animation:tts-btn-pulse 1.5s ease-in-out infinite}
@keyframes tts-btn-pulse{0%,100%{box-shadow:0 0 0 0 rgba(168,52,90,0.45)}50%{box-shadow:0 0 0 7px rgba(168,52,90,0)}}
@media(prefers-reduced-motion:reduce){.read-section-btn.reading{animation:none}}
[data-contrast="dark"] .read-section-btn,[data-contrast="bluefilter"] .read-section-btn{color:var(--c-accent);border-color:var(--c-accent)}
[data-contrast="dark"] .read-section-btn:hover,[data-contrast="dark"] .read-section-btn:focus-visible,[data-contrast="dark"] .read-section-btn.reading,[data-contrast="bluefilter"] .read-section-btn:hover,[data-contrast="bluefilter"] .read-section-btn:focus-visible,[data-contrast="bluefilter"] .read-section-btn.reading{background:var(--c-accent);color:var(--c-on-accent);border-color:var(--c-accent)}
/* Besuchte Text-Links: var() greift bei :visited nicht (Chromium loest Custom-Properties
   im :visited-Kontext aus Datenschutz auf die :root-Werte = #a8345a auf). Ohne literale
   Modusfarben blieben besuchte Links rosa und damit dunkel-auf-dunkel im Dunkel-/Blaufilter-Modus. */
[data-contrast="dark"] main p a:visited,[data-contrast="dark"] main li a:visited,[data-contrast="dark"] main dd a:visited,[data-contrast="dark"] .breadcrumb a:visited{color:#6ba4dc}
[data-contrast="bluefilter"] main p a:visited,[data-contrast="bluefilter"] main li a:visited,[data-contrast="bluefilter"] main dd a:visited,[data-contrast="bluefilter"] .breadcrumb a:visited{color:#d4a060}
[data-contrast="sepia"] main p a:visited,[data-contrast="sepia"] main li a:visited,[data-contrast="sepia"] main dd a:visited,[data-contrast="sepia"] .breadcrumb a:visited{color:#6b4226}
[data-contrast="high"] main p a:visited,[data-contrast="high"] main li a:visited,[data-contrast="high"] main dd a:visited,[data-contrast="high"] .breadcrumb a:visited{color:#00338a}
h2:has(.read-section-btn),h3:has(.read-section-btn){display:flex;justify-content:space-between;align-items:center;gap:var(--s-4)}
h2 .read-section-btn,h3 .read-section-btn{margin-left:auto}
.about-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-10);align-items:start}.about-text h2{border:none;padding-top:0;margin-top:0}

.stats-bar{background:var(--c-bg-secondary);border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border);padding:var(--s-5) 0}
.stats-bar__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6);display:flex;flex-wrap:wrap;justify-content:center;gap:0;text-align:center}
.stats-bar__inner>div{padding:var(--s-3) var(--s-10);border-right:1px solid var(--c-border)}
.stats-bar__inner>div:last-child{border-right:none}
.stat__label{font-size:0.85rem;color:var(--c-text-secondary);font-weight:500;letter-spacing:0.01em}

.contact-form{max-width:480px}.form-group{margin-bottom:var(--s-5)}.form-group label{display:block;margin-bottom:var(--s-2);font-weight:600;font-size:0.85rem;color:var(--c-text)}
.form-group input,.form-group textarea{width:100%;padding:var(--s-3) var(--s-4);border:1.5px solid var(--c-border-strong);border-radius:var(--radius-sm);font-family:var(--f-body);font-size:1rem;color:var(--c-text);background:var(--c-bg-primary);transition:all var(--duration) var(--ease-out);min-height:44px}
.form-group textarea{min-height:140px;resize:vertical}.form-group input:focus,.form-group textarea:focus{border-color:var(--c-accent);box-shadow:0 0 0 3px rgba(168,52,90,0.18);outline:3px solid transparent}
.form-check{display:flex;align-items:flex-start;gap:var(--s-3)}.form-check input[type="checkbox"]{width:20px;height:20px;margin-top:2px;accent-color:var(--c-accent);flex-shrink:0}
.form-status{margin-top:var(--s-3);font-size:0.9rem;min-height:1.2em}.form-status--ok{color:#1a7a3a;font-weight:600}.form-status--error{color:#c0392b;font-weight:600}

.site-footer{background:var(--c-bg-primary);border-top:0.5px solid var(--c-border);padding:var(--s-12) 0 var(--s-8);color:var(--c-text-secondary)}
.site-footer__inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--s-6)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--s-10);margin-bottom:var(--s-10)}.footer-brand p{font-size:0.85rem;max-width:320px}
.footer-links h4{font-family:var(--f-body);font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:var(--c-text-tertiary);margin-bottom:var(--s-4)}
.footer-links ul{list-style:none;padding:0}.footer-links li{margin-bottom:var(--s-2)}.footer-links a{color:var(--c-text-secondary);font-size:0.85rem}.footer-links a:hover{color:var(--c-accent)}
.footer-bottom{border-top:0.5px solid var(--c-border);padding-top:var(--s-6);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s-4);font-size:0.78rem;color:var(--c-text-tertiary)}

.card{opacity:0;transform:translateY(24px);transition:all var(--duration-slow) var(--ease-out)}.card.visible{opacity:1;transform:translateY(0)}
.card--zg{border-top:3px solid var(--c-border-strong)}.card--zg .card__icon{background:rgba(168,52,90,0.07);color:var(--c-accent)}.card--zg:hover{border-top-color:var(--c-accent)}.card--zg:hover .card__icon{background:var(--c-accent);color:#fff}
.card__icon svg{width:24px;height:24px}
.cards-grid .card:nth-child(1){transition-delay:0s}.cards-grid .card:nth-child(2){transition-delay:0.08s}.cards-grid .card:nth-child(3){transition-delay:0.16s}.cards-grid .card:nth-child(4){transition-delay:0.24s}.cards-grid .card:nth-child(5){transition-delay:0.32s}.cards-grid .card:nth-child(6){transition-delay:0.4s}.cards-grid .card:nth-child(7){transition-delay:0.48s}.cards-grid .card:nth-child(8){transition-delay:0.56s}

[dir="rtl"]{text-align:right}[dir="rtl"] .site-header__inner{flex-direction:row-reverse}[dir="rtl"] .nav-list{flex-direction:row-reverse}[dir="rtl"] ul,[dir="rtl"] ol{padding-left:0;padding-right:var(--s-6)}[dir="rtl"] .card__link::after{content:'←'}

/* Hauptnavigation: ab ~920px als einzeilige Symbol-ueber-Text-Leiste sichtbar; darunter zum "Menue"-Knopf einklappen */
@media(max-width:919px){
  .nav-toggle{display:flex}.nav-list{display:none;position:absolute;top:60px;left:0;right:0;background:var(--c-bg-primary);flex-direction:column;align-items:stretch;padding:var(--s-3);border-bottom:0.5px solid var(--c-border);box-shadow:0 12px 30px var(--c-shadow-md)}.nav-list.open{display:flex}
  .nav-list .nav-link{flex-direction:row;justify-content:flex-start;gap:var(--s-3);min-height:48px;padding:var(--s-3) var(--s-4);text-align:left}
  .nav-list .nav-link__cap{flex:1;justify-content:space-between;gap:var(--s-3)}
  .nav-list .nav-link__text{font-size:1rem;white-space:normal}
  .nav-list .dropdown-arrow{font-size:0.7rem}
  .nav-dropdown{position:static;transform:none;box-shadow:none;border:none;background:transparent;backdrop-filter:none;min-width:auto;opacity:1;padding-left:var(--s-6)}.nav-item:hover .nav-dropdown{display:none}.nav-item.open .nav-dropdown{display:block}.nav-dropdown--lang{left:0;transform:none}
}
@media(max-width:1080px){
  .hero h1{font-size:clamp(2rem,5vw,3rem)}.hero{padding:var(--s-16) 0 var(--s-12)}.about-content{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
  .a11y-toolbar__separator{display:none}
  .a11y-btn[data-action="contrast"]::after{font-size:0.55rem;display:block;line-height:1;margin-top:1px}
}
@media(max-width:600px){.hero{padding:var(--s-12) 0 var(--s-10)}.section{padding:var(--s-12) 0}.stats-bar{padding:var(--s-10) 0}}
@media print{.a11y-toolbar,.site-header,.site-footer,.nav-toggle,.read-section-btn,.tts-controls,.btn{display:none!important}body{color:#000;background:#fff;font-size:12pt}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}.card{opacity:1!important;transform:none!important}.card:hover{transform:none!important}.card:hover .card__img{transform:none!important}.card:hover .card__icon{transform:none!important}}

/* ============================================
   WCAG 2.2 AA Compliance Additions
   ============================================ */

/* 2.4.7 + 2.4.11: Focus Appearance (AA)
   - 3px solid outline = area > 2px perimeter ✅
   - 3:1 contrast between focused/unfocused ✅
   - Focus not obscured: scroll-padding ✅ */
:focus-visible {
  outline: 3px solid var(--c-focus);
  outline-offset: 3px;
  border-radius: 4px;
  z-index: 10;  /* prevent obscuring (2.4.11) */
}

/* Ensure focus not obscured by sticky elements */
html { scroll-padding-top: 120px; }

/* Additional focus ring on dark backgrounds */
.hero :focus-visible,
.stats-bar :focus-visible,
.page-hero :focus-visible {
  outline-color: #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.5);
}

[data-contrast="dark"] :focus-visible {
  outline-color: var(--c-focus);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.8);
}

/* 2.5.8: Target Size Minimum (24x24px) */
a, button, [role="button"], input, select, textarea,
[tabindex]:not([tabindex="-1"]) {
  min-height: 24px;
  min-width: 24px;
}

/* Ensure adequate spacing between interactive elements */
.nav-list { gap: 2px; }
.nav-dropdown a { margin: 2px 0; }
.footer-links li { margin-bottom: 4px; }

/* 1.4.3 + 1.4.6: Contrast Minimum
   All text colors now verified ≥4.5:1 */

/* 1.4.4: Resize Text - text scales with rem/em */
/* Already using calc(var(--f-size-base)*var(--f-scale)) ✅ */

/* 1.4.12: Text Spacing
   No clipping when text-spacing adjusted */
* {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

p, li, td, th, label, span, a, h1, h2, h3, h4 {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* 1.4.11: Non-text Contrast (3:1 for UI components)
   Form inputs border = #636366 on white = 5.50:1 ✅ */
.form-group input,
.form-group textarea,
.form-group select {
  border: 2px solid var(--c-text-tertiary);
}

/* 1.4.13: Content on Hover or Focus
   Dropdowns: dismissible, hoverable, persistent */
.nav-dropdown {
  pointer-events: auto;
}

/* 2.4.6: Headings and Labels - descriptive ✅ (content level) */

/* 2.4.1: Bypass Blocks - skip link ✅ */

/* 2.1.1: Keyboard accessible */
/* 2.1.2: No keyboard trap */
.nav-dropdown a:last-child:focus + .nav-dropdown,
.nav-item:not(:hover):not(:focus-within) .nav-dropdown {
  /* Allow keyboard to escape dropdown */
}

/* 3.2.6: Consistent Help (AA)
   Contact link in footer on every page ✅ */

/* 2.5.7: Dragging Movements
   No drag-based interactions on this site ✅ */

/* 3.3.7: Redundant Entry
   Single-page forms, no repeated inputs ✅ */

/* 3.3.8: Accessible Authentication
   No login/auth on this site ✅ */

/* 1.3.4: Orientation - no orientation lock */
@media screen {
  body { min-height: 100vh; }
}

/* 1.4.10: Reflow - content at 320px width without horizontal scrolling */
@media (max-width: 320px) {
  .site-header__inner { padding: 0 var(--s-3); }
  .section__inner { padding: 0 var(--s-3); }
  .hero__inner { padding: 0 var(--s-3); }
  .a11y-toolbar__inner { padding: 0 var(--s-3); }
  .stat__number { font-size: 1.8rem; }
}

/* Visible state for form errors (3.3.1) */
input:invalid:not(:placeholder-shown),
textarea:invalid:not(:placeholder-shown) {
  border-color: var(--c-red, #d32f2f);
  box-shadow: 0 0 0 2px rgba(211, 47, 47, 0.15);
}

/* Required field indicator */
label .required {
  color: var(--c-red, #d32f2f);
  font-weight: 700;
}

/* Barrierefreiheitserklärung link styling */
.a11y-statement-link {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  font-size: 0.8rem;
  padding: var(--s-2) var(--s-4);
  border-radius: 980px;
  background: var(--c-bg-secondary);
  color: var(--c-text-secondary);
  text-decoration: none;
  transition: all var(--duration) var(--ease-out);
}
.a11y-statement-link:hover {
  background: var(--c-accent);
  color: #fff;
}

/* --- Card Images (Original AssistUK Icons) --- */
.card__img {
  width: 80px;
  height: 80px;
  border-radius: var(--radius-md);
  margin-bottom: var(--s-5);
  transition: transform var(--duration) var(--ease-out);
  object-fit: contain;
}

.card:hover .card__img {
  transform: scale(1.08) rotate(-2deg);
}

/* Logo in header */
.site-logo__img {
  height: 46px;
  width: auto;
  transition: opacity var(--duration);
}
@media (min-width: 920px) {
  /* Logo + Menue als zentrierte Gruppe (wie die Toolbar) statt weit auseinander */
  .site-header__inner { height: 68px; justify-content: center; gap: clamp(2.5rem, 8vw, 7rem); }
  .site-logo { flex-shrink: 0; }
}

.site-logo:hover .site-logo__img {
  opacity: 0.85;
}

/* Dark mode: slightly brighten icons */
[data-contrast="dark"] .card__img {
  filter: brightness(1.1);
}

[data-contrast="dark"] .site-logo__img {
  filter: brightness(0) invert(1);
}
[data-contrast="high"] .site-logo__img {
  filter: brightness(0);
}

/* --- Language Detection Toast --- */
.lang-toast {
  position: fixed;
  bottom: var(--s-6);
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: var(--c-bg-glass-heavy);
  backdrop-filter: blur(var(--blur-heavy));
  -webkit-backdrop-filter: blur(var(--blur-heavy));
  border: 0.5px solid var(--c-border-strong);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 40px var(--c-shadow-lg);
  padding: var(--s-4) var(--s-6);
  display: flex;
  align-items: center;
  gap: var(--s-4);
  font-size: 0.9rem;
  z-index: 2000;
  opacity: 0;
  transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out);
  max-width: 90vw;
  flex-wrap: wrap;
}
.lang-toast.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.lang-toast-btn {
  background: var(--c-accent);
  color: #fff;
  border: none;
  border-radius: 980px;
  padding: var(--s-2) var(--s-5);
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  font-family: var(--f-body);
  transition: all var(--duration) var(--ease-out);
  white-space: nowrap;
}
.lang-toast-btn:hover { transform: scale(1.05); }
.lang-toast-close {
  background: none;
  border: none;
  font-size: 1.3rem;
  color: var(--c-text-tertiary);
  cursor: pointer;
  padding: var(--s-1);
  line-height: 1;
  min-width: 24px;
  min-height: 24px;
}

/* --- TTS Active Button Animation --- */
.tts-active {
  animation: tts-pulse 1.5s ease-in-out infinite;
}
@keyframes tts-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(168,52,90,0.3); }
  50% { box-shadow: 0 0 0 6px rgba(168,52,90,0); }
}

/* --- TTS Pause Indicator --- */
.tts-active-indicator.paused {
  animation: none;
  opacity: 0.5;
}

/* --- TTS Speed Control --- */
.tts-speed-group {
  display: flex;
  align-items: center;
  gap: var(--s-2);
}
.tts-speed-slider {
  width: 60px;
  height: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: var(--c-border-strong);
  border-radius: 2px;
  outline: 3px solid transparent;
  cursor: pointer;
}
.tts-speed-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--c-accent);
  cursor: pointer;
}
.tts-speed-slider::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--c-accent);
  cursor: pointer;
  border: none;
}
#tts-speed-label {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--c-text-tertiary);
  min-width: 28px;
}

/* --- TTS Sentence-level Highlighting (v4) --- */
.tts-sentence-active {
  background: rgba(168, 52, 90, 0.08) !important;
  border-radius: 4px;
  padding: 0;
  margin: 0;
  transition: background-color 0.2s var(--ease-out);
}

[data-contrast="dark"] .tts-sentence-active {
  background: rgba(41, 151, 255, 0.12) !important;
}

[data-contrast="high"] .tts-sentence-active {
  background: rgba(0, 51, 138, 0.12) !important;
}

/* Word active within sentence - brighter highlight */
.tts-sentence-active.tts-word-active,
.tts-word-active {
  background: var(--c-tts-word) !important;
  color: var(--c-tts-word-text) !important;
  border-radius: 3px;
}

/* A heading is read as one unit, so the faint sentence tint is barely visible on
   its large bold text. Light the WHOLE active heading clearly (same colour as the
   word highlight) the moment it is being read — independent of word-boundary timing. */
h1 .tts-sentence-active, h2 .tts-sentence-active, h3 .tts-sentence-active,
h4 .tts-sentence-active, h5 .tts-sentence-active, h6 .tts-sentence-active {
  background: var(--c-tts-word) !important;
  color: var(--c-tts-word-text) !important;
}

/* --- Scheme-specific overrides for sepia & bluefilter --- */
[data-contrast="sepia"] .card__img { filter: sepia(0.2) brightness(0.95); }
[data-contrast="sepia"] .site-logo__img { filter: sepia(0.3); }
[data-contrast="bluefilter"] .card__img { filter: sepia(0.4) brightness(0.9); }
[data-contrast="bluefilter"] .site-logo__img { filter: brightness(0) invert(1) sepia(0.5) hue-rotate(-20deg); }

/* === Themenfarben (warm & freundlich; greifen nur im Normal-/Hell-Modus; Kontrastmodi haben Vorrang) === */
[data-contrast="normal"][data-theme="koralle"]{--c-bg:#fdf7f2;--c-bg-secondary:#f8ebe1;--c-bg-tertiary:#eed9c9;--c-link:#b04a30;--c-link-hover:#8a3826;--c-accent:#b54d33;--c-accent-2:#8a3826;--c-focus:#b54d33;--gradient-hero:linear-gradient(135deg,#7e2f1c 0%,#b54d33 50%,#cf6b46 100%);--gradient-accent:linear-gradient(135deg,#b54d33,#e6a45e)}
[data-contrast="normal"][data-theme="bernstein"]{--c-bg:#fdf9f0;--c-bg-secondary:#f6edd9;--c-bg-tertiary:#ecdcb8;--c-link:#8f5519;--c-link-hover:#744414;--c-accent:#9a5d1e;--c-accent-2:#744414;--c-focus:#9a5d1e;--gradient-hero:linear-gradient(135deg,#6e4413 0%,#9a5d1e 50%,#c08433 100%);--gradient-accent:linear-gradient(135deg,#9a5d1e,#d9a850)}
[data-contrast="normal"][data-theme="pflaume"]{--c-bg:#fbf6f8;--c-bg-secondary:#f2e7ee;--c-bg-tertiary:#e6d3e0;--c-link:#844070;--c-link-hover:#66305a;--c-accent:#8a4570;--c-accent-2:#66305a;--c-focus:#8a4570;--gradient-hero:linear-gradient(135deg,#5e2b54 0%,#8a4570 50%,#a85f8c 100%);--gradient-accent:linear-gradient(135deg,#8a4570,#c283a0)}
[data-contrast="normal"][data-theme="salbei"]{--c-bg:#faf8f0;--c-bg-secondary:#eef0e0;--c-bg-tertiary:#dde2c8;--c-link:#506b2c;--c-link-hover:#3e5422;--c-accent:#54702f;--c-accent-2:#3e5422;--c-focus:#54702f;--gradient-hero:linear-gradient(135deg,#3a4f22 0%,#54702f 50%,#6f8c41 100%);--gradient-accent:linear-gradient(135deg,#54702f,#9bb06a)}

/* Farb-Swatches in der Barriere-Toolbar */
.a11y-swatch{padding:0;border-radius:50%;border:2px solid var(--c-border-strong);overflow:hidden}
.a11y-swatch:hover{transform:scale(1.1)}
.a11y-swatch[aria-pressed="true"]{border-color:var(--c-text);box-shadow:inset 0 0 0 2px var(--c-bg-primary)}

/* 2-Klick-Video-Einbettung (DSGVO) */
/* Vor dem Laden gibt der DSGVO-Kasten die Hoehe vor (waechst mit Text -> Knopf wird
   nie abgeschnitten); nach dem Laden ist die Einbettung 16:9 fuer das iframe. */
.video-embed{max-width:760px;margin:var(--s-5) auto 0;position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--c-bg-tertiary)}
.video-embed.is-loaded{aspect-ratio:16/9}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:1}
.video-embed__gate{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--s-6);cursor:pointer;min-height:clamp(200px,42vw,400px)}
.video-embed__gate p{max-width:36ch;margin-left:auto;margin-right:auto}
.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:var(--s-5);margin-top:var(--s-5)}
.video-grid .video-embed{margin:0}

/* Glossar */
.glossar h3{margin-top:var(--s-8);padding-top:var(--s-5);border-top:1px solid var(--c-border);color:var(--c-accent);clear:both}
.glossar h3:first-child{margin-top:0;padding-top:0;border-top:none}
.glossar-img{float:right;width:120px;height:auto;margin:0 0 var(--s-3) var(--s-5);border-radius:var(--radius-md)}
@media(max-width:520px){.glossar-img{width:88px;margin-left:var(--s-3)}}

/* Druck-Ansicht: nur Inhalt, ohne Bedienelemente */
@media print {
  .a11y-toolbar, .site-header, .site-footer, #site-cookie-banner, .skip-link, .breadcrumb, .read-section-btn, .video-embed, .btn { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .hero, .page-hero { background: none !important; color: #000 !important; padding: 0 0 0.5rem !important; }
  .hero h1, .page-hero h1, .hero p, .page-hero p { color: #000 !important; }
  .section, .section--alt { background: none !important; padding: 0.4rem 0 !important; }
  a { color: #000 !important; }
  .komm-karte { border: 2px solid #000 !important; box-shadow: none !important; }
}

/* Körper-ABC Übersicht A–Z */
.abc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--s-3);margin-top:var(--s-5)}
.abc-item{display:flex;align-items:center;gap:var(--s-3);background:var(--c-bg-primary);border:0.5px solid var(--c-border);border-radius:var(--radius-md);padding:var(--s-3) var(--s-4)}
.abc-letter{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 6px;border-radius:var(--radius-sm);background:var(--c-bg-secondary);color:var(--c-accent);font-family:var(--f-display);font-weight:700;font-size:1.2rem}
.abc-item .abc-desc{font-size:0.92rem;color:var(--c-text-secondary);line-height:1.4}
.abc-detail{border:0.5px solid var(--c-border);border-radius:var(--radius-md);background:var(--c-bg-primary);margin-bottom:var(--s-2);padding:0 var(--s-4)}
.abc-detail summary{cursor:pointer;padding:var(--s-3) 0;font-size:0.95rem;color:var(--c-text)}
.abc-detail summary strong{color:var(--c-accent);font-family:var(--f-display);font-size:1.1rem;margin-right:var(--s-2)}
.abc-detail .video-embed{margin:0 0 var(--s-4)}
.video-embed--sm{max-width:480px;margin-left:0;margin-right:0}
[data-contrast="sepia"] .tts-sentence-active { background: rgba(107,66,38,0.08) !important; }
[data-contrast="bluefilter"] .tts-sentence-active { background: rgba(212,160,96,0.1) !important; }
[data-contrast="sepia"] .hero::before { opacity: 0.88; }
[data-contrast="bluefilter"] .hero::before { opacity: 0.90; }
[data-contrast="sepia"] .page-hero::before { opacity: 0.90; }
[data-contrast="bluefilter"] .page-hero::before { opacity: 0.92; }
[data-contrast="sepia"] .stat__number { -webkit-text-fill-color: #c49a6c; background: none; }
[data-contrast="bluefilter"] .stat__number { -webkit-text-fill-color: #e8b878; background: none; }

/* --- TTS Buttons: More Prominent --- */
#btn-read-page {
  background: var(--c-accent);
  color: #fff;
  border-color: var(--c-accent);
  padding: var(--s-2) var(--s-5);
  font-size: 0.9rem;
  min-height: 40px;
  box-shadow: 0 2px 12px rgba(168, 52, 90, 0.3);
  font-weight: 700;
}
#btn-read-page:hover {
  background: var(--c-accent-2);
  border-color: var(--c-accent-2);
  transform: scale(1.06);
  box-shadow: 0 4px 20px rgba(168, 52, 90, 0.45);
}
#btn-read-page[aria-pressed="true"],
#btn-read-page.tts-active {
  background: var(--c-orange, #ff9500);
  border-color: var(--c-orange, #ff9500);
  box-shadow: 0 2px 12px rgba(255, 149, 0, 0.4);
}
@keyframes tts-attention-pulse {
  0%, 100% { box-shadow: 0 2px 12px rgba(168,52,90,0.3); }
  50% { box-shadow: 0 2px 20px rgba(168,52,90,0.55); }
}
#btn-read-page:not(.tts-active):hover {
  animation: tts-attention-pulse 2s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  #btn-read-page:not(.tts-active) { animation: none; }
}


/* --- Cookie Banner --- */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--c-bg-glass-heavy);
  backdrop-filter: blur(var(--blur-heavy));
  -webkit-backdrop-filter: blur(var(--blur-heavy));
  border-top: 1px solid var(--c-border-strong);
  padding: var(--s-6);
  z-index: 3000;
  box-shadow: 0 -4px 24px var(--c-shadow-lg);
}
.cookie-banner__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-4);
}
.cookie-banner__text {
  flex: 1 1 300px;
  font-size: 0.9rem;
  color: var(--c-text);
  margin-bottom: 0;
}
.cookie-banner__actions {
  display: flex;
  gap: var(--s-3);
  flex-wrap: wrap;
}
.cookie-btn { min-height: 44px; font-size: 0.9rem; }
.btn--outline-dark {
  background: transparent;
  color: var(--c-text);
  border: 1.5px solid var(--c-border-strong);
  border-radius: 980px;
  padding: var(--s-3) var(--s-5);
  font-family: var(--f-body);
  font-weight: 600;
  cursor: pointer;
  transition: all var(--duration) var(--ease-out);
}
.btn--outline-dark:hover {
  background: var(--c-bg-secondary);
  border-color: var(--c-accent);
  color: var(--c-accent);
}
.cookie-banner__link {
  font-size: 0.8rem;
  color: var(--c-text-tertiary);
  flex-basis: 100%;
  margin-top: var(--s-1);
}

/* --- Cookie Settings Modal --- */
.cookie-modal {
  position: fixed;
  inset: 0;
  z-index: 3001;
  align-items: center;
  justify-content: center;
}
.cookie-modal[hidden] { display: none !important; }
.cookie-modal:not([hidden]) { display: flex; }
.cookie-banner[hidden] { display: none !important; }
.cookie-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}
.cookie-modal__content {
  position: relative;
  background: var(--c-bg-primary);
  border-radius: var(--radius-lg);
  padding: var(--s-8);
  max-width: 560px;
  width: 90vw;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px var(--c-shadow-lg);
}
.cookie-modal__content h2 {
  font-family: var(--f-body);
  font-size: 1.3rem;
  margin-bottom: var(--s-6);
  border: none;
  padding-top: 0;
}
.cookie-category {
  padding: var(--s-4) 0;
  border-bottom: 1px solid var(--c-border);
}
.cookie-category:last-of-type { border-bottom: none; }
.cookie-category label {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  cursor: pointer;
  font-weight: 600;
  margin-bottom: var(--s-2);
}
.cookie-category input[type="checkbox"] {
  width: 22px;
  height: 22px;
  accent-color: var(--c-accent);
  flex-shrink: 0;
}
.cookie-category p {
  font-size: 0.85rem;
  color: var(--c-text-secondary);
  margin-bottom: 0;
  padding-left: 34px;
}
.cookie-modal__actions {
  display: flex;
  gap: var(--s-3);
  margin-top: var(--s-6);
}

/* --- YouTube 2-Click Placeholder --- */
.yt-placeholder {
  background: var(--c-bg-secondary);
  border: 2px dashed var(--c-border-strong);
  border-radius: var(--radius-lg);
  padding: var(--s-10);
  text-align: center;
  position: relative;
  aspect-ratio: 16/9;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--s-4);
}
.yt-placeholder__icon { font-size: 3rem; opacity: 0.5; }
.yt-placeholder__text { font-size: 0.9rem; color: var(--c-text-secondary); max-width: 400px; }
.yt-placeholder__btn {
  background: #ff0000;
  color: #fff;
  border: none;
  border-radius: 980px;
  padding: var(--s-3) var(--s-6);
  font-weight: 600;
  font-family: var(--f-body);
  cursor: pointer;
  font-size: 0.95rem;
  min-height: 44px;
  transition: all var(--duration) var(--ease-out);
}
.yt-placeholder__btn:hover { background: #cc0000; transform: scale(1.04); }

/* --- Status Messages --- */
.msg { padding: var(--s-3) var(--s-4); border-radius: var(--radius-sm); margin-bottom: var(--s-4); font-weight: 500; }
.msg-ok { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.msg-err { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
[data-contrast="dark"] .msg-ok { background: #1a3a1a; color: #8dda8d; border-color: #2a5a2a; }
[data-contrast="dark"] .msg-err { background: #3a1a1a; color: #da8d8d; border-color: #5a2a2a; }

/* --- Scroll Navigation Buttons --- */
.scroll-nav{position:fixed;right:var(--s-4);bottom:50%;transform:translateY(50%);display:flex;flex-direction:column;gap:var(--s-2);z-index:500;opacity:0.6;transition:opacity var(--duration)}
.scroll-nav:hover{opacity:1}
.scroll-nav__btn{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--c-border-strong);background:var(--c-bg-glass-heavy);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--c-text);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:all var(--duration);padding:0;line-height:1}
.scroll-nav__btn:hover{background:var(--c-accent);color:#fff;border-color:var(--c-accent);transform:scale(1.1)}
.scroll-nav__sep{height:1px;background:var(--c-border);margin:var(--s-1) 0}
/* Auf Touch/schmal sichtbar als schmale VERTIKALE Spalte unten rechts
   (untereinander; nur 40px breit -> kein horizontaler Ueberlauf). */
@media (pointer: coarse), (max-width: 800px){
  .scroll-nav{top:auto;bottom:calc(env(safe-area-inset-bottom, 0px) + var(--s-3));right:var(--s-2);transform:none;flex-direction:column;gap:var(--s-1);opacity:0.92}
  .scroll-nav__btn{width:40px;height:40px;font-size:1rem}
  .scroll-nav__sep{display:none}
}
@media print{.scroll-nav{display:none}}

/* --- Search --- */
.nav-item--search { margin-left: auto; }
.nav-search-toggle {
  background: none; border: none; color: var(--c-text-secondary); cursor: pointer;
  padding: var(--s-2); min-height: 44px; min-width: 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm); transition: background var(--duration);
}
.nav-search-toggle:hover { background: var(--c-bg-secondary); }
.nav-search-toggle svg { width: 20px; height: 20px; }

.search-overlay {
  position: fixed; top: 0; left: 0; right: 0;
  background: var(--c-bg-glass-heavy); backdrop-filter: blur(var(--blur-heavy));
  -webkit-backdrop-filter: blur(var(--blur-heavy));
  border-bottom: 1px solid var(--c-border-strong);
  box-shadow: 0 8px 30px var(--c-shadow-lg);
  padding: var(--s-6); z-index: 3000;
}
.search-overlay[hidden] { display: none !important; }

.search-close {
  position: absolute; top: var(--s-3); right: var(--s-4);
  background: none; border: none; font-size: 1.5rem; color: var(--c-text-tertiary);
  cursor: pointer; padding: var(--s-2); min-width: 44px; min-height: 44px;
  display: flex; align-items: center; justify-content: center;
}
.search-close:hover { color: var(--c-text); }
.search-form {
  max-width: var(--max-w); margin: var(--s-6) auto 0;
  display: flex; gap: var(--s-3);
}
.search-form input[type="search"] {
  flex: 1; padding: var(--s-3) var(--s-6);
  border: 2px solid var(--c-border-strong); border-radius: 980px;
  font-family: var(--f-body); font-size: 1.1rem;
  background: var(--c-bg-primary); color: var(--c-text);
  min-height: 52px; min-width: 0;
}
.search-form input[type="search"]:focus {
  border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(168,52,90,0.18); outline: 3px solid transparent;
}
.search-form button[type="submit"] {
  padding: var(--s-3) var(--s-5); background: var(--c-accent); color: #fff;
  border: none; border-radius: 980px; font-weight: 600; font-family: var(--f-body);
  cursor: pointer; min-height: 44px; transition: all var(--duration);
}
.search-form button[type="submit"]:hover { background: var(--c-accent-2); transform: scale(1.04); }

.search-results {
  max-width: var(--max-w); margin: var(--s-4) auto 0;
  max-height: 400px; overflow-y: auto;
}
.search-result-item {
  padding: var(--s-3) var(--s-4); border-radius: var(--radius-sm);
  transition: background var(--duration); display: block; text-decoration: none; color: var(--c-text);
}
.search-result-item:hover { background: var(--c-bg-secondary); }
.search-result-item h4 { font-family: var(--f-body); font-size: 0.95rem; font-weight: 600; color: var(--c-accent); margin-bottom: 2px; text-transform: none; }
.search-result-item p { font-size: 0.8rem; color: var(--c-text-secondary); margin-bottom: 0; max-width: none; }
.search-result-item .search-url { font-size: 0.7rem; color: var(--c-text-tertiary); }

.ai-answer {
  background: var(--c-bg-secondary); border-left: 4px solid var(--c-accent);
  border-radius: var(--radius-sm); padding: var(--s-4); margin-bottom: var(--s-4);
  font-size: 0.9rem; line-height: 1.5;
}
.ai-answer strong { color: var(--c-accent); font-size: 0.8rem; display: block; margin-bottom: var(--s-2); }
.search-loading { text-align: center; padding: var(--s-6); color: var(--c-text-tertiary); font-size: 0.9rem; }
.search-no-results { text-align: center; padding: var(--s-6); color: var(--c-text-tertiary); }

/* --- Card Slideshow --- */
.card-slideshow {
  position: relative;
  width: 100%;
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-bottom: var(--s-4);
  aspect-ratio: 779/544;
  background: var(--c-bg-secondary);
}
.card-slideshow img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.8s ease-in-out, transform var(--duration) var(--ease-out);
}
.card-slideshow img.slide-active {
  opacity: 1;
}
.card:hover .card-slideshow img.slide-active {
  transform: scale(1.05);
}
.card:hover .card-slideshow {
  box-shadow: 0 4px 16px var(--c-shadow-md);
}
.card-slideshow__dots {
  position: absolute;
  bottom: var(--s-2);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;
  z-index: 2;
}
.card-slideshow__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  border: 1px solid rgba(0,0,0,0.2);
  cursor: pointer;
  transition: all 0.3s;
  padding: 0;
  min-width: 8px;
  min-height: 8px;
}
.card-slideshow__dot.dot-active {
  background: #fff;
  transform: scale(1.3);
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
@media (prefers-reduced-motion: reduce) {
  .card-slideshow img { transition: none; }
}

/* Cookie & modal in print hidden */
@media print {
  .cookie-banner, .cookie-modal, .yt-placeholder { display: none !important; }
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms \!important;animation-iteration-count:1 \!important;transition-duration:0.01ms \!important;scroll-behavior:auto \!important}}
@media(prefers-contrast:more){[data-contrast="normal"]{--c-text:#000;--c-text-secondary:#1a1a1a;--c-text-tertiary:#333;--c-bg:#fff;--c-bg-primary:#fff;--c-bg-secondary:#f0f0f0;--c-border-strong:rgba(0,0,0,0.5)}}

/* ===== WCAG-Kontrast-Fixes: Dark/Bluefilter haben hellen Accent -> dunkler Text auf Accent-Flaechen ===== */
:root{--c-on-accent:#fff}
[data-contrast="dark"]{--c-on-accent:#15110c;--c-text-tertiary:#9a9aa0}
[data-contrast="bluefilter"]{--c-on-accent:#15110c}
[data-contrast="dark"] .btn--primary,[data-contrast="dark"] .btn--primary:hover,[data-contrast="dark"] .a11y-btn:hover,[data-contrast="dark"] .a11y-btn[aria-pressed="true"],[data-contrast="dark"] .a11y-btn.active,[data-contrast="dark"] .read-section-btn:hover,[data-contrast="dark"] .skip-link,[data-contrast="dark"] .card__tts,[data-contrast="dark"] .card--zg:hover .card__icon,[data-contrast="bluefilter"] .btn--primary,[data-contrast="bluefilter"] .btn--primary:hover,[data-contrast="bluefilter"] .a11y-btn:hover,[data-contrast="bluefilter"] .a11y-btn[aria-pressed="true"],[data-contrast="bluefilter"] .a11y-btn.active,[data-contrast="bluefilter"] .read-section-btn:hover,[data-contrast="bluefilter"] .skip-link,[data-contrast="bluefilter"] .card__tts,[data-contrast="bluefilter"] .card--zg:hover .card__icon{color:var(--c-on-accent)}