/**
 * BS Hero Slogan – Styling
 * Farben aus dem Logo: Cyan #3AC7E0 -> Royalblau #1E63C8.
 * Der Verlauf wird üblicherweise vom Hero-/Section-Container getragen;
 * diese Klassen stylen nur die Textebene. Bei Bedarf .bshs-hero-Hintergrund
 * aktivieren (siehe unten).
 */

.bshs-hero {
	max-width: 620px;
}

/* Optional: Verlauf direkt auf dem Slogan-Container.
   Nur nutzen, wenn der Hero-Container selbst KEINEN Verlauf hat. */
.bshs-hero--gradient {
	background: linear-gradient( 105deg, #3AC7E0 0%, #2A8FDA 55%, #1E63C8 100% );
	padding: 2.5rem 2rem 3rem;
	border-radius: 14px;
	max-width: none;
}

.bshs-eyebrow {
	color: #ffffff;
	font-size: 0.85rem;
	letter-spacing: 0.03em;
	opacity: 0.9;
	margin: 0 0 0.5rem;
}

.bshs-headline {
	color: #ffffff;
	font-weight: 500;
	line-height: 1.25;
	margin: 0 0 0.7rem;
	/* Fluid: skaliert zwischen Mobil und Desktop */
	font-size: clamp( 1.6rem, 1.1rem + 2.2vw, 2.6rem );
}

.bshs-subline {
	color: #ffffff;
	opacity: 0.92;
	font-size: clamp( 0.95rem, 0.9rem + 0.4vw, 1.15rem );
	line-height: 1.5;
	margin: 0 0 1.4rem;
	max-width: 34em;
}

.bshs-cta {
	display: inline-block;
	background: #ffffff;
	color: #1E63C8;
	font-weight: 500;
	font-size: 0.95rem;
	text-decoration: none;
	padding: 0.7rem 1.35rem;
	border-radius: 8px;
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.bshs-cta:hover,
.bshs-cta:focus {
	transform: translateY( -1px );
	box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.18 );
	color: #16509f;
}

/* Kein Layout-Sprung: verborgene Slots nehmen keinen Platz ein */
.bshs-slot[hidden] {
	display: none;
}