:root {
	--nplanding-gradient-start: #3B82F6;
	--nplanding-gradient-end: #2DD4BF;
	--nplanding-button-bg: #4B6FED;
	--nplanding-button-text: #FFFFFF;
	--nplanding-overlay: 0.35;
}

body {
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	background: #05060a;
	color: #ffffff;
}

/* ==========================================================================
   Герой на весь екран
   ========================================================================== */

.nplanding-hero {
	position: relative;
	width: 100%;
	min-height: 100vh;
	min-height: 100svh;
	overflow: hidden;
	background: #05060a;
	display: flex;
	align-items: center;
}

.nplanding-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.nplanding-bg video,
.nplanding-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.nplanding-bg-mobile {
	display: none;
}

.nplanding-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, var(--nplanding-overlay));
	z-index: 1;
}

.nplanding-hero-inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 700px;
	padding: 0 8vw;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 22px;
}

.nplanding-logo {
	max-width: 260px;
	max-height: 110px;
	width: auto;
	height: auto;
	object-fit: contain;
	margin-bottom: 6px;
}

.nplanding-heading {
	margin: 0;
	font-family: 'Unbounded', sans-serif;
	font-weight: 800;
	font-size: clamp(2.4rem, 6vw, 4.2rem);
	line-height: 1.05;
	display: flex;
	flex-direction: column;
}

.nplanding-heading-line1 {
	color: #ffffff;
}

.nplanding-heading-line2 {
	background: linear-gradient(90deg, var(--nplanding-gradient-start), var(--nplanding-gradient-end));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: var(--nplanding-gradient-end);
}

.nplanding-text {
	margin: 0;
	font-size: clamp(1rem, 1.6vw, 1.25rem);
	font-weight: 600;
	color: #e6e8ef;
	max-width: 46ch;
}

.nplanding-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 6px;
}

.nplanding-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--nplanding-button-bg);
	color: var(--nplanding-button-text);
	font-family: 'Unbounded', sans-serif;
	font-weight: 700;
	font-size: 1rem;
	padding: 16px 34px;
	border-radius: 999px;
	transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
	box-shadow: 0 8px 24px rgba(75, 111, 237, 0.35);
}

.nplanding-button:hover {
	transform: translateY(-2px);
	opacity: 0.92;
}

/* ==========================================================================
   Контент нижче героя (додаткові секції зі звичайного редактора)
   ========================================================================== */

.nplanding-content {
	max-width: 900px;
	margin: 0 auto;
	padding: 60px 24px;
	color: #1f2430;
	background: #ffffff;
}

.nplanding-basic-loop article {
	margin-bottom: 40px;
}

/* ==========================================================================
   Мобільна адаптація
   ========================================================================== */

@media (max-width: 782px) {
	.nplanding-bg-desktop {
		display: none;
	}

	.nplanding-bg-mobile {
		display: block;
	}

	.nplanding-hero {
		align-items: flex-end;
	}

	.nplanding-hero-inner {
		max-width: 100%;
		padding: 0 28px 64px;
		gap: 16px;
	}

	.nplanding-logo {
		max-width: 190px;
		max-height: 80px;
	}

	.nplanding-heading {
		font-size: clamp(2.1rem, 9vw, 2.8rem);
	}

	.nplanding-buttons {
		flex-direction: column;
		width: 100%;
	}

	.nplanding-button {
		width: 100%;
	}
}