@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif}html{scroll-behavior:smooth}.app{overflow:hidden}a{text-decoration:none;line-height:1}h1,h2,h3,h4,h5,h6,p,span{margin:0;line-height:1.4}input:focus,textarea:focus{outline:0}input,textarea,button{border:none;font-family:Inter,sans-serif}ul{padding:0;margin:0;list-style:none}li{line-height:1}img{width:100%}.light .same-title{color:#121212}.light .same-text{color:#4b5563}.dark .same-title{color:#fff}.dark .same-text{color:#d1d5db}.button{line-height:1;padding:8px 14px;border-radius:6px;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all ease .4s}.scroll-style::-webkit-scrollbar,html::-webkit-scrollbar{width:6px;height:6px;border-radius:10px}.scroll-style::-webkit-scrollbar-track,html::-webkit-scrollbar-track{background-color:#f1f1f1;border-radius:10px}.scroll-style::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{background-color:#4d9bff;border-radius:5px}.app{background-color:#f9fafb;transition:all ease .4s}.app.dark{background-color:#111827}.app .container{padding:20px;display:flex;gap:15px;height:100vh}@media (max-width: 991px){.app .container{flex-direction:column;height:initial;padding:10px 10px 60px}}.app .container.dark .links,.app .container.dark .profile,.app .container.dark .content,.app .container.dark .project,.app .container.dark .project-details-content,.app .container.dark .contact-form{background-color:#1f2937}.app .container .links,.app .container .profile,.app .container .content,.app .container .project,.app .container .project-details-content,.app .container .contact-form{border-radius:18px;box-shadow:0 0 7px #1212122b;background-color:#fff;transition:all ease .4s;overflow:hidden}@media (max-width: 991px){.app .container .sidebar{border-top-left-radius:18px;border-top-right-radius:18px;box-shadow:0 0 7px #1212122b;background-color:#fff;transition:all ease .4s}.app .container .sidebar.dark{background-color:#1f2937}}.app .container .profile{width:380px}@media (max-width: 991px){.app .container .profile{width:100%}}.app .container .content{flex:1}.sidebar{display:flex;flex-direction:column;align-items:center;gap:15px;margin:20px 0 0;position:relative;width:fit-content;padding:0}@media (max-width: 991px){.sidebar{margin:0;position:fixed;z-index:10;bottom:0;left:0;width:100%;gap:12px}}.sidebar .settings{width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background-color:#4d9bff}@media (max-width: 991px){.sidebar .settings{display:none}}.sidebar .settings .icon{font-size:24px;color:#fff}.sidebar .links{display:flex;flex-direction:column;gap:20px;padding:15px 5px;border-radius:18px;box-shadow:0 0 7px #1212122b;background-color:#fff}@media (max-width: 991px){.sidebar .links{padding:7px 0 4px;width:100%;flex-direction:row-reverse;justify-content:space-between;border-radius:0;background-color:transparent}}.sidebar .links.dark a{color:#d1d5db}.sidebar .links a{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:13px;font-weight:500;text-transform:capitalize;padding:7px;border-radius:8px;transition:all ease .4s;cursor:pointer;color:#4b5563}.sidebar .links a:first-of-type{display:none}@media (max-width: 991px){.sidebar .links a{font-size:10px;gap:4px;width:calc(25% - 3px)}.sidebar .links a:first-of-type{display:flex}}.sidebar .links a:hover{background-color:#d1d5db2e}.sidebar .links a .icon{font-size:20px}@media (max-width: 991px){.sidebar .links a .icon{font-size:17px}}.profile.dark>.profile-info>.social-links>.link{background-color:#374151}.profile.dark>.logo-img>.picture{border-color:#1f2937}.profile .logo-img{position:relative;background-image:linear-gradient(90deg,#8cbfff9e,#84baff);height:200px;display:flex;justify-content:center}.profile .logo-img .logo{width:110px;height:fit-content;margin:17px 0 0}.profile .logo-img .picture{position:absolute;z-index:10;width:115px;height:115px;border-radius:50%;background-color:#f9fafb;border:4px solid #ffffff;left:50%;bottom:0;transform:translate(-50%,50%);display:flex;align-items:center;justify-content:center;overflow:hidden}.profile .logo-img .picture img{position:absolute;width:125px;bottom:0}.profile .profile-info{display:flex;flex-direction:column;padding:70px 20px 20px;text-align:center}.profile .profile-info .job-title{font-size:15px;font-weight:600;color:#4d9bff}.profile .profile-info .location{display:flex;align-items:center;justify-content:center;gap:2px;margin:8px 0 17px;font-size:14px}.profile .profile-info .location .icon{font-size:15px}.profile .profile-info .social-links{display:flex;align-items:center;justify-content:center;gap:15px}.profile .profile-info .social-links .link{width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#f3f4f6;cursor:pointer;transition:all ease .4s}.profile .profile-info .social-links .link:hover{background-color:#4d9bff}.profile .profile-info .social-links .link:hover .icon{color:#fff}.profile .profile-info .social-links .link .icon{font-size:16px;transition:all ease .4s}.profile .profile-info .buttons{margin:30px 0 0;display:flex;align-items:center;justify-content:center;gap:15px}.profile .profile-info .buttons .button.cv{background-color:#4d9bff}.profile .profile-info .buttons .button.cv .icon,.profile .profile-info .buttons .button.cv span{color:#fff}.profile .profile-info .buttons .button.email{background-color:transparent;border:1px solid #4d9bff}.profile .profile-info .buttons .button.email:hover{background-color:#4d9bff1a}.profile .profile-info .buttons .button.email .icon,.profile .profile-info .buttons .button.email span{color:#4d9bff}.profile .profile-info .buttons .button .icon,.profile .profile-info .buttons .button span{font-size:14px}.falling-text-container{width:100%;height:100%}.falling-text-container .falling-text-target{position:relative;width:100%;height:100%}.falling-text-container .falling-text-target .word{position:absolute;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;will-change:transform;color:#fff;font-weight:700}.falling-text-container .falling-text-target .word.highlighted{color:#2983f5}.falling-text-container .falling-text-target .word svg,.falling-text-container .falling-text-target .word img{width:40px;height:40px;object-fit:contain}.falling-text-container .falling-text-canvas{position:absolute;inset:0;pointer-events:none}.content{padding:10px 5px}.content .cover{display:flex;flex-direction:column;gap:30px;padding:15px 20px;height:100%;overflow-y:scroll;scroll-behavior:smooth}@media (max-width: 991px){.content .cover{overflow:hidden;padding:15px 10px}}.about-me .description{font-size:15px;line-height:1.6;max-width:95%}.main-heading{display:flex;align-items:center;gap:6px;margin:0 0 25px}.main-heading .title,.main-heading .sub-title{font-size:26px;font-weight:700}.main-heading .sub-title{color:#4d9bff}.main-heading .img{width:35px}.my-skills.dark>.taps>li{background-color:#374151}.my-skills.dark>.skills-content>.box{background-color:#111827}.my-skills .skills-content{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px 10px}.my-skills .skills-content .box{height:fit-content;display:flex;gap:14px;align-items:center;background-color:#4d9bff1a;padding:14px 18px;border-radius:10px;border:1px solid #4d9bff;color:#4d9bff}.my-skills .skills-content .box:hover>span{color:#2983f5;transition:all ease .4s;-webkit-transition:all ease .4s;-moz-transition:all ease .4s;-ms-transition:all ease .4s;-o-transition:all ease .4s}.my-skills .skills-content .box svg{width:20px;height:20px;fill:#4d9bff}.my-skills .skills-content .box span{font-size:14px;font-weight:600;text-align:center}.my-projects.dark>.my-projects-content>.project{border-color:#374151}.my-projects.dark>.my-projects-content>.project .details{border-color:#374151}.my-projects.dark>.my-projects-content>.project .details .skills>span{background-color:#374151}.my-projects .my-projects-content{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px 15px;overflow:hidden}.my-projects .my-projects-content .project{position:relative;border:1px solid #e5e7eb;border-radius:8px;display:flex;flex-direction:column;transform-style:preserve-3d;will-change:transform}.my-projects .my-projects-content .project:hover>.details>.title{color:#2983f5;transition:all ease .4s;-webkit-transition:all ease .4s;-moz-transition:all ease .4s;-ms-transition:all ease .4s;-o-transition:all ease .4s}.my-projects .my-projects-content .project .badge{position:absolute;bottom:60px;right:0;background-color:#4d9bff;color:#fff;font-size:13px;padding:2px 7px;border-top-left-radius:4px;border-bottom-left-radius:4px}.my-projects .my-projects-content .project .img-box{position:relative;display:flex;height:14rem;overflow:hidden}.my-projects .my-projects-content .project .details{padding:15px;border-top:1px solid #e5e7eb}.my-projects .my-projects-content .project .details .title{color:#4d9bff;cursor:pointer;transition:all ease .4s}.my-projects .my-projects-content .project .details .skills{display:flex;align-items:center;gap:8px;margin:12px 0 0}.my-projects .my-projects-content .project .details .skills .skill{width:20px;height:20px}.my-projects .my-projects-content .project .actions{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-top:10px;flex:1}.my-projects .my-projects-content .project .actions .icon-box{padding:5px 8px;display:flex;align-items:center;gap:3px;border-radius:4px}.my-projects .my-projects-content .project .actions .icon-box:first-of-type{background-color:#4d9bff;border-top-left-radius:0;border-bottom-left-radius:0}.my-projects .my-projects-content .project .actions .icon-box:first-of-type:hover{background-color:#63a2f3}.my-projects .my-projects-content .project .actions .icon-box:last-of-type{background-color:#4b5563;border-top-right-radius:0;border-bottom-right-radius:0}.my-projects .my-projects-content .project .actions .icon-box:last-of-type:hover{background-color:#585b5f}.my-projects .my-projects-content .project .actions .icon-box .icon,.my-projects .my-projects-content .project .actions .icon-box span{font-size:12px;color:#fff}.project-details{position:fixed;z-index:15;width:100%;height:100%;background-color:transparent;top:0;left:0;transition:all ease .4s}.project-details.dark .close-icon{background-color:#374151}.project-details.close{display:none}.project-details .container{position:relative;height:100%}.project-details .container .project-details-content{flex:1;padding:30px 10px}.project-details .container .project-details-content .scroll{overflow-y:scroll;height:100%;display:grid;grid-template-columns:repeat(2,calc(50% - 15px));gap:30px;padding:15px 10px 0}@media (max-width: 991px){.project-details .container .project-details-content .scroll{grid-template-columns:repeat(1,1fr)}}.project-details .container .project-details-content .scroll .close-box{position:absolute;z-index:10;right:45px;top:30px;width:28px;height:28px;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;cursor:pointer}.project-details .container .project-details-content .scroll .close-box .icon{font-size:28px}.project-details .container .project-details-content .video-box{height:max-content;border-radius:8px;overflow:hidden}.project-details .container .project-details-content .video-box video{width:100%!important;height:initial!important}.project-details .container .project-details-content .details-box .title{color:#4d9bff}.project-details .container .project-details-content .details-box .description{font-size:15px;margin:10px 0 0}.project-details .container .project-details-content .details-box .same-box{margin:20px 0 0}.project-details .container .project-details-content .details-box .same-box h4{margin:0 0 12px;padding:0 0 2px;width:fit-content;border-bottom:1px solid #4d9bff}.project-details .container .project-details-content .details-box .same-box h4 span{color:#4d9bff}.project-details .container .project-details-content .details-box .same-box .list{display:flex;flex-direction:column;gap:7px}.project-details .container .project-details-content .details-box .same-box .list li{display:flex;align-items:center;gap:8px}.project-details .container .project-details-content .details-box .same-box .list li .dot{min-width:6px;height:6px;border-radius:50%;background-color:#4d9bff}.project-details .container .project-details-content .details-box .same-box .list li .key{text-transform:capitalize;font-size:14px;font-weight:700;display:flex;flex-wrap:wrap;gap:0 5px}.project-details .container .project-details-content .details-box .same-box .list li .key .value{text-transform:initial;font-size:13px;font-weight:400}.contact-me .contact-content{display:flex;gap:30px;overflow:hidden}@media (max-width: 1115px){.contact-me .contact-content{flex-direction:column}}.contact-me .contact-content .contact-info{width:fit-content;display:flex;flex-direction:column;gap:30px}.contact-me .contact-content .contact-info .box{display:flex;align-items:center;gap:15px}.contact-me .contact-content .contact-info .box .icon-box{width:38px;height:38px;border-radius:50%;background-color:#4d9bff33;display:flex;align-items:center;justify-content:center}.contact-me .contact-content .contact-info .box .icon-box .icon{font-size:20px;color:#4d9bff}.contact-me .contact-content .contact-info .box .details{display:flex;flex-direction:column;gap:5px}.contact-me .contact-content .contact-info .box .details .key{width:fit-content;font-size:16px;font-weight:700}.contact-me .contact-content .contact-info .box .details .value{font-size:14px;font-weight:500;transition:all ease .4s}.contact-me .contact-content .contact-info .box .details .value:hover{color:#4d9bff}.contact-me .contact-content .contact-info .available{width:200px;background-color:#4d9bff1a;padding:10px;border:1px solid #4d9bff;border-radius:6px}@media (max-width: 1115px){.contact-me .contact-content .contact-info .available{width:100%}}.contact-me .contact-content .contact-info .available .active{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600}.contact-me .contact-content .contact-info .available .active span{width:10px;height:10px;border-radius:50%;background-color:#22c55e}.contact-me .contact-content .contact-info .available .description{font-size:13px;margin:5px 0 0}.contact-me .contact-content .contact-form{flex:1;border:1px solid #4d9bff;padding:15px;position:relative}.contact-me .contact-content .contact-form form{margin:15px 0 0}.contact-me .contact-content .contact-form form .box{display:flex;flex-direction:column;gap:3px;margin:0 0 10px}.contact-me .contact-content .contact-form form .box label{font-size:12px;font-weight:500}.contact-me .contact-content .contact-form form .box label span{color:#4d9bff}.contact-me .contact-content .contact-form form .box .input-box{border-radius:6px;border:1px solid #d1d5db;padding:0 7px;display:flex;align-items:center;justify-content:space-between;transition:all ease .4s}.contact-me .contact-content .contact-form form .box .input-box:focus-within{border-color:#4d9bff}.contact-me .contact-content .contact-form form .box .input-box.error{border-color:red}.contact-me .contact-content .contact-form form .box .input-box input,.contact-me .contact-content .contact-form form .box .input-box textarea{flex:1;height:36px;font-size:15px;background-color:transparent}.contact-me .contact-content .contact-form form .box .input-box textarea{height:120px;resize:none}.contact-me .contact-content .contact-form form .box .input-box .error-icon{font-size:18px;color:red;display:none}.contact-me .contact-content .contact-form form .box .error-message{font-size:12px;color:red}.contact-me .contact-content .contact-form form .button{background-color:#4d9bff;color:#fff;width:100%;padding:14px;justify-content:center}.contact-me .contact-content .contact-form .notify{position:absolute;top:20px;right:15px;width:fit-content;text-align:end;background-color:#22c55e;padding:7px 12px;border-radius:8px;font-size:13px;font-weight:600;color:#fff;display:none}.contact-me .contact-content .contact-form .notify.open{display:block}.contact-me .contact-content .contact-form .notify.error{background-color:red}
