/* =========================================================
   B2 Rocket Layout — Distribuidora Paris
   doc.css: política de privacidade e termos e condições.

   Documento longo pede duas coisas que o resto do site não pede: índice que
   acompanha a leitura e coluna de texto estreita. Linha longa cansa em
   qualquer página; num texto de dez minutos, faz abandonar.
   ========================================================= */

.brl-doc-topo{
  max-width:var(--paris-larg);
  margin:0 auto;
  padding:clamp(56px, 6vw, 92px) var(--paris-pad) 0;
  text-align:center;
}
.brl-doc-vigencia{
  margin:24px 0 0;
  font-size:var(--rotulo-corpo);
  letter-spacing:var(--rotulo-espaco);
  text-transform:uppercase;
  color:var(--paris-cinza);
  padding-left:var(--rotulo-espaco);
}

.brl-doc{
  display:grid;
  grid-template-columns:minmax(0,250px) minmax(0,1fr);
  gap:clamp(40px, 5vw, 88px);
  max-width:var(--paris-larg);
  margin:clamp(48px, 5vw, 76px) auto 0;
  padding:0 var(--paris-pad);
}

/* ---------- índice ---------- */

.brl-doc-indice{
  position:sticky;
  top:110px;
  align-self:start;
  max-height:calc(100vh - 150px);
  overflow-y:auto;
  scrollbar-width:none;
}
.brl-doc-indice::-webkit-scrollbar{display:none}
.brl-doc-indice-t{
  margin:0 0 18px;
  font-size:var(--rotulo-corpo);
  font-weight:var(--rotulo-peso);
  letter-spacing:var(--rotulo-espaco);
  text-transform:uppercase;
  color:var(--paris-vermelho);
  padding-left:var(--rotulo-espaco);
}
.brl-doc-indice ol{
  list-style:none;
  margin:0;padding:0;
  counter-reset:none;
}
.brl-doc-indice li{margin:0}
.brl-doc-indice a{
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:10px;
  align-items:baseline;
  padding:7px 0;
  font-size:15px;line-height:1.4;
  color:var(--paris-tinta-2);
  transition:color .2s ease;
}
.brl-doc-num{
  font-size:11px;font-weight:600;
  color:var(--paris-cinza);
  transition:color .2s ease;
}
.brl-doc-indice a:hover{color:var(--paris-azul)}
/* A seção que está sendo lida fica azul e com o número em vermelho: dois
   sinais fracos somados valem mais que um forte, e não poluem a coluna. */
.brl-doc-indice a.e-ativo{color:var(--paris-azul);font-weight:600}
.brl-doc-indice a.e-ativo .brl-doc-num{color:var(--paris-vermelho)}

/* ---------- texto ---------- */

.brl-doc-texto{max-width:72ch}
.brl-doc-texto section + section{margin-top:clamp(40px, 4vw, 60px)}
/* O deslocamento evita que o cabeçalho fixo cubra o título ao pular por um
   link do índice. */
.brl-doc-texto section{scroll-margin-top:110px}

.brl-doc-texto h2{
  margin:0 0 20px;
  font-family:var(--fonte-titulo);
  font-size:clamp(24px, 2.4vw, 30px);
  font-weight:600;line-height:1.2;letter-spacing:-.01em;
  color:var(--paris-azul);
}
.brl-doc-texto h2 span{color:var(--paris-marcador)}

.brl-doc-texto h3{
  margin:28px 0 12px;
  font-size:15px;font-weight:600;
  letter-spacing:.02em;
  color:var(--paris-azul);
}
.brl-doc-texto p{
  margin:0 0 16px;
  font-size:16.5px;line-height:1.8;color:var(--paris-tinta-2);
}
.brl-doc-texto ul{
  list-style:none;
  margin:0 0 16px;padding:0;
}
.brl-doc-texto li{
  position:relative;
  margin:0 0 10px;
  padding-left:26px;
  font-size:16.5px;line-height:1.75;color:var(--paris-tinta-2);
}
/* Traço reto no lugar do ponto, como no resto do site. */
.brl-doc-texto li::before{
  content:"";
  position:absolute;left:0;top:.75em;
  width:14px;height:1px;
  background:var(--paris-vermelho);
}
.brl-doc-texto strong{color:var(--paris-azul)}
.brl-doc-texto a{
  color:var(--paris-vermelho);
  border-bottom:1px solid rgba(151,33,32,.35);
  word-break:break-word;
}
.brl-doc-texto a:hover{border-bottom-color:var(--paris-vermelho)}

/* ---------- telas menores ---------- */

@media (max-width:1000px){
  .brl-doc{grid-template-columns:minmax(0,1fr);gap:36px}

  /* O índice deixa de acompanhar e vira um sumário no topo, dobrado em duas
     colunas: no celular, uma barra lateral grudada rouba metade da tela. */
  .brl-doc-indice{
    position:static;
    max-height:none;
    padding-bottom:28px;
    border-bottom:1px solid var(--paris-linha);
  }
  .brl-doc-indice ol{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:0 24px;
  }
  .brl-doc-texto{max-width:none}
}

@media (max-width:620px){
  .brl-doc-indice ol{grid-template-columns:minmax(0,1fr)}
}