/* =========================================================================
   Barrierefreie Fassung — wird zusätzlich zu style.css geladen
   Gilt nur für die Seiten unter /barrierefrei/
   ========================================================================= */

:root {
  /* Ruhigere, kontrastreichere Grundeinstellung */
  --ink:        #16211C;
  --ink-2:      #33403A;
  --ink-3:      #556158;   /* 6,1:1 auf Weiß, 5,6:1 auf Elfenbein */
  --line-ui:    #828B79;   /* Rahmen von Bedienelementen, 3,3:1 */
  --lh-body:    1.8;
}

/* Etwas größere Grundschrift und mehr Zeilenabstand */
body { font-size: 18px; }
.lede { font-size: 1.12rem; }
.prose p, .prose li { font-size: 1.06rem; }
p, li { letter-spacing: .005em; }

/* ---------- Fokus: zweifarbig, damit er auf jedem Grund sichtbar bleibt --- */
:focus-visible {
  outline: 3px solid var(--brand-700);
  outline-offset: 3px;
  border-radius: var(--r-sm);
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .95);
}
.hero :focus-visible, .pagehead :focus-visible, .footer :focus-visible,
.topbar :focus-visible, .mobile-nav :focus-visible, .cta-band :focus-visible,
.section--dark :focus-visible, .card :focus-visible {
  outline-color: #fff;
  box-shadow: 0 0 0 6px rgba(7, 26, 17, .9);
}

/* ---------- Bedienelemente deutlicher abgrenzen (WCAG 1.4.11) ------------- */
.field input, .field select, .field textarea { border-color: var(--line-ui); }
.file-drop { border-color: var(--line-ui); }
.chip, .tslider__btn, .burger { border-color: var(--line-ui); }

/* ---------- Video anhalten (WCAG 2.2.2) ---------------------------------- */
.media-toggle { display: inline-flex; }

/* ---------- Keine Bewegung ohne Zutun ----------------------------------- */
/* In dieser Fassung sind Einblendungen und Bildzoom grundsätzlich abgeschaltet;
   Inhalte stehen sofort und vollständig. */
.reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
.card__img img, .post__img img, .gallery img { transition: none !important; }
.card:hover .card__img img, .post:hover .post__img img,
.gallery figure:hover img { transform: none !important; }
.card:hover, .card:focus-within, .post:hover, .tile:hover, .job:hover {
  transform: none !important;
}

/* ---------- Karteninhalte immer vollständig sichtbar ---------------------- */
/* Kein Aufklappen beim Überfahren: Der ganze Text steht dauerhaft da, die Karte
   wächst mit. Dadurch entfällt Scrollen innerhalb der Karte vollständig. */
.card { height: auto; min-height: 0; }
.card__body { position: relative; max-height: none; overflow: visible; }
.card__short { display: none; }
.card__long { max-height: none !important; opacity: 1 !important; margin-top: 4px; }
.card::after,
.card:hover::after, .card:focus-within::after {
  background: linear-gradient(to top, rgba(7,26,17,.95) 0%, rgba(9,32,21,.92) 55%, rgba(12,43,29,.86) 100%);
}
.card.has-more .card__body,
.card.has-more.is-scrolled .card__body,
.card.has-more.is-end .card__body {
  -webkit-mask-image: none; mask-image: none;
}

/* ---------- Klickflächen großzügiger (WCAG 2.5.8 mit Reserve) ------------ */
.btn { min-height: 52px; }
.footer li { margin-bottom: 14px; }
.footer a, .crumbs a { display: inline-block; padding-block: 4px; }
.nav a, .nav__toggle { padding-block: 14px; }

/* ---------- Umschalter zurück zur Standardfassung ------------------------ */
.a11y-bar {
  background: var(--brand-700); color: #fff;
  font-size: .9rem;
}
.a11y-bar__inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px; padding-block: 12px;
}
.a11y-bar p { margin: 0; }
.a11y-bar a { color: #fff; text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.a11y-bar a:hover { color: var(--accent-soft); }

/* ---------- Tabellen ruhiger ------------------------------------------- */
.datatable tbody tr:nth-child(even) { background: #fff; }
.datatable tbody tr { border-top: 2px solid var(--line-ui); }