:root{--bg-primary:#030508;--bg-secondary:#080b11;--bg-card:#0d121d73;--bg-card-hover:#121929a6;--color-text-primary:#f8fafc;--color-text-secondary:#94a3b8;--color-text-muted:#64748b;--accent-cyan:#00f0ff;--accent-cyan-glow:#00f0ff26;--accent-blue:#0072ff;--accent-blue-glow:#0072ff26;--accent-purple:#a855f7;--accent-purple-glow:#a855f726;--accent-green:#10b981;--accent-green-glow:#10b98126;--accent-pink:#f43f5e;--border-glow:#ffffff0d;--border-glow-active:#00f0ff4d;--font-heading:"Outfit", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"JetBrains Mono", monospace;--transition-fast:.2s ease;--transition-medium:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--color-text-primary);font-family:var(--font-body);min-height:100vh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:-.02em}code,pre{font-family:var(--font-mono)}.bg-grid{z-index:-2;background-image:radial-gradient(circle at 50% 50%, #080f1e80 0%, var(--bg-primary) 100%), linear-gradient(#00f0ff04 1px, transparent 1px), linear-gradient(90deg, #00f0ff04 1px, transparent 1px);background-position:50%;background-size:100% 100%,40px 40px,40px 40px;width:100%;height:100%;position:fixed;top:0;left:0}.bg-glow-cyan{z-index:-1;pointer-events:none;filter:blur(80px);background:radial-gradient(circle,#00f0ff12 0%,#0000 70%);width:50vw;height:50vw;position:fixed;top:-10%;left:-10%}.bg-glow-purple{z-index:-1;pointer-events:none;filter:blur(100px);background:radial-gradient(circle,#a855f70d 0%,#0000 70%);width:60vw;height:60vw;position:fixed;bottom:-10%;right:-10%}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-glow);transition:border-color var(--transition-medium), transform var(--transition-medium), background var(--transition-medium);border-radius:16px;box-shadow:0 8px 32px #0006}.glass-panel:hover{background:var(--bg-card-hover);border-color:#00f0ff26}.btn{font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-fast);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--accent-cyan) 0%, var(--accent-blue) 100%);color:#030508;box-shadow:0 4px 20px #00f0ff40}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px #00f0ff66}.btn-primary:active{transform:translateY(0)}.btn-secondary{color:var(--color-text-primary);background:#ffffff0a;border:1px solid #ffffff14}.btn-secondary:hover{background:#ffffff14;border-color:#ffffff26;transform:translateY(-2px)}.btn-purple{background:linear-gradient(135deg, var(--accent-purple) 0%, #6366f1 100%);color:#fff;box-shadow:0 4px 20px #a855f740}.btn-purple:hover{transform:translateY(-2px);box-shadow:0 6px 24px #a855f766}.glow-badge{letter-spacing:.05em;text-transform:uppercase;color:var(--accent-cyan);background:#00f0ff0d;border:1px solid #00f0ff33;border-radius:9999px;align-items:center;gap:6px;padding:6px 12px;font-size:.75rem;font-weight:600;display:inline-flex;box-shadow:0 0 12px #00f0ff0d}.glow-badge-purple{color:var(--accent-purple);background:#a855f70d;border:1px solid #a855f733}.slider-container{aspect-ratio:16/9;-webkit-user-select:none;user-select:none;border:1px solid #ffffff1a;border-radius:12px;width:100%;position:relative;overflow:hidden}.slider-img{object-fit:cover;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.slider-before{z-index:1}.slider-after{z-index:2}.slider-handle{background-color:var(--accent-cyan);z-index:3;cursor:ew-resize;width:4px;box-shadow:0 0 10px var(--accent-cyan);position:absolute;top:0;bottom:0}.slider-handle-button{border:2px solid var(--accent-cyan);width:36px;height:36px;color:var(--accent-cyan);background-color:#030508;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 15px #00f0ff80}.pulse-indicator{background-color:var(--accent-green);width:8px;height:8px;box-shadow:0 0 8px var(--accent-green);border-radius:50%;animation:2s infinite pulse}.pulse-indicator-red{background-color:var(--accent-pink);box-shadow:0 0 8px var(--accent-pink)}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 6px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.terminal-window{font-family:var(--font-mono);color:#94a3b8;background:#04060a;border:1px solid #ffffff0d;border-radius:8px;max-height:150px;padding:16px;font-size:.8rem;overflow-y:auto}.terminal-line{margin-bottom:6px;line-height:1.4}.terminal-cyan{color:var(--accent-cyan)}.terminal-purple{color:var(--accent-purple)}.terminal-green{color:var(--accent-green)}.grid-container{gap:24px;display:grid}@media (width>=768px){.grid-2col{grid-template-columns:repeat(2,1fr)}.grid-3col{grid-template-columns:repeat(3,1fr)}.grid-4col{grid-template-columns:repeat(4,1fr)}}html{scroll-behavior:smooth}::selection{color:#fff;background:#00f0ff40}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#a855f74d;border-radius:9999px;transition:background .2s}::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.text-outline{-webkit-text-stroke:1px #ffffff40;letter-spacing:-.03em;font-weight:800;transition:-webkit-text-stroke .3s;color:#0000!important}.glass-panel:hover .text-outline{-webkit-text-stroke:1px var(--accent-cyan)}.glass-panel{position:relative;overflow:hidden}.glass-panel:before{content:"";opacity:0;pointer-events:none;background:linear-gradient(135deg,#0000 40%,#00f0ff14 70%,#a855f714 100%);width:100%;height:100%;transition:opacity .5s;position:absolute;top:0;left:0}.glass-panel:hover:before{opacity:1}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}section{animation:.8s cubic-bezier(.16,1,.3,1) both fadeInUp}section:first-of-type{animation-delay:.1s}section:nth-of-type(2){animation-delay:.2s}section:nth-of-type(3){animation-delay:.3s}section:nth-of-type(4){animation-delay:.4s}section:nth-of-type(5){animation-delay:.5s}
