/******************************
* 
*  Destaques
* 
* ****************************/

.containerDestaque {
	display: grid;
	max-width: 100vw !important;
	width: 100vw !important;
	overflow: hidden !important;
 }

.containerDestaque .item {
	display: grid;
	gap: 0;
	grid-template-columns: 50% 50%;
	max-width: inherit !important;
	overflow: inherit !important;
	width: inherit !important;
 }

.containerDestaque .item:nth-child(1n) {
	grid-template-areas: "Imagem Texto";
}

.containerDestaque .item:nth-child(2n) {
	grid-template-areas: "Texto Imagem";
}

.containerDestaque .item .imagem {
	width: 100%;
	aspect-ratio: 3 / 2;
	height: 100%;
	grid-area: Imagem;
	z-index: 2;
	display: grid;
	grid-template-areas: 'area';
	justify-items: center;
	align-items: center;
	justify-content: center;
	overflow: hidden !important;
	align-content: center;
}

.containerDestaque .item.sobre.incorporadora-golden-tulip-canela .imagem:before {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: .8;
	z-index: 1;
}

.containerDestaque .item .imagem img.BG {
	display: block;
	object-fit: cover;
	width: 100%;
	height: 100%;
	object-position: center;
    z-index: 0;
}

.containerDestaque .item .imagem img.logo {
	max-width: 600px !important;
	object-fit: contain;
	height: max-content;
	display: block;
	width: calc( 80% - var(--paddingPadrao) );
	z-index: 2;
}

.containerDestaque .item .imagem img {
 	grid-area: area;
}

.containerDestaque .item .texto {
	display: grid;
	align-content: center;
	justify-content: center;
	gap: var(--paddingMenor);
	padding: var(--paddingPadrao);
	z-index: 1;
	position: relative;
}

.containerDestaque .item .texto .titulo,
.containerDestaque .item .texto .titulo h2 {
	max-width: max-content;
	width: 100%;
	position: relative;
}

.containerDestaque .item.elegancia-e-conforto-na-serra-gaucha .texto {
	max-width: 670px;
	justify-self: center;
}

.containerDestaque .item .texto .topicos {
	display: grid;
	align-content: center;
	justify-content: flex-start;
	gap: var(--gap);
}

.containerDestaque .item .texto h3 {
	display: grid;
	grid-template-columns: repeat(2, auto);
	line-height: 1.4em !important;
	height: max-content;
    gap: var(--gap);
    align-content: center;
    align-items: center;
    justify-content: start;
    font-family: var(--fontePadrao) !important;
    font-size: var(--textoCorrido) !important;
}

.branco .containerDestaque .item .texto h3 {
	color: var(--corBranca) !important;
}

.containerDestaque .item .texto h2 {
	font-size: var(--H3) !important;
	display: grid;
	line-height: 1.4em !important;
	height: max-content;
	gap: var(--gap);
	align-content: center;
	align-items: center;
	justify-content: start;
	font-family: var(--fontePadrao) !important;
    text-wrap: balance;
}

.containerDestaque .item.incorporadora-golden-tulip-canela .texto h2 {
	font-family: var(--fontePadrao) !important;
}

.containerDestaque .item .texto h3:before {
    content: "";
    display: block;
    width: var(--textoCorrido);
    height: var(--textoCorrido);
    background-image: var(--favicon);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.containerDestaque .item.incorporadora-golden-tulip-canela .texto h3:before {
	background-image: var(--paternSchwanck);
}

.branco .containerDestaque .item .texto h3:before {
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7495%) hue-rotate(338deg) brightness(99%) contrast(103%);
}

@media only screen and (max-width: 980px) {
	.containerDestaque .item {
		grid-template-columns: 100%;
	}

	.containerDestaque .item:nth-child(1n),
	.containerDestaque .item:nth-child(2n) {
		grid-template-areas:
		"Imagem"
		"Texto";
	}

	.containerDestaque .item .texto {
		display: grid;
		justify-content: center;
		padding: var(--paddingPadrao) 0;
		margin: 0 auto;
		width: 90%;
	}

	.containerDestaque .item .texto .topicos {
		grid-template-columns: repeat(2, auto);
	}

	.containerDestaque .item .texto h3:before {
		width: var(--h6);
		height: var(--h6);
	}
}

@media only screen and (max-width: 767px) {
	.containerDestaque .item .texto h3 {
		font-size: var(--H6) !important;
	}
}