@font-face { font-family: 'Galano Grotesque'; src: local('Galano Grotesque Regular'), local('GalanoGrotesque-Regular'), url('../fonts/GalanoGrotesque-Regular.woff2') format('woff2'), url('../fonts/GalanoGrotesque-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; }

@font-face { font-family: 'Galano Grotesque'; src: local('Galano Grotesque Bold'), local('GalanoGrotesque-Bold'), url('../fonts/GalanoGrotesque-Bold.woff2') format('woff2'), url('../fonts/GalanoGrotesque-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; }

:root {
	--text-font: 'Galano Grotesque', tahoma, sans-serif;
	--text-color: #222;

	/* --green: #3D8706; */
	--green: #080;
	--green-d: #0E2A20;
	--green-l: #6DE315;

	--extra: 20px;
}

@media ( min-width: 1241px ) {
	:root {
		--extra: calc( ( 100vw - 1200px ) / 2 );
	}
}


*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; outline: 0; }

html, body { font: 16px/1.5 var(--text-font); color: var(--text-color); /* overflow-x: hidden; */ }

html { scroll-padding-top: 100px; scroll-behavior: smooth; }

label, input, button, select, textarea { font: inherit; }

a { text-decoration: none; transition: all .3s ease-out; }

img { display: block; max-width: 100%; height: auto; }

ul { list-style-position: inside; }


.wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 20px; }

.row { --gap: 0px; display: flex; flex-wrap: wrap; gap: 20px var(--gap); width: calc( 100% + var(--gap) ); }
	.row.m-gap { --gap: 20px; }

	.col { width: calc( 100% - var(--gap) ); /* margin-right: var(--gap); */ }
		.w-1of2 { width: calc( 50% - var(--gap) ); }
		.w-1of3 { width: calc( 33.33% - var(--gap) ); }
		.w-2of3 { width: calc( 66.66% - var(--gap) ); }
		.w-1of4 { width: calc( 25% - var(--gap) ); }
		.w-auto { width: auto; }

@media ( min-width: 600px ){
	.w-1of2-tb { width: calc( 50% - var(--gap) ); }
	.w-1of3-tb { width: calc( 33.33% - var(--gap) ); }
	.w-2of3-tb { width: calc( 66.66% - var(--gap) ); }
	.w-1of4-tb { width: calc( 25% - var(--gap) ); }
	.w-auto-tb { width: auto; }
}

@media ( min-width: 900px ){
	.w-1of2-dt { width: calc( 50% - var(--gap) ); }
	.w-1of3-dt { width: calc( 33.33% - var(--gap) ); }
	.w-2of3-dt { width: calc( 66.66% - var(--gap) ); }
	.w-1of4-dt { width: calc( 25% - var(--gap) ); }
	.w-auto-dt { width: auto; }
}



.btn { display: inline-block; padding: 12px 24px; background: var(--green); color: #fff; border: 0; border-radius: 30px; text-transform: uppercase; font-weight: bold; text-align: center; }
	.btn:hover { background: var(--green-l); color: var(--text-color); }



#head { position: fixed; top:0; left: 0; width: 100vw; z-index: 99; transition: all .3s ease-out }
	.scrolled #head { background: rgba( 0 0 0 / 50% ); backdrop-filter: blur(10px); }
	#head .wrap { display: flex; justify-content: space-between; align-items: center; height: 80px; position: relative; }
		#logo { width: 145px; height: 60px; }
			#logo a { width: 100%; height: 100%; display: block; background: url(../img/logo-truna-com-icone.webp) no-repeat center / contain; text-indent: -999rem; }
		#nav-cb { display: none; }
		#nav-btn { display: none; }
		#nav {}
			#nav ul { list-style: none; display: flex; gap: 20px; align-items: center; }
				#nav a { color: #fff; text-transform: uppercase; font-weight: bold; }
					#nav a:hover { color: var(--green); }

@media ( max-width: 899px ){
	#nav-btn { display: block; position: absolute; top: 20px; right: 20px; width: 40px; height: 40px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.00092H21M3 12.0009H21M3 18.0009H21' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E") no-repeat center / 40px; text-indent: -999rem; }
	#nav { position: absolute; top: calc( 100% + 4px ); right: 20px; width: 100%; max-width: 240px; background: #fff; padding: 20px; border-radius: 6px; opacity: 0; visibility: hidden; filter: drop-shadow(8px 8px 8px rgba(0 0 0 / 50%)); transition: all .3s ease-out; }
		#nav-cb:checked ~ #nav { opacity: 1; visibility: visible; }
		#nav ul { display: block; position: relative; }
			#nav ul::before { content: ''; position: absolute; top: -32px; right: -12px; width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M16.9,22h3.2c3.4,0,4.8-2.1,3.2-4.7L14.9,3.9c-1.6-2.6-4.2-2.6-5.8,0L.7,17.3c-1.6,2.6-.2,4.7,3.2,4.7h3.2'/%3E%3C/svg%3E") no-repeat center / 24px; }
			#nav li + li { margin-top: .5rem; }
				#nav a { display: block; padding: 12px 20px; border-bottom: 1px solidvar(--green); color: var(--green); text-align: center; border-radius: 24px; }
					#nav a:hover { background: var(--green); color: #fff; }
					#nav a.btn { color: #fff; width: 100%; }
}



#topo { position: relative; background: #f5f5f5 url(../img/topo.webp) no-repeat 50% 0 / cover; }
	#topo::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba( 0 0 0 / 60% ); }
	#topo .wrap { position: relative; z-index: 2; padding: 240px 20px 160px; }
		#topo h2 { font-size: 3rem; color: #fff; text-transform: uppercase; text-align: center; line-height: 1.25; }

@media ( max-width: 1199px ){
	#topo { background-image: url(../img/topo-dt.webp); }
}

@media ( max-width: 899px ){
	#topo { background-image: url(../img/topo-tb.webp); }
		#topo h2 { font-size: 2.5rem; }
}

@media ( max-width: 599px ){
	#topo { background-image: url(../img/topo-mb.webp); }
		#topo h2 { font-size: 2rem; }
}



#content{ padding: 40px 0; }
	#content :is( ul, ol ) { list-style-position: inside; }
	#content * + :is( p, ul, ol, blockquote, table ) { margin-top: 20px; }
	#content * + h3 { margin-top: 40px; text-transform: uppercase; font-size: 1.5rem; color: var(--green); hyphens: auto; }
	#content * + li { margin-top: 12px;}
	#content * + blockquote { padding-left: 20px; font-style: italic; border-left: 4px solid var(--green); }
		#content * + blockquote p + p { margin-top: 8px; }
	#content * + table { border-collapse: collapse; border: 1px solid var(--green-d); width: 100%; }
		#content * + table th { padding: 8px; font-weight: bold; border: 1px solid var(--green-d); }
		#content * + table td { padding: 8px; border: 1px solid var(--green-d); }
			#content * + table td p + p { margin-top: 8px; }
	#content a { color: var(--green); text-decoration: underline; }
		#content a:hover { color: var(--green-d); }

	#content .indice { position: relative; }
		#content .indice input { display: none; }
		#content .indice label { display: none; }
		#content .indice ul { position: sticky; top: 100px; list-style: none; }

@media ( max-width: 599px ){
	#content .indice { width: 40px; }
		#content .indice label { display: block; position: sticky; top: 100px; width: 40px; height: 40px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.00092H21M3 12.0009H21M3 18.0009H21' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E") no-repeat center / 40px; text-indent: -999rem;  }
		#content .indice ul { top: 140px; background: #fff; width: calc( 100vw - 40px ); max-width: 360px; padding: 20px; box-shadow: 4px 4px 6px rgba(0 0 0 / .5); opacity: 0; visibility: hidden; transition: all .5s ease-out; }
			#content .indice input:checked ~ ul { opacity: 1; visibility: visible; }
		#content #inicio { width: calc( 100% - 80px ); }
		#content * + h3 { font-size: 1.25rem; }

		#content * + table { display: block; }
		#content * + table th { display: block; border-bottom: 0; text-align: left; padding-bottom: 0; }
			#content * + table th::after { content: ":"; }
		#content * + table td { display: block; border-top: 0; }

}




#foot { padding: 60px 0 40px; background: var(--green); color: #fff; }
	#foot .row:first-of-type { justify-content: space-between; }
	#foot .logo {}
		#foot h2 { width: 170px; height: 60px; background: url(../img/truna-fff.webp) no-repeat center / contain; text-indent: -999rem; margin: 0 auto; }
		#foot h2 + p { margin-top: 20px; }
			#foot h2 + p > .btn { background: #fff; color: var(--green); border: 1px solid #fff; }
				#foot h2 + p > .btn:hover { background: transparent; color: #fff; }
	#foot .nav { max-width: 480px; }
		#foot .nav ul { list-style: none; display: flex; gap: 8px 20px; flex-wrap: wrap; }
			/* #foot .nav li { flex: 0 0 calc( ( 100% - 40px ) / 3 ); } */
			#foot .nav li { flex: 0 0 calc( ( 100% - 40px ) / 2 ); }
				#foot .nav li:nth-child( -n + 2 ) a { font-weight: bold; }
				#foot .nav a { color: #fff; font-size: .875rem; }
					#foot .nav a:hover { color: var(--green-d); }
	#foot .social {}
		#foot .social h3 { display: none; }
		#foot .social ul { display: flex; justify-content: end; gap: 8px; list-style: none; }
			#foot .social a { display: block; width: 48px; height: 48px; border: 1px solid #fff; border-radius: 50%; text-indent: -999rem; }
				#foot .social a:hover { background-color: var(--green-d) !important; }
				#foot .social a.ig { background: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 16C13.0609 16 14.0783 15.5786 14.8284 14.8284C15.5786 14.0783 16 13.0609 16 12C16 10.9391 15.5786 9.92172 14.8284 9.17157C14.0783 8.42143 13.0609 8 12 8C10.9391 8 9.92172 8.42143 9.17157 9.17157C8.42143 9.92172 8 10.9391 8 12C8 13.0609 8.42143 14.0783 9.17157 14.8284C9.92172 15.5786 10.9391 16 12 16Z' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3 16V8C3 6.67392 3.52678 5.40215 4.46447 4.46447C5.40215 3.52678 6.67392 3 8 3H16C17.3261 3 18.5979 3.52678 19.5355 4.46447C20.4732 5.40215 21 6.67392 21 8V16C21 17.3261 20.4732 18.5979 19.5355 19.5355C18.5979 20.4732 17.3261 21 16 21H8C6.67392 21 5.40215 20.4732 4.46447 19.5355C3.52678 18.5979 3 17.3261 3 16Z' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M17.5 6.51002L17.51 6.49902' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat center / 50% auto; }
				#foot .social a.li { background: 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='M5.49996 6.99997H1.49996C1.36735 6.99997 1.24018 7.05265 1.14641 7.14642C1.05264 7.24019 0.999962 7.36736 0.999962 7.49997V19.5C0.999962 19.6326 1.05264 19.7598 1.14641 19.8535C1.24018 19.9473 1.36735 20 1.49996 20H5.49996C5.63257 20 5.75975 19.9473 5.85352 19.8535C5.94728 19.7598 5.99996 19.6326 5.99996 19.5V7.49997C5.99996 7.36736 5.94728 7.24019 5.85352 7.14642C5.75975 7.05265 5.63257 6.99997 5.49996 6.99997ZM4.99996 19H1.99996V7.99997H4.99996V19ZM16 6.99997C14.915 6.99997 13.86 7.35797 13 8.01897V7.49997C13 7.36736 12.9473 7.24019 12.8535 7.14642C12.7597 7.05265 12.6326 6.99997 12.5 6.99997H8.49996C8.36735 6.99997 8.24018 7.05265 8.14641 7.14642C8.05264 7.24019 7.99996 7.36736 7.99996 7.49997V19.5C7.99996 19.6326 8.05264 19.7598 8.14641 19.8535C8.24018 19.9473 8.36735 20 8.49996 20H12.5C12.6326 20 12.7597 19.9473 12.8535 19.8535C12.9473 19.7598 13 19.6326 13 19.5V14C13 13.6021 13.158 13.2206 13.4393 12.9393C13.7206 12.658 14.1021 12.5 14.5 12.5C14.8978 12.5 15.2793 12.658 15.5606 12.9393C15.8419 13.2206 16 13.6021 16 14V19.5C16 19.6326 16.0526 19.7598 16.1464 19.8535C16.2402 19.9473 16.3674 20 16.5 20H20.5C20.6326 20 20.7597 19.9473 20.8535 19.8535C20.9473 19.7598 21 19.6326 21 19.5V12C20.9984 10.6744 20.4711 9.40353 19.5337 8.46619C18.5964 7.52886 17.3256 7.00156 16 6.99997ZM20 19H17V14C17 13.3369 16.7366 12.701 16.2677 12.2322C15.7989 11.7634 15.163 11.5 14.5 11.5C13.8369 11.5 13.201 11.7634 12.7322 12.2322C12.2634 12.701 12 13.3369 12 14V19H8.99996V7.99997H12V9.20297C11.9999 9.30653 12.0321 9.40754 12.0919 9.49205C12.1518 9.57656 12.2364 9.64041 12.3341 9.67476C12.4318 9.70912 12.5377 9.7123 12.6373 9.68385C12.7369 9.65541 12.8252 9.59675 12.89 9.51597C13.4035 8.86505 14.1073 8.3906 14.9034 8.15879C15.6994 7.92698 16.548 7.94936 17.3307 8.22281C18.1134 8.49627 18.7912 9.00716 19.2697 9.68425C19.7482 10.3613 20.0035 11.1709 20 12V19ZM3.86796 0.00197336C3.75046 -0.00630809 3.63255 -0.00697624 3.51496 -2.67369e-05C3.14073 -0.0254901 2.76526 0.0261561 2.4118 0.151713C2.05834 0.277269 1.73442 0.474062 1.46011 0.729901C1.18581 0.98574 0.96695 1.29518 0.817101 1.63904C0.667252 1.98291 0.589603 2.35388 0.588962 2.72897C0.585856 3.10015 0.659036 3.46801 0.803964 3.80974C0.948891 4.15147 1.16248 4.45978 1.43147 4.71556C1.70047 4.97134 2.01915 5.16913 2.36774 5.29666C2.71633 5.4242 3.08741 5.47876 3.45796 5.45697H3.48596C3.84414 5.48206 4.20376 5.43634 4.54427 5.32245C4.88478 5.20855 5.19953 5.0287 5.47054 4.79316C5.74155 4.55763 5.96351 4.27102 6.12375 3.9497C6.28399 3.62839 6.37938 3.27865 6.40446 2.92047C6.42954 2.56229 6.38383 2.20268 6.26994 1.86217C6.15604 1.52165 5.97619 1.2069 5.74065 0.935897C5.50512 0.664889 5.21851 0.442927 4.89719 0.282684C4.57588 0.122441 4.22614 0.0270558 3.86796 0.00197336ZM3.83296 4.45997C3.71748 4.47047 3.60124 4.46947 3.48596 4.45697H3.45796C3.21729 4.47507 2.97549 4.44277 2.748 4.36216C2.52051 4.28155 2.31233 4.15439 2.13675 3.9888C1.96116 3.8232 1.82204 3.62282 1.72825 3.40044C1.63447 3.17805 1.58809 2.93856 1.59206 2.69724C1.59604 2.45592 1.6503 2.21808 1.75136 1.99891C1.85243 1.77974 1.99808 1.58405 2.17903 1.42434C2.35998 1.26462 2.57224 1.14439 2.80226 1.07133C3.03228 0.998258 3.27502 0.973957 3.51496 0.999973C3.97379 0.957804 4.43057 1.09963 4.78483 1.39425C5.13908 1.68887 5.36179 2.11215 5.40396 2.57097C5.44613 3.0298 5.30431 3.48658 5.00969 3.84084C4.71507 4.19509 4.29179 4.4178 3.83296 4.45997Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center / 50% auto; }
	#foot .row + .row { margin-top: 20px; border-top: 1px solid #fff; padding-top: 20px; }
		#foot .termos {}
			#foot .termos a { font-size: .875rem; color: #fff; }
				#foot .termos a:hover { color: var(--green-d); }
		#foot .copy { font-size: .875rem; display: flex; justify-content: space-between; }
			#foot .copy nav { display: flex; gap: 20px; }
				#foot .copy a { color: #fff; text-decoration: underline; }
					#foot .copy a:hover { color: var(--green-d); }

@media ( max-width: 799px ){
  #foot .logo { width: 100%; display: flex; flex-direction: column; align-items: center; }
  #foot .nav { width: 100%; max-width: 100%; text-align: center; }
  #foot .social { width: 100%; }
    #foot .social ul { justify-content: center; }
  #foot .termos,
  #foot .copy { width: 100%; text-align: center; flex-direction: column; justify-content: center; gap: 8px; }
		#foot .copy nav { justify-content: center; order: -1; }
}



#up { position: fixed; bottom: 20px; right: 20px; z-index: 999; display: block; width: 40px; height: 40px; background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32px' height='32px' viewBox='0 0 32 32'%3E%3Cpath d='M18.221,7.206l9.585,9.585c0.879,0.879,0.879,2.317,0,3.195l-0.8,0.801c-0.877,0.878-2.316,0.878-3.194,0 l-7.315-7.315l-7.315,7.315c-0.878,0.878-2.317,0.878-3.194,0l-0.8-0.801c-0.879-0.878-0.879-2.316,0-3.195l9.587-9.585 c0.471-0.472,1.103-0.682,1.723-0.647C17.115,6.524,17.748,6.734,18.221,7.206z' fill='white'/%3E%3C/svg%3E") no-repeat center / 50% auto; border-radius: 50%; text-indent: -999rem; opacity: 0; visibility: hidden; box-shadow: 5px 5px 5px rgba( 0 0 0 / 25% ); }
	.scrolled #up { opacity: 1; visibility: visible; }
		#up:hover { background-color: var(--green-d); }