/* Estilos compartidos de las páginas legales de las apps de Climbu (apps//privacypolicy.htm y la plantilla apps/_template/). Fuente de verdad del look de estas páginas: los tokens y patrones salen de la landing (index.html). No dupliques estos estilos en cada HTML: enlazá esta hoja. Uso desde una página en apps//: Las fuentes (Space Grotesk + JetBrains Mono) se cargan aparte, con el a Google Fonts que va en el de cada página. */ :root{--bg:oklch(0.13 0.018 290);--surface:oklch(0.16 0.025 290/0.6);--line:oklch(0.32 0.04 290/0.5);--line-strong:oklch(0.42 0.06 290/0.7);--text:oklch(0.96 0.01 290);--text-dim:oklch(0.75 0.02 290);--text-mute:oklch(0.55 0.03 290);--violet:oklch(0.70 0.22 295);--violet-deep:oklch(0.55 0.24 285);--violet-glow:oklch(0.70 0.22 295/0.35);--display:'Space Grotesk',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace} *{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth} @media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}} html,body{background:var(--bg);color:var(--text);font-family:var(--display);-webkit-font-smoothing:antialiased;overflow-x:hidden} body{background:radial-gradient(ellipse 1200px 800px at 85% -10%,oklch(0.40 0.20 295/0.28),transparent 60%),radial-gradient(ellipse 900px 600px at -5% 70%,oklch(0.30 0.20 280/0.18),transparent 60%),var(--bg);min-height:100vh;position:relative} body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(to right,oklch(0.40 0.04 290/0.06) 1px,transparent 1px),linear-gradient(to bottom,oklch(0.40 0.04 290/0.06) 1px,transparent 1px);background-size:72px 72px;pointer-events:none;mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,black,transparent 85%);z-index:0} .page{position:relative;z-index:1;max-width:820px;margin:0 auto;padding:0 24px 80px} nav{display:flex;align-items:center;justify-content:space-between;padding:28px 0} .brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit} .logo{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--violet),var(--violet-deep));display:grid;place-items:center;box-shadow:0 0 24px var(--violet-glow),inset 0 1px 0 oklch(1 0 0/0.25)} .brand-name{font-size:20px;font-weight:600;letter-spacing:-0.6px} .status-pill{font-family:var(--mono);font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.5px} header.doc{padding:48px 0 40px;border-bottom:1px solid var(--line)} .eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.8px;padding:8px 14px;border-radius:999px;background:oklch(0.20 0.03 290/0.5);border:1px solid var(--line);margin-bottom:28px} .v-dot{width:6px;height:6px;border-radius:50%;background:var(--violet);box-shadow:0 0 10px var(--violet);display:inline-block;flex-shrink:0} h1{font-family:var(--display);font-weight:500;font-size:clamp(38px,6vw,60px);line-height:1;letter-spacing:-2px;text-wrap:balance} h1 em{font-style:italic;font-weight:300;color:var(--violet)} .meta{font-family:var(--mono);font-size:12px;color:var(--text-mute);margin-top:20px;line-height:1.7} .lede{font-size:17px;line-height:1.6;color:var(--text-dim);margin-top:28px;text-wrap:pretty} section.block{padding:36px 0;border-bottom:1px solid var(--line)} .num{font-family:var(--mono);font-size:12px;color:var(--violet);letter-spacing:1.5px;margin-bottom:14px} h2{font-size:clamp(22px,3vw,28px);font-weight:500;letter-spacing:-0.8px;line-height:1.15} h3{font-size:16px;font-weight:600;letter-spacing:-0.3px;margin-top:24px} p{font-size:15px;line-height:1.65;color:var(--text-dim);margin-top:14px;text-wrap:pretty} strong{color:var(--text);font-weight:600} a{color:var(--violet);text-decoration:none;border-bottom:1px solid oklch(0.70 0.22 295/0.35);transition:border-color .2s} a:hover{border-color:var(--violet)} ul{margin:14px 0 0;padding-left:0;list-style:none} li{font-size:15px;line-height:1.6;color:var(--text-dim);padding-left:24px;position:relative;margin-top:12px;text-wrap:pretty} li::before{content:'';position:absolute;left:4px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--violet);box-shadow:0 0 8px var(--violet-glow)} li strong{color:var(--text)} .callout{margin-top:20px;padding:18px 20px;border-radius:14px;background:var(--surface);border:1px solid var(--line);backdrop-filter:blur(8px)} .callout p{margin-top:0;color:var(--text-dim);font-size:14px} .callout p+p{margin-top:10px} .contact-card{margin-top:20px;padding:22px 24px;border-radius:16px;background:radial-gradient(ellipse 120% 120% at 90% 0%,oklch(0.40 0.22 295/0.25),transparent 70%),var(--surface);border:1px solid var(--line-strong)} .contact-card .k{font-family:var(--mono);font-size:11px;color:var(--text-mute);text-transform:uppercase;letter-spacing:0.6px} .contact-card .val{font-size:18px;font-weight:500;margin-top:6px} footer{padding:40px 0 0;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:var(--text-mute);font-size:12px;font-family:var(--mono);text-transform:uppercase;letter-spacing:0.6px} footer a{color:inherit;border:none} footer a:hover{color:var(--text)} @media(max-width:600px){nav{padding:20px 0}header.doc{padding:32px 0 28px}}