.layout {
	position: relative;
	overflow:hidden;
	transition:all ease 0.6s;
}
.layout > * {
	position: relative;
	z-index: 2;
}
.layout:before {
	content:' ';
	display: block;
	position: absolute;
	border-radius: 100%;
	width: 65px;
	height: 65px;
	top:70%;
	left: -200px;
	transition:all ease 1s;
	background: var(--Hover, #DFF0AC);
	z-index: 1;
	transform-origin:left center;
}
.layout:hover:before {
	transform:scale(23);
}
.layout .more {
	position: absolute;
	right: 35px;
	bottom: 40px;
	transition:all ease 0.5s;
	opacity: 0;
	color: var(--Black, #0E0F12);
	padding-left: 5px;
	overflow:hidden;
}
.layout .more span {
	display: flex;
	align-items: center;
	align-content: center;
	transform:rotate(15deg);
	transition:transform ease .5s;
	transform-origin: left top;
}
.layout .more svg {
	display: block;
}
.layout:hover .more {
	opacity: 1;
}
.layout:hover .more span {
	transform:rotate(0deg);
}
.layout .author {
	margin-top: 20px;
}
.layout .author .img {
	position: relative;
	margin-right: 10px;
	width: 55px;
	border-radius: 100%;
	overflow: hidden;
}
.layout .author .anim:before {
	background: var(--Primary, #3667FF);
}
.layout .author .img:after {
	content: ' ';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(../images/arrow3.svg) no-repeat center center;
	opacity: 0;
	z-index: 2;
	top:0;
	left: 0;
	transition: all ease .25s
}
.layout .author:hover .img:after {
	opacity: 1;
}
.layout .author:hover .anim:before {
	width: 200%;
	height: 200%;
}
.layout .author img {
	width: 100%;
	height: 55px;
	object-fit: cover;
	border-radius: 100%;
	display: block;
	z-index: 0;
}
.layout .author {
	transition:all ease 1s;
	font-family: IBM Plex Sans;
	font-size: 17px;
	color:#fff;
	font-weight: 500;
}
.layout:hover .author {
	color: var(--Black, #0E0F12);
}
#faq.bl {
	padding: 70px 0 0;
	    font-family: 'Poppins';
	overflow: hidden;
}
#faq.bl .section-title {
	font-size: 45px;
}
.faq > div > div {
	border-top:1px solid #2B233D;
}
.faq > div:last-child > div {
	border-bottom:1px solid #2B233D;
}
.faq .head {
	align-items: center;
	padding:30px 20px 26px;
	margin:0 0;
	font-size: 27px;
	line-height: 1.5;
	font-weight: 600;
	text-transform: uppercase;	
	color:var(--Black, #0E0F12);
	transition:all ease .6s;
	cursor:pointer;
}
.faq .head p,
.faq .head h3 {
	font-weight: 600;
	font-size: 27px;
	margin: 0 !important;
}
.faq .head:hover {
	color:#0E0F12;
}
.faq .head svg {
	fill:var(--Black, #0E0F12);
	display: block;
	margin-left: 20px;
	min-width: 24px;
	transition:all ease .5s;
}
.faq .head:hover svg {
	fill:#0E0F12;
}
.faq .body {
	display: none;
	padding:30px 20px 30px;
}
.faq .body * + p,
.faq .body * + ul {
	margin-top: 38px;
}
.faq ul {
	list-style:disc;
	padding:0 0 0 20px;
}
.faq ul li + li {
	margin-top: 10px;
}
.faq .layout:before {
	top:100%;
	left: -200px;
	transition:all ease .5s;
	transform-origin:left center;
}
.faq .layout:hover:before {
	transform:scale(30);
}
.faq .head.active svg {
	transform:rotate(180deg);
}
#faq {
	padding: 0 0 150px;
	overflow:hidden;
}
.faq > div > div {
	border-top:1px solid #2B233D;
}
.faq > div:last-child > div {
	border-bottom:1px solid #2B233D;
}
.faq .head {
	align-items: center;
	padding:50px 40px;
	margin:0 -40px;	
	color:#fff;
	transition:all ease .6s;
	cursor:pointer;
}
.faq .head:hover {
	color:#0E0F12;
}
.faq .head svg {
	fill:#fff;
	display: block;
	margin-left: 20px;
	min-width: 24px;
	transition:all ease .5s;
}
.faq .head:hover svg {
	fill:#0E0F12;
}
.ontech #banner > div:not(#v3d-container) {
	padding: 230px 20px 0;
	height:auto;
	display: block;
	text-align: center;
}
.ontech #banner .desc.m {
	min-height: unset;
}
.ontech #banner .desc textarea {
	min-height: 57px;
	font-size: 20px;
	text-align: center;
}
.ontech #banner h1 {
	margin:0 0 35px;
	text-align: center;
}
.ontech #banner .desc a {
	white-space: nowrap;
}
.ontech #banner .desc {
	max-width: 555px;
	margin:0 auto 50px;
}
.ontech #banner .buttons {
	gap:20px;
	margin:0 0 60px;
}
.ontech #banner .desc .desc2 {
	font-size: 20px;
	display: block !important;
	text-align: left;
}
.ontech .anim.btn-inline:hover:before {
	width: 150%;
}
.btn.green {
  background: var(--Hover, #DFF0AC);
  color: var(--Black, #0E0F12);
}
.btn.green:before {
  background: var(--Primary, #3667FF);
}
.btn.green:hover > span {
  color:#fff;
}
.fdesc {
	gap:22px;
}
.fdesc > div {
	width: 100%;
	padding: 15px 30px;
	text-align: left;
	align-items: center;
}
.fdesc > div:nth-child(1) {
	background: url(../images/fd1.jpg) no-repeat center;
	background-size: cover;
}
.fdesc > div:nth-child(2) {
	background: url(../images/fd2.jpg) no-repeat center;
	background-size: cover;
}
.fdesc > div:nth-child(3) {
	background: url(../images/fd3.jpg) no-repeat center;
	background-size: cover;
}
.fdesc .img {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	min-width: 140px;
	width: 140px;
	margin-right: 20px;
}
.fdesc .p1 {
	font-weight: 600;
	font-size: 24px;
	line-height: 125%;
	text-transform: uppercase;
}
#banner .in {
	position: relative;
}
#banner .in2 {
	position: absolute;
	padding:  0 0;
	right: 0;
	top:-15px;
	max-width: 235px;
	display: flex;
	align-items: center;
	text-align: left;
	color: #7f7893;
}
#banner .in2 video {
	max-width: 115px;
	margin-right: 10px;
}
#what {
	padding: 200px 0 75px;
	overflow:hidden;
	position: relative;
}
#what .container {
	position: relative;
}
#what .video1 {
	position: absolute;
	z-index: -1;
	    top: -70px;
    left: calc(50% - 240px);
    width: 1300px;
    max-width: 88%;
}
#what .video2 {
	position: absolute;
	z-index: -1;
	    top: 250px;
    right: calc(50% + 260px);
    width: 700px;
    max-width: 48%;
}
@media screen and (max-width:1400px) {
	#what .video1 {
		max-width: 82%;
    left: calc(50% - 150px);
    top:0;
	}
	#what .video2 {
		right: calc(50% + 220px);
	}
}
#what .section-title {
	margin:0 0 30px;
}
#what .p {
	max-width: 870px;
	margin:0 0 45px;
}
#what .p1 {
	font-weight: 700;
}
#what .p + .p {
	margin-top: 20px;
}
#what .desc {
	background: url(../images/what2.jpg) no-repeat center;
	background-size: cover;
	padding: 60px 130px 60px 60px;
	font-size: 20px;
	line-height: 1.4;
	margin-top: 60px;
}
#what .desc p + p {
	margin-top: 24px;
}
#what .desc2 {
	margin-left: 240px;
	margin-bottom: 45px;
	max-width: 490px;
}
#what .desc2 .title {
	font-weight: 600;
font-size: 24px;
line-height: 125%;
text-transform: uppercase;
color: #fff;
margin:0 0 25px;
}
#what ul {
	margin:0 0 12px;
}
#what ul li {
	padding-left: 27px;
	background: url(../images/check6.svg) no-repeat left 2px;
}
#what ul li + li {
	margin-top: 12px;
}
#what .title2 {
	font-weight: 500;
font-size: 20px;
}
#what .title2 a {
position: relative;
    overflow: hidden;
color: #62a5f9;
    display: inline-block;
    vertical-align: top;
    margin-top: 0px;
}
#what .title2 a:before {
    content: ' ';
    display: block;
    width: 15%;
    height: 1px;
    background: #140B27;
    position: absolute;
    left: -15%;
    bottom: 0;
    z-index: 2;
    transition: all ease .5s;
}
#what .title2 a:after {
	content:' ';;
	display: block;
	width: 100%;
	height:1px;
	background: #62a5f9;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1;
}
#what .title2 a:hover:before {
	left: 75%;
}
@media screen and (min-width:1250px) {
	.ontech main .section-title {
		font-size: 58px;
	}
	.ontech main #banner .section-title {
		font-size: 75px;
	}
}
#why {
	padding: 75px 0;
}
#why .sub {
	max-width: 625px;
	margin:0 0 60px;
}
#why .info {
	gap:60px;
}
#why .info > div {
	width: 100%;
	max-width: calc(33.33% - 60px*2/3);
	position: relative;
	animation-fill-mode: both;
}
#why .info .icon {
	border-radius: 100%;
	width: 64px;
	height: 64px;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	background: #fff;
	min-width: 64px;
	margin-right: 10px;
}
#why .info .p {
	display: flex;
	align-items: center;
	padding: 10px 20px;
	text-align: center;
	justify-content: center;
	color: #2b233d;
	backdrop-filter: blur(14px);
	background: #dff0ac;
	border-radius: 100px;
	height: 100%;
	width: 100%;
	position: relative;
	z-index: 2;
}
#why .info .icon + div {
	position: relative;
	width: 100%;
}
#why .info .desc {
	position: absolute;
	max-height: 0;
	top:17px;
	left: 0;
	width: 100%;
	text-align: center;
	color:#fff;
	/*backdrop-filter: blur(50px);*/
	/*-webkit-backdrop-filter: blur(50px);*/
	background: #2C233D;
	border-radius: 30px;
	transition:var(--transition);
	overflow:hidden;
}
#why .info > div:hover .desc {
	max-height: 225px;
}
#why .info .desc > div {
	overflow:hidden;
	padding: 60px 30px 20px;
	transition:var(--transition);
	opacity: 0;
	transform:translateY(-15px);
}
#why .info > div:hover .desc > div {
	opacity: 1;
	transform:translateY(0);
}
#why .info > div:hover {
	z-index: 3;
}
#why .icon > div {
	width: 25px;
	height: 25px;
	border-radius: 100%;
	background: #3667FF;
	position: relative;
}
#why .icon > div:before,
#why .icon > div:after {
	content:' ';
	display: block;
	position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  background-color: #3667FF;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(1);
  animation: pulse 3s infinite ease-out;
  z-index: 0;
  pointer-events: none;
}
#why .icon > div:before {

}
#why .icon > div:after {
	animation-delay: 0.5s;
}
@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
#free {
	padding: 75px 0 100px;
}
#free .content {
	color: #2b233d;
}
#free .content {
	padding: 40px 120px;
	background: #dff0ac;
	overflow:hidden;
	position: relative;
}
#free .content > div {
	max-width: 985px;
}
#free .content video {
	position: absolute;
	z-index: -1;
	    left: 550px;
    top: -25px;
}
.btn.white {
  background: #fff;
  color: var(--Black, #0E0F12);
}
.btn.white:before {
  background: var(--Primary, #3667FF);
}
.btn.white:hover > span {
  color:#fff;
}
.btn.black:before {
  background: #2b233d;
}
.btn.black:hover > span {
  color:#fff;
}
#free .buttons {
	gap:25px;
	margin-top: 45px;
}
#free .section-title {
	margin-bottom: 40px;
	position: relative;
	z-index: 2;
}
#free .section-title:before {
	content:' ';
	display: block;
	z-index: -1;
	height: calc(100% - 15px);
	top:20px;
	background: #fff;
	width: 0;
	left: -20px;
	transition:all ease 1s;
	position: absolute;
	transition-delay:0.75s;
}
#free .active-anim .section-title:before {
	width: calc(100% + 40px);
}
#free .sub {
	max-width: 710px;
}
#process {
	padding: 150px 0 120px;
	background: #fff url(../images/bg66.jpg) no-repeat center top;
	color: #2b233d;
}
@media screen and (min-width:1920px) {
	#process {
		background-size: 100% auto;
	}
}
#process .section-title {
	text-align: center;
	margin:0 0 20px;
	color: #0e0f12;
}
#process .sub {
	text-align: center;
	max-width: 890px;
	margin:0 auto 55px;
}
#process .col-left {
	width: 100%;
	max-width: 370px;
	position: relative;
	padding-top: 25px;
	padding-bottom: 240px;
}
#process .col-right {
	width: 100%;
	max-width: calc(100% - 370px);
}
#process .steps > div {
	padding: 30px 0 40px;
	position: relative;
}
#process .steps > div:last-child {
	padding-bottom: 0;
}
#process .steps > div:before {
	content:' ';
	width: calc(100% + 50vw - 725px);
	display: block;
	left: 0;
	position: absolute;
	top:0;
	height: 1px;
	background: rgba(0, 0, 0, 0.1);
	z-index: 2;
}
#process .title {
	text-transform: uppercase;
	font-family: var(--second-family);
	font-weight: 600;
	font-size: 36px;
	line-height: 1.25;
	text-transform: uppercase;
	color: #0e0f12;
	margin:0 0 20px;
}
#process .title span {
	color: #3667ff;
	display: inline-block;
	margin-right: 10px;
}
#process .desc1 {
	margin:0 0 10px;
	color: #7f7893;
	max-width: 870px;
}
#process .desc2 {
	padding: 15px 30px;
	position: relative;
	font-family: var(--second-family);
	font-weight: 600;
	font-size: 24px;
	line-height: 1.25;
	text-transform: uppercase;
	color: #2b233d;
	position: relative;
	z-index: 2;
	display: inline-block;
}
#process .desc2 span {
	color: #3667ff;
}
#process .desc2:before {
	content:' ';
	display: block;
	z-index: -1;
	height: 100%;
	top:0;
	background: #dff0ac;
	width: 0;
	left: 0px;
	transition:all ease 1s;
	position: absolute;
	transition-delay:1s;
}
#process .active-anim .desc2:before {
	width: 100%;
}
#process .round svg {
	display: block;
	position: absolute;
	left: calc(50% - 1px);
	margin:50px 0 0;
	z-index: 1;
	top:0;
	stroke-width: 3px;
	stroke: rgba(43, 35, 61, 0.3);
	width: 4px;
	height: calc(100% - 285px);
}
#process .round > div {
	width: 48px;
	height: 48px;
	background: #3667ff;
	border-radius: 100%;
	margin:0 auto;
	position: sticky;
	top:33%;
	z-index: 2;
	transition:all linear .3s;
}
#process .round > div:before {
	content:' ';
	display: block;
	border-radius: 100%;
	background: #fff;
	width: 6px;
	height: 6px;
	position: absolute;
	left: calc(50% - 3px);
	top:calc(50% - 3px);
}
.ontech main {
	overflow:visible;
}
#process .steps > div.step8 {
	padding: 60px 60px 70px;
	color:#fff;
	background: #3366FF ;
	background-size: cover;
	margin-top: 50px;
}
#process .steps > div.step8 .title {
	margin:0 0 15px;
	color:#fff;
}
#process .steps > div.step8 .desc1 {
	color:#fff;
	margin:0 0;
}
#process .results {
	margin:30px 0 0;
	padding: 20px 0;
	border-top: 1px solid rgba(250, 250, 250, 0.7);
	border-bottom: 1px solid rgba(250, 250, 250, 0.7);
	gap:30px;
}
#process .results > div {
	width: 100%;
	display: flex;
	align-items: center;
	text-transform: uppercase;
	color:#fff;
	font-weight: 600;
font-size: 22px;
line-height: 1.25;
text-transform: uppercase;
}
#process .results .icon {
	width: 100%;
	min-width: 110px;
	max-width: 110px;
	margin-right: 10px;
}
#process video {
	max-width: 100%;
	display: block;
}
#info2 {
	padding: 150px 0;
}
#info2 .section-title {
	margin:0 0 15px;
}
#info2 .sub {
	text-align: right;
	text-transform: uppercase;
	font-weight: 600;
font-size: 36px;
line-height: 125%;
text-transform: uppercase;
text-align: right;
color: #dff0ac;
}
#info2 .title {
	text-transform: uppercase;
	font-weight: 600;
font-size: 24px;
line-height: 125%;
text-transform: uppercase;
color: #dff0ac;
margin:0 0 60px;
display: flex;
align-items: center;
}
#info2 .title .img {
	background: url(../images/circle2.png) no-repeat center;
	background-size: 100% auto;
	min-width: 70px;
	width: 70px;
	height: 71px;
	margin-right: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}
#info2 .info2 {
	gap:50px 24px;
	margin-right:-20px;
	padding-right: 20px;
	background:url(../images/line2.svg) no-repeat 60px 75px;
	background-size: calc(100% - 60px) auto;
}
#info2 ul {
	max-width: 400px;
}
#info2 .info2 > div {
	max-width: calc(33.33% - 24px*2/3);
padding: 25px 0 30px;
	width: 100%;
}
#info2 .info2 > div:nth-child(6n+2) {
	margin-top: 70px;
	align-self: flex-start;
}
#info2 .info2 > div:nth-child(6n+3) {
	margin-top: 120px;
	align-self: flex-start;
}
#info2 .info2 > div:nth-child(6n+6) {
	margin-top: 60px;
	align-self: flex-start;
}
#info2 {
	overflow:hidden;
}
#info2 .title span {
	color:#fff;
	display: block;
}
#info2 ul li {
	padding-left: 34px;
	background: url(../images/check6.svg) no-repeat left 2px;
}
#info2 ul li + li {
	margin-top: 20px;
}
#info2 .info2 > div.blue {
	margin-top: -150px;
	align-self: flex-start;
}
#info2 .info2 > div.blue > div {
	max-width: 365px;
	background: #3667ff;
	padding: 50px 30px;
}
#info2 .info2 > div.blue ul {
	list-style:disc;
	padding-left: 18px;
}
#info2 .info2 > div.blue li {
	padding: 0;
	background: none;
}
#info2 .info2 > div.blue li + li {
	margin-top: 15px;
}
#info3 {
	padding: 0 0 150px;
}
#info3 .info3 {
	background: #fff url(../images/bg16.jpg) no-repeat left top;
	padding: 40px 140px;
	position: relative;
	color: #2b233d;
	overflow:hidden;
}
#info3 .info3 > div {
	max-width: 825px;
}
#info3 .section-title {
	margin:0 0 25px;
}
#info3 .sub {
	max-width: 600px;
	margin:0 0 40px;
}
#info3 video {
	position: absolute;
	left: calc(50% - 200px);
	top:-125px;
	max-width: 83%;
	width: 1200px;
}
@media screen and (max-width:1500px) {
	#info3 .info3 {
		padding: 40px 40px;
		background: #fff;
	}
	#info3 video {
		top:calc(-6vw - 35px);
	}
}

#included {
	background: #fff url(../images/bg6.jpg) no-repeat center bottom;
	padding: 150px 0;
	color:#0e0f12;
}
@media screen and (min-width:1920px) {
	#included {
		background-size: 100% auto;
	}
}
#included .section-title {
	color:#0e0f12;
	text-align: center;
	margin:0 0 20px;
}
#included .sub {
	text-align: center;
	margin:0 0 100px;
	font-size: 20px;
}
#included .col-left {
	width: 100%;
	max-width: calc(100% - 460px);
	margin-right: 80px;
}
#included .col-right {
	width: 100%;
	max-width: 460px;
}
#included .col-left > div {
	padding: 60px 0;
	border-top: 1px solid rgba(14, 15, 18, 0.1);
	align-items: center;
}
#included .col-left > div:last-child {
	border-bottom: 1px solid rgba(14, 15, 18, 0.1);
}
#included .col-left .col-right2 {
	width: 100%;
	max-width: 430px;
}
#included .col-left .col-left2 {
	width: 100%;
	max-width: 365px;
	padding-right: 20px;
	padding-top: 5px;
}
#included .title {
	text-transform: uppercase;
	margin:0 0 30px;
	font-weight: 600;
font-size: 24px;
}
#included .desc2 ul {
	list-style:none;
	padding: 0;
	margin:0;
}
#included .desc2 li {
	padding-left: 50px;
	background: url(../images/li2.png) no-repeat left top;
	background-size: 50px auto;
	display: flex;
	align-items: center;
	min-height: 45px;
}
#included .video {
	position:sticky;
	top:25%;
	display: flex;
	justify-content: center;
	overflow:hidden;
	margin:0 -40px;
}
#included .video canvas {
	margin:-50px 0;
}
#included .video:before {
	content:' ';
	display: block;
	position: absolute;
	height: 100%;
	left: 0;
	width: 80px;
	background: linear-gradient(to right, #fff, rgba(255,255,255,0));
	z-index: 2;
}
#included .video:after {
	content:' ';
	display: block;
	position: absolute;
	height: 100%;
	right: 0;
	width: 80px;
	background: linear-gradient(to left, #fff, rgba(255,255,255,0));
	z-index: 2;
}
#proj2 {
	padding: 135px 0 150px;
}
#proj2 .section-title {
	text-align: center;
}
#proj2 .section-title {
	margin:0 0 25px;
}
#proj2 .sub {
	margin:0 auto 60px;
	max-width: 1120px;
	font-size: 20px;
	text-align: center;
	line-height: 1.4;
}
#proj2 .d-flex {
	background: #1c1035;
}
#proj2 .col-left {
	width: 50%;
}
#proj2 .col-right {
	width: 50%;
	padding: 40px;
}
#proj2 img {
	max-width: 100%;
	display: block;
}
#proj2 .title {
	font-family: var(--second-family);
font-weight: 600;
font-size: 24px;
line-height: 1.25;
margin:0 0 30px;
text-transform: uppercase;
}
#proj2 .desc {
	margin:0 0 40px;
}
#proj2 .info {
	padding: 16px 7px;
	background: #fff;
	color: #0e0f12;
}
#proj2 .info > div {
	padding: 0 15px;
}
#proj2 .info > div + div {
	border-left: 1px solid rgba(14, 15, 18, 0.1);
}
#proj2 .info > div:nth-child(2) {
	padding: 0 30px;
}
#proj2 .info .p1 {
	margin:0 0 3px;
	text-transform: uppercase;
	font-weight: 600;
font-size: 24px;
line-height: 1.25;
padding-left: 34px;
min-width: 175px;
background: url(../images/check4.svg) no-repeat left top;
}
#proj2 .info .p2 {
	color: #7f7893;
padding-left: 34px;
}
#proj2 .btn {
	width: 100%;
	margin-top: 20px;
	justify-content: center;
}
#make {
	padding: 130px 0;
}
#make .btn-inline {
	display: none;
}
#make .sub2 {
	text-align: center;
	color: #898593;
	margin:20px 0 0;
}
#make .col-right {
	width: 100%;
	max-width: 480px;
	padding-right: 65px;
}
#make .col-left {
	padding-right: 40px;
	padding-left: 55px;
}
#make .desc textarea {
    border: 0;
    resize: none;
    background: transparent;
    width: 100%;
    color: #fff;
    font-size: 17px;
    line-height: 1.4;
    font-weight: 500;
    padding: 0;
    height: 25px;
    font-family: IBM Plex Sans;
    overflow: hidden;
    display: block;
}
#make .desc > p {
	display: none;
}
#make .desc {
	padding-left: 55px;
	background: url(../images/check5.svg) no-repeat left center;
	margin-left: 175px;
	margin-top: 55px;
}
#make .section-title span span {
	display: inline-block;
	position: relative;
	padding-right: 30px;
}
#make .section-title span span:before {
	content: ' ';
	display: block;
	height: 100%;
	width: 0;
	transition:all ease 0.6s;
	position: absolute;
	left: 10px;
	top:15px;
	background: #3667ff;
	z-index: -2;
}
#make .section-title span:nth-child(1) span:before {
	display: none;
}
#make .section-title span:nth-child(2) span:before {
	transition-delay:0.75s;
}
#make .section-title span:nth-child(3) span:before {
	transition-delay:1.25s;
}
#make .active-anim .section-title span span:before {
	width: calc(100% - 10px);
}
#make .section-title span:nth-child(3) span:before {
	background: linear-gradient(89deg, #3667ff 0%, rgba(54, 103, 255, 0.3) 100%);
}
#growth {
	color:#fff;
	background: url(../images/bg13.jpg) no-repeat center;
	background-size: cover;
	position: relative;
	overflow:hidden;
}
.text-row .str_wrap {
	width: 100%;
	display: flex;
	position: relative;
	-moz-user-select: none;
	user-select: none
}
.text-row .str_move {
	white-space: nowrap;
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	margin: 0!important
}
#growth .wprime {
	position: absolute;
	z-index: 1;
	left: 0;
	width: 100%;
	bottom: 30px;
	font-weight: 900;
	font-size: 24.6vw;
	line-height: 0.8;
	color: rgba(255, 255, 255, 0.05);
}
#growth .col-left {
	width: 100%;
	max-width: 560px;
	display: flex;
	align-items: center;
}
#growth .col-left > div {
	width: 100%;
}
#growth .col-right {
	width: 100%;
	max-width: calc(100% - 560px);
	padding: 100px 50px;
	padding-right: 0;
}
#growth .section-title {
	margin:0 0 40px;
	font-size: 70px;
}
#growth .sub {
	margin:0 0 75px;
	max-width: 730px;
}
#growth .info1 {
	position: relative;
	z-index: 2;
	height: 100%;
	padding: 100px 50px;
}
#growth .info1:before {
	content:' ';
	position: absolute;
	left: 0;
	top:0;
	width: 100%;
	height: 0;
	z-index: -1;
	display: block;
	background: url(../images/bg141.png) no-repeat left center;
	transition:all ease .6s;
	transition-delay: 1s;
}
#growth .active-anim .info1:before {
	height: 100%;
}
#growth .info1 .p1 {
	font-family: var(--second-family);
font-weight: 700;
font-size: 125px;
white-space: nowrap;
line-height: 0.8;
padding-left: 50px;
margin:0 0 0px;
}
#growth .info1 > div:nth-child(1) .p1 {
	background: url(../images/fd8.svg) no-repeat left center;
}
#growth .info1 > div:nth-child(2) .p1 {
	background: url(../images/fd14.svg) no-repeat left center;
}
#growth .info1 > div:nth-child(3) .p1 {
	background: url(../images/fd13.svg) no-repeat left center;
}
#growth .info1 > div + div {
	margin-top: 70px;
}
#growth .info1 .p2 {
	margin:0 0 10px;
	font-size: 20px;
	font-weight: 500;
}
#growth .info2 {
	gap:50px 30px;
}
#growth .info2 > div {
	width: 100%;
	max-width: calc(50% - 15px);
	padding-left: 21px;
	padding-right: 40px;
	position: relative;
}
#growth .info2 > div .l {
	position: absolute;
	left: 0;
	height: 100%;
	width: 5px;
	bottom: -3px;
	display: flex;
	align-items: flex-end;
}
#growth .info2 > div .l span {
	height: 0;
	display: block;
	width: 100%;
	transition:all ease 1.5s;
	transition-delay:0.75s;
	background: linear-gradient(to top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
}
#growth .info2.active-anim .l span {
	height: 100%;
}
#growth .info2 .p1 {
	margin:0 0 15px;
	text-transform: uppercase;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.25;
}
#growth .info2 .p2 {
	max-width: 265px;
}
#growth .container {
	position: relative;
	z-index: 2;
}
#growth .lines {
	position: relative;
	height: 100%;
}
#growth .line {
	position: absolute;
	left: 0;
	height: 1px;
	background: rgba(255, 255, 255, 0.2);
	z-index: 1;
	top:0;
	width: 0;
	transition:all ease 1.5s;
	transition-delay:1.5s;
}
#growth .line1,
#growth .line2,
#growth .line3,
#growth .line4,
#growth .line5 {
	width: 1px;
	height: 0;
	left: 0;
	top:0;
}
#growth .active-anim .line1,
#growth .active-anim .line2,
#growth .active-anim .line3,
#growth .active-anim .line4,
#growth .active-anim .line5 {
	height: 100%;
}
#growth .line1 {
	left: -24px;
}
#growth .line3 {
	left: 560px;
}
#growth .line4 {
	left: 584px;
}
#growth .line5 {
	left: auto;
	right: 100px;
}
#growth .line6,
#growth .line7 {
	width: 0;
	left: -100%;
	height: 1px;
}
#growth .active-anim .line6,
#growth .active-anim .line7 {
	width: 300%;
}
#growth .line6 {
	top:calc(33.33% + 15px);
}
#growth .line7 {
	top:calc(66.66% - 30px);
}
#other2 {
	padding: 0 0 150px;
}
.other2 {
	gap:24px;
}
.other2 > a {
	background: #3667FF;
	width: 100%;
	padding: 37px 24px 33px;
	justify-content: center;
	font-family: var(--second-family);
font-weight: 600;
font-size: 32px;
line-height: 150%;
text-transform: uppercase;
color: #fff;
}
.other2 > a span {
	text-transform: initial;
	font-family: var(--font-family);
font-weight: 500;
font-size: 17px;
line-height: 141%;
display: block;
}

.other2 > a svg {
	fill:#fff;
	margin-top: -2px;
}

@media screen and (max-width:1500px) {
	.other2 > a {
		font-size: 28px;
	}
}
@media screen and (min-width:1250px) {
	.other2 > a:hover {
		color:#0e0f12;
	}
	.other2 > a:hover svg {
		fill:#0e0f12;
	}
}
#services {
	padding: 0 0 75px;
}
#services .section-title {
	justify-content: center;
	text-align: center;
	margin:0 0 30px;
}
#services .sub {
	text-align: center;
	max-width: 640px;
	margin:0 auto 55px;
}
.services {
	gap:24px;
	align-items: flex-start;
	align-content: flex-start;
}
.services > div {
	max-width: calc(50% - 12px);
}
.services > div > div {
	padding: 60px;
	break-inside: avoid;
	background: url(../images/fd15.jpg) no-repeat center center;
	background-size: cover;
}
.services > div > div + div {
	margin-top: 24px;
}
.services > div + div {
	margin-top: 100px;
}
.services .title {
	position: relative;
	padding-right: 40px;
	font-weight: 600;
font-size: 36px;
line-height: 125%;
text-transform: uppercase;
margin:0 0 30px;
}
.services .title span {
	font-family: var(--font-family);
font-weight: 500;
font-size: 17px;
line-height: 141%;
color: #fff;
position: absolute;
right: 0;
top: 2px;
}
.services .more {
	display: inline-flex;
	align-items: center;
	color:#fff;
	opacity: 0.6;
	gap:10px;
}
.services .more:hover {
	opacity: 1;
}
.services .more svg {
	fill:#fff;
	display: block;
}
.services .more.open svg {
	transform:rotate(180deg);
}
.services .desc > div {
	margin:0 0 35px;
	overflow:hidden;
	max-height: 50px;
	transition: all linear .5s;
}
.services .desc > div.open {
	max-height: 300px;
}
.services .desc {
	padding: 30px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.1) 100%);
}
#plans {
	padding: 75px 0 150px;
}
#plans .section-title {
	text-align: center;
	justify-content: center;
	margin:0 0 30px;
}
#plans .sub {
	max-width: 640px;
	margin:0 auto 55px;
	text-align: center;
}
.plans {
	background: url(../images/fd16.jpg) no-repeat center;
	background-size: 100% 100%;
}
.plans .col1 {
	width: 100%;
	max-width: calc((100% - 515px) / 2 );
	background: url(../images/fd17.jpg) no-repeat 60% center;
	background-size: cover;
	padding: 60px;
}
.plans .col2 {
	width: 100%;
	max-width: 515px;
	background: url(../images/fd18.jpg) no-repeat center;
	background-size: cover;
	padding: 60px 60px 30px;
}
.plans .col3 {
	width: 100%;
	max-width: calc((100% - 515px) / 2 );
	background: url(../images/fd19.jpg) no-repeat center;
	background-size: cover;
	padding: 60px;
	color: #2b233d;
}
.plans .title {
	text-align: center;
	font-weight: 600;
font-size: 36px;
line-height: 125%;
text-transform: uppercase;
margin:0 0 30px;
}
.plans .title span {
	display: inline-block;
	position: relative;
	z-index: 2;
}
.plans .title span:before {
	content:' ';
	position: absolute;
	z-index: -1;
	left: -16px;
	width: calc(100% + 32px);
	bottom: -4px;
	height: 30px;
	background: #3667ff;
}
.plans .sub1 {
	text-align: center;
	font-weight: 600;
font-size: 24px;
line-height: 125%;
text-transform: uppercase;
margin:0 0 30px;
}
.plans .sub2 {
	margin:0 0 50px;
	text-align: center;
}
.text-center {
	text-align: center;
}
.plans .sub3 {
	margin:0 0 25px;
	padding: 10px 22px;
	display: inline-block;
	background: #3667ff;
	border-radius: 60px;
}
.plans ul li {
	padding-left: 45px;
	display: flex;
	align-items: center;
	min-height: 31px;
	background: url(../images/check7.svg) no-repeat left 0px;
}
.plans ul li + li {
	margin-top: 10px;
}
.plans .col1 > div {
	max-width: calc((1440px - 515px) / 2 - 60px);
	margin-left: auto;
}
.plans .col3 > div {
	max-width: calc((1440px - 515px) / 2 - 60px);
	margin-right: auto;
}
.plans .button1 {
	width: 196px;
	height: 196px;
	margin:160px auto 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-family: var(--font-family);
font-weight: 500;
font-size: 17px;
line-height: 141%;
text-align: center;
color: #2b233d;
border-radius: 100%;
	transition:all ease .33s;
	position: relative;
	z-index: 2;
	overflow:hidden;
}
.plans .button1:before {
	content:' ';
	display: block;
	position: absolute;
	left: 0;
	top:0;
	width: 100%;
	height: 100%;
	background: url(../images/button11.png) no-repeat center;
	background-size: 100% 100%;
	transition:all ease .33s;
	z-index: -1;
}
.plans .button1:after {
	z-index: -1;
	content:' ';
	display: block;
	position: absolute;
	left: 0;
	top:0;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: 0;
	background-size: 100% 100%;
	transition:all ease .33s;
}
.plans .button1:hover:after {
	opacity: 1;
}
.plans .button2 {
	width: 305px;
	height: 190px;
	
	margin:40px auto 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-family: var(--font-family);
font-weight: 500;
font-size: 17px;
line-height: 141%;
text-align: center;
color: #fff;
position: relative;
}
.plans .button2:before {
	content:' ';
	display: block;
	position: absolute;
	left: 0;
	top:0;
	width: 100%;
	height: 100%;
	background: url(../images/button22.png) no-repeat center;
	background-size: 100% 100%;
	transition:all ease .33s;
}
.plans .button2:hover:before {
	transform:rotate(-18deg);
}
.plans .button3 {
	width: 227px;
	height: 216px;
	background-image: url("data:image/svg+xml,%3Csvg width='227' height='216' viewBox='0 0 227 216' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M113.519 51.2157L148.573 0L146.878 62.0831L205.313 41.2346L167.486 90.4464L227 107.981L167.486 125.554L205.352 174.765L146.878 153.917L148.573 216L113.519 164.784L78.4273 216L80.1607 153.917L21.6869 174.765L59.5138 125.554L0 108.019L59.5138 90.4464L21.6869 41.2346L80.1607 62.0831L78.4273 0L113.519 51.2157Z' fill='%230E0F12'/%3E%3C/svg%3E%0A");
	background-repeat:no-repeat;
	background-size: 100% 100%;
	margin:35px auto 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-family: var(--font-family);
font-weight: 500;
font-size: 17px;
line-height: 141%;
text-align: center;
color: #fff;
}
.plans .button3:hover {
	background-image: url("data:image/svg+xml,%3Csvg width='227' height='216' viewBox='0 0 227 216' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M113.519 51.2157L148.573 0L146.878 62.0831L205.313 41.2346L167.486 90.4464L227 107.981L167.486 125.554L205.352 174.765L146.878 153.917L148.573 216L113.519 164.784L78.4273 216L80.1607 153.917L21.6869 174.765L59.5138 125.554L0 108.019L59.5138 90.4464L21.6869 41.2346L80.1607 62.0831L78.4273 0L113.519 51.2157Z' fill='%233667FF'/%3E%3C/svg%3E%0A");
}
.plans .col3 .title span:before {
	background: #fff;
}
.plans .col3 .title {
	color: #2b233d;
}
.plans .col3 .sub3 {
	color: #2b233d;
	background: #fff;
}
.plans .col3 ul li {
	background: url(../images/check8.svg) no-repeat left 0px;
}
#info2 .sub2 {
	margin-top: 20px;
	margin-left: auto;
	height: 108px;
	color: #fff;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	margin-bottom: -130px;
}
#info2 .sub2:after {
	content: ' ';
	width: 149px;
	margin-left: 3px;
	height: 149px;
	background: url(../images/game2.png) left bottom/149px auto no-repeat;
	display: block;
	transition: .3s cubic-bezier(.63, .02, .67, .47)
}
#info2 .sub2:hover:before {
	transform: scale(1.1)
}
#info2 .sub2 span {
	display: inline-block;
	background: url(../images/line3.svg) right center no-repeat;
	line-height: 44px;
	height: 44px;
	padding-right: 28px;
	padding-left: 16px;
}
@media screen and (max-width:1500px) {
	#growth .section-title {
		font-size: 58px;
	}
	.plans .col3 {
		padding: 40px 20px;
	}
	.plans .col2 {
		padding: 40px 20px 15px;
	}
	.plans .col1 {
		padding: 40px 20px;
	}
}
@media screen and (max-width:1450px) {
	#info2 .info2 {
		gap:20px 24px;
	}
	#info2 .info2 > div:nth-child(6n+6) {
		margin-top: 40px;
	}
	#proj2 .info > div:nth-child(2) {
		padding: 0 20px;
	}
	#proj2 .info .p1 {
		font-size: 22px;
		min-width: 160px;
	}
}
@media screen and (max-width:1400px) {
	#proj2 .info > div:nth-child(2) {
		padding: 0 15px;
	}
	#proj2 .info .p1 {
		font-size: 20px;
		min-width: 150px;
	}
}
@media screen and (max-width:1250px) {
	#info2 .sub2 {
		display: none;
	}
	#info2 .info2 {
		margin:0;
		padding: 0;
		background: none;
	}
}