/* global/reset */
body {
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.wp-site-blocks {
	display: flex;
	flex-flow: column;
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0rem));
}

.wp-site-blocks footer {
	margin-top: auto !important;
}

p.has-background {
	box-sizing: border-box;
}

.is-position-sticky:not(
		.is-position-sticky:has(header),
		.is-position-sticky:has(footer)
	) {
	top: calc(
		var(--offset-height, 0px) + var(--wp-admin--admin-bar--height, 0rem)
	) !important;
	z-index: 2;
}

/* a tag global hover/focus/active states */
.wp-site-blocks
	a:where(:not(.wp-element-button, .wp-block-klingit-the-product-logo)) {
	--accent-text: var(--wp--preset--color--primary);
}

.wp-site-blocks
	a:where(
		:not(
				.wp-element-button,
				.wp-block-klingit-the-product-load-more .wp-block-read-more,
				.wp-block-read-more,
				.is-light-accent,
				.block-editor-block-list__block a
			)
	):focus-visible {
	outline: 3px solid color-mix(in srgb, var(--accent-text), transparent);
	outline-offset: 5px;
	border-radius: 5px;
}

.wp-site-blocks
	a:where(
		:not(
				.wp-element-button,
				.wp-block-read-more,
				.wp-block-klingit-the-product-load-more,
				.block-editor-block-list__block a
			)
	).is-light-accent:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--accent-text), #000000 15%);
	outline-offset: 5px;
	border-radius: 5px;
}

.grid-insert {
	max-width: 100%;
	display: block;
	overflow: hidden;
}

@media (max-width: 37.5rem) {
	.grid-insert {
		grid-column-start: 1 !important;
		grid-column-end: 2 !important;
		grid-row: var(--grid-row-mobile) !important;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.wp-site-blocks
		a:where(:not(.wp-element-button, .wp-block-klingit-the-product-logo)) {
		transition: all ease 200ms;
	}
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.wp-site-blocks
		a:where(
			:not(
					.wp-element-button,
					.wp-block-read-more,
					.wp-block-klingit-the-product-load-more,
					.wp-block-klingit-the-product-logo,
					.is-light-accent,
					.block-editor-block-list__block a
				)
		):hover {
		color: color-mix(in srgb, var(--accent-text), #000000 20%) !important;
	}

	.wp-site-blocks
		a:where(
			:not(
					.wp-element-button,
					.wp-block-read-more,
					.wp-block-klingit-the-product-load-more,
					.wp-block-klingit-the-product-logo,
					.block-editor-block-list__block a
				)
		).is-light-accent:hover {
		color: color-mix(in srgb, var(--accent-text), #ffffff 20%) !important;
	}
}

@media screen and (max-width: 600px) {
	#wpadminbar {
		position: fixed;
	}
}