/*
 * Shared mobile quality layer.
 *
 * This file loads after page styles and the shell boundary. Keep it focused on
 * cross-template phone behavior: readable type, efficient spacing, reliable
 * touch targets, and containment of decorative or off-canvas overflow.
 */

@media (max-width: 1020px) {
	body.exg-shell {
		overflow-x: clip;
	}

	body.exg-shell #exg-drawer-root {
		max-width: 100vw;
		overflow-x: clip;
	}

	body.exg-shell .exg-v2-mobile-actions {
		gap: 8px;
	}

	body.exg-shell .exg-v2-mobile-actions > :where(a, button),
	body.exg-shell :where(.exg-v2-search-button, .exg-v2-menu-button, .exg-cart-link, .exg-v2-account-link) {
		box-sizing: border-box;
		width: 44px;
		height: 44px;
		min-width: 44px;
		min-height: 44px;
	}

	body.exg-shell .exg-v2-mobile-actions .exg-cart-count {
		top: 1px;
		right: 1px;
		box-sizing: border-box;
		min-width: 18px;
		height: 18px;
		line-height: 18px;
		z-index: 1;
	}

	body.exg-shell .exg-v2-mobile-nav {
		max-width: 100vw;
		overscroll-behavior: contain;
	}

	body.exg-shell .exg-v2-mobile-nav.is-open {
		padding-bottom: max(24px, env(safe-area-inset-bottom));
	}

	body.exg-shell .exg-v2-mobile-mega > summary,
	body.exg-shell .exg-v2-mobile-mega__group > summary,
	body.exg-shell .exg-v2-mobile-nav li a {
		box-sizing: border-box;
		display: flex;
		min-height: 44px;
		align-items: center;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group > summary {
		display: grid;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__content {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		padding: 8px 0 12px;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group {
		min-width: 0;
		border: 1px solid #dedede;
		border-radius: 6px;
		background: #f7f7f5;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group[open] {
		grid-column: 1 / -1;
		border-color: color-mix(in srgb, var(--exg-shell-accent), #000 15%);
		background: #fff;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group > summary {
		min-height: 66px;
		align-content: center;
		gap: 3px;
		padding: 10px 30px 10px 11px;
		color: var(--exg-black);
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group > summary span {
		font-family: var(--exg-display);
		font-size: 16px;
		font-weight: var(--exg-weight-action);
		line-height: 1;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group > summary small {
		color: #686868;
		font-size: 8px;
		font-weight: var(--exg-weight-strong);
		letter-spacing: 0.055em;
		line-height: 1.2;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1px 10px;
		padding: 4px 10px 10px;
	}

	body.exg-shell .exg-v2-mobile-mega--vehicles .exg-v2-mobile-mega__group li a {
		min-height: 44px;
		align-items: center;
		padding: 7px 4px;
		border-top: 1px solid #ececec;
		font-size: 11px !important;
		line-height: 15px !important;
	}

	/* Tablets use the mobile navigation and need the same reliable targets. */
	body.exg-shell :where(
		input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
		select,
		textarea
	) {
		font-size: 16px !important;
	}

	body.exg-shell :where(select, #exg-catalog-model) {
		min-height: 44px;
	}

	body.exg-shell .gform_wrapper :is(.gchoice, .ginput_container_consent) {
		min-height: 44px;
		align-items: center !important;
	}

	body.exg-shell .gform_wrapper :is(.gchoice, .ginput_container_consent) label {
		display: flex !important;
		min-height: 44px;
		align-items: center;
	}

	body.exg-shell.exg-home-v2 .exg-v2-product__switcher button {
		min-height: 44px;
	}

	body.exg-shell:is(.single-pick-ups, .single-vans) .pickup-pdp-fitment__change {
		display: inline-flex;
		min-height: 44px;
		align-items: center;
		padding-block: 8px;
		font-size: 12px;
	}

	body.exg-shell :where(.fleet-videos__arrow, .fleet-lightbox__close) {
		width: 44px;
		height: 44px;
		min-width: 44px;
		min-height: 44px;
	}

	body.exg-shell .fleet-calc__advanced summary {
		display: flex;
		min-height: 44px;
		align-items: center;
	}

	body.exg-resources-page .exg-resources-hero,
	body.exg-shell .exg-commerce-page-hero,
	body.exg-semi-page .exg-semi-store,
	body.exg-shell :where(#wpsl-gmap, .wpsl-gmap-canvas, .wpsl-map) {
		overflow: clip;
	}

	body.exg-resources-page .exg-resources-hero::after {
		right: 0;
		width: 70%;
	}
}

@media (max-width: 640px) {
	body.exg-shell {
		--exg-type-hero-size: clamp(38px, 10.5vw, 42px);
		--exg-type-hero-line: 1.02;
		--exg-type-section-size: clamp(34px, 9.2vw, 38px);
		--exg-type-section-line: 1.08;
		--exg-type-card-size: clamp(27px, 7.5vw, 30px);
		--exg-type-card-line: 1.08;
		--exg-section-space: 52px;
		--exg-section-space-compact: 40px;
		--exg-form-control-size: 16px;
		--exg-form-select-size: 16px;
	}

	body.exg-shell .exg-v2-primary__inner {
		padding-inline: var(--exg-shell-rail-gutter);
	}

	body.exg-shell #main-content,
	body.exg-shell main {
		max-width: 100%;
	}

	body.exg-shell :where(img, video, iframe) {
		max-width: 100%;
	}

	body.exg-shell iframe {
		width: 100%;
	}

	body.exg-pickup-page .exg-pickup-hero h1,
	body.exg-consumer-page .exg-consumer-hero h1,
	body.exg-semi-page .exg-semi-hero h1 {
		font-size: clamp(37px, 10vw, 40px) !important;
		line-height: 1 !important;
	}

	body.exg-shell.exg-home-v2 .exg-v2-product__switcher button {
		font-size: 11px;
		letter-spacing: 0.03em;
	}

	body.exg-shell .exg-v2-footer-menu a,
	body.exg-shell :where(.exg-v2-icon-link, .exg-v2-socials a) {
		min-height: 44px;
	}

	body.exg-shell .exg-v2-footer {
		padding: 27px var(--exg-shell-rail-gutter) 0;
	}

	body.exg-shell .exg-v2-footer__main {
		width: 100%;
		min-width: 0;
		gap: 20px;
	}

	body.exg-shell .exg-v2-footer__brand {
		display: block;
		min-width: 0;
	}

	body.exg-shell .exg-v2-footer__brand :is(.exg-v2-footer__tagline, .exg-v2-footer__description) {
		display: none;
	}

	body.exg-shell .exg-v2-footer__brand address {
		margin: 12px 0 5px;
		font-size: 12px;
		line-height: 17px;
	}

	body.exg-shell .exg-v2-footer__phone {
		grid-column: auto;
		margin-bottom: 8px;
	}

	body.exg-shell .exg-v2-socials {
		grid-column: auto;
	}

	body.exg-shell .exg-v2-footer__links {
		width: 100%;
		min-width: 0;
		display: block;
	}

	body.exg-shell .exg-v2-footer__group {
		border-top: 1px solid rgba(255, 255, 255, 0.18);
	}

	body.exg-shell .exg-v2-footer__group:last-child {
		border-bottom: 1px solid rgba(255, 255, 255, 0.18);
	}

	body.exg-shell .exg-v2-footer__group > summary {
		position: relative;
		display: flex;
		min-height: 44px;
		align-items: center;
		margin: 0;
		padding-right: 28px;
		font-size: 12px;
		cursor: pointer;
	}

	body.exg-shell .exg-v2-footer__group > summary::after {
		position: absolute;
		right: 4px;
		content: "+";
		color: #fff;
		font-size: 18px;
		font-weight: var(--exg-weight-regular);
	}

	body.exg-shell .exg-v2-footer__group[open] > summary::after {
		content: "−";
	}

	body.exg-shell .exg-v2-footer__group .exg-v2-footer-menu {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding: 0 0 10px;
	}

	body.exg-shell .exg-v2-footer__group .exg-v2-footer-menu a {
		display: flex;
		min-height: 38px;
		align-items: center;
		padding: 5px 8px 5px 0;
		font-size: 12px;
		line-height: 15px;
	}

	body.exg-shell .exg-v2-footer__legal {
		padding-top: 12px;
	}

	body.exg-shell .exg-v2-footer__legal-row {
		gap: 6px;
		padding-bottom: 10px;
	}

	body.exg-shell .exg-v2-footer__legal-row nav {
		display: grid;
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 12px;
	}

	body.exg-shell .exg-v2-footer__legal-row nav a {
		display: flex;
		width: auto;
		min-height: 38px;
		align-items: center;
		font-size: 10px;
		line-height: 13px;
	}

	body.exg-shell .exg-v2-footer__disclaimers {
		padding: 0;
	}

	body.exg-shell .exg-v2-footer__disclaimers > summary {
		display: flex;
		min-height: 44px;
		align-items: center;
		justify-content: space-between;
		color: rgba(255, 255, 255, 0.72);
		font-size: 9px;
		font-weight: var(--exg-weight-strong);
		letter-spacing: 0.06em;
		list-style: none;
		cursor: pointer;
	}

	body.exg-shell .exg-v2-footer__disclaimers > summary::after {
		content: "+";
		font-size: 16px;
	}

	body.exg-shell .exg-v2-footer__disclaimers[open] > summary::after {
		content: "−";
	}

	body.exg-shell .exg-v2-footer__disclaimers > p {
		padding: 0 0 12px;
	}

	body.exg-shell .exg-v2-footer__country {
		padding: 9px 0;
		font-size: 9px;
	}

	/* Heavy-duty PDP actions and swatches should read like the light-duty buybox. */
	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp a.product__button {
		display: flex !important;
		width: 100% !important;
		min-height: 50px !important;
		align-items: center !important;
		justify-content: center !important;
		margin: 2px 0 0 !important;
		padding: 0 18px !important;
		border: 2px solid var(--exg-gold) !important;
		border-radius: 4px !important;
		background: var(--exg-gold) !important;
		color: var(--exg-black) !important;
		font-family: var(--exg-display) !important;
		font-size: 18px !important;
		font-weight: var(--exg-weight-action) !important;
		line-height: 1 !important;
		text-decoration: none !important;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp a.product__button::after {
		margin-left: 14px;
		content: "→";
		font-family: var(--exg-body);
		font-size: 18px;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp :is(.product__select-color-guard-select, .product__color-picker) {
		min-height: 32px;
		gap: 6px;
		margin: 4px 0 !important;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp .product__color-picker-wrapper {
		gap: 0;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp :is(.product__select-color-guard-img, .product__color-picker-wrapper-item) {
		position: relative;
		box-sizing: border-box;
		width: 17px !important;
		height: 17px !important;
		margin: 0 !important;
		border: 1px solid rgba(10, 10, 10, 0.28);
		border-radius: 50%;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp :is(.product__select-color-guard-item.active .product__select-color-guard-img, .product__color-picker-wrapper-item.active) {
		outline: 2px solid var(--exg-gold) !important;
		outline-offset: 2px !important;
		box-shadow: 0 0 0 1px var(--exg-black);
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp :is(.product__select-color-guard-item.active .product__select-color-guard-img, .product__color-picker-wrapper-item.active)::before {
		display: none !important;
		content: none !important;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp .product__guard-category {
		min-height: 44px;
		margin-top: 6px !important;
		padding-block: 8px !important;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp .product__guard-wrapper.active {
		gap: 7px;
		padding: 7px;
	}

	body.exg-shell:is(.single-trucks, .single-rv) .exg-unified-pdp .product__guard-item {
		min-height: 64px;
		padding: 6px 8px;
	}

	/* Keep intentional horizontal data regions touch-scrollable and contained. */
	body.exg-shell :where(.exg-gen3-table-wrap, .exg-gen3-jump__inner) {
		max-width: 100%;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
	}

	body.exg-generation-three-page .exg-gen3-jump__inner {
		min-height: 52px;
		flex-wrap: nowrap;
		gap: 0;
		padding-block: 0;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-padding-inline: 18px;
		scroll-snap-type: inline proximity;
		scrollbar-width: none;
	}

	body.exg-generation-three-page .exg-gen3-jump__inner::-webkit-scrollbar {
		display: none;
	}

	body.exg-generation-three-page .exg-gen3-jump__inner :where(span, a) {
		display: inline-flex;
		min-height: 52px;
		align-items: center;
		padding-inline: 12px;
		scroll-snap-align: start;
		white-space: nowrap;
	}

	body.exg-generation-three-page .exg-gen3-jump__inner span {
		width: auto;
		margin-right: 4px;
		padding-left: 0;
		padding-right: 16px;
		border-right: 1px solid rgba(10, 10, 10, 0.32);
		border-bottom: 0;
	}

	body.exg-native-features-page .exg-features-jump__inner {
		min-height: 0;
		flex-wrap: wrap;
		gap: 0 16px;
		padding-block: 6px;
		overflow-x: visible;
		white-space: normal;
	}

	body.exg-native-features-page .exg-features-jump__inner :where(span, a) {
		display: inline-flex;
		min-height: 44px;
		align-items: center;
	}

	body.exg-native-features-page .exg-features-jump__inner span {
		width: 100%;
		border-bottom: 1px solid rgba(10, 10, 10, 0.14);
	}

	/* Compact, fully tappable language control that does not cover CTAs. */
	body.exg-shell #gt_float_wrapper {
		top: auto !important;
		right: 12px !important;
		bottom: max(12px, env(safe-area-inset-bottom)) !important;
		left: auto !important;
		z-index: 90 !important;
	}

	body.exg-shell #gt_float_wrapper .gt_float_switcher {
		width: 44px !important;
		min-width: 44px;
		border-radius: 999px !important;
		box-shadow: 0 4px 16px rgba(10, 10, 10, 0.22) !important;
		transform: none;
		overflow: visible;
	}

	body.exg-shell #gt_float_wrapper :is(.gt-selected, .gt-current-lang) {
		box-sizing: border-box;
		width: 44px !important;
		height: 44px !important;
		min-height: 44px;
		border-radius: 999px !important;
	}

	body.exg-shell #gt_float_wrapper .gt-current-lang {
		display: flex !important;
		align-items: center;
		justify-content: center;
		padding: 0 !important;
	}

	body.exg-shell #gt_float_wrapper .gt-current-lang img {
		width: 22px !important;
		height: auto !important;
		margin: 0 !important;
	}

	body.exg-shell #gt_float_wrapper :is(.gt-lang-code, .gt_float_switcher-arrow) {
		display: none !important;
	}

	body.exg-shell #gt_float_wrapper .gt_options {
		position: absolute !important;
		right: 0;
		bottom: calc(100% + 8px);
		width: min(240px, calc(100vw - 24px)) !important;
		max-height: min(60vh, 420px);
		overflow-y: auto;
		border-radius: 6px !important;
		background: var(--exg-white);
		box-shadow: 0 10px 30px rgba(10, 10, 10, 0.24);
	}
}

@media (max-width: 360px) {
	body.exg-shell .exg-v2-primary__inner {
		padding-inline: 8px;
		gap: 4px;
	}

	body.exg-shell .exg-v2-logo {
		width: 132px;
		flex: 0 0 132px;
	}

	body.exg-shell:is(.exg-market-pickup, .exg-market-van) .exg-v2-logo {
		width: 100px;
		flex-basis: 100px;
	}

	body.exg-shell .exg-v2-mobile-actions__commerce > .exg-v2-account-link {
		display: none;
	}

	body.exg-shell .exg-v2-mobile-actions {
		gap: 4px;
	}
}

/* The top-level market landings begin with the chooser itself. This compact
 * title deck replaces the former photo hero without creating another banner. */
body.exg-shell:is(.exg-semi-page, .exg-pickup-page, .exg-consumer-page--van, .exg-consumer-page--rv)
	:is(.exg-semi-makes, .exg-pickup-finder, .exg-consumer-finder) {
	padding-top: 0;
	background: #f5f5f2;
}

body.exg-shell .exg-category-masthead {
	position: relative;
	display: grid;
	box-sizing: border-box;
	min-height: 122px;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	margin: 0 0 16px;
	padding: 24px 0 22px;
}

body.exg-shell .exg-category-masthead__copy {
	min-width: 0;
}

body.exg-shell .exg-category-masthead__kicker {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 7px;
	color: #765900;
	font-size: 11px;
	font-weight: var(--exg-weight-strong);
	letter-spacing: 0.14em;
	line-height: 14px;
}

body.exg-shell .exg-category-masthead__kicker::before {
	width: 8px;
	height: 8px;
	flex: 0 0 8px;
	background: var(--exg-gold);
	content: "";
}

body.exg-shell .exg-category-masthead h1 {
	max-width: 820px;
	margin: 0 0 6px;
	color: var(--exg-black);
	font-size: clamp(42px, 4vw, 56px);
	line-height: 0.92;
	text-wrap: balance;
}

body.exg-shell .exg-category-masthead__lede {
	max-width: 680px;
	margin: 0;
	color: #5d5d59;
	font-size: 15px;
	line-height: 21px;
}

/* All four vehicle-category landings share one content edge. */
body.exg-shell:is(.exg-semi-page, .exg-pickup-page, .exg-consumer-page--van, .exg-consumer-page--rv)
	:is(.exg-semi-container, .exg-pickup-container, .exg-consumer-container) {
	width: min(
		var(--exg-shell-rail-max),
		calc(100% - var(--exg-shell-rail-gutter) - var(--exg-shell-rail-gutter))
	);
	margin-right: auto;
	margin-left: auto;
}

/* Brand and product type form one heading while retaining a quick visual split. */
body.exg-shell .exg-category-brand-heading {
	display: grid;
	width: 100%;
	gap: 2px;
	margin: 0;
	padding: 0;
	color: var(--exg-black);
	font-family: var(--exg-display);
	font-style: normal;
	font-weight: var(--exg-weight-display);
	letter-spacing: 0;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
}

body.exg-shell .exg-category-brand-heading__name {
	display: block;
	font-size: clamp(18px, 1.45vw, 21px);
	line-height: 1;
	white-space: nowrap;
}

body.exg-shell .exg-category-brand-heading__product {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	color: #765900;
	font-size: 11px;
	font-weight: var(--exg-weight-action);
	letter-spacing: 0.06em;
	line-height: 14px;
}

body.exg-shell .exg-category-brand-heading__product::after {
	display: block;
	width: 12px;
	height: 12px;
	flex: 0 0 12px;
	background: url("../home-v2/images/chevron-dark.svg") center / contain no-repeat;
	content: "";
}

@media (min-width: 761px) {
	body.exg-shell.exg-semi-page .exg-semi-make,
	body.exg-shell.exg-pickup-page .exg-pickup-make,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brand {
		height: 188px;
	}

	body.exg-shell.exg-semi-page .exg-semi-make > img,
	body.exg-shell.exg-pickup-page .exg-pickup-make > img,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brand > img {
		width: min(288px, calc(100% + 20px));
		height: 128px;
		flex-basis: 128px;
	}

	/* Pickup make cards are the category PLP entry point; give the vehicle art
	 * more room without enlarging the equivalent Semi, Van, or RV cards. */
	body.exg-shell.exg-pickup-page .exg-pickup-make {
		height: 214px;
	}

	body.exg-shell.exg-pickup-page .exg-pickup-make > img {
		height: 154px;
		flex-basis: 154px;
	}
}

@media (max-width: 760px) {
	body.exg-shell:is(.exg-semi-page, .exg-pickup-page, .exg-consumer-page--van, .exg-consumer-page--rv)
		:is(.exg-semi-makes, .exg-pickup-finder, .exg-consumer-finder) {
		padding-top: 0;
		padding-bottom: 20px;
	}

	body.exg-shell .exg-category-masthead {
		min-height: 0;
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
		margin-bottom: 12px;
		padding: 16px 0 14px;
		overflow: visible;
	}

	body.exg-shell .exg-category-masthead__kicker {
		gap: 7px;
		margin-bottom: 5px;
		font-size: 10px;
		line-height: 12px;
	}

	body.exg-shell .exg-category-masthead__kicker::before {
		width: 7px;
		height: 7px;
		flex-basis: 7px;
	}

	body.exg-shell .exg-category-masthead h1 {
		max-width: none;
		margin-bottom: 5px;
		font-size: clamp(30px, 8vw, 34px);
		line-height: 0.94;
	}

	body.exg-shell .exg-category-masthead__lede {
		font-size: 12px;
		line-height: 16px;
	}

	body.exg-shell .exg-category-brand-heading__name {
		font-size: clamp(15px, 4.4vw, 18px);
	}

	body.exg-shell .exg-category-brand-heading__product {
		font-size: 10px;
		line-height: 12px;
	}

	body.exg-shell .exg-category-brand-heading__product::after {
		width: 11px;
		height: 11px;
		flex-basis: 11px;
	}

}

/* One clear heading hierarchy for the shared category-page vehicle finder. */
body.exg-shell .exg-vehicle-finder__intro strong {
	color: #fff;
	font-family: var(--exg-display);
	font-size: 18px;
	font-weight: var(--exg-weight-display);
	letter-spacing: 0.01em;
	line-height: 22px;
}

body.exg-shell .exg-vehicle-finder__intro span {
	color: #c8c8c8;
	font-size: 11px;
	font-weight: var(--exg-weight-semibold);
	letter-spacing: 0.025em;
	line-height: 16px;
}

@media (max-width: 1050px) {
	body.exg-shell .exg-vehicle-finder__intro {
		display: flex;
		min-height: 0;
		flex-direction: row;
		align-items: baseline;
		justify-content: space-between;
		gap: 12px;
		padding-bottom: 10px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.18);
		text-align: left;
	}

	body.exg-shell .exg-vehicle-finder__intro strong {
		flex: 0 0 auto;
		font-size: 22px;
		line-height: 24px;
	}

	body.exg-shell .exg-vehicle-finder__intro span {
		min-width: 0;
		color: var(--exg-gold);
		text-align: right;
		white-space: nowrap;
	}
}

@media (max-width: 360px) {
	body.exg-shell .exg-vehicle-finder__intro {
		gap: 8px;
	}

	body.exg-shell .exg-vehicle-finder__intro strong {
		font-size: 20px;
		line-height: 22px;
	}

	body.exg-shell .exg-vehicle-finder__intro span {
		font-size: 10px;
		line-height: 14px;
	}
}

/* Every primary vehicle-market landing keeps its brand chooser two-up on
 * phones. Pickup, RV and van use different card components than semi, so the
 * shared mobile layer gives them the same compact visual rhythm. */
@media (max-width: 640px) {
	body.exg-shell.exg-semi-page .exg-semi-make-grid,
	body.exg-shell.exg-pickup-page .exg-pickup-makes,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}

	body.exg-shell.exg-semi-page .exg-semi-make,
	body.exg-shell.exg-pickup-page .exg-pickup-make,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand {
		display: flex;
		height: 150px;
		min-height: 0;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 0;
		padding: 4px 6px 6px;
		text-align: center;
	}

	body.exg-shell.exg-semi-page .exg-semi-make > img,
	body.exg-shell.exg-pickup-page .exg-pickup-make > img,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand > img {
		order: 1;
		width: 100%;
		height: 96px;
		flex: 0 0 96px;
		object-fit: contain;
		object-position: center bottom;
	}

	body.exg-shell.exg-pickup-page .exg-pickup-make {
		height: 184px;
	}

	body.exg-shell.exg-pickup-page .exg-pickup-make > img {
		height: 128px;
		flex-basis: 128px;
	}

	body.exg-shell.exg-semi-page .exg-semi-make__copy,
	body.exg-shell.exg-pickup-page .exg-pickup-make__copy,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand__copy {
		order: 2;
		display: grid;
		width: 100%;
		min-width: 0;
		align-self: auto;
		align-items: center;
		justify-content: center;
		justify-items: center;
		gap: 4px;
		margin-top: auto;
	}

	body.exg-shell.exg-semi-page .exg-semi-make__copy strong,
	body.exg-shell.exg-pickup-page .exg-pickup-make__copy strong,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand__copy strong {
		font-size: clamp(13px, 3.9vw, 16px);
		line-height: 1.05;
		overflow-wrap: anywhere;
		text-wrap: balance;
		white-space: normal;
	}

	body.exg-shell.exg-semi-page .exg-semi-make__copy small,
	body.exg-shell.exg-pickup-page .exg-pickup-make__copy small,
	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand__link {
		font-size: 9px;
		line-height: 11px;
		white-space: nowrap;
	}

	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands .exg-consumer-brand__link {
		order: 3;
		align-self: auto;
		margin: 3px 0 0;
	}

	body.exg-shell:is(.exg-consumer-page--van, .exg-consumer-page--rv) .exg-consumer-brands > :last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}

/* Let feature cards end with their content throughout the shared mobile/tablet
 * shell instead of retaining the desktop minimum height and a false gutter. */
@media (max-width: 1020px) {
	body.exg-shell.exg-pickup-page .exg-pickup-strength__cards article,
	body.exg-shell.exg-consumer-page .exg-consumer-features article {
		min-height: 0;
	}
}

/* Product libraries stay scannable on phones: two compact cards per row,
 * regardless of whether the catalog comes from a vehicle term, guard archive,
 * coverage taxonomy, consumer landing page, bracket archive or WooCommerce. */
@media (max-width: 640px) {
	body.exg-shell.exg-bracket-library-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 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-library__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce {
		gap: 12px;
	}

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

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card__media,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media {
		min-height: 148px;
		padding: 6px 6px 0;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card__media img,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__media img {
		height: 140px;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card .exg-bracket-card__body,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card .exg-bracket-card__body {
		min-height: 0;
		padding: 7px 7px 8px;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card .exg-bracket-card__body h3,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card .exg-bracket-card__body h3 {
		margin-bottom: 0;
		font-size: clamp(14px, 4vw, 16px);
		line-height: 1.08;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card__detail,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card__detail {
		margin-bottom: 2px;
		font-size: 9px;
		line-height: 12px;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card .exg-guard-card__actions,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card .exg-guard-card__actions {
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 6px;
		margin-top: 2px;
		padding-top: 0;
	}

	body.exg-catalog-page.exg-vehicle-library-page .exg-vehicle-card .exg-guard-card__actions .exg-vehicle-card__action,
	body.exg-shell.exg-consumer-page .exg-consumer-product-grid--ecommerce .exg-vehicle-card .exg-guard-card__actions .exg-vehicle-card__action {
		width: 100%;
		min-height: 44px;
		gap: 3px;
		font-size: 10px;
		line-height: 12px;
	}

	/* Guard, coverage-record and bracket-kit archives share one card system. */
	body.exg-shell.exg-bracket-library-page .exg-bracket-card__media {
		min-height: clamp(112px, 34vw, 132px);
		padding: 6px;
	}

	body.exg-shell.exg-bracket-library-page .exg-bracket-card__media img {
		height: clamp(102px, 31vw, 120px);
	}

	body.exg-shell.exg-bracket-library-page .exg-bracket-card__body {
		min-height: 0;
		padding: 8px;
	}

	body.exg-shell.exg-bracket-library-page .exg-bracket-card__meta {
		margin-bottom: 4px;
		font-size: 9px;
		line-height: 12px;
	}

	body.exg-shell.exg-bracket-library-page .exg-bracket-card :is(h2, h3) {
		margin-bottom: 2px;
		font-size: clamp(14px, 4vw, 16px);
		line-height: 1.08;
	}

	body.exg-shell.exg-bracket-library-page .exg-guard-card__actions {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: stretch;
		gap: 0 6px;
		margin-top: 2px;
	}

	body.exg-shell.exg-bracket-library-page :is(.exg-guard-card__actions a, .exg-bracket-card__action) {
		display: flex;
		width: 100%;
		min-height: 44px;
		align-items: center;
		justify-content: center;
		margin-top: 2px;
		padding: 4px 1px;
		font-size: 10px;
		line-height: 12px;
		text-align: center;
	}

	/* Coverage-kit taxonomy cards retain fitment and price, while the long
	 * teaser is omitted at this density because the details link remains. */
	body.exg-shell.exg-coverage-category-page .exg-coverage-card__media {
		min-height: clamp(112px, 34vw, 132px);
		padding: 6px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__media img {
		height: clamp(102px, 31vw, 120px);
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__body {
		padding: 9px 8px 10px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__meta {
		margin-bottom: 4px;
		font-size: 9px;
		letter-spacing: 0.035em;
		line-height: 12px;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card h3 {
		margin-bottom: 4px;
		font-size: clamp(14px, 4vw, 16px);
		line-height: 1.08;
	}

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__price {
		margin-bottom: 7px;
		font-size: 13px;
		line-height: 16px;
	}

	body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__fits, .exg-coverage-card__excerpt) {
		margin-bottom: 7px;
		font-size: 11px;
		line-height: 15px;
	}

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

	body.exg-shell.exg-coverage-category-page .exg-coverage-card__actions {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: stretch;
		gap: 0 6px;
		margin-top: 2px;
		padding-top: 0;
	}

	body.exg-shell.exg-coverage-category-page :is(.exg-coverage-card__buy, .exg-coverage-card__details) {
		width: 100%;
		min-height: 44px;
		justify-content: center;
		padding: 6px 2px;
		font-size: 10px;
		line-height: 12px;
		text-align: center;
	}

	/* RV and van landing pages use a separate featured-product component. */
	body.exg-shell.exg-consumer-page .exg-consumer-product {
		padding: 5px 6px 7px;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product__image {
		height: clamp(116px, 35vw, 136px);
		padding: 2px 3px 0;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product > div {
		padding: 5px 3px 2px;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product h3 {
		margin-bottom: 1px;
		font-size: clamp(14px, 4vw, 16px);
		line-height: 1.08;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product h3 a {
		width: 100%;
		justify-content: center;
	}

	body.exg-shell.exg-consumer-page .exg-consumer-product .exg-consumer-text-link {
		display: flex;
		min-height: 44px;
		align-items: center;
		justify-content: center;
		font-size: 10px;
		line-height: 12px;
		text-align: center;
	}

	/* WooCommerce shop/category loops use the same compact two-up rhythm. */
	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop .woocommerce-loop-product__title {
		margin-top: 6px !important;
		font-size: clamp(14px, 4vw, 16px) !important;
		line-height: 1.08 !important;
	}

	body.exg-shell.exg-commerce-library-page .exg-commerce-library__loop li.product > :is(.button, .added_to_cart) {
		min-height: 44px;
		margin-top: 4px !important;
		padding: 6px 4px !important;
		font-size: 10px !important;
		line-height: 12px !important;
	}

	/* Content totals are not always even. Let the real final product fill the
	 * row instead of hiding it or leaving an accidental empty card slot. */
	body.exg-shell.exg-bracket-library-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-catalog-page.exg-vehicle-library-page .exg-vehicle-library__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) {
		grid-column: 1 / -1;
	}
}

@media (max-width: 640px) {
	/* Color previews are product controls, not decorative dots. */
	body.exg-shell.single-pick-ups .pickup-vehicle-colors__swatches {
		display: grid;
		grid-template-columns: repeat(4, 44px);
		gap: 0;
		justify-content: flex-start;
	}

	body.exg-shell.single-pick-ups .pickup-vehicle-color {
		width: 36px;
		height: 36px;
		min-width: 36px;
		min-height: 36px;
		border-width: 5px;
	}
}

@media (max-width: 360px) {
	body.exg-shell.single-pick-ups .pickup-vehicle-colors__swatches {
		display: grid;
		grid-template-columns: repeat(4, 44px);
	}
}

/* Header finder recovery states are shared by the homepage and interior shell. */
body.exg-shell .exg-header-finder__status {
	min-height: 20px;
	margin: 6px 0 12px;
	color: #62686d;
	font-size: 11px;
	font-weight: var(--exg-weight-strong);
	letter-spacing: 0.05em;
	line-height: 18px;
}

body.exg-shell .exg-header-finder.is-loading .exg-header-finder__status {
	color: var(--exg-black);
}

body.exg-shell .exg-header-finder__browse {
	display: inline-flex;
	box-sizing: border-box;
	min-height: 44px;
	align-items: center;
	align-self: flex-start;
	gap: 8px;
	margin-top: 10px;
	padding: 0 2px;
	border-bottom: 2px solid var(--exg-market-accent);
	color: var(--exg-black);
	font-size: 11px;
	font-weight: var(--exg-weight-strong);
	letter-spacing: 0.04em;
	line-height: 16px;
	text-decoration: none;
}

body.exg-shell .exg-header-finder__browse:is(:hover, :focus-visible) {
	color: color-mix(in srgb, var(--exg-market-accent), var(--exg-black) 35%);
}

@media (max-width: 660px) {
	body.exg-shell .exg-header-finder__status {
		margin-block: 4px 10px;
		font-size: 12px;
		line-height: 18px;
	}

	body.exg-shell .exg-header-finder__browse {
		width: 100%;
		min-height: 44px;
		justify-content: center;
		margin-top: 10px;
		padding-inline: 14px;
		border: 1px solid #aeb7bd;
		border-radius: 4px;
		background: #fff;
		font-size: 12px;
		text-align: center;
	}
}

/* Image-backed editorial heroes follow the category-landing mobile contract:
 * a clear photograph first, a compact black copy panel second, and one gold
 * divider between them. This keeps the photography visible instead of turning
 * each page into another full-height dark overlay. */
@media (max-width: 760px) {
	body.exg-native-features-page .exg-features-hero,
	body.exg-native-feature-detail-page .exg-feature-detail-hero,
	body.exg-generation-three-page .exg-gen3-hero,
	body.exg-fuel-economy-page .exg-fuel-hero,
	body.exg-deer-page .exg-deer-hero,
	body.exg-truck-life-page .exg-truck-life-hero,
	body.exg-education-page .exg-education-hero--image,
	body.exg-fleet-vertical-page .exg-fleet-hero,
	body.exg-six-pack-page .exg-six-pack-hero,
	body.exg-fleet-page .fleet-hero--banner.has-image {
		--exg-mobile-story-media: clamp(200px, 56vw, 220px);
		position: relative;
		display: block;
		box-sizing: border-box;
		height: auto;
		min-height: 0;
		padding: var(--exg-mobile-story-media) 0 0;
		border-top: 6px solid var(--exg-gold, #ffc800);
		background: var(--exg-black, #0a0a0a);
		color: #fff;
	}

	/* Retire the full-height mobile veils and decorative slashes. */
	body.exg-native-features-page .exg-features-hero::before,
	body.exg-native-feature-detail-page .exg-feature-detail-hero::before,
	body.exg-native-feature-detail-page .exg-feature-detail-hero::after,
	body.exg-generation-three-page .exg-gen3-hero::after,
	body.exg-deer-page .exg-deer-hero::before,
	body.exg-deer-page .exg-deer-hero::after,
	body.exg-truck-life-page .exg-truck-life-hero::before,
	body.exg-education-page .exg-education-hero--image::after,
	body.exg-fleet-vertical-page .exg-fleet-hero::after,
	body.exg-six-pack-page .exg-six-pack-hero::before {
		content: none;
	}

	body.exg-fuel-economy-page .exg-fuel-hero__overlay,
	body.exg-fleet-page .fleet-hero__overlay,
	body.exg-education-page .exg-education-hero--image .exg-education-hero__background::after {
		display: none;
	}

	/* The first 200-220px are reserved exclusively for the page photography. */
	body.exg-native-features-page .exg-features-hero__media,
	body.exg-native-feature-detail-page .exg-feature-detail-hero__media,
	body.exg-generation-three-page .exg-gen3-hero__media,
	body.exg-fuel-economy-page .exg-fuel-hero__media,
	body.exg-deer-page .exg-deer-hero__media,
	body.exg-truck-life-page .exg-truck-life-hero__media,
	body.exg-education-page .exg-education-hero--image .exg-education-hero__background,
	body.exg-fleet-vertical-page .exg-fleet-hero__media,
	body.exg-six-pack-page .exg-six-pack-hero__background,
	body.exg-fleet-page .fleet-hero__media {
		position: absolute;
		z-index: 0;
		inset: 0 0 auto;
		display: block;
		box-sizing: border-box;
		width: 100%;
		height: var(--exg-mobile-story-media);
		min-height: 0;
		overflow: hidden;
		border-bottom: 4px solid var(--exg-gold, #ffc800);
	}

	body.exg-native-features-page .exg-features-hero__media img,
	body.exg-native-feature-detail-page .exg-feature-detail-hero__media img,
	body.exg-generation-three-page .exg-gen3-hero__media img,
	body.exg-fuel-economy-page .exg-fuel-hero__media img,
	body.exg-deer-page .exg-deer-hero__media img,
	body.exg-truck-life-page .exg-truck-life-hero__media img,
	body.exg-education-page .exg-education-hero--image .exg-education-hero__background img,
	body.exg-fleet-vertical-page .exg-fleet-hero__media img,
	body.exg-six-pack-page .exg-six-pack-hero__background img,
	body.exg-fleet-page .fleet-hero__media img {
		position: static;
		display: block;
		width: 100%;
		height: 100%;
		min-height: 0;
		object-fit: cover;
		opacity: 1;
	}

	body.exg-native-features-page .exg-features-hero__media img {
		object-position: 52% center;
	}

	body.exg-generation-three-page .exg-gen3-hero__media img {
		object-position: 64% center;
	}

	body.exg-fuel-economy-page .exg-fuel-hero__media img {
		object-position: 62% center;
	}

	body.exg-truck-life-page .exg-truck-life-hero__media img {
		object-position: center top;
	}

	body.exg-fleet-page .fleet-hero__media img {
		object-position: 62% center;
	}

	/* Direct-content heroes use the content container as their black panel. */
	body.exg-native-features-page .exg-features-hero__content,
	body.exg-fuel-economy-page .exg-fuel-hero__content,
	body.exg-deer-page .exg-deer-hero__content {
		position: relative;
		z-index: 1;
		display: block;
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		min-height: 0;
		margin: 0;
		padding: 22px 20px 24px;
		background: var(--exg-black, #0a0a0a);
	}

	/* Nested-copy heroes first shed their inherited viewport-height shell. */
	body.exg-native-feature-detail-page .exg-feature-detail-hero__inner,
	body.exg-generation-three-page .exg-gen3-hero__inner,
	body.exg-truck-life-page .exg-truck-life-hero__inner,
	body.exg-education-page .exg-education-hero--image .exg-education-hero__inner,
	body.exg-fleet-vertical-page .exg-fleet-hero__inner,
	body.exg-six-pack-page .exg-six-pack-hero__inner {
		position: relative;
		z-index: 1;
		display: block;
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		min-height: 0;
		margin: 0;
		padding: 0;
		background: var(--exg-black, #0a0a0a);
	}

	body.exg-native-feature-detail-page .exg-feature-detail-hero__copy,
	body.exg-generation-three-page .exg-gen3-hero__copy,
	body.exg-truck-life-page .exg-truck-life-hero__copy,
	body.exg-education-page .exg-education-hero--image .exg-education-hero__copy,
	body.exg-fleet-vertical-page .exg-fleet-hero__copy {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 22px 20px 24px;
	}

	body.exg-fleet-page .fleet-hero__inner {
		position: relative;
		z-index: 1;
		top: auto;
		right: auto;
		left: auto;
		display: block;
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		min-height: 0;
		margin: 0;
		padding: 22px 20px 24px;
		background: var(--exg-black, #0a0a0a);
		text-align: left;
		transform: none;
	}

	/* One compact hero heading scale across the editorial page family. */
	body.exg-native-features-page #main-content#main-content .exg-features-hero h1,
	body.exg-native-feature-detail-page #main-content#main-content .exg-feature-detail-hero h1,
	body.exg-generation-three-page #main-content#main-content .exg-gen3-hero h1,
	body.exg-fuel-economy-page #main-content#main-content .exg-fuel-hero h1,
	body.exg-deer-page #main-content#main-content .exg-deer-hero h1,
	body.exg-truck-life-page #main-content#main-content .exg-truck-life-hero h1,
	body.exg-education-page #main-content#main-content .exg-education-hero--image h1,
	body.exg-fleet-vertical-page #main-content#main-content .exg-fleet-hero h1,
	body.exg-six-pack-page #main-content#main-content .exg-six-pack-hero h1,
	body.exg-fleet-page #main-content#main-content .fleet-hero__title {
		max-width: none;
		margin: 0 0 12px;
		font-size: clamp(34px, 9.3vw, 38px) !important;
		line-height: 1 !important;
		text-wrap: balance;
	}

	body.exg-native-features-page .exg-features-hero .exg-features-eyebrow,
	body.exg-generation-three-page .exg-gen3-hero .exg-gen3-eyebrow,
	body.exg-fuel-economy-page .exg-fuel-hero .exg-fuel-eyebrow,
	body.exg-deer-page .exg-deer-hero .exg-deer-eyebrow,
	body.exg-truck-life-page .exg-truck-life-hero .exg-truck-life-eyebrow,
	body.exg-education-page .exg-education-hero--image .exg-education-eyebrow,
	body.exg-fleet-vertical-page .exg-fleet-hero .exg-fleet-eyebrow,
	body.exg-six-pack-page .exg-six-pack-hero .exg-six-pack-eyebrow {
		margin: 0 0 8px;
	}

	body.exg-native-features-page .exg-features-lede,
	body.exg-native-feature-detail-page .exg-feature-detail-hero__summary,
	body.exg-generation-three-page .exg-gen3-hero__copy > p:not(.exg-gen3-eyebrow),
	body.exg-fuel-economy-page .exg-fuel-hero__lede,
	body.exg-truck-life-page .exg-truck-life-hero__copy > p:not(.exg-truck-life-eyebrow),
	body.exg-education-page .exg-education-hero--image .exg-education-hero__copy > p:not(.exg-education-eyebrow, .exg-six-hero__phone),
	body.exg-fleet-vertical-page .exg-fleet-hero__lede,
	body.exg-six-pack-page .exg-six-pack-hero__copy > p:not(.exg-six-pack-eyebrow),
	body.exg-fleet-page .fleet-hero__subtitle {
		max-width: none;
		margin: 0 0 16px;
		font-size: 17px;
		line-height: 1.4;
	}

	body.exg-native-feature-detail-page .exg-feature-detail-hero__logo {
		width: auto;
		max-width: 150px;
		height: 58px;
		margin: 0 0 14px;
		object-fit: contain;
		object-position: left center;
	}

	body.exg-native-features-page .exg-features-hero .exg-features-button,
	body.exg-native-feature-detail-page .exg-feature-detail-hero .exg-feature-detail-button,
	body.exg-generation-three-page .exg-gen3-hero .exg-gen3-button,
	body.exg-fuel-economy-page .exg-fuel-hero .exg-fuel-button,
	body.exg-deer-page .exg-deer-hero__actions a,
	body.exg-truck-life-page .exg-truck-life-hero .exg-truck-life-button,
	body.exg-education-page .exg-education-hero--image .exg-education-button,
	body.exg-fleet-vertical-page .exg-fleet-hero .exg-fleet-button,
	body.exg-six-pack-page .exg-six-pack-hero .exg-six-pack-button,
	body.exg-fleet-page .fleet-hero .fleet-btn,
	body.exg-fleet-page .fleet-hero .fleet-hero__phone {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		min-height: 48px;
		margin: 0;
		padding: 0 14px;
	}

	body.exg-native-feature-detail-page .exg-feature-detail-actions,
	body.exg-generation-three-page .exg-gen3-hero .exg-gen3-actions,
	body.exg-fuel-economy-page .exg-fuel-hero__actions,
	body.exg-deer-page .exg-deer-hero__actions,
	body.exg-truck-life-page .exg-truck-life-hero__actions,
	body.exg-education-page .exg-education-hero--image .exg-education-actions,
	body.exg-fleet-vertical-page .exg-fleet-hero .exg-fleet-actions,
	body.exg-six-pack-page .exg-six-pack-actions,
	body.exg-fleet-page .fleet-hero__actions {
		display: grid;
		width: 100%;
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
		align-items: stretch;
		margin: 16px 0 0;
		padding: 0;
	}

	body.exg-fleet-page .fleet-hero .fleet-hero__phone {
		display: flex;
		align-items: center;
		justify-content: center;
		border: 2px solid #fff;
		border-radius: 4px;
		font-size: var(--exg-type-action-size, 15px);
	}

	body.exg-fleet-page .fleet-hero__usa {
		gap: 8px;
		margin: 16px 0 0;
		padding-top: 12px;
		border-top: 1px solid var(--exg-gold, #ffc800);
	}

	body.exg-fleet-page .fleet-hero__usa img {
		height: 30px;
	}

	/* The Six-Pack includes extra proof and program art. Keep both, but make
	 * them part of the compact panel instead of a second full hero viewport. */
	body.exg-six-pack-page .exg-six-pack-hero__copy {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		padding: 22px 20px 0;
	}

	body.exg-six-pack-page .exg-six-pack-hero__facts {
		gap: 8px;
		max-width: none;
		margin: 18px 0 0;
		padding-top: 14px;
	}

	body.exg-six-pack-page .exg-six-pack-hero__facts li {
		padding-right: 3px;
	}

	body.exg-six-pack-page .exg-six-pack-hero__facts strong {
		font-size: 26px;
	}

	body.exg-six-pack-page .exg-six-pack-hero__facts span {
		font-size: 10px;
		line-height: 1.25;
	}

	body.exg-six-pack-page .exg-six-pack-hero__badge {
		display: grid;
		grid-template-columns: 80px minmax(0, 1fr);
		gap: 14px;
		align-items: center;
		justify-items: start;
		margin: 18px 20px 24px;
		padding: 14px;
	}

	body.exg-six-pack-page .exg-six-pack-hero__badge img {
		width: 80px;
		max-height: 100px;
		object-fit: contain;
	}

	body.exg-six-pack-page .exg-six-pack-hero__badge figcaption {
		max-width: none;
		margin: 0;
		font-size: 11px;
		line-height: 1.35;
		text-align: left;
	}

	body.exg-fuel-economy-page .exg-fuel-hero__proof {
		margin-top: 14px;
		padding-top: 12px;
	}
}