/* MV Design · páginas legales (privacidad, términos, eliminación de datos)
   Mismo sistema que el inicio (tokens, tipografía, nav, footer); sin telón, sin pop-ups, sin JS necesario. */
.legal-page .nav { background: rgba(10, 10, 15, 0.94); -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom-color: var(--line-dark); }
.legal { padding-top: 76px; }
.legal__wrap { max-width: 800px; padding-block: clamp(48px, 8vw, 96px) clamp(64px, 10vw, 120px); }
.legal__title { font: var(--t-h2); letter-spacing: var(--track-heading); color: var(--fg-on-dark-1); margin: 14px 0 12px; text-wrap: balance; }
.legal__updated { font: var(--t-caption); color: var(--fg-on-dark-3); letter-spacing: .02em; }
.legal__lead { font: var(--t-lead); color: var(--fg-on-dark-2); margin-top: 24px; text-wrap: pretty; }
.legal__body { margin-top: 16px; }
.legal__body h2 { font: 700 clamp(20px, 2.2vw, 24px)/1.25 var(--font-display); color: var(--fg-on-dark-1); letter-spacing: -.015em; margin: 44px 0 14px; scroll-margin-top: 96px; }
.legal__body p, .legal__body li { font: var(--t-body); color: var(--fg-on-dark-2); }
.legal__body p + p { margin-top: 12px; }
.legal__body ul { list-style: disc; padding-left: 1.25em; margin: 12px 0; display: grid; gap: 8px; }
.legal__body ul li::marker { color: var(--mv-blue-2); }
.legal__steps { list-style: none; counter-reset: paso; padding: 0; margin: 16px 0; display: grid; gap: 14px; }
.legal__steps li { counter-increment: paso; position: relative; padding: 16px 18px 16px 58px; border: 1px solid var(--line-dark); border-radius: 16px; background: rgba(255, 255, 255, 0.02); }
.legal__steps li::before { content: counter(paso); position: absolute; left: 16px; top: 14px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 700 14px/1 var(--font-display); color: #fff; background: var(--grad-brand); }
.legal__body strong { color: var(--fg-on-dark-1); font-weight: 600; }
.legal__body a { color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, 0.35); overflow-wrap: anywhere; }
.legal__body a:hover { text-decoration-color: #fff; }
@media (max-width: 560px) { .legal-page .nav .btn { padding: 9px 14px; font-size: 11px; } }
