@font-face { font-family: 'Gotham Pro'; src: local('GothamPro'), url('GothamPro.woff2') format('woff2'), url('GothamPro.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; }

@font-face { font-family: 'Gotham Pro'; src: local('GothamPro-Black'), url('GothamPro-Black.woff2') format('woff2'), url('GothamPro-Black.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; }

:root {

	--star-yellow: url("data:image/svg+xml,%3Csvg width='21' height='20' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4617 0L12.9313 7.60081H20.9233L14.4577 12.2984L16.9273 19.8992L10.4617 15.2016L3.99603 19.8992L6.46569 12.2984L4.86374e-05 7.60081H7.99202L10.4617 0Z' fill='%23F2AC20'/%3E%3C/svg%3E");

	--yellow-selecao: #F2AC20;

	--blue-selecao: #3F70B5;

	--sel-extra: 20px;

	--sel-gotham: 'Gotham Pro', tahoma, sans-serif;
}

@media ( width > 1240px ){
	:root {
		--sel-extra: calc( ( 100vw - 1200px ) / 2 );
	}
}


#selecao { position: relative; padding-block: 120px 80px; background: var(--blue-selecao) url(field.webp) no-repeat center / cover; }
	#selecao::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 80px; background: url(grass.webp) repeat-x center; }
	#selecao::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 20px; background: url(gold.webp) repeat-x center; }

	#selecao .wrap { display: flex; flex-wrap: wrap; gap: 40px; position: relative; }
		#selecao .wrap::before { content: ''; display: block; position: absolute; top: -107px; right: 20px; width: 54px; height: 54px; background: url(novolar-icon.svg) no-repeat center / contain; }

		#selecao .intro { flex: 0 0 calc( 66.66% - 20px ); position: relative; display: flex; flex-wrap: wrap; gap: 40px; align-items: center; }
			#selecao .intro h1 { width: 360px; aspect-ratio: 5/3; background: url(logo-selecao.webp) no-repeat center / contain; text-indent: -9999rem; color: transparent; font-size: 1px; margin-bottom: -80px; position: relative; z-index: 3; margin-left: -80px; }
			#selecao .intro h2 { width: 180px; height: 79px; background: url(logo-mirante-jambreiro.svg) no-repeat center / contain; text-indent: -9999rem; color: transparent; font-size: 1px; margin-left: auto; }
			#selecao .intro ul { list-style: none; color: #fff; padding-left: 40px; position: relative; }
				#selecao .intro ul::before { content: ''; display: block; width: 0; height: 80%; position: absolute; top: 10%; left: 0; border-left: 1px solid #fff; }
				#selecao .intro li { font-family: var(--sel-gotham); font-size: 1.25rem; text-align: center; }
					#selecao .intro li:first-child strong { display: block; position: relative; font-size: 4rem; line-height: 1; }
						/* #selecao .intro li:first-child strong span { font-size: 4rem; } */
						#selecao .intro li:first-child::after { content: ''; display: block; width: 80%; margin: 8px 10% 4px; border-top: 1px solid #fff; }
					#selecao .intro li:nth-child(2) { font-weight: bold; }
			#selecao .intro picture { position: relative; padding-block: 20px; }
				#selecao .intro picture img { border-radius: 20px; }
				#selecao .intro picture::before,
				#selecao .intro picture::after { content: ''; display: block; position: absolute; left: 20px; width: calc( 100% - 40px ); height: 20px; background: url(faixa.webp) repeat-x center / cover; }
				#selecao .intro picture::before { top: 0; border-radius: 20px 20px 0 0; }
				#selecao .intro picture::after { bottom: 0; border-radius: 0 0 20px 20px; }

		#selecao h3 { position: absolute; top: 20px; right: 20px; font: bold 1.5rem/1.5 var(--sel-gotham); color: var(--yellow-selecao); padding: 4px 40px; background: var(--star-yellow) no-repeat left center, var(--star-yellow) no-repeat right center; text-align: center; width: calc( 33.33% - 32px ); text-transform: uppercase; }

		#selecao .text { order: 5; flex: 0 0 100%; position: relative; }
			#selecao .text p { font: normal 1.25rem/1.5 var(--sel-gotham); color: #fff; text-align: center; letter-spacing: 0; margin: 0; padding: 0; max-width: 100%; text-transform: uppercase; }
				#selecao .text p + p { font-weight: bold; }
			#selecao .text ul { list-style: none; display: flex; gap: 40px; align-items: center; justify-content: center; margin-top: 40px; }
				#selecao .text li { color: var(--yellow-selecao); font: bold 1rem/1.2 var(--sel-gotham); text-transform: uppercase; text-align: center; position: relative; flex-shrink: 0; text-shadow: 5px 5px 6px rgba(0, 0, 0, 0.50); }
					#selecao .text li strong { font-size: 2.5rem; display: block; }
					#selecao .text li::after { content: ''; display: block; width: 96px; height: 26px; background: url("data:image/svg+xml,%3Csvg width='96' height='26' viewBox='0 0 96 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M95.75 12.6252C95.4167 12.6252 95.0833 12.6252 94.75 12.6252C94.535 15.7001 90.822 17.4851 87.904 18.7909C75.2428 23.6757 61.3263 24.5805 47.75 24.7502C39.2238 24.7615 30.6934 24.2373 22.2839 22.8619C18.0962 22.163 13.9097 21.2574 9.89923 19.8806C6.15334 18.4338 1.09926 16.8014 0.5 12.6252C1.07824 8.43968 6.13572 6.77724 9.87865 5.31072C13.8876 3.91241 18.0743 2.98544 22.2632 2.2652C30.6752 0.847149 39.2123 0.280563 47.75 0.250183C61.354 0.35791 75.2633 1.17666 88.079 6.04485C91.026 7.39374 94.8945 9.00903 95.25 12.6252C94.9122 9.00344 91.0426 7.3633 88.0984 5.99879C75.289 1.06162 61.3721 0.174681 47.75 0.000183105C39.2003 -0.0109499 30.6472 0.514037 22.2011 1.89537C17.9943 2.59777 13.7868 3.50665 9.73455 4.89764C5.95897 6.41882 0.78509 7.81084 0 12.6252C0.764071 17.4489 5.94135 18.8709 9.71397 20.4117C13.7648 21.8243 17.9724 22.7545 22.1804 23.4783C30.629 24.9023 39.1887 25.4696 47.75 25.5002C61.3999 25.3876 75.3095 24.5867 88.2735 19.6662C91.2466 18.2586 95.2717 16.7882 95.75 12.6252ZM94.75 12.6252H95.75H95.25H94.75Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center; position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%); z-index: -1; }
				/* Último item: branco com separador (Pronto pra morar) */
				/* #selecao .text li:last-child { border-left: 1px solid #fff; padding-left: 20px; color: #fff; font-size: 2rem; flex-shrink: 1; }
					#selecao .text li:last-child::after { display: none; } */
			#selecao .text ul + p { margin-top: 20px; text-align: left; font-size: .75rem; font-weight: normal; }


		#selecao .form { flex: 0 0 calc( 33.33% - 20px ); margin-top: 80px; background: rgba( 0 0 0 / 50% ); color: #fff; padding: 20px; height: 100%; border-radius: 20px; }
			#selecao .form h2 { color: #fff; font-size: 1.25rem; line-height: 1.2; text-transform: uppercase; text-align: center; }
			#selecao .form form { display: flex; flex-direction: column; gap: 20px; margin-top: 20px; width: 100%; font-size: .875rem; padding: 0; background: transparent; }
				#selecao .form .field-wrap { flex: 0 0 100%; width: 100%; }
					#selecao .form label { color: #fff; display: block; margin: 0 0 4px 20px; font-family: var(--sel-gotham); }
					#selecao .form .text { font-family: var(--sel-gotham); font-size: .875rem; display: block; width: 100%; padding: 11px 17px; border: 1px solid #fff; background: transparent; color: #fff; border-radius: 25px; }
					#selecao .form .field-cb input + span:before { border-color: #fff; top: 0; }
					#selecao .form .field-cb input + span:after { background: #fff; top: 4px; }
					#selecao .form .field-cb label { font-size: .75rem; margin: 0; }
				#selecao .form .submit-btn { border-radius: 25px; }
					#selecao .form .submit-btn:hover { background: var(--yellow-selecao); scale: 1; }
					#selecao .form:has( [name="pp"]:not(:checked) ) .submit-btn { opacity: .5; pointer-events: none; }


@media ( width >= 1440px ){
	#selecao .wrap::before { right: -76px; }
	#selecao .wrap::after { content: ''; display: block; position: absolute; top: -20px; right: -80px; width: 60px; height: 292px; background: url(icons-1.webp) no-repeat center / contain; }
	#selecao .text::before { content: ''; display: block; position: absolute; top: 0; right: -100px; width: 164px; height: 92px; background: url(icons-2.webp) no-repeat center / contain; }
}

@media ( width < 1440px ){
	#selecao .intro { gap: 20px; }
		#selecao .intro h1 { margin-left: -40px; margin-bottom: -40px; }
		#selecao .intro ul { padding-left: 20px; }
}

@media ( width < 1280px ){
	#selecao { background-image: url(field-dt.webp); }
		#selecao .intro h1 { width: 260px; margin-left: -20px; }
			#selecao .intro li { font-size: 1rem; }
				/* #selecao .intro li:first-child strong { font-size: 1.5rem; } */
					#selecao .intro li:first-child strong { font-size: 3rem; }
		#selecao h3 { font-size: 1.25rem; }
}

@media ( width < 992px ){
	#selecao { background-image: url(field-tb.webp); }
		#selecao .intro { gap: 20px 0; }
		#selecao .intro h1 { flex: 100%; height: 160px; aspect-ratio: auto; margin: 0; background-size: contain; margin-top: -60px; }
		#selecao .intro h2 { flex: 0 0 calc( 50% - 20px ); margin-right: 20px; }
		#selecao .intro ul { flex: 0 0 50%; }
		#selecao h3 { font-size: 1rem; }
		#selecao .text ul { flex-wrap: wrap; justify-content: center; }
			#selecao .text li:last-child { flex: 0 0 100%; border-left: none; padding-left: 0; }
				#selecao .text li:last-child::before { content: ''; display: block; width: 80px; margin: 0 auto 20px; border-top: 1px solid #fff; }
		#selecao .form h2 { font-size: 1.125rem; }
}

@media ( width < 768px ){
	#selecao .intro { flex: 0 0 100%; }
	#selecao h3 { position: relative; inset: auto; margin-inline: auto; width: 100%; max-width: 320px; font-size: 1.25rem; }
	#selecao .text { order: 3; }
	#selecao .form { flex: 0 0 100%; order: 4; margin-top: 0; }
}

@media ( width < 640px ){
	/* #selecao { background: url(field-mb.webp) repeat-y center; } */
}

@media ( width < 360px ){
	#selecao .intro h2 { flex: 0 0 100%; margin-left: auto; }
	#selecao .intro ul { flex: 0 0 100%; padding-left: 0; padding-top: 20px; }
		#selecao .intro ul::before { display: none; }
		#selecao .intro li:first-child strong::after { width: 80px; margin-inline: calc( 50% - 40px ); }
}