*{margin:0;padding:0;font-family:Poppins,sans-serif;box-sizing:border-box}body{padding:10px 50px}@media (max-width: 768px){body{padding:0;margin:0}.skills-container{flex-direction:column;padding:20px}.skills-heading{font-size:28px;text-align:center}.skills-list{flex-wrap:wrap;justify-content:center}.skill-item{width:45%;margin:10px}}@media (max-width: 480px){.skills-heading{font-size:22px}.skill-item{width:100%;text-align:center}}.navbarheight{height:10vh}.navbar{height:10vh;width:90%;background-color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px;box-shadow:0 2px 10px #0000001a;position:fixed;top:0;left:50%;transform:translate(-50%);z-index:1000;margin-top:10px;border-radius:10px}.navleft{display:flex;align-items:center;gap:10px}.logo{font-size:20px;font-weight:700;font-family:Poppins,sans-serif;text-transform:uppercase;letter-spacing:1.5px;background:linear-gradient(45deg,#ff6a00,#ee0979);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.logo-icon{width:35px;height:35px;background:linear-gradient(45deg,#ff6a00,#ee0979);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;font-weight:700}.navcenter{display:flex;align-items:center}.navcenter ul{display:flex;gap:20px;padding:0}.navcenter li{list-style:none;font-size:18px;font-weight:500;cursor:pointer;transition:.3s;color:#333}.navcenter li:hover{color:#ee0979!important}.navright{display:flex;align-items:center;gap:10px}input[type=checkbox]{display:none}label{width:70px;height:35px;background-color:#ebebeb;border-radius:25px;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:6px;transition:.3s}label i{font-size:16px;color:#777}label:after{content:"";width:25px;height:25px;background-color:#fff;border-radius:50%;position:absolute;top:50%;left:5px;transform:translateY(-50%);transition:.3s}input:checked+label{background-color:#242424}input:checked+label:after{left:40px}.overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:#00000080;z-index:998;display:none}.overlay.active{display:block}.sidebar{position:fixed;top:0;right:-100%;width:100%;height:100vh;background-color:#242424;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:50px;transition:.3s;z-index:999}.sidebar.open{right:0}.close-btn{position:absolute;top:20px;right:20px;font-size:30px;cursor:pointer;color:#fff}.sidebar ul{list-style:none;padding:0;margin:0;width:100%;text-align:center}.sidebar ul li{padding:15px;font-size:24px;cursor:pointer;transition:.3s;color:#fff}.sidebar ul li:hover{background:#fff3}.menu-toggle{font-size:40px;cursor:pointer;display:none;color:#333;padding:10px;margin-right:10px}@media (max-width: 950px){.menu-toggle{display:block}.navbar.hide,.navcenter,.navright{display:none}.sidebar .navright{display:flex;margin-top:20px}}@media (min-width: 951px){.sidebar,.overlay{display:none}}body.dark-mode{background-color:#121212;color:#fff}body.dark-mode .navbar{background-color:#1f1f1f;color:#fff}body.dark-mode .sidebar{background-color:#1f1f1f}body.dark-mode .navcenter li,body.dark-mode .menu-toggle{color:#fff}body.dark-mode .logo{background:linear-gradient(45deg,#ff6a00,#ee0979);-webkit-background-clip:text;-webkit-text-fill-color:transparent}@media (max-width: 450px){.logo{font-size:12px}}@media (max-width: 340px){.logo{font-size:10px}}.footer{width:90%;margin:auto;position:relative;background-color:#f8f8f8a9;color:#333;padding:15px 20px;text-align:center;box-shadow:0 -2px 10px #0000001a;display:flex;justify-content:space-between;align-items:center;border-radius:10px 10px 0 0}a{all:unset}.footer p{font-size:16px;font-weight:500}.footer ul{list-style:none;display:flex;gap:15px;padding:0;margin:0}.footer li{font-size:22px;cursor:pointer;transition:.3s;color:#555}.footer li:hover{color:#ee0979}body.dark-mode .footer{background-color:#242424;color:#fff}body.dark-mode .footer li{color:#bbb}body.dark-mode .footer li:hover{color:#ff6a00}@media (max-width: 768px){.footer{flex-direction:column;text-align:center;gap:10px}}@media (max-width: 768px){.footer-container{flex-direction:column;text-align:center;padding:20px}.footer-links{flex-direction:column;gap:10px}.footer-copy{font-size:14px;margin-top:10px}}@media (max-width: 480px){.footer-copy{font-size:12px}.footer-links a{font-size:14px}}.home-container{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px;height:100vh;position:relative}.left{max-width:600px;padding:20px;margin-top:50px;position:relative}.left>h4,.left>h1,.left>p{position:relative;z-index:2}@keyframes glowEffect{0%,to{opacity:.2;filter:blur(5px)}50%{opacity:1;filter:blur(15px)}}@keyframes movingLights{0%{transform:translate(-50%,-50%) rotate(0) scale(1)}50%{transform:translate(-50%,-50%) rotate(180deg) scale(1.1)}to{transform:translate(-50%,-50%) rotate(360deg) scale(1)}}.lights-container{position:absolute;top:50%;left:50%;width:350px;height:200px;transform:translate(-50%,-50%);animation:movingLights 4s linear infinite;z-index:1}.light{width:60px;height:60px;background-color:#ff634799;border-radius:50%;position:absolute;filter:blur(15px);animation:glowEffect 2s infinite alternate}.light:nth-child(1){top:10%;left:20%;background-color:#ff6347cc}.light:nth-child(2){top:40%;left:80%;background-color:#ff8c69cc}.light:nth-child(3){top:70%;left:50%;background-color:#ff4500b3}.light:nth-child(4){top:90%;left:10%;background-color:#ffa07a99}.light:nth-child(5){top:30%;left:60%;background-color:#ff7f50b3}.left{display:flex;flex-direction:column;align-items:center;justify-content:center}.left>h4{font-size:20px;color:#9c9a9a}.left>h1{font-size:36px;color:#000}.left>p{font-size:18px;color:#00000085;line-height:1.6}body.dark-mode .left>h4{font-size:20px;color:#9c9a9a}body.dark-mode .left>h1{font-size:36px;color:#424141}body.dark-mode .left>p{font-size:18px;color:#ffffffa8;line-height:1.6}.right{display:flex;justify-content:center;margin-top:20px}.right>img{max-width:100%;height:auto;filter:brightness(.6) contrast(1.2);opacity:.9}@media (min-width: 768px){.home-container{flex-direction:row;justify-content:space-between;text-align:left}.left{padding:40px}.right{padding-right:40px}.right>img{height:500px}}@media (max-width: 768px){.left{margin-top:20px}}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.left{animation:slideInLeft 1s ease-out}.right>img{animation:slideInRight 1s ease-out}@keyframes expandLine{0%{width:0%;opacity:0}50%{width:50%;opacity:.7}to{width:90%;opacity:1}}.left hr{width:90%;height:2px;background-color:tomato;position:absolute;bottom:150px;left:50%;margin:10px;transform:translate(-50%);animation:expandLine 1s ease-out}@keyframes fadeInBounce{0%{opacity:0;transform:translateY(-15px)}50%{opacity:.7;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.left button{background:linear-gradient(45deg,#ff6a00,#ee0979);color:#fff;border:none;padding:12px 24px;font-size:18px;margin:50px;cursor:pointer;border-radius:5px;z-index:10000;animation:fadeInBounce 1.2s ease-in-out forwards;transition:transform .3s ease,box-shadow .3s ease}.left button:hover{transform:scale(1.1);box-shadow:0 0 20px #ff6347cc}@keyframes bounceArrow{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}.left button i{display:inline-block;animation:bounceArrow 1s infinite ease-in-out}@media (max-width: 768px){.container{flex-direction:column;padding:20px}}@media (max-width: 480px){h1{font-size:24px}}.about-container{display:flex;align-items:center;justify-content:center;gap:50px;padding:50px;flex-wrap:wrap;overflow:hidden}.left{flex:1;opacity:0;animation:flyInLeft 1.2s ease-out forwards;display:flex;justify-content:center}.left img{width:300px;height:500px;object-fit:cover;box-shadow:0 4px 10px #0003;transition:transform .3s ease-in-out}.left img:hover{transform:scale(1.05)}.right{flex:2;max-width:600px;flex-direction:column;opacity:0;animation:flyInRight 1.2s ease-out .2s forwards}.right h4{font-size:20px;color:tomato;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}.right h3{font-size:26px;color:#fff;background-color:tomato;margin-bottom:15px}.right ul{padding:0}.right li{font-size:18px;color:#000;margin-bottom:10px;position:relative;opacity:0;animation:fadeIn 1s ease-in-out forwards}.right li:nth-child(1){animation-delay:.3s}.right li:nth-child(2){animation-delay:.4s}.right li:nth-child(3){animation-delay:.5s}.right li:nth-child(4){animation-delay:.6s}.right li:nth-child(5){animation-delay:.7s}.right li:nth-child(6){animation-delay:.8s}.right li:nth-child(7){animation-delay:.9s}.right li:nth-child(8){animation-delay:1s}@keyframes flyInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes flyInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.about-container{flex-direction:column;text-align:center}.left img{width:200px;height:300px}.right{text-align:left;padding:20px}}body.dark-mode .right ul li{color:#ffffffa0}body.dark-mode .right ul li:hover{color:tomato}.top{text-align:center;margin-bottom:150px}.top>h3{color:tomato}.skills-container{text-align:center;margin-top:20px}.skills-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-top:20px;perspective:1000px}.skill-box{width:120px;height:140px;background:#fff;border-radius:10px;box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;align-items:center;color:#000;justify-content:center;transform-origin:center;animation:waving 2s infinite ease-in-out}.skill-box img{width:60px;height:60px}.skill-box p{margin-top:8px;font-size:14px;font-weight:700}@keyframes waving{0%{transform:rotateX(10deg) rotateY(0)}50%{transform:rotateX(-10deg) rotateY(10deg)}to{transform:rotateX(10deg) rotateY(0)}}body.dark-mode .top p{color:#fff}.top{margin:150px 0 50px;text-align:center;color:#000}.cards{display:flex;align-items:center;justify-content:space-around;flex-wrap:wrap;padding:70px}.card{width:350px;padding:30px;background-color:#f2f2f2;color:#000;border-radius:10px;margin:20px;box-shadow:0 4px 10px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.card:hover{transform:scale(1.05);box-shadow:0 8px 16px #0003}.card>img{width:100%;height:200px;border-radius:10px;object-fit:cover}.card>h3{margin:20px 0;font-size:20px}.card>p{margin:20px 0;font-size:12px}.card>.button>button{background:linear-gradient(45deg,#ff6a00,#ee0979);color:#fff;border:none;padding:8px 18px;font-size:13px;cursor:pointer;border-radius:5px}.card>.button>button:hover{opacity:.8}body.dark-mode .card{background-color:#1e1e1e;color:#fff}.button{display:flex;gap:10px}@media (max-width: 768px){.project-container{flex-direction:column;padding:20px}.project-heading{font-size:28px;text-align:center}.top,.cards{margin:0;padding:0}.project-card{width:100%;margin-bottom:20px}.project-image{width:100%;height:auto}}@media (max-width: 480px){.project-heading{font-size:22px}.project-description{font-size:14px}}ul{list-style:none;cursor:pointer}ul>li:hover{color:#ff6a00}@media (max-width: 768px){.contact-container{flex-direction:column;padding:20px}.contact-heading{font-size:28px;text-align:center}.contact-form{width:100%;padding:10px}.contact-input,.contact-textarea{width:100%;margin-bottom:10px}}@media (max-width: 480px){.contact-heading{font-size:22px}.contact-input,.contact-textarea{font-size:14px}.contact-btn{width:100%}}