/* =========================================================
   ALSTON — FLEET HUB (2026 design)
   Uses the one-screen system (home.css) and the About header
   (about-2026.css). Each section is exactly one screen.
========================================================= */

/* ---------- 1. Header finder ---------- */
.fl-finder {
	grid-column: 10 / span 3;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-left: 24px;
	border-left: 1px solid rgba(255, 255, 255, .25);
	color: #FFFFFF;
}

.fl-finder__label {
	font: 500 10px/1.2 "Inter", system-ui, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .65);
}

.fl-finder__num {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.fl-finder__num output {
	font: 200 clamp(44px, calc(var(--vh) * 7), 64px)/1 "Jost", "Helvetica Neue", sans-serif;
	font-variant-numeric: tabular-nums;
}

.fl-finder__num span {
	font: 300 14px/1 "Inter", system-ui, sans-serif;
	color: rgba(255, 255, 255, .75);
}

.fl-finder input[type="range"] {
	width: 100%;
	accent-color: #C9A961;
	cursor: pointer;
}

.fl-finder__msg {
	margin: 0;
	font: 300 14px/1.5 "Inter", system-ui, sans-serif;
	color: rgba(255, 255, 255, .88);
}

.fl-finder__go {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font: 500 10px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #C9A961;
	text-decoration: none;
}

.fl-finder__go:hover {
	color: #FFFFFF;
}

/* ---------- 2. Showroom ---------- */
.fl-show {
	gap: 0;
}

.fl-tabs {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	border-bottom: 1px solid #E6E6E6;
}

.fl-tab {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: clamp(10px, calc(var(--vh) * 1.8), 18px) 14px;
	border: 0;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	background: none;
	color: #8A8A8A;
	text-align: left;
	cursor: pointer;
	transition: color .4s, border-color .4s, background .3s;
}

.fl-tab:hover {
	background: #FAFAFA;
	color: #3A3A3A;
}

.fl-tab.is-on {
	color: #0E0E0E;
	border-bottom-color: #C9A961;
}

.fl-tab:focus-visible {
	outline: 2px solid #C9A961;
	outline-offset: -2px;
}

.fl-tab__n {
	display: flex;
	align-items: baseline;
	gap: 7px;
	font: 200 clamp(24px, calc(var(--vh) * 3.8), 32px)/1 "Jost", "Helvetica Neue", sans-serif;
	letter-spacing: -.02em;
}

.fl-tab__n small {
	font: 500 9.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.fl-tab__c {
	font: 400 12px/1.3 "Inter", system-ui, sans-serif;
}

.fl-panels {
	flex: 1;
	min-height: 0;
	display: flex;
}

.fl-v {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.fl-v[hidden] {
	display: none;
}

.fl-v.is-on {
	animation: ahRise .6s var(--ac-ease) both;
}

.fl-v__head {
	flex: none;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 20px;
	padding-top: clamp(14px, calc(var(--vh) * 2.8), 32px);
}

.fl-v__title {
	margin: clamp(8px, calc(var(--vh) * 1.4), 14px) 0 0;
	font: 200 clamp(30px, min(4.4vw, calc(var(--vh) * 6.6)), 64px)/1.02 "Jost", "Helvetica Neue", sans-serif;
	letter-spacing: -.015em;
}

.fl-v__model {
	margin: 6px 0 0;
	font: 300 clamp(15px, calc(var(--vh) * 2.2), 20px)/1.3 "Jost", "Helvetica Neue", sans-serif;
	color: #5A5A5A;
}

.fl-v__nav {
	display: flex;
	gap: 10px;
	padding-bottom: 6px;
}

.fl-v__stagewrap {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: clamp(12px, calc(var(--vh) * 2.4), 28px);
}

.fl-stage {
	position: relative;
	flex: 1;
	min-height: 120px;
	overflow: hidden;
	background: #0E0E0E;
	color: #FFFFFF;
}

.fl-stage.is-light {
	background: linear-gradient(to bottom, #FFFFFF, #ECECEC);
	color: #0E0E0E;
}

.fl-stage__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transform: scale(1.06);
	transition: opacity .8s var(--ac-ease), transform 1.2s var(--ac-ease);
}

.fl-stage__img.is-contain {
	inset: 8% 12% 22%;
	width: 76%;
	height: 70%;
	object-fit: contain;
}

.fl-stage__img.is-on {
	opacity: 1;
	transform: none;
}

.fl-stage__shade {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 45%;
	background: linear-gradient(to top, rgba(14, 14, 14, .75), transparent);
	pointer-events: none;
}

.fl-stage.is-light .fl-stage__shade {
	display: none;
}

.fl-keys {
	position: absolute;
	left: clamp(18px, 2.6vw, 40px);
	bottom: clamp(16px, calc(var(--vh) * 3.6), 36px);
	display: flex;
	gap: clamp(20px, 3vw, 44px);
	margin: 0;
}

.fl-keys div {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.fl-keys dd {
	margin: 0;
	font: 200 clamp(26px, calc(var(--vh) * 5), 44px)/1 "Jost", "Helvetica Neue", sans-serif;
}

.fl-keys dt {
	font: 500 10px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
	opacity: .75;
}

.fl-thumbs {
	flex: none;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	height: clamp(56px, calc(var(--vh) * 11), 120px);
}

.fl-thumb {
	position: relative;
	padding: 0;
	border: 1px solid #E6E6E6;
	background: #0E0E0E;
	overflow: hidden;
	cursor: pointer;
	transition: border-color .3s;
}

.fl-thumb.is-contain {
	background: linear-gradient(to bottom, #FFFFFF, #ECECEC);
}

.fl-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .6;
	transition: opacity .4s, transform .6s var(--ac-ease);
}

.fl-thumb.is-contain img {
	object-fit: contain;
	padding: 6px;
}

.fl-thumb:hover img,
.fl-thumb.is-on img {
	opacity: 1;
}

.fl-thumb:hover img {
	transform: scale(1.04);
}

.fl-thumb.is-on {
	border-color: #C9A961;
}

.fl-thumb span {
	position: absolute;
	left: 12px;
	bottom: 10px;
	font: 500 9.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #FFFFFF;
	text-shadow: 0 1px 8px rgba(0, 0, 0, .7);
}

.fl-thumb.is-contain span {
	color: #0E0E0E;
	text-shadow: none;
}

.fl-thumb:focus-visible {
	outline: 2px solid #C9A961;
	outline-offset: 2px;
}

/* ---------- 3. Details ---------- */
.fl-d {
	flex: 1;
	min-height: 0;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: minmax(0, 1fr);
	gap: 24px;
}

.fl-d[hidden] {
	display: none;
}

.fl-d.is-on {
	animation: ahRise .6s var(--ac-ease) both;
}

.fl-d__copy {
	grid-column: 1 / span 5;
	min-height: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(12px, calc(var(--vh) * 2.4), 26px);
}

.fl-d__lead {
	margin: 0;
	font: 300 clamp(18px, calc(var(--vh) * 2.8), 24px)/1.45 "Jost", "Helvetica Neue", sans-serif;
}

.fl-d__body {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
	overflow: hidden;
}

.fl-d__best {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.fl-d__best ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fl-d__best li {
	padding: 9px 14px;
	border: 1px solid #E6E6E6;
	font: 400 12.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .02em;
	transition: border-color .3s, background .3s;
}

.fl-d__best li:hover {
	border-color: #C9A961;
	background: #FBF8F1;
}

.fl-d__cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px 24px;
	padding-top: 4px;
}

.fl-d__card {
	grid-column: 7 / span 6;
	min-height: 0;
	display: flex;
	flex-direction: column;
	border: 1px solid #E6E6E6;
}

.fl-info__tabs {
	flex: none;
	display: flex;
	border-bottom: 1px solid #E6E6E6;
	overflow-x: auto;
	scrollbar-width: none;
}

.fl-info__tabs::-webkit-scrollbar {
	display: none;
}

.fl-info__tabs button {
	flex: 1 0 auto;
	padding: 16px 18px;
	border: 0;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	background: none;
	font: 500 10.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #8A8A8A;
	cursor: pointer;
	white-space: nowrap;
	transition: color .3s, border-color .3s;
}

.fl-info__tabs button.is-on {
	color: #0E0E0E;
	border-bottom-color: #C9A961;
}

.fl-info__tabs button:focus-visible {
	outline: 2px solid #C9A961;
	outline-offset: -2px;
}

.fl-info__pane {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	padding: clamp(16px, calc(var(--vh) * 3), 30px);
}

.fl-info__pane[hidden] {
	display: none;
}

.fl-info__pane[data-fl-info-pane="layout"] {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.fl-info__pane[data-fl-info-pane="layout"][hidden] {
	display: none;
}

.fl-info__note {
	margin: 0;
	font: 400 12.5px/1.4 "Inter", system-ui, sans-serif;
	color: #6B6B6B;
}

.fl-layout {
	flex: 1;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: #FAFAFA;
	border: 1px solid #EFEFEF;
}

.fl-layout svg {
	width: 100%;
	height: 100%;
	max-height: 300px;
}

.fl-legend {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	font: 400 10.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #6B6B6B;
}

.fl-legend span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.fl-legend i {
	width: 12px;
	height: 12px;
	border-radius: 2px;
}

.fl-legend .is-seat { background: #0E0E0E; }
.fl-legend .is-driver { background: #C9A961; }
.fl-legend .is-door { border: 1px solid #C9A961; }

.fl-specs {
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-top: 1px solid #E6E6E6;
	border-left: 1px solid #E6E6E6;
}

.fl-specs div {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: clamp(10px, calc(var(--vh) * 1.7), 16px) 16px;
	border-right: 1px solid #E6E6E6;
	border-bottom: 1px solid #E6E6E6;
}

.fl-specs dt {
	font: 500 9.5px/1 "Inter", system-ui, sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #6B6B6B;
}

.fl-specs dd {
	margin: 0;
	font: 400 13.5px/1.35 "Inter", system-ui, sans-serif;
}

.fl-amen {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.fl-amen li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 1px solid #E6E6E6;
	font: 400 12.5px/1.3 "Inter", system-ui, sans-serif;
}

.fl-amen li > span {
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #F5F0E4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.fl-amen li.is-no {
	color: #9A9A9A;
	text-decoration: line-through;
	text-decoration-color: rgba(0, 0, 0, .2);
}

.fl-amen li.is-no > span {
	background: #F2F2F2;
}

.fl-lug {
	display: flex;
	flex-direction: column;
	gap: 12px;
	font: 300 14px/1.65 "Inter", system-ui, sans-serif;
	color: #5A5A5A;
}

.fl-lug p {
	margin: 0;
}

.fl-lug__t {
	font: 400 19px/1.35 "Jost", "Helvetica Neue", sans-serif !important;
	color: #0E0E0E;
}

.fl-lug .ah-eyebrow {
	margin-top: 10px;
}

/* ---------- 4. Compare ---------- */
.fl-cmp {
	background: #0E0E0E;
	color: #FFFFFF;
}

.fl-cmp .ah-head__side {
	color: rgba(255, 255, 255, .7);
}

.fl-cmp__wrap {
	flex: 1;
	min-height: 0;
	margin-top: var(--gap);
	overflow: auto;
	scrollbar-width: thin;
}

.fl-table {
	width: 100%;
	min-width: 880px;
	height: 100%;
	border-collapse: collapse;
	table-layout: fixed;
	border-top: 1px solid rgba(255, 255, 255, .15);
}

.fl-table td:first-child,
.fl-table tbody th {
	width: 150px;
}

.fl-table thead th {
	padding: clamp(10px, calc(var(--vh) * 2), 22px) 14px;
	border-left: 1px solid rgba(255, 255, 255, .08);
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	text-align: left;
	vertical-align: top;
	font-weight: normal;
}

.fl-table thead a {
	display: flex;
	flex-direction: column;
	gap: 8px;
	color: #FFFFFF;
	text-decoration: none;
}

.fl-table__img {
	display: block;
	height: clamp(44px, calc(var(--vh) * 9), 90px);
	overflow: hidden;
	background: #1A1A1A;
}

.fl-table__img.is-contain {
	background: #F2F2F2;
}

.fl-table__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fl-table__img.is-contain img {
	object-fit: contain;
	padding: 6px;
}

.fl-table__name {
	font: 300 clamp(17px, calc(var(--vh) * 2.6), 22px)/1.2 "Jost", "Helvetica Neue", sans-serif;
}

.fl-table__cls {
	font: 400 11px/1.4 "Inter", system-ui, sans-serif;
	color: rgba(255, 255, 255, .6);
}

.fl-table tbody th {
	padding: 0 12px 0 0;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	text-align: left;
	font: 500 10px/1.4 "Inter", system-ui, sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
}

.fl-table tbody td {
	padding: clamp(8px, calc(var(--vh) * 1.5), 16px) 14px;
	border-left: 1px solid rgba(255, 255, 255, .08);
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	font: 300 clamp(12.5px, calc(var(--vh) * 1.8), 14.5px)/1.4 "Inter", system-ui, sans-serif;
	color: rgba(255, 255, 255, .78);
	vertical-align: middle;
}

.fl-table [data-fl-col].is-hl {
	background: rgba(201, 169, 97, .1);
	color: #FFFFFF;
}

/* ---------- 5. Standard ---------- */
.fl-std__grid {
	flex: 1;
	min-height: 0;
	margin-top: var(--gap);
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: minmax(0, 1fr);
	gap: 24px;
}

.fl-std__img {
	grid-column: 1 / span 5;
	position: relative;
	margin: 0;
	min-height: 0;
	overflow: hidden;
}

.fl-std__img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fl-std__list {
	grid-column: 6 / span 7;
	min-height: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: minmax(0, 1fr);
	border-top: 1px solid #E6E6E6;
	border-left: 1px solid #E6E6E6;
}

.fl-std__list li {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(6px, calc(var(--vh) * 1.2), 12px);
	padding: clamp(12px, calc(var(--vh) * 2.4), 28px) clamp(16px, 2vw, 28px);
	border-right: 1px solid #E6E6E6;
	border-bottom: 1px solid #E6E6E6;
	transition: background .3s;
}

.fl-std__list li:hover {
	background: #FAFAFA;
}

.fl-std__ico {
	width: clamp(36px, calc(var(--vh) * 5.4), 48px);
	height: clamp(36px, calc(var(--vh) * 5.4), 48px);
	border-radius: 50%;
	background: #F5F0E4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.fl-std__t {
	font: 400 clamp(16px, calc(var(--vh) * 2.5), 21px)/1.25 "Jost", "Helvetica Neue", sans-serif;
}

.fl-std__d {
	font: 300 clamp(12.5px, calc(var(--vh) * 1.75), 14px)/1.55 "Inter", system-ui, sans-serif;
	color: #5A5A5A;
}

/* ---------- Compare table on shorter screens ---------- */
@media (max-height: 900px) {

	.fl-table__img {
		display: none;
	}

	.fl-table thead th {
		padding: 10px 12px;
	}

	.fl-table tbody td {
		padding: 7px 12px;
		font-size: 12.5px;
		line-height: 1.35;
	}
}

@media (max-height: 700px) {

	.fl-table tbody tr:last-child {
		display: none;
	}
}

/* ---------- Short desktop screens ---------- */
@media (max-height: 820px) and (min-width: 1025px) {

	.fl-d__body {
		-webkit-line-clamp: 3;
	}

	.fl-v__model {
		display: none;
	}
}

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {

	.fl-finder {
		grid-column: 1 / -1;
		padding: 12px 0 0;
		border-left: 0;
		border-top: 1px solid rgba(255, 255, 255, .25);
		max-width: 420px;
	}

	.fl-tabs {
		display: flex;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.fl-tabs::-webkit-scrollbar {
		display: none;
	}

	.fl-tab {
		flex: 0 0 auto;
		min-width: 120px;
	}

	.fl-d {
		grid-template-columns: 1fr;
		grid-template-rows: auto minmax(0, 1fr);
		gap: var(--gap);
	}

	.fl-d__copy,
	.fl-d__card {
		grid-column: 1 / -1;
	}

	.fl-d__copy {
		justify-content: flex-start;
	}

	.fl-d__body {
		-webkit-line-clamp: 3;
	}

	.fl-std__img {
		grid-column: 1 / span 4;
	}

	.fl-std__list {
		grid-column: 5 / span 8;
	}
}

/* ---------- Phone ---------- */
@media (max-width: 700px) {

	.fl-finder {
		gap: 6px;
	}

	.fl-finder__num output {
		font-size: 38px;
	}

	.fl-tab {
		min-width: 92px;
		padding: 10px 12px;
	}

	.fl-tab__c {
		display: none;
	}

	.fl-v__nav {
		display: none;
	}

	.fl-v__title {
		font-size: 30px;
	}

	.fl-v__model {
		font-size: 14px;
	}

	.fl-keys {
		gap: 16px;
	}

	.fl-keys dd {
		font-size: 22px;
	}

	.fl-keys dt {
		font-size: 8.5px;
	}

	.fl-thumbs {
		gap: 6px;
	}

	.fl-thumb span {
		display: none;
	}

	.fl-d__lead {
		font-size: 17px;
	}

	.fl-d__body,
	.fl-d__best {
		display: none;
	}

	.fl-d__cta .ac-btn {
		height: 46px;
		padding: 0 16px;
		font-size: 10px;
	}

	.fl-amen {
		grid-template-columns: 1fr 1fr;
		gap: 6px;
	}

	.fl-amen li {
		padding: 8px 10px;
		font-size: 12px;
	}

	.fl-amen li > span {
		width: 28px;
		height: 28px;
	}

	.fl-specs {
		grid-template-columns: 1fr;
	}

	.fl-cmp .ah-head__side {
		display: none;
	}

	.fl-table {
		min-width: 760px;
	}

	.fl-table td:first-child,
	.fl-table tbody th {
		width: 96px;
	}

	.fl-table__img {
		display: none;
	}

	.fl-table tbody td {
		padding: 7px 10px;
		font-size: 12px;
	}

	.fl-std .ah-head__side,
	.fl-std__img {
		display: none;
	}

	.fl-std__list {
		grid-column: 1 / -1;
	}

	.fl-std__d {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}
}

@media (max-width: 700px) and (max-height: 720px) {

	.ab-hero.fl-hero .ab-hero__text {
		display: none;
	}

	.fl-std__d {
		display: none;
	}

	.fl-d__lead {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}
}