.header{z-index:1000;background:0 0;width:100%;transition:background .4s,box-shadow .4s;position:fixed;top:0;left:0}.header-scrolled{background:var(--nav-bg);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 3px #0000000d}.progress-bar{background:linear-gradient(90deg, var(--primary), var(--accent));z-index:1001;height:3px;transition:width .1s linear;position:fixed;top:0;left:0}.header-nav{justify-content:space-between;align-items:center;height:64px;padding:0 1.5rem;display:flex}.header-logo{background:linear-gradient(135deg, var(--primary), var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.35rem;font-weight:800}.header-links{align-items:center;gap:1.5rem;list-style:none;display:flex}.header-links a{color:var(--text);padding:.25rem 0;font-size:.9rem;font-weight:500;position:relative}.header-links a:after{content:"";background:linear-gradient(90deg, var(--primary), var(--accent));border-radius:1px;width:0;height:2px;transition:width .3s;position:absolute;bottom:-2px;left:0}.header-links a:hover:after{width:100%}.header-social-link{align-items:center;display:flex;color:var(--text-muted)!important;transition:color .2s!important}.header-social-link:hover{color:var(--primary)!important}.header-social-link:after{display:none!important}.hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:4px;padding:4px;display:none}.hamburger-line{background:var(--text);border-radius:2px;width:22px;height:2px;transition:transform .3s,opacity .3s;display:block}.hamburger-line.open:first-child{transform:translateY(6px)rotate(45deg)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:translateY(-6px)rotate(-45deg)}@media (width<=768px){.hamburger{display:flex}.header-links{background:var(--nav-bg);-webkit-backdrop-filter:blur(12px);opacity:0;pointer-events:none;border-bottom:1px solid var(--border);flex-direction:column;gap:1.2rem;width:100%;padding:1.5rem;transition:transform .4s,opacity .4s;position:fixed;top:64px;left:0;transform:translateY(-100%)}.header-links.visible{opacity:1;pointer-events:auto;transform:translateY(0)}}.hero{justify-content:center;align-items:center;min-height:100vh;padding-top:64px;display:flex;position:relative;overflow:hidden}.hero-bg{z-index:0;background:radial-gradient(80% 60% at 20% 30%,#0ea5e91a 0%,#0000 60%),radial-gradient(60% 50% at 80% 70%,#34d39914 0%,#0000 60%),radial-gradient(50% 40%,#bae6fd1f 0%,#0000 60%);animation:12s ease-in-out infinite alternate meshShift;position:absolute;inset:0}@keyframes meshShift{0%{background:radial-gradient(80% 60% at 20% 30%,#0ea5e91a 0%,#0000 60%),radial-gradient(60% 50% at 80% 70%,#34d39914 0%,#0000 60%),radial-gradient(50% 40%,#bae6fd1f 0%,#0000 60%)}50%{background:radial-gradient(70% 55% at 30% 40%,#0ea5e914 0%,#0000 60%),radial-gradient(65% 45% at 70% 60%,#34d3991a 0%,#0000 60%),radial-gradient(45% 50% at 55% 45%,#bae6fd1a 0%,#0000 60%)}to{background:radial-gradient(75% 55% at 25% 35%,#0ea5e91f 0%,#0000 60%),radial-gradient(55% 50% at 75% 65%,#34d3990f 0%,#0000 60%),radial-gradient(50% 45% at 45% 55%,#bae6fd14 0%,#0000 60%)}}.hero-shape{filter:blur(60px);opacity:.2;pointer-events:none;border-radius:50%;position:absolute}.hero-shape-1{background:#bd93f9;width:300px;height:300px;animation:8s ease-in-out infinite floatA;top:-80px;left:-80px}.hero-shape-2{background:#50fa7b;width:200px;height:200px;animation:10s ease-in-out infinite floatB;bottom:10%;right:5%}@keyframes floatA{0%,to{transform:translate(0)scale(1)}33%{transform:translate(40px,30px)scale(1.05)}66%{transform:translate(-20px,50px)scale(.95)}}@keyframes floatB{0%,to{transform:translate(0)scale(1)}33%{transform:translate(-30px,-20px)scale(1.08)}66%{transform:translate(20px,-40px)scale(.92)}}.floating-icon{z-index:1;opacity:1;pointer-events:none;filter:drop-shadow(0 0 8px);font-size:3.5rem;position:absolute}.floating-js{color:#f7df1e;animation:7s ease-in-out infinite floatJS;top:22%;left:14%}.floating-ts{color:#3178c6;animation:8s ease-in-out infinite floatTS;top:10%;right:15%}.floating-html{color:#e34f26;animation:9s ease-in-out infinite floatHTML;bottom:34%;left:14%}.floating-css{color:#1572b6;animation:6s ease-in-out infinite floatCSS;bottom:26%;right:15%}@keyframes floatJS{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-15px)rotate(5deg)}50%{transform:translateY(5px)rotate(-3deg)}75%{transform:translateY(-8px)rotate(4deg)}}@keyframes floatTS{0%,to{transform:translateY(0)scale(1)}33%{transform:translateY(-12px)scale(1.05)}66%{transform:translateY(8px)scale(.95)}}@keyframes floatHTML{0%,to{transform:translateY(0)rotate(0)}33%{transform:translateY(-10px)rotate(-4deg)}66%{transform:translateY(12px)rotate(3deg)}}@keyframes floatCSS{0%,to{transform:translateY(0)translate(0)}25%{transform:translateY(-8px)translate(5px)}50%{transform:translateY(5px)translate(-3px)}75%{transform:translateY(-12px)translate(4px)}}.hero-content{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:820px;display:flex}.terminal{opacity:0;background:#282a36;border:1px solid #44475a;border-radius:14px;width:100%;transition:opacity .6s ease-out,transform .6s ease-out;overflow:hidden;transform:translateY(20px)scale(.97);box-shadow:0 8px 32px #0003,0 0 40px #bd93f914}.terminal.visible{opacity:1;transform:translateY(0)scale(1)}.terminal-titlebar{background:#1e1f29;border-bottom:1px solid #44475a;align-items:center;padding:.75rem 1.25rem;display:flex;position:relative}.terminal-dots{gap:8px;display:flex}.terminal-dot{border-radius:50%;width:12px;height:12px;transition:opacity .2s}.terminal-dot:hover{opacity:.8}.terminal-dot-red{background:#f55}.terminal-dot-yellow{background:#f1fa8c}.terminal-dot-green{background:#50fa7b}.terminal-title{color:#6272a4;letter-spacing:.3px;font-family:JetBrains Mono,Fira Code,Cascadia Code,monospace;font-size:.8rem;font-weight:500;position:absolute;left:50%;transform:translate(-50%)}.terminal-body{padding:2rem 2rem 1.5rem}.terminal-output{flex:1;min-width:0;font-family:JetBrains Mono,Fira Code,Cascadia Code,monospace;font-size:.85rem;line-height:1.8}.terminal-line{opacity:0;transition:opacity .4s ease-out,transform .4s ease-out;transition-delay:var(--delay,0s);transform:translate(-10px)}.terminal-line.visible{opacity:1;transform:translate(0)}.prompt{color:#50fa7b;margin-right:.3rem;font-weight:700}.cmd{color:#ff79c6}.arrow{color:#6272a4;margin-right:.5rem}.val-name{color:#f8f8f2;font-weight:600}.val-role{color:#bd93f9;font-weight:600}.val-tagline{color:#8be9fd}.output{margin-bottom:.5rem}.prompt-line{margin-top:.75rem}.cursor{color:#f8f8f2;margin-left:.3rem;font-weight:300;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.hero-actions{opacity:0;flex-wrap:wrap;justify-content:center;gap:1rem;transition:opacity .5s ease-out,transform .5s ease-out;display:flex;transform:translateY(10px)}.hero-actions.visible{opacity:1;transform:translateY(0)}.hero-social{opacity:0;gap:.75rem;transition:opacity .5s ease-out,transform .5s ease-out;display:flex;transform:translateY(10px)}.hero-social.visible{opacity:1;transform:translateY(0)}.hero-social a{border:1px solid var(--border);width:42px;height:42px;color:var(--text-muted);border-radius:50%;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.hero-social a:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-3px)scale(1.05);box-shadow:0 4px 12px #0ea5e926}@media (width<=768px){.terminal-body{padding:1.5rem 1rem}.terminal-output{font-size:.78rem}.terminal-title{font-size:.7rem}.floating-icon{font-size:2.2rem}.floating-js{top:24%;left:8%}.floating-ts{right:10%}.floating-html{bottom:36%;left:8%}.floating-css{right:10%}.hero-content{padding:0 1rem}.hero-shape-1{width:150px;height:150px;top:-40px;left:-40px}.hero-shape-2{width:120px;height:120px}}.about-grid{grid-template-columns:1fr 1fr;align-items:start;gap:3rem;display:grid}.about-icon{color:var(--primary);vertical-align:middle;margin-right:.5rem;display:inline-flex}.about-text p{color:var(--text-muted);max-width:500px;margin-bottom:1.25rem;font-size:1.05rem;line-height:1.8}.about-stats{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.stat-card{background:var(--card-bg);border:1px solid var(--border);text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:.4rem;padding:1.5rem 1rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.stat-card:hover{box-shadow:0 8px 25px var(--shadow);border-color:var(--primary-light);transform:translateY(-4px)}.stat-icon{color:var(--primary);font-size:1.5rem}.stat-value{background:linear-gradient(135deg, var(--primary), var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.8rem;font-weight:800}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.8rem;font-weight:500}@media (width<=768px){.about-grid{grid-template-columns:1fr;gap:2rem}.about-text p{max-width:100%}}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:2rem;display:grid}.project-card{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;transition:all .4s cubic-bezier(.4,0,.2,1);overflow:hidden}.project-card:hover{box-shadow:0 16px 40px var(--shadow);border-color:var(--primary-light);transform:translateY(-8px)}.project-img{aspect-ratio:3/2;background:var(--bg-alt);width:100%;position:relative;overflow:hidden}.project-img img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}.project-card:hover .project-img img{transform:scale(1.08)}.project-img-iframe{position:relative}.project-img-iframe iframe{opacity:0;border:none;width:100%;height:100%;transition:opacity .4s;position:absolute;inset:0}.project-img-iframe iframe.iframe-loaded{opacity:1}.iframe-loading{background:var(--bg-alt);color:var(--text-muted);z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;font-size:.85rem;display:flex;position:absolute;inset:0}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.project-body{padding:1.5rem}.project-title{color:var(--text);margin-bottom:.5rem;font-size:1.2rem;font-weight:700}.project-desc{color:var(--text-muted);margin-bottom:1rem;font-size:.92rem;line-height:1.7}.project-tags{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.tag{background:var(--bg-alt);color:var(--primary);border:1px solid var(--primary-light);border-radius:6px;padding:.3rem .7rem;font-size:.78rem;font-weight:600}.project-links{flex-wrap:wrap;gap:1rem;display:flex}.project-link{color:var(--primary);align-items:center;gap:.4rem;font-size:.9rem;font-weight:600;display:inline-flex}.project-link:hover{color:var(--accent-dark)}@media (width<=768px){.projects-grid{grid-template-columns:1fr}}.skills-groups{flex-direction:column;gap:2.5rem;display:flex}.skill-group-title{color:var(--primary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:1rem;font-size:1rem;font-weight:700}.skill-grid{flex-wrap:wrap;gap:1rem;display:flex}.skill-card{background:var(--card-bg);border:1px solid var(--border);border-radius:14px;flex-direction:column;align-items:center;gap:.5rem;min-width:100px;padding:1.25rem 1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.skill-card:hover{box-shadow:0 8px 25px var(--shadow);border-color:var(--primary-light);transform:translateY(-4px)}.skill-card-icon{color:var(--primary);font-size:1.8rem}.skill-card:hover .skill-card-icon{color:var(--accent)}.skill-card-name{color:var(--text);white-space:nowrap;font-size:.85rem;font-weight:600}@media (width<=480px){.skill-grid{justify-content:center}}.timeline{position:relative}.timeline:before{content:"";background:linear-gradient(to bottom, var(--primary-light), var(--accent-light));width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.timeline-item{grid-template-columns:1fr auto 1fr;align-items:start;gap:1.5rem;margin-bottom:2.5rem;display:grid;position:relative}.timeline-item:last-child{margin-bottom:0}.timeline-left .timeline-card{text-align:right;grid-column:1}.timeline-left .timeline-dot,.timeline-right .timeline-dot{grid-column:2}.timeline-right .timeline-card{grid-column:3}.timeline-dot{background:linear-gradient(135deg, var(--primary), var(--accent));color:#fff;width:44px;height:44px;box-shadow:0 0 0 4px var(--bg), 0 0 0 6px var(--primary-light);z-index:1;border-radius:50%;justify-content:center;align-items:center;font-size:1rem;display:flex}.timeline-card{background:var(--card-bg);border:1px solid var(--border);border-radius:14px;padding:1.25rem 1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.timeline-card:hover{box-shadow:0 8px 25px var(--shadow);border-color:var(--primary-light);transform:translateY(-4px)}.timeline-year{color:#fff;background:linear-gradient(135deg, var(--primary), var(--accent));border-radius:6px;margin-bottom:.5rem;padding:.2rem .7rem;font-size:.78rem;font-weight:700;display:inline-block}.timeline-title{color:var(--text);margin-bottom:.35rem;font-size:1.05rem;font-weight:700}.timeline-desc{color:var(--text-muted);font-size:.88rem;line-height:1.6}@media (width<=768px){.timeline:before{left:22px}.timeline-item{grid-template-columns:auto 1fr;gap:1rem;margin-bottom:2rem}.timeline-left .timeline-card,.timeline-right .timeline-card{text-align:left;grid-column:2}.timeline-left .timeline-dot,.timeline-right .timeline-dot{grid-column:1}.timeline-dot{width:36px;height:36px;font-size:.85rem}}.contact-card{background:var(--card-bg);border:1px solid var(--border);max-width:500px;box-shadow:0 4px 20px var(--shadow);border-radius:20px;padding:2rem}.contact-item{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.contact-icon{color:var(--primary);background:var(--bg-alt);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.contact-link{word-break:break-all;font-size:1rem;font-weight:500}.contact-divider{background:linear-gradient(90deg, var(--primary-light), var(--accent-light), transparent);height:1px;margin:1.25rem 0}.contact-social{gap:.75rem;display:flex}.social-link{border:1px solid var(--border);width:44px;height:44px;color:var(--text-muted);border-radius:12px;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.social-link:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-3px);box-shadow:0 4px 12px #0ea5e926}.footer{text-align:center;border-top:none;padding:2.5rem 1.5rem;position:relative}.footer:before{content:"";background:linear-gradient(90deg, transparent, var(--primary-light), var(--accent-light), transparent);height:1px;position:absolute;top:0;left:10%;right:10%}.footer-content{flex-direction:column;align-items:center;gap:1rem;display:flex}.footer-content p{color:var(--text-muted);font-size:.85rem}.footer-social{gap:.75rem;display:flex}.footer-social a{border:1px solid var(--border);width:36px;height:36px;color:var(--text-muted);border-radius:8px;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.footer-social a:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}.back-to-top{border:1px solid var(--border);width:36px;height:36px;color:var(--text-muted);border-radius:8px;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.back-to-top:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}:root{--primary:#0ea5e9;--primary-light:#bae6fd;--primary-dark:#0284c7;--accent:#34d399;--accent-light:#a7f3d0;--accent-dark:#059669;--bg:#fff;--bg-alt:#f0f9ff;--text:#0f172a;--text-muted:#64748b;--border:#e2e8f0;--card-bg:#fff;--shadow:#0ea5e91a;--nav-bg:#ffffffd9}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);background-image:radial-gradient(var(--border) 1px, transparent 1px);color:var(--text);background-size:32px 32px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.7}::selection{background:var(--primary);color:#fff}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-alt)}::-webkit-scrollbar-thumb{background:var(--primary-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary)}a{color:var(--primary);text-decoration:none;transition:color .2s}a:hover{color:var(--primary-dark)}img{max-width:100%;display:block}section{padding:6rem 1.5rem;position:relative}section:before{content:"";background:linear-gradient(90deg, transparent, var(--primary-light), var(--accent-light), transparent);opacity:.5;height:2px;position:absolute;top:-2px;left:0;right:0}.container{z-index:1;max-width:1100px;margin:0 auto;position:relative}.section-title{background:linear-gradient(135deg, var(--primary), var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.5rem;font-size:2.25rem;font-weight:800}.section-subtitle{color:var(--text-muted);margin-bottom:3.5rem;font-size:1.1rem;font-weight:400}.btn{cursor:pointer;border:none;border-radius:12px;align-items:center;gap:.5rem;padding:.85rem 2rem;font-size:.95rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--accent));color:#fff;box-shadow:0 4px 15px #0ea5e94d}.btn-primary:hover{color:#fff;transform:translateY(-2px);box-shadow:0 8px 25px #0ea5e966}.btn-outline{color:var(--primary);border:2px solid var(--primary);background:0 0}.btn-outline:hover{background:var(--primary);color:#fff;transform:translateY(-2px)}.fade-up{opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translateY(40px)}.fade-up.visible{opacity:1;transform:translateY(0)}.fade-left{opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translate(-40px)}.fade-left.visible{opacity:1;transform:translate(0)}.fade-right{opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translate(40px)}.fade-right.visible{opacity:1;transform:translate(0)}.scale-in{opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:scale(.9)}.scale-in.visible{opacity:1;transform:scale(1)}.stagger-item{opacity:0;transition:opacity .6s cubic-bezier(.4,0,.2,1),transform .6s cubic-bezier(.4,0,.2,1);transform:translateY(20px)}.stagger-item.visible{opacity:1;transform:translateY(0)}@media (width<=768px){section{padding:4rem 1rem}.section-title{font-size:1.8rem}}