@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300..900&display=swap');

body{
	font-family: 'Raleway';
	color:#000;
}

.wrap{
	max-width:1520px;
	margin:0 auto;
	padding:0 40px;
}

.top-menu{
	position:fixed;
	left:40px;
	top:30px;
	right:40px;
	background:#fff;
	height:85px;
	border-radius:1000px;
	box-shadow: 7px 10px 40px 0px rgba(165,186,202,0.4);
	display: flex;
	align-items: center;
	padding:0 40px;
	z-index:100;
}
.top-menu-logo{
	width:160px;
	height:48px;
	background:url(../img/logo.png) left center no-repeat;
	background-size:auto 100%;
	flex-shrink: 0;
}
.top-menu-links{
	display: flex;
	align-items: center;
	gap:30px;
	margin-left:20px;
	width:100%;
}
.top-menu-link{
	font-size:15px;
	font-weight: 500;
	color: #000 !important;
	text-decoration: none!important;
	flex-shrink: 0;
}
.top-menu-btn{
	width:200px;
	height:60px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size:15px;
	font-weight: 700;
	background:#CCFE5B;
	background:#a6f83d;
	border-radius: 100px;
	flex-shrink: 0;
	margin-left:20px;
	cursor: pointer;
	
}

.header{
	background:#F4F4F4;
	padding-top:150px;
	padding-bottom:20px;
}
.header-box{
	max-width:1200px;
	margin:0 auto;
	display: flex;
	gap:30px;
}
.header-box-l{
	flex: 0 0 calc((100% - 30px) / 2);
	padding-top:90px;
}
.header-box-r{
	flex: 0 0 calc((100% - 30px) / 2);
	display: flex;
	align-items: center;
	justify-content: center;
}

h1{
	margin:0;
	font-size:40px;
	line-height: 1.1em;
}

.header-box-l p{
	font-size:16px;
	margin-top:30px;
	font-weight: 500;
	margin-bottom:50px;
}

.header-btn{
	width:240px;
	height:60px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size:15px;
	font-weight: 700;
	background:#CCFE5B;
	background:#a6f83d;
	border-radius: 100px;
	flex-shrink: 0;
	position: relative;
	cursor: pointer;
}

.btn-pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;

  outline: 3px solid #86ea08;
  opacity: 0.7;

  transform: scale(1);
  animation: pulse-outline 2s ease-out infinite;

  pointer-events: none;
}

@keyframes pulse-outline {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }

  70% {
    transform: scale(1.3);
    opacity: 0;
  }

  100% {
    transform: scale(1.3);
    opacity: 0;
  }
}

.header-btn-wrap{
	display: flex;
	align-items: center;
	gap:20px;
}
.header-btn-info{
	color:#aaa;
	font-size:14px;
	text-align: center;
	line-height: 1.2em;
}
.header-btn-info span{
	color:#000;
	font-weight: 600;
}

.header-phone{
	width:288px;
	height:585px;
	position: relative;
	border-radius:50px;
	overflow: hidden;
}
.header-phone-img{
	position:absolute;
	left:10px;
	top:10px;
	right:10px;
	bottom:10px;
	z-index:1;
	background:url(../img/phone-img-3.jpg) center 40px no-repeat #fff;
	background-size:cover;
}
.header-phone-video{
	position:absolute;
	left:10px;
	top:10px;
	right:10px;
	bottom:10px;
	z-index:2;
}
.header-phone-video video{
	object-fit: cover;
	width: 100%;
     height: 100%;
}

.header-phone-tel{
	position:absolute;
	left:0;
	top:0;
	right: 0;
	bottom:0;
	z-index:3;
	background:url(../img/phone.webp) center center no-repeat;
	background-size:contain;
}

.header-trigs{
	display: flex;
	gap:20px;
	margin-top:60px;
}
.header-trig{
	background:#fff;
	padding:40px 20px;
	flex: 0 0 calc((100% - 3 * 20px) / 4);
	border-radius:20px;
	text-align: center;
}
.header-trig-h{
	font-size:35px;
	font-weight: 600;
}
.header-trig-d{
	font-weight: 500;
	color:#808080;
	
}
.header-trig-h-star{
	display: flex;
	align-items: center;
	justify-content: center;
	gap:10px;
}
.header-trig-h-star div{
	width:30px;
	height:30px;
	background:url(../img/star.svg) center center no-repeat;
	background-size:contain;
	position: relative;
	top:3px;
}

.marquee-container{
	overflow-x: hidden;
     display: flex;
     flex-direction: row;
     position: relative;
	width:100%;
	transform:none;
	margin-top:40px;
}
.marquee{
	flex: 0 0 auto;
	min-width:auto;
	z-index: 1;
     display: flex;
     flex-direction: row;
     align-items: center;
	animation: scroll 22s linear 0s infinite;
     animation-play-state: running;
     animation-delay: 0s;
     animation-direction: normal;
}
.marquee-child{
	flex: 0 0 auto;
     display: flex;
     min-width: auto;
     flex-direction: row;
     align-items: center;
	object-fit: contain;
	
}
.marquee-child svg{
	height:80px;
}


@keyframes scroll {
	0% {
     	transform: translateX(0%);
	}
	100% {
		transform: translateX(-100%);
	}
}

.video-trig{
	background:#333;
	border-radius: 40px;
	text-align: center;
	padding:200px 20px;
	margin-top:70px;
	margin-bottom:50px;
	position: relative;

	overflow: hidden;
}

.video-trig-img{
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	z-index:1;
	background:url(../img/phone-img-4.jpg) center center no-repeat;
	background-size:cover;
}
.video-trig-video{
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	z-index:2;
}
.video-trig-video video{
	object-fit: cover;
	width: 100%;
     height: 100%;
}
.video-trig-shadow{
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	z-index:3;
	background:#333;
	opacity:0.5;
}
.video-trig-content{
	position:relative;
	z-index:4;
}




.video-trig-h{
	text-transform: uppercase;
	color:#fff;
	opacity:0.5;
	font-size:16px;
	font-weight: 600;
}
.video-trig-d{
	font-size:35px;
	color:#fff;
	font-weight: 700;
	line-height: 1.2em;
	margin-top:20px;
}

.big-trigs{
	margin-top:20px;
	display: grid;
	gap:20px;
	grid-template-columns: 1fr .8fr;
	width:100%;
}
.big-trigs-2{
	grid-template-columns: .8fr 1fr;
}
.big-trig{
	background:#F4F4F4;
	padding:40px 60px;
	border-radius:40px;
	max-height:480px;
	overflow: hidden;
}
.big-trig-h{
	font-size:28px;
	font-weight: 600;
	line-height: 1.2em;
}
.big-trig-d{
	font-size:18px;
	opacity:0.7;
	font-weight: 500;
	margin-top:20px;
}

.big-trig-grid{
	display: grid;
	grid-template-columns: minmax(14rem, 1fr) 1.1fr;
	gap:20px;
}
.big-trig-grid-l{
	position: relative;
}


.big-trig-phone{
	width:100%;
	aspect-ratio: 1/2.02;
	position: relative;
	border-radius:55px;
	overflow: hidden;
}
.big-trig-phone-img{
	position:absolute;
	left:10px;
	top:10px;
	right:10px;
	bottom:10px;
	z-index:1;
	background:url(../img/phone-img.webp) center center no-repeat;
	background-size:cover;
}
.big-trig-phone-video{
	position:absolute;
	left:15px;
	top:15px;
	right:15px;
	bottom:15px;
	z-index:2;
}
.big-trig-phone-video video{
	object-fit: cover;
	width: 100%;
     height: 100%;
}
.big-trig-phone-tel{
	position:absolute;
	left:0;
	top:0;
	right: 0;
	bottom:0;
	z-index:3;
	background:url(../img/phone.webp) center center no-repeat;
	background-size:contain;
}


/*
.big-trig-grid-l img{
	width:100%;
}*/
.big-trig-grid-r{
	padding-top:20px;
	padding-left:20px;
}
.big-trig-box{
	background:#fff;
	padding:40px;
	border-radius:20px;
	box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
	max-width:500px;
	margin:0 auto;
	margin-bottom:40px;
}
.big-trig-box-h{
	font-size:20px;
	font-weight: 700;
}
.big-trig-box img{
	width:100%;
	margin-top:20px;
}

.big-trigs-2 .big-trig-box{
	margin-top:40px;
	margin-bottom:0;
	padding:10px 40px;
	padding-bottom:30px;
}

.big-cta{
	padding:100px 0;
	background: #eee;
	margin-top:50px;
	min-height:600px;
	padding-bottom:0;
}
.big-cta-h{
	font-size:40px;
	max-width:700px;
	line-height:1.2em;
	font-weight: 600;
	margin-bottom:30px;
}

.big-cta-2{
	margin-top:0;
	background:url(../img/cta-2.webp) center bottom no-repeat #eee;
	background-size:auto 80%;
}

.big-cta-flex{
	display: flex;
	gap:20px;
	justify-content: space-between;
}
.big-cta-flex-l{
	width:100%;
}
.big-cta-flex img{
	width:100%;
	max-width:100%;
}


.big-cards{
	background:#000;
	padding:100px 0;
}
.big-cards-h{
	text-transform: uppercase;
	color:#fff;
	opacity:0.5;
	font-size:16px;
	font-weight: 600;
}
.big-cards-d{
	font-size:35px;
	color:#fff;
	font-weight: 700;
	line-height: 1.2em;
	margin-top:10px;
	max-width:1000px;
}

.cards{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap:20px;
	margin-top:50px;
}
.card{
	background:#fff;
	padding:20px;
	border-radius: 20px;
	padding-bottom:40px;
}
.card-h{
	font-weight: 600;
	font-size:18px;
}
.card-d{
	margin-top:10px;
	line-height: 1.2em;
}
.card img{
	width:100%;
	margin-bottom:20px;
}

.faqs{
	padding:100px 0;
}
.faqs-h{
	font-size:35px;
	font-weight: 700;
	line-height: 1.2em;
	text-align: center;
	margin-bottom:40px;
}

.faq{
	padding:30px;
	border-radius:40px;
	background:#f4f4f4;
	max-width:1100px;
	margin:auto;
	cursor: pointer;
	user-select: none;
	margin-top:10px;
}
.faq-flex{
	display: flex;
	gap:20px;
}
.faq-h{
	font-size:18px;
	font-weight: 600;
	width:100%;
	line-height: 1.2em;
}
.faq-ic{
	width:30px;
	height:30px;
	background:url(../img/arr.svg) center center no-repeat;
	background-size:contain;
	flex-shrink: 0;
	transition: 0.2s;
}
.faq-a{
	overflow: hidden;
	height:1px;
	transition: 0.2s;
	opacity:0;
	font-weight: 500;
}
.faq-on .faq-a{
	height:auto;
	opacity:0.5;
	padding-top:20px;
	padding-bottom:10px;
}
.faq-on .faq-ic{
	transform: rotate(180deg);
}


.footer{
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius:30px;
	margin-top:20px;
	margin-bottom:20px;
}
.footer-logo{
	width:160px;
	height:48px;
	background:url(../img/logo.png) left center no-repeat;
	background-size:auto 100%;
	flex-shrink: 0;
}
.footer-r{
	text-align: right;
	line-height: 1em;
}
.footer-info{
	font-size:12px;
	font-weight:500;
	color:#999;
}
.footer-links a, .footer-links span{
	font-size:12px;
	font-weight:500;
	color:#999;
	margin-left:7px;
	text-decoration: none;
	cursor: pointer;
}


@media (max-width: 1370px){
	.big-trig{
		max-height:100%;
	}
}

@media (max-width: 1200px){
	.big-trigs{
		grid-template-columns: 1fr;
	}
	.big-trig-grid{
		display: flex;
		flex-wrap: wrap;
		flex-direction: column-reverse;
		align-items: center;
	}
	.big-trig-grid-l{
		flex-shrink: 0;
		width:100%;
		max-width:288px;
		margin-top:20px;
	}
}

@media (max-width: 1060px){
	.top-menu-links .top-menu-link{
		display: none;
	}
	.video-trig{
		padding:100px 20px;
	}
}

@media (max-width: 990px){
	.header-trigs{
		flex-wrap: wrap;
	}
	.header-trig{
		    flex: 0 0 calc((100% - 1 * 20px) / 2);
	}
	.cards{
		display: flex;
		flex-wrap: wrap;
	}
	.card{
		flex: 0 0 calc((100% - 1 * 20px) / 2);
	}
}

@media (max-width: 860px){
	.header-box{
		flex-wrap: wrap;
	}
	.header-box-l{
		flex: 0 0 100%;
	}
	.header-box-r{
		flex: 0 0 100%;
		margin-top:40px;
	}
}

@media (max-width: 650px){
	.top-menu{
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		height:auto;
		max-width:100%;
		padding:0 10px;
		padding-bottom:10px;
		border-radius:30px;

	}
	.top-menu-logo{
		background-position: center center;
	}
	.top-menu-logo{
		width:100%;
		margin-bottom:10px;
	}
	.top-menu-btn {
		width: 170px;
		height: 40px;
		font-size: 15px;
		font-weight: 700;
		background: #a6f83d;
		margin-left: 10px;
	}
	.big-trig {
		padding:30px;
	}
	.card{
		flex: 0 0 100%;
	}
	.big-cta-flex{
		flex-wrap: wrap;
	}
	.big-cta-h{
		font-size:30px;
	}
}

@media (max-width: 550px){
	.header-btn-wrap{
		flex-wrap: wrap;
	}
	.header-btn-info{
		width:100%;
		max-width:240px;
	}
}

@media (max-width: 450px){
	.header-trig{
		    flex: 0 0 100%;
	}
	h1{
		font-size:30px;
	}
	.video-trig-d{
		font-size:25px;
	}
	.big-cards-d{
		font-size:25px;
	}
}