/* =============================================================
   SquashAddict – vision-teaser.css
   Startseite Vision-Teaser (unter "Aktuelles")
   Hintergrund: #181818 (wie Hero) | Akzent: #E8571B | Text: #ffffff
   Font: 'Helvetica Neue', Helvetica, Arial, sans-serif
   ============================================================= */

.sa-vision {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 420px;
	background-color: #181818;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.sa-vision__box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: fit-content;
	max-width: 864px;
	padding-top: 5.5em;
	padding-bottom: 5.5em;
	padding-left: clamp(2em, 1em + 3.5vw, 4.5em);
	padding-right: clamp(2em, 1em + 3.5vw, 4.5em);
}

.sa-vision__logo {
	display: block;
	align-self: center;
	width: clamp(160px, 12vw + 100px, 220px);
	height: auto;
}

.sa-vision__wordmark {
	align-self: center;
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.01em;
	white-space: nowrap;
	margin: 1.5rem 0 2.5rem;
}

.sa-vision__wordmark-squash {
	color: #ffffff;
}

.sa-vision__wordmark-addict {
	color: #E9530E;
}

.sa-vision__text {
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: clamp(19px, 10px + 1vw, 24px);
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.6;
	text-align: left;
	margin: 0;
	-webkit-hyphens: auto;
	hyphens: auto;
}

/* =============================================================
   RESPONSIVE – Mobile < 900px
   ============================================================= */
@media (max-width: 900px) {

	.sa-vision {
		min-height: 320px;
	}

	.sa-vision__box {
		width: 100%;
		padding: 12em 6em;
	}

	.sa-vision__wordmark {
		margin-top: 0.75rem;
	}

	.sa-vision__text {
		font-size: 18px;
	}
}