.lock-hero {
	--hero-accent: #b7ff26;
	--hero-background: #050708;
	--hero-overlay: 0.72;
	--hero-bg-position: center center;
	position: relative;
	isolation: isolate;
	min-height: 941rem;
	overflow: hidden;
	background: var(--hero-background);
	color: #ffffff;
}

.lock-hero--scheme-light {
	color: #101312;
}

.lock-hero__background-picture,
.lock-hero__background {
	position: absolute;
	z-index: -3;
	inset: 0;
	width: 100%;
	height: 100%;
}

.lock-hero__background-picture {
	display: block;
}

.lock-hero__background {
	object-fit: cover;
	object-position: var(--hero-bg-position);
}

.lock-hero__overlay {
	position: absolute;
	z-index: -2;
	inset: 0;
	opacity: var(--hero-overlay);
	background:
		linear-gradient(90deg, #010506 0%, #010506 23%, rgba(1, 5, 6, 0.72) 43%, rgba(1, 5, 6, 0.12) 70%, rgba(1, 5, 6, 0.15) 100%),
		linear-gradient(180deg, rgba(1, 5, 6, 0.25) 0%, rgba(1, 5, 6, 0.1) 55%, #010506 100%);
}

.lock-hero--scheme-light .lock-hero__overlay {
	background:
		linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 35%, rgba(255, 255, 255, 0.28) 72%, rgba(255, 255, 255, 0.12) 100%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.05) 55%, rgba(255, 255, 255, 0.94) 100%);
}

.lock-hero__inner {
	display: flex;
	min-height: 941rem;
	padding-top: 185rem;
	padding-bottom: 42rem;
	flex-direction: column;
	justify-content: space-between;
	gap: 44rem;
}

.lock-hero__top {
	display: grid;
	grid-template-columns: minmax(0, 660rem) minmax(0, 1fr);
	align-items: center;
	gap: 72rem;
}

.lock-hero--right-none .lock-hero__top {
	grid-template-columns: minmax(0, 740rem);
}

.lock-hero__copy {
	width: 100%;
}

.lock-hero__eyebrow {
	margin-bottom: 16rem;
	color: var(--hero-accent);
	font-size: 15rem;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.lock-hero__title {
	font: 800 66rem/1.22 "Montserrat", Arial, sans-serif;
	letter-spacing: -0.026em;
	text-wrap: balance;
}

.lock-hero__description {
	margin-top: 18rem;
	color: rgba(255, 255, 255, 0.82);
	font-size: 23rem;
	font-weight: 400;
	line-height: 1.52;
}

.lock-hero--scheme-light .lock-hero__description {
	color: rgba(16, 19, 18, 0.75);
}

.lock-hero__proof {
	display: flex;
	align-items: center;
	gap: 14rem;
	margin-top: 34rem;
	font-size: 16rem;
	font-weight: 500;
	line-height: 1.45;
}

.lock-hero__proof-icon {
	flex: 0 0 26rem;
	width: 26rem;
	height: 26rem;
	color: var(--hero-accent);
}

.lock-hero__proof-icon svg {
	width: 100%;
	height: 100%;
	fill: currentColor;
}

.lock-hero__buttons {
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	gap: 14rem;
	margin-top: 38rem;
}

.lock-hero__button {
	display: flex;
	align-items: center;
	gap: 16rem;
	min-width: 280rem;
	min-height: 82rem;
	padding: 16rem 24rem;
	border: 1px solid transparent;
	border-radius: 4rem;
	transition: transform var(--transition), box-shadow var(--transition), filter var(--transition), border-color var(--transition), background-color var(--transition);
}

.lock-hero__button--primary {
	min-width: 366rem;
	background: var(--hero-accent);
	color: #11140f;
}

.lock-hero--button-glow .lock-hero__button--primary {
	box-shadow: 0 0 28rem color-mix(in srgb, var(--hero-accent) 44%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.lock-hero--button-outline .lock-hero__button--primary {
	border-color: var(--hero-accent);
	background: transparent;
	color: #ffffff;
}

.lock-hero--scheme-light.lock-hero--button-outline .lock-hero__button--primary {
	color: #101312;
}

.lock-hero__button--secondary {
	border-color: rgba(255, 255, 255, 0.14);
	background: rgba(16, 19, 20, 0.7);
	color: #ffffff;
	backdrop-filter: blur(12rem);
}

.lock-hero--scheme-light .lock-hero__button--secondary {
	border-color: rgba(16, 19, 18, 0.14);
	background: rgba(255, 255, 255, 0.72);
	color: #101312;
}

.lock-hero__button-icon-wrap {
	display: grid;
	place-items: center;
	flex: 0 0 38rem;
	width: 38rem;
	height: 38rem;
	border-radius: 8rem;
	background: rgba(0, 0, 0, 0.12);
}

.lock-hero__button--secondary .lock-hero__button-icon-wrap {
	background: color-mix(in srgb, var(--hero-accent) 18%, transparent);
	color: var(--hero-accent);
}

.lock-hero__button-icon {
	width: 20rem;
	height: 20rem;
	object-fit: contain;
	fill: currentColor;
}

.lock-hero__button-copy {
	display: grid;
	gap: 4rem;
	min-width: 0;
}

.lock-hero__button-copy strong {
	font: 700 18rem/1.2 "Montserrat", Arial, sans-serif;
}

.lock-hero__button-copy small {
	font-size: 12rem;
	line-height: 1.25;
	opacity: 0.74;
}

.lock-hero__button-arrow {
	margin-left: auto;
	font-size: 30rem;
	font-weight: 300;
	line-height: 1;
}

.lock-hero__button:hover {
	transform: translateY(-2rem);
	filter: brightness(1.06);
}

.lock-hero--button-glow .lock-hero__button--primary:hover {
	box-shadow: 0 0 38rem color-mix(in srgb, var(--hero-accent) 58%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.lock-hero__right {
	justify-self: end;
	width: min(100%, 390rem);
}

.lock-hero__promo,
.lock-hero__info-card {
	padding: 34rem;
	border: 1px solid color-mix(in srgb, var(--hero-accent) 58%, transparent);
	border-radius: 18rem;
	background: rgba(8, 11, 12, 0.76);
	box-shadow: 0 24rem 70rem rgba(0, 0, 0, 0.3), 0 0 35rem color-mix(in srgb, var(--hero-accent) 12%, transparent);
	backdrop-filter: blur(18rem);
}

.lock-hero--scheme-light .lock-hero__promo,
.lock-hero--scheme-light .lock-hero__info-card {
	background: rgba(255, 255, 255, 0.78);
	box-shadow: 0 24rem 70rem rgba(0, 0, 0, 0.12);
}

.lock-hero__promo-deadline {
	color: var(--hero-accent);
	font-size: 14rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.lock-hero__promo h2,
.lock-hero__info-card h2 {
	margin-top: 12rem;
	font: 700 28rem/1.25 "Montserrat", Arial, sans-serif;
}

.lock-hero__promo-discount {
	display: block;
	margin-top: 18rem;
	color: var(--hero-accent);
	font: 800 62rem/1 "Montserrat", Arial, sans-serif;
}

.lock-hero__promo-price {
	margin-top: 8rem;
	font-size: 25rem;
	font-weight: 700;
}

.lock-hero__promo-note,
.lock-hero__info-card p {
	margin-top: 18rem;
	color: rgba(255, 255, 255, 0.66);
	font-size: 15rem;
	line-height: 1.55;
}

.lock-hero--scheme-light .lock-hero__promo-note,
.lock-hero--scheme-light .lock-hero__info-card p {
	color: rgba(16, 19, 18, 0.66);
}

.lock-hero__info-card a {
	display: inline-flex;
	margin-top: 24rem;
	padding: 14rem 20rem;
	border-radius: 6rem;
	background: var(--hero-accent);
	color: #11140f;
	font-weight: 700;
}

.lock-hero__right-image {
	margin: 0;
}

.lock-hero__right-image img {
	width: 100%;
	max-height: 580rem;
	object-fit: contain;
	object-position: center bottom;
}

.lock-hero__benefits {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14rem;
}

.lock-hero__benefits--count-1 {
	grid-template-columns: minmax(0, 1fr);
}

.lock-hero__benefits--count-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lock-hero__benefits--count-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lock-hero__benefits--count-5,
.lock-hero__benefits--count-6 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lock-benefit {
	display: grid;
	grid-template-columns: 68rem minmax(0, 1fr);
	align-items: start;
	gap: 20rem;
	min-height: 193rem;
	padding: 34rem 28rem 28rem;
	border: 1px solid rgba(255, 255, 255, 0.045);
	border-radius: 17rem;
	background: linear-gradient(135deg, rgba(35, 40, 42, 0.96) 0%, rgba(21, 25, 27, 0.96) 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 18rem 55rem rgba(0, 0, 0, 0.2);
	transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.lock-hero--cards-solid .lock-benefit {
	background: #181c1e;
}

.lock-hero--cards-outline .lock-benefit {
	border-color: color-mix(in srgb, var(--hero-accent) 36%, transparent);
	background: rgba(6, 9, 10, 0.34);
}

.lock-hero--scheme-light .lock-benefit {
	border-color: rgba(16, 19, 18, 0.08);
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 18rem 55rem rgba(0, 0, 0, 0.08);
}

.lock-benefit--highlighted {
	border-color: color-mix(in srgb, var(--hero-accent) 72%, transparent);
	box-shadow: 0 0 30rem color-mix(in srgb, var(--hero-accent) 18%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.lock-benefit[href]:hover {
	transform: translateY(-3rem);
	border-color: color-mix(in srgb, var(--hero-accent) 58%, transparent);
}

.lock-benefit--without-icon {
	grid-template-columns: minmax(0, 1fr);
}

.lock-benefit__icon-wrap {
	display: grid;
	place-items: center;
	width: 64rem;
	height: 64rem;
	color: var(--hero-accent);
}

.lock-benefit__icon {
	width: 58rem;
	height: 58rem;
	object-fit: contain;
	fill: currentColor;
}

.lock-benefit h2 {
	font: 700 20rem/1.45 "Montserrat", Arial, sans-serif;
}

.lock-benefit p {
	margin-top: 12rem;
	color: rgba(255, 255, 255, 0.58);
	font-size: 15rem;
	line-height: 1.55;
}

.lock-hero--scheme-light .lock-benefit p {
	color: rgba(16, 19, 18, 0.62);
}

@media (max-width: 1460px) {
	.lock-hero__inner {
		padding-top: 180rem;
	}

	.lock-hero__top {
		grid-template-columns: minmax(0, 610rem) minmax(0, 1fr);
		gap: 48rem;
	}

	.lock-hero--right-none .lock-hero__top {
		grid-template-columns: minmax(0, 680rem);
	}

	.lock-hero__title {
		font-size: 60rem;
	}

	.lock-benefit {
		grid-template-columns: 58rem minmax(0, 1fr);
		gap: 16rem;
		padding-inline: 22rem;
	}

	.lock-benefit__icon-wrap,
	.lock-benefit__icon {
		width: 56rem;
		height: 56rem;
	}

	.lock-benefit h2 {
		font-size: 18rem;
	}
}

@media (max-width: 1180px) {
	.lock-hero {
		min-height: 980rem;
	}

	.lock-hero__background {
		object-position: 58% center;
	}

	.lock-hero__overlay {
		background:
			linear-gradient(90deg, #010506 0%, rgba(1, 5, 6, 0.9) 42%, rgba(1, 5, 6, 0.38) 76%, rgba(1, 5, 6, 0.45) 100%),
			linear-gradient(180deg, rgba(1, 5, 6, 0.25) 0%, rgba(1, 5, 6, 0.15) 45%, #010506 82%);
	}

	.lock-hero__inner {
		min-height: 980rem;
		padding-top: 135rem;
		padding-bottom: 34rem;
	}

	.lock-hero__top,
	.lock-hero--right-none .lock-hero__top {
		grid-template-columns: minmax(0, 66%);
	}

	.lock-hero__right {
		justify-self: start;
		width: min(100%, 500rem);
	}

	.lock-hero__title {
		font-size: 58rem;
	}

	.lock-hero__description {
		font-size: 21rem;
	}

	.lock-hero__benefits,
	.lock-hero__benefits--count-3,
	.lock-hero__benefits--count-5,
	.lock-hero__benefits--count-6 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.lock-benefit {
		min-height: 145rem;
	}
}

@media (max-width: 767px) {
	.lock-hero {
		min-height: 0;
	}

	.lock-hero__background-picture,
	.lock-hero__background {
		height: 660rem;
	}

	.lock-hero__background {
		object-position: 66% center;
	}

	.lock-hero__overlay {
		background:
			linear-gradient(90deg, #010506 0%, rgba(1, 5, 6, 0.84) 70%, rgba(1, 5, 6, 0.52) 100%),
			linear-gradient(180deg, rgba(1, 5, 6, 0.18) 0%, rgba(1, 5, 6, 0.34) 38%, #010506 69%);
	}

	.lock-hero__inner {
		min-height: 0;
		padding-top: 104rem;
		padding-bottom: 30rem;
		gap: 0;
	}

	.lock-hero__top,
	.lock-hero--right-none .lock-hero__top {
		grid-template-columns: 1fr;
		gap: 30rem;
	}

	.lock-hero__copy {
		width: 100%;
	}

	.lock-hero__eyebrow {
		font-size: 13rem;
	}

	.lock-hero__title {
		max-width: 340rem;
		font-size: 42rem;
		line-height: 1.16;
	}

	.lock-hero__description {
		max-width: 335rem;
		margin-top: 18rem;
		font-size: 18rem;
		line-height: 1.5;
	}

	.lock-hero__proof {
		align-items: flex-start;
		max-width: 330rem;
		margin-top: 24rem;
		font-size: 15rem;
	}

	.lock-hero__buttons {
		display: grid;
		grid-template-columns: 1fr;
		margin-top: 28rem;
	}

	.lock-hero__button {
		width: 100%;
		min-width: 0;
		min-height: 70rem;
		padding-inline: 22rem;
	}

	.lock-hero__button-copy strong {
		font-size: 17rem;
	}

	.lock-hero__right {
		width: 100%;
	}

	.lock-hero__promo,
	.lock-hero__info-card {
		padding: 26rem;
	}

	.lock-hero__benefits,
	.lock-hero__benefits--count-2,
	.lock-hero__benefits--count-3,
	.lock-hero__benefits--count-5,
	.lock-hero__benefits--count-6 {
		grid-template-columns: 1fr;
		gap: 12rem;
		margin-top: 56rem;
	}

	.lock-benefit {
		grid-template-columns: 58rem minmax(0, 1fr);
		min-height: 0;
		padding: 24rem;
		border-radius: 14rem;
	}

	.lock-benefit--without-icon {
		grid-template-columns: minmax(0, 1fr);
	}

	.lock-benefit__icon-wrap,
	.lock-benefit__icon {
		width: 52rem;
		height: 52rem;
	}

	.lock-benefit h2 {
		font-size: 18rem;
		line-height: 1.35;
	}

	.lock-benefit p {
		margin-top: 8rem;
		font-size: 14rem;
	}
}
