/* ============================================================================
   legal.css — documentos legais e institucionais
   Políticas e Condições · Privacidade · Termos de Uso

   Revisão 2026-08-31 (gestor, vendo a página no ar):
     · o título se repetia (o tema já imprime o h1) — o bloco de abertura saiu
     · o índice só aparecia depois da primeira seção — agora acompanha desde o topo
     · a coluna de texto era estreita demais — foi alargada
     · "muitos apetrechos e design que dificultam a leitura" — cartões coloridos,
       números gigantes e caixas de destaque saíram. Documento legal se lê de cima
       a baixo, não se escaneia como página de venda.
     · tom mais formal

   O que sobra é o essencial: hierarquia clara, respiro entre blocos, índice para
   navegar e texto justificado com boa medida de linha.
   ========================================================================= */

.ark-legal {
  --legal-texto: #23262A;
  --legal-suave: #5F6570;
  --legal-linha: #E4E6E9;
  font-family: var(--font-body, 'Inter', system-ui, sans-serif);
  color: var(--legal-texto);
  font-size: 1rem;
  line-height: 1.72;
}

/* ---- abertura discreta: só o resumo e a data (o h1 vem do tema) ---- */
.ark-legal__intro {
  max-width: 44rem;
  margin: -.35rem 0 2.25rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--legal-linha);
}
.ark-legal__intro p { margin: 0 0 .7rem; color: var(--legal-suave); font-size: 1.02rem; line-height: 1.6; }
.ark-legal__intro time { font-size: .82rem; color: #8B9096; }

/* o cabeçalho antigo (título repetido) não é mais usado */
.ark-legal__hero { display: none; }

/* ---- duas colunas: índice + texto ---- */
.ark-doc__wrap { display: block; }
@media (min-width: 64rem) {
  .ark-doc__wrap {
    display: grid;
    grid-template-columns: 14rem minmax(0, 1fr);
    gap: 4rem;
    align-items: start;
  }
}

/* ---- índice ---- */
/* o cabeçalho do site é fixo: o índice precisa parar ABAIXO dele.
   --header-height-total é a variável do próprio tema (base.css), então o índice
   acompanha qualquer mudança futura de altura do cabeçalho. */
.ark-doc__indice {
  position: sticky;
  top: calc(var(--header-height-total, 160px) + 1.5rem);
  max-height: calc(100vh - var(--header-height-total, 160px) - 3rem);
  overflow-y: auto;
}
.ark-doc__indice h2 {
  font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: #8B9096; margin: 0 0 .8rem; padding: 0; border: 0;
}
.ark-doc__indice ol { list-style: none; margin: 0; padding: 0; counter-reset: sec; }
.ark-doc__indice li { counter-increment: sec; margin: 0; padding: 0; }
.ark-doc__indice li::before { content: none; }
.ark-doc__indice a {
  display: block; padding: .45rem 0 .45rem 1.6rem; position: relative;
  font-size: .875rem; line-height: 1.4; color: var(--legal-suave); text-decoration: none;
  border-left: 2px solid var(--legal-linha);
  transition: color .15s, border-color .15s;
}
.ark-doc__indice a::before {
  content: counter(sec) "."; position: absolute; left: .7rem; top: .45rem;
  font-size: .8rem; color: #A8ADB4;
}
.ark-doc__indice a:hover { color: var(--legal-texto); }
.ark-doc__indice a.is-atual { color: var(--legal-texto); font-weight: 600; border-left-color: var(--legal-texto); }
.ark-doc__indice a.is-atual::before { color: var(--legal-texto); }

/* índice recolhível no celular */
.ark-doc__indice-mob { display: block; margin: 0 0 2rem; }
.ark-doc__indice-mob summary {
  cursor: pointer; list-style: none; padding: .75rem 1rem;
  border: 1px solid var(--legal-linha); border-radius: .3rem;
  font-size: .9rem; font-weight: 600; display: flex; justify-content: space-between;
}
.ark-doc__indice-mob summary::-webkit-details-marker { display: none; }
.ark-doc__indice-mob summary::after { content: "▾"; color: #8B9096; }
.ark-doc__indice-mob[open] summary::after { content: "▴"; }
.ark-doc__indice-mob ol { margin: .7rem 0 0; padding-left: 1.3rem; }
.ark-doc__indice-mob li { margin: .4rem 0; padding: 0; }
.ark-doc__indice-mob li::before { content: none; }
.ark-doc__indice-mob a { font-size: .9rem; color: var(--legal-suave); }
@media (min-width: 64rem) { .ark-doc__indice-mob { display: none; } }
@media (max-width: 63.99rem) { .ark-doc__indice { display: none; } }

/* ---- corpo do documento ---- */
.ark-legal__corpo { max-width: 46rem; }
.ark-legal__corpo p {
  margin: 0 0 1.1rem;
  text-align: justify;
  hyphens: auto; -webkit-hyphens: auto;
}
.ark-legal__corpo strong { font-weight: 600; }
.ark-legal__corpo a { color: var(--legal-texto); text-decoration: underline; text-underline-offset: .15em; }
.ark-legal__corpo a:hover { color: var(--cor-vermelho, #E8001D); }

/* rc921 (gestor 2026-09-01): e-mail em azul, WhatsApp em verde. O leitor identifica o canal
   pela cor antes de ler o texto do link, e os dois se distinguem no meio do parágrafo. */
/* rc927: e-mail e link longo são uma "palavra" indivisível de 25+ caracteres. Quando não
   cabem no fim da linha, vão inteiros para a seguinte e o texto justificado estica a linha
   anterior, abrindo buracos entre as palavras. Permitir a quebra dentro do link resolve
   sem tirar o justificado, que é decisão do gestor. */
.ark-legal__corpo a[href^="mailto:"],
.ark-legal__corpo a[href^="http"] { overflow-wrap: anywhere; }

.ark-legal__corpo a[href^="mailto:"] { color: #1A5FB4; }
.ark-legal__corpo a[href^="mailto:"]:hover { color: #14488A; }
.ark-legal__corpo a[href*="wa.me"] { color: #128C7E; }
.ark-legal__corpo a[href*="wa.me"]:hover { color: #0E6E63; }

.ark-legal__corpo ul, .ark-legal__corpo ol { margin: 0 0 1.25rem; padding-left: 1.4rem; list-style: disc; }
.ark-legal__corpo ol { list-style: decimal; }
.ark-legal__corpo li { margin-bottom: .45rem; padding-left: 0; position: static; text-align: justify; hyphens: auto; }
.ark-legal__corpo li::before { content: none; }

@media (max-width: 36rem) {
  .ark-legal__corpo p, .ark-legal__corpo li { text-align: left; hyphens: none; }
}

/* ---- seções ---- */
/* rc922: o ajuste valia so para as <section>. Os subtitulos com id (#sob-medida,
   #frete-devolucao) ficavam escondidos atras do cabecalho fixo ao serem clicados, e a tela
   parava no texto seguinte — o link parecia levar ao lugar errado. Agora vale para
   qualquer elemento ancoravel do documento. */
.ark-doc__sec,
.ark-legal__corpo [id],
.ark-doc [id] { scroll-margin-top: calc(var(--header-height-total, 160px) + 1rem); }
.ark-doc__sec + .ark-doc__sec { margin-top: 3rem; padding-top: 2.25rem; border-top: 1px solid var(--legal-linha); }
.ark-doc__sec > h2 {
  font-family: var(--font-heading, 'Inter', system-ui, sans-serif);
  font-size: 1.32rem; font-weight: 650; letter-spacing: -.015em;
  margin: 0 0 1.1rem; padding: 0; border: 0; color: var(--legal-texto);
}
.ark-doc__sec h3 {
  font-size: 1.02rem; font-weight: 600; margin: 2rem 0 .6rem; color: var(--legal-texto);
}
.ark-doc__sec-resumo { display: none; }   /* resumo por seção era ruído */

/* ---- ênfase sóbria, no lugar das caixas coloridas ---- */
.ark-legal__destaque {
  margin: 1.35rem 0;
  padding: 0 0 0 1.15rem;
  border: 0;
  border-left: 2px solid var(--legal-texto);
  background: none; border-radius: 0;
}
.ark-legal__destaque p:last-child { margin-bottom: 0; }
.ark-legal__numero { display: inline; font-size: inherit; font-weight: 650; }
.ark-legal__numero + span { color: var(--legal-suave); font-size: inherit; }

/* passos: numeração simples, sem bolinha preta */
.ark-legal__passos { counter-reset: none; list-style: decimal; padding-left: 1.4rem; margin: 1.1rem 0 1.35rem; }
.ark-legal__passos li { counter-increment: none; position: static; padding: 0; margin-bottom: .45rem; }
.ark-legal__passos li::before { content: none; }

/* o que entra / o que não entra: duas listas, sem cartão colorido */
.ark-legal__duas { display: block; margin: 1.1rem 0 1.35rem; }
.ark-legal__card { border: 0; padding: 0; background: none; margin-bottom: 1.35rem; }
.ark-legal__card h4 { margin: 0 0 .5rem; font-size: 1rem; font-weight: 600; color: var(--legal-texto); }
.ark-legal__card--sim h4, .ark-legal__card--nao h4 { color: var(--legal-texto); }
.ark-legal__card ul { list-style: disc; padding-left: 1.4rem; }
.ark-legal__card li::before { content: none; }

/* ---- rodapé do documento ---- */
.ark-legal__ajuda {
  margin-top: 3rem; padding: 1.5rem 0 0;
  border-top: 1px solid var(--legal-linha);
  background: none; text-align: left;
}
.ark-legal__ajuda p { margin: 0 0 .75rem; color: var(--legal-suave); font-size: .95rem; }
.ark-legal__ajuda a {
  display: inline-block; margin: 0 1.25rem 0 0; padding: 0;
  border: 0; border-radius: 0; background: none; color: var(--legal-texto);
  font-size: .9rem; font-weight: 600; text-decoration: underline; text-underline-offset: .15em;
}
.ark-legal__ajuda a:first-of-type { background: none; color: var(--legal-texto); }
.ark-legal__irmas {
  margin-top: 1.75rem; padding-top: 1.25rem;
  border-top: 1px solid var(--legal-linha);
  display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; font-size: .85rem;
}
.ark-legal__irmas span, .ark-legal__irmas a { color: var(--legal-suave); }
.ark-doc__topo { display: none; }   /* o índice fixo já cumpre esse papel */