/* Privacy, Terms and 404 — quiet document pages in the site's palette */
:root { --ink: #050608; --ink-2: #0b0e13; --pearl: #eef1f5; --mist: #a3abb7; --steel: #8a929e; --line: rgba(233,237,242,.10); --blue: #2b9be6; --blue-hi: #6cc4ff; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--ink); color: var(--pearl); font: 400 16px/1.7 Manrope, system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--blue-hi); text-underline-offset: 3px; }
a:focus-visible { outline: 2px solid var(--blue-hi); outline-offset: 3px; border-radius: 4px; }
.doc-top { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px max(16px, env(safe-area-inset-left)); background: rgba(5,6,8,.94); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; color: var(--pearl); text-decoration: none; }
.brand__emblem { width: 38px; display: block; }
.brand__emblem svg { width: 100%; height: auto; display: block; }
.brand__emblem .logo-emblem { fill: var(--pearl); }
.brand__word { font-family: Michroma, sans-serif; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; line-height: 1.1; }
.brand__word small { display: block; font-size: 7px; letter-spacing: .38em; color: var(--blue-hi); margin-top: 4px; }
@media (max-width: 359px) { .brand__word small { display: none; } }
.doc-top a.back { font-family: Michroma, sans-serif; font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--pearl); text-decoration: none; padding: 10px 14px; border: 1px solid rgba(233,237,242,.18); border-radius: 999px; white-space: nowrap; }
.doc-top a.back:hover { border-color: var(--blue-hi); }
main { max-width: 720px; margin: 0 auto; padding: 48px 16px 72px; }
.kicker { font-family: Michroma, sans-serif; font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--blue-hi); margin: 0 0 14px; }
h1 { font-family: Syne, Manrope, sans-serif; font-weight: 700; font-size: clamp(34px, 8vw, 54px); line-height: 1.02; letter-spacing: -.02em; margin: 0 0 12px; }
.updated { color: var(--steel); font-size: 14px; margin: 0 0 36px; }
.lead { font-size: 18px; color: var(--pearl); margin: 0 0 32px; }
h2 { font-family: Michroma, sans-serif; font-weight: 400; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--pearl); margin: 44px 0 12px; padding-top: 24px; border-top: 1px solid var(--line); }
p, li { color: #c9d0d9; }
ul { padding-left: 20px; margin: 0 0 16px; }
li { margin: 4px 0; }
strong { color: var(--pearl); font-weight: 600; }
.doc-foot { max-width: 720px; margin: 0 auto; padding: 22px 16px 40px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 13px; color: var(--steel); }
.doc-foot a { color: var(--mist); text-decoration: none; }
.doc-foot a:hover { color: var(--pearl); }
/* 404 */
.lost { min-height: calc(100svh - 64px); display: grid; place-items: center; text-align: center; padding: 40px 16px; }
.lost h1 { font-size: clamp(40px, 11vw, 76px); }
.lost p { max-width: 420px; margin: 0 auto 28px; }
.lost .cta { display: inline-block; font-family: Michroma, sans-serif; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #fff; text-decoration: none; padding: 16px 26px; border-radius: 999px; background: linear-gradient(180deg, #3aa8ef, #1e86cc); }

/* English / Español: each page carries both texts; <html lang> (set by i18n.js in <head>) picks one */
html[lang="es"] [data-lang-block="en"], html:not([lang="es"]) [data-lang-block="es"] { display: none; }
.doc-top__end { display: flex; align-items: center; gap: 10px; }
.lang { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; border: 1px solid rgba(43,155,230,.45); }
.lang button { font-family: Michroma, sans-serif; font-size: 10px; letter-spacing: .16em; line-height: 1; min-width: 40px; height: 32px; padding: 0 10px 0 calc(10px + .16em); border-radius: 999px; color: rgba(238,241,245,.78); background: transparent; border: 0; cursor: pointer; }
.lang button[aria-pressed="true"] { background: var(--pearl); color: #050608; }
@media (max-width: 480px) {
  .doc-top { flex-wrap: wrap; row-gap: 10px; }
  .doc-top__end { width: 100%; justify-content: space-between; }
  .doc-top a.back { padding: 10px 12px; letter-spacing: .12em; }
}
