/* ═══════════════════════════════════════════════════════════════════════════
   Páginas de texto largo: /privacidad/, /terminos/ y /eliminar-cuenta/.
   Se apoya en enlace.css (paleta, barra superior, botones) y sólo cambia el
   cuerpo: una columna de lectura en vez de la tarjeta centrada.
   ═══════════════════════════════════════════════════════════════════════════ */

main.legal { display: block; padding: 48px 0 80px; }

main.legal .container { max-width: 760px; }

main.legal .kicker {
  margin: 0 0 6px; font-size: 0.8rem; font-weight: 800;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--teal-600);
}

main.legal h1 { margin: 0; font-size: clamp(1.9rem, 4vw, 2.5rem); line-height: 1.2; font-weight: 900; }

main.legal .actualizado { margin: 8px 0 36px; color: var(--gray-500); font-size: 0.95rem; }

main.legal section { margin: 0 0 28px; }

main.legal h2 { margin: 0 0 8px; font-size: 1.15rem; font-weight: 800; }

main.legal p, main.legal li { margin: 0 0 12px; font-size: 1.02rem; color: #1F3F3C; }

main.legal ol { padding-left: 22px; margin: 0 0 12px; }

main.legal a { color: var(--teal-700); font-weight: 700; }

main.legal .nota {
  background: var(--surface); border: 1px solid var(--slate-200);
  border-radius: 14px; padding: 16px 20px; margin: 0 0 28px;
}

main.legal .legal-links {
  display: flex; flex-wrap: wrap; gap: 12px 24px;
  margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--slate-200);
}