/**
 * legal.css — las 3 paginas legales (aviso legal, politica de privacidad,
 * politica de cookies). Plantilla `template-legal.php`, clase de cuerpo
 * `sat-silo-legal`.
 *
 * REGLA VERIFICABLE (Paso 6): cero valor hexadecimal ni declaracion de
 * tipografia propia — todo pasa por tokens.css, comentarios incluidos.
 *
 * ── QUE ES ESTA FAMILIA, Y QUE NO ES (19-ago-2026) ─────────────────────────
 *
 * Medidas reales de las tres paginas descargadas hoy con `?nc=`:
 *
 *   aviso-legal             737 palabras   8 H2   2 UL   0 seccion sat-*
 *   politica-de-privacidad  500 palabras   9 H2   2 UL   0 seccion sat-*
 *   politica-de-cookies     427 palabras   4 H2   3 UL   0 seccion sat-*
 *
 * Una pagina legal NO es una pagina de conversion: su unico trabajo es que un
 * texto obligatorio se pueda LEER y ENCONTRAR. Por eso aqui no hay tarjetas,
 * ni bandas de color, ni pictogramas, ni CTA. Lo que si hay es medida de
 * lectura, ritmo entre secciones y jerarquia visible. Todo lo demas seria
 * decoracion que alarga el documento sin ayudar a nadie.
 *
 * SIN INDICE, Y ES UNA DECISION MEDIDA. El documento mas largo son 737
 * palabras: unas tres pantallas. Un indice de contenidos amortiza cuando el
 * lector no puede abarcar el documento haciendo scroll, y aqui si puede.
 * Ponerlo añadiria una pantalla de enlaces antes del texto que el visitante
 * ha venido a leer. Si algun dia una legal pasa holgadamente del millar de
 * palabras, el indice se replantea con el documento delante, no antes.
 *
 * EL PANEL DE DUDAS NO SALE AQUI, y esta comprobado por estructura y no solo
 * por medicion: `sataire_render_panel_dudas()` se invoca UNICAMENTE desde
 * `template-parts/portada.php`, y `template-legal.php` no incluye esa parte
 * de plantilla porque las legales no tienen heroe. Las tres paginas
 * descargadas hoy lo confirman: cero coincidencias de `panel-dudas` en el
 * HTML servido. No hace falta ninguna regla para ocultarlo — no llega a
 * emitirse.
 *
 * POR QUE NINGUNA SECCION ES `sat-*`. El corpus de las legales emite sus
 * secciones con prefijos propios por documento (`legal-*`, `privacidad-*`,
 * `cookies-*`). Eso las deja FUERA de `.sat-cuerpo section[class^="sat-"]`
 * de global.css, que es la regla que da ritmo vertical y filete al resto del
 * sitio. No se corrige el corpus para que encaje en el selector: se le da a
 * esta familia su propio ritmo, atacando `> section` a secas, que es lo
 * unico que los tres prefijos tienen en comun y lo que hara que una cuarta
 * legal con un cuarto prefijo herede el tratamiento sin tocar este archivo.
 */

/* ── ANCHO Y MEDIDA DE LECTURA ─────────────────────────────────────────────
   Las legales no estrechan el CONTENEDOR: redefinen el token que la rejilla
   de `.sat-cuerpo` ya consume. Un `max-width` aqui encogeria la rejilla
   entera y con ella las calles laterales.

   Con esto la columna de contenido pasa de 1360px a 800px y los parrafos
   siguen limitados a `--sat-measure` por `.sat-cuerpo p` de global.css. La
   medida de lectura, que es lo unico que de verdad necesita esta familia, ya
   estaba resuelta antes de hoy y no se toca. */
.sat-silo-legal .entry-content--legal {
  --sat-max-width-content: var(--sat-max-width-narrow);
  padding-block: var(--sat-space-5);
}

/* ── RITMO ENTRE SECCIONES ─────────────────────────────────────────────────
   El problema medido: los ocho bloques del aviso legal se sirven como un
   muro continuo. El unico respiro era `margin-top` en el H2, que separa el
   titulo del parrafo anterior pero no dice DONDE ACABA un apartado y empieza
   el siguiente. En un documento que se consulta a saltos —«que dice de la
   conservacion de datos»— esa frontera es justo lo que el ojo busca.

   Filete arriba y no abajo: asi el ultimo apartado no cierra con una linea
   suelta y no hace falta una regla `:last-of-type` que la retire.

   RELLENO FIJO Y NO `--sat-space-seccion`, a diferencia del resto del sitio.
   Ese token crece con el ancho de VENTANA hasta 96px porque alli la columna
   de contenido crece con el (1360px). Aqui la columna esta clavada en 800px
   a cualquier ancho, asi que un relleno que crece solo estiraria el documento
   sin mejorar el encuadre: mas scroll para el mismo texto. 40px es el minimo
   de ese mismo clamp, o sea el valor que el tema ya considera correcto
   cuando la columna es estrecha. */
.sat-silo-legal .entry-content--legal > section {
  padding-block: var(--sat-space-5);
  border-top: 1px solid var(--sat-color-border);
}
.sat-silo-legal .entry-content--legal > section:first-of-type {
  border-top: 0;
}

/* El margen del H2 queda para los encabezados SUELTOS —los que un documento
   futuro pueda emitir fuera de `<section>`—, y se retira cuando el H2 abre
   una seccion, porque alli el aire ya lo pone el relleno de arriba y sumar
   los dos abriria un hueco del doble. */
.sat-silo-legal .entry-content--legal h2 {
  margin-top: var(--sat-space-5);
}
.sat-silo-legal .entry-content--legal > section > h2:first-child {
  margin-top: 0;
}

/* ── ENTRADILLA ────────────────────────────────────────────────────────────
   Las tres legales traen un `<p class="entradilla">` que resume el documento
   en tres o cuatro lineas. Los siete silos con heroe lo extraen y lo pintan
   como `.sat-portada-sumario`; las legales no tienen heroe, asi que ese
   parrafo se quedaba dentro del cuerpo leyendose EXACTAMENTE igual que el
   articulado. Un resumen que no se distingue del texto que resume no es un
   resumen.

   COPIA DELIBERADA de `.sat-portada-sumario` (global.css). Se copia y no se
   reutiliza la clase porque esa clase la escriben las plantillas al extraer
   el parrafo al heroe, y aqui el parrafo se queda donde el corpus lo dejo:
   pedirle al corpus que cambie de clase para heredar dos declaraciones seria
   mover el problema. Se copia el COLOR unicamente; el `max-width` de alli es
   propio del heroe a dos columnas y aqui manda `--sat-measure`. Ademas
   global.css no es de este grupo de trabajo (se toca en paralelo), asi que
   una regla nueva alli no seria segura. */
.sat-silo-legal .entry-content--legal .entradilla {
  color: var(--sat-color-text-secondary);
  margin-bottom: var(--sat-space-4);
}

/* ── LISTAS ────────────────────────────────────────────────────────────────
   Las siete listas de esta familia no son listas de palabras: cada `<li>` es
   una frase completa que suele arrancar con un `<strong>` a modo de rubrica
   («Gestion del consentimiento:», «Datos de la empresa:»). Sin separacion
   entre items, dos frases largas seguidas se leen como un parrafo con
   topos.

   `padding-left` en la escala para que el topo cuelgue fuera de la columna
   de texto en vez de comerse el sangrado del navegador, que no pertenece a
   ningun token. */
.sat-silo-legal .entry-content--legal > section ul {
  padding-left: var(--sat-space-4);
}
.sat-silo-legal .entry-content--legal > section li {
  margin-block: var(--sat-space-2);
}

/* ── ENLACES DENTRO DEL ARTICULADO ─────────────────────────────────────────
   `a { color: var(--sat-color-brand) }` de global.css distingue el enlace
   SOLO por color. En una pagina de marketing el contexto salva la
   ambiguedad; en un parrafo legal denso, donde el enlace es a menudo la
   referencia cruzada que el visitante ha venido a seguir («... se explica en
   la politica de privacidad»), distinguirlo solo por color falla el criterio
   1.4.1 de WCAG y falla tambien al lector que solo escanea.

   Se subraya unicamente la prosa del articulado. Fuera quedan la miga de
   pan y cualquier enlace de la caja de datos de empresa, que no son texto
   corrido. */
.sat-silo-legal .entry-content--legal > section a {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

/* ── CAJA DE DATOS DE LA EMPRESA ───────────────────────────────────────────
   La emite `template-legal.php` desde business-facts.json, siempre al final.
   ESTO NO ES UNA SECCION DEL DOCUMENTO, ES UNA FICHA: los datos de la
   entidad (razon social, NIF, domicilio, contacto de proteccion de datos) se
   consultan de un vistazo, no se leen en flujo. Por eso lleva fondo teñido y
   por eso se le retira el filete superior del ritmo de arriba: el fondo ya
   la separa, y las dos cosas juntas dibujarian una linea pegada al borde de
   la caja.

   Mismo argumento que global.css documenta para `.sat-alcance`: el relleno
   de una caja es una propiedad de la caja —lo que separa su texto de su
   propio borde— y no del ritmo de la pagina, asi que es simetrico. */
.sat-silo-legal .entry-content--legal > section.legal-empresa-datos {
  background: var(--sat-color-bg-alt);
  border-radius: var(--sat-radius);
  border-top: 0;
  padding: var(--sat-space-4);
  margin-top: var(--sat-space-5);
}
/* Los dos selectores repiten `> section.legal-empresa-datos` en vez de
   acortarse a `.legal-empresa-datos`: la ficha tiene que GANARLE al bloque de
   listas de arriba, cuyo selector vale (0,2,2). Un `.sat-silo-legal
   .legal-empresa-datos ul` valdria (0,2,1) y perderia el pulso pese a ir
   despues, de modo que la ficha habria salido con el sangrado y el topo de
   las listas del articulado, que es justo lo que `list-style: none` y
   `padding: 0` estan aqui para quitar. */
.sat-silo-legal .entry-content--legal > section.legal-empresa-datos ul {
  list-style: none;
  margin: var(--sat-space-2) 0 0;
  padding: 0;
  display: grid;
  gap: var(--sat-space-2);
}
.sat-silo-legal .entry-content--legal > section.legal-empresa-datos li {
  margin-block: 0;
}