/* Legal documents (terms, privacy). Builds on the article layout from blog.css. */

.legal-head .wrap{max-width:none}
.legal-head h1{max-width:18ch}

.legal-doc{border-top:1px solid var(--line);padding-top:48px}
.legal-doc .prose{font-size:16.5px;line-height:1.7}
.legal-doc .prose p:first-child{font-size:18px}
.legal-doc .prose h2{font-size:25px;margin-top:44px}
.legal-doc .prose h2:first-child{margin-top:0}
.legal-doc .prose li{grid-template-columns:18px 1fr}
.legal-doc .prose li::before{margin-top:10px}
.legal-doc .prose ol{padding-left:0;list-style:none;display:grid;gap:12px}
.legal-doc .prose ol > li{grid-template-columns:44px 1fr}
.legal-doc .prose ol > li::before{content:attr(data-n);width:auto;height:auto;margin:0;background:none;border-radius:0;font:500 13px/1.9 var(--mono);color:var(--leaf);font-variant-numeric:tabular-nums}
.prose code{font:400 14px/1 var(--mono);background:var(--mist);border:1px solid var(--line);border-radius:5px;padding:2px 5px}
/* Placeholders that still need a lawyer or a missing detail; they stay visible until resolved. */
mark.todo{background:var(--saffron-soft);color:var(--saffron-ink);font:500 13px/1.5 var(--mono);border-radius:5px;padding:1px 6px}

.legal-doc .aside{max-height:calc(100vh - 120px);overflow:auto;padding-bottom:4px}
.legal-doc .toc a{font-size:14px;line-height:1.35}
.legal-card{background:var(--mist);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:grid;gap:8px;font-size:15px}
.legal-card b{color:var(--pine)}
.legal-card p{margin:0;color:var(--sage)}
.legal-card a{color:var(--leaf);font-weight:600;text-decoration:none}

@media (max-width:900px){
  .legal-doc .aside{max-height:none;overflow:visible}
}

/* Translations: which language version is legally binding. */
.legal-doc .prose .legal-notice p{font-size:15px}