/* ----------------------------------------------------------
    :: Template Name: Mix Documentos
    :: Theme URI: ### Link da URL ###
    :: Author: Geovani Assis Pereira
    :: Author URL: https://geovaniassis.dev.br
    :: Description: Site moderno para a Mix Documentos
    :: Version: 1.0.0
    :: Created: 24 Junho 2026
    :: Last Updated: 24 Junho 2026
    ----------------------------------------------------------

/***************************************************************************
       Cores
****************************************************************************

	Vermelho	= #E10613
	Branco		= #ffffff
	Preto		= #111111
	Cinza Claro	= #f8f8f8

/***************************************************************************
       Fonts
***************************************************************************/

	@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Sora:wght@100..800&display=swap');

/***************************************************************************
       Variáveis
***************************************************************************/

	:root {
	  --cor-vermelho: #E10613;
	  --cor-branco: #ffffff;
	  --cor-preto: #111111;
	  --cor-cinza-claro: #f8f8f8;

	  --font-titulo: "Sora", sans-serif;
	  --font-texto: "Inter", sans-serif;
	}

	@keyframes floatSobe {
	0%, 100% {
		transform: translateY(0) translateX(0) rotate(0deg);
	}
	25% {
		transform: translateY(10px) translateX(0px) rotate(0deg);
	}
	50% {
		transform: translateY(-5px) translateX(0px) rotate(0deg);
	}
	75% {
		transform: translateY(5px) translateX(0px) rotate(0deg);
	}
	}

/***************************************************************************
        All
***************************************************************************/

	html,
	body{
		margin: 0;
		overflow-x: hidden;
	}

	body{ overflow: auto !important; }

	*{
		margin: 0;
		box-shadow: 0 0 0 0;
		border: 0 none;
		outline: 0;
	} 

	a:hover,
	a:focus,
	a:visited{
		text-decoration: none !important; 
		cursor: pointer;
	}

	button:focus { outline: none; }


	.mrg-bottom-50{ margin-bottom: 50px; }

	.pdd-0{ padding: 0!important; }
	.pdd-0-15{ padding: 0 15px!important; }
	.pdd-50-0{ padding: 50px 0 !important; }

	.pdd-left-75{ padding-left: 75px !important; }
	.pdd-left-85{ padding-left: 85px !important; }
	.pdd-left-90{ padding-left: 90px !important; }
	.pdd-left-100{ padding-left: 100px !important; }
	.pdd-left-125{ padding-left: 125px !important; }
	.pdd-left-150{ padding-left: 150px !important; }

	.txt-center{ align-content: center !important;}

	.flutuar{
	    animation: floatSobe 15s infinite ease-in-out;
	}
	.mrg-0{
		margin: 0px !important;
	}

	.btnTransparente{
		color: var(--cor-vermelho);
		font-weight: 700;
		border: solid 2px;
		display: flex;
		justify-content: center;
		padding: 10px 25px;
		width: fit-content;
		justify-self: anchor-center;
		margin: 30px 0 5px;
		border-radius: 10px;
	}

	.btnVermelho{
		background-color: var(--cor-vermelho);
		min-height: 30px;
		display: flex;
		align-content: center;
		padding: 10px 25px;
		border: solid 2px;
		border-radius: 10px;
		color: #fff;
		justify-content: center;
		justify-self: anchor-center;
		font-family: var(--font-texto);
		font-weight: 700;
		width: fit-content;
		margin: 30px 0 5px;
	}
	.btnVermelho img {
		width: 24px;
		margin-left: 5px;
		height: 24px;
		margin-top: -2px;
	}

/***************************************************************************
        Menu - Header
***************************************************************************/
	nav{
		position: fixed !important;
		top: 0;
		left: 0;
		width: 100%;
		padding: 0 15px !important;
	    display: block !important;
		z-index: 10 !important;
		transition: ease .5s all;
	}
	.drop nav{
		background: #000000d6;
	}
	nav img.logo{
		max-width: 100%;
		height: 80px;
		padding: 5px 0;
	    object-fit: contain;
	}

	nav ul.desktop{
		margin: 0;
		padding: 0;
		display: flex;
		gap: 40px;
		float: right;
	}
	nav ul.desktop li{
		display: block;
		height: 70px;
		align-content: center;
	    border-bottom: solid transparent 3px;
		transition: ease .3s all;
	}
	nav ul.desktop li a{
		color: #fff;
		font-family: var(--font-texto);
		font-weight: 600;
	}
	nav ul.desktop li.ativo,
	nav ul.desktop li:hover{
	    border-bottom: solid red 3px;
	}

	nav ul.desktop li.botao a{
		background-color: var(--cor-vermelho);
		min-height: 30px;
		display: block;
		align-content: center;
		padding: 10px 20px;
		border-radius: 10px;
	}
	nav ul.desktop li.botao:hover{
	    border-bottom: solid transparent 3px;
	}
	nav ul.desktop li.botao img{
	    width: 21px;
		margin-top: -3px;
	    margin-left: 5px;
	}


/***************************************************************************
        Home > Banner
***************************************************************************/

	#banner{
		background-image: url('https://mixdocumentos.geovaniassis.dev.br/wp-content/uploads/2026/06/banner.png');
		background-size: cover;
		background-position: center;
		align-content: center;
		min-height: 780px;
		padding: 110px 0;
	}
	#banner .col-lg-6{
		gap: 15px;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	
	#banner .logoImg{
		max-width: 100%;
	}

	#banner span{
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#banner h2{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 49px;
		font-weight: 700;
		margin: 0px;
	    line-height: 54px;
	}
	#banner p{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 17px;
		margin: 0px;
	}
	
	#banner .botao a{
		background-color: var(--cor-vermelho);
		min-height: 30px;
		display: block;
		align-content: center;
		padding: 10px 20px;
		border-radius: 10px;
		color: var(--cor-branco);
		width: fit-content;
	}
	#banner .botao img{
	    width: 21px;
		margin-top: -3px;
	    margin-left: 5px;
	}


/***************************************************************************
        Home > Vantagens
***************************************************************************/

	#vantagens{
	    padding: 30px 0;
		background-color: var(--cor-preto);
	}
	#vantagens .bloco{
		display: flex;
		align-self: center;
		justify-content: center;
		gap: 20px;
		padding: 15px;
	}
	#vantagens .bloco img{
		align-self: center;
	}
	#vantagens .bloco h2{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 19px;
		font-weight: 700;
		margin: 0;
	}
	#vantagens .bloco p{
		color: var(--cor-branco);
		margin: 0;
		font-family: var(--font-texto);
		font-weight: 200;
		max-width: 160px;
	}

/***************************************************************************
        Home > Serviços
***************************************************************************/

	#servicosHome{
		background-color: var(--cor-cinza-claro);
		padding: 50px 0;
	}
	#servicosHome .areaTexto{
	    align-items: flex-end;
		margin-bottom: 15px;
	}
	#servicosHome span{
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#servicosHome h2{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 35px;
		font-weight: 900;
		margin: 0px;
		line-height: 40px;
	}
	#servicosHome p{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 17px;
		margin: 0px;
	}

	#servicosHome .areaBloco{
		background-color: var(--cor-branco);
		margin: 15px 0;
		padding: 20px 13px;
		min-height: 160px;
		border-radius: 5px;
		box-shadow: 0 0 14px 0 #0000000d;
		gap: 15px;
	    min-height: 217px;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	#servicosHome h3{
		font-family: var(--font-titulo);
		font-size: 16px;
		font-weight: 900;
		margin: 0;
		color: var(--cor-preto);
	}
	#servicosHome .areaBloco p{
	    font-size: 15px;
	}
	#servicosHome .areaBloco img{
	    width: 60px;
	}

/***************************************************************************
        Home > Porque
***************************************************************************/

	#porqueHome{
		background-image: url('https://mixdocumentos.geovaniassis.dev.br/wp-content/uploads/2026/07/fundo-mix.png');
		min-height: 300px;
		background-color: #9b080c;
		background-repeat: no-repeat;
		background-position: left center;
		background-size: contain;
	    align-content: center;
	    padding: 50px 0;
	}
	#porqueHome span {
		color: var(--cor-branco);
		font-weight: 400;
		font-size: 14px;
		font-family: var(--font-titulo);
	}	
	#porqueHome h2 {
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 35px;
		font-weight: 900;
		margin: 0px;
		line-height: 40px;
		max-width: 440px;
	    margin-top: 15px;
	}
	#porqueHome .txt-center{
	    text-align: center;
		padding: 15px;
	}

	#porqueHome .col-lg-4{
	    align-content: center;
	}

	#porqueHome .row > .col-xl-3 + .col-xl-3::before  {
		content: "";
		position: absolute;
		left: 0;
		top: 15%;
		width: 1px;
		height: 70%;
		background: #d9d9d9;
	}
	#porqueHome img{
		width: 55px;
		margin-bottom: 20px;
	}
	#porqueHome .areaTexto,
	#porqueHome .countercd{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-weight: 600;
		font-size: 34px;
		text-align: center;
	    justify-items: center;
	}
	#porqueHome em{
		display: block;
		font-size: 13px;
		font-style: normal;
		font-weight: 400;
		max-width: 120px;
	}
	
/***************************************************************************
        Home > Funciona
***************************************************************************/

	#funcionaHome{		
		background-color: var(--cor-cinza-claro);
		padding: 50px;
	}
	#funcionaHome .areaTexto{
	    align-items: center;
		margin-bottom: 15px;
	}
	#funcionaHome span{
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#funcionaHome h2{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 35px;
		font-weight: 900;
		margin: 0px;
		line-height: 40px;
	    max-width: 360px;
	}
	#funcionaHome .areaBloco{
		background-color: var(--cor-branco);
		display: flex;
	    flex-wrap: wrap;
		border-radius: 5px;
		box-shadow: 0 0 14px 0 #0000000d;
	}
	#funcionaHome .areaBloco .col-xl-3{
	    padding: 25px 15px;
	}
	#funcionaHome .areaNumber{
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
		margin-bottom: 20px;
	}
	#funcionaHome .areaNumber span{
		width: 40px;
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #f5efee;
		border-radius: 100%;
	}
	#funcionaHome .areaNumber img{
	    width: 45px;
	}
	#funcionaHome .areaBloco h3{
		font-family: var(--font-titulo);
		font-size: 18px;
		font-weight: 900;
	}
	#funcionaHome .areaBloco p{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 15px;
		margin: 0px;
		max-width: 300px;
	}

	#prontoHome{
		background: var(--cor-preto);
		padding: 50px 0px;
	}
	#prontoHome .row{
		align-items: anchor-center;
	}
	#prontoHome .col-lg-5{
		border-right: solid var(--cor-vermelho) 1px;
		padding: 20px 15px;
	}
	#prontoHome .col-lg-7{
		align-content: center;
	}

	#prontoHome h2 {
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 35px;
		font-weight: 900;
		margin: 0px;
		line-height: 40px;
		max-width: 440px;
		margin-bottom: 20px;
		margin-top: 0px;
	}
	#prontoHome p {
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 17px;
		margin: 0px;
	    min-height: 51px;
	}
	#prontoHome .areaContatos{
		display: flex;
		justify-content: space-around;
	}
	#prontoHome .areaContatos .areaContato{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 10px;		
	}

	#prontoHome h3{
		color: var(--cor-branco);
		margin: 0px;
		max-width: 440px;
		margin-bottom: 0px;
		margin-top: 0px;
		font-family: var(--font-titulo);
		font-size: 18px;
		font-weight: 900;
	}
	#prontoHome .areaContatos .areaContato img{
	    width: 50px;
	}


/***************************************************************************
        Sobre Nós > Banner
***************************************************************************/
	
	#bannerInterno.sobre{
		background-image: url('https://mixdocumentos.geovaniassis.dev.br/wp-content/uploads/2026/07/banner-somos.png');
	}
	#bannerInterno.servicos{
		background-image: url('https://mixdocumentos.geovaniassis.dev.br/wp-content/uploads/2026/07/banner-somos.png');
	}
	#bannerInterno{
		background-size: cover;
		background-position: center;
		align-content: center;
		padding: 30px 0;
		border-top: solid var(--cor-preto) 70px;
	}
	#bannerInterno .col-lg-6{
		gap: 15px;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	
	#bannerInterno .logoImg{
		width: 400px;
		max-width: 100%;
		filter: drop-shadow(0px 0px 5px black);
	}

	#bannerInterno span{
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#bannerInterno h2{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 39px;
		font-weight: 700;
		margin: 0px;
	    line-height: 54px;
	}
	#bannerInterno h2 EM{
		color: var(--cor-vermelho);
		font-style: normal;
	}
	#bannerInterno p{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 17px;
		margin: 0px;
	}
	
	#bannerInterno .botao a{
		background-color: var(--cor-vermelho);
		min-height: 30px;
		display: block;
		align-content: center;
		padding: 10px 20px;
		border-radius: 10px;
		color: var(--cor-branco);
		width: fit-content;
	}
	#bannerInterno .botao img{
	    width: 21px;
		margin-top: -3px;
	    margin-left: 5px;
	}

/***************************************************************************
        Contato > Mensagem
***************************************************************************/


	#mensagens .blocoBrancoMensagem {
		background: var(--cor-branco);
		border-radius: 5px;
		width: 100%;
		box-shadow: 0 0 4px #0000001a;
		padding: 20px 0;
        min-height: 455px;
		margin-bottom: 20px;
	}

	#mensagens h2 {
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 20px;
		font-weight: 900;
		margin: 0px 0 20px;
	}

	#mensagens .blocoBrancoMensagem h2 {
		font-size: 27px;
		margin: 0px;
	}
	#mensagens .blocoBrancoMensagem h2 img {
		width: 45px;
	}
	#mensagens .blocoBrancoMensagem p {
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 15px;
		margin: 15px 0 0;
	}
	#mensagens .blocoBrancoMensagem span a{
		color: var(--cor-vermelho);
	}


	#mensagens form{
		width: 100%;
		display: contents;
	}

	#mensagens form .input{
		width: 100%;
		border-radius: 5px;
		border: solid 1px #00000030;
		padding: 5px 10px;
		margin-top: 25px;
	}
	#mensagens form textarea.input{
		resize: none;
		min-height: 130px;
	}
	#mensagens form .btnVermelho{
		margin: 20px 0 5px;
	}




	#mensagens {
		background-color: var(--cor-cinza-claro);
		padding: 30px 0;
	}
	#mensagens .blocoBranco {
		background: var(--cor-branco);
		border-radius: 5px;
		width: 100%;
		box-shadow: 0 0 4px #0000001a;
		display: flex;
		align-items: center;
		padding: 10px;
	    gap: 15px;
		margin-bottom: 20px;
	}
	#mensagens .blocoBranco img{
		width: 40px;
	}
	#mensagens .blocoBranco h3 {
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 16px;
		font-weight: 900;
		margin: 0px;
	}
	#mensagens .blocoBranco p {
		margin: 0;
	}
	#mensagens .blocoBranco a {
		color: var(--cor-vermelho);
		font-family: var(--font-titulo);
		font-weight: 700;
		font-size: 15px;
	}

/***************************************************************************
        Contato > Mapas
***************************************************************************/

	#localContato{
		background-color: var(--cor-cinza-claro);
	    padding: 30px 0;
	}
	#localContato .blocBranco{
		background: var(--cor-branco);
		border-radius: 5px;
	    width: 100%;
		box-shadow: 0 0 4px #0000001a;
		display: flex;
	    flex-wrap: wrap;
		min-height: 210px;
	}
	#localContato .blocBranco .col-lg-4{
		padding: 30px 15px;
	    align-content: center;
	}
	#localContato .blocBranco .col-lg-8{
		padding: 0px 0;
	}
	#localContato .blocBranco h2{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 27px;
		font-weight: 900;
		margin: 0px;
	}
	#localContato .blocBranco h2 img{
	    width: 45px;		
	}
	#localContato .blocBranco p{
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-weight: 200;
		font-size: 15px;
		margin: 15px 0 0;
	}
	#localContato .blocBranco p b{
		font-weight: 800;
	}
	#localContato .blocBranco iframe{
		min-height: 300px;
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
	    margin-bottom: -6px;
	}

/***************************************************************************
        Sobre Nós > Especialistas
***************************************************************************/

	#especialistas{
		background-color: var(--cor-cinza-claro);
		padding: 50px 0;
	}
	#especialistas .areaTexto span {
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#especialistas .areaTexto h2 {
		color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 28px;
		font-weight: 900;
		margin: 0px;
		line-height: 30px;
	}
	#especialistas .areaTexto p{
		font-weight: 400;
		font-size: 14px;
	}
	#especialistas .areaBox{
		background: var(--cor-branco);
		padding: 15px;
		border-radius: 10px;
	    height: 100%;
		box-shadow: 0 0 10px #0000001c;
	}
	#especialistas img{
	    width: 50px;
	}
	#especialistas h3{
		color: var(--cor-vermelho);
		font-size: 16px;
		font-family: var(--font-titulo);
		font-weight: 700;
		margin: 15px 0 10px;
	}
	#especialistas .areaBox p,
	#especialistas .areaBox li{
		font-weight: 400;
		font-size: 15px;
		line-height: 20px;
	}
	#especialistas .areaBox ul{
		padding: 0 0 0 20px;
	}

/***************************************************************************
        Sobre Nós > Vantagens
***************************************************************************/


	#vantagensSobre{
	    padding: 30px 0;
		background-color: var(--cor-preto);
	}
	#vantagensSobre .row{
		display: flex;
		gap: 30px;
		flex-wrap: wrap;
		justify-content: space-evenly;
		align-items: center;
	}
	#vantagensSobre .bloco{
		display: flex;
		align-self: center;
		justify-content: center;
		gap: 20px;
		padding: 15px;
	}
	#vantagensSobre .bloco img{
		align-self: center;
	}
	#vantagensSobre .bloco h2{
		color: var(--cor-branco);
		font-family: var(--font-titulo);
		font-size: 19px;
		font-weight: 700;
		margin: 0;
	}
	#vantagensSobre .bloco p{
		color: var(--cor-branco);
		margin: 0;
		font-family: var(--font-texto);
		font-weight: 200;
		max-width: 160px;
	}

/***************************************************************************
        Documentos > Acesso
***************************************************************************/

	#acesso{
		background-color: var(--cor-branco);
		padding: 30px 0px;
	}

	#acesso .icon{
		display: flex;
		align-items: center;
		justify-content: space-evenly;
	}
	#acesso .icon span{
		width: 25px;
		height: 25px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: var(--cor-vermelho);
		border-radius: 100%;
		color: var(--cor-branco);
		font-family: var(--wp--preset--font-size--huge);
		font-size: 14px;
	}
	#acesso .icon img{
		width: 40px;
		filter: brightness(0);
	}
	#acesso .col-lg-12 span{
		color: var(--cor-vermelho);
		font-weight: 700;
		font-size: 14px;
		font-family: var(--font-titulo);
	}
	#acesso .col-lg-12 h2{
	    color: var(--cor-preto);
		font-family: var(--font-titulo);
		font-size: 35px;
		font-weight: 900;
		margin: 0px;
		line-height: 40px;
	}
	#acesso .col-lg-4{
		gap: 15px;
		display: grid;
		padding: 30px 15px;
	}
	#acesso h3{
		margin: 0;
		font-family: var(--font-texto);
		font-size: 17px;
		font-weight: 800;
		justify-self: center;
	}
	#acesso p{
		max-width: 220px;
		margin: 0;
		justify-self: center;
		text-align: center;
	}




/***************************************************************************
        Footer
***************************************************************************/

	footer{
		background-color: #000000;
		padding: 50px 0 15px;
	}

	footer #logo img{
		width: 100%;
		max-width: 160px;
	}
	footer #logo span{
		color: var(--cor-branco);
		display: block;
		font-size: 13px;
		max-width: 220px;
		margin: 20px 0 30px;
	}
	footer h2 {
		color: var(--cor-branco);
		margin: 0px;
		max-width: 440px;
		margin-bottom: 0px;
		margin-top: 0px;
		font-family: var(--font-titulo);
		font-size: 16px;
		font-weight: 600;
	}

	footer ul{
		padding: 0;
		margin: 15px 0;
		gap: 10px;
		display: flex;
		flex-direction: column;
	}
	footer ul li{
		display: block;
	}
	footer ul li a{
		color: var(--cor-branco);
		display: block;
		font-size: 16px;
	}
	footer #direitos{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		align-items: center;
		align-content: center;
		margin: 30px 0 15px;
	}

	footer #direitos p{
		color: var(--cor-branco);
		margin: 0;
		display: flex;
	}

	footer #direitos img{
		width: 140px;
		margin-left: 10px;
	}



/***************************************************************************
        Responsidade
***************************************************************************/

	@media (max-width: 1199px){
		#porqueHome .row > .col-xl-3:nth-child(3)::before{
			background: transparent;
		}
	}
	
	@media (max-width: 1125px){
		nav ul.desktop{
		    gap: 20px;
		}
		nav ul.desktop li.botao a {
		    padding: 8px 8px;
		}
	}

	@media (min-width: 992px) {
		.mobile {
			display: none !important;
		}
	}

	@media (max-width: 991px){
		.mobile {
			display: block;
		}
		.desktop {
			display: none !important;
		}


		nav{
			background: #000000d6;
			transition: ease .5s all;
			z-index: 10;
		}
		nav.navbar .mobile .hamburguer-bt {
			display: inline-block;
			height: fit-content;
			min-height: 32px;
			margin: 27px 15px;
			float: right;
		}

		nav  .mobile .hamburguer-bt .hamburguer_line {
			background: var(--cor-branco);
			width: 30px;
			height: 4px;
			margin: 5px 0;
			transition: ease all .5s;
		}

		nav  .mobile .hamburguer-bt.ativo .hamburguer-top {
			transform: rotate(45deg);
			margin-top: 11px;
		}

		nav  .mobile .hamburguer-bt.ativo .hamburguer-middle {
			opacity: 0;
		}

		nav  .mobile .hamburguer-bt.ativo .hamburguer-bottom {
			transform: rotate(-45deg);
			margin-top: -18px;
		}


		header #opt_menu {
			position: fixed;
			height: calc(100% - 86px);
			width: 320px;
			background: var(--cor-branco);
			z-index: 99;
			right: -150%;
			top: 86px;
			padding: 10px;
			display: block;
			transition: ease .5s all;
			overflow: auto;
		}

		header #opt_menu .navbar-nav li a {
			color: var(--cor-cinza);
			font-size: 20px;
			font-weight: 500;
			transition: ease .5s all;
		}

		header #opt_menu .navbar-nav li a:hover {
			color: var(--cor-branco);
		}

		header #opt_menu .area-btn a {
			margin: 0 auto;
		}

		header #opt_menu.ativo {
			right: 0;
		}
		header .fundo_menu {
			background: #00000096;
			transition: ease .5s all;
			width: 100%;
			height: 100%;
			top: 86px;
			right: -100%;
			position: fixed;
			z-index: 89;
		}

		header .fundo_menu.ativo {
			right: 0;
		}

		header.drop .fundo_menu {
			top: 86px;
		}
			
		header #opt_menu .navbar-brand {
			width: 100%;
			margin: 0;
			text-align: -webkit-center;
		}

		header #opt_menu .nav-item {
			text-align: center;
			padding: 10px;
			text-transform: uppercase;
		}

		header.drop #opt_menu,
		header.drop .fundo_menu {
			top: 86px;
		}


		#opt_menu ul {
			display: contents;
		}

		#opt_menu ul a {
			color: var(--cor-beje);
			text-transform: uppercase;
			font-size: 16px;
			font-weight: 600;
			margin: 0 10px;
		}

		#opt_menu .social {
			text-align: center;
			margin: 20px 0 0;
		}

		#opt_menu form {
			text-align: center;
		}

		#opt_menu form input {
			border: solid 1px var(--cor-cinza);
			margin: 15px 0;
		}

		#opt_menu li {
			display: block;
		}
		#opt_menu li a{
			background: var(--cor-cinza-claro);
			margin: 0 0 10px 0;
			padding: 8px;
			min-height: 39px;
			display: flex;
			align-items: center;
		}
		#opt_menu .submenu ul a{
			margin-top: -10px;
			margin-left: 20px;
		}
		#opt_menu li a img{
			width: 25px;
			margin-right: 10px;
		}
		#banner .mobile{
			align-items: center;
			padding: 30px 0;
		}
		#banner .logoImg{
			max-width: 300px;
		}
		#banner h2 {
			font-size: 35px;
			line-height: 35px;
		}
		#vantagens .bloco h2{
			max-width: 140px;
		}
		
		#servicosHome h2 {
			margin-bottom: 15px;
		}

		#porqueHome{
			background-image: none;
			background: linear-gradient(140deg,rgba(155, 8, 12, 1) 0%, rgba(102, 4, 7, 1) 50%, rgba(155, 8, 12, 1) 100%);
		}
		#porqueHome .col-lg-4{
		    text-align: -webkit-center;
		}
		#porqueHome h2{
		    margin-bottom: 50px;
		}

		#funcionaHome h2 {
			margin-bottom: 50px;
		}

		#prontoHome .col-lg-5{
			border-right: solid #e1061300 1px;
			border-bottom: solid var(--cor-vermelho) 1px;
			padding: 0px 15px 15px;
			margin-bottom: 45px;
		}

		footer .col-md-6{
			margin-bottom: 50px;
		}

		#especialistas .col-lg-4{
			margin-bottom: 30px;
		}


		#bannerInterno{
			background-image: url('https://mixdocumentos.geovaniassis.dev.br/wp-content/uploads/2026/06/banner.png');
			padding: 50px 20px;
		    text-align-last: center;
		}
		#bannerInterno img{
			margin-bottom: 30px;
		}
		#bannerInterno .botao{
		    align-self: center;
		}

	}

	@media (max-width: 767px){
		#porqueHome .row > .col-xl-3 + .col-xl-3::before  {
			content: "";
			position: absolute;
			left: 30%;
			top: 0;
			width: 40%;
			height: 1px;
			background: #d9d9d9;
		}
		#porqueHome .txt-center {
			padding: 25px;
		}
		#prontoHome .areaContatos {
			display: flex;
			justify-content: space-around;
			flex-direction: column;
			gap: 30px;
		}
	}

	@media (max-width: 640px){
	}

	@media (max-width: 454px){
	}