* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #ebebeb; }

@font-face {
  font-family: 'Cormorant Garamond';
  src: url('../fonts/CormorantGaramond.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Cormorant Garamond';
  src: url('../fonts/CormorantGaramond-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
    font-family: 'win95';
    src: url('../fonts/VT323-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

.logo {
  position: fixed;
  top: 20px;
  left: 20px;
  height: 64px;
  aspect-ratio: 1;
  opacity: 1;
  transition: all 0.3s;
  z-index: 6969;
}

.logo.scrolled {
  opacity: 0.4;
}

.logo:hover {
  opacity: 1;
}

.landing{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    text-align: center;
}

.landing-text{
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-size: 7em;
    user-select: none;
}

.scroll-down-indicator {
    position: absolute;
    bottom: 50px;
    font-size: 2em;
    animation: bounce 0.9s;
    animation-delay: 3s;
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    25% {
        transform: translateY(20px);
    }
    50% {
        transform: translateY(0px);
    }
    75% {
        transform: translateY(20px);
    }
}