﻿* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body
{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: var(--fonte);
	font-size:0px;
	width:100%;
	height:100%;
	scroll-behavior: smooth;
}

body
{
	background-color: var(--cor_fundo_bg);
	color: var(--dark);
	line-height: 1.6;
	font-family: var(--fonte);	
	
	display: flex;
	flex-direction: column;
}


.main
{
	/*max-width: 90%;*/ /* limita a 1000px */
	width: 100%;       /* garante que não passe disso */		
	flex: 1; /* Faz o conteúdo ocupar todo o espaço disponível */		
	font-size:var(--tam_fonte_18);
	/*padding-bottom:10px;*/
}

.main_conteudo
{
	width:calc(100% - 40px);
}

.tamanho_conteudo
{
	width:90%;
}

.footer
{
	background-color: var(--dark);
	color: #fff;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 10px;
	font-size:var(--tam_fonte_16);
}

.titulo_conteudo
{
	/*line-height:1.0;*/
	text-align:center;
}

.galeria_blocos_meio
{
	position:relative;
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

.blocos_meio_01
{
	position:relative;
	/*width:calc(100% - 0px);*/
	width:calc(100% - 0px);
	padding:0px;
	line-height:1.1;
	/*
	background:var(--branco);
	border-radius:var(--border-radius);
	*/
	/*border:1px solid var(--light-gray);*/
	text-align:left;
	font-size:var(--tam_fonte_18);
	color:var(--dark);
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
}

.blocos_meio_011
{
	position:relative;
	/*width:calc(100% - 0px);*/
	width:calc(80% - 20px);
	padding:0px;
	line-height:1.1;
	
	background:var(--branco);
	/*
	border-radius:var(--border-radius);
	*/
	/*border:1px solid var(--light-gray);*/
	text-align:left;
	font-size:var(--tam_fonte_18);
	color:var(--dark);
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
}

.blocos_meio_02
{
	/*
	position:relative;
	width:calc(25% - 20px);
	padding:10px;
	background:var(--branco);
	border-radius:var(--border-radius);
	border:1px solid var(--light-gray);
	text-align:center;
	font-size:var(--tam_fonte_18);
	color:var(--dark);
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
	*/
}

/* Box Sizing global para evitar que padding quebre larguras */


/* O conteiner pai junta o lado esquerdo com o lado direito */
.galeria_blocos_meio {
    display: flex;
    gap: 20px;
    width: 100%;
    align-items: flex-start;
}

/* Lado Esquerdo: Fixado em 270px */
.bloco_lateral_fixo {
    width: 100%;
    flex-shrink: 0; /* Impede que o flex reduza o tamanho deste bloco */
	line-height:1.1;
}

.linha_destaque {
    background-color: #4A6CF7;
    height: 3px;
    width: 50%;
    margin: 10px 0;
}

/* Lado Direito: Ocupa todo o resto do espaço e organiza os cards */
.container_cards {
    flex: 1; /* Pega todo o espaço restante */
    display: flex;
    flex-wrap: wrap; /* Permite que os cards dobrem de linha */
    gap: 10px;
	
}

/* Cada Card individual dentro do lado direito */
.blocos_meio_02 
{
    /* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
    width: calc(50% - 5px); 
    padding: 10px;
    background: var(--branco, #fff);
    border-radius: var(--border-radius, 8px);
    border: 1px solid var(--light-gray, #ccc);
	/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
    text-align: center;
	line-height:1.3;
	
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
	
	display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
}

.blocos_meio_02_3
{
    /* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
    width: calc(50% - 5px); 
    padding: 10px;
    background: var(--branco, #fff);
    border-radius: var(--border-radius, 8px);
    border: 1px solid var(--light-gray, #ccc);
	/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
    text-align: center;
	line-height:1.3;
	
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
	
	display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
}

.blocos_meio_02_1
{
	/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
    width: calc(50% - 5px); 
    padding: 0px;
	color:var(--primary);
	/*
    background: var(--branco, #fff);
    border-radius: var(--border-radius, 8px);
    border: 1px solid var(--light-gray, #ccc);
	*/
	/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
    text-align: center;
	line-height:1.3;
	
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
   	will-change: transform;
   	backface-visibility: hidden;
}

.bolinha
{
	position:relative;
	width:60px;
	height:60px;
	border-radius:50%;
	background-color: var(--light-gray);
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--primary);
	font-family: var(--fonte);
	font-size:40px;
}

.direcao_linha
{
	display: flex;
	justify-content: center;
	align-items: center;
}

.bt_ver_testes
{
	margin:0;
	outline:0;
	border:0;
	width:100%;
	background:transparent;
	font-family: var(--fonte);
	font-size:16px;
	color:var(--dark);
	cursor:pointer;
	font-weight:bold;
		
	transition: var(--transition);
	transform-origin: center center;
	will-change: transform;
	backface-visibility: hidden;
}

.ajusta_info
{
	flex-grow: 1;
}

.links_meio
{
	position: relative;
	text-decoration: none;
	color: #0077cc;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	font-size: var(--tam_fonte_15);
	color: var(--primary);
	font-weight:bold
}

.bloco_100
{
	width: calc(100% - 0px); 
}

.blocos_meio_02_3_tst
{
	/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
	width: calc(50% - 5px); 
	padding: 0px;
	background: var(--branco, #fff);
	border-radius: var(--border-radius, 8px);
	border: 1px solid var(--light-gray, #ccc);
	/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
	text-align: center;
	line-height:1.3;
	
	overflow:hidden;
		
	-webkit-transition: var(--transition);
	transition: var(--transition);
	transform-origin: center center;
	will-change: transform;
	backface-visibility: hidden;
	
	display: flex;		
	flex-direction: column;
	justify-content: space-between; 
	box-sizing: border-box;		
	flex-wrap: wrap;
}
	
.tst_img_fundo_ini
{
	position:relative; 
	width:100%; 
	height:150px; 
	/*background-color:#fffdef;*/
	/*
	background-color:#FFF;
	background-repeat:no-repeat; 
	background-size:100%;
	border-top-left-radius:10px; 
	border-top-right-radius:10px
	*/
	/*background-position: center top;*/
	/*
	background-position: center;
	overflow:hidden;
	*/
}
	
.tst_img_fundo_ini_img
{
	width:100%;
	aspect-ratio:16/10;
	object-fit:cover;
	object-position:center 25%;
	/*border-radius:12px 12px 0 0;*/
	height:150px
}

.botao_azul
{
	outline:0;
	border:0;
	margin:0;
	height:50px;
	background-color: var(--primary);
	border-radius:12px;
	padding-left:20px;
	padding-right:20px;
	
	font-family: var(--fonte);
	font-size:var(--tam_fonte_16);
	color:var(--branco);
	
	cursor:pointer;
	transition:  0.3s ease;
	
	display: flex;
	justify-content: center;
	align-items: center;
}

.botao_azul:hover, .botao_azul:focus
{
	background-color: var(--verde-primario);
}

/*=====================================================================*/

/* Works on Firefox */
* {
  scrollbar-width: thin;
  /*scrollbar-color: linear-gradient(135deg, var(--primary), var(--secondary)) #111;*/
  /*scrollbar-color: var(--secondary) var(--dark);*/
  scrollbar-color: var(--primary) var(--dark);
}

/* Works on Chrome, Edge, and Safari */
html::-webkit-scrollbar, body::-webkit-scrollbar {
  width: 12px;
}

html::-webkit-scrollbar-track, body::-webkit-scrollbar-track {
  background: #000;
}

html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
  /*background: linear-gradient(135deg, var(--primary), var(--secondary));*/
  background: var(--primary);
  border-radius: 20px;
  border: 3px solid #111;
}

body::-moz-selection 
{ /* Code for Firefox */
  color: #FFF;
  background: #28a745;
}

body::selection 
{
  color: #FFF;
  background: #28a745;
}

@media screen and (min-width: 961px) and (max-width: 1119px)
{
	
	.main_conteudo
	{
		width:calc(100% - 40px);
	}
	
	.tamanho_conteudo
	{
		width:calc(100% - 40px);
	}
	
	
	.tam_meio_div
	{
		flex: 1; /* Faz o filho crescer e ocupar todo o espaço restante do pai */
		height:100%;
	}
	
	.titulo_conteudo
	{
		/*line-height:1.0;*/
		text-align:left;
	}
	
	.bloco_lateral_fixo 
	{
		width: 270px;
		flex-shrink: 0; /* Impede que o flex reduza o tamanho deste bloco */
		line-height:1.1;
	}
	
	.blocos_meio_02 
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 5px); 
		padding: 10px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	.blocos_meio_02_3
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 5px); 
		padding: 10px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	.blocos_meio_02_1 
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 5px); 
		padding: 0px;
		cursor:pointer;
		color:var(--dark);
		/*
		background: var(--branco, #fff);
		
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		*/
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
	}
	
	.direcao_linha
	{
		display: flex;
		justify-content: center;
		justify-content: flex-start;
	}
	
	.blocos_meio_02:hover, .blocos_meio_02_1:hover
	{
		transform: scale(1.05);
	}
	
		.blocos_meio_02:hover, .blocos_meio_02_1:hover, .blocos_meio_02_3:hover, .blocos_meio_02_3_tst:hover
	{
		transform: scale(1.05);
	}
	
	.blocos_meio_02_1:hover
	{
		color:#4A6CF7;
	}
	
	.bt_ver_testes
	{
		margin:0;
		outline:0;
		border:0;
		width:100%;
		background:transparent;
		font-family: var(--fonte);
		font-size:16px;
		color:var(--dark);
		cursor:pointer;
		font-weight:bold;
		
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
	}
	
	.bt_ver_testes:hover, .bt_ver_testes:focus
	{
		transform: scale(1.05);
		/*text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);*/
		/*font-weight:bold;*/
	}
	
	.ajusta_info
	{
		flex-grow: 1;
	}
	
	.seta2:hover
	{
		transform: translateX(4px);
	}
	
	.links_meio
	{
		position: relative;
		text-decoration: none;
		color: #0077cc;
		font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		font-size: var(--tam_fonte_15);
		color: var(--primary);
		/*font-weight:bold*/
	}	
	
    .links_meio::after 
	{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2px;
		width: 0%;
		height: 2px;
		background-color: currentColor;
		transition: width 0.3s ease;
    }

    .links_meio:hover::after, .links_meio:focus::after
	{
		width: 100%;
    }
	
	.blocos_meio_02_3_tst
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 5px); 
		padding: 0px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		overflow:hidden;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	.tst_img_fundo_ini
	{
		position:relative; 
		width:100%; 
		height:150px; 
		/*background-color:#fffdef;*/
		/*
		background-color:#FFF;
		background-repeat:no-repeat; 
		background-size:100%;
		border-top-left-radius:10px; 
		border-top-right-radius:10px
		*/
		/*background-position: center top;*/
		/*
		background-position: center;
		overflow:hidden;
		*/

	}
	
	.tst_img_fundo_ini_img
	{
		width:100%;
		aspect-ratio:16/10;
		object-fit:cover;
		object-position:center 25%;
		/*border-radius:12px 12px 0 0;*/
		height:150px
	}
	
}
@media screen and (min-width: 1120px)
{
	
	.main_conteudo
	{
		width:1100px;
	}
	
	.tamanho_conteudo
	{
		width:1100px;
	}
	.titulo_conteudo
	{
		/*line-height:1.0;*/
		text-align:left;
	}
	
	.bloco_lateral_fixo 
	{
		width: 270px;
		flex-shrink: 0; /* Impede que o flex reduza o tamanho deste bloco */
		line-height:1.1;
	}
	
	.blocos_meio_02 
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(25% - 8px); 
		padding: 10px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		/*		
		flex: 1;
		*/
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	.blocos_meio_02_3
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 4px); 
		padding: 10px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	
	.blocos_meio_02_1 
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(25% - 8px); 
		padding: 0px;
		cursor:pointer;
		color:var(--dark);
		/*
		background: var(--branco, #fff);
		
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		*/
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
	}
	
	.direcao_linha
	{
		display: flex;
		justify-content: center;
		justify-content: flex-start;
	}
	
	.blocos_meio_02:hover, .blocos_meio_02_1:hover, .blocos_meio_02_3:hover, .blocos_meio_02_3_tst:hover
	{
		transform: scale(1.05);
	}
	
	.blocos_meio_02_1:hover
	{
		color:#4A6CF7;
	}
	
	.bt_ver_testes
	{
		margin:0;
		outline:0;
		border:0;
		background:transparent;
		font-family: var(--fonte);
		font-size:16px;
		color:var(--dark);
		cursor:pointer;
		font-weight:bold;
		
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
	}
	
	.bt_ver_testes:hover, .bt_ver_testes:focus
	{
		transform: scale(1.05);
		/*text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);*/
		/*font-weight:bold;*/
	}
	
	.ajusta_info
	{
		flex-grow: 1;
	}
	
	.seta2:hover
	{
		transform: translateX(4px);
	}
	
	.links_meio
	{
		position: relative;
		text-decoration: none;
		color: #0077cc;
		font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		font-size: var(--tam_fonte_15);
		color: var(--primary);
		/*font-weight:bold*/
	}
	
    .links_meio::after 
	{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2px;
		width: 0%;
		height: 2px;
		background-color: currentColor;
		transition: width 0.3s ease;
		outline:none;
    }

    .links_meio:hover::after, .links_meio:focus::after
	{
		width: 100%;
		outline:none;
		margin:0;
		border:0;
    }
	
	.blocos_meio_02_3_tst
	{
		/* Faz com que cabem 2 cards por linha no lado direito (descontando o gap) */
		width: calc(33% - 4px); 
		padding: 0px;
		background: var(--branco, #fff);
		border-radius: var(--border-radius, 8px);
		border: 1px solid var(--light-gray, #ccc);
		/*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
		text-align: center;
		line-height:1.3;
		
		overflow:hidden;
		
		-webkit-transition: var(--transition);
		transition: var(--transition);
		transform-origin: center center;
		will-change: transform;
		backface-visibility: hidden;
		
		display: flex;		
		flex-direction: column;
		justify-content: space-between; 
		box-sizing: border-box;		
		flex-wrap: wrap;
	}
	
	.tst_img_fundo_ini
	{
		position:relative; 
		width:100%; 
		height:150px; 
		/*background-color:#fffdef;*/
		/*
		background-color:#FFF;
		background-repeat:no-repeat; 
		background-size:100%;
		border-top-left-radius:10px; 
		border-top-right-radius:10px
		*/
		/*background-position: center top;*/
		/*
		background-position: center;
		overflow:hidden;
		*/

	}
	
	.tst_img_fundo_ini_img
	{
		width:100%;
		
		aspect-ratio:16/10;
		object-fit:cover;
		object-position:center 25%;
		/*border-radius:12px 12px 0 0;*/
		height:150px
	}
}