*{box-sizing:border-box;margin:0;padding:0}body{color:#ccd6f6;background:#0a192f;font-family:Poppins,sans-serif;transition:all .3s}html,body{scroll-behavior:smooth;height:100%}body{flex-direction:column;display:flex}main{flex:1}h1{font-size:2.8rem}h2{text-align:center;color:#64ffda;margin-bottom:30px;font-size:2rem}section{min-height:80vh;padding:80px 10%}.navbar{z-index:1000;background-color:#112240;justify-content:space-between;align-items:center;height:70px;padding:10px 6%;transition:none;display:flex;position:sticky;top:0}.btn{cursor:pointer;border-radius:8px;padding:6px 12px;font-size:14px}.navbar{z-index:1000;background:#112240;justify-content:space-between;align-items:center;height:70px;padding:10px 6%;transition:none;display:flex;position:sticky;top:0}body.light-mode .navbar{background:#fff;box-shadow:0 4px 20px #00000014}.logo{align-items:center;display:flex}.logo-img{object-fit:cover;border:2px solid #64ffda;border-radius:50%;width:45px;height:45px}.nav-links{align-items:center;gap:25px;list-style:none;display:flex}.nav-links a{color:#ccd6f6;padding-bottom:3px;font-size:15px;text-decoration:none;transition:all .3s}.nav-links a:hover{color:#64ffda}.nav-links a.active{color:#64ffda;border-bottom:2px solid #64ffda;font-weight:600}body.light-mode .nav-links a.active{color:#06b6d4;border-bottom:2px solid #06b6d4}body.light-mode .nav-links a{color:#0f172a}body.light-mode .nav-links a:hover{color:#06b6d4}.nav-links.active{background:#112240;border-radius:12px;flex-direction:column;gap:15px;width:auto;min-width:140px;max-width:200px;padding:20px;display:flex;position:absolute;top:70px;right:10px}body.light-mode .nav-links.active{background:#fff;border-left:1px solid #e2e8f0;box-shadow:0 10px 30px #0000001a}body.light-mode .nav-links.active a{color:#0f172a}.nav-right{align-items:center;gap:12px;display:flex}.btn{cursor:pointer;color:#0a192f;background:#64ffda;border:none;border-radius:8px;padding:6px 12px;font-size:14px;transition:all .3s}.menu-icon{cursor:pointer;color:#ccd6f6;font-size:24px;display:none}body.light-mode .menu-icon{color:#0f172a}.hero-content{justify-content:space-between;align-items:center;gap:50px;display:flex}.hero-text{max-width:500px}.hero-text p{color:#8892b0;margin:15px 0}.profile-img{border:3px solid #64ffda;border-radius:50%;transition:all .3s}.profile-img:hover{transform:scale(1.05)}.btn{color:#0a192f;cursor:pointer;background:#64ffda;border:none;border-radius:6px;margin-top:10px;margin-right:10px;padding:10px 20px;text-decoration:none;transition:all .3s;display:inline-block}.btn:hover{transform:translateY(-3px)}.about-content{justify-content:center;align-items:center;gap:80px;display:flex}.about-content p{color:#8892b0;max-width:800px;margin-bottom:18px;line-height:1.5}.about-img{justify-content:center;align-items:center;display:flex}body.light-mode .about-content p{color:#555}.skills-list{grid-template-columns:repeat(4,1fr);gap:25px;margin-top:30px;display:grid}.skill-card{text-align:center;background:#112240;border-radius:12px;padding:20px;transition:all .3s}body.light-mode .skill-card{background:#f1f1f1}.skill-card:hover{transform:translateY(-5px)scale(1.03)}.skill-img{margin-bottom:10px}.project-grid{grid-template-columns:repeat(3,1fr);gap:25px;margin-top:30px;display:grid}.project-card{text-align:left;background:#112240;border-radius:10px;padding:15px;transition:all .3s}body.light-mode .project-card{background:#f1f1f1}.project-card:hover{transform:translateY(-5px)scale(1.03)}.project-img{object-fit:cover;border-radius:10px;width:100%;height:180px;margin-bottom:10px}.contact-section{flex-direction:column;justify-content:center;align-items:center;display:flex}.contact-form{flex-direction:column;gap:15px;width:100%;max-width:450px;display:flex}.contact-form input,.contact-form textarea{border:none;border-radius:6px;outline:none;padding:12px}body.light-mode .contact-form input,body.light-mode .contact-form textarea{background:#eee}.contact-form button{align-self:center}footer{text-align:center;background:#112240;margin-top:auto;padding:20px}body.light-mode footer{background:#f1f1f1}.fade-in{opacity:1;transition:all .6s;transform:translateY(0)}.fade-in.show{opacity:1;transform:translateY(0)}section{transition:all .3s}section:hover{transform:translateY(-2px)}@media (max-width:900px){.project-grid,.skills-list{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.hero-content{text-align:center;flex-direction:column-reverse}.about-content{text-align:center;flex-direction:column;gap:30px}.about-img{width:100%}.profile-img{margin:0 auto}.nav-links{display:none}.nav-links.active{display:flex}.menu-icon{display:block}.logo-img{width:38px;height:38px}.btn{padding:5px 10px;font-size:12px}}@media (max-width:600px){.project-grid,.skills-list{grid-template-columns:1fr}}body.light-mode{color:#0f172a;background:#f1f5f9}body.light-mode .hero-text p,body.light-mode .about-content p{color:#475569}body.light-mode .skill-card,body.light-mode .project-card{background:#fff;border:1px solid #e2e8f0;box-shadow:0 6px 18px #0000000d}body.light-mode .skill-card:hover,body.light-mode .project-card:hover{transform:translateY(-6px);box-shadow:0 10px 25px #00000014}body.light-mode .btn{color:#fff;background:linear-gradient(135deg,#22c55e,#06b6d4)}body.light-mode .contact-form input,body.light-mode .contact-form textarea{background:#fff;border:1px solid #cbd5e1}body.light-mode footer{background:#fff;border-top:1px solid #e2e8f0}body.light-mode,body.light-mode h1,body.light-mode h2,body.light-mode h3{color:#0f172a}body.light-mode .skill-card p{color:#334155}body.light-mode .project-card h3{color:#0f172a}body.light-mode .project-card p,body.light-mode .about-content p{color:#475569}body.light-mode input,body.light-mode textarea{color:#0f172a}body.light-mode input::placeholder,body.light-mode textarea::placeholder{color:#94a3b8}body.light-mode footer{color:#475569}body.light-mode h1,body.light-mode h2,body.light-mode h3{color:#0f172a}body.light-mode p{color:#475569}
