*{box-sizing:border-box}@font-face{font-family:PPNeueMontreal;src:url(../../../fonts/PPNeueMontreal-Bold.otf) format("opentype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:PPNeueMontreal;src:url(../../../fonts/PPNeueMontreal-Book.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:PPNeueMontreal;src:url(../../../fonts/PPNeueMontreal-Italic.otf) format("opentype");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:PPNeueMontreal;src:url(../../../fonts/PPNeueMontreal-Medium.otf) format("opentype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:PPNeueMontreal;src:url(/fonts/PPNeueMontreal-SemiBold.otf) format("opentype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:PPNeueMontreal;src:url(../../../fonts/PPNeueMontreal-Thin.otf) format("opentype");font-weight:200;font-style:normal;font-display:swap}body{margin:0;padding:0;background:#f1f1f1;color:#171717;font-family:PPNeueMontreal,sans-serif}body p{color:#737373}body{--column-padding: 4rem;width:100vw;overflow-x:hidden}@media (max-width: 1300px){body{--column-padding: 2rem}}.global-columns{position:fixed;inset:0;z-index:5;pointer-events:none;mix-blend-mode:difference;opacity:.1}.global-columns .column{border-right:1px solid white}.global-columns .column:first-of-type{border-left:1px solid white}.global-single-column{position:fixed;inset:0;z-index:5;pointer-events:none;mix-blend-mode:difference;opacity:.1;padding:0 10vw}.global-single-column .inner-single-column{border-right:1px solid white;border-left:1px solid white;width:100%;height:100%}.columns{display:grid;grid-template-columns:repeat(3,1fr);padding:0 10vw;height:100%;width:100vw}.columns .column{width:100%;min-width:1rem;display:flex;flex-direction:column;justify-content:space-between;padding:4rem var(--column-padding)}.columns .column .text-section{display:flex;flex-direction:column;gap:1rem}.columns .column .row{display:flex;justify-content:space-between;gap:.5rem}.columns .column .row a{text-decoration:underline solid rgba(0,0,0,.1);color:#737373;display:flex;transition:.2s ease;gap:.125rem}.columns .column .row a span{opacity:.5;text-decoration:none}.columns .column .row a:hover{gap:.25rem}.columns .column .row p{margin:0;white-space:nowrap}.columns .column .row .scrolling-text{overflow:hidden;display:flex;flex-shrink:1;position:relative}.columns .column .row .scrolling-text p{transform:translate(var(--scroll));padding-right:.25rem}.columns .column .row .scrolling-text:before{content:"";position:absolute;top:0;bottom:0;left:0;width:1rem;background:linear-gradient(90deg,#f1f1f1,#f1f1f100);z-index:1}.columns .column .row .scrolling-text:after{content:"";position:absolute;top:0;bottom:0;right:0;width:1rem;background:linear-gradient(270deg,#f1f1f1,#f1f1f100);z-index:1}.hero{height:100svh}@keyframes fade{0%{opacity:0;filter:blur(8px)}to{opacity:1;filter:blur(0px)}}.hero .row-1{opacity:0;animation-name:fade;animation-duration:1s;animation-delay:.5s;animation-timing-function:ease-out;animation-fill-mode:forwards}.hero .row-2{opacity:0;animation-name:fade;animation-duration:1s;animation-delay:.75s;animation-timing-function:ease-out;animation-fill-mode:forwards}.hero .row-3{opacity:0;animation-name:fade;animation-duration:1s;animation-delay:1s;animation-timing-function:ease-out;animation-fill-mode:forwards}.hero .row-4{opacity:0;animation-name:fade;animation-duration:1s;animation-delay:1.25s;animation-timing-function:ease-out;animation-fill-mode:forwards}.hero .single-column{display:flex;flex-direction:column;justify-content:space-between;padding:4rem calc(10vw + var(--column-padding));height:100%}.hero .single-column .group{display:flex;justify-content:space-between;width:100%}.hero .single-column .group .row{display:flex;justify-content:space-between;gap:.5rem;position:relative}.hero .single-column .text-section{display:flex;flex-direction:column;gap:1rem;width:100%}@media (min-width: 700px){.hero .single-column .text-section{width:min(50% - 2rem,20rem)}}.hero .single-column p{margin:0;white-space:nowrap}.hero .single-column a{text-decoration:underline solid rgba(0,0,0,.1);color:#737373;display:flex;transition:.2s ease;gap:.125rem}.hero .single-column a span{opacity:.5;text-decoration:none}.hero .single-column a:hover{gap:.25rem}.hero .single-column .scrolling-text{overflow:hidden;display:flex;flex-shrink:1;position:relative}.hero .single-column .scrolling-text p{transform:translate(var(--scroll));padding-right:.25rem}.hero .single-column .scrolling-text:before{content:"";position:absolute;top:0;bottom:0;left:0;width:1rem;background:linear-gradient(90deg,#f1f1f1,#f1f1f100);z-index:1}.hero .single-column .scrolling-text:after{content:"";position:absolute;top:0;bottom:0;right:0;width:1rem;background:linear-gradient(270deg,#f1f1f1,#f1f1f100);z-index:1}.main-title{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;pointer-events:none}.main-title h1{font-weight:500;font-size:4rem;letter-spacing:-.02em;position:relative;pointer-events:all;opacity:0;animation-name:fade;animation-duration:1s;animation-delay:1.1s;animation-timing-function:ease-out;animation-fill-mode:forwards}@media (max-width: 1200px){.main-title h1{font-size:3rem}}.main-title h1 .typing{margin:0}.main-title h1 .typing:after{width:.1ch!important;--cursor-color: rgb(0 0 0 / .5)}.main-title h1:after{content:"Sam Cheng";font-size:1rem;font-weight:400;letter-spacing:0em;position:absolute;top:-2.125rem;right:.03em;transform:translate(50%);white-space:nowrap;background:#171717;color:#fff;padding:.2em .5em;border-radius:2rem}.main-title h1:before{content:"";position:absolute;top:-1.375rem;right:.03em;transform:translate(50%) rotate(-45deg);clip-path:polygon(0 0,0% 100%,100% 100%);width:calc(1rem - 1px);height:calc(1rem - 1px);background:#171717;border-radius:0 0 0 1px}.work{min-height:100svh;display:flex;gap:8rem;flex-direction:column;align-items:center;padding-top:20vh;padding-bottom:16rem;position:relative}@media (max-width: 850px){.work{gap:4rem}}.work h2{font-weight:500;font-size:4rem;letter-spacing:-.02em;margin:0}@media (max-width: 1200px){.work h2{font-size:3rem}}.work h2 span{opacity:.5}.work:after{content:"";position:absolute;bottom:-2px;left:-2px;right:-2px;height:var(--background-height);background-image:url(../../../images/gradient.png);background-size:100% 100%;z-index:4}@media (max-width: 800px){.work:after{left:0;right:0}}.work .experience{display:grid;grid-template-columns:repeat(3,1fr);padding:0 10vw;filter:blur(var(--blur))}@media (max-width: 999px){.work .experience{display:flex;flex-direction:column;gap:2rem}.work .experience:nth-of-type(odd){flex-direction:column-reverse}}.work .experience aside{padding:0 var(--column-padding);display:flex;flex-direction:column;justify-content:space-between;width:100%}.work .experience aside .line{display:flex;justify-content:space-between;align-items:center}.work .experience aside .line h3{font-size:1rem;font-weight:500;margin:0}.work .experience aside .line p{font-size:.75rem;padding:.125rem .5rem;border:1px solid black;color:#000;border-radius:5rem;text-transform:uppercase;margin:0}.work .experience aside .line a{color:#737373;text-decoration:none;display:flex;gap:.5em;transition:.3s ease}.work .experience aside .line a .arrow{transition:.3s ease;display:block;opacity:1}.work .experience aside .line a .text{display:flex;flex-direction:column;height:1.25em;overflow:hidden}.work .experience aside .line a .text span{transition:.3s ease;display:block}.work .experience aside .line a:hover .arrow{transform:rotate(-40deg)}.work .experience aside .line a:hover .text span{transform:translateY(-1.25em)}.work .experience aside .center-text{line-height:1.5}.work .experience .carousel{aspect-ratio:4/3;position:relative;overflow:hidden;border-top:1px solid rgba(0,0,0,.1);border-bottom:1px solid rgba(0,0,0,.1)}@media (min-width: 1000px){.work .experience .carousel{grid-column:span 2}}@media (max-width: 999px){.work .experience .carousel{width:80vw}}.work .experience .carousel:after{content:"";position:absolute;top:0;bottom:0;right:50%;width:1px;background:#00000006}.work .experience .carousel .carousel-content{display:flex;height:100%;transition:transform .5s ease}.work .experience .carousel .carousel-content .carousel-image{flex-shrink:0;height:100%;background-size:cover;background-position:center center;margin:0}@media (min-width: 1000px){.work .experience .carousel .carousel-content .carousel-image{width:53.3333333333vw}}@media (max-width: 999px){.work .experience .carousel .carousel-content .carousel-image{width:80vw}}.work .experience .carousel .carousel-content[data-slide="1"]{transform:translate(0)}.work .experience .carousel .carousel-content[data-slide="2"]{transform:translate(-100%)}.work .experience .carousel .carousel-content[data-slide="3"]{transform:translate(-200%)}.work .experience .carousel .carousel-indicators{position:absolute;bottom:1rem;left:50%;transform:translate(-50%);display:flex;gap:.25rem}.work .experience .carousel .carousel-indicators button{width:10px;height:10px;border-radius:5rem;padding:0;border:none;background:#fff;border:1px solid rgba(0,0,0,.1);transition:.3s ease-out}.work .experience .carousel .carousel-indicators button.active{width:20px;background:#f1f1f1;border:1px solid rgba(0,0,0,.1)}.work .experience .carousel .carousel-indicators button:not(.active):hover{cursor:pointer;opacity:.7}.work .experience .carousel .carousel-control{position:absolute;top:50%;transform:translateY(-50%);border:none;opacity:0;transition:.2s ease;font:inherit;font-size:1.25rem;background:transparent;color:#fff;mix-blend-mode:difference}.work .experience .carousel .carousel-control.carousel-previous{left:1rem}.work .experience .carousel .carousel-control.carousel-next{right:1rem}.work .experience .carousel .carousel-control:hover{cursor:pointer;opacity:1}.work .experience .carousel .carousel-control:hover.carousel-previous{transform:translateY(-50%) translate(-.125rem)}.work .experience .carousel .carousel-control:hover.carousel-previous:active{transform:translateY(-50%) translate(-.125rem) scale(.9)}.work .experience .carousel .carousel-control:hover.carousel-next{transform:translateY(-50%) translate(.125rem)}.work .experience .carousel .carousel-control:hover.carousel-next:active{transform:translateY(-50%) translate(.125rem) scale(.9)}.work .experience .carousel:hover .carousel-control{opacity:.8}.contact{background:#171717;color:#f1f1f1;position:relative}@media (min-width: 1000px){.contact{height:calc(50svh + 10rem)}}@media (max-width: 999px){.contact .contact-columns{display:flex;flex-direction:column;padding-bottom:17.5svh}.contact .contact-columns .column{padding-top:2rem;padding-bottom:2rem}}.contact .contact-columns .column{display:flex;align-items:center;justify-content:flex-start}.contact .contact-columns .column .column-content{height:20rem;width:100%;display:flex;flex-direction:column;justify-content:space-between}@media (max-width: 999px){.contact .contact-columns .column .column-content{height:auto;gap:2rem}}.contact .contact-columns .column .column-content h2{font-size:3.75rem;font-weight:500;margin:0}.contact .contact-columns .column .column-content .row .group{display:flex;gap:.25em}.contact .contact-columns .contact-form{width:100%;height:20rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem}.contact .contact-columns .contact-form fieldset{background:none;padding:0;border:none;display:flex;flex-direction:column;gap:1rem}.contact .contact-columns .contact-form fieldset input,.contact .contact-columns .contact-form fieldset textarea{border-radius:0;border:none;border-bottom:1px solid color-mix(in oklab,#F1F1F1 50%,rgba(0,0,0,0) 50%);transition:.2s ease-out;background:none;resize:none;font:inherit;color:inherit;padding:.25em 0;min-width:2rem}.contact .contact-columns .contact-form fieldset input:focus,.contact .contact-columns .contact-form fieldset textarea:focus{outline:none;border-bottom:1px solid #F1F1F1}.contact .contact-columns .contact-form fieldset textarea{height:6em}.contact .contact-columns .contact-form fieldset:has(:focus) input:not(:focus),.contact .contact-columns .contact-form fieldset:has(:focus) textarea:not(:focus){border-bottom:1px solid color-mix(in oklab,#F1F1F1 40%,rgba(0,0,0,0) 60%)}.contact .contact-columns .contact-form .form-line{display:grid;grid-template-columns:6rem auto}.contact .contact-columns .contact-form .form-line label{padding-top:.25em}.contact .contact-columns .contact-form .form-bottom{display:flex;justify-content:space-between;align-items:flex-end}.contact .contact-columns .contact-form .form-bottom p{margin:0}.contact .contact-columns .contact-form .form-bottom input[type=submit]{color:#171717;background:#f1f1f1;border:none;padding:.5rem 1rem;font:inherit;transition:.2s ease-out}.contact .contact-columns .contact-form .form-bottom input[type=submit]:disabled{opacity:.5}.contact .contact-columns .contact-form .form-bottom input[type=submit]:not(:disabled):hover{opacity:.9;cursor:pointer}.contact .contact-columns .image-column{position:relative}@media (max-width: 999px){.contact .contact-columns .image-column{display:none}}.contact .contact-columns .image-column img{width:100%;height:20rem;object-fit:cover}.contact .contact-columns .image-column img:nth-of-type(2){z-index:1;position:absolute;top:4rem;width:calc(100% - var(--column-padding) * 2);opacity:.1;transition:.5s ease}.contact .contact-columns .image-column img:nth-of-type(2):hover{opacity:1}.gradient-blur-bottom{position:fixed;z-index:4;inset:auto 0 0;height:4rem;pointer-events:none}.gradient-blur-bottom>div,.gradient-blur-bottom:before,.gradient-blur-bottom:after{position:absolute;inset:0}.gradient-blur-bottom:before{content:"";z-index:1;-webkit-backdrop-filter:blur(.5px);backdrop-filter:blur(.5px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgb(0,0,0) 12.5%,rgb(0,0,0) 25%,rgba(0,0,0,0) 37.5%)}.gradient-blur-bottom>div:nth-of-type(1){z-index:2;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 12.5%,rgb(0,0,0) 25%,rgb(0,0,0) 37.5%,rgba(0,0,0,0) 50%)}.gradient-blur-bottom>div:nth-of-type(2){z-index:3;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 25%,rgb(0,0,0) 37.5%,rgb(0,0,0) 50%,rgba(0,0,0,0) 62.5%)}.gradient-blur-bottom>div:nth-of-type(3){z-index:4;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 37.5%,rgb(0,0,0) 50%,rgb(0,0,0) 62.5%,rgba(0,0,0,0) 75%)}.gradient-blur-bottom>div:nth-of-type(4){z-index:5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgb(0,0,0) 62.5%,rgb(0,0,0) 75%,rgba(0,0,0,0) 87.5%)}.gradient-blur-bottom>div:nth-of-type(5){z-index:6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 62.5%,rgb(0,0,0) 75%,rgb(0,0,0) 87.5%,rgba(0,0,0,0) 100%)}.gradient-blur-bottom>div:nth-of-type(6){z-index:7;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 75%,rgb(0,0,0) 87.5%,rgb(0,0,0) 100%)}.gradient-blur-bottom>div:after{content:"";z-index:8;-webkit-backdrop-filter:blur(64px);backdrop-filter:blur(64px);mask:linear-gradient(to bottom,rgba(0,0,0,0) 87.5%,rgb(0,0,0) 100%)}.gradient-blur-top{position:fixed;z-index:4;inset:0 0 auto;height:4rem;pointer-events:none}.gradient-blur-top>div,.gradient-blur-top:before,.gradient-blur-top:after{position:absolute;inset:0}.gradient-blur-top:before{content:"";z-index:1;-webkit-backdrop-filter:blur(.5px);backdrop-filter:blur(.5px);mask:linear-gradient(to top,rgba(0,0,0,0) 0%,rgb(0,0,0) 12.5%,rgb(0,0,0) 25%,rgba(0,0,0,0) 37.5%)}.gradient-blur-top>div:nth-of-type(1){z-index:2;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);mask:linear-gradient(to top,rgba(0,0,0,0) 12.5%,rgb(0,0,0) 25%,rgb(0,0,0) 37.5%,rgba(0,0,0,0) 50%)}.gradient-blur-top>div:nth-of-type(2){z-index:3;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);mask:linear-gradient(to top,rgba(0,0,0,0) 25%,rgb(0,0,0) 37.5%,rgb(0,0,0) 50%,rgba(0,0,0,0) 62.5%)}.gradient-blur-top>div:nth-of-type(3){z-index:4;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);mask:linear-gradient(to top,rgba(0,0,0,0) 37.5%,rgb(0,0,0) 50%,rgb(0,0,0) 62.5%,rgba(0,0,0,0) 75%)}.gradient-blur-top>div:nth-of-type(4){z-index:5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);mask:linear-gradient(to top,rgba(0,0,0,0) 50%,rgb(0,0,0) 62.5%,rgb(0,0,0) 75%,rgba(0,0,0,0) 87.5%)}.gradient-blur-top>div:nth-of-type(5){z-index:6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);mask:linear-gradient(to top,rgba(0,0,0,0) 62.5%,rgb(0,0,0) 75%,rgb(0,0,0) 87.5%,rgba(0,0,0,0) 100%)}.gradient-blur-top>div:nth-of-type(6){z-index:7;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);mask:linear-gradient(to top,rgba(0,0,0,0) 75%,rgb(0,0,0) 87.5%,rgb(0,0,0) 100%)}.gradient-blur-top>div:after{content:"";z-index:8;-webkit-backdrop-filter:blur(64px);backdrop-filter:blur(64px);mask:linear-gradient(to top,rgba(0,0,0,0) 87.5%,rgb(0,0,0) 100%)}@keyframes svelte-k5ksu5-cursorFade{0%,to{opacity:1}50%{opacity:0}}.typewriter-container.svelte-k5ksu5 *:not(.typing):not(.finished-typing):not([data-static]){display:none}.typewriter-container.svelte-k5ksu5 .finished-typing:after{content:none}.cursor.svelte-k5ksu5 .typing:after{content:"";width:var(--cursor-width, 1ch);height:2ch;display:inline-block;vertical-align:text-top;background-color:var(--cursor-color, #000000);animation:svelte-k5ksu5-cursorFade 1.25s infinite}
