/*
    Theme Name:     Twenty Twenty Five Child
    Template:       twentytwentyfive
    Version:        1.0.0.0
*/

:root {
    --menu-height-desktop: 90px;
    --menu-height-mobile: 80px;
    --color-white: #fff;
    --color-main-dark: #5b5247;

    --global-max-width: var(--container);
    --global-content-width: min(100%, 1675px);
    --global-high-width: min(100%, 1400px);
    --global-mid-width: min(100%, 1300px);
    --global-low-width: min(100%, 1100px);
    --global-margin: 0;
    --scrollbar-button: #afafaf;
    --scrollbar-button-hover: #686868;
    --scrollbar-bar: #eaeaea;
    --border-radius-low: 4px;
    --border-radius-min: 9px;
    --border-radius-mid: 16px;
    --border-radius-normal: 22px;
    --border-radius-high: 29px;
    --color-main: #222160;
    --color-main-transparent: #222160c2;
    --color-main-light: #4e4d80;
    --color-main-gray: #9090AF;
    --color-yellow-light: #fefbf2;
    --color-yellow: #F2A700;
    --color-red: #F26A5B;
    --color-black: #000;
    --color-gray-lightest: #fcfcfc;
    --color-gray-lighter: #F6F7FA;
    --color-gray-light: #e3e3eb;
    --color-gray-medium: #8C8BA7;
    --color-gray: #677474;
    --transition-fast: all .2s ease;
    --transition-normal: all .35s cubic-bezier(0.19, 1, 0.22, 1);
    --transition-slow: all .5s ease;

    --top-height: 48px;
    --top-height-responsive: 48px;
    --vehicle-width: 514px;
    --filter-sidebar: 370px;

    --wp--style--global--wide-size: 1675px;
}

*, *::before, *::after {
    /* scroll-behavior: smooth; */
    /* scrollbar-color: var(--scrollbar-button) var(--scrollbar-bar); */
    box-sizing: border-box;
    scrollbar-width: auto;
}

/* Scroll Mac OS */
/* total width */
*::-webkit-scrollbar {
    background-color: transparent;
    width: 6px;
    height: 6px;
}

/* background of the scrollbar except button or resizer */
*::-webkit-scrollbar-track {
    background-color: var(--scrollbar-bar);
}

/* scrollbar itself */
*::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-button);
    border-radius: 8px;
    border: none;
}

/* set button(top and bottom of the scrollbar) */
*::-webkit-scrollbar-button {
    display:none;
}

/* scrollbar when scrollbar is hovered */
*::-webkit-scrollbar-thumb:hover {
    background-color: var(--scrollbar-button-hover);
    border: none;
}

/* Global */
html {
    margin-top: 0 !important;
    touch-action: pan-x pan-y;
}

html body.hide-scroll {
    scroll-behavior: auto;
    overflow-y: hidden;
    touch-action: none;
}

html body#mattprime .no-select {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html body#mattprime .d-none {
    display: none!important;
}

html body#mattprime a,
html body#mattprime button {
    outline: none;
} 

html body#mattprime input, 
html body#mattprime label, 
html body#mattprime button,
html body#mattprime option, 
html body#mattprime li, 
html body#mattprime ul, 
html body#mattprime select, 
html body#mattprime a, 
html body#mattprime p, 
html body#mattprime span, 
html body#mattprime h1, 
html body#mattprime h2, 
html body#mattprime h3, 
html body#mattprime h4, 
html body#mattprime h5, 
html body#mattprime h6 {
    text-shadow: none;
    font-family: 'Open Sans', Sans-serif;
    line-height: 1.3;
}

#mattprime .elementor-widget-text-editor p {
    margin-top: 0;
}

#mattprime .elementor-heading-title {
    line-height: 1.3;
}

#mattprime .wp-site-blocks .entry-content { 
    margin-top: 0;
}

/* Respo Height */
#mattprime .respo-height {
    min-height: calc(100dvh - var(--menu-height-desktop));
    min-height: calc(100vh - var(--menu-height-desktop));
}

@media screen and (max-width: 1024px) {
    #mattprime .respo-height {
        min-height: calc(100dvh - var(--menu-height-mobile));
        min-height: calc(100vh - var(--menu-height-mobile));
    }
}

/* Custom header */
#mattprime header {
    z-index: 10;
    position: relative;
    width: 100%;
    transition: var(--transition-normal);
}

#mattprime header,
#mattprime header > .wp-block-group {
    height: var(--menu-height-desktop);
}

#mattprime header > .wp-block-group  {
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
    background-color: var(--color-white);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    align-content: center;
    transition: var(--transition-fast);
}

@media screen and (min-width: 1025px) {
    #mattprime .header-item:hover .header-items,
    #mattprime .header-item .header-items .header-subitem:hover .header-subitems {
        height: auto;
        width: auto;
        border-radius: var(--border-radius-mid);
        padding: 28px 31px;
        border: none;
        min-width: 225px;
        opacity: 1;
        overflow: visible;
        visibility: visible;
    }
    #mattprime .header-subitems.header-brands {
        top: -80px;
        left: calc(95% + 5px);
    }
}

#mattprime .header-item.header-item-active .header-items .header-subitem.header-subitem-active .header-subitems.header-brands {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    min-width: 800px;
}

#mattprime .header-item.header-item-mega:hover .header-items,
#mattprime .header-item.header-item-mega.header-item-active .header-items {
    right: var(--wp--style--root--padding-right);
    left: var(--wp--style--root--padding-left);
    width: 100%;
    max-width: 1250px;
    margin-left: auto;
    margin-right: auto;
    top: calc(var(--menu-height-desktop) - 30px);
}

#mattprime .header-item-mega .header-item-list {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
}

#mattprime .header-item.header-item-mega {
    position: initial;
}

#mattprime .header-item {
    padding-bottom: 18px;
    padding-top: 18px;
    height: 100%;
}

#mattprime .header-item,
#mattprime .header-subitem {
    list-style: none;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
}

#mattprime .header-item:hover > .header-item-link,
#mattprime .header-subitem:hover > .header-item-link,
#mattprime .header-item-list:hover > .header-item-link,
#mattprime .header-mega-links .header-item-link:hover {
    text-decoration: none;
    font-weight: 600;
}

#mattprime .header-subitem {
    width: 100%;
}

#mattprime .header-item-link {
    color: var(--color-main);
    font-weight: 400;
    font-size: 18px;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

#mattprime .header-brands .header-item-link img {
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px 4px;
    max-width: max-content;
    object-fit: contain;
}

#mattprime .header-item-arrow {
    border: none;
    background-color: transparent;
    transition: var(--transition-fast);
    padding: 0;
}

#mattprime .header-item-arrow svg path {
    stroke: var(--color-main);
}

@media screen and (min-width: 1025px) {
    #mattprime .header-item:hover .header-item-arrow,
    #mattprime .header-item.header-item-active .header-item-arrow {
        transform: rotate(180deg);
    }

    #mattprime .header-items .header-subitem .header-item-arrow,
    #mattprime .header-items .header-subitem:hover .header-item-arrow {
        transform: rotate(270deg);
    }
}

@media screen and (max-width: 1025px) {
    #mattprime .header-item .header-item-link {
        position: relative;
        left: 3px;
    }
}

#mattprime .header-mega-links,
#mattprime .header-mega-links > div {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: 10px;
}

#mattprime .header-mega-links p,
#mattprime .header-mega-cars p {
    display: none;
}

#mattprime .header-mega-links .header-mega-title,
#mattprime .header-mega-cars .header-mega-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    gap: 10px;
    margin-bottom: 13px;
    width: 100%;
}

#mattprime .header-mega-links .header-mega-title p,
#mattprime .header-mega-cars .header-mega-title p {
    color: var(--color-main-gray);
    font-size: 18px;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
    display: block;
}

#mattprime .header-mega-links .header-mega-title a,
#mattprime .header-mega-cars .header-mega-title a {
    color: var(--color-main);
    font-size: 18px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
    display: block;
    text-decoration: none;
}

#mattprime .header-mega-links .header-mega-title a svg,
#mattprime .header-mega-cars .header-mega-title a svg {
    stroke: var(--color-main);
    transform: rotate(270deg);
}

#mattprime .header-mega-cars-content {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 16px;
}

@media screen and (max-width: 1510px) {
    #mattprime .header-item.header-item-mega:hover .header-items, #mattprime .header-item.header-item-mega.header-item-active .header-items {
        max-width: 1050px;
    }
    #mattprime .header-mega-cars-content a:last-child {
        display: none;
    }
}

#mattprime .header-login {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

#mattprime .header-login:hover p {
    text-decoration: underline;
}

#mattprime .header-login .header-item:hover .header-items,
#mattprime .header-login .header-item.header-item-active .header-items {
    top: calc(100% - 27px);
    left: 50%;
    transform: translateX(-50%);
    min-width: max-content;
}

@media screen and (max-width: 1024px) {
    #mattprime .header-login .header-item:hover .header-items,
    #mattprime .header-login .header-item.header-item-active .header-items {
        left: -50%;
        transform: translateX(-50%);
    }
}

/* Custom Top */
#mattprime .custom-top {
    height: var(--top-height);
    background-color: var(--color-main);
    z-index: 24;
    position: relative;
}

#mattprime .custom-top,
#mattprime .custom-search {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#mattprime .custom-top-content {
    align-items: flex-end;
    justify-content: flex-end;
    overflow: hidden;
}

#mattprime .custom-search-content,
#mattprime .custom-top-content {
    display: flex;
    padding-left: var(--wp--style--root--padding-left);
    padding-right: var(--wp--style--root--padding-right);
    width: auto;
    height: 100%;
    max-width: var(--wp--style--global--wide-size);
    margin-left: auto;
    margin-right: auto;
}

#mattprime .custom-top .custom-top-link {
    position: relative;
}

#mattprime .custom-top .custom-top-link a {
    color: var(--color-white);
    padding: 8px 5px;
    background-color: #4e4d80;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    margin-left: 36px;
    margin-right: 36px;
    display: block;
}

#mattprime .custom-top .custom-top-link a {
    z-index: 1;
    position: relative;
}

#mattprime .custom-top .custom-top-link.custom-top-link-active::before {
    background: url('/wp-content/uploads/2026/05/left_svg.svg');
}

#mattprime .custom-top .custom-top-link.custom-top-link-active::after {
    background: url('/wp-content/uploads/2026/05/right_svg.svg');
}

#mattprime .custom-top .custom-top-link::before {
    left: 2px;
    background: url('/wp-content/uploads/2026/05/left_new.svg');
}

#mattprime .custom-top .custom-top-link::after {
    right: 2px;
    background: url('/wp-content/uploads/2026/05/right_new.svg');
}

#mattprime .custom-top .custom-top-link::before,
#mattprime .custom-top .custom-top-link::after {
    background-repeat: no-repeat;
    top: 0;
    content: "";
    position: absolute;
    height: 36px;
    width: 36px;
}

#mattprime .custom-top .custom-top-link.custom-top-link-active a {
    background-color: var(--color-white);
    color: var(--color-main);
}

#mattprime .custom-top .custom-top-link.custom-top-link-active,
#mattprime .custom-top .custom-top-link.custom-top-link-active::after {
    filter: none;
}

#mattprime .custom-search {
    position: relative;
    top: 0;
    overflow: hidden;
}

#mattprime .custom-search-content {
    height: 0;
    z-index: 23;
    align-items: center;
    justify-content: center;
    transform: translateY(calc(-100% - var(--top-height-responsive)));
    position: fixed;
    top: var(--top-height-responsive);
    left: 0;
    right: 0;
    transition: all .3s ease;
    background-color: var(--color-white);
    overflow: hidden;
}

#mattprime .custom-search-active .custom-search-content {
    transform: translateY(0);
    height: var(--menu-height-desktop);
}

#mattprime .custom-search-bar {
    overflow: hidden;
    border-bottom: 1px solid #eee;
    padding-bottom: 12px;
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    height: auto;
    gap: 12px;
    outline: none;
}

#mattprime .custom-search input {
    width: 100%;
    border: none;
    background-color: transparent;
    font-size: 18px;
    color: var(--color-main);
}

#mattprime .custom-search input::placeholder {
    color: var(--color-gray);
}

#mattprime .custom-search input:active,
#mattprime .custom-search input:focus {
    outline: none;
}

/* Search autocomplete — grow the overlay into a scrollable list of suggestions. */
#mattprime .custom-search-suggestions {
    display: none;
    width: 100%;
    flex-direction: column;
    overflow-y: auto;
    margin-top: 4px;
    padding-bottom: 24px;
}

#mattprime .custom-search-has-suggestions .custom-search-content {
    height: calc(100vh - var(--top-height-responsive));
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding-top: 20px;
}

#mattprime .custom-search-has-suggestions .custom-search-suggestions {
    display: flex;
}

#mattprime .custom-search-suggestion {
    display: block;
    width: 100%;
    padding: 16px 4px;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 400;
    color: var(--color-main-dark);
    text-decoration: none;
    transition: var(--transition-fast);
}

#mattprime .custom-search-suggestion:hover {
    color: var(--color-main);
}

/* The typed part of each suggestion is bolded (see renderSuggestions in global.js). */
#mattprime .custom-search-suggestion strong {
    font-weight: 700;
    color: var(--color-main-dark);
}

#mattprime header .header-search p {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main);
}

@media screen and (max-width: 1600px) {
    #mattprime header .header-search p {
        display: none;
    }
    #mattprime header .header-login p {
        display: none;
    }
}

#mattprime header .header-search:hover p {
    text-decoration: underline;
    cursor: pointer;
}

#mattprime header .header-search img {
    margin-right: 8px;
    vertical-align: center;
}

#mattprime header .header-search-close {
    cursor: pointer;
}

/* Header */
#mattprime header .header-logo {
    max-width: 180px;
    width: 100%;
}

#mattprime header .header-logo p {
    display: none;
}


@media screen and (max-width: 1510px) {
    #mattprime header .header-logo {
        max-width: 140px;
    }
    #mattprime .header-item-link {
        font-size: 16px;
    }
}

#mattprime header .header-icons {
    max-width: max-content;
    display: flex;
    align-items: center;
    justify-content: center;
}

#mattprime header .header-search,
#mattprime header .header-user,
#mattprime header .header-button {
    max-width: max-content;
    gap: 0;
}

#mattprime header .header-user .elementor-widget-icon,
#mattprime header .header-user .elementor-icon-wrapper {
    height: 19px;
}

#mattprime header .header-logo .elementor-widget-image,
#mattprime header .header-user .elementor-icon-wrapper,
#mattprime header .header-search img {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
}

#mattprime header .header-menu .elementor-widget-navigation-menu,
#mattprime header .header-menu .elementor-widget-navigation-menu > .elementor-widget-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#mattprime header nav li,
#mattprime header nav a {
    color: var(--color-main);
    font-weight: 400;
    transition: var(--transition-fast);
}

#mattprime header nav .header-menu > li.has-child > .wp-block-navigation-submenu,
#mattprime header nav .header-menu > li.has-child > .wp-block-navigation-submenu > li.has-child > .wp-block-navigation-submenu {
    border-radius: var(--border-radius-mid);
    padding: 28px 31px;
    border: none;
    min-width: 215px;
}

#mattprime .header-login .header-item .header-item-link img {
    position: relative;
    top: 1px;
}

/* Header Mobile */

@media screen and (min-width: 1025px) {
    #mattprime header .header-mobile-menu-back,
    #mattprime header .header-button-mobile,
    #mattprime header .menu-mobile {
        display: none;
    }
}

#mattprime header .menu-mobile {
    min-width: 22px;
    min-height: 22px;
}

@media screen and (max-width: 1024px) {
    #mattprime header,
    #mattprime header .header-main {
        height: var(--menu-height-mobile);
    }

    #mattprime header .header-main > div {
        gap: 11px;
    }

    #mattprime header .header-main .header-nav .header-mega-title,
    #mattprime header .header-mega-cars,
    #mattprime header .header-button {
        display: none;
    }

    #mattprime header .header-main .header-group {
        margin-left: auto;
        gap: 4px;
    }

    #mattprime .custom-search-active .custom-search-content {
        height: var(--menu-height-mobile);
    }

    #mattprime header .header-nav {
        position: absolute;
        left: 0;
        right: 0;
        top: var(--menu-height-mobile);
        transform: translateX(-100%);
        background-color: var(--color-gray-lighter);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        transition: transform .3s ease;
        will-change: transform;
        padding-left: var(--wp--style--root--padding-left);
        padding-right: var(--wp--style--root--padding-right);
        height: calc(100vh - var(--menu-height-mobile) - var(--top-height-responsive));
        height: calc(100dvh - var(--menu-height-mobile) - var(--top-height-responsive));
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        flex-direction: column;
    }

    #mattprime .header-container {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
    }

    #mattprime header .header-nav-open {
        transform: translateX(0);
    }

    #mattprime header .menu-mobile-open {
        position: relative;
        left: -2px;
        top: -2px;
    }

    #mattprime .header-item {
        width: 100%;
        height: max-content;
        justify-content: space-between;
        padding-top: 0;
        padding-bottom: 0;
    }

    #mattprime .header-login button {
        display: none;
    }

    #mattprime .header-search figure {
        position: relative;
        left: 4px;
    }

    #mattprime header .header-search,
    #mattprime header .header-login .header-item {
        max-width: 100%;
        width: 48px;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 100%;
        background-color: var(--color-gray-lighter);
        padding-top: 0;
        padding-bottom: 0;
    }

    #mattprime .header-item-arrow svg {
        transform: rotate(270deg);
        width: 15px;
        height: 15px;
    }

    #mattprime .header-item {
        width: 100%;
        height: max-content;
        justify-content: space-between;
    }

    #mattprime .header-item-link {
        font-size: 18px;
        font-weight: 500;
    }

    #mattprime header .header-button-mobile {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 850px;
        width: 100%;
        position: relative;
        bottom: 20px;
        margin-bottom: 40px;
    }

    #mattprime header .header-button-mobile > div {
        width: 100%;
    }

    #mattprime header .header-nav .header-item .header-items,
    #mattprime header nav.header-nav .header-container .header-item .header-items .header-subitem .header-subitems {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: calc(100vh - var(--menu-height-mobile) - var(--top-height-responsive) - 40px);
        height: calc(100dvh - var(--menu-height-mobile) - var(--top-height-responsive) - 40px);
        background-color: var(--color-gray-lighter);
        padding-top: 0;
        padding-bottom: 40px;
        padding-left: 0;
        padding-right: 0;
        transform: translateX(-100%);
        transition: transform .3s ease;
        will-change: transform;
        gap: 24px;
        opacity: 1;
        visibility: visible;
        width: auto;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    #mattprime .header-item.header-item-active .header-items .header-subitem.header-subitem-active .header-subitems.header-brands {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    #mattprime header .header-nav .header-container .header-item .header-items .header-subitem.header-subitem-active .header-subitems,
    #mattprime header .header-item.header-item-active .header-items {
        transform: translateX(0);
    }

    #mattprime header .header-mobile-menu-back {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-direction: row;
        gap: 13px;
        border-bottom: 1px solid var(--color-gray);
        padding-top: 24px;
        padding-bottom: 24px;
        padding-left: var(--wp--style--root--padding-left);
        padding-right: var(--wp--style--root--padding-right);
    }

    #mattprime .header-item.header-item-mega:hover .header-items, #mattprime .header-item.header-item-mega.header-item-active .header-items {
        top: 0;
        left: 0;
        right: 0;
        max-width: 100%;
    }

    #mattprime header .header-nav .header-item-list,
    #mattprime header .header-nav .header-items .header-subitem {
        padding-left: var(--wp--style--root--padding-left);
        padding-right: var(--wp--style--root--padding-right);
    }

    #mattprime header .header-nav .header-items .header-item-mega .header-items .header-item-list,
    #mattprime header .header-nav .header-items .header-subitem {
        width: auto;
        height: max-content;
        justify-content: space-between;
    }

    #mattprime .header-mega-links,
    #mattprime .header-mega-links > div {
        width: 100%;
        gap: 24px;
    }

    #mattprime header .header-item a,
    #mattprime header .header-nav .header-item-list a,
    #mattprime header .header-nav .header-subitem > a,
    #mattprime header .header-mobile-menu-back p {
        font-size: 18px;
    }

    #mattprime header .header-mobile-menu-back p {
        margin-top: 0;
        margin-bottom: 0;
    }

    #mattprime header .header-mobile-menu-back svg {
        transform: rotate(180deg);
        width: 15px;
        height: 15px;
    }

    #mattprime .custom-top .custom-top-content a {
        padding: 6px 2px;
        text-align: center;
        position: relative;
        top: 3px;
        font-size: 12px;
    }

    #mattprime .custom-top .custom-top-link::before,
    #mattprime .custom-top .custom-top-link::after {
        top: 3px;
    }
}

@media screen and (max-width: 768px) {
    #mattprime .custom-top-content {
        justify-content: center;
    }

    #mattprime .custom-top .custom-top-content a {
        line-height: 0.9;
        padding-left: 2px;
        padding-right: 5px;
        padding-bottom: 5px;
        padding-top: 5px;
        height: 36px;
        align-content: center;
    }
}

/* Footer */
#mattprime footer {
    margin-top: 240px;
    background-color: var(--color-main-dark);
    border-top-left-radius: var(--border-radius-normal);
    border-top-right-radius: var(--border-radius-normal);
}

.footer-float {
    position: absolute;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    padding: 60px 64px;
    border-radius: var(--border-radius-mid);
    background-color: var(--color-white);
    max-width: var(--global-low-width);
    width: 100%;
    border: 2px solid var(--color-gray-lighter);
    justify-content: space-between;
    z-index: 1;
}

#mattprime .footer-float > div:first-child {
    max-width: 500px;
}

#mattprime .footer-float > div:first-child h2 {
    font-weight: 700;
}

#mattprime .footer-float > div:first-child p {
    font-weight: 400;
}

#mattprime .footer-bottom {
    padding-top: 200px !important;
    background-color: transparent !important;
}

#mattprime .footer-logo img {
    height: 71px;
    object-fit: contain;
    max-width: max-content;
}

#mattprime .footer-bottom p,
#mattprime .footer-bottom .footer-title {
    font-size: 18px;
    color: var(--color-white);
    font-weight: 400;
    transition: var(--transition-fast);
}

#mattprime .footer-bottom p a {
    text-decoration: none;
}

#mattprime .footer-bottom .footer-title {
    font-weight: 700;
}

#mattprime .footer-bottom-socials {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--color-gray-light);
    margin-bottom: 60px;
}

#mattprime .footer-bottom-contact {
    border-bottom: 1px solid var(--color-gray-light);
    margin-bottom: 20px;
    padding-bottom: 20px;
}

#mattprime .footer-copyright-links {
    gap: 0;
}

#mattprime .footer-copyright-links > div {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid var(--color-gray-light);
}

#mattprime footer .footer-bottom .footer-copyright .wp-block-paragraph,
#mattprime footer .footer-bottom .footer-copyright a {
    text-decoration: none;
    font-size: 16px !important;
    font-weight: 400;
}

#mattprime .footer-columns {
    width: 100%;
    max-width: 100%;
    justify-content: space-between;
    margin-bottom: 90px;
}

#mattprime .footer-columns > .wp-block-column:last-child .wp-block-buttons {
    flex-direction: column;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

#mattprime .footer-columns > .wp-block-column {
    max-width: max-content
}

#mattprime .footer-social a {
    width: 49px;
    height: 49px;
    border-radius: 100%;
    border: 1px solid var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-fast);
}

#mattprime .footer-social a:hover {
    background-color: var(--color-yellow);
    border-color: var(--color-yellow);
}

#mattprime .footer-links .wp-block-image {
    display: flex;
}

#mattprime .footer-links .wp-block-image img {
    min-width: 6px;
    width: 6px;
    height: 10px;
    object-fit: contain;
}

#mattprime .footer-links .wp-block-paragraph:hover {
    font-weight: 700;
}

@media screen and (max-width: 1024px) {
    .footer-top {
        margin-left: var(--wp--style--root--padding-left);
        margin-right: var(--wp--style--root--padding-right);
    }

    #mattprime .footer-float {
        flex-direction: column;
        padding: 40px 28px
    }

    #mattprime .footer-float h2,
    #mattprime .footer-float p {
        text-align: center;
    }

    #mattprime .footer-float .wp-block-buttons,
    #mattprime .footer-float .wp-block-button {
        width: 100%;
    }

    #mattprime .footer-float .wp-block-button {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    #mattprime .footer-logo img {
        width: 100%;
    }

    #mattprime .footer-bottom-socials {
        flex-direction: column;
    }

    #mattprime .footer-bottom-socials > div {
        flex-direction: column;
    }

    #mattprime .footer-bottom-socials > div .wp-block-group {
        flex-wrap: wrap;
        justify-content: center;
    }

    #mattprime .footer-columns .wp-block-column,
    #mattprime .footer-columns .wp-block-columns .wp-block-buttons,
    #mattprime .footer-columns .wp-block-column .custom-button {
        width: 100%;
        max-width: 100%;
    }

    #mattprime .footer-columns {
        gap: 64px;
        display: grid;
        align-items: start;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #mattprime .footer-bottom-contact {
        flex-direction: column;
        margin-bottom: 50px;
        padding-bottom: 50px;
        gap: 64px;
    }

    #mattprime .footer-bottom-contact .footer-title {
        text-align: center;
    }

    #mattprime .footer-newsletter .newsletter-button {
        gap: 12px;
        align-items: center;
        justify-content: center;
        width: calc(100% - 40px);
    }

    #mattprime .footer-newsletter .newsletter-top .newsletter-input input  {
        max-width: calc(100% - 40px);
    }

    #mattprime .footer-newsletter .newsletter-button input {
        padding: 0;
    }

    #mattprime footer .footer-bottom .footer-copyright .wp-block-paragraph {
        text-align: center;
    }

    #mattprime .footer-copyright-links {
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    #mattprime .footer-copyright {
        align-items: flex-start;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 768px) {
    #mattprime .footer-columns {
        display: flex;
        flex-direction: column;
    }
}

/* Footer Newsletter */
#mattprime .newsletter-button {
    width: 100%;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
    max-width: max-content;
    margin-top: 0;
    position: relative;
    margin-top: 2px;
}

#mattprime .newsletter-input p,
#mattprime .newsletter-button {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

#mattprime .vehicle-interest-popup .custom-form-submit .wpcf7-spinner,
#mattprime .newsletter-button .wpcf7-spinner {
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
}

@media screen and (max-width: 500px) {
    #mattprime .newsletter-button {
        max-width: 100%;
    }
    #mattprime .newsletter-button {
        width: 100%;
    }
}

#mattprime .newsletter-top {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
}

#mattprime .newsletter-top .newsletter-input {
    width: 100%;
    max-width: max-content;
}

@media screen and (max-width: 500px) {
    #mattprime .newsletter-top {
        align-items: flex-start;
        flex-direction: column;
    }
    #mattprime .newsletter-top .newsletter-input {
        max-width: 100%;
    }
}

#mattprime .newsletter-top .newsletter-input input {
    height: 54px;
    border-radius: var(--border-radius-min);
    border: none;
    width: 100%;
    max-width: 220px;
    padding-left: 20px;
    padding-right: 20px;
}

#mattprime .footer-newsletter .form-checkbox input {
    border-color: var(--color-white)!important;
    border-radius: 0;
}

#mattprime .footer-newsletter .wpcf7-response-output {
    color: var(--color-white)!important;
}

#mattprime .footer-newsletter .form-checkbox {
    color: var(--color-white);
    margin-top: 20px;
}

#mattprime .footer-newsletter .form-checkbox label {
    font-size: 14px !important;
    max-width: 395px;
    position: relative;
    bottom: 8px;
}

#mattprime .footer-newsletter .form-checkbox a {
    font-weight: 500;
    color: var(--color-white);
    text-decoration: underline;
}

#mattprime .footer-newsletter .form-checkbox .wpcf7-list-item {
    margin-left: 0;
}

/* Button */
#mattprime .elementor-widget-button {
    overflow: hidden;
    border-radius: var(--border-radius-high);
    border: none;
}

#mattprime .elementor-widget-button a {
    font-size: 18px;
    font-weight: 600;
    padding: 13px 20px;
    background-color: var(--color-white);
    color: var(--color-main-dark);
}


#mattprime .custom-form-submit,
#mattprime .newsletter-button,
#mattprime .custom-button button,
#mattprime .custom-button a {
    padding: 15px 20px;
}

#mattprime .custom-form-submit input {
    background-color: transparent;
    color: var(--color-main);
}

#mattprime .vehicle-interest-popup .custom-form-submit,
#mattprime .button-main button,
#mattprime .button-main a {
    background-color: var(--color-yellow);
    color: var(--color-main);
}

#mattprime .vehicle-interest-popup .custom-form-submit {
    border: 2px solid var(--color-yellow);
}

#mattprime .vehicle-interest-popup .custom-form-submit:hover,
#mattprime .button-main button:hover,
#mattprime .button-main a:hover {
    background-color: var(--color-main);
    color: var(--color-white);
}

#mattprime .vehicle-interest-popup .custom-form-submit:hover input {
    color: var(--color-white);
}

#mattprime .custom-form-submit {
    border: 2px solid var(--color-main);
}

#mattprime .newsletter-button,
#mattprime .button-outline button,
#mattprime .button-outline a {
    border: 2px solid var(--color-white);
}

#mattprime .newsletter-button input,
#mattprime .button-outline button,
#mattprime .button-outline a {
    background-color: transparent;
    color: var(--color-white);
}

#mattprime .custom-form-submit,
#mattprime .button-outline button:hover,
#mattprime .button-outline a:hover {
    background-color: var(--color-white);
    color: var(--color-main);
}

#mattprime .vehicle-interest-popup .custom-form-submit:hover {
    border-color: var(--color-main);
}

#mattprime .button-outline-black button,
#mattprime .button-outline-black a {
    color: var(--color-main-dark);
    border-color: var(--color-main-dark);
}

#mattprime .button-outline-black button:hover,
#mattprime .button-outline-black a:hover {
    color: var(--color-main);
    border-color: var(--color-yellow);
    background-color: var(--color-yellow);
}

#mattprime .newsletter-button:hover,
#mattprime .button-outline-yellow button:hover,
#mattprime .button-outline-yellow a:hover {
    color: var(--color-main);
    border-color: var(--color-yellow);
    background-color: var(--color-yellow);
}

html body#mattprime .custom-form-submit,
html body#mattprime .custom-button .elementor-button-link,
html body#mattprime .custom-button .wp-element-button {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: 8px;
    position: relative;
}

#mattprime .newsletter-button,
#mattprime .custom-button button,
#mattprime .custom-button button span,
#mattprime .custom-button a,
#mattprime .custom-button a span {
    transition: all .5s ease;
    outline: none;
}

#mattprime .custom-button button span,
#mattprime .custom-button a span {
    transform: translateX(5px);
}

#mattprime .custom-form-submit::before,
#mattprime .custom-form-submit::after,
#mattprime .newsletter-button::before,
#mattprime .newsletter-button::after,
#mattprime .custom-button .elementor-button-link::before,
#mattprime .custom-button .elementor-button-link::after,
#mattprime .custom-button .wp-element-button::before,
#mattprime .custom-button .wp-element-button::after {
    transition: opacity .5s ease, left .3s ease, right .3s ease;
}

#mattprime .custom-form-submit::before,
#mattprime .custom-form-submit::after,
#mattprime .newsletter-button::before,
#mattprime .newsletter-button::after,
#mattprime .custom-button .elementor-button-link::before,
#mattprime .custom-button .elementor-button-link::after,
#mattprime .custom-button .wp-element-button::before,
#mattprime .custom-button .wp-element-button::after {
    content: "";
    background: url('/wp-content/uploads/2026/04/arrow-down-lease.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 11px;
    height: 6px;
    position: relative;
    top: 45%;
    transform: rotate(270deg);
}

#mattprime .custom-form-submit::before,
#mattprime .newsletter-button::before,
#mattprime .custom-button .elementor-button-link::before,
#mattprime .custom-button .wp-element-button::before {
    left: 0;
    opacity: 1;
    top: 0;
}

#mattprime .vehicle-interest-popup .custom-form-submit::after,
#mattprime .custom-form-submit::after,
#mattprime .newsletter-button::after,
#mattprime .custom-button .elementor-button-link::after,
#mattprime .custom-button .wp-element-button::after {
    right: -20px;
    filter: brightness(0) saturate(100%) invert(99%) sepia(100%) saturate(2%) hue-rotate(193deg) brightness(104%) contrast(101%);
    opacity: 0;
    top: 0;
}

#mattprime .custom-form-submit:hover input,
#mattprime .newsletter-button:hover input,
#mattprime .custom-button button:hover span,
#mattprime .custom-button a:hover span {
    transform: translateX(-5px);
}

#mattprime .custom-form-submit::before,
#mattprime .newsletter-button::before,
#mattprime .custom-button.button-outline .elementor-button-link::before,
#mattprime .custom-button.button-outline .wp-element-button::before {
    filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(73deg) brightness(103%) contrast(103%);
}

#mattprime .custom-form-submit::after,
#mattprime .custom-form-submit::before,
#mattprime .custom-button a.elementor-button-link:hover::after,
#mattprime .custom-button.button-outline.button-outline-black .elementor-button-link::before,
#mattprime .custom-button.button-outline.button-outline-black .elementor-button-link::after,
#mattprime .custom-button.button-outline.button-outline-black .wp-element-button::before,
#mattprime .custom-button.button-outline .wp-element-button::after {
    filter: none;
}

#mattprime .custom-form-submit:hover::before,
#mattprime .newsletter-button:hover::before,
#mattprime .custom-button button.elementor-button-link:hover::before,
#mattprime .custom-button a.elementor-button-link:hover::before,
#mattprime .custom-button button.wp-element-button:hover::before,
#mattprime .custom-button a.wp-element-button:hover::before {
    left: -20px;
    opacity: 0;
}

#mattprime .custom-form-submit:hover::after,
#mattprime .newsletter-button:hover::after,
#mattprime .custom-button button.elementor-button-link:hover::after,
#mattprime .custom-button a.elementor-button-link:hover::after,
#mattprime .custom-button button.wp-element-button:hover::after,
#mattprime .custom-button a.wp-element-button:hover::after {
    right: 0;
    opacity: 1;
}

#mattprime .custom-button button br,
#mattprime .custom-button a br {
    display: none;
}

@media screen and (max-width: 1510px) {
    #mattprime .custom-button a {
        font-size: 16px;
    }
}

/* Ad */
.promo {
    height: 100%;
}

.promo-main {
    background-color: var(--color-main-dark);
    transition: var(--transition-fast);
    border-radius: var(--border-radius-mid);
    padding: 30px 35px;
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
    gap: 10px;
}

.promo p {
    color: var(--color-white);
    font-size: 18px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

.promo p.promo-title {
    font-weight: 500;
    font-size: 26px;
    margin-bottom: 16px;
    margin-top: 0;
}

.promo-items {
    margin-bottom: auto;
}

.promo-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 12px;
    width: 100%;
    margin-bottom: 12px;
}

.promo-item svg {
    width: 16px;
    height: 16px;
}

.promo-button {
    max-width: 240px;
    margin-right: auto;
}

/* Car */
#mattprime .custom-car,
#mattprime .single-car {
    text-decoration: none;
    transition: var(--transition-fast);
    padding: 16px 20px;
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-gray-lighter);
    box-shadow: 0px 3px 10px #00000008;
    background-color: var(--color-white);
    height: 100%;
}

#mattprime .single-car {
    max-width: 305px;
    width: 100%;
    height: auto;
}

#mattprime .single-car:hover .single-car-title,
#mattprime .single-car:hover .single-car-info {
    text-decoration: underline;
}

#mattprime .single-car .single-car-title {
    margin-top: 0;
    margin-bottom: 6px;
    font-size: 20px;
    color: var(--color-black);
    transition: var(--transition-fast);
    display: block;
}

#mattprime .single-car .single-car-info {
    font-size: 16px;
    color: var(--color-black);
    transition: var(--transition-fast);
    margin-bottom: 10px;
    margin-top: 0;
    display: block;
}

#mattprime .swiper-custom-car,
#mattprime .single-car-image {
    background-color: #fefbf2;
    position: relative;
    border-radius: var(--border-radius-mid);
    overflow: hidden;
}

.custom-car:hover .swiper-custom-car img,
#mattprime .single-car:hover .single-car-image img {
    transform: scale(1.03);
}

#mattprime .custom-car:hover .swiper-custom-car::before,
#mattprime .single-car:hover .single-car-image::before {
    opacity: 0.25;
}

#mattprime .swiper-custom-car img,
#mattprime .single-car-image img {
    position: relative;
    z-index: 1;
    transition: var(--transition-fast);
    margin-left: auto;
    margin-right: auto;
    display: block;
    object-fit: contain;
    width: 100%;
}

#mattprime .swiper-custom-car::before,
#mattprime .single-car-image::before {
    content: "";
    background: url('/wp-content/uploads/2026/05/card_bg.svg');
    opacity: 0.05;
    background-repeat: no-repeat;
    background-position: center;
    left: 0;
    right: 0;
    bottom: -52px;
    position: absolute;
    z-index: 0;
    top: 0;
    transition: var(--transition-fast);
    background-size: cover;
}

.custom-car .custom-car-price,
#mattprime .single-car .single-car-price {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-black);
    text-decoration: none;
    display: block;
    max-width: max-content;
    width: 100%;
}

.custom-car-price .custom-car-price-old,
#mattprime .single-car-price .single-car-price-old {
    text-decoration: line-through;
}

.custom-car-price .custom-car-price-new,
#mattprime .single-car-price .single-car-price-new {
    font-size: 32px;
    font-weight: 700;
}

/* Cuatom Car */
.custom-car {
    display: block;
}

.custom-car-images,
.custom-car-top {
    position: relative;
}

.custom-car-images {
    z-index: 1;
}


.custom-car-top-text,
.custom-car-top-icons {
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    transition: all .3s cubic-bezier(.3, 0, .3, 1);
    z-index: 2;
}

.custom-car-top-text {
    top: 20px;
    left: 20px;
}

.custom-car-top-icons {
    right: 20px;
    bottom: 20px;
}

.custom-car-top-icons div,
.custom-car-top-icons p,
.custom-car-top-icons a,
.custom-car-top-text p {
    margin-top: 0;
    margin-bottom: 0;
    padding: 8px 14px;
    border-radius: var(--border-radius-mid);
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: var(--transition-normal);
}

.custom-car-top-icons div:hover,
.custom-car-top-icons p:hover,
.custom-car-top-icons a:hover {
    transform: scale(1.05);
}

.custom-car-top-text-yellow {
    color: var(--color-white);
    background-color: var(--color-yellow);
}

.custom-car-top-text-gray {
    color: var(--color-white);
    background-color: var(--color-main-gray);
}

.custom-car-top-text-main {
    color: var(--color-white);
    background-color: var(--color-main-dark);
}

.custom-car-top-icons div,
.custom-car-top-icons p,
.custom-car-top-icons a {
    border-radius: 100%;
    color: var(--color-main-dark);
    background-color: var(--color-white);
    padding: 5px;
    width: 33px;
    height: 33px;
}

.custom-car-top-icon-compare.vehicle-content-share-compare-active {
    background-color: var(--color-main);
}

.custom-car-top-icon-compare.vehicle-content-share-compare-active svg,
.custom-car-top-icon-compare.vehicle-content-share-compare-active svg path {
    fill: var(--color-white);
}

.custom-car-title {
    font-size: 20px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 6px;
}

.custom-car-variant {
    font-size: 16px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

#mattprime .car-no-image,
#mattprime .swiper-custom-car {
    padding-top: 40px;
    padding-bottom: 40px;
    margin-bottom: 28px;
}

.custom-car-specs {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.custom-car-specs p {
    padding: 8px 14px;
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-mid);
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

#mattprime .swiper-custom-car .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: var(--border-radius-min);
    background-color: var(--color-main);
    opacity: 0.1;
}

#mattprime .swiper-custom-car .swiper-pagination-bullet-active {
    opacity: 1;
    width: 23px;
}

.custom-car-bottom {
    margin-top: 14px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}


.custom-car-price p {
    margin-top: 0;
    margin-bottom: 0;
}

/* Swiper */
.swiper-cars-offer,
.swiper-cars-recent {
    padding-bottom: 40px;
}

#mattprime .swiper-slide-link {
    position: relative;
    overflow: hidden;
    font-weight: 700;
}

#mattprime .swiper-slide-link::before {
    z-index: -1;
}

#mattprime.swiper-slide-link::before {
    background-color: var(--color-main);
}

#mattprime .swiper-slide-link:hover::before {
    border-radius: 100%;
    left: -48px;
    top: -57px;
    width: 150%;
    height: 360%;
    transition: var(--transition-slow);
}

#mattprime .swiper-slide-link:hover {
    border-color: var(--color-main);
}

#mattprime .home-slider .swiper-slide {
    background-color: var(--color-blue-lighter);
    padding: 20px;
    border-radius: var(--border-radius-min);
}

.swiper-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 12px;
}

.swiper-description {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 29px;
}

#slide-cars-recent,
#slide-cars-offer,
#slide-categories-offer,
#slide-custom-reviews,
#slide-custom-brands,
#slide-custom-videos,
#slide-home {
    width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
}

#slide-custom-reviews .swiper-slide {
    align-self: stretch;
}

#slide-custom-categories {
    padding-bottom: 80px;
}


#slide-custom-categories,
#slide-categories-offer,
#slide-custom-reviews,
#slide-custom-videos,
#slide-custom-brands {
    padding-top: 80px;
}

.swiper-initialized {
    position: relative;
}

.swiper-custom-categories,
.swiper-home,
.swiper-cars-offer,
.swiper-categories-offer,
.swiper-custom-reviews,
.swiper-custom-brands,
.swiper-custom-videos,
.swiper-cars-recent {
    width: 100%;
}

.swiper-custom-reviews .swiper-wrapper {
    height: 100% !important;
}

.swiper-custom-reviews .swiper-slide {
    height: auto !important;
}

.swiper-home {
    height: 773px;
    overflow: hidden;
}

.swiper-home .swiper-slide-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.swiper-home .swiper-slide-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 15px;
    text-align: left;
    height: auto;
    z-index: 1;
    max-width: var(--max-width);
    width: 100%;
    padding-left: 80px;
    padding-right: 80px;
}

@media screen and (max-width: 1600px) {
    .swiper-home .swiper-slide-content {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.swiper-home .swiper-slide-content h2 {
    font-size: 62px;
    font-weight: 500;
    color: var(--color-white);
    max-width: 580px;
    margin-bottom: 12px;
    margin-top: 0;
    letter-spacing: 0;   
}

.swiper-home .swiper-slide-content p {
    font-size: 20px;
    color: var(--color-white);
    max-width: 450px;
    margin-top: 0;
    margin-bottom: 0;
}

.swiper-home .swiper-slide-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: 20px;
}

.swiper-home .swiper-slide-icon img {
    max-width: max-content;
    height: 48px;
    object-fit: contain;
    object-position: left;
}

.swiper-home .swiper-slide-icon p {
    color: var(--color-white);
    font-size: 18px;
    max-width: 280px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

.swiper-home .swiper-slide-image::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    opacity: 1;
    border-radius: var(--border-radius-mid);
    background: linear-gradient(90deg, var(--color-main-transparent), transparent);
}

.swiper-home .swiper-slide-image::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    border-radius: var(--border-radius-mid);
    background: url('/wp-content/uploads/2026/05/stripe_yellow.svg');
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
}

.swiper-home .swiper-slide-image img,
.swiper-home .swiper-slide-image video  {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--border-radius-mid);
}

.swiper-home .swiper-slide-link {
    margin-top: 32px;
    border: 2px solid var(--color-white);
    padding: 12px 24px;
    color: var(--color-white);
    background-color: transparent;
    border-radius: var(--border-radius-min);
}

#slide-custom-categories .swiper-pagination {
    bottom: -50px!important;
}

#slide-home .swiper-home .swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    bottom: 120px!important;
    margin-left: auto;
    margin-right: auto;
    padding-left: 80px;
    padding-right: 80px;
}

@media screen and (max-width: 1600px) {
    #slide-home .swiper-home .swiper-pagination {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.swiper-home .swiper-pagination {
    max-width: var(--max-width);
}

@media screen and (max-width: 1600px) {
    .swiper-home .swiper-pagination {
        padding-left: 20px;
    }
}

.vehicle-content-images .swiper-pagination-bullet,
.swiper-cars-recent .swiper-pagination-bullet,
.swiper-cars-offer .swiper-pagination-bullet,
.swiper-categories-offer .swiper-pagination-bullet,
.swiper-custom-categories .swiper-pagination-bullet,
.swiper-custom-reviews .swiper-pagination-bullet,
.swiper-custom-videos .swiper-pagination-bullet,
.swiper-home .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: var(--border-radius-mid);
    background-color: var(--color-white);
    opacity: 0.7;
    transition: width .3s ease;
}

.vehicle-content-images .swiper-pagination-bullet,
.swiper-cars-offer .swiper-pagination-bullet,
.swiper-categories-offer .swiper-pagination-bullet,
.swiper-custom-categories .swiper-pagination-bullet,
.swiper-custom-reviews .swiper-pagination-bullet,
.swiper-custom-videos .swiper-pagination-bullet,
.swiper-cars-recent .swiper-pagination-bullet {
    background-color: var(--color-main);
    opacity: 0.3;
    border-radius: var(--border-radius-min);
}

.vehicle-content-images .swiper-pagination-bullet-active,
.swiper-cars-offer .swiper-pagination-bullet-active,
.swiper-categories-offer .swiper-pagination-bullet-active,
.swiper-cars-recent .swiper-pagination-bullet-active,
.swiper-custom-categories .swiper-pagination-bullet-active,
.swiper-custom-reviews .swiper-pagination-bullet-active,
.swiper-custom-videos .swiper-pagination-bullet-active,
.swiper-home .swiper-pagination-bullet-active {
    opacity: 1;
    width: 22px;
}

.swiper-cars-offer .swiper-pagination-bullet-active,
.swiper-categories-offer .swiper-pagination-bullet-active,
.swiper-custom-reviews .swiper-pagination-bullet-active,
.swiper-custom-categories .swiper-pagination-bullet-active,
.swiper-custom-videos .swiper-pagination-bullet-active,
.swiper-cars-recent .swiper-pagination-bullet-active {
    background-color: var(--color-yellow);
}

.swiper-initialized .swiper-buttons,
#slide-home .swiper-buttons {
    width: 100%;
    position: relative;
    max-width: var(--max-width);
    gap: 8px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
    margin-right: auto;
}

#slide-home .swiper-buttons {
    left: 0;
    bottom: 130px!important;
}

@media screen and (max-width: 1600px) {
    .swiper-initialized .swiper-buttons,
    #slide-home .swiper-buttons {
        padding-right: 20px;
    }
}


.swiper-initialized .swiper-buttons {
    top: -55px;
    right: 4px;
    position: absolute;
}

.swiper-initialized .swiper-button-prev,
.swiper-initialized .swiper-button-next,
#slide-home .swiper-button-prev,
#slide-home .swiper-button-next {
    position: relative;
    left: 0!important;
    display: block!important;
    width: 45px !important;
    height: 45px !important;
    border: 2px solid var(--color-white);
    transform: translate(0);
    border-radius: 100%;
    outline: none;
}

#slide-vehicle-images .swiper-button-prev,
#slide-vehicle-images .swiper-button-next {
    position: absolute;
}

#slide-vehicle-images .swiper-button-prev {
    left: 0!important;
    right: auto !important;
}

#slide-vehicle-images .swiper-button-next {
    right: 0 !important;
    left: auto !important;
}

#slide-vehicle-images .swiper-initialized .swiper-buttons {
    top: 50%;
}

.swiper-initialized .swiper-button-prev::after, .swiper-initialized .swiper-button-next::after,
#slide-home .swiper-button-prev::after, #slide-home .swiper-button-next::after {
    transition: var(--transition-slow);
    font-size: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.swiper-initialized .swiper-button-prev, .swiper-initialized .swiper-button-next {
    border-color: var(--color-main-dark);
}

#slide-custom-videos .swiper-button-prev::after, #slide-custom-videos .swiper-button-next::after,
#slide-home .swiper-button-prev::after, #slide-home .swiper-button-next::after {
    color: var(--color-white);
}

#slide-custom-videos .swiper-button-prev, #slide-custom-videos .swiper-button-next {
    border-color: var(--color-white);
}

.swiper-initialized .swiper-button-prev::after, .swiper-initialized .swiper-button-next::after {
    color: var(--color-main-dark);
}

#slide-home .swiper-button-next::after {
    transform: rotate(180deg);
}

#slide-home .swiper-button-prev:hover, #slide-home .swiper-button-next:hover {
    background-color: var(--color-white);
}

.swiper-initialized .swiper-button-prev:hover::after, .swiper-initialized .swiper-button-next:hover::after,
#slide-home .swiper-button-prev:hover::after, #slide-home .swiper-button-next:hover::after {
    color: var(--color-main-dark);
}

@media screen and (min-width: 1025px) {
    #slide-custom-reviews .swiper-pagination,
    #slide-categories-offer .swiper-pagination {
        display: none;
    }
}
    
@media screen and (max-width: 1024px) {
    .swiper-home {
        height: calc(100vh - var(--top-height) - var(--menu-height-mobile));
    }

    #slide-home {
        padding-left: 0;
        padding-right: 0;
        right: calc(var(--wp--style--root--padding-left));
        position: relative;
        width: 100vw;
    }

    .swiper-home .swiper-slide-icon {
        flex-direction: column;
    }

    .swiper-home .swiper-slide-image img {
        height: 100%;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-left-radius: var(--border-radius-mid);
        border-bottom-right-radius: var(--border-radius-mid);
    }

    .swiper-home .swiper-slide-image::before {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-left-radius: var(--border-radius-mid);
        border-bottom-right-radius: var(--border-radius-mid);
    }

    .swiper-home .swiper-slide-content {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        margin-left: auto;
        margin-right: auto;
        top: 50px;
        bottom: 0;
        left: 0;
        transform: translate(0);
        padding-bottom: 45px;
        gap: 16px;
        align-items: center;
    }

    .swiper-home .swiper-slide-content .wp-block-button {
        margin-left: auto;
        margin-right: auto;
        margin-top: auto;
        margin-bottom: 80px;
        max-width: 600px;
        width: 100%;
    }

    .swiper-home .swiper-slide-content h2 {
        font-size: 40px;
        text-align: center;
        padding-top: 0;
        margin-bottom: 0;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .swiper-home .swiper-slide-content p {
        text-align: center;
        font-size: 18px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .swiper-home .swiper-slide-link {
        width: 100%;
        padding-top: 16px;
        text-align: center;
    }

    #slide-home .swiper-home .swiper-pagination {
        justify-content: center;
        bottom: 80px !important;
        padding-left: 0;
    }

    #slide-custom-reviews .swiper-buttons,
    #mattprime .custom-videos-main .swiper-buttons,
    #slide-home .swiper-buttons,
    #slide-cars-recent .swiper-buttons,
    #slide-custom-brands .swiper-buttons,
    #slide-cars-offer .swiper-buttons,
    #slide-categories-offer .swiper-buttons {
        display: none;
    }

    #mattprime .home-categories-offer h2,
    #mattprime .main-reviews h2,
    #mattprime .custom-videos-main .custom-videos-heading h2,
    #mattprime .custom-videos-main .custom-videos-heading p,
    .main-custom-brands h2,
    #slide-categories-offer h2,
    #slide-cars-recent .swiper-title,
    #slide-cars-offer .swiper-title,
    #slide-cars-recent .swiper-description,
    #slide-cars-offer .swiper-description {
        text-align: center;
    }

    #mattprime .main-custom-brands .e-con-inner > .elementor-element {
        width: 100%;
        padding: 0;
    }

    #slide-custom-brands {
        position: relative;
        /* width: 100vw;
        right: var(--wp--style--root--padding-left); */
    }

    #slide-cars-recent .swiper-title,
    #slide-cars-offer .swiper-title,
    #mattprime .home-categories-offer h2,
    #mattprime .main-reviews h2,
    #mattprime .main-custom-brands h2,
    #slide-categories-offer h2 {
        font-size: 26px;
    }

    #mattprime #slide-custom-reviews,
    #mattprime #slide-categories-offer {
        padding-top: 0;
    }

    #mattprime #slide-custom-reviews,
    #mattprime #slide-categories-offer {
        padding-bottom: 40px;
    }

    #mattprime #slide-custom-reviews .swiper-pagination,
    #slide-categories-offer .swiper-pagination {
        bottom: -40px;
    }

    #slide-categories-offer .custom-category-offer h3 {
        padding-left: 10px;
        padding-right: 10px;
    }

    .custom-category-offer-image::before {
        background-size: cover;
    }

    .custom-category-offer-image img {
        object-fit: cover;
        height: 240px;
    }
}

@media screen and (max-width: 390px) {
    .custom-category-offer-image img {
        object-fit: contain;
    }
    .swiper-home .swiper-slide-content h2 {
        font-size: 26px;
    }
}

/* Home Categories Offer */
#mattprime .main-reviews > .e-con-inner > div:first-child,
#mattprime .home-categories-offer > .e-con-inner > div:first-child {
    max-width: 479px;
}

#mattprime .home-categories-offer > .e-con-inner > div:last-child {
    width: 100%;
}

#mattprime .home-categories-offer .custom-button {
    max-width: 226px;
    margin-left: auto;
    margin-right: auto;
}

.custom-category-offer-image {
    background-color: var(--color-yellow-light);
    border-radius: var(--border-radius-mid);
    height: 220px;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.custom-category-offer-image:hover img {
    transform: scale(1.05);
}

.custom-category-offer-image img {
    z-index: 1;
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    bottom: -12%;
    object-fit: contain;
    height: 187px;
    transition: var(--transition-slow);
}

.custom-category-offer-image::before {
    content: "";
    background: url('/wp-content/uploads/2026/05/yellow_bg.svg');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    width: 100%;
    height: 260px;
    position: absolute;
    bottom: 0;
}

.custom-category-offer-image:hover::before {
    opacity: 0.6;
}

.custom-category-offer h3 {
    padding-left: 30px;
    padding-right: 30px;
    font-size: 26px;
    font-weight: 700;
    margin-top: 25px;
    margin-bottom: 35px;
    text-align: center;
    color: var(--color-main-dark);
}

/* Custom Category */
#mattprime .main-custom-categories {
    overflow-x: hidden;
}

#mattprime .main-custom-categories-title {
    position: relative;
    top: 80px;
}

.custom-category {
    padding: 43px 43px 15px 43px;
    background-color: var(--color-main-dark);
    height: 445px;
    transition: var(--transition-fast);
    border-radius: var(--border-radius-mid);
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    position: relative;
}

#slide-custom-categories .swiper-slide,
#slide-custom-categories .swiper-slide:hover .custom-category,
#slide-custom-categories .swiper-slide-active .custom-category {
    height: 510px;
}

#slide-custom-categories .swiper-slide {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column;
    transition: var(--transition-normal);
}

#slide-custom-categories .swiper-slide:hover .custom-category::before,
#slide-custom-categories .swiper-slide-active .custom-category::before {
    content: "";
    position: absolute;
    z-index: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/06/container-back-18.svg');
    background-repeat: no-repeat;
    height: 275px;
    background-size: cover;
}

.custom-category h3 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--color-white);
}

.custom-category p {
    font-size: 18px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-white);
}

.custom-category-top {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.custom-category-top-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: var(--color-white);
    border-radius: 100%;
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: var(--transition-normal);
}

#slide-custom-categories .swiper-slide:hover .custom-category .custom-category-top-icon,
.swiper-slide-active .custom-category .custom-category-top-icon {
    opacity: 1;
}

.custom-category-bottom img {
    object-fit: cover;
    transition: var(--transition-normal);
}

#slide-custom-categories .swiper-slide:hover .custom-category .custom-category-bottom img,
.swiper-slide-active .custom-category .custom-category-bottom img {
    transform: scale(1.08);
}

@media screen and (max-width: 1024px) {
    .main-custom-categories .main-custom-categories-title h2 {
        text-align: center;
        font-size: 26px;
    }

    .main-custom-categories .main-custom-categories-title p {
        text-align: center;
    }

    .main-custom-categories .swiper-buttons {
        display: none;
    }

    #slide-custom-categories .swiper-slide,
    #slide-custom-categories .swiper-slide:hover .custom-category,
    #slide-custom-categories .swiper-slide-active .custom-category {
        height: 380px;
    }
}

/* Search Models */
.search-models {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    padding-top: 10px;
    margin-bottom: 80px;
}

.search-models .form-option:not(:last-child) {
    margin-right: 14px;
    border-right: 1px solid var(--color-gray-light);
}

.search-models-bar {
    border: 1px solid var(--color-gray-light);
    border-radius: 50px;
    height: 100px;
    padding: 10px 49px;
    margin-left: auto;
    margin-right: auto;
    max-width: 1110px;
    background-color: var(--color-white);
    position: absolute;
    top: calc(100px - 100%);
    z-index: 2;
}

.search-models-bar,
.search-models-popular {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
}

.search-models-popular {
    margin-top: 38px;
}

.search-models-popular p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    font-weight: 700;
    margin-right: 20px;
    color: var(--color-main-dark);
    margin-bottom: 10px;
}

.search-models-popular a {
    padding: 8px 14px;
    border-radius: var(--border-radius-mid);
    background-color: var(--color-gray-lighter);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-main-dark);
    margin-bottom: 10px;
}

.search-models-popular a:not(:last-child) {
    margin-right: 10px;
}

@media screen and (max-width: 1024px) {
    .search-models {
        top: -70px;
        position: relative;
    }

    .search-models-bar {
        flex-direction: column;
        height: 100%;
        position: relative;
        padding-top: 24px;
        padding-bottom: 24px;
        padding-left: 36px;
        padding-right: 36px;
        border-radius: var(--border-radius-mid);
    }

    .search-models-bar .form-option,
    .search-models-bar .form-option select {
        width: 100%;
    }

    .search-models .form-option:not(:last-child) {
        border-right: none;
        border-bottom: 1px solid var(--color-gray-light);
    }

    .search-models-bar .wp-block-button {
        margin-top: 24px;
        width: 100%;
    }

    .search-models-bar .wp-block-button button {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        max-width: 600px;
    }

    .search-models-popular {
        flex-wrap: wrap;
    }
    
    .search-models-popular p {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
        margin-right: 0;
    }
}

/* Form Option */
.form-option {
    padding-right: 14px;
    padding-left: 14px;
    background-color: var(--color-white);
}

.form-option {
    min-width: 150px;
}

.form-option select {
    background-color: transparent;
    border: none;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 16px;
    font-weight: 400;
    color: var(--color-main-dark);
    min-width: 120px;
}

/* Custom Brands */
body#mattprime .e-con.main-custom-brands > .e-con-inner {
    padding-left: 0;
    padding-right: 0;
}

body#mattprime .e-con.main-custom-brands > .e-con-inner > .elementor-widget-heading {
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}

body#mattprime .e-con.main-custom-brands .swiper-buttons {
    padding-right: var(--wp--style--root--padding-right);
}

.main-custom-brands h2 {
    position: relative;
    top: 64px;
}

.custom-brands .swiper-slide {
    max-width: max-content;
}

.custom-brands a {
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 14px;
    max-width: max-content;
}

.custom-brands img {
    object-fit: contain;
    height: 60px;
}

/* Leasing Categories */
.leasing-category {
    border-radius: var(--border-radius-mid);
    overflow: hidden;
    position: relative;
    max-width: 650px;
    width: 100%;
    cursor: pointer;
}

.leasing-category::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: -8px;
    transition: var(--transition-fast);
    width: 100%;
    background-repeat: no-repeat;
    margin-top: auto;
}

.leasing-categories .leasing-category:first-child::before {
    background: url('/wp-content/uploads/2026/05/container-back-1.svg');
    height: 230px;
}

.leasing-categories .leasing-category:last-child::before {
    background: url('/wp-content/uploads/2026/05/container-back-2.svg');
    height: 202px;
}

.leasing-category:hover::before {
    bottom: 0;
}

.leasing-category h2 {
    margin-bottom: 0;
}

.leasing-category h2,
.leasing-category p {
    line-height: 1.3;
}

.leasing-category img {
    border-radius: var(--border-radius-mid);
    object-fit: cover;
    height: auto;
    transition: var(--transition-fast);
    height: 450px;
}

.leasing-category:hover img {
    transform: scale(1.03);
}

.leasing-category-container {
    z-index: 1;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 30px;
}

@media screen and (min-width: 1025px) {
    #mattprime .leasing-category-container .elementor-widget-icon {
        width: 85px;
    }

    #mattprime .leasing-category-container .leasing-category-buttons {
        max-width: max-content;
    }

    #mattprime .leasing-category-container .custom-button {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    #mattprime .leasing-category-container .elementor-widget-icon {
        display: none;
    }
}


.leasing-category-container .elementor-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border: 2px solid var(--color-white);
    border-radius: 100%;
    transition: var(--transition-fast);
}

.leasing-category-container svg {
    transform: rotate(270deg);
    width: auto;
    height: auto;
}

.leasing-category-container svg path {
    fill: var(--color-white);
}

#mattprime .leasing-category:hover .elementor-icon {
    border-color: var(--color-yellow);
    background-color: var(--color-yellow);
}

@media screen and (max-width: 1024px) {
    #mattprime .leasing-categories .leasing-category::before {
        background: url('/wp-content/uploads/2026/06/container-back-19.svg');
        background-size: cover;
        background-repeat: no-repeat;
        height: 300px;
        bottom: 0;
    }

    #mattprime .leasing-category-container {
        padding-left: 24px;
        padding-right: 24px;
        padding-bottom: 20px;
    }

    #mattprime .leasing-categories .leasing-category h2,
    #mattprime .leasing-categories .leasing-category p {
        text-align: center;
    }

    #mattprime .leasing-categories .leasing-category {
        min-height: 550px;
    }

    #mattprime .home-now-top > .elementor-element:first-child {
        order: 2;
    }

    #mattprime .home-now-top > .elementor-element:last-child {
        order: 1;
    }

    #mattprime .home-now-top h2 {
        font-size: 26px;
        margin-top: 20px;
    }

    #mattprime .home-now-bottom-icon .elementor-heading-title,
    #mattprime .home-now-top h2,
    #mattprime .home-now-bottom-icon p,
    #mattprime .home-now-top p {
        text-align: center;
    }

    #mattprime .home-now-top img {
        height: 320px;
    }
    
    #mattprime .home-now-bottom-icon .elementor-widget-icon {
        margin-left: auto;
        margin-right: auto;
    }

    #mattprime .home-now-bottom-icon {
        align-items: center;
        padding-left: 30px;
        padding-right: 30px;
    }

    #mattprime .home-now::before {
        background: url(/wp-content/uploads/2026/06/container-back-20.svg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 1941px;
    }
}


/* Global Hero */
.global-hero {
    background-color: var(--color-main);
    position: relative;
    margin-bottom: 120px;
}

.global-hero::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: auto;
    bottom: -1px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100vw;
    background: url('/wp-content/uploads/2026/06/container-back-15.svg');
    background-repeat: no-repeat;
    height: 47px;
    background-size: cover;
}

.global-hero.global-hero-compact {
    margin-bottom: 0;
    padding-bottom: 300px;
}

.global-hero .item-breadcrumb .item-breadcrumb-active {
    color: var(--color-white);
}

#mattprime.page .wp-site-blocks .global-hero > .e-con-inner {
    max-width: var(--global-high-width);
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
    margin-bottom: 80px;
}

.global-hero .global-hero-content {
    max-width: 540px;
}

.global-hero .global-hero-content h1 {
    font-size: 54px;
}

.global-hero .global-hero-content a,
.global-hero .global-hero-content button {
    max-width: max-content;
}

.global-hero img {
    width: 100%;
    max-width: 547px;
    height: 485px;
    object-fit: cover;
    border-radius: var(--border-radius-mid);
    position: relative;
    z-index: 1;
}

.global-hero .global-hero-image {
    justify-content: flex-end;
}

.global-hero .global-hero-image .elementor-widget-image {
    position: relative;
    overflow: hidden;
}

.global-hero .global-hero-image .elementor-widget-image::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: -1px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100%;
    margin-bottom: auto;
    background: url('/wp-content/uploads/2026/06/container-back-16.svg');
    background-repeat: no-repeat;
    height: 124px;
    border-top-left-radius: var(--border-radius-mid);
    border-top-right-radius: var(--border-radius-mid);
}

.global-hero .global-hero-image .elementor-widget-image::before {
    content: "";
    position: absolute;
    z-index: 2;
    bottom: -1px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/06/container-back-17.svg');
    background-repeat: no-repeat;
    height: 124px;
    border-bottom-left-radius: var(--border-radius-mid);
    border-bottom-right-radius: var(--border-radius-mid);
}

@media screen and (min-width: 992px) {
    #mattprime .global-hero .global-hero-content .global-hero-image {
        display: none;
    }
}

@media screen and (max-width: 991px) {
    #mattprime .global-hero > .e-con-inner {
        flex-direction: column;
    }

    #mattprime .global-hero .global-hero-content > .global-hero-image {
        display: flex;
    }

    #mattprime .global-hero .e-con-inner > .global-hero-image {
        display: none;
    }

    #mattprime .global-hero .global-hero-image .elementor-widget-image {
        width: 100%;
    }

    .global-hero .global-hero-image img {
        width: 100%;
        max-width: 100%;
    }

    .global-hero .global-hero-image .elementor-widget-image::after {
        width: 100%;
        margin-left: auto;
    }

    .global-hero .global-hero-image .elementor-widget-image::before {
        background-position: center;
        background-size: cover;
    }

    #mattprime .global-hero .global-hero-content {
        width: 100%;
        max-width: 100%;
    }

    #mattprime .global-hero .global-hero-content p {
        text-align: center;
    }

    #mattprime .global-hero .global-hero-content h2 {
        text-align: center;
        font-size: 40px;
    }

    #mattprime .global-hero .global-hero-content .custom-button {
        margin-left: auto;
        margin-right: auto;
        max-width: 600px;
        width: 100%;
    }

    #mattprime .global-hero .global-hero-content .custom-button .elementor-button {
        max-width: 100%;
        width: 100%;
    }
}

@media screen and (min-width: 688px) and (max-width: 991px) {
    .global-hero .global-hero-image .elementor-widget-image::after {
        width: 688px;
    }
}

@media screen and (max-width: 650px) {
    .global-hero .global-hero-image img {
        height: 260px;
    }
}

@media screen and (max-width: 390px) {
    #mattprime .global-hero .global-hero-content h2 {
        font-size: 26px;
    }
}


/* Home Now */
#mattprime.page .wp-site-blocks .home-now > .e-con-inner {
    max-width: var(--global-mid-width);
    margin-left: auto;
    margin-right: auto;
}

.home-now::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    transition: var(--transition-fast);
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-3.svg');
    background-repeat: no-repeat;
    height: 1142px;
}

.home-now > .e-con-inner {
    position: relative;
    z-index: 1;
}

.home-now-top img {
    width: 100%;
    height: 520px;
    object-fit: cover;
    border-radius: var(--border-radius-mid);
    position: relative;
    z-index: 1;
}

.home-now-top .elementor-widget-image::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 10px;
    left: 10px;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-yellow);
    border-radius: var(--border-radius-mid);
}

/* Global Box */
#mattprime.page .wp-site-blocks .global-box > .e-con-inner {
    max-width: var(--global-mid-width);
    margin-left: auto;
    margin-right: auto;
}

.global-box .global-box-content a,
.global-box .global-box-content button {
    max-width: max-content;
}

.global-box img {
    width: 100%;
    max-width: 547px;
    height: 485px;
    object-fit: cover;
    border-radius: var(--border-radius-mid);
    position: relative;
    z-index: 1;
}

.global-box .global-box-image .elementor-widget-image {
    position: relative;
    overflow: hidden;
}

.global-box .global-box-image .elementor-widget-image::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: -1px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100%;
    margin-bottom: auto;
    background: url('/wp-content/uploads/2026/05/container-back-5.svg');
    background-repeat: no-repeat;
    height: 76px;
    border-top-left-radius: var(--border-radius-mid);
    border-top-right-radius: var(--border-radius-mid);
}

.global-box .global-box-image .elementor-widget-image::before {
    content: "";
    position: absolute;
    z-index: 2;
    bottom: -1px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-4.svg');
    background-repeat: no-repeat;
    height: 76px;
    border-bottom-left-radius: var(--border-radius-mid);
    border-bottom-right-radius: var(--border-radius-mid);
}

@media screen and (max-width: 1024px) {
    #mattprime .global-box > .e-con-inner {
        flex-direction: column;
    }

    #mattprime .global-box .global-box-image {
        order: 1;
    }

    #mattprime .global-box .global-box-content {
        order: 2;
    }

    #mattprime .global-box img {
        height: 320px;
    }

    #mattprime .global-box .global-box-content p,
    #mattprime .global-box .global-box-content h2,
    #mattprime .global-box .global-box-content h3,
    #mattprime .global-box .global-box-content h4 {
        text-align: center;
    }

    #mattprime .global-box .global-box-content .custom-button a,
    #mattprime .global-box .global-box-content .custom-button {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        max-width: 600px;
    }

    #mattprime .global-box .global-box-content .global-box-content-main {
        gap: 5px;
        margin-bottom: 20px;
    }
}

/* Global Icons */
#mattprime .wp-site-blocks .elementor-element.global-icons-main > .e-con-inner {
    max-width: var(--global-mid-width);
}

.global-icons-main {
    position: relative;
}

.global-icons-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: center;
    grid-auto-rows: 1fr;
    column-gap: 16px;
    row-gap: 16px;
}

.global-icons-main::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: auto;
    width: 100%;
    background: url('/wp-content/uploads/2026/05/container-back-8.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    min-height: 1920px;
    transform: translateY(-20%);
}

.global-icon-svg {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.global-icon-svg img {
    object-fit: contain;
}

.global-icon-content {
    border: 2px solid var(--color-main);
    border-radius: var(--border-radius-mid);
    padding: 40px 30px;
    background-color: var(--color-white);
    position: relative;
}

.global-icon-content::before {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 0;
    right: 0;
    left: 0;
    top: 0;
    width: 90%;
    height: 90%;
    background-color: var(--color-main);
    border-radius: var(--border-radius-normal);
    transition: var(--transition-fast);
}

.global-icon-content:hover::before {
    transform: translate(-7px, -7px);
    width: calc(100% + 7px);
    height: calc(100% + 7px);
}

.global-icon-content p {
    margin-bottom: 0;
}

.global-icon-content .global-icon-text h3 {
    font-size: 20px;
    margin-top: 16px;
    margin-bottom: 12px;
    text-align: center;
    color: var(--color-main);
    font-weight: 700;
}

.global-icon-content .global-icon-text p {
    margin-top: 0;
    margin-bottom: 0;
    text-align: center;
    color: var(--color-main);
    font-size: 18px;
}

@media screen and (max-width: 1024px) {
    .global-icons-main .global-icons {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 768px) {
    .global-icons-main .global-icons {
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    .global-icons-main h2 {
        font-size: 26px;
    }
}

/* Global Video  */
.swiper-custom-videos {
    padding-bottom: 40px;
}

.custom-videos-heading {
    position: relative;
    bottom: -80px;
}

.custom-videos-main::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: -40px;
    left: 0;
    right: 0;
    transition: var(--transition-fast);
    width: 100vw;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-7.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.custom-video,
.custom-video-image,
.custom-video-image img {
    position: relative;
    z-index: 1;
}

.custom-video-image,
.custom-video-image img {
    border-radius: var(--border-radius-normal);
}

.custom-video-image::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 5px;
    left: 5px;
    right: 0;
    bottom: 0;
    width: 90%;
    height: 90%;
    background-color: var(--color-yellow);
    border-radius: var(--border-radius-normal);
    transition: var(--transition-fast);
}

.custom-video-image::after {
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    opacity: 1;
    border-radius: var(--border-radius-normal);
    background: linear-gradient(90deg, var(--color-main-transparent), transparent);
    z-index: 2;
    transition: var(--transition-fast);
    opacity: 0;
}

.custom-video:hover .custom-video-image::after {
    opacity: 1;
}

.custom-video:hover .custom-video-image::before {
    top: 8px;
    left: 8px;
    width: 100%;
    height: 100%;
}

.custom-video-icon {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-fast);
    opacity: 0;
    z-index: 1;
}

.custom-video:hover .custom-video-icon {
    opacity: 1;
}

.custom-video h3 {
    font-size: 18px;
    font-weight: 500;
    color: var(--color-white);
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
    z-index: 1;
    opacity: 0;
    transition: var(--transition-fast);
}

.custom-video:hover h3 {
    opacity: 1;
}

.custom-video-hidden {
    display: none;
}

#mattprime .swiper-custom-videos .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-main-dark);
}

@media screen and (max-width: 1024px) {
    
    #mattprime .custom-videos {
        padding-bottom: 70px;
    }

    #mattprime .custom-video {
        padding: 9px;
    }
    #mattprime .custom-video-image img {
        width: 100%;
    }

    #mattprime .custom-videos .custom-video .custom-video-image::before {
        top: 8px;
        left: 8px;
        width: 100%;
        height: 100%;
    }

    #mattprime .custom-videos .custom-video .custom-video-image::after,
    #mattprime .custom-videos .custom-video .custom-video-icon,
    #mattprime .custom-videos .custom-video h3 {
        opacity: 1;
    }

    #mattprime .custom-videos-main::before{
        background: url(/wp-content/uploads/2026/06/container-back-21.svg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 1151px;
    }

    #mattprime .swiper-custom-videos .swiper-pagination-bullet,
    #mattprime .swiper-custom-videos .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background-color: var(--color-white);
    }
}

/* Custom Reviews */
.main-reviews {
    position: relative;
}

.main-reviews::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: -40px;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-9.svg');
    background-repeat: no-repeat;
    height: 425px;
}

.custom-review {
    padding: 42px 44px;
    border-radius: var(--border-radius-min);
    border: 1px solid var(--color-gray-lighter);
    display: flex;
    align-items: flex-start;
    justify-content: stretch;
    flex-direction: column;
    gap: 10px;
    background-color: var(--color-white);
    min-height: 300px;
}

.custom-review-bottom {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 16px;
    margin-top: auto;
}

.custom-review > p {
    margin-top: 0;
    margin-bottom: 30px;
    font-size: 18px;
    color: var(--color-main-dark);
}

.custom-review-bottom p {
    margin-top: 0;
    margin-bottom: 5px;
    color: var(--color-main-gray);
    font-size: 16px;
    font-weight: 500;
}

.custom-review-stars {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    flex-direction: row;
}

/* Global Info */
.main-info::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 10px;
    left: 0;
    right: 0;
    width: 100vw;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-10.svg');
    background-repeat: no-repeat;
    min-height: 460px;
    background-size: cover;
    background-position: right;
}

.global-info-content {
    border-radius: var(--border-radius-mid);
    padding: 50px 40px;
    background-color: var(--color-white);
    position: relative;
    border: 2px solid var(--color-gray-lighter);
}

/* Global Grid */
#mattprime .global-grid {
    display: grid;
    grid-auto-rows: 1fr;
    align-items: center;
    justify-content: center;
    grid-gap: 16px;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    grid-template-rows: repeat(4, minmax(0, 1fr));
    max-width: var(--global-high-width);
    margin-left: auto;
    margin-right: auto;
}

#mattprime .global-grid-content {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 20px;
    border-radius: var(--border-radius-mid);
    padding: 30px;
    height: 100%;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

#mattprime .global-grid-content::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    opacity: 1;
    border-radius: var(--border-radius-mid);
    background: linear-gradient(90deg, var(--color-main-transparent), transparent);
}

#mattprime .global-grid-content::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    transition: var(--transition-fast);
    width: 100%;
    margin-top: auto;
    height: 201px;
    transform: translateY(100%);
    transition: var(--transition-slow);
}

#mattprime .global-grid-content:hover::after {
    transform: translateY(0);
}

#mattprime .global-grid-content > div {
    margin-top: auto;
    z-index: 2;
}

#mattprime .global-grid-content > div:last-child {
    max-width: max-content;
}

#mattprime .global-grid-content svg {
    transform: rotate(270deg);
    border-radius: 100%;
    width: 40px;
    height: 40px;
    border: 2px solid var(--color-white);
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-fast);
}

#mattprime .global-grid-content:hover svg {
    background-color: var(--color-white);
}

#mattprime .global-grid-content svg path {
    fill: var(--color-white);
    transition: var(--transition-fast);
}

#mattprime .global-grid-content:hover svg path {
    fill: var(--color-main-dark);
}

#mattprime .global-grid-content-1 {
    grid-column: 1 / 5;
    grid-row: 1 / 5;
}

#mattprime .global-grid-content-1::after {
    filter: brightness(0) saturate(100%) invert(45%) sepia(25%) saturate(5578%) hue-rotate(199deg) brightness(104%) contrast(101%);
    background: url('/wp-content/uploads/2026/05/container-back-11.svg');
}

#mattprime .global-grid-content-2,
#mattprime .global-grid-content-3,
#mattprime .global-grid-content-4 {
    min-height: 388px;
}

#mattprime .global-grid-content-2 {
    grid-column: 5 / 9;
    grid-row: 1 / 3;
}

#mattprime .global-grid-content-2::after {
    filter: brightness(0) saturate(100%) invert(57%) sepia(24%) saturate(5103%) hue-rotate(60deg) brightness(94%) contrast(80%);
    background: url('/wp-content/uploads/2026/05/container-back-11.svg');
}

#mattprime .global-grid-content-3 {
    grid-column: 5 / 7;
    grid-row: 3 / 5;
}

#mattprime .global-grid-content-3::after {
    filter: brightness(0) saturate(100%) invert(26%) sepia(88%) saturate(1763%) hue-rotate(341deg) brightness(70%) contrast(112%);
    background: url('/wp-content/uploads/2026/05/container-back-12.svg');
}

#mattprime .global-grid-content-4 {
    grid-column: 7 / 9;
    grid-row: 3 / 5;
}

#mattprime .global-grid-content-4::after {
    filter: brightness(0) saturate(100%) invert(40%) sepia(100%) saturate(4742%) hue-rotate(141deg) brightness(102%) contrast(82%);
    background: url('/wp-content/uploads/2026/05/container-back-12.svg');
}

#mattprime .global-grid-content::after {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

@media screen and (max-width: 1400px) {
    #mattprime .global-grid {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    #mattprime .elementor-widget-text-editor p {
        margin-bottom: 0;
    }

    #mattprime .global-grid-content::after {
        height: 178px;
        transform: translateY(0);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        filter: none;
    }
    
    #mattprime .global-grid-content-1::after {
        background-image: url('/wp-content/uploads/2026/06/global-grid-content-1.svg');
    }

    #mattprime .global-grid-content-2::after {
        background-image: url('/wp-content/uploads/2026/06/global-grid-content-2.svg');
    }

    #mattprime .global-grid-content-3::after {
        background-image: url('/wp-content/uploads/2026/06/global-grid-content-3.svg');
    }

    #mattprime .global-grid-content-4::after {
        background-image: url('/wp-content/uploads/2026/06/global-grid-content-4.svg');
    }
    
    #mattprime .global-grid-content {
        flex-wrap: nowrap;
        min-height: 360px;
        flex-basis: 49%;
    }
}

@media screen and (max-width: 768px) {
    #mattprime .global-grid {
        flex-direction: column;
    }
    #mattprime .global-grid-content {
        flex-basis: 100%;
        gap: 8px;
    }
}

/* Custom Cars Recent Search */
.custom-cars-recent-search {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 10px;
    max-width: var(--global-low-width);
    margin-left: auto;
    margin-right: auto;
}

.custom-cars-recent-search a {
    border-radius: var(--border-radius-mid);
    background-color: var(--color-gray-lighter);
    padding: 8px 14px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-dark);
    transition: var(--transition-fast);
}

#mattprime .custom-cars-recent-search a:hover {
    text-decoration: underline;
}

/* Form */
#mattprime .form-checkbox p {
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    justify-content: flex-start;
    gap: 10px;
}

#mattprime .form-checkbox input {
    appearance: none;
    -webkit-appearance: none;
    font-size: 24px;
    padding: 3px;
    border: 1px solid var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    width: 22px;
    height: 22px;
}

#mattprime .form-checkbox input::before {
    content: "";
    width: 100%;
    height: 100%;
    clip-path: polygon(28% 38%, 41% 53%, 75% 24%, 86% 38%, 40% 78%, 15% 50%);
    transform: scale(0);
    background-color: var(--color-white);
}

#mattprime .form-checkbox input:checked {
    background-color: var(--color-main-dark);
    border: 1px solid var(--color-main-dark);
}

#mattprime .form-checkbox input:checked::before {
    transform: scale(1);
    display: block;
}

#mattprime .form-checkbox span {
    max-width: max-content;
}

#mattprime .form-checkbox label input {
    margin-left: 16px;
}

#mattprime .form-checkbox label span {
    display: none;
}

/* FAQ */
#mattprime .global-faq {
    max-width: var(--global-low-width);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

#mattprime .global-faq h3 {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main-dark);
    border-radius: var(--border-radius-min);
    border: 2px solid var(--color-gray-lighter);
    outline: none !important;
}

#mattprime .global-faq h3.ui-state-active {
    background-color: transparent;
    border-color: var(--color-main-dark);
}

#mattprime .global-faq .qodef-e-content {
    max-height: 0;
}

#mattprime .global-faq .ui-state-active ~ .qodef-e-content {
    max-height: max-content;
}

#mattprime .global-faq p {
    font-size: 18px;
    font-style: 400;
    color: var(--color-main-dark);
}

@media screen and (max-width: 1024px) {
    #mattprime .global-faq h3,
    #mattprime .global-faq p {
        font-size: 16px;
    }
}

/* Breadcrumb */
.item-breadcrumb {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.item-breadcrumb.item-breadcrumb-center {
    justify-content: center;
}

.item-breadcrumb-limit {
    max-width: var(--global-content-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--wp--style--root--padding-left);
    padding-right: var(--wp--style--root--padding-right);
}

.item-breadcrumb-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.item-breadcrumb-icon,
.item-breadcrumb img,
.item-breadcrumb a {
    margin-right: 8px;
}

.item-breadcrumb a {
    font-weight: 500;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-gray);
    text-decoration: none;
    white-space: nowrap;
}

/* Leading crumbs + separators keep their full size; only the last (current
   page) crumb shrinks and ellipsizes when it gets too long. In a flex row the
   item also needs min-width:0 so it can shrink below its content width. */
.item-breadcrumb > *:not(:last-child) {
    flex-shrink: 0;
}

.item-breadcrumb a:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 0;
}

#mattprime .item-breadcrumb-active {
    color: var(--color-main-dark);
}

.item-breadcrumb-white svg path {
    fill: var(--color-white);
}

#mattprime .item-breadcrumb.item-breadcrumb-white .item-breadcrumb-active {
    color: var(--color-white);
}

#mattprime .custom-breadcrumb-full {
    background-color: var(--color-gray-lighter);
    max-width: 100%;
    width: 100%;
    padding-top: 22px;
    padding-bottom: 22px;
}

@media screen and (max-width: 1024px) {
    #mattprime.cars .item-breadcrumb {
        justify-content: flex-start;
    }
}

@media screen and (max-width: 1400px) {
    #mattprime.car .item-breadcrumb {
        background-color: var(--color-gray-lightest);
        max-width: 100%;
        width: 100%;
        padding-top: 22px;
        padding-bottom: 22px;
        justify-content: center;
    }
}

#mattprime .custom-breadcrumb-full .item-breadcrumb {
    max-width: var(--global-content-width);
    width: 100%;
}

@media screen and (max-width: 991px) {
    .item-breadcrumb {
        justify-content: center;
    }
}

/* Vehicle Float */ 
.vehicle-float {
    position: relative;
    transition: transform .3s ease;
}

.vehicle-float-aside {
    position: relative;
    max-width: var(--vehicle-width);
    width: 100%;
    z-index: 2;
}

.vehicle-float-main {
    max-width: var(--vehicle-width);
    padding: 22px 28px;
    border-radius: var(--border-radius-mid);
    background-color: var(--color-white);
    border: 2px solid var(--color-gray-lighter);
}

.vehicle-float-main:not(:last-child) {
    margin-bottom: 16px;
}

.vehicle-float-main-active {
    position: fixed;
    top: calc(var(--menu-height-desktop) + 5px);
    width: calc(var(--vehicle-width) - 32px);
}

.vehicle-float-main-absolute {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.vehicle-float-options {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
}

.vehicle-float-options button {
    flex: 1 1 auto;
}

.vehicle-float-content > p {
    margin-top: 0;
    margin-bottom: 24px;
    font-size: 17px;
    font-weight: 700;
    color: var(--color-main-dark);
}

.vehicle-float-content:not(:last-child) {
    margin-bottom: 24px;
}

.vehicle-float-options button {
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    padding: 14px 20px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 16px;
    color: var(--color-main-gray);
    border: 2px solid transparent;
}

.vehicle-float-options button.vehicle-float-options-active  {
    border-color: var(--color-main-dark);
}

.vehicle-float-slide {
    padding-left: 12px;
    padding-right: 12px;
}

.vehicle-float-slide p {
    font-weight: 500;
    margin-top: 11px;
    margin-bottom: 0;
    color: var(--color-main-gray);
    font-size: 14px;
}

.vehicle-float-content-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.vehicle-float-content-top p {
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-dark);
    font-size: 17px;
}

.vehicle-float-content-top p:last-child {
    font-weight: 400;
}

.vehicle-float-price {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
}

.vehicle-float-price-text {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 8px;
}

.vehicle-float-price-text p {
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-gray);
    font-weight: 500;
}

#mattprime .vehicle-float-price-text-old {
    text-decoration: line-through;
}

#mattprime .vehicle-float-price-text-new {
    color: var(--color-main);
    font-weight: 700;
    font-size: 48px;
    line-height: 0.9;
}

#mattprime .swiper-vehicle-images .swiper-buttons {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    left: 0;
    right: 0;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
}

.vehicle-float-final-price {
    margin-top: 20px;
}

.vehicle-float-price-button p,
.vehicle-float-final-price p {
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-gray);
    font-size: 14px;
}

.vehicle-float-final-price p span {
    font-weight: 700;
    color: var(--color-main-dark);
}

.vehicle-float-content-offer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
}

.vehicle-float-content-offer-text {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

.vehicle-float-content-offer p {
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-dark);
    font-size: 18px;
}

.vehicle-float-content-offer-button img {
    transition: var(--transition-fast);
}

.vehicle-float-content-offer-open .vehicle-float-content-offer-button img {
    transform: rotate(180deg);
}

.vehicle-float-content-offer-more {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 24px;
}

.vehicle-float-content-offer-more > div {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
}

.vehicle-float-content-offer-more > div p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    font-weight: 500;
    color: var(--color-main-dark);
}

/* Vehicle - Main */
.vehicle-main {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 32px;
    margin-left: auto;
    margin-right: auto;
    max-width: var(--global-content-width);
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}

.vehicle-content {
    max-width: calc(100% - var(--vehicle-width));
}

.vehicle-content-top {
    margin-top: 26px;
    margin-bottom: 16px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.vehicle-content-title h1 {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 6px;
}

.vehicle-content-title p,
.vehicle-content-share p {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 16px;
    color: var(--color-main-gray);
}

.vehicle-content-share-view,
.vehicle-content-share-compare,
.vehicle-content-share-heart {
    background-color: var(--color-gray-lighter);
    padding: 14px;
    border-radius: var(--border-radius-low);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: max-content;
    position: relative;
    border: 2px solid transparent;
}

.vehicle-content-share-compare:hover,
.vehicle-content-share-heart:hover {
    border-color: var(--color-main-gray);
}

.vehicle-content-share-compare.vehicle-content-share-compare-active {
    border-color: var(--color-main);
}

/* Favorites — heart toggle */
.custom-car-top-icon-heart,
.vehicle-content-share-heart {
    cursor: pointer;
}

[data-favorite-id].is-favorite svg path {
    fill: var(--color-red);
}

.vehicle-content-share-heart.is-favorite {
    border-color: var(--color-red);
}

[data-favorite-id].is-loading {
    opacity: 0.5;
    pointer-events: none;
}

@media screen and (max-width: 1400px) {
    .vehicle-content-share-view {
        display: none;
    }
}

.compare-tray {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 21;
    transition: bottom .32s ease;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 13px 20px;
    border-radius: var(--border-radius-high);
    background-color: var(--color-yellow);
    color: var(--color-main);
    font-weight: 500;
    text-decoration: none;
    font-size: 16px;
    box-shadow: 0 6px 20px #00000033;
}

.compare-tray-link {
    display: flex;
    align-items: center;
    gap: 6px;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.compare-tray-trash {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 6px;
    margin: 0;
    border: 0;
    border-left: 1px solid var(--color-main-dark);
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
}

.compare-tray-opacity {
    z-index: 0;
}


.vehicle-content-share {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 13px;
}

.vehicle-content-share p {
    font-size: 14px;
}

.vehicle-content-image {
    overflow: hidden;
    border-radius: var(--border-radius-mid);
    padding: 30px;
    background-color: var(--color-gray-lighter);
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.vehicle-content-image::before {
    content: "";
    position: absolute;
    z-index: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: auto;
    background: url('/wp-content/uploads/2026/05/container-back-13.svg');
    background-repeat: no-repeat;
    height: 307px;
    background-size: cover;
}

.vehicle-content-image-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    position: relative;
}

.vehicle-content-image-top-exterior {
    background-color: var(--color-white);
}

.vehicle-content-image-top-back {
    border-radius: var(--border-radius-min);
    height: 100px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.vehicle-content-image-top-back img {
    object-fit: cover;
    border-radius: var(--border-radius-min);
    height: auto;
    object-position: center;
    aspect-ratio: 16 / 9;
}

.vehicle-content-mobile-info,
.vehicle-content-image-top-info {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.vehicle-content-mobile-info p,
.vehicle-content-image-top-info p {
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 8px 14px;
    border-radius: var(--border-radius-normal);
    font-weight: 700;
}

.vehicle-content-image-top-info-main {
    background-color: var(--color-main);
    color: var(--color-white);
}

.vehicle-content-image-top-info-yellow {
    background-color: var(--color-yellow);
    color: var(--color-white);
}

.vehicle-content-image-top-info-gray {
    background-color: var(--color-main-gray);
    color: var(--color-white);
}

.vehicle-content-image-middle iframe {
    position: relative;
    z-index: 1;
    border: 0;
    width: 100%;
    aspect-ratio: 16 / 10;
}

.vehicle-content-image-middle .slide-vehicle-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.vehicle-content-image-middle .slide-vehicle-image img {
    width: 100%;
    max-width: max-content;
    object-fit: contain;
    margin-left: auto;
    margin-right: auto;
    height: 503px;
}

.vehicle-content-image-interior {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    max-width: max-content;
    object-fit: contain;
    margin-left: auto;
    margin-right: auto;
    height: 510px;
    padding-bottom: 4px;
    border-radius: var(--border-radius-min);
}

.vehicle-content-image-bottom {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    position: relative;
    margin-top: 10px;
}

.vehicle-content-image-bottom-data {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 30px;
}

.vehicle-content-image-bottom-info p:first-child {
    margin-top: 0;
    margin-bottom: 5px;
    font-weight: 700;
    font-size: 20px;
    color: var(--color-main-dark);
}

.vehicle-content-image-bottom-info p:last-child {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 16px;
    color: var(--color-main-gray);
}

.vehicle-content-image-top-rotation,
.vehicle-content-image-bottom-rotation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
    width: 59px;
    height: 59px;
    cursor: pointer;
}

.vehicle-content-image-top-rotation {
    background-color: var(--color-white);
}

.vehicle-content-image:not(.vehicle-content-image-active) {
    background-image: none !important;
}

.vehicle-content-image::before,
.vehicle-content-image .vehicle-content-image-top-info,
.vehicle-content-image .vehicle-content-image-top-rotation,
.vehicle-content-image .vehicle-content-mobile-info,
.vehicle-content-image .vehicle-content-image-middle,
.vehicle-content-image .vehicle-content-image-bottom {
    opacity: 1;
    transition: var(--transition-normal);
}

.vehicle-content-image.vehicle-content-image-active::before,
.vehicle-content-image-active .vehicle-content-image-top-info,
.vehicle-content-image-active .vehicle-content-mobile-info,
.vehicle-content-image-active .vehicle-content-image-top-rotation,
.vehicle-content-image-active .vehicle-content-image-middle,
.vehicle-content-image-active .vehicle-content-image-bottom {
    opacity: 0;
    background-image: none;
}

.vehicle-content-warning {
    margin-top: 20px;
}

.vehicle-content-warning p {
    font-size: 16px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 6px;
    color: var(--color-main-gray);
}

.vehicle-content-description {
    margin-top: 120px;
}

.vehicle-content-description h2,
.vehicle-equipment-main h2 {
    font-size: 26px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 14px;
    color: var(--color-main-dark);
}

.vehicle-content-description p {
    font-size: 18px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-dark);
}

.vehicle-float-price-button{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
}

.vehicle-equipment-main {
    display: grid;
    align-items: center;
    justify-content: center;
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 16px;
}

.vehicle-equipment-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 28px;
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
    padding: 22px 16px;
}

.vehicle-equipment-item p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-dark);
}

.vehicle-equipment-main ~ .custom-button {
    margin-top: 32px;
    margin-left: auto;
    margin-right: auto;
    width: max-content;
}

/* Single vehicle (mobile) — "Διαμόρφωση μισθώματος" bottom-sheet popup.
   A standalone overlay (appended to <body>, so it naturally covers the menu and
   isn't trapped by .vehicle-main's stacking context) holding a clone of the
   price panel, kept in sync with the in-flow panel. The in-flow section never
   moves when this opens. Hidden via .d-none until opened. */
.vehicle-config-popup {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-color: rgba(34, 33, 96, 0);
    transition: background-color .32s ease;
}

.vehicle-config-popup.vehicle-config-popup-show {
    background-color: rgba(34, 33, 96, 0.45);
}

.vehicle-config-popup-sheet {
    width: 100%;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 24px 20px 32px;
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid) var(--border-radius-mid) 0 0;
    transform: translateY(100%);
    transition: transform .32s ease;
}

.vehicle-config-popup-show .vehicle-config-popup-sheet {
    transform: translateY(0);
}

/* The sheet is the card now, so flatten the cloned panel's own box. */
.vehicle-config-popup-sheet .vehicle-float-main {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: none;
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
}

.vehicle-config-popup-sheet .vehicle-float-content:not(:last-child) {
    margin-bottom: 0;
}

/* The header stays put at the top of the sheet; only the body below it scrolls. */
.vehicle-config-popup-sheet .vehicle-float-config-head {
    display: flex;
    flex-shrink: 0;
}

/* Scrollable body — this is the only part that scrolls. */
.vehicle-config-popup-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 20px;
}

/* Order inside the scrollable body: monthly price → sliders → retail. */
.vehicle-config-popup-sheet .vehicle-float-content:has(.vehicle-float-price) { order: 1; }
.vehicle-config-popup-sheet .vehicle-float-config { order: 2; }
.vehicle-config-popup-sheet .vehicle-float-final-price { order: 3; }
/* CTA pinned to the bottom of the sheet — always visible while the body scrolls. */
.vehicle-config-popup-sheet > .vehicle-float-button {
    flex-shrink: 0;
    margin-top: 16px;
}

/* Offer popup reuses the bottom-sheet styling; the moved content already sits
   under the popup header, so drop its dropdown top-margin. */
.vehicle-offer-popup .vehicle-float-content-offer-more {
    margin-top: 0;
}

/* Full-equipment popup (single vehicle). Hidden via .d-none until opened. */
.vehicle-equipment-popup {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background-color: rgba(48, 48, 48, 0.5);
}

.vehicle-equipment-popup-inner {
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid);
    padding: 34px;
    width: 100%;
    max-width: 820px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    top: 20px;
}

.vehicle-equipment-popup-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    margin-bottom: 24px;
}

.vehicle-equipment-popup-head h2 {
    margin: 0;
}

.vehicle-equipment-popup-close {
    border: none;
    background: transparent;
    color: var(--color-main);
    cursor: pointer;
    line-height: 0;
    padding: 4px;
}

.vehicle-equipment-popup .vehicle-equipment-main {
    grid-auto-rows: auto;
    grid-template-columns: repeat(1, 1fr);
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.vehicle-equipment-popup .vehicle-equipment-main .vehicle-equipment-item {
    border: 2px solid var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
}

.vehicle-equipment-popup .vehicle-equipment-main .vehicle-equipment-item:nth-child(2n) {
    background-color: var(--color-white);
}

.vehicle-equipment-popup .vehicle-equipment-main .vehicle-equipment-item:nth-child(2n+1) {
    background-color: var(--color-gray-lighter);
}

/* Single vehicle — "Εκδήλωση ενδιαφέροντος" interest popup. Same overlay
   mechanics as the "Διαμόρφωση μισθώματος" popup (navy backdrop, .d-none until
   opened, .vehicle-config-popup-show toggles visibility, bindBottomSheet drives
   it). The sheet slides up from the bottom on open. Wide centered modal on
   desktop; full bottom-sheet (title bar + pinned CTA) on mobile. */
.vehicle-interest-popup {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: rgba(34, 33, 96, 0);
    transition: background-color .34s ease;
}

.vehicle-interest-popup.vehicle-config-popup-show {
    background-color: rgba(34, 33, 96, 0.45);
}

.vehicle-interest-popup-sheet {
    position: relative;
    width: 100%;
    max-width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    align-self: flex-end;
    overflow: hidden;
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid);
    /* Slide up from the bottom. */
    opacity: 0;
    transform: translateY(100%);
    transition: transform .34s cubic-bezier(.16, 1, .3, 1), opacity .34s ease;
}

.vehicle-config-popup-show .vehicle-interest-popup-sheet {
    opacity: 1;
    transform: translateY(0);
}

/* The body is the scroller (the sheet doesn't scroll) so the corner close stays
   pinned. The content itself is kept to a centred column inside the wide sheet. */
.vehicle-interest-popup-inner {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    overflow-y: auto;
    padding-top: 40px;
    padding-bottom: 40px;
}

.vehicle-interest-popup-head,
.vehicle-interest-popup-body {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.vehicle-interest-popup-close {
    display: flex;
    padding: 4px;
    border: 0;
    background: none;
    color: var(--color-main);
    cursor: pointer;
    line-height: 0;
}

.vehicle-interest-popup-close--corner {
    position: absolute;
    top: 28px;
    right: 32px;
    z-index: 2;
}

/* Title bar — mobile only. */
.vehicle-interest-popup-bar {
    display: none;
}

.vehicle-interest-popup-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding-bottom: 28px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--color-gray-light);
}

.vehicle-interest-popup-pre {
    font-size: 26px;
    color: var(--color-main);
    font-weight: 500;
    margin: 0 0 4px;
}

.vehicle-interest-popup-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-main);
    margin: 0 0 6px;
}

.vehicle-interest-popup-variant {
    font-size: 16px;
    color: var(--color-main-gray);
    font-weight: 500;
    margin: 0;
}

.vehicle-interest-popup-head-price {
    text-align: right;
}

.vehicle-interest-popup-price {
    margin: 0 0 10px;
}

.vehicle-interest-popup-price-value {
    font-size: 40px;
    font-weight: 700;
    color: var(--color-main);
}

.vehicle-interest-popup-price-note {
    font-size: 14px;
    color: var(--color-main-gray);
    font-weight: 500;
}

.vehicle-interest-popup-terms {
    display: inline-block;
    background-color: var(--color-gray-lighter);
    color: var(--color-main-gray);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: var(--border-radius-low);
    margin: 0;
}

.vehicle-interest-popup-note {
    color: var(--color-main-gray);
    font-size: 14px;
}

/* Mobile — full bottom-sheet with a fixed title bar, a scrolling body and the
   "Αποστολή" button pinned to the bottom (image 2). */
@media screen and (max-width: 1400px) {
    .vehicle-interest-popup-head,
    .vehicle-interest-popup-body {
        max-width: 100%;
    }

    .vehicle-interest-popup {
        align-items: flex-end;
        padding: 0;
    }

    .vehicle-interest-popup-sheet {
        max-width: none;
        max-height: 92vh;
        padding: 0;
        overflow: hidden;
        border-radius: var(--border-radius-mid) var(--border-radius-mid) 0 0;
    }

    .vehicle-interest-popup-close--corner {
        display: none;
    }

    .vehicle-interest-popup-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-shrink: 0;
        border-bottom: 2px solid var(--color-gray-lighter);
    }

    .vehicle-interest-popup-head,
    .vehicle-interest-popup-body .custom-form-top,
    .vehicle-interest-popup-bar {
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
    }

    .vehicle-interest-popup-bar p {
        margin: 0;
        font-size: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
        font-weight: 700;
        color: var(--color-main-dark);
    }

    .vehicle-interest-popup-inner {
        flex: 1 1 auto;
        min-height: 0;
        max-width: none;
        overflow-y: auto;
        padding-bottom: 0;
        overflow-x: hidden;
    }

    .vehicle-interest-popup-head {
        flex-direction: column;
        gap: 10px;
        padding-bottom: 22px;
        margin-bottom: 26px;
        flex-wrap: wrap;
    }

    .vehicle-interest-popup-pre {
        display: none;
    }

    .vehicle-interest-popup-head-price {
        text-align: left;
    }

    .vehicle-interest-popup-inner .custom-form-input:last-child {
        padding-bottom: 30px;
    }

    /* Pin the action row to the bottom as a white footer (image 2). We stick
       .custom-form-bottom — a direct child of the tall CF7 <form> — so it stays
       pinned across the whole scroll (a sticky element can't escape its parent's
       box, so sticking the short submit alone would not work). It stays inside
       the form, so it still submits, and holds both the terms checkbox and the
       full-width button. */
    #mattprime .vehicle-interest-popup .custom-form-bottom {
        position: sticky;
        bottom: 0;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
        background-color: var(--color-white);
        box-shadow: 0 -10px 20px rgba(34, 33, 96, 0.08);
        width: 100vw;
        margin-left: - var(--wp--style--root--padding-left);
    }

    #mattprime .vehicle-interest-popup .custom-form-bottom-contact {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        margin-top: 0;
    }

    #mattprime .vehicle-interest-popup .custom-form-submit {
        width: 100%;
    }
}


.vehicle-content-features {
    margin-top: 160px;
    margin-bottom: 160px;
}

.vehicle-content-features h2 {
    font-size: 32px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 16px;
    color: var(--color-main-dark);
    text-align: center;
}

.vehicle-content-reviews {
    margin-top: 160px;
}

.vehicle-content-reviews h2 {
    position: relative;
    top: 64px;
    font-size: 44px;
    margin-right: 120px;
    color: var(--color-main-dark);
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
}

/* Single vehicle — specs/equipment tabs + configure-lease button + sticky CTA bar (shown only ≤1400px) */
.vehicle-content-tabs,
.vehicle-float-config-button,
.vehicle-float-cta-bar {
    display: none;
}

.vehicle-content-tabs .vehicle-equipment-item {
    width: 100%;
}

.vehicle-content-tabs .vehicle-equipment-item p {
    font-weight: 400;
}

.vehicle-content-tabs-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.vehicle-content-tab {
    font-size: 16px;
    font-weight: 700;
    padding: 8px 24px;
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-gray-lighter);
    background-color: var(--color-gray-lighter);
    color: var(--color-main-dark);
    cursor: pointer;
}

.vehicle-content-tab-active {
    background-color: var(--color-main-dark);
    border-color: var(--color-main-dark);
    color: var(--color-white);
}

.vehicle-content-tab-panel table {
    width: 100%;
    border-collapse: separate;
    -webkit-border-horizontal-spacing: 0px;
    -webkit-border-vertical-spacing: 10px;
}

.vehicle-content-tab-panel tr {
    margin-bottom: 10px;
}

.vehicle-content-tab-panel td {
    padding: 22px 16px;
    font-size: 16px;
    color: var(--color-main-dark);
    font-weight: 400;
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
}

.vehicle-content-tab-panel td:last-child {
    text-align: right;
    font-weight: 700;
}

.vehicle-content-tab-panel .custom-button {
    max-width: 600px;
    width: 100%;
}

.vehicle-float-config-head {
    display: none;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.vehicle-float-config-head p {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-main-dark);
}

.vehicle-float-config-close {
    display: flex;
    padding: 4px;
    border: 0;
    background: none;
    color: var(--color-main-dark);
    cursor: pointer;
}

@media screen and (min-width: 1400px) {
    .vehicle-content-images .swiper-pagination,
    .vehicle-content-image-top-rotation,
    .vehicle-content-mobile-info {
        display: none;
    }
}

@media screen and (max-width: 1400px) {
    .vehicle-main {
        flex-direction: column;
        padding-left: 0;
        padding-right: 0;
        margin-top: 0;
    }

    .vehicle-content-image::before {
        background-image: url('/wp-content/uploads/2026/06/container-back-24.svg');
        height: 265px;
    }

    .vehicle-content-image .vehicle-content-image-top-info {
        flex-wrap: wrap;
    }

    .vehicle-content-image-top-back {
        max-height: 72px;
        height: auto;
        width: auto;
        aspect-ratio: 16 / 9;
    }

    .vehicle-content-image-top-back img {
        height: auto;
        width: 100%;
    }

    .vehicle-content-tabs,
    .vehicle-float-aside .vehicle-float-main[data-identities],
    .vehicle-content-reviews,
    .vehicle-content-offers,
    .vehicle-content-features,
    .vehicle-content-equipment,
    .vehicle-content-description,
    .vehicle-content-warning,
    .vehicle-content-mobile-info,
    .vehicle-content-top {
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
    }

    .vehicle-float-main-offer {
        margin-right: var(--wp--style--root--padding-right);
        margin-left: var(--wp--style--root--padding-left);
        background-color: var(--color-gray-lighter);
    }

    .vehicle-content-description {
        margin-top: 90px;
        margin-bottom: 90px;
    }

    /* Flatten the two columns into one flex flow so the aside (offer + price
       panel) can be interleaved between .vehicle-content's sections via order. */
    .vehicle-content,
    .vehicle-float-aside,
    .vehicle-float {
        display: contents;
    }

    .vehicle-float-main {
        width: auto;
        max-width: 100%;
        border: none;
    }

    .vehicle-content-image-bottom-rotation,
    .vehicle-content-image-top-info,
    .vehicle-config-popup-sheet .vehicle-float-final-price {
        display: none;
    }

    /* Single-column order — matches the mobile mockup */
    .vehicle-content-image { 
        order: 1;
        border-radius: 0;
        margin-top: 0;
    }

    .vehicle-content-mobile-info {
        order: 2;
        z-index: 1;
        background-color: var(--color-white);
        border-top-left-radius: var(--border-radius-normal);
        border-top-right-radius: var(--border-radius-normal);
        margin-top: 0;
        margin-bottom: -60px;
        position: relative;
        top: -55px;
        padding-top: 35px;
        justify-content: flex-start;
    }

    .vehicle-content-top { 
        order: 3;
        margin-top: 0;
    }

    .vehicle-equipment-popup-inner {
        padding: 20px;
    }

    .vehicle-equipment-popup-inner .vehicle-equipment-item {
        gap: 12px;
    }

    .vehicle-equipment-popup-inner .vehicle-equipment-item p {
        font-size: 15px;
    }

    .vehicle-float-aside .vehicle-float-main-offer { 
        order: 4;
    }

    .vehicle-float-aside .vehicle-float-main[data-identities] {
        order: 5;
    }
    
    .vehicle-content-description { 
        order: 6;
    }

    .vehicle-content-tabs { 
        display: block;
        order: 6;
    }

    .vehicle-content-features { 
        order: 7;
    }

    .vehicle-content-offers { 
        order: 8;
    }

    .vehicle-content-reviews { 
        order: 9;

    }

    .vehicle-content-image-middle .slide-vehicle-image img,
    .vehicle-content-image-middle iframe {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .vehicle-content-reviews h2 { 
        font-size: 26px;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 90px;
        max-width: 100%;
    }

    .vehicle-content-images .swiper-buttons {
        display: none;
    }

    .vehicle-content-images .swiper-pagination {
        bottom: -5px !important;
    }

    .vehicle-content-image-bottom {
        margin-top: 0;
        justify-content: flex-end;
    }

    .vehicle-content-image-bottom-data,
    .vehicle-content-warning,
    .vehicle-content-equipment {
        display: none;
    }

    .vehicle-content-tabs .vehicle-equipment-main {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        padding-top: 9px;
        gap: 10px;
        grid-auto-rows: auto;
    }

    /* Price panel order: price → retail → configure button → (sliders) → CTA */
    .vehicle-float-aside .vehicle-float-main[data-identities] {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .vehicle-float-aside .vehicle-float-main[data-identities] > .vehicle-float-content:has(.vehicle-float-price) {
        order: 1;
    }

    .vehicle-float-content-offer .vehicle-float-content-offer-text {
        justify-content: center;
    }

    .vehicle-float-content-offer .vehicle-float-content-offer-text img {
        filter: brightness(0) saturate(100%) invert(62%) sepia(8%) saturate(794%) hue-rotate(201deg) brightness(91%) contrast(96%);
    }

    .vehicle-float-content-offer .vehicle-float-content-offer-text p {
        color: var(--color-main-gray);
        font-size: 16px;
    }

    .vehicle-float-content-offer .vehicle-float-content-offer-button {
        display: none;
    }

    .vehicle-float-aside .vehicle-float-final-price { 
        order: 2; 
        text-align: left;
        margin-top: -10px;
        margin-bottom: 30px;
    }

    .vehicle-float-aside .vehicle-float-final-price p:not(:last-child) { 
        margin-bottom: 8px;
    }

    .vehicle-float-aside .vehicle-float-config-button { display: block; order: 3; }
    .vehicle-float-aside .vehicle-float-config { order: 4; display: none; }
    .vehicle-float-aside .vehicle-float-button { order: 5; }

    /* Sticky bottom "Εκδήλωση ενδιαφέροντος" CTA — shown once the in-flow CTA
       scrolls off-screen (and hidden again near the footer), sliding up from the bottom. */
    .vehicle-float-cta-bar {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        bottom: -1px;
        z-index: 20;
        padding: 12px var(--wp--style--root--padding-right) 12px var(--wp--style--root--padding-left);
        background-color: var(--color-white);
        box-shadow: 0 -6px 20px rgba(34, 33, 96, 0.12);
        transform: translateY(100%);
        transition: transform .32s ease;
    }

    .vehicle-float-cta-bar.vehicle-float-cta-bar-show {
        transform: translateY(0);
    }

    /* Lift the compare float button above the CTA bar while it is showing */
    body:has(.vehicle-float-cta-bar-show) .compare-tray {
        bottom: 88px;
    }

    .vehicle-float-cta-bar .custom-button {
        width: 100%;
        margin: 0;
    }

    .vehicle-float-cta-bar .wp-block-button__link {
        width: 100%;
    }

    /* The price panel sits in normal flow on mobile — don't let the scroll JS pin it */
    .vehicle-float-aside .vehicle-float-main-active,
    .vehicle-float-aside .vehicle-float-main-absolute {
        position: static !important;
        top: auto !important;
        bottom: auto !important;
        width: 100% !important;
    }

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

@media screen and (max-width: 991px) {
    .vehicle-content-features h2,
    .elementor h2.elementor-heading-title {
        font-size: 26px;
        text-align: center;
    }
}

@media screen and (max-width: 768px) {
    .global-icons-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* Button Switch */
.button-switch input {
    display:none;
}

.button-switch {
    position: relative;
    width: 54px;
    height: 30px;
    display: inline-block;
}

.button-switch-slider {
    position: absolute;
    inset: 0;
    cursor: pointer;
    background-color: var(--color-white);
    border: 2px solid var(--color-main);
    border-radius: var(--border-radius-mid);
    transition: var(--transition-fast);
}

.button-switch-slider::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    left: 3px;
    top: 3px;
    background-color: var(--color-main);
    border-radius: 50%;
    transition: var(--transition-fast);
}

.button-switch input:checked + .button-switch-slider {
    background-color: var(--color-main);
}

.button-switch input:checked + .button-switch-slider::before {
    transform: translateX(24px);
    background-color: var(--color-white);
}


/* Vehicles */
.vehicles-main {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 32px;
    margin-left: auto;
    margin-right: auto;
    max-width: var(--global-content-width);
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
    margin-top: 80px;
    padding-top: 10px;
}

.vehicles-title {
    margin-top: 16px;
    margin-bottom: 64px;
}

.vehicles-title h1 {
    font-size: 26px;
    font-weight: 500;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 0;
}

.vehicles-title p {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 0;
}

.vehicles-title p.vehicles-title-results {
    font-weight: 500;
    font-size: 14px;
    margin-top: 16px;
    margin-bottom: 12px;
}

.vehicles-categories {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 11px;
    margin-bottom: 40px;
}

.vehicles-categories-image {
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    border-radius: var(--border-radius-low);
}

.vehicles-categories-image img {
    z-index: 1;
    position: relative;
}

.vehicles-categories-image::before {
    content: "";
    background: url('/wp-content/uploads/2026/05/container-back-14.svg');
    opacity: 1;
    background-repeat: no-repeat;
    background-position: center;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    z-index: 0;
    top: 0;
    transition: var(--transition-fast);
    background-size: contain;
    border-radius: var(--border-radius-low);
    overflow: hidden;
}

.vehicles-categories-check {
    position: absolute;
    bottom: -15px;
    right: -10px;
    width: 32px;
    height: 32px;
    border: 2px solid var(--color-main-dark);
    border-radius: var(--border-radius-min);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-white);
    opacity: 0;
}

.vehicles-categories-check.vehicles-categories-check-active {
    opacity: 1;
}

.vehicles-categories-check img {
    margin-left: auto;
    margin-right: auto;
    height: auto;
    object-fit: contain;
}

.vehicles-categories-label {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    text-align: center;
    font-weight: 400;
}

.vehicles-categories-item-active .vehicles-categories-label {
    font-weight: 700;
}

.vehicles-filters-options {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 31px;
}

.vehicles-filters-active {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    overflow-x: hidden;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.vehicles-filters-active-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-mid);
    cursor: pointer;
    transition: var(--transition-fast);
}

.vehicles-filters-active-item:hover {
    background-color: var(--color-yellow);
}

.vehicles-filters-active-item p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
    color: var(--color-main-dark);
    font-weight: 400;
}

.vehicles-filters-active-item svg {
    margin: 8px;
}

.vehicles-filters-sorting {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    max-width: 260px;
    width: 100%;
}

.vehicles-filters-sorting-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    gap: 8px;
}

.vehicles-filters-sorting-item-select {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    background-color: transparent;
    border-radius: var(--border-radius-low);
    border: 2px solid var(--color-main-dark);
}

.vehicles-filters-sorting-item-select select {
    background-color: transparent;
    border: none;
    padding-top: 16px;
    padding-bottom: 16px;
    width: 100%;
    outline: none;
    font-size: 18px;
    font-weight: 500;
    color: var(--color-main-dark);
}

.vehicles-grid {
    display: grid;
    align-items: flex-start;
    justify-content: flex-start;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 16px;
    column-gap: 40px;
    align-content: flex-start;
}

.vehicles-grid.vehicles-loading > div {
    filter: grayscale(1) blur(3px);
}

.vehicles-grid > div {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-direction: column;
    height: 100%;
    transition: var(--transition-fast);
}

@media screen and (max-width: 1024px) {
    .vehicles-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 768px) {
    .vehicles-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* Filters */
.filter-select-menu::-webkit-scrollbar,
.filter-sidebar::-webkit-scrollbar,
.filter-form::-webkit-scrollbar {
        width: 4px;
    }

.filter-select-menu::-webkit-scrollbar-track,
.filter-sidebar::-webkit-scrollbar-track,
.filter-form::-webkit-scrollbar-track {
        background: transparent;
    }

.filter-select-menu::-webkit-scrollbar-thumb,
.filter-sidebar::-webkit-scrollbar-thumb,
.filter-form::-webkit-scrollbar-thumb {
    background-color: var(--color-gray-lighter);
    border-radius: 4px;
}

.filter-select-menu::-webkit-scrollbar-thumb:hover,
.filter-sidebar::-webkit-scrollbar-thumb:hover,
.filter-form::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-main-gray);
}

.filter-select-menu,
.filter-sidebar,
.filter-form {
    scrollbar-width: thin;
    scrollbar-color: var(--color-gray-lighter) transparent;
}

.filter-form {
    display: flex;
    flex-direction: column;
    padding-bottom: 30px;
}

.filter-select-menu,
.filter-sidebar,
.filter-form {
    overflow-y: auto;
    overflow-x: hidden;
}

.filter-select-menu,
.filter-form {
    padding-right: 15px;
    padding-left: 15px;
}

.filter-select-menu,
.filter-sidebar {
    width: 100%;
    background-color: var(--color-white);
    max-width: var(--filter-sidebar);
    height: auto;
    max-height: calc(100vh - var(--top-height-responsive) - var(--menu-height-desktop));
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 15px;
    padding-left: 15px;
}

.filter-sidebar {
    top: calc(var(--menu-height-desktop) + var(--top-height-responsive));
    display: flex;
    flex-direction: column;
    position: sticky;
    order: 0;
}

.filter-select-menu {
    top: 0;
    transform: translateX(100%);
    transition: var(--transition-normal);
    z-index: -1;
    position: absolute;
    opacity: 0;
}

.filter-sidebar-inactive {
    overflow-y: hidden;
}

/* Filters - Header */
.filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.filter-header-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 0;
}

.filter-header-reset {
    display: flex;
    align-items: center;
    gap: 6px;
    background-color: var(--color-gray-lighter);
    border: none;
    border-radius: var(--border-radius-low);
    padding: 7px 12px;
    font-size: 13px;
    color: var(--color-gray);
    cursor: pointer;
    transition: var(--transition-fast);
}

.filter-header-reset:hover {
    background-color: var(--color-gray-light);
    color: var(--color-main);
}

/* Filters - Section */
.filter-section {
    padding-top: 2px;
    padding-bottom: 2px;
}

.filter-section:not(:last-child) {
    margin-bottom: 40px;
}

.filter-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
}

.filter-section-label {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main-dark);
}

.filter-section-arrow {
    color: var(--color-main-dark);
    transition: var(--transition-fast);
    flex-shrink: 0;
    width: 19px;
    height: auto;
}

.filter-section.filter-section-open .filter-section-arrow {
    transform: rotate(180deg);
}

.filter-section-body {
    display: none;
    margin-top: 14px;
}

.filter-section.filter-section-open .filter-section-body {
    display: block;
}

/* Filters - Toggle Buttons */
.filter-toggle-buttons,
.filter-toggle-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    padding: 6px;
    border-radius: var(--border-radius-low);
}

.filter-toggle-buttons {
    flex-wrap: wrap;
}


.filter-toggle-group {
    background-color: var(--color-gray-lighter);
}

.filter-toggle-group-button,
.filter-toggle-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    padding: 14px 18px;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-gray);
    cursor: pointer;
    transition: var(--transition-fast);
    width: 100%;
    text-decoration: none;
}

.filter-toggle-button {
    flex: 1 1 0px;
    width: 100%;
}

.filter-toggle-group-button {
    border: none;
    text-align: center;
}

.filter-toggle-group .filter-toggle-group-button {
    width: 100%;
}

.filter-toggle-button {
    border: 2px solid transparent;
    justify-content: space-between;
}

.filter-toggle-button.filter-toggle-button-active {
    border-color: var(--color-main);
}

.filter-toggle-group-button:hover,
.filter-toggle-group-button-active {
    background-color: var(--color-main);
    color: var(--color-white);
}

.filter-toggle-button.filter-toggle-button-active .filter-toggle-count {
    color: var(--color-main-gray);
}

.filter-toggle-count {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-main-gray);
}

/* Filters - Checkboxes */
.filter-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.filter-checkbox-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.filter-checkbox-input {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid var(--color-gray-light);
    border-radius: var(--border-radius-low);
    background-color: var(--color-gray-lighter);
    cursor: pointer;
    flex-shrink: 0;
    transition: var(--transition-fast);
    position: relative;
}

.filter-checkbox-input:checked {
    background-color: var(--color-main-dark);
    border-color: var(--color-main-dark);
}

.filter-checkbox-input:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 3px;
    height: 7px;
    border: 2px solid var(--color-white);
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}

.filter-checkbox-label {
    font-size: 16px;
    color: var(--color-main-gray);
    cursor: pointer;
    font-weight: 500;
}

/* Filters - Range Dual */
.filter-range-inputs {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    margin-top: 12px;
}

.filter-range-input-group {
    display: flex;
    align-items: center;
    gap: 0;
    flex: 1;
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    padding: 12px 18px;
}

.filter-range-input-label {
    font-size: 14px;
    color: var(--color-main-gray);
    flex-shrink: 0;
    font-weight: 500;
}

.filter-range-input {
    text-align: right;
    border: none;
    background-color: transparent;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-main-gray);
    outline: none;
    appearance: textfield;
    -moz-appearance: textfield;
}

.filter-range-input::-webkit-outer-spin-button,
.filter-range-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.filter-range-unit {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-main-gray);
    white-space: nowrap;
}

/* Filters - Histogram */
.filter-histogram {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 90px;
    margin-bottom: 10px;
}

.filter-histogram-bar {
    flex: 1;
    background-color: var(--color-gray-light);
    border-radius: 2px 2px 0 0;
    transition: var(--transition-fast);
}

.filter-histogram-bar.filter-toggle-button-active {
    background-color: var(--color-main);
}

/* Filters - Range Sliders */
.filter-range-slider-wrap {
    position: relative;
    height: 20px;
}

.filter-range-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 3px;
    background-color: var(--color-gray-light);
    border-radius: 2px;
    outline: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.filter-range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--color-main-dark);
    cursor: pointer;
    pointer-events: all;
    border: 2px solid var(--color-white);
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    transition: var(--transition-fast);
}

.filter-range-slider::-webkit-slider-thumb:hover {
    background-color: var(--color-main);
    transform: scale(1.1);
}

/* Filters - Range Labels */
.filter-range-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.filter-range-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-main-gray);
}

/* Filters - Selects */
.filter-select-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 10px;
}

.filter-select-option {
    background-color: var(--color-gray-lighter);
    border: none;
    border-radius: var(--border-radius-low);
    padding: 15px 24px;
    cursor: pointer;
    outline: none;
    transition: var(--transition-fast);
    position: relative;
}

.filter-select-option p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-gray);
}

.filter-select:focus {
    border-color: var(--color-main-light);
    color: var(--color-main);
}

.filter-select-arrow {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-main-dark);
    pointer-events: none;
    width: 19px;
    height: 19px;
}

.filter-select-letter {
    font-size: 16px;
    color: var(--color-main-dark);
    font-weight: 700;
    text-transform: none;
}

.filter-select-wrap-active .filter-select-menu {
    transform: translateX(-15px);
    opacity: 1;
    z-index: 21;
}

.filter-select-items {
    height: 0;
    overflow-y: hidden;
}

.filter-select-menu-top, 
.filter-select-items {
    padding-left: 15px;
    padding-right: 15px;
}

.filter-select-wrap-active .filter-select-items { 
    overflow-y: scroll;
    height: calc(100vh - 88px - var(--top-height-responsive) - var(--menu-height-desktop));
}

.filter-select-menu-top {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    flex-direction: row;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--color-gray-lighter);
    position: relative;
}

.filter-select-menu-top .filter-select-menu-back {
    background-color: var(--color-gray-lighter);
    border: none;
    border-radius: var(--border-radius-low);
    padding: 10px 15px;
    cursor: pointer;
    outline: none;
    transition: var(--transition-fast);
    position: relative;
}

.filter-select-menu-top .filter-select-menu-search,
.filter-select-menu-top .filter-select-menu-search input {
    width: calc(100% - 50px - 9px);
}

.filter-select-menu-top .filter-select-menu-search input {
    padding: 12px 40px 12px 16px;
    border: 2px solid var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    font-size: 14px;
    font-weight: 500;
    outline: none;
    transition: var(--transition-fast);
}

.filter-select-menu-top .filter-select-menu-search input::placeholder {
    color: var(--color-main-gray);
}

.filter-select-menu-top .filter-select-menu-search svg {
    position: absolute;
    right: calc(12px + 15px);
    top: 13px;
    color: var(--color-gray-lighter);
    pointer-events: none;
}

.filter-select-item {
    align-items: center;
    gap: 10px;
    padding: 15px 24px;
    background-color: var(--color-gray-lighter);
    border-radius: var(--border-radius-low);
    cursor: pointer;
    transition: var(--transition-fast);
    border: 2px solid transparent;
    display: flex;
}

.filter-select-item:not(:last-child) {
    margin-bottom: 12px;
}

.filter-select-item:last-child {
    margin-bottom: 40px;
}

.filter-select-item.filter-select-item-active {
    border-color: var(--color-main-dark);
}

.filter-select-item p {
    margin-top: 0;
    margin-bottom: 0;
}

.filter-select-item p:first-child {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-dark);
}

.filter-select-item p:last-child {
    margin-left: auto;
    font-size: 13px;
    font-weight: 400;
    color: var(--color-main-gray);
}

.filter-select-item.filter-select-item-alter p {
    margin-left: 0;
}

/* Pagination */
.pagination {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 40px;
}

/* The full and compact variants are both rendered; show the compact one on
   narrow screens (the full list would otherwise wrap onto several rows).
   display:contents lets the chosen variant's links flow into the flex row. */
.pagination-desktop {
    display: contents;
}

.pagination-mobile {
    display: none;
}

@media screen and (max-width: 900px) {
    .pagination-desktop {
        display: none;
    }

    .pagination-mobile {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 5px;
    }

    .filter-select-wrap .filter-select-menu {
        top: 20px;
        max-width: 100%;
        width: 100vw;
        left: 15px;
    }
}

@media screen and (max-width: 768px) {
    .pagination {
        gap: 5px;
    }

    #mattprime .pagination-link {
        width: 46px;
        height: 42px;
    }

    #mattprime .pagination-prev,
    #mattprime .pagination-next {
        padding: 12px 10px;
    }
}

.pagination a {
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.pagination-link {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-main-dark);
    background-color: var(--color-gray-lighter);
    width: 50px;
    height: 50px;
    border-radius: var(--border-radius-low);
    cursor: pointer;
    transition: var(--transition-fast);
    font-size: 16px;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
}

.pagination-link:hover,
.pagination-link-active {
    color: var(--color-white);
    background-color: var(--color-main-dark);
}

.pagination-prev,
.pagination-next {
    padding: 16px 20px;
}

.pagination-prev svg,
.pagination-next svg {
    position: relative;
}

.pagination-prev img {
    transform: rotate(180deg);
}

/* Slide */
.slide-labels {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin-top: 12px;
    margin-bottom: 11px;
}

.slide-labels p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-gray);
}

/* Custom Compare Table */
.custom-table-compare {
    max-width: var(--global-low-width);
    margin: 0 auto;
}

.custom-table-compare-expanded {
    max-width: var(--global-mid-width);
}

.custom-table-compare-header {
    text-align: center;
    margin-bottom: 48px;
}

.custom-table-compare-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 16px;
}

.custom-table-compare-description {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-main-dark);
    max-width: 540px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
}

.custom-table-compare-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: start;
    gap: 16px;
}

.custom-table-compare-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.custom-table-compare-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.custom-table-compare-grid-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.custom-table-compare-grid-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.custom-table-compare-grid-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.custom-table-compare-grid > .custom-table-compare-item-simple {
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-gray-lighter);
    background-color: var(--color-white);
}

.custom-table-compare-image {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
}

.custom-table-compare-image img {
    width: 100%;
    max-height: 117px;
    object-fit: contain;
    position: relative;
    bottom: 20px;
}

.custom-table-compare-subtitle p,
.custom-table-compare-label-featured,
.custom-table-compare-label {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    padding-top: 65px;
    padding-bottom: 30px;
}

.custom-table-compare-subtitle p {
    margin-top: 0;
    margin-bottom: 0;
    text-align: left;
    padding-left: 30px;
    padding-top: 57px;
}

.custom-table-compare-subtitle p,
.custom-table-compare-label {
    color: var(--color-main-dark);
}

.custom-table-compare-label-featured {
    color: var(--color-white);
    background-color: var(--color-main-dark);
    border-top-left-radius: var(--border-radius-mid);
    border-top-right-radius: var(--border-radius-mid);
}

.custom-table-compare-cell,
.custom-table-compare-feature-label {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    border-top: 1px solid var(--color-gray-lighter);
}

.custom-table-compare-cell p {
    font-size: 18px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 400;
    color: var(--color-main-dark);
}

.custom-table-compare-featured .custom-table-compare-cell p {
    color: var(--color-white);
}

.custom-table-compare-feature-label {
    justify-content: flex-start;
    padding-left: 30px;
    padding-right: 30px;
    border-left: 1px solid var(--color-gray-lighter);
    border-right: 1px solid var(--color-gray-lighter);
}

.custom-table-compare-feature-label:first-child {
    border-top-left-radius: var(--border-radius-mid);
    border-top-right-radius: var(--border-radius-mid);
}

.custom-table-compare-feature-label:last-child {
    border-bottom-left-radius: var(--border-radius-mid);
    border-bottom-right-radius: var(--border-radius-mid);
    border-bottom: 1px solid var(--color-gray-lighter);
    height: calc( 62px + 60px );
    align-items: flex-start;
}

.custom-table-compare-feature-label p {
    text-align: left;
    font-size: 18px;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 0;
}

.custom-table-compare-subtitle ~ .custom-table-compare-labels .custom-table-compare-feature-label p {
    font-weight: 700;
}

.custom-table-compare-featured .custom-table-compare-cell {
    border-color: var(--color-main-gray);
}

.custom-table-compare-labels {
    display: flex;
    flex-direction: column;
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid);
}

.custom-table-compare-regular,
.custom-table-compare-featured {
    border-bottom-left-radius: var(--border-radius-mid);
    border-bottom-right-radius: var(--border-radius-mid);
    display: flex;
    flex-direction: column;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 60px;
}

.custom-table-compare-featured {
    background-color: var(--color-main-dark);
}

.custom-table-compare-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-table-compare-icon-check {
    background-color: var(--color-yellow);
}

.custom-table-compare-icon-check svg {
    width: 16px;
    height: 16px;
    stroke: var(--color-white);
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.custom-table-compare-icon-x {
    background-color: var(--color-gray-lighter)
}

.custom-table-compare-icon-x svg {
    width: 12px;
    height: 12px;
    stroke: var(--color-main-dark);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
}

.custom-table-compare-info {
    max-width: 992px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    margin-top: 32px;
}

.custom-table-compare-info p {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 400;
    color: var(--color-main-dark);
    font-size: 18px;
    text-align: center;
}

/* Custom Form */
.custom-form-main {
    max-width: 548px;
    width: 100%;
    padding: 34px;
    background-color: var(--color-white);
    border: 1px solid var(--color-gray-lighter);
    border-radius: var(--border-radius-mid);
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
    margin-bottom: 100px;
}

.custom-form-main form {
    width: 100%;
}

.custom-form-main > h2 {
    font-size: 26px;
    margin-top: 0;
    margin-bottom: 24px;
    font-weight: 500;
    width: 100%;
    text-align: left;
}

.custom-form-input {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
}

.custom-form-input label {
    font-size: 18px;
    margin-top: 0;
    margin-bottom: 10px;
    font-weight: 700;
}

.custom-form-input input {
    background-color: var(--color-gray-lighter);
    border: none;
    border-radius: var(--border-radius-low);
    padding: 15px 28px;
    width: 100%;
    margin-bottom: 24px;
    outline: none;
}

.custom-form-input input::placeholder {
    color: var(--color-main-gray);
    font-size: 16px;
    font-weight: 500;
}

.custom-form-input span.wpcf7-form-control-wrap {
    width: 100%;
}

.custom-form-checkbox label {
    color: var(--color-main-gray);
    font-size: 14px;
    font-weight: 500;
    margin-left: 6px;
}

.custom-form-social {
    margin-bottom: 12px;
}

.custom-form-social p,
.custom-form-link p,
.custom-form-link a {
    color: var(--color-main-gray);
    font-size: 14px;
    font-weight: 400;
    text-align: left;
}

.custom-form-social p,
.custom-form-link a {
    text-align: center;
    font-weight: 500;
}

.custom-form-bottom div:not(:last-child) {
    margin-bottom: 24px;
}

/* Login / Register — inline result message */
.custom-form-message {
    padding: 10px 14px;
    border-radius: var(--border-radius-mid);
    font-size: 14px;
    font-weight: 500;
}

.custom-form-message.is-error {
    background-color: rgba(242, 106, 91, 0.12);
    color: var(--color-red);
}

.custom-form-message.is-success {
    background-color: rgba(0, 0, 0, 0.05);
    color: var(--color-main);
}

.custom-form-button button.wp-block-button__link {
    border: 0;
    cursor: pointer;
    font: inherit;
    width: 100%;
}

.custom-form-button button.wp-block-button__link.is-loading {
    opacity: 0.6;
    pointer-events: none;
}

.custom-form-google {
    padding: 16px 32px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border-radius: var(--border-radius-min);
    border: 1px solid var(--color-gray-lighter);
    color: var(--color-black);
    width: 100%;
    display: block;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.custom-form-password {
    position: relative;
    width: 100%;
    margin-bottom: 24px;
}

.custom-form-password input {
    margin-bottom: 0;
    padding-right: 56px;
}

.custom-form-password-toggle {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--color-main);
    line-height: 0;
}

.custom-form-password-toggle svg {
    display: block;
    width: 20px;
    height: 20px;
}

.custom-form-password-toggle .icon-eye {
    display: none;
}

.custom-form-password.is-visible .icon-eye-off {
    display: none;
}

.custom-form-password.is-visible .icon-eye {
    display: block;
}

.custom-form-intro {
    font-size: 18px;
    color: var(--color-main-dark);
    margin-top: 0;
    margin-bottom: 24px;
}

.wpcf7-form .custom-form-top,
.my-account-edit .custom-form-top {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

@media screen and (max-width: 991px) {
    .wpcf7-form .custom-form-top,
    .my-account-edit .custom-form-top {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* my-account-edit is plain HTML (no CF7 wrapper): right-align the submit. */
.my-account-edit .custom-form-bottom {
    display: flex;
    justify-content: flex-end;
}

.custom-form-input select,
.custom-form-input textarea {
    background-color: var(--color-gray-lighter);
    border: none;
    border-radius: var(--border-radius-low);
    padding: 15px 28px;
    width: 100%;
    margin-bottom: 24px;
    outline: none;
    font-size: 16px;
    font-weight: 500;
    font-family: inherit;
    color: var(--color-main-dark);
}

.custom-form-input textarea {
    min-height: 170px;
    resize: vertical;
}

.custom-form-input textarea::placeholder {
    color: var(--color-main-gray);
    font-size: 16px;
    font-weight: 500;
}

.custom-form-input select {
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    padding-right: 56px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 12 12' fill='none' stroke='%23222160' stroke-width='1.5'%3E%3Cpath d='M1.5 4 6 8l4.5-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 28px center;
}

.custom-form-bottom-contact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.custom-form-bottom-contact .custom-form-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* About */
#mattprime .about-main {
    position: relative;
    top: -350px;
    margin-bottom: -320px;
    max-width: var(--global-mid-width);
    padding-left: var(--wp--style--root--padding-left);
    padding-right: var(--wp--style--root--padding-right);
    z-index: 2;
    margin-left: auto;
    margin-right: auto;
}

#mattprime .about-info {
    max-width: 387px;
}

#mattprime .about-form-main,
#mattprime .about-info-main {
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid);
    border: 2px solid var(--color-gray-lighter);
    padding: 30px 65px;
}

#mattprime .about-info-main p,
#mattprime .about-info-main q {
    margin-bottom: 0;
}

@media screen and (max-width: 991px) {
    #mattprime .about-main > .e-con-inner {
        flex-direction: column;
    }

    #mattprime .about-info {
        max-width: 100%;
    }

    #mattprime .about-form h2 {
        color: var(--color-main);
    }

    #mattprime .about-info h2.elementor-heading-title {
        text-align: center;
    }

    #mattprime .about-form-main,
    #mattprime .about-info-main {
        padding: 40px 28px;
    }
}

/* Compare List */
.compare-list {
    width: 100%;
    max-width: var(--global-content-width);
    margin-left: auto;
    margin-right: auto;
    margin-top: 44px;
}

.compare-list h1 {
    font-size: 26px;
    margin-top: 0;
    margin-bottom: 14px;
    color: var(--color-main-dark);
    font-weight: 700;
}

.compare-list > p {
    font-size: 18px;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--color-main-dark);
    font-weight: 400;
}

@media screen and (max-width: 1750px) {
    .compare-list {
        padding-left: var(--wp--style--root--padding-left);
        padding-right: var(--wp--style--root--padding-right);
    }
}

.compare-list-cars {
    margin-top: 44px;
    /* display: grid;
    justify-content: start;
    align-content: start;
    align-items: start;
    grid-auto-rows: 1fr;
    column-gap: 16px;
    row-gap: 16px; */
    overflow-x: scroll;
    padding-bottom: 30px;

    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
}

/* .compare-list-cars-1 {
    grid-template-columns: repeat(1, 1fr);
}

.compare-list-cars-2 {
    grid-template-columns: repeat(2, 1fr);
}

.compare-list-cars-3 {
    grid-template-columns: repeat(3, 1fr);
}

.compare-list-cars-4 {
    grid-template-columns: repeat(4, 1fr);
}

.compare-list-cars-5 {
    grid-template-columns: repeat(5, 1fr);
}

.compare-list-cars-6 {
    grid-template-columns: repeat(6, 1fr);
} */

.compare-list-car {
    min-width: 545px;
    width: 545px;
    position: relative;
}

@media screen and (max-width: 768px) {
    .compare-list-car {
        min-width: 335px;
        width: 335px;
        position: relative;
    }
}

.compare-list-car-icon {
    top: 20px;
    right: 20px;
    position: absolute;
}

.compare-list-car-icon svg {
    width: 16px;
    height: 16px;
}

.compare-list-car-top {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    position: relative;
    z-index: 21;
    box-shadow: 0px 3px 10px #00000008;
    padding: 40px 20px;
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-gray-lighter);
}

@media screen and (max-width: 768px) {
    .compare-list-car-icon {
        top: 15px;
        right: 15px;
        position: absolute;
    }

    .compare-list-car-top {
        gap: 10px;
        flex-direction: column;
        padding: 15px;
    }
}

.compare-list-car-top-fixed,
.compare-list-car-top-bottom {
    background-color: var(--color-white);
}

.compare-list-car-top-fixed ~ .compare-list-car-top-spacer,
.compare-list-car-top-bottom ~ .compare-list-car-top-spacer {
    height: 253px;
}

@media screen and (max-width: 768px) {
    .compare-list-car-top-fixed ~ .compare-list-car-top-spacer,
    .compare-list-car-top-bottom ~ .compare-list-car-top-spacer {
        height: 144px;
    }
}

.compare-list-car-top-fixed {
    position: fixed;
    top: calc(var(--menu-height-desktop) + var(--top-height-responsive));
}

@media screen and (max-width: 1024px) {
    .compare-list-car-top-fixed {
        top: calc(var(--menu-height-mobile) + var(--top-height-responsive));
    }
}

.compare-list-car-advance {
    margin-top: 44px;
}

.compare-list-car-top-bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

/* Compact the pinned header: hide the car image once it sticks (on scroll). */
.compare-list-car .compare-list-car-images {
    transition: var(--transition-fast);
}

#mattprime .compare-list-car-top .single-car-image {
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.compare-list-car-title h2 {
    font-size: 32px;
    margin-top: 0;
    margin-bottom: 6px;
    color: var(--color-main-dark);
    font-weight: 700;
}

@media screen and (max-width: 768px) {
    #mattprime .compare-list-car-top-fixed .compare-list-car-images,
    #mattprime .compare-list-car-top-bottom .compare-list-car-images {
        max-height: 0;
        overflow: hidden;
    }
    .compare-list-car .compare-list-car-images,
    #mattprime .compare-list-car-top .single-car-image {
        max-height: 160px;
        height: 160px;
    }
    .compare-list-car-title h2 {
        font-size: 26px;
        margin-bottom: 0;
    }
}

.compare-list-car-title > p {
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 6px;
    font-weight: 500;
    color: var(--color-main-gray);
}

@media screen and (max-width: 768px) {
    .compare-list-car-title > p {
        margin-bottom: 0;
    }
}

.compare-list-car-price p {
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 700;
    color: var(--color-main-dark);
}

.compare-list-car-price p span {
    font-size: 48px;
}

@media screen and (max-width: 768px) {
    
    .compare-list-car-price p span {
        font-size: 36px;
    }
}

.compare-list-car-advance .vehicle-float-main {
    width: 100%;
    max-width: 100%;
}

@media screen and (max-width: 768px) {
    #mattprime .compare-list-car-advance .vehicle-float-options {
        gap: 8px;
    }
    #mattprime .compare-list-car-advance .vehicle-float-options button {
        padding: 14px 16px;
    }
}

.compare-list-car-info {
    margin-top: 91px;
}

.compare-list-car-features h3,
.compare-list-car-equipments h3 {
    font-size: 22px;
    margin-top: 0;
    margin-bottom: 17px;
    font-weight: 700;
    color: var(--color-main-dark);
}

.compare-list-car-features table,
.compare-list-car-equipments table {
    width: 100%;
    border-collapse: separate;
    margin-bottom: 20px;
    -webkit-border-horizontal-spacing: 0;
    -webkit-border-vertical-spacing: 16px;
}

.compare-list-car-features td,
.compare-list-car-equipments td {
    padding: 21px;
    border: 2px solid var(--color-gray-lighter);
    background-color: var(--color-white);
    font-size: 16px;
    color: var(--color-main-dark);
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
}

.compare-list-car-equipments td img {
    margin-right: 26px;
}

.compare-list-car-features tr:nth-child(2n+1) td,
.compare-list-car-equipments tr:nth-child(2n+1) td {
    background-color: var(--color-gray-lighter);
}

.compare-list-car-features tr td:last-child {
    border-left: 0;
}

.compare-list-car-features tr td:first-child {
    border-right: 0;
}

.compare-list-car-features tr td:last-child,
.compare-list-car-equipments tr td:last-child {
    border-top-right-radius: var(--border-radius-low);
    border-bottom-right-radius: var(--border-radius-low);
    text-align: right;
}

.compare-list-car-features tr td:first-child,
.compare-list-car-equipments tr td:first-child {
    border-top-left-radius: var(--border-radius-low);
    border-bottom-left-radius: var(--border-radius-low);
    text-align: left;
}

/* ===== Mobile filter modal (≤1024px) =====
   The desktop sidebar becomes a slide-up panel: a title bar (Φίλτρα + ✕), a
   scrolling body, and a pinned footer (Καθαρισμός + Εφαρμογή). Opened from a
   "Φίλτρα" trigger in the results bar. These three controls are hidden on
   desktop. */
.filter-header-close,
.filter-footer,
.vehicles-filter-open {
    display: none;
}

/* The sticky top bar is empty (hidden) on desktop; JS fills it on mobile. */
.vehicles-topbar:empty {
    display: none;
}

@media screen and (max-width: 1024px) {
    .vehicles-main {
        display: block;
        margin-top: 32px;
    }

    /* Sticky bar (sorting + filter trigger) that follows below the header.
       JS relocates the sorting select and the trigger here on mobile. */
    .vehicles-topbar {
        display: flex;
        align-items: center;
        gap: 12px;
        position: sticky;
        top: calc(var(--menu-height-mobile) + var(--top-height-responsive));
        z-index: 10;
        margin-bottom: 24px;
        padding: 12px 0;
        background-color: var(--color-white);
    }

    .vehicles-topbar .vehicles-filters-sorting {
        flex: 1 1 auto;
        max-width: none;
    }

    /* Filter trigger — navy icon button with an active-count badge. */
    .vehicles-filter-open {
        position: relative;
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 56px;
        height: 56px;
        padding: 0;
        background-color: var(--color-main);
        color: var(--color-white);
        border: none;
        border-radius: var(--border-radius-min);
        cursor: pointer;
    }

    .vehicles-filter-open-count {
        position: absolute;
        top: -6px;
        right: -6px;
        min-width: 20px;
        height: 20px;
        padding: 0 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-color: var(--color-yellow);
        color: var(--color-main);
        font-size: 12px;
        font-weight: 700;
        border-radius: 999px;
    }

    .vehicles-filter-open-count:empty {
        display: none;
    }

    /* Active-filter chips stay below the title as one horizontal-scroll row. */
    .vehicles-filters-active {
        flex-wrap: nowrap;
        overflow-x: auto;
        width: 100%;
    }

    .vehicles-filters-active-item {
        flex: 0 0 auto;
    }

    .vehicles-filters-active:empty {
        display: none;
    }

    /* Sidebar → slide-up bottom-sheet panel. */
    .filter-sidebar {
        position: fixed;
        top: 48px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 22;
        width: auto;
        max-width: none;
        max-height: none;
        margin: 0;
        padding: 0;
        border-radius: var(--border-radius-mid) var(--border-radius-mid) 0 0;
        background-color: var(--color-white);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        transform: translateY(100%);
        transition: transform .34s cubic-bezier(.16, 1, .3, 1);
    }

    .filter-sidebar.filter-sidebar-open {
        transform: translateY(0);
        box-shadow: 0 0 0 100vmax rgba(34, 33, 96, 0.12); /* scrim */
    }

    /* Title bar (Φίλτρα + ✕); the trash-can reset moves to the footer. */
    .filter-header {
        flex-shrink: 0;
        margin-bottom: 0;
        border-bottom: 1px solid var(--color-gray-light);
        padding-top: 20px;
        padding-bottom: 20px;
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
    }

    .filter-header-reset {
        display: none;
    }

    .filter-header-close {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 4px;
        border: 0;
        background: none;
        color: var(--color-main-dark);
        cursor: pointer;
        line-height: 0;
    }

    /* Scrolling body. */
    .filter-sidebar .filter-form {
        flex: 1 1 auto;
        min-height: 0;
        max-height: none;
        padding-top: 20px;
        padding-bottom: 20px;
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
    }

    /* Pinned footer. */
    .filter-footer {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        gap: 16px;
        flex-shrink: 0;
        padding-top: 20px;
        padding-bottom: 20px;
        padding-right: var(--wp--style--root--padding-right);
        padding-left: var(--wp--style--root--padding-left);
        border-top: 1px solid var(--color-gray-light);
    }

    .filter-footer-reset {
        background: none;
        border: none;
        padding: 8px 4px;
        font-size: 15px;
        font-weight: 500;
        color: var(--color-main-dark);
        text-decoration: underline;
        cursor: pointer;
        white-space: nowrap;
    }

    /* Category tiles, moved into the panel → horizontal scroll. */
    .filter-section-categories .vehicles-categories {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-bottom: 0;
        padding-bottom: 8px;
        gap: 14px;
    }

    .filter-section-categories .vehicles-categories-item {
        flex: 0 0 auto;
        width: 125px;
    }
}
/* Table Compare — mobile (<=1024px) */
.custom-table-compare-mobile {
    display: none;
}

.custom-table-compare-row .custom-table-compare-icon-check,
.custom-table-compare-row .custom-table-compare-icon-x,
.custom-table-compare-row .custom-table-compare-row-text {
    display: none;
}

.custom-table-compare-row[data-state="true"] .custom-table-compare-icon-check {
    display: flex;
}

.custom-table-compare-row[data-state="false"] .custom-table-compare-icon-x {
    display: flex;
}

.custom-table-compare-row[data-state="text"] .custom-table-compare-row-text {
    display: block;
}

@media (max-width: 1024px) {
    .custom-table-compare-grid {
        display: none;
    }

    .custom-table-compare-mobile {
        display: block;
    }

    .custom-table-compare-header {
        margin-bottom: 28px;
    }

    .custom-table-compare-title {
        font-size: 26px;
    }

    .custom-table-compare-description {
        font-size: 16px;
    }

    .custom-table-compare-mobile-image {
        display: flex;
        justify-content: center;
        margin-bottom: 24px;
    }

    .custom-table-compare-mobile-image img {
        width: 100%;
        max-width: 360px;
        max-height: 180px;
        object-fit: contain;
    }

    .custom-table-compare-mobile-subtitle p {
        margin: 0 0 16px;
        font-size: 18px;
        font-weight: 700;
        color: var(--color-main-dark);
    }

    .custom-table-compare-tabs {
        display: flex;
        gap: 6px;
        padding: 6px;
        margin-bottom: 24px;
        background-color: var(--color-gray-lighter);
        border-radius: var(--border-radius-mid);
    }

    .custom-table-compare-tab {
        flex: 1;
        border: none;
        cursor: pointer;
        padding: 14px 8px;
        font-size: 16px;
        font-weight: 700;
        color: var(--color-main-gray);
        background-color: transparent;
        border-radius: var(--border-radius-min);
        transition: background-color .2s ease, color .2s ease;
    }

    .custom-table-compare-tab-active {
        color: var(--color-white);
        background-color: var(--color-main-dark);
    }

    .custom-table-compare-rows {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .custom-table-compare-row {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 16px 20px;
        background-color: var(--color-white);
        border: 1px solid var(--color-gray-lighter);
        border-radius: var(--border-radius-mid);
    }

    .custom-table-compare-row .custom-table-compare-icon {
        flex-shrink: 0;
    }

    .custom-table-compare-row-label,
    .custom-table-compare-row-text {
        margin: 0;
        font-size: 16px;
        font-weight: 500;
        color: var(--color-main-dark);
    }

    .custom-table-compare-mobile-cards {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .custom-table-compare-card {
        padding: 28px 24px;
        background-color: var(--color-white);
        border: 1px solid var(--color-gray-lighter);
        border-radius: var(--border-radius-mid);
    }

    .custom-table-compare-card-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 8px;
    }

    .custom-table-compare-card-name {
        margin: 0;
        font-size: 20px;
        font-weight: 700;
        color: var(--color-main-dark);
    }

    .custom-table-compare-card-price {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        white-space: nowrap;
        color: var(--color-main-dark);
    }

    .custom-table-compare-card-note {
        margin: 0;
        font-size: 15px;
        font-weight: 400;
        line-height: 1.5;
        color: var(--color-main-dark);
    }

    .custom-table-compare-card-featured {
        background-color: var(--color-main-dark);
        border-color: var(--color-main-dark);
    }

    .custom-table-compare-card-featured .custom-table-compare-card-name,
    .custom-table-compare-card-featured .custom-table-compare-card-price,
    .custom-table-compare-card-featured .custom-table-compare-card-note {
        color: var(--color-white);
    }
}

/* Custom Videos — fullscreen popup */
.custom-video {
    cursor: pointer;
}

.custom-video-popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background-color: #000;
}

.custom-video-popup.custom-video-popup-open {
    display: flex;
}

.custom-video-popup-frame {
    position: relative;
    width: min(92vw, 1100px);
    max-height: 86vh;
    aspect-ratio: 16 / 9;
}

.custom-video-popup-frame iframe,
.custom-video-popup-frame video {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: var(--border-radius-mid);
    background-color: #000;
    object-fit: contain;
}

.custom-video-popup-close {
    position: absolute;
    top: 18px;
    right: 24px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    background-color: transparent;
    color: #fff;
    cursor: pointer;
    transition: opacity .2s ease;
}

.custom-video-popup-close:hover {
    opacity: .7;
}

.custom-video-popup-close svg {
    width: 28px;
    height: 28px;
}

/* My Executive */
#mattprime .my-executive .custom-button {
    margin-top: 40px;
}

@media (max-width: 1700px) {
    #mattprime .my-executive .global-info-content h3 {
        font-size: 36px;
    }
}

@media (max-width: 1600px) {
    #mattprime .my-executive .global-info {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1400px) {
    #mattprime .my-executive .global-info-content h3 {
        font-size: 26px;
    }
}

@media (max-width: 991px) {
    #mattprime .my-executive .global-info {
        display: flex;
        flex-direction: column;
    }
}

/* My account */
.my-account-name {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 12px;
    margin-bottom: 70px;
}

.my-account-name p {
    margin-top: 0;
    margin-bottom: 0;
}

.my-account-name-image {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    min-height: 54px;
    min-width: 54px;
    background-color: var(--color-yellow);
    border-radius: 100%;
    text-align: center;
}

.my-account-name-image p {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-white);
}

.my-account-name-text {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    line-break: anywhere;
}

.my-account-name-text p:first-child {
    font-size: 20px;
    font-weight: 500;
    color: var(--color-main-dark);
}

.my-account-name-text p:last-child {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-gray-medium);
}

.my-account-content {
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}

#mattprime .my-account-sidebar {
    width: 340px;
    align-self: flex-start;
    height: 491px;
    overflow-y: auto;
    top: 110px;
    position: sticky;
    overflow-x: hidden;
}

/* My account — sidebar nav (clean shortcode markup) */
.my-account-nav {
    display: flex;
    flex-direction: column;
    height: 100%;
}

#mattprime .my-account-sidebar .elementor-widget-shortcode,
#mattprime .my-account-sidebar .elementor-shortcode {
    height: 100%;
}

.my-account-nav-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.my-account-nav-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    border-radius: var(--border-radius-mid);
    color: var(--color-main);
    text-decoration: none;
    transition: var(--transition-fast);
}

.my-account-nav-item:hover,
.my-account-nav-item.my-account-nav-item-active {
    background-color: var(--color-gray-lighter);
}

.my-account-nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.my-account-nav-icon svg {
    width: auto;
    height: auto;
    max-width: 20px;
    max-height: 20px;
}

.my-account-nav-label {
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: var(--color-main);
    white-space: nowrap;
}

.my-account-logout {
    margin-top: auto;
}

/* My account — sidebar collapse toggle (mobile only) */
.my-account-nav-toggle {
    display: none;
}

@media screen and (max-width: 991px) {
    #mattprime .my-account-sidebar {
        width: 100%;
        height: auto;
        overflow: visible;
        flex-direction: column;
        transition: var(--transition-normal);
        top: 0;
        position: relative;
    }

    body#mattprime .wp-site-blocks .my-account-content > .e-con-inner {
        flex-wrap: nowrap;
    }

    #mattprime .my-account-sidebar .my-account-name {
        flex-wrap: wrap;
    }
    
    #mattprime .my-account-sidebar .global-info-content {
        padding: 15px!important;
    }

    .my-account-name-image {
        min-height: 37px;
        min-width: 37px;
    }

    .my-account-name-image p {
        font-size: 20px;
    }

    #mattprime .my-account-sidebar.my-account-sidebar-expanded {
        min-width: 240px;
        width: 240px;
    }

    #mattprime .my-account-content > .e-con-inner {
        justify-content: flex-start;
        flex-direction: column;
    }

    .my-account-nav > button {
        display: none;
    }

    .my-account-nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: flex-end;
        width: 40px;
        height: 40px;
        margin: 0 0 12px;
        padding: 0;
        border: none;
        border-radius: var(--border-radius-mid);
        background-color: var(--color-gray-lighter);
        color: var(--color-main);
        cursor: pointer;
        transition: var(--transition-fast);
    }

    .my-account-nav-toggle:hover {
        background-color: var(--color-white);
    }

    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-nav-toggle {
        align-self: center;
    }

    .my-account-nav-toggle svg {
        width: 20px;
        height: 20px;
        transition: transform 0.25s ease;
    }

    #mattprime .my-account-sidebar.my-account-sidebar-expanded .my-account-nav-toggle svg {
        transform: rotate(180deg);
    }

    /* Collapsed: keep icons, hide the labels */
    /* #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-nav-label,
    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-name-text {
        display: none;
    } */

    /* Collapsed: center the icons within the 80px rail */
    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-nav-item,
    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-name {
        justify-content: flex-start;
    }

    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-nav-item {
        padding-left: 0;
        padding-right: 0;
    }

    #mattprime .my-account-sidebar:not(.my-account-sidebar-expanded) .my-account-name {
        margin-bottom: 32px;
    }
}

/* My account — favorites */
.my-account-favorites-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

@media screen and (min-width: 769px) {
    .my-account-favorites-head {
        position: absolute;
        right: 0;
        top: -55px;
        justify-content: space-between;
    }
}

.my-account-favorites-clear {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid var(--color-gray-lighter);
    border-radius: var(--border-radius-mid);
    background-color: var(--color-gray-lighter);
    color: var(--color-main);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition-fast);
}

.my-account-favorites-clear:hover {
    background-color: var(--color-white);
}

.my-account-favorites-clear svg {
    width: 14px;
    height: 14px;
}

.my-account-favorites-cars {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

@media screen and (max-width: 768px) {
    .my-account-favorites-cars {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

.my-account-favorites-empty {
    padding: 40px 0;
    color: var(--color-gray-medium);
    font-size: 16px;
    font-weight: 500;
}

/* My account — change password */
.my-account-password-rules {
    list-style: none;
    margin: 0 0 32px;
    padding: 0;
}

.my-account-password-rules li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-gray);
    margin-bottom: 12px;
    transition: var(--transition-fast);
}

.my-account-password-rule-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: var(--color-main-gray);
}

/* A satisfied rule turns brand-colored. */
.my-account-password-rules li.is-valid,
.my-account-password-rules li.is-valid .my-account-password-rule-icon {
    color: var(--color-main);
}

.my-account-password .custom-form-button {
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

/* My account — email preferences */
.my-account-settings-option {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 32px;
}

.my-account-logout {
    margin-top: 10px;
}

.my-account-settings-label {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-main-dark);
}

.my-account-settings .custom-form-button {
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

/* My account — danger zone (delete account) */
.my-account-delete {
    margin-top: 48px;
}

.my-account-delete h3 {
    margin-top: 0;
    margin-bottom: 12px;
}

.my-account-delete p {
    color: var(--color-main-gray);
    font-size: 18px;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 24px;
    max-width: 640px;
}

.my-account-delete-button {
    display: flex;
    justify-content: center;
}

.my-account-delete-account {
    padding: 16px 40px;
    border: 2px solid var(--color-red);
    border-radius: var(--border-radius-high);
    background-color: transparent;
    color: var(--color-red);
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition-fast);
}

.my-account-delete-account:hover {
    background-color: var(--color-red);
    color: var(--color-white);
}

/* Page */
.newsletter-page .global-info-content {
    max-width: 548px;
}

.newsletter-page .global-info-content .custom-form-bottom {
    margin-top: 20px;
}