/**
 * Base reset & bare elements
 *
 * Reproduces the global reset from the mockup's <helmet><style> block, plus the
 * two elevation hover rules that lived there as global class selectors.
 *
 * @package Printmania
 */

/* Original: *{box-sizing:border-box} */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Original: body reset with the page background — type rules live in typography.css. */
body {
	margin: 0;
	background-color: var( --color-page );
}

/* Legacy scorg snippet #8079 sets `html, body { overflow-x: hidden }`, which
   turns body into a (never-scrolling) scroll container and breaks every
   `position: sticky` on the page. `clip` still hides horizontal overflow
   without creating a scroll container. */
html:root,
html:root > body {
	overflow-x: clip;
}

img,
svg,
video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

/* The mockup repeats font-family:inherit on every control. */
button,
input,
select,
textarea {
	font-family: inherit;
	letter-spacing: inherit;
}

button {
	cursor: pointer;
}

/* Original: select{appearance:none;-webkit-appearance:none} */
select {
	appearance: none;
	-webkit-appearance: none;
}

/* Original: ::placeholder colour override. */
::placeholder {
	color: var( --color-placeholder );
	opacity: 1;
}

/* Original: #pmNavScroll::-webkit-scrollbar{display:none;height:0}
   plus the inline scrollbar-width / -ms-overflow-style on the same element. */
.site-nav__scroll {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.site-nav__scroll::-webkit-scrollbar {
	display: none;
	height: 0;
}

/* Original: .pmcat:hover / .pmbrand:hover — the mockup needed !important to beat
   its own inline styles; the theme has no inline styles, so it is dropped. */
.category-card:hover,
.brand-card:hover,
.pm-post-card:hover,
.pm-post-card:focus-within {
	box-shadow: var( --shadow-6 );
	transform: translateY( var( --lift-card ) );
}

@media ( prefers-reduced-motion: reduce ) {

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Fallback images (inc/fallback-images.php): a printer's brand logo and the
   octopus product placeholder sit smaller inside their frame than a photo. */
img.pm-img--brand-logo {
	box-sizing: border-box;
	padding: 18%;
	object-fit: contain;
}

img.pm-img--placeholder {
	object-fit: contain;
}