html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body { background: var(--rsa-bg); color: var(--rsa-ink); font-family: var(--rsa-font-body); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { font-family: var(--rsa-font-head); letter-spacing: -0.01em; text-wrap: balance; }
:where(main) h1.wp-block-heading { font-size: var(--rsa-fs-h1); font-weight: 800; letter-spacing: var(--rsa-track-tight); line-height: 1.02; }
:where(main) h2.wp-block-heading { font-size: var(--rsa-fs-h2); font-weight: 800; letter-spacing: -.03em; line-height: 1.06; }
p { text-wrap: pretty; }
::selection { background: var(--rsa-electric); color: #fff; }
a { color: var(--rsa-link); }
img { max-width: 100%; height: auto; }

.rsa-main { min-height: 60vh; }
.rsa-page-title { margin-block: 2rem 1rem; }

/* ---------- header ---------- */
/* The announcement bar, when shown, adds about --rsa-announce-h on top of --rsa-header-h (M3 sums them for the hero offset). */
:root { --rsa-header-h: 88px; --rsa-announce-h: 38px; }
.rsa-site-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 60; }
@media (max-width: 600px) { .rsa-site-header { top: 0; } } /* the admin bar scrolls away on narrow screens */
.rsa-header .rsa-logo { flex: none; }
.rsa-header-wrap { position: relative; padding: 12px clamp(12px, 3vw, 32px) 0; }
.rsa-header {
	position: relative; isolation: isolate;
	max-width: 1360px; margin: 0 auto; padding: 8px 12px 8px 22px; gap: 16px;
	border: 1px solid var(--rsa-border); border-radius: 999px; box-shadow: var(--rsa-shadow);
}
/* Tint and blur sit on a pseudo-element: backdrop-filter on .rsa-header itself would make it the containing block
   of the position:fixed mobile menu overlay and clip that overlay to the pill. */
.rsa-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45);
	background: var(--rsa-bg);
	background: color-mix(in srgb, var(--rsa-bg) 90%, transparent);
	-webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2);
}
/* Phones: the pill (logo + menu button + four icon buttons) must fit 360-420px without horizontal scroll. The layout gap is set inline by the group block, hence the doubled class. */
@media (max-width: 480px) {
	.rsa-header.rsa-header { gap: 8px; padding-inline: 14px 8px; }
	.rsa-header .rsa-actions { gap: 2px; }
	.rsa-header .rsa-actions__call { margin-left: 2px; }
}
.rsa-nav .wp-block-navigation-item__content { white-space: nowrap; padding: 8px 14px; border-radius: 999px; color: var(--rsa-ink); font: 600 .92rem/1 var(--rsa-font-body); text-decoration: none; }
.rsa-nav .wp-block-navigation-item__content:hover,
.rsa-nav .rsa-has-mega:hover > .wp-block-navigation-item__content { background: var(--rsa-surface); color: var(--rsa-link); }
/* Current page: a filled pill, so visitors always see where they are. */
.rsa-nav .current-menu-item > .wp-block-navigation-item__content,
.rsa-nav .wp-block-navigation-item__content[aria-current="page"] { background: var(--rsa-chip); color: var(--rsa-link); }
.rsa-nav .wp-block-navigation__responsive-container-open { color: var(--rsa-ink); }
/* Core collapses the nav below 600px only; the pill (logo + six links + four icon buttons + Call now) needs the hamburger up to 1200px.
   The mega menu is desktop-only at the same breakpoint (its CSS uses max-width 1200px, its script min-width 1201px). */
@media (max-width: 1200px) {
	.rsa-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.rsa-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
/* Core paints the open overlay white-on-black via .wp-block-navigation:not(.has-background) ...; match that specificity so the overlay follows the theme tokens. */
.wp-block-navigation.rsa-nav:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open { background: var(--rsa-bg); color: var(--rsa-ink); }
.rsa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.25rem; padding: 12px 0; }

/* ---------- footer ---------- */
.rsa-footer { position: relative; overflow: hidden; isolation: isolate; color: #eef2f8; background: var(--rsa-brand-deep); margin-top: 4rem; }
/* A faint electric glow in the top corner and a chrome hairline along the top edge. */
.rsa-footer::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: radial-gradient(60% 80% at 100% 0%, rgba(47, 107, 209, .26), transparent 60%), radial-gradient(50% 60% at 0% 100%, rgba(47, 107, 209, .12), transparent 70%); }
.rsa-footer::after { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, rgba(201, 206, 214, .5), transparent); }
.rsa-footer .wp-block-navigation, .rsa-footer .wp-block-navigation__container { gap: .15rem; }
.rsa-footer a { color: #eef2f8; }
.rsa-footer .rsa-logo { margin-bottom: 1rem; }
/* The footer is navy in both themes, so it always uses the light-on-dark logo artwork. */
.rsa-footer .rsa-logo__light { display: none; }
.rsa-footer .rsa-logo__dark { display: inline-flex; }
.rsa-footer__blurb { color: #b7c4dc; max-width: 34ch; margin-bottom: 1.25rem; }
.rsa-footer__title { font-size: .75rem !important; letter-spacing: .14em; text-transform: uppercase; color: #9fb4d6; margin-bottom: 1rem; }
.rsa-footer .wp-block-navigation-item__content { display: inline-block; color: #eef2f8; font-size: .95rem; padding: 6px 0; text-decoration: none; }
.rsa-footer .wp-block-navigation-item__content:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.rsa-footer__wordmark {
	margin: 3rem 0 0; font: 800 clamp(2.4rem, 12vw, 10.5rem)/.92 var(--rsa-font-head); letter-spacing: -.045em; white-space: nowrap;
	background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.02) 88%); -webkit-background-clip: text; background-clip: text; color: transparent;
	user-select: none;
}
.rsa-footer__legal { margin: 1.25rem 0 0; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,.12); font-size: .8rem; color: #9fb4d6; }
.rsa-footer .rsa-contact__social a { color: #eef2f8; }
@media (max-width: 781px) {
	.rsa-footer__cols { gap: 2rem; }
	/* Phones: the link columns sit two to a row instead of three tall stacks. */
	.rsa-footer__cols.rsa-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rsa-footer__cols > .wp-block-column:first-child { grid-column: 1 / -1; }
}

/* ---------- inventory layout ---------- */
.rsa-inventory { padding-top: 1.5rem; }
.rsa-inventory__title { margin: .5rem 0 1.5rem; font-size: var(--rsa-fs-h1); font-weight: 800; letter-spacing: var(--rsa-track-tight); line-height: 1; }
.rsa-inventory__intro { max-width: 60ch; margin: -.75rem 0 1.5rem; color: var(--rsa-muted); }
.rsa-inv { gap: clamp(1.25rem, 2.5vw, 2.25rem); align-items: flex-start; }
.rsa-inv__filters:empty { display: none; }
.rsa-inv__filters:empty + .wp-block-column { flex-basis: 100% !important; }
@media (max-width: 960px) { .rsa-inv { flex-wrap: wrap !important; } .rsa-inv > .wp-block-column { flex-basis: 100% !important; } }

/* ---------- single vehicle ---------- */
.rsa-single { padding-top: 1.5rem; }
.rsa-single__cols { gap: clamp(1.25rem, 3vw, 3rem); align-items: flex-start; }
.rsa-single__cols > .wp-block-column:first-child { display: grid; gap: clamp(1rem, 2vw, 1.75rem); min-width: 0; }
.rsa-single__aside { position: sticky; top: calc(var(--rsa-header-h, 88px) + 16px); align-self: flex-start; }
body:has(.rsa-announce) .rsa-single__aside { top: calc(var(--rsa-header-h, 88px) + var(--rsa-announce-h, 38px) + 16px); }
.rsa-single__content { color: var(--rsa-ink); font-size: 1.05rem; }
.rsa-single__content:empty { display: none; }
.rsa-single .rsa-related { margin-top: clamp(2.5rem, 6vw, 4.5rem); }
@media (max-width: 960px) {
	.rsa-single__cols { flex-wrap: wrap !important; }
	.rsa-single__cols > .wp-block-column { flex-basis: 100% !important; }
	.rsa-single__aside { position: static; order: -1; }
	/* Phones and tablets: photo first, then price and actions, then the details. The main column's blocks join the row so the
	   summary can sit between the gallery and the rest. */
	.rsa-single__cols > .wp-block-column:first-child { display: contents; }
	.rsa-single__cols > .wp-block-column:first-child > * { flex: 1 1 100%; min-width: 0; margin: 0; }
	.rsa-single__cols > .wp-block-column:first-child > .rsa-gallery { order: -2; }
}

/* ---------- pattern styles ---------- */
.rsa-main--home { margin-top: 0; }
.rsa-steps, .rsa-features { gap: clamp(1.25rem, 3vw, 2.5rem); margin-top: clamp(1.25rem, 3vw, 2rem); }
.rsa-steps .wp-block-column, .rsa-features .wp-block-column { display: grid; align-content: start; gap: .75rem; }
.rsa-steps h3, .rsa-features h3 { margin: .25rem 0 0; font-size: 1.2rem; letter-spacing: -.015em; }
/* Buying steps are a real sequence, so each card is numbered. */
.rsa-steps { counter-reset: rsa-step; }
.rsa-steps > .wp-block-column { position: relative; counter-increment: rsa-step; padding: 1.5rem; border: 1px solid var(--rsa-border); border-radius: var(--rsa-radius); background: var(--rsa-bg); box-shadow: var(--rsa-shadow-sm); }
.rsa-steps > .wp-block-column::before { content: "Step " counter(rsa-step); font: 700 .7rem/1 var(--rsa-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--rsa-muted); }
.rsa-steps p, .rsa-features p { margin: 0; color: var(--rsa-muted); }
.rsa-cta-cards { gap: clamp(1rem, 3vw, 2rem); }
.rsa-cta-card { position: relative; overflow: hidden; padding: clamp(1.75rem, 4vw, 3rem); border: 1px solid rgba(255, 255, 255, .2); border-radius: var(--rsa-radius-lg); background: linear-gradient(160deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .03)); color: #fff; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18); transition: transform .4s var(--rsa-ease-out), border-color .3s var(--rsa-ease); }
.rsa-cta-card:hover { border-color: rgba(255, 255, 255, .4); transform: translateY(-3px); }
@media (prefers-reduced-motion: reduce) { .rsa-cta-card { transition: none; } .rsa-cta-card:hover { transform: none; } }
.rsa-cta-card h2 { margin-top: 0; color: #fff; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.rsa-cta-card p { color: #dbe5f5; }
.rsa-cta-card .wp-block-button.is-style-outline .wp-block-button__link { background: #fff; color: #14294d; border: 0; }
.rsa-cta-card .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #e7edf7; color: #14294d; }
.rsa-faq { padding: 1.1rem 0; border-bottom: 1px solid var(--rsa-border); }
.rsa-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; list-style: none; font: 700 1.08rem/1.3 var(--rsa-font-head); }
.rsa-faq summary::-webkit-details-marker { display: none; }
.rsa-faq summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--rsa-chip); color: var(--rsa-link); font: 500 1.25rem/1 var(--rsa-font-body); transition: transform .25s var(--rsa-ease); }
.rsa-faq[open] summary::after { transform: rotate(45deg); }
@media (prefers-reduced-motion: reduce) { .rsa-faq summary::after { transition: none; } }
.rsa-faq p { margin: .75rem 0 0; color: var(--rsa-muted); }
.rsa-reviews { gap: clamp(1rem, 3vw, 2rem); }
.rsa-review { margin: 0; padding: 1.75rem; border: 1px solid var(--rsa-border); border-radius: var(--rsa-radius); background: var(--rsa-bg); box-shadow: var(--rsa-shadow-sm); }
.rsa-review cite { display: block; margin-top: .75rem; font-style: normal; font-weight: 600; color: var(--rsa-muted); }
.wp-block-button .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; min-height: var(--rsa-control-h, 48px); padding: .8rem 1.5rem; font-size: .95rem; transition: background-color .2s var(--rsa-ease), transform .2s var(--rsa-ease); }
.wp-block-button .wp-block-button__link:hover { transform: translateY(-1px); }
@media (prefers-reduced-motion: reduce) { .wp-block-button .wp-block-button__link { transition: none; } .wp-block-button .wp-block-button__link:hover { transform: none; } }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--rsa-link); border: 1px solid currentColor; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--rsa-surface); }
.rsa-section .wp-block-heading + .rsa-steps, .rsa-section .wp-block-heading + .rsa-reviews { margin-top: 1.5rem; }

/* ---------- blog and generic pages ---------- */
.rsa-blog { padding-top: 1.5rem; padding-bottom: 3rem; }
.rsa-post-card { display: grid; gap: .5rem; align-content: start; }
.rsa-post-card .wp-block-post-featured-image { margin: 0 0 .5rem; border-radius: var(--rsa-radius); overflow: hidden; aspect-ratio: 16 / 10; }
.rsa-post-card .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }
.rsa-post-card .wp-block-post-title { margin: 0; font-size: 1.15rem; }
.rsa-post-card .wp-block-post-title a { color: var(--rsa-ink); text-decoration: none; }
.rsa-post-card .wp-block-post-date { color: var(--rsa-muted); font-size: .85rem; }
.rsa-post-card .wp-block-post-excerpt { margin: 0; color: var(--rsa-muted); font-size: .95rem; }
.rsa-contact-cols { gap: clamp(1.25rem, 3vw, 3rem); }
@media (max-width: 960px) { .rsa-contact-cols { flex-wrap: wrap !important; } .rsa-contact-cols > .wp-block-column { flex-basis: 100% !important; } }
.wp-block-search__input { min-height: var(--rsa-control-h, 48px); padding: .7rem .9rem; border: 1px solid var(--rsa-border); border-radius: var(--rsa-radius-sm); background: var(--rsa-bg); color: var(--rsa-ink); }
.rsa-checklist { list-style: none; padding: 0; display: grid; gap: .6rem; }
.rsa-checklist li { position: relative; padding-left: 1.9rem; }
.rsa-checklist li::before { content: ""; position: absolute; left: 0; top: .3em; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: var(--rsa-success) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 70% no-repeat; }

[data-theme="dark"] .rsa-header::before { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06); }

/* Footer call-to-action: a glass panel above the link columns, so every page ends with a clear next step. */
.rsa-footer__cta { gap: 1.25rem 2rem; margin-bottom: clamp(2.5rem, 6vw, 4rem); padding: clamp(1.5rem, 4vw, 2.5rem) clamp(1.5rem, 4vw, 3rem); border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--rsa-radius-lg, 24px); background: linear-gradient(120deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .02)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12); }
.rsa-footer__cta-text > * { margin: 0; }
.rsa-footer__cta-title { color: #fff; font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.6rem); font-weight: 800; letter-spacing: -.03em; }
.rsa-footer__cta-lead { margin-top: .5rem !important; color: #c8d6ee; font-size: 1.05rem; }
.rsa-footer__cta-buttons { gap: 10px; }
.rsa-footer .rsa-footer__cta-primary .wp-block-button__link { background: #fff; color: #14294d; }
.rsa-footer .rsa-footer__cta-primary .wp-block-button__link:hover { background: #e7edf7; color: #14294d; }
.rsa-footer .rsa-footer__cta-secondary .wp-block-button__link { color: #fff; border-color: rgba(255, 255, 255, .45); }
.rsa-footer .rsa-footer__cta-secondary .wp-block-button__link:hover { background: rgba(255, 255, 255, .12); color: #fff; }
/* A heading inside a column (Contact "Details", About "Get in touch") is a sub-section title, one step below a band title. */
:where(main) .wp-block-column > h2.wp-block-heading { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); letter-spacing: -.03em; }
