/* Poyntia · web v2 · páginas legales y Contacto (17-oct-2026). Dueño: la tarea «legales». Sólo lo cargan las páginas que genera pruebas/legales.py.
   Referencia: Scale (privacy.jpg / scale privacy.mov): índice fijo a la izquierda, columna de texto estrecha, etiqueta pequeña, título grande, «Última actualización», secciones numeradas.
   Estas páginas NO cargan base-v2.css: los tokens (--u, --fs-*) se declaran aquí, ACOTADOS a body.lg-pagina, con las mismas fórmulas.
   Reglas: DM Sans y nada más (ni mono ni versales con espaciado), cifras tabulares, un tamaño sólo sube (cuerpo ≥ 16, navegación y botones ≥ 15, rótulos ≥ 13), azul #2551d6, sin ámbar.
   Idioma: cada página lleva su artículo ES y su artículo EN; se ve el de html[lang] (sin JavaScript, el español). */

.lg-pagina {
  --u: clamp(1px, .068vw, 1.74px);
  --sans: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --azul: #2551d6; --azul-suave: #eef2fd; --azul-linea: #cfd9f7;
  --tinta: #0e0f12; --tinta-2: #565b66; --tinta-3: #6b707a; --linea: #dcdfe4; --gris-2: #f4f4f5;
  --alto-cab: calc(64 * var(--u)); --gut: calc(24 * var(--u));
  --fs-tit: clamp(2.25rem, 9vw, 2.75rem);           /* el título del documento (móvil: 36 px; 44 desde 490) */
  --fs-h2: clamp(1.375rem, 1.6vw, 2.75rem);         /* «1. Responsable del tratamiento»: 23,5 px a 1470 (Scale ≈ 24 a 1443) */
  --fs-lead: clamp(1.125rem, 1.45vw, 2.5rem);
  --fs-body: clamp(1rem, 1.12vw, 1.9rem);
  --fs-ui: clamp(.9375rem, 1.04vw, 1.75rem);
  --fs-sm: clamp(.8125rem, .9vw, 1.5rem);
  --ease-ui: cubic-bezier(.4, 0, .2, 1);
}
@media (min-width: 761px) { .lg-pagina { --fs-tit: max(52px, 4.4vw); } }   /* 64,7 px a 1470 (Scale ≈ 65 a 1443) y crece con la pantalla */

body.lg-pagina { margin: 0; background: #fff; color: var(--tinta); font-family: var(--sans); font-size: var(--fs-body); line-height: 1.5; letter-spacing: -.012em;
  font-synthesis: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-variant-numeric: tabular-nums; overflow-x: clip; }
.lg *, .lg *::before, .lg *::after { box-sizing: border-box; }
html:has(body.lg-pagina) { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* un solo idioma a la vez; lo que falta (CIF, Registro Mercantil) no se ve */
html[lang="es"] .lg [lang="en"], html[lang="en"] .lg [lang="es"] { display: none !important; }
.lg .por-completar, .lg [hidden] { display: none !important; }

/* ── el marco: índice | texto ─────────────────────────────────────────────────────────────────────── */
.lg { padding: calc(var(--alto-cab) + 72 * var(--u)) 0 calc(128 * var(--u)); }
.lg-marco { width: min(100% - 2 * var(--gut), calc(1184 * var(--u))); margin-inline: auto; display: grid;
  grid-template-columns: minmax(0, calc(236 * var(--u))) minmax(0, 1fr); column-gap: calc(120 * var(--u)); align-items: start; }

/* ── índice fijo ─────────────────────────────────────────────────────────────────────────────────────── */
.lg-indice { position: sticky; top: calc(var(--alto-cab) + 32 * var(--u)); max-height: calc(100vh - var(--alto-cab) - 56 * var(--u)); overflow: auto; overscroll-behavior: contain;
  scrollbar-width: thin; padding: 2px 4px 2px 0; }
.lg-desp > summary { display: none; }
.lg-rot { margin: 0 0 calc(18 * var(--u)); font-size: var(--fs-sm); color: var(--tinta-2); letter-spacing: 0; }
.lg-docs, .lg-secs { list-style: none; margin: 0; padding: 0; }
.lg-docs { border-left: 1px solid var(--linea); }
.lg .lg-docs > li > a { position: relative; display: block; padding: calc(9 * var(--u)) 0 calc(9 * var(--u)) calc(16 * var(--u)); font-size: var(--fs-ui); line-height: 1.35;
  color: var(--tinta-3); text-decoration: none; transition: color .2s var(--ease-ui); }
.lg .lg-docs > li > a[aria-current="page"] { color: var(--tinta); }
.lg-docs > li > a[aria-current="page"]::before { content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 2px; background: var(--tinta); }
.lg-secs { counter-reset: lgi; margin: calc(2 * var(--u)) 0 calc(10 * var(--u)); }
.lg .lg-secs a { display: block; padding: calc(5 * var(--u)) 0 calc(5 * var(--u)) calc(30 * var(--u)); font-size: var(--fs-ui); line-height: 1.35; color: var(--tinta-3);
  text-decoration: none; transition: color .2s var(--ease-ui); }
.lg-secs > li:not(.nonum) > a::before { counter-increment: lgi; content: counter(lgi) ". "; font-variant-numeric: proportional-nums; }   /* el número de sección no es un dato: proporcional («11.», no «1 1.») */
.lg .lg-secs a[aria-current="true"] { color: var(--azul); }
@media (hover: hover) { .lg .lg-docs a:hover { color: var(--tinta); } }
.lg-indice :focus-visible { outline: 2px solid var(--azul); outline-offset: -2px; border-radius: 4px; }

/* ── el documento ───────────────────────────────────────────────────────────────────────────────────── */
.lg-doc { min-width: 0; max-width: 44em; transition: opacity .18s var(--ease-ui); }
.lg-doc.lg-sale { opacity: 0; }
.lg-cab { padding-bottom: 0; }
.lg-etq { margin: 0 0 calc(22 * var(--u)); font-size: var(--fs-sm); color: var(--tinta-2); letter-spacing: 0; }
.lg-art h1 { margin: 0; padding-bottom: calc(36 * var(--u)); border-bottom: 1px solid var(--linea); font-size: var(--fs-tit); font-weight: 400; line-height: 1.04;
  letter-spacing: -.03em; text-wrap: balance; overflow-wrap: break-word; hyphens: auto; }
.lg-art h1:focus { outline: none; }
.lg-art h1:focus-visible { outline: 2px solid var(--azul); outline-offset: 6px; border-radius: 4px; }
.lg-fecha { margin: calc(32 * var(--u)) 0 0; color: var(--tinta-2); }
.lg-intro { margin: calc(20 * var(--u)) 0 0; font-size: var(--fs-lead); line-height: 1.6; color: var(--tinta); font-variant-numeric: proportional-nums; }

.lg .doc { counter-reset: lgs; line-height: 1.8; font-variant-numeric: proportional-nums; }   /* en la prosa legal, cifras proporcionales («17 de octubre», «art. 28»: con las tabulares de DM Sans el 1 queda suelto, «1 7»); en tablas y fechas, tabulares */
.lg .doc > section { margin-top: calc(64 * var(--u)); scroll-margin-top: calc(var(--alto-cab) + 32 * var(--u)); }
.lg .doc h2 { margin: 0 0 calc(18 * var(--u)); font-size: var(--fs-h2); font-weight: 400; line-height: 1.25; letter-spacing: -.02em; text-wrap: balance; }
.lg .doc > section:not(.nonum) > h2::before { counter-increment: lgs; content: counter(lgs) ". "; font-variant-numeric: proportional-nums; }
.lg .doc h3 { margin: calc(36 * var(--u)) 0 calc(10 * var(--u)); font-size: var(--fs-lead); font-weight: 500; line-height: 1.35; letter-spacing: -.012em; }
.lg .doc p { margin: 0; }
.lg .doc p + p, .lg .doc ul + p, .lg .doc .wide + p, .lg .doc p + ul, .lg .doc dl + p, .lg .doc .callout + p, .lg .doc .callout + h3, .lg .doc p + .wide, .lg .doc ul + .callout, .lg .doc p + .callout { margin-top: calc(16 * var(--u)); }
.lg .doc ul { margin: calc(12 * var(--u)) 0 0; padding-left: 1.25em; list-style: disc; }
.lg .doc li { margin-top: calc(8 * var(--u)); padding-left: .2em; }
.lg .doc li::marker { color: var(--tinta-3); }
.lg a { color: var(--azul); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.lg .doc strong, .lg .doc b { font-weight: 500; }
.lg .doc em { font-style: normal; }
.lg code { white-space: nowrap; font-family: var(--sans); font-size: .96em; font-variant-numeric: tabular-nums; background: var(--gris-2); padding: .05em .32em; border-radius: calc(4 * var(--u)); }
.lg .small, .lg .nota { font-size: var(--fs-sm); color: var(--tinta-2); line-height: 1.6; }
.lg .big { font-size: var(--fs-lead); font-weight: 500; }
.lg .callout { margin-top: calc(24 * var(--u)); padding: calc(20 * var(--u)) calc(24 * var(--u)); border-radius: calc(14 * var(--u)); background: var(--azul-suave); border: 1px solid var(--azul-linea); }
.lg .callout p + p { margin-top: calc(10 * var(--u)); }

/* «En resumen»: tarjetas */
.lg .cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17em), 1fr)); gap: calc(12 * var(--u)); margin-top: calc(8 * var(--u)); }
.lg .card { padding: calc(20 * var(--u)) calc(20 * var(--u)) calc(22 * var(--u)); border: 1px solid var(--linea); border-radius: calc(14 * var(--u)); line-height: 1.55; }
.lg .card .k { font-size: var(--fs-sm); color: var(--tinta-2); letter-spacing: 0; }
.lg .card h3 { margin: calc(6 * var(--u)) 0 calc(10 * var(--u)); font-size: var(--fs-lead); }
.lg .card p + p { margin-top: 0; }

/* ficha clave → valor */
.lg dl.kv { margin: calc(8 * var(--u)) 0 0; border-top: 1px solid var(--linea); }
.lg dl.kv > div { display: grid; grid-template-columns: minmax(0, 13em) minmax(0, 1fr); gap: calc(16 * var(--u)); padding: calc(12 * var(--u)) 0; border-bottom: 1px solid var(--linea); }
.lg dl.kv dt { color: var(--tinta-2); }
.lg dl.kv dd { margin: 0; overflow-wrap: anywhere; }

/* tablas: legibles en la columna; en móvil, cada fila es una ficha con sus rótulos */
.lg .wide { margin-top: calc(18 * var(--u)); }
.lg .tbl { width: 100%; border-collapse: collapse; line-height: 1.6; }
.lg .tbl td[data-label="Versión"], .lg .tbl td[data-label="Version"], .lg .tbl td[data-label="Fecha"], .lg .tbl td[data-label="Date"], .lg-fecha { font-variant-numeric: tabular-nums; }
.lg .tbl th { text-align: left; font-weight: 500; font-size: var(--fs-sm); color: var(--tinta-2); padding: calc(10 * var(--u)) calc(12 * var(--u)) calc(10 * var(--u)) 0; border-bottom: 1px solid var(--tinta); vertical-align: bottom; }
.lg .tbl td { padding: calc(14 * var(--u)) calc(12 * var(--u)) calc(14 * var(--u)) 0; border-bottom: 1px solid var(--linea); vertical-align: top; overflow-wrap: break-word; }
.lg .tbl td:last-child, .lg .tbl th:last-child { padding-right: 0; }
/* tablas de cuatro columnas (tratamientos, proveedores, cookies): columnas fijas y equilibradas; sin esto «Datos» se come el ancho y «Base jurídica» queda en una tira de 70 px */
.lg .tbl:has(thead th:nth-child(4)) { table-layout: fixed; }
.lg .tbl:has(thead th:nth-child(4)) th:nth-child(1) { width: 22%; } .lg .tbl:has(thead th:nth-child(4)) th:nth-child(2) { width: 32%; } .lg .tbl:has(thead th:nth-child(4)) th:nth-child(3), .lg .tbl:has(thead th:nth-child(4)) th:nth-child(4) { width: 23%; }

/* ── Contacto ─────────────────────────────────────────────────────────────────────────────────────── */
.lg-ct-p { margin: 0; max-width: 34em; font-size: var(--fs-lead); line-height: 1.45; color: var(--tinta-2); }
.lg-correo-r { margin: calc(40 * var(--u)) 0 calc(6 * var(--u)); font-size: var(--fs-sm); color: var(--tinta-2); }
.lg-correo { margin: 0; font-size: var(--fs-h2); line-height: 1.3; }
.lg .lg-correo a { color: var(--tinta); text-decoration-thickness: 1px; }
@media (hover: hover) { .lg .lg-correo a:hover { color: var(--azul); } }
.lg-form { margin-top: calc(64 * var(--u)); padding-top: calc(40 * var(--u)); border-top: 1px solid var(--linea); scroll-margin-top: calc(var(--alto-cab) + 32 * var(--u)); }
.lg-form h2 { margin: 0 0 calc(24 * var(--u)); font-size: var(--fs-h2); font-weight: 400; line-height: 1.25; letter-spacing: -.02em; }
.lg-f { display: grid; gap: calc(16 * var(--u)); }
.lg-f2 { display: grid; grid-template-columns: 1fr 1fr; gap: calc(16 * var(--u)); }
.lg-f label { display: block; margin-bottom: 6px; font-size: var(--fs-sm); color: var(--tinta-2); letter-spacing: 0; }
.lg-f label.req::after { content: " *"; color: var(--azul); }
.lg-f input:not([type=hidden]), .lg-f textarea { width: 100%; min-height: 44px; padding: calc(13 * var(--u)) calc(14 * var(--u)); border: 1px solid #c4c8cf; border-radius: calc(10 * var(--u));
  background: #fff; color: var(--tinta); font: inherit; font-size: var(--fs-body); line-height: 1.4; letter-spacing: inherit; transition: border-color .2s var(--ease-ui); }
.lg-f textarea { min-height: calc(132 * var(--u)); resize: vertical; }
.lg-f input::placeholder, .lg-f textarea::placeholder { color: #8a8f99; }
.lg-f input:focus, .lg-f textarea:focus { outline: 2px solid var(--azul); outline-offset: 1px; border-color: var(--azul); }
.lg-f .falta { border-color: #c2312f; }
.lg-f .trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lg-enviar, .lg-boton { display: inline-flex; align-items: center; justify-content: center; min-height: max(44px, calc(48 * var(--u))); padding: 0 calc(24 * var(--u));
  border-radius: calc(8 * var(--u)); border: 1px solid transparent; font: inherit; font-size: max(16px, calc(var(--fs-ui) * 1.06)); font-weight: 500; line-height: 1;
  letter-spacing: -.01em; cursor: pointer; transition: background .25s var(--ease-ui), border-color .25s var(--ease-ui), color .25s var(--ease-ui); }
.lg-enviar { background: var(--azul-prof); color: #fff; }
.lg-enviar:disabled { opacity: .6; cursor: progress; }
.lg-boton { background: #fff; color: var(--tinta); border-color: var(--linea); }
@media (hover: hover) { .lg-boton:hover { border-color: #9aa0ab; } }
.lg-enviar:focus-visible, .lg-boton:focus-visible { outline: 2px solid var(--azul); outline-offset: 3px; }
.lg-f-msg { margin: 0; font-size: var(--fs-ui); color: var(--tinta); }
.lg-f-msg.mal { color: #b42318; }

/* ── tableta y móvil: una columna; el índice es un desplegable «Contenido» ────────────────────────── */
@media (max-width: 900px) {
  .lg { padding-top: calc(var(--alto-cab) + 28px); }
  .lg-marco { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
  .lg-indice { position: static; max-height: none; overflow: visible; padding: 0; }
  .lg-desp { border: 1px solid var(--linea); border-radius: 12px; }
  .lg-desp > summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 0 16px; font-size: var(--fs-ui); cursor: pointer; list-style: none; }
  .lg-desp > summary::-webkit-details-marker { display: none; }
  .lg-desp > summary::after { content: ""; width: 8px; height: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s var(--ease-ui); }
  .lg-desp[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
  .lg-desp > nav { padding: 4px 16px 16px; }
  .lg .lg-docs > li > a, .lg .lg-secs a { padding-top: 10px; padding-bottom: 10px; }     /* toque ≥ 44 px */
  .lg-doc { max-width: none; }
}
@media (max-width: 720px) {
  .lg .tbl, .lg .tbl tbody, .lg .tbl tr, .lg .tbl td { display: block; width: 100%; }
  .lg .tbl thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .lg .tbl tr { padding: 14px 0; border-bottom: 1px solid var(--linea); }
  .lg .tbl tr:first-child { border-top: 1px solid var(--tinta); }
  .lg .tbl td { padding: 4px 0; border: 0; }
  .lg .tbl td::before { content: attr(data-label); display: block; font-size: var(--fs-sm); color: var(--tinta-2); line-height: 1.5; }
  .lg dl.kv > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lg-f2 { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .lg-doc, .lg-docs a, .lg-secs a, .lg-desp > summary::after, .lg-enviar, .lg-boton { transition: none; }
}

@media print {
  .v2-cab, .v2-pie, .v2-skip, .lg-indice, .lg-form { display: none !important; }
  .lg { padding: 0; }
  .lg-marco { display: block; width: auto; }
  .lg-doc { max-width: none; }
}