#header .login svg {
	filter: brightness(50);
}

#banner {
	background-color: var(--branco);
	background-image: url(../../tecnologia/home/banner-bg.webp);
	background-repeat: no-repeat;
	background-size: 22.968vw;
	background-position: left bottom;
	padding: 11vw 0 10vw;
	position: relative;
	overflow-x: hidden;
}

#banner::before {
	content: ' ';
	display: block;
	height: 760px;
	max-height: 39.583vw;
	width: 47%;
	background-color: var(--roxo);
	clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);
	position: absolute;
	right: 0;
	top: 0;
}

#banner .btn-contato {
	color: var(--branco);
	font-size: 0.7291vw;
	background-color: var(--roxo);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	display: block;
	padding: 0.59895vw 1.1458vw;
	font-weight: 700;
	overflow: hidden;
	position: relative;
	transition: var(--transicao);
	-webkit-transition: var(--transicao);
	-moz-transition: var(--transicao);
	-ms-transition: var(--transicao);
	-o-transition: var(--transicao);
	max-width: 294px;
}

#banner .btn-contato svg {
	filter: brightness(10);
}

#banner .esq {
	width: 45%;
	position: relative;
}

#banner .esq::before {
	content: ' ';
	display: block;
	width: 36.77083vw;
	height: 40.72916vw;
	background-image: url(../../tecnologia/home/banner-imagem.webp);
	position: absolute;
	background-size: cover;
	top: -6vw;
	right: -25vw;
}

#banner .titulo {
	color: var(--roxo);
	font-weight: 700;
	font-size: 2.5vw;
	line-height: 2.9166vw;
}

#banner .texto {
	color: #26276C;
	font-size: 0.9375vw;
	line-height: 1.4583vw;
	letter-spacing: 0.01em;
	max-width: 586px;
	margin: 1.8vw 0;
}

#banner .container {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
}

#banner .dir {
	width: 40%;
	position: relative;
	max-width: 374px;
	padding-top: 13vw;
}

#banner .before-banner {
	width: 43.7604vw;
	height: 29.218vw;
	position: absolute;
	right: 0;
	bottom: 7vw;
}

#banner .before-banner-mbl,
#banner .before-banner-mbl2 {
	display: none;
}

#banner .box {
	color: var(--branco);
	width: calc(50% - 1.5625vw);
}

#banner .box .num {
	font-weight: 800;
	font-size: 1.875vw;
	border-bottom: 0.94px solid #CDCDCD;
	padding-bottom: 5px;
	margin-bottom: 10px;
	text-align: center;
}

#banner .box .num .mais {
	color: #08A8F7;
	font-size: 1.354vw;
}

#banner .box .num .apoio {
	font-size: 1.25vw;
}

#banner .box .info {
	text-align: center;
	font-size: 14px;
}

#banner .blocos {
	display: flex;
	flex-wrap: wrap;
	gap: 3.125vw;
	margin-bottom: 30px;
	position: relative;
	z-index: 1;
}

#banner .social {
	position: absolute;
	left: -7.5vw;
	bottom: 0;
}

#banner .social a {
	margin-right: 5px;
}

#banner .social a:hover .quadrado {
	fill: var(--roxo);
}

#banner .social a:hover svg path {
	fill: var(--branco);
}

#sistema {
	position: relative;
	padding: 5vw 0;
	background: #FAFBFF;
	background: linear-gradient(0deg, rgba(250, 251, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

#sistema::before {
	content: ' ';
	display: block;
	height: calc(100% - 10vw);
	width: 86.5%;
	background-color: #1E1E24;
	border-radius: 0 30px 30px 0;
	-webkit-border-radius: 0 30px 30px 0;
	-moz-border-radius: 0 30px 30px 0;
	-ms-border-radius: 0 30px 30px 0;
	-o-border-radius: 0 30px 30px 0;
	position: absolute;
	top: 5vw;
	left: 0;
	box-shadow: 0px 10px 10px 10px #0000001A;
	background-image: url(../../tecnologia/home/sistemas-bg.webp);
	background-repeat: no-repeat;
	background-position: left bottom;
}

#sistema .container {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: 0 4.7916vw;
}

#sistema .container::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: 9px;
	right: -5vw;
}

#sistema .container::before {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	bottom: 9px;
	right: -5vw;
}

#sistema .esq {
	width: 39.2%;
	background-color: var(--branco);
	padding: 3.125vw 2.93vw;
	position: relative;
}

#sistema .esq::before {
	content: ' ';
	display: block;
	width: 100%;
	height: calc(100% + 5vw);
	position: absolute;
	top: -1.5vw;
	left: 0;
	background-color: var(--branco);
	z-index: -1;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px;
	box-shadow: 0px -5px 10px 0px #00000026;
}

#sistema .esq::after {
	content: url(../../tecnologia/triangulos.png);
	position: absolute;
	bottom: -1.291vw;
	right: 2.291vw;
}


#sistema .titulo {
	font-weight: 800;
	font-size: 1.6666vw;
	line-height: 2.083333vw;
	margin-top: 20px;
}

#sistema .texto {
	font-weight: 500;
	font-size: 0.833vw;
	line-height: 1.3541vw;
	color: #171C24;
	margin-top: 20px;
}

#sistema .dir {
	width: 54%;
	color: var(--branco);
	padding: 4.27vw 0;
}

#sistema .tit {
	font-weight: 700;
	font-size: 0.833vw;
	line-height: 1.3541vw;
	margin: 6px 0;
}

#sistema .info {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #B5B5B5;
}

#sistema .blocos {
	display: flex;
	flex-wrap: wrap;
	gap: 3.125vw;
	row-gap: 2.5vw;
}

#sistema .box {
	width: calc(50% - 1.5625vw);
}

#solucoes {
	padding: 2vw 0;
	position: relative;
	background-color: #fafbff;
}

#solucoes .titulo {
	font-weight: 300;
	font-size: 1.875vw;
	line-height: 2.5vw;
	text-align: center;
	margin-bottom: 15px;
}

#solucoes .titulo span {
	font-weight: 700;
	color: var(--roxo);
}

#solucoes .texto {
	font-weight: 500;
	font-size: 0.833vw;
	line-height: 1.3541vw;
	text-align: center;
	max-width: 1047px;
	margin: 0 auto;
}

#solucoes .tit {
	font-size: 1.45833vw;
	line-height: 1.875vw;
	color: var(--roxo);
	margin-bottom: 15px;
}

#solucoes .info {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

#solucoes .blocos {
	display: flex;
	flex-wrap: wrap;
	gap: 25px;
	row-gap: 50px;
	margin-top: 40px;
	position: relative;
	justify-content: center;
}

#solucoes .blocos::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: 55%;
	right: -5vw;
}

#solucoes::before {
	content: ' ';
	display: block;
	width: 17.2395vw;
	height: 22.4479vw;
	background-image: url(../../tecnologia/home/solucoes-detalhe.webp);
	background-size: cover;
	position: absolute;
	top: 22vw;
	left: 0;
}

#solucoes .container {
	position: relative;
}

#solucoes .antes {
	width: 4.427vw;
	height: 5.156vw;
	position: absolute;
	top: -1vw;
	left: 8vw;
}

#solucoes .depois {
	width: 4.427vw;
	height: 5.156vw;
	position: absolute;
	top: 0;
	right: 8vw;
}

#solucoes .box {
	background-color: #eceff6;
	border: 1px solid #D7D7D7;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px;
	padding: 3.3333vw 2.8645vw;
	width: calc(50% - 12.5px);
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 17.697vw;
	transition: var(--transicao);
	-webkit-transition: var(--transicao);
	-moz-transition: var(--transicao);
	-ms-transition: var(--transicao);
	-o-transition: var(--transicao);
}

#solucoes .box:hover {
	box-shadow: 0px 5px 10px 0px #00000040;
}

#solucoes .btn {
	color: var(--branco);
	font-size: 0.7291vw;
	background-color: var(--chumbo);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	display: block;
	padding: 0.59895vw 1.1458vw;
	font-weight: 700;
	overflow: hidden;
	position: relative;
	transition: var(--transicao);
	-webkit-transition: var(--transicao);
	-moz-transition: var(--transicao);
	-ms-transition: var(--transicao);
	-o-transition: var(--transicao);
	position: absolute;
	width: calc(100% - 5.729vw);
	left: 2.8645vw;
	bottom: -19px;
}

#solucoes .btn.animacao-btn::before,
#solucoes .btn.animacao-btn::after {
	background: var(--roxo);
}

#solucoes .btn.animacao-btn span {
	justify-content: space-between;
}

#solucoes .ico {
	position: absolute;
	top: 2.343vw;
	right: 2.343vw;
}

#certificado {
	padding: 5vw 0;
	position: relative;
	background-color: #fafbff;
}

#certificado .titulo {
	color: var(--roxo);
	font-weight: 700;
	font-size: 1.875vw;
	line-height: 2.5vw;
	margin-bottom: 15px;
}

#certificado .texto {
	font-weight: 500;
	font-size: 0.833vw;
	line-height: 1.3541vw;
}

#certificado .esq {
	width: 50%;
	position: relative;
}

#certificado .esq::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: 40px;
	left: -5vw;
}

#certificado .dir {
	width: 45%;
}

#certificado .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#depoimentos {
	padding: 5vw 0;
	position: relative;
	background-color: #fafbff;
}

#depoimentos .container {
	position: relative;
	display: flex;
	justify-content: space-between;
}

#depoimentos .container::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: -40px;
	right: -5vw;
}

#depoimentos .container::before {
	content: ' ';
	display: block;
	background-color: var(--roxo);
	width: 68.5%;
	height: calc(100% + 58px);
	position: absolute;
	left: 0;
	top: -58px;
	border-radius: 60px 10px 10px 10px;
	-webkit-border-radius: 60px 10px 10px 10px;
	-moz-border-radius: 60px 10px 10px 10px;
	-ms-border-radius: 60px 10px 10px 10px;
	-o-border-radius: 60px 10px 10px 10px;
	background-image: url(../../tecnologia/home/circulo-depo.png);
	background-repeat: no-repeat;
	background-position: right top;
}

#depoimentos .esq {
	position: relative;
	width: 28%;
	padding-left: 5.729vw;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

#depoimentos .titulo {
	color: var(--branco);
	font-weight: 200;
	font-size: 2.246vw;
	line-height: 2.99479vw;
	text-align: right;
}

#depoimentos .swiper-button-next:after,
#depoimentos .swiper-button-prev:after {
	filter: grayscale(1) brightness(10);
	-webkit-filter: grayscale(1) brightness(10);
}

#depoimentos .dir {
	width: 67.5%;
	background-color: var(--branco);
	position: relative;
	padding: 5.8333vw 6.27vw 4.791vw;
	border-radius: 10px 10px 0 0;
	box-shadow: 10px 10px 10px 0px #0000000D;
	backdrop-filter: blur(10px);
}

#depoimentos .dir::before {
	content: ' ';
	display: block;
	width: 100%;
	height: 58px;
	background-color: var(--roxo);
	position: absolute;
	left: 0;
	bottom: -58px;
	border-radius: 0 0 60px 10px;
	box-shadow: 10px 10px 10px 0px #0000000D;
}

#depoimentos .navigation {
	position: relative;
	width: 86px;
	height: 30px;
	margin-top: 40px;
	margin-right: -18px;
}

#depoimentos .texto {
	font-weight: 500;
	font-size: 1.25vw;
	line-height: 1.875vw;
	margin-bottom: 2vw;
}

#depoimentos .dados-depo {
	font-weight: 700;
	font-size: 16px;
}

#depoimentos .antes {
	position: absolute;
	top: 5vw;
	left: 4vw;
}

#depoimentos .depois {
	position: absolute;
	top: 10vw;
	right: 4vw;
}

#cases {
	padding: 5vw 0;
	position: relative;
	background-color: #fafbff;
	overflow-x: hidden;
	background-image: url(../../tecnologia/home/cases-bg.webp);
	background-repeat: no-repeat;
	background-position: right center;
}

#cases::before {
	content: 'cases';
	position: absolute;
	left: 1.8%;
	top: -4vw;
	font-size: 14.0625vw;
	line-height: 14.0625vw;
	opacity: 5%;
	font-weight: 700;
}

#cases .container {
	position: relative;
}

#cases .container::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: 57%;
	left: -5vw;
}

#cases .titulo {
	font-size: 2.246vw;
	line-height: 2.99479vw;
	font-weight: 700;
	max-width: 900px;
	margin-bottom: 30px;
}

#cases .titulo span {
	color: var(--roxo);
}

#cases .texto {
	font-weight: 500;
	font-size: 0.833vw;
	line-height: 1.3541vw;
	color: var(--preto);
}

#cases .titulo-case {
	color: var(--roxo);
	font-weight: 700;
	font-size: 1.4583vw;
	line-height: 1.875vw;
}

#cases .box_case {
	display: block;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	box-shadow: 0px 10px 10px 0px #00000033;
	overflow: hidden;
}

#cases .logo {
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 512px;
	background-size: cover;
	background-color: black;
	background-blend-mode: luminosity;
	position: relative;
}

#cases .logo .filter {
	width: 100%;
	height: 100%;
	background: #00000080;
	position: absolute;
	top: 0;
	left: 0;
}

#cases .text {
	width: 50%;
	background-color: #EDEFF7;
	padding: 3.125vw 4.5833vw 3.125vw 3.125vw;
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
}

#cases .content {
	display: flex;
	align-items: stretch;
}

#cases .content .texto {
	margin: 40px 0;
}

#cases .btn {
	color: var(--branco);
	font-size: 0.7291vw;
	background-color: var(--chumbo);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	display: block;
	padding: 0.59895vw 1.1458vw;
	font-weight: 700;
	overflow: hidden;
	position: relative;
	transition: var(--transicao);
	-webkit-transition: var(--transicao);
	-moz-transition: var(--transicao);
	-ms-transition: var(--transicao);
	-o-transition: var(--transicao);
}

#cases .btn.animacao-btn::before,
#cases .btn.animacao-btn::after {
	background: var(--roxo);
}

#cases .btn.animacao-btn span {
	justify-content: space-between;
}

#cases .logo_case {
	max-width: 250px;
	position: relative;
	z-index: 1;
}

#cases .navigation {
	position: relative;
	width: 86px;
	height: 30px;
	margin-right: -18px;
}

#cases .cases_container {
	padding: 60px 18.5vw 40px 0;
	overflow: visible;
}

#blog {
	padding: 0 0 160px 0;
	overflow: hidden;
	position: relative;
	background-color: #fafbff;
}

#blog .container_loop_blog::after {
	content: url(../../tecnologia/triangulos.png);
	transform: rotate(90deg);
	position: absolute;
	top: 50%;
	left: -5vw;
}

#blog .top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 20px;
}

#blog .top .titulo {
	font-weight: 700;
	font-size: 2.1875vw;
	line-height: 2.875vw;
	width: 100%;
}

#blog .top .dir {
	width: 315px;
	max-width: 682px;
}

#blog .btn {
	color: var(--branco);
	font-size: 0.7291vw;
	background-color: var(--chumbo);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	display: block;
	padding: 0.59895vw 1.1458vw;
	font-weight: 700;
	overflow: hidden;
	position: relative;
	transition: var(--transicao);
	-webkit-transition: var(--transicao);
	-moz-transition: var(--transicao);
	-ms-transition: var(--transicao);
	-o-transition: var(--transicao);
}

#blog .btn.animacao-btn::before,
#blog .btn.animacao-btn::after {
	background: var(--roxo);
}

#blog .btn.animacao-btn span {
	justify-content: space-between;
}

#blog .top .texto.destaque {
	font-weight: 700;
	margin: 0 0 30px 0;
}

#blog .top .texto a {
	color: var(--roxo);
	font-weight: 700;
	font-size: 1.125rem;
	line-height: 2rem;
	letter-spacing: 0.01rem;
	transition: var(--transicao);
}

#blog .bottom {
	padding: 30px 0;
}

#blog .bottom .box {
	border-radius: 20px;
	background-color: var(--branco);
	width: 460px;
}

#blog .container_loop_blog {
	width: 90%;
	max-width: 1366px;
	margin: 0 auto;
	position: relative;
}

#blog .container_loop_blog .swiper {
	width: 100%;
	overflow: visible;
}

#blog .box {
	box-shadow: 0px 0px 20px 0px #00000040;
}


#blog .box .categoria {
	display: block;
	font-size: 12px;
	background-color: var(--chumbo);
	color: var(--branco);
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	padding: 13px 19px;
	position: absolute;
	left: 30px;
	top: -18px;
	overflow: hidden;
}

#blog .box .categoria.animacao-btn::before,
#blog .box .categoria.animacao-btn::after {
	background: var(--roxo);
}

#blog .box .imagem {
	height: 283px;
}

#blog .box .imagem img {
	line-height: 0;
	border-radius: 20px 20px 0 0;
	-webkit-border-radius: 20px 20px 0 0;
	-moz-border-radius: 20px 20px 0 0;
	-ms-border-radius: 20px 20px 0 0;
	-o-border-radius: 20px 20px 0 0;
	width: 100%;
	object-fit: cover;
	max-height: 283px;
}

#blog .box .conteudo-bottom {
	padding: 50px 38px 40px 38px;
	position: relative;
}

#blog .box .conteudo-bottom .titulo {
	font-weight: 700;
	font-size: 18px;
	line-height: 25px;
	color: var(--preto);
	margin: 0 0 25px 0;
	transition: var(--transicao);
}

#blog .box .conteudo-bottom .texto {
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 0.01rem;
}

#blog .box .conteudo-bottom .data {
	font-weight: 400;
	font-size: 12px;
}

#blog .box:hover .conteudo-bottom .titulo {
	color: var(--roxo);
}

#blog .box .data_post {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 20px 0 0;
}

#blog .box .data_post .esq {
	display: flex;
	align-items: center;
	gap: 12px;
}

#blog .box .data_post .esq .icone {
	display: flex;
	align-items: center;
}

#blog .bottom .box .btn_post svg path {
	transition: var(--transicao);
}

#blog .bottom .box:hover .btn_post svg path {
	fill: var(--roxo);
}

#blog .swiper-slide {
	height: auto;
}

#blog .btn.mbl {
	display: none;
}

@media screen and (max-width: 1600px) {

	#banner .btn-contato,
	#solucoes .btn {
		font-size: 14px;
	}

	#sistema::before {
		width: 90.5%;
	}

	#banner::before {
		width: 49%;
	}
}

@media screen and (max-width: 1440px) {

	#banner .texto,
	#sistema .texto,
	#solucoes .texto,
	#certificado .texto,
	#cases .texto {
		font-size: 14px;
		line-height: 22px;
	}

	#sistema .container::after,
	#sistema .container::before,
	#solucoes .blocos::after,
	#depoimentos .container::after {
		right: -4%;
	}

	#certificado .esq::after,
	#cases .container::after {
		left: -4vw;
	}

	#banner .btn-contato,
	#solucoes .btn,
	#cases .btn,
	#blog .btn {
		font-size: 13px;
		padding: 10px 15px;
	}

	#banner {
		padding: 11vw 0 7vw;
	}

	#banner::before {
		max-height: 42.583vw;
		width: 49%;
	}

	#sistema .tit {
		font-size: 15px;
		line-height: 23px;
	}

	#sistema::before {
		width: 95%;
	}

	#depoimentos .antes {
		top: 4vw;
		left: 3vw;
	}

	#depoimentos .depois {
		top: 13vw;
		right: 3vw;
	}

	#depoimentos .dir {
		padding: 6.8333vw 6.27vw 5.791vw;
	}

	#cases .cases_container {
		padding: 60px 26.5vw 40px 0;
	}

	#blog {
		padding: 0 0 120px 0;
	}


}

@media screen and (max-width: 1366px) {
	#certificado .dir {
		width: 43%;
	}

	#cases .logo {
		height: 470px;
	}

	#banner .before-banner {
		width: 44.7604vw;
		height: 30.218vw;
		bottom: 9vw;
	}

}

@media screen and (max-width: 1024px) {
	#banner .titulo {
		font-size: 33px;
		line-height: 42px;
	}

	#banner .texto {
		font-size: 18px;
		line-height: 28px;
		margin: 20px 0;
	}

	#banner .esq {
		order: 1;
		width: 100%;
	}

	#banner .social {
		order: 2;
		position: relative;
		display: flex;
		justify-content: flex-end;
		width: 100%;
		left: auto;
		padding: 30px 0;
	}

	#banner .dir {
		order: 3;
		width: 100%;
		max-width: 100%;
		padding-top: 150px;
		margin-top: 80px;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
	}

	#banner .dir::after {
		background: linear-gradient(180deg, #FAFBFF 0%, #8303FF 18.15%);
		content: ' ';
		display: block;
		height: 100%;
		width: calc(100% + 12%);
		position: absolute;
		left: -6%;
		bottom: 0;
	}

	#banner .before-banner {
		display: none;
	}

	#banner .before-banner-mbl {
		display: block;
		width: 73.5104vw;
		height: 73.463vw;
		position: absolute;
		bottom: 6vw;
		right: calc(-5% - 9vw);
		z-index: 1;
	}


	#banner .container {
		flex-direction: column;
	}

	#banner {
		padding: 150px 0 80px;
	}

	#banner .blocos {
		gap: 30px;
		flex-direction: column;
		align-items: flex-end;
		padding-right: 40px;
		z-index: 1;
	}

	#banner::before {
		max-height: 150px;
		width: 100%;
		clip-path: none;
		top: auto;
		bottom: 0;
		background: #fff;
		z-index: 1;
	}

	#banner .esq::before {
		width: 55.77083vw;
		height: 61.72916vw;
		top: auto;
		bottom: calc(-100% - 32vw);
		right: auto;
		left: -17vw;
		z-index: 1;
	}

	#banner .dir img {
		position: relative;
		z-index: 1;
	}

	#banner .box .num {
		font-size: 36px;
	}

	#banner .box .num .apoio {
		font-size: 24px;
	}

	#banner .box {
		width: 100%;
	}

	#banner .box .num .mais {
		font-size: 26px;
	}

	#sistema .container {
		padding: 0;
		flex-direction: column;
	}

	#sistema .esq {
		width: 95%;
		padding: 40px 30px;
	}

	#sistema .esq::before {
		height: calc(100% + 50px);
		top: -20px;
	}

	#sistema .titulo,
	#solucoes .titulo,
	#certificado .titulo,
	#depoimentos .titulo,
	#cases .titulo,
	#blog .top .titulo {
		font-size: 28px;
		line-height: 36px;
	}

	#sistema .texto,
	#solucoes .texto,
	#certificado .texto,
	#cases .texto {
		font-size: 16px;
		line-height: 24px;
	}

	#sistema .container::after,
	#sistema .container::before,
	#solucoes .blocos::after,
	#depoimentos .container::after {
		right: -6%;
	}

	#sistema .dir {
		width: 95%;
		padding: 100px 0 60px;
	}

	#certificado .esq::after,
	#cases .container::after {
		left: -5vw;
	}

	#solucoes .antes,
	#solucoes .depois {
		display: none;
	}

	#sistema {
		padding: 30px 0 80px;
	}

	#solucoes {
		padding: 50px 0;
	}

	#solucoes .tit {
		font-size: 24px;
		line-height: 28px;
	}

	#solucoes .blocos {
		gap: 20px;
		row-gap: 50px;
	}

	#solucoes .box {
		padding: 60px 30px;
		width: calc(50% - 10px);
		min-height: auto;
	}

	#solucoes::before {
		content: none;
	}

	#certificado {
		padding: 60px 0;
	}

	#certificado .container {
		flex-direction: column;
	}

	#certificado .esq {
		width: 100%;
	}

	#certificado .dir {
		width: 60%;
		margin-top: 30px;
	}

	#depoimentos .container {
		flex-direction: column;
	}

	#depoimentos .esq {
		width: 100%;
		align-items: flex-start;
		margin-bottom: 30px;
	}

	#depoimentos .navigation {
		margin-top: 20px;
		margin-right: 0;
		margin-left: -18px;
	}

	#depoimentos .container::before {
		width: 100%;
	}

	#depoimentos {
		padding: 80px 0;
	}

	#depoimentos .dir {
		width: 95%;
		padding: 40px 45px;
	}

	#depoimentos .texto {
		font-size: 16px;
		line-height: 28px;
		margin-bottom: 30px;
	}

	#depoimentos .antes,
	#depoimentos .depois {
		scale: 0.8;
	}

	#depoimentos .antes {
		top: 15px;
		left: 15px;
	}

	#depoimentos .depois {
		top: auto;
		bottom: 15px;
		right: 15px;
	}

	#depoimentos .dir::before {
		height: 40px;
		bottom: -40px;
	}

	#cases .cases_container {
		padding: 50px 0;
	}

	#cases .titulo-case {
		font-size: 24px;
		line-height: 28px;
	}

	#cases .logo {
		height: 57vw;
	}

	#cases {
		padding: 100px 0;
	}

	#blog .top {
		flex-direction: column;
		align-items: flex-start;
		gap: 30px;
	}

	#cases::before {
		top: 50px;
	}

	#blog {
		padding: 0 0 60px 0;
	}

	#blog .btn.mbl {
		display: block;
	}

	#blog .desk {
		display: none;
	}

}

@media screen and (max-width: 768px) {
	#banner .esq::before {
		bottom: calc(-100% - 30vw);
	}

	#banner .before-banner-mbl {
		height: 81.463vw;
		right: calc(-5% - 5vw);
		bottom: 10vw;
	}
}

@media screen and (max-width: 600px) {

	#sistema .texto,
	#solucoes .texto,
	#certificado .texto,
	#cases .texto {
		font-size: 14px;
		line-height: 22px;
	}


	#solucoes .box {
		padding: 60px 20px;
		width: 100%;
	}

	#banner .blocos {
		padding-right: 10px;
	}

	#banner .before-banner-mbl {
		height: 98.463vw;
		width: 84.5104vw;
		bottom: 13vw;
	}

	#banner .esq::before {
		width: 62.77083vw;
		height: 69.72916vw;
		bottom: calc(-100% - 38vw);
	}

	#sistema {
		padding: 10px 0 80px;
	}

	#sistema .titulo,
	#solucoes .titulo,
	#certificado .titulo,
	#depoimentos .titulo,
	#cases .titulo,
	#blog .top .titulo {
		font-size: 26px;
		line-height: 34px;
	}

	#sistema .esq::after {
		bottom: -10px;
		right: 30px;
	}

	#sistema .box {
		width: 100%;
	}

	#sistema .blocos {
		row-gap: 40px;
	}

	#sistema .container::after,
	#sistema .container::before,
	#solucoes .blocos::after,
	#depoimentos .container::after {
		right: -7%;
		scale: 0.8;
	}

	#sistema::before {
		box-shadow: 0px -2px 10px 10px #0000001A;
	}

	#solucoes .titulo span {
		display: inline;
	}

	#solucoes .ico {
		top: 12px;
		right: 12px;
	}

	#certificado .esq::after,
	#cases .container::after {
		left: -7vw;
		scale: 0.8;
	}

	#certificado .dir {
		width: 100%;
	}

	#depoimentos .titulo {
		max-width: 90%;
	}

	#cases .content {
		flex-direction: column;
	}

	#cases .logo {
		height: 62vw;
		width: 100%;
	}

	#cases .text {
		width: 100%;
		padding: 40px 25px;
	}

	#cases .logo_case {
		max-height: 50vw;
		object-fit: contain;
	}

	#blog .bottom .box {
		width: 100%;
		max-width: 450px;
	}

	#blog .box .imagem {
		height: 54vw;
	}

	#blog .top .dir {
		width: 100%;
	}

	#cases::before {
		top: 79px;
		font-size: 27.0625vw;
		line-height: 10.0625vw;
	}

	#sistema .dir {
		padding: 100px 0 10px;
	}
}


@media screen and (max-width: 500px) {
	#banner .esq::before {
		bottom: calc(-100% - 22vw);
	}

	#blog .box .conteudo-bottom {
		padding: 50px 20px 30px 20px;
	}

	#banner .before-banner-mbl {
		display: none;
	}

	#banner .before-banner-mbl2 {
		display: block;
		width: 92vw;
		height: 128.2vw;
		position: absolute;
		bottom: 6vw;
		right: 0;
		z-index: 1;
	}

	#banner .dir img {
		z-index: 2;
	}
}


@media screen and (max-width: 450px) {

	#banner .esq::before {
		bottom: calc(-100% - -18vw);
	}

	#banner .dir {
		margin-top: 30px;
	}

	#banner .before-banner-mbl2 {
		width: 99vw;
		height: 142.2vw;
		bottom: 20vw;
	}
}


@media screen and (max-width: 380px) {
	#banner .esq::before {
		bottom: calc(-100% - -23vw);
	}

	#banner .before-banner-mbl2 {
		height: 158.2vw;
	}
}


@media screen and (max-width: 360px) {
	#banner .esq::before {
		bottom: calc(-100% - -34vw);
	}

	#banner .before-banner-mbl2 {
		height: 165.2vw;
	}
}


@media screen and (max-width: 330px) {
	#banner .esq::before {
		bottom: calc(-100% - -71vw);
		left: -30vw;
	}

	#banner .before-banner-mbl2 {
		width: 113vw;
		height: 183.2vw;
	}

}