.background{position:fixed;width:100%;height:100vh;z-index:-1;background:#171717}.background video{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);object-fit:cover;z-index:-1}.section{height:100vh}.login{display:flex;flex-direction:column;width:30%;justify-content:center;height:calc(100vh - 40px);padding:20px;gap:16px}.login h1{color:#ededed;font-family:Anton;font-size:50px}.login form{display:flex;flex-direction:column;gap:20px}.login input{padding:20px;border:none;outline:none;background:#ededed;color:#171717;font-size:16px}.login input::placeholder{color:#be3144}.login .password{display:flex;position:relative;align-items:center}.login .password input{display:flex;width:100%}.login .password img{width:24px;height:24px;position:absolute;right:16px}.login button{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;background:#be3144;color:#ededed;border:none;outline:none;text-transform:uppercase;font-size:16px;cursor:pointer}.login img{width:16px;height:16px;cursor:pointer}.login p{color:#ededed;text-align:end}.login a{text-decoration:none;color:#be3144;font-weight:700}.login a:hover{text-decoration:underline}@media (max-width: 1080px){.login{width:50%}}@media (max-width: 720px){.login{display:flex;width:calc(100% - 40px);align-items:center}.login h1,.login form,.login p{width:70%}}@media (max-width: 486px){.login h1,.login form,.login p{width:100%}}.register{display:flex;flex-direction:column;width:30%;justify-content:center;height:calc(100vh - 40px);padding:20px;gap:16px}.register h1{color:#ededed;font-family:Anton;font-size:50px}.register form{display:flex;flex-direction:column;gap:20px}.register input{padding:20px;border:none;outline:none;background:#ededed;color:#171717;font-size:16px}.register input::placeholder{color:#be3144}.register .password{display:flex;position:relative;align-items:center}.register .password input{display:flex;width:100%}.register .password img{width:24px;height:24px;position:absolute;right:16px}.register button{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;background:#be3144;color:#ededed;border:none;outline:none;text-transform:uppercase;font-size:16px;cursor:pointer}.register img{width:16px;height:16px;cursor:pointer}.register p{color:#ededed;text-align:end}.register a{text-decoration:none;color:#be3144;font-weight:700}.register a:hover{text-decoration:underline}@media (max-width: 1080px){.register{width:50%}}@media (max-width: 720px){.register{display:flex;width:calc(100% - 40px);align-items:center}.register h1,.register form,.register p{width:70%}}@media (max-width: 486px){.register h1,.register form,.register p{width:100%}}.messages{display:flex;flex-direction:column;justify-content:center;gap:20px;margin:20px 10%;height:calc(100vh - 40px)}.messages h1{color:#ededed;align-items:flex-start;font-family:Anton;font-size:50px}.messages-list{display:flex;flex-direction:column;gap:20px;overflow:scroll;height:calc(100vh - 40px)}.messages-list p{color:#be3144}.message,.message-skeleton{display:flex;flex-direction:column;color:#000;padding:16px;width:calc(100% - 32px);background:#fff;margin-top:0}.message-skeleton{gap:19px}.message-user,.message-user-skeleton{display:flex;gap:10px}.message-user img{width:24px;height:24px}.message-user-image-skeleton{width:24px;height:24px;background:linear-gradient(90deg,#f4f4f4 25%,#e0e0e0,#f4f4f4 75%);background-size:200% 100%;animation:shimmer 1.5s infinite linear;border-radius:50%}.message p{margin-top:10px}.message-user-name-skeleton{width:200px;background:linear-gradient(90deg,#f4f4f4 25%,#e0e0e0,#f4f4f4 75%);background-size:200% 100%;animation:shimmer 1.5s infinite linear}.message-user-message-skeleton{width:100%;height:20px;background:linear-gradient(90deg,#f4f4f4 25%,#e0e0e0,#f4f4f4 75%);background-size:200% 100%;animation:shimmer 1.5s infinite linear}.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px;position:sticky;top:0;background:#000;z-index:1000}.topbar-logo{display:flex;background:none;border:none;cursor:pointer;padding:0}.topbar-logo img{width:24px;height:24px}.topbar-menu{display:none}.topbar-menu img{width:24px;height:24px;cursor:pointer}.topbar-menu-links,.topbar-links{display:flex;gap:20px}.topbar-links a,.topbar-menu-links a{color:#be3144;text-decoration:none;width:fit-content;cursor:pointer;position:relative;overflow:hidden}@media (max-width: 627px){.topbar-menu{display:flex}.topbar-links{display:none}.topbar-menu-links{position:absolute;background:#000;top:64px;right:0;display:flex;padding:20px;flex-direction:column}}.home{position:relative;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 104px);margin:0 10%}.role{color:#ededed;font-family:Anton;font-size:12vw;line-height:1;cursor:default}.role span{color:#be3144}.name{color:#ededed;font-family:Anton;font-size:9vw;cursor:default}.techs{width:100%;margin-inline:auto;position:relative;height:44px;overflow:hidden;-webkit-mask-image:linear-gradient(to right,#0000,#000 20%,#000 80%,#0000);mask-image:linear-gradient(to right,#0000,#000 20%,#000 80%,#0000)}.tech{width:150px;display:grid;place-content:center;border-radius:24px;padding:10px 25px;background-color:#be3144;position:absolute;color:#ededed;right:max(1600px,100%);font-size:20px;animation:scrollRight 30s linear infinite}@keyframes scrollRight{to{right:-200px}}.css{animation-delay:-26.25s}.html{animation-delay:-22.5s}.js{animation-delay:-18.75s}.react{animation-delay:-15s}.angular{animation-delay:-11.25s}.node{animation-delay:-7.5s}.express{animation-delay:-3.75s}.ts{animation-delay:-0s}@media (max-width: 627px){.home{margin:0;padding:20px;align-items:flex-start}.role{font-size:20vw}.name{text-align:left;font-size:10vw}}.about{display:flex;flex-direction:column;align-items:start;justify-content:center;height:100vh;padding:20px;margin:0 10%}.about h1{color:#ededed;align-items:flex-start;font-family:Anton;font-size:50px;margin-top:64px}.aboutContent{display:flex;flex-direction:column;gap:10px}.aboutContent h2{color:#444;font-size:30px;text-transform:uppercase}.technologies{display:flex;gap:20px}.frontend,.backend,.other{padding:30px;color:#ededed;width:30%;text-transform:capitalize}.frontend h3,.backend h3,.other h3{text-transform:uppercase}.frontend,.other{background:#be3144}.backend{background:#171717}@media (max-width: 785px){.technologies{flex-direction:column}.frontend,.backend,.other{width:calc(100% - 60px)}}@media (max-width: 627px){.about{margin:0}}.projects{position:relative;min-height:350vh;padding:20px;margin:0 10%}.projects h1{color:#ededed;font-family:Anton;font-size:50px;margin-top:64px}.projects-wrapper{position:sticky;top:0;display:flex;align-items:center;height:100vh;overflow:hidden}.projects-container{display:flex;gap:2vw;will-change:transform}.project{display:flex;flex-direction:column;background:#fff;scroll-snap-align:center;padding:20px;gap:20px;height:fit-content}.project-image{display:flex;width:700px;aspect-ratio:7/4;object-fit:contain}.project-details{display:flex;flex-direction:column;gap:10px}.project-details h3{text-transform:uppercase}.project-links{display:flex;gap:20px}.project-links a{display:flex}.project-icon{width:24px!important;height:24px;cursor:pointer}@media (max-width: 1160px){.project{height:350px}.project-image{width:400px}}@media (max-width: 768px){.projects-container{gap:12px}}@media (max-width: 627px){.projects{margin:0}}@media (max-width: 480px){.projects-container{gap:8px}}.contacts{display:flex;flex-direction:column;align-items:start;justify-content:center;padding:20px;margin:0 10%;gap:10px}.contacts h1{color:#ededed;align-items:flex-start;font-family:Anton;font-size:50px;margin-top:64px}.contactContents{display:flex;width:calc(100% - 40px)}.svg{padding:0;border-top:2px solid #444444;border-bottom:2px solid #444444}.contactsDetails{height:100%;width:100%}.contact{display:flex;width:100%;justify-content:space-between;padding:20px;height:60px;border:2px solid #444444;border-right:none;align-items:center}.contact a{display:flex;gap:10px;text-decoration:none;padding:0}.contact h3{text-transform:uppercase;cursor:pointer;color:#ededed}.middle{border-top:none;border-bottom:none}.contact img{width:24px;height:24px;cursor:pointer}.contactMessage{display:flex;justify-content:space-between;margin-top:20px;width:100%;gap:20px}.text{display:flex;width:60%}.text h2{color:#ededed;font-size:40px;text-transform:uppercase}.form{display:flex;flex-direction:column;width:40%;gap:20px}.form input,.form textarea{padding:20px;width:100%;background:#ededed;color:#171717;box-sizing:border-box;border:none;outline:none;font-size:16px}.form textarea{max-width:100%;min-width:100%;min-height:100px;resize:vertical}.form input::placeholder,.form textarea::placeholder{color:#be3144}.form button{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;width:100%;color:#ededed;background:#be3144;box-sizing:border-box;border:none;outline:none;text-transform:uppercase;font-size:16px}.form img{width:16px;height:16px}@media (max-width: 1160px){.contacts{margin-bottom:20px}.contactContents{flex-direction:column;padding:0;width:100%}.svg{padding:0;border-bottom:none}.contactsDetails{width:calc(100% - 40px)}.contact{border-left:none}.text,.form{width:50%}}@media (max-width: 627px){.contacts{margin:0 0 20px}.contactMessage{flex-direction:column}.text,.form{width:100%}.form{margin-top:10px;padding:0}}.mask{width:100%;height:100%;cursor:default;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:40px;mask-size:40px;background:#ededed;position:fixed;color:#171717;z-index:1001;mix-blend-mode:difference;pointer-events:none;transition:background .3s ease,transform .3s ease}*{padding:0;margin:0;scrollbar-width:none}body{height:100%;font-family:Roboto}html{scroll-behavior:smooth}