/* ===== Hover-„Fall"-Effekt für klickbare Texte (Architektur + Immo) ===== *
 * Eigenständig gebaut. Der sichtbare Text fällt beim Hovern nach unten heraus,
 * eine identische Kopie fällt von oben nach. Unterstriche/Farben bleiben am <a>. */

.fx-link .fx-roll{
	position: relative;
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	line-height: inherit;
}
.fx-link .fx-roll-line{
	display: block;
	transition: transform .42s cubic-bezier(.7, 0, .2, 1);
	will-change: transform;
}
/* Kopie startet oberhalb (versteckt) */
.fx-link .fx-roll-clone{
	position: absolute;
	top: 0; left: 0;
	transform: translateY(-115%);
}
/* Hover: Original fällt nach unten raus, Kopie fällt nach (nur echte Hover-Geräte) */
@media (hover: hover) and (pointer: fine){
	.fx-link:hover .fx-roll-line{ transform: translateY(115%); }
	.fx-link:hover .fx-roll-clone{ transform: translateY(0); }

	/* Menü-Strich bleibt erhalten: da .fx-roll ein atomares inline-block ist, vererbt
	   sich text-decoration vom <a> nicht hinein – darum hier direkt auf die Zeilen. */
	header nav a.fx-link:hover .fx-roll-line{
		text-decoration: underline;
		text-decoration-thickness: 2.5px;
		text-underline-offset: 2px;
	}
}
@media (prefers-reduced-motion: reduce){
	.fx-link .fx-roll-line{ transition: none; }
}

/* ===== Cookie-Banner – nur Immobilien-Seite ===== *
 * Liegt über allem (auch über dem WhatsApp-Button). Die Switch-Styles sind 1:1 aus
 * der Architektur-style.css nachgezogen, weil die Immo-Startseite /immo/css/style.css
 * lädt (ohne .switch) – so sieht der Button EXAKT wie auf der Architektur aus. Keine
 * Farb-Invertierung. Scoped auf #banner.immo, Architektur bleibt unberührt. */
#banner.immo{ z-index: 99000; }
#banner.immo .switch{
	/* KEIN position hier: das Element ist zugleich .right (gdpr.css: position:absolute,
	   top:0, right:20px) – das liefert den Positionskontext für den .selector. */
	width: 240px; height: 50px;
	background: rgba(200, 200, 200, 0.3);
	border-radius: 50px;
	backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
	overflow: hidden; cursor: pointer;
	box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);
}
#banner.immo .switch .front{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#banner.immo .switch .front .onehalf{ width: 50%; height: 100%; text-align: center; padding: 16px 0; color: #000; }
#banner.immo .switch .selector{
	position: absolute; top: 0; left: 0; width: 50%; height: 100%;
	border-radius: 50px; background: #fff;
	transition: left 400ms ease-in-out;
}
#banner.immo.agreed .switch .selector{ left: 50%; }
@media (max-width: 768px){
	#banner.immo .switch{ width: auto; }
	#banner.immo .switch .front .onehalf{ padding-top: 17px; }
}