/*

	Esconde elementos por padrão

 */

#diferenciais .duas-folhas,
#diferenciais h1 br,
#perguntas-frequentes .folhas-amora { display: none; }

/*

	Seção banner

 */

#banner-principal .bg-esquerda {
	max-width: 80%;
	width: 300px;
}

/*

	Seção Diferenciais

 */

#diferenciais h1 { margin: 15px 0 25px 0; }

#diferenciais .bg-uma-folha { width: 100px; }

/*

	Seção perguntas frequentes

 */

#perguntas-frequentes {
	position: relative;
	padding-top: 100px;
}

#perguntas-frequentes .container { max-width: 700px; }

#perguntas-frequentes h1 { margin: 0 0 25px 0; }

#perguntas-frequentes p:last-child { padding-bottom: 5px; }

#perguntas-frequentes .galho {
	position: absolute;
	top: 0;
	left: -40px;
	width: 200px;
}

/*

	Seção Galeria

 */

#galeria { margin-top: 70px; }

.galeria .lado-esquerdo .item { height: 450px; }
.galeria .lado-direito > .item { height: 150px; }
.galeria .lado-direito .row-galeria .item { height: 250px; }

/*

	Modal Galeria

 */
#modal-video-galeria iframe {
	max-width: 100%;
	width: 100%;
	height: 30%;
}

#modal-video-galeria > img {
	object-fit: contain;
	height: 85%;
	width: 100%;
}

/*

	Media queries

 */

@media screen and (min-width: 576px) {

	/*

		Modal Galeria

	 */
	#modal-video-galeria iframe { height: 35%; }
}

@media screen and (min-width: 768px) {

	/*

		Seção inicial

	 */
	#banner-principal .bg-esquerda { width: 450px; }

	/*

		Modal Galeria

	 */
	#modal-video-galeria iframe { height: 43%; }
}

@media screen and (min-width: 1024px) {

	/*

		Seção inicial

	 */
	#banner-principal .lado-esquerdo { max-width: 450px; }

	#banner-principal .lado-direito {
		top: 18%;
		right: -7%;
		bottom: auto;
		width: 55%;
	}

	#container-principal > .bg-laranja { background-color: #dd8a0e; }

	/*

		Diferencias

	 */
	#diferenciais .bg-uma-folha { display: none; }

	#diferenciais .duas-folhas {
		position: absolute;
		display: block;
		width: 150px;
		left: -30px;
	}

	#diferenciais h1 { margin-top: 80px; }

	#diferenciais h1 br { display: initial; }

	#diferenciais .cards-vazados { justify-content: space-between; }

	#diferenciais .cards-vazados .card {
		margin: 15px 0;
		width: 275px;
		height: 275px;
	}

	/*

		Perguntas Frequentes

	 */
	#perguntas-frequentes {
		position: relative;
		margin-top: 100px;
	}

	#perguntas-frequentes .folhas-amora {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 150px;
	}

	#perguntas-frequentes .galho { top: 400px; }

	/*

		Galeria

	 */
	#galeria { margin-top: 150px; }

	#galeria .galeria {
		display: flex;
		justify-content: space-between;
	}

	#galeria .galeria .lado-esquerdo {
		width: 40%;
		flex: 40%;
		margin-right: 30px;
	}

	#galeria .galeria .lado-direito {
		width: 60%;
		flex: 60%;
	}

	#galeria .lado-direito .row-galeria {
		display: flex;
		justify-content: space-between;
	}

	#galeria .galeria .item { margin-bottom: 0; }

	#galeria .galeria .lado-esquerdo .item { height: 550px; }

	#galeria .galeria .lado-direito > .item { height: 260px; }

	#galeria .galeria .lado-direito .row-galeria .item {
		height: 260px;
		margin: 30px 30px 30px 0;
	}

	#galeria .galeria .lado-direito .row-galeria .item:last-child { margin-right: 0; }

	/*

		Modal Galeria

	 */
	#modal-video-galeria iframe { height: 75%; }
}

@media screen and (min-width: 1200px) {

	/*

		Diferenciais

	 */
	#diferenciais { margin-top: 100px; }

	#diferenciais .cards-vazados .card {
		max-width: none;
		width: 320px;
		height: 320px;
		padding: 30px 35px;
	}

	#container-principal > .bg-laranja { height: 800px; }

	#banner-principal .lado-direito {
		top: 23%;
		right: -12%;
		bottom: auto;
		width: 60%;
	}

	/*

		Perguntas frequentes

	 */
	#perguntas-frequentes .galho { width: 225px; }

	#perguntas-frequentes .folhas-amora {
		top: -30px;
		right: 30px;
		width: 180px;
	}

	/*

		CTA - Cliente

	 */
	#cta-cliente {
		padding: 100px 110px;
		width: 80%;
	}
}

@media screen and (min-width: 1400px) {

	/*

		Seção banner inicial

	 */
	#container-principal > .bg-laranja {
		width: 600px;
		height: 900px;
	}

	#banner-principal .lado-direito {
		top: 15%;
		width: 65%;
	}

	/*

		Diferenciais

	 */
	#diferenciais h1 { margin-bottom: 50px; }

	#diferenciais .duas-folhas { width: 170px; }

	#diferenciais .cards-vazados .card {
		max-width: 33%;
		width: 485px;
		height: 300px;
		padding: 30px 100px;
	}

	/*

		Perguntas frequentes

	 */
	#perguntas-frequentes h1 { margin-bottom: 50px; }

	#perguntas-frequentes .folhas-amora { right: 100px; }

	/*

		Galeria

	 */
	#galeria .galeria .lado-esquerdo .item { height: 750px; }

	#galeria .galeria .lado-direito .item { height: 360px !important; }

	/*

		Modal Galeria

	 */
	#modal-video-galeria iframe { height: 85%; }
}