/* ───────────────────────────────────────────────────────────────
   Euno — legal pages (términos / privacidad)
   Reading layout. Reuses tokens.css.
   ─────────────────────────────────────────────────────────────── */

.legal {
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(48px, 8vw, 88px) 28px clamp(64px, 9vw, 104px);
}

.legal__eyebrow {
  margin: 0 0 14px;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--text-label);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--color-text-tertiary);
}
.legal__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(34px, 5.4vw, 54px);
  line-height: 1.06;
  letter-spacing: -1.2px;
  color: var(--color-primary);
}
.legal__updated {
  margin: 16px 0 0;
  font-family: var(--font-body);
  font-size: var(--text-small);
  color: var(--color-text-tertiary);
}

.legal__notice {
  margin: clamp(28px, 4vw, 40px) 0 0;
  padding: 18px 22px;
  background: var(--color-card);
  border-left: 3px solid var(--accent);
  border-radius: 0 var(--radius-card) var(--radius-card) 0;
  box-shadow: var(--shadow-lift1);
  font-family: var(--font-body);
  font-size: var(--text-caption);
  line-height: 1.6;
  color: var(--color-text-secondary);
}

.legal__lede {
  margin: clamp(28px, 4vw, 40px) 0 0;
  font-family: var(--font-body);
  font-size: var(--text-body-lg);
  line-height: 1.62;
  color: var(--color-text-secondary);
}

.legal h2 {
  margin: clamp(40px, 5vw, 56px) 0 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(24px, 3vw, 30px);
  line-height: 1.18;
  letter-spacing: -0.6px;
  color: var(--color-primary);
}
.legal h3 {
  margin: 28px 0 0;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 17px;
  color: var(--color-primary);
}
.legal p,
.legal li {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  color: var(--color-text-secondary);
}
.legal p { margin: 14px 0 0; }
.legal ul { margin: 14px 0 0; padding-left: 22px; }
.legal li { margin: 8px 0 0; }
.legal strong { color: var(--color-primary); font-weight: 600; }
.legal a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: var(--color-divider-strong);
  transition: text-decoration-color var(--duration-fast) var(--ease-out);
}
.legal a:hover { text-decoration-color: var(--accent); }

/* contact / crisis callout */
.legal__callout {
  margin: 20px 0 0;
  padding: 20px 22px;
  background: var(--color-card);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-lift1);
}
.legal__callout p { margin: 0; }
.legal__callout p + p { margin-top: 8px; }