/* acessio.de · Sprachfassungen der Kernseiten (Teil 3, 22.10.2026)
   Geladen von /fr/, /ar/, /zh/ auf den Kernseiten (Leistungen, Betreuung, Branchen, Referenzen,
   Bewertungen, Ueber mich) und auf den Teil-2-Seiten dieser Sprachen (Start, Projektprofil), jeweils nach
   sprachen-*.css. Alle Regeln sind an html[dir="rtl"], :lang() oder an Bausteine der Kernseiten
   gebunden; die deutschen Seiten laden die Datei nicht.
   Grundlage der RTL-Regeln: css_richtung.py (Regeln mit left/right, translateX, Rahmen links/rechts
   in den Stylesheets der Kernseiten, Stand Teil-2-Stage), Probe-Bildschirmfotos qa-probe/shots.
   1. Kennzeichnungen (DE im Fuss, an Inhaltslinks und Projektkarten, uebersetzte Zitate)
   2. RTL: Leistungsseiten (lp-*, ls-*), Leistungsuebersicht (lu-*), Branchen (bf-*, br-*, lp-schritt),
      Referenzen, Bewertungen, Ueber mich
   3. Chinesisch und Arabisch: Laufweite, Umbruch */

/* 1 · Kennzeichnungen ---------------------------------------------------------------------------- */
/* „DE“ an deutschen Zielen in gemischten Fussspalten (Ueber mich/Referenzen uebersetzt, Artikel und
   Webdesign in Stuttgart deutsch): inline statt inline-block, damit das Kuerzel ohne Umbruch am
   letzten Wort haengt (ein inline-block erlaubt davor einen Zeilenumbruch). */
.footer__liste .sprache-de { display: inline; }
/* „DE“ an Inhaltslinks und Projektkarten auf deutsche Ziele (Korrektur nach QA 22.10.2026; Victor: Artikel und
   Rechtstexte bleiben deutsch mit DE-Hinweis). Gestaltung wie im Menue (sprachen-*.css .sprache-de). Der Generator
   setzt Linktext und Kuerzel in eine Gruppe (Flex-Links wie .lp-text-link setzen sonst ihren gap dazwischen) und das
   letzte Wort mit dem Kuerzel in .sprache-de-wort (kein Umbruch davor, das Kuerzel steht nie allein in einer Zeile). */
.sprache-de-gruppe { display: inline; margin: 0; }
/* position: relative haelt den Screenreader-Hinweis (.sr-only, absolut) im Linktext; in Karten-Schienen
   (overflow-x: auto, /projekte, /leistungen/) verbreiterte er sonst die Seite (Querscrollen). */
.sprache-de-wort { white-space: nowrap; position: relative; }
.sprache-de--inhalt { margin: 0; margin-inline-start: .4em; }
/* Projektkarten: Kuerzel am Kartennamen, klein und ruhig statt .62em der grossen Ueberschrift */
:is(h2, h3, h4) > .sprache-de--inhalt {
  font-family: var(--sans, Figtree, system-ui, sans-serif);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  vertical-align: .3em;
}
/* .lp-related nav a span (Bundle margin-left 20px, RTL unten margin-right 20px) meint den Pfeil */
.lp-related nav a span:is(.sprache-de-gruppe, .sprache-de-wort, .sr-only),
html[dir="rtl"] .lp-related nav a span:is(.sprache-de-gruppe, .sprache-de-wort, .sr-only) { margin: 0; }
.lp-related nav a span.sprache-de--inhalt,
html[dir="rtl"] .lp-related nav a span.sprache-de--inhalt { margin: 0; margin-inline-start: .4em; }
/* „Zum Weiterlesen“: mit dem Kuerzel rutschte der Pfeil bei 320/375 px oft allein in eine neue Zeile (32 Faelle in
   fr/ar/zh); pretty verteilt die letzten Zeilen so, dass der Pfeil beim letzten Wort bleibt (Chrome gemessen 0). */
.lp-related nav a { text-wrap: pretty; }
/* Startseite, Interview-Link (.of__fakten a: inline-flex ohne gap, der Leerraum vor dem Pfeil faellt weg):
   etwas Luft zwischen Kuerzel und Pfeil */
.of__fakten a > .sprache-de-gruppe + [aria-hidden="true"] { margin-inline-start: .3em; }
/* /betreuung, Ausweichzeile ohne Zeitfenster: Telefonnummer bricht nicht um (zh 375 px „+49 / 152 …“) */
.bt-termin__fallback a[href^="tel:"] { white-space: nowrap; }
/* Uebersetzte Zitate in Branchen (lp-stimme) und Ueber mich: eigene Zeile unter Name und Quelle. */
.zitat-hinweis--zeile { display: block; margin-top: .45em; font-size: .82em; font-weight: 400; opacity: .78; }
.ls-zitat .zitat-hinweis { white-space: nowrap; }

/* 2 · RTL ----------------------------------------------------------------------------------------- */
/* Nachgebildete Browserleisten zeigen eine (lateinische) Webadresse: bleiben links-nach-rechts. */
html[dir="rtl"] :is(.br-fenster__leiste, .lp-fenster__leiste, .ls-fenster__leiste, .lu-einblick__leiste, .bt-fenster__leiste) { direction: ltr; }

/* Leistungsseiten: Zitat, Listen mit Punkt/Haken/Nummer, Reels, Ablauf */
html[dir="rtl"] .ls-zitat { border-left: 0; border-right: 3px solid var(--cta, #22C7D6); border-radius: 14px 0 0 14px; }
html[dir="rtl"] .ls-spalte li { padding-left: 0; padding-right: 24px; }
html[dir="rtl"] .ls-spalte li::before { left: auto; right: 2px; }
html[dir="rtl"] .ls-spalte .ls-spalte__kopf { padding-right: 0; }
html[dir="rtl"] .ls-schritte li { padding-left: 0; padding-right: 58px; }
html[dir="rtl"] .ls-schritte li::before { left: auto; right: 0; }
html[dir="rtl"] .ls-haken li { padding-left: 0; padding-right: 34px; }
html[dir="rtl"] .ls-haken li::before { left: auto; right: 0; }
html[dir="rtl"] .ls-reel__ton { left: auto; right: 10px; }
/* Ablauf „sechs Stationen“: Linie und laufender Punkt von rechts nach links (Breite misst
   leistungen-schau-*.js in --ls-weite). */
html[dir="rtl"] .ls-fluss::after { left: auto; right: 8%; }
html[dir="rtl"] .ls-fluss.is-an::after { animation-name: ls-lauf-rtl; }
@keyframes ls-lauf-rtl { 0% { transform: translateX(0); } 90%, 100% { transform: translateX(calc(-1 * var(--ls-weite, 0px))); } }
@media (max-width: 860px) {
  html[dir="rtl"] .ls-fluss::before { left: auto; right: 38px; }
  html[dir="rtl"] .ls-fluss__station { text-align: right; }
}
/* KI-Sichtbarkeit: Pfeil zwischen Seite und Antwort (Zeichen gespiegelt „←“); schmal nach unten. */
@media (max-width: 900px) { html[dir="rtl"] .ls-ki__pfeil { transform: rotate(-90deg); } }
html[dir="rtl"] .lp-related nav a span { margin-left: 0; margin-right: 20px; }
html[dir="rtl"] .lp sup { margin-left: 0; margin-right: 2px; }
html[dir="rtl"] .lp-faq summary { padding-right: 0; padding-left: 16px; }
@media (min-width: 820px) {
  html[dir="rtl"] .lp-band__liste li + li { border-left: 0; border-right: 1px solid var(--line, rgba(25, 25, 28, .1)); }
}

/* Leistungsuebersicht */
html[dir="rtl"] .lu-marke { padding: 6px 6px 6px 16px; }
html[dir="rtl"] .lu-marke--anfragen { right: auto; left: -22px; }
html[dir="rtl"] .lu-marke--auftritt { left: auto; right: -26px; }
@media (max-width: 979px) {
  html[dir="rtl"] .lu-marke { padding: 4px 4px 4px 12px; }   /* Bundle schmal: 4px 12px 4px 4px */
  html[dir="rtl"] .lu-marke--anfragen { right: auto; left: 10px; }
  html[dir="rtl"] .lu-marke--auftritt { left: auto; right: 10px; }
}
html[dir="rtl"] .lu-leistung:hover .lu-leistung__pfeil,
html[dir="rtl"] :is(.lu-textlink, .lu-einblick figcaption a):hover span { transform: translateX(-4px); }

/* Branchen: Bilder am Hero haengen zur Textspalte hin (im Deutschen links am Bild, hier rechts) */
html[dir="rtl"] .bf-hero__marke { left: auto; right: -7%; transform: rotate(4deg); }
html[dir="rtl"] .bf-hero__zeile { left: auto; right: -6%; }
html[dir="rtl"] .bf-hero__zweit { left: auto; right: -7%; transform: rotate(3deg); }
@media (max-width: 979px) {
  html[dir="rtl"] .bf-hero__marke { right: auto; left: 3%; }
  html[dir="rtl"] .bf-hero__zeile { right: auto; left: 2%; }
  html[dir="rtl"] .bf-hero__zweit { right: auto; left: 2%; transform: rotate(2deg); }
}
html[dir="rtl"] .bf-leistungen a:hover i { transform: translateX(-4px); }
html[dir="rtl"] .lp-schritt { padding: var(--pt) 28px var(--pt) 0; border-left: 0; border-right: 2px solid rgba(243, 241, 240, .16); }
html[dir="rtl"] .lp-schritt::before { left: auto; right: -7px; }
html[dir="rtl"] .lp-stimme__foto img { margin-left: 0; margin-right: -25%; }
html[dir="rtl"] .lp-stimme__gross span { margin-left: 0; margin-right: 4px; }
html[dir="rtl"] .br-wahl__link:focus-visible .br-wahl__pfeil { transform: translateX(-6px); }
@media (hover: hover) and (pointer: fine) {
  html[dir="rtl"] .br-wahl__link:hover .br-wahl__pfeil { transform: translateX(-6px); }
}
@media (max-width: 760px) {
  html[dir="rtl"] .br-wahl__pfeil { right: auto; left: 18px; }
  html[dir="rtl"] .br-wahl__ref { padding-right: 0; padding-left: 58px; }
  html[dir="rtl"] .br-wahl__satz { padding-right: 0; padding-left: 52px; }
}

/* Abschluss der Branchenseiten (lp-schluss: H2, direkt darunter der Knopf ohne Abstand). Arabische
   Unterlaengen reichten in den Knopf (/ar/branchen/aerzte/, ar-Lektorat 22.10.2026). */
html:lang(ar) .lp-schluss > h2 + .btn { margin-top: 28px; }

/* Betreuung (/betreuung, Nachtrag 22.10.2026; Regeln aus betreuung-9ad0e97ada32.css gespiegelt).
   Das Beispielfenster spiegelt mit dem Raster (steht links), seine Browserleiste bleibt LTR (oben). Der Zettel
   „Erledigt.“ bleibt wie im Deutschen oben rechts am Fenster: dort ist die Leiste leer, links laegen Punkte
   und Adresse darunter; am Handy haelt der rechte Fensterabstand (18 px) ihm wie im Deutschen Platz. */
html[dir="rtl"] .bt-neu { margin-left: 0; margin-right: 6px; }
html[dir="rtl"] .bt-aktuelles__neu { margin-right: 0; margin-left: 8px; }
html[dir="rtl"] .bt-fenster__hinweis { left: auto; right: 0; }
html[dir="rtl"] .bt-liste li { padding-left: 0; padding-right: 44px; }
html[dir="rtl"] .bt-liste li::before { left: auto; right: 0; }
@media (prefers-reduced-motion: no-preference) {
  html[dir="rtl"] .bt-alt::after { animation-name: bt-streich-rtl; }
}
@keyframes bt-streich-rtl { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0 0 0 0); } }
/* Einspaltig (<= 980 px) steht das Fenster in RTL rechts (Rasterstart); rechts 18 px frei fuer den Zettel,
   Breite entsprechend kleiner (sonst ragte es bei 320/375 px bis 2 px an den linken Rand). */
@media (max-width: 980px) {
  html[dir="rtl"] .bt-fenster { margin-right: 18px; width: calc(100% - 18px); }
}
@media (max-width: 640px) {
  html[dir="rtl"] .bt-liste li { padding-left: 0; padding-right: 38px; }
}

/* Referenzen */
html[dir="rtl"] a.reference-card:hover .reference-card__arrow { transform: translateX(-5px); }

/* Bewertungen: Trennlinien der zweispaltigen Liste */
html[dir="rtl"] .review-list__item:nth-child(odd) { border-right: 0; border-left: 1px solid var(--line-2); }
html[dir="rtl"] .review-list__item:last-child { border-left: 0; }
@media (max-width: 760px) { html[dir="rtl"] .review-list__item:nth-child(odd) { border-left: 0; } }
html[dir="rtl"] .review-card:hover .review-card__arrow,
html[dir="rtl"] .review-card:focus-visible .review-card__arrow { transform: translate(-4px, -4px); }
/* Pfeil der Portal-Karten (Bundle: inset 36px 30px auto auto, bis 760 px 30px 28px auto auto) in die linke
   obere Ecke; in RTL steht das Logo rechts und laege sonst unter dem Pfeil (Endbau-QA 22.10.2026). */
html[dir="rtl"] .review-card__arrow { inset: 36px auto auto 30px; }
@media (max-width: 760px) { html[dir="rtl"] .review-card__arrow { inset: 30px auto auto 28px; } }

/* Ueber mich: Trennlinien der Kundenstimmen */
@media (min-width: 900px) {
  html[dir="rtl"] .um-stimmen__liste li { border-left: 0; border-right: 1px solid var(--line); }
  html[dir="rtl"] .um-stimmen__liste li:first-child { padding-left: clamp(20px, 2.6vw, 40px); padding-right: 0; border-right: 0; }
}

/* 3 · Chinesisch und Arabisch ----------------------------------------------------------------------- */
html:is(:lang(zh), :lang(ar)) :is(.lp-eyebrow, .ls-zeile, .lp-caption, .footer__eyebrow, .reference-launch) {
  letter-spacing: 0;
  text-transform: none;
}
html:lang(zh) :is(.lp-intro, .ls-satz, .lp-hero h1, .lp-section h2, .lp-contact h2, .ls h2) { line-break: strict; }
html:lang(zh) :is(.lp-hero h1, .lp-section h2, .lp-contact h2, .ls h2) { word-break: keep-all; overflow-wrap: anywhere; }