/* GLOBAL */
body {
  background-color: #000;
  color: #fff;
  margin: 0;
  padding: 0;
  font-family: sans-serif;
}

/* CENTER EVERYTHING */
.hero {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* EYE LOGO WINK ANIMATION */
.hero-eye {
  width: 180px;
  animation: wink 6s ease-in-out infinite;
  transform-origin: center;
}

@keyframes wink {
  0% { transform: scaleY(1); }
  40% { transform: scaleY(1); }
  45% { transform: scaleY(0.1); } /* wink */
  50% { transform: scaleY(1); }
  100% { transform: scaleY(1); }
}

/* SLOGAN */
.hero-slogan {
  margin-top: 20px;
  font-size: 28px;
  font-weight: 300;
  color: #fff;
  letter-spacing: 1px;
}

/* LOADING DOTS */
.dots {
  animation: blinkDots 1.5s infinite;
}

@keyframes blinkDots {
  0% { opacity: 0.2; }
  50% { opacity: 1; }
  100% { opacity: 0.2; }
}