/* ══════════════════════════════════════════════════════════════════════════════
   LEGALES — Aviso de Privacidad · Términos y Condiciones
   ══════════════════════════════════════════════════════════════════════════════
   Un documento de 15.000 caracteres que alguien tiene que poder LEER. Por eso:
     · una columna de ~68 caracteres (más ancho cansa, más estrecho corta)
     · 17px/1.7 en escritorio — más aire que el copy comercial
     · los h2 con su franja roja, para que la vista encuentre dónde empieza cada
       sección al bajar rápido
     · el índice pegado arriba en escritorio: el original obliga a bajar a ciegas
   ══════════════════════════════════════════════════════════════════════════════ */

.lg-cab{
  background:var(--azul);
  background-image:url("../img/welcome-pattern.png");
  background-size:320px auto; background-blend-mode:soft-light;
  padding-block:clamp(40px,6vw,72px);
}
.lg-titulo{
  font-family:"Oswald",sans-serif; text-transform:uppercase;
  font-size:clamp(30px,4.6vw,54px); font-weight:600; line-height:1.05;
  color:#fff; margin:0; text-shadow:var(--sombra-txt);
}

.lg-cuerpo{
  display:grid; grid-template-columns:250px minmax(0,68ch);
  gap:clamp(28px,5vw,64px); justify-content:center;
  padding-block:clamp(36px,5vw,64px);
  align-items:start;
}

/* ── ÍNDICE ───────────────────────────────────────────────────────────────── */
.lg-indice{
  position:sticky; top:96px;                /* el header mide ~76px + aire */
  background:var(--crema); border-radius:16px; padding:20px 22px;
  border:1px solid rgba(var(--sombra-navy-rgb),.10);
}
.lg-indice__t{
  font-family:"Oswald",sans-serif; text-transform:uppercase; letter-spacing:.1em;
  font-size:12px; font-weight:600; color:var(--rojo); margin:0 0 12px;
}
.lg-indice ol{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:9px}
.lg-indice li{font-size:14px; line-height:1.35}
.lg-indice a{color:var(--azul); text-decoration:none}
.lg-indice a:hover{text-decoration:underline}

/* ── DOCUMENTO ────────────────────────────────────────────────────────────── */
.lg-doc{color:var(--azul)}
.lg-h2{
  font-family:"Oswald",sans-serif; text-transform:uppercase;
  font-size:clamp(20px,2.4vw,27px); line-height:1.2; font-weight:600;
  margin:44px 0 14px; scroll-margin-top:96px;      /* que el ancla no quede bajo el header */
}
.lg-h2:first-child{margin-top:0}
.lg-h2::before{
  content:""; display:block; width:52px; height:4px; border-radius:2px;
  background:var(--rojo); margin-bottom:12px;
}
.lg-h3{
  font-family:"Oswald",sans-serif; text-transform:uppercase;
  font-size:clamp(16px,1.8vw,19px); font-weight:600;
  margin:26px 0 8px; color:var(--rojo);
}
.lg-p{
  font-size:17px; line-height:1.7; margin:0 0 16px;
  text-align:justify; text-wrap:pretty;
}
.lg-lista{margin:0 0 18px; padding-left:22px; display:flex; flex-direction:column; gap:9px}
.lg-lista li{font-size:17px; line-height:1.62; text-wrap:pretty}
.lg-doc a{color:var(--rojo); text-decoration:underline; text-underline-offset:2px}
.lg-doc a:hover{color:var(--rojo-hover)}

.lg-otro{
  grid-column:2; margin:36px 0 0; padding-top:20px;
  border-top:1px solid rgba(var(--sombra-navy-rgb),.14);
}
.lg-otro a{
  font-family:"Oswald",sans-serif; text-transform:uppercase; font-size:14px;
  letter-spacing:.06em; color:var(--azul); text-decoration:none;
}
.lg-otro a::before{content:"← "}
.lg-otro a:hover{color:var(--rojo)}

/* ══════════════════════════════════════════════════════════════════════════════
   📱 NORMA MÓVIL — aire 24 · 15px · 1.55.  Va al final: gana por cascada.
   ══════════════════════════════════════════════════════════════════════════════ */
@media (max-width:900px){
  .lg-cuerpo{grid-template-columns:1fr; gap:24px}

  /* el índice deja de flotar: en móvil sería una columna encima del texto */
  .lg-indice{position:static; padding:16px 18px}
  .lg-indice li{font-size:14px}
  .lg-indice a{display:inline-block; padding-block:4px}   /* 44px de alto táctil con el gap */

  .lg-h2{font-size:20px; margin-top:34px; scroll-margin-top:80px}
  .lg-h3{font-size:16px}
  .lg-p,.lg-lista li{font-size:var(--m-fs); line-height:var(--m-lh)}
  .lg-p{text-align:justify; text-align-last:left}   /* documento legal: sin centrar la última línea */
  .lg-lista{padding-left:20px}
  .lg-otro{grid-column:1}
}