@charset "utf-8";

@keyframes svg-draw {
  from {
    stroke-dashoffset: var(--dash, 0);
  }
  to {
    stroke-dashoffset: 0;
  }
}

.is-in-view {
  opacity: 1;
  stroke-dasharray: var(--dash, 0);
  stroke-dashoffset: var(--dash, 0);
  animation: svg-draw var(--dur, 6s) cubic-bezier(0.5, 0, 0.3, 1) forwards;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.is-out-of-view {
  transition-duration: 500ms;
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  #main-image path {
    animation: none;
  }
}