@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
/*========== RESET ==========*/
* {margin: 0; padding: 0; box-sizing: border-box; border: none;}
body {font-family: Inter, sans-serif; color: #222; font-family: "Poppins", Sans-serif;}
html {scroll-behavior: smooth;}
.negrito {font-weight: bold;}
.italico {font-style: italic;}
.linha-botao {position: relative; float: left; width: 100%;}
.botao {position: relative; float: left; width: 260px; left: 50%; margin-top: 30px; margin-left: -130px; padding: 15px 5px; border-radius: 100px; font-size: 15px; font-weight: 800; text-align: center; color: #fff; background: linear-gradient(90deg, #c47a08 0%, #ff9a00 100%); transition: 0.2s ease-out;}
.botao:hover {transform: scale(1.04);}

/*========== TOPO ==========*/
.topo-fora-a-fora {position: fixed; width: 100%; height: 90px; background-color: rgba(6,23,45,0.9); z-index: 9999;}
.topo {position: relative; float: left; width: 90%; margin-left: 5%;}
.logo img {position: relative; float: left; width: 200px; height: 50px; margin-top: 20px;}
.botao-whatsapp {position: relative; float: right; width: 150px; margin-top: 19px; padding: 15px 5px; border-radius: 100px; font-size: 15px; font-weight: 800; text-align: center; color: #fff; background: linear-gradient(90deg, #22a854 0%, #25d366 100%); transition: 0.2s ease-out;}
.botao-whatsapp:hover {transform: scale(1.04);}

/*========== BANNER ==========*/
.banner-fora-a-fora {position: relative; float: left; width: 100%; padding: 240px 30px 150px 30px; background: url(../img/banner2.jpg); background-size: cover; background-position: center;}
.banner {position: relative; float: left; width: 100%;}
.textos-banner {position: relative; float: left; width: 100%;}
.titulo-banner {position: relative; float: left; width: 100%; margin-bottom: 30px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}
.subtitulo-banner {position: relative; float: left; width: 100%; margin-bottom: 30px; padding-top: 30px; border-top: 4px solid rgba(255,255,255,0.3); text-align: center; font-size: 20px; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}
.botao-fora-a-fora {position: relative; float: left; width: 100%;}
.botao-banner {position: relative; float: left; width: 380px; left: 50%; margin-left: -190px; padding: 15px 5px; border-radius: 100px; font-size: 15px; font-weight: 800; text-align: center; color: #fff; background: linear-gradient(90deg, #c47a08 0%, #ff9a00 100%); transition: 0.2s ease-out;}
.botao-banner:hover {transform: scale(1.04);}

/*========== ESPECIALIZAÇÕES ==========*/
.especializacoes-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: #fff;}
.especializacoes {position: relative; float: left; width: 100%;}
.titulo-especializacoes {position: relative; float: left; width: 100%; margin-bottom: 20px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #191a46;}
.especializacoes-caixa {position: relative; float: left; width: 320px; left: 50%; margin-left: -160px; padding: 15px 10px;}
.especializacao {position: relative; float: left; width: 100%; margin-bottom: 30px; padding: 60px 25px; border-radius: 10px; box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1); background: #06172d;}
.imagem-especializacao {position: relative; float: left; width: 80px; height: 80px; left: 50%; margin-left: -40px; margin-bottom: 10px;}
.titulo-especializacao {position: relative; float: left; width: 100%; margin-top: 10px; margin-bottom: 10px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 20px; font-weight: 800; color: #eee;}
.descricao-especializacao {position: relative; float: left; width: 100%; text-align: center; font-size: 16px; color: #fff;}
.descricao-especializacoes {position: relative; float: left; width: 100%; padding: 30px 0; font-style: italic; text-align: center; font-size: 20px;}

/*========== SOBRE NÓS ==========*/
.sobre-nos-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: #fff;}
.sobre-nos {position: relative; float: left; width: 100%;}
.titulo-sobre-nos {position: relative; float: left; width: 100%; margin-bottom: 20px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #191a46;}
.sobre-nos-caixa {position: relative; float: left; width: 100%; padding: 15px 10px;}
.sobre-nos-imagem {position: relative; float: left; width: 300px; height: 300px; left: 50%; margin-left: -150px; margin-bottom: 10px;}
.sobre-nos-texto {position: relative; float: left; width: 100%; margin-top: 10px; margin-bottom: 10px; font-family: "Roboto", sans-serif; font-size: 20px;}

/*========== PROBLEMAS ==========*/
.problemas-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: #f8f8f8;}
.problemas {position: relative; float: left; width: 100%;}
.problemas-caixa {position: relative; float: left; width: 360px; left: 50%; margin-left: -180px; padding: 15px 10px;}
.problemas-texto {position: relative; float: left; width: 100%; padding-bottom: 40px; border-bottom: 4px solid rgba(0,0,0,0.3); font-family: "Roboto", sans-serif; font-size: 20px;}
.problemas-titulo {position: relative; float: left; width: 100%; margin-top: 40px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #191a46;}
.botao-problemas {position: relative; float: left; width: 260px; left: 50%; margin-left: -130px; margin-top: 20px; padding: 15px 5px; border-radius: 100px; text-transform: none; font-size: 15px; font-weight: 800; text-align: center; color: #fff; background: linear-gradient(90deg, #22a854 0%, #25d366 100%); transition: 0.2s ease-out;}
.botao-problemas:hover {transform: scale(1.04);}

/*========== CTA ==========*/
.cta-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: url(../img/cta.jpg); background-size: cover; background-position: center;}
.cta {position: relative; float: left; width: 100%;}
.cta-titulo {position: relative; float: left; width: 100%; margin-bottom: 30px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}
.cta-subtitulo {position: relative; float: left; width: 100%; text-align: center; font-size: 20px; color: #fff;}

/*========== INVENTÁRIOS ==========*/
.inventarios-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: #fff;}
.inventarios {position: relative; float: left; width: 100%;}
.inventarios-titulo {position: relative; float: left; width: 100%; margin-bottom: 30px; text-align: center; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 30px; font-weight: 800; color: #191a46;}
.inventarios-subtitulo {position: relative; float: left; width: 100%; margin-bottom: 30px; text-align: center; font-size: 20px;}
.inventarios-caixa {position: relative; float: left; width: 360px; left: 50%; margin-left: -180px;}
.inventario-judicial-caixa-mobile {position: relative; float: left; width: 100%; border-radius: 10px; box-shadow: 0 0 5px -2px rgb(0 0 0 / .5); background: #f8f8f8;}
.inventario-extrajudicial-caixa-mobile {position: relative; float: left; width: 100%; margin-top: 10px; border-radius: 10px; box-shadow: 0 0 5px -2px rgb(0 0 0 / .5); background: #f8f8f8;}
.situacao-mobile {position: relative; float: left; width: 100%;}
.situacao-inventario-titulo-pergunta-mobile {position: relative; float: left; width: 140px; padding: 12px; font-size: 16px; font-weight: 800; color: #191a46;}
.situacao-inventario-titulo-resposta-mobile {position: relative; float: left; width: 220px; padding: 12px; font-size: 16px; font-weight: 800; color: #191a46;}
.situacao-inventario-pergunta-mobile {position: relative; float: left; width: 140px; padding: 12px; font-size: 14px; font-weight: 600; color: #191a46;}
.situacao-inventario-resposta-mobile {position: relative; float: left; width: 220px; padding: 12px; font-size: 15px;}
.situacao-inventario-titulo-resposta-desktop {display: none; position: relative; float: left; width: 220px; padding: 12px; font-size: 16px; font-weight: 800; color: #191a46;}
.situacao-inventario-resposta-desktop {display: none; position: relative; float: left; width: 220px; padding: 12px; font-size: 15px;}

/*========== RODAPÉ SUPERIOR ==========*/
.rodape-superior-fora-a-fora {position: relative; float: left; width: 100%; padding: 70px 30px; background: #06172d;}
.rodape-superior {position: relative; float: left; width: 100%;}
.rodape-superior h1 {position: relative; float: left; width: 100%; font-family: "Abyssinica SIL", Sans-serif; font-size: 24px; color: #ff9a00; text-transform: uppercase;}
.imagem-rodape {position: relative; float: left; width: 100%; margin-bottom: 20px;}
.imagem-rodape img {position: relative; float: left; width: 300px; left: 50%; margin-left: -150px;}
.contato-endereco {position: relative; float: left; width: 100%; margin-bottom: 20px; text-align: center; color: #fff;}
.mapa-rodape {position: relative; float: left; width: 100%; height: 250px;}

/*========== RODAPÉ ==========*/
.rodape {position: relative; float: left; width: 100%; padding: 50px 30px; text-align: center; font-size: 16px; font-weight: 500; text-transform: uppercase; font-weight: 700; color: #222; background: linear-gradient(90deg, #c47a08 0%, #ff9a00 100%);}
a.link-rodape {color: #222; text-decoration: none;}
a.link-rodape:hover {text-decoration:underline;}


/* SMALL DEVICES - TABLETS */
@media screen and (min-width: 768px) {
.topo, .banner, .textos-banner, .especializacoes-caixa, .sobre-nos-caixa, .problemas-caixa, .cta, .inventarios, .inventarios-caixa {width: 700px; left: 50%; margin-left: -350px;}
.titulo-especializacoes, .titulo-sobre-nos, .cta-titulo, .inventarios-titulo {font-size: 36px;}
.botao, .botao-problemas {width: 340px; margin-left: -170px; padding: 20px 10px; font-size: 17px;}

.botao-whatsapp {width: 240px; font-size: 17px;}
.titulo-banner {font-size: 28px; text-align: left;}
.subtitulo-banner {font-size: 20px; text-align: left;}
.botao-banner {width: 440px; left: 0; margin-left: 0; padding: 20px 10px; font-size: 17px;}

.especializacao {width: 206px; height: 404px; margin: 10px; padding: 30px 25px;}

.situacao-inventario-titulo-pergunta-mobile, .situacao-inventario-pergunta-mobile {width: 170px; padding: 20px;}
.situacao-inventario-titulo-resposta-mobile, .situacao-inventario-titulo-resposta-desktop, .situacao-inventario-resposta-mobile, .situacao-inventario-resposta-desktop {width: 265px; padding: 20px;}
.inventario-extrajudicial-caixa-mobile {display: none;}
.situacao-inventario-titulo-resposta-desktop {display: block;}
.situacao-inventario-resposta-desktop {display: block;}
}

/* MEDIUM DEVICES - TABLETS & DESKTOPS */
@media screen and (min-width: 960px) {
.topo, .banner, .textos-banner, .especializacoes-caixa, .sobre-nos-caixa, .problemas-caixa, .cta, .inventarios, .inventarios-caixa {width: 900px; margin-left: -450px;}
.titulo-especializacoes, .titulo-sobre-nos, .cta-titulo, .inventarios-titulo {margin-bottom: 20px; line-height: 48px;}

.banner-fora-a-fora {overflow: hidden;}
.titulo-banner {margin-bottom: 30px; font-size: 36px; line-height: 58px;}
.subtitulo-banner, .cta-subtitulo, .inventarios-subtitulo {font-size: 22px;}

.especializacao {width: 273px; height: 350px;}

.sobre-nos-imagem {width: 310px; height: 310px; left: 0; margin-left: 0;}
.sobre-nos-texto {float: right; width: 540px; font-size: 18px;}

.problemas-texto {float: right; width: 440px; padding-left: 40px; padding-bottom: 0; border-bottom: 0; border-left: 4px solid rgba(0,0,0,0.3);}
.problemas-titulo {float: left; width: 436px; padding-right: 40px; padding-top: 0; margin-top: 25px; font-size: 30px;}

.situacao-inventario-titulo-pergunta-mobile, .situacao-inventario-pergunta-mobile {width: 200px;}
.situacao-inventario-titulo-pergunta-mobile, .situacao-inventario-titulo-resposta-mobile, .situacao-inventario-titulo-resposta-desktop {font-size: 18px;}
.situacao-inventario-pergunta-mobile, .situacao-inventario-resposta-mobile, .situacao-inventario-resposta-desktop {font-size: 16px;}
.situacao-inventario-titulo-resposta-mobile, .situacao-inventario-titulo-resposta-desktop, .situacao-inventario-resposta-mobile, .situacao-inventario-resposta-desktop {width: 350px;}

.rodape-superior {width: 900px; left: 50%; margin-left: -450px;}
.imagem-rodape {width: 280px; margin: 10px; margin-bottom: 0;}
.imagem-rodape img {width: 280px; left: 0; margin-left: 0;}
.contato-endereco {width: 280px; margin: 10px; margin-bottom: 0; text-align: left;}
.mapa-rodape {width: 280px; height: 280px; margin: 10px;}
}

/* LARGE DEVICES - WIDE SCREENS */
@media screen and (min-width: 1280px) {
.topo, .banner, .textos-banner, .especializacoes-caixa, .sobre-nos-caixa, .problemas-caixa, .cta, .inventarios {width: 1200px; margin-left: -600px;}
.titulo-especializacoes, .titulo-sobre-nos, .cta-titulo {margin-bottom: 30px; font-size: 42px;}
.inventarios-titulo {margin-bottom: 30px; font-size: 38px;}

.titulo-banner {font-size: 48px; line-height: 60px;}
.subtitulo-banner {width: 800px;}

.especializacao {width: 373px; height: 308px;}

.sobre-nos-imagem {width: 380px; height: 380px;}
.sobre-nos-texto {width: 740px; font-size: 22px;}

.problemas-texto {width: 630px; margin-top: 0; padding-top: 25px; padding-bottom: 25px; font-size: 21px; line-height: 38px;}
.problemas-titulo {width: 536px; margin-top: 0; font-size: 42px;}

.rodape-superior {width: 1200px; margin-left: -600px;}
.imagem-rodape {width: 300px;}
.imagem-rodape img {width: 300px;}
.contato-endereco {width: 330px;}
.mapa-rodape {width: 510px; height: 300px;}
}