/* ==========================================================================
   legal.css — Politica de privacidad / Aviso Legal / Politica de Cookies
   Página sencilla: header + bloque de texto + footer (ver SPEC §8).
   Usa los tokens y el reset de base.css; enlázalo siempre antes que éste.
   ========================================================================== */

.legal{
  padding-inline:var(--gutter);
  padding-block:6vw 8vw;
  background:var(--blanco);
}

.legal__cuerpo{
  width:60vw;
  max-width:100%;
}

.legal__titulo{
  font-family:var(--font-titular);
  font-weight:700;
  font-size:3.4vw;
  line-height:0.95;
  letter-spacing:-0.03em;
  color:var(--negro);
  margin-bottom:2.6vw;
}

.legal__cuerpo h2{
  font-family:var(--font-base);
  font-weight:600;
  font-size:1.15vw;
  line-height:1.3;
  color:var(--negro);
  margin:2.6vw 0 1vw;
}

.legal__cuerpo h3{
  font-family:var(--font-base);
  font-weight:600;
  font-size:1vw;
  line-height:1.3;
  color:var(--negro);
  margin:1.8vw 0 0.8vw;
}

.legal__cuerpo p{
  font-family:var(--font-base);
  font-weight:600;
  font-size:0.9vw;
  line-height:1.6;
  color:var(--negro);
  margin:0 0 1.1vw;
}

.legal__lista{ margin:0 0 1.2vw; }
.legal__lista li{
  font-family:var(--font-base);
  font-weight:600;
  font-size:0.9vw;
  line-height:1.5;
  color:var(--negro);
  margin:0 0 0.5vw;
}
.legal__lista li:last-child{ margin-bottom:0; }

.legal__cuerpo a{
  color:var(--azul);
  text-decoration:underline;
  word-break:break-word;
}
.legal__cuerpo a:hover{ color:var(--negro); }

/* Bloques "Cookie / Dominio / Descripción / Duración / Tipo" (§2.4 cookies) */
.legal__cookie{
  margin:0 0 1.6vw;
  padding-left:1vw;
  border-left:2px solid var(--negro);
}
.legal__cookie p{ margin:0 0 0.25vw; }
.legal__cookie p:last-child{ margin-bottom:0; }

/* Fragmento "3 / Y BIENESTAR / SALUD" presente en el DOM original de
   politica-de-cookies (comp-m1mnawe3, ver _spec/out/politica-de-cookies.json):
   se conserva literal (regla: sólo entra lo que está en el .md, sin
   corregir ni omitir), con un tratamiento discreto de "sello" para no
   romper la lectura del texto legal que lo rodea. */

@media (max-width:500px){
  .legal{ padding-inline:24px; padding-block:32px 48px; }
  .legal__cuerpo{ width:100%; }
  .legal__titulo{ font-size:34px; line-height:1; margin-bottom:24px; }
  .legal__cuerpo h2{ font-size:17px; margin:28px 0 10px; }
  .legal__cuerpo h3{ font-size:15px; margin:20px 0 8px; }
  .legal__cuerpo p,
  .legal__lista li{ font-size:15px; line-height:1.55; }
}