@import"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Sirin+Stencil&display=swap";*{padding:0;margin:0;box-sizing:border-box}:root{--bg-body: #f0f2f5;--bg-primary: #ffffff;--main-font: "DM Sans", sans-serif;--sirin-stencil-font: "Sirin Stencil", sans-serif;--primary: #e83538;--primary-dark: #be1719;--primary-dark-plus: #981113;--primary-light: #ec4144;---text-on-primary: #fff;--text-primary-color: #050505;--text-primary-color-inverse: #fff;--text-secondary-color: #65676b;--text-secondary-color-inverse: #b0b3b8;--text-section-title-size: 40px;--small-text-size: 14px;--medium-text-size: 17px;--large-text-size: 20px;--extra-large-text-size: 24px;--very-extra-large-text-size: 28px;--primary-background: linear-gradient(90deg, #e83538b3, #821e1f);--secondary-background: linear-gradient(#e83538da, #821e1f);--overlay-background: rgba(0, 0, 0, .65);--rounded-md: 6px;--rounded-full: 999px;--icon-background: linear-gradient(#e83538, #bf292c);--bg-small: 576px;--bg-medium: 768px;--bg-large: 922px;--bg-extra-large: 1200px;--bg-extra-large-large: 1400px}html{scroll-behavior:smooth}body{font-family:var(--main-font);font-size:var(--medium-text-size);background-color:var(--bg-body)}ul{list-style:none}a{color:unset;text-decoration:unset}.container{width:100%;margin-left:auto;margin-right:auto}@media (min-width: 576px){.container{width:510px}}@media (min-width: 768px){.container{width:700px}}@media (min-width: 992px){.container{width:850px}}@media (min-width: 1200px){.container{width:1100px}}@media (min-width: 1400px){.container{width:1350px}}.btn{display:block;width:fit-content;font-weight:500;text-transform:uppercase;padding:8px 14px;border-radius:var(--rounded-md);transition:.3s;cursor:pointer;border:none;font-family:inherit}.btn-lg{padding:11px 20px}.btn.btn-primary{background-color:var(--primary-dark);color:var(--text-primary-color-inverse)}.btn.btn-primary:hover{background-color:var(--primary-dark-plus)}.btn.btn-icon{background-color:transparent;border:unset}.btn.btn-icon.btn-primary{color:var(--primary);border:1px solid var(--primary)}.btn.btn-icon.btn-primary:hover{color:#fff}.btn:disabled{cursor:not-allowed;background-color:#f0f2f5;color:var(--text-primary-color)}.btn:disabled:hover{background-color:#dfe0e2}section{padding:2rem 1rem}section .section-title{font-family:var(--sirin-stencil-font);text-transform:uppercase;font-size:46px;text-align:center;font-weight:400;margin-bottom:26px}article .article-title{text-transform:uppercase;position:relative;font-size:23px;font-weight:600;padding-left:18px;color:var(--text-primary-color-inverse);margin:10px 0 16px}article .article-title:before{content:"";position:absolute;top:50%;transform:translateY(-50%);left:0;border-width:8px;border-style:solid;border-top-color:transparent;border-bottom-color:transparent;border-left-color:var(--text-primary-color-inverse);border-right-color:transparent}.card{background-color:var(--bg-primary);border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.1)}.card>.card-body{margin-top:6px;padding:5px 12px}.card .card-img img{width:100%;height:100%;object-fit:cover;border-bottom:1px solid rgb(0 0 0 / .1)}.card .card-title{font-weight:600;font-size:19px;margin-bottom:4px;text-transform:uppercase}.card .card-description{font-weight:400;color:var(--text-secondary-color);font-size:15px}.badge{background-color:var(--primary);color:var(---text-on-primary);border-radius:99px;font-weight:300;font-size:14px;padding:2px 12px}.tooltip{position:relative}.tooltip:after{content:attr(tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);opacity:0;transition:.3s;z-index:200;background-color:#000c;color:#fff;padding:2px 12px;border-radius:4px}.tooltip:hover:after{opacity:1}.separator{background-color:#ffffff80;max-width:600px;margin:auto;width:100%;height:2px}header{position:fixed;z-index:100;left:0;right:0;top:0;padding:6px;transition:.3s}header.active{background-color:#0009;box-shadow:1px 2px 3px #0000001a}header .container{display:flex;align-items:center;justify-content:space-between}header h1{color:var(--primary);font-family:var(--sirin-stencil-font);font-weight:400;font-size:1.5rem}@media (min-width: 576px){header h1{font-size:1.8rem}}@media (min-width: 768px){header h1{font-size:2rem}}header nav#menu{overflow:hidden;position:fixed;top:0;left:0;border-top-right-radius:1rem;border-bottom-right-radius:1rem;bottom:0;width:300px;display:flex;flex-direction:column;padding-top:3rem;background-color:#fff}.slide{transform:translate(-100%);transition:.3s}@media (min-width: 1024px){.slide{transform:unset}}.slide-in{transform:translate(0)}header:before{content:"";top:0;left:0;bottom:0;right:0;position:fixed;display:none;background-color:#0009}header nav#menu #close{position:absolute;right:12px;top:12px;width:2rem;height:2rem;display:flex;justify-content:center;align-items:center;border-radius:50%;cursor:pointer}header nav#menu #close i{font-size:24px}header nav#menu #close:hover{background-color:#0003}@media (min-width: 1024px){header nav#menu #close{display:none}header nav#menu{display:flex;position:static;border-radius:var(--rounded-full);flex-direction:row;background-color:unset;padding:0;width:fit-content}header nav#menu a{color:var(--text-primary-color-inverse);padding:8px 14px;background-color:var(--primary-dark);text-transform:uppercase;font-weight:500;transition:.3s;grid-template-columns:repeat(auto-fill,1fr)}header nav#menu a:hover{background-color:var(--primary-dark-plus)}header nav#menu a:first-child{padding-inline-start:18px}header nav#menu a:last-child{padding-inline-end:18px}header .mobile-navigation-toggle{display:none}}header nav a{padding:1rem;border-bottom:1px solid rgba(0,0,0,.1)}header nav a:hover{background-color:#0000001a}section#hero{background-image:url(./images/hero-section-background.webp);background-repeat:no-repeat;background-size:cover;position:relative;display:flex;justify-content:center;align-items:center;height:100vh}@media (min-width: 768px){section#hero{height:calc(100vh - 20px)}}section#hero:after{content:"";background-color:var(--overlay-background);position:absolute;top:0;left:0;bottom:0;right:0}section#hero article{z-index:10;text-align:center}section#hero article p.hi-message{color:var(--text-secondary-color-inverse);text-transform:uppercase;font-size:22px;font-weight:400}section#hero article p.main-message{color:var(--text-primary-color-inverse);font-size:32px;text-transform:uppercase;font-weight:500}@media (min-width: 768px){section#hero article p.hi-message{font-size:30px}section#hero article p.main-message{font-size:64px}}section#hero article p.main-message span{background:linear-gradient(90deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}section#hero article .btn{margin-top:8px;margin-left:auto;margin-right:auto}section#about{background:var(--primary-background);border-bottom-left-radius:2rem;border-bottom-right-radius:2rem}section#about article .about-me{color:var(--text-primary-color-inverse);line-height:1.7}section#about .about-wrapper{display:grid;gap:24px;margin-bottom:16px;align-items:center}section#about .img-wrapper{display:none}@media (min-width: 1280px){section#about .about-wrapper{grid-template-columns:1fr 2fr}section#about .skills-wrapper{grid-template-columns:2fr 1fr}section#about .img-wrapper{display:unset}}section#about .img-wrapper img{margin-left:auto;margin-right:auto;width:400px}section#about article{border-radius:8px;padding:8px}section#about .skills-wrapper{display:grid;gap:24px;align-items:center}section#about .skills-wrapper .skills{display:flex;flex-wrap:wrap;list-style:none;row-gap:24px;column-gap:24px;align-items:center}section#about .skills-wrapper .skills li i{font-size:52px;color:#ddd}@media (min-width: 769px){section#about .skills-wrapper .skills li i{font-size:65px}}@media (min-width: 1400px){section#about .skills-wrapper .skills li i{font-size:72px}}section#about .skills-wrapper .skills li{display:flex;justify-content:center;align-items:center}section#projects .cards-wrapper{display:flex;flex-wrap:wrap;gap:24px}@media (min-width: 768px){section#projects .cards-wrapper .card{width:calc(50% - 12px)}}@media (min-width: 1200px){section#projects .cards-wrapper .card{width:calc(33% - 14px)}}section#projects .badges-wrapper{display:flex;flex-wrap:wrap;margin:8px -4px;width:calc(100% + 4px)}section#projects .badges-wrapper>.badge{margin:4px}section#contact{background:var(--primary-background);border-top-left-radius:2rem;border-top-right-radius:2rem}section#contact .contact-wrapper{display:grid;grid-template-columns:100%;gap:24px}@media (min-width: 768px){section#contact .contact-wrapper{grid-template-columns:50% 50%}}section#contact .contact-wrapper h4{color:var(--text-primary-color-inverse);text-transform:uppercase;margin-bottom:10px}section#contact .contact-wrapper p{color:var(--text-primary-color-inverse);margin-bottom:16px}section#contact .contact-wrapper ul{list-style:none}section#contact .contact-wrapper ul li{display:flex;color:var(--text-primary-color-inverse);text-transform:uppercase;align-items:center}.icon-wrapper{margin-right:10px;background:var(--icon-background);width:44px;height:44px;border-radius:50%;display:flex;justify-content:center;align-items:center}.icon-wrapper img{width:24px}section#contact .contact-wrapper form{background:var(--bg-primary);border-radius:8px;padding:16px;display:block;width:100%;margin:auto}@media (min-width: 768px){section#contact .contact-wrapper form{max-width:450px}}section#contact .contact-wrapper form .input-wrapper{margin-bottom:12px}section#contact .contact-wrapper form .input-label{display:block;color:var(--primary);font-weight:500;margin-bottom:8px}section#contact .contact-wrapper form .input-control{width:100%;background-color:#f0f2f5;padding:8px;font-size:1rem;border:unset;outline-color:var(--primary);border-radius:4px;font-family:inherit}section#contact .contact-wrapper form textarea.input-control{resize:unset}section#contact .contact-wrapper form .note{color:var(--text-secondary-color);margin-top:8px;font-size:14px}footer{background:var(--primary-background);color:var(--text-primary-color-inverse)}footer .container{padding:2rem 1rem;display:flex;flex-direction:column;justify-content:center;row-gap:12px;align-items:center}@media (min-width: 768px){footer .container{justify-content:space-between;flex-direction:row;row-gap:0}}footer .container h2{font-family:var(--sirin-stencil-font);font-weight:500;font-size:1.5rem}@media (min-width: 576px){footer .container h2{font-size:1.8rem}}@media (min-width: 768px){footer .container h2{font-size:2rem}}footer .container>p{text-transform:uppercase;font-weight:500;text-align:center}div#messagesContainer{position:fixed;bottom:1rem;left:1rem;z-index:100}div#messagesContainer .message{padding:.8rem 1.5rem;border-radius:8px;background-color:#000c;color:#fff;font-weight:500;opacity:0;margin-bottom:6px}div#messagesContainer .message.slide-in{animation:slideIn .3s forwards;transform:translateY(120%)}div#messagesContainer .message.slide-out{animation:slideOut .3s forwards;transform:translate(0);opacity:1}@keyframes slideIn{to{opacity:1;transform:translateY(0)}}@keyframes slideOut{to{opacity:0;transform:translate(-120%)}}#projects .card [more-details-target]{position:relative;cursor:pointer;overflow:hidden;aspect-ratio:16/9}#projects .card [more-details-target]:after{content:"";opacity:0;color:var(--text-primary-color-inverse);background-color:#0003;position:absolute;top:0;left:0;bottom:0;right:0;transition:.3s}#projects .card [more-details-target]:hover:after{opacity:1}#projects .card img{width:100%;height:100%;object-fit:cover}#projects .card [more-details-target] img{transition:.3s}#projects .card [more-details-target]:hover img{scale:1.1}.project-details{position:fixed;justify-content:center;align-items:center}.project-details.active{top:0;left:0;right:0;bottom:0;z-index:1000}.project-details .overlay{background-color:var(--overlay-background);position:absolute;top:0;left:0;bottom:0;right:0;opacity:0;transition:.15s}.project-details.active .overlay{opacity:1}.project-details .container{z-index:999;transform:translateY(-100%);height:100%;padding-top:72px;padding-bottom:10px;transition:.15s}@media (min-width: 768px){.project-details .container{padding-bottom:72px}}.project-details.active .container{transform:translateY(0)}.project-details .container .content{background-color:#fff;width:100%;height:100%;border-radius:8px;position:relative;overflow:hidden}.project-details .container .content .close{position:absolute;top:25px;right:20px;cursor:pointer;display:flex;justify-content:center;align-items:center;z-index:10;color:#fff}@media (min-width: 768px){.project-details .container .content .close{color:#000}}.project-details .container .content .details{height:100%;width:100%;display:flex;flex-direction:column;flex-wrap:wrap}.project-details .container .content .details .images-wrapper{width:100%;height:50%;transition:.15s;position:relative;display:flex;justify-content:center;align-items:center;background-color:#000}.project-details .container .content .details .images-wrapper .loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#000000e6;width:45px;height:45px;display:flex;justify-content:center;align-items:center;transition:.15s;opacity:0;border-radius:50%;color:#fff}.project-details .container .content .details .images-wrapper .loading.active{opacity:1}.project-details .container .content .details .images-wrapper img{width:100%;height:auto;object-fit:contain;max-height:100%}.project-details .container .content .details .images-wrapper.expand{height:100%}@media (min-width: 768px){.project-details .container .content .details .images-wrapper.expand{width:100%}}#expand,#minimize{position:absolute;top:20px;left:20px;color:#fff;cursor:pointer;font-size:18px}#expand.active,#minimize.active{display:none}@media (min-width: 768px){.project-details .container .content .details .images-wrapper{width:50%;height:100%}}.project-details .container .content .details .info{width:100%;height:50%;padding:2rem 1rem;overflow-y:auto}@media (min-width: 768px){.project-details .container .content .details .info{width:50%;height:100%}}#slider-prev,#slider-next{font-size:13px;width:34px;height:34px;border-radius:50%;color:#fff;background-color:#000000b3;display:flex;justify-content:center;align-items:center}#slider-prev{position:absolute;left:15px;top:50%;transform:translateY(-50%);cursor:pointer}#slider-next{position:absolute;right:15px;top:50%;transform:translateY(-50%);cursor:pointer}.project-details #dots{display:flex;position:absolute;bottom:30px;left:50%;background-color:#000c;padding:.8rem 1.5rem;border-radius:4px;transform:translate(-50%)}.project-details #dots span{width:10px;height:10px;border-radius:50%;margin:0 3px;border:1px solid rgba(255,255,255,.45)}.project-details #dots span.active{background-color:#fff}.project-details .container .content .details .info .title{text-align:center;font-size:22px;text-transform:uppercase}.project-details .container .content .details .info .date{text-align:center;color:var(--text-secondary-color)}.project-details .container .content .details .info .technologies{display:flex;flex-wrap:wrap;gap:4px}.project-details .container .content .details .info .technologies .tech{padding:12px 8px;width:calc((100% - 8px)/2);border:1px solid rgba(0,0,0,.1);border-radius:4px;color:#000;font-size:19px;background-color:#f9f9f9}@media (min-width: 1280px){.project-details .container .content .details .info .technologies .tech{width:calc((100% - 8px) / 3)}}.project-details .container .content .details .info .link{display:flex;gap:4px}.project-details .container .content .details .info .link a{color:var(--primary);border:1px solid rgba(0,0,0,.1);padding:12px 8px;border-radius:4px;display:block;width:fit-content;transition:.3s}.project-details .container .content .details .info .link a:hover{background-color:#0000001a}#projects p.stay-tunned{color:#0009;text-align:center;margin-top:20px}.custom-icons.mvvm-icon{position:relative;display:inline-block;width:19px;height:19px;background-color:#3498db;border-radius:3px;overflow:hidden;vertical-align:middle;margin:0 2px;line-height:normal}.custom-icons.mvvm-icon:before{content:"";position:absolute;top:3px;left:3px;width:13px;height:13px;border:1px solid white;border-radius:1px;box-sizing:border-box}.custom-icons.mvvm-icon:after{content:"";position:absolute;top:6px;left:6px;width:7px;height:7px;background-color:#fff;clip-path:polygon(0% 0%,100% 0%,100% 40%,60% 40%,60% 100%,0% 100%)}.custom-icons.hilt-icon{position:relative;display:inline-block;width:19px;height:19px;background-color:#3ddc84;border-radius:3px;overflow:hidden;vertical-align:middle;margin:0 2px;line-height:normal}.custom-icons.hilt-icon:before{content:"";position:absolute;top:3px;left:4px;width:11px;height:6px;background-color:#fff;border-radius:5px 5px 0 0}.custom-icons.hilt-icon:after{content:"";position:absolute;top:9px;left:4px;width:6px;height:7px;background-color:#fff;border-radius:0 0 3px 3px;box-shadow:7px -3px 0 -2px #fff,12px -3px 0 -3px #fff}.custom-icons.hilt-icon>i{content:"";position:absolute;right:3px;top:6px;width:2px;height:2px;background-color:#fff;border-radius:1px}.flex{display:flex}.w-full{width:100%}.m-0{margin:0}.my-1{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-2{margin-top:1rem!important;margin-bottom:1rem!important}.mt-1{margin-top:1rem!important}.mt-2{margin-top:2rem!important}.mt-3{margin-top:3rem!important}.w-50p{width:50%}.m-4{margin:4px}.flex-center{justify-content:center;align-items:center}.row{display:flex;flex-wrap:wrap}.text-white{color:#fff}.text-primary{color:var(--text-primary-color)}.text-center{text-align:center}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.hide-scroll::-webkit-scrollbar{height:0}.scroll-container::-webkit-scrollbar{height:6px;padding:4px 0}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent;border-radius:5px;transition:.3s;padding:4px 0}.scroll-container::-webkit-scrollbar-thumb:hover{background-color:#fff}.scroll-container::-webkit-scrollbar-track{background:#000}.scroll-container:hover::-webkit-scrollbar-thumb{background-color:#fffc}.hidden{display:none}