@keyframes modalFadeIn {
    0% {
        opacity: 0;
        transform: translateY(40px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translate(-50%, -55%)
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%)
    }
}

:root {
    --brand-1: #4CAF50;
    --brand-2: #388E3C;
    --brand-3: #1B5E20;
    --brand-4: #F0FFF4;
    --black: #1E1E1E;
    --deep-black: #000000;
    --white: #FFFFFF;
    --gray-1: #F4F4F4;
    --gray-2: #D9D9D9;
    --gray-4: #7E8B99;
    --gray-5: #4A545E;
    --system-red: #E53E3E;
    --system-orange: #ED8936;
    --system-green: #48BB78;
    --system-blue: #4299E1;
    --font-size-1: 10px;
    --font-size-2: 12px;
    --font-size-3: 13px;
    --font-size-4: 14px;
    --font-size-5: 15px;
    --font-size-6: 16px;
    --font-size-7: 17px;
    --font-size-8: 18px;
    --font-size-9: 20px;
    --font-size-10: 22px;
    --font-size-11: 24px;
    --font-size-12: 28px;
    --font-size-13: 32px
}

body,
html {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    font-family: "Inter", sans-serif;
    scrollbar-width: thin;
    scrollbar-color: var(--brand-1) transparent;
}

body::-webkit-scrollbar {
    width: 4px;
    background: 0 0;
    border-radius: 8px
}

body::-webkit-scrollbar-thumb {
    background: var(--brand-1);
    border-radius: 50px;
    min-height: 24px;
}

body::-webkit-scrollbar-thumb:hover {
    background: var(--brand-1);
}

body::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0
}


a {
    text-decoration: none;
    color: inherit;
    transition: color .2s
}

a:hover {
    color: var(--brand-1)
}

.custom-checkbox {
    width: 16px;
    height: 16px;
    accent-color: var(--brand-2);
    cursor: pointer;
    margin: 0;
    flex-shrink: 0
}

.custom-radio {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 5px;
    user-select: none
}

.custom-radio:hover {
    background-color: var(--gray-1)
}

.custom-radio input[type=radio] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    cursor: pointer
}

.custom-radio__circle {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid #999;
    border-radius: 50%;
    background: var(--white);
    margin-right: 12px;
    position: relative;
    transition: border-color .2s, background-color .2s;
    flex-shrink: 0
}

.custom-radio input[type=radio]:checked+.custom-radio__circle {
    background: var(--brand-1);
    border-color: var(--brand-1)
}

.custom-radio input[type=radio]:checked+.custom-radio__circle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: var(--white);
    border-radius: 50%;
    transform: translate(-50%, -50%)
}

.custom-radio__text {
    flex: 1;
    margin-left: 10px;
    font-size: var(--font-size-4);
    line-height: 1.3;
    color: var(--black);
    white-space: normal
}

.mobile-header {
    position: relative;
    display: none;
    align-items: center;
    background: var(--brand-1);
    padding: 20px;
    gap: 10px;
    z-index: 1000
}

.mobile-header__menu-btn,
.mobile-header__phone-btn {
    background: 0 0;
    display: flex;
    align-items: center;
    border: 0;
    cursor: pointer
}

.mobile-header__phone-btn svg {
    display: block
}

.mobile-header__icon {
    display: inline-block;
    width: 30px;
    text-align: center
}

.icon--close {
    display: none;
}

.catalog-modal[open] .icon--menu {
    display: none;
}

.catalog-modal[open] .icon--close {
    display: inline;
}

.mobile-header__menu-btn.active .icon--menu {
    display: none;
}

.mobile-header__menu-btn.active .icon--close {
    display: inline;
}


.mobile-burger-modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .3);
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s;
    margin-top: 85px;
    z-index: 1000
}

.mobile-burger-modal.active {
    opacity: 1;
    pointer-events: auto
}

.mobile-burger-modal__menu {
    background: var(--white);
    width: 70vw;
    min-width: 100px;
    height: 100vh;
    padding: 32px 20px 20px;
    box-sizing: border-box;
    box-shadow: 2px 0 16px rgba(0, 0, 0, .07);
    position: relative;
    transform: translateX(-100%);
    opacity: 0;
    transition: transform .35s cubic-bezier(.4, 0, .2, 1), opacity .35s cubic-bezier(.4, 0, .2, 1)
}

.mobile-burger-modal.active .mobile-burger-modal__menu {
    transform: translateX(0);
    opacity: 1
}

.mobile-burger-modal__menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.mobile-burger-modal__menu ul>li {
    padding: 15px 10px;
    background: var(--white);
    font-size: var(--font-size-9);
    border-radius: 5px;
    cursor: pointer;
    transition: background .1s, color .1s
}

.mobile-burger-modal__menu ul>li:hover {
    background: var(--gray-1);
    color: var(--brand-1)
}

.mobile-header__burger-icon {
    display: inline-block;
    width: 28px;
    text-align: center
}

.header,
.header__level {
    display: flex;
    width: 100%;
    box-sizing: border-box
}

.header {
    min-width: 320px;
    background: var(--white);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .03);
    padding: 10px 50px 0;
    flex-direction: column;
    gap: 15px
}

.header__level {
    align-items: center
}

.header__level--top {
    font-size: var(--font-size-2);
    min-height: 32px;
    gap: 18px;
    display: flex;
    width: 100%;
    color: var(--gray-5);
    justify-content: space-between
}

.header__level--top--left {
    display: flex;
    align-items: center;
    width: 100%
}

.header__level--top--right {
    gap: 15px
}

.header__city,
.header__level--top--right,
.header__menu {
    display: flex;
    align-items: center
}

.header__city {
    background: var(--gray-1);
    border-radius: 5px;
    padding: 0 12px;
    height: 30px;
    font-weight: 500;
    gap: 6px
}

.header__menu {
    gap: 18px;
    margin-left: 18px
}

.bottom-menu__more,
.header__menu-more {
    position: relative;
    display: none
}

.bottom-menu__dots,
.header__menu-dots {
    font-size: 12px;
    cursor: pointer;
    user-select: none;
    line-height: 1
}

.bottom-menu__dots {
    color: var(--white)
}

.bottom-menu__dropdown,
.header__menu-dropdown {
    position: absolute;
    top: 28px;
    right: 0;
    border: 1px solid #eee;
    border-radius: 6px;
    min-width: 120px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
    padding: 8px 0;
    z-index: 1001;
    display: flex;
    flex-direction: column
}

.header__menu-dropdown {
    background: var(--white)
}

.bottom-menu__dropdown {
    background: var(--brand-1)
}

.bottom-menu__dropdown a,
.header__menu-dropdown a {
    padding: 8px 18px;
    color: var(--gray-5);
    text-decoration: none;
    font-weight: 500;
    transition: background .2s, color .2s
}

.header__menu-dropdown a:hover {
    background: var(--brand-1);
    color: var(--white)
}

.bottom-menu__dropdown a:hover {
    background: var(--white)
}

.bottom-menu__more>summary,
.header__menu-more>summary {
    list-style: none;
    cursor: pointer
}

.bottom-menu__more>summary::-webkit-details-marker,
.catalog-modal__summary::-webkit-details-marker,
.header__menu-more>summary::-webkit-details-marker {
    display: none
}

.header__info {
    display: flex;
    align-items: center;
    gap: 20px;
    white-space: nowrap
}

.header__info-phone {
    background: var(--gray-1);
    border-radius: 5px;
    padding: 5px 10px
}

.header__info-delivery,
.header__info-phone,
.header__info-time {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.header__info-bell {
    position: relative;
    display: inline-block
}

.header__info-bell-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: var(--gray-1);
    border-radius: 5px;
    position: relative
}

.header__info-bell-icon svg {
    width: 16px;
    height: 18px;
    display: block
}

.header__info-bell-badge {
    position: absolute;
    top: 2px;
    right: 2px;
    background: var(--system-red);
    color: var(--white);
    font-size: 9px;
    font-weight: 700;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    pointer-events: none;
    transition: width .1s, height .1s, font-size .1s
}

.header__info-bell:hover .header__info-bell-badge {
    width: 16px;
    height: 16px;
    font-size: 11px
}

.header__info-manager {
    position: relative;
    display: inline-flex;
    margin-right: 14px
}

.header__info-manager-summary {
    display: flex;
    align-items: center;
    background: var(--gray-1);
    border-radius: 6px;
    padding: 4px 12px 4px 4px;
    font-weight: 500;
    cursor: pointer;
    list-style: none;
    transition: background .2s
}

.header__info-manager-summary:hover,
.header__info-manager[open] .header__info-manager-summary {
    background: #F0F3F5
}

.header__avatar {
    border: 2px solid var(--system-green);
    object-fit: cover
}

.header__manager-arrow {
    margin-left: 6px;
    transition: transform .2s
}

.header__info-manager[open] .header__manager-arrow {
    transform: rotate(180deg)
}

.manager-popup {
    position: absolute;
    top: 100%;
    right: 0;
    width: 339px;
    background: var(--gray-1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, .16);
    border-radius: 10px;
    padding: 18px 18px 16px;
    z-index: 1001;
    font-size: var(--font-size-5);
    color: var(--deep-black);
    margin-top: 8px
}

.header__info-manager:not([open]) .manager-popup {
    display: none
}

.manager-popup__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px
}

.manager-popup__avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px solid var(--brand-1);
    object-fit: cover
}

.manager-popup__label {
    color: #9ca3af;
    font-size: var(--font-size-2);
    font-weight: 500;
    margin-bottom: 3px
}

.manager-popup__name {
    color: var(--brand-1);
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 2px
}

.manager-popup__phone {
    font-size: var(--font-size-6);
    margin-bottom: 2px;
    margin-top: 10px;
    font-weight: 400;
    color: var(--gray-5)
}

.manager-popup__email {
    color: var(--system-green);
    font-size: var(--font-size-5)
}

.manager-popup>hr {
    border: 0;
    border-top: 2px solid var(--system-green);
    margin: 10px 0
}

.manager-popup__contacts {
    display: flex;
    margin-bottom: 10px;
    justify-content: space-between
}

.manager-popup__contact {
    padding: 4px 8px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    color: var(--white);
    font-weight: 500;
    text-decoration: none;
    font-size: var(--font-size-4);
    gap: 6px;
    scale: 1;
    transition: scale .2s
}

.manager-popup__contact--mail {
    background: #c9a928
}

.manager-popup__contact--tg {
    background: #61a8de
}

.manager-popup__contact--viber {
    background: #7d3daf
}

.manager-popup__contact:hover {
    color: var(--white);
    scale: 1.1
}

.manager-popup__desc {
    font-size: var(--font-size-4);
    color: var(--deep-black);
    margin-top: 6px;
    line-height: 1.5;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

.header__avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 4px
}

.header__level--middle {
    justify-content: space-between;
    gap: 15px;
    min-height: 60px;
    flex-wrap: wrap;
    width: 100%;
    box-sizing: border-box
}

.header__section {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center
}

.header__logo,
.logo__last {
    font-weight: 700;
    font-size: 21px
}

.header__logo {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.1;
    color: var(--white);
    background: var(--brand-1);
    border-radius: 5px;
    letter-spacing: .2px;
    min-width: 100px;
    height: 80px
}

.logo__last {
    position: absolute;
    bottom: 17px;
    right: -15px;
    color: #000;
    background: 0 0
}

.site-section-header {
    padding: 24px 50px 0
}

.site-section-header__breadcrumbs {
    margin-bottom: 10px
}

.site-section-header__breadcrumbs-list {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: var(--font-size-5);
    color: var(--gray-4)
}

.site-section-header__breadcrumbs-item {
    display: flex;
    align-items: center
}

.site-section-header__breadcrumbs-link {
    color: var(--gray-4);
    text-decoration: none;
    transition: color .2s
}

.site-section-header__breadcrumbs-link:hover {
    color: var(--deep-black)
}

.site-section-header__breadcrumbs-item:not(:last-child)::after {
    content: "›";
    margin: 0 6px;
    color: var(--gray-2);
    font-size: var(--font-size-4)
}

.site-section-header__breadcrumbs-item--current {
    color: var(--deep-black);
    font-weight: 500
}

.site-section-header__title {
    font-size: var(--font-size-9);
    font-weight: 700;
    color: #111;
    margin-bottom: 10px
}

.catalog-modal__summary {
    background: var(--brand-1);
    color: var(--white);
    height: 48px;
    border: 2px solid var(--brand-1);
    padding: 10px 16px 8px 10px;
    border-radius: 6px;
    font-size: var(--font-size-7);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    transition: background .2s, color .2s;
    user-select: none;
    margin-left: 15px;
    width: 131px;
    list-style: none
}

.catalog-modal__summary:hover {
    background: var(--brand-2);
    color: var(--white)
}

.catalog-modal__icon {
    display: flex;
    gap: 5px;
    align-items: center;
    position: relative
}

.icon--close {
    margin-bottom: 2px;
}

.catalog-modal__content {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    top: 150px;
    height: calc(100vh - 150px);
    z-index: 100;
    background: var(--gray-1);
    margin: 0;
    padding: 10px 50px 0 30px;
    overflow: hidden;
    flex-direction: row;
    align-items: stretch
}

.catalog-modal[open] .catalog-modal__content {
    animation: modalFadeIn .35s cubic-bezier(.6, 0, .4, 1)
}

.catalog-modal__sidebar {
    background: var(--gray-1);
    overflow-y: auto;
    margin-bottom: 48px;
    min-width: 330px
}

.catalog-modal__categories {
    list-style: none;
    padding: 0 0 0 24px;
    display: flex;
    gap: 10px;
    flex-direction: column
}

.catalog-modal__category {
    display: flex;
    align-items: center;
    max-width: 300px;
    min-width: 150px;
    height: 50px;
    gap: 12px;
    background: var(--white);
    padding: 10px 16px;
    border-radius: 6px;
    cursor: pointer;
    transition: background .2s;
    position: relative
}

.catalog-modal__category--active,
.catalog-modal__category:hover {
    background: var(--brand-1);
    color: var(--white)
}

.catalog-modal__category-icon svg path {
    transition: fill .2s;
    fill: var(--brand-1)
}

.catalog-modal__category--active .catalog-modal__category-icon svg path,
.catalog-modal__category:hover .catalog-modal__category-icon svg path {
    fill: var(--white)
}

.catalog-modal__category-arrow {
    display: none;
    margin-left: auto;
    color: var(--brand-1);
    font-size: var(--font-size-8);
    transition: opacity .2s;
    align-items: center
}

.catalog-modal__category--active .catalog-modal__category-arrow,
.catalog-modal__category:hover .catalog-modal__category-arrow {
    display: flex
}

.catalog-modal-main {
    background: var(--gray-1);
    min-width: 0;
    padding: 0 40px;
    overflow: auto;
    margin-bottom: 50px
}

.catalog-modal-main__columns {
    display: grid;
    grid-template-columns: 1.7fr 1.7fr 1.2fr;
    gap: 36px;
    width: 100%;
    align-items: flex-start
}

.catalog-modal-main__title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin: 10px 0;
    width: 100%
}

.catalog-modal-main__list {
    margin: 0 0 12px;
    padding-left: 0;
    color: var(--deep-black);
    font-size: var(--font-size-5);
    list-style: none
}

.catalog-modal-main__group {
    margin-bottom: 18px
}

.catalog-modal-main__group-title {
    font-size: var(--font-size-6);
    font-weight: 700;
    color: var(--deep-black);
    margin: 0 0 8px;
    cursor: pointer;
    transition: color .2s;
    display: block;
    text-decoration: none
}

.catalog-modal-main__group-title--active,
.catalog-modal-main__group-title:hover {
    color: var(--brand-1)
}

.catalog-modal-main__subitem a {
    color: var(--deep-black);
    text-decoration: none;
    transition: color .2s
}

.catalog-modal-main__subitem a:hover {
    color: var(--brand-1);
    text-decoration: none
}

.catalog-modal-main__sublist {
    margin: 0 0 18px 18px;
    padding: 0;
    color: var(--deep-black);
    font-size: var(--font-size-5);
    list-style: disc;
    text-decoration: none
}

.catalog-modal-main__subitem {
    list-style: disc;
    padding: 0;
    font-weight: 400;
    color: var(--deep-black);
    background: 0 0;
    transition: color .2s;
    text-decoration: none !important
}

.catalog-modal-main__subitem:hover {
    color: var(--brand-1);
    text-decoration: underline;
    transition: color .2s;
    cursor: pointer
}

.catalog-modal-main__promo {
    display: flex;
    flex-direction: column;
    gap: 28px;
    min-width: 320px;
    max-width: 370px;
    flex: 1 1 0
}

.catalog-modal-main__promo-block {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    height: 170px;
    display: flex;
    align-items: center;
    justify-content: center
}

.promo-block__bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    filter: brightness(.6)
}

.promo-block__text {
    position: relative;
    z-index: 2;
    color: var(--white);
    font-size: var(--font-size-11);
    font-weight: 700;
    text-align: center
}

.catalog-modal__close {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100vw;
    background: var(--gray-1);
    border: 0;
    border-top: 1px solid var(--gray-2);
    color: var(--deep-black);
    font-size: var(--font-size-4);
    padding: 10px 0;
    cursor: pointer;
    text-align: center;
    z-index: 10;
    font-weight: 300;
    letter-spacing: .03em;
    transition: background .2s
}

.catalog-modal__close:hover {
    background: #e0f2e9;
    color: var(--brand-3)
}

.header__search {
    flex: 1 1 300px;
    display: flex;
    align-items: center;
    background: var(--white);
    border-radius: 5px;
    padding: 4px 10px;
    width: 610px;
    min-width: 200px;
    border: 1px solid #cfd6dd;
    margin: 0 20px;
    z-index: 1000
}

.header__search input {
    border: 0;
    background: 0 0;
    padding: 8px;
    flex: 1;
    outline: 0
}

.header__search select {
    border: 0;
    background: 0 0;
    margin-left: 10px
}

.header__actions,
.header__actions a {
    display: flex;
    align-items: center;
    gap: 10px
}

.header__actions a {
    color: var(--gray-5);
    text-decoration: none;
    flex-direction: column;
    font-size: var(--font-size-4);
    font-weight: 700;
    gap: 6px;
    transition: color .2s, fill .2s
}

.cart-link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-decoration: none;
    color: inherit;
    gap: 4px;
}

.cart-main {
    display: flex;
    align-items: center;
    gap: 2px;
}

.cart-main svg {
    flex-shrink: 0;
}


.cart-labels {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.cart-items,
.cart-total {
    font-size: 9px;
    color: var(--gray-5);
}

.cart-title {
    font-weight: 600;
    color: var(--gray-5)E;
}


.header__actions>a {
    width: 100px
}

.header__actions a:hover {
    color: var(--brand-1)
}

.header__actions a svg {
    width: 24px;
    height: 24px
}

.header__actions a svg path {
    fill: var(--gray-5);
    transition: fill .2s
}

.header__actions a:hover svg path {
    fill: var(--brand-1)
}

.header__cabinet-menu {
    position: relative;
    display: inline-block
}

.header__cabinet-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--gray-1);
    border-radius: 5px;
    font-weight: 500;
    color: var(--deep-black);
    cursor: pointer;
    border: 0;
    outline: 0;
    font-size: var(--font-size-6);
    list-style: none;
    transition: background .2s
}

.header__cabinet-btn:hover,
.header__cabinet-menu[open] .header__cabinet-btn {
    background: #f0f3f5
}

.header__cabinet-icon,
.header__enter-btn {
    display: flex;
    align-items: center;
    justify-content: center
}

.header__enter-btn {
    height: 50px;
    color: var(--deep-black);
    cursor: pointer;
    border-radius: 5px;
    background: var(--gray-1)
}

.header__enter-btn>span,
.header__search input,
.header__search select {
    font-size: var(--font-size-6)
}

.header__cabinet-icon {
    background: var(--brand-2);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    border: 2px solid var(--brand-1)
}

.header__cabinet-icon svg {
    display: block
}

.header__cabinet-arrow {
    margin-left: 6px;
    transition: transform .2s
}

.header__cabinet-menu[open] .header__cabinet-arrow {
    transform: rotate(180deg)
}

.cabinet-popup {
    position: absolute;
    top: 85%;
    right: 0;
    z-index: 100;
}

.header__cabinet-menu:not([open]) .cabinet-popup {
    display: none
}

.cabinet-popup,
.user-cabinet__sidebar-panel {
    width: 270px;
    border-radius: 5px;
    font-size: var(--font-size-5);
    color: var(--deep-black);
    background: #f0f3f5;
    padding: 8px
}

.cabinet-popup__user,
.user-cabinet__user {
    border-radius: 6px;
    color: var(--brand-4);
    padding: 6px 8px;
    font-size: var(--font-size-5);
    margin-bottom: 8px;
    margin-top: 8px;
    display: flex;
    gap: 16px;
    align-items: flex-start
}

.cabinet-popup__avatar-wrapper,
.user-cabinet__avatar-wrapper {
    width: 45px;
    height: 45px;
    border: 2px solid var(--brand-1);
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0
}

.cabinet-popup__avatar,
.user-cabinet__avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%
}

.cabinet-popup__name,
.user-cabinet__name {
    font-weight: 700;
    font-size: var(--font-size-4);
    margin-bottom: 2px;
    color: var(--black)
}

.cabinet-popup__org,
.user-cabinet__org {
    font-size: var(--font-size-2);
    font-weight: 700;
    color: var(--brand-1)
}

.cabinet-popup__nav,
.user-cabinet__nav {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 6px;
    color: var(--white)
}

.user-cabinet__nav {
    margin-top: 8px
}

.cabinet-popup__link,
.user-cabinet__link {
    display: flex;
    align-items: center;
    flex-direction: row !important;
    gap: 12px;
    background: var(--white);
    border-radius: 6px;
    padding: 10px 12px;
    color: #272e35;
    font-size: var(--font-size-4);
    text-decoration: none;
    font-weight: 500;
    transition: background .2s, color .2s
}

.user-cabinet__link--active {
    background: var(--brand-1);
    color: var(--white);
    pointer-events: none
}

.cabinet-popup__link-icon svg path,
.user-cabinet__link-icon svg path {
    fill: var(--black) !important;
    transition: fill .2s ease
}

.cabinet-popup__link:hover,
.user-cabinet__link:hover {
    background-color: var(--brand-1);
    color: var(--white) !important;
    transition: background-color .2s ease, color .2s ease
}

.cabinet-popup__link:hover .cabinet-popup__link-icon svg path,
.user-cabinet__link--active .user-cabinet__link-icon svg path,
.user-cabinet__link:hover .user-cabinet__link-icon svg path {
    fill: var(--white) !important
}

.cabinet-popup__link-icon,
.user-cabinet__link-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex-shrink: 0
}

.cabinet-popup__link-icon svg,
.user-cabinet__link-icon svg {
    width: 20px;
    height: 20px;
    display: block
}

.cabinet-popup__logout,
.user-cabinet__logout {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--system-red) !important;
    font-weight: 500;
    margin-bottom: 8px;
    text-decoration: none;
    border: 0;
    background: 0 0;
    cursor: pointer;
    transition: color .2s
}

.cabinet-popup__logout:hover,
.user-cabinet__logout:hover {
    color: var(--system-red) !important;
    border: 0
}

.cabinet-popup__logout svg path,
.user-cabinet__logout svg path {
    fill: var(--system-red) !important;
    transition: none
}

.cabinet-popup__logout:hover svg path,
.user-cabinet__logout:hover svg path {
    fill: var(--system-red) !important
}

.header__level--bottom {
    background: var(--brand-1);
    border-radius: 5px;
    padding: 0;
    min-height: 38px;
    margin-top: 5px
}

.header__level--bottom a,
.header__sale {
    height: 38px;
    display: flex;
    align-items: center
}

.header__level--bottom a {
    color: var(--white);
    text-decoration: none;
    padding: 6px 18px;
    border-radius: 4px;
    transition: color .2s;
    white-space: nowrap;
    font-size: var(--font-size-4);
    font-weight: 500
}

.header__level--bottom a:hover {
    color: var(--brand-4);
    background: var(--brand-2);
    border-radius: 0;
}

.header__sale {
    background: var(--system-orange);
    font-weight: 700;
    text-transform: uppercase
}

.main-container {
    padding: 10px 50px;
    background-color: var(--white)
}

.carousel-indicators [data-bs-target] {
    background-color: var(--brand-4);
    width: 10px;
    height: 10px;
    border-radius: 50%
}

.carousel-indicators .active {
    background-color: var(--brand-1)
}

.carousel-item img {
    object-fit: cover;
    width: 100%;
    border-radius: 5px
}

.main-slider__item img {
    height: 248px
}

.carousel-control-prev {
    left: 0;
    width: 5%
}

.carousel-control-next {
    right: 0;
    width: 5%
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 35px;
    height: 35px;
    min-width: 35px;
    min-height: 35px
}

.carousel {
    width: 100%;
    margin-bottom: 30px
}

.category-swiper {
    width: 100%;
    padding: 30px 50px
}

.category-swiper__slide {
    display: flex;
    justify-content: center
}

.category-swiper__card {
    background: var(--gray-1);
    min-width: 200px;
    max-width: 220px;
    height: 200px;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    color: var(--deep-black);
    font-weight: 700;
    padding: 15px;
}

.category-swiper__title {
    font-size: var(--font-size-6);
    font-weight: 700;
    margin-bottom: 10px;
    text-align: center
}

.category-swiper__img {
    width: 150px;
    object-fit: contain
}

.articles-swiper-block__arrow,
.category-swiper__button,
.partners-swiper__arrow {
    color: var(--white);
    border-radius: 5px;
    width: 32px;
    height: 32px;
    border: 0;
    transition: color .2s;
    transform: translateY(-50%)
}

.articles-swiper-block__arrow,
.category-swiper__button {
    background: var(--brand-1);
    top: 58%
}

.partners-swiper__arrow {
    background: var(--brand-1);
    box-shadow: 0 0px 8px rgb(0 0 0 / 12%);
}

.category-swiper__button--prev {
    left: 0
}

.category-swiper__button--next {
    right: 0
}

.articles-swiper-block__arrow:hover,
.category-swiper__button:hover,
.partners-swiper__arrow:hover {
    color: var(--brand-4);
    background: var(--brand-2);
    box-shadow: 0 0px 8px rgb(0 0 0 / 12%);
}

.articles-swiper-block__arrow--next:after,
.articles-swiper-block__arrow--prev:after,
.category-swiper__button--next:after,
.category-swiper__button--prev:after,
.partners-swiper-doc__arrow--next:after,
.partners-swiper-doc__arrow--prev:after,
.partners-swiper__arrow--next:after,
.partners-swiper__arrow--prev:after,
.products-block__arrow:after {
    font-size: var(--font-size-8);
    font-weight: 700
}

.products-block {
    background: var(--gray-1);
    margin-left: -50px;
    margin-right: -50px;
    padding: 16px 50px;
    height: max-content
}

.products-block__header {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.products-block__title {
    font-size: var(--font-size-12);
    font-weight: 700;
    margin: 0 0 8px
}

.products-block__nav {
    display: flex;
    gap: 30px;
    margin-bottom: -15px
}

.products-block__arrow {
    width: 30px;
    height: 30px;
    border: 0;
    background: var(--black);
    color: var(--white);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    transition: background .2s
}

.products-block__arrow:hover {
    background: var(--brand-1)
}

.products-swiper {
    width: 100%;
    padding-bottom: 12px
}

.products-swiper__wrapper {
    align-items: stretch
}

.products-swiper__slide {
    display: flex;
    justify-content: center;
    align-items: stretch;
    height: auto
}

.card-grid-view {
    display: grid;
    gap: 15px;
    justify-content: center;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr))
}

.card-list-view,
.product-card {
    display: flex;
    flex-direction: column
}

.product-card {
    background: var(--white);
    border-radius: 5px;
    border: 1px solid var(--gray-2);
    box-shadow: 0 2px 8px rgba(60, 60, 60, .06);
    max-width: 300px;
    width: 100%;
    box-sizing: border-box;
    gap: 10px;
    align-items: flex-start;
    padding: 15px;
    position: relative;
}

.product-card-location-prise {
    display: flex;
    align-items: center;
    gap: 10px;
}

.product-card__price-row--promo {
    display: flex;
    flex-direction: row !important;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
    margin-bottom: 4px;
}

.product-card__price-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.product-card__price-main {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.product-card__price-new {
    font-weight: 700;
    color: var(--system-red);
    font-size: clamp(12px, 4vw, var(--font-size-8));
}

.product-card__price-old {
    font-size: clamp(12px, 4vw, var(--font-size-8));
    color: var(--gray-4);
    text-decoration: line-through;
    font-weight: 700;
    opacity: 0.7;
}

.product-card__price-info {
    font-size: var(--font-size-1);
    color: var(--gray-5);
}

.product-card__discount {
    background: #fdeaea;
    color: var(--system-red);
    font-size: var(--font-size-4);
    font-weight: 700;
    border-radius: 5px;
    padding: 5px;
    align-self: flex-start;
    display: inline-block;
    line-height: 1;
}

.product-card__carousel-inner {
    background: #f9f9f9;
    overflow: hidden;
    cursor: pointer;
    aspect-ratio: 1 / 1;
}

.product-card__carousel-inner img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block
}

.product-card__carousel-progress {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 8px 0 0;
    padding: 0;
    width: 100%;
    gap: 1px;
    background: 0 0;
    box-sizing: border-box
}

.product-card__carousel-bar {
    flex-grow: 1;
    height: 2px;
    background: var(--gray-2);
    transition: background .2s;
    margin: 0 4px;
    min-width: 0
}

.product-card__carousel-bar.active {
    background: var(--black)
}

.product-card__top-row {
    display: flex;
    align-items: center;
    width: -webkit-fill-available;
    position: absolute;
    z-index: 1;
    justify-content: space-between;
    margin-right: 15px;
}

.product-card__badges {
    display: flex;
    gap: 8px
}

.product-card__badge {
    font-size: var(--font-size-2);
    padding: 2px 10px;
    border-radius: 4px;
    font-weight: 600;
    display: inline-block;
    line-height: 1.4
}

.product-card__badge--promo {
    background: var(--system-red);
    color: var(--brand-4)
}

.product-card__favorite {
    top: 18px;
    right: 18px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 0;
    background: 0 0;
    padding: 0
}

.articles-swiper-block__filters input[type=radio],
.product-card__favorite-checkbox {
    display: none
}

.product-card__favorite-icon {
    width: 20px;
    height: 20px;
    display: block
}

.product-card__favorite-path {
    transition: fill .2s, stroke .2s
}

.product-card__favorite-checkbox:checked+.product-card__favorite-icon .product-card__favorite-path {
    fill: var(--system-red);
    stroke: var(--system-red)
}

.product-card__favorite:hover .product-card__favorite-icon .product-card__favorite-path {
    fill: var(--system-red);
    stroke: var(--system-red);
}

.product-card__carousel {
    width: 100%;
    margin: 0 auto 1px;
    position: relative
}

.product-card__carousel-inner {
    border-radius: 8px;
    background: var(--white)
}

.product-card__img {
    height: 250px;
    object-fit: contain;
    margin: 0 auto;
    display: block
}

.product-card__carousel-indicators {
    position: static;
    margin-top: 8px;
    display: flex;
    justify-content: center;
    gap: 6px
}

.product-card__carousel-indicators [data-bs-target] {
    background-color: #e0e0e0;
    width: 50px;
    height: 3px;
    border-radius: 1px;
    border: 0;
    opacity: 1;
    transition: background .2s
}

.product-card__carousel-indicators .active,
.product-card__carousel-indicators [aria-current=true] {
    background-color: var(--black)
}

.product-card__source-options {
    display: flex;
    gap: 8px;
}

.product-card__source-option,
.product-card__volume-option {
    background: var(--white);
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    padding: 3px 8px;
    font-size: var(--font-size-2);
    cursor: pointer;
    color: var(--deep-black);
    transition: background .2s, border-color .2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative
}

.product-card__source-option input,
.product-card__volume-option input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0
}

.product-card__source-option:hover,
.product-card__volume-option:hover {
    background: var(--gray-1)
}

.product-card__volume-option:has(input:checked) {
    background: var(--brand-1);
    border-color: var(--brand-1);
    color: var(--white)
}

.product-card__source-option:has(input:checked) {
    background: #ff5252;
    border-color: #ff5252;
    color: var(--white)
}

.product-card__source-name,
.product-card__source-price,
.product-card__volume-value {
    display: inline-block;
    line-height: 1.2
}

.product-card__price-row {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.product-card__price {
    font-size: var(--font-size-8);
    font-weight: 700;
    color: var(--deep-black);
    margin-bottom: 2px
}

.product-card__price-info {
    font-size: var(--font-size-1)
}

.product-card__desc {
    font-size: var(--font-size-4);
    color: var(--deep-black);
    min-height: 38px;
    height: 60px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.product-card__info-row {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    font-size: var(--font-size-1);
}

.product-card__pack {
    color: #868686
}

.product-card__stock {
    color: var(--deep-black)
}

.product-card__stock-qty {
    color: var(--brand-1);
    font-weight: 600
}

.product-card__actions {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px
}

.product-card__buy,
.product-card__buy-red,
.product-card__counter {
    flex: 1 1 0;
    min-width: 0
}

.product-card__buy-red {
    background: var(--system-red) !important
}

.product-card__counter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    overflow: hidden;
    max-width: 110px;
}

.product-card__counter-btn {
    background: 0 0;
    border: 0;
    width: 40px;
    font-size: var(--font-size-9);
    cursor: pointer;
    color: var(--black);
    font-weight: 700;
    transition: background .2s
}

.product-card__counter-btn:hover {
    background: var(--gray-2)
}

.product-card__counter-input,
.product-card__counter-value {
    width: 36px;
    border: 0;
    text-align: center;
    font-size: var(--font-size-6);
    outline: 0;
    background: var(--white);
    -moz-appearance: textfield
}

.product-card__counter-input::-webkit-inner-spin-button,
.product-card__counter-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.product-card__counter-input[type=number] {
    -moz-appearance: textfield
}

.product-card__buy,
.product-card__buy-red,
.product-card__counter-btn,
.product-card__waitlist,
.product-card__waitlist-added {
    height: 40px
}

.product-card__buy,
.product-card__buy-red {
    background: var(--brand-1);
    color: var(--white);
    width: 100%;
    border: 0;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: var(--font-size-4);
    font-weight: 600;
    cursor: pointer;
    transition: background .2s
}

.product-card__buy:hover {
    background: var(--brand-2)
}

.product-card__buy-red:hover {
    background: #ac2525 !important
}

.product-card__buy-icon {
    display: block
}

.product-card__waitlist,
.product-card__waitlist-added {
    width: 100%;
    max-width: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--white);
    border: 0;
    border-radius: 5px;
    font-size: var(--font-size-4);
    cursor: pointer;
    transition: background .2s
}

.product-card__waitlist {
    background: var(--system-blue)
}

.product-card__waitlist-added {
    background: #4299e19c
}

.category-level2-filters__close svg,
.product-card__waitlist-icon {
    display: block
}

.product-card__waitlist-added:hover {
    background: #4299e1d7
}

.product-card__waitlist:hover {
    background: #1769aa
}

.product-card__delivery {
    margin-top: 8px;
    font-size: var(--font-size-1);
    color: #b0b0b0;
    text-align: left;
    width: 100%
}

.products-block__view-all {
    display: block;
    width: 100%;
    text-align: center;
    margin: 2px auto 0;
    color: var(--gray-4);
    font-size: var(--font-size-4);
    cursor: pointer;
    text-decoration: none
}

.product-card-mini>a,
.products-block__view-all:hover {
    color: var(--deep-black)
}

.banner-wide {
    height: 90px;
    border-radius: 4px;
    overflow: hidden
}

.banner-wide__link {
    display: block;
    width: 100%;
    background: var(--gray-1);
    color: var(--deep-black);
    font-size: var(--font-size-8);
    font-weight: 500;
    text-align: center;
    line-height: 90px;
    height: 90px;
    text-decoration: none;
    position: relative
}

.banner-wide__image {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.banners-row {
    display: flex;
    gap: 16px;
    margin: 16px 0
}

.banners-row__item {
    flex: 1
}

.banners-row--three .banners-row__item {
    flex: 0 0 calc(33.333% - 11px)
}

.promo-cards {
    display: flex;
    gap: 20px;
    height: 100%;
    margin: 24px 0
}

.feature-card {
    position: relative;
    min-width: 450px;
    max-width: 600px;
    flex-grow: 1;
    border-radius: 5px;
    overflow: hidden;
    color: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 32px 24px 24px 32px
}

.feature-card__background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    filter: brightness(.6)
}

.feature-card__content {
    position: relative;
    z-index: 2;
    text-align: right
}

.feature-card__title {
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 1.2
}

.feature-card__subtitle {
    font-size: var(--font-size-6);
    font-weight: 400;
    opacity: .9
}

.promo-cards__grid {
    flex: 2;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 16px
}

.promo-cards__item {
    background: var(--gray-1);
    border-radius: 5px;
    padding: 18px 12px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--deep-black);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .03);
    transition: box-shadow .2s, letter-spacing .2s, color .2s;
    letter-spacing: 0
}

.promo-cards__item:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
    letter-spacing: 1px;
    color: var(--brand-1)
}

.promo-cards__item-image {
    width: 230px;
    object-fit: contain;
    margin-bottom: 12px
}

.promo-cards__item-title {
    font-size: var(--font-size-6);
    font-weight: 500;
    text-align: center
}

.products-promo-block {
    display: flex;
    gap: 24px;
    justify-content: space-between;
    width: 100%;
    align-items: stretch;
    height: 100%
}

.products-promo-block__products {
    background: var(--gray-1);
    border-radius: 5px;
    padding: 20px
}

.products-promo-block__feature,
.products-promo-block__products {
    display: flex;
    flex-direction: column
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 30px;
    flex: 1 1 0;
    height: 100%
}

.product-card-mini {
    min-width: 170px;
    max-width: 250px;
    background: var(--white);
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
    padding: 16px 12px 12px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: stretch;
    flex-shrink: 0;
    border: 1px solid #eaeaea;
    transition: box-shadow .2s, border-color .2s, color .2s
}

.product-card-mini>a {
    transition: color .2s
}

.product-card-mini>a:hover {
    color: var(--brand-1)
}

.product-card-mini:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
    border-color: #b2dfb2
}

.product-card-mini__image-wrapper {
    position: relative;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin-bottom: 8px;
    transition: color .2s;
    cursor: pointer
}

.product-card-mini__image {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: 100%;
    object-fit: contain;
    display: block
}

.product-card-mini__label {
    position: absolute;
    top: 0;
    right: 0;
    background: var(--brand-1);
    color: var(--white);
    font-size: var(--font-size-2);
    padding: 2px 8px;
    border-radius: 4px;
    z-index: 2;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06)
}

.product-card-mini__title {
    font-size: var(--font-size-4);
    margin-bottom: 8px;
    min-height: 38px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.product-card-mini__price-col {
    display: flex;
    flex-direction: column;
    gap: 1px
}

.product-card-mini__price {
    font-weight: 700;
    font-size: var(--font-size-5);
    color: var(--deep-black);
    margin-right: 6px
}

.cart-flex__summary span b,
.product-card-mini__price--from {
    color: var(--system-red);
    font-weight: 700
}

.product-card-mini__tax {
    font-size: var(--font-size-1);
    color: var(--gray-4)
}

.product-card-mini__bottom {
    display: flex;
    gap: 8px;
    margin-top: 5px
}

.product-card-mini__qty {
    flex: 1 1 0;
    min-width: 0
}

.product-card-mini__cart-btn {
    flex: 1 1 0;
    min-width: 0;
    box-sizing: border-box
}

.product-card-mini__cart-btn,
.product-card-mini__qty {
    height: 36px;
    border-radius: 4px;
    font-size: var(--font-size-6)
}

.product-card-mini__qty {
    border: 1px solid #d0d0d0;
    padding-left: 5px;
    box-sizing: border-box
}

.product-card-mini__cart-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    cursor: pointer;
    transition: background .2s;
    padding: 0
}

.product-card-mini__cart-btn:hover {
    background: var(--brand-1)
}

.info-row {
    display: flex;
    gap: 10px;
    width: 100%;
    padding: 16px 0;
    box-sizing: border-box
}

.info-row__banner,
.info-row__benefits {
    flex: 1 1 0;
    box-sizing: border-box
}

.info-row__banner {
    display: flex
}

.info-row__benefits {
    background: var(--gray-1);
    border-radius: 5px;
    padding: 20px 10px;
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between
}

.benefits-card {
    background: var(--white);
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .03);
    padding: 10px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 105px;
    flex: 1 1 0;
    transition: box-shadow .2s
}

.benefits-card__row {
    display: flex;
    align-items: center;
    gap: 10px
}

.benefits-card__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.benefits-card__icon svg circle,
.benefits-card__icon svg line,
.benefits-card__icon svg path,
.benefits-card__icon svg polygon,
.benefits-card__icon svg rect {
    fill: #000 !important
}

.benefits-card__main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0
}

.benefits-card__title {
    font-size: var(--font-size-6);
    font-weight: 600;
    color: var(--deep-black);
    line-height: 1.2
}

.benefits-card__desc {
    font-size: var(--font-size-2);
    color: var(--gray-4);
    line-height: 1.2
}

.benefits-card__link {
    margin-top: auto;
    color: var(--gray-5);
    font-weight: 500;
    font-size: var(--font-size-6);
    text-decoration: none;
    display: inline-block;
    letter-spacing: 1;
    transition: letter-spacing .2s, color .2s
}

.benefits-card__link:hover {
    color: var(--brand-1);
    letter-spacing: 2px
}

.info-row {
    margin-top: 30px
}

.info-row__banner {
    align-items: stretch
}

.info-banner {
    position: relative;
    min-width: 645px;
    border-radius: 8px;
    padding: 24px 24px 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    height: 240px;
    box-sizing: border-box;
    overflow: hidden
}

.info-banner__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    z-index: 1;
    pointer-events: none
}

.info-banner__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin-bottom: 0;
    width: 50%;
    z-index: 2;
    position: relative
}

.info-banner__tag {
    display: inline-block;
    background: #7e8b9961;
    color: var(--white);
    font-size: var(--font-size-6);
    border-radius: 6px;
    padding: 5px 14px 6px;
    font-weight: 500;
    white-space: nowrap;
    height: max-content
}

.articles-swiper-block {
    width: 100%;
    margin: 15px auto 36px
}

.articles-swiper-block__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px
}

.articles-swiper-block__filters {
    display: flex;
    gap: 8px
}

.articles-swiper-block__filter {
    border: 0;
    background: var(--gray-1);
    color: var(--deep-black);
    font-size: var(--font-size-6);
    font-weight: 500;
    border-radius: 5px;
    padding: 5px 10px;
    cursor: pointer;
    transition: background .2s, color .2s;
    user-select: none;
    display: inline-block
}

#tab-accountant:checked+.feedback__tab,
#tab-boss:checked+.feedback__tab,
#tab-manager:checked+.feedback__tab,
.articles-swiper-block__filters input[type=radio]:checked+.articles-swiper-block__filter {
    background: var(--brand-1);
    color: var(--white)
}

.articles-swiper-block__all-link {
    color: var(--gray-4);
    font-size: var(--font-size-2);
    text-decoration: none;
    transition: color .2s;
    margin-left: 24px
}

.articles-swiper-block__all-link:hover {
    color: var(--brand-3)
}

.articles-swiper-block__slider {
    display: flex;
    align-items: center;
    position: relative;
    gap: 14px
}

.articles-swiper {
    width: 100%
}

.articles-swiper-block__arrow--prev {
    left: -15px
}

.articles-swiper-block__arrow--next {
    right: -15px
}

.articles-swiper .swiper-wrapper {
    display: flex
}

.products-swiper-mini .swiper-wrapper.no-swiper {
    display: flex;
    gap: 16px;
    justify-content: flex-start
}

.products-swiper-mini .swiper-slide {
    width: 220px;
    max-width: 100%
}

.articles-swiper .swiper-slide {
    height: auto;
    display: flex
}

.articles-swiper-card {
    min-width: 300px;
    width: 365px;
    background: var(--gray-1);
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%
}

.articles-swiper-card__img-wrap {
    position: relative;
    width: 100%;
    height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 5px;
}

.articles-swiper-card__img {
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    object-fit: cover
}

.articles-swiper-card__date {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #00000040;
    color: var(--white);
    font-size: var(--font-size-2);
    border-radius: 6px;
    padding: 6px;
    opacity: .93
}

.articles-swiper-card__content {
    padding: 14px 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 7px
}

.articles-swiper-card__title {
    font-size: var(--font-size-4);
    font-weight: 600;
    color: var(--black);
    margin-bottom: 2px
}

.articles-swiper-card__title:hover {
    color: var(--brand-1);

}

.articles-swiper-card__desc {
    font-size: var(--font-size-2);
    color: var(--gray-4);
    line-height: 1.28
}

.articles-swiper-card__tags {
    margin-top: 6px;
    display: flex;
    gap: 7px
}

.articles-swiper-card__tag {
    font-size: var(--font-size-2);
    border-radius: 5px;
    padding: 3px 4px;
    font-weight: 500;
    background: var(--gray-1);
    color: var(--deep-black);
    white-space: nowrap
}

.articles-swiper-card__tag--green {
    background: #48bb78;
    color: var(--white)
}

.articles-swiper-card__tag--orange {
    background: var(--system-orange);
    color: var(--white)
}

.partners-logos {
    background: var(--white);
    width: 100%;
    display: flex;
    align-items: center;
    height: 120px;
    padding: 30px 50px;
    position: relative
}

.partners-swiper {
    width: 100%;
    overflow: hidden;
    padding: 30px 50px
}

.partners-swiper-card {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 60px
}

.partners-swiper-card__img {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    object-fit: cover
}

.partners-swiper-card {
    margin: 0 auto
}

.partners-swiper__arrow {
    position: absolute;
    z-index: 10;
    top: 68%;
    background: var(--gray-4)
}

.partners-swiper__arrow--prev {
    left: 50px;
    background: var(--gray-2)
}

.partners-swiper__arrow--next {
    right: 50px;
    background: var(--gray-2)
}

.footer {
    background: #d5dfe6;
    padding: 30px 50px;
    font-size: var(--font-size-4)
}

.footer__container {
    display: flex;
    flex-direction: row
}

.footer__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    gap: 20px;
    margin-bottom: 40px;
    margin-top: 40px;
    max-width: 1600px;
    margin: 0 auto;
}

.footer__title {
    font-weight: 600;
    line-height: 20px;
    color: var(--deep-black);
    margin: 0 0 15px;
    font-size: var(--font-size-6)
}

.footer__list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: var(--font-size-4)
}

.footer__link {
    color: var(--deep-black);
    text-decoration: none;
    display: block;
    margin-bottom: 8px;
    transition: color .2s
}

.footer__link:hover {
    color: var(--brand-1)
}

.footer__phone {
    display: flex;
    margin-bottom: 8px
}

.footer__email,
.footer__phone {
    color: var(--deep-black);
    text-decoration: none
}

.footer>div>hr {
    border: 0;
    border-top: 2px solid var(--black);
}

.footer>hr {
    margin: 0 auto;
    max-width: 1600px;
}

.footer__bottom {
    padding-top: 20px;
    margin: 0 auto;
    max-width: 1600px;
}

.footer__copy {
    color: var(--deep-black);
    line-height: 1.5;
    margin: 0
}

.footer__social {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 15px
}

.footer__social-link {
    text-decoration: none;
    font-weight: 500;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: var(--gray-1);
    transition: background .2s
}

.footer__social-link:hover {
    background: var(--brand-1)
}

.mini-catalog-level1 {
    padding: 0
}

.mini-catalog-level1__list {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 24px;
    list-style: none;
    margin: 0;
    padding: 0
}

.mini-catalog-level1__card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 220px;
    background: var(--gray-1);
    border-radius: 5px;
    box-shadow: 0 1px 4px rgba(34, 34, 34, .04);
    text-decoration: none;
    padding: 16px 16px 12px;
    transition: box-shadow .2s, transform .2s;
    color: inherit
}

.mini-catalog-level1__card:hover,
.mini-catalog-level1__card:hover div,
.mini-catalog-level2__card:hover,
.mini-catalog-level2__card:hover div {
    color: var(--brand-2);
}

.mini-catalog-level1__info {
    margin-bottom: 12px
}

.mini-catalog-level1__title {
    font-size: var(--font-size-8);
    font-weight: 600;
    color: var(--deep-black);
    margin-bottom: 6px
}

.mini-catalog-level1__count {
    font-size: var(--font-size-4);
    color: var(--gray-4)
}

.mini-catalog-level1__img-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    margin-top: auto
}

.mini-catalog-level1__img {
    max-height: 115px;
    max-width: 100%;
    border-radius: 5px;
    object-fit: contain;
    display: block
}

.mini-catalog-level2 {
    padding: 0
}

.mini-catalog-level2__list {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 15px;
    list-style: none;
    margin: 0;
    padding: 0
}

.mini-catalog-level2__card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background: var(--gray-1);
    border-radius: 5px;
    box-shadow: 0 1px 4px rgba(34, 34, 34, .04);
    text-decoration: none;
    padding: 10px;
    transition: box-shadow .2s, transform .2s;
    color: inherit;
    min-height: 90px;
    height: 100%;
    border: 1px solid var(--gray-1);
}

.mini-catalog-level2__content {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.mini-catalog-level2__title {
    font-size: var(--font-size-4);
    font-weight: 500;
    color: var(--deep-black);
    margin-bottom: 6px;
    line-height: 1.2
}

.mini-catalog-level2__count {
    font-size: var(--font-size-4);
    color: var(--gray-4)
}

.mini-catalog-level2__image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin-left: 12px
}

.mini-catalog-level2__image {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    object-fit: cover;
    display: block
}

.category-level2-layout {
    padding-top: 30px;
    display: flex;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
    box-sizing: border-box
}

.category-level2-layout__filters {
    min-width: 220px;
    max-width: 340px
}

.category-level2-layout__content {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column
}

.category-level2-filters {
    width: 280px;
    background: var(--gray-1);
    border-radius: 5px;
    padding: 18px 18px 24px;
    font-size: var(--font-size-5);
    color: var(--deep-black)
}

.category-level2-filters__found {
    font-size: var(--font-size-4);
    color: var(--gray-4);
    margin-bottom: 12px;
    border-bottom: 1px solid var(--gray-2);
    padding-bottom: 10px
}

.category-level2-filters__close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: 0 0;
    border: 0;
    padding: 0;
    cursor: pointer;
    z-index: 10;
    display: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    transition: background .15s
}

.category-level2-filters__close:focus,
.category-level2-filters__close:hover {
    background: #f0f2f5
}

.category-level2-filters__block {
    margin-bottom: 18px
}

.category-level2-filters__title {
    font-size: var(--font-size-5);
    font-weight: 600;
    margin-top: 30px;
    margin-bottom: 10px;
    color: var(--deep-black)
}

.category-level2-filters__categories ul {
    margin: 0;
    padding-left: 18px;
    list-style: none
}

.category-level2-filters__cat-back {
    background: 0 0;
    border: 0;
    color: var(--gray-4);
    font-size: var(--font-size-4);
    cursor: pointer;
    margin-bottom: 6px;
    padding: 0
}

.category-level2-filters__cat-current {
    display: inline-block;
    background: var(--white);
    color: var(--brand-1);
    border-radius: 6px;
    padding: 2px 8px;
    font-weight: 600
}

.category-level2-filters__range {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%
}

.category-level2-filters__input {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    font-size: var(--font-size-4);
    padding: 4px 8px;
    border: 1px solid var(--gray-2);
    border-radius: 6px;
    background: #fafafa;
    box-sizing: border-box;
    height: 32px
}

.category-level2-filters__range-sep {
    color: var(--gray-4);
    font-size: var(--font-size-8);
    line-height: 1;
    user-select: none;
    padding: 0 2px
}

.category-level2-filters__slider {
    margin-bottom: 8px;
    margin-top: 4px
}

.category-level2-filters__checkbox {
    display: flex;
    align-items: center;
    margin-bottom: 6px;
    cursor: pointer;
    font-size: var(--font-size-4);
    user-select: none;
    gap: 7px
}

.category-level2-filters__count {
    color: var(--gray-4);
    font-size: var(--font-size-3);
    margin-left: 4px
}

.category-level2-filters__show-btn {
    width: 100%;
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    border-radius: 8px;
    padding: 10px 0;
    font-size: var(--font-size-6);
    font-weight: 600;
    margin-top: 12px;
    cursor: pointer;
    transition: background .2s
}

.category-level2-filters__show-btn:hover {
    background: var(--brand-1)
}

.category-level2-filters__reset-btn {
    width: 100%;
    background: 0 0;
    color: var(--gray-4);
    border: 0;
    border-radius: 8px;
    padding: 8px 0;
    font-size: var(--font-size-5);
    margin-top: 4px;
    cursor: pointer;
    transition: color .2s
}

.category-level2-filters__reset-btn:hover {
    color: var(--deep-black)
}

.noUi-target {
    background: var(--gray-2);
    border-radius: 2px;
    border: 0;
    box-shadow: none;
    height: 4px;
    margin-top: 12px
}

.noUi-connect {
    background: var(--brand-1)
}

.noUi-horizontal .noUi-handle {
    width: 18px !important;
    height: 18px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 50% !important;
    background: var(--brand-1) !important;
    border: 0 !important;
    box-shadow: 0 2px 8px rgba(67, 160, 71, .16) !important;
    top: 2px !important;
    transform: translate(-50%, -50%) !important;
    cursor: pointer !important;
    outline: 0 !important;
    position: absolute
}

.noUi-handle:after,
.noUi-handle:before {
    display: none !important
}

.noUi-pips {
    margin-top: 12px;
    top: -20px;
    left: 8px;
    height: 30px;
    color: var(--gray-4);
    padding: 5px
}

.noUi-value {
    font-size: var(--font-size-4);
    color: var(--gray-4)
}

.noUi-value:nth-child(4) {
    margin-top: 10px;
    transform: translateX(-13px)
}

.noUi-value:last-child {
    margin-top: 10px;
    transform: translateX(-20px);
    text-align: left
}

.noUi-marker {
    display: none !important
}

.category-level2-filters__block--categories {
    margin-bottom: 18px
}

.category-level2-categories {
    margin: 0 0 4px;
    padding-left: 0
}

.category-level2-categories__nested {
    margin: 0 0 4px 16px;
    padding-left: 0
}

.category-level2-categories__list {
    list-style: none;
    padding: 0
}

.category-level2-categories__item {
    padding: 4px 8px;
    margin-left: 10px;
    cursor: pointer;
    border-radius: 6px;
    color: var(--deep-black);
    transition: background .2s, color .2s;
    margin-bottom: 2px;
    font-size: var(--font-size-5)
}

.category-level2-categories__item:hover,
.category-level2-categories__level--first:hover,
.category-level2-categories__level--second:hover {
    background: #f3f3f3;
    color: var(--brand-1)
}

.category-level2-categories__item--active {
    background: var(--white);
    color: var(--brand-1);
    font-weight: 600;
    box-shadow: 0 1px 4px rgba(34, 34, 34, .04)
}

.category-level2-categories__level {
    position: relative;
    left: 10px;
    cursor: pointer;
    font-size: var(--font-size-5);
    font-weight: 500;
    color: var(--deep-black);
    padding: 4px 8px;
    border-radius: 6px;
    outline: 0;
    list-style: none;
    transition: background .2s, color .2s;
    margin-bottom: 2px;
    background: 0 0;
    border: 0;
    display: block
}

.cart-mobile-card__sum-details summary::-webkit-details-marker,
.category-level2-categories__level::-webkit-details-marker {
    display: none
}

.category-level2-categories__level::marker {
    display: none
}

.category-level2-categories__level::before {
    content: "";
    display: block;
    position: absolute;
    left: -12px;
    top: 50%;
    width: 9px;
    height: 15px;
    background: url('data:image/svg+xml;utf8,<svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.34334 0.429124L8.7073 6.79308C9.09782 7.18361 9.09782 7.81677 8.7073 8.2073L2.34334 14.5713C1.95281 14.9618 1.31965 14.9618 0.929124 14.5713C0.5386 14.1807 0.5386 13.5476 0.929124 13.157L6.58598 7.50019L0.929124 1.84334C0.5386 1.45281 0.5386 0.819648 0.929124 0.429124C1.31965 0.0385994 1.95281 0.0385994 2.34334 0.429124Z" fill="%231E1E1E"/></svg>')no-repeat center center;
    background-size: contain;
    transform: translateY(-50%) rotate(0deg);
    transition: transform .2s
}

details[open]>.category-level2-categories__level::before {
    transform: translateY(-50%) rotate(90deg)
}

.category-level2-categories__level--second {
    padding-left: 12px
}

.category-level2-categories__list {
    margin: 0 0 0 12px
}

.category-level2-cards__toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    gap: 16px
}

.category-level2-cards__sort {
    display: flex;
    align-items: center;
    gap: 8px
}

.category-level2-cards__sort-label {
    font-size: var(--font-size-5);
    color: var(--gray-4);
    margin: 0;
    padding: 0;
    vertical-align: middle
}

.category-level2-cards__sort-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fafafa;
    border: 1px solid var(--gray-2);
    border-radius: 6px;
    font-size: var(--font-size-5);
    color: var(--deep-black);
    padding: 6px 36px 6px 12px;
    height: 36px;
    min-width: 170px;
    outline: 0;
    transition: border-color .2s, box-shadow .2s;
    cursor: pointer;
    box-sizing: border-box;
    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="8" viewBox="0 0 16 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 2L8 6L14 2" stroke="%23888" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 8px;
    margin: 0
}

.category-level2-cards__sort-select:focus {
    border-color: var(--brand-1);
    box-shadow: 0 0 0 2px var(--brand-1)
}

.category-level2-cards__view {
    display: flex;
    gap: 4px;
    align-items: center
}

.category-level2-cards__view-radio,
.wide-card__color-option input[type=radio] {
    display: none
}

.category-level2-cards__view-btn {
    width: 32px;
    height: 32px;
    cursor: pointer;
    display: block;
    position: relative;
    transition: background .2s;
    border: 0;
    padding: 0
}

.category-level2-cards__view-btn--grid::before {
    background: url('data:image/svg+xml;utf8,<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 2C0 0.89543 0.895431 0 2 0H7C8.10457 0 9 0.895431 9 2V7C9 8.10457 8.10457 9 7 9H2C0.89543 9 0 8.10457 0 7V2Z" fill="%23D9D9D9"/><path d="M11 2C11 0.89543 11.8954 0 13 0H18C19.1046 0 20 0.895431 20 2V7C20 8.10457 19.1046 9 18 9H13C11.8954 9 11 8.10457 11 7V2Z" fill="%23D9D9D9"/><path d="M0 13C0 11.8954 0.895431 11 2 11H7C8.10457 11 9 11.8954 9 13V18C9 19.1046 8.10457 20 7 20H2C0.89543 20 0 19.1046 0 18V13Z" fill="%23D9D9D9"/><path d="M11 13C11 11.8954 11.8954 11 13 11H18C19.1046 11 20 11.8954 20 13V18C20 19.1046 19.1046 20 18 20H13C11.8954 20 11 19.1046 11 18V13Z" fill="%23D9D9D9"/></svg>')center center no-repeat
}

.category-level2-cards__view-btn--list::before {
    background: url('data:image/svg+xml;utf8,<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 2C0 0.89543 0.895431 0 2 0H18C19.1046 0 20 0.895431 20 2V7C20 8.10457 19.1046 9 18 9H2C0.895431 9 0 8.10457 0 7V2Z" fill="%23D9D9D9"/><path d="M0 13C0 11.8954 0.895431 11 2 11H18C19.1046 11 20 11.8954 20 13V18C20 19.1046 19.1046 20 18 20H2C0.895431 20 0 19.1046 0 18V13Z" fill="%23D9D9D9"/></svg>')center center no-repeat
}

.category-level2-cards__view-btn--grid::before,
.category-level2-cards__view-btn--list::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin: 6px auto;
    background-size: contain
}

#view-grid:checked+.category-level2-cards__view-btn--grid::before {
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 2C0 0.89543 0.895431 0 2 0H7C8.10457 0 9 0.895431 9 2V7C9 8.10457 8.10457 9 7 9H2C0.89543 9 0 8.10457 0 7V2Z" fill="%234CAF50"/><path d="M11 2C11 0.89543 11.8954 0 13 0H18C19.1046 0 20 0.895431 20 2V7C20 8.10457 19.1046 9 18 9H13C11.8954 9 11 8.10457 11 7V2Z" fill="%234CAF50"/><path d="M0 13C0 11.8954 0.895431 11 2 11H7C8.10457 11 9 11.8954 9 13V18C9 19.1046 8.10457 20 7 20H2C0.89543 20 0 19.1046 0 18V13Z" fill="%234CAF50"/><path d="M11 13C11 11.8954 11.8954 11 13 11H18C19.1046 11 20 11.8954 20 13V18C20 19.1046 19.1046 20 18 20H13C11.8954 20 11 19.1046 11 18V13Z" fill="%234CAF50"/></svg>')
}

#view-list:checked+.category-level2-cards__view-btn--list::before {
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 2C0 0.89543 0.895431 0 2 0H18C19.1046 0 20 0.895431 20 2V7C20 8.10457 19.1046 9 18 9H2C0.895431 9 0 8.10457 0 7V2Z" fill="%234CAF50"/><path d="M0 13C0 11.8954 0.895431 11 2 11H18C19.1046 11 20 11.8954 20 13V18C20 19.1046 19.1046 20 18 20H2C0.895431 20 0 19.1046 0 18V13Z" fill="%234CAF50"/></svg>')
}

.wide-card {
    background: var(--white);
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 18px;
    box-shadow: 0 2px 8px rgba(34, 34, 34, .03);
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-template-rows: auto 1fr;
    gap: 0 10px;
    position: relative;
}

.wide-card__favorite {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 2
}

.wide-card__main {
    display: contents
}

.wide-card__img {
    grid-column: 1/2;
    grid-row: 1/3;
    display: flex;
    align-items: flex-start;
    justify-content: center
}

.wide-card__img img {
    width: 200px;
    height: 200px;
    object-fit: contain;
    border-radius: 5px;
    display: block
}

.wide-card__content {
    grid-column: 2/3;
    grid-row: 1/2;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.wide-card__table {
    grid-column: 2/3;
    grid-row: 2/3;
    margin-top: 16px
}

.wide-card__title {
    font-size: var(--font-size-7);
    font-weight: 600;
}

.wide-card__params-row {
    display: flex;
    gap: 40px;
    /* align-items: center; */
    align-items: flex-start;
}

.wide-card__param {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-4);
    flex-direction: column;
    align-items: flex-start
}


.wide-card__param-label {
    color: var(--deep-black)
}

.wide-card__param-value {
    font-weight: 600;
    color: var(--gray-4)
}

.wide-card__color-value {
    display: flex;
    align-items: center
}

.wide-card__color-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1.5px solid var(--gray-2);
    /* margin-left: 4px */
}

.wide-card__options-row {
    display: flex;
    gap: 0;
    align-items: center
}

.product-card__volume-options,
.wide-card__color-options {
    display: flex;
    gap: 8px
}

.wide-card__color-option {
    cursor: pointer;
    display: inline-flex;
    align-items: center
}

.wide-card__color-option .wide-card__color-dot {
    border: 2px solid var(--gray-2);
    width: 22px;
    height: 22px;
    transition: border-color .2s
}

.wide-card__color-option input[type=radio]:checked+.wide-card__color-dot {
    border-color: var(--brand-1);
    box-shadow: 0 0 0 2px var(--gray-1)
}

.wide-card__brand-link {
    font-size: var(--font-size-3);
    color: var(--gray-4);
    text-decoration: none;
    cursor: pointer;
    transition: color .2s
}

.wide-card__brand-link:hover {
    color: var(--brand-1)
}

.wide-card__table table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-2);
}

.wide-card__table td,
.wide-card__table th {
    padding: 3px 5px;
    text-align: center;
    vertical-align: middle;
    background: 0 0;
    border: 0;
    min-width: 100px
}

.wide-card__table th {
    background: var(--gray-1);
    font-weight: 500;
    color: var(--deep-black);
    border-right: 2px solid var(--white)
}

.wide-card__price {
    font-weight: 700;
    font-size: var(--font-size-6);
    color: var(--deep-black)
}

.wide-card__price-info {
    font-size: var(--font-size-1);
    color: var(--gray-4)
}

.wide-card__stock--red {
    color: var(--system-red);
    font-weight: 600
}

.wide-card__stock--green {
    color: var(--brand-1);
    font-weight: 600
}

.wide-card__buy {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    border-radius: 6px;
    padding: 6px 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s;
    font-size: var(--font-size-5);
    vertical-align: middle
}

.wide-card__buy--red {
    background: var(--system-red)
}

.wide-card__buy:hover {
    background: var(--brand-1)
}

.wide-card__buy--red:hover {
    background: #c62828
}

.wide-card__delivery {
    font-size: var(--font-size-2);
    color: var(--gray-4);
    margin-top: 2px
}

.catalog-items__pagination .pagination {
    margin-bottom: 10px;
    gap: 10px
}

.catalog-items__pagination .page-link {
    color: var(--deep-black);
    border: 0;
    background: 0 0;
    border-radius: 10px !important;
    width: 35px;
    height: 35px;
    font-size: var(--font-size-4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    transition: background .2s, color .2s
}

.catalog-items__pagination .page-item.active .page-link {
    background: var(--brand-1);
    color: var(--white);
    font-weight: 600
}

.catalog-items__pagination .page-item:not(.active):not(.disabled) .page-link:focus,
.catalog-items__pagination .page-link:hover {
    background: var(--gray-1);
    color: var(--brand-1)
}

.catalog-items__pagination,
.category-level2-cards__show-more-btn:focus,
.page-link:focus {
    outline: 0;
    box-shadow: none
}

.catalog-items__pagination,
.page-item.disabled,
.page-link {
    color: var(--gray-2);
    background: 0 0;
    cursor: pointer
}

.catalog-items__pagination__show-more-btn {
    color: var(--black);
    background: 0 0;
    border: 0;
    font-size: var(--font-size-6);
    font-weight: 500;
    padding: 0;
    margin: 16px;
    cursor: pointer;
    transition: color .2s;
    text-decoration: none;
}

.catalog-items__pagination__show-more-btn:hover {
    color: var(--brand-1);
}

.product-preview-container {
    margin: 0 auto
}

.product-preview-card {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: var(--white);
    border-radius: 12px;
    margin-bottom: 32px;
    flex-wrap: wrap
}

.product-gallery {
    display: flex;
    align-items: center;
    height: 470px;
}

.product-gallery__thumbs-column {
    margin-right: 10px;
    display: flex;
    align-items: center;
    height: 100%;
    flex-direction: column
}

.product-gallery__thumbs-list-wrapper {
    height: 100%;
    overflow: hidden;
    position: relative
}

.product-gallery__thumbs-list {
    transition: transform .2s;
    will-change: transform
}

.product-gallery__thumbs-btn {
    border: 0;
    background: 0 0;
    padding: 0;
    margin-bottom: 8px;
    border-radius: 8px;
    width: 100%
}

.product-gallery__thumb-img {
    width: 75px;
    height: 75px;
    border-radius: 5px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    border: 2px solid var(--gray-1);
    transition: border-color .2s
}

.product-gallery__thumbs-btn.active .product-gallery__thumb-img {
    border: 2px solid var(--brand-1)
}

.product-gallery__thumbs-arrow {
    width: 32px;
    height: 32px;
    display: flex;
    background: 0 0;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    outline: 0;
    border: 0
}

.product-gallery__main {
    width: 446px;
    aspect-ratio: 1 / 1;
    max-width: 100%;
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center
}

.product-gallery__main-carousel-item img {
    height: 446px;
    width: 100%;
    border-radius: 5px;
    object-fit: cover
}

.product-preview-card__info {
    flex: 1 1 0;
    min-width: 0;
    gap: 10px;
    display: flex;
    flex-direction: column;
    min-width: 300px;

}

.product-preview-card__title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 18px
}

.product-preview-card__variantss {
    gap: 10px;
    display: flex;
    flex-direction: column;
}

.product-preview-card__params-row {
    display: flex;
    gap: 32px;
    align-items: center;
}

.product-preview-card__param {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-2)
}

.product-preview-card__param-label {
    color: var(--gray-4)
}

.product-preview-card__param-value {
    font-weight: 600;
    color: var(--black)
}

.product-preview-card__color-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1.5px solid var(--gray-2);
    margin-left: 4px
}

.product-preview-card__options-row {
    display: flex;
    gap: 24px;
    align-items: center;
    margin-bottom: 12px
}

.product-preview-card__badges-row {
    display: flex;
    gap: 12px;
}

.product-preview-card__badge {
    display: inline-block;
    background: var(--brand-4);
    color: var(--brand-1);
    border-radius: 7px;
    font-size: var(--font-size-2);
    font-weight: 600;
    padding: 6px 12px;
    letter-spacing: .5px;
    line-height: 1.5;
    width: max-content
}

.product-preview-card__sku {
    font-size: var(--font-size-3);
    color: var(--brand-1);
    margin-left: 16px
}

.product-preview-card__short-table {
    font-size: var(--font-size-4);
    color: var(--black);
    gap: 10px;
    display: flex;
    flex-direction: column;
}

.product-preview-card__short-table div {
    margin-bottom: 2px
}

.product-preview-card__brand-row {
    display: flex;
    align-items: center
}

.product-preview-card__buy-row-wrapper {
    display: flex;
    flex-direction: column
}

.product-preview-card__buy-row-wrapper-top {
    display: flex;
    gap: 15px;
    align-items: center;
    margin-top: 8px
}

.product-preview-card-wrapper {
    display: flex;
    gap: 15px
}

.product-preview-card__brand-row-inner {
    display: flex;
    flex-direction: column
}

.product-preview-card__brand {
    font-weight: 700;
    font-size: var(--font-size-5);
    color: var(--black)
}

.product-preview-card__brand-link {
    font-size: var(--font-size-3);
    color: var(--brand-2);
    text-decoration: underline;
    transition: color .2s
}

.product-preview-card__brand-link:hover {
    color: var(--brand-2)
}

.product-preview-card__brand-logo {
    height: 35px;
    width: 160px;
    object-fit: contain
}

.product-preview-card__buy-block {
    min-width: 340px;
    max-width: 540px;
    border-radius: 5px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(34, 34, 34, .07);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    border: 1px solid #f0f0f0;
}

.product-preview-card__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start
}

.product-preview-card__price-title {
    font-size: var(--font-size-12);
    font-weight: 700;
    margin-bottom: 2px
}

.product-preview-card__price-sub {
    display: block;
    font-size: var(--font-size-4);
    color: var(--gray-4);
    font-weight: 400
}

.product-preview-card__pack-info {
    font-size: var(--font-size-2);
    color: var(--black);
    margin-bottom: 8px;
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    font-weight: 600;
}

.product-preview-card__buy-table {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.product-preview-card__buy-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px
}

.product-preview-card__buy-price {
    font-size: var(--font-size-7);
    font-weight: 600;
    color: var(--black);
    min-width: 120px
}

.product-preview-card__buy-price-sub {
    display: block;
    font-size: var(--font-size-2);
    color: var(--gray-4);
    font-weight: 400;
    margin-top: -3px;
}

.product-preview-card__buy-btn-container {
    width: 100px
}

.product-preview-card__buy-stock {
    font-size: var(--font-size-3);
    font-weight: 600;
    margin-left: 8px;
    min-width: 85px;
}

.product-preview-card__buy-stock--red {
    color: var(--system-red)
}

.product-preview-card__buy-stock--green {
    color: var(--brand-1)
}

.product-preview-card__favorite {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}


.product-preview-card__shipping-info {
    margin-top: 5px;
    font-size: var(--font-size-1);
    color: #a4a9af;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.product-gallery-mobile {
    display: none
}

.product-large-thumbnail-container {
    height: 450px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center
}

.product-large-thumbnail-img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
    display: block
}

.product-preview-card__buy-stock-mobile {
    display: none
}

.product-tabs {
    margin-top: 32px;
    flex-direction: column;
    display: flex
}

.product-tabs__nav {
    display: flex;
    gap: 10px;
    margin-bottom: 24px
}

.product-tabs__btn {
    background: #f4f6f8;
    color: var(--black);
    font-size: var(--font-size-6);
    transition: background .2s, color .2s
}

.product-tabs__btn--active,
.product-tabs__btn:focus {
    background: var(--brand-1);
    color: var(--white);
    outline: 0
}

.product-tabs__content {
    flex: 1;
    display: flex;
    gap: 32px
}

.product-tabs__description {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 400px;
    position: relative
}

.product-tabs__section-cards {
    width: 100%
}

.product-tabs__description p {
    flex: 1 1 auto;
    margin-bottom: 0
}

.product-tabs__certs {
    padding-top: 15px;
    display: flex;
    align-items: center;
    margin-top: auto
}

.product-tabs__certs-label {
    background: var(--gray-1);
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 6px 12px;
    font-size: var(--font-size-5)
}

.product-tabs__certs-btn {
    color: var(--white);
    border: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 6px 16px;
    cursor: pointer;
    font-size: var(--font-size-5);
    transition: background .2s
}

.product-tabs__certs-btn,
.product-tabs__certs-btn:hover {
    background: var(--brand-1)
}

.product-tabs__description-footer {
    color: var(--gray-4);
    font-size: var(--font-size-1);
    margin-top: 18px
}

.product-tabs__pane {
    display: none;
    width: 100%;
    gap: 32px
}

.product-tabs__pane--active {
    display: flex
}

.product-tabs__description {
    flex: 2;
    font-size: var(--font-size-5)
}

.product-tabs__subtitle {
    font-size: var(--font-size-8);
    font-weight: 700;
    margin-bottom: 12px
}

.product-tabs__characteristics {
    flex: 1
}

.product-tabs__characteristics-list div {
    display: flex;
    justify-content: space-between;
    padding: 8px 14px;
    font-size: var(--font-size-5);
    background: var(--gray-1)
}

.product-tabs__characteristics-list div:nth-child(even) {
    background: var(--white)
}

.product-tabs__characteristics-list div:last-child {
    border-bottom: none
}

.product-tabs__characteristics-list dt {
    font-weight: 500;
    color: #666
}

.product-tabs__characteristics-list dd {
    margin: 0;
    font-weight: 400;
    color: var(--black)
}

.products-block-mini {
    padding: 30px 50px;
    background-color: var(--gray-1)
}

.tab-panel[hidden] {
    display: none
}

.product-tabs__btn {
    cursor: pointer;
    padding: 8px 16px;
    border: 0;
    background: var(--gray-1);
    font-weight: 600;
    border-radius: 5px
}

.product-tabs__btn--active {
    background: var(--brand-1)
}

.tab-panel {
    width: 100%
}

.cart-flex {
    border-radius: 5px
}

.cart-flex__header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px
}

.cart-flex__title {
    font-size: var(--font-size-10);
    font-weight: 700;
    margin: 0
}

.cart-flex__actions {
    display: flex;
    gap: 8px
}

.cart-flex__action-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-4);
    font-weight: 500;
    padding: 6px 16px;
    border-radius: 5px;
    background: var(--gray-2);
    border: 1px solid var(--gray-2);
    transition: background .2s
}

.cart-flex__action-btn:hover {
    background: var(--gray-1)
}

.cart-flex__sort-row__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    padding: 8px 10px;
    background: var(--gray-1);
    margin-bottom: 10px
}

.cart-flex__sort-row {
    display: flex;
    align-items: center;
    gap: 8px
}

.cart-flex__sort-label {
    font-size: var(--font-size-4);
    color: var(--black)
}

.cart-flex__sort-select {
    width: 220px;
    font-size: var(--font-size-4);
    height: 32px;
    padding: 2px 8px
}

.cart-flex__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
    border-radius: 5px;
    padding: 8px 10px;
    gap: 32px;
    background: var(--gray-1)
}

.cart-flex__footer-left {
    display: flex;
    align-items: center;
    gap: 18px
}

.cart-flex__footer-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px
}

.cart-flex__summary {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 18px;
    font-size: var(--font-size-4)
}

.cart-flex__order-btn {
    font-size: var(--font-size-4);
    padding: 8px 12px;
    border-radius: 5px;
    font-weight: 400;
    background: var(--brand-1);
    border: 0;
    color: var(--white);
    transition: background .2s
}

.cart-flex__order-btn:hover {
    background: var(--brand-2)
}

@media (max-width:900px) {
    .cart-flex {
        padding: 8px 2px
    }

    .cart-flex__summary {
        flex-direction: column;
        align-items: flex-end;
        gap: 3px
    }
}

.mobile-cards-flex__table {
    display: flex;
    flex-direction: column
}

.cart-flex__table {
    width: 100%;
    overflow-x: auto
}

.cart-flex__row,
.cart-flex__thead {
    display: flex;
    min-width: 1200px;
    align-items: stretch
}

.cart-flex__thead {
    font-weight: 600;
    background: var(--gray-1);
    font-size: var(--font-size-5)
}

.cart-flex__row {
    font-size: var(--font-size-5);
    border-bottom: 1px solid #ececec;
    transition: background .2s
}

.cart-flex__row:hover {
    background: var(--gray-1)
}

.cart-flex__cell {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 6px;
    min-width: 0;
    box-sizing: border-box;
    position: relative;
    font-size: var(--font-size-2);
    border-right: 2px solid var(--white)
}

.cart-flex__cell--checkbox,
.cart-flex__cell--num {
    width: 36px;
    min-width: 36px
}

.cart-flex__cell--img,
.cart-flex__cell--sku {
    min-width: 60px
}

.cart-flex__cell--name {
    flex: 2 1 260px;
    min-width: 375px;
    gap: 10px;
    justify-content: space-between;
    text-align: left
}

.cart-flex__img {
    width: 50px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid var(--gray-1)
}

.cart-flex__name-content {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.cart-flex__name-link {
    text-decoration: dotted;
    color: #1b5e20
}

.cart-flex__stock {
    display: inline-block;
    margin-top: 2px;
    padding: 2px 10px;
    border-radius: 6px;
    font-size: var(--font-size-2);
    font-weight: 600;
    background: var(--gray-1);
    color: var(--brand-1);
    margin-right: 4px
}

.cart-flex__stock--red {
    background: var(--system-red);
    color: var(--white);
}

.cart-flex__stock--green {
    background: var(--brand-1);
    color: var(--white);
}

.cart-flex__cell--nds,
.cart-flex__cell--unit {
    min-width: 65px;
    justify-content: center
}

.cart-flex__cell--pack,
.cart-flex__cell--price {
    min-width: 85px;
    justify-content: center
}

.cart-flex__cell--total {
    min-width: 130px;
    justify-content: center
}

.cart-flex__cell--sum {
    min-width: 95px;
    justify-content: center
}

.cart-flex__cell--nds-sum {
    min-width: 125px;
    justify-content: center
}

.cart-flex__cell--qty,
.cart-flex__cell--instock {
    min-width: 100px;
    justify-content: center
}

.cart-mobile-card {
    display: none;
    align-items: center;
    gap: 5px;
    padding: 10px;
    border: 1px solid var(--gray-1);
    border-radius: 5px;
    background: var(--white);
    position: relative;
    margin-bottom: 16px
}

.cart-mobile-card__remove {
    background: 0 0;
    border: 0;
    font-size: var(--font-size-10);
    cursor: pointer;
    left: 0;
    top: 0;
    padding: 0
}

.cart-mobile-card__img {
    flex-shrink: 0;
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center
}

.cart-mobile-card__img img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.cart-mobile-card__content {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px
}

.cart-mobile-card__top-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%
}

.cart-mobile-card__title {
    font-size: var(--font-size-16);
    color: var(--brand-2);
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    font-weight: 500;
    line-height: 1.3;
    display: inline-block;
    flex: 1 1 auto;
    min-width: 0;
    word-break: break-word
}

.cart-mobile-card__bottom-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px
}

.cart-mobile-card__sum-details {
    flex-shrink: 0
}

.cart-mobile-card__sum-label {
    color: var(--gray-4);
    font-size: var(--font-size-3);
    margin-right: 4px
}

.cart-mobile-card__sum-value {
    font-weight: 700;
    font-size: 20px;
    margin-right: 6px
}

.cart-mobile-card__arrow {
    vertical-align: middle;
    transition: transform .2s
}

.cart-mobile-card__sum-details[open] .cart-mobile-card__arrow {
    transform: rotate(180deg)
}

.cart-mobile-card__sum-details {
    position: relative;
    display: inline-block
}

.cart-mobile-card__sum-dropdown {
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 10;
    min-width: 200px;
    background: var(--white);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
    border-radius: 5px;
    padding: 12px 16px;
    margin-top: 8px;
    font-size: var(--font-size-4);
    color: var(--black);
    border: 1px solid var(--gray-1);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .15s, transform .15s
}

.cart-mobile-card__sum-details[open] .cart-mobile-card__sum-dropdown {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0)
}

.cart-mobile-card__sum-details summary {
    list-style: none;
    outline: 0;
    cursor: pointer;
    padding: 0
}

.cart-mobile-card__sum-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 7px;
    font-size: var(--font-size-2);
    color: var(--black)
}

.cart-mobile-card__sum-line:last-child {
    margin-bottom: 0
}

.cart-mobile-card__sum-line--total {
    font-weight: 700;
    font-size: var(--font-size-2);
    color: var(--brand-1);
    border: 1px solid var(--gray-1);
    padding-top: 7px;
    margin-top: 7px
}

.cart-mobile-card__qty {
    display: flex;
    align-items: center;
    overflow: hidden;
    background: var(--white);
    height: 44px;
    min-width: 120px;
    max-width: 260px;
    width: 100%;
    padding: 1px;
    justify-content: space-between
}

.form-check {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 8px 10px;
    cursor: pointer;
    border-radius: 5px;
    background: var(--gray-1)
}

.cart-flex__qty-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center
}

.cart-flex__qty {
    width: 54px;
    text-align: center;
    border: 1px solid var(--gray-2);
    border-radius: 4px;
    font-size: var(--font-size-5);
    padding: 2px 4px
}

.cart-flex__qty.is-invalid {
    border-color: var(--system-red);
    background: #ffebee
}

.cart-flex__qty-error {
    display: none;
    color: var(--system-red);
    font-size: var(--font-size-2);
    text-align: center;
    white-space: normal;
    border: 1px solid var(--system-red);
    background: var(--gray-1);
    border-radius: 5px;
    padding: 10px 12px;
    position: absolute;
    left: 50%;
    bottom: 100%;
    transform: translateX(-50%);
    margin-bottom: 8px;
    z-index: 2;
    width: max-content;
    pointer-events: none
}

.tooltip-green .tooltip-inner,
.tooltip-red .tooltip-inner {
    background-color: var(--brand-1) !important;
    color: var(--gray-1) !important;
    font-weight: 500
}

.tooltip-green.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,
.tooltip-green.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: var(--brand-1) !important;
}

.tooltip-red .tooltip-inner {
    background-color: var(--system-red) !important;
    padding: 5px;
}

.tooltip-red.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,
.tooltip-red.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: var(--system-red) !important;
}

.order {
    margin: 0 auto
}

.order__layout {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.order__main {
    /* flex: 2 1 0; */
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin-bottom: 20px
}

.order__sidebar {
    flex: 1 1 0;
    min-width: 340px;
    max-width: 400px;
    position: sticky;
    top: 20px;
    align-self: start;
    margin-bottom: 20px;
}

.order__section {
    background: var(--white);
    border-radius: 10px;
    border: 1px solid var(--gray-2);
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .031);
    padding: 24px 24px 18px;
    margin-bottom: 0
}

.order__section-title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 22px
}

.order__delivery-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 18px
}

.order__delivery-tab {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 18px 12px 12px;
    min-width: 0;
    min-height: 110px;
    font-size: var(--font-size-4);
    background: var(--gray-1);
    border-radius: 10px;
    border: 0;
    transition: background .2s, border-color .2s;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    flex: 1 1 0;
    margin-bottom: 0
}

.order__delivery-tab-icon {
    padding: 10px
}

.order__delivery-tab-content {
    text-align: start
}

.order__delivery-tab--active,
.order__delivery-tab:focus,
.order__delivery-tab:hover {
    background: var(--brand-1);
    color: var(--white)
}

.order__delivery-tab-title {
    font-weight: 700;
    margin-bottom: 3px;
    font-size: var(--font-size-6);
    display: flex;
    align-items: center
}

.order__delivery-tab--active .order__delivery-tab-desc,
.order__delivery-tab:focus .order__delivery-tab-desc,
.order__delivery-tab:hover .order__delivery-tab-desc {
    color: var(--white);
    opacity: 1
}

.order-tab-content,
.tab-content {
    display: none
}

.order-tab-content.active,
.tab-content.active {
    display: block
}

.order__delivery-content {
    margin-bottom: 0
}

.order-pickup__container {
    display: flex;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    gap: 10px;
    min-height: 250px;
    height: 250px
}

.order-pickup__item,
.order-pickup__list {
    border-radius: 8px;
    background: var(--white);
    display: flex;
    min-width: 0
}

.order-pickup__list {
    flex: 1 1 0;
    max-width: 50%;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .03);
    padding: 6px 0 6px 6px;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
    height: 100%
}

.order-pickup__item {
    border: 1.5px solid var(--gray-2);
    padding: 10px 12px;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    transition: border-color .2s
}

.order-pickup__item--selected {
    border-color: var(--brand-1);
    background: #f6fbf7
}

.order-pickup__shop {
    color: #269f41;
    font-weight: 600;
    font-size: var(--font-size-5);
    display: block;
    margin-bottom: 2px
}

.order-pickup__info {
    font-size: var(--font-size-3);
    color: var(--color-12);
    display: flex;
    gap: 12px
}

.order-pickup__btn {
    border: 1.5px solid var(--gray-2);
    border-radius: 7px;
    padding: 7px 18px;
    background: var(--white);
    color: var(--black);
    font-weight: 500;
    font-size: var(--font-size-5);
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s;
    white-space: nowrap
}

.order-pickup__btn--selected,
.order-pickup__btn:focus,
.order-pickup__btn:hover,
.order__payment-item--active,
.order__payment-item:focus,
.order__payment-item:hover {
    background: var(--brand-1);
    color: var(--white);
    border-color: var(--brand-1)
}

.order-pickup__map {
    flex: 1 1 0;
    max-width: 50%;
    min-width: 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
    height: 100%;
    display: flex
}

.order-pickup__map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block
}

.order__payment-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.order__payment-item {
    border-radius: 8px;
    padding: 16px 12px;
    border: 1.5px solid var(--gray-2);
    cursor: pointer;
    display: flex;
    height: 100px;
    align-items: center;
    gap: 12px;
    transition: background .2s, border-color .2s;
    min-width: 0
}

.order__payment-item--active .order__payment-icon svg path,
.order__payment-item:focus .order__payment-icon svg path,
.order__payment-item:hover .order__payment-icon svg path {
    fill: var(--white)
}

.order__payment-title {
    font-size: var(--font-size-5);
    font-weight: 700;
    margin-bottom: 6px
}

.order__payment-desc {
    font-size: var(--font-size-3);
    color: #555
}

.cabinet-content__table-row:focus td,
.cabinet-content__table-row:hover td,
.order__payment-item--active .order__payment-desc,
.order__payment-item:focus .order__payment-desc,
.order__payment-item:hover .order__payment-desc {
    color: var(--white)
}

.order__comment {
    width: 100%;
    min-height: 60px;
    border-radius: 8px;
    border: 1.5px solid var(--gray-2);
    font-size: var(--font-size-5);
    padding: 10px;
    margin-top: 8px;
    resize: vertical;
    background: var(--gray-1);
}

.order__summary {
    border-radius: 10px;
    border: 1px solid var(--gray-2);
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .03);
    padding: 24px 24px 18px;
    width: 100%;
}

.order__summary-block-top,
.order__summary-block {
    margin-bottom: 14px;

}

.order__summary-block-top {
    max-height: 350px;
    overflow-x: auto;
}

.order__summary-block-top::-webkit-scrollbar-thumb {
    background: var(--brand-1);
    border-radius: 50px;
    min-width: 24px;
}

.order__summary-block-top::-webkit-scrollbar-thumb:hover {
    background: var(--brand-1);
}

.order__summary-block-top::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

/* Для Firefox */
.order__summary-block-top {
    scrollbar-width: thin;
    scrollbar-color: var(--brand-1) transparent;
}




.order__summary-row {
    font-size: var(--font-size-4);
    color: var(--black);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 8px;
}

.order__summary-row p {
    margin: 0;
}

.order__summary-row2 {
    font-size: var(--font-size-4);
    color: var(--black);
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    justify-content: space-between;
}

.order__summary-brand {
    color: var(--brand-1);
    font-weight: 700;
    font-size: var(--font-size-6);
    margin-bottom: 10px;
    margin-top: 10px;
    display: flex;
    justify-content: space-between
}

.order__summary-brand-input {
    width: 100%;
    border: none;
    color: var(--brand-1);
    font-weight: 700;
    outline: none;
}

.clear-input {
    cursor: pointer;
}

.order__summary-brand-icons {
    display: flex;
    gap: 10px
}

.order__summary-row--success {
    color: var(--brand-1);
    font-weight: 600
}

.order__summary-row--total {
    color: var(--deep-black);
    font-size: var(--font-size-7);
    font-weight: 700;
    margin-top: 10px;
    border-top: 1.5px solid var(--gray-2);
    padding-top: 10px
}

.order__summary-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 18px
}

.order__summary-btn {
    width: 100%;
    padding: 13px 0;
    border-radius: 5px;
    font-size: var(--font-size-6);
    font-weight: 600;
    cursor: pointer;
    border: 0;
    transition: background .2s, color .2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

.order__summary-btn--main {
    background: var(--brand-1);
    color: var(--white)
}

.order__summary-btn--main:hover {
    background: var(--brand-1)
}

.order__summary-btn--secondary {
    background: var(--gray-1);
    color: var(--deep-black);
    border: 1.5px solid var(--gray-2)
}

.order__summary-btn--secondary:hover {
    background: var(--gray-1)
}

.order__summary-btn-arrow {
    font-size: var(--font-size-10);
    margin-left: 6px
}

.order__summary-btn-icon {
    font-size: var(--font-size-9);
    margin-right: 6px
}

.delivery-box,
.delivery-box__top {
    display: flex;
    justify-content: space-between
}

.delivery-box {
    width: 50%;
    border-radius: 5px;
    padding: 15px;
    font-size: var(--font-size-4);
    height: 100%;
    flex-direction: column
}

.delivery-box__top {
    margin-bottom: 12px;
    width: 100%;
    align-items: center;
    gap: 16px
}

.delivery-box__label {
    font-weight: 700;
    flex-shrink: 0
}

.delivery-address {
    position: relative;
    display: inline-block;
    cursor: pointer
}

.delivery-address__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    font-weight: 700;
    font-size: var(--font-size-2);
    list-style: none;
    user-select: none;
    transition: color .2s;
    color: var(--black);
    cursor: pointer
}

.delivery-address__arrow-path {
    transition: fill .2s;
    fill: var(--black)
}

.delivery-address[open]>.delivery-address__summary .delivery-address__arrow-path,
.delivery-address__summary:hover .delivery-address__arrow-path,
.delivery-box__submit:hover svg {
    fill: var(--brand-1)
}

.delivery-address[open]>.delivery-address__summary,
.delivery-address__summary:hover {
    color: var(--brand-1)
}

.delivery-address__list {
    position: absolute;
    top: calc(100% - 5px);
    right: 0;
    width: 250px;
    background: var(--white);
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .07);
    padding: 5px 0;
    z-index: 10
}

.delivery-box__address-input {
    width: 100%;
    margin-bottom: 16px
}

.delivery-box__inputs {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px
}

.delivery-box__input {
    max-width: 300px;
    min-width: 80px
}

.delivery-box__address-input,
.delivery-box__input {
    padding: 5px;
    border-radius: 5px;
    font-size: var(--font-size-4);
    outline: 0;
    border: 1px solid var(--gray-2)
}

.delivery-box__cost {
    margin-bottom: 3px
}

.delivery-box__submit {
    width: max-content;
    background: var(--brand-1);
    color: var(--white);
    padding: 10px;
    border: 1px solid var(--brand-1);
    border-radius: 5px;
    font-size: var(--font-size-4);
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, color .2s, fill .2s
}

.delivery-box__submit:hover {
    background: var(--gray-1);
    color: var(--brand-1)
}

.delivery-options {
    border-radius: 5px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.delivery-options__title {
    font-weight: 700;
    margin-bottom: 12px
}

.delivery-option__logo {
    width: 120px;
    height: 20px;
    object-fit: contain
}

.user-cabinet__content {
    width: 100%
}

.user-cabinet {
    display: flex;
    gap: 20px
}

.user-main__columns {
    display: flex;
    gap: 40px
}

.user-main__section {
    flex: 1 1 0;
    min-width: 320px
}

.auth-labels-row label,
.user-main__section--personal {
    flex: 1 1 0
}

.user-main__section--details {
    flex: 1.9 1 0;
    min-width: 260px
}

.user-main__title {
    font-size: var(--font-size-8);
    font-weight: 700;
    margin-bottom: 16px
}

.user-main__personal-block {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px
}

.user-main__avatar-wrapper {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 2px solid var(--brand-1);
    overflow: hidden;
    flex-shrink: 0
}

.user-main__avatar-input {
    display: none
}

.user-main__avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.user-main__avatar-actions {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.user-main__avatar-link {
    font-size: var(--font-size-3);
    color: #2196f3;
    text-decoration: underline;
    cursor: pointer
}

.user-main__info-list {
    margin-bottom: 12px
}

.user-main__info-row {
    display: flex;
    gap: 8px;
    margin-bottom: 4px
}

.user-main__info-label {
    color: var(--gray-4);
    width: 70px;
    flex-shrink: 0
}

.user-main__info-value--bold {
    font-weight: 600
}

.user-main__info-value--email {
    font-weight: 600;
    color: var(--deep-black)
}

.user-main__info-note {
    font-size: var(--font-size-3);
    color: #666;
    margin-bottom: 14px
}

.user-main__btn {
    display: inline-block;
    padding: 8px 18px;
    border-radius: 5px;
    background: var(--gray-2);
    border: 1px solid var(--gray-2);
    color: var(--deep-black);
    font-weight: 500;
    font-size: var(--font-size-5);
    cursor: pointer;
    transition: background .2s
}

.user-main__avatar-link--delete {
    color: var(--system-red);
    text-decoration: underline;
    background: 0 0;
    border: 0;
    padding: 0;
    width: max-content
}

.user-main__avatar-link--delete:focus {
    outline: 1px dotted var(--system-red)
}

.user-main__avatar-link--delete:hover,
.user-main__avatar-link--upload:hover {
    text-decoration: underline;
    opacity: .8
}

.user-main__btn--secondary:hover {
    background: #f1f1f1
}

.user-main__details-block {
    margin-bottom: 18px
}

.user-main__details-row {
    margin-bottom: 6px;
    font-size: var(--font-size-4)
}

.user-main__details-label {
    font-weight: 600;
    margin-right: 8px
}

.user-main__details-value {
    color: var(--gray-5)
}

.user-main__subtitle {
    font-size: var(--font-size-6);
    font-weight: 600;
    margin: 16px 0 8px
}

.user-main__addresses {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.user-main__address-item {
    gap: 8px;
    position: relative
}

.user-main__address-remove {
    background: 0 0;
    border: 0;
    color: var(--black);
    font-size: var(--font-size-9);
    line-height: 1;
    cursor: pointer;
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%)
}

.user-main__address-default {
    color: var(--gray-4);
    font-size: var(--font-size-3)
}

.user-main__address-make-default {
    color: var(--brand-1);
    font-size: var(--font-size-3);
    text-decoration: underline;
    cursor: pointer
}

.user-main__address-add {
    margin-top: 12px
}

.cabinet-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    align-items: center;
    justify-content: center
}

.cabinet-modal.active {
    display: flex
}

.cabinet-modal__overlay {
    position: fixed;
    inset: 0;
    background: rgba(30, 30, 30, .2);
    backdrop-filter: blur(3px);
    z-index: 1
}

.cabinet-modal__window {
    position: relative;
    background: var(--white);
    border-radius: 5px;
    padding: 32px 24px 24px;
    min-width: 500px;
    max-width: 95vw;
    z-index: 2;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch
}

.cabinet-modal__close {
    position: absolute;
    top: 12px;
    right: 18px;
    font-size: var(--font-size-12);
    color: var(--gray-4);
    cursor: pointer;
    background: 0 0;
    border: 0;
    line-height: 1;
    z-index: 3;
    transition: color .2s
}

.cabinet-modal__close:hover {
    color: var(--system-red)
}

.cabinet-modal__title {
    font-size: var(--font-size-9);
    margin-bottom: 18px;
    text-align: center;
    font-weight: 700
}

.cabinet-modal__form {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.cabinet-modal__input {
    padding: 8px 12px;
    border-radius: 5px;
    border: 0;
    font-size: var(--font-size-5);
    background: var(--white);
    border: 1px solid var(--gray-2);
}

.cabinet-modal__checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-size-5);
    cursor: pointer;
    user-select: none
}

.cabinet-modal__checkbox {
    width: 16px;
    height: 16px;
    accent-color: var(--brand-2)
}

.cabinet-modal__submit {
    margin-top: 8px;
    padding: 10px;
    border-radius: 6px;
    color: var(--white);
    border: 0;
    font-weight: 600;
    font-size: var(--font-size-6);
    cursor: pointer;
    transition: background .2s
}

.cabinet-modal__submit,
.cabinet-modal__submit:hover {
    background: var(--brand-1)
}

.cabinet-content__orders {
    width: 100%;
    box-sizing: border-box
}

.cabinet-content__title {
    font-size: var(--font-size-10);
    font-weight: 700;
    margin-bottom: 18px
}

.cabinet-content__filters {
    display: flex;
    background: var(--gray-1);
    align-items: center;
    gap: 12px;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 18px
}

.cabinet-content__date-input {
    border: 0 !important
}

.cabinet-content__table-wrapper {
    width: 100%;
    overflow: auto;
    max-height: 500px;
    border-radius: 5px;
    background: var(--white)
}

.cabinet-content__table {
    width: 100%;
    min-width: 200px;
    border-collapse: collapse
}

.mobile-dublicate-content {
    display: none
}

.cabinet-content__table thead th {
    background: var(--gray-1);
    font-size: var(--font-size-5);
    font-weight: 600;
    padding: 12px 8px;
    border-right: 2px solid var(--white);
    text-align: left;
    white-space: nowrap
}

.cabinet-content__table tbody td {
    font-size: var(--font-size-5);
    padding: 10px 8px;
    border-bottom: 1px solid var(--gray-1);
    vertical-align: top;
    white-space: nowrap
}

.cabinet-content__table tbody tr:nth-child(even) {
    background: var(--gray-1)
}

.cabinet-content__delivery-title {
    font-weight: 700
}

.cabinet-content__delivery-address {
    color: #555;
    font-size: var(--font-size-3)
}

.cabinet-content__table-row {
    cursor: pointer;
    transition: background .15s
}

.cabinet-content__table-row:focus,
.cabinet-content__table-row:hover {
    background: var(--brand-1) !important;
    color: var(--white)
}

.cabinet-content__table-row:focus .cabinet-content__delivery-title,
.cabinet-content__table-row:hover .cabinet-content__delivery-title {
    color: var(--white)
}

.cabinet-content__table-row:focus .cabinet-content__delivery-address,
.cabinet-content__table-row:hover .cabinet-content__delivery-address {
    color: #e0f5e0
}

.cabinet-content__date-input:focus {
    border: 1.5px solid var(--brand-1);
    outline: 0
}

.cabinet-content__filter-label {
    font-size: var(--font-size-5);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px
}

.cabinet-content__date-field {
    position: relative;
    display: flex;
    width: 160px;
    align-items: center
}

.cabinet-content__date-input {
    padding: 8px 30px 8px 12px;
    border: 1px solid var(--gray-2);
    border-radius: 6px;
    font-size: var(--font-size-5);
    background: var(--white);
    cursor: pointer;
    min-width: 140px;
    box-sizing: border-box;
    transition: border .2s
}

.cabinet-content__calendar-icon {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    pointer-events: none;
    fill: var(--gray-4)
}

.flatpickr-calendar {
    border-radius: 10px;
    box-shadow: 0 4px 24px rgba(30, 30, 30, .1);
    font-family: inherit;
    border: 1px solid var(--gray-2);
    margin-top: 6px;
    padding: 0 16px 16px
}

.flatpickr-weekdays {
    background: var(--gray-1);
    border-radius: 5px
}

.flatpickr-day {
    border-radius: 50%;
    transition: background .15s, color .15s
}

.flatpickr-day.today,
.flatpickr-day:hover {
    background: var(--gray-1);
    color: var(--deep-black)
}

.flatpickr-day.endRange,
.flatpickr-day.selected,
.flatpickr-day.startRange {
    background: var(--brand-1);
    color: var(--white)
}

.flatpickr-input[readonly] {
    background: var(--white);
    cursor: pointer
}

.order-table__table-wrapper {
    overflow-x: auto
}

.order-table__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font-size-4);
    background: var(--white)
}

.order-table__cell {
    vertical-align: middle;
    text-align: center;
    border: 0
}

.order-table-nomber {
    max-width: 40px;
}

.order-table-name {
    min-width: 260px;
}

.order-table-other {
    min-width: 90px;
}

.order-table-unit .order-table-prise .order-table-quantity .order-table-sum .order-table-nds .order-table-sumnds .order-table__cell,
.order-table__table th {
    padding: 16px 8px;
    font-size: var(--font-size-4)
}

.order-table__row {
    cursor: pointer
}

.order-table__name {
    text-align: left;
    padding: 10px 0;
}

.order-table__row:has(.order-table__checkbox:checked) {
    background: #eafbe7 !important
}

.order-table__row:has(.order-table__checkbox:checked):hover {
    background: #d4f5d0 !important
}

.order-table__row:hover:not(:has(.order-table__checkbox:checked)) {
    background: #f6fbf3 !important
}

.order-table__cell--checkbox {
    width: 36px;
    text-align: center
}

.order-table__row--selected {
    background: #eafbe7
}

.order-table__article {
    color: var(--brand-3);
    font-weight: 500;
    cursor: pointer
}

.order-table__article,
.order-table__product {
    transition: color .2s, text-decoration .2s
}

.order-table__row:hover .order-table__article,
.order-table__row:hover .order-table__product {
    color: var(--brand-3);
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-underline-offset: 2px
}

.order-table__brand {
    color: var(--gray-4);
    font-size: var(--font-size-3)
}

.order-table__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px
}

.order-table__title {
    font-weight: 700;
    font-size: var(--font-size-9)
}

.order-table__back-btn {
    background: 0 0;
    border-radius: 5px
}

.order-table__back-icon {
    font-size: var(--font-size-8);
    margin-right: 6px
}

.order-table__info {
    background: var(--gray-1);
    border-radius: 5px;
    margin-bottom: 20px;
    padding: 20px
}

.order-table__back-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: max-content;
    color: var(--gray-5);
    background: var(--white);
    border: 1px solid #1b242c1f;
    font-size: var(--font-size-5);
    font-weight: 500;
    cursor: pointer;
    padding: 5px 16px;
    margin: 0;
    transition: background .2s
}

.order-table__back-btn:hover {
    background: #1b242c1f
}

.order-table__back-btn svg {
    flex-shrink: 0
}

.order-table__info-columns {
    display: flex;
    width: 100%;
    gap: 40px;
    margin-top: 20px
}

.order-table__info-col {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px
}

.order-table__info-col--comment {
    flex: 1.5 1 0;
    max-width: 550px
}

.order-table__info-label {
    color: var(--deep-black);
    font-size: var(--font-size-4);
    font-weight: 700;
    margin-top: 8px
}

.order-table__info-label:first-child {
    margin-top: 0
}

.order-table__info-value {
    color: var(--deep-black);
    font-size: var(--font-size-4);
    word-break: break-word
}

@media (max-width:900px) {
    .order-table__info-columns {
        flex-direction: column;
        gap: 16px;
        padding: 16px 12px 12px
    }

    .order-table__info-col,
    .order-table__info-col--comment {
        min-width: 0;
        max-width: 100%
    }

    .order-table__back-btn {
        padding: 16px 12px 0
    }
}

.order-table__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    border-radius: 5px;
    gap: 24px;
    padding: 8px 10px;
    background: var(--gray-1)
}

.order-table__footer-left,
.order-table__select-btn {
    display: flex;
    align-items: center;
    gap: 14px
}

.order-table__select-btn {
    gap: 8px;
    background: var(--gray-1);
    color: var(--brand-3);
    border: 0;
    border-radius: 4px;
    padding: 8px 18px;
    font-size: var(--font-size-5);
    cursor: pointer;
    transition: background .2s, color .2s
}

.order-table__select-btn:disabled,
.order-table__select-btn[disabled] {
    background: #f2f2f2;
    color: var(--gray-2);
    cursor: not-allowed
}

.order-table__add-to-cart-btn,
.order-table__select-checkbox {
    display: flex;
    align-items: center
}

.order-table__select-checkbox input[type=checkbox] {
    accent-color: var(--brand-3);
    width: 18px;
    height: 18px;
    margin: 0;
    pointer-events: none
}

.order-table__add-to-cart-btn {
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    gap: 5px;
    border-radius: 4px;
    padding: 9px 18px;
    font-size: var(--font-size-5);
    cursor: pointer;
    opacity: 1;
    transition: opacity .2s
}

.order-table__add-to-cart-btn:hover:not(:disabled) {
    background: #176e13
}

.order-table__add-to-cart-btn:disabled,
.order-table__add-to-cart-btn[disabled] {
    opacity: .5;
    cursor: not-allowed;
    border: 1px solid var(--gray-2)
}

.order-table__footer-right {
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: var(--font-size-5)
}

.order-table__summary--total {
    color: var(--system-red);
    font-weight: 700;
    font-size: var(--font-size-7)
}

.order-table-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: none
}

.order-table-modal.active {
    display: block
}

.order-table-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(34, 34, 34, .22);
    backdrop-filter: blur(4px)
}

.order-table-modal__window {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(34, 34, 34, .18);
    min-width: 500px;
    max-width: 95vw;
    padding: 36px 32px 32px;
    display: flex;
    flex-direction: column;
    align-items: center
}

.order-table-modal__close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: 0 0;
    border: 0;
    font-size: var(--font-size-12);
    color: var(--gray-4);
    cursor: pointer;
    line-height: 1;
    transition: color .2s
}

.order-table-modal__close:hover {
    color: var(--system-red)
}

.order-table-modal__title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 14px;
    text-align: center
}

.order-table-modal__text {
    font-size: var(--font-size-5);
    color: var(--color-12);
    margin-bottom: 28px;
    text-align: center;
    max-width: 320px
}

.order-table-modal__action-btn {
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    border-radius: 4px;
    padding: 11px 28px;
    font-size: var(--font-size-6);
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    transition: background .2s
}

.order-table-modal__action-btn:hover {
    background: #176e13
}

.user-cabinet__notifications-header {
    font-size: var(--font-size-10);
    font-weight: 600;
    margin-bottom: 6px
}

.user-cabinet__notifications-body {
    margin-bottom: 32px
}

.user-cabinet__notifications-count {
    font-size: var(--font-size-4);
    color: var(--deep-black)
}

.user-cabinet__notification {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-radius: 8px;
    overflow: hidden;
    min-height: 320px
}

.user-cabinet__notification-left {
    flex: 0 0 420px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 220px
}

.user-cabinet__notification-title {
    font-size: var(--font-size-5);
    font-weight: 600;
    margin-bottom: 8px;
    position: relative
}

.user-cabinet__notification-promo-green {
    color: var(--brand-3);
    font-weight: 600;
    font-size: var(--font-size-5);
    display: inline-block;
    margin-bottom: 8px
}

.user-cabinet__notification-desc {
    font-size: var(--font-size-4);
    color: var(--color-12)
}

.user-cabinet__notification-right {
    flex: .8 1 0;
    padding-left: 15px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    border-left: 3px solid var(--gray-2)
}

.user-cabinet__notification-date {
    color: var(--gray-4);
    font-size: var(--font-size-4);
    margin-bottom: 2px
}

.user-cabinet__notification-text {
    font-size: var(--font-size-5);
    color: var(--deep-black);
    margin-bottom: 8px
}

.user-cabinet__notification-text ul {
    margin: 8px 10px 8px 18px;
    padding: 0
}

.user-cabinet__notification-text li {
    margin-bottom: 4px;
    font-size: var(--font-size-5)
}

.user-cabinet__notification-promo-img {
    min-height: 120px;
    width: 100%;
    height: 200px;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: center
}

.user-cabinet__notification-promo-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    display: block
}

.user-cabinet__notification-desc,
.user-cabinet__notification-promo,
.user-cabinet__notification-title {
    cursor: pointer;
    transition: background .2s, color .2s;
    border-radius: 5px;
    padding: 6px 10px
}

.auth-checkbox-text a:hover,
.user-cabinet__notification-desc.is-active,
.user-cabinet__notification-promo.is-active,
.user-cabinet__notification-title.is-active {
    color: var(--brand-1)
}

.mobile-accordion {
    display: none;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 15px
}

.mobile-accordion__item {
    border-radius: 5px;
    overflow: hidden;
    background: var(--white);
}

.mobile-accordion__button {
    width: 100%;
    text-align: left;
    padding: 14px 20px;
    background: var(--gray-1, #f5f5f5);
    color: var(--black);
    font-size: 18px;
    border: 0;
    cursor: pointer;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background .2s, color .2s
}

.mobile-accordion__item--active .mobile-accordion__button {
    background: var(--brand-1);
    color: var(--white);
}

.mobile-accordion__arrow {
    display: inline-block;
    margin-left: 10px;
    width: 18px;
    height: 18px;
    transition: transform .2s;
    position: relative
}

.mobile-accordion__arrow::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-bottom: 2.5px solid var(--black);
    border-right: 2.5px solid var(--black);
    transform: rotate(45deg);
    position: absolute;
    top: 2px;
    left: 2px
}

.mobile-accordion__item--active .mobile-accordion__arrow {
    transform: rotate(180deg)
}

.mobile-accordion__item--active .mobile-accordion__arrow::before {
    border-color: var(--white);
}

.mobile-accordion__content {
    display: none;
    padding: 18px 20px;
    background: var(--white);
    font-size: 16px;
    margin-top: 10px;
    color: var(--black);
    border-left: 3px solid var(--brand-1)
}

.mobile-accordion__item--active .mobile-accordion__content {
    display: block
}

.mobile-accordion__promo-img {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
    object-fit: contain;
}

.mobile-accordion__promo-img img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.user-cabinet-content-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px
}

.user-cabinet-content-header-title {
    font-size: var(--font-size-10);
    font-weight: 600
}

.user-cabinet-favorites-body {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px 16px
}

.user-cabinet-waitlist,
.user-cabinet-waitlist-body {
    display: flex;
    flex-direction: column
}

.user-cabinet-waitlist-body {
    gap: 5px
}

.user-cabinet-waitlist-label {
    display: flex;
    align-items: center;
    font-size: var(--font-size-4);
    gap: 5px;
    border-radius: 5px;
    background: #c6f1da;
    width: max-content;
    padding: 3px 8px;
    margin-bottom: 10px
}

.cabinet-content__pagination {
    padding-top: 15px
}

.user-cabinet-settings-body {
    display: flex;
    gap: 48px;
    margin-bottom: 32px;
    align-items: flex-start
}

.user-cabinet__settings-col {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column
}

.user-cabinet__settings-title {
    font-size: var(--font-size-7);
    font-weight: 700;
    margin-bottom: 12px
}

.user-cabinet__settings-col--left {
    height: 435px;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.user-cabinet__settings-checkboxes {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 18px
}

.user-cabinet__checkbox {
    display: flex;
    align-items: center;
    gap: 4px
}

.user-cabinet__btn {
    font-size: var(--font-size-5);
    font-weight: 500;
    width: max-content;
    border: 0;
    border-radius: 6px;
    padding: 10px 28px;
    cursor: pointer;
    transition: background .18s, color .18s;
    box-shadow: 0 1px 4px rgba(34, 34, 34, .04);
    display: inline-block
}

.user-cabinet__btn--save {
    background: var(--brand-1);
    color: var(--white);
    margin-bottom: 0
}

.user-cabinet__btn--save:hover {
    background: #81c784
}

.user-cabinet__btn--save:disabled {
    background-color: #cccccc;
    color: #666666;
    cursor: not-allowed;
    opacity: 0.6;
}

.user-cabinet__btn--delete {
    background: var(--system-red);
    color: var(--white)
}

.btn--delete-out {
    display: none
}

.user-cabinet__btn--delete:hover {
    background: #b71c1c
}

.user-cabinet__btn--manager {
    background: var(--brand-1);
    color: var(--white);
    width: 100%;
    margin-top: 18px
}

.user-cabinet__btn--manager:hover {
    background: var(--brand-2)
}

.user-cabinet__settings-desc {
    font-size: var(--font-size-5);
    color: var(--deep-black);
    margin-bottom: 8px;
    line-height: 1.5
}

@media (max-width:900px) {
    .user-cabinet__settings {
        flex-direction: column;
        gap: 32px
    }
}

.user-cabinet__modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center
}

.user-cabinet__modal.active {
    display: flex
}

.user-cabinet__modal-overlay {
    position: absolute;
    inset: 0;
    backdrop-filter: blur(4px)
}

.user-cabinet__modal-window {
    position: relative;
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(34, 34, 34, .18);
    min-width: 520px;
    max-width: 95vw;
    padding: 36px 32px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2
}

.user-cabinet__modal-close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: 0 0;
    border: 0;
    font-size: var(--font-size-12);
    color: var(--gray-4);
    cursor: pointer;
    line-height: 1;
    transition: color .2s
}

.user-cabinet__modal-close:hover {
    color: var(--system-red)
}

.user-cabinet__modal-title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 14px;
    text-align: center
}

.user-cabinet__modal-text {
    font-size: var(--font-size-5);
    color: var(--color-12);
    margin-bottom: 18px;
    text-align: center;
    max-width: 320px
}

.user-cabinet-feedback-body {
    background: var(--white);
    border-radius: 10px;
    padding: 28px 28px 24px;
    box-shadow: 0 2px 8px rgba(30, 30, 30, .06);
    font-family: inherit;
    margin: 0 auto;
    border: 1px solid var(--gray-2)
}

.feedback__title {
    font-size: var(--font-size-9);
    font-weight: 700;
    margin-bottom: 18px
}

.feedback__tabs {
    display: flex;
    width: 100%;
    margin-bottom: 0;
    gap: 10px
}

.feedback__tab-contacts {
    gap: 10px
}

.feedback__tab-radio {
    display: none
}

.feedback__tab {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 0;
    border-radius: 8px;
    background: var(--gray-1);
    color: var(--deep-black);
    font-weight: 500;
    cursor: pointer;
    font-size: var(--font-size-6);
    min-width: 0;
    box-sizing: border-box;
    border-right: 1px solid var(--white);
    transition: background .15s, color .15s;
    border: 0;
    position: relative
}

.feedback__tab:last-child {
    border-right: none
}

.feedback__tab:focus,
.feedback__tab:hover {
    background: var(--gray-1)
}

.blog-topics__tag input[type=radio]:checked+span,
.feedback__tab-radio:checked+.feedback__tab {
    background: var(--brand-1);
    color: var(--white)
}

.feedback__tab-radio:checked+.feedback__tab .feedback__tab-icon svg * {
    fill: var(--white)
}

.feedback__tab-icon {
    display: flex;
    align-items: center;
    font-size: var(--font-size-8)
}

.feedback__tab-contacts {
    display: flex;
    width: 100%;
    margin-top: 18px;
    margin-bottom: 18px;
    min-height: 24px
}

.feedback__tab-contact {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: var(--font-size-6);
    color: var(--deep-black);
    min-width: 0;
    padding: 12px 15px;
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    outline: 0
}

.feedback__radio-group {
    padding: 20px 0 0;
    display: flex;
    gap: 32px;
    margin-bottom: 16px;
    align-items: center
}

.feedback__textarea-wrap {
    margin-bottom: 18px
}

.feedback__textarea {
    width: 100%;
    min-height: 100px;
    outline: 0;
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    padding: 10px 14px;
    font-size: var(--font-size-5);
    resize: vertical;
    background: #f8f9fa;
    font-family: inherit
}

.feedback__upload-block {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
    flex-wrap: wrap
}

.feedback__upload-label {
    cursor: pointer
}

.blog-topics__tag input[type=radio],
.feedback__upload-input {
    display: none
}

.feedback__upload-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--gray-1);
    border-radius: 6px;
    padding: 8px 18px;
    font-size: var(--font-size-5);
    cursor: pointer;
    width: max-content;
    border: 1px solid var(--gray-2);
    transition: background .2s;
    color: var(--deep-black)
}

.feedback__upload-btn:hover {
    background: var(--gray-2)
}

.feedback__files-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center
}

.blog-topics__tag span,
.feedback__file {
    font-size: var(--font-size-4);
    color: var(--deep-black)
}

.feedback__file {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    background: var(--gray-1);
    border: 1px solid var(--gray-2);
    min-width: 0
}

.feedback__file--docx svg rect {
    fill: #1976d2
}

.feedback__file--xlsx svg rect {
    fill: var(--brand-1)
}

.feedback__file--pdf svg rect {
    fill: #d32f2f
}

.feedback__file-remove {
    margin-left: 4px;
    cursor: pointer;
    color: var(--gray-4);
    font-size: var(--font-size-8);
    line-height: 1;
    background: 0 0;
    border: 0;
    transition: color .15s
}

.feedback__file-remove:hover {
    color: #d32f2f
}

.feedback__footer-block {
    display: flex;
    justify-content: space-between
}

.feedback__footer-block-upload {
    display: flex;
    gap: 10px
}

.feedback__submit-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--white);
    border: 0;
    width: max-content;
    height: max-content;
    border-radius: 8px;
    padding: 10px 22px;
    font-size: var(--font-size-6);
    font-weight: 600;
    cursor: pointer;
    transition: background .15s
}

.feedback__submit-btn,
.feedback__submit-btn:hover {
    background: var(--brand-1)
}

.feedback__submit-btn svg {
    margin-right: 4px
}

.file-item,
.file-item__name {
    align-items: center;
    min-width: 0
}

.file-item {
    display: inline-flex;
    gap: 8px;
    padding: 4px 14px 4px 8px;
    border-radius: 6px;
    background: var(--gray-1);
    font-size: var(--font-size-5)
}

.file-item__icon svg {
    width: 25px !important;
    height: 30px !important;
    display: block
}

.file-item__name {
    display: flex
}

.file-item__basename {
    max-width: 48px;
    overflow: hidden;
    color: var(--gray-4);
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block
}

.file-item__ext {
    margin-left: 2px;
    color: var(--gray-4);
    flex-shrink: 0
}

.file-item__remove {
    background: 0 0;
    border: 0;
    color: var(--gray-4);
    font-size: var(--font-size-8);
    margin-left: 4px;
    cursor: pointer;
    transition: color .15s;
    padding: 0;
    line-height: 1
}

.file-item__remove:hover {
    color: var(--system-red)
}

.blog-header {
    position: relative;
    border-radius: 5px;
    padding: 32px 40px;
    margin-bottom: 32px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden
}

.blog-header__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
    z-index: 1;
    pointer-events: none
}

.blog-header__title {
    font-size: var(--font-size-13);
    font-weight: 700;
    color: var(--white);
    margin-bottom: 28px
}

.blog-header__cards {
    display: flex;
    gap: 32px;
    align-items: stretch
}

.blog-header__cards,
.blog-header__title {
    position: relative;
    z-index: 2
}

.blog-head-card--large {
    flex: 1 1 50%;
    max-width: 50%;
    display: flex;
    flex-direction: row;
    background: var(--white);
    min-width: 0;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    overflow: hidden;
    align-items: stretch
}

.blog-header__side {
    flex: 1 1 50%;
    max-width: 50%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: stretch
}

.blog-head-card--small,
.blog-head-card__img {
    overflow: hidden;
    display: flex;
    border-radius: 5px
}

.blog-head-card--small {
    flex-direction: row;
    align-items: stretch;
    background: var(--white);
    text-decoration: none;
    color: inherit
}

.blog-head-card__img {
    position: relative;
    align-items: center;
    justify-content: center;
    background: var(--gray-1)
}

.blog-head-card--small .blog-head-card__img {
    width: 150px;
    height: 100%
}

.blog-head-card--large .blog-head-card__img {
    width: 325px;
    height: 100%
}

.blog-head-card__img img,
.blog-topics__card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.blog-head-card__content {
    flex: 1;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 5px;
    min-width: 0;
    min-height: 0;
    overflow: hidden
}

.blog-head-card__title {
    font-size: var(--font-size-6);
    font-weight: 700;
    margin: 0 0 4px;
    overflow: hidden;
    text-overflow: ellipsis
}

.blog-head-card__desc {
    font-size: var(--font-size-5);
    color: var(--color-12);
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal
}

.blog-head-card__desc-small {
    -webkit-line-clamp: 3
}

.blog-head-card__desc-large {
    -webkit-line-clamp: 8
}

.blog-head-card__tags {
    display: flex;
    gap: 8px;
    margin-top: auto
}

.blog-tag {
    display: inline-block;
    font-size: var(--font-size-2);
    padding: 2px 10px;
    border-radius: 5px;
    background: var(--gray-1);
    color: var(--deep-black);
    font-weight: 500
}

.blog-tag--green {
    background: #48bb78;
    color: var(--white)
}

.blog-tag--orange {
    background: var(--system-orange);
    color: var(--white)
}

.blog-head-card__date {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(40, 40, 40, .85);
    color: var(--white);
    font-size: var(--font-size-5);
    border-radius: 6px;
    padding: 2px 10px;
    z-index: 2
}

.blog-topics {
    background: var(--gray-1);
    padding: 30px 50px;
    margin-top: 30px;
    margin-left: -50px;
    margin-right: -50px
}

.blog-topics__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 32px
}

.blog-topics__tag {
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative
}

.blog-topics__tag span {
    display: block;
    padding: 7px 18px;
    background: var(--white);
    border-radius: 24px;
    font-weight: 700;
    transition: background .2s, color .2s;
    user-select: none
}

.blog-topics__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px
}

.blog-topics__card {
    min-height: 420px;
    background: var(--white);
    border-radius: 5px;
    box-shadow: 0 2px 12px rgba(34, 34, 34, .07)
}

.blog-topics__card--wide {
    display: flex;
    flex-direction: row;
    grid-column: span 2;
    min-height: 420px;
    height: 100%;
    padding: 0
}

.blog-topics__card--wide .blog-topics__card-img {
    width: 50%;
    height: auto;
    min-height: 100%;
    max-height: 100%;
    border-radius: 5px 0 0 5px
}

.blog-topics__card--wide .blog-topics__card-img img {
    height: 100%;
    object-fit: cover
}

.blog-topics__card--wide .blog-topics__card-body {
    width: 50%;
    padding: 32px 30px 32px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media (max-width:1100px) {
    .blog-topics__cards {
        grid-template-columns: 1fr 1fr
    }

    .blog-topics__card--wide {
        grid-column: span 1;
        flex-direction: column
    }

    .blog-topics__card--wide .blog-topics__card-img {
        width: 100%;
        height: 210px;
        min-height: unset;
        max-height: unset;
        border-radius: 5px 5px 0 0
    }

    .blog-topics__card--wide .blog-topics__card-body {
        width: 100%;
        padding: 22px 20px 18px
    }
}

@media (max-width:700px) {
    .blog-topics__cards {
        grid-template-columns: 1fr
    }
}

.blog-topics__card-img {
    position: relative;
    width: 100%;
    height: 210px;
    border-radius: 5px;
    overflow: hidden
}

.blog-topics__card-date {
    position: absolute;
    top: 14px;
    right: 14px;
    background: rgba(34, 34, 34, .8);
    color: var(--white);
    font-size: var(--font-size-3);
    border-radius: 8px;
    padding: 4px 12px;
    font-weight: 500
}

.blog-topics__card-body {
    padding: 22px 20px 18px;
    display: flex;
    flex-direction: column;
    flex: 1 1 0
}

.blog-topics__card-title {
    font-size: var(--font-size-6);
    font-weight: 700;
    margin-bottom: 10px
}

.blog-topics__card-desc {
    font-size: var(--font-size-4);
    color: var(--color-12);
    margin-bottom: 18px;
    flex: 1 1 0
}

.blog-topics__card-tags {
    display: flex;
    gap: 10px
}

.blog-topics__card-tag {
    display: inline-block;
    font-size: var(--font-size-3);
    border-radius: 6px;
    padding: 4px 12px;
    background: var(--gray-1);
    color: var(--deep-black);
    font-weight: 500
}

@media (max-width:1100px) {
    .blog-topics__cards {
        grid-template-columns: 1fr 1fr
    }
}

.img-zoom-hover img {
    transition: transform .3s cubic-bezier(.4, 1, .7, 1)
}

.blog-head-card:hover .blog-head-card__img img,
.img-zoom-hover:hover img {
    transform: scale(1.08)
}

.blog-detail {
    font-family: sans-serif;
    color: var(--deep-black)
}

.blog-detail__hero {
    position: relative;
    padding: 20px 16px;
    height: 450px;
    border-radius: 5px;
    color: var(--white);
    overflow: hidden;
    background: #000
}

.blog-detail__hero-bg,
.blog-detail__hero::before {
    position: absolute;
    inset: 0;
    border-radius: 5px;
    pointer-events: none
}

.blog-detail__hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1
}

.blog-detail__hero::before {
    content: "";
    background: rgba(0, 0, 0, .45);
    z-index: 2
}

.blog-detail__hero>:not(.blog-detail__hero-bg) {
    position: relative;
    z-index: 3
}

.blog-detail__hero-content {
    margin: 0 auto;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
    height: 100%
}

.blog-detail__date {
    font-size: var(--font-size-4);
    font-weight: 700;
    color: var(--gray-1)
}

.blog-detail__hero-middle {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center
}

.blog-detail__title {
    font-size: var(--font-size-13);
    line-height: 1.3;
    font-weight: 700;
    margin: 0
}

.blog-detail__description {
    font-size: var(--font-size-8);
    max-width: 70%;
    color: #f2f2f2
}

.blog-detail__tags {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0
}

.blog-detail__tag {
    font-size: var(--font-size-4);
    background: rgba(255, 255, 255, .2);
    padding: 4px 8px;
    border-radius: 4px;
    color: var(--white)
}

.blog-detail__container {
    max-width: 960px;
    margin: 0 auto;
    padding: 40px 16px;
    display: flex;
    flex-direction: column;
    gap: 45px
}

.blog-detail__toc {
    margin-top: 20px
}

.blog-detail__toc-title {
    font-size: var(--font-size-9);
    font-weight: 600;
    margin-bottom: 12px
}

.blog-detail__toc-list {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 20px 0 0 25px
}

.blog-detail__toc-link {
    font-size: var(--font-size-6);
    color: var(--brand-1);
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-color: currentColor;
    text-underline-offset: 4px
}

.blog-detail__toc-link:hover,
.contacts-card a:hover {
    text-decoration: underline
}

.blog-detail__content {
    margin-top: 40px
}

.blog-detail__heading {
    font-size: var(--font-size-9);
    text-align: center;
    font-weight: 700;
    color: var(--deep-black);
    margin: 30px 0
}

.blog-detail__paragraph {
    font-size: var(--font-size-5);
    line-height: 1.6;
    margin-bottom: 20px
}

.auth-container,
.auth-step {
    position: relative;
    width: 100%
}

.auth-container {
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .12);
    min-width: 320px;
    max-width: 560px;
    padding: 24px;
    margin: 0 auto;
    min-height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.auth-step {
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: opacity 1s, transform 1s;
    max-height: 0;
    overflow: hidden
}

.auth-step.active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    max-height: 1200px;
    overflow: visible;
    transition: opacity 1s, transform 1s, max-height 1s ease
}

.modal__close,
.jur-modal__close,
.auth-close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: 0 0;
    border: 0;
    font-size: var(--font-size-12);
    color: var(--deep-black);
    cursor: pointer;
    line-height: 1
}

.auth-title {
    font-size: var(--font-size-11);
    font-weight: 700;
    margin: 0 0 28px;
    text-align: center
}

.auth-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 28px;
    justify-content: center
}

.auth-tab {
    flex: 1 1 0;
    padding: 12px 0;
    border: 0;
    background: #f3f4f6;
    color: var(--deep-black);
    font-size: var(--font-size-4);
    border-radius: 5px;
    cursor: pointer;
    font-weight: 600;
    transition: background .2s
}

.auth-tab.active {
    background: var(--brand-1);
    color: var(--white)
}

.auth-tab:not(.active):hover {
    background: #e6e6e6
}

.auth-fields-row {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px
}

.auth-benefits li,
.auth-input {
    display: flex;
    align-items: center
}

.auth-input {
    border-radius: 5px;
    padding: 8px 16px;
    height: 40px;
    position: relative;
    gap: 16px;
    background: var(--white);
    border: 1px solid var(--gray-2);
}

.auth-input-label {
    font-size: var(--font-size-6);
    color: var(--gray-4);
    font-weight: 500
}

.auth-input input {
    border: 0;
    background: 0 0;
    font-size: var(--font-size-6);
    /* padding: 12px 8px; */
    flex: 1 1 0;
    outline: 0
}

.auth-input-icon {
    margin-right: 8px;
    display: flex;
    align-items: center;
    color: var(--gray-2)
}

.auth-eye {
    background: 0 0;
    border: 0;
    cursor: pointer;
    width: 24px;
    height: 24px;
    margin-left: 4px;
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_1676_2545)"><path d="M19.389 7.83983C18.637 6.60838 17.6884 5.50839 16.5809 4.58354L18.9134 2.25109C19.233 1.92016 19.2238 1.39281 18.8929 1.0732C18.57 0.761406 18.0582 0.761406 17.7354 1.0732L15.1989 3.61308C13.6264 2.67913 11.8288 2.19232 9.99998 2.20528C4.84271 2.20528 1.90381 5.73565 0.610965 7.83987C-0.203655 9.15747 -0.203655 10.8223 0.610965 12.14C1.36299 13.3714 2.31158 14.4714 3.4191 15.3962L1.08665 17.7287C0.755716 18.0483 0.746539 18.5757 1.06615 18.9066C1.38576 19.2375 1.91314 19.2467 2.24403 18.9271C2.25098 18.9204 2.25781 18.9135 2.26453 18.9066L4.80691 16.3642C6.37738 17.298 8.17288 17.7856 9.99998 17.7745C15.1572 17.7745 18.0962 14.2441 19.389 12.1399C20.2037 10.8223 20.2037 9.15747 19.389 7.83983ZM5.00187 9.98989C4.99715 7.23408 7.2273 4.99624 9.98311 4.99152C11.0258 4.98972 12.0429 5.31464 12.8914 5.92058L11.6819 7.13014C11.1741 6.82392 10.593 6.6607 10 6.65781C8.15977 6.65781 6.66794 8.14964 6.66794 9.98989C6.67083 10.5828 6.83405 11.164 7.14026 11.6718L5.93071 12.8813C5.32672 12.0382 5.00191 11.027 5.00187 9.98989ZM10 14.988C8.96287 14.988 7.95176 14.6632 7.10859 14.0592L8.31814 12.8497C8.82592 13.1559 9.40708 13.3191 10 13.322C11.8403 13.322 13.3321 11.8301 13.3321 9.98989C13.3292 9.39695 13.166 8.8158 12.8598 8.30802L14.0693 7.09847C15.6708 9.34115 15.151 12.4575 12.9084 14.059C12.0598 14.6649 11.0427 14.9898 10 14.988Z" fill="%237E8B99"/></g><defs><clipPath id="clip0_1676_2545"><rect width="20" height="20" fill="white"/></clipPath></defs></svg>');

    background-repeat: no-repeat;
    background-position: center;
    transition: filter .2s
}

.auth-eye.visible {
    background-image: url('data:image/svg+xml;utf8,<svg fill="none" stroke="%234CAF50" stroke-width="2" viewBox="0 0 24 24" width="20" height="20" xmlns="http://www.w3.org/2000/svg"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z"/><circle cx="12" cy="12" r="3"/></svg>')
}



.auth-link,
.auth-main-btn {
    font-size: var(--font-size-4)
}

.auth-link {
    display: block;
    margin: 10px 0 0 auto;
    color: #6a9cff;
    text-decoration: underline;
    cursor: pointer;
    width: fit-content
}

.auth-main-btn {
    width: 100%;
    background: var(--brand-1);
    color: var(--white);
    font-weight: 600;
    padding: 14px 0;
    margin-top: 18px
}

.auth-btn-code {
    width: max-content;
    font-size: var(--font-size-5);
    background: var(--gray-2);
    color: var(--gray-5);
    padding: 5px 16px
}

.auth-btn-code,
.auth-main-btn {
    border: 0;
    border-radius: 5px;
    cursor: pointer;
    transition: background .2s
}

.auth-benefits {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 12px;
    margin: 32px 0 0;
    padding: 0;
    list-style: none
}

.auth-benefits li {
    font-size: var(--font-size-6);
    color: #3b3b3b;
    gap: 8px
}

.auth-benefit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.auth-labels-row {
    display: flex;
    gap: 12px;
    font-size: var(--font-size-4);
    color: var(--gray-4);
    margin: 0 0 2px 2px
}

.auth-row {
    display: flex;
    gap: 12px;
    margin-bottom: 8px
}

.auth-row .auth-input,
.auth-row input {
    flex: 1 1 0;
    min-width: 0
}

.auth-input--with-btn {
    padding-right: 0;
    background: 0 0;
    height: 44px
}

.auth-code-btn {
    background: var(--gray-1);
    color: var(--deep-black);
    border: 0;
    border-radius: 8px;
    font-size: var(--font-size-5);
    font-weight: 500;
    padding: 0 16px;
    height: 40px;
    cursor: pointer;
    margin-left: 8px;
    transition: background .15s
}

.auth-code-info {
    font-size: var(--font-size-3);
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    color: var(--deep-black);
    margin: 8px 10px 10px 2px
}

.auth-code-timer {
    color: var(--gray-4);
    font-size: var(--font-size-3);
    text-decoration: underline;
    cursor: pointer
}

.auth-code-timer .timer {
    color: var(--brand-1);
    text-decoration: none;
    display: inline-block
}

.auth-person-type {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
    margin-top: 30px
}

.modal.jur-modal {
    position: fixed;
    z-index: 9999;
    inset: 0;
    display: flex;
    justify-content: center;
    height: 80vh;
    background: var(--white);
}


.modal__window.jur-modal__window {
    background: var(--white);
    border-radius: 5px;
    min-width: 320px;
    max-width: 90vw;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
}

.modal__close.jur-modal__close {
    position: absolute;
    background: none;
    border: none;
    font-size: var(--font-size-12);
    cursor: pointer;
}


.auth-jur-fields__actions {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}

.auth-jur-fields__skip {
    flex: 1 1 0;
    padding: 12px 0;
    background: #f5f6f7;
    color: #222;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.2s;
}

.auth-jur-fields__skip:hover {
    background: #e0e1e2;
}

.auth-jur-fields__save {
    flex: 1 1 0;
    padding: 12px 0;
    background: var(--brand-1);
    color: #fff;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    cursor: pointer;
    font-weight: 500;
    transition: background 0.2s;
}

.auth-jur-fields__save:hover {
    background: var(--brand-2);
}




















.auth-person-btn {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-1);
    color: var(--deep-black);
    border-radius: 8px;
    font-size: var(--font-size-5);
    font-weight: 500;
    padding: 12px 0;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    border: 1.5px solid transparent;
    position: relative;
    user-select: none
}

.auth-person-btn input[type=radio] {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

.auth-person-btn:has(input[type=radio]:checked) {
    background: var(--brand-4);
    color: var(--brand-1);
    border-color: var(--brand-1)
}

.auth-person-btn:hover {
    background: #e9ecef
}

.auth-checkboxes {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 18px
}

.auth-checkbox,
.auth-modal-benefits li {
    display: flex;
    gap: 5px;
    align-items: center
}

.auth-checkbox-text {
    line-height: 1.4;
    color: var(--deep-black)
}

.auth-checkbox-text a {
    color: var(--brand-1);
    text-decoration: underline;
    transition: color .15s
}

.auth-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .3);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2000
}

.auth-modal {
    background: var(--white);
    border-radius: 5px;
    padding: 32px;
    max-width: 600px;
    width: 90%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .15);
    position: relative;
    text-align: center
}

.auth-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: 0 0;
    border: 0;
    font-size: var(--font-size-12);
    cursor: pointer;
    color: var(--deep-black);
    line-height: 1
}

.auth-modal-title {
    font-size: var(--font-size-11);
    font-weight: 700;
    margin-bottom: 24px
}

.auth-modal-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-bottom: 24px
}

.auth-modal-btn {
    padding: 12px 24px;
    border-radius: 8px;
    border: 0;
    font-size: var(--font-size-6);
    font-weight: 600;
    cursor: pointer;
    background: var(--gray-1);
    color: var(--deep-black);
    flex: 1 1 0;
    transition: background .2s
}

.auth-modal-btn-primary {
    background: var(--brand-1);
    color: var(--white)
}

.auth-modal-btn:hover {
    background: #e6e6e6
}

.auth-modal-btn-primary:hover {
    background: #43a047
}

.auth-modal-benefits {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    list-style: none;
    padding: 0;
    margin: 0;
    color: #3b3b3b;
    font-size: var(--font-size-6);
    text-align: left
}

.auth-modal-benefits li {
    gap: 8px
}

.auth-modal-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.mobile-bottom-nav {
    display: none
}

.search-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .3);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s;
    display: flex;
    align-items: flex-start;
    z-index: 999;
    padding-top: 140px
}

.search-modal.active {
    opacity: 1;
    pointer-events: auto
}

.search-modal__content {
    background: var(--white);
    border-radius: 5px;
    width: 60%;
    max-height: 500px;
    overflow-y: auto;
    padding: 20px 10px;
    box-sizing: border-box;
    box-shadow: 0 8px 32px rgba(60, 60, 60, .18), 0 1.5px 5px rgba(60, 60, 60, .08);
    font-size: 14px;
    color: var(--black);
    margin-left: 357px
}

.search-modal__list {
    display: flex;
    flex-direction: column;
    gap: 0
}

.search-modal__row {
    display: grid;
    grid-template-columns: 100px 1fr;
    align-items: start
}

.search-modal__section-title {
    color: var(--gray-4);
    font-size: var(--font-size-4);
    font-weight: 500;
    user-select: none;
    text-align: right;
    padding-right: 16px;
    padding-top: 2px
}

.search-modal__categories,
.search-modal__products {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.search-modal__categories>div {
    color: var(--black);
    font-size: var(--font-size-4);
    line-height: 1.5;
    cursor: pointer;
    padding: 2px 5px;
    border-radius: 5px
}

.search-modal__products {
    margin-top: 8px
}

.search-modal__product {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--black);
    background: 0 0;
    padding: 10px;
    transition: background-color .18s;
    border-radius: 5px
}

.search-modal__categories>div:hover,
.search-modal__product:focus,
.search-modal__product:hover {
    background-color: #e9fbe9;
    color: var(--black)
}

.search-modal__product-img {
    width: 50px;
    height: 50px;
    object-fit: contain;
    margin-right: 12px;
    border-radius: 5px;
    flex-shrink: 0
}

.info-sidebar li,
.search-modal__product-name {
    margin-bottom: 2px
}

.search-modal__product-price {
    color: var(--brand-1);
    font-weight: 600;
    font-size: var(--font-size-4)
}

.cookie-modal {
    display: none;
    position: fixed;
    z-index: 9999;
    inset: 0;
    justify-content: center;
    align-items: center
}

.cookie-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .5)
}

.cookie-modal__window {
    position: relative;
    background: var(--white);
    border-radius: 5px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .15);
    max-width: 540px;
    padding: 30px;
    margin: auto;
    z-index: 1
}

.cookie-modal__title {
    margin: 0 0 16px;
    font-size: var(--font-size-9);
    font-weight: 700
}

.cookie-modal__text {
    margin: 0 0 12px;
    font-size: var(--font-size-4);
    color: var(--gray-5)
}

.cookie-modal__link {
    color: var(--brand-1);
    text-decoration: underline
}

.cookie-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 16px
}

.cookie-modal__button {
    padding: 10px 24px;
    border: 0;
    border-radius: 5px;
    font-size: var(--font-size-4);
    cursor: pointer;
    transition: background .2s
}

.cookie-modal__button_type_accept,
.info-sidebar>ul>li>a.active,
.info-sidebar>ul>li>a:hover {
    background: var(--brand-1);
    color: var(--white)
}

.cookie-modal__button_type_accept:hover {
    background: var(--brand-2)
}

.cookie-modal__button_type_decline {
    background: var(--white);
    color: var(--black);
    border: 1px solid var(--gray-2)
}

.catalog-mobile__item:hover .catalog-mobile__link,
.cookie-modal__button_type_decline:hover {
    background: var(--gray-1)
}

.container-mobile {
    display: flex;
    flex-direction: column;
    padding: 8px;
    height: calc(100vh - 64px - 130px);
    margin: 0 auto
}

.catalog-mobile__header-level-2 {
    display: flex;
    justify-content: space-between
}

.auth-mobile__header,
.catalog-mobile__header,
.catalog-mobile__header-level-2,
.profile-mobile__header {
    text-align: center;
    font-weight: 700;
    color: var(--brand-1);
    font-size: var(--font-size-9);
    letter-spacing: .5px
}

.auth-mobile__header,
.catalog-mobile__header,
.catalog-mobile__header-level-2 {
    padding: 20px
}

.profile-mobile__header {
    padding: 5px
}

.catalog-mobile__back-button-level-2 {
    color: var(--black);
    font-size: var(--font-size-9);
    display: flex;
    gap: 16px;
    margin-left: -15px;
    padding: 8px 10px;
    align-items: center;
    justify-content: center;
    font-weight: 500
}

.catalog-mobile__header-level-2>span {
    display: flex;
    align-items: center
}

.catalog-mobile__list {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 0 0 12px
}

.catalog-mobile__items,
.info-sidebar ul {
    list-style: none;
    margin: 0;
    padding: 0
}

.catalog-mobile__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: var(--font-size-9);
    border-bottom: 1px solid var(--brand-4);
    cursor: pointer;
    transition: background .2s
}

.catalog-mobile__item:last-child,
.table-surface__body tr:last-child td {
    border-bottom: none
}

.catalog-mobile__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-decoration: none;
    color: var(--black);
    padding: 10px;
    background: 0 0;
    font-size: var(--font-size-9);
    border: 0;
    cursor: pointer;
    transition: background .1s;
    min-height: 48px
}

.catalog-mobile__item-arrow {
    color: var(--gray-4);
    font-size: 1.1em;
    margin-left: 10px
}

.catalog-mobile__footer {
    position: fixed;
    bottom: 64px;
    width: 100vw;
    background: var(--white);
    height: 125px;
    border-top: 2px solid var(--brand-1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    z-index: 10;
    box-shadow: 0-2px 10px rgba(0, 0, 0, .03);
    box-sizing: border-box;
    left: 0
}

.catalog-mobile__contacts {
    display: flex;
    gap: 8px;
    margin-bottom: 10px
}

.catalog-mobile__worktime {
    flex: 1;
    background: var(--gray-1);
    color: var(--gray-5)
}

.catalog-mobile__phone {
    flex: 1.2;
    background: var(--brand-1);
    color: var(--white);
    border: 0;
    cursor: pointer;
    transition: background .2s
}

.catalog-mobile__phone,
.catalog-mobile__worktime {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 15px 5px;
    border-radius: 5px;
    font-size: var(--font-size-6)
}

.catalog-mobile__phone:hover {
    background: var(--brand-2)
}

.catalog-mobile__delivery {
    display: flex;
    text-align: center;
    justify-content: center;
    font-size: var(--font-size-6);
    color: var(--gray-5);
    gap: 7px;
    margin-left: 2px;
    width: 100%
}

.container-mobile__user {
    max-height: calc(100vh - 320px);
    overflow-y: auto;
    box-sizing: border-box
}

.site-section-header__bnt-back {
    width: 100%;
    display: none;
    justify-content: flex-start
}

.site-section-header__bnt-back-wrapper {
    display: flex;
    gap: 20px;
    padding: 8px 0;
    align-items: center;
    font-size: var(--font-size-9)
}

.filters-bar {
    display: none;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 0;
    background: var(--white)
}

.filters-bar__top {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap
}

.filters-bar__sort {
    position: relative;
    display: inline-block
}

.filters-bar__sort-btn,
.filters-bar__sort-dropdown {
    width: 205px;
    background: var(--white);
    border-radius: 5px
}

.filters-bar__sort-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 7px 16px;
    border: 1px solid #e5e9ed;
    color: var(--black);
    font-size: var(--font-size-6);
    cursor: pointer;
    user-select: none;
    transition: background .13s, color .13s, border .13s;
    list-style: none
}

.filters-bar__icon svg {
    color: var(--gray-5);
    width: 20px;
    height: 20px
}

.filters-bar__sort-dropdown {
    position: absolute;
    top: 110%;
    left: 0;
    border: 1px solid var(--gray-2);
    box-shadow: 0 4px 24px rgba(0, 0, 0, .07);
    z-index: 100;
    padding: 8px 0;
    flex-direction: column
}

.filters-bar__sort-option {
    width: 100%;
    box-sizing: border-box;
    padding: 5px 15px;
    background: 0 0;
    border: 0;
    color: var(--black);
    font-size: var(--font-size-6);
    text-align: left;
    cursor: pointer;
    border-radius: 5px;
    transition: background .15s, color .15s, border-color .15s
}

.filters-bar__sort-option:focus,
.filters-bar__sort-option:hover {
    background: var(--brand-1);
    color: var(--white)
}

.filters-bar__filter-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    border: 0;
    background: var(--brand-1);
    border-radius: 5px;
    color: var(--white);
    font-size: var(--font-size-6);
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    order: 2
}

.filters-bar__filter-btn .filters-bar__icon svg {
    color: var(--white)
}

.filters-bar__filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #26761b;
    color: var(--white);
    border-radius: 999px;
    font-size: var(--font-size-3);
    font-weight: 500;
    padding: 0 7px;
    height: 22px;
    margin-left: 6px
}

.filters-bar__view-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 36px;
    border: 0;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid var(--gray-2);
    background: var(--white);
    transition: background .15s;
    padding: 0
}

.filters-bar__view-btn:focus,
.filters-bar__view-btn:hover {
    background: var(--gray-1)
}

.filters-bar__view-icon {
    display: flex;
    align-items: center;
    justify-content: center
}

.button-back-mobile {
    align-items: start;
    display: none
}

.button-back-mobile__center {
    display: flex;
    height: 60px;
    align-items: center;
    gap: 5px;
    font-size: var(--font-size-9)
}

.svg-container-404 {
    width: 100%;
    max-width: 420px;
    margin: 0 auto
}

.svg-container-404 svg {
    width: 100%;
    height: auto;
    display: block
}

.error-layout,
.error-layout__container {
    display: flex;
    align-items: center;
    justify-content: center
}

.error-layout {
    padding: 40px 20px
}

.error-layout__container {
    max-width: 1000px;
    width: 100%;
    flex-wrap: wrap;
    text-align: left
}

.error-layout__content,
.error-layout__image {
    flex: 1 1 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
}

.error-layout__title {
    font-size: 40px;
    font-weight: 700;
    margin: 0 0 10px
}

.error-layout__subtitle {
    font-size: var(--font-size-13);
    margin: 0 0 20px;
    text-align: left
}

.error-layout__description {
    font-size: var(--font-size-6);
    margin: 0 0 30px;
    color: var(--gray-5);
    text-align: left
}

.error-layout__button {
    padding: 10px 20px;
    font-size: var(--font-size-6);
    background-color: var(--brand-1);
    color: var(--white);
    border: 0;
    border-radius: 5px;
    align-items: center;
    justify-content: center;
    display: flex;
    cursor: pointer;
    gap: 10px;
}

.error-layout__button:hover {
    background-color: var(--brand-2);
    color: var(--white)
}

.contacts-main-layout {
    display: flex;
    min-height: 100vh
}

.contacts-content,
.info-sidebar {
    border-radius: 5px;
    display: flex;
    flex-direction: column
}

.info-sidebar {
    width: 270px;
    background: var(--gray-1);
    padding: 15px 0;
    margin-right: 20px;
    flex-shrink: 0;
    gap: 8px;
    font-size: var(--font-size-5);
    height: fit-content
}

.info-sidebar>ul>li>a,
.info-sidebar>ul>li>b {
    display: block;
    padding: 8px 24px;
    text-decoration: none;
    border-radius: 5px;
    transition: background .2s, color .2s;
    font-size: var(--font-size-4);
    color: var(--black);
    font-weight: 700
}

.info-sidebar>ul>li>a {
    color: var(--brand-1);
    font-weight: 500
}

.contacts-content {
    flex: 1;
    background: var(--white);
    min-width: 0;
    gap: 32px
}

.contacts-content h2 {
    margin: 0 0 12px;
    font-size: var(--font-size-9);
    font-weight: 700;
    color: var(--black)
}

.contacts-card .row-contact,
.contacts-section {
    margin-bottom: 0;
    font-size: var(--font-size-6);
    color: var(--black)
}

.contacts-cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    width: 100%
}

.contacts-card {
    color: var(--black);
    border-radius: 5px;
    padding: 20px 18px;
    font-size: var(--font-size-6);
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    background: var(--gray-1);
    box-sizing: border-box
}

.contacts-card-phone {
    gap: 8px;
    display: flex;
    flex-direction: column;
}

.contacts-card strong {
    font-size: var(--font-size-8);
    margin-bottom: 6px;
    color: var(--black);
    font-weight: 600
}

.contacts-card .row-contact {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
    color: var(--black);
    gap: 6px;
}

.contacts-card .row-contact:last-child {
    margin-bottom: 0
}

.contacts-card .icon {
    margin-right: 8px;
    color: var(--brand-2);
    font-size: var(--font-size-8);
    width: 20px;
    text-align: center
}

.contacts-card a {
    color: var(--brand-2);
    text-decoration: none;
    word-break: break-all
}

.contacts-pr {
    margin-top: 0;
    margin-bottom: 0;
    color: var(--black)
}

.contacts-company strong,
.contacts-pr strong {
    font-size: var(--font-size-9);
    font-weight: 600
}

.contacts-pr p {
    margin: 8px 0 0;
    font-size: var(--font-size-6)
}

.contacts-bottom-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    width: 100%;
    align-items: stretch;
    margin-top: 0
}

.contacts-company {
    border-radius: 5px;
    font-size: var(--font-size-6);
    color: var(--black);
    display: flex;
    flex-direction: column;
    justify-content: flex-start
}

.contacts-company strong {
    margin-bottom: 8px
}

.contacts-company address {
    font-style: normal;
    margin-bottom: 10px;
    color: var(--gray-5);
    font-size: var(--font-size-6)
}

.contacts-company .req {
    color: var(--gray-5);
    font-size: var(--font-size-5);
    margin-bottom: 8px
}

.contacts-company .director {
    margin-top: 12px;
    font-size: var(--font-size-5);
    color: var(--gray-4)
}

.contacts-map-block {
    background: var(--gray-2);
    border-radius: 5px;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.contacts-map-block iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    object-fit: cover;
    background: var(--gray-2)
}

.review-btn {
    padding: 10px 15px;
    font-size: var(--font-size-5);
    font-weight: 600;
    color: var(--white);
    background-color: var(--brand-1);
    border: 0;
    width: max-content;
    border-radius: 6px;
    cursor: pointer;
    transition: background .2s ease
}

.review-btn:hover {
    background-color: var(--brand-2)
}

.review-modal {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 9999
}

.review-modal.active {
    display: block
}

.review-modal__backdrop {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, .4)
}

.review-modal__content {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    max-width: 480px;
    transform: translate(-50%, -50%);
    background-color: var(--white);
    padding: 24px 20px;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
    animation: fadeIn .2s ease
}

.review-modal__close {
    position: absolute;
    top: 10px;
    right: 14px;
    border: 0;
    background: 0 0;
    font-size: 24px;
    color: var(--gray-5);
    cursor: pointer
}

.review-modal__success-state {
    display: none;
    text-align: center
}

.review-stars {
    display: flex;
    gap: 20px;
    margin-bottom: 12px
}

.star {
    color: var(--gray-2);
    font-size: 20px;
    cursor: pointer
}

.star.filled {
    color: var(--brand-1)
}

.review-input,
.review-textarea {
    width: 100%;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    color: var(--black);
    outline: 0;
    font-size: var(--font-size-6)
}

.review-textarea {
    min-height: 100px;
    resize: vertical
}

.review-hint {
    display: block;
    font-size: var(--font-size-5);
    color: var(--black);
    margin-bottom: 8px
}

.review-close-btn,
.review-send-btn {
    color: var(--white);
    width: 100%;
    border: 0;
    border-radius: 6px;
    cursor: pointer
}

.review-send-btn {
    padding: 12px 20px;
    font-weight: 600;
    background-color: var(--brand-1);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: var(--font-size-6)
}

.review-close-btn {
    margin-top: 20px;
    padding: 10px 18px;
    background: var(--brand-1)
}

.partners-logos-doc {
    background: var(--white);
    width: 100%;
    display: flex;
    align-items: center;
    height: 320px;
    padding: 30px 50px;
    position: relative
}

.partners-swiper-card-doc {
    width: 200px;
    height: 262px;
    min-width: 180px;
    max-width: 200px
}

.partners-swiper-doc__img {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    object-fit: cover
}

.brand-detail-box {
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    padding: 5px
}

.brand-detail-box__image {
    width: 100%;
    height: 150px;
    border-radius: 5px 5px 0 0;
    object-fit: cover;
}

.brand-detail-box__content {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .3s ease, opacity .3s ease
}

.brand-detail-box.active .brand-detail-box__content {
    max-height: 1000px;
    opacity: 1;
    margin: 12px auto;
    max-width: 1200px;
}

.brand-detail-box__text,
.marker-list li {
    font-size: var(--font-size-6);
    font-weight: 400
}

.brand-detail-box__text {
    color: var(--balck);
    margin: 0
}

.brand-detail-box__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 16px;
    font-size: var(--font-size-4);
    background: var(--white);
    border: 0;
    outline: 0;
    cursor: pointer;
    transition: background-color .3s ease;
}

.brand-detail-box__toggle:hover {
    background-color: var(--gray-1)
}

.brand-detail-box__toggle-icon {
    transition: transform .3s ease
}

.brand-detail-box.active .brand-detail-box__toggle-icon {
    transform: rotate(180deg)
}

.brand-card-one__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

.brand-card-one {
    min-width: 300px;
    border: 1px solid var(--gray-2);
    border-radius: 5px;
    padding: 20px;
    background-color: var(--white);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .04);
    transition: transform .3s ease, box-shadow .3s ease
}

.brand-card-one:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08)
}

.brand-card-one__image-wrap {
    width: 200px;
    height: 100px;
    margin: 0 auto 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px
}

.brand-card-one__image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.brand-card-one__text {
    font-size: var(--font-size-6);
    color: var(--gray-5);
    line-height: 1.4;
    text-align: center;
    margin: 0
}

@media (max-width:1364px) {
    .brand-card-one__grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (max-width:999px) {
    .brand-card-one__grid {
        grid-template-columns: repeat(2, 1fr)
    }
}


@media (max-width:767.98px) {
    .brand-card-one__grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

@media (max-width:1599.98px) {

    .blog-header__side {
        max-width: 100%
    }

    .product-preview-card {
        flex-direction: row
    }


    .product-preview-card__info {
        display: flex;
        flex-direction: column;
        justify-content: space-between
    }

    .product-preview-card>:nth-child(1) {
        order: 0;
        /*flex-basis: calc(50% - 5px)*/
    }

    .product-preview-card__buy-row-wrapper-top {
        display: flex;
        align-items: center;
        gap: 15px;
        width: 100%;
        flex-wrap: nowrap
    }

    .product-preview-card-wrapper {
        margin-left: auto
    }

    .product-preview-card__buy-row {
        display: block
    }
}

@media (max-width:1564.98px) {

    .header__search {
        max-width: 500px;
    }

    /* .header__section {
        justify-content: flex-start;
        width: 100%;
        background:red;
    }

    .header__search {
        width: 200px;
        margin: 0;

    }

    .search-modal__content {
        margin-left: 337px;
        margin-right: 50px
    }

    .header__info-delivery {
        gap: 8px
    }

    .header__actions {
        width: 100%;
        background:blue;
    }

    .header__actions a:last-child {
        margin-left: auto
    }

    .header__cabinet-menu {
        margin-left: auto
    } */

    .wide-card__main {
        gap: 5px
    }

    .wide-card__table td,
    .wide-card__table th {
        min-width: 80px
    }
}

@media (max-width:1499.98px) {
    .header__search {
        max-width: 450px;
    }

    .products-promo-block__products,
    .promo-cards__grid {
        width: 790px;
        box-sizing: border-box
    }

    .promo-cards__grid {
        gap: 10px
    }

    .products-grid,
    .promo-cards {
        gap: 5px
    }

    .order__delivery-tab-desc {
        display: none
    }

    .order__delivery-content,
    .tab-content.active {
        height: 100%;
        display: flex;
        flex-direction: column
    }

    .order-pickup__container {
        display: flex;
        gap: 12px
    }

    .order-pickup__list {
        flex: 1 1 auto
    }

    .delivery-box,
    .delivery-box__input input,
    .delivery-box__inputs {
        width: 100%;
        box-sizing: border-box
    }

    .delivery-box__inputs {
        display: flex;
        gap: 12px
    }

    .delivery-box__input {
        flex: 1 1 0;
        min-width: 50px;
        max-width: 100%;
        box-sizing: border-box
    }

    .order-pickup__map {
        flex: 0 0 250px;
        overflow: hidden;
        padding: 5px;
        border-radius: 5px
    }

    .order__layout {
        flex-direction: column
    }

    .order__sidebar {
        max-width: 100%;
        min-width: 0
    }

    .order-pickup__container {
        flex-direction: column;
        height: auto;
        min-height: 0
    }

    .order-pickup__list,
    .order-pickup__map {
        max-width: 100%;
        width: 100%;
        height: 220px
    }

    .order-pickup__map {
        margin-left: 0;
        margin-top: 12px
    }
}

@media (max-width:1408px) {
    .product-preview-card__buy-block {
        max-width: 100%;
        width: 100%;
    }
}

@media (max-width:1449.98px) {
    .header__level .menu-hide-on-mobile {
        display: none
    }

    .header__level .header__menu-more {
        display: block
    }

    .catalog-modal__category {
        font-size: var(--font-size-3)
    }

    .product-card-mini {
        min-width: 170px;
        box-sizing: border-box
    }

    .products-promo-block {
        gap: 10px
    }

    .product-card__waitlist-text {
        font-size: var(--font-size-2)
    }
}

@media (max-width:1399.98px) {

    .header__actions a:nth-child(1),
    .header__actions a:nth-child(2) {
        display: none;
    }

    /* .header__search {
        max-width: 100%;
    } */
    .header__search {
        max-width: 470px;
    }

    .wide-card {
        grid-template-columns: 150px 1fr;
        grid-template-rows: auto auto;
        gap: 0 20px;
        padding: 14px 10px
    }

    .wide-card__img,
    .wide-card__img img {
        width: 150px;
        height: 150px
    }

    .wide-card__content {
        grid-column: 2/3;
        grid-row: 1/2
    }

    .wide-card__table {
        grid-column: 1/3;
        grid-row: 2/3;
        margin-top: 5px
    }

    .user-cabinet-favorites-body {
        grid-template-columns: repeat(3, 1fr)
    }

    .products-promo-block {
        flex-direction: column
    }

    .products-promo-block__products {
        width: 100%
    }

    .header__level .bottom-menu__hide {
        display: none
    }

    .header__level .bottom-menu__more {
        display: block
    }

    .feature-card,
    .products-promo-block__feature {
        width: 100%;
        max-width: 100%
    }

    .blog-header__cards .blog-head-card--large {
        display: none
    }

    .feature-card {
        min-width: 0
    }

    .feature-card__down {
        height: 280px
    }

    .product-card {
        padding: 15px
    }

    .promo-cards__item {
        width: 205px
    }

    .promo-cards__item:hover {
        letter-spacing: 0
    }

    .promo-cards__item-image {
        max-width: 190px
    }
}

@media (max-width:1349.98px) {

    /* .header__search {
        max-width: 470px;
    } */

    .info-row__benefits {
        flex-direction: column
    }

    .product-preview-card__buy-block {
        width: 100%;
        max-width: 100%
    }

    .product-preview-card>:last-child {
        flex-basis: 100%;
        order: 1;
        width: 100%;
        max-width: 100%
    }

    .benefits-card {
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: space-between
    }

    .benefits-card__link {
        margin-top: 0
    }

    .order-table__footer-left,
    .order-table__footer-right {
        flex-direction: column;
        gap: 10px
    }

    .order-table__footer-right {
        align-items: flex-end
    }
}

@media (max-width:1249.98px) {
    .header__info {
        gap: 10px
    }

    .mini-catalog-level2__list {
        grid-template-columns: repeat(4, 1fr)
    }
}

@media (max-width:1199.98px) {
    .header {
        display: none
    }

    .header__search {
        max-width: 100%;
    }

    .product-preview-card>:nth-child(2) {
        flex-basis: calc(50% - 5px);
        flex-basis: 100%
    }

    .product-gallery {
        width: 100%;
        flex-basis: 100%
    }

    .product-gallery__thumbs-row {
        display: flex
    }

    .header__search>svg,
    .product-gallery,
    .product-gallery__thumbs-column {
        display: none
    }

    .product-gallery-mobile {
        display: flex;
        flex-direction: column;
        width: 100%
    }

    .product-preview-card {
        width: 100%
    }

    .mobile-header {
        display: flex;
        max-height: 85px;
        min-height: 85px;
        box-sizing: border-box
    }

    .products-block {
        margin-left: -20px;
        margin-right: -20px;
        padding-left: 20px;
        padding-right: 20px
    }

    .main-container {
        padding: 10px 20px 30px
    }

    .header__search {
        margin-left: 20px;
        max-height: 40px;
        min-height: 40px;
        box-sizing: border-box
    }

    .mobile-header__icon {
        width: 30px;
        height: 40px
    }

    .search-modal {
        padding-top: 85px
    }

    .search-modal__content {
        width: 100%;
        min-height: calc(100vh - 149px);
        border-bottom: 3px solid var(--brand-1);
        margin-left: 0;
        margin-right: 0
    }

    .category-level2-layout {
        display: block;
        padding-top: 0
    }

    .category-level2-filters,
    .user-cabinet__sidebar-panel {
        display: none
    }

    .category-level2-filters.is-open {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: calc(100vh - 64px);
        background: var(--white);
        z-index: 9999;
        overflow-y: auto;
        padding: 24px 16px 32px;
        border-radius: 0;
        box-shadow: none;
        overflow-x: hidden
    }

    body.filters-open {
        overflow: hidden
    }

    .user-cabinet {
        gap: 0
    }

    .site-section-header__bnt-back {
        display: flex
    }

    .site-section-header {
        display: flex;
        flex-direction: column;
        gap: 20px
    }

    .category-level2-cards__toolbar,
    .site-section-header__breadcrumbs {
        display: none
    }

    .promo-cards {
        flex-direction: column
    }

    .promo-cards__grid {
        width: 100%;
        gap: 15px
    }

    .feature-card__top {
        height: 280px
    }

    .promo-cards__item {
        width: 100%
    }

    .info-banner__tags {
        justify-content: center;
        align-items: center;
        width: 100%;
        height: max-content
    }

    .info-row {
        flex-direction: column;
        gap: 16px
    }

    .info-row__banner {
        min-width: unset;
        margin-top: 16px
    }

    .info-row__benefits {
        flex-direction: column;
        gap: 12px;
        padding: 12px 6px
    }

    .info-banner {
        background-size: 70%;
        height: 280px;
        justify-content: center;
        align-items: center
    }

    .products-promo-block__products {
        padding: 5px
    }

    .product-card-mini {
        min-width: 130px
    }

    .mini-catalog-level2__list {
        grid-template-columns: repeat(3, 1fr)
    }

    .catalog-modal-main__columns {
        gap: 0
    }

    .catalog-modal-main__group-title,
    .footer__title {
        font-size: var(--font-size-4)
    }

    .catalog-modal-main__subitem a,
    .footer__email,
    .footer__list,
    .footer__phone {
        font-size: var(--font-size-2)
    }

    .auth-container {
        width: 100%;
        margin: 0 auto;
        left: -10px
    }

    .auth-container>* {
        width: 100%;
        max-width: 400px;
        margin: 0 auto
    }

    .auth-tabs {
        margin-top: 150px;
        display: flex;
        flex-direction: column;
        width: 100%;
        align-items: center
    }

    .auth-input-label {
        font-size: var(--font-size-6);
        color: var(--gray-4);
        font-weight: 500
    }

    .auth-row {
        flex-direction: column
    }

    .auth-btn-code {
        width: 100%;
        padding: 10px 5px;
        background: var(--brand-1)
    }

    .auth-container {
        margin-top: 20px;
        justify-content: flex-start
    }

    .auth-mobile__header {
        color: var(--brand-1);
        font-size: var(--font-size-3)
    }

    .auth-mobile__header-title {
        font-size: var(--font-size-9)
    }

    .auth-tab {
        width: 100%
    }

    .auth-tab button {
        width: 100%;
        box-sizing: border-box
    }

    .auth-container {
        padding: 0;
        box-shadow: none
    }

    .auth-step {
        position: relative;
        opacity: 0;
        transform: translateY(20px);
        pointer-events: none;
        transition: opacity 1s, transform 1s;
        width: 100%;
        max-height: 0;
        overflow: hidden
    }

    .auth-step.active {
        width: 100%;
        margin: 0 auto
    }

    .container-mobile .auth-mobile__header .auth-container #step-jur {
        height: calc(100vh + 50px);

    }

    .container-mobile .auth-mobile__header .auth-container #step-register {
        height: calc(100vh + 300px);
    }

    .container-mobile .auth-mobile__header .auth-container #step-jur .auth-close {
        display: none;

    }

    .container-mobile .auth-mobile__header .auth-container #step-register .auth-close {
        display: none;
    }

    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--white);
        z-index: 1000;
        justify-content: space-around;
        align-items: center;
        height: 64px;
        padding: 0
    }

    .mobile-bottom-nav__item {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: var(--black);
        text-decoration: none;
        font-size: 15px;
        transition: color .2s;
        position: relative;
        background: 0 0;
        border: 0;
        outline: 0
    }

    .mobile-bottom-nav__icon {
        display: block;
        margin-bottom: 4px;
        width: 28px;
        height: 28px;
        position: relative
    }

    .mobile-bottom-nav__item svg {
        width: 28px;
        height: 28px;
        fill: var(--black);
        transition: fill .2s;
        display: block
    }

    .mobile-bottom-nav__item.active,
    .mobile-bottom-nav__item:active {
        color: var(--brand-1)
    }

    .mobile-bottom-nav__item.active svg,
    .mobile-bottom-nav__item:active svg {
        fill: var(--brand-1)
    }

    .mobile-bottom-nav__label {
        font-size: var(--font-size-4);
        line-height: 1;
        margin-top: 2px;
        font-weight: 400;
        letter-spacing: .01em
    }

    .mobile-bottom-nav__item.active .mobile-bottom-nav__label {
        color: var(--brand-1);
        font-weight: 500
    }

    .mobile-bottom-nav__badge {
        position: absolute;
        top: -4px;
        right: -10px;
        background: var(--system-red);
        color: var(--white);
        font-size: 12px;
        border-radius: 12px;
        padding: 0 6px;
        max-width: max-content;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        pointer-events: none;
        z-index: 2
    }

    .footer {
        margin-bottom: 65px
    }

    .user-cabinet__link {
        font-size: var(--font-size-9);
        padding: 10px 8px
    }

    .user-cabinet__user {
        padding: 10px 8px;
        background: var(--brand-1);
        border-radius: 5px;
        border: 1px solid var(--brand-2)
    }

    .user-cabinet__avatar-wrapper {
        display: none
    }

    .user-cabinet__info {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 0 5px
    }

    .user-cabinet__name,
    .user-cabinet__org {
        color: var(--white);
        font-weight: 500
    }

    .user-cabinet__name {
        font-size: var(--font-size-9)
    }

    .user-cabinet__org {
        font-size: var(--font-size-6)
    }

    .mini-catalog-level1__list {
        grid-template-columns: repeat(4, 1fr)
    }

    .mini-catalog-level1__title {
        font-size: var(--font-size-6);
        margin-bottom: 5px
    }

    .mini-catalog-level1__count {
        font-size: var(--font-size-2)
    }

    .category-level2-filters__close,
    .filters-bar {
        display: flex
    }

    .cart-flex__footer-left,
    .category-level2-filters__found {
        display: none
    }

    .cart-flex__footer-right {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center
    }

    .cart-flex__summary {
        flex-direction: column;
        margin: 0;
        gap: 3px;
        align-items: flex-start
    }

    .cart-mobile-card,
    .mobile-cards-flex__table {
        display: flex
    }

    .blog-detail__hero {
        margin-left: -20px;
        margin-right: -20px;
        margin-top: -10px;
        border-radius: 0
    }

    .cart-flex__table {
        display: none
    }

    .button-back-mobile {
        display: flex
    }

    .category-level2-cards__view,
    .site-section-header__title {
        display: none
    }

    .site-section-header {
        padding: 0
    }

    .user-main__columns {
        flex-direction: column
    }

    .cabinet-modal__window {
        min-width: auto;
        max-width: 500px;
        width: 100%;
        flex-shrink: 1
    }

    .user-cabinet__notification-left {
        flex: 1 1 auto;
        width: 100%;
        padding: 0;
        align-self: stretch
    }

    .user-cabinet__notification-right {
        padding: 0;
        border: 0
    }

    .user-cabinet__notification {
        flex-direction: column
    }

    .cabinet-accordion,
    .mobile-accordion {
        display: flex
    }

    .user-cabinet__notification {
        display: none
    }

    .user-cabinet-settings-body {
        flex-direction: column
    }

    .btn--delete-in {
        display: none
    }

    .btn--delete-out {
        display: block
    }

    .user-cabinet__btn--delete {
        width: 100%
    }

    .user-cabinet__modal-window {
        min-width: 300px
    }

    .order-table__back-btn {
        display: none
    }

    .order-table__table {
        width: 1200px
    }

    .feedback__radio-group,
    .feedback__tab-contacts,
    .feedback__tabs {
        flex-direction: column
    }

    .feedback__radio-group {
        gap: 5px;
        align-items: flex-start;
        margin-top: 5px;
        padding: 0
    }

    .feedback__footer-block,
    .feedback__footer-block-upload {
        flex-direction: column
    }

    .feedback__submit-btn {
        margin-top: 10px;
        margin-left: auto
    }

    .blog-header {
        margin-left: -20px;
        margin-right: -20px;
        margin-top: -10px;
        width: calc(100% + 40px);
        padding: 10px
    }

    .blog-header,
    .blog-header__bg {
        border-radius: 0
    }

    .blog-head-card__desc,
    .blog-head-card__title {
        font-size: var(--font-size-4)
    }

    .product-tabs {
        display: none
    }

    .product-tabs__pane--active {
        flex-direction: column
    }

    .product-tabs__description {
        min-height: max-content
    }

    .product-preview-card__info {
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-template-rows: auto auto;
        gap: 20px;
    }

    .product-preview-card__brand-row-inner {
        align-items: flex-end;
    }

    .wide-card__param {
        flex-direction: column;
        align-items: flex-start
    }

    .product-preview-card__info>:last-child,
    .product-preview-card__info>:nth-child(4) {
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: flex-end;
    }

    .product-preview-card__brand-row {
        justify-content: flex-end
    }

    .product-preview-card__badges-row {
        align-items: flex-end;
        flex-direction: column;
    }


    .product-preview-container .product-preview-card .product-preview-card__info .product-card__volume-options .product-card__volume-option {
        font-size: var(--font-size-4);
        padding: 10px 15px;
        text-align: center
    }

    .contacts-main-layout {
        flex-direction: column;
        align-items: stretch
    }

    .info-sidebar {
        display: none
    }

    .contacts-content {
        margin: 0;
        border-radius: 0;
        padding: 20px 8px;
        max-width: 100%
    }

    .contacts-bottom-grid,
    .contacts-cards-grid {
        grid-template-columns: 1fr;
        gap: 16px
    }

    .contacts-map-block {
        height: 430px
    }

    .contacts-card {
        padding: 12px 8px
    }

    .contacts-company {
        padding: 10px 8px 12px
    }
}

@media (max-width:991.98px) {
    .promo-cards__item {
        min-width: 150px
    }

    .footer__top {
        align-items: center;
        justify-content: center
    }

    .footer__column {
        display: none
    }

    .user-cabinet-favorites-body {
        grid-template-columns: repeat(2, 1fr)
    }

    .mini-catalog-level1__list {
        grid-template-columns: repeat(3, 1fr)
    }

    .cart-flex__actions {
        display: none
    }

    .order__payment-list {
        grid-template-columns: 1fr
    }

    .order__delivery-tab-icon {
        padding: 2px
    }

    .order__section--delivery {
        padding: 0;
        border: 0
    }

    .cabinet-content__table-cell--date,
    .cabinet-content__table-cell--delivery,
    .cabinet-content__table-cell--positions,
    .cabinet-content__table-cell--responsible {
        display: none
    }

    .cabinet-content__table-cell>th {
        text-align: center
    }

    .mobile-dublicate-content {
        display: block
    }

    .cabinet-content__table,
    .cabinet-content__table-cell,
    .cabinet-content__table-head-cell {
        text-align: center !important
    }
}

@media (max-width:829.98px) {
    .card-grid-view {
        grid-template-columns: repeat(2, minmax(220px, 320px));
        justify-content: center
    }
}

@media (max-width:767.98px) {
    .articles-swiper-card {
        width: 100%
    }

    .blog-details-mini__list {
        grid-template-columns: repeat(2, 1fr) !important
    }

    .blog-details-mini__list .mini-catalog-level2__card {
        flex-direction: row;
        width: 220px;
        height: 100px;
        flex-shrink: 0
    }

    .blog-details-mini__list .mini-catalog-level2__card .mini-catalog-level2__image-wrap {
        height: 80px;
        align-items: center;
        justify-content: center
    }

    .blog-details-mini__list .mini-catalog-level2__card .mini-catalog-level2__image {
        width: 100%;
        height: 100%
    }

    .blog-details-mini__list .mini-catalog-level2__card .mini-catalog-level2__content,
    .blog-details-mini__list .mini-catalog-level2__card .mini-catalog-level2__title {
        align-items: flex-start;
        text-align: start
    }

    .user-cabinet-favorites-body {
        gap: 15px 10px
    }

    .error-layout__container {
        flex-direction: column;
        text-align: center
    }

    .error-layout__content,
    .error-layout__image {
        max-width: 100%
    }

    .products-grid,
    .promo-cards__grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .products-grid {
        justify-items: center;
        align-items: center
    }

    .products-grid>* {
        max-width: 250px;
        width: 100%
    }

    .mini-catalog-level2__image-wrap {
        margin-left: 0;
        height: 120px
    }

    .mini-catalog-level2__card {
        flex-direction: column;
        gap: 10px
    }

    .mini-catalog-level2__image {
        height: 115px;
        width: 100%
    }

    .wide-card__title {
        font-size: var(--font-size-3)
    }

    .product-card__waitlist-added>svg,
    .product-card__waitlist>svg {
        display: none
    }

    .product-card__counter-btn {
        width: 25px
    }

    .product-card__counter-input {
        width: 30px
    }

    .col-article,
    .col-delivery,
    .col-stock,
    .footer>hr {
        display: none
    }

    .info-banner {
        min-width: 200px
    }

    .feature-card__title {
        font-size: var(--font-size-13)
    }

    .mini-catalog-level1__list {
        grid-template-columns: repeat(2, 1fr)
    }

    .search-modal__row {
        display: flex;
        flex-direction: column;
        align-items: start
    }

    .partners-swiper {
        padding: 30px 10px;
        display: flex;
        align-items: center
    }

    .footer {
        padding: 30px 20px
    }

    .footer__top {
        display: none
    }

    .product-preview-card__buy-stock {
        margin: 0;
        word-wrap: wrap;
        width: 50px
    }


    .product-preview-card__buy-stock-desctop {
        display: none
    }

    .product-preview-card__buy-stock-mobile {
        display: block
    }

    .product-preview-card__buy-block {
        padding: 15px
    }
}

@media (max-width:575.98px) {
    .header__logo {
        display: none
    }

    .order-pickup__info {
        flex-direction: column
    }

    .product-preview-card__buy-block {
        box-shadow: none;
        padding: 0;
        border: none;
    }

    .blog-details-mini__list {
        grid-template-columns: repeat(1, 1fr) !important
    }

    .blog-details-mini__list .mini-catalog-level2__item .mini-catalog-level2__card {
        width: 100%
    }

    .blog-details-mini__list .mini-catalog-level2__item .mini-catalog-level2__card .mini-catalog-level2__image-wrap .mini-catalog-level2__image {
        width: 100%;
        height: 80px
    }

    .blog-detail__title {
        font-size: var(--font-size-9);
        margin-bottom: 10px
    }

    .blog-detail__description {
        font-size: var(--font-size-6)
    }

    .product-preview-card__header {
        flex-direction: row-reverse
    }

    .product-preview-card__header>:last-child {
        order: -1;
        margin-bottom: 10px
    }

    .product-preview-card-wrapper {
        margin-left: 0
    }

    .product-preview-card {
        padding: 32px 5px
    }

    .product-preview-card__buy-block {
        min-width: 250px;
        margin-top: 30px;
    }

    .product-preview-card__buy-row-wrapper-top {
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }

    .site-section-header__title {
        font-size: var(--font-size-9)
    }

    .user-cabinet-favorites-body {
        grid-template-columns: repeat(1, 1fr)
    }

    .cabinet-content__filters {
        flex-direction: column
    }

    .blog-header {
        height: 200px;
        display: flex;
        align-items: center;
        text-align: center
    }

    .blog-header__side {
        display: none
    }

    .header__search {
        margin-left: 0
    }

    .partners-logos,
    .products-block-mini {
        padding: 30px 20px
    }

    .mini-catalog-level2__list {
        grid-template-columns: repeat(2, 1fr)
    }

    .mini-catalog-level2__count,
    .mini-catalog-level2__title {
        text-align: center
    }

    .cabinet-accordion__button {
        font-size: var(--font-size-4)
    }

    .cart-mobile-card {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 12px 6px
    }

    .cart-mobile-card__img {
        width: 200px;
        height: 200px;
        margin: 0 auto
    }

    .cart-mobile-card__qty {
        min-width: 80px
    }

    .cart-mobile-card {
        position: relative
    }

    .cart-mobile-card__remove {
        position: absolute;
        top: 8px;
        left: 8px;
        z-index: 2
    }

    .cart-flex__sort-label {
        display: none
    }

    .cart-flex__footer-right {
        flex-direction: column;
        width: 100%
    }

    .cart-flex__order-btn {
        width: 100%
    }

    .cabinet-content__table,
    .cabinet-content__table-cell,
    .cabinet-content__table-head-cell {
        font-size: var(--font-size-2) !important;
        text-align: center !important
    }

    .order-table__footer {
        flex-direction: column
    }

    .order-table__footer-right {
        align-items: center
    }

    .order-table-modal__window {
        min-width: 300px
    }

    .products-grid,
    .promo-cards__grid {
        grid-template-columns: repeat(1, 1fr)
    }

    .card-grid-view {
        grid-template-columns: 1fr;
        justify-content: center
    }

    .card-grid-view>* {
        max-width: 320px;
        margin-left: auto;
        margin-right: auto
    }

    .filters-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px
    }

    .filters-bar__top {
        flex-wrap: wrap;
        gap: 10px
    }

    .filters-bar__filter-btn {
        order: 10;
        width: max-content;
        margin-top: 8px
    }

    .wide-card {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        grid-template-areas: "favorite" "img" "content" "table";
        gap: 0
    }

    .product-card__counter {
        background: var(--white)
    }

    .wide-card__img {
        grid-area: img;
        justify-self: center;
        width: 250px;
        height: 250px
    }

    .wide-card__img>img {
        width: 100%;
        height: 100%
    }

    .wide-card__content {
        grid-area: content
    }

    .wide-card__table {
        margin-top: 0;
        grid-area: table
    }

    .wide-card__price {
        font-size: var(--font-size-3)
    }

    .wide-card__price-info {
        font-size: var(--font-size-1)
    }

    .col-article,
    .col-availability,
    .col-delivery,
    .col-package,
    .col-stock {
        display: none
    }

    .benefits-card__link,
    .benefits-card__link:hover {
        letter-spacing: 0
    }

    .benefits-card__link,
    .benefits-card__title {
        font-size: var(--font-size-3)
    }

    .banners-row {
        flex-direction: column
    }

    .banner-wide {
        margin: 10px
    }

    .articles-swiper-block__top {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px
    }

    .articles-swiper-block__all-link {
        margin-left: 0
    }

    .articles-swiper-block__filters {
        gap: 3px
    }

    .products-block__title {
        font-size: var(--font-size-9)
    }

    .cookie-modal {
        padding: 20px
    }

    .articles-swiper-block__filter,
    .cookie-modal__text {
        font-size: var(--font-size-2)
    }

    .mobile-burger-modal__menu {
        width: 90vw
    }

    .mobile-burger-modal__menu ul {
        gap: 15px
    }

    .catalog-mobile__link,
    .cookie-modal__title,
    .mobile-burger-modal__menu ul>li {
        font-size: var(--font-size-8)
    }

    .catalog-mobile__back-button-level-2,
    .catalog-mobile__header-level-2>span {
        font-size: var(--font-size-5)
    }

    .catalog-mobile__contacts {
        flex-direction: column;
        gap: 3px
    }

    .header__search {
        min-width: 100px
    }

    .auth-container {
        left: 0
    }

    .auth-mobile__header {
        padding: 5px
    }

    .auth-tabs {
        width: 100%;
        min-width: none;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .auth-tab {
        width: 100%
    }

    .catalog-mobile__footer {
        height: 125px;
        border-top: 1px solid var(--brand-1);
        padding: 5px;
        gap: 2px
    }

    .auth-person-type {
        flex-direction: column;
        gap: 5px;
        margin-bottom: 10px;
        margin-top: 15px
    }

    .catalog-mobile__phone,
    .catalog-mobile__worktime {
        padding: 10px 5px
    }

    .catalog-mobile__delivery,
    .catalog-mobile__phone,
    .catalog-mobile__worktime {
        font-size: var(--font-size-4)
    }

    .auth-checkboxes {
        margin-top: 10px;
        margin-bottom: 5px
    }

    .auth-checkbox-text {
        text-align: start;
        font-size: var(--font-size-2)
    }

    .delivery-box__inputs {
        flex-direction: column
    }

    .delivery-box__submit {
        margin-top: 10px;
        width: 100%
    }

    .order__delivery-tab,
    .order__delivery-tabs,
    .tab-btn {
        flex-direction: column
    }

    .order__section {
        padding: 0;
        border: 0
    }

    .order__delivery-tab-title {
        text-align: center
    }

    .order__delivery-tab-title,
    .order__payment-title {
        font-size: var(--font-size-4)
    }

    .order__payment-desc {
        font-size: var(--font-size-2)
    }

    .blog-topics__cards {
        grid-template-columns: 1fr
    }

    .blog-topics__card-img {
        height: 180px
    }
}

@media (max-width:499px) and (max-height:700px) {
    .user-cabinet__nav {
        margin: 0;
        gap: 0
    }

    .user-cabinet__user {
        margin: 0
    }

    .user-cabinet__link {
        padding: 5px
    }
}

.blog-details-mini__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0
}

.section-heading {
    font-size: var(--font-size-9);
    font-weight: 700;
    color: var(--black);
    margin: 0 0 12px
}

.section-subheading {
    font-size: var(--font-size-8);
    font-weight: 600;
    color: var(--black);
    margin: 0 0 8px
}

/* 
.body-text p,
.photo-text-1-1 p,
.text-photo-1-1 p {
    font-size: var(--font-size-6);
    color: var(--black);
    line-height: 1.6
}

.body-text a {
    color: var(--brand-1);
    text-decoration: underline;
    font-weight: 500
}

.photo-text-1-1,
.text-photo-1-1 {
    display: flex;
    flex-direction: column;
    gap: 42px;
    align-items: flex-start;
    text-align: left
}

.photo-text-1-1 img,
.text-photo-1-1 img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 5px
}

.photo-text-1-1 p,
.text-photo-1-1 p {
    font-weight: 400;
    align-items: flex-start;
    margin: 0;
    padding: 0
}

@media (min-width:991.99px) {

    .photo-text-1-1,
    .text-photo-1-1 {
        flex-direction: row;
        align-items: flex-start
    }

    .photo-text-1-1 img,
    .photo-text-1-1 p,
    .text-photo-1-1 img,
    .text-photo-1-1 p {
        width: 50%
    }
} */
.photo-text-1-1,
.text-photo-1-1 {
    display: flex;
    flex-direction: column;
    gap: 42px;
    align-items: flex-start;
    text-align: left;
}

.photo-text-1-1 img,
.text-photo-1-1 img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 5px;
    display: block;
}

.photo-text-1-1 p,
.text-photo-1-1 p {
    font-size: var(--font-size-6);
    color: var(--black);
    line-height: 1.6;
    font-weight: 400;
    margin: 0;
    padding: 0;
}

@media (min-width: 991.99px) {

    .photo-text-1-1,
    .text-photo-1-1 {
        flex-direction: row;
        align-items: stretch;
    }

    .photo-text-1-1 img,
    .text-photo-1-1 img {
        width: 50%;
        height: 100%;
        min-height: 300px;
        object-fit: cover;
        align-self: stretch;
    }

    .photo-text-1-1 p,
    .text-photo-1-1 p {
        width: 50%;
        align-self: stretch;
    }
}




.photo-text-1-2,
.photo-text-2-1 {
    display: flex;
    flex-direction: column;
    gap: 45px
}

.photo-text-1-2 img,
.photo-text-2-1 img {
    width: 100%;
    aspect-ratio: 3/2;
    object-fit: cover;
    object-position: top;
    border-radius: 5px
}

.photo-text-1-2 p,
.photo-text-2-1 p {
    font-size: var(--font-size-7);
    color: var(--black);
    line-height: 1.6;
    margin: 0;
    padding: 0
}

@media (min-width:991.99px) {

    .photo-text-1-2,
    .photo-text-2-1 {
        flex-direction: row;
        align-items: flex-start
    }

    .photo-text-1-2 img,
    .photo-text-2-1 img {
        width: 33.3333%
    }

    .photo-text-1-2 p,
    .photo-text-2-1 p {
        width: 66.6667%
    }
}

.marker-list,
.number-list {
    padding-left: 0;
    list-style: none;
    margin-left: 30px;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.marker-list li {
    position: relative;
    padding-left: 24px
}

.marker-list li::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 0;
    width: 8px;
    height: 8px;
    background-color: var(--brand-1);
    border-radius: 2px
}

.marker-list li,
.number-list li,
blockquote p {
    line-height: 1.6;
    color: var(--black)
}

.number-list li,
blockquote {
    font-size: var(--font-size-6)
}

.number-list li {
    counter-increment: item;
    position: relative;
    padding-left: 24px;
    font-weight: 400
}

.number-list li::before {
    content: counter(item)".";
    position: absolute;
    left: 0;
    color: var(--brand-1);
    font-weight: 600
}

blockquote {
    border-left: 4px solid var(--brand-1);
    padding: 4px;
    color: var(--gray-5);
    margin: 0
}

blockquote p {
    margin: 0 0 12px 5px
}

.quote-answer footer,
blockquote footer {
    font-size: var(--font-size-5);
    color: var(--gray-4);
    margin: 0 0 0 5px
}

.quote-evaluation {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: var(--font-size-6)
}

.stars {
    color: var(--brand-1);
    font-size: var(--font-size-9);
    letter-spacing: 2px
}

.quote-answer {
    border-right: 4px solid var(--brand-1);
    border-left: none;
    padding: 4px;
    font-size: var(--font-size-6);
    color: var(--gray-5);
    margin: 0;
    text-align: right
}

.quote-answer p {
    margin: 0 5px 12px 0;
    line-height: 1.6
}

.quote-answer footer {
    margin: 0 5px 0 0
}

.table-surface {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font-size-6);
    color: var(--black);
    border: 1px solid var(--gray-2);
    border-radius: 5px
}

.table-surface__body td,
.table-surface__head th {
    padding: 12px 16px;
    border-bottom: 1px solid var(--gray-2);
    line-height: 1.6
}

.table-surface__head th {
    border-top: 5px;
    text-align: left;
    font-weight: 600;
    color: var(--black)
}

.table-surface__body td {
    vertical-align: top;
    font-weight: 400;
    color: var(--gray-5)
}

.table-surface__body tr:last-child td:first-child {
    border-bottom-left-radius: 5px
}

.table-surface__body tr:last-child td:last-child {
    border-bottom-right-radius: 5px
}

@media (max-width:768px) {
    .table-surface {
        display: block;
        overflow-x: auto;
        white-space: nowrap
    }
}

.accordion-faq {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.accordion-faq__trigger {
    position: relative;
    padding: 16px 40px 16px 16px;
    background: var(--white);
    border: 1px solid var(--gray-2);
    width: 100%;
    text-align: left;
    border-radius: 5px;
    font-size: var(--font-size-6);
    font-weight: 400;
    color: var(--black);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.accordion-faq__icon {
    margin-left: auto;
    flex-shrink: 0;
    pointer-events: none
}

.accordion-faq__item.active .icon-plus,
.icon-minus {
    display: none
}

.accordion-faq__item.active .icon-minus {
    display: inline-block
}

.accordion-faq__content {
    max-height: 0;
    overflow: hidden;
    transition: max-height .2s ease, opacity .2s ease;
    opacity: 0
}

.accordion-faq__content p {
    margin: 16px 0;
    padding-left: 10px;
    line-height: 1.6;
    color: var(--black);
    font-size: var(--font-size-4);
    border-left: 2px solid var(--brand-1)
}

.accordion-faq__item.active .accordion-faq__content {
    max-height: 500px;
    opacity: 1
}

.advantages-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 45px
}

.advantage-item {
    display: flex;
    gap: 16px;
    align-items: center;
    flex: 1 1 400px;
    max-width: 457px
}

.advantage-item img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px solid var(--brand-1);
    object-fit: cover;
    flex-shrink: 0
}

.advantage-item__title {
    font-size: var(--font-size-8);
    font-weight: 600;
    color: var(--black);
    margin: 0 0 6px
}

.advantage-item__desc {
    font-size: var(--font-size-6);
    color: var(--black);
    margin: 0;
    line-height: 1.6
}

@media (max-width:767.98px) {
    .advantages-list {
        flex-direction: column;
        align-items: center
    }

    .advantage-item {
        flex: 1 1 100%;
        max-width: 100%
    }
}

@media (max-width:575.98px) {
    .advantage-item__title {
        font-size: var(--font-size-5)
    }

    .advantage-item__desc {
        font-size: var(--font-size-3)
    }

    .advantage-item img {
        width: 64px;
        height: 64px
    }
}