:root{--bg:#060B1E;--panel:rgba(255,255,255,.04);--borde:rgba(148,163,255,.16);--texto:#E6E9F5;--suave:#9AA3C0;--cian:#22D3EE;--violeta:#8B5CF6;--rosa:#EC4899}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);color-scheme:dark}
body{margin:0;font-family:Inter,system-ui,sans-serif;color:var(--texto);background:var(--bg);line-height:1.6;overflow-x:hidden}
a{color:var(--cian)}
h1,h2,h3{font-family:'Space Grotesk',Inter,sans-serif;line-height:1.15;margin:0 0 .5em}
.fondo{position:fixed;inset:0;z-index:-1;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.45;animation:flota 18s ease-in-out infinite alternate}
.orb.a{width:520px;height:520px;background:var(--violeta);top:-160px;left:-120px}
.orb.b{width:460px;height:460px;background:var(--cian);bottom:-180px;right:-120px;animation-delay:-6s}
.rejilla{position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,255,.07) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%)}
@keyframes flota{to{transform:translate(60px,40px) scale(1.1)}}
@media (prefers-reduced-motion:reduce){.orb{animation:none}html{scroll-behavior:auto}}
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px max(16px,calc((100% - 1120px)/2));background:rgba(6,11,30,.7);backdrop-filter:blur(12px);border-bottom:1px solid var(--borde)}
.marca{display:flex;align-items:center;gap:10px;color:var(--texto);text-decoration:none;font-family:'Space Grotesk';font-size:1.15rem;letter-spacing:.04em}
.marca b{color:var(--cian)}
.logo{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--violeta),var(--cian));color:#fff;font-weight:700}
nav{display:flex;gap:18px}
nav a{color:var(--suave);text-decoration:none;font-size:.95rem}
nav a:hover{color:var(--texto)}
main,.pie{max-width:1120px;margin:0 auto;padding:0 16px}
.hero{padding:80px 0 56px}
.chip{display:inline-block;padding:6px 14px;border:1px solid var(--borde);border-radius:999px;background:var(--panel);color:var(--cian);font-size:.85rem;margin:0 0 18px}
.hero h1{font-size:clamp(2rem,5.5vw,3.6rem);max-width:15em}
.grad{background:linear-gradient(90deg,var(--cian),var(--violeta),var(--rosa));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.1rem;color:var(--suave);max-width:40em}
.acciones{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}
.btn{display:inline-block;padding:13px 22px;border-radius:12px;background:linear-gradient(135deg,var(--violeta),var(--cian));color:#fff;text-decoration:none;font-weight:600;box-shadow:0 10px 30px -10px rgba(34,211,238,.6)}
.btn.ghost{background:var(--panel);border:1px solid var(--borde);box-shadow:none}
.datos{display:flex;flex-wrap:wrap;gap:28px;list-style:none;padding:0;margin:28px 0 0}
.datos b{display:block;font-family:'Space Grotesk';font-size:1.8rem;color:var(--texto)}
.datos span{color:var(--suave);font-size:.9rem}
.bloque{padding:56px 0}
.bloque h2{font-size:clamp(1.6rem,3.5vw,2.3rem)}
.sub{color:var(--suave);max-width:46em;margin-bottom:28px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.grid.dos{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{padding:22px;border:1px solid var(--borde);border-radius:18px;background:var(--panel);backdrop-filter:blur(6px);transition:transform .2s,border-color .2s}
.card:hover{transform:translateY(-3px);border-color:rgba(34,211,238,.45)}
.card p{color:var(--suave);margin:0}
.card p b{color:var(--texto)}
.ico{font-size:1.6rem;display:block;margin-bottom:8px}
.wa>div{padding:32px;border:1px solid var(--borde);border-radius:22px;background:linear-gradient(135deg,rgba(139,92,246,.12),rgba(34,211,238,.08))}
.lista{padding-left:20px;margin:0 0 16px}
.lista li{margin:6px 0}
.nota{font-size:.9rem;color:var(--suave)}
.pie{padding:32px 16px 48px;border-top:1px solid var(--borde);color:var(--suave);font-size:.9rem;text-align:center}
.pie a{color:var(--suave)}
.legal{max-width:820px;margin:0 auto;padding:48px 16px}
.legal h1{font-size:clamp(1.8rem,4vw,2.4rem)}
.legal h2{font-size:1.25rem;margin-top:1.8em}
.legal p,.legal li{color:#C9CEE0}
.legal .act{color:var(--suave);font-size:.9rem}
@media (max-width:640px){nav{gap:12px}nav a{font-size:.85rem}.hero{padding-top:48px}}