/* =========================
   ANIMATIONS
========================= */

/* --- Hero --- */

.hero {
  opacity: 0;
}

.hero--done {
  opacity: 1;
}

.hero--fade-in {
  transition: opacity 0.8s ease;
  opacity: 1;
}

.hero--transitioning {
  transition: transform 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Projects scroll reveal --- */

.projects__landing_project {
  opacity: 0;
  transform: translateY(3rem);
  transition:
    opacity 0.7s ease,
    transform 0.7s ease;
}

.projects__landing_project.is-visible {
  opacity: 1;
  transform: translateY(0);
}