/* prosa.css — Texto largo para leerse: el aviso de privacidad y lo que venga.

   Las hojas del sitio están hechas para secciones cortas con encabezados
   grandes. Un documento legal necesita lo contrario: renglones que no crucen
   toda la pantalla, aire entre párrafos y títulos que ordenen sin gritar. */

.ta-prosa {
    /* Alrededor de 70 caracteres por renglón. Más ancho y el ojo pierde el
       salto de línea justo en un texto que ya cuesta leer. */
    max-width: var(--ancho-texto, 70ch);
    color: var(--ta-texto);
    font-size: var(--txt-base);
    line-height: var(--alto-suelto);
}

.ta-prosa > * + * {
    margin-block-start: var(--esp-4);
}

.ta-prosa h2 {
    /* Los h2 de sección van enormes; aquí ordenan un documento, no anuncian
       una sección de portada. */
    font-size: var(--txt-xl);
    line-height: var(--alto-apretado);
    margin-block-start: var(--esp-7);
    padding-block-start: var(--esp-4);
    border-block-start: 1px solid var(--ta-borde);
}

.ta-prosa h3 {
    font-size: var(--txt-lg);
    line-height: var(--alto-apretado);
    margin-block-start: var(--esp-5);
}

.ta-prosa h2 + p,
.ta-prosa h3 + p {
    margin-block-start: var(--esp-3);
}

.ta-prosa ul {
    margin-block-start: var(--esp-3);
    padding-inline-start: var(--esp-5);
    list-style: disc;
}

.ta-prosa li + li {
    margin-block-start: var(--esp-2);
}

.ta-prosa a {
    color: var(--ta-naranja-honda);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ta-prosa a:hover,
.ta-prosa a:focus-visible {
    color: var(--ta-brasa);
}

.ta-prosa strong {
    font-weight: var(--peso-semi);
}

.ta-prosa code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.9em;
    background: var(--ta-arena);
    padding: 0.15em 0.4em;
    border-radius: var(--radio-sm);
    /* Una URL larga no debe empujar la página a lo ancho en un celular. */
    overflow-wrap: anywhere;
}

.ta-prosa abbr[title] {
    text-decoration: underline dotted;
    cursor: help;
}
