/* bg */
.bg-primary {
    background-color: var(--color-primary);
    color: var(--color-text-extralight);
}
.bg-primary-light {
    background-color: var(--color-primary-light);
}
.bg-dark {
    background-color: var(--color-dark);
    color: var(--color-text-extralight);
}
.bg-grey-dark {
    background-color: var(--color-grey-dark);
    color: var(--color-text-extralight);
}
.bg-secondary {
    background-color: var(--color-bg-secondary);
    color: var(--color-text-extralight);
}
.bg-muted {
    background-color: var(--color-muted);
    color: var(--color-text);
}
.bg-extralight {
    background-color: var(--color-extralight);
    color: var(--color-text-dark);
}
.bg-blue-light {
    background-color: var(--color-blue-light);
}
.bg-positive {
    background-color: var(--color-positive);
}
.bg-orange {
    background-color: var(--color-orange);
}
.bg-purple {
    background-color: var(--color-purple);
}
.bg-blue-light-secondary {
    background-color: var(--color-blue-light-secondary);
}
.bg-example-grey {
    background-color: transparent;
}

/* color */
.color-primary {
    color: var(--color-primary);
}
.color-secondary {
    color: var(--color-secondary);
}
.color-purple {
    color: var(--color-purple);
}
.color-text-muted {
    color: var(--color-text-muted);
}
.color-grey-quaternary {
    color: var(--color-grey-quaternary);
}
.color-grey-40 {
    color: var(--color-grey-40);
}
.color-grey-foreground {
    color: var(--color-grey-foreground);
}
.color-success {
    color: var(--color-success);
}
.color-error {
    color: var(--color-error);
}
.color-orange {
    color: var(--color-orange);
}
.color-default-secondary {
    color: var(--color-default-secondary);
}
.color-white-48 {
    color: var(--color-white-48);
}
.color-white-64 {
    color: var(--color-white-64);
}
.color-white-70 {
    color: var(--color-white-70);
}
.color-danger {
    color: var(--color-danger);
}
.color-seafoam {
    color: var(--color-seafoam);
}


/* contact */
.contact {
    display: flex;
    align-items: center;
    gap: var(--offset-medium);
    transition: var(--transition);
}
.contact__body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.contact__list {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.25rem;
}

/**/
.contact-simple {
    --size-icon-element: var(--size-icon);

    display: inline-flex;
    align-items: center;
    gap: var(--offset-extrasmall);
    transition: var(--transition);
}
.contact-simple svg {
    min-width: var(--size-icon-element);
    width: var(--size-icon-element);
    min-height: var(--size-icon-element);
    height: var(--size-icon-element);
    color: var(--color-primary);
}

@media screen and (max-width: 1023.5px) {
    .contact {
        gap: var(--offset-secondary);
    }
    .contact-simple {
        --size-icon-element: var(--size-icon-medium);
    }
}

/* dropdown */
.dropdown {
    position: relative;
}
.dropdown__list {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border: 0.0625rem solid var(--color-dark);
    border-top: none;
    overflow: hidden;
    background-color: var(--color-bg);
    transform: translateY(100%);
    transition: var(--transition);
    opacity: 0;
    pointer-events: none;
}

.dropdown._active .dropdown__list {
    opacity: 1;
    pointer-events: all;
}
.dropdown._active .dropdown__button {
    border: 0.0625rem solid var(--color-dark);
    border-bottom: none;
}


/* spoiler */
.accordion {
    padding: var(--offset-extrasmall) 0;
    display: flex;
    flex-direction: column;
    text-align: left;
    width: 100%;
}
.accordion__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-extrasmall);
    text-align: left;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: var(--font-regular);
    text-transform: uppercase;
}
.accordion__btn svg {
    min-width: var(--size-icon);
    width: var(--size-icon);
    min-height: var(--size-icon);
    height: var(--size-icon);
    transition: var(--transition);
}
.accordion__btn svg path:last-child {
    transition: var(--transition);
}
.accordion__wrapper {
    transition: var(--transition);
    display: grid;
    grid-template-rows: 1fr;
}
.accordion__content {
    overflow: hidden;
}
.accordion__list {
    display: flex;
    flex-direction: column;
}
.accordion__link {
    display: block;
    padding: var(--offset-extrasmall) 0;
    font-size: 0.875rem;
}

.accordion._active .accordion__btn svg path:last-child {
    opacity: 0;
}
.accordion:not(._active) .accordion__wrapper {
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
}
.accordion._active .accordion__wrapper {
    padding-top: var(--offset-extrasmall);
}

/* spoiler */
.spoiler {
    --size-icon-block: 2.25rem;
    --offset-block: 1.25rem;

    display: flex;
    flex-direction: column;
    padding: var(--offset-block) 0;
    border-bottom: 0.0625rem solid var(--color-muted);
}
.spoiler__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-extrasmall);
    text-align: left;
}
.spoiler__btn svg {
    min-width: var(--size-icon-block);
    width: var(--size-icon-block);
    min-height: var(--size-icon-block);
    height: var(--size-icon-block);
    transition: var(--transition);
}
.spoiler__body {
    margin-top: var(--offset-medium);
}
.spoiler__wrapper {
    transition: var(--transition);
    display: grid;
    grid-template-rows: 1fr;
}
.spoiler__content {
    overflow: hidden;
}

.spoiler._active .spoiler__btn svg {
    transform: rotate(45deg);
}
.spoiler:not(._active) .spoiler__wrapper {
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
}


.spoiler-big {
    --offset-block: var(--offset-medium);
    --size-icon-block: 3rem;

    border-top: 0.0625rem solid var(--color-muted);
    border-bottom: none;
}

/* menu */
.menu {
    --size-icon-element: var(--size-icon-medium);
    --size-divider: 0.25rem;
    --bgc-divider: var(--color-black-32);
}
.menu-list,
.menu-list__item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--offset-extrasmall);
}
.menu-list__item {
    position: relative;
}
.menu-list__item:not(:first-child)::before {
    content: '';
    min-width: var(--size-icon-element);
    width: var(--size-icon-element);
    min-height: var(--size-icon-element);
    height: var(--size-icon-element);
}
.menu-list__item:not(:first-child)::after {
    content: '';
    position: absolute;
    width: var(--size-divider);
    height: var(--size-divider);
    border-radius: 50%;
    top: calc(50% - var(--size-divider) / 2);
    left: calc((var(--size-icon-element) - var(--size-divider)) / 2);
    background-color: var(--bgc-divider);
    pointer-events: none;
}

@media screen and (min-width: 1024px) {
    .menu-list__link:hover {
        color: var(--color-primary);
    }
}
.menu-list__link:active {
    color: var(--color-primary);
}
@media screen and (max-width: 1023.5px) {
    .menu {
        --size-icon-element: var(--size-icon-semimedium);
    }
}


/**/
.menu_translucent {
    padding: 0 0.875rem;
    background-color: var(--color-white-20);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
    border-radius: var(--radius);
    color: var(--color-text-menu, var(--color-text-extralight));
}

/* menu-mobile */
.menu-mobile {
    --height-btn: 2.5rem;

    border-radius: 6.25rem;
    overflow: hidden;
    background-color: var(--color-muted);
}
.menu-mobile__list {
    display: flex;
    align-items: stretch;
    padding: var(--offset-extrasmall) 0;
}
.menu-mobile__item {
    flex: 1 0 0;
}
.menu-mobile__link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: var(--height-btn);
    color: var(--color-dark);
}
.menu-mobile__link svg {
    width: var(--size-icon);
    height: var(--size-icon);
}

@media screen and (min-width: 1024px) {
    .menu-mobile__item:hover .menu-mobile__link {
        color: var(--color-muted);
    }
}
.menu-mobile__item:active .menu-mobile__link {
    color: var(--color-muted);
}

/* breadcrumbs */
.breadcrumbs {
    --size-icon-breadcrumbs: 0.75rem;

    padding: var(--offset-breadcrumbs, var(--offset-breadcrumbs-top, 0px)) 0 var(--offset-breadcrumbs, var(--offset-breadcrumbs-bottom, 0px));
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
}
.breadcrumbs::-webkit-scrollbar,
.breadcrumbs::-webkit-scrollbar-track,
.breadcrumbs::-webkit-scrollbar-thumb {
    display: none;
}

.breadcrumbs,
.breadcrumbs__item,
.breadcrumbs__link {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.breadcrumbs__icon {
    min-width: var(--size-icon-breadcrumbs);
    width: var(--size-icon-breadcrumbs);
    min-height: var(--size-icon-breadcrumbs);
    height: var(--size-icon-breadcrumbs);
}
.breadcrumbs__icon svg {
    display: block;
    width: 100%;
    height: 100%;
}
.breadcrumbs__start {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

/**/
@media screen and (max-width: 1712px) {
    .breadcrumbs_container {
        margin-left: calc(var(--grid-gap) * -1);
        margin-right: calc(var(--grid-gap) * -1);
        padding-left: var(--grid-gap);
        padding-right: var(--grid-gap);
        width: calc(100% + var(--grid-gap) * 2);
    }
}
@media screen and (max-width: 1279px) {
    .breadcrumbs__start {
        padding: 0;
    }
    .breadcrumbs__start svg {
        width: var(--size-icon-small);
        height: var(--size-icon-small);
    }
}



/* list icons */
.list-icons {
    --size-icon-element: 1.5rem;
    --offset-element: var(--offset-small);
    --offset-element-divide: var(--offset-secondary);
}
.list-icons li {
    display: flex;
    align-items: center;
    gap: var(--offset-element);
    text-align: left;
}
.list-icons li::before {
    align-self: start;
    content: '';
    min-width: var(--size-icon-element);
    width: var(--size-icon-element);
    min-height: var(--size-icon-element);
    height: var(--size-icon-element);
    border-radius: 50%;
    background-image: url('../../images/icons/bullet.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1rem;
}
.list-icons li:not(:first-child) {
    margin-top: var(--offset-element-divide);
}
.list-icons li:not(:last-child) {
    margin-bottom: var(--offset-element-divide);
}

/* numbers */
ol.list-icons {
    counter-reset: my-counter;
}
ol.list-icons li::before {
    background-image: none;
    content: counter(my-counter);
    border-radius: var(--radius-extrasmall);
    background-color: var(--color-grey-32);
}
ol.list-icons li {
    counter-increment: my-counter;
}

/* sizes */
.list-icons.text-2xl {
    --size-icon-element: 1.875rem;
    --offset-element: var(--offset-secondary);
    --offset-element-divide: var(--offset-medium);
}
.list-icons.text-xl {
    --size-icon-element: 1.75rem;
    --offset-element: var(--offset-secondary);
    --offset-element-divide: var(--offset-medium);
}
.list-icons.text-s {
    --size-icon-element: 1.25rem;
    --offset-element: var(--offset-extrasmall);
    --offset-element-divide: var(--offset-small);
}

/* colors */
.list-icons.list-icons_white li::before {
    background-image: url('../../images/icons/bullet-white.svg');
}

@media screen and (max-width: 1023.5px) {
    .list-icons {
        --size-icon-element: 1.375rem;
        --offset-element-divide: var(--offset-small);
    }
    .list-icons.text-2xl {
        --size-icon-element: 1.625rem;
        --offset-element-divide: var(--offset-secondary);
    }
    .list-icons.text-xl {
        --size-icon-element: 1.5rem;
        --offset-element-divide: var(--offset-secondary);
    }
    .list-icons.text-m {
        --size-icon-element: 1.375rem;
        --offset-element-divide: var(--offset-small);
    }
    .list-icons.text-s {
        --size-icon-element: 1.25rem;
        --offset-element-divide: var(--offset-extrasmall);
    }

    .list-icons li::before {
        font-size: 0.875rem;
        font-weight: var(--font-semibold);
    }
}

/* text-list */
.text-list {
    --size-marker: 2.25rem;

    list-style: none;
    counter-reset: step;
    padding-left: 0;
}
.text-list li {
    counter-increment: step;
    display: flex;
    align-items: center;
    gap: var(--offset-small);
    padding-top: 0.25rem;
}
.text-list li::before {
    margin-top: -0.25rem;
    align-self: start;
    content: counter(step);
    color: var(--color-primary);
    font-weight: var(--font-semibold);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    min-width: var(--size-marker);
    width: var(--size-marker);
    min-height: var(--size-marker);
    height: var(--size-marker);
    background-color: var(--color-blue-light);
    border-radius: 0.375rem;
    line-height: 1;
}
.text-list li:nth-child(-n + 9):before {
    content: "0" counter(step);
}

/* switch */
.switch {
    position: relative;
}
.switch__item._active {
    transition: var(--transition-long);
}
.switch__item:not(._active) {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: -1;
    transform: translateY(5%);
}

/* notification */
.notification {
    --size-icon-btn: 1.5rem;

    position: relative;
    width: fit-content;
    max-width: 100%;
}
.notification__btn {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    line-height: 1;
}
.notification__btn svg {
    min-width: var(--size-icon-btn);
    width: var(--size-icon-btn);
    min-height: var(--size-icon-btn);
    height: var(--size-icon-btn);
    color: currentColor;
}
.notification__tooltip {
    font-size: 1rem;
    font-weight: var(--font-regular);
    line-height: 1.5;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%) translateY(calc(-0.625rem - 100%));
    transition: var(--transition);
    padding: var(--offset-extrasmall) var(--offset-small);
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: var(--offset-small);
    background: var(--color-black-40);
    backdrop-filter: blur(2.5rem);
    -webkit-backdrop-filter: blur(2.5rem);
    z-index: 5;
    border: 1px solid;
    border-image: linear-gradient(44.97deg, rgba(255, 255, 255, 0.4) 1.18%, rgba(255, 255, 255, 0.05) 100.34%) 1;
    color: var(--color-text-extralight);
}
.notification__tooltip-right {
    left: auto;
    right: 0;
    transform: translateX(50%) translateY(calc(-0.625rem - 100%));
}
.notification__tooltip-bottom {
    top: auto;
    bottom: 0;
    transform: translateX(-50%) translateY(calc(0.625rem + 100%));
}
.notification__close {
    min-width: var(--size-icon-medium);
    width: var(--size-icon-medium);
    min-height: var(--size-icon-medium);
    height: var(--size-icon);
    color: currentColor;
}
.notification__close svg {
    display: block;
    width: 100%;
    height: 100%;
}
.notification:not(._active) .notification__tooltip {
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) translateY(-100%);
}
.notification:not(._active) .notification__tooltip-bottom {
    transform: translateX(-50%) translateY(100%);
}
.notification:not(._active) .notification__tooltip-right {
    transform: translateX(50%) translateY(-100%);
}

/* pagination */
.pagination.swiper-pagination {
    --swiper-theme-color: currentColor;
    --swiper-pagination-bullet-inactive-color: currentColor;
    --swiper-pagination-bullet-inactive-opacity: 0.24;
    --swiper-pagination-bullet-size: 0.5625rem;
    --swiper-pagination-bullet-horizontal-gap: 0.1875rem;
    --swiper-pagination-bottom: 0.75rem;
    
    line-height: 1;
    font-size: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size));
}
.pagination.pagination-static.swiper-pagination {
    margin: var(--offset-secondary) auto 0;
    position: static;
    transform: translateX(0);
    max-width: 100%;
}
.pagination .swiper-pagination-bullet {
   transition: var(--transition);
   min-width: 0;
}

/**/
.pagination-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

/* nav-sector */
.nav-sector {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: stretch;
}
.nav-sector__btn {
    display: block;
    height: auto;
    flex: 1 0 0;
    z-index: 1;
}
@media screen and (max-width: 1023.5px) {
    .nav-sector {
        display: none;
    }
}

/* play */
.play {
    --size-play: 4rem;
    --size-svg: 100%;

    display: flex;
    min-width: var(--size-play);
    width: var(--size-play);
    min-height: var(--size-play);
    height: var(--size-play);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-white-40);
    backdrop-filter: blur(0.75rem);
    -webkit-backdrop-filter: blur(0.75rem);
    color: var(--color-extralight);
    transition: var(--transition);
    overflow: hidden;
}
.play svg {
    display: block;
    width: var(--size-svg);
    height: var(--size-svg);
}
.play_small {
    --size-play: 3rem;
}
.play_big {
    --size-play: 6.25rem;
}
.play-absolute {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media screen and (min-width: 1024px) {
    .play:hover {
        background-color: var(--color-white-20);
    }
}
.play:active {
    background-color: var(--color-white-20);
}
@media screen and (max-width: 1279px) {
    .play_big {
        --size-play: 4rem;
    }
}

/* icon label */
.icon-label {
    --size-image: var(--size-icon-big);
    --size-label: calc(var(--size-image) * 7 / 4);
    --bg-color: var(--color-grey-08);
    --icon-color: var(--color-primary);
    --radius-label: var(--radius);

    background-color: var(--bg-color);
    color: var(--icon-color);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-label);
    overflow: hidden;
    min-width: var(--size-label);
    width: var(--size-label);
    min-height: var(--size-label);
    height: var(--size-label);
    backdrop-filter: var(--blur);
    -webkit-backdrop-filter: var(--blur);
}
.icon-label svg,
.icon-label img {
    width: var(--size-image);
    height: var(--size-image);
}
.icon-label img {
    object-fit: contain;
}

/**/
.icon-label_extrabig {
    --size-image: 6rem;
}
.icon-label_big {
    --size-image: var(--size-icon-big);
    --size-label: calc(var(--size-image) * 2);
}
.icon-label_medium {
    --size-label: calc(var(--size-image) * 2);
}
.icon-label_small {
    --size-label: calc(var(--size-image) * 5 / 3);
}
.icon-label_extrasmall {
    --size-image: var(--size-icon-small);
    --size-label: calc(var(--size-image) * 1.5);
}

/**/
.icon-label_success {
    --icon-color: var(--color-success);
}
.icon-label_orange {
    --icon-color: var(--color-orange);
}
.icon-label_muted {
    --icon-color: var(--color-text);
}
.icon-label_primary {
    --bg-color: var(--color-blue-light);
    --icon-color: var(--color-primary);
}
.icon-label_white {
    --bg-color: var(--color-white-20);
    --icon-color: var(--color-extralight);
}

@media screen and (max-width: 1279px) {
    .icon-label {
        --size-label: calc(var(--size-image) * 5 / 3);
    }
}

/* arrow */
.arrow {
    --size-icon: 100%;
    --size-arrow: 3rem;

    min-width: var(--size-arrow);
    width: var(--size-arrow);
    min-height: var(--size-arrow);
    height: var(--size-arrow);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.arrow svg {
    display: block;
    width: var(--size-icon);
    height: var(--size-icon);
}
@media screen and (max-width: 1279px) {
    .arrow {
        --size-arrow: 2.5rem;
    }
}
@media screen and (max-width: 575px) {
    .arrow {
        --size-icon: 1.5rem;
    }
}
/**/
.arrow-button {
    --size-icon-arrow: var(--size-icon);
    --size-arrow: calc(var(--size-icon-arrow) * 5 / 3);

    min-width: var(--size-arrow);
    width: var(--size-arrow);
    min-height: var(--size-arrow);
    height: var(--size-arrow);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.arrow-button svg {
    width: var(--size-icon-arrow);
    height: var(--size-icon-arrow);
}

/* arrows */
.arrows {
    display: flex;
    align-items: center;
    gap: var(--offset-small);
    pointer-events: none;
    z-index: 1;
    transition: var(--transition);
}
.arrows .arrow,
.arrows button {
    pointer-events: all;
}
.arrows__long {
    justify-content: space-between;
}
.arrows-center {
    position: absolute;
    top: 50%;
    left: calc(var(--offset-arrows, 0px) * -1);
    width: calc(100% + var(--offset-arrows, 0px) * 2);
    transform: translateY(-50%);
    z-index: 5;
}
@media screen and (max-width: 1023.5px) {
    .slider__arrows {
        display: none;
    }
}

/* arrows-fullheight */
.arrows-fullheight {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.arrows-fullheight__arrow {
    height: auto;
    position: relative;
    z-index: 10;
    width: 20%;
    pointer-events: all;
}
.arrows-fullheight__arrow-prev { 
    cursor: url('../../images/icons/arrow-left-slider.svg'), auto;
}
.arrows-fullheight__arrow-next { 
    cursor: url('../../images/icons/arrow-right-slider.svg'), auto;
}

/* arrows-pagination */
.arrows-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-extrasmall);
    font-weight: var(--font-semibold);
    text-align: center;
}

/**/
.slider-light {
    --color-slider-secondary: var(--color-text);

    color: var(--color-text-extralight);
}
.slider-dark {
    --color-slider-secondary: var(--color-text-extralight);

    color: var(--color-text);
}
.slider-light .arrows-fullheight__arrow-prev { 
    cursor: url('../../images/icons/arrow-left-slider-white.svg'), auto;
}
.slider-light .arrows-fullheight__arrow-next { 
    cursor: url('../../images/icons/arrow-right-slider-white.svg'), auto;
}

@media screen and (max-width: 1023.5px) {
    .arrows-fullheight {
        display: none;
    }
}

/* label */
.label {
    --size-check: 1.25rem;
    --size-icon-el: var(--size-icon-small);
    
    position: relative;
    width: 100%;
    overflow: hidden;
}
.label input {
    width: var(--size-check);
    height: var(--size-check);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    pointer-events: none;
}
.label__content {
    width: 100%;
    background-color: var(--color-bg);
    padding: var(--offset-extrasmall) var(--offset-small);
    border-radius: var(--radius-small);
    border: 0.0625rem solid var(--color-muted);
    display: flex;
    align-items: center;
    gap: var(--offset-small);
    transition: var(--transition);
}
.label__body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.label__body-title {
    font-size: 0.8125rem;
}
.label__body-descr {
    font-size: 0.75rem;
    color: var(--color-text-muted);
}
.label__check {
    background-color: var(--color-muted);
    color: var(--color-muted);
    min-width: var(--size-check);
    width: var(--size-check);
    height: var(--size-check);
    min-height: var(--size-check);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
    position: relative;
    border-radius: 50%;
}
.label__check::before {
    content: '';
    display: block;
    background-color: currentColor;
    border-radius: 50%;
    transition: var(--transition);
    transform: scale(0);
    transform-origin: center;
    min-width: calc(var(--size-check) / 2);
    min-height: calc(var(--size-check) / 2);
    width: calc(var(--size-check) / 2);
    height: calc(var(--size-check) / 2);
}
.label__btn {
    position: absolute;
    top: 0;
    right: 0;
    width: calc(var(--size-icon-el) * 2.5);
    min-height: var(--size-icon-el);
    height: 100%;
    color: var(--color-dark);
    display: flex;
    align-items: center;
    justify-content: center;
}
.label__btn svg {
    display: block;
    height: var(--size-icon-el);
    width: var(--size-icon-el);
}

/* label */
.label-small {
    font-size: 0.75rem;
    font-weight: var(--font-semibold);
    color: var(--color-text-extralight);
    width: fit-content;
}
.label-small__descr {
    position: relative;
    background: #18181A4D;
    backdrop-filter: blur(0.25rem);
    padding: 0 0.25rem;
    border-radius: 0.375rem;
    display: block;

}

/* checked */
.label input:checked + .label__content .label__check {
    background-color: var(--color-primary);
    color: var(--color-extralight);
}
.label input:checked + .label__content .label__check::before {
    transform: scale(1);
}
.label input:checked + .label__content {
    background-color: var(--color-muted);
}

/* disabled */
.label[disabled] {
    pointer-events: none;
}
.label[disabled] .label__check {
    background-color: var(--color-border);
    color: var(--color-border);
    border-color: var(--color-border);
}
.label[disabled] input:checked + .label__check {
    background-color: var(--color-dark);
    color: var(--color-text-muted);
}

/* label-active */
.label-active {
    --radius-el: var(--radius-small);
    --bg-el: var(--color-muted);
    --size-icon-el: var(--size-icon);
    --color-icon-el: currentColor;

    width: 100%;
    background-color: var(--bg-el);
    padding: var(--offset-extrasmall) var(--offset-small);
    border-radius: var(--radius-el);
    border: 1px solid var(--color-muted);
    display: flex;
    align-items: center;
    gap: var(--offset-small);
}

.label-active__icon {
    min-width: var(--size-icon-el);
    width: var(--size-icon-el);
    min-height: var(--size-icon-el);
    height: var(--size-icon-el);
    color: var(--color-icon-el);
}
.label-active__icon svg {
    display: block;
    width: 100%;
    height: 100%;
}
.label-active__body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.label-active__body-title {
    font-size: 0.8125rem;
}
.label-active__body-descr {
    font-size: 0.75rem;
    color: var(--color-text-muted);
}




/* overflow el */
.overflow-el {
    position: relative;
}
.overflow-el._overflow-top::before,
.overflow-el._overflow-bottom::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 2.9375rem;
    z-index: 1;
    pointer-events: none;
}
.overflow-el._overflow-top::before {
    top: 0;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
}
.overflow-el._overflow-bottom::after {
    bottom: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
}

/* animation marquee */
.marquee {
    display: flex;
    gap: var(--offset-secondary);
    align-items: center;
    overflow: hidden;
}
.marquee__list {
    height: 4rem;
    min-width: fit-content;
    width: 100%;
    display: flex;
    gap: var(--offset-secondary);
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    animation: animate 10s linear infinite;
}
.marquee__item {
    height: 100%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
}
.marquee__item img,
.marquee__item svg {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.marquee__item img {
    object-fit: contain;
}

.marquee-reverse .marquee__list {
    animation: animate-reverse 10s linear infinite;
}

@keyframes animate {
    0% {
        transform: translate3d(0, 0,0);
    }
    100% {
        transform: translate3d(-100%, 0, 0);
    }
}
@-webkit-keyframes animate {
    0% {
        transform: translate3d(0, 0,0);
    }
    100% {
        transform: translate3d(-100%, 0, 0);
    }
}
@keyframes animate-reverse {
    0% {
        transform: translate3d(-100%, 0, 0);
    }
    100% {
        transform: translate3d(0, 0,0);
    }
}
@-webkit-keyframes animate-reverse {
    0% {
        transform: translate3d(-100%, 0, 0);
    }
    100% {
        transform: translate3d(0, 0,0);
    }
}

/* loader */
@keyframes loader {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.loader {
    --size-icon-loader: 2.5rem;

    padding: var(--offset-loader, 0) 0;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: var(--offset-small);
    text-align: center;
}
.loader svg {
    fill: none;
    width: var(--size-icon-loader);
    height: var(--size-icon-loader);
    animation: loader 1.5s linear infinite;
}
.loader svg path:first-child {
    color: var(--color-muted);
}
.loader svg path:nth-child(2) {
    color: var(--color-primary);
}

/* overflow-shadow */
.overflow-shadow {
    --gradient-shadow: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);

    position: relative;
}
.overflow-shadow::before,
.overflow-shadow::after {
    content: '';
    pointer-events: none;
    position: absolute;
    left: 0;
    width: 100%;
    height: 3rem;
    opacity: 0;
    transition: 0.2s all;
    z-index: 1;
}
.overflow-shadow::after {
    background: var(--gradient-shadow);
    bottom: 0;
    transform: scaleY(-1);
}
.overflow-shadow::before {
    background: var(--gradient-shadow);
    top: 0;
}
.overflow-shadow.overflow-shadow__end::after {
    opacity: 1;
}
.overflow-shadow.overflow-shadow__start::before {
    opacity: 1;
}

/* search */
.search {
    --offset-search: var(--offset-medium);

    position: relative;
}
.search__wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transform: translateY(100%);
    padding-top: var(--offset-extrasmall);
    z-index: 50;
    display: grid;
    grid-template-rows: 1fr;
    transition: var(--transition-long);
}
.search__window {
    overflow: hidden;
    border-radius: var(--radius-semismall);
    background-color: var(--color-extralight);
    border: 0.03125rem solid var(--color-text);
    box-shadow: 0 0.125rem 1rem 0 #0000001A;
}
.search__window-content {
    padding: var(--offset-search);
    overflow-y: auto;
    max-height: calc(100dvh - var(--height-header, 0rem));
    scrollbar-width: none;
}
.search__window-content::-webkit-scrollbar,
.search__window-content::-webkit-scrollbar-track,
.search__window-content::-webkit-scrollbar-thumb {
    display: none;
}

.search__history-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-extrasmall);
}
.search__history-title {
    font-weight: var(--font-semibold);
    font-size: 1rem;
    line-height: 1.4;
    color: var(--color-text);
}
.search__history-clear {
    font-weight: var(--font-regular);
    font-size: 1rem;
    line-height: 1.4;
    color: var(--color-text);
}
.search__history-list {
    margin-top: var(--offset-secondary);
    display: flex;
    flex-direction: column;
    gap: var(--offset-secondary);
}
.search__history-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-medium);
}
.search__history-link {
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-weight: var(--font-regular);
    font-size: 0.875rem;
    line-height: 1.15;
    color: var(--color-text);
}
.search__history-link svg,
.search__history-remove {
    display: block;
    min-width: var(--size-icon-medium);
    width: var(--size-icon-medium);
    min-height: var(--size-icon-medium);
    height: var(--size-icon-medium);
}
.search__history-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text);
}
.search__history-remove svg {
    display: block;
    width: 100%;
    height: 100%;
}
.search__history-link svg {
    color: var(--color-text);
}

/**/
.search__list {
    --width-card: 15rem;
}
.search__list-slider {
    border-top: 0.0625rem solid var(--color-border);
    padding: var(--offset-search) var(--offset-search) 0;
    margin: var(--offset-search) calc(var(--offset-search) * -1) 0;
    width: calc(100% + var(--offset-search) * 2);
}

/**/
.search:not(._open-search) .search__wrapper {
    grid-template-rows: 0fr;
    padding-top: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    visibility: hidden;
}


@media screen and (min-width: 1024px) {
    .search__history-remove:hover {
        color: var(--color-text-muted);
    }
}
.search__history-remove:active {
    color: var(--color-text-dark);
}
@media screen and (max-width: 1023.5px) {
    .search-noitem {
        font-size: 0.875rem;
        line-height: 1.4;
    }
}

/* sidebar */
.sidebar {
    --offset-sidebar: var(--offset-medium);
    --offset-sidebar-secondary: var(--offset-extrasmall);
    --size-logo: 2.5rem;

    flex-direction: column;
    background-color: var(--color-text-extralight);
}
.sidebar-aside {
    min-width: var(--width-sidebar);
    width: var(--width-sidebar);
}
.sidebar__top {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-extrasmall);
}
.sidebar__top-logo {
    padding: var(--offset-sidebar) 0;
    min-height: calc(var(--size-logo) + var(--offset-sidebar) * 2);
    height: calc(var(--size-logo) + var(--offset-sidebar) * 2);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: var(--color-primary);
}
.sidebar__top-logo svg,
.sidebar__top-logo img {
    max-width: 100%;
    height: 100%;
}
.sidebar__top-logo img {
    object-fit: contain;
}
.sidebar__wrapper {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.sidebar__content {
    width: 100%;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    scrollbar-width: none;
    padding: 0 var(--offset-sidebar-secondary) var(--offset-sidebar-secondary);
}
.sidebar__content::-webkit-scrollbar,
.sidebar__content::-webkit-scrollbar-track,
.sidebar__content::-webkit-scrollbar-thumb {
    display: none;
}
.sidebar-menu {
    display: flex;
    flex-direction: column;
}
.sidebar__nav + .sidebar__nav {
    margin-top: auto;
    padding-top: var(--offset-sidebar);
}
.sidebar__nav-list,
.sidebar__info {
    margin-top: auto;
}
.sidebar__list {
    display: flex;
    flex-direction: column;
}
.sidebar__info {
    padding: var(--offset-sidebar) var(--offset-sidebar-secondary) 0;
}
.sidebar__bottom {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: var(--offset-sidebar) var(--offset-sidebar-secondary) 0;
}

@media screen and (min-width: 768px) {
    .sidebar {
        display: flex !important;
    }
    .sidebar-aside {
        position: sticky;
        min-height: 100dvh;
        top: 0;
        left: 0;
        border-right: 0.0625rem solid var(--color-border);
    }
}

@media screen and (max-width: 1279px) {
    .sidebar {
        --offset-sidebar: var(--offset-secondary);
    }
}
@media screen and (max-width: 767px) {
    .sidebar-aside {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        /* overflow: hidden; */
    }
    .sidebar {
        --offset-sidebar-secondary: var(--offset-secondary);

        display: none;
    }
    .sidebar .fancybox-button.fancybox-close-small, 
    .fancybox-slide--html .sidebar .fancybox-close-small, 
    .sidebar.fancybox__content > .f-button.is-close-btn, 
    .is-compact .sidebar.fancybox__content>.f-button.is-close-btn {
        display: none;
    }
    .sidebar__content {
        padding: var(--offset-sidebar-secondary);
    }
    .sidebar-aside.f-zoomInUp {
        animation: var(--f-transition-duration, 0.2s) ease both f-zoomInLeft-animated;
    }
    .sidebar-aside.f-fadeOut {
        animation: var(--f-transition-duration, 0.2s) ease both f-fadeOutLeft-animated;
    }
    .sidebar__top {
        display: none;
    }
    .sidebar__wrapper {
        height: 100%;
    }
}


/* sidebar-info */
.sidebar-info {
    --size-face: 2.75rem;
    --offset-info: var(--offset-sidebar, var(--offset-medium));

    padding: var(--offset-info);
    display: flex;
    flex-direction: column;
    background-color: #1C1A2999;
    border: 0.0625rem solid rgba(255,255,255, 0.4);
    backdrop-filter: blur(2.5rem);
    -webkit-backdrop-filter: blur(2.5rem);
}
.sidebar-info__top {
    display: flex;
    align-items: center;
    gap: var(--offset-small);
}
.sidebar-info__top-face {
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: var(--font-semibold);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--color-primary);
    min-width: var(--size-face);
    width: var(--size-face);
    min-height: var(--size-face);
    height: var(--size-face);
}
.sidebar-info__top-body {
    display: flex;
    flex-direction: column;
}
.sidebar-info__top-title {
    opacity: 0.5;
    font-size: 0.875rem;
    line-height: 1.4;
}
.sidebar-info__top-descr {
    font-weight: var(--font-semibold);
}

.sidebar-info__content {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.sidebar-info__content:not(:first-child) {
    margin-top: var(--offset-info);
    border-top: 0.0625rem solid var(--color-border);
    padding-top: var(--offset-info);
}
.sidebar-info__soc {
    display: flex;
    flex-direction: column;
    gap: var(--offset-small);
}
.sidebar-info__soc-link {
    display: flex;
    align-items: center;
    gap: var(--offset-extrasmall);
}
.sidebar-info__soc svg {
    min-width: var(--size-icon);
    width: var(--size-icon);
    min-height: var(--size-icon);
    height: var(--size-icon);
}

/* menu-item */
.menu-item {
    --btn-bg: transparent;
    --btn-color: var(--color-text-muted);
    --btn-border: var(--btn-bg);
    --btn-padding: calc(var(--offset-extrasmall) / 2);
    --btn-gap: var(--offset-extrasmall);
    --size-btn: 6.25rem;
    --size-svg: var(--size-icon);
}
.menu-item__link-primary {
    --btn-color: var(--color-primary);
}
.menu-item__link-dark {
    --btn-color: var(--color-dark);
}
.menu-item__link {
    width: 100%;
    min-height: var(--size-btn);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--btn-gap);
    background-color: var(--btn-bg);
    color: var(--btn-color);
    padding: var(--btn-padding);
    position: relative;
    overflow: hidden;
    border: 0.0625rem solid var(--btn-border);
    border-radius: var(--radius);

    font-size: 1rem;
    line-height: 1.5;
    text-align: center;
}
.menu-item__link-icon {
    display: block;
    min-width: var(--size-svg);
    width: var(--size-svg);
    min-height: var(--size-svg);
    height: var(--size-svg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.menu-item__link-icon svg,
.menu-item__link-icon img {
    display: block;
    width: 100%;
    height: 100%;
}
.menu-item__link-icon img {
    object-fit: contain;
}
/**/
.menu-item__link-badge {
    margin-left: auto;
    background-color: var(--btn-badge);
    padding: 0 var(--offset-extrasmall);
    border-radius: 50px;
    min-height: var(--size-svg);
    height: var(--size-svg);
    min-width: var(--size-svg);
    font-weight: var(--font-regular);
    font-size: 0.75rem;
    line-height: 1.36;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}
.menu-item__link-arrow {
    margin-left: auto;
    min-width: var(--size-icon-medium);
    width: var(--size-icon-medium);
    min-height: var(--size-icon-medium);
    height: var(--size-icon-medium);
    transition: var(--transition);
    opacity: 0;
}
.menu-item__link-arrow svg {
    display: block;
    width: 100%;
    height: 100%;
}
.menu-item__divider {
    min-height: 0.5625rem;
    pointer-events: none;
}

/**/
.menu-item__submenu-item > .menu-item__submenu > .menu-item__submenu-list > .menu-item__submenu-item > .menu-item__link {
    padding-left: calc(var(--btn-padding) + var(--size-svg));
}

/**/
.menu-item__submenu {
    display: grid;
    grid-template-rows: 1fr;
    transition: var(--transition-long);
}
.menu-item__submenu-list {
    margin-top: var(--offset-menu, 0rem);
    display: flex;
    flex-direction: column;
    gap: var(--offset-menu, 0rem);
    overflow: hidden;
    transition: var(--transition-long);
}
.menu-item__submenu-item > .menu-item__link .menu-item__link-arrow {
    transform: rotate(-90deg);
}

/* open */
.menu-item:not(._active) > .menu-item__submenu,
.menu-item__submenu-item:not(._active) > .menu-item__submenu {
    grid-template-rows: 0fr;
}
.menu-item:not(._active) > .menu-item__submenu > .menu-item__submenu-list,
.menu-item__submenu-item:not(._active) > .menu-item__submenu > .menu-item__submenu-list {
    margin-top: 0;
}

/* active */
.menu-item__link:active,
.menu-item._active > .menu-item__link {
    --btn-bg: var(--color-primary);
    --btn-color: var(--color-primary);
}
.menu-item__link:active .menu-item__link-arrow,
.menu-item._active > .menu-item__link .menu-item__link-arrow,
.menu-item__submenu-item._active > .menu-item__link .menu-item__link-arrow {
    opacity: 1;
}
.menu-item__submenu-item > .menu-item__link:active,
.menu-item__submenu-item._active > .menu-item__link {
    --btn-bg: var(--color-primary);
    --btn-color: var(--color-primary);
}
.menu-item._active > .menu-item__link .menu-item__link-badge,
.menu-item > .menu-item__link:active .menu-item__link-badge {
    background-color: var(--color-extralight);
    color: var(--color-primary);
    backdrop-filter: blur(2.5rem);
    -webkit-backdrop-filter: blur(2.5rem);
}

@media screen and (min-width: 1024px) {
    .menu-item._active .menu-item__link:hover,
    .menu-item__link:hover {
        --btn-bg: var(--color-blue-light);
        --btn-color: var(--color-primary);
    }
}

@media screen and (max-width: 1279px) {
    .menu-item {
        --size-btn: 3rem;
    }
    .menu-item__link {
        min-height: var(--size-btn);
        height: var(--size-btn);
        min-width: var(--size-btn);
        width: var(--size-btn);
    }
    .menu-item__link-descr {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .menu-item__link {
        width: 100%;
        padding: var(--btn-padding) calc(var(--btn-padding) + var(--btn-gap));
        flex-direction: row;
        justify-content: start;
        text-align: left;
    }
    .menu-item__link-descr {
        display: block;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;  
        overflow: hidden;
        hyphens: auto;
        word-break: break-all;
    }
}

/* catalog-menu */
.catalog-menu {
    --width-block: 15rem;
    --border-block: var(--color-muted);

    width: 100%;
    max-width: var(--width-block);
    padding-right: var(--offset-extrasmall);
    display: flex;
    flex-direction: column;
    height: 100%;
    border-right: 0.0625rem solid var(--border-block);
}
.catalog-menu__title {
    margin-bottom: var(--offset-extrasmall);
    font-weight: var(--font-semibold);
    font-size: 1rem;
    line-height: 1.4;
}
/* catalog-item */
.catalog-item {
    --btn-bg: transparent;
    --btn-color: var(--color-text-dark);
    --btn-offset: var(--offset-extrasmall);
    --icon-color: var(--color-text-muted);
    --size-btn: 2.125rem;
    --size-svg: var(--size-icon);
    --size-svg-submenu: var(--size-icon-medium);
    --submenu-offset: var(--offset-main);

    font-weight: var(--font-regular);
    font-size: 1rem;
    line-height: 1.4;
    display: flex;
    flex-direction: column;
}
.catalog-item__link {
    width: 100%;
    display: inline-flex;
    align-items: center;
    gap: var(--btn-offset);
    background-color: var(--btn-bg);
    color: var(--btn-color);
    border-radius: var(--radius);
    position: relative;
    overflow: hidden;

    font-size: 1rem;
    line-height: 1.4;
}
.catalog-item__link-title {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}
.catalog-item__link-arrow {
    min-width: var(--size-svg);
    width: var(--size-svg);
    min-height: var(--size-svg);
    height: var(--size-svg);
    color: var(--icon-color);
    transition: var(--transition);
}
.catalog-item__link-arrow svg {
    display: block;
    width: 100%;
    height: 100%;
}

/* submenu */
.catalog-item__submenu {
    padding-left: var(--submenu-offset);
    width: 100%;
    display: grid;
    grid-template-rows: 0fr;
    transition: var(--transition);
}
.catalog-item__submenu-list {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.catalog-item__submenu-list > .catalog-item__submenu-item {
    margin-top: var(--btn-offset);
}
.catalog-item__submenu-item > .catalog-item__link {
    --btn-color: var(--color-text);
    --size-svg: var(--size-icon-medium);

    padding: 0.25rem var(--btn-offset);
    min-height: var(--size-btn);
}


/* active */
.catalog-item._active > .catalog-item__submenu,
.catalog-item__submenu-item._active > .catalog-item__submenu {
    grid-template-rows: 1fr;
}
.catalog-item._active > .catalog-item__link .catalog-item__link-arrow,
.catalog-item__submenu-item._active > .catalog-item__link .catalog-item__link-arrow {
    --icon-color: var(--color-primary);
    transform: rotate(-180deg);
}
.catalog-item__submenu-item._active > .catalog-item__link {
    --btn-bg: var(--color-muted);
    --btn-color: var(--color-text-dark);
}
.catalog-item__submenu-item._active > .catalog-item__link-last .catalog-item__link-arrow {
    transform: rotate(-90deg);
}

@media screen and (min-width: 1024px) {
    .catalog-item > .catalog-item__link:hover {
        --icon-color: var(--color-primary);
    }
    .catalog-item__submenu-item > .catalog-item__link:hover {
        --btn-bg: var(--color-muted);
        --icon-color: var(--color-primary);
        --btn-color: var(--color-text-dark);
    }
}

.catalog-item__submenu-item > .catalog-item__link:active {
    --btn-bg: var(--color-muted);
    --icon-color: var(--color-primary);
}


/* section-control */
.section-control {
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: var(--offset-medium);
}
.section-control_absolute {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: var(--offset-medium);
    z-index: 5;
}
.section-control__progress {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0.125rem;
    background-color: var(--color-white-40);
}
.section-control__progress::after {
    display: block;
    content: '';
    height: 100%;
    width: 0;
    background-color: var(--color-extralight);
    transition: var(--duration-progress, 0) linear all;
    min-width: var(--width-progress, 0%);
}
.section-control__progress:not(._visible),
.section-control__progress._hidden {
    display: none;
}
@media screen and (max-width: 767px) {
    .section-control_absolute {
        bottom: var(--offset-secondary);
    }
}

/* catalog-toggle */
.catalog-toggle._hide .catalog-toggle__btn {
    display: none;
}

/* product-images */
.product-images {
    --height-slider: 100%;
    --offset-slider: var(--offset-medium);
    --radius-slider: var(--radius-semismall);

    display: flex;
    align-items: stretch;
    gap: var(--offset-slider);
    width: 100%;
}
.product-images__main-slider {
    flex-grow: 1;
}
.product-images__main-swiper,
.product-images__thumbs-swiper {
    height: var(--height-slider);
    border-radius: var(--radius-slider);
}
.product-images__main-slide,
.product-images__thumbs-slide {
    border-radius: var(--radius-slider);
    overflow: hidden;
    position: relative;
    background-color: var(--color-extralight);
}
.product-images__thumbs-slide {
    aspect-ratio: 1;
    cursor: pointer;
    transition: 0.2s box-shadow;
}
.product-images__main-slide::before,
.product-images__thumbs-slide::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.05);
}
.product-images__main-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(2.5rem);
}

.product-images__main-slide img,
.product-images__thumbs-slide img,
.product-images__main-slide video {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}
.product-images__main-slide img {
    object-fit: contain;
    mix-blend-mode: multiply;
}
.product-images__thumbs-slide img {
    object-fit: contain;
    mix-blend-mode: multiply;
}


@media screen and (min-width: 1024px) {
    .product-images__thumbs-slide:hover {
        box-shadow: inset 0 0 0 0.0625rem var(--color-border);
    }
}
.product-images__thumbs-slide:active,
.product-images__thumbs-slide.swiper-item-active {
    box-shadow: inset 0 0 0 0.0625rem var(--color-primary);
}


/* tabs-container */
.tabs-container {
    --offset-block: var(--offset-medium);
}
.tabs-container__content,
.tabs-container__content-item > *:not(:first-child) {
    margin-top: var(--offset-block);
}

/* address-item */
.address-item {
    --offset-block: var(--offset-medium);

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: stretch;
    gap: var(--offset-block) var(--offset-extrabig);
}
.address-item__list {
    padding: var(--offset-secondary) var(--offset-secondary) 0 var(--offset-secondary);
    display: flex;
    flex-direction: column;
}
.address-item__list-item {
    display: flex;
    align-items: center;
    gap: var(--offset-extrasmall);
    color: var(--color-text-dark-secondary);
}
.address-item__list-item:not(:last-child) {
    padding-bottom: var(--offset-block);
}
.address-item__list-item:not(:first-child) {
    padding-top: var(--offset-block);
    border-top: 0.0625rem solid var(--color-border);
}
.address-item__list-icon {
    min-width: var(--size-icon);
    width: var(--size-icon);
    min-height: var(--size-icon);
    height: var(--size-icon);
}
.address-item__list-icon svg {
    display: block;
    width: 100%;
    height: 100%;
}
.address-item__list-body {
    display: flex;
    flex-direction: column;
}
.address-item__list-body > *:not(:first-child) {
    margin-top: 0.125rem;
}
.address-item__list-title {
    font-weight: var(--font-regular);
    font-size: 0.875rem;
    line-height: 1.15;
    color: var(--color-text-muted);
}
.address-item__list-descr {
    font-weight: var(--font-semibold);
}

.address-item__bottom {
    padding: 0 var(--offset-secondary) var(--offset-secondary) var(--offset-secondary);
}

.address-item__map {
    height: auto;
    border-radius: var(--radius-semismall);
    overflow: hidden;
}
.address-item__map-content {
    width: 100%;
    height: 100%;
}
.address-item__map-hidden {
    display: none !important;
}

@media screen and (min-width: 576px) {
    .address-item__map {
        grid-column: 2 / 3;
        grid-row: 1 / 3;
    }
}
@media screen and (min-width: 1024px) {
    .address-item {
        padding: var(--offset-extrasmall);
        background-color: var(--color-extralight);
        border-radius: var(--radius-semismall);
    }
}

@media screen and (max-width: 1439px) {
    .address-item {
        gap: var(--offset-block);
    }
    .address-item__list,
    .address-item__bottom {
        padding: 0;
    }
}
@media screen and (max-width: 1023.5px) {
    .address-item {
        --offset-block: var(--offset-small);
    }
}
@media screen and (max-width: 575px) {
    .address-item {
        grid-template-columns: 100%;
    }
    .address-item__map {
        aspect-ratio: 1.5;
    }
}
@media screen and (max-width: 424px) {
    .address-item__map {
        aspect-ratio: 1;
    }
}

/* overflow-height */
.overflow-height {
    max-height: var(--height-overflow, 17.5rem);
    padding-right: var(--offset-small);
    overflow-y: auto;
    scrollbar-width: 0.5rem;
}
.overflow-height::-webkit-scrollbar {
    width: 0.5rem;
    border-radius: 0.5rem;
    background-color: transparent;
}
.overflow-height::-webkit-scrollbar-thumb {
    width: 0.5rem;
    border-radius: 0.5rem;
    background-color: var(--color-grey-32);
}
.overflow-height::-webkit-scrollbar-track {
    background-color: transparent;
}
/* overflow-width */
.overflow-width {
    padding-bottom: var(--offset-small);
    overflow-x: auto;
    scrollbar-width: 0.375rem;
}
.overflow-width::-webkit-scrollbar {
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: transparent;
}
.overflow-width::-webkit-scrollbar-thumb {
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: var(--color-grey-32);
}
.overflow-width::-webkit-scrollbar-track {
    background-color: transparent;
}

/* image placeholder */
.image-placeholder {
    background-image: url('../../images/main/image-placeholder.png');
    background-position: center;
    background-size: calc(100% - var(--offset-card, var(--offset-medium)));
    background-repeat: no-repeat;
}

/* diagram-line */
@keyframes widthLine {
    from {
        width: 0;
    }
    to {
        width: var(--width-line, 0px);
    }
}
.diagram-line {
    --size-line: 0.75rem;

    width: 100%;
    height: var(--size-line);
    border-radius: var(--size-line);
    overflow: hidden;
    background-color: var(--color-grey);
    position: relative;
}
.diagram-line::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: var(--width-line);
    height: 100%;
    border-radius: var(--size-line);
    background-color: var(--color-line, var(--color-orange));
    animation: 1s ease-in-out both widthLine;
}

/* button-content */
.button-content:not(:first-child) {
    margin-top: 0.25rem;
}

/**/
.table-block {
    --offset-table: var(--offset-secondary);

    overflow: hidden;
    border-radius: var(--radius-secondary);
    border: 0.0625rem solid var(--color-primary);
}
.table-block__body {
    padding: var(--offset-table) 0 0;
    display: flex;
    flex-direction: column;
}
.table-block__tr,
.table-block__final {
    position: relative;
    display: flex;
    align-items: center;
    transition: var(--transition);
}
.table-block__tr {
    padding: 0 var(--offset-table);
    font-size: 1.125rem;
    line-height: 1.4;
}
.table-block__tr-body {
    padding: var(--offset-small) 0;
}
.table-block__final {
    padding: var(--offset-table);
    background-color: var(--color-blue-light);
}
.table-block__tr-body,
.table-block__final-body {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--offset-small);
}
.table-block__tr-link,
.table-block__final-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.table-block__tr-caption {
    font-weight: var(--font-semibold);
}
.table-block__tr-value {
    font-weight: var(--font-medium);
}
.table-block__final-caption,
.table-block__final-value {
    font-weight: var(--font-medium);
    font-size: 1.25rem;
    line-height: 1.4;
}
.table-block__final-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.table-block__tr-value,
.table-block__final-value {
    white-space: nowrap;
}

.table-block__tr + .table-block__tr .table-block__tr-body {
    border-top: 0.0625rem solid var(--color-border);
}

@media screen and (min-width: 1024px) {
    .table-block__tr:hover,
    .table-block__final:hover {
        color: var(--color-primary);
    }
}
@media screen and (max-width: 1279px) {
    .table-block__tr {
        padding: 0 var(--offset-table);
        font-size: 1rem;
        line-height: 1.5;
    }
    .table-block__tr-body {
        padding: var(--offset-extrasmall) 0;
    }
    .table-block__final-caption,
    .table-block__final-value {
        font-size: 1rem;
        line-height: 1.5;
        font-weight: var(--font-semibold);
    }
}


/**/
.pdf-canvas {
    --height-input: 2.375rem;
    --height-bottom: 4.25rem;

    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;

    font-size: 0.875rem;
    line-height: 1.4;
    font-weight: var(--font-semibold);
}
.pdf-canvas__content {
    overflow: auto;
    flex-grow: 1;
    max-height: var(--height-canvas, 100%);
    max-width: 100%;
}
.pdf-canvas__content canvas {
    border: 0.0625rem solid var(--color-border);
    transform: rotate(var(--rotate-block));
    transition: var(--transition);
}

.pdf-canvas__bottom {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
    border-radius: var(--radius-semismall);
    padding: var(--offset-small) var(--offset-secondary);
    background-color: var(--color-muted);
    box-shadow: 0 0.25rem 0.25rem 0 #00000040;
    display: flex;
    align-items: center;
    gap: var(--offset-secondary);
    min-height: var(--height-bottom);
}
.pdf-canvas__bottom-divider {
    height: calc(var(--height-input) - 0.125rem);
    width: 0.0625rem;
    background-color: var(--color-primary);
}
.pdf-canvas__count .input {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    width: var(--height-input);
    font-size: 0.875rem;
    line-height: 1.4;
    font-weight: var(--font-semibold);
}
.pdf-canvas__count .button.button-square[data-pdf-plus] {
    transform: scaleY(-1);
}
.pdf-canvas__count,
.pdf-canvas__zoom {
    display: flex;
    align-items: center;
    gap: var(--offset-extrasmall);
}
.pdf-canvas__zoom-value {
    text-align: center;
    height: var(--height-input);
    border-radius: var(--radius);
    background-color: var(--color-muted);
    text-align: center;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
    min-width: 5.5625rem;
}

@media screen and (max-width: 767px) {
    .pdf-canvas__bottom {
        flex-direction: column;
        gap: var(--offset-extrasmall);
    }
    .pdf-canvas__bottom-divider {
        display: none;
    }
}

/**/
.slider-images {
    --offset-element: var(--offset-big);

    border-radius: var(--radius);
    background-color: transparent;
    position: relative;
    overflow: hidden;
}
.slider-images__swiper {
    height: 100%;
}
.slider-images__slide {
    border-radius: var(--radius);
    overflow: hidden;
}
.slider-images__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.slider-images__arrows {
    position: absolute;
    right: var(--offset-element);
    bottom: var(--offset-element);
    z-index: 1;
}
.slider-images__link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/**/
.slider-images__arrows-top .slider-images__arrows {
    bottom: auto;
    top: var(--offset-element);
}

@media screen and (max-width: 1023.5px) {
    .slider-images {
        --offset-element: var(--offset-small);

        margin-bottom: calc(1.6875rem);
    }
    .slider-images__arrows {
        bottom: auto;
        top: var(--offset-element);
    }
}

/* blockquote */
.blockquote {
    --offset-element: var(--offset-big);

    width: 100%;
    max-width: var(--width-element, 100%);
    padding: var(--offset-element);
    border-radius: var(--radius);
    border-left: 0.3125rem solid var(--color-primary);
    background-color: var(--color-white-10);
}

@media screen and (max-width: 1023.5px) {
    .blockquote {
        --offset-element: var(--offset-medium);
        border-left: 0.25rem solid var(--color-primary);
    }
}

/* table-cart */
.table-cart {
    display: flex;
    flex-direction: column;
}
.table-cart__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem var(--offset-small);
    padding: 0.25rem var(--offset-small);
    min-height: 2.5rem;
    background-color: var(--color-grey-custom-light);
    border-bottom: 0.0625rem solid var(--color-grey-custom);
}

.table-cart__head .checkbox .checkbox__check {
    margin: 0.125rem;
}
.table-cart__head .checkbox .checkbox__descr {
    font-size: 1rem;
    line-height: 1.5;
}
.table-cart__body {
    display: flex;
    flex-direction: column;
}
.table-cart__empty {
    padding: 0.25rem 0;
    min-height: 2.5rem;
    display: flex;
    align-items: center;
}

/* baloon-map */
.baloon-map {
    --bg-card: var(--color-white);
    --radius-card: var(--radius-extrasmall);
    --width-card: 19.375rem;
    --size-icon-element: 1.75rem;
    --size-close-element: 2rem;
    --size-close-element-icon: 1.5rem;

    width: 100%;
    min-width: var(--width-card, 100%);
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: var(--bg-card);
    border-radius: var(--radius-card);
    padding: var(--offset-card);
    color: var(--color-text-dark);
    box-shadow: 0 0.25rem 2.5rem 0 #000F1F29;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateX(-50%);
    padding: var(--offset-small) var(--offset-secondary) var(--offset-secondary);
    transition: var(--transition);
    opacity: 0;
    pointer-events: none;
}
.baloon-map__descr:not(:first-child) {
    margin-top: var(--offset-extrasmall);
}
.baloon-map__list {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}
.baloon-map__list:not(:first-child) {
    margin-top: var(--offset-small);
    padding-top: var(--offset-secondary);
    border-top: 0.0625rem solid var(--color-black-08);
}
.baloon-map__link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}
.baloon-map__icon {
    display: block;
    min-width: var(--size-icon-element);
    width: var(--size-icon-element);
    min-height: var(--size-icon-element);
    height: var(--size-icon-element);
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-primary);
    color: var(--color-text-extralight);
}
.baloon-map__icon svg {
    min-width: var(--size-icon-medium);
    width: var(--size-icon-medium);
    min-height: var(--size-icon-medium);
    height: var(--size-icon-medium);
}
.baloon-map__close {
    position: absolute;
    top: var(--offset-extrasmall);
    right: var(--offset-extrasmall);
    min-width: var(--size-close-element);
    width: var(--size-close-element);
    min-height: var(--size-close-element);
    height: var(--size-close-element);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-grey-60);
    transition: var(--transition);
}
.baloon-map__close svg {
    display: block;
    min-width: var(--size-icon);
    width: var(--size-icon);
    min-height: var(--size-icon);
    height: var(--size-icon);
}

/**/
.baloon-map._active {
    opacity: 1;
    pointer-events: all;
}

@media screen and (min-width: 1024px) {
    .baloon-map__close:hover {
        color: var(--color-text-dark);
    }
}