/* Base Reset */
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif;}
body{line-height:1.6;transition:0.3s;background:#f4f4f4;color:#111;}
a{text-decoration:none;color:inherit;}

/* Header */
header{background:#111;color:white;position:fixed;width:100%;z-index:100;box-shadow:0 2px 5px rgba(0,0,0,0.3);}
nav{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;}
nav ul{display:flex;list-style:none;}
nav ul li{margin:0 15px;}
nav ul li a{color:white;transition:0.3s;}
nav ul li a:hover{color:#00c6ff;}
.menu-btn{display:none;font-size:25px;cursor:pointer;}
.theme-toggle{cursor:pointer;font-size:20px;margin-left:15px;transition:0.3s;}

/* Buttons */
.btn{background:linear-gradient(45deg,#007BFF,#00c6ff);color:white;border:none;padding:10px 20px;border-radius:30px;cursor:pointer;transition:0.5s;}
.btn:hover{transform:scale(1.1);box-shadow:0 5px 15px rgba(0,198,255,0.5);}

/* Sections */
section{padding:80px 20px;text-align:center;position:relative;}
.parallax{background-attachment:fixed;background-size:cover;background-position:center;}
.home.parallax{background-image:url('bg1.jpg');color:white;}
#about.parallax{background-image:url('bg2.jpg');color:rgb(153, 111, 237);}
#contact.parallax{background-image:url('bg3.jpg');color:white;}
section h2{margin-bottom:20px;}

/* Skills */
.skill{margin:15px auto;max-width:400px;text-align:left;}
.skill span{display:block;margin-bottom:5px;}
.skill-bar{width:100%;background:#ddd;height:20px;border-radius:20px;overflow:hidden;box-shadow:0 2px 5px rgba(0,0,0,0.2);}
.skill-level{height:100%;width:0;background:linear-gradient(45deg,#007BFF,#00c6ff);border-radius:20px;transition:1s;}

/* Projects */
.project{background:white;margin:15px auto;padding:20px;max-width:400px;border-radius:10px;transition:0.5s;box-shadow:0 2px 10px rgba(0,0,0,0.2);}
.project img{width:100%;border-radius:10px;transition:0.5s;}
.project:hover{transform:translateY(-10px);box-shadow:0 10px 20px rgba(0,198,255,0.4);}
.project:hover img{transform:scale(1.05);}

/* Form */
form{max-width:400px;margin:auto;display:flex;flex-direction:column;}
form input,form textarea{margin:10px 0;padding:10px;border-radius:10px;border:1px solid #ccc;}
form input:focus, form textarea:focus{outline:none;border-color:#00c6ff;box-shadow:0 0 10px rgba(0,198,255,0.3);}
button{margin-top:10px;}

/* Footer */
footer{background:#111;color:white;text-align:center;padding:15px;}

/* Responsive */
@media(max-width:768px){
nav ul{display:none;flex-direction:column;background:#111;position:absolute;top:60px;right:0;width:200px;}
nav ul.show{display:flex;}
.menu-btn{display:block;}
}

/* Dark Mode */
body.dark{background:#111;color:white;}
body.dark .parallax{filter:brightness(0.8);}
body.dark .skill-bar{background:#333;}
body.dark .project{background:#222;color:white;box-shadow:0 5px 20px rgba(0,198,255,0.4);}