/*
@font-face {
	font-family: 'Sonhe';
	src: url('../assets/fonts/Sonhe.otf');
}
@font-face {
	font-family: 'SonheMedium';
	src: url('../assets/fonts/SonheMedium.otf');
}
/* @font-face {
	font-family: 'SonheBold';
	src: url('../assets/fonts/SonheBold.otf');
} */
*/
body {
	background: #f9f9fa;
}
html {
	scroll-behavior: smooth;
}
body.hidden {
    overflow: hidden;
}
.page {
	overflow: hidden;
	position: relative;
}
.header {
	position: relative;
	z-index: 1;
}
.header .logo .img.mob {
	display: none;
}
.title {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;  
	font-size: 36px;
	line-height: 48px;
	color: #fff;
}
.title.small {
	font-size: 24px;
	line-height: 32px;
}
.title.medium {
	font-size: 48px;
	line-height: 60px;
}
.title.big {
	font-size: 60px;
	line-height: 72px;
}
.desc {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #fff;
}
.desc.medium {
	font-size: 18px;
	line-height: 28px;
}
.desc.small {
	font-size: 13px;
	line-height: 20px;
}
.desc b {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
}
.mob {
	display: none;
}
button,
a {
	border: 0;
	outline: 0;
	cursor: pointer;
	transition: .3s;
}
a:hover  {
	opacity: .5;
}
.button {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  line-height: 20px;
	color: #CEFDD8;
	transition: .3s;
	background: #2A5450;
	border-radius: 16px;
	position: relative;
	padding: 19px 32px 21px 32px;
	display: inline-block;
}
body .button:hover {
	opacity: 1;
	background: #182C32;
}
.section {
	padding: 0 16px;
}
.wrapper {
	max-width: 1200px;
	margin: 0 auto;
}


.menu-button {
	display: none;
	position: fixed;
	top: 16px;
	right: 20px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	background: #CEFDD8;
	z-index: 4;
	width: 28px;
	height: 28px;
}
.menu-button span {
	width: 16px;
	height: 2px;
	background: #182C32;
	transition: .3s;
}
.header.active .menu-button span:first-child {
	transform: rotate(45deg);
}
.header.active .menu-button span:nth-child(2) {
	opacity: 0;
}
.header.active .menu-button span:last-child {
	transform: rotate(-45deg);
}
.header.active .menu-button span + span {
	margin-top: -2px;
}
.menu-button span + span {
	margin-top: 3px;
}
.logo .img {
	width: 126px;
}
.header {
	padding: 20px;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.header .wrapper {
	max-width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.header .left {
	display: flex;
	align-items: center;
	gap: 0 64px;
}
.header .right {
	display: flex;
	align-items: center;
	gap: 0 36px;
}
.header .right .desc:hover {
	opacity: 1;
	color: #C5CACB;
}
.header .nav {
	display: flex;
	align-items: center;
	gap: 0 16px;
}
.header .nav .desc {
	line-height: 22px;
	padding: 2px 8px 4px;
	border-radius: 6px;
}
.header .nav .desc:hover {
	opacity: 1;
	background: rgba(255, 255, 255, .1);
}
.header .button {
	font-size: 16px;
	line-height: 18px;
	padding: 14px 20px 16px 20px;
}

.hero-section {
	background: url('../assets/images/heroBg.jpg');
	background-position: center;
	background-size: cover;
}
.hero-section .wrapper {
	padding: 200px 0 340px;
}
.hero-section .text {
	max-width: 500px;
}
.hero-section .desc {
	margin-top: 24px;
}
.hero-section .button {
	margin-top: 60px;
}

.cards-section .wrapper {
	margin-top: -190px;
}
.card {
	background: #2A5450;
	border-radius: 24px;
	overflow: hidden;
	display: flex;
}
.card + .card {
	margin-top: 32px;
}
.card.gray {
	background: #EAEEED;
}
.card.white {
	background: #fff;
}
.card.green-dark {
	background: #182C32;
}
.card .desc {
	color: #8B9598;
	margin-top: 24px;
}
.card .desc.small {
	margin-top: 0;
	margin-bottom: 12px;
	text-transform: uppercase;
	color: #182C32;
}
.card .title {
	width: 100%;
	color: #182C32;
}
.card .button {
	background: #2A5450;
	color: #CEFDD8;
	margin-top: 60px;
}
.card .img {
	width: 50%;
	object-fit: cover;
	object-position: center;
}
.card .img.mob {
	display: none;
}
.card .img.bottom {
	object-fit: contain;
	object-position: bottom;
}
.card .text {
	padding: 72px;
	width: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}
.card.reverse .title {
	color: #CEFDD8;
}
.card.reverse .desc {
	color: #fff;
}
.card.reverse .desc.small {
	color: #A0F3C1;
}
.card.reverse .button {
	color: #2A5450;
	background: #CEFDD8;
}
.card.reverse .button:hover {
	background: #A0F3C1;
}
.now-section {
	padding: 160px 16px;
	text-align: center;
}
.now-section .title {
	color: #182C32;
}
.now-section .desc {
	color: #8B9598;
	max-width: 580px;
	margin: 24px auto 0;
}
.now-section .button {
	margin: 60px auto 0;
}


.footer {
	background: #182C32;
	padding: 96px 16px 40px;
}
.footer .row {
	display: flex;
	gap: 16px;
}
.footer .column {
	flex: 1;
}
.footer .column:first-child {
	display: flex;
	flex-direction: column;
    justify-content: space-between;
}
.footer .column:first-child .desc {
	color: #CEFDD8;
}
.footer .column ul {
	margin-top: 12px;
}
.footer .column li + li {
	margin-top: 12px;
}
.footer .column li .desc {
	color: #fff;
}
.footer .column li .desc:hover {
	opacity: 1;
	color: #C5CACB;
}
.footer .row + .desc {
	color: #8B9598;
	font-size: 12px;
	line-height: 18px;
	text-align: center;
	margin: 96px auto 0;
}
.footer .row + .desc + .desc {
	display: none;
}
.footer .row + .desc a {
	text-decoration: underline;
	color: #8B9598;
}
.footer .row + .desc a:hover {
	opacity: 1;
}
.personal-page .hero-section {
	background-image: url('../assets/images/hero2Bg.jpg');
}
.features {
	width: 50%;
	padding: 64px 0 64px 64px;
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
}
.features-carousel {
	display: none;
}
.features__item {
	width: calc((100% - 48px) / 3);
	background: #EAEEED;
	border-radius: 24px;
	padding: 24px;
}
.business-page .features__item:first-child {
	width: calc(50% - 12px);
}
.business-page .features__item:nth-child(2) {
	width: calc(50% - 12px);
}
.features__item .desc {
	color: #182C32;
	margin-top: 28px;
}
.features__item .img {
	width: auto;
	height: 52px;
}
.business-page .hero-section {
	background-image: url('../assets/images/hero3Bg.jpg');
}
.business-page .cards-section {
	padding-bottom: 160px;
}
.card.last {
	position: relative;
}
.card.last .text {
	width: 100%;
	position: relative;
	text-align: center;
	max-width: 850px;
	margin: 0 auto;
	padding: 125px 32px;
}
.card.last .title {
	max-width: 300px;
	margin: 0 auto;
}
.card.last .button {
	margin: 60px auto 0;
}
.card.last .img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	object-fit: cover;
	object-position: center;
}
.card.last .title {
	color: #fff;
}
.card.last .desc {
	color: #fff;
}

.modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 5;
	display: flex;
	justify-content: center;
	align-items: center;
	display: none;
	padding: 24px;
}
.modal .overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: #182C32;
	opacity: .6;
}
.modal .wrapper {
	position: relative;
	z-index: 1;
	background: #FFFFFF;
	padding: 60px;
	border-radius: 24px;
	max-width: 1200px;
	width: 100%;
	overflow: auto;
	max-height: 100%;
}
.modal button {
	width: 100%;
	max-width: 540px;
	margin-top: 40px;
	padding: 14px 16px 16px;
}
.modal .desc {
	color: #182C32;
}
.modal .desc a {
	color: #182C32;
	text-decoration: underline;
}
.modal .img {
	width: 328px;
}
.cookies-modal .wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 32px 96px;
	padding: 32px;
	max-width: 100%;
}
.cookies-modal {
	align-items: flex-end;
}
.cookies-modal .buttons {
	display: flex;
	gap: 24px;
}
.cookies-modal .button {
	padding: 14px 16px 16px;
	width: 168px;
	text-align: center;
	margin-top: 0;
}
.cookies-modal .button.gray {
	background: #F2F4F5;
	color: #2A5450;
}
.support-modal .wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}
.support-modal .form {
	max-width: 540px;
}
.support-modal .button {
	margin-top: 24px;
}

input {
	width: 100%;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
	font-size: 18px;
	line-height: 24px;
	padding-bottom: 16px;
	color: #182C32;
	border: 0;
	border-bottom: 1px solid #C5CACB;
	background: transparent;
	outline: 0;
}
input:focus {
	border-color: #8B9598;
}
input:focus::placeholder {
	color: #8B9598;
}
input::placeholder {
	color: #C5CACB;
}
input.error {
	border-color: #E52E2E;
}
input.error::placeholder {
	color: #E52E2E;
}
input.error {
	color: #E52E2E;
}
input + input {
	margin-top: 24px;
}
.error-modal .wrapper,
.success-modal .wrapper {
	text-align: center;
}
.error-modal .title,
.success-modal .title {
	color: #182C32;
	margin-top: 72px;
  font-family: 'Roboto', sans-serif; /* SonheBold */
  font-weight: 500;
}
.text-page .hero-section {
	background: #fff;
}
.text-page .hero-section .wrapper {
	padding-bottom: 160px;
}
.text-page .title {
	color: #182C32;
}
.text-page .header .desc {
	color: #182C32;
	margin-top: 0;
}
.text-page .title.big + .desc {
	margin-top: 24px;
}
.text-page .paragraaph {
	margin-top: 64px;
}
.text-page .paragraaph .desc {
	color: #182C32;
}
.text-page .paragraaph .desc a {
	text-decoration: underline;
	color: #182C32;
}
.text-page .desc ul {
	padding-left: 16px;
	list-style-type: disc;
}
.text-page .title.small {
	margin-bottom: 24px;
}
.text-page .paragraaph .desc {
	margin-top: 0;
}


@media screen and (max-width: 1200px) {
	.features__item {
		width: calc(50% - 12px);
	}
	.cookies-modal .wrapper {
		flex-direction: column;
		align-items: flex-end;
	}
}


@media screen and (max-width: 900px) {
	.card .text {
		padding: 32px;
	}
	.card .button {
		margin-top: 32px;
	}
	.card .desc {
		margin-top: 16px;
	}
	.card .desc.small {
		margin-bottom: 8px;
	}
	.hero-section .text {
		max-width: 490px;
	}
	.features {
		padding: 32px 0 32px 32px;
	}
}


@media screen and (max-width: 767px) {
	.title {
		font-size: 24px;
		line-height: 32px;
	}
	.title.medium {
		font-size: 24px;
		line-height: 32px;
	}
	.title.big {
		font-size: 40px;
		line-height: 52px;
		letter-spacing: -.5px;
		
	}
	.desc.medium {
		font-size: 16px;
		line-height: 24px;
	}
	.button {
		font-size: 16px;
		line-height: 18px;
		padding: 16px 24px 18px 24px;
	}
	.menu-button {
		display: flex;
	}
	.header .wrapper {
		position: fixed;
		left: 100%;
		top: 0;
		width: 100vw;
		height: 100vh;
		transition: .3s;
		z-index: 3;
		background: #182C32;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 24px;
		padding: 100px 40px 40px;
		overflow: auto;
	}
	.header.active .left {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 24px;
	}
	.header.active .right {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 24px;
	}
	.header .right {
		padding-left: 8px;
	}
	.header .nav {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 24px;
	}
	.header.active .wrapper {
		left: 0;
	}
	.header {
		z-index: 1;
		position: fixed;
		top: 4px;
		left: 4px;
		width: calc(100% - 8px);
		height: 52px;
		border-radius: 12px;
		background: #182C32;
	}
	.header .logo {
		position: fixed;
		left: 20px;
		top: 19px;
		background: #182C32;
	}
	.hero-section {
		background-image: url('../assets/images/heroBgMob.jpg');
	}
	.hero-section .wrapper {
		padding: 115px 0 510px;
		text-align: center;
	}
	.hero-section .desc {
		margin-top: 16px;
	}
	.hero-section .button {
		margin-top: 32px;
	}
	.hero-section .text {
		margin: 0 auto;
	}
	.card .button {
		margin: 32px auto 0;
	}
	.card {
		border-radius: 20px;
		flex-direction: column;
		text-align: center;
	}
	.card.card.reverse {
		flex-direction: column-reverse;
	}
	.cards-section .wrapper {
		margin-top: -235px;
	}
	.card .text {
		width: 100%;
	}
	.card .img {
		width: 100%;
	}
	.card .img.mob {
		display: block;
	}
	.card .img.mob + .img {
		display: none;
	}
	.card + .card {
		margin-top: 16px;
	}
	.card .desc.small {
		margin: 0 auto 8px;
	}
	.now-section {
		padding: 64px 16px 120px;
	}
	.now-section .desc {
		margin-top: 16px;
	}
	.now-section .button {
		margin-top: 32px;
	}
	.footer {
		padding: 32px 16px 16px;
	}
	.footer .column:first-child .desc {
		display: none;
	}
	.footer .row {
		flex-wrap: wrap;
		gap: 32px 16px;
	}
	.footer .column {
		flex: unset;
		width: calc(50% - 8px);
	}
	.footer .column:first-child {
		width: 100%;
	}
	.footer .column .desc {
		font-size: 14px;
		line-height: 20px;
	}
	.footer .column ul,
	.footer .column li + li {
		margin-top: 8px;
	}
	.footer .row + .desc {
		margin-top: 16px;
		text-align: left;
		order: 3;
	}
	.footer .row + .desc + .desc {
		margin-top: 56px;
		font-size: 14px;
		line-height: 20px;
		color: #8B9598;
		display: block;
		order: 2;
	}
	.footer .wrapper {
		display: flex;
		flex-direction: column;
	}
	.features.desktop {
		display: none;
	}
	.features-carousel {
		display: block;
		width: 100%;
		margin-top: 32px;
		width: calc(100% + 64px);
		margin-left: -32px;
	}
	.card.white {
		flex-direction: column-reverse;
		padding-bottom: 32px;
	}
	.features__item-container {
		padding: 0 32px;
	}
	.features__item {
		width: 100%;
	}
	.card.white .img {
		height: 44px;
		width: auto;
		margin: 0 auto;
	}
	.card.white .button {
		margin-top: 64px;
	}
	.card.white .features__item .desc {
		font-size: 14px;
		line-height: 20px;
	}
	.slick-dots {
		margin-top: 24px;
		display: flex;
		justify-content: center;
		gap: 10px;
	}
	.slick-dots button {
		width: 8px;
		height: 8px;
		display: block;
		border-radius: 100px;
		background: #C5CACB;
		font-size: 0;
		padding: 0;
	}
	.slick-dots .slick-active button {
		background: #182C32;
	}
	.personal-page .hero-section {
		background-image: url('../assets/images/hero2BgMob.jpg');
	}
	.personal-page .card.reverse {
		flex-direction: column;
	}
	.personal-page .card.gray {
		flex-direction: column-reverse;
	}
	.personal-page .card.gray + .card {
		flex-direction: column;
	}
	.business-page .hero-section {
		background-image: url('../assets/images/hero3BgMob.jpg');
	}
	.business-page .hero-section .wrapper {
		padding-bottom: 560px;
	}
	.business-page .features__item:first-child {
		width: 100%;
	}
	.business-page .card.gray + .card.reverse {
		flex-direction: column;
	}
	.business-page .card.reverse + .card.gray {
		flex-direction: column-reverse;
	}
	.cards-section {
		padding-bottom: 120px;
	}
	.card.last .text {
		padding: 320px 32px 64px;
	}
	.modal .wrapper {
		padding: 32px;
		flex-direction: column;
		align-items: center;
	}
	.support-modal .form {
		width: 100%;
		max-width: 100%;
	}
	.cookies-modal .buttons {
		flex-wrap: wrap;
		justify-content: center;
	}
	.modal .img {
		max-width: 328px;
		width: 100%;
	}
	.error-modal .title, .success-modal .title {
		margin-top: 24px;
	}
	.text-page .hero-section .wrapper {
		padding: 120px 0;
		text-align: left;
	}
	.text-page .paragraaph .desc {
		font-size: 14px;
		line-height: 20px;
		margin-top: 0;
	}
	.text-page .paragraaph {
		margin-top: 60px;
	}
	.text-page .title.small {
		margin-bottom: 20px;
	}
	.header .logo .img.mob {
		display: block;
	}
	.header .logo .img.mob + .img {
		display: none;
	}
	.text-page .header .desc {
		color: #fff;
	}
}
.mg-top-40 {
    margin-top: 40px;
}
.text-page p {
	  font-family: 'Roboto', sans-serif;
	  font-weight: 500;
	  font-size: 16px;
    line-height: 24px;
}