@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";*,:before,:after{box-sizing:border-box}p{white-space:pre-line}:root{--bg:#070b16;--surface:#101828;--surface-elevated:#131f33;--muted:#9fb0c6;--text:#e9f0ff;--primary:#6d7dff;--accent:#20c997;--glass:#ffffff0a;--border:#ffffff17;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--container:1120px;--shadow-soft:0 16px 40px #00000059;--shadow-subtle:0 10px 30px #00000038}[data-theme=light]{--bg:#f2f6ff;--surface:#fff;--surface-elevated:#f7f9ff;--muted:#5b6b82;--text:#0b152a;--primary:#4f46e5;--accent:#059669;--glass:#08102a0a;--border:#08102a1a;--shadow-soft:0 12px 34px #08102a1a;--shadow-subtle:0 8px 22px #08102a14}*{--sb-size:5px}::-webkit-scrollbar{width:var(--sb-size)}::-webkit-scrollbar-track{background:var(--glass);border-radius:3px}::-webkit-scrollbar-thumb{background:var(--accent);border-radius:3px}@supports not selector(::-webkit-scrollbar){body{scrollbar-color:var(--accent) var(--glass)}}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background:radial-gradient(80vw 80vw at 5% -10%, #6d7dff21, transparent 55%), radial-gradient(65vw 65vw at 95% 5%, #20c99717, transparent 60%), var(--bg);color:var(--text);margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;line-height:1.6}.container{max-width:var(--container);margin:0 auto;padding:48px 20px}a{color:inherit}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.lang-btn{background:var(--surface-elevated);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-subtle);align-items:center;gap:8px;padding:8px 14px;font-size:14px;font-weight:500;transition:all .25s;display:flex}.lang-btn:hover{background:var(--primary);color:#fff;box-shadow:var(--shadow-soft);transform:translateY(-2px)}.lang-btn:active{transform:scale(.97)}.lang-btn span{opacity:.8}.topbar{z-index:80;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:color-mix(in srgb, var(--bg) 70%, transparent);border-bottom:1px solid var(--border);position:sticky;top:0}.topbar-inner{max-width:var(--container);justify-content:space-between;align-items:center;gap:16px;margin:0 auto;padding:14px 20px;display:flex}.brand{align-items:center;gap:10px;display:flex}.brand-logo{object-fit:cover;border:1px solid var(--border);border-radius:12px;width:40px;height:40px}.brand-name{letter-spacing:.2px;color:var(--text);font-size:1rem;font-weight:700}.navlinks{align-items:center;gap:12px;display:flex}.navlinks a{color:var(--muted);border-radius:10px;padding:8px 11px;font-size:.95rem;font-weight:600;text-decoration:none;transition:all .2s}.navlinks a:hover{color:var(--text);background:var(--glass)}.controls{align-items:center;gap:8px;display:flex}.menu-btn,.theme-btn{color:var(--text);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;padding:8px;font-size:1.05rem}.menu-btn:hover,.theme-btn:hover{border-color:var(--border);background:var(--glass)}.menu-btn{display:none}.intro-section{padding:0}.intro-grid{grid-template-columns:1fr minmax(260px,380px);align-items:center;gap:clamp(18px,4vw,64px);display:grid}.lead{color:var(--primary);letter-spacing:.5px;text-transform:uppercase;margin:0;font-size:.83rem;font-weight:700}.hero-name{letter-spacing:-1.2px;margin:8px 0;font-size:clamp(2rem,4.2vw,3.2rem);font-weight:900;line-height:1.05}.hero-role{color:var(--accent);margin:8px 0 14px;font-weight:700}.hero-desc{color:var(--muted);max-width:60ch;margin-top:12px;font-size:1.03rem}.avatar-wrap{justify-content:center;align-items:center;display:flex;position:relative}.avatar-wrap:before{content:"";aspect-ratio:1;background:linear-gradient(145deg, color-mix(in srgb, var(--primary) 38%, transparent), color-mix(in srgb, var(--accent) 32%, transparent));filter:blur(42px);opacity:.32;border-radius:32px;width:100%;max-width:360px;position:absolute}.avatar{object-fit:cover;width:330px;height:330px;box-shadow:var(--shadow-soft);border:1px solid var(--border);border-radius:50%;display:block;position:relative}.avatar:hover{border-color:color-mix(in srgb, var(--primary) 45%, var(--border));transition:rotate .28s cubic-bezier(.2,.9,.2,1);transform:translateY(-6px)rotate(-5deg)}.actions{flex-wrap:wrap;gap:12px;margin-top:26px;display:flex}.btn-primary,.btn-outline{cursor:pointer;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:11px 18px;font-size:.95rem;font-weight:700;text-decoration:none;transition:transform .16s,box-shadow .2s,background-color .2s;display:inline-flex}.btn-primary{background:linear-gradient(110deg, var(--primary), var(--accent));color:#fff;box-shadow:0 10px 25px #4f46e54d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px #4f46e55c}.btn-outline{color:var(--text);border-color:var(--border);background:0 0}.btn-outline:hover{background:var(--glass)}.section-title{letter-spacing:-.6px;margin-bottom:10px;font-size:clamp(1.5rem,2.3vw,2rem);font-weight:800}.section-sub{color:var(--muted);margin-bottom:20px}.about-section,.skills-section,.projects-section,.testimonials-section,.contact-section{padding:0}.about-text{color:var(--muted);margin-bottom:24px}.about-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.stat{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 92%, transparent), var(--surface));border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-subtle);padding:18px}.stat strong{font-size:1.5rem;display:block}.stat span{color:var(--muted);font-weight:600}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.skill-card{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 95%, transparent), var(--surface));border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-subtle);padding:16px}.skill-head{color:var(--muted);justify-content:space-between;margin-bottom:10px;font-weight:600;display:flex}.bar{background:color-mix(in srgb, var(--text) 10%, transparent);border-radius:999px;height:10px;overflow:hidden}.bar-fill{background:linear-gradient(90deg, var(--primary), var(--accent));width:0%;height:100%;transition:width .9s cubic-bezier(.2,.9,.2,1)}.reveal.active{opacity:1;transform:none}.projects-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.project-card{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 92%, transparent), var(--surface));border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-subtle);flex-direction:column;transition:transform .28s cubic-bezier(.2,.9,.2,1),box-shadow .28s;display:flex;overflow:hidden}.project-card:hover{transform:translateY(-8px);box-shadow:0 24px 50px #0206175c}.project-media img{object-fit:cover;width:100%;height:190px;display:block}.project-info{flex-direction:column;flex:1;gap:10px;padding:16px;display:flex}.project-info h4{color:var(--text);margin:0;font-size:1.1rem}.project-info p{color:var(--muted);margin:0;font-size:.95rem;line-height:1.5}.tags{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.tag{background:var(--glass);color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:6px 10px;font-size:.78rem}.project-footer{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.project-footer .links a{color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:8px;text-decoration:none;display:inline-flex}.project-footer .links a:hover{color:var(--text);background:var(--glass)}.contact-grid{grid-template-columns:1fr 320px;align-items:start;gap:32px;display:grid}.contact-form{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 95%, transparent), var(--surface));border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-subtle);flex-direction:column;gap:12px;padding:22px;display:flex}.contact-form input,.contact-form textarea{border:1px solid var(--border);background:color-mix(in srgb, var(--surface) 82%, transparent);width:100%;color:var(--text);resize:vertical;border-radius:10px;padding:11px 12px}.contact-form textarea{min-height:160px;line-height:1.45}.contact-form input:focus,.contact-form textarea:focus{outline:2px solid color-mix(in srgb, var(--primary) 40%, transparent);border-color:color-mix(in srgb, var(--primary) 58%, var(--border))}.contact-form .btn-primary{align-self:flex-start;min-width:220px;margin-top:6px;padding:12px 20px}.contact-info{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 95%, transparent), var(--surface));border-radius:var(--radius-lg);color:var(--muted);box-shadow:var(--shadow-subtle);border:1px solid var(--border);padding:20px}.contact-info h3{color:var(--text);margin-top:0}.contact-info a{color:var(--primary);font-weight:600;text-decoration:none}.site-footer{border-top:1px solid var(--border);color:var(--muted);margin-top:24px;padding:20px 0}.footer-inner{max-width:var(--container);justify-content:space-between;align-items:center;gap:12px;margin:0 auto;padding:0 20px;display:flex}.modal-overlay{z-index:9999;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#020617a6;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-content{background:var(--surface);border:1px solid var(--border);border-radius:16px;outline:none;width:100%;max-width:1000px;overflow:hidden;box-shadow:0 30px 80px #02061799}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.modal-header h3{margin:0;font-size:1.1rem}.modal-close{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:8px;padding:6px 8px;font-size:18px}.modal-close:hover{color:var(--text);background:var(--glass)}.modal-body{grid-template-columns:1fr 420px;gap:18px;padding:18px;display:grid}.modal-media .video-wrap{background:#0000000a;border-radius:12px;width:100%;padding-top:56.25%;position:relative;overflow:hidden}.modal-media iframe,.modal-media video{border:0;width:100%;height:100%;position:absolute;inset:0}.img-wrap img{object-fit:cover;border-radius:10px;width:100%;height:auto;display:block}.modal-details{flex-direction:column;gap:12px;padding:6px 4px;display:flex}.modal-description{color:var(--muted);margin:0}.modal-longtext{color:var(--muted);max-height:360px;padding-right:6px;line-height:1.6;overflow:auto}.modal-tags{flex-wrap:wrap;gap:8px;margin-top:6px;display:flex}.modal-actions{gap:10px;margin-top:auto;display:flex}.modal-details-body{height:300px;overflow-y:auto}@media (width<=980px){.menu-btn{justify-content:center;align-items:center;display:inline-flex}.intro-grid{text-align:center;grid-template-columns:1fr}.hero-desc{margin-inline:auto}.actions{justify-content:center}.avatar{width:280px;height:280px;margin:0 auto}.navlinks{display:none}.navlinks.open{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-soft);border-radius:12px;flex-direction:column;gap:8px;padding:12px;display:flex;position:absolute;top:72px;right:14px}.contact-grid,.projects-grid{grid-template-columns:1fr}.footer-inner{text-align:center;flex-direction:column}.contact-form .btn-primary{align-self:stretch;width:100%}.about-stats,.modal-body{grid-template-columns:1fr}.modal-content{max-width:920px}}@media (width<=520px){:root{--container:92vw}.avatar{width:220px;height:220px}.brand-name{display:none}.modal-content{max-width:94vw}.modal-header{padding:12px}.modal-body{gap:12px;padding:12px}.intro-left{order:2}.theme-float{z-index:10}}.experience-section{padding:0}html{scroll-behavior:smooth}.topbar{transition:background-color .28s,border-color .28s,box-shadow .28s}.topbar--stuck{background:color-mix(in srgb, var(--bg) 88%, transparent);animation:.45s headerSlideIn;box-shadow:0 16px 34px #00000040}@keyframes headerSlideIn{0%{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}.theme-float{z-index:120;border:1px solid color-mix(in srgb, var(--primary) 30%, var(--border));background:linear-gradient(120deg, color-mix(in srgb, var(--primary) 90%, #fff 10%), color-mix(in srgb, var(--accent) 40%, var(--primary)));color:#fff;cursor:pointer;border-right:0;border-radius:16px 0 0 16px;justify-content:center;align-items:center;gap:10px;width:52px;height:52px;font-weight:700;transition:width .28s,padding .28s,transform .2s;display:inline-flex;position:fixed;top:42%;right:0;overflow:hidden}.theme-float:hover{justify-content:flex-start;width:170px;padding-left:14px}.theme-float-icon{flex-shrink:0;font-size:1rem;display:inline-flex}.theme-float-label{opacity:0;white-space:nowrap;font-size:.9rem;transition:opacity .2s,transform .2s;transform:translate(10px)}.theme-float:hover .theme-float-label{opacity:1;transform:translate(0)}.btn-primary,.btn-outline{border-color:color-mix(in srgb, var(--primary) 60%, var(--border));color:var(--primary);box-shadow:none;background:0 0}.btn-primary:hover,.btn-outline:hover{color:#fff;background:linear-gradient(110deg, var(--primary), var(--accent));box-shadow:0 12px 26px color-mix(in srgb, var(--primary) 50%, transparent);border-color:#0000;transform:translateY(-2px)}.page-loaded .intro-left>:nth-child(2){animation-delay:80ms}.page-loaded .intro-left>:nth-child(3){animation-delay:.16s}.page-loaded .intro-left>:nth-child(4){animation-delay:.24s}.page-loaded .intro-left>:nth-child(5){animation-delay:.32s}.page-loaded .avatar-wrap{animation:.8s .2s both zoomIn}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.resume-title{color:color-mix(in srgb, var(--primary) 80%, #bba8ff);align-items:center;gap:10px;display:flex}.experience-timeline{gap:24px;margin-top:24px;padding-left:34px;display:grid;position:relative}.experience-timeline:before{content:"";background:linear-gradient(var(--primary), var(--accent));opacity:.45;width:2px;position:absolute;top:0;bottom:0;left:9px}.experience-item{position:relative}.experience-dot{background:var(--accent);border:3px solid color-mix(in srgb, var(--surface) 86%, #fff);width:18px;height:18px;box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 25%, transparent);border-radius:999px;position:absolute;top:24px;left:-34px}.experience-content{border:1px solid var(--border);background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 94%, transparent), var(--surface));box-shadow:var(--shadow-subtle);border-radius:20px;padding:22px}.experience-period{color:color-mix(in srgb, var(--primary) 82%, #ad8cff);letter-spacing:.3px;text-transform:uppercase;margin:0;font-size:.86rem;font-weight:700}.experience-content h3{margin:8px 0 4px;font-size:1.3rem}.experience-org{color:color-mix(in srgb, var(--text) 85%, #fff);margin:0;font-weight:600}.experience-description{color:var(--muted);margin:10px 0 0}.experience-tech{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}.experience-tech-item{border:1px solid var(--border);background:var(--glass);color:color-mix(in srgb, var(--text) 90%, #fff);border-radius:999px;align-items:center;gap:8px;padding:6px 10px;display:inline-flex}.experience-tech-item svg{color:color-mix(in srgb, var(--primary) 88%, #fff);font-size:1rem}.experience-tech-item small{font-size:.78rem;font-weight:600}.education-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:24px;display:grid}.education-card{border-radius:var(--radius-md);border:1px solid var(--border);background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 95%, transparent), var(--surface));box-shadow:var(--shadow-subtle);padding:20px}.education-card h3{color:var(--text);margin:8px 0;font-size:1.05rem}.education-card p{color:var(--muted);margin:0}.education-learned{color:var(--muted);overflow-wrap:anywhere;word-break:break-word;margin-top:10px;line-height:1.75}.education-certificate{object-fit:cover;border:1px solid var(--border);border-radius:14px;width:100%;height:180px;margin:12px 0}.education-period{text-transform:uppercase;letter-spacing:.3px;color:color-mix(in srgb, var(--primary) 85%, #ad8cff);margin:0;font-size:.84rem;font-weight:700}.center{text-align:center}.skills-sub{max-width:650px;margin:0 auto 28px}.skills-showcase{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;display:grid}.skill-showcase-card{border:1px solid var(--border);background:linear-gradient(180deg, color-mix(in srgb, var(--surface-elevated) 95%, transparent), var(--surface));text-align:center;border-radius:22px;padding:24px 14px;transition:transform .25s,box-shadow .25s,border-color .25s,background .25s}.skill-icon{color:color-mix(in srgb, var(--text) 60%, var(--primary));margin-bottom:14px;font-size:3rem;transition:color .25s,filter .25s}.skill-showcase-card:hover{border-color:color-mix(in srgb, var(--primary) 50%, var(--border));background:linear-gradient(180deg, color-mix(in srgb, var(--primary) 18%, var(--surface-elevated)), color-mix(in srgb, var(--primary) 10%, var(--surface)));box-shadow:0 20px 38px color-mix(in srgb, var(--primary) 32%, transparent)}.skill-showcase-card:hover .skill-icon{color:var(--skill-brand,var(--primary));filter:drop-shadow(0 0 8px color-mix(in srgb, var(--skill-brand,var(--primary)) 40%, transparent))}.skill-showcase-card span{color:color-mix(in srgb, var(--primary) 85%, #b39cff);margin-top:10px;font-weight:600;display:block}@media (width<=980px){.education-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skills-showcase{grid-template-columns:repeat(3,minmax(0,1fr))}.intro-left{order:2}}@media (width<=640px){.experience-timeline{padding-left:28px}.experience-dot{left:-28px}.education-grid{grid-template-columns:1fr}.education-certificate{height:160px;margin:10px 0}.skills-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-float{width:46px;height:46px}.theme-float:hover{justify-content:center;width:46px;padding-left:0}.theme-float-label{display:none}.theme-float{z-index:10}.intro-left{order:2}}.btn-icon{border:1px solid color-mix(in srgb, var(--primary) 60%, var(--border));width:44px;height:44px;color:var(--primary);background:0 0;border-radius:50%;justify-content:center;align-items:center;text-decoration:none;transition:transform .2s,background .2s,color .2s,border-color .2s;display:inline-flex}.btn-icon:hover{color:#fff;background:linear-gradient(110deg, var(--primary), var(--accent));border-color:#0000;transform:translateY(-2px)}.intro-left>*{opacity:1;transform:none}.page-loaded .intro-left>*{animation:.65s both fadeUpIn}@keyframes fadeUpIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.theme-float{justify-content:center;width:52px;padding:0;transition:transform .2s,box-shadow .2s}.theme-float:hover{width:52px;box-shadow:0 14px 30px color-mix(in srgb, var(--primary) 45%, transparent);justify-content:center;padding-left:0;transform:translate(-4px)}.theme-float-label{display:none}.reveal{opacity:0;transition:opacity .7s,transform .7s;transform:translateY(26px)scale(.98)}.reveal.is-visible{opacity:1;transform:translateY(0)scale(1)}.stat,.resume-card,.skill-showcase-card,.contact-info,.contact-form,.project-card{transition:transform .25s,box-shadow .25s,border-color .25s}.stat:hover,.resume-card:hover,.skill-showcase-card:hover,.contact-info:hover,.contact-form:hover,.project-card:hover{box-shadow:0 20px 40px color-mix(in srgb, var(--bg) 55%, transparent);border-color:color-mix(in srgb, var(--primary) 45%, var(--border));transform:translateY(-6px)}button,[role=button],a,.project-card,.menu-btn,.theme-float,.btn-primary,.btn-outline,.btn-icon{cursor:pointer}@media (width<=640px){.theme-float,.theme-float:hover{width:46px;transform:none}}.btn-primary,.btn-outline{isolation:isolate;border-color:color-mix(in srgb, var(--primary) 60%, var(--border));color:var(--primary);background:0 0;transition:color .35s,border-color .35s,transform .2s,box-shadow .25s;position:relative;overflow:hidden}.btn-primary:before,.btn-primary:hover:before,.btn-outline:hover:before{transform:scaleX(1)}.btn-primary:hover,.btn-outline:hover{color:#fff;box-shadow:0 12px 26px color-mix(in srgb, var(--primary) 50%, transparent);border-color:#0000;transform:translateY(-2px)}
