#root,body,html{height:100%;margin:0;overflow:hidden;width:100%}body{font-family:Arial,Helvetica,sans-serif}h1{font-size:32px}h2{font-size:28px}p{font-size:18px}button{font-size:20px}.viewport{background:#f4f4f4;inset:0;overflow:hidden;overscroll-behavior:none;position:fixed}.camera{left:0;position:absolute;top:0}.camera,.canvas{will-change:transform}.canvas{height:2844px;position:relative;width:5184px}.canvas-background{background-image:url(/static/media/canvas-background.bd209b6d7079eae257e2.png);background-repeat:no-repeat;background-size:100% 100%;inset:0;position:absolute;transition:opacity .8s cubic-bezier(.65,0,.35,1);will-change:opacity;z-index:0}.canvas-background.home{opacity:1}.canvas-background.projects{opacity:0}.canvas-background.about{opacity:.4}.canvas-world{height:100%;position:relative;width:100%;z-index:1}.navbar{border-bottom:2px solid #fff;box-shadow:0 2px 4px #00000026;height:7.5vh;left:0;position:fixed;top:0;width:100vw;z-index:1000}.navbar-bg{display:flex;inset:0;position:absolute}.navbar-red{background:#fbb;width:clamp(0px,50vw - 433px,100vw)}.navbar-blue{background:#c4d5ff;width:calc(50vw + 433px)}.navbar-blue,.navbar-red{transition:width .45s ease,opacity .45s ease}.navbar-red-mode .navbar-red{width:100%}.navbar-blue-mode .navbar-red,.navbar-red-mode .navbar-blue{opacity:0;width:0}.navbar-blue-mode .navbar-blue{width:100%}.navbar-logo{height:126px;left:clamp(0px,50vw - 433px,100vw);object-fit:contain;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-52%);width:120px;z-index:3}.navbar-content{align-items:stretch;display:flex;height:100%;position:absolute;right:0;top:0;z-index:4}.nav-button{background:#0000;border:0;border-left:2px solid #fff;box-sizing:border-box;color:#322c58;cursor:pointer;font-weight:600;height:100%;margin:0;padding:0 36px}.nav-button:last-child{border-right:2px solid #fff}.nav-button:not(.active):hover{background:#0003;box-shadow:inset 0 4px 12px #0000000d;color:#fff}.nav-button.active{background:#0000001a;box-shadow:inset 0 4px 12px #0000000d;color:#fff;font-weight:700;transform:translateY(1px)}.nav-button:disabled{cursor:default;pointer-events:none}.profile-content{height:557px;left:2300px;position:absolute;top:225px;width:1054px}.profile-sean{height:71px;left:2392px;top:237px;width:243px}.profile-uiux{height:76px;left:2370px;top:348px;width:261px}.profile-frontend{height:78px;left:2710px;top:346px;width:575px}.profile-frontend,.profile-sean,.profile-uiux{position:absolute;transition:transform .25s ease}.profile-frontend:hover,.profile-sean:hover,.profile-uiux:hover{cursor:pointer;transform:translate(7px,-7px)}.profile-mask{background-color:#fff;border-radius:10px;height:500px;overflow:hidden;position:absolute;transform:translate(1910px,-20px);width:300px;z-index:10}.profile-mask.home{animation:profile-about-to-home .9s cubic-bezier(.65,0,.35,1) forwards}.profile-shadow1{background-color:#ff9aa4;border-bottom-left-radius:10px;height:500px;transform:translate(1859px,51px);width:300px}.profile-shadow1,.profile-shadow2{display:block;position:absolute;z-index:9}.profile-shadow2{background:#81a8ff;-webkit-clip-path:polygon(100% 0,0 100%,100% 100%);clip-path:polygon(100% 0,0 100%,100% 100%);height:62px;transform:translate(1859px,-13px);width:51px}.profile-shadow3{background:#df9aff;-webkit-clip-path:polygon(0 0,100% 0,0 100%);clip-path:polygon(0 0,100% 0,0 100%);display:block;height:72px;position:absolute;transform:translate(2161px,480px);width:42px;z-index:9}.profile-mask,.profile-shadow1,.profile-shadow2,.profile-shadow3{transition:transform .9s cubic-bezier(.65,0,.35,1),width .9s cubic-bezier(.65,0,.35,1),height .9s cubic-bezier(.65,0,.35,1),border-radius .9s cubic-bezier(.65,0,.35,1)}.profile-mask.home .profile-image{cursor:pointer}.about-profile-stage{inset:0;pointer-events:none;position:absolute;z-index:20}.about-profile-stage .profile-mask,.about-profile-stage .profile-shadow1,.about-profile-stage .profile-shadow2,.about-profile-stage .profile-shadow3,.about-profile-stage .social-links{pointer-events:auto}.profile-mask.about{animation:profile-home-to-about .9s cubic-bezier(.65,0,.35,1) forwards;border:2px solid #000;border-radius:50%;height:228px;perspective:1200px;width:228px}@keyframes profile-home-to-about{0%{transform:translate(1910px,-20px)}to{transform:translate(530px,240px)}}@keyframes profile-about-to-home{0%{transform:translate(530px,240px)}to{transform:translate(1910px,-20px)}}.profile-shadow1.about{border-radius:50%;height:228px;transform:translate(500px,260px);width:228px}.profile-shadow2.about,.profile-shadow3.about{height:0;transform:translate(510px,350px);width:0}.profile-flip{height:100%;position:relative;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.65,0,.35,1);width:100%}.profile-face{backface-visibility:hidden;-webkit-backface-visibility:hidden;inset:0;position:absolute}.profile-face-photo{background:#fff;border-radius:inherit;opacity:1;overflow:hidden;transition:opacity .35s ease}.profile-face-anon{opacity:0;transform:rotateY(180deg);transition:opacity .35s ease}.profile-image{display:block;height:100%;object-fit:cover;object-position:center top;transition:transform .9s cubic-bezier(.65,0,.35,1),object-position .9s cubic-bezier(.65,0,.35,1);width:100%}.profile-mask.about .profile-image{object-position:center 15%}.anon-circle{background:#fff;border:2px solid #000;border-radius:50%;box-sizing:border-box;left:50%;position:absolute;transform:translateX(-50%)}.anon-head{height:76px;top:50px;width:76px}.anon-body{height:152px;top:125px;width:152px}.profile-mask.about.phase-anon .profile-face-photo{opacity:0}.profile-mask.about.phase-anon .profile-face-anon{opacity:1}.profile-mask.about.phase-anon .profile-flip{transform:rotateY(180deg)}.profile-mask.about.phase-stack{animation:mask-anon-to-stack .8s cubic-bezier(.65,0,.35,1) forwards}.profile-mask.about.phase-stack .profile-face-photo{opacity:0}.profile-mask.about.phase-stack .profile-face-anon{opacity:1}.profile-mask.about.phase-stack .profile-flip{transform:rotateY(180deg)}.profile-mask.about.phase-stack .anon-body,.profile-mask.about.phase-stack .anon-head{animation:circle-anon-to-stack .8s cubic-bezier(.65,0,.35,1) forwards}@keyframes circle-anon-to-stack{0%{transform:translate(-50%)}to{transform:translate(-50%,-277px)}}@keyframes mask-anon-to-stack{0%{overflow:hidden;transform:translate(586px,240px)}70%{overflow:visible}to{overflow:visible;transform:translate(586px,408px)}}.profile-mask.about.phase-drop{animation:mask-stack-to-drop 1.2s cubic-bezier(.65,0,.35,1) forwards;overflow:visible}.profile-mask.about.phase-drop .profile-face-photo{animation:photo-stack-to-drop .2s cubic-bezier(.65,0,.35,1) 1s forwards;opacity:0}.profile-mask.about.phase-drop .profile-face-anon{animation:anon-stack-to-drop .2s cubic-bezier(.65,0,.35,1) 1s forwards;opacity:1}.profile-mask.about.phase-drop .profile-flip{animation:flip-stack-to-drop .4s cubic-bezier(.65,0,.35,1) .9s forwards;transform:rotateY(180deg)}.profile-mask.about.phase-drop .anon-body,.profile-mask.about.phase-drop .anon-head{animation:circle-stack-to-drop .8s cubic-bezier(.65,0,.35,1) forwards}@keyframes flip-stack-to-drop{0%{transform:rotateY(180deg)}to{transform:rotateY(0deg)}}@keyframes photo-stack-to-drop{0%{opacity:0}to{opacity:1}}@keyframes anon-stack-to-drop{0%{opacity:1}to{opacity:0}}@keyframes circle-stack-to-drop{0%{transform:translate(-50%,-277px)}to{transform:translate(-50%)}}@keyframes mask-stack-to-drop{0%{overflow:visible;transform:translate(586px,408px)}50%{transform:translate(586px,408px)}90%{overflow:hidden}to{overflow:hidden;transform:translate(586px,240px)}}.profile-mask.about.phase-stack.reverse .profile-face-photo{animation:anon-stack-to-drop .25s cubic-bezier(.65,0,.35,1) forwards;opacity:1}.profile-mask.about.phase-stack.reverse .profile-face-anon{animation:photo-stack-to-drop .25s cubic-bezier(.65,0,.35,1) forwards;opacity:0}.profile-mask.about.phase-stack.reverse .profile-flip{animation:flip-drop-to-stack .5s cubic-bezier(.65,0,.35,1) forwards}.profile-mask.about.phase-stack.reverse .anon-body,.profile-mask.about.phase-stack.reverse .anon-head{animation:circle-anon-to-stack .8s cubic-bezier(.65,0,.35,1) forwards}@keyframes flip-drop-to-stack{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.profile-mask.about.phase-anon.reverse{animation:mask-stack-to-anon .8s cubic-bezier(.65,0,.35,1) forwards}.profile-mask.about.phase-anon.reverse .profile-face-photo{opacity:0}.profile-mask.about.phase-anon.reverse .profile-face-anon{opacity:1}.profile-mask.about.phase-anon.reverse .anon-body,.profile-mask.about.phase-anon.reverse .anon-head{animation:circle-stack-to-anon .8s cubic-bezier(.65,0,.35,1) forwards}@keyframes circle-stack-to-anon{0%{transform:translate(-50%,-277px)}33%{transform:translate(-50%,-277px)}to{transform:translate(-50%)}}@keyframes mask-stack-to-anon{0%{overflow:visible;transform:translate(586px,408px)}33%{overflow:visible;transform:translate(586px,408px)}58%{overflow:visible}to{overflow:hidden;transform:translate(586px,240px)}}.about-copy-stage{height:400px;left:0;position:absolute;top:0;width:700px;z-index:10}.about-copy-panel{left:0;position:absolute;top:0;width:100%}.about-copy-body{max-width:640px}.about-copy-body p{line-height:1.75;margin:0 0 18px;overflow-wrap:break-word}.animated-underline{display:inline-block;position:relative}.animated-underline:after{background:#ff9aa4;border-radius:10px;bottom:3px;content:"";height:.25rem;left:-2px;position:absolute;transform:scaleX(0);transform-origin:left center;transition:transform .7s cubic-bezier(.22,1,.36,1);width:calc(100% + 4px);z-index:-1}.animated-underline.active:after{transform:scaleX(1)}.social-links{display:flex;gap:24px;opacity:0;position:absolute;transform:translate(2009px,745px);transition:opacity .9s ease .6s;z-index:20}.social-links.home{opacity:100%}.social-icons{cursor:pointer;height:40px;transition:transform .25s ease,opacity .25s ease;width:40px}.skills{align-items:center;display:flex;flex-direction:column;position:absolute;text-align:center;transform:translate(1728px,1182px);width:1728px}.skills h1{font-weight:600}.skills-category{align-items:center;display:flex;flex-direction:row;justify-content:center;margin:0 auto 28px;position:relative}.skill-tab{background:#0000;border:0;color:#767676;cursor:pointer;font-weight:600;padding-bottom:8px;width:160px}.skill-tab.active{color:#000}.skill-indicator{background:#322c58;border-radius:999px;bottom:0;height:4px;left:0;position:absolute;transition:transform .35s cubic-bezier(.65,0,.35,1);width:32px}.skills-uiux .skill-indicator{transform:translateX(65px)}.skills-frontend .skill-indicator{transform:translateX(223px)}.skills-3D .skill-indicator{transform:translateX(384px)}.skills-content{width:50%}.skills-images{display:flex;gap:32px;justify-content:center;padding-bottom:24px;padding-top:50px}.skills-img{cursor:pointer;height:85px;transition:transform .25s ease;width:85px}.skills-img:not(.active):hover{transform:translate(2px,-4px)}.skills-img.active{cursor:default}.project{align-items:center;display:flex;flex-direction:column;height:1000px;position:absolute;transform:translate(1728px,2098px);width:1728px}.project h1{font-weight:600}.project-images{align-items:center;display:flex;flex-shrink:0;gap:32px;justify-content:center;width:85px}.project-img{cursor:pointer;height:85px;transition:transform .25s ease;width:85px}.project-img:not(.active):hover{transform:scale(1.1)}.project-img.active{cursor:default;transform:scale(1.2)}.project-preview-layout{display:flex;flex-direction:row;justify-content:center;width:100%}.project-header{align-items:center;display:flex;flex-direction:row;gap:10px}.project-header h2{font-weight:600}.project-header p{color:#676767;padding-top:4px}.project-detail{margin-top:-35px;width:650px}.project-insights{display:flex;flex-direction:row;margin-top:-10px}.project-tasks,.project-values{display:flex;flex-direction:column;width:250px}.project-tasks p:first-child,.project-values p:first-child{font-weight:600}.insight-item-holder{display:flex;flex-direction:row;flex-wrap:wrap}.insight-item-holder.value{width:300px}.insight-item-holder.task{width:400px}.insight-item{background-color:#fff;border-radius:15px;flex-shrink:0;margin-bottom:10px;margin-right:10px;padding:8px 16px}.project-to-detail{align-items:center;background-color:#81a8ff;border:0;border-radius:999px;color:#fff;cursor:pointer;display:flex;font-weight:600;height:50px;justify-self:center;margin-top:10px;padding:8px 16px;transition:background-color .25s ease,transform .25s ease;width:220px}.project-to-detail:hover{background-color:#1f5fc1;transform:translateY(-2px)}.about-content{animation-delay:1s;background-color:#ff9aa4;height:0;padding:50px;position:absolute;transform:translate(466px,445px);translate:height 1s ease;width:700px;z-index:5;z-index:6}.about-content.active{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.project-background-fixed{inset:0;overflow:hidden;pointer-events:none;position:fixed;z-index:0}.project-background-fade{animation:projectBackgroundFadeIn .5s ease;inset:0;position:absolute}.project-cover-mobile{display:flex;flex-direction:row;gap:100px;justify-content:center;position:absolute;transform:rotate(30deg) scale(1.3);width:100%}.project-cover-column{flex:1 1;height:999px;max-width:461px;position:relative}.project-cover-track{display:flex;flex-direction:column;gap:12px}.project-cover-track img{display:block;object-fit:cover;width:100%}.project-cover-column-right .project-cover-track{animation:scroll-up 35s linear infinite}.project-cover-column-left .project-cover-track{animation:scroll-down 35s linear infinite}@keyframes scroll-up{0%{transform:translateY(0)}to{transform:translateY(-35%)}}@keyframes scroll-down{0%{transform:translateY(-35%)}to{transform:translateY(0)}}.project-cover-website{display:flex;flex-direction:column;gap:100px;justify-content:center;position:absolute;transform:rotate(15deg) scale(1.3) translateY(50px);width:100%}.project-cover-web-row{position:relative;width:100%}.project-cover-web-track{display:flex;flex-direction:row;gap:24px;width:-webkit-max-content;width:max-content}.project-cover-web-track img{border-radius:16px;display:block;flex-shrink:0;height:auto;object-fit:cover;width:650px}.project-cover-web-row-right .project-cover-web-track{animation:scroll-right 35s linear infinite}.project-cover-web-row-left .project-cover-web-track{animation:scroll-left 35s linear infinite}@keyframes scroll-right{0%{transform:translateX(-50%)}to{transform:translateX(0)}}@keyframes scroll-left{0%{transform:translateX(0)}to{transform:translateX(-50%)}}.canvas-project{justify-content:center;position:absolute;transform:translate(3456px,2000px);width:1728px}.canvas-project,.project-foreground{display:flex;gap:10px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;z-index:2}.project-foreground{align-items:center;background-color:#fff;flex-direction:column;position:relative;width:1000px}.project-main-selector{align-items:center;display:flex;flex-direction:row;gap:40px;height:200px;justify-content:center;margin-top:-40px;width:100%}.project-icon{cursor:pointer;display:block;height:65px;width:65px}.project-icon.active{cursor:default;height:85px;transform:scale(1.2);transition:transform .25s ease;width:85px}.project-icon:not(.active):hover{transform:scale(1.1)}.project-channel-nav{display:flex;gap:16px;margin-top:-10px}.project-channel-button{background:#0000;border:0;color:#7a7a7a;cursor:pointer;font-weight:600;padding:8px 0;position:relative}.project-channel-button.active{color:#322c58}.project-channel-button.active:after{background:#322c58;border-radius:999px;bottom:-4px;content:"";height:3px;left:0;position:absolute;width:100%}.projects-main-content{box-sizing:border-box;padding:25px 40px 40px;width:100%}.project-demo-page,.project-detail-page{display:flex;flex-direction:column;gap:56px}.project-detail-section{display:flex;flex-direction:column;gap:28px}.project-step-text h2,.project-step-text p,.project-title h1,.project-title p{margin:0}.project-step-text h2{font-weight:600}.project-step-text p,.project-title p{color:#444;line-height:1.7}.project-title p{margin-top:8px}.project-step-image-frame{align-items:center;display:flex;justify-content:center;min-height:650px;width:100%}.project-step-image{display:block;height:auto;max-height:900px;object-fit:contain;width:100%}.project-back-to-top{background-color:#c4d5ff;border:none;border-radius:10px;cursor:pointer;margin-top:50px;padding:12px 20px;transition:background-color .25s ease,box-shadow .2s ease}.project-back-to-top:hover{background-color:#81a8ff;box-shadow:0 6px 14px #0000001f;color:#fff}.project-back-to-top:active{box-shadow:0 2px 6px #00000026}.project-back-to-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.project-demo-page iframe{border:1px solid #0000001a;height:100vh;width:100%}.detail-links{display:flex;gap:24px;justify-content:center}.project-demo-page img{height:50px;width:50px}
/*# sourceMappingURL=main.eea52b83.css.map*/