*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#0b1020;color:#e6e9f2}
a{color:#8ab4ff;text-decoration:none}header{display:flex;justify-content:space-between;align-items:center;padding:18px 6%;border-bottom:1px solid #1f2742;flex-wrap:wrap;gap:10px}
.logo{font-weight:800;font-size:22px;color:#fff}.logo span{color:#7c5cff}nav a{margin-left:20px;color:#c3c9dc}nav a:hover{color:#fff}
.hero{text-align:center;padding:60px 6% 30px}.hero h1{font-size:44px;margin:0 0 12px;background:linear-gradient(90deg,#7c5cff,#2fd3c6);-webkit-background-clip:text;color:transparent}
.hero p{color:#a8b0c8;font-size:18px}#q{width:min(640px,100%);padding:16px 20px;border-radius:14px;border:1px solid #2a3458;background:#121a33;color:#fff;font-size:17px;margin-top:18px}
.filtros{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:10px 6%}.filtros button{background:#141c38;color:#c3c9dc;border:1px solid #2a3458;border-radius:999px;padding:8px 14px;cursor:pointer;font-size:14px}
.filtros button.on{background:#7c5cff;color:#fff;border-color:#7c5cff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px;padding:24px 6% 60px}
.card{background:#121a33;border:1px solid #1f2742;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:10px;transition:.2s}.card:hover{transform:translateY(-3px);border-color:#7c5cff}
.card h3{margin:0;font-size:18px}.card p{margin:0;color:#a8b0c8;font-size:14px;line-height:1.5;flex:1}
.tags{display:flex;gap:6px;flex-wrap:wrap}.tag{font-size:12px;padding:3px 9px;border-radius:999px;background:#1c2546;color:#c3c9dc}
.gratis{background:#0f3d2e;color:#5ee0a8}.freemium{background:#3a2f0d;color:#ffd166}.pago{background:#3d1424;color:#ff8fa8}
.btn{display:inline-block;background:#7c5cff;color:#fff;padding:9px 14px;border-radius:10px;font-weight:600;text-align:center}
.sponsor{border:1px solid #ffd166;background:linear-gradient(135deg,#1e1a33,#121a33)}
.page{max-width:900px;margin:0 auto;padding:40px 6%}.page h1{font-size:36px}.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.tiers .card h2{margin:0}.precio{font-size:30px;font-weight:800;color:#2fd3c6}
input,textarea,select{width:100%;padding:12px;border-radius:10px;border:1px solid #2a3458;background:#121a33;color:#fff;margin:6px 0 14px;font:inherit}
footer{text-align:center;color:#6c7593;padding:30px;border-top:1px solid #1f2742}#n{color:#6c7593;text-align:center}
.navdoc{color:#2fd3c6!important;font-weight:700}.banner{margin:10px 6% 0;padding:22px 26px;border-radius:16px;background:linear-gradient(90deg,#2a1f6b,#0f4a52);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.banner h2{margin:0 0 6px}.banner p{margin:0;color:#c9d2ea}.uso{background:#0f1a3a;border-left:3px solid #2fd3c6;padding:8px 10px;border-radius:6px;font-size:13px;color:#c9d2ea}
.guias{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;padding:0 6% 40px}.guia ol{padding-left:20px;color:#c9d2ea;line-height:1.6;font-size:14px}.page.wide{max-width:none;padding:40px 0 0}.page.wide>h1,.page.wide>p,.page.wide>h2{padding:0 6%}