.contact-details {
  max-width: var(--sp-680);
  width: 100%;
  font-style: normal;

  span, span a {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: var(--sp-12);
  }

  info-field {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--sp-8);
  }

  span a {
    color: var(--black-tint-14);
    text-decoration: none;

    @media (hover: hover) {
      &:hover {
        span {
          text-decoration: underline;
        }
      }
    }
  }

  >span+span {
    margin-block-start: var(--sp-20);
  }

  svg {
    width: var(--sp-32);
    height: var(--sp-32);
  }
}