:root{--navy-950: #080D16;--navy-900: #0D1525;--navy-800: #111927;--navy-700: #162035;--navy-600: #1E2D40;--white: #ffffff;--accent: #ffffff;--accent-muted: rgba(255, 255, 255, .7);--accent-subtle: rgba(255, 255, 255, .1);--font-display: "Syne", sans-serif;--font-body: "DM Sans", sans-serif;--transition-base: .3s ease;--transition-slow: .6s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-family:var(--font-body);background-color:var(--navy-950);color:#e2e8f0}body{overflow-x:hidden;position:relative}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--navy-900)}::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff80}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) var(--navy-900)}.grain{pointer-events:none;position:fixed;inset:-200%;width:400%;height:400%;z-index:9998;opacity:.022;animation:grainPulse 8s ease infinite;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}@keyframes grainPulse{0%,to{opacity:.018;transform:translate(0)}25%{opacity:.028;transform:translate(-1%,1%)}50%{opacity:.022;transform:translate(1%,-1%)}75%{opacity:.025;transform:translate(-.5%,.5%)}}.dot-grid-overlay{position:absolute;inset:0;z-index:0;background-image:radial-gradient(circle,rgba(255,255,255,.05) 1px,transparent 1px);background-size:32px 32px;animation:dotGridDrift 20s linear infinite;pointer-events:none}@keyframes dotGridDrift{0%{background-position:0 0}to{background-position:32px 32px}}.glow-orb{border-radius:50%;filter:blur(80px);animation:float 6s ease-in-out infinite alternate;pointer-events:none;position:absolute}.glow-orb-cyan{background:radial-gradient(circle,rgba(255,255,255,.03) 0%,transparent 70%)}.glow-orb-blue{background:radial-gradient(circle,rgba(255,255,255,.02) 0%,transparent 70%);animation-delay:-3s}@keyframes float{0%{transform:translateY(0) translate(0) scale(1)}33%{transform:translateY(-20px) translate(10px) scale(1.03)}66%{transform:translateY(-10px) translate(-8px) scale(.98)}to{transform:translateY(-30px) translate(5px) scale(1.05)}}.glow-cyan{box-shadow:0 0 20px #ffffff1a}.glow-cyan-strong{box-shadow:0 0 30px #ffffff26,0 0 60px #ffffff0d}.hero-gradient{background:linear-gradient(135deg,var(--navy-950) 0%,var(--navy-900) 50%,#0a1628 100%);animation:gradientShift 12s ease infinite alternate}@keyframes gradientShift{0%{background:linear-gradient(135deg,#080d16,#0d1525,#0a1628)}33%{background:linear-gradient(160deg,#080d16,#0a1420 40%,#0d1525)}66%{background:linear-gradient(110deg,#0a1020,#080d16 40%,#0d1525)}to{background:linear-gradient(145deg,#0d1525,#080d16,#0c1422)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.hero-animate>*{opacity:0;animation:fadeUp .7s ease forwards}.hero-animate>*:nth-child(1){animation-delay:.1s}.hero-animate>*:nth-child(2){animation-delay:.3s}.hero-animate>*:nth-child(3){animation-delay:.5s}.hero-animate>*:nth-child(4){animation-delay:.7s}.hero-animate>*:nth-child(5){animation-delay:.9s}.hero-animate>*:nth-child(6){animation-delay:1.1s}.reveal{opacity:0;transform:translateY(30px);transition:opacity var(--transition-slow),transform var(--transition-slow)}.reveal.visible{opacity:1;transform:translateY(0)}.typewriter-cursor{display:inline-block;width:2px;height:1em;background-color:var(--white);margin-left:2px;vertical-align:text-bottom;animation:blink 1s step-end infinite}.cursor-blink{animation:blink 1s step-end infinite}.cursor-off{animation:none;opacity:1}#navbar{transition:background-color .4s ease,backdrop-filter .4s ease,box-shadow .4s ease}#navbar.scrolled{background-color:#080d16e6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px #ffffff0d,0 4px 20px #0006}.nav-link{position:relative;padding-bottom:3px;transition:color var(--transition-base)}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:0%;height:2px;background:var(--white);border-radius:1px;transition:width .3s ease}.nav-link:hover:after,.nav-link.active:after{width:100%}.nav-link.active{color:var(--white)}.hamburger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:4px;z-index:60}.hamburger span{display:block;width:24px;height:2px;background-color:#e2e8f0;border-radius:2px;transition:transform .3s ease,opacity .3s ease,width .3s ease;transform-origin:center}.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}#mobile-menu{display:none;animation:slideDown .3s ease forwards;border-top:1px solid rgba(0,212,255,.1)}#mobile-menu.open{display:block}.mobile-nav-link{position:relative;transition:color var(--transition-base),background-color var(--transition-base)}.mobile-nav-link:hover,.mobile-nav-link.active{color:var(--white);background-color:#ffffff0d}.btn-primary{background:#fff;color:#000;font-weight:700;border-radius:0;padding:12px 28px;transition:transform var(--transition-base),box-shadow var(--transition-base),filter var(--transition-base);cursor:pointer;border:none;font-family:var(--font-body);font-size:.95rem;letter-spacing:.02em;display:inline-flex;align-items:center;gap:8px}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px #ffffff26;background:#fff;opacity:.9}.btn-outline{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 2rem;background:transparent;color:var(--white);font-size:.95rem;font-weight:600;border:1px solid rgba(255,255,255,.2);border-radius:0;text-decoration:none;transition:all .3s ease;cursor:pointer;font-family:var(--font-body);letter-spacing:.02em}.btn-outline:hover{background:var(--white);color:var(--navy-950);border-color:var(--white);transform:translateY(-2px);box-shadow:0 8px 24px #ffffff26}.stat-card{background:linear-gradient(135deg,#162035cc,#111927e6);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:24px 20px;text-align:center;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.stat-card:hover{transform:translateY(-4px);border-color:#ffffff26;box-shadow:0 8px 30px #0000004d}.tech-card{background:linear-gradient(135deg,#162035b3,#111927cc);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base);cursor:default}.tech-card:hover{transform:translateY(-6px);border-color:#ffffff26;box-shadow:0 8px 25px #00000059}.tech-card img{width:40px;height:40px;-o-object-fit:contain;object-fit:contain;transition:transform .3s ease}.tech-card:hover img{transform:scale(1.12)}.tech-card-fallback{width:40px;height:40px;border-radius:8px;background:linear-gradient(135deg,var(--navy-700),var(--navy-600));display:flex;align-items:center;justify-content:center;font-size:.6rem;color:var(--white);font-weight:700;text-align:center;border:1px solid rgba(255,255,255,.1)}.project-card{background:linear-gradient(135deg,#162035d9,#111927f2);border:1px solid rgba(255,255,255,.06);border-radius:16px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;display:flex;flex-direction:column}.project-card:hover{transform:translateY(-6px);border-color:#ffffff26;box-shadow:0 16px 40px #0006}.project-thumbnail{width:100%;height:180px;position:relative;overflow:hidden;flex-shrink:0}.project-thumbnail:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(13,21,37,.7) 100%)}.project-badge-num{position:absolute;top:12px;left:12px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:var(--white);font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.1em;padding:3px 10px;border-radius:20px;z-index:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.duration-badge{font-size:.7rem;padding:3px 10px;border-radius:20px;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);color:var(--slate-300);display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.tech-badge{font-size:.7rem;padding:3px 10px;border-radius:20px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);color:var(--slate-300);white-space:nowrap}.icon-btn{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:600;padding:6px 14px;border-radius:6px;border:1px solid rgba(255,255,255,.15);color:#ffffffb3;background:#ffffff0a;transition:background var(--transition-base),color var(--transition-base),border-color var(--transition-base);cursor:pointer;text-decoration:none}.icon-btn:hover{background:#ffffff14;color:var(--white);border-color:#ffffff40}.section-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);margin:0}.contact-card{background:linear-gradient(135deg,#16203599,#111927cc);border:1px solid rgba(0,212,255,.15);border-radius:20px;padding:64px 40px;text-align:center;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.contact-card:before{content:"";position:absolute;top:-50%;left:50%;transform:translate(-50%);width:400px;height:300px;background:radial-gradient(ellipse,rgba(0,212,255,.07) 0%,transparent 70%);pointer-events:none}.section-label{font-size:.75rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan-400);display:inline-block}footer{border-top:1px solid rgba(0,212,255,.06)}.view-all-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 32px;border:1.5px solid rgba(0,212,255,.35);border-radius:8px;color:var(--cyan-400);font-weight:600;font-size:.95rem;transition:all var(--transition-base);text-decoration:none;background:#00d4ff0a}.view-all-btn:hover{background:#00d4ff1a;border-color:var(--cyan-400);box-shadow:0 0 20px #00d4ff33;transform:translate(4px)}.about-bio{font-size:1.05rem;line-height:1.9;color:#e2e8f0d9}.vercel-logo{filter:invert(1)}.thumb-1{background:linear-gradient(135deg,#0a2a3d,#003d5c 40%,#001e2e)}.thumb-2{background:linear-gradient(135deg,#001428,#036 40%,#00224d)}.thumb-3{background:linear-gradient(135deg,#0d1e3d,#1a3a6b 40%,#0a1428)}.thumb-4{background:linear-gradient(135deg,#001c2e,#046 40%,#001428)}.thumb-5{background:linear-gradient(135deg,#0a1e35,#024 40%,#001428)}.thumb-6{background:linear-gradient(135deg,#001828,#045 40%,#001c2e)}.thumb-inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}@media(max-width:768px){.contact-card{padding:48px 24px}}@media(max-width:480px){.hero-animate>*{animation-duration:.5s}}@keyframes shimmerSweep{0%{background-position:-200% 0}to{background-position:200% 0}}.featured-shimmer{background:linear-gradient(90deg,#ffffff0a 25%,#ffffff1a,#ffffff0a 75%);background-size:200% 100%;animation:shimmerSweep 1.5s ease-in-out infinite;border-radius:6px}.featured-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ffffff26;transition:background .4s ease,transform .4s ease,box-shadow .4s ease;cursor:default}.featured-dot.active{background:var(--color-cyan, #00D4FF);transform:scale(1.35);box-shadow:0 0 10px #00d4ff8c}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
