@font-face {
  font-family: "Raleway";
  src: url("../fonts/Raleway-VariableFont_wght.woff2") format("woff2 supports variations"), url("../fonts/Raleway-VariableFont_wght.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-feature-settings: "lnum";
}
@font-face {
  font-family: "Raleway-italic";
  src: url("../fonts/Raleway-Italic-VariableFont_wght.woff2") format("woff2 supports variations"), url("../fonts/Raleway-Italic-VariableFont_wght.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-feature-settings: "lnum";
}
html {
  font-size: 16px !important;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background-color: black;
  font-family: sans-serif;
  line-height: 1.2;
}

.hero {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100svh;
  width: 100svw;
  overflow: hidden;
}

.logo {
  position: relative;
  width: 75vw;
}

.logo-svg {
  fill: #fff;
  display: block;
}
.logo:hover .logo-svg {
  animation: glitch 4s;
}

.glitch {
  animation: glitch 4s 2s;
}

@keyframes glitch {
  1% {
    transform: rotateX(10deg) skewX(90deg);
    filter: drop-shadow(3px 0 0 cyan) drop-shadow(-3px 0 0 magenta);
  }
  2% {
    transform: rotateX(-10deg) skewX(-45deg);
    filter: drop-shadow(5px 0 0 cyan) drop-shadow(-5px 0 0 magenta);
  }
  3% {
    transform: rotateX(0deg) skewX(0deg);
    filter: none;
  }
}/*# sourceMappingURL=style.css.map */