/* ═══════════════════════════════════════════════════════════
   Páginas de documento: privacidad y condiciones.

   Reusan los tokens y las tipografías de styles.css para que se sientan parte
   de la aplicación, pero no cargan su JavaScript: Google tiene que poder leer
   la política de privacidad sin sesión y sin que nada se ejecute.
   ═══════════════════════════════════════════════════════════ */

/* styles.css fija overflow:hidden en body para el marco fijo del reproductor.
   Un documento tiene que poder desplazarse. */
.doc-body{overflow:auto;height:auto;min-height:100%;
  padding:0 calc(24px + var(--sa-r)) calc(64px + var(--sa-b)) calc(24px + var(--sa-l))}

.doc{max-width:720px;margin:0 auto;padding-top:calc(40px + var(--sa-t));
  font-size:15px;line-height:1.65;color:var(--text-2)}

.doc-back{display:inline-flex;align-items:center;gap:10px;margin-bottom:40px;
  font-family:var(--display);font-size:14.5px;font-weight:700;color:var(--text);
  letter-spacing:-.015em;text-decoration:none}
.doc-back:hover{opacity:.8}
/* Misma marca que la barra superior: la onda del logo como máscara */
.doc-mark{width:32px;height:32px;flex:none;border-radius:9px;
  display:grid;place-items:center;background:var(--emph);box-shadow:var(--aura-s)}
.doc-mark::before{content:"";width:21px;height:12px;background:var(--emph-on);
  -webkit-mask:url('/images/logo-mark.png') center/contain no-repeat;
          mask:url('/images/logo-mark.png') center/contain no-repeat}

.doc h1{font-family:var(--display);font-size:clamp(26px,4vw,34px);font-weight:700;
  color:var(--text);letter-spacing:-.02em;margin:0 0 6px}
.doc h2{font-family:var(--display);font-size:19px;font-weight:700;color:var(--text);
  letter-spacing:-.01em;margin:38px 0 10px}
.doc h3{font-size:14.5px;font-weight:650;color:var(--text);margin:22px 0 6px}

.doc-date{font-size:12.5px;color:var(--text-3);margin:0 0 28px}

.doc p{margin:0 0 12px}
.doc ul{margin:0 0 12px;padding-left:20px}
.doc li{margin-bottom:6px}
.doc strong{color:var(--text);font-weight:650}

.doc code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;
  padding:1px 5px;border-radius:5px;
  background:color-mix(in oklab,var(--ink) 9%,transparent);color:var(--text)}

.doc a{color:var(--text);text-decoration:underline;text-underline-offset:2px;
  text-decoration-color:color-mix(in oklab,var(--ink) 34%,transparent)}
.doc a:hover{text-decoration-color:var(--text)}

/* La aclaración de no afiliación: lo primero que se lee tras el título */
.doc-note{padding:14px 16px;border-radius:var(--r-m);margin:0 0 8px;
  background:var(--surface-t);border:1px solid var(--stroke);
  font-size:13.5px;line-height:1.6}

.doc-links{display:flex;flex-wrap:wrap;gap:20px;margin-top:44px;padding-top:22px;
  border-top:1px solid var(--stroke);font-size:13.5px}