@import "https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap";*{font-optical-sizing:auto;box-sizing:border-box;margin:0;padding:0;font-family:Quicksand,sans-serif;font-style:normal;list-style:none}html{scroll-behavior:smooth}.container{width:100%}.container-header{z-index:10;background:linear-gradient(135deg,#35b9fc 0%,#7704bf 25%,#35b9fc 50%,#7704bf 75%,#35b9fc 100%) 0 0/200% 100%;padding-bottom:2px;animation:6s linear infinite anim;position:sticky;top:0}.ct-header-background{background-color:#222;justify-content:center;align-items:center;display:flex}.ct-header-background nav{box-sizing:border-box;width:calc(100% - 40px);max-width:900px;margin:0 20px}@keyframes anim{to{background-position-x:-200%}}.container-body{background-color:#161513;flex-direction:column;justify-content:center;align-items:center;height:100%;display:flex}.container-body>div:first-child{padding-top:80px;padding-bottom:100px}.container-body>div{box-sizing:border-box;width:calc(100% - 80px);max-width:900px;margin:0 40px;padding-bottom:100px}@media screen and (width>=768px){.ct-header-background nav{width:calc(100% - 80px);margin:0 40px}.container-body>div{margin:0 40px}.container-body>div:first-child{padding-top:120px;padding-bottom:200px}.container-body>div{padding-bottom:160px}}@media screen and (width>=1024px){.container-body>div{width:calc(100% - 100px);margin:0 50px;padding-bottom:200px}.ct-header-background nav{width:calc(100% - 100px);margin:0 50px}.container-body>div:first-child{padding-top:150px;padding-bottom:300px}.container-body>div{padding-bottom:200px}}.navbar{flex-direction:column;align-items:center;width:100%;padding:12px 0;display:flex}.logo{margin-bottom:10px}.logo>a{color:#fff;font-size:18px;font-weight:700;text-decoration:none}.navbar-content{color:#fff;width:100%;font-weight:500}.nav-content-item{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.nav-link{margin-bottom:8px}.nav-link>li{margin:0 8px;font-size:13px}.nav-link>li:hover{cursor:pointer}.nav-connect>a{color:#fff;margin:0 10px}@media screen and (width>=1024px){.navbar{flex-direction:row;justify-content:space-between}.logo{flex-shrink:0;margin:0}.logo a{margin:0}.navbar-content{flex:1;justify-content:space-between;align-items:center;width:auto;margin-left:12px;display:flex}.nav-link{margin:0}.nav-link>li{margin:0 12px;font-size:14px}.nav-connect{margin-left:24px}.nav-connect>a{margin:0 0 0 12px}}.home-image{justify-content:center;align-items:center;padding:40px 0;display:flex}.home-image-frame{width:50%;max-width:180px;overflow:hidden}.home-image-frame img{border-radius:99rem;width:100%;display:block}.home-content{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.hm-content-title{margin-bottom:24px}.hm-content-title h1{color:#fff;white-space:nowrap;letter-spacing:.08em;text-align:center;border-right:.15em solid #7704bf;max-width:100%;margin:0 auto;font-size:28px;font-weight:bolder;animation:2.5s steps(40,end) typing,1s ease-out infinite blink-caret;overflow:hidden}.hm-content-title span{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:#0000}50%{border-color:#7704bf}}.hm-content-text{width:100%;margin-bottom:32px}.hm-content-text p{color:#c5c5c5;text-align:center;width:100%;max-width:520px;margin:0 auto;font-size:16px;line-height:1.5}.hm-content-text p:first-child{padding-bottom:10px}.hm-content-button a{box-sizing:border-box;cursor:pointer;background-color:#222;border-radius:1rem;justify-content:center;align-items:center;min-height:2.3rem;padding:.25rem 1.5rem;text-decoration:none;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 1em 1em #00000080}.hm-content-button a:before{content:"";background:linear-gradient(135deg,#35b9fc 0%,#7704bf 25%,#35b9fc 50%,#7704bf 75%,#35b9fc 100%);width:100%;height:350%;position:absolute}.hm-content-button a:after{content:"";background-color:#222;border-radius:.9rem;position:absolute;inset:1.5%}.hm-content-button a:hover:before{animation:2s linear infinite run-btn}@keyframes run-btn{to{transform:rotate(360deg)}}.hm-content-button a>span{z-index:1;color:#ffffffc5;white-space:nowrap;font-size:12px;font-weight:500;transition:all .5s;position:relative}.hm-content-button a>span:after{content:"»";opacity:0;transition:all .5s;position:absolute;top:0;right:-1.25em}.hm-content-button a:hover span{padding-right:1.25em}.hm-content-button a:hover span:after{opacity:1;right:0}@media screen and (width<=480px){.hm-content-title h1{white-space:normal;letter-spacing:normal;border-right:none;animation:none}}@media screen and (width>=768px){.home-image{padding:70px 0 50px}.home-image-frame{max-width:220px}.hm-content-title h1{letter-spacing:.12em;font-size:32px}.hm-content-text p{font-size:17px}}@media screen and (width>=1024px){.home-image{padding:90px 0 60px}.home-image-frame{max-width:250px}.hm-content-title h1{letter-spacing:.15em;font-size:35px}.hm-content-text p{font-size:18px}}.about-auto-show{animation:both about-apppear;animation-timeline:view();animation-range:entry 55% cover 100vh}@keyframes about-apppear{0%{opacity:0;transform:translateY(200px)}to{opacity:1;transform:translateY(0)}}.about-title{margin-bottom:20px}.about-title h1{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text;width:260px;max-width:100%}.about-content{flex-direction:column;align-items:center;gap:28px;display:flex}.about-content-text{width:100%}.about-content-text div{margin-bottom:20px}.about-content-text p{color:#fff;letter-spacing:.5px;font-size:15px}.content-text-intro a{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.content-text-skill p{margin-bottom:10px}.content-text-skill li{color:#ffffffc5;margin-bottom:10px;font-size:14px}.content-text-skill li:before{content:"👉🏻";margin-right:5px;display:inline-block}.ct-text-skill-list{flex-wrap:wrap;gap:16px 32px;display:flex}.ct-text-skill-list ul:first-child{margin-right:0}.about-content-image{justify-content:center;width:100%;display:flex}.content-image-pfp{border-radius:30px;max-width:220px;height:100%;margin:0 auto;overflow:hidden;box-shadow:10px 5px 5px #ffffff1f}.content-image-pfp img{width:100%}@media screen and (width>=768px){.about-content{flex-direction:row;justify-content:space-between;align-items:flex-start}.about-content-text{width:58%}.about-content-image{justify-content:flex-end;width:38%}.content-image-pfp{max-width:250px;max-height:300px;margin-left:auto;margin-right:0}}.experience-auto-show{animation:both about-apppear;animation-timeline:view();animation-range:entry 55% cover 100vh}.experience-title{margin-bottom:20px}.experience-title h1{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text;width:260px;max-width:100%}.experience-content{flex-direction:column;align-items:stretch;gap:20px;padding-top:16px;display:flex}.ex-content-company{width:100%;overflow-x:auto}.ex-content-company ul{gap:8px;min-width:max-content;padding-bottom:8px;display:flex}.company{color:#ffffffc5;cursor:pointer;white-space:nowrap;border-bottom:1px solid #0000;padding:12px 14px;font-size:14px;position:relative;overflow:hidden}.company.active-company{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text}.company.active-company:after{content:"";background:linear-gradient(135deg,#35b9fc,#7704bf);border-radius:300px;width:100%;height:2px;animation:2s forwards runMobile;display:block;position:absolute;bottom:0;left:0}@keyframes runMobile{0%{transform:translate(-50px)}to{transform:translate(0)}}.ex-content-desc{width:100%;padding-left:0}.job{color:#ffffffc5;animation:2s forwards slideUp;display:none}@keyframes slideUp{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}.job>h2{margin-bottom:10px;font-size:18px;line-height:1.3}.job h2 span{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.job p:nth-child(2){margin-bottom:20px;font-size:15px}.job p:not(:nth-child(2)){margin-bottom:10px;font-size:12.5px;line-height:1.5}.job p span{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-right:5px;font-size:12px}.job.active-job{display:block}@media screen and (width>=768px){.experience-content{flex-direction:row;justify-content:space-evenly;align-items:flex-start;padding-top:30px}.ex-content-company{width:28%;overflow-x:visible}.ex-content-company ul{min-width:0;padding-bottom:0;display:block}.company{white-space:normal;border-bottom:none;padding:15px 0 15px 10px}.company.active-company:after{content:"";background:linear-gradient(135deg,#35b9fc,#7704bf);border-radius:300px;width:2px;height:90%;animation:2s forwards run;display:block;position:absolute;top:10%;left:auto;right:0}.ex-content-desc{width:72%;padding-left:32px}.job>h2{font-size:20px}}@keyframes run{0%{transform:translateY(50px)}to{transform:translateY(0)}}.projects-auto-show{animation:both about-apppear;animation-timeline:view();animation-range:entry 55% cover 100vh}.projects-title{margin-bottom:20px}.projects-title h1{background:linear-gradient(135deg,#35b9fc,#7704bf);-webkit-text-fill-color:transparent;-webkit-background-clip:text;width:260px;max-width:100%}.projects-main{flex-direction:column-reverse;justify-content:center;align-items:center;gap:24px;margin-bottom:30px;padding-top:20px;display:flex}.p-main-text{flex-direction:column;align-items:flex-start;width:100%;display:flex}.p-main-text h2{color:#fff;margin-bottom:16px;font-size:28px;font-weight:100;line-height:1.15}.p-main-text p{color:#ffffffc5;margin-bottom:20px;font-size:14px;line-height:1.5}.p-main-text a{cursor:pointer;background-color:#222;border-radius:1rem;justify-content:center;align-items:center;width:6rem;height:2.3rem;font-size:12px;display:flex;position:relative;overflow:hidden;box-shadow:0 1em 1em #00000080}.p-main-text a:before{content:"";background:linear-gradient(135deg,#35b9fc 0%,#7704bf 25%,#35b9fc 50%,#7704bf 75%,#35b9fc 100%);width:100%;height:300%;position:absolute}.p-main-text a:after{content:"See Now";color:#fff;background-color:#222;border-radius:24px;justify-content:center;align-items:center;width:97%;height:97%;font-size:12px;font-weight:500;display:flex;position:absolute}.p-main-text a:hover:before{animation:2s linear infinite run-btn}.p-main-img{width:100%}.p-m-img-frame{border-radius:16px;max-width:100%;overflow:hidden}.p-m-img-frame img{width:100%;display:block}.projects-sub{grid-template-columns:1fr;gap:16px;width:100%;display:grid}.p-sub-item{background:linear-gradient(135deg,#35b9fc 0%,#7704bf 25%,#35b9fc 50%,#7704bf 75%,#35b9fc 100%) 0 0/200% 100%;border-radius:12px;width:100%;max-width:100%;height:100%;padding-bottom:2px;animation:6s linear infinite anim;overflow:hidden}.p-s-item-content{background-color:#222;flex-direction:column;justify-content:flex-start;height:100%;display:flex}.p-s-c-image{border-top-left-radius:10px;border-top-right-radius:10px;flex-shrink:0;width:100%;height:150px;position:relative;overflow:hidden}.p-s-c-image>img{object-fit:cover;opacity:.35;width:100%;height:100%;display:block}.p-s-c-image>a{color:#fff;z-index:1;justify-content:center;align-items:center;width:30px;height:30px;line-height:0;display:flex;position:absolute;top:10px;right:10px}.p-s-c-text{flex-direction:column;flex:1;justify-content:flex-start;align-items:flex-start;padding:10px;display:flex}.p-s-c-text>h3{color:#fff;margin-bottom:10px;font-size:16px;line-height:1.3}.p-s-c-text>p{-webkit-line-clamp:3;color:#ffffffc5;-webkit-box-orient:vertical;font-size:12px;line-height:1.5;display:-webkit-box;overflow:hidden}@media screen and (width>=768px){.projects-main{flex-direction:row;justify-content:space-between;align-items:center;padding-top:30px}.p-main-text{width:40%}.p-main-img{width:55%}.p-main-text h2{font-size:36px}.p-main-text p{font-size:15px}.p-m-img-frame{border-radius:24px;max-width:500px}.projects-sub{grid-template-columns:repeat(2,1fr);gap:20px}.p-s-c-image{height:160px}.p-s-c-text>h3{font-size:18px}.p-s-c-text>p{font-size:13px}}@media screen and (width>=1024px){.p-main-text h2{font-size:45.5px}.projects-sub{grid-template-columns:repeat(3,1fr);gap:24px}.p-s-c-image{height:170px}}