@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  --bg:      #05060e;
  --s1:      #0a0b1a;
  --s2:      #0f1123;
  --s3:      #161829;
  --s4:      #1c1e32;
  --border:  rgba(100,80,255,0.12);
  --border2: rgba(100,80,255,0.26);
  --border3: rgba(100,80,255,0.46);
  --accent:  #6450ff;
  --ab:      #4a84ff;
  --ac:      #9b78ff;
  --ad:      #c4aeff;
  --glow:    rgba(100,80,255,0.38);
  --text:    #edeaff;
  --text2:   #b8b4d8;
  --muted:   #6e6b90;
  --green:   #23d18b;
  --red:     #f04747;
  --yellow:  #faa81a;
  --tbg:     rgba(100,80,255,0.09);
  --tbr:     rgba(100,80,255,0.22);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); font-family: 'Outfit', sans-serif; overflow-x: hidden; min-height: 100vh; }

/* scrollbar */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--accent); border-radius: 99px; }

/* cursor */
* { cursor: none !important; }
#cur { position:fixed;width:8px;height:8px;background:var(--accent);border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);box-shadow:0 0 10px var(--glow);transition:transform .1s; }
#cur-r { position:fixed;width:28px;height:28px;border:1.5px solid rgba(100,80,255,.4);border-radius:50%;pointer-events:none;z-index:99998;transform:translate(-50%,-50%); }

/* noise */
body::after { content:'';position:fixed;inset:0;pointer-events:none;z-index:9000;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");background-size:180px;opacity:.5; }

/* NAV */
.nav { position:fixed;top:0;left:0;right:0;z-index:500;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:rgba(5,6,14,.9);backdrop-filter:blur(24px);border-bottom:1px solid var(--border); }
.nav-logo { display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--text);font-weight:800;font-size:1rem;letter-spacing:-.3px; }
.nav-logo-img { width:28px;height:28px;border-radius:50%;overflow:hidden;box-shadow:0 0 12px var(--glow);background:linear-gradient(135deg,var(--accent),var(--ab)); }
.nav-logo-img img { width:100%;height:100%;object-fit:cover;border-radius:50%; }
.nav-links { display:flex;gap:2px;align-items:center; }
.nav-links a { color:var(--muted);text-decoration:none;font-size:.85rem;font-weight:500;padding:5px 11px;border-radius:7px;transition:all .18s; }
.nav-links a:hover, .nav-links a.active { color:var(--text);background:var(--s3); }
.nav-cta { background:linear-gradient(135deg,var(--accent),var(--ab)) !important;color:#fff !important;font-weight:700 !important;border-radius:8px !important;padding:7px 15px !important;box-shadow:0 0 18px rgba(100,80,255,.4);transition:box-shadow .2s,transform .15s !important; }
.nav-cta:hover { box-shadow:0 0 30px rgba(100,80,255,.7) !important;transform:translateY(-1px) !important; }

/* background elements */
.blob { position:absolute;border-radius:50%;pointer-events:none;filter:blur(100px);animation:bfloat 14s ease-in-out infinite; }
.blob1 { width:700px;height:700px;background:rgba(100,80,255,.11);top:-300px;left:-250px; }
.blob2 { width:550px;height:550px;background:rgba(74,132,255,.08);bottom:-200px;right:-150px;animation-delay:-7s; }
.blob3 { width:300px;height:300px;background:rgba(155,120,255,.07);top:40%;left:58%;animation-delay:-3.5s; }
@keyframes bfloat { 0%,100%{transform:scale(1) translate(0,0)} 33%{transform:scale(1.06) translate(20px,-25px)} 66%{transform:scale(.95) translate(-12px,18px)} }

.grid-bg { position:absolute;inset:0;background-image:linear-gradient(rgba(100,80,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(100,80,255,.03) 1px,transparent 1px);background-size:52px 52px;animation:gridScroll 28s linear infinite; }
@keyframes gridScroll { from{transform:translateY(0)} to{transform:translateY(52px)} }

/* animations */
@keyframes up { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.72)} }
@keyframes pdot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.7)} }
@keyframes spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

/* buttons */
.btn-primary { display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--accent),var(--ab));color:#fff;text-decoration:none;border:none;padding:12px 26px;border-radius:11px;font-family:'Outfit',sans-serif;font-weight:700;font-size:.92rem;box-shadow:0 0 24px rgba(100,80,255,.48),0 4px 18px rgba(0,0,0,.4);transition:transform .2s,box-shadow .2s; }
.btn-primary:hover { transform:translateY(-3px);box-shadow:0 0 42px rgba(100,80,255,.72),0 8px 28px rgba(0,0,0,.5); }
.btn-ghost { display:inline-flex;align-items:center;gap:7px;background:transparent;border:1px solid var(--border2);color:var(--text);text-decoration:none;padding:12px 22px;border-radius:11px;font-family:'Outfit',sans-serif;font-weight:600;font-size:.92rem;transition:all .2s; }
.btn-ghost:hover { background:var(--s2);border-color:var(--border3);transform:translateY(-2px); }

/* text helpers */
.grad { background:linear-gradient(110deg,var(--accent) 0%,var(--ac) 48%,var(--ab) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.grad-white { background:linear-gradient(135deg,#fff 35%,var(--ad));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }

/* section headers */
.sec-eye { font-size:.68rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:10px; }
.sec-h { font-size:clamp(1.9rem,4.5vw,3rem);font-weight:900;letter-spacing:-1px;line-height:1.1;margin-bottom:12px; }
.sec-sub { color:var(--muted);max-width:450px;font-size:.96rem;line-height:1.72;margin-bottom:48px; }

/* pills */
.pill { display:flex;align-items:center;gap:5px;padding:4px 11px;border-radius:99px;font-size:.75rem;font-weight:700;white-space:nowrap; }
.pill-up  { background:rgba(35,209,139,.09);color:var(--green);border:1px solid rgba(35,209,139,.22); }
.pill-deg { background:rgba(250,168,26,.09);color:var(--yellow);border:1px solid rgba(250,168,26,.22); }
.pill-dn  { background:rgba(240,71,71,.09);color:var(--red);border:1px solid rgba(240,71,71,.22); }
.pill-d { width:5px;height:5px;border-radius:50%;background:currentColor; }
.pill-up .pill-d { animation:pdot 2s infinite; }

/* misc */
.spinner { width:16px;height:16px;border:2px solid rgba(255,255,255,.15);border-top-color:currentColor;border-radius:50%;animation:spin .7s linear infinite;display:inline-block; }
.mono { font-family:'JetBrains Mono',monospace;font-size:.82em;background:var(--s3);padding:1px 6px;border-radius:4px;color:var(--ac); }
.tcur { animation:blink .85s steps(1) infinite; }

/* toast */
.toast { position:fixed;bottom:24px;right:24px;z-index:10000;padding:12px 20px;border-radius:11px;font-weight:600;font-size:.88rem;border:1px solid;animation:up .3s ease;pointer-events:none; }
.toast-ok   { background:rgba(35,209,139,.12);color:var(--green);border-color:rgba(35,209,139,.28); }
.toast-err  { background:rgba(240,71,71,.12);color:var(--red);border-color:rgba(240,71,71,.28); }
.toast-info { background:rgba(100,80,255,.12);color:var(--ac);border-color:var(--border2); }

/* footer */
footer { background:var(--s1);border-top:1px solid var(--border);padding:48px 36px 28px; }
.footer-inner { max-width:1060px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px; }
.footer-brand-name { font-weight:900;font-size:1.05rem;margin-bottom:7px; }
.footer-tag { font-size:.82rem;color:var(--muted);max-width:200px;line-height:1.6; }
.footer-col h4 { font-size:.66rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:12px; }
.footer-col a { display:block;color:var(--text2);text-decoration:none;font-size:.86rem;margin-bottom:7px;opacity:.65;transition:opacity .18s; }
.footer-col a:hover { opacity:1; }
.footer-bottom { max-width:1060px;margin:24px auto 0;padding-top:20px;border-top:1px solid var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:.74rem;color:var(--muted); }
.footer-bottom span:last-child { color:var(--ac); }

@media(max-width:640px) {
  .nav { padding:0 16px; }
  .nav-links a:not(.nav-cta) { display:none; }
}