@import url(https://fonts.googleapis.com/css2?family=Questrial&display=swap);
/*!
 * Agate by Taufik Nurrohman <https://github.com/taufik-nurrohman>
 * ---------------------------------------------------------------
 *
 * #ade5fc
 * #a2fca2
 * #c6b4f0
 * #d36363
 * #fcc28c
 * #fc9b9b
 * #ffa
 * #fff
 * #333
 * #62c8f3
 * #888
 *
 */.hljs{display:block;overflow-x:auto;padding:0.5em;background:#333;color:white}.hljs-name,.hljs-strong{font-weight:bold}.hljs-code,.hljs-emphasis{font-style:italic}.hljs-tag{color:#62c8f3}.hljs-variable,.hljs-template-variable,.hljs-selector-id,.hljs-selector-class{color:#ade5fc}.hljs-string,.hljs-bullet{color:#a2fca2}.hljs-type,.hljs-title,.hljs-section,.hljs-attribute,.hljs-quote,.hljs-built_in,.hljs-builtin-name{color:#ffa}.hljs-number,.hljs-symbol,.hljs-bullet{color:#d36363}.hljs-keyword,.hljs-selector-tag,.hljs-literal{color:#fcc28c}.hljs-comment,.hljs-deletion,.hljs-code{color:#888}.hljs-regexp,.hljs-link{color:#c6b4f0}.hljs-meta{color:#fc9b9b}.hljs-deletion{background-color:#fc9b9b;color:#333}.hljs-addition{background-color:#a2fca2;color:#333}.hljs a{color:inherit}.hljs a:focus,.hljs a:hover{color:inherit;text-decoration:underline}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}*:focus{outline:0}body{margin:0;-webkit-backface-visibility:hidden}button{-webkit-appearance:none;-moz-appearance:none;background:transparent;padding:0;border:0;line-height:1}fieldset{border:0;padding:0;margin:0}img{display:inline-block;vertical-align:middle}legend{max-width:100%}select{width:100%}textarea{height:auto;min-height:rem-calc(80)}a,a:link,a:visited,a:hover,a:active{color:unset;text-decoration:none;font-weight:normal}@media print{*{box-shadow:none !important}h1,h2,h3,h4,h5,h6{page-break-after:avoid}tr,img{page-break-inside:avoid}img{max-width:100% !important}.show-for-print{display:block !important}.hide-for-print{display:none !important}table.show-for-print{display:table !important}thead.show-for-print{display:table-header-group !important}tbody.show-for-print{display:table-row-group !important}tr.show-for-print{display:table-row !important}td.show-for-print{display:table-cell !important}th.show-for-print{display:table-cell !important}pre,blockquote{border:1px solid #8a8a8a;page-break-inside:avoid}}body{background-color:black;color:#ffffff}#container{height:100%;width:100%}#root{height:100%;width:100%}.spacer{height:90vh}.grecaptcha-badge{opacity:0}.secret{margin-top:100px}.lock-footer{position:fixed;overflow-y:scroll;bottom:0}.html3d{backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;width:100%;height:100%}.html3d-element{width:100%;height:100%;overflow:hidden;pointer-events:all}body{font-family:'Roboto', sans-serif;color:#ffffff}body h1,body h2,body h3,body h4,body h5,body h6{margin:0}body h1{font-size:89px}body h2{font-size:55px}body h3{font-size:34px}body h4{font-size:21px}body h5{font-size:13px}body h6{font-size:13px}@media (max-width: 768px){body h1{font-size:55px}body h2{font-size:34px}body h3{font-size:21px}body h4{font-size:13px}body h5{font-size:13px}body h6{font-size:13px}}@media (max-width: 480px){body h1{font-size:48px}}body .code{background-color:#242627;font-family:'Roboto Mono', monospace;color:#ffffff}body .accent{color:#ea3745}body .serif{font-family:'Roboto Slab', serif}body .monospace{font-family:monospace}.header{-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;height:calc(100vh - 41px);-webkit-box-pack:center;justify-content:center;position:relative;overflow:hidden;background-color:#000;background-image:url(/dist/7d577dc2d4b08902e76bd4e72514ba6d.jpg);background-size:cover;background-repeat:no-repeat;background-position:center}.header__video{position:absolute;top:50%;left:50%;height:100%;width:177.77777778vh;min-width:100%;min-height:56.25vw;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.header__content{-webkit-box-align:center;align-items:center;mix-blend-mode:overlay;text-align:center}.header__scroll-arrow{position:absolute;bottom:15%}.header__scroll-arrow__icon{-webkit-animation:moveUpDown 1s linear infinite;animation:moveUpDown 1s linear infinite;position:relative}@-webkit-keyframes moveUpDown{0%,100%{top:0}50%{top:10px}}@keyframes moveUpDown{0%,100%{top:0}50%{top:10px}}.html3d{position:fixed;top:0;left:0;height:100%;width:100%;pointer-events:none}#canvas-container{position:fixed;top:0;left:0;height:100%;width:100%}iframe{border:none}.debug{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;flex-wrap:wrap;position:fixed;right:0;top:42px;background-color:#202023;padding:0.5rem 0 0.5rem 0;max-width:500px;pointer-events:all;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:monospace;font-size:12px;padding:0.5rem}.debug pre{margin:0}.debug__section{display:-webkit-box;display:flex;-webkit-box-flex:0;flex:0 1 100%;padding:0.5rem 1rem 0.5rem 1rem}.debug hr{width:100%;border-top:1px solid #0D0D0F;border-bottom:1px solid #2C302C;border-right:none;border-left:none}#debugCanvas{width:100%;height:100%;position:absolute;z-index:1;top:0;pointer-events:none}.loading-screen{-webkit-box-align:center;align-items:center;background-color:black;display:-webkit-box;display:flex;height:100%;width:100%;-webkit-box-pack:center;justify-content:center;position:fixed;pointer-events:none;opacity:0;-webkit-transition:all 0.5s;transition:all 0.5s}.loading-screen--show{opacity:1;-webkit-transition:none;transition:none}.loading-screen .loader{border:8px solid transparent;border-bottom:8px solid #fff;border-top:8px solid #fff;border-radius:50%;width:60px;height:60px;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.section__simulation{-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;height:120vh;-webkit-box-pack:center;justify-content:center;position:relative;font-family:monospace;pointer-events:none}.section__simulation__content{position:relative;top:4rem}.controls{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;flex-wrap:wrap;position:absolute;right:0;top:42px;background-color:#202023;padding:0.5rem 0 0.5rem 0;max-width:300px;pointer-events:all;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.controls__toggle{cursor:pointer}.controls__section{display:-webkit-box;display:flex;-webkit-box-flex:0;flex:0 1 100%;padding:0.5rem 1rem 0.5rem 1rem}.controls__label{color:#C4C8D4;width:80px}.controls__input{-webkit-box-flex:1;flex-grow:1}.controls hr{width:100%;border-top:1px solid #0D0D0F;border-bottom:1px solid #2C302C;border-right:none;border-left:none}.controls input{width:100%}.controls input[type="range"]{-webkit-appearance:none;cursor:ew-resize;background-color:transparent}.controls input[type="range"]:focus{outline:none}.controls input[type="range"]::-webkit-slider-runnable-track{background:#A5A9B3;height:5px}.controls input[type="range"]::-moz-range-track{background:#A5A9B3;height:5px}.controls input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;height:15px;width:15px;background:#C4C8D4;margin-top:-5px;border-radius:50%;-webkit-transition:all 0.5s;transition:all 0.5s}.controls input[type="range"]::-moz-range-thumb{height:15px;width:15px;background:#C4C8D4;margin-top:-5px;border-radius:50%}.controls button{background-color:#2b303b;border:none;color:white;padding:0.5rem 1.5rem;text-align:center;text-decoration:none;display:inline-block;font-family:monospace}.navigation{z-index:1;height:42px;position:-webkit-sticky;position:sticky;top:0;color:#222222;background-color:#ffffff}.navigation__bar{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between}.navigation__scroll{height:100%;position:absolute;top:0px;width:100%;pointer-events:none}.navigation__logo{font-family:'Questrial', sans-serif;white-space:nowrap;font-size:28px;line-height:42px;padding:0 1rem 0 0.5rem}.navigation__logo__desktop{display:block}.navigation__logo__mobile{display:none}.navigation__inverted{color:#ffffff}.navigation__link{margin-right:32px;font-size:18px;line-height:42px;cursor:pointer;text-transform:uppercase}@media (max-width: 768px){.navigation__link{margin-right:18px;font-size:14px}}@media (max-width: 480px){.navigation__logo__desktop{display:none}.navigation__logo__mobile{display:block}}.scroll-progress{background-color:#101010}.placeholder{-webkit-box-align:center;align-items:center;background-image:url(/dist/bf24215fbeb1eb5d39ba4fff91ad5b69.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;display:-webkit-box;display:flex;height:120vh;-webkit-box-pack:center;justify-content:center;position:relative}.about{-webkit-box-align:center;align-items:center;background-image:url(/dist/c3a4ee598a1d4815dc320c841d3adc56.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;background-position:37% 50%;display:-webkit-box;display:flex;height:100vh;-webkit-box-pack:center;justify-content:center;position:relative}.about__content{position:absolute;bottom:0;padding:0 30% 0 2rem;background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(#000));background-image:linear-gradient(rgba(0,0,0,0), #000)}.about__social{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;width:100px;padding:1rem}@media (max-width: 768px){.about__content{padding:0 1rem}}.portfolio{-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;position:relative}.portfolio__content{width:100%}.portfolio__title{background-color:black;text-align:right;padding-right:2rem;padding-top:42px}.portfolio__grid{display:-webkit-box;display:flex;width:auto}.portfolio__column{background-clip:padding-box}.portfolio__item{background:black;width:100%}.portfolio__image{width:100%}.portfolio__card{position:relative}.portfolio__card__thumbnail{width:100%}.portfolio__card__video{position:absolute;height:100%;width:100%;top:0;left:0;right:0;bottom:0;background-color:black;visibility:hidden}.portfolio__card__video--show{visibility:visible}.contact{-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;min-height:100vh;-webkit-box-pack:center;justify-content:center;position:relative;margin-top:100px;color:#000;overflow:hidden}.contact__video{position:absolute;top:50%;left:50%;height:100%;width:177.77777778vh;min-width:100%;min-height:56.25vw;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.contact__content{padding:1.5rem 10%;max-width:1000px;z-index:1}.contact__title{padding-bottom:2rem;max-width:1000px;white-space:nowrap}.contact__submitted{padding:2rem;pointer-events:all;background-color:rgba(255,255,255,0.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:4px;box-shadow:0px 0px 4px rgba(0,0,0,0.25);text-align:center;line-height:70px}.contact__form{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;flex-wrap:wrap;padding:2rem;pointer-events:all;background-color:rgba(255,255,255,0.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:4px;box-shadow:0px 0px 4px rgba(0,0,0,0.25)}.contact__form--error{color:#f00;padding:4px;font-size:14px;width:100%}.contact__form__section{display:-webkit-box;display:flex;flex-wrap:wrap;-webkit-box-flex:0;flex:0 1 100%;padding-top:1rem}.contact__form__input input,.contact__form__input textarea{font-family:'Roboto', sans-serif;font-size:1rem;width:100%;border-radius:4px;border:1px solid #BDBDBD;padding:16px 10px 4px 10px;color:#000;line-height:24px}.contact__form__input input:-webkit-autofill,.contact__form__input input:-webkit-autofill:hover,.contact__form__input input:-webkit-autofill:focus,.contact__form__input input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 30px white inset !important}.contact__form__input label{position:absolute;color:#757575;margin-left:6px;margin-top:4px;padding:0 4px;font-size:12px}.contact__form button{background-color:#2b303b;border:none;color:white;text-align:center;text-decoration:none;display:inline-block;border-radius:4px;font-size:1rem;padding:12px 21px}.contact__form__agreement{-webkit-box-align:center;align-items:center}.contact__form__agreement label{font-size:14px;line-height:14px;padding-left:10px}