@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=DM+Sans:wght@300;400;500;600;700&family=Manrope:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap";
:root{--cosmic-black:#0a0a0f;--deep-space:#13131f;--dark-matter:#1a1a2e;--electric-blue:#00c2ff;--electric-blue-glow:#00c2ff4d;--neon-orange:#ff6b35;--neon-orange-glow:#ff6b354d;--cyber-green:#39ff14;--cyber-purple:#b44bff;--black:#000;--gray-900:#0a0a0a;--gray-800:#1a1a1a;--gray-700:#2d2d2d;--gray-600:#3a3a3a;--gray-500:#4a4a4a;--gray-400:#5a5a5a;--gray-300:#6a6a6a;--gray-200:#8a8a8a;--gray-100:#ccc;--gray-50:#e0e0e0;--white:#fff;--accent-900:#3a4a5a;--accent-800:#4a5a6a;--accent-700:#5a6a7a;--accent-600:#6a7a8a;--accent-500:#7a8a9a;--accent-400:#8a9aaa;--accent-300:#9aaaba;--accent-200:#aabaca;--accent-100:#bacada;--accent-50:#cadaea;--text:#e8e8e8;--text-dark:#1a1a1a;--text-muted:#9a9aa8;--bg-1:#0a0a0f;--bg-2:#13131f;--bg-3:#1a1a2e;--accent:#00c2ff;--accent-dark:#09c;--accent-light:#33cfff;--accent-hover:#33cfff;--accent-secondary:#ff6b35;--mountain-1:#1a1a2e;--mountain-2:#2d2d3a;--mountain-3:#3a3a4a;--mountain-4:#4a4a5a;--cloud:#00c2ff14;--success:#39ff14;--font-display:"DM Sans",sans-serif;--font-hero:"Space Grotesk",sans-serif;--font-body:"DM Sans",sans-serif;--font-mono:"JetBrains Mono",monospace;--weight-light:300;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--tracking-tighter:-.05em;--tracking-tight:-.025em;--tracking-normal:0;--tracking-wide:.025em;--tracking-widest:.1em;--glass-bg-subtle:#13131f66;--glass-bg-medium:#13131f99;--glass-bg-strong:#13131fcc;--glass-inset-white:#ffffff1a;--glass-inset-blue:#00c2ff26;--shadow-glow-blue:0 0 40px #00c2ff26;--shadow-elevation-1:0 4px 16px #0000004d;--shadow-elevation-2:0 8px 32px #0006;--shadow-elevation-3:0 16px 48px #00000080;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-5:40px;--space-6:48px;--space-7:56px;--space-8:64px;--space-9:72px;--space-10:80px;--space-12:96px;--space-14:112px;--space-15:120px;--space-16:128px;--space-18:144px;--space-20:160px}
*{box-sizing:border-box;margin:0;padding:0}body{color:#e8e8e8;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(at top,#1a1a2e 0%,#0a0a0f 50%);min-height:100vh;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.7;position:relative;overflow-x:hidden}body>*{z-index:2;position:relative}body,p,span,div{color:var(--text)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text);line-height:1.1}h1{letter-spacing:var(--tracking-tighter);font-size:clamp(2.5rem,5vw,4.5rem);font-weight:700}h2{letter-spacing:var(--tracking-tight);font-size:clamp(2rem,4vw,3.5rem);font-weight:600}h3{letter-spacing:var(--tracking-tight);font-size:clamp(1.5rem,3vw,2.25rem);font-weight:600}h4{letter-spacing:var(--tracking-normal);font-size:clamp(1.25rem,2.5vw,1.75rem);font-weight:600}h5{letter-spacing:var(--tracking-normal);font-size:1.125rem;font-weight:600}h6{letter-spacing:var(--tracking-wide);text-transform:uppercase;font-size:1rem;font-weight:600}code,pre{font-family:var(--font-mono)}body,p,span,div,a,button,input,textarea,select,label,li,td,th{font-family:var(--font-body);font-weight:400}h1,h2,h3,h4,h5,h6{font-family:var(--font-display)}p{letter-spacing:-.01em;margin-bottom:1.2em;line-height:1.75}a{color:var(--accent);transition:color .2s}a:hover{color:var(--accent-hover)}#root{min-height:100vh;position:relative}.container{max-width:1200px;padding:0 var(--space-3);margin:0 auto}.btn-primary{padding:var(--space-2)var(--space-3);background:var(--electric-blue);color:var(--cosmic-black);font-weight:600;font-family:var(--font-body);letter-spacing:.02em;border:none;border-radius:0;font-size:.95em;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-block;position:relative;overflow:hidden}.btn-primary:before{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.btn-primary:hover:before{left:100%}.btn-primary:hover{background:var(--accent-light);color:var(--cosmic-black);transform:translateY(-2px);box-shadow:0 8px 24px #0003}.btn-primary:active{transition:transform .1s,box-shadow .1s;transform:scale(.97)translateY(0);box-shadow:0 2px 8px #0000004d}.btn-primary:focus-visible{outline:2px solid var(--electric-blue);outline-offset:3px}.btn-large{padding:var(--space-2)var(--space-4);font-size:var(--space-2)}.btn-secondary{padding:var(--space-2)var(--space-3);color:var(--electric-blue);border:2px solid var(--electric-blue);font-weight:600;font-family:var(--font-body);letter-spacing:.02em;background:0 0;border-radius:0;font-size:.95em;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-block;position:relative;overflow:hidden}.btn-secondary:before{content:"";background:var(--electric-blue);z-index:-1;width:0;height:100%;transition:width .3s;position:absolute;top:0;left:0}.btn-secondary:hover:before{width:100%}.btn-secondary:hover{color:var(--cosmic-black);border-color:var(--electric-blue);box-shadow:0 0 20px #0003}.btn-secondary:active{transition:transform .1s;transform:scale(.97)}.btn-secondary:focus-visible{outline:2px solid var(--electric-blue);outline-offset:3px}.card{background:linear-gradient(135deg,var(--glass-bg-medium)0%,#0a0a0f80 100%);-webkit-backdrop-filter:blur(20px)saturate(180%)brightness(1.05);padding:var(--space-6);margin-bottom:var(--space-5);box-shadow:inset 0 1px 0 var(--glass-inset-white),inset 0 0 20px #00c2ff0d,var(--shadow-elevation-2);border:1px solid #00c2ff4d;border-radius:0;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative}.card:before{content:"";opacity:0;pointer-events:none;background:linear-gradient(135deg,#00c2ff1a 0%,#0000 50%,#b44bff0d 100%);transition:opacity .4s;position:absolute;inset:0}.card:hover:before{opacity:1}.card:hover{box-shadow:inset 0 1px 0 #ffffff26,inset 0 0 30px #00c2ff1a,var(--shadow-elevation-3),0 0 60px #00c2ff26;border-color:#00c2ff99;transform:translateY(-6px)}.card-nested{padding:var(--space-3);margin:var(--space-3)0;background:#2d2d2d99;border:1px solid #7a8a9a26;border-radius:0}.card-nested-small{padding:var(--space-3);background:#ffffff0d;border:1px solid #7a8a9a26;border-radius:0}.card-code{padding:var(--space-3);background:#0000004d;border:1px solid #7a8a9a33;border-radius:0}.card-accent-left{border-left:4px solid var(--accent);padding:var(--space-3);margin:var(--space-3)0;background:#ffffff0d;border-radius:0}@media (max-width:768px){.container{padding:0 var(--space-3)}.card{padding:var(--space-3)}}@media (max-width:640px){.container{padding:0 var(--space-2);max-width:100%}}@media (max-width:480px){.container{padding:0 var(--space-2)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes glow-pulse{0%,to{opacity:.5}50%{opacity:1}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInFromLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}@keyframes slideInFromRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}.animate-fadeIn{animation:.8s forwards fadeIn}.animate-fadeInUp{animation:.8s forwards fadeInUp}.animate-float{animation:6s ease-in-out infinite float}.text-gradient-primary{background:linear-gradient(135deg,var(--electric-blue)0%,#66d9ff 50%,var(--electric-blue)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.text-gradient-secondary{background:linear-gradient(135deg,var(--electric-blue)0%,var(--cyber-purple)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.text-glow{text-shadow:0 0 10px var(--electric-blue-glow),0 0 20px var(--electric-blue-glow),0 0 40px #00c2ff1a}.text-glow-subtle{text-shadow:0 0 20px var(--electric-blue-glow)}.card-flat{-webkit-backdrop-filter:blur(8px)saturate(120%);background:#0a0a0f66;border:1px solid #ffffff0d;box-shadow:inset 0 2px 4px #0000004d}.card-raised{background:linear-gradient(135deg,var(--glass-bg-medium)0%,#0d0d1480 100%);-webkit-backdrop-filter:blur(16px)saturate(160%)brightness(1.02);box-shadow:inset 0 1px 0 var(--glass-inset-white),var(--shadow-elevation-1),0 0 1px #00c2ff4d;border:1px solid #00c2ff33;transition:all .4s cubic-bezier(.4,0,.2,1)}.card-raised:hover{box-shadow:inset 0 1px 0 #ffffff1f,var(--shadow-elevation-2),0 0 40px #00c2ff1a;border-color:#00c2ff66;transform:translateY(-4px)}.card-floating{background:linear-gradient(145deg,#1a1a2ebf 0%,var(--glass-bg-medium)50%,#0a0a0f80 100%);-webkit-backdrop-filter:blur(24px)saturate(180%)brightness(1.05);box-shadow:inset 0 1px 0 #ffffff1f,inset 0 0 30px #00c2ff14,var(--shadow-elevation-2),var(--shadow-glow-blue);border:1px solid #00c2ff59;transition:all .4s cubic-bezier(.4,0,.2,1)}.card-floating:hover{box-shadow:inset 0 1px 0 #ffffff26,inset 0 0 40px #00c2ff1f,var(--shadow-elevation-3),0 0 80px #00c2ff33;border-color:#00c2ff80;transform:translateY(-8px)scale(1.01)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
.binary-background{z-index:0;pointer-events:none;will-change:transform;background:radial-gradient(at top,#1a1a1a66 0%,#0000 50%),radial-gradient(at bottom,#2d2d2d33 0%,#0000 50%),linear-gradient(#0a0a0a 0%,#000 100%);width:100%;height:100vh;position:fixed;top:0;left:0}.binary-background:before{content:"";opacity:.3;pointer-events:none;background-image:repeating-linear-gradient(0deg,#0000,#0000 2px,#ffffff03 2px 4px);width:100%;height:100%;position:absolute;top:0;left:0}
.morphing-gradient{opacity:.35;pointer-events:none;background:radial-gradient(circle at 20% 20%,#00d4ff0f 0%,#0000 50%),radial-gradient(circle at 80% 80%,#0099ff0d 0%,#0000 50%),radial-gradient(circle,#1e90ff0a 0%,#0000 60%);width:100%;height:100%;animation:15s infinite morphGradient;top:0;left:0;z-index:1!important;position:fixed!important}@keyframes morphGradient{0%,to{background-position:0 0,100% 100%,50%;background-size:100% 100%,100% 100%,100% 100%}33%{background-position:100% 0,0 100%,80% 20%;background-size:120% 120%,120% 120%,120% 120%}66%{background-position:0 100%,100% 0,20% 80%;background-size:110% 110%,110% 110%,110% 110%}}.particle-canvas{pointer-events:none;width:100%;height:100%;top:0;left:0;z-index:1!important;position:fixed!important}#root,main,section,header,footer{z-index:auto;position:relative}@keyframes holographic-pulse{0%,to{box-shadow:0 0 20px #00d4ff1a}50%{box-shadow:0 0 40px #00d4ff33}}@media (prefers-reduced-motion:reduce){.morphing-gradient{animation:none}.particle-canvas{display:none}}@media (max-width:768px){.morphing-gradient,.particle-canvas{display:none}}
.floating-orbs-container{z-index:0;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.floating-orb{will-change:transform;border-radius:50%;animation:ease-in-out infinite orbFloat;position:absolute}.orb-blue{background:radial-gradient(circle,#00c2ff99 0%,#0000 70%)}.orb-purple{background:radial-gradient(circle,#b44bff80 0%,#0000 70%)}.orb-cyan{background:radial-gradient(circle,#00d4ff80 0%,#0000 70%)}@keyframes orbFloat{0%,to{transform:translate(0)scale(1)}25%{transform:translate(30px,-20px)scale(1.05)}50%{transform:translate(-20px,30px)scale(.95)}75%{transform:translate(10px,10px)scale(1.02)}}@media (prefers-reduced-motion:reduce){.floating-orb{animation:none}}@media (max-width:768px){.floating-orbs-container{display:none}}