/*
 * Shared chrome: announcement, sticky header, navigation band + flyouts, search panel, Garage picker,
 * mobile menu, homepage fitment strip, footer, checkout header/footer.
 * Unlayered (ARCHITECTURE §3). Breakpoints 1100 / 850 / 620 / 370; the WordPress admin bar's own
 * 782/600 breakpoints are the one documented exception (they mirror core's admin-bar CSS).
 */

/* ---------- Page frame ---------- */
.pc-header-part { display: contents; } /* lets the sticky <header> stick against the page */
body.admin-bar { --pc-header-sticky-offset: var(--pc-admin-bar-height); }
@media (max-width: 782px) { body.admin-bar { --pc-header-sticky-offset: var(--pc-admin-bar-height-mobile); } }
@media (max-width: 600px) { body.admin-bar { --pc-header-sticky-offset: 0px; } } /* core's bar scrolls away here */
html { scroll-padding-top: calc(var(--pc-header-sticky-offset) + var(--pc-header-height, 4.5rem) + var(--pc-space-4)); }

/* ---------- Announcement ---------- */
.pc-announcement { background: var(--pc-color-band); color: var(--pc-color-inverse); } /* owner #11: HRD ink-band, all text white (no sky) */
.pc-announcement :focus-visible { outline-color: var(--pc-color-inverse); outline-offset: -2px; }
.pc-announcement__inner {
	display: grid;
	grid-template-columns: var(--pc-space-16) minmax(0, 1fr) var(--pc-space-16);
	align-items: center;
	gap: var(--pc-space-2);
	min-height: var(--pc-announcement-height);
}
.pc-announcement__slides { display: grid; grid-column: 2; }
.pc-announcement__slide {
	grid-area: 1 / 1;
	align-self: center;
	padding-block: var(--pc-space-2);
	font-size: var(--pc-text-sm);
	line-height: var(--pc-leading-compact);
	text-align: center;
	visibility: hidden;
	opacity: 0;
	transition: opacity var(--pc-motion-ui) var(--pc-ease-standard), visibility 0s linear var(--pc-motion-ui);
}
.pc-announcement__slide.is-active { visibility: visible; opacity: 1; transition-delay: 0s; }
.pc-announcement__slide strong { font-weight: var(--pc-weight-bold); }
.pc-announcement__controls { display: flex; justify-content: flex-end; grid-column: 3; }
.pc-announcement__button {
	display: grid;
	place-items: center;
	width: var(--pc-space-8);
	min-width: 0;
	min-height: var(--pc-announcement-height);
	padding: 0;
	border: 0;
	background: none;
	color: var(--pc-color-inverse);
	cursor: pointer;
}
.pc-announcement__button:hover { background: var(--pc-color-inverse-line); }
.pc-announcement__play { display: none; }
.pc-announcement.is-paused .pc-announcement__pause { display: none; }
.pc-announcement.is-paused .pc-announcement__play { display: inline-block; }
@media (pointer: coarse) {
	.pc-announcement__inner { grid-template-columns: minmax(0, 1fr) auto; }
	.pc-announcement__slides { grid-column: 1; }
	.pc-announcement__controls { grid-column: 2; }
	.pc-announcement__button { width: var(--pc-control-height); min-height: var(--pc-control-height); }
}
@media (max-width: 850px) {
	.pc-announcement__inner { grid-template-columns: minmax(0, 1fr) auto; }
	.pc-announcement__slides { grid-column: 1; }
	.pc-announcement__controls { grid-column: 2; }
}
@media (max-width: 620px) {
	.pc-announcement__inner { min-height: var(--pc-control-height); }
	.pc-announcement__slide { font-size: var(--pc-text-xs); }
}

/* ---------- Sticky main header ---------- */
.pc-header-sentinel { height: 1px; margin-bottom: -1px; pointer-events: none; }
.pc-header {
	position: sticky;
	top: var(--pc-header-sticky-offset);
	z-index: var(--pc-z-header);
	/* Owner decision #11: the logo row is navy with white text/icons and the white+sky logo; the category nav row
	   (.pc-nav-band, outside this element) stays white. */
	background: var(--pc-color-ink);
	color: var(--pc-color-inverse);
	transition: box-shadow var(--pc-motion-ui) var(--pc-ease-standard);
}
/* Short landscape (phones on their side): the stacked header is about a third of the viewport, so it scrolls away instead of sticking (S4-13). */
@media (max-height: 500px) and (orientation: landscape) {
	.pc-header { position: static; }
	html { scroll-padding-top: var(--pc-space-4); }
}
.pc-header__row {
	display: flex;
	align-items: center;
	gap: var(--pc-space-6);
	min-height: calc(var(--pc-control-height) + var(--pc-header-padding-block) * 2);
	padding-block: var(--pc-header-padding-block);
}
.pc-header__logo { display: flex; align-items: center; flex: 0 0 var(--pc-header-logo-width); width: var(--pc-header-logo-width); min-height: var(--pc-control-height); color: inherit; } /* 44px target; the artwork keeps its size */
.pc-header__logo img { width: 100%; height: auto; }
.pc-header__logo-icon,
.pc-header__logo-compact { display: none; }
.pc-header .pc-search { flex: 1; min-width: 6.25rem; }
.pc-header__utilities { display: flex; align-items: center; gap: var(--pc-space-5); flex-shrink: 0; }
.pc-header__icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--pc-space-1);
	min-width: var(--pc-space-10);
	min-height: var(--pc-control-height);
	margin-inline: calc((var(--pc-icon-md) - var(--pc-space-10)) / 2);
	color: inherit;
	text-decoration: none;
}
.pc-header__cart { margin-right: 0; justify-content: flex-end; min-width: auto; }
.pc-header__count { min-width: 0.875rem; font-size: var(--pc-text-xs); font-weight: var(--pc-weight-bold); font-variant-numeric: tabular-nums; }
@media (pointer: coarse) {
	.pc-header__utilities { gap: var(--pc-space-6); }
	.pc-header__icon { min-width: var(--pc-control-height); margin-inline: calc((var(--pc-icon-md) - var(--pc-control-height)) / 2); }
	.pc-header__cart { margin-right: 0; }
}

/* Garage trigger (labeled; outlined car; count; selected-vehicle subtitle). */
.pc-garage-trigger {
	display: inline-flex;
	align-items: center;
	gap: var(--pc-space-2);
	min-height: var(--pc-control-height);
	padding: var(--pc-space-1) 0;
	border: 0;
	background: none;
	color: inherit;
	line-height: var(--pc-leading-compact);
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}
.pc-garage-trigger__text { display: grid; min-width: 0; }
.pc-garage-trigger strong { font-size: var(--pc-text-sm); font-weight: var(--pc-weight-bold); white-space: nowrap; }
.pc-garage-trigger__subtitle { display: block; max-width: 8.4375rem; overflow: hidden; color: var(--pc-color-muted); font-size: var(--pc-text-xs); text-overflow: ellipsis; white-space: nowrap; }
.pc-garage-trigger[aria-expanded="true"] strong { text-decoration: underline; text-underline-offset: var(--pc-space-1); }
/* Navy header: light focus ring (sky) on the dark row; the white search field and the popovers inside the header
   (search panel) are light surfaces and keep the standard ring and ink text. */
.pc-header :focus-visible { outline-color: var(--pc-color-focus-inverse); }
.pc-header :where(.pc-search__panel, dialog) :focus-visible { outline-color: var(--pc-color-focus); }
.pc-header .pc-garage-trigger__subtitle { color: var(--pc-color-inverse-muted); }
.pc-header .pc-search__box { border-color: var(--pc-color-surface); background: var(--pc-color-surface); color: var(--pc-color-ink); }
.pc-header .pc-search__box:focus-within { outline-color: var(--pc-color-focus-inverse); outline-offset: var(--pc-focus-offset); }
.pc-header .pc-search__panel { color: var(--pc-color-ink); }

/* Compact (scrolled) state: P icon in a 64px slot, tighter padding. The extra bottom margin keeps the
   header's in-flow height constant, so toggling never shifts the page (no CLS). */
.pc-header.is-compact { box-shadow: 0 var(--pc-border-width) 0 var(--pc-color-inverse-line); margin-bottom: calc((var(--pc-header-padding-block) - var(--pc-header-compact-padding-block)) * 2); }
.pc-header.is-compact .pc-header__row { min-height: calc(var(--pc-control-height) + var(--pc-header-compact-padding-block) * 2); padding-block: var(--pc-header-compact-padding-block); }
.pc-header.is-compact .pc-header__logo { flex-basis: var(--pc-header-compact-logo-slot); width: var(--pc-header-compact-logo-slot); min-height: var(--pc-control-height); justify-content: center; }
.pc-header.is-compact .pc-header__logo-full,
.pc-header.is-compact .pc-header__logo-icon { display: none; }
.pc-header.is-compact .pc-header__logo-compact { display: block; width: var(--pc-header-compact-logo-width); }
.pc-header.is-compact .pc-search__box { min-height: var(--pc-header-compact-search-height); }

@media (max-width: 850px) {
	.pc-header__row { flex-wrap: wrap; gap: var(--pc-space-4); }
	.pc-header .pc-search { order: 3; flex-basis: 100%; }
	.pc-header__utilities { margin-left: auto; }
	.pc-header.is-compact .pc-header__row { gap: var(--pc-space-2) var(--pc-space-4); }
	/* Compact also shortens the wrapped search row (fine pointers only; coarse keeps 44px). */
	.pc-header.is-compact { margin-bottom: calc((var(--pc-header-padding-block) - var(--pc-header-compact-padding-block)) * 2 + (var(--pc-space-4) - var(--pc-space-2)) + (var(--pc-control-height) - var(--pc-header-compact-search-height))); }
}
@media (max-width: 620px) {
	.pc-header__row { gap: var(--pc-space-3); }
	.pc-header__logo { flex-basis: var(--pc-header-logo-width-mobile); width: var(--pc-header-logo-width-mobile); }
	.pc-header__utilities { gap: var(--pc-space-4); }
	.pc-header__account { display: none; } /* reachable in the menu sheet */
	.pc-garage-trigger { gap: var(--pc-space-1); }
	.pc-garage-trigger strong { font-size: var(--pc-text-xs); }
	.pc-garage-trigger__subtitle { display: none; }
}
@media (max-width: 370px) {
	.pc-header__row { gap: var(--pc-space-2); }
	.pc-header__utilities { gap: var(--pc-space-2); }
	.pc-header__logo { flex-basis: var(--pc-header-icon-width); width: var(--pc-header-icon-width); }
	.pc-header__logo-full { display: none; }
	.pc-header__logo-icon { display: block; }
	.pc-garage-trigger__icon { width: var(--pc-icon-sm); height: var(--pc-icon-sm); }
	/* The cart's 44px target must not reach under the Garage label: drop its leading pull-in here. */
	.pc-header__cart { margin-left: 0; }
}

/* ---------- Search ---------- */
.pc-search { position: relative; min-width: 0; }
.pc-search__form { margin: 0; }
.pc-search__box {
	display: flex;
	align-items: center;
	gap: var(--pc-space-2);
	min-height: var(--pc-control-height);
	padding: 0 var(--pc-space-3);
	border: var(--pc-border-width) solid var(--pc-color-search-border);
	border-radius: var(--pc-radius-sm);
	background: var(--pc-color-search-surface);
	cursor: text;
}
.pc-search__box:focus-within { outline: var(--pc-focus-width) solid var(--pc-color-focus); outline-offset: 0; }
.pc-search__input {
	width: 100%;
	min-width: 0;
	min-height: 0;
	padding: var(--pc-space-2) 0;
	border: 0;
	background: none;
	color: var(--pc-color-ink);
	font-size: var(--pc-text-sm);
}
.pc-search__input:focus-visible { outline: none; }
.pc-search__input::placeholder { color: var(--pc-color-subtle); opacity: 1; text-overflow: ellipsis; }
.pc-search__input { text-overflow: ellipsis; } /* a long placeholder ends in "…" on narrow phones instead of being cut mid-word */
@media (pointer: coarse) { .pc-search__input { font-size: var(--pc-text-md); } } /* ≥16px: no iOS focus zoom */

.pc-search__panel {
	position: absolute;
	top: calc(100% + var(--pc-space-2));
	left: 0;
	right: 0;
	z-index: var(--pc-z-popover);
	min-width: var(--pc-search-panel-min-width);
	max-height: var(--pc-search-max-height, calc(100dvh - 8rem));
	padding: var(--pc-space-4);
	overflow: auto;
	overscroll-behavior: contain;
	border: var(--pc-border-width) solid var(--pc-color-search-border);
	border-radius: var(--pc-radius-md);
	background: var(--pc-color-surface);
	box-shadow: var(--pc-shadow-dropdown);
}
.pc-search__panel:not([hidden]) { animation: pc-panel-enter var(--pc-motion-enter) var(--pc-ease-enter) both; }
.pc-search__vehicle { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: var(--pc-space-3); padding: var(--pc-space-3); border-radius: var(--pc-radius-sm); background: var(--pc-color-search-surface); } /* sticky: Close stays reachable when the panel scrolls (short landscape) */
.pc-search__vehicle-copy { flex: 1; min-width: 0; }
.pc-search__vehicle-copy small { display: block; color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
.pc-search__vehicle-label { display: block; margin-top: var(--pc-space-1); font-size: var(--pc-text-sm); font-weight: var(--pc-weight-bold); line-height: var(--pc-leading-compact); }
.pc-search__vehicle-actions { display: flex; align-items: center; gap: var(--pc-space-2); }
.pc-search__vehicle-actions .pc-link { min-height: var(--pc-control-height); }
.pc-search__scope { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-2); padding-block: var(--pc-space-2); border-bottom: var(--pc-border-width) solid var(--pc-color-search-border); font-size: var(--pc-text-xs); }
.pc-search__section-head { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-3); margin: var(--pc-space-5) 0 var(--pc-space-2); }
.pc-search__heading { font-size: var(--pc-text-xs); font-weight: var(--pc-weight-regular); letter-spacing: var(--pc-tracking-label); text-transform: uppercase; color: var(--pc-color-muted); }
.pc-search__history,
.pc-search__matches,
.pc-search__products { display: grid; gap: var(--pc-space-1); margin: 0; padding: 0; list-style: none; }
.pc-search__row {
	display: flex;
	align-items: center;
	gap: var(--pc-space-2);
	width: 100%;
	min-height: var(--pc-control-height);
	padding: var(--pc-space-2);
	border: 0;
	border-radius: var(--pc-radius-sm);
	background: none;
	color: inherit;
	font-size: var(--pc-text-sm);
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}
.pc-search__row > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pc-search__row:hover,
.pc-search__row:focus-visible { background: var(--pc-color-search-surface); }
.pc-search__match small { display: block; color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
.pc-search__match strong { font-size: var(--pc-text-sm); }
.pc-search__row > .pc-search__count { flex: 0 0 auto; color: var(--pc-color-muted); font-size: var(--pc-text-xs); font-variant-numeric: tabular-nums; }
.pc-search__muted { padding-block: var(--pc-space-2); color: var(--pc-color-muted); font-size: var(--pc-text-sm); }
.pc-search__shortcuts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pc-space-2); }
.pc-search__shortcut {
	display: flex;
	align-items: center;
	min-height: var(--pc-control-height);
	padding: var(--pc-space-2);
	border: var(--pc-border-width) solid var(--pc-color-search-border);
	border-radius: var(--pc-radius-sm);
	background: var(--pc-color-surface);
	color: inherit;
	font-size: var(--pc-text-sm);
	text-decoration: none;
}
.pc-search__shortcut:hover,
.pc-search__shortcut:focus-visible { background: var(--pc-color-search-surface); }
.pc-search__results { margin-top: var(--pc-space-1); }
/* Combobox highlight (aria-activedescendant): same surface as hover, plus a ring so it reads without colour. */
.pc-search__panel [data-pc-search-item].is-active { background: var(--pc-color-search-surface); outline: var(--pc-focus-width) solid var(--pc-color-focus); outline-offset: calc(var(--pc-focus-width) * -1); }
.pc-search__results[aria-busy="true"] { opacity: 0.6; }
.pc-search__empty { display: grid; justify-items: start; gap: var(--pc-space-2); padding-block: var(--pc-space-3); font-size: var(--pc-text-sm); }
.pc-search__unavailable { margin-top: var(--pc-space-4); }
.pc-search__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-3); margin-top: var(--pc-space-3); padding-top: var(--pc-space-3); border-top: var(--pc-border-width) solid var(--pc-color-search-border); }
.pc-search__footer .pc-link { min-height: var(--pc-control-height); }
.pc-search__hint { color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
@media (max-width: 850px) { .pc-search__panel { min-width: 0; } }
@media (max-width: 620px) {
	.pc-search__panel { padding: var(--pc-space-3); }
	.pc-search__shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pc-search__vehicle { flex-wrap: wrap; gap: var(--pc-space-2); padding: var(--pc-space-2); }
	.pc-search__vehicle-copy { flex-basis: calc(100% - var(--pc-space-8)); }
	.pc-search__vehicle-actions { justify-content: space-between; width: 100%; }
	.pc-search__scope { flex-wrap: wrap; }
	.pc-search__hint { display: none; }
}

/* ---------- Navigation band (scrolls away) ---------- */
.pc-nav-band { position: relative; z-index: var(--pc-z-nav); background: var(--pc-color-surface); border-bottom: var(--pc-border-width) solid var(--pc-color-line); }
.pc-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-nav-gap); }
.pc-nav__list { display: flex; align-items: center; gap: var(--pc-nav-gap); margin: 0; padding: 0; list-style: none; min-width: 0; }
.pc-nav__trigger {
	display: inline-flex;
	align-items: center;
	gap: var(--pc-space-1);
	min-height: var(--pc-control-height);
	padding: var(--pc-space-3) 0;
	border: 0;
	background: none;
	color: inherit;
	font-size: var(--pc-text-sm);
	font-weight: var(--pc-weight-regular);
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
}
.pc-nav__item--all .pc-nav__trigger { gap: var(--pc-space-2); font-weight: var(--pc-weight-bold); }
.pc-nav__trigger[aria-expanded="true"] { box-shadow: inset 0 calc(var(--pc-focus-width) * -1) var(--pc-color-ink); }
.pc-nav__trigger:focus-visible { outline-offset: calc(var(--pc-focus-width) * -1); }
.pc-nav__chevron { transition: transform var(--pc-motion-ui) var(--pc-ease-standard); }
.pc-nav__trigger[aria-expanded="true"] .pc-nav__chevron { transform: rotate(180deg); }
@media (hover: hover) and (pointer: fine) {
	.pc-nav__list:hover .pc-nav__trigger:not(:hover):not([aria-expanded="true"]) { color: var(--pc-color-muted); }
}
@media (max-width: 1100px) {
	.pc-nav { gap: var(--pc-nav-gap-compact); }
	.pc-nav__list { gap: var(--pc-nav-gap-compact); }
	.pc-nav__item--shortcut { display: none; } /* categories collapse into Shop all parts */
}
@media (max-width: 620px) {
	.pc-nav, .pc-nav__list { gap: var(--pc-space-4); }
	.pc-nav__trigger { font-size: var(--pc-text-xs); }
}
@media (max-width: 370px) {
	.pc-nav__item--vehicles { display: none; } /* Garage + menu sheet cover it */
}

/* Flyouts: the header surface extends down with large links, a visual and vehicle context. */
.pc-flyout {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: var(--pc-z-flyout);
	max-height: var(--pc-flyout-max-height, calc(100dvh - 9rem));
	overflow: auto;
	overscroll-behavior: contain;
	padding-block: var(--pc-space-5) var(--pc-space-6);
	border-top: var(--pc-border-width) solid var(--pc-color-line);
	border-bottom: var(--pc-border-width) solid var(--pc-color-line);
	background: var(--pc-color-surface);
	box-shadow: var(--pc-shadow-dropdown);
}
.pc-flyout:not([hidden]) { animation: pc-panel-enter var(--pc-motion-enter) var(--pc-ease-enter) both; }
.pc-flyout__head { position: sticky; top: calc(var(--pc-space-5) * -1); z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-4); margin: calc(var(--pc-space-5) * -1) 0 var(--pc-space-3); padding-top: var(--pc-space-2); background: var(--pc-color-surface); }
.pc-flyout__close { width: var(--pc-control-height-compact); height: var(--pc-control-height-compact); border: var(--pc-border-width) solid var(--pc-color-line); }
@media (pointer: coarse) { .pc-flyout__close { width: var(--pc-control-height); height: var(--pc-control-height); } }
.pc-flyout__label { font-size: var(--pc-text-sm); font-weight: var(--pc-weight-bold); letter-spacing: var(--pc-tracking-label); text-transform: uppercase; }
.pc-flyout__grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--pc-space-12); }
.pc-flyout__links { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pc-space-2) var(--pc-space-8); align-content: start; margin: 0; padding: 0; list-style: none; }
.pc-flyout__links a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--pc-space-2);
	min-height: var(--pc-control-height);
	padding: var(--pc-space-2) 0;
	color: inherit;
	font-size: var(--pc-flyout-link-size);
	font-weight: var(--pc-weight-bold);
	line-height: var(--pc-leading-compact);
	letter-spacing: var(--pc-tracking-heading);
	text-decoration: none;
}
.pc-flyout__links a .pc-icon { opacity: 0; transition: opacity var(--pc-motion-fast) var(--pc-ease-standard); }
.pc-flyout__links a:hover,
.pc-flyout__links a:focus-visible { text-decoration: underline; text-underline-offset: var(--pc-space-1); }
.pc-flyout__links a:hover .pc-icon,
.pc-flyout__links a:focus-visible .pc-icon { opacity: 1; }
.pc-flyout__bottom { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pc-space-4); margin-top: var(--pc-space-5); padding-top: var(--pc-space-5); border-top: var(--pc-border-width) solid var(--pc-color-line); }
.pc-flyout__bottom .pc-link { min-height: var(--pc-control-height); }
.pc-flyout__context { color: var(--pc-color-muted); font-size: var(--pc-text-sm); }
.pc-flyout__muted { color: var(--pc-color-muted); font-size: var(--pc-text-sm); }
.pc-flyout__visual {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--pc-space-5);
	min-height: var(--pc-flyout-visual-min-height);
	padding: var(--pc-space-6);
	border-radius: var(--pc-radius-sm);
	background: var(--pc-color-soft);
	text-align: center;
}
.pc-flyout__visual-icon { width: var(--pc-space-16); height: var(--pc-space-16); stroke-width: 1; }
.pc-flyout__image { width: 100%; max-height: 13.75rem; object-fit: contain; mix-blend-mode: multiply; }
.pc-flyout__visual-caption { color: var(--pc-color-muted); font-size: var(--pc-text-xs); letter-spacing: var(--pc-tracking-label); text-transform: uppercase; }
.pc-flyout__visual .pc-link { min-height: var(--pc-control-height); }
.pc-flyout__brands { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 0 var(--pc-space-8); margin: 0; padding: 0; list-style: none; }
.pc-flyout__brands a { display: flex; align-items: center; min-height: var(--pc-control-height); color: inherit; font-size: var(--pc-text-lg); font-weight: var(--pc-weight-bold); letter-spacing: var(--pc-tracking-heading); text-decoration: none; }
.pc-flyout__brands a:hover,
.pc-flyout__brands a:focus-visible { text-decoration: underline; text-underline-offset: var(--pc-space-1); }
.pc-flyout__makes { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--pc-space-6) var(--pc-space-8); }
.pc-flyout__makes ul { margin: 0; padding: 0; list-style: none; }
.pc-flyout__make { margin-bottom: var(--pc-space-2); color: var(--pc-color-muted); font-size: var(--pc-text-xs); font-weight: var(--pc-weight-regular); letter-spacing: var(--pc-tracking-label); text-transform: uppercase; }
.pc-flyout__makes a { display: flex; align-items: baseline; gap: var(--pc-space-2); min-height: var(--pc-control-height-compact); padding-block: var(--pc-space-1); color: inherit; font-size: var(--pc-text-md); font-weight: var(--pc-weight-bold); text-decoration: none; }
.pc-flyout__makes a small { color: var(--pc-color-muted); font-size: var(--pc-text-xs); font-weight: var(--pc-weight-regular); }
@media (pointer: coarse) { .pc-flyout__makes a { align-items: center; min-height: var(--pc-control-height); } }
.pc-flyout__makes a:hover,
.pc-flyout__makes a:focus-visible { text-decoration: underline; text-underline-offset: var(--pc-space-1); }
@media (max-width: 850px) {
	.pc-flyout__grid { gap: var(--pc-space-6); }
	.pc-flyout__links { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
	.pc-flyout__grid { grid-template-columns: 1fr; }
	.pc-flyout__links { grid-template-columns: 1fr 1fr; gap: var(--pc-space-1) var(--pc-space-5); }
	.pc-flyout__links a { font-size: var(--pc-text-lg); }
	.pc-flyout__visual { display: none; }
}

/* ---------- Homepage fitment strip (scrolls away) ---------- */
.pc-fit-strip { background: var(--pc-color-ink); color: var(--pc-color-inverse); font-size: var(--pc-text-sm); }
.pc-fit-strip__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-5); padding-block: var(--pc-space-2); }
.pc-fit-strip__text { display: flex; align-items: center; gap: var(--pc-space-2); min-width: 0; }
.pc-fit-strip__text strong { font-weight: var(--pc-weight-bold); }
.pc-fit-strip__action { flex-shrink: 0; padding: var(--pc-space-1); border: 0; background: none; color: var(--pc-color-inverse); font-size: var(--pc-text-xs); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; cursor: pointer; }
.pc-fit-strip__text > span { min-width: 0; overflow-wrap: anywhere; }
.pc-fit-strip__icon-other { display: none; }
.pc-fit-strip--none .pc-fit-strip__icon-fits,
.pc-fit-strip--unknown .pc-fit-strip__icon-fits { display: none; }
.pc-fit-strip--none .pc-fit-strip__icon-other,
.pc-fit-strip--unknown .pc-fit-strip__icon-other { display: inline-block; }
.pc-fit-strip :focus-visible { outline-color: var(--pc-color-focus-inverse); }
@media (max-width: 620px) {
	.pc-fit-strip__inner { align-items: flex-start; gap: var(--pc-space-3); }
	.pc-fit-strip__text { font-size: var(--pc-text-xs); }
}

/* ---------- Garage picker (dropdown on desktop, sheet on phones) ---------- */
.pc-garage {
	position: fixed;
	inset: auto;
	width: var(--pc-garage-dropdown-width);
	max-width: calc(100% - var(--pc-space-6));
	max-height: calc(100dvh - var(--pc-space-6));
	margin: 0;
	padding: var(--pc-space-3);
	border-radius: var(--pc-garage-radius);
}
.pc-garage::backdrop { background: transparent; }
.pc-garage__head { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-3); padding-inline: var(--pc-space-2); }
.pc-garage__title { font-size: var(--pc-text-lg); line-height: var(--pc-leading-compact); letter-spacing: var(--pc-tracking-heading); }
.pc-garage__title:focus { outline: none; }
.pc-garage__close { color: var(--pc-color-muted); border-radius: var(--pc-garage-row-radius); }
.pc-garage__close:hover { background: var(--pc-color-search-border); color: var(--pc-color-ink); }
.pc-garage__intro { margin: 0 0 var(--pc-space-3); padding: 0 var(--pc-space-2); color: var(--pc-color-muted); font-size: var(--pc-text-sm); }
.pc-garage__list { display: grid; gap: var(--pc-space-1); margin: 0; padding: 0; list-style: none; }
.pc-garage__row { display: flex; align-items: center; min-width: 0; border-radius: var(--pc-garage-row-radius); }
.pc-garage__row.is-selected { background: var(--pc-color-search-surface); }
.pc-garage__choice {
	display: flex;
	align-items: center;
	gap: var(--pc-space-3);
	width: 100%;
	min-width: 0;
	min-height: var(--pc-garage-option-height);
	padding: var(--pc-space-3) var(--pc-space-2);
	border: 0;
	border-radius: var(--pc-garage-row-radius);
	background: transparent;
	color: inherit;
	text-align: left;
	cursor: pointer;
}
.pc-garage__choice:hover { background: var(--pc-color-search-surface); }
.pc-garage__choice > span { flex: 1; min-width: 0; }
.pc-garage__choice strong { display: block; font-size: var(--pc-text-base); font-weight: var(--pc-weight-regular); line-height: var(--pc-leading-compact); overflow-wrap: anywhere; }
.pc-garage__choice small { display: block; margin-top: var(--pc-space-1); color: var(--pc-color-muted); font-size: var(--pc-text-xs); line-height: var(--pc-leading-body); }
.pc-garage__remove { display: none; place-items: center; flex-shrink: 0; width: var(--pc-control-height); height: var(--pc-control-height); margin-right: var(--pc-space-1); padding: 0; border: 0; border-radius: var(--pc-garage-row-radius); background: transparent; color: var(--pc-color-muted); cursor: pointer; }
.pc-garage__remove:hover { background: var(--pc-color-search-border); color: var(--pc-color-ink); }
.pc-garage[data-mode="manage"] .pc-garage__remove { display: grid; }
.pc-garage__shop { margin-top: var(--pc-space-3); border-radius: var(--pc-radius-pill); }
.pc-garage__actions { margin-top: var(--pc-space-2); padding-top: var(--pc-space-2); border-top: var(--pc-border-width) solid var(--pc-color-search-border); }
.pc-garage__action {
	display: flex;
	align-items: center;
	gap: var(--pc-space-3);
	width: 100%;
	min-height: var(--pc-control-height);
	padding: var(--pc-space-2);
	border: 0;
	border-radius: var(--pc-garage-row-radius);
	background: transparent;
	color: inherit;
	text-align: left;
	cursor: pointer;
}
.pc-garage__action:hover:not(:disabled) { background: var(--pc-color-search-surface); }
.pc-garage__action small { display: block; margin-top: var(--pc-space-1); color: var(--pc-color-muted); font-size: var(--pc-text-xs); line-height: var(--pc-leading-body); }
.pc-garage__action[aria-pressed="true"] { background: var(--pc-color-search-surface); }
.pc-garage__note { margin: var(--pc-space-3) var(--pc-space-2) 0; color: var(--pc-color-muted); font-size: var(--pc-text-xs); line-height: var(--pc-leading-body); }
.pc-garage__steps { display: flex; flex-wrap: wrap; gap: var(--pc-space-1) var(--pc-space-3); margin: var(--pc-space-2) 0; padding: 0 var(--pc-space-2); list-style: none; color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
.pc-garage__steps [aria-current] { color: var(--pc-color-ink); font-weight: var(--pc-weight-bold); }
.pc-garage__back { display: flex; align-items: center; gap: var(--pc-space-2); min-height: var(--pc-control-height); margin-bottom: var(--pc-space-2); padding: 0 var(--pc-space-2); border: 0; background: none; color: var(--pc-color-muted); font-size: var(--pc-text-sm); cursor: pointer; }
.pc-garage__back:hover { color: var(--pc-color-ink); }
.pc-garage__options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pc-space-2); padding: 0 var(--pc-space-2); }
.pc-garage__options--models { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pc-garage__options button {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--pc-space-1);
	min-width: 0;
	min-height: var(--pc-garage-option-height);
	padding: var(--pc-space-3) var(--pc-space-2);
	border: var(--pc-border-width) solid var(--pc-color-search-border);
	border-radius: var(--pc-garage-row-radius);
	background: var(--pc-color-surface);
	color: inherit;
	font-size: var(--pc-text-base);
	line-height: var(--pc-leading-compact);
	text-align: left;
	overflow-wrap: anywhere;
	cursor: pointer;
}
.pc-garage__options button:hover:not(:disabled) { border-color: var(--pc-color-ink); background: var(--pc-color-search-surface); }
.pc-garage__options small { color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
.pc-garage__years { margin-bottom: var(--pc-space-4); }
.pc-garage__years h3 { margin-bottom: var(--pc-space-2); padding: 0 var(--pc-space-2); font-size: var(--pc-text-xs); letter-spacing: var(--pc-tracking-label); }
/* Year-aware fitment: one list of model years per model (owner decision #10), each with the picked generation's chassis code; sized by the available width (no extra breakpoints). */
.pc-garage__options--years { grid-template-columns: repeat(auto-fill, minmax(var(--pc-space-16), 1fr)); }
.pc-garage__options--years button { align-items: center; text-align: center; }
/* A legacy entry without a model year: optional "Add your model year" under the row (never blocking). */
.pc-garage__row.has-year-prompt { flex-wrap: wrap; }
.pc-garage__row.has-year-prompt .pc-garage__choice { flex: 1 1 0; width: auto; }
.pc-garage__add-year { flex: 1 1 100%; justify-content: flex-start; min-height: var(--pc-control-height); margin-top: calc(var(--pc-space-2) * -1); padding: 0 var(--pc-space-2) 0 calc(var(--pc-space-2) + var(--pc-space-3) + var(--pc-icon-md)); text-align: left; }
.pc-garage__help { margin: var(--pc-space-2) var(--pc-space-2) 0; min-height: var(--pc-control-height); color: var(--pc-color-muted); font-weight: var(--pc-weight-regular); }
.pc-garage__feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--pc-space-3); padding: var(--pc-space-2); color: var(--pc-color-muted); font-size: var(--pc-text-sm); line-height: var(--pc-leading-body); }
.pc-garage__feedback:not(:has(span:not(:empty))) { display: none; }
.pc-garage__feedback .pc-link { min-height: var(--pc-control-height); }
.pc-garage .pc-notice { margin: 0 var(--pc-space-2) var(--pc-space-3); }
.pc-garage__empty { padding-inline: var(--pc-space-2); }
.pc-garage__view[aria-busy="true"] { min-height: 12rem; }
@media (pointer: coarse) { .pc-garage__choice strong, .pc-garage__action { font-size: var(--pc-text-md); } }
@media (max-width: 620px) {
	.pc-garage {
		inset: auto 0 0; /* the picker clears its inline dropdown position at this width */
		width: 100%;
		max-width: 100%;
		max-height: var(--pc-sheet-max-height);
		padding: var(--pc-space-3) var(--pc-space-3) calc(var(--pc-space-4) + env(safe-area-inset-bottom));
		border-radius: var(--pc-garage-sheet-radius) var(--pc-garage-sheet-radius) 0 0;
	}
	.pc-garage::before { content: ""; display: block; width: var(--pc-space-9); height: var(--pc-space-1); margin: 0 auto var(--pc-space-2); border-radius: var(--pc-radius-pill); background: var(--pc-color-search-border); }
	.pc-garage::backdrop { background: var(--pc-color-backdrop); }
	.pc-garage[open] { animation-name: pc-sheet-enter; }
	.pc-garage__head { position: sticky; top: calc(var(--pc-space-3) * -1); z-index: 1; background: var(--pc-color-surface); }
}
@media (max-width: 370px) {
	.pc-garage__options--makes,
	.pc-garage__options--models { grid-template-columns: 1fr; }
}

/* ---------- Mobile menu sheet ---------- */
.pc-menu .pc-sheet__body { display: grid; align-content: start; gap: var(--pc-space-2); }
.pc-menu__garage {
	display: flex;
	align-items: center;
	gap: var(--pc-space-3);
	width: 100%;
	min-height: var(--pc-garage-option-height);
	padding: var(--pc-space-3);
	border: 0;
	border-radius: var(--pc-garage-row-radius);
	background: var(--pc-color-search-surface);
	color: inherit;
	text-align: left;
	cursor: pointer;
}
.pc-menu__garage > span { display: grid; flex: 1; min-width: 0; }
.pc-menu__garage strong { font-size: var(--pc-text-sm); }
.pc-menu__garage-sub { color: var(--pc-color-muted); font-size: var(--pc-text-xs); }
.pc-menu__heading { margin-top: var(--pc-space-5); color: var(--pc-color-muted); font-size: var(--pc-text-xs); font-weight: var(--pc-weight-regular); letter-spacing: var(--pc-tracking-label); text-transform: uppercase; }
.pc-menu__list,
.pc-menu__sublist,
.pc-menu__tiles { margin: 0; padding: 0; list-style: none; }
.pc-menu__list > li { border-bottom: var(--pc-border-width) solid var(--pc-color-line); }
.pc-menu__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--pc-space-3);
	min-height: calc(var(--pc-control-height) + var(--pc-space-1));
	color: inherit;
	font-size: var(--pc-text-lg);
	font-weight: var(--pc-weight-bold);
	letter-spacing: var(--pc-tracking-heading);
	text-decoration: none;
	list-style: none;
	cursor: pointer;
}
.pc-menu__link::-webkit-details-marker { display: none; }
.pc-menu__link--strong { font-size: var(--pc-text-xl); }
.pc-menu__chevron { transition: transform var(--pc-motion-ui) var(--pc-ease-standard); }
.pc-menu__group[open] .pc-menu__chevron { transform: rotate(180deg); }
.pc-menu__sublist { display: grid; padding: 0 0 var(--pc-space-3) var(--pc-space-3); }
.pc-menu__sublist--columns { grid-template-columns: 1fr 1fr; column-gap: var(--pc-space-4); }
.pc-menu__sublink { display: flex; align-items: center; min-height: var(--pc-control-height); color: inherit; font-size: var(--pc-text-md); text-decoration: none; }
.pc-menu__sublink:hover { text-decoration: underline; }
.pc-menu__tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pc-space-2); }
.pc-menu__tile {
	display: flex;
	flex-direction: column;
	gap: var(--pc-space-3);
	min-height: 5rem;
	padding: var(--pc-space-3);
	border: var(--pc-border-width) solid var(--pc-color-search-border);
	border-radius: var(--pc-garage-row-radius);
	color: inherit;
	font-size: var(--pc-text-sm);
	font-weight: var(--pc-weight-bold);
	text-decoration: none;
	overflow-wrap: anywhere;
}
.pc-menu__tile:hover { background: var(--pc-color-search-surface); }
.pc-menu__tile--wide { grid-column: 1 / -1; } /* the email address needs the full row to stay on one line */
/* Wider than a phone (e.g. opened, then resized): a right-hand panel; on phones, the bottom sheet. */
.pc-menu { inset: 0 0 0 auto; width: min(30rem, 100%); height: 100dvh; max-height: 100dvh; border-radius: 0; }
@media (max-width: 620px) {
	.pc-menu { inset: auto 0 0; width: 100%; height: auto; max-height: var(--pc-sheet-max-height); border-radius: var(--pc-garage-sheet-radius) var(--pc-garage-sheet-radius) 0 0; }
}

/* ---------- Footer ---------- */
.pc-footer { background: var(--pc-color-ink); color: var(--pc-color-inverse); }
.pc-footer :focus-visible { outline-color: var(--pc-color-focus-inverse); } /* owner #11: sky focus on the navy footer */
.pc-footer__main { display: grid; grid-template-columns: minmax(0, 1.65fr) repeat(3, minmax(0, 1fr)); gap: var(--pc-footer-column-gap); padding-block: var(--pc-footer-padding-block); }
.pc-footer__brand { min-width: 0; }
.pc-footer__logo { display: inline-block; max-width: 100%; }
.pc-footer__logo img { width: var(--pc-footer-logo-width); max-width: 100%; height: auto; } /* white+sky artwork, no filter */
.pc-footer__tagline { margin-top: var(--pc-space-5); font-size: var(--pc-text-lg); font-weight: var(--pc-weight-bold); letter-spacing: var(--pc-tracking-heading); }
.pc-footer__description { max-width: 16rem; margin-top: var(--pc-space-2); color: var(--pc-color-inverse-muted); font-size: var(--pc-text-sm); line-height: var(--pc-leading-body); }
.pc-footer__heading { margin-bottom: var(--pc-space-3); font-size: var(--pc-text-base); font-weight: var(--pc-weight-bold); line-height: var(--pc-leading-compact); }
.pc-footer__group ul { margin: 0; padding: 0; list-style: none; }
.pc-footer__link {
	display: inline-flex;
	align-items: center;
	min-height: var(--pc-control-height-compact);
	padding: var(--pc-space-1) 0;
	border: 0;
	background: transparent;
	color: var(--pc-color-inverse-muted);
	font-size: var(--pc-footer-link-size);
	font-weight: var(--pc-weight-regular);
	line-height: var(--pc-leading-body);
	text-align: left;
	text-decoration: none;
	overflow-wrap: anywhere;
	cursor: pointer;
}
.pc-footer__link:hover { color: var(--pc-color-sky); text-decoration: underline; text-underline-offset: var(--pc-space-1); } /* sky: the footer is navy */
.pc-footer__email { margin-top: var(--pc-space-3); color: var(--pc-color-inverse); max-width: 100%; }
.pc-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pc-space-4) var(--pc-space-8); padding-block: var(--pc-space-5); border-top: var(--pc-border-width) solid var(--pc-color-inverse-line); color: var(--pc-color-inverse-muted); font-size: var(--pc-text-xs); }
.pc-footer__legal { display: flex; flex-wrap: wrap; gap: 0 var(--pc-space-5); }
.pc-footer__legal .pc-footer__link { font-size: var(--pc-text-xs); }
.pc-footer__financing { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pc-space-2); margin-left: auto; color: var(--pc-color-inverse); font-size: var(--pc-text-sm); }
.pc-footer__financing span { margin-right: var(--pc-space-2); color: var(--pc-color-inverse-muted); font-size: var(--pc-text-xs); }
@media (pointer: coarse) { .pc-footer__link { min-height: var(--pc-control-height); } }
@media (max-width: 850px) {
	.pc-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pc-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
	.pc-footer__bottom { flex-direction: column; align-items: flex-start; }
	.pc-footer__financing { margin-left: 0; }
}

/* ---------- Checkout header / footer (focused; HRD-style) ---------- */
.pc-checkout-frame { width: calc(100% - var(--pc-page-gutter) * 2); max-width: var(--pc-checkout-width); margin-inline: auto; }
.pc-checkout-header { background: var(--pc-color-ink); color: var(--pc-color-inverse); } /* owner #11: navy, white+sky logo */
.pc-checkout-header :focus-visible { outline-color: var(--pc-color-focus-inverse); }
.pc-checkout-header__back { color: var(--pc-color-inverse); }
.pc-checkout-header__row { display: flex; align-items: center; justify-content: space-between; gap: var(--pc-space-4); min-height: var(--pc-checkout-header-height); }
.pc-checkout-header__logo { display: block; width: var(--pc-checkout-logo-width); }
.pc-checkout-header__logo img { width: 100%; height: auto; }
.pc-checkout-header__back { min-height: var(--pc-control-height); }
.pc-footer--checkout { background: var(--pc-color-ink); color: var(--pc-color-inverse-muted); } /* owner #11: navy like the full footer */
.pc-footer__checkout { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--pc-space-3) var(--pc-space-6); padding-block: var(--pc-space-5); }
.pc-footer--checkout .pc-footer__link { color: var(--pc-color-inverse-muted); }
.pc-footer--checkout .pc-footer__link:hover { color: var(--pc-color-sky); }
