/*
 * Barrierefreiheit - Ergaenzungen zum Theme (P13, 18.09.2026). Unminifiziert,
 * versioniert unter public/aos/, geladen nach files/theme/css/fonts.css in den
 * Seitenvorlagen fe_page*.html5. Farben der Marke werden hier NICHT geaendert -
 * Kontrast entscheidet der Betreiber (docs/nachweise/p13-kontrast-vorlage.md).
 */

/* Sichtbarer Tastaturfokus auf allen bedienbaren Elementen (WCAG 2.4.7).
   :focus-visible trifft nur den Tastaturfokus, nicht den Mausklick. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #23201e;
  outline-offset: 2px;
  box-shadow: 0 0 0 5px #ffffff;
}

/* Sprunglink: unsichtbar, bis er per Tab den Fokus bekommt (WCAG 2.4.1). */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  padding: 0.75em 1em;
  background: #23201e;
  color: #ffffff;
  text-decoration: none;
}
.skip-link:focus,
.skip-link:focus-visible {
  left: 0.5em;
  top: 0.5em;
}

/* Nur fuer Screenreader (Beschriftungen, die optisch nicht gebraucht werden). */
.invisible,
.sr-nur {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Das Laufband im Seitenkopf gibt es nicht mehr (Entscheid Tobias 07.10.2026, tools/v1/laufband-entfernen.py). Rueckweg: docs/modernisierung/sql/u11-laufband-zurueck-*.sql */
@media (prefers-reduced-motion: reduce) {
  .slider-wrapper .slider-control,
  .ce_sliderStart .slider-control {
    animation: none !important;
  }
}

/* --- Nachtrag 18.09.2026 nach dem ersten axe-Lauf (35374735938) ------------------------- */

/* .invisible ist Contaos Klasse fuer Text, der nur Hilfstechnik hoeren soll (Suchfeld-Label,
   Formular-Labels). Das Theme setzt am Ende des Buendels `.invisible { visibility:hidden
   !important }` - damit war der Text fuer NIEMANDEN da (axe: label critical am Suchfeld,
   3 Breiten). Die Regel oben (clip-Muster) bleibt; hier nur die Sichtbarkeit fuer Hilfstechnik. */
.invisible,
.sr-nur {
  visibility: visible !important;
}

/* Zielgroesse (WCAG 2.5.8, axe target-size, serious): Die Links der Fussnavigationen und der
   Rechtszeile sind 20-23 px hoch und stehen bei Tablet und Mobil 20-23 px untereinander;
   Soll sind 24 px Hoehe oder Abstand. Desktop (1280 px) bestand - dort stehen die Rechtslinks
   nebeneinander. Deshalb nur bis 1024 px: Links als inline-block mit 24 px Zeile. */
@media (max-width: 1024px) {
  #footer .footercol nav li > a,
  #footer .footercol nav li > span {
    display: inline-block;
    min-height: 24px;
    line-height: 24px;
  }
  #footer .copyright .mod_customnav li {
    height: auto;
    margin: 2px 10px 2px 0;
  }
  #footer .copyright .mod_customnav li a,
  #footer .copyright .mod_customnav li > span {
    margin-top: 0;
    min-height: 24px;
    line-height: 24px;
  }
}

/*
 * UEBERSCHRIFTEN-BRUECKE (29.09.2026, Meldungen aos-website#17, #35, #18 Punkte 1-4).
 *
 * P13 hat drei Ueberschriften auf die richtige Ebene gesetzt (Barrierefreiheit, WCAG 1.3.1):
 *   Startseiten-Slides h1 -> h2 (.slide-headline) · Fussnavigationen h4 -> h2 (.headline) ·
 *   Schnellkontakt h4 -> h3.
 * Das minifizierte Theme-CSS haengt aber am ALTEN Tag, und die globale Regel
 * `h2 { color:#f39100 }` greift. Folge: orange Schrift auf orangem Kasten, Footer-Ueberschriften
 * orange statt weiss, Schnellkontakt ohne Kasten, Icon und mit falscher Groesse.
 *
 * Die Semantik BLEIBT, die Optik folgt ihr. Jede Regel unten ist die gemessene Theme-Regel des
 * alten Tags (Sammel-CSS der Stufe, 29.09.2026), auf den neuen Tag uebertragen - keine neue
 * Gestaltung. Wer hier eine Farbe aendert, aendert das Theme, nicht die Bruecke.
 */

/* Slides: das Theme gab der h1 keine Farbe - sie erbte die Schrift des Labels. */
.ce_e_slide .label .slide-headline {
  margin: 0 0 15px;
  font-size: 36px;
  line-height: 40px;
  font-weight: 700;
  color: inherit;
}
/* Infokasten im Banner-Slider: wieder der Stand des Themes und der Bestandsseite (#94, 06.10.2026: Kasten und Zeilenabstaende
   waren gegenueber Live zu gross). Die in #17 gewuenschten groesseren Abstaende betreffen nur den Lauftext im Kopf (.lauftext, siehe oben),
   Klarstellung der Testerin vom 06.10.2026 in #94. Gemessen wird in der Spec UEB-05 (Obergrenze) und UEB-06 (Lauftext). */
@media (max-width: 1380px) { .ce_e_slide .container .slide-headline { font-size: 30px; } }
@media (max-width: 900px) {
  .ce_e_slide .label .slide-headline { font-size: 32.4px; line-height: 36px; }
  #keyvisual #intro .container .label div .slide-headline { font-size: 27px; }
}
@media (max-width: 750px) {
  .ce_e_slide .label .slide-headline { font-size: 28.8px; line-height: 32px; }
  #keyvisual #intro .container .label div .slide-headline { font-size: 24px; line-height: 24px; }
}

/* Fussnavigationen: `#footer .headline` setzt Groesse und Abstand, aber keine Farbe - die h4
   erbte das Weiss des Footers, die h2 bekommt das Orange der globalen Regel. */
#footer h2.headline { color: inherit; }

/* Schnellkontakt: die komplette Optik stand an `.kontaktbuttons h4` (customize.min.css). */
.kontaktbuttons h3 {
  margin: 0;
  padding: 12px 8px 12px 50px;
  border-radius: 6px 6px 0 0;
  color: #fff;
  background: url(../files/icons/schnellkontakt.svg) no-repeat #f39100 12px center;
  background-size: 26px;
  font-size: 20px;
  line-height: 20.8px;
  position: relative;
  cursor: grab;
}
@media (max-width: 767px) {
  body.kontaktbuttons-active-mob .kontaktbuttons h3::after { display: inline-block; }
}

/* V1 (aos#93, K8): Das Siegel im Fuss (ProvenExpert, bleibt auf Betreiber-Entscheid) verbreiterte die Startseite bei 390 px um 61 px
   (gemessen 06.10.2026, Suite inhalte V1-06: rechter Rand 451 px). Es bleibt im Fenster und beschneidet nicht den Inhalt der Seite. */
@media (max-width: 767px) {
  #provenExpertFooterArea { position: relative; left: 0; right: auto; max-width: 100%; box-sizing: border-box; overflow-x: hidden; }
  #provenExpertFooterArea table { max-width: 100%; }
}

/* V1 (aos#93, K8): Eine Spaltenreihe (Bootstrap-Zeile mit negativem Rand) ragte bei 390 px 3 px ueber den Rand (gemessen 06.10.2026, V1-06:
   rechter Rand 393 px). Der Seitenrand beschneidet, statt dass die Seite seitlich wackelt (`body { overflow-x: clip }` allein griff nicht, Lauf 0945). */
@media (max-width: 767px) {
  html, body { overflow-x: hidden; max-width: 100%; }
  .row.ce_spaltenset_wrapper_start { margin-right: 0; }
}