:root {
  --mk-sig-text: var(--muted, #666);
  --mk-sig-text-hover: var(--ink, #111);
  --mk-sig-rule: var(--rule, #ddd);
  --mk-sig-focus: var(--focus, #005fcc);
}

.mk-signature {
  display: flex;
  justify-content: center;
  padding-block-start: var(--space-lg, 1.5rem);
  border-block-start: 1px solid var(--mk-sig-rule);
}

.mk-signature a {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs, 0.5rem);
  min-height: 2.75rem;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--mk-sig-text);
  text-decoration: none;
  transition: color 120ms ease-out;
}

.mk-signature__logo {
  display: block;
  height: 2rem;
  width: auto;
  max-width: 5rem;
  object-fit: contain;
  flex: none;
  align-self: center;
}

.mk-signature__icon {
  width: 0.85em;
  height: 0.85em;
  flex: none;
}

@media (max-width: 39.99rem) {
  .mk-signature__logo {
    height: 1.5rem;
    max-width: 4rem;
  }
}

@media (hover: hover) {
  .mk-signature a:hover {
    color: var(--mk-sig-text-hover);
  }
}

.mk-signature a:focus-visible {
  outline: 2px solid var(--mk-sig-focus);
  outline-offset: 3px;
  border-radius: 4px;
}
