*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:#e2e8f0;background:#0f172a;font-family:Inter,sans-serif;line-height:1.6}#root{width:100%}.navbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;background:#0f172af2;border-bottom:1px solid #1e293b;justify-content:space-between;align-items:center;padding:25px 8%;display:flex;position:sticky;top:0}.navbar h2{color:#38bdf8;font-size:1.5rem;font-weight:700}.navbar ul{gap:30px;list-style:none;display:flex}.navbar a{color:#cbd5e1;font-weight:500;text-decoration:none;transition:all .3s}.navbar a:hover{color:#38bdf8}.hero{flex-direction:column;justify-content:center;min-height:85vh;padding:0 8%;display:flex}.hero h1{color:#fff;margin-bottom:20px;font-size:4rem}.hero p{color:#94a3b8;max-width:700px;font-size:1.2rem}section{padding:100px 8%}section h2{color:#fff;margin-bottom:30px;font-size:2rem;position:relative}section h2:after{content:"";background:#38bdf8;width:70px;height:4px;position:absolute;bottom:-10px;left:0}#about p{color:#cbd5e1;max-width:800px;font-size:1.1rem}.skill-container{flex-wrap:wrap;gap:15px;display:flex}.skill{background:#1e293b;border:1px solid #334155;border-radius:30px;padding:12px 24px;transition:all .3s}.skill:hover{color:#38bdf8;border-color:#38bdf8;transform:translateY(-4px)}#projects{flex-direction:column;display:flex}.card{background:#1e293b;border:1px solid #334155;border-radius:15px;margin-top:20px;padding:25px;transition:all .3s}.card:hover{border-color:#38bdf8;transform:translateY(-6px)}.card h3{color:#fff;margin-bottom:10px}.card p{color:#94a3b8}#contact p{margin:15px 0}#contact a{color:#38bdf8;text-decoration:none}#contact a:hover{text-decoration:underline}@media (width<=768px){.navbar{flex-direction:column;gap:15px}.navbar ul{gap:15px}.hero h1{font-size:2.5rem}section{padding:70px 5%}}.hero{align-items:center;min-height:90vh;display:flex}.hero-content{justify-content:space-between;align-items:center;gap:60px;width:100%;display:flex}.hero-text{flex:1}.hero-text h1{color:#fff;margin-bottom:15px;font-size:4rem}.hero-text h3{color:#94a3b8;margin-bottom:20px}.hero-text p{color:#cbd5e1;max-width:650px}.hero-image{flex:1;justify-content:center;display:flex}.profile-pic{object-fit:cover;border:5px solid #38bdf8;border-radius:50%;width:320px;height:320px;box-shadow:0 0 25px #38bdf866}
