*{box-sizing:border-box;margin:0;padding:0}:root{--primary-blue:#3b82f6;--secondary-blue:#1e40af;--accent-cyan:#06b6d4;--dark-bg:#0f172a;--darker-bg:#020617;--card-bg:#1e293b;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#64748b;--border-color:#334155}html{scroll-behavior:smooth}body{background:linear-gradient(135deg,var(--darker-bg)0%,var(--dark-bg)100%);color:var(--text-primary);font-family:Poppins,sans-serif;line-height:1.6;overflow-x:hidden}.fade-in-up{opacity:0;animation:.8s forwards fadeInUp;transform:translateY(30px)}.fade-in-left{opacity:0;animation:.8s forwards fadeInLeft;transform:translate(-30px)}.fade-in-right{opacity:0;animation:.8s forwards fadeInRight;transform:translate(30px)}.typewriter{white-space:nowrap;overflow:hidden}.cursor{animation:.75s step-end infinite blink-caret}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{to{opacity:1;transform:translate(0)}}@keyframes blink-caret{0%,to{opacity:1}50%{opacity:0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.navbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;background:rgba(15,23,42,.95);width:100%;padding:1rem 0;transition:all .3s;position:fixed;top:0}.navbar.scrolled{background:rgba(15,23,42,.98);box-shadow:0 2px 20px rgba(59,130,246,.1)}.nav-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:0 2rem;display:flex}.logo{color:var(--primary-blue);font-size:1.5rem;font-weight:700;text-decoration:none}.nav-links{gap:2rem;list-style:none;display:flex}.nav-links a{color:var(--text-secondary);font-weight:500;text-decoration:none;transition:color .3s;position:relative}.nav-links a:hover,.nav-links a.active{color:var(--primary-blue)}.nav-links a:after{content:"";background:var(--primary-blue);width:0;height:2px;transition:width .3s;position:absolute;bottom:-5px;left:0}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.mobile-menu{cursor:pointer;flex-direction:column;display:none}.mobile-menu span{background:var(--text-primary);width:25px;height:3px;margin:3px 0;transition:all .3s}.hero{text-align:center;justify-content:center;align-items:center;min-height:100vh;padding:0 2rem;display:flex;position:relative;overflow:hidden}.hero:before{content:"";z-index:-1;background:radial-gradient(circle at 20% 80%,rgba(59,130,246,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(6,182,212,.1) 0%,transparent 50%);width:100%;height:100%;position:absolute;top:0;left:0}.hero-content h1{background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:3.5rem;font-weight:700}.hero-content .subtitle{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.5rem;font-weight:500}.hero-content .tagline{color:var(--text-muted);max-width:600px;margin-bottom:2.5rem;margin-left:auto;margin-right:auto;font-size:1.1rem}.cta-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.btn{cursor:pointer;border:none;border-radius:50px;align-items:center;gap:.5rem;padding:12px 30px;font-size:1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.btn-primary{background:linear-gradient(135deg,var(--primary-blue),var(--secondary-blue));color:#fff;box-shadow:0 4px 15px rgba(59,130,246,.3)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(59,130,246,.4)}.btn-outline{color:var(--primary-blue);border:2px solid var(--primary-blue);background:0 0}.btn-outline:hover{background:var(--primary-blue);color:#fff;transform:translateY(-3px)}section{padding:100px 0}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.section-title{text-align:center;margin-bottom:3rem}.section-title h2{background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:2.5rem;font-weight:700}.section-title p{color:var(--text-muted);font-size:1.1rem}.about-content{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;display:grid}.about-text{color:var(--text-secondary);margin-bottom:2rem;font-size:1.1rem;line-height:1.8}.about-image{text-align:center}.about-image .profile-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;padding:2rem;animation:6s ease-in-out infinite float}.profile-img{background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:200px;height:200px;margin:0 auto 1rem;font-size:4rem;display:flex}.skills{background:var(--card-bg)}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:2rem;margin-top:3rem;display:grid}.skill-card{background:var(--dark-bg);text-align:center;border:1px solid var(--border-color);cursor:pointer;border-radius:15px;padding:2rem 1rem;transition:all .3s}.skill-card:hover{border-color:var(--primary-blue);transform:translateY(-10px);box-shadow:0 10px 30px rgba(59,130,246,.2)}.skill-card i{color:var(--primary-blue);margin-bottom:1rem;font-size:2.5rem;transition:transform .3s;display:block}.skill-card:hover i{transform:scale(1.2)rotate(5deg)}.skill-card h4{color:var(--text-primary);font-weight:600}.project-filters{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:3rem;display:flex}.filter-btn{background:var(--card-bg);color:var(--text-secondary);border:1px solid var(--border-color);cursor:pointer;border-radius:25px;padding:10px 25px;font-weight:500;transition:all .3s}.filter-btn.active,.filter-btn:hover{background:var(--primary-blue);color:#fff;border-color:var(--primary-blue)}.projects-grid{grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;display:grid}.project-card{background:var(--card-bg);border:1px solid var(--border-color);cursor:pointer;border-radius:20px;transition:all .3s;overflow:hidden}.project-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px rgba(0,0,0,.3)}.project-image{background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));color:#fff;justify-content:center;align-items:center;height:200px;font-size:3rem;display:flex}.project-content{padding:2rem}.project-content h4{margin-bottom:.5rem;font-size:1.3rem;font-weight:600}.project-content p{color:var(--text-muted);margin-bottom:1rem;line-height:1.6}.project-tech{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.tech-tag{background:var(--dark-bg);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:20px;padding:4px 12px;font-size:.8rem}.project-tags{flex-wrap:wrap;gap:.5rem;display:flex}.project-tag{background:var(--primary-blue);color:#fff;border-radius:20px;padding:4px 12px;font-size:.8rem;font-weight:500}.services{background:var(--card-bg)}.services-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;display:grid}.service-card{background:var(--dark-bg);text-align:center;border:1px solid var(--border-color);border-radius:20px;padding:3rem 2rem;transition:all .3s}.service-card:hover{border-color:var(--primary-blue);transform:translateY(-10px);box-shadow:0 20px 40px rgba(59,130,246,.1)}.service-card i{color:var(--primary-blue);margin-bottom:1.5rem;font-size:3rem}.service-card:hover i{animation:1s infinite pulse}.service-card h4{margin-bottom:1rem;font-size:1.5rem;font-weight:600}.service-card p{color:var(--text-muted);line-height:1.6}.contact-content{grid-template-columns:1fr 1fr;gap:4rem;display:grid}.contact-form{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;padding:3rem}.form-group{margin-bottom:2rem}.form-group label{color:var(--text-secondary);margin-bottom:.5rem;font-weight:500;display:block}.form-group input,.form-group textarea{background:var(--dark-bg);border:1px solid var(--border-color);width:100%;color:var(--text-primary);border-radius:10px;padding:1rem;font-family:inherit;transition:border-color .3s}.form-group input:focus,.form-group textarea:focus{border-color:var(--primary-blue);outline:none}.contact-info{padding:3rem 0}.contact-item{align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.contact-item i{background:var(--primary-blue);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:1.2rem;display:flex}.social-links{gap:1rem;margin-top:3rem;display:flex}.social-links a{background:var(--card-bg);border:1px solid var(--border-color);width:50px;height:50px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;text-decoration:none;transition:all .3s;display:flex}.social-links a:hover{background:var(--primary-blue);color:#fff;transform:translateY(-3px)}.notification{z-index:10000;color:#fff;word-wrap:break-word;border-radius:10px;max-width:400px;padding:1rem 1.5rem;animation:.3s slideInRight;position:fixed;top:20px;right:20px;box-shadow:0 4px 15px rgba(0,0,0,.2)}.notification.success{background:#10b981}.notification.error{background:#ef4444}.notification-content{align-items:center;gap:.5rem;display:flex}.close-notification{color:#fff;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:20px;height:20px;margin-left:auto;padding:0;font-size:1.5rem;display:flex}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}footer{background:var(--darker-bg);text-align:center;border-top:1px solid var(--border-color);padding:2rem 0}.hidden{display:none!important}@media (max-width:768px){.nav-links{background:var(--dark-bg);flex-direction:column;width:100%;padding:2rem;display:none;position:fixed;top:70px;left:0;box-shadow:0 2px 10px rgba(0,0,0,.3)}.nav-links.active,.mobile-menu{display:flex}.mobile-menu.active span:first-child{transform:rotate(-45deg)translate(-5px,6px)}.mobile-menu.active span:nth-child(2){opacity:0}.mobile-menu.active span:nth-child(3){transform:rotate(45deg)translate(-5px,-6px)}.hero-content h1{font-size:2.5rem}.hero-content .subtitle{font-size:1.2rem}.about-content,.contact-content{grid-template-columns:1fr;gap:2rem}.cta-buttons{flex-direction:column;align-items:center}.projects-grid,.services-grid{grid-template-columns:1fr}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem}.skill-card{padding:1.5rem .5rem}.skill-card i{font-size:2rem}.contact-form{padding:2rem}.contact-info{padding:2rem 0}.section-title h2{font-size:2rem}}@media (max-width:480px){.hero-content h1{font-size:2rem}.hero-content .subtitle{font-size:1rem}.hero-content .tagline{font-size:.9rem}.nav-container,.container{padding:0 1rem}.project-filters{gap:.5rem}.filter-btn{padding:8px 20px;font-size:.9rem}}