@charset "UTF-8";

/* ==========================================================================
   PÁGINA · política de privacidade

   Um documento para ser lido, não uma dobra para ser rolada. Aqui não
   existe animação de entrada de propósito: texto jurídico precisa estar
   legível no primeiro quadro, sem depender de JavaScript nenhum.

   Carregado depois de src/css/style.css, então reaproveita os tokens, a
   tipografia, o cabeçalho, o botão e o rodapé do resto do site.
   ========================================================================== */

.doc{
  padding-top: calc(var(--topo-h) + clamp(36px, 6vw, 84px));
  padding-bottom: clamp(60px, 8vw, 110px);
}

.doc__in{
  width: min(880px, 100% - var(--pad) * 2);
}

/* --- capa --- */
.doc__capa{ margin-bottom: clamp(32px, 4vw, 48px); }
.doc__capa .tit{
  font-size: clamp(2.1rem, 1.4rem + 2.6vw, 3.4rem);
  margin-bottom: 14px;
}
.doc__data{
  font-size: .88rem;
  color: var(--tinta-clara);
}

/* --- o resumo em linguagem de gente --- */
.doc__resumo{
  padding: clamp(22px, 3vw, 34px) clamp(22px, 3vw, 36px);
  border-radius: var(--raio);
  background: color-mix(in srgb, var(--lilas-alto) 70%, transparent);
  border: 1px solid rgba(201, 180, 214, .4);
  margin-bottom: clamp(34px, 4.5vw, 52px);
}
.doc__resumo h2{
  font-family: var(--serif);
  font-size: clamp(1.15rem, 1rem + .6vw, 1.4rem);
  color: var(--tit);
  margin-bottom: 10px;
}
.doc__resumo p{ color: var(--tinta); }

/* --- índice --- */
.doc__indice{
  margin-bottom: clamp(40px, 5vw, 60px);
  padding-bottom: clamp(26px, 3vw, 36px);
  border-bottom: 1px solid var(--linha-suave);
}
.doc__indice-tit{
  font-size: .72rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--tit);
  margin-bottom: 16px;
}
.doc__indice ol{
  counter-reset: item;
  columns: 2;
  column-gap: clamp(24px, 4vw, 54px);
}
.doc__indice li{
  counter-increment: item;
  break-inside: avoid;
  margin-bottom: 7px;
}
.doc__indice a{
  font-size: .93rem;
  color: var(--tinta-suave);
  transition: color var(--t-rap) ease;
}
.doc__indice a::before{
  content: counter(item, decimal-leading-zero) " ";
  color: var(--linha);
  font-variant-numeric: tabular-nums;
}
.doc__indice a:hover{ color: var(--tit); }

/* --- corpo --- */
.doc__corpo section{
  margin-bottom: clamp(34px, 4vw, 52px);
  scroll-margin-top: calc(var(--topo-h) + 24px);
}
.doc__corpo section:last-child{ margin-bottom: 0; }

.doc__corpo h2{
  font-family: var(--serif);
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem);
  line-height: 1.2;
  color: var(--tit);
  margin-bottom: 16px;
}
.doc__corpo h3{
  font-size: 1rem;
  font-weight: 600;
  color: var(--tit);
  margin: 22px 0 8px;
}
.doc__corpo p{
  color: var(--tinta-suave);
  margin-bottom: 14px;
  max-width: 68ch;
}
.doc__corpo p:last-child{ margin-bottom: 0; }
.doc__corpo strong{ color: var(--tinta); font-weight: 600; }

.doc__lista{
  margin: 0 0 16px;
  max-width: 68ch;
}
.doc__lista li{
  position: relative;
  padding-left: 22px;
  margin-bottom: 9px;
  color: var(--tinta-suave);
}
.doc__lista li::before{
  content: "";
  position: absolute;
  left: 2px;
  top: .72em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1.2px solid var(--rosa-clara);
}

/* o que a Ana ainda precisa preencher, marcado para não passar batido */
.doc__nota{
  padding: 12px 16px;
  border-left: 2px solid var(--rosa);
  background: color-mix(in srgb, var(--rosa-clara) 16%, transparent);
  border-radius: 0 8px 8px 0;
  font-size: .9rem;
  color: var(--tinta) !important;
}

.doc__corpo .btn{ margin-top: 10px; }

/* --- volta --- */
.doc__volta{
  margin-top: clamp(46px, 6vw, 72px);
  padding-top: clamp(26px, 3vw, 36px);
  border-top: 1px solid var(--linha-suave);
}
.doc__volta .link-seta__s{ transition: transform .45s var(--saida); }
.doc__volta .link-seta:hover .link-seta__s{ transform: translateX(-6px); }

@media (max-width: 620px){
  .doc__indice ol{ columns: 1; }
}