/* Long-form legal prose (/privacy/, /terms/).
   Rides on admin-hub.css: the tokens, nav and .sect-* heading block all come
   from there, so these pages pick up the theme switch for free. Only the
   article body needs rules of its own. */

.legal{max-width:780px}
.legal h2{
  font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--tx);
  margin:38px 0 10px;
}
.legal h2:first-child{margin-top:0}
.legal h3{font-size:14px;font-weight:700;color:var(--tx);margin:22px 0 8px}
.legal p,.legal li{font-size:14px;line-height:1.75;color:var(--tx2)}
.legal p{margin-bottom:12px}
.legal ul{margin:0 0 14px 20px}
.legal li{margin-bottom:6px}
.legal b,.legal strong{color:var(--tx);font-weight:700}
.legal a{color:var(--acc);text-decoration:none;font-weight:600}
.legal a:hover{text-decoration:underline}
.legal code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;
  background:var(--bg3);padding:1px 5px;border-radius:4px;color:var(--tx);
}

/* Effective date, sitting under the page heading. */
.legal-date{
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;
  color:var(--tx3);margin-bottom:34px;
}

/* The box that spells out the Google data use, which is the part a reviewer
   looks for. Called out rather than buried in a paragraph. */
.legal-box{
  border:1px solid var(--bd2);border-radius:10px;padding:18px 20px;
  background:var(--bg2);margin:18px 0 26px;
}
.legal-box p:last-child{margin-bottom:0}

/* Only the block for the active language is in the document flow. Long prose
   does not fit in data-pt/data-en attributes, so the page subscribes to the
   same language source every other page uses and swaps whole sections. */
[data-lang-block]{display:none}
[data-lang-block].on{display:block}

@media(max-width:720px){
  .legal h2{margin-top:30px}
}