/* ============================================================================
   Páginas legales (términos y privacidad) — lectura cómoda, mobile-first
   ============================================================================ */
.legal{
  max-width:720px;
  margin:0 auto;
  padding:24px 20px calc(56px + env(safe-area-inset-bottom,0px));
  font-size:15px;
  line-height:1.7;
  color:var(--txt);
  animation:screenIn var(--t-slow) var(--ease-out) both;
}
.legal__volver{
  display:inline-block;
  font-size:13.5px;
  margin-bottom:22px;
  color:var(--morado);
}
.legal h1{
  font-size:clamp(28px,7vw,36px);
  line-height:1.1;
}
.legal__fecha{
  font-size:12.5px;
  color:var(--txt-3);
  margin:8px 0 26px;
}
.legal h2{
  font-size:19px;
  margin:34px 0 10px;
  padding-top:20px;
  border-top:1px solid rgba(36,41,43,.12);
}
.legal h2:first-of-type{border-top:0;padding-top:0}
.legal p{margin:0 0 14px;text-wrap:pretty}
.legal ul{margin:0 0 16px;padding-left:22px}
.legal li{margin-bottom:8px}
.legal strong{font-weight:500}
.legal a{color:var(--morado);text-decoration:underline;text-underline-offset:2px}
.legal a:hover{color:var(--morado-hondo)}

.legal__pie{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  margin-top:44px;
  padding-top:22px;
  border-top:1px solid rgba(36,41,43,.12);
  font-size:13.5px;
}
.legal__pie a{text-decoration:none}

@media (min-width:1025px){
  .legal{padding:44px 24px 80px;font-size:16px}
  .legal h2{font-size:21px}
}