/* Aviso legal y privacidad (GRA-172). El texto sale de Documentation/web-nueva/legal/; esto solo lo pinta. */
.pag-legal .envoltura{padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(64px,8vw,112px)}
.pag-legal .cab-pag{gap:12px}
.legal-fecha{font:var(--t-nota);color:var(--tinta-suave)}
.legal{max-width:44rem;margin-top:clamp(36px,5vw,56px)}
.legal h2{font:var(--t-titular-3);margin-top:52px;scroll-margin-top:24px;text-wrap:balance}
.legal h2:first-child{margin-top:0}
.legal p,.legal ul,.legal blockquote,.legal-tabla{margin-top:14px}
.legal h2+*{margin-top:12px}
.legal ul{padding-left:1.25em}
.legal li+li,.legal li>ul{margin-top:6px}
.legal li::marker{color:var(--tinta-suave)}
.legal code{font:500 .88em/1 var(--f-mono);padding:2px 5px;border-radius:4px;background:color-mix(in srgb,var(--tinta) 7%,var(--fondo))}

/* Tablas: con cabecera, o de dos columnas (dato y valor) cuando la cabecera va vacía */
.legal-tabla{overflow-x:auto}
.legal table{width:100%;border-collapse:collapse;font-size:.95em}
.legal th,.legal td{text-align:left;vertical-align:top;padding:11px 16px 11px 0;border-bottom:1px solid var(--filete)}
.legal th:last-child,.legal td:last-child{padding-right:0}
.legal thead th{font:var(--t-etiqueta);letter-spacing:var(--ls-etiqueta);text-transform:uppercase;color:var(--tinta-suave);border-bottom-color:var(--tinta)}
.legal .ficha th{width:34%;font-weight:600}

/* La promesa del nivel 1: el aviso rojo delante, como en la portada (/lenguaje, patrones) */
.legal blockquote{margin-left:0;margin-right:0;display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:var(--radio-m);background:color-mix(in srgb,var(--tinta) 4%,var(--fondo))}
.legal blockquote>img{flex:none;width:30px;height:auto;margin-top:3px}
.legal blockquote p{margin:0;font-weight:600}

@media (max-width:560px){
  .legal .ficha th{width:40%}
}