@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Lexend:wght@100..900&family=UoqMunThenKhung&display=swap");@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,1,0&display=block");body{background:var(--background-color);color:var(--text-color);font-family:DM Sans,UoqMunThenKhung,sans-serif;margin:0;overflow-x:hidden;padding:0}main{backface-visibility:hidden;position:relative;top:70px;transition:top .2s ease,filter .3s ease;will-change:transform;& a{color:var(--text-color);display:inline-block;position:relative;text-decoration:underline;transform:translateZ(0);transition:color .3s ease,transform .3s cubic-bezier(.4,0,.2,1);&:after{background-color:var(--theme-color);bottom:0;content:"";height:2px;left:50%;position:absolute;transform:translate3d(-50%,0,0) scaleX(1);transition:transform .3s cubic-bezier(.4,0,.2,1);width:100%;will-change:transform;z-index:-1}&:hover{transform:translateY(-1.5px);&:after{transform:translate3d(-50%,1.5px,0) scaleX(.4)}}}}.title,h1,h2{font-family:Lexend,UoqMunThenKhung,sans-serif;font-weight:800}@supports (text-decoration:none){main a{text-decoration:none}}h1,p{margin:0}:root{--theme-color:#f05454;--profile-color:#212121;--background-color:#121212;--text-color:#f9fafb;--dimmed-color:#a5a5a5}nav{align-items:center;backdrop-filter:blur(6px);box-sizing:border-box;display:flex;height:70px;padding:12.5px 40px;position:fixed;top:0;transition:height .3s ease,backdrop-filter .28s ease;width:100%;z-index:100;& a{align-items:center;color:var(--text-color);display:flex;text-decoration:none}& ul{display:flex;gap:20px;list-style:none;margin:0 0 0 auto;padding:0;position:relative;transition:opacity .3s ease;will-change:opacity;z-index:2;& li a{font-family:Lexend,sans-serif;letter-spacing:.005rem;padding:5px 10px;text-transform:uppercase;will-change:transform;z-index:3}& div{background:var(--theme-color);border-radius:8px;height:25px;left:0;opacity:0;pointer-events:none;position:fixed;top:0;width:10px;will-change:transform,opacity,width,height}}& ul#small{display:none;gap:10px}& li a,div#indicator{will-change:transform,opacity}}#logo{aspect-ratio:1;fill:var(--text-color);& .st0,& .st1,& .st2,& .st3{fill:none}& .st0,& .st2,& .st3{stroke:#fff;stroke-miterlimit:10}& .st0{stroke-width:70px}& .st2{stroke-width:55px}& .st3{stroke-width:67px}& .st4{clip-path:url(#clippath-1)}& .st5{clip-path:url(#clippath-3)}& .st6{clip-path:url(#clippath-2)}& .st7{clip-path:url(#clippath)}}a #logo{transition:opacity .12s ease,width .3s ease;width:45px;& .st0,& .st2,& .st3{opacity:0;stroke-dasharray:650;stroke-dashoffset:650}&.animate{& .st0,& .st2,& .st3{animation:logo-animation .8s cubic-bezier(.66,0,.34,1) forwards;opacity:1}& .st6 .st2{animation-delay:0s}& .st4 .st3{animation-delay:.1s}& .st7 .st2{animation-delay:.2s}& .st5 .st0{animation-delay:.3s}}}@keyframes logo-animation{0%{opacity:0;stroke-dashoffset:650}to{opacity:1;stroke-dashoffset:0}}#menu-button{aspect-ratio:1;background-color:transparent;border:none;color:var(--text-color);display:none;margin-left:auto;transition:opacity .15s ease,width .3s ease;width:45px;z-index:10}#mobile-menu{align-items:center;background-color:#2121216e;display:flex;gap:10px;height:100vh;justify-content:center;left:0;opacity:0;overflow:hidden;position:fixed;top:0;transition:visibility .3s ease,opacity .3s ease;visibility:hidden;width:100vw;z-index:-1}@media screen and (width <= 480px){nav{padding:15px;& ul:not(#mobile){display:none}}#menu-button{display:block}ul#mobile{align-items:center;flex-direction:column;height:100vh;justify-content:center;margin:0;& li a{opacity:0;padding:0;transform:translateY(10px) rotateX(-45deg);transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);z-index:10;&:after{background-color:var(--theme-color);bottom:0;content:"";height:2px;left:0;opacity:0;position:absolute;transform:translateY(3px);transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1);width:100%;will-change:transform;z-index:1}&:active:after,&:focus:after{opacity:1;transform:translateY(0)}}}}