/* #region custom swiper pagination */
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    --swiper-pagination-bottom: 1rem;
    display: flex;
    width: calc(100% - 1rem);
}

.hero .swiper-horizontal>.swiper-pagination-bullets,
.hero .swiper-pagination-bullets.swiper-pagination-horizontal,
.hero .swiper-pagination-custom,
.hero .swiper-pagination-fraction {
    width: calc(100% - 5rem);
}

.swiper-pagination-bullet {
    --swiper-pagination-bullet-horizontal-gap: 8px;
    --swiper-pagination-bullet-height: 4px;
    background-color: var(--color-border);
    opacity: 1;
    width: auto;
    flex-grow: 1;
    border-radius: var(--rounded-full);
    position: relative;
}

.hero .swiper-pagination-bullet {
    background-color: var(--color-white);
}

.swiper-pagination-bullet .progress-fill {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background-color: var(--color-accent);
    transition: width var(--duration, 0s) linear;
    border-radius: var(--rounded-full);
    z-index: 1;
}

.swiper-pagination-bullet.filled {
    background-color: var(--color-accent) !important;
}

.swiper-pagination-bullet-active {
    background-color: var(--color-primary);
}

.hero .swiper-pagination-bullet-active {
    background-color: var(--color-white);
}

.swiper-button-next::after,
.swiper-button-prev::after {
    content: none;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 1;
    --outlined-color: var(--color-primary);
    box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -webkit-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -moz-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -o-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    background-color: transparent;
    color: var(--outlined-color);
    padding: 0 1rem;
}


/* #endregion */

/* #region Bottomsheet component */
.pbs {
    --title-y-margin: 1rem;
    --title-font-size: 2rem;
    --title-line-height: var(--line-height-tight);
}

.pbs .sheet-title {
    font-weight: 600;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    letter-spacing: -1%;
    text-align: center;
    margin: var(--title-y-margin) 0;
}

.pbs .select-mb-sheet {
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 2rem;
    max-height: calc(100% - (var(--title-font-size) * var(--title-line-height) + var(--title-y-margin)*2));
    overflow-y: scroll;
}

.pbs .select-mb-sheet li {
    padding: 1.156rem 1rem;
    background-color: var(--color-bg-neutral);
    border-radius: var(--rounded-lg);
    font-weight: 500;
    line-height: var(--line-height-tight);
}

.pbs-button-reset {
    pointer-events: none;
}

.frontleBottomSheetContents {
    padding: 0;
    border-top-left-radius: 32px;
    border-top-right-radius: 32px;
    max-height: 90vh;
}

.pbs .sidebar__filter {
    margin: 0 24px;
    padding: 0;
    background-color: transparent;
    flex-grow: 1;
}

.pbs .sidebar__filter .sidebar__filter-group {
    background-color: var(--color-surface);
}

.pbs .form__ctas {
    margin: 12px 8px;
    width: calc(100% - 16px);
}

/* #endregion */

/* #region noUISlider override */
.noUi-horizontal {
    height: 6px;
    border: none;
    box-shadow: none;
}

.noUi-target {
    background-color: #0007081A;
}

.noUi-connect {
    background-color: var(--color-primary);
}

.noUi-horizontal .noUi-handle {
    width: 30px;
    height: 30px;
    background-color: var(--color-primary);
    border-radius: var(--rounded-full);
    border: none;
    box-shadow: none;
    top: -12px;
}

.noUi-touch-area {
    background-color: var(--color-white);
    border-radius: var(--rounded-full);
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.noUi-touch-area::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    background-color: var(--color-white);
    box-shadow: inset 8px 0 0 6px var(--color-primary), inset -8px 0 0 6px var(--color-primary);
}

.noUi-handle::after {
    content: "";
    display: block;
    position: absolute;
    height: 12px;
    width: 2px;
    background: var(--color-white);
    left: 8px;
    top: 9px;
}

.noUi-handle::before {
    content: "";
    z-index: 2;
    display: block;
    position: absolute;
    height: 12px;
    width: 2px;
    background: var(--color-white);
    left: 20px;
    top: 9px;
}

.noUi-tooltip {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-radius: var(--rounded-sm);
    border: none;
}

.noUi-value {
    font-weight: 500;
    font-size: var(--font-size-xs);
    line-height: 1.2;
    text-align: center;
    color: var(--color-primary);
    top: 16px;
}

.noUi-pips-horizontal {
    height: fit-content;
    top: calc(100% + 12px);
}

.noUi-marker-horizontal.noUi-marker-large {
    height: 10px;
    background-color: #0007081A;
}

/* #endregion */

/* #region Choicejs override */
.choices {
    background-color: var(--color-bg-neutral);
    border: none;
    border-radius: var(--rounded-full);
    font-weight: 500;
    font-size: var(--font-size-lg);
    line-height: 1.4;
    padding: 15.5px 0;
    padding-left: 0.75rem;
    padding-right: 1.5rem;
    width: 100%;
    margin-bottom: 0;
}

.choices.choices--light {
    background-color: var(--color-white);
}

.choices+iconify-icon {
    position: absolute;
    top: 50%;
    right: 1.5rem;
    transform: translateY(calc(-50% - 4px)) scaleY(1);
    transition: transform 0.15s ease-in-out;
}

.choices.is-open+iconify-icon {
    transform: translateY(calc(-50% + 4px)) scaleY(-1);
}

.choices__inner {
    background-color: transparent;
    border: none;
    padding: 0;
    min-height: auto;
}

.choices[data-type*="select-one"] .choices__inner {
    padding-bottom: 0;
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
    left: 0;
    border-radius: var(--rounded-lg);
}

.choices[data-type*="select-one"]::after {
    right: 1rem;
    content: none;
}

/* #endregion */

/* #region Glightbox override */
.glightbox-mobile .goverlay {
    background-color: #00070826;
    backdrop-filter: blur(1.5rem);
    -webkit-backdrop-filter: blur(1.5rem);
}

.glightbox-container .gcontainer {
    max-width: calc(100% - 2rem);
    margin: 0 auto;
}

.gslide-media {
    border-radius: var(--rounded-card);
    overflow: hidden;
}

.glightbox-clean .gclose {
    --close-btn-spacing: 2rem;
    width: 3rem;
    height: 3rem;
    /* 50% to center the btn + half the video height + spacing */
    top: calc(50% + ((100vw - 2rem) * 9 / 16)/2 + var(--close-btn-spacing));
    right: 50%;
    border-radius: var(--rounded-full);
    transform: translateX(50%);
    position: absolute;
}

.glightbox-clean .gclose svg {
    width: 2rem;
}

.glightbox-clean .gnext,
.glightbox-clean .gprev {
    display: none !important;
}

/* #endregion */

/* #region Video player component */
.video__player {
    position: relative;
    width: 100%;
    height: var(--card-height);
    border-radius: var(--rounded-card);
    overflow: hidden;
}

.video__player img {
    width: 100%;
    height: 100%;
}

.video__player .btn--play {
    position: absolute;
    width: 6rem;
    height: 6rem;
    border-radius: var(--rounded-full);
    background-color: #FFFFFF66;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 4.25rem;
    color: var(--color-white);
    padding-left: 1.5rem;
}

.btn--play svg {
    width: 1.75rem;
    height: 1.75rem;
}

.video__player .gaz-logo {
    position: absolute;
    width: 7.375rem;
    height: 7rem;
    top: 1.5rem;
    left: 1.5rem;
}

/* #endregion */

/* #region Heading style override */
h1,
h2,
h3,
h4,
h5 {
    letter-spacing: -1%;
}

h1 {
    font-weight: 700;
    font-size: var(--font-size-h1);
    line-height: var(--line-height-tight);
}

h2 {
    font-weight: 600;
    font-size: var(--font-size-h2);
    line-height: var(--line-height-tight);
    letter-spacing: -1%;
}

h3 {
    font-weight: 600;
    font-size: var(--font-size-h3);
    line-height: var(--line-height-tight);
}

h4 {
    font-weight: 600;
    font-size: var(--font-size-h4);
    line-height: 1.3;
}

h5 {
    font-weight: 600;
    font-size: var(--font-size-h5);
    line-height: 1.4;
}

h6 {
    font-weight: 600;
    font-size: var(--font-size-h6);
    line-height: 1.4;
}

.h--caps {
    text-transform: uppercase;
}

.page__title {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 1.2;
    letter-spacing: -1%;
    text-transform: uppercase;
}

.section-tagline {
    font-weight: 600;
    line-height: var(--line-height-base);
    text-align: center;
}

p.section-description {
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.4;
}

.tagline--highlight {
    color: var(--color-danger);
}

/* #endregion */

/* #region Button component */
.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    border-radius: var(--rounded-full);
    background-color: var(--color-bg-light);
    cursor: pointer;
    min-height: 48px;
}

.btn--accent {
    background-color: var(--color-accent);
    color: var(--color-white);
    padding: 0 1.5rem;
    box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -webkit-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -moz-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -o-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
}

.btn--accent:hover{
    background-color: #009cae;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;

}

.btn--accent:active {
  background-color: #006f80;
  transform: scale(0.98);
}
.btn--sub:hover {
   color: #009cae;
  border: 1px solid #009cae;
  background-color: #f5f5f5;
  transition: all 0.3s ease;
}
.btn--sub:active {
  color: #00798a;
  transform: scale(0.98);
}



.btn--accent:hover,
.btn--accent:hover {
    color: var(--color-white);
}

.btn--sub {
    background-color: var(--color-btn-sub);
    padding: 0 0.5rem;
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    color: var(--color-primary);
}

.btn--sub:hover {
    color: var(--color-primary);
}

.btn--neutral {
    background-color: var(--color-bg-neutral);
    padding: 0 1.5rem;
    color: var(--color-primary);
}

.btn--primary {
    background-color: var(--color-primary);
    color: var(--color-white);
    padding: 0 1.5rem;
    box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -webkit-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -moz-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -o-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
}

.btn--primary-invert {
    background-color: var(--color-white);
    color: var(--color-primary);
    padding: 0 1.5rem;
}

.btn--sm {
    padding: 0.656rem 0.75rem;
    font-weight: 500;
    line-height: var(--line-height-tight);
    min-height: 40px;
}

.btn--all {
    background-color: var(--color-secondary);
    color: var(--color-white);
    width: 100%;
    padding: 0.5rem 2.5rem;
    padding-left: 3.25rem;
    font-weight: 600;
    font-size: 1.5rem;
    line-height: var(--line-height-tight);
    letter-spacing: -1%;
    text-transform: uppercase;
    border-radius: var(--rounded-xl);
    position: relative;
    min-height: 40px;
    justify-content: left;
}

.btn--all iconify-icon {
    position: absolute;
    width: 3rem;
    height: 3rem;
    right: 1rem;
}

.btn--icon-group {
    padding: 0.5rem;
}

.btn--icon-group .btn-text {
    color: var(--color-white);
    margin-left: 0.75rem;
    margin-right: 1.5rem;
}

.btn-cta-icon {
    background-color: var(--color-secondary-dark);
    border-radius: var(--rounded-card);
    display: flex;
    gap: 1.5rem;
}

.btn-cta-icon {
    background-color: var(--color-secondary-dark);
    border-radius: var(--rounded-card);
    display: flex;
    gap: 1.5rem;
    padding: 1rem;
    padding-left: 1.5rem;
}

.btn-cta-icon .btn-cta-text {
    flex-grow: 1;
    color: var(--color-white);
    text-transform: uppercase;
}

.btn-cta-icon .btn--icon {
    align-self: start;
    font-size: 1.75rem;
    padding: 0.75rem;
}

.btn-cta-icon .btn--icon img {
    width: 28px;
    height: 28px;
}

.btn--outlined {
    --outlined-color: var(--color-white);
    box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -webkit-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -moz-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -o-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    background-color: transparent;
    padding: 0 1.5rem;
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.4;
}

.btn--primary.btn--outlined {
    --outlined-color: var(--color-primary);
    box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -webkit-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -moz-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -o-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    background-color: transparent;
    color: var(--outlined-color);
    padding: 0 1rem;
}

.btn--text {
    background-color: transparent;
    color: var(--color-primary);
    padding: 0.875rem 1.25rem;
    transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
    gap: 0.5rem;
}

.btn--text iconify-icon {
    font-size: 1.5rem;
}

.btn--text:hover {
    background-color: var(--color-bg-neutral);
    color: var(--color-primary);
}

.btn--icon {
    aspect-ratio: 1/1;
    padding: 0.75rem;
    font-size: 1.5rem;
}

.btn.btn--sm.btn--icon {
    padding: 0.5rem;
    font-size: 1rem;
}

.btn--full {
    width: 100%;
}

.btn:has(icon-iconify, svg) {
    gap: 0.5rem;
}

@media only screen and (min-width: 1280px) {
    .lg\:btn--fit {
        width: fit-content;
    }
}

/* #endregion */

/* #region CTA component */
.cta {
    width: 100%;
    border-radius: var(--rounded-full);
    background-color: var(--color-secondary-dark);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem;
    padding-left: 2rem;
}

.cta .cta__text {
    color: var(--color-white);
    text-transform: uppercase;
}

.cta .cta__icon img {
    width: 2.25rem;
    aspect-ratio: 1/1;
}

.cta-group {
    display: flex;
    gap: 0.25rem;
}

.cta-group .cta {
    padding: 1rem;
    aspect-ratio: 1/1;
    flex-direction: column;
    align-items: end;
    border-radius: var(--rounded-card);
}

.cta-group .cta .cta__text {
    align-self: start;
}

.cta-group .cta .cta__icon {
    font-size: 1.75rem;
}

/* #endregion */

/* #region Breadcrumb component */
nav:has(> .breadcrumb) {
    margin-bottom: 1.5rem;
}

.breadcrumb {
    display: flex;
    align-items: center;
}

.breadcrumb .breadcrumb__item {
    text-transform: capitalize;
    font-weight: 500;
}

.breadcrumb .breadcrumb__item:not(:last-child) {
    text-transform: capitalize;
    color: var(--color-border);
}

.breadcrumb .breadcrumb__separator {
    margin: 0 0.5rem;
    margin-right: 1rem;
    color: var(--color-border);
}

/* #endregion */

/* #region Divider component */
.divider {
    width: 100%;
    height: 1px;
    background-color: var(--color-border);
    margin: 1.5rem 0;
}

/* #endregion */

/* #region Catalog Filter Item component */
.catalog__filter-item {
    padding: 0.5rem 0.75rem;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: var(--rounded-lg);
    background-color: var(--color-surface);
    width: 144px;
    height: 83px;
}

.catalog__filter-item.filter--family {
    padding: 0.75rem 0.875rem;
    width: 112px;
    height: 80px;
}

.catalog__filter-item .filter__item-img {
    width: 62px;
    height: 32px;
}

.catalog__filter-item.filter--family .filter__item-img {
    width: 100%;
    height: 32px;
}

.catalog__filter-item .filter__item-img img {
    height: 100%;
}

.catalog__filter-item.filter--family .filter__item-img img {
    width: 100%;
}

.catalog__filter-item .filter__item-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    font-size: var(--font-size-sm);
    line-height: 15px;
}

/* #endregion */

/* #region Form components */
.picker-wrapper {
    position: relative;
    width: 100%;
}

.picker-wrapper .picker {
    -webkit-appearance: none;
    appearance: none;
    border: none;
    background-color: var(--color-white);
    padding: 1rem 1.5rem;
    padding-right: 3.75rem;
    border-radius: var(--rounded-full);
}

.picker-wrapper .picker-dropdown {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(calc(-50% - 4px)) scaleY(1);
    transition: transform 0.15s ease-in-out;
}

.picker:focus+.picker-dropdown {
    transform: translateY(-50%) scaleY(-1);
}

.dropdown.input-active.single .ts-control {
    background-color: var(--color-bg-neutral);
    border: none;
    border-radius: var(--rounded-full);
}

.form__textbox {
    width: 100%;
    background-color: var(--color-bg-neutral);
    border-radius: var(--rounded-lg);
    padding: 1.156rem 0.75rem;
    font-weight: 500;
    line-height: var(--line-height-tight);
    margin-bottom: var(--form-input-spacing, 0.5rem);
}

.form__textbox::placeholder {
    color: var(--color-primary);
}

textarea.form__textbox {
    padding: 1rem;
    resize: vertical;
    min-height: 11.25rem;
}

.form__consent {
    font-weight: 400;
    font-size: var(--font-size-lg);
    color: var(--color-text);
    line-height: 1.4;
}


.form__consent a {
    color: var(--color-primary);
}

.form-checkbox-group {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.form-checkbox-group:has(+button[type="submit"]) {
    margin-bottom: 1.5rem;
}

.form-check-input+label {
    user-select: none;
}

.form-check-input+label a {
    color: var(--color-accent);
}

.form-check-input {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0;
    border-radius: 6px;
    user-select: none;
    cursor: pointer;
    overflow: hidden;
}

.form-check-input:checked {
    border-color: var(--color-accent);
    background-color: var(--color-accent);
}

.form-check-input:focus {
    border: var(--bs-border-width) solid var(--bs-border-color);
    outline: 0;
    box-shadow: none
}

*:is(textarea, input, select):has(+ .form__submit[type='submit']) {
    margin-bottom: 2rem;
}

.form__submit:has(+ .form__consent) {
    margin-bottom: 1rem;
}

.form__ctas {
    width: 100%;
    display: flex;
    gap: 0.625rem;
}

.form__ctas>* {
    flex-grow: 1;
    max-width: 213px;
}

.inputrange {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.inputrange .inputrange__group {
    position: relative;
}

.inputrange .inputrange__group label {
    position: absolute;
    top: 0.75rem;
    left: 0.5rem;
    font-weight: 500;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-tight);
    color: var(--color-primary);
    opacity: 0.6;
}

.inputrange .inputrange__group input {
    padding: 1.875rem 0.5rem 1rem;
    height: 64px;
    font-weight: 600;
    font-size: 1rem;
    line-height: var(--line-height-tight);
}

.inputrange .inputrange__divider {
    font-weight: 600;
    font-size: 1.75rem;
    line-height: 1.4;
    letter-spacing: -1%;
    text-align: center;
    color: #121317;
}

.input__group {
    position: relative;
    color: var(--color-primary);
}

.input__group select,
.input__group input[type='text'],
.input__group input[type='tel'],
.input__group input[type='email'] {
    width: 100%;
    height: 56px;
    padding: 0.594rem 3rem 0.594rem 0.75rem;
    border-radius: var(--rounded-lg);
    background-color: var(--color-bg-neutral);
    font-weight: 500;
    line-height: var(--line-height-tight);
}

.input__group label+select,
.input__group label+input[type='text'],
.input__group label+input[type='tel'],
.input__group label+input[type='email'] {
    padding: 1.719rem 3rem 0.594rem 0.75rem;
}

.input__group.input__group--rounded select,
.input__group.input__group--rounded input[type='text'],
.input__group.input__group--rounded input[type='tel'],
.input__group.input__group--rounded input[type='email'] {
    border-radius: var(--rounded-full);
    padding-left: 1.5rem;
    color: var(--color-primary);
}

.input__group.input__group--primary select,
.input__group.input__group--primary input[type='text'],
.input__group.input__group--primary input[type='tel'],
.input__group.input__group--primary input[type='email'] {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.input__group.input__date input {
    user-select: none;
}

.input__group iconify-icon,
.input__group svg {
    position: absolute;
    font-size: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    right: 0.75rem;
    color: inherit;
}

.input__group textarea {
    width: 100%;
    min-height: 120px;
    border-radius: var(--rounded-lg);
    background-color: var(--color-bg-neutral);
    padding: 0.75rem 3rem 0.594rem 0.75rem;
    font-weight: 500;
    line-height: var(--line-height-tight);
    resize: vertical;
}

.input__group label {
    position: absolute;
    top: 0.594rem;
    left: 0.75rem;
    font-weight: 500;
    font-size: var(--font-size-xs);
    line-height: var(--line-height-tight);
    color: #BFC0C0;
}

label .required {
    color: #EE4136;
}

.input__group .select-mb-sheet-trigger {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
    inset: 0;
    display: block;
}

.input__group .select-mb-sheet {
    display: none;
}

.input__group:not(:has(+ .input__group)) {
    margin-bottom: 1.5rem !important;
}

/* #endregion */

/* #region Searchbar Component */
.searchbar {
    position: relative;
}

.searchbar .search__input {
    width: 100%;
    height: 56px;
    border-radius: var(--rounded-full);
    background-color: var(--color-bg-light);
    padding: 17px 12px;
    padding-left: 48px;
}

.searchbar .search__icon {
    font-size: 1.5rem;
    color: var(--color-primary);
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

.searchbar .search__submit {
    position: absolute;
    top: 50%;
    right: 0.625rem;
    height: 2.813rem;
    min-height: auto;
    transform: translateY(-50%);
}

/* #endregion */

/* #region Tablist component */
.tablist {
    width: 100%;
    display: flex;
    padding: 0.625rem;
    gap: 8px;
    border-radius: var(--rounded-full);
    background-color: var(--color-tab-bg);
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.tablist::-webkit-scrollbar {
    display: none;
}

.tablist .tab-item {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--rounded-full);
    background-color: var(--color-tab-normal);
    /* padding: 1.25rem 1.5rem; */
    padding: 0.75rem 1rem;
    font-size: var(--font-size-xs);
    white-space: nowrap;
    cursor: pointer;
}

.tablist .tab-item.tab--active {
    background-color: var(--color-tab-active);
    color: var(--color-white);
}

.tablist__nav-group {
    position: absolute;
    display: none;
    gap: 8px;
    right: 1rem;
    top: 42.5%;
}

.tablist__nav-group .tablist__nav.tablist__nav--disabled {
    opacity: 1;
    --outlined-color: var(--color-primary);
    box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -webkit-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -moz-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    -o-box-shadow: 0px 0px 0px 1px var(--outlined-color);
    background-color: transparent;
    color: var(--outlined-color);
    padding: 0 1rem;
    cursor: auto;
    pointer-events: none;
}

/* #endregion */

/* #region Tag component */
.tag-item {
    border-radius: var(--rounded-md);
    padding: 7px 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    color: var(--color-primary);
    background-color: var(--color-white);
    box-shadow: 0px 0px 0px 1px var(--color-border);
    -webkit-box-shadow: 0px 0px 0px 1px var(--color-border);
    -moz-box-shadow: 0px 0px 0px 1px var(--color-border);
    -o-box-shadow: 0px 0px 0px 1px var(--color-border);
    font-weight: 600;
    font-size: var(--font-size-xs);
    line-height: var(--line-height-tight);
    white-space: nowrap;
}

.tag-item iconify-icon {
    width: 1.125rem;
    height: 1.125rem;
}

.tag-item.tag-item--new {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    background-color: var(--color-error);
    color: var(--color-white);
}

.tag-item.tag-item--promo {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    background-color: var(--color-secondary);
    color: var(--color-white);
}

.tag-item.tag-item--category {
    color: var(--color-danger);
}

.tag-item.tag-item--skeleton {
    background-color: var(--color-tab-normal);
    width: 3.25rem;
    height: 2rem;
    box-shadow: none;
}

.tag-item.tag-item--skeleton+.tag-item.tag-item--skeleton {
    background-color: var(--color-tab-normal);
    width: 5rem;
}

/* #endregion */

/* #region Badge component */
.badge {
    display: block;
    padding: 9px 10px;
    font-weight: 600;
    font-size: var(--font-size-xs);
    line-height: 1.2;
    background-color: var(--color-surface);
    border-radius: var(--rounded-md);
    width: fit-content;
    gap: 0.25rem
}

.badge.product__feature-item {
    padding: 7px 10px;
}

/* #endregion */

/* #region Product slider */
.products__slider {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.products__slider-tab {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.products__slider .products__tab-contents {
    position: relative;
    height: auto;
    min-height: 344px;
    flex: 1;
}

.products__tab-contents .products__slider-main {
    width: 100%;
    position: relative;
    display: none;
}

.products__tab-contents .products__slider-main.active {
    display: block;
}

.product__item {
    display: flex;
    flex-direction: column;
    background-color: var(--color-surface);
    border-radius: var(--rounded-card);
}

.product__item .product__item-top {
    padding: 0.75rem;
    padding-bottom: 0.25rem;
}

.product__item .product__item-name {
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.4;
    margin-bottom: 8px;
}

.product__item .product__item-price {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-height: calc(var(--font-size-lg) * 1.4 * 2);
}

.price--from {
    font-weight: 500;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-tight);
    align-self: normal;
    margin-top: 6px;
}

.price--listed,
.price--discount {
    font-weight: 600;
    font-size: var(--font-size-lg);
    line-height: 1.4;
}

.price--discount:has(+.price--listed) {
    color: var(--color-danger);
}

.price--discount+.price--listed {
    font-weight: 500;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-tight);
    vertical-align: middle;
    text-decoration: line-through;
    flex-basis: 100%;
}

.product__item .product__item-image {
    position: relative;
    height: 180px;
}

.product__item .product__item-image img {
    height: 100%;
    object-fit: contain;
}

.product__item .product__item-image .product__item-tags,
.calculator__car .calculator__car-image .product__item-tags {
    position: absolute;
    top: 8px;
    left: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.product__item .product__item-bottom {
    padding: 0.75rem;
    padding-top: 0;
}

.product__item-bottom .product__item-colors {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-size: var(--font-size-base);
    height: 25px;
}

.product__item-colors .product__colors-list {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.product__color-item {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: var(--rounded-full);
    box-shadow: 0px 0px 0px 1px var(--color-primary);
    -webkit-box-shadow: 0px 0px 0px 1px var(--color-primary);
    -moz-box-shadow: 0px 0px 0px 1px var(--color-primary);
    -o-box-shadow: 0px 0px 0px 1px var(--color-primary);
}

.product__item-features {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    margin-bottom: 1rem;
    min-height: 4.5rem;
    align-items: flex-start;
    /* overscroll-behavior: none; */
}

.product__item-features .product__feature-item {
    display: flex;
    align-items: center;
    background-color: var(--color-white);
    color: var(--color-primary);
}

.product__item-features .product__feature-item img {
    height: 18px;
}

.product__item-region {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #00070866;
    font-size: var(--font-size-xs);
    font-weight: 700;
    text-transform: uppercase;
    min-height: 1.5rem;
    margin-bottom: 1.375rem;
}

.product__item-region img {
    height: 1.5rem;
}

.product__item-cta {
    padding: 0 2.3rem;
    min-height: 40px;
    font-size: var(--font-size-sm);
}

.products__all {
    justify-content: start;
    padding-left: 4rem;
}
.products__slider-all {
  margin-top: auto;
  align-self: flex-end; 
}
/* #endregion */

/* #region Product grid - product item override*/
/* .product__grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.5rem;
    margin-bottom: 1.25rem;
} */
.related-cars__slider .swiper-wrapper {
  display: flex;
  margin-bottom: 1rem;
}

.related-cars__slider .swiper-slide {
  width: auto;
  flex-shrink: 0;
}
/* #endregion */

/* #region Specs table component */
.specs__details-main .specs__details:has(.specs__table) {
    border-radius: 0;
}

.specs__table {
    width: 100%;
    min-width: 1408px;
    overflow-x: scroll;
    border: 1px solid var(--color-border);
    border-radius: var(--rounded-sm);
}

.specs__table .specs__table-header {
    background-color: var(--color-secondary);
    width: 100%;
    border-collapse: collapse;
}

.specs__table .specs__table-header .specs__table-hcell {
    padding: 2.125rem 1.5rem;
    padding-left: 1.75rem;
    text-align: left;
    font-weight: 400;
    color: var(--color-white);
    text-transform: uppercase;
    line-height: 1.4;
    border: 1px solid var(--color-border);
    width: calc(100% / 3);
}

.specs__table .specs__table-body {
    color: var(--color-primary);
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-collapse: collapse;
}

.specs__table .specs__table-body .specs__table-group {
    background-color: var(--color-surface);
    padding: 0.75rem 1rem;
    text-transform: uppercase;
    line-height: 1.4;
}

.specs__table .specs__table-body .specs__table-bcell {
    padding: 0.75rem 0.75rem;
    border: 1px solid var(--color-border);
}

/* #endregion */

/* #region Pagination component */
.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pagination .pagination__nav {
    --outlined-color: var(--color-border);
    color: var(--color-primary);
    min-height: 40px;
    padding: 0.5rem;
    font-size: 1.125rem;
    transition: all 0.2s ease-in-out;
}

.pagination__nav:hover {
    --outlined-color: var(--color-primary);
    background-color: var(--color-primary);
    color: var(--color-white);
}

.pagination .pagination__pages {
    display: flex;
    gap: 0.5rem;
}

.pagination__pages .page-item {
    background-color: var(--color-bg-neutral);
    color: var(--color-primary);
    border-radius: var(--rounded-full);
    width: 77px;
    height: 40px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.page-item:hover,
.page-item.page--current {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.pagination .pagination__nav *:not(iconify-icon) {
    display: none;
}

/* #endregion */

/* #region Promo item component */
.promo__item {
    background-color: var(--color-white);
    border-radius: var(--rounded-xl);
    padding: 1rem;
}

.promo__item .promo__item-icon {
    padding: 1.5rem;
    border-radius: var(--rounded-full);
    background-color: var(--color-bg-neutral);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 7rem;
    height: 7rem;
    font-size: 3rem;
    margin-bottom: 1rem;
}

.promo__item .promo__item-title {
    font-weight: 600;
    font-size: 1.375rem;
    line-height: 1.4;
    letter-spacing: -1%;
    margin-bottom: 1rem;
}

.promo__item .promo__item-description {
    font-weight: 500;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* #endregion */

/* #region Dealer List component */
.dealers__list-main {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 466px;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow: -moz-scrollbars-none;
}

.dealers__list .dealers__list-main::-webkit-scrollbar {
    display: none;
}

.dealers__list-main .dealer__item {
    padding: 0.75rem;
    background-color: var(--color-surface);
    border-radius: var(--rounded-xl);
    cursor: pointer;
}

.dealer__item .dealer__item-top {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.dealer__item .dealer__item-top .dealer__item-name {
    font-weight: 600;
    font-size: var(--font-size-base);
    line-height: 1.4;
    height: calc(var(--font-size-base)*1.4*3);
    flex-grow: 1;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.dealer__item .dealer__item-top .dealer__item-ctas {
    display: flex;
    gap: 1rem;
    color: var(--color-text-neutral);
}

.dealer__item .dealer__item-top .dealer__item-ctas a.btn {
    background-color: var(--color-white);
}

.dealer__item .dealer__item-bottom {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: var(--font-size-sm);
    line-height: 120%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: var(--color-text-neutral);

}

/* #endregion */

/* #region Map component */
#map {
    width: 100%;
    height: 100%;
}

/* #endregion */

/* #region Sidebar filter component */
.sidebar__filter {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    background: var(--color-surface);
    border-radius: var(--rounded-card);
    gap: 0.5rem;
}

.sidebar__filter .sidebar__filter-all {
    padding: 1.5rem 0;
    display: none;
}

.sidebar__filter .sidebar__filter-all .btn__filter-all {
    width: 186px;
    gap: 0.75rem;
    font-weight: 500;
    font-size: var(--font-size-lg);
    line-height: 140%;
    letter-spacing: 0%;
    text-transform: uppercase;
}


.sidebar__filter .sidebar__filter-all .btn__filter-all iconify-icon {
    font-size: 1.5rem;
}

.sidebar__filter .filter__price-rangeslider {
    padding: 3rem 0.875rem 3.5rem;
}

.sidebar__filter .sidebar__filter-group {
    padding: 1.5rem;
    background-color: var(--color-white);
    border-radius: var(--rounded-xl);
}

.sidebar__filter .filter-group__heading {
    font-weight: 700;
    font-size: var(--font-size-lg);
    line-height: 1.4;
    text-transform: uppercase;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.sidebar__filter .filter-group__toggle {
    padding: 0.25rem;
    width: 2rem;
    height: 2rem;
    min-height: auto;
    box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -webkit-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -moz-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;
    -o-box-shadow: 0px -3px 0px 1px #0000001A inset, 0px 2px 0px 0px #FFFFFF40 inset, 0px 2px 5px 0px #140E3E40;

}

.sidebar__filter .sidebar__filter-checkbox .sidebar__filter-main {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-height: 100vh;
    transition: none;
}

/* #endregion */

/* #region Blog item component */
.blog__item {
    border-radius: var(--rounded-card);
    background-color: var(--color-surface);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.blog__item .blog__item-thumbnail {
    height: 300px;
}

.blog__item .blog__item-thumbnail img {
    width: 100%;
    height: 100%;
}

.blog__item .blog__item-content {
    padding: 1.5rem;
}

.blog__item-content .blog__item-tags {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.blog__item-content .blog__item-title {
    display: flex;
    align-items: center;
    height: 93px;
    margin-bottom: 0.5rem;
}

.blog__item-content .blog__item-title .blog__title-text {
    flex-grow: 1;
    font-weight: 600;
    font-size: 1.375rem;
    line-height: 1.4;
    letter-spacing: -1%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.blog__item-content .blog__item-title .blog__title-link {
    font-size: 1.375rem;
    width: 3rem;
    height: 3rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog__item-content .blog__item-description {
    font-weight: 500;
    line-height: var(--line-height-tight);
    color: #475467;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.blog__item-content .blog__item-description:has(+ .blog__item-event) {
    margin-bottom: 1.375rem;
}

.blog__item-content .blog__item-event {
    background: var(--color-white);
    border-radius: var(--rounded-lg);
    padding: 1rem;
    padding-left: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem
}

.blog__item-content .blog__item-event .blog__event-info {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.blog__item-content .blog__item-event .blog__event-info .blog__event-info-icon {
    background-color: var(--color-surface);
    border-radius: var(--rounded-full);
    padding: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.blog__item-content .blog__item-event .blog__event-info .blog__event-info-value {
    font-weight: 600;
    font-size: var(--font-size-lg);
    line-height: 1.4;
}


/* #endregion */

/* #region Blog item component - Skeleon */
.blog__item.blog__item--skeleton .blog__item-thumbnail {
    background-color: var(--color-tab-normal);
    animation: var(--animate-pulse);
}

.blog__item.blog__item--skeleton .blog__title-text p {
    height: calc(1.375rem * 1.4);
    width: 100%;
    background-color: var(--color-tab-normal);
    border-radius: var(--rounded-md);
    animation: var(--animate-pulse);
}

.blog__item.blog__item--skeleton .blog__title-text p:not(:last-child) {
    margin-bottom: 0.5rem;
}

.blog__item.blog__item--skeleton .blog__title-text p:last-child {
    width: 40%;
}

.blog__item.blog__item--skeleton .blog__item-description p {
    height: calc(1rem * 1.2);
    width: 100%;
    background-color: var(--color-tab-normal);
    border-radius: var(--rounded-md);
    animation: var(--animate-pulse);
}

.blog__item.blog__item--skeleton .blog__item-description p:not(:last-child) {
    margin-bottom: 0.5rem;
}

.blog__item.blog__item--skeleton .blog__item-description p:last-child {
    width: 40%;
}


/* #endregion */

/* #region Blogs grid component */
.blogs__grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.blogs__grid-loadmore {
    margin: 0 auto;
}

/* #endregion */

/* #region Request form */
main .request__form:first-child {
    padding-top: calc(var(--header-height) + var(--header-padding) * 2 + 1rem);
}

.request__form {
    padding: 0.5rem 0;
}

.request__form .request__form-inner {
    padding: 1.5rem;
    background-color: var(--color-surface);
    border-radius: var(--rounded-card);
    margin-bottom: 0.5rem;
}

.request__form .section-title {
    margin-bottom: 1.5rem;
}

.request__form .request__form-main .input__group {
    margin-bottom: 0.5rem;
}

.request__form .request__form-main .input__group:has(+ .form-checkbox-group) {
    margin-bottom: 1.5rem;
}

.request__form .request__form-main .form-checkbox-group {
    margin-bottom: 1.5rem;
}

.request__form .request__form-main .request__form-submit {
    width: 140px;
}

/* #endregion */

/* #region Contact group component */
.contact-info__group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.contact-info__group:last-child {
    margin-bottom: 0;
}

.contact-info__group .contact-info__group-title {
    display: none;
}

.contact-info__group-item {
    background-color: var(--color-bg-neutral);
    border-radius: var(--rounded-card);
    padding: 1.25rem 1rem;
    padding-right: 6rem;
    position: relative;
}

.contact-info__group-item .contact-info__group-label {
    font-weight: 500;
    font-size: var(--font-size-lg);
    line-height: 1.4;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
    color: #3C3D3D;
}

.contact-info__group-item .contact-info__group-value {
    font-weight: 600;
    font-size: var(--font-size-h5);
    line-height: 1.4;
    letter-spacing: -1%;
}

.contact-info__group-item .contact-info__group-value.contact__value--xl {
    font-size: var(--font-size-h3);
    line-height: var(--line-height-tight);
}

.contact-info__group-item .contact-info__group-value.contact__value--lg {
    font-size: var(--font-size-h4);
    line-height: 1.3;
}

.contact-info__group-item .contact-info__group-icon {
    font-size: 2.25rem;
    padding: 0.625rem;
    box-sizing: content-box;
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

/* #endregion */

/* #region Contact block component */
.contact-block {
    padding: 0.5rem 0;
}

.contact-block .contact-info {
    padding-bottom: 0.5rem;
}

.contact-block .contact-info .section-title {
    margin-bottom: 2rem;
    font-weight: 600;
    font-size: 2.75rem;
    line-height: var(--line-height-tight);
    letter-spacing: -1%;
    text-transform: uppercase;
}

.contact-block .contact-info .contact-info__content {
    background-color: var(--color-surface);
    border-radius: var(--rounded-card-lg);
    padding: 1.5rem;
}

/* #endregion */

/* #region Social network component */
.social-networks {
    padding: 0.5rem 0;
    height: 412px;
}

.social-networks__inner {
    height: 100%;
}

.social-networks .social-networks__main {
    background-color: var(--color-secondary);
    border-radius: var(--rounded-card);
    color: var(--color-white);
    padding: 2rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.social-networks__main .section-title {
    font-weight: 600;
    font-size: 2.75rem;
    line-height: var(--line-height-tightn);
    letter-spacing: -1%;
    text-transform: uppercase;
    margin-bottom: 0.625rem;
}

.social-networks__main .section-description {
    font-weight: 500;
    font-size: var(--font-size-lg);
    line-height: 1.4;
    color: var(--color-btn-sub);
}

.social-networks__main .social-networks__links {
    width: 100%;
    display: flex;
    gap: 0.5rem;
    margin-top: auto;
}

.social-networks__link {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3.5rem;
    width: 3.5rem;
    font-size: 2.25rem;
    padding: 0.625rem;
    border-radius: var(--rounded-full);
    background-color: var(--color-text-neutral);
}

/* #endregion */

/* #region Testimonial video item */
.testimonial__item--video {
    background-color: var(--color-surface);
    border-radius: var(--rounded-display);
    padding: 1rem;
}

.testimonial__item--video .testimonial__video-thumbnail {
    border-radius: var(--rounded-display);
    overflow: hidden;
    width: 100%;
    height: 192px;
    margin-bottom: 1.5rem;
}

.testimonial__item--video .testimonial__video-thumbnail img {
    width: 100%;
    height: 100%;
}

.testimonial__video-thumbnail.video__player .btn--play {
    height: 3.5rem;
    width: 3.5rem;
    background: #00070866;
    padding: 0.875rem 0.75rem;
    padding-left: 1rem;
}

.testimonial__video-content .testimonial__video-title {
    font-weight: 600;
    font-size: 1.375rem;
    line-height: 1.4;
    letter-spacing: -1%;
    margin-bottom: 0.5rem;
}

.testimonial__video-content .testimonial__video-description {
    color: #535862;
}

/* #endregion */

/* #region Testimonial video item - Skeleton */
.testimonial__item--video.testimonial__item--skeleton .testimonial__video-thumbnail {
    overflow: hidden;
    display: block;
    background-color: var(--color-tab-normal);
    animation: var(--animate-pulse);
}

.testimonial__item--video.testimonial__item--skeleton .testimonial__video-content .testimonial__video-title {
    height: calc(1.375rem * 1.4);
    width: 40%;
    background-color: var(--color-tab-normal);
    border-radius: var(--rounded-md);
    animation: var(--animate-pulse);
}

.testimonial__item--video.testimonial__item--skeleton .testimonial__video-content .testimonial__video-description {
    height: calc(1rem * 1.2);
    width: 60%;
    background-color: var(--color-tab-normal);
    border-radius: var(--rounded-md);
    animation: var(--animate-pulse);
}

/* #endregion */

/* #region Bottomsheet */
.bs__sheet {
    --moving-bar-height: 24px;
    height: var(--moving-bar-height);
    margin-top: 0.25rem;
    min-height: var(--moving-bar-height);
    position: fixed;
    bottom: 0;
    z-index: 10000;
    width: 100%;
}

.bs__sheet-overlay {
    inset: 0;
    background-color: #00070826;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    position: fixed;
    z-index: 9999;
}

.bs__sheet .bs__sheet-inner {
    background-color: #fff;
    border-radius: var(--rounded-card-lg);
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    box-shadow: 0 0 4px #12131733;
    display: flex;
    flex-direction: column;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    user-select: none;
}

.bs__sheet .bs__sheet-control {
    align-items: center;
    cursor: grab;
    display: flex;
    justify-content: center;
    padding-bottom: 0.75rem;
    padding-top: 0.5rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.bs__sheet .bs__sheet-control .bs__sheet-control-line {
    background-color: #121317;
    border-radius: var(--rounded-lg);
    height: 4px;
    opacity: .6;
    width: 80px;
}

.bs__sheet .bs__sheet-content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0 0.5rem;
    position: relative;
    height: calc(100% - 1.5rem);
}

.bs__sheet .dealer__detail .dealer__detail-content {
    height: calc(100% - 3.5rem);
    display: flex;
    flex-direction: column
}

.bs__sheet form {
    height: calc(100% - 4rem);
    display: flex;
    flex-direction: column
}

/* #endregion */

@media only screen and (min-width: 360px) {


    /* #region Choicejs override */
    .choices {
        background-color: var(--color-bg-neutral);
        border: none;
        border-radius: var(--rounded-full);
        font-weight: 500;
        font-size: var(--font-size-lg);
        line-height: 1.4;
        padding: 15.5px 0;
        padding-left: 1rem;
        padding-right: 2.875rem;
        width: 100%;
        margin-bottom: 0;
    }

    /* #endregion */


    /* #region Button component */
    .btn {
        min-height: 56px;
    }

    .btn--all {
        background-color: var(--color-secondary);
        color: var(--color-white);
        width: 100%;
        padding: 1.313rem 2.5rem;
        font-weight: 600;
        font-size: 2rem;
        line-height: var(--line-height-tight);
        letter-spacing: -1%;
        text-transform: uppercase;
        border-radius: var(--rounded-card);
        position: relative;
    }

    .btn--all iconify-icon {
        position: absolute;
        width: 3rem;
        height: 3rem;
        right: 1rem;
    }

    .btn--icon {
        aspect-ratio: 1/1;
        padding: 1rem;
        font-size: 1.5rem;
    }

    /* #endregion */

    /* #region Tablist component */
    .tablist {
        width: 100%;
        display: flex;
        padding: 0.625rem;
        gap: 8px;
        border-radius: var(--rounded-full);
        background-color: var(--color-tab-bg);
        overflow-y: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
        /* margin: 0 3rem; */
    }

    .tablist::-webkit-scrollbar {
        display: none;
    }

    .tablist .tab-item {
        font-size: var(--font-size-base);
        padding: 1.25rem 1.5rem;
    }

    .tablist .tab-item.tab--active {
        background-color: var(--color-tab-active);
        color: var(--color-white);
    }

    .tablist__nav-group {
        position: absolute;
        display: none;
        gap: 8px;
        right: 1rem;
        top: 42.5%;
    }

    .tablist__nav-group .tablist__nav.tablist__nav--disabled {
        opacity: 1;
        --outlined-color: var(--color-primary);
        box-shadow: 0px 0px 0px 1px var(--outlined-color);
        -webkit-box-shadow: 0px 0px 0px 1px var(--outlined-color);
        -moz-box-shadow: 0px 0px 0px 1px var(--outlined-color);
        -o-box-shadow: 0px 0px 0px 1px var(--outlined-color);
        background-color: transparent;
        color: var(--outlined-color);
        padding: 0 1rem;
        cursor: auto;
        pointer-events: none;
    }

    /* #endregion */

    /* #region Badge component */
    .badge {
        padding: 9px 10px;
        font-size: var(--font-size-xs);
    }

    .badge.product__feature-item {
        padding: 7px 10px;
    }

    /* #endregion */

    /* #region Product slider */
    .products__slider {
        gap: 16px;
    }

    .products__slider .products__tab-contents {
        height: 402px;
        margin-bottom: 8px;
    }

    .product__item .product__item-top {
        padding: 1rem;
    }

    .product__item .product__item-name {
        font-size: 1.375rem;
    }

    .product__item .product__item-price {
        min-height: 52px;
    }

    .price--from {
        margin-top: 10px;
    }

    .price--listed,
    .price--discount {
        font-size: 1.375rem;
    }

    .product__item .product__item-image {
        height: 220px;
    }

    .product__item .product__item-bottom {
        padding: 1rem;
        padding-top: 0;
    }

    .product__item-bottom .product__item-colors {
        font-size: var(--font-size-lg);
    }

    .product__item-cta {
        font-size: var(--font-size-base);
    }

    /* #endregion */

    /* #region Dealer List component */
    .dealers__list-main .dealer__item {
        padding: 1.5rem;
    }

    .dealer__item .dealer__item-top {
        margin-bottom: 1rem;
    }

    .dealer__item .dealer__item-top .dealer__item-name {
        font-size: var(--font-size-lg);
        height: calc(var(--font-size-lg)*1.4*3);
    }

    /* #endregion */

}

@media only screen and (min-width: 1280px) {

    /* #region Choicejs override */
    .choices {
        padding: 15.5px 0;
        padding-left: 24px;
        padding-right: 60px;
    }

    /* #endregion */


    /* #region Glightbox override */
    .goverlay {
        background-color: #00070826;
        backdrop-filter: blur(24px);
        -webkit-backdrop-filter: blur(24px);
    }

    .glightbox-clean .gclose {
        --close-btn-spacing: 6px;
        width: 3rem;
        height: 3rem;

        background-color: var(--color-text-neutral);
        top: calc(50% - (960px * (9 / 16))/2);
        left: calc(50% + (960px / 2) + var(--close-btn-spacing));
        border-radius: var(--rounded-full);
        transform: translateX(0);
        position: absolute;
    }

    /* #endregion */

    /* #region CTA component */
    .cta {
        padding-left: 3.5rem;
    }

    .cta .cta__icon {
        width: 6rem;
        aspect-ratio: 1/1;
        padding: 0.625rem;
    }

    .cta .cta__icon img {
        width: 4.5rem;
    }

    /* #endregion */

    /* #region Divider component */
    .divider.divider-lg-vertical {
        width: 1px;
        height: 100%;
        margin: 0 1.5rem;
    }

    /* #endregion */

    /* #region Catalog Filter Item component */
    .catalog__filter-item {
        padding: 1rem 1.25rem;
        width: 226px;
        height: 128px;
    }

    .catalog__filter-item.filter--family {
        flex-direction: row-reverse;
        align-items: start;
        padding: 0.625rem 1rem;
        width: 266px;
        height: 80px;
    }

    .catalog__filter-item .filter__item-text {
        margin: 0.625rem 0;
    }

    .catalog__filter-item .filter__item-img {
        width: 116px;
        height: 44px;
    }

    .catalog__filter-item.filter--family .filter__item-img {
        width: 50%;
        height: 60px;
    }

    .catalog__filter-item .filter__item-img img {
        height: 100%;
    }

    .catalog__filter-item.filter--family .filter__item-img img {
        width: 100%;
    }

    .catalog__filter-item:not(.filter--family) .filter__item-text {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
        font-weight: 600;
        font-size: var(--font-size-sm);
        line-height: 15px;
        height: 40px;
    }

    /* #endregion */

    /* #region Tablist component */
    .tablist__nav-group {
        display: flex;
    }

    /* #endregion */

    /* #region Sidebar filter component */
    .sidebar__filter .sidebar__filter-all {
        display: block;
    }

    /* #endregion */

    /* #region Product slider */
    .products__slider {
        overflow: hidden;
    }

    .products__slider-nav-group .products__slider-nav {
        position: static;
    }

    .product__item-colors {
        display: flex;
    }

    .product__item .product__item-name {
        height: 51px;
        display: flex;
        align-items: center;
    }

    .product__item .product__item-price {
        min-height: auto;
        height: 32px;
    }

    .product__item-price .price--discount+.price--listed {
        flex-basis: auto;
        align-self: flex-end;
        margin-bottom: 4px;
    }

    .product__item .product__item-top {
        padding: 1.875rem 1.5rem 0.875rem;
    }

    .product__item .product__item-bottom {
        padding: 1.5rem;
        padding-top: 0;
    }
    .product__item-features {
        display: flex;
        flex-wrap: wrap;
        gap: .25rem;
        margin-bottom: 1rem;
        min-height: 4.5rem;
        align-items: flex-start;
    }
    /* #endregion */

    /* #region Product grid component */
    .product__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-bottom: 3.5rem;
    }

    .product__grid+.product__grid-pagination {
        margin: 3.75rem 0;
    }

    /* #endregion */

    /* #region Pagination component */
    .pagination {
        justify-content: end;
        gap: 0.5rem;
    }

    .pagination .pagination__nav {
        height: 3.5rem;
        font-size: 1.5rem;
        width: fit-content;
        aspect-ratio: unset;
        align-items: center;
        gap: 0.75rem;
    }

    .pagination .pagination__nav .nav-text {
        font-weight: 700;
        font-size: var(--font-size-lg);
        line-height: 1.4;
        text-transform: uppercase;
    }

    .pagination .pagination__nav.pagination__nav-left {
        padding-right: 1.5rem;
        padding-left: 1rem;
    }

    .pagination .pagination__nav.pagination__nav-right {
        padding-left: 1.5rem;
        padding-right: 1rem;
    }

    .pagination__pages .page-item {
        width: 3.5rem;
        height: 3.5rem;
    }

    .pagination .pagination__nav *:not(iconify-icon) {
        display: inline;
    }

    .pagination:has(.pagination__pages .page--current:first-child) .pagination__nav.pagination__nav-left {
        display: none;
    }

    .pagination:has(.pagination__pages .page--current:last-child) .pagination__nav.pagination__nav-right {
        display: none;
    }

    /* #endregion */

    /* #region Form components */
    .input__group .select-mb-sheet-trigger {
        display: none;
    }

    /* #endregion */

    /* #region Specs table component */
    .specs__table {
        width: 100%;
        min-width: auto;
    }

    /* #endregion */

    /* #region Blogs grid component */
    .blogs__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* #endregion */

    /* #region Contact group component */
    .contact-info__group {
        flex-basis: 50%;
        padding: 1.5rem 2rem;
        background-color: var(--color-white);
        border-radius: var(--rounded-card);
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        height: 244px;
        margin-bottom: 0;
    }

    .contact-info__group .contact-info__group-item {
        flex-basis: calc(50% - 0.5rem/2);
        padding: 0;
        background-color: transparent;
        height: fit-content;
    }

    .contact-info__group-item .contact-info__group-icon {
        display: none;
    }

    .contact-info__group:first-child .contact-info__group-item:first-child {
        flex-basis: 100%;
    }

    .contact-info__group .contact-info__group-title {
        display: block;
        flex-basis: 100%;
        font-weight: 500;
        font-size: var(--font-size-lg);
        color: var(--color-text);
        line-height: 1.4;
        text-transform: uppercase;
    }

    .contact-info__group-item .contact-info__group-label {
        text-transform: none;
        font-size: 1.375rem
    }
    .contact-info__group-item:first-of-type .contact-info__group-label:first-child{
        font-size: 18px;
    }
    .contact-info__group-item .contact-info__group-value {
        font-size: var(--font-size-lg);
    }

    /* #endregion */

    /* #region Contact block component */
    .contact-block .contact-info .contact-info__content {
        padding-top: 4rem;
    }

    .contact-info__main {
        display: flex;
        gap: 0.5rem;
    }

    /* #endregion */

    /* #region Social network component */
    .social-networks {
        padding: 0.5rem 0;
        height: fit-content;
    }

    .social-networks__inner {
        height: 100%;
    }

    .social-networks .social-networks__main {
        flex-direction: row;
    }

    .social-networks__main .section-title-group {
        flex-basis: 40%;
    }

    .social-networks__main .social-networks__links {
        flex-basis: 60%;
        justify-content: end;
    }

    .social-networks__main .section-description {
        font-weight: 500;
        font-size: var(--font-size-lg);
        line-height: 1.4;
        color: var(--color-btn-sub);
    }

    .social-networks__main .social-networks__links {
        margin-top: 0;
    }

    .social-networks__link {
        width: 8.75rem;
        height: 8.75rem;
        font-size: 5.75rem;
    }

    /* #endregion */

    /* #region Testimonial video item */

    .testimonial__item--video .testimonial__video-thumbnail {
        height: 376px;
    }

    /* #endregion */

}

@media only screen and (min-width: 1536px) {
    .product__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}