@viewport{orientation:portrait}html{width:100%;background-color:#0f0f0f;z-index:-10}.spinner{transform-origin:center;animation:spinner-a 2s linear infinite}.spinner circle{stroke-linecap:round;animation:spinner-b 1.5s ease-in-out infinite}@keyframes spinner-a{100%{transform:rotate(360deg)}}@keyframes spinner-b{0%{stroke-dasharray:0 150;stroke-dashoffset:0}47.5%{stroke-dasharray:42 150;stroke-dashoffset:-16}95%,100%{stroke-dasharray:42 150;stroke-dashoffset:-59}}body{position:relative;width:100%;z-index:1;margin:64px 0 0 0;overflow-x:hidden;overflow-y:scroll;color:#ddd;font-family:Arial, Helvetica, sans-serif;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;-webkit-overflow-scrolling:touch}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#000}::-webkit-scrollbar-thumb{background:#777;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#fff}:target{scroll-margin-top:128px}body.animating>.path>li.fill{transition:height 200ms}body.animating>.path>li>span{transition:border-color 200ms}body.animating>.background>div{transition:height 500ms}body.animating>section.active>.inner{transform:scale(1, 1)}body.animating>section>.inner{transform:scale(0.9, 0.9);transition:transform 200ms}body.animating>section#intro.active>.inner>h2{opacity:1}body.animating>section#intro>.inner>h2{opacity:0.2;transition:opacity 200ms}body.animating>section#what-we-do.active>ul>li>div{opacity:1}body.animating>section#what-we-do>ul>li>div{opacity:0.2;transition:opacity 200ms}body.animating>section#projects.active>div>div{opacity:1}body.animating>section#projects>div>div{transition:opacity 200ms;opacity:0.2}body.animating>section#technology.active>ul>li{opacity:1}body.animating>section#technology>ul>li{transition:opacity 200ms;opacity:0.2}body.animating>section#contacts.active>.inner>a{opacity:1}body.animating>section#contacts>.inner>a{transition:opacity 200ms;opacity:0.2}body>header{position:fixed;top:0;left:0;right:0;width:auto;height:64px;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5);z-index:1}body>header>h1{margin:0}body>header>h1>a.logo{float:left;line-height:64px;padding:0 32px;text-transform:uppercase;user-select:none;color:#fff;text-decoration:none;font-size:24px;font-weight:bold;font-style:italic}body>header>h1>a.logo:hover{background-color:rgba(255,255,255,0.05)}body>header>h1>a.logo>.right{color:#777}body>header>ul{float:right;list-style:none;margin:0;padding:0}body>header>ul>li{padding:0;margin:0;float:left}body>header>ul>li.contact>a{color:#000;background-color:#fff}body>header>ul>li.contact>a:hover{color:#fff;background-color:#000}body>header>ul>li>a{display:block;line-height:64px;padding:0 32px;color:#fff;text-decoration:none}body>header>ul>li>a:hover{background-color:rgba(255,255,255,0.05)}body>.path{position:fixed;right:32px;top:calc(50vh - 128px - 4px);height:calc(256px + 8px);width:2px;margin:0;padding:0;list-style:none;pointer-events:none;background-color:#444}body>.path>li{position:relative;width:8px;height:8px;margin:0 0 calc(256px / 4 - 8px) -2.5px;padding:0}body>.path>li:not(.active)>span{border-color:#444 !important}body>.path>li.fill{position:absolute;top:0;left:2.5px;width:2px;height:0%;background-color:#fff}body>.path>li:last-child{margin-bottom:0}body>.path>li>span{display:block;width:6px;height:6px;transform:rotate(45deg);background-color:#444;border:1px solid #444}body>.background{position:fixed;top:0;left:0;width:0vw;z-index:-1;pointer-events:none;overflow:hidden;transition:width 200ms}body>.background.loaded{width:100vw;transition:width 100ms}body>.background>div{width:100%;height:0vh}body>.background>div.active{height:100vh}body>section{margin:128px 128px 64px}body>section>h2{color:#aaa;margin:0 0 64px 0}body>section#intro{width:calc(100vw - 256px);min-height:60vh;display:table}body>section#intro>.inner{display:table-cell}body>section#intro>.inner>h2{display:inline-block;box-decoration-break:clone;margin:196px 128px 0;padding:0 48px;line-height:96px;font-size:64px;text-transform:uppercase;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.3);border-radius:16px;color:#fff;box-shadow:0px 0px 16px rgba(0,0,0,0.3)}body>section#intro>.inner>h2>span{white-space:nowrap}body>section#what-we-do>ul{list-style:none;margin:0 0 256px;padding:0}body>section#what-we-do>ul>li{position:relative;max-width:400px;margin:8px 0 32px;padding:0 32px;line-height:64px;border-radius:32px;cursor:pointer;color:#aaa;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>section#what-we-do>ul>li:hover{background-color:rgba(128,128,128,0.05)}body>section#what-we-do>ul>li.active{color:#fff;background-color:rgba(255,255,255,0.05);box-shadow:0px 0px 16px rgba(0,0,0,0.3)}body>section#what-we-do>ul>li.loaded>svg{display:none}body>section#what-we-do>ul>li>svg{position:absolute;top:20px;right:20px}body>section#what-we-do>ul>li>.arrow{position:absolute;left:48px;bottom:-48px;transform:rotate(90deg)}body>section#projects>div{display:grid;grid-template-columns:repeat(4, 1fr);grid-auto-flow:row dense;grid-auto-columns:200px;align-items:stretch;gap:32px}body>section#projects>div>div{position:relative;min-height:400px;margin:0;padding:0;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5);background-position:center center;background-size:cover;cursor:pointer}body>section#projects>div>div:nth-child(1){grid-column:1;grid-row:1 / span 2}body>section#projects>div>div:nth-child(2){grid-column:2 / span 2;grid-row:1}body>section#projects>div>div:nth-child(5){grid-column:3 / span 2;grid-row:2}body>section#projects>div>div:hover{color:#fff}body>section#projects>div>div:hover>h4{color:#000;background-color:#fff}body>section#projects>div>div.interior{background-image:url("/img/projects/gi.jpg")}body>section#projects>div>div.loaded>svg{display:none}body>section#projects>div>div.active{box-shadow:0px 0px 16px #000;color:#fff}body>section#projects>div>div.active:hover>h4{color:#fff}body>section#projects>div>div.active>h4{background-color:rgba(255,255,255,0.05);box-shadow:0px 0px 16px rgba(0,0,0,0.3)}body>section#projects>div>div.active>p{box-shadow:0px 0px 16px rgba(0,0,0,0.3)}body>section#projects>div>div>h4{display:inline-block;margin:32px;padding:16px 32px;font-size:24px;border-radius:32px;overflow:hidden;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>section#projects>div>div>p{position:absolute;bottom:32px;margin:0 32px;padding:16px;border-radius:16px;overflow:hidden;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>section#projects>div>div>svg{position:absolute;top:20px;right:20px}body>section#projects>div>div>.focusAnchor{position:absolute;top:300px}body>section#technology>ul{list-style:none;margin:0;padding:0}body>section#technology>ul>li{max-width:800px;margin:8px 0;padding:0 32px;line-height:64px;border-radius:32px;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>section#contacts{width:calc(100vw - 256px);display:table;min-height:50vh}body>section#contacts>.inner{display:table-cell}body>section#contacts>.inner>a{position:relative;display:inline-block;margin-top:calc(20vh - 48px);padding:32px 64px;color:#fff;text-decoration:none;font-size:64px;color:#000;background-color:#fff;border-radius:16px;box-shadow:0px 0px 16px rgba(0,0,0,0.5)}body>section#contacts>.inner>a:hover{color:#fff;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>section#contacts>.inner>a>.focusAnchor{position:absolute;bottom:-20px}body>footer{position:relative;padding:32px 32px;overflow:hidden;backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.5)}body>footer>.copyright{position:absolute;right:32px;bottom:32px;font-size:14px;color:#777}body>footer>.company>h4{margin:0 0 16px}body>footer>.company>ul{list-style:none;margin:0;padding:0;font-size:14px;max-width:200px;color:#777}body>footer>.company>ul>li.email,body>footer>.company>ul>li.address{margin-top:8px}body>footer>.company>ul>li>span:first-child{font-weight:bold;margin-right:8px}body>footer>.company>ul>li>a{color:#fff;text-decoration:none}body>footer>.company>ul>li>a:hover{background-color:#000;text-decoration:underline}body>canvas{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0;width:100vw !important;height:100vh !important;z-index:-1;user-select:none;mix-blend-mode:plus-lighter}@media only screen and (max-width: 1600px){body>section#projects>div{margin:0;grid-template-columns:repeat(3, 1fr)}body>section#projects>div>div:nth-child(2){grid-column:2 / span 2;grid-row:auto}body>section#projects>div>div:nth-child(5){grid-column:1 / span 2;grid-row:auto}}@media only screen and (max-width: 1280px){body>.path{right:16px;opacity:0.5}body>section{margin:128px 32px 64px}body>section#intro{width:calc(100vw - 64px)}body>section#intro>.inner>h2{margin:196px 32px 0;font-size:58px}body>section#contacts{width:calc(100vw - 64px)}}@media only screen and (max-width: 1024px){body>section#projects>div{grid-template-columns:repeat(2, 1fr)}body>section#projects>div>div:nth-child(2){grid-column:1 / span 2;grid-row:auto}body>section#technology>ul{margin:0 64px}}@media only screen and (max-width: 768px){body>header>ul>li{display:none}body>header>ul>li.contact{display:block}body>header>ul>li.contact>a{background-color:transparent;color:#fff}body>footer{padding:16px}body>footer>.copyright{bottom:16px;right:16px}body>.path{display:none}body>section{margin:64px 0}body>section>h2{margin:0 64px 64px}body>section#intro{width:100vw;min-height:70vh}body>section#intro>.inner>h2{margin:196px 0 0;padding:8px 16px;line-height:64px;border-radius:0}body>section#what-we-do{display:none}body>section#what-we-do>ul{flex-direction:column;align-items:center}body>section#what-we-do>ul>li{max-width:none;width:100vw;height:300px;padding-bottom:64px;margin-bottom:32px}body>section#what-we-do>ul>li:last-child{margin-bottom:0}body>section#what-we-do>ul>li>.focusAnchor{top:10%}body>section#projects>div{display:block;margin:0}body>section#projects>div>div{margin-bottom:32px}body>section#projects>div>div:nth-child(1){grid-column:1}body>section#projects>div>div:nth-child(2){grid-column:3;grid-row:1}body>section#projects>div>div>.focusAnchor{bottom:auto;top:30%}body>section#technology>ul{margin:0}body>section#technology>ul>li{line-height:normal;padding:24px 32px;border-radius:0}body>section#technology>ul>li>.focusAnchor{position:absolute;top:32px}body>section#contacts{width:100vw;min-height:0;padding:196px 0}body>section#contacts>.inner>a{display:block;margin:0;padding:32px 0;font-size:48px;text-align:center;border-radius:0}body>section#contacts>.inner>a>.focusAnchor{bottom:64px}}