@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&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;
    overflow: clip;
    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)
    }
}

@font-face {
    font-family: Headline Base;
    font-display: swap;
    src: url(/statics/cdl4/fonts/PPRightGrotesk-WideMedium.woff) format("woff"), url(/statics/cdl4/fonts/PPRightGrotesk-WideMedium.woff2) format("woff2");
    font-weight: 700
}

.content-phone {
    color: #151514;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .content-phone {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .content-phone {
        font-size: 11px;
        line-height: 18px
    }
}

@media screen and (max-width: 1023px) {
    .content-phone {
        display: none
    }
}

.section-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 40px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .section-title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .section-title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .section-title {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .section-title {
        font-size: 18px;
        line-height: 24px;
        min-width: 226px
    }
}

.section-list {
    padding-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .section-list {
        padding-bottom: 48px
    }
}

@media screen and (max-width: 1359px) {
    .section-list {
        padding-bottom: 32px
    }
}

.page-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 40px;
    font-weight: 500;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .page-title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1360px) {
    .page-title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .page-title {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .page-title {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 724px) {
    .page-title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (min-width: 1920px) {
    .results-title {
        font-size: 56px;
        line-height: 72px
    }
}

.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 0 32px
}

@media screen and (min-width: 1920px) {
    .page-header {
        padding: 48px 0 32px
    }
}

@media screen and (max-width: 1024px) {
    .page-header {
        padding: 32px 0 16px
    }
}

@media screen and (max-width: 768px) {
    .page-header {
        padding: 32px 0 16px
    }
}

.tab-pane {
    position: relative;
    display: none;
    padding-right: 40px;
    min-width: 712px;
    max-width: 712px
}

@media screen and (min-width: 1920px) {
    .tab-pane {
        padding-right: 0;
        min-width: auto;
        max-width: none
    }
}

@media screen and (max-width: 1024px) {
    .tab-pane {
        padding-right: 32px;
        min-width: auto;
        max-width: none
    }
}

@media screen and (max-width: 768px) {
    .tab-pane {
        padding-right: 0
    }
}

.tab-pane.active {
    display: block
}

.menu-user {
    position: relative
}

.m-1 {
    margin: 8px
}

.mt-1 {
    margin-top: 8px
}

.mr-1 {
    margin-right: 8px
}

.mb-1 {
    margin-bottom: 8px
}

.ml-1 {
    margin-left: 8px
}

.my-1 {
    margin-top: 8px;
    margin-bottom: 8px
}

.mx-1 {
    margin-left: 8px;
    margin-right: 8px
}

.m-2 {
    margin: 16px
}

.mt-2 {
    margin-top: 16px
}

.mr-2 {
    margin-right: 16px
}

.mb-2 {
    margin-bottom: 16px
}

.ml-2 {
    margin-left: 16px
}

.my-2 {
    margin-top: 16px;
    margin-bottom: 16px
}

.mx-2 {
    margin-left: 16px;
    margin-right: 16px
}

.m-3 {
    margin: 24px
}

.mt-3 {
    margin-top: 24px
}

.mr-3 {
    margin-right: 24px
}

.mb-3 {
    margin-bottom: 24px
}

.ml-3 {
    margin-left: 24px
}

.my-3 {
    margin-top: 24px;
    margin-bottom: 24px
}

.mx-3 {
    margin-left: 24px;
    margin-right: 24px
}

.m-4 {
    margin: 32px
}

.mt-4 {
    margin-top: 32px
}

.mr-4 {
    margin-right: 32px
}

.mb-4 {
    margin-bottom: 32px
}

.ml-4 {
    margin-left: 32px
}

.my-4 {
    margin-top: 32px;
    margin-bottom: 32px
}

.mx-4 {
    margin-left: 32px;
    margin-right: 32px
}

.m-5 {
    margin: 40px
}

.mt-5 {
    margin-top: 40px
}

.mr-5 {
    margin-right: 40px
}

.mb-5 {
    margin-bottom: 40px
}

.ml-5 {
    margin-left: 40px
}

.my-5 {
    margin-top: 40px;
    margin-bottom: 40px
}

.mx-5 {
    margin-left: 40px;
    margin-right: 40px
}

.m-6 {
    margin: 48px
}

.mt-6 {
    margin-top: 48px
}

.mr-6 {
    margin-right: 48px
}

.mb-6 {
    margin-bottom: 48px
}

.ml-6 {
    margin-left: 48px
}

.my-6 {
    margin-top: 48px;
    margin-bottom: 48px
}

.mx-6 {
    margin-left: 48px;
    margin-right: 48px
}

.m-7 {
    margin: 56px
}

.mt-7 {
    margin-top: 56px
}

.mr-7 {
    margin-right: 56px
}

.mb-7 {
    margin-bottom: 56px
}

.ml-7 {
    margin-left: 56px
}

.my-7 {
    margin-top: 56px;
    margin-bottom: 56px
}

.mx-7 {
    margin-left: 56px;
    margin-right: 56px
}

.m-8 {
    margin: 64px
}

.mt-8 {
    margin-top: 64px
}

.mr-8 {
    margin-right: 64px
}

.mb-8 {
    margin-bottom: 64px
}

.ml-8 {
    margin-left: 64px
}

.my-8 {
    margin-top: 64px;
    margin-bottom: 64px
}

.mx-8 {
    margin-left: 64px;
    margin-right: 64px
}

.p-1 {
    padding: 8px
}

.pt-1 {
    padding-top: 8px
}

.pr-1 {
    padding-right: 8px
}

.pb-1 {
    padding-bottom: 8px
}

.pl-1 {
    padding-left: 8px
}

.py-1 {
    padding-top: 8px;
    padding-bottom: 8px
}

.px-1 {
    padding-left: 8px;
    padding-right: 8px
}

.p-2 {
    padding: 16px
}

.pt-2 {
    padding-top: 16px
}

.pr-2 {
    padding-right: 16px
}

.pb-2 {
    padding-bottom: 16px
}

.pl-2 {
    padding-left: 16px
}

.py-2 {
    padding-top: 16px;
    padding-bottom: 16px
}

.px-2 {
    padding-left: 16px;
    padding-right: 16px
}

.p-3 {
    padding: 24px
}

.pt-3 {
    padding-top: 24px
}

.pr-3 {
    padding-right: 24px
}

.pb-3 {
    padding-bottom: 24px
}

.pl-3 {
    padding-left: 24px
}

.py-3 {
    padding-top: 24px;
    padding-bottom: 24px
}

.px-3 {
    padding-left: 24px;
    padding-right: 24px
}

.p-4 {
    padding: 32px
}

.pt-4 {
    padding-top: 32px
}

.pr-4 {
    padding-right: 32px
}

.pb-4 {
    padding-bottom: 32px
}

.pl-4 {
    padding-left: 32px
}

.py-4 {
    padding-top: 32px;
    padding-bottom: 32px
}

.px-4 {
    padding-left: 32px;
    padding-right: 32px
}

.p-5 {
    padding: 40px
}

.pt-5 {
    padding-top: 40px
}

.pr-5 {
    padding-right: 40px
}

.pb-5 {
    padding-bottom: 40px
}

.pl-5 {
    padding-left: 40px
}

.py-5 {
    padding-top: 40px;
    padding-bottom: 40px
}

.px-5 {
    padding-left: 40px;
    padding-right: 40px
}

.p-6 {
    padding: 48px
}

.pt-6 {
    padding-top: 48px
}

.pr-6 {
    padding-right: 48px
}

.pb-6 {
    padding-bottom: 48px
}

.pl-6 {
    padding-left: 48px
}

.py-6 {
    padding-top: 48px;
    padding-bottom: 48px
}

.px-6 {
    padding-left: 48px;
    padding-right: 48px
}

.p-7 {
    padding: 56px
}

.pt-7 {
    padding-top: 56px
}

.pr-7 {
    padding-right: 56px
}

.pb-7 {
    padding-bottom: 56px
}

.pl-7 {
    padding-left: 56px
}

.py-7 {
    padding-top: 56px;
    padding-bottom: 56px
}

.px-7 {
    padding-left: 56px;
    padding-right: 56px
}

.p-8 {
    padding: 64px
}

.pt-8 {
    padding-top: 64px
}

.pr-8 {
    padding-right: 64px
}

.pb-8 {
    padding-bottom: 64px
}

.pl-8 {
    padding-left: 64px
}

.py-8 {
    padding-top: 64px;
    padding-bottom: 64px
}

.px-8 {
    padding-left: 64px;
    padding-right: 64px
}

.fz-1 {
    font-size: 8px
}

.fz-2 {
    font-size: 16px
}

.fz-3 {
    font-size: 24px
}

.fz-4 {
    font-size: 32px
}

.fz-5 {
    font-size: 40px
}

.fz-6 {
    font-size: 48px
}

.fz-7 {
    font-size: 56px
}

.fz-8 {
    font-size: 64px
}

.lh-1 {
    line-height: 8px
}

.lh-2 {
    line-height: 16px
}

.lh-3 {
    line-height: 24px
}

.lh-4 {
    line-height: 32px
}

.lh-5 {
    line-height: 40px
}

.lh-6 {
    line-height: 48px
}

.lh-7 {
    line-height: 56px
}

.lh-8 {
    line-height: 64px
}

.container {
    width: 100%
}

.container--no-gutters [class^=col] {
    margin-right: 0
}

.row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    align-self: stretch
}

@media screen and (max-width: 1359px) {
    .row {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .row {
        gap: 12px
    }
}

.va-center {
    align-items: center
}

.va-top {
    align-items: flex-start
}

.va-bottom {
    align-items: flex-end
}

.ha-center {
    justify-content: center
}

.ha-left {
    justify-content: flex-start
}

.ha-right {
    justify-content: flex-end
}

.ha-between {
    justify-content: space-between
}

.ha-around {
    justify-content: space-around
}

.col-1 {
    flex: 0 0 auto;
    width: calc(8.3333333333%)
}

.col-2 {
    flex: 0 0 auto;
    width: calc(16.6666666667%)
}

.col-3 {
    flex: 0 0 auto;
    width: 25%
}

.col-4 {
    flex: 0 0 auto;
    width: calc(33.3333333333%)
}

.col-5 {
    flex: 0 0 auto;
    width: calc(41.6666666667%)
}

.col-6 {
    flex: 0 0 auto;
    width: 50%
}

.col-7 {
    flex: 0 0 auto;
    width: calc(58.3333333333%)
}

.col-8 {
    flex: 0 0 auto;
    width: calc(66.6666666667%)
}

.col-9 {
    flex: 0 0 auto;
    width: 75%
}

.col-10 {
    flex: 0 0 auto;
    width: calc(83.3333333333%)
}

.col-11 {
    flex: 0 0 auto;
    width: calc(91.6666666667%)
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

.offset-0 {
    margin-left: 0
}

.offset-1 {
    margin-left: 8.3333333333%
}

.offset-2 {
    margin-left: 16.6666666667%
}

.offset-3 {
    margin-left: 25%
}

.offset-4 {
    margin-left: 33.3333333333%
}

.offset-5 {
    margin-left: 41.6666666667%
}

.offset-6 {
    margin-left: 50%
}

.offset-7 {
    margin-left: 58.3333333333%
}

.offset-8 {
    margin-left: 66.6666666667%
}

.offset-9 {
    margin-left: 75%
}

.offset-10 {
    margin-left: 83.3333333333%
}

.offset-11 {
    margin-left: 91.6666666667%
}

.offset-12 {
    margin-left: 100%
}

@media screen and (min-width: 1920px) {
    .header-logo {
        width: 220px;
        height: 30px
    }
}

@media screen and (max-width: 1359px) {
    .header-logo {
        width: 118px;
        height: 16px
    }
}

@media screen and (max-width: 723px) {
    .header-logo {
        width: 101px;
        height: 14px
    }
}

.sticky-header {
    position: sticky;
    z-index: 55;
    top: 0
}

.header {
    position: relative;
    display: flex;
    width: 100%;
    padding: 24px 40px;
    align-items: center;
    gap: 28px;
    border-top: 1px solid #dedede;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .header {
        max-height: 144px;
        padding: 40px 80px;
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .header {
        padding: 20px 32px;
        gap: 20px
    }
}

@media screen and (max-width: 1023px) {
    .header {
        padding: 20px 24px;
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .header {
        padding: 12px 16px;
        gap: 12px
    }
}

.header-bottom-line {
    margin-top: 8px
}

@media screen and (max-width: 1023px) {
    .header-bottom-line {
        margin: 0
    }
}

.header-top-line {
    gap: 28px
}

@media screen and (min-width: 1920px) {
    .header-top-line {
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .header-top-line {
        gap: 20px
    }
}

@media screen and (max-width: 1023px) {
    .header-top-line {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .header-top-line {
        gap: 12px
    }
}

.header-right {
    gap: 28px;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .header-right {
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .header-right {
        gap: 20px
    }
}

.header-info {
    display: flex;
    align-items: center
}

@media screen and (max-width: 1023px) {
    .header-info {
        width: max-content
    }
}

.header-phone {
    color: #151514
}

@media screen and (min-width: 1920px) {
    .header-phone {
        font-size: 22px;
        line-height: 28px
    }
}

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

.header .containar-logo {
    display: flex;
    align-items: center;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .header .header-bottom-line {
        margin-top: 16px
    }
}

.header .header-catalog__prev--mobile,
.header .header-close-catalog--mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .header .header-close-catalog--mobile {
        display: none
    }

    .header .header-close-catalog--mobile.active {
        display: block;
        padding: 0 8px
    }

    .header .header-catalog__prev--mobile {
        display: none
    }

    .header .header-catalog__prev--mobile.active {
        display: block;
        padding: 0 8px
    }
}

.header-menu {
    position: relative;
    padding-left: 32px
}

@media screen and (min-width: 1920px) {
    .header-menu {
        padding-left: 40px
    }
}

@media screen and (max-width: 1359px) {
    .header-menu {
        padding-left: 24px
    }
}

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

.header-menu:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 24px;
    background-color: #dedede
}

.header-menu--mobile {
    display: none;
    position: relative;
    padding-left: 0
}

.header-menu--mobile .header-menu__current {
    display: flex;
    align-items: center
}

.header-menu--mobile .header-menu__current-text {
    margin-right: 8px;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    text-decoration: none;
    color: #151514
}

.header-menu--mobile .header-menu__list {
    width: 112px;
    display: flex;
    flex-direction: column;
    position: absolute;
    z-index: -10;
    right: 0;
    margin-top: 8px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 4px 8px #0000001a;
    opacity: 0;
    transition: opacity .25s ease
}

.header-menu--mobile .header-menu__list--active {
    z-index: 55;
    opacity: 1
}

.header-menu--mobile .header-menu__list-item {
    padding: 12px 16px;
    border-bottom: 1px solid #dedede;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    text-decoration: none;
    color: #151514
}

.header-menu--mobile .header-menu__list-item:last-child {
    border-bottom: none
}

@media screen and (max-width: 1023px) {
    .header-menu--mobile {
        display: block
    }
}

.header-menu__item {
    display: inline-block;
    padding: 12px 8px;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    text-decoration: none;
    color: #151514
}

.header-menu__item--active {
    color: #888
}

@media screen and (min-width: 1920px) {
    .header-menu__item {
        padding: 16px;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .header-menu__item {
        font-size: 10px;
        line-height: 12px;
        padding: 8px;
        margin: 0
    }
}

.header-languages {
    position: relative
}

@media screen and (min-width: 1920px) {
    .header-languages {
        margin-right: 40px
    }
}

@media screen and (max-width: 1359px) {
    .header-languages {
        margin-right: 24px
    }
}

.header-languages__current {
    display: flex;
    align-items: center;
    border: 1px solid transparent;
    border-bottom: 0;
    padding: 4px 4px 5px;
    cursor: pointer;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .header-languages__current {
        padding: 4px 6px 5px
    }
}

@media screen and (max-width: 1023px) {
    .header-languages__current {
        padding: 4px 4px 0
    }
}

@media screen and (min-width: 1920px) {
    .header-languages__current img {
        transform: scale(1.8);
        margin-left: 4px
    }
}

.header-languages__current-value {
    margin-right: 2px;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .header-languages__current-value {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .header-languages__current-value {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    .header-languages__current-value {
        font-size: 13px;
        line-height: 16px
    }
}

.header-languages__list {
    position: absolute;
    z-index: -2;
    width: 100%;
    padding: 12px 4px 4px;
    opacity: 0;
    background: #fff;
    border: 1px solid #dedede;
    border-top: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    transform: translateY(-1px);
    transition: opacity .25s ease
}

@media screen and (max-width: 1359px) {
    .header-languages__list {
        padding: 6px 4px 4px
    }
}

@media screen and (max-width: 1023px) {
    .header-languages__list {
        padding: 10px 4px 4px
    }
}

.header-languages__list:before {
    content: "";
    position: absolute;
    top: calc(100% - 30px);
    width: calc(100% - 8px);
    height: 1px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .header-languages__list:before {
        top: calc(100% - 38px)
    }
}

@media screen and (max-width: 1359px) {
    .header-languages__list:before {
        top: calc(100% - 22px)
    }
}

@media screen and (max-width: 1023px) {
    .header-languages__list:before {
        top: calc(100% - 26px)
    }
}

.header-languages__list-item {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #151514;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .header-languages__list-item {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .header-languages__list-item {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    .header-languages__list-item {
        font-size: 13px;
        line-height: 16px
    }
}

.header-languages--active .header-languages__current {
    background: #fff;
    border-color: #dedede;
    border-radius: 3px 3px 0 0
}

.header-languages--active .header-languages__list {
    opacity: 1;
    z-index: 2
}

.header-languages--active img {
    transform: rotate(180deg)
}

@media screen and (min-width: 1920px) {
    .header-languages--active img {
        transform: rotate(180deg) scale(1.8);
        margin-left: 4px
    }
}

.header-catalog__button {
    display: flex;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .header-catalog__button {
        padding: 14px 24px;
        max-height: 52px;
        font-size: 22px;
        width: max-content
    }
}

@media screen and (max-width: 1359px) {
    .header-catalog__button {
        gap: 8px;
        font-size: 12px;
        font-weight: 600;
        line-height: 18px;
        min-width: 97px;
        max-height: 30px
    }
}

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

.header-catalog__button__prev {
    display: none
}

@media screen and (max-width: 1023px) {
    .header-catalog__button__prev {
        display: block
    }
}

.header-catalog__button-icon {
    gap: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease-out;
    -webkit-user-select: none;
    user-select: none
}

@media screen and (min-width: 1920px) {
    .header-catalog__button-icon {
        gap: 14px
    }
}

.header-catalog__button-icon .burger {
    display: block;
    width: 18px;
    height: 13px
}

@media screen and (min-width: 1920px) {
    .header-catalog__button-icon .burger {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .header-catalog__button-icon .burger {
        width: 12px;
        height: 12px
    }
}

.header-catalog__button-icon .burger--mobile {
    display: none
}

.header-catalog__button-icon .catalog-close-icon {
    display: none;
    width: 18px;
    height: 13px
}

@media screen and (min-width: 1920px) {
    .header-catalog__button-icon .catalog-close-icon {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .header-catalog__button-icon .catalog-close-icon {
        width: 12px;
        height: 12px
    }
}

.header-catalog__button-icon.is-open .burger,
.header-catalog__button-icon.is-open .burger--mobile {
    display: none
}

.header-catalog__button-icon.is-open .catalog-close-icon {
    display: block
}

.header-search {
    display: flex;
    align-items: center;
    flex-grow: 1
}

.header-toolbar {
    display: flex;
    align-items: center;
    flex-grow: 0;
    column-gap: 24px;
    background: #fff;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .header-toolbar {
        column-gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .header-toolbar {
        column-gap: 20px
    }
}

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

.header-toolbar__item {
    display: flex;
    cursor: pointer
}

.header-toolbar__user {
    width: max-content;
    height: max-content
}

.header-toolbar__user img {
    width: 23px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .header-toolbar__user img {
        width: 34px;
        height: 36px
    }
}

@media screen and (max-width: 1359px) {
    .header-toolbar__user img {
        width: 17px;
        height: 18px
    }
}

@media screen and (min-width: 1920px) {
    .header-toolbar__user {
        width: 28px;
        height: 30px
    }
}

.header-toolbar__favorites img {
    width: 24px;
    height: 22px
}

@media screen and (min-width: 1920px) {
    .header-toolbar__favorites img {
        width: 36px;
        height: 33px
    }
}

@media screen and (max-width: 1359px) {
    .header-toolbar__favorites img {
        width: 18px;
        height: 16px
    }
}

.header-toolbar__bucket {
    width: max-content;
    height: max-content
}

.header-toolbar__bucket img {
    width: 28px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .header-toolbar__bucket img {
        width: 38px;
        height: 33px
    }
}

@media screen and (max-width: 1359px) {
    .header-toolbar__bucket img {
        width: 21px;
        height: 18px
    }
}

.header-toolbar__bucket-count {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #151514;
    margin-left: 2px;
    visibility: hidden
}

@media screen and (min-width: 1920px) {
    .header-toolbar__bucket-count {
        font-size: 18px
    }
}

.header-toolbar__bucket-count--visible {
    visibility: visible
}

.search-field__button {
    width: 40px;
    height: 26px;
    background-color: #f4f4f4;
    position: absolute;
    right: 8px;
    border-radius: 20px;
    z-index: 55;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .search-field__button {
        width: 62px;
        height: 40px
    }
}

@media screen and (max-width: 723px) {
    .search-field__button {
        width: 43px;
        height: 28px
    }
}

.header-menu__language-item {
    font-weight: 700 !important
}

@media screen and (max-width: 1359px) {
    .header-menu__language-item {
        font-size: 12px !important;
        line-height: 18px !important
    }
}

@media screen and (max-width: 1023px) {
    .header-menu__language-item {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 582px) {
    .header-menu__column {
        display: none !important
    }
}

@media screen and (max-width: 1023px) {
    .search-field--mobile-active {
        position: absolute !important;
        top: 20px;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 55
    }
}

@media screen and (max-width: 723px) {
    .search-field--mobile-active {
        top: 12px
    }
}

.phone-icon {
    display: none
}

@media screen and (max-width: 1023px) {
    .phone-icon {
        display: flex
    }
}

@media screen and (max-width: 582px) {
    .phone-icon {
        display: none
    }
}

.footer {
    background: #fff
}

.footer .footer-menu-container {
    display: flex;
    max-width: 3086px;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch
}

.footer .footer-menu {
    display: flex;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 48px;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu {
        padding: 56px 80px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu {
        display: none
    }
}

.footer .footer-menu__list {
    display: flex;
    flex-direction: column;
    max-width: max-content;
    flex: 1;
    gap: 24px
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu__list {
        gap: 18px
    }
}

.footer .footer-menu__list-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__list-title {
        font-size: 28px;
        line-height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu__list-title {
        color: #151514;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px
    }
}

.footer .footer-menu__list-item {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    text-decoration: none;
    font-weight: 500;
    line-height: 20px;
    color: #494949
}

.footer .footer-menu__list-item:last-child {
    margin-bottom: 0
}

.footer .footer-menu__list-item img {
    margin-right: 8px
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu__list-item img {
        width: 12px;
        height: 12px
    }
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__list-item {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu__list-item {
        color: #494949;
        font-size: 12px;
        font-style: normal;
        line-height: 16px
    }
}

.footer .footer-address {
    max-width: 182px
}

@media screen and (min-width: 1920px) {
    .footer .footer-address {
        max-width: 236px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-address {
        max-width: 156px
    }
}

.footer .footer-phone {
    margin-bottom: 24px
}

@media screen and (max-width: 1023px) {
    .footer .footer-phone {
        margin-bottom: 18px
    }
}

.footer .footer-menu__contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__contacts img {
        width: 16px;
        height: 16px
    }
}

.footer .footer-menu__contacts a {
    display: flex;
    align-items: center
}

.footer .footer-menu__socials {
    display: flex;
    gap: 28px;
    max-width: 208px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 28px;
    row-gap: 12px;
    position: relative;
    margin-top: 16px
}

.footer .footer-menu__socials:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background-color: #dedede;
    transform: translate(-50%)
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__socials:before {
        left: 59%
    }
}

.footer .footer-menu__socials>* {
    flex: 0 0 calc(50% - 14px)
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__socials {
        row-gap: 16px
    }
}

.footer .footer-menu__socials-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    text-decoration: none;
    gap: 6px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .footer .footer-menu__socials-item {
        font-size: 18px;
        line-height: 28px
    }

    .footer .footer-menu__socials-item img {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-menu__socials-item {
        color: #494949;
        font-size: 10px;
        font-style: normal;
        font-weight: 500;
        line-height: 14px;
        gap: 4px
    }

    .footer .footer-menu__socials-item img {
        width: 14px;
        height: 14px
    }
}

@media screen and (max-width: 723px) {
    .footer .footer-menu__socials-item img {
        width: 27px;
        height: 20px
    }
}

.footer .footer-bottom {
    border-top: 1px solid #dedede;
    width: 100%
}

.footer .footer-bottom .container-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.footer .footer-bottom .container-right {
    display: flex;
    width: 240px;
    padding: 2px 8px;
    justify-content: space-between;
    gap: 2px;
    border-radius: 8px;
    border: .5px dashed var(--Text-Grey_3, #888)
}

.footer .footer-bottom .container-right .container-stars {
    display: flex;
    align-items: flex-start
}

.footer .footer-bottom .container-right .container-stars .star {
    width: 24px;
    height: 24px
}

.footer .footer-bottom .container-right .title {
    font-family: Headline Base;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.footer .footer-bottom .footer-copyright {
    font-style: normal;
    font-weight: 300;
    font-size: 12px;
    color: #494949;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .footer .footer-bottom .footer-copyright {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-bottom .footer-copyright {
        font-size: 10px;
        line-height: 16px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 723px) {
    .footer .footer-bottom .footer-copyright {
        margin-bottom: 16px;
        font-size: 12px;
        line-height: 20px
    }
}

.footer .footer-bottom__menu {
    display: flex;
    align-items: center;
    gap: 16px
}

@media screen and (max-width: 723px) {
    .footer .footer-bottom__menu {
        flex-direction: column;
        align-items: start;
        gap: 12px
    }
}

.footer .footer-bottom__menu-item {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none;
    position: relative;
    padding-right: 16px
}

@media screen and (min-width: 1920px) {
    .footer .footer-bottom__menu-item {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 7px
    }
}

@media screen and (max-width: 1023px) {
    .footer .footer-bottom__menu-item {
        color: #151514;
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 5px
    }
}

@media screen and (max-width: 723px) {
    .footer .footer-bottom__menu-item {
        margin: 0
    }
}

.footer .footer-bottom__menu-item:first-child:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 15px;
    background-color: #494949
}

@media screen and (max-width: 723px) {
    .footer .footer-bottom__menu-item:first-child:after {
        display: none
    }
}

.footer .footer-bottom .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 32px
}

@media screen and (max-width: 723px) {
    .footer .footer-bottom .container {
        align-items: start
    }
}

.footer--responsive .footer-menu {
    padding: 40px 48px 48px
}

@media screen and (min-width: 1920px) {
    .footer--responsive .footer-menu {
        padding: 64px 48px 48px
    }
}

@media screen and (max-width: 1359px) {
    .footer--responsive .footer-menu {
        padding-bottom: 32px
    }
}

.footer--responsive .footer-bottom {
    padding: 48px 48px 32px
}

@media screen and (min-width: 1920px) {
    .footer--responsive .footer-bottom {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .footer--responsive .footer-bottom {
        padding: 32px 48px 24px
    }
}

@media screen and (max-width: 1023px) {
    .footer--responsive .footer-bottom {
        padding: 24px 0 0
    }
}

.footer--large {
    padding-bottom: 80px
}

@media screen and (min-width: 1920px) {
    .footer--large {
        padding-bottom: 100px
    }
}

@media screen and (max-width: 1359px) {
    .footer--large {
        padding-bottom: 60px
    }
}

.footer .rating-container {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin-bottom: 2px
}

.footer .rating-container img {
    width: 14px;
    height: 14px
}

@media screen and (min-width: 1920px) {
    .footer .rating-container img {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .footer .rating-container {
        gap: 2px
    }

    .footer .rating-container img {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 723px) {
    .footer .rating-container {
        gap: 4px;
        margin-bottom: 7px
    }

    .footer .rating-container img {
        width: 8px;
        height: 8px
    }
}

@media screen and (max-width: 1023px) {
    .footer {
        padding: 16px;
        margin-bottom: 82px
    }
}

.footer-status-bar {
    display: none;
    column-gap: 24px;
    margin-bottom: 16px
}

@media screen and (max-width: 1023px) {
    .footer-status-bar {
        display: flex;
        justify-content: space-between;
        position: sticky;
        bottom: 0;
        background-color: #fff;
        width: 100%;
        margin: 0;
        left: 0;
        z-index: 15;
        padding: 16px
    }
}

.footer-status-bar__item {
    display: flex;
    flex-direction: column;
    align-items: center
}

.footer-status-bar__item-image {
    display: flex;
    margin-bottom: 2px
}

.footer-status-bar__item-image img {
    object-fit: contain;
    margin-right: 4px
}

.footer-status-bar__item-count {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #151514
}

.footer-status-bar__item-text {
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 12px;
    color: #151514
}

.footer-status-bar__home {
    width: 24px;
    height: 24px
}

.footer-status-bar__home img {
    width: 20px;
    height: 17.5px
}

.footer-status-bar__catalog {
    width: 24px;
    height: 24px
}

.footer-status-bar__catalog img {
    width: 18px;
    height: 18px
}

.footer-status-bar__account {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center
}

.footer-status-bar__account img {
    width: 17px;
    height: 18px
}

.footer-status-bar__favorites {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center
}

.footer-status-bar__favorites img {
    width: 19px;
    height: 18px
}

.footer-status-bar__basket {
    width: 24px;
    height: 24px
}

.footer-status-bar__basket img {
    width: 22px;
    height: 18px
}

.footer-socials--mobile {
    display: none;
    column-gap: 24px;
    margin-top: 16px;
    margin-bottom: 16px
}

@media screen and (max-width: 1023px) {
    .footer-socials--mobile {
        display: flex;
        margin-bottom: 0
    }
}

.footer-menu--mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .footer-menu--mobile {
        display: flex;
        flex-direction: column;
        gap: 28px
    }
}

@media screen and (max-width: 1359px) {
    .footer-menu--mobile .footer-menu__column.visible .footer-menu__list {
        display: flex;
        width: 100%;
        gap: 20px
    }
}

.footer-menu__column {
    position: relative;
    min-width: max-content
}

.footer-menu__column .footer-menu__list {
    display: none;
    position: relative;
    box-shadow: none;
    margin-top: 20px
}

.footer-menu__column .footer-menu__list .footer-menu__list-item {
    font-size: 12px;
    line-height: 14px;
    font-weight: 500;
    padding: 0;
    color: #494949
}

@media screen and (max-width: 1023px) {
    .footer-menu__column .footer-menu__list .footer-menu__list-item {
        max-width: 156px
    }
}

.footer-menu__column .footer-menu__list .footer-menu__list-item.footer-phone {
    margin-bottom: 8px
}

.footer-menu__column .footer-menu__current {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #000
}

.footer-menu__column--contacts .footer-menu__list .footer-menu__list-item {
    display: flex;
    align-items: center
}

[data-footer=footer-btn] {
    display: flex;
    align-items: center;
    cursor: pointer
}

[data-footer=footer-btn] img {
    transition: transform .3s ease
}

[data-footer=footer-column].visible [data-footer=footer-btn] img {
    transform: rotate(180deg)
}

.footer-menu__column--language {
    display: flex;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .footer-menu__column--language {
        gap: 12px
    }
}

.footer-menu__column--language .header-menu__language-item:after {
    background-color: #dedede !important
}

.footer-menu__column--language .footer-menu__language-item {
    position: relative;
    cursor: pointer;
    color: #888;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    padding-right: 8px;
    font-weight: 700
}

@media screen and (min-width: 1920px) {
    .footer-menu__column--language .footer-menu__language-item {
        font-size: 24px;
        line-height: 28px;
        padding-right: 12px
    }
}

.footer-menu__column--language .footer-menu__language-item:after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 14px;
    background-color: #494949
}

@media screen and (min-width: 1920px) {
    .footer-menu__column--language .footer-menu__language-item:after {
        width: 2px;
        height: 20px
    }
}

.footer-menu__column--language .footer-menu__language-item:last-child {
    margin-right: 0;
    padding-right: 0
}

.footer-menu__column--language .footer-menu__language-item:last-child:after {
    display: none
}

.footer-menu__column--language .footer-menu__language-item.active {
    font-weight: 700;
    color: #151514
}

.footer-watch {
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    cursor: pointer;
    color: #4da6cd !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .footer-watch {
        font-size: 20px;
        line-height: 28px
    }

    .footer-watch svg {
        width: 14px;
        height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .footer-watch {
        font-size: 12px;
        line-height: 16px
    }

    .footer-watch svg {
        width: 8px;
        height: 8px
    }
}

@media screen and (max-width: 723px) {
    .footer-watch {
        padding-top: 6px !important
    }
}

.footer-index {
    margin: 0
}

.slider-navigation {
    display: flex;
    align-items: center
}

.slider-navigation .slider-counter {
    margin: 0 12px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (max-width: 1024px) {
    .slider-navigation .slider-counter {
        font-size: 12px;
        line-height: 18px
    }
}

.slider-navigation .slider-prev,
.slider-navigation .slider-next {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: max-content;
    position: relative;
    border: none;
    background: none;
    border-radius: 16px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    overflow: hidden;
    transition: all .25s ease;
    cursor: pointer
}

.button svg {
    margin-right: 8px
}

@media screen and (max-width: 1024px) {
    .button {
        font-size: 12px;
        line-height: 16px
    }
}

.button--xs {
    padding: 4px 8px
}

@media screen and (min-width: 1920px) {
    .button--xs {
        padding: 10px 12px;
        font-size: 22px;
        line-height: 24px
    }
}

.button--sm {
    padding: 8px 12px;
    font-weight: 300
}

@media screen and (min-width: 1920px) {
    .button--sm {
        padding: 12px 16px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .button--sm {
        padding: 8px
    }
}

@media screen and (max-width: 768px) {
    .button--sm {
        padding: 8px;
        font-size: 10px;
        line-height: 12px
    }
}

.button--md {
    padding: 8px 16px
}

@media screen and (max-width: 1024px) {
    .button--md {
        padding: 6px 12px;
        font-size: 12px;
        line-height: 18px
    }

    .button--md svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1024px) and (max-width: 768px) {
    .button--md svg {
        width: 24px;
        height: 24px
    }
}

.button--xl {
    padding: 12px 32px
}

@media screen and (max-width: 1024px) {
    .button--xl {
        padding: 8px 24px;
        font-size: 10px;
        line-height: 12px
    }
}

.button--full {
    width: 100%;
    padding: 12px 0
}

@media screen and (max-width: 1024px) {
    .button--full {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .button--full {
        padding: 12px 0;
        font-size: 15px;
        line-height: 24px
    }
}

.button--outline.button--primary {
    position: relative;
    z-index: 1;
    color: #151514
}

.button--outline.button--primary:hover {
    color: #fff
}

.button--outline.button--primary:hover:after {
    background: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a)
}

@media screen and (max-width: 1024px) {
    .button--outline.button--primary {
        padding: 8px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .button--outline.button--primary {
        font-size: 10px;
        line-height: 12px
    }
}

.button--outline.button--primary:after {
    content: "";
    position: absolute;
    z-index: -1;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    background: #eff6fa;
    border-radius: 3px;
    overflow: hidden;
    transition: background .25s ease
}

.button--outline.button--primary:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a)
}

.button--outline.button--secondary {
    position: relative;
    z-index: 1;
    color: #151514
}

.button--outline.button--secondary:hover {
    color: #fff
}

.button--outline.button--secondary:hover:after {
    background: radial-gradient(100% 308.55% at 0% 0%, #6ddde1, #6480db)
}

.button--outline.button--secondary:after {
    content: "";
    position: absolute;
    z-index: -1;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    background: #eff6fa;
    border-radius: 3px;
    overflow: hidden;
    transition: background .25s ease
}

.button--outline.button--secondary:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    border: 1px solid;
    background: radial-gradient(100% 308.55% at 0% 0%, #6ddde1, #6480db)
}

.button--filled.button--primary {
    position: relative;
    z-index: 1;
    background: radial-gradient(100% 308.55% at 0% 0%, #c04bd4, #dd5a8f);
    color: #fff
}

.button--filled.button--primary:hover:before {
    opacity: 1
}

.button--filled.button--primary:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: radial-gradient(100% 308.55% at 0% 0%, #c539c8, #d7444d);
    opacity: 0;
    transition: opacity .15s ease
}

.button--filled.button--secondary {
    position: relative;
    z-index: 1;
    background: radial-gradient(100% 308.55% at 0% 0%, #6ddde1, #6480db);
    color: #fff
}

.button--filled.button--secondary:hover:before {
    opacity: 1
}

.button--filled.button--secondary:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: radial-gradient(100% 308.55% at 0% 0%, #60b7e9, #645bd3);
    opacity: 0;
    transition: opacity .15s ease
}

.button--favorites {
    width: 48px;
    height: 40px;
    border: 1px solid #dedede;
    border-radius: 3px;
    cursor: pointer
}

.button--favorites svg {
    margin: 0
}

@media screen and (max-width: 1024px) {
    .button--favorites {
        width: 36px;
        height: 32px
    }

    .button--favorites svg {
        width: 18px;
        height: 18px
    }
}

.button--one-click {
    display: flex;
    align-items: center;
    padding: 8px 8px 8px 0;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-decoration-line: underline;
    color: #888
}

@media screen and (max-width: 1024px) {
    .button--one-click {
        font-size: 12px;
        line-height: 18px
    }

    .button--one-click svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 768px) {
    .button--one-click svg {
        width: 24px;
        height: 24px
    }
}

.product-section-bundle {
    display: flex;
    padding: 32px 40px 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
    border-radius: 24px;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .product-section-bundle {
        padding: 56px 40px 24px;
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle {
        padding: 24px 32px 18px;
        min-height: 228px;
        max-height: 228px
    }
}

@media screen and (max-width: 1023px) {
    .product-section-bundle {
        padding: 24px 24px 18px;
        min-height: 224px;
        max-height: 224px;
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle {
        min-height: 100%;
        max-height: 100%;
        gap: 16px
    }
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-image {
        min-width: 120px !important;
        max-width: 120px !important;
        min-height: 109px !important;
        max-height: 109px !important
    }
}

.product-section-bundle .product-card {
    display: flex;
    padding: 32px 40px 32px 16px;
    align-items: center;
    gap: 16px;
    border-radius: 24px;
    border: 2px solid #dedede;
    position: relative;
    max-height: 147px;
    cursor: pointer;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-card {
        min-height: 189px;
        padding: 40px 40px 40px 16px;
        gap: 12px;
        flex: 1 0 0
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-card {
        max-height: 110px
    }
}

@media screen and (max-width: 1023px) {
    .product-section-bundle .product-card {
        gap: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .product-card {
        max-height: 94px;
        gap: 8px
    }
}

.product-section-bundle .product-card .vertical-line {
    display: flex;
    width: 1px !important;
    height: 60px;
    background-color: #dedede;
    flex-shrink: 0
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-card .vertical-line {
        height: 104px
    }
}

.product-section-bundle .product-list {
    display: flex;
    align-items: center;
    gap: 24px;
    align-self: stretch
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-list {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .product-list {
        flex-direction: column
    }
}

.product-section-bundle .product-list .product-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-list .product-title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-list .product-title {
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .product-list .product-title {
        min-width: 132px
    }
}

.product-section-bundle .product-list .product-prices {
    display: flex;
    height: 32px;
    align-items: center;
    gap: 12px
}

.product-section-bundle .product-list .product-prices-new {
    color: #ff3f5f;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-list .product-prices-new {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-list .product-prices-new {
        font-size: 16px
    }
}

.product-section-bundle .product-list .product-prices-old {
    color: #b6b6b6;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    text-decoration: line-through
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-list .product-prices-old {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-list .product-prices-old {
        font-size: 16px
    }
}

.product-section-bundle .bundle-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch
}

@media screen and (max-width: 723px) {
    .product-section-bundle .bundle-info {
        padding-top: 8px
    }
}

.product-section-bundle .bundle-info .bundle-button:hover {
    background: #6cd3ff
}

.product-section-bundle .bundle-info .bundle-button {
    all: unset;
    display: flex;
    padding: 20px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .bundle-info .bundle-button {
        padding: 24px 32px;
        border-radius: 24px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .bundle-info .bundle-button {
        padding: 16px 18px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-section-bundle .bundle-info .bundle-button {
        padding: 14px 16px;
        font-size: 12px;
        line-height: 18px;
        border-radius: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .bundle-info .bundle-button {
        padding: 12px 16px;
        font-size: 10px;
        line-height: 16px
    }
}

.product-section-bundle .bundle-info .bundle-prices {
    display: flex;
    align-items: center;
    gap: 16px
}

@media screen and (max-width: 1023px) {
    .product-section-bundle .bundle-info .bundle-prices {
        flex-direction: column-reverse;
        gap: 0px;
        align-items: flex-end
    }
}

.product-section-bundle .bundle-info .bundle-prices-new {
    color: #ff3f5f;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 32px;
    font-weight: 500;
    line-height: 40px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .bundle-info .bundle-prices-new {
        font-size: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .bundle-info .bundle-prices-new {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-section-bundle .bundle-info .bundle-prices-new {
        font-size: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .bundle-info .bundle-prices-new {
        font-size: 20px;
        line-height: 18px
    }
}

.product-section-bundle .bundle-info .bundle-prices-old {
    color: #cfcfcf;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    text-decoration-line: line-through
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .bundle-info .bundle-prices-old {
        font-size: 28px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .bundle-info .bundle-prices-old {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-section-bundle .bundle-info .bundle-prices-old {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .bundle-info .bundle-prices-old {
        line-height: 16px
    }
}

.product-section-bundle .product-price {
    color: #151514;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-price {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-price {
        font-size: 16px
    }
}

.product-section-bundle .price-product {
    display: flex;
    flex-direction: column;
    gap: 8px
}

@media screen and (max-width: 723px) {
    .product-section-bundle .price-product {
        max-width: 108px
    }
}

.product-section-bundle .product-info {
    display: flex;
    flex-direction: column;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .product-info {
        margin-left: 12px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .product-info {
        gap: 4px
    }
}

.product-section-bundle svg {
    min-width: 28px;
    height: 28px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle svg {
        min-width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle svg {
        display: none
    }
}

.product-section-bundle .mobile-icon {
    display: none
}

@media screen and (max-width: 723px) {
    .product-section-bundle .mobile-icon {
        display: block;
        opacity: .9;
        background: #fff3;
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        position: absolute;
        top: 35%;
        width: 40px;
        height: 40px;
        z-index: 2
    }
}

.product-section-bundle .container-sale {
    display: flex;
    padding: 6px 24px;
    align-items: center;
    gap: 6px;
    position: absolute;
    border-radius: 0 24px;
    background: #ff3f5f;
    right: -2px;
    top: -2px
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .container-sale {
        padding: 6px 16px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle .container-sale {
        padding: 4px 12px
    }
}

.product-section-bundle .container-sale .text-sale {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle .container-sale .text-sale {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle .container-sale .text-sale {
        font-size: 12px;
        line-height: 16px
    }
}

.bundle-slider {
    overflow: hidden;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .bundle-slider {
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1359px) {
    .bundle-slider {
        margin-bottom: 0
    }
}

@media screen and (max-width: 1023px) {
    .bundle-slider {
        margin-bottom: 0
    }
}

.bundle-slider .swiper-wrapper {
    max-width: 911px
}

@media screen and (min-width: 1920px) {
    .bundle-slider .swiper-wrapper {
        max-width: 1320px
    }
}

@media screen and (max-width: 1359px) {
    .bundle-slider .swiper-wrapper {
        max-width: 770px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .bundle-slider .swiper-wrapper {
        margin-bottom: 40px
    }
}

.bundle-slider .swiper-scrollbar {
    margin-top: 4px;
    margin-bottom: 20px
}

.bundle-slider .swiper-scrollbar-drag {
    background: #888 !important
}

.product-card-basket {
    min-width: 323px;
    max-width: 323px;
    height: 112px
}

@media screen and (min-width: 1920px) {
    .product-card-basket {
        min-width: 518px;
        max-width: 518px
    }
}

@media screen and (max-width: 1359px) {
    .product-card-basket {
        min-width: 269px;
        max-width: 269px
    }
}

@media screen and (max-width: 1023px) {
    .product-card-basket {
        min-width: 240px;
        max-width: 240px
    }
}

.product-card-basket .price-product-basket {
    min-width: 175px;
    max-width: 175px;
    gap: 4px;
    align-items: flex-start
}

@media screen and (min-width: 1920px) {
    .product-card-basket .price-product-basket {
        min-width: 306px;
        max-width: 306px;
        gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-card-basket .price-product-basket {
        min-width: 124px;
        max-width: 124px
    }
}

@media screen and (max-width: 1359px) {
    .mobile-icon-basket {
        display: block !important;
        position: absolute;
        top: 25%;
        left: 47%;
        z-index: 2;
        width: 40px !important;
        height: 40px !important
    }
}

@media screen and (max-width: 1023px) {
    .mobile-icon-basket {
        left: 46%
    }
}

.product-section-bundle-basket {
    width: max-content
}

.product-section-bundle-basket .product-list {
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .product-section-bundle-basket .product-list {
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-section-bundle-basket .product-list {
        flex-direction: column
    }
}

@media screen and (max-width: 1359px) {
    .product-section-bundle-basket svg {
        display: none
    }
}

.product-title-basket {
    font-size: 12px !important;
    line-height: 18px !important
}

@media screen and (min-width: 1920px) {
    .product-title-basket {
        font-size: 20px !important;
        line-height: 28px !important
    }
}

.swiper-slide-basket {
    width: max-content !important
}

.container-search-history {
    display: flex;
    flex-direction: column;
    gap: 40px;
    overflow-y: auto;
    scrollbar-width: none;
    min-width: 228px
}

@media screen and (min-width: 1920px) {
    .container-search-history {
        gap: 56px
    }
}

@media screen and (max-width: 1359px) {
    .container-search-history {
        gap: 32px
    }
}

@media screen and (max-width: 1023px) {
    .container-search-history {
        gap: 28px
    }
}

@media screen and (max-width: 1023px) {
    .container-search-history {
        gap: 16px;
        overflow-y: unset
    }
}

.search-field {
    position: relative
}

.search-field__input {
    display: flex;
    height: 42px;
    padding: 8px 8px 8px 12px;
    justify-content: space-between;
    align-items: center;
    flex: 1 0 0;
    border-radius: 20px;
    border: 1px solid #dedede;
    background: #fff;
    width: 100%;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: all .25s ease
}

.search-field__input::placeholder {
    color: #888
}

@media screen and (min-width: 1920px) {
    .search-field__input::placeholder {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1023px) {
    .search-field__input::placeholder {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1920px) {
    .search-field__input {
        border-radius: 32px;
        min-height: 64px;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .search-field__input {
        border-radius: 20px;
        padding: 6px 8px 6px 12px
    }
}

@media screen and (max-width: 1023px) {
    .search-field__input {
        width: 100%;
        z-index: 55;
        max-height: 42px;
        padding: 8px 8px 8px 12px;
        font-weight: 400;
        border-radius: 20px
    }
}

@media screen and (max-width: 723px) {
    .search-field__input {
        max-height: 28px
    }
}

.search-field__icon svg {
    fill: #888;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px
}

@media screen and (min-width: 1920px) {
    .search-field__icon svg {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-field__icon svg {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 723px) {
    .search-field__icon svg {
        width: 14px;
        height: 14px
    }
}

.search-field .search--disabled {
    position: relative;
    font-weight: 400;
    color: #151514;
    font-style: normal;
    font-size: 14px;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .search-field .search--disabled {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .search-field .search--disabled {
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 1023px) {
    .search-field .search--disabled {
        font-size: 14px;
        line-height: 20px;
        min-height: 40px
    }
}

@media screen and (max-width: 723px) {
    .search-field__input--active {
        min-width: 304px !important
    }
}

.select {
    max-width: 264px;
    min-width: 264px
}

@media screen and (min-width: 1920px) {
    .select {
        max-width: 338px;
        min-width: 338px
    }
}

@media screen and (max-width: 1024px) {
    .select {
        max-width: 200px;
        min-width: 200px
    }
}

.select-label {
    margin-bottom: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    .select-label {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1024px) {
    .select-label {
        font-size: 10px;
        line-height: 12px
    }
}

.select.active .select-field__list {
    opacity: 1;
    z-index: 10
}

.select.active .select-field__icon {
    transform: rotate(180deg)
}

.select-field {
    width: 100%;
    display: flex;
    position: relative;
    padding: 8px;
    background: #fff;
    border-radius: 3px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .select-field {
        padding: 16px 12px
    }
}

.select-field__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-user-select: none;
    user-select: none
}

@media screen and (max-width: 1024px) {
    .select-field__icon {
        align-items: unset;
        display: block;
        justify-content: unset;
        width: 14px;
        height: 14px;
        margin-right: 4px
    }

    .select-field__icon svg {
        transform: scale(.7) translateY(-4px)
    }
}

@media screen and (max-width: 768px) {
    .select-field__icon {
        width: 24px;
        margin-right: 0
    }

    .select-field__icon path {
        fill: #b847e1
    }

    .select-field__icon svg {
        transform: scale(1) translateY(0)
    }
}

.select-field__current {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.select-field__value {
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .select-field__value {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .select-field__value {
        font-size: 10px;
        line-height: 12px
    }
}

.select-field__list {
    width: 100%;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: -10;
    opacity: 0;
    background-color: #fff;
    box-shadow: 0 2px 8px -1px #372f321a;
    filter: drop-shadow(0px 0px 2px #f3f3f3);
    border-radius: 3px;
    transition: opacity .25s ease
}

.select-field__list-item {
    padding: 12px 8px;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    background-color: transparent;
    color: #151514;
    cursor: pointer;
    transition: background-color
}

.select-field__list-item:hover {
    background-color: #f0f6fb
}

@media screen and (min-width: 1920px) {
    .select-field__list-item {
        font-size: 18px;
        line-height: 24px
    }
}

.select--disabled {
    pointer-events: none
}

.select--disabled .select-field {
    background: #ededed
}

.select--disabled .select-field__value {
    color: #888
}

.select--disabled .select-field__icon {
    visibility: hidden
}

.select--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    .select--mobile {
        display: block
    }
}

.select--mobile.active .select--mobile-field__list {
    opacity: 1;
    z-index: 10
}

.select--mobile.active .select--mobile-field__icon {
    transform: rotate(180deg)
}

.select--mobile-field {
    min-width: 116px
}

.select--mobile-field__current {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px;
    border: 1px solid #cfcfcf;
    border-radius: 3px
}

.select--mobile-field__icon {
    display: flex
}

.select--mobile-field__value {
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514;
    margin-right: 4px
}

.select--mobile-field__list {
    min-width: max-content;
    opacity: 0;
    z-index: -10;
    position: absolute;
    background: #f9fafb;
    border-radius: 3px
}

@media screen and (max-width: 768px) {
    .select--mobile-field__list {
        font-size: 12px;
        line-height: 16px
    }
}

.select--mobile-field__list-item {
    padding: 8px 4px;
    border-bottom: 1px solid #dedede
}

.select--mobile-field__list-item:last-child {
    border-bottom: none
}

.select-extra-block,
.select-extra-block-weekends {
    position: absolute;
    left: 194px;
    top: 19px;
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

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

    .select-extra-block,
    .select-extra-block-weekends {
        font-size: 20px;
        line-height: 32px;
        left: 300px;
        top: 35px
    }
}

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

    .select-extra-block,
    .select-extra-block-weekends {
        font-size: 12px;
        line-height: 20px;
        left: 153px;
        top: 16px
    }
}

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

    .select-extra-block,
    .select-extra-block-weekends {
        top: 56px;
        min-width: 142px;
        left: 14px;
        font-size: 14px;
        line-height: 20px
    }
}

.select-extra-block-line {
    position: absolute;
    left: 182px;
    top: 21px;
    height: 16px;
    width: 2px;
    background-color: #dedede;
    display: none
}

@media screen and (min-width: 1920px) {
    .select-extra-block-line {
        width: 3px;
        left: 280px;
        top: 43px
    }
}

@media screen and (max-width: 1359px) {
    .select-extra-block-line {
        left: 143px;
        top: 18px
    }
}

@media screen and (max-width: 723px) {
    .select-extra-block-line {
        height: 1px;
        width: 100%;
        left: 0;
        top: 44px
    }
}

.selectable-value-has-extra .select-extra-block-line {
    display: block
}

.select-extra-block-weekends {
    left: 348px
}

@media screen and (min-width: 1920px) {
    .select-extra-block-weekends {
        left: 522px
    }
}

@media screen and (max-width: 1359px) {
    .select-extra-block-weekends {
        left: 285px
    }
}

@media screen and (max-width: 723px) {
    .select-extra-block-weekends {
        display: none
    }
}

.field-error {
    color: #ff3f5f;
    text-overflow: ellipsis;
    position: absolute;
    top: 18px;
    left: 18px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    display: none
}

@media screen and (max-width: 1350px) {
    .field-error {
        font-size: 14px;
        line-height: 16px
    }
}

.field-error.active {
    display: block
}

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

input[type=number] {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    appearance: textfield
}

.text-field__container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border: .5px solid transparent;
    border-radius: 12px;
    max-width: 304px;
    min-width: 304px;
    height: 60px;
    position: relative
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .text-field__container {
        min-height: 80px;
        max-height: 80px;
        height: 80px
    }
}

@media screen and (min-width: 1920px) {
    .text-field__container {
        min-height: 92px;
        max-height: 92px;
        max-width: 432px;
        min-width: 432px
    }
}

@media screen and (max-width: 1359px) {
    .text-field__container {
        max-width: 240px;
        min-width: 240px;
        min-height: 56px;
        max-height: 56px
    }
}

.input-authorization.input-error .text-field__input {
    border-bottom: 1px solid #ff3f5f
}

.container-comment {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .container-comment {
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .container-comment {
        gap: 14px
    }
}

.container-comment .textarea-input {
    padding: 0 !important
}

.container-comment .text-field__input {
    font-weight: 400;
    height: 30px
}

@media screen and (min-width: 1920px) {
    .container-comment .text-field__input {
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .container-comment .text-field__input {
        height: 24px
    }
}

.container-comment .text-field__container {
    min-width: 100%;
    max-width: 100%;
    padding: 24px 24px 20px;
    gap: 8px;
    border-radius: 12px;
    border: .5px solid #dedede;
    background: #f4f4f4;
    min-height: 76px;
    max-height: 76px;
    display: flex;
    justify-content: flex-end
}

@media screen and (min-width: 1920px) {
    .container-comment .text-field__container {
        padding: 40px 32px !important;
        min-height: 130px;
        max-height: 130px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-comment .text-field__container {
        padding: 20px 20px 16px !important;
        min-height: 64px;
        max-height: 64px
    }
}

@media screen and (max-width: 723px) {
    .container-comment .text-field__container {
        padding: 20px 16px !important;
        min-height: 84px;
        max-height: 84px
    }
}

.container-comment .textarea-wrapper {
    min-height: max-content
}

@media screen and (max-width: 723px) {
    .container-comment .textarea-wrapper {
        min-height: 44px
    }
}

.container-comment .textarea-input {
    min-height: 100% !important;
    max-height: 100% !important;
    overflow-y: auto !important
}

.container-comment .text-field__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px
}

@media screen and (min-width: 1920px) {
    .container-comment .text-field__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .container-comment .text-field__title {
        font-size: 18px;
        line-height: 24px
    }
}

.text-field__label {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .text-field__label {
        font-size: 18px;
        line-height: 24px;
        min-width: 222px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .text-field__label {
        top: -10px
    }
}

@media screen and (width: 1360px) {
    .text-field__label {
        top: -10px
    }
}

@media screen and (max-width: 1359px) {
    .text-field__label {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (width: 1360px) {
    .text-field__label.text-field__textarea {
        margin-bottom: 12px !important;
        top: -10px !important
    }
}

@media screen and (width: 1024px) {
    .text-field__label.text-field__textarea {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

.text-field__input {
    width: 100%;
    padding: 32px 18px 12px;
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #dedede;
    border-radius: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    font-weight: 500;
    color: #151514
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .text-field__input {
        padding: 40px 18px 12px
    }
}

@media screen and (min-width: 1920px) {
    .text-field__input {
        font-size: 24px;
        line-height: 38px;
        padding: 40px 0 12px;
        min-width: 224px
    }
}

@media screen and (max-width: 1359px) {
    .text-field__input {
        font-size: 12px;
        line-height: 16px;
        padding-top: 28px
    }
}

textarea.text-field__input {
    max-height: none
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    textarea.text-field__input {
        padding: 32px 18px 12px
    }
}

.text-field__input::placeholder {
    font-weight: 400;
    color: #dedede !important
}

.text-field__description {
    padding: 8px 0;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888
}

@media screen and (max-width: 1024px) {
    .text-field__description {
        font-size: 10px;
        line-height: 12px
    }
}

.text-field__caret {
    display: none;
    position: absolute;
    top: 2px;
    left: 38px;
    width: 1px;
    height: 18px;
    background: #000;
    animation: 1s cursor .05s infinite
}

@media screen and (min-width: 1920px) {
    .text-field__caret {
        top: 3px;
        left: 60px;
        width: 2px;
        height: 30px
    }
}

@media screen and (max-width: 1024px) {
    .text-field__caret {
        top: 1px;
        left: 35px;
        height: 17px
    }
}

@keyframes cursor {
    to {
        z-index: -8
    }
}

.textarea-wrapper {
    display: flex;
    height: max-content;
    position: relative
}

.textarea-wrapper .textarea-input {
    line-height: 20px;
    resize: none;
    overflow: hidden;
    padding: 0
}

@media screen and (min-width: 1920px) {
    .textarea-wrapper .textarea-input {
        line-height: 24px;
        min-height: 40px;
        max-height: 50px
    }
}

@media screen and (max-width: 1359px) {
    .textarea-wrapper .textarea-input {
        line-height: 10px
    }
}

@media screen and (max-width: 723px) {
    .textarea-wrapper .textarea-input {
        line-height: 20px
    }
}

.select-arrow {
    display: flex;
    cursor: pointer;
    transition: transform .2s ease;
    position: absolute;
    right: 18px;
    top: 25px;
    max-height: 10px
}

.text-field__container.active {
    border: .5px solid #58c7f7;
    background-image: url(/resources/images/bg-select-1920.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026
}

@media screen and (max-width: 1359px) {
    .text-field__container.active {
        background-image: url(/resources/images/bg-select-1024.png)
    }
}

@media screen and (max-width: 723px) {
    .text-field__container.active {
        background-image: url(/resources/images/bg-select-360.png)
    }
}

.text-field__container.active .select-arrow {
    transform: rotate(180deg)
}

.radio-button__container {
    margin-bottom: 24px;
    border: 1px solid transparent;
    border-radius: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .radio-button__container {
        border: 1px solid transparent;
        margin-bottom: 16px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .radio-button__container {
        margin-bottom: 18px;
        margin-left: 0;
        border-radius: 14px
    }
}

.radio-button__container:hover {
    border: 1px solid #dedede
}

.radio-button__container .radio-button__loader {
    opacity: 0;
    animation: none
}

@media screen and (max-width: 1024px) {
    .radio-button__container .radio-button__loader {
        width: 16px;
        height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__name {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 768px) {
    .radio-button__container .radio-button__name {
        display: flex;
        gap: 10px;
        align-items: center
    }
}

.radio-button__container.checked {
    border: 1px solid #58c7f7
}

.radio-button__container.checked .radio-button__wrapper {
    padding: 0
}

.radio-button__container.checked .radio-button__content {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .radio-button__container.checked .radio-button__content {
        margin-top: 32px
    }
}

.radio-button__container.checked .radio-button__content .credit-summary-container {
    width: 100%;
    gap: 32px
}

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

.radio-button__container.checked .radio-button__loader {
    width: 24px;
    height: 24px;
    opacity: 1;
    animation: spin 1.5s infinite linear
}

@media screen and (max-width: 1024px) {
    .radio-button__container.checked .radio-button__loader {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 768px) {
    .radio-button__container.checked .radio-button__loader--desktop {
        display: none
    }
}

.radio-button__container.checked .radio-button__loader--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    .radio-button__container.checked .radio-button__loader--mobile {
        display: block
    }
}

.radio-button__container.inactive {
    opacity: .6
}

.radio-button__container .radio-button__content {
    display: none;
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__content {
        margin-top: 0
    }
}

@media screen and (max-width: 1024px) {
    .radio-button__container .radio-button__content {
        margin-top: 8px
    }
}

@media screen and (max-width: 768px) {
    .radio-button__container .radio-button__content {
        margin-top: 16px
    }
}

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

.radio-button__container .radio-button__lable {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 40px;
    font-style: normal;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    font-weight: 500;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__lable {
        padding-left: 56px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .radio-button__container .radio-button__lable {
        padding-left: 34px;
        font-size: 14px;
        line-height: 20px
    }
}

.radio-button__container .radio-button__lable .radio-button__text {
    display: flex;
    flex-direction: column
}

.radio-button__container .radio-button__lable .radio-button__description {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #888;
    margin-top: 8px
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__lable .radio-button__description {
        font-size: 20px;
        line-height: 16px;
        margin-top: 16px
    }
}

@media screen and (max-width: 1359px) {
    .radio-button__container .radio-button__lable .radio-button__description {
        font-size: 12px;
        line-height: 16px;
        margin-top: 4px
    }
}

.radio-button__container .radio-button__icon {
    position: absolute;
    left: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__icon {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .radio-button__container .radio-button__icon {
        width: 18px;
        height: 18px
    }
}

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

.radio-button__container .radio-button__icon:before {
    width: 24px;
    height: 24px;
    background-color: transparent;
    border-radius: 50%;
    border: 2px solid #dedede;
    box-sizing: border-box
}

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__icon:before {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .radio-button__container .radio-button__icon:before {
        width: 20px;
        height: 20px
    }
}

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

@media screen and (min-width: 1920px) {
    .radio-button__container .radio-button__icon:after {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1024px) {
    .radio-button__container .radio-button__icon:after {
        width: 10px;
        height: 10px
    }
}

@media screen and (max-width: 768px) {
    .radio-button__container .radio-button__icon:after {
        width: 12px;
        height: 12px
    }
}

.radio-button__wrapper {
    width: 100%
}

.checkbox-container {
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 24px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .checkbox-container {
        font-size: 22px;
        line-height: 32px;
        padding-left: 30px
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container {
        padding-left: 18px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .checkbox-container {
        padding-left: 24px;
        font-size: 15px;
        line-height: 24px
    }
}

.checkbox-container .checkbox {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0
}

.checkbox-container .checkbox-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    background: #f0f0f0;
    border: 1px solid #dedede;
    border-radius: 3px;
    transition: background .25s ease
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (width: 1360px) {
    .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (min-width: 1920px) {
    .checkbox-container .checkbox-icon {
        width: 22px;
        height: 22px
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container .checkbox-icon {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .checkbox-container .checkbox-icon {
        width: 20px;
        height: 20px
    }
}

.checkbox-container .checkbox-icon img {
    transition: opacity .25s ease;
    opacity: 0
}

@media screen and (min-width: 1920px) {
    .checkbox-container .checkbox-icon img {
        width: 60%
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container .checkbox-icon img {
        width: 80%
    }
}

@media screen and (max-width: 768px) {
    .checkbox-container .checkbox-icon img {
        width: auto
    }
}

.checkbox-container .checkbox:checked~.checkbox-icon {
    background: #4dcc8c;
    border-color: #4dcc8c
}

.checkbox-container .checkbox:checked~.checkbox-icon img {
    opacity: 1
}

.section-order {
    display: flex;
    padding: 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    margin: 0 40px
}

.section-order.hide {
    display: none;
}

@media screen and (min-width: 1920px) {
    .section-order {
        margin: 0 auto;
        padding: 40px 40px 48px;
        gap: 40px;
        width: 1760px
    }
}

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

    .section-order:has(.section-order__empty),
    .section-order--empty {
        height: 708px !important;
        min-height: 708px !important;
        max-height: 708px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        align-self: flex-start !important;
        position: relative !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .section-order {
        margin: 0 auto;
        padding: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px);
        gap: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px);
        width: clamp(100% - 80px, 100% - 80px + (100vw - 1360px) * 1.2143, 1680px);
        max-width: calc(100vw - 80px);
        box-sizing: border-box
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .section-order {
        margin: 0 40px;
        padding: 32px;
        gap: 40px;
        width: calc(100% - 80px);
        box-sizing: border-box
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .section-order {
        margin: 0 clamp(16px, 16px + (100vw - 424px) * .0133, 24px) 0 clamp(16px, 16px + (100vw - 424px) * .0133, 24px);
        padding: clamp(16px, 16px + (100vw - 424px) * .0267, 32px);
        gap: clamp(24px, 24px + (100vw - 424px) * .0267, 40px)
    }
}

@media screen and (max-width: 1024px) {
    .section-order {
        margin: 0 24px;
        padding: 32px;
        gap: 40px
    }
}

@media screen and (max-width: 768px) {
    .section-order {
        margin: 0 16px;
        padding: 16px 16px 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 424px) {
    .section-order {
        margin: 0 16px;
        padding: 16px 16px 24px;
        border-radius: 16px;
        gap: 32px
    }
}

@media screen and (max-width: 360px) {
    .section-order {
        margin: 0 16px;
        padding: 16px 16px 24px;
        border-radius: 16px
    }
}

.section-order__heading {
    color: #151514;
    font-family: Headline Base;
    font-weight: 500;
    font-size: 28px;
    line-height: 36px;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .section-order__heading {
        font-size: clamp(24px, 24px + (100vw - 1360px) * .2857, 40px) !important;
        line-height: clamp(32px, 32px + (100vw - 1360px) * .2857, 48px) !important
    }
}

@media screen and (min-width: 1920px) {
    .section-order__heading {
        font-size: 40px !important;
        line-height: 48px !important;
        margin-bottom: 24px
    }
}

@media screen and (min-width: 1360px) {
    .section-order__heading {
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .section-order__heading {
        font-size: clamp(18px, 18px + (100vw - 424px) * .01, 24px);
        line-height: clamp(24px, 24px + (100vw - 424px) * .0133, 32px)
    }
}

@media screen and (max-width: 424px) {
    .section-order__heading {
        align-items: flex-start;
        text-align: left;
        padding-left: 16px;
        padding-right: 16px
    }
}

@media screen and (max-width: 1024px) {
    .section-order__heading {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .section-order__heading {
        font-size: clamp(18px, 18px + (100vw - 360px) * 0, 18px);
        line-height: 24px;
        padding-left: 16px;
        padding-right: 16px
    }
}

@media screen and (max-width: 768px) {
    .section-order__heading {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 360px) {
    .section-order__heading {
        line-height: 20px
    }
}

.section-order__title {
    color: #151514;
    font-family: Headline Base;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .section-order__title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: -8px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .section-order__title {
        font-size: clamp(24px, 24px + (100vw - 1360px) * .1429, 32px) !important;
        line-height: clamp(32px, 32px + (100vw - 1360px) * .2857, 48px) !important
    }
}

@media screen and (min-width: 1920px) {
    .section-order__title {
        font-size: 32px !important;
        line-height: 48px !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .section-order__title {
        font-size: clamp(16px, 16px + (100vw - 424px) * .0067, 20px);
        line-height: clamp(20px, 20px + (100vw - 424px) * .0133, 28px)
    }
}

@media screen and (max-width: 1024px) {
    .section-order__title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (width: 1024px) {
    .section-order__title {
        margin-bottom: -16px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .section-order__title {
        font-size: clamp(16px, 16px + (100vw - 360px) * 0, 16px);
        line-height: 20px;
        padding-left: 16px;
        padding-right: 16px;
        margin-bottom: -8px
    }
}

@media screen and (max-width: 424px) {
    .section-order__title {
        font-size: 16px;
        line-height: 20px;
        padding-left: 16px;
        padding-right: 16px;
        margin-bottom: -8px
    }
}

.section-order__order-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px
}

@media screen and (max-width: 768px) {
    .section-order__order-section {
        gap: 16px
    }
}

.section-order__empty-text {
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0%;
    vertical-align: middle;
    text-align: left;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .section-order__empty-text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .section-order__empty-text {
        font-size: clamp(16px, 16px + (100vw - 1360px) * .1429, 24px);
        line-height: clamp(24px, 24px + (100vw - 1360px) * .25, 38px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .section-order__empty-text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .section-order__empty-text {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .section-order__empty-text {
        font-size: 14px;
        line-height: 20px;
        margin-top: 16px;
        padding-left: 16px
    }
}

@media screen and (max-width: 360px) {
    .section-order__empty-text {
        font-size: 14px;
        line-height: 20px;
        margin-top: 16px
    }
}

.section-order__empty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    flex: 1
}

@media screen and (min-width: 1920px) {
    .section-order__empty {
        min-height: 0 !important;
        flex-shrink: 1 !important;
        margin-top: 24px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .section-order__empty {
        margin-top: 32px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .section-order__empty {
        margin-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .section-order__empty {
        margin-top: 24px
    }
}

@media screen and (max-width: 768px) {
    .section-order__empty {
        margin-top: 16px
    }
}

@media screen and (max-width: 424px) {
    .section-order__empty {
        margin-top: 16px
    }
}

.section-order .text-field__input::placeholder {
    color: transparent
}

.section-order .text-field__label {
    font-size: 20px !important;
    line-height: 28px !important
}

@media screen and (min-width: 1920px) {
    .section-order .text-field__label {
        top: -16px !important
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .section-order .text-field__label {
        font-size: 14px !important;
        line-height: 20px !important;
        top: -10px !important
    }
}

@media screen and (width: 1360px) {
    .section-order .text-field__label {
        top: -10px !important
    }
}

@media screen and (max-width: 1024px) {
    .section-order .text-field__label {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 424px) {
    .section-order .text-field__label {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.services-application__row-user-data {
    display: flex;
    flex-direction: row;
    gap: 48px;
    -webkit-gap: 48px;
    width: 100%;
    align-items: flex-start;
    margin-bottom: 64px
}

.services-application__row-user-data>*:last-child {
    margin-right: 0;
    -webkit-margin-end: 0
}

@media screen and (max-width: 980px) {
    .services-application__row-user-data {
        flex-wrap: wrap
    }

    .services-application__row-user-data>* {
        margin-right: 24px;
        -webkit-margin-end: 24px
    }
}

@media screen and (max-width: 680px) {
    .services-application__row-user-data {
        flex-direction: column
    }

    .services-application__row-user-data>* {
        margin-right: 0;
        margin-bottom: 24px;
        -webkit-margin-end: 0
    }

    .services-application__row-user-data>*:last-child {
        margin-bottom: 0
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application__row-user-data {
        margin-bottom: 48px;
        gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .services-application__row-user-data {
        margin-bottom: 32px;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 24px;
        -webkit-gap: 24px
    }

    .services-application__row-user-data>*:last-child {
        margin-right: 0;
        -webkit-margin-end: 0
    }
}

@media screen and (max-width: 768px) {
    .services-application__row-user-data {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 424px) {
    .services-application__row-user-data {
        margin-bottom: 16px;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 12px;
        -webkit-gap: 12px;
        padding-left: 16px;
        padding-right: 16px
    }

    .services-application__row-user-data>* {
        flex: 0 0 calc(50% - 6px);
        max-width: calc(50% - 6px);
        min-width: calc(50% - 6px);
        margin-right: 0;
        margin-bottom: 0;
        -webkit-margin-end: 0
    }

    .services-application__row-user-data>*:last-child {
        flex: 0 0 100%;
        max-width: 100%;
        min-width: 100%
    }
}

@media screen and (max-width: 360px) {
    .services-application__row-user-data {
        gap: 12px;
        -webkit-gap: 12px
    }

    .services-application__row-user-data>* {
        flex: 0 0 calc(50% - 6px);
        max-width: calc(50% - 6px);
        min-width: calc(50% - 6px);
        margin-right: 0;
        -webkit-margin-end: 0
    }

    .services-application__row-user-data>*:last-child {
        flex: 0 0 100%;
        max-width: 100%;
        min-width: 100%
    }
}

.services-application__row-user-data .text-field__container {
    min-width: 100%;
    max-width: 100%;
    min-height: 56px;
    max-height: 56px
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-application__row-user-data .text-field__container {
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (min-width: 1920px) {
    .services-application__row-user-data .text-field__container {
        min-width: 330px;
        max-width: 330px;
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-application__row-user-data .text-field__container {
        min-width: 201px;
        max-width: 201px;
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application__row-user-data .text-field__container {
        min-width: 201px;
        max-width: 201px;
        min-height: 56px;
        max-height: 56px
    }
}

@media screen and (max-width: 1024px) {
    .services-application__row-user-data .text-field__container {
        min-width: 277px;
        max-width: 277px;
        min-height: 56px;
        max-height: 56px
    }
}

@media screen and (max-width: 768px) {
    .services-application__row-user-data .text-field__container {
        min-width: 100%;
        max-width: 100%;
        min-height: 52px;
        max-height: 52px
    }
}

@media screen and (max-width: 424px) {
    .services-application__row-user-data .text-field__container {
        min-width: 172px;
        max-width: 172px;
        min-height: 52px;
        max-height: 52px
    }
}

@media screen and (max-width: 360px) {
    .services-application__row-user-data .text-field__container {
        min-width: calc(50% - 8px);
        max-width: calc(50% - 8px);
        min-height: 52px;
        max-height: 52px
    }
}

.services-application__row-user-data .text-field__container .text-field__input {
    height: max-content;
    padding: 8px 0;
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-application__row-user-data .text-field__container .text-field__input {
        padding: 40px 0 12px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (min-width: 1920px) {
    .services-application__row-user-data .text-field__container .text-field__input {
        padding: 44px 0 12px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1360px) {
    .services-application__row-user-data .text-field__container .text-field__input {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .services-application__row-user-data .text-field__container .text-field__input {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-application__row-user-data .text-field__container .text-field__input {
        font-size: 14px;
        line-height: 20px;
        width: 100%
    }
}

.services-application__row-user-data .text-field__label.text-field__label-repair {
    padding: 0;
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (max-width: 1360px) {
    .services-application__row-user-data .text-field__label.text-field__label-repair {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-application__row-user-data .text-field__label.text-field__label-repair {
        font-size: 12px;
        line-height: 16px
    }
}

.container-order {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    width: 100%
}

.container-order .card-order--primary .card-order-info-description .card-order-info__description-title {
    color: #888;
    font-size: 24px;
    line-height: 28px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-order .card-order--primary .card-order-info-description .card-order-info__description-title {
        font-size: 16px;
        line-height: 20px
    }
}

@media screen and (max-width: 1360px) {
    .container-order .card-order--primary .card-order-info-description .card-order-info__description-title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .container-order .card-order--primary .card-order-info-description .card-order-info__description-title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .container-order .card-order--primary .card-order-info-description .card-order-info__description-title {
        font-size: 10px !important;
        line-height: 12px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-order {
        width: clamp(100%, 100% + (100vw - 1360px) * 1.2143, 1680px)
    }
}

@media screen and (min-width: 1920px) {
    .container-order {
        width: 1680px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .container-order {
        gap: clamp(16px, 16px + (100vw - 424px) * .0133, 24px)
    }
}

@media screen and (max-width: 1024px) {
    .container-order {
        flex-direction: column;
        gap: 24px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .container-order {
        gap: clamp(16px, 16px + (100vw - 360px) * 0, 16px)
    }
}

@media screen and (max-width: 768px) {
    .container-order {
        gap: 16px
    }
}

.card-order-checkout {
    gap: 24px !important;
    margin-top: 16px !important;
    padding: 16px !important
}

@media screen and (min-width: 1920px) {
    .card-order-checkout {
        gap: 40px !important;
        margin-top: 40px !important;
        height: 100% !important;
        padding: 24px !important
    }
}

@media screen and (max-width: 1024px) {
    .card-order-checkout {
        gap: 16px !important;
        padding: 12px !important
    }
}

@media screen and (max-width: 768px) {
    .card-order-checkout {
        gap: 12px !important;
        margin-top: 12px !important
    }
}

.card-order {
    display: flex;
    padding: 24px 0 !important;
    justify-content: center;
    align-items: center;
    gap: 32px;
    align-self: stretch;
    border-radius: 24px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .card-order {
        height: clamp(144px, 144px + (100vw - 1360px) * .0857, 192px);
        gap: clamp(32px, 32px + (100vw - 1360px) * .2857, 48px);
        padding: clamp(20px, 20px + (100vw - 1360px) * .0071, 24px)
    }
}

@media screen and (min-width: 1920px) {
    .card-order {
        height: 192px;
        gap: 48px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order {
        padding: 16px;
        gap: 12px;
        flex-direction: column !important;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow: visible;
        align-items: flex-start
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .card-order {
        padding: 14px !important;
        flex-direction: row;
        gap: 14px;
        width: 100%;
        align-items: center
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order {
        padding: unset;
        gap: clamp(12px, 12px + (100vw - 360px) * 0, 12px)
    }
}

@media screen and (max-width: 1023px) {
    .card-order {
        padding: unset;
        flex-direction: column;
        gap: 16px
    }
}

@media screen and (max-width: 424px) {
    .card-order {
        align-items: flex-start;
        text-align: left;
        width: 100%
    }
}

.card-order__image-checkout {
    max-width: 102px !important;
    min-width: 102px !important;
    min-height: 66px !important;
    max-height: 66px !important;
    padding: unset !important
}

@media screen and (min-width: 1920px) {
    .card-order__image-checkout {
        min-height: 80px !important;
        max-height: 80px !important;
        padding: unset !important
    }
}

@media screen and (max-width: 1024px) {
    .card-order__image-checkout {
        max-width: 80px !important;
        min-width: 80px !important;
        min-height: 59px !important;
        max-height: 59px !important
    }
}

.card-order__image {
    display: flex;
    width: 179px;
    height: 112px;
    padding: 20px 0;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: #ebeaea
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .card-order__image {
        width: clamp(179px, 179px + (100vw - 1360px) * .0911, 230px);
        height: clamp(112px, 112px + (100vw - 1360px) * .0571, 144px);
        padding: clamp(20px, 20px + (100vw - 1360px) * .0179, 30px) 0
    }
}

@media screen and (min-width: 1920px) {
    .card-order__image {
        width: 230px;
        height: 144px;
        padding: 30px 0
    }
}

@media screen and (max-width: 1360px) {
    .card-order__image {
        width: 179px;
        height: 112px;
        padding: 20px 0
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order__image {
        width: 80px;
        height: 59px;
        padding: 8px 0;
        flex-shrink: 0;
        align-self: center
    }
}

@media screen and (max-width: 1024px) {
    .card-order__image {
        width: 166px !important;
        height: 88px !important;
        padding: 12px 0
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order__image {
        width: clamp(80px, 80px + (100vw - 360px) * 0, 80px);
        height: 59px;
        padding: 8px 0;
        align-self: center
    }
}

@media screen and (max-width: 424px) {
    .card-order__image {
        width: 80px;
        height: 59px;
        padding: 8px 0;
        align-self: center
    }
}

.card-order__image img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media screen and (min-width: 1920px) {
    .card-order__image img {
        width: 230px;
        height: 144px
    }
}

@media screen and (max-width: 1360px) {
    .card-order__image img {
        width: 179px;
        height: 112px
    }
}

@media screen and (max-width: 1024px) {
    .card-order__image img {
        width: 120px;
        height: 88px
    }
}

@media screen and (max-width: 424px) {
    .card-order__image img {
        width: 80px;
        height: 59px
    }
}

.card-order__image .card-image__icon {
    width: 40px;
    height: 40px;
    object-fit: contain
}

@media screen and (width: 1360px) {
    .card-order__image .card-image__icon {
        width: 32px !important;
        height: 32px !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order__image .card-image__icon {
        width: clamp(24px, 24px + (100vw - 424px) * 0, 24px);
        height: clamp(24px, 24px + (100vw - 424px) * 0, 24px)
    }
}

@media screen and (max-width: 1024px) {
    .card-order__image .card-image__icon {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order__image .card-image__icon {
        width: 18px !important;
        height: 18px !important;
        align-self: center
    }
}

@media screen and (max-width: 424px) {
    .card-order__image .card-image__icon {
        align-self: center;
        width: 18px !important;
        height: 18px !important
    }
}

.card-order__image.bg-img {
    background: none !important
}

.card-order__image.bg-img .card-image__photo {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.card-order-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px
}

@media screen and (min-width: 1025px) {
    .card-order-info {
        height: 100%;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info {
        width: 100%;
        padding: 0 16px;
        gap: 8px;
        flex: 0 1 auto;
        min-width: 0
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info {
        width: 100%;
        padding: 0 16px;
        gap: 8px
    }
}

.card-order-info__title a {
    width: 300px;
    color: #151514;
    font-family: Headline Base;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55
}

@media screen and (min-width: 1920px) {
    .card-order-info__title a {
        font-size: 24px;
        line-height: 1.33;
        width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__title a {
        font-size: 12px;
        line-height: 1.33;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__title a {
        font-size: 12px;
        line-height: 1.33;
        width: 172px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info__title a {
        align-items: flex-start;
        width: 100%;
        text-align: left
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__title a {
        align-items: flex-start;
        width: 100%;
        text-align: left
    }
}

.card-order-info__title-checkout a,
.card-order-info__title-basket a {
    font-size: 16px !important;
    line-height: 1.5 !important
}

.card-order-info__title-basket a {
    max-width: 250px !important
}

.card-order-info__subtitle {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .card-order-info__subtitle {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__subtitle {
        font-size: clamp(12px, 12px + (100vw - 424px) * 0, 12px);
        line-height: 1.4;
        white-space: nowrap
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__subtitle {
        font-size: 12px;
        line-height: 1.4;
        white-space: nowrap
    }
}

.card-order-info__subtitle-checkout {
    font-size: 12px !important;
    line-height: 1.33 !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__subtitle-checkout {
        font-size: 16px !important;
        line-height: 1.5 !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__subtitle-checkout {
        font-size: clamp(12px, 12px + (100vw - 424px) * 0, 12px) !important;
        line-height: 1.4 !important
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__subtitle-checkout {
        font-size: 12px !important;
        line-height: 1.4 !important
    }
}

.card-order-info__subtitle-number-checkout {
    font-size: 12px !important;
    line-height: 1.33 !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__subtitle-number-checkout {
        font-size: 16px !important;
        line-height: 1.5 !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__subtitle-number-checkout {
        font-size: clamp(12px, 12px + (100vw - 424px) * 0, 12px) !important;
        line-height: 1.4 !important;
        white-space: nowrap
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__subtitle-number-checkout {
        font-size: 12px !important;
        line-height: 1.4 !important;
        white-space: nowrap
    }
}

.card-order-info__description-title {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .card-order-info__description-title {
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__description-title {
        font-size: clamp(10px, 10px + (100vw - 424px) * 0, 10px);
        line-height: clamp(1.2, 1.2 + (100vw - 424px) * 0, 1.2)
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__description-title {
        font-size: 10px;
        line-height: 1.2
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info__description-title {
        font-size: 12px;
        line-height: 14px;
        margin: 0;
        width: 100%
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__description-title {
        font-size: 12px;
        line-height: 14px;
        margin: 0;
        width: 100%
    }
}

.card-order-info__amount {
    color: #888;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .card-order-info__amount {
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__amount {
        font-size: clamp(10px, 10px + (100vw - 424px) * 0, 10px);
        line-height: clamp(1.2, 1.2 + (100vw - 424px) * 0, 1.2)
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__amount {
        font-size: 14px;
        line-height: 1.2
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info__amount {
        font-size: 10px;
        line-height: 12px;
        margin: 0;
        width: 100%
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__amount {
        font-size: 10px;
        line-height: 12px;
        margin: 0;
        width: 100%
    }
}

.card-order-info__description-title-checkout {
    font-size: 14px !important;
    line-height: 1.43 !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__description-title-checkout {
        font-size: 16px !important;
        line-height: 1.5 !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__description-title-checkout {
        display: flex;
        font-size: clamp(10px, 10px + (100vw - 424px) * .0033, 12px) !important;
        line-height: clamp(1.2, 1.2 + (100vw - 424px) * .0022, 1.33) !important
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__description-title-checkout {
        display: flex;
        font-size: 10px !important;
        line-height: 1.2 !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info__description-title-checkout {
        font-size: 12px !important;
        line-height: 1.33 !important
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__description-title-checkout {
        font-size: 12px !important;
        line-height: 1.33 !important
    }
}

.card-order-info__price {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .card-order-info__price {
        font-size: 20px;
        font-weight: 600;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info__price {
        font-size: clamp(12px, 12px + (100vw - 424px) * 0, 12px);
        line-height: 1.33;
        width: clamp(118px, 118px + (100vw - 424px) * 0, 118px)
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__price {
        font-size: 12px;
        line-height: 1.33;
        width: 118px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info__price {
        width: auto;
        align-self: flex-start
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__price {
        width: auto;
        align-self: flex-start
    }
}

.card-order-info__price-checkout,
.card-order-info__price-basket {
    font-size: 12px !important;
    line-height: 1.33 !important
}

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

    .card-order-info__price-checkout,
    .card-order-info__price-basket {
        font-size: 20px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important
    }
}

.card-order-info__price-basket {
    min-width: 120px !important;
    max-width: 120px !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__price-basket {
        min-width: 176px !important;
        max-width: 176px !important;
        font-size: 18px !important;
        line-height: 1.33 !important
    }
}

.card-order-info__description {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    width: 100%;
    margin: 0;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    text-overflow: ellipsis !important;
    overflow-wrap: anywhere !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__description {
        font-size: 20px;
        line-height: 28px;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .card-order-info__description {
        font-size: 14px;
        line-height: 20px;
        max-height: 72px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .card-order-info__description {
        font-size: 14px;
        line-height: 20px;
        width: 100%;
        max-width: 100%;
        text-align: left;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        text-overflow: ellipsis !important
    }
}

@media screen and (max-width: 424px) {
    .card-order-info__description {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        text-overflow: ellipsis !important
    }
}

.card-order-info__description-checkout,
.card-order-info__description-basket {
    font-size: 12px !important;
    line-height: 1.33 !important;
    gap: 8px !important
}

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

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        font-size: 20px !important;
        line-height: 1.4 !important;
        gap: 16px !important
    }
}

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

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        gap: 8px !important
    }
}

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

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        max-width: 100% !important;
        min-width: 100% !important
    }
}

@media screen and (max-width: 1023px) {
    .card-order-info__description-checkout {
        padding: unset !important
    }
}

.card-order-info__description-basket {
    max-width: 225px !important
}

@media screen and (min-width: 1920px) {
    .card-order-info__description-basket {
        max-width: 347px !important
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info__description-basket {
        max-width: 100% !important;
        min-width: 100% !important
    }
}

@media screen and (max-width: 1023px) {
    .card-order-info__description-basket {
        max-width: 100% !important;
        min-width: 100% !important;
        padding: unset !important
    }
}

.card-order-info .card-order-info__span {
    color: #494949;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .card-order-info .card-order-info__span {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1360px) {
    .card-order-info .card-order-info__span {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) and (min-width: 1025px) {
    .card-order-info .card-order-info__span {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info .card-order-info__span {
        font-size: clamp(10px, 10px + (100vw - 424px) * .0033, 12px);
        line-height: clamp(1.2, 1.2 + (100vw - 424px) * .0022, 1.33)
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info .card-order-info__span {
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info .card-order-info__span {
        font-size: clamp(10px, 10px + (100vw - 360px) * 0, 10px);
        line-height: 1.2
    }
}

@media screen and (max-width: 1023px) {
    .card-order-info .card-order-info__span {
        font-size: 12px;
        line-height: 1.4
    }
}

.card-order button {
    all: unset;
    cursor: pointer
}

.card-order-icons {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 56px;
    justify-content: flex-end
}

@media screen and (min-width: 1025px) {
    .card-order-icons {
        align-self: center;
        justify-content: flex-end
    }
}

@media screen and (min-width: 1920px) {
    .card-order-icons {
        gap: 24px;
        width: 100px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-icons {
        margin-bottom: clamp(16px, 16px + (100vw - 424px) * 0, 16px);
        gap: clamp(12px, 12px + (100vw - 424px) * 0, 12px);
        width: 100%;
        justify-content: center
    }
}

@media screen and (max-width: 1024px) {
    .card-order-icons {
        gap: 12px;
        width: 43px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-icons {
        width: 100%;
        justify-content: center;
        margin-bottom: 16px !important
    }
}

@media screen and (max-width: 424px) {
    .card-order-icons {
        width: 100%;
        justify-content: center;
        margin-bottom: 16px !important
    }
}

.card-order-icons svg {
    width: 20px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .card-order-icons svg {
        width: 28px;
        height: 32px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-icons svg {
        width: clamp(15px, 15px + (100vw - 424px) * 0, 15px);
        height: clamp(18px, 18px + (100vw - 424px) * 0, 18px)
    }
}

@media screen and (max-width: 1024px) {
    .card-order-icons svg {
        width: 15px;
        height: 18px
    }
}

.card-order-info-description {
    display: flex;
    padding-left: 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex: 1 0 0
}

@media screen and (min-width: 1920px) {
    .card-order-info-description {
        flex: 0 0 auto;
        width: 464px;
        min-width: 464px;
        max-width: 464px
    }
}

@media screen and (min-width: 1025px) {
    .card-order-info-description {
        padding-left: 0;
        height: 100%;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (min-width: 769px) {
    .card-order-info-description {
        width: calc(236px - ((1024px - 100vw)*.2267));
        min-width: 0;
        max-width: calc(236px - ((1024px - 100vw)*.2267));
        box-sizing: border-box;
        height: 68px;
        padding: 0 calc(8px + (1024px - 100vw)*.0133) 0 calc(8px + (1024px - 100vw)*.0133);
        gap: calc(8px + (1024px - 100vw)*.0067);
        flex: 0 0 auto;
        align-items: flex-start;
        justify-content: center;
        overflow: hidden
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info-description {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        height: auto;
        min-height: auto;
        padding: 24px 0;
        gap: 16px;
        flex: 1 1 auto;
        align-items: flex-start;
        justify-content: flex-start;
        overflow: visible
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info-description {
        width: 236px;
        min-width: 236px;
        max-width: 236px;
        height: 100px;
        padding: 0 16px;
        gap: 8px;
        flex: 0 0 auto;
        align-items: flex-start;
        justify-content: center
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info-description {
        width: 100%;
        min-width: 100%;
        height: 70px;
        max-width: 100%;
        padding: clamp(16px, 16px + (100vw - 360px) * 0, 16px);
        gap: clamp(12px, 12px + (100vw - 360px) * 0, 12px)
    }
}

@media screen and (max-width: 424px) {
    .card-order-info-description {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        padding: 16px;
        gap: 12px
    }
}

.mobile-order {
    display: flex;
    gap: 32px;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .mobile-order {
        gap: 48px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .mobile-order {
        width: calc(100% + 32px);
        margin-left: -16px;
        margin-right: -16px;
        gap: 12px;
        border-bottom: 1px solid #dedede;
        padding: 0 16px 16px;
        align-items: flex-start
    }
}

@media screen and (max-width: 1024px) {
    .mobile-order {
        width: 100%;
        gap: 12px;
        border-bottom: none;
        padding: 16px 16px 12px;
        align-items: center
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .mobile-order {
        border-bottom: 1px solid #dedede;
        align-items: flex-start
    }
}

@media screen and (max-width: 424px) {
    .mobile-order {
        border-bottom: 1px solid #dedede;
        align-items: flex-start
    }
}

.mobile-order-checkout {
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .mobile-order-checkout {
        gap: 40px
    }
}

@media screen and (max-width: 1024px) {
    .mobile-order-checkout {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-order-checkout {
        gap: 16px;
        padding: 0 0 16px
    }
}

@media screen and (max-width: 1023px) {
    .card-order-info-mb {
        padding: unset !important
    }
}

.card-order-info-amount {
    width: 157px !important;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media screen and (min-width: 1025px) {
    .card-order-info-amount {
        width: 200px !important;
        height: 100%;
        align-items: flex-start;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .card-order-info-amount {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        margin-left: 0;
        align-items: flex-start;
        padding: 16px 0;
        gap: 12px;
        flex: 0 1 auto;
        border-top: none
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info-amount {
        width: 100% !important;
        margin-left: 24px;
        align-items: flex-start
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .card-order-info-amount {
        margin-left: 0;
        width: 100% !important;
        padding: 0 clamp(16px, 16px + (100vw - 360px) * 0, 16px) clamp(16px, 16px + (100vw - 360px) * 0, 16px) clamp(16px, 16px + (100vw - 360px) * 0, 16px);
        gap: clamp(12px, 12px + (100vw - 360px) * 0, 12px)
    }
}

@media screen and (max-width: 424px) {
    .card-order-info-amount {
        margin-left: 0;
        width: 100% !important;
        padding: 0 16px 16px;
        gap: 12px
    }
}

@media screen and (max-width: 1024px) {
    .card-order-info-checkout {
        display: none !important
    }
}

@media screen and (max-width: 1023px) {
    .card-order-info-checkout {
        display: flex !important;
        padding: unset
    }
}

.container-button-order {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-top: 32px;
    margin-left: auto;
    margin-right: auto
}

@media screen and (min-width: 1920px) {
    .container-button-order {
        margin-top: 64px
    }
}

@media screen and (max-width: 1360px) {
    .container-button-order {
        margin-top: 48px
    }
}

@media screen and (max-width: 1024px) {
    .container-button-order {
        margin-top: 40px
    }
}

@media screen and (max-width: 768px) {
    .container-button-order {
        margin-top: 32px
    }
}

@media screen and (max-width: 424px) {
    .container-button-order {
        padding-left: 16px;
        padding-right: 16px
    }
}

.container-button-order .button-order {
    all: unset;
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    background: #151514;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .container-button-order .button-order {
        padding: 23px 56px;
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .container-button-order .button-order {
        padding: 16px 24px;
        font-size: 14px;
        line-height: 1.42
    }
}

@media screen and (max-width: 768px) {
    .container-button-order .button-order {
        padding: 16px;
        font-size: 14px;
        line-height: 1.42
    }
}

.container-button-order .button-order:hover {
    background: #2a2a29
}

.card-image__icon-checkout {
    min-width: 24px;
    min-height: 24px;
    max-width: 24px;
    max-height: 24px
}

@media screen and (max-width: 1024px) {
    .card-image__icon-checkout {
        min-width: 18px;
        min-height: 18px;
        max-width: 18px;
        max-height: 18px
    }
}

@media screen and (min-width: 1920px) {
    .card-image__icon-checkout {
        min-width: 40px;
        min-height: 40px;
        max-width: 40px;
        max-height: 40px
    }
}

.reset-button {
    cursor: pointer !important;
    all: unset;
    color: #58c7f7;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42;
    margin-top: 8px
}

@media screen and (min-width: 1920px) {
    .reset-button {
        font-size: 20px;
        line-height: 1.4;
        margin-top: 16px
    }
}

@media screen and (max-width: 1024px) {
    .reset-button {
        margin-top: 10px
    }
}

@media screen and (max-width: 768px) {
    .reset-button {
        font-size: 12px;
        line-height: 1.33;
        margin-top: 8px
    }
}

.container-order {
    max-width: 100%
}

.bg-img {
    background: none !important
}

.checkout-remove path {
    fill: var(--Text-Grey_1, #cfcfcf) !important
}

.icon-remove {
    width: 15px !important;
    height: 18px !important
}

@media screen and (min-width: 1920px) {
    .icon-remove {
        width: 21px !important;
        height: 24px !important
    }
}

@media screen and (max-width: 1359px) and (min-width: 1025px) {
    .container-order {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important
    }

    .card-order {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 24px !important;
        gap: 16px !important;
        box-sizing: border-box !important
    }

    .mobile-order {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        padding: 0 0 16px !important;
        margin: 0 !important;
        border-bottom: 1px solid #dedede
    }

    .card-order__image {
        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;
        height: 80px !important;
        flex-shrink: 0 !important
    }

    .card-order-info {
        flex: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 0 !important
    }

    .card-order-info__title a,
    .card-order-info__title-checkout a,
    .card-order-info__title-basket a {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 1.33 !important
    }

    .card-order-info__subtitle {
        font-size: 12px !important;
        line-height: 1.4 !important
    }

    .card-order-info__description-title {
        font-size: 12px !important;
        line-height: 1.2 !important
    }

    .card-order-info__description-title-checkout {
        font-size: 10px !important;
        line-height: 1.2 !important
    }

    .card-order-info__amount {
        font-size: 14px !important;
        line-height: 1.2 !important
    }

    .card-order-info__price {
        width: auto !important;
        font-size: 12px !important;
        line-height: 1.33 !important
    }

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        min-width: 100% !important;
        max-width: 100% !important
    }

    .card-order-info.card-order-info-mb {
        width: clamp(150px, 150px + (100vw - 1025px) * .448, 300px) !important;
        min-width: clamp(150px, 150px + (100vw - 1025px) * .448, 300px) !important;
        max-width: clamp(150px, 150px + (100vw - 1025px) * .448, 300px) !important;
        flex: none !important
    }

    .card-order-info-description {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        margin-left: clamp(16px, 16px + (100vw - 1025px) * .12, 56px) !important;
        flex: 1 !important
    }

    .card-order-info-amount {
        width: auto !important;
        min-width: auto !important;
        max-width: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        flex: 1 !important
    }

    .card-order-icons {
        width: auto !important;
        justify-content: flex-end !important;
        margin: 0 !important;
        flex-shrink: 0 !important
    }

    .card-order {
        flex-direction: row !important;
        flex-wrap: wrap !important
    }

    .mobile-order {
        width: 100% !important;
        flex: 0 0 100% !important
    }
}

@media screen and (width: 1360px) {
    .card-order {
        display: flex !important;
        gap: 24px !important;
        align-items: center;
        flex-wrap: nowrap !important;
        overflow: visible !important
    }

    .mobile-order:has(.card-order-info-mb) {
        width: 511px !important;
        max-width: 511px !important;
        min-width: 511px !important;
        flex-shrink: 0 !important
    }

    .mobile-order .card-order-info.card-order-info-mb {
        width: 324px !important;
        max-width: 324px !important;
        min-width: 324px !important;
        padding: 0 32px 0 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important
    }

    .mobile-order .card-order-info.card-order-info-mb .card-order-info__title a,
    .mobile-order .card-order-info.card-order-info-mb .card-order-info__subtitle {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .card-order__image {
        width: 179px !important;
        min-width: 179px !important;
        max-width: 179px !important;
        flex-shrink: 0 !important
    }

    .card-order-info-description {
        width: 324px !important;
        min-width: 324px !important;
        max-width: 324px !important;
        flex-shrink: 0 !important;
        margin-right: 8px !important
    }

    .card-order-info-amount {
        flex-shrink: 0 !important;
        width: 195px !important
    }

    .card-order-icons {
        flex-shrink: 0 !important
    }
}

@media screen and (min-width: 1920px) {
    .card-order {
        display: flex !important;
        gap: 0;
        align-items: center;
        padding-left: 24px;
        padding-right: 40px;
        overflow: hidden
    }

    .card-order__image {
        width: 230px;
        height: 144px;
        flex-shrink: 0
    }

    .card-order__image img {
        width: 230px;
        height: 144px
    }

    .mobile-order {
        gap: 32px;
        align-items: center;
        border-bottom: none;
        padding: 0;
        width: 500px;
        height: 72px;
        flex-shrink: 0
    }

    .mobile-order:has(.card-order-info-mb) {
        width: 548px !important
    }

    .card-order-info {
        height: 72px;
        justify-content: center;
        min-width: 238px;
        width: 238px
    }

    .mobile-order .card-order-info.card-order-info-mb {
        width: 450px !important;
        max-width: 450px !important;
        min-width: 450px !important;
        padding: 0 48px 0 16px !important;
        box-sizing: border-box !important
    }

    .card-order-info-description {
        padding-left: 0;
        width: 464px !important;
        min-width: 464px !important;
        max-width: 464px !important;
        flex-shrink: 0;
        flex-grow: 0;
        height: auto !important;
        min-height: 100px !important;
        max-height: none !important;
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-left: 220px;
        margin-right: 40px;
        overflow: visible !important
    }

    .card-order-info-description .card-order-info__description {
        font-size: 24px !important
    }

    .card-order-info-amount {
        width: 196px !important;
        align-items: flex-start;
        flex-shrink: 0;
        height: 100%;
        justify-content: center;
        margin-left: 0
    }

    .card-order-info-amount .card-order-info__amount {
        color: #888 !important
    }

    .card-order-info-amount .card-order-info__price {
        font-size: 24px !important
    }

    .card-order--primary .card-order-info-amount .card-order-info__price,
    .card-order--primary .card-order-info-description .card-order-info__description {
        font-size: 20px !important
    }

    .card-order-icons {
        justify-content: flex-end !important;
        align-items: center !important;
        flex-shrink: 0
    }
}

@media screen and (min-width: 1024px) and (max-width: 1359px) {
    .card-order {
        display: grid !important;
        grid-template-columns: minmax(150px, 320px) minmax(0, 1fr) minmax(140px, 180px) 56px;
        gap: 24px;
        align-items: center;
        width: 100% !important;
        max-width: 100% !important
    }

    .mobile-order {
        align-self: stretch;
        gap: 12px;
        align-items: center;
        border-bottom: none;
        padding: 0
    }

    .mobile-order:has(.card-order-info-mb) {
        width: 548px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1439px) {
    .card-order {
        display: flex !important;
        gap: clamp(32px, 32px + (100vw - 1360px) * .2857, 40px) !important;
        align-items: center;
        width: 100% !important;
        max-width: 100% !important
    }

    .mobile-order {
        align-self: stretch;
        gap: 32px;
        align-items: center;
        border-bottom: none;
        padding: 0;
        flex-shrink: 0
    }

    .mobile-order:has(.card-order-info-mb) {
        width: clamp(511px, 511px + (100vw - 1360px) * .0661, 548px) !important
    }

    .card-order-info-description {
        width: clamp(300px, 300px + (100vw - 1360px) * .293, 380px) !important;
        min-width: clamp(300px, 300px + (100vw - 1360px) * .293, 380px) !important;
        max-width: clamp(300px, 300px + (100vw - 1360px) * .293, 380px) !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        flex-shrink: 0
    }
}

@media screen and (min-width: 1441px) and (max-width: 1919px) {
    .card-order {
        display: flex !important;
        gap: clamp(32px, 32px + (100vw - 1360px) * .2857, 48px) !important;
        align-items: center;
        width: 100% !important;
        max-width: 100% !important
    }

    .mobile-order {
        align-self: stretch;
        gap: 32px;
        align-items: center;
        border-bottom: none;
        padding: 0;
        flex-shrink: 0
    }

    .mobile-order:has(.card-order-info-mb) {
        width: clamp(511px, 511px + (100vw - 1360px) * .0661, 548px) !important
    }

    .card-order-info-description {
        width: clamp(300px, 300px + (100vw - 1360px) * .293, 464px) !important;
        min-width: clamp(300px, 300px + (100vw - 1360px) * .293, 464px) !important;
        max-width: clamp(300px, 300px + (100vw - 1360px) * .293, 464px) !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        flex-shrink: 0
    }
}

@media screen and (width: 1440px) {
    .container-order {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important
    }

    .card-order {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        gap: 16px !important;
        align-items: center;
        flex-wrap: nowrap !important;
        padding: 20px 24px !important;
        overflow: visible !important
    }

    .mobile-order {
        display: flex !important;
        gap: 24px !important;
        align-items: center;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        margin-right: 0 !important
    }

    .mobile-order:has(.card-order-info-mb) {
        width: auto !important;
        max-width: none !important;
        min-width: auto !important
    }

    .card-order-info-description {
        margin-left: 0 !important;
        gap: 0px
    }

    .card-order__image {
        width: 200px !important;
        min-width: 200px !important;
        max-width: 200px !important;
        height: 125px !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important
    }

    .card-order__image img {
        width: 200px !important;
        height: 125px !important
    }

    .mobile-order .card-order-info.card-order-info-mb {
        width: 320px !important;
        max-width: 320px !important;
        min-width: 320px !important;
        padding: 0 16px 0 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important
    }

    .mobile-order .card-order-info.card-order-info-mb .card-order-info__title a,
    .mobile-order .card-order-info.card-order-info-mb .card-order-info__subtitle {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .card-order-info-description {
        padding-left: 0 !important;
        margin-left: 0 !important;
        width: 380px !important;
        min-width: 380px !important;
        max-width: 380px !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        height: auto !important;
        min-height: 80px !important;
        max-height: none !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: flex-start !important;
        overflow: visible !important
    }

    .card-order-info-description .card-order-info__description-title {
        color: #888 !important;
        margin-bottom: 8px
    }

    .card-order-info-description .card-order-info__description {
        word-break: break-word;
        width: 100% !important
    }

    .card-order-info-amount {
        width: 196px !important;
        min-width: 196px !important;
        max-width: 196px !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        height: 100% !important
    }

    .card-order-info-amount .card-order-info__amount {
        color: #888 !important;
        margin-bottom: 8px
    }

    .card-order-info-amount .card-order-info__price {
        width: 100% !important
    }

    .card-order-icons {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        width: auto !important;
        min-width: auto !important;
        max-width: none !important;
        padding: 0 !important;
        margin: 0 !important;
        visibility: visible !important;
        opacity: 1 !important
    }

    .card-order-icons button,
    .card-order-icons .card-order__icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        opacity: 1 !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .section-order {
        width: 960px;
        max-width: 960px;
        margin: 0 32px
    }

    .container-order {
        gap: 16px;
        flex-direction: column;
        width: 100%;
        max-width: 944px;
        margin: 0 auto
    }

    .card-order {
        gap: 16px;
        width: 100%;
        max-width: 944px;
        align-items: center;
        justify-content: space-between;
        padding: 16px 20px;
        flex-direction: row
    }

    .card-order-info__title a,
    .card-order-info__title-checkout a,
    .card-order-info__title-basket a {
        width: auto;
        max-width: 160px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        line-clamp: 1;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        min-width: 200px !important;
        max-width: 200px !important;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        line-clamp: 1;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .card-order-info__price {
        width: 118px
    }

    .card-order-info-description {
        width: 236px;
        min-width: 236px;
        max-width: 236px;
        height: 68px;
        padding: 0 20px;
        justify-content: center;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-left: 30px
    }

    .card-order-info-amount {
        width: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
        height: auto;
        padding: 0 20px;
        justify-content: center;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-left: 40px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .container-order {
        flex-direction: column !important;
        gap: clamp(16px, 16px + (100vw - 424px) * .0134, 24px) !important;
        width: 100% !important;
        padding: 0 clamp(16px, 16px + (100vw - 424px) * .0134, 24px) !important;
        box-sizing: border-box !important
    }

    .card-order {
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        height: auto !important;
        padding: clamp(12px, 12px + (100vw - 424px) * .02, 24px) !important;
        gap: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        border-radius: clamp(16px, 16px + (100vw - 424px) * .0134, 24px) !important
    }

    .card-order__image {
        width: clamp(80px, 80px + (100vw - 424px) * .1003, 140px) !important;
        min-width: clamp(80px, 80px + (100vw - 424px) * .1003, 140px) !important;
        max-width: clamp(80px, 80px + (100vw - 424px) * .1003, 140px) !important;
        height: clamp(59px, 59px + (100vw - 424px) * .0886, 112px) !important;
        min-height: clamp(59px, 59px + (100vw - 424px) * .0886, 112px) !important;
        max-height: clamp(59px, 59px + (100vw - 424px) * .0886, 112px) !important;
        flex-shrink: 0 !important;
        padding: clamp(4px, 4px + (100vw - 424px) * .0267, 20px) 0 !important;
        border-radius: clamp(12px, 12px + (100vw - 424px) * .0067, 16px) !important
    }

    .card-order__image img {
        width: clamp(80px, 80px + (100vw - 424px) * .1003, 140px) !important;
        height: clamp(59px, 59px + (100vw - 424px) * .0886, 112px) !important;
        object-fit: cover !important
    }

    .card-order__image .card-image__icon {
        width: clamp(18px, 18px + (100vw - 424px) * .01, 24px) !important;
        height: clamp(18px, 18px + (100vw - 424px) * .01, 24px) !important;
        object-fit: contain !important
    }

    .mobile-order {
        width: calc(100% + clamp(24px, 24px + (100vw - 424px) * .04, 48px)) !important;
        margin-left: clamp(-24px, -12px - (100vw - 424px) * .02, -12px) !important;
        margin-right: clamp(-24px, -12px - (100vw - 424px) * .02, -12px) !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        gap: clamp(8px, 8px + (100vw - 424px) * .0267, 24px) !important;
        border-bottom: 1px solid #dedede !important;
        padding: 0 clamp(12px, 12px + (100vw - 424px) * .02, 24px) clamp(12px, 12px + (100vw - 424px) * .02, 24px) clamp(12px, 12px + (100vw - 424px) * .02, 24px) !important;
        align-items: center !important;
        box-sizing: border-box !important
    }

    .mobile-order .card-order-info.card-order-info-mb {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: flex-start !important;
        gap: clamp(4px, 4px + (100vw - 424px) * .0134, 12px) !important;
        flex: 1 !important;
        min-width: 0 !important;
        padding: 0 !important
    }

    .card-order-info {
        width: 100% !important;
        padding: 0 !important;
        gap: clamp(4px, 4px + (100vw - 424px) * .02, 16px) !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .card-order-info__title a,
    .card-order-info__title-checkout a,
    .card-order-info__title-basket a {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important
    }

    .card-order-info__subtitle {
        font-size: 12px !important;
        line-height: 17px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important
    }

    .card-order-info__price {
        width: auto !important
    }

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important
    }

    .card-order-info-description {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: clamp(60px, 60px + (100vw - 424px) * .0334, 80px) !important;
        padding: clamp(12px, 12px + (100vw - 424px) * .02, 24px) 0 !important;
        margin: 0 !important;
        gap: clamp(4px, 4px + (100vw - 424px) * .0067, 8px) !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important
    }

    .card-order-info-description>.card-order-info__description-title {
        font-size: 10px !important;
        line-height: 12px !important;
        margin-bottom: 0 !important;
        color: #888 !important
    }

    .card-order-info-description .card-order-info__description {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        text-overflow: ellipsis !important;
        max-height: none !important
    }

    .card-order-info-amount {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        padding: clamp(0px, 0px + (100vw - 424px) * .0267, 16px) 0 !important;
        margin-left: 0 !important;
        align-items: flex-start !important;
        gap: clamp(4px, 4px + (100vw - 424px) * .0067, 8px) !important;
        box-sizing: border-box !important;
        height: fit-content !important;
        justify-content: flex-start !important
    }

    .card-order-info-amount .card-order-info__amount {
        font-size: 10px !important;
        line-height: 12px !important;
        margin-bottom: 0 !important;
        color: #888 !important
    }

    .card-order-info-amount .card-order-info__price {
        font-size: 12px !important;
        line-height: 16px !important
    }

    .card-order-icons {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        padding: clamp(0px, 0px + (100vw - 424px) * .0134, 8px) 0 0 0 !important;
        margin: 0 !important
    }

    .card-order-icons button,
    .card-order-icons .card-order__icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important
    }
}

@media screen and (max-width: 424px) {
    .section-order {
        padding: 16px 0 24px !important
    }

    .container-order {
        flex-direction: column;
        gap: 16px;
        width: 100%;
        padding: 0 16px;
        align-items: stretch !important;
        box-sizing: border-box !important
    }

    .card-order {
        flex-direction: column;
        align-items: flex-start;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        min-height: auto !important;
        padding: 12px !important;
        gap: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important
    }

    .card-order__image {
        width: 80px !important;
        height: 59px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        min-height: 59px !important;
        max-height: 59px !important;
        flex-shrink: 0 !important;
        padding: 0 !important;
        margin: 0 !important
    }

    .card-order__image img {
        width: 80px !important;
        height: 59px !important
    }

    .mobile-order {
        width: calc(100% + 24px) !important;
        margin: 0 -12px !important;
        gap: 8px !important;
        border-bottom: 1px solid #dedede;
        padding: 0 12px 12px !important;
        align-items: center !important;
        box-sizing: border-box !important
    }

    .mobile-order .card-order-info.card-order-info-mb {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: flex-start !important;
        gap: 4px !important
    }

    .card-order-info {
        width: 100% !important;
        padding: 0 !important;
        gap: 4px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .card-order-info__title a,
    .card-order-info__title-checkout a,
    .card-order-info__title-basket a {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .card-order-info__subtitle {
        font-size: 10px !important;
        line-height: 14px !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .card-order-info__price {
        width: auto
    }

    .card-order-info__description-checkout,
    .card-order-info__description-basket {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important
    }

    .card-order-info-description {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: fit-content !important;
        padding: 0 !important;
        margin: 12px 0 !important;
        gap: 4px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        justify-content: flex-start
    }

    .card-order-info-description>.card-order-info__description-title {
        font-size: 12px !important;
        line-height: 14px !important;
        margin-bottom: 0 !important
    }

    .card-order-info-description .card-order-info__description {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        text-overflow: ellipsis !important
    }

    .card-order-info-amount {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin-left: 0 !important;
        align-items: flex-start !important;
        gap: 4px !important;
        box-sizing: border-box !important;
        height: fit-content !important;
        justify-content: flex-start !important;
        margin-bottom: 12px !important
    }

    .card-order-info-amount .card-order-info__amount {
        font-size: 10px !important;
        line-height: 14px !important;
        margin-bottom: 0 !important
    }

    .card-order-info-amount .card-order-info__price {
        font-size: 12px !important;
        line-height: 16px !important
    }

    .card-order-icons {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        padding: 0 !important;
        margin: 0 0 16px !important
    }

    .card-order-icons button,
    .card-order-icons .card-order__icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important
    }
}

@media screen and (width: 1360px) {
    .container-order {
        width: 1216px !important;
        max-width: 1216px !important;
        margin: 0 auto !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-order {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        gap: clamp(24px, 24px + (100vw - 1360px) * .0143, 32px) !important
    }

    .container-order .card-order {
        width: 100% !important;
        max-width: 100% !important;
        height: clamp(144px, 144px + (100vw - 1360px) * .0857, 192px) !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        padding: clamp(20px, 20px + (100vw - 1360px) * .0071, 24px) clamp(20px, 20px + (100vw - 1360px) * .0357, 40px) !important;
        gap: clamp(24px, 24px + (100vw - 1360px) * -.0429, 0.01px) !important;
        box-sizing: border-box !important;
        overflow: hidden !important
    }

    .container-order .mobile-order {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 32px !important;
        border-bottom: none !important;
        padding: 0 !important;
        flex-shrink: 0 !important;
        height: clamp(auto, 72px, 72px) !important
    }

    .container-order .mobile-order:has(.card-order-info-mb) {
        width: clamp(511px, 511px + (100vw - 1360px) * .0661, 548px) !important;
        min-width: clamp(511px, 511px + (100vw - 1360px) * .0661, 548px) !important;
        max-width: clamp(511px, 511px + (100vw - 1360px) * .0661, 548px) !important
    }

    .container-order .card-order__image {
        width: clamp(179px, 179px + (100vw - 1360px) * .0911, 230px) !important;
        min-width: clamp(179px, 179px + (100vw - 1360px) * .0911, 230px) !important;
        max-width: clamp(179px, 179px + (100vw - 1360px) * .0911, 230px) !important;
        height: clamp(112px, 112px + (100vw - 1360px) * .0571, 144px) !important;
        min-height: clamp(112px, 112px + (100vw - 1360px) * .0571, 144px) !important;
        max-height: clamp(112px, 112px + (100vw - 1360px) * .0571, 144px) !important;
        flex-shrink: 0 !important;
        padding: clamp(20px, 20px + (100vw - 1360px) * .0179, 30px) 0 !important
    }

    .container-order .card-order__image img {
        width: clamp(179px, 179px + (100vw - 1360px) * .0911, 230px) !important;
        height: clamp(112px, 112px + (100vw - 1360px) * .0571, 144px) !important;
        object-fit: cover !important
    }

    .container-order .card-order__image .card-image__icon {
        width: 24px !important;
        height: 24px !important;
        object-fit: contain !important
    }

    .container-order .card-order-info {
        height: clamp(auto, 72px, 72px) !important;
        justify-content: center !important;
        width: clamp(200px, 200px + (100vw - 1360px) * .0679, 238px) !important;
        min-width: clamp(200px, 200px + (100vw - 1360px) * .0679, 238px) !important
    }

    .container-order .mobile-order .card-order-info.card-order-info-mb {
        width: clamp(300px, 300px + (100vw - 1360px) * .2679, 450px) !important;
        min-width: clamp(300px, 300px + (100vw - 1360px) * .2679, 450px) !important;
        max-width: clamp(300px, 300px + (100vw - 1360px) * .2679, 450px) !important;
        padding-right: clamp(32px, 32px + (100vw - 1360px) * .0286, 48px) !important;
        padding-left: clamp(0px, 0px + (100vw - 1360px) * .0286, 16px) !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        box-sizing: border-box !important
    }

    .container-order .card-order-info__title a,
    .container-order .card-order-info__title-checkout a,
    .container-order .card-order-info__title-basket a {
        font-size: clamp(18px, 18px + (100vw - 1360px) * .0107, 24px) !important;
        line-height: 1.33 !important
    }

    .container-order .card-order-info__subtitle {
        font-size: clamp(16px, 16px + (100vw - 1360px) * .0036, 18px) !important;
        line-height: 1.33 !important
    }

    .container-order .card-order-info-description {
        width: clamp(324px, 324px + (100vw - 1360px) * .25, 464px) !important;
        min-width: clamp(324px, 324px + (100vw - 1360px) * .25, 464px) !important;
        max-width: clamp(324px, 324px + (100vw - 1360px) * .25, 464px) !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        /* margin-left: clamp(0px, 0px + (100vw - 1360px) * .3929, 220px) !important; */
        margin-left: clamp(0.01px, 0.01px + (100vw - 1360px) * .3929, 220px) !important;
        margin-right: clamp(8px, 8px + (100vw - 1360px) * .0571, 40px) !important;
        height: auto !important;
        min-height: clamp(80px, 80px + (100vw - 1360px) * .0357, 100px) !important;
        max-height: none !important;
        overflow: visible !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: flex-start !important;
        padding-left: 0 !important
    }

    .container-order .card-order-info-description .card-order-info__description-title,
    .container-order .card-order-info-description .card-order-info__description {
        font-size: clamp(16px, 16px + (100vw - 1360px) * .0143, 24px) !important;
        line-height: 1.17 !important
    }

    .container-order .card-order-info-amount {
        width: clamp(195px, 195px + (100vw - 1360px) * .0018, 196px) !important;
        min-width: clamp(195px, 195px + (100vw - 1360px) * .0018, 196px) !important;
        flex-shrink: 0 !important;
        height: 100% !important;
        align-items: flex-start !important;
        justify-content: center !important;
        margin-left: 0 !important
    }

    .container-order .card-order-info-amount .card-order-info__amount {
        font-size: clamp(16px, 16px + (100vw - 1360px) * .0143, 24px) !important;
        line-height: 1.17 !important;
        color: #888 !important
    }

    .container-order .card-order-info-amount .card-order-info__price {
        font-size: clamp(16px, 16px + (100vw - 1360px) * .0071, 20px) !important;
        line-height: 1.4 !important
    }

    .container-order .card-order-icons {
        flex-shrink: 0 !important;
        justify-content: flex-end !important;
        align-items: center !important
    }
}

@media screen and (max-width: 1024px) {
    .services-application .checkbox-container .checkbox-icon {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 424px) {
    .card-order {
        width: 100% !important
    }
}

@media screen and (max-width: 360px) {
    .section-order {
        padding: 16px 0 24px !important
    }

    .container-order {
        flex-direction: column;
        gap: 16px;
        width: 100%;
        padding: 0;
        align-items: flex-start !important;
        box-sizing: border-box !important
    }

    .card-order {
        flex-direction: column;
        align-items: flex-start;
        width: 296px !important;
        max-width: 296px !important;
        min-width: 296px !important;
        height: 285px !important;
        max-height: 285px !important;
        min-height: 285px !important;
        padding: 12px !important;
        gap: 8px !important;
        margin: 0 16px !important;
        box-sizing: border-box !important;
        overflow: hidden !important
    }

    .card-order__image {
        width: 80px !important;
        height: 59px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        min-height: 59px !important;
        max-height: 59px !important;
        flex-shrink: 0 !important;
        padding: 4px 0 !important
    }

    .card-order__image img {
        width: 80px !important;
        height: 59px !important
    }

    .mobile-order {
        width: calc(100% + 24px) !important;
        margin: 0 -12px !important;
        gap: 8px !important;
        border-bottom: 1px solid #dedede;
        padding: 0 12px 8px !important;
        align-items: center !important;
        box-sizing: border-box !important
    }

    .mobile-order .card-order-info.card-order-info-mb {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: flex-start !important
    }

    .card-order-info {
        width: 100% !important;
        padding: 0 !important;
        gap: 4px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .card-order-info__title a,
    .card-order-info__title-checkout a,
    .card-order-info__title-basket a {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .card-order-info__subtitle {
        font-size: 10px !important;
        line-height: 14px !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .card-order-info-description {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        padding: 8px 0 !important;
        margin: 0 !important;
        gap: 4px !important;
        box-sizing: border-box !important;
        overflow: hidden !important
    }

    .card-order-info-description>.card-order-info__description-title {
        font-size: 12px !important;
        line-height: 14px !important;
        margin-bottom: 0 !important
    }

    .card-order-info-description .card-order-info__description {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 16px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        text-overflow: ellipsis !important
    }

    .card-order-info-amount {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        padding: 8px 0 !important;
        margin-left: 0 !important;
        align-items: flex-start !important;
        gap: 4px !important;
        box-sizing: border-box !important
    }

    .card-order-info-amount .card-order-info__amount {
        font-size: 10px !important;
        line-height: 14px !important;
        margin-bottom: 0 !important
    }

    .card-order-info-amount .card-order-info__price {
        font-size: 12px !important;
        line-height: 16px !important
    }

    .card-order-icons {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        padding: 0 !important;
        margin: 0 0 16px !important
    }

    .card-order-icons button,
    .card-order-icons .card-order__icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important
    }
}

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

    .section-order:has(.section-order__empty),
    .section-order--empty {
        height: 708px !important;
        min-height: 708px !important;
        max-height: 708px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important
    }

    div.section-order.section-order--empty,
    body .section-order.section-order--empty,
    body div.section-order.section-order--empty {
        height: 708px !important;
        min-height: 708px !important;
        max-height: 708px !important
    }
}

@media screen and (min-width: 1920px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 24px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 8px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 8px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 0
    }
}

@media screen and (max-width: 1024px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 0
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 0
    }
}

@media screen and (max-width: 424px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 0
    }
}

@media screen and (max-width: 360px) {
    .section-order:has(.section-order__empty-text) .container-button-order {
        margin-top: 0
    }
}

.card {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #ebebeb;
    display: flex;
    flex-direction: column;
    min-height: 422px;
    max-height: 422px;
    width: 100%;
    flex: 1;
    align-items: center;
    position: relative;
    justify-content: space-between;
    background: #fff;
    cursor: pointer;
    highlight-color: transparent;
    -webkit-tap-highlight-color: transparent
}

@media screen and (min-width: 1920px) {
    .card {
        min-height: 569px;
        padding: 20px
    }
}

@media screen and (max-width: 1359px) {
    .card {
        padding: 12px;
        max-height: 345px;
        min-height: 345px;
        border-radius: 8px
    }
}

@media screen and (max-width: 1023px) {
    .card {
        padding: 8px;
        min-height: 272px;
        max-height: 272px
    }
}

.card-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-height: 252px;
    width: 100%;
    position: relative
}

@media screen and (min-width: 1920px) {
    .card-image {
        max-height: 299px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1359px) {
    .card-image {
        max-height: 181px;
        min-height: 181px
    }
}

@media screen and (max-width: 1023px) {
    .card-image {
        max-height: 148px;
        min-height: 148px
    }
}

.card-image img {
    max-width: 270px;
    object-fit: cover
}

@media screen and (min-width: 1920px) {
    .card-image img {
        max-width: 290px
    }
}

@media screen and (max-width: 1359px) {
    .card-image img {
        max-height: 145px
    }
}

@media screen and (max-width: 1023px) {
    .card-image img {
        max-height: 140px;
        width: 100%
    }
}

.card-comment {
    position: absolute;
    top: 1px;
    right: 0;
    display: flex;
    align-items: center;
    column-gap: 4px;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    color: #000;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .card-comment {
        right: 0;
        column-gap: 4px;
        top: 4px;
        font-size: 15px;
        line-height: 24px
    }

    .card-comment__icon {
        width: 22px;
        height: 24px
    }
}

@media screen and (max-width: 723px) {
    .card-comment {
        column-gap: 2px
    }
}

.card-comment-text {
    color: #888
}

@media screen and (max-width: 1023px) {
    .card-comment-text {
        font-size: 8px;
        line-height: 12px
    }
}

.card-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 144px;
    padding-top: 16px
}

@media screen and (min-width: 1920px) {
    .card-info {
        padding-top: 16px;
        height: 214px
    }
}

@media screen and (max-width: 1023px) {
    .card-info {
        padding-top: 8px;
        min-height: max-content;
        max-height: max-content
    }
}

.card-info__title {
    display: block;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #151514;
    text-decoration: none;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    align-self: stretch;
    overflow: hidden;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .card-info__title {
        font-size: 22px;
        line-height: 24px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1359px) {
    .card-info__title {
        margin-bottom: 4px
    }
}

@media screen and (max-width: 1023px) {
    .card-info__title {
        width: 176px;
        line-height: 14px;
        max-height: 30px;
        min-height: 30px
    }
}

@media screen and (max-width: 723px) {
    .card-info__title {
        width: 144px
    }
}

.card-info__title a {
    display: block;
    max-width: 270px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #151514;
    text-decoration: none;
    transition: color .5s ease-out
}

@media screen and (min-width: 1920px) {
    .card-info__title a {
        max-width: 370px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-info__title a {
        width: 204px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .card-info__title a {
        width: 142px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 723px) {
    .card-info__title a {
        width: 144px
    }
}

.card-info__title a:hover {
    color: #151514cc;
    transition: color 0s
}

.card-info__subtitle {
    display: block;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514;
    text-decoration: none;
    height: 32px
}

@media screen and (min-width: 1920px) {
    .card-info__subtitle {
        font-size: 16px;
        line-height: 24px;
        height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .card-info__subtitle {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .card-info__subtitle {
        font-size: 9px;
        line-height: 12px
    }
}

.card-info__subtitle a {
    display: block;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .card-info__subtitle a {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .card-info__subtitle a {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    .card-info__subtitle a {
        font-size: 12px;
        line-height: 14px
    }
}

.card-footer {
    position: relative
}

.card-price {
    display: block;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
    color: #151514;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .card-price {
        font-size: 32px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-price {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .card-price {
        font-size: 14px;
        line-height: 20px
    }
}

.card-price a {
    display: block;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 16px;
    color: #151514;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .card-price a {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-price a {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .card-price a {
        font-size: 20px;
        line-height: 16px
    }
}

.card-price--sale {
    color: #4dcc8c
}

.card-price--old {
    position: absolute;
    top: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #b6b6b6;
    text-decoration: line-through
}

@media screen and (min-width: 1920px) {
    .card-price--old {
        font-size: 20px;
        line-height: 24px;
        top: -20px
    }
}

@media screen and (max-width: 1359px) {
    .card-price--old {
        top: -4px
    }
}

.card-price--range {
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .card-price--range {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-price--range {
        font-size: 13px;
        line-height: 16px;
        margin-bottom: 4px
    }
}

@media screen and (max-width: 1023px) {
    .card-price--range {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 0
    }
}

@media screen and (max-width: 723px) {
    .card-price--range {
        font-size: 13px;
        line-height: 16px
    }
}

.card-buy {
    width: max-content;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 32px;
    border-radius: 12px;
    background: transparent;
    border: 1px solid #58c7f6;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .card-buy {
        width: 56px;
        height: 56px
    }
}

@media screen and (max-width: 1359px) {
    .card-buy {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .card-buy {
        width: 36px;
        height: 36px
    }
}

@media screen and (min-width: 1920px) {
    .card-buy svg {
        min-width: 38px;
        min-height: 36px;
        transform: none
    }
}

@media screen and (max-width: 1359px) {
    .card-buy svg {
        transform: scale(.9)
    }
}

@media screen and (max-width: 1023px) {
    .card-buy svg {
        transform: none;
        width: 20px;
        height: 20px
    }
}

.card-buy svg path {
    transition: fill .25s ease
}

.card-buy:hover {
    background-color: #58c7f7
}

.card-buy:hover svg path {
    fill: #fff
}

.card-buy--count {
    width: max-content;
    min-width: 52px;
    max-width: 60px;
    border-radius: 24px;
    border: 1px solid #58c7f6;
    padding: 0 8px;
    justify-content: space-between;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .card-buy--count {
        min-width: 68px;
        max-width: 84px;
        border-radius: 28px
    }
}

@media screen and (max-width: 1359px) {
    .card-buy--count {
        min-width: 32px;
        max-width: 50px;
        padding: 0 6px
    }
}

@media screen and (max-width: 1023px) {
    .card-buy--count {
        min-width: 40px;
        max-width: 60px
    }
}

.card-buy--count-numb {
    display: block;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #58c7f7
}

@media screen and (min-width: 1920px) {
    .card-buy--count-numb {
        font-size: 16px;
        line-height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .card-buy--count-numb {
        font-size: 10px;
        line-height: 14px;
        font-weight: 400
    }
}

.card-buy--count svg {
    min-width: 24px;
    max-width: 24px
}

@media screen and (min-width: 1920px) {
    .card-buy--count svg {
        transform: none;
        min-width: 38px;
        max-width: 38px;
        min-height: 34px;
        max-height: 34px
    }
}

@media screen and (max-width: 1359px) {
    .card-buy--count svg {
        transform: none;
        min-width: 20px;
        max-width: 20px;
        min-height: 20px;
        max-height: 20px
    }
}

.card-buy--count-add {
    display: none
}

.card-buy--count:hover .card-buy--count-numb {
    color: #fff
}

.card--sold .card-info,
.card--sold .card-image__photo {
    opacity: .5
}

.card--sold .product-page-equipment__item __item {
    color: #b6b6b6
}

.card--sold .card .product-page-equipment__item--selected,
.card--sold .card .product-page-equipment__item--selected:hover {
    border-color: #b6b6b6
}

.card--sold .product-page-equipment__button-wrapper {
    bottom: -1px
}

.card--sold .card .product-page-equipment--colors .card-colors__item {
    opacity: .3
}

.card--sold .card .product-page-equipment--colors .card-colors__item.checked:before {
    border: none
}

.card--sold .card-buy {
    display: none
}

.card-timer {
    position: absolute;
    top: 8px;
    left: 8px;
    border-radius: 3px;
    border: 1px solid #4dcc8c
}

@media screen and (min-width: 1920px) {
    .card-timer {
        top: 18px;
        left: 6px;
        border-radius: 4px
    }
}

.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: 1359px) {
    .card-timer__title {
        padding-block: 2px;
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    .card-timer__title {
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 723px) {
    .card-timer__title {
        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: 1359px) {
    .card-timer__value {
        font-size: 8px;
        line-height: 14px
    }
}

.card-timer--hidden {
    display: none
}

.cards-list {
    align-items: center;
    margin-top: 40px !important
}

@media screen and (max-width: 1359px) {
    .cards-list {
        margin-top: 24px !important
    }
}

@media screen and (max-width: 723px) {
    .cards-list {
        margin-bottom: 0;
        margin-top: 18px !important
    }
}

.cards--mobile {
    display: none;
    padding: 4px 16px;
    background: #fff;
    overflow: hidden
}

@media screen and (max-width: 1023px) {
    .cards--mobile {
        display: flex;
        margin-top: 24px
    }
}

.cards--mobile .cards-list {
    height: 298px;
    display: flex;
    column-gap: 8px;
    margin-top: 0;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch
}

.card-colors {
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin-bottom: 8px
}

@media screen and (max-width: 1359px) {
    .card-colors {
        margin-bottom: 6px
    }
}

@media screen and (max-width: 1023px) {
    .card-colors {
        column-gap: 12px
    }
}

.card-colors__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    position: relative;
    border-radius: 50%
}

@media screen and (min-width: 1920px) {
    .card-colors__item {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .card-colors__item {
        width: 16px;
        height: 16px
    }
}

.card-colors__item.checked:before {
    border-color: #128de7
}

.card-colors__item:before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    border: 1px solid transparent;
    border-radius: 50%;
    transition: border .25s ease
}

.card-buy-viewed {
    width: max-content;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 32px;
    border-radius: 12px;
    background: #58c7f6;
    border: 1px solid #58c7f6;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px
}

.card-buy-viewed:hover {
    background-color: #6cd3ff
}

@media screen and (min-width: 1920px) {
    .card-buy-viewed {
        padding: 18px 40px;
        gap: 12px;
        font-size: 16px;
        line-height: 24px;
        height: 60px;
        width: 137px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .card-buy-viewed {
        padding: 10px 16px;
        gap: 12px;
        height: 36px;
        width: 75px;
        border-radius: 10px
    }
}

@media screen and (max-width: 1023px) {
    .card-buy-viewed {
        padding: 8px 12px;
        height: 28px;
        width: 53px;
        font-size: 8px;
        line-height: 12px
    }
}

.old-price {
    color: var(--Text-Grey_2, #b6b6b6);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    text-decoration: line-through;
    position: absolute;
    top: 0
}

@media screen and (min-width: 1920px) {
    .old-price {
        font-size: 18px;
        font-weight: 500;
        line-height: 18px
    }
}

@media screen and (max-width: 1023px) {
    .old-price {
        font-size: 10px;
        line-height: 6px
    }
}

.card-new-price {
    color: #ff3f5f;
    font-size: 24px;
    font-weight: 500;
    line-height: 28px
}

.product-button-prev,
.product-button-next {
    position: absolute;
    top: 50%;
    z-index: 10;
    transform: translateY(-50%);
    width: 64px;
    height: 64px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: background-color .3s ease;
    border: 1px solid #dedede;
    box-shadow: 0 0 24px #0000001a;
    opacity: .9
}

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

    .product-button-prev,
    .product-button-next {
        top: 52%;
        width: 40px;
        height: 40px
    }
}

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

    .product-button-prev,
    .product-button-next {
        width: 38px;
        height: 38px
    }
}

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

    .product-button-prev,
    .product-button-next {
        width: 32px;
        height: 32px
    }
}

.product-button-prev:hover,
.product-button-next:hover {
    border: 1px solid #4da6cd
}

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

    .product-button-prev,
    .product-button-next {
        width: 80px;
        height: 80px
    }
}

.product-button-prev {
    left: 18px
}

@media screen and (min-width: 1920px) {
    .product-button-prev {
        left: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-button-prev {
        left: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-button-prev {
        left: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-button-prev {
        left: 3px
    }
}

.product-button-prev svg {
    width: 16px;
    height: 28px
}

@media screen and (max-width: 1359px) {
    .product-button-prev svg {
        width: 12px;
        height: 21px
    }
}

.product-button-next {
    right: 18px;
    z-index: 4
}

@media screen and (min-width: 1920px) {
    .product-button-next {
        right: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-button-next {
        right: 8px
    }
}

@media screen and (max-width: 1023px) {
    .product-button-next {
        right: 0
    }
}

.product-button-next svg {
    width: 16px;
    height: 28px
}

@media screen and (min-width: 1920px) {
    .product-button-next svg {
        width: 20px;
        height: 35px
    }
}

@media screen and (max-width: 1359px) {
    .product-button-next svg {
        width: 12px;
        height: 21px
    }
}

@media screen and (max-width: 1023px) {
    .product-button-next svg {
        width: 10px;
        height: 16px
    }
}

@media screen and (max-width: 723px) {
    .product-button-next svg {
        width: 8px;
        height: 14px
    }
}

.product-button-prev svg {
    transform: rotate(180deg);
    position: absolute;
    top: 27%;
    left: 33%
}

@media screen and (min-width: 1920px) {
    .product-button-prev svg {
        width: 20px;
        height: 35px;
        top: 28%;
        left: 30%
    }
}

@media screen and (max-width: 1023px) {
    .product-button-prev svg {
        top: 25%;
        width: 10px;
        height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-button-prev svg {
        top: 23%;
        left: 32%
    }
}

@media screen and (max-width: 723px) {
    .product-button-prev svg {
        width: 8px;
        height: 14px;
        top: 26%;
        left: 33%
    }
}

.cards-list .swiper-slide {
    width: auto
}

.card-info-line {
    width: 100%;
    height: 1px;
    background-color: #ebebeb;
    position: absolute;
    left: 0;
    bottom: 36%
}

@media screen and (min-width: 1920px) {
    .card-info-line {
        bottom: 42%
    }
}

@media screen and (max-width: 1359px) {
    .card-info-line {
        bottom: 40%
    }
}

@media screen and (max-width: 1023px) {
    .card-info-line {
        bottom: 40%
    }
}

.cards {
    position: relative
}

@media screen and (max-width: 1023px) {
    .section-details-results {
        padding: 16px 16px 40px !important
    }
}

.card-article {
    display: flex;
    align-items: flex-end;
    flex: 1;
    min-height: 100%;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 8px -1px #372f321a;
    filter: drop-shadow(0px 0px 2px #f3f3f3);
    border-radius: 3px;
    text-decoration: none;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .card-article {
        min-height: 484px;
        max-height: 484px
    }
}

@media screen and (max-width: 1024px) {
    .card-article {
        max-height: 272px;
        min-height: 272px
    }
}

@media screen and (max-width: 768px) {
    .card-article {
        max-height: 288px;
        min-height: 288px;
        width: 160px
    }
}

.card-article__container {
    height: 328px;
    width: 208px;
    padding: 8px
}

@media screen and (min-width: 1920px) {
    .card-article__container {
        min-height: 514px;
        min-width: 611px;
        max-width: 611px;
        padding: 0
    }
}

@media screen and (max-width: 1024px) {
    .card-article__container {
        width: 171px;
        height: 272px;
        padding: 0
    }
}

@media screen and (max-width: 768px) {
    .card-article__container {
        height: 288px;
        width: 160px;
        padding: 0
    }
}

.card-article__bg {
    width: 100%;
    height: 100%;
    border-radius: 12px 12px 0 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1
}

.card-article__info {
    padding: 8px 8px 16px
}

@media screen and (min-width: 1920px) {
    .card-article__info {
        padding: 24px
    }
}

@media screen and (max-width: 1024px) {
    .card-article__info {
        padding: 16px
    }
}

.card-article__info-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .card-article__info-title {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .card-article__info-title {
        font-size: 13px
    }
}

.brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 272px;
    max-height: 272px;
    min-width: 272px;
    min-height: 272px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .brand {
        max-width: 398px;
        max-height: 398px;
        min-width: 398px;
        min-height: 398px
    }
}

@media screen and (max-width: 1024px) {
    .brand {
        max-width: 214px;
        max-height: 214px;
        min-width: 214px;
        min-height: 214px
    }
}

@media screen and (max-width: 768px) {
    .brand {
        min-width: calc(50% - 8px);
        max-width: calc(50% - 8px);
        min-height: 160px;
        max-height: 160px
    }
}

.brand-image {
    max-width: 184px;
    min-width: 184px;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .brand-image {
        max-width: 260px;
        min-width: 260px
    }
}

@media screen and (max-width: 1024px) {
    .brand-image {
        max-width: 146px;
        min-width: 146px
    }
}

@media screen and (max-width: 768px) {
    .brand-image {
        max-width: 110px;
        min-width: 110px
    }
}

.brand-image img {
    width: 100%;
    object-fit: cover
}

.brand-title {
    position: absolute;
    bottom: 16px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .brand-title {
        font-size: 24px;
        line-height: 24px;
        bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .brand-title {
        font-size: 12px;
        line-height: 16px
    }
}

.card-rent {
    display: flex;
    padding: 16px 16px 24px;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    border-radius: 24px;
    border: 1px solid #dedede;
    position: relative;
    cursor: pointer;
    width: 100%;
    min-height: 415px;
    max-height: 100%
}

@media screen and (min-width: 1920px) {
    .card-rent {
        width: 100%;
        min-height: 523px;
        max-height: 523px;
        padding: 24px
    }
}

@media screen and (max-width: 1024px) {
    .card-rent {
        min-height: 356px;
        max-height: 356px;
        padding: 12px
    }
}

@media screen and (max-width: 768px) {
    .card-rent {
        min-height: 293px;
        padding: 12px 12px 16px
    }
}

@media screen and (max-width: 423px) {
    .card-rent {
        min-height: 301px
    }
}

.card-rent__image {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative
}

.card-rent__image img {
    width: 240px;
    height: 151px;
    object-fit: cover
}

@media screen and (min-width: 1920px) {
    .card-rent__image img {
        width: 327px;
        height: 205px
    }
}

@media screen and (max-width: 1024px) {
    .card-rent__image img {
        width: 248px;
        height: 148px
    }
}

@media screen and (max-width: 768px) {
    .card-rent__image img {
        width: 148px;
        height: 102px
    }
}

@media screen and (max-width: 423px) {
    .card-rent__image img {
        width: 272px;
        height: 110px
    }
}

.card-rent-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch
}

@media screen and (max-width: 1024px) {
    .card-rent-info {
        gap: 8px
    }
}

@media screen and (max-width: 768px) {
    .card-rent-info {
        gap: 4px
    }
}

.card-rent-info__title {
    width: 242px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    max-height: 48px;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .card-rent-info__title {
        width: 370px;
        max-height: 64px
    }
}

@media screen and (max-width: 1024px) {
    .card-rent-info__title {
        width: 254px
    }
}

@media screen and (max-width: 768px) {
    .card-rent-info__title {
        width: 148px
    }
}

@media screen and (max-width: 423px) {
    .card-rent-info__title {
        width: 272px
    }
}

.card-rent-info__title a {
    font-family: Headline Base;
    font-size: 16px;
    line-height: 1.5;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .card-rent-info__title a {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .card-rent-info__title a {
        font-size: 14px;
        line-height: 1.42
    }
}

.card-rent-info__subtitle {
    overflow: hidden;
    color: #151514;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42
}

@media screen and (min-width: 1920px) {
    .card-rent-info__subtitle {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .card-rent-info__subtitle {
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 768px) {
    .card-rent-info__subtitle {
        font-size: 10px;
        line-height: 1.4;
        min-height: 27px
    }
}

.card-rent .card-footer-servise {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .card-rent .card-footer-servise {
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .card-rent .card-footer-servise {
        gap: 8px
    }
}

.card-rent .card-rent-price {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #151514;
    font-family: Inter;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .card-rent .card-rent-price {
        font-size: 28px;
        line-height: 1.14
    }
}

@media screen and (max-width: 1024px) {
    .card-rent .card-rent-price {
        font-size: 14px;
        line-height: 1.42;
        margin-top: 16px
    }
}

@media screen and (max-width: 423px) {
    .card-rent .card-rent-price {
        margin-top: 8px;
        font-size: 16px;
        line-height: 1.5
    }
}

.card-rent .card-rent-price__span {
    font-size: 14px;
    line-height: 1.42
}

@media screen and (min-width: 1920px) {
    .card-rent .card-rent-price__span {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .card-rent .card-rent-price__span {
        font-size: 12px;
        line-height: 1.33
    }
}

.card-rent .button-rent:hover {
    background: #6cd3ff
}

.card-rent .button-rent {
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    background: #58c7f6;
    width: 100%;
    min-height: 52px;
    max-height: 52px;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.42;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .card-rent .button-rent {
        width: 100%;
        min-height: 64px;
        max-height: 64px;
        font-size: 16px;
        line-height: 1.5
    }
}

@media screen and (max-width: 1024px) {
    .card-rent .button-rent {
        min-height: 48px;
        max-height: 48px;
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 768px) {
    .card-rent .button-rent {
        min-height: 40px;
        max-height: 40px;
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1023px) {
    .recommended-item {
        width: 100%
    }
}

.card-results {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 102px;
    max-height: 113px;
    padding: 12px;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
    border-radius: 12px;
    border: .5px solid var(--Stroke-Grey, #dedede);
    background: var(--Back-Grey, #f4f4f4)
}

@media screen and (max-width: 1023px) {
    .card-results {
        padding: 8px
    }
}

.card-results .title-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

@media screen and (max-width: 1023px) {
    .card-results .title-container {
        gap: 4px
    }
}

.card-results .card-image {
    min-width: 52px;
    max-width: 52px;
    min-height: 52px;
    max-height: 52px
}

.card-results .card-image img {
    width: 52px;
    height: 52px
}

.card-results .card-info__title {
    width: max-content;
    min-height: 16px;
    max-height: 16px;
    margin-bottom: 6px
}

.card-results .card-info__title a {
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    align-self: stretch;
    width: 100%;
    min-width: 386px
}

@media screen and (max-width: 1023px) {
    .card-results .card-info__title a {
        max-width: 584px;
        min-width: 584px
    }
}

@media screen and (max-width: 723px) {
    .card-results .card-info__title a {
        max-width: 248px;
        min-width: 248px
    }
}

.card-results .card-info__subtitle {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    align-self: stretch;
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    padding: 0;
    height: 14px
}

@media screen and (max-width: 723px) {
    .card-results .card-info__subtitle {
        max-width: 248px
    }
}

.card-results .card-info {
    position: relative;
    padding-top: 0
}

.card-results .card-info-line {
    top: -6px
}

.card-results .product-lables {
    position: unset;
    display: flex;
    flex-direction: unset;
    gap: 6px
}

.card-results .product-lables .product-lable {
    gap: 3px;
    padding: 2px 4px !important
}

.card-results .product-lables .product-lable__text {
    font-size: 8px;
    font-weight: 600;
    line-height: 12px
}

.card-results .product-lables .product-lable__img {
    width: 7px;
    height: 9px
}

.card-results .card-footer {
    display: flex;
    padding: 0 4px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch
}

@media screen and (max-width: 1023px) {
    .card-results .card-footer {
        padding: 0;
        align-items: flex-end
    }
}

.card-results .old-price {
    top: -30%;
    left: 0
}

.card-results .card-comment {
    position: unset
}

.card-results .card-buy-viewed {
    display: flex;
    padding: 4px 10px;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    background: var(--Controls-Blue, #58c7f6);
    width: 32px;
    height: 20px;
    cursor: pointer
}

.card-results .card-buy-viewed:hover {
    background: #6cd3ff
}

.card-results .card-buy-viewed svg {
    width: 12px;
    height: 10px
}

.card-results .left-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

.card-results .red-price {
    color: #ff3f5f
}

.card-results .card-comment-text {
    font-size: 8px;
    line-height: 12px
}

.card-results .card-comment__icon {
    width: 10px;
    height: 10px
}

@media screen and (max-width: 1023px) {
    .card-comment__icon {
        width: 10px !important;
        height: 10px
    }
}

@media screen and (max-width: 1023px) {
    .oldPriceFooter {
        margin-top: 6px
    }
}

.article-label {
    max-width: max-content;
    padding: 4px;
    background: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a);
    border-radius: 3px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    .article-label {
        padding: 8px;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .article-label {
        font-size: 10px;
        line-height: 12px
    }
}

.product-status {
    padding: 4px 6px;
    border: 1px solid #2467cc;
    border-radius: 6px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #2467cc
}

@media screen and (min-width: 1920px) {
    .product-status {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .product-status {
        font-size: 10px;
        line-height: 12px;
        padding: 4px
    }
}

@media screen and (max-width: 768px) {
    .product-status {
        font-size: 12px;
        line-height: 16px;
        padding: 4px 6px
    }
}

@media screen and (max-width: 424px) {
    .product-status {
        font-size: 10px;
        line-height: 14px
    }
}

.product-lables {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    row-gap: 8px;
    z-index: 2
}

@media screen and (max-width: 1024px) {
    .product-lables {
        row-gap: 4px
    }
}

.product-lable {
    display: flex;
    align-items: center;
    width: max-content;
    padding: 5px 7px;
    gap: 5px;
    border-radius: 6px
}

@media screen and (min-width: 1920px) {
    .product-lable {
        border-radius: 8px
    }
}

@media screen and (max-width: 1359px) {
    .product-lable {
        padding: 4px 6px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-lable {
        height: 16px;
        padding: 2px 4px
    }
}

@media screen and (max-width: 723px) {
    .product-lable {
        height: 20px;
        padding: 2px 4px !important;
        gap: 3px;
        max-height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .product-lable img {
        width: 24px;
        height: 24px
    }
}

.product-lable__text {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .product-lable__text {
        font-size: 15px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .product-lable__text {
        font-size: 10px
    }
}

@media screen and (max-width: 1023px) {
    .product-lable__text {
        font-size: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-lable__text {
        font-size: 8px;
        line-height: 12px
    }
}

.product-lable--discount {
    background: #4dcc8c;
    color: #fff
}

.product-lable--private {
    background: radial-gradient(90% 400% at 0% 0%, #b847e1, #eb606a);
    color: #fff
}

.product-lable--hit {
    background: #f0733e;
    color: #fff
}

.product-lable--hit img {
    min-width: 9px;
    max-width: 9px;
    min-height: 11px;
    max-height: 11px
}

@media screen and (min-width: 1920px) {
    .product-lable--hit img {
        min-width: 11px;
        max-width: 11px;
        min-height: 14px;
        max-height: 14px
    }
}

@media screen and (max-width: 1359px) {
    .product-lable--hit img {
        min-width: 7px;
        max-width: 7px;
        min-height: 9px;
        max-height: 9px
    }
}

.product-lable--preorder {
    background: #d357c0;
    color: #fff
}

.product-lable--new {
    background: #eaba5d;
    color: #fff
}

.product-lable--waiting {
    background: #bbe3b9;
    color: #151514
}

.product-lable--deleted,
.product-lable--sold {
    background: #e8e6e3;
    color: #151514
}

.product-lable--ends {
    background: #6d20cf;
    color: #fff
}

.product-lable--available {
    border: 1px solid #1dbb6b;
    color: #1dbb6b
}

@media screen and (max-width: 1023px) {
    .product-lable .text-small {
        font-size: 8px
    }
}

@media screen and (min-width: 1920px) {
    .product-lable .text-small {
        font-size: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-lable .icon-small {
        width: 9px;
        height: 9px
    }
}

@media screen and (min-width: 1920px) {
    .product-lable .icon-small {
        width: 14px;
        height: 14px
    }
}

.empty-container {
    width: 110px
}

.order-status {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #58c7f7;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .order-status {
        font-size: 20px;
        line-height: 28px;
        gap: 10px
    }
}

@media screen and (max-width: 1359px) {
    .order-status {
        font-size: 12px;
        line-height: 16px
    }
}

.order-status--accepted {
    color: #58c7f7
}

.order-status--confirmed {
    color: #d357c0
}

.order-status--sent {
    color: #4dcc8c
}

.order-status--arrived {
    color: #6d20cf
}

.order-status--canceled {
    color: #ff4b69
}

.order-status-service--diagnosed {
    color: #d357c0
}

.modal-call {
    max-width: 400px;
    min-width: 400px;
    padding: 24px 24px 32px;
    margin: auto;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .modal-call {
        max-width: 600px;
        min-width: 600px;
        padding: 40px 40px 48px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call {
        padding-bottom: 28px
    }
}

@media screen and (max-width: 768px) {
    .modal-call {
        max-width: 350px;
        min-width: 350px
    }
}

@media screen and (max-width: 423px) {
    .modal-call {
        max-width: 300px;
        min-width: 300px;
        padding: 20px 20px 24px
    }
}

.modal-call--success {
    height: 356px
}

@media screen and (min-width: 1920px) {
    .modal-call--success {
        height: 514px
    }
}

@media screen and (max-width: 768px) {
    .modal-call--success {
        height: 312px
    }
}

.modal-call .modal-header {
    margin-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-header {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .modal-call .modal-header {
        margin-bottom: 32px
    }
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .modal-call .modal-title {
        font-size: 20px
    }
}

@media screen and (max-width: 423px) {
    .modal-call .modal-title {
        font-size: 18px;
        line-height: 24px
    }
}

.modal-call .modal-description {
    padding-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-description {
        font-size: 24px;
        line-height: 38px;
        padding-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .modal-description {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .modal-call .modal-description {
        padding-bottom: 32px
    }
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-socials {
        column-gap: 24px
    }
}

@media screen and (max-width: 423px) {
    .modal-call .modal-socials {
        width: 90%;
        flex-wrap: wrap;
        row-gap: 16px
    }
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-socials img {
        width: 24px;
        height: 24px
    }
}

.modal-call .close-button {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .modal-call .close-button {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .close-button {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 423px) {
    .modal-call .close-button {
        width: 16px;
        height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .modal-call .text-field__input {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .text-field__input {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-call .text-field__input::placeholder {
    color: #dedede
}

.modal-call .text-field__container {
    min-width: 100%;
    max-width: 100%
}

@media screen and (max-width: 1024px) {
    .modal-call .text-field__label {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-call .modal-form {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .modal-call .modal-form {
        margin-bottom: 56px;
        row-gap: 32px
    }
}

@media screen and (max-width: 768px) {
    .modal-call .modal-form {
        row-gap: 16px;
        margin-bottom: 32px
    }
}

.modal-call .button--filled.button--primary {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #fff;
    border-radius: 12px;
    padding: 18px
}

@media screen and (min-width: 1920px) {
    .modal-call .button--filled.button--primary {
        border-radius: 16px;
        padding: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .button--filled.button--primary {
        padding: 16px
    }
}

@media screen and (max-width: 768px) {
    .modal-call .button--filled.button--primary {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 423px) {
    .modal-call .button--filled.button--primary {
        font-size: 16px;
        line-height: 24px
    }
}

.modal-call .button--filled.button--primary:hover {
    margin: 0;
    padding: 18px;
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .modal-call .button--filled.button--primary:hover {
        padding: 24px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .button--filled.button--primary:hover {
        padding: 16px
    }
}

.modal-call .text-field__placeholder {
    position: absolute;
    bottom: 5px;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-call .text-field__placeholder {
        bottom: 4px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal-call .text-field__placeholder {
        bottom: 6px;
        font-size: 14px;
        line-height: 20px
    }
}

.modal-call .text-field__placeholder--gray,
.modal-call .text-field__placeholder a {
    text-decoration: none;
    color: #dedede;
    pointer-events: none
}

@media screen and (max-width: 1023px) {
    .modal-overlay.modal-overlay--credit {
        align-items: flex-start !important;
        overflow-y: auto
    }
}

.modal-credit {
    display: flex;
    width: 1000px;
    max-width: 1300px;
    padding: 32px 24px 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .modal-credit {
        min-width: 1500px;
        padding: 40px;
        gap: 48px;
        border-radius: 32px;
        box-shadow: 0 0 40px #0000001a
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit {
        width: 880px;
        padding: 24px 24px 32px;
        gap: 28px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit {
        width: 520px;
        align-items: center
    }
}

@media screen and (max-width: 723px) {
    .modal-credit {
        width: 300px
    }
}

.modal-credit .credit-list {
    display: flex;
    flex-direction: column;
    width: 100%
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-list {
        width: 100%
    }
}

.modal-credit .modal-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0
}

.modal-credit .modal-title {
    font-size: 24px;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .modal-credit .modal-title {
        font-size: 40px;
        line-height: 56px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .modal-title {
        font-size: 20px;
        line-height: 24px
    }
}

.modal-credit .credit-item {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    justify-content: space-between
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item {
        gap: 32px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item {
        grid-template-columns: 1fr;
        align-items: flex-start;
        row-gap: 16px;
        padding: 20px;
        border-radius: 24px;
        border: 1px solid #dedede;
        position: relative
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item {
        gap: 20px;
        align-items: center !important
    }
}

.modal-credit .credit-item:first-child {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item:first-child {
        margin-bottom: 32px
    }
}

.modal-credit .credit-item__info {
    display: flex;
    align-items: center;
    column-gap: 12px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__info {
        column-gap: 20px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__info {
        flex-direction: column;
        gap: 12px
    }
}

.modal-credit .credit-item__info .credit-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__info .credit-info {
        gap: 8px;
        max-width: 335px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__info .credit-info {
        align-items: center
    }
}

.modal-credit .credit-item__info .credit-info .credit-name {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__info .credit-info .credit-name {
        font-weight: 400;
        font-size: 24px;
        line-height: 38px;
        min-width: 320px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__info .credit-info .credit-name {
        font-weight: 400;
        font-size: 14px;
        line-height: 20px
    }
}

.modal-credit .credit-item__info .credit-info__details {
    display: flex;
    align-items: center;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__info .credit-info__details {
        gap: 12px
    }
}

.modal-credit .credit-item__info .credit-info__amount,
.modal-credit .credit-item__info .credit-info__terms {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

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

    .modal-credit .credit-item__info .credit-info__amount,
    .modal-credit .credit-item__info .credit-info__terms {
        font-size: 20px;
        line-height: 32px;
        min-width: 164px
    }
}

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

    .modal-credit .credit-item__info .credit-info__amount,
    .modal-credit .credit-item__info .credit-info__terms {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-credit .credit-item__info .credit-info .line {
    width: 1px;
    height: 12px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__info .credit-info .line {
        width: 2px;
        height: 16px
    }
}

.modal-credit .credit-item__payments {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 36px;
    column-gap: 8px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__payments {
        column-gap: 28px;
        justify-content: flex-start;
        margin-left: 48px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__payments {
        column-gap: 18px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item__payments {
        justify-content: flex-start;
        gap: 14px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__payments {
        margin-right: 0;
        justify-content: center
    }
}

.modal-credit .credit-item__payments-count {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__payments-count {
        font-weight: 400;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__payments-count {
        font-weight: 400;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__payments-count {
        min-width: 94px
    }
}

.modal-credit .credit-item__price {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 56px
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item__price {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        row-gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__price {
        align-items: center
    }
}

.modal-credit .credit-item__price-value {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__price-value {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__price-value {
        font-size: 20px;
        line-height: 24px;
        min-width: 137px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item__price-value {
        position: absolute;
        bottom: 90px;
        left: 248px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .credit-item__price-value {
        position: unset
    }
}

.modal-credit .credit-item__price-value .month {
    color: #494949;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__price-value .month {
        font-size: 24px;
        line-height: 38px
    }
}

.modal-credit .credit-item__price .button--sm {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    border-radius: 16px;
    border: none;
    background: #58c7f6;
    color: #fff;
    padding: 18px 24px;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__price .button--sm {
        font-size: 20px;
        line-height: 32px;
        padding: 20px 28px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__price .button--sm {
        font-size: 14px;
        line-height: 20px;
        padding-block: 16px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item__price .button--sm {
        width: 100%
    }
}

.modal-credit .credit-item__price .button--sm:hover {
    padding: 18px 24px;
    background: #6cd3ff;
    color: #fff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item__price .button--sm:hover {
        padding: 24px 32px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item__price .button--sm:hover {
        padding-block: 16px
    }
}

.modal-credit .credit-item .credit-payments__select {
    position: relative
}

.modal-credit .credit-item .credit-payments__select.active .credit-payments__list {
    z-index: 10;
    opacity: 1;
    top: 50px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__select.active .credit-payments__list {
        top: 64px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item .credit-payments__select.active .credit-payments__list {
        top: 42px
    }
}

.modal-credit .credit-item .credit-payments__field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 8px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid #dedede;
    width: 150px;
    transition: all .25s ease;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__field {
        width: max-content;
        column-gap: 12px;
        padding: 14px 20px;
        height: 56px;
        border-radius: 12px;
        width: 176px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item .credit-payments__field {
        width: 114px;
        padding: 10px 12px;
        max-height: 36px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .credit-item .credit-payments__field {
        width: 108px
    }
}

.modal-credit .credit-item .credit-payments__field-value {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__field-value {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item .credit-payments__field-value {
        font-size: 12px;
        line-height: 16px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 56px
    }
}

.modal-credit .credit-item .credit-payments__field svg {
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__field svg {
        width: 18px;
        height: 18px
    }
}

.modal-credit .credit-item .credit-payments__field.opened {
    border: 1px solid #58c7f7;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026
}

.modal-credit .credit-item .credit-payments__field.opened svg {
    transform: rotate(180deg)
}

.modal-credit .credit-item .credit-payments__list {
    width: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 8px;
    position: absolute;
    z-index: -10;
    padding: 8px;
    border: 1px solid #dedede;
    border-top: 0;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026;
    opacity: 0;
    transition: opacity .25s ease
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__list {
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
        gap: 10px;
        padding: 14px;
        row-gap: 12px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item .credit-payments__list {
        row-gap: 4px
    }
}

.modal-credit .credit-item .credit-payments__list-item {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    padding: 10px;
    border-radius: 8px;
    color: #151514;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-item .credit-payments__list-item {
        font-size: 20px;
        line-height: 28px;
        padding: 12px 16px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-item .credit-payments__list-item {
        font-size: 12px;
        line-height: 16px;
        padding: 6px 10px
    }
}

.modal-credit .credit-item .credit-payments__list-item:hover {
    background: #f4f4f4;
    font-weight: 600
}

.modal-credit .credit-conditions {
    display: flex;
    padding: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    border-radius: 24px;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-conditions {
        padding: 32px;
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-conditions {
        padding: 20px;
        border-radius: 16px
    }
}

.modal-credit .credit-conditions__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-conditions__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-conditions__title {
        font-size: 18px;
        line-height: 24px
    }
}

.modal-credit .credit-conditions__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-conditions__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-conditions__text {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-credit .credit-conditions__info {
    color: #4da6cd;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-conditions__info {
        font-size: 20px;
        line-height: 32px
    }
}

.modal-credit .credit-icon-container {
    display: flex;
    padding: 12px;
    align-items: center;
    border-radius: 12px;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-icon-container {
        padding: 18px
    }
}

.modal-credit .credit-icon {
    width: 28px;
    height: 28px
}

@media screen and (min-width: 1920px) {
    .modal-credit .credit-icon {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .credit-icon {
        width: 24px;
        height: 24px
    }
}

.modal-credit .button-credit {
    padding: 18px 24px !important;
    border-radius: 16px !important;
    background: #58c7f6
}

@media screen and (min-width: 1920px) {
    .modal-credit .button-credit {
        padding: 20px 28px !important;
        border-radius: 18px !important;
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .button-credit {
        padding: 14px 18px !important;
        max-height: 48px;
        border-radius: 12px !important
    }
}

.modal-credit .button--disabled {
    background: #dedede !important
}

.modal-credit .container-phone {
    display: flex;
    padding: 18px;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    border: .5px solid #dedede;
    width: 196px;
    max-height: 96px;
    position: relative
}

@media screen and (min-width: 1920px) {
    .modal-credit .container-phone {
        padding: 28px 32px;
        width: 287px;
        max-height: 154px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .container-phone {
        padding: 16px;
        width: 192px;
        gap: 24px;
        height: 88px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .container-phone {
        width: 100%;
        justify-content: center;
        padding: 20px;
        height: 96px
    }
}

.modal-credit .container-phone .text-field__container {
    min-width: 161px;
    max-width: 161px
}

@media screen and (min-width: 1920px) {
    .modal-credit .container-phone .text-field__container {
        min-width: 223px;
        max-width: 223px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .container-phone .text-field__container {
        min-width: 132px;
        max-width: 132px
    }
}

@media screen and (min-width: 1920px) {
    .modal-credit .container-phone .text-field__container .text-field__label {
        padding: 0
    }
}

.modal-credit .container-phone .text-field__input {
    padding: 0;
    font-weight: 400 !important
}

@media screen and (max-width: 1359px) {
    .modal-credit .container-phone .text-field__input {
        font-size: 14px;
        line-height: 20px;
        padding-bottom: 6px
    }
}

.modal-credit .container-phone svg {
    position: absolute;
    right: 40px;
    top: 22px
}

@media screen and (min-width: 1920px) {
    .modal-credit .container-phone svg {
        width: 24px;
        height: 24px;
        right: 72px;
        top: 30px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .container-phone svg {
        right: 54px;
        top: 18px
    }
}

@media screen and (max-width: 1023px) {
    .modal-credit .container-phone svg {
        right: 182px;
        top: 21px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .container-phone svg {
        right: 72px
    }
}

@media screen and (max-width: 723px) {
    .modal-credit .container-phone .input-with-error {
        display: flex;
        justify-content: center;
        align-items: center
    }
}

.modal-credit .btn-save {
    display: flex;
    padding: 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 16px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .modal-credit .btn-save {
        padding: 30px 32px;
        border-radius: 18px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .modal-credit .btn-save {
        padding: 18px 24px;
        max-height: 60px;
        font-size: 16px;
        line-height: 24px
    }
}

.modal-credit .btn-save:hover {
    background: #6cd3ff
}

.credit-summary-container {
    display: flex;
    flex-direction: column;
    gap: 16px !important
}

.credit-summary-container .credit-summary {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-direction: column
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .credit-summary {
        gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .credit-summary-container .credit-summary {
        gap: 8px
    }
}

.credit-summary-container .credit-summary__header {
    display: flex;
    align-items: center;
    gap: 6px
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .credit-summary__header {
        gap: 8px
    }
}

.credit-summary-container .credit-summary__title {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .credit-summary__title {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .credit-summary-container .credit-summary__title {
        font-size: 14px
    }
}

.credit-summary-container .credit-summary__icon {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .credit-summary__icon {
        width: 32px;
        height: 32px
    }
}

.credit-summary-container .credit-summary__details {
    display: flex;
    align-items: center;
    gap: 8px
}

@media screen and (max-width: 723px) {
    .credit-summary-container .credit-summary__details {
        flex-wrap: wrap
    }
}

.credit-summary-container .credit-summary__payments,
.credit-summary-container .credit-summary__price,
.credit-summary-container .credit-summary__phone {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

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

    .credit-summary-container .credit-summary__payments,
    .credit-summary-container .credit-summary__price,
    .credit-summary-container .credit-summary__phone {
        font-size: 18px;
        line-height: 28px
    }
}

.credit-summary-container .credit-summary__line {
    width: 1px;
    height: 12px;
    background: #dedede
}

.credit-summary-container .credit-summary__price {
    color: #151514;
    font-weight: 600
}

.credit-summary-container .credit-summary__price-unit {
    color: #494949;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .credit-summary__price-unit {
        font-size: 16px;
        line-height: 28px
    }
}

.credit-summary-container .credit-summary .credit-summary__line-mob {
    display: none
}

@media screen and (max-width: 723px) {
    .credit-summary-container .credit-summary .credit-summary__line-mob {
        display: flex;
        height: 1px;
        width: 100%;
        background: #dedede
    }
}

@media screen and (max-width: 723px) {
    .credit-summary-container .checkout-credit__form {
        position: relative;
        padding: 14px !important;
        height: 148px;
        align-items: flex-start !important
    }
}

.credit-summary-container .button-change {
    all: unset;
    color: #58c7f7;
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .credit-summary-container .button-change {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .credit-summary-container .button-change {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .credit-summary-container .button-change {
        position: absolute;
        top: 114px
    }
}

.modal-bank {
    min-width: 600px;
    max-width: 600px;
    padding: 24px 24px 32px;
    color: #151514;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 32px
}

@media screen and (min-width: 1920px) {
    .modal-bank {
        min-width: 850px;
        max-width: 850px;
        padding: 48px 40px 56px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank {
        max-width: 500px;
        min-width: 500px
    }
}

@media screen and (max-width: 768px) {
    .modal-bank {
        max-width: 350px;
        min-width: 350px;
        padding-bottom: 28px
    }
}

@media screen and (max-width: 423px) {
    .modal-bank {
        max-width: 300px;
        min-width: 300px;
        border-radius: 24px
    }
}

.modal-bank__title {
    font-family: Headline Base;
    font-size: 28px;
    line-height: 36px;
    font-weight: 500
}

@media screen and (min-width: 1920px) {
    .modal-bank__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank__title {
        font-size: 24px;
        line-height: 32px
    }
}

.modal-bank__text {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .modal-bank__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank__text {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-bank__text--bold {
    font-weight: 600
}

.modal-bank__type {
    display: flex;
    align-items: center;
    column-gap: 4px;
    padding-bottom: 24px;
    border-bottom: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .modal-bank__type {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank__type {
        padding-bottom: 16px
    }
}

.modal-bank__icon {
    width: 32px;
    height: 32px;
    margin-right: 8px
}

@media screen and (min-width: 1920px) {
    .modal-bank__icon {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank__icon {
        width: 28px;
        height: 28px
    }
}

.modal-bank__list {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-top: 24px;
    padding-left: 24px
}

@media screen and (min-width: 1920px) {
    .modal-bank__list {
        margin-top: 40px;
        padding-left: 32px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank__list {
        margin-top: 16px;
        padding-left: 16px
    }
}

.modal-bank .modal-header {
    margin-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .modal-bank .modal-header {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1024px) {
    .modal-bank .modal-header {
        margin-bottom: 32px
    }
}

.modal-bank .close-button {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .modal-bank .close-button {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 423px) {
    .modal-bank .close-button {
        width: 16px;
        height: 16px
    }
}

.comment-modal {
    position: relative;
    min-width: 500px;
    max-width: 500px;
    padding: 24px 24px 32px;
    margin: auto;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .comment-modal {
        min-width: 800px;
        max-width: 800px;
        padding: 40px 40px 48px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal {
        padding-bottom: 28px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal {
        min-width: 352px;
        max-width: 352px
    }
}

@media screen and (max-width: 423px) {
    .comment-modal {
        min-width: 300px;
        max-width: 300px;
        padding-inline: 20px
    }
}

.comment-modal--success {
    height: 460px
}

@media screen and (min-width: 1920px) {
    .comment-modal--success {
        height: 692px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal--success {
        height: 448px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal--success {
        height: 564px
    }
}

@media screen and (max-width: 423px) {
    .comment-modal--success {
        height: 588px
    }
}

.comment-modal--error {
    min-width: 350px;
    max-width: 350px
}

@media screen and (min-width: 1920px) {
    .comment-modal--error {
        min-width: 500px;
        max-width: 500px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal--error {
        min-width: 280px;
        max-width: 280px
    }
}

.comment-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .comment-modal__header {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal__header {
        margin-bottom: 32px
    }
}

.comment-modal__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    color: #151514;
    margin-right: 0
}

@media screen and (min-width: 1920px) {
    .comment-modal__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal__title {
        font-size: 20px;
        line-height: 24px
    }
}

.comment-modal__rating {
    display: flex;
    align-items: center;
    position: relative;
    padding: 8px 16px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .comment-modal__rating {
        padding: 12px 24px
    }
}

.comment-modal__rating:first-child {
    border-right: 1px solid #dedede
}

.comment-modal__rating:hover {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    background: #f0f6fb
}

@media screen and (min-width: 1920px) {
    .comment-modal__rating:hover {
        border-top-right-radius: 16px;
        border-bottom-right-radius: 16px
    }
}

.comment-modal__rating:hover:first-child {
    border-radius: 12px 0 0 12px
}

@media screen and (min-width: 1920px) {
    .comment-modal__rating:hover:first-child {
        border-top-left-radius: 16px;
        border-bottom-left-radius: 16px
    }
}

.comment-modal__rating.active path {
    fill: #eb606c
}

.comment-modal__rating.active:first-child path {
    fill: #4dcc8c
}

.comment-modal__rating svg {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .comment-modal__rating svg {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal__rating svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal__rating svg {
        width: 16px;
        height: 16px
    }
}

.comment-modal .close-button {
    position: relative;
    top: initial;
    right: initial;
    fill: #cfcfcf;
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .comment-modal .close-button {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal .close-button {
        width: 18px;
        height: 18px
    }
}

.comment-modal__review {
    display: flex;
    align-items: center
}

.comment-modal__buttons {
    display: flex;
    align-items: center;
    margin-left: 24px;
    border: 1px solid #dedede;
    border-radius: 12px
}

@media screen and (min-width: 1920px) {
    .comment-modal__buttons {
        border-radius: 16px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal__buttons {
        margin-left: 16px
    }
}

@media screen and (max-width: 423px) {
    .comment-modal__buttons {
        margin-left: 8px
    }
}

.comment-modal__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .comment-modal__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal__text {
        font-size: 14px;
        line-height: 20px
    }
}

.comment-modal .comment-form {
    width: 100%
}

.comment-modal .text-field__container {
    max-width: 100%;
    justify-content: flex-start;
    min-height: 100%;
    max-height: 100%
}

.comment-modal .text-field__label {
    display: none
}

.comment-modal .text-field__textarea {
    height: 24px;
    border: none;
    resize: none;
    overflow: hidden;
    min-height: 32px;
    max-height: 224px;
    padding: 0 0 8px;
    margin-bottom: 40px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    border-bottom: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .comment-modal .text-field__textarea {
        font-size: 24px;
        line-height: 38px;
        padding-bottom: 12px;
        margin-bottom: 56px;
        height: 38px;
        min-height: 50px;
        max-height: 354px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal .text-field__textarea {
        min-height: 32px;
        height: 20px
    }
}

@media screen and (max-width: 768px) {
    .comment-modal .text-field__textarea {
        height: 52px;
        min-height: 64px;
        max-height: 336px;
        padding-bottom: 12px;
        margin-bottom: 32px
    }
}

.comment-modal .text-field__textarea::placeholder {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .comment-modal .text-field__textarea::placeholder {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal .text-field__textarea::placeholder {
        font-size: 14px;
        line-height: 20px
    }
}

.comment-modal .button {
    padding: 18px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    border: none;
    border-radius: 16px;
    color: #fff;
    background-color: #58c7f7
}

@media screen and (min-width: 1920px) {
    .comment-modal .button {
        font-size: 24px;
        line-height: 38px;
        padding: 24px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal .button {
        font-size: 14px;
        line-height: 20px;
        padding: 16px
    }
}

.comment-modal .button:hover {
    padding: 18px;
    margin: 0;
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .comment-modal .button:hover {
        padding: 24px
    }
}

@media screen and (max-width: 1024px) {
    .comment-modal .button:hover {
        padding: 16px
    }
}

.comment-modal .button--disabled {
    background-color: #dedede;
    cursor: auto;
    pointer-events: none
}

.language-modal {
    min-width: 376px;
    max-width: 376px
}

@media screen and (min-width: 1920px) {
    .language-modal {
        min-width: 472px;
        max-width: 472px
    }
}

@media screen and (max-width: 768px) {
    .language-modal {
        margin-top: 0
    }
}

@media screen and (min-width: 1920px) {
    .language-modal .modal-header {
        margin-bottom: 36px
    }
}

@media screen and (min-width: 1920px) {
    .language-modal .modal-title {
        font-size: 32px;
        line-height: 32px
    }
}

.language-modal .radio-button__container.checked {
    margin-left: 0;
    margin-bottom: 0;
    padding: 0;
    border: none
}

.language-modal .radio-button__container {
    border: none;
    margin-left: 0;
    margin-bottom: 0;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .language-modal .radio-button__container .radio-button__lable {
        font-size: 18px
    }
}

@media screen and (min-width: 1920px) {
    .language-modal .radio-button__container .radio-button__icon:before {
        width: 32px;
        height: 32px
    }
}

.language-modal__radio-btn {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .language-modal__radio-btn {
        margin-bottom: 32px
    }
}

.language-modal .button {
    max-width: max-content;
    padding: 8px 16px
}

@media screen and (min-width: 1920px) {
    .language-modal .button {
        padding: 12px 16px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .language-modal .button {
        padding: 8px 12px;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .modal--white.language-modal {
        padding: 24px;
        min-width: 286px;
        max-width: 286px
    }
}

@media screen and (max-width: 768px) {
    .modal--white.language-modal {
        min-width: 328px;
        max-width: 328px
    }
}

.service-modal-repair {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    width: 800px;
    padding: 32px 32px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 48px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    justify-content: flex-start
}

@media screen and (min-width: 1920px) {
    .service-modal-repair {
        width: 1200px;
        padding: 48px 40px 56px;
        gap: 80px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair {
        width: 600px;
        padding: 24px 24px 32px;
        gap: 32px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair {
        width: 350px;
        height: 340px;
        padding: 16px;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair {
        width: 300px;
        height: 372px
    }
}

.service-modal-repair .modal-repair-header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-header {
        gap: 12px;
        align-items: center
    }
}

.service-modal-repair .modal-repair-title {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.29;
    min-width: 708px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-title {
        font-size: 40px;
        min-width: 1084px;
        line-height: 1.2
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-title {
        font-size: 24px;
        line-height: 1.33;
        min-width: 526px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-title {
        font-size: 20px;
        line-height: 1.2;
        min-width: 288px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-title {
        font-size: 18px;
        line-height: 1.33;
        min-width: 238px
    }
}

.service-modal-repair .modal-repair-container-info {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info {
        gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info {
        height: 84px
    }
}

.service-modal-repair .modal-repair-container-info__img img {
    display: flex;
    width: 211px;
    height: 168px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 16px;
    background: linear-gradient(0deg, #ebeaea, #ebeaea), url("<path-to-image>") #d3d3d3 50%/cover no-repeat
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__img img {
        width: 317px;
        height: 252px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__img img {
        width: 182px;
        height: 152px;
        border-radius: 16px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__img img {
        width: 90px;
        height: 80px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__img img {
        width: 90px;
        height: 116px
    }
}

.service-modal-repair .modal-repair-container-info__right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right {
        gap: 40px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right {
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right {
        gap: 8px;
        width: 216px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__right {
        width: 166px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-repair .modal-repair-container-info__right {
        width: 100%;
        gap: 24px
    }
}

.service-modal-repair .modal-repair-container-info__right-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-text {
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-text {
        gap: 8px
    }
}

.service-modal-repair .modal-repair-container-info__right-text h3 {
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-family: Headline Base;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-text h3 {
        font-size: 32px;
        line-height: 1.25
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-text h3 {
        font-size: 18px;
        line-height: 1.56;
        max-width: 356px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right-text h3 {
        -webkit-line-clamp: 3;
        font-size: 14px;
        line-height: 1.43;
        max-width: 216px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__right-text h3 {
        max-width: 166px
    }
}

.service-modal-repair .modal-repair-container-info__right-text p {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-text p {
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-text p {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right-text p {
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__right-text p {
        max-width: 166px
    }
}

.service-modal-repair .modal-repair-container-info__right-text ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 8px
}

.service-modal-repair .modal-repair-container-info__right-text ul li {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    margin-left: 14px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-text ul li {
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-text ul li {
        font-size: 14px;
        line-height: 1.43
    }
}

.service-modal-repair .modal-repair-container-info__right-buttons {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-buttons {
        gap: 24px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-repair .modal-repair-container-info__right-buttons {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right-buttons {
        flex-direction: column;
        position: relative;
        left: -48%;
        top: 24px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__right-buttons {
        left: -62%;
        top: 38px
    }
}

.service-modal-repair .modal-repair-container-info__right-buttons .button-continue:hover {
    border: 1px solid #58c7f7
}

.service-modal-repair .modal-repair-container-info__right-buttons .button-checkout:hover {
    background: #6cd3ff
}

.service-modal-repair .modal-repair-container-info__right-buttons .button-continue,
.service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
    all: unset;
    display: flex;
    padding: 16px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    cursor: pointer;
    box-sizing: border-box
}

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

    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue,
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        padding: 24px;
        font-size: 24px;
        font-weight: 600;
        line-height: 1.58
    }
}

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

    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue,
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        padding: 16px 24px;
        color: var(--Text-White, #fff);
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue,
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        padding: 16px;
        font-size: 14px;
        line-height: 1.43;
        min-width: 318px;
        max-width: 318px
    }
}

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

    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue,
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        min-width: 268px;
        max-width: 268px
    }
}

.service-modal-repair .modal-repair-container-info__right-buttons .button-continue {
    border: 1px solid #dedede;
    color: #151514;
    min-width: 195px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue {
        min-width: 330px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue {
        border-radius: 12px;
        max-width: 76px;
        min-width: 76px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue {
        padding: 16px 0;
        max-width: 318px;
        min-width: 318px
    }
}

@media screen and (max-width: 423px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-continue {
        min-width: 268px;
        max-width: 268px
    }
}

.service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
    color: #fff;
    background: #58c7f6;
    min-width: 195px
}

@media screen and (min-width: 1920px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        min-width: 330px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        min-width: 168px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        padding: 16px 0;
        width: 100%
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-repair .modal-repair-container-info__right-buttons .button-checkout {
        width: 100%
    }
}

.service-modal-success {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    width: 525px;
    max-width: 800px;
    min-height: 560px;
    height: auto;
    padding: 32px 24px 48px;
    flex-direction: column;
    gap: 40px;
    border-radius: 32px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    overflow-y: auto
}

@media screen and (min-width: 1920px) {
    .service-modal-success {
        width: 750px;
        max-width: 1100px;
        min-height: 752px;
        height: auto;
        padding: 48px 40px 56px;
        gap: 56px;
        border-radius: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1600px) {
    .service-modal-success {
        width: 525px;
        height: 560px;
        padding: 32px 24px 48px;
        gap: 40px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .service-modal-success {
        width: calc(525px + (100vw - 1600px) * .703125);
        min-height: calc(560px + (100vw - 1600px)*.6);
        height: auto;
        padding-top: calc(32px + (100vw - 1600px)/20);
        padding-right: calc(24px + (100vw - 1600px)/20);
        padding-bottom: calc(48px + (100vw - 1600px)/40);
        padding-left: calc(24px + (100vw - 1600px)/20);
        gap: calc(40px + (100vw - 1600px)/20)
    }
}

@media screen and (max-width: 1024px) and (min-width: 600px) {
    .service-modal-success {
        width: clamp(420px, 24vw + 216px, 525px);
        min-height: clamp(500px, 4.5vw + 472px, 532px);
        height: auto;
        padding: 24px 24px clamp(28px, .8vw + 22px, 32px) 24px;
        gap: clamp(32px, 1vw + 24px, 40px)
    }
}

@media screen and (max-width: 599px) and (min-width: 425px) {
    .service-modal-success {
        width: clamp(350px, 12vw + 310px, 420px);
        min-height: clamp(480px, 6vw + 452px, 512px);
        height: auto;
        padding: 24px;
        gap: 32px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success {
        width: 525px;
        max-width: 800px;
        min-height: 560px;
        height: auto;
        padding: 32px 24px 48px;
        border-radius: 32px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success {
        padding: 24px;
        border-radius: 24px
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success {
        width: 350px;
        max-width: 500px;
        height: 480px;
        padding: 24px 24px 28px;
        gap: 32px
    }
}

@media screen and (max-width: 768px) and (min-width: 425px) {
    .service-modal-success {
        width: clamp(320px, 17.5vw + 186px, 420px);
        min-height: clamp(460px, 4.5vw + 418px, 512px);
        height: auto;
        gap: clamp(28px, 1vw + 24px, 36px)
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .service-modal-success {
        width: clamp(300px, 25vw + 210px, 350px);
        min-height: clamp(480px, 10vw + 392px, 520px);
        height: auto;
        gap: clamp(28px, 1.5vw + 24px, 32px)
    }
}

@media screen and (max-width: 360px) {
    .service-modal-success {
        width: 300px;
        max-width: 300px;
        min-height: 548px;
        height: auto;
        padding: 24px;
        gap: 32px;
        border-radius: 24px
    }
}

.service-modal-success__header {
    position: absolute;
    top: 32px;
    right: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .service-modal-success__header {
        top: 48px;
        right: 40px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__header {
        top: 32px;
        right: 24px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__header {
        top: 24px;
        right: 24px
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__header {
        top: 24px;
        right: 24px
    }
}

.service-modal-success__status {
    color: #7f7f7f;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4
}

@media screen and (min-width: 1920px) {
    .service-modal-success__status {
        font-size: 16px
    }
}

.service-modal-success__body {
    display: flex;
    flex-direction: column;
    gap: 0;
    text-align: center
}

.service-modal-success__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    margin: 0 0 24px
}

@media screen and (min-width: 1920px) {
    .service-modal-success__title {
        font-size: 40px;
        line-height: 48px;
        margin-bottom: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .service-modal-success__title {
        font-size: clamp(28px, 2.14vw - 1.14px, 40px);
        line-height: clamp(36px, 2.14vw + 7.86px, 48px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__title {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .service-modal-success__title {
        font-size: clamp(18px, 1vw + 13.74px, 24px);
        line-height: clamp(20px, 2vw + 11.49px, 32px)
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success__title {
        font-size: 24px
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__title {
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        width: 100%;
        margin-bottom: 24px
    }
}

.service-modal-success__subtitle {
    color: #888;
    font-family: Inter;
    font-size: 24px;
    font-weight: 400;
    line-height: 38px;
    text-align: center;
    margin: 0 0 32px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .service-modal-success__subtitle {
        font-size: clamp(16px, 1.43vw - 3.52px, 24px);
        line-height: clamp(24px, 2.51vw - 10.14px, 38px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__subtitle {
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__subtitle {
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        width: 100%;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .service-modal-success__subtitle {
        font-size: clamp(14px, .33vw + 12.58px, 16px);
        line-height: clamp(20px, .67vw + 21.14px, 24px)
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success__subtitle {
        font-size: 14px;
        line-height: 1.4
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__subtitle {
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        width: 100%;
        margin-bottom: 32px
    }
}

.service-modal-success__address {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    align-items: center;
    border-radius: 16px;
    background: #f5f7fa;
    text-align: center;
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .service-modal-success__address {
        padding: 32px;
        gap: 24px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__address {
        padding: 20px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__address {
        padding: 20px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success__address {
        padding: 16px
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__address {
        gap: 12px;
        padding: 16px;
        margin-bottom: 32px
    }
}

.service-modal-success__address-text {
    color: #151514;
    font-family: Inter;
    font-size: 24px;
    font-weight: 400;
    line-height: 38px;
    text-align: center
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .service-modal-success__address-text {
        font-size: clamp(16px, 1.43vw - 3.52px, 24px);
        line-height: clamp(24px, 2.51vw - 10.14px, 38px)
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__address-text {
        font-size: 16px;
        line-height: 24px;
        width: 100%
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__address-text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success__address-text {
        font-size: 14px;
        line-height: 1.4
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__address-text {
        font-size: 16px;
        line-height: 24px;
        width: 100%
    }
}

.service-modal-success__copy {
    all: unset;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #58c7f7;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer;
    text-align: center
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .service-modal-success__copy {
        font-size: clamp(16px, 1.43vw - 3.52px, 24px);
        line-height: clamp(24px, 2.51vw - 10.14px, 38px)
    }
}

@media screen and (min-width: 1920px) {
    .service-modal-success__copy {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__copy {
        font-size: 16px;
        line-height: 24px
    }
}

.service-modal-success__copy:hover {
    text-decoration: underline
}

.service-modal-success__copy.is-copied {
    color: #4dcc8c
}

.service-modal-success__info {
    color: #888;
    font-family: Inter;
    font-size: 24px;
    font-weight: 400;
    line-height: 38px;
    text-align: center;
    margin: 0 0 32px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .service-modal-success__info {
        font-size: clamp(16px, 1.43vw - 3.52px, 24px);
        line-height: clamp(24px, 2.51vw - 10.14px, 38px)
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__info {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__info {
        font-size: 16px;
        line_height: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .service-modal-success__info {
        font-size: 14px;
        line-height: 1.4
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__info {
        font-size: 16px;
        line_height: 24px;
        margin-bottom: 16px
    }
}

.service-modal-success__divider {
    width: 100%;
    height: 1px;
    background: #dedede;
    border-radius: 1px;
    margin-bottom: 16px
}

@media screen and (max-width: 424px) {
    .service-modal-success__divider {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__divider {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__divider {
        margin-bottom: 24px
    }
}

@media screen and (min-width: 1920px) {
    .service-modal-success__divider {
        margin-bottom: 32px
    }
}

.service-modal-success__action {
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: #58c7f7;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    height: auto;
    line-height: 1.5;
    cursor: pointer;
    transition: background .2s ease;
    width: 477px;
    padding: 18px 24px;
    margin: 0 auto;
    align-self: center;
    box-sizing: border-box
}

@media screen and (min-width: 1920px) {
    .service-modal-success__action {
        width: 100%;
        margin: 0;
        padding: 24px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .service-modal-success__action {
        width: calc(477px + (100vw - 1600px) * .603125);
        padding-top: calc(18px + (100vw - 1600px)*.01875);
        padding-bottom: calc(18px + (100vw - 1600px)*.01875)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .service-modal-success__action {
        width: 477px;
        padding: 18px 24px
    }
}

@media screen and (width: 1360px) {
    .service-modal-success__action {
        width: 477px
    }
}

@media screen and (max-width: 1024px) {
    .service-modal-success__action {
        width: 477px;
        padding: 16px 24px;
        max-width: calc(100% - 48px)
    }
}

@media screen and (max-width: 1024px) and (min-width: 600px) {
    .service-modal-success__action {
        width: clamp(350px, 16vw + 130px, 477px)
    }
}

@media screen and (max-width: 424px) {
    .service-modal-success__action {
        width: 302px;
        padding: 16px 24px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 360px) {
    .service-modal-success__action {
        width: 252px;
        padding: 16px 24px
    }
}

.service-modal-success__action:hover {
    background: #68cff9
}

.without-img-container {
    display: flex;
    width: 211px;
    height: 140px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 16px;
    background: linear-gradient(0deg, #ebeaea, #ebeaea), url("<path-to-image>") #d3d3d3 50%/cover no-repeat
}

@media screen and (min-width: 1920px) {
    .without-img-container {
        width: 317px;
        height: 252px;
        border-radius: 24px;
        background: #ebeaea
    }
}

@media screen and (max-width: 1024px) {
    .without-img-container {
        width: 145px;
        height: 124px;
        background: #ebeaea
    }
}

@media screen and (max-width: 768px) {
    .without-img-container {
        width: 90px;
        height: 80px;
        padding: 28px 0
    }
}

.services-item {
    width: 920px
}

@media screen and (min-width: 1920px) {
    .services-item {
        width: 1350px
    }
}

@media screen and (max-width: 1024px) {
    .services-item {
        width: 800px
    }
}

@media screen and (max-width: 768px) {
    .services-item {
        width: 360px;
        height: max-content;
        overflow-y: auto;
        max-height: 580px
    }
}

@media screen and (max-width: 423px) {
    .services-item {
        width: 320px
    }
}

.without-img-container svg {
    width: 40px;
    height: 40px
}

@media screen and (min-width: 1920px) {
    .without-img-container svg {
        width: 64px;
        height: 64px
    }
}

@media screen and (max-width: 1024px) {
    .without-img-container svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 768px) {
    .without-img-container svg {
        width: 24px;
        height: 24px
    }
}

.header-title {
    min-width: 812px !important
}

@media screen and (min-width: 1920px) {
    .header-title {
        min-width: 1218px !important
    }
}

@media screen and (max-width: 1024px) {
    .header-title {
        min-width: 710px !important
    }
}

@media screen and (max-width: 768px) {
    .header-title {
        min-width: 287px !important
    }
}

@media screen and (max-width: 423px) {
    .header-title {
        min-width: 246px !important
    }
}

.header-subtitle {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    margin-top: 16px;
    width: 856px
}

@media screen and (min-width: 1920px) {
    .header-subtitle {
        font-size: 24px;
        line-height: 1.58;
        max-width: 1180px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .header-subtitle {
        font-size: 14px;
        line-height: 1.43;
        max-width: 680px
    }
}

@media screen and (max-width: 768px) {
    .header-subtitle {
        max-width: 329px
    }
}

@media screen and (max-width: 423px) {
    .header-subtitle {
        max-width: 288px
    }
}

.distributor-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    align-self: stretch
}

.distributor-container__info {
    display: flex;
    padding: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    border-radius: 24px;
    border: 1px solid var(--Text-Link, #58c7f7);
    background: #fff
}

@media screen and (min-width: 1920px) {
    .distributor-container__info {
        padding: 32px;
        gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .distributor-container__info {
        padding: 16px;
        gap: 12px;
        border-radius: 16px
    }
}

@media screen and (max-width: 768px) {
    .distributor-container__info {
        min-width: 100%
    }
}

.distributor-container__info h3 {
    color: #151514;
    font-family: Headline Base;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55
}

@media screen and (min-width: 1920px) {
    .distributor-container__info h3 {
        font-size: 28px;
        line-height: 1.42
    }
}

@media screen and (max-width: 1024px) {
    .distributor-container__info h3 {
        font-size: 16px;
        line-height: 1.5
    }
}

@media screen and (max-width: 768px) {
    .distributor-container__info h3 {
        font-size: 14px;
        line-height: 1.43
    }
}

.distributor-container .img-container {
    display: flex;
    align-items: center;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .distributor-container .img-container {
        gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .distributor-container .img-container {
        flex-wrap: wrap
    }
}

.distributor-container .divider {
    width: 2px;
    height: 37px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .distributor-container .divider {
        height: 53px
    }
}

@media screen and (max-width: 1024px) {
    .distributor-container .divider {
        height: 28px
    }
}

.service-item-img {
    width: 100px;
    height: 80px;
    border-radius: 16px
}

@media screen and (min-width: 1920px) {
    .service-item-img {
        width: 150px;
        height: 120px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1024px) {
    .service-item-img {
        width: 80px;
        height: 64px
    }
}

@media screen and (max-width: 768px) {
    .service-item-img {
        display: none
    }
}

.service-block-list {
    align-items: flex-end !important;
    justify-content: space-between
}

@media screen and (max-width: 768px) {
    .service-block-list {
        height: max-content !important
    }
}

@media screen and (max-width: 768px) {
    .title-list {
        min-width: 256px !important
    }
}

.img-wrapper-1 img {
    width: 40px;
    height: 40px
}

@media screen and (min-width: 1920px) {
    .img-wrapper-1 img {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .img-wrapper-1 img {
        width: 28px;
        height: 28px
    }
}

.img-wrapper-2 img {
    width: 63px
}

@media screen and (min-width: 1920px) {
    .img-wrapper-2 img {
        width: 101px
    }
}

@media screen and (max-width: 1024px) {
    .img-wrapper-2 img {
        width: 51px
    }
}

.img-wrapper-3 img {
    width: 118px
}

@media screen and (min-width: 1920px) {
    .img-wrapper-3 img {
        width: 178px
    }
}

@media screen and (max-width: 1024px) {
    .img-wrapper-3 img {
        width: 89px
    }
}

.img-wrapper-4 img {
    width: 94px
}

@media screen and (min-width: 1920px) {
    .img-wrapper-4 img {
        width: 131px
    }
}

@media screen and (max-width: 1024px) {
    .img-wrapper-4 img {
        width: 75px
    }
}

.img-wrapper-5 img {
    width: 52px
}

@media screen and (min-width: 1920px) {
    .img-wrapper-5 img {
        width: 72px
    }
}

@media screen and (max-width: 1024px) {
    .img-wrapper-5 img {
        width: 36px
    }
}

.datepicker-container .air-datepicker-cell.-in-range- {
    background: #f4f4f4 !important
}

.datepicker-container .air-datepicker-cell.-in-range-.selected {
    background: #d8ffeb !important
}

.air-datepicker {
    border: none !important;
    --adp-nav-arrow-color: #fff;
    --adp-color-disabled: #dedede;
    --adp-font-size: 16px;
    --adp-cell-border-radius: 12px;
    --adp-day-cell-height: 48px;
    --adp-cell-background-color-selected: #dedede;
    --adp-cell-background-color-in-range: #dedede
}

@media screen and (max-width: 1024px) {
    .air-datepicker {
        --adp-day-cell-height: 36px;
        --adp-padding: 16px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker {
        --adp-day-cell-height: 32px
    }
}

.air-datepicker-body--day-name {
    text-transform: lowercase !important
}

.air-datepicker-cell.-in-range- {
    background: #d8ffeb !important
}

.air-datepicker-cell.-selected-.-current- {
    background: #4dcc8c
}

.air-datepicker-cell.-disabled-.-in-range- {
    background: #cbe8d9 !important
}

.air-datepicker-cell.-disabled- {
    color: #dedede
}

@media screen and (min-width: 1920px) {
    .air-datepicker-cell.-disabled- {
        font-size: 24px;
        line-height: 1.17
    }
}

.air-datepicker-cell.-in-range-.air-datepicker-cell.-disabled-~.air-datepicker-cell.-in-range- {
    background: #cbe8d9 !important;
    color: #a0a0a0
}

.air-datepicker-nav--title {
    pointer-events: none
}

.air-datepicker-nav--title i {
    font-family: Headline Base;
    color: #151514;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.33
}

@media screen and (min-width: 1920px) {
    .air-datepicker-nav--title i {
        font-size: 32px;
        line-height: 1.25
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-nav--title i {
        font-size: 20px;
        line-height: 1.4
    }
}

.air-datepicker-nav--action {
    display: grid;
    place-items: center;
    background-color: #dedede;
    width: 40px;
    height: 40px;
    border-radius: 50%
}

@media screen and (min-width: 1920px) {
    .air-datepicker-nav--action {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-nav--action {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-nav--action {
        width: 24px;
        height: 24px
    }
}

.air-datepicker-nav--action:hover {
    background-color: #888;
    width: 40px;
    height: 40px;
    border-radius: 50%
}

@media screen and (min-width: 1920px) {
    .air-datepicker-nav--action:hover {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-nav--action:hover {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-nav--action:hover {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-nav--action svg {
        position: relative;
        bottom: 10%
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-nav--action svg {
        bottom: 14%
    }
}

.air-datepicker {
    width: 496px
}

@media screen and (min-width: 1920px) {
    .air-datepicker {
        width: 650px
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker {
        max-width: 368px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker {
        max-width: 318px
    }
}

@media screen and (max-width: 423px) {
    .air-datepicker {
        max-width: 268px
    }
}

.modal-datepicker {
    min-width: min-content !important;
    max-width: min-content !important
}

.modal {
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999
}

@media screen and (max-width: 768px) {
    .modal {
        left: auto !important
    }
}

.modal-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    max-width: 560px;
    min-width: 560px;
    position: relative;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 40px #0006
}

@media screen and (min-width: 1920px) {
    .modal-content {
        max-width: 700px;
        min-width: 700px;
        padding: 32px 32px 40px
    }
}

@media screen and (max-width: 1024px) {
    .modal-content {
        max-width: 400px;
        min-width: 400px;
        padding: 16px
    }
}

@media screen and (max-width: 768px) {
    .modal-content {
        max-width: 350px;
        min-width: 350px;
        border-radius: 16px
    }
}

@media screen and (max-width: 423px) {
    .modal-content {
        max-width: 300px;
        min-width: 300px
    }
}

.air-datepicker-body--day-name {
    color: #494949;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 32px;
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .air-datepicker-body--day-name {
        font-size: 24px;
        line-height: 1.17
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-body--day-name {
        font-size: 14px;
        line-height: 1.43;
        margin-top: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-body--day-name {
        font-size: 12px;
        line-height: 1.33;
        margin-top: 16px;
        margin-bottom: 16px
    }
}

.air-datepicker-nav {
    border-bottom: none
}

.air-datepicker-body--cells {
    gap: 12px 0px
}

@media screen and (min-width: 1920px) {
    .air-datepicker-body--cells {
        gap: 16px 0px
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-body--cells {
        gap: 8px 0
    }
}

.air-datepicker-cell.-current- {
    color: #eb606c
}

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

    .air-datepicker-cell,
    .air-datepicker-cell.-current- {
        font-size: 24px;
        line-height: 1.17
    }
}

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

    .air-datepicker-cell,
    .air-datepicker-cell.-current- {
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .air-datepicker-cell,
    .air-datepicker-cell.-current- {
        font-size: 12px;
        line-height: 1.33
    }
}

.air-datepicker-cell.-selected-,
.air-datepicker-cell.-selected-.-focus- {
    background: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .air-datepicker-cell.-day-.-other-month- {
        font-size: 24px;
        line-height: 1.17
    }
}

@media screen and (max-width: 1024px) {
    .air-datepicker-cell.-day-.-other-month- {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .air-datepicker-cell.-day-.-other-month- {
        font-size: 12px;
        line-height: 1.33
    }
}

.container-dates {
    display: flex
}

.dates-container.active {
    border: 1px solid #58c7f7
}

.remove-button {
    cursor: pointer;
    position: absolute;
    right: 24px
}

@media screen and (max-width: 423px) {
    .remove-button {
        right: 16px
    }
}

@media screen and (max-width: 768px) {
    .remove-button svg {
        width: 10px;
        height: 10px
    }
}

@media screen and (min-width: 1920px) {
    .remove-button svg {
        width: 14px;
        height: 14px
    }
}

.dates-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    border: 1px solid #dedede;
    margin-bottom: 32px;
    min-width: 388px;
    max-width: 388px;
    padding: 0 24px
}

@media screen and (min-width: 1920px) {
    .dates-container {
        margin-bottom: 48px;
        min-width: 447px;
        max-width: 447px;
        padding: 0 24px
    }
}

@media screen and (max-width: 1024px) {
    .dates-container {
        margin-bottom: 24px;
        min-width: 368px;
        max-width: 368px
    }
}

@media screen and (max-width: 768px) {
    .dates-container {
        margin-bottom: 16px;
        min-width: 318px;
        max-width: 318px;
        padding: 0 16px
    }
}

@media screen and (max-width: 423px) {
    .dates-container {
        min-width: 268px;
        max-width: 268px
    }
}

.dates-container__item {
    display: flex;
    padding: 12px 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .dates-container__item {
        padding: 18px 0;
        width: 178px
    }
}

@media screen and (max-width: 1024px) {
    .dates-container__item {
        padding: 12px 24px
    }
}

@media screen and (max-width: 768px) {
    .dates-container__item {
        padding: 10px 24px
    }
}

@media screen and (max-width: 423px) {
    .dates-container__item {
        padding: 10px 18px
    }
}

.dates-container__item-title {
    color: #494949;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.43;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .dates-container__item-title {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .dates-container__item-title {
        font-size: 12px;
        line-height: 1.33;
        min-width: 98px;
        margin-bottom: 4px
    }
}

@media screen and (max-width: 768px) {
    .dates-container__item-title {
        font-size: 10px;
        line-height: 1.4;
        min-width: 79px
    }
}

.dates-container__item-subtitle,
.dates-container__item-not-slected {
    color: #151514;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.43
}

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

    .dates-container__item-subtitle,
    .dates-container__item-not-slected {
        font-size: 18px;
        line-height: 1.33
    }
}

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

    .dates-container__item-subtitle,
    .dates-container__item-not-slected {
        font-size: 12px;
        line-height: 1.33
    }
}

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

    .dates-container__item-subtitle,
    .dates-container__item-not-slected {
        font-size: 10px;
        line-height: 1.4
    }
}

.dates-container__item-not-slected {
    color: #888;
    font-weight: 500
}

.date-options {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap;
    margin-top: 32px
}

@media screen and (max-width: 1024px) {
    .date-options {
        gap: 12px;
        margin-top: 24px
    }
}

@media screen and (max-width: 768px) {
    .date-options {
        margin-top: 16px
    }
}

.date-options__item:hover {
    border: 1px solid #58c7f7
}

.date-options__item {
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 16px;
    border-radius: 16px;
    border: 1px solid #dedede;
    cursor: pointer
}

.date-options__item.active {
    border: 1px solid #58c7f7
}

@media screen and (min-width: 1920px) {
    .date-options__item {
        padding: 24px 40px
    }
}

@media screen and (max-width: 1024px) {
    .date-options__item {
        padding: 16px;
        border-radius: 24px;
        gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .date-options__item {
        padding: 12px;
        gap: 8px
    }
}

.date-options__item-text {
    color: #151514;
    font-size: 16px;
    text-align: center;
    font-weight: 500;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .date-options__item-text {
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .date-options__item-text {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .date-options__item-text {
        font-size: 12px;
        line-height: 1.33
    }
}

.info-modal-rental-product {
    height: 100%;
    overflow-y: auto
}

@media screen and (max-width: 768px) {
    .info-modal-rental-product {
        height: 95%
    }
}

@media screen and (max-width: 423px) {
    .modal-content-rent {
        min-width: 300px !important
    }
}

.product-confirm {
    min-width: 100% !important;
    margin-top: 32px;
    min-height: max-content !important;
    cursor: unset !important
}

@media screen and (max-width: 423px) {
    .product-confirm {
        max-width: 268px !important;
        min-width: 268px !important
    }
}

.product-confirm__img img {
    min-width: 271px !important;
    min-height: 173px !important
}

@media screen and (min-width: 1920px) {
    .product-confirm__img img {
        min-width: 387px !important;
        min-height: 217px !important
    }
}

@media screen and (max-width: 1024px) {
    .product-confirm__img img {
        max-width: 218px !important;
        min-width: 218px !important;
        max-height: 139px !important;
        min-height: 139px !important
    }
}

@media screen and (max-width: 768px) {
    .product-confirm__img img {
        max-width: 294px !important;
        min-width: 294px !important;
        max-height: 122px !important;
        min-height: 122px !important
    }
}

@media screen and (max-width: 423px) {
    .product-confirm__img img {
        max-width: 244px !important;
        min-width: 244px !important
    }
}

.product-confirm__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    align-self: stretch;
    overflow: hidden;
    color: #151514;
    text-align: center;
    text-overflow: ellipsis;
    font-family: Headline Base;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .product-confirm__title {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .product-confirm__title {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .product-confirm__title {
        font-size: 12px;
        line-height: 1.5
    }
}

.product-confirm .card-footer-rent {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .product-confirm .card-footer-rent {
        gap: 40px
    }
}

@media screen and (max-width: 1024px) {
    .product-confirm .card-footer-rent {
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .product-confirm .card-footer-rent {
        gap: 12px
    }
}

.product-confirm .card-footer-rent .pledge {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    justify-content: flex-end;
    color: #494949;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    min-height: 56px
}

@media screen and (min-width: 1920px) {
    .product-confirm .card-footer-rent .pledge {
        font-size: 24px;
        line-height: 1.17;
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .product-confirm .card-footer-rent .pledge {
        font-size: 14px;
        line-height: 1.43;
        gap: 4px
    }
}

@media screen and (max-width: 768px) {
    .product-confirm .card-footer-rent .pledge {
        font-size: 12px;
        line-height: 1.5
    }
}

.product-confirm .card-footer-rent .price,
.product-confirm .card-footer-rent .price-counts {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

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

    .product-confirm .card-footer-rent .price,
    .product-confirm .card-footer-rent .price-counts {
        font-size: 24px;
        line-height: 1.17
    }
}

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

    .product-confirm .card-footer-rent .price,
    .product-confirm .card-footer-rent .price-counts {
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .product-confirm .card-footer-rent .price,
    .product-confirm .card-footer-rent .price-counts {
        font-size: 12px;
        line-height: 1.5
    }
}

.product-confirm .card-footer-rent .price-counts {
    font-weight: 700
}

.product-confirm .card-rent-info-product {
    gap: 24px !important
}

@media screen and (min-width: 1920px) {
    .product-confirm .card-rent-info-product {
        gap: 40px !important
    }
}

@media screen and (max-width: 1024px) {
    .product-confirm .card-rent-info-product {
        gap: 16px !important
    }
}

@media screen and (max-width: 768px) {
    .product-confirm .card-rent-info-product {
        gap: 12px !important
    }
}

.product-confirm .button-rent-product {
    background: #dedede;
    min-width: 100% !important
}

.product-confirm .button-rent-product-confirm {
    background: #151514 !important
}

.text-date-not-selected {
    color: #eb606c;
    font-family: Inter;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.43;
    margin-top: 12px;
    max-width: 496px
}

@media screen and (min-width: 1920px) {
    .text-date-not-selected {
        font-size: 20px;
        line-height: 1.4;
        min-width: 737px
    }
}

@media screen and (max-width: 1024px) {
    .text-date-not-selected {
        font-size: 12px;
        font-weight: 500;
        line-height: 1.33;
        max-width: 368px
    }
}

@media screen and (max-width: 423px) {
    .text-date-not-selected {
        font-size: 10px;
        font-weight: 500;
        line-height: 1.6
    }
}

.button-rent-product-confirm:disabled {
    background: #dedede !important;
    color: #fff
}

.air-datepicker--content {
    padding: 0 !important
}

.air-datepicker-cell.-day-.-other-month- {
    opacity: 0
}

.modal-filter__wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 700px;
    overflow-y: auto;
    padding-bottom: 110px
}

@media screen and (max-width: 723px) {
    .modal-filter__wrapper {
        gap: 8px
    }
}

.modal-filter {
    position: relative;
    display: flex;
    width: 100%;
    padding: 0 8px 12px;
    flex-direction: column;
    align-items: flex-start;
    background: #f4f4f4;
    box-shadow: 0 0 40px #00000080
}

.modal-filter__close {
    all: unset;
    cursor: pointer
}

.modal-filter__close svg {
    all: unset
}

@media screen and (max-width: 723px) {
    .modal-filter__close svg {
        width: 11px;
        height: 11px
    }
}

.modal-filter__header-top {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.modal-filter__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (max-width: 723px) {
    .modal-filter__title {
        font-size: 16px;
        line-height: 24px
    }
}

.modal-filter__header {
    display: flex;
    padding: 24px 20px;
    gap: 12px;
    flex-direction: column;
    border-radius: 0 0 16px 16px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (max-width: 723px) {
    .modal-filter__header {
        padding: 20px 16px;
        gap: 10px
    }
}

.modal-filter__block {
    display: flex;
    padding: 24px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 12px;
    background: #fff
}

@media screen and (max-width: 723px) {
    .modal-filter__block {
        padding: 20px 16px;
        gap: 14px
    }
}

.modal-filter__block-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch
}

.modal-filter__block-header-title {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px
}

@media screen and (max-width: 723px) {
    .modal-filter__block-header-title {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-filter__block-header-toggle {
    all: unset;
    color: #4da6cd;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-filter__block-header-toggle {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-filter__block-list {
    display: flex;
    align-items: center;
    align-content: flex-start;
    gap: 14px;
    align-self: stretch;
    flex-wrap: wrap
}

@media screen and (max-width: 723px) {
    .modal-filter__block-list {
        gap: 12px
    }
}

.modal-filter__block-list-item {
    display: flex;
    padding: 12px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #dedede;
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-filter__block-list-item {
        padding: 10px 12px;
        gap: 4px;
        border-radius: 8px;
        font-size: 12px;
        line-height: 16px
    }
}

.modal-filter__block-list-item-icon {
    width: 20px;
    height: 20px;
    object-fit: contain
}

.modal-filter__block-list-item-text {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    justify-content: space-between
}

.modal-filter__selected-item {
    display: flex;
    padding: 12px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 80px;
    border: .5px solid #dedede;
    background: #f4f4f4;
    color: #151514;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px
}

@media screen and (max-width: 723px) {
    .modal-filter__selected-item {
        padding: 8px 12px;
        font-size: 10px
    }
}

.modal-filter__selected-item-close {
    all: unset;
    cursor: pointer
}

.modal-filter__header-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px
}

.modal-filter__header-actions .reset-filter-mobile {
    all: unset;
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 13%;
    text-underline-offset: 25%;
    text-underline-position: from-font;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-filter__header-actions .reset-filter-mobile {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-filter__block-header-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

.modal-filter__block-list-item.active {
    border: 1px solid #58c7f7;
    background: #f4f4f4;
    font-weight: 600
}

.modal-filter__selected-list {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 10px;
    align-self: stretch;
    flex-wrap: wrap
}

.modal-filter__selected-arrow {
    background: none;
    border: none;
    margin-left: 8px;
    padding: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center
}

.modal-filter__block-reset {
    all: unset;
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 13%;
    text-underline-offset: 25%;
    text-underline-position: from-font;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-filter__block-reset {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-fullscreen {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #f4f4f4;
    z-index: 1000;
    display: flex;
    flex-direction: column
}

.modal-fullscreen__back {
    all: unset;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-fullscreen__back svg {
        width: 14px;
        height: 12px
    }
}

.modal-fullscreen__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    width: 100%
}

@media screen and (max-width: 723px) {
    .modal-fullscreen__list {
        grid-template-columns: 1fr
    }
}

.modal-fullscreen__container {
    padding: 0 8px 8px;
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.modal-fullscreen__container-wrapper {
    display: flex;
    padding: 24px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 0 0 16px 16px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

.modal-fullscreen__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.modal-fullscreen__list .modal-filter__block-list-item {
    padding: 16px;
    max-height: 52px;
    cursor: pointer
}

.modal-fullscreen__close {
    all: unset;
    cursor: pointer
}

.modal-fullscreen__header-left {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px
}

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

.modal-fullscreen__search-input {
    display: flex;
    padding: 16px 14px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 8px;
    width: 100%;
    border: .5px solid #dedede;
    background: #f4f4f4;
    outline: none;
    position: relative;
    z-index: 999;
    pointer-events: auto;
    min-height: 52px
}

.modal-fullscreen__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (max-width: 723px) {
    .modal-fullscreen__title {
        font-size: 16px
    }
}

[hidden] {
    display: none !important
}

.modal__footer {
    display: flex;
    width: auto;
    left: 8px;
    right: 8px;
    position: absolute;
    bottom: 0;
    padding: 24px 20px;
    border-radius: 16px 16px 0 0;
    background: #fff;
    box-shadow: 0 0 40px #0000001a, 0 0 40px #0000001a;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px
}

@media screen and (max-width: 723px) {
    .modal__footer {
        padding: 20px 16px
    }
}

.modal__footer-button {
    all: unset;
    width: 100%;
    display: flex;
    padding: 20px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 12px;
    background: #58c7f7;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal__footer-button {
        padding: 18px 8px
    }
}

.modal__footer--fullscreen {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 0;
    border-radius: 16px 16px 0 0;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

.modal__footer-button--apply {
    background: #58c7f7;
    color: #fff
}

.modal__footer-button--reset {
    background: #fff;
    border: 1px solid #dedede;
    color: #333
}

.modal-filter__block-group--dependent[hidden] {
    display: none !important
}

.modal-fullscreen__search svg {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 999;
    width: 16px;
    height: 16px
}

.count {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (max-width: 723px) {
    .count {
        font-size: 12px;
        line-height: 14px
    }
}

.modal-fullscreen__container-wrapper-list {
    border-radius: 12px
}

.modal-filter-selected {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    z-index: 1000;
    display: flex;
    flex-direction: column
}

.modal-filter-selected__container {
    padding: 0 8px 8px;
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.modal-filter-selected__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.modal-filter-selected__header-left {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px
}

.modal-filter-selected__search {
    position: relative;
    width: 100%
}

.modal-filter-selected__search-input {
    display: flex;
    padding: 16px 14px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 8px;
    width: 100%;
    border: .5px solid #dedede;
    background: #f4f4f4;
    outline: none;
    position: relative;
    z-index: 999;
    pointer-events: auto;
    min-height: 52px
}

.modal-filter-selected__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    width: 100%
}

@media screen and (max-width: 723px) {
    .modal-filter-selected__list {
        grid-template-columns: 1fr
    }
}

.modal-filter-selected__back {
    all: unset;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .modal-filter-selected__back svg {
        width: 14px;
        height: 12px
    }
}

.modal-filter-selected__block-list-item {
    display: flex;
    padding: 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #dedede;
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer;
    max-height: 52px
}

@media screen and (max-width: 723px) {
    .modal-filter-selected__block-list-item {
        font-size: 12px;
        line-height: 14px
    }
}

.modal-filter-selected__block-list-item .count {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (max-width: 723px) {
    .modal-filter-selected__block-list-item .count {
        font-size: 12px;
        line-height: 14px
    }
}

.modal-filter-selected__block-list-item-text {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    justify-content: space-between
}

.modal-filter-selected__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (max-width: 723px) {
    .modal-filter-selected__title {
        font-size: 16px
    }
}

.modal-filter-selected__block-list-item.is-active {
    border-radius: 8px;
    border: 1px solid #58c7f7;
    background: #f4f4f4;
    font-weight: 600
}

.selected__footer-button--reset {
    all: unset;
    width: 100%;
    display: flex;
    padding: 20px 8px;
    justify-content: center;
    border: 1px solid #dedede;
    color: #333;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 12px;
    background: #fff;
    cursor: pointer
}

.modal-filter-selected__search svg {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 999;
    width: 16px;
    height: 16px
}

.modal-city {
    display: flex;
    min-width: 530px;
    max-width: 530px;
    height: 510px;
    padding: 32px 24px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    justify-content: space-between
}

@media screen and (min-width: 1920px) {
    .modal-city {
        min-width: 875px;
        max-width: 875px;
        height: 808px;
        padding: 40px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city {
        min-width: 500px;
        max-width: 500px;
        height: 471px;
        padding: 24px 24px 32px;
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    .modal-city {
        min-width: 300px;
        max-width: 300px
    }
}

.modal-city .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .modal-city .content {
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .content {
        gap: 20px
    }
}

.modal-city .search-city {
    display: flex;
    padding: 20px 18px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 12px;
    border: .5px solid #dedede;
    background: #f4f4f4;
    position: relative;
    max-height: 64px
}

@media screen and (min-width: 1920px) {
    .modal-city .search-city {
        padding: 24px;
        border-radius: 16px;
        border: 1px solid #dedede;
        max-height: 86px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .search-city {
        padding: 18px;
        max-height: 56px
    }
}

.modal-city .search-city .search-field__input {
    background: transparent;
    border: none;
    height: 50px;
    z-index: 10;
    padding: 0 !important
}

@media screen and (min-width: 1920px) {
    .modal-city .search-city .search-field__input {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .search-city .search-field__input {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

.modal-city .search-city .search-city__icon {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .modal-city .search-city .search-city__icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .search-city .search-city__icon {
        width: 18px;
        height: 18px
    }
}

.modal-city .list-city {
    display: flex;
    padding-top: 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .modal-city .list-city {
        padding-top: 0;
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .modal-city .list-city {
        flex-wrap: wrap
    }
}

.modal-city .list-city__item {
    display: flex;
    padding: 14px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 12px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .modal-city .list-city__item {
        padding: 24px 32px;
        border-radius: 18px;
        border: 2px solid #dedede;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .list-city__item {
        padding: 14px 24px;
        border-radius: 8px
    }
}

.modal-city .list-city__item:hover {
    border: 1px solid #58c7f7
}

.modal-city .btn-save {
    height: 60px;
    font-size: 16px
}

@media screen and (min-width: 1920px) {
    .modal-city .btn-save {
        height: 92px;
        font-size: 24px
    }
}

.modal-city .search-list-city {
    display: none;
    width: 482px;
    height: max-content;
    max-height: 335px;
    padding: 12px 14px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    position: absolute;
    top: 76px;
    left: 0;
    border-radius: 12px;
    border: 1px solid #dedede;
    background: #fff;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026;
    overflow-y: auto
}

@media screen and (min-width: 1920px) {
    .modal-city .search-list-city {
        width: 795px;
        padding: 14px 16px;
        gap: 10px;
        border-radius: 16px;
        top: 96px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .search-list-city {
        padding: 6px 8px;
        width: 452px;
        top: 62px
    }
}

@media screen and (max-width: 723px) {
    .modal-city .search-list-city {
        width: 252px
    }
}

.modal-city .search-list-city__item {
    cursor: pointer;
    width: 100%;
    padding: 16px 12px;
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    border-radius: 8px
}

@media screen and (min-width: 1920px) {
    .modal-city .search-list-city__item {
        padding: 24px 20px;
        border-radius: 16px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .modal-city .search-list-city__item {
        padding: 14px 12px;
        font-size: 14px;
        line-height: 20px
    }
}

.modal-city .search-list-city__item:hover {
    font-weight: 600;
    background: #f4f4f4
}

.modal-city .search-city.active {
    background: #fff;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026
}

.modal-city .search-city.active .search-list-city {
    display: flex
}

.modal-city .search-field__input {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .modal-city .modal-title {
        font-size: 40px;
        line-height: 56px
    }
}

.modal-user {
    height: 372px;
    gap: 32px;
    padding: 32px 24px 40px 32px
}

@media screen and (min-width: 1920px) {
    .modal-user {
        height: 580px;
        padding: 40px
    }
}

@media screen and (max-width: 1359px) {
    .modal-user {
        height: 328px;
        padding: 24px 24px 32px;
        gap: 28px
    }
}

@media screen and (max-width: 723px) {
    .modal-user {
        height: max-content
    }
}

.modal-user .form-row-grid {
    row-gap: 32px !important
}

@media screen and (min-width: 1920px) {
    .modal-user .form-row-grid {
        column-gap: 48px !important
    }
}

@media screen and (max-width: 1359px) {
    .modal-user .form-row-grid {
        padding-top: 8px;
        row-gap: 28px
    }
}

.modal-user .form-row-grid .text-field__container {
    min-height: 56px;
    max-height: 56px
}

@media screen and (min-width: 1920px) {
    .modal-user .form-row-grid .text-field__container {
        min-height: 98px;
        max-height: 98px
    }
}

@media screen and (max-width: 1359px) {
    .modal-user .form-row-grid .text-field__container {
        min-height: 52px;
        max-height: 52px
    }
}

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

    .modal-user .name,
    .modal-user .surname {
        min-width: 100% !important;
        max-width: 100% !important
    }
}

.banner {
    position: relative;
    min-height: 360px;
    max-height: 360px;
    margin-bottom: 32px;
    color: #fff;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .banner {
        min-height: 520px;
        max-height: 520px;
        margin-bottom: 48px
    }
}

@media screen and (max-width: 1024px) {
    .banner {
        min-height: 272px;
        max-height: 272px
    }
}

@media screen and (max-width: 768px) {
    .banner {
        min-height: 236px;
        max-height: 236px
    }
}

.banner-actions {
    display: flex;
    justify-content: center
}

.banner-bg {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    box-shadow: 0 2px 8px -1px #372f321a;
    filter: drop-shadow(0px 0px 2px #f3f3f3);
    border-radius: 3px
}

.banner-container {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding-top: 8px
}

.banner-text {
    max-width: 520px;
    margin-top: 104px;
    text-align: center
}

@media screen and (min-width: 1920px) {
    .banner-text {
        max-width: 50%;
        margin-top: 156px
    }
}

@media screen and (max-width: 1024px) {
    .banner-text {
        max-width: 384px;
        margin-top: 68px
    }
}

@media screen and (max-width: 423px) {
    .banner-text {
        margin-top: 64px
    }
}

.banner-text__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 35px;
    line-height: 40px
}

@media screen and (min-width: 1920px) {
    .banner-text__title {
        font-size: 50px;
        line-height: 56px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1024px) {
    .banner-text__title {
        font-size: 26px;
        line-height: 40px
    }
}

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

.banner-text__description {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .banner-text__description {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1359px) {
    .banner-text__description {
        font-size: 16px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1023px) {
    .banner-text__description {
        font-size: 13px;
        line-height: 16px
    }
}

.swiper-pagination-certificate .swiper-pagination-bullet {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 80px;
    opacity: .8;
    background-color: #dedede;
    margin: 0 5px;
    overflow: hidden;
    transition: width .3s ease
}

@media screen and (max-width: 1023px) {
    .swiper-pagination-certificate .swiper-pagination-bullet {
        width: 6px;
        height: 6px
    }
}

.swiper-pagination-certificate .swiper-pagination-bullet-active {
    width: 100px;
    height: 10px;
    border-radius: 80px;
    opacity: .8;
    background-color: #dedede
}

@media screen and (max-width: 1023px) {
    .swiper-pagination-certificate .swiper-pagination-bullet-active {
        width: 60px !important;
        height: 6px !important
    }
}

.swiper-pagination-certificate .progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background-color: #fff;
    pointer-events: none
}

@keyframes progressFill {
    0% {
        width: 0%
    }

    to {
        width: 100%
    }
}

.text-block {
    padding: 32px 32px 40px;
    margin: 40px 0 48px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .text-block {
        padding: 48px;
        margin: 48px 0
    }
}

@media screen and (max-width: 1024px) {
    .text-block {
        margin: 24px 0;
        padding: 24px
    }
}

@media screen and (max-width: 768px) {
    .text-block {
        margin: 24px 0;
        padding: 32px 40px 40px 16px
    }
}

.text-block__title {
    margin-bottom: 24px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .text-block__title {
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 32px
    }
}

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

@media screen and (max-width: 768px) {
    .text-block__title {
        font-size: 22px;
        line-height: 24px
    }
}

.text-block__row {
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 16px
}

@media screen and (min-width: 1920px) {
    .text-block__row {
        column-gap: 32px;
        row-gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .text-block__row {
        column-gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .text-block__row {
        column-gap: 24px;
        position: relative;
        overflow-y: hidden;
        max-height: 300px
    }
}

.text-block__item {
    max-width: 520px
}

@media screen and (min-width: 1920px) {
    .text-block__item {
        max-width: 660px
    }
}

@media screen and (max-width: 1024px) {
    .text-block__item {
        max-width: 420px
    }
}

.text-block__item-title {
    margin-bottom: 8px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .text-block__item-title {
        font-size: 22px
    }
}

@media screen and (max-width: 1024px) {
    .text-block__item-title {
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 4px
    }
}

@media screen and (max-width: 768px) {
    .text-block__item-title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

.text-block__item-description {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514;
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

@media screen and (min-width: 1920px) {
    .text-block__item-description {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .text-block__item-description {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .text-block__item-description {
        font-size: 15px;
        line-height: 24px
    }
}

.text-block__cut {
    display: none
}

@media screen and (max-width: 768px) {
    .text-block__cut {
        display: block;
        width: max-content;
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        line-height: 26px;
        text-decoration: none;
        color: #58c7f7;
        border-bottom: 1px dashed #58c7f7;
        cursor: pointer
    }
}

.text-block--active .text-block__cut {
    display: none
}

.text-block--active .text-block__row,
.services-footer .text-block__row {
    overflow-y: visible;
    max-height: max-content
}

.modal-overlay {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px 0;
    position: fixed;
    z-index: -10;
    overflow-y: auto !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0009;
    opacity: 0;
    transform: translateY(-100%);
    transition: opacity .25s ease
}

@media screen and (max-width: 1023px) {
    .modal-overlay {
        align-items: center;
        padding: 0;
        overflow-y: visible
    }
}

.modal-overlay--visible {
    opacity: 1;
    z-index: 1000;
    transform: translateY(0)
}

.modal-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal-title {
        font-size: 32px;
        line-height: 32px
    }
}

.modal-form {
    margin-bottom: 24px
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

.modal-header--main {
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .modal-header--main {
        margin-bottom: 32px
    }
}

.modal-description {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    padding-bottom: 72px
}

.modal-socials {
    display: flex;
    align-items: center;
    column-gap: 16px
}

.modal-socials__item {
    display: flex;
    align-items: center;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .modal-socials__item {
        font-size: 16px;
        line-height: 24px
    }
}

.modal-socials__item img {
    margin-right: 4px
}

.close-button {
    cursor: pointer;
    min-width: 16px;
    max-width: 16px;
    min-height: 16px;
    max-height: 16px
}

@media screen and (min-width: 1920px) {
    .close-button {
        min-width: 32px;
        max-width: 32px;
        min-height: 32px;
        max-height: 32px
    }
}

.modal--white {
    padding: 24px 24px 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 24px
}

@media screen and (max-width: 1024px) {
    .modal--white {
        min-width: 312px;
        max-width: 312px
    }
}

.modal--white .button {
    width: 328px
}

@media screen and (max-width: 1024px) {
    .modal--white .button {
        width: 264px
    }
}

@media screen and (max-width: 1024px) {
    .modal--white .modal-title {
        font-size: 18px
    }
}

@media screen and (max-width: 1024px) {
    .modal--white .text-field__label {
        font-size: 12px;
        line-height: 16px
    }
}

.modal--white .text-field__placeholder {
    position: absolute;
    bottom: 5px;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .modal--white .text-field__placeholder {
        bottom: 4px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal--white .text-field__placeholder {
        bottom: 6px;
        font-size: 14px;
        line-height: 20px
    }
}

.modal--white .text-field__placeholder--gray,
.modal--white .text-field__placeholder a {
    color: #dedede;
    text-decoration: none;
    pointer-events: none
}

/* .modal-overlay--basket {
    align-items: flex-start
} */

.tags-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 16px;
    row-gap: 16px
}

@media screen and (min-width: 1920px) {
    .tags-list {
        gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .tags-list {
        column-gap: 4px;
        row-gap: 8px
    }
}

.tag {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: max-content;
    min-width: max-content;
    position: relative;
    z-index: 1;
    font-style: normal;
    line-height: 16px;
    color: #151514;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .tag {
        border-radius: 24px;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .tag {
        padding: 4px 8px;
        font-size: 12px;
        line-height: 16px
    }
}

.tag:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border-radius: 16px;
    background: #eff6fa;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .tag:before {
        border-radius: 24px
    }
}

.tag:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -2;
    background: radial-gradient(100.13% 3735.09% at 0% 0%, #6ddee1, #647eda);
    border-radius: 16px
}

@media screen and (min-width: 1920px) {
    .tag:after {
        border-radius: 24px
    }
}

.title-tags {
    color: #151514;
    font-family: Headline Base;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .title-tags {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .title-tags {
        font-size: 14px;
        line-height: 20px
    }
}

.tag-results__icon {
    vertical-align: middle;
    margin-left: 10px;
    display: inline-block
}

.container-tags {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.reset-filter {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer
}

@media screen and (max-width: 1359px) {
    .reset-filter {
        gap: 6px
    }
}

.reset-filter__text {
    color: #ff3f5f;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .reset-filter__text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .reset-filter__text {
        font-size: 10px;
        line-height: 10px
    }
}

.reset-filter__button {
    width: 8px;
    height: 8px
}

@media screen and (max-width: 1359px) {
    .reset-filter__button {
        width: 6px;
        height: 6px
    }
}

.container-sort-block {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .container-sort-block {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1360px) {
    .container-sort-block {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1024px) {
    .container-sort-block {
        margin-bottom: 0
    }
}

@media screen and (min-width: 724px) and (max-width: 1023px) {
    .container-sort-block {
        margin-bottom: clamp(10px, 16px - (100vw - 724px) * 16 / 299, 16px)
    }
}

@media screen and (max-width: 723px) {
    .container-sort-block {
        margin-bottom: 16px
    }
}

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

@media screen and (min-width: 1920px) {
    .sort-block {
        column-gap: 16px
    }
}

.sort-block-title {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .sort-block-title {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-title {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .sort-block-title {
        display: none
    }
}

.sort-block.active .sort-block-field {
    border: .5px solid #58c7f7;
    border-radius: 8px;
    background: #fff
}

.sort-block.active .sort-block-field .sort-block-field__current:after {
    opacity: 0
}

.sort-block.active .sort-block-field .sort-block-field__list {
    opacity: 1;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 4px;
    pointer-events: auto
}

.sort-block-field {
    position: relative;
    border-radius: 8px;
    border: 1px solid #dedede;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.sort-block-field:hover {
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026
}

.sort-block-field__list {
    position: absolute;
    right: 0;
    bottom: -186px;
    z-index: -10;
    min-width: max-content;
    width: 100%;
    padding: 6px;
    background: #fff;
    border: 1px solid #dedede;
    border-radius: 8px;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026;
    opacity: 0;
    display: none;
    pointer-events: none;
    cursor: pointer;
    transition: opacity .25s ease
}

@media screen and (min-width: 1920px) {
    .sort-block-field__list {
        padding: 10px;
        min-width: max-content;
        bottom: -226px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__list {
        padding: 10px 8px;
        bottom: -268px
    }
}

.sort-block-field__list-item {
    min-width: max-content;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    padding: 8px 12px;
    color: #151514;
    border: 1px solid transparent
}

.sort-block-field__list-item:hover {
    border-radius: 6px;
    border: 1px solid var(--Stroke-Grey, #dedede)
}

@media screen and (min-width: 1920px) {
    .sort-block-field__list-item {
        font-size: 20px;
        line-height: 24px;
        padding: 10px 14px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__list-item {
        font-size: 12px;
        padding: 10px 8px
    }
}

.sort-block-field__text {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .sort-block-field__text {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__text {
        font-size: 12px
    }
}

.sort-block-field__current {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: max-content;
    max-width: 100%;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .sort-block-field__current {
        font-size: 16px;
        line-height: 24px;
        padding: 8px 14px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__current {
        padding: 6px 12px
    }
}

@media screen and (max-width: 768px) {
    .sort-block-field__current {
        padding: 4px;
        font-size: 12px;
        line-height: 16px
    }
}

.sort-block-field__value {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px
}

@media screen and (max-width: 1359px) {
    .sort-block-field__value {
        gap: 12px
    }
}

.sort-block-field__value-left {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

.sort-block-field__icon svg {
    width: 11px;
    height: 12px
}

@media screen and (min-width: 1920px) {
    .sort-block-field__icon svg {
        width: 13px;
        height: 14px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__icon svg {
        width: 10px;
        height: 10px
    }
}

.sort-block-desktop {
    display: flex;
    margin-left: auto
}

@media screen and (max-width: 768px) {
    .sort-block-desktop {
        display: none
    }
}

.sort-block--mobile {
    display: none;
    margin-top: 20px
}

@media screen and (max-width: 768px) {
    .sort-block--mobile {
        display: block;
        margin-top: 0
    }
}

.product-categories {
    display: flex;
    padding: 40px 24px 48px;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
    border-radius: 16px;
    background-image: url(../assets/sort-banner.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed
}

@media screen and (min-width: 1920px) {
    .product-categories {
        padding: 56px 40px 72px;
        gap: 32px;
        border-radius: 20px
    }
}

@media screen and (max-width: 1359px) {
    .product-categories {
        padding: 32px 24px 40px
    }
}

@media screen and (max-width: 1024px) {
    .product-categories {
        background-size: 120%;
        margin-top: 16px
    }
}

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

.product-categories__block {
    display: flex;
    min-width: 290px;
    max-width: 400px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px
}

@media screen and (min-width: 2370px) {
    .product-categories__block {
        min-width: 500px !important;
        gap: 14px
    }
}

@media screen and (min-width: 1920px) {
    .product-categories__block {
        min-width: 396px;
        max-width: 500px;
        gap: 14px
    }
}

@media screen and (max-width: 1359px) {
    .product-categories__block {
        min-width: 288px;
        gap: 10px
    }
}

.product-categories__title {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .product-categories__title {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-categories__title {
        font-size: 12px;
        line-height: 12px
    }
}

.sort {
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    color: #151514;
    gap: 10px;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    flex: 1;
    min-width: 0;
    max-width: 100%
}

@media screen and (min-width: 1920px) {
    .sort {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .sort {
        font-size: 12px;
        line-height: 14px
    }
}

.select-wrapper {
    position: relative;
    width: 100%;
    max-width: 280px;
    border: 1px solid #ccc;
    background-color: #fff;
    border-radius: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none
}

.sort-button {
    width: 290px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border-radius: 12px;
    background: #fff;
    gap: 10px;
    box-sizing: border-box;
    overflow: hidden
}

@media screen and (min-width: 2370px) {
    .sort-button {
        width: 500px !important
    }
}

@media screen and (min-width: 1920px) {
    .sort-button {
        padding: 20px;
        width: 396px;
        gap: 12px
    }
}

@media screen and (max-width: 1359px) {
    .sort-button {
        width: 288px;
        padding: 10px 12px;
        height: 40px;
        gap: 8px
    }
}

.sort-button__icon-logo {
    width: 26px;
    height: 14px;
    flex-shrink: 0
}

@media screen and (min-width: 1920px) {
    .sort-button__icon-logo {
        width: 32px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .sort-button__icon-logo {
        width: 22px;
        height: 12px
    }
}

.sort-button__icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px
}

.sort-options {
    position: absolute;
    right: 64px;
    top: 56px;
    left: 0;
    width: 290px;
    padding: 18px 14px;
    border-radius: 12px;
    border: 1px solid #dedede;
    min-height: max-content;
    max-height: 290px;
    background: #fff;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026;
    z-index: 10;
    display: none
}

@media screen and (min-width: 2370px) {
    .sort-options {
        width: 500px !important
    }
}

@media screen and (min-width: 1920px) {
    .sort-options {
        width: 396px;
        max-height: 476px;
        padding: 20px;
        top: 88px
    }
}

@media screen and (max-width: 1359px) {
    .sort-options {
        top: 54px
    }
}

.sort-options .sort-options-list {
    display: flex;
    width: 100%;
    max-height: 250px;
    overflow-y: auto;
    flex-direction: column;
    align-items: flex-start;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.sort-options .sort-options-list::-webkit-scrollbar {
    display: none
}

.sort-options.active {
    display: flex;
    flex-direction: column
}

.sort-options.active .filter-actions {
    display: flex;
    width: 262px;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    position: relative;
    padding-bottom: 0;
    background: #fff
}

@media screen and (min-width: 1920px) {
    .sort-options.active .filter-actions {
        width: 356px;
        gap: 16px
    }
}

.sort-options.active .filter-actions__apply {
    display: flex;
    padding: 16px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 8px;
    background: #58c7f7;
    color: #fff;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .sort-options.active .filter-actions__apply {
        padding: 20px 8px;
        border-radius: 12px;
        min-width: 170px;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .sort-options.active .filter-actions__apply {
        padding: 14px 8px
    }
}

.sort-options.active .filter-actions__apply:hover {
    background: #6cd3ff
}

.sort-options.active .filter-actions__reset {
    display: flex;
    padding: 16px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 8px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .sort-options.active .filter-actions__reset {
        padding: 20px 8px;
        border-radius: 12px;
        min-width: 170px;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .sort-options.active .filter-actions__reset {
        padding: 14px 8px
    }
}

.selected-tags {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    overflow-x: auto;
    max-width: calc(100% - 30px)
}

.tag-results {
    display: flex;
    align-items: center;
    font-size: 14px;
    white-space: nowrap;
    font-weight: 500;
    line-height: 20px;
    position: relative
}

@media screen and (min-width: 1920px) {
    .tag-results {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .tag-results {
        font-size: 12px;
        line-height: 14px
    }
}

.placeholder {
    color: #999
}

.option-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    color: #151514;
    font-weight: 500;
    border: 1px solid transparent
}

@media screen and (min-width: 1920px) {
    .option-item {
        font-size: 18px;
        line-height: 24px;
        border-radius: 12px !important
    }
}

@media screen and (max-width: 1359px) {
    .option-item {
        font-size: 12px;
        line-height: 14px
    }
}

.option-item:hover {
    border: 1px solid #dedede;
    border-radius: 6px
}

@media screen and (min-width: 1920px) {
    .option-item:hover {
        border-radius: 12px
    }
}

.option-item input[type=checkbox] {
    display: none
}

.custom-checkbox {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid #dedede;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    flex-shrink: 0
}

@media screen and (min-width: 1920px) {
    .custom-checkbox {
        width: 24px;
        height: 24px
    }
}

.custom-checkbox:hover {
    border: 1px solid var(--Text-Link, #58c7f7)
}

.custom-checkbox .check-icon {
    display: none;
    width: 12px;
    height: 8px
}

@media screen and (min-width: 1920px) {
    .custom-checkbox .check-icon {
        width: 16px;
        height: 10px
    }
}

.custom-checkbox .check-icon path {
    fill: #fff !important;
    stroke: #fff !important
}

.option-item input[type=checkbox]:checked+.custom-checkbox {
    background-color: #58c7f7;
    border-color: #58c7f7
}

.option-item input[type=checkbox]:checked+.custom-checkbox .check-icon {
    display: block
}

.sort-select {
    width: 100%;
    justify-content: space-between !important;
    gap: 4px !important
}

@media screen and (min-width: 1920px) {
    .sort-select {
        gap: 6px !important
    }
}

@media screen and (max-width: 1359px) {
    .sort-select {
        gap: 4px !important
    }
}

.select-options {
    display: flex;
    gap: 8px;
    padding: 10px 8px;
    border-radius: 6px;
    align-items: center;
    justify-content: center
}

@media screen and (min-width: 1920px) {
    .select-options {
        padding: 18px 12px
    }
}

@media screen and (max-width: 1359px) {
    .select-options {
        gap: 6px
    }
}

.select-options__count {
    color: #888;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .select-options__count {
        font-size: 14px
    }
}

@media screen and (max-width: 1359px) {
    .select-options__count {
        font-size: 10px
    }
}

.sort-button__icon {
    transition: transform .3s ease;
    transform-origin: center
}

@media screen and (max-width: 1359px) {
    .sort-button__icon {
        width: 20px;
        height: 20px
    }
}

.sort-button.opened .sort-button__icon {
    transform: rotate(180deg)
}

@media screen and (max-width: 1023px) {
    .sort-desktop {
        display: none
    }
}

.sort-wrapper-mobile__container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1 0 0
}

.sort-wrapper-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-mobile {
        position: relative;
        display: flex;
        align-items: flex-start;
        gap: 14px;
        align-self: stretch;
        padding: 0 28px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-mobile {
        gap: 10px;
        padding: 0 16px;
        margin-bottom: 10px
    }
}

.sort-wrapper-mobile__filter-btn {
    display: flex;
    padding: 20px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    border-radius: 12px;
    background: #58c7f7;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

.sort-wrapper-mobile__filter-btn:hover {
    background-color: #6cd3ff
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-mobile__filter-btn {
        padding: 16px 8px;
        max-height: 46px;
        font-size: 12px;
        line-height: 14px
    }
}

.sort-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .sort-mobile {
        display: flex;
        flex: 1 0 0;
        width: 100%
    }

    .sort-mobile .sort-block-field,
    .sort-mobile .sort-block {
        width: 100%
    }

    .sort-mobile .sort-block-field__current {
        padding: 20px 8px;
        color: #151514;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (max-width: 1023px) {
    .sort-mobile .sort-block-field__current {
        padding: 16px 8px;
        max-height: 46px
    }
}

@media screen and (max-width: 1023px) {
    .sort-mobile .sort-block-field__current svg {
        width: 11px;
        height: 11px
    }

    .sort-mobile .sort-block-field__value {
        display: flex;
        align-items: center;
        gap: 6px
    }
}

.mobile-select-modal {
    position: fixed;
    left: 0;
    right: 0;
    bottom: -100%;
    z-index: 9999;
    background: #fff;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    box-shadow: 0 -4px 20px #0000001a;
    transition: bottom .3s ease-in-out;
    padding: 16px;
    max-height: 60vh;
    overflow-y: auto
}

@media screen and (max-width: 1023px) {
    .mobile-select-modal {
        border-radius: 16px 16px 0 0
    }
}

.mobile-select-modal.open {
    bottom: 0
}

.mobile-select-modal__content {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column
}

.mobile-select-modal .mobile-modal-item {
    display: flex;
    padding: 16px;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    flex: 1 0 0;
    border-radius: 8px;
    border: .8px solid #dedede;
    color: #151514;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    flex: 1 1 calc(50% - 8px);
    box-sizing: border-box;
    cursor: pointer
}

.mobile-select-modal .mobile-modal-item.active {
    border-radius: 8px;
    border: .8px solid var(--Stroke-Grey, #dedede);
    background: var(--Back-Grey, #f4f4f4)
}

@media screen and (max-width: 1023px) {
    .mobile-select-modal .mobile-modal-item {
        padding: 14px 12px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (min-width: 1024px) {
    .mobile-select-modal {
        display: none
    }
}

.filter-action-mobile {
    margin-top: 12px;
    padding: 14px 20px;
    background-color: #58c7f7;
    color: #fff;
    font-weight: 700;
    border-radius: 12px;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    font-size: 14px;
    line-height: 20px
}

.filter-action-mobile:hover {
    background-color: #6cd3ff
}

@media screen and (min-width: 1024px) {
    .filter-action-mobile {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .mobile-select-list {
        display: flex;
        flex-wrap: wrap;
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-select-list {
        flex-wrap: nowrap;
        flex-direction: column
    }
}

.selected-filters-main {
    display: none
}

@media screen and (max-width: 1023px) {
    .selected-filters-main {
        display: flex;
        align-items: center;
        padding: 0 28px 24px;
        gap: 10px;
        width: 100%;
        box-sizing: border-box;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap
    }

    .selected-filters-main::-webkit-scrollbar {
        height: 1px
    }

    .selected-filters-main::-webkit-scrollbar-track {
        background: #f4f4f4
    }

    .selected-filters-main::-webkit-scrollbar-thumb {
        background-color: #dedede;
        border-radius: 1px
    }

    .selected-filters-main .filter__selected-item {
        flex-shrink: 0;
        display: flex;
        padding: 8px 10px;
        justify-content: center;
        align-items: center;
        gap: 6px;
        border-radius: 8px;
        border: .5px solid #dedede;
        background: #f4f4f4;
        color: #151514;
        font-size: 10px;
        font-style: normal;
        font-weight: 500;
        line-height: 14px;
        cursor: pointer
    }
}

@media screen and (max-width: 1023px) {
    .selected-filters-main {
        margin: 0 0 24px;
        padding-bottom: 10px;
        padding-left: 0;
        padding-right: 0;
        width: 91%
    }
}

.sort-block-field__value {
    position: relative
}

.sort-block-field__value .sort-arrow {
    transition: transform .3s ease
}

@media screen and (min-width: 1920px) {
    .sort-block-field__value .sort-arrow {
        width: 14px;
        height: 8px
    }
}

@media screen and (max-width: 1359px) {
    .sort-block-field__value .sort-arrow {
        width: 10px;
        height: 5px
    }
}

.sort-block-field__value.opened .sort-arrow {
    transform: rotate(180deg)
}

.breadcrumbs-results {
    flex-direction: column;
    gap: 12px
}

@media screen and (min-width: 1920px) {
    .breadcrumbs-results {
        padding: 0 80px !important
    }
}

@media screen and (max-width: 1023px) {
    .breadcrumbs-results {
        margin: 16px 0 0 !important
    }
}

.option-item.active {
    background-color: #f4f4f4;
    border-radius: 8px;
    font-weight: 600
}

[data-el=selectable-items].active {
    border-radius: 8px;
    background: #f4f4f4;
    font-weight: 600 !important
}

.modal-overlay-results {
    align-items: flex-start;
    padding: 0
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-mobile-results {
        padding: 0 !important
    }
}

.cabinet-menu {
    display: flex;
    flex-direction: column;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    width: 168px;
    margin-top: 8px;
    padding: 8px;
    position: absolute;
    top: 40px;
    right: 0;
    z-index: -5;
    opacity: 0;
    transition: opacity .25s ease;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .cabinet-menu {
        font-size: 18px;
        width: 224px;
        top: 56px
    }
}

@media screen and (max-width: 1024px) {
    .cabinet-menu {
        font-size: 10px;
        line-height: 12px;
        width: 120px
    }
}

@media screen and (max-width: 768px) {
    .cabinet-menu {
        font-size: 16px;
        line-height: 24px;
        width: 168px;
        left: 0;
        top: -235px
    }
}

.cabinet-menu__link {
    padding: 8px;
    margin-bottom: 8px;
    color: #151514;
    cursor: pointer;
    text-decoration: none
}

.cabinet-menu__link:hover {
    color: #128de7
}

.cabinet-menu__link:last-child {
    display: flex;
    align-items: center;
    padding-top: 16px;
    margin-bottom: 0;
    border-top: 1px solid #dedede
}

.cabinet-menu__bonuses {
    margin-left: 8px;
    color: #4dcc8c
}

.cabinet-menu.active {
    opacity: 1;
    transition: opacity .25s ease;
    z-index: 5
}

.cabinet-menu__icon {
    margin-left: 8px
}

/* .search-main {
    position: absolute;
    top: 150%;
    left: 10%;
    z-index: -5;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (max-width: 1359px) {
    .search-main {
        left: 10%
    }
}

.search-main--active {
    z-index: 15;
    opacity: 1;
    pointer-events: auto
}

@media screen and (max-width: 1023px) {
    .search-main--active {
        display: none
    }
}

.search-main .search-content {
    position: absolute;
    width: 973px;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514;
    display: flex;
    flex-direction: column;
    height: 509px;
    background: var(--Text-White, #fff);
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .search-main .search-content {
        height: 662px;
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-content {
        width: 850px;
        height: 459px;
        padding: 24px 20px;
        gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-content {
        min-width: 100vw;
        min-height: 776px;
        box-shadow: none;
        padding: 0
    }
}

.search-main .search-content__wrapper {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    height: 509px;
    width: 1148px;
    padding: 28px 24px 32px;
    justify-content: space-between;
    gap: 40px;
    flex-shrink: 0;
    border-radius: 24px;
    background: var(--Text-White, #fff);
    box-shadow: 0 20px 40px #0006, 0 0 24px #0000001a
}

@media screen and (min-width: 1920px) {
    .search-main .search-content__wrapper {
        height: 662px;
        gap: 48px;
        width: 1450px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-content__wrapper {
        width: 927px;
        height: 459px;
        padding: 24px 20px;
        gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-content__wrapper {
        min-height: 776px;
        box-shadow: none;
        padding: 0
    }
}

.search-main .search-block {
    display: flex;
    flex-direction: column
}

.search-main .search-block a {
    text-decoration: none;
    color: #151514
}

.search-main .search-products {
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: max-content
}

@media screen and (max-width: 1023px) {
    .search-main .search-products {
        max-height: 280px
    }
}

.search-main .search-products::-webkit-scrollbar {
    width: 5px
}

@media screen and (max-width: 1023px) {
    .search-main .search-products::-webkit-scrollbar {
        width: 2px
    }
}

.search-main .search-products::-webkit-scrollbar-track {
    background: #f1f2f400
}

.search-main .search-products::-webkit-scrollbar-thumb {
    background: #0003
}

.search-main .search-products__item {
    display: flex;
    align-items: center;
    padding: 0 16px 0 4px
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__item {
        padding-left: 0
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item {
        padding: 0 8px 4px
    }
}

.search-main .search-products__item-img {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    max-width: 64px;
    min-height: 64px;
    max-height: 64px;
    margin: 4px 4px 4px 0
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-img {
        min-width: 40px;
        max-width: 40px;
        min-height: 40px;
        max-height: 40px;
        margin-right: 8px
    }
}

@media screen and (max-width: 723px) {
    .search-main .search-products__item-img {
        min-width: 48px;
        max-width: 48px;
        min-height: 48px;
        max-height: 48px;
        margin-top: 0;
        margin-bottom: 0
    }
}

.search-main .search-products__item-img img {
    width: 100%;
    height: 64px;
    object-fit: cover
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-img img {
        height: 40px
    }
}

.search-main .search-products__item-container {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 8px;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__item-container {
        column-gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__item-container {
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-container {
        margin-left: 0;
        column-gap: 8px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-name {
        max-width: 220px;
        font-size: 12px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .search-main .search-products__item-name {
        max-width: 150px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__item-name--labels {
        max-width: 220px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-name--labels {
        max-width: 180px
    }
}

@media screen and (max-width: 723px) {
    .search-main .search-products__item-name--labels {
        max-width: 110px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__item-title {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-title {
        font-size: 13px
    }
}

.search-main .search-products__item-description {
    font-size: 13px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__item-description {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__item-description {
        font-size: 12px;
        line-height: 14px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-description {
        font-size: 10px;
        line-height: 12px
    }
}

.search-main .search-products__item-price {
    min-width: max-content
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-price {
        font-size: 12px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .search-main .search-products__item-price {
        line-height: 16px
    }
}

.search-main .search-products__item-price--old {
    font-size: 13px;
    line-height: 16px;
    color: #b6b6b6;
    text-decoration: line-through
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__item-price--old {
        font-size: 15px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__item-price--old {
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-price--old {
        font-size: 10px;
        line-height: 12px
    }
}

.search-main .search-products__item-price--sale {
    font-size: 15px;
    line-height: 15px;
    color: #4dcc8c;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__item-price--sale {
        font-size: 20px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__item-price--sale {
        font-size: 13px;
        line-height: 16px;
        margin-bottom: 0
    }
}

.search-main .search-products__item:hover {
    background: #f0f6fb
}

.search-main .search-products__item--inactive {
    opacity: .4
}

.search-main .search-products__labels {
    display: flex;
    column-gap: 8px;
    align-items: center
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__labels {
        display: none
    }
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__labels .product-lable {
        padding: 4px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__labels .product-lable {
        padding: 1px 4px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__labels .product-lable__text {
        line-height: 12px
    }
}

.search-main .search-products__wrapper {
    display: flex;
    column-gap: 16px;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__wrapper {
        column-gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__wrapper {
        column-gap: 12px
    }
}

.search-main .search-products__buy {
    display: flex;
    column-gap: 8px;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__buy {
        column-gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__buy {
        column-gap: 4px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-products__buy {
        column-gap: 8px
    }
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__buy .card-buy {
        width: 40px;
        height: 40px
    }
}

.search-main .search-products__buy .card-buy svg {
    min-width: 20px;
    max-width: 20px;
    height: auto
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__buy .card-buy svg {
        min-width: 23px;
        max-width: 23px;
        min-height: auto;
        max-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__buy .card-buy svg {
        transform: none
    }
}

.search-main .search-products__buy .card-buy--count {
    justify-content: flex-start
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__buy .card-buy--count {
        min-width: 61px;
        max-width: 61px;
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__buy .card-buy--count {
        max-width: 54px;
        gap: 2px
    }
}

@media screen and (min-width: 1920px) {
    .search-main .search-products__buy .card-buy--count-numb {
        font-size: 15px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-products__buy .card-buy--count-numb {
        font-size: 12px;
        line-height: 14px
    }
}

.search-main .search-text {
    margin-top: 8px
}

@media screen and (max-width: 1359px) {
    .search-main .search-text {
        margin: 0
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-text {
        margin-bottom: 8px
    }
}

.search-main .search-text__item {
    color: #494949;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .search-main .search-text__item {
        font-size: 18px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-text__item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-text__item {
        font-size: 12px;
        line-height: 14px;
        padding: 8px 16px
    }
}

.search-main .search-text__item:hover {
    background: none
}

.search-main .search-text__item--bold {
    font-weight: 700
}

.search-main .search-categories {
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 16px;
    row-gap: 4px;
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 84px;
    max-height: 84px;
    padding: 0 12px
}

@media screen and (min-width: 1920px) {
    .search-main .search-categories {
        column-gap: 20px;
        row-gap: 8px;
        min-height: 104px;
        max-height: 104px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-categories {
        column-gap: 12px;
        row-gap: 4px;
        min-height: 68px;
        max-height: 68px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-categories {
        padding: 0 8px;
        column-gap: 8px;
        row-gap: 0;
        min-height: 56px;
        max-height: 56px
    }
}

.search-main .search-categories__item {
    padding: 8px;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .search-main .search-categories__item {
        padding: 8px 16px 8px 12px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-categories__item {
        padding: 4px 8px 4px 4px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-categories__item {
        font-size: 13px;
        padding: 2px 0 2px 5px
    }
}

.search-main .search-categories__item svg {
    margin-right: 12px
}

@media screen and (min-width: 1920px) {
    .search-main .search-categories__item svg {
        margin-right: 16px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-categories__item svg {
        margin-right: 8px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-categories__item svg {
        width: 18px;
        height: 15px;
        margin-right: 10px
    }
}

.search-main .search-categories__item:hover {
    background: #f0f6fb
}

.search-main .search-result {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 24px;
    padding-top: 24px;
    color: #58c7f7;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .search-main .search-result {
        font-size: 20px;
        line-height: 32px;
        padding-bottom: 16px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-result {
        font-size: 13px;
        line-height: 16px;
        padding: 16px 0
    }
}

.search-main .search-result svg {
    margin-right: 8px
}

@media screen and (max-width: 1023px) {
    .search-main .search-result svg {
        display: none
    }
}

.search-main .search-no-results {
    display: none;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 0 0 24px;
    width: 100%;
    margin-bottom: 0
}

@media screen and (min-width: 1920px) {
    .search-main .search-no-results {
        padding: 0 0 32px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-no-results {
        padding: 0 0 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-no-results {
        display: none !important
    }
}

.search-main .search-no-results--mobile {
    display: none;
    align-items: center;
    text-align: center;
    padding: 0 0 16px
}

@media screen and (max-width: 1023px) {
    .search-main .search-no-results--mobile {
        padding: 0 0 16px
    }
}

.search-main .search-no-results__title {
    font-family: Inter;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    color: #151514;
    margin: 0 0 8px
}

@media screen and (min-width: 1920px) {
    .search-main .search-no-results__title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1359px) and (min-width: 1024px) {
    .search-main .search-no-results__title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-no-results__title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 4px
    }
}

.search-main .search-no-results__message {
    font-family: Inter;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #151514;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .search-main .search-no-results__message {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-no-results__message {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-no-results__message {
        font-size: 14px;
        line-height: 20px
    }
}

.search-main .search-no-results__divider {
    width: 100%;
    border: 1px solid var(--Stroke-Grey, #dedede);
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .search-main .search-no-results__divider {
        margin-top: 32px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-no-results__divider {
        margin-top: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-no-results__divider {
        margin-top: 16px
    }
}

.search-main .search-coincidence {
    position: relative;
    overflow: hidden;
    min-height: 40px;
    max-height: 40px;
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    padding: 8px 12px
}

@media screen and (min-width: 1920px) {
    .search-main .search-coincidence {
        min-height: 64px;
        max-height: 64px;
        padding: 16px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1359px) {
    .search-main .search-coincidence {
        gap: 24px;
        padding: 8px 12px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-coincidence {
        column-gap: 8px;
        max-height: 56px;
        padding: 16px
    }
}

.search-main .search-coincidence__item {
    font-size: 15px;
    line-height: 24px;
    color: #151514;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .search-main .search-coincidence__item {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .search-main .search-coincidence__item {
        font-size: 13px
    }
}

.search-main .search-coincidence__item--active {
    color: #58c7f6
}

.search-main .search-coincidence__item--disabled {
    opacity: .5
}

.search--active {
    display: none
}

@media screen and (max-width: 1023px) {
    .header-search--responsive .search-products__labels {
        max-width: 100%;
        width: min-content;
        flex-wrap: wrap;
        justify-content: flex-end;
        row-gap: 4px
    }
}

.header-search--responsive .search-products__item-container {
    overflow: hidden
}

@media screen and (max-width: 1359px) {
    .header-search--responsive .search-products__item-name {
        max-width: 70%
    }
}

@media screen and (max-width: 1023px) {
    .header-search--responsive .search-products__item-name {
        max-width: 40%
    }
}

@media screen and (max-width: 723px) {
    .header-search--responsive .search-products__item-name {
        max-width: 50%
    }
}

@media screen and (max-width: 1280px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 35%
    }
}

@media screen and (max-width: 1024px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 40%
    }
}

@media screen and (max-width: 768px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 60%
    }
}

@media screen and (max-width: 520px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 50%
    }
}

@media screen and (max-width: 423px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 40%
    }
}

@media screen and (max-width: 380px) {
    .header-search--responsive .search-products__item-name--labels {
        max-width: 75px
    }
}

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

    .header-search--responsive .search-products__item-description,
    .header-search--responsive .search-products__item-title {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }
}

.search-main-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .search-main-mobile {
        display: flex;
        position: absolute;
        z-index: 55;
        opacity: 0;
        pointer-events: none
    }

    .search-main-mobile--active {
        pointer-events: auto;
        z-index: 15;
        opacity: 1;
        border-radius: 0
    }

    .search-main-mobile .search-content {
        position: absolute;
        overflow-y: auto;
        max-height: 776px;
        box-shadow: none
    }

    .search-main-mobile .search-content__wrapper {
        position: absolute;
        overflow: hidden;
        display: flex;
        top: -42px;
        flex-direction: column;
        padding: 106px 28px 20px;
        width: 100%;
        background: var(--Text-White, #fff);
        box-shadow: 0 20px 40px #0006, 0 0 24px #0000001a;
        max-height: 776px;
        min-height: 776px
    }
}

@media screen and (max-width: 1023px) and (max-width: 1023px) {
    .search-main-mobile .search-content__wrapper {
        border-radius: 0 0 12px 12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .search-main-mobile .search-content__wrapper {
        padding: 78px 12px 12px
    }
}

@media screen and (max-width: 1023px) {
    .search-main-mobile .search-text__item {
        color: #494949;
        font-size: 14px;
        font-weight: 700;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-field--mobile-active {
        display: flex;
        gap: 12px;
        padding-right: 28px
    }
}

@media screen and (max-width: 723px) {
    .search-field--mobile-active {
        min-width: 100%
    }
}

@media screen and (max-width: 1023px) {
    .search-field--mobile-active .search-field__button {
        right: 40px
    }
}

@media screen and (max-width: 723px) {
    .search-field--mobile-active .search-field__button {
        right: 32px
    }
} */

.search-header,
.header-search .btn-close {
    display: none
}

@media screen and (max-width: 1023px) {
    .search-field--mobile-active .btn-close {
        display: block;
        position: relative;
        z-index: 55;
        margin-left: 28px;
        cursor: pointer
    }
}

@media screen and (max-width: 723px) {
    .search-field--mobile-active .btn-close {
        min-width: 20px;
        max-width: 20px;
        min-height: 17px;
        max-height: 17px;
        margin-left: 12px
    }
}

.search-field__input--active {
    border: 1px solid var(--Text-Link, #58c7f7);
    box-shadow: 0 0 10px #0000001a
}

.btn-close {
    min-width: 14px;
    height: 12px
}

.search-field__button--active {
    background-color: #58c7f7
}

.search-field__button--active .search-field__icon svg {
    fill: #fff !important
}

@media screen and (max-width: 1023px) {
    .search-field__button--active .search-field__icon svg {
        width: 14px;
        height: 14px
    }
}

.search-clear-btn {
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    display: none;
    cursor: pointer
}

.search-clear-btn svg {
    pointer-events: none
}

@media screen and (max-width: 723px) {
    .search-clear-btn svg {
        width: 8px;
        height: 8px
    }
}

.search-clear-btn.active {
    display: flex;
    right: 60px;
    z-index: 555
}

@media screen and (min-width: 1920px) {
    .search-clear-btn.active {
        right: 90px
    }

    .search-clear-btn.active svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .search-clear-btn.active {
        height: 10px
    }

    .search-clear-btn.active svg {
        width: 10px;
        height: 10px
    }
}

@media screen and (max-width: 1023px) {
    .search-clear-btn.active {
        right: 90px;
        width: 12px;
        height: 12px
    }

    .search-clear-btn.active svg {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 723px) {
    .search-clear-btn.active {
        right: 80px
    }
}

.sort-wrapper {
    display: flex;
    flex-direction: column;
    padding: 12px 40px 0
}

@media screen and (min-width: 1920px) {
    .sort-wrapper {
        padding: 16px 80px 0
    }
}

@media screen and (max-width: 1359px) {
    .sort-wrapper {
        padding: 12px 32px 0
    }
}

@media screen and (max-width: 1023px) {
    .sort-wrapper {
        padding: 11px 28px 0
    }
}

@media screen and (max-width: 723px) {
    .sort-wrapper {
        padding: 8px 16px 0
    }
}

.order-detail-modal {
    position: relative;
    display: flex;
    width: 900px;
    max-height: 1350px;
    padding: 32px 24px 24px 32px;
    flex-direction: column;
    gap: 32px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a
}

@media screen and (min-width: 1920px) {
    .order-detail-modal {
        width: 1400px;
        padding: 48px 38px 48px 48px;
        gap: 48px;
        max-height: 1800px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal {
        width: 780px;
        max-height: 1200px;
        padding: 24px;
        gap: 28px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .order-detail-modal {
        width: 700px;
        max-height: 1000px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal {
        width: 320px
    }
}

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

@media screen and (max-width: 1023px) {
    .order-detail-modal__header {
        align-items: flex-start
    }
}

.order-detail-modal__header-left {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center
}

@media screen and (max-width: 723px) {
    .order-detail-modal__header-left {
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: wrap;
        row-gap: 8px
    }
}

.order-detail-modal__line {
    width: 1px;
    height: 20px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .order-detail-modal__line {
        width: 2px;
        height: 28px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal__line-2 {
        display: none
    }
}

.order-detail-modal__status {
    color: #58c7f7;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal__status {
        font-size: 24px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal__status {
        font-size: 16px;
        line-height: 24px
    }
}

.order-detail-modal__date {
    color: #494949;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal__date {
        font-size: 24px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal__date {
        font-size: 14px;
        line-height: 20px
    }
}

.order-detail-modal .close-button {
    position: relative;
    top: initial;
    right: initial
}

.order-detail-modal__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    font-weight: 500;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .order-detail-modal__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal__title {
        font-size: 20px;
        line-height: 24px
    }
}

.order-detail-modal .order-detail__products {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
    overflow-y: auto;
    overflow-x: hidden
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products {
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products {
        gap: 20px
    }
}

.order-detail-modal .order-detail__products::-webkit-scrollbar {
    width: 5px
}

@media screen and (max-width: 768px) {
    .order-detail-modal .order-detail__products::-webkit-scrollbar {
        width: 2px
    }
}

.order-detail-modal .order-detail__products::-webkit-scrollbar-track {
    background: #f1f2f400
}

.order-detail-modal .order-detail__products::-webkit-scrollbar-thumb {
    background: #0003
}

.order-detail-modal .order-detail__products .product-item {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    column-gap: 8px;
    padding-bottom: 24px;
    border-bottom: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item {
        padding-bottom: 20px
    }
}

@media screen and (max-width: 1023px) {
    .order-detail-modal .order-detail__products .product-item {
        column-gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item {
        flex-direction: column;
        gap: 6px
    }
}

.order-detail-modal .order-detail__products .product-item:last-child {
    border-bottom: unset;
    padding-bottom: 0
}

.order-detail-modal .order-detail__products .product-item__image {
    display: flex;
    align-items: center;
    justify-content: center
}

.order-detail-modal .order-detail__products .product-item__image img {
    min-width: 75px;
    max-width: 75px;
    min-height: 69px;
    max-height: 69px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__image img {
        min-width: 95px;
        max-width: 95px;
        min-height: 88px;
        max-height: 88px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__image img {
        min-width: 65px;
        max-width: 65px;
        min-height: 60px;
        max-height: 60px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item__image img {
        min-width: 90px;
        max-width: 90px;
        min-height: 83px;
        max-height: 83px
    }
}

.order-detail-modal .order-detail__products .product-item__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    min-width: 415px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__info {
        min-width: 504px;
        margin-right: 120px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__info {
        min-width: 364px
    }
}

@media screen and (max-width: 1023px) {
    .order-detail-modal .order-detail__products .product-item__info {
        min-width: 284px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item__info {
        min-width: 174px;
        gap: 4px
    }
}

.order-detail-modal .order-detail__products .product-item__name {
    color: #151514;
    font-family: Headline Base;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__name {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__name {
        font-size: 14px;
        line-height: 20px
    }
}

.order-detail-modal .order-detail__products .product-item__description {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__description {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__description {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .order-detail-modal .order-detail__products .product-item__description {
        font-size: 12px;
        line-height: 16px
    }
}

.order-detail-modal .order-detail__products .product-item__right-content {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 24px;
    align-self: stretch;
    padding-right: 20px
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__right-content {
        gap: 8px;
        padding-right: 16px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item__right-content {
        width: 100%;
        padding-right: 0
    }
}

.order-detail-modal .order-detail__products .product-item__right-content .product-count {
    display: flex;
    min-width: 102px !important;
    max-width: 102px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__right-content .product-count {
        font-size: 24px;
        line-height: 32px;
        padding: 10px 18px;
        max-width: 148px;
        min-width: 148px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__right-content .product-count {
        padding: 8px 12px;
        border-radius: 12px;
        font-size: 14px;
        line-height: 20px;
        max-height: 36px;
        min-width: 88px !important;
        max-width: 88px
    }
}

@media screen and (max-width: 1023px) {
    .order-detail-modal .order-detail__products .product-item__right-content .product-count {
        padding: 8px 12px;
        border-radius: 16px;
        font-size: 14px;
        line-height: 20px;
        max-height: 36px;
        min-width: 91px !important;
        max-width: 91px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item__right-content .product-count {
        border-radius: 12px;
        min-width: 88px !important
    }
}

.order-detail-modal .order-detail__products .product-item__left-content {
    display: flex;
    align-items: center;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item__left-content {
        gap: 18px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item__left-content {
        gap: 12px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__products .product-item__left-content {
        gap: 8px
    }
}

.order-detail-modal .order-detail__products .product-item .product-column {
    min-width: 80px
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item .product-column {
        min-width: 70px
    }
}

.order-detail-modal .order-detail__products .product-item .product-column__title {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item .product-column__title {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .order-detail-modal .order-detail__products .product-item .product-column__title {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .order-detail-modal .order-detail__products .product-item .product-column__title {
        font-size: 15px;
        line-height: 24px
    }
}

.order-detail-modal .order-detail__products .product-item .product-column__value {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__products .product-item .product-column__value {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__products .product-item .product-column__value {
        font-size: 14px;
        line-height: 20px
    }
}

.order-detail-modal .order-detail__products .product-item .product-column__value-end {
    text-align: end;
    font-weight: 600
}

.order-detail-modal .order-detail__price {
    display: flex;
    padding: 20px;
    flex-direction: column;
    gap: 20px;
    align-self: stretch;
    border-radius: 12px;
    border: .8px solid #dedede;
    background: #f4f4f4;
    margin-bottom: 116px
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__price {
        padding: 32px;
        margin-bottom: 170px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__price {
        row-gap: 12px;
        padding: 16px;
        margin-bottom: 102px
    }
}

@media screen and (max-width: 1023px) {
    .order-detail-modal .order-detail__price {
        row-gap: 8px
    }
}

@media screen and (max-width: 723px) {
    .order-detail-modal .order-detail__price {
        margin-bottom: 150px
    }
}

.order-detail-modal .order-detail__price .order-detail__price--total {
    padding-top: 20px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #151514;
    border-top: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__price .order-detail__price--total {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__price .order-detail__price--total {
        font-size: 14px;
        line-height: 20px;
        padding-top: 16px
    }
}

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

.order-detail-modal .order-detail__price-item__name {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #494949
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__price-item__name {
        font-size: 24px;
        line-height: 32px;
        padding-bottom: 4px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__price-item__name {
        font-size: 14px;
        line-height: 20px;
        padding-bottom: 4px
    }
}

.order-detail-modal .order-detail__price-item__value {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .order-detail-modal .order-detail__price-item__value {
        font-size: 24px;
        line-height: 32px;
        padding-bottom: 4px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail-modal .order-detail__price-item__value {
        font-size: 14px;
        line-height: 20px
    }
}

.order-detail__post {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .order-detail__post {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .order-detail__post {
        gap: 6px
    }
}

.order-detail__post-img {
    width: 67px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .order-detail__post-img {
        width: 89px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail__post-img {
        width: 56px;
        height: 20px
    }
}

.order-detail__post-code {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .order-detail__post-code {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .order-detail__post-code {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .order-detail__post-code {
        min-width: 215px
    }
}

.order-detail__post-code span {
    color: #4da6cd
}

.modal-overlay-start {
    align-items: flex-start
}

.button-review {
    display: flex;
    padding: 18px 24px !important;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .button-review {
        padding: 24px 32px !important;
        border-radius: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .button-review {
        padding: 16px 20px !important;
        font-size: 14px;
        line-height: 20px;
        max-height: 52px
    }
}

@media screen and (max-width: 723px) {
    .button-review {
        width: 100%;
        padding: 12px 14px !important;
        font-size: 12px;
        line-height: 16px;
        max-height: 40px
    }
}

.button-review:hover {
    border: 1px solid #58c7f7
}

@media screen and (min-width: 1920px) {
    .order-detail__total-item__name {
        font-size: 24px;
        line-height: 32px
    }
}

.container-order-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .container-order-card {
        gap: 20px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card {
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .container-order-card {
        flex-direction: row;
        width: 100%
    }
}

.container-order-card .order-card {
    width: 100%;
    padding: 24px !important;
    flex-direction: row !important;
    justify-content: space-between
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card {
        padding: 32px !important
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card {
        padding: 20px !important;
        min-height: 80px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card {
        min-width: 159px;
        max-width: 100%;
        padding: 16px !important;
        min-height: 64px
    }
}

.container-order-card .order-card__info {
    display: flex;
    flex-direction: column;
    gap: 6px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__info {
        gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__info {
        gap: 4px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__info {
        max-width: 83px
    }
}

@media screen and (max-width: 549px) {
    .container-order-card .order-card__more-mob {
        display: none
    }
}

.container-order-card .order-card .more-label {
    display: none
}

@media screen and (max-width: 549px) {
    .container-order-card .order-card .more-label {
        color: #888;
        font-size: 8px;
        font-style: normal;
        font-weight: 700;
        line-height: 10px;
        display: flex;
        min-width: 16px;
        max-width: 16px;
        min-height: 16px;
        max-height: 16px;
        padding: 2px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
        aspect-ratio: 1/1;
        border-radius: 10px;
        background: #dedede;
        position: absolute;
        right: -2px;
        top: -2px
    }
}

.container-order-card .order-card__more {
    color: #494949;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__more {
        font-size: 18px;
        line-height: 24px
    }
}

.container-order-card .order-card__number {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__number {
        font-size: 20px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__number {
        font-size: 14px;
        line-height: 20px;
        min-width: 98px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__number {
        font-size: 12px;
        line-height: 14px
    }
}

.container-order-card .order-card__number span {
    color: #888;
    font-weight: 400;
    margin-left: 4px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__number span {
        margin-left: 6px
    }
}

.container-order-card .order-card__status {
    color: #4dcc8c;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__status {
        font-size: 18px;
        line-height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__status {
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__status {
        font-size: 10px
    }
}

.container-order-card .order-card__images {
    column-gap: 3px !important;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__images {
        column-gap: 8px !important
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__images {
        column-gap: 2px !important
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__images {
        position: relative
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card svg {
        width: 26px;
        height: 26px
    }
}

@media screen and (max-width: 1023px) {
    .container-order-card .order-card svg {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 549px) {
    .container-order-card .order-card__image-mob {
        display: none
    }
}

.container-order-card .order-card__image {
    min-width: 48px;
    max-width: 48px;
    min-height: 43px;
    max-height: 43px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__image {
        min-width: 54px;
        max-width: 54px;
        min-height: 48px;
        max-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__image {
        min-width: 40px;
        max-width: 40px;
        min-height: 36px;
        max-height: 36px
    }
}

@media screen and (max-width: 1023px) {
    .container-order-card .order-card__image {
        min-width: 32px;
        max-width: 32px;
        min-height: 29px;
        max-height: 29px
    }
}

.container-order-card .order-card__summary {
    display: flex;
    align-items: center;
    gap: 6px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__summary {
        gap: 10px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__summary {
        gap: 4px
    }
}

.container-order-card .order-card__summary-count {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    min-width: 70px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__summary-count {
        color: #888;
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__summary-count {
        font-size: 12px;
        line-height: 16px;
        min-width: 60px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__summary-count {
        font-size: 10px;
        line-height: 16px;
        max-width: 50px;
        min-width: 50px
    }
}

.container-order-card .order-card__summary-bonus {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    flex: 1 0 0;
    overflow: hidden;
    color: #4dcc8c;
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    min-width: 130px
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__summary-bonus {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-order-card .order-card__summary-bonus {
        font-size: 12px;
        line-height: 16px;
        min-width: 112px
    }
}

@media screen and (max-width: 723px) {
    .container-order-card .order-card__summary-bonus {
        font-size: 10px
    }
}

@media screen and (max-width: 549px) {
    .container-order-card .order-card__summary-bonus-mob {
        display: none
    }
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__preview svg {
        width: 38px;
        height: 38px
    }
}

.container-order-card .order-card__line {
    width: 1px;
    height: 11px;
    background-color: #dedede
}

@media screen and (min-width: 1920px) {
    .container-order-card .order-card__line {
        width: 2px;
        height: 14px
    }
}

.summary-bonus-mobile {
    display: none !important
}

@media screen and (max-width: 549px) {
    .summary-bonus-mobile {
        display: flex !important;
        min-width: max-content !important
    }
}

.order-detail__total-value {
    font-size: 20px !important;
    line-height: 28px !important
}

@media screen and (min-width: 1920px) {
    .order-detail__total-value {
        font-size: 28px !important;
        line-height: 32px !important
    }
}

@media screen and (max-width: 1359px) {
    .order-detail__total-value {
        font-size: 16px !important;
        line-height: 24px !important
    }
}

.promotion-ticket {
    background: #fff;
    border-radius: 32px;
    padding: 32px;
    box-shadow: 0 0 24px #0000002e;
    width: 640px;
    height: 900px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

@media screen and (max-width: 2560px) {
    .promotion-ticket {
        width: 494px;
        height: 727px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-ticket {
        width: clamp(356px, 356px + (100vw - 1360px) * .2464, 494px);
        height: clamp(470px, 470px + (100vw - 1360px) * .459, 727px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .promotion-ticket {
        width: clamp(306px, 306px + (100vw - 1024px) * .1488, 356px);
        height: clamp(375px, 375px + (100vw - 1024px) * .2827, 470px);
        padding-top: 32px;
        padding-bottom: clamp(32px, 32px + (100vw - 1024px) * .0595, 52px)
    }
}

@media screen and (max-width: 1024px) {
    .promotion-ticket {
        width: 306px;
        height: 375px;
        border-radius: 24px;
        padding-top: 32px;
        padding-bottom: 32px
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket {
        width: 100%;
        max-width: 668px;
        height: 281px;
        border-radius: 24px;
        padding-top: 24px;
        padding-bottom: 24px;
        margin: 0 auto;
        align-self: center;
        flex-shrink: 0
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    .promotion-ticket {
        height: clamp(281px, 295px - (100vw - 360px) * .0385, 295px)
    }
}

@media screen and (max-width: 360px) {
    .promotion-ticket {
        width: 100%;
        max-width: 328px;
        height: 295px;
        border-radius: 24px;
        padding-top: 24px;
        padding-bottom: 24px;
        margin: 0 auto;
        align-self: center;
        flex-shrink: 0
    }
}

.promotion-ticket:before,
.promotion-ticket:after {
    content: "";
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    top: calc(50% + 220px);
    transform: translateY(-50%);
    z-index: 2
}

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

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: 60px;
        height: 60px;
        top: calc(50% + 180px)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: clamp(40px, 40px + (100vw - 1360px) * .0357, 60px);
        height: clamp(40px, 40px + (100vw - 1360px) * .0357, 60px);
        top: clamp(50% + 100px, 50% + 100px + (100vw - 1360px) * .1429, 50% + 180px)
    }
}

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

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: clamp(40px, 40px + (100vw - 1024px) * .0297, 50px);
        height: clamp(40px, 40px + (100vw - 1024px) * .0297, 50px);
        top: clamp(50% + 90px, 50% + 90px + (100vw - 1024px) * .0297, 50% + 100px)
    }
}

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

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: 40px;
        height: 40px;
        top: calc(50% + 100px)
    }
}

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

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: 40px;
        height: 40px;
        top: calc(50% + 90px)
    }
}

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

    .promotion-ticket:before,
    .promotion-ticket:after {
        width: 33px;
        height: 33px;
        top: calc(50% + 60px)
    }
}

.promotion-ticket:before {
    background: linear-gradient(140deg, #e3e3e3, #ededed 97.02%, #f7f7f700 59.62%);
    left: -40px
}

@media screen and (max-width: 2560px) {
    .promotion-ticket:before {
        left: -30px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-ticket:before {
        left: clamp(-20px, -20px - (100vw - 1360px) * .0179, -30px)
    }
}

@media screen and (max-width: 1360px) {
    .promotion-ticket:before {
        left: -20px
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket:before {
        left: -16.5px
    }
}

.promotion-ticket:after {
    background: linear-gradient(90deg, #e3e3e3, #ededed 57.02%, #f7f7f700 59.62%);
    right: -40px
}

@media screen and (max-width: 2560px) {
    .promotion-ticket:after {
        right: -30px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-ticket:after {
        right: clamp(-20px, -20px - (100vw - 1360px) * .0179, -30px)
    }
}

@media screen and (max-width: 1360px) {
    .promotion-ticket:after {
        right: -20px
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket:after {
        right: -16.5px
    }
}

.promotion-ticket__header {
    text-align: center
}

@media screen and (max-width: 724px) {
    .promotion-ticket__header {
        text-align: left
    }
}

@media screen and (max-width: 360px) {
    .promotion-ticket__header {
        margin-bottom: 17px
    }
}

.promotion-ticket__validity {
    margin-top: 48px;
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    color: #888;
    line-height: 32px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase
}

.promotion-ticket__validity span {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 0%;
    color: #6e57d3
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .promotion-ticket__validity span {
        font-size: clamp(14px, 14px + (100vw - 1024px) * .006, 16px)
    }
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__validity span {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .promotion-ticket__validity span {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-ticket__validity {
        font-size: 20px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .promotion-ticket__validity {
        font-size: clamp(14px, 14px + (100vw - 1024px) * .006, 16px);
        line-height: clamp(20px, 20px + (100vw - 1024px) * .0119, 24px)
    }
}

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

@media screen and (max-width: 1024px) {
    .promotion-ticket__validity {
        font-size: 14px;
        line-height: 20px
    }
}

.promotion-ticket__progress {
    margin-bottom: 52px
}

.promotion-ticket__separator {
    position: absolute;
    width: 100%;
    left: 0;
    top: calc(50% + 220px);
    transform: translateY(-50%);
    margin: 0;
    z-index: 1
}

@media screen and (max-width: 2560px) {
    .promotion-ticket__separator {
        top: calc(50% + 180px)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-ticket__separator {
        top: clamp(50% + 100px, 50% + 100px + (100vw - 1360px) * .1429, 50% + 180px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .promotion-ticket__separator {
        top: clamp(50% + 90px, 50% + 90px + (100vw - 1024px) * .0297, 50% + 100px)
    }
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__separator {
        top: calc(50% + 100px)
    }
}

@media screen and (max-width: 1024px) {
    .promotion-ticket__separator {
        top: calc(50% + 90px)
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket__separator {
        top: calc(50% + 60px)
    }
}

.promotion-ticket__share {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 32px;
    gap: 8px;
    position: relative;
    flex-wrap: wrap;
    overflow: visible;
    z-index: 5;
    cursor: pointer
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__share {
        margin-bottom: 10px
    }
}

@media screen and (max-width: 1024px) {
    .promotion-ticket__share {
        margin-bottom: 4px
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket__share {
        margin-bottom: 10px
    }
}

.promotion-ticket__share-wrapper {
    display: flex;
    align-items: center;
    position: relative
}

.promotion-ticket__share-message {
    font-family: Inter;
    font-weight: 500;
    font-size: 14px;
    color: #494949;
    line-height: 20px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: none;
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
    position: fixed;
    white-space: nowrap;
    z-index: 10000;
    background: #fff;
    padding: 6px 12px;
    border-radius: 6px;
    box-shadow: 0 4px 12px #0003;
    border: 1px solid #e0e0e0;
    width: max-content
}

.promotion-ticket__share-message.visible {
    opacity: 1;
    visibility: visible
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__share-message {
        font-size: 12px;
        line-height: 16px;
        padding: 5px 10px
    }
}

.promotion-ticket__share-text {
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    color: #494949;
    line-height: 32px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    transition: color .3s ease
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__share-text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 724px) {
    .promotion-ticket__share-text {
        font-size: 14px;
        line-height: 20px
    }
}

.promotion-ticket__share-icon {
    cursor: pointer;
    transition: all .3s ease;
    width: 24px;
    height: 24px
}

@media screen and (max-width: 1360px) {
    .promotion-ticket__share-icon {
        width: 18px;
        height: 18px
    }
}

.promotion-ticket__share-icon path {
    transition: fill .3s ease
}

.promotion-ticket__share:hover .promotion-ticket__share-text {
    color: #4da6cd
}

.promotion-ticket__share:hover .promotion-ticket__share-icon path {
    fill: #4da6cd
}

.countdown-timer {
    text-align: center
}

.countdown-timer__time {
    font-family: Inter;
    font-weight: 700;
    font-style: Bold;
    font-size: 100px;
    color: #d357c0;
    line-height: 100px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle
}

@media screen and (max-width: 2560px) {
    .countdown-timer__time {
        font-size: 80px;
        line-height: 80px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .countdown-timer__time {
        font-size: clamp(56px, 56px + (100vw - 1360px) * .0429, 80px);
        line-height: clamp(48px, 48px + (100vw - 1360px) * .0571, 80px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .countdown-timer__time {
        font-size: clamp(44px, 44px + (100vw - 1024px) * .0357, 56px)
    }
}

@media screen and (max-width: 1360px) {
    .countdown-timer__time {
        font-size: 56px;
        line-height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .countdown-timer__time {
        font-size: 44px;
        line-height: 48px
    }
}

@media screen and (max-width: 360px) {
    .countdown-timer__time {
        font-size: 40px
    }
}

.countdown-timer__labels {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    font-size: 12px;
    color: #999;
    font-weight: 500;
    margin-top: 10px
}

@media screen and (max-width: 1360px) {
    .countdown-timer__labels {
        gap: 12px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1024px) {
    .countdown-timer__labels {
        gap: 10px;
        font-size: 12px;
        margin-top: 16px
    }
}

@media screen and (max-width: 724px) {
    .countdown-timer__labels {
        margin-top: 3px
    }
}

.countdown-timer__label {
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 20px;
    color: #888;
    line-height: 32px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    opacity: .8
}

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

@media screen and (max-width: 1024px) {
    .countdown-timer__label {
        font-size: 12px
    }
}

.countdown-timer__separator {
    color: #ddd;
    font-weight: 300;
    margin: 0 2px
}

.progress-bar__track {
    width: 380px;
    height: 24px;
    background: #f0f0f0;
    border-radius: 80px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden
}

@media screen and (max-width: 2560px) {
    .progress-bar__track {
        width: 296px;
        height: 18px
    }
}

@media screen and (max-width: 1360px) {
    .progress-bar__track {
        height: 12px;
        width: 190px
    }
}

.progress-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, #d357c0, #d357c0);
    opacity: .5;
    border-radius: 3px;
    transition: width .3s ease
}

.dotted-line {
    width: 640px;
    height: 4px;
    background-image: repeating-linear-gradient(to right, #888888 0px, #888888 5px, transparent 5px, transparent 10px);
    opacity: .5;
    border: none;
    position: relative;
    margin: 0 auto
}

@media screen and (max-width: 2560px) {
    .dotted-line {
        width: 494px;
        height: 3px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .dotted-line {
        width: clamp(356px, 356px + (100vw - 1360px) * .2464, 494px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .dotted-line {
        width: clamp(306px, 306px + (100vw - 1024px) * .1488, 356px)
    }
}

@media screen and (max-width: 1024px) {
    .dotted-line {
        width: 306px
    }
}

@media screen and (max-width: 724px) {
    .dotted-line {
        width: 100%;
        max-width: 668px;
        height: 1px
    }
}

@media screen and (max-width: 360px) {
    .dotted-line {
        max-width: 328px
    }
}

#promotion-page .breadcrumbs-promotion {
    margin: 24px 0 32px;
    padding: 0 40px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #promotion-page .breadcrumbs-promotion {
        margin: clamp(24px, 24px + (100vw - 1360px) * 0, 24px) 0 clamp(32px, 32px + (100vw - 1360px) * 0, 32px) 0
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #promotion-page .breadcrumbs-promotion {
        margin: clamp(24px, 24px + (100vw - 1024px) * 0, 24px) 0 clamp(32px, 32px + (100vw - 1024px) * 0, 32px) 0
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #promotion-page .breadcrumbs-promotion {
        margin: clamp(24px, 24px + (100vw - 724px) * 0, 24px) 0 clamp(32px, 32px + (100vw - 724px) * 0, 32px) 0
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    #promotion-page .breadcrumbs-promotion {
        margin: clamp(24px, 24px + (100vw - 360px) * 0, 24px) 0 clamp(32px, 32px + (100vw - 360px) * 0, 32px) 0
    }
}

@media screen and (min-width: 1920px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 80px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 clamp(32px, 32px + (100vw - 1360px) * .0857, 80px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1360px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 32px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 clamp(28px, 28px + (100vw - 1024px) * .0119, 32px)
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 28px;
        margin-bottom: 30px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 28px
    }
}

@media screen and (max-width: 724px) and (min-width: 724px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 28px;
        margin-bottom: 10px
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 16px
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .breadcrumbs-promotion {
        padding: 0 16px
    }
}

#promotion-page .breadcrumbs-promotion .breadcrumbs__container {
    display: flex;
    align-items: center;
    gap: 8px
}

#promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
    color: #666;
    text-decoration: none;
    font-size: 12px;
    transition: color .3s ease
}

@media screen and (min-width: 1920px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 20px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: clamp(12px, 12px + (100vw - 1360px) * .0143, 20px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1360px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (max-width: 724px) and (min-width: 724px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a {
        font-size: 12px
    }
}

#promotion-page .breadcrumbs-promotion .breadcrumbs__item a:hover {
    color: #8b5cf6
}

#promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
#promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
    width: 14px;
    height: 12px
}

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

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 24px;
        height: 21px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: clamp(14px, 14px + (100vw - 1360px) * .0179, 24px);
        height: clamp(12px, 12px + (100vw - 1360px) * .0161, 21px)
    }
}

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

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

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

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

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

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

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

    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a svg,
    #promotion-page .breadcrumbs-promotion .breadcrumbs__item a .home-icon {
        width: 14px;
        height: 12px
    }
}

.pagination {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 32px 0 48px;
    padding: 0 40px;
    column-gap: 8px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .pagination {
        margin-top: 32px;
        margin-bottom: 48px;
        column-gap: 12px
    }
}

@media screen and (max-width: 1359px) {
    .pagination {
        margin-top: 24px
    }
}

@media screen and (max-width: 1023px) {
    .pagination {
        margin-bottom: 32px;
        margin-top: 16px;
        padding: 0
    }
}

.pagination-item {
    min-height: 50px;
    max-height: 50px;
    min-width: 50px;
    max-width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 80px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    position: relative;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .pagination-item {
        min-height: 70px;
        max-height: 70px;
        min-width: 70px;
        max-width: 70px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .pagination-item {
        min-height: 34px;
        max-height: 34px;
        min-width: 34px;
        max-width: 34px;
        font-size: 10px;
        line-height: 14px
    }
}

.pagination-item:hover {
    border: 1px solid #dedede
}

.pagination-item--active {
    border: 1px solid #58c7f7
}

.pagination-item--active:before,
.pagination-item--active:after {
    content: none
}

.pagination-more {
    color: #4da6cd;
    font-size: 14px;
    margin-bottom: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .pagination-more {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1359px) {
    .pagination-more {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    .pagination-more {
        margin-bottom: 16px;
        font-size: 10px;
        line-height: 14px
    }
}

.pagination-more svg {
    width: 21px;
    height: 26px;
    margin-right: 14px
}

@media screen and (max-width: 1024px) {
    .pagination-more svg {
        width: 16px;
        height: 20px;
        margin-right: 12px
    }
}

.pagination-container {
    display: flex;
    column-gap: 16px
}

@media screen and (max-width: 1023px) {
    .pagination-container {
        column-gap: 12px
    }
}

.pagination-arrow svg {
    width: 16px;
    height: 16px
}

.pagination--desktop {
    display: flex;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .pagination--desktop {
        column-gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .pagination--desktop {
        column-gap: 12px
    }
}

.pagination-wrapper {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center
}

@media screen and (max-width: 1023px) {
    .pagination-wrapper {
        padding: 0 28px
    }
}

@media screen and (max-width: 723px) {
    .pagination-wrapper {
        gap: 24px;
        justify-content: center
    }
}

.pagination-prev,
.pagination-next {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

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

    .pagination-prev,
    .pagination-next {
        gap: 16px
    }
}

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

    .pagination-prev,
    .pagination-next {
        gap: 6px
    }
}

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

    .pagination-prev,
    .pagination-next {
        display: none
    }
}

.pagination-prev__text,
.pagination-next__text {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

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

    .pagination-prev__text,
    .pagination-next__text {
        font-size: 20px;
        line-height: 32px
    }
}

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

    .pagination-prev__text,
    .pagination-next__text {
        font-size: 10px;
        line-height: 14px
    }
}

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

    .pagination-prev__text,
    .pagination-next__text {
        display: none
    }
}

.pagination-prev.inactive {
    opacity: .3;
    pointer-events: none;
    cursor: default
}

.pagination-prev.inactive svg path {
    fill: gray
}

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

    .pagination-prev__icon,
    .pagination-next__icon {
        width: 20px;
        height: 17px
    }
}

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

    .pagination-prev__icon,
    .pagination-next__icon {
        width: 12px;
        height: 10px
    }
}

.compatibility {
    display: flex;
    column-gap: 16px;
    margin: 16px 0 0
}

@media screen and (min-width: 1920px) {
    .compatibility {
        margin: 32px 0 8px;
        column-gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .compatibility {
        margin: 12px 0 0
    }
}

@media screen and (max-width: 768px) {
    .compatibility {
        display: block;
        margin: 0;
        overflow: hidden
    }
}

.compatibility-row {
    display: flex;
    column-gap: 8px;
    flex-wrap: wrap
}

@media screen and (min-width: 1920px) {
    .compatibility-row {
        column-gap: 12px
    }
}

@media screen and (max-width: 1024px) {
    .compatibility-row {
        column-gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .compatibility-row {
        padding-bottom: 8px;
        flex-wrap: nowrap;
        column-gap: 16px;
        overflow-x: scroll;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch
    }

    .compatibility-row::-webkit-scrollbar {
        height: 1px
    }

    .compatibility-row::-webkit-scrollbar-track {
        background: #dedede
    }

    .compatibility-row::-webkit-scrollbar-thumb {
        background: #151514
    }
}

@media screen and (max-width: 423px) {
    .compatibility-row {
        column-gap: 12px
    }
}

.compatibility-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    padding: 8px 4px 8px 0;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .compatibility-title {
        font-size: 24px;
        line-height: 24px;
        padding: 16px 12px 16px 0
    }
}

@media screen and (max-width: 1024px) {
    .compatibility-title {
        padding: 8px 8px 8px 0
    }
}

@media screen and (max-width: 768px) {
    .compatibility-title {
        display: none;
        padding: 0;
        margin: 16px 0 8px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .compatibility-title {
        font-size: 12px;
        line-height: 14px
    }
}

.compatibility-title--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    .compatibility-title--mobile {
        display: block
    }
}

.compatibility-item {
    display: flex;
    align-items: center;
    column-gap: 4px;
    padding: 8px 0;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .compatibility-item {
        column-gap: 8px;
        padding: 12px 0
    }
}

@media screen and (max-width: 768px) {
    .compatibility-item {
        padding: 0
    }
}

.compatibility-item__name {
    position: relative;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514;
    width: max-content
}

@media screen and (min-width: 1920px) {
    .compatibility-item__name {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .compatibility-item__name {
        font-size: 12px;
        line-height: 16px
    }
}

.compatibility-item__name:before {
    content: "";
    position: absolute;
    bottom: -1px;
    width: 100%;
    height: 1px;
    background-color: #151514
}

@media screen and (max-width: 768px) {
    .compatibility-item__name:before {
        bottom: 0
    }
}

.compatibility-item__count {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .compatibility-item__count {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .compatibility-item__count {
        line-height: 14px
    }
}

@media screen and (max-width: 768px) {
    .compatibility-item__count {
        font-size: 12px;
        line-height: 16px
    }
}

.info-modal-rental {
    max-width: 1000px !important;
    border-radius: 40px !important;
    background: #fff;
    box-shadow: 0 0 40px #0000001a !important;
    overflow-y: auto;
    top: 50%;
    transform: translateY(-50%);
    padding: 32px !important
}

@media screen and (min-width: 1920px) {
    .info-modal-rental {
        max-width: 1440px !important
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-rental {
        max-width: 800px !important
    }
}

@media screen and (max-width: 768px) {
    .info-modal-rental {
        max-width: 350px !important;
        padding: 16px !important;
        top: 0 !important;
        transform: translateY(0) !important;
        margin-top: 50px !important;
        border-radius: 16px !important
    }
}

@media screen and (max-width: 768px) {
    .info-modal-rental {
        margin-top: 25px !important
    }
}

@media screen and (max-width: 423px) {
    .info-modal-rental {
        max-width: 300px !important
    }
}

.info-modal__title-rent {
    font-size: 28px !important;
    font-weight: 500 !important;
    line-height: 1.28 !important
}

@media screen and (min-width: 1920px) {
    .info-modal__title-rent {
        font-size: 40px !important;
        line-height: 1.2 !important
    }
}

@media screen and (max-width: 1024px) {
    .info-modal__title-rent {
        font-size: 24px !important;
        line-height: 1.33 !important;
        max-width: 702px !important
    }
}

@media screen and (max-width: 768px) {
    .info-modal__title-rent {
        font-size: 16px !important;
        line-height: 1.25 !important
    }
}

@media screen and (max-width: 423px) {
    .info-modal__title-rent {
        font-size: 14px !important;
        line-height: 1.43 !important;
        max-width: 242px !important
    }
}

.product-page-gallery-rental {
    position: relative !important;
    width: 100% !important;
    height: 100vh !important
}

.subtitle-rent-item {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .subtitle-rent-item {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .subtitle-rent-item {
        font-size: 14px;
        line-height: 1.43;
        margin-top: 12px
    }
}

@media screen and (max-width: 768px) {
    .subtitle-rent-item {
        font-size: 12px;
        line-height: 1.33;
        margin-top: 8px
    }
}

@media screen and (max-width: 423px) {
    .subtitle-rent-item {
        font-size: 10px;
        line-height: 1.6
    }
}

.swiper-wrapper-rent,
.img-rent {
    max-height: 450px !important
}

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

    .swiper-wrapper-rent,
    .img-rent {
        max-width: 752px !important;
        max-height: 350px !important
    }
}

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

    .swiper-wrapper-rent,
    .img-rent {
        max-height: 255px !important
    }
}

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

    .swiper-wrapper-rent,
    .img-rent {
        max-width: 268px !important
    }
}

.product-page-tabs-rent {
    margin-top: 40px
}

.product-page-tabs__row-rent {
    margin-bottom: 40px !important;
    padding-top: unset !important
}

.lists-container {
    display: flex;
    align-items: flex-start;
    gap: 135px
}

@media screen and (min-width: 1920px) {
    .lists-container {
        gap: 189px
    }
}

@media screen and (max-width: 1024px) {
    .lists-container {
        gap: 60px
    }
}

@media screen and (max-width: 768px) {
    .lists-container {
        gap: 40px
    }
}

@media screen and (max-width: 423px) {
    .lists-container {
        flex-direction: column
    }
}

.container-rental-price {
    display: flex;
    padding: 24px;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    border-radius: 24px;
    border: 2px solid #dedede;
    margin-top: 40px
}

@media screen and (min-width: 1920px) {
    .container-rental-price {
        padding: 48px
    }
}

@media screen and (max-width: 768px) {
    .container-rental-price {
        padding: 16px;
        flex-direction: column;
        gap: 16px
    }
}

.container-rental-price .price-list,
.container-rental-price .pledge-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px
}

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

    .container-rental-price .price-list,
    .container-rental-price .pledge-container {
        gap: 32px
    }
}

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

    .container-rental-price .price-list,
    .container-rental-price .pledge-container {
        gap: 16px
    }
}

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

    .container-rental-price .price-list,
    .container-rental-price .pledge-container {
        gap: 12px;
        max-width: 178px
    }
}

.container-rental-price .price-list__title,
.container-rental-price .price-list .title-pledge,
.container-rental-price .pledge-container__title,
.container-rental-price .pledge-container .title-pledge {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4
}

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

    .container-rental-price .price-list__title,
    .container-rental-price .price-list .title-pledge,
    .container-rental-price .pledge-container__title,
    .container-rental-price .pledge-container .title-pledge {
        font-size: 28px;
        line-height: 1.14
    }
}

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

    .container-rental-price .price-list__title,
    .container-rental-price .price-list .title-pledge,
    .container-rental-price .pledge-container__title,
    .container-rental-price .pledge-container .title-pledge {
        font-size: 18px;
        line-height: 1.55
    }
}

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

    .container-rental-price .price-list__title,
    .container-rental-price .price-list .title-pledge,
    .container-rental-price .pledge-container__title,
    .container-rental-price .pledge-container .title-pledge {
        font-size: 16px;
        line-height: 1.25
    }
}

.container-rental-price .price-list__container,
.container-rental-price .pledge-container__container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    list-style: none
}

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

    .container-rental-price .price-list__container,
    .container-rental-price .pledge-container__container {
        gap: 24px
    }
}

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

    .container-rental-price .price-list__container,
    .container-rental-price .pledge-container__container {
        gap: 12px
    }
}

.container-rental-price .price-list__container-item,
.container-rental-price .pledge-container__container-item {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

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

    .container-rental-price .price-list__container-item,
    .container-rental-price .pledge-container__container-item {
        font-size: 24px;
        line-height: 1.17
    }
}

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

    .container-rental-price .price-list__container-item,
    .container-rental-price .pledge-container__container-item {
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .container-rental-price .price-list__container-item,
    .container-rental-price .pledge-container__container-item {
        font-size: 12px;
        line-height: 1.33
    }
}

.container-rental-price .price-pledge {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .container-rental-price .price-pledge {
        font-size: 24px;
        line-height: 1.17
    }
}

@media screen and (max-width: 1024px) {
    .container-rental-price .price-pledge {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .container-rental-price .price-pledge {
        font-size: 12px;
        line-height: 1.33
    }
}

.container-rental-price .button-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .container-rental-price .button-container {
        gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .container-rental-price .button-container {
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .container-rental-price .button-container {
        gap: 16px;
        width: 100%
    }
}

.container-rental-price .button-container__rent:hover {
    background: #6cd3ff
}

.container-rental-price .button-container__rent,
.container-rental-price .button-container__checkout {
    all: unset;
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    border-radius: 16px;
    background: #58c7f6;
    cursor: pointer
}

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

    .container-rental-price .button-container__rent,
    .container-rental-price .button-container__checkout {
        padding: 24px 120px;
        font-size: 24px;
        line-height: 1.58
    }
}

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

    .container-rental-price .button-container__rent,
    .container-rental-price .button-container__checkout {
        padding: 16px 24px;
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .container-rental-price .button-container__rent,
    .container-rental-price .button-container__checkout {
        padding: 16px;
        font-size: 14px;
        line-height: 1.43
    }
}

.container-rental-price .button-container__checkout {
    padding: 16px 24px;
    border-radius: 12px;
    border: 1px solid #dedede;
    font-weight: 400;
    color: #151514;
    background: none
}

@media screen and (min-width: 1920px) {
    .container-rental-price .button-container__checkout {
        padding: 24px
    }
}

@media screen and (max-width: 768px) {
    .container-rental-price .button-container__checkout {
        padding: 16px
    }
}

.product-page-tabs__header-rent {
    top: -32px !important;
    padding-top: 24px;
    background: #fff
}

@media screen and (max-width: 768px) {
    .product-page-tabs__header-rent {
        top: -4px !important
    }
}

.product-features__wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    row-gap: 48px;
    column-gap: 56px;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-features__wrapper {
        row-gap: 72px;
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1024px) {
    .product-features__wrapper {
        grid-template-columns: repeat(3, 1fr);
        row-gap: 32px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 768px) {
    .product-features__wrapper {
        grid-template-columns: 1fr;
        row-gap: 24px;
        margin-bottom: 40px
    }
}

.product-features__name {
    color: #888
}

.product-features__value {
    color: #151514;
    margin-top: 8px
}

@media screen and (max-width: 1024px) {
    .product-features__value {
        margin-top: 4px
    }
}

.product-features__name,
.product-features__value {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px
}

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

    .product-features__name,
    .product-features__value {
        font-size: 24px;
        line-height: 38px
    }
}

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

    .product-features__name,
    .product-features__value {
        font-size: 14px;
        line-height: 20px
    }
}

.product-video {
    margin-bottom: 80px
}

@media screen and (min-width: 1920px) {
    .product-video {
        margin-bottom: 96px
    }
}

@media screen and (max-width: 1024px) {
    .product-video {
        margin-bottom: 64px
    }
}

@media screen and (max-width: 768px) {
    .product-video {
        margin-bottom: 48px
    }
}

.product-video__frame {
    height: 600px
}

@media screen and (min-width: 1920px) {
    .product-video__frame {
        height: 800px
    }
}

@media screen and (max-width: 1024px) {
    .product-video__frame {
        height: 500px
    }
}

@media screen and (max-width: 768px) {
    .product-video__frame {
        height: 300px;
        border-radius: 8px;
        overflow: hidden
    }
}

@media screen and (max-width: 423px) {
    .product-video__frame {
        height: 245px;
        border-radius: 24px
    }
}

@media screen and (max-width: 768px) {
    .product-page-tabs__row-rent {
        position: unset !important
    }
}

@media screen and (min-width: 1920px) {
    .section-info {
        margin: 48px 0 60px
    }
}

@media screen and (max-width: 1024px) {
    .section-info {
        margin: 32px 0
    }
}

@media screen and (max-width: 768px) {
    .section-info {
        margin: 32px 0 24px
    }
}

.section-info .container {
    position: relative
}

.section-info__text {
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 10px;
    font-weight: 300;
    font-size: 19px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .section-info__text {
        font-size: 26px;
        line-height: 45px;
        padding: 24px 24px 34px
    }
}

@media screen and (max-width: 1024px) {
    .section-info__text {
        padding: 16px;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .section-info__text {
        padding: 16px
    }
}

.section-info__link {
    position: relative;
    color: #58c7f7;
    border-bottom: 1px dashed #58c7f7;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-info__link {
        border-bottom: 2px dashed #58c7f7
    }
}

.section-info__close {
    position: absolute;
    right: 8px;
    top: 8px;
    padding: 3px;
    width: 16px;
    height: 16px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-info__close {
        right: 16px;
        top: 16px;
        padding: 5px;
        width: 24px;
        height: 24px
    }
}

.section-info__close svg {
    position: absolute;
    width: 10px;
    height: 10px
}

@media screen and (min-width: 1920px) {
    .section-info__close svg {
        width: 14px;
        height: 14px
    }
}

.info-modal {
    max-width: 776px;
    padding: 24px 24px 32px;
    position: fixed;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .info-modal {
        max-width: 1220px
    }
}

@media screen and (max-width: 768px) {
    .info-modal {
        max-width: 328px
    }
}

.info-modal__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .info-modal__title {
        font-size: 35px;
        line-height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .info-modal__title {
        line-height: 40px
    }
}

@media screen and (max-width: 768px) {
    .info-modal__title {
        line-height: 24px
    }
}

.info-modal__text {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .info-modal__text {
        font-size: 24px;
        line-height: 32px
    }
}

.info-modal__text--second {
    margin-top: 16px
}

.info-modal__text.info-modal__list {
    list-style-position: inside
}

.info-modal__list {
    padding-inline-start: 20px
}

@media screen and (max-width: 768px) {
    .info-modal__list {
        list-style-position: inside;
        padding-inline-start: 0
    }
}

.section-tiles {
    overflow-x: hidden
}

@media screen and (max-width: 1023px) {
    .section-tiles {
        overflow: hidden
    }
}

.section-tiles.container {
    margin-top: 24px
}

@media screen and (max-width: 1359px) {
    .section-tiles.container {
        margin-top: 32px
    }
}

@media screen and (max-width: 1359px) {
    .section-tiles.container {
        margin-top: 0
    }
}

.section-tiles .section-header {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .section-tiles .section-header {
        margin-bottom: 36px
    }
}

@media screen and (max-width: 1359px) {
    .section-tiles .section-header .section-title {
        margin-bottom: 0
    }
}

@media screen and (max-width: 723px) {
    .section-tiles .section-header .section-title {
        width: 100%
    }
}

.section-tiles .section-header .section-title span {
    color: #58c7f7;
    text-align: center;
    font-family: Headline Base;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 40px;
    border-bottom: 1px dashed currentColor;
    margin-left: 12px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-tiles .section-header .section-title span {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .section-tiles .section-header .section-title span {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .section-tiles .section-header .section-title span {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .section-tiles .section-header .section-title span {
        font-size: 18px;
        line-height: 20px
    }
}

.tiles-container {
    position: relative
}

@media screen and (max-width: 723px) {
    .tiles-container {
        display: none
    }
}

.tiles {
    transform: translate(0);
    transition: transform .3s linear
}

.tiles [class^=col-] {
    margin-right: 0
}

.tiles.tiles--active {
    transform: translate(-100%);
    transition: transform .3s linear
}

.tiles .is-horizontal {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    flex: 1 0 0;
    align-self: stretch;
    min-width: 385px;
    max-width: 100%
}

@media screen and (max-width: 1359px) {
    .tiles .is-horizontal {
        min-width: 277px;
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .tiles .is-horizontal {
        min-width: 187px
    }
}

.tiles .is-horizontal .tile {
    display: flex;
    padding: 40px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 24px;
    border: .8px solid #dedede;
    background: #f4f4f4;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .tiles .is-horizontal .tile {
        min-height: 394px;
        max-height: 394px;
        min-width: 350px;
        border-radius: 40px;
        gap: 28px
    }
}

@media screen and (max-width: 1359px) {
    .tiles .is-horizontal .tile {
        min-height: 222px;
        max-height: 222px;
        min-width: 277px;
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .tiles .is-horizontal .tile {
        min-height: 149px;
        max-height: 149px;
        min-width: 187px;
        border-radius: 16px;
        gap: 8px
    }
}

.tiles .is-horizontal .tile:hover {
    border: 1px solid #58c7f7
}

.tiles .is-vertical {
    display: flex;
    flex: 1 0 0
}

.tiles .is-vertical .tile {
    display: flex;
    width: 100%;
    height: 567px;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 80px;
    border-radius: 24px;
    border: .8px solid #dedede;
    background: #f4f4f4;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .tiles .is-vertical .tile {
        min-height: 812px;
        max-height: 812px;
        border-radius: 40px
    }
}

@media screen and (max-width: 1359px) {
    .tiles .is-vertical .tile {
        min-height: 459px;
        max-height: 459px;
        gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    .tiles .is-vertical .tile {
        min-height: 310px;
        max-height: 310px;
        border-radius: 16px
    }
}

.tiles .is-vertical .tile:hover {
    border: 1px solid #58c7f7
}

.tiles .is-vertical img {
    min-width: 237px;
    height: 214px
}

@media screen and (min-width: 1920px) {
    .tiles .is-vertical img {
        min-width: 309px;
        min-height: 278px
    }
}

@media screen and (max-width: 1359px) {
    .tiles .is-vertical img {
        min-width: 177px;
        min-height: 160px
    }
}

@media screen and (max-width: 1023px) {
    .tiles .is-vertical img {
        top: 77px;
        min-width: 120px;
        min-height: 108px
    }
}

.tiles .is-vertical .tile-text {
    font-size: 28px;
    line-height: 36px
}

@media screen and (min-width: 1920px) {
    .tiles .is-vertical .tile-text {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .tiles .is-vertical .tile-text {
        font-size: 24px
    }
}

@media screen and (max-width: 1023px) {
    .tiles .is-vertical .tile-text {
        font-size: 16px;
        line-height: 24px
    }
}

.tile {
    position: relative;
    box-shadow: 0 2.82353px 11.2941px -1.41176px #372f321a;
    filter: drop-shadow(0px 0px 2.82353px #f3f3f3);
    border-radius: 4px;
    overflow: hidden
}

.tile img {
    max-width: 199px;
    object-fit: cover
}

@media screen and (max-width: 1359px) {
    .tile img {
        max-height: 100px
    }
}

@media screen and (max-width: 1023px) {
    .tile img {
        max-height: 65px
    }
}

.tile.no-gutter {
    margin-bottom: 0
}

.tile-text {
    bottom: 40px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .tile-text {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .tile-text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .tile-text {
        font-size: 10px;
        line-height: 16px
    }
}

.tile--banner {
    max-width: 560px
}

@media screen and (min-width: 1920px) {
    .tile--banner {
        max-width: 716px
    }
}

@media screen and (max-width: 1359px) {
    .tile--banner {
        max-width: 444px
    }
}

.tiles--second {
    position: absolute;
    transform: translate(100%);
    transition: transform .3s linear;
    top: 0;
    width: 100%
}

.tiles--second.tiles--active {
    transform: translate(0);
    transition: transform .3s linear
}

.section-titles {
    display: flex;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: #f0f0f0
}

@media screen and (min-width: 1920px) {
    .section-titles {
        padding: 56px
    }
}

@media screen and (max-width: 1359px) {
    .section-titles {
        padding: 32px 28px;
        background: #eee
    }
}

@media screen and (max-width: 1023px) {
    .section-titles {
        padding: 24px 28px 32px
    }
}

@media screen and (max-width: 723px) {
    .section-titles {
        padding: 24px 16px;
        gap: 24px
    }
}

.tiles-cards {
    min-width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    margin-top: 0 !important
}

@media screen and (max-width: 1359px) {
    .tiles-cards {
        max-width: 968px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards {
        border-radius: 12px
    }
}

.tiles-cards .container-tiles-cards {
    width: 100%
}

@media screen and (min-width: 1920px) {
    .tiles-cards .container-tiles-cards {
        height: 1210px
    }
}

.tiles-cards .title {
    top: 44px;
    left: 142px;
    color: #151514;
    font-family: Headline Base;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 40px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .title {
        left: 256px;
        top: 56px;
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .title {
        font-size: 24px;
        line-height: 32px;
        top: 32px;
        left: 115px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .title {
        left: 67.5px;
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .title {
        display: none
    }
}

.tiles-cards .tiles-card-vertical {
    display: flex;
    width: 100%;
    padding: 80px 0;
    min-height: 916px;
    flex-direction: column;
    align-items: center;
    gap: 111px;
    align-self: stretch;
    border-radius: 24px 0 0 24px;
    background: linear-gradient(0deg, #f4f4f4, #f4f4f4)
}

@media screen and (min-width: 1920px) {
    .tiles-cards .tiles-card-vertical {
        display: flex;
        padding: 80px 0;
        min-height: 1210px;
        gap: 196px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .tiles-card-vertical {
        padding: 32px 40px;
        max-height: 738px;
        min-height: 738px;
        gap: 130px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .tiles-card-vertical {
        max-height: 552px;
        min-height: 552px;
        border-radius: 0 !important;
        gap: 78px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .tiles-card-vertical {
        background: unset;
        max-height: 320px;
        min-height: 320px
    }
}

.tiles-cards .tiles-card-vertical img {
    width: 336px;
    height: 286px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .tiles-card-vertical img {
        width: 379px;
        height: 323px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .tiles-card-vertical img {
        width: 222px;
        height: 188px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .tiles-card-vertical img {
        width: 152px;
        height: 129px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .tiles-card-vertical img {
        top: 32px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .row {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .row {
        gap: 0px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .row {
        flex-direction: column
    }
}

.tiles-cards .tiles-col-container {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    flex: 1 0 0;
    margin-right: 24px
}

@media screen and (max-width: 1359px) {
    .tiles-cards .tiles-col-container {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .tiles-col-container {
        gap: 0;
        margin: 0;
        height: 100%
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .tiles-col-container {
        width: 100%
    }
}

.tiles-cards .tiles-col-container .tiles-col {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media screen and (max-width: 1359px) {
    .tiles-cards .tiles-col-container .tiles-col {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .tiles-col-container .tiles-col {
        gap: 0
    }
}

.tiles-cards .product-card__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .product-card__content {
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content {
        gap: 4px;
        margin-bottom: 130px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content img {
        margin-bottom: 12px
    }
}

.tiles-cards .product-card__content-title {
    color: #151514;
    text-align: center;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .product-card__content-title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content-title {
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .product-card__content-title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .product-card__content-title {
        font-size: 12px;
        line-height: 14px
    }
}

.tiles-cards .product-card__content-description {
    color: #151514;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .product-card__content-description {
        font-size: 18px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content-description {
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .product-card__content-description {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .product-card__content-description {
        font-size: 8px;
        line-height: 12px
    }
}

.tiles-cards .product-card__content-price {
    color: #151514;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 40px
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content-price {
        font-size: 24px;
        line-height: 32px;
        margin: 28px 0 8px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .product-card__content-price {
        line-height: 28px;
        margin: 20px 0 8px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .product-card__content-price {
        font-size: 17px;
        line-height: 20px;
        margin: 8px 0 12px
    }
}

.tiles-cards .product-card__content-button {
    all: unset;
    display: flex;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: #58c7f6;
    cursor: pointer;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .tiles-cards .product-card__content-button {
        padding: 20px 48px;
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content-button {
        min-width: 140px;
        max-width: 140px;
        padding: 14px 0;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .tiles-cards .product-card__content-button {
        min-width: 120px;
        max-width: 120px;
        padding: 12px 0;
        border-radius: 10px;
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .product-card__content-button {
        font-size: 10px;
        line-height: 14px;
        min-width: 110px;
        max-width: 110px
    }
}

.tiles-cards .product-card__content-button:hover {
    background-color: #6cd3ff
}

.tiles-cards .product-card__content .italic-text {
    font-style: italic;
    font-weight: 500
}

@media screen and (min-width: 1920px) {
    .tiles-cards .product-card__content .italic-text {
        font-size: 18px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .tiles-cards .product-card__content .italic-text {
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 723px) {
    .tiles-cards .product-card__content .italic-text {
        font-size: 8px;
        line-height: 12px
    }
}

.tiles-card-vertical-2 {
    border-radius: 0 24px 24px 0 !important
}

.tiles-col-container-2 {
    padding: 24px 0 24px 24px !important;
    margin-right: 0 !important
}

@media screen and (max-width: 1359px) {
    .tiles-col-container-2 {
        padding: 0 0 0 16px !important
    }
}

@media screen and (max-width: 1023px) {
    .tiles-col-container-2 {
        padding: 0 !important
    }
}

@media screen and (max-width: 723px) {
    .tiles-col-container-2 {
        flex-direction: row-reverse
    }
}

.card-tiles {
    min-width: 100%
}

@media screen and (max-width: 1023px) {
    .card-tiles {
        border-radius: 0;
        padding: 0;
        max-height: 276px;
        min-height: 276px;
        max-width: 169px;
        margin: 0
    }
}

@media screen and (max-width: 723px) {
    .card-tiles {
        max-height: 272px;
        min-height: 272px;
        max-width: 164px;
        margin: 0
    }
}

.card-tiles .card__image-wrapper {
    display: flex;
    justify-content: center
}

.card-tiles .card-info {
    height: 100%
}

@media screen and (max-width: 1023px) {
    .card-tiles .card-info {
        padding: 0 8px 8px;
        max-height: 100px
    }
}

@media screen and (max-width: 1023px) {
    .card-tiles .card-comment {
        top: 12px;
        right: 12px
    }
}

.card-tiles .card-image {
    max-height: 100%;
    min-height: 100%;
    min-width: 100%;
    max-width: 153px;
    padding-top: 16px
}

@media screen and (max-width: 1359px) {
    .card-tiles .card-image {
        padding-top: 12px
    }
}

@media screen and (max-width: 1023px) {
    .card-tiles .card-info__title {
        margin: 0
    }
}

.tiles-title-mob {
    display: none
}

@media screen and (max-width: 723px) {
    .tiles-title-mob {
        display: flex;
        color: #151514;
        font-family: Headline Base;
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .tiles-2 {
        flex-direction: column-reverse !important
    }
}

.tile-container {
    display: flex;
    flex-direction: column;
    gap: 10px
}

@media screen and (min-width: 1920px) {
    .section-links {
        padding: 48px 0 56px
    }
}

@media screen and (max-width: 1024px) {
    .section-links {
        padding: 32px 0
    }
}

@media screen and (max-width: 768px) {
    .section-links {
        display: none
    }
}

.section-links .link-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    min-width: 560px;
    max-width: 560px;
    height: 176px;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .section-links .link-item {
        height: 248px;
        min-width: 716px;
        max-width: 716px
    }
}

@media screen and (max-width: 1024px) {
    .section-links .link-item {
        height: 128px;
        min-width: 444px;
        max-width: 444px
    }
}

.section-links .link-item:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background: radial-gradient(473% 757.32% at 95.27% 29.83%, #fff, #fff0 54.69%)
}

.section-links .link-item__image {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.section-links .link-item__text {
    position: absolute;
    z-index: 1;
    text-align: center
}

.section-links .link-item__text-title {
    margin-bottom: 8px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .section-links .link-item__text-title {
        font-size: 32px;
        line-height: 32px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1024px) {
    .section-links .link-item__text-title {
        font-size: 18px
    }
}

.section-links .link-item__text-subtitle {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .section-links .link-item__text-subtitle {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .section-links .link-item__text-subtitle {
        font-size: 10px;
        line-height: 12px
    }
}

.section-brands {
    padding: 56px 40px 0;
    position: relative
}

@media screen and (min-width: 1920px) {
    .section-brands {
        padding: 0 80px
    }
}

@media screen and (max-width: 1359px) {
    .section-brands {
        padding: 0 32px
    }
}

@media screen and (max-width: 1023px) {
    .section-brands {
        padding: 0 28px
    }
}

@media screen and (max-width: 723px) {
    .section-brands {
        padding: 0 16px
    }
}

.section-brands .brands--mobile {
    display: none;
    padding: 8px 0 8px 16px;
    background: #fff;
    overflow: hidden
}

@media screen and (max-width: 1023px) {
    .section-brands .brands--mobile {
        display: flex
    }
}

.section-brands .brands--mobile .brands-list {
    display: flex;
    column-gap: 8px;
    margin-top: 0;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch
}

.section-brands .brands--mobile .brands-list__item {
    min-height: 74px;
    min-width: 128px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ededed;
    border-radius: 3px
}

.section-brands .brands--mobile .brands-list__item img {
    width: 50%;
    height: 50%;
    object-fit: cover
}

.section-brands .brands-list {
    column-gap: 24px
}

@media screen and (max-width: 1359px) {
    .section-brands .brands-list {
        column-gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    .section-brands .brands-list {
        display: none
    }
}

.section-brands .brands-list__item {
    display: flex;
    min-width: 220px;
    min-height: 125px;
    padding: 0 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 18px;
    background: #f4f4f4;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-brands .brands-list__item {
        width: 376px;
        height: 180px;
        padding: 0 24px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .section-brands .brands-list__item {
        padding: 16px 24px;
        min-width: 205px;
        max-width: 205px;
        max-height: 100px;
        min-height: 100px;
        border-radius: 16px
    }

    .section-brands .brands-list__item img {
        max-width: 72px;
        max-height: 44px
    }
}

@media screen and (max-width: 1023px) {
    .section-brands .brands-list__item {
        padding: 16px 24px;
        min-width: 148px;
        max-width: 148px;
        max-height: 90px;
        min-height: 90px;
        border-radius: 12px
    }

    .section-brands .brands-list__item img {
        max-width: 56px;
        max-height: 34px
    }
}

@media screen and (max-width: 723px) {
    .section-brands .brands-list__item {
        padding: 16px 24px;
        min-width: 91px;
        max-width: 91px;
        max-height: 60px;
        min-height: 60px;
        border-radius: 8px
    }

    .section-brands .brands-list__item img {
        max-width: 56px;
        max-height: 34px
    }
}

.brands-swiper {
    width: 100%;
    padding-right: 0;
    box-sizing: border-box;
    margin-top: 40px;
    position: unset !important
}

@media screen and (max-width: 1359px) {
    .brands-swiper {
        margin-top: 24px
    }
}

@media screen and (max-width: 1359px) {
    .brands-swiper {
        margin-top: 18px
    }
}

.brands-swiper .swiper-wrapper {
    margin-right: 0
}

.brands-swiper .swiper-slide {
    width: auto !important;
    flex-shrink: 0
}

.swiper {
    position: unset !important
}

.viewed-button-prev,
.viewed-button-next,
.brands-button-prev,
.brands-button-next {
    position: absolute;
    transform: translateY(-50%);
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 4;
    transition: background-color .3s ease;
    border: 1px solid #dedede;
    box-shadow: 0 0 24px #0000001a;
    opacity: .9;
    width: 64px;
    height: 64px
}

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

    .viewed-button-prev,
    .viewed-button-next,
    .brands-button-prev,
    .brands-button-next {
        width: 80px;
        height: 80px
    }
}

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

    .viewed-button-prev,
    .viewed-button-next,
    .brands-button-prev,
    .brands-button-next {
        width: 48px;
        height: 48px
    }
}

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

    .viewed-button-prev,
    .viewed-button-next,
    .brands-button-prev,
    .brands-button-next {
        width: 38px;
        height: 38px
    }
}

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

    .viewed-button-prev,
    .viewed-button-next,
    .brands-button-prev,
    .brands-button-next {
        width: 32px;
        height: 32px
    }
}

.viewed-button-prev svg,
.viewed-button-next svg,
.brands-button-prev svg,
.brands-button-next svg {
    position: absolute;
    width: 16px;
    height: 28px;
    fill: #888;
    transition: fill .3s ease;
    left: 25px
}

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

    .viewed-button-prev svg,
    .viewed-button-next svg,
    .brands-button-prev svg,
    .brands-button-next svg {
        width: 20px;
        height: 35px;
        left: 31px
    }
}

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

    .viewed-button-prev svg,
    .viewed-button-next svg,
    .brands-button-prev svg,
    .brands-button-next svg {
        width: 12px;
        height: 21px;
        left: 19px
    }
}

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

    .viewed-button-prev svg,
    .viewed-button-next svg,
    .brands-button-prev svg,
    .brands-button-next svg {
        width: 10px;
        height: 16px;
        left: 14px
    }
}

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

    .viewed-button-prev svg,
    .viewed-button-next svg,
    .brands-button-prev svg,
    .brands-button-next svg {
        width: 8px;
        height: 14px;
        left: 12px
    }
}

.viewed-button-prev:hover,
.viewed-button-next:hover,
.brands-button-prev:hover,
.brands-button-next:hover {
    border: 1px solid #4da6cd
}

.viewed-button-prev,
.brands-button-prev {
    top: 40%;
    left: 25px
}

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

    .viewed-button-prev,
    .brands-button-prev {
        left: 40px
    }
}

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

    .viewed-button-prev,
    .brands-button-prev {
        left: 16px
    }
}

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

    .viewed-button-prev,
    .brands-button-prev {
        top: 45%
    }
}

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

    .viewed-button-prev,
    .brands-button-prev {
        left: 3px
    }
}

.viewed-button-prev svg,
.brands-button-prev svg {
    transform: rotate(180deg);
    position: absolute;
    left: 22px
}

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

    .viewed-button-prev svg,
    .brands-button-prev svg {
        top: 28%;
        left: 28px
    }
}

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

    .viewed-button-prev svg,
    .brands-button-prev svg {
        top: 27%;
        left: 16px
    }
}

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

    .viewed-button-prev svg,
    .brands-button-prev svg {
        left: 12px
    }
}

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

    .viewed-button-prev svg,
    .brands-button-prev svg {
        top: 26%;
        left: 10px
    }
}

.viewed-button-next,
.brands-button-next {
    position: absolute;
    right: 18px;
    top: 40%;
    z-index: 4
}

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

    .viewed-button-next,
    .brands-button-next {
        right: 40px
    }
}

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

    .viewed-button-next,
    .brands-button-next {
        right: 16px
    }
}

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

    .viewed-button-next,
    .brands-button-next {
        top: 45%
    }
}

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

    .viewed-button-next,
    .brands-button-next {
        right: 3px
    }
}

.brands-button-prev,
.brands-button-next {
    top: 65%
}

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

    .brands-button-prev,
    .brands-button-next {
        top: 57%
    }
}

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

    .brands-button-prev,
    .brands-button-next {
        top: 55%
    }
}

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

    .brands-button-prev,
    .brands-button-next {
        top: 57%
    }
}

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

    .brands-button-prev,
    .brands-button-next {
        top: 60%
    }
}

.swiper-left,
.swiper-right {
    width: 48px;
    height: 48px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: background-color .3s ease;
    border: 1px solid #dedede
}

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

    .swiper-left,
    .swiper-right {
        width: 72px;
        height: 72px
    }
}

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

    .swiper-left,
    .swiper-right {
        width: 40px;
        height: 40px
    }
}

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

    .swiper-left,
    .swiper-right {
        width: 38px;
        height: 38px
    }
}

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

    .swiper-left,
    .swiper-right {
        width: 32px;
        height: 32px
    }
}

.swiper-left svg,
.swiper-right svg {
    fill: #888;
    transition: fill .3s ease
}

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

    .swiper-left svg,
    .swiper-right svg {
        width: 18px;
        height: 31px
    }
}

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

    .swiper-left svg,
    .swiper-right svg {
        width: 10px;
        height: 17px
    }
}

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

    .swiper-left svg,
    .swiper-right svg {
        width: 10px;
        height: 16px
    }
}

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

    .swiper-left svg,
    .swiper-right svg {
        width: 8px;
        height: 14px
    }
}

.swiper-left:hover,
.swiper-right:hover {
    border: 1px solid #4da6cd
}

.swiper-left svg {
    transform: rotate(180deg)
}

.catalog {
    max-width: 1440px;
    margin: 0 50px;
    position: relative
}

@media screen and (min-width: 1920px) {
    .catalog {
        min-width: 1488px;
        max-width: 1832px
    }
}

@media screen and (max-width: 1024px) {
    .catalog {
        max-width: 1200px;
        margin: 0 30px
    }
}

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

.catalog__container {
    padding: 32px 48px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .catalog__container {
        padding: 48px
    }
}

@media screen and (max-width: 1024px) {
    .catalog__container {
        padding: 32px 40px
    }
}

.catalog__wrapper {
    position: relative;
    overflow-y: auto;
    min-height: 65vh;
    max-height: 75vh;
    transition: opacity .25s ease
}

.catalog__wrapper::-webkit-scrollbar {
    width: 5px
}

@media screen and (max-width: 768px) {
    .catalog__wrapper::-webkit-scrollbar {
        width: 2px
    }
}

.catalog__wrapper::-webkit-scrollbar-track {
    background: #7a7d8500
}

.catalog__wrapper::-webkit-scrollbar-thumb {
    background: #0003
}

.catalog .close-button {
    position: absolute;
    top: 24px;
    right: 24px;
    padding: 8px;
    width: 40px;
    height: 40px;
    cursor: pointer
}

@media screen and (max-width: 1024px) {
    .catalog .close-button {
        top: 28px;
        right: 28px;
        padding: 6px;
        width: 32px;
        height: 32px
    }
}

.catalog-title {
    margin-bottom: 40px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .catalog-title {
        font-size: 35px;
        line-height: 40px;
        margin-bottom: 48px
    }
}

@media screen and (max-width: 1024px) {
    .catalog-title {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .catalog-title {
        font-size: 22px;
        line-height: 24px;
        padding: 0 16px 16px;
        border-bottom: 1px solid #ededed
    }
}

.catalog-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 40px;
    column-gap: 44px;
    margin-bottom: 48px
}

@media screen and (min-width: 1920px) {
    .catalog-list {
        column-gap: 130px;
        row-gap: 48px
    }
}

@media screen and (max-width: 1024px) {
    .catalog-list {
        row-gap: 24px;
        column-gap: 40px
    }
}

@media screen and (max-width: 768px) {
    .catalog-list {
        flex-direction: column;
        padding: 0 16px
    }
}

.catalog-list__item {
    display: flex;
    min-width: 236px;
    max-width: 236px
}

@media screen and (min-width: 1920px) {
    .catalog-list__item {
        min-width: 312px;
        max-width: 312px
    }
}

@media screen and (max-width: 1024px) {
    .catalog-list__item {
        min-width: 190px;
        max-width: 190px
    }
}

.catalog-list__item:last-child {
    margin-right: 0
}

.catalog-list__item-image,
.catalog-list__item-empty {
    width: 56px;
    height: 56px;
    object-fit: cover;
    margin-right: 12px;
    cursor: pointer
}

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

    .catalog-list__item-image,
    .catalog-list__item-empty {
        width: 64px;
        height: 64px;
        margin-right: 24px
    }
}

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

    .catalog-list__item-image,
    .catalog-list__item-empty {
        width: 44px;
        height: 44px;
        margin-right: 16px
    }
}

.catalog-links__title {
    margin: 8px 0;
    padding: 4px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 16px;
    color: #151514;
    text-decoration: none;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .catalog-links__title {
        font-size: 22px;
        line-height: 24px;
        padding: 8px;
        margin: 8px 0 0
    }
}

@media screen and (max-width: 1024px) {
    .catalog-links__title {
        font-size: 13px;
        line-height: 16px;
        padding: 0 4px;
        margin: 4px 0
    }
}

.catalog-links__title:first-child {
    margin-top: 0;
    padding-top: 4px
}

.catalog-links__list {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.catalog-links__list-item,
.catalog-links__list-more {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    cursor: pointer;
    color: #151514;
    padding: 4px
}

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

    .catalog-links__list-item,
    .catalog-links__list-more {
        font-size: 16px;
        line-height: 24px;
        padding: 4px 8px
    }
}

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

    .catalog-links__list-item,
    .catalog-links__list-more {
        font-size: 10px;
        line-height: 16px;
        padding: 0 4px;
        margin-top: 4px
    }
}

.catalog-links__list-item:hover,
.catalog-links__list-more:hover {
    background: #f0f6fb;
    transition: .2s all ease
}

.catalog-links__list-item {
    text-decoration: none
}

.catalog-links__list-more {
    color: #888
}

.category {
    position: absolute;
    top: 0;
    z-index: -5;
    width: 100%;
    height: 0;
    opacity: 0
}

.category.catalog--visible {
    z-index: 10;
    opacity: 1;
    height: 100%;
    overflow: hidden
}

.category-header {
    display: flex;
    align-items: center;
    margin-bottom: 32px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .category-header {
        margin-bottom: 48px
    }
}

@media screen and (max-width: 1024px) {
    .category-header {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .category-header {
        padding: 0 16px 16px;
        margin-bottom: 16px;
        border-bottom: 1px solid #ededed
    }
}

.category-header__prev {
    margin-right: 16px
}

@media screen and (min-width: 1920px) {
    .category-header__prev {
        margin-right: 24px;
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .category-header__prev {
        margin-right: 12px
    }
}

@media screen and (max-width: 768px) {
    .category-header__prev {
        margin-right: 16px
    }
}

.category-header__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .category-header__title {
        font-size: 35px;
        line-height: 40px
    }
}

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

@media screen and (max-width: 768px) {
    .category-header__title {
        font-size: 22px;
        line-height: 24px
    }
}

.category-wrapper {
    display: flex;
    justify-content: space-between;
    margin-bottom: 48px;
    column-gap: 16px;
    padding-right: 10px
}

@media screen and (min-width: 1920px) {
    .category-wrapper {
        padding-right: 20px
    }
}

@media screen and (max-width: 1024px) {
    .category-wrapper {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1200px) {
    .category-wrapper--large .category-links__columns {
        margin-left: 0
    }
}

@media screen and (max-width: 1024px) {
    .category-wrapper--large .category-links__columns .category-links__column:nth-child(4) {
        display: none
    }
}

@media screen and (max-width: 1280px) {
    .category-wrapper--large .category-links__banner {
        display: none
    }
}

.category-links {
    display: flex;
    justify-content: space-between;
    column-gap: 28px
}

@media screen and (min-width: 1920px) {
    .category-links {
        column-gap: 48px
    }
}

@media screen and (max-width: 1024px) {
    .category-links {
        column-gap: 32px
    }
}

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

.category-links__item {
    margin-bottom: 4px;
    padding: 4px;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    text-decoration: none;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .category-links__item {
        font-size: 16px;
        line-height: 24px;
        padding: 4px 8px
    }
}

@media screen and (max-width: 1024px) {
    .category-links__item {
        font-size: 10px;
        line-height: 16px;
        margin-bottom: 4px
    }
}

.category-links__item:hover {
    background: #f0f6fb;
    transition: .2s all ease
}

.category-links__columns {
    display: flex;
    column-gap: 16px;
    height: max-content
}

@media screen and (min-width: 1920px) {
    .category-links__columns {
        column-gap: 48px
    }
}

@media screen and (max-width: 1024px) {
    .category-links__columns {
        width: 100%
    }
}

.category-links__column {
    display: flex;
    flex-direction: column;
    min-width: 206px;
    max-width: 240px
}

@media screen and (min-width: 1920px) {
    .category-links__column {
        max-width: 312px
    }
}

@media screen and (max-width: 1024px) {
    .category-links__column {
        min-width: 176px;
        max-width: 196px
    }
}

.category-links__banner {
    min-width: 360px;
    max-width: 360px;
    min-height: 520px;
    max-height: 520px
}

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

.category-links__banner img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.category-brands.category-wrapper {
    justify-content: flex-start
}

@media screen and (min-width: 1920px) {
    .category-brands.category-wrapper {
        column-gap: 184px;
        justify-content: space-between
    }
}

@media screen and (max-width: 1024px) {
    .category-brands.category-wrapper {
        justify-content: space-between;
        column-gap: 40px
    }
}

.category-brands__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    height: max-content
}

@media screen and (min-width: 1920px) {
    .category-brands__wrapper {
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .category-brands__wrapper {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 423px) {
    .category-brands__wrapper {
        gap: 4px
    }
}

.category-brands .category-links__item {
    font-size: 15px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .category-brands .category-links__item {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .category-brands .category-links__item {
        font-size: 10px;
        line-height: 16px
    }
}

.category-brands .category-links__columns {
    width: 100%
}

@media screen and (max-width: 768px) {
    .category-brands .category-links__columns {
        grid-template-columns: 1fr;
        gap: 4px
    }
}

.category-brands .category-links__column {
    min-width: max-content;
    max-width: max-content
}

.category-brands .brand {
    min-height: 120px;
    min-width: 120px;
    max-width: 120px;
    max-height: 120px;
    box-shadow: none;
    border: 1px solid #dedede;
    background: #fff
}

@media screen and (min-width: 1920px) {
    .category-brands .brand {
        min-height: 144px;
        min-width: 144px;
        max-width: 144px;
        max-height: 144px
    }
}

@media screen and (max-width: 1024px) {
    .category-brands .brand {
        min-height: 96px;
        min-width: 96px;
        max-width: 96px;
        max-height: 96px
    }
}

@media screen and (max-width: 768px) {
    .category-brands .brand {
        min-height: 108px;
        min-width: 108px;
        max-width: 100%;
        max-height: 108px
    }
}

@media screen and (max-width: 423px) {
    .category-brands .brand {
        min-height: 88px;
        min-width: 88px;
        max-height: 88px
    }
}

.category-brands .brand:hover {
    border: 1px solid #58c7f7
}

.category-brands .brand .brand-image {
    min-width: 72px;
    max-width: 72px;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .category-brands .brand .brand-image {
        min-width: 88px;
        max-width: 88px
    }
}

@media screen and (max-width: 1024px) {
    .category-brands .brand .brand-image {
        min-width: 58px;
        max-width: 58px
    }
}

@media screen and (max-width: 768px) {
    .category-brands .brand .brand-image {
        min-width: 48px;
        max-width: 48px
    }
}

.category-brands .brand .brand-title {
    font-size: 13px;
    line-height: 16px;
    bottom: 8px
}

@media screen and (min-width: 1920px) {
    .category-brands .brand .brand-title {
        font-size: 16px;
        line-height: 24px;
        bottom: 8px
    }
}

@media screen and (max-width: 768px) {
    .category-brands .brand .brand-title {
        font-size: 12px
    }
}

.catalog--mobile {
    width: 85%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    overflow-y: auto;
    padding: 16px 0;
    opacity: 1;
    z-index: 10;
    background-color: #fff;
    transition: opacity .5s ease
}

@media screen and (max-width: 1023px) {
    .catalog--mobile {
        display: block;
        highlight-color: transparent;
        -webkit-tap-highlight-color: transparent
    }
}

.catalog--mobile .catalog-title {
    margin-bottom: 16px
}

.catalog--mobile .catalog-list {
    margin-bottom: 0
}

.catalog--mobile .catalog-list__item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    min-width: 100%;
    max-width: 100%
}

.catalog--mobile .catalog-list__item-image {
    width: 48px;
    height: 48px;
    margin-right: 0;
    cursor: pointer
}

@media screen and (max-width: 423px) {
    .catalog--mobile .catalog-list__item-image {
        width: 40px;
        height: 40px
    }
}

.catalog--mobile .catalog-list__item .catalog-links {
    max-width: 236px;
    min-width: 236px;
    padding: 4px
}

@media screen and (max-width: 423px) {
    .catalog--mobile .catalog-list__item .catalog-links {
        max-width: 212px;
        min-width: 212px
    }
}

.catalog--mobile .catalog-list__item .catalog-links .catalog-links__title {
    font-size: 15px;
    line-height: 16px;
    margin: 0 0 8px;
    padding: 0
}

.catalog--mobile .catalog-list__item .catalog-links__description {
    width: 100%;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.catalog-wrapper--mobile .close-button {
    position: absolute;
    top: 18px;
    right: 18px;
    padding: 4px;
    width: 26px;
    height: 26px;
    cursor: pointer
}

.category--mobile {
    display: none;
    z-index: -10;
    opacity: 0;
    transform: translate(-110%);
    transition: opacity .25s ease, transform .25s ease
}

.category--mobile.category--visible {
    z-index: 10;
    opacity: 1;
    transform: translate(0)
}

@media screen and (max-width: 1023px) {
    .category--mobile {
        display: block;
        highlight-color: transparent;
        -webkit-tap-highlight-color: transparent
    }
}

.category--mobile .catalog-links__title {
    font-size: 15px;
    line-height: 16px;
    margin: 0 0 8px;
    padding: 12px 0
}

.category--mobile .category-links {
    display: flex;
    flex-direction: column
}

.category--mobile .category-links__item {
    width: 100%;
    padding: 12px 0;
    margin: 0 0 4px;
    font-size: 15px;
    line-height: 24px
}

.category--mobile .category-links.category-brands {
    padding: 0 12px
}

.new-catalog-overlay {
    background: transparent !important;
    background-color: transparent !important;
    padding: 0 !important;
    align-items: flex-start !important;
    overscroll-behavior: contain;
    z-index: 999 !important
}

.new-catalog-overlay.modal-overlay--visible {
    z-index: 999 !important;
    background: transparent !important;
    background-color: transparent !important
}

.new-catalog {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100vh;
    background-color: transparent !important;
    background: transparent !important;
    z-index: 1000;
    pointer-events: none
}

.new-catalog__container {
    width: calc(100vw - 160px);
    min-height: 1093px;
    position: absolute;
    top: 121px;
    left: 50%;
    transform: translate(-50%);
    background-color: #f4f4f4;
    border-radius: 28px;
    padding: 0;
    box-shadow: 0 0 24px #0000001a, 0 20px 40px #0006;
    z-index: 1001;
    display: flex;
    flex-direction: column;
    pointer-events: all
}

@media screen and (min-width: 1920px) {
    .new-catalog__container {
        width: calc(100vw - 160px)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-catalog__container {
        width: calc(100vw - ((40px + 40px*(100vw - 1360px)/560px)*2));
        min-height: calc(776px + 317*(100vw - 1360px)/560px);
        top: calc(75px + 46px*(100vw - 1360px)/560px)
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog__container {
        min-height: calc(920px + 173 * (100vw - 1600px) / 320);
        top: calc(75px + 46 * (100vw - 1600px) / 320)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1600px) {
    .new-catalog__container {
        width: calc(100vw - ((40px + 40px*(100vw - 1360px)/560px)*2));
        min-height: calc(776px + 144px*(100vw - 1360px)/240px);
        top: calc(75px + 0px*(100vw - 1360px)/240px)
    }
}

.new-catalog__container .close-button {
    display: none
}

@media screen and (max-width: 1360px) {
    .new-catalog__container {
        width: calc(100vw - 80px);
        min-height: 776px;
        top: 75px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1360px) {
    .new-catalog__container {
        width: calc(100vw - ((16px + 24px*(100vw - 1024px)/336px)*2));
        min-height: calc(760px + .1*(100vw - 1200px))
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .new-catalog__container {
        width: calc(100vw - ((16px + 24px*(100vw - 1024px)/336px)*2));
        min-height: calc(772px + 4*(100vw - 1024px)/336px)
    }
}

@media screen and (max-width: 1200px) {
    .new-catalog__container {
        min-height: 760px;
        border-radius: 26px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .new-catalog__container {
        width: calc(100vw - ((16px + 24px*(100vw - 1024px)/336px)*2));
        min-height: calc(772px + -12 * (100vw - 1024px) / 176)
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog__container {
        width: calc(100vw - 32px);
        min-height: 772px;
        top: 75px
    }
}

.new-catalog__wrapper {
    display: flex;
    width: 100%;
    min-height: 100%;
    gap: 6px;
    overflow: visible;
    border-radius: 28px
}

.new-catalog__sidebar {
    width: 428px;
    height: 100%;
    overflow-y: visible;
    overflow-x: hidden;
    border-radius: 24px 8px 8px 24px;
    background: #fff;
    padding: 12px 16px 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px
}

@media screen and (max-width: 1600px) {
    .new-catalog__sidebar {
        width: 360px;
        gap: 8px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog__sidebar {
        width: calc(360px + 68 * (100vw - 1600px) / 320);
        gap: calc(8px + .00625*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog__sidebar {
        width: calc(323px + 37px*(100vw - 1360px)/240px);
        gap: calc(8px + 0px*(100vw - 1360px)/240px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog__sidebar {
        width: 323px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {
    .new-catalog__sidebar {
        width: calc(300px + 23 * (100vw - 1200px) / 160)
    }
}

@media screen and (max-width: 1200px) {
    .new-catalog__sidebar {
        width: 300px;
        gap: 8px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .new-catalog__sidebar {
        width: calc(278px + .125*(100vw - 1024px))
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog__sidebar {
        width: 278px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog__sidebar {
        width: 256px;
        gap: 6px
    }
}

.new-catalog .sidebar-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 400px;
    height: 72px;
    padding: 12px 14px;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color .2s ease
}

@media screen and (max-width: 1600px) {
    .new-catalog .sidebar-item {
        width: 332px;
        height: 68px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog .sidebar-item {
        width: calc(332px + 68 * (100vw - 1600px) / 320);
        height: calc(68px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog .sidebar-item {
        width: calc(295px + 37px*(100vw - 1360px)/240px);
        height: calc(52px + 16px*(100vw - 1360px)/240px)
    }
}

.new-catalog .sidebar-item:hover {
    border: 1px solid #dedede
}

.new-catalog .sidebar-item.active {
    background-color: #f4f4f4;
    border: 1px solid #dedede
}

.new-catalog .sidebar-item.active .sidebar-item__title {
    color: #888
}

.new-catalog .sidebar-item.active .sidebar-item__arrow path {
    fill: #888
}

.new-catalog .sidebar-item.active .sidebar-item__arrow--discount path {
    fill: #14b262;
    stroke: #14b262
}

.new-catalog .sidebar-item .sidebar-item__arrow {
    width: 8px;
    height: 14px
}

@media screen and (min-width: 1920px) {
    .new-catalog .sidebar-item .sidebar-item__arrow {
        width: 11px;
        height: 18px
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item {
        width: 295px;
        height: 52px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {
    .new-catalog .sidebar-item {
        width: calc(280px + .09375*(100vw - 1200px));
        height: calc(50px + .0125*(100vw - 1200px))
    }
}

@media screen and (max-width: 1200px) {
    .new-catalog .sidebar-item {
        width: 280px;
        height: 50px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .new-catalog .sidebar-item {
        width: calc(260px + 20 * (100vw - 1024px) / 176);
        height: calc(48px + 2 * (100vw - 1024px) / 176)
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog .sidebar-item {
        width: 260px;
        height: 48px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item {
        width: 240px;
        height: 46px
    }
}

.new-catalog .sidebar-item svg {
    width: 11px;
    height: 18px
}

@media screen and (min-width: 1920px) {
    .new-catalog .sidebar-item svg {
        width: 11px;
        height: 18px
    }
}

@media screen and (max-width: 1600px) {
    .new-catalog .sidebar-item svg {
        width: 10px;
        height: 16px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog .sidebar-item svg {
        width: calc(10px + 1 * (100vw - 1600px) / 320);
        height: calc(16px + .00625*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog .sidebar-item svg {
        width: calc(8px + 2px*(100vw - 1360px)/240px);
        height: calc(14px + 2px*(100vw - 1360px)/240px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item svg {
        width: 8px;
        height: 14px
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog .sidebar-item svg {
        width: 8px;
        height: 14px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item svg {
        width: 7px;
        height: 12px
    }
}

.new-catalog .sidebar-item__icon {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border-radius: 8px;
    flex-shrink: 0
}

@media screen and (max-width: 1600px) {
    .new-catalog .sidebar-item__icon {
        width: 44px;
        height: 44px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog .sidebar-item__icon {
        width: calc(44px + .0125*(100vw - 1600px));
        height: calc(44px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog .sidebar-item__icon {
        width: calc(36px + 8px*(100vw - 1360px)/240px);
        height: calc(36px + 8px*(100vw - 1360px)/240px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item__icon {
        width: 36px;
        height: 36px
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog .sidebar-item__icon {
        width: 36px;
        height: 36px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item__icon {
        width: 32px;
        height: 32px
    }
}

.new-catalog .sidebar-item__title {
    flex: 1;
    margin-left: 12px;
    color: #151514;
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0%
}

@media screen and (max-width: 1600px) {
    .new-catalog .sidebar-item__title {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog .sidebar-item__title {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog .sidebar-item__title {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 8px*(100vw - 1360px)/240px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item__title {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {
    .new-catalog .sidebar-item__title {
        font-size: calc(15px + -.00625*(100vw - 1200px));
        line-height: calc(22px + -.0125*(100vw - 1200px))
    }
}

@media screen and (max-width: 1200px) {
    .new-catalog .sidebar-item__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .new-catalog .sidebar-item__title {
        font-size: calc(14px + 1 * (100vw - 1024px) / 176);
        line-height: calc(20px + 2 * (100vw - 1024px) / 176)
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog .sidebar-item__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item__title {
        font-size: 13px;
        line-height: 18px
    }
}

.new-catalog .sidebar-item__arrow {
    flex-shrink: 0;
    margin-left: 8px
}

.new-catalog .sidebar-item__arrow path {
    fill: #151514;
    transition: fill .2s ease
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog .sidebar-item__arrow {
        width: calc(8px + 3px*(100vw - 1360px)/560px);
        height: calc(14px + 4px*(100vw - 1360px)/560px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item__arrow {
        width: 8px;
        height: 14px
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item__arrow {
        width: 7px;
        height: 12px
    }
}

.new-catalog .sidebar-item__arrow--discount {
    flex-shrink: 0;
    margin-left: 8px;
    width: 18px !important;
    height: 18px !important;
    display: block
}

.new-catalog .sidebar-item__arrow--discount path {
    fill: #14b262;
    stroke: #14b262;
    stroke-width: .5;
    transition: fill .2s ease
}

@media screen and (min-width: 1920px) {
    .new-catalog .sidebar-item__arrow--discount {
        width: 18px !important;
        height: 18px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-catalog .sidebar-item__arrow--discount {
        width: 13px !important;
        height: 18px !important
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog .sidebar-item__arrow--discount {
        width: 11px !important;
        height: 17px !important
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog .sidebar-item__arrow--discount {
        width: 11px !important;
        height: 14px !important
    }
}

@media screen and (max-width: 900px) {
    .new-catalog .sidebar-item__arrow--discount {
        width: 15px !important;
        height: 15px !important
    }
}

.new-catalog__content {
    flex: 1 1 auto;
    width: calc(100% - 440px);
    height: 100%;
    overflow: visible;
    border-radius: 8px 24px 24px 8px;
    background: #fff
}

@media screen and (max-width: 1600px) {
    .new-catalog__content {
        width: calc(100% - 372px)
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {
    .new-catalog__content {
        width: calc(100% - (360px + 68 * (100vw - 1600px) / 320) - 12px)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {
    .new-catalog__content {
        width: calc(100% - (323px + 37px*(100vw - 1360px)/240px) - 12px)
    }
}

@media screen and (max-width: 1360px) {
    .new-catalog__content {
        width: calc(100% - 335px)
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {
    .new-catalog__content {
        width: calc(100% - (300px + 23 * (100vw - 1200px) / 160) - 12px)
    }
}

@media screen and (max-width: 1200px) {
    .new-catalog__content {
        width: calc(100% - 312px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .new-catalog__content {
        width: calc(100% - (278px + .125*(100vw - 1024px)) - 12px)
    }
}

@media screen and (max-width: 1024px) {
    .new-catalog__content {
        width: calc(100% - 290px)
    }
}

@media screen and (max-width: 900px) {
    .new-catalog__content {
        width: calc(100% - 268px)
    }
}

.product1,
.content-section1 {
    max-width: 100%;
    min-height: 100%
}

.product1 .product1-banners,
.content-section1 .product1-banners {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    min-height: 1022px;
    border-radius: 16px;
    padding: 28px 32px
}

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

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        min-height: 960px;
        padding: 24px 28px;
        gap: 14px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        min-height: calc(960px + .19375*(100vw - 1600px));
        padding: calc(24px + .0125*(100vw - 1600px)) calc(28px + .0125*(100vw - 1600px));
        gap: calc(14px + .00625*(100vw - 1600px))
    }
}

.product1 .product1-banners a,
.content-section1 .product1-banners a {
    display: inline-block;
    width: 1266px;
    max-width: 100%
}

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

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: 1180px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: calc(1180px + .26875*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: calc(907px + 273px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: 907px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: calc(820px + 87 * (100vw - 1200px) / 160)
    }
}

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

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: 820px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: calc(674px + 146 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .product1-banners a,
    .content-section1 .product1-banners a {
        width: 674px;
        max-width: 100%
    }
}

.product1 .product1-banners .product1-banner,
.content-section1 .product1-banners .product1-banner {
    width: 100%;
    height: auto;
    border-radius: 16px;
    object-fit: contain;
    display: block
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        min-height: calc(960px + 62px*(100vw - 1360px)/240px);
        padding: calc(20px + 4px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        padding: 20px 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        min-height: calc(880px + .5*(100vw - 1200px));
        padding: calc(20px + 0*(100vw - 1200px)) calc(22px + .0125*(100vw - 1200px))
    }
}

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

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        min-height: 880px;
        padding: 20px 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        padding: calc(16px + 4 * (100vw - 1024px) / 176) calc(18px + 4 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .product1-banners,
    .content-section1 .product1-banners {
        padding: 16px 18px
    }
}

.product1 .category-links__columns,
.content-section1 .category-links__columns {
    display: flex;
    gap: 32px;
    width: 100%;
    padding: 28px 32px
}

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

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: 28px;
        padding: 24px 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: calc(28px + .0125*(100vw - 1600px));
        padding: calc(24px + .0125*(100vw - 1600px)) calc(28px + .0125*(100vw - 1600px))
    }
}

.product1 .category-links__columns--three .category-links__column,
.content-section1 .category-links__columns--three .category-links__column,
.product1 .category-links__columns--four .category-links__column,
.content-section1 .category-links__columns--four .category-links__column {
    flex: 1;
    max-width: calc(33.333% - 22px)
}

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

    .product1 .category-links__columns--four .category-links__column,
    .content-section1 .category-links__columns--four .category-links__column {
        max-width: 214px;
        height: 728px
    }
}

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

    .product1 .category-links__columns--four .category-links__column:nth-child(4),
    .content-section1 .category-links__columns--four .category-links__column:nth-child(4) {
        display: none
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: calc(20px + 8px*(100vw - 1360px)/240px);
        padding: calc(20px + 4px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: 20px;
        padding: 20px 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: calc(18px + .0125*(100vw - 1200px));
        padding: calc(22px + -.0125*(100vw - 1200px)) calc(24px + 0*(100vw - 1200px))
    }
}

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

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: 18px;
        padding: 22px 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: calc(16px + 2 * (100vw - 1024px) / 176);
        padding: calc(16px + 6 * (100vw - 1024px) / 176) calc(18px + 6 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .category-links__columns,
    .content-section1 .category-links__columns {
        gap: 16px;
        width: 708px;
        height: 999px;
        padding: 16px 18px
    }
}

.product1 .category-links__row,
.content-section1 .category-links__row {
    display: flex;
    flex-direction: row;
    gap: 6px
}

.product1 .category-brands-section,
.content-section1 .category-brands-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.product1 .category-brands__block,
.content-section1 .category-brands__block {
    background-color: #fff;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px #0000000a
}

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

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: 24px 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: calc(24px + .0125*(100vw - 1600px)) calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: calc(22px + 2px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: 22px 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: calc(22px + 0*(100vw - 1200px)) calc(24px + 0*(100vw - 1200px))
    }
}

.product1 .category-brands__block .caregory-brands__title,
.content-section1 .category-brands__block .caregory-brands__title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 20px
}

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

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: 18px;
        line-height: 26px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(26px + .00625*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 6px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: calc(15px + -.00625*(100vw - 1200px));
        line-height: calc(22px + -.0125*(100vw - 1200px))
    }
}

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

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 1 * (100vw - 1024px) / 176);
        line-height: calc(20px + 2 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .category-brands__block .caregory-brands__title,
    .content-section1 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: calc(4px + 18 * (100vw - 1024px) / 176) calc(4px + 20 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .category-brands__block,
    .content-section1 .category-brands__block {
        padding: 4px
    }
}

.product1 .category-brands__block .category-brands_border,
.content-section1 .category-brands__block .category-brands_border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.product1 .category-brands__list,
.content-section1 .category-brands__list {
    display: flex;
    flex-direction: row;
    gap: 24px;
    flex-wrap: wrap
}

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

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: 20px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: calc(20px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: calc(16px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: 16px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: calc(14px + .0125*(100vw - 1200px))
    }
}

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

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: 14px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: calc(12px + 2 * (100vw - 1024px) / 176);
        padding-bottom: calc(20px * (100vw - 1024px) / 176);
        padding-left: calc(16px * (100vw - 1024px) / 176)
    }
}

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

    .product1 .category-brands__list,
    .content-section1 .category-brands__list {
        gap: 12px;
        padding-bottom: 20px;
        padding-left: 16px
    }
}

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

    .product1 .category-brands__item img,
    .content-section1 .category-brands__item img {
        height: 62px
    }
}

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

    .product1 .category-brands__item img,
    .content-section1 .category-brands__item img {
        height: 48px
    }
}

.product1 .category-links__column,
.content-section1 .category-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px
}

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

    .product1 .category-links__column,
    .content-section1 .category-links__column {
        gap: 6px
    }
}

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

    .product1 .category-links__column,
    .content-section1 .category-links__column {
        gap: 2px
    }
}

.product1 .catalog-links__title,
.content-section1 .catalog-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

.product1 .catalog-links__title:first-child,
.content-section1 .catalog-links__title:first-child {
    margin-top: 0
}

.product1 .catalog-links__title:hover,
.content-section1 .catalog-links__title:hover {
    color: #8fc2d8
}

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

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: 22px;
        line-height: 34px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: calc(22px + .00625*(100vw - 1600px));
        line-height: calc(34px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: calc(16px + 6px*(100vw - 1360px)/240px);
        line-height: calc(24px + 10px*(100vw - 1360px)/240px)
    }
}

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

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: calc(15px + .00625*(100vw - 1200px));
        line-height: calc(22px + .0125*(100vw - 1200px))
    }
}

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

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: calc(16px + -1 * (100vw - 1024px) / 176);
        line-height: calc(24px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .catalog-links__title,
    .content-section1 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product1 .category-links__item,
.content-section1 .category-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease
}

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

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 8px*(100vw - 1360px)/240px)
    }
}

.product1 .category-links__item:hover,
.content-section1 .category-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: calc(13px + .00625*(100vw - 1200px));
        line-height: calc(18px + .0125*(100vw - 1200px))
    }
}

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

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: 13px;
        line-height: 18px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: calc(14px + -1 * (100vw - 1024px) / 176);
        line-height: calc(20px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product1 .category-links__item,
    .content-section1 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.product2,
.content-section2 {
    width: 1300px;
    min-height: 1084px;
    position: relative;
    padding-right: 322px;
    box-sizing: border-box
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2,
    .content-section2 {
        width: 100%;
        max-width: calc(1180px + 120px * (100vw - 1600px) / 320);
        min-height: calc(990px + 94px * (100vw - 1600px) / 320);
        padding-left: 0;
        padding-right: calc(282px + 40px * (100vw - 1600px) / 320)
    }
}

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

    .product2,
    .content-section2 {
        width: 100%;
        max-width: 1180px;
        min-height: 990px;
        padding-left: 0 !important;
        padding-right: 282px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2,
    .content-section2 {
        width: 100%;
        max-width: calc(951px + 229px*(100vw - 1360px)/240px);
        min-height: calc(860px + 130px*(100vw - 1360px)/240px);
        padding-left: 0 !important;
        padding-right: calc(239px + 43px*(100vw - 1360px)/240px)
    }
}

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

    .product2,
    .content-section2 {
        width: 100%;
        max-width: 951px;
        padding-left: 0 !important;
        padding-right: 239px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2,
    .content-section2 {
        width: 100%;
        max-width: calc(900px + 51px*(100vw - 1200px)/160);
        min-height: calc(860px + 0px*(100vw - 1200px)/160);
        padding-left: 0 !important;
        padding-right: calc(214px + 25px*(100vw - 1200px)/160)
    }
}

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

    .product2,
    .content-section2 {
        width: 100%;
        max-width: 900px;
        min-height: 860px;
        padding-left: 0 !important;
        padding-right: 214px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1139px) {

    .product2,
    .content-section2 {
        width: 100%;
        min-height: 772px;
        padding-left: 0 !important;
        padding-right: 0
    }
}

@media screen and (min-width: 1140px) and (max-width: 1199px) {

    .product2,
    .content-section2 {
        width: 100%;
        max-width: calc(900px + 0px * (100vw - 1140px) / 60);
        min-height: calc(772px + 88px * (100vw - 1140px) / 60);
        padding-left: 0 !important;
        padding-right: calc(0px + 214px * (100vw - 1140px) / 60)
    }
}

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

    .product2,
    .content-section2 {
        width: 100%;
        min-height: 772px;
        padding-right: 0
    }
}

.product2 .product2-banner-link,
.content-section2 .product2-banner-link {
    position: absolute;
    top: 28px;
    right: 28px;
    z-index: 10;
    display: block;
    cursor: pointer;
    text-decoration: none;
    transition: opacity .2s ease
}

.product2 .product2-banner-link:hover,
.content-section2 .product2-banner-link:hover {
    opacity: .9
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        right: calc(22px + 6px*(100vw - 1600px)/320px);
        top: calc(28px + 0px*(100vw - 1600px)/320px)
    }
}

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

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        right: clamp(16px, 2vw, 22px);
        top: 28px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        right: calc(16px + 6px*(100vw - 1360px)/240px);
        top: calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        right: calc(24px + -8px*(100vw - 1200px)/160px);
        top: calc(24px + 0px*(100vw - 1200px)/160px)
    }
}

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

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        top: 24px;
        right: 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1139px) {

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        top: auto;
        bottom: 25px
    }
}

@media screen and (min-width: 1140px) and (max-width: 1199px) {

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        right: calc(24px + 0px*(100vw - 1140px)/60px);
        top: calc(25px + -1px*(100vw - 1140px)/60px)
    }
}

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

    .product2 .product2-banner-link,
    .content-section2 .product2-banner-link {
        top: auto;
        bottom: 25px
    }
}

.product2 .product2-banner,
.content-section2 .product2-banner {
    object-fit: cover;
    border-radius: 24px;
    width: 294px;
    height: 427px;
    display: block
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: calc(260px + 34px*(100vw - 1600px)/320px);
        height: calc(380px + 47px*(100vw - 1600px)/320px)
    }
}

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

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: 260px;
        height: 380px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: calc(211px + 49px*(100vw - 1360px)/240px);
        height: calc(306px + 74px*(100vw - 1360px)/240px)
    }
}

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

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: 211px;
        height: 306px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: calc(190px + 21px*(100vw - 1200px)/160px);
        height: calc(280px + 26px*(100vw - 1200px)/160px)
    }
}

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

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: 190px;
        height: 280px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1139px) {

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: 144px;
        height: 209px
    }
}

@media screen and (min-width: 1140px) and (max-width: 1199px) {

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: calc(144px + 46px*(100vw - 1140px)/60px);
        height: calc(209px + 71px*(100vw - 1140px)/60px)
    }
}

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

    .product2 .product2-banner,
    .content-section2 .product2-banner {
        width: 144px;
        height: 209px
    }
}

.product2 .product2-links__columns,
.content-section2 .product2-links__columns {
    display: flex;
    gap: 24px;
    width: 100%;
    padding: 28px 32px;
    box-sizing: border-box;
    overflow: hidden
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: calc(22px + 2px*(100vw - 1600px)/320px);
        padding: calc(24px + 4px*(100vw - 1600px)/320px) calc(28px + 4px*(100vw - 1600px)/320px);
        padding-bottom: calc(32px + 0px*(100vw - 1600px)/320px)
    }
}

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

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: 22px;
        padding: 24px 28px 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: calc(18px + 4px*(100vw - 1360px)/240px);
        padding: calc(22px + 2px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px);
        padding-bottom: calc(32px + 0px*(100vw - 1360px)/240px)
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: calc(18px + 0px*(100vw - 1200px)/160px);
        padding: calc(22px + 0px*(100vw - 1200px)/160px) calc(24px + 0px*(100vw - 1200px)/160px)
    }
}

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

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: 18px;
        padding: 22px 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1139px) {

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: 18px;
        padding: 22px 24px
    }
}

@media screen and (min-width: 1140px) and (max-width: 1199px) {

    .product2 .product2-links__columns,
    .content-section2 .product2-links__columns {
        gap: calc(18px + 0px*(100vw - 1140px)/60px);
        padding: calc(22px + 0px*(100vw - 1140px)/60px) calc(24px + 0px*(100vw - 1140px)/60px)
    }
}

.product2 .product2-links__columns--three .product2-links__column,
.content-section2 .product2-links__columns--three .product2-links__column {
    flex: 1;
    max-width: 300px
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: calc(300px + 0px*(100vw - 1600px)/320px)
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: calc(208px + 92px*(100vw - 1360px)/240px)
    }
}

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

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: 208px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: calc(196px + 12px*(100vw - 1200px)/160px)
    }
}

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

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: 196px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .product2-links__columns--three .product2-links__column,
    .content-section2 .product2-links__columns--three .product2-links__column {
        max-width: calc(196px + 0px*(100vw - 1024px)/176px)
    }
}

.product2 .product2-links__column,
.content-section2 .product2-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px
}

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

    .product2 .product2-links__column,
    .content-section2 .product2-links__column {
        gap: 6px
    }
}

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

    .product2 .product2-links__column,
    .content-section2 .product2-links__column {
        gap: 2px
    }
}

.product2 .product2-links__title,
.content-section2 .product2-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

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

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: 22px;
        line-height: 34px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: calc(22px + .00625*(100vw - 1600px));
        line-height: calc(34px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: calc(16px + 6px*(100vw - 1360px)/240px);
        line-height: calc(24px + 10px*(100vw - 1360px)/240px)
    }
}

.product2 .product2-links__title:first-child,
.content-section2 .product2-links__title:first-child {
    margin-top: 0
}

.product2 .product2-links__title:hover,
.content-section2 .product2-links__title:hover {
    color: #8fc2d8
}

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

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: calc(15px + .00625*(100vw - 1200px));
        line-height: calc(22px + .0125*(100vw - 1200px))
    }
}

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

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: calc(16px + -1 * (100vw - 1024px) / 176);
        line-height: calc(24px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product2 .product2-links__title,
    .content-section2 .product2-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product2 .product2-links__item,
.content-section2 .product2-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease
}

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

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 8px*(100vw - 1360px)/240px)
    }
}

.product2 .product2-links__item:hover,
.content-section2 .product2-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: calc(13px + .00625*(100vw - 1200px));
        line-height: calc(18px + .0125*(100vw - 1200px))
    }
}

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

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: 13px;
        line-height: 18px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: calc(14px + -1 * (100vw - 1024px) / 176);
        line-height: calc(20px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product2 .product2-links__item,
    .content-section2 .product2-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.product2 .category-links__columns,
.content-section2 .category-links__columns {
    display: flex;
    gap: 32px;
    width: 100%;
    padding: 28px 32px
}

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

    .product2 .category-links__columns,
    .content-section2 .category-links__columns {
        gap: 28px;
        padding: 24px 28px
    }
}

.product2 .category-links__columns--three .category-links__column,
.content-section2 .category-links__columns--three .category-links__column,
.product2 .category-links__columns--four .category-links__column,
.content-section2 .category-links__columns--four .category-links__column {
    flex: 1;
    max-width: calc(33.333% - 22px)
}

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

    .product2 .category-links__columns--four .category-links__column,
    .content-section2 .category-links__columns--four .category-links__column {
        max-width: 214px;
        height: 728px
    }
}

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

    .product2 .category-links__columns--four .category-links__column:nth-child(4),
    .content-section2 .category-links__columns--four .category-links__column:nth-child(4) {
        display: none
    }
}

.product2 .category-links__row,
.content-section2 .category-links__row {
    display: flex;
    flex-direction: row;
    gap: 6px
}

.product2 .category-brands-section,
.content-section2 .category-brands-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.product2 .category-brands__block,
.content-section2 .category-brands__block {
    background-color: #fff;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px #0000000a
}

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

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: 24px 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: calc(24px + .0125*(100vw - 1600px)) calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: calc(22px + 2px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: 22px 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: calc(22px + 0*(100vw - 1200px)) calc(24px + 0*(100vw - 1200px))
    }
}

.product2 .category-brands__block .caregory-brands__title,
.content-section2 .category-brands__block .caregory-brands__title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 20px
}

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

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: 18px;
        line-height: 26px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(26px + .00625*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 6px*(100vw - 1360px)/240px)
    }
}

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

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: calc(15px + -.00625*(100vw - 1200px));
        line-height: calc(22px + -.0125*(100vw - 1200px))
    }
}

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

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 1 * (100vw - 1024px) / 176);
        line-height: calc(20px + 2 * (100vw - 1024px) / 176)
    }
}

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

    .product2 .category-brands__block .caregory-brands__title,
    .content-section2 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: calc(4px + 18 * (100vw - 1024px) / 176) calc(4px + 20 * (100vw - 1024px) / 176)
    }
}

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

    .product2 .category-brands__block,
    .content-section2 .category-brands__block {
        padding: 4px
    }
}

.product2 .category-brands__block .category-brands_border,
.content-section2 .category-brands__block .category-brands_border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.product2 .category-brands__list,
.content-section2 .category-brands__list {
    display: flex;
    flex-direction: row;
    gap: 24px;
    flex-wrap: wrap
}

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

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: 20px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: calc(20px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: calc(16px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: 16px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: calc(14px + .0125*(100vw - 1200px))
    }
}

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

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: 14px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: calc(12px + 2 * (100vw - 1024px) / 176);
        padding-bottom: calc(20px * (100vw - 1024px) / 176);
        padding-left: calc(16px * (100vw - 1024px) / 176)
    }
}

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

    .product2 .category-brands__list,
    .content-section2 .category-brands__list {
        gap: 12px;
        padding-bottom: 20px;
        padding-left: 16px
    }
}

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

    .product2 .category-brands__item img,
    .content-section2 .category-brands__item img {
        height: 62px
    }
}

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

    .product2 .category-brands__item img,
    .content-section2 .category-brands__item img {
        height: 48px
    }
}

.product2 .category-links__column,
.content-section2 .category-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px
}

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

    .product2 .category-links__column,
    .content-section2 .category-links__column {
        gap: 2px
    }
}

.product2 .catalog-links__title,
.content-section2 .catalog-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

.product2 .catalog-links__title:first-child,
.content-section2 .catalog-links__title:first-child {
    margin-top: 0
}

.product2 .catalog-links__title:hover,
.content-section2 .catalog-links__title:hover {
    color: #8fc2d8
}

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

    .product2 .catalog-links__title,
    .content-section2 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

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

    .product2 .catalog-links__title,
    .content-section2 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product2 .category-links__item,
.content-section2 .category-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease
}

.product2 .category-links__item:hover,
.content-section2 .category-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product2 .category-links__item,
    .content-section2 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product2 .category-links__item,
    .content-section2 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.product3,
.content-section3 {
    width: 1326px;
    min-height: 1423px;
    display: flex;
    flex-direction: column;
    padding-right: 0;
    box-sizing: border-box;
    overflow-x: hidden
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3,
    .content-section3 {
        width: 100%;
        max-width: calc(1180px + 146px * (100vw - 1600px) / 320);
        min-height: calc(1300px + 123px * (100vw - 1600px) / 320)
    }
}

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

    .product3,
    .content-section3 {
        width: 100%;
        max-width: 1180px;
        min-height: 1300px
    }
}

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

    .product3,
    .content-section3 {
        width: 100%;
        max-width: 951px;
        min-height: 973px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {

    .product3,
    .content-section3 {
        width: 100%;
        max-width: 100%;
        min-height: calc(999px + -26px*(100vw - 1025px)/334px);
        box-sizing: border-box
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3,
    .content-section3 {
        width: 100%;
        min-height: calc(1040px + -67px*(100vw - 1200px)/160);
        padding-left: calc(32px + 16px*(100vw - 1201px)/158px);
        padding-right: calc(32px + 16px*(100vw - 1201px)/158px);
        box-sizing: border-box;
        margin: 0 auto
    }
}

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

    .product3,
    .content-section3 {
        width: 100%;
        max-width: 100%;
        min-height: 1040px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3,
    .content-section3 {
        min-height: calc(999px + 41px*(100vw - 1024px)/176px)
    }
}

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

    .product3,
    .content-section3 {
        width: 708px;
        min-height: 999px
    }
}

.product3 .product3-links__columns,
.content-section3 .product3-links__columns {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    height: 908px;
    justify-content: center;
    gap: 32px;
    width: 100%;
    max-width: 1286px;
    padding: 28px 32px 0;
    box-sizing: border-box;
    overflow: hidden
}

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

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        width: 100%;
        max-width: 1180px;
        height: auto;
        min-height: 860px;
        gap: 24px;
        padding: 24px 24px 0;
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

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

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        width: 100%;
        height: auto;
        min-height: 572px;
        padding: 20px;
        gap: 24px;
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: calc(860px + 48px*(100vw - 1200px)/160px);
        gap: calc(16px + 16px*(100vw - 1200px)/160px);
        padding: calc(24px + 4px*(100vw - 1200px)/160px) calc(24px + 8px*(100vw - 1200px)/160px) 0;
        box-sizing: border-box;
        overflow: hidden
    }
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: calc(728px + 132px*(100vw - 1025px)/175px);
        gap: calc(16px + 0px*(100vw - 1025px)/175px);
        padding: calc(22px + 2px*(100vw - 1025px)/175px) calc(16px + 8px*(100vw - 1025px)/175px) 0;
        box-sizing: border-box;
        overflow: hidden
    }
}

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

    .product3 .product3-links__columns,
    .content-section3 .product3-links__columns {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
        max-width: 100%;
        height: 728px;
        gap: 16px
    }
}

.product3 .product3-links__column,
.content-section3 .product3-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 1360px;
    min-width: 0;
    overflow: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word
}

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

    .product3 .product3-links__column,
    .content-section3 .product3-links__column {
        max-width: 100%
    }
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {

    .product3 .product3-links__column,
    .content-section3 .product3-links__column {
        max-width: 100%;
        box-sizing: border-box
    }

    .product3 .product3-links__column:nth-child(4),
    .content-section3 .product3-links__column:nth-child(4) {
        display: none
    }
}

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

    .product3 .product3-links__column,
    .content-section3 .product3-links__column {
        gap: 6px
    }
}

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

    .product3 .product3-links__column,
    .content-section3 .product3-links__column {
        gap: 4px
    }

    .product3 .product3-links__column:nth-child(4),
    .content-section3 .product3-links__column:nth-child(4) {
        display: none
    }
}

.product3 .product3-links__title,
.content-section3 .product3-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%;
    word-wrap: break-word;
    overflow-wrap: break-word
}

.product3 .product3-links__title:first-child,
.content-section3 .product3-links__title:first-child {
    margin-top: 0
}

.product3 .product3-links__title:hover,
.content-section3 .product3-links__title:hover {
    color: #8fc2d8
}

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

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: 22px;
        line-height: 34px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: calc(22px + .00625*(100vw - 1600px));
        line-height: calc(34px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: calc(16px + 6px*(100vw - 1360px)/240px);
        line-height: calc(24px + 10px*(100vw - 1360px)/240px)
    }
}

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

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: calc(15px + .00625*(100vw - 1200px));
        line-height: calc(22px + .0125*(100vw - 1200px))
    }
}

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

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: calc(16px + -1 * (100vw - 1024px) / 176);
        line-height: calc(24px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product3 .product3-links__title,
    .content-section3 .product3-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product3 .product3-links__item,
.content-section3 .product3-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease;
    word-wrap: break-word;
    overflow-wrap: break-word
}

.product3 .product3-links__item:hover,
.content-section3 .product3-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 8px*(100vw - 1360px)/240px)
    }
}

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

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: calc(13px + .00625*(100vw - 1200px));
        line-height: calc(18px + .0125*(100vw - 1200px))
    }
}

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

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: 13px;
        line-height: 18px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: calc(14px + -1 * (100vw - 1024px) / 176);
        line-height: calc(20px + -2 * (100vw - 1024px) / 176)
    }
}

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

    .product3 .product3-links__item,
    .content-section3 .product3-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.product3 .content-banner-link,
.content-section3 .content-banner-link {
    position: absolute;
    bottom: 20px;
    right: 28px;
    z-index: 10;
    display: block;
    cursor: pointer;
    text-decoration: none;
    transition: opacity .2s ease
}

.product3 .content-banner-link:hover,
.content-section3 .content-banner-link:hover {
    opacity: .9
}

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

    .product3 .content-banner-link,
    .content-section3 .content-banner-link {
        right: clamp(16px, 2vw, 22px)
    }
}

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

    .product3 .content-banner-link,
    .content-section3 .content-banner-link {
        right: 24px
    }
}

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

    .product3 .content-banner-link,
    .content-section3 .content-banner-link {
        bottom: 20px;
        right: 16px
    }
}

.product3 .content-banner,
.content-section3 .content-banner {
    object-fit: cover;
    border-radius: 24px;
    display: block;
    width: 294px;
    height: 427px
}

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

    .product3 .content-banner,
    .content-section3 .content-banner {
        width: 260px;
        height: 360px
    }
}

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

    .product3 .content-banner,
    .content-section3 .content-banner {
        width: 215px;
        height: 313px
    }
}

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

    .product3 .content-banner,
    .content-section3 .content-banner {
        width: 190px;
        height: 284px
    }
}

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

    .product3 .content-banner,
    .content-section3 .content-banner {
        width: 144px;
        height: 209px
    }
}

.product3 .category-links__columns,
.content-section3 .category-links__columns {
    display: flex;
    gap: 32px;
    width: 100%;
    padding: 28px 32px
}

.product3 .category-links__columns--three .category-links__column,
.content-section3 .category-links__columns--three .category-links__column {
    flex: 1;
    max-width: calc(33.333% - 22px)
}

.product3 .category-links__columns--four .category-links__column,
.content-section3 .category-links__columns--four .category-links__column {
    flex: 1;
    max-width: 100%
}

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

    .product3 .category-links__columns,
    .content-section3 .category-links__columns {
        gap: 20px
    }
}

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

    .product3 .category-links__columns,
    .content-section3 .category-links__columns {
        gap: 18px;
        padding: 22px 24px
    }
}

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

    .product3 .category-links__columns,
    .content-section3 .category-links__columns {
        gap: 16px;
        width: 708px;
        height: 999px
    }
}

.product3 .category-links__row,
.content-section3 .category-links__row {
    display: flex;
    flex-direction: row;
    gap: 6px
}

.product3 .category-brands-section,
.content-section3 .category-brands-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.product3 .category-brands__block,
.content-section3 .category-brands__block {
    background-color: #fff;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px #0000000a
}

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

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: 24px 28px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: calc(24px + .0125*(100vw - 1600px)) calc(28px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: calc(22px + 2px*(100vw - 1360px)/240px) calc(24px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: 22px 24px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: calc(22px + 0*(100vw - 1200px)) calc(24px + 0*(100vw - 1200px))
    }
}

.product3 .category-brands__block .caregory-brands__title,
.content-section3 .category-brands__block .caregory-brands__title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 20px
}

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

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: 18px;
        line-height: 26px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: calc(18px + .00625*(100vw - 1600px));
        line-height: calc(26px + .00625*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 4px*(100vw - 1360px)/240px);
        line-height: calc(20px + 6px*(100vw - 1360px)/240px)
    }
}

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

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: calc(15px + -.00625*(100vw - 1200px));
        line-height: calc(22px + -.0125*(100vw - 1200px))
    }
}

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

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: 15px;
        line-height: 22px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: calc(14px + 1 * (100vw - 1024px) / 176);
        line-height: calc(20px + 2 * (100vw - 1024px) / 176)
    }
}

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

    .product3 .category-brands__block .caregory-brands__title,
    .content-section3 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: calc(4px + 18 * (100vw - 1024px) / 176) calc(4px + 20 * (100vw - 1024px) / 176)
    }
}

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

    .product3 .category-brands__block,
    .content-section3 .category-brands__block {
        padding: 4px
    }
}

.product3 .category-brands__block .category-brands_border,
.content-section3 .category-brands__block .category-brands_border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.product3 .category-brands__list,
.content-section3 .category-brands__list {
    display: flex;
    flex-direction: row;
    gap: 24px;
    flex-wrap: wrap
}

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

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: 20px
    }
}

@media screen and (min-width: 1601px) and (max-width: 1919px) {

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: calc(20px + .0125*(100vw - 1600px))
    }
}

@media screen and (min-width: 1361px) and (max-width: 1599px) {

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: calc(16px + 4px*(100vw - 1360px)/240px)
    }
}

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

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: 16px
    }
}

@media screen and (min-width: 1201px) and (max-width: 1359px) {

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: calc(14px + .0125*(100vw - 1200px))
    }
}

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

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: 14px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: calc(12px + 2 * (100vw - 1024px) / 176);
        padding-bottom: calc(20px * (100vw - 1024px) / 176);
        padding-left: calc(16px * (100vw - 1024px) / 176)
    }
}

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

    .product3 .category-brands__list,
    .content-section3 .category-brands__list {
        gap: 12px;
        padding-bottom: 20px;
        padding-left: 16px
    }
}

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

    .product3 .category-brands__item img,
    .content-section3 .category-brands__item img {
        height: 62px
    }
}

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

    .product3 .category-brands__item img,
    .content-section3 .category-brands__item img {
        height: 48px
    }
}

.product3 .category-links__column,
.content-section3 .category-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px
}

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

    .product3 .category-links__column,
    .content-section3 .category-links__column {
        gap: 6px
    }
}

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

    .product3 .category-links__column,
    .content-section3 .category-links__column {
        gap: 2px
    }
}

.product3 .catalog-links__title,
.content-section3 .catalog-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

.product3 .catalog-links__title:first-child,
.content-section3 .catalog-links__title:first-child {
    margin-top: 0
}

.product3 .catalog-links__title:hover,
.content-section3 .catalog-links__title:hover {
    color: #8fc2d8
}

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

    .product3 .catalog-links__title,
    .content-section3 .catalog-links__title {
        font-size: 22px;
        line-height: 34px
    }
}

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

    .product3 .catalog-links__title,
    .content-section3 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

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

    .product3 .catalog-links__title,
    .content-section3 .catalog-links__title {
        font-size: 15px;
        line-height: 22px
    }
}

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

    .product3 .catalog-links__title,
    .content-section3 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product3 .category-links__item,
.content-section3 .category-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease
}

.product3 .category-links__item:hover,
.content-section3 .category-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product3 .category-links__item,
    .content-section3 .category-links__item {
        font-size: 18px;
        line-height: 28px
    }
}

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

    .product3 .category-links__item,
    .content-section3 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product3 .category-links__item,
    .content-section3 .category-links__item {
        font-size: 13px;
        line-height: 18px
    }
}

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

    .product3 .category-links__item,
    .content-section3 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.product13,
.content-section13 {
    width: 100%;
    height: 100%;
    background-color: #f4f4f4
}

.product13 .product13-brands-section,
.content-section13 .product13-brands-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #f4f4f4;
    gap: 12px
}

.product13 .product13-brands__block,
.content-section13 .product13-brands__block {
    background-color: #fff;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px #0000000a
}

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

    .product13 .product13-brands__block,
    .content-section13 .product13-brands__block {
        padding: 24px 28px
    }
}

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

    .product13 .product13-brands__block,
    .content-section13 .product13-brands__block {
        padding: 32px 20x
    }
}

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

    .product13 .product13-brands__block,
    .content-section13 .product13-brands__block {
        padding: 22px 24px
    }
}

.product13 .product13-brands__block .product13-brands__title,
.content-section13 .product13-brands__block .product13-brands__title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 20px
}

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

    .product13 .product13-brands__block .product13-brands__title,
    .content-section13 .product13-brands__block .product13-brands__title {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 20px;
        margin-left: 0
    }
}

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

    .product13 .product13-brands__block .product13-brands__title,
    .content-section13 .product13-brands__block .product13-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product13 .product13-brands__block .product13-brands__title,
    .content-section13 .product13-brands__block .product13-brands__title {
        font-size: 15px;
        line-height: 22px
    }
}

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

    .product13 .product13-brands__block .product13-brands__title,
    .content-section13 .product13-brands__block .product13-brands__title {
        font-size: 14px;
        line-height: 20px;
        margin-left: 0;
        margin-bottom: 16px
    }
}

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

    .product13 .product13-brands__block,
    .content-section13 .product13-brands__block {
        padding: 22px
    }
}

.product13 .product13-brands__block .product13-brands_border,
.content-section13 .product13-brands__block .product13-brands_border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.product13 .product13-brands__list,
.content-section13 .product13-brands__list {
    display: flex;
    flex-direction: row;
    gap: 22px;
    flex-wrap: wrap
}

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

    .product13 .product13-brands__list,
    .content-section13 .product13-brands__list {
        gap: 20px;
        padding-right: 20px;
        padding-left: 24px
    }
}

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

    .product13 .product13-brands__list,
    .content-section13 .product13-brands__list {
        padding: 0;
        gap: 20px
    }
}

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

    .product13 .product13-brands__list,
    .content-section13 .product13-brands__list {
        gap: 14px;
        padding-right: 20px;
        padding-left: 20px
    }
}

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

    .product13 .product13-brands__list,
    .content-section13 .product13-brands__list {
        padding: 18px 16px 20px 12px
    }
}

.product13 .product13-brands__item img,
.content-section13 .product13-brands__item img {
    transition: filter .2s ease;
    width: auto;
    object-fit: contain
}

.product13 .product13-brands__item:hover img,
.content-section13 .product13-brands__item:hover img {
    filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, .15))
}

@media screen and (width: 1920px) {

    .product13 .product13-brands__item img,
    .content-section13 .product13-brands__item img {
        width: auto;
        height: 80px;
        max-height: 80px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {

    .product13 .product13-brands__item img,
    .content-section13 .product13-brands__item img {
        width: auto;
        height: clamp(62px, 80px - (1920px - 100vw) * 18 / 560, 80px);
        max-height: clamp(62px, 80px - (1920px - 100vw) * 18 / 560, 80px)
    }
}

@media screen and (width: 1360px) {

    .product13 .product13-brands__item img,
    .content-section13 .product13-brands__item img {
        width: auto;
        height: 62px;
        max-height: 62px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {

    .product13 .product13-brands__item img,
    .content-section13 .product13-brands__item img {
        width: auto;
        height: clamp(48px, 62px - (1360px - 100vw) * 14 / 336, 62px);
        max-height: clamp(48px, 62px - (1360px - 100vw) * 14 / 336, 62px)
    }
}

@media screen and (width: 1024px) {

    .product13 .product13-brands__item img,
    .content-section13 .product13-brands__item img {
        width: auto;
        height: 48px;
        max-height: 48px
    }
}

.product13 .category-links__columns,
.content-section13 .category-links__columns {
    display: flex;
    gap: 32px;
    width: 100%;
    padding: 28px 32px
}

.product13 .category-links__columns--three .category-links__column,
.content-section13 .category-links__columns--three .category-links__column,
.product13 .category-links__columns--four .category-links__column,
.content-section13 .category-links__columns--four .category-links__column {
    flex: 1;
    max-width: calc(33.333% - 22px)
}

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

    .product13 .category-links__columns--four .category-links__column,
    .content-section13 .category-links__columns--four .category-links__column {
        max-width: 214px;
        height: 728px
    }
}

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

    .product13 .category-links__columns--four .category-links__column:nth-child(4),
    .content-section13 .category-links__columns--four .category-links__column:nth-child(4) {
        display: none
    }
}

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

    .product13 .category-links__columns,
    .content-section13 .category-links__columns {
        gap: 20px
    }
}

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

    .product13 .category-links__columns,
    .content-section13 .category-links__columns {
        gap: 16px;
        width: 708px;
        height: 999px
    }
}

.product13 .category-links__row,
.content-section13 .category-links__row {
    display: flex;
    flex-direction: row;
    gap: 6px
}

.product13 .category-brands-section,
.content-section13 .category-brands-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.product13 .category-brands__block,
.content-section13 .category-brands__block {
    background-color: #fff;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px #0000000a
}

.product13 .category-brands__block .caregory-brands__title,
.content-section13 .category-brands__block .caregory-brands__title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 20px
}

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

    .product13 .category-brands__block .caregory-brands__title,
    .content-section13 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product13 .category-brands__block .caregory-brands__title,
    .content-section13 .category-brands__block .caregory-brands__title {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product13 .category-brands__block,
    .content-section13 .category-brands__block {
        padding: 4px
    }
}

.product13 .category-brands__block .category-brands_border,
.content-section13 .category-brands__block .category-brands_border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.product13 .category-brands__list,
.content-section13 .category-brands__list {
    display: flex;
    flex-direction: row;
    gap: 24px;
    flex-wrap: wrap
}

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

    .product13 .category-brands__list,
    .content-section13 .category-brands__list {
        gap: 16px
    }
}

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

    .product13 .category-brands__list,
    .content-section13 .category-brands__list {
        gap: 12px;
        padding-bottom: 20px;
        padding-left: 16px
    }
}

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

    .product13 .category-brands__item img,
    .content-section13 .category-brands__item img {
        height: 62px
    }
}

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

    .product13 .category-brands__item img,
    .content-section13 .category-brands__item img {
        height: 48px
    }
}

.product13 .category-links__column,
.content-section13 .category-links__column {
    display: flex;
    flex-direction: column;
    gap: 8px
}

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

    .product13 .category-links__column,
    .content-section13 .category-links__column {
        gap: 2px
    }
}

.product13 .catalog-links__title,
.content-section13 .catalog-links__title {
    color: #4da6cd;
    text-decoration: none;
    font-family: Inter;
    font-weight: 600;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

.product13 .catalog-links__title:first-child,
.content-section13 .catalog-links__title:first-child {
    margin-top: 0
}

.product13 .catalog-links__title:hover,
.content-section13 .catalog-links__title:hover {
    color: #8fc2d8
}

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

    .product13 .catalog-links__title,
    .content-section13 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

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

    .product13 .catalog-links__title,
    .content-section13 .catalog-links__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product13 .category-links__item,
.content-section13 .category-links__item {
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    color: #151514;
    line-height: 32px;
    letter-spacing: 0%;
    text-decoration: none;
    transition: color .2s ease
}

.product13 .category-links__item:hover,
.content-section13 .category-links__item:hover {
    color: #888;
    background: none;
    text-decoration: none
}

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

    .product13 .category-links__item,
    .content-section13 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

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

    .product13 .category-links__item,
    .content-section13 .category-links__item {
        font-size: 14px;
        line-height: 20px
    }
}

.content-section1,
.content-section2,
.content-section3,
.content-section13 {
    display: none
}

.content-section1.active,
.content-section2.active,
.content-section3.active,
.content-section13.active {
    display: block
}

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

    .new-catalog-overlay,
    .new-catalog {
        display: none !important
    }

    .mobile-modal {
        background-color: #f4f4f4
    }

    .mobile-ctg {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 2000;
        display: none;
        overflow: hidden;
        background-color: #f4f4f4
    }

    .mobile-ctg.modal-overlay--visible {
        display: block
    }

    .mobile-ctg__container {
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        padding: 8px;
        background-color: transparent
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__container {
        padding: 6px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__level {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding: 8px;
        display: none;
        flex-direction: column;
        transform: translate(100%);
        transition: transform .3s ease
    }

    .mobile-ctg__level.active {
        display: flex;
        transform: translate(0)
    }

    .mobile-ctg__level.slide-out {
        transform: translate(-100%)
    }

    .mobile-ctg__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background-color: #fff;
        position: relative;
        z-index: 10;
        min-height: 56px;
        padding: 16px 20px;
        border-radius: 12px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__header {
        min-height: 52px;
        padding: 14px 16px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__back {
        background: none;
        border: none;
        padding: 8px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        transition: background-color .2s ease;
        margin-right: 0
    }

    .mobile-ctg__back:hover {
        background-color: #f5f5f5
    }

    .mobile-ctg__close {
        background: none;
        border: none;
        padding: 8px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        transition: background-color .2s ease;
        margin-left: auto;
        min-width: 32px;
        min-height: 32px
    }

    .mobile-ctg__close svg {
        width: 17px;
        height: 16px;
        display: block
    }

    .mobile-ctg__title {
        font-family: Inter;
        font-weight: 600;
        font-size: 20px;
        line-height: 24px;
        color: #151514;
        flex: 1;
        text-align: start;
        padding: 0;
        margin: 0 0 0 8px
    }

    .mobile-ctg__level--discount .mobile-ctg__title {
        color: #4dcc8c
    }

    .mobile-ctg__close {
        cursor: pointer;
        padding: 8px;
        border-radius: 4px;
        transition: background-color .2s ease;
        margin-left: 16px
    }

    .mobile-ctg__close:hover {
        background-color: #f5f5f5
    }

    .mobile-ctg__content {
        flex: 1;
        overflow-y: auto;
        padding: 16px 12px;
        display: flex;
        flex-direction: column;
        background-color: #fff;
        border-radius: 12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg__content {
        padding: 18px 16px
    }
}

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

    .mobile-ctg--brands,
    .mobile-ctg--discount {
        padding: 20px 16px
    }

    .mobile-ctg__item {
        border: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 64px;
        padding: 12px 16px;
        cursor: pointer;
        gap: 14px;
        transition: all .2s ease;
        opacity: 1;
        box-sizing: border-box
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__item {
        height: 58px;
        padding: 10px 14px;
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__item:hover {
        background-color: #f4f4f4;
        border-color: #e0e0e0
    }

    .mobile-ctg__item:active {
        background-color: #e9ecef
    }

    .mobile-ctg__item.active {
        background-color: #f0f8ff;
        border-color: #4da6cd
    }

    .mobile-ctg__item img {
        width: 40px;
        height: 40px;
        object-fit: contain;
        flex-shrink: 0
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg__item img {
        width: 36px;
        height: 36px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg__item img {
        width: calc(36px + 4px*(100vw - 361px)/363px);
        height: calc(36px + 4px*(100vw - 361px)/363px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__item img {
        width: 38px;
        height: 38px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__level--1 .mobile-ctg__item {
        background-color: #fff;
        margin-bottom: 16px;
        height: 64px;
        padding: 12px 14px;
        justify-content: space-between;
        width: 100%;
        box-sizing: border-box;
        border: none
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__level--1 .mobile-ctg__item {
        height: 58px;
        padding: 10px 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__level--1 .mobile-ctg__item:hover {
        background-color: #f4f4f4;
        border-color: #e0e0e0;
        border: 1px solid #e0e0e0;
        border-radius: 12px
    }

    .mobile-ctg__level--1 .mobile-ctg__item:active {
        background-color: #e9ecef
    }

    .mobile-ctg__level--1 .mobile-ctg__item:last-child {
        border-bottom: none
    }

    .mobile-ctg__level--1 .mobile-ctg__item.active {
        background-color: #f0f8ff;
        border-color: #4da6cd
    }

    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item {
        border: 1px solid #e0e0e0;
        border-radius: 12px;
        margin: 8px 16px;
        background-color: #fff;
        width: calc(100% - 32px);
        box-sizing: border-box
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item {
        margin: 6px 12px;
        width: calc(100% - 24px)
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item:hover {
        background-color: #f4f4f4;
        border-color: #4da6cd
    }

    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item:active {
        background-color: #e9ecef
    }

    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item:last-child {
        border-bottom: 1px solid #e0e0e0
    }

    .mobile-ctg__level:not(.mobile-ctg__level--1) .mobile-ctg__item.active {
        background-color: #f0f8ff;
        border-color: #4da6cd
    }

    .mobile-ctg__discount-banners {
        display: flex;
        flex-direction: column;
        gap: 16px
    }

    .mobile-ctg__discount-banners a {
        display: block;
        width: 100%
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg__discount-banners {
        padding: 6px 8px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__discount-banner {
        width: 100%;
        height: 532px;
        border-radius: 16px;
        object-fit: contain
    }

    .mobile-ctg__discount-banner--desktop {
        display: block
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .mobile-ctg__discount-banner--desktop {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__discount-banner--mobile {
        display: none
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .mobile-ctg__discount-banner--mobile {
        display: block
    }
}

@media screen and (max-width: 1023px) and (min-width: 724px) and (max-width: 768px) {
    .mobile-ctg__discount-banner {
        height: 532px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg__discount-banner {
        height: calc(500px + 32 * (100vw - 360px) / 364)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg__discount-banner {
        height: 500px !important;
        min-height: 500px;
        max-height: 500px;
        object-fit: cover
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__brands-section {
        padding: 20px
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__brands-section {
        padding: 16px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__brands-block {
        margin-bottom: 24px
    }

    .mobile-ctg__brands-block:last-child {
        margin-bottom: 0
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__brands-block {
        margin-bottom: 20px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__brands-title {
        font-family: Inter;
        font-weight: 600;
        font-size: 18px;
        color: #151514;
        margin-bottom: 16px;
        text-align: left
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__brands-title {
        font-size: 16px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__brands-list {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        gap: 12px
    }

    .mobile-ctg__brand-item {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__brand-item {
        padding: 6px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__brand-item img {
        max-width: 100%;
        max-height: 50px;
        object-fit: contain
    }

    .mobile-ctg__brands-border {
        height: 1px;
        background-color: #e0e0e0;
        margin: 16px 0
    }

    .mobile-ctg .product13-brands-section {
        width: calc(100% + 24px);
        display: flex;
        flex-direction: column;
        gap: 12px;
        background-color: #f4f4f4;
        padding: 0;
        margin: 0 -12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands-section {
        width: calc(100% + 32px);
        margin: 0 -16px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block {
        background-color: #fff;
        border-radius: 8px;
        padding: 18px
    }

    .mobile-ctg .product13-brands__block:first-of-type {
        margin-bottom: 0
    }

    .mobile-ctg .product13-brands__block:not(:first-of-type) {
        margin-top: 0
    }

    .mobile-ctg .product13-brands__block--no-title,
    .mobile-ctg .product13-brands__block--with-title {
        border-radius: 8px
    }

    .mobile-ctg .product13-brands__title {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: 14px;
        line-height: 28px;
        letter-spacing: 0%;
        color: #888;
        margin-bottom: 20px;
        text-align: left
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__list {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__list {
        gap: 13px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__list {
        gap: calc(10px + 3 * (100vw - 360px) / 364)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__list {
        gap: 10px;
        justify-content: flex-start
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__item {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px;
        border-radius: 8px;
        background-color: #fff;
        overflow: hidden
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__item {
        padding: 0;
        width: fit-content;
        height: fit-content;
        border-radius: 8px
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__item {
        flex: 0 1 auto;
        width: auto;
        max-width: 110px;
        height: 48px;
        min-height: 48px;
        max-height: 48px;
        border-radius: 8px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__item img {
        max-width: 100%;
        max-height: 50px;
        object-fit: contain
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__item img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 50px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__item img {
        height: calc(48px + 2 * (100vw - 360px) / 364);
        min-height: calc(48px + 2 * (100vw - 360px) / 364);
        max-height: calc(48px + 2 * (100vw - 360px) / 364)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__item img {
        width: auto;
        height: 48px !important;
        min-height: 48px;
        max-height: 48px;
        max-width: 100%
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block:first-child .product13-brands__list {
        gap: 12px;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__block:first-child .product13-brands__item img {
        width: auto;
        height: 55px;
        max-height: 55px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands_border {
        height: 1px;
        background-color: #e0e0e0;
        margin: 16px 0
    }

    .mobile-ctg .product13-brands__block--no-title .new-brands-content-items-list {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 20px
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--no-title .new-brands-content-items-list {
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row {
        display: flex;
        width: 100%;
        justify-content: flex-start;
        column-gap: 11px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row {
        column-gap: clamp(4px, 11px - (724px - 100vw) * 7 / 364, 11px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row {
        column-gap: 4px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image {
        display: flex
    }

    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image img {
        width: 100%;
        object-fit: contain;
        display: block;
        transition: filter .2s ease
    }

    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image:hover img {
        filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, .15))
    }

    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image:active img {
        filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .1))
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: 55px;
        gap: 11px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: clamp(48px, 55px - (724px - 100vw) * 7 / 364, 55px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: 48px
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--desktop {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        display: flex;
        height: 55px
    }

    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        height: clamp(48px, 55px - (724px - 100vw) * 7 / 364, 55px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        height: 48px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--mobile {
        display: none;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--mobile {
        display: flex;
        justify-content: center;
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--no-title .mobile-brands-row--mobile {
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--with-title .new-brands-content-items-list {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 16px
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--with-title .new-brands-content-items-list {
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row {
        display: flex;
        width: 100%;
        justify-content: flex-start;
        column-gap: 11px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row {
        column-gap: clamp(4px, 11px - (724px - 100vw) * 7 / 364, 11px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row {
        column-gap: 4px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image {
        display: flex
    }

    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image img {
        width: 100%;
        object-fit: contain;
        display: block;
        transition: filter .2s ease
    }

    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image:hover img {
        filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, .15))
    }

    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image:active img {
        filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .1))
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: 55px;
        gap: 11px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: clamp(48px, 55px - (724px - 100vw) * 7 / 364, 55px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row .new-brands-content-items-list-item-image {
        height: 48px
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--desktop {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        display: flex;
        height: 55px
    }

    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 723px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        height: clamp(48px, 55px - (724px - 100vw) * 7 / 364, 55px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--desktop .new-brands-content-items-list-item-image {
        height: 48px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--mobile {
        display: none;
        justify-content: center
    }
}

@media screen and (max-width: 1023px) and (max-width: 519px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--mobile {
        display: flex;
        justify-content: flex-start;
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg .product13-brands__block--with-title .mobile-brands-row--mobile {
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__item-title {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0%;
        color: #151514;
        flex: 1
    }
}

@media screen and (max-width: 1023px) and (max-width: 360px) {
    .mobile-ctg__item-title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg__item-title {
        font-size: calc(14px + 2px*(100vw - 361px)/363px);
        line-height: calc(20px + 4px*(100vw - 361px)/363px)
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__item-arrow {
        margin-left: 8px;
        flex-shrink: 0;
        display: block;
        width: 9px;
        height: 16px
    }

    .mobile-ctg__item-arrow path {
        fill: #151514
    }

    .mobile-ctg__item[data-category=product1] .mobile-ctg__item-arrow {
        width: 14px;
        height: 14px
    }

    .mobile-ctg__item[data-category=product1] .mobile-ctg__item-arrow path {
        fill: #14b262;
        stroke: #14b262;
        stroke-width: .2
    }

    .mobile-ctg__item[data-subcategory=chrome] .mobile-ctg__item-arrow--chrome {
        display: block
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg__item[data-subcategory=chrome] .mobile-ctg__item-arrow--chrome {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__item[data-subcategory=chrome] .mobile-ctg__item-arrow--chrome-alt {
        display: none;
        width: 15px;
        height: 15px
    }
}

@media screen and (max-width: 1023px) and (max-width: 724px) {
    .mobile-ctg__item[data-subcategory=chrome] .mobile-ctg__item-arrow--chrome-alt {
        display: block
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__banner {
        padding: 16px 20px;
        margin-top: auto;
        margin-left: auto
    }

    .mobile-ctg__banner-link {
        display: block;
        cursor: pointer;
        text-decoration: none;
        transition: opacity .2s ease
    }

    .mobile-ctg__banner-link:hover {
        opacity: .9
    }

    .mobile-ctg__banner-img {
        width: 214px;
        height: 311px;
        border-radius: 20px;
        object-fit: cover;
        display: block
    }

    .mobile-ctg__brands-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px
    }

    .mobile-ctg__brand-item {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 12px;
        border-radius: 8px;
        background-color: #fff;
        border: 1px solid #e0e0e0;
        transition: all .2s ease;
        cursor: pointer
    }

    .mobile-ctg__brand-item:hover {
        border-color: #4da6cd;
        box-shadow: 0 2px 8px #4da6cd26
    }

    .mobile-ctg__brand-item img {
        max-width: 100%;
        max-height: 40px;
        object-fit: contain
    }
}

@media screen and (max-width: 1023px) and (max-width: 600px) {
    .mobile-ctg__brand-item {
        padding: 10px
    }
}

@media screen and (max-width: 1023px) {
    .mobile-ctg__discount-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px
    }

    .mobile-ctg__discount-item {
        position: relative;
        border-radius: 8px;
        overflow: hidden;
        background-color: #fff;
        border: 1px solid #e0e0e0;
        cursor: pointer;
        transition: all .2s ease
    }

    .mobile-ctg__discount-item:hover {
        border-color: #4da6cd;
        box-shadow: 0 4px 12px #4da6cd26
    }

    .mobile-ctg__discount-item img {
        width: 100%;
        height: 120px;
        object-fit: cover
    }

    .mobile-ctg__discount-badge {
        position: absolute;
        top: 8px;
        right: 8px;
        background-color: #f44;
        color: #fff;
        font-family: Inter;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        padding: 4px 8px;
        border-radius: 4px;
        z-index: 2
    }
}

@media screen and (max-width: 1023px) and (max-width: 480px) {
    .mobile-ctg__brands-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px
    }

    .mobile-ctg__discount-grid {
        grid-template-columns: 1fr;
        gap: 12px
    }

    .mobile-ctg__item {
        padding: 12px
    }

    .mobile-ctg__item-icon {
        width: 40px;
        height: 40px;
        object-fit: contain;
        flex-shrink: 0
    }
}

@media screen and (max-width: 1023px) and (max-width: 480px) and (max-width: 360px) {
    .mobile-ctg__item-icon {
        width: 36px;
        height: 36px
    }
}

@media screen and (max-width: 1023px) and (max-width: 480px) and (min-width: 361px) and (max-width: 724px) {
    .mobile-ctg__item-icon {
        width: calc(36px + 4px*(100vw - 361px)/363px);
        height: calc(36px + 4px*(100vw - 361px)/363px)
    }
}

@media screen and (max-width: 1023px) and (max-width: 480px) {
    .mobile-ctg__item-title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) and (min-width: 481px) and (max-width: 768px) {
    .mobile-ctg__brands-grid {
        grid-template-columns: repeat(4, 1fr)
    }

    .mobile-ctg__discount-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.product13-brands__block--no-title .new-brands-content-items-list {
    display: flex;
    flex-direction: column;
    width: 100%
}

.product13-brands__block--no-title .new-brands-content-items-list .brands-row {
    display: flex
}

@media screen and (min-width: 1920px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row {
        gap: 24px
    }
}

@media screen and (min-width: 1360px) and (max-width: 1919px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row {
        gap: 12px
    }
}

@media screen and (min-width: 1024px) and (max-width: 1359px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row {
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row {
        gap: 14px
    }
}

.product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
    display: flex
}

.product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image img {
    width: 100%;
    object-fit: fill
}

@media screen and (width: 1920px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 100px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: clamp(80px, 100px - (1920px - 100vw) * 20 / 560, 100px)
    }
}

@media screen and (width: 1360px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 80px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: clamp(55px, 80px - (1360px - 100vw) * 25 / 336, 80px)
    }
}

@media screen and (width: 1024px) {
    .product13-brands__block--no-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 55px
    }
}

@media screen and (min-width: 1920px) {
    .product13-brands__block--no-title .new-brands-content-items-list {
        gap: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .product13-brands__block--no-title .new-brands-content-items-list {
        gap: clamp(24px, 32px - (1920px - 100vw) * 8 / 560, 32px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .product13-brands__block--no-title .new-brands-content-items-list {
        gap: 24px
    }
}

@media screen and (min-width: 725px) and (max-width: 1024px) {
    .product13-brands__block--no-title .new-brands-content-items-list {
        gap: 20px
    }
}

@media screen and (max-width: 724px) {
    .product13-brands__block--no-title .new-brands-content-items-list {
        gap: 20px
    }
}

.product13-brands__block--with-title .new-brands-content-items-list {
    display: flex;
    flex-direction: column;
    width: 100%
}

.product13-brands__block--with-title .new-brands-content-items-list .brands-row {
    display: flex;
    justify-content: center
}

@media screen and (min-width: 1920px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row {
        gap: 24px
    }
}

@media screen and (min-width: 1360px) and (max-width: 1919px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row {
        gap: 12px
    }
}

@media screen and (min-width: 1024px) and (max-width: 1359px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row {
        gap: 12px
    }
}

@media screen and (max-width: 724px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row {
        gap: 14px;
        justify-content: flex-start
    }
}

.product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
    display: flex
}

.product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image img {
    width: 100%;
    object-fit: fill
}

@media screen and (width: 1920px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 100px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: clamp(80px, 100px - (1920px - 100vw) * 20 / 560, 100px)
    }
}

@media screen and (width: 1360px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 80px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: clamp(55px, 80px - (1360px - 100vw) * 25 / 336, 80px)
    }
}

@media screen and (width: 1024px) {
    .product13-brands__block--with-title .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 55px
    }
}

@media screen and (min-width: 1920px) {
    .product13-brands__block--with-title .new-brands-content-items-list {
        gap: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .product13-brands__block--with-title .new-brands-content-items-list {
        gap: clamp(24px, 32px - (1920px - 100vw) * 8 / 560, 32px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    .product13-brands__block--with-title .new-brands-content-items-list {
        gap: 24px
    }
}

@media screen and (min-width: 725px) and (max-width: 1024px) {
    .product13-brands__block--with-title .new-brands-content-items-list {
        gap: 20px
    }
}

@media screen and (max-width: 724px) {
    .product13-brands__block--with-title .new-brands-content-items-list {
        gap: 20px
    }
}

/* @media screen and (max-width: 1023px) {
    .modal-overlay--basket {
        overflow-y: auto;
        padding-block: 22px;
        align-items: flex-start
    }
}

.basket {
    position: relative;
    width: 920px;
    padding: 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .basket {
        padding: 56px;
        border-radius: 32px;
        width: 1338px
    }
}

@media screen and (max-width: 1359px) {
    .basket {
        min-width: 686px;
        padding: 32px;
        border-radius: 20px
    }
}

@media screen and (max-width: 1023px) {
    .basket {
        min-width: 100%;
        max-width: 100%;
        height: 100%;
        padding: 32px 28px
    }
}

@media screen and (max-width: 723px) {
    .basket {
        padding: 24px 20px
    }
}

.basket-wrapper.container {
    display: flex;
    column-gap: 20px;
    justify-content: center;
    padding: 48px 60px 0
}

@media screen and (min-width: 1920px) {
    .basket-wrapper.container {
        padding: 64px 60px 0;
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket-wrapper.container {
        padding: 48px 31px 0;
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .basket-wrapper.container {
        flex-direction: column;
        gap: 12px;
        padding: 18px 20px 0
    }
}

.basket-list {
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .basket-list {
        gap: 32px
    }
}

.basket-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .basket-header {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .basket-header {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 723px) {
    .basket-header {
        margin-bottom: 32px
    }
}

.basket-header__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .basket-header__title {
        font-size: 36px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .basket-header__title {
        font-size: 24px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .basket-header__title {
        padding-left: 0
    }
}

.basket-footer {
    display: none
}

@media screen and (max-width: 1023px) {
    .basket-footer {
        display: block
    }
}

.basket-total {
    margin-top: 24px
}

@media screen and (max-width: 1359px) {
    .basket-total {
        margin-top: 8px;
        text-align: start
    }
}

@media screen and (max-width: 1023px) {
    .basket-total {
        display: flex;
        justify-content: flex-end;
        margin: 24px 0 8px
    }
}

.basket-total__price {
    display: flex;
    column-gap: 8px;
    align-items: center;
    justify-content: flex-end;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #000
}

@media screen and (min-width: 1920px) {
    .basket-total__price {
        column-gap: 12px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .basket-total__price {
        font-size: 15px;
        line-height: 24px
    }
}

.basket-total__price-value {
    font-weight: 700
}

.basket-actions {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    display: none;
    row-gap: 12px
}

@media screen and (max-width: 1023px) {
    .basket-actions {
        display: flex;
        position: sticky;
        bottom: 0;
        z-index: 5;
        width: 100%
    }
}

.basket-actions .button--sm {
    flex: 1;
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    width: 100%
}

.basket-actions .button--sm:hover {
    padding: 12px
}

.basket-actions .button--sm.button--outline {
    font-weight: 500;
    border: 1px solid #dedede;
    background-color: #fff;
    width: 100%
}

@media screen and (max-width: 723px) {
    .basket-actions .button--sm {
        width: 100%
    }
}

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

    .basket--disabled .basket-total,
    .basket--disabled .basket-actions {
        margin-right: 12px
    }
}

.basket--disabled .product {
    margin-right: 40px
}

@media screen and (max-width: 1023px) {
    .basket--disabled .product {
        margin-right: 12px
    }
}

.basket--disabled .button--filled.button--secondary {
    pointer-events: none;
    background: #dedede;
    width: 100%
}

.basket .container-text {
    padding: 20px 24px
}

@media screen and (max-width: 1359px) {
    .basket .container-text {
        padding: 10px 24px;
        margin: 0
    }
}

@media screen and (max-width: 723px) {
    .basket .container-text {
        padding: 24px 4px
    }
}

.basket .product-section-bundle {
    padding: 24px 32px 18px;
    height: 238px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle {
        padding: 32px 40px 32px 16px;
        min-width: 1226px;
        gap: 40px;
        height: 349px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle {
        padding: 24px 24px 18px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle {
        height: max-content;
        padding: 18px 16px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product-section-bundle .mobile-icon-basket {
        left: 47%
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle .mobile-icon-basket {
        top: 32%
    }
}

.basket .product-section-bundle .product-card {
    padding: 24px 40px 24px 12px;
    gap: 12px;
    min-height: 110px;
    max-height: 110px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .product-card {
        padding: 32px 40px 32px 16px;
        min-width: 529px;
        max-height: 173px;
        min-height: 173px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle .product-card {
        min-width: 279px;
        padding: 20px 16px 20px 12px;
        gap: 8px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product-section-bundle .product-card {
        min-width: 282px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle .product-card {
        padding: 16px 40px 16px 12px;
        min-width: 248px;
        max-height: 94px;
        min-height: 94px
    }
}

.basket .product-section-bundle svg {
    min-width: 28px;
    max-width: 28px;
    min-height: 28px;
    max-height: 28px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle svg {
        min-width: 40px;
        max-width: 40px;
        min-height: 40px;
        max-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle svg {
        min-width: 40px;
        max-width: 40px;
        min-height: 40px;
        max-height: 40px
    }
}

.basket .product-section-bundle .product-image {
    min-width: 68px;
    max-width: 68px;
    min-height: 62px;
    max-height: 62px
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle .bundle-prices {
        flex-direction: column-reverse;
        gap: 0px;
        align-items: flex-end
    }
}

.basket .product-section-bundle .bundle-prices-new {
    font-size: 28px;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .bundle-prices-new {
        font-size: 40px;
        line-height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product-section-bundle .bundle-prices-new {
        font-size: 24px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle .bundle-prices-new {
        font-size: 20px;
        line-height: 28px
    }
}

.basket .product-section-bundle .bundle-prices-old {
    font-size: 18px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .bundle-prices-old {
        font-size: 28px;
        line-height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product-section-bundle .bundle-prices-old {
        line-height: 16px;
        font-size: 16px
    }
}

.basket .product-section-bundle .product-info {
    align-items: flex-start;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .product-info {
        margin-left: 12px;
        gap: 16px
    }
}

.basket .product-section-bundle .bundle-button {
    font-size: 14px;
    line-height: 20px;
    padding: 16px 18px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .bundle-button {
        font-size: 20px;
        line-height: 32px;
        padding: 20px 32px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle .bundle-button {
        padding: 12px 16px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle .bundle-button {
        font-size: 12px;
        line-height: 16px;
        padding: 12px
    }
}

.basket .product-section-bundle .product-prices-new,
.basket .product-section-bundle .product-prices-old {
    font-size: 16px;
    line-height: 24px
}

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

    .basket .product-section-bundle .product-prices-new,
    .basket .product-section-bundle .product-prices-old {
        font-size: 28px;
        line-height: 32px
    }
}

.basket .product-section-bundle .text-sale {
    font-size: 12px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .basket .product-section-bundle .text-sale {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-section-bundle .text-sale {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-section-bundle .product-prices {
        max-height: 24px
    }
}

.basket .bundle-slider {
    margin-bottom: 48px;
    margin-top: 48px
}

@media screen and (min-width: 1920px) {
    .basket .bundle-slider {
        margin-bottom: 88px;
        margin-top: 88px
    }
}

@media screen and (max-width: 1359px) {
    .basket .bundle-slider .swiper-wrapper {
        margin-bottom: 0 !important
    }
}

.basket-empty {
    position: relative;
    width: 504px;
    margin: auto;
    padding: 32px 32px 56px 56px
}

@media screen and (min-width: 1920px) {
    .basket-empty {
        width: 1086px;
        padding: 40px
    }
}

@media screen and (max-width: 1359px) {
    .basket-empty {
        width: 520px;
        padding-right: 24px;
        padding-left: 48px
    }
}

@media screen and (max-width: 1023px) {
    .basket-empty {
        width: 100%;
        height: max-content;
        padding: 24px 24px 32px
    }
}

.basket-empty__text {
    font-weight: 400;
    font-size: 15px;
    line-height: 24px
}

@media screen and (max-width: 1023px) {
    .basket-empty__text {
        width: 85%
    }
} */

.gift-checkout {
    color: #4dcc8c !important;
    font-weight: 700 !important
}

@media screen and (max-width: 1359px) {
    .gift-checkout {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

.container-product-price {
    display: flex;
    align-items: center;
    gap: 36px
}

@media screen and (min-width: 1920px) {
    .container-product-price {
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .container-product-price {
        gap: 24px
    }
}

.favorites {
    position: relative;
    padding: 32px 40px 56px 56px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .favorites {
        padding: 40px
    }
}

@media screen and (max-width: 1024px) {
    .favorites {
        padding: 32px 32px 24px 42px
    }
}

@media screen and (max-width: 768px) {
    .favorites {
        width: 100%;
        height: 100%;
        padding: 24px
    }
}

.favorites-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .favorites-header {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .favorites-header {
        width: 99%;
        margin-bottom: 10px
    }
}

.favorites-header__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .favorites-header__title {
        font-size: 35px;
        line-height: 40px
    }
}

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

@media screen and (max-width: 768px) {
    .favorites-header__title {
        padding-left: 0;
        font-size: 22px;
        line-height: 24px
    }
}

.favorites-footer {
    display: flex;
    justify-content: flex-start;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .favorites-footer {
        margin-top: 32px
    }
}

@media screen and (max-width: 1024px) {
    .favorites-footer {
        margin-top: 16px
    }
}

@media screen and (max-width: 768px) {
    .favorites-footer {
        padding-left: 0
    }
}

.favorites-info-block {
    position: relative;
    max-width: 52%;
    display: flex;
    justify-content: space-between;
    padding: 16px;
    background: #f0f6fb;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .favorites-info-block {
        max-width: max-content;
        padding: 24px
    }

    .favorites-info-block .close-button {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 1024px) {
    .favorites-info-block {
        max-width: 65%
    }

    .favorites-info-block .close-button {
        transform: scale(.6)
    }
}

@media screen and (max-width: 768px) {
    .favorites-info-block {
        max-width: 92%;
        min-width: 92%;
        justify-content: flex-start
    }
}

@media screen and (max-width: 768px) and (min-width: 424px) {
    .favorites-info-block {
        max-width: 100%
    }
}

.favorites-info-block__text {
    max-width: 432px;
    margin-right: auto;
    margin-left: 16px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .favorites-info-block__text {
        max-width: 598px;
        margin: 0 40px 0 24px;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .favorites-info-block__text {
        max-width: 344px;
        margin: 0 16px
    }
}

@media screen and (max-width: 768px) {
    .favorites-info-block__text {
        margin-right: auto;
        margin-left: 8px
    }
}

@media screen and (max-width: 768px) and (min-width: 424px) {
    .favorites-info-block__text {
        max-width: 250px
    }
}

.favorites-info-block__link {
    position: relative;
    color: #58c7f7;
    text-decoration: none
}

@media screen and (max-width: 768px) {
    .favorites-info-block__link {
        text-decoration: underline
    }
}

.favorites-info-block__link:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -1px;
    background: #0b91c7
}

@media screen and (max-width: 768px) {
    .favorites-info-block__link:before {
        content: unset
    }
}

.favorites-info-block .close-button--sm {
    width: 8px;
    height: 8px;
    top: 16px;
    right: 16px
}

.favorites-list {
    max-height: 432px;
    overflow-y: auto
}

@media screen and (min-width: 1920px) {
    .favorites-list {
        max-height: 392px
    }
}

@media screen and (max-width: 768px) {
    .favorites-list {
        max-height: 236px
    }
}

.favorites-list::-webkit-scrollbar {
    width: 5px
}

@media screen and (max-width: 768px) {
    .favorites-list::-webkit-scrollbar {
        width: 2px
    }
}

.favorites-list::-webkit-scrollbar-track {
    background: #7a7d8500
}

.favorites-list::-webkit-scrollbar-thumb {
    background: #0003
}

.favorites .product {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    margin-right: 40px;
    border-bottom: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .favorites .product {
        padding: 16px 0;
        margin-right: 40px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product {
        padding-top: 16px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product {
        padding: 8px 0;
        margin-right: 16px;
        flex-direction: column
    }
}

.favorites .product:first-child {
    padding-top: 0
}

.favorites .product-info {
    display: flex;
    align-items: center;
    column-gap: 48px
}

@media screen and (min-width: 1920px) {
    .favorites .product-info {
        column-gap: 68px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-info {
        column-gap: 38px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-info {
        width: 100%;
        column-gap: 12px
    }
}

.favorites .product-name__title {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .favorites .product-name__title {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-name__title {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-name__title {
        font-size: 15px;
        line-height: 24px
    }
}

.favorites .product-name__description {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .favorites .product-name__description {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-name__description {
        font-size: 10px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-name__description {
        font-size: 12px;
        line-height: 16px
    }
}

.favorites .product-image {
    min-width: 72px;
    min-height: 72px;
    max-width: 72px;
    max-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .favorites .product-image {
        min-width: 82px;
        min-height: 92px;
        max-width: 82px;
        max-height: 92px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-image {
        min-width: 48px;
        min-height: 58px;
        max-width: 48px;
        max-height: 58px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-image {
        min-width: 64px;
        min-height: 72px;
        max-width: 64px;
        max-height: 72px
    }
}

.favorites .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.favorites .product-total {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .favorites .product-total {
        font-size: 22px;
        line-height: 34px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-total {
        font-size: 15px;
        line-height: 24px
    }
}

.favorites .product-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 0;
    min-width: 288px;
    max-width: 288px
}

@media screen and (min-width: 1920px) {
    .favorites .product-price {
        min-width: 424px;
        max-width: 424px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-price {
        min-width: 208px;
        max-width: 208px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-price {
        min-width: 100%;
        max-width: 100%
    }
}

.favorites .product-price__value {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .favorites .product-price__value {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .favorites .product-price__value {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .favorites .product-price__value {
        font-size: 15px;
        line-height: 24px
    }
}

.favorites .product-remove {
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .favorites .product-remove svg {
        width: 24px;
        height: 22px
    }
}

.favorites .card-buy {
    position: relative;
    cursor: pointer
}

@media screen and (max-width: 768px) {
    .favorites .card-buy {
        min-height: 36px;
        min-width: 36px
    }

    .favorites .card-buy--count {
        border-radius: 24px;
        width: max-content
    }

    .favorites .card-buy--count-numb {
        right: 6px
    }
}

.favorites-empty {
    width: 618px;
    margin: auto;
    padding: 32px 24px 56px 56px
}

@media screen and (min-width: 1920px) {
    .favorites-empty {
        padding: 40px;
        width: 1262px
    }
}

@media screen and (max-width: 1024px) {
    .favorites-empty {
        padding-left: 48px;
        padding-bottom: 40px;
        width: 648px
    }
}

@media screen and (max-width: 768px) {
    .favorites-empty {
        width: 100%;
        height: max-content;
        padding: 24px 24px 32px
    }
}

.favorites-empty .favorites-header {
    width: 100%
}

@media screen and (max-width: 1024px) {
    .favorites-empty .favorites-header__title {
        font-size: 20px;
        line-height: 16px
    }
}

.favorites-empty__text {
    color: #151514;
    font-size: 16px;
    line-height: 24px
}

@media screen and (max-width: 1024px) {
    .favorites-empty .favorites-footer {
        margin-top: 24px
    }
}

.favorites-empty .favorites-info-block {
    max-width: unset
}

@media screen and (min-width: 1920px) {
    .favorites-empty .favorites-info-block {
        max-width: max-content;
        margin-top: 0
    }
}

@media screen and (max-width: 1024px) {
    .favorites-empty .favorites-info-block {
        max-width: 78%
    }
}

@media screen and (max-width: 768px) {
    .favorites-empty .favorites-info-block {
        margin-top: 24px;
        max-width: 100%
    }
}

.filters {
    display: flex;
    flex-wrap: wrap;
    column-gap: 16px;
    row-gap: 16px;
    padding: 12px 16px 20px;
    position: relative;
    background: #58c7f6
}

@media screen and (min-width: 1920px) {
    .filters {
        padding: 24px;
        row-gap: 24px;
        column-gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .filters {
        padding: 16px 24px
    }
}

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

.filters .select-field__value {
    position: relative;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 500;
    max-width: 90%
}

@media screen and (min-width: 1920px) {
    .filters .select-field__value {
        font-weight: 400
    }
}

@media screen and (max-width: 768px) {
    .filters .select-field__value {
        font-weight: 400
    }
}

.filters .select-field__list {
    max-height: 320px;
    overflow-y: auto
}

@media screen and (min-width: 1920px) {
    .filters .select-field__list {
        max-height: 455px
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-field__list {
        max-height: 256px
    }
}

@media screen and (min-width: 1920px) {
    .filters .select-field__list-item {
        font-size: 16px
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-field__list-item {
        padding: 8px;
        font-size: 10px;
        line-height: 12px
    }
}

.filters .select-checkbox .select-field__list-item {
    display: block
}

.filters .select-checkbox .select-field__container {
    max-height: 212px;
    overflow-y: auto
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__container {
        max-height: 314px
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-checkbox .select-field__container {
        max-height: 180px
    }
}

.filters .select-checkbox .select-field__buttons {
    padding: 16px 10px
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__buttons {
        padding: 16px 20px 24px
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-checkbox .select-field__buttons {
        padding: 8px 12px 12px
    }
}

.filters .select-checkbox .select-field__buttons .button--full {
    width: 100%;
    padding: 8px 0;
    margin: 0 auto
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__buttons .button--full {
        font-size: 22px;
        line-height: 32px;
        padding: 12px 0
    }
}

.filters .select-checkbox .select-field__buttons .button--full img {
    display: none;
    animation: spin 1.5s infinite linear
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__buttons .button--full img {
        width: 24px;
        height: 24px;
        margin: 4px 0
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-checkbox .select-field__buttons .button--full img {
        width: 16px;
        height: 16px
    }
}

.filters .select-checkbox .select-field__buttons .button--full.select-field__spinner-btn img {
    display: block
}

.filters .select-checkbox .select-field__buttons .button--full.select-field__spinner-btn span {
    display: none
}

.filters .select-checkbox .select-field__buttons .button--disabled {
    width: 100%;
    color: #dedede;
    border: 1px solid #dedede;
    cursor: auto
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__buttons .button--disabled:hover {
        padding: 12px 0
    }
}

.filters .select-checkbox .select-field__reset-btn {
    margin: 16px auto 0;
    padding: 0;
    color: #b6b6b6;
    border-bottom: 1px dashed #b6b6b6;
    font-size: 13px;
    line-height: 16px;
    font-style: normal;
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .filters .select-checkbox .select-field__reset-btn {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .filters .select-checkbox .select-field__reset-btn {
        margin-top: 12px;
        font-size: 10px;
        line-height: 12px
    }
}

.filters-reset {
    width: 100%;
    display: flex;
    justify-content: flex-end
}

.filters-reset__button {
    position: relative;
    border: none;
    background: none;
    border-bottom: 1px dashed #ffffff;
    cursor: pointer;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    .filters-reset__button {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .filters-reset__button {
        right: 8px;
        font-size: 10px;
        line-height: 12px
    }
}

.filters--mobile {
    position: relative
}

.filters--mobile .modal-overlay--active {
    opacity: 1;
    z-index: 10;
    transform: translateY(0)
}

.filters--mobile .close-button {
    cursor: pointer;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 16px;
    right: 16px
}

.filters--mobile .close-button .line {
    background-color: #fff
}

.filters--mobile .filters-wrapper {
    position: fixed;
    left: 0;
    overflow: hidden;
    width: 352px;
    height: 100%
}

@media screen and (max-width: 423px) {
    .filters--mobile .filters-wrapper {
        width: 304px
    }
}

.filters--mobile .filters-modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 15;
    width: 85vw;
    height: 100%;
    padding: 16px;
    background: #58c7f7;
    opacity: 1;
    overflow-y: auto;
    overflow-x: hidden;
    transition: all .25s ease
}

.filters--mobile .filters-modal--parameter {
    position: absolute;
    padding: 0 0 16px;
    transform: translate(100%);
    transition: all .3s ease;
    overflow-y: hidden;
    background: #fff
}

.filters--mobile .filters-modal--parameter.active {
    transform: translate(0);
    transition: all .3s ease
}

.filters--mobile .filters-modal--parameter .modal-header {
    padding: 16px;
    margin: 0;
    border-bottom: 1px solid #ededed
}

.filters--mobile .filters-modal--parameter .filters-modal__header-title {
    display: flex;
    align-items: center;
    column-gap: 12px;
    word-break: break-word;
    color: #151514
}

.filters--mobile .filters-modal--parameter .filters-modal__header-title svg {
    width: 12px;
    height: 24px
}

.filters--mobile .filters-modal--parameter .filters-modal__header-reset {
    display: block;
    color: #888
}

.filters--mobile .filters-modal--parameter .button-wrapper {
    position: absolute;
    bottom: 16px;
    width: 100%;
    padding: 0 16px
}

.filters--mobile .filters-modal--parameter .button {
    width: 100%;
    font-size: 13px;
    line-height: 16px
}

.filters--mobile .filters-modal--parameter .button:hover {
    padding: 12px 0
}

.filters--mobile .filters-modal--parameter .button img {
    animation: spin 1.5s infinite linear
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

.filters--mobile .filters-modal--parameter .button-spinner,
.filters--mobile .filters-modal--parameter .button-spinner:hover {
    padding: 11px 0
}

.filters--mobile .filters-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

.filters--mobile .filters-modal__header-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 24px;
    color: #fff
}

.filters--mobile .filters-modal__header-reset {
    display: none;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #fff
}

.filters--mobile .filters-modal__header-reset--visible {
    display: block
}

.filters--mobile .filters-modal .select {
    min-width: auto;
    max-width: none;
    margin-bottom: 16px
}

@media screen and (max-width: 768px) {
    .filters--mobile .filters-modal .select-field {
        padding: 12px 8px
    }

    .filters--mobile .filters-modal .select-field__value {
        font-size: 12px;
        line-height: 16px;
        position: relative;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-weight: 400
    }

    .filters--mobile .filters-modal .select-field__current {
        align-items: flex-start
    }

    .filters--mobile .filters-modal .select-field__list {
        position: relative;
        opacity: 1;
        z-index: 1;
        top: unset;
        display: flex;
        flex-direction: column;
        row-gap: 8px;
        max-height: 80vh;
        margin-top: 16px;
        overflow-y: auto;
        border-radius: 0;
        box-shadow: none;
        filter: none
    }

    .filters--mobile .filters-modal .select-field__list-item {
        padding: 12px 16px
    }
}

@media screen and (max-width: 768px) and (max-width: 423px) {
    .filters--mobile .filters-modal .select-field__list-item {
        padding: 10px 16px
    }
}

@media screen and (max-width: 768px) {
    .filters--mobile .filters-modal .select-field__list-item.selected {
        font-weight: 500;
        background: #f0f6fb
    }

    .filters--mobile .filters-modal .select-field__icon svg {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 768px) {
    .filters--mobile .filters-modal .select.active .select-field {
        border-radius: 3px 3px 0 0
    }
}

.filters--mobile .filters-modal__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.filters--mobile .filters--mobile__row {
    display: none;
    align-items: center
}

@media screen and (max-width: 768px) {
    .filters--mobile .filters--mobile__row {
        display: flex;
        justify-content: space-between
    }
}

.filters--mobile .filters--mobile__row .filter-modal-button {
    display: flex;
    align-items: center;
    padding: 4px 6px;
    margin-right: 8px;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #fff;
    background: #58c7f6;
    border-radius: 3px
}

.filters--mobile .filters--mobile__row .filter-modal-button img {
    margin-left: 8px
}

.form-group__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .form-group__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .form-group__title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .form-group__title {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (max-width: 723px) {
    .form-group__title {
        font-size: 18px;
        line-height: 24px
    }
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 24px
}

@media screen and (min-width: 1920px) {
    .form-row {
        column-gap: 32px;
        row-gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .form-row {
        column-gap: 12px
    }
}

.auth-modal {
    min-width: 376px;
    max-width: 376px;
    position: relative;
    padding: 24px 24px 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .auth-modal {
        max-width: 472px;
        min-width: 472px
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal {
        min-width: 312px;
        max-width: 312px
    }
}

.auth-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .auth-modal__header {
        margin-bottom: 32px
    }
}

.auth-modal__header-title {
    font-family: Headline Base;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .auth-modal__header-title {
        font-size: 32px;
        line-height: 32px
    }
}

.auth-modal__socials {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .auth-modal__socials {
        margin-bottom: 32px
    }
}

.auth-modal__socials-title {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .auth-modal__socials-title {
        font-size: 20px;
        line-height: 32px
    }
}

.auth-modal__socials-list {
    display: flex;
    column-gap: 8px
}

.auth-modal__socials-list .button-social {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 48px;
    background: #fff;
    border: 1px solid #dedede;
    border-radius: 3px;
    cursor: pointer
}

.auth-modal__socials-list .button-social__text {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #58c7f7;
    margin-left: 8px
}

@media screen and (max-width: 1024px) {
    .auth-modal__socials-list .button-social__text {
        margin-left: 4px;
        font-size: 12px
    }
}

.auth-modal__socials-list .button-social img {
    width: 16px;
    height: 16px
}

@media screen and (max-width: 1024px) {
    .auth-modal__socials-list .button-social img {
        width: 12px;
        height: 12px
    }
}

.auth-modal .or {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .auth-modal .or {
        font-size: 20px;
        line-height: 32px
    }
}

.auth-modal .auth-form {
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

@media screen and (min-width: 1920px) {
    .auth-modal .auth-form {
        row-gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal .auth-form {
        margin-bottom: 24px
    }
}

.auth-modal .auth-form .text-field__container {
    max-width: 100%;
    min-width: 100%
}

.auth-modal .auth-form.login-form {
    margin-bottom: 0
}

.auth-modal .remember-password {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding: 4px 0;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .auth-modal .remember-password {
        padding: 8px 0
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal .remember-password {
        margin-bottom: 24px
    }
}

.auth-modal .remember-password__text {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    text-decoration: none;
    color: #58c7f7
}

@media screen and (min-width: 1920px) {
    .auth-modal .remember-password__text {
        font-size: 20px;
        line-height: 32px
    }
}

.auth-modal .auth-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 8px 0;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    color: #58c7f7;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .auth-modal .auth-link {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal .auth-link {
        font-size: 12px;
        line-height: 16px;
        margin-top: 8px
    }
}

@media screen and (max-width: 768px) {
    .auth-modal .auth-link {
        font-size: 16px;
        line-height: 24px;
        margin-top: 16px
    }
}

.auth-modal .privacy-text {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    margin-top: 24px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .auth-modal .privacy-text {
        font-size: 20px;
        line-height: 32px;
        margin-top: 32px
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal .privacy-text {
        margin-bottom: 24px
    }
}

.auth-modal .privacy-text__link {
    color: #58c7f7;
    text-decoration: none
}

.reviews {
    display: flex;
    flex-direction: column;
    row-gap: 32px;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .reviews {
        row-gap: 40px;
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1359px) {
    .reviews {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .reviews {
        margin-bottom: 40px
    }
}

.reviews--empty .reviews__rate {
    color: #888
}

@media screen and (max-width: 723px) {
    .reviews--empty .reviews__rate svg {
        width: 18px;
        height: 18px
    }
}

.reviews__row {
    display: flex;
    align-items: center;
    column-gap: 32px
}

@media screen and (min-width: 1920px) {
    .reviews__row {
        column-gap: 40px
    }
}

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

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

@media screen and (min-width: 1920px) {
    .reviews__icons {
        column-gap: 16px
    }
}

.reviews__icons svg,
.reviews__icons img {
    width: 24px;
    height: 24px
}

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

    .reviews__icons svg,
    .reviews__icons img {
        width: 32px;
        height: 32px
    }
}

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

    .reviews__icons svg,
    .reviews__icons img {
        width: 18px;
        height: 18px
    }
}

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

    .reviews__icons svg,
    .reviews__icons img {
        width: 14px;
        height: 14px
    }
}

.reviews__rate {
    display: flex;
    align-items: center;
    column-gap: 8px;
    font-size: 14px;
    line-height: 24px;
    color: #494949
}

@media screen and (min-width: 1920px) {
    .reviews__rate {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .reviews__rate {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 724px) {
    .reviews__rate {
        font-size: 12px;
        line-height: 16px
    }
}

.reviews__rate:first-child {
    max-height: 15px;
    padding-right: 12px;
    padding-block: 5px;
    border-right: 1px solid #888
}

@media screen and (min-width: 1920px) {
    .reviews__rate:first-child {
        padding-right: 16px;
        padding-block: 0
    }
}

@media screen and (max-width: 1359px) {
    .reviews__rate:first-child {
        max-height: 12px;
        padding-block: 0
    }
}

.reviews__rate--gray {
    color: #dedede
}

.reviews__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
    line-height: 36px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .reviews__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .reviews__title {
        font-size: 24px;
        line-height: 32px
    }
}

.reviews__actions {
    display: flex;
    align-items: center;
    column-gap: 24px;
    padding: 24px;
    border-radius: 24px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .reviews__actions {
        padding: 40px;
        column-gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .reviews__actions {
        border-radius: 16px;
        padding: 16px;
        column-gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .reviews__actions {
        flex-direction: column-reverse;
        row-gap: 16px;
        align-items: flex-start
    }
}

@media screen and (max-width: 723px) {
    .reviews__actions {
        align-items: center
    }
}

.reviews__actions .button {
    padding: 16px 24px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    color: #fff;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .reviews__actions .button {
        padding: 24px 32px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .reviews__actions .button {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .reviews__actions .button {
        width: max-content
    }
}

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

.reviews__actions .button:hover {
    padding: 16px 24px;
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .reviews__actions .button:hover {
        padding: 24px 32px
    }
}

.reviews__text {
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .reviews__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .reviews__text {
        font-size: 14px;
        line-height: 20px
    }
}

.reviews__text--green {
    font-weight: 600;
    color: #4dcc8c
}

.reviews__button {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    width: 172px;
    height: 56px;
    margin: 0 auto;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #58c7f7;
    border: 1px solid #dedede;
    border-radius: 12px;
    background: none;
    cursor: pointer
}

.reviews__button:hover {
    border: 1px solid #58c7f7;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .reviews__button {
        width: 260px;
        height: 88px;
        column-gap: 16px;
        font-size: 24px;
        line-height: 38px;
        border-width: 2px
    }
}

@media screen and (max-width: 1024px) {
    .reviews__button {
        width: 158px;
        height: 52px;
        font-size: 14px;
        line-height: 20px
    }
}

.reviews__button svg,
.reviews__button img {
    width: 24px;
    height: 24px
}

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

    .reviews__button svg,
    .reviews__button img {
        width: 40px;
        height: 40px
    }
}

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

    .reviews__button svg,
    .reviews__button img {
        width: 20px;
        height: 20px
    }
}

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

    .reviews .reviews__rate--green svg,
    .reviews .reviews__rate--red svg {
        width: 18px;
        height: 18px
    }
}

.reviews .review-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .reviews .review-header {
        margin-bottom: 32px;
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .reviews .review-header {
        margin-bottom: 16px
    }
}

.reviews .review-info {
    display: flex;
    align-items: center
}

.reviews .review-author {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #151514;
    margin-right: 8px
}

@media screen and (min-width: 1920px) {
    .reviews .review-author {
        font-size: 28px;
        line-height: 32px;
        margin-right: 16px
    }
}

@media screen and (max-width: 1024px) {
    .reviews .review-author {
        font-size: 16px;
        line-height: 24px;
        margin-right: 12px
    }
}

@media screen and (max-width: 724px) {
    .reviews .review-author {
        line-height: 20px
    }
}

.reviews .review-rating {
    display: flex;
    align-items: center
}

.reviews .review-rating svg,
.reviews .review-rating img {
    width: 20px;
    height: 20px
}

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

    .reviews .review-rating svg,
    .reviews .review-rating img {
        width: 32px;
        height: 32px
    }
}

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

    .reviews .review-rating svg,
    .reviews .review-rating img {
        width: 18px;
        height: 18px
    }
}

.reviews .review-date {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #494949
}

@media screen and (min-width: 1920px) {
    .reviews .review-date {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1024px) {
    .reviews .review-date {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 724px) {
    .reviews .review-date {
        line-height: 18px
    }
}

.reviews .review-content {
    padding: 24px;
    border: 1px solid #ededed;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .reviews .review-content {
        padding: 40px
    }
}

@media screen and (max-width: 1024px) {
    .reviews .review-content {
        border-radius: 16px;
        padding: 16px
    }
}

.reviews .review-text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

@media screen and (min-width: 1920px) {
    .reviews .review-text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .reviews .review-text {
        font-size: 14px;
        line-height: 20px
    }
}

.reviews .review--seller {
    margin-bottom: 40px
}

.reviews .review--seller .review-author {
    color: #d357c0;
    margin-right: 0
}

.reviews .review--reply .review--client .review-header {
    justify-content: flex-start
}

.reviews .review--reply .review--client .review-content {
    background: #f0f6fb;
    border: none
}

.reviews__count {
    font-size: 14px;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .reviews__count {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .reviews__count {
        font-size: 10px;
        line-height: 14px
    }
}

.gallery-modal {
    padding: 24px;
    background: #fff;
    border-radius: 3px;
    overflow: hidden
}

@media screen and (max-width: 768px) {
    .gallery-modal {
        padding: 64px 0 24px
    }
}

.gallery-modal .modal-header {
    margin-bottom: 0
}

.gallery-modal__thumb {
    position: relative;
    overflow: hidden;
    min-width: max-content;
    padding: 115px 0
}

@media screen and (min-width: 1920px) {
    .gallery-modal__thumb {
        padding: 85px 0
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal__thumb {
        padding: 0
    }
}

.gallery-modal__bg {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 98px;
    cursor: pointer
}

@media screen and (max-width: 768px) {
    .gallery-modal__bg {
        width: 46px;
        height: 46px
    }
}

.gallery-modal__bg--top {
    top: 70px;
    background: linear-gradient(180deg, #fff, #fff 45.83%, #ffffff30 88.54%, #fff0)
}

@media screen and (min-width: 1920px) {
    .gallery-modal__bg--top {
        top: 60px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal__bg--top {
        top: 0;
        left: 0;
        background: linear-gradient(90deg, #fff, #fff 45.83%, #ffffff30 88.54%, #fff0)
    }
}

.gallery-modal__bg--bottom {
    bottom: 80px;
    background: linear-gradient(0deg, #fff, #fff 45.83%, #ffffff30 88.54%, #fff0)
}

@media screen and (min-width: 1920px) {
    .gallery-modal__bg--bottom {
        bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal__bg--bottom {
        right: 0;
        bottom: 0;
        background: linear-gradient(270deg, #fff, #fff 45.83%, #ffffff30 88.54%, #fff0)
    }
}

.gallery-modal__wrapper {
    position: relative;
    overflow: hidden;
    display: flex;
    column-gap: 16px;
    height: 99vh
}

@media screen and (max-width: 768px) {
    .gallery-modal__wrapper {
        flex-direction: column-reverse;
        row-gap: 24px;
        overflow: visible;
        height: 100%
    }
}

.gallery-modal__container {
    display: flex;
    overflow: hidden;
    width: 100%;
    padding: 48px 0 60px
}

@media screen and (max-width: 768px) {
    .gallery-modal__container {
        height: 100%;
        padding: 0 24px
    }
}

.gallery-modal__navigation {
    position: absolute;
    bottom: 0;
    right: 24px;
    display: flex;
    gap: 16px;
    z-index: 2
}

.gallery-modal__button-next,
.gallery-modal__button-prev {
    width: 60px;
    height: 60px;
    cursor: pointer
}

.gallery-modal__button-next:hover circle,
.gallery-modal__button-prev:hover circle {
    stroke: #58c7f7
}

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

    .gallery-modal__button-next,
    .gallery-modal__button-prev {
        display: none
    }
}

.gallery-modal .swiper-gallery-popup {
    width: 100%;
    height: 568px;
    margin: 40px 0
}

@media screen and (max-width: 1024px) {
    .gallery-modal .swiper-gallery-popup {
        height: 352px;
        margin: 40px 0 32px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal .swiper-gallery-popup {
        margin: 48px 0 32px
    }
}

.gallery-modal .swiper-gallery-popup .swiper-slide {
    max-height: 100%
}

.gallery-modal .swiper-gallery-popup .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: pointer
}

.gallery-modal .swiper-thumbs-popup {
    height: 100%;
    min-width: 72px;
    max-width: 72px;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .gallery-modal .swiper-thumbs-popup {
        min-width: 104px;
        max-width: 104px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal .swiper-thumbs-popup {
        max-width: 100vw;
        min-height: 52px
    }
}

.gallery-modal .swiper-thumbs-popup .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    max-width: 72px;
    min-height: 56px;
    max-height: 56px;
    border-radius: 3px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: border-color .25s ease
}

@media screen and (min-width: 1920px) {
    .gallery-modal .swiper-thumbs-popup .swiper-slide {
        min-width: 104px;
        max-width: 104px;
        min-height: 82px;
        max-height: 82px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal .swiper-thumbs-popup .swiper-slide {
        max-height: 46px;
        min-height: 46px;
        min-width: 52px;
        max-width: 52px
    }
}

.gallery-modal .swiper-thumbs-popup .swiper-slide:hover {
    border-color: #dedede
}

.gallery-modal .swiper-thumbs-popup .swiper-slide img {
    width: 64px;
    height: 48px;
    object-fit: contain
}

@media screen and (min-width: 1920px) {
    .gallery-modal .swiper-thumbs-popup .swiper-slide img {
        width: 90px;
        height: 68px
    }
}

@media screen and (max-width: 768px) {
    .gallery-modal .swiper-thumbs-popup .swiper-slide img {
        width: 44px;
        height: 38px
    }
}

.gallery-modal .swiper-thumbs-popup .swiper-slide-thumb-active {
    border-color: #eb606a
}

.gallery-modal .swiper-gallery,
.gallery-modal .swiper-gallery .swiper-slide {
    max-height: 100%
}

.gallery-modal .swiper-gallery .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

@media screen and (max-width: 768px) {
    .gallery-modal .swiper-gallery .swiper-slide img {
        width: 280px
    }
}

.gallery-modal .close-button {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 40px;
    height: 40px;
    z-index: 5
}

@media screen and (max-width: 768px) {
    .gallery-modal .close-button {
        width: 48px;
        height: 48px;
        top: 18px;
        right: 18px
    }
}

.gallery-modal .close-button svg {
    width: 24px;
    height: 24px
}

@media screen and (max-width: 768px) {
    .gallery-modal .close-button svg {
        width: 16px;
        height: 16px
    }
}

.gallery-modal .swiper-slide__text {
    font-size: 15px;
    line-height: 24px;
    color: #151515;
    font-style: normal;
    font-weight: 400;
    margin-top: 24px
}

@media screen and (max-width: 1024px) {
    .gallery-modal .swiper-slide__text {
        font-size: 13px;
        line-height: 16px
    }
}

.section-details {
    padding: 40px 24px
}

@media screen and (max-width: 1023px) {
    .section-details {
        padding: 48px 28px
    }
}

@media screen and (max-width: 723px) {
    .section-details {
        padding: 48px 16px
    }
}

.section-details__wrapper {
    display: flex;
    padding: 40px 24px 48px;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (max-width: 1359px) {
    .section-details__wrapper {
        gap: 24px;
        border-radius: 12px
    }
}

@media screen and (max-width: 723px) {
    .section-details__wrapper {
        padding: 16px 12px 24px
    }
}

.section-details__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-style: normal;
    font-weight: 500;
    line-height: 36px
}

@media screen and (min-width: 1920px) {
    .section-details__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .section-details__title {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .section-details__title {
        font-size: 18px
    }
}

.section-details__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 24px
}

@media screen and (max-width: 1359px) {
    .section-details__content {
        grid-template-columns: 1fr;
        height: 100px;
        overflow: hidden
    }
}

@media screen and (max-width: 723px) {
    .section-details__content {
        height: 200px
    }
}

.section-details__description {
    margin-bottom: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .section-details__description {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1023px) {
    .section-details__description {
        font-size: 12px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .section-details__description {
        font-size: 14px
    }
}

.section-details__block-row {
    padding-right: 24px;
    border-right: 1px solid #dedede
}

@media screen and (max-width: 1359px) {
    .section-details__block-row {
        border-right: unset;
        padding-right: 0
    }
}

.section-details__block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    position: relative
}

@media screen and (max-width: 1359px) {
    .section-details__block {
        gap: 12px
    }
}

.section-details .bg-list {
    height: 40px
}

@media screen and (max-width: 1359px) {
    .section-details .bg-list {
        display: none
    }
}

.section-details .mb-subtitle {
    margin: 40px 0 16px
}

@media screen and (max-width: 1359px) {
    .section-details .mb-subtitle {
        margin: 24px 0 12px
    }
}

.section-details__subtitle {
    font-family: Headline Base;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .section-details__subtitle {
        font-size: 32px;
        line-height: 40px
    }
}

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

.section-details .scrollContainer {
    height: 200px;
    overflow: hidden;
    transition: height .5s ease
}

.section-details .scrollContainer.expanded {
    height: max-content;
    overflow: visible
}

.section-details .section-details__list-item:first-child {
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .section-details__list {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1023px) {
    .section-details__list {
        font-size: 12px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .section-details__list {
        font-size: 14px
    }
}

.section-details__list-item {
    list-style: none
}

.section-details__text {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    height: 120px;
    overflow: hidden
}

@media screen and (max-width: 1359px) {
    .section-details__text {
        font-size: 14px;
        line-height: 20px;
        height: 60px
    }
}

.section-details__text.expanded {
    height: auto;
    overflow: visible
}

.section-details .phone {
    color: #4da6cd;
    font-size: 16px;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-details .phone {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .section-details .phone {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .section-details .phone {
        font-size: 12px;
        line-height: 20px
    }
}

.section-details__read-more {
    color: #4da6cd;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .section-details__read-more {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .section-details__read-more {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .section-details__content.expanded {
        height: auto;
        overflow: visible
    }
}

.scrollable-container {
    max-height: 470px;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

@media screen and (min-width: 1920px) {
    .scrollable-container {
        max-height: 600px
    }
}

@media screen and (max-width: 1023px) {
    .scrollable-container {
        max-height: unset
    }
}

.scrollable-container::-webkit-scrollbar {
    display: none
}

.recommended-products {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px
}

@media screen and (min-width: 1920px) {
    .recommended-products {
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .recommended-products {
        gap: 14px
    }
}

@media screen and (max-width: 1023px) {
    .recommended-products {
        margin-top: 28px;
        width: 100%
    }
}

@media screen and (max-width: 723px) {
    .recommended-products {
        margin-top: 16px
    }
}

.recommended-products .search-no-results {
    order: -1;
    margin-bottom: 0
}

.recommended-products .recommended-title {
    color: #151514;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .recommended-products .recommended-title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .recommended-products .recommended-title {
        font-size: 18px;
        line-height: 20px
    }
}

.recommended-products .recommended-list {
    display: flex;
    align-items: center;
    gap: 18px;
    align-self: stretch;
    flex-wrap: wrap
}

@media screen and (max-width: 1359px) {
    .recommended-products .recommended-list {
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .recommended-products .recommended-list {
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .recommended-products .recommended-list {
        gap: 6px
    }
}

.bg-list {
    width: 100%;
    z-index: 6;
    height: 55px;
    position: absolute;
    left: 0;
    bottom: -30px;
    background: linear-gradient(180deg, #ffffffe6, #fff);
    box-shadow: 0 -20px 30px 1px #fffffff2
}

.card-recommended {
    max-height: 345px;
    min-height: 345px;
    max-width: 265px;
    padding: 8px;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 8px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .card-recommended {
        min-height: 422px;
        min-width: 228px;
        padding: 12px;
        border-radius: 14px;
        gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended {
        gap: 0;
        padding: 8px;
        max-width: 203px;
        max-height: 272px;
        min-height: 272px
    }
}

@media screen and (max-width: 1023px) {
    .card-recommended {
        min-height: 272px;
        max-width: 178px;
        padding: 12px;
        border-radius: 8px
    }
}

.card-recommended .card-image-recommend {
    min-height: max-content;
    margin-bottom: 8px;
    width: 241px;
    height: 181px
}

@media screen and (min-width: 1920px) {
    .card-recommended .card-image-recommend {
        width: 232px;
        min-height: 230px
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-image-recommend {
        width: 188px;
        max-height: 140px
    }
}

.card-recommended .card-image__photo-recommend {
    width: 100%;
    height: 181px;
    border-radius: 4px
}

@media screen and (min-width: 1920px) {
    .card-recommended .card-image__photo-recommend {
        min-width: 203px;
        max-width: 203px;
        height: 181px;
        border-radius: 8px
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-image__photo-recommend {
        min-width: 162px;
        max-width: 162px;
        height: 140px;
        border-radius: 4px
    }
}

.card-recommended .card-info-line-recommended {
    bottom: 44%
}

@media screen and (min-width: 1920px) {
    .card-recommended .card-info-line-recommended {
        bottom: 40%
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-info-line-recommended {
        bottom: 42%
    }
}

.card-recommended .card-info-recommended {
    padding-top: 0
}

@media screen and (min-width: 1920px) {
    .card-recommended .card-info-recommended {
        padding-top: 0
    }
}

.card-recommended .card-info-recommended__title {
    margin-bottom: 4px
}

.card-recommended .card-info-recommended__title a {
    font-size: 14px;
    line-height: 20px
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-info-recommended__title a {
        font-size: 12px;
        margin-top: 8px;
        line-height: 16px;
        max-width: 187px
    }
}

.card-recommended .card-info-recommended__subtitle {
    font-size: 12px;
    line-height: 16px
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-info-recommended__subtitle {
        font-size: 10px;
        line-height: 12px
    }
}

.card-recommended .old-price-recommended {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .card-recommended .old-price-recommended {
        font-size: 14px;
        line-height: 16px;
        top: -20%
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .old-price-recommended {
        font-size: 10px;
        line-height: 12px
    }
}

.card-recommended .price-recommended {
    font-size: 18px;
    line-height: 24px;
    min-width: max-content
}

@media screen and (min-width: 1920px) {
    .card-recommended .price-recommended {
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .price-recommended {
        font-size: 16px;
        line-height: 16px
    }
}

.card-recommended .card-buy-recommended {
    padding: 10px 16px;
    gap: 12px;
    min-height: 36px;
    max-width: 75px;
    width: 75px;
    height: 36px
}

@media screen and (min-width: 1920px) {
    .card-recommended .card-buy-recommended {
        min-width: 107px;
        height: 40px;
        padding: 12px 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .card-buy-recommended {
        max-width: 53px;
        max-height: 28px;
        min-height: 28px
    }
}

.card-recommended .text-button-recommended {
    font-size: 12px;
    line-height: 16px
}

@media screen and (max-width: 1359px) {
    .card-recommended .text-button-recommended {
        font-size: 8px;
        line-height: 12px
    }
}

.card-recommended .label-text-recommended {
    font-size: 10px;
    line-height: 14px
}

@media screen and (max-width: 1359px) {
    .card-recommended .label-text-recommended {
        font-size: 8px;
        line-height: 12px
    }
}

.card-recommended .equipment {
    padding: 0 !important
}

.card-recommended .red-price {
    color: #ff3f5f
}

.card-recommended .equipment-item {
    font-size: 10px !important;
    line-height: 14px !important;
    max-height: 22px !important
}

@media screen and (min-width: 1920px) {
    .card-recommended .equipment-item {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

@media screen and (max-width: 1359px) {
    .card-recommended .equipment-item {
        font-size: 8px !important;
        line-height: 12px !important
    }
}

.card-recommended .equipment-button {
    font-size: 10px;
    line-height: 12px;
    max-height: 24px
}

@media screen and (max-width: 1359px) {
    .card-recommended .equipment-button {
        font-size: 8px;
        line-height: 8px;
        padding: 6px 8px
    }
}

.card-recommended .icon-xs {
    width: 11px;
    height: 11px
}

@media screen and (max-width: 1359px) {
    .card-recommended .icon-xs {
        width: 9px;
        height: 9px
    }
}

.card-recommended .comment-text {
    font-size: 12px;
    line-height: 14px
}

@media screen and (max-width: 1359px) {
    .card-recommended .comment-text {
        font-size: 8px;
        font-weight: 600;
        line-height: 12px
    }
}

.card-recommended .comment-icon {
    width: 16px;
    height: 15px
}

@media screen and (max-width: 1359px) {
    .card-recommended .comment-icon {
        width: 10px;
        height: 10px
    }
}

.container-title {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: gap .3s ease
}

@media screen and (min-width: 1920px) {
    .container-title {
        gap: 8px
    }
}

@media screen and (min-width: 1920px) {
    .container-title:hover {
        gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .container-title:hover {
        gap: 10px
    }
}

@media screen and (max-width: 723px) {
    .container-title svg {
        width: 9px;
        height: 8px
    }
}

.container-title .recommended-title-mobile {
    color: #4da6cd;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .container-title .recommended-title-mobile {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-title .recommended-title-mobile {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .container-title .recommended-title-mobile {
        font-size: 14px;
        line-height: 20px
    }
}

.container-title:hover {
    gap: 12px
}

.icon-title {
    width: 14px;
    height: 12px
}

@media screen and (min-width: 1920px) {
    .icon-title {
        width: 16px;
        height: 14px
    }
}

@media screen and (max-width: 1359px) {
    .icon-title {
        width: 9px;
        height: 8px
    }
}

.container-notification {
    display: flex;
    width: 100%;
    justify-content: center
}

.container-notification .notification {
    display: flex;
    width: 900px;
    padding: 32px 24px 48px 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a
}

@media screen and (min-width: 1920px) {
    .container-notification .notification {
        width: 1400px;
        padding: 48px 38px 56px 48px;
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification {
        width: 780px;
        padding: 24px 24px 32px;
        gap: 28px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .container-notification .notification {
        width: 550px;
        padding: 24px 24px 32px
    }
}

@media screen and (max-width: 723px) {
    .container-notification .notification {
        width: 320px;
        padding: 16px
    }
}

@media screen and (min-width: 1920px) {
    .container-notification .notification .close-button {
        min-width: 32px;
        max-width: 32px;
        min-height: 32px;
        max-height: 32px
    }
}

.container-notification .notification__header {
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: space-between
}

.container-notification .notification__empty {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__empty {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__empty {
        font-size: 12px;
        line-height: 16px
    }
}

.container-notification .notification__title {
    color: #151514;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__title {
        font-size: 20px;
        line-height: 24px
    }
}

.container-notification .notification__body {
    display: flex;
    padding: 16px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 14px;
    align-self: stretch;
    border-radius: 16px;
    border: .5px solid #dedede;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__body {
        padding: 40px 24px;
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__body {
        padding: 16px 12px
    }
}

.container-notification .notification__body-content {
    display: flex;
    padding-right: 13px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    align-self: stretch
}

@media screen and (max-width: 723px) {
    .container-notification .notification__body-content {
        padding-right: 0;
        position: relative;
        min-height: 46px
    }
}

.container-notification .notification__body-content-left {
    display: flex;
    align-items: center;
    gap: 6px
}

.container-notification .notification__body-content-title {
    color: #151514;
    text-align: center;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__body-content-title {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__body-content-title {
        font-size: 16px;
        line-height: 24px
    }
}

.container-notification .notification__body-content-right {
    display: flex;
    align-items: center;
    gap: 12px
}

.container-notification .notification__body-content-right .date {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__body-content-right .date {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__body-content-right .date {
        font-size: 12px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .container-notification .notification__body-content-right .date {
        position: absolute;
        min-width: 110px;
        left: 13px;
        top: 34px
    }
}

.container-notification .notification__body-message {
    display: flex;
    padding: 0 13px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch
}

.container-notification .notification__body-message .text {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__body-message .text {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__body-message .text {
        font-size: 12px;
        line-height: 16px
    }
}

.container-notification .notification__body-message .bonus {
    color: #4dcc8c;
    font-weight: 600
}

.container-notification .notification__body-message .link {
    color: #4da6cd;
    font-weight: 600;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .container-notification .ellipse svg {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .ellipse svg {
        width: 7px;
        height: 7px
    }
}

.container-notification .notification__remove {
    all: unset;
    display: flex;
    padding: 8px;
    align-items: center;
    border-radius: 80px;
    background: #fff;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .container-notification .notification__remove {
        padding: 12px
    }

    .container-notification .notification__remove svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .notification__remove svg {
        width: 10px;
        height: 10px
    }
}

.container-notification .notification__remove:hover {
    background: #dedede
}

.container-notification .close-btn {
    cursor: pointer;
    width: 100%;
    max-height: 60px;
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .container-notification .close-btn {
        padding: 24px 32px;
        border-radius: 24px;
        border: 2px solid #dedede;
        max-height: 86px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .container-notification .close-btn {
        padding: 16px 20px;
        max-height: 52px;
        font-size: 14px;
        line-height: 20px
    }
}

.container-notification .close-btn:hover {
    border: 1px solid #58c7f7
}

.ellipse {
    display: flex
}

.brands-tag-list {
    padding: 16px 40px 48px
}

@media screen and (min-width: 1920px) {
    .brands-tag-list {
        padding: 24px 80px 64px
    }
}

@media screen and (max-width: 1359px) {
    .brands-tag-list {
        padding: 12px 32px 48px
    }
}

@media screen and (max-width: 1023px) {
    .brands-tag-list {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    .brands-tag-list {
        display: none
    }
}

.brands {
    display: flex;
    flex-wrap: wrap;
    column-gap: 16px;
    row-gap: 16px;
    padding-bottom: 48px
}

@media screen and (min-width: 1920px) {
    .brands {
        padding-bottom: 48px
    }
}

@media screen and (max-width: 1024px) {
    .brands {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .brands {
        column-gap: 8px;
        row-gap: 8px;
        padding-bottom: 24px
    }
}

#brand-page .brand-name {
    margin: 40px 0 32px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 32px;
    color: #000
}

#brand-page .brands-header {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    #brand-page .brands-header {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    #brand-page .brands-header {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 768px) {
    #brand-page .filters-row {
        margin-bottom: 16px
    }
}

#brand-page .products-list {
    margin-bottom: 48px
}

@media screen and (min-width: 1920px) {
    #brand-page .products-list {
        margin-top: 40px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .products-list {
        margin: 24px 0 32px
    }
}

@media screen and (max-width: 768px) {
    #brand-page .products-list {
        margin: 16px 0 24px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .page-header {
        padding-bottom: 24px
    }
}

.new-brands-container {
    padding-left: 80px;
    padding-right: 80px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-container {
        padding-left: clamp(40px, 80px - (1920px - 100vw) * 40 / 560, 80px);
        padding-right: clamp(40px, 80px - (1920px - 100vw) * 40 / 560, 80px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-container {
        padding-left: 40px;
        padding-right: 40px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-container {
        padding-left: clamp(32px, 40px - (1360px - 100vw) * 8 / 336, 40px);
        padding-right: clamp(32px, 40px - (1360px - 100vw) * 8 / 336, 40px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-container {
        padding-left: 32px;
        padding-right: 32px
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-container {
        padding-left: clamp(0px, 32px - (1024px - 100vw) * 32 / 224, 32px);
        padding-right: clamp(0px, 32px - (1024px - 100vw) * 32 / 224, 32px)
    }
}

@media screen and (max-width: 800px) {
    .new-brands-container {
        padding-left: 0;
        padding-right: 0
    }
}

.new-brands-container .page-header {
    padding-left: 10px;
    padding-top: 40px
}

@media screen and (min-width: 1920px) {
    .new-brands-container .page-header {
        padding-top: 24px;
        padding-left: 0 !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-container .page-header {
        padding-left: clamp(10px, 10px + (1920px - 100vw) * 6 / 560, 16px);
        padding-top: 24px;
        padding-left: 0 !important
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-container .page-header {
        padding-left: 0;
        padding-top: 12px;
        padding-left: 0 !important
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-container .page-header {
        padding-left: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        padding-top: 12px;
        padding-left: 0
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-container .page-header {
        padding-left: 24px !important;
        padding-top: 16px
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-container .page-header {
        padding-left: 1px !important;
        padding-top: 20px
    }
}

@media screen and (max-width: 800px) {
    .new-brands-container .page-header {
        padding-left: 28px;
        padding-top: 24px
    }
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-container .page-header {
        padding-left: clamp(16px, 28px - (800px - 100vw) * 12 / 440, 28px);
        padding-top: 16px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-container .page-header {
        padding-left: 16px;
        padding-top: 16px
    }
}

@media screen and (min-width: 1920px) {
    .new-brands-container .page-title {
        font-size: 48px;
        line-height: 56px
    }
}

.new-brands-container .breadcrumbs.breadcrumbs-results {
    padding-right: 0 !important;
    padding-left: 0 !important
}

.new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
    font-family: Inter;
    font-weight: 400;
    font-size: 16px;
    color: #888;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 16px !important;
        line-height: 24px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: clamp(10px, 10px + (100vw - 1360px) * 10 / 560, 20px) !important;
        line-height: clamp(14px, 14px + (100vw - 1360px) * 10 / 560, 24px) !important
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a .home-icon {
    width: 20px !important;
    height: 18px !important
}

@media screen and (min-width: 1920px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a .home-icon {
        width: 20px !important;
        height: 18px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a .home-icon {
        width: clamp(16px, 16px + (100vw - 1360px) * 12 / 560, 20px) !important;
        height: clamp(14px, 14px + (100vw - 1360px) * 10 / 560, 18px) !important
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a .home-icon {
        width: 14px !important;
        height: 12px !important
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a .home-icon {
        width: 14px !important;
        height: 12px !important
    }
}

@media screen and (min-width: 1920px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 43px 0 0 !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 43px 0 0 !important
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 48px 0 0 !important
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 40px 0 0 !important
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 24px 0 0 !important;
        font-size: 10px !important;
        line-height: 14px !important
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 24px 0 0 !important
    }
}

@media screen and (max-width: 800px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 16px 0 0 28px !important
    }
}

@media screen and (max-width: 424px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 16px 0 0 16px !important
    }
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 16px !important;
        padding-bottom: 0 !important;
        padding-left: clamp(16px, 28px - (800px - 100vw) * 12 / 440, 28px) !important;
        padding-right: 0 !important
    }
}

@media screen and (max-width: 360px) {
    .new-brands-container .breadcrumbs.breadcrumbs-results {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 16px 0 0 16px !important
    }
}

.new-brands-layout {
    display: flex;
    width: 100%;
    min-height: 1px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-layout {
        min-height: clamp(890px, 890px + (1920px - 100vw) * 250 / 560, 1140px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-layout {
        min-height: 890px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-layout {
        min-height: clamp(711px, 890px - (1360px - 100vw) * 179 / 336, 890px)
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-layout {
        min-height: clamp(647px, 711px - (1024px - 100vw) * 64 / 224, 711px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-layout {
        width: 100%;
        min-height: 711px
    }
}

.new-brands-sidebar {
    width: 448px;
    min-height: 1140px;
    flex-shrink: 0;
    padding-right: 48px;
    border-right: 1px solid #e0e0e0;
    box-sizing: border-box;
    align-self: flex-start
}

@media screen and (max-width: 1920px) {
    .new-brands-sidebar {
        height: 100%
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-sidebar {
        width: clamp(320px, 448px - (1920px - 100vw) * 128 / 560, 448px);
        min-height: clamp(890px, 1140px - (1920px - 100vw) * 250 / 560, 1140px);
        padding-right: clamp(18px, 48px - (1920px - 100vw) * 30 / 560, 48px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-sidebar {
        width: 320px;
        min-height: 890px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-sidebar {
        width: clamp(246px, 320px - (1360px - 100vw) * 74 / 336, 320px);
        min-height: clamp(647px, 890px - (1360px - 100vw) * 243 / 336, 890px);
        padding-right: clamp(18px, 18px + (1360px - 100vw) * 0 / 336, 18px)
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-sidebar {
        width: clamp(180px, 246px - (1024px - 100vw) * 66 / 224, 246px);
        min-height: clamp(647px, 647px - (1024px - 100vw) * 0 / 224, 647px);
        padding-right: clamp(12px, 18px - (1024px - 100vw) * 6 / 224, 18px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-sidebar {
        width: 246px;
        min-height: 647px;
        padding-right: 18px
    }
}

.new-brands-sidebar-content {
    display: flex;
    flex-direction: column;
    gap: 16px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-sidebar-content {
        width: clamp(288px, 400px - (1920px - 100vw) * 112 / 560, 400px);
        gap: clamp(8px, 16px - (1920px - 100vw) * 8 / 560, 16px);
        height: clamp(664px, 1014px - (1920px - 100vw) * 350 / 560, 1014px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-sidebar-content {
        width: 288px;
        gap: 8px;
        height: 664px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-sidebar-content {
        width: clamp(228px, 288px - (1360px - 100vw) * 60 / 336, 288px);
        height: clamp(568px, 664px - (1360px - 100vw) * 96 / 336, 664px);
        gap: 8px
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-sidebar-content {
        width: clamp(164px, 228px - (1024px - 100vw) * 64 / 224, 228px);
        height: clamp(568px, 568px - (1024px - 100vw) * 0 / 224, 568px);
        gap: 8px
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-sidebar-content {
        width: 228px;
        height: 568px;
        gap: 8px
    }
}

.new-brands-content {
    flex: 1;
    flex-direction: column;
    width: 100%;
    min-height: 711px
}

@media screen and (width: 1920px) {
    .new-brands-content {
        height: 1252px;
        padding-bottom: 88px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content {
        min-height: clamp(890px, 1014px - (1920px - 100vw) * 124 / 560, 1014px);
        padding-bottom: 62px
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content {
        min-height: 890px;
        padding-bottom: 48px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-content {
        min-height: clamp(647px, 890px - (1360px - 100vw) * 243 / 336, 890px);
        padding-bottom: 50px
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-content {
        min-height: clamp(647px, 647px - (1024px - 100vw) * 0 / 224, 647px);
        padding-bottom: 54px
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content {
        min-height: 647px;
        padding-bottom: 56px
    }
}

.new-brands-sidebar-content-item {
    width: 400px;
    height: 68px;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    text-decoration: none;
    cursor: pointer
}

.new-brands-sidebar-content-item:hover {
    border: 1px solid #e0e0e0;
    border-radius: 16px
}

.new-brands-sidebar-content-item:active {
    background-color: #f4f4f4;
    border: none;
    border-radius: 16px
}

.new-brands-sidebar-content-item--active {
    background-color: #f4f4f4;
    border: 1px solid #e0e0e0;
    border-radius: 16px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-sidebar-content-item {
        width: clamp(288px, 400px - (1920px - 100vw) * 112 / 560, 400px);
        height: 68px;
        padding: 16px
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-sidebar-content-item {
        width: 288px;
        height: 68px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-sidebar-content-item {
        width: clamp(228px, 288px - (1360px - 100vw) * 60 / 336, 288px);
        height: clamp(40px, 68px - (1360px - 100vw) * 28 / 336, 68px);
        padding: clamp(10px, 16px - (1360px - 100vw) * 6 / 336, 16px)
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-sidebar-content-item {
        width: clamp(164px, 228px - (1024px - 100vw) * 64 / 224, 228px);
        height: 40px;
        padding: 10px
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-sidebar-content-item {
        width: 228px;
        height: 40px;
        padding: 10px
    }
}

.new-brands-sidebar-content-item-title {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #494949
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-sidebar-content-item-title {
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 36px - (1920px - 100vw) * 12 / 560, 36px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-sidebar-content-item-title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-sidebar-content-item-title {
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-sidebar-content-item-title {
        font-size: 14px;
        line-height: 20px
    }
}

.new-brands-sidebar-content-item-title-count {
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #888
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-sidebar-content-item-title-count {
        font-family: Inter;
        font-weight: 500;
        font-style: Medium;
        font-size: clamp(14px, 24px - (1920px - 100vw) * 10 / 560, 24px);
        leading-trim: NONE;
        line-height: clamp(24px, 36px - (1920px - 100vw) * 12 / 560, 36px);
        letter-spacing: 0%;
        vertical-align: middle
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-sidebar-content-item-title-count {
        font-family: Inter;
        font-weight: 500;
        font-style: Medium;
        font-size: 14px;
        leading-trim: NONE;
        line-height: 24px;
        letter-spacing: 0%;
        vertical-align: middle
    }
}

.new-brands-content-items {
    padding-left: 48px;
    width: 100%;
    box-sizing: border-box;
    min-height: 1014px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content-items {
        padding-left: clamp(32px, 48px - (1920px - 100vw) * 16 / 560, 48px);
        min-height: clamp(890px, 1014px - (1920px - 100vw) * 124 / 560, 1014px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content-items {
        padding-left: 32px;
        width: calc(100% - 32px);
        min-height: 890px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-content-items {
        padding-left: clamp(18px, 32px - (1360px - 100vw) * 14 / 336, 32px);
        min-height: clamp(647px, 890px - (1360px - 100vw) * 243 / 336, 890px)
    }
}

@media screen and (min-width: 801px) and (max-width: 1023px) {
    .new-brands-content-items {
        padding-left: clamp(12px, 18px - (1024px - 100vw) * 6 / 224, 18px);
        min-height: clamp(647px, 647px - (1024px - 100vw) * 0 / 224, 647px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content-items {
        padding-left: 18px;
        min-height: 647px
    }
}

.new-brands-content-items-search-wrapper {
    position: relative;
    width: 100%;
    max-width: 1264px;
    margin-bottom: 40px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content-items-search-wrapper {
        max-width: clamp(928px, 1264px - (1920px - 100vw) * 336 / 560, 1264px);
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content-items-search-wrapper {
        max-width: 928px;
        margin-bottom: 40px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-content-items-search-wrapper {
        max-width: 100%;
        margin-bottom: clamp(28px, 40px - (1360px - 100vw) * 12 / 336, 40px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content-items-search-wrapper {
        max-width: 100%;
        margin-bottom: 28px
    }
}

.new-brands-content-items-search {
    width: 100%;
    height: 76px;
    padding: 20px 56px 20px 24px;
    border-radius: 16px;
    border: 2px solid #e0e0e0;
    box-sizing: border-box;
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #494949;
    box-shadow: 0 0 24px #0000001a
}

.new-brands-content-items-search::placeholder {
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #888;
    box-sizing: border-box
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content-items-search::placeholder {
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 36px - (1920px - 100vw) * 12 / 560, 36px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content-items-search::placeholder {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-content-items-search::placeholder {
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content-items-search::placeholder {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content-items-search {
        height: clamp(52px, 76px - (1920px - 100vw) * 24 / 560, 76px);
        padding: clamp(14px, 20px - (1920px - 100vw) * 6 / 560, 20px) clamp(48px, 56px - (1920px - 100vw) * 8 / 560, 56px) clamp(14px, 20px - (1920px - 100vw) * 6 / 560, 20px) clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        border-radius: clamp(12px, 16px - (1920px - 100vw) * 4 / 560, 16px);
        border-width: clamp(1px, 2px - (1920px - 100vw) * 1 / 560, 2px);
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 36px - (1920px - 100vw) * 12 / 560, 36px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content-items-search {
        height: 52px;
        padding: 14px 48px 14px 16px;
        border-radius: 12px;
        border-width: 1px;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    .new-brands-content-items-search {
        height: clamp(48px, 52px - (1360px - 100vw) * 4 / 336, 52px);
        padding: 14px 48px 14px 16px;
        border-radius: 12px;
        border-width: 1px;
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px)
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content-items-search {
        height: 48px;
        padding: 14px 48px 14px 16px;
        border-radius: 12px;
        border-width: 1px;
        font-size: 14px;
        line-height: 20px
    }
}

.new-brands-content-items-search-icon {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    width: 19px;
    height: 19px;
    pointer-events: none
}

@media screen and (min-width: 1920px) {
    .new-brands-content-items-search-icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .new-brands-content-items-search-icon {
        width: clamp(19px, 28px - (1920px - 100vw) * 9 / 560, 28px);
        height: clamp(19px, 28px - (1920px - 100vw) * 9 / 560, 28px);
        right: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px)
    }
}

@media screen and (max-width: 1360px) {
    .new-brands-content-items-search-icon {
        right: 16px
    }
}

@media screen and (max-width: 1024px) {
    .new-brands-content-items-search-icon {
        right: 16px
    }
}

.new-brands-content-items-list {
    display: flex;
    flex-direction: column;
    width: 100%
}

.new-brands-content-items-list .brands-row {
    display: flex;
    justify-content: space-around
}

@media screen and (min-width: 1920px) {
    .new-brands-content-items-list .brands-row {
        gap: 24px
    }
}

@media screen and (min-width: 1360px) and (max-width: 1919px) {
    .new-brands-content-items-list .brands-row {
        gap: 12px
    }
}

@media screen and (min-width: 1024px) and (max-width: 1359px) {
    .new-brands-content-items-list .brands-row {
        gap: 14px
    }
}

@media screen and (max-width: 1023px) {
    .new-brands-content-items-list .brands-row {
        gap: 14px
    }
}

.new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
    display: flex
}

.new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image img {
    width: 100%;
    object-fit: fill
}

@media screen and (width: 1920px) {
    .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 100px
    }
}

@media screen and (width: 1360px) {
    .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 80px
    }
}

@media screen and (width: 1024px) {
    .new-brands-content-items-list .brands-row .new-brands-content-items-list-item-image {
        height: 55px
    }
}

@media screen and (min-width: 1920px) {
    .new-brands-content-items-list {
        gap: 32px
    }
}

@media screen and (min-width: 1360px) and (max-width: 1919px) {
    .new-brands-content-items-list {
        gap: 24px
    }
}

@media screen and (min-width: 1024px) and (max-width: 1359px) {
    .new-brands-content-items-list {
        gap: 20px
    }
}

@media screen and (min-width: 424px) and (max-width: 1023px) {
    .new-brands-content-items-list {
        gap: 20px
    }
}

@media screen and (max-width: 423px) {
    .new-brands-content-items-list {
        gap: 20px
    }
}

.new-brands-mobile {
    display: none
}

@media screen and (max-width: 800px) {
    .new-brands-mobile {
        display: block;
        padding: 0 28px
    }
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-mobile {
        padding: 0 clamp(16px, 28px - (800px - 100vw) * 12 / 440, 28px)
    }
}

@media screen and (max-width: 800px) {
    .new-brands-layout {
        display: none
    }
}

.new-brands-mobile-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    position: relative;
    margin-bottom: 18px
}

@media screen and (max-width: 519px) {
    .new-brands-mobile-header {
        flex-direction: column
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-header {
        flex-direction: column
    }
}

.new-brands-mobile-categories-button {
    width: 157px;
    height: 52px;
    gap: 12px;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #f4f4f4;
    border: 1px solid #e0e0e0;
    cursor: pointer;
    flex-shrink: 0;
    box-sizing: border-box;
    white-space: nowrap;
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #151514
}

.new-brands-mobile-categories-button:active {
    background-color: #e8e8e8
}

.new-brands-mobile-categories-button svg {
    width: 13px;
    height: 8px;
    flex-shrink: 0
}

@media screen and (min-width: 361px) and (max-width: 519px) {
    .new-brands-mobile-categories-button {
        width: 100%;
        height: 52px;
        border-radius: 12px;
        padding: 16px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-categories-button {
        width: 328px;
        height: 52px;
        border-radius: 12px;
        padding: 16px
    }
}

.new-brands-mobile-search-panel {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center
}

@media screen and (max-width: 519px) {
    .new-brands-mobile-search-panel {
        width: 100%;
        flex: none
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-search-panel {
        width: 328px
    }
}

.new-brands-mobile-search-input {
    width: 100%;
    height: 52px;
    background-color: #fff;
    border: 1px solid #dedede;
    box-shadow: 0 0 24px #0000001a;
    padding: 14px 48px 14px 16px;
    border-radius: 12px;
    box-sizing: border-box;
    font-family: Inter;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #494949
}

.new-brands-mobile-search-input::placeholder {
    font-family: Inter;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #888
}

@media screen and (min-width: 361px) and (max-width: 519px) {
    .new-brands-mobile-search-input {
        width: 100%;
        height: 52px;
        border-radius: 12px;
        padding: 14px 48px 14px 16px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-search-input {
        width: 328px;
        height: 52px;
        border-radius: 12px;
        padding: 16px 48px 16px 16px
    }
}

.new-brands-mobile-search-icon {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 19px;
    height: 19px;
    pointer-events: none
}

.new-brands-mobile-categories-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0009;
    opacity: 0;
    visibility: hidden;
    z-index: 999;
    pointer-events: none;
    display: block !important;
    transition: opacity .3s ease, visibility .3s ease
}

.new-brands-mobile-categories-overlay--active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

.new-brands-mobile-categories-panel {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translate(-50%) translateY(100%);
    width: 800px;
    height: 492px;
    background: #fff;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    box-shadow: 0 -4px 24px #0000001a;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
    z-index: 1000;
    padding: 24px 28px;
    box-sizing: border-box;
    overflow-y: auto;
    display: block !important
}

.new-brands-mobile-categories-panel--active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%) translateY(0)
}

@media screen and (max-width: 800px) {
    .new-brands-mobile-categories-panel {
        width: 100%;
        left: 0;
        transform: translateY(100%)
    }

    .new-brands-mobile-categories-panel--active {
        transform: translateY(0)
    }
}

@media screen and (min-width: 521px) and (max-width: 799px) {
    .new-brands-mobile-categories-panel {
        padding: clamp(16px, 24px - (800px - 100vw) * 8 / 280, 24px) clamp(16px, 28px - (800px - 100vw) * 12 / 280, 28px);
        height: clamp(492px, 492px + (800px - 100vw) * 58 / 280, 550px);
        border-top-left-radius: clamp(8px, 16px - (800px - 100vw) * 8 / 280, 16px);
        border-top-right-radius: clamp(8px, 16px - (800px - 100vw) * 8 / 280, 16px)
    }
}

@media screen and (min-width: 361px) and (max-width: 519px) {
    .new-brands-mobile-categories-panel {
        padding: 16px;
        height: 550px;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-categories-panel {
        padding: 16px;
        height: 550px;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px
    }
}

.new-brands-mobile-categories-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    row-gap: 10px;
    column-gap: 10px;
    align-content: flex-start;
    width: 100%
}

@media screen and (max-width: 519px) {
    .new-brands-mobile-categories-content {
        flex-direction: column;
        row-gap: 10px;
        column-gap: 0;
        align-items: center
    }
}

.new-brands-mobile-categories-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 329px;
    height: 52px;
    gap: 6px;
    border-radius: 8px;
    border: .8px solid #dedede;
    padding: 16px;
    text-decoration: none;
    position: relative
}

.new-brands-mobile-categories-item:hover,
.new-brands-mobile-categories-item--active {
    background-color: #f4f4f4
}

@media screen and (min-width: 521px) and (max-width: 799px) {
    .new-brands-mobile-categories-item {
        width: clamp(328px, 329px - (800px - 100vw) * 1 / 280, 329px);
        height: clamp(44px, 52px - (800px - 100vw) * 8 / 280, 52px);
        border-width: clamp(.5px, .8px - (800px - 100vw) * .3 / 280, .8px)
    }
}

@media screen and (min-width: 361px) and (max-width: 519px) {
    .new-brands-mobile-categories-item {
        padding: 16px;
        width: 100%;
        height: 44px;
        gap: 6px;
        border-radius: 8px;
        border-width: .5px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-categories-item {
        padding: 16px;
        width: 328px;
        height: 44px;
        gap: 6px;
        border-radius: 8px;
        border-width: .5px
    }
}

.new-brands-mobile-categories-item-title {
    flex: 1
}

.new-brands-mobile-categories-item-count {
    margin-left: auto;
    margin-right: 6px
}

.new-brands-mobile-categories-item-check {
    display: none;
    flex-shrink: 0;
    width: 15px;
    height: 11px;
    margin-left: auto
}

.new-brands-mobile-categories-item--selected .new-brands-mobile-categories-item-check {
    display: block
}

.new-brands-mobile-categories-close {
    margin-top: 22px;
    width: 668px;
    height: 60px;
    gap: 8px;
    padding: 20px 8px;
    border-radius: 12px;
    background-color: #58c7f7;
    color: #fff;
    border: none;
    font-family: Inter;
    font-weight: 700;
    font-style: Bold;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    cursor: pointer
}

.new-brands-mobile-categories-close:active {
    background-color: #4db8e0
}

@media screen and (min-width: 521px) and (max-width: 799px) {
    .new-brands-mobile-categories-close {
        width: clamp(328px, 668px - (800px - 100vw) * 340 / 280, 668px);
        height: clamp(52px, 60px - (800px - 100vw) * 8 / 280, 60px);
        border-radius: clamp(8px, 12px - (800px - 100vw) * 4 / 280, 12px)
    }
}

@media screen and (min-width: 361px) and (max-width: 519px) {
    .new-brands-mobile-categories-close {
        width: 100%;
        max-width: 328px;
        height: 52px;
        gap: 8px;
        border-radius: 8px
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-categories-close {
        width: 328px;
        height: 52px;
        gap: 8px;
        border-radius: 8px
    }
}

.new-brands-mobile-categories-item-title {
    font-family: Inter;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    color: #494949
}

.new-brands-mobile-categories-item-count {
    font-family: Inter;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #888
}

.new-brands-mobile-divider {
    width: 100%;
    height: 1px;
    background: #e0e0e0;
    margin-bottom: 28px
}

.new-brands-mobile-brands-list {
    width: 100%
}

.new-brands-mobile-brands-list-item {
    display: flex;
    flex-direction: column;
    width: 100%;
    row-gap: 20px;
    margin-bottom: 56px
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-mobile-brands-list-item {
        row-gap: clamp(12px, 20px - (800px - 100vw) * 8 / 440, 20px)
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-brands-list-item {
        row-gap: 12px
    }
}

.new-brands-mobile-brands-list-item .mobile-brands-row {
    display: flex;
    width: 100%;
    justify-content: space-around;
    column-gap: 11px
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-mobile-brands-list-item .mobile-brands-row {
        column-gap: clamp(4px, 11px - (800px - 100vw) * 7 / 440, 11px)
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-brands-list-item .mobile-brands-row {
        column-gap: 4px
    }
}

.new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image {
    display: flex
}

.new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image img {
    width: 100%;
    object-fit: contain;
    display: block;
    transition: filter .2s ease
}

.new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image:hover img {
    filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, .15))
}

.new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image:active img {
    filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .1))
}

@media screen and (min-width: 361px) and (max-width: 799px) {
    .new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image {
        height: clamp(48px, 55px - (800px - 100vw) * 7 / 440, 55px)
    }
}

@media screen and (max-width: 360px) {
    .new-brands-mobile-brands-list-item .mobile-brands-row .new-brands-content-items-list-item-image {
        height: 48px
    }
}

@media screen and (max-width: 768px) {
    .products-container {
        position: relative;
        overflow-x: hidden
    }

    .products-container .section-watching {
        padding-bottom: 0
    }

    .products-container .section-watching .cards-list {
        overflow-x: hidden;
        display: flex;
        column-gap: 8px
    }
}

.products-container__sort {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    align-items: flex-start
}

@media screen and (min-width: 1920px) {
    .products-container__sort {
        gap: 38px
    }
}

@media screen and (max-width: 1024px) {
    .products-container__sort {
        gap: 30px
    }
}

.products-container__sort .sort-desktop {
    margin: 16px 0 16px auto
}

@media screen and (min-width: 1920px) {
    .products-container__sort .sort-desktop {
        margin: 40px 0 40px auto
    }
}

@media screen and (max-width: 1359px) {
    .products-container__sort .sort-desktop {
        margin: 24px 0 8px auto
    }
}

@media screen and (min-width: 1920px) {
    .products-container .breadcrumbs {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    .products-container .breadcrumbs {
        margin-bottom: 12px
    }
}

@media screen and (max-width: 768px) {
    .products-container .breadcrumbs {
        margin: 32px 0 16px
    }
}

.products-container .page-header {
    padding-bottom: 16px;
    padding-top: 0;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .products-container .page-header {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    .products-container .page-header {
        padding-bottom: 12px
    }
}

@media screen and (max-width: 768px) {
    .products-container .page-header {
        padding-bottom: 16px;
        flex-direction: column-reverse;
        align-items: flex-start;
        justify-content: flex-start;
        row-gap: 8px
    }
}

.products-container .page-header__info {
    min-width: max-content;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #b6b6b6
}

@media screen and (min-width: 1920px) {
    .products-container .page-header__info {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 768px) {
    .products-container .page-header__info {
        font-size: 12px;
        line-height: 16px
    }
}

.products-header {
    padding: 24px 0 32px
}

.products-list {
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 24px
}

@media screen and (min-width: 1920px) {
    .products-list {
        column-gap: 22px;
        row-gap: 24px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .products-list {
        column-gap: 12px;
        row-gap: 12px;
        margin-top: 16px
    }
}

@media screen and (max-width: 768px) {
    .products-list {
        column-gap: 8px;
        row-gap: 8px
    }
}

.products-list .card {
    width: 100%;
    height: 100%
}

.section-watching .faq-block {
    padding: 32px 40px 40px 32px;
    margin-top: 32px;
    margin-bottom: 32px;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 2px 8px -1px #372f321a, 0 0 2px #f3f3f3
}

@media screen and (min-width: 1920px) {
    .section-watching .faq-block {
        padding: 48px;
        margin-top: 40px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .section-watching .faq-block {
        padding: 24px;
        margin-top: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .section-watching .faq-block {
        padding: 32px 16px 40px;
        margin-bottom: 16px
    }
}

.section-watching .faq {
    margin: 0
}

.section-watching .faq .product-page__title {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .section-watching .faq .product-page__title {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .section-watching .faq .product-page__title {
        margin-bottom: 16px
    }
}

.new-price {
    color: var(--Text-Red-main, #ff3f5f)
}

.popular-container-card {
    display: flex;
    width: 100%;
    height: 149px;
    padding: 24px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 16px;
    border: .5px solid #dedede;
    background: #f4f4f4
}

.popular-container-card img {
    height: 65px
}

.popular-container-card .text-card {
    color: #151514;
    text-align: center;
    font-family: Headline Base;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px
}

.price-mob {
    flex-direction: unset !important
}

.products-list-results {
    display: grid;
    gap: 32px 24px;
    padding: 0 40px;
    box-sizing: border-box;
    grid-template-columns: repeat(2, 1fr)
}

@media screen and (min-width: 1920px) {
    .products-list-results {
        padding: 0 80px;
        gap: 56px 40px
    }
}

@media screen and (max-width: 1359px) {
    .products-list-results {
        padding: 0 32px;
        margin-top: 0;
        gap: 32px 16px
    }
}

@media screen and (max-width: 1023px) {
    .products-list-results {
        padding: 0 28px;
        gap: 12px;
        gap: 18px 12px
    }
}

@media screen and (max-width: 723px) {
    .products-list-results {
        padding: 0 16px
    }
}

@media screen and (min-width: 583px) {
    .products-list-results {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media screen and (min-width: 724px) {
    .products-list-results {
        grid-template-columns: repeat(4, 1fr)
    }
}

@media screen and (min-width: 1686px) {
    .products-list-results {
        grid-template-columns: repeat(5, 1fr)
    }
}

@media screen and (min-width: 1920px) {
    .products-list-results {
        grid-template-columns: repeat(4, 1fr)
    }
}

@media screen and (min-width: 2370px) {
    .products-list-results {
        grid-template-columns: repeat(5, 1fr)
    }
}

.products-list-results .card {
    width: 100%;
    min-width: 158px
}

@media screen and (max-width: 1023px) {
    .products-list-results .card {
        min-height: 272px !important;
        max-height: 272px !important
    }
}

.products-list-results .banner-container {
    grid-column: span 2;
    border-radius: 12px;
    border: 1px solid #ebebeb;
    padding-top: 0;
    height: 422px
}

@media screen and (min-width: 1920px) {
    .products-list-results .banner-container {
        height: 569px
    }
}

@media screen and (max-width: 1359px) {
    .products-list-results .banner-container {
        height: 345px
    }
}

@media screen and (max-width: 1023px) {
    .products-list-results .banner-container {
        height: 272px
    }
}

@media screen and (max-width: 582px) {
    .products-list-results .banner-container {
        grid-column: span 2
    }
}

@media screen and (min-width: 583px) and (max-width: 723px) {
    .products-list-results .banner-container {
        grid-column: span 2
    }
}

@media screen and (min-width: 724px) {
    .products-list-results .banner-container {
        grid-column: span 2
    }
}

.products-list-results .banner-container img {
    width: 100%;
    display: block;
    object-fit: cover;
    border-radius: 8px
}

.select-brend-icon {
    width: 26px;
    height: 14px
}

@media screen and (max-width: 1359px) {
    .select-brend-icon {
        width: 22px;
        height: 12px
    }
}

.option-item-label {
    padding: 0
}

.option-item-label:hover {
    border: 1px solid transparent
}

.filter-line {
    margin-bottom: 20px
}

.filter-line svg {
    width: 262px
}

@media screen and (min-width: 1920px) {
    .filter-line svg {
        width: 100%
    }
}

.options {
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .options {
        gap: 0px
    }
}

@media screen and (max-width: 1359px) {
    .options {
        gap: 4px
    }
}

.products-list-found,
.container-sort-block-found {
    margin-bottom: 48px
}

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

    .products-list-found,
    .container-sort-block-found {
        margin-bottom: 64px
    }
}

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

    .products-list-found,
    .container-sort-block-found {
        margin-bottom: 24px !important
    }
}

@media screen and (min-width: 1920px) {
    .products-list-found {
        margin-bottom: 88px
    }
}

.container-sort-block-with-subcategories {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .container-sort-block-with-subcategories {
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    .container-sort-block-with-subcategories {
        gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .container-sort-block-with-subcategories {
        gap: 11px
    }
}

@media screen and (max-width: 723px) {
    .container-sort-block-with-subcategories {
        gap: 16px
    }
}

.container-sort-block-with-subcategories .container-title {
    width: 100%;
    justify-content: space-between
}

.select-options-results {
    display: flex;
    padding: 12px 24px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 80px;
    border: 1.5px solid #dedede;
    max-height: 64px
}

@media screen and (min-width: 1920px) {
    .select-options-results {
        padding: 16px 32px;
        gap: 20px;
        max-height: 84px
    }
}

@media screen and (max-width: 1359px) {
    .select-options-results {
        padding: 12px 20px;
        max-height: 54px
    }
}

@media screen and (max-width: 1023px) {
    .select-options-results {
        padding: 10px 20px;
        gap: 10px;
        max-height: 48px
    }
}

@media screen and (max-width: 723px) {
    .select-options-results {
        padding: 8px 16px;
        max-height: 44px
    }
}

.select-options-results .product {
    width: 40px;
    height: 40px
}

@media screen and (min-width: 1920px) {
    .select-options-results .product {
        width: 52px;
        height: 52px
    }
}

@media screen and (max-width: 1359px) {
    .select-options-results .product {
        width: 30px;
        height: 30px
    }
}

@media screen and (max-width: 1023px) {
    .select-options-results .product {
        width: 28px;
        height: 28px
    }
}

.select-options-results .title {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .select-options-results .title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .select-options-results .title {
        font-size: 14px;
        line-height: 20px
    }
}

#product-page .section-analogues {
    padding: 0 !important
}

#product-page .section-analogues .swiper-scrollbar {
    position: absolute;
    top: -50px;
    left: 0;
    width: 100%
}

#product-page .section-analogues .swiper-scrollbar .swiper-scrollbar-drag {
    background: #888
}

#product-page .section-watching {
    padding: 0 40px;
    margin: 56px 0;
    position: relative
}

@media screen and (min-width: 1920px) {
    #product-page .section-watching {
        margin-top: 80px;
        padding: 0 80px
    }
}

@media screen and (max-width: 1359px) {
    #product-page .section-watching {
        padding: 0 32px;
        margin-top: 0
    }
}

@media screen and (max-width: 1023px) {
    #product-page .section-watching {
        padding: 0 28px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 723px) {
    #product-page .section-watching {
        padding: 0 16px;
        margin-top: 32px
    }
}

#product-page .section-watching .section-header .button--outline.button--primary:after {
    background: #f8eff6
}

#product-page .section-watching .section-header .button--outline.button--primary:hover:after {
    background: linear-gradient(180deg, #eff6fa, #f8eff6)
}

.product-page {
    padding: 0 40px;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .product-page {
        padding: 0 80px;
        margin-top: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page {
        padding: 0 32px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page {
        padding: 0 28px;
        margin: 0
    }
}

@media screen and (max-width: 723px) {
    .product-page {
        padding: 0 16px;
        margin-top: 24px;
        margin-bottom: 32px
    }
}

.product-page--inactive {
    padding: 0 40px;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .product-page--inactive {
        padding: 0 80px;
        margin-top: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page--inactive {
        padding: 0 32px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page--inactive {
        padding: 0 28px;
        margin: 0
    }
}

@media screen and (max-width: 723px) {
    .product-page--inactive {
        padding: 0 16px;
        margin-top: 24px;
        margin-bottom: 32px
    }
}

.product-page--inactive .product-status {
    color: #ff3f5f;
    border: 1px solid #ffa4ac
}

.product-page--preorder .product-status {
    color: #0a95d0;
    border: 1px solid #0a95d0
}

.product-page--available .product-status {
    color: #1dbb6b;
    border: 1px solid #1dbb6b
}

.product-page--private-sale .product-status {
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-image: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a);
    border: 1px solid #fba8e4
}

.product-page__wrapper {
    position: sticky;
    top: 16px;
    overflow: hidden;
    height: max-content
}

@media screen and (max-width: 1023px) {
    .product-page__wrapper {
        position: relative;
        top: 0
    }
}

.product-page-tab-content {
    min-width: 100%;
    max-width: 100%;
    padding-right: 0
}

.product-page__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #151514;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__text {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page__text--bold {
    font-weight: 600
}

.product-page .product-video {
    margin-bottom: 80px
}

@media screen and (min-width: 1920px) {
    .product-page .product-video {
        margin-bottom: 96px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-video {
        margin-bottom: 64px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-video {
        margin-bottom: 48px
    }
}

.product-page .product-video__frame {
    height: 600px
}

@media screen and (min-width: 1920px) {
    .product-page .product-video__frame {
        height: 800px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-video__frame {
        height: 500px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-video__frame {
        height: 300px;
        border-radius: 8px;
        overflow: hidden
    }
}

@media screen and (max-width: 723px) {
    .product-page .product-video__frame {
        height: 245px;
        border-radius: 24px
    }
}

.product-page-slider.basket-added {
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page-slider.basket-added {
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-slider.basket-added {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-slider.basket-added {
        margin-bottom: 40px
    }
}

.product-page-slider.basket-added .basket-added__title {
    font-size: 20px;
    line-height: 32px;
    color: #494949
}

@media screen and (min-width: 1920px) {
    .product-page-slider.basket-added .basket-added__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-slider.basket-added .basket-added__title {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-slider.basket-added .basket-added__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product-page-slider.basket-added .basket-added__header {
    margin-bottom: 20px
}

@media screen and (min-width: 1920px) {
    .product-page-slider.basket-added .basket-added__header {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-slider.basket-added .basket-added__header {
        margin-bottom: 16px
    }
}

.product-page-slider.basket-added .swiper-wrapper {
    padding-top: 20px
}

.product-page__name {
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    margin-bottom: 8px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .product-page__name {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (min-width: 1686px) and (max-width: 1919px) {
    .product-page__name {
        max-width: 660px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__name {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .product-page__name {
        font-size: 24px;
        line-height: 28px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 723px) {
    .product-page__name {
        font-size: 20px;
        line-height: 24px
    }
}

.product-page__description {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .product-page__description {
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__description {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page__description {
        font-size: 16px;
        line-height: 24px
    }
}

.product-page__review {
    display: flex;
    align-items: center;
    column-gap: 16px;
    padding-bottom: 32px;
    margin-bottom: 18px
}

@media screen and (min-width: 1920px) {
    .product-page__review {
        padding-bottom: 40px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__review {
        margin-bottom: 46px;
        column-gap: 12px;
        padding: 0
    }
}

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

.product-page__review-link {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    color: #4da6cd;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .product-page__review-link {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__review-link {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-page__review-link {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 723px) {
    .product-page__review-link {
        font-size: 10px;
        line-height: 16px
    }
}

.product-page__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
    line-height: 36px;
    color: #151514;
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .product-page__title {
        font-size: 40px;
        line-height: 48px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page__title {
        font-size: 18px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-page__title {
        margin-bottom: 16px
    }
}

.product-page-code {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px;
    flex-direction: row-reverse;
    margin-bottom: 8px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .product-page-code {
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-code {
        flex-direction: row-reverse;
        margin-bottom: 12px
    }
}

.product-page-code__value {
    padding: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888
}

@media screen and (min-width: 1920px) {
    .product-page-code__value {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-code__value {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-code__value {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 723px) {
    .product-page-code__value {
        font-size: 10px;
        line-height: 14px
    }
}

.product-page-colors {
    margin-bottom: 30px
}

@media screen and (min-width: 1920px) {
    .product-page-colors {
        margin-bottom: 36px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors {
        margin-bottom: 24px
    }
}

.product-page-colors__text {
    margin-bottom: 20px;
    font-size: 13px;
    line-height: 16px;
    font-style: normal;
    font-weight: 400;
    color: #888
}

@media screen and (min-width: 1920px) {
    .product-page-colors__text {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors__text {
        margin-bottom: 16px
    }
}

.product-page-colors__text--dark {
    color: #151514
}

.product-page-colors__colors {
    display: flex;
    align-items: center;
    column-gap: 20px;
    margin-bottom: 6px;
    margin-left: 6px
}

@media screen and (min-width: 1920px) {
    .product-page-colors__colors {
        column-gap: 22px;
        margin-left: 12px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors__colors {
        column-gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-colors__colors {
        column-gap: 12px
    }
}

.product-page-colors__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    position: relative;
    border-radius: 50%;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-colors__item {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors__item {
        width: 20px;
        height: 20px
    }
}

.product-page-colors__item img {
    width: 24px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-colors__item img {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors__item img {
        width: 20px;
        height: 20px
    }
}

.product-page-colors__item:hover:before {
    border: 2px solid #dedede
}

@media screen and (max-width: 1359px) {
    .product-page-colors__item:hover:before {
        border: 1px solid #dedede
    }
}

.product-page-colors__item--active.product-page-colors__item:before {
    border-color: #58c7f7
}

.product-page-colors__item:before {
    content: "";
    position: absolute;
    width: 32px;
    height: 32px;
    border: 2px solid transparent;
    border-radius: 50%;
    transition: border .25s ease
}

@media screen and (min-width: 1920px) {
    .product-page-colors__item:before {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-colors__item:before {
        width: 26px;
        height: 26px;
        border: 1px solid transparent
    }
}

.product-page-colors__item--disabled {
    opacity: .3;
    pointer-events: none
}

.product-page-title {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-title {
        margin-bottom: 18px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-title {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-title {
        display: none
    }
}

.product-page-header {
    display: none;
    margin-bottom: 32px
}

@media screen and (max-width: 1023px) {
    .product-page-header {
        display: block;
        margin-bottom: 16px
    }
}

.product-page-content {
    display: flex;
    column-gap: 24px;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page-content {
        margin-bottom: 80px;
        column-gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-content {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-content {
        flex-direction: column;
        margin-bottom: 40px
    }
}

.product-page-content .card a {
    color: #151514;
    text-decoration: none
}

.product-page-labels {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap
}

@media screen and (max-width: 1023px) {
    .product-page-labels {
        left: 0
    }
}

@media screen and (min-width: 1920px) {
    .product-page-labels .product-lable {
        border-radius: 8px
    }
}

.product-page-labels .product-lable__text {
    font-size: 12px;
    font-weight: 500;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .product-page-labels .product-lable__text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-labels .product-lable__text {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-labels .product-lable__text {
        font-size: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-page-labels .product-lable__text {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (min-width: 1920px) {
    .product-page-labels .product-lable img {
        width: 13px;
        height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-labels .product-lable img {
        width: 16px;
        height: 15px
    }
}

@media screen and (max-width: 723px) {
    .product-page-labels .product-lable img {
        width: 10px;
        height: 10px
    }
}

.product-page-tabs {
    position: relative;
    width: 100%
}

.product-page-tabs__header {
    position: sticky;
    top: 0;
    z-index: 4
}

.product-page-tabs__row {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    width: 100%;
    margin-bottom: 58px;
    padding-top: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #dedede;
    background: #fff
}

@media screen and (min-width: 1920px) {
    .product-page-tabs__row {
        padding-bottom: 24px;
        padding-top: 0;
        border-width: 3px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tabs__row {
        margin-bottom: 48px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tabs__row {
        display: -webkit-box;
        border: none;
        position: relative;
        overflow-x: scroll;
        padding-bottom: 8px;
        margin-bottom: 40px;
        padding-top: 0
    }

    .product-page-tabs__row:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        bottom: 0;
        background: #dedede;
        transition: width .25s ease
    }
}

@media screen and (max-width: 723px) {
    .product-page-tabs__row {
        padding-top: 0
    }

    .product-page-tabs__row:before {
        width: 550px;
        height: 2px
    }
}

.product-page-tabs__row::-webkit-scrollbar {
    display: none
}

.product-page-tab-item {
    position: relative;
    margin: 0 auto;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #888;
    transition: color .25s ease;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item {
        margin-left: 0;
        margin-right: auto;
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 723px) {
    .product-page-tab-item {
        margin-right: 24px
    }
}

.product-page-tab-item:before {
    content: "";
    position: absolute;
    bottom: -14px;
    width: 0;
    height: 2px;
    background: #58c7f7;
    transition: width .25s ease
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item:before {
        bottom: -27px;
        height: 3px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item:before {
        bottom: -8px
    }
}

.product-page-tab-item:first-child {
    margin: 0
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item:first-child {
        margin-right: auto
    }
}

@media screen and (max-width: 723px) {
    .product-page-tab-item:first-child {
        margin-right: 24px
    }
}

.product-page-tab-item:first-child.active:before {
    left: 0;
    transform: none
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item:last-child {
        margin-right: 0
    }
}

.product-page-tab-item.active {
    color: #151514
}

.product-page-tab-item.active:before {
    width: 176px;
    left: 50%;
    transform: translate(-50%)
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item.active:before {
        width: 228px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item.active:before {
        width: 140px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item.active:before {
        width: 100%
    }
}

.product-page-tab-item--count {
    display: inline-block;
    margin-left: 8px;
    font-weight: 600;
    color: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item--count {
        margin-left: 8px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item--count {
        margin-left: 2px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item--count {
        margin-left: 4px
    }
}

.product-page-info {
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page-info {
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-info {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-info {
        margin-bottom: 40px
    }
}

.product-page-properties {
    display: flex;
    flex-direction: column;
    row-gap: 80px;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page-properties {
        row-gap: 96px;
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-properties {
        row-gap: 56px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-properties {
        margin-bottom: 56px
    }
}

.product-page-properties__block img {
    width: 100%;
    height: auto;
    border-radius: 24px;
    object-fit: cover
}

@media screen and (max-width: 1023px) {
    .product-page-properties__block img {
        min-height: 407px
    }
}

@media screen and (max-width: 723px) {
    .product-page-properties__block img {
        min-height: 200px
    }
}

.product-page-properties__block.row {
    column-gap: 56px;
    align-items: center
}

@media screen and (max-width: 1359px) {
    .product-page-properties__block.row {
        column-gap: 40px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-properties__block.row {
        flex-direction: column
    }
}

@media screen and (max-width: 1023px) {
    .product-page-properties__block.row--reverse {
        flex-direction: column-reverse
    }
}

.product-page-properties__block.row img {
    width: 550px
}

@media screen and (min-width: 1920px) {
    .product-page-properties__block.row img {
        width: 812px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-properties__block.row img {
        width: 400px;
        height: 400px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-properties__block.row img {
        width: 100%;
        height: 200px
    }
}

.product-page-properties__title {
    font-family: Headline Base;
    font-size: 24px;
    line-height: 32px;
    font-weight: 500;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-properties__title {
        font-size: 36px;
        line-height: 48px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-properties__title {
        margin-bottom: 16px;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-properties__title {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-properties__title-set {
        font-size: 24px;
        line-height: 32px
    }
}

.product-page-properties__images {
    display: flex;
    align-items: center;
    column-gap: 2px
}

.product-page-properties__images img {
    width: 50%
}

.product-page-properties__images img:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.product-page-properties__images img:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.product-page-properties__column {
    width: 100%
}

.product-page .product-features__wrapper {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    row-gap: 48px;
    column-gap: 56px;
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page .product-features__wrapper {
        grid-template-columns: repeat(4, 1fr);
        row-gap: 72px;
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-features__wrapper {
        grid-template-columns: repeat(4, 1fr);
        row-gap: 32px;
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-features__wrapper {
        grid-template-columns: repeat(3, 1fr);
        row-gap: 24px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 723px) {
    .product-page .product-features__wrapper {
        grid-template-columns: 1fr;
        row-gap: 24px;
        margin-bottom: 40px
    }
}

.product-page .product-features__name {
    color: #888
}

.product-page .product-features__value {
    color: #151514;
    margin-top: 8px
}

@media screen and (max-width: 1359px) {
    .product-page .product-features__value {
        margin-top: 4px
    }
}

.product-page .product-features__name,
.product-page .product-features__value {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px
}

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

    .product-page .product-features__name,
    .product-page .product-features__value {
        font-size: 24px;
        line-height: 38px
    }
}

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

    .product-page .product-features__name,
    .product-page .product-features__value {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page-reviews {
    margin-right: 40px;
    padding: 0
}

@media screen and (min-width: 1920px) {
    .product-page-reviews {
        margin-top: 48px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-reviews {
        margin-right: 0;
        margin-top: 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-reviews {
        margin-top: 56px
    }
}

.product-page-reviews .button {
    padding: 8px 12px
}

@media screen and (min-width: 1920px) {
    .product-page-reviews .button {
        padding: 12px 32px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-reviews .button {
        font-size: 16px;
        line-height: 24px
    }
}

.product-page-brand {
    display: flex;
    align-items: center;
    padding-bottom: 80px;
    column-gap: 80px
}

@media screen and (min-width: 1920px) {
    .product-page-brand {
        padding-bottom: 160px;
        margin-bottom: 0
    }
}

@media screen and (max-width: 1359px) {
    .product-page-brand {
        column-gap: 60px;
        padding-bottom: 48px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-brand {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 723px) {
    .product-page-brand {
        flex-direction: column;
        padding-bottom: 40px;
        gap: 48px
    }
}

.product-page-brand .brand-info__description {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-brand .brand-info__description {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-brand .brand-info__description {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 24px
    }
}

.product-page-brand .brand-info__link {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    color: #4da6cd
}

@media screen and (min-width: 1920px) {
    .product-page-brand .brand-info__link {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-brand .brand-info__link {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page-brand .brand-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 350px;
    max-width: 350px;
    height: 184px;
    margin: 0;
    border-radius: 24px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .product-page-brand .brand-image {
        min-width: 377px;
        max-width: 377px;
        height: 256px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-brand .brand-image {
        min-width: 275px;
        max-width: 275px;
        height: 184px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-brand .brand-image {
        min-width: 310px;
        max-width: 310px;
        height: 200px
    }
}

@media screen and (max-width: 723px) {
    .product-page-brand .brand-image {
        min-width: 100%;
        height: 132px
    }
}

.product-page-brand .brand-image__container {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 150px;
    max-height: 83px
}

@media screen and (min-width: 1920px) {
    .product-page-brand .brand-image__container {
        width: 180px;
        max-height: 100px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-brand .brand-image__container {
        width: 115px;
        max-height: 68px
    }
}

.product-page-select {
    padding: 8px 0;
    border-bottom: 1px solid #dedede;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-select {
        margin-bottom: 32px;
        padding: 12px 0
    }
}

@media screen and (max-width: 1359px) {
    .product-page-select {
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-select {
        margin-bottom: 16px
    }
}

.product-page-select .select {
    max-width: 100%;
    min-width: 100%
}

.product-page-select .select-label {
    display: none
}

.product-page-select .select path {
    fill: #151514
}

.product-page-select .select-field {
    padding: 0
}

@media screen and (max-width: 1023px) {
    .product-page-select .select-field__icon {
        width: auto
    }
}

.product-page-select .select-field__value {
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-select .select-field__value {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-select .select-field__value {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-select .select-field__value {
        font-size: 15px;
        line-height: 24px
    }
}

.product-page-sidebar {
    min-width: 431px;
    max-width: 34%;
    height: 100%;
    position: sticky;
    top: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar {
        min-width: 620px;
        max-width: 620px
    }
}

@media screen and (min-width: 1686px) and (max-width: 1919px) {
    .product-page-sidebar {
        min-width: 660px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar {
        min-width: 345px;
        max-width: 345px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-sidebar {
        min-width: 100%;
        max-width: 100%;
        margin-top: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .button--md {
        line-height: 16px;
        padding: 8px
    }
}

.product-page-sidebar .reviews__icons svg,
.product-page-sidebar .reviews__icons img {
    width: 16px;
    height: 16px
}

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

    .product-page-sidebar .reviews__icons svg,
    .product-page-sidebar .reviews__icons img {
        width: 18px;
        height: 18px
    }
}

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

    .product-page-sidebar .reviews__icons svg,
    .product-page-sidebar .reviews__icons img {
        width: 12px;
        height: 12px
    }
}

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

    .product-page-sidebar .reviews__icons svg,
    .product-page-sidebar .reviews__icons img {
        width: 14px;
        height: 14px
    }
}

.product-page-sidebar .product-page-bonuses {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .product-page-bonuses {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .product-page-bonuses {
        font-size: 12px;
        line-height: 16px
    }
}

.product-page-sidebar .product-page-bonuses__title {
    color: #151514;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .product-page-bonuses__title {
        font-size: 22px;
        line-height: 22px
    }
}

@media screen and (max-width: 1359px) and (min-width: 1024px) {
    .product-page-sidebar .product-page-bonuses__title {
        margin-bottom: 8px
    }
}

.product-page-sidebar .product-page-bonuses__value {
    color: #4dcc8c
}

.product-page-sidebar .product-page-bonuses__text {
    color: #58c7f7;
    border-bottom: 1px dashed #58c7f7;
    cursor: pointer
}

.product-page-sidebar .product-page-bonuses__link {
    display: block;
    margin-top: 16px;
    text-decoration: none;
    color: #58c7f7
}

.product-page-sidebar .product-page-bonuses__container {
    width: 100%
}

.product-page-sidebar .product-page-bonuses__row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .product-page-bonuses__row {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .product-page-bonuses__row {
        margin-bottom: 8px
    }
}

.product-page-sidebar .sidebar-item {
    display: flex;
    align-items: flex-start;
    column-gap: 8px;
    position: relative;
    padding: 16px;
    margin-top: 24px;
    border: 1px solid #dedede;
    border-radius: 10px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item {
        margin-top: 24px;
        padding: 32px;
        column-gap: 16px;
        border-radius: 14px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item {
        margin-top: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-sidebar .sidebar-item {
        margin-top: 8px
    }
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item__icon {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item__icon {
        width: 12px;
        height: 12px
    }
}

.product-page-sidebar .sidebar-item__link {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #58c7f7
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item__link {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item__link {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-sidebar .sidebar-item__link {
        font-size: 12px;
        line-height: 14px
    }
}

.product-page-sidebar .sidebar-item__socials {
    display: flex;
    align-items: center;
    gap: 8px
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item__socials {
        gap: 4px
    }
}

.product-page-sidebar .sidebar-item__socials img {
    width: 28px;
    height: 28px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item__socials img {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item__socials img {
        width: 20px;
        height: 20px
    }
}

.product-page-sidebar .sidebar-item__info {
    max-width: 240px;
    min-width: 180px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item__info {
        max-width: 256px
    }
}

.product-page-sidebar .sidebar-item__info-title {
    margin-bottom: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item__info-title {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sidebar .sidebar-item__info-title {
        font-size: 10px;
        line-height: 12px;
        margin-bottom: 6px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-sidebar .sidebar-item__info-title {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 8px
    }
}

.product-page .product-discount {
    position: absolute;
    top: -15px;
    font-family: Headline Base;
    font-size: 18px;
    line-height: 18px;
    font-weight: 500;
    text-decoration: line-through;
    color: #cfcfcf
}

@media screen and (min-width: 1920px) {
    .product-page .product-discount {
        font-size: 24px;
        line-height: 32px;
        top: -30px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-discount {
        font-size: 18px;
        line-height: 18px;
        top: -16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-discount {
        font-size: 24px;
        line-height: 32px;
        top: -26px
    }
}

@media screen and (max-width: 723px) {
    .product-page .product-discount {
        font-size: 18px;
        line-height: 18px;
        top: -14px
    }
}

.product-page-price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 24px;
    column-gap: 16px;
    position: relative
}

.product-page-price:last-child {
    margin-bottom: 0
}

@media screen and (min-width: 1920px) {
    .product-page-price {
        margin-bottom: 32px;
        column-gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-price {
        margin-bottom: 24px
    }
}

.product-page-price .sidebar-item__socials {
    column-gap: 4px
}

@media screen and (min-width: 1920px) {
    .product-page-price .sidebar-item__socials {
        column-gap: 8px
    }
}

.product-page-price__value {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 40px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .product-page-price__value {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-price__value {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-price__value {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 723px) {
    .product-page-price__value {
        font-size: 28px;
        line-height: 40px
    }
}

.product-page-price__value--discount {
    font-weight: 500;
    color: #ff3f5f
}

@media screen and (max-width: 723px) {
    .product-page-price__value-preorder {
        line-height: 28px
    }
}

.product-page-price__bonus {
    display: flex;
    align-items: center;
    column-gap: 4px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #4dcc8c;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-price__bonus {
        font-size: 16px;
        line-height: 24px;
        column-gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-price__bonus {
        font-size: 12px;
        line-height: 16px;
        column-gap: 4px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-price__bonus {
        font-size: 14px;
        line-height: 20px;
        column-gap: 4px
    }
}

@media screen and (max-width: 723px) {
    .product-page-price__bonus {
        font-size: 14px;
        line-height: 20px;
        column-gap: 4px;
        min-width: 116px;
        font-size: 12px;
        line-height: 16px
    }
}

.product-page-price__bonus--bold {
    font-weight: 600
}

.product-page-price__bonus button {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-price__bonus img {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-price__bonus img {
        width: 18px;
        height: 18px
    }
}

.product-page-credit {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-credit {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit {
        margin-bottom: 18px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-credit {
        margin-bottom: 0
    }
}

.product-page-credit__title {
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    color: #888;
    margin-bottom: 12px
}

@media screen and (min-width: 1920px) {
    .product-page-credit__title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit__title {
        font-size: 10px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-credit__title {
        line-height: 14px
    }
}

.product-page-credit__row {
    display: flex;
    align-items: center;
    column-gap: 12px;
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-credit__row {
        margin-top: 24px;
        column-gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit__row {
        column-gap: 16px
    }
}

.product-page-credit__bank {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    padding: 16px 12px;
    width: 100%;
    border-radius: 16px;
    border: 1px solid #dedede;
    background: none;
    cursor: pointer
}

.product-page-credit__bank:hover {
    border: 1px solid #58c7f7
}

@media screen and (min-width: 1920px) {
    .product-page-credit__bank {
        padding: 24px 12px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit__bank {
        padding: 12px;
        max-height: 44px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-credit__bank {
        max-height: 44px;
        padding: 16px 12px;
        max-height: 56px
    }
}

@media screen and (max-width: 723px) {
    .product-page-credit__bank {
        padding: 14px 12px;
        max-height: 48px
    }
}

.product-page-credit__bank p {
    color: #151514;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .product-page-credit__bank p {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit__bank p {
        font-size: 12px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-credit__bank p {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-page-credit__bank p {
        font-size: 12px;
        line-height: 16px
    }
}

.product-page-credit__bank img {
    width: 28px;
    height: 28px
}

@media screen and (min-width: 1920px) {
    .product-page-credit__bank img {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-credit__bank img {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-credit__bank img {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-page-credit__bank img {
        width: 20px;
        height: 20px
    }
}

.product-page-credit__bank a,
.product-page-credit__bank p {
    color: #000
}

.product-page-buttons {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .product-page-buttons {
        row-gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-buttons {
        flex-direction: unset;
        gap: 16px
    }
}

@media screen and (max-width: 599px) {
    .product-page-buttons {
        padding-top: 8px;
        flex-direction: column;
        gap: 16px
    }
}

.product-page-buttons__item {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    column-gap: 8px;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    padding: 28px 24px;
    font-size: 16px;
    line-height: 24px;
    background: #fff;
    border: 1px solid #dedede
}

.product-page-buttons__item:hover {
    border: 1px solid #58c7f7;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .product-page-buttons__item {
        padding: 40px 24px;
        column-gap: 12px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-buttons__item {
        height: 68px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-buttons__item {
        height: 80px
    }
}

@media screen and (max-width: 723px) {
    .product-page-buttons__item {
        height: 68px
    }
}

@media screen and (min-width: 1920px) {
    .product-page-buttons__item img {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-buttons__item img {
        width: 20px;
        height: 20px
    }
}

.product-page-buttons__item--main {
    background: #58c7f7;
    border: none
}

.product-page-buttons__item--main:hover {
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

.product-page-buttons__item--main .product-page-buttons__link {
    font-weight: 600;
    color: #fff
}

.product-page-buttons__link {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #000
}

@media screen and (min-width: 1920px) {
    .product-page-buttons__link {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-buttons__link {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-buttons__link {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-page-buttons__link {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page-buttons__count {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    padding: 2px 12px;
    border-radius: 12px;
    color: #fff;
    background: #2f9ecd
}

@media screen and (min-width: 1920px) {
    .product-page-buttons__count {
        font-size: 20px;
        line-height: 38px;
        padding: 0 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-buttons__count {
        font-size: 14px;
        line-height: 20px;
        padding-inline: 8px;
        border-radius: 8px
    }
}

.product-page-sale {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #151514;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 96px;
    border-radius: 16px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .product-page-sale {
        height: 124px;
        font-size: 24px;
        line-height: 38px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-sale {
        height: 88px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-sale {
        height: 128px
    }
}

@media screen and (max-width: 723px) {
    .product-page-sale {
        height: 88px
    }
}

.product-page-sale__link {
    position: relative;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-image: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a);
    text-decoration: underline
}

.product-page-sale__link:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 0;
    background: radial-gradient(100% 965.52% at 0% 0%, #b847e1, #eb606a)
}

@media screen and (max-width: 1023px) {
    .button--md {
        padding: 8px 16px;
        line-height: 16px
    }
}

.card-timer-product {
    position: unset;
    border-radius: 6px
}

.card-timer-product .card-timer__title {
    display: flex;
    padding: 5px 7px;
    align-items: flex-start;
    gap: 2px;
    border-radius: 5px 5px 0 0
}

.card-timer-product .card-timer__value {
    display: flex;
    width: 85px;
    padding: 2px 4px 3px;
    justify-content: center;
    align-items: center;
    gap: 2px;
    border-radius: 0 0 6px 6px
}

.close-breadcrumbs {
    cursor: pointer
}

@media screen and (max-width: 1359px) {
    .close-breadcrumbs {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 1023px) {
    .close-breadcrumbs {
        display: none
    }
}

.close-breadcrumbs-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .close-breadcrumbs-mobile {
        display: flex;
        cursor: pointer
    }
}

@media screen and (max-width: 723px) {
    .close-breadcrumbs-mobile {
        width: 10px;
        height: 10px
    }
}

.code-mobile {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-direction: row-reverse
}

@media screen and (max-width: 1023px) {
    .product-page-code-desktop {
        display: none
    }
}

.product-page__review-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .product-page__review-mobile {
        display: flex;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 723px) {
    .product-page__review-mobile {
        margin-bottom: 24px
    }
}

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

    .product-page__title-features,
    .product-page__title-brand {
        font-size: 18px;
        line-height: 20px
    }
}

.swiper-scrollbar {
    height: 1px;
    background: #f4f4f4;
    margin-top: 40px
}

@media screen and (min-width: 1920px) {
    .swiper-scrollbar {
        margin-top: 48px
    }
}

@media screen and (max-width: 1359px) {
    .swiper-scrollbar {
        margin-top: 24px
    }
}

@media screen and (max-width: 1023px) {
    .swiper-scrollbar {
        margin-top: 18px
    }
}

.swiper-scrollbar .swiper-scrollbar-drag {
    height: 100%;
    background: #dedede
}

@media screen and (max-width: 723px) {
    .product-page-equipment__title {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.product-page-tab-content {
    padding: 0 40px
}

@media screen and (max-width: 1359px) {
    .product-page-tab-content {
        padding: 0 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-content {
        padding: 0
    }
}

.product-page__review-main {
    margin-bottom: 0
}

@media screen and (max-width: 1359px) {
    .product-page__review-main {
        margin-bottom: 28px
    }
}

@media screen and (max-width: 1023px) {
    .product-page__review-main {
        padding: 0
    }
}

.product-page-price-private {
    margin-top: 0
}

@media screen and (max-width: 1359px) {
    .product-page-price-private {
        margin-top: 28px
    }
}

.product-page-price-preorder {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    position: relative;
    padding-right: 32px
}

@media screen and (min-width: 1920px) {
    .product-page-price-preorder {
        gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-price-preorder {
        gap: 0px
    }
}

@media screen and (max-width: 723px) {
    .product-page-price-preorder {
        gap: 8px
    }
}

.product-payment {
    display: flex;
    flex-direction: column;
    max-width: 200px;
    align-items: center;
    gap: 12px
}

@media screen and (max-width: 723px) {
    .product-payment {
        gap: 8px
    }
}

.product-payment__price {
    color: #494949;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .product-payment__price {
        font-size: 32px;
        line-height: 48px
    }
}

@media screen and (max-width: 1023px) {
    .product-payment__price {
        font-size: 28px;
        line-height: 48px
    }
}

@media screen and (max-width: 723px) {
    .product-payment__price {
        font-size: 20px;
        line-height: 24px
    }
}

.product-payment__note {
    border-radius: 0 0 12px 12px;
    background: #bbe3b9;
    display: flex;
    padding: 5px 8px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    color: #494949;
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
    min-width: 200px;
    max-width: 200px
}

@media screen and (min-width: 1920px) {
    .product-payment__note {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-payment__note {
        min-width: 169px;
        max-width: 169px
    }
}

@media screen and (max-width: 1023px) {
    .product-payment__note {
        min-width: 200px;
        max-width: 200px
    }
}

@media screen and (max-width: 723px) {
    .product-payment__note {
        min-width: 169px;
        max-width: 169px
    }
}

.product-page-pricing {
    display: flex;
    align-items: flex-start;
    width: 100%;
    gap: 24px
}

.product-page-price-preorder:after {
    content: "";
    position: absolute;
    right: 0;
    top: 10px;
    height: 29px;
    width: 1px;
    background-color: #dedede
}

@media screen and (max-width: 723px) {
    .product-page-price-preorder:after {
        height: 16px;
        top: 6px
    }
}

.gallery-button-prev,
.gallery-button-next {
    top: 50%
}

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

    .gallery-button-prev,
    .gallery-button-next {
        display: none !important
    }
}

.gallery-button-prev {
    left: 15%
}

.product-page-tab-item-certificate {
    position: relative;
    margin: 0 auto;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #888;
    transition: color .25s ease;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item-certificate {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item-certificate {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate {
        margin-left: 0;
        margin-right: auto;
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 723px) {
    .product-page-tab-item-certificate {
        margin-right: 24px
    }
}

.product-page-tab-item-certificate:before {
    content: "";
    position: absolute;
    bottom: -14px;
    width: 0;
    height: 2px;
    background: #58c7f7;
    transition: width .25s ease
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item-certificate:before {
        bottom: -27px;
        height: 3px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate:before {
        bottom: -8px
    }
}

.product-page-tab-item-certificate:first-child {
    margin: 0
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate:first-child {
        margin-right: auto
    }
}

@media screen and (max-width: 723px) {
    .product-page-tab-item-certificate:first-child {
        margin-right: 24px
    }
}

.product-page-tab-item-certificate:first-child.active:before {
    left: 0;
    transform: none
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate:last-child {
        margin-right: 0
    }
}

.product-page-tab-item-certificate.active {
    color: #151514
}

.product-page-tab-item-certificate.active:before {
    width: 427px;
    left: 50%;
    transform: translate(-50%)
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item-certificate.active:before {
        width: 587px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item-certificate.active:before {
        width: 320px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate.active:before {
        width: 100%
    }
}

.product-page-tab-item-certificate--count {
    display: inline-block;
    margin-left: 8px;
    font-weight: 600;
    color: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .product-page-tab-item-certificate--count {
        margin-left: 8px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-tab-item-certificate--count {
        margin-left: 2px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-tab-item-certificate--count {
        margin-left: 4px
    }
}

.analogues-products-swiper {
    margin-top: 48px !important
}

.product-page-equipment-container {
    padding: 0 !important
}

@media screen and (max-width: 1023px) {
    .container-label {
        max-height: 16px;
        gap: 3px;
        padding: 2px 4px !important
    }
}

#search-results-page .search-results__header {
    margin: 24px 0 32px
}

@media screen and (max-width: 1024px) {
    #search-results-page .search-results__header {
        margin: 32px 0 16px
    }
}

@media screen and (max-width: 768px) {
    #search-results-page .brands-tag-list {
        margin-bottom: 16px
    }
}

#search-results-page .search-results__count {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    #search-results-page .search-results__count {
        font-size: 22px;
        line-height: 32px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    #search-results-page .search-results__count {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    #search-results-page .search-results__count {
        font-size: 15px;
        margin-bottom: 8px
    }
}

#search-results-page .pagination {
    margin-bottom: 32px;
    margin-top: 40px
}

@media screen and (min-width: 1920px) {
    #search-results-page .pagination {
        margin-top: 32px;
        margin-bottom: 48px
    }
}

@media screen and (max-width: 1024px) {
    #search-results-page .pagination {
        margin: 24px 0 32px
    }
}

.promotion-nav-banner {
    padding: 0;
    width: 100vw !important;
    height: 56px !important;
    margin: 0;
    background: none;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative
}

.promotion-nav-banner picture {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%
}

.promotion-nav-banner__image {
    width: 100vw !important;
    height: 56px !important;
    object-fit: cover;
    display: block
}

@media screen and (min-width: 1920px) {
    .promotion-nav-banner {
        width: 1920px !important;
        background: #120d5c;
        padding-top: 0;
        margin: 0 auto
    }

    .promotion-nav-banner picture {
        width: 1441px;
        height: 56px
    }

    .promotion-nav-banner__image {
        width: 1441px !important;
        height: 56px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .promotion-nav-banner {
        width: clamp(1360px, 1360px + (100vw - 1360px) * 1, 1920px) !important;
        height: clamp(40px, 40px + (100vw - 1360px) * .0286, 56px) !important;
        background: #120d5c;
        padding-top: 0;
        margin: 0 auto
    }

    .promotion-nav-banner picture {
        width: clamp(1024px, 1024px + (100vw - 1360px) * .7446, 1441px);
        height: clamp(40px, 40px + (100vw - 1360px) * .0286, 56px)
    }

    .promotion-nav-banner__image {
        width: clamp(1024px, 1024px + (100vw - 1360px) * .7446, 1441px) !important;
        height: clamp(40px, 40px + (100vw - 1360px) * .0286, 56px) !important
    }
}

@media screen and (max-width: 1360px) {
    .promotion-nav-banner {
        width: 100% !important;
        height: 40px !important;
        background: #120d5c;
        padding-top: 0;
        margin: 0 auto
    }

    .promotion-nav-banner picture {
        width: 100%;
        height: 40px
    }

    .promotion-nav-banner__image {
        width: 100% !important;
        height: 40px !important
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    .promotion-nav-banner {
        height: clamp(32px, 32px + (100vw - 724px) * .0267, 40px) !important
    }

    .promotion-nav-banner picture {
        height: clamp(32px, 32px + (100vw - 724px) * .0267, 40px)
    }

    .promotion-nav-banner__image {
        height: clamp(32px, 32px + (100vw - 724px) * .0267, 40px) !important
    }
}

@media screen and (max-width: 724px) {
    .promotion-nav-banner {
        height: 32px !important
    }

    .promotion-nav-banner picture {
        width: 100%;
        height: 32px
    }

    .promotion-nav-banner__image {
        width: 100% !important;
        height: 32px !important
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    .promotion-nav-banner {
        height: clamp(26px, 26px + (100vw - 360px) * .0165, 32px) !important
    }

    .promotion-nav-banner picture {
        height: clamp(26px, 26px + (100vw - 360px) * .0165, 32px)
    }

    .promotion-nav-banner__image {
        height: clamp(26px, 26px + (100vw - 360px) * .0165, 32px) !important
    }
}

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

    .promotion-nav-banner,
    .promotion-nav-banner__image {
        height: 26px !important
    }
}

#promotion-page .promotion-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    padding: 0 40px;
    margin: 60px 0
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-wrapper {
        padding: 0 80px
    }
}

@media screen and (max-width: 1360px) {
    #promotion-page .promotion-wrapper {
        padding: 0 32px;
        margin: 40px 0
    }
}

@media screen and (max-width: 1024px) {
    #promotion-page .promotion-wrapper {
        padding: 0 28px;
        margin: 30px 0;
        gap: 18px
    }
}

@media screen and (max-width: 724px) {
    #promotion-page .promotion-wrapper {
        flex-direction: column;
        align-items: center;
        padding: 0 16px;
        margin-bottom: 30px;
        margin-top: 10px;
        gap: 16px
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .promotion-wrapper {
        padding: 0 16px;
        margin-top: 20px;
        margin-bottom: 56px;
        gap: 12px
    }
}

#promotion-page .promotion-wrapper__content {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #promotion-page .promotion-wrapper__content {
        align-items: stretch
    }
}

@media screen and (min-width: 725px) and (max-width: 1360px) {
    #promotion-page .promotion-wrapper__content {
        align-items: stretch
    }
}

@media screen and (max-width: 724px) {
    #promotion-page .promotion-wrapper__content {
        flex: none;
        width: 100%;
        align-items: center;
        justify-content: center;
        align-self: center
    }

    #promotion-page .promotion-wrapper__content picture {
        display: block;
        width: 100%;
        max-width: 668px;
        margin: 0 auto
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .promotion-wrapper__content picture {
        max-width: 328px
    }
}

#promotion-page .promotion-wrapper__content picture {
    display: block;
    width: 100%;
    height: 100%
}

#promotion-page .promotion-wrapper__content-image {
    width: 1600px;
    height: 900px;
    border-radius: 32px;
    object-fit: fill;
    max-width: 100%
}

@media screen and (max-width: 2560px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 1842px;
        height: 727px
    }
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 1242px;
        height: 727px;
        border-radius: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 100%;
        box-sizing: border-box;
        height: clamp(470px, 470px + (100vw - 1360px) * .459, 727px);
        border-radius: clamp(24px, 24px + (100vw - 1360px) * .0143, 32px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 100%;
        height: clamp(375px, 375px + (100vw - 1024px) * .2827, 470px);
        border-radius: clamp(20px, 20px + (100vw - 1024px) * .0119, 24px)
    }
}

@media screen and (min-width: 725px) and (max-width: 1024px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 100%;
        height: 375px;
        border-radius: 20px;
        object-fit: fill
    }
}

@media screen and (max-width: 724px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 100%;
        max-width: 668px;
        height: 216px;
        border-radius: 20px;
        margin: 0 auto
    }
}

@media screen and (min-width: 361px) and (max-width: 723px) {
    #promotion-page .promotion-wrapper__content-image {
        height: clamp(184px, 184px + (100vw - 360px) * .0879, 216px)
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .promotion-wrapper__content-image {
        width: 100%;
        max-width: 328px;
        height: 184px;
        border-radius: 20px;
        margin: 0 auto
    }
}

#promotion-page .promotion-header {
    margin-bottom: 32px
}

#promotion-page .promotion-header .promotion-title {
    font-size: 48px;
    font-weight: 700;
    color: #333;
    margin-bottom: 16px;
    line-height: 1.2
}

@media screen and (max-width: 1024px) and (min-width: 725px) {
    #promotion-page .promotion-header .promotion-title {
        font-size: 36px
    }
}

#promotion-page .promotion-header .promotion-description {
    font-size: 18px;
    color: #666;
    line-height: 1.6
}

#promotion-page .promotion-content .promotion-text h2 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 16px
}

#promotion-page .promotion-content .promotion-text h3 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin: 24px 0 12px
}

#promotion-page .promotion-content .promotion-text p {
    font-size: 16px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 16px
}

#promotion-page .promotion-content .promotion-text ul {
    list-style: none;
    padding: 0;
    margin: 16px 0
}

#promotion-page .promotion-content .promotion-text ul li {
    font-size: 16px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 8px;
    padding-left: 20px;
    position: relative
}

#promotion-page .promotion-content .promotion-text ul li:before {
    content: "•";
    color: #8b5cf6;
    font-weight: 700;
    position: absolute;
    left: 0
}

#promotion-page .promotion-cta {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin: 60px 0
}

@media screen and (max-width: 768px) and (min-width: 361px) {
    #promotion-page .promotion-cta {
        flex-direction: column;
        align-items: center
    }
}

#promotion-page .promotion-cta .btn {
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all .3s ease
}

#promotion-page .promotion-cta .btn.btn-primary {
    background: #8b5cf6;
    color: #fff
}

#promotion-page .promotion-cta .btn.btn-primary:hover {
    background: #7c3aed;
    transform: translateY(-2px)
}

#promotion-page .promotion-cta .btn.btn-secondary {
    background: transparent;
    color: #8b5cf6;
    border: 2px solid #8b5cf6
}

#promotion-page .promotion-cta .btn.btn-secondary:hover {
    background: #8b5cf6;
    color: #fff;
    transform: translateY(-2px)
}

#promotion-page .promotion-cta .btn.btn-large {
    padding: 20px 40px;
    font-size: 18px
}

#promotion-page .sort-wrapper {
    margin-bottom: 32px
}

@media screen and (max-width: 1024px) {
    #promotion-page .sort-wrapper {
        margin-bottom: 28px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .sort-wrapper {
        margin-bottom: 16px
    }
}

#promotion-page .sort-wrapper .container-sort-block {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    #promotion-page .sort-wrapper .container-sort-block {
        gap: 20px
    }
}

#promotion-page .sort-wrapper .container-sort-block .page-title {
    margin-bottom: 0;
    flex: 1
}

@media screen and (min-width: 1920px) {
    #promotion-page .sort-wrapper .container-sort-block .page-title {
        font-size: 48px;
        line-height: 56px
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .sort-wrapper .container-sort-block .page-title {
        font-size: 20px;
        line-height: 24px
    }
}

#promotion-page .sort-wrapper .container-sort-block .sort-desktop {
    flex-shrink: 0
}

@media screen and (max-width: 723px) {
    #promotion-page .sort-wrapper .container-sort-block {
        flex-direction: column;
        align-items: flex-start
    }

    #promotion-page .sort-wrapper .container-sort-block .page-title,
    #promotion-page .sort-wrapper .container-sort-block .sort-desktop {
        width: 100%
    }
}

#promotion-page .sort-wrapper .sort-block .sort-block-field__list {
    z-index: 8
}

@media screen and (min-width: 724px) and (max-width: 1023px) {
    #promotion-page .sort-wrapper .sort-block-field {
        position: relative
    }

    #promotion-page .sort-wrapper .sort-block-field__list {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        bottom: auto !important;
        right: 0 !important;
        left: auto !important;
        margin-top: 0 !important;
        max-width: min(180px, 100vw - 32px) !important
    }

    #promotion-page .sort-wrapper .sort-block.active .sort-block-field__list {
        top: calc(100% + 8px) !important;
        bottom: auto !important;
        right: 0 !important;
        left: auto !important
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .sort-wrapper .sort-wrapper-mobile {
        padding: 0;
        margin-bottom: 0;
        position: relative;
        overflow: visible
    }
}

@media screen and (max-width: 723px) and (min-width: 361px) {

    #promotion-page .sort-wrapper .sort-mobile .sort-block,
    #promotion-page .sort-wrapper .sort-mobile .sort-block-field {
        width: auto !important
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__current {
        min-width: auto !important;
        padding: 10px 14px;
        font-size: 12px;
        line-height: 16px;
        max-height: 36px;
        width: 130px;
        height: 32px;
        gap: 12px
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field {
        position: relative
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list {
        display: none;
        pointer-events: none;
        position: absolute;
        top: calc(100% + 4px);
        left: 0;
        width: 180px;
        min-width: 180px;
        max-width: min(180px, 100vw - 32px);
        margin-top: 0;
        z-index: 8;
        box-sizing: border-box;
        overflow: hidden
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list-item {
        min-width: auto;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 8px 12px;
        font-size: 12px;
        line-height: 16px
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block.active .sort-block-field__list {
        display: flex;
        pointer-events: auto
    }
}

@media screen and (min-width: 724px) and (max-width: 1023px) {
    #promotion-page .sort-wrapper .sort-mobile .sort-block-field {
        position: relative
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        bottom: auto !important;
        right: auto !important;
        left: 0 !important;
        margin-top: 0 !important;
        width: 180px !important;
        min-width: 180px !important;
        max-width: min(180px, 100vw - 32px) !important
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block.active .sort-block-field__list {
        top: calc(100% + 8px) !important;
        bottom: auto !important
    }
}

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

    #promotion-page .sort-wrapper .sort-mobile .sort-block,
    #promotion-page .sort-wrapper .sort-mobile .sort-block-field {
        width: auto !important
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__current {
        min-width: auto !important;
        padding: 12px 16px;
        font-size: 14px;
        line-height: 18px;
        max-height: 42px;
        max-width: 220px;
        min-width: 0px;
        height: 42px;
        gap: 12px
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field {
        position: relative
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list {
        display: none;
        pointer-events: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 240px;
        min-width: 240px;
        max-width: min(240px, 100vw - 32px);
        margin-top: 4px;
        gap: 1px;
        z-index: 8;
        box-sizing: border-box;
        overflow: hidden
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list-item {
        min-width: auto;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 10px 14px;
        font-size: 14px;
        line-height: 18px
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block-field__list-item .sort-block-field__text {
        font-size: 14px;
        line-height: 18px
    }

    #promotion-page .sort-wrapper .sort-mobile .sort-block.active .sort-block-field__list {
        display: flex;
        pointer-events: auto
    }
}

#promotion-page .promotion-products-slider {
    margin: 0 0 60px;
    position: relative;
    padding: 0 40px
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-products-slider {
        padding: 0 80px
    }
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-products-slider {
        padding: 0 32px
    }
}

@media screen and (max-width: 1023px) {
    #promotion-page .promotion-products-slider {
        padding: 0 28px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .promotion-products-slider {
        padding: 0 16px
    }
}

#promotion-page .promotion-products-slider__header {
    margin-bottom: 32px
}

#promotion-page .promotion-products-slider__title {
    font-size: 32px;
    font-weight: 600;
    color: #333;
    margin: 0
}

#promotion-page .promotion-products-slider__container {
    position: relative;
    overflow: hidden
}

#promotion-page .promotion-products-slider__wrapper {
    display: flex;
    gap: 20px;
    transition: transform .3s ease;
    width: max-content
}

@media screen and (max-width: 1024px) {
    #promotion-page .promotion-products-slider__wrapper {
        column-gap: 14px
    }
}

#promotion-page .promotion-slider-prev,
#promotion-page .promotion-slider-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 7;
    transition: transform .3s ease, border-color .3s ease;
    border: 1px solid #dedede;
    box-shadow: 0 0 24px #0000001a;
    opacity: 1;
    width: 48px;
    height: 48px;
    pointer-events: auto
}

#promotion-page .promotion-slider-prev:hover,
#promotion-page .promotion-slider-next:hover {
    transform: translateY(-50%) scale(1.05);
    border: 1px solid #4da6cd
}

#promotion-page .promotion-slider-prev {
    left: 20px
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-slider-prev {
        left: 40px
    }
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-slider-prev {
        left: 16px
    }
}

@media screen and (max-width: 1023px) {
    #promotion-page .promotion-slider-prev {
        left: 12px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .promotion-slider-prev {
        left: 8px
    }
}

#promotion-page .promotion-slider-prev svg {
    display: block;
    transform: rotate(180deg);
    pointer-events: none
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-slider-prev svg {
        width: 16px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-slider-prev svg {
        width: 12px;
        height: 21px
    }
}

@media screen and (max-width: 1023px) {
    #promotion-page .promotion-slider-prev svg {
        width: 10px;
        height: 18px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .promotion-slider-prev svg {
        width: 8px;
        height: 14px
    }
}

#promotion-page .promotion-slider-next {
    right: 20px
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-slider-next {
        right: 40px
    }
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-slider-next {
        right: 16px
    }
}

@media screen and (max-width: 1023px) {
    #promotion-page .promotion-slider-next {
        right: 12px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .promotion-slider-next {
        right: 8px
    }
}

#promotion-page .promotion-slider-next svg {
    display: block;
    pointer-events: none
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-slider-next svg {
        width: 16px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-slider-next svg {
        width: 12px;
        height: 21px
    }
}

@media screen and (max-width: 1023px) {
    #promotion-page .promotion-slider-next svg {
        width: 10px;
        height: 18px
    }
}

@media screen and (max-width: 723px) {
    #promotion-page .promotion-slider-next svg {
        width: 8px;
        height: 14px
    }
}

#promotion-page .promotion-slider-pagination {
    display: flex;
    justify-content: center;
    margin-top: 24px
}

#promotion-page .promotion-slider-pagination__dots {
    display: flex;
    gap: 8px
}

#promotion-page .promotion-slider-pagination__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #e0e0e0;
    cursor: pointer;
    transition: background-color .3s ease
}

#promotion-page .promotion-slider-pagination__dot.active {
    background-color: #8b5cf6
}

#promotion-page .promotion-slider-pagination__dot:hover {
    background-color: #a78bfa
}

#promotion-page .promotion-product-card {
    flex: 0 0 auto;
    width: auto;
    min-width: fit-content;
    max-width: none;
    height: 60px;
    min-height: 60px;
    max-height: 60px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-width: 1px;
    border-radius: 80px;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: all .3s ease;
    box-sizing: border-box;
    opacity: 1;
    cursor: pointer;
    white-space: nowrap
}

@media screen and (max-width: 1359px) {
    #promotion-page .promotion-product-card {
        width: 217px;
        height: 60px;
        min-height: 60px;
        max-height: 60px;
        gap: 12px;
        border-radius: 80px;
        padding: 10px 20px;
        border-width: 1px
    }
}

#promotion-page .promotion-product-card:hover {
    border-color: #58c7f6
}

#promotion-page .promotion-product-card.active,
#promotion-page .promotion-product-card:active {
    background: #f4f4f4
}

#promotion-page .promotion-product-card__image {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center
}

#promotion-page .promotion-product-card__image img {
    width: 32px;
    height: 32px;
    object-fit: contain
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-product-card__image img {
        width: 56px;
        height: 56px
    }
}

#promotion-page .promotion-product-card__content {
    flex: 1
}

#promotion-page .promotion-product-card__title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0;
    line-height: 1.3
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-product-card__title {
        font-family: Inter, sans-serif;
        font-weight: 600;
        font-size: 24px;
        line-height: 32px;
        letter-spacing: 0
    }
}

@media screen and (min-width: 1920px) {
    #promotion-page .promotion-product-card {
        height: 88px;
        min-height: 88px;
        max-height: 88px
    }
}

@media screen and (max-width: 1024px) {
    #promotion-page .promotion-products-slider {
        margin: 0 0 40px
    }

    #promotion-page .promotion-products-slider__title {
        font-size: 28px
    }

    #promotion-page .promotion-products-slider__container {
        margin: 0
    }

    #promotion-page .promotion-slider-prev,
    #promotion-page .promotion-slider-next {
        width: 40px;
        height: 40px
    }

    #promotion-page .promotion-slider-prev svg,
    #promotion-page .promotion-slider-next svg {
        width: 20px;
        height: 20px
    }

    #promotion-page .promotion-product-card {
        flex: 0 0 auto;
        width: 198px;
        min-width: fit-content;
        max-width: none;
        height: 56px;
        min-height: 56px;
        max-height: 56px;
        gap: 12px;
        border-radius: 80px;
        padding: 10px 20px;
        border-width: 1px
    }

    #promotion-page .promotion-product-card__title {
        font-size: 14px
    }
}

@media screen and (max-width: 724px) {
    #promotion-page .promotion-product-card {
        height: 48px;
        min-height: 48px;
        max-height: 48px
    }
}

@media screen and (max-width: 768px) {
    #promotion-page .promotion-products-slider {
        margin: 0 0 30px
    }

    #promotion-page .promotion-products-slider__title {
        font-size: 24px
    }

    #promotion-page .promotion-products-slider__container {
        margin: 0
    }

    #promotion-page .promotion-slider-prev,
    #promotion-page .promotion-slider-next {
        width: 36px;
        height: 36px
    }

    #promotion-page .promotion-slider-prev svg,
    #promotion-page .promotion-slider-next svg {
        width: 18px;
        height: 18px
    }

    #promotion-page .promotion-product-card {
        flex: 0 0 auto;
        width: auto;
        min-width: fit-content;
        max-width: none;
        padding: 16px 20px;
        gap: 12px
    }

    #promotion-page .promotion-product-card__image img {
        width: 28px;
        height: 28px
    }

    #promotion-page .promotion-product-card__title {
        font-size: 12px
    }
}

@media screen and (max-width: 360px) {
    #promotion-page .promotion-product-card {
        height: 48px;
        min-height: 48px;
        max-height: 48px
    }
}

.bg-checkout {
    background: #f0f0f0
}

#checkout-page .container-checkout {
    display: flex;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    #checkout-page .container-checkout {
        gap: 24px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .container-checkout {
        flex-direction: column
    }
}

#checkout-page .container-checkout-left {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 894px
}

@media screen and (min-width: 1920px) {
    #checkout-page .container-checkout-left {
        gap: 32px;
        min-width: 1224px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .container-checkout-left {
        min-width: 658px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .container-checkout-left {
        gap: 12px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .container-checkout-left {
        min-width: 328px
    }
}

#checkout-page .container-checkout .checkout-title {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-style: normal;
    font-weight: 500;
    line-height: 36px
}

@media screen and (min-width: 1920px) {
    #checkout-page .container-checkout .checkout-title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .container-checkout .checkout-title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .container-checkout .checkout-title {
        font-size: 20px;
        line-height: 28px
    }
}

#checkout-page .basket {
    display: flex;
    padding: 32px 32px 40px;
    flex-direction: column;
    justify-content: start;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    width: 100%;
    height: max-content
}

@media screen and (min-width: 1920px) {
    #checkout-page .basket {
        padding: 56px;
        gap: 48px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .basket {
        padding: 24px;
        margin-bottom: 16px;
        border-radius: 24px;
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .basket {
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .basket {
        padding: 20px 16px
    }
}

#checkout-page .basket .basket-list {
    max-height: 581px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    gap: 24px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    #checkout-page .basket .basket-list {
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .basket .basket-list {
        gap: 18px
    }
}

@media screen and (min-width: 1920px) {
    #checkout-page .basket .basket-header {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .basket .basket-header {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .basket .basket-header__title {
        font-size: 24px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .basket .basket-header__title {
        font-size: 18px
    }
}

#checkout-page .checkout-content-delivery {
    padding: 32px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content-delivery {
        padding: 56px;
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content-delivery {
        margin-bottom: 0 !important;
        padding: 20px 24px 28px;
        gap: 28px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content-delivery {
        padding: 20px 16px
    }
}

#checkout-page .checkout-content-delivery .text-field__input::placeholder {
    color: #888 !important;
    opacity: 1;
    font-weight: 400 !important
}

#checkout-page .checkout-content-delivery .radio-button__lable {
    margin-bottom: 0
}

#checkout-page .checkout-content {
    display: flex;
    column-gap: 16px;
    min-width: 100%;
    max-width: 100%
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content {
        flex-direction: column;
        row-gap: 16px
    }
}

#checkout-page .checkout-content .checkout-container-left {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 70%;
    min-width: 894px
}

#checkout-page .checkout-content .checkout-message {
    width: 100%;
    display: flex;
    align-items: center;
    position: relative;
    padding: 16px;
    margin-bottom: 40px;
    background: #f0f6fb;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-message {
        max-width: 808px;
        min-width: 808px;
        margin-bottom: 48px;
        padding: 24px 16px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-message {
        max-width: 513px;
        min-width: 513px;
        padding: 16px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-message {
        max-width: 100%;
        min-width: 100%;
        align-items: flex-start;
        margin-bottom: 32px
    }
}

#checkout-page .checkout-content .checkout-message__close {
    position: absolute;
    top: 16px;
    right: 16px;
    cursor: pointer
}

#checkout-page .checkout-content .checkout-message__close img {
    width: 16px
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-message__close {
        top: 12px;
        right: 12px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-message__close {
        top: 16px;
        right: 16px
    }
}

#checkout-page .checkout-content .checkout-message__icon {
    margin-right: 16px
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-message__icon {
        width: 14px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-message__icon {
        width: auto;
        margin-right: 20px
    }
}

#checkout-page .checkout-content .checkout-message__text {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #888
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-message__text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-message__text {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-message__text {
        font-size: 12px;
        line-height: 16px
    }
}

#checkout-page .checkout-content .checkout-message__text .checkout-message__link {
    color: #58c7f7;
    text-decoration: none
}

#checkout-page .checkout-content .checkout-form__wrapper {
    display: flex;
    padding: 32px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    width: 100%
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form__wrapper {
        padding: 48px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form__wrapper {
        padding: 24px 16px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-form__wrapper {
        width: 100%;
        border-radius: 16px;
        padding: 24px 16px
    }
}

#checkout-page .checkout-content .checkout-form__wrapper-payment {
    padding: 32px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment {
        padding: 56px 56px 40px;
        gap: 48px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment {
        padding: 20px 24px 16px;
        gap: 28px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment {
        padding: 20px 16px
    }
}

#checkout-page .checkout-content .checkout-form__wrapper-payment .checkout-credit__form {
    display: flex;
    padding: 18px;
    align-items: center;
    gap: 12px;
    align-self: stretch;
    border-radius: 12px;
    background-image: url(../assets/monobank-select.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    justify-content: space-between
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment .checkout-credit__form {
        padding: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment .checkout-credit__form {
        background-image: url(../assets/monobank-select-1024.png)
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment .checkout-credit__form {
        background-image: url(../assets/monobank-select-360.png)
    }
}

#checkout-page .checkout-content .checkout-form__wrapper-payment .privat {
    background-image: url(../assets/privat-select-1360.png)
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment .privat {
        background-image: url(../assets/privat-select-1024.png)
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form__wrapper-payment .privat {
        background-image: url(../assets/privat-select-360.png)
    }
}

#checkout-page .checkout-content .checkout-form__contact {
    padding: 24px 32px 32px;
    gap: 16px
}

#checkout-page .checkout-content .checkout-form {
    display: flex;
    flex-direction: column;
    width: 100%
}

#checkout-page .checkout-content .checkout-form .checkout-form__group--contact .form-group__title {
    margin-bottom: 48px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-group__title {
        margin-bottom: 32px
    }
}

#checkout-page .checkout-content .checkout-form .checkout-form__row .text-field__container {
    min-width: 100% !important;
    max-width: 100% !important;
    height: 60px
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .checkout-form__group--comment {
        margin: 0
    }
}

#checkout-page .checkout-content .checkout-form .checkout-form__group--comment .form-group__title {
    margin: 0
}

#checkout-page .checkout-content .checkout-form .checkout-form__group--comment .text-field__container {
    max-width: 100%
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row {
        column-gap: 32px;
        row-gap: 16px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-form .form-row {
        row-gap: 8px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .text-field__input::placeholder {
    color: #dedede;
    opacity: 1;
    font-style: 400 !important
}

#checkout-page .checkout-content .checkout-form .form-row input.is-invalid {
    border-bottom: 1px solid #ff3f5f
}

#checkout-page .checkout-content .checkout-form .form-row .input-with-error {
    position: relative
}

#checkout-page .checkout-content .checkout-form .form-row .input-with-error .error-icon {
    display: none
}

#checkout-page .checkout-content .checkout-form .form-row .input-with-error.has-error .error-icon {
    position: absolute;
    display: block;
    right: 56%;
    top: 2px
}

#checkout-page .checkout-content .checkout-form .form-row .btn-form {
    all: unset;
    display: flex;
    padding: 16px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 16px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    width: 100%;
    margin-top: 16px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row .btn-form {
        padding: 24px;
        font-size: 24px;
        line-height: 38px;
        margin-top: 24px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row .btn-form {
        margin-top: 0;
        padding: 16px 24px;
        font-size: 14px;
        line-height: 20px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .btn-form:hover {
    background-color: #6cd3ff
}

#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons {
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons {
        gap: 12px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons {
        flex-direction: column
    }
}

#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram,
#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google {
    display: flex;
    padding: 12px 24px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    background: #24a1de;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer
}

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

    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram,
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google {
        height: 64px;
        padding: 16px 40px;
        gap: 20px;
        border-radius: 16px;
        font-size: 20px;
        line-height: 28px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram,
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google {
        padding: 12px 20px;
        height: 42px;
        border-radius: 16px;
        font-size: 12px;
        line-height: 16px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram,
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google {
        border-radius: 32px;
        min-width: 173px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram svg,
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google svg {
        width: 32px;
        height: 32px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram svg,
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google svg {
        min-width: 18px;
        max-width: 18px;
        min-height: 18px;
        max-height: 18px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram:hover,
#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google:hover {
    transform: scale(1.05)
}

#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-telegram:hover svg,
#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google:hover svg {
    transform: scale(1.1)
}

#checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google {
    background: #343959
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row .register-link-buttons .btn-google svg {
        min-width: 18px;
        max-width: 18px;
        min-height: 18px;
        max-height: 18px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .registration-text {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    flex-direction: column;
    justify-content: end
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row .registration-text {
        font-size: 20px;
        gap: 6px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row .registration-text {
        font-size: 12px;
        line-height: 16px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .registration-text .registration-link {
    color: #4da6cd;
    font-weight: 500;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row .registration-text .registration-link {
        font-weight: 400
    }
}

#checkout-page .checkout-content .checkout-form .form-row .login-text,
#checkout-page .checkout-content .checkout-form .form-row .login-link {
    color: #151514;
    text-align: center;
    width: 100%;
    justify-content: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 16px
}

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

    #checkout-page .checkout-content .checkout-form .form-row .login-text,
    #checkout-page .checkout-content .checkout-form .form-row .login-link {
        font-size: 24px;
        line-height: 38px;
        margin-top: 24px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row .login-text,
    #checkout-page .checkout-content .checkout-form .form-row .login-link {
        font-size: 14px;
        line-height: 20px
    }
}

#checkout-page .checkout-content .checkout-form .form-row .login-text .login-link,
#checkout-page .checkout-content .checkout-form .form-row .login-link .login-link {
    color: #58c7f7;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    cursor: pointer
}

#checkout-page .checkout-content .checkout-form .form-row-delivery {
    flex-wrap: nowrap;
    width: 100%;
    padding: 18px;
    border-radius: 12px;
    border: .5px solid #dedede;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery {
        padding: 40px 32px;
        gap: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery {
        padding: 16px;
        flex-wrap: wrap;
        gap: 24px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__container {
    max-width: 240px !important;
    min-width: 240px !important
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__container {
        max-width: 513px !important;
        min-width: 513px !important
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__container {
        max-width: 240px !important;
        min-width: 240px !important;
        min-height: 56px;
        max-height: 56px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__container {
        min-width: 100% !important;
        max-width: 100% !important
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__input {
    padding: 0
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-number {
    max-width: 58px !important;
    min-width: 58px !important
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-number .text-field__input {
    height: 21px;
    padding-bottom: 6px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-number {
        max-width: 66px !important;
        min-width: 66px !important
    }

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-number .text-field__input {
        height: 36px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-number .text-field__input {
        height: 21px;
        padding-bottom: 6px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city {
    max-width: 240px !important;
    min-width: 240px !important;
    height: 24px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city {
        max-width: 240px !important;
        min-width: 240px !important
    }

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .text-field__input {
        min-height: 36px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city {
        height: 16px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city {
        min-width: 100% !important;
        max-width: 100% !important
    }

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .text-field__input {
        min-height: 21px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list {
    display: flex;
    width: 100%;
    min-height: max-content;
    max-height: 380px;
    padding: 12px 14px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    border-radius: 12px;
    border: 1px solid #dedede;
    background: #fff;
    box-shadow: 0 0 40px #00000026, 0 10px 40px #00000026
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list {
        padding: 14px 16px;
        gap: 10px;
        border-radius: 16px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type {
    display: flex;
    padding: 16px 12px;
    align-items: center;
    gap: 12px;
    align-self: stretch;
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    border-radius: 8px
}

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

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type {
        padding: 24px 20px;
        border-radius: 16px;
        font-size: 24px;
        line-height: 38px
    }
}

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

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type {
        font-size: 14px;
        line-height: 20px;
        display: flex;
        padding: 14px 12px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value .line,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item .line,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type .line {
    height: 16px;
    width: 2px;
    background: #dedede
}

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

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value .line,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item .line,
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type .line {
        height: 20px;
        width: 3px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value .type,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item .type,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type .type {
    color: #888;
    padding: 0
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value:hover,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__list-item:hover,
#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .type:hover {
    background: #f4f4f4
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 4px 8px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value {
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value {
        line-height: 12px;
        padding: 4px 0
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-city .select-field__value {
        line-height: 16px
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-street {
    min-width: 322px !important;
    max-width: 322px !important
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-street {
        max-width: 513px !important;
        min-width: 513px !important
    }

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-street .text-field__input {
        height: 36px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-street {
        max-width: 270px !important;
        min-width: 270px !important
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-street .text-field__input {
        height: 21px;
        padding-bottom: 6px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-street {
        max-width: 100% !important;
        min-width: 100% !important
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .input-apartment {
    min-width: 66px !important;
    max-width: 66px !important
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-apartment {
        max-width: 93px !important;
        min-width: 93px !important
    }

    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-apartment .text-field__input {
        height: 36px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-apartment .text-field__input {
        height: 21px;
        padding-bottom: 6px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-form .form-row-delivery .input-apartment {
        max-width: 58px !important;
        min-width: 58px !important
    }
}

#checkout-page .checkout-content .checkout-form .form-row-delivery .text-field__container {
    height: 68px
}

#checkout-page .checkout-content .checkout-credit__form-title {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-credit__form-title {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-credit__form-title {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-credit__form-title {
        font-size: 15px;
        line-height: 24px
    }
}

#checkout-page .checkout-content .checkout-credit__form-description {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #888
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-credit__form-description {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-credit__form-description {
        font-size: 10px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-credit__form-description {
        font-size: 12px;
        line-height: 16px
    }
}

#checkout-page .checkout-content .checkout-credit__form-value {
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 16px;
    letter-spacing: -.01em;
    color: #151514;
    margin: 16px 0
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-credit__form-value {
        margin: 24px 0;
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-credit__form-value {
        font-size: 15px;
        line-height: 12px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-credit__form-value {
        font-size: 20px;
        line-height: 16px
    }
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-content .checkout-credit__form .button {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .checkout-content .checkout-credit__form .button {
        padding: 8px 16px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .checkout-content .checkout-credit__form .button {
        padding: 8px 24px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .checkout-content .checkout-credit__form .button {
        padding: 12px 16px;
        font-size: 13px;
        line-height: 16px
    }
}

#checkout-page .container {
    padding: 48px 40px;
    background: #f0f0f0
}

@media screen and (min-width: 1920px) {
    #checkout-page .container {
        padding: 88px 80px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .container {
        padding: 48px 32px
    }
}

@media screen and (max-width: 1023px) {
    #checkout-page .container {
        padding: 32px 28px
    }
}

@media screen and (max-width: 723px) {
    #checkout-page .container {
        padding: 32px 16px
    }
}

#checkout-page .gift-checkout {
    color: #4dcc8c;
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    #checkout-page .gift-checkout {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    #checkout-page .gift-checkout {
        font-size: 14px;
        line-height: 20px
    }
}

.container-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 24px
}

@media screen and (max-width: 1359px) {
    .container-text {
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .container-text {
        gap: 8px;
        margin-top: 8px
    }
}

@media screen and (max-width: 1023px) {
    .container-text {
        gap: 4px
    }
}

@media screen and (max-width: 723px) {
    .container-text {
        margin-top: 24px;
        margin-bottom: 24px;
        padding: 0 12px
    }
}

.container-text .line {
    width: 459px;
    height: 1px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .container-text .line {
        width: 685.5px
    }
}

@media screen and (max-width: 1359px) {
    .container-text .line {
        width: 367px
    }
}

@media screen and (max-width: 1023px) {
    .container-text .line {
        width: 251px
    }
}

@media screen and (max-width: 723px) {
    .container-text .line {
        width: 103px
    }
}

.container-text .line-checkout {
    width: 100%;
    height: 1px;
    background: #dedede
}

.container-text .line-basket {
    width: 345px
}

@media screen and (min-width: 1920px) {
    .container-text .line-basket {
        width: 515.5px
    }
}

@media screen and (max-width: 1359px) {
    .container-text .line-basket {
        width: 367px
    }
}

@media screen and (max-width: 1023px) {
    .container-text .line-basket {
        width: 242px
    }
}

@media screen and (max-width: 723px) {
    .container-text .line-basket {
        width: 213px
    }
}

.container-basket-bundle {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 16px 0;
    gap: 8px;
    border-radius: 16px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .container-basket-bundle {
        padding: 24px 0;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-basket-bundle {
        padding: 16px 0
    }
}

.container-basket-bundle .products-container {
    width: 100%
}

.container-basket-bundle .bundle-text {
    overflow: hidden;
    color: #494949;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    min-width: 80px
}

@media screen and (min-width: 1920px) {
    .container-basket-bundle .bundle-text {
        font-size: 20px;
        line-height: 24px;
        min-width: 114px
    }
}

@media screen and (max-width: 1359px) {
    .container-basket-bundle .bundle-text {
        font-size: 14px;
        line-height: 20px;
        min-width: 82px;
        max-width: 82px
    }
}

@media screen and (max-width: 1359px) {
    .basket-checkout {
        margin-bottom: 0 !important;
        gap: 24px !important
    }
}

@media screen and (max-width: 723px) {
    .basket-checkout {
        gap: 32px !important
    }
}

.basket .product-price-checkout {
    margin: 0 !important
}

@media screen and (max-width: 723px) {
    .basket .product-price-checkout {
        min-width: 100% !important
    }
}

.container-total-bundle {
    display: flex;
    gap: 10px;
    align-items: center
}

.container-total-bundle .total-bundle {
    min-width: 72px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .container-total-bundle .total-bundle {
        font-size: 24px;
        line-height: 24px;
        min-width: 108px
    }
}

.product--preorder {
    color: #0a95d0;
    font-weight: 700
}

.product-total--preorder {
    color: #0a95d0 !important
}

.checkout-content-authorization {
    padding: 24px 32px 32px !important;
    gap: 24px !important
}

@media screen and (min-width: 1920px) {
    .checkout-content-authorization {
        padding: 40px 56px !important;
        gap: 28px !important
    }
}

@media screen and (max-width: 1359px) {
    .checkout-content-authorization {
        margin-bottom: 0 !important;
        padding: 20px 24px 28px !important;
        gap: 16px !important
    }
}

@media screen and (max-width: 723px) {
    .checkout-content-authorization {
        padding: 20px 16px !important
    }
}

.checkout-content-authorization .checkout-form__group {
    margin-bottom: 0 !important
}

.checkout-content-authorization .form-group__title {
    font-size: 20px;
    line-height: 28px
}

@media screen and (min-width: 1920px) {
    .checkout-content-authorization .form-group__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-content-authorization .form-group__title {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .checkout-content-authorization .form-group__title {
        font-size: 16px
    }
}

.form-delivery {
    flex-direction: column;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .form-delivery .text-field__container {
        border-radius: 16px;
        min-height: 86px;
        max-height: 86px
    }
}

@media screen and (max-width: 723px) {
    .form-delivery .text-field__container {
        min-height: max-content;
        max-height: max-content
    }
}

.form-delivery .textarea-wrapper.opened .text-field__input {
    background: transparent;
    border: none
}

@media screen and (min-width: 1920px) {
    .form-delivery .textarea-wrapper.opened .text-field__input {
        min-height: 86px;
        max-height: 86px
    }
}

.form-delivery .text-field__input {
    display: flex;
    padding: 18px;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    border-radius: 12px;
    border: .5px solid #dedede;
    background-image: url(../assets/bg-select-1920.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 58px;
    max-height: 58px
}

@media screen and (min-width: 1920px) {
    .form-delivery .text-field__input {
        padding: 32px !important;
        border-radius: 16px;
        border: 1px solid #dedede !important;
        min-height: 86px;
        max-height: 86px
    }
}

@media screen and (max-width: 1359px) {
    .form-delivery .text-field__input {
        padding: 16px;
        min-height: 52px;
        max-height: 52px;
        background-image: url(../assets/bg-select-1024.png);
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .form-delivery .text-field__input {
        background-image: url(../assets/bg-select-360.png)
    }
}

@media screen and (max-width: 723px) {
    .form-delivery .text-field__input {
        padding: 14px;
        min-height: 48px;
        max-height: 48px;
        line-height: 20px;
        font-size: 14px
    }
}

@media screen and (min-width: 1920px) {
    .form-delivery .select-arrow {
        right: 24px;
        top: 35px
    }
}

@media screen and (max-width: 1359px) {
    .form-delivery .select-arrow {
        top: 21px;
        right: 21px
    }
}

@media screen and (min-width: 1920px) {
    .form-delivery .select-arrow svg {
        width: 28px;
        height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .form-delivery .select-arrow svg {
        width: 16px;
        height: 9px
    }
}

.checkout-form-delivery {
    width: 100%
}

.checkout-form-delivery .radio-button__container {
    margin-bottom: 24px;
    padding: 18px
}

@media screen and (min-width: 1920px) {
    .checkout-form-delivery .radio-button__container {
        margin-bottom: 16px;
        padding: 40px 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-form-delivery .radio-button__container {
        padding: 24px 20px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 723px) {
    .checkout-form-delivery .radio-button__container {
        padding: 20px 16px;
        margin-bottom: 12px
    }
}

.password-container {
    position: relative
}

.password-container .password-icon {
    position: absolute;
    bottom: 12px;
    right: 0;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .password-container .password-icon {
        bottom: 21px
    }
}

@media screen and (min-width: 1920px) {
    .password-container .password-icon svg {
        width: 28px;
        height: 19px;
        bottom: 21px
    }
}

.location {
    display: flex;
    padding: 24px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    align-self: stretch;
    border-radius: 16px;
    border: 1px solid #dedede;
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .location {
        padding: 32px;
        border-radius: 24px;
        border: 2px solid #dedede
    }
}

@media screen and (max-width: 1359px) {
    .location {
        padding: 20px;
        border-radius: 14px;
        margin-bottom: 28px
    }
}

@media screen and (max-width: 723px) {
    .location {
        padding: 16px;
        border-radius: 12px;
        position: relative
    }
}

.location .phone,
.location .email {
    font-size: 14px
}

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

    .location .phone,
    .location .email {
        font-size: 20px
    }
}

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

    .location .phone,
    .location .email {
        font-size: 12px
    }
}

@media screen and (max-width: 723px) {
    .location .email {
        position: absolute;
        bottom: 14px
    }
}

@media screen and (max-width: 1359px) {
    .location .phone {
        min-width: 131px
    }
}

@media screen and (max-width: 723px) {
    .location .phone {
        padding-bottom: 22px
    }
}

@media screen and (max-width: 723px) {
    .location .line-2 {
        display: none
    }
}

@media screen and (min-width: 1920px) {
    .location .edit-btn svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .location .edit-btn svg {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 723px) {
    .location .edit-btn svg {
        width: 16px;
        height: 16px
    }
}

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

@media screen and (min-width: 1920px) {
    .location__info {
        gap: 20px
    }
}

@media screen and (max-width: 1359px) {
    .location__info {
        max-width: 528px;
        overflow-x: auto
    }
}

@media screen and (max-width: 723px) {
    .location__info {
        flex-direction: column;
        width: 100%;
        align-items: flex-start
    }
}

.location__info .line {
    height: 16px;
    width: 2px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .location__info .line {
        height: 24px;
        width: 4px
    }
}

@media screen and (max-width: 723px) {
    .location__info .line {
        height: 2px;
        width: 100%;
        opacity: .5
    }
}

.location__icon {
    width: 22px;
    height: 22px
}

@media screen and (min-width: 1920px) {
    .location__icon {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .location__icon {
        min-width: 20px;
        max-width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 723px) {
    .location__icon {
        position: absolute
    }
}

.location__city,
.location__region,
.location__change {
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px
}

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

    .location__city,
    .location__region,
    .location__change {
        font-size: 24px;
        line-height: 38px
    }
}

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

    .location__city,
    .location__region,
    .location__change {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .location__city {
        min-width: max-content
    }
}

@media screen and (max-width: 723px) {
    .location__city {
        padding-left: 26px
    }
}

.location__region {
    color: #888;
    font-weight: 500
}

.location__change {
    color: #58c7f7;
    cursor: pointer
}

@media screen and (max-width: 723px) {
    .location__change {
        position: absolute;
        right: 16px;
        top: 16px
    }
}

.select-design {
    transform: rotate(-10deg);
    aspect-ratio: 1/1;
    position: absolute;
    right: 175px;
    top: 1px;
    opacity: .5
}

.select-design svg {
    width: 44px;
    height: 44px
}

.select-design-2 {
    transform: rotate(2deg);
    aspect-ratio: 1/1;
    position: absolute;
    right: 71px;
    bottom: -25px;
    opacity: .5
}

.select-design-2 svg {
    width: 85px;
    height: 85px
}

.container-radio-btn:has(.radio-button__container.checked) {
    padding: 0
}

@media screen and (max-width: 723px) {
    .input-with-error {
        min-width: 100%;
        max-width: 100%
    }
}

.form-group-payment .input-with-phone,
.form-group-payment .input-with-error {
    display: flex;
    padding: 16px 24px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 12px;
    border: .5px solid #dedede;
    background: #f4f4f4;
    max-height: 92px;
    position: relative
}

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

    .form-group-payment .input-with-phone,
    .form-group-payment .input-with-error {
        padding: 40px 32px;
        border-radius: 24px;
        max-height: 178px
    }
}

.form-group-payment .input-with-phone svg,
.form-group-payment .input-with-error svg {
    position: absolute;
    top: 19px;
    left: 146px
}

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

    .form-group-payment .input-with-phone svg,
    .form-group-payment .input-with-error svg {
        width: 24px;
        height: 24px;
        top: 42px;
        left: 207px
    }
}

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

    .form-group-payment .input-with-phone svg,
    .form-group-payment .input-with-error svg {
        left: 128px;
        top: 18px
    }
}

.form-group-payment .text-field__container {
    min-width: 149px;
    max-width: 149px
}

@media screen and (min-width: 1920px) {
    .form-group-payment .text-field__container {
        min-width: 222px;
        max-width: 222px
    }
}

.form-group-payment .input-with-error {
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .form-group-payment .input-with-error {
        margin-top: 32px
    }
}

@media screen and (max-width: 723px) {
    .form-group-payment .input-with-error {
        min-width: 100% !important;
        max-width: 100% !important;
        margin-top: 16px
    }
}

.form-group-payment .input-with-error .text-field__input {
    border-bottom: 1px solid #ff3f5f
}

.form-group-payment .text-field__input {
    padding: 0;
    line-height: 28px
}

.form-group-payment .radio-button__container {
    margin-bottom: 12px;
    padding: 18px
}

@media screen and (min-width: 1920px) {
    .form-group-payment .radio-button__container {
        margin-bottom: 16px;
        padding: 40px 32px;
        width: 100%
    }
}

@media screen and (max-width: 1359px) {
    .form-group-payment .radio-button__container {
        padding: 24px 20px
    }
}

@media screen and (max-width: 723px) {
    .form-group-payment .radio-button__container {
        padding: 20px 16px
    }
}

.checkout-form-authorization .text-field__input {
    padding: 0;
    height: 36px
}

@media screen and (min-width: 1920px) {
    .checkout-form-authorization .text-field__input {
        height: 50px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-form-authorization .text-field__input {
        padding-bottom: 10px;
        height: 26px
    }
}

.checkout-form-authorization .form-row {
    padding: 24px 24px 32px;
    border-radius: 24px;
    border: 1px solid #dedede;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .checkout-form-authorization .form-row {
        padding: 32px 40px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-form-authorization .form-row {
        padding: 20px 24px 28px;
        gap: 32px !important
    }
}

@media screen and (max-width: 1023px) {
    .checkout-form-authorization .form-row {
        padding: 24px
    }
}

@media screen and (max-width: 723px) {
    .checkout-form-authorization .form-row {
        padding: 20px 16px !important
    }
}

.checkout-form-authorization .form-row-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .checkout-form-authorization .form-row-grid {
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-form-authorization .form-row-grid {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .checkout-form-authorization .form-row-grid {
        display: flex;
        flex-wrap: wrap
    }
}

.checkout-form-authorization .form-row-grid .text-field__container {
    min-width: 100%;
    max-width: 100%
}

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

    .checkout-form-authorization .form-row-grid .name,
    .checkout-form-authorization .form-row-grid .surname {
        max-width: 115px;
        min-width: 115px
    }
}

@media screen and (max-width: 723px) {
    .checkout-form-authorization .form-row-grid .password-container {
        width: 100%
    }
}

.checkout-total-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: sticky;
    align-self: flex-start;
    top: 124px
}

@media screen and (min-width: 1920px) {
    .checkout-total-container {
        gap: 32px;
        top: 176px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total-container {
        top: 111px
    }
}

@media screen and (max-width: 1023px) {
    .checkout-total-container {
        flex-direction: column-reverse;
        position: unset;
        width: 100%
    }
}

.promo-code {
    flex-direction: row !important;
    width: 100%;
    justify-content: space-between;
    align-items: center !important
}

@media screen and (max-width: 1023px) {
    .promo-code {
        max-height: 60px
    }
}

.promo-code .title {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .promo-code .title {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .promo-code .title {
        font-size: 14px;
        line-height: 20px
    }
}

.promo-code .icon-plus {
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .promo-code .icon-plus svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .promo-code .icon-plus svg {
        width: 18px;
        height: 18px
    }
}

.checkout-total {
    display: flex;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    height: max-content;
    min-width: 370px
}

@media screen and (min-width: 1920px) {
    .checkout-total {
        min-width: 512px;
        padding: 32px;
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total {
        min-width: 290px;
        padding: 20px;
        gap: 16px;
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    .checkout-total {
        padding: 20px 16px
    }
}

.checkout-total__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .checkout-total__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .checkout-total__title {
        font-size: 18px
    }
}

.checkout-total__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch
}

.checkout-total__list-item {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center
}

.checkout-total__list-item__name,
.checkout-total__list-item__value {
    color: #888;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

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

    .checkout-total__list-item__name,
    .checkout-total__list-item__value {
        font-size: 24px;
        line-height: 38px
    }
}

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

    .checkout-total__list-item__name,
    .checkout-total__list-item__value {
        font-size: 14px;
        line-height: 20px
    }
}

.checkout-total__list-item__value {
    color: #151514
}

@media screen and (max-width: 1023px) {
    .checkout-total__discount {
        width: 100%
    }
}

.checkout-total__discount-text {
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #dedede;
    background: #f4f4f4;
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .checkout-total__discount-text {
        padding: 20px 24px;
        font-size: 20px;
        line-height: 32px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__discount-text {
        padding: 14px;
        font-size: 12px;
        line-height: 16px
    }
}

.checkout-total__discount-sum {
    color: #4dcc8c;
    font-weight: 600
}

.checkout-total .container-total-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .checkout-total .container-total-row {
        gap: 14px
    }
}

.checkout-total__price {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch
}

.checkout-total__price-title {
    color: #888;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .checkout-total__price-title {
        font-size: 28px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__price-title {
        font-size: 16px;
        line-height: 24px
    }
}

.checkout-total__price-value {
    color: #151514;
    text-align: right;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: -.24px
}

@media screen and (min-width: 1920px) {
    .checkout-total__price-value {
        font-size: 32px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__price-value {
        font-size: 20px;
        line-height: 28px
    }
}

.checkout-total .button-checkout-total {
    padding: 20px 24px !important;
    margin-bottom: 0 !important
}

@media screen and (min-width: 1920px) {
    .checkout-total .button-checkout-total {
        border-radius: 24px !important
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total .button-checkout-total {
        padding: 18px 24px !important;
        border-radius: 16px !important
    }
}

.checkout-total .button-checkout-total:hover {
    background: #151514 !important
}

.checkout-total .checkbox-container {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .checkout-total .checkbox-container {
        font-size: 20px;
        line-height: 32px;
        padding-left: 46px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total .checkbox-container {
        font-size: 12px;
        line-height: 16px;
        padding-left: 24px
    }
}

.checkout-total__options {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .checkout-total__options {
        gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__options {
        gap: 14px
    }
}

.checkout-total .checkbox-icon {
    width: 18px;
    height: 18px
}

@media screen and (min-width: 1920px) {
    .checkout-total .checkbox-icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total .checkbox-icon {
        width: 16px;
        height: 16px
    }
}

.checkout-total .bonuse {
    color: #4dcc8c;
    font-weight: 600
}

.checkout-total__privacy {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .checkout-total__privacy {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .checkout-total__privacy {
        font-size: 12px
    }
}

.checkout-total__privacy-link {
    color: #4da6cd;
    cursor: pointer
}

.checkout-total__promocode {
    position: relative
}

.checkout-total__promocode .text-field__input {
    padding: 0
}

.checkout-total__promocode .text-field__container {
    min-height: 50px;
    max-height: 50px
}

.checkout-total__promocode-link {
    color: #58c7f7;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .checkout-total__promocode-link {
        font-size: 20px;
        line-height: 32px
    }
}

.checkout-total .promocode-message-error,
.checkout-total .promocode-message-success {
    color: #ff3f5f;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin-top: 12px
}

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

    .checkout-total .promocode-message-error,
    .checkout-total .promocode-message-success {
        font-size: 18px;
        line-height: 32px
    }
}

.checkout-total .promocode-message-success {
    color: #4dcc8c
}

.checkout-total .text-field__input--correct {
    border-bottom: 1px solid #4dcc8c
}

.checkout-total .text-field__input--error {
    border-bottom: 1px solid #ff3f5f
}

.payment-installment {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch
}

.payment-installment__header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .payment-installment__header {
        gap: 10px
    }
}

@media screen and (min-width: 1920px) {
    .payment-installment__icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .payment-installment__icon {
        width: 14px;
        height: 14px
    }
}

.payment-installment__details {
    display: flex;
    align-items: center;
    gap: 8px
}

.payment-installment__label {
    color: #888;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .payment-installment__label {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .payment-installment__label {
        font-size: 14px;
        line-height: 20px
    }
}

.payment-installment__amount,
.payment-installment__divider,
.payment-installment__term {
    color: #151514;
    text-align: right;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -.18px
}

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

    .payment-installment__amount,
    .payment-installment__divider,
    .payment-installment__term {
        font-size: 28px;
        line-height: 38px
    }
}

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

    .payment-installment__amount,
    .payment-installment__divider,
    .payment-installment__term {
        font-size: 16px;
        line-height: 24px
    }
}

.payment-installment__divider,
.payment-installment__term {
    font-size: 16px;
    letter-spacing: -.16px
}

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

    .payment-installment__divider,
    .payment-installment__term {
        font-size: 24px
    }
}

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

    .payment-installment__divider,
    .payment-installment__term {
        font-size: 14px;
        line-height: 20px
    }
}

.payment-installment__term {
    text-decoration: underline;
    text-decoration-color: #9e9e9e;
    cursor: pointer
}

.payment-installment .toggle {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 26px
}

@media screen and (min-width: 1920px) {
    .payment-installment .toggle {
        width: 56px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .payment-installment .toggle {
        width: 34px;
        height: 20px
    }
}

.payment-installment .toggle__input {
    opacity: 0;
    width: 0;
    height: 0
}

.payment-installment .toggle__input:checked+.toggle__slider {
    background-color: #8fc2d8
}

.payment-installment .toggle__input:checked+.toggle__slider:before {
    transform: translate(19px)
}

@media screen and (min-width: 1920px) {
    .payment-installment .toggle__input:checked+.toggle__slider:before {
        transform: translate(23px)
    }
}

@media screen and (max-width: 1359px) {
    .payment-installment .toggle__input:checked+.toggle__slider:before {
        transform: translate(15px)
    }
}

.payment-installment .toggle__slider {
    all: unset;
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ddd;
    transition: .3s;
    border-radius: 32px
}

.payment-installment .toggle__slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 2px;
    bottom: 2px;
    background-color: #fff;
    transition: .3s;
    border-radius: 50%
}

@media screen and (min-width: 1920px) {
    .payment-installment .toggle__slider:before {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .payment-installment .toggle__slider:before {
        width: 16px;
        height: 16px
    }
}

.icon-plus {
    cursor: pointer;
    display: inline-block;
    margin-top: 5px;
    transition: transform .3s
}

.promo-list {
    display: none;
    flex-direction: column;
    gap: 20px
}

@media screen and (max-width: 1023px) {
    .promo-list {
        width: 100%
    }
}

.promo-code.active {
    flex-direction: column !important
}

@media screen and (max-width: 1023px) {
    .promo-code.active {
        align-items: flex-start !important;
        max-height: max-content
    }
}

@media screen and (max-width: 1023px) {
    .promo-code.active .text-field__container {
        min-width: 100% !important
    }
}

.promo-code.active .promo-list {
    display: flex
}

.promo-code.active .promo-list .text-field__container {
    min-height: 36px;
    max-height: 36px
}

@media screen and (min-width: 1920px) {
    .promo-code.active .promo-list .text-field__container {
        min-height: 50px;
        max-height: 50px
    }
}

.promo-code.active .promo-list .text-field__input {
    line-height: 36px
}

.promo-code.active .icon-plus {
    display: none
}

.disabled {
    opacity: .3
}

.line-checkout {
    min-height: 1px;
    width: 100%;
    background: #f4f0f0
}

.basket-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media screen and (max-width: 1359px) {
    .basket-list__item {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px
    }
}

.user-info {
    margin: 0
}

.text-btn-mob {
    display: none
}

@media screen and (max-width: 723px) {
    .text-btn-mob {
        display: flex;
        color: #151514;
        text-align: center;
        font-feature-settings: "ss05" on;
        font-family: Headline Base;
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
        margin-bottom: 4px
    }
}

#account-page {
    padding: 48px 40px;
    background: #f0f0f0
}

@media screen and (min-width: 1920px) {
    #account-page {
        padding: 88px 80px
    }
}

@media screen and (max-width: 1359px) {
    #account-page {
        padding: 48px 32px
    }
}

@media screen and (max-width: 1023px) {
    #account-page {
        padding: 32px 28px
    }
}

@media screen and (max-width: 723px) {
    #account-page {
        padding: 32px 16px
    }
}

@media screen and (max-width: 1024px) {
    #account-page .page-header {
        padding-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    #account-page .page-header {
        padding-bottom: 16px
    }
}

#account-page .tab-pane {
    padding: 0
}

#account-page .tab-pane.account-bonuses,
#account-page .tab-pane.account-info {
    min-width: 100%
}

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

    #account-page .tab-pane.account-bonuses,
    #account-page .tab-pane.account-info {
        padding: 24px 16px
    }
}

.account-row {
    display: flex;
    align-items: flex-start;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .account-row {
        column-gap: 24px
    }
}

@media screen and (max-width: 1359px) {
    .account-row {
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .account-row {
        flex-direction: column-reverse;
        row-gap: 12px;
        column-gap: 0
    }
}

.account-sidebar {
    display: flex;
    padding: 24px 12px;
    flex-direction: column;
    align-items: center;
    height: max-content;
    gap: 12px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .account-sidebar {
        padding: 32px 24px;
        gap: 20px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar {
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar {
        width: 100%;
        padding: 20px 12px
    }
}

.account-sidebar .user-info-container {
    display: flex;
    padding: 0 12px 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .account-sidebar .user-info-container {
        padding: 0 16px 12px;
        gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .user-info-container {
        padding: 0 12px 8px
    }
}

@media screen and (min-width: 1920px) {
    .account-sidebar .user-info-container svg {
        width: 38px;
        height: 50px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .user-info-container svg {
        min-width: 23px;
        max-width: 23px;
        height: 30px
    }
}

.account-sidebar .user-info-container .card-user-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    flex: 1 0 0
}

.account-sidebar .user-info-container .card-user-info .username,
.account-sidebar .user-info-container .card-user-info .user-email {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    align-self: stretch;
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

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

    .account-sidebar .user-info-container .card-user-info .username,
    .account-sidebar .user-info-container .card-user-info .user-email {
        font-size: 24px;
        line-height: 32px
    }
}

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

    .account-sidebar .user-info-container .card-user-info .username,
    .account-sidebar .user-info-container .card-user-info .user-email {
        font-size: 14px;
        line-height: 18px
    }
}

.account-sidebar .user-info-container .card-user-info .user-email {
    color: #888;
    font-size: 12px;
    max-width: 184px
}

@media screen and (min-width: 1920px) {
    .account-sidebar .user-info-container .card-user-info .user-email {
        font-size: 18px;
        line-height: 24px;
        min-width: 282px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .user-info-container .card-user-info .user-email {
        font-size: 10px;
        line-height: 16px;
        max-width: 149px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar .user-info-container .card-user-info .user-email {
        max-width: 100%
    }
}

.account-sidebar .user-info-container .user-image__bell {
    width: 24px;
    height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .account-sidebar .user-info-container .user-image__bell {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .user-info-container .user-image__bell {
        width: 20px;
        height: 20px
    }
}

.account-sidebar .account-menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch
}

@media screen and (max-width: 1359px) {
    .account-sidebar .account-menu {
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar .account-menu {
        flex-direction: row;
        padding: 4px;
        gap: 16px;
        align-items: flex-start;
        border-radius: 8px;
        background: var(--Back-Grey, #f4f4f4)
    }
}

@media screen and (max-width: 549px) {
    .account-sidebar .account-menu {
        flex-direction: column;
        background: none;
        align-items: center;
        gap: 6px
    }
}

.account-sidebar .account-menu__item {
    display: flex !important;
    padding: 12px;
    align-items: center;
    justify-content: start;
    gap: 8px;
    text-overflow: ellipsis;
    align-self: stretch;
    border: 1px solid transparent;
    color: #494949;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    flex: 1 0 0;
    cursor: pointer;
    transition: color .25s ease
}

@media screen and (min-width: 1920px) {
    .account-sidebar .account-menu__item {
        padding: 20px 16px;
        gap: 12px;
        font-size: 20px;
        line-height: 28px;
        border-radius: 12px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .account-menu__item {
        padding: 12px;
        gap: 8px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar .account-menu__item {
        max-width: 201px;
        min-width: 153px;
        font-size: 12px;
        justify-content: center
    }
}

@media screen and (max-width: 549px) {
    .account-sidebar .account-menu__item {
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar .account-menu__item svg {
        min-width: 18px;
        max-width: 18px;
        min-height: 18px;
        max-height: 18px
    }
}

.account-sidebar .account-menu__item.active {
    color: #151514;
    border-radius: 8px;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .account-sidebar .account-menu__item.active {
        border-radius: 12px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar .account-menu__item.active {
        border-radius: 8px;
        background: #dedede
    }
}

@media screen and (max-width: 549px) {
    .account-sidebar .account-menu__item.active {
        background: #f4f4f4
    }
}

.account-sidebar .account-menu__item.active .account-menu__item-icon path {
    fill: #151514
}

.account-sidebar .account-menu__item:hover {
    border-radius: 8px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .account-sidebar .account-menu__item:hover {
        border-radius: 16px
    }
}

@media screen and (min-width: 1920px) {
    .account-sidebar .account-menu__item svg {
        width: 28px;
        height: 28px
    }
}

.line-sidebar-mob {
    display: none
}

@media screen and (max-width: 1023px) {
    .line-sidebar-mob {
        display: flex;
        position: absolute;
        right: -10px;
        width: 1px;
        height: 64px;
        background: #f4f4f4
    }
}

@media screen and (max-width: 666px) {
    .line-sidebar-mob {
        display: none
    }
}

.line-horizontal {
    display: none
}

@media screen and (max-width: 666px) {
    .line-horizontal {
        display: flex;
        height: 1px;
        width: 100%;
        background: #f4f4f4
    }
}

.line-sidebar-mob-horizontal-1 {
    display: none
}

@media screen and (max-width: 1023px) {
    .line-sidebar-mob-horizontal-1 {
        display: flex;
        position: absolute;
        top: 107px;
        height: 1px;
        width: 100%;
        background-color: #f4f4f4
    }
}

@media screen and (max-width: 666px) {
    .line-sidebar-mob-horizontal-1 {
        display: none
    }
}

.line-sidebar-mob-horizontal {
    display: none
}

@media screen and (max-width: 1023px) {
    .line-sidebar-mob-horizontal {
        display: flex;
        position: absolute;
        top: 50px;
        height: 1px;
        width: 100%;
        background-color: #f4f4f4
    }
}

@media screen and (max-width: 666px) {
    .line-sidebar-mob-horizontal {
        display: none
    }
}

.line-sidebar {
    width: 100%;
    height: 1px;
    background-color: #dedede
}

@media screen and (min-width: 1920px) {
    .line-sidebar {
        height: 2px
    }
}

.account-history {
    min-width: 100%
}

.account-history .account-content__title {
    margin-bottom: 32px;
    height: 32px
}

@media screen and (min-width: 1920px) {
    .account-history .account-content__title {
        font-size: 36px;
        line-height: 48px;
        margin-bottom: 56px;
        height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .account-history .account-content__title {
        font-size: 20px;
        line-height: 24px;
        height: 24px
    }
}

@media screen and (max-width: 723px) {
    .account-history .account-content__title {
        margin-bottom: 10px
    }
}

.account-history__left-content {
    display: flex;
    align-items: center;
    gap: 32px
}

@media screen and (min-width: 1920px) {
    .account-history__left-content {
        gap: 56px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__left-content {
        gap: 24px
    }
}

.account-history__list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .account-history__list {
        gap: 40px
    }
}

.account-history__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 24px;
    border-bottom: 1px solid #dedede
}

.account-history__item:last-child {
    margin-bottom: 0;
    border-bottom: unset;
    padding-bottom: 0
}

@media screen and (min-width: 1920px) {
    .account-history__item {
        padding: 0 0 40px
    }
}

@media screen and (max-width: 723px) {
    .account-history__item {
        height: 116px;
        align-items: flex-start;
        position: relative
    }
}

.account-history__item-price {
    min-width: 115px
}

@media screen and (min-width: 1920px) {
    .account-history__item-price {
        min-width: 175px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-price {
        min-width: 75px
    }
}

@media screen and (max-width: 723px) {
    .account-history__item-price {
        position: absolute;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        bottom: 24px;
        right: 0
    }
}

.account-history__item-info {
    min-width: 190px;
    display: flex;
    flex-direction: column;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .account-history__item-info {
        min-width: 280px;
        gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-info {
        min-width: 160px;
        gap: 2px
    }
}

.account-history__item-info .history-id {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .account-history__item-info .history-id {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-info .history-id {
        font-size: 14px;
        line-height: 20px
    }
}

.account-history__item-info .history-id-date {
    color: #888;
    font-size: 14px;
    line-height: 24px;
    margin-left: 4px
}

@media screen and (min-width: 1920px) {
    .account-history__item-info .history-id-date {
        font-size: 20px;
        line-height: 28px;
        margin-left: 8px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-info .history-id-date {
        font-size: 12px;
        line-height: 20px
    }
}

.account-history__item-info .order-cancelled {
    text-decoration: line-through
}

.account-history__item-title {
    color: #888;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .account-history__item-title {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-title {
        font-size: 10px;
        line-height: 14px;
        width: max-content;
        margin-bottom: 2px
    }
}

.account-history__item-value {
    color: #151514;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .account-history__item-value {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-value {
        font-size: 14px;
        line-height: 20px
    }
}

.account-history__item-value-text {
    color: #151514;
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .account-history__item-value-text {
        font-size: 18px;
        line-height: 32px
    }
}

.account-history__item-images {
    display: flex;
    align-items: center;
    width: 100%;
    column-gap: 8px
}

@media screen and (min-width: 1920px) {
    .account-history__item-images {
        column-gap: 12px;
        padding: 8px 0
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-images {
        column-gap: 8px
    }
}

@media screen and (max-width: 723px) {
    .account-history__item-images {
        position: absolute;
        bottom: 24px;
        column-gap: 4px;
        width: max-content
    }
}

.account-history__item-images .history-image-svg {
    background-color: #f4f4f4;
    min-width: 45px;
    min-height: 40px;
    max-width: 45px;
    max-height: 40px;
    border-radius: 12px
}

@media screen and (min-width: 1920px) {
    .account-history__item-images .history-image-svg {
        min-width: 62px;
        min-height: 55px;
        max-width: 62px;
        max-height: 55px
    }

    .account-history__item-images .history-image-svg svg {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-images .history-image-svg {
        min-width: 39px;
        min-height: 35px;
        max-width: 39px;
        max-height: 35px
    }
}

.account-history__item-images .history-image {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.account-history__item-images .history-image img {
    object-fit: cover;
    min-width: 45px;
    max-width: 45px;
    min-height: 40px;
    max-height: 40px
}

@media screen and (min-width: 1920px) {
    .account-history__item-images .history-image img {
        min-width: 62px;
        min-height: 55px;
        max-width: 62px;
        max-height: 55px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-images .history-image img {
        min-width: 39px;
        min-height: 35px;
        max-width: 39px;
        max-height: 35px
    }
}

.account-history__item-images--more {
    color: #494949;
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .account-history__item-images--more {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .account-history__item-images--more {
        font-size: 14px;
        line-height: 20px
    }
}

.account-menu__text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0
}

@media screen and (max-width: 723px) {
    .account-menu__text {
        max-width: 114px
    }
}

@media screen and (max-width: 666px) {
    .account-menu__text {
        max-width: 100%
    }
}

.line-account {
    width: 100%;
    height: 1px;
    background: #dedede
}

@media screen and (max-width: 1023px) {
    .line-account {
        display: none
    }
}

.account-content__title {
    color: #151514;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px
}

.footer-history-actions {
    display: flex;
    width: 100%;
    padding: 20px 16px;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0;
    border-radius: 16px 16px 24px 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a, 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .footer-history-actions {
        padding: 28px 16px
    }
}

@media screen and (max-width: 1359px) {
    .footer-history-actions {
        padding: 18px 16px
    }
}

.footer-history-actions__buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__buttons {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .footer-history-actions__buttons {
        flex-direction: column;
        width: 100%
    }
}

.footer-history-actions__button {
    padding: 18px 24px;
    border-radius: 12px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__button {
        padding: 24px 32px;
        border-radius: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .footer-history-actions__button {
        padding: 16px 20px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .footer-history-actions__button {
        width: 100%
    }
}

.footer-history-actions__button:hover {
    background-color: #6cd3ff
}

.footer-history-actions__button-outline {
    padding: 18px 24px;
    border-radius: 12px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__button-outline {
        padding: 24px 32px;
        border-radius: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .footer-history-actions__button-outline {
        padding: 16px 20px;
        font-size: 14px;
        line-height: 20px;
        max-height: 52px
    }
}

@media screen and (max-width: 723px) {
    .footer-history-actions__button-outline {
        width: 100%
    }
}

.footer-history-actions__button-outline:hover {
    border: 1px solid #6cd3ff;
    color: #6cd3ff
}

.footer-history-actions__contact {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    position: absolute;
    right: 26px;
    top: 30px
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__contact {
        top: 41px;
        gap: 4px
    }
}

@media screen and (max-width: 723px) {
    .footer-history-actions__contact {
        display: none
    }
}

.footer-history-actions__contact-text {
    color: #888;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__contact-text {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .footer-history-actions__contact-text {
        font-size: 12px;
        line-height: 18px
    }
}

.footer-history-actions__contact-phone {
    color: #4da6cd;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .footer-history-actions__contact-phone {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .footer-history-actions__contact-phone {
        font-size: 12px;
        line-height: 18px
    }
}

.account-service-sidebar {
    min-width: 296px !important;
    border-radius: 24px !important
}

@media screen and (min-width: 1920px) {
    .account-service-sidebar {
        max-width: 344px !important;
        min-width: 344px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-sidebar {
        max-width: 199px !important;
        min-width: 199px !important;
        border-radius: 16px !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-sidebar {
        min-width: 100% !important
    }
}

.account-service-content {
    min-width: 824px !important;
    border-radius: 24px !important;
    padding: 32px !important
}

@media screen and (min-width: 1920px) {
    .account-service-content {
        max-width: 1088px !important;
        min-width: 1088px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content {
        max-width: 689px !important;
        min-width: 689px !important;
        border-radius: 16px !important;
        padding: 24px !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-content {
        min-width: 100% !important;
        padding: 0 !important
    }
}

.account-service-content .account-history-service__item {
    gap: 32px !important;
    border-bottom: none
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item {
        gap: 48px !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-content .account-history-service__item {
        border-radius: 16px !important;
        gap: 20px !important
    }
}

.account-service-content .account-history-service__item-info {
    min-width: 190px !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-info {
        min-width: 230px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-info {
        min-width: 155px !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-content .account-history-service__item-info {
        min-width: 147px !important
    }
}

.account-service-content .account-history-service__item-info .history-service-id {
    font-size: 16px
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-info .history-service-id {
        font-size: 20px;
        line-height: 1.4
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-info .history-service-id {
        font-size: 14px;
        line-height: 1.43;
        color: #888
    }
}

.account-service-content .account-history-service__item-info .order-status-service--accepted,
.account-service-content .account-history-service__item-info .order-status-service--confirmed,
.account-service-content .account-history-service__item-info .order-status-service--sent,
.account-service-content .account-history-service__item-info .order-status-service--arrived,
.account-service-content .account-history-service__item-info .order-status-service--canceled,
.account-service-content .account-history-service__item-info .order-status-service--diagnosed,
.account-service-content .account-history-service__item-info .order-status-service--repair {
    color: #58c7f7 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    display: flex;
    gap: 8px;
    align-items: center
}

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

    .account-service-content .account-history-service__item-info .order-status-service--accepted,
    .account-service-content .account-history-service__item-info .order-status-service--confirmed,
    .account-service-content .account-history-service__item-info .order-status-service--sent,
    .account-service-content .account-history-service__item-info .order-status-service--arrived,
    .account-service-content .account-history-service__item-info .order-status-service--canceled,
    .account-service-content .account-history-service__item-info .order-status-service--diagnosed,
    .account-service-content .account-history-service__item-info .order-status-service--repair {
        font-size: 20px;
        line-height: 28px
    }
}

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

    .account-service-content .account-history-service__item-info .order-status-service--accepted,
    .account-service-content .account-history-service__item-info .order-status-service--confirmed,
    .account-service-content .account-history-service__item-info .order-status-service--sent,
    .account-service-content .account-history-service__item-info .order-status-service--arrived,
    .account-service-content .account-history-service__item-info .order-status-service--canceled,
    .account-service-content .account-history-service__item-info .order-status-service--diagnosed,
    .account-service-content .account-history-service__item-info .order-status-service--repair {
        font-size: 12px;
        line-height: 1.33
    }
}

.account-service-content .account-history-service__item-info .order-status-service--confirmed,
.account-service-content .account-history-service__item-info .order-status-service--diagnosed {
    color: #d357c0 !important
}

.account-service-content .account-history-service__item-info .order-status-service--sent {
    color: #4dcc8c !important
}

.account-service-content .account-history-service__item-info .order-status-service--arrived {
    color: #6d20cf !important
}

.account-service-content .account-history-service__item-info .order-status-service--canceled {
    color: #eb606c !important
}

.account-service-content .account-history-service__item-info .order-status-service--repair {
    color: #6080eb !important
}

.account-service-content .account-history-service__item-info .accepted-ramaining-days {
    color: #494949;
    font-family: Inter;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.33
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-info .accepted-ramaining-days {
        font-size: 16px;
        line-height: 1.5
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-info .accepted-ramaining-days {
        font-size: 10px;
        line-height: 1.4
    }
}

.account-service-content .account-history-service__item .divider {
    width: 1px;
    height: 12px;
    background: #dedede
}

.account-service-content .account-history-service__item-title {
    font-size: 12px !important;
    line-height: 1.33 !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-title {
        font-size: 18px !important
    }
}

.account-service-content .account-history-service__item-value {
    font-size: 16px !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-value {
        font-size: 20px !important;
        line-height: 1.4 !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-value {
        font-size: 14px !important;
        line-height: 1.43 !important
    }
}

.account-service-content .account-history-service__item-value-text {
    font-size: 12px !important;
    line-height: 2 !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-value-text {
        font-size: 18px !important;
        line-height: 1.55 !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-content .account-history-service__item-value-text {
        font-size: 10px !important;
        line-height: 2 !important
    }
}

.account-service-content .account-history-service__item-images {
    min-width: 194px !important;
    max-width: 194px !important;
    padding: unset !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-images {
        min-width: 241px !important;
        max-width: 241px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-images {
        min-width: 159px !important;
        max-width: 159px !important
    }
}

@media screen and (max-width: 768px) {
    .account-service-content .account-history-service__item-images {
        min-width: 100% !important;
        max-width: 100% !important
    }
}

.account-service-content .account-history-service__item-images .img {
    min-width: 50px !important;
    max-width: 50px !important;
    min-height: 40px !important;
    max-height: 40px !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-images .img {
        min-width: 60px !important;
        max-width: 60px !important;
        min-height: 48px !important;
        max-height: 48px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-images .img {
        min-width: 40px !important;
        max-width: 40px !important;
        min-height: 32px !important;
        max-height: 32px !important
    }
}

.account-service-content .account-history-service__item-images .img img {
    min-width: 50px !important;
    max-width: 50px !important;
    min-height: 40px !important;
    max-height: 40px !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-images .img img {
        min-width: 60px !important;
        max-width: 60px !important;
        min-height: 48px !important;
        max-height: 48px !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-images .img img {
        min-width: 40px !important;
        max-width: 40px !important;
        min-height: 32px !important;
        max-height: 32px !important
    }
}

.account-service-content .account-history-service__item-button {
    margin-left: 0 !important
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-button {
        margin-left: 42px !important
    }
}

.account-service-content .account-history-service__item-button .button-details {
    padding: 18px 24px !important;
    color: #151514 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    border-radius: 16px !important;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .account-service-content .account-history-service__item-button .button-details {
        font-size: 20px !important;
        line-height: 1.9 !important
    }
}

@media screen and (max-width: 1024px) {
    .account-service-content .account-history-service__item-button .button-details {
        padding: 14px 16px !important;
        font-size: 12px !important;
        line-height: 1.33 !important
    }
}

.order-service-detail-modal {
    border-radius: 24px !important
}

@media screen and (max-width: 1024px) {
    .order-service-detail-modal {
        border-radius: 16px !important
    }
}

.order-status-service--accepted {
    color: #58c7f7;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.43;
    display: flex;
    gap: 8px;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .order-status-service--accepted {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .order-status-service--accepted {
        font-size: 12px;
        line-height: 1.33
    }
}

.product-service-item__name {
    display: -webkit-box;
    width: 300px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .product-service-item__name {
        min-width: 496px
    }
}

@media screen and (max-width: 1024px) {
    .product-service-item__name {
        max-width: 252px
    }
}

@media screen and (max-width: 768px) {
    .product-service-item__name {
        width: 100%;
        -webkit-line-clamp: 2
    }
}

.accepted-ramaining-days {
    color: #494949;
    font-family: Inter;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.33
}

@media screen and (min-width: 1920px) {
    .accepted-ramaining-days {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (max-width: 1024px) {
    .accepted-ramaining-days {
        font-size: 10px;
        line-height: 1.4
    }
}

.divider {
    width: 1px;
    height: 12px;
    background: #dedede
}

.order-status-service--repair {
    color: #6080eb !important
}

#order-page {
    margin-bottom: 30%
}

@media screen and (max-width: 1024px) {
    #order-page .page-header {
        padding: 24px 0
    }
}

@media screen and (max-width: 768px) {
    #order-page .page-header {
        padding: 32px 0 16px
    }
}

.order-row {
    height: 200px;
    display: flex;
    align-items: flex-start;
    column-gap: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .order-row {
        height: 288px
    }
}

@media screen and (max-width: 1024px) {
    .order-row {
        height: 160px
    }
}

@media screen and (max-width: 768px) {
    .order-row {
        height: 152px
    }
}

.order-title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .order-title {
        font-size: 35px;
        line-height: 40px
    }
}

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

@media screen and (max-width: 768px) {
    .order-title {
        font-size: 18px;
        line-height: 24px
    }
}

.order-block {
    padding: 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .order-block {
        padding: 48px
    }
}

@media screen and (max-width: 1024px) {
    .order-block {
        padding: 24px
    }
}

.order-confirmation {
    width: 66%;
    height: 100%
}

@media screen and (max-width: 768px) {
    .order-confirmation {
        width: 100%;
        padding: 24px 16px
    }
}

.order-confirmation__number {
    padding: 8px;
    margin-left: 8px;
    background: #f0f6fb;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .order-confirmation__number {
        padding: 12px;
        margin-left: 14px
    }
}

@media screen and (max-width: 768px) {
    .order-confirmation__number {
        padding: 0;
        margin: 0;
        background: unset
    }
}

.order-confirmation__text {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
    padding: 8px 0
}

@media screen and (min-width: 1920px) {
    .order-confirmation__text {
        width: 90%;
        padding: 14px 0;
        font-size: 22px
    }
}

@media screen and (max-width: 1024px) {
    .order-confirmation__text {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .order-confirmation__text {
        padding: 0
    }
}

.order-confirmation__link {
    color: #58c7f7;
    text-decoration: none
}

.order-sidebar {
    width: 32%;
    height: 100%
}

@media screen and (max-width: 768px) {
    .order-sidebar {
        display: none
    }
}

.order-sidebar__text {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .order-sidebar__text {
        font-size: 22px;
        line-height: 32px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .order-sidebar__text {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

.order-blog {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    width: 66%;
    margin: 16px 0 40px;
    padding: 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .order-blog {
        padding: 48px;
        row-gap: 32px
    }
}

@media screen and (max-width: 1024px) {
    .order-blog {
        padding: 24px;
        row-gap: 18px
    }
}

@media screen and (max-width: 768px) {
    .order-blog {
        width: 100%;
        margin: 24px 0;
        padding: 24px 16px 16px;
        row-gap: 16px
    }
}

.not-found {
    margin-bottom: 30%
}

.not-found__header {
    padding: 32px 0 16px
}

@media screen and (min-width: 1920px) {
    .not-found__header {
        padding: 40px 0 24px
    }
}

.not-found__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 35px;
    line-height: 40px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .not-found__title {
        font-size: 40px;
        line-height: 45px
    }
}

@media screen and (max-width: 1024px) {
    .not-found__title {
        font-size: 26px;
        line-height: 32px
    }
}

@media screen and (max-width: 768px) {
    .not-found__title {
        font-size: 24px;
        line-height: 24px
    }
}

.not-found__container {
    max-width: 600px;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .not-found__container {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .not-found__container {
        font-size: 16px;
        line-height: 24px;
        max-width: 424px
    }
}

@media screen and (max-width: 768px) {
    .not-found__container {
        max-width: 328px
    }
}

.not-found__text {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .not-found__text {
        margin-bottom: 24px
    }
}

.not-found__list {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    padding-left: 24px
}

@media screen and (min-width: 1920px) {
    .not-found__list {
        row-gap: 24px;
        padding-left: 32px
    }
}

.not-found a {
    border: none;
    color: #58c7f7;
    text-decoration: none
}

.not-found--underline {
    border-bottom: 1px solid #151514
}

#contacts-page .account-content {
    padding: 32px
}

@media screen and (min-width: 1920px) {
    #contacts-page .account-content {
        padding: 48px
    }
}

@media screen and (max-width: 1024px) {
    #contacts-page .account-content {
        padding: 24px
    }
}

@media screen and (max-width: 768px) {
    #contacts-page .account-content {
        padding: 24px 16px
    }
}

#contacts-page p {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    #contacts-page p {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    #contacts-page p {
        font-size: 14px;
        line-height: 20px
    }
}

#contacts-page .contacts__container {
    display: grid;
    grid-template-columns: 233px 233px;
    row-gap: 32px;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    #contacts-page .contacts__container {
        grid-template-columns: 302px 302px;
        row-gap: 40px
    }
}

@media screen and (max-width: 1024px) {
    #contacts-page .contacts__container {
        grid-template-columns: 190px 190px;
        row-gap: 24px;
        margin: 24px 0
    }
}

@media screen and (max-width: 768px) {
    #contacts-page .contacts__container {
        grid-template-columns: 133px 133px;
        row-gap: 20px;
        margin: 0;
        column-gap: 20px
    }
}

#contacts-page .contacts__time {
    margin-bottom: 0
}

@media screen and (max-width: 768px) {
    #contacts-page .contacts__time {
        max-width: 295px
    }
}

#contacts-page .contacts__map {
    min-height: 400px
}

@media screen and (max-width: 768px) {
    #contacts-page .contacts__map {
        max-height: 131px;
        min-height: 131px;
        border-radius: 24px
    }
}

#contacts-page .contacts__info {
    display: flex;
    flex-direction: column;
    gap: 8px
}

#contacts-page .contacts__info a {
    color: #4da6cd;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    #contacts-page .contacts__info a {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    #contacts-page .contacts__info a {
        font-size: 14px;
        line-height: 20px
    }
}

#contacts-page .contacts__links {
    display: flex;
    flex-wrap: wrap
}

#contacts-page .contacts__links span {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #4da6cd;
    display: inline-block;
    margin-right: 3px
}

@media screen and (min-width: 1920px) {
    #contacts-page .contacts__links span {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    #contacts-page .contacts__links span {
        font-size: 14px;
        line-height: 20px
    }
}

#contacts-page .contacts iframe {
    height: 456px
}

@media screen and (min-width: 1920px) {
    #contacts-page .contacts iframe {
        height: 576px
    }
}

@media screen and (max-width: 768px) {
    #contacts-page .contacts iframe {
        height: 256px
    }
}

@media screen and (max-width: 423px) {
    #contacts-page .contacts iframe {
        height: 208px
    }
}

.certificate-page {
    padding: 0 40px
}

@media screen and (max-width: 1023px) {
    .certificate-page {
        padding: 0 16px
    }
}

.certificate-page .product-page__wrapper-certificate {
    width: 100%
}

.certificate-page .certificate {
    display: flex;
    justify-content: space-evenly;
    align-items: flex-start;
    align-self: stretch;
    background: #fff
}

.certificate-page .certificate-container {
    display: flex;
    padding-bottom: 72px;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    border-radius: 40px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container {
        gap: 32px;
        padding-bottom: 80px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container {
        padding-bottom: 48px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container {
        gap: 32px;
        flex-direction: column;
        padding-bottom: 40px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container {
        gap: 24px
    }
}

.certificate-page .certificate-container .certificate__content {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch
}

.certificate-page .certificate .swiper-gallery-certificate {
    border-radius: 4px;
    max-width: 719px;
    height: 617px
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate .swiper-gallery-certificate {
        max-width: 533px;
        height: 457px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate .swiper-gallery-certificate {
        max-width: 328px;
        height: 325px
    }
}

.certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate {
    align-items: center
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate {
        height: 750px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate {
        height: 457px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate {
        height: 482px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate {
        height: 325px
    }
}

.certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color,
.certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next {
    display: flex;
    justify-content: center;
    align-items: center
}

.certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color img,
.certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next img {
    width: 500px;
    height: 350px
}

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

    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color img,
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next img {
        width: 700px;
        height: 490px
    }
}

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

    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color img,
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next img {
        width: 357px;
        height: 250px
    }
}

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

    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color img,
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next img {
        width: 457px;
        height: 320px
    }
}

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

    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .swiper-slide-color img,
    .certificate-page .certificate .swiper-gallery-certificate .swiper-wrapper-active-certificate .next img {
        width: 229px;
        height: 160px
    }
}

.certificate-page .certificate .certificate-row {
    justify-content: space-between
}

.certificate-page .certificate-container__content-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    min-width: 431px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right {
        min-width: 620px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right {
        min-width: 345px;
        max-width: 345px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right {
        min-width: 100%
    }
}

.certificate-page .certificate-container__content-right .container-parameters {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-parameters {
        display: none
    }
}

.certificate-page .certificate-container__content-right .container-parameters .parameters {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch
}

.certificate-page .certificate-container__content-right .container-parameters .parameters .article {
    color: #888;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-parameters .parameters .article {
        font-size: 16px;
        line-height: 24px
    }
}

.certificate-page .certificate-container__content-right .container-parameters .parameters .title {
    color: #151514;
    font-family: Headline Base;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    width: 328px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-parameters .parameters .title {
        font-size: 36px;
        line-height: 48px;
        width: 465px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-parameters .parameters .title {
        font-size: 20px;
        line-height: 28px
    }
}

.certificate-page .certificate-container__content-right .container-parameters .parameters .subtitle {
    color: #151514;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-parameters .parameters .subtitle {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-parameters .parameters .subtitle {
        font-size: 14px;
        line-height: 20px
    }
}

.certificate-page .certificate-container__content-right .container-price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    margin: 16px 0 32px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price {
        margin: 12px 0 40px;
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-price {
        gap: 24px;
        margin: 4px 0 28px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-price {
        width: 360px;
        margin: 8px 0 24px;
        width: 100%
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container__content-right .container-price {
        margin: 16px 0 24px
    }
}

.certificate-page .certificate-container__content-right .container-price .container-current-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 230px;
    height: 68px;
    position: relative;
    transition: height .3s ease-in-out;
    border-radius: 12px;
    border: 2px solid #58c7f7;
    background-color: #fff;
    text-overflow: ellipsis
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price {
        width: 296px;
        height: 84px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price {
        width: 213px;
        height: 60px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price {
        width: 296px;
        height: 84px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price {
        width: 196px;
        height: 60px
    }
}

.certificate-page .certificate-container__content-right .container-price .container-current-price .current-price {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 18px 20px;
    align-items: center;
    justify-content: space-between;
    border-radius: 12px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price {
        min-width: 296px;
        padding: 18px 24px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price {
        padding: 10px 18px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price {
        padding: 18px 24px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price {
        padding: 10px 18px
    }
}

.certificate-page .certificate-container__content-right .container-price .container-current-price .current-price .price {
    color: #151514;
    font-family: Headline Base;
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    text-overflow: ellipsis;
    width: 150px;
    overflow: hidden;
    white-space: nowrap
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price .price {
        font-size: 40px;
        width: 190px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price .price {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price .price {
        font-size: 40px;
        line-height: 48px;
        width: 190px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container__content-right .container-price .container-current-price .current-price .price {
        font-size: 28px;
        line-height: 32px
    }
}

.certificate-page .certificate-container__content-right .container-price .container-current-price .card-configuration {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch
}

.certificate-page .certificate-container__content-right .container-price .card-configuration__design {
    color: var(--Text-Grey-main, #888);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price .card-configuration__design {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page .certificate-container__content-right .container-price .card-configuration__design {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .certificate-page .certificate-container__content-right .container-price .card-configuration__design {
        font-size: 12px;
        line-height: 16px
    }
}

.certificate-page .certificate-container__content-right .container-price .design-color {
    color: #151514
}

.certificate-page .certificate-container__content-right .container-price .list-colours {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px
}

@media screen and (min-width: 1920px) {
    .certificate-page .certificate-container__content-right .container-price .list-colours {
        margin-top: 16px
    }
}

.certificate-page .certificate-container__content-right .container-price .list-colours .active-color {
    display: flex;
    padding: 8px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    box-sizing: border-box
}

.certificate-page .certificate-container__content-right .container-price .list-colours .selected {
    border: 1px solid var(--Text-Link, #58c7f7);
    padding: 8px 12px
}

.certificate-page .certificate-container__content-right .container-price .list-colours .not-active-color {
    border: none;
    padding: 8px 12px
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-red,
.certificate-page .certificate-container__content-right .container-price .list-colours .color-purple,
.certificate-page .certificate-container__content-right .container-price .list-colours .color-pink,
.certificate-page .certificate-container__content-right .container-price .list-colours .color-black,
.certificate-page .certificate-container__content-right .container-price .list-colours .color-green,
.certificate-page .certificate-container__content-right .container-price .list-colours .color-yellow {
    width: 29px;
    height: 20px;
    border-radius: 2px;
    background: var(--yellow-card-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

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

    .certificate-page .certificate-container__content-right .container-price .list-colours .color-red,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-purple,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-pink,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-black,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-green,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-yellow {
        width: 46px;
        height: 32px;
        border-radius: 8px
    }
}

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

    .certificate-page .certificate-container__content-right .container-price .list-colours .color-red,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-purple,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-pink,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-black,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-green,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-yellow {
        width: 34px;
        height: 24px
    }
}

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

    .certificate-page .certificate-container__content-right .container-price .list-colours .color-red,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-purple,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-pink,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-black,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-green,
    .certificate-page .certificate-container__content-right .container-price .list-colours .color-yellow {
        width: 29px;
        height: 20px
    }
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-black {
    background: var(--black-card-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-red {
    background: var(--red-card-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-purple {
    background: #8a76e7
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-pink {
    background: #d661a1
}

.certificate-page .certificate-container__content-right .container-price .list-colours .color-green {
    background: #4c6483
}

.container-code-mob {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 100%
}

.container-parameters-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .container-parameters-mobile {
        display: flex;
        width: 100%;
        align-items: flex-start;
        flex-direction: column;
        gap: 12px
    }

    .container-parameters-mobile .article {
        color: #888;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 16px
    }

    .container-parameters-mobile .title {
        color: #151514;
        font-feature-settings: "ss05" on;
        font-family: Headline Base;
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
        margin-bottom: 8px
    }

    .container-parameters-mobile .subtitle {
        color: #151514;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .container-parameters-mobile .article {
        font-size: 10px;
        line-height: 14px
    }

    .container-parameters-mobile .title {
        font-size: 20px
    }
}

.certificate-price__list {
    display: none;
    position: absolute;
    top: 66px;
    z-index: 0;
    width: 230px;
    background-color: #fff;
    border: 2px solid #58c7f7;
    border-top: 0;
    border-radius: 0 0 12px 12px;
    transition: max-height .1s ease-in-out, opacity .1s ease-in-out
}

@media screen and (min-width: 1920px) {
    .certificate-price__list {
        display: none;
        top: 82px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-price__list {
        top: 58px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-price__list {
        top: 82px
    }
}

@media screen and (max-width: 723px) {
    .certificate-price__list {
        top: 58px
    }
}

.container-current-price--active {
    z-index: 10;
    border-bottom: 2px solid #dedede !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important
}

.container-current-price--active .certificate-price__list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    z-index: 4
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list {
        width: 296px
    }
}

@media screen and (max-width: 1359px) {
    .container-current-price--active .certificate-price__list {
        width: 213px
    }
}

@media screen and (max-width: 1023px) {
    .container-current-price--active .certificate-price__list {
        width: 296px
    }
}

@media screen and (max-width: 723px) {
    .container-current-price--active .certificate-price__list {
        width: 196px
    }
}

.container-current-price--active .certificate-price__list .certificate-price__list-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 20px 18px;
    gap: 8px;
    color: #151514;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list .certificate-price__list-item {
        padding: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .container-current-price--active .certificate-price__list .certificate-price__list-item {
        padding: 16px 18px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .container-current-price--active .certificate-price__list .certificate-price__list-item {
        padding: 20px 24px
    }
}

@media screen and (max-width: 723px) {
    .container-current-price--active .certificate-price__list .certificate-price__list-item {
        padding: 16px 18px
    }
}

.container-current-price--active .certificate-price__list .certificate-price__list-item:hover {
    background: #e2f6ff
}

.container-current-price--active .certificate-price__list .amount-price {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 20px 24px;
    border-radius: 0 0 12px 12px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list .amount-price {
        padding: 18px 24px 24px;
        gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .container-current-price--active .certificate-price__list .amount-price {
        padding: 10px 18px 14px
    }
}

@media screen and (max-width: 1023px) {
    .container-current-price--active .certificate-price__list .amount-price {
        padding: 18px 24px 24px
    }
}

@media screen and (max-width: 723px) {
    .container-current-price--active .certificate-price__list .amount-price {
        padding: 10px 18px 14px
    }
}

.container-current-price--active .certificate-price__list .input {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list .input {
        gap: 12px
    }
}

.container-current-price--active .certificate-price__list .input-text {
    color: #888;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list .input-text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .container-current-price--active .certificate-price__list .input-text {
        font-size: 12px;
        line-height: 16px
    }
}

.container-current-price--active .certificate-price__list .editable {
    display: inline-block;
    width: 100%;
    padding-bottom: 8px;
    text-align: left;
    border-bottom: 1px solid #dedede;
    white-space: pre;
    overflow-wrap: break-word;
    overflow: visible;
    color: #151514;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    outline: none;
    caret-color: auto;
    -webkit-user-select: text;
    user-select: text
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list .editable {
        font-size: 24px;
        line-height: 38px;
        padding-bottom: 12px
    }
}

.container-current-price--active .certificate-price__list .editable:empty:before {
    content: "​"
}

.container-current-price--active .certificate-price__list button {
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 18px 24px;
    background: #dedede;
    color: #fff;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .container-current-price--active .certificate-price__list button {
        padding: 24px 16px;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .container-current-price--active .certificate-price__list button {
        padding: 16px 24px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .container-current-price--active .certificate-price__list button {
        padding: 16px
    }
}

.container-current-price--active .certificate-price__list button.active {
    background-color: #58c7f6
}

.certificate-page-offer {
    display: flex;
    padding: 24px;
    justify-content: space-between;
    align-items: center;
    border-radius: 16px;
    border: 1px solid #dedede;
    width: max-content
}

@media screen and (min-width: 1920px) {
    .certificate-page-offer {
        padding: 40px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page-offer {
        width: unset
    }
}

.certificate-page-offer .offer-text,
.certificate-page-offer .offer-important {
    font-size: 16px;
    line-height: 24px;
    font-style: normal
}

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

    .certificate-page-offer .offer-text,
    .certificate-page-offer .offer-important {
        font-size: 24px;
        line-height: 38px
    }
}

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

    .certificate-page-offer .offer-text,
    .certificate-page-offer .offer-important {
        font-size: 14px;
        line-height: 20px
    }
}

.certificate-page-offer .offer-text {
    color: #151514;
    font-weight: 400;
    width: 100%
}

.certificate-page-offer .offer-important {
    color: #eb606c;
    font-weight: 600
}

@media screen and (max-width: 1023px) {
    .certificate-page-guarantee__title {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 723px) {
    .certificate-page-guarantee__title {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.certificate-page-guarantee__subtitle {
    display: none;
    color: #888;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    padding-top: 12px
}

@media screen and (min-width: 1920px) {
    .certificate-page-guarantee__subtitle {
        font-size: 20px;
        line-height: 28px;
        padding-top: 16px
    }
}

@media screen and (max-width: 1359px) {
    .certificate-page-guarantee__subtitle {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .certificate-page-guarantee__subtitle {
        font-size: 14px;
        line-height: 20px
    }
}

.photo-instruction-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 56px;
    margin-bottom: 72px
}

@media screen and (max-width: 1023px) {
    .photo-instruction-container {
        flex-direction: column;
        gap: 24px
    }
}

@media screen and (max-width: 723px) {
    .photo-instruction-container {
        display: none
    }
}

.photo-instruction-container .instruction-1360 {
    display: block
}

@media screen and (min-width: 1920px),
screen and (max-width: 1359px),
screen and (max-width: 1023px) {
    .photo-instruction-container .instruction-1360 {
        display: none
    }
}

.photo-instruction-container .instruction-1920 {
    display: none
}

@media screen and (min-width: 1920px) {
    .photo-instruction-container .instruction-1920 {
        display: block
    }
}

@media screen and (max-width: 1359px) {
    .photo-instruction-container .instruction-1920 {
        display: block;
        width: 400px;
        height: 400px
    }
}

@media screen and (max-width: 1023px) {
    .photo-instruction-container .instruction-1920 {
        display: none
    }
}

.photo-instruction-container .instruction-768 {
    display: none
}

@media screen and (min-width: 1920px),
screen and (max-width: 1359px),
screen and (max-width: 723px) {
    .photo-instruction-container .instruction-768 {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .photo-instruction-container .instruction-768 {
        display: block
    }
}

.photo-instruction-container__container-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .photo-instruction-container__container-text {
        gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .photo-instruction-container__container-text {
        gap: 16px
    }
}

.photo-instruction-container__container-text .title {
    color: #151514;
    font-feature-settings: "ss05" on;
    font-family: Headline Base;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .photo-instruction-container__container-text .title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1023px) {
    .photo-instruction-container__container-text .title {
        font-size: 18px;
        line-height: 24px
    }
}

.photo-instruction-container__container-text .description {
    color: #151514;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .photo-instruction-container__container-text .description {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .photo-instruction-container__container-text .description {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page__text-certificate:last-of-type {
    margin-bottom: 32px
}

@media screen and (min-width: 1920px) {
    .product-page__text-certificate:last-of-type {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-page__text-certificate:last-of-type {
        margin-bottom: 24px
    }
}

.icon--rotated {
    transform: rotate(180deg)
}

.modal-certificate {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000c;
    justify-content: center;
    align-items: center
}

@media screen and (max-width: 1023px) {
    .modal-certificate {
        max-width: 768px !important;
        min-width: 360px !important
    }
}

.modal-certificate .modal-content-certificate {
    position: relative;
    width: 100%;
    height: 100%
}

.active-color.hover {
    border-radius: 8px;
    outline: 1px solid #dedede;
    box-sizing: border-box
}

.button-certificate {
    position: absolute;
    bottom: 50%;
    z-index: 999;
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 0 16px;
    align-items: center
}

.swiper-button-prev_certificate,
.swiper-button-next_certificate {
    position: absolute;
    transform: translateY(-50%);
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 4;
    transition: transform .3s ease, border-color .3s ease;
    border: 1px solid #dedede;
    box-shadow: 0 0 24px #0000001a;
    opacity: .9;
    width: 64px;
    height: 64px
}

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

    .swiper-button-prev_certificate,
    .swiper-button-next_certificate {
        width: 80px;
        height: 80px
    }
}

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

    .swiper-button-prev_certificate,
    .swiper-button-next_certificate {
        width: 48px;
        height: 48px
    }
}

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

    .swiper-button-prev_certificate,
    .swiper-button-next_certificate {
        width: 38px;
        height: 38px
    }
}

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

    .swiper-button-prev_certificate,
    .swiper-button-next_certificate {
        width: 32px;
        height: 32px
    }
}

.swiper-button-prev_certificate:hover,
.swiper-button-next_certificate:hover {
    transform: translateY(-50%) scale(1.05);
    border: 1px solid #4da6cd
}

.swiper-button-prev_certificate svg,
.swiper-button-next_certificate svg {
    position: absolute;
    width: 16px;
    height: 28px;
    fill: #888;
    transition: fill .3s ease;
    left: 25px
}

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

    .swiper-button-prev_certificate svg,
    .swiper-button-next_certificate svg {
        width: 20px;
        height: 35px;
        left: 31px
    }
}

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

    .swiper-button-prev_certificate svg,
    .swiper-button-next_certificate svg {
        width: 12px;
        height: 21px;
        left: 19px
    }
}

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

    .swiper-button-prev_certificate svg,
    .swiper-button-next_certificate svg {
        width: 10px;
        height: 16px;
        left: 14px
    }
}

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

    .swiper-button-prev_certificate svg,
    .swiper-button-next_certificate svg {
        width: 8px;
        height: 14px;
        left: 12px
    }
}

.swiper-button-prev_certificate svg {
    transform: rotate(180deg);
    position: absolute;
    left: 22px
}

@media screen and (min-width: 1920px) {
    .swiper-button-prev_certificate svg {
        top: 28%;
        left: 28px
    }
}

@media screen and (max-width: 1359px) {
    .swiper-button-prev_certificate svg {
        top: 27%;
        left: 16px
    }
}

@media screen and (max-width: 1023px) {
    .swiper-button-prev_certificate svg {
        left: 12px
    }
}

@media screen and (max-width: 723px) {
    .swiper-button-prev_certificate svg {
        top: 26%;
        left: 10px
    }
}

.swiper-button-next_certificate {
    right: 25px
}

.swiper-button-next_certificate svg {
    position: absolute;
    right: 18px;
    z-index: 4
}

@media screen and (min-width: 1920px) {
    .swiper-button-next_certificate svg {
        right: 40px
    }
}

@media screen and (max-width: 1359px) {
    .swiper-button-next_certificate svg {
        right: 16px
    }
}

@media screen and (max-width: 723px) {
    .swiper-button-next_certificate svg {
        right: 3px
    }
}

.product-page-tabs__row-certificate {
    grid-template-columns: repeat(3, 1fr)
}

@media screen and (min-width: 1920px) {
    .item-column-certificate {
        width: 664px !important
    }
}

@media screen and (max-width: 1359px) {
    .item-column-certificate {
        width: 415px !important
    }
}

.price-certificate,
.price-total-certificate {
    width: 85px;
    text-align: end
}

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

    .price-certificate,
    .price-total-certificate {
        width: 108px;
        text-align: end
    }
}

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

    .price-certificate,
    .price-total-certificate {
        width: 65px;
        text-align: start
    }
}

.price-total-certificate {
    color: #6b4ad9;
    font-weight: 600
}

@media screen and (max-width: 1359px) {
    .price-total-certificate {
        text-align: start
    }
}

@media screen and (max-width: 1023px) {
    .price-total-certificate {
        min-width: 74px
    }
}

.gallery-modal__wrapper-certificate,
.gallery-certificate-popup {
    height: 100%
}

@media screen and (max-width: 1023px) {
    .gallery-certificate-popup {
        height: 120%;
        padding: 0;
        max-width: 768px;
        width: 100%
    }
}

.swiper-certificate-thumbs {
    margin: 0
}

@media screen and (max-width: 1359px) {
    .swiper-certificate-thumbs .swiper-slide {
        min-width: 56px !important;
        max-width: 56px !important;
        min-height: 44px !important;
        max-height: 44px !important
    }
}

@media screen and (max-width: 1023px) {
    .swiper-certificate-thumbs .swiper-slide {
        min-width: 70px !important;
        max-width: 70px !important;
        min-height: 56px !important;
        max-height: 56px !important
    }
}

.swiper-slide-certificate {
    min-width: 57px;
    max-width: 57px;
    min-height: 40px;
    max-height: 40px;
    border-radius: 4px !important
}

@media screen and (min-width: 1920px) {
    .swiper-slide-certificate {
        min-width: 80px;
        max-width: 80px;
        min-height: 56px;
        max-height: 56px
    }
}

@media screen and (max-width: 1359px) {
    .swiper-slide-certificate {
        min-width: 43px;
        max-width: 43px;
        min-height: 30px;
        max-height: 30px
    }
}

@media screen and (max-width: 1023px) {
    .swiper-slide-certificate {
        min-width: 50px !important;
        max-width: 50px !important;
        min-height: 35px !important;
        max-height: 35px !important;
        border-radius: 4px !important
    }
}

.product-page-price-certificate {
    margin: 0;
    flex-wrap: nowrap
}

.checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.product-page-guarantee-certificate {
    margin: 0 !important
}

.price-error {
    color: #ff3f5f;
    font-size: 12px;
    line-height: 16px;
    display: none
}

@media screen and (max-width: 1359px) {
    .price-error {
        font-size: 10px
    }
}

@media screen and (max-width: 1023px) {
    .price-error {
        font-size: 12px
    }
}

@media screen and (max-width: 723px) {
    .price-error {
        font-size: 10px
    }
}

.price-error.visible {
    display: block
}

.faq-certificate {
    padding-bottom: 56px;
    margin-bottom: 0 !important
}

@media screen and (min-width: 1920px) {
    .faq-certificate {
        padding-bottom: 80px
    }
}

@media screen and (max-width: 1359px) {
    .faq-certificate {
        padding-bottom: 48px
    }
}

@media screen and (max-width: 1023px) {
    .faq-certificate {
        padding-bottom: 32px
    }
}

.faq-certificate:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background: #dedede;
    transition: width .25s ease
}

.container-banner-certificate {
    position: relative !important
}

.container-banner-certificate {
    position: relative;
    display: flex;
    padding-bottom: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    height: 100%
}

.container-banner-certificate .swiper-wrapper-certificate-banner img {
    height: auto;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .container-banner-certificate .swiper-wrapper-certificate-banner img {
        width: 100%;
        height: auto
    }
}

.container-banner-certificate .swiper-pagination-certificate {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    bottom: 24px;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px
}

.container-banner-certificate .swiper-pagination-certificate .pagination-item_certificate {
    width: 50px;
    height: 8px;
    border-radius: 80px;
    background: #dedede;
    border: none;
    cursor: pointer;
    transition: opacity .3s ease
}

@media screen and (max-width: 768px) {
    .container-banner-certificate .swiper-pagination-certificate .pagination-item_certificate {
        width: 40px
    }
}

@media screen and (min-width: 1920px) {
    .container-banner-certificate .swiper-pagination-certificate .pagination-item_certificate {
        width: 80px;
        height: 13px
    }
}

.container-banner-certificate .swiper-pagination-certificate .pagination-item_certificate--active {
    background: #58c7f7
}

.container-service {
    width: 100%;
    background-color: #fff;
    padding-top: 48px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-service {
        padding-top: clamp(40px, 48px - (100vw - 1360px) * .025, 48px)
    }
}

@media screen and (min-width: 1920px) {
    .container-service {
        padding-top: 34px !important;
        padding-top: unset
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .container-service {
        padding-top: clamp(32px, 40px - (100vw - 1024px) * .0133, 40px)
    }
}

@media screen and (max-width: 1024px) {
    .container-service {
        padding-top: 40px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .container-service {
        padding-top: clamp(32px, 32px + (100vw - 360px) * 0, 32px)
    }
}

@media screen and (max-width: 768px) {
    .container-service {
        padding-top: 32px
    }
}

.container-service__banner {
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    position: relative;
    margin: 0 40px
}

@media screen and (min-width: 1920px) {
    .container-service__banner {
        margin: 0 auto;
        max-width: 1840px
    }
}

@media screen and (max-width: 768px) {
    .container-service__banner {
        margin: 0 16px
    }
}

.container-service__banner img {
    border-radius: 24px;
    width: 100%;
    display: block;
    position: relative;
    z-index: 1
}

.container-service__banner .mobile-img {
    display: none
}

@media screen and (max-width: 768px) {
    .container-service__banner .desktop-img {
        display: none
    }

    .container-service__banner .mobile-img {
        display: block
    }
}

@media screen and (max-width: 768px) and (max-width: 423px) {
    .container-service__banner .mobile-img {
        height: 220px
    }
}

.container-service__banner:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 40px;
    background: linear-gradient(0deg, #0000001f, #0000001f);
    z-index: 2;
    pointer-events: none
}

.container-service__text {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    gap: 16px;
    z-index: 3
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-service__text {
        gap: clamp(16px, 16px + (100vw - 1360px) * .0286, 32px)
    }
}

@media screen and (min-width: 1920px) {
    .container-service__text {
        gap: 32px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .container-service__text {
        gap: clamp(8px, 8px + (100vw - 424px) * 0, 8px)
    }
}

@media screen and (max-width: 1024px) {
    .container-service__text {
        gap: 8px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .container-service__text {
        gap: clamp(16px, 16px + (100vw - 360px) * 0, 16px)
    }
}

@media screen and (max-width: 768px) {
    .container-service__text {
        gap: 16px
    }
}

.container-service__text-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #cef0ff;
    text-shadow: 0px 0px 100px rgba(0, 0, 0, .5);
    font-family: Headline Base;
    font-size: 40px;
    font-weight: 500;
    line-height: 1.2
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-service__text-title {
        font-size: clamp(40px, 40px + (100vw - 1360px) * .2857, 56px);
        line-height: clamp(1.2, 1.2 - (100vw - 1360px) * .000107, 1.14)
    }
}

@media screen and (min-width: 1920px) {
    .container-service__text-title {
        font-size: 56px;
        line-height: 1.14
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .container-service__text-title {
        font-size: clamp(20px, 20px + (100vw - 424px) * .02, 32px);
        line-height: clamp(1.2, 1.2 + (100vw - 424px) * .000083, 1.25)
    }
}

@media screen and (max-width: 1024px) {
    .container-service__text-title {
        font-size: 32px;
        line-height: 1.25
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .container-service__text-title {
        font-size: clamp(20px, 20px + (100vw - 360px) * 0, 20px);
        line-height: 1.2
    }
}

@media screen and (max-width: 768px) {
    .container-service__text-title {
        font-size: 20px;
        line-height: 1.2
    }
}

.container-service__text-title-span {
    color: #fff;
    font-family: Headline Base
}

.container-service__text-subtitle {
    display: flex;
    width: 548px;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    text-align: center;
    text-shadow: 0px 0px 40px #000;
    font-family: Inter;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .container-service__text-subtitle {
        font-size: clamp(20px, 20px + (100vw - 1360px) * .0143, 28px);
        width: clamp(548px, 548px + (100vw - 1360px) * .5833, 874px)
    }
}

@media screen and (min-width: 1920px) {
    .container-service__text-subtitle {
        font-size: 28px;
        width: 874px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .container-service__text-subtitle {
        font-size: clamp(14px, 14px + (100vw - 424px) * .0067, 18px);
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .container-service__text-subtitle {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .container-service__text-subtitle {
        font-size: 14px;
        line-height: 1.42;
        width: clamp(248px, 248px + (100vw - 360px) * 1, 312px)
    }
}

@media screen and (max-width: 768px) {
    .container-service__text-subtitle {
        font-size: 14px;
        line-height: 1.42;
        width: 312px
    }
}

@media screen and (max-width: 423px) {
    .container-service__text-subtitle {
        font-size: 14px;
        line-height: 1.42;
        width: 248px
    }
}

.services__title-list {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.28
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .services__title-list {
        font-size: clamp(28px, 28px + (100vw - 1360px) * .2143, 40px);
        line-height: clamp(1.28, 1.28 - (100vw - 1360px) * .000143, 1.2);
        width: clamp(100%, 100% + (100vw - 1360px) * .8571, 1840px)
    }
}

@media screen and (min-width: 1920px) {
    .services__title-list {
        font-size: 40px;
        line-height: 1.2;
        width: 1840px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .services__title-list {
        font-size: clamp(16px, 16px + (100vw - 424px) * .0133, 24px);
        line-height: clamp(1.25, 1.25 + (100vw - 424px) * .000133, 1.33)
    }
}

@media screen and (max-width: 1024px) {
    .services__title-list {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .services__title-list {
        font-size: clamp(16px, 16px + (100vw - 360px) * 0, 16px);
        line-height: 1.25
    }
}

@media screen and (max-width: 768px) {
    .services__title-list {
        font-size: 18px;
        line-height: 1.33;
        margin-left: 16px;
        margin-left: unset
    }
}

@media screen and (max-width: 423px) {
    .services__title-list {
        font-size: 16px;
        line-height: 1.25
    }
}

.service {
    padding: 56px 40px 48px;
    background: #fff
}

@media screen and (min-width: 1920px) {
    .service {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%
    }
}

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

.service__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 56px;
    margin-top: 48px
}

@media screen and (min-width: 1920px) {
    .service__container {
        grid-template-columns: repeat(3, 1fr);
        gap: 48px 98px;
        max-width: 1840px
    }
}

@media screen and (max-width: 1024px) {
    .service__container {
        margin-top: 40px;
        gap: 40px
    }
}

@media screen and (max-width: 768px) {
    .service__container {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 17px;
        margin-top: 24px
    }

    .service__container>.services__container-item:last-child:nth-child(odd) {
        grid-column: span 2
    }
}

@media screen and (max-width: 423px) {
    .service__container {
        margin-top: 16px;
        gap: 16px
    }
}

.service .services__container-item:hover {
    border: 2px solid #58c7f7
}

.service .services__container-item {
    border-radius: 18px;
    border: 2px solid #f0f6fb
}

@media screen and (min-width: 1920px) {
    .service .services__container-item {
        width: 546px;
        border-radius: 24px
    }
}

@media screen and (max-width: 768px) {
    .service .services__container-item {
        width: 100%
    }
}

.service .services__container-item .service__item {
    display: flex;
    align-items: center;
    column-gap: 16px;
    cursor: pointer
}

@media screen and (max-width: 768px) {
    .service .services__container-item .service__item {
        column-gap: 8px
    }
}

.service .services__container-item .service__item img {
    width: 100px;
    height: 80px;
    border-radius: 16px 0 0 16px !important;
    background: #f0f6fb
}

@media screen and (min-width: 1920px) {
    .service .services__container-item .service__item img {
        width: 150px;
        height: 120px;
        border-radius: 24px 0 0 24px !important
    }
}

@media screen and (max-width: 1024px) {
    .service .services__container-item .service__item img {
        width: 80px;
        height: 64px;
        object-fit: cover;
        border-radius: 12px 0 0 12px
    }
}

@media screen and (max-width: 768px) {
    .service .services__container-item .service__item img {
        width: 63px;
        height: 62px
    }
}

@media screen and (max-width: 423px) {
    .service .services__container-item .service__item img {
        width: 50px;
        height: 50px
    }
}

.service .services__container-item .service__item .service__text {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .service .services__container-item .service__item .service__text {
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .service .services__container-item .service__item .service__text {
        font-size: 14px;
        line-height: 1.42;
        width: min-content
    }
}

@media screen and (max-width: 768px) {
    .service .services__container-item .service__item .service__text {
        font-size: 12px;
        line-height: 1.33;
        width: 100%
    }
}

@media screen and (max-width: 423px) {
    .service .services__container-item .service__item .service__text {
        font-size: 10px;
        line-height: 1.4
    }
}

.service .button-container {
    display: flex;
    padding-top: 24px;
    justify-content: center;
    align-items: center;
    gap: 32px;
    align-self: stretch;
    margin-top: 56px
}

@media screen and (max-width: 768px) {
    .service .button-container {
        gap: 16px
    }
}

.service .button-container label {
    display: flex;
    padding: 32px 24px;
    justify-content: center;
    align-items: center;
    gap: 16px;
    flex: 1 0 0;
    border-radius: 28px;
    border: 2px solid #dedede
}

@media screen and (min-width: 1920px) {
    .service .button-container label {
        padding: 40px 24px;
        max-width: 904px
    }
}

@media screen and (max-width: 1024px) {
    .service .button-container label {
        padding: 28px 24px
    }
}

@media screen and (max-width: 768px) {
    .service .button-container label {
        padding: 20px 16px;
        gap: 8px;
        border-radius: 16px
    }
}

.service .button-container .button-container__radio {
    display: none
}

.service .button-container .button-container__check {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid #dedede;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .service .button-container .button-container__check {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .service .button-container .button-container__check {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 768px) {
    .service .button-container .button-container__check {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 423px) {
    .service .button-container .button-container__check {
        width: 20px;
        height: 20px
    }
}

.service .button-container .button-container__check:after {
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: transparent;
    transition: background .2s
}

@media screen and (min-width: 1920px) {
    .service .button-container .button-container__check:after {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 768px) {
    .service .button-container .button-container__check:after {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 423px) {
    .service .button-container .button-container__check:after {
        width: 10px;
        height: 10px
    }
}

.service .button-container .button-container__radio:checked+.button-container__check:after {
    background: #58c7f7
}

.service .button-container h3 {
    color: #151514;
    font-family: Headline Base;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4
}

@media screen and (min-width: 1920px) {
    .service .button-container h3 {
        font-size: 28px;
        line-height: 1.14
    }
}

@media screen and (max-width: 1024px) {
    .service .button-container h3 {
        font-size: 18px;
        line-height: 1.55
    }
}

@media screen and (max-width: 768px) {
    .service .button-container h3 {
        font-size: 16px;
        line-height: 1.25
    }
}

@media screen and (max-width: 423px) {
    .service .button-container h3 {
        font-size: 14px;
        line-height: 1.42
    }
}

.container-checkbox-error {
    margin-top: 24px !important
}

@media screen and (min-width: 1920px) {
    .container-checkbox-error {
        margin-top: 48px !important
    }
}

.container-checkbox {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    margin-top: 48px;
    margin-bottom: 48px
}

@media screen and (min-width: 1920px) {
    .container-checkbox {
        gap: 24px;
        margin-top: 0;
        margin-bottom: 64px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .container-checkbox {
        margin-top: 0;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .container-checkbox {
        margin-top: 0;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .container-checkbox {
        margin-top: 0;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 424px) {
    .container-checkbox {
        margin-top: 0;
        margin-bottom: 0
    }
}

@media screen and (max-width: 360px) {
    .container-checkbox {
        margin-top: 24px;
        margin-bottom: 0
    }
}

.checkbox-container-service {
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 24px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: Inter, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0;
    vertical-align: middle;
    color: #151514
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .checkbox-container-service {
        padding-left: 36px
    }
}

@media screen and (max-width: 1920px) {
    .checkbox-container-service {
        font-size: 24px;
        line-height: 38px;
        padding-left: 40px
    }
}

@media screen and (max-width: 1360px) {
    .checkbox-container-service {
        font-size: 16px;
        line-height: 24px;
        padding-left: 28px
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container-service {
        padding-left: 28px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .checkbox-container-service {
        padding-left: 24px;
        line-height: 20px
    }
}

.checkbox-container-service .checkbox {
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0
}

.checkbox-container-service .checkbox-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    background: #f0f0f0;
    border: 1px solid #dedede;
    border-radius: 3px;
    transition: background .25s ease
}

@media screen and (min-width: 1920px) {
    .checkbox-container-service .checkbox-icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .checkbox-container-service .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (width: 1360px) {
    .checkbox-container-service .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .checkbox-container-service .checkbox-icon {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .checkbox-container-service .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container-service .checkbox-icon {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 768px) {
    .checkbox-container-service .checkbox-icon {
        width: 16px;
        height: 16px;
        top: 4px
    }
}

.checkbox-container-service .checkbox-icon img {
    transition: opacity .25s ease;
    opacity: 0
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .checkbox-container-service .checkbox-icon img {
        width: 70%
    }
}

@media screen and (min-width: 1920px) {
    .checkbox-container-service .checkbox-icon img {
        width: 60%
    }
}

@media screen and (max-width: 1024px) {
    .checkbox-container-service .checkbox-icon img {
        width: 80%
    }
}

@media screen and (max-width: 768px) {
    .checkbox-container-service .checkbox-icon img {
        width: auto
    }
}

.checkbox-container-service .checkbox:checked~.checkbox-icon {
    background: #4dcc8c;
    border-color: #4dcc8c
}

.checkbox-container-service .checkbox:checked~.checkbox-icon img {
    opacity: 1
}

.text-field__hint {
    all: unset;
    color: #58c7f7;
    font-family: Inter;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.33;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    padding-top: 8px;
    cursor: pointer !important
}

@media screen and (min-width: 1920px) {
    .text-field__hint {
        font-size: 18px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .text-field__hint {
        font-size: 10px;
        line-height: 1.6
    }
}

@media screen and (max-width: 768px) {
    .text-field__hint {
        font-size: 12px;
        line-height: 1.5
    }
}

@media screen and (max-width: 423px) {
    .text-field__hint {
        width: 172px
    }
}

.text-field__container .text-field__error,
.text-field__container .text-field__error-textarea {
    color: #ff3f5f;
    font-family: Inter;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.33;
    position: absolute;
    left: 0;
    bottom: auto;
    top: calc(100% + 12px)
}

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

    .text-field__container .text-field__error,
    .text-field__container .text-field__error-textarea {
        font-size: 18px !important;
        line-height: 1.33 !important;
        top: calc(100% + 20px)
    }
}

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

    .text-field__container .text-field__error,
    .text-field__container .text-field__error-textarea {
        width: 282px;
        top: calc(100% + 16px)
    }
}

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

    .text-field__container .text-field__error,
    .text-field__container .text-field__error-textarea {
        width: 172px
    }
}

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

    .text-field__container .text-field__error,
    .text-field__container .text-field__error-textarea {
        width: 172px;
        top: calc(100% + 10px)
    }
}

.text-field__container.text-field--error .text-field__input {
    border-bottom: 1px solid #ff3f5f
}

@media screen and (max-width: 1024px) {
    .text-field__error-textarea {
        width: 100% !important;
        bottom: -24px !important
    }
}

.services-application__textarea-repair {
    margin-top: 48px !important;
    margin-bottom: 24px !important;
    width: 100% !important;
    box-sizing: border-box;
    display: block
}

@media screen and (min-width: 1360px) and (max-width: 1919px) {
    .services-application__textarea-repair {
        margin-top: clamp(48px, 48px + (100vw - 1360px) * .0286, 64px) !important;
        width: clamp(581px, 581px + (100vw - 1360px) * .4321, 823px) !important;
        max-width: clamp(581px, 581px + (100vw - 1360px) * .4321, 823px) !important
    }
}

@media screen and (max-width: 1359px) and (min-width: 1025px) {
    .services-application__textarea-repair {
        width: 100% !important;
        max-width: 100% !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 770px) {
    .services-application__textarea-repair {
        width: 100% !important;
        max-width: 100% !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .services-application__textarea-repair {
        margin-top: clamp(40px, 40px + (100vw - 424px) * .0133, 48px) !important
    }
}

@media screen and (max-width: 768px) {
    .services-application__textarea-repair {
        width: 100% !important;
        max-width: 100% !important
    }
}

.services-application__textarea-repair .text-field__container {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    padding-bottom: 0 !important
}

.services-application__textarea-repair .text-field__label.text-field__textarea {
    padding: 0 !important;
    margin: 0 !important;
    font-family: Inter, sans-serif !important;
    font-weight: 400 !important;
    font-size: 20px !important;
    line-height: 28px !important;
    letter-spacing: 0 !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important
}

@media screen and (min-width: 1920px) {
    .services-application__textarea-repair .text-field__label.text-field__textarea {
        font-size: 20px !important;
        line-height: 28px !important
    }
}

@media screen and (max-width: 1360px) {
    .services-application__textarea-repair .text-field__label.text-field__textarea {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 424px) {
    .services-application__textarea-repair .text-field__label.text-field__textarea {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.services-application__textarea-repair .text-field__input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important
}

@media screen and (min-width: 1920px) {
    .services-application__textarea-repair {
        margin-top: 64px !important;
        margin-bottom: 32px !important;
        width: 823px !important;
        max-width: 823px !important
    }
}

@media screen and (max-width: 1024px) {
    .services-application__textarea-repair {
        margin-top: 40px !important;
        margin-bottom: 24px !important
    }
}

@media screen and (max-width: 768px) {
    .services-application__textarea-repair {
        margin-bottom: 16px !important
    }
}

@media screen and (width: 424px) {
    .services-application__textarea-repair {
        margin-top: 32px !important;
        margin-bottom: 16px !important
    }
}

.services-application__form-repair {
    margin-block: 0 !important
}

.services-application__row-repair {
    gap: 24px;
    -webkit-gap: 24px
}

.services-application__row-repair>* {
    min-width: 0;
    width: 100%;
    box-sizing: border-box
}

@media screen and (max-width: 1024px) {
    .services-application__row-repair {
        column-gap: 32px;
        row-gap: 16px;
        -webkit-column-gap: 32px;
        -webkit-row-gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .services-application__row-repair {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px;
        -webkit-gap: 16px
    }
}

.services-application__row-repair-error {
    gap: 64px 16px !important;
    -webkit-gap: 64px 16px !important;
    column-gap: 16px !important;
    row-gap: 64px !important;
    -webkit-column-gap: 16px !important;
    -webkit-row-gap: 64px !important
}

.services-application__row-repair-error>* {
    min-width: 0;
    width: 100%;
    box-sizing: border-box
}

@media screen and (min-width: 1920px) {
    .text-field__textarea {
        font-size: 18px !important;
        line-height: 1.33 !important
    }
}

.text-block-service {
    padding: 40px !important
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block-service {
        padding: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px) !important
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .text-block-service {
        padding: 32px !important
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .text-block-service {
        padding: 32px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block-service {
        padding: clamp(16px, 16px + (100vw - 424px) * .0267, 32px) !important
    }
}

@media screen and (max-width: 1024px) {
    .text-block-service {
        padding: 32px !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .text-block-service {
        padding: clamp(16px, 16px + (100vw - 360px) * 0, 16px) !important
    }
}

@media screen and (max-width: 424px) {
    .text-block-service {
        padding: 16px !important
    }
}

@media screen and (max-width: 360px) {
    .text-block-service {
        padding: 16px !important
    }
}

.text-block-service__title {
    font-size: 32px !important;
    line-height: 1.12 !important
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block-service__title {
        font-size: 32px !important;
        line-height: 1.12 !important
    }
}

@media screen and (min-width: 1920px) {
    .text-block-service__title {
        font-size: 48px !important;
        line-height: 1.16 !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block-service__title {
        font-size: clamp(20px, 20px + (100vw - 424px) * .02, 32px) !important;
        line-height: clamp(1.2, 1.2 - (100vw - 424px) * .000133, 1.12) !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .text-block-service__title {
        font-size: 20px !important;
        line-height: 1.2 !important;
        width: 296px !important
    }
}

@media screen and (max-width: 768px) {
    .text-block-service__title {
        font-size: 20px !important;
        line-height: 1.2 !important;
        width: 296px !important;
        margin-bottom: 32px !important
    }
}

.text-block-service__item-title {
    margin-bottom: 24px !important
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block-service__item-title {
        font-size: 18px !important;
        line-height: 1.55 !important
    }
}

@media screen and (min-width: 1920px) {
    .text-block-service__item-title {
        font-size: 28px !important;
        line-height: 1.14 !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block-service__item-title {
        font-size: clamp(16px, 16px + (100vw - 424px) * .0033, 18px) !important;
        line-height: clamp(1.25, 1.25 + (100vw - 424px) * .0005, 1.55) !important;
        margin-bottom: clamp(16px, 16px + (100vw - 424px) * .0133, 24px) !important
    }
}

@media screen and (max-width: 1024px) {
    .text-block-service__item-title {
        font-size: 18px !important;
        line-height: 1.55 !important;
        margin-bottom: 16px !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .text-block-service__item-title {
        font-size: 16px !important;
        line-height: 1.25 !important;
        margin-bottom: 16px !important;
        width: 296px !important
    }
}

@media screen and (max-width: 768px) {
    .text-block-service__item-title {
        font-size: 16px !important;
        line-height: 1.25 !important;
        margin-bottom: 16px !important;
        width: 296px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block-service__item-description {
        font-size: 14px !important;
        line-height: 1.42 !important;
        margin-bottom: 24px !important
    }
}

@media screen and (min-width: 1920px) {
    .text-block-service__item-description {
        font-size: 24px !important;
        line-height: 1.58 !important;
        margin-bottom: 72px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block-service__item-description {
        font-size: clamp(14px, 14px + (100vw - 424px) * 0, 14px) !important;
        line-height: 1.42 !important
    }
}

@media screen and (max-width: 1024px) {
    .text-block-service__item-description {
        font-size: 14px !important;
        line-height: 1.42 !important
    }
}

.text-block__item-line {
    border-right: 1px solid #dedede !important;
    padding-right: 40px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block__item-line {
        padding-right: clamp(16px, 16px + (100vw - 1360px) * .4286, 40px)
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .text-block__item-line {
        padding-right: 16px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block__item-line {
        padding-right: clamp(12px, 12px + (100vw - 424px) * .0067, 16px) !important
    }
}

@media screen and (max-width: 1024px) {
    .text-block__item-line {
        padding-right: 16px !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .text-block__item-line {
        padding-right: clamp(12px, 12px + (100vw - 360px) * 0, 12px) !important
    }
}

@media screen and (max-width: 424px) {
    .text-block__item-line {
        padding-right: 12px !important
    }
}

@media screen and (max-width: 768px) {
    .text-block__item-line {
        border-right: unset !important
    }
}

.text-block__row-repair {
    gap: 40px !important
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .text-block__row-repair {
        gap: clamp(32px, 32px + (100vw - 1360px) * .1429, 40px) !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .text-block__row-repair {
        gap: clamp(32px, 32px + (100vw - 424px) * 0, 32px) !important
    }
}

@media screen and (max-width: 1024px) {
    .text-block__row-repair {
        gap: 32px !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .text-block__row-repair {
        gap: unset !important
    }
}

@media screen and (max-width: 768px) {
    .text-block__row-repair {
        gap: unset !important
    }
}

.services-block-repair {
    margin: 0 40px !important;
    padding: 32px !important;
    border-radius: 24px !important
}

@media screen and (min-width: 1920px) {
    .services-block-repair {
        margin: 0 80px !important;
        padding: 40px !important;
        border-radius: 24px !important;
        width: 1760px
    }
}

@media screen and (max-width: 1024px) {
    .services-block-repair {
        margin: 0 32px !important
    }
}

@media screen and (max-width: 768px) {
    .services-block-repair {
        margin: 0 16px !important;
        padding: 16px 16px 24px !important;
        border-radius: 16px !important
    }
}

.devices-search-center {
    border-radius: 8px !important
}

@media screen and (min-width: 1920px) {
    .devices-search-date {
        max-width: 542px !important;
        min-width: 542px !important
    }
}

.devices-filters {
    cursor: pointer;
    display: flex;
    padding: 12px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 16px;
    background: #ececec;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .devices-filters {
        gap: 12px;
        padding: 16px
    }
}

@media screen and (min-width: 1024px) {
    .devices-filters {
        min-width: 896px;
        max-width: 100%
    }
}

@media screen and (max-width: 768px) {
    .devices-filters {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
        justify-content: center;
        align-items: center;
        padding: 8px;
        border-radius: 8px
    }
}

.devices-search {
    display: flex;
    padding: 24px;
    align-items: center;
    gap: 12px;
    flex: 1 0 0;
    border-radius: 16px 8px 8px 16px;
    background: #fff;
    width: 100%;
    position: relative
}

@media screen and (min-width: 1920px) {
    .devices-search {
        min-width: 496.5px;
        max-width: 100%;
        height: 88px;
        padding: 28px
    }
}

@media screen and (max-width: 1024px) {
    .devices-search {
        width: 100%;
        height: 62px;
        padding: 20px
    }
}

@media screen and (max-width: 768px) {
    .devices-search {
        min-width: 168px;
        max-width: 100%;
        height: 40px;
        padding: 12px;
        border-radius: 8px;
        gap: 8px
    }
}

@media screen and (max-width: 423px) {
    .devices-search {
        min-width: 136px;
        max-width: 100%
    }
}

.devices-search__icon svg {
    width: 24px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .devices-search__icon svg {
        width: 28px;
        height: 26px
    }
}

@media screen and (max-width: 768px) {
    .devices-search__icon svg {
        width: 16px;
        height: 16px
    }
}

.devices-search__input {
    color: #494949;
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    border: none;
    width: 100%;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .devices-search__input {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 1024px) {
    .devices-search__input {
        font-size: 14px;
        line-height: 1.42;
        max-width: 137px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        flex: 1 0 0;
        text-overflow: ellipsis
    }
}

@media screen and (max-width: 768px) {
    .devices-search__input {
        font-size: 10px;
        line-height: 1.4;
        max-width: 88px
    }
}

.devices-search__input::placeholder {
    color: #494949
}

.suggestions-list {
    position: absolute;
    top: 115%;
    left: 0;
    width: 100%;
    display: none;
    max-height: 312px;
    overflow-y: auto;
    z-index: 10;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 40px #0006
}

@media screen and (min-width: 1920px) {
    .suggestions-list {
        max-height: 446px
    }
}

.suggestions-list li {
    display: block;
    padding: 16px;
    width: 100%;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .suggestions-list li {
        padding: 24px;
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .suggestions-list li {
        font-size: 14px;
        line-height: 1.42
    }
}

@media screen and (max-width: 768px) {
    .suggestions-list li {
        font-size: 10px;
        line-height: 1.4;
        padding: 12px
    }
}

.suggestions-list li:hover {
    background: #e2f6ff
}

.highlight {
    font-weight: 700
}

.section-rental {
    display: flex;
    padding: 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a;
    margin: 0 40px;
    min-height: 731px
}

@media screen and (min-width: 1920px) {
    .section-rental {
        padding: 40px 40px 48px;
        margin: 0 auto;
        width: 1872px;
        gap: 64px
    }
}

@media screen and (max-width: 1024px) {
    .section-rental {
        gap: 40px;
        min-height: 662px;
        margin: 0 32px
    }
}

@media screen and (max-width: 768px) {
    .section-rental {
        padding: 16px;
        margin: 0 16px;
        min-height: 600px
    }
}

@media screen and (max-width: 423px) {
    .section-rental {
        min-height: 568px
    }
}

.section-rental__title {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.28
}

@media screen and (min-width: 1920px) {
    .section-rental__title {
        font-size: 40px;
        line-height: 1.2
    }
}

@media screen and (max-width: 1024px) {
    .section-rental__title {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 768px) {
    .section-rental__title {
        font-size: 20px;
        line-height: 1.2
    }
}

.devices-search-button {
    display: flex;
    min-width: 136px;
    max-width: 100%;
    padding: 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px 16px 16px 8px;
    background: #151514;
    height: 72px;
    color: #fff;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .devices-search-button {
        min-width: 189px;
        max-width: 100%;
        height: 94px;
        padding: 28px;
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .devices-search-button {
        min-width: 80px;
        max-width: 100%;
        font-size: 14px;
        line-height: 1.42;
        height: 60px;
        padding: 20px 0
    }
}

@media screen and (max-width: 768px) {
    .devices-search-button {
        min-width: 168px;
        max-width: 100%;
        font-size: 10px;
        line-height: 1.4;
        height: 40px;
        border-radius: 8px;
        padding: 12px 24px
    }
}

@media screen and (max-width: 423px) {
    .devices-search-button {
        min-width: 136px;
        max-width: 100%
    }
}

.product-list_service {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    width: 100% !important
}

@media screen and (min-width: 1360px) {
    .product-list_service {
        grid-template-columns: repeat(4, 1fr)
    }
}

@media screen and (min-width: 1920px) {
    .product-list_service {
        gap: 64px 40px
    }
}

@media screen and (max-width: 1024px) {
    .product-list_service {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media screen and (max-width: 768px) {
    .product-list_service {
        gap: 24px 16px
    }
}

@media screen and (max-width: 423px) {
    .product-list_service {
        grid-template-columns: repeat(1, 1fr)
    }
}

.rent-pagination {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center
}

.rent-pagination .pagination-more-rent {
    all: unset;
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 16px;
    border-radius: 16px;
    border: 1px solid #58c7f7;
    color: var(--Accent, #58c7f7);
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .rent-pagination .pagination-more-rent {
        padding: 24px 32px;
        border: 2px solid var(--Text-Link, #58c7f7);
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .rent-pagination .pagination-more-rent {
        padding: 16px 24px;
        font-size: 14px;
        line-height: 1.42
    }
}

@media screen and (max-width: 768px) {
    .rent-pagination .pagination-more-rent {
        margin-top: 8px
    }
}

@media screen and (max-width: 1024px) {
    .rent-pagination .pagination-more-rent svg {
        width: 16px;
        height: 20px
    }
}

.service-block {
    margin: 0 40px !important;
    border-radius: 24px !important
}

@media screen and (min-width: 1920px) {
    .service-block {
        margin: 0 auto !important;
        width: 1760px
    }
}

@media screen and (max-width: 1024px) {
    .service-block {
        margin: 0 24px !important
    }
}

@media screen and (max-width: 768px) {
    .service-block {
        margin: 0 16px !important;
        border-radius: 16px !important
    }
}

.not-found-container {
    display: flex;
    flex-direction: column;
    padding: 32px 16px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid #dedede
}

@media screen and (max-width: 1024px) {
    .not-found-container {
        padding: 24px 16px
    }
}

.not-found-container .text-not-found {
    color: #151514;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (min-width: 1920px) {
    .not-found-container .text-not-found {
        font-size: 24px;
        line-height: 1.58
    }
}

@media screen and (max-width: 1024px) {
    .not-found-container .text-not-found {
        font-size: 14px;
        line-height: 1.43
    }
}

@media screen and (max-width: 768px) {
    .not-found-container .text-not-found {
        font-size: 12px;
        line-height: 1.33
    }
}

@media screen and (max-width: 423px) {
    .not-found-container .text-not-found {
        width: 194px
    }
}

.not-found-container .red-text {
    color: #eb606c
}

@media screen and (min-width: 1920px) {
    .container-service-checkout {
        min-width: 1640px !important;
        max-width: 1640px !important
    }
}

@media screen and (min-width: 1920px) {
    .basket-rental {
        min-width: 1300px !important
    }
}

@media screen and (max-width: 1024px) {
    .basket-rental {
        min-width: 650px !important
    }
}

@media screen and (max-width: 768px) {
    .basket-rental {
        min-width: 344px !important;
        max-width: 344px !important
    }
}

.button-container__repair:hover,
.button-container__lease:hover {
    cursor: pointer;
    border: 2px solid var(--Text-Link, #58c7f7) !important
}

.button-container__lease {
    pointer-events: none;
    position: relative;
    border-color: #dedede80 !important
}

.button-container__lease .button-container__check {
    border-color: #dedede80 !important
}

.button-container__lease h3 {
    opacity: .5
}

.button-container__badge {
    position: absolute;
    top: -12px;
    right: 0;
    rotate: 10deg;
    background: #d357c0;
    color: #fff;
    width: 92px;
    height: 36px;
    opacity: .8;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 0%
}

@media screen and (max-width: 1360px) {
    .button-container__badge {
        width: 74px;
        height: 30px;
        font-size: 16px
    }
}

@media screen and (max-width: 1024px) {
    .button-container__badge {
        width: 63px;
        height: 24px;
        font-size: 14px
    }
}

@media screen and (max-width: 424px) {
    .button-container__badge {
        width: 56px;
        height: 20px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 360px) {
    .button-container__badge {
        width: 56px;
        height: 20px;
        font-size: 12px;
        line-height: 16px
    }
}

.devices-filters-container {
    width: 100%
}

.container-rental-checkout {
    margin: 24px 0 8px;
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    .container-rental-checkout {
        gap: 32px
    }
}

@media screen and (max-width: 1024px) {
    .container-rental-checkout {
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .container-rental-checkout {
        gap: 8px
    }
}

.container-rental-checkout__item {
    display: flex;
    padding: 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .container-rental-checkout__item {
        padding: 16px;
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .container-rental-checkout__item {
        gap: 12px
    }
}

.modal-header-info {
    display: flex;
    justify-content: space-between;
    width: 100%
}

.info-modal-serial-number {
    display: flex;
    width: 920px;
    padding: 32px 32px 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    border-radius: 32px
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number {
        width: 1350px;
        padding: 48px 40px 56px;
        gap: 56px
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-serial-number {
        width: 800px;
        padding: 24px 24px 32px
    }
}

@media screen and (max-width: 768px) {
    .info-modal-serial-number {
        width: 350px;
        padding: 16px 16px 24px;
        gap: 24px
    }
}

@media screen and (max-width: 423px) {
    .info-modal-serial-number {
        width: 300px;
        max-height: 769px !important
    }
}

.info-modal-serial-number__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number__text {
        gap: 32px
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-serial-number__text {
        gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .info-modal-serial-number__text {
        gap: 16px
    }
}

.info-modal-serial-number__text h3 {
    color: #151514;
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.29
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number__text h3 {
        font-size: 40px;
        line-height: 1.2
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-serial-number__text h3 {
        font-size: 24px;
        line-height: 1.33
    }
}

@media screen and (max-width: 768px) {
    .info-modal-serial-number__text h3 {
        font-size: 20px;
        line-height: 1.2
    }
}

@media screen and (max-width: 423px) {
    .info-modal-serial-number__text h3 {
        font-size: 18px;
        line-height: 1.33
    }
}

.info-modal-serial-number__text .serial-text,
.info-modal-serial-number__text .serial-number,
.info-modal-serial-number__text .stars {
    color: #151514;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

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

    .info-modal-serial-number__text .serial-text,
    .info-modal-serial-number__text .serial-number,
    .info-modal-serial-number__text .stars {
        font-size: 24px;
        line-height: 1.58
    }
}

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

    .info-modal-serial-number__text .serial-text,
    .info-modal-serial-number__text .serial-number,
    .info-modal-serial-number__text .stars {
        font-size: 14px;
        line-height: 1.43
    }
}

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

    .info-modal-serial-number__text .serial-text,
    .info-modal-serial-number__text .serial-number,
    .info-modal-serial-number__text .stars {
        font-size: 14px;
        font-weight: 400;
        line-height: 1.43
    }
}

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

    .info-modal-serial-number__text .serial-text p,
    .info-modal-serial-number__text .serial-number p,
    .info-modal-serial-number__text .stars p {
        padding-top: 10px
    }
}

.info-modal-serial-number__text .serial-text .serial-number,
.info-modal-serial-number__text .serial-text .stars,
.info-modal-serial-number__text .serial-number .serial-number,
.info-modal-serial-number__text .serial-number .stars,
.info-modal-serial-number__text .stars .serial-number,
.info-modal-serial-number__text .stars .stars {
    font-weight: 500
}

.info-modal-serial-number__text .serial-text .stars,
.info-modal-serial-number__text .serial-number .stars,
.info-modal-serial-number__text .stars .stars {
    color: #4dcc8c
}

.info-modal-serial-number__sample {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number__sample {
        gap: 32px
    }
}

@media screen and (max-width: 768px) {
    .info-modal-serial-number__sample {
        flex-direction: column
    }
}

.info-modal-serial-number__sample-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    flex: 1 0 0
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number__sample-item {
        gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-serial-number__sample-item {
        gap: 10px
    }
}

.info-modal-serial-number__sample-item img {
    width: 416px;
    height: 225px;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .info-modal-serial-number__sample-item img {
        width: 615px;
        height: 320px
    }
}

@media screen and (max-width: 1024px) {
    .info-modal-serial-number__sample-item img {
        width: 364px;
        height: 179px
    }
}

@media screen and (max-width: 768px) {
    .info-modal-serial-number__sample-item img {
        width: 318px;
        height: 156px
    }
}

@media screen and (max-width: 423px) {
    .info-modal-serial-number__sample-item img {
        width: 268px;
        height: 132px
    }
}

.info-modal-serial-number__sample-item p,
.info-modal-serial-number__sample-item .number {
    color: #494949;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.43
}

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

    .info-modal-serial-number__sample-item p,
    .info-modal-serial-number__sample-item .number {
        font-size: 20px;
        line-height: 1.2
    }
}

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

    .info-modal-serial-number__sample-item p,
    .info-modal-serial-number__sample-item .number {
        font-size: 12px;
        line-height: 1.33
    }
}

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

    .info-modal-serial-number__sample-item p,
    .info-modal-serial-number__sample-item .number {
        font-size: 12px;
        max-width: 268px
    }
}

.info-modal-serial-number__sample-item .number {
    font-weight: 600;
    color: #4dcc8c
}

.checkout-total-service__list-item {
    margin: unset !important
}

.header-socials {
    display: flex
}

.header-socials a {
    display: block;
    width: 16px;
    height: 16px;
    margin-top: 6px
}

@media screen and (min-width: 1920px) {
    .header-socials a {
        width: 32px;
        height: 32px;
        margin-top: 0
    }
}

@media screen and (max-width: 1024px) {
    .header-socials a {
        margin-top: 0
    }
}

@media screen and (max-width: 768px) {
    .header-socials a {
        width: 24px;
        height: 24px;
        margin-top: -12px
    }
}

.header-socials a img,
.header-socials a svg {
    width: 100%;
    height: 100%
}

.header .header-telegram {
    margin-right: 16px
}

@media screen and (min-width: 1920px) {
    .header .header-telegram {
        margin-right: 24px
    }
}

@media screen and (max-width: 768px) {
    .header .header-telegram {
        margin-right: 24px
    }
}

.header .header-viber {
    margin-right: 24px
}

@media screen and (min-width: 1920px) {
    .header .header-viber {
        margin-right: 36px
    }
}

@media screen and (max-width: 768px) {
    .header .header-viber {
        margin-right: 0
    }
}

.header--responsive {
    padding: 8px 24px 16px;
    box-shadow: 0 4px 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .header--responsive {
        padding: 16px 24px 24px
    }
}

@media screen and (max-width: 1024px) {
    .header--responsive {
        padding: 8px 16px 12px
    }
}

@media screen and (max-width: 768px) {
    .header--responsive {
        padding: 16px 16px 8px
    }
}

@media screen and (max-width: 768px) {
    .header--responsive .search-main {
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 768px) {
    .header--responsive .header-bottom-line.closed .search-field {
        width: 90%
    }
}

.card-article__container {
    padding: 0;
    cursor: auto;
    min-width: 480px;
    max-width: 480px;
    max-height: 386px;
    min-height: 386px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .card-article__container {
        max-height: 514px;
        min-height: 514px;
        min-width: 611px
    }
}

@media screen and (max-width: 1359px) {
    .card-article__container {
        min-width: 334px;
        max-height: 286px;
        min-height: 286px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container {
        min-width: 240px;
        max-height: 217px;
        min-height: 217px
    }
}

.card-article__container .card-article__text {
    position: absolute;
    bottom: 0;
    display: flex;
    padding: 0 16px 16px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    align-self: stretch;
    height: 120px;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .card-article__container .card-article__text {
        padding: 0 16px 16px;
        height: 180px
    }
}

@media screen and (max-width: 1359px) {
    .card-article__container .card-article__text {
        height: 112px;
        padding: 12px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container .card-article__text {
        height: 92px;
        padding: 8px
    }
}

.card-article__container .card-article__bg {
    position: absolute;
    min-height: 250px;
    max-height: 250px;
    z-index: 0;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .card-article__container .card-article__bg {
        min-height: 264px;
        max-height: 264px
    }
}

@media screen and (max-width: 1359px) {
    .card-article__container .card-article__bg {
        min-height: 174px;
        max-height: 174px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container .card-article__bg {
        min-height: 146px;
        max-height: 146px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container .card-article__bg {
        min-height: 125px;
        max-height: 125px
    }
}

.card-article__container .card-article__info-title {
    overflow: hidden;
    color: #151514;
    text-overflow: ellipsis;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    align-self: stretch
}

@media screen and (min-width: 1920px) {
    .card-article__container .card-article__info-title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .card-article__container .card-article__info-title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container .card-article__info-title {
        font-size: 12px;
        line-height: 14px
    }
}

.card-article__container a {
    display: flex;
    gap: 8px;
    align-items: center;
    color: var(--Text-White, #fff);
    text-align: center;
    text-decoration: none;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .card-article__container a {
        font-size: 16px;
        line-height: 24px;
        gap: 12px
    }
}

@media screen and (max-width: 1359px) {
    .card-article__container a {
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container a {
        font-size: 8px;
        line-height: 12px
    }
}

.card-article__container svg {
    width: 10px;
    height: 10px
}

@media screen and (min-width: 1920px) {
    .card-article__container svg {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .card-article__container svg {
        width: 8px;
        height: 8px
    }
}

.cards-list {
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .cards-list .card-article__bg {
        min-height: 318x;
        max-height: 318px
    }
}

.cards-list .footer-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.cards-list .footer-card .dates-text {
    color: #888;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .cards-list .footer-card .dates-text {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .cards-list .footer-card .dates-text {
        font-size: 8px;
        line-height: 12px
    }
}

.cards-list .footer-card .year-text {
    color: #888;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .cards-list .footer-card .year-text {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .cards-list .footer-card .year-text {
        font-size: 8px;
        line-height: 12px
    }
}

.cards-list .link-container {
    min-width: 139px;
    max-width: 139px;
    display: flex;
    padding: 12px 16px;
    justify-content: center;
    border-radius: 12px;
    background: var(--Controls-Blue, #58c7f6)
}

@media screen and (min-width: 1920px) {
    .cards-list .link-container {
        padding: 18px 24px;
        border-radius: 16px;
        min-width: 194px;
        max-width: 194px
    }
}

@media screen and (max-width: 1359px) {
    .cards-list .link-container {
        min-width: 144px;
        max-width: 144px
    }
}

@media screen and (max-width: 1023px) {
    .cards-list .link-container {
        padding: 8px 12px;
        border-radius: 10px;
        min-width: 99px;
        max-width: 99px
    }
}

.cards-list .link-container:hover {
    background-color: #6cd3ff
}

.article-slide {
    position: relative;
    min-width: unset !important;
    max-width: unset !important;
    width: 100%;
    padding: 16px;
    min-height: 422px
}

@media screen and (min-width: 1920px) {
    .article-slide {
        min-height: 569px;
        padding: 20px
    }
}

@media screen and (max-width: 1359px) {
    .article-slide {
        min-height: 345px;
        max-height: 345px;
        padding: 12px
    }
}

@media screen and (max-width: 1023px) {
    .article-slide {
        min-height: 272px;
        max-height: 272px;
        padding: 8px
    }
}

.article-slide .card-article__bg {
    position: unset !important
}

.article-slide .card-article__bg--hover {
    position: absolute !important;
    left: 0;
    top: 0
}

.article-slide img {
    position: absolute;
    width: 100%;
    object-fit: cover;
    left: 16px;
    right: 16px !important;
    top: 16px;
    min-height: 230px !important;
    max-height: 230px !important;
    border-radius: 12px 12px 2px 2px
}

@media screen and (min-width: 1920px) {
    .article-slide img {
        min-height: 299px !important;
        max-height: 299px !important;
        border-radius: 16px 16px 6px 6px;
        left: 20px;
        right: 20px !important;
        top: 20px
    }
}

@media screen and (max-width: 1359px) {
    .article-slide img {
        min-height: 181px !important;
        max-height: 181px !important;
        border-radius: 12px 12px 4px 4px;
        left: 12px;
        right: 12px !important;
        top: 12px
    }
}

@media screen and (max-width: 1023px) {
    .article-slide img {
        min-height: 140px !important;
        max-height: 140px !important;
        border-radius: 4px;
        left: 8px;
        right: 8px !important;
        top: 8px
    }
}

.article-slide .card-article__text {
    position: unset;
    min-height: 144px;
    max-height: 144px;
    padding: 8px 0 0 !important
}

@media screen and (min-width: 1920px) {
    .article-slide .card-article__text {
        min-height: 218px;
        max-height: 218px
    }
}

@media screen and (max-width: 1359px) {
    .article-slide .card-article__text {
        min-height: 134px;
        max-height: 134px
    }
}

@media screen and (max-width: 1023px) {
    .article-slide .card-article__text {
        min-height: 100px;
        max-height: 100px
    }
}

@media screen and (max-width: 1359px) {
    .article-slide .footer-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .article-slide .footer-card {
        gap: 8px
    }
}

@media screen and (max-width: 1359px) {
    .article-slide .footer-card .link-container {
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (min-width: 1920px) {
    .article-slide .footer-card .link-container {
        max-width: 194px
    }
}

.button--primary {
    color: #58c7f7;
    transition: all .2s ease-out
}

.button--primary:hover {
    border: 1px solid #58c7f7;
    transition: all .2s ease-out
}

.button--filled.button--primary {
    color: #fff;
    border: none;
    background: #151514;
    transition: all .2s ease-out
}

.button--filled.button--primary:hover {
    padding: 10px 18px;
    transition: all .2s ease-out
}

.button--filled.button--primary:before,
.button--filled.button--primary:after {
    content: none
}

.button--filled.button--secondary {
    background: #58c7f7
}

.button--filled.button--secondary:before {
    content: none
}

.button--outline {
    transition: all .2s ease-out
}

.button--outline.button--primary {
    color: #58c7f7;
    margin: 0
}

.button--outline.button--primary:hover {
    color: #58c7f7;
    transition: all .2s ease-out
}

.button--outline.button--primary:before,
.button--outline.button--primary:after {
    content: none
}

@media screen and (min-width: 1920px) {
    .button--outline.button--primary {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1359px) {
    .button--outline.button--primary {
        padding: 8px 16px
    }
}

@media screen and (max-width: 1023px) {
    .button--outline.button--primary {
        padding: 8px 24px;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .button--outline.button--primary {
        padding: 12px 16px;
        font-size: 13px;
        line-height: 16px
    }
}

.button--outline.button--secondary {
    color: #58c7f7;
    border: 1px solid #dedede
}

.button--outline.button--secondary:hover {
    color: #58c7f7;
    border: 1px solid #58c7f7;
    transition: all .2s ease-out
}

.button--outline.button--secondary:before,
.button--outline.button--secondary:after {
    content: none
}

.button--sm {
    margin-top: 2px;
    padding: 8px 24px;
    transition: all .2s ease-out
}

@media screen and (min-width: 1920px) {
    .button--sm {
        padding: 12px 24px
    }
}

@media screen and (max-width: 1359px) {
    .button--sm {
        margin-top: 0
    }
}

@media screen and (max-width: 1023px) {
    .button--sm {
        padding: 8px 24px;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .button--sm {
        padding: 12px 24px;
        font-size: 13px;
        line-height: 16px
    }
}

.button--sm:hover {
    margin-top: 0;
    padding: 10px 26px;
    transition: all .2s ease-out
}

@media screen and (min-width: 1920px) {
    .button--sm:hover {
        padding: 14px 26px
    }
}

@media screen and (max-width: 1359px) {
    .button--sm:hover {
        padding: 8px 24px
    }
}

@media screen and (max-width: 723px) {
    .button--sm:hover {
        padding: 12px 24px
    }
}

.button--outline.button--sm:hover {
    padding: 8px 24px
}

@media screen and (min-width: 1920px) {
    .button--outline.button--sm:hover {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1359px) {
    .button--outline.button--sm:hover {
        padding: 8px 16px
    }
}

@media screen and (max-width: 1023px) {
    .button--outline.button--sm:hover {
        padding: 8px 24px
    }
}

@media screen and (max-width: 723px) {
    .button--outline.button--sm:hover {
        padding: 12px 16px
    }
}

.button-600 {
    color: #4da6cd;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .button-600 {
        font-size: 24px
    }
}

@media screen and (max-width: 1359px) {
    .button-600 {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .button-600 {
        font-size: 10px;
        line-height: 16px
    }
}

.container-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer
}

@media screen and (max-width: 1359px) {
    .container-btn {
        gap: 6px
    }
}

@media screen and (max-width: 1023px) {
    .container-btn {
        gap: 4px
    }
}

.container-btn img,
.container-btn svg {
    transition: transform .3s ease
}

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

    .container-btn img,
    .container-btn svg {
        width: 11px;
        height: 18px
    }
}

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

    .container-btn img,
    .container-btn svg {
        width: 7px;
        height: 12px
    }
}

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

    .container-btn img,
    .container-btn svg {
        width: 5px;
        height: 8px
    }
}

@media screen and (min-width: 1920px) {
    .container-btn svg {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .container-btn svg {
        width: 10px;
        height: 10px
    }
}

@media screen and (max-width: 1023px) {
    .container-btn svg {
        width: 7px;
        height: 7px
    }
}

.container-btn:hover img,
.container-btn:hover svg {
    transform: translate(6px)
}

.filters .checkbox-container {
    margin: 0;
    padding-left: 28px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .filters .checkbox-container {
        font-weight: 400;
        font-size: 18px;
        line-height: 24px;
        padding-left: 34px
    }
}

@media screen and (max-width: 1024px) and (min-width: 769px) {
    .filters .checkbox-container {
        font-weight: 400;
        font-size: 10px;
        line-height: 12px;
        padding-left: 20px
    }
}

@media screen and (max-width: 768px) {
    .filters .checkbox-container {
        font-weight: 400;
        padding-left: 24px
    }
}

.filters .checkbox-container .checkbox-icon {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .filters .checkbox-container .checkbox-icon {
        width: 22px;
        height: 22px
    }
}

@media screen and (max-width: 1024px) {
    .filters .checkbox-container .checkbox-icon {
        width: 12px;
        height: 12px
    }
}

@media screen and (max-width: 768px) {
    .filters .checkbox-container .checkbox-icon {
        top: 0;
        width: 16px;
        height: 16px
    }
}

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

    .filters .select-label,
    .filters--mobile .select-label,
    .filters--mobile__row .select-label,
    .filters-modal .select-label {
        margin-bottom: 8px
    }
}

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

    .filters .select-label,
    .filters--mobile .select-label,
    .filters--mobile__row .select-label,
    .filters-modal .select-label {
        font-size: 12px;
        line-height: 16px
    }
}

.filters .select-field,
.filters--mobile .select-field,
.filters--mobile__row .select-field,
.filters-modal .select-field {
    padding: 12px 12px 12px 8px;
    align-items: center
}

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

    .filters .select-field,
    .filters--mobile .select-field,
    .filters--mobile__row .select-field,
    .filters-modal .select-field {
        padding: 16px 20px 16px 16px
    }
}

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

    .filters .select-field,
    .filters--mobile .select-field,
    .filters--mobile__row .select-field,
    .filters-modal .select-field {
        padding: 8px
    }
}

.filters .select-field__icon,
.filters--mobile .select-field__icon,
.filters--mobile__row .select-field__icon,
.filters-modal .select-field__icon {
    display: flex
}

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

    .filters .select-field__icon,
    .filters--mobile .select-field__icon,
    .filters--mobile__row .select-field__icon,
    .filters-modal .select-field__icon {
        margin: 0;
        width: auto;
        height: auto
    }
}

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

    .filters .select-field__icon,
    .filters--mobile .select-field__icon,
    .filters--mobile__row .select-field__icon,
    .filters-modal .select-field__icon {
        display: block;
        width: 16px;
        height: 16px
    }
}

.filters .select-field__icon svg,
.filters--mobile .select-field__icon svg,
.filters--mobile__row .select-field__icon svg,
.filters-modal .select-field__icon svg {
    width: 16px;
    height: 10px
}

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

    .filters .select-field__icon svg,
    .filters--mobile .select-field__icon svg,
    .filters--mobile__row .select-field__icon svg,
    .filters-modal .select-field__icon svg {
        width: 24px;
        height: 14px;
        margin-top: 6px
    }
}

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

    .filters .select-field__icon svg,
    .filters--mobile .select-field__icon svg,
    .filters--mobile__row .select-field__icon svg,
    .filters-modal .select-field__icon svg {
        width: 13px;
        height: 7px;
        transform: none
    }
}

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

    .filters .select-field__icon svg,
    .filters--mobile .select-field__icon svg,
    .filters--mobile__row .select-field__icon svg,
    .filters-modal .select-field__icon svg {
        width: 16px;
        height: 11px
    }

    .filters .select-field__icon svg path,
    .filters--mobile .select-field__icon svg path,
    .filters--mobile__row .select-field__icon svg path,
    .filters-modal .select-field__icon svg path {
        fill: #d357c0
    }
}

.filters .select-field__icon-close,
.filters--mobile .select-field__icon-close,
.filters--mobile__row .select-field__icon-close,
.filters-modal .select-field__icon-close {
    display: none;
    width: 14px;
    height: 14px
}

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

    .filters .select-field__icon-close,
    .filters--mobile .select-field__icon-close,
    .filters--mobile__row .select-field__icon-close,
    .filters-modal .select-field__icon-close {
        width: 20px;
        height: 20px
    }
}

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

    .filters .select-field__icon-close,
    .filters--mobile .select-field__icon-close,
    .filters--mobile__row .select-field__icon-close,
    .filters-modal .select-field__icon-close {
        width: 10px;
        height: 10px
    }
}

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

    .filters .select-field__icon-close,
    .filters--mobile .select-field__icon-close,
    .filters--mobile__row .select-field__icon-close,
    .filters-modal .select-field__icon-close {
        width: 14px;
        height: 14px
    }
}

.filters .select-field__icon-container.active .select-field__icon,
.filters--mobile .select-field__icon-container.active .select-field__icon,
.filters--mobile__row .select-field__icon-container.active .select-field__icon,
.filters-modal .select-field__icon-container.active .select-field__icon {
    display: none
}

.filters .select-field__icon-container.active .select-field__icon-close,
.filters--mobile .select-field__icon-container.active .select-field__icon-close,
.filters--mobile__row .select-field__icon-container.active .select-field__icon-close,
.filters-modal .select-field__icon-container.active .select-field__icon-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0
}

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

    .filters .select-field__icon-container.active .select-field__icon-close,
    .filters--mobile .select-field__icon-container.active .select-field__icon-close,
    .filters--mobile__row .select-field__icon-container.active .select-field__icon-close,
    .filters-modal .select-field__icon-container.active .select-field__icon-close {
        width: 54px;
        height: 54px
    }
}

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

    .filters .select-field__icon-container.active .select-field__icon-close,
    .filters--mobile .select-field__icon-container.active .select-field__icon-close,
    .filters--mobile__row .select-field__icon-container.active .select-field__icon-close,
    .filters-modal .select-field__icon-container.active .select-field__icon-close {
        width: 30px;
        height: 28px
    }
}

.filters .select-field__icon-container.active .select-field__icon-close svg,
.filters--mobile .select-field__icon-container.active .select-field__icon-close svg,
.filters--mobile__row .select-field__icon-container.active .select-field__icon-close svg,
.filters-modal .select-field__icon-container.active .select-field__icon-close svg {
    width: 14px;
    height: 14px
}

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

    .filters .select-field__icon-container.active .select-field__icon-close svg,
    .filters--mobile .select-field__icon-container.active .select-field__icon-close svg,
    .filters--mobile__row .select-field__icon-container.active .select-field__icon-close svg,
    .filters-modal .select-field__icon-container.active .select-field__icon-close svg {
        width: 20px;
        height: 20px
    }
}

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

    .filters .select-field__icon-container.active .select-field__icon-close svg,
    .filters--mobile .select-field__icon-container.active .select-field__icon-close svg,
    .filters--mobile__row .select-field__icon-container.active .select-field__icon-close svg,
    .filters-modal .select-field__icon-container.active .select-field__icon-close svg {
        width: 10px;
        height: 10px
    }
}

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

    .filters .select-field__list-item,
    .filters--mobile .select-field__list-item,
    .filters--mobile__row .select-field__list-item,
    .filters-modal .select-field__list-item {
        padding: 16px
    }
}

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

    .filters .select-field__list-item,
    .filters--mobile .select-field__list-item,
    .filters--mobile__row .select-field__list-item,
    .filters-modal .select-field__list-item {
        padding: 10px
    }
}

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

    .filters .select-field__list-item,
    .filters--mobile .select-field__list-item,
    .filters--mobile__row .select-field__list-item,
    .filters-modal .select-field__list-item {
        padding: 12px;
        font-weight: 400
    }
}

.filters .select-field__current,
.filters--mobile .select-field__current,
.filters--mobile__row .select-field__current,
.filters-modal .select-field__current {
    position: relative;
    overflow: hidden;
    max-height: 16px;
    column-gap: 8px
}

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

    .filters .select-field__current,
    .filters--mobile .select-field__current,
    .filters--mobile__row .select-field__current,
    .filters-modal .select-field__current {
        column-gap: 8px;
        max-height: 24px
    }
}

@media screen and (max-width: 1024px) and (min-width: 769px) {

    .filters .select-field__current,
    .filters--mobile .select-field__current,
    .filters--mobile__row .select-field__current,
    .filters-modal .select-field__current {
        column-gap: 6px;
        max-height: 12px
    }
}

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

    .filters--mobile .select-checkbox .select--mobile-field,
    .filters--mobile__row .select-checkbox .select--mobile-field {
        min-width: 128px;
        max-width: 128px
    }

    .filters--mobile .select-checkbox .select--mobile-field__current,
    .filters--mobile__row .select-checkbox .select--mobile-field__current {
        position: relative;
        overflow: hidden;
        max-height: 26px;
        column-gap: 8px
    }

    .filters--mobile .select-checkbox .select--mobile-field__value,
    .filters--mobile__row .select-checkbox .select--mobile-field__value {
        position: relative;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }

    .filters--mobile .select-checkbox .select--mobile-field__list-item,
    .filters--mobile__row .select-checkbox .select--mobile-field__list-item {
        padding: 8px 6px
    }

    .filters--mobile .select-checkbox .select--mobile-field .select-field__icon-close,
    .filters--mobile__row .select-checkbox .select--mobile-field .select-field__icon-close {
        display: none;
        width: 10px;
        height: 10px
    }

    .filters--mobile .select-checkbox .select--mobile-field__list-item .checkbox-container,
    .filters--mobile .select-checkbox .select-field__list-item .checkbox-container,
    .filters--mobile__row .select-checkbox .select--mobile-field__list-item .checkbox-container,
    .filters--mobile__row .select-checkbox .select-field__list-item .checkbox-container {
        margin-top: 0;
        font-size: 12px;
        line-height: 16px
    }

    .filters--mobile .select-checkbox .select--mobile-field__list-item .checkbox-icon,
    .filters--mobile .select-checkbox .select-field__list-item .checkbox-icon,
    .filters--mobile__row .select-checkbox .select--mobile-field__list-item .checkbox-icon,
    .filters--mobile__row .select-checkbox .select-field__list-item .checkbox-icon {
        top: 0
    }

    .filters--mobile .select-field__icon-container .select--mobile-field__icon,
    .filters--mobile__row .select-field__icon-container .select--mobile-field__icon {
        display: block
    }

    .filters--mobile .select-field__icon-container .select-field__icon-close,
    .filters--mobile__row .select-field__icon-container .select-field__icon-close,
    .filters--mobile .select-field__icon-container.active .select--mobile-field__icon,
    .filters--mobile__row .select-field__icon-container.active .select--mobile-field__icon {
        display: none
    }

    .filters--mobile .select-field__icon-container.active .select-field__icon-close,
    .filters--mobile__row .select-field__icon-container.active .select-field__icon-close {
        display: block
    }
}

.breadcrumbs__item.active a {
    color: #888
}

.breadcrumbs {
    position: relative;
    margin-top: 40px;
    padding: 0 40px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    gap: 8px;
    justify-content: space-between
}

@media screen and (min-width: 1920px) {
    .breadcrumbs {
        font-size: 18px;
        line-height: 24px;
        margin-top: 88px
    }
}

@media screen and (max-width: 1359px) {
    .breadcrumbs {
        padding: 0 32px
    }
}

@media screen and (max-width: 1023px) {
    .breadcrumbs {
        margin: 32px 0 24px;
        font-size: 10px;
        line-height: 14px;
        padding: 0 28px
    }
}

@media screen and (max-width: 723px) {
    .breadcrumbs {
        padding: 0 16px
    }
}

@media screen and (max-width: 424px) {
    .breadcrumbs {
        padding: 0 16px
    }
}

.breadcrumbs__container {
    display: flex;
    color: #888
}

@media screen and (max-width: 768px) {
    .breadcrumbs__container {
        overflow: hidden
    }
}

.breadcrumbs__item {
    position: relative;
    display: flex;
    cursor: pointer
}

@media screen and (max-width: 1024px) {
    .breadcrumbs__item {
        max-height: 11px
    }
}

.breadcrumbs__item:after {
    content: "/";
    color: #888;
    margin: 0 10px;
    cursor: auto
}

@media screen and (min-width: 1920px) {
    .breadcrumbs__item:after {
        margin: 0 16px
    }
}

@media screen and (max-width: 1359px) {
    .breadcrumbs__item:after {
        margin: 0 10px
    }
}

@media screen and (max-width: 1023px) {
    .breadcrumbs__item:after {
        margin: 0 6px
    }
}

.breadcrumbs__item:last-child:after {
    content: none
}

.breadcrumbs__item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    white-space: nowrap;
    color: #494949
}

@media screen and (min-width: 1920px) {
    .breadcrumbs__item a {
        font-size: 20px
    }
}

@media screen and (max-width: 1023px) {
    .breadcrumbs__item a {
        text-overflow: ellipsis;
        overflow: hidden
    }
}

@media screen and (max-width: 1359px) {
    .breadcrumbs__item a {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 723px) {
    .breadcrumbs__item a {
        font-size: 9px
    }
}

@media screen and (max-width: 550px) {
    .breadcrumbs__item a {
        max-width: 229px
    }
}

@media screen and (min-width: 1920px) {
    .breadcrumbs__item a svg {
        width: 24px;
        height: 21px
    }
}

@media screen and (max-width: 768px) {
    .breadcrumbs--category .breadcrumbs__item:first-child:after {
        content: none
    }

    .breadcrumbs--category .breadcrumbs__item:last-child {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .breadcrumbs--subcategory .breadcrumbs__item:nth-last-child(2) {
        overflow: hidden
    }

    .breadcrumbs--subcategory .breadcrumbs__item:nth-last-child(2):after {
        content: none
    }

    .breadcrumbs--subcategory .breadcrumbs__item:last-child {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .breadcrumbs--brand .breadcrumbs__item:nth-last-child(2):after {
        content: "/"
    }

    .breadcrumbs--brand .breadcrumbs__item:last-child {
        text-overflow: ellipsis;
        overflow: hidden
    }
}

@media screen and (max-width: 768px) {
    .breadcrumbs__list {
        position: absolute;
        top: 136px;
        opacity: 1;
        z-index: 1;
        display: flex;
        flex-direction: column;
        min-width: 136px;
        max-width: 136px;
        background: #fff;
        box-shadow: 0 4px 8px #0000001a;
        border-radius: 3px;
        transition: all .2s ease
    }

    .breadcrumbs__list a {
        display: flex;
        align-items: center;
        min-height: 40px;
        max-height: 40px;
        padding-left: 8px;
        padding-right: 8px;
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        color: #151514;
        text-decoration: none;
        border-bottom: .5px solid #dedede
    }

    .breadcrumbs__list a:last-child {
        border: none
    }
}

.home-icon {
    width: 14px;
    height: 12px;
    display: block
}

@media screen and (max-width: 1024px) {
    .home-icon {
        width: 12px;
        height: 11px
    }
}

@media screen and (min-width: 1920px) {
    .home-icon {
        width: 20px;
        height: 18px
    }
}

@media screen and (min-width: 1920px) {
    .close-breadcrumbs {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 424px) {
    [data-el=hidden] {
        display: none
    }
}

.close-breadcrumbs {
    width: 12px;
    height: 12px
}

.message-not-found {
    padding: 0 40px;
    min-height: 124px;
    margin-bottom: 48px;
    margin-top: 24px;
    color: #494949;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .message-not-found {
        padding: 0 80px;
        margin-bottom: 88px;
        margin-top: 56px;
        min-height: 160px;
        font-size: 24px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    .message-not-found {
        margin-top: 32px;
        padding: 0 32px;
        margin-bottom: 0;
        min-height: 124px
    }
}

@media screen and (max-width: 1023px) {
    .message-not-found {
        margin-top: 4px;
        padding: 0 28px;
        min-height: 170px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .message-not-found {
        min-height: 180px;
        padding: 0 16px
    }
}

.message-not-found .link {
    color: #58c7f7;
    font-weight: 600;
    cursor: pointer
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-results {
        flex-direction: row
    }

    .sort-wrapper-results .container-sort-block {
        min-height: 32px
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .sort-wrapper-results .container-sort-block {
        margin-bottom: 20px
    }
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-results .sort-block-field {
        min-width: 130px;
        padding: 6px 12px;
        max-height: 32px
    }

    .sort-wrapper-results .sort-block-title {
        display: flex;
        min-width: 171px
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .sort-wrapper-results .sort-block-title {
        display: none
    }
}

@media screen and (min-width: 1920px) {
    .sort-wrapper-results .page-title {
        font-size: 56px;
        line-height: 72px
    }
}

.sort-wrapper-results .sort-wrapper-mobile {
    padding-left: 0
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-results .container-title {
        min-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .sort-wrapper-results .sort-block-field__current {
        padding: 0
    }
}

/* .basket-added__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .basket-added__header {
        margin-bottom: 24px
    }
}

.basket-added__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .basket-added__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added__title {
        font-size: 18px;
        line-height: 24px
    }
}

.basket-added__navigation {
    display: flex;
    column-gap: 12px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .basket-added__navigation {
        column-gap: 16px
    }
}

@media screen and (max-width: 1359px) {
    .basket-added__navigation {
        column-gap: 8px
    }
}

.basket-added .card-buy {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 12px;
    min-width: 100%;
    max-width: 100%;
    min-height: 38px;
    border-radius: 12px
}

@media screen and (min-width: 1920px) {
    .basket-added .card-buy {
        margin-top: 0
    }

    .basket-added .card-buy svg {
        min-width: 32px;
        max-width: 32px;
        min-height: 28px;
        max-height: 28px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .card-buy {
        min-height: 32px;
        margin-top: 0;
        border-radius: 8px
    }
}

@media screen and (max-width: 724px) {
    .basket-added .card-buy {
        min-width: 160px;
        max-width: 160px;
        min-height: 30px;
        max-height: 30px
    }
}

.basket-added .swiper-basket {
    position: relative;
    overflow-x: hidden;
    width: 100%
}

.basket-added .swiper-scrollbar {
    position: relative;
    width: 100%;
    height: 1px;
    margin: 0;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-scrollbar {
        height: 2px
    }
}

.basket-added .swiper-scrollbar-drag {
    position: relative;
    height: 100%;
    width: 100%;
    background: #888
}

.basket-added .swiper-wrapper {
    padding-top: 16px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-wrapper {
        padding-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-wrapper {
        padding-top: 24px
    }
}

.basket-added .swiper-slide {
    display: flex;
    background: #f4f4f4;
    min-height: 154px;
    max-height: 154px;
    min-width: 368px;
    max-width: 368px;
    padding: 12px 16px 12px 12px;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide {
        min-width: 492px;
        max-width: 492px;
        min-height: 236px;
        max-height: 236px;
        padding: 24px 24px 24px 16px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide {
        min-width: 300px;
        max-width: 300px;
        min-height: 126px;
        max-height: 126px;
        padding: 12px 16px 12px 12px
    }
}

@media screen and (max-width: 724px) {
    .basket-added .swiper-slide {
        min-width: 300px;
        max-width: 300px;
        min-height: 126px;
        max-height: 126px
    }
}

.basket-added .swiper-slide-img {
    min-width: 108px;
    max-width: 108px;
    min-height: 130px;
    max-height: 130px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide-img {
        min-width: 144px;
        max-width: 144px;
        min-height: 173px;
        max-height: 173px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide-img {
        min-width: 84px;
        max-width: 84px;
        min-height: 102px;
        max-height: 102px
    }
}

.basket-added .swiper-slide-img img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.basket-added .swiper-slide__border {
    height: 122px;
    width: 1px;
    margin-top: 8px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__border {
        height: 190px;
        margin-top: 0
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__border {
        height: 102px;
        margin-top: 0
    }
}

@media screen and (max-width: 768px) {
    .basket-added .swiper-slide__border {
        height: 106px
    }
}

.basket-added .swiper-slide__info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    padding-top: 8px;
    margin-left: 16px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__info {
        padding-top: 0;
        padding-left: 24px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__info {
        padding-left: 0;
        padding-top: 0
    }
}

@media screen and (max-width: 724px) {
    .basket-added .swiper-slide__info {
        width: 160px
    }
}

.basket-added .swiper-slide__text {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__text {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__text {
        width: 100%;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .basket-added .swiper-slide__text {
        line-height: 18px
    }
}

.basket-added .swiper-slide__price {
    display: flex;
    column-gap: 12px;
    align-items: flex-end;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    margin-top: 8px
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__price {
        font-size: 28px;
        line-height: 32px;
        margin: 16px 0 32px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__price {
        font-size: 16px;
        line-height: 24px;
        column-gap: 8px;
        margin: 4px 0 12px
    }
}

.basket-added .swiper-slide__price--new {
    color: #eb606c
}

.basket-added .swiper-slide__price--old {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #b6b6b6;
    text-decoration: line-through
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__price--old {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__price--old {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .basket-added .swiper-slide__actions--discount {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        row-gap: 32px
    }
}

.basket-added .swiper-slide__actions--discount .swiper-slide__price {
    margin-bottom: 0
}

@media screen and (max-width: 1024px) {
    .basket-added .swiper-slide__actions--discount .swiper-slide__price {
        margin-bottom: 12px
    }
}

.basket .product {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 0 32px 0 20px;
    user-select: none;
    tap-highlight-color: transparent;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none
}

@media screen and (min-width: 1920px) {
    .basket .product {
        gap: 48px;
        justify-content: space-between;
        padding: 0 40px 0 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product {
        gap: 10px;
        flex-direction: column;
        align-items: flex-start;
        padding: 0 24px 12px
    }
}

@media screen and (max-width: 723px) {
    .basket .product {
        padding: 0 12px 12px
    }
}

@media screen and (max-width: 723px) {
    .basket .product {
        flex-direction: column;
        align-items: flex-start
    }
}

.basket .product:first-child {
    padding-top: 0
}

.basket .product:last-child {
    border-bottom: none
}

.basket .product--present .product-name__description {
    font-weight: 700;
    color: #4dcc8c
}

.basket .product--present .product-total {
    color: #4dcc8c
}

@media screen and (max-width: 1359px) {
    .basket .product--present .product-total {
        text-align: start
    }
}

.basket .product--discount .product-total {
    color: #ff3f5f;
    font-weight: 600
}

@media screen and (max-width: 1359px) {
    .basket .product--discount .product-total {
        text-align: start
    }
}

.basket .product--discount .product-price__value--new {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #ff3f5f;
    text-align: end
}

@media screen and (min-width: 1920px) {
    .basket .product--discount .product-price__value--new {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product--discount .product-price__value--new {
        font-size: 16px;
        line-height: 24px;
        min-width: 72px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product--discount .product-price__value--new {
        text-align: start
    }
}

.basket .product--discount .product-price__value--old {
    font-size: 12px;
    line-height: 14px;
    color: #b6b6b6;
    text-decoration: line-through;
    text-align: end
}

@media screen and (min-width: 1920px) {
    .basket .product--discount .product-price__value--old {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product--discount .product-price__value--old {
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product--discount .product-price__value--old {
        line-height: 14px;
        text-align: end
    }
}

.basket .product--credit .product-total {
    color: #2544bf
}

.basket .product--credit .product-total__info {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    color: #b6b6b6
}

@media screen and (min-width: 1920px) {
    .basket .product--credit .product-total__info {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product--credit .product-total__info {
        font-size: 10px;
        line-height: 12px
    }
}

.basket .product--credit .product-name__description--credit {
    font-weight: 700;
    color: #2544bf;
    text-transform: uppercase
}

.basket .product--preorder .product-total {
    color: #0a95d0;
    line-height: 15px
}

.basket .product--preorder .product-total__info {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    color: #b6b6b6
}

@media screen and (min-width: 1920px) {
    .basket .product--preorder .product-total__info {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product--preorder .product-total__info {
        font-size: 10px;
        line-height: 12px
    }
}

.basket .product--preorder .product-name__description--preorder {
    font-weight: 700;
    color: #0a95d0;
    text-transform: uppercase
}

.basket .product--disabled .product-image,
.basket .product--disabled .product-price__value,
.basket .product--disabled .product-name__title,
.basket .product--disabled .product-total {
    opacity: .5
}

.basket .product--disabled .product-name__description {
    color: #d00a0a;
    font-weight: 700
}

.basket .product-info {
    display: flex;
    align-items: center;
    column-gap: 16px;
    max-width: 100%
}

@media screen and (min-width: 1920px) {
    .basket .product-info {
        column-gap: 18px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-info {
        column-gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .basket .product-info {
        column-gap: 12px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-info {
        column-gap: 8px;
        width: 100%
    }
}

.basket .product-name {
    overflow: hidden;
    width: 100%
}

@media screen and (min-width: 1920px) {
    .basket .product-name {
        max-width: 584px
    }
}

.basket .product-name__title {
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .basket .product-name__title {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-name__title {
        font-size: 14px;
        line-height: 20px
    }
}

.basket .product-name__description {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    margin-top: 6px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .basket .product-name__description {
        font-size: 20px;
        line-height: 32px;
        margin-top: 8px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-name__description {
        font-size: 12px;
        line-height: 16px;
        margin-top: 4px
    }
}

.basket .product-image {
    min-width: 75px;
    min-height: 69px;
    max-width: 75px;
    max-height: 69px
}

@media screen and (min-width: 1920px) {
    .basket .product-image {
        min-width: 95px;
        min-height: 88px;
        max-width: 95px;
        max-height: 88px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-image {
        min-width: 88px;
        min-height: 81px;
        max-width: 88px;
        max-height: 81px
    }
}

.basket .product-image img {
    min-width: 75px;
    min-height: 69px;
    max-width: 75px;
    max-height: 69px
}

@media screen and (min-width: 1920px) {
    .basket .product-image img {
        min-width: 95px;
        min-height: 88px;
        max-width: 95px;
        max-height: 88px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-image img {
        min-width: 88px;
        min-height: 81px;
        max-width: 88px;
        max-height: 81px
    }
}

.basket .product-total {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    color: #151514;
    text-align: right;
    min-width: 85px;
    max-width: 85px
}

@media screen and (min-width: 1920px) {
    .basket .product-total {
        font-size: 24px;
        line-height: 32px;
        min-width: 126px;
        max-width: 126px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-total {
        font-size: 16px;
        line-height: 24px;
        text-align: start;
        min-width: 74px;
        max-width: 74px
    }
}

@media screen and (max-width: 723px) {
    .basket .product-total {
        text-align: start
    }
}

.basket .product-price {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 32px
}

@media screen and (min-width: 1920px) {
    .basket .product-price {
        column-gap: 40px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-price {
        column-gap: 24px;
        width: 100%;
        justify-content: space-between
    }
}

.basket .product-price__value {
    min-width: max-content;
    min-width: 85px;
    max-width: 85px
}

@media screen and (min-width: 1920px) {
    .basket .product-price__value {
        font-size: 22px;
        line-height: 34px;
        min-width: 108px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-price__value {
        font-size: 12px;
        line-height: 16px;
        min-width: 65px;
        max-width: 65px
    }
}

.basket .product-counter {
    display: flex;
    width: 102px;
    padding: 8px 4px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    background: var(--Back-Grey, #f4f4f4)
}

@media screen and (min-width: 1920px) {
    .basket .product-counter {
        min-width: 148px;
        height: 52px;
        justify-content: space-between;
        padding: 10px 18px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-counter {
        width: 88px;
        height: 36px;
        gap: 10px;
        padding: 8px 12px
    }
}

.basket .product-counter__current {
    width: 28px;
    color: #000;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .basket .product-counter__current {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-counter__current {
        font-size: 14px;
        line-height: 20px
    }
}

.basket .product-counter__minus,
.basket .product-counter__plus {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

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

    .basket .product-counter__minus svg,
    .basket .product-counter__plus svg {
        width: 20px;
        height: 20px
    }
}

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

    .basket .product-counter__minus svg,
    .basket .product-counter__plus svg {
        width: 12px;
        height: 12px
    }
}

.basket .product-counter--none,
.basket .product-counter--disabled {
    display: none
}

.basket .product-remove {
    cursor: pointer
}

.basket .product-remove img {
    height: 20px;
    width: 17px
}

@media screen and (min-width: 1920px) {
    .basket .product-remove img {
        width: 23px;
        height: 26px
    }
}

@media screen and (max-width: 1359px) {
    .basket .product-remove img {
        width: 18px;
        height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-price-bundle {
        max-width: 280px !important;
        min-width: 280px !important
    }
}

@media screen and (max-width: 723px) {
    .product-price-bundle .product-total {
        min-width: 90px
    }
}

@media screen and (max-width: 723px) {
    .product-total-basket {
        min-width: 102px !important;
        max-width: 102px !important
    }
}

.product--checkout {
    padding: 0 40px 0 24px;
    position: relative
}

@media screen and (min-width: 1920px) {
    .product--checkout {
        justify-content: space-between !important
    }
}

@media screen and (max-width: 1359px) {
    .product--checkout {
        padding: 0 24px
    }
}

@media screen and (max-width: 723px) {
    .product--checkout {
        padding: 0 12px
    }
}

.basket-present-container {
    display: flex;
    flex-direction: column
}

@media screen and (max-width: 1023px) {
    .basket-present-container {
        flex-direction: row;
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .basket-present-container {
        flex-direction: column
    }
}

.basket-present {
    padding: 16px 0;
    border: 1px solid #dedede;
    border-radius: 24px;
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .basket-present {
        margin-top: 32px;
        padding: 28px 0
    }
}

@media screen and (max-width: 1023px) {
    .basket-present {
        width: 100%
    }
}

@media screen and (max-width: 723px) {
    .basket-present {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        column-gap: 12px;
        min-height: 96px;
        margin: 0;
        border-radius: 16px
    }
}

.basket-present .info-container {
    display: flex;
    flex-direction: column;
    padding: 0 16px
}

@media screen and (min-width: 1920px) {
    .basket-present .info-container {
        padding: 0 28px
    }
}

.basket-present .text-container {
    display: flex;
    flex-direction: column;
    width: 100%
}

@media screen and (max-width: 1023px) {
    .basket-present .text-container {
        max-width: 274px
    }
}

.basket-present .text-container .basket-present__name {
    font-family: Headline Base;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin: 20px 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .basket-present .text-container .basket-present__name {
        font-size: 22px;
        line-height: 32px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1359px) {
    .basket-present .text-container .basket-present__name {
        font-size: 16px;
        line-height: 24px
    }
}

.basket-present__image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 75px;
    height: 75px;
    position: relative;
    border-radius: 50%;
    background: #e2f6ff
}

@media screen and (min-width: 1920px) {
    .basket-present__image {
        width: 125px;
        height: 125px
    }
}

.basket-present__image img {
    width: 65px;
    height: 65px
}

@media screen and (min-width: 1920px) {
    .basket-present__image img {
        width: 105px;
        height: 105px
    }
}

@media screen and (max-width: 1023px) {
    .basket-present__column {
        position: relative;
        overflow: hidden
    }
}

.basket-present__border {
    position: absolute;
    width: 80px;
    height: 80px;
    border: 3px solid #58c7f7;
    border-radius: 50%;
    aspect-ratio: 1
}

@media screen and (min-width: 1920px) {
    .basket-present__border {
        width: 130px;
        height: 130px
    }
}

.basket-present__divider {
    border: none;
    border-top: 1px solid #dedede;
    margin: 18px 0;
    width: 100%;
    position: relative;
    left: 0
}

@media screen and (min-width: 1920px) {
    .basket-present__divider {
        margin: 24px 0
    }
}

.basket-present__text {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .basket-present__text {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .basket-present__text {
        font-size: 14px;
        line-height: 16px
    }
}

.basket-present__text--info {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    width: 100%;
    padding: 0 16px
}

@media screen and (min-width: 1920px) {
    .basket-present__text--info {
        margin-top: 24px;
        font-size: 20px;
        line-height: 32px;
        padding: 0 28px
    }
}

@media screen and (max-width: 1023px) {
    .basket-present__text--info {
        width: 240px
    }
}

.basket-present__text--green {
    color: #4dcc8c
}

.basket-list__container {
    margin-bottom: 24px
} */

@media screen and (max-width: 1023px) {
    .bundle-basket-title {
        font-size: 16px;
        line-height: 24px
    }
}

.product-list-basket {
    max-width: 300px
}

.language-modal .button {
    padding: 8px 24px;
    color: #fff;
    background: #58c7f7;
    border: 1px solid #58c7f7;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .language-modal .button {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1024px) {
    .language-modal .button {
        padding: 8px 16px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .language-modal .button {
        padding: 8px 24px;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .language-modal .button {
        padding: 12px 16px;
        font-size: 13px;
        line-height: 16px
    }
}

.language-modal .button:hover {
    padding: 10px 26px;
    margin: -2px
}

@media screen and (min-width: 1920px) {
    .language-modal .button:hover {
        padding: 14px 34px
    }
}

@media screen and (max-width: 1024px) {
    .language-modal .button:hover {
        padding: 8px 16px;
        margin: 0
    }
}

@media screen and (max-width: 768px) {
    .language-modal .button:hover {
        padding: 8px 24px
    }
}

@media screen and (max-width: 423px) {
    .language-modal .button:hover {
        padding: 12px 16px
    }
}

.modal--white .button--modal {
    width: 99%;
    margin: 0 auto
}

@media screen and (min-width: 1920px) {
    .modal--white .button--modal {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .modal--white .button--modal {
        width: 100%;
        padding: 8px 0
    }
}

@media screen and (max-width: 423px) {
    .modal--white .button--modal {
        padding: 12px 16px;
        font-size: 12px;
        line-height: 16px
    }
}

.modal--white .button--modal:hover {
    width: 100%;
    padding: 14px 0;
    margin: -2px auto
}

@media screen and (min-width: 1920px) {
    .modal--white .button--modal:hover {
        padding: 15px 0;
        margin: -3px auto
    }
}

@media screen and (max-width: 1024px) {
    .modal--white .button--modal:hover {
        padding: 8px 0;
        margin: 0 auto
    }
}

@media screen and (max-width: 423px) {
    .modal--white .button--modal:hover {
        padding: 12px 16px;
        font-size: 12px;
        line-height: 16px
    }
}

.auth-modal .button--primary {
    width: 99%;
    margin: 24px auto 16px;
    border: none
}

@media screen and (min-width: 1920px) {
    .auth-modal .button--primary {
        margin: 24px auto;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) and (min-width: 424px) {
    .auth-modal .button--primary {
        width: 100%;
        padding: 8px 0;
        margin: 0
    }
}

@media screen and (max-width: 423px) {
    .auth-modal .button--primary {
        width: 100%;
        margin: 0
    }
}

.auth-modal .button--primary:hover {
    width: 100%;
    padding: 14px 0;
    margin: 22px auto 14px
}

@media screen and (min-width: 1920px) {
    .auth-modal .button--primary:hover {
        margin: 22px auto
    }
}

@media screen and (max-width: 1024px) {
    .auth-modal .button--primary:hover {
        padding: 8px 0;
        margin: 0
    }
}

@media screen and (max-width: 423px) {
    .auth-modal .button--primary:hover {
        padding: 12px 0
    }
}

.widget {
    position: relative;
    width: max-content;
    margin: 0 auto;
    padding: 24px 24px 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    .widget {
        padding: 32px 32px 40px
    }
}

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

.widget__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .widget__title {
        font-weight: 500;
        font-size: 35px;
        line-height: 40px
    }
}

@media screen and (max-width: 1024px) {
    .widget__title {
        font-weight: 500;
        font-size: 20px;
        line-height: 16px
    }
}

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

.widget__connection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 24px 0;
    padding: 12px 16px;
    background: #f0f6fb;
    border-radius: 10px
}

@media screen and (min-width: 1920px) {
    .widget__connection {
        margin: 32px 0;
        padding: 24px 32px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1024px) {
    .widget__connection {
        border-radius: 8px
    }
}

@media screen and (max-width: 768px) {
    .widget__connection {
        column-gap: 74px
    }
}

@media screen and (max-width: 423px) {
    .widget__connection {
        column-gap: 42px
    }
}

.widget__socials {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .widget__socials {
        row-gap: 16px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .widget__socials {
        font-size: 12px;
        line-height: 16px
    }
}

.widget__socials img {
    width: 48px;
    height: 48px
}

@media screen and (min-width: 1920px) {
    .widget__socials img {
        width: 64px;
        height: 64px
    }
}

@media screen and (max-width: 1024px) {
    .widget__socials img {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 768px) {
    .widget__socials img {
        width: 40px;
        height: 40px
    }
}

.widget__buttons {
    display: flex;
    align-items: center;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .widget__buttons {
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .widget__buttons {
        flex-direction: column;
        row-gap: 16px
    }
}

.widget__buttons .button {
    padding: 12px 36px
}

@media screen and (min-width: 1920px) {
    .widget__buttons .button {
        padding: 16px 48px;
        font-weight: 400;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .widget__buttons .button {
        padding: 16px 28px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .widget__buttons .button {
        width: 100%;
        padding: 12px 0;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .widget__buttons .button {
        font-size: 12px;
        line-height: 16px
    }

    .widget__buttons .button:first-child {
        padding: 16px 0
    }
}

.widget__buttons .button .widget__button-link {
    display: flex;
    align-items: center;
    color: #58c7f7
}

.widget__buttons .button img {
    width: 24px;
    height: 24px;
    margin-right: 8px
}

@media screen and (min-width: 1920px) {
    .widget__buttons .button img {
        width: 32px;
        height: 32px;
        margin-right: 10px
    }
}

@media screen and (max-width: 1024px) {
    .widget__buttons .button img {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 768px) {
    .widget__buttons .button img {
        width: 24px;
        height: 24px
    }
}

.widget a {
    text-decoration: none
}

.widget-button {
    position: sticky;
    bottom: 0;
    position: fixed;
    bottom: 70px;
    right: 0;
    display: block;
    z-index: 100;
    cursor: pointer
}

.widget-button svg {
    position: absolute;
    width: 56px;
    height: 56px;
    right: 32px;
    bottom: 0;
    margin: 0;
    transition: all .25s ease-out
}

@media screen and (min-width: 1920px) {
    .widget-button svg {
        width: 72px;
        height: 72px;
        bottom: 70px;
    }
}

@media screen and (max-width: 1359px) {
    .widget-button svg {
        right: 6px;
        bottom: 70px;
        width: 42px;
        height: 42px
    }
}

@media screen and (max-width: 1023px) {
    .widget-button svg {
        display: none
    }
}

.widget-button svg:hover {
    margin: -2px;
    width: 60px;
    height: 60px;
    transition: all .25s ease-out
}

@media screen and (min-width: 1920px) {
    .widget-button svg:hover {
        width: 76px;
        height: 76px
    }
}

@media screen and (max-width: 1359px) {
    .widget-button svg:hover {
        margin: 0;
        width: 42px;
        height: 42px
    }
}

@media screen and (max-width: 1023px) {
    .footer-status-bar .widget-button--mobile {
        position: absolute;
        bottom: 100px;
        right: 8px;
        z-index: 5;
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 723px) {
    .footer-status-bar .widget-button--mobile {
        right: 12px
    }
}

.card .product-page-equipment__item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    font-size: 12px;
    line-height: 16px;
    padding: 8px;
    border-radius: 20px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__item {
        height: 32px;
        padding: 4px 8px;
        border-radius: 16px;
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .card .product-page-equipment__item {
        font-size: 10px;
        line-height: 14px;
        padding: 4px 6px
    }
}

@media screen and (max-width: 1023px) {
    .card .product-page-equipment__item {
        font-size: 8px;
        line-height: 12px;
        height: 20px;
        width: 28px
    }
}

.card .product-page-equipment__item:hover {
    border: 1px solid #dedede
}

.card .product-page-equipment__item--selected,
.card .product-page-equipment__item--selected:hover {
    border: 1px solid #58c7f6
}

.card .product-page-equipment__item--disabled {
    color: #b6b6b6
}

.card .product-page-equipment__item--disabled:hover {
    border-color: transparent
}

.card .product-page-equipment__wrapper {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    background: #ffffffe6;
    box-shadow: inset -32px 0 8px #fff
}

.card .product-page-equipment__wrapper--hidden {
    top: unset;
    padding: 0 8px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__wrapper--hidden {
        padding: 0 16px
    }
}

.card .product-page-equipment__wrapper--hidden .product-page-equipment__close {
    display: none
}

.card .product-page-equipment__row {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 4px;
    margin-bottom: 8px;
    display: flex;
    flex-wrap: nowrap;
    gap: 2px;
    padding: 0 20px 0 0;
    overflow: hidden;
    transition: max-height .3s ease;
    max-height: 40px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__row {
        column-gap: 4px;
        row-gap: 8px;
        padding: 0 36px 0 0;
        margin-bottom: 0
    }
}

@media screen and (max-width: 1359px) {
    .card .product-page-equipment__row {
        margin-bottom: 0
    }
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__button {
        padding: 4px 4px 4px 6px
    }
}

.card .product-page-equipment__button-bg {
    height: 30px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__button-bg {
        height: 42px
    }
}

.card .product-page-equipment__button-bg svg {
    transform: rotate(180deg)
}

.card .product-page-equipment__close {
    position: absolute;
    top: 6px;
    right: 8px;
    width: 16px;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 5
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment__close {
        top: 16px;
        right: 16px;
        width: 24px;
        height: 24px
    }

    .card .product-page-equipment__close svg {
        width: 15px;
        height: 15px
    }
}

.card .product-page-equipment--colors .product-page-equipment__row {
    padding: 6px 4px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment--colors .product-page-equipment__row {
        padding: 8px 6px
    }
}

@media screen and (max-width: 1359px) {
    .card .product-page-equipment--colors .product-page-equipment__row {
        padding: 6px 4px 5px
    }
}

@media screen and (max-width: 1023px) {
    .card .product-page-equipment--colors .product-page-equipment__row {
        padding: 6px 4px
    }
}

.card .product-page-equipment--colors .card-colors {
    margin: 0;
    column-gap: 12px;
    cursor: auto
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment--colors .card-colors {
        column-gap: 16px
    }
}

.card .product-page-equipment--colors .card-colors__item {
    min-width: 16px;
    max-width: 16px;
    min-height: 16px;
    max-height: 16px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment--colors .card-colors__item {
        min-width: 24px;
        max-width: 24px;
        min-height: 24px;
        max-height: 24px
    }
}

.card .product-page-equipment--colors .card-colors__item img {
    min-width: 16px;
    max-width: 16px;
    min-height: 16px;
    max-height: 16px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment--colors .card-colors__item img {
        min-width: 24px;
        max-width: 24px;
        min-height: 24px;
        max-height: 24px
    }
}

.card .product-page-equipment--colors .card-colors__item:before {
    width: 22px;
    height: 22px
}

@media screen and (min-width: 1920px) {
    .card .product-page-equipment--colors .card-colors__item:before {
        width: 30px;
        height: 30px
    }
}

.card .product-page-equipment--colors .card-colors__item.checked:before {
    border-color: #58c7f7
}

.card .product-page-equipment--colors .card-colors__item--disabled {
    opacity: .3;
    pointer-events: none;
    cursor: auto
}

.card .product-page-equipment__row.expanded {
    flex-wrap: wrap !important;
    max-height: 200px !important
}

.services-tracking {
    position: relative;
    width: 50%;
    padding: 46px 24px;
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .services-tracking {
        padding: 64px 24px
    }
}

@media screen and (max-width: 1024px) {
    .services-tracking {
        padding: 21px 24px
    }
}

@media screen and (max-width: 680px) {
    .services-tracking {
        min-width: 100%;
        max-width: max-content;
        padding: 24px 16px
    }
}

.services-tracking__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .services-tracking__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .services-tracking__title {
        font-size: 18px;
        line-height: 20px
    }
}

.services-tracking__field {
    position: relative;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    .services-tracking__field {
        margin-top: 32px
    }
}

.services-tracking__field .text-field__container {
    min-width: 100%;
    max-width: 100%;
    min-height: 56px;
    max-height: 56px
}

@media screen and (min-width: 1920px) {
    .services-tracking__field .text-field__container {
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (max-width: 680px) {
    .services-tracking__field .text-field__container {
        min-height: 52px;
        max-height: 52px
    }
}

.services-tracking__field .text-field__input {
    height: max-content;
    padding: 8px 0
}

@media screen and (min-width: 1920px) {
    .services-tracking__field .text-field__input {
        padding: 12px 0;
        font-size: 24px
    }
}

@media screen and (max-width: 1024px) {
    .services-tracking__field .text-field__input {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 680px) {
    .services-tracking__field .text-field__input {
        font-size: 14px;
        line-height: 20px
    }
}

.services-tracking__field .text-field__label {
    padding: 0
}

@media screen and (max-width: 1024px) {
    .services-tracking__field .text-field__label {
        font-size: 12px;
        line-height: 16px
    }
}

.services-tracking__button {
    position: absolute;
    right: 0;
    bottom: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #58c7f7;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .services-tracking__button {
        font-size: 24px;
        line-height: 32px;
        bottom: 12px
    }
}

@media screen and (max-width: 768px) {
    .services-tracking__button {
        font-size: 14px;
        line-height: 20px
    }
}

.services-modal__text {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .services-modal__text {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .services-modal__text {
        font-size: 18px
    }
}

@media screen and (max-width: 680px) {
    .services-modal__text {
        font-size: 14px;
        line-height: 20px
    }
}

.services-modal__socials {
    display: flex;
    column-gap: 16px;
    margin-top: 32px
}

.services-modal__link {
    display: flex;
    align-items: center;
    column-gap: 4px;
    font-size: 13px;
    line-height: 16px;
    color: #888;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .services-modal__link {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 680px) {
    .services-modal__link {
        font-size: 12px
    }
}

.services-modal__link img {
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .services-modal__link img {
        width: 20px;
        height: 20px
    }
}

.services-modal .modal--white {
    min-width: 500px;
    max-width: 500px;
    padding: 32px 24px 48px;
    border-radius: 24px;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .services-modal .modal--white {
        min-width: 720px;
        max-width: 720px;
        padding: 40px 32px 48px
    }
}

@media screen and (max-width: 680px) {
    .services-modal .modal--white {
        min-width: 344px;
        max-width: 344px;
        padding: 24px 24px 32px
    }
}

.services-modal .modal-header {
    column-gap: 8px
}

@media screen and (min-width: 1920px) {
    .services-modal .modal-header {
        margin-bottom: 32px
    }
}

.services-modal .modal-title {
    font-size: 20px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .services-modal .modal-title {
        font-size: 36px;
        line-height: 48px
    }
}

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

@media screen and (max-width: 680px) {
    .services-modal .modal-title {
        font-size: 16px;
        line-height: 20px
    }
}

@media screen and (min-width: 1920px) {
    .services-modal .close-button {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 680px) {
    .services-modal .close-button {
        min-width: 16px;
        max-width: 16px;
        min-height: 16px;
        max-height: 16px
    }
}

.services-modal--application .modal--white {
    min-width: max-content;
    max-width: 60vw;
    border-radius: 40px
}

@media screen and (min-width: 1920px) {
    .services-modal--application .modal--white {
        max-width: 70vw
    }
}

@media screen and (max-width: 1024px) {
    .services-modal--application .modal--white {
        min-width: unset;
        max-width: 80vw
    }
}

@media screen and (max-width: 680px) {
    .services-modal--application .modal--white {
        max-width: 90vw
    }
}

.services-modal--application .modal-header {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .services-modal--application .modal-header {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 680px) {
    .services-modal--application .modal-header {
        margin-bottom: 8px;
        align-items: flex-start;
        column-gap: 0
    }
}

.services-modal--application .services-modal__text {
    width: 90%
}

@media screen and (max-width: 680px) {
    .services-modal--application .services-modal__text {
        width: 100%
    }
}

.services-modal--green {
    color: #4dcc8c
}

.product-page-equipment {
    color: #151514;
    font-style: normal;
    font-weight: 400
}

.product-page-equipment__title {
    color: #888
}

@media screen and (min-width: 1920px) {
    .product-page-equipment__title {
        font-size: 16px;
        line-height: 24px
    }
}

.product-page-equipment__item {
    min-width: max-content;
    height: max-content;
    padding: 4px;
    color: #151514;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid transparent;
    background: none
}

.product-page-equipment__button-wrapper {
    display: none
}

.product-page-equipment__wrapper--hidden .product-page-equipment__button-wrapper {
    display: flex
}

.product-page-equipment__button {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 6px 2px 6px 4px;
    border-radius: 8px;
    background: #ededed;
    border: none;
    cursor: pointer;
    color: #151514;
    z-index: 5;
    line-height: 12px;
    font-size: 10px;
    font-style: normal;
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .product-page-equipment__button {
        font-size: 15px;
        line-height: 24px
    }

    .product-page-equipment__button svg {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-equipment__button {
        font-size: 8px;
        line-height: 8px;
        height: 20px;
        border-radius: 8px
    }
}

.product-page-equipment__button-wrapper {
    position: absolute;
    right: 0;
    bottom: 0;
    align-items: center
}

.product-page-equipment__button-bg {
    margin-right: -2px;
    width: 106px;
    background: linear-gradient(270deg, #fff, #fff0 70%)
}

@media screen and (max-width: 1359px) {
    .product-page-equipment__button-bg {
        width: 40px;
        margin-right: -5px;
        background: linear-gradient(270deg, #fff, #fff0)
    }
}

.product-page .product-page-equipment {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-equipment {
        margin-bottom: 32px
    }
}

.product-page .product-page-equipment__title {
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 12px
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-equipment__title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-page-equipment__title {
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-page-equipment__title {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page .product-page-equipment__title span {
    font-weight: 600;
    color: #151514
}

.product-page .product-page-equipment__item {
    font-size: 14px;
    line-height: 20px;
    padding: 8px 12px;
    color: #151514;
    border-radius: 8px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-equipment__item {
        font-size: 20px;
        line-height: 28px;
        padding: 8px 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-page-equipment__item {
        font-size: 16px;
        line-height: 24px
    }
}

.product-page .product-page-equipment__item:hover,
.product-page .product-page-equipment__item--active,
.product-page .product-page-equipment__item--active:hover {
    border-color: #58c7f7
}

.product-page .product-page-equipment__item--disabled {
    color: #b6b6b6
}

.product-page .product-page-equipment__item--disabled:hover {
    border-color: transparent
}

.product-page .product-page-equipment__item--discount {
    font-weight: 500;
    color: #eb606c
}

.product-page .product-page-equipment__wrapper {
    position: relative;
    display: flex;
    column-gap: 12px;
    row-gap: 8px;
    flex-wrap: wrap
}

.product-page .product-page-equipment__button {
    display: none
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-equipment__button {
        padding: 12px 6px 12px 8px
    }
}

.product-page .product-page-equipment__button-bg {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: -2px;
    width: 82px;
    height: 26px;
    background: linear-gradient(270deg, #fff, #fff0 300%)
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-equipment__button-bg {
        width: 120px;
        height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-page-equipment__button-bg {
        height: 24px
    }
}

.google-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    width: 218px;
    height: 60px;
    padding: 12px 16px;
    color: #000;
    border-radius: 12px;
    border: .369px dashed #888
}

@media screen and (min-width: 1920px) {
    .google-link {
        width: 301px;
        height: 74px
    }
}

@media screen and (max-width: 1023px) {
    .google-link {
        width: 163px;
        height: 50px;
        padding: 8px 12px;
        border-radius: 6px;
        margin-bottom: 6px
    }
}

@media screen and (max-width: 723px) {
    .google-link {
        width: 95px;
        height: 32px;
        padding: 4px 9px;
        margin-bottom: 4px;
        border-radius: 4px;
        position: relative
    }
}

.google-link__title {
    font-family: Headline Base;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .google-link__title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .google-link__title {
        font-size: 10px;
        line-height: 20px;
        min-width: max-content
    }
}

@media screen and (max-width: 723px) {
    .google-link__title {
        font-size: 8px;
        line-height: 9px;
        margin-top: -2px
    }
}

.google-link__map {
    width: 32px;
    height: 32px
}

@media screen and (min-width: 1920px) {
    .google-link__map {
        width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 1023px) {
    .google-link__map {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 723px) {
    .google-link__map {
        width: 12px;
        height: 12px;
        position: absolute;
        right: 6px;
        top: 3px
    }
}

.tape {
    position: relative;
    display: flex;
    align-items: center;
    height: 40px;
    background: radial-gradient(100.13% 3735.09% at 0% 0%, #6ddee1, #647eda)
}

@media screen and (min-width: 1920px) {
    .tape {
        height: 48px
    }
}

@media screen and (max-width: 768px) {
    .tape {
        padding: 8px 0;
        height: max-content
    }

    .tape .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        column-gap: 28px
    }
}

@media screen and (max-width: 423px) {
    .tape {
        padding: 12px 0
    }

    .tape .container {
        column-gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .tape--image {
        height: 40px
    }
}

.tape--image .tape__text {
    column-gap: 8px
}

@media screen and (min-width: 1920px) {
    .tape--image .tape__text {
        column-gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .tape--image .tape__text {
        column-gap: 4px
    }
}

.tape__close-btn {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    padding: 4px;
    cursor: pointer
}

@media screen and (max-width: 768px) {
    .tape__close-btn {
        display: none
    }
}

.tape__close-btn--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    .tape__close-btn--mobile {
        display: block;
        position: relative;
        top: unset;
        right: unset;
        transform: none;
        width: 16px;
        height: 16px;
        padding: 0
    }
}

@media screen and (max-width: 423px) {
    .tape__close-btn--mobile {
        width: 12px;
        height: 12px
    }

    .tape__close-btn--mobile svg {
        width: 12px;
        height: 12px
    }
}

.tape__text {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 16px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    .tape__text {
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .tape__text {
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

@media screen and (max-width: 423px) {
    .tape__text {
        row-gap: 8px
    }
}

.tape__title {
    font-family: Headline Base;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    .tape__title {
        font-size: 22px
    }
}

@media screen and (max-width: 1024px) {
    .tape__title {
        font-size: 13px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .tape__title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .tape__title {
        font-size: 14px;
        line-height: 16px
    }
}

.tape__link {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    color: #fff;
    text-decoration: underline
}

@media screen and (min-width: 1920px) {
    .tape__link {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .tape__link {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .tape__link {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .tape__link {
        font-size: 13px;
        line-height: 16px
    }
}

.tape__image {
    position: relative;
    z-index: 5;
    top: 5px;
    margin-right: 16px
}

@media screen and (min-width: 1920px) {
    .tape__image {
        width: 39px;
        height: 56px;
        margin-right: 8px;
        top: 8px
    }
}

@media screen and (max-width: 1024px) {
    .tape__image {
        top: 6px
    }
}

@media screen and (max-width: 768px) {
    .tape__image {
        display: none;
        width: 29px;
        height: 42px;
        margin-right: 12px;
        top: 4px
    }
}

.tape__image--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    .tape__image--mobile {
        display: block
    }
}

.search-history-container {
    display: flex;
    justify-content: center
}

@media screen and (min-width: 2600px) {
    .search-history-container {
        width: max-content;
        border-radius: 24px
    }
}

@media screen and (max-width: 1023px) {
    .search-history-container {
        display: none
    }
}

.search-history {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 18px
}

@media screen and (max-width: 1359px) {
    .search-history {
        gap: 16px;
        margin-top: 16px
    }
}

@media screen and (max-width: 1023px) {
    .search-history {
        flex-direction: unset;
        margin-top: 14px;
        gap: 10px;
        flex-wrap: wrap
    }
}

.search-history__wrapper {
    position: relative;
    overflow-y: auto;
    max-height: 500px;
    margin-bottom: 8px;
    margin-top: 8px
}

@media screen and (min-width: 1920px) {
    .search-history__wrapper {
        margin: 0
    }
}

@media screen and (max-width: 1359px) {
    .search-history__wrapper {
        max-height: 400px;
        margin-top: 0
    }
}

@media screen and (max-width: 1023px) {
    .search-history__wrapper {
        min-height: 480px;
        max-height: 480px
    }
}

.search-history__item {
    display: flex;
    align-items: center;
    width: 228px;
    justify-content: space-between
}

.search-history__item :hover {
    color: #58c7f7
}

@media screen and (max-width: 1359px) {
    .search-history__item {
        gap: 4px
    }
}

@media screen and (max-width: 1023px) {
    .search-history__item {
        gap: 0;
        width: max-content;
        display: flex;
        padding: 10px 12px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        border-radius: 80px;
        border: .5px solid #dedede
    }

    .search-history__item :hover {
        color: #151514
    }
}

@media screen and (max-width: 723px) {
    .search-history__item {
        padding: 8px 10px
    }
}

.search-history__item img {
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .search-history__item img {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 1359px) {
    .search-history__item img {
        width: 14px;
        height: 14px
    }
}

.search-history__link {
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    text-decoration: none;
    font-weight: 700
}

@media screen and (min-width: 1920px) {
    .search-history__link {
        font-size: 18px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .search-history__link {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .search-history__link {
        font-size: 14px
    }
}

.search-history__link-category {
    font-weight: 500
}

.search-history svg {
    cursor: pointer;
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .search-history svg {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .search-history svg {
        width: 24px;
        height: 24px
    }
}

@media screen and (min-width: 1920px) {
    .search-history .search-text {
        margin-top: 16px
    }
}

@media screen and (max-width: 1023px) {
    .search-history .search-text {
        margin: 0
    }
}

.search-history .search-text__item {
    color: #494949;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .search-history .search-text__item {
        font-size: 15px;
        line-height: 24px
    }
}

.search-history .btn-remove-history-item {
    width: 10px;
    height: 10px
}

@media screen and (min-width: 1920px) {
    .search-history .btn-remove-history-item {
        width: 14px;
        height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .search-history .btn-remove-history-item {
        width: 12px;
        height: 12px
    }
}

.search-history .btn-remove-history-item :hover {
    fill: #58c7f7
}

.search-history .search-history__content {
    display: flex;
    align-items: center;
    gap: 8px
}

.search-history-container-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .search-history-container-mobile {
        display: flex;
        position: absolute;
        width: 100%
    }
}

.bg-list-search {
    bottom: 15%
}

@media screen and (max-width: 723px) {
    .bg-list-search {
        bottom: 12%
    }
}

.category-search {
    display: flex;
    max-width: 900px;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    align-self: stretch;
    margin-top: 28px
}

.category-search__title {
    color: #494949;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px
}

.category-search__item-list {
    display: flex;
    align-items: center;
    gap: 10px
}

.category-search__item {
    display: flex;
    padding: 10px 12px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border-radius: 80px;
    border: .5px solid #dedede;
    cursor: pointer
}

.category-search__label {
    color: #151514;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

@media screen and (max-width: 1023px) {
    .category-search__icon {
        width: 16px;
        height: 16px
    }
}

mark {
    background: transparent;
    color: #151514;
    font-style: normal;
    font-weight: 500
}

.recommended-title-container {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between
}

.item-brand {
    display: none
}

@media screen and (max-width: 1023px) {
    .item-brand {
        display: flex
    }
}

.brand-logo {
    width: 24px !important;
    height: 13px !important
}

@media screen and (min-width: 1920px) {
    .brand-logo {
        width: 33px !important;
        height: 18px !important
    }
}

@media screen and (max-width: 1359px) {
    .brand-logo {
        width: 22px !important;
        height: 12px !important
    }
}

@media screen and (max-width: 1023px) {
    .brand-logo {
        width: 20px !important;
        height: 11px !important
    }
}

@media screen and (max-width: 723px) {
    .brand-logo {
        width: 18px !important;
        height: 10px !important
    }
}

.cooperation-info {
    display: flex;
    column-gap: 24px;
    padding: 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-info {
        padding: 40px 32px 48px;
        column-gap: 40px;
        margin-top: 48px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-info {
        padding-block: 32px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-info {
        flex-direction: column;
        row-gap: 24px;
        padding: 24px 16px 32px
    }
}

.cooperation-info__column {
    width: 50%
}

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

.cooperation-info__column:first-child {
    padding-right: 24px;
    border-right: 1px solid #dedede
}

@media screen and (max-width: 768px) {
    .cooperation-info__column:first-child {
        padding-right: 0;
        padding-bottom: 24px;
        border: none;
        border-bottom: 1px solid #dedede
    }
}

.cooperation-info__title {
    font-family: Headline Base;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    text-align: left;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-info__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-info__title {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 16px
    }
}

.cooperation-info__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
    margin-top: 16px
}

@media screen and (min-width: 1920px) {
    .cooperation-info__text {
        font-size: 24px;
        line-height: 38px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-info__text {
        margin-top: 24px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-info__text {
        font-size: 14px;
        line-height: 20px;
        margin-top: 16px
    }
}

.cooperation-info__text--green span {
    color: #4dcc8c;
    font-weight: 600
}

.cooperation-info__text--green::marker {
    color: #4dcc8c
}

.cooperation-info__text--pink span {
    color: #d357c0;
    font-weight: 600
}

.cooperation-info__text--pink::marker {
    color: #d357c0
}

.cooperation-info__text--blue span {
    color: #58c7f7;
    font-weight: 600
}

.cooperation-info__text--blue::marker {
    color: #58c7f7
}

.cooperation-info__text li {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .cooperation-info__text li {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-info__text li {
        margin-bottom: 38px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-info__text li {
        margin-bottom: 20px
    }
}

.cooperation-info__text li:last-child {
    margin-bottom: 0
}

.cooperation-info ul {
    padding-left: 24px
}

@media screen and (max-width: 768px) {
    .cooperation-info ul {
        padding-left: 20px
    }
}

.cooperation-advantages {
    display: flex;
    flex-direction: column;
    padding: 88px 100px
}

@media screen and (min-width: 1920px) {
    .cooperation-advantages {
        padding-block: 96px;
        column-gap: 105px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages {
        padding: 72px 60px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages {
        padding: 32px 16px 40px
    }
}

.cooperation-advantages__column {
    display: flex;
    column-gap: 80px
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages__column {
        column-gap: 40px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__column {
        flex-direction: column;
        padding: 0
    }
}

.cooperation-advantages__column .cooperation-advantages__item {
    padding-block: 40px
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages__column .cooperation-advantages__item {
        padding-block: 28px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__column .cooperation-advantages__item {
        padding-block: 32px
    }
}

.cooperation-advantages__column:first-child .cooperation-advantages__item {
    padding-block: 50px
}

@media screen and (min-width: 1920px) {
    .cooperation-advantages__column:first-child .cooperation-advantages__item {
        padding-block: 62px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages__column:first-child .cooperation-advantages__item {
        padding-block: 40px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__column:first-child .cooperation-advantages__item {
        padding-block: 32px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__column:last-child .cooperation-advantages__item:last-child {
        border: none
    }
}

.cooperation-advantages__item {
    display: flex;
    align-items: center;
    column-gap: 24px;
    width: 50%;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-advantages__item {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__item {
        width: 100%;
        column-gap: 16px;
        font-size: 14px;
        line-height: 20px;
        border-bottom: 1px solid #dedede
    }
}

.cooperation-advantages__item:first-child {
    padding-right: 80px;
    border-right: 1px solid #dedede
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages__item:first-child {
        padding-right: 40px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__item:first-child {
        padding-right: 0;
        border-right: none
    }
}

@media screen and (min-width: 1920px) {
    .cooperation-advantages__img {
        min-height: 80px;
        width: 80px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-advantages__img {
        min-height: 50px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-advantages__img {
        min-height: 32px;
        width: 40px
    }
}

@media screen and (min-width: 1920px) {
    .cooperation-advantages__img--first {
        min-height: 64px;
        width: auto
    }
}

.cooperation-type {
    display: flex;
    flex-direction: column;
    flex: 1;
    row-gap: 32px;
    padding: 24px 24px 32px
}

@media screen and (min-width: 1920px) {
    .cooperation-type {
        padding: 40px 32px 48px;
        row-gap: 48px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-type {
        padding: 24px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type {
        padding: 16px 16px 32px;
        row-gap: 24px
    }
}

.cooperation-type.cooperation-block {
    margin: 0
}

.cooperation-type__title {
    font-family: Headline Base;
    font-size: 24px;
    line-height: 28px;
    font-weight: 500;
    text-align: center;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .cooperation-type__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__title {
        font-size: 20px;
        line-height: 24px
    }
}

.cooperation-type__title--green {
    color: #4dcc8c
}

.cooperation-type__title--pink {
    color: #d357c0
}

.cooperation-type__title--blue {
    color: #58c7f7
}

.cooperation-type__subtitle {
    font-family: Headline Base;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .cooperation-type__subtitle {
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 16px
    }
}

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

.cooperation-type__text {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-type__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-type__text {
        row-gap: 32px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__text {
        font-size: 14px;
        line-height: 20px;
        row-gap: 20px
    }
}

.cooperation-type__text--instructions {
    display: block
}

.cooperation-type__text a {
    text-decoration: none;
    color: #58c7f7
}

.cooperation-type__icon {
    width: 19px;
    height: 19px
}

@media screen and (min-width: 1920px) {
    .cooperation-type__icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__icon {
        width: 16px;
        height: 16px
    }
}

.cooperation-type__row {
    min-height: 80px
}

@media screen and (min-width: 1920px) {
    .cooperation-type__row {
        min-height: 124px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__row {
        min-height: max-content
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-type__row--last {
        min-height: 104px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__row--last {
        min-height: max-content
    }
}

.cooperation-type__interaction {
    min-height: 272px
}

@media screen and (min-width: 1920px) {
    .cooperation-type__interaction {
        min-height: 414px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-type__interaction {
        min-height: 344px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-type__interaction {
        min-height: max-content
    }
}

.buy-level {
    display: flex;
    column-gap: 2px;
    width: 100%;
    padding: 24px 0 28px
}

@media screen and (min-width: 1920px) {
    .buy-level {
        padding: 32px 0 8px
    }
}

@media screen and (max-width: 1024px) {
    .buy-level {
        padding-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .buy-level {
        padding: 16px 0 0
    }
}

.buy-level__item {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
    flex: 1
}

@media screen and (min-width: 1920px) {
    .buy-level__item {
        row-gap: 8px
    }
}

.buy-level__item--active .buy-level__text--gray {
    color: #000
}

.buy-level__item--active .buy-level__block {
    background: #4dcc8c
}

.buy-level__block {
    display: flex;
    align-items: center;
    height: 32px;
    padding-left: 4px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .buy-level__block {
        height: 40px
    }
}

.buy-level__text {
    font-size: 12px;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .buy-level__text {
        font-size: 15px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .buy-level__text {
        font-size: 10px;
        line-height: 12px
    }
}

.buy-level__text--gray {
    color: #dedede
}

.buy-level__price {
    display: flex;
    justify-content: flex-end
}

.buy-level__price--first {
    justify-content: space-between
}

.modal-preorder {
    min-width: 600px;
    max-width: 600px;
    padding: 24px 24px 32px;
    border-radius: 24px
}

@media screen and (min-width: 1920px) {
    .modal-preorder {
        min-width: 939px;
        max-width: 939px;
        padding: 48px 40px 56px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1024px) {
    .modal-preorder {
        min-width: 500px;
        max-width: 500px;
        padding-bottom: 28px
    }
}

@media screen and (max-width: 768px) {
    .modal-preorder {
        min-width: 350px;
        max-width: 350px
    }
}

@media screen and (max-width: 423px) {
    .modal-preorder {
        min-width: 340px;
        max-width: 340px
    }
}

.modal-preorder .modal-header {
    margin: 0
}

.modal-preorder__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    margin-block: 40px
}

.modal-preorder__text--green {
    font-weight: 600;
    color: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .modal-preorder__text {
        font-size: 24px;
        line-height: 38px;
        margin-block: 56px
    }
}

@media screen and (max-width: 1024px) {
    .modal-preorder__text {
        font-size: 14px;
        line-height: 20px;
        margin-block: 32px
    }
}

.modal-preorder__buttons {
    display: flex;
    align-items: center;
    gap: 16px
}

@media screen and (min-width: 1920px) {
    .modal-preorder__buttons {
        gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .modal-preorder__buttons {
        flex-direction: column
    }
}

.modal-preorder__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    color: #151514;
    margin-right: 0
}

@media screen and (min-width: 1920px) {
    .modal-preorder__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .modal-preorder__title {
        font-size: 20px;
        line-height: 24px
    }
}

.modal-preorder .button--modal {
    width: 100%;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #151514;
    margin: 0;
    padding: 16px 0;
    border-radius: 12px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .modal-preorder .button--modal {
        padding: 24px 0;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .modal-preorder .button--modal {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .modal-preorder .button--modal {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 423px) {
    .modal-preorder .button--modal {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-preorder .button--modal:hover {
    padding: 16px 0;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .modal-preorder .button--modal:hover {
        padding: 24px 0
    }
}

@media screen and (max-width: 1024px) {
    .modal-preorder .button--modal:hover {
        padding: 16px 0
    }
}

@media screen and (max-width: 768px) {
    .modal-preorder .button--modal:hover {
        padding: 16px 0
    }
}

@media screen and (max-width: 423px) {
    .modal-preorder .button--modal:hover {
        padding: 16px 0;
        font-size: 14px;
        line-height: 20px
    }
}

.modal-preorder .button--modal.button--filled {
    font-weight: 600;
    color: #fff;
    background: #58c7f6;
    border: none
}

.modal-preorder .button--modal.button--filled:hover {
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

.product-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    border-top: .5px solid #dedede;
    background: #fff;
    transform: translateY(100%);
    transition: transform .3s ease
}

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

.product-bar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #151514;
    padding: 16px 40px
}

@media screen and (min-width: 1920px) {
    .product-bar .container {
        padding-block: 18px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar .container {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-bar .container {
        padding: 18px 24px
    }
}

.product-bar__info {
    display: flex;
    align-items: center;
    column-gap: 10px
}

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

.product-bar__name {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 4px
}

@media screen and (min-width: 1920px) {
    .product-bar__name {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__name {
        font-size: 12px;
        line-height: 14px
    }
}

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

.product-bar__description {
    font-size: 12px;
    font-weight: 400;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .product-bar__description {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__description {
        line-height: 16px
    }
}

.product-bar__product {
    display: flex;
    align-items: center;
    column-gap: 24px
}

@media screen and (max-width: 1023px) {
    .product-bar__product {
        width: 100%;
        justify-content: space-between
    }
}

.product-bar__actions {
    display: flex;
    align-items: center;
    column-gap: 24px
}

@media screen and (max-width: 1359px) {
    .product-bar__actions {
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product-bar__actions {
        column-gap: 8px
    }
}

.product-bar__price {
    font-family: Headline Base;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    padding-right: 24px;
    border-right: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .product-bar__price {
        font-size: 40px;
        line-height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .product-bar__price {
        font-size: 24px;
        line-height: 28px;
        border: none;
        padding-right: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__price {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-bar__price {
        font-size: 18px
    }
}

@media screen and (max-width: 459px) {
    .product-bar__price {
        font-size: 16px;
        min-width: max-content;
        max-width: max-content;
        padding: 0
    }
}

.product-bar__btn {
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    border-radius: 12px;
    color: #fff;
    background: #58c7f6
}

.product-bar__btn:hover {
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .product-bar__btn {
        padding: 20px 32px;
        border-radius: 16px;
        font-size: 20px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__btn {
        font-size: 12px;
        line-height: 16px;
        padding-block: 12px;
        border-radius: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product-bar__btn {
        border-radius: 10px;
        font-size: 12px;
        line-height: 14px;
        padding: 16px
    }
}

@media screen and (max-width: 723px) {
    .product-bar__btn {
        padding: 12px 14px;
        font-size: 10px;
        line-height: 14px
    }
}

@media screen and (max-width: 459px) {
    .product-bar__btn {
        border-radius: 10px;
        padding: 8px 12px;
        font-size: 8px;
        font-weight: 600;
        line-height: 12px
    }
}

.button-favorite {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    max-width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .button-favorite {
        min-width: 70px;
        max-width: 70px;
        height: 70px
    }
}

@media screen and (max-width: 1359px) {
    .button-favorite {
        min-width: 40px;
        max-width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .button-favorite {
        min-width: 48px;
        max-width: 48px;
        height: 48px
    }
}

@media screen and (max-width: 723px) {
    .button-favorite {
        min-width: 40px;
        max-width: 40px;
        height: 40px
    }
}

.button-favorite img {
    width: 20px;
    height: 18px;
    margin: 0
}

@media screen and (min-width: 1920px) {
    .button-favorite img {
        width: 28px;
        height: 25px
    }
}

@media screen and (max-width: 1359px) {
    .button-favorite img {
        width: 16px;
        height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .button-favorite img {
        width: 18px;
        height: 17px
    }
}

@media screen and (max-width: 723px) {
    .button-favorite img {
        width: 16px;
        height: 15px
    }
}

.button-favorite .button-favorite--full {
    display: none
}

.button-favorite.hover .button-favorite--full {
    display: block
}

.button-favorite.hover .button-favorite--empty {
    display: none
}

.product-bar__info {
    display: flex;
    gap: 12px
}

@media screen and (max-width: 723px) {
    .product-bar__info {
        gap: 8px
    }
}

.product-bar__info .product-bar__image-wrapper {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    border: 1px solid var(--Stroke-Grey, #dedede)
}

@media screen and (min-width: 1920px) {
    .product-bar__info .product-bar__image-wrapper {
        width: 100px;
        height: 85px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__info .product-bar__image-wrapper {
        width: 47px;
        height: 40px
    }
}

@media screen and (max-width: 723px) {
    .product-bar__info .product-bar__image-wrapper {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 459px) {
    .product-bar__info .product-bar__image-wrapper {
        width: 32px;
        height: 32px
    }
}

@media screen and (min-width: 1920px) {
    .product-bar__info .product-bar__image-wrapper img {
        width: 100px;
        height: 85px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__info .product-bar__image-wrapper img {
        width: 47px;
        height: 40px
    }
}

@media screen and (max-width: 723px) {
    .product-bar__info .product-bar__image-wrapper img {
        width: 40px;
        height: 40px
    }
}

@media screen and (max-width: 459px) {
    .product-bar__info .product-bar__image-wrapper img {
        width: 32px;
        height: 32px
    }
}

.reviews__rate-bar img {
    width: 12px;
    height: 12px
}

@media screen and (min-width: 1920px) {
    .reviews__rate-bar img {
        width: 16px;
        height: 16px
    }
}

@media screen and (max-width: 459px) {
    .reviews__rate-bar img {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .reviews__rate-bar img {
        width: 10px;
        height: 10px
    }
}

.reviews__count-bar {
    font-size: 12px;
    line-height: 14px
}

@media screen and (min-width: 1920px) {
    .reviews__count-bar {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .reviews__count-bar {
        font-size: 8px;
        line-height: 12px
    }
}

.product-bar__outline:hover {
    border: 1px solid #58c7f7
}

.product-bar__outline {
    border-radius: 12px;
    border: 1px solid #dedede;
    display: flex;
    padding: 14px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    max-height: 48px;
    min-height: 48px;
    color: #151514;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .product-bar__outline {
        padding: 20px 32px;
        border-radius: 16px;
        font-size: 20px;
        line-height: 32px;
        max-height: 72px;
        min-height: 72px
    }
}

@media screen and (max-width: 1359px) {
    .product-bar__outline {
        border-radius: 12px;
        font-size: 12px;
        line-height: 16px;
        padding: 12px 24px;
        max-height: 40px;
        min-height: 40px
    }
}

@media screen and (max-width: 1023px) {
    .product-bar__outline {
        padding: 16px;
        min-height: 46px;
        max-height: 46px
    }
}

@media screen and (max-width: 723px) {
    .product-bar__outline {
        padding: 12px 14px;
        font-size: 10px;
        line-height: 14px;
        min-height: 38px;
        max-height: 38px
    }
}

@media screen and (max-width: 459px) {
    .product-bar__outline {
        border-radius: 10px;
        padding: 8px 12px;
        font-size: 8px;
        font-weight: 600;
        line-height: 12px;
        min-height: 28px;
        max-height: 28px
    }
}

@media screen and (max-width: 1023px) {
    .reviews__icons-bar {
        display: none
    }
}

@media screen and (max-width: 1023px) {
    .button-favorite-random {
        display: none
    }
}

.product-brand {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
    width: max-content;
    padding: 16px;
    margin-bottom: 32px;
    border-radius: 12px;
    border: 1px solid #dedede;
    cursor: pointer;
    max-height: 84px
}

@media screen and (min-width: 1920px) {
    .product-brand {
        row-gap: 16px;
        border-radius: 24px;
        max-height: 122px;
        max-width: max-content;
        padding: 24px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand {
        row-gap: 8px;
        padding: 12px;
        margin-bottom: 28px
    }
}

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

@media screen and (max-width: 723px) {
    .product-brand {
        display: flex
    }
}

.product-brand__row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 8px
}

@media screen and (min-width: 1920px) {
    .product-brand__row {
        row-gap: 12px
    }
}

@media screen and (max-width: 723px) {
    .product-brand__row {
        row-gap: 4px
    }
}

.product-brand__title {
    font-family: Headline Base;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin-right: 8px
}

@media screen and (min-width: 1920px) {
    .product-brand__title {
        font-size: 24px;
        line-height: 28px;
        margin-right: 14px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__title {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

.product-brand__text {
    font-size: 12px;
    line-height: 18px
}

@media screen and (min-width: 1920px) {
    .product-brand__text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__text {
        font-size: 10px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__text {
        font-size: 12px;
        line-height: 16px
    }
}

.product-brand__logo {
    width: 24px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo {
        width: 20px;
        height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo {
        width: 24px;
        height: 24px
    }
}

.product-brand__logo.soft99 {
    width: 44px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.soft99 {
        width: 54px;
        height: 30px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo.soft99 {
        width: 40px;
        height: 22px
    }
}

.product-brand__logo.scangrip {
    width: 53px;
    height: 10px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.scangrip {
        width: 66px;
        height: 14px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo.scangrip {
        width: 49px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo.scangrip {
        width: 80px;
        height: 16px
    }
}

.product-brand__logo.sgcb {
    width: 45px;
    height: 14px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.sgcb {
        width: 54px;
        height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo.sgcb {
        width: 64px;
        height: 20px
    }
}

.product-brand__logo.maxshine {
    width: 84px;
    height: 12px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.maxshine {
        width: 108px;
        height: 15px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo.maxshine {
        width: 61px;
        height: 8px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo.maxshine {
        width: 90px;
        height: 12px
    }
}

.product-brand__logo.novaltec {
    width: 30px;
    height: 32px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.novaltec {
        width: 40px;
        height: 48px
    }
}

@media screen and (max-width: 1359px) and (min-width: 1024px) {
    .product-brand__logo.novaltec {
        width: 21px;
        height: 24px
    }
}

.product-brand__logo.gzox {
    width: 70px;
    height: 12px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.gzox {
        width: 98px;
        height: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo.gzox {
        width: 54px;
        height: 10px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo.gzox {
        width: 82px;
        height: 14px
    }
}

.product-brand__logo.chemicalpro {
    width: 73px;
    height: 25px
}

@media screen and (min-width: 1920px) {
    .product-brand__logo.chemicalpro {
        width: 96px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__logo.chemicalpro {
        width: 46px;
        height: 15px
    }
}

@media screen and (max-width: 1023px) {
    .product-brand__logo.chemicalpro {
        width: 70px;
        height: 24px
    }
}

.product-brand__btn {
    padding: 0;
    margin: 0 8px 0 0;
    background: none;
    border: none;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-brand__btn {
        margin-right: 9px
    }
}

@media screen and (max-width: 1359px) {
    .product-brand__btn {
        margin-right: 4px
    }
}

.product-brand__btn img {
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .product-brand__btn img {
        width: 24px;
        height: 24px
    }
}

.product-brand-mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    .product-brand-mobile {
        min-height: 100%;
        max-height: 100%;
        display: block;
        padding: 16px 12px
    }
}

@media screen and (max-width: 723px) {
    .product-brand-mobile {
        display: none
    }
}

@media screen and (max-width: 1359px) {
    .product-page-price-mobile {
        display: flex;
        justify-content: space-between;
        align-items: center
    }
}

.container-preorder-brand {
    display: flex;
    flex-direction: column
}

@media screen and (max-width: 1023px) {
    .container-preorder-brand {
        flex-direction: row-reverse;
        justify-content: space-between;
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .container-preorder-brand {
        flex-direction: column
    }
}

.product-brand-preorder {
    margin: 0 0 24px
}

@media screen and (max-width: 723px) {
    .product-brand-preorder {
        width: 100%;
        margin: 0
    }
}

#search-input {
    border-radius: 20px 20px 0 0
}

@media screen and (min-width: 1920px) {
    #search-input {
        padding: 20px 48px
    }
}

@media screen and (max-width: 1024px) {
    #search-input {
        padding: 8px 48px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    #search-input {
        border-radius: 0
    }
}

.faq {
    margin-bottom: 72px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .faq {
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1024px) {
    .faq {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 768px) {
    .faq {
        margin-bottom: 40px
    }
}

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

@media screen and (min-width: 1920px) {
    .faq__list {
        row-gap: 40px
    }
}

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

.faq__item {
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    max-height: 100%;
    width: 100%;
    padding: 24px 16px;
    border-radius: 24px;
    border: 1px solid #dedede;
    cursor: pointer;
    transition: all .5s ease
}

@media screen and (min-width: 1920px) {
    .faq__item {
        row-gap: 40px;
        padding: 40px;
        border-radius: 36px
    }
}

@media screen and (max-width: 1024px) {
    .faq__item {
        padding: 16px;
        border-radius: 16px;
        row-gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .faq__item {
        border-radius: 24px;
        row-gap: 8px
    }
}

.faq__item.opened {
    padding-bottom: 24px;
    max-height: 100%;
    transition: all .5s ease
}

@media screen and (min-width: 1920px) {
    .faq__item.opened {
        padding-bottom: 40px
    }
}

.faq__item.opened .faq__text {
    position: relative;
    opacity: 1;
    z-index: 1;
    transition: opacity .6s ease
}

.faq__item.opened .faq__arrow {
    transform: scale(-1);
    transition: all .2s ease
}

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

@media screen and (max-width: 768px) {
    .faq__header {
        column-gap: 8px
    }
}

.faq__header .faq__arrow {
    min-width: 16px;
    height: 9px;
    margin-right: 4px;
    transition: all .2s ease
}

@media screen and (min-width: 1920px) {
    .faq__header .faq__arrow {
        min-width: 22px;
        height: 12px
    }
}

.faq__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .faq__title {
        font-size: 28px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .faq__title {
        font-size: 16px
    }
}

.faq__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    position: absolute;
    opacity: 0;
    z-index: -3;
    transition: opacity .5s ease
}

@media screen and (min-width: 1920px) {
    .faq__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .faq__text {
        font-size: 14px;
        line-height: 20px
    }
}

.faq__text .text-editor {
    display: flex;
    flex-direction: column;
    row-gap: 8px
}

.faq__text .text-editor p {
    margin: 0
}

.product-page-instruction {
    margin-bottom: 72px
}

@media screen and (min-width: 1920px) {
    .product-page-instruction {
        margin-bottom: 88px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-instruction {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction {
        margin-bottom: 40px
    }
}

.product-page-instruction__list {
    padding-inline-start: 16px;
    padding-left: 20px
}

@media screen and (min-width: 1920px) {
    .product-page-instruction__list {
        padding-left: 32px
    }
}

.product-page-instruction__list-item {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #000;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-instruction__list-item {
        font-size: 24px;
        line-height: 38px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-instruction__list-item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction__list-item {
        margin-bottom: 16px
    }
}

.product-page-instruction--images .product-page__title {
    margin-bottom: 48px
}

@media screen and (min-width: 1920px) {
    .product-page-instruction--images .product-page__title {
        margin-bottom: 72px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-instruction--images .product-page__title {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction--images .product-page__title {
        margin-bottom: 16px
    }
}

.product-page-instruction--images .product-page-instruction__list {
    display: flex;
    flex-wrap: wrap;
    row-gap: 48px;
    column-gap: 16px;
    padding-left: 0;
    list-style-position: inside
}

@media screen and (min-width: 1920px) {
    .product-page-instruction--images .product-page-instruction__list {
        row-gap: 64px;
        column-gap: 64px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction--images .product-page-instruction__list {
        column-gap: 8px;
        row-gap: 40px
    }
}

.product-page-instruction--images .product-page-instruction__list-item {
    width: 326px;
    margin-bottom: 0;
    font-size: 13px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-instruction--images .product-page-instruction__list-item {
        width: 390px;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-instruction--images .product-page-instruction__list-item {
        width: 254px;
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction--images .product-page-instruction__list-item {
        width: 176px;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 423px) {
    .product-page-instruction--images .product-page-instruction__list-item {
        width: 144px
    }
}

.product-page-instruction--images .product-page-instruction__list-item-container img {
    width: 200px;
    height: 200px;
    margin-bottom: 16px;
    border-radius: 50%
}

@media screen and (min-width: 1920px) {
    .product-page-instruction--images .product-page-instruction__list-item-container img {
        width: 240px;
        height: 240px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-instruction--images .product-page-instruction__list-item-container img {
        width: 176px;
        height: 176px
    }
}

@media screen and (max-width: 768px) {
    .product-page-instruction--images .product-page-instruction__list-item-container img {
        width: 152px;
        height: 152px
    }
}

@media screen and (max-width: 423px) {
    .product-page-instruction--images .product-page-instruction__list-item-container img {
        width: 120px;
        height: 120px
    }
}

.product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info {
    max-width: 80%;
    min-width: 80%;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info {
        font-size: 10px;
        line-height: 12px
    }
}

@media screen and (max-width: 768px) {
    .product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info {
        max-width: 90%;
        min-width: 90%;
        font-size: 12px;
        line-height: 16px
    }
}

.product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info-title {
    width: 100%;
    margin-bottom: 0
}

.product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info-text {
    margin: 8px 0;
    color: #888
}

@media screen and (min-width: 1920px) {
    .product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info-text {
        margin: 16px 0
    }
}

.product-page-sidebar .sidebar-item.product-page-bonuses .sidebar-item__info a {
    position: relative;
    color: #58c7f7;
    text-decoration: none
}

.modal-overlay-gallery {
    padding: 0;
    overflow-y: hidden
}

.modal-overlay-gallery .gallery-modal {
    display: flex;
    flex-direction: column;
    min-width: 100vw;
    min-height: 100vh;
    max-height: 100vh;
    max-width: 100vw
}

@media screen and (max-width: 768px) {
    .modal-overlay-gallery .gallery-modal {
        min-height: 100%;
        max-height: 100%;
        height: 100%
    }
}

.modal-overlay-gallery .gallery-modal .swiper-gallery-popup {
    height: auto;
    margin: 0
}

.modal-overlay-gallery .gallery-modal .swiper-thumbs-popup .swiper-slide-thumb-active,
.modal-overlay-gallery .gallery-modal .swiper-thumbs-popup .swiper-slide-thumb-active:hover {
    border-color: #58c7f6
}

.modal-overlay-gallery .gallery-brand-popup .gallery-modal__wrapper {
    column-gap: 128px
}

.modal-overlay-gallery .gallery-brand-popup .swiper-gallery-popup .swiper-slide {
    padding-bottom: 50px
}

.modal-overlay-gallery .gallery-brand-popup .swiper-gallery-popup .swiper-slide img {
    object-fit: cover
}

.modal-overlay-gallery .gallery-brand-popup .gallery-modal__container {
    padding: 80px 200px 80px 0
}

@media screen and (max-width: 1024px) {
    .modal-overlay-gallery .gallery-brand-popup .gallery-modal__container {
        padding: 80px 100px 80px 0
    }
}

.services-application {
    padding: 40px 32px 48px;
    background: #fff;
    display: flex;
    flex-direction: column;
    height: fit-content;
    min-height: fit-content;
    overflow: visible;
    position: relative
}

.services-application__wrapper {
    display: flex;
    flex-direction: column
}

.services-application__form {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto
}

.services-application .container-checkbox {
    margin-top: 64px;
    flex-shrink: 0
}

@media screen and (min-width: 1920px) {
    .services-application .container-checkbox {
        margin-top: 32px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application .container-checkbox {
        margin-top: 16px
    }
}

@media screen and (max-width: 1024px) {
    .services-application .container-checkbox {
        margin-top: 16px
    }
}

@media screen and (max-width: 424px) {
    .services-application .container-checkbox {
        margin-top: 16px
    }
}

.services-application .btn-add-request {
    flex-shrink: 0
}

@media screen and (min-width: 1920px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 64px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 48px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 48px
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 40px
    }
}

@media screen and (max-width: 424px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 32px
    }
}

@media screen and (max-width: 360px) {
    body:has(.section-order__empty-text) .services-application .btn-add-request {
        margin-top: 32px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .services-application {
        height: auto;
        min-height: fit-content !important;
        padding-top: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px);
        padding-left: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px);
        padding-right: clamp(32px, 32px + (100vw - 1360px) * .0143, 40px);
        padding-bottom: clamp(40px, 40px + (100vw - 1360px) * .0143, 40px)
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .services-application {
        padding-top: clamp(16px, 16px + (100vw - 424px) * .0267, 32px);
        padding-left: clamp(16px, 16px + (100vw - 424px) * .0267, 32px);
        padding-right: clamp(16px, 16px + (100vw - 424px) * .0267, 32px);
        padding-bottom: clamp(24px, 24px + (100vw - 424px) * .0267, 40px)
    }
}

@media screen and (max-width: 1024px) {
    .services-application {
        padding: 32px 32px 40px
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .services-application {
        padding: clamp(16px, 16px + (100vw - 360px) * 0, 16px) clamp(16px, 16px + (100vw - 360px) * 0, 16px) clamp(24px, 24px + (100vw - 360px) * 0, 24px) clamp(16px, 16px + (100vw - 360px) * 0, 16px)
    }
}

@media screen and (max-width: 768px) {
    .services-application {
        padding: 24px 16px 32px
    }
}

@media screen and (max-width: 424px) {
    .services-application {
        padding: 16px 16px 24px
    }
}

@media screen and (max-width: 360px) {
    .services-application {
        padding: 16px 16px 24px
    }
}

@media screen and (min-width: 1920px) {
    .services-application {
        padding: 40px
    }
}

.services-application__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 40px;
    line-height: 48px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .services-application__title {
        font-size: 40px !important;
        line-height: 48px !important;
        padding-bottom: 64px !important
    }
}

@media screen and (max-width: 1360px) {
    .services-application__title {
        font-size: 28px !important;
        line-height: 36px !important;
        padding-bottom: 48px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .services-application__title {
        font-size: clamp(28px, 24px + (100vw - 1360px) * .2857, 40px);
        line-height: clamp(36px, 28px + (100vw - 1360px) * .3571, 48px);
        padding-bottom: 64px
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .services-application__title {
        font-size: 24px !important;
        line-height: 32px !important;
        padding-bottom: 40px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 425px) {
    .services-application__title {
        font-size: clamp(18px, 18px + (100vw - 424px) * .01, 24px);
        line-height: clamp(20px, 20px + (100vw - 424px) * .0133, 28px)
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .services-application__title {
        font-size: 18px !important;
        line-height: 20px !important;
        padding-bottom: 32px !important
    }
}

@media screen and (max-width: 360px) {
    .services-application__title {
        font-size: 18px !important;
        line-height: 20px !important;
        padding-bottom: 32px !important
    }
}

@media screen and (max-width: 768px) {
    .services-application__title {
        font-size: 18px !important;
        line-height: 20px !important
    }
}

.services-application__subtitle {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .services-application__subtitle {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .services-application__subtitle {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 16px
    }
}

.services-application__form {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 48px;
    margin-bottom: 0;
    padding-bottom: 0
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application__form {
        margin-top: 32px;
        margin-bottom: 0
    }
}

@media screen and (max-width: 1024px) {
    .services-application__form {
        margin-top: 32px;
        margin-bottom: 0
    }
}

@media screen and (max-width: 1024px) and (min-width: 1024px) {
    .services-application__form {
        margin-top: 0;
        margin-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .services-application__form {
        margin-top: 34px;
        margin-bottom: 0
    }
}

@media screen and (max-width: 424px) {
    .services-application__form {
        margin-top: 0 !important;
        margin-bottom: 32px !important
    }
}

@media screen and (min-width: 1920px) {
    .services-application__form {
        margin-top: 48px;
        margin-bottom: 0;
        padding-bottom: 0
    }
}

.services-application__row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
    -webkit-gap: 24px
}

@media screen and (max-width: 1024px) {
    .services-application__row {
        column-gap: 24px;
        row-gap: 16px;
        -webkit-column-gap: 32px;
        -webkit-row-gap: 16px
    }
}

@media screen and (max-width: 980px) {
    .services-application__row {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        -webkit-gap: 16px
    }
}

@media screen and (max-width: 680px) {
    .services-application__row {
        grid-template-columns: 1fr;
        gap: 32px;
        -webkit-gap: 32px
    }
}

.services-application .text-field__container {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 56px;
    max-height: 56px
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-application .text-field__container {
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (min-width: 1920px) {
    .services-application .text-field__container {
        min-height: 80px;
        max-height: 80px
    }
}

@media screen and (max-width: 768px) {
    .services-application .text-field__container {
        min-height: 52px;
        max-height: 52px
    }
}

.services-application .text-field__container .text-field__input {
    height: max-content;
    padding: 8px 0;
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (max-width: 1920px) {
    .services-application .text-field__container .text-field__input {
        padding: 16px 0;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-application .text-field__container .text-field__input {
        padding: 16px 0;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1360px) {
    .services-application .text-field__container .text-field__input {
        padding: 12px 0;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .services-application .text-field__container .text-field__input {
        padding: 12px 0;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-application .text-field__container .text-field__input {
        padding: 12px 0;
        font-size: 14px;
        line-height: 20px
    }
}

.services-application .text-field__label.text-field__label-repair {
    padding: 0;
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 20px !important;
    line-height: 28px !important;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (min-width: 1920px) {
    .services-application .text-field__label.text-field__label-repair {
        font-size: 20px !important;
        line-height: 28px !important;
        top: -16px !important
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application .text-field__label.text-field__label-repair {
        font-size: 14px !important;
        line-height: 20px !important;
        top: -10px !important
    }
}

@media screen and (width: 1360px) {
    .services-application .text-field__label.text-field__label-repair {
        top: -10px !important
    }
}

@media screen and (max-width: 1024px) {
    .services-application .text-field__label.text-field__label-repair {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 424px) {
    .services-application .text-field__label.text-field__label-repair {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.services-application .textarea-wrapper {
    padding: 8px 0;
    border-bottom: 1px solid #dedede
}

@media screen and (width: 1360px) {
    .services-application .textarea-wrapper {
        padding-bottom: 12px
    }
}

@media screen and (min-width: 1920px) {
    .services-application .textarea-wrapper {
        padding: 12px 0
    }
}

.services-application .textarea-wrapper .textarea-input {
    min-height: 24px;
    max-height: 24px;
    padding: 0;
    border: none
}

@media screen and (min-width: 1920px) {
    .services-application .textarea-wrapper .textarea-input {
        min-height: 32px;
        max-height: 32px
    }
}

@media screen and (max-width: 768px) {
    .services-application .textarea-wrapper .textarea-input {
        min-height: 20px;
        max-height: 20px
    }
}

.services-application__textarea {
    width: 100%;
    max-width: 100%;
    margin-top: 24px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: block;
    min-width: 0
}

@media screen and (min-width: 1920px) {
    .services-application__textarea {
        margin-top: 32px
    }
}

@media screen and (max-width: 1024px) {
    .services-application__textarea {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 768px) {
    .services-application__textarea {
        margin-top: 16px
    }
}

.services-application__textarea .text-field__label.text-field__textarea {
    padding: 0;
    margin: 0;
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 20px !important;
    line-height: 28px !important;
    letter-spacing: 0;
    vertical-align: middle
}

@media screen and (min-width: 1920px) {
    .services-application__textarea .text-field__label.text-field__textarea {
        font-size: 20px !important;
        line-height: 28px !important
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application__textarea .text-field__label.text-field__textarea {
        font-size: 14px !important;
        line-height: 20px !important;
        top: -10px !important
    }
}

@media screen and (width: 1360px) {
    .services-application__textarea .text-field__label.text-field__textarea {
        top: -10px !important
    }
}

@media screen and (max-width: 1360px) {
    .services-application__textarea .text-field__label.text-field__textarea {
        font-size: 14px !important;
        line-height: 20px !important
    }
}

@media screen and (max-width: 424px) {
    .services-application__textarea .text-field__label.text-field__textarea {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

.services-application__textarea .text-field__input {
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    resize: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: block;
    height: auto;
    min-height: 24px;
    max-height: none;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .services-application__textarea .text-field__input {
        min-height: 32px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .services-application__textarea .text-field__input {
        min-height: 20px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-application__textarea .text-field__input {
        min-height: 20px !important;
        max-height: none !important
    }
}

.services-application__textarea .text-field__container {
    padding-top: 16px;
    padding-bottom: 0;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: block;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important
}

@media screen and (min-width: 1920px) {
    .services-application__textarea .text-field__container {
        padding-top: 24px
    }
}

.services-application .select-field__list-item {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    padding: 8px
}

@media screen and (min-width: 1920px) {
    .services-application .select-field__list-item {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .services-application .select-field__list-item {
        font-size: 12px;
        line-height: 16px;
        padding: 4px 8px
    }
}

@media screen and (max-width: 768px) {
    .services-application .select-field__list-item {
        font-size: 16px;
        line-height: 24px
    }
}

.services-application .checkbox-container {
    font-size: 16px;
    line-height: 24px;
    margin-top: 24px;
    padding-left: 28px
}

@media screen and (min-width: 1920px) {
    .services-application .checkbox-container {
        font-size: 24px;
        margin-top: 32px;
        padding-left: 44px
    }
}

@media screen and (max-width: 768px) {
    .services-application .checkbox-container {
        font-size: 14px;
        line-height: 20px;
        margin-top: 16px
    }
}

.services-application .checkbox-container .checkbox-icon {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .services-application .checkbox-container .checkbox-icon {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-application .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (width: 1360px) {
    .services-application .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (width: 1024px) {
    .services-application .checkbox-container .checkbox-icon {
        width: 20px !important;
        height: 20px !important
    }
}

@media screen and (max-width: 768px) {
    .services-application .checkbox-container .checkbox-icon {
        top: 0
    }
}

.services-application .button {
    width: max-content;
    margin: 0 auto;
    padding: 12px 120px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .services-application .button {
        padding: 20px 190px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 768px) {
    .services-application .button {
        padding: 8px 64px;
        font-size: 14px;
        line-height: 20px
    }
}

.services-application .button:hover {
    margin: -2px auto;
    padding: 14px 122px
}

@media screen and (min-width: 1920px) {
    .services-application .button:hover {
        padding: 24px 192px;
        margin: -4px auto
    }
}

@media screen and (max-width: 1024px) {
    .services-application .button:hover {
        margin: 0 auto;
        padding: 12px 120px
    }
}

@media screen and (max-width: 768px) {
    .services-application .button:hover {
        padding: 8px 64px
    }
}

.text-editor {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .text-editor {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .text-editor {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .text-editor {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .text-editor {
        width: 100%
    }
}

.text-editor table {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    position: relative;
    display: block;
    margin: 16px 0 32px
}

@media screen and (min-width: 1920px) {
    .text-editor table {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .text-editor table {
        font-size: 10px;
        line-height: 12px;
        margin: 16px 0 24px
    }
}

@media screen and (max-width: 768px) {
    .text-editor table {
        font-size: 12px;
        line-height: 16px;
        margin: 8px 0;
        overflow-x: scroll
    }
}

.text-editor table.table-two-column tbody {
    width: 100%
}

.text-editor table.table-two-column tr {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .text-editor table.table-two-column tr {
        column-gap: 64px
    }
}

@media screen and (max-width: 768px) {
    .text-editor table.table-two-column tr {
        column-gap: 8px
    }
}

.text-editor table.table-four-column tbody {
    width: 100%
}

@media screen and (max-width: 768px) {
    .text-editor table.table-four-column tbody {
        width: max-content
    }
}

.text-editor table.table-four-column tr {
    grid-template-columns: repeat(4, 1fr);
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .text-editor table.table-four-column tr {
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .text-editor table.table-four-column tr {
        column-gap: 8px
    }
}

.text-editor thead {
    display: block
}

.text-editor tbody {
    display: block;
    padding-top: 16px;
    border-top: 1px solid #dedede
}

@media screen and (max-width: 1024px) {
    .text-editor tbody {
        padding-top: 8px
    }
}

@media screen and (max-width: 768px) {
    .text-editor tbody {
        width: max-content
    }
}

.text-editor tr {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 24px;
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .text-editor tr {
        column-gap: 44px
    }
}

@media screen and (max-width: 1024px) {
    .text-editor tr {
        column-gap: 16px;
        margin-bottom: 8px
    }
}

@media screen and (max-width: 768px) {
    .text-editor tr {
        column-gap: 8px
    }
}

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

    .text-editor td,
    .text-editor th {
        width: 152px
    }
}

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

    .text-editor td,
    .text-editor th {
        width: 128px
    }
}

.text-editor th {
    display: block;
    text-align: left;
    font-weight: 400
}

.text-editor table.table--header tbody {
    border: none;
    padding: 0
}

.text-editor table.table--header tr:first-child {
    padding-bottom: 16px;
    border-bottom: 1px solid #dedede
}

.text-editor h1,
.text-editor h2,
.text-editor h3 {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 12px;
    display: flex;
    align-items: center
}

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

    .text-editor h1,
    .text-editor h2,
    .text-editor h3 {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 20px
    }
}

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

    .text-editor h1,
    .text-editor h2,
    .text-editor h3 {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 12px
    }
}

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

    .text-editor h1,
    .text-editor h2,
    .text-editor h3 {
        font-size: 18px;
        line-height: 24px
    }
}

.text-editor h4 {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .text-editor h4 {
        font-size: 22px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1024px) {
    .text-editor h4 {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 4px
    }
}

@media screen and (max-width: 768px) {
    .text-editor h4 {
        font-size: 16px;
        line-height: 24px
    }
}

.text-editor h1 {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .text-editor h1 {
        margin-bottom: 28px
    }
}

@media screen and (max-width: 1359px) {
    .text-editor h1 {
        margin-bottom: 14px
    }
}

.text-editor p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 16px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .text-editor p {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .text-editor p {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .text-editor p {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 8px
    }
}

.text-editor ul,
.text-editor ol {
    margin-bottom: 24px
}

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

    .text-editor ul,
    .text-editor ol {
        margin-bottom: 20px !important
    }
}

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

    .text-editor ul,
    .text-editor ol {
        margin-bottom: 16px
    }
}

.text-editor li {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-left: 20px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .text-editor li {
        font-size: 22px;
        line-height: 32px;
        margin-bottom: 16px;
        margin-left: 25px
    }
}

@media screen and (max-width: 1024px) {
    .text-editor li {
        font-size: 12px;
        line-height: 16px;
        margin-left: 15px
    }
}

@media screen and (max-width: 768px) {
    .text-editor li {
        font-size: 16px;
        line-height: 24px;
        margin-left: 20px
    }
}

.text-editor a {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #58c7f7;
    text-decoration: none
}

@media screen and (min-width: 1920px) {
    .text-editor a {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .text-editor a {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .text-editor a {
        font-size: 16px;
        line-height: 24px
    }
}

.text-editor .note--black {
    border-radius: 10px;
    padding: 16px;
    color: #151514;
    border: 1px solid #dedede;
    margin-bottom: 32px
}

@media screen and (max-width: 1024px) {
    .text-editor .note--black {
        padding: 8px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .text-editor .note--black {
        padding: 16px;
        margin-bottom: 16px;
        font-size: 15px
    }
}

.text-editor .note--gray {
    border-radius: 10px;
    padding: 16px;
    color: #151514;
    background: #f0f6fb;
    margin-bottom: 32px
}

@media screen and (max-width: 1024px) {
    .text-editor .note--gray {
        padding: 8px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .text-editor .note--gray {
        padding: 16px;
        margin-bottom: 16px;
        font-size: 15px
    }
}

.text-editor .note--red {
    border-radius: 10px;
    padding: 16px;
    color: #eb606c;
    border: 1px solid #dedede;
    margin-bottom: 32px
}

@media screen and (max-width: 1024px) {
    .text-editor .note--red {
        padding: 8px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .text-editor .note--red {
        padding: 16px;
        margin-bottom: 16px;
        font-size: 15px
    }
}

#editor-main.text-editor h1 {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    #editor-main.text-editor h1 {
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    #editor-main.text-editor h1 {
        font-size: 20px;
        line-height: 16px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 768px) {
    #editor-main.text-editor h1 {
        font-size: 22px;
        line-height: 24px
    }
}

#editor-main.text-editor h2 {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    #editor-main.text-editor h2 {
        font-size: 22px;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 1024px) {
    #editor-main.text-editor h2 {
        font-size: 12px;
        line-height: 18px
    }
}

@media screen and (max-width: 768px) {
    #editor-main.text-editor h2 {
        font-size: 16px;
        line-height: 24px
    }
}

#editor-main.text-editor p {
    margin-bottom: 8px
}

.text-block__item-extra {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 24px;
    margin-top: 16px
}

.m-0 {
    margin-bottom: 0 !important
}

.m-span {
    display: flex;
    margin-bottom: 24px !important
}

/* .basket-aside-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: sticky;
    top: 0;
    height: max-content
}

@media screen and (min-width: 1920px) {
    .basket-aside-container {
        min-width: 398px;
        max-width: 398px
    }
}

@media screen and (max-width: 1023px) {
    .basket-aside-container {
        min-width: 100%;
        max-width: 100%;
        flex-direction: column-reverse
    }
}

.basket-aside {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 28px 24px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .basket-aside {
        padding: 40px 32px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1023px) {
    .basket-aside {
        min-width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 723px) {
    .basket-aside {
        margin-bottom: 0
    }
}

.basket-aside__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .basket-aside__total {
        margin-bottom: 40px
    }
}

.basket-aside__text {
    color: #494949;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px
}

@media screen and (min-width: 1920px) {
    .basket-aside__text {
        font-size: 28px;
        line-height: 38px
    }
}

.basket-aside__price {
    font-size: 24px;
    font-weight: 700;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .basket-aside__price {
        font-size: 32px;
        line-height: 32px
    }
}

.basket-aside__btn--full.button--primary.button--filled.button--full {
    padding: 18px 0;
    border-radius: 16px;
    margin-bottom: 16px;
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .basket-aside__btn--full.button--primary.button--filled.button--full {
        font-size: 24px;
        line-height: 38px;
        padding: 24px;
        margin-bottom: 22px;
        border-radius: 24px
    }
}

.basket-aside__btn--outside {
    padding: 18px 0;
    border-radius: 16px;
    border: 1px solid #dedede;
    color: #151514;
    font-size: 16px;
    max-height: 60px
}

@media screen and (min-width: 1920px) {
    .basket-aside__btn--outside {
        font-size: 24px;
        line-height: 38px;
        padding: 24px;
        max-height: 86px;
        border: 2px solid #dedede
    }
}

.basket-aside__btn--outside:hover {
    border: 1px solid #58c7f6
}

@media screen and (min-width: 1920px) {
    .basket-aside__btn--outside:hover {
        border: 2px solid #58c7f6
    }
}

.basket-aside__title {
    color: #888;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    padding-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .basket-aside__title {
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 723px) {
    .basket-aside__title {
        padding-bottom: 24px
    }
}

@media screen and (max-width: 1023px) {
    .basket-aside__buttons {
        display: flex;
        align-items: center;
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .basket-aside__buttons {
        flex-direction: column
    }
}

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

    .basket-aside__btn--full,
    .basket-aside__btn--outside {
        border-radius: 24px
    }
}

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

    .basket-aside__btn--full,
    .basket-aside__btn--outside {
        margin-bottom: 0 !important;
        font-size: 16px !important;
        line-height: 24px !important
    }
}

.basket-aside .basket-added__title {
    font-size: 16px;
    line-height: 24px
}

.basket-aside .swiper-scrollbar {
    position: relative;
    width: 100%;
    height: 1px;
    margin: 0;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .basket-aside .swiper-scrollbar {
        height: 2px
    }
}

.basket-aside .swiper-scrollbar-drag {
    position: relative;
    height: 100%;
    width: 100%;
    background: #888
}

.basket-aside .swiper-wrapper {
    margin-top: 16px
}

.basket-aside .swiper-left,
.basket-aside .swiper-right {
    width: 24px;
    height: 24px;
    cursor: pointer
}

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

    .basket-aside .swiper-left,
    .basket-aside .swiper-right {
        width: 38px;
        height: 38px
    }
}

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

    .basket-aside .swiper-left,
    .basket-aside .swiper-right {
        width: 20px;
        height: 20px
    }
}

.basket-aside .swiper-left.swiper-button-disabled,
.basket-aside .swiper-right.swiper-button-disabled {
    cursor: auto
}

.basket-aside .swiper-left.swiper-button-disabled path,
.basket-aside .swiper-right.swiper-button-disabled path {
    fill: #dedede
}

@media screen and (max-width: 1023px) {
    .basket-added-block {
        display: flex;
        gap: 12px
    }
}

@media screen and (max-width: 723px) {
    .basket-added-block {
        flex-direction: column
    }
}

@media screen and (max-width: 723px) {
    .basket-added__title-wrapper {
        margin-bottom: 16px
    }
} */

.bonus-modal {
    position: relative;
    min-width: 600px;
    max-width: 600px;
    padding: 24px 24px 32px;
    background: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 32px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .bonus-modal {
        min-width: 850px;
        max-width: 850px;
        padding: 40px 48px 56px
    }
}

@media screen and (max-width: 1024px) {
    .bonus-modal {
        min-width: 500px;
        max-width: 500px;
        padding-bottom: 28px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal {
        min-width: 350px;
        max-width: 350px
    }
}

@media screen and (max-width: 423px) {
    .bonus-modal {
        min-width: 300px;
        max-width: 300px;
        border-radius: 24px
    }
}

.bonus-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

@media screen and (max-width: 1024px) {
    .bonus-modal__header {
        margin-bottom: 16px
    }
}

.bonus-modal__title {
    font-family: Headline Base;
    font-size: 24px;
    line-height: 32px;
    font-weight: 500
}

@media screen and (min-width: 1920px) {
    .bonus-modal__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal__title {
        font-size: 20px;
        line-height: 24px
    }
}

.bonus-modal__subtitle {
    font-family: Headline Base;
    font-size: 20px;
    line-height: 18px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .bonus-modal__subtitle {
        font-size: 32px;
        line-height: 40px;
        margin-top: 56px
    }
}

@media screen and (max-width: 1024px) {
    .bonus-modal__subtitle {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal__subtitle {
        font-size: 18px;
        line-height: 24px;
        margin-top: 32px
    }
}

.bonus-modal__info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 16px;
    column-gap: 48px
}

@media screen and (min-width: 1920px) {
    .bonus-modal__info {
        column-gap: 80px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal__info {
        grid-template-columns: 1fr
    }
}

.bonus-modal__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 200px
}

@media screen and (min-width: 1920px) {
    .bonus-modal__row {
        width: 286px
    }
}

@media screen and (max-width: 1024px) {
    .bonus-modal__row {
        width: 180px
    }
}

.bonus-modal__text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .bonus-modal__text {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    .bonus-modal__text {
        font-size: 14px;
        line-height: 20px
    }
}

.bonus-modal__text--green {
    font-weight: 600;
    color: #4dcc8c
}

.bonus-modal__text--red {
    font-weight: 600;
    color: #eb606c
}

.bonus-modal .button {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #fff;
    background: #58c7f7;
    border: none;
    height: 60px;
    margin-top: 40px;
    border-radius: 12px
}

.bonus-modal .button:hover {
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    .bonus-modal .button {
        height: 86px;
        margin-top: 56px;
        font-size: 24px;
        line-height: 38px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1024px) {
    .bonus-modal .button {
        height: 52px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal .button {
        margin-top: 32px
    }
}

.bonus-modal .close-button {
    position: relative;
    top: initial;
    right: initial;
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .bonus-modal .close-button {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 768px) {
    .bonus-modal .close-button {
        width: 18px;
        height: 18px
    }
}

@media screen and (max-width: 423px) {
    .bonus-modal .close-button {
        width: 16px;
        height: 16px
    }
}

.swiper-container {
    display: flex;
    align-items: flex-start;
    gap: 16px
}

@media screen and (max-width: 1359px) {
    .swiper-container {
        gap: 8px
    }
}

@media screen and (max-width: 1023px) {
    .swiper-container {
        flex-direction: column-reverse;
        gap: unset
    }
}

.gallery-controls {
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    gap: 14px;
    align-items: center;
    z-index: 90 !important
}

@media screen and (max-width: 1359px) {
    .gallery-controls {
        bottom: 12px
    }
}

@media screen and (max-width: 1023px) {
    .gallery-controls {
        bottom: 15%
    }
}

@media screen and (max-width: 723px) {
    .gallery-controls {
        bottom: 22%
    }
}

.product-page-gallery {
    position: relative;
    width: 100%
}

@media screen and (max-width: 1359px) {
    .product-page-gallery {
        cursor: pointer
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery {
        width: 100%;
        overflow-x: hidden
    }
}

.product-page-gallery__row {
    display: flex;
    align-items: center;
    column-gap: 40px
}

@media screen and (max-width: 1359px) {
    .product-page-gallery__row {
        column-gap: 20px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery__row {
        margin-top: 32px;
        width: 100%
    }
}

@media screen and (max-width: 723px) {
    .product-page-gallery__row {
        margin-top: 24px
    }
}

.product-page-gallery__row .swiper-wrapper {
    width: 100%
}

@media screen and (max-width: 1023px) {
    .product-page-gallery__row .swiper-wrapper {
        width: 100%;
        z-index: 90
    }
}

.product-page-gallery .swiper-gallery {
    overflow: hidden
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-gallery {
        width: 100%;
        overflow: unset
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-gallery {
        height: 457px
    }
}

@media screen and (max-width: 723px) {
    .product-page-gallery .swiper-gallery {
        height: 325px
    }
}

.product-page-gallery .swiper-gallery__zoom {
    width: 16px;
    height: 16px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-gallery__zoom {
        bottom: 32px;
        right: 32px;
        width: 24px;
        height: 24px
    }
}

.product-page-gallery .swiper-gallery .swiper-wrapper {
    max-height: 617px;
    min-height: 617px;
    min-width: 719px;
    max-width: 100%;
    align-items: center
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-gallery .swiper-wrapper {
        min-height: 900px;
        max-width: 100%
    }
}

@media screen and (min-width: 1686px) and (max-width: 1919px) {
    .product-page-gallery .swiper-gallery .swiper-wrapper {
        max-height: 626px;
        max-width: 100%
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-gallery .swiper-wrapper {
        max-height: 483px;
        min-height: 483px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-gallery .swiper-wrapper {
        width: 100% !important;
        max-height: 483px;
        min-height: 483px
    }
}

@media screen and (max-width: 723px) {
    .product-page-gallery .swiper-gallery .swiper-wrapper {
        max-height: 325px;
        min-height: 325px
    }
}

.product-page-gallery .swiper-gallery .swiper-slide {
    transform: scale(1);
    transition: transform .5s ease
}

.product-page-gallery .swiper-gallery .swiper-slide:hover {
    transform: scale(1.1);
    transition: transform .5s ease
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-gallery .swiper-slide:hover {
        transform: none
    }
}

.product-page-gallery .swiper-gallery .swiper-slide img[data-el=inactive] {
    opacity: .5
}

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

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-gallery .swiper-slide img {
        height: 100%;
        width: 100%;
        min-width: 988px
    }
}

@media screen and (min-width: 1686px) and (max-width: 1919px) {
    .product-page-gallery .swiper-gallery .swiper-slide img {
        height: 100%;
        width: 100%;
        min-width: 729px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-gallery .swiper-slide img {
        width: 100%;
        height: 457px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-gallery .swiper-slide img {
        height: 483px
    }
}

@media screen and (max-width: 723px) {
    .product-page-gallery .swiper-gallery .swiper-slide img {
        height: 325px
    }
}

.product-page-gallery .swiper-thumbs {
    position: relative;
    overflow: hidden;
    margin: 0;
    cursor: auto;
    height: 617px
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-thumbs {
        height: 850px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-thumbs {
        height: 457px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-thumbs {
        height: 56px
    }
}

.product-page-gallery .swiper-thumbs__btn {
    width: 48px;
    height: 48px;
    position: absolute;
    bottom: 0;
    z-index: 5;
    cursor: pointer;
    background: linear-gradient(180deg, #fff0, #fff);
    width: 100%;
    display: flex
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-thumbs__btn {
        width: 110px;
        height: 50px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-thumbs__btn {
        height: 38px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-thumbs__btn {
        height: 70px;
        width: 10%;
        right: 0;
        background: linear-gradient(90deg, #fff0, #fff);
        z-index: 90
    }
}

@media screen and (max-width: 723px) {
    .product-page-gallery .swiper-thumbs__btn {
        height: 70px;
        width: 9%;
        right: 0;
        background: linear-gradient(90deg, #fff0, #fff);
        z-index: 90
    }
}

.product-page-gallery .swiper-thumbs__btn--prew {
    background: linear-gradient(180deg, #fff0, #fff);
    width: 100%
}

.product-page-gallery .swiper-thumbs .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 87px;
    max-width: 87px;
    min-height: 69px;
    max-height: 69px;
    border-radius: 12px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: border-color .25s ease
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-thumbs .swiper-slide {
        min-width: 110px;
        max-width: 110px;
        min-height: 90px;
        max-height: 90px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-thumbs .swiper-slide {
        min-width: 56px;
        max-width: 56px;
        border-radius: 8px;
        min-height: 45px;
        max-height: 45px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-thumbs .swiper-slide {
        min-width: 70px;
        max-width: 70px;
        min-height: 56px;
        max-height: 56px
    }
}

.product-page-gallery .swiper-thumbs .swiper-slide:hover {
    border-color: #dedede
}

.product-page-gallery .swiper-thumbs .swiper-slide img {
    width: 86px;
    height: 68px;
    border-radius: 12px
}

@media screen and (min-width: 1920px) {
    .product-page-gallery .swiper-thumbs .swiper-slide img {
        width: 108px;
        height: 88px;
        border-radius: 15px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-gallery .swiper-thumbs .swiper-slide img {
        width: 54px;
        height: 44px;
        border-radius: 7px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-gallery .swiper-thumbs .swiper-slide img {
        min-width: 68px;
        max-width: 68px;
        min-height: 54px;
        max-height: 54px
    }
}

.product-page-gallery .swiper-thumbs .swiper-slide-thumb-active,
.product-page-gallery .swiper-thumbs .swiper-slide-thumb-active:hover {
    border-color: #58c7f6
}

.product-page-gallery__row-mobile {
    display: none
}

@media screen and (max-width: 723px) {
    .product-page-sidebar-discount {
        margin-top: 58px
    }
}

.product-preorder {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    margin-bottom: 32px;
    border-radius: 12px;
    border: 1px solid #dedede;
    max-width: 339px
}

@media screen and (min-width: 1920px) {
    .product-preorder {
        padding: 24px;
        margin-bottom: 32px;
        border-radius: 16px;
        max-width: 464px
    }
}

@media screen and (max-width: 1359px) {
    .product-preorder {
        padding: 16px;
        margin-bottom: 32px;
        border-radius: 16px;
        max-width: 290px
    }
}

@media screen and (max-width: 1023px) {
    .product-preorder {
        padding: 16px 18px;
        margin-bottom: 32px;
        border-radius: 16px;
        width: 100%;
        max-height: 82px;
        min-height: 82px;
        max-width: 326px
    }
}

@media screen and (max-width: 723px) {
    .product-preorder {
        min-width: 100%;
        padding: 16px;
        max-height: 52px;
        min-height: 52px
    }
}

.product-preorder__row {
    display: flex;
    align-items: center;
    column-gap: 9px
}

@media screen and (min-width: 1920px) {
    .product-preorder__row {
        column-gap: 17px
    }
}

.product-preorder__row img {
    width: 24px;
    height: 24px
}

@media screen and (min-width: 1920px) {
    .product-preorder__row img {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-preorder__row img {
        width: 20px;
        height: 20px
    }
}

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

@media screen and (max-width: 723px) {
    .product-preorder__row img {
        width: 20px;
        height: 20px
    }
}

.product-preorder__text {
    font-size: 12px;
    font-weight: 400;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .product-preorder__text {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-preorder__text {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-preorder__text {
        font-size: 12px;
        line-height: 16px
    }
}

.product-preorder__date {
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #4dcc8c
}

@media screen and (min-width: 1920px) {
    .product-preorder__date {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (max-width: 1359px) {
    .product-preorder__date {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-preorder__date {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-preorder__date {
        font-size: 12px;
        line-height: 16px
    }
}

.modal-distributor {
    min-width: 800px;
    max-width: 800px;
    padding: 24px 24px 32px;
    position: relative;
    border-radius: 32px;
    box-shadow: 0 0 40px #0000001a;
    background-color: #fff
}

@media screen and (min-width: 1920px) {
    .modal-distributor {
        min-width: 1276px;
        max-width: 1276px;
        padding: 48px 40px 56px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor {
        min-width: 400px;
        max-width: 400px;
        padding-bottom: 28px
    }
}

@media screen and (max-width: 423px) {
    .modal-distributor {
        min-width: 350px;
        max-width: 350px;
        padding-inline: 20px
    }
}

.modal-distributor .modal-header {
    align-items: flex-start;
    margin-bottom: 40px
}

@media screen and (min-width: 1920px) {
    .modal-distributor .modal-header {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 1024px) {
    .modal-distributor .modal-header {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor .modal-header {
        column-gap: 24px
    }
}

.modal-distributor__title {
    font-family: Headline Base;
    font-size: 24px;
    line-height: 32px;
    font-weight: 500
}

@media screen and (min-width: 1920px) {
    .modal-distributor__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor__title {
        font-size: 20px;
        line-height: 24px
    }
}

.modal-distributor__list {
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    padding-left: 24px
}

@media screen and (min-width: 1920px) {
    .modal-distributor__list {
        row-gap: 24px;
        padding-left: 32px
    }
}

@media screen and (max-width: 1024px) {
    .modal-distributor__list {
        padding-left: 20px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor__list {
        margin-bottom: 32px
    }
}

.modal-distributor__text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .modal-distributor__text {
        font-size: 24px;
        line-height: 38px;
        padding-left: 6px
    }
}

@media screen and (max-width: 1024px) {
    .modal-distributor__text {
        font-size: 14px;
        line-height: 20px
    }
}

.modal-distributor__icon {
    position: absolute;
    bottom: 32px;
    right: 24px
}

@media screen and (min-width: 1920px) {
    .modal-distributor__icon {
        bottom: 40px;
        right: 56px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor__icon {
        position: relative;
        bottom: 0;
        right: 0;
        display: block;
        margin-left: auto
    }
}

.modal-distributor .close-button {
    position: relative;
    top: initial;
    right: initial;
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .modal-distributor .close-button {
        width: 28px;
        height: 28px
    }
}

@media screen and (max-width: 423px) {
    .modal-distributor .close-button {
        width: 16px;
        height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.rupes .modal-distributor__icon {
        width: 100px;
        height: 100px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.rupes .modal-distributor__icon {
        width: 40px;
        height: 40px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.soft99 .modal-distributor__icon {
        width: 128px;
        height: 70px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.soft99 .modal-distributor__icon {
        width: 73px;
        height: 40px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.scangrip .modal-distributor__icon {
        width: 226px;
        height: 50px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.scangrip .modal-distributor__icon {
        width: 126px;
        height: 28px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.sgcb .modal-distributor__icon {
        width: 190px;
        height: 60px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.sgcb .modal-distributor__icon {
        width: 90px;
        height: 28px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.maxshine .modal-distributor__icon {
        width: 260px;
        height: 35px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.maxshine .modal-distributor__icon {
        width: 188px;
        height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.workstuff .modal-distributor__icon {
        width: 100px;
        height: 100px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.novaltec .modal-distributor__icon {
        width: 136px;
        height: 150px
    }
}

@media screen and (max-width: 768px) {
    .modal-distributor.novaltec .modal-distributor__icon {
        width: 50px;
        height: 56px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.gzox .modal-distributor__icon {
        width: 260px;
        height: 40px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.chemicalpro .modal-distributor__icon {
        width: 233px;
        height: 80px
    }
}

@media screen and (min-width: 1920px) {
    .modal-distributor.triens .modal-distributor__icon {
        width: 216px;
        height: 60px
    }
}

.popular-categories-modal {
    width: 862px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 24px 24px 32px;
    gap: 32px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal {
        width: 1300px;
        padding: 40px;
        gap: 48px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    .popular-categories-modal {
        width: 865px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1023px) {
    .popular-categories-modal {
        width: 500px;
        padding: 24px;
        gap: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal {
        width: 300px;
        padding: 16px;
        gap: 18px
    }
}

.popular-categories-modal__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: flex-start;
    gap: 12px
}

@media screen and (max-width: 1023px) {
    .popular-categories-modal__header {
        gap: 14px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__header {
        gap: 4px
    }
}

.popular-categories-modal__header svg {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__header svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__header svg {
        width: 14px;
        height: 14px
    }
}

.popular-categories-modal__header-close {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center
}

@media screen and (max-width: 1359px) {
    .popular-categories-modal__title {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__title {
        font-size: 15px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__text {
        font-size: 10px;
        line-height: 14px
    }
}

.popular-categories-modal__list {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__list {
        gap: 32px
    }
}

@media screen and (max-width: 1359px) {
    .popular-categories-modal__list {
        gap: 20px
    }
}

@media screen and (max-width: 1023px) {
    .popular-categories-modal__list {
        gap: 16px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__list {
        gap: 12px
    }
}

.popular-categories-modal__list-item {
    display: flex;
    padding: 18px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    border: 1px solid #dedede;
    color: #151514;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    cursor: pointer;
    max-height: 56px
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__list-item {
        display: flex;
        padding: 24px 32px;
        border-radius: 18px;
        font-size: 20px;
        line-height: 28px;
        max-height: 76px
    }
}

@media screen and (max-width: 1359px) {
    .popular-categories-modal__list-item {
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .popular-categories-modal__list-item {
        padding: 14px 16px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__list-item {
        padding: 12px;
        border-radius: 10px;
        font-size: 10px;
        line-height: 14px
    }
}

.popular-categories-modal__list-item:hover {
    border: 1px solid #58c7f7
}

.popular-categories-modal__button {
    all: unset;
    display: flex;
    width: 200px;
    padding: 18px 0;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    background: #58c7f6;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__button {
        width: 350px;
        padding: 30px 0;
        border-radius: 18px;
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .popular-categories-modal__button {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1023px) {
    .popular-categories-modal__button {
        width: 150px;
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    .popular-categories-modal__button {
        width: 120px;
        padding: 14px 0;
        font-size: 12px;
        line-height: 14px;
        border-radius: 10px
    }
}

.popular-categories-modal__button:hover {
    background-color: #6cd3ff
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__button:hover {
        border: 2px solid #58c7f7
    }
}

.popular-categories-modal__list-item--active {
    border: 1px solid #58c7f7;
    color: #58c7f7
}

@media screen and (min-width: 1920px) {
    .popular-categories-modal__list-item--active {
        border: 2px solid #58c7f7
    }
}

@media screen and (max-width: 1023px) {
    .container {
        width: 100%;
        padding: 0
    }

    .section-info .container,
    .section-brands .container,
    .section-buying-now .container,
    .index-container .container,
    .index-container .container .text-block__item {
        width: 100%
    }

    .tiles--mobile {
        max-height: 176px
    }

    .tiles--mobile .tile-item {
        min-width: 200px
    }

    .tiles--mobile .tile-item__tex {
        word-break: break-word
    }

    .product-page-sidebar .button--md {
        font-size: 16px;
        line-height: 24px
    }

    .product-page-price__actions .button--favorites {
        padding: 8px 12px
    }

    .product-page-price__row:first-child {
        justify-content: space-between
    }

    #checkout-page .checkout-content .checkout-total__promocode .checkout-total__promocode-field {
        min-width: 360px
    }

    #checkout-page .checkout-content .checkout-content.checkout-form__group .radio-button__content .text-field__container {
        width: 100%
    }

    .products-list .card {
        width: 100%;
        min-height: 296px;
        max-height: 296px
    }

    .products-container .section-watching {
        padding-bottom: 0
    }

    .products-container .section-watching .cards-list {
        position: relative;
        overflow-x: scroll;
        display: flex;
        column-gap: 8px
    }

    .modal {
        max-width: 390px;
        min-width: 390px
    }

    .modal .modal-title {
        font-size: 22px
    }

    .basket-actions {
        justify-content: space-between;
        width: 100%
    }

    .basket-actions .button--sm {
        width: 100%
    }

    .tag {
        padding: 8px 16px
    }

    .select--mobile .select--mobile-field__value {
        font-weight: 500
    }

    .card-buy--count {
        border-radius: 24px
    }
}

@media screen and (max-width: 1023px) {
    .section-tiles.container {
        min-width: 100%
    }

    .section-tiles.container .section-header {
        width: 100%;
        margin-left: auto;
        margin-right: auto
    }

    #product-page .section-watching,
    #search-results-page .section-watching {
        display: block;
        padding-bottom: 32px
    }

    #product-page .section-watching .cards-list,
    #search-results-page .section-watching .cards-list {
        position: relative;
        overflow-x: hidden;
        display: flex;
        column-gap: 8px
    }

    .section-watching .container.cards {
        min-width: 100%;
        display: flex;
        overflow: hidden
    }

    .section-watching .container.cards .cards-list {
        position: relative;
        overflow-x: hidden;
        display: flex;
        column-gap: 8px;
        margin-top: 0
    }
}

@media screen and (max-width: 423px) {
    .index-container .container {
        min-width: 92%
    }

    .tiles--mobile .tile-item {
        min-width: 176px
    }

    .tiles--mobile .tile-item__tex {
        word-break: break-word
    }
}

#brand-page .brand-info {
    margin: 0 0 32px;
    background-color: #fff;
    box-shadow: 0 0 2px #f3f3f3, 0 2px 8px -1px #372f321a;
    border-radius: 3px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info {
        margin: 0 0 48px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-info {
        margin: 0 0 24px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info {
        margin: 0 0 32px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-info .section-title {
        font-size: 20px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info .section-title {
        font-size: 22px;
        line-height: 24px
    }
}

#brand-page .brand-info__banner {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 304px;
    max-height: 304px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__banner {
        min-height: 384px;
        max-height: 384px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-info__banner {
        min-height: 224px;
        max-height: 224px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__banner {
        min-height: 160px;
        max-height: 160px;
        object-fit: cover
    }
}

@media screen and (max-width: 723px) {
    #brand-page .brand-info__banner {
        min-height: 136px;
        max-height: 136px
    }
}

#brand-page .brand-info__banner p {
    position: absolute;
    left: 24px;
    bottom: 32px;
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 32px;
    color: #fff
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__banner p {
        left: 48px;
        font-size: 35px;
        line-height: 40px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-info__banner p {
        bottom: 24px;
        font-size: 20px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__banner p {
        left: 16px;
        bottom: 8px;
        font-size: 22px;
        line-height: 24px
    }
}

#brand-page .brand-info__banner img {
    width: 100%;
    height: 100%
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__banner img {
        min-height: 160px;
        max-height: 160px
    }
}

@media screen and (max-width: 723px) {
    #brand-page .brand-info__banner img {
        min-height: 136px;
        max-height: 136px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__banner--desktop {
        display: none
    }
}

#brand-page .brand-info__banner--mobile {
    display: none
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__banner--mobile {
        display: block
    }
}

#brand-page .brand-info__container {
    padding: 32px 24px 40px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__container {
        padding: 48px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__container {
        padding: 24px 16px
    }
}

#brand-page .brand-info__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__text {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-info__text {
        font-size: 12px;
        line-height: 16px
    }
}

#brand-page .brand-info__text-link {
    display: inline-block;
    align-items: center;
    text-decoration: none;
    color: #58c7f7
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__text-link {
        margin-top: 16px
    }
}

#brand-page .brand-info__text-link svg {
    width: 18px;
    height: 15px;
    margin-left: 6px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__text-link svg {
        width: 24px;
        height: 20px;
        margin-left: 10px
    }
}

#brand-page .brand-info__lists {
    display: grid;
    column-gap: 24px;
    grid-template-columns: 1fr 1fr;
    margin-top: 24px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__lists {
        column-gap: 32px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .brand-info__lists {
        display: flex;
        flex-direction: column;
        row-gap: 32px
    }
}

#brand-page .brand-info__lists .section-title {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-info__lists .section-title {
        margin-bottom: 24px
    }
}

#brand-page .basket-added {
    margin: 32px 0 40px
}

@media screen and (min-width: 1920px) {
    #brand-page .basket-added {
        margin: 48px 0 56px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .basket-added {
        margin: 32px 0
    }
}

@media screen and (min-width: 1920px) {
    #brand-page .basket-added__header {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .basket-added__header {
        margin-bottom: 16px
    }
}

#brand-page .basket-added .swiper-slide {
    background: none;
    flex-direction: column;
    row-gap: 8px;
    min-width: 400px;
    max-width: 400px;
    min-height: 100%;
    max-height: 100%;
    padding: 0 0 16px
}

@media screen and (min-width: 1920px) {
    #brand-page .basket-added .swiper-slide {
        min-width: 500px;
        max-width: 500px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .basket-added .swiper-slide {
        min-width: 360px;
        max-width: 360px;
        padding: 0
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .basket-added .swiper-slide {
        min-width: 312px;
        max-width: 312px
    }
}

#brand-page .basket-added .swiper-slide img {
    min-width: 100%;
    max-width: 100%;
    min-height: 250px;
    max-height: 250px;
    border-radius: 3px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    #brand-page .basket-added .swiper-slide img {
        min-height: 312px;
        max-height: 312px
    }
}

@media screen and (max-width: 1023px) {
    #brand-page .basket-added .swiper-slide img {
        min-height: 224px;
        max-height: 224px;
        cursor: auto
    }
}

@media screen and (max-width: 723px) {
    #brand-page .basket-added .swiper-slide img {
        min-height: 195px;
        max-height: 195px
    }
}

#brand-page .basket-added .swiper-slide__text {
    width: 100%
}

@media screen and (min-width: 1920px) {
    #brand-page .basket-added .swiper-slide__text {
        font-size: 15px;
        line-height: 24px
    }
}

#brand-page .basket-added .swiper-wrapper {
    padding-top: 16px
}

.brand {
    min-height: 176px;
    min-width: 176px;
    max-width: 176px;
    max-height: 176px
}

@media screen and (min-width: 1920px) {
    .brand {
        min-height: 228px;
        max-height: 228px;
        min-width: 228px;
        max-width: 228px
    }
}

@media screen and (max-width: 1024px) {
    .brand {
        min-height: 137px;
        max-height: 137px;
        min-width: 137px;
        max-width: 137px
    }
}

@media screen and (max-width: 768px) {
    .brand {
        min-height: 124px;
        max-height: 124px;
        min-width: 124px;
        max-width: 124px
    }
}

@media screen and (max-width: 423px) {
    .brand {
        min-height: 104px;
        max-height: 104px;
        min-width: 104px;
        max-width: 104px
    }
}

.brand .brand-image {
    min-width: 104px;
    max-width: 104px
}

@media screen and (min-width: 1920px) {
    .brand .brand-image {
        min-width: 136px;
        max-width: 136px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .brand .brand-image {
        min-width: 88px;
        max-width: 88px
    }
}

@media screen and (max-width: 768px) {
    .brand .brand-image {
        min-width: 64px;
        max-width: 64px;
        margin-bottom: 16px
    }
}

.brand .brand-image img {
    max-height: 104px
}

@media screen and (min-width: 1920px) {
    .brand .brand-image img {
        max-height: 136px
    }
}

@media screen and (max-width: 1024px) {
    .brand .brand-image img {
        max-height: 88px
    }
}

@media screen and (max-width: 768px) {
    .brand .brand-image img {
        max-height: 64px
    }
}

@media screen and (min-width: 1920px) {
    .brand .brand-title {
        font-size: 22px;
        line-height: 32px;
        bottom: 16px
    }
}

@media screen and (max-width: 1024px) {
    .brand .brand-title {
        bottom: 8px
    }
}

@media screen and (max-width: 768px) {
    .brand .brand-title {
        bottom: 16px
    }
}

@media screen and (max-width: 423px) {
    .brand .brand-title {
        bottom: 8px
    }
}

.tag {
    color: #494949;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px
}

@media screen and (min-width: 1920px) {
    .tag {
        font-size: 18px;
        line-height: 20px
    }
}

.tag:before,
.tag:after {
    content: none
}

.tag:hover,
.tag--active {
    color: #151514;
    font-weight: 700
}

#brand-page .container {
    padding-left: 80px;
    padding-right: 80px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .container {
        padding-left: clamp(40px, 80px - (1920px - 100vw) * 40 / 560, 80px);
        padding-right: clamp(40px, 80px - (1920px - 100vw) * 40 / 560, 80px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .container {
        padding-left: 40px;
        padding-right: 40px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .container {
        padding-left: clamp(32px, 40px - (1360px - 100vw) * 8 / 336, 40px);
        padding-right: clamp(32px, 40px - (1360px - 100vw) * 8 / 336, 40px)
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .container {
        padding-left: 32px;
        padding-right: 32px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .container {
        padding-left: clamp(28px, 32px - (1024px - 100vw) * 4 / 300, 32px);
        padding-right: clamp(28px, 32px - (1024px - 100vw) * 4 / 300, 32px)
    }
}

@media screen and (max-width: 724px) {
    #brand-page .container {
        padding-left: 28px;
        padding-right: 28px
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .container {
        padding-left: clamp(16px, 28px - (724px - 100vw) * 12 / 124, 28px);
        padding-right: clamp(16px, 28px - (724px - 100vw) * 12 / 124, 28px)
    }
}

@media screen and (max-width: 600px) {
    #brand-page .container {
        padding-left: 16px;
        padding-right: 16px
    }
}

#brand-page .brand-gallery {
    margin: 0 0 40px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-gallery {
        margin: 0 0 clamp(40px, 56px - (1920px - 100vw) * 16 / 560, 56px);
        margin-top: 40px
    }
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-gallery {
        margin: 48px 0 56px
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-gallery {
        margin-top: 32px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-gallery {
        margin-top: 24px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-gallery {
        margin: 0 0 clamp(32px, 56px - (1024px - 100vw) * 24 / 300, 56px);
        margin-top: 32px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-gallery {
        margin: 0 0 32px
    }
}

#brand-page .brand-gallery__header {
    margin-bottom: 16px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-gallery__header {
        margin-bottom: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px)
    }
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-gallery__header {
        margin-bottom: 24px
    }
}

#brand-page .brand-gallery__swiper-wrapper {
    position: relative
}

#brand-page .brand-gallery__navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    pointer-events: none;
    z-index: 2;
    transform: translateY(-50%);
    padding: 0 16px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px)
    }
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 24px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 clamp(8px, 24px - (1360px - 100vw) * 16 / 336, 24px)
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 8px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 clamp(4px, 8px - (1024px - 100vw) * 4 / 300, 8px)
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-gallery__navigation {
        padding: 0 4px
    }
}

#brand-page .brand-gallery__navigation .swiper-left,
#brand-page .brand-gallery__navigation .swiper-right {
    pointer-events: all;
    transition: opacity .3s ease
}

#brand-page .brand-gallery__swiper .swiper-scrollbar {
    display: none
}

#brand-page .brand-gallery__swiper .swiper-slide {
    background: none;
    min-width: auto;
    width: auto;
    max-width: 1136px;
    height: 588px !important
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: clamp(348px, 420px - (1360px - 100vw) * 72 / 336, 420px) !important
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: 420px !important
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: clamp(301px, 348px - (1024px - 100vw) * 47 / 300, 348px) !important
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: 348px !important
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: clamp(160px, 301px - (724px - 100vw) * 141 / 124, 301px) !important
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: 301px !important
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-gallery__swiper .swiper-slide {
        max-width: 100%;
        height: 160px !important
    }
}

#brand-page .brand-gallery__swiper .swiper-slide img {
    width: 100%;
    max-width: 100%;
    height: 588px !important;
    border-radius: 24px;
    object-fit: cover;
    cursor: pointer
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: clamp(348px, 420px - (1360px - 100vw) * 72 / 336, 420px) !important;
        border-radius: clamp(16px, 16px + (1360px - 100vw) * 0 / 336, 16px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: 420px !important;
        border-radius: 16px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: clamp(301px, 348px - (1024px - 100vw) * 47 / 300, 348px) !important;
        border-radius: 16px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: 348px !important;
        border-radius: 16px
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: clamp(160px, 301px - (724px - 100vw) * 141 / 124, 301px) !important;
        border-radius: 16px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: 301px !important;
        border-radius: 16px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-gallery__swiper .swiper-slide img {
        height: 160px !important
    }
}

#brand-page .brand-gallery__swiper .swiper-wrapper {
    padding-top: 32px
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-gallery__swiper .swiper-wrapper {
        padding-top: 48px
    }
}

@media screen and (max-width: 1359px) {
    #brand-page .brand-gallery__swiper .swiper-wrapper {
        padding-top: 32px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-gallery__swiper .swiper-wrapper {
        padding-top: 24px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-gallery__swiper .swiper-wrapper {
        padding-top: 32px
    }
}

@media screen and (max-width: 360px) {
    #brand-page .brand-gallery__swiper .swiper-wrapper {
        padding-top: 20px
    }
}

#brand-page .brand-about {
    margin: 0 0 40px;
    background-color: #fff;
    border-radius: 3px;
    padding: 32px 24px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about {
        padding: clamp(0px, 32px - (1360px - 100vw) * 32 / 336, 32px) 24px
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about {
        padding: 0 24px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about {
        padding: 0 24px;
        padding-bottom: clamp(0px, 40px - (1024px - 100vw) * 40 / 300, 40px);
        margin: 0
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about {
        padding: 0 24px 40px;
        margin: 0
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .brand-about {
        padding: 0 clamp(0px, 24px - (724px - 100vw) * 24 / 124, 24px);
        padding-bottom: 40px;
        margin: 0
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about {
        padding: 0;
        margin: 0
    }
}

#brand-page .brand-about__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
    margin-bottom: 0;
    padding-bottom: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box
}

@media screen and (max-width: 710px) {
    #brand-page .brand-about__content {
        grid-template-columns: 1fr
    }
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-about__content {
        gap: 48px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-about__content {
        gap: clamp(20px, 20px + (100vw - 1360px) * 16 / 560, 20px) !important
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__content {
        gap: clamp(32px, 48px - (1360px - 100vw) * 16 / 336, 48px)
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__content {
        grid-template-columns: 1fr auto;
        gap: 32px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__content {
        grid-template-columns: 1fr auto;
        gap: clamp(24px, 32px - (1024px - 100vw) * 8 / 300, 32px)
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__content {
        grid-template-columns: 1fr auto;
        gap: 24px
    }
}

#brand-page .brand-about__content .brand-about__text {
    grid-column: 1;
    min-width: 0;
    width: 1396px;
    max-width: 100%;
    box-sizing: border-box
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 1316px
    }
}

@media screen and (min-width: 1441px) and (max-width: 1919px) {
    #brand-page .brand-about__content .brand-about__text {
        width: clamp(934px, 1316px - (1920px - 100vw) * 382 / 479, 1316px) !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1440px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 934px !important;
        max-width: 100%
    }
}

@media screen and (min-width: 1025px) and (max-width: 1360px) {
    #brand-page .brand-about__content .brand-about__text {
        width: clamp(600px, 850px - (1360px - 100vw) * 260 / 335, 850px) !important;
        max-width: 100%
    }
}

@media screen and (min-width: 1024px) and (max-width: 1024px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__content .brand-about__text {
        width: 100%;
        max-width: 100%
    }
}

#brand-page .brand-about__content .brand-about__image {
    grid-column: 2;
    align-self: start;
    flex-shrink: 0
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__content .brand-about__image {
        max-width: 228px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__content .brand-about__image {
        max-width: clamp(150px, 228px - (1024px - 100vw) * 78 / 300, 228px)
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__content .brand-about__image {
        max-width: 150px
    }
}

@media screen and (max-width: 424px) {
    #brand-page .brand-about__content .brand-about__image {
        grid-column: 1
    }
}

#brand-page .brand-about__text .brand-about__title-wrapper {
    display: block
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__text .brand-about__title-wrapper {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        margin-bottom: 16px
    }
}

#brand-page .brand-about__text .brand-about__title-image {
    display: none
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__text .brand-about__title-image {
        display: block;
        flex-shrink: 0;
        margin-left: 36px
    }

    #brand-page .brand-about__text .brand-about__title-image img {
        width: 50px;
        height: 27px;
        object-fit: contain
    }
}

#brand-page .brand-about__text .section-title {
    margin-bottom: 16px;
    width: 1396px;
    max-width: 100%;
    box-sizing: border-box
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-about__text .section-title {
        margin-bottom: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        font-weight: 600;
        font-style: Wide Medium;
        font-size: clamp(32px, 48px - (1920px - 100vw) * 16 / 560, 48px);
        leading-trim: NONE;
        line-height: clamp(40px, 56px - (1920px - 100vw) * 16 / 560, 56px);
        letter-spacing: 0%;
        vertical-align: middle
    }
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-about__text .section-title {
        margin-bottom: 24px;
        font-weight: 600;
        font-style: Wide Medium;
        font-size: 48px;
        leading-trim: NONE;
        line-height: 56px;
        letter-spacing: 0%;
        vertical-align: middle
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__text .section-title {
        width: clamp(550px, 750px - (1360px - 100vw) * 200 / 336, 750px);
        max-width: 100%;
        font-size: clamp(28px, 32px - (1360px - 100vw) * 4 / 336, 32px);
        line-height: clamp(32px, 40px - (1360px - 100vw) * 8 / 336, 40px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about__text .section-title {
        width: 750px;
        max-width: 100%;
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 18px
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__text .section-title {
        width: clamp(450px, 560px - (1024px - 100vw) * 110 / 300, 560px);
        max-width: 100%;
        font-size: 28px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__text .section-title {
        width: 550px;
        max-width: 100%;
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 16px
    }
}

@media screen and (min-width: 601px) and (max-width: 723px) {
    #brand-page .brand-about__text .section-title {
        width: 100%;
        max-width: 100%;
        font-size: clamp(24px, 28px - (724px - 100vw) * 4 / 124, 28px);
        line-height: 32px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__text .section-title {
        width: 470px;
        max-width: 100%
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__text .section-title {
        width: 100%;
        max-width: 100%;
        margin-bottom: 0;
        font-size: 24px;
        line-height: 32px
    }
}

#brand-page .brand-about__description {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    margin-bottom: 0;
    padding-bottom: 0
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-about__description {
        font-size: clamp(16px, 22px - (1920px - 100vw) * 6 / 560, 22px);
        line-height: clamp(24px, 32px - (1920px - 100vw) * 8 / 560, 32px)
    }
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-about__description {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__description {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        leading-trim: NONE;
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px);
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about__description {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: 16px;
        leading-trim: NONE;
        line-height: 24px;
        letter-spacing: 0%
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__description {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: clamp(14px, 16px - (1024px - 100vw) * 2 / 300, 16px);
        line-height: clamp(20px, 24px - (1024px - 100vw) * 4 / 300, 24px)
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__description {
        font-family: Inter;
        font-weight: 600;
        font-style: Semi Bold;
        font-size: 14px;
        line-height: 20px
    }
}

#brand-page .brand-about__text-main {
    margin-bottom: 0
}

#brand-page .brand-about__text-main .brand-about__brand-name {
    font-weight: 600
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Regular;
        font-size: 24px;
        leading-trim: NONE;
        line-height: 38px;
        letter-spacing: 0%
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Regular;
        font-size: clamp(16px, 16px + (100vw - 1360px) * 8 / 560, 24px) !important;
        leading-trim: NONE;
        line-height: clamp(24px, 24px + (100vw - 1360px) * 14 / 560, 38px) !important;
        letter-spacing: 0%
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 500;
        font-style: Semi Bold;
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        leading-trim: NONE;
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px);
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 500;
        font-style: Semi Bold;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0%
    }
}

@media screen and (min-width: 725px) and (max-width: 1023px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Regular;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Regular;
        font-size: 14px;
        leading-trim: NONE;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Semi Bold;
        font-size: 14px;
        leading-trim: NONE;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__text-main {
        font-family: Inter;
        font-weight: 400;
        font-style: Semi Bold;
        font-size: 14px;
        leading-trim: NONE;
        line-height: 20px;
        letter-spacing: 0%
    }
}

#brand-page .brand-about__text-expanded {
    margin-bottom: 0
}

#brand-page .brand-about__read-more {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%;
    vertical-align: middle;
    background: none;
    border: none;
    padding: 0;
    color: #58c7f7;
    cursor: pointer;
    text-decoration: underline;
    margin-top: 24px;
    margin-bottom: 0
}

@media screen and (min-width: 1920px) {
    #brand-page .brand-about__read-more {
        font-size: 24px;
        line-height: 38px;
        margin-top: 24px
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-about__read-more {
        font-size: clamp(16px, 16px + (100vw - 1360px) * 8 / 560, 24px) !important;
        line-height: clamp(24px, 24px + (100vw - 1360px) * 14 / 560, 38px) !important;
        margin-top: clamp(16px, 16px + (100vw - 1360px) * 8 / 560, 24px) !important
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__read-more {
        margin-top: 16px;
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px);
        line-height: clamp(20px, 24px - (1360px - 100vw) * 4 / 336, 24px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about__read-more {
        margin-top: 16px;
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__read-more {
        margin-top: 16px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__read-more {
        margin-top: 16px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__read-more {
        margin-top: 16px;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 40px
    }
}

#brand-page .brand-about__read-more:hover {
    opacity: .8
}

#brand-page .brand-about__read-more--bottom {
    margin-top: 24px;
    margin-bottom: 0;
    display: block;
    width: 100%;
    text-align: left
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-about__read-more--bottom {
        margin-top: 32px
    }
}

#brand-page .brand-about__image {
    width: 340px;
    height: 286px;
    padding: 60px 75px;
    border-radius: 28px;
    border: 2px solid #dedede;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-sizing: border-box;
    flex-shrink: 0
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about__image {
        width: clamp(228px, 290px - (1360px - 100vw) * 62 / 336, 290px);
        height: clamp(192px, 229px - (1360px - 100vw) * 37 / 336, 229px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about__image {
        width: 290px;
        height: 229px;
        border: 1px solid #dedede;
        border-radius: 16px
    }
}

@media screen and (min-width: 769px) and (max-width: 1023px) {
    #brand-page .brand-about__image {
        width: clamp(150px, 228px - (1024px - 100vw) * 78 / 255, 228px);
        height: clamp(140px, 192px - (1024px - 100vw) * 52 / 255, 192px)
    }
}

@media screen and (min-width: 725px) and (max-width: 768px) {
    #brand-page .brand-about__image {
        width: 150px;
        height: 140px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about__image {
        width: 228px;
        height: 192px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about__image {
        width: 150px;
        height: 140px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-about__image {
        display: none
    }
}

#brand-page .brand-about img {
    width: 210px;
    height: 114px;
    object-fit: contain
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-about img {
        width: clamp(124px, 163px - (1360px - 100vw) * 39 / 336, 163px);
        height: clamp(68px, 88px - (1360px - 100vw) * 20 / 336, 88px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-about img {
        width: 163px;
        height: 88px
    }
}

@media screen and (min-width: 769px) and (max-width: 1023px) {
    #brand-page .brand-about img {
        width: clamp(80px, 124px - (1024px - 100vw) * 44 / 255, 124px);
        height: clamp(43px, 68px - (1024px - 100vw) * 25 / 255, 68px)
    }
}

@media screen and (min-width: 725px) and (max-width: 768px) {
    #brand-page .brand-about img {
        width: 80px;
        height: 43px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-about img {
        width: 124px;
        height: 68px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-about img {
        width: 80px;
        height: 43px
    }
}

#brand-page .brand-info__lists {
    display: flex;
    flex-direction: column;
    row-gap: 32px;
    margin-top: 18px;
    padding-top: 0;
    width: 100%;
    border-top: none
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-info__lists {
        margin-top: 18px;
        row-gap: 18px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-info__lists {
        margin-top: 16px;
        row-gap: 24px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-info__lists {
        margin-top: 16px;
        row-gap: 24px
    }
}

#brand-page .brand-info__lists .brand-info__list--second {
    margin-top: 16px
}

@media screen and (max-width: 1920px) {
    #brand-page .brand-info__lists .brand-info__list--second {
        margin-top: 40px
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-info__lists .brand-info__list--second {
        margin-top: 18px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-info__lists .brand-info__list--second {
        margin-top: 16px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-info__lists .brand-info__list--second {
        margin-top: 16px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-info__lists .brand-info__list--second {
        margin-top: 24px
    }
}

#brand-page .brand-info__lists .section-title {
    margin-bottom: 24px;
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-info__lists .section-title {
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 38px - (1920px - 100vw) * 14 / 560, 38px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-info__lists .section-title {
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-info__lists .section-title {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-info__lists .section-title {
        font-size: 14px;
        margin-bottom: 18px !important
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-info__lists .section-title {
        font-size: 14px;
        margin-bottom: 18px !important
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-info__lists .section-title {
        font-size: 14px
    }
}

#brand-page .brand-info__lists .brand-info__text {
    font-family: Inter;
    font-weight: 600;
    font-style: Semi Bold;
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0%;
    padding-left: 30px;
    display: flex;
    flex-direction: column;
    gap: 8px
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-info__lists .brand-info__text {
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 38px - (1920px - 100vw) * 14 / 560, 38px)
    }
}

#brand-page .brand-info__lists .brand-info__text li {
    font-weight: 500
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: clamp(16px, 24px - (1920px - 100vw) * 8 / 560, 24px);
        line-height: clamp(24px, 38px - (1920px - 100vw) * 14 / 560, 38px)
    }
}

@media screen and (min-width: 1025px) and (max-width: 1359px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: clamp(14px, 16px - (1360px - 100vw) * 2 / 336, 16px)
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-info__lists .brand-info__text li {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 724px) {
    #brand-page .brand-info__lists .brand-info__text {
        padding-left: 22px
    }
}

@media screen and (max-width: 600px) {
    #brand-page .brand-info__lists .brand-info__text {
        padding-left: 16px !important
    }
}

@media screen and (max-width: 1920px) and (min-width: 1360px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results {
        padding: 0 !important;
        margin-top: 40px !important
    }
}

@media screen and (max-width: 1359px) and (min-width: 1025px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results {
        padding: 0 !important;
        margin-top: 24px !important
    }
}

@media screen and (max-width: 1024px) and (min-width: 725px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results {
        padding: 0 !important;
        margin-top: 24px !important
    }
}

@media screen and (max-width: 724px) and (min-width: 360px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results {
        padding: 0 !important;
        margin-top: 16px !important
    }
}

#brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
    font-family: Inter !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    color: #888 !important;
    line-height: 24px !important;
    text-decoration: none !important
}

@media screen and (min-width: 1920px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 16px !important;
        line-height: 24px !important;
        padding: 0 !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: clamp(10px, 10px + (100vw - 1360px) * 10 / 560, 20px) !important;
        line-height: clamp(14px, 14px + (100vw - 1360px) * 10 / 560, 24px) !important
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a {
        font-size: 12px !important;
        line-height: 16px !important
    }
}

#brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a svg.home-icon {
    width: 20px !important;
    height: 18px !important;
    display: block !important
}

@media screen and (min-width: 1920px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a svg.home-icon {
        width: 20px !important;
        height: 18px !important
    }
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a svg.home-icon {
        width: clamp(16px, 16px + (100vw - 1360px) * 12 / 560, 20px) !important;
        height: clamp(14px, 14px + (100vw - 1360px) * 10 / 560, 18px) !important
    }
}

@media screen and (max-width: 1360px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a svg.home-icon {
        width: 14px !important;
        height: 12px !important
    }
}

@media screen and (max-width: 1024px) {
    #brand-page .container .breadcrumbs.breadcrumbs-results .breadcrumbs__item a svg.home-icon {
        width: 14px !important;
        height: 12px !important
    }
}

@media screen and (min-width: 1920px) {
    #brand-page .sort-wrapper {
        padding: 16px 0 0
    }

    #brand-page .products-list {
        margin-top: 40px;
        margin-bottom: 56px;
        padding: 0
    }

    #brand-page .brands-tag-list {
        padding: 24px 0 64px
    }

    #brand-page .pagination {
        padding: 0
    }
}

@media screen and (min-width: 1024px) {
    #brand-page .sort-wrapper {
        padding: 16px 0 0
    }

    #brand-page .products-list,
    #brand-page .pagination {
        padding: 0
    }
}

@media screen and (max-width: 1023px) and (min-width: 725px) {

    #brand-page .sort-wrapper,
    #brand-page .sort-wrapper-mobile {
        padding: 16px 0 0
    }

    #brand-page .products-list,
    #brand-page .pagination,
    #brand-page .pagination-wrapper {
        padding: 0
    }
}

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

    #brand-page .sort-wrapper-mobile,
    #brand-page .sort-wrapper {
        padding: 16px 0 0
    }

    #brand-page .products-list,
    #brand-page .pagination,
    #brand-page .pagination-wrapper {
        padding: 0
    }
}

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

    #brand-page .sort-wrapper-mobile,
    #brand-page .sort-wrapper {
        padding: 16px 0 0
    }

    #brand-page .products-list {
        padding: 0
    }
}

.product-page-guarantee {
    margin-bottom: 24px
}

@media screen and (min-width: 1920px) {
    .product-page-guarantee {
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1359px) and (min-width: 1024px) {
    .product-page-guarantee {
        margin-bottom: 18px
    }
}

.product-page-guarantee__title {
    font-size: 12px;
    line-height: 16px;
    color: #888;
    margin-bottom: 12px
}

@media screen and (min-width: 1920px) {
    .product-page-guarantee__title {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-guarantee__title {
        font-size: 10px;
        line-height: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-guarantee__title {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 723px) {
    .product-page-guarantee__title {
        font-size: 10px;
        line-height: 14px
    }
}

.product-page-guarantee .checkbox-container {
    padding-left: 24px;
    font-size: 14px;
    line-height: 18px
}

@media screen and (min-width: 1920px) {
    .product-page-guarantee .checkbox-container {
        padding-left: 40px;
        font-size: 20px;
        line-height: 28px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-guarantee .checkbox-container {
        padding-left: 28px;
        font-size: 12px;
        line-height: 14px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-guarantee .checkbox-container {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 723px) {
    .product-page-guarantee .checkbox-container {
        font-size: 14px;
        line-height: 20px
    }
}

.product-page-guarantee .checkbox-container a {
    color: #4da6cd;
    text-decoration: none
}

.product-page-guarantee .checkbox-container span {
    font-weight: 700
}

.product-page-guarantee .checkbox-icon {
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-guarantee .checkbox-icon {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-guarantee .checkbox-icon {
        width: 20px;
        height: 20px
    }
}

.product-page-link {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 8px;
    max-width: 100%;
    padding: 16px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #494949;
    border: 1px solid #dedede;
    border-radius: 16px
}

@media screen and (min-width: 1920px) {
    .product-page-link {
        padding: 24px;
        column-gap: 12px;
        flex-direction: column;
        align-items: start;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-link {
        font-size: 14px;
        line-height: 20px;
        padding-block: 12px
    }
}

@media screen and (max-width: 1023px) {
    .product-page-link {
        margin-bottom: 24px;
        max-width: 379px
    }
}

.product-page-link__container {
    display: flex;
    flex-direction: column;
    row-gap: 16px
}

@media screen and (max-width: 1023px) {
    .product-page-link__container {
        row-gap: 8px
    }
}

.product-page-link__text {
    min-width: max-content
}

.product-page-link img {
    min-width: 14px;
    max-width: 14px;
    min-height: 18px;
    max-height: 18px;
    border-radius: 0
}

@media screen and (min-width: 1920px) {
    .product-page-link img {
        min-width: 24px;
        max-width: 24px;
        min-height: 30px;
        max-height: 30px
    }
}

@media screen and (max-width: 1359px) {
    .product-page-link img {
        min-width: 11px;
        max-width: 11px;
        min-height: 14px;
        max-height: 14px
    }
}

.product-page-link a {
    color: #4da6cd;
    text-decoration: none
}

@media screen and (max-width: 1023px) {
    .product-page-link a {
        width: 347px
    }
}

@media screen and (max-width: 723px) {
    .product-page-link a {
        width: 100%
    }
}

.product-page .product-page-price__actions .button--outline {
    transition: color .2s ease
}

.product-page .product-page-price__actions .button--filled {
    padding: 8px 24px;
    margin: 0;
    transition: none
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-price__actions .button--filled {
        padding: 12px 32px;
        font-size: 20px;
        line-height: 32px
    }

    .product-page .product-page-price__actions .button--filled svg {
        width: 32px;
        height: 32px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-page-price__actions .button--filled {
        padding: 8px 16px
    }
}

@media screen and (max-width: 723px) {
    .product-page .product-page-price__actions .button--filled {
        padding: 12px 16px
    }

    .product-page .product-page-price__actions .button--filled svg {
        width: 16px;
        height: 16px
    }
}

.product-page .product-page-price__actions .button--filled:hover {
    padding: 10px 26px;
    margin: -2px;
    transition: all .2s ease
}

@media screen and (min-width: 1920px) {
    .product-page .product-page-price__actions .button--filled:hover {
        padding: 14px 34px
    }
}

@media screen and (max-width: 1359px) {
    .product-page .product-page-price__actions .button--filled:hover {
        padding: 8px 16px;
        margin: 0
    }
}

@media screen and (max-width: 1023px) {
    .product-page .product-page-price__actions .button--filled:hover {
        padding: 8px 24px
    }
}

@media screen and (max-width: 723px) {
    .product-page .product-page-price__actions .button--filled:hover {
        padding: 12px 16px
    }
}

.product-page .product-page-tab-content.product-page-instruction--images.tab-pane {
    padding-right: 0
}

@media screen and (min-width: 1920px) {
    .product-brands .section-brands {
        padding: 0 80px 48px;
        margin-top: 80px
    }
}

@media screen and (max-width: 1359px) {
    .product-brands .section-brands {
        padding-bottom: 48px;
        margin-top: 48px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .product-brands .section-brands {
        padding-bottom: 32px;
        margin-top: 40px;
        border-radius: 16px
    }

    .product-brands .section-brands .brands--mobile {
        background: none
    }

    .product-brands .section-brands .brands-list__item {
        max-height: 90px;
        min-height: 90px;
        max-width: 148px;
        min-width: 148px;
        border-radius: 12px
    }

    .product-brands .section-brands .brands-list__item img {
        max-height: 34px;
        width: auto
    }
}

@media screen and (max-width: 1023px) and (max-width: 723px) {
    .product-brands .section-brands .brands-list__item {
        min-width: 91px;
        max-width: 91px;
        min-height: 60px;
        max-height: 60px;
        padding: 16px 24px;
        gap: 10px
    }

    .product-brands .section-brands .brands-list__item img {
        max-height: 24px;
        width: 40px
    }
}

@media screen and (max-width: 723px) {
    .product-brands .section-brands {
        margin-bottom: 32px
    }
}

.container-read {
    display: flex;
    gap: 9px;
    align-items: center;
    justify-content: center
}

.product-brands:before {
    content: "";
    position: absolute;
    width: 94%;
    height: 1px;
    left: 48px;
    top: 0;
    background: #dedede;
    transition: width .25s ease
}

@media screen and (min-width: 1920px) {
    .product-brands:before {
        left: 80px;
        width: 92%
    }
}

@media screen and (max-width: 1359px) {
    .product-brands:before {
        left: 32px
    }
}

@media screen and (max-width: 1023px) {
    .product-brands:before {
        left: 28px
    }
}

@media screen and (max-width: 723px) {
    .product-brands:before {
        left: 16px
    }
}

.product-brands {
    position: relative
}

@media screen and (min-width: 1920px) {
    .product-brands .section-brands {
        padding-top: 80px !important
    }
}

@media screen and (max-width: 1359px) {
    .product-brands .section-brands {
        padding-top: 48px
    }
}

@media screen and (max-width: 1023px) {
    .product-brands .section-brands {
        margin-top: 32px;
        padding-top: 32px
    }
}

@media screen and (max-width: 723px) {
    .product-brands .section-brands {
        padding-bottom: 0
    }
}

.link-text {
    color: #4da6cd
}

.info-page {
    display: flex;
    padding: 48px 40px;
    column-gap: 16px;
    background: #f0f0f0
}

@media screen and (min-width: 1920px) {
    .info-page {
        padding: 88px 80px
    }
}

@media screen and (max-width: 1359px) {
    .info-page {
        padding: 48px 32px;
        column-gap: 12px
    }
}

@media screen and (max-width: 1023px) {
    .info-page {
        min-height: 100%;
        max-height: 100%;
        flex-direction: column-reverse;
        gap: 12px;
        padding: 32px 28px 28px
    }
}

@media screen and (max-width: 723px) {
    .info-page {
        padding: 32px 16px
    }
}

.info-page .account-content {
    display: flex;
    min-width: 964px;
    min-height: max-content;
    padding: 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .info-page .account-content {
        min-width: 1266px;
        padding: 56px;
        gap: 56px
    }
}

@media screen and (max-width: 1359px) {
    .info-page .account-content {
        min-width: 688px;
        padding: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .info-page .account-content {
        max-width: 100%;
        min-width: 100%;
        padding: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 723px) {
    .info-page .account-content {
        padding: 20px 16px
    }
}

.info-page .account-sidebar {
    height: max-content;
    display: flex;
    max-width: 400px;
    padding: 24px 12px;
    flex-direction: column;
    align-items: center;
    flex: 1 0 0;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .info-page .account-sidebar {
        padding: 32px 24px;
        max-width: 470px
    }
}

@media screen and (max-width: 1359px) {
    .info-page .account-sidebar {
        padding: 16px 12px;
        max-width: 260px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .info-page .account-sidebar {
        min-width: 100%;
        max-width: 100%;
        padding: 12px
    }
}

.info-page__main-text {
    font-family: Headline Base;
    font-weight: 500
}

@media screen and (max-width: 768px) {
    .info-page__main-text {
        font-family: Inter, sans-serif;
        font-weight: 400
    }
}

.info-page img {
    width: 100%;
    min-height: 456px;
    max-height: 456px;
    margin-bottom: 8px;
    border-radius: 3px;
    object-fit: cover
}

@media screen and (min-width: 1920px) {
    .info-page img {
        min-height: 576px;
        max-height: 576px
    }
}

@media screen and (max-width: 768px) {
    .info-page img {
        min-height: 256px;
        max-height: 256px
    }
}

@media screen and (max-width: 423px) {
    .info-page img {
        min-height: 208px;
        max-height: 208px
    }
}

.info-page span {
    color: #4da6cd;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .info-page span {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1359px) {
    .info-page span {
        font-size: 14px;
        line-height: 20px
    }
}

.info-page .text-editor h1 {
    font-size: 28px;
    font-weight: 500;
    line-height: 36px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    .info-page .text-editor h1 {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 1359px) {
    .info-page .text-editor h1 {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1023px) {
    .info-page .text-editor h1 {
        font-size: 20px;
        line-height: 28px
    }
}

.info-page .text-editor h2,
.info-page .text-editor h3,
.info-page .text-editor p {
    color: #151514
}

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

    .info-page .text-editor h2,
    .info-page .text-editor h3,
    .info-page .text-editor p {
        margin-bottom: 20px
    }
}

@media screen and (min-width: 1920px) {
    .info-page .text-editor p {
        margin-bottom: 24px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 768px) {
    .info-page .text-editor p {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 16px
    }
}

.info-page .text-editor h2,
.info-page .text-editor h3 {
    margin-top: 32px
}

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

    .info-page .text-editor h2,
    .info-page .text-editor h3 {
        margin-top: 48px
    }
}

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

    .info-page .text-editor h2,
    .info-page .text-editor h3 {
        margin-top: 32px
    }
}

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

    .info-page .text-editor h2,
    .info-page .text-editor h3 {
        margin-top: 32px
    }
}

.info-page ul,
.info-page ol {
    margin-bottom: 0
}

.info-page li {
    margin-bottom: 16px
}

@media screen and (min-width: 1920px) {
    .info-page li {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 1359px) {
    .info-page li {
        margin-bottom: 8px;
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 768px) {
    .info-page li {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 16px
    }
}

.info-page a {
    text-decoration: none
}

.icon-ukraine {
    max-width: 23px !important;
    min-width: 23px !important;
    max-height: 17px !important;
    min-height: 17px !important;
    margin-bottom: 0 !important;
    margin-left: 10px
}

@media screen and (min-width: 1920px) {
    .icon-ukraine {
        min-width: 32px !important;
        max-width: 32px !important;
        min-height: 24px !important;
        max-height: 24px !important
    }
}

.delivery-info {
    display: flex;
    padding: 18px 24px 18px 18px;
    align-items: center;
    gap: 16px;
    border-radius: 18px;
    border: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .delivery-info {
        padding: 24px 28px 24px 24px;
        gap: 24px;
        border-radius: 24px
    }
}

@media screen and (max-width: 1359px) {
    .delivery-info {
        padding: 16px 20px 16px 16px
    }
}

@media screen and (max-width: 723px) {
    .delivery-info {
        padding: 16px 16px 16px 12px;
        gap: 12px
    }
}

.delivery-info__icon {
    display: flex;
    width: 48px;
    height: 48px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    border: .5px solid #dedede;
    background: #f4f4f4
}

@media screen and (min-width: 1920px) {
    .delivery-info__icon {
        width: 72px;
        height: 72px;
        aspect-ratio: 1/1
    }
}

@media screen and (min-width: 1920px) {
    .delivery-info__icon svg {
        width: 32px;
        height: 32px
    }
}

.delivery-info__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px
}

@media screen and (min-width: 1920px) {
    .delivery-info__text {
        gap: 0px
    }
}

@media screen and (max-width: 1359px) {
    .delivery-info__text {
        gap: 2px
    }
}

.delivery-info__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: #151514;
    text-align: center;
    text-overflow: ellipsis;
    font-family: Headline Base;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 0 !important
}

@media screen and (max-width: 723px) {
    .delivery-info__title {
        font-size: 13px !important;
        line-height: 20px
    }
}

.delivery-info__subtitle {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: #494949;
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0 !important
}

@media screen and (min-width: 1920px) {
    .delivery-info__subtitle {
        font-size: 20px !important;
        line-height: 32px !important
    }
}

@media screen and (max-width: 723px) {
    .delivery-info__subtitle {
        font-size: 13px !important;
        line-height: 20px
    }
}

.delivery-info__subtitle-payment {
    color: #4da6cd !important;
    cursor: pointer
}

@media screen and (max-width: 1359px) {
    .container-delivery-info-warranty {
        flex-direction: column
    }
}

.container-delivery-info {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 32px
}

@media screen and (min-width: 1920px) {
    .container-delivery-info {
        margin-top: 56px;
        gap: 32px
    }
}

@media screen and (max-width: 723px) {
    .container-delivery-info {
        flex-direction: column
    }
}

.action-info {
    margin-top: 32px
}

.container-cards {
    display: flex;
    padding-top: 8px;
    align-items: flex-end;
    gap: 12px
}

@media screen and (min-width: 1920px) {
    .container-cards {
        gap: 24px
    }
}

.container-cards .line-payment {
    width: 1px;
    height: 22px;
    background: #dedede
}

@media screen and (min-width: 1920px) {
    .container-cards .line-payment {
        width: 2px;
        height: 43px
    }
}

@media screen and (max-width: 1359px) {
    .container-cards .line-payment {
        width: 1px;
        height: 22px
    }
}

.container-cards .liqpay {
    width: 105px;
    max-height: 21px;
    min-height: 21px;
    margin-bottom: 4px
}

@media screen and (min-width: 1920px) {
    .container-cards .liqpay {
        width: 195px;
        max-height: 39px;
        min-height: 39px
    }
}

@media screen and (max-width: 1359px) {
    .container-cards .liqpay {
        width: 85px;
        min-height: 17px;
        max-height: 17px;
        border-radius: 0
    }
}

.container-cards .visa {
    width: 70px;
    max-height: 23px;
    min-height: 23px;
    aspect-ratio: 40/13;
    margin-bottom: 4px
}

@media screen and (min-width: 1920px) {
    .container-cards .visa {
        width: 121px;
        max-height: 39px;
        min-height: 39px
    }
}

@media screen and (max-width: 1359px) {
    .container-cards .visa {
        width: 56px;
        min-height: 18px;
        max-height: 18px
    }
}

.container-cards .mastercard {
    width: 47px;
    min-height: 29px;
    max-height: 29px;
    aspect-ratio: 47/29;
    margin-bottom: 0
}

@media screen and (min-width: 1920px) {
    .container-cards .mastercard {
        width: 83px;
        max-height: 51px;
        min-height: 51px
    }
}

@media screen and (max-width: 1359px) {
    .container-cards .mastercard {
        width: 37px;
        min-height: 23px;
        max-height: 23px
    }
}

.account-sidebar-container {
    display: flex;
    max-width: 400px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    flex: 1 0 0
}

@media screen and (min-width: 1920px) {
    .account-sidebar-container {
        min-width: 470px;
        gap: 20px
    }
}

@media screen and (max-width: 1359px) {
    .account-sidebar-container {
        display: flex;
        min-width: 260px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px
    }
}

@media screen and (max-width: 1023px) {
    .account-sidebar-container {
        min-width: 100%;
        max-width: 100%
    }
}

.account-content {
    display: flex;
    min-width: 964px;
    padding: 32px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .account-content {
        min-width: 1266px;
        padding: 56px;
        gap: 56px;
        border-radius: 32px
    }
}

@media screen and (max-width: 1359px) {
    .account-content {
        min-width: 688px;
        padding: 24px;
        border-radius: 16px
    }
}

@media screen and (max-width: 1023px) {
    .account-content {
        min-width: 668px
    }
}

@media screen and (max-width: 723px) {
    .account-content {
        min-width: 328px;
        padding: 20px 16px
    }
}

.account-content .account-history__item .button {
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid #dedede;
    background: #fff;
    color: #151514;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

@media screen and (min-width: 1920px) {
    .account-content .account-history__item .button {
        padding: 18px 24px;
        font-size: 20px;
        line-height: 28px;
        min-height: 64px
    }
}

@media screen and (max-width: 1359px) {
    .account-content .account-history__item .button {
        padding: 12px 14px;
        font-size: 12px;
        line-height: 16px;
        max-height: 40px
    }
}

.account-content .account-history__item .button:hover {
    border: 1px solid #58c7f7
}

.account-content .account-history__item .button:before,
.account-content .account-history__item .button:after {
    content: none
}

@media screen and (max-width: 1023px) {
    .account-content .sort-block-history {
        display: block !important
    }
}

@media screen and (min-width: 1920px) {
    .account-content .sort-block-history .sort-block-field__text {
        font-size: 18px;
        line-height: 24px
    }
}

@media screen and (min-width: 1920px) {
    .account-content .sort-block-history .sort-block-field__current {
        padding: 12px 14px
    }
}

@media screen and (min-width: 1920px) {
    .account-content .sort-block-history svg {
        width: 15px;
        height: 16px
    }
}

@media screen and (min-width: 1920px) {
    .account-content .sort-block-history .sort-arrow {
        width: 16px;
        height: 9px
    }
}

.account-content .title-container-history {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start
}

@media screen and (max-width: 723px) {
    .account-content .title-container-history {
        flex-direction: column;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1023px) {
    .account-content .title-container-history .sort-block-field__current {
        padding: 6px 10px
    }
}

.account-content .sort-block-field-history__list {
    bottom: -100px
}

@media screen and (min-width: 1920px) {
    .account-content .sort-block-field-history__list {
        padding: 6px;
        bottom: -116px
    }
}

@media screen and (max-width: 1359px) {
    .account-content .sort-block-field-history__list {
        bottom: -94px;
        padding: 6px
    }
}

.account-content .sort-block-field-history__list .sort-block-field__list-item {
    border: 1px solid transparent
}

@media screen and (max-width: 1359px) {
    .account-content .sort-block-field-history__list .sort-block-field__list-item {
        padding: 6px 10px
    }
}

.account-content .sort-block-field-history__list .sort-block-field__list-item:hover {
    border: 1px solid var(--Stroke-Grey, #dedede)
}

.account-content .account-content__form .button {
    margin: 0
}

@media screen and (min-width: 1920px) {
    .account-content .account-content__form .button {
        padding: 12px 32px
    }
}

@media screen and (max-width: 1024px) {
    .account-content .account-content__form .button {
        padding: 8px 16px;
        margin: 0;
        font-size: 12px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    .account-content .account-content__form .button {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 423px) {
    .account-content .account-content__form .button {
        padding: 12px 32px;
        font-size: 12px;
        line-height: 16px
    }
}

.account-content .account-content__form .button:hover {
    margin: -2px
}

@media screen and (min-width: 1920px) {
    .account-content .account-content__form .button:hover {
        padding: 14px 34px
    }
}

@media screen and (max-width: 1024px) {
    .account-content .account-content__form .button:hover {
        margin: 0
    }
}

#checkout-page .checkout-total .button--filled.button--primary {
    width: 100%;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    border-radius: 16px;
    padding-block: 18px;
    margin: 0 auto 24px
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-total .button--filled.button--primary {
        padding-block: 24px;
        margin: 0 auto 32px;
        min-height: 86px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    #checkout-page .checkout-total .button--filled.button--primary {
        width: 100%;
        padding: 16px 0;
        margin: 0 auto;
        font-size: 14px;
        line-height: 20px
    }
}

#checkout-page .checkout-total .button--filled.button--primary:hover {
    width: 100%;
    padding-block: 18px;
    margin: 0 auto 24px;
    background: #6cd3ff;
    border: none;
    transition: all .25s ease
}

@media screen and (min-width: 1920px) {
    #checkout-page .checkout-total .button--filled.button--primary:hover {
        padding-block: 24px;
        margin: 0 auto 32px
    }
}

@media screen and (max-width: 1024px) {
    #checkout-page .checkout-total .button--filled.button--primary:hover {
        padding: 16px 0;
        margin: 0 auto
    }
}

#checkout-page .text-field__svg {
    position: absolute;
    right: 0;
    bottom: 12px;
    width: 16px;
    height: 16px
}

@media screen and (min-width: 1920px) {
    #checkout-page .text-field__svg {
        width: 24px;
        height: 24px
    }
}

@media screen and (max-width: 1024px) {
    #checkout-page .text-field__svg {
        bottom: 8px;
        width: 12px;
        height: 12px
    }
}

#checkout-page .text-field__placeholder {
    position: absolute;
    bottom: 5px;
    font-size: 15px;
    line-height: 24px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    #checkout-page .text-field__placeholder {
        bottom: 4px;
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 1024px) {
    #checkout-page .text-field__placeholder {
        bottom: 6px;
        font-size: 14px;
        line-height: 20px
    }
}

#checkout-page .text-field__placeholder--gray,
#checkout-page .text-field__placeholder a {
    color: #dedede;
    text-decoration: none;
    pointer-events: none
}

#order-page .button--filled {
    padding: 8px 24px;
    margin: 0
}

@media screen and (min-width: 1920px) {
    #order-page .button--filled {
        padding: 12px 32px;
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    #order-page .button--filled {
        padding: 8px 16px;
        margin: 0
    }
}

#order-page .button--filled:hover {
    padding: 10px 26px;
    margin: -2px
}

@media screen and (min-width: 1920px) {
    #order-page .button--filled:hover {
        padding: 14px 34px
    }
}

@media screen and (max-width: 1024px) {
    #order-page .button--filled:hover {
        padding: 8px 16px;
        margin: 0
    }
}

.services-page {
    display: flex;
    flex-direction: column;
    row-gap: 48px;
    padding-bottom: 48px;
    background: #f0f0f0
}

@media screen and (min-width: 1920px) {
    .services-page {
        row-gap: 32px;
        align-items: center
    }
}

@media screen and (max-width: 1024px) {
    .services-page {
        row-gap: 40px;
        padding-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .services-page {
        row-gap: 24px;
        padding-bottom: 24px
    }
}

.services-page .text-block {
    margin: 0;
    padding: 32px 24px 8px
}

@media screen and (max-width: 768px) {
    .services-page .text-block {
        padding: 24px 16px 0
    }
}

.services-page .text-block__row {
    gap: 32px
}

@media screen and (min-width: 1920px) {
    .services-page .text-block__row {
        column-gap: 40px
    }
}

@media screen and (max-width: 1024px) {
    .services-page .text-block__row {
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .services-page .text-block__row {
        row-gap: 0
    }
}

.services-page .text-block .text-block__item {
    max-width: 46%
}

@media screen and (max-width: 768px) {
    .services-page .text-block .text-block__item {
        max-width: 100%
    }
}

.services-page .text-block .text-block__item-description {
    margin-bottom: 32px
}

@media screen and (max-width: 1024px) {
    .services-page .text-block .text-block__item-description {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .services-page .text-block .text-block__item-description {
        font-size: 14px;
        line-height: 20px
    }
}

.services-page .text-block h2 {
    margin-bottom: 48px
}

@media screen and (max-width: 1024px) {
    .services-page .text-block h2 {
        margin-bottom: 32px;
        font-size: 24px;
        line-height: 28px
    }
}

@media screen and (max-width: 768px) {
    .services-page .text-block h2 {
        margin-bottom: 24px;
        font-size: 18px;
        line-height: 20px
    }
}

.services-page .text-block h3 {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 8px
}

@media screen and (min-width: 1920px) {
    .services-page .text-block h3 {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .services-page .text-block h3 {
        font-size: 16px;
        line-height: 20px
    }
}

.services {
    padding: 48px;
    background: #fff;
    border-radius: 3px
}

@media screen and (max-width: 1024px) {
    .services {
        padding: 40px
    }
}

@media screen and (max-width: 880px) {
    .services {
        padding-inline: 0
    }
}

.services__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 36px;
    color: #000;
    width: 70%;
    text-align: center;
    margin: 0 auto 24px
}

@media screen and (min-width: 1920px) {
    .services__title {
        font-size: 40px;
        line-height: 48px;
        margin-bottom: 32px
    }
}

@media screen and (max-width: 1024px) {
    .services__title {
        width: 100%;
        margin-bottom: 16px
    }
}

@media screen and (max-width: 880px) {
    .services__title {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 24px;
        padding-inline: 8px
    }
}

.services__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 48px;
    margin-top: 48px
}

@media screen and (max-width: 1024px) {
    .services__container {
        margin-top: 40px;
        row-gap: 32px;
        column-gap: 40px
    }
}

@media screen and (max-width: 880px) {
    .services__container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        grid-template-columns: unset;
        gap: 24px;
        margin-top: 24px;
        padding-inline: 8px
    }
}

.services__text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #151514;
    word-break: break-word
}

@media screen and (min-width: 1920px) {
    .services__text {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 880px) {
    .services__text {
        font-size: 12px;
        line-height: 16px;
        text-align: center
    }
}

.services__item {
    display: flex;
    align-items: center;
    column-gap: 16px
}

@media screen and (min-width: 1920px) {
    .services__item {
        column-gap: 24px
    }
}

@media screen and (max-width: 1024px) {
    .services__item {
        column-gap: 8px
    }
}

@media screen and (max-width: 880px) {
    .services__item {
        flex-direction: column;
        row-gap: 8px;
        width: 128px
    }
}

.services__item img {
    min-width: 120px;
    max-width: 120px;
    min-height: 96px;
    max-height: 96px;
    border-radius: 32px;
    background: #e2f6ff
}

@media screen and (min-width: 1920px) {
    .services__item img {
        min-width: 150px;
        max-width: 150px;
        min-height: 120px;
        max-height: 120px
    }
}

@media screen and (max-width: 880px) {
    .services__item img {
        min-width: 128px;
        max-width: 128px;
        min-height: 70px;
        max-height: 70px;
        object-fit: cover
    }
}

.services .services-page__header {
    padding: 0;
    margin: 0
}

@media screen and (max-width: 768px) {
    .services .services-page__header {
        margin-bottom: 32px
    }
}

.services-block {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 0 40px #0000001a
}

@media screen and (min-width: 1920px) {
    .services-block {
        border-radius: 40px
    }
}

@media screen and (max-width: 1024px) {
    .services-block {
        border-radius: 40px;
        margin: 0 16px
    }
}

@media screen and (max-width: 768px) {
    .services-block {
        margin: 0 8px
    }
}

.services-info {
    display: flex;
    min-height: 200px;
    max-height: 200px;
    gap: 24px;
    margin: 0 24px
}

@media screen and (min-width: 1920px) {
    .services-info {
        min-height: 287px;
        max-height: 287px
    }
}

@media screen and (max-width: 1024px) {
    .services-info {
        min-height: 150px;
        max-height: 150px;
        margin: 0 16px;
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .services-info {
        gap: 24px
    }
}

@media screen and (max-width: 680px) {
    .services-info {
        flex-direction: column;
        max-height: max-content;
        margin: 0 auto;
        padding: 0 8px;
        min-width: 300px;
        max-width: 488px
    }
}

.services-info__banner {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    padding: 0 24px;
    box-shadow: 0 2px 8px -1px #372f321a
}

@media screen and (min-width: 1920px) {
    .services-info__banner {
        padding: 0 32px
    }
}

@media screen and (max-width: 1024px) {
    .services-info__banner {
        padding: 0 16px
    }
}

@media screen and (max-width: 680px) {
    .services-info__banner {
        width: 100%;
        min-height: 144px;
        padding: 0 20px
    }
}

.services-info__banner img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.services-info__title {
    font-family: Headline Base;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    width: 70%;
    text-align: center;
    color: #151514;
    z-index: 1
}

@media screen and (min-width: 1920px) {
    .services-info__title {
        font-size: 36px;
        line-height: 48px
    }
}

@media screen and (max-width: 1024px) {
    .services-info__title {
        width: 100%
    }
}

@media screen and (max-width: 768px) {
    .services-info__title {
        font-size: 18px;
        line-height: 20px
    }
}

.devices-search__icon-date {
    height: 24px !important
}

@media screen and (min-width: 1920px) {
    .devices-search__icon-date {
        height: 26px !important
    }
}

@media screen and (max-width: 768px) {
    .devices-search__icon-date {
        height: 16px !important
    }
}

.btn-add-request {
    padding: 18px 24px !important;
    border-radius: 16px !important;
    transition: none !important;
    width: unset !important;
    font-weight: 600 !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
    background: #58c7f7 !important
}

@media screen and (min-width: 1361px) and (max-width: 1919px) {
    .btn-add-request {
        padding-top: clamp(18px, 18px + (100vw - 1360px) * .0107, 24px) !important;
        padding-bottom: clamp(18px, 18px + (100vw - 1360px) * .0107, 24px) !important;
        padding-left: clamp(24px, 24px + (100vw - 1360px) * .5714, 56px) !important;
        padding-right: clamp(24px, 24px + (100vw - 1360px) * .5714, 56px) !important
    }
}

@media screen and (min-width: 1920px) {
    .btn-add-request {
        padding: 24px 56px !important;
        height: 86px !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .btn-add-request {
        padding-top: clamp(16px, 16px + (100vw - 424px) * .0267, 32px) !important;
        padding-bottom: clamp(16px, 16px + (100vw - 424px) * .0267, 32px) !important;
        padding-left: clamp(16px, 16px + (100vw - 424px) * .0267, 32px) !important;
        padding-right: clamp(16px, 16px + (100vw - 424px) * .0267, 32px) !important
    }
}

@media screen and (max-width: 1024px) {
    .btn-add-request {
        width: 200px !important;
        height: 52px !important;
        padding: 16px 24px !important;
        border-radius: 16px !important;
        gap: 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important
    }
}

@media screen and (width: 1024px) {
    .btn-add-request {
        font-family: Inter, sans-serif !important;
        font-weight: 600 !important;
        font-style: normal !important;
        font-size: 14px !important;
        line-height: 20px !important;
        letter-spacing: 0 !important;
        text-align: center !important;
        vertical-align: middle !important
    }
}

@media screen and (max-width: 424px) and (min-width: 361px) {
    .btn-add-request {
        padding: 16px !important
    }
}

@media screen and (max-width: 424px) {
    .btn-add-request {
        width: 185px !important
    }
}

@media screen and (max-width: 768px) {
    .btn-add-request {
        padding: 16px !important
    }
}

.btn-add-request:hover {
    transition: none !important;
    background: #6cd3ff
}

.product-video-service,
.product-page-brand-rental,
.product-faq-reviews-service,
.product-page-instruction-service,
.product-page-tab-content-service,
.product-page-tab-content-rental {
    padding-bottom: 48px !important
}

@media screen and (min-width: 1920px) {
    .container-checkout-service {
        min-width: 1640px !important;
        max-width: 1640px !important
    }
}

@media screen and (min-width: 1920px) {
    .container-footer-checkout {
        min-width: 1640px !important;
        max-width: 1640px !important
    }
}

.services-block-container {
    display: flex;
    gap: 24px;
    margin: 0 40px;
    align-items: flex-start
}

@media screen and (min-width: 1921px) {
    .services-block-container {
        margin: 0 auto !important;
        justify-content: center !important;
        width: 1760px;
        max-width: 1760px
    }
}

@media screen and (min-width: 1920px) and (max-width: 1920px) {
    .services-block-container {
        margin: 0 80px !important;
        gap: 24px;
        align-self: flex-start
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-container {
        margin: 0 40px;
        gap: 10px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-container {
        flex-direction: row;
        margin: 0 40px;
        gap: 16px
    }
}

@media screen and (max-width: 1024px) and (min-width: 769px) {
    .services-block-container {
        flex-direction: row;
        margin: 0 24px;
        gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .services-block-container {
        flex-direction: column;
        margin: 0 16px;
        gap: 24px
    }
}

@media screen and (max-width: 424px) {
    .services-block-container {
        margin: 0 16px;
        gap: 24px
    }
}

@media screen and (max-width: 360px) {
    .services-block-container {
        margin: 0 16px;
        gap: 24px
    }
}

.services-block-repair-main {
    flex: 1 1 auto;
    width: 1279px;
    max-width: 1319px;
    margin: 0 !important;
    border-radius: 24px;
    min-height: fit-content;
    height: fit-content !important;
    position: relative;
    transition: width .3s ease, max-width .3s ease
}

@media screen and (min-width: 1920px) {
    .services-block-repair-main {
        width: 1279px;
        max-width: 2140px;
        min-height: fit-content;
        height: fit-content !important;
        margin: 0 !important;
        border-radius: 24px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-repair-main {
        flex: 1 1 auto;
        width: calc((100vw - 90px)*.737);
        max-width: 1359px;
        min-height: fit-content;
        height: fit-content !important
    }
}

@media screen and (max-width: 1359px) and (min-width: 1025px) {
    .services-block-repair-main {
        flex: 1 1 calc(100% - 339px);
        width: calc(100% - 339px);
        max-width: calc(100% - 339px);
        margin: 0 !important;
        min-height: fit-content;
        height: fit-content !important;
        border-radius: 24px
    }
}

@media screen and (width: 1360px) {
    .services-block-repair-main {
        width: 1216px !important;
        max-width: 1216px !important;
        margin: 0 auto !important;
        min-height: fit-content;
        height: fit-content !important
    }
}

@media screen and (max-width: 1024px) {
    .services-block-repair-main {
        flex: 1 1 681px;
        width: 681px;
        max-width: 681px;
        min-height: fit-content !important;
        height: fit-content !important;
        border-radius: 24px
    }
}

@media screen and (max-width: 1023px) and (min-width: 425px) {
    .services-block-repair-main {
        flex: 1 1 clamp(392px, 100vw - 343px, 681px);
        width: clamp(392px, 100vw - 343px, 681px);
        max-width: clamp(392px, 100vw - 343px, 681px);
        min-height: clamp(520px, 520px + (100vw - 424px) * .0467, 560px);
        height: fit-content !important
    }
}

@media screen and (max-width: 1023px) and (min-width: 769px) {
    .services-block-repair-main {
        flex: 1 1 clamp(392px, 100vw - 343px, 681px);
        width: clamp(392px, 100vw - 343px, 681px);
        max-width: clamp(392px, 100vw - 343px, 681px)
    }
}

@media screen and (max-width: 768px) {
    .services-block-repair-main {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
        height: fit-content !important;
        min-height: fit-content !important
    }
}

@media screen and (max-width: 424px) {
    .services-block-repair-main {
        width: 100%;
        max-width: 100%;
        min-height: fit-content !important;
        height: fit-content !important;
        border-radius: 16px
    }
}

@media screen and (max-width: 423px) and (min-width: 361px) {
    .services-block-repair-main {
        width: 100%;
        max-width: 100%
    }
}

@media screen and (max-width: 360px) {
    .services-block-repair-main {
        width: 100%;
        max-width: 100%;
        min-height: 618px;
        height: fit-content !important;
        border-radius: 16px
    }
}

.services-block-side {
    flex: 0 0 auto;
    width: 100%;
    max-width: 457px;
    height: 292px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    min-width: 200px;
    border-radius: 24px !important;
    box-shadow: 0 0 40px #0000001a;
    position: sticky;
    top: 160px;
    align-self: flex-start
}

@media screen and (min-width: 1920px) {
    .services-block-side {
        width: 457px;
        height: 292px;
        border-radius: 24px !important;
        top: 160px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side {
        flex: 0 0 auto;
        width: calc((100vw - 90px)*.263);
        max-width: 457px;
        height: 222px;
        border-radius: 24px !important;
        top: 136px
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side {
        position: sticky;
        top: 136px;
        width: 323px;
        max-width: 323px;
        height: 216px
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side {
        max-width: 269px;
        width: 269px;
        height: 256px;
        border-radius: 24px !important;
        top: 128px
    }
}

@media screen and (max-width: 768px) {
    .services-block-side {
        width: 100%;
        max-width: 100%;
        position: static;
        height: 206px;
        flex: 1 1 auto
    }
}

@media screen and (max-width: 424px) {
    .services-block-side {
        width: 388px;
        max-width: 388px;
        height: 236px;
        border-radius: 16px !important
    }
}

@media screen and (max-width: 423px) and (min-width: 361px) {
    .services-block-side {
        width: calc(100vw - 32px);
        max-width: calc(100vw - 32px)
    }
}

@media screen and (max-width: 360px) {
    .services-block-side {
        width: 328px;
        max-width: 328px;
        height: 236px;
        border-radius: 16px !important
    }
}

.services-block-side__content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.services-block-side__wrapper {
    width: 100%;
    height: 100%;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media screen and (min-width: 1920px) {
    .services-block-side__wrapper {
        padding: 24px;
        gap: 10px
    }
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__wrapper {
        padding: 18px;
        gap: 0
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__wrapper {
        padding: 18px;
        gap: 48px
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__wrapper {
        padding: 18px;
        gap: 48px
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__wrapper {
        padding: 24px 12px;
        gap: 24px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__wrapper {
        padding: 18px;
        gap: 0 !important;
        justify-content: flex-start !important
    }
}

@media screen and (max-width: 360px) {
    .services-block-side__wrapper {
        padding: 18px;
        gap: 48px
    }
}

.services-block-side__text {
    display: flex;
    flex-direction: column;
    gap: 16px;
    font-family: Inter, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    color: #151514;
    vertical-align: middle
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__text {
        font-size: 14px;
        line-height: 20px
    }

    .services-block-side__text p {
        margin-bottom: 16px
    }
}

.services-block-side__text p {
    margin: 0
}

.services-block-side__address-title {
    font-family: Inter, sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    color: #151514;
    margin-bottom: 0
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__address-title {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 16px
    }
}

.services-block-side__address-info {
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    color: #7f7f7f;
    margin-bottom: 0
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__address-info {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 16px
    }
}

.services-block-side__delivery-info {
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #151514;
    margin-bottom: 0
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__delivery-info {
        font-size: 14px;
        line-height: 20px
    }
}

.services-block-side__delivery-label {
    font-family: Inter, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #4dcc8c
}

@media screen and (max-width: 1919px) and (min-width: 1361px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1360px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1360px) and (min-width: 1025px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 1024px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0%
    }
}

@media screen and (max-width: 768px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 424px) {
    .services-block-side__delivery-label {
        font-size: 14px;
        line-height: 20px
    }
}

#bonuses-page .account-content {
    padding: 0
}

#bonuses-page .page-title {
    margin-bottom: 0
}

#bonuses-page .bonuses {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses {
        font-size: 22px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    #bonuses-page .bonuses {
        font-size: 13px;
        line-height: 16px
    }
}

@media screen and (max-width: 768px) {
    #bonuses-page .bonuses {
        font-size: 15px;
        line-height: 24px
    }
}

#bonuses-page .bonuses .text-editor-bonuses {
    padding: 0 32px 32px
}

@media screen and (max-width: 1359px) {
    #bonuses-page .bonuses .text-editor-bonuses {
        padding: 0 24px 24px
    }
}

@media screen and (max-width: 723px) {
    #bonuses-page .bonuses .text-editor-bonuses {
        padding: 0 16px 20px
    }
}

#bonuses-page .bonuses__img {
    display: block;
    width: 100%;
    min-height: 226px;
    max-height: 226px;
    border-radius: 24px 24px 0 0;
    margin-bottom: 0 !important
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses__img {
        min-height: 299px;
        max-height: 299px;
        border-radius: 32px 32px 0 0
    }
}

@media screen and (max-width: 1359px) {
    #bonuses-page .bonuses__img {
        min-height: 161px;
        max-height: 161px
    }
}

@media screen and (max-width: 1023px) {
    #bonuses-page .bonuses__img {
        min-height: 157px;
        max-height: 157px;
        border-radius: 16px 16px 0 0
    }
}

@media screen and (max-width: 723px) {
    #bonuses-page .bonuses__img {
        min-height: 77px;
        max-height: 77px
    }
}

#bonuses-page .bonuses__img--mobile {
    display: none
}

@media screen and (max-width: 768px) {
    #bonuses-page .bonuses__img--mobile {
        display: block
    }
}

@media screen and (max-width: 423px) {
    #bonuses-page .bonuses__img--mobile {
        height: 144px
    }
}

#bonuses-page .bonuses .bonus-info {
    font-weight: 700;
    color: #151514
}

#bonuses-page .bonuses__wrapper {
    padding: 0 32px 48px
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses__wrapper {
        padding: 0 48px 64px
    }
}

@media screen and (max-width: 1024px) {
    #bonuses-page .bonuses__wrapper {
        padding: 0 24px 24px
    }
}

@media screen and (max-width: 768px) {
    #bonuses-page .bonuses__wrapper {
        padding: 0 16px 24px
    }
}

@media screen and (max-width: 423px) {
    #bonuses-page .bonuses__wrapper {
        padding: 0 16px 24px
    }
}

#bonuses-page .bonuses__text {
    margin: 24px 0
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses__text {
        margin: 32px 0
    }
}

@media screen and (max-width: 1359px) {
    #bonuses-page .bonuses__text {
        margin-bottom: 16px;
        margin-top: 24px
    }
}

@media screen and (max-width: 1023px) {
    #bonuses-page .bonuses__text {
        margin-top: 14px;
        margin-bottom: 32px
    }
}

#bonuses-page .bonuses__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses__container {
        gap: 32px
    }
}

@media screen and (max-width: 1024px) {
    #bonuses-page .bonuses__container {
        row-gap: 16px;
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    #bonuses-page .bonuses__container {
        grid-template-columns: 1fr;
        gap: 32px
    }
}

#bonuses-page .bonuses__item {
    color: #b6b6b6
}

#bonuses-page .bonuses__title {
    font-family: Headline Base;
    font-size: 15px;
    line-height: 16px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #151514
}

@media screen and (min-width: 1920px) {
    #bonuses-page .bonuses__title {
        font-size: 22px;
        line-height: 24px;
        margin-bottom: 16px
    }
}

.container-bonus-card {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px;
    flex-wrap: wrap
}

@media screen and (min-width: 1920px) {
    .container-bonus-card {
        gap: 32px
    }
}

.container-bonus-card .bonus-card {
    display: flex;
    padding: 32px 18px 32px 14px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 14px;
    flex: 1 0 0;
    max-width: 207px;
    border-radius: 16px;
    border: 1px solid #dedede;
    background: #fff;
    max-height: 182px;
    cursor: pointer
}

@media screen and (min-width: 1920px) {
    .container-bonus-card .bonus-card {
        gap: 20px;
        border-radius: 24px;
        min-width: 264px;
        min-height: 240px
    }
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card {
        padding: 24px 12px;
        gap: 12px;
        min-width: 142px;
        max-width: 142px;
        max-height: 148px
    }
}

@media screen and (max-width: 1023px) {
    .container-bonus-card .bonus-card {
        max-width: 136px;
        min-width: 136px
    }
}

.container-bonus-card .bonus-card:hover {
    border: 1px solid #58c7f7
}

.container-bonus-card .bonus-card__value {
    display: flex;
    align-items: center;
    margin-right: 18px
}

.container-bonus-card .bonus-card__plus {
    color: #4dcc8c;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
    padding-bottom: 14px
}

@media screen and (min-width: 1920px) {
    .container-bonus-card .bonus-card__plus {
        font-size: 56px;
        line-height: 72px
    }
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card__plus {
        font-size: 32px;
        line-height: 40px
    }
}

.container-bonus-card .bonus-card__amount {
    color: #4dcc8c;
    font-size: 48px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
    padding-bottom: 16px;
    border-bottom: 1px solid #dedede
}

@media screen and (min-width: 1920px) {
    .container-bonus-card .bonus-card__amount {
        font-size: 64px;
        line-height: 72px
    }
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card__amount {
        font-size: 40px;
        line-height: 40px;
        padding-bottom: 8px
    }
}

.container-bonus-card .bonus-card__description {
    color: #151514;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 4px
}

@media screen and (min-width: 1920px) {
    .container-bonus-card .bonus-card__description {
        color: #151514;
        font-size: 22px;
        line-height: 28px;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card__description {
        font-size: 12px;
        line-height: 20px
    }
}

.container-bonus-card .bonus-card-container-action {
    display: flex;
    flex-direction: column;
    align-items: center
}

.container-bonus-card .bonus-card__action {
    display: flex;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #4da6cd;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    width: max-content
}

@media screen and (min-width: 1920px) {
    .container-bonus-card .bonus-card__action {
        font-size: 20px;
        line-height: 28px;
        gap: 6px
    }
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card__action {
        font-size: 11px;
        line-height: 16px
    }
}

.container-bonus-card .bonus-card__action svg {
    width: 14px;
    height: 14px
}

@media screen and (max-width: 1359px) {
    .container-bonus-card .bonus-card__action svg {
        width: 8px;
        height: 8px
    }
}

.inactive-card {
    opacity: .5
}

.cooperation-page__bg {
    position: relative;
    background-color: #fff;
    z-index: -1;
    padding-top: 0
}

.cooperation-page__banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 400px
}

@media screen and (min-width: 1920px) {
    .cooperation-page__banner {
        height: 450px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-page__banner {
        height: 300px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__banner {
        height: 150px
    }
}

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

.cooperation-page__title {
    font-family: Headline Base;
    font-size: 28px;
    font-weight: 500;
    line-height: 36px;
    text-align: center
}

@media screen and (min-width: 1920px) {
    .cooperation-page__title {
        font-size: 40px;
        line-height: 48px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__title {
        font-size: 20px;
        line-height: 24px
    }
}

.cooperation-page__wrapper {
    background: #f0f0f0;
    padding: 40px 0 48px
}

@media screen and (min-width: 1920px) {
    .cooperation-page__wrapper {
        padding-top: 48px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__wrapper {
        padding: 24px 0
    }
}

.cooperation-page__types {
    display: flex;
    column-gap: 32px;
    margin: 48px 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-page__types {
        column-gap: 42px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-page__types {
        margin-inline: 16px;
        column-gap: 16px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__types {
        flex-direction: column;
        row-gap: 24px;
        margin: 24px 8px
    }
}

.cooperation-page__form.services-application {
    padding: 40px 24px 48px
}

@media screen and (max-width: 768px) {
    .cooperation-page__form.services-application {
        padding: 24px 16px 32px
    }
}

.cooperation-page__form.services-application .select {
    min-width: 100%;
    max-width: 100%
}

.cooperation-page__form.services-application .select-label {
    margin: 0;
    color: #888
}

@media screen and (max-width: 1024px) {
    .cooperation-page__form.services-application .select-label {
        font-size: 12px;
        line-height: 16px
    }
}

.cooperation-page__form.services-application .select-field {
    padding: 8px 0;
    border-radius: 0;
    border-bottom: 1px solid #dedede
}

.cooperation-page__form.services-application .select-field__value {
    font-size: 16px;
    line-height: 24px
}

@media screen and (min-width: 1920px) {
    .cooperation-page__form.services-application .select-field__value {
        font-size: 24px;
        line-height: 38px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__form.services-application .select-field__value {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-page__form.services-application .select-field__list-item {
        font-size: 16px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page__form.services-application .select-field__list-item {
        font-size: 14px;
        line-height: 20px
    }
}

@media screen and (min-width: 1920px) {
    .cooperation-page__form.services-application .select svg {
        width: 24px;
        height: 16px
    }
}

.cooperation-page__form.services-application .select svg path {
    fill: #151514
}

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

    .cooperation-page__form.services-application .text-field__input,
    .cooperation-page__form.services-application .button {
        line-height: 38px
    }
}

@media screen and (min-width: 1920px) {
    .cooperation-page .services-application__textarea {
        margin-top: 48px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page .services-application__textarea {
        margin-top: 24px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-page .services-application__form {
        margin-block: 48px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page .services-application__form {
        margin-block: 24px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-page .services-application__row {
        column-gap: 24px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-page .services-application__row {
        row-gap: 16px
    }
}

.cooperation-block {
    position: relative;
    overflow: hidden;
    margin: 0 24px;
    border-radius: 24px;
    box-shadow: 0 0 40px #0000001a;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .cooperation-block {
        margin: 0 16px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-block {
        margin: 0 8px
    }
}

.cooperation-modal .modal--white {
    min-width: 60vw
}

@media screen and (max-width: 1024px) {
    .cooperation-modal .modal--white {
        min-width: 80vw
    }
}

.cooperation-modal .services-modal__text {
    font-weight: 400
}

@media screen and (min-width: 1920px) {
    .cooperation-modal .services-modal__text {
        font-size: 24px;
        line-height: 32px
    }
}

@media screen and (max-width: 1024px) {
    .cooperation-modal .services-modal__text {
        font-size: 16px
    }
}

@media screen and (max-width: 768px) {
    .cooperation-modal .services-modal__text {
        font-size: 14px
    }
}

.skeleton {
    padding-top: 32px;
    padding-bottom: 56px
}

@media screen and (max-width: 1024px) {
    .skeleton {
        padding-top: 24px;
        padding-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .skeleton {
        padding-top: 16px;
        padding-bottom: 32px
    }
}

.skeleton__wrapper-sort {
    display: flex;
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 12px
}

@media screen and (min-width: 1920px) {
    .skeleton__wrapper-sort {
        column-gap: 10px;
        row-gap: 16px
    }
}

@media screen and (max-width: 1024px) {
    .skeleton__wrapper-sort {
        column-gap: 10px;
        row-gap: 8px
    }
}

.skeleton__sort-title {
    overflow: hidden;
    position: relative;
    width: 194px;
    height: 16px;
    background-color: #dedede
}

@media screen and (min-width: 1920px) {
    .skeleton__sort-title {
        height: 24px
    }
}

@media screen and (max-width: 768px) {
    .skeleton__sort-title {
        height: 20px
    }
}

.skeleton__sort-text {
    overflow: hidden;
    position: relative;
    height: 16px;
    width: calc(100% - 202px);
    background-color: #ededed
}

@media screen and (min-width: 1920px) {
    .skeleton__sort-text {
        width: calc(100% - 204px);
        height: 24px
    }
}

@media screen and (max-width: 1024px) {
    .skeleton__sort-text {
        width: calc(100% - 204px)
    }
}

@media screen and (max-width: 768px) {
    .skeleton__sort-text {
        height: 20px;
        width: 100%
    }
}

.skeleton__sort-text:last-child {
    overflow: hidden;
    width: 398px;
    background-color: #ededed
}

@media screen and (max-width: 768px) {
    .skeleton__sort-text:last-child {
        display: none
    }
}

.skeleton__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 36px;
    gap: 24px;
    list-style: none
}

@media screen and (max-width: 1024px) {
    .skeleton__list {
        margin-top: 24px;
        gap: 12px
    }
}

@media screen and (max-width: 768px) {
    .skeleton__list {
        margin-top: 16px;
        gap: 8px
    }
}

.skeleton__list.product {
    flex-wrap: nowrap;
    justify-content: start;
    padding-bottom: 4px;
    overflow-x: auto
}

.skeleton__card {
    overflow: hidden;
    min-width: 208px;
    max-width: 208px;
    height: 328px;
    background-color: #fff
}

@media screen and (min-width: 1920px) {
    .skeleton__card {
        min-width: 270px;
        max-width: 270px;
        height: 448px
    }
}

@media screen and (max-width: 1024px) {
    .skeleton__card {
        min-width: 171px;
        max-width: 171px;
        height: 272px
    }
}

@media screen and (max-width: 768px) {
    .skeleton__card {
        min-width: 192px;
        max-width: 192px;
        height: 296px
    }
}

@media screen and (max-width: 424px) {
    .skeleton__card {
        min-width: 160px;
        max-width: 160px;
        height: 288px
    }
}

.skeleton__image-placeholder {
    position: relative;
    width: 100%;
    height: 168px;
    background-color: #ededed
}

@media screen and (min-width: 1920px) {
    .skeleton__image-placeholder {
        height: 216px
    }
}

@media screen and (max-width: 1024px) {
    .skeleton__image-placeholder {
        height: 136px
    }
}

@media screen and (max-width: 768px) {
    .skeleton__image-placeholder {
        height: 152px
    }
}

@media screen and (max-width: 424px) {
    .skeleton__image-placeholder {
        height: 128px
    }
}

.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: 16px;
    margin-bottom: 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%
    }
}

.container-index-page {
    display: flex;
    flex-direction: column;
    gap: 80px;
    padding: 80px 40px
}

@media screen and (min-width: 1920px) {
    .container-index-page {
        padding: 88px 80px;
        gap: 88px
    }
}

@media screen and (max-width: 1359px) {
    .container-index-page {
        padding: 56px 32px;
        gap: 56px
    }
}

@media screen and (max-width: 1023px) {
    .container-index-page {
        padding: 56px 28px
    }
}

@media screen and (max-width: 723px) {
    .container-index-page {
        padding: 48px 16px;
        gap: 48px
    }
}

.section-watching-index {
    position: relative
}

@media screen and (max-width: 1359px) {
    .section-watching-index {
        max-height: 401px
    }
}

@media screen and (max-width: 1023px) {
    .section-watching-index {
        max-height: 320px
    }
}

@media screen and (max-width: 723px) {
    .section-watching-index {
        max-height: 310px
    }
}

.section-index-page {
    padding-top: 24px
}

@media screen and (min-width: 1920px) {
    .section-index-page {
        padding-top: 88px
    }
}

@media screen and (max-width: 1359px) {
    .section-index-page {
        padding-top: 56px
    }
}

@media screen and (max-width: 723px) {
    .section-index-page {
        padding-top: 48px
    }
}

.sales-section,
.section-wash-slider {
    padding: 80px 40px
}

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

    .sales-section,
    .section-wash-slider {
        padding: 88px 80px
    }
}

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

    .sales-section,
    .section-wash-slider {
        padding: 56px 32px;
        min-height: 513px
    }
}

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

    .sales-section,
    .section-wash-slider {
        min-height: 432px;
        max-height: 432px;
        padding: 56px 28px
    }
}

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

    .sales-section,
    .section-wash-slider {
        padding: 48px 16px
    }
}

.card-image__photo--hover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    object-fit: cover;
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none
}

.card__image-wrapper:hover .card-image__photo--hover {
    opacity: 1
}

.card__image-wrapper:hover .card-image__photo:not(.card-image__photo--hover) {
    opacity: 0
}

.card__image-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

@media screen and (min-width: 1920px) {
    .card__image-wrapper {
        height: 294px
    }
}

.card__image-wrapper img {
    height: 100%;
    width: 100%
}

.card-article__image-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
    overflow: hidden
}

.popular-card-slider {
    display: none
}

@media screen and (max-width: 723px) {
    .popular-card-slider {
        display: block
    }
}

@media screen and (max-width: 723px) {
    .empty-container {
        display: none
    }
}

* {
    margin: 0;
    padding: 0;
    outline: none;
    box-sizing: border-box;
    font-family: Inter, sans-serif
}

body {
    overflow-x: hidden;
    background: linear-gradient(0deg, var(--Back-White, #fff) 0%, var(--Back-White, #fff) 100%), linear-gradient(180deg, #eff6fa, #f8eff6)
}

body.hidden {
    overflow: hidden
}

ul {
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0
}