@import "./fonts/Onest/stylesheet.css";@import "./fonts/talina/stylesheet.css";:root{--color-theme-a:hsl(210, 30%, 10%);--color-theme-a:hsl(220, 0%, 84%);--color-background:hsl(34, 20%, 96%);--y-offset:.2em;--x-offset:.5em;--animation-duration:7s;--color-header-background:#D6D6D6;--color-header-text:#44444C;--color-body-background:#D6D6D6;--color-body-text:#44444C;--color-supportive:#8C8C8C;--color-dark:#0B0909;--transition-duration:.2s}html,body,h1,h2,h3,h4,p,a,ul,li,button{margin:0;padding:0;box-sizing:border-box}ul,li{list-style:none;text-decoration:none}a{text-decoration:none}button{border-style:none;cursor:pointer;background:none}img{-webkit-user-select:none;user-select:none}html{font-smoothing:antialiased}body{position:relative;background-color:hsl(0 0% 96%);color:var(--color-body-text);display:grid;grid-template-rows:auto auto;grid-template-columns:100%;justify-content:center;font:1.2em/2em Onest,Geneva,sans-serif;font-weight:600;overflow-x:hidden}header{position:sticky;top:0;width:100%;box-sizing:border-box;display:grid;grid-template-columns:auto 420px;grid-template-rows:70px;justify-content:space-between;align-items:center;padding:0 1em 0 2em;margin:auto;color:#2C2C2C;-webkit-user-select:none;-ms-user-select:none;user-select:none;z-index:100;overflow:hidden}header::before,header::after{content:"";position:absolute;inset:0;opacity:0}header::before{z-index:-1;background-color:hsl(0 0% 96% / .75);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);opacity:1}header::after{height:100%;z-index:-1;background-color:#000;transition:opacity .2s ease-out}header h1{position:relative;font:2.2em/1em Talina,Geneva,sans-serif;text-align:center;padding-top:4px;color:inherit;cursor:default;z-index:2;will-change:transform}header h1 a{color:inherit;position:relative}header h1 a::before{content:"KNACK";position:absolute;inset:0;color:#f4f4f4;margin:auto;padding-top:4px;opacity:0}header h1:hover{animation:bounce .4s ease-in-out 0s}nav{padding:0;width:100%;height:100%;position:relative}nav ul{position:relative;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:100%;column-gap:2px;width:100%;height:100%;justify-content:center;align-items:center;font-size:1em;font-weight:700;margin:auto;overflow:hidden;box-sizing:border-box;z-index:1;transition:transform .3s ease-in-out .3s}nav li{position:relative;text-align:center;width:100%;height:100%;padding:0}nav li::before{content:"";position:absolute;inset:0;height:50%;width:2px;box-shadow:inset 0 0 2px hsl(220 0% 0% / .2);border-radius:1px;left:100%;margin:auto;z-index:1}nav li:last-child::before{display:none}nav li a{position:absolute;inset:0;margin:auto;color:inherit;text-align:center}nav li a span{position:absolute;line-height:70px;inset:0;top:.1em;margin:auto}nav li a:hover span{transform:translateY(-.1em);transition:transform .1s ease-out}nav li a:active span{transform:translateY(.1em);transition:transform 0s ease-out}nav li:nth-child(2) a span{left:.1 em}nav button[name="close"]{position:absolute;right:calc(-180px - 1em);top:.1em;width:180px;display:grid;grid-template-columns:auto 50px;justify-content:space-between;align-content:center;align-items:center;color:#2C2C2C;border:2px solid #2C2C2C;border-radius:26px;padding:0 0 0 1em;will-change:transform;transition:transform .3s ease-in-out;background-color:hsl(220 0% 11%);color:hsl(220 0% 96%);z-index:1}nav button[name="close"] span{pointer-events:none;line-height:2.4em;font-weight:700;position:relative;width:100%;height:100%;box-sizing:border-box;padding-top:.1em}nav button[name="close"] span:last-child{height:1em}nav button[name="close"] svg{position:absolute;inset:0}nav button[name="close"]:active{transform:scale(.9);background-color:hsl(22 0% 11% / .9)}#close-project-display{position:absolute;inset:0;margin:auto;width:100%;pointer-events:none;transform:translateY(100%);opacity:0}#close-project-display button{position:relative;display:block;width:100%;height:100%;margin:auto}#close-project-display svg{position:absolute;width:40px;height:40px;margin:auto;top:0;bottom:0;right:2em;transition:transform .15s ease-out;transform-origin:center;pointer-events:none}#close-project-display button:hover svg{transform:scale(1.1)}#close-project-display button:active svg{transition:transform 0s ease-out;transform:scale(1)}#content{position:relative;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:100%;background-color:inherit}#content>section{overflow:hidden;min-height:600px}#welcome{height:calc(100lvh - 105px);box-sizing:border-box;position:relative;margin:0;background-color:inherit;z-index:1}#welcome.hidden{opacity:.3}#welcome h2{pointer-events:none;position:absolute;top:50%;transform:translateY(calc(-50% - 10px));text-align:center;font:5em/1.1em Talina,Geneva,sans-serif;color:#F5F5F5;text-shadow:0 10px 40px hsl(34 0% 0% / .2);width:100%;font-size:clamp(5em, 6vw, 9em);z-index:2;padding:0 1em;box-sizing:border-box;transition:opacity .75s ease-in-out 0s;-webkit-user-select:none;user-select:none}#welcome .delivery{display:inline-block;padding-top:.3em}#welcome .fullcircle{font-size:.5em;font-weight:600;font-style:italic}#welcome .underline{color:#93de9c}h2.hidden{opacity:0}#backdrop{position:relative;height:calc(100% - 5px);width:calc(100%);margin:auto;overflow:hidden}#backdrop::before,#backdrop::after{content:"";position:absolute;width:100%;height:40px;z-index:1;pointer-events:none}#backdrop::before{top:-40px;box-shadow:0 30px 60px hsl(0 0% 0% / .3)}#backdrop::after{bottom:-40px;box-shadow:0 -30px 60px hsl(0 0% 0% / .3)}#backdrop video{position:absolute;width:100%;height:100%;object-fit:cover;border-radius:inherit;background-color:#000}.figure-eight-y{position:absolute;inset:0;bottom:5px;margin:auto;display:grid;justify-content:center;align-content:center;justfy-items:center;color:var(--color-background);font-weight:700;z-index:2;cursor:pointer;pointer-events:none;--name:vertical;--duration:calc(0.5 * var(--animation-duration));--delay:0s;opacity:0;transition:opacity .2s ease-in-out 0s}.figure-eight-x{position:relative;display:grid;justify-content:center;align-content:center;--name:horizontal;--duration:var(--animation-duration);--delay:calc(-0.25 * var(--animation-duration));width:100%;margin:auto}.figure-eight-y,.figure-eight-x{box-sizing:border-box;text-align:center;animation:var(--duration) ease-in-out var(--delay) alternate infinite var(--name)}.figure-eight-x span{position:relative;display:inline-block;margin:auto;width:5em}.figure-eight-x span::before{content:"";position:absolute;inset:0;width:5em;height:5em;margin:auto;background-color:#000;display:block;border-radius:4em;z-index:-1;box-sizing:border-box;box-shadow:0 4px 15px hsl(360 0% 0% / .2);border:2px solid hsl(360 0% 100% / .1)}#play-banner{opacity:0}#unmute-banner{top:auto;bottom:5em;left:auto;right:2em;opacity:1;transition:opacity .2s ease-in-out .2s}#unmute-banner span{width:5em}#unmute-banner span::before{width:4.5em;height:4.5em;border:2px solid hsl(0 0% 96% / .5);background-color:hsl(0 0% 96% / .7);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}#unmute-banner span svg{position:absolute;inset:0;width:60%;height:auto;margin:auto}#unmute-banner span[data-indicator="muted"]{opacity:1}#unmute-banner span[data-indicator="unmuted"]{opacity:0}#unmute-banner.unmuted span[data-indicator="muted"]{opacity:0}#unmute-banner.unmuted span[data-indicator="unmuted"]{opacity:1}#welcome:active .figure-eight-x span{transform:scale(.97)}#studio{position:relative;height:calc(100lvh);z-index:1;background-color:inherit}#studio-image-container{--studio-grid-gap:5px;display:grid;grid-template-columns:auto auto auto auto auto auto;grid-template-rows:auto auto auto;grid-gap:var(--studio-grid-gap);padding:var(--studio-grid-gap) 0}#studio-image-container li{position:relative}#studio-image-container li:nth-child(1){grid-area:1 / 1 / 2 / 3;height:80lvh}#studio-image-container li:nth-child(2){grid-area:1 / 3 / 2 / 7}#studio-image-container li:nth-child(3){grid-area:2 / 1 / 3 / 5;height:40lvh}#studio-image-container li:nth-child(4){grid-area:2 / 5 / 3 / 7}#studio-image-container li:nth-child(5){grid-area:3 / 1 / 4 / 4;height:70vh;color:var(--color-palette-support);--color-palette-background:#222222;--color-palette-text:#F3EFE0;--color-palette-selection:#22A39F;--color-palette-support:#434242}#studio-image-container li:nth-child(6){grid-area:3 / 4 / 4 / 7}#studio-image-container img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#studio-intro{position:absolute;top:50%;transform:translateY(-50%);margin:auto;width:100%;font:1em/1.5em Onest,Geneva,sans-serif;display:grid;justify-content:center;align-content:center;box-sizing:border-box;padding:0 5em;z-index:1;color:hsl(0 0% 96%);text-shadow:0 15px 30px hsl(34 0% 0% / .3);z-index:2}#studio-intro p{display:block;font-size:clamp(1.4em, 1.3vw, 1.7em);font-weight:700;line-height:2em;text-align:center;color:inherit;margin:auto;white-space:pre-line;-webkit-user-select:none;user-select:none}#studio-intro .observe span{opacity:0}#studio-intro .observe span.type{opacity:1}#studio-intro .line:nth-child(1)::after{content:" ";white-space:normal}#studio-intro .line:nth-child(2)::after{content:"\a";white-space:pre}#studio-backdrop-container{position:relative;margin:auto;height:100%;width:100%;overflow:hidden;z-index:-1}#studio-backdrop-container::before{content:"";position:absolute;inset:0;background-color:hsl(360 100% 0% / .3);z-index:1}#studio-backdrop-container img{position:absolute;left:0;right:0;bottom:0;width:100%;height:calc(119vh);min-height:720px;object-fit:cover;object-position:45% 100%;transition:transform 0s ease-out;will-change:transform}#brands-wrapper{position:relative;bottom:35px;z-index:1;width:auto;display:grid;grid-auto-flow:column;justify-content:start}#brands-wrapper ul{position:absolute;height:70px;bottom:0;padding:0 70px;display:grid;grid-auto-flow:column;align-content:center;grid-template-columns:repeat(17,140px);overflow-x:visible;grid-column-gap:140px;width:auto}#brands-wrapper li{position:relative;color:hsl(34 20% 16%);height:44px;text-align:center}#brands-wrapper img{position:absolute;inset:0;margin:auto;width:100%;object-fit:cover}section#selected-works{position:relative;min-height:100lvh;display:grid;grid-template-rows:auto auto auto;grid-template-columns:100%;scroll-margin:70px;background-color:inherit;padding-top:5px;z-index:2}#work-vignettes ul{display:grid;grid-template-columns:repeat(13,1fr);grid-auto-rows:minmax(360px,50lvh);grid-auto-flow:row;justify-content:start;grid-gap:3px}#work-vignettes li{position:relative;height:100%;width:100%;overflow:hidden;transition:opacity 0.3s ease-out,transform 0.3s ease-out}#work-vignettes li.observe{opacity:0;transform:translateY(50px)}#work-vignettes li:nth-child(2){grid-area:1 / 1 / 2 / 7}#work-vignettes li:nth-child(3){grid-area:1 / 7 / 2 / 14}#work-vignettes li:nth-child(4){grid-area:2 / 1 / 3 / 5}#work-vignettes li:nth-child(5){grid-area:2 / 5 / 3 / 11}#work-vignettes li:nth-child(6){grid-area:2 / 11/ 3 / 14}#work-vignettes li:nth-child(7){grid-area:3 / 1 / 4 / 6}#work-vignettes li:nth-child(8){grid-area:3 / 6 / 4 / 10}#work-vignettes li:nth-child(9){grid-area:3 / 10 / 4 / 14}#work-vignettes li:nth-child(10){grid-area:4 / 1 / 5 / 7}#work-vignettes li:nth-child(11){grid-area:4 / 7 / 5 / 11}#work-vignettes li:nth-child(12){grid-area:4 / 11 / 5 / 14}#work-vignettes li:nth-child(13){grid-area:5 / 1 / 6 / 5}#work-vignettes li:nth-child(14){grid-area:5 / 5 / 6 / 10}#work-vignettes li:nth-child(15){grid-area:5 / 10 / 6 / 14}#work-vignettes li:nth-child(16){grid-area:6 / 1 / 7 / 4}#work-vignettes li:nth-child(17){grid-area:6 / 4 / 7 / 11}#work-vignettes li:nth-child(18){grid-area:6 / 11 / 7 / 14}#work-vignettes li:nth-child(19){grid-area:7 / 1 / 8 / 5}#work-vignettes li:nth-child(20){grid-area:7 / 5 / 8 / 9}#work-vignettes li:nth-child(21){grid-area:7 / 9 / 8 / 14}.work-preview{position:relative;height:100%;box-shadow:0 30px 50px hsl(210 30% 20% / .2);cursor:pointer;box-sizing:border-box;transition:transform .25s ease-in-out 0s}.work-preview a{border-radius:inherit;overflow:hidden;position:relative;width:100%;height:100%;display:block;will-change:transform;transition:transform .1s ease-in-out}.work-preview a:active{transform:scale(.95)}.work-preview img{position:absolute;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;will-change:transform;transition:transform .3s ease-in-out}.work-preview:hover img{transform:scale(1.03)}#work-vignettes li:nth-child(21) img{object-position:21%}.work-info{position:absolute;bottom:0;left:0;background-color:#000;color:#F5F5F5;padding:.5em 3em .5em 1em;pointer-events:none;font-size:clamp(.8em, 1.3vw, 1em)}.work-medium{font-size:.9em;font-weight:500;opacity:.8}.work-title{display:grid;grid-template-columns:auto auto auto;justify-content:start;grid-column-gap:.5em}.work-tags p{display:grid;grid-template-columns:repeat(auto-fit,auto);grid-auto-flow:column;grid-column-gap:2em;justify-content:start;font-size:.9em;font-weight:500;position:relative}.work-tags p span{position:relative}.work-tags p span::before{content:'#';opacity:.8}section#contact{position:relative;min-height:calc(100lvh - 9em);display:grid;grid-template-rows:minmax(360px,50lvh) auto;grid-template-columns:100%;margin:auto;align-content:start;align-items:center;font-size:1.2em;background-color:inherit;width:100%;scroll-margin:70px}#contact .note{z-index:1;text-align:center;line-height:2em;color:hsl(230 0% 96%);text-shadow:0 5px 15px hsl(34 0% 0% / .7);height:100%;padding:0 2em;position:relative;display:grid;grid-template-rows:auto auto auto auto;align-content:center;overflow:hidden}#contact .note p{-webkit-user-select:none;user-select:none;font-weight:700}#contact-backdrop-container{position:absolute;inset:0;z-index:-1;height:auto;margin:35px;box-sizing:border-box;overflow:hidden}#contact-backdrop-container img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.05);transition:transform 1.5s ease-out;will-change:transform}#social{text-align:center;display:grid;grid-auto-columns:52px;grid-template-rows:44px;grid-auto-flow:column;justify-content:center;align-content:center;grid-gap:16px}#social>li{position:relative;height:100%;width:auto;transition:opacity 0.3s ease-out,transform 0.3s ease-out}#social>li.observe{opacity:0;transform:translateY(30px)}#social>li>a{position:absolute;padding:18%;inset:0;margin:auto}#social a>img{height:100%;width:auto;object-fit:cover}.nowrap{white-space:nowrap}#contact-subjects{position:relative;box-sizing:border-box;padding:0 15px 1em 15px;margin:auto;width:100%;background-color:hsl(230 0% 90% / .5)}#contact-subjects::before{content:"";position:absolute;top:0;left:-5%;right:0;height:.5em;width:110%;margin:auto;z-index:1;background:repeating-linear-gradient(45deg,hsl(230 0% 90% / .5),hsl(230 0% 90% / .5) 15px,hsl(230 32% 48%) 10px,hsl(230 32% 48%) 30px)}#contact-subjects h3{text-align:center;margin:1.9em auto}footer{position:relative;background-color:hsl(230 0% 11%);height:70px;display:grid;grid-auto-flow:column}footer span{display:block;text-align:center;line-height:70px;color:hsl(230 0% 50%)}body:before{content:"";position:fixed;inset:0;background-color:hsl(230 0% 11%);transform:translateY(200px);overflow:hidden}#project-display{position:fixed;inset:0;left:100lvw;width:100%;height:100lvh;background-color:hsl(270 0% 100% / .7);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);z-index:10;overflow-y:scroll;transform:translateY(100lvh);opacity:0;transition:opacity .2s ease-in-out 0s,transform 0s ease-in-out .2s}#project-content-wrapper{position:relative;width:75%;margin:105px auto}#project-media{position:relative;width:100%;height:auto;background-color:#000;border-radius:50px;box-sizing:border-box;border:2px solid #F5F5F5;box-shadow:0 10px 20px hsl(270 0% 0% / .2);overflow:hidden;z-index:1;will-change:transform}#loading{z-index:-1;content:"";position:absolute;inset:0;background:url(../assets/loading_pixel.gif) no-repeat center center;background-size:70px;margin:auto}#project-media.flex{animation:flex .45s ease-in-out}#project-media video,#project-media iframe{margin:auto;display:block;width:100%;min-height:40vw;height:auto;overflow:hidden;cursor:pointer}#project-media iframe{aspect-ratio:16 / 9;will-change:transform}#project-media iframe video{overflow:hidden;border-radius:inherit;height:100%}div#image-overlay{border-radius:50px}#project-info{margin:1em 5%;cursor:default}#project-info article{margin-top:2em;max-width:960px}#project-info article p{margin-bottom:1em}#project-info h4{margin-top:2em;margin-bottom:.3em}#project-info a{padding:.3em .8em .3em .2em;;border-radius:3em;color:inherit;white-space:nowrap}#project-info span.link-icon{position:relative;display:inline-block;vertical-align:middle;width:1.6em;height:100%;margin-right:.5em}.link-icon img{position:absolute;display:inline-block;inset:0;margin:auto;width:100%;top:-3px;box-sizing:border-box;border-radius:1em}#project-title p:first-child,#project-info h4{font-weight:600;opacity:.75}#project-title h3{font-weight:600;font-size:1.6em}#project-title a{background-color:hsl(0 0% 95%);line-height:2.7em}#project-credits section{display:none}#project-credits section.visible{display:block}#project-credits li{margin-bottom:.7em}#project-credits p{display:inline}#project-credits p span{display:inline-block;padding-right:.3em;white-space:nowrap}#project-credits .name{white-space:nowrap}#project-credits a{border:1px solid hsl(239 5% 17% / .7)}body.noscroll{overflow-y:hidden}body.noscroll header::after{transition:opacity var(--transition-duration) ease-out;opacity:1}body.noscroll header h1 a::before{transition:opacity var(--transition-duration) ease-in-out;opacity:1}body.noscroll header h1:active{pointer-events:none}body.noscroll nav{transition:opacity var(--transition-duration) ease-out;opacity:0;pointer-events:none}body.noscroll #project-display{transform:translateX(-100lvw);opacity:1;transition:transform 0s ease-in-out,opacity var(--transition-duration) ease-in-out}body.noscroll #close-project-display{transform:translateY(0);pointer-events:auto;opacity:1}@keyframes bounce{0%{transform:scale(1)}20%{transform:scale(1.025)}30%{transform:scale(.97)}60%{transform:scale(1.01)}65%{transform:scale(.99)}100%{transform:scale(1)}}@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-200%)}}@keyframes breathe{from{transform:scale(.95)}to{transform:scale(1.02)}}@keyframes vertical{from{transform:translateY(calc(-1 * var(--y-offset)))}to{transform:translateY(var(--y-offset))}}@keyframes horizontal{from{transform:translateX(calc(-1 * var(--x-offset)))}to{transform:translateX(var(--x-offset))}}@keyframes flex{0%{transform:scale(.96)}20%{transform:scale(1.01)}40%{transform:scale(.98)}70%{transform:scale(1.01)}90%{transform:scale(.995)}100%{transform:scale(1)}}@keyframes wiggle-left{0%{transform:translateX(105%)}20%{transform:translateX(-7%)}40%{transform:translateX(5%)}60%{transform:translateX(-3%)}80%{transform:translateX(1%)}90%{transform:translateX(-.5%)}97%{transform:translateX(.2%)}100%{transform:translateX(0)}}@media (max-width:1280px){#welcome h2{text-align:left;white-space:pre-line;padding:0 40px;font-size:clamp(2em, 14vw, 7em);top:auto;transform:translateY(0);bottom:2.5%}#unmute-banner{right:1.3em;bottom:auto;top:3.8em}#unmute-banner span{width:4.5em}#unmute-banner span::before{width:4em;height:4em}#studio-intro{padding:0 40px;display:inline-block}#studio-intro p{font-size:clamp(1.3em, 2.4vw, 1.5em);text-align:left;margin:0;line-height:1.7em}#studio-intro .nowrap{display:block}#studio-intro .line:nth-child(2)::after{content:" ";white-space:normal}#studio-intro .line:nth-child(1)::after{content:"\a";white-space:pre}#work-vignettes ul{grid-auto-rows:40lvw}#work-vignettes li:nth-child(4){grid-area:2 / 1 / 3 / 8}#work-vignettes li:nth-child(5){grid-area:2 / 8 / 3 / 14}#work-vignettes li:nth-child(6){grid-area:3 / 7/ 4 / 14}#work-vignettes li:nth-child(7){grid-area:3 / 1 / 4 / 7}#work-vignettes li:nth-child(8){grid-area:4 / 1 / 5 / 9}#work-vignettes li:nth-child(9){grid-area:4 / 9 / 5 / 14}#work-vignettes li:nth-child(10){grid-area:5 / 1 / 6 / 8}#work-vignettes li:nth-child(11){grid-area:5 / 8 / 6 / 14}#work-vignettes li:nth-child(14){grid-area:6 / 1 / 7 / 9}#work-vignettes li:nth-child(15){grid-area:6 / 9 / 7 / 14}#work-vignettes li:nth-child(12){grid-area:7 / 7 / 8 / 14}#work-vignettes li:nth-child(13){grid-area:7 / 1 / 8 / 7}#work-vignettes li:nth-child(16){grid-area:8 / 1 / 9 / 6}#work-vignettes li:nth-child(17){grid-area:8 / 6 / 9 / 14}#work-vignettes li:nth-child(18){grid-area:9 / 1 / 10 / 8}#work-vignettes li:nth-child(20){grid-area:9 / 8 / 10 / 14}#work-vignettes li:nth-child(19){grid-area:10 / 1 / 11 / 7}#work-vignettes li:nth-child(21){grid-area:10 / 7 / 11 / 14}.work-info{row-gap:.5em;line-height:1.8em;font-size:clamp(.8em, 1.5vw, 1em)}#project-content-wrapper{width:100%;box-sizing:border-box;padding:0 3em}#project-media{position:relative;border-radius:40px}#project-media video{min-height:40vw;max-height:60vw}#project-media img{position:absolute;width:100%;height:100%;object-fit:cover;top:0;left:0}section#contact{grid-template-rows:minmax(40lvw,40lvh) auto;font-size:1.1em}}@media (max-width:862px){header{grid-template-columns:1fr;grid-template-rows:44px 44px;row-gap:8px;padding:10px 0;justify-content:center}header::before{transition:transform .3s ease-out;height:116px}header::after{transition:opacity .3s ease-out,transform .3s ease-out}header h1{margin:auto}header h1 a::before{transition:opacity .3s ease-out}nav{max-width:420px;margin:auto;transition:opacity .3s ease-out var(--transition-duration)}nav ul{margin:auto}nav ul li a span{line-height:44px}#close-project-display svg{width:36px;height:36px}#content>section{min-height:490px}#welcome{height:calc(50lvh - 63px);scroll-margin:116px}#welcome h2{font-size:clamp(2em, 13vw, 4.5em);padding:0 30px;bottom:.2em}#play-banner span{font-size:.95em}#play-banner span::before{width:4.5em;height:4.5em}#unmute-banner{right:1em;bottom:auto;top:3em}#unmute-banner span{width:4em}#unmute-banner span::before{width:3.5em;height:3.5em}#studio{height:calc(50lvh - 58px);scroll-margin:121px}#studio-intro{padding:0 30px}#studio-intro p{font-size:clamp(1em, 2.8vw, 1.2em)}#studio-backdrop-container img{height:calc(60lvh);min-height:640px;bottom:-90px}#brands-wrapper{bottom:16px}#brands-wrapper ul{padding:0 50px;grid-template-columns:repeat(17,100px);grid-column-gap:100px}section#selected-works{scroll-margin:116px}#work-vignettes ul{grid-template-columns:1fr;grid-auto-rows:50vw;grid-gap:3px}#work-vignettes li:nth-child(n){grid-area:auto}#work-vignettes li:nth-child(18) img{object-position:50% 80%}section#contact{scroll-margin:116px}#project-display{padding-top:0;transition:opacity .3s ease-out,transform 0s linear .3s;background-color:hsl(270 0% 100% / .5)}#project-content-wrapper{padding:0;margin-top:68px;margin-bottom:216px;transform:translateY(48px);transition:transform .3s ease-out}#project-media{border-radius:0;border:none}#project-media.flex{animation:none}section#contact{grid-template-rows:50vw auto;font-size:clamp(0.8em, 3.3vw, 1em)}#social>li>a{padding:21%}footer{font-size: .8em;}#contact-backdrop-container{margin:12px}body.noscroll header{pointer-events:none}body.noscroll header::after{transition:opacity var(--transition-duration) ease-out,transform .3s ease-out var(--transition-duration);transform:translateY(-50px)}body.noscroll header::before{transition:transform .3s ease-out var(--transition-duration);transform:translateY(-50px)}body.noscroll header h1 a::before{transition:opacity var(--transition-duration) ease-in-out}body.noscroll #project-display{transition:opacity .1s ease-out var(--transition-duration);transform:translateX(-100lvw);opacity:1}body.noscroll #project-content-wrapper{transition:transform .3s ease-out var(--transition-duration);transform:translateY(0)}body.noscroll #close-project-display{transform:translateY(-25px);height:66px}body.noscroll #close-project-display svg{right:1em}}@media (max-width:550px){#content>section{min-height:260px}nav ul,nav button[name="close"]{width:100%;height:100%;font-size:clamp(.9em, 5vw, 1em)}#play-banner span{font-size:.88em}#unmute-banner{bottom:auto;top:2em;right:.5em}#unmute-banner span{width:3em}#unmute-banner span::before{width:2.5em;height:2.5em}#welcome h2{padding:0 20px;bottom:3.5%}#studio-intro{padding:0 20px}#studio-intro p{font-size:clamp(.7em, 4.3vw, 1.4em)}#brands-wrapper{bottom:0}#brands-wrapper ul{padding:0 40px;grid-template-columns:repeat(17,80px);grid-column-gap:80px}#work-vignettes ul{grid-auto-rows:60vw}#work-vignettes li:nth-child(18) img{object-position:50% 100%}.work-info{background-color:hsl(0 0% 0% / .7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#project-info{font-size:.8em;line-height:1.8em}#project-title p:first-child{font-weight:600;opacity:.75;line-height:1.8em}#project-title h3{line-height:1.2em}#project-credits h4{margin-top:3em;margin-bottom:1em;line-height:1em}#project-credits li{margin-bottom:1.2em;line-height:2em}#project-credits .role::after{content:"\a";white-space:pre}#production-credits h4{margin-top:4em}section#contact{grid-template-rows:80vw auto}section#contact #myButton_10{font-size:1.2em}#contact .note{text-align:left}#contact .note p:first-child{margin-top:calc(1em + 20px)}#contact .note p{white-space:pre-line}#contact .note p:nth-child(3){margin-top:1em}#contact .note .nowrap{margin-bottom:5em}#social>li>a{padding:24%}}@media (max-width:360px){#welcome h2{padding:0 10px;bottom:3.5%}#studio-intro{padding:0 10px}#studio-intro p{white-space:normal}section#contact{font-size:clamp(0.7em, 4vw, 1em)}}