/* RABN Advogados · V2
   Paleta oficial do manual de marca. Um fundo dominante (creme), um bloco sólido de marca (verde), rodapé grafite.
   Tipografia: Instrument Sans (títulos e corpo) + Instrument Serif (só onde a marca fala: palavra-chave, numerais, itálico). */

:root {
  --verde: #1F3829;
  --verde-fundo: #182C21;      /* base do véu do hero, derivada do verde âncora */
  --creme: #ECE7DA;
  --gelo: #F4F5F6;
  --cinza: #B6B6B6;
  --grafite: #2B2B2B;

  /* cores sólidas de apoio, calculadas sobre o creme para manter AA sem opacidade */
  --texto: #2B2B2B;
  --texto-suave: #55635A;      /* verde 70% sobre creme */
  --erro: #8A3B2E;
  --linha: rgba(31, 56, 41, 0.16);
  --linha-clara: rgba(236, 231, 218, 0.22);
  --creme-suave: rgba(236, 231, 218, 0.78);

  --sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, "Times New Roman", serif;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);

  --largura: 76rem;
  --lateral: clamp(1.25rem, 4vw, 3rem);
  --secao: clamp(5.5rem, 11vw, 9.5rem);
  --raio: 2px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--texto);
  background: var(--creme);
  font-feature-settings: "ss01", "kern";
  -webkit-font-smoothing: antialiased;
}
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 500; letter-spacing: -0.02em; }
ul, ol, dl, dd { margin: 0; padding: 0; }
ul { list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }

.container { width: min(100% - 2 * var(--lateral), var(--largura)); margin-inline: auto; }

:focus-visible { outline: 2px solid var(--verde); outline-offset: 4px; }
.metodo :focus-visible, .hero :focus-visible, .rodape :focus-visible { outline-color: var(--creme); }

.pular {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  padding: .75rem 1rem; background: var(--verde); color: var(--creme);
  transition: top 160ms var(--ease-out);
}
.pular:focus { top: 1rem; }

/* ---------- tipografia de sistema ---------- */
.rotulo {
  font-size: .75rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--verde); margin-bottom: 1.25rem;
}
.rotulo--claro { color: var(--creme-suave); }
.titulo {
  font-size: clamp(2rem, 1.2rem + 2.6vw, 3.25rem);
  line-height: 1.08; color: var(--verde); max-width: 20ch; text-wrap: balance;
}
.titulo--claro { color: var(--creme); }
.pendente {
  font-family: var(--serif); font-style: italic; font-size: 1.05em;
  color: var(--texto-suave);
}
.metodo .pendente, .hero .pendente, .rodape .pendente { color: var(--creme-suave); }
/* linha secundária dentro de um <dd> (complemento de endereço, nome do inscrito): mesma família, peso menor */
.linha-fina { display: block; margin-top: .3rem; font-size: .85rem; line-height: 1.45; color: var(--texto-suave); }
/* a faixa de credenciais fica sobre fundo creme sólido dentro do hero: precisa reverter para a cor escura, senão herda o creme-suave do hero e some (contraste ~1:1) */
.credenciais .pendente { color: var(--texto-suave); }

/* ---------- botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .75rem;
  min-height: 3.25rem; padding: .85rem 1.6rem; border-radius: var(--raio);
  font-weight: 500; letter-spacing: .01em; border: 1px solid transparent;
  transition: background-color 180ms var(--ease-out), color 180ms var(--ease-out), border-color 180ms var(--ease-out), transform 160ms var(--ease-out);
}
.botao:active { transform: scale(.97); }
.botao--creme { background: var(--creme); color: var(--verde); }
.botao--verde { background: var(--verde); color: var(--creme); }
.botao--fantasma { color: var(--creme); border-color: rgba(236, 231, 218, .45); }
.botao--linha { color: var(--verde); border-color: var(--verde); min-height: 2.75rem; padding: .5rem 1.1rem; font-size: .95rem; }
@media (hover: hover) and (pointer: fine) {
  .botao--creme:hover { background: #fff; }
  .botao--verde:hover { background: var(--verde-fundo); }
  .botao--fantasma:hover { border-color: var(--creme); background: rgba(236, 231, 218, .08); }
  .botao--linha:hover { background: var(--verde); color: var(--creme); }
}

/* ---------- monograma ---------- */
.rodape__logo { width: auto; height: 3rem; filter: brightness(0) invert(1); margin-bottom: 1.25rem; }

/* ---------- topo ---------- */
.topo {
  position: fixed; inset-inline: 0; top: 0; z-index: 50;
  padding-block: 1rem;
  color: var(--creme);
  transition: background-color 220ms var(--ease-out), color 220ms var(--ease-out), box-shadow 220ms var(--ease-out), padding 220ms var(--ease-out);
}
.topo__linha { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.topo__marca { display: inline-flex; align-items: center; }
.topo__logo { width: auto; height: 2.3rem; display: block; filter: brightness(0) invert(1); transition: filter 220ms var(--ease-out); }
/* 5 seções no menu: o intervalo passa a ser elástico para caber em 1024px sem quebrar linha */
.topo__nav { display: none; gap: clamp(1rem, 2.2vw, 2rem); font-size: .95rem; }
.topo__nav a { position: relative; padding-block: .25rem; white-space: nowrap; }
.topo__nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: left;
  transition: transform 220ms var(--ease-out);
}
@media (hover: hover) { .topo__nav a:hover::after { transform: scaleX(1); } }

.topo--solido { background: var(--creme); color: var(--verde); box-shadow: 0 1px 0 var(--linha); padding-block: .65rem; }
.topo--solido .topo__logo { filter: none; }

@media (min-width: 64rem) { .topo__nav { display: flex; } }

/* ---------- hero ---------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end;
  color: var(--creme); background: var(--verde-fundo);
}
.hero__fundo { position: absolute; inset: 0; z-index: -1; }
.hero__video { width: 100%; height: 100%; object-fit: cover; object-position: 70% center; opacity: 0; transition: opacity 600ms var(--ease-out); }
.hero__video.pronto { opacity: 1; }
.hero__video:not(.pronto) + .hero__veu::before {
  content: ""; position: absolute; inset: 0; background: url("../midia/hero-poster.jpg") center/cover no-repeat; z-index: -1;
}
/* véu localizado: forte atrás do texto (esquerda/baixo), leve no resto; tom de marca por cima do frame */
.hero__veu {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(24, 44, 33, .88) 0%, rgba(24, 44, 33, .62) 45%, rgba(24, 44, 33, .28) 100%),
    linear-gradient(180deg, rgba(24, 44, 33, .35) 0%, rgba(24, 44, 33, 0) 35%, rgba(24, 44, 33, .55) 100%);
}
.hero__conteudo { padding-block: 9rem 4rem; flex: 1; display: flex; flex-direction: column; justify-content: center; }
.hero__titulo {
  font-size: clamp(2.6rem, 1.4rem + 5.4vw, 5.4rem);
  line-height: 1.02; letter-spacing: -0.028em; max-width: 14ch; color: var(--creme);
}
.hero__titulo .linha { display: block; }
.hero__titulo em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: -0.01em; }
.hero__texto { max-width: 34rem; margin-top: 1.75rem; font-size: clamp(1.05rem, .95rem + .4vw, 1.25rem); color: var(--creme-suave); line-height: 1.55; }
.hero__acoes { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.5rem; }

.credenciais { background: var(--creme); color: var(--verde); border-top: 1px solid var(--linha); }
.credenciais__lista { display: grid; grid-template-columns: repeat(2, 1fr); }
.credenciais__lista > div { padding: 1.1rem 0; border-bottom: 1px solid var(--linha); }
.credenciais__lista > div:nth-child(odd) { padding-right: 1rem; border-right: 1px solid var(--linha); }
.credenciais__lista > div:nth-child(even) { padding-left: 1rem; }
.credenciais__lista > div:nth-last-child(-n+2) { border-bottom: 0; }
.credenciais dt { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--texto-suave); }
.credenciais dd { margin-top: .3rem; font-size: 1.05rem; }
@media (min-width: 48rem) {
  .credenciais__lista { grid-template-columns: repeat(4, 1fr); }
  .credenciais__lista > div { padding: 1.5rem 1.5rem; border-bottom: 0 !important; border-right: 1px solid var(--linha); }
  .credenciais__lista > div:first-child { padding-left: 0; }
  .credenciais__lista > div:last-child { border-right: 0; padding-right: 0; }
  .credenciais__lista > div:nth-child(even) { padding-left: 1.5rem; }
}

/* ---------- método (bloco sólido de marca) ---------- */
.metodo { background: var(--verde); color: var(--creme); padding-block: var(--secao); }
.metodo__cabeca { max-width: 44rem; }
.metodo__intro { margin-top: 1.5rem; color: var(--creme-suave); max-width: 36rem; }
.etapas {
  list-style: none; display: grid; gap: 0; margin-top: clamp(3rem, 6vw, 5rem);
  border-top: 1px solid var(--linha-clara);
}
.etapa { padding: 2.25rem 0; border-bottom: 1px solid var(--linha-clara); display: grid; grid-template-columns: 4.5rem 1fr; column-gap: 1rem; }
.etapa__numero {
  font-family: var(--serif); font-style: italic; font-size: clamp(3.5rem, 7vw, 6rem); line-height: .85;
  color: var(--creme); grid-row: span 2; align-self: start; margin-top: .1em;
}
.etapa__titulo { font-size: 1.35rem; color: var(--creme); }
.etapa p { margin-top: .75rem; color: var(--creme-suave); max-width: 32rem; }
@media (min-width: 60rem) {
  .etapas { grid-template-columns: repeat(3, 1fr); border-top: 0; }
  .etapa { grid-template-columns: 1fr; padding: 0 2.5rem 0 0; border-bottom: 0; border-left: 1px solid var(--linha-clara); padding-left: 2rem; }
  .etapa:first-child { border-left: 0; padding-left: 0; }
  .etapa__numero { grid-row: auto; margin-bottom: 2rem; }
}

/* ---------- áreas ---------- */
.areas { padding-block: var(--secao); }
.areas__cabeca { max-width: 44rem; }
.areas__intro { margin-top: 1.5rem; color: var(--texto-suave); max-width: 34rem; }
.cartoes {
  display: grid; gap: 1px; margin-top: clamp(3rem, 6vw, 4.5rem);
  background: var(--linha); border: 1px solid var(--linha);
}
.cartao {
  position: relative; background: var(--gelo); padding: 2rem;
  display: flex; flex-direction: column; overflow: hidden;
  transition: background-color 260ms var(--ease-out), color 260ms var(--ease-out);
}
.cartao__titulo { font-size: 1.4rem; color: var(--verde); line-height: 1.15; transition: color 260ms var(--ease-out); }
.cartao__resumo { margin-top: .9rem; color: var(--texto-suave); transition: color 260ms var(--ease-out); }
.cartao__itens { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--linha); font-size: .95rem; color: var(--texto-suave); display: grid; gap: .45rem; transition: color 260ms var(--ease-out), border-color 260ms var(--ease-out); }
.cartao__itens li { padding-left: 1.1rem; position: relative; }
.cartao__itens li::before { content: ""; position: absolute; left: 0; top: .72em; width: .45rem; height: 1px; background: currentColor; }
.cartao__cta {
  margin-top: auto; padding-top: 1.75rem; display: inline-flex; align-items: center; gap: .6rem;
  font-weight: 500; color: var(--verde); transition: color 260ms var(--ease-out);
}
.cartao__cta span { transition: transform 220ms var(--ease-out); }
.cartao--nota { background: var(--creme); justify-content: space-between; }
.cartao--nota .cartao__resumo { font-family: var(--serif); font-style: italic; font-size: 1.35rem; line-height: 1.3; color: var(--verde); }
@media (hover: hover) and (pointer: fine) {
  .cartao:not(.cartao--nota):hover { background: var(--verde); color: var(--creme); }
  .cartao:not(.cartao--nota):hover .cartao__titulo,
  .cartao:not(.cartao--nota):hover .cartao__cta { color: var(--creme); }
  .cartao:not(.cartao--nota):hover .cartao__resumo,
  .cartao:not(.cartao--nota):hover .cartao__itens { color: var(--creme-suave); border-color: var(--linha-clara); }
  .cartao:hover .cartao__cta span { transform: translateX(4px); }
}
/* paridade de teclado: quem navega por Tab recebe o mesmo realce de cor que o hover de mouse, não só o deslocamento da seta */
.cartao:not(.cartao--nota):focus-within { background: var(--verde); color: var(--creme); }
.cartao:not(.cartao--nota):focus-within .cartao__titulo,
.cartao:not(.cartao--nota):focus-within .cartao__cta { color: var(--creme); }
.cartao:not(.cartao--nota):focus-within .cartao__resumo,
.cartao:not(.cartao--nota):focus-within .cartao__itens { color: var(--creme-suave); border-color: var(--linha-clara); }
.cartao:focus-within .cartao__cta span { transform: translateX(4px); }
@media (min-width: 40rem) { .cartoes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .cartoes { grid-template-columns: repeat(3, 1fr); } .cartao { padding: 2.5rem; } }

/* lista completa de áreas: expansão discreta, reaproveita .acordeao da seção de perguntas */
.areas__completa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.lista-areas { display: grid; gap: 1.75rem 2.5rem; padding-block: .5rem 1rem; }
.lista-areas h4 { margin: 0; font-size: 1.02rem; font-weight: 500; letter-spacing: -0.01em; color: var(--verde); line-height: 1.3; }
.lista-areas p { margin-top: .4rem; font-size: .9rem; line-height: 1.55; color: var(--texto-suave); }
@media (min-width: 48rem) { .lista-areas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* fechamento da seção: Brasília como base + porta de entrada para quem não sabe classificar o caso */
/* sem régua própria: a borda inferior do acordeão logo acima já faz a separação */
.areas__base { margin-top: clamp(2.5rem, 5vw, 3.5rem); display: grid; gap: 2rem; }
.areas__base-titulo { font-size: 1.15rem; color: var(--verde); }
.areas__base-texto p { margin-top: .75rem; color: var(--texto-suave); max-width: 40rem; }
.areas__base-nota { font-family: var(--serif); font-style: italic; font-size: 1.3rem; line-height: 1.35; color: var(--verde); max-width: 24rem; }
.areas__base-nota .cartao__cta { display: flex; width: fit-content; font-family: var(--sans); font-style: normal; font-size: 1rem; padding-top: .9rem; }
@media (min-width: 60rem) { .areas__base { grid-template-columns: 3fr 2fr; gap: 4rem; align-items: start; } }

/* ---------- para advogados e escritórios ---------- */
/* mesma grade 2fr/3fr das seções institucionais; fundo gelo apenas para marcar que é outra porta de entrada */
.advogados { padding-block: var(--secao); background: var(--gelo); border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
.advogados__grade { display: grid; gap: 2.5rem; }
.advogados__texto > p { max-width: 38rem; }
.advogados__complemento { margin-top: 1.25rem; color: var(--texto-suave); }
.advogados__itens { max-width: 38rem; }
.advogados__acao { margin-top: 2.25rem; }
@media (min-width: 40rem) { .advogados__itens { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; } }
@media (min-width: 60rem) { .advogados__grade { grid-template-columns: 2fr 3fr; gap: 5rem; align-items: start; } }

/* ---------- quem responde ---------- */
.quem { padding-block: var(--secao); border-top: 1px solid var(--linha); }
.quem__grade { display: grid; gap: 3rem; }
.quem__marca { display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; }
.quem__logo { width: auto; height: clamp(10rem, 21vw, 15.5rem); }
.quem__foto { width: 100%; max-width: 22rem; aspect-ratio: 1 / 1; object-fit: cover; border-radius: .5rem; }
.quem__legenda { font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--texto-suave); }
.quem__dados { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1.25rem 2rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--linha); }
.quem__dados dt { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--texto-suave); }
.quem__dados dd { margin-top: .3rem; color: var(--verde); }
.quem__bio { margin-top: 1.5rem; max-width: 36rem; }
.quem__sigilo { margin-top: 1.5rem; max-width: 36rem; color: var(--texto-suave); }
.quem__subtitulo { margin-top: 3rem; font-size: 1.25rem; color: var(--verde); }
.compromissos { margin-top: 1.25rem; display: grid; gap: .85rem; max-width: 36rem; }
.compromissos li { position: relative; padding-left: 1.75rem; }
.compromissos li::before {
  content: ""; position: absolute; left: 0; top: .78em; width: 1rem; height: 1px; background: var(--verde);
}
.quem__nota { margin-top: 2.25rem; max-width: 36rem; color: var(--texto-suave); font-size: .95rem; padding-left: 1.25rem; border-left: 2px solid var(--verde); }
@media (min-width: 60rem) {
  .quem__grade { grid-template-columns: 2fr 3fr; gap: 5rem; align-items: start; }
  .quem__marca { position: sticky; top: 7rem; }
}

/* ---------- perguntas ---------- */
/* seção auxiliar (3 perguntas curtas): ritmo mais compacto que --secao de propósito, para não pesar igual às seções de prova */
.perguntas { padding-block: clamp(4rem, 8vw, 7rem); border-top: 1px solid var(--linha); }
.perguntas__grade { display: grid; gap: 2.5rem; }
.acordeao { border-top: 1px solid var(--linha); }
.acordeao__item { border-bottom: 1px solid var(--linha); }
.acordeao__item summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  padding: 1.35rem 0;
}
.acordeao__item summary::-webkit-details-marker { display: none; }
.acordeao__item h3 { font-size: 1.2rem; color: var(--verde); font-weight: 500; }
.acordeao__sinal { position: relative; flex: 0 0 1.25rem; height: 1.25rem; }
.acordeao__sinal::before, .acordeao__sinal::after {
  content: ""; position: absolute; inset: 50% auto auto 50%; background: var(--verde);
  transform: translate(-50%, -50%); transition: transform 220ms var(--ease-out);
}
.acordeao__sinal::before { width: 1.25rem; height: 1px; }
.acordeao__sinal::after { width: 1px; height: 1.25rem; }
.acordeao__item[open] .acordeao__sinal::after { transform: translate(-50%, -50%) scaleY(0); }
.acordeao__corpo { padding: 0 0 1.5rem; max-width: 40rem; color: var(--texto-suave); }
/* variante usada pela lista completa de áreas, que precisa da largura toda do container */
.acordeao__corpo--largo { max-width: none; }
@media (min-width: 60rem) { .perguntas__grade { grid-template-columns: 2fr 3fr; gap: 5rem; } }

/* ---------- contato ---------- */
/* seção de fechamento (único pedido da página): respiro maior que --secao de propósito, para marcar o ponto de chegada */
.contato { padding-block: clamp(6rem, 13vw, 11rem); background: var(--gelo); border-top: 1px solid var(--linha); }
.contato__grade { display: grid; gap: 3rem; }
.contato__apoio { margin-top: 1.5rem; max-width: 30rem; color: var(--texto-suave); }
.contato__canais { margin-top: 2.5rem; display: grid; gap: 1.25rem; padding-top: 1.5rem; border-top: 1px solid var(--linha); max-width: 30rem; }
.contato__canais dt { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--texto-suave); }
.contato__canais dd { margin-top: .3rem; color: var(--verde); }
/* telefone e e-mail viram links: sublinhado fino apenas para sinalizar que são clicáveis */
.contato__canais a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: rgba(31, 56, 41, .35); transition: text-decoration-color 160ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .contato__canais a:hover { text-decoration-color: var(--verde); } }

.formulario { display: grid; gap: 1.5rem; background: var(--creme); padding: clamp(1.5rem, 4vw, 2.75rem); border: 1px solid var(--linha); }
.campo { display: grid; gap: .5rem; }
.campo label { font-size: .9rem; color: var(--verde); font-weight: 500; }
.campo__dica { font-weight: 400; color: var(--texto-suave); }
.campo input, .campo select, .campo textarea {
  width: 100%; padding: .85rem 1rem; background: var(--gelo); border: 1px solid var(--linha); border-radius: var(--raio);
  transition: border-color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);
}
.campo textarea { resize: vertical; min-height: 7rem; }
.campo select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--verde) 50%), linear-gradient(135deg, var(--verde) 50%, transparent 50%); background-position: calc(100% - 1.3rem) 50%, calc(100% - 1rem) 50%; background-size: .3rem .3rem; background-repeat: no-repeat; padding-right: 2.5rem; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(31, 56, 41, .15); }
.campo.campo--erro input, .campo.campo--erro select, .campo.campo--erro textarea { border-color: var(--erro); }
.campo__erro { font-size: .85rem; color: var(--erro); min-height: 1.2em; }
.campo__erro:empty { display: none; }
.formulario__enviar { width: 100%; min-height: 3.75rem; font-size: 1.05rem; }
.contato__texto .titulo { font-size: clamp(1.75rem, 1.1rem + 1.9vw, 2.6rem); max-width: 18ch; }
.formulario__estado { font-size: .95rem; color: var(--verde); }
.formulario__estado:empty { display: none; }
.formulario__estado.estado--erro { color: var(--erro); }
.formulario__privacidade { font-size: .85rem; color: var(--texto-suave); }
@media (min-width: 60rem) { .contato__grade { grid-template-columns: 2fr 3fr; gap: 5rem; align-items: start; } }

/* ---------- rodapé ---------- */
.rodape { background: var(--grafite); color: var(--creme); padding-block: 4rem 2.5rem; }
.rodape__grade { display: grid; gap: 2.5rem; }
.rodape__linha { margin-top: .35rem; font-size: .9rem; color: var(--creme-suave); }
.rodape__coluna { display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; }
.rodape__nav { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; font-size: .95rem; }
.rodape__nav a { opacity: .85; transition: opacity 160ms var(--ease-out); }
.rodape__nav a:hover { opacity: 1; }
.rodape__etica { font-size: .8rem; color: var(--creme-suave); max-width: 44rem; padding-top: 2rem; border-top: 1px solid rgba(236, 231, 218, .15); }
@media (min-width: 60rem) {
  .rodape__grade { grid-template-columns: 1fr auto; }
  .rodape__etica { grid-column: 1 / -1; }
  .rodape__coluna { align-items: flex-end; text-align: right; }
  .rodape__coluna .rodape__nav { justify-content: flex-end; }
}

/* ---------- movimento ---------- */
[data-reveal] { opacity: 0; transform: translateY(24px); }
html.sem-js [data-reveal], html.movimento-reduzido [data-reveal] { opacity: 1; transform: none; }
[data-hero] { opacity: 0; transform: translateY(18px); }
html.sem-js [data-hero], html.movimento-reduzido [data-hero] { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
  .hero__video { display: none; }
  .hero__veu::before { content: ""; position: absolute; inset: 0; background: url("../midia/hero-poster.jpg") center/cover no-repeat; z-index: -1; }
  [data-reveal], [data-hero] { opacity: 1; transform: none; }
}