*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{background:linear-gradient(120deg,#f5f7ff,#fdfbff);color:#1f2937}.navbar{position:sticky;top:0;z-index:1000;background:#fff;display:flex;justify-content:space-between;align-items:center;padding:18px 60px;box-shadow:0 10px 30px #00000014}.nav-left{font-size:32px;font-weight:700;color:#4f46e5}.nav-right{display:flex;gap:28px}.nav-right a{text-decoration:none;font-weight:500;color:#374151;position:relative}.nav-right a:after{content:"";position:absolute;width:0%;height:2px;background:#4f46e5;left:0;bottom:-5px;transition:.3s ease}.nav-right a:hover:after{width:100%}.page-section{max-width:900px;margin:80px auto;padding:40px;background:#fff;border-radius:24px;box-shadow:0 20px 40px #00000014;animation:fadeIn .6s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.page-section h1{font-size:44px;margin-bottom:10px}.page-section h2{font-size:32px;margin-bottom:20px;color:#4f46e5}.page-section h3{margin-top:20px;font-size:20px}.page-section p{margin-top:10px;color:#4b5563;line-height:1.7}button{margin-top:30px;padding:14px 32px;border:none;border-radius:30px;background:linear-gradient(135deg,#6366f1,#22d3ee);color:#fff;font-size:15px;cursor:pointer;transition:.3s ease}button:hover{transform:translateY(-4px);box-shadow:0 12px 25px #6366f166}ul{margin-top:20px;padding-left:20px}ul li{margin-bottom:12px;color:#374151}@media(max-width:768px){.navbar{padding:16px 24px}.nav-right{gap:16px}.page-section{margin:40px 16px;padding:28px}}.nav-link{text-decoration:none;font-weight:500;color:#374151;position:relative}.nav-link.active{color:#4f46e5;font-weight:600}.nav-link.active:after{content:"";position:absolute;width:100%;height:2px;background:#4f46e5;left:0;bottom:-5px}.hero{text-align:center;margin-top:80px}.hero h1{font-size:48px;font-weight:700;color:#4f46e5}.hero .subtitle{margin-top:12px;font-size:18px;color:#374151;font-weight:500}.hero .description{margin-top:16px;font-size:16px;color:#4b5563;line-height:1.7;max-width:700px;margin-left:auto;margin-right:auto}.profile-pic{width:150px;height:150px;border-radius:50%;object-fit:cover;margin-bottom:20px;display:block;margin-left:auto;margin-right:auto;border:3px solid #ccc}.page-section.hero{text-align:center;padding:50px 20px}.subtitle{font-size:1.2rem;margin-top:10px;color:#555}.description{font-size:1rem;margin-top:20px;color:#333}button{margin-top:30px;padding:10px 20px;font-size:1rem;cursor:pointer;border:none;background-color:#007bff;color:#fff;border-radius:5px}button:hover{background-color:#0056b3}.page-section.education{max-width:800px;margin:50px auto;padding:0 20px}.education h2{text-align:center;font-size:2rem;margin-bottom:40px}.education-item{background-color:#f5f5f5;padding:20px 30px;margin-bottom:20px;border-radius:8px;box-shadow:0 3px 6px #0000001a}.education-item h3{margin-bottom:10px;color:#007bff}.education-item p{margin:3px 0;color:#333}.skills-category{margin-bottom:40px}.skills-category h3{margin-bottom:16px;color:#222;font-size:1.4rem}.skills-container{display:flex;flex-wrap:wrap;gap:16px}.skill-card{background-color:#fff;padding:14px 20px;border-radius:12px;box-shadow:0 8px 20px #0000000f;transition:transform .3s,box-shadow .3s;font-weight:500;cursor:default}.skill-card:hover{transform:translateY(-5px);box-shadow:0 14px 28px #0000001f}@media(max-width:768px){.skills-container{gap:12px}.skill-card{padding:10px 16px;font-size:.95rem}}.page-section{padding:60px 10%}.page-section h2{font-size:2.2rem;margin-bottom:40px;text-align:center;color:#222}.project-card{background:#fff;border-radius:12px;padding:24px;margin-bottom:28px;box-shadow:0 8px 20px #0000000f;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-5px);box-shadow:0 12px 28px #0000001a}.project-card h3{font-size:1.4rem;margin-bottom:12px;color:#111}.project-card p{font-size:.95rem;line-height:1.6;color:#555;margin-bottom:10px}.project-card strong{color:#333}.project-card a{display:inline-block;margin-top:10px;text-decoration:none;font-weight:500;color:#2563eb;transition:color .2s ease}.project-card a:hover{color:#1e40af}@media(max-width:768px){.page-section{padding:40px 6%}.project-card{padding:20px}.project-card h3{font-size:1.2rem}}*{margin:0;padding:0;box-sizing:border-box}.container{margin:20px;display:flex;justify-content:center;flex-wrap:wrap}.container .color{margin:12px;padding:7px;list-style:none;cursor:pointer;text-align:center;background:#fff;border-radius:16px;box-shadow:0 0 30px #cfcece;transition:all .3s ease}h1{text-align:center;padding:10px;color:green}.container .color:active{transform:scale(.95)}.color .rect-box{width:185px;height:188px;border-radius:10px}.color:hover .rect-box{filter:brightness(107%)}.color .hex-value{display:block;color:#444;-webkit-user-select:none;user-select:none;font-weight:500;font-size:1.15rem;margin:12px 0 8px;text-transform:uppercase}.refresh-btn{position:fixed;left:50%;bottom:40px;color:#fff;cursor:pointer;outline:none;font-weight:500;font-size:1.1rem;border-radius:5px;background:green;padding:13px 20px;border:none;transform:translate(-50%);box-shadow:0 0 30px gray;transition:all .3s ease}.refresh-btn:hover{background:#045f04}.copied-message{margin:10px;color:#dc143c;font-weight:700;font-family:Courier New,Courier,monospace}.search-container{position:relative;margin:20px auto;width:300px}.search-input{width:100%;padding:15px;border:2px solid #ccc;border-radius:15px;font-size:16px;outline:none;transition:border-color .3s;box-shadow:0 0 10px #b3b2b2}.search-input:hover{border-color:#007bff}@media screen and (max-width:500px){.container{margin:10px}.container .color{margin:8px;padding:5px;width:calc(50% - 20px)}.color .rect-box{width:100%;height:148px}.color .hex-value{font-size:1.05rem}.refresh-btn{font-size:1rem}}