/* Shared category product-card contract.
 *
 * Vehicle fitments, guards, bracket kits, coverage kits, RV fitments and the
 * WooCommerce loop use different markup, but they should present one visual
 * system. Page styles may control catalog layout; this file owns card anatomy.
 */

body.exg-shell.exg-catalog-page .exg-bracket-card,
body.exg-shell.exg-coverage-category-page .exg-coverage-card,
body.exg-shell.exg-consumer-page .exg-consumer-product,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card,
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product {
	--exg-category-card-media-height: 188px;
	--exg-category-card-image-height: 180px;
	--exg-category-card-body-min: 96px;
	position: relative;
	display: flex !important;
	min-width: 0;
	min-height: calc(var(--exg-category-card-media-height) + var(--exg-category-card-body-min) + 2px);
	height: auto;
	align-self: start;
	flex-direction: column;
	overflow: hidden;
	padding: 0 !important;
	border: 1px solid #dddddd !important;
	border-radius: 8px !important;
	background: #f4f4f4 !important;
	box-shadow: 0 8px 22px rgba(10, 10, 10, 0.07) !important;
	transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

/* Semi and RV source artwork is portrait-oriented. Give it more vertical
 * room on desktop so the vehicle fills the card without cropping the guard. */
@media (min-width: 901px) {
	body.exg-shell.exg-catalog-page.exg-vehicle-library-page:is(.exg-market-semi, .exg-market-rv) .exg-vehicle-card {
		--exg-category-card-media-height: 232px;
		--exg-category-card-image-height: 224px;
	}

	/* Pickup category and brand PLPs need more product-image emphasis. */
	body.exg-shell.exg-catalog-page.exg-vehicle-library-page.exg-market-pickup .exg-vehicle-card,
	body.exg-shell.exg-coverage-category-page.exg-market-pickup .exg-coverage-card,
	body.exg-shell.exg-commerce-category-page.term-light-duty-kits .exg-commerce-library__loop ul.products li.product {
		--exg-category-card-media-height: 232px;
		--exg-category-card-image-height: 224px;
	}
}

body.exg-shell.exg-catalog-page .exg-bracket-card:is(:hover, :focus-within),
body.exg-shell.exg-coverage-category-page .exg-coverage-card:is(:hover, :focus-within),
body.exg-shell.exg-consumer-page .exg-consumer-product:is(:hover, :focus-within),
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card:is(:hover, :focus-within),
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product:is(:hover, :focus-within) {
	border-color: var(--exg-gold-deep) !important;
	box-shadow: 0 12px 28px rgba(10, 10, 10, 0.13) !important;
	transform: translateY(-2px);
}

body.exg-shell.exg-catalog-page .exg-bracket-card__media,
body.exg-shell.exg-coverage-category-page .exg-coverage-card__media,
body.exg-shell.exg-consumer-page .exg-consumer-product__image,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media {
	display: flex !important;
	width: 100%;
	height: var(--exg-category-card-media-height) !important;
	min-height: var(--exg-category-card-media-height) !important;
	flex: 0 0 var(--exg-category-card-media-height);
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 6px 6px 0 !important;
	border: 0 !important;
	background: inherit !important;
}

body.exg-shell.exg-catalog-page .exg-bracket-card__media img,
body.exg-shell.exg-coverage-category-page .exg-coverage-card__media img,
body.exg-shell.exg-consumer-page .exg-consumer-product__image img,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media img {
	display: block;
	width: 100% !important;
	height: var(--exg-category-card-image-height) !important;
	max-height: none !important;
	margin: 0 !important;
	object-fit: contain;
	object-position: center bottom;
	transition: transform 180ms ease;
}

body.exg-shell.exg-catalog-page .exg-bracket-card:is(:hover, :focus-within) .exg-bracket-card__media img,
body.exg-shell.exg-coverage-category-page .exg-coverage-card:is(:hover, :focus-within) .exg-coverage-card__media img,
body.exg-shell.exg-consumer-page .exg-consumer-product:is(:hover, :focus-within) .exg-consumer-product__image img,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card:is(:hover, :focus-within) .exg-vehicle-card__media img,
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product:is(:hover, :focus-within) .woocommerce-loop-product__link > img {
	transform: scale(1.02);
}

body.exg-shell.exg-catalog-page .exg-bracket-card__body,
body.exg-shell.exg-coverage-category-page .exg-coverage-card__body,
body.exg-shell.exg-consumer-page .exg-consumer-product > div,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-bracket-card__body {
	display: flex !important;
	width: 100%;
	min-width: 0;
	min-height: var(--exg-category-card-body-min) !important;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	padding: 8px 10px 10px !important;
	background: inherit !important;
	text-align: center;
}

body.exg-shell.exg-catalog-page .exg-bracket-card :is(h2, h3),
body.exg-shell.exg-coverage-category-page .exg-coverage-card h3,
body.exg-shell.exg-consumer-page .exg-consumer-product h3,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card h3,
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
	order: 1;
	display: -webkit-box;
	width: 100%;
	min-height: 0;
	max-height: 2.08em;
	overflow: hidden;
	margin: 0 0 2px !important;
	padding: 0 !important;
	color: var(--exg-black) !important;
	font: var(--exg-weight-display) clamp(17px, 1.35vw, 20px)/1.04 var(--exg-display) !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-transform: uppercase;
	text-wrap: balance;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

body.exg-shell.exg-catalog-page .exg-bracket-card :is(h2, h3) a,
body.exg-shell.exg-coverage-category-page .exg-coverage-card h3 a,
body.exg-shell.exg-consumer-page .exg-consumer-product h3 a,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card h3 a {
	display: -webkit-box;
	width: 100%;
	min-height: 0;
	max-height: 2.08em;
	overflow: hidden;
	color: inherit !important;
	text-decoration: none !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

body.exg-shell.exg-catalog-page :is(.exg-bracket-card__meta, .exg-vehicle-card__detail),
body.exg-shell.exg-coverage-category-page .exg-coverage-card__meta,
body.exg-shell.exg-consumer-page .exg-consumer-product > div > p,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__detail,
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .price {
	order: 2;
	display: block;
	width: 100%;
	min-height: 14px;
	margin: 0 0 2px !important;
	padding: 0 !important;
	color: #6e6e6e !important;
	font: var(--exg-weight-semibold) 11px/14px var(--exg-body) !important;
	letter-spacing: 0.02em;
	text-align: center;
	text-transform: uppercase;
}

body.exg-shell.exg-coverage-category-page .exg-coverage-card__price {
	order: 3;
	width: 100%;
	margin: 4px 0 0 !important;
	color: var(--exg-black);
	font: var(--exg-weight-strong) 14px/18px var(--exg-body);
	text-align: center;
}

body.exg-shell.exg-coverage-category-page .exg-coverage-card__price > span {
	color: #6e6e6e;
	font-size: 10px;
}

body.exg-shell.exg-coverage-category-page .exg-coverage-card__fits,
body.exg-shell.exg-coverage-category-page .exg-coverage-card__excerpt {
	width: 100%;
	margin: 4px 0 0;
	color: #5f5f5f;
	font: var(--exg-weight-semibold) 13px/18px var(--exg-body);
	text-align: center;
}

body.exg-shell.exg-coverage-category-page .exg-coverage-card__fits {
	order: 4;
}

body.exg-shell.exg-coverage-category-page .exg-coverage-card__excerpt {
	order: 5;
}

body.exg-shell.exg-catalog-page .exg-guard-card__actions,
body.exg-shell.exg-coverage-category-page .exg-coverage-card__actions,
body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-guard-card__actions {
	order: 10;
	display: grid !important;
	width: 100%;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
	gap: 6px !important;
	align-items: stretch;
	margin: 0 !important;
	padding: 2px 0 0 !important;
}

body.exg-shell.exg-catalog-page :is(.exg-guard-card__actions a, .exg-bracket-card__action),
body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details),
body.exg-shell.exg-consumer-page :is(.exg-consumer-text-link, .exg-consumer-product-grid--ecommerce .exg-vehicle-card__action),
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart) {
	order: 10;
	display: inline-flex !important;
	width: 100%;
	min-width: 0;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	gap: 5px;
	margin: 0 !important;
	padding: 4px 2px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--exg-black) !important;
	font: var(--exg-weight-action) 11px/13px var(--exg-display) !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: uppercase;
	white-space: normal;
}

body.exg-shell.exg-catalog-page :is(.exg-guard-card__actions a, .exg-bracket-card__action) > span:first-child,
body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details) > span:first-child,
body.exg-shell.exg-consumer-page :is(.exg-consumer-text-link, .exg-consumer-product-grid--ecommerce .exg-vehicle-card__action) > span:first-child {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
	line-height: inherit;
}

body.exg-shell.exg-catalog-page :is(.exg-guard-card__actions a, .exg-bracket-card__action) > span[aria-hidden="true"],
body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details) > span[aria-hidden="true"],
body.exg-shell.exg-consumer-page :is(.exg-consumer-text-link, .exg-consumer-product-grid--ecommerce .exg-vehicle-card__action) > span[aria-hidden="true"] {
	flex: 0 0 auto;
	text-decoration: none;
}

body.exg-shell.exg-catalog-page :is(.exg-guard-card__actions a, .exg-bracket-card__action):is(:hover, :focus-visible),
body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details):is(:hover, :focus-visible),
body.exg-shell.exg-consumer-page :is(.exg-consumer-text-link, .exg-consumer-product-grid--ecommerce .exg-vehicle-card__action):is(:hover, :focus-visible),
body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart):is(:hover, :focus-visible) {
	background: transparent !important;
	color: var(--exg-gold-deep) !important;
}

body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__link {
	display: flex;
	min-width: 0;
	flex: 0 0 auto;
	flex-direction: column;
	color: var(--exg-black);
	text-decoration: none;
}

body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__link > img {
	display: block;
	width: 100% !important;
	height: var(--exg-category-card-media-height) !important;
	min-height: var(--exg-category-card-media-height) !important;
	margin: 0 !important;
	padding: 6px 6px 0 !important;
	background: inherit !important;
	object-fit: contain;
	object-position: center bottom;
	transition: transform 180ms ease;
}

body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
	margin: 8px 10px 0 !important;
	width: calc(100% - 20px);
}

body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .price {
	width: calc(100% - 20px);
	margin: 0 10px 2px !important;
}

body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart) {
	width: calc(100% - 20px);
	margin: 0 10px 10px !important;
}

/* WooCommerce's global button contract is intentionally stronger than its
 * loop styles. Category cards use the same quiet text action as every other
 * product family, so this listing-only selector resets that global button. */
html body.exg-shell.exg-commerce-page.exg-commerce-library-page .woocommerce.exg-commerce-library__loop ul.products li.product > a.button,
html body.exg-shell.exg-commerce-page.exg-commerce-library-page .woocommerce.exg-commerce-library__loop ul.products li.product > a.added_to_cart {
	display: inline-flex !important;
	min-height: 44px !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 4px 2px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--exg-black) !important;
	font-family: var(--exg-display) !important;
	font-size: 11px !important;
	font-weight: var(--exg-weight-action) !important;
	line-height: 13px !important;
	text-decoration: underline !important;
	text-decoration-thickness: 1px !important;
	text-underline-offset: 4px !important;
}

html body.exg-shell.exg-commerce-page.exg-commerce-library-page .woocommerce.exg-commerce-library__loop ul.products li.product > :is(a.button, a.added_to_cart):is(:hover, :focus-visible) {
	border: 0 !important;
	background: transparent !important;
	color: var(--exg-gold-deep) !important;
}

@media (min-width: 641px) and (max-width: 900px) {
	body.exg-shell.exg-catalog-page .exg-bracket-library__grid,
	body.exg-shell.exg-coverage-category-page .exg-coverage-category__grid,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products {
		gap: 16px !important;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card,
	body.exg-shell.exg-consumer-page .exg-consumer-product,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product {
		--exg-category-card-media-height: 164px;
		--exg-category-card-image-height: 156px;
		--exg-category-card-body-min: 88px;
	}

	body.exg-shell.exg-catalog-page.exg-vehicle-library-page.exg-market-pickup .exg-vehicle-card,
	body.exg-shell.exg-coverage-category-page.exg-market-pickup .exg-coverage-card,
	body.exg-shell.exg-commerce-category-page.term-light-duty-kits .exg-commerce-library__loop ul.products li.product {
		--exg-category-card-media-height: 194px;
		--exg-category-card-image-height: 186px;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card__media,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__media,
	body.exg-shell.exg-consumer-page .exg-consumer-product__image,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media {
		padding: 5px 5px 0 !important;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card__body,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__body,
	body.exg-shell.exg-consumer-page .exg-consumer-product > div,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-bracket-card__body {
		padding: 6px 8px 8px !important;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card :is(h2, h3),
	body.exg-shell.exg-coverage-category-page .exg-coverage-card h3,
	body.exg-shell.exg-consumer-page .exg-consumer-product h3,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card h3,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
		min-height: 0;
		max-height: 2.08em;
		font: var(--exg-weight-display) clamp(16px, 2.35vw, 18px)/1.04 var(--exg-display) !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__link > img {
		height: var(--exg-category-card-media-height) !important;
		min-height: var(--exg-category-card-media-height) !important;
		padding: 5px 5px 0 !important;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__price {
		margin-top: 2px !important;
		font-size: 13px;
		line-height: 16px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__fits {
		margin-top: 2px;
		font-size: 11px;
		line-height: 15px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__excerpt {
		display: none !important;
	}
}

@media (max-width: 640px) {
	body.exg-shell.exg-catalog-page .exg-bracket-library__grid,
	body.exg-shell.exg-coverage-category-page .exg-coverage-category__grid,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 12px !important;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-products > .exg-consumer-container {
		width: calc(100% - 32px);
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card,
	body.exg-shell.exg-consumer-page .exg-consumer-product,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product {
		--exg-category-card-media-height: 116px;
		--exg-category-card-image-height: 110px;
		--exg-category-card-body-min: 80px;
		min-height: calc(var(--exg-category-card-media-height) + var(--exg-category-card-body-min) + 2px);
	}

	body.exg-shell.exg-catalog-page.exg-vehicle-library-page.exg-market-pickup .exg-vehicle-card,
	body.exg-shell.exg-coverage-category-page.exg-market-pickup .exg-coverage-card,
	body.exg-shell.exg-commerce-category-page.term-light-duty-kits .exg-commerce-library__loop ul.products li.product {
		--exg-category-card-media-height: 152px;
		--exg-category-card-image-height: 146px;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card__media,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__media,
	body.exg-shell.exg-consumer-page .exg-consumer-product__image,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media {
		padding: 4px 4px 0 !important;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card__body,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__body,
	body.exg-shell.exg-consumer-page .exg-consumer-product > div,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-bracket-card__body {
		padding: 4px 5px 6px !important;
	}

	body.exg-shell.exg-catalog-page .exg-bracket-card :is(h2, h3),
	body.exg-shell.exg-coverage-category-page .exg-coverage-card h3,
	body.exg-shell.exg-consumer-page .exg-consumer-product h3,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card h3,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
		min-height: 0;
		max-height: 2.08em;
		font: var(--exg-weight-display) clamp(13px, 3.75vw, 15px)/1.04 var(--exg-display) !important;
	}

	body.exg-shell.exg-catalog-page :is(.exg-bracket-card__meta, .exg-vehicle-card__detail),
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__meta,
	body.exg-shell.exg-consumer-page .exg-consumer-product > div > p,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__detail,
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .price {
		min-height: 12px;
		margin-bottom: 2px !important;
		font-size: 9px !important;
		line-height: 11px !important;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__price {
		margin-top: 2px !important;
		font-size: 12px;
		line-height: 16px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__fits {
		margin-top: 2px;
		font-size: 10px;
		line-height: 14px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__excerpt {
		display: none !important;
	}

	body.exg-shell.exg-catalog-page .exg-guard-card__actions,
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__actions,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-guard-card__actions {
		gap: 4px !important;
		padding-top: 0 !important;
	}

	body.exg-shell.exg-catalog-page :is(.exg-guard-card__actions a, .exg-bracket-card__action),
	body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details),
	body.exg-shell.exg-consumer-page :is(.exg-consumer-text-link, .exg-consumer-product-grid--ecommerce .exg-vehicle-card__action),
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart) {
		min-height: 44px;
		gap: 3px;
		padding: 4px 1px !important;
		font-size: 10px !important;
		line-height: 12px !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__link > img {
		height: var(--exg-category-card-media-height) !important;
		min-height: var(--exg-category-card-media-height) !important;
		padding: 4px 4px 0 !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
		width: calc(100% - 10px);
		min-height: 0;
		max-height: 2.08em;
		margin: 4px 5px 0 !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products li.product {
		min-height: 226px;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .price {
		width: calc(100% - 10px);
		margin: 0 5px 1px !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart) {
		width: calc(100% - 10px);
		margin: 0 5px 6px !important;
	}

	html body.exg-shell.exg-commerce-page.exg-commerce-library-page .woocommerce.exg-commerce-library__loop ul.products li.product > :is(a.button, a.added_to_cart) {
		padding: 4px 1px !important;
		font-size: 10px !important;
		line-height: 12px !important;
	}

	/* Preserve one card width when a real catalog contains an odd total. */
	body.exg-shell.exg-catalog-page .exg-bracket-library__grid > :last-child:nth-child(odd),
	body.exg-shell.exg-coverage-category-page .exg-coverage-category__grid > :last-child:nth-child(odd),
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid > :last-child:nth-child(odd),
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop ul.products > li.product:last-child:nth-child(odd) {
		width: calc((100% - 12px) / 2) !important;
		grid-column: 1 / -1 !important;
		justify-self: center;
	}
}