/* Einwilligungs-Leiste (Artur 11.09.2026, kompakter seit 14.09.2026 nach Florians Testrunde F1).
   Farben und Schriften aus der Escape-CI, damit die Leiste wie Teil der Seite aussieht und
   nicht wie ein fremdes Werkzeug. Bewusst flach: eine Zeile Text, drei Knoepfe, kein Schatten,
   keine Ueberschrift. Inhaltlich unveraendert, nur die Praesenz ist zurueckgenommen. */
.consent-box{
  position:fixed;left:0;right:0;bottom:0;z-index:2147483001;
  background:#232864;color:#fff;
  border-top:2px solid #ff6600;
}
/* Artur 18.09.2026: „Cookie-Banner soll etwas kleiner sein, ist aktuell zu groß" — zweite Stufe:
   Innenabstand 8 px, Text 0,78 rem, Knöpfe 32 px hoch. Inhalt und Knöpfe unverändert. */
.consent-inner{
  max-width:1100px;margin:0 auto;padding:8px 16px;
  display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;justify-content:space-between;
}
.consent-text{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:6px}
.consent-box p{margin:0;font-size:.78rem;line-height:1.35;color:#e6e8f5}
.consent-box a{color:#ffb37a;text-decoration:underline}
.consent-optionen{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.consent-optionen[hidden]{display:none}
.consent-optionen label{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;line-height:1.45;color:#e6e8f5;cursor:pointer}
.consent-optionen input{margin-top:.25em;width:18px;height:18px;accent-color:#ff6600;flex:none}
.consent-optionen strong{color:#fff}
.consent-klein{font-size:.78rem;color:#b9bfdd}

.consent-knoepfe{flex:0 1 auto;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.consent-box button{
  font-family:"Lato",system-ui,sans-serif;font-weight:700;font-size:.78rem;
  padding:5px 12px;min-height:32px;border-radius:3px;border:2px solid transparent;cursor:pointer;
}
.consent-ja,.consent-speichern{background:#ff6600;color:#fff;border-color:#ff6600}
.consent-ja:hover,.consent-speichern:hover{background:#e65c00;border-color:#e65c00}
.consent-nein{background:transparent;color:#fff;border-color:#7b83b8}
.consent-nein:hover{border-color:#fff}
.consent-mehr{background:transparent;color:#ffb37a;border-color:transparent;text-decoration:underline;padding-left:4px;padding-right:4px}
.consent-box button:focus-visible{outline:3px solid #fff;outline-offset:2px}

@media (max-width:640px){
  .consent-inner{padding:8px 12px;gap:6px}
  .consent-box p{font-size:.76rem;line-height:1.3}
  .consent-knoepfe{width:100%}
  /* Auf dem Handy bleibt die Fingerflaeche gross genug, auch wenn die Leiste flacher ist.
     Alle drei Knoepfe stehen in EINER Zeile - drei gestapelte Zeilen waren der Grund,
     warum die Leiste mobil trotz kleinerer Schrift noch ein Viertel des Bildes einnahm. */
  .consent-knoepfe{flex-wrap:nowrap;gap:4px}
  /* Der Sperrabstand des Themes (1,12 px je Zeichen) kostete allein 44 px Zeilenbreite. */
  /* 40 px bleibt gut mit dem Daumen zu treffen (48 px war die Vorgabe der Leiste vom 14.09.). */
  .consent-knoepfe button{flex:0 1 auto;min-height:40px;font-size:.7rem;padding:6px 6px;white-space:nowrap;letter-spacing:.02em}
  .consent-knoepfe .consent-ja,.consent-knoepfe .consent-nein{flex:1 1 auto}
}