/* Páginas legales (privacidad, aviso legal, cookies): solo estiliza el contenido de .lg.
   El ancho y el aire de la página los pone la plantilla (.pg-doc en pages.css: documento de 820px a la derecha).
   Mismas reglas que el resto de la web: Montserrat fina, mayúsculas espaciadas, cuatro tamaños, líneas de 1px
   y alineación a la izquierda. Cada sección abre con una línea fina, su título como etiqueta y su número a la derecha. */
.lg{
  --lg-sec:clamp(56px,7vw,88px);   /* aire antes de cada sección */
  --lg-measure:700px;              /* ancho de lectura de párrafos y listas */
  --lg-line:var(--ox-line);
  color:var(--ox-ink2);text-align:left;counter-reset:lg-sec;
  overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto
}
.lg>*{margin:0;min-width:0}
.lg>*+*{margin-top:20px}

/* Texto */
.lg p,.lg li,.lg td,.lg dd{font-size:var(--t-s);font-weight:300;line-height:2;letter-spacing:.1em;color:var(--ox-ink2)}
.lg>p,.lg>ul,.lg>ol,.lg>h3{max-width:var(--lg-measure)}
.lg b,.lg strong{font-weight:500;color:var(--ox-ink)}
.lg>.lg-lead{color:var(--ox-ink)}

/* Enlaces: subrayado fino */
.lg a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.34em;text-decoration-color:rgba(18,17,16,.32);transition:color .25s,text-decoration-color .25s}
.lg a:hover{color:var(--copper-dk);text-decoration-color:currentColor}
.lg a:focus-visible{outline:2px solid var(--copper);outline-offset:3px;border-radius:2px}
.lg [id]{scroll-margin-top:96px}

/* Secciones: línea fina, título como etiqueta y número a la derecha */
.lg>h2{position:relative;margin-top:var(--lg-sec);padding:22px 3.6em 0 0;border-top:1px solid var(--lg-line);font-size:var(--t-xs);font-weight:500;line-height:1.7;letter-spacing:.28em;color:var(--ox-ink);counter-increment:lg-sec}
.lg>h2:first-child{margin-top:0}
.lg>h2::after{content:counter(lg-sec,decimal-leading-zero);position:absolute;right:0;top:22px;font-weight:400;letter-spacing:.24em;color:var(--ox-mute);font-variant-numeric:tabular-nums}
.lg>h2+*{margin-top:24px}
.lg>h3{margin-top:40px;font-size:var(--t-s);font-weight:500;line-height:1.7;letter-spacing:.14em;color:var(--ox-ink)}
.lg>h3+*{margin-top:10px}

/* Listas: guion fino en cobre */
.lg ul,.lg ol{padding:0;list-style:none}
.lg li{position:relative;padding-left:28px}
.lg li+li{margin-top:10px}
.lg ul>li::before{content:"";position:absolute;left:0;top:1em;width:14px;height:1px;background:var(--copper-dk)}
.lg ol{counter-reset:lg-li}
.lg ol>li{counter-increment:lg-li}
.lg ol>li::before{content:counter(lg-li,decimal-leading-zero);position:absolute;left:0;top:0;font-size:var(--t-xs);font-weight:500;letter-spacing:.2em;color:var(--copper-dk)}

/* Tablas finas (resumen, finalidades, plazos, encargados, almacenamiento) */
.lg-t{width:100%;border-collapse:collapse;border-top:1px solid var(--lg-line)}
.lg-t th,.lg-t td{padding:16px 20px 16px 0;border-bottom:1px solid var(--lg-line);text-align:left;vertical-align:top}
.lg-t th:last-child,.lg-t td:last-child{padding-right:0}
.lg-t th{font-size:var(--t-xs);font-weight:500;line-height:1.8;letter-spacing:.22em;color:var(--ox-mute)}
.lg-t thead th{padding-top:12px;padding-bottom:12px}
.lg-t td{line-height:1.9}
.lg-sum th{width:28%;color:var(--ox-ink)}

/* Datos de la empresa (el build rellena las filas dt/dd) */
.lg-dl{display:grid;grid-template-columns:minmax(120px,28%) minmax(0,1fr);border-top:1px solid var(--lg-line)}
.lg-dl dt,.lg-dl dd{margin:0;padding:14px 0;border-bottom:1px solid var(--lg-line)}
.lg-dl dt{padding-right:20px;font-size:var(--t-xs);font-weight:500;line-height:2.3;letter-spacing:.22em;color:var(--ox-mute)}

/* Botón (como .ox-btn.ox-btn-1) y su estado */
.lg-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:0 28px;border:1px solid var(--ox-ink);border-radius:999px;background:var(--ox-ink);color:#fff;font:inherit;font-size:var(--t-xs);font-weight:500;letter-spacing:.2em;line-height:1.2;white-space:nowrap;cursor:pointer;box-shadow:var(--ox-sh1);transition:transform .25s var(--ease-out),background .25s,color .25s}
.lg-btn:hover{transform:translateY(-1px)}
.lg-btn:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.lg-btn[aria-pressed="true"]{background:transparent;color:var(--ox-ink);box-shadow:none}
.lg-btn:disabled{opacity:.5;cursor:default;transform:none}
.lg p:has(>.lg-btn){display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.lg [data-stats-optout-state]{font-size:var(--t-xs);font-weight:500;letter-spacing:.22em;line-height:1.8;color:var(--ox-mute)}
.lg [data-stats-optout-state]:empty{display:none}

/* Móvil: tablas en fichas, datos de empresa en una columna */
@media (max-width:759px){
  .lg>h2{padding-right:3em}
  .lg-t,.lg-t tbody,.lg-t tr,.lg-t th,.lg-t td{display:block;width:auto}
  .lg-t thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .lg-t tr{padding:16px 0;border-bottom:1px solid var(--lg-line)}
  .lg-t th,.lg-t td{padding:0;border:0}
  .lg-t td+td,.lg-t th+td{margin-top:10px}
  .lg-t td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:var(--t-xs);font-weight:500;letter-spacing:.22em;color:var(--ox-mute)}
  .lg-sum th{width:auto}
  .lg-dl{grid-template-columns:1fr}
  .lg-dl dt{padding:14px 0 0;border:0;line-height:1.8}
  .lg-dl dd{padding:2px 0 14px}
  .lg-btn{white-space:normal;text-align:left}
}

@media print{
  .lg{color:#000}
  .lg a{text-decoration-color:currentColor}
  .lg p:has(>.lg-btn){display:none}
}
