/* bausteine.css — Sorte A: in jedem Projekt identisch, nie im Projekt bearbeiten.
   Änderungen gehören ins Startpaket und werden von dort verteilt.
   Quelle: BARRIEREFREIHEIT.md (Handlungsleiste), WEBSEITEN-STANDARD Abschnitt 5a
   (Brotkrumen). Stand: 19.08.2026

   Beide sind seit dem 18.08.2026 Pflicht. Farben kommen aus tokens-marke.css;
   steht dort nichts, greift der Rückfall dahinter. */

/* ── Fixierte Handlungsleiste ──────────────────────────────────────────────
   Pflicht bis 860 px. Vier Bedingungen, sonst schadet sie mehr als sie nützt:
   genau eine Handlung, erst nach dem Hero, Platz am Seitenende, Home-Indikator.

   Ausgenommen sind Seiten, die selbst das Ziel sind — Formular, Danke,
   Ergebnis, Terminbuchung — und die Rechtstexte. */
.cta-leiste{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
  display: none; align-items: center; gap: 12px;
  padding: 11px var(--pad, 16px) calc(11px + env(safe-area-inset-bottom));
  background: var(--flaeche-leiste, rgba(255,255,255,.97));
  border-top: 1px solid var(--linie, rgba(0,0,0,.12));
  box-shadow: 0 -4px 20px rgba(16,24,32,.1);

  /* translateY(100%) entspricht der eigenen Höhe — kein Pixelwert, der bei
     jeder Textänderung nachgezogen werden muss. transform statt bottom, sonst
     rechnet der Browser für jedes Bild das Layout neu. */
  transform: translateY(100%);
  transition: transform 380ms cubic-bezier(.32,.72,0,1);
}
.cta-leiste.is-visible{ transform: translateY(0); }

.cta-leiste__text{ flex: 1; min-width: 0; line-height: 1.3; }
.cta-leiste__text b{ display: block; font-size: .95rem; }
.cta-leiste__text span{ display: block; font-size: .78rem; opacity: .75; }
.cta-leiste .btn{ flex: none; min-height: 44px; display: inline-flex; align-items: center; }

@media (max-width: 860px){
  .cta-leiste{ display: flex; }
  /* Rückfallwert. Den genauen Freiraum setzt site.js aus der gemessenen Höhe —
     eine feste Zahl ist bei anderer Schriftgröße zu klein, und dann bleiben
     Impressum und Datenschutz am Seitenende verdeckt. */
  body.hat-cta-leiste{ padding-bottom: 120px; }
}
@media (prefers-reduced-motion: reduce){
  .cta-leiste{ transition: none; }
}

/* ── Brotkrumen ────────────────────────────────────────────────────────────
   Sichtbarer Pfad ab der zweiten Ebene. Ohne ihn ist die BreadcrumbList im
   JSON-LD eine Auszeichnung ohne Gegenstück — und Google zeigt sie nicht an.
   Die Startseite trägt keinen Pfad, sie ist die erste Ebene. */
.brotkrumen{ margin: 0 0 14px; }
.brotkrumen ol{
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  font-size: .82rem; opacity: .8;
}
.brotkrumen li{ display: flex; align-items: center; gap: 6px; }
.brotkrumen li + li::before{ content: "\203A"; opacity: .6; }
.brotkrumen a{ color: inherit; text-decoration: none; border-bottom: 1px solid transparent; }
.brotkrumen a:hover{ border-bottom-color: currentColor; }
.brotkrumen [aria-current="page"]{ opacity: 1; font-weight: 500; }