/* Legal pages (Privacidad/Términos) reutilizan exactamente el mismo header,
   fondo de estrellas/constelaciones, menú y footer que el resto del sitio
   (misma marca .subpage), así que aquí ya NO se sobreescribe nada de
   ".header"/".grid-container"/".desc-text"/".language-switcher"/".navbar"/
   ".footer": todas esas reglas viven en estilos.css y se comparten. Lo que
   queda aquí es únicamente la tipografía propia del documento legal. */
.legal-page { background: #050509; }

.legal-document { position: relative; z-index: 1; width: min(100%, 900px); margin: 0 auto; padding: 48px 24px 64px; background: rgba(5, 5, 9, 0.94); color: #ffece3; font-size: 18px; line-height: 1.75; overflow-wrap: anywhere; }
.legal-document h1 { font-family: 'Rajdhani', sans-serif; font-size: clamp(30px, 4vw, 46px); color: #fff; text-align: left; line-height: 1.2; }
.legal-document h2 { margin: 36px 0 12px; color: #ffa170; font-size: 24px; line-height: 1.35; }
.legal-document p { margin: 12px 0; }
.legal-document ul { padding-left: 24px; }
.legal-document li { margin-bottom: 12px; }
.legal-document a { color: #0ff; text-underline-offset: 3px; }
.legal-document section { scroll-margin-top: 24px; }
.legal-updated { color: #d0d0d0; font-size: 16px; }

.legal-skip { position: absolute; top: -100px; left: 16px; z-index: 10; padding: 12px; background: #050509; color: #0ff; }
.legal-skip:focus { top: 12px; }

@media (max-width: 600px) {
  .legal-document { padding: 32px 20px 48px; font-size: 17px; }
  .legal-document h2 { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .legal-page *, .legal-page *::before, .legal-page *::after { animation: none !important; transition: none !important; }
}