/* Páginas de lectura: /privacidad, /terminos, /codigos (generada por scripts/codes.ts: <header class="legal-header">,
   <main class="legal-page">, secciones con <article id="WA-…">) y la guía de /descargar. La cabecera y los tokens
   están en brand.css. */
.legal-page{width:min(840px,100% - 2*var(--st-gutter));margin:0 auto;padding:clamp(36px,6vw,64px) 0 clamp(56px,8vw,88px);font-size:16px;line-height:1.72}
.legal-page h1{margin:0 0 10px;font-size:clamp(32px,4.6vw,46px);line-height:1.08;letter-spacing:-.03em}
.legal-page h2{margin:46px 0 12px;font-size:clamp(20px,2.2vw,23px);line-height:1.28}
.legal-page h3{margin:0 0 6px;font-size:16.5px;line-height:1.35}
.legal-page :is(p,li){color:var(--st-text-2)}
.legal-page strong{color:var(--st-text);font-weight:600}
.legal-page ul,.legal-page ol{padding-left:22px}
.legal-page li{margin:7px 0}
.legal-page li::marker{color:var(--st-primary-hi)}
.legal-page code{padding:1px 7px;border:1px solid var(--st-border);border-radius:6px;background:var(--st-tint);font:600 .9em/1.5 ui-monospace,Consolas,monospace;color:var(--st-text);overflow-wrap:anywhere}
.legal-page em{color:var(--st-text);font-style:normal;font-weight:600}
.legal-meta{color:var(--st-text-3);font-size:14.5px}
.legal-page>h1+.legal-meta{margin-top:0;padding-bottom:22px;border-bottom:1px solid var(--st-border)}
/* /codigos: cada código es una tarjeta; el ancla (#WA-…) la resalta. El hueco para la cabecera fija lo da
   html{scroll-padding-top} en brand.css (un scroll-margin aquí se sumaba y dejaba el código a 176 px del borde). */
.legal-page article{margin:10px 0;padding:16px 20px;border:1px solid var(--st-border);border-radius:var(--st-r-card);background:linear-gradient(180deg,var(--st-surface-2),var(--st-surface));transition:border-color var(--st-mid),box-shadow var(--st-mid)}
.legal-page article p{margin:6px 0 0}
.legal-page article:target,.legal-page li:target{border-color:rgba(var(--st-primary-rgb),.65);box-shadow:var(--st-focus)}
.legal-page li:target{border-radius:6px}
.draft-banner{margin:20px 0;padding:14px 18px;border:1px solid rgba(var(--st-warning-rgb),.42);border-radius:12px;background:rgba(var(--st-warning-rgb),.10);color:var(--st-text)}
@media (max-width:760px){
  .legal-page{font-size:15.5px}
  .legal-page article{padding:14px 16px}
}