@font-face {
	font-family: 'Haval-Regular'; 
	src: url("/site/templates/fonts/Haval-Regular.woff2"); 
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Haval-Medium'; 
	src: url("/site/templates/fonts/Haval-Medium.woff2"); 
	font-weight: 500;
	font-style: normal;
}


@font-face {
	font-family: 'TT-Wellingtons-Medium'; 
	src: url("/site/templates/fonts/TT-Wellingtons-Medium.woff2"); 
	font-weight: 500;
	font-style: normal;
}

:root{
    --f-header-height: 60px;
	--carousel-item-auto-size: 260px;
	--custom-ticker-height: 90px;
	--custom-height-pre-header: 100px;
}
html {
	scroll-padding: calc(var(--f-header-height) + 70px);
}
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	border: 0;
	padding: 0;
	white-space: nowrap;
	clip-path: inset(100%);
	clip: rect(0 0 0 0);
	overflow: hidden;
}

.block-model:nth-child(2n) {
	background-color: #f2f3f4;
}

.block-model:nth-child(2n) .model-gradient {
	background: linear-gradient(305deg, rgba(239, 241, 243, 1) 60%, rgba(231, 235, 237, 1) 67%, rgba(242, 243, 244, 1) 67%, rgba(242, 243, 244, 1) 68%, rgba(203, 209, 216, 1) 68%);
}

.block-model:nth-child(odd) {
	background-color: #e6e7e9;
}

.block-model:nth-child(odd) .model-gradient {
	background: linear-gradient(305deg, rgba(230, 231, 233, 1) 35%, rgba(231, 235, 237, 1) 67%, rgba(230, 231, 233, 1) 67%, rgba(230, 231, 233, 1) 68%, rgba(203, 209, 216, 1) 68%);
}

.prod-color-feature .color-swatches__legend {
	position: static;
	clip: unset;
	clip-path: none;
}

.color-swatches__swatch {
	border-radius: 0%;
}

.logo-border {
	position: relative;
}

.logo-border::before {
	content: "";
	
	position: absolute;
	top: -10px;
	left: 0;
	
	height: 100px;

	border-left: var(--border-width, 2px) var(--border-style, solid) hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--border-o-base, 0.1));
}

.f-header__link {
	font-size: 0.9rem;
}


.poi__btn {
	background-color: var(--color-primary);
	--size: 20px;
}

.poi__btn::after {
	box-shadow: inset 0 0 1px 1px var(--color-primary);
}

.slideshow--custom-height {
	height: 400px;
}
.slideshow__item--custom{
	height: calc(100vh - 70px - var(--f-header-height));
}
.exp-gallery-wrapper--model {
	overflow: auto;
	height: 310px;
}
.custom-ticker-height{
	--ticker-gap-x: var(--space-lg);
	height: var(--custom-ticker-height);
	--ticker-animation-duration: 15s !important;
}
.thumbslide__nav-item img,
.thumbslide__nav-item::after {
	border-radius: var(--radius-md);
}
.custom-font-size-header{
	font-size: 1em;
	color: white;
}
:focus-visible {
    outline: var(--color-primary) auto 1px;
}
.custom-height-slideshow__item{
	height: calc(100vh - var(--custom-ticker-height) - var(--f-header-height) - var(--custom-height-pre-header));
}
.custom-height-pre-header{
	height: var(--custom-height-pre-header);
}
.icon-custom-size{
    --size: 1.5em;
	transition: 0.5s;
	color: var(--color-white);
}
.icon-custom-size:hover{
	color:var(--color-secondary);
}
.custom-header-links-color > li > a > .icon-custom-size{
	color: white;
}
.custom-header-links-color > .f-header__item{
	border-bottom: 0;
}
.f-header__link--icon{
	text-decoration: none;
}
.menu-bar__item:focus {
 background: var(--color-secondary);
}
.custom-card-hover > .custom-card-hover-div > .custom-card-hover-figure{
	transition: 0.5s;
}
.custom-card-hover:hover > .custom-card-hover-div > .custom-card-hover-figure{
	transform: scale(1.2);
}
.test-gallery__inner::after{
	background: linear-gradient(to top, hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 1) 45%, hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0));
}
.footer-v4__nav-item a {
	color: var(--color-black);
	text-decoration: none;
	font-size: 0.85rem;
	transition: ease 0.3s;
}
.footer-v4__nav-item a:hover {
	color: var(--color-secondary);
}
.custom-item-menu{
	color: var(--color-primary);
	font-weight: bold;
}
.model-car-image {
	position: absolute;
    bottom: -135px;
    left: 145px;
    transition: all .5s;

	width: 700px;
}
.model-car-image:hover {
	transform: translateX(30px);
}

.car-block--right .model-car-image:hover {
	transform: translateX(-30px);
}
.car-block--right .model-car-image {
	bottom: -110px;
    left: 125px;
}
.carousel__item--custom-width {
	--carousel-item-auto-size: 100%;
}
.link-fx-1-custom{
	color: white;
}
.link-fx-1-custom::before{
	color: white;
}
.link-fx-1-custom > icon{
	color: white;
}
.link-fx-1::before {
	display: none;
}
.custom-map > iframe{
	border-radius: var(--radius-md);
}
.chip{
	background: var(--color-black);
	font-weight: bold;
	color: var(--color-white);
}
.chip__icon-wrapper .icon{
	color: var(--color-black);
}
.chip__icon-wrapper{
	background: #ee8e35;
}
.intro{
	padding-top: 0;
}
.countdown--grid .countdown__item{
	width: 1.7em;
	padding: var(--space-xxxs) 0;
}
.feature-v8__main-content{
	padding-bottom: calc(var(--feature-v8-gap) * 1.5);
}
.countdown__item{
	border-radius: var(--radius-sm);
	background: var(--color-primary);
	color: var(--color-white);
}
.countdown--grid .countdown__label{
	color: var(--color-white);
}
.pre-header{
	display: flex;

	color: var(--color-white);
	background-color: var(--color-primary);
}

.f-header__link:hover {
	color: var(--color-secondary-darker);
}

.btn--black {
	background: var(--color-black);
    color: var(--color-white);
    border: 2px solid var(--color-black);
    outline: none;
	text-transform: uppercase;
}

.btn--black:hover {
	color: var(--color-white);
	background: var(--color-black);
	border: 2px solid var(--color-black);
}

.btn--black:after {
	background: black;
}

.btn--black:hover:after {
	background: black;
}

.slideshow__item--custom {
	align-items: start;
}

.slideshow-wrapper {
	background-color: hsla(0, 0%, 100%, .5);
	border-radius: 20px;
	padding: 20px;
	width: 100%;
	max-width: 1320px;
}

.f-header__link[href^="/stock/"] {
	font-weight: bold;
    color: var(--color-accent);
}
.footer-v4__nav-item a[href^="/stock/"] {
	font-weight: bold;
	color: var(--color-white);
}
.prod-color-feature .color-swatches {
    position: static;
    transform: none;
}
.prod-color-feature .color-swatches__list {
    grid-template-columns: repeat(auto-fit, var(--color-swatch-size));
    justify-content: center;
    gap: 1em;
}
.tab-features__control h3 {
	font-weight: bold;
}
.tab-features__control::before {
    display: none;
}
.tab-features__control[aria-selected=true]::after {
    background-color: var(--color-black);
}
.dl-v2__item {
	background-color: var(--color-black);
}
.dl-v2__description {
	color: var(--color-white);
	font-weight: bold;

	position: relative;

	padding-bottom: 10px;
}
.dl-v2__description::after {
    content: "";
    position: absolute;
	bottom: 5px;
    left: 0;
    height: 1px;
    width: 100%;

	background-color: var(--color-white);
}
.intro--tabs-slide {
    height: 100%;
}
/* .tab-features__panel {
	padding-top: 0;
} */
.tab-features__controls-list-slide  {
	padding-bottom:5px;
}
.tab-features__control-wrapper--tab .tab-features__control[aria-selected=true]::after{
	background-color: transparent;
}
.tab-features__control-wrapper--tab .tab-features__control {
    text-transform: uppercase;
	transition: all 0.2s ease;
    will-change: transform;
	border-radius: var(--btn-radius, 0.25em);
	background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.025);
}
.tab-features__control-wrapper--tab .tab-features__control[aria-selected=true] {
    background-color: var(--color-black);
	background: var(--color-black);
    color: var(--color-white);
    border: 2px solid var(--color-black);
    outline: none;
}
.tab-features__controls-list--tab {
	gap: 10px;
}
.tab-features__controls-list--tab::after {
	display: none;
}
.tab-features--slide {
	padding-top: 20px;
}
.dl-v2__description--promo {
	font-size: var(--text-lg);
}
.contact-phone {
	color: var(--color-black);
}
.read-more__btn {
	color: var(--color-secondary);
}
.read-more a {
	color: var(--color-secondary);
}
.footer-v4__print {
	color: var(--color-black);
}
.footer-v4__socials a {
	color: var(--color-black);
}

.feature-v3__media-wrapper img {
	height: 520px;
}

.slideshow__btn-custom {
	display: flex;
	align-items: center;
	justify-content: center;
}

.tab-features__panel--hide {
	z-index: -1;
}

.prod-color-feature .color-swatches {
    position: static;
    transform: none;
}
.prod-color-feature .color-swatches__list {
    grid-template-columns: repeat(auto-fit, var(--color-swatch-size));
    justify-content: center;
    gap: 1em;
}
.tab-features__control--custom h3 {
	font-weight: bold;
}
.tab-features__control--custom::before {
    display: none;
}
.tab-features__control--custom[aria-selected=true]::after {
    background-color: var(--color-black);
}

.dl-v2__item--custom  {
	background-color: var(--color-bg-dark);
}

.dl-v2__description--custom {
	color: var(--color-black);
	font-weight: bold;
	position: relative;
	padding-bottom: 10px;
}

.dl-v2__description--custom::after {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 0;
    height: 1px;
    width: 100%;
    background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
}

.tab-features__panel--hide {
	z-index: -1;
}
.tab-features__control--model-custom {
	padding: 0;
}
.tab-features__control--model-custom::after {
	display: none;
}

.tab-features__control--model-custom:hover {
	background-color: transparent;
}

.color-swatch--model-custom::before {
	content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    border: 1px solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
    border-radius: inherit;
    pointer-events: none;
    transition: .2s;
}

.tab-features__control--model-custom[aria-selected="true"] .color-swatch--model-custom::before{
	border-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.8);
    width: calc(100% + 6px);
    height: calc(100% + 6px);
}

.tab-features__controls-list--model-custom {
	gap: 10px;
}

.tab-features__controls-list--model-custom::after {
	display: none;
}

.slideshow__btn {
	display: flex;
	align-items: center;
	justify-content: center;
}

.slideshow[data-swipe=on] .slideshow__control {
    display: block;
}

.thumbslide__nav-wrapper--custom {
	position: absolute;
}

.body-model {
    top: 25%;
}

.bg-custom {
	background-color: #262626;
} 

.bg-custom-haval {
	background-color: #F2F3F4;
}

.bg-custom-haval-dark {
	background-color: #e6e7e9;
}

.slideshow--transition-prx .slideshow__item {
	animation-duration: unset; 
    animation-fill-mode: none;
    animation-timing-function: unset;
}

.exp-gallery {
	--grid-columns: 12;
    display: flex;
    flex-wrap: wrap;
}

.model-button:nth-child(1) {
	background-color: transparent;
	border-color: var(--color-primary);
	color: black;
	text-transform: none;

	flex-grow: 1;
	flex-basis: 0;
}

.model-button:nth-child(2) {
	flex-grow: 1;
	flex-basis: 0;
}

.model-button {
	padding-left: 5px;
    padding-right: 5px;
}

.model-button:last-child {
	width: 100%;

	padding-left: var(--btn-padding-x, 0.75em);
    padding-right: var(--btn-padding-x, 0.75em);

	background-color: var(--color-accent);
	border-color: var(--color-accent);
}

.tooltip-trigger {
	border-bottom: none;
}

@media (min-width: 64rem){
	.f-header__link, .f-header__dropdown-control, .f-header__dropdown-link, .f-header__btn, .f-header__form-control{
		transition: ease 0.3s;
	}
}

@media (max-width: 1024px){
	.feature-v3__media-wrapper img {
		height: auto;
	}

	.contact-map-custom {
		height: 300px;
	}

	.exp-gallery {
		overflow: auto;
		width: 800px;
	}

	.pre-header{
		display: none;
	}

	.anim-menu-btn__icon--close {
		color: #636B70;
	}

	.f-header__link-custom {
		color: black;
	}
	.countdown--grid .countdown__item{
		width: 1.5em;
	}
	.custom-height-slideshow__item{
		height: calc(100vh - var(--custom-ticker-height) - var(--f-header-height));
	}
	.custom-ticker-height{
		--ticker-gap-x: var(--space-lg);
		height: var(--custom-ticker-height);
		--ticker-animation-duration: 5s !important;
	}
	.intro--tabs-slide {
        height: auto;
    }
	.custom-height-slideshow__item--tabs {
        height: auto;
        min-height: 600px;
        align-items: normal;
    }
	.f-header__link--icon {
		color: var(--color-black);
	}
	.model-car-image {
		left: 0px;
		bottom: -110px;
	}
	.car-block--right .model-car-image {
		bottom: -110px;
		left: 0px;
	}

	.exp-gallery-wrapper--model {
		width: 800px !important;
		height: auto !important;
	}
	.exp-gallery-container {
		overflow: auto;
	}
	.exp-gallery {
		--grid-columns: auto;
		display: flex;
		flex-wrap: nowrap;
	}

	.button-mobile {
		top: 0;
		margin-top: 105px;
	}
}

@media (max-width: 768px) {
	:root {
		--slideshow-height: 100vh;
		--thumbslide-thumbnail-auto-size: 120px;
	}

	.slideshow__item--custom{
		height: calc(100vh - var(--f-header-height));
	}
}
