@charset "UTF-8";

@keyframes fadeInTop {
	0% {
		translate: 0 -100%
	}

	to {
		translate: 0 0
	}
}

@keyframes fadeOutTop {
	0% {
		translate: 0 0
	}

	to {
		translate: 0 -200%
	}
}

@keyframes showIn {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes showOut {
	0% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@keyframes pulse {
	0% {
		opacity: 0
	}

	80%,
	to {
		opacity: 1
	}
}

.header {
	position: sticky;
	left: 0;
	top: 0;
	z-index: 10;
	width: 100%;
	will-change: transform;
	background: #fff;
	font-size: 14px
}

.header__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 12px;
	margin-bottom: 12px;
	gap: 12px;
	border-bottom: 1px solid #dbe1f1
}

.header__top-wrapper {
	display: flex;
	align-items: center
}

.header__logo svg {
	width: 173px;
	height: 38px
}

.header__address,
.header__time {
	color: #656769
}

.header__address,
.header__time,
.header__tel {
	display: flex;
	align-items: flex-start;
	gap: 12px
}

.header__address svg,
.header__time svg,
.header__tel svg {
	max-width: 20px;
	max-height: 20px;
	fill: #dbe1f1
}

.header__tel {
	font-weight: 600;
	transition: all .4s
}

.header__tel:focus-visible {
	color: #3742d1
}

.header__tel:focus-visible svg {
	fill: #3742d1
}

.header__button {
	min-height: 48px;
	padding: 12px 32px;
	border-radius: 8px;
	background: #3742d1;
	border: 0;
	font-weight: 600;
	color: #fff;
	transition: all .4s
}

.header__button:focus-visible {
	background: #2b3496;
	color: #fff
}

.header__menu {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
	font-weight: 600
}

.header__menu>li>a {
	padding: 4px 12px;
	border-radius: 8px
}

.header__menu>li>a:focus-visible {
	background: #edf1fe;
	color: #3742d1
}

.header-main {
	position: relative;
	background: linear-gradient(90deg, #414cd7 0, #646eeb 100%);
	color: #fff;
	overflow: hidden
}

.header-main__wrapper {
	position: relative;
	display: grid;
	justify-items: start;
	grid-template-columns: 1fr auto;
	align-items: start
}

.header-main__img {
	position: absolute;
	left: 59%;
	bottom: -40px;
	translate: -50% 0;
	z-index: 2
}

.header-main__left {
	display: grid;
	max-width: 770px
}

.header-main__title {
	z-index: 3;
	font-weight: 700;
	color: #fff
}

.header-main__subtitle {
	max-width: 460px;
	color: #edf1fe
}

.header-main__list {
	font-weight: 600;
	line-height: 1.66667
}

.header-main__list li:before {
	content: "✓";
	margin-right: 8px
}

.header-main__form {
	display: grid;
	justify-items: center;
	background: #fff;
	border: 1px solid #c7cacf;
	border-radius: 16px;
	text-align: center;
	color: #2d2d33
}

.header-main__form .form__fields {
	display: grid;
	grid-template-columns: 100%;
	gap: 24px
}

.header-main__form .form__text {
	font-size: 14px;
	line-height: 1.42857;
	text-align: center;
	color: #656769;
	text-wrap: balance
}

.header-main__form .checkbox {
	text-align: left
}

.header-main__form .checkbox__input:checked:before {
	border-color: #3742d1
}

.header-main__form .checkbox__input:checked:after {
	background: #3742d1
}

.header-main__form .input {
	width: 100%;
	padding: 12px 20px;
	border: 1px solid #c7cacf;
	border-radius: 8px;
	text-align: left;
	font-size: 16px;
	color: #2d2d33
}

.header-main__form .input::placeholder {
	color: #c7cacf
}

.header-main__form .submit {
	font-size: 16px;
	font-weight: 700
}

.header-main-2 .header-main__wrapper {
	align-items: center
}

.header-main-2 .header-main__left {
	max-width: 860px
}

.header-main-2 .header-main__title {
	max-width: none;
	line-height: 1.04348
}

.header-main-2 .header-main__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px
}

.header-main-2 .header-main__list li {
	display: grid;
	justify-items: center;
	align-content: start;
	padding: 12px;
	gap: 8px;
	max-width: 180px;
	background: #fff;
	border-radius: 20px;
	text-align: center;
	color: #2d2d33;
	font-weight: 600;
	line-height: 1
}

.header-main-2 .header-main__list li:before {
	font-size: 30px;
	background: linear-gradient(90deg, #414cd7 0, #646eeb 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.header-main-2 .header-main__form {
	max-width: 592px;
	gap: 8px
}

.header-main-2 .header-main__form form {
	width: 100%
}

.header-main-3 .header-main__img {
	left: 60%
}

.header-main-3 .header-main__list {
	position: relative;
	z-index: 3;
	display: flex;
	flex-wrap: wrap;
	gap: 16px 9px
}

.header-main-3 .header-main__list li {
	background: #fff;
	border-radius: 20px;
	font-weight: 600;
	color: #2d2d33
}

.header-main-3 .header-main__list li:before {
	vertical-align: middle;
	font-weight: 600;
	text-align: center;
	background: linear-gradient(90deg, #414cd7 0, #646eeb 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.header-main-3 .header-main__title {
	max-width: none
}

@keyframes fadeInTop {
	0% {
		translate: 0 -100%
	}

	to {
		translate: 0 0
	}
}

@keyframes fadeOutTop {
	0% {
		translate: 0 0
	}

	to {
		translate: 0 -200%
	}
}

@keyframes showIn {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes showOut {
	0% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@keyframes pulse {
	0% {
		opacity: 0
	}

	80%,
	to {
		opacity: 1
	}
}

.footer {
	background: #edf1fe
}

.footer__wrapper {
	display: grid;
	grid-template-columns: repeat(4, max-content);
	justify-content: space-between;
	gap: 20px 12px;
	align-items: start;
	margin-bottom: 20px
}

.footer__col {
	display: grid
}

.footer__requisites {
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.35;
	color: #728392
}

.footer__tel,
.footer__time,
.footer__address {
	display: flex;
	align-items: center
}

.footer__tel svg,
.footer__time svg,
.footer__address svg {
	max-width: 20px;
	max-height: 20px;
	fill: #3742d1
}

.footer__menu {
	display: grid;
	list-style: none
}

.footer__menu>li>a:focus-visible,
.footer__tel:focus-visible {
	color: #3742d1
}

.footer__button {
	padding-block: 8px;
	background: #3742d1;
	border-radius: 12px;
	border: 0;
	font-weight: 500;
	color: #fff;
	white-space: nowrap;
	transition: all .4s
}

.footer__bottom {
	display: flex;
	align-items: center;
	padding-block: 20px;
	row-gap: 4px;
	flex-wrap: wrap;
	border-top: 1px solid #c7cacf;
	font-size: 14px
}

.footer__bottom a,
.footer__bottom button {
	text-decoration: underline;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
	text-underline-offset: .1lh;
	transition: color .3s, text-decoration-color .3s;
	font-weight: 600
}

.footer__bottom a:focus-visible,
.footer__bottom button:focus-visible {
	color: #3742d1
}

@keyframes fadeInTop {
	0% {
		translate: 0 -100%
	}

	to {
		translate: 0 0
	}
}

@keyframes fadeOutTop {
	0% {
		translate: 0 0
	}

	to {
		translate: 0 -200%
	}
}

@keyframes showIn {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes showOut {
	0% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@keyframes pulse {
	0% {
		opacity: 0
	}

	80%,
	to {
		opacity: 1
	}
}

.menu-link {
	position: relative;
	order: 10;
	flex-shrink: 0;
	width: 24px;
	height: 24px
}

.menu-link.active .menu-lines {
	background: 0 0
}

.menu-link.active .menu-lines:after {
	top: 0;
	rotate: -135deg
}

.menu-link.active .menu-lines:before {
	top: 0;
	translate: 50% 50%;
	rotate: 135deg
}

.menu-lines,
.menu-lines:before,
.menu-lines:after {
	position: absolute;
	right: 50%;
	width: 18px;
	height: 2px;
	background-color: #2d2d33;
	transition: .4s;
	pointer-events: none
}

.menu-lines {
	top: 50%;
	translate: 50% 0
}

.menu-lines:before {
	content: "";
	top: -5px;
	translate: 50% -50%
}

.menu-lines:after {
	content: "";
	top: 5px;
	translate: 50% 50%
}

@media (min-width:576px) {
	.header-main__title {
		line-height: 1
	}
}

@media (min-width:992px) {
	.menu-link {
		display: none
	}
}

@media (min-width:1401px) {
	.header {
		padding-block: 20px
	}

	.header__button {
		font-size: 16px
	}

	.header__menu {
		gap: 48px
	}

	.header-main__img {
		width: 333px
	}

	.header-main__img {
		height: 500px
	}

	.header-main__left {
		gap: 16px
	}

	.header-main__title {
		max-width: 615px
	}

	.header-main__title {
		font-size: 48px
	}

	.header-main__subtitle {
		font-size: 16px
	}

	.header-main__list {
		font-size: 24px
	}

	.header-main__form {
		gap: 28px
	}

	.header-main__form {
		padding-block: 28px
	}

	.header-main__form {
		padding-inline: 24px
	}

	.header-main__form {
		max-width: 420px
	}

	.header-main-2 .header-main__title {
		font-size: 46px
	}

	.header-main-2 .header-main__list li {
		font-size: 16px
	}

	.header-main-3 .header-main__list {
		row-gap: 16px
	}

	.header-main-3 .header-main__list li {
		padding-inline: 16px
	}

	.header-main-3 .header-main__list li {
		font-size: 16px
	}

	.header-main-3 .header-main__list li:before {
		font-size: 30px
	}

	.footer {
		padding-top: 60px
	}

	.footer__col {
		gap: 20px
	}

	.footer__tel,
	.footer__time,
	.footer__address {
		gap: 12px
	}

	.footer__menu {
		gap: 20px
	}

	.footer__button {
		min-width: 273px
	}

	.footer__button {
		min-height: 54px
	}

	.footer__button {
		padding-inline: 20px
	}

	.footer__button {
		font-size: 16px
	}

	.footer__bottom {
		column-gap: 50px
	}
}

@media (max-width:1400px) {
	.header {
		padding-block: round(clamp(min(20px, 16px), 15.2px + .25vw, max(20px, 16px)), 1px)
	}

	.header__button {
		font-size: round(clamp(min(16px, 14px), 13.6px + .125vw, max(16px, 14px)), 1px)
	}

	.header__menu {
		gap: round(clamp(min(48px, 12px), 4.8px + 2.25vw, max(48px, 12px)), 1px)
	}

	.header-main__img {
		width: round(clamp(min(333px, 199.8px), 173.16px + 8.325vw, max(333px, 199.8px)), 1px)
	}

	.header-main__img {
		height: round(clamp(min(500px, 300px), 260px + 12.5vw, max(500px, 300px)), 1px)
	}

	.header-main__left {
		gap: round(clamp(min(16px, 8px), 6.4px + .5vw, max(16px, 8px)), 1px)
	}

	.header-main__title {
		max-width: round(clamp(min(615px, 400px), 357px + 13.4375vw, max(615px, 400px)), 1px)
	}

	.header-main__title {
		font-size: round(clamp(min(48px, 24px), 19.2px + 1.5vw, max(48px, 24px)), 1px)
	}

	.header-main__subtitle {
		font-size: round(clamp(min(16px, 12px), 11.2px + .25vw, max(16px, 12px)), 1px)
	}

	.header-main__list {
		font-size: round(clamp(min(24px, 12px), 9.6px + .75vw, max(24px, 12px)), 1px)
	}

	.header-main__form {
		gap: round(clamp(min(28px, 16px), 13.6px + .75vw, max(28px, 16px)), 1px)
	}

	.header-main__form {
		padding-block: round(clamp(min(28px, 20px), 18.4px + .5vw, max(28px, 20px)), 1px)
	}

	.header-main__form {
		padding-inline: round(clamp(min(24px, 16px), 14.4px + .5vw, max(24px, 16px)), 1px)
	}

	.header-main__form {
		max-width: round(clamp(min(420px, 288px), 261.6px + 8.25vw, max(420px, 288px)), 1px)
	}

	.header-main__form .form__title {
		font-size: 20px
	}

	.header-main-2 .header-main__title {
		font-size: round(clamp(min(46px, 24px), 19.6px + 1.375vw, max(46px, 24px)), 1px)
	}

	.header-main-2 .header-main__list li {
		font-size: round(clamp(min(16px, 10px), 8.8px + .375vw, max(16px, 10px)), 1px)
	}

	.header-main-3 .header-main__list {
		row-gap: round(clamp(min(16px, 9px), 7.6px + .4375vw, max(16px, 9px)), 1px)
	}

	.header-main-3 .header-main__list li {
		padding-inline: round(clamp(min(16px, 8px), 6.4px + .5vw, max(16px, 8px)), 1px)
	}

	.header-main-3 .header-main__list li {
		font-size: round(clamp(min(16px, 10px), 8.8px + .375vw, max(16px, 10px)), 1px)
	}

	.header-main-3 .header-main__list li:before {
		font-size: round(clamp(min(30px, 16px), 13.2px + .875vw, max(30px, 16px)), 1px)
	}

	.footer {
		padding-top: round(clamp(min(60px, 32px), 26.4px + 1.75vw, max(60px, 32px)), 1px)
	}

	.footer__col {
		gap: round(clamp(min(20px, 12px), 10.4px + .5vw, max(20px, 12px)), 1px)
	}

	.footer__tel,
	.footer__time,
	.footer__address {
		gap: round(clamp(min(12px, 4px), 2.4px + .5vw, max(12px, 4px)), 1px)
	}

	.footer__menu {
		gap: round(clamp(min(20px, 12px), 10.4px + .5vw, max(20px, 12px)), 1px)
	}

	.footer__button {
		min-width: round(clamp(min(273px, 200px), 185.4px + 4.5625vw, max(273px, 200px)), 1px)
	}

	.footer__button {
		min-height: round(clamp(min(54px, 36px), 32.4px + 1.125vw, max(54px, 36px)), 1px)
	}

	.footer__button {
		padding-inline: round(clamp(min(20px, 12px), 10.4px + .5vw, max(20px, 12px)), 1px)
	}

	.footer__button {
		font-size: round(clamp(min(16px, 14px), 13.6px + .125vw, max(16px, 14px)), 1px)
	}

	.footer__bottom {
		column-gap: round(clamp(min(50px, 20px), 14px + 1.875vw, max(50px, 20px)), 1px)
	}
}

@media (max-width:1199px) {
	.header-main__img {
		left: 57%
	}

	.header-main-2 .header-main__form {
		max-width: round(clamp(min(400px, 240px), 181.7519908987px + 18.2025028441vw, max(400px, 240px)), 1px)
	}

	.header-main-2 .header-main__img {
		left: 50%
	}

	.header-main-3 .header-main__img {
		left: 54%
	}
}

@media (max-width:991px) {
	.header__mobile {
		position: fixed;
		right: -100vw;
		top: var(--headerFixedHeight);
		z-index: 5;
		display: grid;
		grid-template-columns: 100%;
		justify-items: start;
		align-content: start;
		gap: 20px;
		width: min(500px, 101vw);
		padding: 40px 20px 40px;
		background: #fff;
		box-shadow: 0 4px 12px 0 rgba(0, 67, 139, .08);
		opacity: 0;
		transition: right .3s, opacity .3s;
		max-height: 100vh;
		overflow-y: auto;
		overflow-x: hidden;
		pointer-events: none
	}

	@supports (-moz-appearance:none) {
		.header__mobile {
			scrollbar-color: #6069db #f5f5f5;
			scrollbar-width: thin
		}
	}

	.header__mobile::-webkit-scrollbar {
		width: 4px
	}

	.header__mobile::-webkit-scrollbar-track-piece {
		background-color: #f5f5f5;
		border-radius: 4px
	}

	.header__mobile::-webkit-scrollbar-thumb {
		background-color: #6069db;
		border-radius: 4px
	}

	.header__mobile.active {
		right: 0;
		opacity: 1;
		pointer-events: auto
	}

	.header__nav {
		width: 100%;
		order: -1
	}

	.header__menu {
		display: grid;
		grid-template-columns: 100%;
		gap: 20px;
		width: 100%
	}

	.header__top {
		padding-bottom: 0;
		margin-bottom: 0;
		border: 0
	}

	.header-main__wrapper {
		grid-template-columns: 100%;
		gap: 30px
	}

	.header-main__img {
		left: 10%;
		z-index: 0
	}

	.header-main__form {
		z-index: 2;
		margin-left: 25%;
		max-width: 440px
	}

	.header-main-2 .header-main__wrapper {
		grid-template-columns: 100%;
		justify-items: start
	}

	.header-main-2 .header-main__left {
		display: contents
	}

	.header-main-2 .header-main__list {
		grid-template-columns: repeat(3, 1fr)
	}

	.header-main-2 .header-main__form {
		margin-left: 0;
		order: 2
	}

	.header-main-2 .header-main__img {
		left: 70%
	}

	.header-main-3 .header-main__left {
		display: contents
	}

	.header-main-3 .header-main__list {
		order: 3
	}

	.header-main-3 .header-main__form {
		margin-left: 0;
		max-width: 100%
	}

	.header-main-3 .header-main__img {
		left: auto;
		translate: 0 0;
		height: auto;
		right: round(clamp(min(-100px, 150px), 269.2250372578px + -37.2578241431vw, max(-100px, 150px)), 1px);
		width: round(clamp(min(300px, 200px), 152.3099850969px + 14.9031296572vw, max(300px, 200px)), 1px)
	}

	.footer__menu {
		display: flex;
		justify-content: space-between;
		padding-block: 20px;
		grid-column: 1/-1;
		order: -1;
		flex-wrap: wrap;
		border-block: 1px solid #c7cacf;
		font-weight: 600
	}
}

@media (max-width:767px) {
	.header__button {
		padding: 4px 8px;
		min-height: auto
	}

	.header__logo img {
		width: 28px;
		height: 28px
	}

	.header-main-2 .header-main__img {
		left: 80%;
		width: 280px;
		object-position: bottom
	}

	.header-main-3 .header-main__form {
		max-width: 350px
	}

	.header-main-3 .header-main__img {
		right: round(clamp(min(-120px, 50px), 171.7002237136px + -38.0313199105vw, max(-120px, 50px)), 1px)
	}

	.footer__wrapper {
		grid-template-columns: 100%
	}

	.footer__button {
		display: none
	}

	.footer__brand {
		order: 2
	}
}

@media (max-width:575px) {
	.header-main__list {
		display: none
	}

	.header-main__img {
		width: 275px;
		height: auto
	}

	.header-main:not(.header-main-2):not(.header-main-3) .header-main__img {
		grid-row: 2;
		grid-column: 1;
		top: 0;
		bottom: auto;
		width: auto;
		max-width: 275px;
		max-height: calc(100% + 88px)
	}

	.header-main-2 .header-main__form .submit {
		font-size: round(clamp(min(16px, 12px), 6.9803921569px + 1.568627451vw, max(16px, 12px)), 1px)
	}

	.header-main-2 .header-main__img {
		width: round(clamp(min(280px, 200px), 99.6078431373px + 31.3725490196vw, max(280px, 200px)), 1px)
	}

	.header-main-3 .header-main__subtitle {
		display: none
	}

	.header-main-3 .header-main__list {
		max-width: round(clamp(min(450px, 250px), -.9803921569px + 78.431372549vw, max(450px, 250px)), 1px)
	}

	.header-main-3 .header-main__list li {
		display: flex;
		align-items: center;
		max-width: 62vw;
		padding-block: 4px !important;
		line-height: 1
	}

	.header-main-3 .header-main__img {
		bottom: -60px;
		width: round(clamp(min(200px, 120px), 19.6078431373px + 31.3725490196vw, max(200px, 120px)), 1px);
		right: round(clamp(min(-50px, -10px), 40.1960784314px + -15.6862745098vw, max(-50px, -10px)), 1px)
	}
}

@media (max-width:575px) and (max-width:1400px) {
	.header-main-2 .header-main__form {
		padding-inline: round(clamp(min(20px, 12px), 10.4px + .5vw, max(20px, 12px)), 1px)
	}
}

@media (max-width:430px) {
	.header__tel svg {
		display: none
	}
}

@media (max-width:360px) {
	.header__tel {
		font-size: 12px
	}
}

@media (max-width:575px) and (min-width:1401px) {
	.header-main-2 .header-main__form {
		padding-inline: 20px
	}
}

@media (any-hover:hover) {
	.header__tel:hover {
		color: #3742d1
	}

	.header__tel:hover svg {
		fill: #3742d1
	}

	.header__button:hover {
		background: #2b3496;
		color: #fff
	}

	.header__menu>li>a:hover {
		background: #edf1fe;
		color: #3742d1
	}

	.footer__menu>li>a:hover,
	.footer__tel:hover {
		color: #3742d1
	}

	.footer__bottom a:hover,
	.footer__bottom button:hover {
		color: #3742d1
	}
}