@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";
:root{--background:#0a0a0f;--foreground:#fafafa;--primary:#a78bfa;--primary-bright:#c4b5fd;--accent:#06b6d4;--accent-pink:#ec4899;--accent-orange:#fb923c;--gray-50:#fafafa;--gray-100:#f4f4f5;--gray-200:#e4e4e7;--gray-300:#d4d4d8;--gray-400:#a1a1aa;--gray-500:#71717a;--gray-600:#52525b;--gray-700:#3f3f46;--gray-800:#27272a;--gray-900:#18181b;--glass-bg:#ffffff08;--glass-border:#ffffff14;--card-hover:#ffffff0d;--glow-purple:#a78bfa66;--glow-cyan:#06b6d466;--shadow-lg:0 20px 50px -12px #00000080;--font-display:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono","Courier New",monospace;--spacing-xs:.5rem;--spacing-sm:1rem;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--spacing-2xl:4rem;--spacing-3xl:6rem;--dock-bg:#0a0a0f66;--dock-border:#ffffff14}[data-theme=light]{--background:#fff;--foreground:#0a0a0f;--primary:#7c3aed;--primary-bright:#6d28d9;--accent:#0891b2;--gray-50:#0a0a0f;--gray-100:#18181b;--gray-200:#27272a;--gray-300:#3f3f46;--gray-400:#52525b;--gray-500:#71717a;--gray-600:#a1a1aa;--gray-700:#d4d4d8;--gray-800:#e4e4e7;--gray-900:#f4f4f5;--glass-bg:#ffffffb3;--glass-border:#00000026;--card-hover:#0000000d;--glow-purple:#7c3aed4d;--glow-cyan:#0891b24d;--dock-bg:#ffffffbf;--dock-border:#0000001a}*{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:var(--background);border-left:1px solid var(--glass-border)}::-webkit-scrollbar-thumb{background:var(--glass-bg);border:2px solid var(--background);border-radius:6px;transition:background .3s}::-webkit-scrollbar-thumb:hover{background:var(--primary)}*{scrollbar-width:thin;scrollbar-color:var(--glass-bg)var(--background)}html{scroll-behavior:smooth;overflow-x:hidden}body{font-family:var(--font-display);background-color:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.7;position:relative;overflow-x:hidden}body:before{content:"";z-index:-2;pointer-events:none;background:radial-gradient(circle at 20%,#a78bfa14 0%,#0000 50%),radial-gradient(circle at 80% 80%,#06b6d414 0%,#0000 50%),radial-gradient(circle at 40% 20%,#ec48990d 0%,#0000 50%);width:200%;height:200%;animation:20s infinite gradientShift;position:fixed;top:-50%;left:-50%}@keyframes gradientShift{0%,to{transform:translate(0)rotate(0)}33%{transform:translate(-5%,-5%)rotate(5deg)}66%{transform:translate(5%,5%)rotate(-5deg)}}body:after{content:"";z-index:-1;pointer-events:none;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:60px 60px;width:100%;height:100%;position:fixed;top:0;left:0;-webkit-mask-image:radial-gradient(80% 60%,#000 40%,#0000 100%);mask-image:radial-gradient(80% 60%,#000 40%,#0000 100%)}h1,h2,h3,h4,h5,h6{letter-spacing:-.03em;font-weight:700;line-height:1.2}h1{background:linear-gradient(135deg,var(--foreground)0%,var(--gray-400)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:clamp(3rem,8vw,7rem);font-weight:700}h2{margin-bottom:var(--spacing-lg);font-size:clamp(2rem,5vw,3.5rem);display:inline-block;position:relative}h2:after{content:"";background:linear-gradient(90deg,var(--primary),transparent);border-radius:2px;width:100%;height:3px;position:absolute;bottom:-.5rem;left:0}h3{font-size:clamp(1.25rem,3vw,1.75rem);font-weight:600}p{color:var(--gray-300);font-size:clamp(1rem,2vw,1.125rem);line-height:1.8}main{z-index:1;position:relative}section{padding:var(--spacing-3xl)var(--spacing-md);max-width:1400px;margin:0 auto;position:relative}.hero{justify-content:center;gap:var(--spacing-xl);min-height:100vh;padding:var(--spacing-3xl)var(--spacing-md);flex-direction:column;display:flex;position:relative}.hero-content{justify-content:space-between;align-items:center;gap:var(--spacing-2xl);width:100%;display:flex}.hero-text{gap:var(--spacing-xl);flex-direction:column;flex:1;min-width:0;display:flex}.hero-image-wrapper{flex-shrink:0;animation:1s ease-out .3s both fadeInUp;position:relative}.hero-image-glow{background:radial-gradient(circle,var(--glow-purple)0%,transparent 70%);filter:blur(20px);z-index:0;border-radius:50%;animation:4s ease-in-out infinite pulseGlow;position:absolute;inset:-20px}@keyframes pulseGlow{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.hero-image{z-index:1;object-fit:cover;border:2px solid var(--glass-border);width:280px;height:280px;box-shadow:0 0 0 1px var(--glass-border),var(--shadow-lg);filter:brightness(.95)contrast(1.05);border-radius:50%;transition:transform .4s cubic-bezier(.23,1,.32,1),box-shadow .4s;position:relative}.hero-image:hover{box-shadow:0 0 0 2px var(--primary),var(--shadow-lg),0 0 40px var(--glow-purple);transform:scale(1.03)}.hero h1{animation:1s ease-out fadeInUp;position:relative}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.tagline{font-family:var(--font-mono);color:var(--primary-bright);align-items:center;gap:.75rem;font-size:clamp(1rem,2vw,1.5rem);font-weight:500;animation:1s ease-out .2s both fadeInUp;display:flex}.tagline:before{content:">";color:var(--accent);font-weight:700}.tagline:after{content:"█";animation:1.2s step-end infinite blink}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.hero-sub{max-width:700px;color:var(--gray-300);padding-left:var(--spacing-md);border-left:3px solid var(--glass-border);font-size:clamp(1.125rem,2.5vw,1.5rem);line-height:1.7;animation:1s ease-out .4s both fadeInUp}.social-links{gap:var(--spacing-md);flex-wrap:wrap;animation:1s ease-out .6s both fadeInUp;display:flex}.btn{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--foreground);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:.5rem;padding:1rem 2rem;font-size:.9rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.btn:hover{border-color:var(--primary);box-shadow:0 10px 30px -10px var(--glow-purple);transform:translateY(-2px)}.btn:hover:before{left:100%}.grid{gap:var(--spacing-lg);margin-top:var(--spacing-xl);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));display:grid}.bento-grid{gap:var(--spacing-lg);margin-top:var(--spacing-xl);grid-template-columns:repeat(auto-fit,minmax(380px,1fr));display:grid}.card{background:var(--glass-bg);border:1px solid var(--glass-border);padding:var(--spacing-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);will-change:transform;border-radius:1rem;flex-direction:column;height:100%;min-height:320px;transition:all .4s cubic-bezier(.25,.46,.45,.94);display:flex;position:relative;overflow:hidden}.card:before{content:"";background:linear-gradient(90deg,var(--primary),var(--accent),transparent);opacity:0;height:2px;transition:opacity .4s;position:absolute;top:0;left:0;right:0}.card:hover{background:var(--card-hover);border-color:var(--primary);box-shadow:0 20px 40px -20px var(--glow-purple);transform:translateY(-8px)scale(1.02)}.card:hover:before{opacity:1}.card-reveal{opacity:0;max-height:0;color:var(--gray-400);flex-direction:column;gap:1rem;margin-top:0;font-size:.95rem;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.card:hover .card-reveal{opacity:1;max-height:300px;margin-top:var(--spacing-sm)}.card-actions{gap:.75rem;margin-top:.5rem;display:flex}.action-btn{font-family:var(--font-mono);text-align:center;cursor:pointer;text-transform:uppercase;border-radius:.5rem;flex:1;padding:.5rem 1rem;font-size:.8rem;font-weight:600;text-decoration:none;transition:all .2s}.action-btn.github{border:1px solid var(--glass-border);color:var(--gray-300);background:#ffffff05}.action-btn.github:hover{border-color:var(--gray-300);color:#fff;background:#ffffff14}.action-btn.demo{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;box-shadow:0 4px 12px -4px var(--glow-cyan);border:none}.action-btn.demo:hover{box-shadow:0 6px 16px -4px var(--glow-cyan);filter:brightness(1.1)}.card-header{justify-content:space-between;align-items:flex-start;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);display:flex}.card-content{gap:var(--spacing-sm);z-index:2;flex-direction:column;flex-grow:1;display:flex}.type-badge{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;white-space:nowrap;box-shadow:0 4px 12px -4px var(--glow-purple);border-radius:999px;padding:.35rem .75rem;font-size:.7rem;font-weight:600}.tech-stack{padding-top:var(--spacing-md);border-top:1px solid var(--glass-border);flex-wrap:wrap;gap:.5rem;margin-top:auto;transition:border-color .3s;display:flex}.card:hover .tech-stack{border-color:#a78bfa4d}.tech-tag{font-family:var(--font-mono);border:1px solid var(--glass-border);color:var(--gray-400);background:#ffffff05;border-radius:.375rem;padding:.4rem .8rem;font-size:.75rem;transition:all .2s}.card:hover .tech-tag{border-color:var(--primary);color:var(--primary-bright);background:#a78bfa0d}.theme-toggle{z-index:1000;background:var(--glass-bg);border:1px solid var(--glass-border);width:48px;height:48px;color:var(--foreground);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50%;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:2rem;right:2rem}.theme-toggle:hover{border-color:var(--primary);box-shadow:0 8px 24px -8px var(--glow-purple);transform:scale(1.1)rotate(15deg)}.theme-toggle svg{transition:transform .3s}.theme-toggle:hover svg{transform:rotate(15deg)}.skill-category{background:var(--glass-bg);border:1px solid var(--glass-border);padding:var(--spacing-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:1rem;transition:all .3s}.skill-category:hover{border-color:var(--primary);background:var(--card-hover)}.skill-category h3{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--primary-bright);margin-bottom:var(--spacing-md);font-size:.9rem}.skill-list{flex-wrap:wrap;gap:.75rem;display:flex}.skill-item{border:1px solid var(--glass-border);color:var(--gray-300);cursor:default;background:#ffffff05;border-radius:.5rem;padding:.6rem 1.2rem;font-size:.95rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.skill-item:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 8px 20px -8px var(--glow-cyan);transform:translateY(-3px)}.footer{text-align:center;padding:var(--spacing-3xl)var(--spacing-md);color:var(--gray-500);border-top:1px solid var(--glass-border);margin-top:var(--spacing-3xl);background:linear-gradient(#0000,#0003)}.footer a{color:var(--gray-400);text-decoration:none;transition:color .3s}.footer a:hover{color:var(--primary)}.text-primary{color:var(--primary)!important}.text-accent{color:var(--accent)}.text-gradient{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-8{margin-bottom:2rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.ml-5{margin-left:1.25rem}.pl-4{padding-left:1rem}.px-0{padding-left:0;padding-right:0}.pt-0{padding-top:0}.block{display:block}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-white{color:var(--gray-50)}.text-slate-300{color:var(--gray-300)}.text-slate-400{color:var(--gray-400)}.font-semibold{font-weight:600}.flex{display:flex}.gap-4{gap:1rem}.flex-1{flex:1}.resume-preview-container{width:100%;height:600px;margin-top:var(--spacing-md);border:1px solid var(--glass-border);background:#0003;border-radius:.75rem;overflow:hidden}.resume-iframe{filter:grayscale()invert()brightness(.8)contrast(1.2);border:none;width:100%;height:100%}[data-theme=light] .resume-iframe{filter:none}.space-y-2>*+*{margin-top:.5rem}.space-y-4>*+*{margin-top:1rem}.list-disc{list-style-type:disc}.list-inside{list-style-position:inside}.min-h-screen{min-height:100vh}.mx-3{margin-left:.75rem;margin-right:.75rem}.transition-colors{transition:color .3s}a{color:inherit;text-decoration:none;transition:all .3s}a:hover{color:var(--primary)}@media (max-width:768px){section{padding:var(--spacing-2xl)var(--spacing-md)}.hero{min-height:auto;padding:var(--spacing-2xl)var(--spacing-md)}.hero-content{text-align:center;flex-direction:column-reverse;align-items:center}.hero-text{align-items:center}.hero-sub{border-left:none;border-top:3px solid var(--glass-border);padding-left:0;padding-top:var(--spacing-sm)}.hero-image{width:200px;height:200px}.grid,.bento-grid{gap:var(--spacing-md);grid-template-columns:1fr}h2:after{width:60px}}@media (max-width:480px){.social-links{flex-direction:column}.btn{text-align:center;width:100%}}@media (prefers-reduced-motion:no-preference){.card{animation:.6s ease-out backwards fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}}.nav-dock-container{z-index:1000;pointer-events:auto;position:fixed;bottom:2rem;left:50%;transform:translate(-50%)}.nav-dock{background:var(--dock-bg);-webkit-backdrop-filter:blur(16px)saturate(180%);backdrop-filter:blur(16px)saturate(180%);border:1px solid var(--dock-border);border-radius:999px;align-items:center;gap:.5rem;padding:.75rem;transition:all .3s cubic-bezier(.25,.46,.45,.94);display:flex;box-shadow:0 4px 30px #0000001a,inset 0 0 20px #a78bfa0d}.nav-dock:hover{border-color:#a78bfa33;box-shadow:0 8px 40px #0006,inset 0 0 30px #a78bfa1a}.nav-item{width:3rem;height:3rem;color:var(--gray-400);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.25,.46,.45,.94);display:flex;position:relative}.nav-item:hover{color:var(--foreground);background:#ffffff0d;transform:translateY(-4px)scale(1.1)}.nav-item.active{color:var(--primary-bright);background:#a78bfa1a;box-shadow:0 0 20px #a78bfa4d}.active-dot{background-color:var(--primary);width:4px;height:4px;box-shadow:0 0 8px var(--primary);border-radius:50%;position:absolute;bottom:4px}.nav-tooltip{background:var(--gray-900);border:1px solid var(--glass-border);color:var(--gray-50);pointer-events:none;opacity:0;white-space:nowrap;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:.5rem;padding:.4rem .8rem;font-size:.75rem;font-weight:500;transition:all .2s ease-out;position:absolute;bottom:150%;left:50%;transform:translate(-50%)translateY(10px);box-shadow:0 4px 12px #0000001a}.nav-item:hover .nav-tooltip{opacity:1;transform:translate(-50%)translateY(0)}@media (max-width:640px){.nav-dock-container{width:calc(100% - 3rem);max-width:400px;bottom:1.5rem}.nav-dock{justify-content:space-around;width:100%}}