button {
    position: relative;
    display: inline-block;
    cursor: pointer;
    outline: 0;
    border: 0;
    vertical-align: middle;
    text-decoration: none;
    background: 0 0;
    padding: 0;
    font-size: inherit;
    font-family: inherit;
}
button.learn-more {
    width: 12rem;
    height: auto;
}
button.learn-more .circle {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: relative;
    display: block;
    margin: 0;
    width: 2.5rem;
    height: 2.5rem;
    background: #fff;
    border-radius: 1.625rem;
}
button.learn-more .circle .icon {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    background: #282936;
}
button.learn-more .circle .icon.arrow {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    left: 0.625rem;
    width: 1.125rem;
    height: 0.125rem;
    background: 0 0;
}
button.learn-more .circle .icon.arrow::before {
    position: absolute;
    content: "";
    top: -0.31rem;
    right: 0.0625rem;
    width: 0.625rem;
    height: 0.625rem;
    border-top: 0.125rem solid #282936;
    border-right: 0.125rem solid #282936;
    transform: rotate(45deg);
}
button.learn-more .button-text {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.75rem 0;
    margin: 0 0 0 1.85rem;
    color: #fff;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
}
button:hover .circle {
    width: 100%;
}
button:hover .circle .icon.arrow {
    background: #282936;
    transform: translate(1rem, 0);
}
button:hover .button-text {
    color: #282936;
}
.hero-container {
    text-align: center;
    margin-top: center;
}
.button-wrapper {
    display: inline-block;
    margin-top: 20px;
}
.flipdown.flipdown__theme-dark {
    font-family: DIN-Medium, Helvetica, sans-serif;
    font-weight: 700;
}
.flipdown.flipdown__theme-dark .rotor-group-heading:before {
    color: #fff;
}
.flipdown.flipdown__theme-dark .rotor-group:nth-child(n + 2):nth-child(-n + 3):after,
.flipdown.flipdown__theme-dark .rotor-group:nth-child(n + 2):nth-child(-n + 3):before {
    background-color: #fff;
}
.flipdown.flipdown__theme-dark .rotor,
.flipdown.flipdown__theme-dark .rotor-leaf-front,
.flipdown.flipdown__theme-dark .rotor-top {
    color: #fff;
    background-color: #151515;
}
.flipdown.flipdown__theme-dark .rotor-bottom,
.flipdown.flipdown__theme-dark .rotor-leaf-rear {
    color: #efefef;
    background-color: #202020;
}
.flipdown.flipdown__theme-dark .rotor:after {
    border-top: solid 1px #151515;
}
#flipdown {
    position: absolute;
    left: 20px;
    top: 20px;
    z-index: 1000;
}
.flipdown .rotor-group {
    position: relative;
    float: left;
    padding-right: 5px;
}
.flipdown .rotor-group:last-child {
    padding-right: 0;
}
.flipdown .rotor-group-heading:before {
    display: block;
    height: 12px;
    line-height: 12px;
    text-align: center;
    font-size: 0.6rem;
}
.flipdown .rotor-group:nth-child(1) .rotor-group-heading:before {
    content: attr(data-before);
}
.flipdown .rotor-group:nth-child(2) .rotor-group-heading:before {
    content: attr(data-before);
}
.flipdown .rotor-group:nth-child(3) .rotor-group-heading:before {
    content: attr(data-before);
}
.flipdown .rotor-group:nth-child(4) .rotor-group-heading:before {
    content: attr(data-before);
}
.flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):before {
    content: "";
    position: absolute;
    bottom: 10px;
    left: 34px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
}
.flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):after {
    content: "";
    position: absolute;
    bottom: 20px;
    left: 34px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
}
.flipdown .rotor {
    position: relative;
    float: left;
    width: 16px;
    height: 30px;
    margin: 0 1px 0 0;
    border-radius: 2px;
    font-size: 1.2rem;
    text-align: center;
    perspective: 160px;
}
.flipdown .rotor:last-child {
    margin-right: 0;
}
.flipdown .rotor-bottom,
.flipdown .rotor-top {
    overflow: hidden;
    position: absolute;
    width: 16px;
    height: 16px;
}
.flipdown .rotor-leaf {
    z-index: 1;
    position: absolute;
    width: 16px;
    height: 30px;
    transform-style: preserve-3d;
    transition: transform 0s;
}
.flipdown .rotor-leaf-front,
.flipdown .rotor-leaf-rear {
    overflow: hidden;
    position: absolute;
    width: 16px;
    height: 16px;
    margin: 0;
    transform: rotateX(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.flipdown .rotor-leaf {
    transform-style: preserve-3d;
    transition: transform 0s;
}
.flipdown .rotor-leaf.flipped {
    transform: rotateX(-180deg);
    transition: all 0.5s ease-in-out;
}
.flipdown .rotor-leaf-front {
    line-height: 30px;
    border-radius: 2px 2px 0 0;
}
.flipdown .rotor-leaf-rear {
    line-height: 0;
    border-radius: 0 0 2px 2px;
    transform: rotateX(-180deg);
}
.flipdown .rotor-top {
    line-height: 30px;
    border-radius: 2px 2px 0 0;
}
.flipdown .rotor-bottom {
    bottom: 0;
    line-height: 0;
    border-radius: 0 0 2px 2px;
}
.flipdown .rotor:after {
    content: "";
    z-index: 2;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 0 0 2px 2px;
}
.hero-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 100px 0;
    text-align: center;
}
.hero {
    cursor: default;
    font-size: clamp(30px, 10vw, 30px);
    font-size: 2rem;
    line-height: 1;
    display: inline-block;
    color: #fff;
    z-index: 2;
    letter-spacing: 7px;
}
.layers {
    position: relative;
}
.layers::after,
.layers::before {
    content: attr(data-text);
    position: absolute;
    width: 110%;
    z-index: -1;
}
.layers::after,
.layers::before {
    content: attr(data-text);
    position: absolute;
    width: 110%;
    z-index: -1;
}
@keyframes paths {
    0% {
        clip-path: polygon(
            0 43%,
            83% 43%,
            83% 22%,
            23% 22%,
            23% 24%,
            91% 24%,
            91% 26%,
            18% 26%,
            18% 83%,
            29% 83%,
            29% 17%,
            41% 17%,
            41% 39%,
            18% 39%,
            18% 82%,
            54% 82%,
            54% 88%,
            19% 88%,
            19% 4%,
            39% 4%,
            39% 14%,
            76% 14%,
            76% 52%,
            23% 52%,
            23% 35%,
            19% 35%,
            19% 8%,
            36% 8%,
            36% 31%,
            73% 31%,
            73% 16%,
            1% 16%,
            1% 56%,
            50% 56%,
            50% 8%
        );
    }
    5% {
        clip-path: polygon(
            0 29%,
            44% 29%,
            44% 83%,
            94% 83%,
            94% 56%,
            11% 56%,
            11% 64%,
            94% 64%,
            94% 70%,
            88% 70%,
            88% 32%,
            18% 32%,
            18% 96%,
            10% 96%,
            10% 62%,
            9% 62%,
            9% 84%,
            68% 84%,
            68% 50%,
            52% 50%,
            52% 55%,
            35% 55%,
            35% 87%,
            25% 87%,
            25% 39%,
            15% 39%,
            15% 88%,
            52% 88%
        );
    }
    30% {
        clip-path: polygon(
            0 53%,
            93% 53%,
            93% 62%,
            68% 62%,
            68% 37%,
            97% 37%,
            97% 89%,
            13% 89%,
            13% 45%,
            51% 45%,
            51% 88%,
            17% 88%,
            17% 54%,
            81% 54%,
            81% 75%,
            79% 75%,
            79% 76%,
            38% 76%,
            38% 28%,
            61% 28%,
            61% 12%,
            55% 12%,
            55% 62%,
            68% 62%,
            68% 51%,
            0 51%,
            0 92%,
            63% 92%,
            63% 4%,
            65% 4%
        );
    }
    45% {
        clip-path: polygon(
            0 33%,
            2% 33%,
            2% 69%,
            58% 69%,
            58% 94%,
            55% 94%,
            55% 25%,
            33% 25%,
            33% 85%,
            16% 85%,
            16% 19%,
            5% 19%,
            5% 20%,
            79% 20%,
            79% 96%,
            93% 96%,
            93% 50%,
            5% 50%,
            5% 74%,
            55% 74%,
            55% 57%,
            96% 57%,
            96% 59%,
            87% 59%,
            87% 65%,
            82% 65%,
            82% 39%,
            63% 39%,
            63% 92%,
            4% 92%,
            4% 36%,
            24% 36%,
            24% 70%,
            1% 70%,
            1% 43%,
            15% 43%,
            15% 28%,
            23% 28%,
            23% 71%,
            90% 71%,
            90% 86%,
            97% 86%,
            97% 1%,
            60% 1%,
            60% 67%,
            71% 67%,
            71% 91%,
            17% 91%,
            17% 14%,
            39% 14%,
            39% 30%,
            58% 30%,
            58% 11%,
            52% 11%,
            52% 83%,
            68% 83%
        );
    }
    76% {
        clip-path: polygon(
            0 26%,
            15% 26%,
            15% 73%,
            72% 73%,
            72% 70%,
            77% 70%,
            77% 75%,
            8% 75%,
            8% 42%,
            4% 42%,
            4% 61%,
            17% 61%,
            17% 12%,
            26% 12%,
            26% 63%,
            73% 63%,
            73% 43%,
            90% 43%,
            90% 67%,
            50% 67%,
            50% 41%,
            42% 41%,
            42% 46%,
            50% 46%,
            50% 84%,
            96% 84%,
            96% 78%,
            49% 78%,
            49% 25%,
            63% 25%,
            63% 14%
        );
    }
    90% {
        clip-path: polygon(
            0 41%,
            13% 41%,
            13% 6%,
            87% 6%,
            87% 93%,
            10% 93%,
            10% 13%,
            89% 13%,
            89% 6%,
            3% 6%,
            3% 8%,
            16% 8%,
            16% 79%,
            0 79%,
            0 99%,
            92% 99%,
            92% 90%,
            5% 90%,
            5% 60%,
            0 60%,
            0 48%,
            89% 48%,
            89% 13%,
            80% 13%,
            80% 43%,
            95% 43%,
            95% 19%,
            80% 19%,
            80% 85%,
            38% 85%,
            38% 62%
        );
    }
    1%,
    33%,
    47%,
    7%,
    78%,
    93% {
        clip-path: none;
    }
}
@keyframes opacity {
    0% {
        opacity: 0.1;
    }
    5% {
        opacity: 0.7;
    }
    30% {
        opacity: 0.4;
    }
    45% {
        opacity: 0.6;
    }
    76% {
        opacity: 0.4;
    }
    90% {
        opacity: 0.8;
    }
    1%,
    33%,
    47%,
    7%,
    78%,
    93% {
        opacity: 0;
    }
}
@keyframes font {
    0% {
        font-weight: 100;
        color: #e0287d;
        filter: blur(3px);
    }
    20% {
        font-weight: 500;
        color: #fff;
        filter: blur(0);
    }
    50% {
        font-weight: 300;
        color: #1bc7fb;
        filter: blur(2px);
    }
    60% {
        font-weight: 700;
        color: #fff;
        filter: blur(0);
    }
    90% {
        font-weight: 500;
        color: #e0287d;
        filter: blur(6px);
    }
}
@keyframes movement {
    0% {
        top: 0;
        left: -20px;
    }
    15% {
        top: 10px;
        left: 10px;
    }
    60% {
        top: 5px;
        left: -10px;
    }
    75% {
        top: -5px;
        left: 20px;
    }
    100% {
        top: 10px;
        left: 5px;
    }
}
.glitch span {
    animation: paths 5s step-end infinite;
}
.glitch::before {
    animation: paths 5s step-end infinite, opacity 5s step-end infinite, font 8s step-end infinite, movement 10s step-end infinite;
}
.glitch::after {
    animation: paths 5s step-end infinite, opacity 5s step-end infinite, font 7s step-end infinite, movement 8s step-end infinite;
}
body {
    color: #fff;
    margin: 0;
    display: flex;
    flex-direction: column;
    height: 100vh;
    padding: 0;
    overflow: hidden;
    background: #000;
    text-align: center;
    font-family: DIN-Medium, Helvetica, sans-serif;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
body,
html {
    overflow: hidden;
    background-color: #000;
}
canvas {
    display: block;
}
@font-face {
    font-family: DIN-Medium;
    src: url(../fonts/DIN-Medium.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
}
.word {
    cursor: pointer;
    position: absolute;
    left: 50%;
    top: 50%;
    opacity: 0;
    user-select: none;
    transform: translate(-50%, -50%);
    z-index: 1;
    pointer-events: auto;
}
.word:hover {
    z-index: 2;
    cursor: pointer;
    pointer-events: auto;
}
.value {
    cursor: pointer;
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(5px);
    color: #fff;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 0;
    border-radius: 3px;
    display: none;
    text-shadow: none;
    z-index: 3;
}
.value:hover {
    cursor: pointer;
}
.morphing-container {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
    color: #fff;
    height: 10vh;
    width: 100%;
}
.morphing {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: 30px;
    background-color: #000;
    color: #fff;
    height: 10vh;
    width: 100%;
    filter: contrast(25) blur(1px);
}
.logo {
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-animation: logo 16s infinite ease-in-out;
    animation: logo 16s infinite ease-in-out;
}
#logoImage {
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
    margin-left: 180px;
    margin-top: 40px;
}
.logo:nth-child(1) {
    -webkit-animation-delay: -16s;
    animation-delay: -16s;
}
.logo:nth-child(2) {
    -webkit-animation-delay: -14s;
    animation-delay: -14s;
}
.logo:nth-child(3) {
    -webkit-animation-delay: -12s;
    animation-delay: -12s;
}
.logo:nth-child(4) {
    -webkit-animation-delay: -10s;
    animation-delay: -10s;
}
.logo:nth-child(5) {
    -webkit-animation-delay: -8s;
    animation-delay: -8s;
}
.logo:nth-child(6) {
    -webkit-animation-delay: -6s;
    animation-delay: -6s;
}
.logo:nth-child(7) {
    -webkit-animation-delay: -4s;
    animation-delay: -4s;
}
@-webkit-keyframes logo {
    0%,
    100%,
    5% {
        filter: blur(0);
        opacity: 1;
    }
    20%,
    80% {
        filter: blur(1em);
        opacity: 0;
    }
}
@keyframes logo {
    0%,
    100%,
    5% {
        filter: blur(0);
        opacity: 1;
    }
    20%,
    80% {
        filter: blur(1em);
        opacity: 0;
    }
}
[class*="social_lnk"] {
    position: relative;
    display: inline-block;
    padding: 0.125em;
    text-decoration: none;
    width: 1.5rem;
    height: 1.5rem;
    transition: all 0.3s ease-out;
    animation: social-hoverOff 0.3s ease-out;
    filter: drop-shadow(0 0 0 transparent);
}
[class*="social_lnk"]:focus,
[class*="social_lnk"]:hover {
    outline: 0 solid;
    transform: scale(1.4);
    animation: social-hoverOn 0.3s ease-out;
}
.social_lnk-facebook {
    background-position: 7px 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M19.6 15.4c0-1.4 0-3.6 1-5C21.8 9 23.2 8 25.8 8c4.2 0 6 .6 6 .6l-.8 4.8s-1.3-.4-2.5-.4c-1.3 0-2.5.4-2.5 1.8v3.8h5.2l-.4 4.8h-5V40h-6.2V23.4h-3.4v-4.8h3.4v-3.2z'/%3E%3C/svg%3E");
    transition: all 0.3s ease-out;
    animation: social-hoverOff 0.3s ease-out;
    filter: drop-shadow(0 0 0 transparent);
}
.social_lnk-facebook:hover {
    transform: scale(1.4) translateX(-3px);
    animation: social-hoverOn 0.3s ease-out;
    background-position: 7px 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%231877F2' d='M19.6 15.4c0-1.4 0-3.6 1-5C21.8 9 23.2 8 25.8 8c4.2 0 6 .6 6 .6l-.8 4.8s-1.3-.4-2.5-.4c-1.3 0-2.5.4-2.5 1.8v3.8h5.2l-.4 4.8h-5V40h-6.2V23.4h-3.4v-4.8h3.4v-3.2z'/%3E%3C/svg%3E");
}
.social_lnk-twitter {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M15.2 31.44c2.4 0 4.47-.74 6.1-2.08-2.22 0-4-1.5-4.6-3.43.3.15.6.15.9.15.44 0 .88 0 1.33-.15-2.23-.44-3.87-2.38-3.87-4.76.75.3 1.5.6 2.23.6-1.36-.9-2.25-2.38-2.25-4.02 0-.9.15-1.8.6-2.53 2.38 2.98 6.1 4.9 10.12 5.06-.15-.3-.15-.6-.15-1.04 0-2.68 2.23-4.9 4.9-4.9 1.35 0 2.7.58 3.58 1.47 1.2-.27 2.24-.57 3.14-1.17-.3 1.05-1.05 2.1-2.1 2.68 1.05-.14 1.95-.3 2.84-.73-.6 1.04-1.5 1.78-2.53 2.53v.58c0 6.55-4.9 14-14 14-2.67 0-5.2-.9-7.43-2.24h1.2z'/%3E%3C/svg%3E");
}
.social_lnk-twitter:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2337A7DF' d='M15.2 31.44c2.4 0 4.47-.74 6.1-2.08-2.22 0-4-1.5-4.6-3.43.3.15.6.15.9.15.44 0 .88 0 1.33-.15-2.23-.44-3.87-2.38-3.87-4.76.75.3 1.5.6 2.23.6-1.36-.9-2.25-2.38-2.25-4.02 0-.9.15-1.8.6-2.53 2.38 2.98 6.1 4.9 10.12 5.06-.15-.3-.15-.6-.15-1.04 0-2.68 2.23-4.9 4.9-4.9 1.35 0 2.7.58 3.58 1.47 1.2-.27 2.24-.57 3.14-1.17-.3 1.05-1.05 2.1-2.1 2.68 1.05-.14 1.95-.3 2.84-.73-.6 1.04-1.5 1.78-2.53 2.53v.58c0 6.55-4.9 14-14 14-2.67 0-5.2-.9-7.43-2.24h1.2z'/%3E%3C/svg%3E");
}
.social_lnk-envlope {
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" %3F><svg viewBox="-5 -7 43 43" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">.st0{fill:%23fff;stroke:%23152730;stroke-width:2;stroke-miterlimit:10;}<rect class="st0" height="18" id="XMLID_2233_" width="26" x="3" y="7"/><path class="st0" d="M5,9" id="XMLID_2251_"/><path class="st0" d="M16,20" id="XMLID_2250_"/><polyline class="st0" id="XMLID_2249_" points="29,7 16,18 3,7 "/><g id="XMLID_386_"/></svg>');
}
.social_lnk-envlope:hover {
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" %3F><svg viewBox="-5 -7 43 43" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">.st0{fill:%2337A7DF;stroke:%23152730;stroke-width:2;stroke-miterlimit:10;}<rect class="st0" height="18" id="XMLID_2233_" width="26" x="3" y="7"/><path class="st0" d="M5,9" id="XMLID_2251_"/><path class="st0" d="M16,20" id="XMLID_2250_"/><polyline class="st0" id="XMLID_2249_" points="29,7 16,18 3,7 "/><g id="XMLID_386_"/></svg>');
}
.social_lnk-linkedin {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M18.37 19.97V36h-5V19.96h5zm7.96 2.2c.66-1.27 2.3-2.6 4.7-2.6 5.05 0 5.98 3.32 5.98 7.64V36h-4.96v-7.8c0-1.86-.03-4.25-2.58-4.25-2.6 0-3 2.03-3 4.12V36H21.5V19.96h4.76v2.2h.07zM15.88 12c1.6 0 2.88 1.3 2.88 2.9 0 1.6-1.3 2.88-2.88 2.88-1.6 0-2.9-1.3-2.9-2.88 0-1.6 1.3-2.9 2.9-2.9z'/%3E%3C/svg%3E");
}
.social_lnk-linkedin:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%230A66C2' d='M18.37 19.97V36h-5V19.96h5zm7.96 2.2c.66-1.27 2.3-2.6 4.7-2.6 5.05 0 5.98 3.32 5.98 7.64V36h-4.96v-7.8c0-1.86-.03-4.25-2.58-4.25-2.6 0-3 2.03-3 4.12V36H21.5V19.96h4.76v2.2h.07zM15.88 12c1.6 0 2.88 1.3 2.88 2.9 0 1.6-1.3 2.88-2.88 2.88-1.6 0-2.9-1.3-2.9-2.88 0-1.6 1.3-2.9 2.9-2.9z'/%3E%3C/svg%3E");
}
[class*="social_lnk"] span {
    display: none;
}
.social_list {
    list-style: none;
    display: flex;
    padding: 0;
    margin: 0;
    position: fixed;
    bottom: 0.5rem;
    right: 2rem;
    z-index: 10;
}
.social_list li {
    flex: 1 1 0;
    margin: 0 0.4rem;
    text-align: center;
}