html, body{
margin:0;
padding:0;
font-family: 'Sora', sans-serif;
background:#000;
color:#fff;
}
ul{
margin:0;
padding:0;
}
ul li{
padding:0;
margin:0;
list-style: none;
font-family: 'Sora', sans-serif;
}
img{
max-width: 100%;
height:auto;
border:0;
outline: 0;
}
body.over{
overflow: hidden;
}
button, input, a, select{
outline: 0 !important;
border:0;
text-decoration: none;
font-family: 'Sora', sans-serif;
}
a, span, p, h1, h2, h3, h4, h5, h6, small{
font-family: 'Sora', sans-serif !important;
}
a{
text-decoration:none;
font-family: 'Sora', sans-serif;
}
.container{
width:1140px;
max-width: 100%;
}
.js .anime {
opacity: 0;
transform: translate3D(0px, 80px, 0px);
}
.js .anime-init {
opacity: 1;
transform: translate3D(0px, 0px, 0px);
transition:1.5s all ease;
}
#topo{
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
background:url(imagens/bg_home.jpg);
background-size: cover;
background-position: center;
padding:50px 0 90px;
}
#topo .content-topo .logo{
margin:0 0 70px;
max-width: 190px;
}
#topo .content-topo h1{
text-align: left;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
color: #FFFFFF;
max-width: 625px;
margin: 0 0 50px;
}
#topo .content-topo h1 span, #topo .content-topo p span{
color:#F94501;
}
#topo .content-topo p{
text-align: left;
font: normal normal normal 18px/29px Sora;
letter-spacing: 0px;
color: #FFFFFF;
max-width: 430px;
margin:0 0 70px;
}
.btn-contato{
background: linear-gradient(90deg, rgba(255,118,0,1) 0%, rgba(255,58,0,1) 100%);
color: #fff;
font: normal normal bold 16px/25px Sora;
letter-spacing: 0px;
text-transform: uppercase;
height: 52px;
width: 386px;
transition: all 0.3s linear;
}
.btn-contato:hover{
color:#fff;
background: linear-gradient(-90deg, rgba(255,118,0,1) 0%, rgba(255,58,0,1) 100%);
box-shadow:0 0 35px rgba(255,58,0,0.6);
}
#contato{
background:url(imagens/bg_formulario.jpg);
background-size: cover;
background-position: center top;
padding:60px 0 100px;
}
#contato .text-contato h2{
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 500px;
margin: 0 auto 35px;
}
#contato .text-contato h2 span, #video-vendas h2 span{
color:#F94501;
}
#contato .text-contato p{
text-align: center;
font: normal normal normal 18px/26px Sora;
letter-spacing: 0px;
max-width: 470px;
margin: 0 auto 40px;
}
#contato .text-contato p strong{
font-weight: 700;
color:#F94501;
}
.form-contato input.error, .form-contato select.error{
border:1px solid red !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.865 3.00017L22.3912 19.5002C22.6674 19.9785 22.5035 20.5901 22.0252 20.8662C21.8732 20.954 21.7008 21.0002 21.5252 21.0002H2.47266C1.92037 21.0002 1.47266 20.5525 1.47266 20.0002C1.47266 19.8246 1.51886 19.6522 1.60663 19.5002L11.1329 3.00017C11.4091 2.52187 12.0206 2.358 12.4989 2.63414C12.651 2.72191 12.7772 2.84815 12.865 3.00017ZM4.20471 19.0002H19.7932L11.9989 5.50017L4.20471 19.0002ZM10.9989 16.0002H12.9989V18.0002H10.9989V16.0002ZM10.9989 9.00017H12.9989V14.0002H10.9989V9.00017Z' fill='rgba(250,1,1,1)'%3E%3C/path%3E%3C/svg%3E");
background-size:18px;
background-position: center right 15px;
background-repeat: no-repeat;
}
.form-contato input.error + small, .form-contato select.error + small, small.invalid{
color: red;
font-size: 12px;
margin-top: -10px;
display: block;
padding: 0 5px;
}
.form-area{
border:1px solid #F94501;
border-radius: 20px;
padding:34px 19px;
max-width: 520px;
margin:0 auto;
}
.form-contato input, .form-contato select{
width:100%;
height:52px;
padding:5px 15px;
font: normal normal normal 15px/19px Sora;
letter-spacing: 0px;
color: #333333;
margin-bottom: 18px;
background-color:#fff;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
}
.form-contato .btn-contato{
margin-top:10px;
}
.form-contato select{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center right 10px;
background-size: 22px;
}
#video-vendas{
padding:60px 0 60px;
}
#video-vendas h2{
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 700px;
margin: 0 auto 35px;
}
#video-vendas p{
text-align: center;
font: normal normal normal 18px/26px Sora;
letter-spacing: 0px;
max-width: 470px;
margin: 0 auto 30px;
position:relative;
padding-bottom: 20px;
}
#video-vendas p:after{
content:"";
width:90px;
height:1px;
background-color: #F9451D;
position: absolute;
left:50%;
bottom:0;
transform: translatex(-50%);
}
#video-vendas .video{
width:100%;
max-width: 700px;
margin:0 auto 60px;
}
#agencia{
padding:60px 0;
background:url(imagens/grafico.png);
background-size: cover;
background-position: center top -130px;
background-blend-mode: screen;
}
#agencia h2{
position:relative;
padding-bottom: 25px;
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 700px;
margin: 0 auto 25px;
}
#agencia h2:after{
content:"";
width:90px;
height:1px;
background-color: #F9451D;
position: absolute;
left:50%;
bottom:0;
transform: translatex(-50%);
}
#agencia p{
text-align: center;
font: normal normal normal 18px/26px Sora;
letter-spacing: 0px;
margin: 0 auto 20px;
position:relative;
}
#agencia h2 span, #agencia p span{
color:#F94501;
}
#agencia .dados .dado{
width:30%;
}
#agencia .dados .dado h1{
text-align: center;
font: normal normal bold 70px/70px Sora;
letter-spacing: 0px;
color: #F94501;
}
#agencia .dados .dado p{
text-align: center;
font: normal normal normal 18px/25px Sora;
letter-spacing: 0px;
color: #FFFFFF;
}
#agencia .dados{
padding: 100px 0 40px;
max-width: 960px;
margin:0 auto;
}
#equipe{
padding:50px 0 60px;
}
#equipe .equipe .texto-equipe{
width:40%;
}
#equipe .equipe .profissionais{
width:30%;
padding-left:35px;
}
#equipe .equipe .texto-equipe h2{
position:relative;
text-align: left;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
margin: 0 auto 30px;
}
#equipe .equipe .texto-equipe p{
text-align: left;
font: normal normal normal 18px/25px Sora;
letter-spacing: 0px;
color: #FFFFFF;
margin:0;
}
#equipe .equipe .texto-equipe h2 span, #equipe .equipe .texto-equipe p span{
color:#F9451D;
}
#equipe .equipe ul li:not(:last-child){
margin-bottom: 28px;
}
#equipe .equipe ul li{
background-color: #222221;
padding:15px 21px;
position: relative;
text-align: left;
font: normal normal normal 16px/22px Sora;
letter-spacing: 0px;
color: #FFFFFF;
border-radius: 5px;
}
#equipe .equipe ul li i{
position: absolute;
right:21px;
top:50%;
transform:translatey(-50%);
}
#depoimentos{
padding:60px 0 110px;
}
#depoimentos h2{
position:relative;
padding-bottom: 25px;
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 700px;
margin: 0 auto 45px;
}
#depoimentos h2 span{
color:#F94501;
}
#depoimentos h2:after{
content:"";
width:90px;
height:1px;
background-color: #F9451D;
position: absolute;
left:50%;
bottom:0;
transform: translatex(-50%);
}
#depoimentos .depoimentos .depoimento{
width:33.3333%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
padding:10px;
cursor: pointer;
}
#depoimentos .depoimentos .depoimento img{
transition: all 0.4s linear;
transform: scale(1);
box-shadow:0 0 30px rgba(255,58,0,0.0);
border-radius: 15px;
}
#depoimentos .depoimentos .depoimento:hover img{
transform: scale(1.05);
box-shadow:0 0 25px rgba(255,58,0,0.3);
}
#depoimentos .depoimentos{
margin-bottom: 60px;
}
#clientes{
padding:20px 0 110px;
}
#clientes h2{
position:relative;
padding-bottom: 25px;
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 900px;
margin: 0 auto 45px;
}
#clientes h2:after, #final h2:after{
content:"";
width:90px;
height:1px;
background-color: #F9451D;
position: absolute;
left:50%;
bottom:0;
transform: translatex(-50%);
}
#clientes h2 span, #final h2 span{
color:#F94501;
}
#final{
padding:20px 0px 100px;
}
#final h2{
position:relative;
padding-bottom: 30px;
text-align: center;
font: normal normal bold 34px/42px Sora;
letter-spacing: 0px;
max-width: 900px;
margin: 0 auto 30px;
}
#final p{
text-align: center;
font: normal normal normal 18px/25px Sora;
letter-spacing: 0px;
color: #FFFFFF;
max-width: 480px;
margin: 0 auto 40px;
}
footer{
background-color: #222221;
}
footer .content-footer{
padding:50px 0 25px;
}
footer .content-footer .aba-links a{
display: flex;
align-items: center;
text-align: left;
font: normal normal normal 15px/24px Sora;
letter-spacing: 0px;
color: #FFFFFF;
transition: all 0.4s linear;
}
footer .content-footer .aba-links a:hover{
color:#F94501;
}
footer .content-footer .aba-links h4{
text-align: left;
font: normal normal bold 15px/19px Sora;
letter-spacing: 0px;
color: #FFFFFF;
margin-bottom: 15px;
}
footer .content-footer .links-rodape{
min-width: 600px;
}
footer .copyright{
text-align: center;
font: normal normal 400 13px/19px Sora;
letter-spacing: 0px;
color: #FFFFFF;
padding:25px 0 30px;
position:relative;
}
.bt-up{
position: absolute;
right:0;
top:50%;
transform:translatey(-50%);
border-radius: 50%;
width:30px;
height:30px;
background:#F94501;
color:#fff;
font-size: 16px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.4s linear;
}
.bt-up:hover{
background:#000;
}
.clientes{
padding:10px 30px;
}
.clientes .cliente{
padding:0 10px;
}
.slick-prev, .slick-next{
position:absolute;
top:50%;
left:0;
z-index:5;
transform:translatey(-50%);
width:50px;
height:50px;
background-color: transparent;
color:#fff;
font-size: 0;
cursor: pointer;
}
.slick-next{
left:auto;
right:0;
}
.slick-prev:before{
content: "\f053";
font-weight: 900;
font-family: "Font Awesome 6 Free";
font-style: normal;
font-variant: normal;
line-height: 1;
text-rendering: auto;
font-size:40px;
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
color:#fff;
transition: all 0.4s linear;
}
.slick-next:before{
content: "\f054";
font-weight: 900;
font-family: "Font Awesome 6 Free";
font-style: normal;
font-variant: normal;
line-height: 1;
text-rendering: auto;
font-size:40px;
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
color:#fff;
transition: all 0.4s linear;
}
.slick-next:hover:before, .slick-prev:hover:before{
color:#F94501;
}
.clientes .slick-track{
display: flex !important;
align-items: center;
}
.modal-open{
display: flex !important;
align-items: center;
justify-content: center;
background-color: rgba(50, 50, 50, 0.3);
-webkit-backdrop-filter: blur(50px);
backdrop-filter: blur(50px);
animation-name: fadeInOpacity;
animation-iteration-count: 1;
animation-timing-function: ease-in;
animation-duration: 1s;
}
@keyframes fadeInOpacity {
    0% {
    opacity: 0;
    }
    100% {
    opacity: 1;
    }
}
.modal-video .content-modal {
width: 750px;
position: relative;
height: 430px;
max-width: 95%;
}
.modal-video .close-video {
position: absolute;
top: -45px;
right: 0px;
cursor: pointer;
}
.modal-video .close-video svg {
width: 40px;
height: 40px;
}
.video-container {
overflow: hidden;
position: relative;
width: 100%;
border-radius: 15px;
height:430px;
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.modal-texto .content-modal{
background: #FFFFFF 0% 0% no-repeat padding-box;
border-radius: 10px;
color: #000;
max-width: 96%;
width: 980px;
height: 86vh;
padding: 30px;
position: relative;
overflow: hidden;
z-index: 5;
}
.modal-texto .content-modal .close-modal{
position: absolute;
top: 0;
right: 0;
background: #F94501;
width: 30px;
height: 30px;
border-radius: 0 0 0 10px;
display: flex;
align-items: center;
justify-content: center;
color: #262626;
font-size: 20px;
cursor: pointer;
transition: all 0.3s ease-in-out;
}
.modal-texto .content-modal .close-modal:hover{
background:#F94501;
color:#262626;
}
.modal-texto .content-modal .area-texto{
height: 100%;
overflow: auto;
padding: 0 20px 20px 0;
}
.modal-texto .content-modal .area-texto h2{
text-align: left;
font: normal normal bold 24px/26px Sora;
letter-spacing: 0px;
color: #F94501;
margin-bottom: 20px;
}
.modal-texto .content-modal .area-texto p{
text-align: left;
font: normal normal normal 15px/24px Sora;
letter-spacing: 0px;
color: #000;
margin-bottom: 25px;
}
.modal-texto .content-modal .area-texto h4{
text-align: left;
font: normal normal bold 15px/25px Sora;
letter-spacing: 0px;
color: #000;
margin-bottom: 25px;
}
.modal-texto .content-modal .area-texto a{
color:#F94501;
transition: all 0.4s linear;
}
.modal-texto .content-modal .area-texto a:hover{
color:#333333;
}


@media(max-width:1600px){
#topo .content-topo .logo {
margin: 0 0 40px;
max-width: 160px;
}
#topo .content-topo h1 {
text-align: left;
font: normal normal bold 24px/26px Sora;
letter-spacing: 0px;
color: #FFFFFF;
max-width: 625px;
margin: 0 0 30px;
}
#topo .content-topo p {
text-align: left;
font: normal normal normal 16px/24px Sora;
letter-spacing: 0px;
color: #FFFFFF;
max-width: 380px;
margin: 0 0 30px;
}
.btn-contato {
font: normal normal bold 15px/24px Sora;
height: 50px;
width: 360px;
}
#contato{
background-size:contain;
background-position: center top;
padding: 60px 0 100px;
background-repeat: no-repeat;   
}
#contato .text-contato h2 {
text-align: center;
font: normal normal bold 30px/40px Sora;
max-width: 455px;
margin: 0 auto 35px;
}
#contato .text-contato p {
text-align: center;
font: normal normal normal 16px/24px Sora;
letter-spacing: 0px;
max-width: 420px;
margin: 0 auto 40px;
}
#video-vendas h2 {
text-align: center;
font: normal normal bold 30px/38px Sora;
letter-spacing: 0px;
max-width: 700px;
margin: 0 auto 30px;
}
#video-vendas p, #agencia p {
text-align: center;
font: normal normal normal 16px/24px Sora;
}
#agencia h2, #final h2{
text-align: center;
font: normal normal bold 30px/38px Sora;
}
#agencia{
background-position: center top 0;
}
#agencia .dados .dado h1 {
text-align: center;
font: normal normal bold 64px/64px Sora;
}
#agencia .dados .dado p {
text-align: center;
font: normal normal normal 16px/22px Sora;
}
#equipe .equipe .texto-equipe h2 {
font: normal normal bold 30px/40px Sora;
max-width: 415px;
margin: 0 0 30px;
}
#equipe .equipe .texto-equipe p {
text-align: left;
font: normal normal normal 16px/24px Sora;
max-width: 400px;
}
#equipe .equipe ul li {
text-align: left;
font: normal normal normal 15px/22px Sora;
padding: 13px 21px;
}
#depoimentos h2 {
font: normal normal bold 30px/38px Sora;
max-width: 615px;
}
#clientes h2 {
text-align: center;
font: normal normal bold 30px/40px Sora;
max-width: 830px;
margin: 0 auto 45px;
}
#final p {
text-align: center;
font: normal normal normal 16px/24px Sora;
max-width: 435px;
margin: 0 auto 40px;
}

}

@media(max-width:992px){
.content-topo{
padding:0 10px;
}
#topo .content-topo .logo {
margin: 0 0 40px;
max-width: 150px;
}
#topo .content-topo h1 {
text-align: left;
font: normal normal bold 28px/40px Sora;
}
#contato .text-contato h2, #video-vendas h2, #agencia h2, #final h2, #equipe .equipe .texto-equipe h2, #depoimentos h2, #clientes h2 {
text-align: center;
font: normal normal bold 24px/34px Sora;
margin-left: auto;
margin-right: auto;
}
#contato .text-contato p, #video-vendas p, #agencia p, #equipe .equipe .texto-equipe p, #final p {
text-align: center;
font: normal normal normal 15px/24px Sora;
margin-left: auto;
margin-right: auto;
}
.form-contato input, .form-contato select {
height:50px;
margin-bottom: 15px;
}
.form-contato .btn-contato {
margin-top: 10px;
font-size: 14px;
height: 50px;
}
#agencia .dados .dado {
width: 100%;
}
#agencia .dados .dado:not(:last-child) {
margin-bottom: 20px;
}
#agencia .dados {
padding: 35px 0 40px;
}
#equipe .equipe .texto-equipe {
width: 100%;
margin: 0 0 40px;
}
#equipe .equipe .texto-equipe h2 {
font: normal normal bold 24px/34px Sora;
}
#equipe .equipe .profissionais {
width: 100%;
padding: 0 30px;
}
#equipe .equipe ul li:not(:last-child) {
margin-bottom: 18px;
}
#equipe .equipe ul li:last-child{
margin-bottom: 18px;
}
#depoimentos .depoimentos .depoimento{
width: 100%;
padding:15px;
}
.slick-prev, .slick-next{
width:40px;
height:40px;
}
.slick-prev:before, .slick-next:before{
font-size: 26px;
}
.clientes .cliente{
padding:0;
}
.logo-rodape{
max-width: 160px;
margin: 0 auto 40px;
}
footer .content-footer .links-rodape {
min-width: 100%;
width: 100%;
}
footer .content-footer .links-rodape .aba-links{
width: 100%;
margin-bottom: 25px;
}
footer .content-footer .aba-links h4{
text-align: center;
}
footer .content-footer .aba-links a{
text-align: center;
justify-content: center;
}
footer .copyright span{
display: block;
text-align: center;
font-size: 12px;
max-width: 300px;
margin:0 auto;
}
#contato{
background-size: contain;
background-position: center top;
padding: 80px 0 100px;
background-repeat: no-repeat;
}
#topo{
background-blend-mode: multiply;
background-color: rgb(77, 77, 77);
}

}