@charset "UTF-8";
:root {
  --azul: #1E325C;
  --azul-dark: #152340;
  --azul-alt: #006EA0;
  --azul-alt2: #014D70;
  --sec-azul: #0084B5;
  --sec-verde: #5E9333;
  --sec-vermelho: #D03642;
  --sec-amarelo: #F7A600;
  --sec-laranja: #EF7D00;
  --sec-roxo: #8968AA;
  --bg-claro: #F4F1EC;
  --bg-cinza: #E9E3DC;
  --bg-cinza2: #D3CDC8;
  --bg-mapa: #B2ADA9;
  --w-mobile: 600px;
  --w-tablet: 1050px;
  interpolate-size: allow-keywords;
  --pad-base: 4em;
}

.place-black ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #000;
}
.place-black ::-moz-placeholder { /* Firefox 19+ */
  color: #000;
}
.place-black :-ms-input-placeholder { /* IE 10+ */
  color: #000;
}
.place-black :-moz-placeholder { /* Firefox 18- */
  color: #000;
}

.place-white ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #fff;
}
.place-white ::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
}
.place-white :-ms-input-placeholder { /* IE 10+ */
  color: #fff;
}
.place-white :-moz-placeholder { /* Firefox 18- */
  color: #fff;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
a:active {
  text-decoration: none;
}

p a:hover, p a:active {
  text-decoration: underline;
}

strong, b {
  font-weight: bold;
}

em {
  font-style: italic;
}

input:focus, textarea:focus, select:focus {
  outline: none !important;
}

.txt_100 {
  font-size: 100px;
  font-size: 10rem;
  font-size: clamp(4.8rem, 5.652173913vw + -0.852173913rem, 10rem);
}

.txt_85 {
  font-size: 85px;
  font-size: 8.5rem;
  font-size: clamp(4.25rem, 4.6195652174vw + -0.3695652174rem, 8.5rem);
}

.txt_80 {
  font-size: 80px;
  font-size: 8rem;
  font-size: clamp(4rem, 4.347826087vw + -0.347826087rem, 8rem);
  line-height: 1.2;
}

.txt_72 {
  font-size: 72px;
  font-size: 7.2rem;
  font-size: clamp(3.7rem, 3.8043478261vw + -0.1043478261rem, 7.2rem);
}

.txt_70 {
  font-size: 70px;
  font-size: 7rem;
  font-size: clamp(3.6rem, 3.6956521739vw + -0.0956521739rem, 7rem);
}

.txt_65 {
  font-size: 60px;
  font-size: 6rem;
  font-size: clamp(3.25rem, 3.5326086957vw + -0.2826086957rem, 6.5rem);
}

.txt_60 {
  font-size: 60px;
  font-size: 6rem;
  font-size: clamp(3.1rem, 3.152173913vw + -0.052173913rem, 6rem);
}

.txt_58 {
  font-size: 58px;
  font-size: 5.8rem;
  font-size: clamp(3rem, 3.0434782609vw + -0.0434782609rem, 5.8rem);
}

.txt_50 {
  font-size: 50px;
  font-size: 5rem;
  font-size: clamp(2.5rem, 2.7173913043vw + -0.2173913043rem, 5rem);
}

.txt_48 {
  font-size: 48px;
  font-size: 4.8rem;
  font-size: clamp(2.4rem, 2.6086956522vw + -0.2086956522rem, 4.8rem);
}

.txt_44 {
  font-size: 44px;
  font-size: 4.4rem;
  font-size: clamp(2.2rem, 2.3913043478vw + -0.1913043478rem, 4.4rem);
}

.txt_42 {
  font-size: 42px;
  font-size: 4.2rem;
  font-size: clamp(2.1rem, 2.2826086957vw + -0.1826086957rem, 4.2rem);
}

.txt_40 {
  font-size: 40px;
  font-size: 4rem;
  font-size: clamp(2.05rem, 2.1195652174vw + -0.0695652174rem, 4rem);
}

.txt_38 {
  font-size: 38px;
  font-size: 3.8rem;
  font-size: clamp(1.95rem, 2.0108695652vw + -0.0608695652rem, 3.8rem);
}

.txt_36, .modal .compartilhe a {
  font-size: 30px;
  font-size: 3rem;
  font-size: clamp(1.85rem, 1.902173913vw + -0.052173913rem, 3.6rem);
}

.txt_35 {
  font-size: 35px;
  font-size: 3.5rem;
  font-size: clamp(1.8rem, 1.847826087vw + -0.047826087rem, 3.5rem);
}

.txt_32, .tooltip-modelo .valor span, .detalhamento-modelo .indice-titulo .valor, .section-footer .footer-sociais, .home-abertura .coluna-texto h1, .home-contato .coluna-texto h2 {
  font-size: 32px;
  font-size: 3.2rem;
  font-size: clamp(1.7rem, 1.6304347826vw + 0.0695652174rem, 3.2rem);
}

.txt_30 {
  font-size: 30px;
  font-size: 3rem;
  font-size: clamp(1.6rem, 1.5217391304vw + 0.0782608696rem, 3rem);
}

.txt_28, .base-mapa .loading {
  font-size: 28px;
  font-size: 2.8rem;
  font-size: clamp(1.5rem, 1.4130434783vw + 0.0869565217rem, 2.8rem);
}
@media (width <= 600px) {
  .txt_28, .base-mapa .loading {
    font-size: 17px;
  }
}

.txt_26 {
  font-size: 26px;
  font-size: 2.6rem;
  font-size: clamp(1.35rem, 1.3586956522vw + -0.0086956522rem, 2.6rem);
}
@media (width <= 600px) {
  .txt_26 {
    font-size: 17px;
  }
}

.txt_25 {
  font-size: 25px;
  font-size: 2.5rem;
  font-size: clamp(1.3rem, 1.3043478261vw + -0.0043478261rem, 2.5rem);
}
@media (width <= 600px) {
  .txt_25 {
    font-size: 16px;
  }
}

.txt_24, .tooltip-modelo .valor-menor span, .detalhamento-modelo .det-modulo-topo h3, .modal .modal-titulo h2, .box-aba .texto-big, .num, .home-mapa-explicado .lf-destaques .frase-dest {
  font-size: 24px;
  font-size: 2.4rem;
  font-size: clamp(1.25rem, 1.25vw + 0rem, 2.4rem);
}
@media (width <= 600px) {
  .txt_24, .tooltip-modelo .valor-menor span, .detalhamento-modelo .det-modulo-topo h3, .modal .modal-titulo h2, .box-aba .texto-big, .num, .home-mapa-explicado .lf-destaques .frase-dest {
    font-size: 16px;
  }
}

.txt_22 {
  font-size: 20px;
  font-size: 2rem;
  font-size: clamp(1.15rem, 1.1413043478vw + 0.0086956522rem, 2.2rem);
}
@media (width <= 600px) {
  .txt_22 {
    font-size: 15px;
  }
}

.txt_20, .tooltip-modelo, .tooltip-modelo .valor-menor, .tooltip-modelo .lista-icones, .detalhamento-modelo .indice-titulo .titulo span, .detalhamento-modelo .det-modulo-distancias h3, .detalhamento-modelo .inside-evolucao h3, .home-base .home-controle, .home-sidebar, .titulo-aba, .box-aba .box-coluna-texto, .home-sobre .coluna-animacao, .section {
  font-size: 20px;
  font-size: 2rem;
  font-size: clamp(1.05rem, 1.0326086957vw + 0.0173913043rem, 2rem);
}
@media (width <= 600px) {
  .txt_20, .tooltip-modelo, .tooltip-modelo .valor-menor, .tooltip-modelo .lista-icones, .detalhamento-modelo .indice-titulo .titulo span, .detalhamento-modelo .det-modulo-distancias h3, .detalhamento-modelo .inside-evolucao h3, .home-base .home-controle, .home-sidebar, .titulo-aba, .box-aba .box-coluna-texto, .home-sobre .coluna-animacao, .section {
    font-size: 15px;
  }
}

.txt_18, .dropdown-comp .nome-indice p, .detalhamento-modelo .valores-variaveis .item-var, .detalhamento-modelo .distancia-graf .graf-valor, .link-icone, .home-sobre .item-animacao p, .home-indice .apresenta p, .infog-indice .nav-seta {
  font-size: 18px;
  font-size: 1.8rem;
  font-size: clamp(0.95rem, 0.9239130435vw + 0.0260869565rem, 1.8rem);
}
@media (width <= 600px) {
  .txt_18, .dropdown-comp .nome-indice p, .detalhamento-modelo .valores-variaveis .item-var, .detalhamento-modelo .distancia-graf .graf-valor, .link-icone, .home-sobre .item-animacao p, .home-indice .apresenta p, .infog-indice .nav-seta {
    font-size: 14px;
  }
}

.txt_17 {
  font-size: 16px;
  font-size: 1.6rem;
  font-size: clamp(0.9rem, 0.7608695652vw + 0.1391304348rem, 1.6rem);
}
@media (width <= 600px) {
  .txt_17 {
    font-size: 13px;
  }
}

.txt_16, .dropdown-comp .opcoes-anos .item-ano span, .dropdown-comp .opcao-resolucao span, .base-mapa .box-escolha-indice .selecao, .tooltip-modelo .topo span, .tooltip-modelo .linha-icone span, .detalhamento-modelo .det-modulo-topo .hex, .detalhamento-modelo .det-modulo-topo .fechar, .detalhamento-modelo .inside-evolucao h4, .detalhamento-modelo .inside-evolucao h5, .modal .modal-info, .section-footer .mapa-site, .footer-expediente .container, .home-menu .menu-nav, .home-menu-mobile .menu-nav, .home-sobre .graf-bolinha, .infog-indice .nav-infog span, .infog-indice .slide-infog .col-graficos .box-explica, .infog-indice .slide-infog .col-graficos .box-variavel, .float-tutorial .num {
  font-size: 16px;
  font-size: 1.6rem;
  font-size: clamp(0.875rem, 0.7880434783vw + 0.0869565217rem, 1.6rem);
}
@media (width <= 600px) {
  .txt_16, .dropdown-comp .opcoes-anos .item-ano span, .dropdown-comp .opcao-resolucao span, .base-mapa .box-escolha-indice .selecao, .tooltip-modelo .topo span, .tooltip-modelo .linha-icone span, .detalhamento-modelo .det-modulo-topo .hex, .detalhamento-modelo .det-modulo-topo .fechar, .detalhamento-modelo .inside-evolucao h4, .detalhamento-modelo .inside-evolucao h5, .modal .modal-info, .section-footer .mapa-site, .footer-expediente .container, .home-menu .menu-nav, .home-menu-mobile .menu-nav, .home-sobre .graf-bolinha, .infog-indice .nav-infog span, .infog-indice .slide-infog .col-graficos .box-explica, .infog-indice .slide-infog .col-graficos .box-variavel, .float-tutorial .num {
    font-size: 13px;
  }
}

.txt_15 {
  font-size: 15px;
  font-size: 1.5rem;
  font-size: clamp(0.85rem, 0.7065217391vw + 0.1434782609rem, 1.5rem);
}
@media (width <= 600px) {
  .txt_15 {
    font-size: 13px;
  }
}

.txt_14, .dropdown-comp .label-info, .tooltip-modelo .hex, .detalhamento-modelo .valores-variaveis .item-var span span, .detalhamento-modelo .abre-evolucao, .modal .compartilhe span, .modal .controle-download .linha > span, .modal .controle-download .opcao span, .modal .botao, .infog-indice .slide-infog .col-graficos .box-variavel small, .float-tutorial, .float-tutorial .controles a {
  font-size: 14px;
  font-size: 1.4rem;
  font-size: clamp(0.825rem, 0.625vw + 0.2rem, 1.4rem);
}
@media (width <= 600px) {
  .txt_14, .dropdown-comp .label-info, .tooltip-modelo .hex, .detalhamento-modelo .valores-variaveis .item-var span span, .detalhamento-modelo .abre-evolucao, .modal .compartilhe span, .modal .controle-download .linha > span, .modal .controle-download .opcao span, .modal .botao, .infog-indice .slide-infog .col-graficos .box-variavel small, .float-tutorial, .float-tutorial .controles a {
    font-size: 14px;
  }
}

.txt_12, .dropdown-comp .nome-indice small, .info-hover-txt, .base-mapa .box-escala .item-escala, .base-mapa .box-escolha-indice .vlabel, .tooltip-modelo .topo small, .tooltip-modelo .bottom small, .detalhamento-modelo .indice-titulo .titulo small, .modal .modal-titulo small, .modal .controle-download .opcoes select, .modal .controle-download .opcao, .modal .controle-download .select-label label, .section-footer .realizacao h3, .box-aba .link-capa .link-icone, .home-metodologia .link-externo .link-icone {
  font-size: 12px;
  font-size: 1.2rem;
  font-size: clamp(0.8rem, 0.4347826087vw + 0.3652173913rem, 1.2rem);
}
@media (width <= 600px) {
  .txt_12, .dropdown-comp .nome-indice small, .info-hover-txt, .base-mapa .box-escala .item-escala, .base-mapa .box-escolha-indice .vlabel, .tooltip-modelo .topo small, .tooltip-modelo .bottom small, .detalhamento-modelo .indice-titulo .titulo small, .modal .modal-titulo small, .modal .controle-download .opcoes select, .modal .controle-download .opcao, .modal .controle-download .select-label label, .section-footer .realizacao h3, .box-aba .link-capa .link-icone, .home-metodologia .link-externo .link-icone {
    font-size: 12px;
  }
}

.section {
  width: 100%;
  height: auto;
}
.section .container {
  width: 100%;
  margin: 0 auto;
  padding-left: 7.5vw;
  padding-right: 7.5vw;
}
@media (width <= var(--w-mobile)) {
  .section .container {
    padding-left: 8vw;
    padding-right: 8vw;
  }
}

.layout-flex, .lf {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.layout-flex.ais, .lf.ais {
  align-items: stretch;
}
.layout-flex.aifs, .lf.aifs {
  align-items: flex-start;
}
.layout-flex.aife, .lf.aife {
  align-items: flex-end;
}
.layout-flex.jcsb, .lf.jcsb {
  justify-content: space-between;
}
.layout-flex.jcsa, .lf.jcsa {
  justify-content: space-around;
}
.layout-flex.jcfs, .lf.jcfs {
  justify-content: flex-start;
}
.layout-flex.jcfe, .lf.jcfe {
  justify-content: flex-end;
}
.layout-flex .bloco-imagem img, .lf .bloco-imagem img {
  width: 100%;
  display: block;
}
.layout-flex .full, .lf .full {
  width: 100% !important;
}

.coluna-1 {
  width: 6.3041666667vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-1 {
    width: 100%;
  }
}

.coluna-2 {
  width: 13.4583333333vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-2 {
    width: 100%;
  }
}

.coluna-3 {
  width: 20.6125vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-3 {
    width: 100%;
  }
}

.coluna-4 {
  width: 27.7666666667vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-4 {
    width: 100%;
  }
}

.coluna-5 {
  width: 34.9208333333vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-5 {
    width: 100%;
  }
}

.coluna-6 {
  width: 42.075vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-6 {
    width: 100%;
  }
}

.coluna-7 {
  width: 49.2291666667vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-7 {
    width: 100%;
  }
}

.coluna-8 {
  width: 56.3833333333vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-8 {
    width: 100%;
  }
}

.coluna-9 {
  width: 63.5375vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-9 {
    width: 100%;
  }
}

.coluna-10 {
  width: 70.6916666667vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-10 {
    width: 100%;
  }
}

.coluna-11 {
  width: 77.8458333333vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-11 {
    width: 100%;
  }
}

.coluna-12 {
  width: 85vw;
}
@media (width <= var(--w-mobile)) {
  .coluna-12 {
    width: 100%;
  }
}

@media (width <= var(--w-mobile)) {
  .mobile-1 {
    width: 13.1666666667vw;
  }
}
@media (width <= var(--w-mobile)) {
  .mobile-2 {
    width: 27.3333333333vw;
  }
}
@media (width <= var(--w-mobile)) {
  .mobile-3 {
    width: 41.5vw;
  }
}
@media (width <= var(--w-mobile)) {
  .mobile-4 {
    width: 55.6666666667vw;
  }
}
@media (width <= var(--w-mobile)) {
  .mobile-5 {
    width: 69.8333333333vw;
  }
}
@media (width <= var(--w-mobile)) {
  .mobile-6 {
    width: 84vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-1 {
    width: 10.375vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-2 {
    width: 21.75vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-3 {
    width: 33.125vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-4 {
    width: 44.5vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-5 {
    width: 55.875vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-6 {
    width: 67.25vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-7 {
    width: 78.625vw;
  }
}
@media (width <= var(--w-tablet)) {
  .landscape-8 {
    width: 90vw;
  }
}
.simula-colunas {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000000;
  opacity: 0.25;
  pointer-events: none;
}
.simula-colunas .container {
  width: 100%;
  height: 100%;
}
.simula-colunas .layout-flex {
  width: 120vw;
  height: 100%;
  flex-wrap: nowrap;
}
.simula-colunas .modulo-desk {
  display: flex;
}
.simula-colunas .modulo-mobile {
  display: none;
}
.simula-colunas .modulo-land {
  display: none;
}
@media (width <= var(--w-mobile)) {
  .simula-colunas .modulo-desk {
    display: none;
  }
  .simula-colunas .modulo-mobile {
    display: flex;
  }
  .simula-colunas .modulo-land {
    display: none;
  }
}
@media (width <= var(--w-tablet)) {
  .simula-colunas .modulo-desk {
    display: none;
  }
  .simula-colunas .modulo-mobile {
    display: none;
  }
  .simula-colunas .modulo-land {
    display: flex;
  }
}
.simula-colunas .coluna-1 {
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
}
@media (width <= var(--w-mobile)) {
  .simula-colunas .coluna-1 {
    width: 13.1666666667vw;
  }
}
@media (width <= var(--w-tablet)) {
  .simula-colunas .coluna-1 {
    width: 10.375vw;
  }
}
.simula-colunas .gutter {
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  width: 0.85vw;
}
@media (width <= var(--w-mobile)) {
  .simula-colunas .gutter {
    width: 1vw;
  }
}
@media (width <= var(--w-tablet)) {
  .simula-colunas .gutter {
    width: 1vw;
  }
}

[v-cloak] > * {
  display: none;
}

[v-cloak]::before {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #898989;
  content: "carregando…";
  z-index: 9999999;
  top: 0;
  left: 0;
}

.loading-screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  z-index: 1000;
}

.nav-icon {
  --burger-w: 2.2vw;
  --burger-h: 1.7vw;
  --burger-bar: 0.25vw;
  --burger-bg: #fff;
}
@media (width <= 1050px) {
  .nav-icon {
    --burger-w: 8vw;
    --burger-h: 6vw;
    --burger-bar: 0.8vw;
  }
}
.nav-icon {
  display: block;
  width: var(--burger-w);
  height: var(--burger-h);
  position: relative;
  transform: rotate(0deg);
  transition: 0.5s ease-in-out;
  background: transparent;
  margin: 0;
  padding: 0;
  border: none;
  cursor: pointer;
}
.nav-icon span {
  display: block;
  position: absolute;
  height: var(--burger-bar);
  width: 100%;
  background: var(--burger-bg);
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: 0.25s ease-in-out;
}
.nav-icon span:nth-child(1) {
  top: 0px;
}
.nav-icon span:nth-child(2), .nav-icon span:nth-child(3) {
  top: calc(50% - var(--burger-bar) / 2);
}
.nav-icon span:nth-child(4) {
  top: calc(100% - var(--burger-bar));
}
.nav-icon.is-active span:nth-child(1) {
  top: calc(50% - var(--burger-bar) / 2);
  width: 0%;
  left: 50%;
}
.nav-icon.is-active span:nth-child(2) {
  transform: rotate(45deg);
}
.nav-icon.is-active span:nth-child(3) {
  transform: rotate(-45deg);
}
.nav-icon.is-active span:nth-child(4) {
  top: calc(50% - var(--burger-bar) / 2);
  width: 0%;
  left: 50%;
}
.nav-icon:hover {
  --burger-bg: var(--sec-amarelo);
}

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
  padding: 4px 4px !important;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}

.hamburger:hover {
  opacity: 0.7;
}

.hamburger.is-active:hover {
  opacity: 0.7;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
  background-color: #ffffff;
}

.hamburger-box {
  width: 26px;
  height: 12px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 26px;
  height: 2px;
  background-color: #ffffff;
  border-radius: 4px;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -9px;
}

.hamburger-inner::after {
  bottom: -9px;
}

/*
   * 3DX
   */
.hamburger--3dx .hamburger-box {
  perspective: 80px;
}

.hamburger--3dx .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateY(180deg);
}

.hamburger--3dx.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dx.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * 3DX Reverse
   */
.hamburger--3dx-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dx-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx-r .hamburger-inner::before, .hamburger--3dx-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateY(-180deg);
}

.hamburger--3dx-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dx-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * 3DY
   */
.hamburger--3dy .hamburger-box {
  perspective: 80px;
}

.hamburger--3dy .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy .hamburger-inner::before, .hamburger--3dy .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(-180deg);
}

.hamburger--3dy.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dy.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * 3DY Reverse
   */
.hamburger--3dy-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dy-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy-r .hamburger-inner::before, .hamburger--3dy-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg);
}

.hamburger--3dy-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dy-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * 3DXY
   */
.hamburger--3dxy .hamburger-box {
  perspective: 80px;
}

.hamburger--3dxy .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy .hamburger-inner::before, .hamburger--3dxy .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg) rotateY(180deg);
}

.hamburger--3dxy.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dxy.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * 3DXY Reverse
   */
.hamburger--3dxy-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dxy-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy-r .hamburger-inner::before, .hamburger--3dxy-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg) rotateY(180deg) rotateZ(-180deg);
}

.hamburger--3dxy-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dxy-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
   * Arrow
   */
.hamburger--arrow.is-active .hamburger-inner::before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

.hamburger--arrow.is-active .hamburger-inner::after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

/*
   * Arrow Right
   */
.hamburger--arrow-r.is-active .hamburger-inner::before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

.hamburger--arrow-r.is-active .hamburger-inner::after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

/*
   * Arrow Alt
   */
.hamburger--arrowalt .hamburger-inner::before {
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt .hamburger-inner::after {
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt.is-active .hamburger-inner::before {
  top: 0;
  transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.hamburger--arrowalt.is-active .hamburger-inner::after {
  bottom: 0;
  transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

/*
   * Arrow Alt Right
   */
.hamburger--arrowalt-r .hamburger-inner::before {
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt-r .hamburger-inner::after {
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt-r.is-active .hamburger-inner::before {
  top: 0;
  transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.hamburger--arrowalt-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

/*
   * Arrow Turn
   */
.hamburger--arrowturn.is-active .hamburger-inner {
  transform: rotate(-180deg);
}

.hamburger--arrowturn.is-active .hamburger-inner::before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

.hamburger--arrowturn.is-active .hamburger-inner::after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

/*
   * Arrow Turn Right
   */
.hamburger--arrowturn-r.is-active .hamburger-inner {
  transform: rotate(-180deg);
}

.hamburger--arrowturn-r.is-active .hamburger-inner::before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

.hamburger--arrowturn-r.is-active .hamburger-inner::after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

/*
   * Boring
   */
.hamburger--boring .hamburger-inner, .hamburger--boring .hamburger-inner::before, .hamburger--boring .hamburger-inner::after {
  transition-property: none;
}

.hamburger--boring.is-active .hamburger-inner {
  transform: rotate(45deg);
}

.hamburger--boring.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--boring.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
}

/*
   * Collapse
   */
.hamburger--collapse .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0.13s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}

.hamburger--collapse .hamburger-inner::before {
  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--collapse.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}

.hamburger--collapse.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-90deg);
  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Collapse Reverse
   */
.hamburger--collapse-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0.13s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse-r .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}

.hamburger--collapse-r .hamburger-inner::before {
  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse-r.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--collapse-r.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}

.hamburger--collapse-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(90deg);
  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Elastic
   */
.hamburger--elastic .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-270deg);
  transition-delay: 0.075s;
}

/*
   * Elastic Reverse
   */
.hamburger--elastic-r .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic-r .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic-r.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(270deg);
  transition-delay: 0.075s;
}

/*
   * Emphatic
   */
.hamburger--emphatic {
  overflow: hidden;
}

.hamburger--emphatic .hamburger-inner {
  transition: background-color 0.125s 0.175s ease-in;
}

.hamburger--emphatic .hamburger-inner::before {
  left: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
}

.hamburger--emphatic .hamburger-inner::after {
  top: 10px;
  right: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
}

.hamburger--emphatic.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important;
}

.hamburger--emphatic.is-active .hamburger-inner::before {
  left: -80px;
  top: -80px;
  transform: translate3d(80px, 80px, 0) rotate(45deg);
  transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.hamburger--emphatic.is-active .hamburger-inner::after {
  right: -80px;
  top: -80px;
  transform: translate3d(-80px, 80px, 0) rotate(-45deg);
  transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

/*
   * Emphatic Reverse
   */
.hamburger--emphatic-r {
  overflow: hidden;
}

.hamburger--emphatic-r .hamburger-inner {
  transition: background-color 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r .hamburger-inner::before {
  left: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r .hamburger-inner::after {
  top: 10px;
  right: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important;
}

.hamburger--emphatic-r.is-active .hamburger-inner::before {
  left: -80px;
  top: 80px;
  transform: translate3d(80px, -80px, 0) rotate(-45deg);
  transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.hamburger--emphatic-r.is-active .hamburger-inner::after {
  right: -80px;
  top: 80px;
  transform: translate3d(-80px, -80px, 0) rotate(45deg);
  transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

/*
   * Minus
   */
.hamburger--minus .hamburger-inner::before, .hamburger--minus .hamburger-inner::after {
  transition: bottom 0.08s 0s ease-out, top 0.08s 0s ease-out, opacity 0s linear;
}

.hamburger--minus.is-active .hamburger-inner::before, .hamburger--minus.is-active .hamburger-inner::after {
  opacity: 0;
  transition: bottom 0.08s ease-out, top 0.08s ease-out, opacity 0s 0.08s linear;
}

.hamburger--minus.is-active .hamburger-inner::before {
  top: 0;
}

.hamburger--minus.is-active .hamburger-inner::after {
  bottom: 0;
}

/*
   * Slider
   */
.hamburger--slider .hamburger-inner {
  top: 2px;
}

.hamburger--slider .hamburger-inner::before {
  top: 10px;
  transition-property: transform, opacity;
  transition-timing-function: ease;
  transition-duration: 0.15s;
}

.hamburger--slider .hamburger-inner::after {
  top: 20px;
}

.hamburger--slider.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--slider.is-active .hamburger-inner::before {
  transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
  opacity: 0;
}

.hamburger--slider.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-90deg);
}

/*
   * Slider Reverse
   */
.hamburger--slider-r .hamburger-inner {
  top: 2px;
}

.hamburger--slider-r .hamburger-inner::before {
  top: 10px;
  transition-property: transform, opacity;
  transition-timing-function: ease;
  transition-duration: 0.15s;
}

.hamburger--slider-r .hamburger-inner::after {
  top: 20px;
}

.hamburger--slider-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-45deg);
}

.hamburger--slider-r.is-active .hamburger-inner::before {
  transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
  opacity: 0;
}

.hamburger--slider-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(90deg);
}

/*
   * Spin
   */
.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin .hamburger-inner::before {
  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
}

.hamburger--spin .hamburger-inner::after {
  transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin.is-active .hamburger-inner {
  transform: rotate(225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spin.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
}

.hamburger--spin.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
  transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Spin Reverse
   */
.hamburger--spin-r .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin-r .hamburger-inner::before {
  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
}

.hamburger--spin-r .hamburger-inner::after {
  transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin-r.is-active .hamburger-inner {
  transform: rotate(-225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spin-r.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
}

.hamburger--spin-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(90deg);
  transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Spring
   */
.hamburger--spring .hamburger-inner {
  top: 2px;
  transition: background-color 0s 0.13s linear;
}

.hamburger--spring .hamburger-inner::before {
  top: 10px;
  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring .hamburger-inner::after {
  top: 20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring.is-active .hamburger-inner {
  transition-delay: 0.22s;
  background-color: transparent !important;
}

.hamburger--spring.is-active .hamburger-inner::before {
  top: 0;
  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--spring.is-active .hamburger-inner::after {
  top: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translate3d(0, 10px, 0) rotate(-45deg);
}

/*
   * Spring Reverse
   */
.hamburger--spring-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring-r .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear;
}

.hamburger--spring-r .hamburger-inner::before {
  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring-r.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spring-r.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear;
}

.hamburger--spring-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(90deg);
  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Stand
   */
.hamburger--stand .hamburger-inner {
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
}

.hamburger--stand .hamburger-inner::before {
  transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand .hamburger-inner::after {
  transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand.is-active .hamburger-inner {
  transform: rotate(90deg);
  background-color: transparent !important;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
}

.hamburger--stand.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-45deg);
  transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--stand.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(45deg);
  transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Stand Reverse
   */
.hamburger--stand-r .hamburger-inner {
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
}

.hamburger--stand-r .hamburger-inner::before {
  transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand-r .hamburger-inner::after {
  transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand-r.is-active .hamburger-inner {
  transform: rotate(-90deg);
  background-color: transparent !important;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
}

.hamburger--stand-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-45deg);
  transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--stand-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(45deg);
  transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Squeeze
   */
.hamburger--squeeze .hamburger-inner {
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--squeeze .hamburger-inner::before {
  transition: top 0.075s 0.12s ease, opacity 0.075s ease;
}

.hamburger--squeeze .hamburger-inner::after {
  transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--squeeze.is-active .hamburger-inner {
  transform: rotate(45deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--squeeze.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.075s ease, opacity 0.075s 0.12s ease;
}

.hamburger--squeeze.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
  transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
   * Vortex
   */
.hamburger--vortex .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex .hamburger-inner::before, .hamburger--vortex .hamburger-inner::after {
  transition-duration: 0s;
  transition-delay: 0.1s;
  transition-timing-function: linear;
}

.hamburger--vortex .hamburger-inner::before {
  transition-property: top, opacity;
}

.hamburger--vortex .hamburger-inner::after {
  transition-property: bottom, transform;
}

.hamburger--vortex.is-active .hamburger-inner {
  transform: rotate(765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex.is-active .hamburger-inner::before, .hamburger--vortex.is-active .hamburger-inner::after {
  transition-delay: 0s;
}

.hamburger--vortex.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--vortex.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(90deg);
}

/*
   * Vortex Reverse
   */
.hamburger--vortex-r .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex-r .hamburger-inner::before, .hamburger--vortex-r .hamburger-inner::after {
  transition-duration: 0s;
  transition-delay: 0.1s;
  transition-timing-function: linear;
}

.hamburger--vortex-r .hamburger-inner::before {
  transition-property: top, opacity;
}

.hamburger--vortex-r .hamburger-inner::after {
  transition-property: bottom, transform;
}

.hamburger--vortex-r.is-active .hamburger-inner {
  transform: rotate(-765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex-r.is-active .hamburger-inner::before, .hamburger--vortex-r.is-active .hamburger-inner::after {
  transition-delay: 0s;
}

.hamburger--vortex-r.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--vortex-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
}

:root {
  --h-menu-desk: 5vw;
  --wid: 100vw;
  --hei: calc(0.5625*var(--wid));
  --gap: calc(var(--wid)/20);
  --quad: calc(var(--wid)/20);
  --mquad: calc(var(--quad)/2);
  --pad-base: 6em;
  --pad-metade: calc(var(--pad-base)/2);
  interpolate-size: allow-keywords;
}
@media (width <= 1050px) {
  :root {
    --pad-base: 2.5em;
    --pad-metade: 1.5em;
    --quad: calc(var(--wid)/6);
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.fa-spinner.animado {
  animation: spin 2s linear infinite;
}

html, body {
  width: 100%;
  height: auto;
  position: relative;
  font-family: "Work Sans", "Calibri", "Lucida Grande", sans-serif;
  font-optical-sizing: auto;
  text-rendering: geometricPrecision;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  color: var(--azul);
  scroll-behavior: smooth;
  background-color: #fff;
  scrollbar-gutter: stable;
}

html {
  scroll-padding-top: var(--h-menu-desk);
  overflow-y: scroll;
}
@media (width <= 600px) {
  html {
    scroll-padding-top: var(--h-menu-desk);
  }
}

body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

.site-content {
  flex: 1;
}

/* Sets up the Base 10 stuff */
html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
}

.stack > * + * {
  margin-block-start: 1em;
}

.section-home {
  background-color: #f1f1f1;
}
.section-home .texto {
  background-color: #cdcdcd;
  padding-block: 3vw;
}

.pane_aberto {
  pointer-events: none !important;
}

.hexagono_aberto {
  pointer-events: none !important;
}

.grid-apoio {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0.05;
  z-index: 200;
  mix-blend-mode: difference;
  pointer-events: none;
}

.grid-colunas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.grid-colunas .col {
  width: 0.5px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
}
.grid-colunas .col-0 {
  left: calc(var(--gap) * 0);
}
.grid-colunas .col-1 {
  left: calc(var(--gap) * 1);
}
.grid-colunas .col-2 {
  left: calc(var(--gap) * 2);
}
.grid-colunas .col-3 {
  left: calc(var(--gap) * 3);
}
.grid-colunas .col-4 {
  left: calc(var(--gap) * 4);
}
.grid-colunas .col-5 {
  left: calc(var(--gap) * 5);
}
.grid-colunas .col-6 {
  left: calc(var(--gap) * 6);
}
.grid-colunas .col-7 {
  left: calc(var(--gap) * 7);
}
.grid-colunas .col-8 {
  left: calc(var(--gap) * 8);
}
.grid-colunas .col-9 {
  left: calc(var(--gap) * 9);
}
.grid-colunas .col-10 {
  left: calc(var(--gap) * 10);
}
.grid-colunas .col-11 {
  left: calc(var(--gap) * 11);
}
.grid-colunas .col-12 {
  left: calc(var(--gap) * 12);
}
.grid-colunas .col-13 {
  left: calc(var(--gap) * 13);
}
.grid-colunas .col-14 {
  left: calc(var(--gap) * 14);
}
.grid-colunas .col-15 {
  left: calc(var(--gap) * 15);
}
.grid-colunas .col-16 {
  left: calc(var(--gap) * 16);
}
.grid-colunas .col-17 {
  left: calc(var(--gap) * 17);
}
.grid-colunas .col-18 {
  left: calc(var(--gap) * 18);
}
.grid-colunas .col-19 {
  left: calc(var(--gap) * 19);
}
.grid-colunas .col-20 {
  left: calc(var(--gap) * 20);
}

.grid-linhas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.grid-linhas .linha {
  position: absolute;
  height: 0.5px;
  width: 100%;
  background-color: #fff;
  left: 0;
}
.grid-linhas .linha-0 {
  top: calc(var(--gap) * 0);
}
.grid-linhas .linha-1 {
  top: calc(var(--gap) * 1);
}
.grid-linhas .linha-2 {
  top: calc(var(--gap) * 2);
}
.grid-linhas .linha-3 {
  top: calc(var(--gap) * 3);
}
.grid-linhas .linha-4 {
  top: calc(var(--gap) * 4);
}
.grid-linhas .linha-5 {
  top: calc(var(--gap) * 5);
}
.grid-linhas .linha-6 {
  top: calc(var(--gap) * 6);
}
.grid-linhas .linha-7 {
  top: calc(var(--gap) * 7);
}
.grid-linhas .linha-8 {
  top: calc(var(--gap) * 8);
}
.grid-linhas .linha-9 {
  top: calc(var(--gap) * 9);
}
.grid-linhas .linha-10 {
  top: calc(var(--gap) * 10);
}
.grid-linhas .linha-11 {
  top: calc(var(--gap) * 11);
}
.grid-linhas .linha-12 {
  top: calc(var(--gap) * 12);
}
.grid-linhas .linha-13 {
  top: calc(var(--gap) * 13);
}
.grid-linhas .linha-14 {
  top: calc(var(--gap) * 14);
}
.grid-linhas .linha-15 {
  top: calc(var(--gap) * 15);
}
.grid-linhas .linha-16 {
  top: calc(var(--gap) * 16);
}
.grid-linhas .linha-17 {
  top: calc(var(--gap) * 17);
}
.grid-linhas .linha-18 {
  top: calc(var(--gap) * 18);
}

.interface-mapa {
  width: 100%;
  height: 100dvh;
  background-color: var(--bg-claro);
  position: relative;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
}
@media (width <= 1050px) {
  .interface-mapa {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
}
.interface-mapa .sidebar-esquerda {
  width: var(--quad);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--azul);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  z-index: 15;
}
@media (width <= 1050px) {
  .interface-mapa .sidebar-esquerda {
    width: 100%;
    height: var(--quad);
    flex-direction: row;
    position: static;
  }
}
.interface-mapa .sidebar-botao {
  width: var(--quad);
  height: var(--quad);
  display: flex;
  align-items: center;
  justify-content: center;
}
.interface-mapa .sidebar-botao .nav-img {
  display: block;
}
.interface-mapa .sidebar-botao .nav-img img {
  display: block;
  width: 1.5em;
  transition: all 0.3s;
}
.interface-mapa .sidebar-botao .nav-img:hover img {
  scale: 1.2;
}
.interface-mapa .sidebar-botao.logo {
  padding: 20%;
}
.interface-mapa .sidebar-botao.logo img {
  display: block;
  width: 100%;
}
.interface-mapa .sidebar-topo {
  width: calc(100% - var(--quad));
  height: var(--quad);
  background-color: var(--azul);
  position: absolute;
  top: 0;
  left: var(--quad);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  z-index: 30;
}
@media (width <= 1050px) {
  .interface-mapa .sidebar-topo {
    width: 100%;
    height: auto;
    position: static;
    display: block;
  }
}

.dropdown-comp {
  width: 33.3333333333%;
  height: var(--quad);
  position: relative;
}
@media (width <= 1050px) {
  .dropdown-comp {
    width: 100%;
  }
  .dropdown-comp:nth-child(1) {
    z-index: 43;
  }
  .dropdown-comp:nth-child(2) {
    z-index: 42;
  }
  .dropdown-comp:nth-child(3) {
    z-index: 41;
  }
}
.dropdown-comp .dropdown-controle {
  width: 100%;
  height: 100%;
  background-color: var(--bg-claro);
  border-block: 1px solid var(--azul);
  border-right: 1px solid var(--azul);
  padding: 0.5em 1em;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
}
.dropdown-comp:last-of-type .dropdown-controle {
  border-right: none;
}
.dropdown-comp .label-info {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.dropdown-comp .label-info small {
  text-transform: uppercase;
}
@media (width <= 1050px) {
  .dropdown-comp .label-info {
    font-size: 10px;
  }
}
.dropdown-comp .chamada-drop {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.dropdown-comp .chamada-drop .seta {
  display: block;
  width: 1em;
}
.dropdown-comp .nome-indice {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
}
.dropdown-comp .nome-indice img {
  display: block;
  width: 1.5em;
}
.dropdown-comp .nome-indice small {
  display: block;
  text-transform: uppercase;
  line-height: 1.2em;
}
.dropdown-comp .nome-indice small.nott {
  text-transform: none;
}
.dropdown-comp .nome-indice p {
  font-weight: bold;
  line-height: 1.2em;
}
.dropdown-comp .dropdown-ativo {
  width: 100%;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: var(--azul);
  color: #fff;
}
.dropdown-comp .opcoes-indices .nome-indice {
  width: 100%;
  padding: 0.5em 1em;
  cursor: pointer;
}
.dropdown-comp .opcoes-indices .nome-indice.ativo {
  background-color: var(--azul-dark);
  border-block: 1px solid #fff;
}
.dropdown-comp .opcoes-indices .nome-indice:hover {
  background-color: var(--bg-claro);
  color: var(--azul);
}
.dropdown-comp .opcoes-anos {
  max-height: 40dvh;
  overflow: auto;
}
.dropdown-comp .opcoes-anos .item-ano {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5em 1em;
  cursor: pointer;
  border-block: 1px solid var(--azul);
  background-color: var(--azul);
  position: relative;
}
.dropdown-comp .opcoes-anos .item-ano span {
  display: block;
}
.dropdown-comp .opcoes-anos .item-ano .disponiveis {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5em;
}
.dropdown-comp .opcoes-anos .item-ano .disponiveis img {
  display: block;
  width: 1.5em;
}
.dropdown-comp .opcoes-anos .item-ano.ativo {
  background-color: var(--azul-dark);
  border-block: 1px solid #fff;
  z-index: 5;
}
.dropdown-comp .opcoes-anos .item-ano:hover {
  background-color: var(--bg-claro);
  color: var(--azul);
}
.dropdown-comp .opcao-resolucao {
  --bg-op: var(--azul);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5em 1em;
  cursor: pointer;
  border-block: 1px solid var(--bg-op);
  background-color: var(--bg-op);
  position: relative;
  min-height: 3em;
}
.dropdown-comp .opcao-resolucao span {
  display: block;
}
.dropdown-comp .opcao-resolucao svg {
  display: block;
  width: 1em;
  rotate: -90deg;
}
.dropdown-comp .opcao-resolucao svg .base {
  fill: var(--azul);
}
.dropdown-comp .opcao-resolucao svg .contorno {
  fill: var(--bg-claro);
}
.dropdown-comp .opcao-resolucao:hover {
  background-color: var(--bg-claro);
  color: var(--bg-op);
}
.dropdown-comp .opcoes-res-fixa {
  max-height: 30dvh;
  overflow: auto;
  border-top: 2px solid var(--bg-claro);
}
.dropdown-comp .opcoes-res-fixa .opcao-resolucao {
  --bg-op: var(--azul-alt2);
  padding-left: 1.5em;
  min-height: 2.5em;
}

.info-hover {
  margin: 0;
  padding: 0;
  border: none;
  background-color: transparent;
  cursor: pointer;
}
.info-hover img {
  display: block;
  width: 1.5em;
}
@media (width <= 1050px) {
  .info-hover img {
    width: 1em;
  }
}

.info-hover-txt {
  --ancora: --nome-ancora;
  width: 17.7508333333vw;
  background-color: var(--azul-alt2);
  color: #fff;
  padding: 1.5em;
  margin: 0;
  inset: auto;
  position: absolute;
  position-anchor: var(--ancora);
  top: calc(anchor(bottom) + 1.5em);
  right: calc(anchor(right) + 0.75em);
  overflow: visible;
  z-index: 35;
}
@media (width <= 1050px) {
  .info-hover-txt {
    width: 80vw;
  }
}
.info-hover-txt:before {
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  position: absolute;
  bottom: 100%;
  right: 0;
  background-color: var(--azul-alt2);
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
  z-index: 100;
}
.info-hover-txt.bottomright {
  top: auto;
  bottom: calc(anchor(top) + 1.5em);
  right: calc(anchor(right) + 0.75em);
}
.info-hover-txt.bottomright:before {
  bottom: auto;
  top: 100%;
  clip-path: polygon(100% 0, 0 0, 100% 100%);
}

.base-mapa {
  --pad-mapa: 0.7em;
  width: 100%;
  height: 100%;
  padding-top: var(--quad);
  padding-left: var(--quad);
  position: relative;
}
@media (width <= 1050px) {
  .base-mapa {
    width: 100%;
    height: 100%;
    flex: 1;
    padding: 0;
  }
}
.base-mapa .loading {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.base-mapa > div {
  z-index: 15;
}
.base-mapa .mapa {
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--bg-mapa);
  position: relative;
  z-index: 10;
}
.base-mapa .aux-esquerda, .base-mapa .aux-direita {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: var(--pad-mapa);
  z-index: 15;
  pointer-events: none;
}
.base-mapa .aux-esquerda > *, .base-mapa .aux-direita > * {
  pointer-events: all;
}
.base-mapa .aux-esquerda {
  left: calc(var(--quad) + var(--pad-mapa));
}
.base-mapa .aux-direita {
  right: calc(var(--pad-mapa));
}
@media (width <= 1050px) {
  .base-mapa .aux-agrupa {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    position: absolute;
    top: var(--pad-mapa);
    right: var(--pad-mapa);
    gap: 0.2em;
  }
  .base-mapa .aux-agrupa .aux-esquerda, .base-mapa .aux-agrupa .aux-direita {
    position: static;
    gap: 0.2em;
  }
}
.base-mapa .box-escala {
  position: absolute;
  bottom: var(--pad-mapa);
  left: calc(var(--quad) + var(--pad-mapa));
  width: auto;
  height: auto;
  background-color: var(--bg-claro);
  padding: 0.5em;
  padding-right: 1em;
  border: 1px solid var(--azul);
}
@media (width <= 1050px) {
  .base-mapa .box-escala {
    left: var(--pad-mapa);
  }
}
.base-mapa .box-escala .item-escala {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
  font-weight: 600;
}
.base-mapa .box-escala .item-escala .quad {
  width: 1.6vw;
  height: 1.6vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--azul);
  border-bottom: none;
}
@media (width <= 1050px) {
  .base-mapa .box-escala .item-escala .quad {
    width: 5vw;
    height: 5vw;
  }
}
.base-mapa .box-escala .item-escala .quad .cor {
  width: 100%;
  height: 100%;
  background-color: var(--azul-alt2);
  border: 0.3em solid var(--bg-claro);
  opacity: 0.75;
}
@media (width <= 1050px) {
  .base-mapa .box-escala .item-escala .quad .cor {
    border-width: 0.2em;
  }
}
.base-mapa .box-escala .item-escala:last-of-type .quad {
  border-bottom: 1px solid var(--azul);
}
.base-mapa .box-escolha-indice {
  position: absolute;
  bottom: var(--pad-mapa);
  right: calc(var(--pad-mapa));
  width: auto;
  height: auto;
  background-color: var(--bg-claro);
  padding: 0.3em 0.5em;
  border: 1px solid var(--azul);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5em;
}
.base-mapa .box-escolha-indice.inmodal {
  position: static;
}
.base-mapa .box-escolha-indice .vlabel {
  font-weight: 600;
  transition: all 0.4s;
}
.base-mapa .box-escolha-indice .vid {
  color: var(--azul);
}
.base-mapa .box-escolha-indice .vkm {
  color: var(--bg-mapa);
}
.base-mapa .box-escolha-indice .selecao {
  border: 1px solid var(--azul);
  border-radius: 200px;
  width: 3em;
  height: 1.5em;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-inline: 0.2em;
  cursor: pointer;
}
.base-mapa .box-escolha-indice .selecao small {
  display: block;
  height: 1.2em;
  width: 1.2em;
  border-radius: 200px;
  background-color: var(--azul);
  transition: all 0.4s;
}
.base-mapa .box-escolha-indice.km .vid {
  color: var(--bg-mapa);
}
.base-mapa .box-escolha-indice.km .vkm {
  color: var(--azul);
}
.base-mapa .box-escolha-indice.km .selecao small {
  transform: translate3d(1.3em, 0, 0);
}

.btn-aux {
  --size: calc(var(--quad)*0.35);
  width: var(--size);
  height: var(--size);
  margin: 0;
  padding: 0;
  border: none;
  cursor: pointer;
  background-color: var(--bg-claro);
  padding: calc(var(--size) * 0.2);
  transition: all 0.3s;
  border: 1px solid var(--azul);
}
.btn-aux img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.btn-aux:hover {
  background-color: var(--bg-cinza2);
}
@media (width <= 1050px) {
  .btn-aux {
    --size: calc(var(--quad)*0.45);
  }
}

.tooltip-modelo {
  --bgdest: var(--sec-vermelho);
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.1);
  padding: 0 !important;
  margin: 0;
  background-color: var(--bg-claro);
  border: none !important;
  font-family: "Work Sans", "Calibri", "Lucida Grande", sans-serif;
  font-optical-sizing: auto;
  text-rendering: geometricPrecision;
  z-index: 9999;
}
.tooltip-modelo.extra {
  position: absolute;
  bottom: calc(var(--quad) * 2);
  left: calc(var(--quad) * 4);
}
.tooltip-modelo .inside-box {
  width: 13.4583333333vw;
  background-color: var(--bg-claro);
  white-space: normal;
}
@media (width <= 1050px) {
  .tooltip-modelo .inside-box {
    width: 60vw;
  }
}
.tooltip-modelo.indice, .tooltip-modelo .inside-box.indice {
  --bgdest: var(--azul-dark);
}
.tooltip-modelo .inside-box.saude {
  --bgdest: var(--sec-vermelho);
}
.tooltip-modelo .inside-box.social {
  --bgdest: var(--sec-verde);
}
.tooltip-modelo .inside-box.educacao {
  --bgdest: var(--sec-laranja);
}
.tooltip-modelo .inside-box.trabalho {
  --bgdest: var(--sec-roxo);
}
.tooltip-modelo .topo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.2em;
  background-color: var(--bg-claro);
  padding: 0.75em 1em;
}
.tooltip-modelo .topo img {
  display: block;
  height: 1.5em;
}
.tooltip-modelo .topo small {
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1.2em;
}
.tooltip-modelo .topo span {
  font-weight: bold;
  line-height: 1em;
}
.tooltip-modelo .hex {
  display: block;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.2em;
  text-transform: uppercase;
  font-weight: 400 !important;
}
.tooltip-modelo .hex small {
  display: block;
  height: 1em;
  aspect-ratio: 1/0.8660254038;
  clip-path: polygon(50% -50%, 100% 50%, 50% 150%, 0 50%);
  background: var(--bgdest);
}
.tooltip-modelo .valor {
  background-color: var(--bgdest);
  color: var(--bg-claro);
  padding: 0.4em 1em;
}
.tooltip-modelo .valor span {
  font-weight: bold;
  line-height: 1em;
}
.tooltip-modelo .valor-menor {
  background-color: var(--bgdest);
  color: var(--bg-claro);
  padding: 0.8em 0.6em;
}
.tooltip-modelo .valor-menor span {
  font-weight: bold;
  line-height: 1em;
}
.tooltip-modelo .bottom {
  padding: 0.2em 1em;
}
.tooltip-modelo .bottom small {
  text-decoration: underline;
  font-weight: 500;
  line-height: 1.2em;
}
.tooltip-modelo .lista-icones {
  width: 7.735vw;
  background-color: #fff;
  white-space: normal;
  padding: 0.8em 0.6em;
}
.tooltip-modelo .lista-icones > * + * {
  margin-block-start: 0.6em;
}
@media (width <= 1050px) {
  .tooltip-modelo .lista-icones {
    width: 40vw;
  }
}
.tooltip-modelo .linha-icone {
  --txtcor: var(--azul-dark);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: var(--txtcor);
  gap: 0.6em;
}
.tooltip-modelo .linha-icone img {
  display: block;
  height: 1.5em;
}
.tooltip-modelo .linha-icone span {
  font-weight: bold;
  line-height: 1em;
}

.fundo-detalhamento-mob {
  display: none;
}
@media (width <= 1050px) {
  .fundo-detalhamento-mob {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    width: 100vw;
    height: 100dvh;
    z-index: 590 !important;
    background-color: rgba(0, 0, 0, 0.8);
  }
}

.detalhamento-modelo {
  --pad-modulo: 1em 1.5em;
  width: auto;
  height: calc(var(--quad) * 8);
  position: absolute;
  z-index: 25;
  top: calc(var(--quad) * 1.5);
  right: calc(var(--quad) * 1);
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
@media (width <= 1050px) {
  .detalhamento-modelo {
    position: fixed;
    top: 4vh;
    right: 4vw;
    width: 92vw;
    height: 92dvh;
    z-index: 600 !important;
    flex-direction: column;
    overflow: auto;
  }
}
.detalhamento-modelo.simples {
  position: relative;
  top: auto;
  right: auto;
  background-color: #fff;
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.1);
  width: calc(var(--quad) * 5);
  display: block;
  color: var(--azul-dark);
  height: auto;
}
.detalhamento-modelo .detalhamento-overflow {
  width: calc(var(--quad) * 5);
  height: 100%;
  background-color: #ffffff;
  overflow-y: auto;
  overflow-x: hidden;
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.1);
  scrollbar-color: var(--azul-alt2) var(--bg-cinza2);
}
@media (width <= 1050px) {
  .detalhamento-modelo .detalhamento-overflow {
    width: 100%;
    height: auto;
    overflow: visible;
    box-shadow: none;
  }
}
.detalhamento-modelo .det-modulo-topo {
  width: 100%;
  padding: var(--pad-modulo);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1em;
  border-bottom: 2px solid var(--azul);
}
.detalhamento-modelo .det-modulo-topo .titulo {
  width: 100%;
  flex: 1;
}
.detalhamento-modelo .det-modulo-topo h3 {
  font-weight: bold;
  line-height: 1.2em;
  margin-bottom: 0.5em;
}
.detalhamento-modelo .det-modulo-topo .hex {
  display: block;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
  text-transform: uppercase;
}
.detalhamento-modelo .det-modulo-topo .hex small {
  display: block;
  height: 1em;
  aspect-ratio: 1/0.8660254038;
  clip-path: polygon(50% -50%, 100% 50%, 50% 150%, 0 50%);
  background: var(--azul);
}
.detalhamento-modelo .det-modulo-topo .fechar {
  width: 1.7em;
  height: 1.7em;
  border-radius: 200px;
  background-color: var(--azul);
  rotate: 45deg;
}
.detalhamento-modelo .det-modulo-topo .fechar svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: var(--bg-claro);
}
.detalhamento-modelo .det-modulo-gauge {
  width: 100%;
  padding: var(--pad-modulo);
}
.detalhamento-modelo .indice-titulo {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  border-bottom: 2px solid var(--azul);
  margin-top: 0.5em;
}
.detalhamento-modelo .indice-titulo .titulo {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-block: 0.3em;
}
.detalhamento-modelo .indice-titulo .titulo small {
  font-weight: 500;
  text-transform: uppercase;
}
.detalhamento-modelo .indice-titulo .titulo span {
  display: block;
  font-weight: bold;
  line-height: 1.1em;
}
.detalhamento-modelo .indice-titulo .valor {
  font-weight: bold;
  background-color: var(--azul);
  color: #fff;
  text-align: center;
  padding-inline: 0.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.detalhamento-modelo .valores-variaveis {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-top: 1em;
}
.detalhamento-modelo .valores-variaveis .item-var {
  width: 25%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
  font-weight: bold;
}
.detalhamento-modelo .valores-variaveis .item-var img {
  display: block;
  width: 2em;
}
.detalhamento-modelo .valores-variaveis .item-var.saude {
  color: var(--sec-vermelho);
}
.detalhamento-modelo .valores-variaveis .item-var.social {
  color: var(--sec-verde);
}
.detalhamento-modelo .valores-variaveis .item-var.educacao {
  color: var(--sec-laranja);
}
.detalhamento-modelo .valores-variaveis .item-var.trabalho {
  color: var(--sec-roxo);
}
.detalhamento-modelo .valores-variaveis .item-var span span {
  text-align: center;
  line-height: 1.1em;
}
.detalhamento-modelo .gauge-bloco {
  width: 100%;
  height: 9vw;
  border-bottom: 2px solid var(--azul);
}
@media (width <= 1050px) {
  .detalhamento-modelo .gauge-bloco {
    height: 32vw;
  }
}
.detalhamento-modelo .det-modulo-distancias {
  width: 100%;
  padding: var(--pad-modulo);
  padding-top: 0;
}
.detalhamento-modelo .det-modulo-distancias h3 {
  font-weight: bold;
  line-height: 1.2em;
  margin-bottom: 1em;
}
.detalhamento-modelo .det-modulo-distancias .dist-variaveis > * + * {
  margin-block-start: 1em;
}
.detalhamento-modelo .distancia-graf {
  --variavel-cor: var(--sec-vermelho);
  --variavel-h: 0.6em;
  width: 100%;
  display: block;
}
@media (width <= 1050px) {
  .detalhamento-modelo .distancia-graf {
    --variavel-h: 0.8em;
  }
}
.detalhamento-modelo .distancia-graf.saude {
  --variavel-cor: var(--sec-vermelho);
}
.detalhamento-modelo .distancia-graf.social {
  --variavel-cor: var(--sec-verde);
}
.detalhamento-modelo .distancia-graf.educacao {
  --variavel-cor: var(--sec-laranja);
}
.detalhamento-modelo .distancia-graf.trabalho {
  --variavel-cor: var(--sec-roxo);
}
.detalhamento-modelo .distancia-graf .graf-valor {
  font-weight: bold;
  color: var(--variavel-cor);
  line-height: 2em;
}
.detalhamento-modelo .distancia-graf .graf-barra {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}
.detalhamento-modelo .distancia-graf .casa {
  width: 2vw;
  display: block;
}
@media (width <= 1050px) {
  .detalhamento-modelo .distancia-graf .casa {
    height: auto;
    width: 9vw;
  }
}
.detalhamento-modelo .distancia-graf .barra {
  width: 100%;
  flex: 1;
  position: relative;
  height: var(--variavel-h);
}
.detalhamento-modelo .distancia-graf .barra .linha {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  background-image: url("../img/linha-pontos.svg");
  background-size: auto calc(var(--variavel-h) * 0.2);
  background-repeat: repeat-x;
  background-position: center left;
}
.detalhamento-modelo .distancia-graf .barra .valor {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: var(--variavel-cor);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  z-index: 2;
}
.detalhamento-modelo .distancia-graf .barra .valor:before {
  content: "";
  display: block;
  width: var(--variavel-h);
  height: var(--variavel-h);
  border-radius: 200px;
  background-color: var(--azul);
  position: absolute;
  top: 0;
  right: calc(var(--variavel-h) * 0.5 * -1);
}
.detalhamento-modelo .distancia-graf .barra .valor svg {
  width: calc(var(--variavel-h) * 1.583);
  position: absolute;
  bottom: calc(100% + var(--variavel-h) * 0.2);
  right: calc(var(--variavel-h) * 1.583 * -0.5);
  fill: var(--variavel-cor);
}
.detalhamento-modelo .abre-evolucao {
  --bgb: var(--azul);
  --fillb: #fff;
  writing-mode: vertical-rl;
  position: absolute;
  top: 0;
  left: 100%;
  margin: 0;
  padding: 0;
  border: none;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1em;
  text-transform: uppercase;
  font-weight: 600;
  background-color: var(--bgb);
  color: var(--fillb);
  padding: 0.8em 0.4em;
  transition: all 0.4s;
  cursor: pointer;
}
@media (width <= 1050px) {
  .detalhamento-modelo .abre-evolucao {
    display: none;
  }
}
.detalhamento-modelo .abre-evolucao small {
  display: block;
  width: 1.5em;
  height: 1.5em;
  border-radius: 200px;
  background-color: var(--fillb);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s;
}
.detalhamento-modelo .abre-evolucao small svg {
  width: 100%;
  height: 100%;
  fill: var(--bgb);
  transition: all 0.4s;
}
.detalhamento-modelo .abre-evolucao:hover {
  --bgb: var(--bg-cinza2);
  --fillb: var(--azul);
}
.detalhamento-modelo .abre-evolucao.aberto {
  --bgb: var(--bg-cinza2);
  --fillb: var(--azul);
}
.detalhamento-modelo .abre-evolucao.aberto small {
  transform: rotate(45deg);
}
.detalhamento-modelo .evolucao-overflow {
  width: 0;
  height: 100%;
  background-color: var(--bg-claro);
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.1);
  scrollbar-color: var(--azul-alt2) var(--bg-cinza2);
  overflow: hidden;
  transition: all 0.3s;
  transition-delay: 0.3s;
}
.detalhamento-modelo .evolucao-overflow .inside-evolucao {
  transition: opacity 0.3s;
  transition-delay: 0s;
  opacity: 0;
}
.detalhamento-modelo .evolucao-overflow.aberto {
  width: calc(var(--quad) * 7.5);
  transition-delay: 0s;
  overflow: auto;
}
.detalhamento-modelo .evolucao-overflow.aberto .inside-evolucao {
  transition-delay: 0.3s;
  opacity: 1;
}
@media (width <= 1050px) {
  .detalhamento-modelo .evolucao-overflow {
    width: 100%;
    overflow: visible;
    height: auto;
  }
  .detalhamento-modelo .evolucao-overflow .inside-evolucao {
    opacity: 1;
    transition-delay: 0;
    transition: none;
  }
}
.detalhamento-modelo .inside-evolucao {
  padding: var(--pad-modulo);
}
.detalhamento-modelo .inside-evolucao > * + * {
  margin-block-start: 1.5em;
}
.detalhamento-modelo .inside-evolucao .grafico-evolucao {
  width: 100%;
  height: 6vw;
}
.detalhamento-modelo .inside-evolucao .grafico-evolucao.principal {
  border-bottom: 2px solid var(--azul-dark);
  padding-bottom: 2em;
  margin-bottom: 2em;
}
@media (width <= 1050px) {
  .detalhamento-modelo .inside-evolucao .grafico-evolucao {
    height: 28vw;
  }
}
.detalhamento-modelo .inside-evolucao h3 {
  font-weight: bold;
}
.detalhamento-modelo .inside-evolucao h4 {
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 1.5em;
}
.detalhamento-modelo .inside-evolucao h5 {
  font-weight: 600;
  margin-bottom: 1.5em;
}
.detalhamento-modelo .evolucao-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.detalhamento-modelo .evolucao-topo .box-escolha-indice {
  border: none;
}
@media (width <= 1050px) {
  .detalhamento-modelo .evolucao-topo {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1em;
  }
}

.fundo-modal {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.8);
  padding: 1vw;
  -webkit-perspective: 1000;
  perspective: 1000;
  transition: all 0.6s;
  opacity: 0;
  z-index: -1;
  visibility: hidden;
}
.fundo-modal .modal {
  transform: translate3d(0, 100%, 0);
}
.fundo-modal.ativo {
  z-index: 8000;
  opacity: 1;
  visibility: visible;
}
.fundo-modal.ativo .modal {
  transform: translate3d(0, 0, 0);
}

.modal {
  width: 98%;
  max-width: calc(var(--quad) * 8);
  max-height: 100%;
  background-color: #fff;
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.2);
  transition: all 0.6s;
  position: relative;
}
@media (width <= 600px) {
  .modal {
    max-width: 90vw;
  }
}
.modal.modal-baixar {
  max-width: calc(var(--quad) * 8);
}
@media (width <= 600px) {
  .modal.modal-baixar {
    max-width: 90vw;
  }
}
.modal .modal-fechar {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  top: 0;
  right: 0;
  width: 1.5em;
  height: 1.5em;
  border-radius: 3em;
  font-size: 1.8rem;
  font-weight: bold;
  color: #000;
}
.modal .modal-conteudo {
  padding: 3rem;
}
.modal .modal-titulo {
  width: 100%;
  height: calc(var(--quad) * 1);
  color: #fff;
  background-color: var(--azul-dark);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.5em;
}
.modal .modal-titulo small {
  text-transform: uppercase;
  display: block;
}
.modal .modal-titulo h2 {
  font-weight: 700;
}
.modal .modal-titulo svg {
  width: 0.75em;
  height: 0.75em;
  fill: #fff;
}
@media (width <= 600px) {
  .modal .modal-titulo {
    height: 15vw;
  }
}
.modal .modal-info {
  padding: 1.5em;
}
.modal .modal-info > * + * {
  margin-block-start: 1em;
}
.modal .compartilhe {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75em;
}
.modal .compartilhe span {
  text-align: right;
  line-height: 1.2em;
  display: inline-block;
  margin-right: 1em;
}
.modal .compartilhe a:hover {
  color: var(--azul);
}
.modal .controle-download > * + * {
  margin-block-start: 2em;
}
.modal .controle-download .linha {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
}
.modal .controle-download .linha.wrap .opcoes-sub {
  flex-wrap: wrap;
}
.modal .controle-download .linha > span {
  display: block;
  text-transform: uppercase;
  font-weight: 400;
  width: 25%;
  text-align: right;
}
@media (width <= 600px) {
  .modal .controle-download .linha {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
  .modal .controle-download .linha > span {
    width: 100%;
    text-align: left;
  }
  .modal .controle-download .linha > span br {
    display: none;
  }
}
.modal .controle-download .opcoes {
  width: 75%;
}
.modal .controle-download .opcoes select {
  font-family: "Work Sans", "Calibri", "Lucida Grande", sans-serif;
  font-optical-sizing: auto;
  text-rendering: geometricPrecision;
  height: 2.6em;
  line-height: 2.6em;
  border: none;
  border-bottom: 1px solid #000;
  width: 100%;
}
@media (width <= 600px) {
  .modal .controle-download .opcoes {
    width: 100%;
  }
  .modal .controle-download .opcoes select {
    width: 100%;
  }
}
.modal .controle-download .opcoes-radio {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (width <= 600px) {
  .modal .controle-download .opcoes-radio {
    flex-wrap: wrap;
    gap: 2em;
    justify-content: flex-start;
  }
}
.modal .controle-download .opcao {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25em;
  position: relative;
  z-index: 10;
  cursor: pointer;
}
.modal .controle-download .opcao span {
  text-align: left;
  width: auto;
  line-height: 1.1;
}
.modal .controle-download .opcao small {
  display: block;
  width: 1em;
  height: 1em;
  border-radius: 1000px;
  background-color: var(--bg-claro);
  border: 1px solid var(--azul-dark);
}
.modal .controle-download .opcao.ativo small, .modal .controle-download .opcao:hover small {
  background-color: var(--azul-dark);
}
.modal .controle-download .opcoes-sub {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1em;
}
.modal .controle-download .select-label label {
  display: block;
  text-transform: uppercase;
}
.modal .controle-download .select-label select {
  min-width: calc(var(--quad) * 2);
}
.modal .botoes {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
}
.modal .botoes.centraliza {
  justify-content: center;
}
.modal .botao {
  width: auto;
  height: 3em;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--azul-dark);
  color: #fff;
  font-weight: 500;
  padding: 0 1em;
}
.modal .botao:hover {
  background-color: var(--azul);
}
.modal .botao.cinza {
  background-color: #9a9a9a;
}

.section-footer {
  background-color: var(--azul);
  color: #fff;
  padding-block: var(--pad-base);
}
.section-footer a:hover {
  color: var(--sec-amarelo);
}
.section-footer .container > * + * {
  margin-block-start: 2em;
}
.section-footer .logo {
  display: block;
}
.section-footer .logo img {
  display: block;
  width: calc(2 * var(--quad));
}
.section-footer .mapa-site {
  text-transform: uppercase;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.5em;
  width: calc(var(--quad) * 1.5);
}
@media (width <= 1050px) {
  .section-footer .mapa-site {
    width: 35vw;
  }
}
.section-footer .realizacao h3 {
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 1em;
}
.section-footer .realizacao .logos {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 2em;
}
.section-footer .realizacao .logos img {
  display: block;
  height: calc(var(--quad) * 0.75);
}
.section-footer .footer-sociais {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: calc(var(--quad) * 1.5);
  gap: 0.5em;
}

.footer-expediente {
  background-color: var(--azul-dark);
  color: #fff;
}
.footer-expediente .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5em 2em;
  font-weight: 600;
}
@media (width <= 1050px) {
  .footer-expediente .container {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.6em;
    text-align: center;
    padding: 1em;
  }
}

.home-base {
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  transition: all 0.6s;
  position: relative;
  z-index: 100;
}
@media (width <= 1050px) {
  .home-base {
    width: 100%;
    height: 100dvh;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
    overflow-x: hidden;
  }
}
.home-base .home-controle {
  width: 1em;
  height: 100dvh;
  position: fixed;
  top: 0;
  right: calc(4 * var(--quad));
  background-color: var(--azul-dark);
  z-index: 210;
  transition: all 0.6s;
}
@media (width <= 1050px) {
  .home-base .home-controle {
    width: 100%;
    height: 1em;
    bottom: calc(2.5 * var(--quad));
    top: auto;
    right: 0;
    z-index: 4000;
    display: none;
  }
}
.home-base .home-controle .bolinha {
  width: 2em;
  height: 2em;
  border-radius: 2000px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--azul-dark);
  transform: rotate(-90deg);
  flex: 1;
  position: absolute;
  top: calc(50% - 1em);
  left: 0em;
}
@media (width <= 1050px) {
  .home-base .home-controle .bolinha {
    top: 0;
    left: calc(50% - 1.5em);
    transform: rotate(0deg);
  }
}
.home-base .home-controle .bolinha svg {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1;
  fill: var(--bg-claro);
  position: relative;
  top: 0.25em;
}
.home-base .home-controle:hover .bolinha svg {
  fill: var(--sec-azul);
}
.home-base.removido {
  pointer-events: none;
}
.home-base.removido .home-conteudo, .home-base.removido .home-controle {
  transform: translate3d(-100vw, 0, 0);
}
.home-base.removido .home-sidebar {
  opacity: 0;
  width: 0;
}

.home-conteudo {
  width: 100%;
  flex: 1;
  position: relative;
  transition: all 0.6s;
  background-color: var(--azul);
  color: #fff;
}

.home-sidebar {
  width: calc(var(--quad) * 4);
  height: 100dvh;
  background-image: url("../img/previa-mapa.jpg");
  background-size: cover;
  background-position: center;
  position: sticky;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  transition: all 0.6s;
}
@media (width <= 1050px) {
  .home-sidebar {
    width: 100%;
    height: calc(var(--quad) * 2.5);
    position: fixed;
    inset: auto;
    bottom: 0;
    left: 0;
    z-index: 4000;
    display: none;
  }
}

:root {
  --header-height: calc(1vw + 1vw + 2.3vw);
}

.home-menu, .home-menu-mobile {
  width: 100%;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
  position: sticky;
  top: 0;
  left: 0;
  z-index: 200;
  background-color: var(--azul);
}
@media (width <= 1050px) {
  .home-menu, .home-menu-mobile {
    display: none;
  }
}
.home-menu .container, .home-menu-mobile .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1vw var(--mquad);
}
@media (width <= 1050px) {
  .home-menu .container, .home-menu-mobile .container {
    padding: 3vw var(--mquad);
  }
}
.home-menu .logo, .home-menu-mobile .logo {
  display: block;
}
.home-menu .logo img, .home-menu-mobile .logo img {
  display: block;
  height: 2.3vw;
}
@media (width <= 1050px) {
  .home-menu .logo img, .home-menu-mobile .logo img {
    height: 10vw;
  }
}
.home-menu .menu-nav, .home-menu-mobile .menu-nav {
  text-transform: uppercase;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2em;
}

.home-menu-mobile {
  z-index: 500;
  display: none;
}
@media (width <= 1050px) {
  .home-menu-mobile {
    display: block;
  }
}

.link-icone {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-transform: uppercase;
  font-weight: 500;
  gap: 0.5em;
}
.link-icone span {
  width: 100%;
  flex: 1;
}
.link-icone small {
  display: block;
  width: 2em;
  height: 2em;
  border-radius: 200px;
  background-color: var(--sec-azul);
}
.link-icone small svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: var(--azul-dark);
}
@media (width <= 1050px) {
  .link-icone small {
    font-size: 16px;
  }
}
.link-icone:hover {
  color: var(--sec-amarelo);
}
.link-icone.lr small {
  rotate: -90deg;
}
.link-icone.menor small {
  width: 1.5em;
  height: 1.5em;
}

.home-abertura {
  width: 100%;
  height: calc(100dvh - var(--header-height));
  background-color: var(--azul);
  color: #fff;
  background-image: url("../img/capa-bg-arte-a.svg");
  background-size: auto 100%;
  background-position: center top;
  background-repeat: no-repeat;
}
@media (width <= 1050px) {
  .home-abertura {
    height: auto;
    background-image: none;
    padding-block: 4em;
    padding-top: 7em;
  }
}
.home-abertura .container {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: var(--quad);
}
@media (width <= 1050px) {
  .home-abertura .container {
    padding-bottom: 0;
  }
}
.home-abertura .coluna-texto {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3.5em;
}
.home-abertura .coluna-texto .logo {
  display: block;
  width: calc(var(--quad) * 2.5);
}
.home-abertura .coluna-texto h1 {
  width: calc(var(--quad) * 9);
}
@media (width <= 1050px) {
  .home-abertura .coluna-texto h1 {
    width: 100%;
  }
}

.home-controle-mobile {
  display: none;
  background-image: url("../img/previa-mapa.jpg");
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center;
  height: 40dvh;
  align-items: center;
  justify-content: center;
  border-block: 12px solid var(--azul-dark);
}
@media (width <= 1050px) {
  .home-controle-mobile {
    display: flex;
  }
}

.titulo-aba {
  display: inline-block;
  font-weight: 600;
  text-transform: uppercase;
  background-color: var(--azul-alt2);
  padding: 1em 1.5em;
  line-height: 1.5em;
}

.box-aba .box-conteudo {
  width: 100%;
  background-color: var(--azul-alt2);
  padding: calc(var(--quad) * 0.65);
}
@media (width <= 1050px) {
  .box-aba .box-conteudo {
    padding: 1.5em;
  }
}
.box-aba .texto-big {
  line-height: 1.75em;
}
.box-aba .linha {
  display: inline-block;
  vertical-align: middle;
  line-height: 1em;
  border-bottom: 2px solid var(--sec-azul);
}
.box-aba .box-coluna-texto {
  width: calc(var(--quad) * 7.5);
  line-height: 1.5em;
}
@media (width <= 1050px) {
  .box-aba .box-coluna-texto {
    width: 100%;
    margin-bottom: 2em;
  }
}
.box-aba .box-coluna-nota {
  width: calc(var(--quad) * 2);
  margin-right: calc(var(--quad) * 1);
}
@media (width <= 1050px) {
  .box-aba .box-coluna-nota {
    width: 100%;
    margin-right: 0;
  }
}
.box-aba .link-capa {
  width: 100%;
}
@media (width <= 1050px) {
  .box-aba .link-capa {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1em;
  }
}
.box-aba .link-capa .img-capa {
  display: block;
  width: 100%;
  aspect-ratio: 1/1.414;
  background-color: var(--bg-cinza2);
  margin-bottom: 0.5em;
}
@media (width <= 1050px) {
  .box-aba .link-capa .img-capa {
    width: 32vw;
  }
}
.box-aba .link-capa .link-icone {
  gap: 1em;
}
.box-aba .link-capa .link-icone small {
  transform: rotate(-90deg);
  background-color: var(--azul);
}
.box-aba .link-capa .link-icone small svg {
  fill: var(--sec-azul);
}
@media (width <= 1050px) {
  .box-aba .link-capa .link-icone {
    width: 100%;
    flex: 1;
  }
}
.box-aba .link-capa:hover .link-icone {
  color: var(--sec-amarelo);
}
.box-aba .link-capa:hover .link-icone small svg {
  fill: var(--sec-amarelo);
}

.num {
  background-color: var(--azul-alt);
  color: #fff;
  width: 2em;
  height: 2em;
  line-height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 200px;
  font-weight: bold;
}

.home-sobre {
  padding-block: var(--pad-base);
}
.home-sobre .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (width <= 1050px) {
  .home-sobre .container {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--pad-base);
  }
}
.home-sobre .box-aba {
  width: calc(var(--quad) * 6.5);
}
@media (width <= 1050px) {
  .home-sobre .box-aba {
    width: 100%;
  }
}
.home-sobre .coluna-animacao {
  width: calc(var(--quad) * 5.5);
  padding-top: 3.5em;
}
.home-sobre .coluna-animacao > * + * {
  margin-block-start: 3em;
}
@media (width <= 1050px) {
  .home-sobre .coluna-animacao {
    width: 100%;
  }
}
.home-sobre .item-animacao > * + * {
  margin-block-start: 1em;
}
.home-sobre .item-animacao p {
  margin-bottom: 3em;
}
.home-sobre {
  --variavel-h: 0.6em;
  --variavel-cor: var(--azul-alt);
}
.home-sobre .graf-barra {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}
.home-sobre .casa {
  width: 2vw;
  display: block;
}
@media (width <= 1050px) {
  .home-sobre .casa {
    width: 8vw;
  }
}
.home-sobre .barra {
  width: 100%;
  flex: 1;
  position: relative;
  height: var(--variavel-h);
}
.home-sobre .barra .linha {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  background-image: url("../img/linha-pontos-branco.svg");
  background-size: auto calc(var(--variavel-h) * 0.2);
  background-repeat: repeat-x;
  background-position: center left;
}
.home-sobre .barra .valor {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: var(--variavel-cor);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  z-index: 2;
  animation: grow-horizontal 8s linear infinite;
}
.home-sobre .barra .valor:before {
  content: "";
  display: block;
  width: var(--variavel-h);
  height: var(--variavel-h);
  border-radius: 200px;
  background-color: var(--azul-alt2);
  position: absolute;
  top: 0;
  right: calc(var(--variavel-h) * 0.5 * -1);
}
.home-sobre .barra .valor svg {
  width: calc(var(--variavel-h) * 1.583);
  position: absolute;
  bottom: calc(100% + var(--variavel-h) * 0.2);
  right: calc(var(--variavel-h) * 1.583 * -0.5);
  fill: var(--variavel-cor);
}
.home-sobre .graf-bolinha .barra {
  width: 100%;
  height: 1.5em;
  position: relative;
  margin-bottom: 0.5em;
}
.home-sobre .graf-bolinha .barra:before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 0.1em;
  left: 0;
  top: 0.7em;
  background-color: #fff;
}
.home-sobre .graf-bolinha .barra .bolinha {
  display: block;
  width: 1.5em;
  height: 1.5em;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 2000px;
  animation: move-horizontal 8s linear infinite;
}

@keyframes move-horizontal {
  0% {
    left: 100%;
  }
  50% {
    left: 0%;
  }
  100% {
    left: 100%;
  }
}
@keyframes grow-horizontal {
  0% {
    width: 0%;
  }
  50% {
    width: 100%;
  }
  100% {
    width: 0%;
  }
}
.home-indice {
  padding-bottom: var(--pad-base);
}
.home-indice .apresenta {
  width: calc(var(--quad) * 6.25);
}
.home-indice .apresenta > * + * {
  margin-block-start: 1.5em;
}
.home-indice .apresenta p {
  font-weight: 400;
}
@media (width <= 1050px) {
  .home-indice .apresenta {
    width: 100%;
  }
}

.infog-indice {
  padding-bottom: var(--pad-base);
  position: relative;
}
.infog-indice:before {
  content: "";
  display: block;
  width: 100%;
  height: 50%;
  background-color: var(--azul-alt);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10;
}
.infog-indice .infog-indice-box {
  position: relative;
  z-index: 20;
}
.infog-indice .nav-infog {
  width: 100%;
  background-color: var(--sec-azul);
  padding: 0.5em;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.infog-indice .nav-infog span {
  text-transform: uppercase;
  color: #fff;
}
@media (width <= 1050px) {
  .infog-indice .nav-infog span {
    font-size: 11px;
  }
}
.infog-indice .nav-seta {
  display: block;
  width: 2em;
  height: 2em;
  border-radius: 200px;
  background-color: var(--bg-claro);
  rotate: 90deg;
}
.infog-indice .nav-seta:last-of-type {
  rotate: -90deg;
}
.infog-indice .nav-seta svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: var(--azul-dark);
}
.infog-indice .conteudo-infog {
  width: 100%;
  height: calc(var(--quad) * 8);
  background-color: #cdcdcd;
  box-shadow: 0 4px 4px 2px rgba(0, 0, 0, 0.3);
}
@media (width <= 1050px) {
  .infog-indice .conteudo-infog {
    height: auto;
  }
}
.infog-indice .dots-infog {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1em;
  gap: 0.5em;
}
.infog-indice .dots-infog .dot {
  width: 0.75em;
  height: 0.75em;
  border-radius: 200px;
  background-color: var(--bg-claro);
}
.infog-indice .dots-infog .dot:hover, .infog-indice .dots-infog .dot.ativo {
  background-color: var(--azul);
}
.infog-indice .link-mais {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 2em;
}
.infog-indice .link-mais .link-icone small {
  background-color: var(--azul-dark);
}
.infog-indice .link-mais .link-icone small svg {
  fill: var(--azul-alt);
}
@media (width <= 1050px) {
  .infog-indice .link-mais .link-icone {
    gap: 2em;
  }
}
.infog-indice .slide-infog {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  background-color: var(--azul);
}
@media (width <= 1050px) {
  .infog-indice .slide-infog {
    height: auto;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
}
.infog-indice .slide-infog .col-explicacao {
  width: calc(var(--quad) * 5.5);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2em 4em;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-explicacao {
    width: 100%;
    height: auto;
    padding: 0;
  }
}
.infog-indice .slide-infog .box-explica {
  background-color: var(--bg-claro);
  color: var(--azul);
  padding: 1.5em;
}
.infog-indice .slide-infog .box-explica > * + * {
  margin-block-start: 1em;
}
.infog-indice .slide-infog .box-explica {
  transition: opacity 0.3s, transform 0.3s;
}
@starting-style {
  .infog-indice .slide-infog .box-explica {
    opacity: 0;
    transform: translateY(10px);
  }
}
.infog-indice .slide-infog .col-graficos {
  width: 100%;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos {
    width: 100%;
    height: 70vw;
  }
}
.infog-indice .slide-infog .col-graficos.variaveis {
  display: block;
  background-color: var(--azul-alt2);
  padding: 2.5em;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos.variaveis {
    padding: 2.5em 1em;
  }
}
.infog-indice .slide-infog .col-graficos svg {
  height: 100%;
  width: auto;
}
.infog-indice .slide-infog .col-graficos svg .objeto {
  transition: opacity 0.3s, transform 0.3s;
}
@starting-style {
  .infog-indice .slide-infog .col-graficos svg .objeto {
    opacity: 0;
    transform: translateY(10px);
  }
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(1) {
  transition-delay: 0ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(2) {
  transition-delay: 50ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(3) {
  transition-delay: 100ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(4) {
  transition-delay: 150ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(5) {
  transition-delay: 200ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(6) {
  transition-delay: 250ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(7) {
  transition-delay: 300ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(8) {
  transition-delay: 350ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(9) {
  transition-delay: 400ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(10) {
  transition-delay: 450ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(11) {
  transition-delay: 500ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(12) {
  transition-delay: 550ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(13) {
  transition-delay: 600ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(14) {
  transition-delay: 650ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(15) {
  transition-delay: 700ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(16) {
  transition-delay: 750ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(17) {
  transition-delay: 800ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(18) {
  transition-delay: 850ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(19) {
  transition-delay: 900ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(20) {
  transition-delay: 950ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(21) {
  transition-delay: 1000ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(22) {
  transition-delay: 1050ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(23) {
  transition-delay: 1100ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(24) {
  transition-delay: 1150ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto:nth-child(25) {
  transition-delay: 1200ms;
}
.infog-indice .slide-infog .col-graficos svg .objeto_v {
  transition: opacity 0.3s, transform 0.3s;
  transition-delay: 1.2s;
}
@starting-style {
  .infog-indice .slide-infog .col-graficos svg .objeto_v {
    opacity: 0;
  }
}
.infog-indice .slide-infog .col-graficos svg .vetor {
  stroke-dasharray: 500;
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 2.8s ease;
  transition-delay: 0.4s;
}
@starting-style {
  .infog-indice .slide-infog .col-graficos svg .vetor {
    stroke-dashoffset: 500;
  }
}
.infog-indice .slide-infog .col-graficos svg .hexagono {
  transition: opacity 0.3s, transform 0.3s;
}
@starting-style {
  .infog-indice .slide-infog .col-graficos svg .hexagono {
    opacity: 0;
    transform: translateY(10px);
  }
}
.infog-indice .slide-infog .col-graficos .box-explica {
  position: absolute;
  bottom: 1em;
  right: 1em;
  background-color: var(--azul-alt);
  color: #fff;
  width: calc(var(--quad) * 5);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 1em;
  gap: 1em;
}
.infog-indice .slide-infog .col-graficos .box-explica > * + * {
  margin-block-start: 0;
}
.infog-indice .slide-infog .col-graficos .box-explica .num {
  background-color: var(--azul-dark);
  color: #fff;
}
.infog-indice .slide-infog .col-graficos .box-explica p {
  width: 100%;
  flex: 1;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos .box-explica {
    font-size: 11px;
  }
}
.infog-indice .slide-infog .col-graficos .lista-variaveis {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: calc(var(--quad) * 0.4);
  flex-wrap: wrap;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos .lista-variaveis {
    gap: 1em;
  }
}
.infog-indice .slide-infog .col-graficos .box-variavel {
  width: calc(var(--quad) * 2.6);
  background-color: var(--sec-vermelho);
  color: #fff;
  padding: 1.5em;
  transition: opacity 0.3s, transform 0.3s;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  transition: all 0.4s;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos .box-variavel {
    width: 36vw;
  }
  .infog-indice .slide-infog .col-graficos .box-variavel br {
    display: none;
  }
}
.infog-indice .slide-infog .col-graficos .box-variavel img {
  display: block;
  width: 2.5em;
}
@media (width <= 1050px) {
  .infog-indice .slide-infog .col-graficos .box-variavel img {
    width: 1.75em;
  }
}
.infog-indice .slide-infog .col-graficos .box-variavel small {
  display: block;
  text-transform: uppercase;
  margin-top: 1em;
}
.infog-indice .slide-infog .col-graficos .box-variavel p {
  font-weight: 600;
}
@starting-style {
  .infog-indice .slide-infog .col-graficos .box-variavel {
    opacity: 0;
    transform: translateY(10px);
  }
}
.infog-indice .slide-infog .col-graficos .box-variavel.social {
  background-color: var(--sec-verde);
}
.infog-indice .slide-infog .col-graficos .box-variavel.educacao {
  background-color: var(--sec-laranja);
}
.infog-indice .slide-infog .col-graficos .box-variavel.trabalho {
  background-color: var(--sec-roxo);
}
@starting-style {
  .infog-indice .slide-infog .col-graficos .box-variavel {
    opacity: 0;
    transform: translateY(20px);
  }
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(1) {
  transition-delay: 0ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(2) {
  transition-delay: 150ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(3) {
  transition-delay: 300ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(4) {
  transition-delay: 450ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(5) {
  transition-delay: 600ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(6) {
  transition-delay: 750ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(7) {
  transition-delay: 900ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(8) {
  transition-delay: 1050ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(9) {
  transition-delay: 1200ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(10) {
  transition-delay: 1350ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(11) {
  transition-delay: 1500ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(12) {
  transition-delay: 1650ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(13) {
  transition-delay: 1800ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(14) {
  transition-delay: 1950ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(15) {
  transition-delay: 2100ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(16) {
  transition-delay: 2250ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(17) {
  transition-delay: 2400ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(18) {
  transition-delay: 2550ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(19) {
  transition-delay: 2700ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(20) {
  transition-delay: 2850ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(21) {
  transition-delay: 3000ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(22) {
  transition-delay: 3150ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(23) {
  transition-delay: 3300ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(24) {
  transition-delay: 3450ms;
}
.infog-indice .slide-infog .col-graficos .box-variavel:nth-child(25) {
  transition-delay: 3600ms;
}
.infog-indice .slide-infog .col-graficos .modulo-grafico {
  width: calc(var(--quad) * 4.5);
  margin: 0 auto;
  margin-top: calc(var(--quad) * 0.5);
  border-bottom: 2px solid #fff;
  position: relative;
}
.infog-indice .slide-infog .col-graficos .modulo-grafico .variaveis {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: 0.5em;
}
.infog-indice .slide-infog .col-graficos .modulo-grafico .variaveis img {
  display: block;
  width: 1.6em;
}
.infog-indice .slide-infog .col-graficos .modulo-grafico:before {
  content: "";
  display: block;
  height: 3.5em;
  aspect-ratio: 1/0.8660254038;
  clip-path: polygon(50% -50%, 100% 50%, 50% 150%, 0 50%);
  background: #fff;
  position: absolute;
  bottom: -1.75em;
  left: calc(50% - 2em);
}
.infog-indice .slide-infog .col-graficos .box-grafico {
  width: 100%;
  height: calc(var(--quad) * 2.2);
}

.home-mapa-explicado {
  padding-bottom: var(--pad-base);
  background-color: var(--azul-alt);
}
.home-mapa-explicado .mapa-animacao {
  width: 100%;
  aspect-ratio: 1240/624;
  position: relative;
  padding-top: 4em;
}
.home-mapa-explicado .mapa-animacao svg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@media (width <= 1050px) {
  .home-mapa-explicado .mapa-animacao {
    display: none;
  }
}
.home-mapa-explicado .coluna-texto {
  width: calc(var(--quad) * 7);
}
.home-mapa-explicado .coluna-texto > * + * {
  margin-block-start: 1.5em;
}
@media (width <= 1050px) {
  .home-mapa-explicado .coluna-texto {
    width: 100%;
  }
}
.home-mapa-explicado .lf-destaques {
  position: relative;
  z-index: 20;
  top: -2.5vw;
}
.home-mapa-explicado .lf-destaques .frase-dest {
  font-weight: bold;
}
@media (width <= 1050px) {
  .home-mapa-explicado .lf-destaques {
    top: 0;
  }
  .home-mapa-explicado .lf-destaques > * + * {
    margin-block-start: 2em;
  }
}

.home-metodologia {
  padding-bottom: var(--pad-base);
  background-color: var(--azul-alt);
}
.home-metodologia .lf-metodologia {
  margin-bottom: var(--pad-base);
}
.home-metodologia .coluna-texto {
  width: calc(var(--quad) * 5);
}
.home-metodologia .coluna-texto > * + * {
  margin-block-start: 1.5em;
}
@media (width <= 1050px) {
  .home-metodologia .coluna-texto {
    width: 100%;
    margin-bottom: 2em;
  }
}
.home-metodologia .coluna-links {
  width: calc(var(--quad) * 5.25);
}
.home-metodologia .coluna-links > * + * {
  margin-block-start: 1em;
}
@media (width <= 1050px) {
  .home-metodologia .coluna-links {
    width: 100%;
  }
}
.home-metodologia .link-externo {
  background-color: var(--azul-alt2);
  width: 100%;
  aspect-ratio: 500/115;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 1em;
}
.home-metodologia .link-externo .link-icone {
  gap: 1em;
}
.home-metodologia .link-externo .link-icone small {
  transform: rotate(-90deg);
  background-color: var(--azul);
}
.home-metodologia .link-externo .link-icone small svg {
  fill: var(--sec-azul);
}
.home-metodologia .link-externo:hover .link-icone {
  color: var(--sec-amarelo);
}
.home-metodologia .link-externo:hover .link-icone small svg {
  fill: var(--sec-amarelo);
}

.home-contato {
  background-image: url("../img/bg-arte-contato.svg");
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: center;
  padding-block: 5.5em;
  background-color: var(--azul-alt2);
  border-top: 4px solid var(--azul);
}
.home-contato .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (width <= 1050px) {
  .home-contato .container {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2em;
  }
}
.home-contato .coluna-texto {
  width: calc(var(--quad) * 6);
}
.home-contato .coluna-texto h2 {
  font-weight: bold;
  margin-bottom: 1em;
}
@media (width <= 1050px) {
  .home-contato .coluna-texto {
    width: 100%;
  }
}

.float-tutorial {
  width: calc(var(--quad) * 3);
  background-color: var(--azul-alt2);
  color: #fff;
  padding: 1.5em;
  position: fixed;
}
.float-tutorial > * + * {
  margin-block-start: 1em;
}
.float-tutorial {
  transition: all 0.4s;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
  transform: translate3d(0, 3vw, 0);
}
.float-tutorial.show {
  visibility: visible;
  z-index: 45;
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.float-tutorial:before {
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  position: absolute;
  bottom: calc(100% - 2px);
  left: 0;
  background-color: var(--azul-alt2);
  clip-path: polygon(0 0, 0% 100%, 100% 100%);
  z-index: 100;
}
.float-tutorial .controles {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.float-tutorial .controles a {
  color: var(--sec-azul);
  font-weight: 600;
  text-transform: uppercase;
}
.float-tutorial.etapa1 {
  top: calc(var(--quad) * 1.25);
  left: calc(var(--quad) * 1.25);
}
.float-tutorial.etapa2 {
  top: calc(var(--quad) * 1.25);
  left: calc(var(--quad) * 8);
}
.float-tutorial.etapa3 {
  top: calc(var(--quad) * 1.25);
  left: calc(var(--quad) * 14);
}
.float-tutorial.etapa4 {
  top: auto;
  bottom: calc(var(--quad) * 0.5);
  left: calc(var(--quad) * 2.75);
}
.float-tutorial.etapa4:before {
  bottom: 0;
  left: auto;
  right: calc(100% - 1px);
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}/*# sourceMappingURL=style.css.map */