/* Paginas legais da CDS: hoje a politica de privacidade (/politica-privacidade).
   Carrega depois de cds-blog.css e cds-pages.css e herda deles os tokens, a migalha (.crumbs), o
   rotulo (.eyebrow), o cabecalho (.pg-head) e o rodape.

   Ordem de leitura: onde estou (migalha), o que e (titulo), quando foi atualizada, a introducao,
   e as secoes na ordem de quem le uma politica: quem e o responsavel, o que coletamos, para que
   usamos, com quem dividimos, onde fica, o que o hospede pode pedir. Coluna estreita (68
   caracteres) porque texto juridico em linha longa nao se le. */

.legal-data{margin-top:14px;font-size:.875rem;color:var(--stone-500)}

.legal,.pg-head-legal{max-width:808px}
.legal{margin:0 auto;padding:0 24px 8px}
.legal-intro{margin-top:30px;padding:16px 20px;background:var(--cream-100);border:1px solid var(--beige-dark);
  border-left:3px solid var(--ambar-500);border-radius:0 12px 12px 0;font-size:1rem;color:var(--stone-700)}

.sec-legal{margin-top:46px;scroll-margin-top:92px}
.sec-legal h2{font-family:'DM Serif Display',Georgia,serif;font-weight:400;font-size:clamp(1.5rem,3.2vw,2rem);
  line-height:1.14;color:var(--serra-900);text-wrap:balance;padding-bottom:12px;margin-bottom:16px;
  border-bottom:1px solid var(--beige-dark)}
.sec-legal p{margin:0 0 14px;max-width:68ch;font-size:1rem;line-height:1.75;color:var(--stone-700)}
.sec-legal p:last-child{margin-bottom:0}
.sec-legal strong{color:var(--serra-900);font-weight:600}
.sec-legal a,.legal-intro a{color:var(--serra-800);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--ambar-500);word-break:break-word}
.sec-legal a:hover,.legal-intro a:hover{color:var(--serra-900)}
.sec-legal a:focus-visible{outline:3px solid var(--ambar-600);outline-offset:3px;border-radius:2px}

.sec-legal ul{list-style:none;margin:0 0 16px;padding:0}
.sec-legal li{position:relative;padding:7px 0 7px 22px;font-size:1rem;line-height:1.7;color:var(--stone-700)}
.sec-legal li::before{content:'';position:absolute;left:3px;top:1.05em;width:6px;height:6px;border-radius:50%;
  background:var(--ambar-500)}
.sec-legal table + ul{margin-top:20px}

/* direitos: dois a dois no computador, um por linha no celular */
.sec-legal ul.direitos{display:grid;grid-template-columns:1fr;gap:10px;margin:18px 0}
.sec-legal ul.direitos li{padding:12px 16px;background:var(--cream-100);border:1px solid var(--beige-dark);
  border-radius:12px;font-size:.92rem;line-height:1.55}
.sec-legal ul.direitos li::before{display:none}
@media(min-width:700px){.sec-legal ul.direitos{grid-template-columns:1fr 1fr}}

/* tabelas (dados coletados, finalidade e base legal) */
.tbl-wrap{margin:6px 0 18px;overflow-x:auto;border:1px solid var(--beige-dark);border-radius:14px;background:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th{background:var(--serra-800);color:var(--cream-50);font-size:.74rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;text-align:left;padding:12px 16px}
.tbl td{padding:13px 16px;border-top:1px solid var(--beige-dark);vertical-align:top;line-height:1.6;color:var(--stone-700)}
.tbl tbody tr:first-child td{border-top:0}
.tbl td:first-child{width:30%;font-weight:600;color:var(--serra-900)}
.tbl-base td:first-child{width:auto;font-weight:400;color:var(--stone-700)}
.tbl-base td:last-child{width:30%}
.nw{white-space:nowrap}

/* celular: uma linha da tabela vira um bloco, para a segunda coluna nao ficar com poucas letras */
@media(max-width:640px){
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl thead{display:none}
  .tbl tr{padding:12px 0;border-top:1px solid var(--beige-dark)}
  .tbl tbody tr:first-child{border-top:0}
  .tbl td,.tbl td:first-child,.tbl-base td:last-child{width:100%;border-top:0;padding:3px 16px}
  .tbl td:first-child{padding-bottom:0}
  .tbl-base td:first-child{font-weight:400;padding-bottom:3px}
  .tbl-base td:last-child{font-size:.82rem;color:var(--stone-500)}
  .tbl-base td:last-child::before{content:'Base legal: ';font-weight:600}
}