/* Hombrio: site estático por língua (apps/site). Direção "Mostrador" do D1: giz, petróleo e cobre;
   Big Shoulders Display, Instrument Sans e JetBrains Mono servidas pelo próprio site (woff2, só latim).
   Claro e escuro seguem o sistema. Sem JavaScript; compatível com a CSP da seção 8 do BUILD-SPEC.
   Os url() das fontes são trocados pelo build pelos arquivos com hash em /assets/. */

@font-face {
  font-family: 'Big Shoulders Display';
  src: url('/assets/big-shoulders-display.698f996092.woff2') format('woff2');
  font-style: normal;
  font-weight: 600 800;
  font-display: swap;
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC,
    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Sans';
  src: url('/assets/instrument-sans.2ee17598a9.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC,
    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/assets/jetbrains-mono.cb182feeed.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC,
    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light dark;
  --fd: 'Big Shoulders Display', 'Arial Narrow', ui-sans-serif, sans-serif;
  --fb: 'Instrument Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fm: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* claro, "giz" (D1 3.1) */
  --fundo: #edf0eb;
  --sup: #fafbf8;
  --linha: #d0d8d2;
  --tinta: #0f2328;
  --texto: #22363b;
  --texto-2: #4a5d62;
  --pet-2: #1b5562;
  --pet-wash: #d5e3e3;
  --cobre: #c4542a;
  --cobre-txt: #983e18;
  --aviso-wash: #f6ead0;
  --foco: #c4542a;
  --sombra-1: 0 1px 2px rgba(15, 35, 40, 0.07), 0 10px 24px -14px rgba(15, 35, 40, 0.3);

  /* marca: sempre petróleo, nos dois temas (D1 3.3) */
  --m-fundo: #0f3b44;
  --m-fundo-2: #0b2d34;
  --m-tinta: #edf0eb;
  --m-texto-2: #b9cdcd;
  --m-linha: #2a5560;
  --m-cobre: #e07a4f;
  --m-cobre-claro: #f08a5d;
}

@media (prefers-color-scheme: dark) {
  /* escuro, "noturno" (D1 3.2): altura é superfície mais clara, nunca sombra */
  :root {
    --fundo: #0b1c20;
    --sup: #12292e;
    --linha: #243b40;
    --tinta: #eaf0ee;
    --texto: #cbd6d3;
    --texto-2: #9baeab;
    --pet-2: #8fd0d6;
    --pet-wash: #163a40;
    --cobre: #f08a5d;
    --cobre-txt: #f08a5d;
    --aviso-wash: #3a2b12;
    --foco: #f08a5d;
    --sombra-1: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
  }
}

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font: 400 1.0625rem/1.6 var(--fb);
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
  overflow-wrap: break-word;
}

@media (min-width: 48rem) {
  body {
    font-size: 1.125rem;
  }
}

a {
  color: var(--pet-2);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover {
  text-decoration-thickness: 2px;
}

:focus-visible {
  outline: 2.5px solid var(--foco);
  outline-offset: 3px;
  border-radius: 4px;
}

.marca :focus-visible,
.rodape :focus-visible,
.raiz :focus-visible {
  outline-color: var(--m-cobre-claro);
}

.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.pular {
  position: absolute;
  left: 1rem;
  top: -10rem;
  z-index: 10;
  padding: 0.75rem 1rem;
  border-radius: 10px;
  background: var(--sup);
  color: var(--tinta);
  box-shadow: var(--sombra-1);
  font-weight: 600;
}

.pular:focus {
  top: 1rem;
}

.conteiner {
  width: 100%;
  max-width: 72rem;
  margin-inline: auto;
  padding-inline: 1rem;
}

.estreito {
  max-width: 47rem;
}

@media (min-width: 40rem) {
  .conteiner {
    padding-inline: 1.5rem;
  }
}

/* ícones de linha (D1 6): herdam a cor do texto */
.ic {
  width: 24px;
  height: 24px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* o nome com o mostrador no lugar do "o" */
.wm {
  display: inline-flex;
  align-items: center;
  font: 800 1.75rem/1 var(--fd);
  letter-spacing: 0.01em;
  text-transform: lowercase;
  color: var(--tinta);
}

.dial {
  display: inline-block;
  width: 0.78em;
  height: 0.78em;
  margin-left: 0.04em;
  transform: translateY(0.03em);
}

.dial path {
  fill: currentColor;
}

.dial .d-on {
  fill: var(--cobre);
}

/* topo */
.topo {
  background: var(--fundo);
  border-bottom: 1px solid var(--linha);
}

.topo .conteiner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem 1.5rem;
  padding-block: 0.5rem;
}

.wm-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
}

.linguas {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: var(--texto-2);
}

.linguas ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.linguas a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 0.75rem;
  border-radius: 999px;
  color: var(--texto);
  font-weight: 500;
  text-decoration: none;
}

.linguas a:hover {
  text-decoration: underline;
}

.linguas a[aria-current='true'] {
  background: var(--pet-wash);
  color: var(--tinta);
  font-weight: 600;
}

/* 320 px: as três línguas cabem numa linha sem o globo */
@media (max-width: 23.75rem) {
  .linguas > .ic {
    display: none;
  }

  .linguas a {
    padding: 0 0.5rem;
  }
}

/* faixa da marca (início) */
.marca {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: var(--m-fundo);
  color: var(--m-tinta);
}

.marca a {
  color: var(--m-tinta);
}

.dial-fundo {
  position: absolute;
  z-index: -1;
  top: 3rem;
  right: -10rem;
  width: 24rem;
  height: 24rem;
  color: var(--m-linha);
}

.dial-fundo path,
.dial-fundo .d-on {
  fill: var(--m-linha);
}

.heroi {
  padding-block: 3rem 3rem;
}

@media (min-width: 48rem) {
  .heroi {
    padding-block: 5rem 4.5rem;
  }

  .dial-fundo {
    top: -3rem;
    right: -5rem;
    width: 36rem;
    height: 36rem;
  }
}

.chamada {
  margin: 0 0 0.25rem;
  color: var(--m-cobre-claro);
  font: 600 0.9375rem/1.25 var(--fb);
  letter-spacing: 0.01em;
}

.heroi h1 {
  margin: 0;
  font-size: inherit;
}

.heroi .wm {
  font-size: clamp(4.25rem, 17vw, 8.5rem);
  color: var(--m-tinta);
}

.heroi .wm .d-on {
  fill: var(--m-cobre);
}

.slogan {
  margin: 0.75rem 0 0;
  color: var(--m-tinta);
  font: 700 clamp(1.75rem, 5.5vw, 2.75rem)/1.08 var(--fd);
  text-wrap: balance;
}

.abertura {
  max-width: 38rem;
  margin: 1.25rem 0 0;
  font-size: 1.125rem;
}

.pontos {
  display: grid;
  gap: 0.75rem;
  margin: 1.75rem 0 0;
  padding: 0;
  list-style: none;
}

.pontos li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 500;
}

.pontos .ic {
  color: var(--m-cobre-claro);
}

/* convite do Hombrio+ no início: 7 dias grátis, sem cartão, e o preço como cada país vê */
.oferta {
  display: grid;
  justify-items: start;
  gap: 0.75rem;
  max-width: 40rem;
  margin-top: 2.25rem;
  padding: 1.125rem 1.25rem 1.25rem;
  border: 1px solid var(--m-linha);
  border-radius: 14px;
  background: var(--m-fundo-2);
}

.oferta p {
  margin: 0;
}

.oferta-texto {
  color: var(--m-tinta);
  font-size: 1.0625rem;
  font-weight: 500;
}

.oferta-nota {
  color: var(--m-texto-2);
  font-size: 0.9375rem;
}

.selo {
  padding: 0.45rem 0.6rem;
  border-radius: 6px;
  background: var(--m-cobre-claro);
  color: var(--m-fundo);
  font: 500 0.9375rem/1.2 var(--fm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.botao-2 {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  border: 1.5px solid var(--m-texto-2);
  border-radius: 14px;
  color: var(--m-tinta);
  font-weight: 600;
  text-decoration: none;
}

.botao-2:hover {
  border-color: var(--m-tinta);
  text-decoration: underline;
}

/* seções do início */
.secao {
  padding-block: 3rem;
}

.secao + .secao {
  padding-top: 0;
}

.secao h2 {
  margin: 0 0 1rem;
  color: var(--tinta);
  font: 700 clamp(1.875rem, 5vw, 2.5rem)/1.08 var(--fd);
  text-wrap: balance;
}

.secao > .conteiner > p {
  max-width: 44rem;
  margin: 0;
}

.grade {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 48rem) {
  .grade-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.cartao {
  padding: 1.25rem 1.25rem 1.375rem;
  border: 1px solid var(--linha);
  border-radius: 20px;
  background: var(--sup);
}

.cartao h3 {
  margin: 0.375rem 0 0.5rem;
  color: var(--tinta);
  font: 600 1.25rem/1.25 var(--fb);
  text-wrap: balance;
}

.cartao p {
  margin: 0;
}

.lavado {
  border-color: transparent;
  background: var(--pet-wash);
}

.secao .cartao h2 {
  margin: 0 0 0.5rem;
  font: 600 1.375rem/1.3 var(--fb);
}

.rotulo {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0;
  color: var(--pet-2);
  font: 600 0.9375rem/1.3 var(--fb);
}

.rotulo .num {
  color: var(--cobre-txt);
  font: 500 0.9375rem/1 var(--fm);
}

.linha-icone {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.linha-icone .ic {
  margin-top: 0.15em;
  color: var(--pet-2);
}

.lista-dados {
  display: grid;
  gap: 0.75rem;
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}

.links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
}

/* documentos legais e páginas de texto */
.doc {
  padding-block: 2.5rem 3.5rem;
}

.doc h1 {
  margin: 0 0 1.25rem;
  color: var(--tinta);
  font: 800 clamp(2.25rem, 8vw, 3.25rem)/1.02 var(--fd);
  text-wrap: balance;
}

.versoes {
  margin: 0 0 1.75rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--linha);
  border-radius: 14px;
  background: var(--sup);
  font-size: 0.9375rem;
}

.versoes p {
  margin: 0;
}

.versoes ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.versoes a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}

.indice {
  margin: 0 0 2rem;
}

.indice h2 {
  margin: 0 0 0.25rem;
  color: var(--texto-2);
  font: 600 0.9375rem/1.4 var(--fb);
}

.indice ul {
  margin: 0;
  padding-left: 1.125rem;
}

.indice li {
  margin: 0.125rem 0;
}

/* Alvo de 44 px; alinhado pelo alto, o marcador da lista fica na primeira linha do item longo. */
.indice a {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  min-height: 44px;
  padding-block: 0.625rem;
}

.corpo h2 {
  scroll-margin-top: 1rem;
  margin: 2.25rem 0 0.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--linha);
  color: var(--tinta);
  font: 600 1.375rem/1.3 var(--fb);
  text-wrap: balance;
}

.corpo h3 {
  scroll-margin-top: 1rem;
  margin: 1.5rem 0 0.5rem;
  color: var(--tinta);
  font: 600 1.125rem/1.35 var(--fb);
}

.corpo p,
.corpo ul,
.corpo ol {
  margin: 0 0 1rem;
}

.corpo ul,
.corpo ol {
  padding-left: 1.25rem;
}

.corpo li {
  margin: 0.4rem 0;
}

.corpo li::marker {
  color: var(--pet-2);
}

.corpo strong {
  color: var(--tinta);
  font-weight: 600;
}

.outros {
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--linha);
}

.outros h2 {
  margin: 0 0 0.25rem;
  color: var(--texto-2);
  font: 600 0.9375rem/1.4 var(--fb);
}

mark.pendente {
  padding: 0.05em 0.3em;
  border-radius: 4px;
  background: var(--aviso-wash);
  color: var(--tinta);
  font: 500 0.875em/1.2 var(--fm);
}

/* biblioteca: páginas de busca dos itens grátis e índices */
.migalhas {
  margin: 0 0 1.25rem;
  font-size: 0.9375rem;
}

.migalhas ol {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
}

.migalhas li + li::before {
  content: '›';
  margin: 0 0.5rem;
  color: var(--texto-2);
}

.migalhas a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.migalhas [aria-current='page'] {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--texto-2);
}

.rotulo-item {
  margin: 0 0 0.5rem;
  color: var(--pet-2);
  font: 600 0.9375rem/1.3 var(--fb);
}

.resumo {
  max-width: 44rem;
  margin: 0 0 1.75rem;
  color: var(--texto);
  font-size: 1.125rem;
}

.abertura-item {
  margin: 0 0 1.25rem;
}

.apoio {
  display: block;
  margin-top: 0.25rem;
  color: var(--texto-2);
  font-size: 0.9375rem;
}

.corpo .sinais ul {
  margin: 0 0 1.5rem;
  padding: 0;
  list-style: none;
  border: 1px solid var(--linha);
  border-radius: 14px;
  background: var(--sup);
}

.sinal {
  margin: 0;
  padding: 1rem 1.125rem;
}

.sinal + .sinal {
  border-top: 1px solid var(--linha);
}

.sinal p {
  margin: 0;
}

.sinal-texto {
  color: var(--tinta);
}

.nivel {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0 0 0.375rem;
  color: var(--pet-2);
  font: 600 0.875rem/1.2 var(--fm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.nivel .ic {
  width: 20px;
  height: 20px;
}

.em-uma-frase {
  margin: 0 0 1.5rem;
  padding: 1rem 1.125rem;
  border-radius: 14px;
  background: var(--pet-wash);
}

.em-uma-frase p {
  margin: 0;
}

.em-uma-frase .rotulo {
  margin-bottom: 0.25rem;
}

.frase {
  color: var(--tinta);
  font-weight: 600;
}

.corpo .destaque,
.nota-caixa {
  margin: 0 0 1.5rem;
  padding: 1rem 1.125rem;
  border: 1.5px solid var(--linha);
  border-radius: 14px;
  color: var(--tinta);
}

.nota-caixa p {
  margin: 0 0 0.5rem;
}

.nota-caixa p:last-child {
  margin-bottom: 0;
}

.nota-caixa .rotulo {
  margin-bottom: 0.375rem;
}

.nota {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin: 0 0 1.5rem;
  color: var(--texto);
}

.nota .ic {
  margin-top: 0.1em;
  color: var(--pet-2);
}

.abrir-app {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
  margin: 2rem 0;
  padding: 1rem 1.125rem;
  border-radius: 14px;
  background: var(--pet-wash);
}

.abrir-app p {
  flex: 1 1 14rem;
  margin: 0;
}

.botao {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1.125rem;
  border: 1.5px solid var(--m-fundo);
  border-radius: 14px;
  background: var(--m-fundo);
  color: var(--m-tinta);
  font-weight: 600;
  text-decoration: none;
}

.botao:hover {
  text-decoration: underline;
}

@media (prefers-color-scheme: dark) {
  .botao {
    border-color: var(--pet-2);
  }
}

.rodape-item {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--linha);
  font-size: 0.9375rem;
}

.rodape-item h2 {
  margin: 0 0 0.5rem;
  color: var(--tinta);
  font: 600 1.125rem/1.35 var(--fb);
}

.fontes {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
  color: var(--texto-2);
}

.fontes li {
  margin: 0.375rem 0;
}

.legal {
  margin: 0 0 0.5rem;
  color: var(--texto-2);
}

.ver-tambem {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--linha);
}

.ver-tambem h2 {
  margin: 0 0 0.25rem;
  color: var(--texto-2);
  font: 600 0.9375rem/1.4 var(--fb);
}

.mais-link {
  margin: 1rem 0 0;
}

.mais-link a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
}

.grupo h2 {
  margin: 2.25rem 0 0.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--linha);
  color: var(--tinta);
  font: 600 1.375rem/1.3 var(--fb);
}

.grupo > p {
  margin: 0 0 0.5rem;
}

.itens {
  margin: 0;
  padding: 0;
  list-style: none;
}

.item-lista,
.itens > li {
  padding: 0.875rem 0;
}

.itens > li + li {
  border-top: 1px solid var(--linha);
}

.itens h3 {
  margin: 0 0 0.25rem;
  color: var(--tinta);
  font: 600 1.125rem/1.35 var(--fb);
}

.itens h3 a {
  display: inline-block;
  padding-block: 0.25rem;
}

.itens p {
  margin: 0 0 0.25rem;
}

.meta {
  color: var(--texto-2);
  font-size: 0.9375rem;
}

.selo-mais {
  color: var(--cobre-txt);
  font: 500 0.875rem/1.2 var(--fm);
  letter-spacing: 0.04em;
}

.secoes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 40rem) {
  .secoes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.secoes h2 {
  margin: 0 0 0.375rem;
  font: 600 1.25rem/1.3 var(--fb);
}

.secoes h2 a {
  display: inline-block;
  padding-block: 0.25rem;
}

.ficha {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 2rem;
  margin: 0 0 1.5rem;
}

.ficha dt {
  color: var(--texto-2);
  font-size: 0.9375rem;
}

.ficha dd {
  margin: 0;
  color: var(--tinta);
  font-weight: 600;
}

.qtd {
  color: var(--tinta);
  font: 500 0.9375rem/1.4 var(--fm);
}

.exercicios {
  margin: 0;
  padding: 0;
  list-style: none;
}

.exercicio {
  margin: 0 0 1rem;
  padding: 1rem 1.125rem;
  border: 1px solid var(--linha);
  border-radius: 14px;
  background: var(--sup);
}

.corpo .exercicio h3 {
  margin: 0 0 0.25rem;
}

.alvo {
  margin: 0 0 0.5rem;
  color: var(--pet-2);
  font: 500 0.9375rem/1.4 var(--fm);
}

.selo-curta {
  margin: 0 0 0.5rem;
  color: var(--cobre-txt);
  font: 500 0.875rem/1.2 var(--fm);
}

.corpo .passos {
  margin: 0 0 0.5rem;
}

.cartao-texto {
  margin: 0;
  padding: 1.25rem 0 0.5rem;
  border-top: 1px solid var(--linha);
}

.cartao-texto h2 {
  margin: 0 0 0.5rem;
  color: var(--tinta);
  font: 600 1.375rem/1.3 var(--fb);
  text-wrap: balance;
}

.cartao-texto h3 {
  margin: 0.75rem 0 0.25rem;
  color: var(--texto-2);
  font: 600 0.9375rem/1.4 var(--fb);
}

.cartao-texto p {
  margin: 0 0 0.75rem;
}

.afirmacao {
  color: var(--tinta);
  font-style: italic;
}

.afirmacao .rotulo {
  display: inline;
  font-style: normal;
}

.veredito {
  display: inline-block;
  padding: 0.3rem 0.55rem;
  border: 1.5px solid var(--pet-2);
  border-radius: 6px;
  color: var(--pet-2);
  font: 600 0.875rem/1.2 var(--fm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* rodapé */
.rodape {
  padding-block: 2.5rem 3rem;
  background: var(--m-fundo-2);
  color: var(--m-texto-2);
  font-size: 0.9375rem;
}

.rodape a {
  color: var(--m-tinta);
}

.rodape .wm {
  font-size: 1.5rem;
  color: var(--m-tinta);
}

.rodape .wm .d-on {
  fill: var(--m-cobre);
}

.rodape nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.25rem;
  margin: 1rem 0 1.25rem;
  padding: 0;
  list-style: none;
}

.rodape nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.isencao {
  max-width: 47rem;
  margin: 0 0 1rem;
  color: var(--m-tinta);
}

.rodape p {
  margin: 0 0 0.375rem;
}

/* raiz e página não encontrada */
.raiz {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 2rem 1rem;
  background: var(--m-fundo);
  color: var(--m-tinta);
}

.raiz main {
  width: 100%;
  max-width: 30rem;
}

.raiz h1 {
  margin: 0;
  font-size: inherit;
}

.raiz .wm {
  font-size: clamp(3.75rem, 18vw, 6.5rem);
  color: var(--m-tinta);
}

.raiz .wm .d-on {
  fill: var(--m-cobre);
}

.escolha {
  display: grid;
  gap: 0.75rem;
  margin: 2rem 0;
  padding: 0;
  list-style: none;
}

.escolha a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.125rem;
  min-height: 64px;
  padding: 0.875rem 1.25rem;
  border: 1px solid var(--m-linha);
  border-radius: 14px;
  background: var(--m-fundo-2);
  color: var(--m-tinta);
  font-size: 1.125rem;
  font-weight: 600;
  text-decoration: none;
}

.escolha a:hover {
  border-color: var(--m-cobre-claro);
}

.escolha span {
  color: var(--m-texto-2);
  font-size: 0.9375rem;
  font-weight: 400;
}

.raiz .isencao {
  margin: 0 0 0.75rem;
  color: var(--m-texto-2);
  font-size: 0.9375rem;
}

@media (forced-colors: active) {
  .selo,
  .cartao,
  .versoes,
  .escolha a,
  .oferta,
  .em-uma-frase,
  .abrir-app,
  .exercicio,
  .botao {
    border: 1px solid CanvasText;
  }
}

@media print {
  .topo nav,
  .rodape nav,
  .pular,
  .dial-fundo {
    display: none;
  }

  body,
  .rodape,
  .marca {
    background: #fff;
    color: #000;
  }
}