@charset "UTF-8";:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;margin:0 auto;padding:0;min-height:100vh;font-size:16px;color-scheme:light dark;color:#fff;background-color:#1e1e1e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root button{background-color:#678184;color:#fff;border-style:none;padding:16px 20px;border-radius:24px;cursor:pointer;transition:.5s;font-size:16px;justify-content:center;display:flex;gap:8px;align-items:center;text-wrap:nowrap}:root button svg{width:16px;height:16px;transition:.5s}:root button:hover{color:#678184;transition:.5s;background-color:#ccc}:root button:hover svg{transition:.5s;fill:#678184}:root img{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:root h1{font-size:48px;color:#678184}:root h2{font-size:32px}:root h3{font-size:24px}:root h4{font-size:20px}:root button{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}:root p{color:#ccc}:root ul{list-style:none}:root a{text-decoration:none;color:#fff}*{margin:0;padding:0;box-sizing:border-box}#root{margin:0 auto}.main-container{display:flex;flex-direction:column}@media (max-width: 900px){.main-container h1{font-size:32px}.main-container h2{font-size:24px}.main-container h3{font-size:20px}.main-container h4{font-size:16px}.main-container p,.main-container span{font-size:12px}.main-container button{font-size:12px;padding:16px;width:auto;text-wrap:nowrap}}.language-selector{position:relative;display:flex;align-items:center;cursor:pointer}.language-selector .selected-language{display:flex;align-items:center;gap:8px}.language-selector .selected-language:hover .flag-container{border:2px solid #cccccc}.language-selector .selected-language:hover .arrow svg g{fill:#ccc}.language-selector .selected-language .flag-container{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #678184;display:flex;align-items:center;justify-content:center;transition:.5s}.language-selector .selected-language .arrow{display:flex}.language-selector .selected-language .arrow svg{width:20px;height:20px;transition:transform .5s ease}.language-selector .selected-language .arrow svg g{transition:.1s;fill:#678184}.language-selector .selected-language .arrow.rotate svg{transform:rotate(180deg)}.language-selector .dropdown{position:absolute;top:60px;border:2px solid #678184;border-radius:50%;box-shadow:0 4px 8px #0000001a;z-index:10;display:flex;transition:.5s}.language-selector .dropdown:hover{border:2px solid #cccccc}.language-selector .dropdown .dropdown-item{display:flex;align-items:center;height:max-content}.language-selector .dropdown .dropdown-item svg{width:36px;height:36px}@media (max-width: 900px){.language-selector .selected-language:hover .flag-container{border:2px solid #1e1e1e}.language-selector .selected-language:hover .arrow svg g{fill:#1e1e1e}}@media (max-width: 420px){.language-selector .selected-language .flag-container{width:32px;height:32px}.language-selector .dropdown .dropdown-item svg{width:28px;height:28px}}.header-container{padding:24px 40px 0;display:flex;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;justify-content:space-between;z-index:1;position:fixed;top:0;width:100%;pointer-events:none}.header-container .logo{cursor:pointer;display:flex;align-items:center;gap:4px;pointer-events:auto}.header-container .logo:hover .logo-icon{transition:.5s;padding:0 0 4px 4px;fill:#ccc;stroke:#ccc}.header-container .logo:hover .logo-text span{color:#ccc;transition:.5s}.header-container .logo .logo-icon{width:44px;height:44px;transition:.5s;fill:#678184;stroke:#678184}.header-container .logo .logo-text{display:flex;flex-direction:column}.header-container .logo .logo-text span{color:#678184;transition:.5s;text-align:center}.header-container .logo .logo-text .name{font-size:20px;font-weight:700;letter-spacing:2px}.header-container .logo .logo-text .description{font-size:12px}.header-container .header-right{display:flex;gap:20px;pointer-events:auto}.header-container .header-right .menu{display:flex;align-items:center;gap:8px;cursor:pointer}.header-container .header-right .menu span{font-size:12px;transition:.5s;color:#678184;letter-spacing:2px;font-weight:700}.header-container .header-right .menu svg{transition:.5s;width:24px;fill:#678184}.header-container .header-right .menu:hover span{color:#ccc}.header-container .header-right .menu:hover svg{fill:#ccc}@media (max-width: 900px){.header-container{padding:12px 20px;width:100%;background-color:#fffc}.header-container button:hover{background-color:#1e1e1e}.header-container .logo:hover .logo-icon{fill:#1e1e1e;stroke:#1e1e1e}.header-container .logo:hover .logo-text span{color:#1e1e1e}.header-container .header-right{display:flex;gap:20px;pointer-events:auto}.header-container .header-right .menu:hover span{color:#1e1e1e}.header-container .header-right .menu:hover svg{fill:#1e1e1e}}@media (max-width: 440px){.header-container .logo .logo-icon{width:36px;height:36px}.header-container .logo .logo-text .name{font-size:16px}.header-container .logo .logo-text .description{font-size:8px}.header-container .header-right .menu svg{width:20px}.header-container .header-right .menu span{display:none}}.slide-down-menu{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:fixed;top:-80%;left:0;width:100%;height:80%;background-color:#678184;transition:.3s ease-in-out;z-index:2;border-bottom:solid #678184;visibility:hidden}.slide-down-menu.open{visibility:visible;top:0}.slide-down-menu .top-content{display:flex;height:72px;padding:24px 40px 0;justify-content:end}.slide-down-menu .top-content button{background-color:#ccc;color:#678184}.slide-down-menu .top-content button:hover{background-color:#fff}.slide-down-menu .top-content button svg{fill:#678184}.slide-down-menu .top-content .close-menu{display:flex;align-items:center;gap:8px;cursor:pointer}.slide-down-menu .top-content .close-menu span{font-size:12px;transition:.5s;color:#ccc;letter-spacing:2px;font-weight:700}.slide-down-menu .top-content .close-menu svg{width:20px}.slide-down-menu .top-content .close-menu svg g{transition:.1s;fill:#ccc}.slide-down-menu .top-content .close-menu:hover span{color:#fff}.slide-down-menu .top-content .close-menu:hover svg g{fill:#fff}.slide-down-menu .menu-content{height:80%;display:flex;flex-direction:column;align-items:center;justify-items:center}.slide-down-menu .menu-content span{color:#ccc;letter-spacing:2px}.slide-down-menu .menu-content ul{list-style:none;display:flex;flex-direction:column;height:100%;align-items:center;justify-content:center;gap:4px}.slide-down-menu .menu-content ul li{cursor:pointer;position:relative}.slide-down-menu .menu-content ul li h1{color:#ccc;display:flex;align-items:center;gap:8px;transition:color .3s ease-in-out}.slide-down-menu .menu-content ul li h1:before{content:"—";color:#fff;display:inline-block;position:absolute;transform:translate(-200%);opacity:0;transition:.3s ease-in-out}.slide-down-menu .menu-content ul li h1.active{color:#fff}.slide-down-menu .menu-content ul li h1.active:before{opacity:1;transform:translate(-120%)}.slide-down-menu .menu-content ul li:hover h1{color:#fff}.slide-down-menu .menu-content ul li:hover h1:before{opacity:1;transform:translate(-120%)}@media (max-width: 900px){.slide-down-menu .top-content{padding:12px 20px}}@media (max-width: 440px){.slide-down-menu .top-content .close-menu span{display:none}}@media (max-height: 820px){.slide-down-menu .menu-content ul li h1{font-size:32px}}@media (max-height: 640px){.slide-down-menu .menu-content ul li h1{font-size:24px}}@media (max-height: 540px){.slide-down-menu .menu-content ul li h1{font-size:20px}}footer{display:flex;flex-direction:column;align-self:center;width:100%;max-width:1360px}footer hr{width:100%;opacity:50%;color:#ccc}footer .footer-content{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-block:80px}footer .footer-content a{color:#678184;transition:.3s ease}footer .footer-content a:hover{transition:.3s ease;text-decoration:underline 2px}footer .footer-content h4{color:#678184}footer .footer-content .footer-column{display:flex;flex-direction:column;gap:20px}footer .footer-content .copyright{display:flex;align-items:center;gap:8px;text-wrap:nowrap}footer .footer-content .copyright .logo{cursor:pointer}footer .footer-content .copyright .logo .logo-icon{width:40px;height:40px;fill:#ccc;stroke:#ccc}@media (max-width: 1500px){.main-container footer{padding-inline:40px;max-width:none}}@media (max-width: 900px){.main-container footer{padding-inline:20px}.main-container footer .footer-content{grid-template-columns:repeat(1,1fr)}}.scroll-up{position:fixed;bottom:40px;right:40px;transition:.3s ease}.scroll-up.visible{opacity:.5;transform:translateY(0);pointer-events:all;border-radius:50%;background-color:#ccc;padding:8px}.scroll-up.visible svg{width:36px;height:36px}.scroll-up.visible svg path{stroke:#678184}.scroll-up.visible:hover{background-color:#fff;transform:scale(1.1)}.scroll-up.hidden{opacity:0;transform:translateY(20px);pointer-events:none;border-radius:50%;padding:8px}.scroll-up.hidden svg{width:36px;height:36px}.scroll-up.hidden svg path{stroke:#678184}.loading-screen{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(#678184,#1e1e1e);display:flex;justify-content:center;align-items:center;z-index:1000;transition:transform 1s ease-in-out;overflow-y:scroll}.loading-screen.slide-up{overflow-y:initial;transform:translateY(-100%)}.loading-screen .logo-container{width:56px;height:56px;display:flex;position:absolute}.loading-screen .logo-container .logo-icon{width:100%;height:100%;fill:#fff}.loading-screen .logo-container .loading-spinner{display:flex;position:absolute;border:4px solid #f3f3f3;border-top:4px solid #678184;border-radius:50%;width:56px;height:56px;animation:spin 1s linear infinite}.loading-screen .bottom{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;display:flex;position:fixed;top:0;left:0;padding:80px;flex-direction:column}.loading-screen .bottom h1{color:#fff}.loading-screen .bottom p{color:#fff;letter-spacing:2px}@media (max-width: 500px){.loading-screen .bottom{padding:20px}}.content{display:flex;flex-direction:column;width:100%;max-width:1360px;align-self:center;align-items:center;padding-bottom:120px}.content.hidden{display:none}.content .introduction{display:flex;align-items:center;min-height:100vh}.content .introduction .content-left{display:flex;flex-direction:column;width:40%;gap:20px}.content .introduction .content-left span{letter-spacing:8px}.content .introduction .content-left .main-links{display:flex;gap:20px;align-items:center}.content .introduction .content-right{display:flex;width:60%;justify-content:center;align-items:center}.content .introduction .content-right img{width:600px}.content .projects{display:flex;min-height:100vh;flex-direction:column;padding-top:120px;gap:80px}.content .projects .title span{font-size:12px;letter-spacing:4px}.content .projects .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:120px}.content .projects .grid .item{display:flex;flex-direction:column;padding:20px;height:780px;background-position:center;background-size:cover;transition:.5s;background-blend-mode:multiply}.content .projects .grid .item .view-git{color:#fff;opacity:0;transition:.5s}.content .projects .grid .item:hover{background-position:right bottom;background-color:#678184}.content .projects .grid .item:hover .view-git{margin-top:20px;opacity:100}.content .contact-link{display:flex;padding-top:120px;flex-direction:column;gap:20px;align-items:center}.content .contact-link p{letter-spacing:2px}.content .contact-link .link{display:flex;gap:8px;align-items:center;transition:box-shadow .3s ease}.content .contact-link .link:hover{box-shadow:0 2px #678184}.content .contact-link .link svg{width:72px;height:72px;fill:#678184}@media (max-width: 1500px){.content{padding-inline:40px}}@media (max-width: 1300px){.content .introduction{padding-top:160px}.content .introduction .content-right img{width:400px}.content .projects .grid .item{height:600px}}@media (max-width: 1100px){.content .projects .grid .item{height:480px}}@media (max-width: 900px){.content{padding-inline:20px}.content .introduction{flex-direction:column-reverse;justify-content:center}.content .introduction .content-left{width:auto;z-index:1}.content .introduction .content-right{width:auto;margin-bottom:-48px}.content .introduction .content-right img{width:340px}.content .projects .grid{grid-template-columns:repeat(1,1fr)}.content .projects .grid .item{height:780px}.content .contact-link .link svg{width:52px;height:52px}}@media (max-width: 650px){.content .projects .grid .item{height:600px}}@media (max-width: 500px){.content .projects .grid .item{height:480px}.content .contact-link p{text-align:center}.content .contact-link a h1{font-size:20px}.content .contact-link .link svg{width:32px;height:32px}}@media (max-width: 360px){.content .introduction .content-right img{width:280px}}.animated-section{opacity:0;transform:translateY(20px);transition:opacity 2s ease,transform 1s ease}.animated-section.visible{opacity:1;transform:translateY(0)}.image-loader{position:relative}.image-loader .logo-container{display:flex;position:absolute;justify-content:center;align-items:center;width:100%;height:100%}.image-loader .logo-container .logo-icon{width:56px;height:56px;fill:#fff}.image-loader .logo-container .loading-spinner{display:flex;position:absolute;border:4px solid #f3f3f3;border-top:4px solid #678184;border-radius:50%;width:56px;height:56px;animation:spin 1s linear infinite}img{opacity:1;transition:opacity .5s ease-in-out}img.hidden{opacity:0}.background-loader{position:relative}.background-loader .logo-container{width:56px;height:56px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1}.background-loader .logo-container .logo-icon{width:100%;height:100%;fill:#fff}.background-loader .logo-container .loading-spinner{display:flex;position:absolute;border:4px solid #f3f3f3;border-top:4px solid #678184;border-radius:50%;width:56px;height:56px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.project-main{padding-top:160px;display:flex;flex-direction:column;width:100%;max-width:1360px;align-self:center;padding-bottom:120px;gap:120px}.project-main.hidden{display:none}.project-main p{letter-spacing:4px}.project-main .top-container{display:flex}.project-main .top-container .left-content{display:flex;flex-direction:column;gap:20px;width:50%}.project-main .top-container .left-content .item{display:flex;flex-direction:column;gap:4px}.project-main .top-container .left-content .item a{width:fit-content;text-wrap:nowrap;color:#678184;text-decoration:underline 2px;display:flex;align-items:center;transition:color .3s}.project-main .top-container .left-content .item a:hover{color:#ccc}.project-main .top-container .left-content .item a:hover svg{fill:#ccc}.project-main .top-container .left-content .item a svg{width:20px;height:20px;fill:#678184;transition:fill .3s}.project-main .top-container .left-content .item .technologies{display:flex;width:100%;gap:20px}.project-main .top-container .left-content .item .technologies svg{width:40px;height:40px}.project-main .top-container .right-content{width:50%;display:flex;flex-direction:column;gap:8px}.project-main .project-images{display:flex;flex-direction:column;gap:80px}.project-main .project-images img{width:100%}.project-main .project-images .mobile{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}@media (max-width: 1500px){.project-main{padding-inline:40px}}@media (max-width: 900px){.project-main{padding-inline:20px}.project-main .top-container{flex-direction:column;gap:80px}.project-main .top-container .left-content,.project-main .top-container .right-content{width:100%}.project-main .project-images .mobile{grid-template-columns:repeat(2,1fr)}}.error-container.hidden{display:none}.error-container .error-content{display:flex;flex-direction:column;min-height:100vh;align-items:center;justify-content:center;gap:20px;text-align:center}.error-container .error-content p{letter-spacing:2px}.error-container .error-content h1{font-size:160px;transform:rotate(-.01turn)}@media (max-width: 360px){.error-container .error-content{padding-inline:20px}.error-container .error-content h1{font-size:120px}}.about-container{display:flex;flex-direction:column;width:100%;max-width:1360px;align-self:center;padding-block:120px}.about-container.hidden{display:none}.about-container .content{display:flex;flex-direction:column;min-height:100vh;width:100%;gap:40px;text-align:center;align-items:center}.about-container .content a{width:fit-content}.about-container .content span{font-size:12px;letter-spacing:4px}.about-container .content .title{display:flex;flex-direction:column;width:100%}.about-container .content .skills{display:flex;flex-direction:column;gap:20px}.about-container .content .skills .logos{display:flex;flex-wrap:wrap;width:100%;justify-content:space-between;gap:20px}.about-container .content .skills .logos svg{width:40px;height:40px}.contact-container{display:flex;flex-direction:column;width:100%;max-width:1360px;align-self:center;padding-block:120px;min-height:100vh}.contact-container.hidden{display:none}.contact-container span{font-size:12px;letter-spacing:4px}.contact-container .content{display:flex;flex-direction:row;width:100%;gap:80px;align-items:start}.contact-container .content .left-content{display:flex;flex-direction:column;width:40%;gap:20px}.contact-container .content .left-content .socials{display:flex;align-items:center;justify-content:space-between}.contact-container .content .left-content .socials svg{width:40px;height:40px;transition:filter .5s ease}.contact-container .content .left-content .socials svg:hover{filter:brightness(1.5)}.contact-container .content .right-content{width:60%}.contact-container .content .right-content form{display:flex;flex-direction:column;gap:20px}.contact-container .content .right-content form .form-group{display:flex;flex-direction:column}.contact-container .content .right-content form .form-group label{margin-bottom:8px;color:#ccc}.contact-container .content .right-content form .form-group input,.contact-container .content .right-content form .form-group textarea{width:100%;padding:12px;outline:none;border-style:none;box-shadow:0 0 20px -18px;border-bottom:1px solid #ccc;background-color:transparent;white-space:wrap;transition:.5s;overflow:hidden;resize:none;white-space:pre-wrap;word-wrap:break-word;font-family:inherit;font-size:16px}.contact-container .content .right-content form .form-group input:is(:-webkit-autofill,:autofill),.contact-container .content .right-content form .form-group textarea:is(:-webkit-autofill,:autofill){-webkit-box-shadow:0 0 0 50px #1e1e1e inset;-webkit-text-fill-color:#fff;transition:background-color 5000s ease-in-out 0s}.contact-container .content .right-content form .form-group input:is(:-webkit-autofill,:autofill):focus,.contact-container .content .right-content form .form-group textarea:is(:-webkit-autofill,:autofill):focus{-webkit-box-shadow:0 0 0 50px #1e1e1e inset;-webkit-text-fill-color:#fff}.contact-container .content .right-content form .form-group input:focus,.contact-container .content .right-content form .form-group textarea:focus{border-bottom:1px solid #fff;box-shadow:0 0 20px -17px}.contact-container .content .right-content form .form-group .error{letter-spacing:normal;color:#ff6b6b;font-size:12px;margin-top:4px}.contact-container .content .right-content form button{width:fit-content;color:#fff}.contact-container .content .right-content form button svg{width:16px;height:16px}.contact-container .content .right-content form button:disabled{background-color:#ccc;cursor:not-allowed}.contact-container .content .right-content form button:disabled:hover{background-color:#ccc}.contact-container .content .popup{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.contact-container .content .popup .popup-content{background-color:#678184;padding:16px;border-radius:16px;display:flex;flex-direction:column;gap:20px}.contact-container .content .popup .popup-content .close-container{display:flex;justify-content:end}.contact-container .content .popup .popup-content .close-container .close-popup{display:flex;align-items:center;gap:4px;cursor:pointer}.contact-container .content .popup .popup-content .close-container .close-popup span{font-size:12px;transition:.5s;color:#ccc;letter-spacing:2px;font-weight:700}.contact-container .content .popup .popup-content .close-container .close-popup svg{width:16px}.contact-container .content .popup .popup-content .close-container .close-popup svg g{transition:.1s;fill:#ccc}.contact-container .content .popup .popup-content .close-container .close-popup:hover span{color:#fff}.contact-container .content .popup .popup-content .close-container .close-popup:hover svg g{fill:#fff}@media (max-width: 900px){.contact-container .content{flex-direction:column}.contact-container .content .left-content,.contact-container .content .right-content{width:100%}.contact-container .content .right-content form .recaptcha-wrapper{transform:scale(.85);transform-origin:left top}.contact-container .content .right-content form button svg{width:12px;height:12px}}
