@import"https://use.typekit.net/uzk0swo.css";body{margin:0;padding:0;font-family:articulat-cf,sans-serif}*{box-sizing:border-box}@keyframes fade-up{0%{transform:translateY(1em);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes reveal{0%{width:0}to{width:100%}}@keyframes emoji-in1{0%{width:0}to{width:.55em}}@keyframes emoji-in2{0%{width:0}to{width:1.5em}}@keyframes emoji-in3{0%{width:0}to{width:.6em}}nav{position:absolute;top:0;width:100vw;box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;padding:max(2rem,2.5vmax) 5vmax;z-index:500}nav #title{color:inherit;text-decoration:none;text-transform:uppercase;animation-name:fade-up;animation-duration:1.5s;animation-delay:2.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0;transform:scale(0)}nav #title h2{margin:0;font-weight:800}@media (max-width: 550px){nav #title h2{font-size:1.4rem}}nav #title span{transition:.2s ease-in-out}nav #title:hover span:nth-of-type(odd){color:#00a6ed}nav #title:hover span:nth-of-type(2n){color:#ffb02c}nav #socials{display:flex;gap:.5rem}nav #socials a{background:black;padding:.5rem;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;width:fit-content;border-radius:5rem;position:relative;top:0;animation-name:pop;animation-duration:1s;animation-delay:8s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:scale(0);transition:.2s ease-out;opacity:.75}nav #socials a img{width:1rem;height:1rem}nav #socials a:nth-of-type(1){animation-delay:2.75s}nav #socials a:nth-of-type(2){animation-delay:3s}nav #socials a:nth-of-type(3){animation-delay:3.25s}nav #socials a:nth-of-type(4){animation-delay:3.5s}@media (max-width: 550px){nav #socials a{padding:.25rem}nav #socials a img{width:.75rem;height:.75rem}}nav #socials:has(a:nth-of-type(1):hover) a:nth-of-type(1){top:.4rem;opacity:1}nav #socials:has(a:nth-of-type(1):hover) a:nth-of-type(2){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(1):hover) a:nth-of-type(3){top:0;opacity:.7}nav #socials:has(a:nth-of-type(1):hover) a:nth-of-type(4){opacity:.6}nav #socials:has(a:nth-of-type(2):hover) a:nth-of-type(1){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(2):hover) a:nth-of-type(2){top:.4rem;opacity:1}nav #socials:has(a:nth-of-type(2):hover) a:nth-of-type(3){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(2):hover) a:nth-of-type(4){top:0;opacity:.7}nav #socials:has(a:nth-of-type(3):hover) a:nth-of-type(4){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(3):hover) a:nth-of-type(3){top:.4rem;opacity:1}nav #socials:has(a:nth-of-type(3):hover) a:nth-of-type(2){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(3):hover) a:nth-of-type(1){top:0;opacity:.7}nav #socials:has(a:nth-of-type(4):hover) a:nth-of-type(4){top:.4rem;opacity:1}nav #socials:has(a:nth-of-type(4):hover) a:nth-of-type(3){top:.2rem;opacity:.8}nav #socials:has(a:nth-of-type(4):hover) a:nth-of-type(2){top:0;opacity:.7}nav #socials:has(a:nth-of-type(4):hover) a:nth-of-type(1){opacity:.6}@keyframes pop{0%{transform:scale(0)}to{transform:scale(1)}}header{height:100vh;padding:2.5vmax 5vmax;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;position:relative}header h1{text-transform:uppercase;font-weight:900;font-size:5.5vw;line-height:1.1em;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column}@media (max-width: 1000px){header h1{font-size:4rem}}@media (max-width: 550px){header h1{font-size:3rem}}@media (max-width: 450px){header h1{font-size:2.5rem}}header h1 .line{display:block;display:flex;gap:.5ch}@media (max-width: 1000px){header h1 .line{flex-wrap:wrap;justify-content:center}header h1 .line:nth-of-type(1) .wrapper:nth-of-type(3){position:relative;bottom:.4em}header h1 .line:nth-of-type(2) .yours-wrapper{position:relative;bottom:.3em}}header h1 .line .wrapper{clip-path:polygon(0 0,100% 0,100% 100%,0% 100%);width:fit-content;height:fit-content}header h1 .line .wrapper span{width:fit-content;height:fit-content}header h1 .line .wrapper .content{display:block}header h1 .line .stories-wrapper{padding:.85em 0 .25em;margin:-.85em 0 -.25em}header h1 .line .stories-wrapper .highlight:before{animation-name:reveal;animation-duration:2s;animation-delay:1.25s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;width:0}header h1 .line .yours-wrapper{padding-top:.2em;margin-top:-.2em}header h1 .line .yours-wrapper .highlight:before{animation-name:reveal;animation-duration:2s;animation-delay:1.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;width:0}header h1 .line:nth-of-type(1) .wrapper:nth-of-type(1) .content{animation-name:fade-up;animation-duration:1.5s;animation-delay:.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}header h1 .line:nth-of-type(1) .wrapper:nth-of-type(2) .content{animation-name:fade-up;animation-duration:1.5s;animation-delay:.6s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}header h1 .line:nth-of-type(1) .wrapper:nth-of-type(3) .content{animation-name:fade-up;animation-duration:1.5s;animation-delay:.7s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}header h1 .line:nth-of-type(2) .wrapper:nth-of-type(1) .content{animation-name:fade-up;animation-duration:1.5s;animation-delay:.9s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}header h1 .line:nth-of-type(2) .wrapper:nth-of-type(2) .content{animation-name:fade-up;animation-duration:1.5s;animation-delay:1s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;transform:translateY(1em);opacity:0}header h1 .highlight{color:#fff;padding:.1em .5em 0;position:relative;bottom:.1em;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;width:fit-content;display:flex!important}header h1 .highlight .text{position:relative}header h1 .highlight:before{content:"";width:100%;height:90%;background:black;position:absolute;top:0;left:0;z-index:0;border-radius:10px}@media (max-width: 800px){header h1 .highlight:before{top:.1em}}header h1 .highlight .emoji{position:absolute}header h1 .highlight#stories{color:#00a6ed}header h1 .highlight#stories .emoji{transition:transform 1s cubic-bezier(.33,1,.68,1)}header h1 .highlight#stories .emoji:nth-of-type(1){width:0;left:1.5em;top:-.1em;transform:rotate(15deg);animation-name:emoji-in1;animation-duration:1s;animation-delay:2.25s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards}header h1 .highlight#stories .emoji:nth-of-type(2){width:0;z-index:2;top:-.4em;transform:rotate(-30deg);animation-name:emoji-in2;animation-duration:1s;animation-delay:2s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards}header h1 .highlight#stories .emoji:nth-of-type(3){width:0;right:1.6em;bottom:-.1em;transform:rotate(30deg);animation-name:emoji-in3;animation-duration:1s;animation-delay:2.5s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards}@media (max-width: 800px){header h1 .highlight#stories .emoji:nth-of-type(1){transform:rotate(13deg) scale(.9) translate(-.2em,-.1em)}header h1 .highlight#stories .emoji:nth-of-type(2){transform:rotate(-15deg) scale(.7) translate(.6em,-.5em)}header h1 .highlight#stories .emoji:nth-of-type(3){transform:rotate(-40deg) scale(.8) translate(-.9em,-.6em)}}header h1 .highlight#stories:hover .emoji:nth-of-type(1){left:1.5em;top:-.1em;transform:rotate(10deg) scale(.8) translate(-.2em,-.4em)}header h1 .highlight#stories:hover .emoji:nth-of-type(2){transform:rotate(-5deg) scale(.7) translate(.4em,-1em)}header h1 .highlight#stories:hover .emoji:nth-of-type(3){transform:rotate(-30deg) scale(.8) translate(-.8em,-.3em)}header h1 .highlight#yours{color:#ffb02c}header h1 .highlight#yours .emoji{width:0;top:-.2em;transition:transform .25s cubic-bezier(.33,1,.68,1);animation-name:emoji-in2;animation-duration:1s;animation-delay:2.75s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards}header h1 .highlight#yours:hover .emoji{transform:scale(.95)}header #arrow{position:absolute;bottom:3vh;background:black;border-radius:5px;width:2rem;height:2rem;display:grid;place-items:center;animation-name:arrow-down;animation-duration:1s;animation-delay:4s;animation-timing-function:cubic-bezier(.33,1,.68,1);animation-fill-mode:forwards;opacity:0;transition:.3s ease-out}header #arrow img:nth-of-type(1){filter:invert(100%)}header #arrow img:nth-of-type(2){position:absolute;animation:arrow-animation 2s linear infinite;opacity:.25;transition:.3s ease-out;transition-delay:.3s}header #arrow:after{content:"(Scroll)";position:absolute;left:2.5rem;font-size:.8rem;clip-path:polygon(0 0,0 0,0 100%,0% 100%);transition:.3s ease-out;transition-delay:.3s}header #arrow:hover{bottom:2.5vh}header #arrow:hover:after{clip-path:polygon(0 0,100% 0,100% 100%,0% 100%)}header #arrow:hover img:nth-of-type(2){opacity:.5}@keyframes arrow-down{0%{opacity:0;bottom:calc(3vh + 2rem)}to{opacity:1;bottom:3vh}}@keyframes arrow-animation{0%{clip-path:polygon(0 0,100% 0,100% 0,0 0)}20%{clip-path:polygon(0 0,100% 0,0 25%,100% 25%)}40%{clip-path:polygon(0 25%,100% 25%,100% 50%,0 50%)}60%{clip-path:polygon(0 50%,100% 50%,100% 75%,0 75%)}80%{clip-path:polygon(0 75%,100% 75%,100% 100%,0 100%)}to{clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}}#about-scroll-section{isolation:isolate;position:relative}#about{height:100vh;padding:2.5vmax 5vmax;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;background:white;clip-path:polygon(0 0,100% 0,100% 100%,0% 100%)}#about .inner{display:flex;flex-direction:column;align-items:flex-start;text-transform:uppercase;text-align:left;width:fit-content}#about .inner h2{font-size:2rem;color:#737373;font-weight:900;margin:0;width:fit-content}#about .inner h3{font-size:5rem;font-weight:900;margin:.2em 0 0;line-height:1.25;width:fit-content;display:flex;flex-direction:column}#about .inner h3:nth-of-type(2){margin-top:.5em}@media (max-width: 1200px){#about .inner h3{font-size:6vw}}@media (max-width: 800px){#about .inner h3{line-height:1.75}}#about .inner h3 .line{white-space:nowrap}#about .inner h3 .highlight{background:black;color:#fff;padding:.1em .25em 0;margin-right:-.2em;border-radius:.1em;position:relative;bottom:.05em;width:fit-content;white-space:nowrap;overflow:hidden}#about .inner h3 .highlight img{height:.8em;position:relative;top:.05em;margin-right:-.1em}#about .inner h3 .highlight .highlight-content{position:relative;top:.04em}#past-sites{height:100vh;width:100%;padding:2.5vmax 5vmax;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;background:black;position:absolute;top:0;left:0;z-index:-1;isolation:isolate}#past-sites h2{text-transform:uppercase;font-weight:900}@media (min-width: 800px){#past-sites h2{position:absolute}}#past-sites h2 .small{color:#fff;display:block;font-size:4.5rem;-webkit-text-stroke:.5px #6DCDFF}@media (max-width: 800px){#past-sites h2 .small{font-size:8vw;line-height:1}}#past-sites h2 .big{color:#6dcdff;display:block;font-size:8rem}@media (max-width: 800px){#past-sites h2 .big{font-size:15vw;line-height:1}}#past-sites .images{position:relative;z-index:-1;display:flex}#past-sites .images img{width:35vw;position:relative;border-radius:10px}@media (max-width: 800px){#past-sites .images img{border-radius:4px}}#past-sites .images img:nth-of-type(1){margin-right:-29vw;opacity:.2}#past-sites .images img:nth-of-type(2){margin-right:-29.75vw;opacity:calc((2 + 1) * .1)}#past-sites .images img:nth-of-type(3){margin-right:-30.5vw;opacity:.4}#past-sites .images img:nth-of-type(4){margin-right:-31.25vw;opacity:.5}#past-sites .images img:nth-of-type(5){margin-right:-32vw;opacity:calc((5 + 1) * .1)}#past-sites .images img:nth-of-type(6){margin-right:-32.75vw;opacity:calc((6 + 1) * .1)}#past-sites .images img:nth-of-type(7){margin-right:-33.5vw;opacity:.8}#past-sites .images img:nth-of-type(8){margin-right:-34.25vw;opacity:.9}#past-sites .images img:nth-of-type(9){margin-right:-35vw;opacity:1}#past-sites .images img:nth-of-type(10){margin-right:-35.75vw;opacity:1.1}#past-sites .images img:nth-of-type(9){margin-right:0!important}#projects{height:100vh;padding:0 5vmax;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;text-align:left;overflow:hidden;text-transform:uppercase;isolation:isolate}#projects h2,#projects span[aria-hidden=true]{position:absolute;font-weight:900;font-size:7rem;z-index:2;mix-blend-mode:difference;color:#fff;pointer-events:none}@media (max-width: 800px){#projects h2,#projects span[aria-hidden=true]{font-size:15vw}}#projects span[aria-hidden=true]{z-index:-1;mix-blend-mode:normal}#projects #scroller{position:absolute;left:5vmax;display:grid;grid-template-columns:1fr 1fr;gap:0 15vw;width:calc(100% - 10vmax);height:100vh;overflow:hidden}#projects #scroller .project{position:absolute;top:-100%;animation-name:project-up;animation-duration:20s;animation-timing-function:linear;animation-iteration-count:infinite}#projects #scroller .project img{width:39vw;aspect-ratio:16/9;object-fit:cover;border-radius:10px;border:1px solid black;animation-name:image-up;animation-duration:20s;animation-timing-function:linear;animation-iteration-count:infinite}@media (max-width: 800px){#projects #scroller .project img{width:60vw}}@media (max-width: 700px){#projects #scroller .project img{width:70vw}}@media (max-width: 600px){#projects #scroller .project img{width:100%}}@keyframes image-up{0%{object-position:bottom}to{object-position:top}}#projects #scroller .project .project-title{text-decoration:none;color:#000}#projects #scroller .project .project-title h3{margin:.2em 0 0;font-weight:900;font-size:1.5rem}@keyframes project-up{0%{top:100%}to{top:-100%}}#projects #scroller .project:nth-of-type(odd){right:0}#projects #scroller .project:nth-of-type(2){animation-delay:5s}#projects #scroller .project:nth-of-type(2) img{animation-delay:5s}#projects #scroller .project:nth-of-type(3){animation-delay:10s}#projects #scroller .project:nth-of-type(3) img{animation-delay:10s}#projects #scroller .project:nth-of-type(4){animation-delay:15s}#projects #scroller .project:nth-of-type(4) img{animation-delay:15s}#projects #scroller:has(.project:hover) .project{animation-play-state:paused}#projects #scroller:has(.project:hover) .project img{animation-play-state:paused}#contact{height:100vh;padding:2.5vmax 5vmax;display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;text-align:left}#contact h2{font-size:5rem;font-weight:900;text-transform:uppercase;margin:0 0 .5rem}@media (max-width: 1350px){#contact h2{font-size:6vw}}@media (max-width: 1000px){#contact h2{font-size:4rem}}@media (max-width: 800px){#contact h2{line-height:1}}@media (max-width: 500px){#contact h2{font-size:3rem}}#contact #contact-content{display:flex;justify-content:space-between;text-align:left;gap:2rem}@media (max-width: 800px){#contact #contact-content{flex-direction:column}}#contact #contact-content #contact-info p{margin:0 0 .75rem}#contact #contact-content #contact-info .contact-info-line{display:flex;align-items:center;gap:.5rem;height:1.75rem}@media (max-width: 390px){#contact #contact-content #contact-info .contact-info-line{flex-direction:column;align-items:flex-start;height:auto;gap:0}#contact #contact-content #contact-info .contact-info-line:not(:nth-of-type(1)){margin-top:.5rem}}#contact #contact-content #contact-info .contact-info-line h3{font-size:1.25rem;margin:0;font-weight:900;text-transform:uppercase}#contact #contact-content #contact-info .contact-info-line a{text-decoration:none;color:inherit}#contact #contact-content #contact-info .contact-info-line .contact-social-media{display:flex;gap:.25rem;position:relative;bottom:.1rem}#contact #contact-content #contact-info .contact-info-line .contact-social-media a{background:black;border-radius:5rem;display:grid;place-items:center;padding:.25rem;aspect-ratio:1;transition:.2s ease-out}#contact #contact-content #contact-info .contact-info-line .contact-social-media a img{height:1rem;width:1rem}#contact #contact-content #contact-info .contact-info-line .contact-social-media a:hover{opacity:.8;transform:scale(.95)}#contact #contact-content form{display:flex;flex-direction:column}#contact #contact-content form fieldset{padding:0;margin:0 0 1rem;border:none;display:grid;grid-template-columns:1fr 1fr;gap:1rem}#contact #contact-content form input,#contact #contact-content form textarea{border:none;font:inherit;color:inherit;resize:none;border-radius:0}#contact #contact-content form input:focus,#contact #contact-content form textarea:focus{outline:none}#contact #contact-content form input:not([type=submit]),#contact #contact-content form textarea{border-bottom:1px solid black;transition:.2s ease-out}#contact #contact-content form input:not([type=submit]):hover,#contact #contact-content form textarea:hover{border-color:#005c83}#contact #contact-content form input:not([type=submit]):focus,#contact #contact-content form textarea:focus{outline:none;border-color:#00a6ed;color:#003e58}@media (max-width: 500px){#contact #contact-content form input:not([type=submit]){width:100%}}#contact #contact-content form input[type=submit]{width:fit-content;align-self:flex-end;background:black;color:#fff;border-radius:5rem;padding:.6rem 1.5rem .4rem;margin-top:.75rem;transition:.2s ease-out}#contact #contact-content form input[type=submit]:hover{cursor:pointer;transform:scale(.9) rotate(-5deg)}#contact #contact-content form textarea{min-height:15vh;min-width:30vw;margin-top:.3rem}
