@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

/*=== base ===*/

.primary-btn {
	padding: .5rem;
	background-color: var(--blue-color);
	border-radius: var(--btn-border-radius);
	color: var(--white-color);
	font-style: italic;
	font-weight: 600;
}

.secondary-btn {
	padding: .5rem;
	background-color: transparent;
	border-radius: var(--btn-border-radius);
	color: var(--white-color);
	font-style: normal;
	font-weight: 600;
}

.aan-hidden {
	display: none !important;
}

.mobile-only,
.mobile-md-only {
	display: none !important;
}

.desktop-only {
	display: flex !important;
}

.desktop-md-only {
	display: block !important;
}

.desktop-flex-md-only {
	display: flex !important;
}

.mobile-flex-md-only {
	display: none !important;
}

.ellipsis {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

/*=== aan ===*/
.aan-container {
	margin: 0 auto;
	padding: 0 var(--px-32);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1rem;
	max-width: 1920px;

	* {
		font-family: "Inter", sans-serif;
		font-optical-sizing: auto;
		font-style: normal;
	}
}

.aan-container.aan-details-page {
	padding: 0 0;
	max-width: 1540px;
	gap: var(--px-30);
}

.aan-content-wrapper {
	grid-column: span 3;
}

.aan-details-swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	aspect-ratio: 7/4;
}

.span-2 {
	grid-column: span 2;
}

.span-3 {
	grid-column: span 3;
}

.column-gap-32 {
	column-gap: var(--px-32) !important;
}

.bb-input-1 {
	border-bottom: 1px solid var(--input-border-color);
}

.aan-grid-1 {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-gap: var(--px-24);
	row-gap: var(--px-16);
	width: 100%;
}

.aan-grid-2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-gap: var(--px-24);
	row-gap: var(--px-32);
	width: 100%;
}

.aan-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: var(--px-24);
	row-gap: var(--px-32);
	width: 100%;
}

.aan-grid-4 {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-gap: var(--px-24);
	row-gap: var(--px-32);
	width: 100%;
}

.aan-location-grid-2 {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	grid-gap: var(--px-24);
	row-gap: var(--px-24);
	width: 100%;
}

.aan-details-page-grid {
	display: grid;
	grid-template-columns: minmax(1071px, 1fr) 437px;
	row-gap: var(--px-32);
	column-gap: var(--px-32);
	width: 100%;
}

.aan-gradient {
	padding: 5rem 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	max-height: 203px;
	/*background: linear-gradient(0deg, rgba(243, 243, 243, 1) 0%, rgba(255, 255, 255, 1) 100%);*/
	border-radius: var(--border-radius);
}

.aan-gradient.simple {
	padding: var(--px-32);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: auto;
}

.aan-gradient.simple img {
	margin-bottom: var(--px-16);
	max-width: 329px;
	width: 100%;
	object-fit: contain;
}

.aan-gradient.simple span {
	font-size: var(--px-15);
	line-height: var(--px-20);
	font-weight: 300;
	font-style: italic;
}

/* === aan-details-header === */

.aan-details-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: var(--px-24);
	line-height: var(--px-24);
	letter-spacing: -1px;
}

.aan-details-header h1 {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--px-8);
}

.aan-vehicle-title h1 {
	margin-bottom: var(--px-8);
	font-size: var(--px-20);
	line-height: var(--px-24);
}

.aan-vehicle-title p {
	font-size: var(--px-16);
	line-height: var(--px-24);
}

.aan-details-header.mobile-flex-md-only span {
	font-size: var(--px-20);
	line-height: var(--px-24);
}

strong {
	font-weight: 600 !important;
}

/* === aan-details-article === */

.aan-details-article {
	display: flex;
	flex-direction: column;
	position: relative;
}

/* === ann-details-box === */

.aan-details-box {
	padding: var(--px-40);
	border: 1px solid var(--grey-border-color);
	border-radius: var(--border-radius);
}

.aan-details-box h2 {
	padding-bottom: var(--px-24);
	font-size: var(--px-20);
	font-weight: 800;
	font-style: italic;
	line-height: var(--px-24);
	border-bottom: 1px solid var(--grey-border-color);
}

.aan-details-box ul {
	padding-top: var(--px-24);
	display: flex;
	flex-direction: column;
	gap: var(--px-32);
}

.aan-list-item {
	display: flex;
	flex-direction: column;
}

.aan-list-item label {
	font-weight: normal;
	font-size: var(--px-16);
	line-height: var(--px-24);
	color: var(--grey-color-2);
}

.aan-list-item span {
	font-weight: 700;
	font-size: var(--px-16);
	line-height: var(--px-24);
	color: var(--text-black-color);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.aan-details-tabs-wrapper {
	display: flex;
	gap: var(--px-12);
}

.aan-details-tabs {
	display: flex;
	gap: var(--px-6);
	overflow: hidden;
	overflow-x: auto;
	width: 100%;

	li {
		flex: 1;
	}

	.aan-details-tab {
		padding: 0;
		border-bottom: 1px solid var(--black-color);
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		height: var(--px-56);
		transition: all .2s;
		font-size: var(--px-16);
		font-weight: 600;
		min-width: 130px;
		width: 100%;

		&:hover {
			color: var(--blue-color);
			border-color: var(--blue-color);
		}
	}
}

.aan-details-tab.active {
	border-color: var(--blue-color);
}

.aan-button-dark {
	padding: 0 var(--px-16);
	background-color: var(--black-color);
	color: var(--white-color);
	border-radius: var(--btn-border-radius);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 196px;
	height: var(--px-56);
	font-size: var(--px-15);
	transition: all .2s;

	&:hover {
		background-color: var(--blue-color);
	}
}

.aan-button-blue {
	padding: 0 var(--px-16);
	background-color: var(--blue-color);
	color: var(--white-color);
	border-radius: var(--btn-border-radius);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 196px;
	width: 100%;
	height: var(--px-56);
	transition: all .2s;
	font-style: italic;
	font-weight: 700;

	&:hover {
		background-color: var(--black-color);
	}
}

/*=== aan-listing-filter ===*/

.aan-listing-filter {
	position: relative;
	top: var(--px-24);
	display: flex;
	gap: var(--px-8);
	flex-direction: column;
	height: fit-content;
	background-color: var(--white-color);
	color: var(--black-color);

	/*box-shadow: var(--box-shadow);*/
}

.aan-listing-filter-box {
	padding: var(--px-20) var(--px-48);
	border-radius: var(--border-radius);
	border: 1px solid var(--grey-border-color);
}

.aan-listing-filter-box:first-child {
	padding: 0;
}

.aan-listing-filter-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--px-38) var(--px-48) var(--px-32) var(--px-48);
	border-bottom: 1px solid var(--grey-border-color);
}

.aan-listing-filter-header button {
	display: none;
	justify-content: center;
	align-items: center;
	gap: var(--px-18);
}

.aan-listing-filter-header button img {
	width: 20px;
	height: 20px;
}

.aan-filter-results {
	display: flex;
	align-items: center;
	gap: var(--px-6);
	letter-spacing: -1px;
}

.aan-filter-results span {
	background-color: var(--blue-color);
	padding: 0 var(--px-8);
	border-radius: var(--border-radius);
	color: var(--white-color);
	letter-spacing: -1px;
}

.aan-listing-filter h3 {
	font-size: var(--px-18);
	font-style: italic;
	font-weight: 800;
	line-height: var(--px-20);
	letter-spacing: -1px;
	width: 100%;
}

.aan-listing-filter .aan-filter-body {
	padding: var(--px-32) 0;
}

.aan-listing-filter .aan-radio-group,
.aan-listing-filter .aan-search-group {
	padding: 0 var(--px-48);
}

/* === aan-radio-btn === */

.aan-radio-label {
	display: block;
	position: relative;
	padding-left: 26px;
	cursor: pointer;
	font-size: var(--px-15);
	font-weight: 400;
	color: var(--text-input-color);
	user-select: none;
}

.aan-radio-label input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.aan-radio-label .checkmark {
	position: absolute;
	top: 1px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: var(--white-color);
	border-radius: 20px;
	border: 2px solid var(--black-color);
}

.aan-radio-label .container:hover input ~ .checkmark {
	background-color: var(--white-color);
}

.aan-radio-label input:checked ~ .checkmark {
	background-color: var(--white-color);
}

.aan-radio-btn.color .aan-radio-label input:checked ~ .checkmark {
	background-color: var(--white-color) !important;
	border-color: var(--blue-color);
}

.aan-radio-label .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

.aan-radio-label input:checked ~ .checkmark:after {
	display: block;
}

.aan-radio-label .checkmark:after {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 12px;
	height: 12px;
	border-radius: 12px;
	background: var(--blue-color);
}

.aan-radio-tab {
	border-radius: var(--border-radius);
	flex: 1;
	text-align: center;
	cursor: pointer;
}

.aan-radio-tab .aan-radio-label {
	padding: var(--px-6);
	border-radius: var(--border-radius);
	line-height: var(--px-20);
	font-weight: 500 !important;
	background-color: var(--grey-radio-btn-color);
}

.aan-radio-tab .aan-radio-label:hover {
	background-color: var(--blue-color);
	color: var(--white-color);
}

.aan-radio-tab .checkmark,
.aan-radio-range-tab .checkmark {
	display: none;
}

.aan-radio-tab .aan-radio-label:has(input:checked) {
	background-color: var(--blue-color);
	color: var(--white-color);
}

.aan-radio-range-tab .aan-radio-label {
	padding: 0;
	font-weight: 500;
	letter-spacing: -1px;
	color: var(--black-color);
	opacity: .2;
}

.aan-radio-range-tab .aan-radio-label:hover {
	opacity: 1;
}

.aan-radio-range-tab .aan-radio-label:has(input:checked) {
	opacity: 1;
}

.aan-radio-range-group {
	display: flex;
	gap: var(--px-8);
}

.aan-radio-range-tab {
	background-color: transparent;
	border: none;

}

/* === aan-icon-checkbox === */

.aan-icon-checkbox {
	padding: 0 !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

.aan-icon-checkbox .aan-checkbox-label {
	padding: var(--px-6);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--px-6);
	background-color: var(--grey-radio-btn-color);
	border-radius: var(--border-radius);
	line-height: var(--px-20);
	flex: 1;
}

.aan-icon-checkbox .aan-checkbox-label:hover,
.aan-icon-checkbox .aan-checkbox-label:has(input:checked) {
	background-color: var(--blue-color);
	color: var(--white-color);
}

.aan-icon-checkbox .aan-checkbox-label:hover img,
.aan-icon-checkbox .aan-checkbox-label:has(input:checked) img {
	filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(100deg) brightness(102%) contrast(103%);
}

.aan-icon-checkbox .checkmark {
	display: none;
}

/* === aan-checkbox.color === */

.aan-checkbox.color {
	position: relative;
	padding-left: var(--px-26);
}

.aan-checkbox.color .checkmark {
	position: absolute;
	top: 1px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: var(--white-color);
	border-radius: 20px;
	border: 2px solid var(--black-color);
}

.aan-checkbox.color input:checked ~ .checkmark,
.aan-checkbox.color .container:hover input ~ .checkmark {
	background-color: var(--white-color);
}

.aan-checkbox.color input:checked ~ .checkmark {
	background-color: var(--white-color) !important;
	border-color: var(--blue-color);
}

.aan-checkbox.color .checkmark:after {
	content: "";
	position: absolute;
	display: none;
	border: 2px solid white;
}

.aan-checkbox.color input:checked ~ .checkmark:after {
	display: block;
	width: 16px;
	height: 16px;
}

.aan-checkbox.color .checkmark:after {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 12px;
	height: 12px;
	border-radius: 12px;
	background: var(--blue-color);
}

.aan-checkbox.color.orange .checkmark,
.aan-checkbox.color.orange .checkmark:after {
	background: var(--orange-color) !important;
}

.aan-checkbox.color.gray .checkmark,
.aan-checkbox.color.gray .checkmark:after {
	background: var(--gray-color) !important;
}

.aan-checkbox.color.blue .checkmark,
.aan-checkbox.color.blue .checkmark:after {
	background: var(--blue-color) !important;
}

.aan-checkbox.color.white .checkmark,
.aan-checkbox.color.white .checkmark:after {
	background: var(--white-color) !important;
}

.aan-checkbox.color.silver .checkmark,
.aan-checkbox.color.silver .checkmark:after {
	background: var(--silver-color) !important;
}

.aan-checkbox.color.yellow .checkmark,
.aan-checkbox.color.yellow .checkmark:after {
	background: var(--yellow-color) !important;
}

.aan-checkbox.color.purple .checkmark,
.aan-checkbox.color.purple .checkmark:after {
	background: var(--purple-color) !important;
}

.aan-checkbox.color.beige .checkmark,
.aan-checkbox.color.beige .checkmark:after {
	background: var(--beige-color) !important;
}

.aan-checkbox.color.teal .checkmark,
.aan-checkbox.color.teal .checkmark:after {
	background: var(--teal-color) !important;
}

.aan-checkbox.color.brown .checkmark,
.aan-checkbox.color.brown .checkmark:after {
	background: var(--brown-color) !important;
}

.aan-checkbox.color.black .checkmark,
.aan-checkbox.color.black .checkmark:after {
	background: var(--black-color) !important;
}

.aan-checkbox.color.red .checkmark,
.aan-checkbox.color.red .checkmark:after {
	background: var(--red-color) !important;
}

.aan-checkbox.color.green .checkmark,
.aan-checkbox.color.green .checkmark:after {
	background: var(--green-color) !important;
}

.aan-checkbox.color.bronze .checkmark,
.aan-checkbox.color.bronze .checkmark:after {
	background: var(--bronze-color) !important;
}

.aan-checkbox.color.pink .checkmark,
.aan-checkbox.color.pink .checkmark:after {
	background: var(--pink-color) !important;
}

.aan-checkbox.color.gold .checkmark,
.aan-checkbox.color.gold .checkmark:after {
	background: var(--gold-color) !important;
}

.aan-checkbox.color.tan .checkmark,
.aan-checkbox.color.tan .checkmark:after {
	background: var(--tan-color) !important;
}

.aan-checkbox.color.copper .checkmark,
.aan-checkbox.color.copper .checkmark:after {
	background: var(--copper-color) !important;
}

.aan-checkbox.color.other .checkmark {
	border: 2px dashed var(--black-color) !important;
}

.aan-checkbox.color.copper:after,
.aan-checkbox.color.gold:after,
.aan-checkbox.color.bronze:after,
.aan-checkbox.color.silver:after {
	content: "";
	background: var(--white-color);
	position: absolute;
	top: 6px;
	left: 10px;
	width: 4px;
	height: 4px;
	border-radius: 4px;
	box-shadow: 0 0 4px 2px var(--white-color);
	filter: blur(1px);
	opacity: .9;
}

/* === aan-radio-group === */

.aan-radio-group {
	margin-bottom: var(--px-32);
}

.aan-radio-group ul {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--px-7);
}

.aan-radio-group ul li {
	flex: 1;
}

.aan-input {
	padding: var(--px-16) var(--px-14);
	text-align: center;
	border-bottom: 1px solid var(--input-border-color);
	width: 100%;
	display: flex;
	align-items: center;
}

.aan-input input:focus-visible {
	outline: none;
}

.aan-input input,
.aan-input input::placeholder {
	font-size: var(--px-15);
	line-height: var(--px-18);
	width: 100%;
	font-weight: 400;
	color: var(--text-input-color);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.aan-input-group label {
	font-weight: 500;
}

.aan-h1 {
	margin: var(--px-20) 0 var(--px-8) 0;
	font-size: var(--px-14);
	line-height: var(--px-24);
}

.aan-h1 strong {
	font-weight: 800 !important;
}

/* === aan-text-area === */

.aan-text-area {
	display: flex;
	align-items: end;
}

.aan-text-area .aan-button-dark {
	min-width: 146px;
}

.aan-text-area-wrapper {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.aan-text-area-wrapper label {
	font-weight: 500;
	line-height: var(--px-20);
}

.aan-text-area-wrapper textarea {
	padding: var(--px-16);
	border-bottom: 1px solid var(--input-border-color);
	min-height: var(--px-56);
}

.aan-text-area-wrapper textarea:focus-visible {
	outline: none;
}

/* === aan-selector === */

.aan-selector .setting-description {
	width: 100% !important;
}

.aan-selector .setting-description-text {
	font-size: var(--px-15);
	font-weight: 400;
}

.aan-selector .wrapper-dropdown {
	padding: var(--px-16);
	padding-right: var(--px-40);
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--px-6);
	width: 100%;
	text-align: left;
	cursor: pointer;
	user-select: none;
	text-overflow: ellipsis;
	white-space: nowrap;
	border-bottom: 1px solid transparent;
}

.aan-selector .selected-display {
	display: block;
	font-size: var(--px-15);
	line-height: var(--px-18);
	font-weight: 400;
	color: var(--text-input-color);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.aan-selector .scrollable-menu {
	height: auto;
	max-height: 200px;
	overflow-x: hidden;
}

.aan-selector .arrow {
	position: absolute;
	top: var(--px-16);
	right: var(--px-12);
	rotate: 180deg;
}

.aan-selector svg {
	transition: all 0.2s;
}

.aan-selector .dropdown-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.aan-selector .rotated {
	transform: rotate(-180deg);
}

.aan-selector .wrapper-dropdown.active {
	color: var(--black-color);
	border: initial !important;
}

.aan-selector .wrapper-dropdown .dropdown {
	margin: 0;
	padding: 0;
	transition: 0.2s;
	position: absolute;
	top: calc(100% + var(--px-16));
	right: 0;
	left: 0;
	list-style: none;
	z-index: 99;
	transform-origin: top;
	user-select: none;
	opacity: 0;
	visibility: hidden;
	background-color: var(--white-color);
	box-shadow: var(--box-shadow);
	border-radius: var(--border-radius-5px);
	gap: var(--px-6);
	max-height: 440px;
	overflow-y: auto;
}

.aan-selector .wrapper-dropdown .dropdown li {
	padding: 0 var(--px-14);
	line-height: var(--px-42);
	overflow: hidden;
	border: initial;
	min-height: var(--px-42);
}

.aan-selector .dropdown {
	padding: 0.5rem !important;
}

.aan-selector .wrapper-dropdown .dropdown li:hover {
	background-color: var(--blue-color);
	color: var(--white-color);
	border-radius: var(--border-radius-5px);
}

.aan-selector .wrapper-dropdown.active .dropdown {
	opacity: 1;
	visibility: visible;
}

.aan-selector.aan-mobile-selector {
	border-bottom: 1px solid var(--grey-border-color);
}

.aan-selector.aan-mobile-selector .selected-display {
	color: var(--grey-border-color);
}

.aan-selector.aan-mobile-selector .wrapper-dropdown {
	padding: var(--px-16);
}

.aan-selector.aan-mobile-selector .arrow {
	display: none;
}

.aan-search-group {
	display: flex;
	flex-direction: column;
	gap: var(--px-32);
	text-align: left;
}

.aan-search-group ul {
	display: flex;
	flex-direction: column;
	gap: var(--px-32);
}

.aan-search-group li {
	display: flex;
	flex-direction: column;
	gap: var(--px-6);
	border-bottom: 1px solid var(--input-border-color);
}

.aan-search-group .none {
	opacity: .5;
	pointer-events: none;
	text-align: center;
	cursor: auto;
}

.aan-search-group label {
	font-weight: 500;
	letter-spacing: -1px;
}

.aan-button-group {
	display: flex;
	flex-direction: column;
	gap: var(--px-6);
}

.aan-button-group.row-group {
	flex-direction: row;
	gap: var(--px-16);
}

.aan-button-group.row-group button {
	flex: 1;
}

.aan-button-group .primary-btn {
	font-style: italic;
}

.aan-button-group .secondary-btn {
	color: var(--black-color);
}

/* === aan-multi-range-slider === */

.aan-multi-range-slider {
	display: flex;
	flex-direction: column;
}

.aan-multi-range-slider .aan-value-wrapper {
	display: flex;
	align-items: end;
	justify-content: space-between;
}

.aan-multi-range-slider .min-value,
.aan-multi-range-slider .max-value {
	padding: var(--px-16) 0;
	width: 100%;
	max-width: 68px;
	background-color: var(--white-color);
}

.aan-multi-range-slider .min-value input:focus-visible,
.aan-multi-range-slider .max-value input:focus-visible {
	outline: none;
}

.aan-multi-range-slider input {
	width: 100%;
	background-color: initial;
	text-align: center;
	font-size: var(--px-15);
	color: var(--text-input-color);
	font-weight: 400;
}

.aan-multi-range-slider input[type="number"]::-webkit-inner-spin-button,
.aan-multi-range-slider input[type="number"]::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

.aan-multi-range-slider .range-slider {
	position: relative;
	width: 100%;
	height: 4px;
	border-radius: var(--border-radius-5px);
	background-color: #B3D0FA;
}

.aan-multi-range-slider .range-slider .progress {
	position: absolute;
	height: 100%;
	border-radius: var(--border-radius-5px);
	background-color: var(--blue-color);
}

.range-slider input[type="range"] {
	position: absolute;
	width: 100%;
	height: 8px;
	-webkit-appearance: none;
	pointer-events: none;
	background: none;
	outline: none;
}

.range-slider .range-min::-webkit-slider-thumb,
.range-slider .range-max::-webkit-slider-thumb {
	pointer-events: auto;
	-webkit-appearance: none;
	width: var(--px-16);
	height: var(--px-16);
	background: var(--blue-color);
	border: 3px solid var(--blue-color);
	border-radius: var(--px-16);
	opacity: 1;
	cursor: pointer;
	position: relative;
	top: -2px;
}

/*=== aan-listing-card ===*/

.aan-listing-card {
	display: flex;
	flex-direction: column;
	gap: var(--px-24);
}

.aan-listing-card:hover .aan-details-btn {
	color: var(--blue-color);
	transition: all .2s;
}

.aan-listing-card-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	gap: var(--px-16);
}

.aan-listing-card-content-text {
	display: flex;
	flex-direction: column;
	gap: var(--px-22);
}

.aan-listing-text {
	display: flex;
	align-items: start;
	justify-content: space-between;
	gap: 1rem;
}

/*.aan-listing-text:hover .aan-details-btn {*/
/*	color: var(--blue-color);*/
/*	border-color: var(--blue-color);*/
/*	transition: all .2s;*/
/*}*/

.aan-listing-text:hover .aan-details-btn:after {
	filter: brightness(0) saturate(100%) invert(28%) sepia(81%) saturate(2587%) hue-rotate(203deg) brightness(101%) contrast(108%);
}

.aan-listing-text-wrapper {
	cursor: text;
}

.aan-location {
	display: flex;
	align-items: start;
	gap: var(--px-8);
	font-size: var(--px-14);
	color: var(--grey-color);
	letter-spacing: -1px;
}

.aan-location img {
	position: relative;
	top: var(--px-2);
	width: var(--px-12);
	filter: brightness(0) saturate(100%) invert(35%) sepia(0%) saturate(1321%) hue-rotate(162deg) brightness(100%) contrast(81%);
}

.aan-listing-card-info {
	padding: 0 var(--px-6);
	margin-bottom: var(--px-2);
	display: flex;
	align-items: start;
	gap: var(--px-24);
}

.aan-listing-card-info-box {
	display: flex;
	align-items: start;
	justify-content: center;
	gap: var(--px-4);
	min-height: var(--px-20);
	font-size: var(--px-13);
	line-height: var(--px-20);
	color: var(--text-input-color);
}

.aan-listing-card-info-box img {
	padding: var(--px-2);
	position: relative;
	width: var(--px-20);
	height: var(--px-20);
	object-fit: cover;
	filter: brightness(0) saturate(100%) invert(35%) sepia(0%) saturate(1321%) hue-rotate(162deg) brightness(100%) contrast(81%);
}

.aan-listing-card-footer {
	padding: var(--px-12) var(--px-22);
	display: flex;
	align-items: end;
	justify-content: space-between;
	font-size: var(--px-18);
	line-height: var(--px-24);
	letter-spacing: -1px;
	background-color: var(--grey-color-3);
	border-radius: var(--border-radius-8px);
}

.aan-listing-card-footer.bid-now {
	padding: var(--px-4) var(--px-6) var(--px-24) var(--px-6);
	background-color: transparent;
	border-bottom: 1px solid var(--grey-border-color);
	border-radius: 0;
}

.aan-listing-text {
	padding: 0 var(--px-6);
}

.aan-listing-text h3 {
	margin-bottom: var(--px-4);
	font-size: var(--px-18);
	line-height: var(--px-20);
	font-weight: 700;
	letter-spacing: -1px;
}

.aan-listing-text p {
	font-size: var(--px-16);
	line-height: var(--px-20);
	font-weight: 400;
	color: var(--grey-color);
	letter-spacing: -1px;
}

.aan-listing-image {
	/*padding-bottom: 32px;*/
	position: relative;
}

/* === aan-lightGallery === */

.lg-outer .lg-thumb-item {
	border-color: transparent !important;
}

.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
	border-color: var(--white-color) !important;
}

.lg-outer .lg-item.lg-complete.lg-zoomable .lg-dummy-img,
.lg-outer .lg-item.lg-complete.lg-zoomable .lg-image {
	border-radius: var(--border-radius);
}

/* === aan-listing-swiper === */

.aan-listing-swiper {
	position: relative;
	background-color: var(--grey-color-3);
	border-radius: var(--border-radius);
	aspect-ratio: 3/2;
	overflow: hidden;
}

.aan-listing-swiper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aan-listing-swiper .aan-listing-card-banner {
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 1;
}

.aan-listing-swiper .aan-listing-card-banner img {
	width: 100%;
}

.aan-listing-content {
	margin-left: var(--px-6);
	position: absolute;
	top: calc(100% - 64px);
	display: flex;
	align-items: center;
	color: var(--white-color);
	height: 64px;
	z-index: 1;
}

.aan-listing-content .aan-year,
.aan-listing-content .aan-price {
	padding: 0 var(--px-12);
	font-size: var(--px-18);
	line-height: var(--px-20);
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.aan-listing-content .aan-year {
	padding-left: var(--px-16);
	border-top-left-radius: 2.5rem;
	border-bottom-left-radius: 2.5rem;
	font-weight: 700;
	font-style: italic;
	background-color: var(--blue-color);
}

.aan-listing-content .aan-price {
	padding-right: var(--px-16);
	border-top-right-radius: 2.5rem;
	border-bottom-right-radius: 2.5rem;
	font-weight: 600;
	background-color: var(--black-color);
}

.aan-details-btn {
	padding-left: var(--px-24);
	border-left: 1px solid var(--grey-border-color);
	position: relative;
	line-height: var(--px-24);
	font-weight: 700;
	font-size: var(--px-18);
	letter-spacing: -1px;
}

.aan-details-btn.simple {
	padding-left: 0;
	border-left: none;
}

.aan-details-btn:hover {
	color: var(--blue-color);
}

/*.aan-details-btn::after {*/
/*	content: "";*/
/*	position: absolute;*/
/*	top: var(--px-4);*/
/*	right: var(--px-14);*/
/*	background-image: url("/images/aan/down-arrow.png");*/
/*	background-repeat: no-repeat;*/
/*	background-size: contain;*/
/*	width: 10px;*/
/*	height: 10px;*/
/*}*/

/* === aan-banner === */

.aan-banner {
	padding: var(--px-48) 0 var(--px-32) 0;
	position: relative;
}

.aan-banner a {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.aan-banner a img {
	width: auto;
	height: 100%;
	object-fit: contain;
}

/* === aan-banner-landscape === */

.aan-banner.aan-banner-landscape {
	aspect-ratio: 5/1;
}

/* === aan-banner-card === */

.aan-banner.aan-banner-card {
	padding: var(--px-16);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--border-radius);
	position: relative;
	overflow: hidden;
	color: var(--white-color);
	text-align: center;
}

.aan-banner.aan-banner-card .aan-banner-background {
	width: 100%;
	height: 100%;
	position: absolute;
	object-fit: cover;
}

.aan-banner.aan-banner-card .aan-banner-content {
	margin-top: var(--px-12);
	padding: var(--px-16) var(--px-24) var(--px-28) var(--px-24);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--px-20);
	max-width: 304px;
	width: 100%;
	height: auto;
	border-radius: var(--border-radius);
	background: radial-gradient(circle, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, .5) 30%, rgba(0, 0, 0, 0) 70%);
	z-index: 1;
}

.aan-banner.aan-banner-card .aan-banner-content h3 {
	font-family: "proxima-nova", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: var(--px-40);
	line-height: var(--px-40);
	max-width: 256px;
}

.aan-banner.aan-banner-card a {
	margin-top: var(--px-8);
	padding: 1rem;
	max-width: 252px;
	width: 100%;
	height: 56px;
	contain: var(--white-color);
	border: 1px solid var(--white-color);
	font-size: var(--px-16);
	line-height: var(--px-20);
	font-weight: normal;
	border-radius: var(--btn-border-radius);
	transition: 0.2s all;
}

.aan-banner.aan-banner-card a:hover {
	background-color: rgba(255, 255, 255, .15);
}

/* === aan-ad-banner === */

.aan-banner.aan-ad-banner {
	padding: 0;
	background-color: var(--grey-bg-color);
	border-radius: var(--border-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	grid-column: span 2;
	min-height: 361px;
}

.aan-banner.aan-ad-banner h3 {
	font-family: "proxima-nova", sans-serif;
	font-weight: 600;
	font-style: normal;
	font-size: var(--px-48);
}

/* === aan-btn-back === */

.aan-btn-back-wrapper {
	padding-top: var(--px-30);
}

.aan-btn-back {
	margin-left: var(--px-16);
	position: relative;
	border-bottom: 1px solid var(--black-color);
	font-weight: 600;
	line-height: var(--px-24);
	transition: color .2s linear;
}

.aan-btn-back:hover {
	color: var(--blue-color);
}

.aan-btn-back::before {
	content: "";
	position: absolute;
	left: -16px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url("/icons/arrow-prev.svg");
	background-size: contain;
	background-repeat: no-repeat;
	width: var(--px-12);
	height: var(--px-12);
}

/* === aan-aside === */

.aan-aside-header {
	margin-top: var(--px-18);
	margin-bottom: var(--px-24);
	display: flex;
	flex-direction: column;
	gap: var(--px-30);
}

.aan-aside-header h3 {
	padding: 0 var(--px-20);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: var(--px-16);
	text-align: center;
	font-size: var(--px-20);
	font-family: "proxima-nova", sans-serif;
}

.aan-aside-header h3 img {
	max-width: 214px;
}

.aan-aside-list {
	display: flex;
	flex-direction: column;
	gap: var(--px-44);
}

/*.aan-aside-list .aan-details-btn {*/
/*	display: none;*/
/*}*/

/* === ann gallery ===*/

.aan-gallery {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: var(--px-8);
	row-gap: var(--px-12);
	width: 100%;
}

.aan-gallery .aan-gallery-item {
	border-radius: var(--btn-border-radius);
	aspect-ratio: 16/9;
	overflow: hidden;
	cursor: pointer;
	background-color: var(--grey-color-3);
}

.aan-gallery .aan-gallery-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery-item {
	width: 100%;
	height: 100%;
}

.aan-selected-filter-container {
	margin-bottom: var(--px-16);
	display: flex;
	justify-content: space-between;
	gap: var(--px-16);
}

/* === expanding area === */

.plus-minus {
	position: relative;
	left: var(--px-22);
	width: var(--px-12);
	height: var(--px-12);
	cursor: pointer;
}

.plus-minus:before,
.plus-minus:after {
	content: "";
	display: block;
	background-color: var(--black-color);
	position: absolute;
	top: 50%;
	left: 0;
	transition: .3s;
	width: 100%;
	height: 1px;
}

.plus-minus:before {
	transform: translatey(-50%);
}

.plus-minus:after {
	transform: translatey(-50%) rotate(90deg);
}

.accordion-active .plus-minus:before {
	transform: translatey(-50%) rotate(-90deg);
	opacity: 0;
}

.accordion-active .plus-minus:after {
	transform: translatey(-50%) rotate(0);
}

.expanding-area-container .header {
	padding: var(--px-24) 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 2px solid var(--black-color);
	transition: all .2s;
	cursor: pointer;
}

.expanding-area-container .header h3 {
	font-size: var(--px-20);
	font-weight: 800;
	font-style: italic;
	line-height: var(--px-20);
}

.expanding-area-container .accordion img {
	margin: 0 var(--px-12);
	width: auto;
	height: var(--px-14);
	transition: all .2s;
	animation: rotateAnimationStart .2s ease-in forwards;
}

.expanding-area-container .accordion.accordion-active img {
	animation: rotateAnimationEnd .2s ease-in forwards;
}

.expanding-area-container .panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: all .2s ease-out;
	line-height: var(--px-24);
	overflow: hidden;
	min-height: 0;
	opacity: 0;
}

.expanding-area-container .panel .panel-wrapper {
	min-height: 0;
}

.expanding-area-container .panel.panel-wrapper-open {
	padding: var(--px-32) var(--px-2) var(--px-12) var(--px-2);
	grid-template-rows: 1fr;
	opacity: 1;
}

@keyframes rotateAnimationStart {
	0% {
		transform: rotate(-90deg)
	}
	100% {
		transform: rotate(90deg)
	}
}

@keyframes rotateAnimationEnd {
	0% {
		transform: rotate(90deg)
	}
	100% {
		transform: rotate(-90deg)
	}
}

.expanding-area-container.aan-filter-expanding .header {
	padding: 0;
	border-bottom: initial;
}

.expanding-area-container.aan-filter-expanding .header h3 {
	padding: 0;
	font-size: var(--px-16);
	font-style: normal;
	font-weight: 500;
	border-bottom: initial;
}

.expanding-area-container.aan-filter-expanding .accordion .icon {
	margin: 0;
	height: var(--px-12);
}

.expanding-area-container.aan-filter-expanding.advanced-search .header {
	justify-content: center;
	height: 40px;
}

.expanding-area-container.aan-filter-expanding.advanced-search .icon {
	display: none;
}

.expanding-area-container.aan-filter-expanding.advanced-search {
	text-align: center;
}

.expanding-area-container.aan-filter-expanding.advanced-search .nested .header {
	height: auto;
	justify-content: space-between;
}

.expanding-area-container.aan-filter-expanding.advanced-search .nested .icon {
	display: block;
	position: relative;
	right: 2px;
}

.expanding-area-container.aan-filter-expanding.advanced-search .nested .aan-grid-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.expanding-area-container.aan-filter-expanding.advanced-search .panel-wrapper-open {
	padding-bottom: 0;
}

.expanding-area-container.aan-filter-expanding .nested .panel.panel-wrapper-open {
	padding-bottom: var(--px-12);
}

.aan-contact-dealer {
	padding: var(--px-32) var(--px-48) var(--px-50) var(--px-48);
	border: 1px solid var(--grey-border-color);
	border-radius: var(--border-radius-8px);
}

.aan-contact-dealer .aan-grid-2 {
	grid-gap: var(--px-34);
	row-gap: var(--px-24);
}

.aan-contact-dealer .aan-button-dark {
	margin-top: var(--px-20);
	max-width: 209px;
}

/* === aan-aan-checkbox === */

.aan-checkbox {
	display: flex;
	flex-direction: row !important;
	position: relative;
	padding-left: var(--px-28);
	user-select: none;
}

.aan-radio-label,
.aan-checkbox-label {
	color: var(--text-input-color);
	font-weight: 400 !important;
	font-family: "roboto", sans-serif !important;
	letter-spacing: 0 !important;
}

.aan-radio-label:hover,
.aan-checkbox-label:hover {
	color: var(--blue-color);
	transition: all .2s;
}

.aan-checkbox input {
	position: absolute;
	height: 0;
	width: 0;
	opacity: 0;
	cursor: pointer;
}

.aan-checkbox label {
	font-size: var(--px-15);
	font-weight: 400 !important;
	color: var(--text-input-color);
	letter-spacing: initial;
	cursor: pointer;
}

.aan-checkbox .checkmark {
	position: absolute;
	top: 4px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: var(--white-color);
	border-radius: var(--border-radius-2px);
	border: 2px solid var(--grey-border-color);
}

.aan-checkbox:hover input ~ .checkmark {
	background-color: var(--white-color);
}

.aan-checkbox input:checked ~ .checkmark {
	border-color: var(--white-color);
	background-color: var(--blue-color);
	outline: 2px solid var(--input-border-color);
}

.aan-checkbox .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

.aan-checkbox input:checked ~ .checkmark:after {
	display: block;
}

.aan-checkbox .checkmark:after {
	left: 5px;
	top: 1px;
	width: 6px;
	height: 10px;
	border: solid white;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.no-cars-found {
	padding: var(--px-32);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 400;
	font-style: italic;
	background-color: var(--grey-color-3);
	border-radius: var(--border-radius);
}

.no-cars-found strong {
	font-style: italic;
}

/* === aan-swiper === */

.aan-details-swiper {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: var(--border-radius-4px);
	overflow: hidden;
}

.aan-details-swiper .vehicle-details-swiper {
	width: 100%;
	height: 100%;
	aspect-ratio: 7/4;
}

.aan-details-swiper .vehicle-details-swiper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aan-details-swiper .swiper-pagination {
	display: none;
}

.aan-details-swiper .swiper-button {
	width: 76px !important;
	height: 76px !important;
	top: 50%;
	transform: translateY(calc(-50% + 16px)) !important;
}

.aan-details-swiper .swiper-button-prev {
	left: auto !important;
	right: calc(100% - 101px) !important;
	border-radius: 0 !important;
	background-color: rgba(0, 0, 0, 0.28);
}

.aan-details-swiper .swiper-button-prev::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 26px;
	height: 26px;
	background-image: url("/icons/arrow-prev-2.svg");
	background-repeat: no-repeat;
	background-size: contain;
}

.aan-details-swiper .swiper-button-next {
	left: calc(100% - 101px) !important;
	right: auto !important;
	border-radius: 0 !important;
	background-color: rgba(0, 0, 0, 0.28);
}

.aan-details-swiper .swiper-button-next::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 26px;
	height: 26px;
	background-image: url("/icons/arrow-next-2.svg");
	background-repeat: no-repeat;
	background-size: contain;
}

.aan-listing-swiper .swiper-button {
	width: 24px !important;
	height: 24px !important;
	font-size: 0;
	border-radius: 24px !important;
	transition: all .1s ease-in;
	transform: translateY(calc(-50% + 16px));
	background-color: var(--white-color) !important;
	opacity: .8;
	z-index: 2;
}

.aan-listing-swiper .swiper-button:hover {
	opacity: 1;
}

.aan-listing-swiper .swiper-button-next {
	left: calc(100% - 30px) !important;
	right: auto !important;
	transition: opacity .2s ease-in;
	opacity: 0;
}

.aan-listing-swiper .swiper-button-prev {
	left: auto !important;
	right: calc(100% - 30px) !important;
	transition: opacity .2s ease-in;
	opacity: 0;
}

.aan-listing-swiper:hover .swiper-button-next,
.aan-listing-swiper:hover .swiper-button-prev {
	opacity: 1;
}

.aan-listing-swiper .swiper-button-next:after,
.aan-listing-swiper .swiper-button-prev:after {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: var(--px-8) !important;
	color: var(--black-color) !important;
	font-weight: bold !important;
}

.aan-listing-swiper .swiper-slide.swiper-slide-active img {
	transition: all .1s linear;
}

.aan-listing-swiper:hover .swiper-slide.swiper-slide-active img {
	transform: scale(1.05);
}

.aan-mobile-filter-head {
	padding: var(--px-20) var(--px-16);
	background-color: var(--black-color);
	color: var(--white-color);
	display: flex;
	gap: var(--px-16);
}

.aan-mobile-filter-group {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--px-6);
	flex: 1;
}

.aan-mobile-filter-group button {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--px-12);
	border-bottom: 1px solid var(--grey-border-color);
	color: var(--grey-border-color);
	height: 50px;
}

.aan-mobile-filter-group button.active {
	border-bottom: 1px solid var(--blue-color);
	color: var(--blue-color);
}

.aan-mobile-filter-group button.active img {
	filter: brightness(0) saturate(100%) invert(36%) sepia(74%) saturate(5675%) hue-rotate(205deg) brightness(104%) contrast(103%);
}

.aan-filter-mobile {
	position: relative;
	display: none;
	width: 100%;
	z-index: 98;
	top: 0;
	padding: var(--px-20) 0;
}

.aan-filter-mobile:after {
	content: "";
	position: absolute;
	top: 100%;
	left: 0;
	height: 150px;
	width: 100%;
	background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .75) 58%, rgba(255, 255, 255, 0) 100%)
}

.aan-filter-mobile h3 {
	padding: 0;
	width: auto;
	border-bottom: initial;
}

.aan-filter-mobile .aan-filter-body {
	padding: 0;
	padding-top: var(--px-36);
}

.aan-filter-mobile.open {
	display: block;
}

/* === aan-filter-tab === */

.aan-filter-tabs {
	padding-top: var(--px-28);
	display: flex;
	justify-content: space-between;
	gap: var(--px-16);
	flex: 1;
}

.aan-filter-tabs ul {
	display: flex;
	gap: var(--px-12);
	flex-wrap: wrap;
}

.aan-filter-tab {
	padding: var(--px-12) var(--px-16);
	display: flex;
	align-items: center;
	gap: var(--px-10);
	background-color: var(--tab-blue-color);
	border: 1px solid var(--tab-border-color);
	border-radius: var(--px-48);
	font-size: var(--px-14);
	line-height: var(--px-24);
	transition: all .1s ease-in;
}

.aan-filter-tab:hover {
	background-color: var(--tab-blue-hover-color);
}

.aan-filter-tab img {
	width: var(--px-24);
	height: var(--px-24);
	object-fit: contain;
}

.aan-filter-tab button {
	opacity: .35;
}

.aan-filter-tab button:hover {
	opacity: 1;
}

.aan-filter-tabs-clear-btn {
	padding: var(--px-12) var(--px-16);
	display: flex;
	align-items: center;
	gap: var(--px-10);
	background-color: var(--white-color);
	border: 1px solid var(--grey-border-color);
	border-radius: var(--px-48);
	font-size: var(--px-14);
	line-height: var(--px-24);
	height: var(--px-48);
	min-width: 154px;
	transition: all .1s ease-in;
}

.aan-filter-tabs-clear-btn:hover {
	border-color: rgba(0, 0, 0, .5);
	background-color: rgba(235, 235, 235, .4);
}

.aan-sort-by-wrapper {
	margin-left: auto;
	min-width: 227px;
}

.aan-sort-by-wrapper .wrapper-dropdown {
	border-bottom: 1px solid var(--input-border-color);
}

/* === aan-responsive === */

@media (max-width: 1919.98px) {
	.aan-container.aan-details-page {
		max-width: 1440px;
	}

	.aan-details-page-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.aan-details-header,
	.aan-details-article {
		grid-column: span 2;
	}
}

@media (max-width: 1441px) {
	.aan-grid-1,
	.aan-grid-2,
	.aan-grid-3,
	.aan-grid-4 {
		column-gap: var(--px-16);
	}

	.aan-container.aan-details-page {
		padding: 0 var(--px-32);
	}

	.aan-search-group {
		margin-bottom: var(--px-24);
	}


}

@media (max-width: 1199.98px) {
	/*.mobile-only {*/
	/*	display: flex !important;*/
	/*}*/
	/*.desktop-only {*/
	/*	display: none !important;*/
	/*}*/
	/*.aan-grid-2,*/
	.aan-grid-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aan-grid-4 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.aan-content-wrapper {
		grid-column: span 2;
	}

	.aan-container.aan-details-page {
		padding: 0 var(--px-16);
	}

	.aan-aside-header h3 {
		gap: var(--px-12);
	}

	.aan-aside-header h3 img {
		max-width: 188px;
	}

	.aan-banner {
		padding: var(--px-32) 0 var(--px-48) 0;
	}
}

@media (max-width: 991.98px) {
	/*.mobile-only {*/
	/*	display: flex !important;*/
	/*}*/
	.desktop-only {
		display: none !important;
	}

	.mobile-md-only {
		display: block !important;
	}

	.aan-listing-content.mobile-md-only {
		display: flex !important;
	}

	.desktop-md-only {
		display: none !important;
	}

	.desktop-flex-md-only {
		display: none !important;
	}

	.mobile-flex-md-only {
		display: flex !important;
	}

	.aan-grid-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aan-grid-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aan-grid-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aan-listing-filter-header {
		padding: var(--px-38) var(--px-48) var(--px-32) var(--px-48);
	}

	.aan-listing-filter .aan-radio-group,
	.aan-listing-filter .aan-search-group {
		padding: 0 var(--px-48);
	}

	.aan-details-swiper-wrapper {
		aspect-ratio: auto;
	}

	.aan-aside-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--px-24);
		row-gap: var(--px-56);
		width: 100%;
	}

	/*.aan-content-wrapper {*/
	/*	grid-column: span 1;*/
	/*}*/
	.aan-container.aan-details-page {
		padding: 0 0;
	}

	.aan-details-page-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}

	.aan-details-header,
	.aan-details-article {
		grid-column: initial;
	}

	.aan-details-box {
		padding: var(--px-40) var(--px-48);
	}

	.aan-details-tabs {
		flex-direction: column;
		gap: var(--px-16);
	}

	.aan-gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--px-16);
		row-gap: var(--px-12);
	}

	/*.aan-vehicle-price {*/
	/*	display: none;*/
	/*}*/
	.aan-details-swiper {
		position: relative;
		border-radius: initial;
	}

	.aan-details-swiper-wrapper .aan-listing-content {
		margin-left: var(--px-24);
	}

	.aan-details-header.mobile-only,
	.aan-details-article.secondary,
	.aan-details-aside {
		padding: 0 var(--px-24) !important;
	}

	.aan-banner.aan-ad-banner {
		grid-column: span 1;
	}

	.aan-gradient.aan-gradient-mobile {
		margin: var(--px-24) auto 0 auto;
		width: calc(100vw - var(--px-64));
	}

	.aan-listing-filter-box {
		padding: var(--px-20) var(--px-6);
		border-radius: 0;
		border: 0;
	}

	.aan-listing-filter-box:not(:first-child) {
		margin: 0 var(--px-16);
		border-bottom: 1px solid var(--grey-border-color);
	}

	.plus-minus {
		left: 0;
	}

	.aan-btn-back-wrapper {
		padding-top: 0;
		position: fixed;
		left: var(--px-10);
		bottom: var(--px-24);
		z-index: 99;
	}

	.aan-btn-back-wrapper .aan-btn-back {
		margin: 0;
		display: block;
		width: var(--px-42);
		height: var(--px-42);
		background-color: var(--white-color);
		border-radius: var(--px-42);
		box-shadow: var(--box-shadow);
		border: none;
	}

	.aan-btn-back-wrapper .aan-btn-back span {
		display: none;
	}

	.aan-btn-back-wrapper .aan-btn-back::before {
		left: calc(50% + 2px);
		top: 50%;
		transform: translate(-50%, -50%);
	}
}

@media (max-width: 767.98px) {
	.aan-grid-4 {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}

	.aan-details-swiper-wrapper .aan-listing-content {
		margin-left: var(--px-16);
	}

	.aan-aside-list {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}

	.aan-listing-filter {
		border-radius: initial;
	}

	/*.mobile-md-only {*/
	/*	display: block !important;*/
	/*}*/
	/*.desktop-md-only {*/
	/*	display: none !important;*/
	/*}*/
	.aan-aside-list .aan-details-btn {
		display: block;
	}

	.aan-listing-filter-header {
		padding: 0 var(--px-16) var(--px-20) var(--px-16);
	}

	.aan-listing-filter .aan-radio-group,
	.aan-listing-filter .aan-search-group {
		padding: 0 var(--px-16);
	}

	.primary-btn.clear-search {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: var(--px-8);
		border: 1px solid var(--grey-border-color);
		background-color: rgba(160, 160, 160, 0.07);
		color: var(--black-color);
		border-radius: var(--px-48);
		font-size: var(--px-14);
		font-style: normal;
		font-weight: 400;
		min-height: var(--px-40);
	}

	.primary-btn.clear-search img {
		width: var(--px-8);
		height: var(--px-8);
	}

	/*.aan-listing-image {*/
	/*    padding-bottom: 26px;*/
	/*}*/
	.aan-listing-content {
		top: calc(100% - 52px);
		height: 52px;
	}
}

@media (max-width: 575.98px) {
	.mobile-only {
		display: flex !important;
	}

	.aan-container {
		padding: 0 var(--px-16);
	}

	.aan-container.aan-details-page {
		padding: 0 0 !important;
	}

	/*.aan-grid-2,*/
	.aan-grid-3 {
		grid-template-columns: repeat(1, minmax(0, 1fr));
		row-gap: var(--px-32);
	}

	.aan-gradient.aan-gradient-mobile {
		margin: var(--px-14) auto 0 auto;
		padding: var(--px-12) var(--px-42);
		width: calc(100vw - var(--px-32));
	}

	.aan-gradient img {
		max-width: 222px;
	}

	/*.aan-listing-card {*/
	/*    gap: var(--px-22);*/
	/*}*/
	.aan-listing-text {
		gap: var(--px-28);
	}

	.aan-details-box {
		padding: var(--px-32) var(--px-48);
	}

	.aan-banner {
		padding: var(--px-32) 0 var(--px-48) 0;
	}

	.aan-banner.aan-banner-card {
		height: 361px;
	}

	/*.aan-listing-card .aan-listing-text {*/
	/*    flex-direction: column;*/
	/*    align-items: start;*/
	/*}*/
	.aan-details-header.mobile-only,
	.aan-details-article.secondary,
	.aan-details-aside {
		padding: 0 var(--px-16) !important;
	}

	.aan-details-page-grid {
		row-gap: var(--px-26);
	}

	.aan-details-box ul {
		gap: var(--px-34);
	}

	.aan-details-swiper .swiper-button {
		width: var(--px-48) !important;
		height: var(--px-48) !important;
	}

	.aan-details-swiper .swiper-button-prev {
		right: calc(100% - 60px) !important;
	}

	.aan-details-swiper .swiper-button-next {
		left: calc(100% - 60px) !important;
	}

	.aan-details-swiper .swiper-button-prev::after,
	.aan-details-swiper .swiper-button-next::after {
		width: 16px;
		height: 16px;
	}

	/*.aan-listing-image {*/
	/*    padding-bottom: 24px;*/
	/*}*/
	.aan-listing-content {
		top: calc(100% - 48px);
		height: 48px;
	}

	.aan-details-swiper .vehicle-details-swiper {
		aspect-ratio: 3/2;
	}

	.aan-listing-filter-header button {
		display: flex;
	}

	.lg-outer .lg-item.lg-complete.lg-zoomable .lg-dummy-img,
	.lg-outer .lg-item.lg-complete.lg-zoomable .lg-image {
		border-radius: 0;
	}

	.aan-text-area {
		flex-direction: column;
	}

	.aan-text-area-wrapper {
		width: 100%;
	}

	.aan-contact-dealer .aan-button-dark {
		margin-top: 0;
		max-width: 100%;
		width: 100%;
	}
}

/* === aan-variables === */

:root {
	/* === base === */

	--black-color: #000;
	--white-color: #fff;
	--grey-color: #606060;
	--grey-color-2: #636364;
	--grey-color-3: #F9F9F9;
	--grey-radio-btn-color: #F1F1F1;
	--input-border-color: #6B7280;
	--blue-color: #0074FF;
	--tab-blue-color: rgba(0, 153, 255, .07);
	--tab-border-color: rgba(0, 153, 255, .5);
	--tab-blue-hover-color: rgba(0, 153, 255, .20);
	--grey-bg-color: #D9D9D9;
	--grey-border-color: #D9D9D9;
	--btn-border-radius: 3px;
	--border-radius-2px: 2px;
	--border-radius-4px: 4px;
	--border-radius-5px: 5px;
	--border-radius-8px: 8px;
	--border-radius-12px: 12px;
	--border-radius-24px: 24px;
	--border-radius: 9px;
	--text-black-color: #050B20;
	--text-input-color: #505050;
	--box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.15);

	/* === colors === */

	--orange-color: #FF8000;
	--gray-color: #777777;
	--silver-color: #AFAFAF;
	--yellow-color: #FFC02B;
	--purple-color: #9000FF;
	--beige-color: #E4D1A5;
	--teal-color: #1CB19B;
	--brown-color: #7A5734;
	--red-color: #B22334;
	--green-color: #068241;
	--bronze-color: #B0753A;
	--pink-color: #FF318A;
	--gold-color: #D6BD83;
	--tan-color: #BEA66D;
	--copper-color: #CC8457;

	/* === px === */
	--px-2: 0.125rem;
	--px-4: 0.25rem;
	--px-6: 0.375rem;
	--px-7: 0.438rem;
	--px-8: 0.5rem;
	--px-10: 0.625rem;
	--px-12: 0.75rem;
	--px-13: 0.813rem;
	--px-14: 0.875rem;
	--px-15: 0.938rem;
	--px-16: 1rem;
	--px-18: 1.125rem;
	--px-20: 1.25rem;
	--px-22: 1.375rem;
	--px-24: 1.5rem;
	--px-26: 1.625rem;
	--px-28: 1.75rem;
	--px-30: 1.875rem;
	--px-32: 2rem;
	--px-34: 2.125rem;
	--px-36: 2.25rem;
	--px-38: 2.375rem;
	--px-40: 2.5rem;
	--px-42: 2.625rem;
	--px-44: 2.75rem;
	--px-46: 2.875rem;
	--px-48: 3rem;
	--px-50: 3.125rem;
	--px-52: 3.25rem;
	--px-54: 3.375rem;
	--px-56: 3.5rem;
	--px-64: 4rem;
	--px-72: 4.5rem;
	--px-80: 5rem;
	--px-84: 5.25rem;
}