/*
Theme Name: Softfocus | Planeta Ideal
Theme URI:	https://softfocus.com.br/
Author: Rafael Forcadell
Version: 1.0
*/


/* 
Tipografia
--------------------------------------------
*/


:root {

	--ff: 'Barlow Semi Condensed', sans-serif;
	--fh: 'Playfair Display', serif;

	/*clamp(MIN, VAL, MAX)*/

	--fs-900: clamp(0px, 5vw, 96px);
	--fs-800: clamp(0px, 3.3333vw, 64px);
	--fs-600: clamp(0px, 1.875vw, 36px);
	--fs-500: clamp(20px, 1.25vw, 24px);
	--fs-300: clamp(16px, 0.9375vw, 18px);
	--fs-200: clamp(14px, 0.8333vw, 16px);
	--fs-100: 14px;
	
	--line-height: 1.333em;

	--fw-regular: 400;
	--fw-semibold: 600;

}

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

	:root {

		

	}

}

@media screen and (max-width: 767px) {

	:root {

		--fs-900: 46px;
		--fs-800: 30px;
		--fs-600: 20px;
		--fs-500: 18px;
		--fs-300: 16px;
		--fs-200: 14px;

	}

}



/* 
Cores
--------------------------------------------
*/


:root {

	--cor-primaria: #0095EE;
	--cor-secundaria: #FF6666;
	--cor-complementar: #42B2FC;
	--cor-softfocus-escuro: #434F5B; /*#434F5B;*/
	--cor-softfocus-clara: #788694;

	--cor-999: #000000;
	--cor-975: #272727;
	--cor-950: #444444;
	--cor-900: #505050;
	--cor-800: #707070;
	--cor-700a: rgba(0,0,0,.7);
	--cor-500: #8A8A8A;
	--cor-500a: rgba(0,0,0,.5);
	--cor-400: #9A9A9A;
	--cor-400a: rgba(0,0,0,.4);
	--cor-200: #D0D0D0;
	--cor-100: #E5E5E5;
	--cor-100a: rgba(0,0,0,.1);
	--cor-050a: rgba(0,0,0,.05);
	--cor-000a: rgba(255,255,255,.8);
	--cor-000: #FFFFFF;
	
	--cor-borda: #D5D5D5;
	--cor-borda-translucida: rgba(0,0,0,.15);
	
	--cor-fundo-claro: #FFFFFF;
	--cor-fundo-escuro: #2C2C2C;
	--cor-fundo-cinza: #F0F0F0;
	--cor-fundo-azul: #0079C1;
	
	--cor-transparente: rgba(0,0,0,0);

	--cor-link: #61C4F2; 
	--cor-visited: #9100FF; 
	--cor-hover: #0095EE; 
	--cor-active: #6197F2;

}



/* 
Configurações
--------------------------------------------
*/


* { position: relative; margin: 0; box-sizing: border-box; cursor: default; appearance: none; }
img { display: block; margin: 0; max-width: 100%; height: auto; }

body {
	/*display: flex;
	flex-direction: column;*/
	max-width: clamp(0px, 100vw, 1920px); 
	min-height: 100vh;
	margin: 0 auto; 
	font-family: var(--ff); 
	font-weight: var(--fw-light); 
	font-size: var(--fs-300); 
	line-height: var(--line-height);
	color: var(--cor-400); 
	background-color: var(--cor-fundo-cinza);
	-webkit-font-smoothing: antialiased; 
    overflow: hidden;
    overflow: overlay;
	overflow-x: hidden; 
	box-shadow: 0 0 50px rgba(0,0,0,.3);
}
body::-webkit-scrollbar { width: 15px; }
body::-webkit-scrollbar-track { background: var(--cor-transparente); }
body::-webkit-scrollbar-thumb { background-color: var(--cor-100a); }

body.grabbing,
body.grabbing * { cursor: grabbing !important; }


strong, b { font-weight: var(--fw-semibold); }
*:focus { outline: none; }
*::-ms-clear { display: none; }
*::-ms-reveal { display: none; }
*::selection { background-color: rgba(0,0,0,.25); opacity: 1; }


a[href], a[tabindex="0"] {
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 100% 100%;
	background-repeat: no-repeat;
	background-size: 0% 1px;
	transition: background-size 100ms ease-in-out;
	-webkit-tap-highlight-color: transparent;
	cursor: pointer;
}
a[href] * { cursor: pointer; }
a:link { color: var(--cor-link); text-decoration: none; }
a:visited { color: var(--cor-visited); }
a.estatico:visited { color: var(--cor-link); }
a[href]:hover, a[href]:focus,
a[tabindex="0"]:hover, a[tabindex="0"]:focus { text-decoration: none; background-size: 100% 1px; background-position: 0 100%; }
a[href]:active, a[href].static:active { color: var(--cor-active); background-image: linear-gradient(var(--cor-active), var(--cor-active)); }

a[href^="tel"] {}

/*a[data-ancora] { position: absolute; top: 0; left: 0; }*/


h1, h2, h3, h4, h5, h6 { font-family: var(--fh); font-weight: var(--fw-regular); line-height: 1em; margin-bottom: 1.5rem; color: var(--cor-900); }

h1 { font-size: var(--fs-900); }
h2 { font-size: var(--fs-900); }
h3 { font-size: var(--fs-600); }
h4 { font-size: var(--fs-600); }
h5 { font-size: var(--fs-600); }
h6 { font-size: var(--fs-600); }

h1 strong, h1 b,
h2 strong, h2 b,
h3 strong, h3 b,
h4 strong, h4 b,
h5 strong, h5 b,
h6 strong, h6 b { display: table; font-weight: var(--fw-regular); color: var(--cor-primaria); }

h1 small,
h2 small { display: table; font-size: var(--fs-600); line-height: 1em; color: var(--cor-400a); margin-bottom: 0.7rem; }


p { margin: 0; }
p strong { letter-spacing: -0.02em; }

ul { margin: 0 0 1em 0; padding:0 0 0 15px; }
ul li { }

ol { margin: 0 0 1em 0; padding: 0; list-style: none; counter-reset: contador; }
ol li { counter-increment: contador; }
ol li::before { content: counter(contador) ". ";  }

sub { top: -0.2em; font-size: 50%; line-height: 0; }


@media screen and (min-width: 1280px) {
	.mobile { display: none !important; }
}
@media screen and (max-width: 1279px) {
	.desktop { display: none !important; }
}



/*
Animações
--------------------------------------------
*/


@keyframes fade-in {
	from { opacity: 0; }
	to { opacity: inherit; }
}

@keyframes piscar {
	0% { opacity: inherit; }
	50% { opacity: 0; }
	100% { opacity: inherit; }
}

@keyframes enviando {
	100%{ transform:rotate(360deg); }
}

@keyframes ripple {
	0% { transform: scale(0.0001); opacity: 1; }
	80% { opacity: 1; }
	100% { transform: scale(1); opacity: 0; }
}



/* 
Recorrentes
--------------------------------------------
*/


a.botao {
	display: table; 
	vertical-align: middle;
	top: 0;
	left: 0;
	font-size: var(--fs-500); 
	font-weight: var(--fw-semibold); 
	line-height: 1em; 
	color: var(--cor-000);
	border-radius: .3em;
	padding: 1em 1.25em;
	background-color: var(--cor-link);
	transition: all 100ms ease-in-out;
	transition-property: color, background-color;
	cursor: pointer; 
}
a.botao:hover,
a.botao:focus { background-color: var(--cor-hover); background-size: 0; }
a.botao:active { top: .3em; left: .4em; color: var(--cor-000); background-color: var(--cor-active); background-size: 0; }
a.botao:before { position: absolute; z-index: -1; top: .3em; left: .4em; width: 100%; height: 100%; border-radius: .3em; border: 2px solid var(--cor-500a); box-sizing: border-box; content: ""; transition: unset; }
a.botao:active:before { top: 0; left: 0; }

a.botao.img { padding: 0; width: 3.6666rem; height: 3.6666rem; border-radius: 100%; }
a.botao.img:before { border-radius: 100%; }

p + a.botao { margin-top: 2rem; }

img.role-a-pagina { position: absolute; z-index: 2; bottom: 3rem; left: 10%; cursor: pointer; mix-blend-mode: multiply; }
img.role-a-pagina.sm { display: none; }

@media screen and (max-width: 767px) {

	a.botao.img { width: 3rem; height: 3rem; }

	img.role-a-pagina { display: none; bottom: 3rem; left: auto; right: 10%; }
	img.role-a-pagina.sm { display: block; }

}


/*
Solicitar permissão para uso do microfone
--------------------------------------------
*/


.permissao-microfone { position: fixed; z-index: 98; top: 0; left: 0; display: none; width: 100vw; height: 100vh; backdrop-filter: blur(50px); }
.permissao-microfone.solicitar { display: block; animation: fade-in 200ms ease-in-out; }
.permissao-microfone.ocultar { opacity: 0; transition: opacity 200ms ease-in-out 400ms; }
.permissao-microfone > div { position: absolute; top: 150%; left: 50%; display: flex; flex-direction: column; align-items: center; padding: 3rem 4rem; background-color: var(--cor-fundo-claro); transform: translate(-50%, -50%); box-shadow: 0 0 50px rgba(0,0,0,.3); transition: top 500ms cubic-bezier(.5,0,.17,1.35); }
.permissao-microfone .exibir { top: 50%; transition-delay: 300ms; }
.permissao-microfone .ocultar { top: -150%; transition-timing-function: cubic-bezier(.72,-0.58,.39,1); transition-duration: 800ms; }
.permissao-microfone div div { font-family: var(--fh); font-size: var(--fs-600); line-height: 1em; color: var(--cor-900); text-align: center; margin-bottom: 2rem; }
.permissao-microfone .confirmacao div { max-width: 21ch; }
.permissao-microfone .instrucao div { max-width: 21ch; }
.permissao-microfone a.botao { margin-bottom: 2rem; }
.permissao-microfone a:not(.botao) { font-family: var(--fh); color: var(--cor-500); }

@media screen and (max-width: 767px) {

	.permissao-microfone > div { justify-content: center; width: 100%; height: 100vh; box-shadow: none; }

}


/*
Lazy
--------------------------------------------
*/


img.lazy,
img.lazy-processando{ position: absolute; width: 100%; visibility: hidden; }
img.lazy-carregado { max-width: 100%; }
.lazy-carregado { animation: fade-in 200ms ease-in-out; animation-fill-mode: backwards; }

div.lazy-carregando { background-color: rgba(0,0,0,.1); }
div.lazy-carregando.transparente { background-color: transparent; }
div.lazy-carregando:before { position: absolute; z-index: 1; top: 50%; left: 50%; width: 20px; height: 20px; margin: -10px; background-image: url(imagens/carregando.svg); background-repeat: no-repeat; background-position: center; background-size: contain; opacity: .2; animation: lazy-carregando 500ms linear infinite; content: ""; }

@keyframes lazy-carregando{
	100%{ transform:rotate(360deg); }
}



/*
Cronômetro
--------------------------------------------
*/


.cronometro { position: absolute; top: calc(5 * var(--vw, 1vw)); left: 10%; width: 2rem; transition: opacity 200ms ease-in-out; }
.cronometro.ocultar { opacity: 0; }
.cronometro svg { display: block; }
.cronometro path { position: absolute; top: 0; left: 0; stroke-width: 5; stroke: var(--cor-900); fill: none; stroke-linecap: butt; stroke-dasharray: 0, 100; transition: stroke-dasharray 1ms linear; }
.cronometro.iniciar path { stroke-dasharray: 100, 100; }
.cronometro circle { stroke-width: .3; stroke: var(--cor-400); fill: none; }

@media screen and (max-width: 767px) {

	.cronometro { top: calc(9 * var(--vw, 1vw)); left: 10%; width: 1.5rem; }

}



/*
Blocos
--------------------------------------------
*/


.capa { z-index: 1; width: 100%; height: 200vh; height: calc(200 * var(--vh, 1vh)); background-color: var(--cor-fundo-claro); }
.capa .background { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; background-position: top center;  background-size: contain; background-repeat: no-repeat; }
.capa .background.md,
.capa .background.sm { display: none; }
.capa .bloco { background-color: transparent; }


.estoria { /*overflow: hidden;*/ }

.bloco { z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: 100vw; height: 100vh; height: calc(100 * var(--vh, 1vh)); padding: 0 10%; background-color: var(--cor-fundo-claro); overflow: hidden; }
.bloco .background { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; background-position: top center;  background-size: cover; pointer-events: none; }
.bloco .background.md,
.bloco .background.sm { display: none; }

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

	.capa .background { display: none; }
	.capa .background.md { display: block; }

	.bloco .background.md { display: block; }

}

@media screen and (max-width: 767px) {

	.capa .background { display: none; }
	.capa .background.sm { display: block; background-size: contain; }
	.capa .bloco.inicio p { max-width: 28ch; }

	.bloco { justify-content: flex-end; padding-bottom: 12vw; }
	.bloco .background { display: none; }
	.bloco .background.sm { display: block; background-size: contain; }

}

.bloco.ocultar { display: none; }

.bloco.o-astronauta-inconformado { }
.bloco.o-astronauta-inconformado h2 strong { color: var(--cor-secundaria); }
.bloco.o-astronauta-inconformado p { max-width: 63ch; }
.bloco.o-astronauta-inconformado .background { background-position: center; }

@media screen and (max-width: 767px) {

	.bloco.o-astronauta-inconformado { padding-bottom: 16vw; }
	.bloco.o-astronauta-inconformado p { display: inline; max-width: 31ch; }
	.bloco.o-astronauta-inconformado br { display: none; }
	.bloco.o-astronauta-inconformado .background.sm { background-position: top center; }

}


.bloco.atmosfera-pesada { background-color: var(--cor-fundo-cinza); }
.bloco.atmosfera-pesada .cronometro path { stroke: var(--cor-secundaria); }
.bloco.atmosfera-pesada h2 small { margin-bottom: 1rem; }
.bloco.atmosfera-pesada h2 strong { color: var(--cor-secundaria); }
.bloco.atmosfera-pesada p { max-width: 53ch; }
.bloco.atmosfera-pesada p strong.piscar { animation: piscar 150ms linear; animation-iteration-count: 10; }
.bloco.atmosfera-pesada .interativo { position: absolute; top: 50%; left: 50%; width: 40%; height: calc(2.3 * var(--vw, 1vw)); }
.bloco.atmosfera-pesada .xis { position: absolute; top: 0; left: 0; width: calc(2.3 * var(--vw, 1vw)); height: calc(2.3 * var(--vw, 1vw)); background-image: url(imagens/xis.svg); background-position: center; background-repeat: no-repeat; background-size: contain; }
.bloco.atmosfera-pesada .interativo + .xis { display: none; }
.bloco.atmosfera-pesada .interativo .xis:nth-child(1) { left: 0; }
.bloco.atmosfera-pesada .interativo .xis:nth-child(2) { left: 10%; }
.bloco.atmosfera-pesada .interativo .xis:nth-child(3) { left: 25%; }
.bloco.atmosfera-pesada .interativo .xis:nth-child(4) { left: 50%; }
.bloco.atmosfera-pesada .interativo .xis:nth-child(5) { left: 100%; transform: translateX(-100%); }
.bloco.atmosfera-pesada .xis.ativo { cursor: pointer; }
.bloco.atmosfera-pesada .xis.ativo:before { position: absolute; bottom: calc(-3 * var(--vw, 1vw)); left: calc(1 * var(--vw, 1vw)); width: calc(2 * var(--vw, 1vw)); height: calc(2 * var(--vw, 1vw)); background-image: url(imagens/seta-curvada.svg); background-position: center; background-repeat: no-repeat; background-size: contain; content: ""; pointer-events: none; }
.bloco.atmosfera-pesada .xis.ativo:after { position: absolute; bottom: calc(-3.5 * var(--vw, 1vw)); left: calc(4 * var(--vw, 1vw)); content: attr(data-legenda-longa); white-space: nowrap; pointer-events: none; animation: piscar 150ms linear; animation-iteration-count: 3; }
.bloco.atmosfera-pesada .xis span { position: absolute; top: 50%; left: 50%; width: 300%; height: 300%; margin: -150%; border-radius: 100%; background-color: var(--cor-050a); content: ""; transform: scale(0.0001); transition: transform 100ms ease-in-out; pointer-events: none; }
.bloco.atmosfera-pesada .xis.ativo:hover span,
.bloco.atmosfera-pesada .xis.ativo:focus span { transform: scale(1); }

@media screen and (max-width: 767px) {

	.bloco.atmosfera-pesada { padding-bottom: 30vw; }
	.bloco.atmosfera-pesada .cronometro { left: auto; right: 10%; }
	.bloco.atmosfera-pesada br { display: none; }
	.bloco.atmosfera-pesada .interativo { position: relative; top: auto; left: auto; order: -1; flex-grow: 1; width: 100%; height: auto; margin: 12vw 0; }
	.bloco.atmosfera-pesada .xis { left: 0 !important; width: calc(6 * var(--vw, 1vw)); height: calc(6 * var(--vw, 1vw)); }
	.bloco.atmosfera-pesada .interativo + .xis { display: block; top: auto; bottom: 12vw; left: 10% !important; }
	.bloco.atmosfera-pesada .interativo .xis:nth-child(2) { top: calc(18 * var(--vw, 1vw)); }
	.bloco.atmosfera-pesada .interativo .xis:nth-child(3) { top: 100%; transform: translateY(-100%); }
	.bloco.atmosfera-pesada .interativo .xis:nth-child(4),
	.bloco.atmosfera-pesada .interativo .xis:nth-child(5) { display: none; }
	.bloco.atmosfera-pesada .xis.ativo:before { bottom: auto; top: 50%; left: calc(10 * var(--vw, 1vw)); width: 21px; height: 8px; margin-top: -4px; background-image: url(imagens/seta-reta.svg); }
	.bloco.atmosfera-pesada .xis.ativo:after { position: absolute; bottom: 0; left: calc((10 * var(--vw, 1vw) + 31px)); line-height: calc(6 * var(--vw, 1vw)); content: attr(data-legenda-curta); }

}


.bloco.embarque { background-color: var(--cor-fundo-cinza); overflow: visible; }
.bloco.embarque:not(.ocultar) { display: grid; grid-template-columns: 1fr 30%; align-items: center; }
.bloco.embarque .cronometro path { stroke: var(--cor-secundaria); }
.bloco.embarque h2 small { margin-bottom: 1rem; }
.bloco.embarque h2 strong { color: var(--cor-secundaria); }
.bloco.embarque p { max-width: 53ch; }
.bloco.embarque p strong.piscar { animation: piscar 150ms linear; animation-iteration-count: 10; }
.bloco.embarque .interativo { --largura: 1vw; --altura: 2.5vw; --cor: var(--cor-900); display: flex; flex-direction: column; align-items: flex-start; height: 100vh; }
.bloco.embarque .interativo .tracejado.longo { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }

.bloco.embarque .interativo .legenda { padding: 2.5vw 0 1vw 3vw; white-space: nowrap; }
.bloco.embarque .interativo .legenda,
.bloco.embarque .interativo .legenda * { cursor: pointer; }
.bloco.embarque .interativo .legenda.piscar span { animation: piscar 150ms linear; animation-iteration-count: 15; }
.bloco.embarque .interativo .legenda:before { position: absolute; bottom: calc(1.5 * var(--vw, 1vw)); left: calc(.25 * var(--vw, 1vw)); width: calc(2 * var(--vw, 1vw)); height: calc(2 * var(--vw, 1vw)); background-image: url(imagens/seta-curvada.svg); background-position: center; background-repeat: no-repeat; background-size: contain; content: ""; }
.bloco.embarque .interativo .legenda:after { position: absolute; top: calc(-1 * var(--vw, 1vw)); left: 0; width: var(--vw, 1vw); height: var(--vw, 1vw); border-radius: 100%; background-color: var(--cor-050a); content: ""; transform-origin: center; transition: transform 150ms ease-in-out; }
.bloco.embarque .interativo .legenda:hover:after { transform: scale(15); }
.bloco.embarque.canhoto-destacado .legenda { opacity: 0; transition: opacity 150ms ease-in-out; }

.bloco.embarque .interativo .tracejado.inicio,
.bloco.embarque .interativo .tracejado.longo > div,
.bloco.embarque .interativo .tracejado.longo .fim { width: var(--largura); height: var(--altura); border-radius: calc(var(--largura) * .5); background-color: var(--cor); }
.bloco.embarque .interativo .tracejado.inicio { border-radius: 0; border-bottom-right-radius: calc(var(--largura) * .5); border-bottom-left-radius: calc(var(--largura) * .5); }
.bloco.embarque .interativo .tracejado.longo .fim { border-radius: 0; border-top-right-radius: calc(var(--largura) * .5); border-top-left-radius: calc(var(--largura) * .5); }
.bloco.embarque .interativo .tracejado.inicio .curva,
.bloco.embarque .interativo .tracejado.longo .fim .curva { position: absolute; width: 150%; height: 60%; overflow: hidden; }
.bloco.embarque .interativo .tracejado.inicio .curva { top: 0; }
.bloco.embarque .interativo .tracejado.longo .fim .curva { bottom: 0; }
.bloco.embarque .interativo .tracejado.inicio .curva:first-child,
.bloco.embarque .interativo .tracejado.longo .fim .curva:first-child { right: 100%; }
.bloco.embarque .interativo .tracejado.inicio .curva:last-child,
.bloco.embarque .interativo .tracejado.longo .fim .curva:last-child { left: 100%; }
.bloco.embarque .interativo .tracejado.inicio .curva div,
.bloco.embarque .interativo .curva div { position: absolute; width: 200%; height: 200%; border-radius: 100%; }
.bloco.embarque .interativo .tracejado.inicio .curva div { bottom: -100%; }
.bloco.embarque .interativo .tracejado.longo .fim .curva div { top: -100%; }
.bloco.embarque .interativo .tracejado.inicio .curva:first-child div,
.bloco.embarque .interativo .tracejado.longo .fim .curva:first-child div { left: -100%; }
.bloco.embarque .interativo .tracejado.inicio .curva:first-child div { box-shadow: var(--largura) calc(var(--largura) * -1) 0 var(--cor); }
.bloco.embarque .interativo .tracejado.longo .fim .curva:first-child div { box-shadow: var(--largura) var(--largura) 0 var(--cor); }
.bloco.embarque .interativo .tracejado.inicio .curva:last-child div,
.bloco.embarque .interativo .tracejado.longo .fim .curva:last-child div { right: -100%; }
.bloco.embarque .interativo .tracejado.inicio .curva:last-child div { box-shadow: calc(var(--largura) * -1) calc(var(--largura) * -1) 0 var(--cor); }
.bloco.embarque .interativo .tracejado.longo .fim .curva:last-child div { box-shadow: calc(var(--largura) * -1) var(--largura) 0 var(--cor); }

.bloco.embarque .interativo .destacando { position: absolute; top: 0; left: 0; width: var(--largura); height: 100%; overflow: hidden; }
.bloco.embarque .interativo .destacando div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--cor); border-radius: calc(var(--largura) * .5); transform: translateY(-100%); transition: transform 750ms ease-in-out 250ms; }
.bloco.embarque.canhoto-destacado .interativo .destacando div { transform: translateY(0); }

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

	.bloco.embarque .interativo .legenda { padding-left: 4vw; }
	.bloco.embarque .interativo .legenda:before { bottom: auto; top: 50%; transform: translateY(-50%); }

}

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

	.bloco.embarque:not(.ocultar) { grid-template-columns: 1fr 25%; }
	
}

@media screen and (max-width: 767px) {

	.bloco.embarque { padding: 0; }
	.bloco.embarque:not(.ocultar) { grid-template-columns: auto; grid-template-rows: 1fr 20%; }
	.bloco.embarque .cronometro { left: auto; right: 10%; }

	.bloco.embarque > div:first-child { padding: 0 10% 12vw; align-self: flex-end; }

	.bloco.embarque .interativo { --largura: 6vw; --altura: 2vw; flex-direction: row; align-self: flex-start; height: 20vh; }
	.bloco.embarque .interativo .legenda { position: absolute; top: 50%; left: 8%; padding: 0 0 0 36px; white-space: normal; transform: translateY(-50%); }
	.bloco.embarque .interativo .legenda:before { bottom: auto; top: 50%; left: 0; width: 21px; height: 8px; margin-top: -4px; background-image: url(imagens/seta-reta.svg); }
	.bloco.embarque .interativo .legenda:after { display: none; }

	.bloco.embarque .interativo .tracejado.longo { flex-direction: row; }
	.bloco.embarque .interativo .tracejado.longo > div:nth-child(n + 8):not(.fim) { display: none; }

	.bloco.embarque .interativo .tracejado.inicio { display: none; }
	.bloco.embarque .interativo .tracejado.longo .inicio { border-radius: 0; border-top-right-radius: calc(var(--largura) * .5); border-bottom-right-radius: calc(var(--largura) * .5); }
	.bloco.embarque .interativo .tracejado.longo .fim { border-radius: 0; border-top-left-radius: calc(var(--largura) * .5); border-bottom-left-radius: calc(var(--largura) * .5); }

	.bloco.embarque .interativo .tracejado.longo .inicio .curva,
	.bloco.embarque .interativo .tracejado.longo .fim .curva { position: absolute; width: 60%; height: 150%; overflow: hidden; }
	.bloco.embarque .interativo .tracejado.longo .inicio .curva { left: 0; }
	.bloco.embarque .interativo .tracejado.longo .inicio .curva:first-child { top: -150%; }
	.bloco.embarque .interativo .tracejado.longo .inicio .curva:first-child div { top: -100%; right: -100%; box-shadow: calc(var(--largura) * -.5) calc(var(--largura) * .5) 0 var(--cor); }
	.bloco.embarque .interativo .tracejado.longo .inicio .curva:last-child { bottom: -150% }
	.bloco.embarque .interativo .tracejado.longo .inicio .curva:last-child div { box-shadow: calc(var(--largura) * -.5) calc(var(--largura) * -.5) 0 var(--cor); }

	.bloco.embarque .interativo .tracejado.longo .fim .curva { right: 0 !important; left: auto !important; }
	.bloco.embarque .interativo .tracejado.longo .fim .curva:first-child { top: -150%; }
	.bloco.embarque .interativo .tracejado.longo .fim .curva:first-child div { box-shadow: calc(var(--largura) * .5) calc(var(--largura) * .5) 0 var(--cor); }
	.bloco.embarque .interativo .tracejado.longo .fim .curva:last-child { bottom: -150% }
	.bloco.embarque .interativo .tracejado.longo .fim .curva:last-child div { top: auto; bottom: -100%; left: -100%; box-shadow: calc(var(--largura) * .5) calc(var(--largura) * -.5) 0 var(--cor); }

	.bloco.embarque .interativo .destacando { width: 100%; height: var(--altura); }
	.bloco.embarque .interativo .destacando div { transform: translateX(-100%); transition: transform 250ms ease-in-out; }
	.bloco.embarque.canhoto-destacado .interativo .destacando div { transform: translateX(0); }

}


.bloco.motivado { background-color: var(--cor-fundo-escuro); }
.bloco.motivado h2 { margin-bottom: 2rem; }
.bloco.motivado h2 strong { display: inline; color: var(--cor-000); }
.bloco.motivado h2 strong:after { display: inline-block; width: 40px; content: ""; animation: reticencias 1s infinite; }
@keyframes reticencias {
	0% { content: "" }
	25% { content: "." }
	50% { content: ".." }
	75% { content: "..." }
	100% { content: "" }
}
.bloco.motivado p { max-width: 45ch; margin-bottom: 1rem; }
.bloco.motivado p strong { color: var(--cor-000); }
.bloco.motivado p:last-child { margin-bottom: 0; }
.bloco.motivado .cronometro path { stroke: var(--cor-000); }
.bloco.motivado .cronometro circle { stroke: var(--cor-000a); }

@media screen and (max-width: 767px) {

	

}


.bloco.grito { z-index: 2; background-color: #FFD940; overflow: visible; }
.bloco.grito.overflow { overflow: hidden; }
.bloco.grito h2 strong { color: var(--cor-000); }
.bloco.grito p { max-width: 50ch; color: var(--cor-500a); }

.bloco.grito a { margin-top: 2rem; font-family: var(--fh); color: var(--cor-700a); cursor: pointer; }
.bloco.grito a * { cursor: pointer; }
.bloco.grito a:hover,
.bloco.grito a:focus { background-size: 0; }
.bloco.grito a.ocultar { display: none; }
.bloco.grito a br,
.bloco.grito a .toque { display: none; }
.bloco.grito a .microfone { display: inline-block; vertical-align: middle; width: 32px; height: 32px; margin-right: 10px; background-image: url(imagens/microfone.svg); background-position: center; background-repeat: no-repeat; }
.bloco.grito a .microfone:before { position: absolute; top: 50%; left: 50%; width: 300%; height: 300%; margin: -150%; border-radius: 100%; background-color: var(--cor-100a); content: ""; transform: scale(0.0001); transition: transform 100ms ease-in-out; pointer-events: none; }
.bloco.grito a[grito="abrir"]:hover .microfone:before,
.bloco.grito a[grito="abrir"]:focus .microfone:before { transform: scale(1); }
.bloco.grito a:not([grito="abrir"]) { pointer-events: none; }
.bloco.grito a > span { display: none; }
.bloco.grito a > span.volume { display: block; }
.bloco.grito a[grito="abrir"] .abrir,
.bloco.grito a[grito="escutando"] .escutando,
.bloco.grito a[grito="quase"] .quase,
.bloco.grito a[grito="uau"] .uau { display: inline; }
.bloco.grito img.gritando { position: absolute; z-index: -1; top: -2.5vw; left: 0; width: 100%; pointer-events: none; }
.bloco.grito img.gritando.sm { display: none; }

@media screen and (max-width: 767px) {

	.bloco.grito .cronometro { left: 10%; right: auto; }

	.bloco.grito a { width: 100%; font-size: 14px; line-height: 1.25em; margin-top: 1.5rem; }
	.bloco.grito a .clique { display: none; }
	.bloco.grito a .toque,
	.bloco.grito a br { display: inline; }
	.bloco.grito a .microfone { margin-right: 5px; }
	.bloco.grito a[grito="abrir"] .abrir,
	.bloco.grito a[grito="escutando"] .escutando,
	.bloco.grito a[grito="quase"] .quase,
	.bloco.grito a[grito="uau"] .uau { display: inline-block; vertical-align: middle; }
	.bloco.grito a[grito="uau"] .uau { line-height: 2.5em; }

	.bloco.grito img.gritando { display: none; }
	.bloco.grito img.gritando.sm { display: block; }

}


.bloco.decolar { background-color: var(--cor-fundo-cinza); }
.bloco.decolar .cronometro path { stroke: var(--cor-primaria); }
.bloco.decolar p { max-width: 53ch; }
.bloco.decolar .interativo { position: absolute; top: 5%; left: 50%; display: flex; align-items: center; width: 35%; height: 95%; }
.bloco.decolar .interativo .senoide { flex: 1 1 auto; margin: 0 2rem; }
.bloco.decolar .interativo svg { display: block; overflow: visible; }
.bloco.decolar .interativo path { fill: none; stroke: var(--cor-975); stroke-width: 2px; }
.bloco.decolar .interativo .arraste,
.bloco.decolar .interativo .sombra,
.bloco.decolar .interativo .ate-aqui { position: absolute; z-index: 1; top: calc(-.9375 * var(--vw, 1vw)); left: calc(-.9375 * var(--vw, 1vw)); width: calc(1.875 * var(--vw, 1vw)); height: calc(1.875 * var(--vw, 1vw)); border-radius: 100%; background-color: var(--cor-primaria); transform-origin: center center; }
.bloco.decolar .interativo .arraste { z-index: 2; cursor: grab; }
.bloco.decolar .interativo .sombra { top: calc(50% - (.85 * var(--vw, 1vw))); left: calc(-.85 * var(--vw, 1vw)); width: calc(1.7 * var(--vw, 1vw)); height: calc(1.7 * var(--vw, 1vw)); background-color: var(--cor-975); }
.bloco.decolar .interativo .ate-aqui { top: calc(50% - (.85 * var(--vw, 1vw))); left: calc(100% - (.85 * var(--vw, 1vw))); width: calc(1.7 * var(--vw, 1vw)); height: calc(1.7 * var(--vw, 1vw)); background-color: var(--cor-975); }
.bloco.decolar .interativo .ate-aqui:before { position: absolute; top: 50%; left: 50%; width: calc(20 * var(--vw, 1vw)); height: calc(20 * var(--vw, 1vw)); margin: calc(-10 * var(--vw, 1vw)); border-radius: 100%; background-color: var(--cor-050a); content: ""; transform: scale(0.0001); transition: transform 200ms ease-in-out; pointer-events: none; }
.bloco.decolar .interativo.fim .ate-aqui:before { animation: ripple 300ms ease-in-out; }

@media screen and (min-width: 1280px) and (max-width: 1439px) {

	.bloco.decolar .interativo { width: 40%; }
	.bloco.decolar .interativo path { stroke-width: 1.5px; }

}

@media screen and (max-width: 767px) {

	.bloco.decolar { padding-top: 0; padding-bottom: 18vw; }
	.bloco.decolar .interativo { position: relative; top: auto; left: auto; width: 100%; height: 15vw; margin: 12vw 0 0; }
	.bloco.decolar .interativo .legenda { position: absolute; bottom: -.5em; left: 0; font-size: 12px; }
	.bloco.decolar .interativo .legenda:last-child { left: auto; right: 0; }
	.bloco.decolar .interativo .senoide { margin: 0 1rem; }
	.bloco.decolar .interativo path { stroke-width: 1px; }
	.bloco.decolar .interativo .arraste,
	.bloco.decolar .interativo .sombra,
	.bloco.decolar .interativo .ate-aqui { top: calc(-2.75 * var(--vw, 1vw)); left: calc(-2.75 * var(--vw, 1vw)); width: calc(5.5 * var(--vw, 1vw)); height: calc(5.5 * var(--vw, 1vw)); }
	.bloco.decolar .interativo .sombra { top: calc(50% - (2.5 * var(--vw, 1vw))); left: calc(-2.5 * var(--vw, 1vw)); width: calc(5 * var(--vw, 1vw)); height: calc(5 * var(--vw, 1vw)); }
	.bloco.decolar .interativo .ate-aqui {top: calc(50% - (2.5 * var(--vw, 1vw))); left: calc(100% - (2.5 * var(--vw, 1vw))); width: calc(5 * var(--vw, 1vw)); height: calc(5 * var(--vw, 1vw)); }
	.bloco.decolar .interativo .ate-aqui:before { width: calc(40 * var(--vw, 1vw)); height: calc(40 * var(--vw, 1vw)); margin: calc(-20 * var(--vw, 1vw)); }

}


.bloco.galaxia { align-items: center; padding: 5% 0; }
.bloco.galaxia h2 { font-size: var(--fs-800); color: var(--cor-primaria); text-transform: none; }
.bloco.galaxia h2 + p { text-align: center; }
.bloco.galaxia .swiper { width: calc(75 * var(--vw, 1vw)); height: calc(22 * var(--vw, 1vw)); margin-top: 3rem; overflow: visible; }
.bloco.galaxia .swiper-wrapper { margin: 0; padding: 0; list-style: none; }
.bloco.galaxia .swiper-slide a { display: flex; justify-content: center; align-items: flex-start; height: calc(15.625 * var(--vw, 1vw)); color: var(--cor-400); cursor: pointer; }
.bloco.galaxia .swiper-slide a * { cursor: pointer; }
.bloco.galaxia .swiper-slide a:hover,
.bloco.galaxia .swiper-slide a:focus { background-size: 0; }
.bloco.galaxia .swiper-slide a:before { position: absolute; top: 50%; left: 50%; width: calc(20 * var(--vw, 1vw)); height: calc(20 * var(--vw, 1vw)); margin: calc(-10 * var(--vw, 1vw)); border-radius: 100%; background-color: var(--cor-050a); content: ""; transform: scale(0.0001); transition: transform 200ms ease-in-out; pointer-events: none; }
.bloco.galaxia .swiper-slide a[href*="planeta-azul"]:before { width: calc(25 * var(--vw, 1vw)); height: calc(25 * var(--vw, 1vw)); margin: calc(-12.5 * var(--vw, 1vw)); }
.bloco.galaxia .swiper-slide a:hover:before,
.bloco.galaxia .swiper-slide a:focus:before { transform: scale(1); }
.bloco.galaxia .swiper-slide img { height: calc(15.625 * var(--vw, 1vw)); }
.bloco.galaxia .swiper-slide a ul.ficha-tecnica { position: absolute; top: 100%; left: calc(50% + 1.7em); margin: 0; padding: 0; list-style: none; font-size: var(--fs-200); line-height: 1.2em; pointer-events: none; }
.bloco.galaxia .swiper-slide a ul.ficha-tecnica strong { color: var(--cor-500); }
.bloco.galaxia .swiper-slide a ul.ficha-tecnica:before { position: absolute; top: -1.5em; left: -1.7em; width: 2px; height: calc(100% + 2em); background-color: var(--cor-900); content: ""; }
.bloco.galaxia .swiper-slide a.planeta-cinza ul.ficha-tecnica { left: 0; }
/*.bloco.galaxia .swiper-slide a.planeta-cinza ul.ficha-tecnica:before { top: -1.2em; left: -.5em; width: calc(8 * var(--vw, 1vw)); height: 2px; }*/
.bloco.galaxia .swiper-slide a.planeta-cinza ul.ficha-tecnica:before { position: absolute; top: -1.2em; left: calc(7.5 * var(--vw, 1vw)); width: calc(3 * var(--vw, 1vw)); height: 2px; background-color: var(--cor-900); content: ""; transform-origin: 0 0; transform: rotate(-45deg); }
.bloco.galaxia .swiper-slide a.planeta-vermelho ul.ficha-tecnica { left: auto; right: 0; text-align: right; }
/*.bloco.galaxia .swiper-slide a.planeta-vermelho ul.ficha-tecnica:before { top: -1.2em; left: auto; right: -.5em; width: calc(8 * var(--vw, 1vw)); height: 2px; }*/
.bloco.galaxia .swiper-slide a.planeta-vermelho ul.ficha-tecnica:before { position: absolute; top: -1.2em; right: calc(7.5 * var(--vw, 1vw)); width: calc(3 * var(--vw, 1vw)); height: 2px; background-color: var(--cor-900); content: ""; transform-origin: 100% 0; transform: rotate(45deg); }

@media screen and (max-width: 767px) {

	.bloco.galaxia { justify-content: center; padding: 0; }
	.bloco.galaxia h2,
	.bloco.galaxia p { padding: 0 10%; text-align: center; }
	.bloco.galaxia br { display: none; }
	.bloco.galaxia .swiper { width: 50%; height: auto; margin-top: 2rem; }
	.bloco.galaxia .swiper-slide a { flex-direction: column; align-items: center; height: auto; }
	.bloco.galaxia .swiper-slide a:before { display: none; }
	.bloco.galaxia .swiper-slide img { height: 50vw; }
	.bloco.galaxia .swiper-slide a ul.ficha-tecnica { position: relative; top: auto; left: auto; margin-top: 3vh; text-align: center !important; opacity: 0; transition: opacity 100ms ease-in-out; }
	.bloco.galaxia .swiper-slide-active a ul.ficha-tecnica { opacity: 1; }
	.bloco.galaxia .swiper-slide a ul.ficha-tecnica:before,
	.bloco.galaxia .swiper-slide a ul.ficha-tecnica:after { display: none; }

}


.bloco.planeta-azul { align-items: stretch; height: auto; padding: 0; color: var(--cor-000); pointer-events: none; background-color: var(--cor-fundo-azul); overflow: visible; }
.bloco.planeta-azul a { pointer-events: all; }
.bloco.planeta-azul h2 { color: var(--cor-950); }
.bloco.planeta-azul h2 strong { color: var(--cor-000); }
.bloco.planeta-azul p { opacity: .8; }

.bloco.planeta-azul .voando-alto { display: flex; align-items: flex-start; justify-content: space-between; height: auto; min-height: 100vh; padding: 0 10%; }
.bloco.planeta-azul .voando-alto header { position: sticky; top: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: 40ch; height: 100vh; }

@media screen and (min-width: 1280px) and (max-height: 650px) {
	.bloco.planeta-azul .voando-alto header p { display: inline; }
}

.bloco.planeta-azul .principios-valores { width: calc(100% - 40ch - (6 * var(--vw, 1vw))); padding: 8% 0; }
.bloco.planeta-azul .principios-valores > h3 { display: flex; align-items: center; gap: 2rem; margin-bottom: 3rem; color: var(--cor-000); white-space: nowrap; }
.bloco.planeta-azul .principios-valores > h3:before,
.bloco.planeta-azul .principios-valores > h3:after { width: 100%; height: 2px; border-radius: 2px; background-color: var(--cor-000); opacity: .9; content: ""; }
.bloco.planeta-azul .principios-valores > ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 0 4rem; padding: 0; list-style: none; }
.bloco.planeta-azul .principios-valores > ul:last-child { margin-bottom: 0; }
.bloco.planeta-azul .principios-valores > ul li { flex-basis: 33.3333%; margin: 0 0 calc(var(--vw, 1vw) * 2) 0; padding: 0 calc(var(--vw, 1vw) * 2.3); text-align: center; }
.bloco.planeta-azul .principios-valores > ul li h4 { margin-bottom: 1.25rem; font-family: var(--ff); font-size: var(--fs-300); line-height: 1.25em; font-weight: var(--fw-semibold); color: var(--cor-000); }
.bloco.planeta-azul .principios-valores > ul li img { max-width: 130px; width: calc(100% - (4 * var(--vw, 1vw))); margin: 0 auto 1rem; }

.bloco.planeta-azul .instrucoes-de-aterrisagem { padding: 0 15%; margin-bottom: 5%; }
.bloco.planeta-azul .instrucoes-de-aterrisagem h3 { margin-bottom: 5rem; font-size: var(--fs-800); color: var(--cor-000); text-align: center; }
.bloco.planeta-azul .instrucoes-de-aterrisagem h3 strong { display: inline; color: var(--cor-900); }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 0 4rem; padding: 0; list-style: none; }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul:last-child { margin-bottom: 0; }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li { flex-basis: 33.3333%; margin: 0 0 calc(var(--vw, 1vw) * 2) 0; padding: 0 calc(var(--vw, 1vw) * 2.3); text-align: center; }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li h4 { margin-bottom: 1.25rem; font-family: var(--ff); font-size: var(--fs-300); line-height: 1em; font-weight: var(--fw-semibold); color: var(--cor-000); }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img { max-width: 130px; width: calc(100% - (4 * var(--vw, 1vw))); margin: 0 auto 1rem; }
.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img.largura-170 { max-width: 170px; }

.bloco.planeta-azul .indique { z-index: 1; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; height: 100vh; max-height: calc(40 * var(--vw, 1vw)); padding: 0 10%; }
.bloco.planeta-azul .indique p { max-width: 49ch; margin-bottom: 1rem; text-align: right; }
.bloco.planeta-azul .indique .background { top: auto; bottom: 0; height: 100vh; background-size: contain; background-position: center left; background-repeat: no-repeat; }
.bloco.planeta-azul .indique .compartilhar { display: flex; margin-top: 2rem; }
.bloco.planeta-azul .indique .compartilhar a.botao { margin: 0 .5rem; }

@media screen and (min-width: 1281px) and (max-width: 1366px) {

	.bloco.planeta-azul .voando-alto { padding: 0 8% 0 10%; }
	.bloco.planeta-azul .principios-valores > ul li { padding: 0 calc(var(--vw, 1vw) * 1.5); }
	.bloco.planeta-azul .principios-valores > ul li img { max-width: 110px; }

	.bloco.planeta-azul .instrucoes-de-aterrisagem { padding: 0 10%; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img { max-width: 110px; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img.largura-170 { max-width: 150px; }

}

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

	.bloco.planeta-azul .principios-valores > ul li { flex-basis: 50%; margin: 0 0 calc(var(--vw, 1vw) * 4) 0; }
	.bloco.planeta-azul .principios-valores > ul li img { max-width: 110px; }

	.bloco.planeta-azul .instrucoes-de-aterrisagem { padding: 0 5%; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li { padding: 0 calc(var(--vw, 1vw) * 3); margin: 0 0 calc(var(--vw, 1vw) * 4) 0; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img { max-width: 110px; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li img.largura-170 { max-width: 150px; }

}

@media screen and (max-width: 767px) {

	.bloco.planeta-azul h2 strong { display: inline; }

	.bloco.planeta-azul .voando-alto { flex-direction: column; padding: 30% 0 0; }
	.bloco.planeta-azul .voando-alto header { position: relative; align-items: center; width: auto; height: auto; margin-bottom: 20%; text-align: center; }
	.bloco.planeta-azul .voando-alto header p { padding: 0 15%; }
	.bloco.planeta-azul .voando-alto header a.botao { display: none; }
	
	.bloco.planeta-azul .principios-valores { width: auto; padding: 0 10%; margin-bottom: 4rem; }
	.bloco.planeta-azul .principios-valores > h3 { justify-content: center; margin-bottom: 2rem; font-size: var(--fs-800); white-space: normal; text-align: center; }
	.bloco.planeta-azul .principios-valores > h3:before,
	.bloco.planeta-azul .principios-valores > h3:after { display: none; }
	.bloco.planeta-azul .principios-valores > ul { padding: 0 5%; }
	.bloco.planeta-azul .principios-valores > ul li { flex-basis: 100%; margin: 0 0 3rem; padding: 0; }
	.bloco.planeta-azul .principios-valores > ul li:last-child { margin-bottom: 0; }

	.bloco.planeta-azul .instrucoes-de-aterrisagem { padding: 0 10%; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > h3 { margin-bottom: 2rem; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > h3 strong { display: table; margin: 0 auto; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul { padding: 0 5%; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li { flex-basis: 100%; margin: 0 0 3rem; padding: 0; }
	.bloco.planeta-azul .instrucoes-de-aterrisagem > ul li:last-child { margin-bottom: 0; }
	
	.bloco.planeta-azul .indique { align-items: center; height: auto; max-height: none; padding: 30% 10%; }
	.bloco.planeta-azul .indique h2 { text-align: center; }
	.bloco.planeta-azul .indique p { text-align: center; }
	.bloco.planeta-azul .indique .background { display: none; }

}


.bloco.planeta-errado { position: fixed; z-index: 9; top: 120vh; left: 50%; width: calc(100 * var(--vw, 1vw)); transform: translateX(-50%); color: var(--cor-999); transition: top 800ms cubic-bezier(.87,0,.13,1); /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cdefs%3E%3Cpattern id='doodad' width='15' height='15' viewBox='0 0 40 40' patternUnits='userSpaceOnUse' patternTransform='rotate(146)'%3E%3Crect width='100%25' height='100%25' fill='rgba(0, 121, 193,1)'/%3E%3Ccircle cx='40' cy='20' r='0.25' fill='rgba(82, 0, 0,1)'/%3E%3Ccircle cx='0' cy='20' r='1' fill='rgba(0, 17, 26,1)'/%3E%3Ccircle cx='40' cy='20' r='1' fill='rgba(0, 17, 26,1)'/%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23doodad)' height='200%25' width='200%25'/%3E%3C/svg%3E ");*/ }
.bloco.planeta-errado.cinza { background-color: #C3C3C3; /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cdefs%3E%3Cpattern id='doodad' width='28' height='28' viewBox='0 0 40 40' patternUnits='userSpaceOnUse' patternTransform='rotate(146)'%3E%3Crect width='100%25' height='100%25' fill='rgba(195, 195, 195,1)'/%3E%3Ccircle cx='40' cy='20' r='0.25' fill='rgba(74, 85, 104,1)'/%3E%3Ccircle cx='0' cy='20' r='1' fill='rgba(74, 85, 104,1)'/%3E%3Ccircle cx='40' cy='20' r='1' fill='rgba(74, 85, 104,1)'/%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23doodad)' height='200%25' width='200%25'/%3E%3C/svg%3E ");*/ }
.bloco.planeta-errado.vermelho { background-color: #FF6666; /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cdefs%3E%3Cpattern id='doodad' width='28' height='28' viewBox='0 0 40 40' patternUnits='userSpaceOnUse' patternTransform='rotate(146)'%3E%3Crect width='100%25' height='100%25' fill='rgba(255, 102, 102, 1)'/%3E%3Ccircle cx='40' cy='20' r='0.25' fill='rgba(255, 102, 102, 1)'/%3E%3Ccircle cx='0' cy='20' r='1' fill='rgba(138, 0, 0, 1)'/%3E%3Ccircle cx='40' cy='20' r='1' fill='rgba(138, 0, 0, 1)'/%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23doodad)' height='200%25' width='200%25'/%3E%3C/svg%3E ");*/ }
.bloco.planeta-errado.exibir { top: 0; }
.bloco.planeta-errado h2 { color: var(--cor-950); }
.bloco.planeta-errado h2 strong { color: var(--cor-000); }
.bloco.planeta-errado p { max-width: 63ch; opacity: .8; }
.bloco.planeta-errado a.botao { color: var(--cor-900); 	background-color: var(--cor-fundo-claro); }
.bloco.planeta-errado a.botao:hover,
.bloco.planeta-errado a.botao:focus { color: var(--cor-000); background-color: var(--cor-950); }
.bloco.planeta-errado a.botao:active { color: var(--cor-000); background-color: var(--cor-active); }
.bloco.planeta-errado a.botao:before { border-color: var(--cor-500a); }
.bloco.planeta-errado .background { background-position: center; }

@media screen and (max-width: 767px) {

	.bloco.planeta-errado .background,
	.bloco.planeta-errado a.botao span { display: none; }

}


/*
Footer
--------------------------------------------
*/


footer.footer {	--limite: 1170px; --altura-corte: calc(20 * var(--vw, 1vw)); --espaco: 50px; }
@media screen and (min-width: 1280px) and (max-width: 1439px) {
	footer.footer { --limite: calc((100 * var(--vw, 1vw)) - (var(--espaco) * 5)); }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
	footer.footer { --limite: calc((100 * var(--vw, 1vw)) - (var(--espaco) * 3)); --altura-corte: calc(25 * var(--vw, 1vw)); }
}
@media screen and (max-width: 767px) {
	footer.footer { --limite: calc((100 * var(--vw, 1vw)) - (var(--espaco) * 2)); --altura-corte: calc(50 * var(--vw, 1vw)); --espaco: 40px; }
}

footer.footer { display: flex; justify-content: flex-end; align-items: flex-end; height: 270px; padding: 0 var(--espaco) calc(var(--espaco) * .5); }
footer.footer:before { position: absolute; bottom: 0; right: 0; width: 100%; height: 100%; background-color: var(--cor-softfocus-escuro); clip-path: polygon(100% 0, 0% var(--altura-corte), 100% var(--altura-corte)); content: ""; }

footer.footer a.logotipo { position: absolute; top: 50%; left: 50%; margin-left: calc(var(--limite) * -.5); transform: translateY(-50%); padding: 12px 0; background-size: 0% 1px; background-image: linear-gradient(var(--cor-primaria), var(--cor-primaria)); filter: brightness(0) invert(1); }
footer.footer a.logotipo:focus { background-size: 100% 1px; }
footer.footer a.logotipo img + .lazy-carregando { width: 130px; height: 80px; }

footer.footer address { display: flex; flex-direction: column; margin-right: calc(var(--espaco) * .5); font-size: var(--fs-100); font-style: normal; line-height: var(--line-height); color: var(--cor-000a); text-align: right; }
footer.footer address a { display: inline-block; align-self: flex-end; color: var(--cor-000a); }
footer.footer address a[itemprop="telephone"] { font-size: var(--fs-500); font-weight: var(--fw-semibold); line-height: 1.3333em; margin-bottom: 3px; }

footer.footer ul { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
footer.footer li { min-height: 30px; margin: 0 10px; opacity: .5; }
footer.footer li a { display: block; padding: 5px 0; background-image: linear-gradient(var(--cor-000), var(--cor-000)); }
footer.footer li img { filter: invert(1); }

footer.footer .direitos-reservados { position: absolute; bottom: calc(var(--espaco) * .5); left: calc(var(--espaco) * .5); font-size: var(--fs-100); font-style: normal; font-weight: var(--fw-semibold); line-height: var(--line-height); opacity: .7; pointer-events: all; }

footer.footer a.voltar-ao-topo { 
	position: absolute; 
	/*bottom: calc(100% - 110px); 
	right: 50%; 
	margin-right: calc(var(--limite) * -.5); */
	bottom: calc(100% - 50px);
	right: var(--espaco);
	width: 40px; 
	height: 80px; 
	background-image: url(imagens/voltar-ao-topo.svg); 
	background-position: center top; 
	background-size: auto; 
	transition: height 100ms ease-in-out; 
}
footer.footer a.voltar-ao-topo:hover,
footer.footer a.voltar-ao-topo:focus { height: 100px; }


@media screen and (min-width: 1280px) and (max-width: 1440px) {

	footer.footer { height: 240px; padding-right: calc(var(--espaco) * .6); }

}


@media screen and (min-width: 1280px) and (max-width: 1365px) {

	footer.footer ul { flex-direction: column; }
	footer.footer li a { padding: 7px 0 3px; }

}


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

	footer.footer { height: 230px; padding: 0 calc(var(--espaco) * .5) calc(var(--espaco) * .5); }

	footer.footer address strong { display: block; }

	footer.footer ul { flex-direction: column; }
	footer.footer li a { padding: 7px 0 3px; }

}


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

	footer.footer a.logotipo { width: 110px; }
	footer.footer a.logotipo img + .lazy-carregando { width: 110px; height: 68px; }

	footer.footer ul { flex-direction: column; }
	footer.footer li a { padding: 7px 0 3px; }

}


@media screen and (max-width: 767px) {

	footer.footer { flex-direction: column; height: 300px; padding: 0 calc(var(--espaco) * .75) calc(var(--espaco) * .75); }
	footer.footer:before { clip-path: polygon(100% 0, 0% var(--altura-corte), 0 100%, 100% 100%); }

	footer.footer a.logotipo { top: 20px; transform: translateY(0); width: 85px; }
	footer.footer a.logotipo img + .lazy-carregando { width: 85px; height: 52px; }

	footer.footer address { margin-right: 5px; margin-bottom: 10px; }
	footer.footer address strong { display: block; }

	footer.footer ul { flex-shrink: 0; }
	footer.footer li a { padding: 7px 0 3px; }

	footer.footer .direitos-reservados { display: none; }

	footer.footer a.voltar-ao-topo { 
		bottom: calc(100% - 50px);
		width: 30px; 
		height: 60px; 
		background-size: 100% auto; 
	}
	footer.footer a.voltar-ao-topo:hover,
	footer.footer a.voltar-ao-topo:focus { height: 75px; }

}