/* --- HERO --- */
.sl-hero{
	position: relative;
	/* было: 24px 0 56px */
	padding-top: var(--sl-space-lg);
	padding-bottom: var(--sl-section-y);
	color: var(--sl-white);
}

.sl-hero__panel{
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-radius: var(--sl-radius-xl);
	border: 1px solid var(--sl-hero-card-border);
	background:
		linear-gradient(140deg, rgba(5,10,45,.82), rgba(4,9,37,.58)),
		url("../../img/hero-main-bg.jpg") center center / cover no-repeat,
		linear-gradient(135deg, #08144a 0%, #04103c 45%, #02081f 100%);
	box-shadow: var(--sl-hero-card-shadow);
	min-height: clamp(480px, 62vh, 680px);
}

.sl-hero__overlay{
	position: absolute;
	inset: 0;
	background:
		radial-gradient(1200px 380px at 20% 18%, rgba(255,255,255,.08), transparent 55%),
		radial-gradient(900px 360px at 78% 24%, rgba(93, 130, 255, .16), transparent 60%),
		linear-gradient(to top, rgba(2,4,13,.35), rgba(2,4,13,.15));
	pointer-events: none;
	z-index: 1;
}

.sl-hero__content{
	position: relative;
	z-index: 2;
	padding: clamp(32px, 5vw, 64px);
	max-width: 820px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: inherit;
}

.sl-hero__title{
	margin: 0 0 var(--sl-stack-3);
	font-family: var(--sl-font-display);
	font-weight: 400;
	letter-spacing: -0.012em;
	line-height: 1.02;
	font-size: clamp(34px, 4.1vw, 68px);
	max-width: 760px;
	color: #fff;
	text-wrap: balance;
}

.sl-hero__subtitle{
	margin: 0 0 var(--sl-stack-3);
	font-size: clamp(16px, 1.25vw, 22px);
	line-height: 1.45;
	font-weight: 400;
	color: rgba(255,255,255,.92);
	max-width: 760px;
}

.sl-hero__actions{
	display: flex;
	flex-wrap: wrap;
	gap: var(--sl-grid-gap);
	margin-bottom: var(--sl-stack-2);
}

.sl-hero__note{
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
	color: rgba(255,255,255,.82);
	max-width: 560px;
}

/* --- HERO responsive --- */
@media (max-width: 991px){
	.sl-hero{
		/* было: 16px 0 40px */
		padding-top: var(--sl-space-sm);
		padding-bottom: var(--sl-section-y-tight);
	}

	.sl-hero__panel{
		min-height: 520px;
		background-position: 62% center;
	}

	.sl-hero__content{
		padding: 26px 20px 24px;
		justify-content: flex-start;
		padding-top: clamp(24px, 5vw, 34px);
	}

	.sl-hero__actions{
		gap: var(--sl-space-sm);
	}
}

@media (max-width: 767px){
	.sl-hero__panel{
		min-height: 500px;
		border-radius: 16px;
		background-position: 70% center;
	}

	.sl-hero__title{
		font-size: clamp(28px, 8vw, 42px);
		line-height: 1.06;
		margin-bottom: var(--sl-stack-2);
	}

	.sl-hero__subtitle{
		font-size: 15px;
		line-height: 1.42;
		margin-bottom: var(--sl-stack-2);
	}

	.sl-hero__actions{
		flex-direction: column;
		align-items: stretch;
	}

	/* Важно: растягиваем только hero-кнопки, а не все кнопки сайта */
	.sl-hero .sl-btn{
		width: 100%;
		justify-content: center;
	}

	.sl-hero__note{
		font-size: 13px;
	}
}