/* Barrierefreiheits-Nachtrag. Gemessen 28.08.2026 mit ui-gate.mjs an der LIVE-Seite
   cine-videoproduktion.de: 20 Verstöße — 18× zu kleine Klickfläche, 2× Kontrast.

   Zwei Regeln, die bei allen Seiten dieses Tages zugebissen haben:
   - min-height wirkt NICHT auf display:inline — jeder Treffer braucht inline-flex.
   - Höhe ist nicht Fläche: mehrere Ziele waren hoch genug und zu schmal. */

/* 1) Kontrast: #6d767f auf #05080b erreicht 4,35:1 — knapp unter den nötigen 4,5:1.
      #7c858f ist derselbe Farbton, heller, und erreicht 5,36:1. Geprüft gegen alle
      dunklen Flächen der Seite, nicht nur gegen eine — eine Farbe, die auf mehreren
      Hintergründen steht, braucht den schlechtesten Fall als Maßstab. */
/* Die beanstandete Farbe #6d767f steht NICHT im Quelltext — sie entsteht aus
   --color-text-muted (#b3c0cc, allein 10,83:1) mit opacity 0.6. Deshalb hilft
   kein color-Wert: die Deckkraft dunkelt ihn wieder ab. Mit 0.7 sind es 5,64:1
   bei praktisch gleicher Optik. Rückgerechnet, nicht geraten. */
.footer,
.footer *,
.contact__detail,
.contact__detail-link,
.contact__social-link,
[class*="muted"],
[class*="secondary"] {
  opacity: 0.7;
}

/* 2) Klickflächen auf das WCAG-Mindestmaß von 44 px. */
.nav__link,
.theme-toggle,
.contact__detail-link,
.contact__social-link,
nav a,
header a,
footer a,
footer button,
button,
[role="button"],
summary,
a[href^="tel:"],
a[href^="mailto:"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}

/* 3) Textlinks brauchen keine Mindestbreite — sie sind ohnehin breiter. */
.contact__detail-link,
a[href^="tel:"],
a[href^="mailto:"],
.nav__link {
  min-width: 0;
}

/* 4) Sichtbarer Fokus. currentColor passt sich jedem Hintergrund an.
      Mit Spezifität über Klassenregeln, damit ein vorhandenes outline:none
      überschrieben wird — :where() hat Spezifität 0 und verliert. */
:where(a, button, [role="button"], summary, input, select, textarea):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.nav__link:focus-visible,
.theme-toggle:focus-visible,
.contact__detail-link:focus-visible,
.contact__social-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* 5) Rechtsseiten: Links in Listenpunkten und in der Fußzeile der Datenschutz-
      seite sind eigenständige Ziele (Dienstanbieter, Widerruf, Impressum), keine
      Inline-Links mitten im Satz. */
.privacy-text a,
.privacy-list-item a,
.privacy-meta-link a,
.privacy-footer a,
.legal a:only-child {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  min-width: 0;
}

/* 6) Checkbox-Label als Klickfläche. Die Checkbox selbst bleibt 13 px — WCAG 2.5.8
      erlaubt das, WENN ein größeres Element dieselbe Aktion auslöst. Genau das ist
      das <label for=…>: es muss dafür aber selbst mindestens 44 px hoch sein. */
.form__check,
label[for] {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 0.5rem;
}