.PressLogo {
  cursor: pointer;
  width: 25px;
  height: 40px;
  stroke: var(--color)
}

.PressLogo--animated .PressLogo__path--s {
  animation: drawLogoLineS .7s ease forwards;
  stroke-dashoffset: 270px;
  stroke-dasharray: 270px
}

.PressLogo--animated .PressLogo__path--s:nth-of-type(2) {
  animation-delay: .1s
}

.PressLogo--animated .PressLogo__path--s:nth-of-type(3) {
  animation-delay: .2s
}

.PressLogo--animated .PressLogo__path--p1 {
  stroke-dashoffset: 80px;
  stroke-dasharray: 80px;
  animation: drawLogoLineP .4s ease-in .4s forwards
}

.PressLogo--animated .PressLogo__path--p1:nth-of-type(2) {
  animation-delay: .46s
}

.PressLogo--animated .PressLogo__path--p1:nth-of-type(3) {
  animation-delay: .52s
}

.PressLogo--animated .PressLogo__path--p2 {
  stroke-dashoffset: 80px;
  stroke-dasharray: 80px;
  animation: drawLogoLineP .46s ease-out .7s forwards
}

.PressLogo--animated .PressLogo__path--p2:nth-of-type(2) {
  animation-delay: .77s
}

.PressLogo--animated .PressLogo__path--p2:nth-of-type(3) {
  animation-delay: .84s
}

@keyframes drawLogoLineS {
  0% {
    stroke-dashoffset: 270px
  }

  to {
    stroke-dashoffset: 0
  }
}

@keyframes drawLogoLineP {
  0% {
    stroke-dashoffset: 80px
  }

  to {
    stroke-dashoffset: 0
  }
}
