/* Estilo compartido de las páginas legales. Mismas variables que la landing
   para que no parezcan un anexo de otro sitio. Texto ancho de lectura, no de
   marketing: aquí la prioridad es que se entienda, no que convenza. */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --sg:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mn:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --acc:#2BE08A;
  --ink:#E6EFEA; --mut:#A8B6AF; --faint:#63756C;
  --bg:#05070a; --line:rgba(255,255,255,.09);
}
body{
  background:var(--bg); color:var(--mut);
  font-family:var(--mn); font-size:16px; line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:760px; margin:0 auto; padding:0 24px 96px;}

header.top{
  border-bottom:1px solid var(--line); margin-bottom:56px;
  padding:20px 24px; position:sticky; top:0;
  background:rgba(5,7,10,.85); backdrop-filter:blur(10px); z-index:10;
}
header.top .inner{max-width:760px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:16px;}
.brand{display:inline-flex; align-items:center; gap:10px; text-decoration:none;}
.brand span{font-family:var(--sg); font-weight:700; font-size:17px; color:var(--ink); letter-spacing:.02em;}
.brand span i{color:var(--acc); font-style:normal;}
.back{font-size:14px; color:var(--mut); text-decoration:none;}
.back:hover{color:var(--acc);}

h1{font-family:var(--sg); font-size:34px; line-height:1.2; color:var(--ink); font-weight:700; margin-bottom:10px;}
.updated{font-size:13.5px; color:var(--faint); margin-bottom:40px;}
h2{font-family:var(--sg); font-size:20px; color:var(--ink); font-weight:600; margin:38px 0 12px;}
p{margin-bottom:16px;}
ul{margin:0 0 16px 22px;} li{margin-bottom:8px;}
strong,b{color:var(--ink); font-weight:600;}
a{color:var(--acc);}

/* Bloque de advertencia fuerte: lo que de verdad tiene que leer alguien
   antes de usar notas de acciones para decidir con su dinero. */
.callout{
  border:1px solid rgba(43,224,128,.28); border-left-width:3px;
  background:rgba(43,224,128,.05);
  padding:20px 22px; border-radius:8px; margin:28px 0;
}
.callout p:last-child{margin-bottom:0;}

footer.legal{
  border-top:1px solid var(--line); margin-top:64px; padding-top:24px;
  font-size:13.5px; color:var(--faint);
}
footer.legal a{color:var(--mut); text-decoration:none; margin-right:18px;}
footer.legal a:hover{color:var(--acc);}

@media (max-width:640px){
  h1{font-size:27px;} body{font-size:15.5px;} .wrap{padding:0 18px 72px;}
}
