html{-webkit-text-size-adjust:100%}html:focus-within{scroll-behavior:smooth}body{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;min-height:100vh;position:relative;text-rendering:optimizeSpeed;width:100%}*,:after,:before{box-sizing:border-box}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:baseline}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}input,input:required{box-shadow:none}input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{-webkit-box-shadow:inset 0 0 0 30px #fff}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none}input[type=search]{-webkit-appearance:none;-moz-appearance:none}input:focus{outline:none}audio,canvas,video{display:inline-block;max-width:100%}audio:not([controls]){display:none;height:0}[hidden]{display:none}a:active,a:hover{outline:none}img{height:auto;max-width:100%;vertical-align:middle}img,picture{display:inline-block}button,input{line-height:normal}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;background:transparent;border:0;cursor:pointer}button[disabled],html input[disabled]{cursor:default}[disabled]{pointer-events:none}input[type=checkbox],input[type=radio]{padding:0}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}button{background:transparent;border:0}textarea{overflow:auto;resize:vertical;vertical-align:top}table{border-collapse:collapse;border-spacing:0;text-indent:0}hr{background:#000;border:0;box-sizing:content-box;height:1px;line-height:0;margin:0;overflow:visible;padding:0;page-break-after:always;width:100%}pre{font-family:monospace,monospace;font-size:100%}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:none}code,kbd,pre,samp{font-family:monospace,monospace}small,sub,sup{font-size:75%}sub,sup{line-height:0;position:relative;vertical-align:baseline}sub{bottom:-5px}sup{top:-5px}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1;margin:0;padding:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;outline:0;padding:0}legend{border:0;color:inherit;display:block;max-width:100%;white-space:normal;width:100%}fieldset{min-width:0}body:not(:-moz-handler-blocked) fieldset{display:block}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}template{display:none}:root{padding:0;--font-base: "Akshar";--font-heading: "Akshar";--weight-light: 300;--weight-regular: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--color-white: #d7d2d2;--color-black: #1d1c1c;--color-very-light-grey: #f2f2f2;--color-light-grey: #D8D8D8;--color-grey: #6E6A69;--color-dark-grey: #333333;--color-very-dark-grey: #404040;--color-medium-grey: #999999;--color-orange-1: #fb5401;--color-orange-2: #fa9469;--color-blue-1: #73e495;--color-primary: var(--color-blue-1);--color-secondary: var(--color-orange-2);--color-background: var(--color-black);--color-text-default: var(--color-white);--color-border-default: var(--color-very-dark-grey);--color-border-green: var(--color-orange-1);--color-highlight: var(--color-orange-1);--overlay-color: rgba(0, 0, 0, .7);--box-shadow: 0 10px 10px rgba(0, 0, 0, .1);--font-size-default: 2.1rem;--font-size-medium: 1.8rem;--font-size-small: 1.6rem;--font-size-xsmall: 1.1rem;--font-size-large: 3rem;--font-size-h1: 2.8rem;--font-size-h2: 9rem;--font-size-h3: 3.5rem;--font-size-label: var(--font-size-medium);--font-size-figcaption: var(--font-size-xsmall);--line-height-default: 1.5;--line-height-medium: 1.4;--line-height-small: 1.3;--line-height-xsmall: 1.25;--line-height-headline: 1.2;--line-height-label: var(--line-height-medium);--line-height-figcaption: var(--line-height-xsmall);--space-headline: 24px;--space: 20px;--space-big: 60px;--header-height: 50px;--container: 1000px;--container-padding: 20px;--section-padding: var(--_section-padding, 100px);--col-section-padding-outer: 50px;--col-section-padding-inner: 50px;--z-index-header: 100;--z-index-nav-overlay: 99;--z-index-nav: 101}@media (min-width: 768px){:root{--font-size-h1: 5.5rem;--font-size-h2: 9rem;--font-size-h3: 5rem;--font-size-large: 4.5rem}}@media (min-width: 1140px){:root{--container: 1000px}}@media (min-width: 1440px){:root{--container: 1200px}}@font-face{font-family:Akshar;src:url(/portfolio/assets/akshar-variable-DkRJx13G.woff2) format("woff2");font-style:normal;font-display:swap}.h1{font-family:var(--font-heading);font-size:var(--font-size-h1);line-height:var(--line-height-headline);font-weight:var(--weight-semibold);margin-bottom:var(--space-headline);text-transform:uppercase}.random-projects__headline,.project__headline,.about-me__headline,.hero__headline,.hero__headline-hello,.footer__headline,.h2{font-family:var(--font-heading);font-size:var(--font-size-h2);line-height:var(--line-height-headline);margin-bottom:var(--space-headline);text-transform:uppercase;color:var(--color-primary);line-height:.8}.random-projects__headline span,.project__headline span,.about-me__headline span,.hero__headline span,.hero__headline-hello span,.footer__headline span,.h2 span{font-weight:var(--weight-regular);display:block}.random-projects__text,.about-me__col--content h3,.popup__content-headline,.h3{font-family:var(--font-heading);font-size:var(--font-size-h3);line-height:var(--line-height-headline);margin-bottom:var(--space-headline)}.text-default{font-family:var(--font-base);font-size:var(--font-size-default);line-height:var(--line-height-default);font-weight:var(--weight-light)}.text-small{font-family:var(--font-base);font-weight:var(--weight-light);font-size:var(--font-size-small);line-height:var(--line-height-small)}a{cursor:pointer;color:var(--color-text-default);text-decoration:none;font-family:var(--font-base);font-weight:var(--weight-light)}a:hover,a:focus,a:active{text-decoration:underline}@keyframes headlineGrowth{0%{font-variation-settings:"wght" 700,"wdth" 100,"slnt" 0}60%{font-variation-settings:"wght" 100,"wdth" 10,"slnt" 12}to{font-variation-settings:"wght" 600,"wdth" 100,"slnt" 0}}@keyframes headlineShrink{0%{font-variation-settings:"wght" 100,"wdth" 10 ", opsz" 144}60%{font-variation-settings:"wght" 700,"wdth" 100,"opsz" 8}to{font-variation-settings:"wght" 100,"wdth" 10,"opsz" 144}}.headline-will-animate{font-variation-settings:"wght" 300,"wdth" 10,"GRAD" 88;transition:all 1.5s cubic-bezier(.68,-.55,.27,1.55)}.headline-will-animate span{font-variation-settings:"wght" 700,"wdth" 90;transition:all 1.5s cubic-bezier(.68,-.55,.27,1.55) .3s}.headline-will-animate:before{font-variation-settings:"wght" 700,"wdth" 90,"GRAD" 150}.headline-will-animate.in-view{font-variation-settings:"wght" 700,"wdth" 90,"GRAD" 150}.headline-will-animate.in-view span{font-variation-settings:"wght" 300,"wdth" 10}.headline-will-animate.in-view:before{font-variation-settings:"wght" 700,"wdth" 90,"GRAD" 150}.about-me__button,.button{display:flex;align-items:center;justify-content:center;border-radius:50px;padding:0 15px;height:50px;background-color:var(--color-light-grey);border:2px solid var(--color-light-grey);color:var(--color-black);font-size:var(--font-size-small);text-transform:uppercase;transition:all .3s ease;cursor:pointer}.about-me__button:hover,.button:hover{background-color:var(--color-black);border:2px solid var(--color-black);color:var(--color-light-grey)}.popup__close{display:flex;align-items:center;justify-content:center;border-radius:50px;padding:0 15px;height:50px;background-color:#ffffff4d;border:2px solid var(--color-primary);color:var(--color-dark-grey);font-size:var(--font-size-small);text-transform:uppercase;transition:all .3s ease;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.popup__close:hover{box-shadow:0 0 10px 0 var(--color-primary) inset,0 0 20px 2px var(--color-primary);border:2px solid var(--color-primary)}.footer__audio-toggle,.motivation__button,.back-to-top{display:flex;align-items:center;justify-content:center;border-radius:50px;padding:0 15px;height:50px;background-color:var(--color-black);border:2px solid var(--color-primary);color:var(--color-light-grey);font-size:var(--font-size-small);text-transform:uppercase;transition:all .3s ease;cursor:pointer}.footer__audio-toggle:hover,.motivation__button:hover,.back-to-top:hover{box-shadow:0 0 10px 0 var(--color-primary) inset,0 0 20px 2px var(--color-primary);border:2px solid var(--color-primary)}.back-to-top{position:fixed;right:20px;bottom:20px;opacity:0;pointer-events:none;z-index:12}.page-is-scrolled:not(.fullscreen) .back-to-top{opacity:1;pointer-events:all}:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{scroll-behavior:smooth;font-size:62.5%}body{background:var(--color-black);color:var(--color-text-default);overflow-x:clip;font-family:var(--font-base);font-weight:var(--weight-light);font-size:var(--font-size-default);line-height:var(--line-height-default);font-style:normal;min-height:100vh}body.fullscreen{overflow:hidden}:target{scroll-margin-top:calc(var(--header-height) + 20px)}::selection{background:var(--color-black);color:var(--color-white)}.main{margin:0 auto;width:100%;overflow:clip;pointer-events:all}.fullscreen .main{pointer-events:none}.main__bg-image{position:fixed;top:0;z-index:12;min-width:100vw;min-height:100vh;background-repeat:no-repeat;background-size:cover;background-position:center;mix-blend-mode:difference;pointer-events:none;opacity:0}@media (min-width: 1440px){.main__bg-image{opacity:.3}}.hide-canvas .main__bg-image{z-index:12}.fullscreen .main__bg-image{z-index:0}.main .bg-image{position:absolute;bottom:0;z-index:1;max-width:calc(100vw - 100px);background-repeat:no-repeat;background-size:contain;background-position:center;transition:all 1.5s ease .3s;width:500px;height:250px}@media (min-width: 1440px){.main .bg-image{width:400px;height:300px}}.motivation,.header__container{max-width:100%;margin:0 auto;padding:var(--container-padding);width:var(--container)}.header{position:fixed;height:var(--header-height);top:0;right:0;left:0;background-color:transparent;z-index:var(--z-index-header);transition:all .3s ease;mix-blend-mode:difference;pointer-events:none}.header__container{padding:0;display:flex;align-items:center;justify-content:center;height:100%}.nav{height:100%;pointer-events:all}.nav__list{display:flex;gap:10px;width:calc(100% - 20px);height:100%;align-items:center;justify-content:center}@media (min-width: 768px){.nav__list{width:768px}}@media (min-width: 1440px){.nav__list{gap:20px}}.nav__list-item{flex:1;display:flex;justify-content:center}@media (min-width: 768px){.nav__list-item{flex:none}}.nav__link{color:var(--color-light-grey);text-transform:uppercase;font-weight:700;font-size:var(--font-size-xsmall);display:flex;text-align:center}.footer{padding:0 10px 20px;color:var(--color-white);z-index:11;overflow-x:clip;position:relative}@media (min-width: 768px){.footer{display:flex;flex-direction:column;justify-content:space-between;max-width:700px;margin-left:auto;margin-right:auto}}@media (min-width: 1140px){.footer{padding:0 var(--section-padding) var(--section-padding)}}@media (min-width: 1440px){.footer{max-width:1200px}}.footer__headline{text-align:left;text-wrap:balance;max-width:1000px;margin:0 auto 0 0;position:relative}@media (min-width: 1440px){.footer__headline{max-width:unset;margin:unset;min-width:400px}}.footer__headline:before{content:"Play your own song...";font-size:var(--font-size-medium);font-weight:700;text-align:right;position:absolute;background-color:var(--color-light-grey);color:var(--color-black);padding:10px;mix-blend-mode:difference;left:0;bottom:-43px;max-width:250px}.footer__zettel-list{display:flex;justify-content:center;height:230px;position:relative}.footer__zettel-list-item{width:40px;height:100%;position:relative;font-size:0;border-color:var(--color-light-grey);border-style:solid dashed dashed hidden;border-width:2px;cursor:pointer;transform:scale(1);transition:all .3s ease}@media (min-width: 768px){.footer__zettel-list-item{width:50px}}.footer__zettel-list-item:first-of-type{border-style:solid dashed dashed dashed}.footer__zettel-list-item:hover{transform:translateY(5px) scale(1.05);border-color:var(--color-primary);border-style:solid;box-shadow:0 0 10px 0 var(--color-primary) inset,0 0 20px 2px var(--color-primary)}.footer__zettel-list-item:before{content:attr(data-text);font-size:16px;font-weight:400;position:absolute;top:50%;left:50%;white-space:nowrap;transform:translate(-50%,-50%) rotate(90deg)}.footer__audio-toggle{position:absolute;height:50px;right:15px}@media (min-width: 768px){.footer__audio-toggle{right:unset;left:50%;transform:translate(calc(-50% + 170px))}}@media (min-width: 1440px){.footer__audio-toggle{transform:translate(calc(-50% + 200px))}}.footer__audio-toggle:after{content:"";position:absolute;width:25px;height:2px;background-color:red;transform:rotate(45deg);opacity:0}.footer__audio-toggle.sound-is-off:after{opacity:1}.footer__link-list{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;flex-direction:column;gap:20px}@media (min-width: 768px){.footer__link-list{flex-direction:row}}@media (min-width: 768px){.footer__link-list-item{margin-right:20px}}.footer__top,.footer__bottom{padding:15px 0;display:flex;flex-direction:column}@media (min-width: 768px){.footer__top,.footer__bottom{padding:15px}}@media (min-width: 1440px){.footer__top{flex-direction:row;justify-content:center;align-items:flex-start;gap:50px}}@media (min-width: 1440px){.footer__face-wrapper{margin-top:100px}}.footer__bottom{margin-top:90px;text-align:right;font-size:var(--font-size-small)}.popup__content{width:0;max-height:0;overflow:clip;pointer-events:none}.popup__content .link{color:var(--color-black);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--color-black);text-decoration-thickness:2px;transition:all .3s ease;font-weight:400}.popup__content .link:hover{text-underline-offset:6px;text-decoration-thickness:4px}.popup__content-headline span{text-transform:uppercase;font-weight:600}.popup__content-image{width:100%;max-width:900px;margin:50px auto}.popup__content-video{width:100%;margin:50px auto}.popup__content-text{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.popup__content-text p{max-width:600px}.popup__content-text p strong{font-weight:500}.popup__content-grid{display:flex;flex-wrap:wrap;gap:5px;margin:50px auto}.popup__content-grid.no-margin{margin:0 auto}.popup__content-grid.no-margin+video{margin-top:10px}.popup__content-grid.no-margin-top{margin-top:10px}.popup__content-grid video,.popup__content-grid img{flex:1;margin:0;width:calc(33% - 10px);height:auto;aspect-ratio:1/1}.popup--open .popup__content{z-index:100;position:absolute;background:#ffffff08;bottom:0;top:0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:calc(var(--header-height) + 10px) 20px 20px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;max-height:10000px;pointer-events:all}.popup--open.fullscreen .popup__content{color:var(--color-black);position:fixed;background:var(--color-light-grey);bottom:0;top:0;left:0;transition:all .5s ease;overflow:clip scroll;display:block}.popup--open.fullscreen .popup__content-inner{max-width:1200px;margin:0 auto}.popup--open.fullscreen .popup__close{position:sticky;top:0;z-index:1}.popup__close{margin:0 auto 20px 0}.face{margin:150px auto 30px;max-width:1000px;width:100%;height:100px;position:relative;display:flex;justify-content:space-between}.face:after,.face:before{content:"";background:var(--color-white);height:5px;width:50px;position:absolute;top:-30px;left:50%;z-index:1;border-radius:50px;transition:all .3s ease}.face:before{transform:translate(calc(-50% - 100px))}.face:after{transform:translate(calc(-50% + 100px))}.face.yes:before{transform:translate(calc(-50% - 140px),8px) rotate(-40deg)}.face.yes:after{transform:translate(calc(-50% + 140px),8px) rotate(40deg)}@keyframes browJumpRight{0%{transform:translate(calc(-50% + 100px))}to{transform:translate(calc(-50% + 100px),-10px)}}@keyframes browJumpLeft{0%{transform:translate(calc(-50% - 100px))}to{transform:translate(calc(-50% - 100px),-10px)}}.face.talk:before{transform:translate(calc(-50% - 100px));animation:browJumpLeft .5s infinite}.face.talk:after{transform:translate(calc(-50% - 100px));animation:browJumpRight .5s infinite}.face.maybe:before{width:30px;transform:translate(calc(-50% - 130px),15px) rotate(-35deg)}.face.maybe:after{width:30px;transform:translate(calc(-50% + 130px),15px) rotate(35deg)}.face.no:before{width:25px;transform:translate(calc(-50% - 35px)) rotate(60deg)}.face.no:after{width:25px;transform:translate(calc(-50% + 35px)) rotate(-60deg)}.face.no-shit:before{transform:translate(calc(-50% - 55px)) rotate(45deg)}.face.no-shit:after{transform:translate(calc(-50% + 55px)) rotate(-45deg)}.face__eye{width:100px;height:100px;background:var(--color-white);position:absolute;border-radius:50%;top:0;left:50%;transition:all .3s ease}.face__eye-pupil{position:absolute;width:50px;height:50px;border-radius:50%;background-color:var(--color-black);transition:all .3s ease;top:50%;left:50%;transform:translate(-50%,-50%)}.face__eye:not(.yes,.talk,.maybe,.no,.no-shit){clip-path:ellipse(50% 25% at 50% 50%)}.face__eye.maybe .face__eye-pupil{width:40px;height:40px;top:50%;left:50%;transform:translate(-50%,-50%)}.face__eye.maybe:before{content:"";position:absolute;background-color:var(--color-black);width:200px;height:50px;top:75px;left:-55px}.face__eye.no{width:100px;height:100px;border-radius:50%;top:-25px}.face__eye.no:before{content:"";position:absolute;background-color:var(--color-black);width:150px;height:50px;transform:rotate(-30deg);left:-55px}.face__eye.no .face__eye-pupil{width:30px;height:30px;top:0;left:50%;transform:translate(-50%,70px)}.face__eye.no-shit{height:50px;width:120px;border-radius:0;clip-path:polygon(0 18%,100% 57%,100% 100%,0% 100%)}.face__eye.no-shit .face__eye-pupil{left:auto;right:-10px;top:-5px;width:60px;height:60px;transform:translate(0);clip-path:inset(5px 5px 0 0)}.face__eye.no-shit .face__eye-pupil--right{left:-5px;right:auto;clip-path:inset(5px 0 0 5px)}.face__eye.yes{overflow:clip;width:90px}@keyframes scale{0%{transform:translate(-50%,-50%) rotate(360deg) scale(1)}to{transform:translate(-50%,-50%) rotate(0) scale(2)}}.face__eye.yes:after{content:"";width:20px;height:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--color-light-grey);border-radius:50%;opacity:.9;box-shadow:0 0 10px 10px var(--color-light-grey)}.face__eye.yes .face__eye-pupil{width:30px;height:30px;top:50%;left:50%;transform:translate(-50%,-50%) rotate(0);animation:scale 1.5s infinite;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);z-index:1}.face__eye--left{transform:translate(calc(-50% - 100px))}.face__eye--right{transform:translate(calc(-50% + 100px))}.face__eye--right.no:before{left:unset;right:unset;transform:rotate(30deg)}.face__eye--right.no:after{left:unset;right:50px;transform:rotate(0)}.face__eye--right.no-shit{clip-path:polygon(0 57%,100% 18%,100% 100%,0% 100%)}.playground{z-index:10;position:fixed;top:0;mix-blend-mode:difference;opacity:1;transition:opacity 1s ease}.hide-canvas .playground{opacity:.8}.motivation-in-view .playground{opacity:0;transition:opacity 2s ease}.gsap-marker-start,.gsap-marker-scroller-end,.gsap-marker-end,.gsap-marker-scroller-start{display:none!important;pointer-events:none!important}.motivation{position:relative;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:250px}@media (min-width: 1440px){.motivation{padding-bottom:300px}}.motivation__intro{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.motivation__text{font-size:var(--font-size-h3);text-align:center;margin-bottom:50px;max-width:100%;text-wrap:balance}@media (min-width: 768px){.motivation__text{max-width:800px}}.motivation__focus-hint{position:absolute;bottom:20px;transform:translateY(-60px) rotate(-90deg);padding-left:20px;font-size:var(--font-size-small);opacity:.6}.motivation__focus-hint:before{content:"^";transform:rotate(-90deg);display:inline-block}.motivation__button{margin-bottom:130px}@media (min-width: 768px){.motivation__popup-text{padding:100px}}.hero{overflow:clip;position:relative;width:100vw;height:100vh;min-height:1600px;z-index:11;mix-blend-mode:difference}.hero__overlay{position:fixed;top:0;right:0;left:0;height:100vh;z-index:1}.hero__overlay:before{content:"";background:#c93800;width:150vw;height:150vw;min-height:150vh;min-width:150vh;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);transition:transform 1.5s ease,background 1.5s ease;z-index:-1}.hero.in-view .hero__overlay:before{transform:translate(-50%,-50%) scale(0);opacity:1;transition:transform .7s ease}.hero.out-of-view .hero__overlay:before{transform:translate(-50%,-50%) scale(1);transition:transform 1.5s ease,opacity 1.5s ease}.motivation-in-view .hero .hero__overlay:before{transform:translate(-50%,-50%) scale(1);opacity:0;background:transparent;transition:opacity 2s ease}.hero__headline{font-size:4.5rem;color:var(--color-white)}@media (min-width: 768px){.hero__headline{font-size:9vw}}.hero__headline:before,.hero__headline:after{content:"^";position:absolute;bottom:20px;filter:blur(1px);font-size:8rem}.hero__headline:after{transform:translateY(-35px) scale(.8);filter:blur(3px)}.hero__headline,.hero__headline-hello{position:sticky;top:0;left:0;right:0;height:100vh;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease;font-weight:700;z-index:13}.hero__headline.hide,.hero__headline-hello.hide{opacity:0}.hero__headline-hello{position:fixed;font-size:7rem;color:var(--color-primary)}.hero__video{position:fixed;z-index:11;left:50%;top:0;transform:translate(-50%);width:100%;height:100vh;mix-blend-mode:difference;opacity:0;transition:opacity .5s ease;object-fit:cover}.hero__video.show{opacity:1}.hero__video--top{z-index:12}.hero__video-wrapper,.hero__video-wrapper2{position:fixed;width:100vw;height:100vh;mix-blend-mode:hard-light;pointer-events:none}.hero__video-wrapper2{background:#ff2b2b;z-index:14}.about-me{position:relative;width:100%;min-height:100vh;display:flex;flex-direction:column-reverse;align-items:center;z-index:11;max-width:1200px;margin-left:auto;margin-right:auto;padding-bottom:250px}@media (min-width: 1440px){.about-me{padding-bottom:300px;flex-direction:row;align-items:flex-start;justify-content:center}}.about-me__col{flex:1}@media (min-width: 1440px){.about-me__col{flex:unset}}.about-me__col--image{position:relative;width:400px;overflow:clip;aspect-ratio:3/4;max-height:100vh;max-width:calc(100% - 40px)}@media (min-width: 1440px){.about-me__col--image{position:sticky;margin:0 0 0 auto;top:100px;width:450px}}@keyframes size{0%{font-variation-settings:"wght" 100}to{font-variation-settings:"wght" 900}}.about-me__col--image:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;mix-blend-mode:difference;background-color:#f7f7f7;z-index:10;pointer-events:none;z-index:11;color:var(--color-light-grey)}.about-me__col--text{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;align-items:center;justify-content:center;z-index:13;font-family:var(--font-heading);font-weight:var(--weight-semibold);color:var(--color-black);font-size:20px;font-variation-settings:"wght" 900;text-transform:uppercase;--mask-size: 0;margin:auto;cursor:move;-webkit-mask-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/sun.svg);mask-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/sun.svg);-webkit-mask-size:var(--mask-size);mask-size:var(--mask-size);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-type:luminance;-webkit-mask-position-x:calc(var(--mouseX) * 1%);-webkit-mask-position-y:calc(var(--mouseY) * 1%);transition:mask-size .5s ease;mix-blend-mode:soft-light;filter:contrast(200%);text-align:center;line-height:1}.about-me__col--content{max-width:calc(100% - 20px)}@media (min-width: 1440px){.about-me__col--content{max-width:calc(100% - 40px);width:calc(100% - 500px)}}.about-me__col--content h3{text-transform:uppercase}.about-me__headline{text-align:right;margin-top:-10px;position:relative;z-index:1;transform:rotate(0);margin-bottom:100px;pointer-events:none}@media (min-width: 1440px){.about-me__headline{font-size:17rem;margin-right:-100px;margin-top:400px;mix-blend-mode:difference}}@media (min-width: 1440px){.about-me__headline:before{content:"hover me...";font-size:var(--font-size-medium);font-weight:700;text-align:right;position:absolute;background-color:var(--color-light-grey);color:var(--color-black);padding:10px;mix-blend-mode:difference;right:50px;bottom:-38px;max-width:250px}}.about-me__text .intro{text-align:center;margin-bottom:20px}@media (min-width: 1440px){.about-me__text .intro{text-align:right;width:90%}}.about-me__text h3{width:100%;text-align:center;margin-top:20px}@media (min-width: 1440px){.about-me__text h3{text-align:right;width:90%}}.about-me__text>div{position:relative;padding-left:0;padding-right:50px;padding-bottom:50px;width:50%;text-align:right}@media (min-width: 1440px){.about-me__text>div{text-align:right;width:90%}}.about-me__text>div:nth-of-type(2n){transform:translate(calc(100% - 2px));text-align:left;padding-left:50px;padding-right:0}.about-me__text>div:nth-of-type(2n):before{left:0;right:auto}.about-me__text>div:nth-of-type(2n):after{left:-4px}.about-me__text>div:nth-of-type(2n) .year{left:-25px;right:auto}@media (min-width: 1440px){.about-me__text>div:nth-of-type(2n){transform:translate(0);padding-left:0;padding-right:50px;padding-bottom:50px;text-align:right}.about-me__text>div:nth-of-type(2n):before{left:auto;right:0}.about-me__text>div:nth-of-type(2n):after{left:auto}.about-me__text>div:nth-of-type(2n) .year{left:auto;right:-50px}}.about-me__text>div:before,.about-me__text>div:after{content:"";background-color:var(--color-light-grey);position:absolute}.about-me__text>div:before{bottom:0;width:2px;top:5px;left:auto;right:0}.about-me__text>div:after{width:10px;height:10px;border-radius:50%;top:0;left:auto;right:-4px}.about-me__text>div .year{position:absolute;transform:rotate(90deg);top:45px;bottom:auto;left:auto;right:-25px;font-size:var(--font-size-small);line-height:1}@media (min-width: 1440px){.about-me__text>div .year{right:-50px}}.about-me__text>div .stuff{text-wrap:balance}@media (min-width: 1440px){.about-me__text>div .stuff{width:50%;margin-right:0;margin-left:auto}}.about-me__text>div .description{font-weight:300;font-size:var(--font-size-small);text-wrap:balance}.about-me__text>div .description span{display:block}@media (min-width: 1440px){.about-me__text>div .description{width:50%;margin-right:0;margin-left:auto}}.about-me__img{position:absolute;object-fit:cover;object-position:center;top:50%;left:50%;transform:translate(-50%,-50%);min-height:100%;min-width:100%}.about-me__img--2{--mask-size: 0;margin:auto;cursor:move;-webkit-mask-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/sun.svg);mask-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/sun.svg);-webkit-mask-size:var(--mask-size);mask-size:var(--mask-size);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-type:luminance;-webkit-mask-position-x:calc(var(--mouseX) * 1%);-webkit-mask-position-y:calc(var(--mouseY) * 1%);transition:mask-size .5s ease;z-index:12;filter:contrast(120%)}.about-me__img--1{pointer-events:none}.about-me__button{position:absolute;right:10px;bottom:calc(var(--font-size-h2) / 2);z-index:13}.about-me .popup--open .popup__content{background:#0006}.about-me .popup--open .popup__content p{font-size:14px}.project{min-height:100vh;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:12;max-width:1200px;margin-left:auto;margin-right:auto;padding-bottom:250px}@media (min-width: 1140px){.project{padding-bottom:300px}}.project__tiles{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(4,1fr);grid-column-gap:0px;grid-row-gap:100px}@media (min-width: 768px){.project__tiles{grid-row-gap:0}}.project__tile{position:relative;display:flex;justify-content:center;align-items:center}.project__headline{position:absolute;z-index:1;pointer-events:none;top:0;left:50%;transform:translate(-50%,-50%);width:calc(100vw - 40px);text-align:center;mix-blend-mode:difference;font-size:5.3rem}@media (min-width: 768px){.project__headline{top:50%;max-width:540px;font-size:5.3rem}}@media (min-width: 1140px){.project__headline{max-width:800px;font-size:8.3rem}}.project__tile-1 .project__headline,.project__tile-3 .project__headline{text-align:left}.project__tile-2 .project__headline,.project__tile-4 .project__headline{text-align:right}.project__button{overflow:clip;width:300px;height:300px;transform:scale(1);transition:transform .3s ease}@media (min-width: 768px){.project__button{width:400px;height:400px}}.project__button:hover{transform:scale(1.2)}.project__tile-2 .project__button{width:500px}.project__button .video,.project__button .image{object-fit:cover;width:100%;height:100%}.project__tile-1{grid-area:1/1/2/2}@media (min-width: 768px){.project__tile-1{margin-left:-200px}}.project__tile-2{grid-area:2/1/3/2}@media (min-width: 768px){.project__tile-2{margin-right:-200px;margin-top:-100px}}.project__tile-3{grid-area:3/1/4/2}@media (min-width: 768px){.project__tile-3{margin-top:-200px}}.project__tile-4{grid-area:4/1/5/2}@media (min-width: 768px){.project__tile-4{margin-right:-300px;margin-top:-300px}}.random-projects{width:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:11;margin-left:auto;margin-right:auto;padding-bottom:250px}@media (min-width: 1440px){.random-projects{padding-bottom:300px}}.random-projects__content{position:sticky;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;max-width:1200px;width:100%;padding:0 10px;top:100px;pointer-events:none;z-index:12;mix-blend-mode:difference}@media (min-width: 768px){.random-projects__content{top:147px;max-width:1000px}}@media (min-width: 1140px){.random-projects__content{max-width:1300px}}@media (min-width: 1440px){.random-projects__content{top:197px}}.random-projects__headline{text-align:left;margin-bottom:0;position:relative;font-size:16vw}@media (min-width: 768px){.random-projects__headline{font-size:10vw}}@media (min-width: 1440px){.random-projects__headline{font-size:17rem}}.random-projects__text{display:flex;flex-wrap:wrap;justify-content:center;width:100%;max-width:330px;margin:50px 0 100px;text-align:center;font-size:var(--font-size-large)}@media (min-width: 768px){.random-projects__text{max-width:610px;text-align:right}}@media (min-width: 1440px){.random-projects__text{max-width:770px;margin:100px 0}}.random-projects__items{display:flex;flex-wrap:wrap;justify-content:center;width:100%;max-width:330px;gap:10px;position:relative}@media (min-width: 768px){.random-projects__items{max-width:620px}}@media (min-width: 1140px){.random-projects__items{max-width:830px}}@media (min-width: 1440px){.random-projects__items{max-width:770px}}.random-projects__hint{position:absolute;font-size:var(--font-size-small);top:calc(var(--font-size-small) * -1 - 15px);cursor:default}.random-projects__hint:before{content:"i";width:calc(var(--font-size-small) + 5px);height:calc(var(--font-size-small) + 5px);background-color:var(--color-light-grey);display:inline-flex;align-items:center;justify-content:center;line-height:1;margin-right:10px;color:var(--color-black)}@media (min-width: 768px){.random-projects__hint{left:0}}.random-projects__hover-text{position:absolute;width:250px;max-width:0;max-height:0;color:var(--color-black);overflow:clip;z-index:12;width:160px;height:160px;top:50%;transform:translateY(-50%);left:100%;line-height:1.2;font-size:16px;pointer-events:none}.random-projects__hover-text span{font-weight:var(--weight-medium)}@media (min-width: 768px){.random-projects__hover-text{width:200px;height:200px}}@media (min-width: 1440px){.random-projects__hover-text{width:250px;height:250px}}@media (min-width: 768px){.random-projects__hover-text.third{left:-100%}}@media (min-width: 1140px){.random-projects__hover-text.third{left:100%}}@media (min-width: 1440px){.random-projects__hover-text.third{left:-100%}}@media (min-width: 1140px){.random-projects__hover-text.fourth{left:-100%}}@media (min-width: 1440px){.random-projects__hover-text.fourth{left:100%}}@media (min-width: 1440px){.random-projects__hover-text.fourth.third{left:-100%}}.random-projects__wrapper{width:160px;height:160px;position:relative;transform:scale(1);transition:transform .3s ease}@media (min-width: 768px){.random-projects__wrapper{width:200px;height:200px}}@media (min-width: 1440px){.random-projects__wrapper{width:250px;height:250px}}.random-projects__wrapper:hover{transform:scale(1.5);z-index:12}.random-projects__wrapper:hover .random-projects__hover-text{max-width:250px;max-height:250px;transform:translate(-38px,-50%) scale(.7);z-index:-1;padding:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff6;display:flex;align-items:flex-end}@media (min-width: 768px){.random-projects__wrapper:hover .random-projects__hover-text.third{transform:translate(38px,-50%) scale(.7)}}@media (min-width: 1140px){.random-projects__wrapper:hover .random-projects__hover-text.third{transform:translate(-38px,-50%) scale(.7)}}@media (min-width: 1440px){.random-projects__wrapper:hover .random-projects__hover-text.third{transform:translate(38px,-50%) scale(.7)}}@media (min-width: 1140px){.random-projects__wrapper:hover .random-projects__hover-text.fourth{transform:translate(38px,-50%) scale(.7)}}@media (min-width: 1440px){.random-projects__wrapper:hover .random-projects__hover-text.fourth{transform:translate(-38px,-50%) scale(.7)}}@media (min-width: 1440px){.random-projects__wrapper:hover .random-projects__hover-text.fourth.third{transform:translate(38px,-50%) scale(.7)}}.random-projects__video{width:100%;height:100%;aspect-ratio:1/1;overflow:clip;transition-timing-function:ease-out;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;z-index:1;object-fit:cover}.random-projects__description{background-color:var(--color-light-grey);padding:15px;color:var(--color-black)}