/* ==========================================================================
   Asian Autos — brand layer over Mobex
   Navy + sky design system. Loaded after the parent stylesheet and after
   enovathemes-addons' dynamic styles, so specificity here is deliberately
   modest: the Customizer colour mods (main/second/accent) carry most of the
   accent work, and this file handles type, rhythm, surfaces and polish.
   ========================================================================== */

:root {
	/* Brand */
	--aa-navy:        #0B3D91;
	--aa-navy-deep:   #071E45;
	--aa-navy-700:    #0A3273;
	--aa-navy-50:     #EEF3FC;

	--aa-cta:         #0E7FC0; /* add-to-cart / secondary action, white text safe */
	--aa-sky:         #35B6E8; /* decorative: rules, icons, focus, gradients */
	--aa-sky-50:      #EAF6FD;

	/* Surfaces */
	--aa-bg:          #FFFFFF;
	--aa-bg-alt:      #F4F7FB;
	--aa-bg-sunken:   #EDF2F9;
	--aa-border:      #E3E9F2;
	--aa-border-str:  #CFD9E8;

	/* Ink */
	--aa-text:        #1A2333;
	--aa-heading:     #0D1526;
	--aa-muted:       #5A6478;
	--aa-faint:       #8A93A5;

	/* Status */
	--aa-ok:          #12A150;
	--aa-warn:        #E8A33D;
	--aa-danger:      #D23B3B;

	/* Type */
	--aa-font-head:   'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--aa-font-body:   'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--aa-font-mono:   'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

	/* Form */
	--aa-radius:      10px;
	--aa-radius-sm:   7px;
	--aa-radius-lg:   16px;
	--aa-shadow-sm:   0 1px 2px rgba(11, 61, 145, .06), 0 1px 3px rgba(13, 21, 38, .05);
	--aa-shadow:      0 4px 16px rgba(11, 61, 145, .08), 0 1px 3px rgba(13, 21, 38, .04);
	--aa-shadow-lg:   0 16px 44px rgba(11, 61, 145, .13), 0 2px 8px rgba(13, 21, 38, .05);
	--aa-ring:        0 0 0 3px rgba(53, 182, 232, .32);
	--aa-ease:        cubic-bezier(.2, .7, .2, 1);
}

/* --------------------------------------------------------------------------
   1. Typography
   -------------------------------------------------------------------------- */

body,
button,
input,
select,
textarea,
.woocommerce-page {
	font-family: var(--aa-font-body);
	color: var(--aa-text);
	font-feature-settings: 'cv02', 'cv03', 'cv04', 'ss01';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body {
	background-color: var(--aa-bg);
	line-height: 1.6;
	letter-spacing: -0.003em;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.post-title,
.product-title,
.widget-title,
.section-title,
.woocommerce-loop-product__title {
	font-family: var(--aa-font-head);
	color: var(--aa-heading);
	letter-spacing: -0.022em;
	line-height: 1.18;
	font-weight: 800;
}

h1 { font-size: clamp(2.1rem, 1.35rem + 2.2vw, 3.4rem); }
h2 { font-size: clamp(1.65rem, 1.15rem + 1.5vw, 2.5rem); }
h3 { font-size: clamp(1.3rem, 1.05rem + .8vw, 1.75rem); }
h4 { font-size: 1.2rem; letter-spacing: -0.015em; }
h5 { font-size: 1.05rem; letter-spacing: -0.01em; }
h6 { font-size: .95rem; letter-spacing: -0.005em; }

p { line-height: 1.68; }

/* Eyebrow / kicker — the small caps-tracked label used above section titles */
.aa-eyebrow {
	display: inline-block;
	font-family: var(--aa-font-mono);
	font-size: .72rem;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--aa-cta);
	margin-bottom: .85rem;
}

/* Part numbers, SKUs, spec values read as data, not prose */
.sku,
.sku_wrapper .sku,
.aa-partno,
.woocommerce-product-attributes-item__value .aa-partno,
td.product-sku {
	font-family: var(--aa-font-mono);
	font-size: .88em;
	letter-spacing: .01em;
	color: var(--aa-text);
}

/* --------------------------------------------------------------------------
   2. Links
   -------------------------------------------------------------------------- */

a {
	transition: color .18s var(--aa-ease);
}

.entry-content a:not(.button):not(.wp-block-button__link) {
	text-decoration: underline;
	text-decoration-color: rgba(53, 182, 232, .5);
	text-underline-offset: .18em;
	text-decoration-thickness: 1.5px;
}

.entry-content a:not(.button):not(.wp-block-button__link):hover {
	text-decoration-color: var(--aa-cta);
}

/* --------------------------------------------------------------------------
   3. Buttons
   -------------------------------------------------------------------------- */

input[type="button"],
input[type="reset"],
input[type="submit"],
button,
.button,
.checkout-button,
.woocommerce-button,
.added_to_cart,
.product .button,
.error404-button,
.wp-block-button__link {
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: .875rem;
	letter-spacing: .012em;
	border-radius: var(--aa-radius-sm);
	border: 0;
	transition: background-color .18s var(--aa-ease),
	            box-shadow .18s var(--aa-ease),
	            transform .18s var(--aa-ease),
	            color .18s var(--aa-ease);
	box-shadow: var(--aa-shadow-sm);
}

input[type="submit"]:hover,
button:hover,
.button:hover,
.checkout-button:hover,
.woocommerce-button:hover,
.wp-block-button__link:hover {
	transform: translateY(-1px);
	box-shadow: var(--aa-shadow);
}

input[type="submit"]:active,
button:active,
.button:active,
.checkout-button:active {
	transform: translateY(0);
	box-shadow: var(--aa-shadow-sm);
}

/* Keyboard focus.
   The theme zeroes the outline in three places, the last being
   `a, a:hover, a:active, a:focus { outline: 0 }` — same specificity as a bare
   `a:focus-visible`, so a tie is decided by source order and any later theme
   sheet wins. Qualifying with `body` puts these a rung above all of them, and
   the longhands stop a shorthand from being partially overridden. */
body a:focus-visible,
body button:focus-visible,
body input:focus-visible,
body select:focus-visible,
body textarea:focus-visible,
body summary:focus-visible,
body [tabindex]:focus-visible {
	outline-width: 2px !important;
	outline-style: solid !important;
	outline-color: #35B6E8 !important;
	outline-offset: 2px !important;
	box-shadow: var(--aa-ring);
	border-radius: var(--aa-radius-sm);
}

/* Single product primary action gets the full-width, confident treatment */
body .product .single_add_to_cart_button {
	border-radius: var(--aa-radius-sm);
	padding-left: 2rem;
	padding-right: 2rem;
	font-size: .95rem;
	letter-spacing: .02em;
}

/* Ghost button utility for secondary CTAs in page content */
.aa-btn-ghost,
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: var(--aa-navy) !important;
	box-shadow: inset 0 0 0 1.5px var(--aa-border-str);
}

.aa-btn-ghost:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	box-shadow: inset 0 0 0 1.5px var(--aa-navy);
	background: var(--aa-navy-50) !important;
}

/* --------------------------------------------------------------------------
   4. Forms
   -------------------------------------------------------------------------- */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea,
select,
.select2-container .select2-selection--single {
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius-sm);
	background-color: var(--aa-bg);
	color: var(--aa-text);
	font-size: .94rem;
	transition: border-color .18s var(--aa-ease), box-shadow .18s var(--aa-ease);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
	border-color: var(--aa-sky);
	box-shadow: var(--aa-ring);
	outline: none;
}

::placeholder { color: var(--aa-faint); }

label {
	font-weight: 600;
	font-size: .875rem;
	color: var(--aa-heading);
}

/* --------------------------------------------------------------------------
   5. Header & navigation
   -------------------------------------------------------------------------- */

.top-bar,
.header-top,
.et-top-bar {
	background-color: var(--aa-navy-deep);
	color: rgba(255, 255, 255, .86);
	font-size: .82rem;
	letter-spacing: .01em;
}

.top-bar a,
.header-top a,
.et-top-bar a {
	color: rgba(255, 255, 255, .86);
}

.top-bar a:hover,
.header-top a:hover,
.et-top-bar a:hover {
	color: #fff;
}

.enovathemes-navigation > li > a,
.desktop-menu > li > a,
.menu > li > a {
	font-family: var(--aa-font-head);
	font-weight: 600;
	font-size: .9rem;
	letter-spacing: -0.004em;
}

.header-wrapper,
.header-sticky.stuck {
	box-shadow: 0 1px 0 var(--aa-border);
}

.header-sticky.stuck {
	box-shadow: var(--aa-shadow);
	backdrop-filter: saturate(1.4) blur(8px);
}

/* Search field in the header reads as the primary tool it is */
.product-search input[type="text"],
.product-search input[type="search"] {
	border-radius: var(--aa-radius);
	background: var(--aa-bg-alt);
	border-color: transparent;
}

.product-search input[type="text"]:focus,
.product-search input[type="search"]:focus {
	background: var(--aa-bg);
	border-color: var(--aa-sky);
}

/* --------------------------------------------------------------------------
   6. Product cards & shop grid
   -------------------------------------------------------------------------- */

ul.products > li.product,
.product-grid-item,
.et-product-item {
	border-radius: var(--aa-radius);
	border: 1px solid var(--aa-border);
	background: var(--aa-bg);
	transition: border-color .2s var(--aa-ease),
	            box-shadow .2s var(--aa-ease),
	            transform .2s var(--aa-ease);
}

ul.products > li.product:hover,
.product-grid-item:hover {
	border-color: var(--aa-border-str);
	box-shadow: var(--aa-shadow);
	transform: translateY(-2px);
}

ul.products > li.product .woocommerce-loop-product__title,
.product-title {
	font-size: .98rem;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.012em;
}

.product .price,
.woocommerce-Price-amount {
	font-family: var(--aa-font-head);
	font-weight: 800;
	letter-spacing: -0.02em;
}

.product .onsale,
ul .product .label {
	border-radius: 999px;
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: .68rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: .35em 	.85em;
	box-shadow: var(--aa-shadow-sm);
}

/* Stock signalling — clear, calm, not shouty */
.stock.in-stock,
.product-stock.instock {
	color: var(--aa-ok);
	font-weight: 600;
}

.stock.out-of-stock,
.product-stock.outofstock {
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   7. Single product
   -------------------------------------------------------------------------- */

.woocommerce-tabs .tabs > li > a,
.woocommerce-Tabs-panel h2 {
	font-family: var(--aa-font-head);
	font-weight: 700;
	letter-spacing: -0.012em;
}

.woocommerce-tabs .tabs > li.active > a {
	box-shadow: inset 0 -2px 0 var(--aa-cta);
	color: var(--aa-navy);
}

.woocommerce-product-attributes,
.shop_attributes {
	border-radius: var(--aa-radius);
	overflow: hidden;
	border: 1px solid var(--aa-border);
}

.woocommerce-product-attributes th,
.shop_attributes th {
	background: var(--aa-bg-alt);
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: .84rem;
	letter-spacing: .01em;
	color: var(--aa-heading);
}

.woocommerce-product-attributes td,
.shop_attributes td {
	font-size: .9rem;
}

/* ERP fitment / cross-reference panels injected by the mu-plugin */
.aa-erp-panel,
.aa-fitment,
.aa-crossref {
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius);
	background: var(--aa-bg);
	box-shadow: var(--aa-shadow-sm);
}

.aa-erp-panel h3,
.aa-fitment h3,
.aa-crossref h3 {
	font-size: 1.02rem;
	letter-spacing: -0.012em;
	border-bottom: 1px solid var(--aa-border);
	padding-bottom: .7rem;
}

/* --------------------------------------------------------------------------
   8. Cart, checkout, account
   -------------------------------------------------------------------------- */

.woocommerce table.shop_table,
.woocommerce-checkout .woocommerce-checkout-review-order-table {
	border-radius: var(--aa-radius);
	border: 1px solid var(--aa-border);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}

.woocommerce table.shop_table th {
	background: var(--aa-bg-alt);
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: .84rem;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--aa-muted);
}

.woocommerce-checkout #order_review,
.cart_totals,
.woocommerce-checkout-review-order {
	background: var(--aa-bg-alt);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius-lg);
}

.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
	border-radius: var(--aa-radius);
	border: 1px solid var(--aa-border);
	background: var(--aa-sky-50);
	box-shadow: var(--aa-shadow-sm);
}

.woocommerce-error {
	background: #FDF0F0;
	border-color: #F4D2D2;
}

.woocommerce-MyAccount-navigation li a {
	border-radius: var(--aa-radius-sm);
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   9. Footer
   -------------------------------------------------------------------------- */

.footer,
.site-footer,
#footer {
	background-color: var(--aa-navy-deep);
	color: rgba(255, 255, 255, .74);
}

.footer a,
.site-footer a,
#footer a {
	color: rgba(255, 255, 255, .74);
}

.footer a:hover,
.site-footer a:hover,
#footer a:hover {
	color: #fff;
}

.footer .widget-title,
.site-footer .widget-title,
#footer .widget-title {
	color: #fff;
	font-size: .84rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	font-weight: 700;
}

.footer-bottom,
.copyright {
	border-top: 1px solid rgba(255, 255, 255, .1);
	color: rgba(255, 255, 255, .55);
	font-size: .82rem;
}

/* --------------------------------------------------------------------------
   10. Reusable brand blocks (used by the Elementor/HTML page content)
   -------------------------------------------------------------------------- */

/* Section rhythm */
.aa-section { padding: clamp(3.5rem, 2rem + 5vw, 6.5rem) 0; }
.aa-section--alt { background: var(--aa-bg-alt); }
.aa-section--navy {
	background: var(--aa-navy-deep);
	color: rgba(255, 255, 255, .8);
}
.aa-section--navy h1,
.aa-section--navy h2,
.aa-section--navy h3 { color: #fff; }

/* Hero */
.aa-hero {
	position: relative;
	background: linear-gradient(135deg, var(--aa-navy-deep) 0%, var(--aa-navy) 58%, #1257B8 100%);
	color: #fff;
	overflow: hidden;
}

.aa-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(900px 420px at 78% 18%, rgba(53, 182, 232, .28), transparent 62%),
		radial-gradient(600px 400px at 10% 92%, rgba(53, 182, 232, .12), transparent 60%);
	pointer-events: none;
}

.aa-hero > * { position: relative; z-index: 1; }

.aa-hero h1 { color: #fff; }
.aa-hero .aa-eyebrow { color: var(--aa-sky); }
.aa-hero p { color: rgba(255, 255, 255, .82); font-size: 1.06rem; }
.aa-hero strong { color: #fff; }

/* Stat strip */
.aa-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 1px;
	background: var(--aa-border);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius-lg);
	overflow: hidden;
}

.aa-stat {
	background: var(--aa-bg);
	padding: 1.75rem 1.5rem;
	text-align: left;
}

.aa-stat__num {
	font-family: var(--aa-font-head);
	font-weight: 800;
	font-size: clamp(1.7rem, 1.3rem + 1.2vw, 2.3rem);
	letter-spacing: -0.03em;
	color: var(--aa-navy);
	line-height: 1.1;
}

.aa-stat__label {
	font-family: var(--aa-font-mono);
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--aa-muted);
	margin-top: .5rem;
}

/* Category / feature cards */
.aa-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.1rem;
}

.aa-card {
	position: relative;
	background: var(--aa-bg);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius);
	padding: 1.6rem 1.5rem;
	transition: border-color .2s var(--aa-ease),
	            box-shadow .2s var(--aa-ease),
	            transform .2s var(--aa-ease);
}

.aa-card:hover {
	border-color: var(--aa-sky);
	box-shadow: var(--aa-shadow);
	transform: translateY(-3px);
}

.aa-card__index {
	font-family: var(--aa-font-mono);
	font-size: .72rem;
	letter-spacing: .14em;
	color: var(--aa-sky);
	display: block;
	margin-bottom: .7rem;
}

.aa-card__title {
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: -0.015em;
	color: var(--aa-heading);
	margin-bottom: .4rem;
}

.aa-card__meta {
	font-size: .87rem;
	color: var(--aa-muted);
}

/* Coverage pills — the vehicle make list */
.aa-pills {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
}

.aa-pill {
	font-family: var(--aa-font-head);
	font-weight: 600;
	font-size: .9rem;
	padding: .6rem 1.15rem;
	border-radius: 999px;
	border: 1px solid var(--aa-border);
	background: var(--aa-bg);
	color: var(--aa-heading);
	transition: all .18s var(--aa-ease);
}

.aa-pill:hover {
	border-color: var(--aa-sky);
	background: var(--aa-sky-50);
	color: var(--aa-navy);
}

/* Split feature row (brand story, who we serve) */
.aa-split {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: clamp(1.75rem, 1rem + 3vw, 4rem);
	align-items: center;
}

.aa-callout {
	display: flex;
	gap: .85rem;
	align-items: flex-start;
	padding: 1rem 1.15rem;
	background: var(--aa-bg-alt);
	border-left: 3px solid var(--aa-sky);
	border-radius: var(--aa-radius-sm);
}

.aa-callout__label {
	font-family: var(--aa-font-head);
	font-weight: 700;
	color: var(--aa-heading);
	display: block;
}

.aa-callout__text {
	font-size: .9rem;
	color: var(--aa-muted);
}

/* Contact block */
.aa-contact-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.1rem;
}

.aa-contact-card {
	background: var(--aa-bg);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius);
	padding: 1.6rem;
}

.aa-contact-card__phone {
	font-family: var(--aa-font-mono);
	font-size: 1.05rem;
	color: var(--aa-navy);
	font-weight: 500;
}

/* Thin brand rule used under section titles */
.aa-rule {
	width: 56px;
	height: 3px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--aa-navy), var(--aa-sky));
	margin: 1rem 0 1.5rem;
}

/* --------------------------------------------------------------------------
   11. Misc polish
   -------------------------------------------------------------------------- */

::selection {
	background: var(--aa-sky);
	color: #fff;
}

hr,
.wp-block-separator {
	border: 0;
	border-top: 1px solid var(--aa-border);
}

blockquote {
	border-left: 3px solid var(--aa-sky);
	background: var(--aa-bg-alt);
	border-radius: 0 var(--aa-radius-sm) var(--aa-radius-sm) 0;
	padding: 1.1rem 1.4rem;
	font-size: 1.02rem;
	color: var(--aa-heading);
}

img { border-radius: 2px; }

.et-breadcrumbs {
	font-size: .84rem;
	color: var(--aa-muted);
}

/* Scrollbar, on the browsers that allow it */
* {
	scrollbar-color: var(--aa-border-str) transparent;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* --------------------------------------------------------------------------
   12. Page layout primitives (used by the Asian Autos page content)
   -------------------------------------------------------------------------- */

.aa-container {
	width: 100%;
	max-width: 1300px;
	margin: 0 auto;
	padding: 0 clamp(1.25rem, .75rem + 1.6vw, 2rem);
}

/* Page content is full-bleed: the theme's inner wrapper padding fights it */
.page-template-page-aa .entry-content,
.aa-fullbleed .entry-content { padding: 0; }

.aa-section--tight { padding-block: clamp(2rem, 1.2rem + 2.4vw, 3.25rem); }

.aa-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
	margin-bottom: clamp(1.75rem, 1rem + 2vw, 2.75rem);
}

.aa-section-head--center {
	justify-content: center;
	text-align: center;
}

.aa-section-head h2 { margin: 0; }
.aa-rule--center { margin-inline: auto; }

/* Buttons used in page content */
.aa-btn {
	display: inline-block;
	font-family: var(--aa-font-head);
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: .012em;
	padding: .95rem 1.7rem;
	border-radius: var(--aa-radius-sm);
	transition: all .18s var(--aa-ease);
	text-decoration: none !important;
}

.aa-btn--primary {
	background: var(--aa-navy);
	color: #fff;
	box-shadow: var(--aa-shadow-sm);
}
.aa-btn--primary:hover {
	background: var(--aa-cta);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: var(--aa-shadow);
}

.aa-btn--ghost {
	color: var(--aa-navy);
	box-shadow: inset 0 0 0 1.5px var(--aa-border-str);
}
.aa-btn--ghost:hover {
	box-shadow: inset 0 0 0 1.5px var(--aa-navy);
	background: var(--aa-navy-50);
}

.aa-btn--onnavy {
	color: #fff;
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .3);
}
.aa-btn--onnavy:hover {
	background: rgba(255, 255, 255, .1);
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .55);
	color: #fff;
}

.aa-btn--onnavy-solid {
	background: #fff;
	color: var(--aa-navy) !important;
	box-shadow: var(--aa-shadow-sm);
}
.aa-btn--onnavy-solid:hover {
	background: var(--aa-sky-50);
	transform: translateY(-1px);
}

/* Hero */
.aa-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	gap: clamp(2rem, 1rem + 4vw, 4rem);
	align-items: center;
	padding-block: clamp(3.5rem, 2rem + 6vw, 6.5rem);
}

.aa-hero__copy h1 { margin: 0 0 1.35rem; }
.aa-hero__accent { color: var(--aa-sky); }
.aa-hero__copy p { max-width: 34rem; margin: 0 0 1.1rem; }

.aa-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
	margin-top: 2rem !important;
}

.aa-hero__kicker {
	font-family: var(--aa-font-mono);
	font-size: .78rem;
	letter-spacing: .06em;
	color: rgba(255, 255, 255, .55) !important;
	margin-top: 1.5rem !important;
}

.aa-hero__art { display: grid; place-items: center; }
.aa-rotor {
	width: min(100%, 24rem);
	animation: aa-spin 80s linear infinite;
	transform-origin: center;
}
.aa-rotor--slow { animation-duration: 140s; }

@keyframes aa-spin { to { transform: rotate(360deg); } }

@media (max-width: 860px) {
	.aa-hero__inner { grid-template-columns: 1fr; }
	.aa-hero__art { order: -1; }
	.aa-rotor { width: min(72%, 16rem); }
}

/* Cards grid variants */
.aa-cards--3 { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }

.aa-card--plain:hover { transform: none; border-color: var(--aa-border); box-shadow: var(--aa-shadow-sm); }
.aa-card__meta { margin: .35rem 0 0; }
a.aa-card { text-decoration: none !important; color: inherit; }

/* Callouts row */
.aa-callouts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: .85rem;
	margin-top: 1.85rem;
}

/* Blueprint panel beside the brand story */
.aa-blueprint {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: var(--aa-radius-lg);
	border: 1px solid var(--aa-border);
	background-color: var(--aa-bg-alt);
	background-image:
		linear-gradient(rgba(11, 61, 145, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(11, 61, 145, .06) 1px, transparent 1px);
	background-size: 34px 34px;
	display: grid;
	place-items: center;
	overflow: hidden;
}

.aa-blueprint__cap {
	position: absolute;
	left: 1.1rem;
	bottom: .9rem;
	font-family: var(--aa-font-mono);
	font-size: .64rem;
	letter-spacing: .14em;
	color: var(--aa-faint);
}

.aa-pills--center { justify-content: center; }

/* Closing CTA panel */
.aa-cta {
	position: relative;
	overflow: hidden;
	border-radius: var(--aa-radius-lg);
	background: linear-gradient(135deg, var(--aa-navy-deep) 0%, var(--aa-navy) 62%, #1257B8 100%);
	color: #fff;
	padding: clamp(2.25rem, 1.5rem + 3vw, 3.75rem);
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	align-items: center;
	justify-content: space-between;
}

.aa-cta::after {
	content: '';
	position: absolute;
	right: -90px;
	top: -90px;
	width: 340px;
	height: 340px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(53, 182, 232, .35), transparent 65%);
	pointer-events: none;
}

.aa-cta > * { position: relative; z-index: 1; }
.aa-cta__copy { max-width: 38rem; }
.aa-cta__copy h2 { color: #fff; margin: 0 0 .85rem; }
.aa-cta__copy p { color: rgba(255, 255, 255, .82); margin: 0; }

.aa-cta__actions {
	display: flex;
	flex-direction: column;
	gap: .8rem;
	align-items: stretch;
	text-align: center;
}

.aa-cta__phones {
	font-family: var(--aa-font-mono);
	font-size: .86rem;
	color: rgba(255, 255, 255, .8);
}

.aa-cta__phones a { color: rgba(255, 255, 255, .9); }
.aa-cta__phones a:hover { color: #fff; }

/* Contact page cards */
.aa-contact-card__label {
	font-family: var(--aa-font-mono);
	font-size: .68rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--aa-cta);
	display: block;
	margin-bottom: .7rem;
}

.aa-contact-card address {
	font-style: normal;
	color: var(--aa-muted);
	font-size: .93rem;
	line-height: 1.65;
}

/* Policy / long-form pages */
.aa-prose { max-width: 52rem; }
.aa-prose h2 { margin-top: 2.5rem; }
.aa-prose h3 { margin-top: 1.75rem; }
.aa-prose p, .aa-prose li { color: var(--aa-text); }
.aa-prose ul, .aa-prose ol { padding-left: 1.35rem; margin: 1rem 0; }
.aa-prose li { margin-bottom: .5rem; }

/* --------------------------------------------------------------------------
   13. Full-bleed brand pages
   -------------------------------------------------------------------------- */

/* These pages supply their own sections edge to edge, so strip the theme's
   content chrome: inner padding, the title block and the breadcrumb bar. */
.aa-fullbleed .content-wrapper,
.aa-fullbleed #content,
.aa-fullbleed .entry-content,
.aa-fullbleed .page-content {
	padding-left: 0;
	padding-right: 0;
	max-width: none;
}

.aa-fullbleed .title-section,
.aa-fullbleed .et-breadcrumbs,
.aa-fullbleed .entry-title,
.aa-fullbleed .page-title {
	display: none;
}

.aa-fullbleed .entry-content > section:first-child { margin-top: 0; }

/* Hero sits on navy: the standard navy button would vanish into it. */
.aa-hero .aa-btn--primary {
	background: var(--aa-sky);
	color: #062B57;
}

.aa-hero .aa-btn--primary:hover {
	background: #fff;
	color: var(--aa-navy);
}

/* Section heads inside the tinted band keep their own spacing */
.aa-section--alt .aa-section-head { margin-bottom: clamp(1.75rem, 1rem + 2vw, 2.75rem); }

/* Mobex wraps page content in #et-content > .container, which caps width and
   adds side padding. Brand pages manage their own gutters via .aa-container. */
.aa-fullbleed #et-content > .container {
	max-width: none;
	width: 100%;
	padding-left: 0;
	padding-right: 0;
}

.aa-fullbleed .page-content { padding: 0; }
.aa-fullbleed .title-section { display: none; }

/* Hero buttons: force legible colours over the navy gradient — the theme's
   generic link colour otherwise wins on the outlined variant. */
.aa-hero .aa-btn.aa-btn--primary {
	background: var(--aa-sky);
	color: #062B57 !important;
}

.aa-hero .aa-btn.aa-btn--primary:hover {
	background: #fff;
	color: var(--aa-navy) !important;
}

.aa-hero .aa-btn.aa-btn--onnavy {
	color: #fff !important;
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .38);
}

.aa-hero .aa-btn.aa-btn--onnavy:hover {
	background: rgba(255, 255, 255, .12);
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .7);
	color: #fff !important;
}

.aa-cta .aa-btn.aa-btn--onnavy-solid { color: var(--aa-navy) !important; }

/* --------------------------------------------------------------------------
   14. Inner-page hero + contact form card
   -------------------------------------------------------------------------- */

.aa-hero--compact .aa-hero__inner {
	padding-block: clamp(2.5rem, 1.5rem + 3.5vw, 4.25rem);
}

.aa-hero__inner--single { grid-template-columns: 1fr; }
.aa-hero--compact h1 { margin-bottom: .9rem; }
.aa-hero--compact .aa-hero__copy p { max-width: 44rem; margin-bottom: 0; }

.aa-split--form { align-items: start; }

.aa-formcard {
	background: var(--aa-bg);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius-lg);
	padding: clamp(1.5rem, 1rem + 1.6vw, 2.25rem);
	box-shadow: var(--aa-shadow);
}

.aa-formcard p { margin: 0 0 1.05rem; }
.aa-formcard label { display: block; }

.aa-formcard input[type="text"],
.aa-formcard input[type="email"],
.aa-formcard input[type="tel"],
.aa-formcard textarea {
	width: 100%;
	margin-top: .35rem;
	padding: .7rem .85rem;
}

.aa-form-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 0 1rem;
}

.aa-formcard input[type="submit"] {
	background: var(--aa-navy);
	color: #fff;
	padding: .9rem 1.9rem;
	cursor: pointer;
}

.aa-formcard input[type="submit"]:hover { background: var(--aa-cta); }

.wpcf7-not-valid-tip { color: var(--aa-danger); font-size: .82rem; }
.wpcf7-response-output {
	border-radius: var(--aa-radius-sm);
	border-width: 1px !important;
	font-size: .9rem;
	padding: .8rem 1rem !important;
	margin: 1rem 0 0 !important;
}

.aa-contact-card__phone { margin: .9rem 0 0; }
.aa-contact-card address a { color: var(--aa-navy); }

/* --------------------------------------------------------------------------
   15. Long-form pages
   -------------------------------------------------------------------------- */

/* Policy pages are read, not scanned: the display-scale headings used on the
   marketing pages overpower body copy here, so step them down and give the
   paragraphs a comfortable measure. */
.aa-prose { font-size: 1.02rem; }

.aa-prose h2 {
	font-size: clamp(1.3rem, 1.1rem + .55vw, 1.6rem);
	margin-top: 2.4rem;
	margin-bottom: .6rem;
}

.aa-prose h3 {
	font-size: 1.1rem;
	margin-top: 1.6rem;
	margin-bottom: .45rem;
}

.aa-prose > h2:first-child { margin-top: 0; }
.aa-prose p { margin-bottom: 1rem; max-width: 46rem; }
.aa-prose li { max-width: 44rem; }
.aa-prose a { color: var(--aa-navy); }

/* --------------------------------------------------------------------------
   16. WooCommerce empty / notice states
   -------------------------------------------------------------------------- */

/* The theme paints these buttons with the main colour but leaves the label to
   inherit, which renders navy-on-navy. */
.return-to-shop a,
.woocommerce-info .button,
.woocommerce-message .button,
.wc-backward {
	color: #fff !important;
}

.woocommerce-info,
.woocommerce-no-products-found .woocommerce-info {
	color: var(--aa-text);
}

.woocommerce-no-products-found { padding-block: 2rem 3rem; }

/* The two contact links in the top bar are Elementor icon-box anchors. Elementor
   writes per-widget rules for the anchor itself that beat anything reasonable we
   can put on it, so the focus ring goes on the wrapper instead via :focus-within
   — nothing generated targets that element. */
.et-icon-box:focus-within {
	box-shadow: 0 0 0 3px rgba(53, 182, 232, .55);
	border-radius: 6px;
}

.et-icon-box a:focus,
.et-icon-box a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --------------------------------------------------------------------------
   17. Homepage sections that mirror the US Automotives layout
   -------------------------------------------------------------------------- */

/* Hero with the vehicle finder sitting in it, rather than beside artwork. */
.aa-hero--finder .aa-container {
	padding-top: clamp(2.5rem, 1.6rem + 3.4vw, 4rem);
	padding-bottom: clamp(2rem, 1.4rem + 2.4vw, 3rem);
	text-align: center;
}

.aa-hero__lead { max-width: 46rem; margin: 0 auto; }
.aa-hero__lead h1 { margin: 0 0 .9rem; }
.aa-hero__lead p { color: rgba(255, 255, 255, .84); margin: 0 auto; max-width: 40rem; }

.aa-finder-card {
	background: #fff;
	border-radius: var(--aa-radius-lg);
	padding: clamp(1rem, .7rem + 1vw, 1.6rem);
	margin: clamp(1.5rem, 1rem + 1.6vw, 2.25rem) auto 0;
	max-width: 1000px;
	box-shadow: 0 18px 46px rgba(3, 20, 48, .28);
	text-align: left;
}

/* Trust bullets under the finder */
.aa-trustline {
	list-style: none;
	margin: 1.5rem 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .6rem 2rem;
	font-size: .87rem;
	color: rgba(255, 255, 255, .82);
}

.aa-trustline li { display: flex; align-items: center; gap: .5rem; }

.aa-trustline li::before {
	content: "";
	width: 15px;
	height: 15px;
	flex: none;
	border-radius: 50%;
	background: var(--aa-sky);
	/* a tick, drawn rather than shipped as an icon font */
	-webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 78% no-repeat;
	        mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 78% no-repeat;
}

/* "View all" link under a product grid */
.aa-viewall {
	text-align: center;
	margin: 1.75rem 0 0;
	font-family: var(--aa-font-head);
	font-weight: 700;
}

.aa-viewall a { color: var(--aa-navy); }
.aa-viewall a:hover { color: var(--aa-cta); }

/* Four explainer cards */
.aa-infocards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1rem;
}

.aa-infocard {
	background: var(--aa-bg);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius);
	padding: 1.5rem 1.4rem;
}

.aa-infocard h3 {
	font-size: 1rem;
	margin: 0 0 .55rem;
	color: var(--aa-navy);
}

.aa-infocard p { margin: 0; font-size: .9rem; color: var(--aa-muted); }

/* The service strip. The donor's is green; ours takes the brand gradient so it
   reads as a band rather than an unrelated colour block. */
.aa-servicestrip {
	background: linear-gradient(100deg, var(--aa-navy-deep) 0%, var(--aa-navy) 55%, #1257B8 100%);
	color: #fff;
	padding: clamp(1.75rem, 1.2rem + 2vw, 2.75rem) 0;
}

.aa-services {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.5rem 2rem;
}

.aa-service h3 {
	color: #fff;
	font-size: 1rem;
	margin: 0 0 .35rem;
}

.aa-service p {
	margin: 0;
	font-size: .87rem;
	color: rgba(255, 255, 255, .78);
	line-height: 1.55;
}

/* Featured-category circles from [aa_featured_categories] */
.aa-featured-cats,
.aa-fc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 1.25rem;
}

/* Product grids dropped in by the [products] shortcode sit inside our sections */
.aa-section ul.products {
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 640px) {
	.aa-trustline { gap: .5rem 1.1rem; font-size: .8rem; }
}

/* --------------------------------------------------------------------------
   18. Buttons inside WooCommerce templates
   -------------------------------------------------------------------------- */

/* WooCommerce's own templates style their links (`.summary a`, `.entry-summary a`
   and friends) with enough specificity to beat a single .aa-btn--primary class.
   On the product page that painted navy text on the navy enquiry button — the
   label was in the markup but invisible. Qualify by element and scope so the
   button keeps its own colours wherever a template drops it. */
a.aa-btn--primary,
.summary a.aa-btn--primary,
.entry-summary a.aa-btn--primary,
.aa-enquire a.aa-btn--primary {
	color: #fff !important;
	background: var(--aa-navy);
}

a.aa-btn--primary:hover,
.summary a.aa-btn--primary:hover,
.entry-summary a.aa-btn--primary:hover,
.aa-enquire a.aa-btn--primary:hover {
	color: #fff !important;
	background: var(--aa-cta);
}

a.aa-btn--ghost,
.summary a.aa-btn--ghost,
.entry-summary a.aa-btn--ghost,
.aa-enquire a.aa-btn--ghost {
	color: var(--aa-navy);
	background: transparent;
	border: 1px solid var(--aa-border-strong, #C7D3E4);
}

a.aa-btn--ghost:hover,
.aa-enquire a.aa-btn--ghost:hover {
	color: #fff !important;
	background: var(--aa-navy);
	border-color: var(--aa-navy);
}

/* --------------------------------------------------------------------------
   19. Header navigation at tablet widths
   -------------------------------------------------------------------------- */

/* The theme keeps the desktop header down to ~768px, and the catalogue menu grew
   to eight items (Find Your Parts, Specials, Clearance, FAQ). At exactly 768px the
   row ran 10px past the viewport and the whole page scrolled sideways. Tighten the
   spacing through the tablet band, and let the row wrap rather than overflow if a
   menu item is ever added again. */
@media (min-width: 768px) and (max-width: 1024px) {
	.header-menu.nav-menu {
		flex-wrap: wrap;
		justify-content: center;
		row-gap: .25rem;
	}

	.header-menu.nav-menu > li > a {
		padding-left: .62rem !important;
		padding-right: .62rem !important;
		font-size: .86rem !important;
		letter-spacing: 0 !important;
	}

	.header-menu-container,
	.nav-menu-container {
		max-width: 100%;
		overflow: visible;
	}
}

/* Nothing in the layout may push the page wider than the viewport. */
html,
body {
	overflow-x: hidden;
}

/* The theme's login panel renders "Forgot password?" in #9A9A9A on white — 2.8:1,
   under the WCAG floor. Darken it to the muted brand grey (4.8:1). */
.lost_password a,
a.lost-password,
.woocommerce-LostPassword a {
	color: #5A6472 !important;
}

/* The theme's login panel uses a.forgot (#9A9A9A on white, 2.8:1). */
.form-links .forgot,
a.forgot {
	color: #5A6472 !important;
}

/* The login flyout's "Forgot password?" renders at #9A9A9A (2.8:1). The rule that
   sets it lives in the addon's generated stylesheet and outranks a bare a.forgot,
   so match the container chain the link actually sits in. */
.login-box .widget_reglog .form-links a.forgot,
.widget_reglog .form-links a.forgot,
.form-links a.forgot {
	color: #5A6472 !important;
}

/* The theme prints <p class="price"> from its own product template rather than the
   standard hook, so with pricing suppressed it renders as an empty paragraph and
   leaves a gap above the stock line. Collapse it when it has no content. */
.summary p.price:empty,
.product p.price:empty,
li.product .price:empty {
	display: none !important;
}

/* Buyable parts get a second, primary action next to the enquiry line. */
.aa-enquire--buyable .aa-btn--primary,
a.aa-buy {
	font-weight: 700;
}

.aa-enquire .stock,
.aa-enquire__lead {
	flex: 1 1 100%;
}

.available-to-order {
	color: #5A6472;
}
