/* ============================================================
   LANG-BRIDGE – Angebot an englischsprachige Besucher, ganz oben.

   Warum eine eigene Leiste und kein weiteres Element im Hero:
   Der Marken-Wegweiser im Fuss der Claim-Card liegt auf 390x844 komplett unter
   der Falz (Card ~800px hoch ab y=158) und auf 1440x900 genau auf der Kante.
   Wer nach drei Sekunden entscheidet, ob er richtig ist, sieht ihn nie. Diese
   Leiste steht vor allem anderen – und nur fuer Browser, die nicht auf Deutsch
   stehen (Logik in functions.php, wp_body_open).

   Gestaltung bewusst ZURUECKHALTEND: dunkles Navy wie der Signpost (--bks-blue-900,
   zugleich Kartengrund), kein Orange als Flaeche. Der Markenname traegt das Orange
   als Textfarbe – auf Navy 5,06:1, also AA (dieselbe Begruendung wie in
   components/brand-signpost.css). Eine orange FLAECHE ganz oben haette die
   Anmutung eines Werbebanners und wuerde weggeklickt, bevor sie gelesen wird.

   Markup: functions.php (wp_body_open). Scope-Regel des Projekts eingehalten –
   das Wurzelelement traegt .bks-rd, alle Selektoren haengen daran.
   ============================================================ */

.bks-rd.bks-langbridge {
	background: var(--bks-blue-900, #0d2137);
	color: #fff;
	/* Ueber der Topbar, aber im Fluss: die Seite rutscht nach unten statt zu
	   ueberdecken. Overlays ueber dem Header wurden verworfen – sie verdecken
	   genau den DE/EN-Schalter, auf den die Leiste hinweist. */
	position: relative;
	z-index: 5;
}

.bks-rd.bks-langbridge[hidden] { display: none; }

.bks-rd.bks-langbridge .bks-langbridge__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 10px 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
}

.bks-rd.bks-langbridge .bks-langbridge__text {
	margin: 0;
	font-size: var(--fs-5, 15px);
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.88);
	text-align: center;
}

.bks-rd.bks-langbridge .bks-langbridge__link {
	color: var(--orange, #e86a2a);
	font-weight: 700;
	text-decoration: none;
	/* Unterstreichung erst bei Hover: die Zeile ist kurz, der Farbsprung reicht
	   als Affordanz – dauerhaft unterstrichen wirkt sie wie ein Cookie-Hinweis. */
	border-bottom: 1px solid transparent;
	transition: border-color 0.15s ease;
}

.bks-rd.bks-langbridge .bks-langbridge__link:hover,
.bks-rd.bks-langbridge .bks-langbridge__link:focus-visible {
	border-bottom-color: var(--orange, #e86a2a);
}

.bks-rd.bks-langbridge .bks-langbridge__close {
	flex: none;
	background: none;
	border: 0;
	color: rgba(255, 255, 255, 0.65);
	font-size: 22px;
	line-height: 1;
	padding: 4px 6px;
	cursor: pointer;
	border-radius: 4px;
	transition: color 0.15s ease, background 0.15s ease;
}

.bks-rd.bks-langbridge .bks-langbridge__close:hover,
.bks-rd.bks-langbridge .bks-langbridge__close:focus-visible {
	color: #fff;
	background: rgba(255, 255, 255, 0.12);
}

@media (max-width: 560px) {
	.bks-rd.bks-langbridge .bks-langbridge__inner {
		padding: 9px 14px;
		gap: 8px;
	}
	.bks-rd.bks-langbridge .bks-langbridge__text { font-size: 14px; text-align: left; }
}