/* ============================================================
   noar · camada do site sobre o PASSI DS 1.1.0
   Ordem de carga: passi/passi.css → passi/passi-componentes.css → noar.css
   Tudo aqui usa os tokens do PASSI. As duas exceções da noar estão
   marcadas: os títulos grandes em caixa alta e as animações de entrada.
   ============================================================ */

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--espaco-20); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--cor-fundo-pagina);
  color: var(--cor-texto-padrao);
  font: var(--texto-corpo-medio);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img { display: block; max-width: 100%; }
a { color: inherit; }

/* Logo da noar: o azul é a cor do arquivo de marca, não um token de interface.
   No escuro ele passa para o azul de texto do PASSI, que tem contraste no fundo escuro. */
.noar-logo { display: block; height: var(--espaco-6); width: auto; color: var(--cor-texto-padrao); --noar-logo-azul: #034ad8; /* passi-ignorar */ }
.noar-logo .azul { fill: var(--noar-logo-azul); }
[data-tema="escuro"] .noar-logo, [data-tema="alto-contraste-escuro"] .noar-logo { --noar-logo-azul: var(--cor-texto-marca); }
@media (prefers-color-scheme: dark) { :root:not([data-tema="claro"]) .noar-logo { --noar-logo-azul: var(--cor-texto-marca); } }

/* ---------- Grade ---------- */
.noar-conteudo { width: 100%; max-width: var(--conteudo-maximo); margin-inline: auto; padding-inline: var(--grade-celular-margem); }
@media (min-width: 768px) { .noar-conteudo { padding-inline: var(--grade-tablet-margem); } }
@media (min-width: 1200px) { .noar-conteudo { padding-inline: var(--grade-computador-margem); } }
.noar-conteudo--estreito { max-width: calc(var(--espaco-24) * 8); }

.noar-secao { padding-block: var(--espaco-16); background: var(--cor-fundo-pagina); color: var(--cor-texto-padrao); }
@media (min-width: 900px) { .noar-secao { padding-block: var(--espaco-24); } }
.noar-secao--sutil { background: var(--cor-fundo-sutil); }
.noar-secao--marca { background: var(--cor-fundo-marca); color: var(--cor-texto-sobre-marca); }
/* Seções com data-tema="escuro" ganham os tokens do modo escuro (padrão "Números" do PASSI) */
.noar-secao[data-tema="escuro"] { border-block: var(--borda-fina) solid var(--cor-borda-padrao); }

.noar-cabeca-secao { max-width: calc(var(--espaco-24) * 10); }
.noar-cabeca-secao .texto-sobretitulo { display: block; margin-bottom: var(--espaco-5); color: var(--cor-texto-secundario); }
.noar-cabeca-secao > p { margin-top: var(--espaco-6); max-width: calc(var(--espaco-24) * 7); color: var(--cor-texto-secundario); }
.noar-secao--marca .noar-cabeca-secao .texto-sobretitulo,
.noar-secao--marca .noar-cabeca-secao > p { color: var(--cor-texto-sobre-marca); }

/* ---------- Exceção da noar 1: títulos grandes ----------
   Archivo extranegrito em caixa alta, entrelinha apertada e tamanho que acompanha a tela.
   Os tamanhos partem da escala do PASSI e passam dela no computador, de propósito. */
.noar-display {
  font-family: var(--fonte-titulos);
  font-weight: var(--peso-extranegrito);
  text-transform: uppercase;
  line-height: 0.92; /* passi-ignorar */
  letter-spacing: -0.03em; /* passi-ignorar */
  text-wrap: balance;
}
.noar-display--xl { font-size: clamp(var(--tamanho-56), 9.2vw, calc(var(--tamanho-72) * 2)); /* passi-ignorar */ }
.noar-display--lg { font-size: clamp(var(--tamanho-40), 5.6vw, calc(var(--tamanho-40) * 2)); /* passi-ignorar */ }
.noar-titulo-secao {
  font-family: var(--fonte-titulos);
  font-weight: var(--peso-extranegrito);
  text-transform: uppercase;
  line-height: 0.95; /* passi-ignorar */
  letter-spacing: -0.02em; /* passi-ignorar */
  font-size: clamp(var(--tamanho-32), 4.6vw, var(--tamanho-56)); /* passi-ignorar */
  text-wrap: balance;
}
.noar-titulo-secao--menor { font-size: clamp(var(--tamanho-24), 3.4vw, var(--tamanho-40)); /* passi-ignorar */ }
.noar-destaque-marca { color: var(--cor-texto-marca); }

/* ---------- Exceção da noar 2: animações de entrada ----------
   Mesmos tempos e curvas do site anterior, de propósito: são a assinatura de movimento da noar
   e passam do que os tokens de --duracao-* oferecem.
   .rv sobe e aparece; .rl revela uma linha de título de baixo para cima.
   Com movimento reduzido, tudo aparece parado. */
:root {
  --noar-surgir-duracao: 0.8s; /* passi-ignorar */
  --noar-surgir-curva: cubic-bezier(0.2, 0.6, 0.2, 1); /* passi-ignorar */
  --noar-linha-duracao: 1s; /* passi-ignorar */
  --noar-linha-curva: cubic-bezier(0.19, 0.7, 0.16, 1); /* passi-ignorar */
}
.rv { opacity: 0; transform: translateY(1.75rem); transition: opacity var(--noar-surgir-duracao) var(--noar-surgir-curva), transform var(--noar-surgir-duracao) var(--noar-surgir-curva); transition-delay: var(--d, 0s); }
.rv.in { opacity: 1; transform: none; }
/* A folga embaixo evita cortar o Ç e as letras que descem; a margem negativa devolve o espaço */
.rl { display: block; overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; /* passi-ignorar */ }
.rl > span { display: block; transform: translateY(112%); transition: transform var(--noar-linha-duracao) var(--noar-linha-curva); transition-delay: var(--d, 0s); }
.carregado .noar-abertura .rl > span, .rl.in > span { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .rv, .rl > span { transition: none; opacity: 1; transform: none; }
}
.sem-js .rv, .sem-js .rl > span { opacity: 1; transform: none; }

/* ---------- Ícones fora dos componentes em código ---------- */
.noar-icone { flex: none; display: inline-block; vertical-align: middle; width: var(--espaco-5); height: var(--espaco-5); }
.noar-icone--p { width: var(--espaco-4); height: var(--espaco-4); }

/* ---------- Botão que leva a outro lugar ----------
   Mesmo desenho do Botão do PASSI (passi-botao), num <a>, para chamadas que navegam. */
.noar-botao {
  box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--espaco-2);
  min-height: var(--espaco-10); padding: 0 var(--espaco-4);
  border: var(--borda-fina) solid transparent; border-radius: var(--raio-pilula);
  font: var(--texto-rotulo-medio); letter-spacing: var(--texto-rotulo-medio-espacamento-letras);
  white-space: nowrap; text-decoration: none; cursor: pointer;
  background: var(--cor-fundo-marca); color: var(--cor-texto-sobre-marca);
  transition: background-color var(--duracao-rapida) var(--curva-padrao), border-color var(--duracao-rapida) var(--curva-padrao);
}
.noar-botao:hover { background: var(--cor-fundo-marca-hover); }
.noar-botao:active { background: var(--cor-fundo-marca-pressionado); }
.noar-botao--g { min-height: var(--espaco-12); padding: 0 var(--espaco-5); font: var(--texto-rotulo-grande); letter-spacing: var(--texto-rotulo-grande-espacamento-letras); }
.noar-botao--p { min-height: var(--espaco-8); padding: 0 var(--espaco-3); }
.noar-botao--secundario { background: var(--cor-fundo-invertido); color: var(--cor-texto-invertido); }
.noar-botao--secundario:hover { background: var(--cor-fundo-invertido-hover); }
.noar-botao--secundario:active { background: var(--cor-fundo-invertido-pressionado); }
.noar-botao--contorno { background: transparent; color: var(--cor-texto-padrao); border-color: var(--cor-borda-forte); }
.noar-botao--contorno:hover { background: var(--cor-fundo-sutil); }
.noar-botao--contorno:active { background: var(--cor-fundo-sutil-hover); }
.noar-botao--bloco, passi-botao.noar-botao--bloco, passi-botao.noar-botao--bloco > button { width: 100%; }
passi-botao.noar-botao--bloco { display: flex; }

/* Link em texto corrido e link de navegação */
.noar-link { color: var(--cor-texto-marca); text-decoration: underline; text-underline-offset: 0.2em; }
.noar-link:hover { color: var(--cor-texto-marca-hover); }
.noar-link:active { color: var(--cor-texto-marca-pressionado); }
.noar-link .noar-icone { width: var(--espaco-4); height: var(--espaco-4); margin-left: var(--espaco-1); }
.noar-link--sobre-marca, .noar-link--sobre-marca:hover, .noar-link--sobre-marca:active { color: var(--cor-texto-sobre-marca); }
.noar-link-nav { text-decoration: none; }
.noar-link-nav:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* Botão de ícone (fantasma) */
.noar-botao-icone {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--espaco-10); height: var(--espaco-10); padding: 0;
  border: 0; border-radius: var(--raio-pilula); background: transparent; color: inherit; cursor: pointer;
  transition: background-color var(--duracao-rapida) var(--curva-padrao);
}
.noar-botao-icone:hover { background: var(--cor-fundo-fantasma-hover); }
.noar-botao-icone:active { background: var(--cor-fundo-fantasma-pressionado); }

/* ---------- Selo ---------- */
.noar-selo {
  display: inline-flex; align-items: center; gap: var(--espaco-1);
  padding: var(--espaco-0-5) var(--espaco-2); border-radius: var(--raio-pilula);
  font: var(--texto-rotulo-pequeno); letter-spacing: var(--texto-rotulo-pequeno-espacamento-letras);
  background: var(--cor-fundo-sutil); color: var(--cor-texto-secundario);
  white-space: nowrap; vertical-align: middle;
}
.noar-selo .noar-icone { width: var(--espaco-4); height: var(--espaco-4); }
.noar-selo--marca { background: var(--cor-fundo-marca-sutil); color: var(--cor-texto-marca); }
.noar-selo--marca-forte { background: var(--cor-fundo-marca); color: var(--cor-texto-sobre-marca); }
.noar-selo--sucesso { background: var(--cor-fundo-sucesso-sutil); color: var(--cor-texto-sucesso); }
.noar-selo--alerta { background: var(--cor-fundo-alerta-sutil); color: var(--cor-texto-alerta); }
.noar-selo--erro { background: var(--cor-fundo-erro-sutil); color: var(--cor-texto-erro); }
.noar-selo--superficie { background: var(--cor-fundo-superficie); border: var(--borda-fina) solid var(--cor-borda-padrao); }

/* ---------- Superfície ---------- */
.noar-superficie { background: var(--cor-fundo-superficie); border: var(--borda-fina) solid var(--cor-borda-padrao); border-radius: var(--raio-extra); color: var(--cor-texto-padrao); }

/* ---------- Faixa de aviso (padrão Cabeçalho do site · com faixa) ---------- */
.noar-faixa { background: var(--cor-fundo-marca); color: var(--cor-texto-sobre-marca); }
.noar-faixa[hidden] { display: none; }
.noar-faixa .noar-conteudo { display: flex; align-items: center; justify-content: center; gap: var(--espaco-3); min-height: var(--espaco-10); padding-block: var(--espaco-1); position: relative; text-align: center; }
.noar-faixa p { font: var(--texto-rotulo-pequeno); letter-spacing: var(--texto-rotulo-pequeno-espacamento-letras); padding-inline: var(--espaco-8); }
.noar-faixa a { font-weight: var(--peso-negrito); color: inherit; text-underline-offset: 0.2em; }
.noar-faixa .noar-botao-icone { position: absolute; right: var(--espaco-2); width: var(--espaco-8); height: var(--espaco-8); }
.noar-faixa .noar-botao-icone:focus-visible { outline-color: var(--cor-texto-sobre-marca); }
@media (max-width: 640px) { .noar-faixa .so-computador { display: none; } }

/* ---------- Cabeçalho do site: pílula flutuante de vidro ----------
   Padrão Cabeçalho do site do PASSI montado como elemento flutuante (superfície + Sombra/Média)
   com o Painel de vidro: preenchimento translúcido e --desfoque-medio. Fica fixa no topo, centralizada. */
.noar-cabecalho { position: sticky; top: var(--espaco-3); z-index: 60; display: flex; justify-content: center; margin-top: var(--espaco-3); padding: 0 var(--espaco-4); pointer-events: none; }
.noar-pilula {
  pointer-events: auto;
  display: flex; align-items: center; gap: var(--espaco-6);
  padding: var(--espaco-2) var(--espaco-2) var(--espaco-2) var(--espaco-5);
  border: var(--borda-fina) solid var(--cor-borda-padrao); border-radius: var(--raio-pilula);
  background: color-mix(in srgb, var(--cor-fundo-superficie) 88%, transparent);
  -webkit-backdrop-filter: blur(var(--desfoque-medio)); backdrop-filter: blur(var(--desfoque-medio));
  box-shadow: var(--sombra-media);
}
@supports not (backdrop-filter: blur(1px)) { .noar-pilula { background: var(--cor-fundo-superficie); } }
.noar-cabecalho .noar-marca { display: inline-flex; align-items: center; min-height: var(--espaco-10); }
.noar-pilula .noar-logo { height: calc(var(--espaco-5) + var(--espaco-0-5)); }
.noar-nav { display: flex; gap: var(--espaco-1); }
.noar-nav a {
  display: inline-flex; align-items: center; min-height: var(--espaco-10); padding: 0 var(--espaco-3);
  border-radius: var(--raio-pilula); text-decoration: none;
  font: var(--texto-rotulo-medio); letter-spacing: var(--texto-rotulo-medio-espacamento-letras);
  color: var(--cor-texto-secundario);
  transition: color var(--duracao-rapida) var(--curva-padrao), background-color var(--duracao-rapida) var(--curva-padrao);
}
.noar-nav a:hover { color: var(--cor-texto-padrao); background: var(--cor-fundo-fantasma-hover); }
.noar-nav a:active { background: var(--cor-fundo-fantasma-pressionado); }
.noar-cabecalho__acoes { display: flex; align-items: center; gap: var(--espaco-1); }
.noar-cabecalho__menu { display: none; }
@media (max-width: 860px) {
  .noar-cabecalho .noar-nav { display: none; }
  .noar-cabecalho__menu { display: inline-flex; }
  .noar-pilula { gap: var(--espaco-3); padding-left: var(--espaco-4); }
  .noar-pilula .noar-botao { min-height: var(--espaco-8); padding: 0 var(--espaco-3); }
}
@media (max-width: 359px) {
  .noar-cabecalho { padding: 0 var(--espaco-2); }
  .noar-pilula { gap: var(--espaco-2); padding-left: var(--espaco-3); }
  .noar-pilula .noar-logo { height: var(--espaco-4); }
}

/* Menu do celular, em tela cheia */
.noar-menu-celular { position: fixed; inset: 0; z-index: 70; display: flex; flex-direction: column; background: var(--cor-fundo-pagina); }
.noar-menu-celular[hidden] { display: none; }
.noar-menu-celular__topo { display: flex; align-items: center; justify-content: space-between; min-height: var(--espaco-16); border-bottom: var(--borda-fina) solid var(--cor-borda-padrao); }
.noar-menu-celular nav { display: flex; flex-direction: column; padding-block: var(--espaco-4); }
.noar-menu-celular nav a { display: flex; align-items: center; justify-content: space-between; min-height: var(--espaco-12); border-bottom: var(--borda-fina) solid var(--cor-borda-padrao); text-decoration: none; font: var(--texto-titulo-4); letter-spacing: var(--texto-titulo-4-espacamento-letras); }
.noar-menu-celular nav a:active { background: var(--cor-fundo-fantasma-pressionado); }
.noar-menu-celular .noar-botao { margin-top: var(--espaco-6); }
.menu-aberto { overflow: hidden; }

/* Cabeçalho simples (páginas internas e pagamento): só a marca e o caminho de volta */
.noar-cabecalho--simples .noar-pilula { gap: var(--espaco-8); }

/* ---------- Rodapé do site (Completo, no modo escuro) ---------- */
.noar-rodape { background: var(--cor-fundo-pagina); color: var(--cor-texto-padrao); padding-block: var(--espaco-16) var(--espaco-8); }
.noar-rodape__grade { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--espaco-10); }
@media (max-width: 900px) { .noar-rodape__grade { grid-template-columns: 1fr 1fr; } .noar-rodape__marca { grid-column: 1 / -1; } }
@media (max-width: 520px) { .noar-rodape__grade { grid-template-columns: 1fr; } }
.noar-rodape__marca p { margin-top: var(--espaco-4); max-width: calc(var(--espaco-24) * 4); color: var(--cor-texto-secundario); }
.noar-rodape h2 { margin-bottom: var(--espaco-4); color: var(--cor-texto-secundario); }
.noar-rodape li a { display: inline-flex; align-items: center; gap: var(--espaco-1); min-height: var(--espaco-8); color: var(--cor-texto-padrao); }
.noar-rodape__selos { display: flex; flex-wrap: wrap; gap: var(--espaco-2); margin-top: var(--espaco-12); }
.noar-rodape__fim { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--espaco-3); margin-top: var(--espaco-6); padding-top: var(--espaco-6); border-top: var(--borda-fina) solid var(--cor-borda-padrao); color: var(--cor-texto-secundario); }
.noar-rodape__fim a { color: var(--cor-texto-padrao); text-underline-offset: 0.2em; }
.noar-rodape__fim .noar-link-nav { display: inline-flex; align-items: center; gap: var(--espaco-1); min-height: var(--espaco-8); }

/* Rodapé simples (uma linha) */
.noar-rodape--simples { padding-block: var(--espaco-8); border-top: var(--borda-fina) solid var(--cor-borda-padrao); }
.noar-rodape--simples .noar-conteudo { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--espaco-3); color: var(--cor-texto-secundario); }
.noar-rodape--simples a { color: var(--cor-texto-padrao); text-underline-offset: 0.2em; }

/* ---------- Página de texto (privacidade e termos) ---------- */
.noar-documento { padding-block: var(--espaco-16) var(--espaco-20); }
.noar-documento h1 { margin-bottom: var(--espaco-4); }
.noar-documento .texto-sobretitulo { display: block; color: var(--cor-texto-secundario); }
.noar-documento .noar-documento__intro { margin-top: var(--espaco-6); color: var(--cor-texto-secundario); }
.noar-documento h2 { margin-top: var(--espaco-10); padding-top: var(--espaco-6); border-top: var(--borda-fina) solid var(--cor-borda-padrao); }
.noar-documento h2 + p { margin-top: var(--espaco-3); }
.noar-documento p { color: var(--cor-texto-secundario); }
.noar-documento p + p { margin-top: var(--espaco-3); }

/* ---------- Ações e chamada final (home e páginas de case) ---------- */
.noar-acoes { display: flex; flex-wrap: wrap; gap: var(--espaco-3); margin-top: var(--espaco-10); }
.noar-final { text-align: center; }
.noar-final .texto-sobretitulo { display: block; margin-bottom: var(--espaco-6); }
.noar-final p { margin: var(--espaco-8) auto 0; max-width: calc(var(--espaco-24) * 6); }
.noar-final .noar-acoes { justify-content: center; align-items: center; gap: var(--espaco-6); }
.noar-final .noar-final__resumo { margin-top: var(--espaco-8); }

/* ---------- Páginas de case (/cases/*.html) ---------- */
.noar-caso { padding-block: var(--espaco-12) var(--espaco-16); }
.noar-caso__trilha { display: flex; justify-content: space-between; align-items: center; gap: var(--espaco-4); margin-bottom: var(--espaco-10); color: var(--cor-texto-secundario); }
.noar-caso__trilha a { display: inline-flex; align-items: center; gap: var(--espaco-2); color: inherit; text-decoration: none; }
.noar-caso__trilha a:hover { color: var(--cor-texto-marca); }
.noar-caso__segmento { display: block; margin-bottom: var(--espaco-5); color: var(--cor-texto-secundario); }
.noar-caso__tese { margin-top: var(--espaco-8); max-width: calc(var(--espaco-24) * 8); }
.noar-caso__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: var(--espaco-4) var(--espaco-8); margin-top: var(--espaco-8); }
.noar-caso__endereco { color: var(--cor-texto-secundario); }
.noar-caso__tela { margin-top: var(--espaco-12); aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--raio-grande); border: var(--borda-fina) solid var(--cor-borda-padrao); background: var(--cor-fundo-sutil); box-shadow: var(--sombra-grande); }
.noar-caso__tela img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }

/* Nota de presença: antes e depois */
.noar-caso-nota { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: var(--espaco-6); margin-top: var(--espaco-12); padding-top: var(--espaco-8); border-top: var(--borda-fina) solid var(--cor-borda-forte); }
.noar-caso-nota__item .texto-sobretitulo { display: block; color: var(--cor-texto-secundario); }
.noar-caso-nota__numero { display: block; margin-top: var(--espaco-3); font-family: var(--fonte-titulos); font-weight: var(--peso-extranegrito); line-height: 0.9; /* passi-ignorar */ letter-spacing: -0.03em; /* passi-ignorar */ font-size: clamp(var(--tamanho-56), 12vw, calc(var(--tamanho-72) * 2.4)); /* passi-ignorar */ }
.noar-caso-nota__numero small { margin-left: var(--espaco-1); letter-spacing: 0; color: var(--cor-texto-terciario); }
.noar-caso-nota__item--depois .noar-caso-nota__numero { color: var(--cor-texto-marca); }
.noar-caso-nota__numero--vazio, .noar-caso-nota__item--depois .noar-caso-nota__numero--vazio { color: var(--cor-texto-terciario); }
.noar-caso-nota__seta { padding-bottom: var(--espaco-6); color: var(--cor-texto-terciario); }
.noar-caso-nota__seta .noar-icone { width: var(--espaco-10); height: var(--espaco-10); }
.noar-caso-nota__rodape { display: flex; flex-wrap: wrap; align-items: center; gap: var(--espaco-3) var(--espaco-6); margin-top: var(--espaco-8); color: var(--cor-texto-secundario); }
@media (max-width: 560px) { .noar-caso-nota { grid-template-columns: 1fr 1fr; } .noar-caso-nota__seta { display: none; } }

/* Desafio, solução e resultado */
.noar-caso-historia { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--espaco-10); margin-top: var(--espaco-12); }
.noar-caso-historia > div { padding-top: var(--espaco-6); border-top: var(--borda-grossa) solid var(--cor-borda-forte); }
.noar-caso-historia .texto-codigo-pequeno { color: var(--cor-texto-terciario); }
.noar-caso-historia h3 { margin-top: var(--espaco-3); }
.noar-caso-historia p { margin-top: var(--espaco-4); color: var(--cor-texto-secundario); }
@media (max-width: 900px) { .noar-caso-historia { grid-template-columns: 1fr; gap: var(--espaco-8); } }

/* Próximo projeto */
.noar-caso-proximo { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--espaco-2) var(--espaco-6); padding-block: var(--espaco-8); border-block: var(--borda-fina) solid var(--cor-borda-padrao); color: var(--cor-texto-padrao); text-decoration: none; }
.noar-caso-proximo .texto-sobretitulo { grid-column: 1 / -1; color: var(--cor-texto-secundario); }
.noar-caso-proximo__nome { font-family: var(--fonte-titulos); font-weight: var(--peso-extranegrito); text-transform: uppercase; line-height: 0.95; /* passi-ignorar */ letter-spacing: -0.02em; /* passi-ignorar */ font-size: clamp(var(--tamanho-32), 6vw, calc(var(--tamanho-72) * 1.2)); /* passi-ignorar */ transition: transform var(--noar-surgir-duracao) var(--noar-surgir-curva), color var(--duracao-rapida) var(--curva-padrao); }
.noar-caso-proximo .noar-icone { width: var(--espaco-10); height: var(--espaco-10); color: var(--cor-texto-marca); }
.noar-caso-proximo:hover .noar-caso-proximo__nome, .noar-caso-proximo:focus-visible .noar-caso-proximo__nome { color: var(--cor-texto-marca); transform: translateX(var(--espaco-4)); }
.noar-caso-proximo:focus-visible { outline-offset: calc(var(--borda-grossa) * -1); }
.noar-caso-todos { margin-top: var(--espaco-6); }