.garage-rent-hero {
	position: relative;
	display: grid;
	gap: var(--space-lg);
	min-height: calc(100vh - var(--header-height));
	align-items: end;
	overflow: hidden;
}

.garage-rent-hero__video,
.garage-rent-hero__video iframe,
.garage-rent-hero__video video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.garage-rent-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(193, 18, 31, 0.12), rgba(0, 0, 0, 0.82));
}

.garage-rent-hero__content {
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--space-md);
	padding-block: var(--space-2xl);
}

.garage-filter-bar {
	display: grid;
	gap: var(--space-sm);
	padding: var(--space-md);
}

.garage-filter-grid {
	display: grid;
	gap: var(--space-sm);
}

.garage-active-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.garage-filter-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.5rem 0.75rem;
	border-radius: var(--radius-pill);
	background: rgba(193, 18, 31, 0.12);
	color: var(--text-strong);
}

.garage-vehicle-grid {
	display: grid;
	gap: var(--space-md);
}

.garage-vehicle-card {
	position: relative;
	display: grid;
	gap: var(--space-sm);
	padding: var(--space-md);
	overflow: hidden;
}

.garage-vehicle-card__media {
	border-radius: var(--radius-md);
	overflow: hidden;
}

.garage-vehicle-card__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform var(--transition-slow);
}

.garage-vehicle-card:hover .garage-vehicle-card__media img {
	transform: scale(1.05);
}

.garage-vehicle-card__quick {
	position: absolute;
	right: var(--space-md);
	top: var(--space-md);
	opacity: 0;
	transform: translate3d(0, -0.5rem, 0);
	transition: opacity var(--transition-base), transform var(--transition-base);
}

.garage-vehicle-card:hover .garage-vehicle-card__quick {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.garage-results-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-sm);
}

.garage-compare-tray {
	position: sticky;
	bottom: var(--space-md);
	z-index: var(--layer-z-raised);
	display: grid;
	gap: 0.75rem;
	padding: var(--space-md);
	margin-top: var(--space-lg);
}

.garage-compare-items {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.garage-compare-item {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 0.75rem;
	border-radius: var(--radius-pill);
	background: rgba(255, 255, 255, 0.05);
}

.garage-compare-table {
	overflow-x: auto;
	max-height: 0;
	transition: max-height var(--transition-slow);
}

.garage-compare-tray.is-open .garage-compare-table {
	max-height: 28rem;
}

[data-load-more].is-loading {
	opacity: 0.6;
	pointer-events: none;
}

@media (min-width: 768px) {
	.garage-filter-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.garage-vehicle-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.garage-filter-grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	.garage-vehicle-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
