/* ####################################################
   CAPA DA HOME
   Imagem de fundo com o formulario de busca em card
   na lateral esquerda.
   #################################################### */

/* A altura sai da altura da tela de quem acessa, menos o menu do topo e
   uma faixa de 230px, para o fim da foto e o comeco da secao seguinte
   aparecerem sem rolar. Os limites evitam exageros em telas muito baixas
   ou muito altas. */

.busca-home,
.busca-home picture{
	height:calc(100vh - 230px);
	min-height:0;
}

/* A largura maxima fixa impede o card de crescer junto com a tela, que e o
   que fazia ele ficar bem maior num monitor grande. */

/* A grade do formulario aplica margem negativa nas laterais, que a coluna
   normalmente compensa com espacamento interno. Como aqui a coluna nao tem
   esse espacamento, a margem e zerada para o bloco nao sair do lugar. */

.busca-home form.row{
	margin-left:0;
	margin-right:0;
}

.hc-coluna{
	padding-left:0;
	padding-right:0;
	max-width:420px;
}

.hc-foto{
	display:none;
}

/* As abas usam posicionamento flutuante no estilo antigo, o que fazia o
   card ser desenhado por cima delas. Aqui elas voltam a ocupar o espaco
   delas e o card comeca abaixo. */

.hc-coluna .check-radio{
	float:none;
	clear:both;
}

/* Os campos e o botao sao flutuantes no estilo antigo. O flow-root faz o
   card crescer junto com eles, para o fundo cobrir o formulario inteiro. */

.hc-card{
	clear:both;
	display:flow-root;
	padding:1.25rem;
}

.hc-titulo{
	margin-bottom:1.25rem;
}

.hc-titulo h1{
	display:block;
	width:100%;
	line-height:1.15;
	font-size:min(max(1.4rem,3vw),2.1rem);
}

.hc-linha{
	float:left;
	width:100%;
	margin-bottom:1rem;
}

.hc-linha:last-child{
	margin-bottom:0;
}

/* Os tres controles do formulario ficam com a mesma altura. O campo de
   busca usa altura minima porque ele cresce quando a pessoa escolhe mais
   de um bairro. */

.hc-card .bn-caixa{
	min-height:52px;
}

.hc-card .bn-tcaixa{
	height:52px;
}

.hc-bt{
	width:100%;
	height:52px;
	padding:0;
	font-size:1rem;
	font-weight:600;
	border-radius:5px;
}

/* ####################################################
   Telas menores: a capa deixa de ter altura fixa para
   o card nao ficar cortado.
   #################################################### */

@media (max-width:992px){

	/* No celular a foto vira uma faixa no topo e o buscador fica abaixo
	   dela, em fundo branco, em vez de ficar por cima da imagem. */

	.busca-home{
		background-image:none !important;
		height:auto !important;
		min-height:0;
		display:block;
		padding:0 0 2rem;
	}

	.hc-foto{
		display:block;
		width:100%;
		height:180px;
		background-repeat:no-repeat;
		background-size:cover;
		background-position:center;
		margin-bottom:1.5rem;
	}

	.hc-coluna{
		max-width:none;
	}

	.hc-titulo h1{
		font-size:1.3rem;
	}

	/* A assinatura da marca sempre quebra em duas linhas. */
	.title-home h1 br{
		display:block;
	}
}
