* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
:root {
  --font-family: "Fira Sans", Helvetica, Arial, serif, sans-serif, system-ui;
  --special-font-family:
    "Special Gothic Expanded One", "Alfa Slab One", "IBM Plex Sans",
    "Montserrat", serif, sans-serif, system-ui;
  --logo-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><text x="50%" y="60%" font-size="7em" font-weight="bold" text-anchor="middle" alignment-baseline="middle"  font-family="Special Gothic Expanded One" style="text-transform: uppercase;">BM6</text></svg>');
  --main-color-1: #070108;
  --main-color-2: #41127c;
  --main-color-3: #d426bd;
  --main-color-4: #d575b6;
  --main-color-5: #f5cff2;
}
main {
  margin: 0;
  padding: 0;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--main-color-1);
  color: white;
  text-align: center;
  font-family: var(--font-family);
}
#hiden-logo {
  all: unset;
  visibility: hidden;
}
.btn-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.btn {
  text-decoration: none;
  display: inline-block;
  padding: 5px;
  margin: 10px;
  border: 1px solid var(--main-color-2);
  color: var(--main-color-5);
}
.mirror-box {
  height: 120px;
  width: 320px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background: white;
  mask-image: var(--logo-mask);
  -webkit-mask-image: var(--logo-mask);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.shine {
  position: absolute;
  top: -50%;
  left: -150%;
  width: 60%;
  height: 200%;
  background: linear-gradient(
    -45deg,
    transparent 20%,
    rgba(0, 0, 0, 0.1) 35%,
    rgba(0, 0, 0, 0.8) 50%,
    rgba(0, 0, 0, 0.1) 65%,
    transparent 80%
  );

  animation: lightEffect 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes lightEffect {
  0% {
    left: -150%;
  }
  100% {
    left: 150%;
  }
}
