*{margin:0;padding:0}body{height:100vh;color:#fff;background-color:#111213;font-family:outfit}.navbar{display:flex;align-items:center;justify-content:space-between;gap:100px;padding:10px 190px;background-color:#111213;position:fixed;z-index:1000}.logo{display:flex;align-items:center;gap:5px}.logo img{height:40px;width:40px;border-radius:50%}.logo p{font-size:25px;font-weight:700;background-color:#03a9f4;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nav-menu{display:flex;align-items:center;list-style:none;gap:60px;font-size:18px}.anchor-link{position:relative;font-size:1.1em;color:#fff;font-weight:400;text-decoration:none}.anchor-link:after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:3px;background:#03a9f4;border-radius:5px;transform:scaleX(0);transition:.3s}.anchor-link:hover:after{transform:scaleX(1)}.page-changing{width:100%;height:3.5px;background:#03a9f4;border:none;border-radius:5px;margin-top:3.2px}.social-buttons{display:flex;gap:10px;justify-content:center;align-items:center}.icon-btn{width:40px;height:40px;border:2px solid #03a9f4;border-radius:50%;display:flex;justify-content:center;align-items:center;color:#03a9f4;text-decoration:none;transition:.3s ease;font-size:20px}.icon-btn:hover{border:2px solid white;color:#000;transform:scale(1.1)}.linkedin:hover{background-color:#0077b5;color:#fff}.github:hover{background-color:#333;color:#fff}.facebook:hover{background-color:#1877f2;color:#fff}.instagram:hover{background:radial-gradient(circle at 30% 107%,#fdf497,#fd5949 45%,#d6249f 60%,#285aeb 90%);color:#fff}.nav-mob-open,.nav-mob-close{display:none}@media (max-width: 1250px){.navbar{padding:10px 40px}.nav-menu{gap:40px}}@media (max-width: 1100px){.navbar{gap:45px}}@media (max-width: 1000px){.navbar{width:100%;padding:10px 15px}.logo img{width:40px;height:40px;border-radius:50%}.logo p{font-size:23px;font-weight:700}.icon-btn{width:38px;height:38px}.nav-mob-open{display:block;width:30px;margin-right:50px}.nav-mob-open:hover{cursor:pointer}.nav-mob-close{display:block;position:relative;left:80px;top:5px;width:15px}.nav-mob-close:hover{cursor:pointer}.nav-menu{position:fixed;flex-direction:column;align-items:start;top:70px;gap:10px;background-color:#000;padding:0 20px 20px;z-index:2;transition:right .5s;right:-350px;margin-right:15px;border-top-left-radius:20px;border-bottom-left-radius:20px;border-bottom-right-radius:20px}.nav-menu li{font-size:17px;flex-direction:row}.linkedin{background-color:#0077b5;border-color:#fff;color:#fff}.github{background-color:#333;border-color:#fff;color:#fff}.facebook{background-color:#1877f2;border-color:#fff;color:#fff}.instagram{background:radial-gradient(circle at 30% 107%,#fdf497,#fd5949 45%,#d6249f 60%,#285aeb 90%);border-color:#fff;color:#fff}}@media (max-width: 550px){.navbar{gap:50px}.logo img{width:30px;height:30px}.logo p{font-size:18px;font-weight:700}.icon-btn{width:30px;height:30px}.nav-mob-close{left:75px;top:5px;width:13px}.nav-menu li{font-size:15px}.nav-mob-open{margin-right:35px}}@media (max-width: 430px){.navbar{gap:20px}}.hero{background-size:cover;background-position:center;display:flex;align-items:center;justify-content:space-between;padding:120px 10% 125px;background:linear-gradient(180deg,#111213 50%,#2e3950 200%);animation:fadeInPage .6s ease-in}.hero-item1{padding:40px 20px;max-width:700px;display:flex;flex-direction:column;animation:slideInFromLeft .8s ease-out both}@keyframes slideInFromLeft{0%{opacity:0;transform:translate(-200px)}to{opacity:1;transform:translate(0)}}.hero h1{width:100%}.name{font-size:25px}.my-name{font-size:45px}.changing-text{color:#08f787;font-weight:500;transition:opacity .5s ease-in-out}.hero p{width:100%;min-height:200px;font-size:20px;line-height:40px;margin-top:40px;opacity:.9}.hero-action{display:flex;align-items:center;gap:25px;font-size:24px;font-weight:500;margin-top:50px}.hero-connect-button{font-size:1em;padding:.6em .8em;border-radius:.5em;border:none;background-color:#000;color:#fff;cursor:pointer;box-shadow:2px 2px 3px #000000b4;z-index:1;position:relative;transition:all .3s ease-in-out}.hero-connect{position:relative;padding:3px;background:linear-gradient(90deg,#03a9f4,#08f787);border-radius:.5em;transition:all .4s ease;z-index:0}.hero-connect:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border-radius:.5em;z-index:-1;filter:blur(0);transition:filter .4s ease;background:linear-gradient(90deg,#03a9f4,#08f787)}.hero-connect:hover:before{filter:blur(.7em)}.hero-connect:active:before{filter:blur(.2em)}.hero-connect:hover{transform:translateY(-2px)}.hero-anchor-link{text-decoration:none;color:#fff}.hero-item2{height:430px;width:430px;border-radius:50%;display:flex;justify-content:center;align-items:center;background:linear-gradient(90deg,#03a9f4,#08f787);animation:fadeInScale 1s ease-out both}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8) rotate(-3deg)}to{opacity:1;transform:scale(1) rotate(0)}}.hero-item2 .glow{--glow-blur: 1.5}.hero img{height:422px;width:422px;border-radius:50%;transition:all .3s ease-in-out}.hero img:hover{transform:scale(1.025)}.hero img:active{transform:scale(1.007)}@keyframes fadeInPage{0%{opacity:0}to{opacity:1}}@media (max-width: 1250px){.hero{align-items:inherit;padding:120px 15px 60px}.hero-item2{height:400px;width:400px}.hero img{height:395px;width:395px}.hero img:hover,.hero img:active{transform:scale(1)}}@media (max-width: 1000px){.hero{flex-direction:column-reverse;justify-content:center;align-items:center;padding:115px 10px 50px}.hero-item1{padding:25px 20px 0;max-width:700px;animation:slideInFromLeft .8s ease-out both}.name{font-size:25px}.my-name{font-size:40px;font-weight:500}.changing-text{font-size:30px}.hero p{font-size:20px;line-height:33px;margin:30px 0;min-height:0}.hero-action{margin-top:0;justify-content:center}.hero-item2{height:230px;width:230px;background:none}.hero img{height:230px;width:230px;border:3px solid white}.hero img:hover,.hero img:active{transform:none}}@media (max-width: 600px){.name{font-size:20px}.my-name{font-size:35px}.changing-text{font-size:23px}.hero p{font-size:20px;line-height:33px;margin:20px 0;min-height:0}}.about{background-size:cover;background-position:center;display:flex;align-items:center;justify-content:space-between;padding:20px 10% 60px;flex-direction:column;background-color:#111213}.about-title h1{font-size:50px;background:linear-gradient(270deg,#b0b0b0 10%,#03a9f4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.about-section{background-size:cover;background-position:center;display:flex;align-items:inherit;justify-content:space-between;padding-top:50px}.about-left{width:350px;height:350px;background:radial-gradient(#0003,#0001);border-radius:50% 50% 40% 60%/60% 40% 60% 50%;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:10px;box-shadow:0 4px 12px #00000026;background-color:#08f787;animation:fadeInScale 1s ease-out}.about-left img{width:100%;height:100%;object-fit:cover;border-radius:50% 50% 40% 60%/60% 40% 60% 50%}.about-right{margin:20px;max-width:700px;display:flex;flex-direction:column;align-items:center}.about-para{padding-left:100px}.about-para p{font-size:20px;opacity:.7}.about-action{display:flex;align-items:center;gap:25px;font-size:24px;font-weight:500;margin-top:50px}.about-resume-button{font-size:1em;padding:.6em .8em;border-radius:.5em;border:none;background-color:#000;color:#fff;cursor:pointer;box-shadow:2px 2px 3px #000000b4;z-index:1;position:relative}.about-resume{position:relative;padding:3px;background:linear-gradient(90deg,#03a9f4,#08f787);border-radius:.5em;transition:all .4s ease;z-index:0}.about-resume:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border-radius:.5em;z-index:-1;filter:blur(0);transition:filter .4s ease;background:linear-gradient(90deg,#03a9f4,#08f787)}.about-resume:hover:before{filter:blur(.7em)}.about-resume:active:before{filter:blur(.2em)}.about-resume-anchor{text-decoration:none;color:#fff}@media (max-width: 1300px){.about{padding:10px 0 60px}.about-left{width:300px;height:300px;padding:8px}.about-para p{font-size:19px}}@media (max-width: 1000px){.about{padding:20px 0 60px}.about-section{padding-top:40px;flex-direction:column}.about-left{width:230px;height:230px;padding:6px}.about-para{padding:20px 0 0}.about-para p{text-align:center;font-size:20px}}@media (max-width: 600px){.about-section{padding-top:30px}.about-para{padding-top:10px}.about-title h1{font-size:40px}}.skills{background-size:cover;background-position:center;display:flex;align-items:center;justify-content:space-between;margin-bottom:40px;padding:0 10% 0 5%;flex-direction:column;background-color:#111213}.skill-item1 h1{font-size:50px;background:linear-gradient(270deg,#b0b0b0 10%,#03a9f4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.skill-item2{margin-top:20px;width:100%;display:flex;justify-content:flex-start}.frame{display:grid;grid-auto-columns:96px;grid-gap:24px;justify-content:flex-start;margin-bottom:24px;position:relative;white-space:nowrap;grid-auto-flow:column}.frame2,.frame4{margin-left:24px}.frame div{width:96px;height:96px;border-radius:20%;background:#181818;display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;transition:.8s}.frame div img{height:50px;width:50px}.frame1 div{background:linear-gradient(180deg,#111213 10%,#181818)}.frame5 div{background:linear-gradient(180deg,#181818 10%,#111213)}.frame_active{border:1px solid rgba(50,50,53,.7)}.frame_inactive:hover{box-shadow:1px 1px 30px #3e3e3e}.HTML_svg img{filter:drop-shadow(1px 1px 8px rgb(222,120,52))}.HTML_svg:hover{box-shadow:1px 1px 30px #f60}.CSS_svg img{filter:drop-shadow(1px 1px 8px rgb(93,149,232))}.CSS_svg:hover{box-shadow:1px 1px 30px #06f}.Tailwind_svg img{filter:drop-shadow(1px 1px 8px rgb(27,117,252))}.Tailwind_svg:hover{box-shadow:1px 1px 30px #50b0ff}.React_svg img{filter:drop-shadow(1px 1px 8px rgb(6,182,209))}.React_svg:hover{box-shadow:1px 1px 30px #0df}.Javascript_svg img{filter:drop-shadow(1px 1px 8px rgb(161,127,3))}.Javascript_svg:hover{box-shadow:1px 1px 30px #ffc800}.Node_svg img{filter:drop-shadow(1px 1px 8px rgb(35,168,2))}.Node_svg:hover{box-shadow:1px 1px 30px #af0}.Express_svg img{filter:drop-shadow(1px 1px 8px rgb(255,255,255))}.Express_svg:hover{box-shadow:1px 1px 30px #fff}.SQL_svg img{filter:drop-shadow(1px 1px 8px rgb(0,102,255))}.SQL_svg:hover{box-shadow:1px 1px 30px #00fff2}.Java_svg img{filter:drop-shadow(1px 1px 8px rgb(3,153,208))}.Java_svg:hover{box-shadow:1px 1px 30px #0bf}.Python_svg img{filter:drop-shadow(1px 1px 8px rgb(2,73,155))}.Python_svg:hover{box-shadow:1px 1px 30px #07f}.C_svg img{filter:drop-shadow(1px 1px 8px rgb(2,87,156))}.C_svg:hover{box-shadow:1px 1px 30px #008cff}.skill-item2-right{margin-left:100px;width:100%;display:flex;justify-content:center;flex-direction:column}.skill-element{margin-bottom:10px;display:flex;flex-direction:column}.skill-element a{text-decoration:none;color:#fff}.skill-element p{font-size:17px;transition:all .2s}.skill-element p:hover{font-size:20px;cursor:pointer}.skill-element hr{height:7px;width:50%;margin:10px 0;background:linear-gradient(90deg,#03a9f4,#08f787);border:none;border-radius:50px}.skill-element div{display:flex;align-items:center}.skill-element div p{font-size:15px;padding-left:20px}@media (max-width: 1200px){.skills{padding:0 24px}.frame{grid-auto-columns:80px;grid-gap:20px}.frame div{width:80px;height:80px}.frame div img{height:45px;width:45px}.skill-item2-right{margin-left:40px}}@media (max-width: 1000px){.skills{padding:0 30px}.skill-item2{flex-direction:column}.frame{grid-auto-columns:96px;grid-gap:24px;margin-bottom:24px}.frame2,.frame4{margin-left:24px}.frame div{width:96px;height:96px}.skill-item2-right{width:80%;margin-left:50px}.HTML_svg{box-shadow:0 0 8px #f60}.CSS_svg{box-shadow:0 0 8px #06f}.React_svg{box-shadow:0 0 8px #0df}.Javascript_svg{box-shadow:0 0 8px #ffc800}.Node_svg{box-shadow:0 0 8px #af0}.Express_svg{box-shadow:0 0 8px #fff}.SQL_svg{box-shadow:0 0 8px #00fff2}.Java_svg{box-shadow:0 0 8px #0bf}.Python_svg{box-shadow:0 0 8px #07f}.C_svg{box-shadow:0 0 8px #008cff}}@media (max-width: 800px){.skills{padding:0 30px}.frame{grid-auto-columns:90px;grid-gap:15px;margin-bottom:15px}.frame2,.frame4{margin-left:20px}.frame div{width:90px;height:90px}.frame div img{height:38px;width:38px}.skill-item2-right{width:80%;margin-left:20px}}@media (max-width: 750px){.skills{padding:0 30px}.frame{grid-auto-columns:75px;grid-gap:15px;margin-bottom:15px}.frame2,.frame4{margin-left:20px}.frame div{width:75px;height:75px}.frame div img{height:38px;width:38px}.skill-item2-right{width:80%;margin-left:20px}}@media (max-width: 600px){.skills{padding:0 20px}.frame{grid-auto-columns:70px}.frame div{width:70px;height:70px}.frame div img{height:35px;width:35px}.skill-item2-right{margin-left:10px}.skill-item1 h1{font-size:40px}}@media (max-width: 550px){.frame{grid-auto-columns:60px;grid-gap:15px;margin-bottom:15px}.frame2,.frame4{margin-left:20px}.frame div{width:60px;height:60px}.frame div img{height:33px;width:33px}}@media (max-width: 490px){.frame{grid-auto-columns:50px}.frame div{width:50px;height:50px}.frame div img{height:30px;width:30px}}@media (max-width: 440px){.frame1{margin-left:-50px}.frame2{margin-left:-20px}.frame3{margin-left:-50px}.frame4{margin-left:-20px}.frame5{margin-left:-50px}}@media (max-width: 400px){.frame1{margin-left:-70px}.frame2{margin-left:-60px}.frame3{margin-left:-75px}.frame4{margin-left:-60px}.frame5{margin-left:-70px}}@media (max-width: 350px){.frame1{margin-left:-80px}.frame2{margin-left:-70px}.frame3{margin-left:-80px}.frame4{margin-left:-70px}.frame5{margin-left:-80px}}.project{background-size:cover;background-position:center;display:flex;align-items:center;justify-content:space-between;margin-bottom:50px;padding:0 5%;flex-direction:column;background-color:#111213}.project-title h1{font-size:50px;background:linear-gradient(270deg,#b0b0b0 10%,#03a9f4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-align:center}.project-container{margin-top:50px;display:flex;flex-wrap:wrap;justify-content:center;gap:40px}.project-card{position:relative;overflow:hidden;width:100%;max-width:400px}.project-image-container{position:relative;height:250px;width:100%;border-radius:12px;overflow:hidden;cursor:pointer}.project-image-container img{height:100%;width:100%;object-fit:cover;transition:transform .6s ease;border-radius:12px}.project-image-container:hover img{transform:scale(1.1);filter:brightness(.15)}.project-overlay{position:absolute;top:0;left:0;height:100%;width:100%;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .5s ease;padding:10px;box-sizing:border-box;text-align:center}.project-image-container:hover .project-overlay{opacity:1}.project-overlay p{font-size:15px;opacity:.9;color:#fff;text-align:center}.project-card-links{display:flex;align-items:center;justify-content:center;margin-top:20px;gap:20px;flex-wrap:wrap}.project-card-links a{display:flex;align-items:center;justify-content:center;border:3px solid rgba(50,50,53,.7);background:#000;border-radius:8px;text-decoration:none;color:#fff;font-size:15px;padding:8px 16px;transition:all .3s ease}.project-card-links a:hover{transform:scale(1.05);border:3px solid #03a9f4}.project-card-links a:active{transform:scale(.95)}@media (max-width: 768px){.project-title h1{font-size:40px}.project-image-container{height:220px}.project-card-links a{font-size:14px;padding:6px 12px}}@media (max-width: 480px){.project-title h1{font-size:32px}.project-container{gap:25px;padding:0 20px}.project-image-container{height:180px}.project-overlay p{font-size:12px}.project-card-links a{font-size:12px;padding:5px 10px}}.contact{background-size:cover;background-position:center;display:flex;align-items:center;justify-content:space-between;padding:0 10%;flex-direction:column;background-color:#111213}.contact-title h1{font-size:50px;background:linear-gradient(270deg,#b0b0b0 10%,#03a9f4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.contact-section{margin-top:50px;width:100%;display:flex;justify-content:flex-start;gap:20px}.contact-left{height:fit-content;display:flex;flex-direction:column;background:#181818;border:3px solid rgba(50,50,53,.7);border-radius:15px;padding:20px}.contact-left h1{background-color:#f5f5f6;filter:drop-shadow(1px 1px 8px #03a9f4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:35px;margin-bottom:15px}.contact-left p{font-size:18px;opacity:.7}.contact-details{margin-top:50px}.contact-detail img{height:30px;width:30px}.contact-detail p{margin:5px 0 20px;font-size:15px;opacity:.5}.contact-right{display:flex;flex-direction:column;padding:0 20px}.contact-right label{font-size:25px;margin-bottom:10px;opacity:.9}.contact-right input{height:40px;width:500px;margin:15px 0;color:#fff;font-size:15px;padding:0 10px;border-radius:10px;background:#181818;border:3px solid rgba(50,50,53,.7);transition:all .3s}.contact-right input:hover{transform:scale(1.03)}.contact-right textarea{width:500px;border-radius:10px;font-size:15px;padding:10px;margin:15px 0;color:#fff;background:#181818;border:3px solid rgba(50,50,53,.7);transition:all .3s}.contact-right textarea:hover{transform:scale(1.03)}.contact-action{display:flex;align-items:center;justify-content:center;gap:25px;font-size:24px;font-weight:500;margin-top:10px}.contact-submit-button{font-size:1em;padding:.6em .8em;border-radius:.5em;border:none;background-color:#000;color:#fff;cursor:pointer;box-shadow:2px 2px 3px #000000b4;z-index:1;position:relative}.contact-submit{position:relative;padding:3px;background:linear-gradient(90deg,#03a9f4,#08f787);border-radius:.5em;transition:all .4s ease;z-index:0}.contact-submit:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border-radius:.5em;z-index:-1;filter:blur(0);transition:filter .4s ease;background:linear-gradient(90deg,#03a9f4,#08f787)}.contact-submit:hover:before{filter:blur(.7em)}.contact-submit:active:before{filter:blur(.2em)}@media (max-width: 1280px){.contact{padding:0 5%}.contact-right input,.contact-right textarea{width:450px}}@media (max-width: 1100px){.contact-right input,.contact-right textarea{width:400px}}@media (max-width: 1000px){.contact{padding:0 10%}.contact-section{flex-direction:column}.contact-details{margin-top:30px}.contact-right{padding:0 35px}.contact-right input,.contact-right textarea{width:auto}}@media (max-width: 600px){.contact{padding:0 5%}.contact-title h1{font-size:40px}.contact-right{padding:0}.contact-right label{font-size:22px}.contact-right input{margin:0 0 20px}.contact-right textarea{margin:0 0 15px}}.footer{padding:70px 10% 20px}.footer-content{display:flex;align-items:center;justify-content:center;justify-content:space-evenly;background-color:#000;padding:40px;border-top-right-radius:50px;border-top-left-radius:50px;border-bottom:1px solid rgb(109,108,108)}.footer-content hr{height:200px;border-radius:50%;opacity:.5}.footer-left{display:flex;flex-direction:column;justify-content:center;height:auto;width:500px}.footer-para{font-size:18px;margin-top:30px;opacity:.7}.footer-middle{display:flex;flex-direction:column;justify-content:center}.footer-middle li{margin-bottom:8px;list-style:none}.footer-anchor-link{text-decoration:none;font-size:18px;color:#fff}.footer-right{display:flex;align-items:center;gap:10px}@media (max-width: 1200px){.footer{padding:70px 6% 20px}}@media (max-width: 1100px){.footer{padding:70px 5% 20px}}@media (max-width: 1000px){.footer{padding:70px 5% 20px}.footer-content{flex-direction:column}.footer-left{width:auto}.footer-content hr{height:0;width:500px;margin:40px 0;border-radius:50%;opacity:.5}}@media (max-width: 900px){.footer-content hr{width:400px}}@media (max-width: 600px){.footer-content hr{width:300px}}