@import "https://fonts.googleapis.com/css2?family=Sofia+Sans+Condensed:wght@600;700&family=Spline+Sans+Mono:wght@300;400&display=swap";

:root{--bg-color:#f7f7f7;--text-color:#101010;--text-gray-color:#908c8c;--text-gray-second-color:#aaa;--white:#fff;--border-color:#dedede;--designer-bg:#f1f1f1;--transition-main:cubic-bezier(.11, .82, .39, .92)}::selection{background:var(--text-color);color:var(--bg-color)}html,body{scroll-behavior:auto}body{background-color:var(--bg-color);color:var(--text-color);font-family:Sofia Sans Condensed;overflow-x:hidden}.container{max-width:1800rem;margin:0 auto;padding:0 15rem}.title{font-family:Sofia Sans Condensed;font-weight:700;font-style:Bold;letter-spacing:-8%;text-transform:uppercase;font-size:146rem;line-height:99%}.link-line{align-items:center;padding-bottom:5rem;display:flex;position:relative}.link-line svg{width:18rem;height:18rem;transition:transform .5s var(--transition-main);margin-left:20rem}.link-line:before{content:"";transform-origin:0;height:2rem;transition:transform .8s var(--transition-main);background-color:#efefef;transition-delay:0s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(1)}.link-line:after{content:"";transform-origin:100%;height:2rem;transition:transform .8s var(--transition-main);background-color:#efefef;transition-delay:0s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.link-line:hover:before{transform-origin:100%;transition:transform .3s var(--transition-main);transition-delay:0s;transform:scaleX(0)}.link-line:hover:after{transform-origin:0;transition:transform .8s var(--transition-main);transition-delay:0s;transform:scaleX(1)}.link-line:hover svg{transform:rotate(45deg)}.reveal-title{font-size:48px;font-weight:700}.reveal-line span{display:inline-block}.canvas-text{width:100%!important;height:100dvh!important}.animation-title{padding:0 10rem 0 0;overflow:hidden}.aniamtion-title span{margin:0 20rem;display:inline-block}.animation-title span:not(.letter){margin:0 20rem}.animation-title span .letter{text-transform:uppercase;margin:0;font-family:Sofia Sans Condensed;font-weight:700;line-height:99%;display:inline-block}section:not(.hero){opacity:0;pointer-events:none}main,.hero-title .hero-word:last-child:after{opacity:0}a{pointer-events:none}body.loaded section,body.loaded a,body.loaded .header,body.loaded main{opacity:1;pointer-events:auto}body.loaded .hero-title .hero-word:last-child:after{opacity:1}.page{animation:.3s cubic-bezier(.25,.1,.35,1) .8s backwards page-fade-in}.slide-page-transition{z-index:100000000;background-color:#101010;width:100%;height:100vh;animation:1.3s cubic-bezier(.79,.08,.35,.96) backwards page-slide;position:fixed;top:0;left:0;transform:translateY(100%)}@keyframes page-fade-in{0%{opacity:0}}@keyframes page-slide{0%{transform:translateY(-100%)}}@media (max-width:1100px){.animation-title span:not(.letter){margin:0 10px 0 0}.container{max-width:100%;padding:0 15px}.link-line svg{width:12px;height:12px;margin-left:10px}.link-line{padding-bottom:3px}.link-line:after,.link-line:before{height:2px}.link{padding:0 10px}.link:after{font-size:16px;right:-5px}.link:before{font-size:16px;left:-5px}}img{filter:grayscale();transition:filter .5s var(--transition-main)}img:hover{filter:grayscale(0%)}.profile-photo{display:contents}
.link{letter-spacing:1rem;text-transform:uppercase;white-space:nowrap;transition:.5s var(--transition-main);align-items:center;padding:0 35rem;font-family:Spline Sans Mono;font-size:24rem;font-weight:300;line-height:99%;display:flex;position:relative;overflow:hidden}@media (max-width:1100px){.link{align-items:center;height:20px;padding:0 25px;display:flex}}@media (max-width:430px){.link{padding:0 20px}}.link span{font-size:24rem;display:inline-block}@media (max-width:1100px){.link span{font-size:20px}}.link:after{content:"]";transition:.5s var(--transition-main);font-size:20rem;position:absolute;top:50%;right:12rem;transform:translateY(-50%)}@media (max-width:1100px){.link:after{font-size:20px}}.link:before{content:"[";transition:.5s var(--transition-main);font-size:20rem;position:absolute;top:50%;left:12rem;transform:translateY(-50%)}@media (max-width:1100px){.link:before{font-size:20px}}.link:hover:after{right:0}.link:hover:before{left:0}.link .clone{display:flex;position:absolute;top:0;left:50%;translate:-50% 100%}@media (max-width:1100px){.link .clone{display:none}}
