/* Wö Kàpi · privacidad.html (30 de setiembre de 2026)
   Carga después de las hojas del sistema (SISTEMA.md §2). Solo el diseño: el texto de
   privacidad.html lo escribe otro equipo y esta hoja no depende de él más que de sus
   clases (.privacidad, .privacidad-contenedor, -h1, -bajada, -fecha, -seccion, -h2,
   -h3 y -lista).

   Página de lectura (R6): la barra más --aire-lectura arriba y --aire-banda abajo.
   La columna arranca en la línea del logo, como el título de cada página (SISTEMA.md
   §4), y el texto va en la medida de lectura (38rem, unos 68 caracteres). Sin filetes
   entre secciones: el aire de zona las separa. Nada con position absolute, fixed ni
   sticky. */

.privacidad {
  display: block;
  background-color: var(--crema);
  color: var(--tinta);
}

/* La caja de .contenedor */
.privacidad-contenedor {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: calc(var(--ancho) + 2 * var(--margen));
  margin: 0 auto;
  padding: calc(var(--barra-alto) + var(--aire-lectura)) var(--margen) var(--aire-banda);
}
.privacidad-contenedor > * { max-width: var(--medida); }

.privacidad-h1 {
  margin: 0;
  color: inherit;
  font-family: var(--serif);
  font-size: var(--t-pagina);
  font-weight: 700;
  line-height: var(--i-titulo);
  text-wrap: balance;
}
.privacidad-bajada {
  margin: calc(var(--aire-bloque) + 8px) 0 0;
  font-size: var(--t-pieza);
  line-height: 1.45;
  text-wrap: pretty;
}
.privacidad-fecha {
  margin: var(--aire-bloque) 0 0;
  font-size: var(--t-nota);
  line-height: 1.45;
}

.privacidad-seccion {
  margin-top: var(--aire-zona);
  padding-top: 0;
  border-top: 0;
}
.privacidad-h2 {
  margin: 0 0 16px;
  color: inherit;
  font-family: var(--serif);
  font-size: var(--t-seccion);
  font-weight: 700;
  line-height: 1.15;
  text-wrap: balance;
}
.privacidad-h3 {
  margin: var(--aire-bloque) 0 8px;
  color: inherit;
  font-family: var(--serif);
  font-size: var(--t-pieza);
  font-weight: 700;
  line-height: 1.25;
  text-transform: none;
}

/* Los enlaces a #catalogo (desde el formulario del portal) y a cada sección dejan el
   título debajo de la barra fija, con aire. */
.privacidad [id] { scroll-margin-top: calc(var(--barra-alto) + 24px); }

/* :where() deja estas reglas con el peso de un elemento suelto: la bajada y la fecha mandan.
   El interlineado de lectura del sitio (--i-cuerpo, 1,55), el mismo de los artículos. */
:where(.privacidad) p,
:where(.privacidad) li {
  font-size: var(--t-cuerpo);
  line-height: var(--i-cuerpo);
}
:where(.privacidad) p { margin: 0 0 16px; }
.privacidad-lista {
  margin: 0 0 16px;
  padding-left: 1.25em;
}
.privacidad-lista li { margin: 0 0 6px; padding-left: 4px; }

/* Enlaces: los del texto del sistema (subrayado fino, del color del texto). */
:where(.privacidad) a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .22em;
  overflow-wrap: anywhere;
}
:where(.privacidad) a:hover { text-decoration-thickness: 2px; }

/* Enlaces dentro de una frase: 44 px de toque sin mover los renglones, como en eventos,
   contacto y los artículos. La caja de la letra mide 15 px a 17 y 17 a 18
   (14 en .nota, de 16). El relleno va 12 arriba y 17 abajo (11 y 19 en .nota): 44 a 46 de
   alto. Arriba no llega a las letras del renglón anterior (entra 1 a 2 px en su interlineado
   y no en la letra); abajo sí entra en la zona alta del renglón siguiente, pero ese renglón se
   pinta después y un toque ahí le llega a él. 2 px a cada lado, devueltos con un margen
   negativo, llevan una palabra corta («menú») a 44 de ancho. El relleno no se dibuja. */
:where(.privacidad) p a,
:where(.privacidad) li a { padding: 12px 2px 17px; margin: 0 -2px; }
