@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600&family=Roboto:wght@300;400;500;700&display=swap";.header{background-color:color-mix(in srgb,var(--bg-color) 85%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1rem 0;position:fixed;width:100%;top:0;left:0;z-index:1000;transition:background-color .3s ease,box-shadow .3s ease;box-shadow:0 10px 30px -10px var(--nav-shadow)}.navbar{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:0 2rem}.nav-logo a{display:block;transition:all .3s ease}.nav-logo .logo-image{height:45px;width:auto;border-radius:50%;border:2px solid var(--accent-color);transition:transform .3s ease}.nav-logo a:hover .logo-image{transform:scale(1.1)}.nav-menu{list-style:none;display:flex;align-items:center}.nav-item{margin-left:2.5rem}.nav-link{color:var(--text-light);transition:color .3s ease;text-decoration:none;position:relative;padding-bottom:5px}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background-color:var(--accent-color);transform:scaleX(0);transform-origin:bottom right;transition:transform .3s ease-out}.nav-link:hover{color:var(--accent-color)}.nav-link:hover:after{transform:scaleX(1);transform-origin:bottom left}.nav-toggle{display:none;cursor:pointer;z-index:1001}.hamburger{display:flex;flex-direction:column;justify-content:space-around;width:2rem;height:2rem;background:transparent;border:none;cursor:pointer;padding:0}.hamburger span{width:2rem;height:.25rem;background:var(--accent-color);border-radius:10px;transition:all .3s linear;position:relative;transform-origin:1px}.hamburger.active span:nth-child(1){transform:rotate(45deg)}.hamburger.active span:nth-child(2){opacity:0;transform:translate(20px)}.hamburger.active span:nth-child(3){transform:rotate(-45deg)}.theme-toggle{background:var(--secondary-color);border:1px solid var(--primary-color);border-radius:50px;cursor:pointer;display:flex;height:30px;width:60px;padding:3px;position:relative;overflow:hidden}.theme-toggle .icon-container{width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:transform .4s ease,opacity .4s ease;position:absolute}.theme-toggle svg{width:16px;height:16px;color:var(--accent-color)}.theme-toggle .icon-container.active{transform:translate(0);opacity:1}.theme-toggle .icon-container:not(.active){transform:translate(30px);opacity:0}body.light-mode .theme-toggle .icon-container.active{transform:translate(30px)}body.light-mode .theme-toggle .icon-container:not(.active){transform:translate(0)}.mobile-social-links{display:none}@media (max-width: 768px){.nav-toggle{display:flex}.nav-menu{position:fixed;top:0;right:-100%;width:75%;height:100vh;background-color:var(--primary-color);flex-direction:column;justify-content:center;align-items:center;transition:right .3s ease-in-out;box-shadow:-10px 0 30px -15px var(--nav-shadow)}.nav-menu.active{right:0}.nav-item{margin:1.5rem 0}.nav-link{font-size:1.2rem}.mobile-social-links{display:flex;margin-top:2rem}.mobile-social-links a{color:var(--text-light);margin:0 1.5rem}.mobile-social-links svg{width:24px;height:24px}}.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding-top:80px}.hero-content>*{opacity:0;animation:fadeUp .6s ease-out forwards}.hero-content .intro{animation-delay:.2s}.hero-content .name{animation-delay:.4s}.hero-content .role{animation-delay:1.2s}.hero-content .summary{animation-delay:1.4s}.hero-content .btn{animation-delay:1.6s}.hero-content h1{font-size:clamp(40px,8vw,80px);color:var(--text-bright);margin:0}.hero-content .name{color:var(--text-bright);font-size:clamp(35px,7vw,70px);margin-bottom:1rem;min-height:clamp(35px,7vw,70px)}.hero-content .name span{display:inline-block;opacity:0;transform:translateY(20px) scale(.9);animation:letter-reveal .5s forwards;text-shadow:0 0 5px var(--accent-color)}@keyframes letter-reveal{to{opacity:1;transform:translateY(0) scale(1)}}.hero-content .intro{color:var(--accent-color);font-family:Fira Code,monospace;margin-bottom:1rem}.hero-content .role{font-family:Fira Code,monospace;font-size:clamp(18px,4vw,24px);margin-bottom:1rem;font-weight:500;position:relative;color:transparent;background-image:linear-gradient(90deg,var(--accent-color),var(--text-light));background-size:200% 100%;background-position:100%;-webkit-background-clip:text;background-clip:text;animation:gradient-reveal 2s forwards,fadeUp .6s ease-out forwards;animation-delay:1.2s,1.2s}@keyframes gradient-reveal{0%{background-position:200%}to{background-position:0%}}.hero-content .summary{max-width:540px;color:var(--text-dark);margin-bottom:3rem}.hero-content .btn{display:inline-block;padding:.75rem 1.5rem;background-color:transparent;color:var(--accent-color);border:1px solid var(--accent-color);border-radius:4px;text-decoration:none;font-family:Fira Code,monospace;font-size:1rem;transition:all .3s ease;position:relative;overflow:hidden;z-index:1}.hero-content .btn:before{content:"";position:absolute;top:0;left:0;width:0;height:100%;background-color:var(--accent-color);transition:width .3s ease;z-index:-1}.hero-content .btn:hover:before{width:100%}body.light-mode .hero-content .btn:hover{color:#fff}body.dark-mode .hero-content .btn:hover{color:var(--text-bright)}.skills{padding:100px 0}.skills h2{font-size:clamp(26px,5vw,32px);text-align:center;margin-bottom:4rem;position:relative;display:flex;align-items:center;justify-content:center;white-space:nowrap;color:var(--text-bright)}.skills h2:after{content:"";display:block;position:relative;top:0;width:300px;height:1px;margin-left:20px;background-color:var(--secondary-color)}.skills-container{display:flex;max-width:800px;margin:0 auto;background:var(--primary-color);border-radius:4px;border:1px solid var(--secondary-color)}.skills-tabs{display:flex;flex-direction:column;border-right:1px solid var(--secondary-color)}.skill-tab{font-family:Fira Code,monospace;padding:1rem 1.5rem;cursor:pointer;color:var(--text-dark);transition:all .3s ease;white-space:nowrap}.skill-tab:hover{background-color:var(--accent-tint);color:var(--accent-color)}.skill-tab.active{background-color:var(--accent-tint);color:var(--accent-color);border-right:2px solid var(--accent-color)}.skills-content{padding:2rem;width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1.5rem;animation:fadeIn .4s ease}.skill-card{background-color:var(--bg-color);border:1px solid var(--secondary-color);border-radius:4px;padding:1.25rem 1rem;text-align:center;font-family:Fira Code,monospace;color:var(--text-dark);position:relative;overflow:hidden;transition:color .3s ease,transform .3s ease}.skill-card:hover{color:var(--accent-color);transform:translateY(-5px)}.projects{padding:100px 0}.projects h2{font-size:clamp(26px,5vw,32px);text-align:center;margin-bottom:4rem;position:relative;display:flex;align-items:center;justify-content:center;white-space:nowrap;color:var(--text-bright)}.projects h2:after{content:"";display:block;position:relative;top:0;width:300px;height:1px;margin-left:20px;background-color:var(--secondary-color)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}.project-card{background-color:var(--primary-color);border-radius:4px;transition:all .3s ease;box-shadow:0 10px 30px -15px var(--nav-shadow);display:flex;flex-direction:column;justify-content:space-between}.project-card:hover{transform:translateY(-7px)}.project-content{padding:2rem}.project-card .project-type{color:var(--accent-color);font-family:Fira Code,monospace;font-size:.9rem}.project-card h3{color:var(--text-bright);margin-top:.5rem}.project-card .description{color:var(--text-dark);margin:1.5rem 0}.project-tags{font-family:Fira Code,monospace;font-size:.8rem;color:var(--text-dark)}.project-tags span{margin-right:1rem}.project-links{padding:0 2rem 1.5rem}.project-links a{color:var(--text-light);margin-right:1.5rem;transition:color .3s ease}.project-links a:hover{color:var(--accent-color)}.project-links svg{width:22px;height:22px}.experience{padding:100px 0}.experience h2{font-size:clamp(26px,5vw,32px);text-align:center;margin-bottom:4rem;position:relative;display:flex;align-items:center;justify-content:center;white-space:nowrap;color:var(--text-bright)}.experience h2:after{content:"";display:block;position:relative;top:0;width:300px;height:1px;margin-left:20px;background-color:var(--secondary-color)}.experience-card{background:var(--primary-color);padding:2rem;border-radius:4px;margin-bottom:2rem;box-shadow:0 10px 30px -15px var(--nav-shadow);transition:all .3s ease}.experience-card:hover{transform:translateY(-5px)}.experience-header h3{color:var(--text-bright);display:inline}.experience-header .company{color:var(--accent-color)}.experience-header .date{font-family:Fira Code,monospace;color:var(--text-dark);font-size:.9rem}.experience-card ul{list-style:none;padding-left:0;margin-top:1rem;color:var(--text-dark)}.experience-card li{position:relative;padding-left:20px;margin-bottom:10px}.experience-card li:before{content:"▹";position:absolute;left:0;color:var(--accent-color)}.certifications{padding:100px 0}.certifications h2{font-size:clamp(26px,5vw,32px);text-align:center;margin-bottom:4rem;position:relative;display:flex;align-items:center;justify-content:center;white-space:nowrap;color:var(--text-bright)}.certifications h2:after{content:"";display:block;position:relative;top:0;width:300px;height:1px;margin-left:20px;background-color:var(--secondary-color)}.certifications-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}.cert-card{background-color:var(--primary-color);padding:2rem;border-radius:4px;text-align:center;box-shadow:0 10px 30px -15px var(--nav-shadow);transition:all .3s ease;text-decoration:none;color:inherit}.cert-card:hover{transform:translateY(-5px)}.cert-badge{width:120px;height:120px;margin:0 auto 1.5rem;display:flex;align-items:center;justify-content:center}.cert-badge img{max-width:100%;height:auto;border-radius:50%}.cert-card h4{font-size:1.1rem;color:var(--text-bright)}.cert-card p{color:var(--text-dark);font-size:.9rem}.contact-section{padding:100px 0;text-align:center;max-width:600px;margin:0 auto}.contact-section h2{justify-content:center;font-size:clamp(40px,5vw,60px);color:var(--text-bright)}.contact-section h2:after{display:none}.contact-section .subtitle{font-family:Fira Code,monospace;color:var(--accent-color);font-size:1rem}.contact-section .contact-text{color:var(--text-dark);margin:1rem 0 3rem}.contact-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.contact-section .btn{display:inline-block;padding:.75rem 1.5rem;background-color:transparent;color:var(--accent-color);border:1px solid var(--accent-color);border-radius:4px;text-decoration:none;font-family:Fira Code,monospace;font-size:1rem;transition:all .3s ease;position:relative;overflow:hidden;z-index:1;cursor:pointer}.contact-section .btn:before{content:"";position:absolute;top:0;left:0;width:0;height:100%;background-color:var(--accent-color);transition:width .3s ease;z-index:-1}.contact-section .btn:hover:before{width:100%}body.light-mode .contact-section .btn:hover{color:#fff}body.dark-mode .contact-section .btn:hover{color:var(--text-bright)}.contact-section .btn-secondary{color:var(--text-dark);border-color:var(--text-dark)}.contact-section .btn-secondary:before{background-color:var(--text-dark)}.contact-section .btn-secondary:hover{color:var(--bg-color)}.footer{text-align:center;padding:1.5rem;font-family:Fira Code,monospace;font-size:.8rem;color:var(--text-dark);width:100%}.social-sidebar{width:40px;position:fixed;bottom:0;left:40px;right:auto;z-index:10;color:var(--text-light)}.social-sidebar ul{display:flex;flex-direction:column;align-items:center;margin:0;padding:0;list-style:none}.social-sidebar ul:after{content:"";display:block;width:1px;height:90px;margin:0 auto;background-color:var(--text-dark)}.social-sidebar li a{padding:10px;display:inline-block;transition:all .3s ease}.social-sidebar li a:hover{transform:translateY(-3px);color:var(--accent-color)}.social-sidebar svg{width:20px;height:20px}@media (max-width: 768px){.social-sidebar{display:none}}.App{position:relative;z-index:2}main{max-width:1100px;margin:0 auto;padding:0 2rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}section{opacity:0;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}section.is-visible{opacity:1;transform:translateY(0)}:root{--bg-color: #0d1117;--primary-color: #161b22;--secondary-color: #21262d;--accent-color: #f92572;--text-light: #e6edf3;--text-dark: #8b949e;--text-bright: #ffffff;--accent-tint: rgba(249, 37, 114, .1);--nav-shadow: rgba(2, 12, 27, .7);--particle-color: rgba(249, 37, 114, .7)}body.light-mode{--bg-color: #fff0f5;--primary-color: #ffffff;--secondary-color: #e4e6eb;--accent-color: #d81b60;--text-light: #1c1e21;--text-dark: #606770;--text-bright: #050505;--accent-tint: rgba(216, 27, 96, .1);--nav-shadow: rgba(0, 0, 0, .1);--particle-color: rgba(216, 27, 96, .5)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Roboto,sans-serif;background-color:var(--bg-color);color:var(--text-light);line-height:1.6;overflow-x:hidden;transition:background-color .3s ease,color .3s ease}
