@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{color-scheme:dark;--bg:#080d18;--panel:#101a2c;--panel2:#15233a;--line:#263752;--text:#edf4ff;--muted:#91a4c2;--blue:#57c7ff;--violet:#8b7cff;--green:#43d6a0;--red:#ff7585;--amber:#ffc66d;--radius:20px;--shadow:0 18px 50px #02061766}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;min-height:100dvh;color:var(--text);font:15px/1.6 'DM Sans',system-ui,sans-serif;background:radial-gradient(900px 500px at 85% -10%,#254b8b55,transparent 65%),radial-gradient(700px 400px at -10% 30%,#553a8b22,transparent 60%),var(--bg)}
h1,h2,h3,.marca{font-family:'Space Grotesk',sans-serif;letter-spacing:-.035em;line-height:1.15}h1{font-size:clamp(2rem,6vw,3.45rem);margin:.15em 0 .35em}h2{font-size:1.45rem}h3{font-size:1.08rem}
a{color:var(--blue)}.barra{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1rem;padding:.75rem clamp(1rem,4vw,2.5rem);background:#080d18dd;backdrop-filter:blur(18px);border-bottom:1px solid #31415d88}
.marca{display:flex;align-items:center;gap:.65rem;color:var(--text);text-decoration:none;font-size:1.1rem;font-weight:700;letter-spacing:.16em;flex-shrink:0}.marca img{filter:drop-shadow(0 0 12px #57c7ff66)}
nav{display:flex;align-items:center;gap:.35rem;overflow-x:auto;scrollbar-width:none;flex:1;justify-content:flex-end}nav::-webkit-scrollbar{display:none}
nav a,nav button{white-space:nowrap;color:var(--muted);text-decoration:none;padding:.55rem .85rem;border-radius:12px;border:1px solid transparent;background:none;font:600 .9rem 'DM Sans',sans-serif;cursor:pointer;min-height:42px}nav a:hover,nav button:hover,nav a[aria-current=page]{color:var(--text);background:#17243a;border-color:#31415d}
main{max-width:1180px;margin:0 auto;padding:clamp(1rem,3vw,2.2rem) clamp(1rem,4vw,2.5rem) 5rem;outline:0}
.grid{display:grid;gap:1rem}.grid.dos{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}.grid.tres{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.tarjeta{position:relative;overflow:hidden;background:linear-gradient(145deg,#142139f2,#0e1728f5);border:1px solid #2a3c59;border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);animation:entra .28s ease both}
.tarjeta:before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#72cfff88,transparent);pointer-events:none}
@keyframes entra{from{opacity:0;transform:translateY(8px)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(230px,.8fr);gap:clamp(1.5rem,5vw,4rem);align-items:center;padding:clamp(1rem,4vw,3rem) 0 2rem}
.hero p{color:var(--muted);font-size:1.05rem;max-width:56ch}.hero h1{max-width:13ch}.hero .btn{margin-top:.7rem}
.marco{aspect-ratio:4/5;max-height:430px;width:100%;border-radius:26px;border:1px solid #40577a;background:radial-gradient(circle at 50% 25%,#3b67a866,transparent 55%),linear-gradient(145deg,#172d4d,#11182a);display:grid;place-items:center;text-align:center;color:#b7c9e4;padding:1rem;overflow:hidden;position:relative;box-shadow:0 25px 70px #0008}.marco:after{content:"NEXUS • 01";position:absolute;bottom:15px;left:18px;font-size:.7rem;letter-spacing:.2em;color:#d4e5ff99}.marco img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.marco small{display:block;margin-top:.4rem;font-size:.8rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;padding:.65rem 1rem;border-radius:13px;border:1px solid #344966;background:#172640;color:var(--text);font:700 .9rem 'DM Sans',sans-serif;cursor:pointer;text-decoration:none;transition:transform .15s,border-color .15s,filter .15s}.btn:hover{transform:translateY(-1px);border-color:#5b8dbd}.btn.primario{background:linear-gradient(115deg,var(--blue),#8d8aff);border:0;color:#07111f;box-shadow:0 8px 25px #4abfff33}.btn.peligro{color:var(--red)}.btn:disabled{opacity:.5;cursor:default;transform:none}
.fila{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}label{display:block;font-size:.88rem;font-weight:600;color:#b8c9e2;margin:.8rem 0 .3rem}
input,select{width:100%;min-height:46px;padding:.65rem .8rem;border-radius:12px;border:1px solid #344966;background:#0a1322;color:var(--text);font:inherit}input:focus,select:focus{outline:2px solid #57c7ff88;border-color:var(--blue)}
.pildora{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .65rem;border-radius:99px;font-size:.77rem;font-weight:700;border:1px solid #344966;color:var(--muted);background:#111e32}.pildora.ok{color:var(--green);border-color:#43d6a055}.pildora.mal{color:var(--red);border-color:#ff758555}.pildora.aviso{color:var(--amber);border-color:#ffc66d55}.pildora.premium{color:#c7baff;border-color:#8b7cff77}
.lista{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.lista li{display:flex;justify-content:space-between;gap:.5rem;padding:.6rem 0;border-bottom:1px solid #293b56;font-size:.92rem}.lista li:last-child{border:0}
.sub{color:var(--muted);font-size:.9rem}.codigo{font:700 1.8rem/1.2 ui-monospace,Menlo,monospace;letter-spacing:.12em;text-align:center;padding:1rem;border:1px dashed var(--blue);border-radius:15px;user-select:all;word-break:break-all;background:#10243b}
.aviso{padding:.8rem 1rem;border-radius:13px;border:1px solid #344966;background:#14243a;margin:.5rem 0}.aviso.err{border-color:#ff758566;color:#ffd1d7}.aviso.pend{border-color:#ffc66d66;color:#ffe2ad}
#avisos{position:fixed;left:1rem;right:1rem;bottom:max(1rem,env(safe-area-inset-bottom));z-index:30;display:grid;gap:.5rem;pointer-events:none}#avisos .aviso{pointer-events:auto;box-shadow:var(--shadow)}
.cargando{color:var(--muted);text-align:center;padding:4rem 0}.punto{display:inline-block;width:.58rem;height:.58rem;border-radius:50%;background:var(--muted);margin-right:.5rem;box-shadow:0 0 12px currentColor}.punto.ok{background:var(--green)}.punto.mal{background:var(--red)}.punto.aviso{background:var(--amber)}
@media(max-width:680px){.barra{align-items:flex-start;flex-wrap:wrap}.marca{padding:.2rem 0}nav{order:2;width:100%;justify-content:flex-start;margin:0 -2px;padding-bottom:2px}.hero{grid-template-columns:1fr}.marco{max-height:300px;aspect-ratio:16/9}.tarjeta{padding:1rem}main{padding-top:1.1rem}}