/* Páginas legales. Una columna, tipografía de lectura y nada más:
   esto se lee, no se navega. */
.legal{max-width:62ch;margin:0 auto;padding:0 0 70px}
.legal .fecha{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 30px}
.legal h2{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:21px;
  letter-spacing:.02em;text-transform:uppercase;margin:42px 0 12px;
  padding-top:22px;border-top:1px solid var(--line)}
.legal h2:first-of-type{border-top:none;padding-top:0;margin-top:26px}
.legal h3{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  margin:26px 0 8px;font-weight:500}
.legal p,.legal li{font-size:16.5px;line-height:1.65}
.legal ul{padding-left:20px;margin:12px 0}
.legal li{margin-bottom:7px}
.legal a{color:var(--accent)}
.legal strong{font-weight:500}

/* Tabla de cookies y almacenamiento: lo importante es que se entienda
   qué se guarda y por qué, no que quepa bonito. */
.legal .tablawrap{overflow-x:auto;margin:16px 0 8px;
  background:var(--surface);border:1px solid var(--line);border-radius:2px}
.legal .tabla{width:100%;min-width:420px;border-collapse:collapse}
.legal .tabla th{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:10px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--muted);text-align:left;
  padding:11px 14px;border-bottom:1px solid var(--line);font-weight:500;white-space:nowrap}
.legal .tabla td{padding:12px 14px;border-bottom:1px solid var(--line);
  font-size:15px;vertical-align:top}
.legal .tabla tr:last-child td,
.legal .tabla tr:last-child th{border-bottom:none}
.legal .tabla code{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12.5px;
  background:var(--ground);padding:2px 6px;border-radius:2px;white-space:nowrap}

/* Lo que el usuario puede hacer aquí mismo */
.legal .accion{background:var(--sunk);border:1px solid var(--line);border-radius:2px;
  padding:20px 22px;margin:20px 0}
.legal .accion p{margin:0 0 14px;font-size:15.5px}
.legal .accion p:last-child{margin-bottom:0}