/**
 * Wspólny hero podstron — wzorzec z /o-nas/.
 */

.wsn-page-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 55%, #121212 100%);
}

.wsn-page-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--wsn-page-hero-image);
	background-size: cover;
	background-position: center;
	opacity: 0.22;
	z-index: 0;
}

.wsn-page-hero__shade {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(10, 10, 10, 0.35) 0%, rgba(10, 10, 10, 0.88) 100%);
	pointer-events: none;
}

.wsn-page-hero__inner {
	position: relative;
	z-index: 2;
	max-width: 820px;
	padding: clamp(72px, 12vw, 120px) 0 clamp(64px, 10vw, 96px);
}

@media (max-width: 640px) {
	.wsn-page-hero__inner {
		padding: clamp(56px, 14vw, 80px) 0 clamp(40px, 9vw, 56px);
	}

	.wsn-page-hero h1 {
		font-size: clamp(1.75rem, 8.2vw, 2.35rem);
		line-height: 1.18;
	}

	.wsn-page-hero__lead {
		font-size: 0.95rem;
		line-height: 1.65;
	}
}

.wsn-page-hero h1 {
	margin: 0 0 18px;
	color: var(--ws-white);
	font-family: var(--ws-serif);
	font-size: clamp(2.1rem, 5vw, 3.4rem);
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.01em;
}

.wsn-page-hero__lead {
	margin: 0;
	max-width: 52ch;
	color: rgba(255, 255, 255, 0.82);
	font-size: clamp(0.98rem, 2vw, 1.08rem);
	line-height: 1.7;
}

.wsn-page-hero__lead--rich > :first-child {
	margin-top: 0;
}

.wsn-page-hero__lead--rich > :last-child {
	margin-bottom: 0;
}

.wsn-page-hero .wsr-section-eyebrow {
	color: var(--ws-gold);
}