/**
 * Fleet overview table.
 */

.fo-page {
	background: var(--cv-bg, #f4f6f8);
	color: var(--cv-ink, #16212b);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.55;
	padding-bottom: 60px;
}

.fo-page *,
.fo-page *::before,
.fo-page *::after {
	box-sizing: border-box;
}

.fo-shell {
	max-width: 1300px;
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 32px);
}

.fo-head {
	padding-block: clamp(26px, 4vw, 44px) clamp(18px, 2.5vw, 26px);
}

.fo-eyebrow {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--cv-accent-700, #b94c2b);
}

.fo-title {
	margin: 0;
	font-family: inherit;
	font-size: clamp(27px, 4vw, 40px);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--cv-ink, #16212b);
}

.fo-lead {
	margin: 12px 0 0;
	font-size: 15px;
	color: var(--cv-muted, #5d6b78);
}

.fo-lead a {
	color: var(--cv-navy, #0f385c);
	font-weight: 600;
}

/* Table ---------------------------------------------------------------- */

.fo-tablewrap {
	background: #fff;
	border: 1px solid var(--cv-line, #dfe5ea);
	border-radius: 14px;
	box-shadow: var(--cv-shadow, 0 1px 2px rgba(16, 33, 48, .06));
}

.fo-table {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
	font-size: 14.5px;
}

.fo-table thead th {
	position: sticky;
	top: var(--ac-header-h, 0px);
	z-index: 2;
	padding: 13px 18px;
	/* The wrapper has no overflow on desktop, so this sticks to the viewport. */
	text-align: left;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--cv-muted, #5d6b78);
	background: #f7f9fb;
	border-bottom: 1px solid var(--cv-line, #dfe5ea);
	white-space: nowrap;
}

.fo-th-sub {
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	color: var(--cv-accent-700, #b94c2b);
}

.fo-table td,
.fo-table tbody th {
	padding: 12px 18px;
	text-align: left;
	font-weight: 400;
	vertical-align: top;
	border-bottom: 1px solid #eef2f5;
}

.fo-num {
	text-align: right !important;
	white-space: nowrap;
}

.fo-row:hover td,
.fo-row:hover th {
	background: #f7fafc;
}

/* Car cell ------------------------------------------------------------- */

.fo-car a {
	font-weight: 700;
	color: var(--cv-ink, #16212b);
	text-decoration: none;
}

.fo-car a:hover {
	color: var(--cv-navy, #0f385c);
	text-decoration: underline;
}

.fo-car__sub {
	display: block;
	margin-top: 2px;
	font-size: 12.5px;
	font-weight: 400;
	color: var(--cv-muted, #5d6b78);
}

.fo-age {
	display: block;
	font-size: 12px;
	color: var(--cv-muted, #5d6b78);
}

.fo-price__main {
	font-weight: 700;
	color: var(--cv-navy, #0f385c);
}

.fo-price__ask {
	font-weight: 400;
	color: var(--cv-muted, #5d6b78);
}

.fo-price__dealer {
	display: block;
	margin-top: 2px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--cv-accent-700, #b94c2b);
}

/* Spacing between name groups ------------------------------------------ */

.fo-gap td {
	padding: 0;
	height: 14px;
	background: var(--cv-bg, #f4f6f8);
	border-bottom: 1px solid var(--cv-line, #dfe5ea);
	border-top: 1px solid var(--cv-line, #dfe5ea);
}

/* Sold rows ------------------------------------------------------------ */

.fo-row--sold th,
.fo-row--sold td {
	color: #98a3ad;
	background: #fbfcfd;
}

.fo-row--sold .fo-car a,
.fo-row--sold .fo-car__sub,
.fo-row--sold .fo-age,
.fo-row--sold .fo-price__main {
	color: #98a3ad;
}

.fo-row--sold .fo-price__main {
	font-weight: 400;
	text-decoration: line-through;
}

.fo-sold {
	margin-left: 6px;
	font-size: 12.5px;
	font-weight: 600;
	color: #98a3ad;
}

.fo-note,
.fo-empty {
	margin: 18px 0 0;
	font-size: 13.5px;
	color: var(--cv-muted, #5d6b78);
}

.fo-note a {
	color: var(--cv-navy, #0f385c);
	font-weight: 600;
}

/* The wrapper's rounded corners can no longer clip the header, so round it. */
.fo-table thead th:first-child { border-top-left-radius: 14px; }
.fo-table thead th:last-child  { border-top-right-radius: 14px; }

@media (max-width: 900px) {
	/* Below this the table is wider than the screen and has to scroll
	   sideways; that scroll container would break the sticky header. */
	.fo-tablewrap {
		overflow-x: auto;
	}

	.fo-table thead th {
		position: static;
	}
}

/* Brand section heading ------------------------------------------------ */

.fo-brand th {
	padding: 11px 18px;
	text-align: left;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .03em;
	color: var(--cv-navy, #0f385c);
	background: var(--cv-navy-100, #e7eef4);
	border-bottom: 1px solid var(--cv-line, #dfe5ea);
}

.fo-brand__count {
	margin-left: 8px;
	font-size: 12px;
	font-weight: 500;
	color: var(--cv-muted, #5d6b78);
}

/* Euro equivalent and the dealer price column ------------------------- */

.fo-price__eur {
	display: block;
	margin-top: 1px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--cv-muted, #5d6b78);
}

.fo-th-dealer,
.fo-price--dealer {
	background: #fdf7f4;
}

.fo-price--dealer .fo-price__main {
	color: var(--cv-accent-700, #b94c2b);
}

.fo-row--sold .fo-price__eur {
	color: #b3bcc4;
	text-decoration: line-through;
}

.fo-country {
	display: block;
	font-size: 12.5px;
	color: var(--cv-muted, #5d6b78);
}

/* Only a real price is struck through; "On request" has nothing to strike. */
.fo-row--sold .fo-price__main.fo-price__ask {
	text-decoration: none;
}

.fo-th-eu,
.fo-price--eu {
	background: #f2f7fb;
}

.fo-price--eu .fo-price__main {
	color: #1a6a99;
}

/* Gearbox. The whole fleet is automatic. */
.fo-gear{color:var(--cv-muted,#5d6b78)}
