/* Fontes servidas pelo próprio site (RF-20). Variáveis, subconjunto latin. */
@font-face{font-family:"Newsreader";font-style:normal;font-weight:300 600;font-display:swap;
  src:url("fontes/newsreader.woff2") format("woff2")}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:300 600;font-display:swap;
  src:url("fontes/newsreader-italico.woff2") format("woff2")}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("fontes/schibsted-grotesk.woff2") format("woff2")}

/* Páginas de leitura (privacidade e termos). Herdam os tokens da home.
   Momento próprio: cada cláusula tem ao lado a sua versão "em poucas palavras". */
:root{
  --papel:#F3EDE1;--tinta:#0E1A2D;--claro:#F3EDE1;--luz:#F0B45A;--cobre:#7A4409;
  --bruma-dia:#465064;--bruma-noite:#AAB5C7;
  --f-serifa:"Newsreader",Georgia,"Times New Roman",serif;
  --f-grot:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --t-rotulo:.75rem;--t-nota:.875rem;--t-texto:1.0625rem;
  --d-curta:.2s;--d-media:.6s;--e-saida:cubic-bezier(.16,1,.3,1);--e-luz:cubic-bezier(.4,0,.2,1);
  --g:clamp(20px,4vw,56px);--larg:1320px;--topo-h:60px;
  color-scheme:light;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--topo-h) + 20px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 var(--t-texto)/1.65 var(--f-grot);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--papel)}
::selection{background:var(--luz);color:var(--tinta)}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--acc,var(--cobre));outline-offset:3px;border-radius:2px}

.dia{--fg:var(--tinta);--mut:var(--bruma-dia);--fio:rgba(14,26,45,.22);--acc:var(--cobre);color:var(--fg)}
.noite{--fg:var(--claro);--mut:var(--bruma-noite);--fio:rgba(243,237,225,.2);--acc:var(--luz);color:var(--fg);color-scheme:dark}
.w{max-width:var(--larg);margin-inline:auto;
  padding-left:max(var(--g),env(safe-area-inset-left,0px));padding-right:max(var(--g),env(safe-area-inset-right,0px))}
.rotulo{font:600 var(--t-rotulo)/1.3 var(--f-grot);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.mut{color:var(--mut)}
.num{font-variant-numeric:tabular-nums lining-nums}
.lig{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--acc);
  transition:color var(--d-curta) var(--e-luz)}
.lig:hover{color:var(--acc)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:44px;padding:.6em 1.05em;
  font:600 .9rem/1.1 var(--f-grot);text-decoration:none;background:var(--tinta);color:var(--papel);border:1px solid var(--tinta);border-radius:2px;
  transition:background-color var(--d-curta) var(--e-luz),border-color var(--d-curta) var(--e-luz)}
.btn:hover{background:var(--cobre);border-color:var(--cobre)}

.topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--papel)}
.topo::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:var(--fio)}
.topo .w{display:flex;align-items:center;gap:clamp(12px,2vw,28px);height:var(--topo-h)}
.marca{font:500 clamp(1.05rem,1.5vw,1.3rem)/1 var(--f-serifa);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;margin-right:auto}
.marca em{font-weight:300}
.voltar{font-size:.95rem;white-space:nowrap}

.capa{padding-block:clamp(18px,3vw,40px) clamp(40px,6vw,88px)}
.data-linha{display:flex;flex-wrap:wrap;gap:.2em 1.6em;padding-bottom:clamp(14px,1.6vw,22px);border-bottom:1px solid var(--fio);
  font:600 var(--t-rotulo)/1.5 var(--f-grot);letter-spacing:.12em;text-transform:uppercase}
.data-linha .rascunho{margin-left:auto;color:var(--acc)}
.capa h1{font:400 clamp(2.6rem,8vw,7.25rem)/.96 var(--f-serifa);letter-spacing:-.03em;text-wrap:balance;margin-top:clamp(24px,4.5vw,72px)}
.capa h1 em{font-weight:300}
.essencial{margin-top:clamp(28px,5vw,72px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--fg)}
.essencial li{padding:clamp(16px,1.8vw,24px) clamp(14px,2vw,32px) 0 0;display:grid;gap:.5rem;align-content:start}
.essencial li + li{padding-left:clamp(14px,2vw,32px);border-left:1px solid var(--fio)}
.essencial b{font:400 clamp(1.35rem,2.1vw,1.9rem)/1.12 var(--f-serifa);letter-spacing:-.012em}
.essencial span{color:var(--mut);font-size:1rem;line-height:1.5}

.leitura{padding-block:clamp(24px,4vw,56px) clamp(64px,9vw,130px)}
.leitura .w{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}
.indice{grid-column:1 / span 3;align-self:start;position:sticky;top:calc(var(--topo-h) + env(safe-area-inset-top,0px) + 24px);
  display:grid;gap:.9rem;max-height:calc(100vh - var(--topo-h) - 48px);overflow:auto;padding-right:8px}
.indice ol{display:grid;counter-reset:i;border-top:1px solid var(--fio)}
.indice li{counter-increment:i;border-bottom:1px solid var(--fio)}
.indice a{display:grid;grid-template-columns:2em minmax(0,1fr);padding:.55rem 0;text-decoration:none;font-size:.95rem;line-height:1.35;
  transition:color var(--d-curta) var(--e-luz)}
.indice a::before{content:counter(i);font:400 1rem/1.3 var(--f-serifa);color:var(--mut)}
.indice a:hover{color:var(--acc)}
.clausulas{grid-column:4 / -1;counter-reset:c;min-width:0}
.clausula{counter-increment:c;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:clamp(20px,3vw,56px);row-gap:1.1rem;
  padding-block:clamp(24px,3vw,44px);border-top:1px solid var(--fio)}
.clausula:first-child{border-top-color:var(--fg)}
.clausula h2{grid-column:1 / -1;display:grid;grid-template-columns:1.6em minmax(0,1fr);font:400 clamp(1.6rem,2.6vw,2.4rem)/1.08 var(--f-serifa);letter-spacing:-.016em;text-wrap:balance}
.clausula h2::before{content:counter(c);color:var(--acc);font-variant-numeric:lining-nums}
.texto{display:grid;gap:.9rem;align-content:start;max-width:64ch;min-width:0}
.texto ul{display:grid;gap:.45rem}
.texto li{padding-left:1.2em;position:relative}
.texto li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--acc)}
.texto dl{display:grid;border-top:1px solid var(--fio)}
.texto dl > div{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:.2rem 1rem;padding:.6rem 0;border-bottom:1px solid var(--fio)}
.texto dt{font-weight:600}
.poucas{align-self:start;display:grid;gap:.5rem;padding-left:clamp(14px,1.6vw,22px);border-left:1px solid var(--acc)}
.poucas p:last-child{font:300 italic clamp(1.2rem,1.7vw,1.5rem)/1.25 var(--f-serifa);letter-spacing:-.006em;text-wrap:pretty}
.destaque{grid-column:1 / -1;margin:0;font:300 italic clamp(1.8rem,3.8vw,3.3rem)/1.1 var(--f-serifa);letter-spacing:-.018em;text-wrap:balance;
  padding-block:clamp(8px,1.4vw,20px)}
.marcado{background:rgba(240,180,90,.38);padding:.05em .25em;border-radius:2px}

.rodape{background:linear-gradient(#0E1A2D,#070D18);padding-block:clamp(40px,6vw,80px) clamp(28px,4vw,48px)}
.rodape-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px);font-size:.95rem;line-height:1.5}
.rodape-g > div{display:grid;gap:.5rem;align-content:start}
.rodape-marca{font:400 clamp(1.8rem,3.4vw,2.8rem)/1 var(--f-serifa);letter-spacing:-.02em}
.rodape-marca em{font-weight:300}
.selec{user-select:all}

@media (max-width:899px){
  :root{--topo-h:56px}
  .essencial{grid-template-columns:minmax(0,1fr)}
  .essencial li{padding:16px 0 18px}
  .essencial li + li{padding-left:0;border-left:0;border-top:1px solid var(--fio)}
  .indice{grid-column:1 / -1;position:static;max-height:none;margin-bottom:28px}
  .clausulas{grid-column:1 / -1}
  .clausula{grid-template-columns:minmax(0,1fr)}
  .poucas{order:-1;grid-row:2}
  .clausula h2{grid-row:1}
  .rodape-g{grid-template-columns:repeat(2,minmax(0,1fr))}
  .data-linha .rascunho{margin-left:0}
}
@media (max-width:560px){
  .rodape-g{grid-template-columns:minmax(0,1fr)}
  .voltar span{display:none}
  .topo .btn-longo{font-size:.78rem;line-height:1.15;max-width:9.5em;white-space:normal;text-align:center;padding-left:12px;padding-right:12px}
  .texto dl > div{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important}
}
