@import url('https://fonts.googleapis.com/css2?family=Epilogue:ital,wght@0,100..900;1,100..900&family=Roboto+Condensed:wght@700&display=swap');
html{
	height: 100%;
	width: 100%;
	margin: 0;
	-webkit-overflow-scrolling:touch;
}
body{
	margin: 0;
	color: #000000;
	font-size: 14px;
	line-height: 1.2;
	font-family: "Epilogue", sans-serif;
	position: relative;
	width: 100%;
	-webkit-overflow-scrolling: touch;
	background: #000000;
	min-height: 100%;
	min-width: 320px;
}
body.active{
	overflow: hidden;
}
h1, h2, h3, h4, h5, h6{
	margin: 0 0 30px 0;
	font-weight: 700;
	color: #040404;
	line-height: 1.2;
}
h1{
	font-weight: 700;
	font-size: 72px;
}
h2{
	font-size: 48px;
}
h3{
	font-size: 30px;
}
h4{
	font-size: 24px;
}
h5{
	font-size: 20px;
}
h6{
	font-size: 16px;
}
p {
	font-weight: 400;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
	color: #fff;
	opacity: 0.5;
	margin: 0 0 25px 0;
}
p strong{
	font-weight: 600;
}
p a{
	text-decoration: underline;
	text-decoration-skip-ink: none;
	color: #fff;
}
p a:hover{
	text-decoration: none;
}
p:last-child{
	margin-bottom: 0px;
}
img{
	display: block;
	max-width: 100%;
}
a {
	outline: none;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}
ul{
	padding: 0;
	margin: 0;
}
li{
	list-style: none;
}
/*== buttons
---------------------------------*/
button{
	margin:0;
	padding:0;
	border:none;
	background:none;
	cursor:pointer;
	overflow:visible;
	width:auto;
	outline: none;
	box-shadow: none;
	font-family: inherit;
}
button:hover , button:focus , button:active{
	outline: none;
	text-decoration: none;
}
.primary-btn{
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #fff;
	border-radius: 78px;
	padding: 0 5px;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
	transition: 0.3s;
}
.primary-btn:hover{
	background: #fff;
	color: #000;
}
.secondary-btn{
	display: inline-flex;
	justify-content: center;
	align-items: center;	
	text-decoration: none;
	border-radius: 78px;
	background: #ff3030;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1;
	text-align: center;
	color: #000;
	text-transform: uppercase;
	transition: 0.3s;
}
.secondary-btn:hover{
    background: #ed1e1e;
}
.white-btn{
	display: inline-flex;
	justify-content: center;
	align-items: center;	
	text-decoration: none;
	border-radius: 78px;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1;
	color: #000;
	text-transform: uppercase;
	background: #d9d9d9;
	transition: 0.3s;
}
.white-btn:hover{
	opacity: 0.7;
}
/*== inputs
---------------------------------*/
input , select , textarea{
	font-family: inherit;
}
input{
	outline: none;
	border: none;
	font-family: inherit;
}
textarea{
	font-family: inherit;
	height: 80px;
	outline: none;
}
textarea{
	outline: none;
	resize: none;
}
/*== checkbox , raido */
select{
	outline: none;
	font-family: inherit;
}
a , button{
	-webkit-appearance: none;
	appearance: none;
	outline: none;
	box-shadow: none;
	-webkit-tap-highlight-color: transparent;
	-webkit-focus-ring-color: transparent;
}
/* End Total css ====*/
.container{
	max-width: 1315px;
	margin: 0 auto 0;
	padding: 0 15px;
}
*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.b-container{

}
.b-mobile{
	display: none;
}
.d-none{
	display: none !important;
}
/* -------------- page index -------------- */
.header{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 50;
	padding: 35px 0 0 0;
}
.header .container{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.logo{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0 15px;
	font-family: "Roboto Condensed", sans-serif;	
	font-weight: 700;
	font-size: 20px;
	line-height: 0.93333;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	max-width: 171px;
}
.logo img{
	max-width: 51px;
}
.nav ul{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0 76px;
}
.nav ul li a{
	font-weight: 600;
	font-size: 18px;
	line-height: 1;
	letter-spacing: -0.01em;
	color: #fff;
	text-decoration: none;
	transition: 0.3s;
}
.nav ul li a:hover{
	opacity: 0.7;
}
.nav__img{
	display: none;
}
.header__btn{
	width: 193px;
	height: 56px;
	font-size: 18px;
	line-height: 1;
}
/* =========== main =========== */
.main{
	position: relative;
	min-height: 890px;
	padding: 171px 0 30px 0;
}
.main:after{
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	width: 100%;
	height: 100%;
background: radial-gradient(54.89% 115.96% at 50% 100%, #0f464b 0%, rgba(15, 54, 75, 0.01) 88.46%, rgba(15, 54, 75, 0) 100%);
	z-index: 1;
}
.main .container{
	position: relative;
	z-index: 2;
}
.main__logo{
	margin: 0 auto 45px;
	max-width: 230px;
}
.main__wrap{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 40px 0;
	max-width: 762px;
	margin: 0 auto 0;
	text-align: center;
}
.main__title{
	font-weight: 700;
	font-size: 64px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
	color: #fff;
	margin: 0;
}
.main__wrap p{
	margin: 0;
}
.main__btns{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 39px;
}
.main__btn{
	width: 246px;
	height: 56px;
	font-size: 18px;
	line-height: 1;
}
.main__text p{
	font-size: 16px;
}
/* =========== marketing =========== */
.marketing{
	padding: 95px 0 135px 0;
	background: linear-gradient(180deg, #000 0%, #021416 100%);
}
.title{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 30px 0;
}
.title__head{
	font-weight: 400;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	text-align: center;
	color: rgb(255 255 255 / 50%);
	padding: 0 0 30px 0;
	border-bottom: 1px solid #25393a;
}
.title__item{
	font-weight: 700;
	font-size: 40px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
	color: #fff;
	margin: 0;
}
.title__sub{
	font-weight: 400;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
	color: #fff;
	opacity: 0.5;
}

.marketing .title{
	margin: 0 auto 54px;
	max-width: 762px;
}
.marketing .title__head{
	min-width: 462px;
}

.marketing .swiper-slide{
	max-width: 396px;
	margin-right: 20px;
}
.marketing__row{
	max-width: 1227px;
	margin: 0 auto 0;
}
.marketing__row .swiper-wrapper{
	align-content: flex-start;
}
.marketing__row .swiper-slide{
	height: auto;
}
.marketing__item{
	border-radius: 44px;
	background: rgba(53, 129, 136, 0.12);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	padding: 63px 46px 42px 46px;
	text-align: left;
	min-height: 441px;
	height: 100%;
}
.marketing__item-top{
	width: 100%;
	flex-grow: 1;
}
.marketing__item-label{
	position: absolute;
	top: 41px;
	left: 46px;
	font-weight: 400;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: #ff3030;
}
.marketing__item-img{
	margin: 0 auto 6px;
	width: 183px;
	height: 183px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.marketing__item-text{
	max-width: 256px;
	margin-bottom: 20px;
}
.marketing__item-text b{
	display: block;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	margin-bottom: 4px;
}
.marketing__item-text p{
	font-weight: 400;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	opacity: 1;
	text-align: left;
}
.marketing__item .primary-btn{
	width: 112px;
	height: 40px;
	font-size: 14px;
}
.section_slider .swiper-pagination{
	display: none;
}
/* =========== advantages =========== */
.advantages{
	min-height: 832px;
	padding: 128px 0;
	overflow: hidden;
	background: url(../images/advantages_bg.png) center right no-repeat;
	background-size: cover;
}
.advantages__wrapper{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0 155px;
	position: relative;
	z-index: 2;
}
.advantages__left{
	width: 425px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 25px 0;
	flex-shrink: 0;
}
.advantages__item{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0 50px;
}
.advantages__item-img{
	width: 150px;
	flex-shrink: 0;
}
.advantages__item-text{

}
.advantages__item-text b{
	display: block;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	margin-bottom: 10px;
}
.advantages__item-text p{
	font-weight: 400;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	text-align: left;
	opacity: 1;
}
.advantages__btns{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0 20px;
	margin-top: 9px;
}
.advantages__btn{
	width: 174px;
	height: 42px;
	font-size: 14px;
}
.advantages__img{
  	position: relative;
  	flex-grow: 1;
}
.advantages__img img{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	max-width: inherit;
	width: 810px;
}
/* =========== reviews =========== */
.reviews{
	padding: 174px 0 160px 0;
	background: linear-gradient(180deg, #000 0%, #020606 100%);
}
.reviews .title{
	margin-bottom: 105px
}
.reviews-js{
	max-width: 1282px;
	margin: 0 auto 0;
}
.reviews .swiper-slide{
	max-width: 362px;
	margin-right: 96px;
}

.reviews__item{
	padding: 0 0 0 49px;
}
.reviews__item-text{
	position: relative;
	font-weight: 400;
	font-size: 32px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	margin-bottom: 58px;
}
.reviews__item-text span{
	color: #ff3030;
}
.reviews__item-text:before{
	position: absolute;
	top: 0;
	left: -49px;
	content: "“";
	font-weight: 400;
	font-size: 96px;
	line-height: 1;
	letter-spacing: -0.01em;
	color: #ff3030;
}
.reviews__user-img{
	width: 81px;
	height: 81px;
	margin-bottom: 18px;
	position: relative;
}
.reviews__user-img:after{
	position: absolute;
	bottom: -19px;
	right: -30px;
	content: "";
	width: 94px;
	height: 94px;
	background: url(../images/circle.png) center no-repeat;
	background-size: cover;
	z-index: 1;
}
.reviews__user-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 100%;
	position: relative;
	z-index: 2;
}
.reviews__user-text{

}
.reviews__user-text b{
	display: block;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
}
.reviews__user-text span{
	display: block;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.5);
}
/* =========== story =========== */
.bottom{
	background: radial-gradient(75.01% 110.88% at 56% 0%, #0f464b 0%, rgba(15, 70, 75, 0) 100%);

}
.story{
	padding: 116px 0 118px 0;
	overflow: hidden;
}
.story__wrapper{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 0 22px;
}
.story__left{
	width: 100%;
	max-width: 762px;
	flex-shrink: 0;
}
.story__left .title{
	max-width: 584px;
	margin: 0 auto 60px;
}
.story__left .title__head{
	max-width: 462px;
	width: 100%;
}
.story__btns{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 19px;
}
.story__btn{
	width: 169px;
	height: 42px;
	font-size: 14px;
}
.story__img{
	flex-grow: 1;
	position: relative;
}
.story__img img{
	position: absolute;
	top: 21px;
	left: 0;
	max-width: inherit;
	width: 546px;
}
/* =========== cta =========== */
.cta{

}
.cta__wrapper{
	width: 100%;
	padding: 96px 280px 78px;
	background: url(../images/cta_bg.png) center top no-repeat;
	background-size: cover;
	border-radius: 44px;
}
.cta .title{
	max-width: 715px;
	margin: 0 auto 41px;
}
.cta__btns{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 19px;
}
.cta__btn{
	width: 169px;
	height: 42px;
	font-size: 14px;
}
/* =========== footer =========== */
.footer{
	background: #000;
	padding: 85px 0 0 0;
}
.footer__top{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.footer .logo{
	max-width: 285px;
	font-size: 35px;
}
.footer .logo img{
	max-width: 90px;
}
.footer__block{
	max-width: 360px;
	margin: 0 0 0 -65px;
}
.footer__block-title{
	font-weight: 700;
	font-size: 30px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	max-width: 340px;
	margin-bottom: 26px;
}
.footer__block p{
	text-align: left;
}
.footer__btns{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 0 19px;
}
.footer__btn{
	width: 169px;
	height: 42px;
	font-size: 14px;
}
.footer__nav{

}
.footer__nav ul{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 0 58px;
	max-height: 140px;
}
.footer__nav ul li a{
	display: block;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.74;
	letter-spacing: -0.01em;
	color: #fff;
	text-decoration: none;
	transition: 0.3s;
}
.footer__nav ul li a:hover{
	opacity: 0.7;
}
.footer__bottom{
	border-top: 1px solid #25393a;
	margin-top: 40px;
	padding: 40px 0 40px 0;
}
.copyright{
	font-weight: 400;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #fff;
	margin-bottom: 20px;
	text-align: center;
}
.footer__bottom p{
	font-size: 14px;
	text-align: center;
}