/* Páginas legales (privacidad, términos, seguridad, 404): mismos tokens que styles.css */
:root{
  --c0:#000000;--c1:#181818;--c2:#1F1F1F;--c3:#272727;--c4:#313131;
  --ink:#FFFFFF;--muted:#A3A3A3;--soft:#8A8A8A;
  --line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.14);
  --green:#4ADE80;--amber:#FBBF24;
  --sans:"Geist",ui-sans-serif,system-ui,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,Consolas,monospace;
  --ease:cubic-bezier(0.32,0.72,0,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:112px}
body{display:flex;flex-direction:column;min-height:100vh;margin:0;min-width:320px;color:var(--ink);background:var(--c0);font:400 16px/24px var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol{margin:0}
h1,h2,h3{text-wrap:balance;font-weight:600}
p,li{text-wrap:pretty}
.ph{font-style:normal}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:8px}
::selection{color:#000;background:var(--ink)}
main{flex:1}
.wrap{width:min(calc(100% - 48px),1120px);margin-inline:auto}
.skip{position:fixed;top:-64px;left:16px;z-index:100;padding:8px 12px;border-radius:8px;color:#000;background:var(--ink);font:600 14px/20px var(--sans)}
.skip:focus{top:16px}

/* Botones */
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border:1px solid transparent;border-radius:9999px;font:600 16px/24px var(--sans);white-space:nowrap;transition:transform 700ms var(--ease),background-color 700ms var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:scale(.98)}
.btn .ph{font-size:16px;transition:transform 700ms var(--ease)}
.btn:hover .ph{transform:translateX(2px)}
.btn-primary{color:#000;background:var(--ink)}
.btn-primary:hover{background:#E5E5E5}
.btn-ghost{border-color:var(--line-strong);background:var(--c1)}
.btn-ghost:hover{background:var(--c3)}
.facts{display:grid;gap:12px;margin:0}
.facts div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px}
.facts dt{color:var(--ink);font-weight:500}
.facts dd{margin:0;color:var(--muted)}

/* Navegación: isla flotante */
.nav{position:fixed;top:24px;left:0;right:0;z-index:50;display:flex;justify-content:center;pointer-events:none}
.nav-pill{pointer-events:auto;display:flex;align-items:center;gap:24px;width:max-content;max-width:calc(100% - 32px);padding:8px 8px 8px 16px;border:1px solid var(--line-strong);border-radius:9999px;background:rgba(24,24,24,.72);-webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%)}
.brand{display:inline-flex;align-items:center;gap:8px;font:600 14px/20px var(--sans);white-space:nowrap}
.brand img{width:24px;height:24px}
.brand .sub{font-weight:500}
.nav-links{display:flex;gap:4px}
.nav-links a{padding:8px 12px;border-radius:9999px;color:var(--muted);font:500 14px/20px var(--sans);white-space:nowrap;transition:color 700ms var(--ease),background-color 700ms var(--ease)}
.nav-links a:hover{color:var(--ink);background:var(--c3)}
.nav-links a:active{transform:scale(.98)}
.nav-links a[aria-current="page"]{color:var(--ink);background:var(--c3)}

/* Encabezado */
.doc-head{padding:160px 0 48px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font:500 14px/20px var(--sans)}
.eyebrow .ph{font-size:16px}
.doc-head h1{max-width:680px;margin-top:16px;font-size:48px;line-height:1;letter-spacing:-.02em;background:linear-gradient(90deg,#FFFFFF,#9B9B9B);-webkit-background-clip:text;background-clip:text;color:transparent}
.doc-head .lead{max-width:680px;margin-top:24px;color:var(--muted);font-size:18px;line-height:28px}
.meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.meta span{padding:4px 12px;border:1px solid var(--line-strong);border-radius:9999px;background:var(--c1);color:var(--muted);font:400 12px/16px var(--mono)}

/* Cuerpo: índice fijo + cláusulas */
.doc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start;padding-bottom:96px}
.toc{position:sticky;top:112px}
.toc p{margin-bottom:12px;color:var(--soft);font:500 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase}
.toc ol{display:grid;gap:2px;padding:0;list-style:none;counter-reset:toc}
.toc a{display:flex;gap:8px;padding:8px 12px;border-radius:8px;color:var(--muted);font-size:14px;line-height:20px;transition:color 700ms var(--ease),background-color 700ms var(--ease)}
.toc a::before{counter-increment:toc;content:counter(toc);min-width:16px;color:var(--soft);font:400 12px/20px var(--mono)}
.toc a:hover{color:var(--ink);background:var(--c1)}
.toc a.is-current{color:var(--ink);background:var(--c2)}
.toc-mobile{display:none}

.clauses{display:grid;gap:16px;max-width:760px;counter-reset:clause}
.clause{padding:32px;border:1px solid var(--line);border-radius:24px;background:var(--c1)}
.clause h2{display:flex;gap:12px;font-size:20px;line-height:28px}
.clause h2::before{counter-increment:clause;content:counter(clause);min-width:24px;color:var(--soft);font:400 14px/28px var(--mono)}
.clause>*+*{margin-top:16px}
.clause p,.clause li{color:var(--muted)}
.clause strong{color:var(--ink);font-weight:500}
.clause ul{display:grid;gap:8px;padding:0;list-style:none}
.clause li{position:relative;padding-left:24px}
.clause li::before{content:"";position:absolute;left:4px;top:10px;width:6px;height:6px;border-radius:9999px;background:var(--c4)}
.clause a,.doc-foot a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px;transition:text-decoration-color 700ms var(--ease)}
.clause a:hover,.doc-foot a:hover{text-decoration-color:var(--ink)}
.box{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--c0)}
.doc-foot{margin-top:32px;color:var(--soft);font-size:14px;line-height:20px}

/* Pie */
footer{padding:48px 0;border-top:1px solid var(--line);color:var(--soft);font-size:14px;line-height:20px}
.f-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
.f-row nav{display:flex;flex-wrap:wrap;gap:24px}
.f-row a{transition:color 700ms var(--ease)}
.f-row a:hover{color:var(--ink)}

/* Movimiento */
.reveal{opacity:0;transform:translateY(64px);filter:blur(12px);transition:opacity 800ms var(--ease),transform 800ms var(--ease),filter 800ms var(--ease)}
.reveal.is-in{opacity:1;transform:none;filter:none}
.no-js .reveal{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;filter:none;transition:none}
}

@media (max-width:860px){
  .doc{grid-template-columns:minmax(0,1fr);gap:24px}
  .toc{display:none}
  .toc-mobile{display:block;margin-bottom:16px;border:1px solid var(--line);border-radius:16px;background:var(--c1)}
  .toc-mobile summary{display:flex;align-items:center;justify-content:space-between;padding:16px;cursor:pointer;list-style:none;font-weight:500}
  .toc-mobile summary::-webkit-details-marker{display:none}
  .toc-mobile summary .ph{transition:transform 700ms var(--ease)}
  .toc-mobile[open] summary .ph{transform:rotate(180deg)}
  .toc-mobile ol{display:grid;gap:2px;padding:0 8px 8px;list-style:none;counter-reset:toc}
  .toc-mobile a{display:flex;gap:8px;padding:8px;border-radius:8px;color:var(--muted);font-size:14px;line-height:20px}
  .toc-mobile a::before{counter-increment:toc;content:counter(toc);min-width:16px;color:var(--soft);font:400 12px/20px var(--mono)}
}
@media (max-width:640px){
  .wrap{width:calc(100% - 32px)}
  .nav-pill{gap:8px;padding-left:12px}
  .brand .sub{display:none}
  .nav-links a{padding:8px}
  .doc-head{padding:128px 0 32px}
  .doc-head h1{font-size:36px;line-height:40px}
  .doc-head .lead{font-size:16px;line-height:24px}
  .clause{padding:24px 16px}
  .actions .btn{width:100%}
  .facts div{grid-template-columns:minmax(0,1fr);gap:4px}
}
