/**
 * Site logo: .mk-site-logo (templates/components/site-logo.php).
 * The parent sets --mk-logo-height; the width follows the picture's ratio.
 */

.mk-site-logo {
	display: inline-flex;
	align-items: center;
	color: var(--wp--custom--color--text--primary);
	text-decoration: none;
}

.mk-site-logo__image {
	display: block;
	inline-size: auto;
	block-size: var(--mk-logo-height, auto);
	max-inline-size: 100%;
}

.mk-site-logo__name {
	font-family: var(--wp--custom--text--heading-3--font-family);
	font-size: var(--wp--custom--text--heading-3--font-size);
	font-weight: var(--wp--custom--text--heading-3--font-weight);
	line-height: var(--wp--custom--text--heading-3--line-height);
	letter-spacing: var(--wp--custom--text--heading-3--letter-spacing);
}

.mk-site-logo:focus-visible {
	outline-width: var(--wp--custom--focus--ring-width);
	outline-style: solid;
	outline-color: var(--wp--custom--color--focus--ring);
	outline-offset: var(--wp--custom--focus--ring-offset);
}