.logo {
  color: currentColor;
  width: 12rem;
  transition: width .3s ease;

  &.index {
    width: 16rem;
  }

  svg {
    width: 100%;
  }

  &.main {
    margin: calc(var(--spacing-sitepadding-block)*-.6) 0 0 calc(var(--spacing-sitepadding-inline)*-.6);
  }
}

.logoIcon {
  color: currentColor;
  width: 3rem;

  svg {
    width: 100%;
  }

  &.right {
    transform: scaleX(-1);
  }
}

@media (max-width: 800px) {
  .logo {
    width: 10rem;

    &.index {
      width: 12rem;
    }
  }
}