@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,300;0,400;0,500;0,600;1,300&display=swap";

@font-face {
    font-family: swiper-icons;
    src: url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

:host {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 1
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block
}

.swiper-vertical>.swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-horizontal {
    touch-action: pan-y
}

.swiper-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: block
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective: 1200px
}

.swiper-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-3d {
    perspective: 1200px
}

.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
    transform-style: preserve-3d
}

.swiper-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-css-mode.swiper-horizontal>.swiper-wrapper {
    scroll-snap-type: x mandatory
}

.swiper-css-mode.swiper-vertical>.swiper-wrapper {
    scroll-snap-type: y mandatory
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper {
    scroll-snap-type: none
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: none
}

.swiper-css-mode.swiper-centered>.swiper-wrapper:before {
    content: "";
    flex-shrink: 0;
    order: 9999
}

.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop: always
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
    margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
    margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper-centered-offset-after)
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: #00000026
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, #00000080, #0000)
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, #00000080, #0000)
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, #00000080, #0000)
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, #00000080, #0000)
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
    animation: swiper-preloader-spin 1s infinite linear
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

@keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.text-title {
    font-size: 32px;
    font-weight: 400;
    line-height: 36px;
    color: #000
}

@media screen and (max-width: 946px) {
    .text-title {
        font-size: 24px;
        line-height: 28px
    }
}

.text-large {
    font-size: 28px;
    font-weight: 300;
    line-height: 40px;
    color: #101011
}

@media screen and (max-width: 946px) {
    .text-large {
        font-size: 20px;
        line-height: 28px
    }
}

.text-large--italic {
    font-style: italic
}

.text-medium {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #101011
}

@media screen and (max-width: 946px) {
    .text-medium {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.content {
    display: flex;
    column-gap: 40px
}

@media screen and (max-width: 946px) {
    .content {
        flex-direction: column
    }
}

@media screen and (max-width: 1360px) {
    .content--small {
        column-gap: 24px
    }
}

@media screen and (max-width: 1360px) {
    .content--small .content-row {
        padding-right: 24px
    }
}

.content-row {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-right: 40px;
    border-right: 1px solid #dedede
}

@media screen and (max-width: 946px) {
    .content-row {
        padding: 0;
        border: none
    }
}

.content-aside {
    position: sticky;
    top: 0;
    height: max-content;
    min-width: 336px;
    max-width: 336px;
    display: flex;
    flex-direction: column;
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .content-aside {
        row-gap: 24px;
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 946px) {
    .content-aside--desktop {
        display: none
    }
}

.content-aside--mobile {
    display: none
}

@media screen and (max-width: 946px) {
    .content-aside--mobile {
        display: flex
    }
}

.link {
    position: relative;
    width: max-content;
    text-decoration: none;
    color: #2561fa
}

.link:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: #2561fa
}

.scroll::-webkit-scrollbar,
.filters::-webkit-scrollbar,
.order-modal__wrapper-list::-webkit-scrollbar,
.basket-products::-webkit-scrollbar,
.search-products::-webkit-scrollbar,
.select__list::-webkit-scrollbar {
    width: 2px
}

.scroll::-webkit-scrollbar-track,
.filters::-webkit-scrollbar-track,
.order-modal__wrapper-list::-webkit-scrollbar-track,
.basket-products::-webkit-scrollbar-track,
.search-products::-webkit-scrollbar-track,
.select__list::-webkit-scrollbar-track {
    background: #dedede
}

.scroll::-webkit-scrollbar-thumb,
.filters::-webkit-scrollbar-thumb,
.order-modal__wrapper-list::-webkit-scrollbar-thumb,
.basket-products::-webkit-scrollbar-thumb,
.search-products::-webkit-scrollbar-thumb,
.select__list::-webkit-scrollbar-thumb {
    background: #333
}

.header-tape {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 72px;
    border-bottom: 1px solid #e0e0e0
}

@media screen and (max-width: 1360px) {
    .header-tape {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .header-tape {
        display: none
    }
}

.header-tape__info {
    display: flex;
    align-items: center;
    column-gap: 12px;
    max-width: 70%;
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em
}

.header-tape__temp {
    color: #ff1037
}

.header-tape__text {
    color: #bdbdbd;
    text-transform: uppercase
}

.header-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-inline: 72px;
    padding-top: 12px
}

._weather_icon {
    width: 28px;
    height: 28px;
    overflow: hidden;
    margin-right: -6px;
}

._weather_icon img {
    display: block;
    width: 100%;
    transform: scale(1.25);
}

@media screen and (max-width: 1360px) {
    .header-main {
        padding-inline: 32px;
        column-gap: 48px
    }
}

@media screen and (max-width: 946px) {
    .header-main {
        padding-inline: 16px;
        padding-top: 16px;
        flex-wrap: wrap;
        row-gap: 24px
    }

    ._weather_icon {
        width: 20px;
        height: 20px;
    }
}

.header-main__row {
    display: flex;
    align-items: center;
    column-gap: 48px;
    width: 100%
}

.header-main__brand {
    min-width: max-content;
    display: flex;
    column-gap: 16px;
    align-items: center;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-decoration: none;
    text-transform: uppercase;
    color: #000
}

@media screen and (max-width: 946px) {
    .header-main__brand {
        width: 100%;
        justify-content: space-between;
        font-size: 14px;
        line-height: 18px
    }
}

.header-main__brand img {
    width: 56px;
    height: 36px
}

@media screen and (max-width: 946px) {
    .header-main__brand img {
        width: 46px;
        height: 28px
    }
}

.header-buttons {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 16px
}

@media screen and (max-width: 946px) {
    .header-buttons {
        width: 100%;
        justify-content: space-between
    }
}

.header-buttons .button--menu {
    display: none
}

@media screen and (max-width: 946px) {
    .header-buttons .button--menu {
        display: block
    }
}

.button {
    position: relative;
    background: none;
    border: none;
    width: 50px;
    height: 44px;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent
}

.button--dark,
.button--light {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity .25s ease;
    will-change: opacity
}

.button--dark {
    opacity: 0;
    pointer-events: none
}

.button.hidden {
    display: none !important
}

.button:hover .button--dark,
.button:focus-within .button--dark {
    opacity: 1
}

.button:hover .button--light,
.button:focus-within .button--light {
    opacity: 0
}

.button-icon {
    position: absolute;
    top: -2px;
    right: 0;
    min-width: 16px;
    height: 20px;
    padding: 4px;
    border-radius: 4px;
    background-color: #45ff63;
    color: #000;
    font-size: 12px;
    font-weight: 300;
    line-height: 12px;
    letter-spacing: -.02em
}

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

.button.is-active .button--dark {
    opacity: 1 !important
}

.button.is-active .button--light {
    opacity: 0 !important
}

@media (hover: none), (max-width: 768px) {
    .button:hover .button--light {
        opacity: 1 !important
    }

    .button:hover .button--dark {
        opacity: 0 !important
    }

    .button:focus .button--dark,
    .button:active .button--dark,
    .button:focus-within .button--dark {
        opacity: 1 !important
    }

    .button:focus .button--light,
    .button:active .button--light,
    .button:focus-within .button--light {
        opacity: 0 !important
    }
}

.footer {
    padding: 120px 0 40px
}

@media screen and (max-width: 1360px) {
    .footer {
        padding: 96px 0 24px
    }
}

@media screen and (max-width: 946px) {
    .footer {
        padding-block: 88px
    }
}

.footer__container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 63px;
    margin: 0 136px 200px
}

@media screen and (max-width: 1360px) {
    .footer__container {
        margin: 0 64px 104px
    }
}

@media screen and (max-width: 946px) {
    .footer__container {
        flex-direction: column;
        margin-inline: 16px
    }
}

.footer__column {
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style-type: none
}

@media screen and (max-width: 1360px) {
    .footer__column {
        padding-inline: 16px
    }
}

.footer__link {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #000;
    text-transform: uppercase
}

@media screen and (max-width: 1360px) {
    .footer__link {
        font-size: 16px;
        line-height: 20px
    }
}

.footer__link a {
    color: #000;
    text-decoration: none
}

.footer__link [data-el="modal-button"] {
    cursor: pointer;
}

.footer__link--contacts a {
    color: #2f80ed
}

.footer__tagline {
    margin-inline: 72px;
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em;
    color: #bdbdbd
}

@media screen and (max-width: 1360px) {
    .footer__tagline {
        margin-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .footer--product {
        padding-bottom: 130px
    }
}

.text-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-inline: 136px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #333
}

@media screen and (max-width: 1360px) {
    .text-container {
        padding-inline: 64px
    }
}

@media screen and (max-width: 946px) {
    .text-container {
        padding-inline: 16px;
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.text-container h1 {
    font-size: 32px;
    font-weight: 400;
    line-height: 1.2;
    color: #000;
    text-align: center;
    margin-bottom: 40px
}


.text-container h2,
.text-container h3 {
    font-size: 28px;
    font-weight: 400;
    line-height: 1.2;
    color: #000;
    margin-bottom: 24px
}

@media screen and (max-width: 946px) {
    .text-container h1 {
        font-size: 24px;
        margin-bottom: 32px
    }

    .text-container h2,
    .text-container h3 {
        font-size: 18px;
        margin-bottom: 16px
    }
}

.text-container p {
    margin-bottom: 32px
}

@media screen and (max-width: 946px) {
    .text-container p {
        margin-bottom: 24px
    }
}

.text-container ol {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    margin-bottom: 40px;
    padding-left: 2rem;
}

.text-container ul {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    margin-bottom: 40px;
    padding-left: 20px;
    list-style: none
}

@media screen and (max-width: 946px) {
    .text-container ol {
        margin-bottom: 32px
    }

    .text-container ul {
        margin-bottom: 32px
    }
}

.text-container ol li,
.text-container ul li {
    position: relative
}

.text-container li p {
    margin-bottom: 0;
}

.text-container ul li:before {
    content: "";
    position: absolute;
    top: 14px;
    left: -12px;
    display: block;
    width: 4px;
    height: 4px;
    background: #333;
    border-radius: 50%
}

@media screen and (max-width: 946px) {
    .text-container ul li:before {
        top: 9px
    }
}

.languages {
    display: flex;
    align-items: center;
    list-style-type: none
}

.languages--active {
    color: #000
}

.languages--inactive {
    color: #bdbdbd
}

.languages li {
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em;
    border-right: 1px solid #bdbdbd;
    padding-inline: 8px
}

.languages li:first-child {
    padding-left: 0
}

.languages li:last-child {
    border: none
}

.languages a {
    text-decoration: none;
    text-transform: uppercase
}

.links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    padding: 16px 0
}

@media screen and (min-width: 1920px) {
    .links {
        justify-content: space-between
    }
}

@media screen and (max-width: 1360px) {
    .links {
        flex-wrap: wrap
    }
}

@media screen and (max-width: 946px) {
    .links {
        padding: 16px
    }
}

.links__wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-items: center;
    width: 100%;
    gap: 24px
}

@media screen and (max-width: 1360px) {
    .links__wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 24px
    }
}

.links__item {
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 306px;
    flex: 1 1 calc(25% - 72px);
    min-width: 296px;
    max-width: 384px;
    padding: 24px;
    text-decoration: none
}

.links__img {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    z-index: -1;
    width: 100%;
    height: 100%
}

.links__name {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: .02em;
    text-align: center;
    text-transform: uppercase;
    color: #fff
}

.links__name--bold {
    font-weight: 700
}

.links--categories {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    padding: 72px
}

@media screen and (max-width: 1360px) {
    .links--categories {
        padding: 80px 32px
    }
}

@media screen and (max-width: 946px) {
    .links--categories {
        align-items: center;
        padding: 52px 16px
    }
}

.links--categories .links__item {
    height: 184px;
    width: 100%;
    max-width: 384px;
    padding: 16px
}

@media screen and (max-width: 1360px) {
    .links--categories .links__item {
        min-width: 304px;
        flex: 1 1 calc(25% - 72px)
    }
}

.links--categories .links__name {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    text-transform: inherit
}

.advice {
    position: relative;
    width: 100%;
    height: max-content;
    padding: 24px 24px 32px;
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    border-radius: 24px;
    border: 1px solid #dedede
}

.advice--category {
    aspect-ratio: 16 / 9;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 400px;
    padding: 0;
    border: none;
}

.advice--category img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 24px;
    object-fit: cover;
    object-position: center;
}

@media screen and (max-width: 1360px) {
    .advice--category {
        display: none
    }
}

.advice--category .advice__icon {
    top: 24px;
    right: 24px
}

.advice__icon {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 55px;
    height: 53px
}

@media screen and (max-width: 946px) {
    .advice__icon {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 946px) {
    .advice__icon {
        display: none
    }
}

.advice__title {
    width: 90%;
    font-size: 32px;
    font-weight: 400;
    line-height: 36px
}

@media screen and (max-width: 946px) {
    .advice__title {
        font-size: 24px;
        line-height: 28px
    }
}

.advice__images {
    display: flex
}

.advice__img {
    height: 130px;
    margin: -1px
}

@media screen and (max-width: 1360px) {
    .advice__img {
        height: 94px
    }
}

@media screen and (max-width: 946px) {
    .advice__img {
        height: 130px
    }
}

.advice__list {
    width: 485px;
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    padding-left: 32px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .advice__list {
        width: 330px;
        font-size: 16px;
        line-height: 20px
    }
}

@media screen and (max-width: 425px) {
    .advice__list {
        width: 280px
    }
}

.breadcrumbs {
    display: flex;
    padding-inline: 72px;
    column-gap: 8px;
    list-style-type: none;
    margin: 56px 0 24px
}

@media screen and (max-width: 1360px) {
    .breadcrumbs {
        margin-top: 48px;
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .breadcrumbs {
        padding-inline: 16px;
        margin-block: 16px
    }
}

.breadcrumbs__item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em
}

.breadcrumbs__item span,
.breadcrumbs__item a {
    text-decoration: none;
    color: #000
}

.breadcrumbs--large {
    margin: 64px 0 24px;
    padding: 0
}

@media screen and (max-width: 1360px) {
    .breadcrumbs--large {
        margin-top: 48px;
        padding: 0
    }
}

@media screen and (max-width: 946px) {
    .breadcrumbs--large {
        margin-block: 16px
    }
}

@media screen and (max-width: 946px) {
    .sorting {
        width: 27px
    }
}

.sorting__wrapper {
    display: flex;
    align-items: center;
    column-gap: 32px;
    list-style-type: none
}

@media screen and (max-width: 1360px) {
    .sorting__wrapper {
        column-gap: 24px
    }
}

@media screen and (max-width: 946px) {
    .sorting__wrapper {
        display: none
    }
}

.sorting__item {
    cursor: pointer;
    background-color: transparent;
    border: none;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    text-decoration: none;
    color: #333;
    transition: font-weight .25s ease
}

.sorting__item--active {
    font-weight: 600
}

@media screen and (max-width: 946px) {
    .sorting__item--active {
        font-weight: 300;
        background-color: #f2f2f2
    }
}

.sorting__item:hover {
    font-weight: 600
}

@media screen and (max-width: 946px) {
    .sorting__item:hover {
        font-weight: 300
    }
}

@media screen and (max-width: 946px) {
    .sorting__item {
        display: block;
        width: 100%;
        text-align: start;
        padding: 8px 16px;
        font-size: 16px;
        font-weight: 300;
        line-height: 20px;
        letter-spacing: -.02em;
        color: #000;
        text-decoration: none;
        transition: background-color .2s ease
    }

    .sorting__item:hover {
        background-color: #f2f2f2;
        transition: background-color .2s ease
    }
}

.sorting__icon {
    display: none
}

@media screen and (max-width: 946px) {
    .sorting__icon {
        display: block
    }
}

.sorting .list-modal {
    display: none
}

@media screen and (max-width: 946px) {
    .sorting .list-modal {
        display: flex;
        top: 30px;
        right: 0
    }
}

.pagination {
    display: flex;
    justify-content: center;
    column-gap: 24px;
    margin-bottom: 56px
}

@media screen and (max-width: 1360px) {
    .pagination {
        margin-bottom: 48px
    }
}

.pagination__item {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    color: #333;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    background: none;
    border: none
}

.pagination__item:hover {
    border: 1px solid #333333;
    border-radius: 50%
}

.pagination__item--active {
    color: #fff;
    background: #333;
    border: 1px solid #333333;
    border-radius: 50%;
    cursor: auto
}

.toolbar {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    background: #fff;
    transform: translateY(100%);
    transition: transform .3s ease
}

@media screen and (max-width: 946px) {
    .toolbar {
        display: block
    }
}

.toolbar--visible {
    transform: translateY(0);
    transition: transform .3s ease
}

.toolbar--visible .list-modal {
    top: -73px
}

.toolbar--visible .list-modal.list-modal-mob {
    top: unset;
    bottom: 59px;
}

.toolbar--visible .list-modal__auth {
    top: -145px
}

.toolbar .header-buttons {
    padding: 8px 32px
}

.toolbar__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 18px;
    margin-top: 8px;
    margin-bottom: 8px;
    padding-inline: 24px
}

.toolbar .toolbar-btn {
    min-width: 140px;
    max-width: 140px
}

.toolbar .product-btn.toolbar-btn {
    padding: 8px 16px;
    background-color: #101011;
    color: #fff;
    border: none;
    border-radius: 8px
}

.toolbar .product-price__value {
    font-size: 32px;
    line-height: 36px
}

.cart-product__item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0
}

@media screen and (max-width: 1360px) {
    .cart-product__item {
        display: grid;
        grid-template-columns: 3fr 1fr
    }
}

@media screen and (max-width: 1024px) {
    .cart-product__item {
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }
}

.cart-product__info {
    display: flex;
    align-items: center;
    column-gap: 8px;
    padding-left: 20px
}

@media screen and (max-width: 946px) {
    .cart-product__info {
        column-gap: 4px;
        padding: 0
    }
}

.cart-product__icon {
    position: absolute;
    left: 0;
    width: 24px;
    height: 24px;
    border: none;
    background: none;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .cart-product__icon {
        top: 50%;
        transform: translateY(-50%)
    }
}

@media screen and (max-width: 946px) {
    .cart-product__icon {
        top: 0;
        right: 0;
        left: unset;
        background: #fff;
        transform: none
    }
}

.cart-product__img {
    min-width: 160px;
    max-width: 160px;
    min-height: 160px;
    max-height: 160px;
    object-fit: cover;
}

@media screen and (max-width: 1360px) {
    .cart-product__img {
        min-width: 112px;
        max-width: 112px;
        min-height: 112px;
        max-height: 112px
    }
}

@media screen and (max-width: 946px) {
    .cart-product__img {
        min-width: 64px;
        max-width: 64px;
        min-height: 64px;
        max-height: 64px
    }
}

.cart-product__name {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #000;
    text-decoration: none;
    text-transform: uppercase
}

@media screen and (max-width: 946px) {
    .cart-product__name {
        width: 75%;
        font-size: 14px;
        line-height: 18px
    }
}

.cart-product__price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 256px;
    max-width: 256px
}

@media screen and (max-width: 946px) {
    .cart-product__price {
        min-width: 100%;
        max-width: 100%
    }
}

.cart-product__price .cart-product__text {
    min-width: 88px;
    text-align: end
}

@media screen and (max-width: 946px) {
    .cart-product__price .cart-product__text {
        text-align: center
    }
}

.cart-product__quantity {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 8px;
    min-width: 40px;
    max-width: 40px
}

.cart-product__btn {
    border: none;
    background: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .cart-product__btn {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .cart-product .text-medium {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.order-status {
    display: flex;
    column-gap: 4px;
    max-width: max-content;
    padding: 4px;
    border-radius: 8px;
    background: #f2f2f2
}

.order-status.accepted .order-status__color {
    background: #ffd28e
}

.order-status.canceled .order-status__color {
    background: #ff6b6b
}

.order-status.inprogress .order-status__color {
    background-color: #d5ee41
}

.order-status.completed .order-status__color {
    background: #45ff63
}

.order-status__color {
    width: 20px;
    height: 20px;
    border-radius: 4px
}

.order-status__text {
    min-width: max-content;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #333
}

.order-item {
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media screen and (max-width: 1360px) {
    .order-item {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        row-gap: 4px
    }
}

.order-item__info {
    display: flex;
    align-items: center;
    column-gap: 24px;
    width: 60%
}

@media screen and (max-width: 1360px) {
    .order-item__info {
        width: 100%
    }
}

@media screen and (max-width: 946px) {
    .order-item__info {
        align-items: flex-start;
        column-gap: 0;
        padding-right: 0
    }
}

.order-item__img {
    min-width: 160px;
    max-width: 160px;
    height: 160px
}

@media screen and (max-width: 1360px) {
    .order-item__img {
        min-width: 112px;
        max-width: 112px;
        height: 112px
    }
}

@media screen and (max-width: 946px) {
    .order-item__img {
        min-width: 64px;
        max-width: 64px;
        height: 64px
    }
}

.order-item__name {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: none;
    color: #000
}

@media screen and (max-width: 946px) {
    .order-item__name {
        font-size: 14px;
        line-height: 18px
    }
}

.order-item__details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 368px
}

@media screen and (max-width: 1360px) {
    .order-item__details {
        width: 328px
    }
}

@media screen and (max-width: 946px) {
    .order-item__details {
        column-gap: 4px;
        width: 100%;
        padding-left: 64px
    }
}

.order-item__price,
.order-item__sum {
    width: 108px;
    text-align: right
}

@media screen and (max-width: 946px) {

    .order-item__price,
    .order-item__sum {
        width: auto;
        text-align: left
    }
}

.menu {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    min-width: 240px;
    max-width: 240px;
    list-style-type: none
}

@media screen and (max-width: 946px) {
    .menu {
        align-items: center;
        row-gap: 16px;
        min-width: 100%;
        max-width: 100%
    }
}

.menu__item a {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #333;
    text-decoration: none;
    text-transform: uppercase
}

@media screen and (max-width: 946px) {
    .menu__item a {
        color: #101011
    }
}

.menu__item--active a {
    color: #ff002a
}

.checkbox {
    position: relative;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    cursor: pointer;
    color: #101011
}

.checkbox__input {
    position: absolute;
    height: 0;
    width: 0;
    opacity: 0;
    cursor: pointer
}

.checkbox__input:checked+.checkbox__label .checkbox__icon {
    background: #fff;
    border-color: #fff
}

.checkbox__input:checked+.checkbox__label .checkbox__icon img {
    opacity: 1
}

.checkbox__icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #101011;
    border-radius: 4px;
    background: #fff
}

.checkbox__icon img {
    opacity: 0;
    transition: opacity .25s ease
}

.checkbox__text {
    cursor: pointer;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #101011
}

@media screen and (max-width: 1360px) {
    .checkbox__text {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.checkbox__text--bold {
    font-weight: 500
}

@media screen and (max-width: 1360px) {
    .checkbox__text--bold {
        line-height: 18px;
        letter-spacing: normal
    }
}

@media screen and (max-width: 946px) {
    .checkbox__text--bold {
        line-height: 20px
    }
}

.checkbox__label {
    display: flex;
    align-items: center;
    column-gap: 12px
}

.checkbox__label .checkbox__icon {
    cursor: pointer
}

.promocode__wrapper {
    display: flex;
    width: max-content;
    height: 40px
}

@media screen and (max-width: 946px) {
    .promocode__wrapper {
        width: 100%
    }
}

.promocode__input {
    width: 185px;
    height: 100%;
    padding: 10px 16px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    border-radius: 16px 0 0 16px;
    border: 1px solid #101011;
    color: #101011
}

@media screen and (max-width: 946px) {
    .promocode__input {
        width: 100%
    }
}

.promocode__input::placeholder {
    color: #bdbdbd
}

.promocode__btn {
    min-width: 151px;
    max-width: 151px;
    height: 100%;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011;
    background: none;
    border-radius: 0 16px 16px 0;
    border: 1px solid #101011;
    border-left: none;
    cursor: pointer
}

.promocode__error {
    display: none;
    margin-top: 4px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #e42424
}

.promocode--success .promocode__input {
    border-color: #45ff63
}

.promocode--error .promocode__error {
    display: block
}

.promocode--error .promocode__input {
    border-color: #e42424
}

.text-field {
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 8px;
    max-width: 360px;
    min-width: 360px
}

@media screen and (max-width: 946px) {
    .text-field {
        max-width: 100%;
        min-width: 100%
    }
}

.text-field__label {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011
}

@media screen and (max-width: 946px) {
    .text-field__label {
        font-size: 14px;
        line-height: 18px
    }
}

.text-field__input-wrapper {
    position: relative;
}

.text-field__input {
    width: 100%;
    min-height: 44px;
    max-height: 44px;
    padding: 0 16px;
    border-radius: 16px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    border: 1px solid #101011;
    background: #fff;
    color: #101011
}

@media screen and (max-width: 946px) {
    .text-field__input {
        font-size: 14px;
        line-height: 18px
    }
}

.text-field__input::placeholder {
    color: #bdbdbd
}

.text-field__icon-accepted {
    position: absolute;
    right: 16px;
    bottom: 12px;
    opacity: 0
}

.text-field__icon-search {
    position: absolute;
    bottom: 13px;
    left: 16px
}

.text-field--pointer .text-field__input {
    cursor: pointer
}

.text-field--accepted {
    position: relative
}

.text-field--accepted .text-field__input {
    padding-right: 38px
}

.radio-button {
    position: relative;
    padding: 32px 16px;
    display: flex;
    column-gap: 16px;
    align-items: center;
    flex: 1;
    border: 1px solid #333333;
    border-radius: 16px;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .radio-button {
        width: 100%
    }
}

@media screen and (max-width: 946px) {
    .radio-button {
        padding: 24px 8px
    }
}

.radio-button.checked .radio-button__icon:after {
    transform: scale(1)
}

.radio-button__content {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #333;
    text-transform: uppercase
}

@media screen and (max-width: 946px) {
    .radio-button__content {
        font-size: 14px;
        line-height: 18px
    }
}

.radio-button__btn {
    position: absolute;
    z-index: -1;
    opacity: 0;
    transform: translate(-50%, -50%)
}

.radio-button__label {
    position: relative;
    width: max-content;
    display: block;
    cursor: pointer
}

.radio-button__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px
}

.radio-button__icon:before,
.radio-button__icon:after {
    content: "";
    position: absolute
}

.radio-button__icon:before {
    width: 40px;
    height: 40px;
    background-color: transparent;
    border-radius: 50%;
    border: 2px solid #333333
}

@media screen and (max-width: 946px) {
    .radio-button__icon:before {
        width: 32px;
        height: 32px
    }
}

.radio-button__icon:after {
    content: "";
    width: 24px;
    height: 24px;
    background: #45ff63;
    border-radius: 50%;
    transform: scale(0);
    transition: transform .25s ease
}

@media screen and (max-width: 946px) {
    .radio-button__icon:after {
        width: 16px;
        height: 16px
    }
}

.select {
    background: #fff;
    border: 1px solid #333333;
    border-radius: 16px
}

@media screen and (max-width: 946px) {
    .select {
        border-radius: 20px
    }
}

.select__wrapper {
    padding-right: 16px;
    padding-block: 16px
}

.select__list {
    display: flex;
    flex-direction: column;
    list-style-type: none;
    max-height: 212px;
    overflow-y: auto
}

.delivery-modal--nova_poshta .select__list {
    height: 212px
}

@media screen and (max-width: 946px) {
    .select__list {
        max-height: 358px
    }

    .delivery-modal--nova_poshta .select__list {
        height: 358px
    }
}

.select__item {
    display: block;
    width: 100%;
    padding: 8px 16px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #000;
    cursor: pointer;
    text-decoration: none;
    transition: background-color .2s ease
}

.select__item:first-child {
    padding-top: 0
}

.select__item:hover {
    background-color: #f2f2f2;
    transition: background-color .2s ease
}

.product-card {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    padding-bottom: 130px;
    max-height: 455px
}

@media screen and (min-width: 1728px) {
    .product-card {
        max-height: 500px
    }
}

@media screen and (max-width: 1360px) {
    .product-card {
        max-height: max-content;
        padding-bottom: 80px
    }
}

@media screen and (max-width: 946px) {
    .product-card {
        display: flex;
        justify-content: center;
        max-height: 436px;
        /* width: max-content; */
    }
}

@media screen and (max-width: 425px) {
    .product-card {
        width: 100%
    }
}

.product-card:hover .product-card__info {
    bottom: 0;
    transition: all .3s ease
}

.product-card:hover .product-card__btn {
    opacity: 1;
    transition: opacity .2s ease
}

.product-card__img {
    width: 100%;
    height: auto;
    object-fit: contain
}

.product-card__label {
    position: absolute;
    top: 0;
    right: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    row-gap: 8px
}

@media screen and (max-width: 1360px) {
    .product-card__label {
        right: 32px
    }
}

@media screen and (max-width: 946px) {
    .product-card__label {
        right: 0;
        row-gap: 4px
    }
}

.product-card__label img {
    width: 132px;
    height: 40px
}

.product-card__label img._small {
    width: 40px;
}

.product-card__label img._hit {
    width: 48px;
    height: 48px;
}

@media screen and (max-width: 946px) {
    .product-card__label img {
        width: 105px;
        height: 32px
    }

    .product-card__label img._small {
        height: 40px;
    }
}

.product-card__link {
    display: block;
    margin-block: 4px;
    color: #000;
    text-decoration: none;
    text-align: center
}

@media screen and (max-width: 946px) {
    .product-card__link {
        display: flex;
        flex-direction: column
    }
}

.product-card__name {
    font-size: 16px;
    font-weight: 500;
    line-height: 18px;
    text-transform: uppercase
}

@media screen and (max-width: 946px) {
    .product-card__name {
        font-size: 14px
    }
}

.product-card__description {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em
}

@media screen and (max-width: 1360px) {
    .product-card__description {
        line-height: 18px
    }
}

.product-card__info {
    position: absolute;
    bottom: -40px;
    z-index: 1;
    background: #fff;
    transition: all .3s ease
}

.product-card__info:not(:has(.product-card__btn)) {
    bottom: 0;
}

@media screen and (max-width: 946px) {
    .product-card__info {
        bottom: 8px !important;
    }
}

.product-card__price {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #000
}

.product-card__price--old {
    text-decoration: line-through
}

.product-card__price--sale {
    color: #2ce249
}

.product-card__row {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    justify-items: center
}

@media screen and (max-width: 946px) {
    .product-card__row {
        grid-template-columns: 1fr 1fr
    }
}

.product-card__row img {
    display: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .product-card__row img {
        display: block
    }
}

.product-card__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 4px;
    height: 44px;
    padding-inline: 32px;
    margin: 4px auto 0;
    border: none;
    border-radius: 4px;
    opacity: 0;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    background: #101011;
    color: #fff;
    cursor: pointer;
    transition: opacity .2s ease
}

@media screen and (max-width: 946px) {
    .product-card__btn {
        display: none
    }
}

.product-card__icon {
    width: 25px;
    height: 19px
}

.article-card {
    display: flex;
    gap: 24px;
    color: #000
}

@media screen and (max-width: 946px) {
    .article-card {
        gap: 16px
    }
}

.article-card__img {
    display: flex;
    justify-content: flex-end;
    min-width: 88px;
    max-width: 88px;
    height: 88px;
    overflow: hidden;
}

@media screen and (max-width: 946px) {
    .article-card__img {
        justify-content: flex-start
    }
}

.article-card__img img {
    width: auto;
    height: 100%;
    object-fit: cover
}

.article-card__column {
    display: flex;
    flex-direction: column;
    row-gap: 4px
}

.article-card__row {
    display: flex;
    column-gap: 16px
}

.article-card__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em
}

@media screen and (max-width: 946px) {
    .article-card__text {
        font-size: 14px;
        line-height: 18px
    }
}

.article-card__text--uppercase {
    text-transform: uppercase
}

.article-card__link {
    color: #2561fa;
    text-decoration: none
}

.order-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 8px;
    margin-top: 40px
}

@media screen and (max-width: 1360px) {
    .order-card {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 4px
    }
}

.order-card__row {
    width: 100%;
    display: flex;
    align-items: center;
    column-gap: 8px
}

@media screen and (max-width: 1360px) {
    .order-card__row {
        column-gap: 4px
    }
}

@media screen and (max-width: 946px) {
    .order-card__row {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 4px
    }
}

.order-card__info {
    width: 236px
}

@media screen and (max-width: 946px) {
    .order-card__info {
        width: 100%;
        display: flex;
        justify-content: space-between
    }
}

.order-card__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px
}

.order-card__text--dark {
    position: relative;
    width: max-content;
    letter-spacing: .02em;
    color: #101011;
    text-transform: uppercase;
    cursor: pointer
}

.order-card__text--dark:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: #101011
}

.order-card__text--light {
    letter-spacing: -.02em;
    color: #bdbdbd;
    text-transform: lowercase;
    text-decoration: none
}

.order-card__images {
    display: flex;
    align-items: center;
    column-gap: 8px
}

@media screen and (max-width: 1360px) {
    .order-card__images {
        column-gap: 4px
    }
}

.order-card__images img {
    width: 88px;
    height: 88px
}

@media screen and (max-width: 1360px) {
    .order-card__images--large img:not(:nth-child(-n+3)) {
        display: none
    }
}

.order-card__details {
    display: flex;
    align-items: center;
    column-gap: 24px
}

.order-card__sum {
    min-width: max-content
}

@media screen and (max-width: 946px) {
    .order-card .text-medium {
        font-size: 20px;
        line-height: 28px
    }
}

.modal {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: fixed;
    z-index: -10;
    overflow-y: auto;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    transform: translateY(-100%);
    background: #fff
}

@media screen and (max-width: 946px) {
    .modal {
        bottom: 0;
        transform: translate(-100%);
        transition: transform .4s ease, opacity .1s ease
    }
}

.modal--visible {
    opacity: 1;
    z-index: 10;
    transform: translateY(0);
    transition: opacity .4s ease
}

@media screen and (max-width: 946px) {
    .modal--visible {
        transform: translate(0);
        transition: transform .4s ease, opacity .1s ease
    }
}

.modal--visible .modal__close--mobile {
    opacity: 1;
    transition: opacity .35s ease .15s
}

.modal__close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 24px;
    height: 24px;
    padding: 4px;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .modal__close {
        display: none
    }

    .account-modal .modal__close {
        display: block
    }
}

.modal__close--mobile {
    display: none
}

@media screen and (max-width: 946px) {
    .modal__close--mobile {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        right: 0;
        width: 48px;
        height: 100%;
        opacity: 0;
        background: #101011
    }
}

.modal__close--mobile img {
    width: 34px;
    height: 34px;
    padding: 8px
}

.modal__close--desktop {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 32px;
    height: 32px;
    padding: 4px;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .modal__close--desktop {
        top: 12px;
        right: 12px
    }
}

.modal .text-title {
    width: 100%;
    color: #101011;
    text-align: center
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .2);
    z-index: 9;
    transition: .3s ease all;
    opacity: 0;
    visibility: hidden;
}

html:has(.modal.modal--visible:not(.product-gallery)) .overlay {
    opacity: 1;
    visibility: visible;
}

.info-modal,
.password-modal,
.delivery-modal {
    flex-direction: column;
    row-gap: 32px;
    width: 672px;
    padding: 40px 40px 48px;
    margin: auto;
    border-radius: 20px;
    border: 1px solid #101011;
    top: 50%;
    transform: translateY(-50%)
}

.language-modal {
    align-items: center;
    gap: 40px;
}

.language-modal__buttons {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.language-modal__buttons .radio-button {
    width: 100%;
}

.language-modal .account-page__btn {
    padding: 16px 48px;
}

.account-modal {
    top: 50%;
    transform: translateY(-50%);
    border-radius: 20px;
    border: 1px solid #101011;
    flex-direction: column;
    align-items: center;
    row-gap: 32px;
    width: 672px;
    max-width: calc(100% - 16px);
    padding: 40px;
    margin: auto;
}

.account-modal .modal__close {
    width: 32px;
    height: 32px;
}

.account-modal__text {
    color: #333;
    text-align: center;
}

.account-modal .password-modal__close {
    font-size: 20px;
}

.account-modal__form {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

@media screen and (max-width: 1360px) {

    .info-modal,
    .password-modal,
    .delivery-modal {
        margin: 0;
        row-gap: 40px
    }
}

@media screen and (max-width: 946px) {

    .info-modal,
    .password-modal,
    .delivery-modal {
        height: max-content;
        width: 344px;
        border-radius: 24px;
        padding: 32px 24px 24px
    }

    .account-modal {
        height: max-content;
    }


    .language-modal {
        gap: 36px;
        padding: 40px 24px;
    }

    .language-modal__buttons {
        gap: 16px;
    }

    .language-modal .account-page__btn {
        width: 100%;
        padding: 8px;
    }
}

@media screen and (max-width: 600px) {
    .account-modal {
        padding: 40px 24px;
        row-gap: 24px;
    }

    .account-modal__form {
        gap: 24px;
    }

    .account-modal p.text-title,
    .account-modal .account-modal__text {
        text-align: left;
    }

    .account-modal p.text-title {
        padding-right: 32px;
    }

    .account-modal .account-page__btn {
        width: 100%;
    }
}

.info-modal__text {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #101011
}

.info-modal__text a[data-el="modal-button"] {
    cursor: pointer;
}

@media screen and (max-width: 946px) {
    .info-modal__text {
        font-size: 16px;
        line-height: 20px
    }
}

.info-modal__text a {
    position: relative;
    width: max-content;
    text-decoration: none;
    color: #101011
}

.info-modal__text a:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: #101011
}

.info-modal__button {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 44px;
    padding-inline: 36px;
    border-radius: 8px;
    background: #101011;
    color: #fff;
    text-decoration: none
}

@media screen and (max-width: 946px) {
    .info-modal__button {
        width: 100%;
        height: 44px;
        padding-inline: 0;
        border-radius: 8px
    }

    .info-modal {
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .info-modal[data-id="consultation-modal"] {
        left: 0;
    }
}

.search {
    position: absolute;
    top: 0;
    display: flex;
    justify-content: center;
    width: 100%;
    padding-block: 80px;
    background: #fff;
    border-bottom: 1px solid #000000
}

@media screen and (max-width: 1360px) {
    .search {
        padding: 72px 32px
    }
}

@media screen and (max-width: 946px) {
    .search {
        align-items: flex-start;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: 100%;
        padding: 32px 48px 16px 16px;
        border-bottom: none
    }
}

.search__wrapper {
    width: 65%
}

@media screen and (max-width: 1360px) {
    .search__wrapper {
        width: 100%
    }
}

@media screen and (max-width: 946px) {
    .search__wrapper {
        margin-right: 16px
    }
}

.search__title {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #000
}

.search__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: #000
}

.search--history-visible .search-history,
.search--products-visible .search-products {
    display: flex;
    opacity: 1
}

.search-bar {
    position: relative
}

.search-bar__input {
    width: 100%;
    height: 48px;
    padding: 12px 48px 12px 24px;
    border-radius: 40px;
    border: 1px solid #000000;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 300;
    line-height: 18px;
    color: #101011
}

@media screen and (max-width: 946px) {
    .search-bar__input::placeholder {
        color: transparent
    }
}

.search-bar__icons--active .search-bar__icon--close {
    opacity: 1;
    z-index: 1
}

.search-bar__icons--active .search-bar__icon--search {
    opacity: 0;
    z-index: -1
}

.search-bar__icon {
    position: absolute;
    cursor: pointer
}

.search-bar__icon--search {
    cursor: default;
    width: 38px;
    height: auto;
    top: 5px;
    right: 6px
}

.search-bar__icon--close {
    padding: 3px;
    top: 12px;
    right: 12px;
    opacity: 0;
    z-index: -1
}

.search-history {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-top: 24px;
    /* opacity: 0; */
    transition: opacity .25s ease
}

.search-history.search--visible {
    display: flex;
    opacity: 1
}

.search-history__title {
    text-transform: none
}

.search-history__item {
    display: flex;
    align-items: center;
    column-gap: 24px;
    padding-left: 12px;
    text-decoration: none
}

.search-history__icon {
    width: 16px;
    height: 16px
}

.search-products {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    position: relative;
    max-height: calc(90vh - 160px);
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
    margin-top: 16px;
    /* opacity: 0; */
    transition: opacity .25s ease
}

@media screen and (max-width: 946px) {
    .search-products {
        align-items: center
    }
}

.search-products__item {
    display: flex;
    align-items: center
}

@media screen and (max-width: 946px) {
    .search-products__item {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 4px;
        width: 100%;
        padding-bottom: 16px;
        border-bottom: 1px solid #dedede
    }
}

@media screen and (max-width: 946px) {
    .search-products__item:nth-child(n+3) {
        border-bottom: none
    }
}

.search-products__product {
    display: flex;
    column-gap: 24px;
    align-items: center;
    width: 65%;
    text-decoration: none;
    color: #000
}

@media screen and (max-width: 946px) {
    .search-products__product {
        width: 100%;
        column-gap: 4px
    }
}

.search-products__img {
    min-width: 104px;
    max-width: 104px;
    min-height: 104px;
    max-height: 104px
}

@media screen and (max-width: 946px) {
    .search-products__img {
        min-width: 64px;
        max-width: 64px;
        min-height: 64px;
        max-height: 64px
    }
}

.search-products__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 35%
}

@media screen and (max-width: 946px) {
    .search-products__actions {
        width: 100%
    }
}

.search-products__price {
    min-width: 108px;
    max-width: 108px;
    text-align: right
}

@media screen and (max-width: 946px) {
    .search-products__price {
        min-width: max-content;
        max-width: max-content;
        text-align: left
    }
}

.search-products__price--red {
    color: #eb5757
}

.search-products__price--green {
    color: #2ce249
}

.search-products__price--old {
    text-decoration: line-through
}

.search-products__price p:first-child {
    line-height: 8px
}

.search-products__button {
    width: max-content;
    max-width: 100%;
    display: block;
    min-height: 44px;
    margin: 0 auto;
    border: none;
    border-radius: 8px;
    color: #fff;
    background: #101011;
    text-align: center;
    cursor: pointer;
    padding: 0 24px;
}

@media screen and (max-width: 946px) {
    .search-products__button {
        position: fixed;
        bottom: 16px
    }
}

@media screen and (max-width: 946px) {
    .search-products .search__text {
        font-size: 14px;
        line-height: 18px
    }
}

.list-modal {
    display: flex;
    flex-direction: column;
    width: 204px;
    position: absolute;
    right: 60px;
    top: 58px;
    overflow: hidden;
    z-index: -10;
    opacity: 0;
    background: #fff;
    border: 1px solid #333333;
    border-radius: 16px;
    list-style-type: none
}

.list-modal.modal--visible {
    opacity: 1;
    z-index: 10;
    transition: opacity .25s ease
}

.list-modal a {
    display: block;
    width: 100%;
    padding: 8px 16px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #000;
    text-decoration: none;
    transition: background-color .2s ease
}

.list-modal a:hover {
    background-color: #f2f2f2;
    transition: background-color .2s ease
}

.basket-modal {
    display: flex;
    flex-direction: column;
    width: 412px;
    /* position: absolute;
    right: 0;
    top: 58px; */
    position: fixed;
    right: 40px;
    top: 120px;
    overflow: hidden;
    z-index: -10;
    opacity: 0;
    transform: none;
    background: #fff;
    border-radius: 24px;
    border: 1px solid #101011
}

.basket-modal-success {
    top: 120px;
    right: 72px;
    padding: 16px;
}

.basket-modal-success .basket-modal__empty {
    margin-bottom: 12px;
}

.basket-success-btn {
    cursor: pointer;
    color: #2561fa;
    text-decoration: none;
}

@media screen and (max-width: 1360px) {
    .basket-modal-success {
        right: 32px;
    }
}

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

    body._scrolled .basket-modal,
    body:has(.modal.search.modal--visible) .basket-modal {
        top: 40px;
    }

    .basket-modal-success .modal__close {
        display: none !important;
    }
}

@media screen and (max-width: 946px) {
    .basket-modal {
        position: fixed;
        right: 0;
    }

    .basket-modal-success {
        top: 40px;
        width: calc(100% - 16px);
        right: 8px;
    }

    .basket-modal-success .modal__close {
        display: block;
        width: 32px;
        height: 32px;
        top: 12px;
        right: 12px;
        z-index: 2;
    }

    .basket-modal-success .basket-modal__wrapper {
        row-gap: 12px;
    }
}

.basket-modal.modal--visible {
    opacity: 1;
    z-index: 10;
    transition: opacity .25s ease
}

.basket-modal.fullscreen-modal,
.basket-modal.order-modal,
.basket-modal.delivery-modal,
.basket-modal.catalog-mobile {
    row-gap: 16px;
    padding: 16px
}

@media screen and (max-width: 946px) {

    .basket-modal.fullscreen-modal,
    .basket-modal.order-modal,
    .basket-modal.delivery-modal,
    .basket-modal.catalog-mobile {
        justify-content: flex-start;
        row-gap: 4px;
        padding-right: 64px
    }
}

.basket-modal--empty .basket-products {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
    min-height: 196px;
    margin: 0;
    flex-direction: column;
}

@media screen and (max-width: 946px) {
    .basket-modal--empty .basket-products {
        margin: auto
    }
}

.basket-modal--empty .basket-total {
    border: none
}

@media screen and (max-width: 946px) {
    .basket-modal--empty .basket-total {
        border-top: 1px solid #dedede
    }
}

.basket-modal .text-title {
    display: none;
    width: 100%;
    color: #101011;
    text-align: center
}

@media screen and (max-width: 946px) {
    .basket-modal .text-title {
        display: block;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 946px) {
    .basket-modal__wrapper {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
        row-gap: 4px
    }
}

.basket-modal__empty {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #000
}

.basket-modal__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    /* width: 180px; */
    height: 44px;
    margin: 16px auto 0;
    padding: 6px 36px 8px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #fff;
    background: #101011;
    border-radius: 8px;
    border: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .basket-modal__btn {
        margin-top: 16px
    }
}

.basket-products {
    position: relative;
    overflow-y: auto;
    max-height: 272px;
    margin-bottom: 12px;
    padding-right: 4px;
}

@media screen and (max-width: 946px) {
    .basket-products {
        row-gap: 24px;
        max-height: calc(100vh - 244px);
        height: 100%;
        margin-bottom: 0
    }
}

.basket-products__item {
    display: flex;
    gap: 8px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #101011;
    margin-bottom: 4px;
}

.basket-products__img {
    min-width: 88px;
    max-width: 88px;
    min-height: 88px;
    max-height: 88px
}

@media screen and (max-width: 946px) {
    .basket-products__img {
        min-width: 64px;
        max-width: 64px;
        min-height: 64px;
        max-height: 64px
    }
}

.basket-products__info {
    display: flex;
    flex-direction: column;
    row-gap: 4px
}

.basket-products__name {
    position: relative;
    display: flex;
    column-gap: 4px;
    text-decoration: none;
    color: #101011
}

.basket-products__name a {
    text-decoration: none;
    color: #101011
}

@media screen and (max-width: 946px) {
    .basket-products__name {
        font-size: 14px;
        line-height: 18px
    }
}

.basket-products__icon {
    min-width: 20px;
    max-width: 20px;
    min-height: 20px;
    max-height: 20px;
    cursor: pointer
}

.basket-products__price {
    display: flex;
    align-items: center;
    column-gap: 24px
}

.basket-total {
    display: flex;
    flex-direction: column;
    row-gap: 4px;
    padding-top: 16px;
    border-top: 1px solid #dedede;
    font-weight: 300;
    color: #101011
}

@media screen and (max-width: 946px) {
    .basket-total {
        row-gap: 8px;
        padding-top: 4px
    }
}

.basket-total__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

.basket-total__name {
    font-size: 16px;
    line-height: 20px;
    letter-spacing: -.02em
}

.basket-total__price {
    font-size: 20px;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .basket-total__price {
        font-size: 16px;
        line-height: 20px
    }
}

.basket-total__price--bold {
    font-weight: 500
}

.fullscreen-modal,
.order-modal,
.delivery-modal,
.catalog-mobile {
    row-gap: 80px;
    padding: 40px;
    border: 1px solid #333333
}

@media screen and (max-width: 946px) {

    .fullscreen-modal,
    .order-modal,
    .delivery-modal,
    .catalog-mobile {
        width: 100vw;
        height: 100%;
        padding: 16px 64px 16px 16px;
        justify-content: space-between;
        border-radius: 0;
        top: 0;
        transform: translateY(0) translate(-100%);
        transition: transform .4s ease, opacity .1s ease
    }
}

@media screen and (max-width: 946px) {

    .fullscreen-modal.modal--visible,
    .modal--visible.order-modal,
    .modal--visible.delivery-modal,
    .modal--visible.catalog-mobile {
        transform: translateY(0) translate(0);
        transition: transform .4s ease, opacity .1s ease
    }
}

.fullscreen-modal--filters {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    row-gap: 24px
}

.fullscreen-modal--filters .filters {
    position: relative;
    overflow-y: auto;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 946px) {
    .fullscreen-modal__info {
        flex-direction: column
    }
}

.fullscreen-modal__actions {
    display: flex;
    flex-direction: column;
    row-gap: 32px
}

.fullscreen-modal__row {
    display: flex;
    flex-direction: column;
    row-gap: 16px
}

.fullscreen-modal__text {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #000
}

@media screen and (max-width: 946px) {
    .fullscreen-modal__text {
        font-size: 20px;
        line-height: 28px
    }
}

.fullscreen-modal__phone {
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: #000;
    text-decoration: none
}

@media screen and (max-width: 946px) {
    .fullscreen-modal__phone {
        font-size: 20px;
        line-height: 28px
    }
}

.fullscreen-modal__buttons {
    display: flex;
    align-items: center;
    column-gap: 12px
}

.fullscreen-modal__btn {
    height: 52px;
    padding: 16px 24px;
    border-radius: 28px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-decoration: none;
    text-transform: uppercase;
    border: 1px solid #101011;
    color: #101011
}

@media screen and (max-width: 946px) {
    .fullscreen-modal__btn {
        font-size: 16px;
        line-height: 20px
    }
}

.fullscreen-modal__img {
    position: absolute;
    right: 60px;
    bottom: 64px;
    width: 150px;
    height: 142px
}

@media screen and (max-width: 946px) {
    .fullscreen-modal__img {
        position: relative;
        right: unset;
        bottom: unset;
        margin: 0 auto
    }
}

@media screen and (max-width: 946px) {

    .fullscreen-modal .modal__close--desktop,
    .order-modal .modal__close--desktop,
    .delivery-modal .modal__close--desktop,
    .catalog-mobile .modal__close--desktop {
        display: none
    }
}

.catalog-mobile {
    display: none
}

@media screen and (max-width: 946px) {
    .catalog-mobile {
        display: flex
    }
}

.catalog-mobile--visible .catalog-mobile__prev {
    display: flex
}

.catalog-mobile__prev {
    display: none;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 48px;
    height: 100%;
    background: #d2d2d2;
    opacity: .8;
    cursor: pointer
}

.catalog-mobile__prev img {
    width: 34px;
    height: 100%;
    padding: 8px
}

.catalog-mobile__content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%
}

.catalog-mobile__info {
    width: 100%;
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #ff1037
}

.catalog-mobile__temp {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin-bottom: 12px
}

.catalog-mobile__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #bdbdbd;
    text-transform: uppercase
}

.catalog-mobile .catalog {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 24px;
    position: static
}

.catalog-mobile .catalog__item {
    line-height: 20px;
    color: #333
}

.catalog-mobile .catalog__item:hover {
    color: #ff002a
}

.catalog-mobile .catalog-wrapper {
    position: absolute;
    top: 0;
    left: 48px;
    right: 48px;
    width: auto;
    height: 100%;
    padding: 0 16px;
    border-radius: 0;
    border: none;
    transform: translate(-100%);
    transition: all .4s ease
}

.catalog-mobile .catalog-wrapper--visible {
    transform: translate(0);
    transition: transform .4s ease
}

.catalog-mobile .catalog-category {
    height: 100%
}

.catalog-mobile .catalog-category__text {
    text-align: center
}

.product-gallery {
    width: 100vw;
    height: 100vh;
    padding: 32px;
    align-items: center;
    justify-content: space-between;
    overflow: hidden
}

.product-gallery.modal {
    opacity: 0;
    transition: opacity .4s ease
}

.product-gallery.modal--visible {
    opacity: 1
}

@media screen and (max-width: 946px) {
    .product-gallery {
        height: 100%;
        padding: 16px
    }
}

@media screen and (max-width: 946px) {
    .product-gallery__wrapper {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        height: 100%
    }
}

.product-gallery__swiper {
    max-width: 70vw
}

@media screen and (max-width: 946px) {
    .product-gallery__swiper {
        max-width: 100%;
        margin: auto 0
    }
}

.product-gallery__swiper .swiper-slide {
    display: flex;
    justify-content: center;
    max-height: calc(100vh - 160px)
}

.product-gallery__swiper .swiper-slide img {
    height: auto;
    width: 100%;
    object-fit: contain;
    cursor: pointer
}

.product-gallery .product-gallery__thumb .swiper-slide-thumb-active img {
    border-radius: 8px;
    border: 1px solid #101011 !important
}

@media screen and (max-width: 946px) {
    .product-gallery__thumb {
        width: 100%;
        margin-bottom: 8px
    }
}

.product-gallery__thumb .swiper-slide {
    width: 104px;
    height: 96px;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .product-gallery__thumb .swiper-slide {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 48px;
        padding: 4px;
        border-radius: 4px
    }
}

.product-gallery__thumb .swiper-slide img {
    width: auto;
    height: 100%
}

.product-gallery__thumb .swiper-slide img:hover {
    border-radius: 8px;
    border: 1px solid #dedede
}

.product-gallery__navigation {
    border: none;
    background: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {

    .product-gallery__navigation,
    .product-gallery__navigation--desktop {
        display: none
    }

    .product-gallery__navigation.swiper-button-disabled {
        visibility: hidden
    }
}

.product-gallery__navigation--mobile {
    display: none
}

@media screen and (max-width: 946px) {
    .product-gallery__navigation--mobile {
        display: block
    }
}

.product-gallery__navigation img {
    width: 45px;
    height: 45px
}

@media screen and (max-width: 946px) {
    .product-gallery__navigation img {
        width: 24px;
        height: 24px
    }
}

.product-gallery .modal__close {
    width: 32px;
    height: 32px;
    top: 32px;
    right: 32px
}

@media screen and (max-width: 946px) {
    .product-gallery .modal__close {
        display: block;
        width: 24px;
        height: 24px;
        top: 16px;
        right: 16px
    }
}

.delivery-modal {
    align-items: center;
    justify-content: flex-start;
    padding-bottom: 40px;
    row-gap: 0
}

@media screen and (max-width: 946px) {
    .delivery-modal {
        padding-top: 16px
    }
}

.delivery-modal--city {
    height: 584px
}

.delivery-modal--city .delivery-modal__btn {
    margin-top: auto
}

@media screen and (max-width: 946px) {
    .delivery-modal--city {
        height: 100%
    }

    .delivery-modal--city .delivery-modal__wrapper {
        margin: auto
    }

    .delivery-modal--city .delivery-modal__btn {
        position: relative;
        bottom: 0;
        margin-top: 0
    }
}

.delivery-modal__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center
}

.delivery-modal__buttons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 8px
}

@media screen and (max-width: 946px) {
    .delivery-modal__buttons {
        margin-top: 16px;
        padding-inline: 10px
    }
}

.delivery-modal__city {
    width: max-content;
    height: 44px;
    padding: 8px 12px;
    border-radius: 4px;
    border: none;
    background: #f2f2f2;
    cursor: pointer;
    color: #000
}

.delivery-modal__btn {
    width: 181px;
    height: 72px;
    margin-top: 36px;
    font-size: 28px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background: #101011;
    border-radius: 8px;
    border: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .delivery-modal__btn {
        position: absolute;
        bottom: 16px;
        width: 144px;
        height: 44px;
        margin: 0 auto;
        font-size: 20px;
        line-height: 28px;
        border-radius: 8px;
        background: #101011
    }
}

.delivery-modal .select {
    position: relative;
    width: 100%
}

.delivery-modal:not(.delivery-modal--courier) .text-field {
    position: relative;
    min-width: 100%;
    max-width: 100%;
    margin-bottom: 8px
}

.delivery-modal:not(.delivery-modal--courier) .text-field__input {
    padding-left: 40px;
    border-color: #333
}

.delivery-modal:not(.delivery-modal--courier) .text-field__input::placeholder {
    color: #333
}

.delivery-modal__search {
    position: relative;
    width: 100%;
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    align-items: center
}

.delivery-modal__courier {
    position: relative;
    width: 100%;
    margin-top: 40px;

}

.delivery-modal__courier .checkout-form__row {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center
}

.delivery-modal__search--small {
    width: 360px
}

@media screen and (max-width: 946px) {
    .delivery-modal__search--small {
        width: 100%;
        margin-top: 0
    }
}

.delivery-modal__search--small .select {
    position: absolute;
    top: 64px;
    left: 0;
    right: 0;
    opacity: 0;
    z-index: -1;
    pointer-events: none
}

.delivery-modal__search--small .select--active {
    z-index: 1;
    opacity: 1;
    pointer-events: all;
    transition: opacity .25s ease
}

@media screen and (max-width: 946px) {
    .delivery-modal__search--small .select__list {
        max-height: 264px
    }
}

.password-modal {
    align-items: center;
    padding-bottom: 40px;
    row-gap: 0
}

@media screen and (max-width: 946px) {
    .password-modal {
        padding-top: 40px;
        align-items: flex-start
    }
}

.password-modal__form {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 42px
}

@media screen and (max-width: 946px) {
    .password-modal__form {
        width: 100%;
        align-items: flex-start;
        margin-top: 62px
    }
}

.password-modal__btn {
    width: 332px;
    height: 72px;
    margin: 42px 0 24px;
    font-size: 28px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background: #101011;
    border-radius: 8px;
    border: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .password-modal__btn {
        width: 100%;
        height: 44px;
        margin: 62px 0 24px;
        font-size: 20px;
        line-height: 28px;
        border-radius: 8px;
        background: #101011
    }
}

.password-modal__close {
    position: relative;
    color: #333;
    background: none;
    border: none;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .password-modal__close {
        margin: auto;
        font-size: 20px;
        line-height: 28px
    }
}

.password-modal__close:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 2px;
    width: 100%;
    height: 1px;
    background-color: #333
}

@media screen and (max-width: 946px) {
    .password-modal .text-title {
        text-align: start
    }
}

.order-modal {
    width: 1257px;
    padding: 48px;
    margin: auto;
    row-gap: 40px;
    justify-content: flex-start;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 40px;
    border: 2px solid #434345
}

@media screen and (max-width: 1360px) {
    .order-modal {
        width: 863px
    }
}

@media screen and (max-width: 946px) {
    .order-modal {
        width: 100vw;
        padding: 16px 54px 16px 16px;
        top: 0;
        transform: translateY(0) translate(-100%);
        border-radius: 0;
        border: 1px solid #101011
    }
}

.order-modal__header {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 24px
}

@media screen and (max-width: 946px) {
    .order-modal__header {
        margin-bottom: 20px
    }
}

.order-modal__container {
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 40px;
    min-height: 420px;
    max-height: 80vh;
    width: 100%
}

@media screen and (max-width: 946px) {
    .order-modal__container {
        max-height: 100%;
        height: 100vh;
        overflow-x: hidden;
        row-gap: 4px
    }
}

.order-modal__wrapper-list {
    height: 100%;
    overflow-y: auto;
    padding-right: 32px
}

@media screen and (max-width: 1360px) {
    .order-modal__wrapper-list {
        padding-right: 111px
    }
}

@media screen and (max-width: 946px) {
    .order-modal__wrapper-list {
        padding-right: 8px
    }
}

.order-modal__list {
    display: flex;
    align-items: center;
    flex-direction: column;
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .order-modal__list {
        row-gap: 24px
    }
}

.order-modal__total {
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

@media screen and (max-width: 946px) {
    .order-modal__total {
        width: 100%
    }
}

.order-modal__row {
    display: flex;
    align-items: center;
    column-gap: 4px
}

@media screen and (max-width: 946px) {
    .order-modal__row {
        justify-content: space-between
    }
}

.order-modal__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #000
}

.order-modal__footer {
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media screen and (max-width: 946px) {
    .order-modal__footer {
        flex-direction: column;
        row-gap: 24px;
        padding-top: 4px;
        margin-top: auto;
        border-top: 1px solid #dedede
    }
}

.order-modal__btn {
    padding: 20px 36px;
    border: none;
    border-radius: 8px;
    color: #fff;
    background: #101011;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .order-modal__btn {
        padding-block: 8px;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .order-modal__btn--mobile {
        display: none
    }
}

@media screen and (max-width: 946px) {
    .order-modal .order-status {
        display: none
    }
}

.order-modal .modal__close--desktop {
    z-index: 10;
    top: 36px;
    right: 36px
}

@media screen and (max-width: 946px) {
    .order-modal .text-title {
        text-align: left
    }
}

.catalog {
    position: relative;
    display: flex
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .catalog {
        column-gap: 40px;
        flex-wrap: wrap
    }
}

@media screen and (min-width: 946px) and (max-width: 1024px) {
    .catalog {
        flex-wrap: wrap;
        width: 247px;
        max-width: max-content;
        column-gap: 40px;
        row-gap: 0
    }
}

@media screen and (max-width: 946px) {
    .catalog {
        display: none
    }
}

.catalog__item {
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em;
    padding: 10px 20px;
    text-transform: uppercase;
    text-decoration: none;
    color: #000;
    /* transition: .3s ease all; */
}

@media screen and (min-width: 947px) {
    .catalog__item._active {
        font-weight: 600;
    }
}

@media screen and (max-width: 1360px) {
    .catalog__item {
        padding: 6px 0
    }
}

.catalog-wrapper {
    position: absolute;
    top: 40px;
    z-index: -10;
    overflow-y: auto;
    width: 922px;
    /* padding: 16px 100px 16px 20px; */
    padding: 16px 20px;
    border-radius: 24px;
    background: #fff;
    border: 1px solid #101011;
    opacity: 0
}

@media screen and (max-width: 1360px) {
    .catalog-wrapper {
        width: max-content;
        top: 30px
    }
}

@media screen and (max-width: 1088px) {
    .catalog-wrapper {
        top: 70px
    }
}

.catalog-wrapper--visible {
    opacity: 1;
    z-index: 10;
    transition: opacity .25s ease
}

.catalog-category {
    display: none;
    width: 100%;
    justify-content: space-between;
    align-content: center;
    column-gap: 24px
}

.catalog-category--visible {
    display: flex
}

.catalog-category__menu {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    width: 65%
}

.catalog-category__menu .catalog-category__text:hover {
    color: #ff002a
}

@media screen and (max-width: 1360px) {
    .catalog-category__menu {
        width: 100%
    }
}

@media screen and (max-width: 946px) {
    .catalog-category__menu {
        width: 100%;
        row-gap: 24px;
        justify-content: center
    }
}

.catalog-category__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: none;
    color: #333
}

.catalog-category__text--gray {
    color: #bdbdbd
}

.catalog-category__product {
    display: none;
    flex-direction: column;
    width: 35%
}

.catalog-category__product.subcategory--visible {
    display: flex
}

@media screen and (max-width: 1360px) {
    .catalog-category__product.subcategory--visible {
        display: none
    }
}

@media screen and (max-width: 1360px) {
    .catalog-category__product {
        display: none
    }
}

.catalog-category__img {
    width: auto;
    max-height: 200px;
    margin-bottom: auto;
    object-fit: contain
}

.catalog-category__price {
    margin-top: 4px
}

.main-swiper {
    width: 100vw;
    padding: 40px 72px;
    position: relative;
    overflow: hidden
}



@media screen and (min-width: 947px) {
    .main-swiper .swiper-slide {
        cursor: url('data:image/svg+xml,<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="0.8"><rect width="56" height="56" rx="28" fill="white"/><path d="M29.2727 17.1478C28.5611 17.1478 28.0473 17.0028 27.731 16.7129C27.4411 16.3967 27.2962 16.0146 27.2962 15.5666V15.0527C27.2962 14.6047 27.4411 14.2358 27.731 13.9459C28.0473 13.6297 28.5611 13.4715 29.2727 13.4715C29.9842 13.4715 30.4849 13.6297 30.7748 13.9459C31.091 14.2358 31.2491 14.6047 31.2491 15.0527V15.5666C31.2491 16.0146 31.091 16.3967 30.7748 16.7129C30.4849 17.0028 29.9842 17.1478 29.2727 17.1478ZM20.4971 41.0631H28.1658V24.5398H20.4971V22.6028H30.419V41.0631H37.5738V43H20.4971V41.0631Z" fill="black"/></g></svg>') 16 16, auto;
    }

    .main-swiper__btn {
        display: none !important;
    }
}

@media screen and (max-width: 1360px) {
    .main-swiper {
        padding: 48px 32px
    }
}

@media screen and (max-width: 946px) {
    .main-swiper {
        padding: 8px 16px
    }
}

.main-swiper .swiper {
    display: flex;
    justify-content: flex-end
}

.main-swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    max-height: 35vw
}

@media screen and (max-width: 1360px) {
    .main-swiper .swiper-slide img {
        max-height: 45vw
    }
}

@media screen and (max-width: 946px) {
    .main-swiper .swiper-slide img {
        /* min-height: 195px; */
        object-fit: cover
    }
}

@media screen and (max-width: 400px) {
    .main-swiper .swiper-slide img {
        min-height: unset;
        max-height: unset;
        height: auto;
        aspect-ratio: 1.755/1;
    }
}

.main-swiper__navigation {
    position: absolute;
    bottom: 16px;
    z-index: 1;
    background: #fff;
    opacity: .8;
    border-radius: 44px;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    height: 56px;
    width: 176px;
    padding: 12px;
    margin-right: 32px
}

.main-swiper__navigation .counter {
    font-size: 32px;
    line-height: 1;
}

.main-swiper__navigation img {
    width: 36px;
    height: 36px;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .main-swiper__navigation {
        margin-right: 16px;
        padding: 10px 12px
    }
}

@media screen and (max-width: 946px) {
    .main-swiper__navigation {
        height: 52px;
        width: 160px;
        padding: 8px;
        margin-right: 0;
        left: 16px
    }
}

.main-swiper__btn {
    width: 56px;
    height: 56px;
    position: absolute;
    bottom: 16px;
    right: 224px;
    z-index: 1;
    opacity: .8;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 40px;
    font-weight: 300;
    line-height: 30px;
    text-align: center;
    color: #000;
    background: #fff
}

@media screen and (max-width: 1360px) {
    .main-swiper__btn {
        right: 208px
    }
}

@media screen and (max-width: 946px) {
    .main-swiper__btn {
        right: 20px;
        width: 52px;
        height: 52px
    }
}

.filters {
    display: flex;
    flex-direction: column;
    row-gap: 24px
}

@media screen and (max-width: 1360px) {
    .filters {
        row-gap: 20px
    }
}

@media screen and (max-width: 946px) {
    .filters {
        row-gap: 24px
    }
}

.filters__options-wrapper {
    margin-top: 16px
}

.filters__options-wrapper:first-child {
    margin-top: 0
}

.filters__group-title {
    display: flex;
    align-items: center;
    gap: 8px
}

.filters__group--active .filters__group-title {
    margin-bottom: 12px
}

.filters__group--active .filters__title {
    color: #ff002a
}

.filters__group--active .filters__icon {
    transform: none;
    transition: transform .25s ease
}

.filters__group--active .filters__list {
    position: relative;
    height: max-content;
    z-index: 1;
    opacity: 1;
    transform: translateY(0);
    transition: all .3s ease
}

.filters__title {
    display: flex;
    align-items: center;
    column-gap: 8px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #000;
    cursor: pointer
}

.filters__icon {
    width: 10px;
    height: 8px;
    transform: rotate(180deg);
    transition: transform .25s ease
}

.filters__list {
    position: absolute;
    z-index: -1;
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    height: 0;
    padding-left: 8px;
    opacity: 0;
    transform: translateY(-20%)
}

.filters__list--empty {
    row-gap: 12px;
    padding-left: 0
}

.filters__list--empty .filters__subtitle {
    cursor: pointer
}

.filters__options {
    display: flex;
    flex-direction: column
}

.filters__subtitle {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011
}

.filters__option {
    max-width: fit-content;
    text-align: left;
    margin-top: 4px;
    padding: 2px 4px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011;
    border: 1px solid #dedede;
    background: none;
    border-radius: 4px;
    cursor: pointer;
    transition: border .25s ease
}

@media screen and (max-width: 946px) {
    .filters__option {
        margin-top: 8px
    }
}

.filters__option--active {
    border: 1px solid #101011
}

.filters__option--disabled {
    pointer-events: none;
    border-color: #dedede;
    color: #dedede
}

.filters__option:hover {
    border: 1px solid #101011
}

.filters__single--active .filters__title {
    color: #ff002a
}

.filter-items {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px
}

@media screen and (max-width: 1360px) {
    .filter-items {
        margin-top: 24px
    }
}

@media screen and (max-width: 946px) {
    .filter-items {
        flex-wrap: wrap;
        margin-top: 16px
    }
}

.filter-items__text {
    cursor: pointer;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011
}

.filter-items__tag {
    display: flex;
    align-items: center;
    column-gap: 8px
}

.filter-items__close {
    border: none;
    background: none;
    cursor: pointer
}

.filter-items__btn {
    padding: 8px 12px;
    background: none;
    border-radius: 4px;
    border: 1px solid #eb5757;
    cursor: pointer
}

.product-info {
    display: flex;
    /* align-items: center; */
    column-gap: 32px;
    margin-bottom: 64px;
    position: relative;
    z-index: 2;
}

@media screen and (max-width: 1360px) {
    .product-info {
        flex-direction: column;
        margin-bottom: 40px;
        padding-inline: 56px
    }
}

@media screen and (max-width: 946px) {
    .product-info {
        padding-inline: 0;
        margin-bottom: 16px
    }
}

.product-info .product-photos {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 50%;
    height: 678px;
    overflow: hidden
}

@media screen and (max-width: 1360px) {
    .product-info .product-photos {
        width: 100%;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .product-info .product-photos {
        margin-bottom: 16px
    }
}

.product-info .product-photos .swiper {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    min-height: 0;
    min-width: 0
}

@media screen and (max-width: 1360px) {
    .product-info .product-photos {
        width: calc(100vw - 176px);
        flex-direction: column-reverse
    }
}

@media screen and (max-width: 946px) {
    .product-info .product-photos {
        width: calc(100vw - 32px);
        height: 372px
    }
}

.product-info .product-photos .product__gallery-navigation {
    display: none
}

.product-info .product-photos .product__gallery-thumbs .swiper-slide img:hover {
    border-radius: 8px;
    border: 1px solid #dedede
}

.product-info .product-photos .product__gallery-thumbs {
    min-width: 80px;
    max-width: 80px;
    height: 50%;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .product-info .product-photos .product__gallery-thumbs {
        min-width: auto;
        max-width: 50%;
        min-height: 80px;
        max-height: 80px;
        height: auto
    }
}

@media screen and (max-width: 946px) {
    .product-info .product-photos .product__gallery-thumbs {
        max-width: 100%
    }
}

.product-info .product-photos .product__gallery-thumbs .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.product-info .product-photos .product__gallery img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .product-info .product-photos .product__gallery img {
        width: 100%;
        height: 100%;
        object-fit: contain
    }
}

.product-info .product-photos .product__gallery-zoom {
    position: absolute;
    top: 16px;
    right: 12px;
    border: none;
    background: none;
    z-index: 1;
    cursor: pointer
}

@media screen and (max-width: 425px) {
    .product-info .product-photos .product__gallery-zoom {
        display: none
    }
}

.product-info .product-photos .product__gallery-zoom img {
    width: 34px;
    height: 33px
}

.product-info .product-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 50%
}

@media screen and (max-width: 1360px) {
    .product-info .product-col {
        width: 100%
    }
}

.product-info .product-details {
    display: grid;
    grid-template-columns: 1fr max-content;
    row-gap: 16px;
    column-gap: 36px
}

.product-info .product-details__col {
    display: flex;
    flex-direction: column;
    row-gap: 16px
}

.product-info .product-details__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 48px
}

@media screen and (max-width: 1360px) {
    .product-info .product-details__footer {
        align-items: flex-start
    }
}

.product-info .product-btn {
    align-self: start;
    max-width: max-content;
    padding: 8px 36px;
    background-color: #101011;
    border: none;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #fff;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .product-info .product-btn {
        font-size: 20px;
        line-height: 28px;
        padding: 8px 36px
    }
}

.product-info .product-btn--mobile {
    display: none;
    margin-top: 16px
}

@media screen and (max-width: 1360px) {
    .product-info .product-btn--desktop {
        display: none
    }

    .product-info .product-btn--mobile {
        display: flex
    }
}

.product-info .product-status {
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

@media screen and (max-width: 1360px) {
    .product-info .product-status {
        flex-direction: row;
        column-gap: 24px
    }
}

@media screen and (max-width: 946px) {
    .product-info .product-status {
        flex-direction: column;
        row-gap: 16px
    }
}

.product-info .product-status--descktop {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 8px 2rem;
}

@media screen and (max-width: 946px) {
    .product-info .product-status--descktop {
        display: none
    }
}

.product-info .product-status--mobile {
    display: none;
    margin-top: 16px
}

@media screen and (max-width: 946px) {
    .product-info .product-status--mobile {
        display: flex
    }
}

.product-info .product-status .product-article,
.product-info .product-status .product-availability__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase
}

.product-info .product-status .product-availability {
    display: flex;
    align-items: center;
    column-gap: 12px
}

.product-info .product-status .product-availability .indicator {
    width: 20px;
    height: 20px;
    background: #45ff63
}

.product-info .product-status .product-availability.ends .indicator {
    background: #d5ee41;
}

.product-info .product-status .product-availability.out-of-stock .indicator {
    background: #ff6b6b;
}

.product-info .product-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .product-info .product-title {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px
    }
}

.product-info .product-description {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .product-info .product-description {
        font-size: 16px;
        line-height: 20px
    }
}

.product-info .product-price .old {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #ff002a
}

.product-info .product-price .current {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .product-info .product-price .current {
        font-size: 32px;
        font-weight: 400;
        line-height: 36px
    }
}

.product-info .product-bonuses p {
    width: 130px
}

@media screen and (min-width: 1400px) {
    .product-info .product-bonuses p {
        width: 100%
    }
}

.product-info .product-bonuses {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1;
    column-gap: 8px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    text-align: left
}

@media screen and (max-width: 946px) {
    .product-info .product-bonuses {
        font-size: 14px;
        line-height: 18px
    }
}

@media screen and (min-width: 1680px) {
    .product-info .product-bonuses {
        justify-content: space-between
    }
}

.product-info .product-bonuses .product__modal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    max-width: 40px;
    min-height: 40px;
    max-height: 40px;
    background: none;
    font-weight: 500;
    color: #101011;
    border-radius: 50%;
    border: 2px solid #101011;
    cursor: pointer
}

@media screen and (max-width: 946px) {
    .product-info .product-bonuses .product__modal-btn {
        min-width: 24px;
        max-width: 24px;
        min-height: 24px;
        max-height: 24px;
        border-width: 1px;
        font-weight: 400
    }
}

.product-info__excerpt {
    font-size: 20px;
    line-height: 28px;
    font-weight: 300;
    margin-top: 40px;
    margin-bottom: 24px
}

@media screen and (max-width: 946px) {
    .product-info__excerpt {
        font-size: 16px;
        line-height: 20px;
        margin-top: 24px
    }
}

.product-info__sticky {
    position: fixed;
    top: 5vh;
    right: 72px;
    z-index: -100;
    width: calc(50% - 56px);
    display: flex;
    justify-items: center;
    align-items: start;
    column-gap: 16px;
    padding: 16px;
    background-color: #fff;
    border: 1px solid #101011;
    border-radius: 16px;
    transition: transform .3s ease, opacity .3s ease;
    transform: translateY(-100%);
    opacity: 0
}

.product-info__sticky .product-title {
    flex: 1
}

.product-info__sticky.shown {
    transform: translateY(0);
    opacity: 1;
    z-index: 1
}

@media screen and (max-width: 1360px) {
    .product-info__sticky {
        display: none
    }
}

.swiper-slide-thumb-active img {
    border-radius: 8px;
    border: 1px solid #101011 !important
}

.instruction {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 32px;
    padding-block: 24px
}

@media screen and (max-width: 1360px) {
    .instruction {
        row-gap: 24px
    }
}

@media screen and (max-width: 946px) {
    .instruction {
        padding-bottom: 0
    }
}

.instruction__row {
    display: flex;
    justify-content: center;
    gap: 24px
}

.instruction__row--single {
    width: 100%;
    display: block;
    padding-top: 24px
}

.instruction__row--single .instruction__img {
    height: 984px;
    max-height: 984px
}

@media screen and (max-width: 1360px) {
    .instruction__row--single .instruction__img {
        height: 528px;
        max-height: 528px
    }
}

@media screen and (max-width: 946px) {
    .instruction__row--single .instruction__img {
        height: 232px;
        max-height: 232px
    }
}

.instruction__row--single .instruction__item {
    min-width: 100%
}

@media screen and (max-width: 1360px) {
    .instruction__row--single {
        padding-top: 40px
    }
}

@media screen and (max-width: 946px) {
    .instruction__row--single {
        display: none
    }
}

.instruction__row--double {
    margin-bottom: 24px;
    max-width: 90%
}

@media screen and (max-width: 1360px) {
    .instruction__row--double {
        display: none
    }
}

@media screen and (max-width: 1360px) {
    .instruction__row {
        flex-wrap: wrap
    }
}

.instruction__item {
    flex: 1
}

.instruction__item--tablet {
    display: none
}

@media screen and (max-width: 1360px) {
    .instruction__item--tablet {
        display: block
    }
}

@media screen and (max-width: 1360px) {
    .instruction__item {
        min-width: 480px;
        max-width: 712px
    }
}

@media screen and (max-width: 946px) {
    .instruction__item {
        min-width: 100%;
        max-width: 100%
    }
}

.instruction__img {
    width: 100%;
    height: 400px;
    object-fit: cover
}

@media screen and (max-width: 946px) {
    .instruction__img {
        height: 232px;
        max-height: 232px
    }
}

.instruction .text-medium {
    margin-top: 16px
}

@media screen and (max-width: 946px) {
    .instruction .text-medium {
        font-size: 14px;
        line-height: 18px
    }
}

.product-properties {
    width: 50%;
    flex: 1;
    padding: 24px;
    border-radius: 24px;
    border: 1px solid #dedede
}

@media screen and (max-width: 768px) {
    .product-properties {
        width: 100%
    }
}

@media screen and (max-width: 946px) {
    .product-properties .text-title {
        font-size: 32px
    }
}

@media screen and (max-width: 768px) {
    .product-properties .text-title {
        font-size: 24px
    }
}

.product-properties .text-medium {
    margin-bottom: 12px
}

@media screen and (max-width: 946px) {
    .product-properties .text-medium {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 768px) {
    .product-properties .text-medium {
        font-size: 16px;
        line-height: 20px
    }
}

.product-properties__item:not(:first-child) {
    margin-top: 20px
}

@media screen and (max-width: 768px) {
    .product-properties__item:not(:first-child) {
        margin-top: 24px
    }
}

.product-properties__value {
    position: relative;
    display: flex;
    gap: 4px;
    width: 100%;
    height: 16px;
    background-color: #efefef;
    border-radius: 16px;
    overflow: hidden
}

.product-properties__value .progreess-bar-value {
    position: absolute;
    top: 0;
    left: 0;
    height: 16px
}

.product-properties__value .progreess-bar-bg {
    width: 100%
}

.product-properties__value--green .progreess-bar-value {
    background: #76f413
}

.product-properties__value--light-green .progreess-bar-value {
    background: #d5f413
}

.product-properties__value--yellow .progreess-bar-value {
    background: #ffea29
}

.product-properties__value--orange .progreess-bar-value {
    background: #ff993b
}

.product-properties__value--red .progreess-bar-value {
    background: #ff5935
}

.cart-total__content {
    display: flex;
    flex-direction: column;
    row-gap: 20px
}

@media screen and (max-width: 946px) {
    .cart-total__content {
        row-gap: 8px
    }

    .cart-total__content--mobile {
        flex-direction: column-reverse;
        row-gap: 24px
    }
}

.cart-total__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #101011
}

.cart-total__row--sale {
    display: none
}

.cart-total__row--sale .cart-total__price {
    color: #2ce249
}

.cart-total__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em
}

.cart-total__price {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px
}

.cart-total__btn {
    width: 300px;
    height: 68px;
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #fff;
    cursor: pointer;
    border: none;
    border-radius: 8px;
    background: #101011
}

@media screen and (max-width: 946px) {
    .cart-total__btn {
        width: 100%;
        height: 60px
    }
}

.cart-total__btn--full {
    width: 100%;
    background: #101011
}

.cart-total__btn--disabled {
    pointer-events: none;
    background: #dedede
}

.delivery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    width: 100%
}

.delivery.hidden {
    display: none
}

@media screen and (max-width: 1360px) {
    .delivery {
        display: flex;
        align-items: flex-start;
        flex-direction: column
    }
}

@media screen and (min-width: 1360px) {
    .delivery {
        display: grid
    }
}

@media screen and (max-width: 946px) {
    .delivery {
        row-gap: 24px
    }
}

.delivery__item {
    flex: 1;
    width: 100%;
    height: 100%
}

.delivery__post {
    display: flex;
    flex-direction: column;
    row-gap: 4px;
    color: #333;
    text-transform: initial
}

.delivery__name {
    font-weight: 500
}

@media screen and (max-width: 946px) {
    .delivery__details {
        font-size: 14px;
        line-height: 18px
    }
}

.delivery__details--light {
    color: #bdbdbd
}

.delivery__details--underline {
    text-decoration: underline
}

.delivery__department {
    display: none;
    column-gap: 12px
}

.delivery .radio-button {
    width: 100%;
    height: 100%;
    padding: 70px 24px
}

@media screen and (max-width: 946px) {
    .delivery .radio-button {
        padding: 53px 8px
    }
}

.delivery .radio-button--selected {
    padding-block: 40px
}

@media screen and (max-width: 946px) {
    .delivery .radio-button--selected {
        padding-block: 24px
    }
}

.delivery .radio-button--selected .delivery__department {
    display: flex
}

.login__title {
    margin-bottom: 40px;
    font-weight: 500
}

@media screen and (max-width: 946px) {
    .login__title {
        margin-bottom: 24px;
        line-height: 24px
    }
}

.login__row {
    display: flex;
    gap: 40px
}

@media screen and (max-width: 1360px) {
    .login__row {
        flex-direction: column
    }
}

@media screen and (max-width: 946px) {
    .login__row {
        row-gap: 24px
    }
}

.login__form {
    width: 50%;
    row-gap: 32px
}

@media screen and (max-width: 1360px) {
    .login__form {
        width: auto;
        padding: 0;
        border: none
    }
}

@media screen and (max-width: 946px) {
    .login__form {
        row-gap: 24px
    }
}

.login__buttons {
    display: flex;
    align-items: center;
    column-gap: 12px;
    margin-top: 8px
}

@media screen and (max-width: 946px) {
    .login__buttons {
        flex-direction: column;
        row-gap: 12px;
        margin-top: 0
    }
}

.login__submit-btn {
    width: 144px;
    height: 44px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    background: #101011;
    color: #fff
}

@media screen and (max-width: 946px) {
    .login__submit-btn {
        width: 100%;
        height: 52px;
        font-size: 20px;
        line-height: 28px
    }
}

.login__modal-btn {
    width: 240px;
    height: 44px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #333333;
    cursor: pointer;
    color: #333
}

@media screen and (max-width: 946px) {
    .login__modal-btn {
        width: 100%;
        height: 52px;
        font-size: 20px;
        line-height: 28px
    }
}

.login__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #000
}

@media screen and (max-width: 946px) {
    .login__text {
        font-size: 14px;
        line-height: 18px
    }
}

.login__google {
    display: flex;
    align-items: center;
    column-gap: 4px;
    width: 112px;
    height: 44px;
    margin-top: 16px;
    padding: 12px 16px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #333333;
    cursor: pointer;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    color: #333;
    text-transform: uppercase
}

.login__google svg {
    width: 16px;
    height: 16px
}

.bonuses {
    display: flex;
    flex-direction: column;
    row-gap: 16px
}

@media screen and (max-width: 946px) {
    .bonuses {
        row-gap: 24px
    }
}

.bonuses__item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 16px;
    border-bottom: 1px solid #dedede
}

@media screen and (max-width: 946px) {
    .bonuses__item {
        flex-direction: column;
        row-gap: 4px;
        padding-bottom: 24px
    }
}

.bonuses__item:last-child {
    padding: 0;
    border: none
}

@media screen and (max-width: 946px) {
    .bonuses__item:last-child {
        padding-bottom: 16px
    }
}

.bonuses__info {
    display: flex;
    align-items: center;
    column-gap: 24px;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    color: #101011
}

@media screen and (max-width: 946px) {
    .bonuses__info {
        flex-flow: column;
        align-items: flex-start;
        row-gap: 4px
    }
}

.bonuses__name {
    letter-spacing: .02em;
    text-transform: uppercase
}

.bonuses__sum {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #2ce249
}

.bonuses__sum--orange {
    color: #f2994a
}

.products__wrapper {
    display: flex;
    column-gap: 40px;
    margin-bottom: 32px
}

@media screen and (max-width: 1360px) {
    .products__wrapper {
        column-gap: 24px
    }
}

@media screen and (max-width: 946px) {
    .products__wrapper {
        padding-right: 0;
        margin-bottom: 16px
    }
}

.products__content {
    border-right: 1px solid #dedede;
    padding-right: 40px;
    width: 100%
}

@media screen and (max-width: 1360px) {
    .products__content {
        padding-right: 24px
    }
}

@media screen and (max-width: 946px) {
    .products__content {
        padding-right: 0;
        border-right: none
    }
}

.products__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    column-gap: 16px
}

.products__header_title h1,
.products__header_title .products__header_count {
    display: inline;
}

@media screen and (max-width: 1360px) {
    .products__header {
        flex-direction: column;
        gap: 24px
    }
}

@media screen and (max-width: 946px) {
    .products__header {
        flex-direction: row
    }
}

.products__icons {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 8px
}

.products__filter-btn {
    display: none
}

@media screen and (max-width: 946px) {
    .products__filter-btn {
        display: block
    }
}

.products__list {
    display: grid;
    gap: 32px;
    margin: 40px 0 32px
}


@media screen and (max-width: 1360px) {
    .products__list {
        grid-template-columns: 1fr 1fr
    }
}

@media screen and (max-width: 946px) {
    .products__list {
        grid-template-columns: 1fr;
        gap: 16px;
        justify-items: center;
        margin: 16px 0
    }
}

.products__filters {
    min-width: 240px
}

@media screen and (min-width: 947px) {
    .products__filters {
        position: sticky;
        top: 0;
        height: max-content;
        max-height: 100dvh;
        overflow-y: auto;
        padding-bottom: 24px;
    }
}

@media screen and (max-width: 946px) {
    .products__filters {
        display: none
    }
}

.products__filters .text-title {
    margin-bottom: 0
}

@media screen and (max-width: 1360px) {
    .products__filters .text-title {
        margin-bottom: 0
    }
}

.product-page__promo {
    display: flex;
    flex-direction: column;
    row-gap: 64px;
    margin-bottom: 64px
}

@media screen and (max-width: 1360px) {
    .product-page__promo {
        margin-bottom: 40px;
        row-gap: 40px
    }
}

@media screen and (max-width: 768px) {
    .product-page__promo {
        margin-bottom: 16px;
        row-gap: 16px
    }
}

.product-page__promo .promo-item {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    column-gap: 32px;
    padding-block: 24px
}

.product-page__promo .promo-item:nth-child(2n) .promo-item__image {
    order: -1
}

@media screen and (max-width: 1360px) {
    .product-page__promo .promo-item .promo-item__image {
        order: -1
    }
}

@media screen and (max-width: 768px) {
    .product-page__promo .promo-item {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        align-items: start;
        row-gap: 24px;
        padding-block: 8px
    }

    .product-page__promo .promo-item .promo-item__image {
        order: -1
    }
}

.product-page__promo .promo-item__title {
    font-size: 48px;
    font-weight: 500;
    line-height: 56px;
    margin-bottom: 32px
}

@media screen and (max-width: 1360px) {
    .product-page__promo .promo-item__title {
        font-size: 36px;
        line-height: 44px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .product-page__promo .promo-item__title {
        font-size: 26px;
        line-height: 32px;
        margin-bottom: 16px
    }
}

.product-page__promo .promo-item__description {
    font-size: 28px;
    font-weight: 300;
    line-height: 40px
}

@media screen and (max-width: 1360px) {
    .product-page__promo .promo-item__description {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 768px) {
    .product-page__promo .promo-item__description {
        font-size: 16px;
        line-height: 20px
    }
}

.product-page__promo .promo-item__image {
    max-height: 512px;
    overflow: hidden;
    border-radius: 24px
}

@media screen and (max-width: 768px) {
    .product-page__promo .promo-item__image {
        max-height: 280px
    }
}

.product-page__promo .promo-item__image img {
    width: 100%
}

.main-brands {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    padding: 16px 72px
}

@media screen and (min-width: 1920px) {
    .main-brands {
        justify-content: space-between
    }
}

@media screen and (max-width: 1360px) {
    .main-brands {
        flex-wrap: wrap;
        gap: 32px;
        padding: 16px 56px
    }
}

@media screen and (max-width: 946px) {
    .main-brands {
        gap: 8px;
        padding: 16px
    }
}

.main-brands__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 calc(20% - 64px);
    min-width: 226px;
    max-width: 348px;
    text-decoration: none;
}

@media screen and (max-width: 1360px) {
    .main-brands__item {
        min-width: 144px;
        max-width: 224px
    }
}

@media screen and (max-width: 946px) {
    .main-brands__item {
        min-width: 134px;
        max-width: 180px
    }
}

.main-brands__img {
    width: 100%;
    height: auto;
    max-height: 280px;
    max-width: 276px;
}

@media screen and (min-width: 1600px) {
    .main-brands__img {
        width: auto
    }
}

@media screen and (max-width: 1360px) {
    .main-brands__img {
        max-height: 268px
    }
}

@media screen and (max-width: 946px) {
    .main-brands__img {
        display: block;
        width: auto;
        max-width: 100%;
        max-height: 134px
    }
}

.main-brands__name {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    color: #000
}

@media screen and (max-width: 946px) {
    .main-brands__name {
        font-size: 14px;
        line-height: 18px;
        text-transform: inherit
    }
}

.main-block {
    display: flex;
    flex-direction: column;
    row-gap: 72px;
    padding: 40px 72px 0
}

@media screen and (max-width: 1360px) {
    .main-block {
        row-gap: 48px;
        padding: 80px 32px 0
    }
}

@media screen and (max-width: 946px) {
    .main-block {
        padding: 52px 0 0;
        row-gap: 52px
    }
}

.main-block__row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 32px
}

@media screen and (min-width: 1920px) {
    .main-block__row {
        justify-content: space-between
    }
}

@media screen and (max-width: 1300px) {
    .main-block__row {
        flex-wrap: wrap
    }
}

@media screen and (max-width: 946px) {
    .main-block__row {
        padding-inline: 16px;
        justify-items: center;
        gap: 16px
    }
}

.main-block__row .product-card {
    flex: 1 1 calc(25% - 96px);
    min-width: 296px;
    max-width: 360px
}

@media screen and (max-width: 1360px) {
    .main-block__products--desktop {
        display: none
    }
}

.main-block .text-title {
    display: block;
    /* margin-bottom: 40px */
}

@media screen and (max-width: 946px) {
    .main-block .text-title {
        /* margin-bottom: 0; */
        text-align: center
    }
}

.category-page .products__wrapper {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .category-page .products__wrapper {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .category-page .products__wrapper {
        padding-inline: 16px
    }
}

.category-page .products__list {
    grid-template-columns: 1fr 1fr 1fr
}

@media screen and (max-width: 1360px) {
    .category-page .products__list {
        grid-template-columns: 1fr 1fr
    }
}

@media screen and (max-width: 946px) {
    .category-page .products__list {
        grid-template-columns: 1fr;
        margin-bottom: 32px
    }
}

@media screen and (min-width: 1600px) {
    .category-page .products__list .product-card {
        max-width: 90%
    }
}

@media screen and (max-width: 1360px) {
    .category-page .products__list .product-card:last-child {
        grid-column: span 2;
        margin: auto
    }
}

@media screen and (max-width: 946px) {
    .category-page .products__list .product-card:last-child {
        grid-column: span 1
    }
}

.category-page .products__list .advice {
    margin: auto;
    grid-column: span 2
}

.product-page {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .product-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .product-page {
        padding-inline: 16px
    }
}

.product-page__description {
    position: relative;
    margin-block: 40px
}

@media screen and (max-width: 1360px) {
    .product-page__description {
        padding: 24px 32px
    }
}

@media screen and (max-width: 1360px) {
    .product-page__description {
        padding: 0
    }
}

.product-page__description--bold {
    font-weight: 600
}

.product-page .text-editor {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
    position: relative
}

@media screen and (max-width: 1360px) {
    .product-page .text-editor {
        row-gap: 24px
    }
}

.product-page .text-editor a {
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
    color: #101011;
    text-decoration: none
}

@media screen and (max-width: 1360px) {
    .product-page .text-editor a {
        border-bottom: 1px dashed #101011
    }
}

.product-page .text-editor a:after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 1px;
    background: repeating-linear-gradient(90deg, #101011 0, #101011 8px, #0000 0, #0000 14px)
}

@media screen and (max-width: 1360px) {
    .product-page .text-editor a:after {
        content: none
    }
}

@media screen and (max-width: 1360px) {
    .product-page__modal {
        row-gap: 32px
    }
}

@media screen and (max-width: 1360px) {
    .product-page__modal {
        row-gap: 16px;
        padding-bottom: 32px
    }
}

.product-page__modal.modal--visible {
    opacity: 1;
    z-index: 10
}

@media screen and (max-width: 1360px) {
    .product-page__modal.modal--visible {
        width: 100%;
        max-width: 344px
    }
}

.product-page__modal-img {
    width: 100%;
    height: 325px;
    object-fit: cover
}

.product-page__modal_content img {
    max-width: 100%;
    width: auto;
    max-height: 325px;
}

.product-page__modal_content p:not(:last-child) {
    margin-bottom: 32px;
}

@media screen and (max-width: 1360px) {
    .product-page__modal-img {
        height: 165px
    }

    .product-page__modal_content p:not(:last-child) {
        margin-bottom: 16px;
    }
}

.product-page__info {
    margin-bottom: 64px
}

@media screen and (max-width: 1360px) {
    .product-page__info {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .product-page__info {
        margin-bottom: 48px
    }
}

.product-page__row {
    display: flex;
    flex-wrap: wrap;
    gap: 64px 32px;
}

@media screen and (max-width: 946px) {
    .product-page__row {
        flex-direction: column;
        gap: 48px
    }
}

.product-page__row .text-title {
    margin-bottom: 24px
}

.product-page__row .product-card {
    min-width: 296px;
    max-width: 360px
}

@media screen and (max-width: 1360px) {
    .product-page__row .product-card {
        min-width: 232px
    }
}

@media screen and (max-width: 1770px) {
    .product-page__row .product-card:nth-child(5) {
        display: none
    }
}

.product-page__characteristics {
    display: flex;
    flex-direction: column;
    flex: 1;
    /* row-gap: 24px */
}

@media screen and (max-width: 1360px) {
    .product-page__characteristics .text-title {
        font-size: 32px
    }
}

@media screen and (max-width: 946px) {
    .product-page__characteristics .text-title {
        font-size: 24px;
        line-height: 28px
    }
}

.product-page__characteristics .characteristics-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1rem;
    line-height: 1.6;
}

@media screen and (max-width: 1360px) {
    .product-page__characteristics .characteristics-item {
        align-items: flex-start
    }
}

/* 
.product-page__characteristics .characteristics-name {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    flex: 1
}

@media screen and (max-width: 946px) {
    .product-page__characteristics .characteristics-name {
        font-size: 16px;
        line-height: 20px
    }
}

.product-page__characteristics .characteristics-value {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px
}

@media screen and (max-width: 946px) {
    .product-page__characteristics .characteristics-value {
        font-size: 16px;
        line-height: 20px
    }
} */

.product-page__characteristics-2 {
    margin-top: 64px
}

.product-page__characteristics table td:last-child {
    text-align: right;
}

/* .product-page__instruction {
    display: flex;
    column-gap: 40px;
    margin-bottom: 64px;
    padding-block: 24px
}

@media screen and (max-width: 1360px) {
    .product-page__instruction {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .product-page__instruction {
        flex-direction: column;
        row-gap: 48px;
        padding-block: 0
    }
} */

.product-page__info .text-container,
.product-page__info .advice {
    width: calc(50% - 16px)
}

@media screen and (max-width: 946px) {

    .product-page__info .text-container,
    .product-page__info .advice {
        width: 100%
    }
}

.product-page__products {
    margin-top: 64px
}

.product-page__products .text-title {
    margin-bottom: 40px
}

@media screen and (max-width: 1360px) {
    .product-page__products .text-title {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1360px) and (min-width: 946px) {
    .product-page__products .product-card__description {
        text-transform: uppercase
    }
}

@media screen and (max-width: 1360px) {
    .product-page__products .product-card:last-child {
        display: none
    }
}

.product-page .breadcrumbs {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.product-page .breadcrumbs .breadcrumbs__item:last-child a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (max-width: 425px) {
    .product-page .breadcrumbs .breadcrumbs__item:last-child {
        max-width: 328px
    }
}

.product-page .text-container {
    align-items: flex-start;
    padding: 0
}

.product-page .text-container h3 {
    font-size: 32px;
    font-weight: 400;
    line-height: 36px;
    text-align: left;
    margin-bottom: 24px
}

@media screen and (max-width: 1360px) {
    .product-page .text-container h3 {
        font-size: 32px;
        line-height: 36px
    }
}

@media screen and (max-width: 946px) {
    .product-page .text-container h3 {
        font-size: 24px;
        line-height: 28px
    }
}

.product-page .text-container ol {
    padding-left: 32px
}

@media screen and (max-width: 1360px) {
    .product-page .text-container ol {
        padding-left: 24px
    }
}

.product-page .text-container li {
    margin-top: 20px
}

@media screen and (max-width: 1360px) {
    .product-page .text-container li {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .product-page .text-container li {
        font-size: 16px;
        line-height: 20px
    }
}

.product-page .text-container li:first-child {
    margin: 0
}

.product-page__videos {
    padding-block: 24px;
    margin-bottom: 64px
}

@media screen and (max-width: 1360px) {
    .product-page__videos {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .product-page__videos {
        margin-bottom: 48px;
        padding-bottom: 0
    }
}

.product-page__videos .videos {
    display: grid;
    grid-template-columns: repeat(auto-fill, calc(50% - 20px));
    column-gap: 40px
}

@media screen and (max-width: 1360px) {
    .product-page__videos .videos {
        grid-template-columns: 1fr
    }
}

.product-page__videos .product-page__video-item {
    height: 446px;
    margin-top: 24px
}

@media screen and (max-width: 1360px) {
    .product-page__videos .product-page__video-item {
        height: 446px
    }
}

@media screen and (max-width: 946px) {
    .product-page__videos .product-page__video-item {
        height: 280px
    }
}

.product-page__videos--full .videos {
    display: grid;
    grid-template-columns: 1fr
}

.product-page__videos--full .product-page__video-item {
    height: 662px;
    margin-top: 24px
}

@media screen and (max-width: 1360px) {
    .product-page__videos--full .product-page__video-item {
        height: 446px
    }
}

@media screen and (max-width: 946px) {
    .product-page__videos--full .product-page__video-item {
        height: 280px
    }
}

.cart-page {
    padding-inline: 72px;
    padding-bottom: 16px
}

@media screen and (max-width: 1360px) {
    .cart-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .cart-page {
        padding-inline: 16px
    }
}

.cart-page--empty .cart-page__content {
    row-gap: 46px
}

@media screen and (max-width: 946px) {
    .cart-page--empty .cart-page__content {
        row-gap: 24px
    }
}

.cart-page__content {
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .cart-page__content {
        row-gap: 24px;
        margin-bottom: 16px
    }
}

.cart-page__row {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 40px;
    padding: 44px 0
}

@media screen and (max-width: 946px) {
    .cart-page__row {
        row-gap: 4px;
        padding: 68px
    }
}

.cart-page__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 296px;
    height: 76px;
    margin: 0 auto;
    border-radius: 108px;
    border: 1px solid #333333;
    text-decoration: none
}

@media screen and (max-width: 946px) {
    .cart-page__btn {
        display: none
    }
}

.cart-page .breadcrumbs {
    padding: 0
}

.account-page {
    padding-inline: 72px;
    padding-bottom: 16px
}

@media screen and (max-width: 1360px) {
    .account-page {
        padding: 0 32px
    }
}

@media screen and (max-width: 946px) {
    .account-page {
        padding: 0 16px
    }
}

.account-page__links {
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin-top: 40px;
    list-style-type: none
}

@media screen and (max-width: 946px) {
    .account-page__links {
        margin-top: 16px
    }
}

.account-page__link {
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: .02em
}

@media screen and (max-width: 946px) {
    .account-page__link {
        font-size: 14px;
        line-height: 18px
    }
}

.account-page__link:first-child {
    padding-right: 16px;
    border-right: 1px solid #101011
}

.account-page__link a {
    color: #bdbdbd;
    pointer-events: none;
    text-transform: uppercase;
    text-decoration: none
}

.account-page__link--active a {
    color: #101011;
    pointer-events: auto
}

.account-page__row {
    display: flex;
    flex-direction: column;
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .account-page__row {
        row-gap: 24px
    }
}

.account-page__title {
    font-weight: 500
}

@media screen and (max-width: 946px) {
    .account-page__title {
        line-height: 24px;
        letter-spacing: normal
    }
}

.account-page__inputs {
    display: flex;
    flex-wrap: wrap;
    gap: 32px
}

@media screen and (max-width: 946px) {
    .account-page__inputs {
        row-gap: 24px
    }
}

.account-page__input {
    position: relative;
    width: max-content
}

@media screen and (max-width: 946px) {
    .account-page__input {
        width: 100%
    }
}

.account-page__input .text-field__input {
    padding-left: 40px
}

.account-page__actions {
    display: flex;
    align-items: center;
    gap: 32px
}

@media screen and (max-width: 1360px) {
    .account-page__actions {
        width: max-content;
        flex-direction: column;
        align-items: flex-start
    }
}

@media screen and (max-width: 946px) {
    .account-page__actions {
        width: 100%;
        row-gap: 24px
    }
}

.account-page__textarea {
    width: 100%;
    min-height: 164px;
    max-height: 164px;
    padding: 16px
}

@media screen and (max-width: 946px) {
    .account-page__textarea {
        padding-block: 12px
    }
}

.account-page__info {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-top: 40px
}

@media screen and (max-width: 946px) {
    .account-page__info {
        row-gap: 16px;
        margin-top: 16px
    }
}

.account-page__btn {
    width: max-content;
    padding: 8px 36px;
    text-decoration: none;
    border-radius: 8px;
    border: none;
    color: #fff;
    background: #101011;
    cursor: pointer;
    transition: .3s ease all;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.account-page__btn_outline {
    cursor: pointer;
    border-radius: 28px;
    border: 1px solid #101011;
    color: #101011;
    background: transparent;
    transition: .3s ease all;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: max-content;
    padding: 11px 24px;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: .3px;
    text-decoration: none;
    text-transform: uppercase;
}

.account-page__inputs .account-page__inputs .account-page__btn_outline {
    width: 360px;
    max-width: 100%;
    height: max-content;
    margin: 24px 0 0;
}

@media (hover:hover) {
    .account-page__btn:hover {
        opacity: 0.9;
    }

    .account-page__btn_outline:hover {
        opacity: 0.7;
    }
}

@media screen and (max-width: 946px) {
    .account-page__btn {
        font-size: 20px;
        line-height: 28px
    }

    .account-page__btn--mobile {
        width: 100%;
        height: 52px
    }

    .account-page__btn_outline {
        padding: 8px 24px;
    }

    .account-page__inputs .account-page__inputs .account-page__btn_outline {
        width: auto;
        margin: 0;
    }
}

.account-page .content-row {
    row-gap: 56px
}

@media screen and (max-width: 946px) {
    .account-page .content-row {
        row-gap: 32px;
        padding: 0 0 32px
    }
}

.account-page--auth .content-row {
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .account-page--auth .content-row {
        row-gap: 24px
    }
}

.account-page--login .login__title {
    display: none
}

.profile-page__header {
    margin-bottom: 64px
}

@media screen and (max-width: 1360px) {
    .profile-page__header {
        margin-bottom: 48px
    }
}

@media screen and (max-width: 946px) {
    .profile-page__header {
        margin-bottom: 16px;
        text-align: center
    }
}

.profile-page__title {
    font-size: 26px;
    font-weight: 500;
    line-height: 32px;
    color: #000
}

@media screen and (max-width: 946px) {
    .profile-page__title {
        font-size: 19px;
        line-height: 24px
    }
}

.profile-page__bonuses {
    font-size: 64px;
    font-weight: 200;
    line-height: 72px;
    color: #000
}

@media screen and (max-width: 946px) {
    .profile-page__bonuses {
        font-size: 48px;
        line-height: 56px;
        padding-bottom: 16px
    }
}

.profile-page__row {
    display: flex;
    gap: 40px
}

@media screen and (max-width: 1360px) {
    .profile-page__row {
        flex-direction: column
    }
}

@media screen and (max-width: 946px) {
    .profile-page__row {
        gap: 32px
    }
}

.profile-page__advice {
    flex: 1
}

.profile-page__advice ol {
    padding-left: 32px
}

.profile-page__advice li {
    margin-top: 16px
}

@media screen and (max-width: 946px) {
    .profile-page__advice li {
        margin-top: 20px
    }
}

@media screen and (max-width: 946px) {
    .profile-page__orders .order-card:first-child {
        margin-top: 24px
    }
}

.profile-page .content {
    padding-top: 24px
}

@media screen and (max-width: 946px) {
    .profile-page .content {
        row-gap: 32px;
        padding-top: 0
    }
}

.profile-page .content-row {
    row-gap: 40px;
    padding: 0 0 0 40px;
    border: none;
    border-left: 1px solid #dedede
}

@media screen and (max-width: 946px) {
    .profile-page .content-row {
        row-gap: 16px;
        border: none;
        padding: 0
    }
}

.profile-page .account-page__btn {
    margin-top: 16px
}

@media screen and (max-width: 946px) {
    .profile-page .account-page__btn {
        margin-top: 8px
    }

    .account-page__inputs .account-page__inputs .account-page__btn {
        width: 100%;
    }
}

.profile-page--bonuses .account-page__title {
    margin-bottom: 24px
}

.results {
    margin-bottom: 20%;
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .results {
        padding: 0 32px
    }
}

@media screen and (max-width: 946px) {
    .results {
        margin-bottom: 40%;
        padding: 0 16px
    }
}

.results__row {
    display: flex;
    flex-direction: column;
    row-gap: 48px
}

@media screen and (max-width: 1360px) {
    .results__row {
        row-gap: 32px
    }
}

.results__img {
    width: 268px;
    height: auto;
    margin: 0 auto
}

.results__text {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: -.02em;
    text-align: center;
    color: #000
}

@media screen and (max-width: 946px) {
    .results__text {
        font-size: 14px;
        line-height: 18px
    }
}

.results--error {
    margin-bottom: 10%
}

@media screen and (max-width: 946px) {
    .results--error {
        margin-bottom: 15%
    }
}

@media screen and (max-width: 1360px) {
    .results--error .text-large {
        margin-top: 24px
    }
}

.results.products {
    margin-bottom: 0
}

@media screen and (max-width: 1360px) {
    .results .products__wrapper {
        column-gap: 40px
    }
}

.results .products__list {
    grid-template-columns: 1fr 1fr 1fr;
}


@media screen and (max-width: 1360px) {
    .results .products__list {
        grid-template-columns: 1fr 1fr
    }
}

@media screen and (max-width: 946px) {
    .results .products__list {
        grid-template-columns: 1fr
    }
}

@media screen and (max-width: 946px) {
    .results .text-large {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.search-menu__list {
    list-style: none
}

.search-menu__item .menu-link {
    cursor: pointer;
    text-decoration: none;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #000
}

.search-menu__item .menu-link.selected {
    color: #ff002a
}

.search-menu__item:not(:last-child) {
    margin-bottom: 20px
}

.info-page {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .info-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .info-page {
        padding-inline: 16px
    }
}

.info-page__content h1 {
    font-size: 36px;
    font-weight: 500;
    line-height: 44px;
    color: #101011;
    padding-bottom: 48px
}

@media screen and (max-width: 1360px) {
    .info-page__content h1 {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .info-page__content h1 {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        text-align: center;
        padding-bottom: 24px
    }
}

.info-page__content h3,
.info-page__content h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 36px;
    color: #101011;
    padding: 24px 0
}

@media screen and (max-width: 1360px) {

    .info-page__content h3,
    .info-page__content h2 {
        padding-top: 16px
    }
}

@media screen and (max-width: 946px) {

    .info-page__content h3,
    .info-page__content h2 {
        font-size: 19px;
        font-weight: 500;
        line-height: 24px;
        padding-top: 8px
    }
}

.info-page__content a {
    font-size: 28px;
    font-weight: 300;
    line-height: 40px;
}

.info-page__content p {
    font-size: 28px;
    font-weight: 300;
    line-height: 40px;
    color: #333;
    padding-bottom: 24px
}

.info-page__content ul,
.info-page__content ol {
    padding-left: 1.5rem;
    padding-bottom: 24px;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 300;
    color: #333;
}

.info-page__content li:not(:last-child) {
    margin-bottom: 0.5em;
}

@media screen and (max-width: 1360px) {
    .info-page__content a {
        font-size: 20px;
        line-height: 28px
    }

    .info-page__content p {
        font-size: 20px;
        line-height: 28px
    }

    .info-page__content ul,
    .info-page__content ol {
        font-size: 20px;
    }
}

@media screen and (max-width: 946px) {
    .info-page__content a {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }

    .info-page__content p {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }

    .info-page__content ul,
    .info-page__content ol {
        font-size: 16px;
    }
}



.info-page__content img {
    width: 100%;
    height: auto;
    max-height: 70vh;
    padding-bottom: 48px
}

@media screen and (max-width: 1360px) {
    .info-page__content img {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .info-page__content img {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 946px) {
    .info-page .content {
        flex-direction: column-reverse
    }
}

@media screen and (max-width: 946px) {
    .info-page .content-row {
        padding-right: 0;
        padding-top: 32px
    }
}

.blog-page {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .blog-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .blog-page {
        padding-inline: 16px
    }
}

.blog-page__title {
    font-size: 36px;
    font-weight: 500;
    line-height: 44px;
    color: #101011;
    padding-bottom: 48px
}

.blog-page__title span {
    display: inline;
    font-size: 36px;
    font-weight: 500;
    line-height: 44px;
    color: #101011
}

@media screen and (max-width: 1360px) {
    .blog-page__title {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .blog-page__title {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        text-align: center;
        padding-bottom: 32px
    }

    .blog-page__title span {
        display: none
    }
}

.blog-page__aside {
    display: flex;
    flex-direction: column;
    row-gap: 40px
}

@media screen and (max-width: 946px) {
    .blog-page__aside {
        row-gap: 24px
    }
}

.blog-page__links {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style-type: none
}

@media screen and (max-width: 946px) {
    .blog-page__links {
        gap: 16px
    }
}

.blog-page__link {
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    text-transform: uppercase
}

.blog-page__link a {
    color: #101011;
    text-decoration: none
}

.blog-page__link--active a {
    color: #ff002a
}

.blog-page__article {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-bottom: 48px
}

@media screen and (max-width: 1360px) {
    .blog-page__article {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 946px) {
    .blog-page__article {
        margin-bottom: 32px;
        row-gap: 12px
    }
}

.blog-page__article h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 1;
    color: #101011
}

@media screen and (max-width: 1360px) {
    .blog-page__article h2 {
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .blog-page__article h2 {
        font-size: 19px;
        font-weight: 500;
        line-height: 24px
    }
}

.blog-page__article p {
    font-size: 20px;
    font-weight: 300;
    line-height: 28px;
    color: #333
}

@media screen and (max-width: 1360px) {
    .blog-page__article p {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .blog-page__article p {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.blog-page__article img {
    width: 100%;
    height: auto;
    max-height: 70vh
}

.blog-page__article a {
    position: relative;
    width: max-content;
    font-size: 28px;
    font-weight: 300;
    line-height: 40px;
    color: #2561fa;
    text-decoration: none
}

@media screen and (max-width: 1360px) {
    .blog-page__article a {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .blog-page__article a {
        font-size: 16px;
        font-weight: 300;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.blog-page__article a:after {
    content: url(/images/link-arrow.svg);
    position: absolute;
    top: -3px;
    right: -20px;
    height: 17px;
    width: 12px
}

@media screen and (max-width: 1360px) {
    .blog-page__article a:after {
        top: -1px;
        transform: scale(.9)
    }
}

@media screen and (max-width: 946px) {
    .blog-page__article a:after {
        top: 1px;
        right: -16px;
        transform: scale(.7)
    }
}

@media screen and (max-width: 946px) {
    .blog-page .content-row {
        padding-right: 0;
        padding-top: 8px
    }
}

.blog-page .content-aside {
    row-gap: 80px
}

@media screen and (max-width: 1360px) {
    .blog-page .content-aside {
        min-width: 240px;
        max-width: 240px
    }
}

@media screen and (max-width: 946px) {
    .blog-page .content-aside {
        position: relative;
        row-gap: 32px;
        max-width: max-content;
        margin-block: 32px
    }
}

@media screen and (max-width: 1360px) {
    .blog-page .content-aside .text-title {
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .blog-page .content-aside .text-title {
        margin-bottom: 0
    }
}

.blog-page .content-aside .article-card__text {
    margin-bottom: 0
}

@media screen and (max-width: 946px) {
    .blog-page .content-aside .article-card__text {
        font-size: 16px;
        line-height: 20px
    }
}

.article-page {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .article-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .article-page {
        padding-inline: 16px
    }
}

.article-page__content {
    padding-inline: 64px
}

@media screen and (max-width: 1360px) {
    .article-page__content {
        padding: 0
    }
}

.article-page__row {
    display: flex;
    flex-direction: column;
    row-gap: 32px
}

@media screen and (max-width: 946px) {
    .article-page__row {
        row-gap: 24px
    }
}

.article-page__row .text-title {
    padding-top: 16px
}

.article-page__articles {
    display: flex;
    justify-content: space-between;
    column-gap: 40px
}

@media screen and (max-width: 946px) {
    .article-page__articles {
        flex-direction: column;
        row-gap: 24px
    }
}

@media screen and (max-width: 1360px) {
    .article-page__articles .article-card {
        flex-direction: column
    }
}

@media screen and (max-width: 946px) {
    .article-page__articles .article-card {
        flex-direction: row
    }

    .article-page__articles .article-card:last-child {
        display: none
    }
}

.article-page__articles .article-card__img {
    min-width: 160px;
    max-width: 160px;
    height: 160px
}

@media screen and (max-width: 946px) {
    .article-page__articles .article-card__img {
        min-width: 88px;
        max-width: 88px;
        height: 88px
    }
}

@media screen and (max-width: 946px) {
    .article {
        padding-top: 8px
    }
}

.article h1 {
    font-size: 48px;
    font-weight: 500;
    line-height: 56px;
    color: #101011;
    text-align: center;
    padding-bottom: 48px
}

@media screen and (max-width: 1360px) {
    .article h1 {
        font-size: 36px;
        line-height: 44px;
        text-align: left;
        padding-bottom: 32px
    }
}

@media screen and (max-width: 946px) {
    .article h1 {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        padding-bottom: 16px
    }
}

.article h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 36px;
    color: #101011;
    padding: 16px 0 32px
}

@media screen and (max-width: 946px) {
    .article h2 {
        font-size: 19px;
        font-weight: 500;
        line-height: 24px;
        padding: 8px 0 16px
    }
}

.article p {
    font-size: 28px;
    font-weight: 300;
    line-height: 40px;
    color: #333;
    padding-bottom: 32px
}

@media screen and (max-width: 946px) {
    .article p {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em;
        padding-bottom: 16px
    }
}

.article img {
    display: block;
    width: 80%;
    height: auto;
    margin: 0 auto 48px
}

.article .sn-figure img {
    display: block;
    width: 80% !important;
    height: auto;
    margin: 0 auto 48px
}

@media screen and (max-width: 1360px) {
    .article img {
        width: 100%
    }

    .article .sn-figure img {
        width: 100% !important;
    }
}

@media screen and (max-width: 946px) {
    .article img {
        margin-bottom: 24px
    }
}

/* .article img:first-child {
    width: 100%;
    margin-bottom: 32px
} */

.article .sn-figure img:first-child {
    width: 100%;
    margin-bottom: 0;
}

.article .sn-figure {
    margin-bottom: 32px;
}

.sn-figure .sn-caption {
    font-weight: 300;
    font-size: 20px;
    line-height: 28px;
    margin-top: 24px;
}

@media screen and (max-width: 946px) {
    /* .article img:first-child, .article .sn-figure {
        margin-bottom: 16px
    } */

    .article .sn-figure {
        margin-bottom: 16px
    }

    .article .sn-figure img:first-child {
        width: 100%;
        margin-bottom: 0;
    }

    .sn-figure .sn-caption {
        margin-top: 8px;
        font-size: 12px;
        line-height: 16px;
        letter-spacing: -.02em;
    }
}

.article-page__content .article_image:first-child {
    width: 100%;
    margin-bottom: 32px
}

.article-page__content .article_title {
    font-size: 48px;
    font-weight: 500;
    line-height: 56px;
    color: #101011;
    text-align: center;
    padding-bottom: 48px;
}

.article-page__products {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid #DEDEDE;
    border-radius: 24px;
    padding: 32px;
    margin-bottom: 32px;
}

.article-page__products .text-title {
    font-size: 32px;
    font-weight: 400;
    line-height: 36px;
    color: #000;
    padding-bottom: 0;
}

.article-page__products-wrapper {
    display: flex;
    justify-content: center;
    gap: 32px;
}

.article-page__products-wrapper .product-card {
    min-width: 296px;
    max-width: 360px;
}

@media screen and (max-width: 946px) {
    .article-page__products-wrapper .product-card {
        min-width: 232px;
        max-width: 360px;
    }
}

@media screen and (max-width: 1360px) {
    .article-page__content .article_title {
        font-size: 36px;
        line-height: 44px;
        text-align: left;
        padding-bottom: 32px
    }
}

@media screen and (max-width: 946px) {
    .article-page__content .article_title {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        padding-bottom: 16px
    }

    .article-page__content .article_image:first-child {
        margin-bottom: 16px
    }

    .article-page__products .text-title {
        font-size: 24px;
        line-height: 28px;
    }

    .article-page__products-wrapper {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }
}

.brand-page {
    padding-inline: 72px
}

@media screen and (max-width: 1360px) {
    .brand-page {
        padding-inline: 32px
    }
}

@media screen and (max-width: 946px) {
    .brand-page {
        padding-inline: 16px
    }
}

.brand-page__header {
    display: flex;
    align-items: flex-start;
    column-gap: 16px;
    margin-bottom: 16px;
}

@media screen and (max-width: 946px) {
    .brand-page__header {
        margin-bottom: 16px
    }
}

.brand-page__info {
    display: flex;
    flex-direction: column;
    row-gap: 32px
}

@media screen and (max-width: 1360px) {
    .brand-page__info .text-title {
        display: none
    }
}

@media screen and (max-width: 1360px) {
    .brand-page__info .text-large {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 946px) {
    .brand-page__info .text-large {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -.02em
    }
}

.brand-page__logo {
    width: 335px;
    height: auto;
    /* height: 240px */
}

.brand-page__logo--tablet {
    display: none
}

@media screen and (max-width: 1360px) {
    .brand-page__logo--tablet {
        display: block;
        margin: 0 auto 24px
    }
}

@media screen and (max-width: 946px) {
    .brand-page__logo--tablet {
        width: 156px;
        height: auto;
        margin: 0 auto 16px
    }
}

@media screen and (max-width: 1360px) {
    .brand-page__logo--desktop {
        display: none
    }
}

.brand-page__row {
    display: none
}

@media screen and (max-width: 946px) {
    .brand-page__row {
        display: flex;
        column-gap: 16px;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 16px
    }
}

.brand-page__brands {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    list-style-type: none
}

.brand-page__filters {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 8px
}

.brand-page__products {
    display: flex;
    justify-content: center;
    gap: 32px;
    flex-wrap: wrap
}

@media screen and (min-width: 1728px) {
    .brand-page__products {
        column-gap: 0
    }
}

@media screen and (max-width: 1600px) {
    .brand-page__products {
        display: grid;
        grid-template-columns: 1fr 1fr;
        justify-items: center
    }
}

@media screen and (max-width: 946px) {
    .brand-page__products {
        grid-template-columns: 1fr;
        row-gap: 16px
    }
}

@media screen and (min-width: 1728px) {
    .brand-page__products .product-card {
        width: 25%
    }
}

@media screen and (min-width: 1728px) {
    .brand-page__products .product-card__info {
        width: 90%
    }
}

.brand-page__aside {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    list-style-type: none
}

.brand-page__link {
    width: max-content;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    letter-spacing: .02em;
    border-bottom: 1px solid #101011
}

.brand-page__link a {
    text-transform: uppercase;
    text-decoration: none;
    color: #101011
}

@media screen and (max-width: 1360px) and (min-width: 946px) {
    .brand-page .breadcrumbs {
        margin-bottom: 0
    }
}

.brand-page .filter-items {
    margin: 40px 0
}

@media screen and (max-width: 1360px) {
    .brand-page .filter-items {
        margin: 24px 0
    }
}

@media screen and (max-width: 946px) {
    .brand-page .filter-items {
        margin: 16px 0
    }
}

.brand-page .content {
    column-gap: 80px
}

@media screen and (max-width: 1360px) {
    .brand-page .content {
        column-gap: 40px
    }
}

.brand-page .content-aside {
    min-width: 240px;
    max-width: 240px;
    row-gap: 80px;
    max-height: 1000px;
    overflow-y: auto;
}

@media screen and (max-width: 946px) {
    .brand-page .content-aside--desktop {
        display: none
    }
}

@media screen and (max-width: 1360px) {
    .brand-page .content-aside .text-title {
        font-size: 24px;
        line-height: 28px
    }
}

* {
    margin: 0;
    padding: 0;
    outline: none;
    box-sizing: border-box;
    font-family: IBM Plex Mono, monospace;
    -webkit-tap-highlight-color: transparent
}

body {
    overflow-x: hidden;
    background: #fff
}

ul {
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0
}

/*      brand page       */

.filter-header {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.text-field .text-field__label-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}
    .text-field .text-field__label-wrapper ._icon{
        position: relative;
        width: 20px;
        height: 20px;
    }
        .text-field .text-field__label-wrapper ._icon#enter_birthday{
            cursor: pointer;
        }
        .text-field .text-field__label-wrapper  ._icon svg{
            width: 100%;
            display: block;
        }
        .text-field .text-field__label-wrapper ._icon._notification ._info {
            position: absolute;
            top: -7px;
            right: -6px;
            width: 12px;
            height: 12px;
        }

.birthday-modal .account-modal__text{
    width: 100%;
    font-size: 20px;
}
    .birthday-modal .account-modal__text ._red{
        color: #FF002A; 
    }

@media screen and (max-width: 768px) {
    .birthday-modal .account-modal__text{
        font-size: 16px;
    }
}

/* CALENDAR */

.calendar_list {
    display: flex;
    gap: 48px;
    padding-bottom: 16px;
}

.calendar_item {
    position: relative;
}

.calendar_item_list:after,
.calendar_item_list:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: #58C7F7;
}

.calendar_item_list:before {
    top: 76px;
}
.calendar_item_list:after {
    top: 115px;
}

.calendar_item_list .blur {
    position: absolute;
    left: 0;
    width: 100%;
    height: 28px;
    background-color: rgba(255, 255, 255, .8);
}

.calendar_item_list .blur._top {
    top: 0;
}
.calendar_item_list .blur._bottom {
    bottom: 0;
}

.calendar_item_list_wrap {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-color: unset;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    height: 190px;
    scroll-behavior: smooth;
    transition: scroll-top 0.2s ease-in-out;
}


.calendar_item_list_item {
    user-select: none;
    cursor: pointer;
    height: 38px;
    border-radius: 8px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    transition: all .3s ease;
    scroll-snap-align: center;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    color: #B0B0B0;
    padding: 8px 4px;
}

/* @media screen and (max-width: 800px) {
    .calendar_item_list_item {
        padding: 20px 10px;
    }
} */

.calendar_item.day .calendar_item_list_item {
    text-align: left;
}

.calendar_item.year .calendar_item_list_item {
    text-align: right;
}

.calendar_item_list_item:first-child,
.calendar_item_list_item:last-child {
    height: 39px;
    padding: 0;
}

.calendar_item_list_item._active {
    color: #101011;
}
.header-buttons .button[data-count="0"] .button-icon{
    display: none;
}


/* skeletons */

.skeleton__card {
    overflow: hidden;
    width: 100%;
    height: 360px;
    background-color: #fff
}

@media screen and (min-width: 1920px) {
    .skeleton__card {
        height: 448px
    }
}

@media screen and (max-width: 1024px) {
    .skeleton__card {
        height: 272px
    }
}

@media screen and (max-width: 768px) {
    .skeleton__card {
        height: 296px
    }
}

@media screen and (max-width: 424px) {
    .skeleton__card {
        height: 288px
    }
}

.skeleton__image-placeholder {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / .7;
    background-color: #ededed
}


.skeleton__wrapper-text {
    padding: 12px 10px
}

@media screen and (min-width: 1920px) {
    .skeleton__wrapper-text {
        padding: 20px 10px
    }
}

.skeleton__text-placeholder {
    position: relative;
    background-color: #dedede;
    height: 20px;
    margin: 0 auto 8px
}

@media screen and (min-width: 1920px) {
    .skeleton__text-placeholder {
        height: 24px;
        margin-bottom: 12px
    }
}

.skeleton__text-placeholder:last-child {
    width: 70%;
    background-color: #ededed
}

.skeleton__image-placeholder:after, .skeleton__text-placeholder:after, .skeleton__sort-title:after, .skeleton__sort-text:after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #fff0, #ffffff76, #fff0);
    animation: loading 2s infinite
}

@keyframes loading {
    0% {
        left: -100%
    }
    to {
        left: 100%
    }
}



/*      cabinet      */

@media screen and (min-width:947px) {
    
    .scroll-modal{
        display: block;
        max-height: 95dvh;
        overflow: unset;
    }
        .scroll-modal .login{
            overflow-y: auto;
            max-height: calc(95dvh - 80px);
            width: calc(100% - 40px);
            margin-inline: auto;
        }
            .scroll-modal .login::-webkit-scrollbar {
                width: 4px;
            }
            .scroll-modal .login::-webkit-scrollbar-track {
                background: transparent;
                border: none;
            }
            .scroll-modal .login::-webkit-scrollbar-button {
                display: none;
                height: 0;
                width: 0;
            }
            .scroll-modal .login::-webkit-scrollbar-thumb {
                background-color: #333;
                border-radius: 6px;
            }
            .scroll-modal .login_wrap{
                width: 360px;
                max-width: 100%;
                margin-inline: auto;
            }
}

.soc-notice{
    position: absolute;
    z-index: 9;
    top: calc(100% + 16px);
    right: 0;
    width: 412px;
    transition: .25s ease all;
    background: #fff;
    border-radius: 24px;
    border: 1px solid #101011;
    padding: 16px;
    opacity: 0;
    visibility: hidden;
}
    .soc-notice._active{
        opacity: 1;
        visibility: visible;
    }
    .soc-notice__description{
        display: flex;
        flex-direction: column;
        gap: 12px;
        font-size: 16px;
    }

@media screen and (min-width: 947px){
    .soc-notice__close{
        display: none;
    }
}
@media screen and (max-width: 946px){
    .soc-notice{
        padding: 32px 24px 24px;
    }
    .soc-notice__close{
        display: block;
        width: 32px;
        height: 32px;
        top: 12px;
        right: 12px;
    }
}
@media screen and (max-width: 444px){
    .soc-notice{
        width: 100%;
    }
}
.list-modal a{
    cursor: pointer;
}

.auth-modal .or{
    margin: 24px 0;
    text-align: center;
}

.auth-modal__socials{
    margin: 24px 0 0;
}
    .auth-modal__socials-list{
        display: flex;
        gap: 16px;
    }
    .auth-modal__socials-list .button-social{
        width: max-content;
    }

.auth-modal form .text-field:not(:last-child){
    margin-bottom: 16px;
}

.auth-modal .password-modal__close{
    width: max-content;
    margin: 8px auto;
}
.auth-modal .account-page__btn{
    margin: 16px 0;
    width: 100%;
}

[data-id="registration-modal"] .account-page__btn {
    margin-top: 24px;
}

.password-field__toggle{
    user-select: none;
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    height: 22px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 300;
    letter-spacing: .2px;
    text-transform: uppercase;
}
    .password-field__toggle span + span{
        display: none;
    }
    .password-field__toggle._active span{
        display: none;
    }
        .password-field__toggle._active span + span{
            display: block;
        }

.auth-modal .privacy-text{
    font-size: 14px;
    margin-top: 6px;
}
    .auth-modal .privacy-text a{
        color: #000;
    }

.message.error {
    font-size: 14px;
    color: #eb5757;
}

._modal_success{
    width: 100%;
    margin-bottom: 16px;
}

.code-inputs{
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin: 24px 0;
}
    .code-inputs .code-input{
        width: 64px;
        height: 64px;
        border: 1px solid #333;
        border-radius: 16px;
        font-size: 36px;
        font-weight: 500;
        line-height: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        color: #101011;
    }
        .code-inputs .code-input::placeholder{
            color: #DEDEDE;
        }
        .code-inputs .code-input:focus::placeholder,
        .code-inputs .code-input:active::placeholder{
            opacity: 0;
            visibility: hidden;
        }

@media screen and (max-width: 946px) {
    .code-inputs{
        gap: 8px;
        margin: 0;
    }
        .code-inputs .code-input{
            width: 52px;
            height: 52px;
            font-size: 28px;
        }
}

.text-field-button{
    cursor: pointer;
    border: none;
    background: none;
    color: #2561fa;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    font-size: 14px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: .2px;
    
}

.account_link_notifications{
    border: 1px solid #DEDEDE;
    border-radius: 24px;
    display: flex;
    gap: 24px;
    padding: 24px 24px 32px;
    margin-top: 24px;
}
    .account_link_notifications_ico{
        font-size: 28px;
        white-space: nowrap;
    }
    .account_link_notifications_text{
        font-size: 20px;
        font-weight: 300;
    }
        .account_link_notifications_text span{
            font-weight: 500;
        }

@media screen and (max-width: 768px) {

    .account_link_notifications{
        gap: 16px;
        padding: 16px 8px 24px;
        margin-top: 0;
    }
        .account_link_notifications_ico{
            font-size: 14px;
        }
        .account_link_notifications_text{
            font-size: 14px;
        }
}
/* product page */

.product-page__characteristics table{
    max-width: 100%;
}
@media screen and (min-width: 769px) {
    .product-properties,
    .product-page__characteristics{
        width: calc(50% - 16px);
        flex: unset;
    }
}




/* info pages */

.cooperation-advantages__item{
    display: flex;
    gap: 8px;
}
    .info-page__content .cooperation-advantages__img{
        width: 60px;
        min-width: 60px;
    }

.info-page__content .cooperation-type__icon{
    display: inline-block;
    width: 60px;
    min-width: 60px;
}





/*      brand page       */

.brand-categories{
    flex-direction: column;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 24px 0 0;
}






/*              CHECKOUT PAGE              */ 

.checkout-form.content-row{
    padding-right: 0;
    border: none;
}
.account-page__link[data-modal]{
    cursor: pointer;
}
.checkbox__text.checkbox__text__small{
    font-size: 16px;
}

.checkout-total__privacy{
    font-size: 14px;
}
.checkout-total__privacy-link{
    color: inherit;
}

.delivery-modal__courier .input-city {
    display: none !important;
}

.checkout-success .order-confirmation__link{
    transition: .3s ease all;
    color: #101011;
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

@media (hover:hover){
    .checkout-success .order-confirmation__link:hover{
        color: #ff002a;
    }
}

/*          END    CHECKOUT PAGE              */


.brand-product {
    /* display: flex;
    flex-direction: column; */
    flex-grow: 1;
}


.brand-content {
    /* display: flex;
    flex-direction: row;
    column-gap: 40px; */
    flex-grow: 1;
}

.brand-page_products {
    display: grid;
    gap: 32px;
    margin: 40px 0 32px;
    grid-template-columns: 1fr 1fr 1fr;
}

@media screen and (max-width: 1360px) {
    .brand-page_products {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 946px) {
    .brand-page_products {
        grid-template-columns: 1fr;
        margin-bottom: 32px;
    }
}

@media screen and (max-width: 946px) {
    .brand-page_products {
        grid-template-columns: 1fr;
        gap: 16px;
        justify-items: center;
        margin: 16px 0;
    }
}


.brand-content .content-aside {
    max-height: 100dvh;
    overflow-y: auto;
    padding-bottom: 24px;
}

.brand-header-sorting {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-width: 1360px) {
    .brand-header-sorting {
        flex-direction: column;
        gap: 24px;
    }
}

@media screen and (max-width: 946px) {
    .brand-header-sorting {
        justify-content: space-between;
        flex-direction: row;
    }
        .brand-header-sorting .products__icons{
            margin-left: auto;
        }

    .sort--desktop {
        display: none;
    }
}




/* homepage */

.main-block__title a{
    color: #000;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: .3s ease all;
}
    .main-block__title a:hover {
        color: #ff002a;
    }

.main-block__products .product-card__label{
    display: none !important;
}

.product-card__btn,
.product-info .product-btn,
.cart-total__btn.cart-total__btn--full,
.cart-total__btn,
.basket-modal__btn{
    transition: .3s ease all;
}
@media (hover:hover) {
    .product-card__btn:hover,
    .product-info .product-btn:hover,
    .cart-total__btn.cart-total__btn--full:hover,
    .cart-total__btn:hover,
    .basket-modal__btn:hover{
        opacity: 0.9!important;
    }
}

/* END homepage */



/*              category                */

.category-page[data-category="new"] .product-card__label ._new{
    display: none !important;
}
.category-page[data-category="hit"] .product-card__label ._hit{
    display: none !important;
}

.category-page{
    margin-top: 80px;
}

.category_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 24px;
}
    .category_top .breadcrumbs {
        padding: 0;
        margin: 0;
    }

@media screen and (max-width: 1360px) {
    .category-page{
        margin-top: 72px;
    }
}
@media screen and (max-width: 946px) {
    .category-page{
        margin-top: 16px;
    }
    .category_top{
        margin-bottom: 16px;
    }
}

.product-card._sold{
    opacity: 0.4;
}

/*              END category                */


.page_contacts_map {
    margin-top: 36px;
}
.page_contacts_map iframe{
    height: 560px;
}


/*      fix container big screen     */

/* @media screen and (min-width: 2145px) {

    .header-tape,
    .header-main {
        max-width: 2144px;
        margin-inline: auto;
    }
    .main-swiper,
    .main-brands,
    .main-block,
    .category-page .products__wrapper,
    .product-page,
    .brand-page,
    .results,
    .cart-page,
    .info-page,
    .account-page
    {
        max-width: 2000px;
        margin-inline: auto;
        padding-inline: 0;
    }
    .text-container {
        max-width: 1872px;
        margin-inline: auto;
        padding-inline: 0;
    }
    .footer__container,
    .footer__tagline {
        max-width: 1872px;
        margin-inline: auto;
    }
} */


/*      END fix container big screen     */
/* .card-timer {
    top: 8px;
    left: 8px;
    border-radius: 3px;
    border: 1px solid #4dcc8c;
    z-index: 2;
}

.product-page-tab-content .card-timer {
    position: initial;
}

@media screen and (min-width: 1920px) {
    .card-timer {
        top: 18px;
        left: 6px;
        border-radius: 4px
    }

    .product-page-tab-content .card-timer {
        position: initial;
    }
}

.card-timer__title {
    padding: 1px 4px;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
    color: #fff;
    background: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .card-timer__title {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .card-timer__title {
        padding-block: 2px;
        font-size: 10px;
        line-height: 12px
    }
}

.card-timer__value {
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    border-radius: 0 0 3px 3px;
    text-align: center;
    color: #4dcc8c;
    background: #ffffffe5
}

@media screen and (min-width: 1920px) {
    .card-timer__value {
        padding-block: 2px;
        border-radius: 0 0 4px 4px;
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 1024px) {
    .card-timer__value {
        font-size: 8px;
        line-height: 14px
    }
}

.card-timer--hidden {
    display: none
} */


/* NEW TIMER */
.card-timer {
    border: 2px solid #DEDEDE;
    border-radius: 10px;
    z-index: 2;
    background-color: #2561FA;
}

.product-page-tab-content .card-timer {
    position: initial;
}

.card-timer .card-timer__title {
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    color: #fff;
    padding: 0px 8px;
}

.card-timer .card-timer__value {
    font-weight: 300;
    font-size: 20px;
    line-height: 28px;
    color: #fff;
    text-align: center;
}

.card-timer--hidden {
    display: none
}

/* @media screen and (max-width: 1024px) {

} */