.cars-navigation-bar {
    position: relative;
    color: var(--cars-nav-text);
    background: var(--cars-nav-bg);
}


.cars-navigation-bar--wave {
    margin-bottom: calc(var(--cars-menu-wave-height) * 2.75);
}

.cars-navigation-wave {
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 0;
    width: 100%;
    height: calc(var(--cars-menu-wave-height) * 5.35);
    overflow: hidden;
    line-height: 0;
    pointer-events: none;
}

.cars-navigation-wave img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.cars-navigation-bar__inner {
    z-index: 2;
}

.cars-navigation-bar__inner {
    position: relative;
    display: flex;
    min-height: 54px;
    align-items: stretch;
}

.cars-primary-nav {
    flex: 1;
    min-width: 0;
}

.cars-menu,
.cars-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cars-menu {
    display: flex;
    align-items: stretch;
    min-height: 54px;
}

.cars-menu > li {
    position: relative;
    display: flex;
    align-items: stretch;
}

.cars-menu a {
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 10px 15px;
    color: var(--cars-nav-text);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    background-color: transparent;
    transition: color 360ms cubic-bezier(.22,.61,.36,1), background-color 360ms cubic-bezier(.22,.61,.36,1), box-shadow 360ms cubic-bezier(.22,.61,.36,1);
}


.cars-menu > li > a {
    background-image: linear-gradient(var(--cars-menu-hover-line, #FFFFFF), var(--cars-menu-hover-line, #FFFFFF));
    background-repeat: no-repeat;
    background-position: 50% calc(100% - 6px);
    background-size: 0 2px;
    transition: color 360ms cubic-bezier(.22,.61,.36,1), background-size 420ms cubic-bezier(.22,.61,.36,1), box-shadow 360ms cubic-bezier(.22,.61,.36,1);
}

.cars-menu > li:hover > a,
.cars-menu > li > a:focus-visible {
    color: var(--cars-nav-text);
    background-color: var(--cars-nav-hover-bg, var(--cars-nav-bg));
    background-size: calc(100% - 20px) 2px;
}

.cars-menu > li.cars-current-menu-item > a,
.cars-menu > li.cars-current-menu-parent > a,
.cars-menu > li.cars-current-menu-ancestor > a {
    color: var(--cars-nav-active-text, var(--cars-nav-bg));
    background-color: var(--cars-nav-active-bg, #FFFFFF);
    background-image: none;
    background-size: 0 0;
    border-radius: 6px;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cars-nav-active-text, var(--cars-nav-bg)) 12%, transparent);
}


.cars-menu > .menu-item-has-children > a::after {
    content: "";
    width: 0.45em;
    height: 0.45em;
    margin-left: 0.5em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-0.14em) rotate(45deg);
}

.cars-menu > li.menu-item-has-children::after {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 100%;
    height: 10px;
}

.cars-menu .sub-menu {
    position: absolute;
    z-index: 50;
    top: 100%;
    left: 0;
    display: block;
    width: max-content;
    min-width: 220px;
    max-width: calc(100vw - 40px);
    padding: 8px;
    visibility: hidden;
    opacity: 0;
    transform: translateY(10px) scale(.985);
    background: var(--cars-submenu-bg);
    border: 1px solid color-mix(in srgb, var(--cars-submenu-text, var(--cars-nav-text)) 14%, transparent);
    border-radius: 0 0 var(--cars-radius) var(--cars-radius);
    box-shadow: var(--cars-shadow);
    transition: opacity 360ms ease, transform 420ms cubic-bezier(.22,.61,.36,1), visibility 0s linear 420ms;
    pointer-events: none;
}


.cars-menu .sub-menu .sub-menu {
    top: -8px;
    left: 100%;
    border-radius: var(--cars-radius);
}

.cars-menu .sub-menu .menu-item-has-children > a {
    column-gap: 0.75em;
}

.cars-menu .sub-menu .menu-item-has-children > a::after {
    content: "";
    width: 0.42em;
    height: 0.42em;
    margin-left: auto;
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    transform: rotate(45deg);
}

.cars-menu li:hover > .sub-menu,
.cars-menu li:focus-within > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
    transition-delay: 0s;
}


@media (min-width: 961px) {
    
    .cars-primary-nav.cars-submenus-scroll-hidden .sub-menu,
    .cars-primary-nav.cars-submenus-scroll-hidden li:hover > .sub-menu,
    .cars-primary-nav.cars-submenus-scroll-hidden li:focus-within > .sub-menu {
        visibility: hidden !important;
        opacity: 0 !important;
        transform: translateY(10px) scale(.985) !important;
        pointer-events: none !important;
        transition: none !important;
    }
}

.cars-menu .sub-menu li {
    position: relative;
}

.cars-menu .sub-menu a {
    position: relative;
    min-height: 42px;
    padding: 9px 12px 11px;
    white-space: nowrap;
    font-weight: 400;
    color: var(--cars-submenu-text, var(--cars-nav-text));
    background-image: linear-gradient(var(--cars-submenu-hover-line, var(--cars-primary)), var(--cars-submenu-hover-line, var(--cars-primary)));
    background-repeat: no-repeat;
    background-position: 50% 100%;
    background-size: 0 2px;
    transition: color 360ms cubic-bezier(.22,.61,.36,1), background-size 420ms cubic-bezier(.22,.61,.36,1), background-color 360ms cubic-bezier(.22,.61,.36,1);
}

.cars-menu .sub-menu a:hover,
.cars-menu .sub-menu a:focus-visible,
.cars-menu .sub-menu .current-menu-item > a {
    color: var(--cars-submenu-text, var(--cars-nav-text));
    background-color: var(--cars-submenu-hover);
    background-size: calc(100% - 24px) 2px;
}

.cars-search-toggle {
    color: var(--cars-nav-text);
}

.cars-search-panel {
    position: absolute;
    z-index: 80;
    top: calc(100% + 10px);
    right: 0;
    width: min(480px, calc(100vw - var(--cars-gutter) - var(--cars-gutter)));
    padding: 14px;
    color: var(--cars-text);
    background: var(--cars-surface);
    border: 1px solid var(--cars-border);
    border-radius: var(--cars-radius);
    box-shadow: var(--cars-shadow);
}

.cars-search-form {
    display: flex;
    gap: 8px;
}

.cars-search-form__input {
    min-width: 0;
    flex: 1;
    min-height: 44px;
    padding: 9px 13px;
    color: var(--cars-text);
    background: var(--cars-surface);
    border: 1px solid var(--cars-border);
    border-radius: var(--cars-radius-pill);
}

.cars-menu-toggle {
    color: var(--cars-text);
    border: 1px solid var(--cars-border);
}

.cars-menu-toggle:hover {
    background: var(--cars-primary-light);
}

.cars-menu-toggle__bars {
    display: grid;
    gap: 4px;
    width: 22px;
}

.cars-menu-toggle__bars i {
    display: block;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
}


.cars-search-noscript {
    width: min(460px, 100%);
    margin-left: auto;
    padding: 6px 0;
}

.cars-search-noscript .cars-search-form__input,
.cars-search-noscript .cars-search-form__button {
    min-height: 40px;
}



.cars-menu > li > a,
.cars-menu .sub-menu a,
.cars-menu > .menu-item-has-children > a::after,
.cars-menu .sub-menu .menu-item-has-children > a::after {
    transition-timing-function: cubic-bezier(.22,.61,.36,1);
}
.cars-menu .sub-menu {
    will-change: opacity, transform;
}
@media (prefers-reduced-motion: reduce) {
    .cars-menu a,
    .cars-menu .sub-menu,
    .cars-menu a::after {
        transition: none !important;
    }
}


@media (hover:hover) and (pointer:fine) {
    .cars-menu .sub-menu {
        top: calc(100% - 1px);
        transform-origin: top left;
        transition: opacity 260ms ease, transform 320ms cubic-bezier(.22,.61,.36,1), visibility 0s linear 320ms;
    }
    .cars-menu li:hover > .sub-menu,
    .cars-menu li:focus-within > .sub-menu {
        transition-delay: 0s;
    }
    .cars-menu .sub-menu .sub-menu {
        top: -8px;
    }
}





.cars-site-header.is-scrolled .cars-navigation-bar--scroll-away.cars-navigation-bar--wave {
    margin-bottom: 0;
}

/* Cars hover families — selected globally or automatically by preset. */
body.cars-hover-center-line .cars-menu > li > a,
body.cars-hover-center-line .cars-menu .sub-menu a {
    background-image: linear-gradient(var(--cars-menu-hover-line), var(--cars-menu-hover-line));
    background-position: 50% calc(100% - 6px);
    background-repeat: no-repeat;
    background-size: 0 2px;
}
body.cars-hover-center-line .cars-menu > li:hover > a,
body.cars-hover-center-line .cars-menu > li > a:focus-visible,
body.cars-hover-center-line .cars-menu .sub-menu a:hover,
body.cars-hover-center-line .cars-menu .sub-menu a:focus-visible {
    background-size: calc(100% - 20px) 2px;
}

body.cars-hover-glow-line .cars-menu > li > a,
body.cars-hover-glow-line .cars-menu .sub-menu a {
    background-image: linear-gradient(90deg, transparent, var(--cars-accent), transparent);
    background-position: 50% 100%;
    background-repeat: no-repeat;
    background-size: 0 2px;
}
body.cars-hover-glow-line .cars-menu > li:hover > a,
body.cars-hover-glow-line .cars-menu > li > a:focus-visible,
body.cars-hover-glow-line .cars-menu .sub-menu a:hover,
body.cars-hover-glow-line .cars-menu .sub-menu a:focus-visible {
    background-size: 88% 2px;
    box-shadow: inset 0 -10px 24px color-mix(in srgb, var(--cars-accent) 13%, transparent);
}

body.cars-hover-sweep .cars-menu > li > a,
body.cars-hover-sweep .cars-menu .sub-menu a {
    background-image: linear-gradient(105deg, transparent 0 38%, color-mix(in srgb, #fff 20%, transparent) 48%, transparent 58% 100%);
    background-position: 150% 0;
    background-size: 220% 100%;
    background-repeat: no-repeat;
}
body.cars-hover-sweep .cars-menu > li:hover > a,
body.cars-hover-sweep .cars-menu > li > a:focus-visible,
body.cars-hover-sweep .cars-menu .sub-menu a:hover,
body.cars-hover-sweep .cars-menu .sub-menu a:focus-visible {
    background-position: -50% 0;
}

body.cars-hover-chrome .cars-menu > li > a,
body.cars-hover-chrome .cars-menu .sub-menu a {
    position: relative;
    overflow: hidden;
}
body.cars-hover-chrome .cars-menu > li > a::before,
body.cars-hover-chrome .cars-menu .sub-menu a::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 0 36%, rgba(255,255,255,.34) 47%, rgba(255,255,255,.08) 52%, transparent 63% 100%);
    transform: translateX(-130%);
    transition: transform 520ms cubic-bezier(.22,.61,.36,1);
    pointer-events: none;
}
body.cars-hover-chrome .cars-menu > li:hover > a::before,
body.cars-hover-chrome .cars-menu > li > a:focus-visible::before,
body.cars-hover-chrome .cars-menu .sub-menu a:hover::before,
body.cars-hover-chrome .cars-menu .sub-menu a:focus-visible::before { transform: translateX(130%); }

body.cars-hover-neon .cars-menu > li > a,
body.cars-hover-neon .cars-menu .sub-menu a { transition: color 250ms ease, text-shadow 250ms ease, box-shadow 250ms ease, background-color 250ms ease; }
body.cars-hover-neon .cars-menu > li:hover > a,
body.cars-hover-neon .cars-menu > li > a:focus-visible,
body.cars-hover-neon .cars-menu .sub-menu a:hover,
body.cars-hover-neon .cars-menu .sub-menu a:focus-visible {
    text-shadow: 0 0 8px color-mix(in srgb, var(--cars-accent) 78%, transparent), 0 0 18px color-mix(in srgb, var(--cars-primary) 55%, transparent);
    box-shadow: inset 0 -2px 0 var(--cars-accent), inset 0 0 24px color-mix(in srgb, var(--cars-primary) 20%, transparent);
}

@media (prefers-reduced-motion: reduce) {
    body[class*="cars-hover-"] .cars-menu a,
    body.cars-hover-chrome .cars-menu a::before { transition:none !important; }
}