@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{font-family:Poppins,sans-serif;background:linear-gradient(-45deg,#0f172a,#1e293b,#0f172a,#020617);background-size:400% 400%;animation:gradientBG 12s ease infinite;color:#fff;line-height:1.7}@keyframes gradientBG{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}section{padding:50px 10%;position:relative}section h2{font-size:36px;margin-bottom:30px;color:#38bdf8}nav{display:flex;justify-content:space-between;align-items:center;padding:25px 10%;position:sticky;top:0;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0f172ab3;border-bottom:1px solid rgba(255,255,255,.1);z-index:1000}nav h2{font-weight:700;letter-spacing:1px;color:#38bdf8}nav ul{display:flex;list-style:none;gap:35px}nav li{cursor:pointer;position:relative;transition:.3s}nav li:after{content:"";position:absolute;width:0%;height:2px;background:#38bdf8;bottom:-6px;left:0;transition:.3s}nav li:hover:after{width:100%}section:first-of-type{text-align:center;padding-top:150px}section:first-of-type h1{font-size:55px;font-weight:700;margin-bottom:20px}section:first-of-type p{font-size:20px;opacity:.8}button{margin-top:30px;padding:14px 35px;border:none;background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#000;font-weight:600;border-radius:12px;cursor:pointer;transition:.4s;box-shadow:0 10px 30px #38bdf84d}button:hover{transform:translateY(-4px);box-shadow:0 15px 40px #38bdf880}.glass{background:#ffffff0d;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:20px;margin:90px;padding:40px;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 40px #0000004d}.skills-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}.skills-list li{background:#ffffff0d;padding:15px;border-radius:10px;text-align:center;transition:.3s}.skills-list li:hover{background:#38bdf833;transform:translateY(-5px)}.project-card{background:#ffffff0d;padding:25px;border-radius:20px;margin-top:20px;transition:.4s;cursor:pointer;border:1px solid rgba(255,255,255,.08)}.project-card:hover{transform:translateY(-10px) scale(1.03);background:#38bdf826;box-shadow:0 15px 50px #0006}form{display:flex;flex-direction:column;gap:18px}input,textarea{padding:14px;border-radius:12px;border:none;background:#ffffff0d;color:#fff;font-size:15px}input:focus,textarea:focus{outline:2px solid #38bdf8}footer{text-align:center;padding:40px;background:#020617cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-top:80px;font-size:14px;opacity:.8}.contact-section{padding:50px 10%}.contact-main-wrapper{display:flex;gap:40px;align-items:stretch}.contact-left-content{flex:6;display:flex;flex-direction:column;justify-content:center}.contact-left-content h2{margin-bottom:20px;font-size:2.5rem;color:#40a9ff}.contact-info p{margin-bottom:12px;font-size:1.1rem}.contact-right-map{flex:4;min-height:300px;border-radius:10px;overflow:hidden;box-shadow:0 10px 30px #0000004d}@media(max-width:768px){nav ul{gap:15px}section:first-of-type h1{font-size:38px}section{padding:80px 5%}}nav a{text-decoration:none;color:#fff}@media(min-width:1025px){section{padding:100px 10%}section:first-of-type h1{font-size:60px}.glass{margin:90px;padding:50px}.skills-list{grid-template-columns:repeat(4,1fr)}}@media(min-width:769px)and (max-width:1024px){nav ul{gap:20px}section{padding:80px 8%}section:first-of-type h1{font-size:45px}.glass{margin:60px;padding:35px}.skills-list{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){nav{flex-direction:row;gap:15px;padding:20px 5%}nav ul{flex-direction:column;gap:12px;align-items:center}section{padding:70px 5%}section:first-of-type{padding-top:120px}section:first-of-type h1{font-size:34px}section:first-of-type p{font-size:16px}.glass{margin:30px 0;padding:25px}.skills-list{grid-template-columns:1fr}button{width:100%}}@media(max-width:992px){.contact-main-wrapper{flex-direction:column}.contact-left-content,.contact-right-map{flex:1;width:100%}.contact-right-map{height:250px}}.navbar{position:fixed;width:100%;top:0;left:0;background:#0f172ab3;display:flex;justify-content:space-between;align-items:center;padding:20px 10%;color:#38bdf8;z-index:1000;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 6px #0000004d}.logo{font-size:24px;font-weight:600;cursor:pointer;transition:transform .3s ease}.logo:hover{transform:scale(1.1)}.logo:active{animation:logoPop .4s ease}.desktop-menu{display:flex;gap:30px;list-style:none}.desktop-menu a{text-decoration:none;color:#38bdf8;transition:.3s}.desktop-menu a:hover{color:#38bdf8}.hamburger{display:none;font-size:28px;cursor:pointer}.mobile-menu{position:fixed;top:0;left:-100%;width:70%;height:100vh;background:#0f172a;padding:60px 30px;transition:.4s ease;z-index:1001}.mobile-menu.show{left:0}.mobile-menu ul{list-style:none}.mobile-menu li{margin-bottom:20px}.mobile-menu a{text-decoration:none;color:#fff;font-size:1.2rem}.close-btn{position:absolute;right:20px;top:20px;font-size:28px;cursor:pointer}.overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:#00000080;z-index:1000}@media(max-width:1024px){.desktop-menu{display:none}.hamburger{display:block}}.hero{background-image:url(/assets/rasm-U39lWXz4.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;height:100vh;display:flex;justify-content:center;align-items:center;position:relative;color:#38bdf8;text-align:center}.hero:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:1}.hero-content{position:relative;z-index:2;max-width:600px;padding:0 20px}.hero h1{font-size:3rem;margin-bottom:20px}.hero p{font-size:1.5rem;margin-bottom:30px}.hero button{background-color:#4f46e5;color:#fff;border:none;padding:12px 30px;font-size:1rem;border-radius:8px;cursor:pointer;transition:all .3s ease}.hero button:hover{background-color:#3730a3;transform:scale(1.05)}@media(max-width:1024px){.hero h1{font-size:2.5rem}.hero p{font-size:1.3rem}.hero button{padding:10px 25px;font-size:.95rem}}@media(max-width:768px){.hero h1{font-size:2rem}.hero p{font-size:1.1rem}.hero button{padding:8px 20px;font-size:.9rem}.hero-content{padding:0 15px}}@media(max-width:480px){.hero h1{font-size:1.5rem}.hero p{font-size:1rem}.hero button{padding:6px 15px;font-size:.85rem}.hero-content{padding:0 10px}}
