@font-face {
	font-family: 'light';
	src: url('../../fonts/Manrope/Manrope-Light.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'regular';
	src: url('../../fonts/Manrope/Manrope-Regular.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'bold';
	src: url('../../fonts/Manrope/Manrope-Bold.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

:root {
	--color-1: #010005;
	--color-2: linear-gradient(90deg, #7157ff 0%, #6413d8 100%);
	--color-3: #fbf5ff;
	--color-4: #a39cb1;
	--color-5: rgba(255, 255, 255, 0.05);
	--color-6: rgba(255, 255, 255, 0.1);
	--color-7: linear-gradient(0deg, #a299c5 0%, #fbf5ff 100%);
	--color-8: #691fea;

	--font-family-light: 'light';
	--font-family-regular: 'regular';
	--font-family-bold: 'bold';

	--font-size-xs: 0.75vw;
	--font-size-s: 1vw;
	--font-size-m: 1.25vw;
	--font-size-l: 1.75vw;
	--font-size-xl: 3.5vw;

	--radius-xs: 0.5vw;
	--radius-s: 0.75vw;
	--radius-m: 1vw;
	--radius-l: 1.25vw;

	--padding-xs: 0.5vw;
	--padding-s: 1vw;
	--padding-m: 1.5vw;
	--padding-l: 2vw;

	--gap-xs: 0.5vw;
	--gap-s: 1vw;
	--gap-m: 1.5vw;
	--gap-l: 2vw;
	--gap-xl: 4vw;
}

body {
	margin: 0;
	padding: 0;
	background-color: var(--color-1);

	background-image: url('../../img/bg.png');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;

	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: var(--gap-xl);
}

a {
	text-decoration: none;
	font-size: 0.75vw;
	line-height: 1vw;
}

p {
	font-size: 0.65vw;
}

h1,
h2,
h3,
p,
a {
	color: var(--color-3);
	font-family: 'regular';
	margin: 0;
	padding: 0;
}

h1 {
	font-family: 'bold';
	font-size: 1.5vw;
	line-height: 1.75vw;
	letter-spacing: 0.05em;
}

h2 {
	font-family: 'bold';
	font-size: 1vw;
	line-height: 1.25vw;
	letter-spacing: 0.05em;
}

form {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-content: flex-start;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 2vw;
}

section {
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: var(--gap-l);
}

.container-wrap {
	width: 70vw;
	margin: 0 auto;

	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: var(--gap-l);
}

.container-wrap .section-title {
	font-family: var(--font-family-bold);
	font-size: var(--font-size-l);
	line-height: var(--font-size-l);
	color: transparent;
	text-align: center;

	background-size: cover;
	background: var(--color-7);
	-webkit-background-clip: text;
}

.empty {
	height: 10vw;
}

/* Кнопка «Назад» на страницах оферты, политики и соглашения */
.back-btn {
	display: inline-flex;
	align-items: center;
	align-self: baseline;
	gap: 0.5rem;
	font-family: var(--font-family-regular);
	font-size: var(--font-size-s);
	/* color: var(--color-4); */
	color: #a39cb1 !important;
	text-decoration: none;
	margin-bottom: 1.5rem;
	border-bottom: none !important;
	transition:
		color 0.2s,
		transform 0.2s;
}

.back-btn:hover {
	color: var(--color-3);
}

.back-btn::before {
	content: '←';
	font-size: 1.1em;
}
@media (max-width: 768px) {
	.back-btn {
		font-size: 0.9375rem;
		margin-bottom: 1rem;
	}
}
