/* Start:/local/templates/akumulyator_template/css/style.css?1793654130191576*/
:root {
    --dvw: min(1dvw, 14.4px);
}

@font-face {
    font-family: 'Inter';
    src: url(/local/templates/akumulyator_template/css/../fonts/Inter-b.woff2) format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url(/local/templates/akumulyator_template/css/../fonts/Inter-sb.woff2) format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url(/local/templates/akumulyator_template/css/../fonts/Inter-m.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url(/local/templates/akumulyator_template/css/../fonts/Inter-r.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Press Start';
    src: url(/local/templates/akumulyator_template/css/../fonts/PressStart-r.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DrukCyr';
    src: url(/local/templates/akumulyator_template/css/../fonts/drukwidecyr-bold.woff2) format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'icon';
    src: url(/local/templates/akumulyator_template/css/../fonts/icon.woff2) format("woff2");
    font-style: normal;
    font-display: swap;
}
:root {
    --text: #252525;
    --text-2: #fdfdfd;
    --text-opacity: #c0c0c0;
    --text-nav: #000;
    --accent-color: #ffd633;
    --border-color: #d2d2d2;
    --playcholder-color: #d2d2d2;
    --important-info: #bb1303;
    --constraction-color: #fff;
    --input-text: #0b132b;
    --pl-text: #0b132b;
    --playcholder-color: #818181;
    --footer-link-color: #888787;
    --text-bg: #ededed;
    --text-bg-2: #e4e4e4;
    --text-light: #6e6e6e;
    --text-black: #212121;
    --border: #c5c5c5;
    --range-line: #d9d9d9;
    --green: #2B9F5A;
}
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    outline: 0;
    font: normal 400 16px / 100% 'Inter', sans-serif;
    color: var(--text);
}
html,
body {
    width: 100%;
    overflow-x: clip;
    scroll-behavior: smooth;
}
html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
body {
    position: relative;
    height: 100%;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    touch-action: manipulation;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}
.arrow-l,
.arrow-r,
.bubbles {
    cursor: pointer;
    transition: .3s linear;
}
img {
    width: 100%;
    display: block;
    object-fit: cover;
}
button,
a {
    cursor: pointer;
    text-decoration: none;
    transition: color .3s linear, background-color .3s linear, box-shadow .3s linear;
}

button,
textarea,
input {
    border: none;
    outline: none;
    background: none;
}
textarea {
    appearance: none;
    resize: none;
    overflow: auto;
}
.wrapper {
    width: calc(100% - 80px);
    max-width: 1840px;
    margin: 0 auto;
}
.checkbox {
    input {
        display: none;
        &:checked {
            + label {
                &::after {
                    position: absolute;
                    left: 0;
                    width: 20px;
                    height: 20px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    border: 1px solid var(--important-info);
                    border-radius: 5px;
                    background: var(--important-info);
                    content: '\e069';
                    font-family: 'icon';
                    color: var(--constraction-color);
                    font-size: 12px;
                }
            }
        }
    }
    label {
        font-size: 20px;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 15px;
        cursor: pointer;
        position: relative;
        &::before {
            border: 1px solid var(--text-light);
            border-radius: 5px;
            width: 20px;
            height: 20px;
            content: '';
        }
    }
}
.select {
    width: 100%;
    position: relative;
    &.show {
        label {
            &::after {
                transform: rotate(180deg);
            }
        }
        .sub {
            border: 2px solid var(--important-info);
            border-radius: 0  0 10px 10px;
            box-shadow: 0 -1px 7.2px 0 var(--important-info);
        }
    }
    label {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border: 2px solid var(--important-info);
        border-radius: 10px;
        box-shadow: 0 -1px 7.2px 0 var(--important-info);
        padding: 16px 20px;
        background: var(--text-bg);
        z-index: 2;
        position: relative;
        &::after {
            content: '\e016';
            font-family: 'icon';
        }
    }
    input {
        display: none;
    }
    .sub {
        position: absolute;
        top: calc(100% - 10px);
        left: 0;
        right: 0;
        padding-top: 10px;
        z-index: 1;
        background: var(--text-bg);
        overflow: hidden;
        height: 0;
        .items {
            .item {
                padding: 10px 20px;
                cursor: pointer;
                &.selected {
                    color: var(--important-info);
                }
            }
        }
    }
}
.viewed {
    margin-bottom: 50px;
    h2 {
        font-size: 32px;
        line-height: 39px;
        font-weight: 700;
        margin-bottom: 40px;
    }
    .slides {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        .goods-snippet {
            min-width: 350px;
            max-width: 350px;
        }
    }
}
.window-background {
    position: fixed;
    inset: 0;
    background: #000000a3;
    pointer-events: none;
    z-index: -2;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: .3s linear;
    &.open {
        z-index: 9999;
        opacity: 1;
        pointer-events: all;
    }
    .window-body {
        position: relative;
        padding: 64px 44px;
        border-radius: 34px;
        background: var(--constraction-color);
        div.close {
            position: absolute;
            right: 35px;
            top: 31px;
            cursor: pointer;
            &::before {
                content: '\e062';
                font-family: 'icon';
                font-size: 19px;
                line-height: 19px;
            }
        }
    }
}
.window-background.request-call {
    .window-body {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        max-width: 559px;
        h2 {
            font-size: 37px;
            font-weight: 700;
            line-height: 52px;
            color: #000;
            text-align: center;
            margin-bottom: 22px;
        }
        form {
            display: flex;
            flex-direction: column;
            width: 100%;
            gap: 10px;
            input {
                width: 100%;
                padding: 15px 30px;
                border-radius: 10px;
                border: 1px solid var(--border);
                font-size: 16px;
                font-weight: 500;
                line-height: 19px;
                &::placeholder {
                    font-size: 16px;
                    font-weight: 500;
                    line-height: 19px;
                }
            }
            label {
                position: relative;
                img {
                    position: absolute;
                    left: 30px;
                    top: 15px;
                    max-width: 20px;
                }
                input {
                    padding-left: 61px;
                }
            }
            button {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 100%;
                padding: 18px;
                margin-bottom: 10px;
                background: var(--accent-color);
                border-radius: 10px;
                box-shadow: 0px 4px 37.9px 0px var(--accent-color);
                font-size: 17px;
                line-height: 23px;
                font-weight: 700;
            }
            p {
                font-size: 14px;
                font-weight: 500;
                line-height: 17px;
                color: #878787;
                text-align: center;
                a {
                    font-size: inherit;
                    font-weight: inherit;
                    line-height: inherit;
                    color: inherit;
                    text-decoration: underline;
                }
            }
        }
    }
}
.window-background.thanks {
    .window-body {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: 559px;
        padding: 85px 30px;
        h2 {
            margin-bottom: 36px;
            font-size: 37px;
            font-weight: 700;
            line-height: 51px;
        }
        p {
            font-size: 20px;
            font-weight: 500;
            text-align: center;
            line-height: 27px;
            margin-bottom: 56px;
        } 
        button {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            max-width: 258px;
            padding: 18px;
            background: #2b9f5a;
            border-radius: 10px;
            box-shadow: 0px 4px 37.9px 0px #2b9f5a;
            font-size: 17px;
            font-weight: 700;
            line-height: 23px;
            color: var(--constraction-color);
        }
    }
}
.add-cart-success {
	position: fixed;
	right: 30px;
	bottom: 30px;
	padding: 10px 20px;
	background: rgba(0, 0, 0, 0.65);
	display: flex;
	align-items: center;
	gap: 16px;
	max-width: 300px;
	opacity: 0;
	transition: .3s linear;
	pointer-events: none;
	z-index: 100;
	p {
		color: var(--accent-color);
	}
	&::before {
		font-family: 'icon';
		content: '\e069';
		font-size: 24px;
		line-height: 1;
		color: var(--accent-color);
	}
	&.active {
		animation: show 3s linear;
	}
}
@keyframes show {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 1;
	}
	80% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
.window-background.click-bue .window-body {
    max-width: 560px;
    width: 100%;
    border-radius: 34px;
    overflow: auto;
    max-height: calc(100dvh - 20px);
    padding: 30px 45px 72px;
    h2 {
        font-size: 37px;
        line-height: 52px;
        font-weight: 700;
        color: #000;
        margin-bottom: 20px;
        text-align: center;
    }
    & > p {
        font-size: 21px;
        line-height: 25px;
        font-weight: 500;
        margin-bottom: 3px;
        color: #000;
    }
    .img {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
        max-width: 240px;
        aspect-ratio: 1/1;
        img {
            display: block;
        }
    }
    span.price {
        display: block;
        font-size: 21px;
        font-weight: 700;
        line-height: 29px;
        color: #000;
        margin-bottom: 20px;
        &.old {
            font-size: 18px;
            line-height: 25px;
            font-weight: 400;
            color: #6c6c6c;
            margin-bottom: 4px;
            text-decoration: line-through;
        }
    }
    form {
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 40px;
        input {
            width: 100%;
            padding: 15px 30px;
            border-radius: 10px;
            border: 1px solid #c5c5c5;
            font-size: 16px;
            font-weight: 500;
            line-height: 19px;
            color: #252525;
            &::placeholder {
                font-size: 16px;
                font-weight: 500;
                line-height: 19px;
                color: #252525;
            }
        }
        label {
            position: relative;
            img {
                display: block;
                position: absolute;
                left: 30px;
                top: 15px;
                max-width: 20px;
            }
            input {
                padding-left: 61px;
            }
        }
        button {
            display: flex;
            justify-content: center;
            align-items: center;
            background: var(--accent-color);
            box-shadow: 0px 4px 37.9px 0px #ffd633;
            border-radius: 10px;
            margin: 10px 0;
            padding: 18px;
            font-size: 17px;
            line-height: 23px;
            font-weight: 700;
            color: #000;
        }
        p {
            font-size: 14px;
            line-height: 17px;
            color: #878787;
            font-weight: 500;
            text-align: center;
            a {
                font-size: inherit;
                line-height: inherit;
                font-weight: inherit;
                color: inherit;
                text-decoration: underline;
            }
        }
    }
    .installment-block {
        h3 {
            font-size: 27px;
            font-weight: 700;
            line-height: 33px;
            max-width: 320px;
            margin-bottom: 5px;
        }
        & > p {
            font-size: 15px;
            line-height: 19px;
            color: #626262;
            margin-bottom: 15px;
        }
        .payments {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 10px;
            margin-bottom: 20px;
            .item {
                display: flex;
                flex-direction: column;
                gap: 6px;
                .line {
                    height: 5px;
                    background: #d9d9d9;
                    border-radius: 1000px;
                }
                p {
                    font-size: 10px;
                    line-height: 12px;
                    font-weight: 700;
                    color: #000;
                }
                &:first-child .line {
                    background: #2b9f5a;
                }
            }
        }
        .list {
            display: flex;
            gap: 56px;
            margin-bottom: 14px;
            p {
                font-size: 17px;
                line-height: 21px;
                font-weight: 500;
                color: #626262;
            }
        }
        .cards {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            max-width: 374px;
            gap: 7px;
        }
    }
}
header {
    position: sticky;
    top: 0;
    z-index: 999;
    background: var(--constraction-color);
    transition: box-shadow .25s ease;
    .top {
        padding: 22px 0;
        background: var(--accent-color);
        max-height: 80px;
        overflow: hidden;
        transition: max-height .28s ease, padding .28s ease, opacity .2s ease;
        .wrapper {
            display: flex;
            justify-content: space-between;
            align-items: center;
            .slide {
                display: contents;
            }
            p {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 14px;
                font-weight: 600;
                margin: 0;
                &::before {
                    content: '\e001';
                    font-family: 'icon';
                    font-size: 22px;
                    font-weight: 400;
                }
                &:nth-child(2)::before {
                    content: '\e002';
                    font-size: 18px;
                }
                &:nth-child(3)::before {
                    content: '\e003';
                }
                &:nth-child(4)::before {
                    content: '\e004';
                }
                &:nth-child(5)::before {
                    content: '\e005';
                }
            }
        }
    }
    .center {
        padding: 20px 0px;
        border-bottom: 1px solid var(--border-color);
        background: var(--constraction-color);
        transition: padding .28s ease;
        .wrapper {
            display: flex;
            align-items: center; 
            .burger {
                position: relative;
                display: none;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                width: 22px;
                height: 20px;
                gap: 4px;
                &::after, &::before, span {
                    width: 22px;
                    height: 2px;
                    background-color: #173551;
                    border-radius: 4px;
                    transition: transform .2s linear;
                }
                &::after, &::before {
                    content: '';
                }
            }
            a.logo {
                display: flex;
                max-width: 105px;
                margin-right: 20px;
                transition: max-width .28s ease;
                img {
                    width: 100%;
                }
            }
            .form-wrapper {
                display: contents;
                button.open-form {
                    display: none;
                }
                form {
                    display: grid;
                    grid-template-columns: 1fr 55px;
                    width: 100%;
                    max-width: 389px;
                    margin-right: 41px;
                    border-radius: 10px;
                    border: 1px solid var(--border-color);
                    overflow: hidden;
                    input {
                        padding: 18px 30px;
                        padding-right: 0;
                        &::placeholder {
                            font-size: 16px;
                            color: var(--playcholder-color);
                        }
                    }
                    button {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 55px;
                        height: 55px;
                        min-height: 100%;
                        background: var(--accent-color);
                        &::before {
                            content: '\e007';
                            font-family: 'icon';
                            font-size: 20px;
                            line-height: 20px;
                        }
                    }
                }
            }
            .info {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 7px;
                max-width: 285px;
                margin-right: 40px;
                padding-top: 5px;
                span {
                    display: flex;
                    font-size: 16px;
                    font-weight: 700;
                    line-height: 100%;
                    letter-spacing: -0.4px;
                    color: var(--important-info);
                    text-align: center;
                }
                p {
                    max-width: 213px;
                    text-align: center;
                    font-size: 14px;
                    font-weight: 700;
                    line-height: 17px;
                }
            }
            .social {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 12px;
                margin-right: 40px;
                .list {
                    display: flex;
                    gap: 5px;
                    a {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 30px;
                        height: 30px;
                        border-radius: 50%;
                        transition: all 0.3s ease;
                        &::before {
                            display: flex;
                            font-family: 'icon';
                            font-size: 16px;
                            line-height: 16px;
                            color: #fff;
                            font-weight: 400;
                        }
                        &.telegram {
                            background: #2f89ce;
                            &::before {
                                content: '\e008';
                                margin-right: 2px;
                            }
                        }
                        &.whatsapp {
                            background: #48c95f;
                            &::before {
                                content: '\e009';
                                margin-left: 1px;
                            }
                        }
                        &.viber {
                            background: #7c509a;
                            &::before {
                                content: '\e010';
                                margin-left: 1px;
                            }
                        }
                        &.inst {
                            background: linear-gradient(43.94deg, #eea054 16.16%, #d64763 50.11%, #b62a99 83.68%);
                            &::before {
                                content: '\e011';
                                font-size: 13px;
                                margin-left: 1px;
                            }
                        }
                        &.mir {
                            background: #f59124;
                            &::before {
                                content: '\e012';
                                font-size: 13px;
                            }
                        }
                    }
                }
                p {
                    max-width: 144px;
                    font-size: 14px;
                    line-height: 17px;
                    text-align: center;
                    text-shadow: 0px 0px 6px #252525ad;
                    animation: pulseGlow 2s ease-in-out infinite;
                }
            }
            .phone {
                display: flex;
                flex-direction: column;
                align-items: center;
                margin-right: 42px;
                a {
                    display: flex;
                    align-items: center;
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 22px;
                    white-space: nowrap;
                    transition: .3s linear;
                    span {
                        margin-right: 10px;
                        font-size: inherit;
                        font-weight: inherit;
                        line-height: inherit;
                        letter-spacing: inherit;
                        color: var(--text-opacity);
                        white-space: nowrap;
                        transition: .3s linear;
                    }
                    &::before {
                        content: '';
                        display: flex;
                        width: 17px;
                        height: 17px;
                        margin-right: 12px;
                    }
                    &.mts::before {
                        background: url(/local/templates/akumulyator_template/css/../images/mts-logo.svg) center / 100% 100% no-repeat;
                    }
                    &.a1::before {
                        background: url(/local/templates/akumulyator_template/css/../images/a1-logo.svg) center / 100% 100% no-repeat;
                    }
                }
            }
            .order-call {
                display: flex;
                flex-direction: column;
                gap: 6px;
                align-items: center;
                margin-right: auto;
                .btn {
                    display: flex;
                    align-items: center;
                    gap: 16px;
                    box-shadow: 0px 0px 11.68px 0px #ffd633a1;
                    background: var(--accent-color);
                    padding: 10px 19px;
                    border-radius: 9px;
                    font-size: 14px;
                    font-weight: 700;
                    transition: .3s linear;
                    position: relative;
                    z-index: 2;
                    &::after {
                        content: '';
                        position: absolute;
                        inset: 0;
                        background: #ffce05;
                        border-radius: inherit;
                        z-index: -1;
                        opacity: 0;
                        transition: .3s linear;
                    }
                    &::before {
                        content: '\e013';
                        font-family: 'icon';
                        font-weight: 400;
                        font-size: 19px;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 26px;
                        height: 26px;
                    }
                }
                span {
                    font-size: 12px;
                    line-height: 15px;
                }
            }
            .btns {
                display: flex;
                align-items: center;
                gap: 20px;
                a.phone-btn {
                    display: none;
                    justify-content: center;
                    align-items: center;
                    width: 17px;
                    height: 17px;
                    &::before {
                        content: '\e013';
                        font-family: 'icon';
                        font-size: 17px;
                    }
                }
                a {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    &::before {
                        font-family: 'icon';
                        font-weight: 400;
                    }
                }
                .compare {
                    width: 34px;
                    height: 29px;
                    &::before {
                        content: '\e014';
                        font-size: 34px;
                    }
                }
                .favorite {
                    width: 31px;
                    height: 24px;
                    &::before {
                        content: '\e015';
                        font-size: 31px;
                    }
                }
                .cart {
                    gap: 5px;
                    padding: 13px 20px;
                    border: 1px solid var(--border-color);
                    border-radius: 10px;
                    position: relative;
                    font-size: 14px;
                    font-weight: 700;
                    line-height: 17px;
                    span {
                        position: absolute;
                        top: 10px;
                        left: 45px;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        padding: 2px;
                        font-size: 12px;
                        font-weight: 700;
                        color: var(--text-2);
                        border-radius: 50%;
                        background: var(--important-info);
                    }
                    &::before {
                        content: '\e006';
                        font-size: 33px;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 40px;
                        height: 40px;
                    }
                }
            }
        }
    }
    .bottom {
        display: flex;
        align-items: center;
        gap: 20px;
        padding: 20px 0px;
        background: var(--constraction-color);
        .catalog {
            position: relative;
            z-index: 2;
            & > button {
                display: flex;
                align-items: center;
                padding: 13px 33px 15px 17px;
                background: var(--accent-color);
                border-radius: 9px;
                font-size: 15px;
                font-weight: 700;
                line-height: 18px;
                position: relative;
                z-index: 2;
                &::before {
                    content: '';
                    position: absolute;
                    inset: 0;
                    background: #ffce05;
                    border-radius: inherit;
                    z-index: -1;
                    opacity: 0;
                    transition: .3s linear;
                }
                .burger {
                    display: flex;
                    margin-right: 17px;
                    width: 22px;
                    height: 2px;
                    position: relative;
                    background: var(--text);
                    &::before, &::after {
                        content: '';
                        position: absolute;
                        left: 0;
                        right: 0;
                        height: 2px;
                        background: var(--text)
                    }
                    &::before {
                        top: -6px;
                    }
                    &::after {
                        bottom: -6px;
                    }
                }
                &::after {
                    content: '\e016';
                    font-family: 'icon';
                    font-size: 12px;
                    display: flex;
                    margin-left: 30px;
                }
            }
            & > span {
                position: absolute;
                z-index: 2;
                top: -14px;
                right: -61px;
                padding: 3px 15px;
                background: var(--important-info);
                font-size: 12px;
                font-weight: 700;
                line-height: 15px;
                color: var(--text-2);
                &::before {
                    content: '';
                    position: absolute;
                    width: 20px;
                    height: 20px;
                    transform: rotate(45deg);
                    background: var(--important-info);
                    bottom: -4px;
                    z-index: -1;
               }
            }
            .catalog-menu {
                position: absolute;
                top: calc(100% + 20px);
                left: 0;
                width: 1005px;
                z-index: -2;
                display: flex;
                justify-content: center;
                align-items: center;
                opacity: 0;
                transition: .3s linear;
                pointer-events: none;
                &.open {
                    z-index: 9999;
                    opacity: 1;
                    pointer-events: all;
                }
                .window-body {
                    display: grid;
                    grid-template-columns: 305px minmax(0, 1fr);
                    grid-template-rows: minmax(0, 1fr);
                    gap: 55px;
                    width: 100%;
                    max-width: 1007px;
                    border-radius: 34px;
                    padding: 64px 44px;
                    max-height: min(530px, calc(100dvh - 220px));
                    position: relative;
                    background: var(--constraction-color);
                    overflow: hidden;
                    align-items: stretch;
                    div.close {
                        position: absolute;
                        right: 35px;
                        top: 31px;
                        cursor: pointer;
                        &::before {
                            content: '\e062';
                            font-family: 'icon';
                            font-size: 19px;
                            line-height: 19px;
                        }
                    }
                    .mobile-head, .mobile-block {
                        display: none;
                    }
                    .tabs {
                        display: flex;
                        flex-direction: column;
                        gap: 15px;
                        min-height: 0;
                        overflow: auto;
                        p, & > a {
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            padding-bottom: 15px;
                            border-bottom: 1px solid #dfdfdf;
                            padding-left: 4px;
                            padding-right: 7px;
                        }
                        a {
                            font-size: 15px;
                            font-weight: 700;
                            line-height: 18px;
                            transition: .3s linear;
                        }
                        .mobile {
                            display: none;
                        }
                        .selected {
                            &::after, a {
                                color: var(--important-info);
                            }   
                        }
                        p::after {
                            content: '\e016';
                            font-family: 'icon';
                            font-size: 12px;
                            font-weight: 500;
                            transform: rotate(-90deg);
                        }
                    }
                    .blocks {
                        min-height: 0;
                        overflow: hidden;
                        .block {
                            opacity: 0;
                            display: flex;
                            flex-direction: column;
                            gap: 30px;
                            transition: opacity .4s linear;
                            max-height: 0;
                            overflow: hidden;
                            &::-webkit-scrollbar {
                                width: 8px;
                            }
                            &::-webkit-scrollbar-thumb {
                                border-radius: 100px;
                                background: #c5c5c5;
                            }
                            &.active {
                                max-height: 100%;
                                height: 100%;
                                overflow: auto;
                                opacity: 1;
                            }
                            .mobile-title {
                                display: none;
                            }
                            .chapter:last-child {
                                padding-bottom: 10px;
                            }
                            .chapter {
                                .links > span.more ~ *,
                                .links > span.hide {
                                    display: none;
                                }
                                &.show-more {
                                    .links > span.more {
                                        display: none;
                                    }
                                    .links > span.more ~ * {
                                        display: block;
                                    }
                                    .links > span.hide {
                                        display: block;
                                    }
                                }
                            }
                            p.title {
                                padding-bottom: 15px;
                                padding-left: 0;
                                border-bottom: 1px solid #dfdfdf;
                                font-size: 15px;
                                line-height: 18px;
                                font-weight: 700;
                                margin-bottom: 15px;
                                a {
                                    font-size: inherit;
                                    line-height: inherit;
                                    font-weight: inherit;
                                }
                            }
                            .links {
                                display: grid;
                                grid-template-columns: repeat(5, minmax(0, 1fr));
                                column-gap: 24px;
                                row-gap: 15px;
                                padding: 0;
                                .mobile-title {
                                    display: none;
                                }
                                a, span {
                                    font-size: 15px;
                                    line-height: 18px;
                                    color: #666;
                                    cursor: pointer;
                                    transition: .3s linear;
                                    text-align: left;
                                    white-space: nowrap;
                                    overflow: hidden;
                                    text-overflow: ellipsis;
                                }
                                span.more,
                                span.hide {
                                    font-weight: 600;
                                }
                            }
                        }
                    }
                }
            }
        }
        .services {
            position: relative;
            button {
                display: flex;
                align-items: center;
                padding: 10px 26px 12px 17px;
                background: var(--text);
                border: 2px solid var(--text);
                border-radius: 9px;
                font-size: 15px;
                font-weight: 700;
                line-height: 18px;
                color: var(--accent-color);
                transition: .3s linear;
                &::before {
                    content: '\e018';
                    font-family: 'icon';
                    font-size: 22px;
                    font-weight: 400;
                    display: flex;
                    margin-right: 14px;
                }
                &::after {
                    content: '\e016';
                    font-family: 'icon';
                    font-size: 12px;
                    display: flex;
                    margin-left: 25px;
                }
            }
        }
        .delivery {
            position: relative;
            button {
                display: flex;
                align-items: center;
                padding: 10px 17px 12px 17px;
                background: var(--text);
                border-radius: 9px;
                border: 2px solid var(--text);
                font-size: 15px;
                font-weight: 700;
                line-height: 18px;
                color: var(--accent-color);
                transition: .3s linear;
                &::before {
                    content: '\e002';
                    font-family: 'icon';
                    font-size: 14px;
                    font-weight: 400;
                    display: flex;
                    margin-right: 12px;
                }
                &::after {
                    content: '\e016';
                    font-family: 'icon';
                    font-size: 12px;
                    display: flex;
                    margin-left: 15px;
                }
            }
        }
        .services  .sub-menu, 
        .delivery .sub-menu {
            position: absolute;
            left: 0;
            top: calc(100% + 10px);
            z-index: 99;
            display: flex;
            flex-direction: column;
            gap: 10px;
            background: var(--constraction-color);
            padding: 0px 30px;
            border-radius: 10px;
            box-shadow: 0px 4px 14.4px 0px hsla(0, 0%, 0%, 0);
            max-height: 200px;
            pointer-events: none;
            opacity: 0;
            overflow: hidden;
            transition: .4s linear;
            &.open {
                opacity: 1;
                pointer-events: all;
                box-shadow: 0px 4px 14.4px 0px hsla(0, 0%, 0%, 0.251);
            }
            a {
                white-space: nowrap;
                font-size: 15px;
                font-weight: 700;
                line-height: 18px;
                transition: .3s linear;
                &:first-child {
                    margin-top: 20px;
                }
                &:last-child {
                    margin-bottom: 22px;
                }
            }
        }
        .shops {
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 10px 55px 14px 20px;
            font-size: 15px;
            font-weight: 700;
            border-radius: 9px;
            &::before {
                content: '\e017';
                font-family: 'icon';
                font-size: 22px;
                font-weight: 400;
            }
        }
        nav {
            display: flex;
            align-items: center;
            gap: 40px;
            margin-left: auto;
            a {
                font-size: 15px;
                font-weight: 600;
                line-height: 18px;
                color: var(--text-nav);
                transition: .3s linear;
            }
        }
    }
}
@keyframes pulse {
    0% { 
        box-shadow: 0 0 0 0 rgba(0,0,0,0.3); 
    }
    50% { 
        box-shadow: 0 0 0 5px rgba(0,0,0,0); 
    }
    100% { 
        box-shadow: 0 0 0 0 rgba(0,0,0,0); 
    }
}
@keyframes pulseGlow {
  0%, 100% {
    text-shadow: 0px 0px 6px #252525ad;
    transform: scale(1);
  }
  50% {
    text-shadow: 0px 0px 20px #252525ad, 0px 0px 30px #252525ad;
    transform: scale(1.05);
  }
}
.goods-snippet {
    border: 1px solid var(--text-opacity);
    min-width: 374px;
    max-width: 374px;
    border-radius: 10px;
    padding: 10px 0px 20px;
    box-shadow: 0px 4px 22.1px 0px hsla(0, 0%, 0%, 0);
    position: relative;
    z-index: 2;
    transition: .3s linear;
    display: flex;
    flex-direction: column;
    height: 100%;
    a {
        position: absolute;
        inset: 0;
    }
    .top {
        display: flex;
        justify-content: space-between;
        padding-left: 29px;
        margin-bottom: 10px;
        .country {
            display: grid;
            grid-template-columns: 21px max-content;
            align-items: center;
            gap: 12px;
            font-size: 17px;
            line-height: 21px;
            font-weight: 500;
        }
        .tag {
            font-size: 16px;
            line-height: 19px;
            font-weight: 500;
            color: var(--text-2);
            padding: 4px 16px 5px;
            width: 203px;
            &.sale {
                background: #bb1303;
            }
            &.selected {
                background: #0306bb;
            }
            &.good-price {
                background: #000;
            }
        }

    }
    .image-box {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 211px;
        margin-bottom: 20px;
        img {
            max-width: 230px;
        }
        button {
            position: absolute;
            right: 20px;
            z-index: 3;
            &.favorite {
                top: 13px;
                &::before {
                    content: '\e015';
                    font-family: 'icon';
                    font-size: 30px;
                }
                &.active::before {
                    color: var(--accent-color);
                }
            }
            &.compare {
                top: 48px;
                &::before {
                    content: '\e014';
                    font-family: 'icon';
                    font-size: 30px;
                }
                &.active::before {
                    color: var(--accent-color);
                }
            }
        }
    }
    h3 {
        font-size: 22px;
        font-weight: 500;
        line-height: 27px;
        padding-left: 29px;
        padding-right: 42px;
        margin-bottom: 30px;
    }
    h4 {
        padding-left: 29px;
        margin-bottom: 20px;
        font-size: 22px;
        font-weight: 700;
        line-height: 27px;
    }
    .params {
        padding: 0px 28px;
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin-bottom: 15px;
        p {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 18px;
            font-weight: 500;
            line-height: 22px;
            span {
                font-size: inherit;
                font-weight: 700;
                line-height: inherit;
            }
        }
    }
    .reviews {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 0px 28px;
        margin-bottom: 13px;
        .stars {
            display: flex;
            span {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 28px;
                height: 28px;
                &::before {
                    content: '\e059';
                    font-family: 'icon';
                    font-size: 26px;
                    color: var(--accent-color);
                }
            }
            span.no::before {
                color: #d9d9d9;
            }
        }
        & > p {
            font-size: 18px;
            font-weight: 700;
            line-height: 22px;
        }
        & span {
            margin-left: auto;
            font-size: 16px;
            font-weight: 500;
            line-height: 19px;
            color: #afadad;
        }
    }
    .card-footer {
        margin-top: auto;
        display: flex;
        flex-direction: column;
    }
    .price {
        display: flex;
        gap: 20px;
        justify-content: center;
        margin-bottom: 10px;
        p {
            font-size: 22px;
            line-height: 27px;
            font-weight: 700;
            color: var(--important-info);
            &.old {
                text-decoration: line-through;
                color: #616161;
            }
        }
    }
    .btns {
        position: relative;
        z-index: 2;
        display: flex;
        gap: 10px;
        padding: 0 28px;
        .add-cart {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 60px;
            min-width: 60px;
            height: 60px;
            border-radius: 10px;
            background: var(--accent-color);
            box-shadow: 0px 0px 18.6px 0px #ffd63391;
            position: relative;
            z-index: 2;
            &::after {
                content: '';
                position: absolute;
                inset: 0;
                background: #ffce05;
                border-radius: inherit;
                z-index: -1;
                opacity: 0;
                transition: .3s linear;
            }
            span {
                display: none;
            }
            &::before {
                content: '\e006';
                font-family: 'icon';
                font-size: 20px;
            }
        }
        .bye {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            width: 100%;
            background: #2b9f5a;
            box-shadow: 0px 0px 8.7px 0px #2b9f5a;
            border-radius: 10px;
            font-size: 15px;
            font-weight: 500;
            color: var(--text-2);
            &::before {
                content: '\e058';
                font-family: 'icon';
                font-size: 23px;
            }
        }
    }
}
.breadcrumbs span{
    color: #6E6E6E;
    font-size: 12px;
}

.breadcrumbs a{
    font-size: 12px;
}
.promo-block {
    background-color: var(--text-bg);
    padding: 23px 40px;
    border-radius: 10px;
    margin-bottom: 40px;
    .bubbles {
        display: flex;
        gap: 10px;
        margin-bottom: 5px;
        a,
        p{
            font-weight: 500;
            line-height: 19px;
        }
        p {
            color: #6E6E6E;
        }
        a {
            display: flex;
            align-items: center;
            gap: 10px;
            &:not(:last-child)::after {
                content: '\e082';
                font-family: 'icon';
                font-size: 10px;
                line-height: 12px;
            }
            &:not:first-child{
                color: #6e6e6e;
            }
        }
    }
    h1 {
        font-size: 45px;
        font-weight: 500;
        line-height: 54px;
    }
}
.form-question {
    background: var(--text);
    padding: 25px 0px 35px;
    h2 {
        font-size: 45px;
        font-weight: 500;
        line-height: 100%;
        color: var(--text-2);
        margin-bottom: 27px;
    }
    form {
        display: flex;
        align-items: center;
        gap: 10px;
        textarea, input {
            font-size: 17px;
            line-height: 21px;
            background: var(--constraction-color);
            border: 1px solid var(--text);
            border-radius: 11px;
            padding: 18px 40px 19px;
            width: 100%;
        }
        & > textarea {
            max-width: 1088px;
            height: 61px;
        }
        label {
            min-width: 333px;
            max-width: 333px;
            position: relative;
            &::before {
                content: '';
                position: absolute;
                top: 20px;
                left: 20px;
                width: 20px;
                height: 20px;
                background: url(/local/templates/akumulyator_template/css/../images/bel.svg) center / 100% 100%;
            }
            input {
                width: 100%;
                padding-left: 60px;
                font-size: 18px;
                font-weight: 700;
                color: var(--input-text);
            }
        }
        button {
            padding: 21px 80px 20px;
            border-radius: 11px;
            background: var(--accent-color);
            font-size: 16px;
            font-weight: 700;
            text-transform: uppercase;
            white-space: nowrap;
            transition: .3s linear;
            position: relative;
            z-index: 2;
            &::after {
                content: '';
                position: absolute;
                inset: 0;
                background: #ffce05;
                border-radius: inherit;
                z-index: -1;
                opacity: 0;
                transition: .3s linear;
            }
            &:hover::after {
                opacity: 1;
            }
        }
    }
}
.catalog-links {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px;
    a {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        color: var(--text);
        font-size: 15px;
        gap: 13px;
        line-height: 1.2;
        min-width: 125px;
        span {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 50px;
            height: 50px;
            &::before {
                font-family: 'icon';
                font-size: 42px;
            }
        }
    }
    .icon-1 {
        min-width: 111px;
        span::before {
            content: '\e027';
        }
    }
    .icon-2 {
        min-width: 110px;
        span::before {
            content: '\e028';
            font-size: 46px;
        }
    }
    .icon-3 {
        min-width: 126px;
        span::before {
            content: '\e029';
            font-size: 46px;
        }
    }
    .icon-4 span::before {
        content: '\e030';
    }
    .icon-5 {
        min-width: 80px;
        span::before {
            content: '\e031';
            font-size: 50px;
        }
    } 
    .icon-6 span::before {
        content: '\e032';
        font-size: 46px;
    }
    .icon-7 {
        min-width: 60px;
        span::before {
            content: '\e033';
        }
    }
    .icon-8 {
        min-width: 80px;
        span::before {
            content: '\e034';
            font-size: 38px;
        }
    }
    .icon-9 {
        span::before {
            content: '\e035';
        }
    }
    
}
.contacts-box {
    display: flex;
    padding-left: calc((100% - calc(90 * var(--dvw)) + 80px) / 2);
    gap: 32px;
    .content {
        padding: 42px 0px 54px;
        max-width: 850px;
        width: 100%;
        h2 {
            font-size: 45px;
            line-height: 100%;
            font-weight: 500;
            margin-bottom: 29px;
        }
        .info {
            display: flex;
            gap: 31px;
            margin-bottom: 74px;
            h3 {
                font-size: 22px;
                line-height: 100%;
            }
            .phone-box {
                position: relative;
                padding-left: 61px;
                padding-top: 3px;
                &::before {
                    content: '\e020';
                    font-family: 'icon';
                    font-size: 37px;
                    color: #03053d;
                    position: absolute;
                    top: 15px;
                    left: 0;
                }
                h3 {
                    margin-bottom: 18px;
                }
                .item {
                    display: flex;
                    align-items: center;
                    gap: 14px;
                    &:first-of-type {
                        margin-bottom: 5px;
                    }
                    a {
                        font-size: 22px;
                        font-weight: 600;
                        line-height: 100%;
                        white-space: nowrap;
                        color: var(--important-info);
                    }
                    span {
                        font-size: 22px;
                        font-weight: 600;
                        line-height: 100%;
                    }
                }
            }
            .adress {
                padding-left: 55px;
                position: relative;
                &::before {
                    content: '\e021';
                    font-family: 'icon';
                    font-size: 35px;
                    line-height: 36px;
                    position: absolute;
                    top: 0;
                    left: 0;
                }
                h3 {
                    font-size: 18px;
                    line-height: 100%;
                    margin-bottom: 10px;
                }
                p {
                    font-size: 18px;
                    font-weight: 600;
                    line-height: 22px;
                    color: var(--important-info);
                    max-width: 415px;
                }
            }
        }
        .items {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 9px 185px;
            max-width: 500px;
            .item {
                position: relative;
                padding-left: 44px;
                span {
                    position: absolute;
                    top: 12px;
                    left: 0;
                    &::before {
                        font-family: 'icon';
                    }
                    &.tg {
                        top: 12px;
                        &::before {
                            content: '\e023';
                            font-size: 22px;
                        }
                    }
                    &.wa {
                        &::before {
                            content: '\e026';
                            font-size: 24px;
                        }
                    }
                    &.vb {
                        &::before {
                            content: '\e025';
                            font-size: 24px;
                        }
                    }
                    &.mail {
                        &::before {
                            content: '\e022';
                            font-size: 21px;
                        }
                    }
                    &.inst {
                        &::before {
                            content: '\e024';
                            font-size: 21px;
                        }
                    }
                }
                h3 {
                    font-size: 19px;
                    line-height: 22px;
                }
                a {
                    font-size: 18px;
                    font-weight: 600;
                    line-height: 22px;
                    color: var(--important-info);
                }
            }
        }
    }
    #wrapMap {
        width: 100%;
        height: 490px;
        border: none;
        iframe {
            width: 100%;
            height: 490px;
        }
        .layout-control-group _side_right,
        .ymaps-2-1-79-copyrights-pane{
            display: none;
        }
    }
}
#wrapMap {
    position: relative;
    cursor: help;
    border-image: initial;
    iframe {
        pointer-events: none;
        border: none;
    }
}
.mapTitle {
    position: absolute;
    z-index: 1000;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 5px;
    display: block;
    padding: 5px 20px;
    border-radius: 5px;
    background: rgb(255, 255, 255);
    border-width: 1px;
    border-style: solid;
    border-color: rgb(204, 204, 204);
    border-image: initial;
}
main .title {
    display: flex;
    flex-direction: column;
    padding: 23px 40px;
    border-radius: 10px;
    background: var(--text-bg);
    margin-bottom: 40px;
    .breadcrumbs {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 15px;
        a {
            display: flex;
            align-items: center;
            gap: 10px;
            font-weight: 500;
            &::after {
                content: '\e060';
                font-family: 'icon';
                font-size: 15px;
                color: var(--text-nav);
            }
        }
        p {
            color: var(--text-light);
            font-weight: 500;
        }
    }
    h1 {
        font-size: 45px;
        font-weight: 500;
    }
}
main .wrapper {
    width: calc(calc(90 * var(--dvw)) - 80px);
    margin-left: auto;
    margin-right: auto;
}

main .title.wrapper h1{
    margin: 0;
}

@media screen and (min-width: 1280px) {
    main .title {
        padding: calc(1.1979 * var(--dvw)) calc(2.0833 * var(--dvw));
        border-radius: calc(0.5208 * var(--dvw));
        margin-bottom: calc(2.0833 * var(--dvw));
        .breadcrumbs {
            gap: calc(0.5208 * var(--dvw));
            margin-bottom: calc(0.7813 * var(--dvw));
            a {
                gap: calc(0.5208 * var(--dvw));
                &::after {
                    font-size: calc(0.7813 * var(--dvw));
                }
            }
            p {
            }
        }
        h1 {
            font-size: calc(2.3438 * var(--dvw));
        }
    }
}
@media screen and (max-width: 1279px) {
    main .wrapper {
        width: calc(calc(100 * var(--dvw)) - 40px);
    }
    main .title {
        padding: 15px 20px;
        margin-bottom: 20px;
        .breadcrumbs {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 15px;
            a {
                font-size: 14px;
                &::after {
                    font-size: 12px;
                }
            }
            p {
                font-size: 14px;
            }
        }
        h1 {
            font-size: 22px;
        }
    }
}
@media screen and (max-width: 1000px) {
    main .title {
        padding: 10px 17px;
        margin-bottom: 20px;
        .breadcrumbs {
            gap: 13px;
            margin-bottom: 5px;
            a {
                font-size: 12px;
            }
            p {
                font-size: 12px;
            }
        }
        h1 {
            font-size: 16px;
        }
    }
}
@media screen and (max-width: 767px) {
    main .title {
        margin-bottom: 10px;
    }
}

footer {
    padding-top: 50px;
    background: var(--text);
    .content {
        display: flex;
        justify-content: space-between;
        margin-bottom: 55px;
        h2 {
            font-size: 25px;
            font-weight: 600;
            line-height: 30px;
            color: var(--text-2);
        }
        nav {
            display: flex;
            justify-content: space-between;
            width: 54.2%;
            min-width: 850px;
            .col {
                display: flex;
                flex-direction: column;
                gap: 5px;
                h2 {
                    margin-bottom: 15px;
                }
                a {
                    font-size: 20px;
                    line-height: 24px;
                    color: var(--footer-link-color);
                    transition: .3s linear;
                }
            }
        }
        .info {
            max-width: 329px;
            h2 {
                margin-bottom: 10px;
            }
            p {
                font-size: 16px;
                line-height: 19px;
                color: var(--footer-link-color);
                margin-bottom: 30px;
            }
            .links {
                display: flex;
                gap: 6px;
                a {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: 40px;
                    min-width: 40px;
                    height: 40px;
                    background: var(--constraction-color);
                    border-radius: 50%;
                    &::before {
                        font-family: 'icon';                        
                    }
                    &.tg::before {
                        content: '\e023';
                        font-size: 20px;
                        padding-right: 3px;
                    }
                    &.vb::before {
                        content: '\e026';
                        font-size: 21px;
                    }
                    &.wa::before {
                        content: '\e025';
                        font-size: 23px;
                    }
                    &.inst::before {
                        content: '\e024';
                        font-size: 17px;
                    }
                    &.mail::before {
                        content: '\e022';
                        font-size: 17px;
                    }
                }
            }
        }
    }
    .img {
        max-width: 904px;
    }
}
.mobile-menu {
    display: none;
}
@media screen and (min-width: 1280px){
    .checkbox {
        input {
            &:checked {
                + label {
                    &::after {
                        width: calc(1.042 * var(--dvw));
                        height: calc(1.042 * var(--dvw));
                        border-radius: calc(0.26 * var(--dvw));
                        font-size:calc(.625 * var(--dvw));
                    }
                }
            }
        }
        label {
            font-size: calc(1.042 * var(--dvw));
            gap: calc(0.78125 * var(--dvw));
            &::before {
                border-radius: calc(0.26 * var(--dvw));
                width: calc(1.042 * var(--dvw));
                height: calc(1.042 * var(--dvw));
            }
        }
    }
    .select {
        &.show {
            .sub {
                border-radius: 0  0 calc(.5208 * var(--dvw)) calc(.5208 * var(--dvw));
            }
        }
        label {
            font-size: 14px;
            border-radius: calc(.5208 * var(--dvw));
            padding: calc(0.833 * var(--dvw)) calc(1.042 * var(--dvw));
        }
        .sub {
            top: calc(100% - calc(.5208 * var(--dvw)));
            padding-top: calc(.5208 * var(--dvw));
            .items {
                .item {
                    font-size: 14px;
                    padding: calc(.5208 * var(--dvw)) calc(1.042 * var(--dvw));
                }
            }
        }
    }
    .viewed {
        margin-bottom: calc(2.6042 * var(--dvw));
        h2 {
            font-size: calc(1.6666 * var(--dvw));
            line-height: calc(2.03125 * var(--dvw));
            margin-bottom: calc(2.083 * var(--dvw));
        }
        .slides {
            gap: calc(1.042 * var(--dvw));
            .goods-snippet {
                min-width: calc(19.229 * var(--dvw));
                max-width: calc(19.229 * var(--dvw));
            }
        }
    }
    .window-background {
        .window-body {
            padding: calc(3.33 * var(--dvw)) calc(2.29 * var(--dvw));
            border-radius: calc(1.7708 * var(--dvw));
            div.close {
                right: calc(1.8229 * var(--dvw));
                top: calc(1.6146 * var(--dvw));
                &::before {
                    font-size: calc(.98958 * var(--dvw));
                    line-height: calc(.98958 * var(--dvw));
                }
            }
        }
    }
    .window-background.request-call {
        .window-body {
            max-width: calc(29.1146 * var(--dvw));
            h2 {
                font-size: calc(1.927 * var(--dvw));
                line-height: calc(2.708 * var(--dvw));
                margin-bottom: calc(1.1458 * var(--dvw));;
            }
            form {
                gap: calc(.5208 * var(--dvw));
                input {
                    padding: calc(0.78125 * var(--dvw)) calc(1.5625 * var(--dvw));
                    border-radius: calc(.5208 * var(--dvw));
                    font-size: calc(0.833 * var(--dvw));
                    line-height: calc(.98958 * var(--dvw));
                    &::placeholder {
                        font-size: calc(0.833 * var(--dvw));
                        line-height: calc(.98958 * var(--dvw));
                    }
                }
                label {
                    img {
                        left: calc(1.5625 * var(--dvw));
                        top: calc(0.78125 * var(--dvw));
                        max-width: calc(1.042 * var(--dvw));
                    }
                    input {
                        padding-left: calc(3.177 * var(--dvw));
                    }
                }
                button {
                    padding: calc(0.9375 * var(--dvw));
                    margin-bottom: calc(.5208 * var(--dvw));
                    border-radius: calc(.5208 * var(--dvw));
                    font-size:  calc(0.885 * var(--dvw));
                    line-height: calc(1.1979 * var(--dvw));
                }
                p {
                    font-size: calc(0.7292 * var(--dvw));
                    line-height:  calc(0.885 * var(--dvw));
                }
            }
        }
    }
    .window-background.thanks {
        .window-body {
            max-width: calc(29.1146 * var(--dvw));
            padding: calc(4.427 * var(--dvw)) calc(1.5625 * var(--dvw));
            h2 {
                margin-bottom: calc(1.875 * var(--dvw));
                font-size: calc(1.927 * var(--dvw));
                line-height: calc(2.65625 * var(--dvw));
            }
            p {
                font-size: calc(1.042 * var(--dvw));
                line-height: calc(1.40625 * var(--dvw));
                margin-bottom: calc(2.91666 * var(--dvw));
            } 
            button {
                max-width: 13.4375vw;
                padding: calc(0.9375 * var(--dvw));
                border-radius: calc(.5208 * var(--dvw));
                font-size:  calc(0.885 * var(--dvw));
                line-height: calc(1.1979 * var(--dvw));
            }
        }
    }
    .add-cart-success {
        right: calc(1.5625 * var(--dvw));
        bottom: calc(1.5625 * var(--dvw));
        padding: calc(.5208 * var(--dvw)) calc(1.042 * var(--dvw));
        gap: calc(0.833 * var(--dvw));
        max-width: calc(15.625 * var(--dvw));
        &::before {
            font-size: calc(1.25 * var(--dvw));
        }
    }
    .window-background.click-bue .window-body {
        max-width: calc(29.1666 * var(--dvw));
        border-radius: calc(1.7708 * var(--dvw));
        max-height: calc(100dvh - calc(1.042 * var(--dvw)));
        padding: calc(1.5625 * var(--dvw)) calc(2.34375 * var(--dvw)) calc(3.75 * var(--dvw));
        &::-webkit-scrollbar {
            width: 0;
            height: 0;
        }
        h2 {
            font-size: calc(1.927 * var(--dvw));
            line-height: calc(2.708 * var(--dvw));
            margin-bottom: calc(1.042 * var(--dvw));
        }
        & > p {
            font-size: 1.09375vw;
            line-height: calc(1.3021 * var(--dvw));
        }
        .img {
            max-width: calc(12.5 * var(--dvw));
        }
        span.price {
            font-size: 1.09375vw;
            line-height: calc(1.5104 * var(--dvw));
            margin-bottom: calc(1.042 * var(--dvw));
            &.old {
                font-size: calc(0.9375 * var(--dvw));
                line-height: calc(1.3021 * var(--dvw));
            }
        }
        form {
            gap: calc(.5208 * var(--dvw));
            margin-bottom: calc(2.083 * var(--dvw));
            input {
                padding: calc(0.78125 * var(--dvw)) calc(1.5625 * var(--dvw));
                border-radius: calc(.5208 * var(--dvw));
                font-size: calc(0.833 * var(--dvw));
                line-height: calc(.98958 * var(--dvw));
                &::placeholder {
                    font-size: calc(0.833 * var(--dvw));
                    line-height: calc(.98958 * var(--dvw));
                }
            }
            label {
                img {
                    left: calc(1.5625 * var(--dvw));
                    top: calc(0.78125 * var(--dvw));
                    max-width: calc(1.042 * var(--dvw));
                }
                input {
                    padding-left: calc(3.177 * var(--dvw));
                }
            }
            button {
                border-radius: calc(.5208 * var(--dvw));
                margin: calc(.5208 * var(--dvw)) 0;
                padding: calc(0.9375 * var(--dvw));
                font-size:  calc(0.885 * var(--dvw));
                line-height: calc(1.1979 * var(--dvw));
            }
            p {
                font-size: calc(0.7292 * var(--dvw));
                line-height:  calc(0.885 * var(--dvw));
            }
        }
        .installment-block {
            h3 {
                font-size: calc(1.40625 * var(--dvw));
                line-height: calc(1.71875 * var(--dvw));
                max-width: calc(16.666 * var(--dvw));
                margin-bottom: calc(0.26 * var(--dvw));
            }
            & > p {
                font-size: calc(0.78125 * var(--dvw));
                line-height: calc(.98958 * var(--dvw));
                margin-bottom: calc(0.78125 * var(--dvw));
            }
            .payments {
                gap: calc(.5208 * var(--dvw));
                margin-bottom: calc(1.042 * var(--dvw));
                .item {
                    .line {
                        height: calc(0.26 * var(--dvw));
                    }
                    p {
                        font-size: calc(.5208 * var(--dvw));
                        line-height:calc(.625 * var(--dvw));
                    }
                }
            }
            .list {
                gap: calc(2.91666 * var(--dvw));
                margin-bottom: calc(0.7292 * var(--dvw));
                p {
                    font-size:  calc(0.885 * var(--dvw));
                    line-height: 1.09375vw;
                }
            }
            .cards {
                max-width: calc(19.4792 * var(--dvw));
            }
        }
    }
    header {
        .top {
            padding: calc(1.1458 * var(--dvw)) 0;
            .wrapper {
                p {
                    gap: 3px;
                    font-size: 12px;
                    &::before {
                        font-size: calc(1.1458 * var(--dvw));
                    }
                    &:nth-child(2)::before {
                        font-size: calc(0.9375 * var(--dvw));
                    }
                }
            }
        }
        .center {
            padding: calc(1.041 * var(--dvw)) 0;
            .wrapper {
                justify-content: space-between;
                .burger {
                    width: calc(1.15 * var(--dvw));
                    height: calc(1.041 * var(--dvw));
                    &::after, &::before, span {
                        width: calc(1.15 * var(--dvw));
                    }
                }
                a.logo {
                    max-width: calc(7.6389 * var(--dvw));
                }
                .form-wrapper {
                    display: flex;
                    order: 2;
                    justify-self: end;
                    margin-right: calc(1.002 * var(--dvw));
                    margin-left: auto;
                    position: relative;
                    form {
                        position: absolute;
                        max-width: 400px;
                        min-width: 400px;
                        width: 100%;
                        bottom: -8px;
                        z-index: 10;
                        height: 40px;
                        right: calc(100% + 10px);
                        background: var(--constraction-color);
                        margin-right: 0;
                        grid-template-columns: 1fr 40px;
                        opacity: 0;
                        pointer-events: none;
                        transition: .3s linear;
                        &::before {
                            content: '';
                            position: fixed;
                            top: 0;
                            left: 0px;
                            background: #000000a3;
                            width: calc(100 * var(--dvw));
                            height: 100dvh;
                            z-index: -1;
                        }
                        input {
                            height: 40px;
                            padding: 10px;
                            position: relative;
                            z-index: 3;
                            background: var(--constraction-color);
                        }
                        button {
                            width: 40px;
                            height: 40px;
                            position: relative;
                            z-index: 3;
                            &::before {
                                font-size: 16px;
                                line-height: 16px;
                            }
                        }
                    }
                    &.show {
                        form {
                            pointer-events: all;
                            opacity: 1;
                        }
                    }
                    button.open-form {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 20px;
                        height: 20px;
                        &::before {
                            content: '\e019';
                            font-family: 'icon';
                            font-size: 20px;
                            line-height: 20px;
                        }
                    }
                }
                .info {
                    gap: calc(0.365 * var(--dvw));
                    margin-left: auto;
                    
                    margin-right: calc(1.82 * var(--dvw));
                    padding-top: calc(0.26 * var(--dvw));
                    span {
                        font-size: 14px;
                    }
                    p {
                        
                        font-size: 12px;
                        line-height: 14px;
                    }
                }
                .social {
                    gap: calc(.625 * var(--dvw));
                    margin-right: calc(1.883 * var(--dvw));
                    margin-left: auto;
                    .list {
                        gap: calc(0.26 * var(--dvw));
                        a {
                            width: calc(1.5625 * var(--dvw));
                            height: calc(1.5625 * var(--dvw));
                            border-radius: 50%;
                            &::before {
                                font-size: calc(0.833 * var(--dvw));
                                line-height: calc(0.833 * var(--dvw));
                            }
                            &.inst {
                                &::before {
                                    font-size: calc(.677 * var(--dvw));
                                }
                            }
                            &.mir {
                                &::before {
                                    font-size: calc(.677 * var(--dvw));
                                }
                            }
                        }
                    }
                    p {
                        max-width: calc(7.5 * var(--dvw));
                        min-width: 150px;
                        font-size: 12px;
                        line-height:  calc(0.885 * var(--dvw));
                    }
                }
                .phone {
                    margin-right: calc(1.875 * var(--dvw));
                    margin-left: auto;
                    a {
                        font-size: 16px;
                        line-height: 18px;
                        span {
                            margin-right: calc(.5208 * var(--dvw));
                        }
                        &::before {
                            width: 14px;
                            height: 14px;
                            margin-right: 8px;
                        }
                    }
                }
                .order-call {
                    margin-right: 0;
                    margin-left: auto;
                    .btn {
                        gap: calc(0.833 * var(--dvw));
                        padding: calc(.5208 * var(--dvw)) calc(.98958 * var(--dvw));
                        font-size: 12px;
                        &::before {
                            font-size: 12px;
                            width: calc(1.3542 * var(--dvw));
                            height: calc(1.3542 * var(--dvw));
                        }
                    }
                    span {
                        font-size: 12px;
                        line-height: 14px;
                    }
                }
                .btns {
                    order: 3;
                    gap: calc(1.002 * var(--dvw));
                    justify-self: end;
                    a.phone-btn {
                        width:  calc(0.885 * var(--dvw));
                        height:  calc(0.885 * var(--dvw));
                        &::before {
                            font-size:  calc(0.885 * var(--dvw));
                        }
                    }
                    .compare {
                        width: calc(1.7708 * var(--dvw));
                        height: calc(1.5104 * var(--dvw));
                        &::before {
                            font-size: calc(1.7708 * var(--dvw));
                        }
                    }
                    .favorite {
                        width: calc(1.6146 * var(--dvw));
                        height: calc(1.25 * var(--dvw));
                        &::before {
                            font-size: calc(1.6146 * var(--dvw));
                        }
                    }
                    .cart {
                        gap: calc(0.26 * var(--dvw));
                        padding: calc(.677 * var(--dvw)) calc(1.042 * var(--dvw));
                        border-radius: calc(.5208 * var(--dvw));
                        font-size: calc(0.7292 * var(--dvw));
                        line-height:  calc(0.885 * var(--dvw));
                        span {
                            top: calc(.5208 * var(--dvw));
                            left: calc(2.34375 * var(--dvw));
                            font-size:calc(.625 * var(--dvw));
                        }
                        &::before {
                            font-size: calc(1.71875 * var(--dvw));
                            width: calc(2.083 * var(--dvw));
                            height: calc(2.083 * var(--dvw));
                        }
                    }
                }
            }
        }
        .bottom {
            gap: calc(1.042 * var(--dvw));
            padding: calc(1.042 * var(--dvw)) 0px;
            .catalog {
                & > button {
                    padding: calc(.677 * var(--dvw)) calc(1.71875 * var(--dvw)) calc(0.78125 * var(--dvw))  calc(0.885 * var(--dvw));
                    font-size: 12px;
                    
                    .burger {
                        margin-right:  calc(0.885 * var(--dvw));
                        width: calc(1.1458 * var(--dvw));;
                    }
                    &::after {
                        font-size:calc(.625 * var(--dvw));
                        margin-left: calc(1.5625 * var(--dvw));
                    }
                }
                & > span {
                    top: calc(-0.7292 * var(--dvw));
                    right: calc(-3.177 * var(--dvw));
                    padding: 3px calc(0.78125 * var(--dvw));
                    font-size: 12px;
                    line-height: calc(0.78125 * var(--dvw));
                    &::before {
                        width: calc(1.042 * var(--dvw));
                        height: calc(1.042 * var(--dvw));
                    }
                }
                .catalog-menu {
                    max-width: calc(52.44792 * var(--dvw));
                    .window-body {
                        grid-template-columns: calc(15.8854 * var(--dvw)) 1fr;
                        gap: calc(2.8646 * var(--dvw));
                        border-radius: calc(.5208 * var(--dvw));
                        padding: calc(1.5625 * var(--dvw)) calc(2.6042 * var(--dvw)) calc(3.75 * var(--dvw)) calc(1.5625 * var(--dvw));
                        max-height: 455px;
                        .tabs {
                            gap: calc(0.78125 * var(--dvw));
                            p, & > a {
                                padding-bottom: calc(0.78125 * var(--dvw));
                            }
                            a {
                                font-size: 12px;
                                line-height: 15px;
                            }
                        }
                        .blocks {
                            .block {
                                gap: calc(1.5625 * var(--dvw));
                                &.active {
                                    max-height: calc(26.0416 * var(--dvw));
                                }
                                p.title {
                                    padding-bottom: calc(0.78125 * var(--dvw));
                                    padding-left: 0;
                                    border-bottom: 1px solid #dfdfdf;
                                    font-size: 12px;
                                    line-height: 15px;
                                    margin-bottom: calc(0.78125 * var(--dvw));
                                }
                                .links {
                                    column-gap: calc(1.25 * var(--dvw));
                                    row-gap: calc(0.78125 * var(--dvw));
                                    padding: 0;
                                    a,span {
                                        font-size: 12px;
                                        line-height: 15px;
                                    }
                                }
                            }
                        }
                    }
                }
            }
            .services {
                button {
                    padding: calc(.677 * var(--dvw)) calc(1.5104 * var(--dvw)) calc(0.78125 * var(--dvw)) calc(1.042 * var(--dvw));
                    font-size: 12px;
                    line-height: 15px;
                    &::before {
                        font-size: calc(1.1458 * var(--dvw));;
                        margin-right: calc(0.7292 * var(--dvw));
                    }
                    &::after {
                        font-size: calc(.625 * var(--dvw));
                        margin-left: calc(1.3021 * var(--dvw));
                    }
                }
            }
            .delivery {
                button {
                    padding: calc(.677 * var(--dvw)) calc(1.042 * var(--dvw)) calc(0.78125 * var(--dvw)) calc(1.042 * var(--dvw));
                    font-size: 12px;
                    line-height: 15px;
                    &::before {
                        font-size: calc(0.7292 * var(--dvw));
                        margin-right:calc(.625 * var(--dvw));
                    }
                    &::after {
                        font-size:calc(.625 * var(--dvw));
                        margin-left: calc(0.78125 * var(--dvw));
                    }
                }
            }
            .services  .sub-menu, 
            .delivery .sub-menu {
                top: calc(100% + calc(.5208 * var(--dvw)));
                gap: 10px;
                padding: 0px calc(1.5625 * var(--dvw));
                border-radius: calc(.5208 * var(--dvw));
                a {
                    font-size: 12px;
                    line-height: 15px;
                    &:first-child {
                        margin-top: calc(1.042 * var(--dvw));
                    }
                    &:last-child {
                        margin-bottom: calc(1.1458 * var(--dvw));;
                    }
                }
            }
            .shops {
                gap: calc(0.7292 * var(--dvw));
                padding: calc(.5208 * var(--dvw)) calc(2.8645 * var(--dvw)) calc(0.7292 * var(--dvw)) calc(1.042 * var(--dvw));
                font-size: 12px;
                &::before {
                    font-size: calc(1.1458 * var(--dvw));;
                }
            }
            nav {
                gap: calc(2.083 * var(--dvw));
                a {
                    font-size: 14px;
                    line-height: 17px;
                }
            }
        }
    }
    .goods-snippet {
        min-width: calc(19.47916 * var(--dvw));
        max-width: calc(19.47916 * var(--dvw));
        border-radius: calc(.5208 * var(--dvw));
        padding: 5px 0px 10px;
        .top {
            padding-left: calc(1.5104 * var(--dvw));
            margin-bottom: 5px;
            .country {
                gap:calc(.625 * var(--dvw));
                font-size:  12px;
                line-height: 12px;
            }
            .tag {
                font-size:12px;
                line-height: 12px;
                padding: 4px calc(0.533 * var(--dvw)) calc(0.26 * var(--dvw));
                width: calc(10 * var(--dvw));
                white-space: nowrap;
            }

        }
        .image-box {
            height: 110px;
            margin-bottom: 10px;
            img {
                max-width: 120px;
            }
            button {
                right: calc(1.042 * var(--dvw));
                &.favorite {
                    top: calc(.677 * var(--dvw));
                    &::before {
                        font-size: calc(1.5625 * var(--dvw));
                    }
                }
                &.compare {
                    top: calc(2.5 * var(--dvw));
                    &::before {
                        font-size: calc(1.5625 * var(--dvw));
                    }
                }
            }
        }
        h3 {
            font-size: 16px;
            line-height: 17px;
            padding-left: calc(1.5104 * var(--dvw));
            padding-right: calc(2.1875 * var(--dvw));
            margin-bottom: 14px;
        }
        h4 {
            padding-left: calc(1.5104 * var(--dvw));
            margin-bottom: 8px;
            font-size: 14px;
            line-height: 17px;
        }
        .params {
            padding: 0px calc(1.4583 * var(--dvw));
            gap: 2px;
            margin-bottom: 5px;
            p {
                font-size: 12px;
                line-height: 14px;
            }
        }
        .reviews {
            gap: calc(.5208 * var(--dvw));
            padding: 0px calc(1.4583 * var(--dvw));
            margin-bottom: calc(.677 * var(--dvw));
            .stars {
                span {
                    width: 14px;
                    height: 14px;
                    &::before {
                        font-size: 14px;
                    }
                }
            }
            & > p {
                font-size: 12px;
                line-height: 14px;
            }
            & span {
                font-size: 12px;
                line-height: 14px;
            }
        }
        .price {
            gap: calc(1.042 * var(--dvw));
            margin-bottom: 5px;
            p {
                font-size: 14px;
                line-height: 17px;
            }
        }
        .btns {
            gap: calc(.5208 * var(--dvw));
            padding: 0 calc(1.4583 * var(--dvw));
            .add-cart {
                width: calc(3.125 * var(--dvw));
                min-width: calc(3.125 * var(--dvw));
                height: calc(2.5 * var(--dvw));
                border-radius: calc(.5208 * var(--dvw));
                &::before {
                    font-size: calc(1.042 * var(--dvw));
                }
            }
            .bye {
                gap: calc(.5208 * var(--dvw));
                border-radius: calc(.5208 * var(--dvw));
                font-size: 12px;
                &::before {
                    font-size: calc(1.1979 * var(--dvw));
                }
            }
        }
    }
    .promo-block {
        padding: calc(1.1979 * var(--dvw)) calc(2.083 * var(--dvw));
        border-radius: calc(.5208 * var(--dvw));
        margin-bottom: calc(2.083 * var(--dvw));
        .bubbles {
            gap: calc(.5208 * var(--dvw));
            margin-bottom: calc(0.26 * var(--dvw));
            a,
            p{
                line-height: calc(.98958 * var(--dvw));
            }
            a {
                gap: calc(.5208 * var(--dvw));
                &::after {
                    font-size: calc(.5208 * var(--dvw));
                    line-height:calc(.625 * var(--dvw));
                }
            }
        }
        h1 {
            font-size: calc(2.34375 * var(--dvw));
            line-height: calc(2.8125 * var(--dvw));
        }
    }
    .form-question {
        padding: calc(1.3021 * var(--dvw)) 0px calc(1.8229 * var(--dvw));
        h2 {
            font-size: calc(2.34375 * var(--dvw));
            margin-bottom: calc(1.40625 * var(--dvw));
        }
        form {
            gap: calc(.5208 * var(--dvw));
            textarea, input {
                font-size: 14px;
                line-height: 16px;
                padding: calc(0.9375 * var(--dvw)) calc(2.083 * var(--dvw)) calc(.98958 * var(--dvw));
                width: 100%;
            }
            & > textarea {
                max-width: calc(56.666 * var(--dvw));
                height: calc(3.177 * var(--dvw));
            }
            label {
                min-width: calc(17.34375 * var(--dvw));
                max-width: calc(17.34375 * var(--dvw));
                &::before {
                    content: '';
                    top: calc(1.042 * var(--dvw));
                    left: calc(1.042 * var(--dvw));
                    width: calc(1.042 * var(--dvw));
                    height: calc(1.042 * var(--dvw));
                }
                input {
                    padding-left: calc(3.125 * var(--dvw));
                    font-size: calc(0.9375 * var(--dvw));
                }
            }
            button {
                padding: 1.09375vw calc(4.16 * var(--dvw)) calc(1.042 * var(--dvw));
                font-size: calc(0.833 * var(--dvw));
            }
        }
    }
    .catalog-links {
        gap: calc(1.042 * var(--dvw));
        margin-bottom: calc(1.5625 * var(--dvw));
        a {
            font-size: 12px;
            gap: calc(.677 * var(--dvw));
            min-width: calc(6.510 * var(--dvw));
            span {
                width: calc(2.6042 * var(--dvw));
                height: calc(2.6042 * var(--dvw));
                &::before {
                    font-size: calc(2.1875 * var(--dvw));
                }
            }
        }
        .icon-1 {
            min-width: calc(5.7813 * var(--dvw));
        }
        .icon-2 {
            min-width: calc(5.7292 * var(--dvw));
            span::before {
                font-size: calc(2.3958 * var(--dvw))
            }
        }
        .icon-3 {
            min-width: calc(6.5625 * var(--dvw));
            span::before {
                font-size: calc(2.3958 * var(--dvw))
            }
        }
        .icon-5 {
            min-width: calc(4.1667 * var(--dvw));
            span::before {
                font-size: calc(2.6042 * var(--dvw));
            }
        } 
        .icon-6 span::before {
            font-size:  calc(2.3958 * var(--dvw));
        }
        .icon-7 {
            min-width: calc(3.1250 * var(--dvw));
        }
        .icon-8 {
            min-width: calc(4.1667 * var(--dvw));
            span::before {
                font-size: calc(1.9792 * var(--dvw))
            }
        }
    }
    .contacts-box {
        gap: calc(1.6666 * var(--dvw));
        .content {
            padding: calc(2.1875 * var(--dvw)) 0px calc(2.8125 * var(--dvw));
            max-width: calc(44.2708 * var(--dvw));
            h2 {
                font-size: calc(2.34375 * var(--dvw));
                margin-bottom: calc(1.5104 * var(--dvw));
            }
            .info {
                gap: calc(1.6146 * var(--dvw));
                margin-bottom: calc(3.8542 * var(--dvw));
                h3 {
                    font-size: calc(1.1458 * var(--dvw));;
                }
                .phone-box {
                    padding-left: calc(3.177 * var(--dvw));
                    &::before {
                        font-size: calc(1.927 * var(--dvw));
                        top: calc(0.78125 * var(--dvw));
                    }
                    h3 {
                        margin-bottom: calc(0.9375 * var(--dvw));
                    }
                    .item {
                        gap: calc(0.7292 * var(--dvw));
                        &:first-of-type {
                            margin-bottom: calc(0.26 * var(--dvw));
                        }
                        a {
                            font-size: calc(1.1458 * var(--dvw));;
                        }
                        span {
                            font-size: calc(1.1458 * var(--dvw));;
                        }
                    }
                }
                .adress {
                    padding-left: calc(2.8646 * var(--dvw));
                    &::before {
                        font-size: calc(1.8229 * var(--dvw));
                        line-height: calc(1.875 * var(--dvw));
                    }
                    h3 {
                        font-size: calc(0.9375 * var(--dvw));
                        margin-bottom: calc(.5208 * var(--dvw));
                    }
                    p {
                        font-size: calc(0.9375 * var(--dvw));
                        line-height: calc(1.1458 * var(--dvw));;
                        max-width: calc(21.6146 * var(--dvw));
                    }
                }
            }
            .items {
                gap: calc(0.4688 * var(--dvw)) calc(9.6354 * var(--dvw));
                max-width: calc(26.0417 * var(--dvw));
                .item {
                    padding-left: calc(2.2917 * var(--dvw));
                    span {
                        top:calc(.625 * var(--dvw));
                        left: 0;
                        &.tg {
                            top:calc(.625 * var(--dvw));
                            &::before {
                                font-size: calc(1.1458 * var(--dvw));;
                            }
                        }
                        &.wa {
                            &::before {
                                font-size: calc(1.25 * var(--dvw));
                            }
                        }
                        &.vb {
                            &::before {
                                font-size: calc(1.25 * var(--dvw));
                            }
                        }
                        &.mail {
                            &::before {
                                font-size: 1.09375vw;
                            }
                        }
                        &.inst {
                            &::before {
                                font-size: 1.09375vw;
                            }
                        }
                    }
                    h3 {
                        font-size: calc(.98958 * var(--dvw));
                        line-height: calc(1.1458 * var(--dvw));;
                    }
                    a {
                        font-size: calc(0.9375 * var(--dvw));
                        line-height: calc(1.1458 * var(--dvw));;
                    }
                }
            }
        }
        #wrapMap {
            height: calc(25.5208 * var(--dvw));
            iframe {
                height: calc(25.5208 * var(--dvw));
            }
        }
    }
    .mapTitle {
        box-shadow: rgba(0, 0, 0, 0.25) 0px 0px calc(0.26 * var(--dvw));
        padding: calc(0.26 * var(--dvw)) calc(1.042 * var(--dvw));
        border-radius: calc(0.26 * var(--dvw));
    }
    footer {
        padding-top: calc(2.6042 * var(--dvw));
        .content {
            margin-bottom: calc(2.8646 * var(--dvw));
            h2 {
                font-size: calc(1.3021 * var(--dvw));
                line-height: calc(1.5625 * var(--dvw));
            }
            nav {
                min-width: calc(44.2708 * var(--dvw));
                .col {
                    gap: calc(0.26 * var(--dvw));
                    h2 {
                        margin-bottom: calc(0.78125 * var(--dvw));
                    }
                    a {
                        font-size: calc(1.042 * var(--dvw));
                        line-height: calc(1.25 * var(--dvw));
                    }
                }
            }
            .info {
                max-width: calc(17.1354 * var(--dvw));
                h2 {
                    margin-bottom: calc(.5208 * var(--dvw));
                }
                p {
                    font-size: 12px;
                    line-height: 14px;
                    margin-bottom: calc(1.5625 * var(--dvw));
                }
                .links {
                    a {
                        width: calc(2.083 * var(--dvw));
                        min-width: calc(2.083 * var(--dvw));
                        height: calc(2.083 * var(--dvw));
                        &.tg::before {
                            font-size: calc(1.042 * var(--dvw));
                        }
                        &.vb::before {
                            font-size: 1.09375vw;
                        }
                        &.wa::before {
                            font-size: calc(1.1979 * var(--dvw));
                        }
                        &.inst::before {
                            font-size:  calc(0.885 * var(--dvw));
                        }
                        &.mail::before {
                            font-size:  calc(0.885 * var(--dvw));
                        }
                    }
                }
            }
        }
        .img {
            max-width: calc(47.0833 * var(--dvw));
        }
    }
}
@media screen and (max-width: 1279px) {
    .contacts-box {
        padding-left: 40px;
    }
    .catalog-links {
        display: none;
    }
    header {
        .top {
            padding: 14px 0;
            .wrapper {
                p {
                    font-size: 14px;
                    &::before {
                        font-size: 16px;
                    }
                }
            }
        }
        .center {
            padding: 15px 0px;
            .wrapper {
                justify-content: space-between;
                .form-wrapper {
                    form {
                        max-width: 309px;
                        margin-right: 0px;                
                    }
                }
                .info {
                    margin-right: 0px;
                    padding-top: 5px;
                    span {
                        font-size: 14px;
                    }
                    p {
                        font-size: 12px;
                    }
                }
                .social {
                    margin-right: 0px;
                    .list {
                        display: flex;
                        gap: 5px;
                        a {
                            width: 24px;
                            height: 24px;
                            &::before {
                                font-size: 14px;
                                line-height: 14px;
                            }
                        }
                    }
                    p {
                            font-size: 12px;
                            line-height: 15px;
                    }
                }
                .phone {
                    margin-right: 0px;
                    a {
                        font-size: 16px;
                        line-height: 19px;
                        span {
                            margin-right: 5px;
                        }
                        &::before {
                            width: 14px;
                            height: 14px;
                            margin-right: 8px;
                        }
                        &.mts::before {
                            background: url(/local/templates/akumulyator_template/css/../images/mts-logo.svg) center / 100% 100% no-repeat;
                        }
                        &.a1::before {
                            background: url(/local/templates/akumulyator_template/css/../images/a1-logo.svg) center / 100% 100% no-repeat;
                        }
                    }
                }
                .order-call {
                    margin-right: 0;
                    .btn {
                        gap: 10px;
                        background: var(--accent-color);
                        padding: 10px 10px;
                        font-size: 14px;
                        &::before {
                            font-size: 16px;
                            width: 20px;
                            height: 20px;
                        }
                    }
                }
                .btns {
                    gap: 12px;
                    a.phone-btn {
                        display: flex;
                    }
                    .compare {
                        width: 21px;
                        height: 19px;
                        &::before {
                            font-size: 21px;
                        }
                    }
                    .favorite {
                        width: 20px;
                        height: 19px;
                        &::before {
                            font-size: 20px;
                        }
                    }
                    .cart {
                        gap: 5px;
                        padding: 13px 20px;
                        border: 1px solid var(--border-color);
                        border-radius: 10px;
                        position: relative;
                        font-size: 14px;
                        font-weight: 700;
                        line-height: 17px;
                        span {
                            position: absolute;
                            top: 10px;
                            left: 45px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            padding: 2px;
                            font-size: 12px;
                            font-weight: 700;
                            color: var(--text-2);
                            border-radius: 50%;
                            background: var(--important-info);
                        }
                        &::before {
                            content: '\e006';
                            font-size: 33px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            width: 40px;
                            height: 40px;
                        }
                    }
                }
            }
        }
        .bottom {
            padding: 20px 0px;
            .catalog {
                & > button {
                    padding: 13px 25px 15px 10px;
                    &::after {
                        margin-left: 20px;
                    }
                }
                & > span {
                    right: -51px;
                    padding: 3px 10px;
                }
            }
            .services {
                button {
                    padding: 13px 20px 15px 15px;
                }
            }
            .delivery {
                button {
                    padding: 13px 15px 15px;
                }
            }
            .shops {
                padding: 10px 15px 14px;
            }
            nav {
                gap: 30px;
            }
        }  
    }
    header {
        .top {
            .wrapper {
                gap: 40px;
                .slide {
                    display: flex;
                    align-items: center;
                    gap: 40px;
                }
            }
        } 
        .center {
            padding: 14px 0px 10px;
            border-bottom: none;
            .wrapper {
                a.logo {
                    max-width: 135px;
                }
                .form-wrapper {
                    display: flex;
                    order: 2;
                    justify-self: end;
                    margin-left: 12px;
                    margin-right: 0;
                    position: relative;
                    form {
                        position: absolute;
                        max-width: 400px;
                        min-width: 400px;
                        width: 100%;
                        bottom: -8px;
                        z-index: 10;
                        height: 40px;
                        right: calc(100% + 10px);
                        background: var(--constraction-color);
                        margin-right: 0;
                        grid-template-columns: 1fr 40px;
                        opacity: 0;
                        pointer-events: none;
                        transition: .3s linear;
                        &::before {
                            content: '';
                            position: fixed;
                            top: 0;
                            left: 0px;
                            background: #000000a3;
                            width: calc(100 * var(--dvw));
                            height: 100dvh;
                            z-index: -1;
                        }
                        input {
                            height: 40px;
                            padding: 10px;
                            position: relative;
                            z-index: 3;
                            background: var(--constraction-color);
                        }
                        button {
                            width: 40px;
                            height: 40px;
                            position: relative;
                            z-index: 3;
                            &::before {
                                font-size: 16px;
                                line-height: 16px;
                            }
                        }
                    }
                    &.show {
                        form {
                            pointer-events: all;
                            opacity: 1;
                        }
                    }
                    button.open-form {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 20px;
                        height: 20px;
                        &::before {
                            content: '\e019';
                            font-family: 'icon';
                            font-size: 20px;
                            line-height: 20px;
                        }
                    }
                }
                .info {
                    display: none;
                }
                .social {
                    margin-left: auto;
                    .list {
                        gap: 3px;
                        a {
                            width: 22px;
                            height: 22px;
                            &::before {
                                font-size: 11px;
                                line-height: 11px;
                            }
                            &.telegram {
                                &::before {
                                    margin-right: 3px;
                                }
                            }
                            &.whatsapp {
                                &::before {
                                    margin-left: 0px;
                                    font-size: 12px;
                                    line-height: 12px;
                                }
                            }
                            &.viber {
                                &::before {
                                    margin-left: 0px;
                                }
                            }
                            &.inst {
                                &::before {
                                    font-size: 9px;
                                    margin-left: 0px;
                                }
                            }
                            &.mir {
                                &::before {
                                    font-size: 9fpx;
                                }
                            }
                        }
                    }
                    p {
                        display: none;
                    }
                }
                .phone {
                    margin-left: auto;
                    margin-right: 0px;
                    a {
                        font-size: 12px;
                        line-height: 18px;
                        span {
                            margin-right: 4px;
                        }
                        &::before {
                            width: 14px;
                            height: 14px;
                            margin-right: 8px;
                        }
                    }
                }
                .order-call {
                    margin-left: auto;
                    .btn {
                        gap: 8px;
                        padding: 8px 12px;
                        border-radius: 4px;
                        font-size: 12px;
                        &::before {
                            font-size: 12px;
                            width: 12px;
                            height: 12px;
                        }
                    }
                    span {
                        display: none;
                    }
                }
                .btns {
                    gap: 12px;
                    margin-left: auto;
                    .cart {
                        padding: 0px;
                        border-radius: 0px;
                        border: none;
                        font-size: 0px;
                        span {
                            top: -6px;
                            left: 12px;
                            font-size: 8px;
                        }
                        &::before {
                            font-size: 19px;
                            width: 20px;
                            height: 20px;
                        }
                    }
                }
            }
        }
        .bottom {
            flex-wrap: wrap;
            justify-content: space-between;
            nav {
                width: 100%;
                justify-content: space-between;
            }
        }
    }
     .goods-snippet {
        min-width: 244px;
        max-width: 244px;
        border-radius: 6px;
        padding: 6px 0px 13px;
        .top {
            padding-left: 17px;
            margin-bottom: 7px;
            align-items: center;
            .country {
                grid-template-columns: 14px max-content;
                gap: 8px;
                font-size: 12px;
                line-height: 15px;
            }
            .tag {
                font-size: 12px;
                line-height: 15px;
                padding: 0px 7px 3px;
                width: 132px;
            }

        }
        .image-box {
            height: 138px;
            margin-bottom: 13px;
            img {
                max-width: 150px;
            }
            button {
                right: 13px;
                &.favorite {
                    top: 7px;
                    &::before {
                        font-size: 20px;
                    }
                }
                &.compare {
                    top: 31px;
                    &::before {
                        font-size: 20px;
                    }
                }
            }
        }
        h3 {
            font-size: 14px;
            line-height: 17px;
            padding-left: 19px;
            padding-right: 27px;
            margin-bottom: 21px;
        }
        h4 {
            padding-left: 18px;
            margin-bottom: 14px;
            font-size: 14px;
            line-height: 17px;
        }
        .params {
            padding: 0px 18px;
            gap: 3px;
            margin-bottom: 9px;
            p {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .reviews {
            gap: 4px;
            padding: 0px 19px;
            margin-bottom: 8px;
            .stars {
                span {
                    width: 18px;
                    height: 18px;
                    &::before {
                        font-size: 18px;
                        line-height: 18px;
                    }
                }
            }
            & > p {
                font-size: 12px;
                line-height: 14px;
            }
            & span {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .price {
            gap: 13px;
            margin-bottom: 7px;
            p {
                font-size: 14px;
                line-height: 17px;
            }
        }
        .btns {
            gap: 7px;
            padding: 0 18px;
            .add-cart {
                width: 40px;
                min-width: 40px;
                height: 40px;
                border-radius: 7px;
                &::before {
                    font-size: 13px;
                }
            }
            .bye {
                gap: 7px;
                border-radius: 7px;
                font-size: 12px;
                &::before {
                    font-size: 15px;
                }
            }
        }
    }
    .form-question {
        padding: 20px 0px 30px;
        h2 {
            font-size: 40px;
            margin-bottom: 20px;
        }
        form {
            gap: 10px;
            input, textarea {
                padding: 15px 30px 15px;
            }
            & > textarea {
                height: 53px;
            }
            label {
                min-width: 283px;
                max-width: 283px;
                &::before {
                    content: '';
                    top: 17px;
                    left: 15px;
                }
                input {
                    width: 100%;
                    padding-left: 40px;
                    font-size: 18px;
                    font-weight: 700;
                    color: var(--input-text);
                }
            }
            button {
                padding: 18px 50px 19px;
            }
        }
    }
    .contacts-box {
        gap: 32px;
        .content {
            padding: 30px 0px 45px;
            max-width: 650px;
            width: 100%;
            h2 {
                font-size: 40px;
                margin-bottom: 19px;
            }
            .info {
                gap: 15px;
                margin-bottom: 50px;
                h3 {
                    font-size: 20px;
                }
                .phone-box {
                    padding-left: 30px;
                    &::before {
                        font-size: 20px;
                        top: 5px;
                    }
                    .item {
                        gap: 10px;
                        a {
                            font-size: 18px;
                        }
                        span {
                            font-size: 18px;
                        }
                    }
                }
                .adress {
                    padding-left: 30px;
                    &::before {
                        font-size: 20px;
                        line-height: 26px;
                        top: -5px;
                    }
                    p {
                        font-size: 16px;
                        line-height: 20px;
                    }
                }
            }
            .items {
                gap: 9px 55px;
                max-width: 400px;
            }
        }
        #wrapMap, #wrapMap iframe {
            width: 100%;
            height: 490px;
            .layout-control-group _side_right,
            .ymaps-2-1-79-copyrights-pane{
                display: none;
            }
        }
    }
    footer {
        .content {
            flex-direction: column;
            gap: 35px;
            margin-bottom: 22px;
            h2 {
                font-size: 20px;
            }
            nav .col a {
                font-size: 14px;
            }
            .info {
                display: flex;
                flex-wrap: wrap;
                justify-content: space-between;
                align-items: end;
                max-width: 100%;
                h2 {
                    font-size: 20px;
                    width: 100%;
                }
                p {
                    margin-bottom: 0px;
                }
                a {
                    font-size: 12px;
                }
            }
        }
    }
}
@media screen and (max-width: 1279px) {
    .wrapper {
        width: calc(100% - 40px);
    }
    .contacts-box {
        padding-left: 20px;
    }
}
@media screen and (max-width: 1030px) {
    .viewed {
        margin-bottom: 28px;
        h2 {
            font-size: 16px;
            line-height: 19px;
            margin-bottom: 20px;
        }
        .slides {
            gap: 6px;
            .goods-snippet {
                min-width: 244px;
                max-width: 244px;
            }
        }
    }
    .wrapper {
        width: calc(100% - 20px);
    }
    .window-background {
        .window-body {
            position: relative;
            padding: 25px 19px 35px;
            border-radius: 20px;
            div.close {
                right: 19px;
                top: 19px;
                &::before {
                    font-size: 12px;
                    line-height: 12px;
                }
            }
        }
    }
    .window-background.request-call {
        .window-body {
            max-width: 320px;
            h2 {
                font-size: 20px;
                line-height: 28px;
                margin-bottom: 10px;
            }
            form {
                input {
                    padding: 15px 20px;
                }
                label {
                    img {
                        left: 20px;
                    }
                    input {
                        padding-left: 51px;
                    }
                }
                button {
                    margin-bottom: 0px;
                    font-size: 16px;
                    line-height: 22px;
                }
                p {
                    font-size: 12px;
                    line-height: 15px;
                    max-width: 230px;
                    margin: 0 auto;
                }
            }
        }
    }
    .window-background.thanks {
        .window-body {
            max-width: 320px;
            padding: 33px 30px 45px; 
            h2 {
                margin-bottom: 10px;
                font-size: 20px;
                line-height: 28px;
            }
            p {
                font-size: 12px;
                line-height: 17px;
                margin-bottom: 25px;
            } 
            button {
                max-width: 258px;
                padding: 14px;
            }
        }
    }

    .window-background.click-bue .window-body {
        max-width: 327px;
        border-radius: 20px;
        padding: 17px 25px 37px;
        h2 {
            font-size: 20px;
            line-height: 28px;
            margin-bottom: 14px;
        }
        & > p {
            font-size: 12px;
            line-height: 15px;
            margin-bottom: 1px;
        }
        .img {
            max-width: 140px;
        }
        span.price {
            font-size: 12px;
            line-height: 17px;
            margin-bottom: 12px;
            &.old {
                font-size: 12px;
                line-height: 17px;
                margin-bottom: 0;
            }
        }
        form {
            gap: 6px;
            margin-bottom: 20px;
            input {
                padding: 7px 17px;
                font-size: 12px;
                line-height: 15px;
                &::placeholder {
                    font-size: 12px;
                    line-height: 15px;
                }
            }
            label {
                img {
                    left: 17px;
                    top: 8px;
                    max-width: 12px;
                }
                input {
                    padding-left: 35px;
                }
            }
            button {
                border-radius: 6px;
                margin: 6px 0 12px;
                padding: 10px;
                font-size: 10px;
                line-height: 14px;
            }
            p {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .installment-block {
            h3 {
                font-size: 16px;
                line-height: 19px;
                max-width: 200px;
                margin-bottom: 13px;
            }
            & > p {
                font-size: 12px;
                margin-bottom: 13px;
            }
            .payments {
                gap: 5px;
                margin-bottom: 27px;
                .item {
                    gap: 3px;
                    .line {
                        height: 3px;
                    }
                    p {
                        font-size: 12px;
                        line-height: 15px;
                    }
                }
            }
            .list {
                gap: 4px;
                margin-bottom: 11px;
                p {
                    font-size: 12px;
                    line-height: 15px;
                }
            }
            .cards {
                gap: 5px;
            }
        }
    }
    header {
        .top {
            padding: 10px 0 8px;
            .wrapper {
                p {
                    gap: 7px;
                    font-size: 12px;
                    &::before {
                        font-size: 14px;
                    }
                    &:nth-child(2)::before {
                        font-size: 12px;
                    }
                }
            }
        }
        .center {
            padding: 14px 0px 12px;
            .wrapper {
                a.logo {
                    max-width: 135px;
                    margin-right: 0;
                }
                .form-wrapper {
                    form {
                        max-width: 163px;
                        button {
                            &::before {
                                font-size: 16px;
                            }
                        }
                    }
                }
                .social {
                    .list {
                        gap: 4px;
                        a {
                            width: 24px;
                            height: 24Px;
                        }
                    }
                }
                .phone {
                    display: none;
                }
                .order-call {
                    .btn {
                        gap: 7px;
                        padding: 8px 10px;
                        border-radius: 4px;
                        font-size: 12px;
                        line-height: 16px;
                        &::before {
                            font-size: 9px;
                            line-height: 12px;
                            width: 12px;
                            height: 12px;
                        }
                    }
                }
                .btns {
                    gap: 22px;
                    a.phone-btn {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 17px;
                        height: 17px;
                        &::before {
                            content: '\e013';
                            font-family: 'icon';
                            font-size: 17px;
                        }
                    }
                }
            }
        }
        .bottom {
            gap: 19px 6px;
            padding: 0px 0px 10px;
            .catalog {
                & > button {
                    padding: 11px 28px 12px 14px;
                    font-size: 12px;
                    line-height: 15px;
                    .burger {
                        margin-right: 17px;
                        width: 18px;
                        &::before {
                            top: -5px;
                        }
                        &::after {
                            bottom: -5px;
                        }
                    }
                    &::after {
                        font-size: 10px;
                        margin-left: 27px;
                    }
                }
                & > span {
                    top: -10px;
                    right: -41px;
                    padding: 3px 12px;
                    font-size: 10px;
                    line-height: 12px;
                    &::before {
                        width: 16px;
                        height: 16px;
                    }
                }
                .catalog-menu {
                    justify-content: start;
                    max-width: calc(90 * var(--dvw));
                    .window-body {
                        grid-template-columns: 245px 1fr;
                        gap: 25px;
                        max-width: calc(90 * var(--dvw));
                        padding: 20px 40px 42px 20px;
                        max-height: 384px;
                        .tabs {
                            gap: 10px;
                            p, & > a {
                                padding-bottom: 10px;
                            }
                            a {
                                font-size: 12px;
                                line-height: 15px;
                            }
                        }
                        .blocks {
                            .block {
                                p.title {
                                    padding-bottom: 10px;
                                    padding-left: 0;
                                    font-size: 12px;
                                    line-height: 15px;
                                    margin-bottom: 10px;
                                }
                                .links {
                                    column-gap: 16px;
                                    row-gap: 12px;
                                    padding: 0;
                                    a,span {
                                        font-size: 12px;
                                        line-height: 15px;
                                        color: #666;
                                    }
                                }
                            }
                        }
                    }
                }
            }
            .services {
                button {
                    padding: 11px 26px 11px 14px;
                    border-radius: 7px;
                    font-size: 12px;
                    line-height: 15px;
                    &::before {
                        font-size: 20px;
                        margin-right: 12px;
                    }
                    &::after {
                        font-size: 10px;
                        margin-left: 21px;
                    }
                }
            }
            .delivery {
                button {
                    padding: 11px 17px 12px 14px;
                    border-radius: 7px;
                    font-size: 12px;
                    line-height: 15px;
                    &::before {
                        font-size: 13px;
                    }
                    &::after {
                        font-size: 10px;
                        margin-left: 14px;
                    }
                }
            }
            .shops {
                gap: 11px;
                padding: 12px 50px 11px 15px;
                font-size: 12px;
                line-height: 15px;
                border-radius: 7px;
                &::before {
                    font-size: 20px;
                }
            }
            nav {
                margin-left: 0;
                a {
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 100%;
                }
            }
        }
    }
    .promo-block { 
        padding: 10px 17px;
        margin-bottom: 10px;
        .bubbles {
            margin-bottom: 2px;
            a,
            p{
                font-size: 12px;
                line-height: 15px;
            }
        }
        h1 {
            font-size: 16px;
            line-height: 19px;
        }
    }
    .goods-snippet {
        min-width: 244px;
        max-width: 244px;
        border-radius: 6px;
        padding: 6px 0px 13px;
        .top {
            padding-left: 17px;
            margin-bottom: 7px;
            align-items: center;
            .country {
                grid-template-columns: 14px max-content;
                gap: 8px;
                font-size: 12px;
                line-height: 15px;
            }
            .tag {
                font-size: 12px;
                line-height: 15px;
                padding: 0px 7px 3px;
                width: 132px;
            }

        }
        .image-box {
            height: 138px;
            margin-bottom: 13px;
            img {
                max-width: 150px;
            }
            button {
                right: 13px;
                &.favorite {
                    top: 7px;
                    &::before {
                        font-size: 20px;
                    }
                }
                &.compare {
                    top: 31px;
                    &::before {
                        font-size: 20px;
                    }
                }
            }
        }
        h3 {
            font-size: 14px;
            line-height: 17px;
            padding-left: 19px;
            padding-right: 27px;
            margin-bottom: 21px;
        }
        h4 {
            padding-left: 18px;
            margin-bottom: 14px;
            font-size: 14px;
            line-height: 17px;
        }
        .params {
            padding: 0px 18px;
            gap: 3px;
            margin-bottom: 9px;
            p {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .reviews {
            gap: 4px;
            padding: 0px 19px;
            margin-bottom: 8px;
            .stars {
                span {
                    width: 18px;
                    height: 18px;
                    &::before {
                        font-size: 18px;
                        line-height: 18px;
                    }
                }
            }
            & > p {
                font-size: 12px;
                line-height: 14px;
            }
            & span {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .price {
            gap: 13px;
            margin-bottom: 7px;
            p {
                font-size: 14px;
                line-height: 17px;
            }
        }
        .btns {
            gap: 7px;
            padding: 0 18px;
            .add-cart {
                width: 40px;
                min-width: 40px;
                height: 40px;
                border-radius: 7px;
                &::before {
                    font-size: 13px;
                }
            }
            .bye {
                gap: 7px;
                border-radius: 7px;
                font-size: 12px;
                &::before {
                    font-size: 15px;
                }
            }
        }
    }
    .form-question {
        padding: 17px 10px 16px;
        h2 {
            font-size: 16px;
            font-weight: 500;
            margin-bottom: 12px;
            margin-bottom: 12px;
        }
        form {
            flex-wrap: wrap;
            gap: 5px 4px;
            input, textarea {
                font-size: 12px;
                line-height: 15px;
                border-radius: 10px;
                padding: 11px 22px 12px;
            }
            textarea {
                height: 40px;
            }
            label {
                min-width: 331px;
                max-width: 45.6%;
                width: 100%;
                &::before {
                    top: 14px;
                    left: 19px;
                    width: 11px;
                    height: 11px;
                }
                input {
                    padding-left: 40px;
                    font-size: 12px;
                }
            }
            button {
                width: 53.71%;
                padding: 14px calc(4.1667 * var(--dvw)) 14px;
                border-radius: 10px;
                font-size: 12px;
            }
        }
    }
    .contacts-box {
        gap: 16px;
        .content {
            padding: 8px 0px 24px;
            h2 {
                font-size: 26px;
                line-height: 32px;
                margin-bottom: 10px;
            }
            .info {
                gap: 28px;
                margin-bottom: 0px;
                h3 {
                    font-size: 12px;
                    line-height: 14px;
                }
                .phone-box {
                    position: relative;
                    padding-left: 36px;
                    padding-top: 2px;
                    &::before {
                        font-size: 19px;
                    }
                    h3 {
                        margin-bottom: 8px;
                    }
                    .item {
                        gap: 10px;
                        &:first-of-type {
                            margin-bottom: 11px;
                        }
                        a {
                            font-size: 13px;
                        }
                        span {
                            font-size: 13px;
                        }
                    }
                }
                .adress {
                    padding-left: 33px;
                    &::before {
                        font-size: 20px;
                        line-height: 21px;
                        top: 5px;
                    }
                    h3 {
                        font-size: 12px;
                        line-height: 15px;
                        margin-bottom: 3px;
                    }
                    p {
                        font-size: 12px;
                        line-height: 15px;
                        max-width: 150px;
                    }
                }
            }
            .items {
                gap: 10px 95px;
                max-width: 500px;
                margin-top: -17px;
                .item {
                    padding-left: 36px;
                    &:nth-child(2) {
                        grid-area: 2/2/3/3;
                    }
                    &:nth-child(3) {
                        grid-area: 2/1/3/2;
                    }
                    &:nth-child(4) {
                        grid-area: 3/2/4/3;
                    }
                    &:nth-child(5) {
                        grid-area: 3/1/4/2;
                    }
                    span {
                        top: 7px;
                        left: 2px;
                        &::before {
                            font-family: 'icon';
                        }
                        &.tg {
                            top: 7px;
                            &::before {
                                font-size: 13px;
                            }
                        }
                        &.wa {
                            &::before {
                                font-size: 14px;
                            }
                        }
                        &.vb {
                            &::before {
                                font-size: 15px;
                            }
                        }
                        &.mail {
                            left: 4px;
                            &::before {
                                font-size: 11px;
                            }
                        }
                        &.inst {
                            left: 4px;
                            &::before {
                                font-size: 11px;
                            }
                        }
                    }
                    h3 {
                        font-size: 12px;
                        line-height: 15px;
                    }
                    a {
                        font-size: 12px;
                        line-height: 15px;
                    }
                }
            }
        }
        #wrapMap, #wrapMap iframe {
            width: 100%;
            min-width: 328px;
            height: 264px;
        }
    }
    footer {
        padding-top: 19px;
        .content {
            flex-direction: column;
            gap: 35px;
            margin-bottom: 22px;
            width: calc(100% - 40px);
            h2 {
                font-size: 16px;
                line-height: 19px;
            }
            nav {
                width: 100%;
                min-width: 0px;
                padding-right: 40px;
                .col {
                    gap: 5px;
                    h2 {
                        margin-bottom: 5px;
                    }
                    a {
                        font-size: 12px;
                        line-height: 15px;
                    }
                }
            }
            .info {
                h2 {
                    font-size: 14px;
                    line-height: 17px;
                    margin-bottom: 10px;
                }
                p {
                    font-size: 12px;
                    line-height: 15px;
                }
                .links {
                    gap: 14px;
                }
            }
        }
        .img {
            max-width: 336px;
            margin-bottom: 12px;
        }
    }
}
@media screen and (max-width: 767px) {
    .window-background.click-bue .window-body {
        max-width: 320px;
        border-radius: 20px;
        padding: 24px 19px 20px;
        overflow: auto;
        max-height: calc(100dvh - 30px);
        h2 {
            font-size: 20px;
            line-height: 28px;
            margin-bottom: 24px;
        }
        & > p {
            font-size: 14px;
            line-height: 17px;
            max-width: 190px;
        }
        .img {
            max-width: 180px;
        }
        span.price {
            font-size: 14px;
            line-height: 19px;
            margin-bottom: 10px;
            &.old {
                font-size: 12px;
                line-height: 15px;
                margin-bottom: 3px;
            }
        }
        form {
            gap: 10px;
            margin-bottom: 40px;
            input {
                padding: 15px 20px;
                font-size: 16px;
                line-height: 19px;
                &::placeholder {
                    font-size: 16px;
                    line-height: 19px;
                }
            }
            label {
                img {
                    left: 20px;
                    top: 15px;
                    max-width: 20px;
                }
                input {
                    padding-left: 51px;
                }
            }
            button {
                margin: 0px 0px 10px;
                padding: 18px;
                font-size: 16px;
                line-height: 22px;
            }
            p {
                font-size: 12px;
                line-height: 15px;
            }
        }
        .installment-block {
            h3 {
                font-size: 16px;
                line-height: 20px;
                max-width: 180px;
                margin-bottom: 5px;
            }
            .payments {
                margin-bottom: 7px;
                .item {
                    gap: 5px;
                    .line {
                        height: 3px;
                    }
                }
            }
            .list {
                gap: 17px;
                margin-bottom: 11px;
                p {
                    font-size: 12px;
                    line-height: 15px;
                }
            }
        }
    }
    .viewed {
        margin-bottom: 15px;
        .controls {
            display: grid;
            grid-template-columns: repeat(2, 35px);
            gap: 6px;
            margin-bottom: 15px;
            div {
                display: flex;
                justify-content: center;
                align-items: center;
                aspect-ratio: 1/1;
                border-radius: 50%;
                background: var(--accent-color);
                &::before {
                    content: '\e016';
                    font-family: 'icon';
                    font-size: 12px;
                    transform: rotate(90deg);
                }
                &.arrow-r {
                    transform: rotate(180deg);
                }
            }
        }
        .slides {
            flex-wrap: nowrap;
            .goods-snippet {
                min-width: 254px;
                max-width: 254px;
            }
        }
    }
    header {
        position: relative;
        .center {
            padding: 14px 0px 16px;
            .wrapper {
                .burger {
                    display: flex;
                    margin-right: 20px;
                }
                a.logo {
                    margin-right: auto;
                    img {
                        width: 100%;
                    }
                }
                .form-wrapper { 
                    display: flex; 
                    position: static;
                    margin-left: 0;
                    margin-right: 20px;
                    order: 2;
                    button.open-form {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 20px;
                        height: 20px;
                        &::before {
                            content: '\e019';
                            font-family: 'icon';
                            font-size: 18px;
                            line-height: 18px;
                        }
                    }
                    form {
                        grid-template-columns: 1fr 40px;
                        width: 100%;
                        max-width: 100%;
                        min-width: 100%;
                        margin-right: 41px;                
                        border-radius: 10px;
                        border: 1px solid var(--border-color);
                        overflow: hidden;
                        bottom: auto;
                        top: 40px;
                        left: 0;
                        right: 0;
                        input {
                            padding: 8px 15px;
                            padding-right: 0;
                            &::placeholder {
                                font-size: 16px;
                                color: var(--playcholder-color);
                            }
                        }
                        button {
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            width: 40px;
                            height: 40px;
                            background: var(--accent-color);
                            &::before {
                                content: '\e019';
                                font-family: 'icon';
                                font-size: 17px;
                                line-height: 20px;
                            }
                        }
                    }
                }
                .info {
                    display: none;
                }
                .social {
                    display: none;
                }
                .phone {
                    display: none;
                }
                .order-call {
                    display: none;
                }
                .btns {
                    display: contents;
                    a.phone-btn {
                        margin-right: 20px;
                    }
                    .cart {
                        order: 3;
                    }
                }
            }
        }
        .bottom {
            gap: 0px;
            padding: 0px;
            position: relative;
            padding-bottom: 15px;
            .catalog {
                position: absolute;
                & > button, & > span {
                    display: none;
                }
                .catalog-menu {
                    .window-body {
                        display: flex;
                        flex-direction: column;
                        gap: 15px;
                        border-radius: 0;
                        position: fixed;
                        inset: 0;
                        max-width: 100%;
                        max-height: 100dvh;
                        min-height: 100dvh;
                        padding-right: 20px;
                        margin-bottom: 15px;
                        overflow: auto;
                        &:has(.blocks .block.mobile-show) {
                            overflow: hidden;
                        }
                        .mobile-head {
                            display: flex;
                            flex-direction: column;
                            a.logo {
                                max-width: 135px;
                                margin-bottom: 12px;
                            }
                            div.close::before {
                                font-size: 18px;
                                line-height: 18px;
                            }
                            h2 {
                                font-size: 17px;
                                line-height: 21px;
                                font-weight: 700; 
                                margin-bottom: 1px;
                            }
                            p {
                                font-size: 12px;
                                line-height: 15px;
                            }
                        }
                        .tabs {
                            padding: 18px 5px;
                            gap: 15px;
                            .item {
                                padding-bottom: 13px;
                                &.selected {
                                    &::after, a {
                                        font-weight: 700;
                                        color: var(--text);
                                    }
                                }
                            }
                            a, span {
                                font-size: 15px;
                                font-weight: 700;
                                line-height: 18px;
                            }
                            .mobile {
                                display: flex;
                                color: var(--important-info);
                                &:last-child {
                                    padding-bottom: 0;
                                    border-bottom: 0;
                                }
                                span {
                                    color: var(--important-info);
                                }
                            }
                            .useful-block {
                                display: flex;
                                flex-direction: column;
                                gap: 15px;
                                padding: 0px 4px;
                                max-height: 0px;
                                overflow: hidden;
                                transition: .3s linear;
                                &.show {
                                    max-height: 400px;
                                }
                                a {
                                    font-size: 12px;
                                    font-weight: 500;
                                    line-height: 15px;
                                }
                            }
                        }
                        .mobile-block {
                            display: flex;
                            flex-direction: column;
                            button {
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                gap: 23px;
                                padding: 15px;
                                margin-bottom: 9px;
                                border-radius: 13px;
                                background: var(--accent-color);
                                box-shadow: 0px 0px 17.26px 0px #ffd633a1;
                                font-size: 21px;
                                font-weight: 700;
                                line-height: 25px;
                                &::before {
                                    content: '\e013';
                                    font-family: 'icon';
                                    font-weight: 400;
                                    font-size: 28px;
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    width: 37px;
                                    height: 37px;
                                }
                            }
                            span {
                                display: flex;
                                justify-content: center;
                                text-align: center;
                                font-size: 18px;
                                line-height: 21px;
                                margin-bottom: 20px;
                            }
                            .links {
                                display: flex;
                                justify-content: space-between;
                                gap: 5px;
                                margin-bottom: 12px;
                                a,span {
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    width: 50px;
                                    height: 50px;
                                    border-radius: 50%;
                                    &::before {
                                        display: flex;
                                        font-family: 'icon';
                                        font-size: 25px;
                                        line-height: 25px;
                                        color: #fff;
                                        font-weight: 400;
                                    }
                                    &.tg {
                                        background: #2f89ce;
                                        &::before {
                                            content: '\e008';
                                            margin-right: 2px;
                                        }
                                    }
                                    &.wa {
                                        background: #48c95f;
                                        &::before {
                                            content: '\e009';
                                            margin-left: 1px;
                                        }
                                    }
                                    &.vb {
                                        background: #7c509a;
                                        &::before {
                                            content: '\e010';
                                            font-size: 24px;
                                            line-height: 28px;
                                            margin-left: 2px;
                                            margin-top: 2px;
                                        }
                                    }
                                    &.inst {
                                        background: linear-gradient(43.94deg, #eea054 16.16%, #d64763 50.11%, #b62a99 83.68%);
                                        &::before {
                                            content: '\e011';
                                            font-size: 21px;
                                        }
                                    }
                                    &.mail {
                                        background: #f59124;
                                        &::before {
                                            content: '\e012';
                                            font-size: 21px;
                                        }
                                    }
                                }
                            }
                            p {
                                font-size: 16px;
                                line-height: 20px;
                                text-shadow: 0px 0px 7px #252525dd;
                                animation: pulseGlow 2s ease-in-out infinite;
                                text-align: center;
                                margin: 0 auto;
                            }
                        }
                        .blocks {
                            .block {
                                &::before {
                                    content: '';
                                    display: none;
                                    position: absolute;
                                    width: calc(100 * var(--dvw));
                                    height: 100dvh;
                                    top: -110px;
                                    left: 0;
                                }
                                display: flex;
                                flex-direction: column;
                                gap: 15px;
                                border-radius: 0;
                                position: fixed;
                                left: 0;
                                right: 0;
                                top: 102px;
                                bottom: 0;
                                max-width: 100%;
                                max-height: 100dvh;
                                min-height: 100dvh;
                                background: var(--constraction-color);
                                padding: 21px 27px;
                                opacity: 0;
                                pointer-events: none;
                                &.active {
                                    opacity: 0;
                                }
                                &.mobile-show {
                                    opacity: 1;
                                    pointer-events: all;
                                    max-height: 100%;
                                }
                                .mobile-title {
                                    display: flex;
                                    justify-content: space-between;
                                    padding: 0px 11px 15px 0;
                                    border-bottom: 1px solid #dfdfdf;
                                    font-size: 15px;
                                    font-weight: 700;
                                    line-height: 18px;
                                    span {
                                        display: flex;
                                        &::before {
                                            content: '\e016';
                                            font-family: 'icon';
                                            font-size: 12px;
                                            transform: rotate(90deg);
                                        }
                                    }
                                }
                                .chapter {
                                    p.title {
                                        display: flex;
                                        justify-content: space-between;
                                        align-items: center;
                                        font-size: 15px;
                                        line-height: 18px;
                                        text-transform: none;
                                        margin-bottom: 0;
                                        &::after {
                                            content: '\e016';
                                            font-family: 'icon';
                                            font-size: 12px;
                                            transform: rotate(-90deg);
                                        }
                                    }
                                    .links {
                                        display: flex;
                                        flex-wrap: nowrap;
                                        flex-direction: column;
                                        gap: 15px;
                                        border-radius: 0;
                                        position: fixed;
                                        left: 0;
                                        right: 0;
                                        top: 102px;
                                        bottom: 0;
                                        max-width: 100%;
                                        max-height: 100dvh;
                                        min-height: 100dvh;
                                        background: var(--constraction-color);
                                        padding: 21px 27px;
                                        opacity: 0;
                                        pointer-events: none;
                                        z-index: 9;
                                        overflow: auto;
                                        transition: .3s linear;
                                        .mobile-title {
                                            display: flex;
                                        }
                                        &.active {
                                            opacity: 0;
                                        }
                                        &.mobile-show {
                                            opacity: 1;
                                            pointer-events: all;
                                            max-height: 100%;
                                        }
                                        a, & > span {
                                            width: 100%;
                                            font-size: 15px;
                                            line-height: 18px;
                                            background: #fff;
                                            color: #252525;
                                            &:not(:last-child) {
                                                padding-bottom: 10px;
                                                border-bottom: 1px solid #dfdfdf;
                                            }
                                            &:last-child {
                                                margin-bottom: 110px;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
            .services {
                position: static;
                button {
                    padding: 0px;
                    background: none;
                    border: none;
                    border-radius: 0px;
                    font-size: 11px;
                    line-height: 11px;
                    color: var(--text);
                    &::before {
                        font-size: 15px;
                        margin-right: 6px;
                    }
                    &::after {
                        font-size: 7px;
                        margin-left: 6px;
                    }
                }
                &:has(.sub-menu.open) {
                    button {
                        color: var(--important-info);
                    }
                }
            }
            .delivery {
                position: static;
                button {
                    padding: 0px;
                    background: none;
                    border: none;
                    border-radius: 0px;
                    font-size: 11px;
                    line-height: 11px;
                    color: var(--text);
                    &::before {
                        font-size: 9px;
                        margin-right: 6px;
                    }
                    &::after {
                        font-size: 7px;
                        margin-left: 6px;
                    }
                }
                &:has(.sub-menu.open) {
                    button {
                        color: var(--important-info);
                    }
                }
            }
            .services .sub-menu, .delivery .sub-menu {
                left: -10px;
                right: -10px;
                top: 100%;
                gap: 0px;
                padding: 0px 27px;
                border-radius: 0px;
                &.open {
                    box-shadow: none;
                }
                a {
                    padding: 15px 4px;
                    border-bottom: 1px solid #dfdfdf;
                    &:first-child {
                        margin-top: 4px;
                    }
                    &:last-child {
                        margin-bottom: 0px;
                        border-bottom: none;
                    }
                }
            }
            .shops {
                gap: 3px;
                padding: 0px;
                background: none;
                border-radius: 0px;
                font-size: 11px;
                line-height: 11px;
                color: var(--text);
                &::before {
                    font-size: 15px;
                    margin-right: 6px;
                }
                &::after {
                    font-size: 7px;
                    margin-left: 6px;
                }
            }
            nav {
                display: none;
            }
        }
    }
    .form-question {
        padding: 17px 0px 16px;
        h2 {
            font-size: 18px;
            font-weight: 600;
            margin-bottom: 24px;
        }
        form {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            padding-right: 7px;
            textarea, input {
                font-size: 16px;
                line-height: 19px;
                padding: 14px 20px;
            }
            & > textarea {
                height: 82px;
            }
            label {
                min-width: 0px;
                width: 100%;
                max-width: 100%;
                &::before {
                    top: 18px;
                    left: 20px;
                    width: 20px;
                    height: 20px;
                }
                input {
                    width: 100%;
                    padding: 17px 20px 17px;
                    padding-left: 60px;
                    font-size: 16px;
                    line-height: 100%;
                    font-weight: 500;
                }
            }
            button {
                max-width: 100%;
                width: 100%;
                padding: 18px 0px 17px;
                text-align: center;
                font-size: 13px;
            }
        }
    }
    .goods-snippet {
        min-width: 254px;
        max-width: 254px;
        border-radius: 6px;
        padding: 6px 0px 13px;
        .top {
            .tag {
                font-size: 12px;
                line-height: 15px;
                padding: 2px 11px 2px;
                width: 140px;
            }
        }
        .image-box {
            height: 142px;
            img {
                max-width: 155px;
            }
            button {
                right: 5px;
            }
        }
        h3 {
            line-height: 18px;
        }
        .price {
            gap: 13px;
            margin-bottom: 7px;
            p {
                font-size: 15px;
                line-height: 18px;
            }
        }
    }
    .goods-snippet {
        border: 1px solid var(--text-opacity);
        padding: 5px 0px;
        .top {
            .tag {
                width: 65px;
            }
        }
        .image-box {
            img {
                width: 70%;
            }
        }
        h3 {
            padding: 0 5px;
            margin-bottom: 10px;
        }
        h4 {
            padding-left: 5px;
            margin-bottom: 5px;
        }
        .params {
            padding: 0 5px;
        }
        .reviews {
            padding: 0 5px;
            flex-wrap: wrap;
            .stars {
                span {
                    width: 15px;
                    height: 15px;
                    margin-left: 0;
                    &::before {
                        font-size: 14px;
                    }
                }
            }
            p {
                margin-right: 20px;
            }
            & > span {
                margin-left: 0;
            }
        }
        .price {
            justify-content: space-between;
            padding: 0 5px;
        }
        .btns {
            display: flex;
            flex-direction: column;
            gap: 5px;
            padding: 0 5px;
            .add-cart {
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 7px;
                width: 100%;
                gap: 3px;
                height: 30px;
                span {
                    display: inline-flex;
                    font-size: 12px;
                    font-weight: 500;
                    color: var(--text);
                }
            }
            .bye {
                height: 30px;
            }
        }
    }
    .contacts-box {
        display: flex;
        flex-direction: column;
        padding-left: 0;
        gap: 0px;
        .content {
            padding: 23px 20px 44px;
            max-width: 850px;
            width: 100%;
            h2 {
                display: none;
            }
            .info {
                flex-direction: column;
                gap: 20px;
                margin-bottom: 0px;
                h3 {
                    font-size: 15px;
                    line-height: 18px;
                }
                .phone-box {
                    padding-left: 44px;
                    padding-top: 0px;
                    &::before {
                        font-size: 23px;
                    }
                    h3 {
                        margin-bottom: 10px;
                    }
                    .item {
                        gap: 16px;
                        &:first-of-type {
                            margin-bottom: 7px;
                        }
                        a {
                            font-size: 20px;
                            line-height: 24px;
                        }
                        span {
                            font-size: 20px;
                            line-height: 24px;
                        }
                    }
                }
                .adress {
                    padding-left: 44px;
                    &::before {
                        font-size: 28px;
                        line-height: 29px;
                        top: 3;
                        left: -2px;
                    }
                    h3 {
                        font-size: 15px;
                        line-height: 18px;
                        margin-bottom: 10px;
                    }
                    p {
                        font-size: 14px;
                        line-height: 17px;
                        max-width: 415px;
                    }
                }
            }
            .items {
                display: none;
            }
        }
        #wrapMap, #wrampMap iframe {
            height: 258px;
        }
    }
    footer {
        padding-top: 20px;
        padding-bottom: 70px;
        .content {
            width: calc(100% - 20px);
            margin-bottom: 12px;
            gap: 40px;
            h2 {
                font-size: 18px;
                line-height: 22px;
            }
            nav {
                flex-direction: column;
                gap: 20px;
                .col {
                    gap: 5px;
                    h2 {
                        margin-bottom: 5px;
                    }
                    a {
                        font-size: 14px;
                        line-height: 17px;
                    }
                }
            }
            .info {
                h2 {
                    font-size: 18px;
                    line-height: 22px;
                    margin-bottom: 10px;
                }
                p {
                    font-size: 14px;
                    line-height: 17px;
                    margin-bottom: 23px;
                }
                .links {
                    width: 100%;
                    gap: 34px;
                    justify-content: space-between;
                    padding-right: 14px;
                    a {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        width: 40px;
                        min-width: 40px;
                        height: 40px;
                        background: var(--constraction-color);
                        border-radius: 50%;
                        &::before {
                            font-family: 'icon';                        
                        }
                        &.tg::before {
                            content: '\e023';
                            font-size: 20px;
                            padding-right: 3px;
                        }
                        &.vb::before {
                            content: '\e026';
                            font-size: 21px;
                        }
                        &.wa::before {
                            content: '\e025';
                            font-size: 23px;
                        }
                        &.inst::before {
                            content: '\e024';
                            font-size: 17px;
                        }
                        &.mail::before {
                            content: '\e022';
                            font-size: 17px;
                        }
                    }
                }
            }
        }
        .img {
            max-width: 904px;
        }
    }
    .mobile-menu {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        bottom: 0px;
        padding-bottom: calc(11px + env(safe-area-inset-bottom));
        left: 0;
        right: 0;
        z-index: 98;
        background: #fff;
        padding: 11px 20px;
        a.phone {
            display: flex;
            align-items: center;
            gap: 4px;
            font-size: 16px;
            line-height: 19px;
            font-weight: 700;
            color: #c0c0c0;
            span {
                font-size: inherit;
                line-height: inherit;
                font-weight: inherit;
            }
            &::before {
                content: '\e013';
                font-family: 'icon';
                font-size: 19px;
                line-height: 19px;
                color: #252525;
                margin-right: 3px;
            }
        }
        .social {
            display: flex;
            gap: 7px;
            a {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 38px;
                height: 38px;
                border-radius: 50%;
                &.tg {
                    background: #2f89ce;
                    &::before {
                        content: '\e008';
                        font-family: 'icon';
                        font-size: 19px;
                        color: #fff;
                        margin-right: 2px;
                    }
                }
                &.wp {
                    background: #48c95f;
                    &::before {
                        content: '\e009';
                        font-family: 'icon';
                        font-size: 20px;
                        color: #fff;
                        margin-left: 2px;
                        margin-bottom: 2px;
                    }
                }
                &.vb {
                    background: #7c509a;
                    &::before {
                        content: '\e010';
                        font-family: 'icon';
                        font-size: 20px;
                        color: #fff;
                        margin-left: 1px;
                        margin-bottom: 1px;
                    }
                }
                &.inst {
                    background: linear-gradient(43.94deg, #eea054 16.16%, #d64763 50.11%, #b62a99 83.68%);
                    &::before {
                        content: '';
                        display: block;
                        width: 20px;
                        height: 20px;
                        background: #fff;
                        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
                        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
                    }
                }
                &.mail {
                    background: #f59124;
                    &::before {
                        content: '';
                        display: block;
                        width: 20px;
                        height: 20px;
                        background: #fff;
                        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
                        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
                    }
                }
            }
        }
    }
}
@media (hover:hover) {
    .select .sub:hover {
        background: var(--text-bg-2);
    }
    header {
        .center .wrapper {
            .social .list a:hover {
                animation: pulse 1.2s ease;
            }
            .phone a:hover {
                color: #bb1303;
                span {
                    color: #bb1303;
                }
            }
            .order-call .btn:hover::after {
                opacity: 1;
            } 
        }
        .bottom {
            .catalog > button:hover::before {
                opacity: 1;
            }
            .catalog .catalog-menu .window-body .blocks .block .list {
                a, span {
                    &:hover {
                        color: var(--important-info);
                    }
                }
            } 
            .services button:hover {
                border: 2px solid var(--accent-color);
            }
            .delivery button:hover {
                border: 2px solid var(--accent-color);
            }
            .services  .sub-menu, 
            .delivery .sub-menu { 
                a:hover {
                    color: var(--important-info);
                }
            }
            nav a:hover {
                color: var(--important-info);
            }
        }
    }
    .goods-snippet:hover {
        box-shadow: 0px 4px 22.1px 0px #00000045;
        .btns {
            .add-cart:hover::after {
                opacity: 1;
            }
        }
    }
    footer .content {
        nav a:hover {
            color: var(--constraction-color);
        }
    }
}
.window-background.add-review-window {
    .window-body {
        display: flex;
        flex-direction: column;
        width: calc(100% - 40px);
        max-width: 550px;
        gap: 40px;
        h2 {
            font-size: 28px;
            font-weight: 600;
            text-align: center;
        }
        form {
            display: flex;
            flex-direction: column;
            gap: 20px;
            input,textarea {
                border: 1px solid #c5c5c5;
                border-radius: 10px;
                width: 100%;
                padding: 16px 10px 15px;
                font-size: 16px;
                line-height: 19px;
                font-weight: 400;
                color: var(--text);
                &::placeholder {
                    font-size: 16px;
                    line-height: 19px;
                    font-weight: 400;
                    color: var(--text);
                }
            }
            textarea {
                height: 140px;
            }
            label {
                display: flex;
                flex-direction: column;
                gap: 5px;
            }
            button {
                display: flex;
                justify-content: center;
                align-items: center;
                padding: 13px 20px;
                font-size: 16px;
                font-weight: 700;
                line-height: 19px;
                white-space: nowrap;
                background: var(--accent-color);
                box-shadow: 0px 0px 11.68px 0px #ffd633a1;
                border-radius: 10px;
                border: none;
                cursor: pointer;
                transition: .3s linear;
                position: relative;
                z-index: 2;
                &::after {
                    content: '';
                    position: absolute;
                    inset: 0;
                    background: #ffce05;
                    border-radius: inherit;
                    z-index: -1;
                    opacity: 0;
                    transition: .3s linear;
                }
                &:hover::after {
                    opacity: 1;
                }
            }
        }
    }
}
@media screen and (max-width: 767px) {
    body {
        padding-bottom: 42px;
    }
    .mobile-menu {
        padding: 6px 12px;
        .phone {
            font-size: 13px;
            line-height: 15px;
            white-space: nowrap;
            &::before {
                font-size: 15px;
                line-height: 15px;
            }
        }
        .social {
            gap: 5px;
            a {
                width: 30px;
                height: 30px;
                &.tg::before,
                &.wp::before,
                &.vb::before {
                    font-size: 15px;
                    margin: 0;
                }
                &.inst::before,
                &.mail::before {
                    width: 15px;
                    height: 15px;
                }
            }
        }
    }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/catalog-cards.css?179408147714547*/
/**
 * Единые карточки товаров на всём сайте (каталог, главная, избранное, поиск и т.д.).
 */

:root {
    --product-card-gap: 2px;
    --product-card-slide-width: calc(50% - 1px);
}

/* --- флаг страны --- */
.country.country--flag-only {
    display: block;
    width: auto;
    margin: 0;
    padding: 0;
    grid-template-columns: unset;
    font-size: 0;
    line-height: 0;
}

.country.country--flag-only img {
    display: block;
    width: 20px;
    height: 15px;
    object-fit: cover;
    border: 1px solid #e0e0e0;
    border-radius: 2px;
}

/* --- сетка (каталог, поиск, подбор по авто) --- */
.catalog-container .main-container .good-list,
.good-list,
.goods-list,
.selection-mark .vehicle-results {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--product-card-gap);
    width: 100%;
}

.catalog-container .main-container .good-list .slides,
.good-list .slides {
    display: contents;
    width: 100%;
}

/* --- слайдеры с карточками (главная, избранное, «смотрели») --- */
.hit-slider,
.goods-slider,
section.viewed {
    overflow: hidden;
}

.hit-slider .slides,
.goods-slider .slides,
section.viewed .slides {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: var(--product-card-gap);
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    position: relative !important;
    left: 0 !important;
    transition: none !important;
    scrollbar-width: none;
}

.hit-slider .slides::-webkit-scrollbar,
.goods-slider .slides::-webkit-scrollbar,
section.viewed .slides::-webkit-scrollbar {
    display: none;
}

.hit-slider .slides > .goods-snippet,
.goods-slider .slides > .goods-snippet,
section.viewed .slides > .goods-snippet,
.hit-slider .slides > .slide.goods-snippet,
.goods-slider .slides > .slide.goods-snippet,
section.viewed .slides > .slide.goods-snippet {
    flex: 0 0 var(--product-card-slide-width) !important;
    width: var(--product-card-slide-width) !important;
    min-width: var(--product-card-slide-width) !important;
    max-width: var(--product-card-slide-width) !important;
    box-sizing: border-box;
    scroll-snap-align: start;
    /* Высота по самой высокой карточке ряда: height: 100% от ленты без высоты давал разную высоту */
    height: auto !important;
    align-self: stretch;
}

/* --- карточка товара --- */
.good-list .goods-snippet,
.goods-list .goods-snippet,
.goods-list > .goods-snippet,
.selection-mark .vehicle-results .goods-snippet,
.hit-slider .slides .goods-snippet,
.goods-slider .slides .goods-snippet,
.viewed .slides .goods-snippet,
.goods-snippet {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: none !important;
    border: 1px solid #e8eaed;
    border-radius: 0.4rem;
    padding: 16px 12px 18px;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    content-visibility: auto;
    contain-intrinsic-size: auto 360px;
}

.good-list .goods-snippet,
.goods-list .goods-snippet,
.goods-list > .goods-snippet,
.selection-mark .vehicle-results .goods-snippet {
    width: 100%;
}

.goods-snippet .top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 4px;
    padding: 0;
    margin-bottom: 4px;
    min-height: 15px;
}

.goods-snippet .top .country.country--flag-only {
    flex: 0 0 auto;
}

.goods-snippet .top .tag {
    flex: 0 1 auto;
    width: auto !important;
    max-width: 58%;
    margin-left: auto;
    padding: 2px 6px;
    font-size: 9px;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-radius: 4px;
}

.goods-snippet .image-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: clamp(96px, 30vw, 130px);
    margin-bottom: 6px;
    padding: 0;
    box-sizing: border-box;
}

/* <picture> с WebP-копией не должен становиться отдельным блоком: размеры и object-fit задаются самому img (07.11.2026) */
.goods-snippet .image-box picture {
    display: contents;
}

.goods-snippet .image-box img {
    display: block;
    max-width: 88%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.goods-snippet .image-box button {
    right: 8px;
}

.goods-snippet .image-box button.favorite {
    top: 4px;
}

.goods-snippet .image-box button.favorite::before {
    font-size: 22px;
}

.goods-snippet .image-box button.compare {
    top: 34px;
}

.goods-snippet .image-box button.compare::before {
    font-size: 22px;
}

.goods-snippet h3 {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    padding: 0;
    margin: 0 0 2px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: #333;
}

.goods-snippet h4 {
    display: none;
}

.goods-snippet .params {
    display: flex;
    flex-direction: column;
    padding: 0 8px;
    gap: 3px;
    margin-bottom: 8px;
}

.goods-snippet .params p {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    line-height: 1.25;
    gap: 6px;
}

.goods-snippet .params p span {
    font-weight: 700;
}

.goods-snippet .reviews {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 0;
    margin: 0 0 4px;
    min-height: 27px;
}

.goods-snippet .reviews .stars {
    display: flex;
    gap: 1px;
}

.goods-snippet .reviews .stars span {
    width: 14px;
    height: 14px;
}

.goods-snippet .reviews .stars span::before {
    font-size: 13px;
}

.goods-snippet .reviews > p,
.goods-snippet .reviews > span:not(.tile-brand-wrap) {
    font-size: 11px;
    line-height: 1.2;
}

.goods-snippet .reviews .tile-brand-wrap {
    margin-left: auto;
    flex: 0 0 auto;
    max-width: 46%;
    display: flex;
    justify-content: flex-end;
}

.goods-snippet .reviews .tile-brand {
    display: block;
    max-width: 72px;
    max-height: 22px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.goods-snippet .card-footer {
    margin-top: auto;
}

.goods-snippet .price {
    gap: 6px;
    margin-bottom: 8px;
    padding: 0;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.goods-snippet .price p {
    font-size: 15px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--important-info);
}

.goods-snippet .price p.old {
    text-decoration: line-through;
    color: #616161;
}

.goods-snippet .btns {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0 8px;
}

.goods-snippet .btns .add-cart {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
    height: 40px;
    border-radius: 8px;
}

.goods-snippet .btns .add-cart span {
    display: inline;
    font-size: 13px;
    line-height: 1;
}

.goods-snippet .btns .add-cart::before {
    font-size: 16px;
    margin-right: 6px;
}

.goods-snippet .btns .bye {
    width: 100%;
    min-height: 40px;
    font-size: 13px;
    border-radius: 8px;
}

/* --- детальная карточка --- */
.product .gallery-block .option .country.country--flag-only {
    grid-template-columns: unset;
    gap: 0;
    margin-right: 12px;
    margin-left: 0;
}

.product .gallery-block .option .country.country--flag-only img {
    width: 32px;
    height: auto;
}

/* --- ≥768px: 3 колонки, десктопная раскладка кнопок --- */
@media screen and (min-width: 768px) {
    :root {
        --product-card-gap: 10px;
        --product-card-slide-width: calc(33.333% - 7px);
    }

    .catalog-container .main-container .good-list,
    .good-list,
    .goods-list,
    .selection-mark .vehicle-results {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px 14px;
    }

    .good-list .goods-snippet,
    .goods-list .goods-snippet,
    .goods-list > .goods-snippet,
    .selection-mark .vehicle-results .goods-snippet {
        width: 100%;
    }

    .country.country--flag-only img {
        width: 28px;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .goods-snippet {
        padding: 12px 12px 16px;
    }

    .goods-snippet .top {
        padding: 0 4px;
        margin-bottom: 8px;
    }

    .goods-snippet .top .tag {
        font-size: 11px;
        padding: 2px 8px 3px;
    }

    .goods-snippet .image-box {
        height: clamp(140px, 18vw, 190px);
        margin-bottom: 10px;
        padding: 0 6px;
    }

    .goods-snippet .image-box button.favorite::before,
    .goods-snippet .image-box button.compare::before {
        font-size: 22px;
        color: inherit;
    }

    .goods-snippet h3 {
        font-size: 15px;
        padding: 0 4px;
        -webkit-line-clamp: 2;
    }

    .goods-snippet .params,
    .goods-snippet .reviews {
        padding: 0 12px;
        margin-bottom: 8px;
    }

    .goods-snippet .params p {
        font-size: 12px;
    }

    .goods-snippet .reviews > p,
    .goods-snippet .reviews > span:not(.tile-brand-wrap) {
        font-size: 11px;
    }

    .goods-snippet .price {
        padding: 0 4px;
    }

    .goods-snippet .price p {
        font-size: 18px;
    }

    .goods-snippet .btns {
        flex-direction: row;
        gap: 8px;
        padding: 0 4px;
    }

    .goods-snippet .btns .add-cart {
        display: flex;
        width: 52px;
        min-width: 52px;
        height: 48px;
    }

    .goods-snippet .btns .add-cart span {
        display: none;
    }

    .goods-snippet .btns .bye {
        min-height: 48px;
    }
}

/* --- ≥1024px --- */
@media screen and (min-width: 1024px) {
    :root {
        --product-card-gap: 12px;
    }

    .catalog-container .main-container .good-list,
    .good-list,
    .goods-list,
    .selection-mark .vehicle-results {
        gap: 12px 16px;
    }

    .country.country--flag-only img {
        width: 34px;
    }

    .goods-snippet h3 {
        font-size: 16px;
    }

    .goods-snippet .price p {
        font-size: 18px;
    }
}

/* --- ≥1280px: 4 колонки --- */
@media screen and (min-width: 1280px) {
    :root {
        --product-card-gap: 12px;
        --product-card-slide-width: calc(25% - 9px);
    }

    .catalog-container .main-container .good-list,
    .good-list,
    .goods-list,
    .selection-mark .vehicle-results {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px 18px;
    }

    .goods-snippet {
        padding: 12px 12px 16px;
    }

    .goods-snippet .image-box {
        height: 190px;
    }

    .goods-snippet h3 {
        font-size: 17px;
        padding: 0 8px;
    }

    .goods-snippet .params,
    .goods-snippet .reviews,
    .goods-snippet .price,
    .goods-snippet .btns {
        padding-left: 16px;
        padding-right: 16px;
    }

    .goods-snippet .params p {
        font-size: 13px;
        line-height: 1.25;
    }
}

/* Перебиваем фиксированные колонки из catalog.css / style.css / index.css */
@media screen and (max-width: 767px) {
    .catalog-container .main-container .good-list,
    .goods-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: var(--product-card-gap) !important;
    }

    .catalog-container .main-container .good-list .goods-snippet,
    .goods-list .goods-snippet {
        min-width: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .hit-slider .slides > .goods-snippet,
    .goods-slider .slides > .goods-snippet,
    .viewed .slides > .goods-snippet {
        flex-basis: var(--product-card-slide-width) !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
    .catalog-container .main-container .good-list,
    .goods-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px 14px !important;
    }

    .catalog-container .main-container .good-list .goods-snippet,
    .goods-list .goods-snippet {
        min-width: 0 !important;
        width: 100% !important;
    }
}

/* index.css / style.css — сброс фиксированной ширины карточек вне слайдера */
.hit-slider .slides .goods-snippet,
.goods-slider .slides .goods-snippet,
.viewed .slides .goods-snippet,
.good-list .goods-snippet,
.goods-list .goods-snippet {
    min-width: 0 !important;
}

.goods-snippet .image-box .no-photo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    height: 100%;
    color: #b3b3b3;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

.goods-snippet .image-box .no-photo::before {
    width: 56px;
    height: 56px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M3 17l5-4.5 4 3.5 3-2.5 6 5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M3 17l5-4.5 4 3.5 3-2.5 6 5'/%3E%3C/svg%3E") center / contain no-repeat;
    content: "";
}

/* End */


/* Start:/local/templates/akumulyator_template/css/responsive.css?17931952878256*/
/**
 * Глобальный адаптив сайта (mobile-first overrides).
 * Подключается последним — перебивает desktop-first base из style.css и page CSS.
 */

:root {
    --page-gutter: clamp(16px, 4vw, 40px);
    --page-gutter-sm: clamp(10px, 3.5vw, 16px);
    --mobile-bar-h: calc(56px + env(safe-area-inset-bottom, 0px));
    --slide-w: min(85vw, 320px);
}

/* --- базовые ограничения --- */
img,
video,
svg,
picture {
    max-width: 100%;
}

table {
    max-width: 100%;
}

/* --- контейнеры --- */
/* .wrapper,
main .wrapper,
header .wrapper,
footer .wrapper,
footer .content {
    width: min(1840px, calc(100% - 2 * var(--page-gutter-sm))) !important;
    max-width: 1840px;
    margin-inline: auto;
    box-sizing: border-box;
}

@media screen and (min-width: 768px) {
    .wrapper,
    main .wrapper,
    header .wrapper,
    footer .wrapper,
    footer .content {
        width: min(1840px, calc(100% - 2 * var(--page-gutter))) !important;
    }
} */

/* нижняя панель на телефоне */
@media screen and (max-width: 767px) {
    main {
        padding-bottom: var(--mobile-bar-h);
    }

    footer {
        padding-bottom: calc(var(--mobile-bar-h) + 8px);
    }
}

/* --- футер: убираем горизонтальный скролл на планшетах --- */
@media screen and (max-width: 1029px) {
    footer .content {
        flex-direction: column;
        gap: 24px;
    }

    footer .content nav {
        min-width: 0 !important;
        width: 100% !important;
        flex-wrap: wrap;
        gap: 16px 28px;
        justify-content: flex-start;
    }
}

/* Карточки товаров — единые правила в catalog-cards.css */

/* --- поиск --- */
@media screen and (max-width: 767px) {
    .goods-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 2px !important;
        margin-bottom: 60px;
    }

    h1.wrapper {
        font-size: clamp(18px, 5.5vw, 22px) !important;
        margin-bottom: 20px !important;
    }
}

@media screen and (max-width: 479px) {
    .search-empty,
    .search-language-guess {
        font-size: 14px;
        line-height: 1.4;
    }
}

/* --- корзина --- */
@media screen and (max-width: 1279px) {
    .card {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: unset !important;
    }

    .cart-page .list .goods .title {
        min-width: 0 !important;
        max-width: 100% !important;
        flex: 1 1 auto;
    }
}

@media screen and (max-width: 767px) {
    .cart-page .list .goods {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .cart-page .list .goods img {
        width: 100%;
        max-width: 140px;
        height: auto;
    }

    .cart-page .list .goods .count,
    .cart-page .list .goods .price {
        width: 100%;
    }
}

/* --- оформление заказа --- */
@media screen and (max-width: 991px) {
    .ordering .column .phone,
    .ordering .column input,
    .ordering .column button:not(.prev) {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100%;
    }

    .ordering .column {
        flex-direction: column;
    }
}

/* --- сравнение: компактнее на телефоне --- */
@media screen and (max-width: 767px) {
    .compare-block .table table tr th,
    .compare-block .table table tr td {
        width: min(68vw, 180px) !important;
        min-width: min(68vw, 180px) !important;
    }

    .compare-block .table table tr th:first-child,
    .compare-block .table table tr td:first-child {
        width: min(34vw, 120px) !important;
        min-width: min(34vw, 120px) !important;
    }
}

/* --- шапка: поиск не шире экрана --- */
@media screen and (max-width: 1279px) {
    header .center .form-wrapper form {
        min-width: 0 !important;
        max-width: min(400px, calc(100vw - 32px)) !important;
        width: min(400px, calc(100vw - 32px)) !important;
    }
}

/* --- форма «Задать вопрос» --- */
@media screen and (max-width: 1279px) {
    .form-question form {
        flex-direction: column;
        align-items: stretch;
    }

    .form-question form label {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100%;
    }

    .form-question form > textarea {
        max-width: 100%;
        width: 100%;
    }

    .form-question form button {
        width: 100%;
        max-width: 100%;
        padding-inline: 20px;
    }
}

/* --- 404 --- */
.error {
    flex-wrap: wrap;
    gap: clamp(16px, 4vw, 40px);
    width: min(1120px, calc(100% - 2 * var(--page-gutter-sm))) !important;
    box-sizing: border-box;
}

.error .item {
    min-width: 0 !important;
    flex: 1 1 240px;
}

.error img {
    min-width: 0 !important;
    width: min(100%, 330px);
    height: auto;
}

.error .item h1 {
    font-size: clamp(72px, 22vw, 200px) !important;
    line-height: 0.95;
}

.error .item p {
    font-size: clamp(16px, 4.5vw, 31px) !important;
}

/* --- типографика заголовков --- */
@media screen and (max-width: 767px) {
    h1,
    h1.wrapper {
        font-size: clamp(20px, 6vw, 28px) !important;
        line-height: 1.2;
    }

    h2 {
        font-size: clamp(16px, 4.8vw, 22px);
        line-height: 1.25;
    }
}

/* --- модальные окна --- */
@media screen and (max-width: 767px) {
    .window,
    .modal-content,
    .request-call,
    .click-buy,
    .add-review {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        margin-inline: auto;
        box-sizing: border-box;
    }
}

/* --- таблицы и широкий контент --- */
.content-table-wrap,
.bx-composite-wrap,
.desc,
.about-text,
.news-detail-text {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

/* --- каталог: фильтр поверх контента на планшете/телефоне --- */
@media screen and (max-width: 1279px) {
    .catalog-container aside {
        max-width: min(400px, calc(100vw - 20px));
    }

    .catalog-container .main-container .aside-button {
        position: fixed;
        bottom: calc(var(--mobile-bar-h) + 8px);
        z-index: 9;
    }
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
    .catalog-container .main-container .aside-button {
        bottom: 16px;
    }
}

/* --- промо и блоки главной --- */
@media screen and (max-width: 767px) {
    .promo-block,
    .banner-block,
    .advantages-block {
        max-width: 100%;
        overflow: hidden;
    }

    .promo-block img,
    .banner-block img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }
}

/* --- нижняя панель (телефон + мессенджеры): на узких экранах помещается целиком --- */
@media screen and (max-width: 400px) {
    .mobile-menu {
        gap: 6px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .mobile-menu .phone {
        font-size: 12px;
        min-width: 0;
    }

    .mobile-menu .social {
        gap: 4px;
        flex-shrink: 0;
    }

    .mobile-menu .social a {
        width: 28px;
        height: 28px;
    }
}

@media screen and (max-width: 340px) {
    .mobile-menu .phone > span {
        display: none;
    }
}

/* --- кнопка «Фильтры» на телефоне: в потоке над списком, а не поверх карточек --- */
@media screen and (max-width: 767px) {
    .catalog-container .main-container .aside-button {
        position: static;
        margin: 0 0 12px;
        padding: 0;
    }

    .catalog-container .main-container .aside-button button {
        position: static;
        width: 100%;
        min-height: 44px;
        box-shadow: none;
    }
}

/* --- фильтр: подписи шкал и ссылки не мельче 12px --- */
.catalog-container aside .range-ticks span,
.catalog-container .choose-brand .item a {
    font-size: 12px !important;
}

/* End */


/* Start:/local/templates/akumulyator_template/front/style.css?1793654130122892*/
main {
	max-width: 1440px;
	padding: 0 20px;
	margin: 0 auto;
	width: 100%;
}

header {
	max-width: none;
	padding: 0;
	margin: 0;
	width: 100%;
	z-index: 200;
}

header .container {
	max-width: 1440px;
	padding: 0 20px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}

main {
	padding-top: 212px;
}

@media (max-width: 1030px) {
	main {
		padding-top: 179px;
	}
}

@media (max-width: 768px) {
	main {
		padding-top: 112px;
	}
}

main main {
	padding: 0;
}

footer,
.form-question {
	max-width: 1400px;
	padding: 0 20px;
	margin: 0 auto;
	width: 100%;
}

@media (max-width: 768px) {
	main,
	footer,
	header .container,
	.form-question {
		padding-left: 10px;
		padding-right: 10px;
	}
}

.form-question {
	border-radius: 12px 12px 0 0;
	padding-top: 20px;
	padding-bottom: 20px;
}

.wrapper {
	width: 100% !important;
}

header {
	position: fixed;
	left: 50%;
	transform: translateX(-50%);
}

header .center .wrapper .phone a span {
	margin-right: 4px;
}

header .top {
	padding-left: 12px;
	padding-right: 12px;
	border-radius: 0 0 12px 12px;
}

@media (max-width: 1440px) {
	header .top {
		margin-left: -20px;
		margin-right: -20px;
	}
}

@media (max-width: 768px) {
	header .top {
		margin-left: -10px;
		margin-right: -10px;
	}
}
header .social p,
.catalog-menu .mobile-block p {
	animation: none !important;
	text-shadow: none !important;
	transform: none !important;
}

header .social p::before,
.catalog-menu .mobile-block p::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 6px;
	border-radius: 50%;
	background: #ffd633;
	animation: pulseDot 2s ease-out infinite;
}

@keyframes pulseDot {
	0% {
		box-shadow: 0 0 0 0 rgba(255, 214, 51, 0.6);
	}
	70%,
	100% {
		box-shadow: 0 0 0 7px rgba(255, 214, 51, 0);
	}
}

.promo.wrapper .item.slider {
	display: flex;
	flex-direction: column;
}

.promo.wrapper .item.slider .slides.ws-slider-slides {
	height: 100%;
}

.promo.wrapper .item.slider img {
	height: 95%;
}
.why-choose .slider {
	overflow: hidden;
}

@media screen and (min-width: 1280px) {
	main section.why-choose .slider .slides .slide {
		min-width: calc(18 * var(--dvw));
		width: calc(18 * var(--dvw));
		padding: calc(1.8 * var(--dvw)) 40px calc(2.2 * var(--dvw));
		gap: calc(1.1 * var(--dvw));
	}
	main section.why-choose .slider .slides .slide > div:first-child p {
		font-size: calc(3.6 * var(--dvw));
	}
	main section.why-choose .slider .slides .slide > div:first-child span {
		font-size: calc(0.8 * var(--dvw));
		line-height: calc(1 * var(--dvw));
	}
	main section.why-choose .slider .slides .slide > div:last-child img {
		max-width: calc(7.1 * var(--dvw));
	}
	main section.why-choose .slider .slides .slide > div:last-child .stars {
		max-width: calc(6.6 * var(--dvw));
	}
	main
		section.why-choose
		.slider
		.slides
		.slide
		> div:last-child
		.stars
		div
		span {
		width: calc(1.33 * var(--dvw));
		height: calc(1.33 * var(--dvw));
	}
	main
		section.why-choose
		.slider
		.slides
		.slide
		> div:last-child
		.stars
		div
		span::before {
		font-size: calc(1.33 * var(--dvw));
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	main section.why-choose .slider .slides .slide {
		min-width: 280px;
		width: 280px;
		padding: 22px 26px 26px;
		gap: 12px;
	}
	main section.why-choose .slider .slides .slide > div:first-child p {
		font-size: 48px;
	}
	main section.why-choose .slider .slides .slide > div:first-child span {
		font-size: 14px;
		line-height: 17px;
	}
	main section.why-choose .slider .slides .slide > div:last-child img {
		max-width: 105px;
	}
	main section.why-choose .slider .slides .slide > div:last-child .stars {
		max-width: 88px;
	}
	main
		section.why-choose
		.slider
		.slides
		.slide
		> div:last-child
		.stars
		div
		span {
		width: 17px;
		height: 17px;
	}
	main
		section.why-choose
		.slider
		.slides
		.slide
		> div:last-child
		.stars
		div
		span::before {
		font-size: 17px;
	}
}

.why-choose .slider .slides {
	flex-wrap: wrap;
	justify-content: center;
}
.why-choose .slider .bubbles {
	display: none;
}

@media screen and (max-width: 767px) {
	header .services .sub-menu,
	header .delivery .sub-menu {
		display: flex;
		flex-direction: column;
		gap: 15px !important;
		padding: 18px 25px !important;
	}
	header .services .sub-menu a,
	header .delivery .sub-menu a {
		padding: 0 7px 13px 4px !important;
		margin: 0 !important;
		font-size: 15px;
		line-height: 18px;
		font-weight: 700;
		text-transform: uppercase;
		color: #252525;
		border-bottom: 1px solid #dfdfdf !important;
	}
	header .services .sub-menu a:last-child,
	header .delivery .sub-menu a:last-child {
		padding-bottom: 0 !important;
		border-bottom: none !important;
	}
}

@media screen and (min-width: 768px) {
	header .services .sub-menu,
	header .delivery .sub-menu {
		gap: 15px !important;
	}
	header .services .sub-menu a,
	header .delivery .sub-menu a {
		margin: 0 !important;
		padding: 0 7px 15px 4px !important;
		font-size: 15px !important;
		line-height: 18px !important;
		font-weight: 700 !important;
		text-transform: uppercase;
		color: #252525;
		border-bottom: 1px solid #dfdfdf !important;
	}
	header .services .sub-menu a:first-child,
	header .delivery .sub-menu a:first-child {
		margin-top: 20px !important;
	}
	header .services .sub-menu a:last-child,
	header .delivery .sub-menu a:last-child {
		margin-bottom: 7px !important;
		border-bottom: none !important;
	}
}

@media screen and (min-width: 1280px) {
	header .services .sub-menu a,
	header .delivery .sub-menu a {
		font-size: 12px !important;
		line-height: 15px !important;
		padding-bottom: 12px !important;
	}
}

.brand-list {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.brand-list .item {
	min-width: 0;
	padding-left: 12px !important;
	padding-right: 10px !important;
	gap: 9px !important;
}
.brand-list .item .content {
	min-width: 0;
}
.brand-list .item .content span {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.brand-list.show {
	max-height: 1000px;
	overflow-y: auto !important;
}

.brand-list {
	scrollbar-gutter: stable;
	margin-right: -14px;
}
.brand-list::-webkit-scrollbar {
	width: 14px;
}
.brand-list::-webkit-scrollbar-track {
	background: transparent;
}
.brand-list::-webkit-scrollbar-thumb {
	background: #c4c4c4;
	background-clip: padding-box;
	border: 3px solid transparent;
	border-left-width: 5px;
	border-radius: 8px;
}
.brand-list::-webkit-scrollbar-thumb:hover {
	background: #9a9a9a;
	background-clip: padding-box;
}
@supports not selector(::-webkit-scrollbar) {
	.brand-list {
		scrollbar-width: thin;
		scrollbar-color: #bdbdbd transparent;
		margin-right: -8px;
	}
}

aside .block:not(:last-of-type) .list {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
aside .block:not(:last-of-type) .list .item {
	min-width: 0;
	padding-left: 12px !important;
	padding-right: 10px !important;
	gap: 10px !important;
}
aside .block:not(:last-of-type) .list .item .content {
	min-width: 0;
}
aside .block:not(:last-of-type) .list .item .content span {
	overflow-wrap: anywhere;
}
aside .block:not(:last-of-type) .list .item .checkbox {
	min-width: 0;
	max-width: 100%;
}
aside .block:not(:last-of-type) .list .item .checkbox label {
	min-width: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
}

aside .block .list .item .checkbox label::before {
	flex-shrink: 0;
}

aside .block .list:last-child {
	max-height: none !important;
}

.filter-search {
	margin-bottom: 10px;
}
.filter-search input {
	width: 100%;
	height: 36px;
	padding: 0 12px;
	border: 1px solid #dfdfdf;
	border-radius: 8px;
	background: #fff;
	font-size: 13px;
	color: #252525;
	outline: none;
	transition: border-color 0.2s;
}
.filter-search input:focus {
	border-color: #252525;
}
.filter-search input::placeholder {
	color: #ababab;
}
.brand-list .item[hidden] {
	display: none !important;
}
.block.searching .brand-list {
	max-height: 1000px !important;
	overflow-y: auto !important;
}
.block.searching button.more {
	display: none !important;
}
.filter-empty {
	padding: 4px 10px 10px;
	font-size: 13px;
	color: #ababab;
}
.filter-empty[hidden] {
	display: none;
}

aside .block p.head {
	margin-bottom: 10px !important;
}

aside .block .list .item {
	padding: 10px 10px 10px 12px !important;
	gap: 10px !important;
	min-height: 40px;
	box-sizing: border-box;
	border-radius: 10px !important;
	align-items: center !important;
}
aside .block .list .item .checkbox label,
aside .block .list .item .content span {
	font-size: 12px !important;
	line-height: 14px !important;
}

.filter-search input {
	padding-left: 34px;
	background: #fff
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ababab' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M20 20l-4.8-4.8'/%3E%3C/svg%3E")
		no-repeat 11px center;
}
.filter-search input:focus {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23252525' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M20 20l-4.8-4.8'/%3E%3C/svg%3E");
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet {
	padding: 14px 14px 16px;
	border: 1px solid #e3e6ea;
	border-radius: 12px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
	transition:
		box-shadow 0.2s,
		border-color 0.2s;
}

.reviews.tile-rating-brand {
	display: none !important;
}

.product .option {
	justify-content: end !important;
}

.product .option .reviews {
	display: none !important;
}

.product .price-block .checkbox, 
.product .price-block .ah {
	display: none !important;
}

.product .price-block {
	display: flex;
	flex-direction: column;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet:hover {
	border-color: #cfd4da;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top {
	justify-content: flex-start;
	gap: 8px;
	padding: 0;
	margin-bottom: 0;
	min-height: 24px;
	padding-right: 52px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top
	.tag {
	margin-left: 0;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box {
	position: static;
	height: clamp(150px, 16vw, 200px);
	margin: 4px 0 12px;
	padding: 0;
	width: 90%;
	margin: 0 auto;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.favorite,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.compare {
	position: absolute;
	right: 12px;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #e3e6ea;
	border-radius: 8px;
	transition:
		border-color 0.2s,
		background 0.2s;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.favorite {
	top: 12px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.compare {
	top: 56px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.favorite:hover,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.compare:hover {
	border-color: #252525;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	h3 {
	order: 1;
	padding: 0;
	margin: 0 0 8px;
	font-size: 16px;
	line-height: 1.3;
	font-weight: 700;
	color: #252525;
	-webkit-line-clamp: 3;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.reviews {
	order: 2;
	padding: 0;
	margin: 0 0 10px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.reviews
	.stars
	span {
	width: 20px;
	height: 20px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.reviews
	.stars
	span::before {
	font-size: 20px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.reviews
	.tile-brand {
	max-width: 80px;
	max-height: 26px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params {
	order: 3;
	padding: 0;
	gap: 0;
	margin: 0 0 14px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params
	p {
	justify-content: flex-start;
	gap: 5px;
	padding: 4px 8px;
	font-size: 13px;
	line-height: 1.3;
	color: #4a4f55;
	border-radius: 4px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params
	p:nth-child(odd) {
	background: #fff6d6;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params
	p
	span {
	font-weight: 700;
	color: #252525;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.card-footer {
	order: 4;
	display: flex;
	flex-direction: column-reverse;
	gap: 14px;
	margin-top: auto;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price {
	padding: 0 4px;
	margin: 0;
	align-items: baseline;
	gap: 4px 10px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price
	p {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.1;
	color: var(--important-info);
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price
	p.old {
	font-size: 15px;
	font-weight: 500;
	color: #8a9099;
}

@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet {
		padding: 10px 10px 12px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box {
		height: clamp(110px, 32vw, 150px);
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		h3 {
		font-size: 14px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.reviews
		.stars
		span {
		width: 14px;
		height: 14px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.reviews
		.stars
		span::before {
		font-size: 14px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.params
		p {
		font-size: 12px;
		padding: 3px 6px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p {
		font-size: 20px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p.old {
		font-size: 13px;
	}
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.btns,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top {
	padding-left: 0;
	padding-right: 0;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top {
	padding-right: 52px;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet:hover,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.btns
	.add-cart,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.btns
	.bye,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.btns
	button {
	box-shadow: none !important;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.btns
	.add-cart::before {
	margin-right: 0 !important;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet {
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04) !important;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet:hover {
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08) !important;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet {
	position: relative;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top {
	position: absolute;
	top: 14px;
	left: 14px;
	right: 60px;
	z-index: 3;
	min-height: 0;
	padding: 0;
	margin: 0;
	pointer-events: none;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top
	> * {
	pointer-events: auto;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box {
	margin-top: 0;
	padding-top: 0;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.favorite,
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.image-box
	button.compare {
	z-index: 3;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.top {
		top: 10px;
		left: 10px;
		right: 52px;
	}
}

@media screen and (min-width: 1280px) {
	.catalog-container .main-container .good-list {
		gap: 4px !important;
	}
}

.choose-brand .item {
	position: relative;
	cursor: pointer;
}
.choose-brand .item a::after {
	content: "";
	position: absolute;
	inset: 0;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price {
	min-height: 58px;
	align-content: flex-start;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price {
		min-height: 46px;
	}
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.card-footer {
	flex-direction: column;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params
	p {
	padding: 1px 6px !important;
	line-height: 1.25;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top {
	align-items: center;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top
	.country {
	display: flex;
	flex: 0 0 auto;
	width: auto;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top
	.country
	img {
	flex-shrink: 0;
	max-width: none;
	object-fit: contain;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.top
		.country
		img {
		width: 20px;
		height: 15px;
	}
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.top
	.country
	img {
	width: 22px;
	height: auto;
	aspect-ratio: 4 / 3;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.top
		.country
		img {
		width: 16px;
		height: 12px;
	}
}
@media screen and (min-width: 1024px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.top
		.country
		img {
		width: 26px;
	}
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price {
	flex-wrap: nowrap;
	align-items: baseline;
	gap: 8px;
	min-height: 30px;
	white-space: nowrap;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price
	p {
	font-size: 22px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price
	p.old {
	font-size: 14px;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price {
		min-height: 24px;
		gap: 5px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p {
		font-size: 15px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p.old {
		font-size: 11px;
	}
}

a.goods-snippet {
	color: inherit;
	text-decoration: none;
}

aside .block .list.one-col {
	grid-template-columns: minmax(0, 1fr) !important;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.card-footer {
	gap: 6px;
}
:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.price {
	min-height: 26px;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price {
		min-height: 22px;
	}
}

aside .block .list .item {
	padding: 6px 8px 6px 10px !important;
	min-height: 34px;
	gap: 8px !important;
}

aside .block .list {
	gap: 5px !important;
}

.good-list[hidden] {
	display: none !important;
}

@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns {
		flex-direction: row !important;
		gap: 6px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns
		.add-cart {
		flex: 0 0 44px;
		width: 44px !important;
		min-width: 44px !important;
		height: 44px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns
		.add-cart
		span {
		display: none !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns
		.bye {
		flex: 1 1 auto;
		min-width: 0;
		min-height: 44px !important;
		padding: 0 6px;
		font-size: 12px !important;
		line-height: 1.1;
	}
}

@media screen and (max-width: 767px) {
	header .services > button:hover,
	header .delivery > button:hover,
	header .services > button:focus-visible,
	header .delivery > button:focus-visible {
		border: none !important;
		outline: 1.6px solid rgb(255, 214, 51);
		outline-offset: 1px;
	}
}

aside .mobile-head .title {
	margin: 0 !important;
}

.promo-block .bubbles {
	margin-bottom: 10px !important;
}
@media screen and (max-width: 767px) {
	.promo-block .bubbles {
		margin-bottom: 6px !important;
	}
	.promo-block h1 {
		line-height: 1.15 !important;
	}
}

aside .mobile-head .title {
	padding: 0 !important;
}

@media screen and (max-width: 766px) {
	.main-container .result {
		margin-bottom: 0 !important;
	}
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	.params
	p {
	justify-content: space-between;
}

:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
	.goods-snippet
	h3 {
	min-height: 3.9em;
}
@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price {
		gap: 4px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p {
		font-size: 13px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p.old {
		font-size: 10px;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.params
		p {
		font-size: 11px;
		gap: 3px;
	}
}

@media screen and (max-width: 767px) {
	main section.why-choose .slider .slides .slide > div:first-child span {
		font-size: 11px !important;
		line-height: 13px !important;
	}
}

.list:has(> .vehicle-item) > .item.more {
	height: auto !important;
	min-height: 76px;
	align-self: stretch;
}
.list:has(> .vehicle-item) > .item.more span {
	font-size: 11px;
	font-weight: 700;
	line-height: 13px;
}
@media screen and (min-width: 768px) {
	.list:has(> .vehicle-item) > .item.more {
		min-height: 110px;
	}
	.list:has(> .vehicle-item) > .item.more span {
		font-size: 12px;
		line-height: 15px;
	}
}

@media screen and (max-width: 767px) {
	header .form-wrapper #title-search {
		left: 20px !important;
		right: auto !important;
		width: calc(100% - 40px) !important;
		max-width: 420px;
		min-width: 0 !important;
		margin: 0 !important;
	}
}

@media screen and (max-width: 1279px) {
	footer .content {
		padding-top: 24px;
	}
}

@media screen and (max-width: 767px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet {
		padding: 8px 8px 10px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		h3,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.reviews,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.params,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.params
		p {
		padding: 1px 4px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.top {
		left: 8px;
		top: 8px;
	}
}

.ws-slider-previous,
.ws-slider-next {
	top: 50% !important;
	bottom: auto !important;
}
.ws-slider-previous {
	transform: translateY(-50%) !important;
}
.ws-slider-next {
	transform: translateY(-50%) rotate(180deg) !important;
}

@media screen and (max-width: 767px) {
	.catalog-menu .mobile-block {
		padding-bottom: 6px;
	}
	.catalog-menu .mobile-block .request-call-btn {
		min-height: 0 !important;
		height: 52px !important;
		padding: 0 16px !important;
		gap: 12px !important;
		margin-bottom: 8px !important;
		border-radius: 12px !important;
		font-size: 16px !important;
		box-shadow: none !important;
	}
	.catalog-menu .mobile-block .request-call-btn::before {
		font-size: 22px !important;
	}
	.catalog-menu .mobile-block > span {
		margin-bottom: 14px !important;
		font-size: 14px !important;
		line-height: 17px !important;
		color: #6b6b6b;
	}
	.catalog-menu .mobile-block .links {
		margin-bottom: 12px !important;
	}
	.catalog-menu .mobile-block .links a {
		width: 44px !important;
		height: 44px !important;
	}
	.catalog-menu .mobile-block > p {
		margin: 0 !important;
		font-size: 13px !important;
		line-height: 16px !important;
		color: #6b6b6b;
	}
}

html.menu-open {
	overflow-y: scroll !important;
	overscroll-behavior: none;
}
html.menu-open body {
	position: fixed !important;
	top: calc(-1 * var(--lock-y, 0px)) !important;
	left: 0;
	right: 0;
	width: 100%;
}

@media screen and (max-width: 767px) {
	.basket-items-list {
		padding: 0 !important;
	}
	.basket-items-list-table {
		border-spacing: 0 !important;
		width: 100%;
	}
	.basket-items-list-table tbody {
		gap: 10px;
	}
	.basket-items-list-item-container {
		display: grid !important;
		grid-template-columns: 88px minmax(0, 1fr) !important;
		grid-template-rows: auto auto !important;
		gap: 8px 12px !important;
		align-items: start !important;
		padding: 12px !important;
		width: 100%;
		box-sizing: border-box;
	}
	.basket-items-list-item-container .basket-item-block-image {
		grid-column: 1 !important;
		grid-row: 1 !important;
		width: 88px !important;
		height: 88px !important;
		margin: 0 !important;
		box-sizing: border-box;
		overflow: hidden;
	}
	.basket-items-list-item-container .basket-item-image-link {
		display: block;
		width: 100%;
		height: 100%;
	}
	.basket-items-list-item-container .basket-item-image {
		width: 100% !important;
		height: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		margin: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-sizing: border-box;
		object-fit: contain;
	}
	.basket-items-list-item-container
		.basket-items-list-item-notification-inner {
		grid-column: 1 / -1 !important;
		grid-row: 1 / -1 !important;
		width: 100% !important;
		box-sizing: border-box;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-container {
		width: 100% !important;
		box-sizing: border-box;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-container
		> div:first-child {
		height: auto !important;
		padding: 0 0 8px;
		font-size: 14px;
		line-height: 20px;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-container
		strong {
		display: inline;
		font: inherit;
		font-weight: 600;
		line-height: inherit;
	}
	.basket-items-list-item-container .basket-items-list-item-removed-block {
		height: auto !important;
	}
	.basket-items-list-item-container .basket-items-list-item-removed-block a {
		font-weight: 600;
	}
	.basket-items-list-item-container .basket-item-block-info {
		grid-column: 2 !important;
		grid-row: 1 !important;
		margin: 0 !important;
		padding-right: 26px;
	}
	.basket-items-list-item-container .basket-item-info-name {
		margin: 0 0 6px !important;
		padding: 0 28px 0 0 !important;
		font-size: 14px !important;
		line-height: 18px !important;
	}
	.basket-items-list-item-container .basket-item-info-name-link {
		padding: 0 !important;
	}
	.basket-items-list-item-container .basket-item-block-properties,
	.basket-items-list-item-container .basket-item-property {
		font-size: 12px !important;
		line-height: 15px !important;
		padding-bottom: 0 !important;
	}
	.basket-items-list-item-container .basket-item-block-amount {
		grid-column: 1 / 2 !important;
		grid-row: 2 !important;
		width: auto !important;
		padding: 0 !important;
		justify-content: flex-start !important;
		align-self: center;
	}
	.basket-items-list-item-container .basket-item-block-price.price {
		grid-column: 2 !important;
		grid-row: 2 !important;
		align-self: center;
		margin: 0 !important;
		align-items: flex-end;
	}
	.basket-items-list-item-container .basket-item-price-current-text {
		font-size: 17px !important;
		font-weight: 700;
	}
	.basket-items-list-item-container .basket-item-actions-remove.close {
		top: 10px !important;
		right: 10px !important;
	}
}

.bx-sbb-empty-cart-container {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 40px 24px !important;
	text-align: center;
	border-radius: 16px;
}
.bx-sbb-empty-cart-container::before {
	content: "";
	width: 64px;
	height: 64px;
	margin-bottom: 8px;
	opacity: 0.55;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23252525' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h3l2.7 11.4a1.5 1.5 0 0 0 1.5 1.1h8.6a1.5 1.5 0 0 0 1.5-1.1L21 7H6'/%3E%3C/svg%3E")
		center / contain no-repeat;
}
.bx-sbb-empty-cart-container .bx-sbb-empty-cart-image {
	display: none;
}
.bx-sbb-empty-cart-container .bx-sbb-empty-cart-text {
	width: auto;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
}
.bx-sbb-empty-cart-container .bx-sbb-empty-cart-desc {
	font-size: 15px;
	line-height: 22px;
	color: #6b6b6b;
}
.bx-sbb-empty-cart-container .bx-sbb-empty-cart-desc a {
	font: inherit;
	font-weight: 600;
	color: var(--text);
	text-decoration: underline;
	text-underline-offset: 3px;
}
main:has(.bx-sbb-empty-cart-container) {
	padding-bottom: 24px !important;
}
.cart-page:has(.bx-sbb-empty-cart-container) {
	margin-bottom: 0 !important;
}
* {
	-webkit-tap-highlight-color: transparent;
}
a,
button,
input,
select,
textarea,
label,
summary,
[role="button"],
[tabindex] {
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
}
a:focus,
button:focus,
[tabindex]:focus {
	outline: none;
}
@keyframes akumTopLine {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@media (max-width: 1279px) {
	header .top .wrapper.slides {
		display: flex !important;
		width: max-content !important;
		max-width: none !important;
		padding: 0 !important;
		margin: 0 !important;
		gap: 0 !important;
		left: 0 !important;
		white-space: nowrap;
		animation: akumTopLine 24s linear infinite;
		will-change: transform;
	}
	header .top .wrapper.slides .slide {
		flex: 0 0 auto;
		position: static !important;
		padding-right: 40px;
		box-sizing: content-box;
	}
}
@media (min-width: 1280px) {
	header .top .wrapper.slides .slide[aria-hidden="true"] {
		display: none !important;
	}
}
@media screen and (max-width: 767px) {
	.basket-items-list-item-container
		.basket-items-list-item-notification-inner {
		display: flex !important;
		flex-direction: column;
		justify-content: center;
		padding: 4px 2px;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-container
		> div:first-child {
		padding: 0 0 14px !important;
		font-size: 14px;
		line-height: 20px;
		color: #6b6b6b;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-container
		strong {
		display: block;
		margin-bottom: 4px;
		font-size: 15px;
		line-height: 20px;
		font-weight: 700;
		color: var(--text);
	}
	.basket-items-list-item-container .basket-items-list-item-removed-block {
		display: block !important;
	}
	.basket-items-list-item-container .basket-items-list-item-removed-block a {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		box-sizing: border-box;
		width: 100%;
		padding: 12px 16px;
		border: 1.5px solid var(--text);
		border-radius: 12px;
		font-size: 15px;
		font-weight: 600;
		line-height: 20px;
		color: var(--text);
		text-decoration: none;
	}
	.basket-items-list-item-container
		.basket-items-list-item-removed-block
		a::before {
		content: "";
		flex: 0 0 18px;
		width: 18px;
		height: 18px;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23252525' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E")
			center / contain no-repeat;
	}
}
main:has(.basket-checkout-container) {
	padding-bottom: 24px !important;
}
.cart-page:has(.basket-checkout-container) {
	margin-bottom: 0 !important;
}
.cart-page .basket-checkout-container {
	margin-bottom: 0 !important;
}
.basket-checkout-block-total-price {
	margin-bottom: 0 !important;
}
.basket-checkout-block-btn .basket-btn-checkout {
	display: block !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box;
	margin-top: 4px !important;
	box-shadow: none !important;
}
.basket-checkout-block-btn .basket-btn-checkout:hover,
.basket-checkout-block-btn .basket-btn-checkout:focus,
.basket-checkout-block-btn .basket-btn-checkout:active {
	box-shadow: none !important;
}
.card.bx-basket > .row:has(> .col > #basket-warning[style*="display: none"]) {
	display: none;
}
@media (max-width: 1279px) {
	.basket-checkout-container.basket-checkout-container-fixed {
		position: static !important;
		width: auto !important;
		height: auto !important;
		min-height: 0 !important;
		transform: none !important;
		top: auto !important;
		opacity: 1 !important;
		visibility: visible !important;
	}
}
.basket-item-amount-btn-minus::before,
.basket-item-amount-btn-plus::before {
	margin: 0 !important;
	top: auto !important;
	font-size: 14px;
	line-height: 14px;
	height: 14px;
	display: block;
	text-align: center;
}
@media screen and (max-width: 767px) {
	.cart-page .basket-checkout-container {
		padding: 20px !important;
	}
	.cart-page .basket-checkout-block-total {
		margin-bottom: 4px;
	}
	.cart-page .basket-checkout-block-total-price {
		margin-top: 12px !important;
	}
	.cart-page .basket-checkout-block-total::after {
		min-height: 0 !important;
		padding-top: 14px !important;
		font-size: 13px !important;
		line-height: 18px !important;
		font-weight: 500;
		content: "Оплата картой, наличными, частями:\A\A\A\A\A Привезем сегодня без оплаты. Первый платеж через месяц" !important;
		background-position:
			left 38px,
			33.333% 38px,
			66.666% 38px,
			right 38px !important;
		background-size: calc(25% - 6px) auto !important;
		padding-bottom: 4px;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container {
		flex-wrap: nowrap !important;
		gap: 16px !important;
		padding: 16px 20px !important;
		box-sizing: border-box;
		align-items: center;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image {
		flex: 0 0 auto !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		flex: 1 1 0 !important;
		min-width: 0 !important;
		width: auto !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-amount,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-price.price {
		flex: 0 0 auto !important;
		width: auto !important;
		margin: 0 !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-actions,
	.cart-page .basket-items-list-item-container .basket-item-actions-remove {
		flex: 0 0 auto !important;
		margin: 0 !important;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container {
		gap: 12px !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image-link,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image {
		width: 110px !important;
		min-width: 0 !important;
		max-width: 110px !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-amount {
		padding: 0 !important;
		width: auto !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-amount-btn-minus,
	.cart-page .basket-items-list-item-container .basket-item-amount-btn-plus,
	.cart-page
		.basket-items-list-item-container
		.basket-item-amount-filed-block,
	.cart-page .basket-items-list-item-container .basket-item-amount-filed {
		width: 34px !important;
		min-width: 0 !important;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-amount-field-description {
		padding: 0 6px !important;
		width: auto !important;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container {
		padding: 12px 16px 12px 12px !important;
		gap: 16px !important;
		border-radius: 16px;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image-link,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image {
		width: 104px !important;
		max-width: 104px !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image {
		height: 104px !important;
		padding: 4px !important;
		box-sizing: border-box;
		border-radius: 12px;
		overflow: hidden;
		background: #fff;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image-link,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image {
		height: 100% !important;
		margin: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		object-fit: contain;
	}
	.cart-page .basket-items-list-item-container .basket-item-info-name {
		font-size: 15px !important;
		line-height: 22px !important;
		margin-bottom: 6px !important;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-price.price {
		min-width: 90px;
		justify-content: flex-end;
		font-weight: 700;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-price-current-text {
		font-size: 17px !important;
		font-weight: 700;
		white-space: nowrap;
	}
	.cart-page .basket-items-list-item-container .basket-item-actions-remove {
		width: 40px !important;
		height: 40px !important;
		border-radius: 12px;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container {
		display: grid !important;
		grid-template-columns: 112px minmax(0, 1fr) auto !important;
		grid-template-rows: 1fr auto !important;
		gap: 12px 20px !important;
		align-items: stretch !important;
		position: relative;
		padding: 14px 16px 14px 14px !important;
		border-radius: 18px;
		transition: box-shadow 0.2s ease;
	}
	.cart-page .basket-items-list-item-container:hover {
		box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image {
		grid-column: 1 !important;
		grid-row: 1 / 3 !important;
		width: 112px !important;
		height: 112px !important;
		max-width: none !important;
		align-self: center;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image-link,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image {
		width: 100% !important;
		max-width: 100% !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		grid-column: 2 / 4 !important;
		grid-row: 1 !important;
		padding-right: 56px;
		align-self: start;
		display: block !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-info-name {
		font-size: 17px !important;
		line-height: 24px !important;
		margin-bottom: 6px !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-amount {
		grid-column: 2 !important;
		grid-row: 2 !important;
		justify-self: start;
		align-self: end;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-price.price {
		grid-column: 3 !important;
		grid-row: 2 !important;
		align-self: end;
		justify-self: end;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-price-current-text {
		font-size: 24px !important;
		line-height: 28px !important;
		font-weight: 700;
		white-space: nowrap;
	}
	.cart-page .basket-items-list-item-container .basket-item-actions-remove {
		position: absolute !important;
		top: 12px !important;
		right: 12px !important;
		width: 36px !important;
		height: 36px !important;
		margin: 0 !important;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container {
		grid-template-rows: auto auto !important;
		align-content: start;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image {
		align-self: start;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		min-height: 0 !important;
		height: auto !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-amount,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-price.price {
		align-self: center;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		margin: 0 !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-info-name-link {
		line-height: 24px !important;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		width: 100% !important;
		max-width: none !important;
	}
}
@media screen and (min-width: 1280px) {
	.cart-page .basket-items-list-item-container .basket-item-info-name {
		max-width: 560px;
	}
}
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	.cart-page .basket-items-list-item-container {
		display: grid !important;
		grid-template-columns: 104px minmax(0, 1fr) auto !important;
		grid-template-rows: auto auto !important;
		gap: 12px 18px !important;
		align-items: start !important;
		align-content: start;
		position: relative;
		padding: 14px 16px 14px 14px !important;
		border-radius: 18px;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-image {
		grid-column: 1 !important;
		grid-row: 1 / 3 !important;
		width: 104px !important;
		height: 104px !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 4px !important;
		box-sizing: border-box;
		overflow: hidden;
		border-radius: 12px;
		background: #fff;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image-link,
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-image
		.basket-item-image {
		width: 100% !important;
		height: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		object-fit: contain;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-info {
		grid-column: 2 / 4 !important;
		grid-row: 1 !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding-right: 56px;
		min-height: 0 !important;
		height: auto !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-info-name {
		max-width: 520px;
		font-size: 16px !important;
		line-height: 22px !important;
		margin-bottom: 6px !important;
	}
	.cart-page .basket-items-list-item-container .basket-item-block-amount {
		grid-column: 2 !important;
		grid-row: 2 !important;
		justify-self: start;
		align-self: center;
		margin: 0 !important;
		width: auto !important;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-block-price.price {
		grid-column: 3 !important;
		grid-row: 2 !important;
		justify-self: end;
		align-self: center;
		margin: 0 !important;
		width: auto !important;
	}
	.cart-page
		.basket-items-list-item-container
		.basket-item-price-current-text {
		font-size: 22px !important;
		line-height: 26px !important;
		font-weight: 700;
		white-space: nowrap;
	}
	.cart-page .basket-items-list-item-container .basket-item-actions-remove {
		position: absolute !important;
		top: 12px !important;
		right: 12px !important;
		width: 36px !important;
		height: 36px !important;
		margin: 0 !important;
	}
}
.cart-page .basket-items-list {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.cart-page .basket-items-list-table {
	width: 100%;
}
@media screen and (min-width: 768px) {
	.cart-page .basket-items-list-item-container .basket-item-block-amount {
		padding: 0 !important;
	}
}
@media screen and (min-width: 1280px) {
	.basket-checkout-container.basket-checkout-container-fixed {
		position: static !important;
		width: auto !important;
		height: auto !important;
		min-height: 0 !important;
		transform: none !important;
		top: auto !important;
		opacity: 1 !important;
		visibility: visible !important;
	}
	.card.bx-basket > .row:has(.basket-checkout-container) {
		position: sticky;
		top: 140px;
		align-self: start;
	}
	.card.bx-basket > .row:has(.basket-checkout-container) > .col {
		height: auto !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	.cart-page .basket-checkout-section-inner {
		grid-template-rows: auto auto 1fr !important;
		align-content: start !important;
		align-items: start !important;
	}
	.cart-page .basket-checkout-block-total-price {
		align-self: start !important;
		margin: 0 !important;
	}
	.cart-page .basket-checkout-block-total-price-inner {
		padding: 0 !important;
		min-height: 24px;
		align-items: center !important;
	}
	.cart-page .basket-checkout-block-total-price-inner,
	.cart-page .basket-checkout-block-total-price-inner * {
		line-height: 24px !important;
	}
	.cart-page .basket-checkout-block-btn {
		align-self: start !important;
	}
	.cart-page .basket-checkout-block-btn .basket-btn-checkout {
		margin-top: 16px !important;
	}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
	.cart-page .basket-checkout-block-total::after {
		content: "Оплата картой, наличными, частями:\A\A\A\A\A\A Привезем сегодня без оплаты. Первый платеж через месяц" !important;
		max-width: 464px;
		background-size: calc((100% - 24px) / 4) auto !important;
		background-position:
			left 36px,
			33.333% 36px,
			66.666% 36px,
			right 36px !important;
	}
}
.catalog-menu .mobile-block .links {
	justify-content: center !important;
	gap: 24px !important;
}
@media screen and (max-width: 1279.98px) {
	header .catalog-menu .window-body {
		top: var(--top-shift, 0px) !important;
	}
}
@media screen and (max-width: 767px) {
	.promo .big-slider > .slides {
		max-width: 100% !important;
	}
	.promo .big-slider .item.slider,
	.promo .big-slider .item.diagnostics,
	.promo .big-slider .item.delivery,
	.promo .big-slider .item.store,
	.promo .big-slider .item.selection,
	.promo .big-slider .item.payment {
		min-width: 100% !important;
		max-width: 100% !important;
	}
}
@media screen and (max-width: 767px) {
	.promo > .item.selection {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		height: 260px !important;
		min-height: 0 !important;
		flex: 0 0 auto;
		aspect-ratio: auto;
		box-sizing: border-box;
		background-size: cover !important;
		background-position: center !important;
	}
}
@media screen and (max-width: 767px) {
	.vin-selection .content {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: none !important;
	}
}
@media screen and (min-width: 768px) {
	.item.slider .slides-wrapper .arrow-l,
	.item.slider .slides-wrapper .arrow-r {
		top: var(--arrow-y, 50%) !important;
	}
}
@media screen and (max-width: 767px) {
	.promo > .item.cargo {
		padding: 12px 20px !important;
	}
	.promo > .item.cargo h2 {
		max-width: none !important;
	}
}
.selection-block.brands > .head {
	padding: 10px 16px !important;
	border-radius: 10px;
}
.selection-block.brands > .head p {
	font-weight: 600;
}
.selection-block.brands > .head > .wrapper {
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
}
@media screen and (min-width: 600px) and (max-width: 767px) {
	.promo {
		flex-direction: row !important;
		flex-wrap: wrap;
		align-items: stretch;
		gap: 10px !important;
	}
	.promo > .big-slider,
	.promo > .item.car,
	.promo > .item.selection {
		flex: 0 0 100% !important;
		width: 100% !important;
	}
	.promo > .item.cargo,
	.promo > .item.motorcycle,
	.promo > .item.boat,
	.promo > .item.charge,
	.promo > .item.used,
	.promo > .item.goods,
	.promo > .item.childish,
	.promo > .item.agm {
		flex: 0 0 calc(50% - 5px) !important;
		width: calc(50% - 5px) !important;
		min-width: 0 !important;
		max-width: none !important;
		box-sizing: border-box;
	}
}
@media screen and (max-width: 766px) {
	.selection-block.brands .items .item {
		height: auto !important;
		min-height: 0 !important;
		padding: 8px 6px 8px !important;
		box-sizing: border-box;
		justify-content: center;
	}
	.selection-block.brands .items .item p {
		height: auto !important;
		margin: 0 !important;
		line-height: 16px !important;
		text-align: center;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}
@media screen and (max-width: 766px) {
	.selection-block.brands .items {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		grid-auto-rows: 99px !important;
		grid-template-rows: none !important;
		row-gap: 8px !important;
	}
	.selection-block.brands .items:not(.open) {
		height: calc(99px * 3 + 8px * 2) !important;
		max-height: calc(99px * 3 + 8px * 2) !important;
	}
	.selection-block.brands .items .show-more {
		height: 99px !important;
		bottom: 0 !important;
		top: auto !important;
	}
}
@media screen and (max-width: 766px) {
	.selection-block.brands .items.open {
		padding-bottom: calc(99px + 8px) !important;
		box-sizing: content-box;
	}
	.selection-block.brands .items.open .show-less {
		height: 99px !important;
		bottom: 0 !important;
		top: auto !important;
	}
}
@media screen and (max-width: 766px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p:not(.old) {
		font-size: 14px !important;
		line-height: 20px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p.old {
		font-size: 10px !important;
	}
}
@media screen and (min-width: 440px) and (max-width: 766px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p:not(.old) {
		font-size: 16px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p.old {
		font-size: 12px !important;
	}
}
@media screen and (max-width: 359px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p:not(.old) {
		font-size: 13px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1029.98px) {
	.why-choose .slider .slides > .slide {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: none !important;
		box-sizing: border-box;
	}
}
@media screen and (min-width: 768px) and (max-width: 1099.98px) {
	.about .slider {
		align-self: center !important;
		margin-left: auto;
		margin-right: auto;
	}
}
@media screen and (min-width: 768px) and (max-width: 1029.98px) {
	.why-choose .items > .item {
		height: auto !important;
		align-self: stretch;
	}
	.why-choose .items {
		grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
	}
}
@media screen and (min-width: 767px) and (max-width: 1279.98px) {
	.selection-block.brands .items .item:not(.more) {
		justify-content: flex-start !important;
		padding: 8px 4px 0 !important;
		box-sizing: border-box;
	}
	.selection-block.brands .items .item:not(.more) img {
		flex: none;
		width: 100% !important;
		height: 62px !important;
		object-fit: contain !important;
	}
	.selection-block.brands .items .item:not(.more) p {
		height: 28px !important;
		margin: 4px 0 0 !important;
		line-height: 14px !important;
		text-align: center;
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		align-items: center;
	}
}
@media screen and (min-width: 1100px) and (max-width: 1279.98px) {
	.selection-block.brands .items .item:not(.more) img {
		height: 86px !important;
	}
}
.form-question textarea,
.akum-form-slot textarea {
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.form-question textarea::-webkit-scrollbar,
.akum-form-slot textarea::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}
.catalog-menu .tabs > .useful-block.mobile {
	flex-shrink: 0 !important;
}
@media screen and (max-width: 370.98px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		:is(h3, p, span, button, a, b),
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.price
		p:not(.old),
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.btns
		.bye {
		font-size: 10px !important;
		line-height: 12px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		h3 {
		line-height: 13px !important;
	}
}

@media (max-width: 766.98px) {
	.pagination .bx-pagination-container ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	.pagination .bx-pagination-container ul::after {
		content: "";
		order: 1;
		flex-basis: 100%;
		height: 0;
	}
	.pagination .bx-pagination-container ul li {
		order: 0;
	}
	.pagination .bx-pagination-container ul li.bx-pag-prev,
	.pagination .bx-pagination-container ul li.bx-pag-next {
		order: 2;
	}
}

footer .payment-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	max-width: 904px;
	margin: 0 auto;
	padding-bottom: 20px;
}

footer .payment-logos .logo {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 6px 12px;
	background: #fff;
	border-radius: 12px;
	box-sizing: border-box;
}

footer .payment-logos .logo img {
	display: block;
	height: 100%;
	width: auto;
	max-width: 100%;
}

footer .payment-logos .logo-bepaid {
	padding: 0;
}

@media screen and (max-width: 767px) {
	footer .payment-logos {
		gap: 8px;
		padding-bottom: 16px;
	}
	footer .payment-logos .logo {
		height: 40px;
		padding: 5px 10px;
	}
}

@media screen and (min-width: 1280px) {
	section.about > div:has(> .text):has(> .slider) {
		justify-content: space-between;
	}
}

@media screen and (max-width: 767px) {
	footer .info .links {
		justify-content: center !important;
		gap: 20px !important;
		padding-right: 0 !important;
	}
}

@media screen and (max-width: 767px) {
	header .bottom .services button:hover,
	header .bottom .delivery button:hover {
		border-color: transparent !important;
	}
	header button,
	header button:focus,
	header button:focus-visible,
	header a:focus,
	header a:focus-visible {
		outline: none !important;
		-webkit-tap-highlight-color: transparent;
	}
}

header .btns a.cart span {
	box-sizing: border-box !important;
	min-width: 1.7em !important;
	height: 1.7em !important;
	padding: 0 0.35em !important;
	border-radius: 999px !important;
	line-height: 1 !important;
	flex-shrink: 0;
}

header {
	top: var(--panel-h, 0px);
}



.selection-block.brands .items .item img {
	aspect-ratio: 1 / 1;
	height: auto !important;
	object-fit: contain;
}

.selection-mark .step .list .item.vehicle-item img {
	--vehicle-logo: calc(5.2083 * var(--dvw));
	width: var(--vehicle-logo) !important;
	max-width: min(var(--vehicle-logo), 100%) !important;
	height: auto !important;
	max-height: none !important;
	aspect-ratio: 1 / 1;
	object-fit: contain !important;
}

@media screen and (max-width: 1279.98px) {
	.selection-mark .step .list .item.vehicle-item img {
		--vehicle-logo: 100px;
	}
}

@media screen and (max-width: 1029.98px) {
	.selection-mark .step .list .item.vehicle-item img {
		--vehicle-logo: 81px;
	}
}

@media screen and (max-width: 766.98px) {
	.selection-mark .step .list .item.vehicle-item img {
		--vehicle-logo: 61px;
	}
}

@media screen and (min-width: 767px) {
	.selection-block.brands .items .item.less-tile {
		display: none !important;
	}
	.selection-block.brands .items.open .item.less-tile {
		display: flex !important;
	}
	.selection-block.brands .items .show-less,
	.selection-block.brands .items.open .show-less {
		display: none !important;
	}
}

@media screen and (max-width: 766.98px) {
	.selection-block.brands .items .item.less-tile {
		display: none !important;
	}
}

.selection-block.brands .brand-search {
	margin-bottom: 20px;
}

.selection-block.brands .brand-search input {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 21px 24px;
	font-size: 14px;
	line-height: 1.2;
	color: var(--text);
	background: var(--constraction-color, #fff);
	border: 1.6px solid rgb(210, 210, 210);
	border-radius: 10px;
	outline: none;
}

.selection-block.brands .brand-search input::placeholder {
	color: rgb(129, 129, 129);
}

@media screen and (max-width: 766.98px) {
	.selection-block.brands .brand-search {
		margin-bottom: 10px;
	}
}

@media screen and (min-width: 1280px) {
	.selection-block.brands .brand-search {
		margin-bottom: calc(1.042 * var(--dvw));
	}
	.selection-block.brands .brand-search input {
		padding: calc(0.99 * var(--dvw)) calc(2.083 * var(--dvw));
		font-size: calc(0.885 * var(--dvw));
		border-radius: calc(0.5208 * var(--dvw));
	}
}

.selection-block.brands .items.searching {
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
	grid-template-rows: none !important;
	padding-bottom: 0 !important;
}

.selection-block.brands .items.searching .item.is-hidden {
	display: flex;
}

.selection-block.brands .items.searching .show-more,
.selection-block.brands .items.searching .show-less,
.selection-block.brands .items.searching .item.less-tile,
.selection-block.brands .items .item.no-match,
.selection-block.brands .items .item.search-hidden {
	display: none !important;
}

.selection-block.brands .items.searching .item.more {
	display: none !important;
	order: 2;
}

.selection-block.brands .items.searching.has-more .item.more:not(.less-tile) {
	display: flex !important;
}

.selection-block.brands .items .brand-empty {
	grid-column: 1 / -1;
	padding: 24px 0;
	font-size: 16px;
	line-height: 20px;
}

@supports not selector(::-webkit-scrollbar) {
	.window-body {
		scrollbar-width: thin;
		scrollbar-color: #cfcfcf transparent;
	}
}

.window-body::-webkit-scrollbar {
	width: 8px;
}

.window-body::-webkit-scrollbar-track {
	background: transparent;
	margin: 20px 0;
}

.window-body::-webkit-scrollbar-thumb {
	border: 2px solid transparent;
	border-radius: 8px;
	background: #cfcfcf;
	background-clip: padding-box;
}

.window-body::-webkit-scrollbar-thumb:hover {
	background: #ffd633;
	background-clip: padding-box;
}

@media screen and (min-width: 768px) {
	header .catalog .catalog-menu {
		margin: -10px 0 0 -20px;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
	header .container .top {
		padding-top: 8px;
		padding-bottom: 8px;
	}
	header .container .center {
		padding-top: 8px;
		padding-bottom: 6px;
	}
	header .container .bottom {
		padding-top: 14px;
		padding-bottom: 16px;
		row-gap: 8px !important;
	}
	header .container .bottom .catalog > button,
	header .container .bottom .services > button,
	header .container .bottom .delivery > button {
		height: 40px;
		padding-top: 10px;
		padding-bottom: 11px;
		font-size: 13px;
	}
	header .container .bottom .shops {
		padding-top: 9px;
		padding-bottom: 10px;
		font-size: 13px;
	}
	header .container .bottom nav a {
		font-size: 14px;
	}
}

@media screen and (min-width: 768px) and (max-width: 900px) {
	header .container .bottom {
		column-gap: 6px;
	}
	header .container .bottom .shops {
		padding-right: 20px;
	}
}

header .nav-toggle {
	display: none;
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	header .container {
		position: relative;
	}
	header .nav-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		order: 3;
		margin-left: 12px;
		width: 32px;
		height: 32px;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
	}
	header .nav-toggle span,
	header .nav-toggle span::before,
	header .nav-toggle span::after {
		display: block;
		width: 22px;
		height: 2px;
		border-radius: 2px;
		background: #252525;
		content: "";
		transition: transform 0.2s ease, background-color 0.2s ease;
	}
	header .nav-toggle span {
		position: relative;
	}
	header .nav-toggle span::before,
	header .nav-toggle span::after {
		position: absolute;
		left: 0;
	}
	header .nav-toggle span::before {
		top: -7px;
	}
	header .nav-toggle span::after {
		top: 7px;
	}
	header.nav-open .nav-toggle span {
		background: transparent;
	}
	header.nav-open .nav-toggle span::before {
		transform: translateY(7px) rotate(45deg);
	}
	header.nav-open .nav-toggle span::after {
		transform: translateY(-7px) rotate(-45deg);
	}
	header .container .bottom nav {
		display: none;
	}
	header.nav-open .container .bottom nav {
		position: absolute;
		z-index: 100;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		left: auto;
		width: max-content;
		min-width: 240px;
		padding: 8px;
		border: 1px solid #e2e2e2;
		border-radius: 12px;
		background: #fff;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
	}
	header.nav-open .container .bottom nav a {
		padding: 11px 14px;
		border-radius: 8px;
		font-size: 15px;
		text-align: left;
		white-space: nowrap;
	}
	header.nav-open .container .bottom nav a:hover {
		background: #f3f3f3;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
	header .catalog-menu .window-body {
		top: 0 !important;
	}
}

header .catalog-menu .tabs p.item {
	position: relative;
}
header .catalog-menu .tabs p.item > a::after {
	position: absolute;
	inset: 0;
	content: "";
}
@media screen and (min-width: 768px) {
	header .catalog-menu .window-body {
		border-top-left-radius: 0 !important;
		border-top-right-radius: 0 !important;
	}
}

header .catalog-menu .blocks .block .empty {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 220px;
	padding: 30px 20px;
	text-align: center;
}
header .catalog-menu .blocks .block .empty-icon {
	width: 56px;
	height: 56px;
	margin-bottom: 6px;
	background: #7a7a7a;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l2.5-4h13L21 8'/%3E%3Cpath d='M3 8h18v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z'/%3E%3Cpath d='M9.5 12h5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l2.5-4h13L21 8'/%3E%3Cpath d='M3 8h18v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z'/%3E%3Cpath d='M9.5 12h5'/%3E%3C/svg%3E") center / contain no-repeat;
}
header .catalog-menu .blocks .block .empty-title {
	color: var(--text, #252525);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
}
header .catalog-menu .blocks .block .empty-text {
	color: #7a7a7a;
	font-size: 16px;
	font-weight: 500;
}

header .catalog-menu .blocks .block {
	transition: none !important;
}

@media screen and (min-width: 768px) {
	header .catalog-menu .blocks .block .chapter .links {
		row-gap: 8px !important;
	}
}
@media screen and (min-width: 1280px) {
	header .catalog-menu .blocks .block .chapter .links {
		row-gap: 6px !important;
	}
}

@media screen and (min-width: 768px) {
	header .catalog-menu,
	header .bottom .sub-menu {
		transition-duration: 0.12s !important;
		transition-timing-function: ease-out !important;
	}
	header .catalog-menu .window-body {
		padding-bottom: 44px !important;
	}
}
@media screen and (min-width: 1280px) {
	header .catalog-menu .window-body {
		padding-bottom: 40px !important;
	}
}

header .form-wrapper form::before {
	right: 0 !important;
	width: auto !important;
	top: -300px !important;
	height: calc(100dvh + 600px) !important;
}

.selection-block.brands .items .item p {
	font-size: 11px !important;
}

.selection-block.brands .items .item {
	min-width: 0;
}
@media screen and (min-width: 767px) {
	.selection-block.brands .items .item.less-tile span {
		max-width: 100%;
		overflow: hidden;
		font-size: 14px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

@media screen and (min-width: 1030px) and (max-width: 1439.98px) {
	.selection-block.brands .items {
		grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
	}
}

@media screen and (min-width: 1300px) and (max-width: 1439.98px) {
	.selection-block.brands .items {
		grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
	}
}

@media screen and (min-width: 1030px) and (max-width: 1279.98px) {
	header .catalog-menu .window-body {
		padding-top: 24px !important;
	}
}

header .nav-contacts {
	display: none;
}
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 10px;
	}
	header .container .top {
		flex: 0 0 100%;
		order: 0;
	}
	header .container .center,
	header .container .center .wrapper {
		display: contents;
	}
	header .container .center .logo {
		order: 1;
	}
	header .container .center .social,
	header .container .center .phone,
	header .container .center .info {
		display: none !important;
	}
	header .container .bottom {
		flex: 1 1 0;
		min-width: 0;
		order: 2;
		padding: 8px 0 !important;
		column-gap: 2px !important;
		row-gap: 0 !important;
		flex-wrap: nowrap !important;
		justify-content: flex-start !important;
	}
	header .container .center .order-call {
		order: 3;
		margin-left: auto;
		margin-right: 2px;
	}
	header .container .center .btns {
		order: 3;
		margin-left: auto;
	}
	header .container .center .form-wrapper {
		order: 4;
		margin-left: 2px;
	}
	header .container .nav-toggle {
		order: 5;
	}
	header .container .bottom .catalog > span {
		display: none;
	}
	header .container .bottom .catalog > button,
	header .container .bottom .services > button,
	header .container .bottom .delivery > button {
		width: auto !important;
		height: 36px !important;
		padding: 0 8px !important;
		border: 0 !important;
		background: none !important;
		box-shadow: none !important;
		color: #1a1a1a !important;
		font-size: 13px !important;
		white-space: nowrap;
	}
	header .container .bottom .catalog > button:hover,
	header .container .bottom .services > button:hover,
	header .container .bottom .delivery > button:hover,
	header .container .bottom .shops:hover {
		background: #f3f3f3 !important;
	}
	header .container .bottom .services > button::before,
	header .container .bottom .delivery > button::before {
		filter: brightness(0);
	}
	header .container .bottom .shops {
		height: 36px;
		padding: 0 8px !important;
		font-size: 13px !important;
		white-space: nowrap;
	}
	header.nav-open .container .bottom nav {
		top: 100%;
		right: 20px;
		left: auto;
	}
	header.nav-open .container .bottom nav .nav-contacts {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-top: 6px;
		padding: 12px 6px 6px;
		border-top: 1px solid #e2e2e2;
	}
	header .nav-contacts .request-call-btn {
		width: 100%;
		min-height: 0;
		height: 40px;
	}
	header .nav-contacts .list {
		display: flex;
		justify-content: center;
		gap: 8px;
	}
	header .nav-contacts .list a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 34px;
		height: 34px;
		padding: 0 !important;
		border-radius: 50% !important;
	}
	header .nav-contacts .list a::before {
		display: flex;
		font-family: 'icon';
		font-size: 17px;
		line-height: 17px;
		font-weight: 400;
		color: #fff;
	}
	header .nav-contacts .list a.telegram {
		background: #2f89ce !important;
	}
	header .nav-contacts .list a.telegram::before {
		content: '\e008';
	}
	header .nav-contacts .list a.whatsapp {
		background: #48c95f !important;
	}
	header .nav-contacts .list a.whatsapp::before {
		content: '\e009';
	}
	header .nav-contacts .list a.viber {
		background: #7c509a !important;
	}
	header .nav-contacts .list a.viber::before {
		content: '\e010';
	}
	header .nav-contacts .list a.inst {
		background: linear-gradient(43.94deg, #eea054 16.16%, #d64763 50.11%, #b62a99 83.68%) !important;
	}
	header .nav-contacts .list a.inst::before {
		content: '\e011';
		font-size: 14px;
	}
	header .nav-contacts .list a.mir {
		background: #f59124 !important;
	}
	header .nav-contacts .list a.mir::before {
		content: '\e012';
		font-size: 14px;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container .bottom .catalog > button::after,
	header .container .bottom .services > button::after,
	header .container .bottom .delivery > button::after {
		margin-left: 6px !important;
	}
	header .container .bottom .services > button::before,
	header .container .bottom .delivery > button::before {
		margin-right: 8px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 899.98px) {
	header .container {
		column-gap: 6px;
	}
	header .container .bottom .catalog > button,
	header .container .bottom .services > button,
	header .container .bottom .delivery > button,
	header .container .bottom .shops {
		padding: 0 6px !important;
		font-size: 12px !important;
	}
}


@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container .bottom .catalog {
		position: static;
	}
	header .container .bottom .catalog .catalog-menu {
		left: 0;
		top: 90px;
		margin: -10px 0 0 0;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .nav-contacts .request-call-btn {
		border: 0;
		border-radius: 8px;
		background: #ffd633;
		color: #1a1a1a;
		font-size: 14px;
		font-weight: 700;
		cursor: pointer;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container .bottom .catalog > button .burger,
	header .container .bottom .catalog > button::before,
	header .container .bottom .services > button::before,
	header .container .bottom .delivery > button::before,
	header .container .bottom .shops::before {
		display: none !important;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container .top {
		flex: 0 0 calc(100% + 40px);
	}
}

@media screen and (min-width: 768px) and (max-width: 768.98px) {
	header .container .top {
		flex: 0 0 calc(100% + 20px);
	}
}

@media screen and (min-width: 768px) and (max-width: 1059.98px) {
	header .container .bottom .sub-menu a {
		font-size: 12px !important;
		line-height: 15px !important;
		padding-bottom: 12px !important;
	}
}
@media screen and (min-width: 1060px) and (max-width: 1279.98px) {
	header .container .bottom .sub-menu a {
		font-size: calc(1.175 * var(--dvw)) !important;
		line-height: 16px !important;
		padding-bottom: 13px !important;
	}
}

@media screen and (min-width: 768px) and (max-width: 1029.98px) {
	main {
		padding-top: 122px;
	}
}
@media screen and (min-width: 1030px) and (max-width: 1278.98px) {
	main {
		padding-top: 122px;
	}
}

@media screen and (max-width: 1278.98px) {
	header .container .top {
		border-radius: 0 !important;
	}
}

@media screen and (max-width: 767px) {
	.catalog-menu .tabs > .useful-block.mobile:not(.show) + a.mobile {
		margin-top: -15px;
	}
	.catalog-menu .tabs > .useful-block.mobile.show + a.mobile {
		margin-top: 15px;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .window-body {
		padding: 14px 16px 24px !important;
	}
	header .catalog-menu .mobile-head h2,
	header .catalog-menu .mobile-head span {
		font-size: 14px !important;
		line-height: 17px !important;
	}
	header .catalog-menu .mobile-head p {
		font-size: 11px !important;
		line-height: 14px !important;
	}
	header .catalog-menu .tabs p.item {
		padding-bottom: 10px !important;
	}
	header .catalog-menu .tabs p.item a,
	header .catalog-menu .tabs > a.mobile {
		font-size: 13px !important;
		line-height: 16px !important;
	}
	header .catalog-menu .tabs > .useful-block.mobile a {
		font-size: 12px !important;
	}
	.catalog-menu .tabs > .useful-block.mobile:not(.show) + a.mobile {
		margin-top: -15px;
	}
	.catalog-menu .mobile-block .request-call-btn {
		height: 44px !important;
		font-size: 14px !important;
		margin-bottom: 6px !important;
	}
	.catalog-menu .mobile-block .request-call-btn::before {
		font-size: 19px !important;
	}
	.catalog-menu .mobile-block > span {
		margin-bottom: 10px !important;
		font-size: 12px !important;
		line-height: 15px !important;
	}
	.catalog-menu .mobile-block .links {
		margin-bottom: 8px !important;
		gap: 16px !important;
	}
	.catalog-menu .mobile-block .links a {
		width: 38px !important;
		height: 38px !important;
	}
	.catalog-menu .mobile-block > p {
		font-size: 11px !important;
		line-height: 14px !important;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .tabs p.item > span,
	header .catalog-menu .tabs > a:not(.mobile) {
		font-size: 13px !important;
		line-height: 16px !important;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .window-body > .tabs {
		flex: 1 1 auto !important;
		min-height: 0;
	}
	header .catalog-menu .window-body > .mobile-block {
		flex-shrink: 0;
		margin-top: auto;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .window-body {
		padding-bottom: 10px !important;
		margin-bottom: 0 !important;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .window-body > .blocks {
		margin-top: -15px;
	}
}

@media screen and (max-width: 767px) {
	header .catalog-menu .tabs {
		gap: 0 !important;
	}
	header .catalog-menu .tabs p.item,
	header .catalog-menu .tabs > a {
		padding: 13px 7px 12px 4px !important;
	}
	header .catalog-menu .tabs > a.mobile {
		margin: 0 !important;
	}
	header .catalog-menu .tabs > .useful-block.mobile.show {
		margin: 6px 0 8px !important;
	}
}

a.mir::before,
.catalog-menu .links a.mail::before {
	content: "" !important;
	display: block !important;
	width: 1.15em;
	height: 1.15em;
	margin: 0 !important;
	font-size: 14px !important;
	background: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
}

footer a.mail::before {
	content: "" !important;
	display: block !important;
	width: 1.15em;
	height: 1.15em;
	margin: 0 !important;
	font-size: 17px !important;
	background: #252525;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media screen and (min-width: 1280px) {
	header .center .phone {
		flex-direction: column !important;
		gap: 2px;
	}
	header .center .phone a {
		padding: 3px 0;
	}
}
@keyframes call-icon-ring {
	0%, 60%, 100% {
		transform: rotate(0);
	}
	66% {
		transform: rotate(-14deg);
	}
	72% {
		transform: rotate(12deg);
	}
	78% {
		transform: rotate(-10deg);
	}
	84% {
		transform: rotate(8deg);
	}
	90% {
		transform: rotate(-4deg);
	}
}
header .request-call-btn::before {
	display: inline-block;
	transform-origin: 50% 50%;
	animation: call-icon-ring 3s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
	header .request-call-btn::before {
		animation: none;
	}
}
a.inst::before {
	content: "" !important;
	display: block !important;
	width: 1.15em;
	height: 1.15em;
	margin: 0 !important;
	font-size: 15px !important;
	background: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
}
footer a.inst::before {
	background: #252525;
}

header .bottom nav a[href="/stock/"],
header .bottom nav a[href="/news/"] {
	color: #bb1303 !important;
}
main .block > .bottom a {
	white-space: nowrap;
}
@media screen and (max-width: 420px) {
	main .block > .bottom {
		gap: 8px;
	}
	main .block > .bottom a {
		font-size: 13px !important;
		letter-spacing: 0;
	}
}

@media screen and (max-width: 1070px) {
	header .container .center .order-call {
		display: none !important;
	}
}
@media screen and (min-width: 1071px) {
	header .nav-contacts .request-call-btn {
		display: none !important;
	}
}

@media screen and (max-width: 835px) {
	header .container .center .btns {
		gap: 8px !important;
	}
}

@media screen and (max-width: 800px) {
	header .container .center .btns .compare,
	header .container .center .btns .favorite {
		display: none !important;
	}
}
header .nav-contacts .tools {
	display: none;
	flex-direction: column;
	gap: 10px;
}
header .nav-contacts .tools a {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #252525;
	font-size: 14px;
	font-weight: 500;
}
header .nav-contacts .tools a::before {
	content: '\e014';
	font-family: 'icon';
	font-size: 17px;
	color: #252525;
}
header .nav-contacts .tools a.favorite::before {
	content: '\e015';
}
@media screen and (max-width: 800px) {
	header .nav-contacts .tools {
		display: flex;
	}
}
@media screen and (max-width: 767px) {
	header .container {
		display: flex !important;
		flex-wrap: wrap;
		align-items: center;
	}
	header .container {
		padding-bottom: 14px !important;
	}
	header .container .top {
		flex: 0 0 calc(100% + 20px);
		order: 0;
		margin-bottom: 14px !important;
	}
	header .container .center,
	header .container .center .wrapper,
	header .container .center .btns {
		display: contents !important;
	}
	header .container .center .burger {
		order: 1;
		margin-right: 10px !important;
	}
	header .container .center .logo {
		order: 2;
		flex: 1 1 0 !important;
		max-width: 135px;
		min-width: 70px !important;
		margin-right: 10px !important;
	}
	header .container .bottom {
		order: 3;
		flex: 0 0 auto !important;
		width: auto !important;
		margin: 0 10px 0 auto !important;
		padding: 0 !important;
		flex-wrap: nowrap !important;
		justify-content: flex-end !important;
		column-gap: 10px !important;
	}
	header .container .center .btns .phone-btn {
		order: 4;
		margin-right: 10px !important;
	}
	header .container .center .form-wrapper {
		order: 5;
		margin-right: 10px !important;
	}
	header .container .center .btns .cart {
		order: 6;
	}
	header .container .bottom .services > button,
	header .container .bottom .delivery > button,
	header .container .bottom .shops {
		display: flex !important;
		align-items: center !important;
		height: 20px !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		font-size: 0 !important;
		line-height: 20px !important;
		gap: 0 !important;
	}
	header .container .bottom .services > button::before,
	header .container .bottom .delivery > button::before,
	header .container .bottom .shops::before {
		display: flex !important;
		align-items: center;
		margin: 0 !important;
		font-size: 20px !important;
		line-height: 20px !important;
	}
	header .container .bottom {
		position: static !important;
	}
	header .container .bottom .sub-menu {
		left: 10px !important;
		right: 10px !important;
		top: 88px !important;
		width: auto !important;
		padding: 14px 18px !important;
	}
	header .container .bottom .sub-menu.open {
		max-height: 400px !important;
	}
	header .container .bottom .sub-menu a {
		font-size: 13px !important;
		white-space: nowrap !important;
	}
	header .container .bottom .services > button::after,
	header .container .bottom .delivery > button::after {
		margin: 0 0 0 4px !important;
		line-height: 20px !important;
	}
}

@media screen and (min-width: 421px) {
	header .catalog-menu .tabs .compact-only {
		display: none !important;
	}
}
@media screen and (max-width: 420px) {
	header .container .bottom .services,
	header .container .bottom .delivery,
	header .container .bottom .shops {
		display: none !important;
	}
}

@media screen and (max-width: 1279.98px) {
	header .container .center .logo {
		margin-right: 0 !important;
		flex: 0 0 auto !important;
		max-width: none;
		min-width: 0 !important;
	}
	header .container .center .logo img {
		width: auto !important;
		height: 56px;
	}
}
@media screen and (max-width: 767px) {
	header .container {
		padding-bottom: 8px !important;
	}
	header .container .top {
		margin-bottom: 8px !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .center .btns .phone-btn,
	header .container .center .btns .cart,
	header .container .center .form-wrapper button.open-form,
	header .container .bottom .services > button,
	header .container .bottom .delivery > button,
	header .container .bottom .shops {
		zoom: 1.15;
	}
	header .container .bottom {
		column-gap: 15px !important;
		margin-right: 15px !important;
	}
	header .container .center .btns .phone-btn {
		margin-right: 12px !important;
	}
	header .container .center .btns .phone-btn {
		width: 20px !important;
		height: 20px !important;
	}
	header .container .center .btns .phone-btn::before,
	header .container .center .btns .cart::before,
	header .container .center .form-wrapper button.open-form::before {
		width: 20px !important;
		height: 20px !important;
		line-height: 20px !important;
		font-size: 20px !important;
	}
	header .container .center .form-wrapper {
		margin-right: 15px !important;
	}
}

@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	header .container .center .logo {
		margin: 14px 0;
	}
}
@media screen and (max-width: 767px) {
	header .container .center .burger {
		order: 12;
		margin: 0 0 0 10px !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .center .burger {
		height: 20px;
		justify-content: space-between;
		gap: 0;
	}
}
@media screen and (max-width: 767px) {
	header .container .bottom .services > button,
	header .container .bottom .delivery > button {
		font-size: 13px !important;
		text-transform: uppercase;
		font-weight: 700;
	}
	header .container .bottom .services > button::before,
	header .container .bottom .delivery > button::before {
		display: none !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .bottom {
		margin-left: 10px !important;
	}
	header .container .center .btns .phone-btn {
		margin-left: auto !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .bottom .shops {
		font-size: 13px !important;
		text-transform: uppercase;
		font-weight: 700;
	}
	header .container .bottom .shops::before {
		display: none !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .bottom .services > button,
	header .container .bottom .delivery > button,
	header .container .bottom .shops {
		font-size: 12px !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .bottom {
		column-gap: 15px !important;
	}
	header .container .center .form-wrapper {
		margin-right: 10px !important;
	}
	header .container .center .btns .phone-btn {
		margin-right: 10px !important;
	}
}
@media screen and (min-width: 421px) and (max-width: 630px) {
	header .container .bottom .shops {
		display: none !important;
	}
	header .catalog-menu .tabs > a[href="/store/"] {
		display: flex !important;
	}
}
@media screen and (min-width: 421px) and (max-width: 470px) {
	header .container .bottom .services,
	header .container .bottom .delivery {
		display: none !important;
	}
	header .catalog-menu .tabs > p.compact-only,
	header .catalog-menu .tabs > .useful-block.compact-only {
		display: flex !important;
	}
}
@media screen and (max-width: 767px) {
	.social .items a.inst::before,
	.social .items a.mir::before {
		font-size: 30px !important;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1279.98px) {
	.promo-block {
		margin-bottom: 20px !important;
	}
	.promo-block h1 {
		font-size: 30px !important;
		line-height: 1.2 !important;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1279.98px) {
	.reviews-slider .slides {
		gap: 7px;
	}
	.reviews-slider .slides .slide {
		min-width: 280px;
		width: 280px;
		padding: 22px 26px 26px;
		border: 0.8px solid #ededed;
		border-radius: 10px;
		background: #ededed;
		gap: 12px;
	}
	.reviews-slider .slides .slide > div:first-child p {
		font-size: 48px;
		line-height: 48px;
		font-weight: 700;
	}
	.reviews-slider .slides .slide > div:first-child span {
		font-size: 14px;
		line-height: 17px;
		color: #ababab;
	}
	.reviews-slider .slides .slide > div:last-child img {
		max-width: 105px;
		margin-bottom: 10px;
	}
	.reviews-slider .slides .slide .stars {
		position: relative;
		max-width: 150px;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1279.98px) {
	.reviews-slider h2 {
		display: none;
	}
	.reviews-slider .bubbles {
		display: none;
	}
	.reviews-slider .slides {
		width: 854px;
		max-width: 100%;
		margin: 0 auto;
		overflow: hidden;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
	.reviews-slider h2,
	.reviews-slider .bubbles {
		display: none;
	}
	.reviews-slider .slides {
		width: 302px;
		max-width: 100%;
		margin: 0 auto;
		overflow: hidden;
	}
	.reviews-slider .slides .slide {
		min-width: 302px;
		width: 302px;
		padding: 25.2px 40px 30.8px;
		border: 0.8px solid #ededed;
		border-radius: 7.29px;
		background: #ededed;
		gap: 15.4px;
	}
	.reviews-slider .slides .slide > div:first-child p {
		font-size: 48px;
		line-height: 48px;
	}
	.reviews-slider .slides .slide > div:first-child span {
		font-size: 14px;
		line-height: 17px;
	}
	.reviews-slider .slides .slide > div:last-child img {
		max-width: 105px;
	}
}
@media screen and (max-width: 767px) {
	.reviews-slider h2,
	.reviews-slider .bubbles {
		display: none;
	}
	.reviews-slider .slides {
		width: 534px;
		max-width: 100%;
		margin: 0 auto;
		overflow: hidden;
	}
	.reviews-slider .slides .slide {
		min-width: 534px;
		width: 534px;
		padding: 21.2px 25.5px 25.2px;
		border: 0.8px solid #ededed;
		border-radius: 4px;
		background: #ededed;
		gap: 11.6px;
	}
	.reviews-slider .slides .slide > div:first-child p {
		font-size: 33px;
		line-height: 33px;
	}
	.reviews-slider .slides .slide > div:first-child span {
		font-size: 11px;
		line-height: 13px;
	}
	.reviews-slider .slides .slide > div:last-child img {
		max-width: 60px;
	}
}
@media screen and (min-width: 1280px) {
	.reviews-slider h2,
	.reviews-slider .bubbles {
		display: none;
	}
	.reviews-slider .slides {
		justify-content: center;
		gap: calc(0.885 * var(--dvw));
	}
	.reviews-slider .slides .slide {
		width: calc(18 * var(--dvw));
		min-width: calc(18 * var(--dvw));
		padding: calc(1.8 * var(--dvw)) 40px calc(2.2 * var(--dvw));
		border: 0.8px solid #ededed;
		border-radius: calc(0.5208 * var(--dvw));
		background: #ededed;
		gap: calc(1.1 * var(--dvw));
	}
	.reviews-slider .slides .slide > div:first-child p {
		font-size: calc(3.6 * var(--dvw));
		line-height: calc(3.6 * var(--dvw));
	}
	.reviews-slider .slides .slide > div:first-child span {
		font-size: calc(0.8 * var(--dvw));
		line-height: calc(1 * var(--dvw));
	}
	.reviews-slider .slides .slide > div:last-child img {
		max-width: calc(7.1 * var(--dvw));
	}
}
.reviews-slider .slides {
	width: auto !important;
	max-width: none !important;
	margin-left: auto !important;
	margin-right: auto !important;
	overflow: visible !important;
	transform: none !important;
	flex-wrap: wrap;
	justify-content: center;
}
.reviews-slider .slides .slide {
	flex: 0 0 auto;
	position: relative !important;
	transform: none !important;
}
@media screen and (max-width: 767px) {
	.reviews-slider .slides {
		gap: 8px !important;
	}
	.reviews-slider .slides .slide {
		width: calc(50% - 4px) !important;
		min-width: 0 !important;
	}
}
@media screen and (max-width: 767px) {
	header .container .center .logo img {
		height: clamp(52px, calc(14.4 * var(--dvw)), 76px) !important;
	}
}
@media screen and (max-width: 767px) {
	.reviews-slider .slides .slide > div:last-child img {
		max-width: 120px !important;
	}
}
@media screen and (max-width: 767px) {
	.reviews-slider .slides .slide > div:last-child img {
		margin-bottom: 0 !important;
	}
}
.reviews-slider .slides .slide > div:last-child {
	justify-content: center !important;
}
@media screen and (max-width: 550px) {
	.reviews-slider .slides .slide > div:last-child img {
		max-width: 90px !important;
	}
}
@media screen and (max-width: 490px) {
	.reviews-slider .slides .slide {
		width: 100% !important;
	}
}
.reviews-slider .slides .slide > div:last-child img {
	width: 120px !important;
	height: auto !important;
	max-width: none !important;
}
@media screen and (max-width: 550px) {
	.reviews-slider .slides .slide > div:last-child img {
		width: 90px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
	.why-choose .slide {
		min-width: 302px;
		width: 302px;
		padding: 25.2px 40px 30.8px;
		border: 0.8px solid #ededed;
		border-radius: 7.29px;
		gap: 15.4px;
	}
	.why-choose .slide > div:first-child p {
		font-size: 48px;
		line-height: 48px;
	}
	.why-choose .slide > div:first-child span {
		font-size: 14px;
		line-height: 17px;
		white-space: nowrap;
	}
	.why-choose .slide > div:last-child img {
		max-width: 105px;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1279.98px) {
	.why-choose .slide > div:first-child span {
		white-space: nowrap;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
	.why-choose .slide {
		padding: 25.2px 40px 30.8px !important;
		border-radius: 7.29px !important;
		gap: 15.4px !important;
	}
	.why-choose .slide > div:first-child p {
		font-size: 48px !important;
		line-height: 48px !important;
	}
	.why-choose .slide > div:first-child span {
		font-size: 14px !important;
		line-height: 17px !important;
	}
}
@media screen and (max-width: 767px) {
	.why-choose .slide {
		padding: 21.2px 25.5px 25.2px !important;
		border: 0.8px solid #ededed !important;
		border-radius: 4px !important;
		gap: 11.6px !important;
	}
	.why-choose .slide > div:first-child p {
		font-size: 33px !important;
		line-height: 33px !important;
	}
	.why-choose .slide > div:first-child span {
		font-size: 11px !important;
		line-height: 13px !important;
	}
	.why-choose .slide > div:last-child img {
		width: 120px !important;
		max-width: none !important;
		height: auto !important;
		margin-bottom: 0 !important;
	}
}
@media screen and (max-width: 550px) {
	.why-choose .slide > div:last-child img {
		width: 90px !important;
	}
}
@media screen and (max-width: 767px) {
	.why-choose .slider .bubbles {
		display: none;
	}
	.why-choose .slider .slides {
		width: auto !important;
		max-width: none !important;
		margin: 0 auto !important;
		overflow: visible !important;
		transform: none !important;
		left: 0 !important;
		flex-wrap: wrap;
		justify-content: center;
		gap: 8px !important;
	}
	.why-choose .slider .slides .slide {
		flex: 0 0 auto;
		position: relative !important;
		transform: none !important;
		width: calc(50% - 4px) !important;
		min-width: 0 !important;
	}
	.why-choose .slide > div:last-child {
		justify-content: center !important;
	}
}
@media screen and (max-width: 490px) {
	.why-choose .slider .slides .slide {
		width: 100% !important;
	}
}
@media screen and (min-width: 768px) {
	.why-choose .slide > div:last-child img {
		width: 120px !important;
		max-width: none !important;
		height: auto !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
	.why-choose .slide > div:last-child img {
		margin-bottom: 5px !important;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1279.98px) {
	.why-choose .slide > div:last-child img {
		margin-bottom: 10px !important;
	}
}
@media screen and (min-width: 1280px) {
	main section.why-choose .slider .slides .slide {
		width: calc(19.36 * var(--dvw)) !important;
		min-width: calc(19.36 * var(--dvw)) !important;
	}
}
@media screen and (min-width: 1280px) {
	main section.why-choose .slider .slides .slide,
	.reviews-slider .slides .slide {
		padding-left: calc(1.6 * var(--dvw)) !important;
		padding-right: calc(1.6 * var(--dvw)) !important;
	}
}
@media screen and (min-width: 1280px) {
	.reviews-slider .slides .slide {
		width: calc(19.36 * var(--dvw)) !important;
		min-width: calc(19.36 * var(--dvw)) !important;
	}
}
@media screen and (min-width: 1031px) and (max-width: 1280px) {
	.why-choose {
		grid-template-columns: 1fr 1fr !important;
	}
	.why-choose .slider {
		width: 100%;
	}
	.why-choose .slider .bubbles {
		display: none;
	}
	.why-choose .slider .slides {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		width: 100% !important;
		max-width: none !important;
		overflow: visible !important;
		transform: none !important;
		left: 0 !important;
		gap: 8px !important;
	}
	.why-choose .slider .slides .slide {
		width: auto !important;
		min-width: 0 !important;
		position: relative !important;
		transform: none !important;
	}
}
@media screen and (min-width: 1031px) and (max-width: 1280px) {
	.why-choose .items {
		grid-column: 2 / 3 !important;
		grid-row: 1 / 3 !important;
	}
	.why-choose .slider {
		grid-column: 1 / 2 !important;
		grid-row: 2 / 3 !important;
		align-self: start;
	}
}
@media screen and (min-width: 1031px) and (max-width: 1100px) {
	.why-choose .slide {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}
	.why-choose .slide > div:last-child img {
		width: 100px !important;
	}
}
@media screen and (min-width: 1101px) and (max-width: 1191px) {
	.why-choose .slide > div:last-child img {
		width: 105px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 850px) {
	.contacts-block > div:first-child {
		flex: 0 0 404px !important;
		width: 404px !important;
	}
	.contacts-block > img {
		min-width: 0;
		flex: 1 1 0;
		width: auto;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
	.why-choose .slide {
		padding: 16px 32px 18px !important;
	}
	.why-choose .slider .slides {
		gap: 6px !important;
	}
}
@media screen and (min-width: 1001px) and (max-width: 1030px) {
	.why-choose .slide {
		padding: 14px 22px 16px !important;
	}
	.why-choose .slider .slides {
		gap: 6px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1030px) {
	.why-choose .slider .slides {
		margin-bottom: 0 !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1030px) {
	.why-choose .slider .slides {
		gap: 3px !important;
	}
}
@media screen and (min-width: 1031px) and (max-width: 1280px) {
	.why-choose {
		row-gap: 20px !important;
	}
}
@media screen and (max-width: 640px) {
	.why-choose .text {
		margin-bottom: 12px !important;
	}
	.why-choose .items {
		margin-bottom: 24px !important;
	}
}
@media screen and (min-width: 1281px) {
	.why-choose .slider .slides {
		margin-bottom: 0 !important;
	}
}
@media screen and (min-width: 641px) and (max-width: 1030px) {
	.why-choose {
		row-gap: 20px !important;
	}
}
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
	.reviews-slider .slides {
		margin-bottom: 30px !important;
	}
}
@media screen and (max-width: 767px) {
	.reviews-slider .slides {
		margin-bottom: 15px !important;
	}
}
@media screen and (min-width: 1281px) {
	main section.why-choose .slider .slides,
	.reviews-slider .slides {
		flex-wrap: nowrap !important;
		gap: calc(0.8 * var(--dvw)) !important;
	}
	main section.why-choose .slider .slides .slide,
	.reviews-slider .slides .slide {
		flex: 1 1 0 !important;
		width: auto !important;
		min-width: 0 !important;
		padding: calc(0.9 * var(--dvw)) calc(0.9 * var(--dvw)) calc(1 * var(--dvw)) !important;
		gap: calc(0.8 * var(--dvw)) !important;
	}
	main section.why-choose .slider .slides .slide > div:first-child p,
	.reviews-slider .slides .slide > div:first-child p {
		font-size: calc(3.4 * var(--dvw)) !important;
		line-height: 100% !important;
	}
	main section.why-choose .slider .slides .slide > div:first-child span,
	.reviews-slider .slides .slide > div:first-child span {
		font-size: calc(0.85 * var(--dvw)) !important;
		line-height: calc(1.05 * var(--dvw)) !important;
		white-space: nowrap;
	}
	main section.why-choose .slider .slides .slide > div:last-child img,
	.reviews-slider .slides .slide > div:last-child img {
		width: calc(7.2 * var(--dvw)) !important;
	}
}
.catalog-container .desc {
	max-height: none !important;
	overflow: visible;
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid #e3e3e3;
	font-size: 16px;
	line-height: 1.55;
	font-weight: 400;
	color: #3a3a3a;
}
.catalog-container .desc h2 {
	margin: 0 0 16px;
	font-size: 28px;
	line-height: 1.2;
	font-weight: 500;
	color: #252525;
}
.catalog-container .desc p {
	margin: 0 0 14px;
	font-size: 16px;
	line-height: 1.55;
	font-weight: 400;
}
.catalog-container .desc strong {
	font-weight: 700;
	color: #252525;
}
.catalog-container .desc .desc-contacts {
	margin: 24px 0 0;
	padding: 18px 22px;
	border-radius: 10px;
	background: #f1f1f1;
}
@media screen and (max-width: 767px) {
	.catalog-container .desc {
		margin-top: 28px;
		padding-top: 22px;
		font-size: 14px;
	}
	.catalog-container .desc h2 {
		font-size: 20px;
	}
	.catalog-container .desc p {
		font-size: 14px;
	}
	.catalog-container .desc .desc-contacts {
		padding: 14px 16px;
	}
}
.catalog-container .desc .desc-contacts a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid rgba(37, 37, 37, 0.35);
	transition: border-color .3s linear, color .3s linear;
}
.catalog-container .desc .desc-contacts a:hover {
	border-bottom-color: #252525;
}
@media screen and (max-width: 767px) {
	.promo-block .bubbles {
		flex-wrap: wrap;
		gap: 2px 8px;
	}
	.promo-block .bubbles a,
	.promo-block .bubbles p {
		white-space: nowrap;
		font-size: 13px;
		line-height: 18px;
	}
	.promo-block .bubbles a {
		gap: 8px;
	}
}
@media screen and (min-width: 767px) and (max-width: 1278.98px) {
	.catalog-container aside:not(.show) {
		left: -520px !important;
	}
}
.catalog-container aside form {
	gap: 0 !important;
}
.catalog-container aside form .block {
	background: transparent !important;
	padding: 0 !important;
	border-radius: 0 !important;
	border-bottom: 1px solid #e3e3e3;
	height: auto !important;
	overflow: visible !important;
}
.catalog-container aside form .block:last-of-type {
	border-bottom: 0;
}
.catalog-container aside form .block > p.head {
	margin: 0 !important;
	padding: 20px 36px 20px 0 !important;
	font-size: 18px !important;
	line-height: 22px !important;
	font-weight: 700 !important;
	cursor: pointer;
}
.catalog-container aside form .block > .may-hide {
	top: 0 !important;
	right: 0 !important;
	height: 62px;
	width: 36px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	z-index: 2;
}
.catalog-container aside form .block > .may-hide::before {
	font-size: 12px;
}
.catalog-container aside form .block.hide > :not(.head):not(.may-hide) {
	display: none !important;
}
.catalog-container aside form .block:not(.hide) > :not(.head):not(.may-hide):last-child {
	margin-bottom: 16px;
}
.catalog-container aside form .block .filter-search {
	margin-bottom: 8px;
}
.catalog-container aside form .block .list {
	grid-template-columns: 1fr !important;
	gap: 0 !important;
	max-height: 340px;
	overflow: hidden;
	margin-bottom: 10px;
}
.catalog-container aside form .block .list.show {
	max-height: 1400px;
}
.catalog-container aside form .block .list .item {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 7px 0 !important;
	gap: 14px !important;
}
.catalog-container aside form .block .brand-list .item .content {
	flex: 1 1 auto;
	min-width: 0;
	flex-direction: row-reverse !important;
	justify-content: flex-end !important;
	align-items: center !important;
	gap: 12px;
}
.catalog-container aside form .block .brand-list .item .content span {
	flex: 1 1 auto;
	font-size: 16px !important;
	line-height: 20px;
	font-weight: 500;
	text-align: left;
}
.catalog-container aside form .block .brand-list .item .content img {
	width: 44px !important;
	height: 30px !important;
	object-fit: contain;
	flex: 0 0 44px;
}
.catalog-container aside form .block .brand-list .item .count {
	margin-left: auto;
	min-width: 30px;
	padding: 3px 9px;
	border-radius: 999px;
	background: #ececec;
	font-size: 13px;
	line-height: 16px;
	font-weight: 500;
	text-align: center;
	color: #555;
}
.catalog-container aside form .block.hide[data-min] > :not(.head):not(.may-hide) {
	display: block !important;
	height: 0 !important;
	overflow: hidden !important;
	visibility: hidden;
	margin: 0 !important;
	padding: 0 !important;
}
.catalog-container aside form .block > .may-hide {
	width: 14px;
	justify-content: center;
	right: 2px !important;
}
.catalog-container aside form .block > .may-hide::before {
	display: block;
	width: 14px;
	text-align: center;
	line-height: 1;
}
.catalog-container aside form {
	gap: 18px !important;
}
.catalog-container aside form .block {
	background: var(--text-bg) !important;
	padding: 0 20px !important;
	border-radius: 10px !important;
	border-bottom: 0 !important;
}
.catalog-container aside form .block > p.head {
	padding: 19px 30px 19px 0 !important;
}
.catalog-container aside form .block > .may-hide {
	right: 20px !important;
}
.catalog-container aside form .block button.more {
	display: none !important;
}
.catalog-container aside form .block .list,
.catalog-container aside form .block .list.show {
	max-height: 340px !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	scrollbar-width: thin;
	scrollbar-color: #b5b5b5 transparent;
}
.catalog-container aside form .block .list::-webkit-scrollbar {
	width: 6px;
}
.catalog-container aside form .block .list::-webkit-scrollbar-thumb {
	border-radius: 100px;
	background: #b5b5b5;
}
.catalog-container aside form {
	gap: 8px !important;
}
.catalog-container aside form .block .list .item {
	margin: 0 -10px;
	padding: 7px 10px !important;
	border-radius: 8px !important;
	cursor: pointer;
	transition: background-color .2s linear;
}
.catalog-container aside form .block .list .item:hover {
	background: rgba(37, 37, 37, 0.07) !important;
}
.catalog-container aside form .block .list .item .checkbox {
	flex: 1 1 auto;
	min-width: 0;
}
.catalog-container aside form .block .list .item .checkbox label {
	cursor: pointer;
}
.catalog-container aside form .block .list .item .count {
	flex: 0 0 auto;
	margin-left: auto;
	min-width: 30px;
	padding: 3px 9px;
	border-radius: 999px;
	background: #fff;
	font-size: 13px;
	line-height: 16px;
	font-weight: 500;
	text-align: center;
	color: #555;
}
.catalog-container aside form .block .brand-list .item .checkbox {
	flex: 0 0 auto;
}
.catalog-container aside form .block > p.head:hover {
	color: #000;
}
.catalog-container aside form .block:hover {
	background: #e6e6e6 !important;
}
.catalog-container aside form .block .list {
	margin-left: -10px !important;
	margin-right: -10px !important;
	padding: 2px 6px 2px 10px;
	gap: 2px !important;
}
.catalog-container aside form .block .list .item {
	margin: 0 !important;
	padding: 5px 10px !important;
	gap: 10px !important;
	border-radius: 10px !important;
}
.catalog-container aside form .block .list .item .checkbox label {
	font-size: 14px !important;
	line-height: 18px;
}
.catalog-container aside form .block .brand-list .item .content {
	gap: 10px;
}
.catalog-container aside form .block .brand-list .item .content span {
	font-size: 14px !important;
	line-height: 18px;
}
.catalog-container aside form .block .brand-list .item .content img {
	width: 38px !important;
	height: 24px !important;
	flex: 0 0 38px;
}
.catalog-container aside form .block .list .item .count {
	min-width: 26px;
	padding: 2px 8px;
	font-size: 12px;
	line-height: 15px;
}
.catalog-container aside form .block .list .item:hover {
	background: rgba(37, 37, 37, 0.08) !important;
}
.catalog-container aside form .block {
	padding: 0 14px !important;
}
.catalog-container aside form .block > p.head {
	padding: 15px 28px 15px 0 !important;
}
.catalog-container aside form .block > .may-hide {
	right: 14px !important;
	height: 52px;
}
.catalog-container aside form .block:not(.hide) > :not(.head):not(.may-hide):last-child {
	margin-bottom: 12px;
}
.catalog-container aside form .block .list {
	margin-left: -8px !important;
	margin-right: -8px !important;
	padding: 2px 4px 2px 8px;
}
.catalog-container aside form .block .list {
	scrollbar-width: auto !important;
	scrollbar-color: auto !important;
	scrollbar-gutter: stable;
	padding: 2px 2px 2px 8px;
}
.catalog-container aside form .block .list::-webkit-scrollbar-track {
	margin: 10px 0;
	background: transparent;
}
.catalog-container aside form .block > p.head {
	font-size: 16px !important;
	line-height: 20px !important;
}
.catalog-container aside form .block .brand-list .item .content img.flag {
	width: 30px !important;
	height: 20px !important;
	flex: 0 0 30px;
	margin: 0 4px;
	border-radius: 3px;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}
@media screen and (max-width: 1278.98px) {
	.catalog-container aside {
		width: 280px !important;
		min-width: 280px !important;
		max-width: 280px !important;
	}
	.catalog-container aside:not(.show) {
		left: -420px !important;
	}
}
@media screen and (max-width: 767px) {
	.catalog-container .goods-snippet .top {
		gap: 8px;
		align-items: center;
	}
	.catalog-container .goods-snippet .top .tag {
		font-size: 12px !important;
		line-height: 16px;
		padding: 3px 9px 4px !important;
		border-radius: 6px;
	}
	.catalog-container .goods-snippet .top .country,
	.catalog-container .goods-snippet .top .country img {
		width: 26px !important;
		height: 19px !important;
	}
}
@media screen and (max-width: 1279.98px) {
	.catalog-container .main-container .block.choose-brand .icon-list .item.hide a {
		font-family: Inter, sans-serif;
		font-style: normal;
		font-weight: 500;
		text-transform: lowercase;
		color: #fff !important;
	}
}
@media screen and (max-width: 1279.98px) {
	.promo .big-slider > .slides {
		align-items: stretch !important;
	}
	.promo .big-slider .item.slider,
	.promo .big-slider .item.diagnostics,
	.promo .big-slider .item.delivery,
	.promo .big-slider .item.store,
	.promo .big-slider .item.selection,
	.promo .big-slider .item.payment {
		align-self: stretch !important;
		height: auto !important;
	}
}
@media screen and (max-width: 480px) {
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.favorite,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.compare {
		right: 6px !important;
		width: 30px !important;
		height: 30px !important;
		border-radius: 6px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.favorite {
		top: 6px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.compare {
		top: 42px !important;
	}
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.favorite::before,
	:is(.catalog-container, .hit-slider, .goods-slider, .viewed, .goods-list)
		.goods-snippet
		.image-box
		button.compare::before {
		font-size: 17px !important;
	}
}
@media screen and (max-width: 490px) {
	.why-choose .slider .slides .slide,
	.reviews-slider .slides .slide {
		width: calc(50% - 4px) !important;
		padding: 14px 10px 14px !important;
		gap: 8px !important;
		flex-direction: column !important;
		align-items: center !important;
	}
	.why-choose .slide > div:first-child,
	.reviews-slider .slides .slide > div:first-child {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.why-choose .slide > div:last-child,
	.reviews-slider .slides .slide > div:last-child {
		align-items: center;
	}
	.why-choose .slide > div:last-child img,
	.reviews-slider .slides .slide > div:last-child img {
		width: 86px !important;
	}
}
@media screen and (max-width: 490px) {
	.why-choose .slider .slides,
	.reviews-slider .slides {
		align-items: stretch !important;
	}
	.why-choose .slider .slides .slide,
	.reviews-slider .slides .slide {
		justify-content: center !important;
	}
}
@media screen and (max-width: 767px) {
	.goods-snippet .top {
		gap: 8px;
		align-items: center;
	}
	.goods-snippet .top .tag {
		font-size: 12px !important;
		line-height: 16px;
		padding: 3px 9px 4px !important;
		border-radius: 6px;
	}
	.goods-snippet .top .country,
	.goods-snippet .top .country img {
		width: 26px !important;
		height: 19px !important;
	}
}
@media screen and (max-width: 767px) {
	.goods-snippet .image-box img {
		width: 80% !important;
		max-width: 80% !important;
		height: auto;
		max-height: 100%;
		object-fit: contain;
	}
}
section.product .sizes-block {
	position: relative;
}
section.product .sizes-block .items {
	flex-wrap: wrap;
	overflow: visible;
}
section.product .sizes-block .items a {
	flex: 0 0 auto;
	white-space: nowrap;
	min-width: max-content;
}
section.product .sizes-block .items .show-more {
	display: none;
}
.catalog-container aside form .block > p.head {
	font-size: 14px !important;
	line-height: 18px !important;
	padding-right: 0 !important;
	cursor: default;
}
.catalog-container aside form .block > .may-hide {
	display: none !important;
}
.catalog-container aside form .block .list .item .checkbox label,
.catalog-container aside form .block .brand-list .item .content span {
	font-size: 13px !important;
	line-height: 17px !important;
}
.catalog-container aside form .block .line .active-line {
	background: var(--accent-color) !important;
}
.catalog-container aside form .block .line .min-range,
.catalog-container aside form .block .line .max-range {
	border-color: var(--accent-color) !important;
}
.catalog-container aside form .block.brand-block .list .item .checkbox {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}
.catalog-container aside form .block.brand-block .list .item {
	cursor: pointer;
}
.catalog-container aside form .block.brand-block .list .item:has(input:checked) {
	background: rgba(255, 214, 51, 0.3) !important;
}
.catalog-container aside form .block .list .item .count {
	background: #e4e4e4;
	border-radius: 999px;
	min-width: 26px;
	padding: 2px 8px;
	text-align: center;
	color: #555;
	font-weight: 500;
}
.catalog-container aside form .block[data-min] .range {
	display: flex !important;
	flex-direction: column;
	padding-bottom: 6px;
}
.catalog-container aside form .block[data-min] .inputs {
	order: -1;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr) !important;
	gap: 0 !important;
	margin: 0 0 22px !important;
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.catalog-container aside form .block[data-min] .inputs::after {
	content: '-';
	grid-column: 2;
	grid-row: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #dde1e6;
	color: #252525;
	font-size: 14px;
	font-weight: 700;
}
.catalog-container aside form .block[data-min] .inputs input.min-price {
	grid-column: 1;
	grid-row: 1;
}
.catalog-container aside form .block[data-min] .inputs input.max-price {
	grid-column: 3;
	grid-row: 1;
}
.catalog-container aside form .block[data-min] .inputs input {
	width: 100% !important;
	min-width: 0;
	height: 40px;
	padding: 0 12px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: #fff !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	text-align: left !important;
	box-shadow: none !important;
}
.catalog-container aside form .block[data-min] .line {
	height: 5px !important;
	margin: 6px 14px 0 !important;
	border-radius: 3px;
	background: #d4d4d4 !important;
}
.catalog-container aside form .block[data-min] .line .active-line {
	height: 5px !important;
	border-radius: 3px;
	background: var(--accent-color) !important;
}
.catalog-container aside form .block[data-min] .line .min-range,
.catalog-container aside form .block[data-min] .line .max-range {
	width: 24px !important;
	height: 24px !important;
	border: 3px solid #fff !important;
	background: var(--accent-color) !important;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
}
.catalog-container aside form .block[data-min] .range-ticks {
	position: relative;
	height: 34px;
	margin: 10px 14px 0;
}
.catalog-container aside form .block[data-min] .range-ticks span {
	position: absolute;
	top: 0;
	padding-top: 12px;
	transform: translateX(-50%);
	font-size: 11px;
	line-height: 14px;
	font-weight: 600;
	color: #8f8f8f;
	white-space: nowrap;
}
.catalog-container aside form .block[data-min] .range-ticks span::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	width: 1px;
	height: 8px;
	background: #c4c4c4;
}
.catalog-container aside form .block[data-min] .range-ticks span:first-child,
.catalog-container aside form .block[data-min] .range-ticks span:last-child {
	color: #252525;
}
.catalog-container aside form .block[data-min] .range {
	margin-top: -10px;
}
.catalog-container aside form .block.brand-block {
	position: relative;
	z-index: 1;
}
.catalog-container aside form .block.brand-block.open {
	z-index: 50;
	box-shadow: none;
}
.catalog-container aside form .block.brand-block > p.head {
	position: relative;
	z-index: 3;
	cursor: pointer;
	padding: 15px 28px 15px 0 !important;
}
.catalog-container aside form .block.brand-block > p.head::after {
	content: '';
	position: absolute;
	right: 4px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-right: 2px solid #252525;
	border-bottom: 2px solid #252525;
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.2s;
}
.catalog-container aside form .block.brand-block.open > p.head::after {
	transform: translateY(-30%) rotate(-135deg);
}
.catalog-container aside form .block.brand-block .brand-panel {
	display: none;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 2;
	padding: 48px 14px 12px;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
}
.catalog-container aside form .block.brand-block.open .brand-panel {
	display: block;
}
.catalog-container aside form .block[data-min] .range {
	padding-top: 0 !important;
	margin-top: 0 !important;
}
.catalog-container aside form .block[data-min] .range {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.catalog-container aside form .block[data-min] .line {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.catalog-container aside form .block[data-min] .range-ticks {
	margin-left: 12px;
	margin-right: 12px;
}
.catalog-container aside form .block .list {
	gap: 0 !important;
}
.catalog-container aside form .block .list .item {
	padding: 3px 10px !important;
}
.catalog-container aside form .block .brand-list .item .content img.flag {
	width: 24px !important;
	height: 16px !important;
	flex: 0 0 24px;
	margin: 0 2px;
}
.catalog-container aside form .block .list .item {
	min-height: 0 !important;
}
.catalog-container aside form .block .list .item {
	padding-left: 5px !important;
	padding-right: 5px !important;
}
.catalog-container aside form .block.brand-block,
.catalog-container aside form .block.brand-block .brand-panel {
	border-radius: 10px !important;
}
@media (max-width: 1278.98px) {
	.catalog-container aside .info-block .item {
		padding-left: 62px !important;
		padding-bottom: 14px !important;
	}
	.catalog-container aside .info-block .item p {
		font-size: 28px !important;
		line-height: 32px !important;
	}
	.catalog-container aside .info-block .item span {
		font-size: 12px !important;
		line-height: 15px !important;
	}
	.catalog-container aside .info-block .item::before {
		transform: scale(0.8);
		transform-origin: left center;
	}
}
.catalog-container aside form .block:not(.brand-block) .list {
	max-height: none !important;
	overflow: visible !important;
}
.catalog-container aside form .block .list .item .checkbox input:checked + label::after {
	width: 16px !important;
	height: 16px !important;
	border: 1px solid var(--accent-color) !important;
	border-radius: 4px !important;
	background: var(--accent-color) !important;
	color: #252525 !important;
	font-size: 10px !important;
}
.catalog-container aside form .block .list .item .checkbox input:checked + label::before {
	border-color: var(--accent-color) !important;
}
footer .footer-cities {
	margin-bottom: 40px;
}
footer .footer-cities h2 {
	margin-bottom: 15px;
	font-size: 25px;
	line-height: 30px;
	font-weight: 600;
	color: var(--text-2);
}
footer .footer-cities .items {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 8px 24px;
}
footer .footer-cities .items a {
	font-size: 16px;
	line-height: 22px;
	color: var(--footer-link-color);
	transition: .3s linear;
}
footer .footer-cities .items a:hover {
	color: #fff;
}
@media screen and (min-width: 768px) {
	header .container {
		padding-left: 20px;
		padding-right: 20px;
	}
	header .container .top {
		margin-left: -20px;
		margin-right: -20px;
	}
}
@media screen and (min-width: 1280px) {
	header .container .center,
	header .container .bottom {
		width: calc(100% - 40px);
		max-width: calc(100% - 40px);
		flex-basis: calc(100% - 40px);
		margin-left: 20px;
		margin-right: 20px;
	}
}
@media screen and (max-width: 767px) {
	.compare-block .table table tr th:first-child,
	.compare-block .table table tr td:first-child {
		width: 144px !important;
		min-width: 144px !important;
		max-width: 144px !important;
	}
	.compare-block .table table tr th:not(:first-child),
	.compare-block .table table tr td:not(:first-child) {
		width: 112px !important;
		min-width: 112px !important;
		padding: 8px 6px;
	}
	.compare-block .table table tr td:first-child > div {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		padding: 30px 10px 12px 10px !important;
	}
	.compare-block .table table tr td:first-child > div .img {
		width: 64px;
		height: 48px;
	}
	.compare-block .table table tr td:first-child > div .img img {
		max-width: 46px;
	}
	.compare-block .table table tr td:first-child > div div p {
		max-width: 100%;
		font-size: 11px !important;
		line-height: 14px !important;
		margin-bottom: 4px;
	}
	.compare-block .table table tr td:first-child > div div p a {
		font-size: 11px !important;
		line-height: 14px !important;
	}
	.compare-block .table table tr td:first-child > div div span {
		font-size: 10px;
		line-height: 13px;
	}
	.compare-block .table table tr td span.delete {
		top: 6px;
		right: 6px;
		width: 20px;
		height: 20px;
	}
}
@media screen and (max-width: 767px) {
	header a.phone-btn::before,
	header button.open-form::before,
	header a.cart::before {
		font-size: 18px !important;
		width: 18px !important;
		height: 18px !important;
		line-height: 18px !important;
	}
	header .container .center .btns .phone-btn,
	header .container .center .btns .cart,
	header .container .center .form-wrapper button.open-form {
		zoom: 1 !important;
	}
	header .burger {
		width: 19px !important;
		height: 17px !important;
	}
	header .burger::before,
	header .burger::after,
	header .burger span {
		width: 19px !important;
	}
}

@media screen and (min-width: 768px) {
	header .catalog-menu .blocks .block .empty {
		width: 100%;
		min-width: 460px;
		box-sizing: border-box;
	}
	header .catalog-menu .window-body > .blocks:has(.block.active .empty) {
		flex: 1 1 auto;
		min-width: 460px;
	}
}

/* End */


/* Start:/local/templates/akumulyator_template/css/card-compact.css?179403911318857*/
/*
 * Единая компактная карточка товара (ItemBuilderV1, класс .gs-compact):
 * каталог, поиск, подбор по авто, «Хиты продаж», избранное.
 * Класс удвоен (.gs-compact.gs-compact), чтобы перебить общие правила карточек
 * из front/style.css и catalog-cards.css, местами заданные с !important.
 * Шрифт и цвет задаём явно: глобальный сброс * их не наследует.
 */

.goods-snippet.gs-compact.gs-compact {
    padding: 12px 12px 14px !important;
    border: 1px solid #e7e7e7 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.goods-snippet.gs-compact.gs-compact:hover {
    border-color: var(--accent-color) !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .08) !important;
}

.goods-snippet.gs-compact.gs-compact .top {
    top: 12px;
    left: 12px;
}

/* Фото */
.goods-snippet.gs-compact.gs-compact .image-box {
    width: 100%;
    height: 150px;
    margin: 0 0 10px;
}

.goods-snippet.gs-compact.gs-compact .image-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.goods-snippet.gs-compact.gs-compact .image-box button.favorite,
.goods-snippet.gs-compact.gs-compact .image-box button.compare {
    right: 10px;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: #f4f4f2;
}

.goods-snippet.gs-compact.gs-compact .image-box button.favorite { top: 10px; }
.goods-snippet.gs-compact.gs-compact .image-box button.compare { top: 48px; }

.goods-snippet.gs-compact.gs-compact .image-box button.favorite:hover,
.goods-snippet.gs-compact.gs-compact .image-box button.compare:hover,
.goods-snippet.gs-compact.gs-compact .image-box button.active {
    background: var(--accent-color);
}

.goods-snippet.gs-compact.gs-compact .image-box button::before {
    transform: scale(.8);
}

/* Название: 2 строки, одинаковая высота во всех карточках */
.goods-snippet.gs-compact.gs-compact h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    min-height: 2.6em;
    margin: 0 0 10px;
    padding: 0;
    font: 600 14px/1.3 'Inter', sans-serif !important;
    color: #252525;
}

/* Главные характеристики — три плашки */
.goods-snippet.gs-compact.gs-compact .gs-specs {
    order: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    margin: 0 0 6px;
    padding: 0;
    list-style: none;
}

.goods-snippet.gs-compact.gs-compact .gs-specs li {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    margin: 0;
    padding: 6px 7px;
    border-radius: 8px;
    background: #fff6d6;
}

.goods-snippet.gs-compact.gs-compact .gs-specs span,
.goods-snippet.gs-compact.gs-compact .gs-size span {
    font: 500 12px/1.2 'Inter', sans-serif;
    color: #6b6b6b;
    white-space: nowrap;
}

.goods-snippet.gs-compact.gs-compact .gs-specs b {
    overflow: hidden;
    font: 700 14px/1.2 'Inter', sans-serif;
    color: #252525;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.goods-snippet.gs-compact.gs-compact .gs-size {
    order: 3;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin: 0 0 12px;
    padding: 6px 7px;
    border-radius: 8px;
    background: #f4f4f2;
}

.goods-snippet.gs-compact.gs-compact .gs-size b {
    font: 700 13px/1.2 'Inter', sans-serif;
    color: #252525;
    white-space: nowrap;
}

/* Цена и кнопки */
.goods-snippet.gs-compact.gs-compact .card-footer {
    gap: 10px;
}

.goods-snippet.gs-compact.gs-compact .price {
    min-height: 0;
    padding: 0;
}

.goods-snippet.gs-compact.gs-compact .price p {
    font: 800 22px/1.1 'Inter', sans-serif !important;
    color: var(--important-info);
}

.goods-snippet.gs-compact.gs-compact .price p.old {
    font: 500 13px/1.1 'Inter', sans-serif !important;
    color: #8a9099;
}

.goods-snippet.gs-compact.gs-compact .btns {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
    padding: 0;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart,
.goods-snippet.gs-compact.gs-compact .btns .bye {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0;
    padding: 0 8px !important;
    border: 0;
    border-radius: 10px !important;
    font: 700 13px/1 'Inter', sans-serif !important;
    white-space: nowrap;
    transition: background-color .2s ease, color .2s ease;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart {
    background: var(--accent-color) !important;
    color: #252525 !important;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart span {
    display: inline !important;
    font: inherit;
    color: inherit;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart::before {
    margin: 0 !important;
    font-size: 15px;
    color: inherit;
}

.goods-snippet.gs-compact.gs-compact .btns .bye {
    background: #252525 !important;
    color: #fff !important;
}

.goods-snippet.gs-compact.gs-compact .btns .bye::before {
    display: none !important;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart:hover {
    background: #ffce05 !important;
}

.goods-snippet.gs-compact.gs-compact .btns .bye:hover {
    background: #000 !important;
}

/* Телефон: 2 карточки в ряд */
@media screen and (max-width: 767px) {
    .goods-snippet.gs-compact.gs-compact {
        padding: 10px 10px 12px !important;
        border-radius: 12px !important;
    }

    .goods-snippet.gs-compact.gs-compact .top {
        top: 10px;
        left: 10px;
    }

    .goods-snippet.gs-compact.gs-compact .image-box {
        height: 112px;
        margin-bottom: 8px;
    }

    .goods-snippet.gs-compact.gs-compact .image-box button.favorite,
    .goods-snippet.gs-compact.gs-compact .image-box button.compare {
        right: 8px;
        width: 28px;
        height: 28px;
    }

    .goods-snippet.gs-compact.gs-compact .image-box button.favorite { top: 8px; }
    .goods-snippet.gs-compact.gs-compact .image-box button.compare { top: 40px; }

    .goods-snippet.gs-compact.gs-compact h3 {
        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    /* Три плашки в узкой карточке не помещаются — ёмкость и ток в ряд, полярность ниже */
    .goods-snippet.gs-compact.gs-compact .gs-specs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs li:nth-child(3) {
        grid-column: 1 / -1;
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs li {
        padding: 5px 6px;
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs b {
        font-size: 13px;
    }

    .goods-snippet.gs-compact.gs-compact .gs-size {
        flex-direction: column;
        gap: 2px;
        padding: 5px 6px;
        margin-bottom: 10px;
    }

    .goods-snippet.gs-compact.gs-compact .gs-size b {
        font-size: 12px;
    }

    .goods-snippet.gs-compact.gs-compact .price p {
        font-size: 18px !important;
        line-height: 1.1 !important;
    }

    .goods-snippet.gs-compact.gs-compact .btns {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .goods-snippet.gs-compact.gs-compact .btns .add-cart span {
        display: none !important;
    }

    .goods-snippet.gs-compact.gs-compact .btns .add-cart,
    .goods-snippet.gs-compact.gs-compact .btns .bye {
        height: 38px !important;
        min-height: 38px !important;
        font-size: 12px !important;
    }
}

/* Общие правила для узких экранов (front/style.css, ≤480px и ≤370px) с !important
   делают кнопки квадратными и шрифт 10px — в компактной карточке возвращаем свои размеры */
@media screen and (max-width: 767px) {
    .goods-snippet.gs-compact.gs-compact .image-box button.favorite,
    .goods-snippet.gs-compact.gs-compact .image-box button.compare {
        width: 28px !important;
        height: 28px !important;
        border-radius: 50% !important;
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs span,
    .goods-snippet.gs-compact.gs-compact .gs-size span {
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs b,
    .goods-snippet.gs-compact.gs-compact .gs-size,
    .goods-snippet.gs-compact.gs-compact .gs-size b {
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    .goods-snippet.gs-compact.gs-compact .btns .bye {
        font-size: 13px !important;
        line-height: 1 !important;
    }

    .goods-snippet.gs-compact.gs-compact .price p:not(.old) {
        font-size: 18px !important;
        line-height: 1.1 !important;
    }
}

/* ---------- Кнопки: корзина-иконка + широкая зелёная «Купить в 1 клик» ---------- */
.goods-snippet.gs-compact.gs-compact .btns {
    grid-template-columns: 44px minmax(0, 1fr);
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart {
    padding: 0 !important;
}

.goods-snippet.gs-compact.gs-compact .btns .add-cart span {
    display: none !important;
}

.goods-snippet.gs-compact.gs-compact .btns .bye {
    background: var(--green, #2b9f5a) !important;
    color: #fff !important;
}

.goods-snippet.gs-compact.gs-compact .btns .bye:hover {
    background: #23854a !important;
}

/* ---------- Ёмкость — главная характеристика, выделена ---------- */
.goods-snippet.gs-compact.gs-compact .gs-specs li:first-child {
    background: var(--accent-color);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06);
}

.goods-snippet.gs-compact.gs-compact .gs-specs li:first-child span {
    color: #252525;
}

.goods-snippet.gs-compact.gs-compact .gs-specs li:first-child b {
    font-weight: 800;
    font-size: 15px;
}

@media screen and (max-width: 767px) {
    .goods-snippet.gs-compact.gs-compact .btns {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .goods-snippet.gs-compact.gs-compact .btns .bye {
        font-size: 12px !important;
        padding: 0 4px !important;
    }

    .goods-snippet.gs-compact.gs-compact .gs-specs li:first-child b {
        font-size: 14px !important;
    }
}

/* Узкие телефоны: «Купить в 1 клик» в две строки, чтобы не обрезалось */
@media screen and (max-width: 420px) {
    .goods-snippet.gs-compact.gs-compact .btns .bye {
        white-space: normal;
        text-align: center;
        line-height: 1.15 !important;
    }
}


/* «Нашли дешевле?» под ценой — во всех карточках сайта */
.goods-snippet.gs-compact.gs-compact .price p .gs-star {
    position: relative;
    top: -.3em;
    margin-left: 1px;
    font-size: .72em;
    font-weight: 800;
    line-height: 0;
    color: var(--important-info);
}

.goods-snippet.gs-compact.gs-compact .price {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
    container-type: inline-size;
}

.goods-snippet.gs-compact.gs-compact .price p {
    grid-column: 1;
    white-space: nowrap;
}

/* справа от цены, две строки — по высоте блока цены, карточка не растёт */
.goods-snippet.gs-compact.gs-compact .gs-cheaper {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: stretch;
    min-width: 0;
    max-height: 2.3em;
    overflow: hidden;
    font: 500 11px/1.15 'Inter', sans-serif !important;
    color: #4a4a4a !important;
    text-align: right;
}

.goods-snippet.gs-compact.gs-compact .gs-cheaper b {
    display: block;
    font: inherit;
    font-weight: 800;
    color: var(--important-info);
    white-space: nowrap;
}

.goods-snippet.gs-compact.gs-compact .gs-cheaper span {
    font: inherit;
    color: inherit;
}

.goods-snippet.gs-compact.gs-compact .gs-cheaper__long,
.goods-snippet.gs-compact.gs-compact .gs-cheaper__cheap {
    display: none;
}

/* длинный вариант — только когда справа от цены достаточно места */
@container (min-width: 380px) {
    .goods-snippet.gs-compact.gs-compact .gs-cheaper__long {
        display: inline;
    }

    .goods-snippet.gs-compact.gs-compact .gs-cheaper__short {
        display: none;
    }
}

/* узко (телефон, 2 карточки в ряд): справа от цены места нет — одна строка под ценой,
   а отступ до кнопок уменьшаем на её высоту, чтобы карточка не выросла */
@container (max-width: 230px) {
    .goods-snippet.gs-compact.gs-compact .gs-cheaper {
        grid-column: 1 / -1;
        grid-row: auto;
        justify-self: start;
        max-height: 1.25em;
        margin: 1px 0 -8px;
        font-size: 10.5px !important;
        text-align: left;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .goods-snippet.gs-compact.gs-compact .gs-cheaper b {
        display: inline;
    }


    .goods-snippet.gs-compact.gs-compact .price p:not(.old) {
        line-height: 1 !important;
    }
}

/* самые узкие карточки (320–360px экраны): «* Дешевле? Звоните!» */
@container (max-width: 135px) {
    .goods-snippet.gs-compact.gs-compact .gs-cheaper__found {
        display: none;
    }

    .goods-snippet.gs-compact.gs-compact .gs-cheaper__cheap {
        display: inline;
    }
}

/* узкие карточки: строка «Нашли дешевле?» под ценой — компенсируем её высоту отступом под габаритами */
@media screen and (max-width: 1023px) {
    .goods-snippet.gs-compact.gs-compact .gs-size {
        margin-bottom: 7px;
    }
}

/* Плашка «Хит» — товары с галочкой «Хит продаж» (Classes\Catalog\Hits); стоит рядом с флагом */
.goods-snippet .top .gs-hit {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin-right: auto;
    padding: 4px 8px 3px;
    border-radius: 6px;
    background: #d4121a;
    box-shadow: 0 2px 6px rgba(212, 18, 26, .3);
    color: #fff;
    font: 700 11px/1 Inter, Arial, sans-serif;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.goods-snippet .top .gs-hit::before {
    width: 10px;
    height: 10px;
    margin-right: 4px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1c.6 3.2 3.4 5 5.2 7.6A8 8 0 1 1 4.6 10c.6 1.6 1.7 2.6 3 3C7 8.6 9.4 4.6 12 1Zm.6 11.5c-.3 1.7-1.6 2.5-2.4 3.6a2.6 2.6 0 1 0 4.7 1.6c0-2-1.6-3.3-2.3-5.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1c.6 3.2 3.4 5 5.2 7.6A8 8 0 1 1 4.6 10c.6 1.6 1.7 2.6 3 3C7 8.6 9.4 4.6 12 1Zm.6 11.5c-.3 1.7-1.6 2.5-2.4 3.6a2.6 2.6 0 1 0 4.7 1.6c0-2-1.6-3.3-2.3-5.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
    content: "";
}

/* Избранное (сердечко) и сравнение в карточке: нажатая кнопка — жёлтый круг с тёмной иконкой.
   Раньше иконка нажатой кнопки становилась жёлтой (css/style.css) и сливалась с жёлтым фоном */
.goods-snippet.gs-compact.gs-compact .image-box button.active {
    background: var(--accent-color) !important;
}
.goods-snippet.gs-compact.gs-compact .image-box button.active::before,
.goods-snippet.gs-compact.gs-compact .image-box button:hover::before {
    color: #252525 !important;
}

/* Товар уже в корзине (js/script.js, syncCartButtons): вместо корзины — синяя корзина с галочкой, клик ведёт в корзину */
.goods-snippet .btns .add-cart.in-cart::before {
    content: '' !important;
    display: inline-block;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    font-size: 0 !important;
    background: #1d5fd6; /* синяя — товар уже в корзине */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1.4'/%3E%3Ccircle cx='19' cy='21' r='1.4'/%3E%3Cpath d='M2 2.5h2.2l2.6 12.2a2 2 0 0 0 2 1.6h9.6a2 2 0 0 0 1.9-1.5L21.9 7H5.4'/%3E%3Cpath d='m9.5 10.8 2.2 2.2 4.3-4.4'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1.4'/%3E%3Ccircle cx='19' cy='21' r='1.4'/%3E%3Cpath d='M2 2.5h2.2l2.6 12.2a2 2 0 0 0 2 1.6h9.6a2 2 0 0 0 1.9-1.5L21.9 7H5.4'/%3E%3Cpath d='m9.5 10.8 2.2 2.2 4.3-4.4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 07.11: товар в корзине — зелёный фон, вместо корзины красная галочка (по просьбе заказчика) */
.goods-snippet.gs-compact.gs-compact .btns .add-cart.in-cart,
.goods-snippet .btns .add-cart.in-cart {
    background: #2b9f5a !important;
}
.goods-snippet.gs-compact.gs-compact .btns .add-cart.in-cart:hover,
.goods-snippet .btns .add-cart.in-cart:hover {
    background: #23874c !important;
}
.goods-snippet.gs-compact.gs-compact .btns .add-cart.in-cart::before,
.goods-snippet .btns .add-cart.in-cart::before {
    width: 24px;
    height: 24px;
    background: #e3141c;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 5 5 10-11'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 5 5 10-11'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* End */


/* Start:/local/templates/akumulyator_template/css/catalog-filter.css?179397274022709*/
/*
 * Фильтр каталога (catalog.smart.filter/akum): бренды списком «20 + показать все»,
 * страны — сворачиваемый список, «Хиты продаж!». Правила front/style.css заданы с !important —
 * здесь перекрываем их более точными селекторами.
 */

/* Бренды: список без внутренней прокрутки, сразу видно 20 */
.catalog-container aside form .block.brand-inline .list {
    max-height: none !important;
    overflow: visible !important;
}

.catalog-container aside form .block .list .item[hidden],
.catalog-container aside form .block.brand-inline .list .item.is-extra {
    display: none !important;
}

.catalog-container aside form .block.brand-inline.show-all .list .item.is-extra:not([hidden]),
.catalog-container aside form .block.brand-inline.searching .list .item.is-extra:not([hidden]) {
    display: flex !important;
}

.catalog-container aside form .block .toggle-all {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 40px;
    margin: 4px 0 14px;
    padding: 8px 12px;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    background: #fff;
    font: 600 14px/1.2 'Inter', sans-serif;
    color: #252525;
    cursor: pointer;
}

.catalog-container aside form .block .toggle-all:hover {
    border-color: #252525;
}

.catalog-container aside form .block .toggle-all::after {
    content: '';
    width: 6px;
    height: 6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
}

.catalog-container aside form .block.show-all .toggle-all::after {
    transform: translateY(2px) rotate(-135deg);
}

.catalog-container aside form .block .toggle-all span:last-of-type,
.catalog-container aside form .block.show-all .toggle-all span:first-of-type,
.catalog-container aside form .block.searching .toggle-all {
    display: none;
}

.catalog-container aside form .block.show-all .toggle-all span:last-of-type {
    display: inline;
}

/* Страны и габариты: свёрнуты по умолчанию, раскрываются по заголовку */
.catalog-container aside form .block.collapsible > p.head {
    position: relative;
    cursor: pointer;
    user-select: none;
}

.catalog-container aside form .block.collapsible > p.head::after {
    content: '';
    position: absolute;
    right: 6px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 2px solid #252525;
    border-bottom: 2px solid #252525;
    transform: translateY(-70%) rotate(45deg);
    transition: transform .2s;
}

.catalog-container aside form .block.collapsible:not(.hide) > p.head::after {
    transform: translateY(-30%) rotate(-135deg);
}

.catalog-container aside form .block.collapsible .list {
    max-height: none !important;
    overflow: visible !important;
}

/* «Хиты продаж!» — акцентом, без заголовка блока */
.catalog-container aside form .block.hit-block .list .item .checkbox label {
    color: #d4121a;
    font-weight: 700;
    font-size: 15px !important;
}

/* одна строка — по центру блока: общее правило даёт последнему элементу отступ снизу */
.catalog-container aside form .block.hit-block {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.catalog-container aside form .block.hit-block > .list,
.catalog-container aside form .block.hit-block > .list .item {
    margin: 0 !important;
}

.catalog-container aside form .block.hit-block > .list .item {
    min-height: 24px;
    align-items: center;
}

/* «Розничная цена» + флаг Беларуси и BYN */
.catalog-container aside form .block > p.head.price-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.catalog-container aside form .block > p.head.price-head .currency {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 13px;
    color: #606060;
}

.catalog-container aside form .block > p.head.price-head .flag {
    width: 20px;
    height: 14px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .12);
}

/*
 * Выбор по бренду — на главной (.selection-block.brands) и в каталоге (.choose-brand):
 * плитка только с картинкой бренда. Название остаётся в разметке скрытым — по нему ищет
 * поиск брендов на главной, его читают экранные дикторы.
 */
.selection-block.brands .items .item .brand-name,
.catalog-container .block.choose-brand .icon-list .item .brand-name {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* на главной размеры картинки заданы в front/style.css с !important — перекрываем точнее;
   без подписи картинка стоит по центру плитки */
.selection-block.brands .items .item:not(.more):not(.less-tile) {
    justify-content: center !important;
    padding: 8px !important;
}

.selection-block.brands .items .item:not(.more):not(.less-tile) > img {
    flex: none;
    width: 80% !important;
    max-width: none !important;
    height: calc(4.4 * var(--dvw)) !important;
    aspect-ratio: auto;
    object-fit: contain !important;
}

@media screen and (max-width: 1279.98px) {
    .selection-block.brands .items .item:not(.more):not(.less-tile) > img {
        height: 72px !important;
    }
}

@media screen and (max-width: 766px) {
    .selection-block.brands .items .item:not(.more):not(.less-tile) > img {
        height: 60px !important;
    }
}

.catalog-container .main-container .block.choose-brand .icon-list .item.brand-logo > img {
    display: block;
    width: 92%;
    height: 82%;
    object-fit: contain;
}

/* ниже 1280px каталог показывал бренды текстовыми кнопками — теперь тоже плитки с картинкой */
@media screen and (max-width: 1279.98px) {
    .catalog-container .main-container .block.choose-brand .icon-list {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
        gap: 7px;
    }

    .catalog-container .main-container .block.choose-brand .icon-list .item {
        height: 60px;
        padding: 6px;
        justify-content: center;
    }

    .catalog-container .main-container .block.choose-brand .icon-list .item.brand-logo > img {
        width: 100%;
        height: 100%;
    }
}

/* ===== Логотип в шапке =====
   Размер задаём высотой: на плашке «Тот самый! С 2007 года» мелкий текст,
   при старых 52–66px он сжимался до 4–5px и не читался. */
header .container .center a.logo {
    max-width: none !important;
    flex: 0 0 auto !important;
}
header .container .center a.logo img {
    width: auto !important;
    height: clamp(66px, calc(5.28 * var(--dvw)), 76px) !important;
}
@media screen and (max-width: 1279.98px) {
    header .container .center a.logo img {
        height: 60px !important;
    }
}
@media screen and (max-width: 767px) {
    header .container .center a.logo img {
        height: clamp(56px, calc(16 * var(--dvw)), 80px) !important;
    }
}

/*
 * Плитки брендов с фото АКБ (BrandImage::batterySrc) — на главной и в «Выбрать по бренду» в каталоге:
 * фото сверху, под ним название бренда жирным большими буквами. Фильтр брендов — по-прежнему логотипы.
 */
.selection-block.brands .items .item.brand-photo .brand-caption,
.catalog-container .block.choose-brand .icon-list .item.brand-photo .brand-caption {
    display: block;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-family: Inter, sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
    text-align: center;
    color: #252525;
}

/* главная */
.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
    flex-direction: column !important;
    justify-content: center !important;
    gap: 8px;
    padding: 12px 8px 10px !important;
}

.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
    width: 100% !important;
    height: calc(5.4 * var(--dvw)) !important;
    object-fit: contain !important;
}

.selection-block.brands .items .item.brand-photo .brand-caption {
    font-size: 14px;
    line-height: 17px;
}

@media screen and (max-width: 1279.98px) {
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
        height: 70px !important;
    }
}

@media screen and (max-width: 766px) {
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
        gap: 6px;
        padding: 10px 6px 8px !important;
    }

    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
        height: 58px !important;
    }

    .selection-block.brands .items .item.brand-photo .brand-caption {
        font-size: 12px;
        line-height: 15px;
    }
}

/* каталог: плитка того же размера, что кнопка «Еще» (размер задают старые правила плиток) */
.catalog-container .main-container .block.choose-brand .icon-list .item.brand-photo {
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    padding: 5px 4px 4px;
}

.catalog-container .main-container .block.choose-brand .icon-list .item.brand-photo > img {
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
}

.catalog-container .block.choose-brand .icon-list .item.brand-photo .brand-caption {
    flex: none;
    font-size: 10px;
    line-height: 12px;
}

@media screen and (max-width: 1279.98px) {
    .catalog-container .main-container .block.choose-brand .icon-list .item.brand-photo {
        padding: 4px 4px 3px;
    }

    .catalog-container .main-container .block.choose-brand .icon-list .item.brand-photo > img {
        width: 100%;
        height: auto;
    }
}

/* главная: front/style.css задаёт подписям плиток 11px и фиксированную высоту, а плитке — высоту по содержимому
   картинки; подпись с фото не должна сжиматься */
.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
    min-height: 124px !important;
}

.selection-block.brands .items .item.brand-photo:not(.more) p.brand-caption {
    flex: none;
    display: block !important;
    height: auto !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 17px !important;
    -webkit-line-clamp: unset;
}

.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
    flex: none;
}

@media screen and (max-width: 766px) {
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
        min-height: 100px !important;
    }

    .selection-block.brands .items .item.brand-photo:not(.more) p.brand-caption {
        font-size: 12px !important;
        line-height: 15px !important;
    }
}

/* главная: строки сетки брендов — по высоте плитки с подписью (в index.css были фиксированные) */
.selection-block.brands .items,
.selection-block.brands .items.open {
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
}

/* главная: плитки брендов компактнее — больше в ряду, фото и подпись мельче */
.selection-block.brands .items {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.selection-block.brands .items .item:not(.less-tile) {
    min-height: 0 !important;
}
.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
    min-height: 0 !important;
    gap: 4px;
    padding: 8px 5px 6px !important;
}
.selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
    height: 46px !important;
}
.selection-block.brands .items .item.brand-photo:not(.more) p.brand-caption {
    font-size: 12px !important;
    line-height: 14px !important;
}
.selection-block.brands .items .item.more span {
    font-size: 14px !important;   /* «СКРЫТЬ» в 18px не помещалась в плитку (119px текста при 108px) */
    letter-spacing: .02em !important;
    white-space: nowrap;
}
@media screen and (max-width: 1279.98px) {
    .selection-block.brands .items {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important;
    }
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
        height: 44px !important;
    }
}
@media screen and (max-width: 766px) {
    .selection-block.brands .items {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) {
        min-height: 0 !important;
        gap: 3px;
        padding: 6px 3px 5px !important;
    }
    .selection-block.brands .items .item.brand-photo:not(.more):not(.less-tile) > img {
        height: 34px !important;
    }
    .selection-block.brands .items .item.brand-photo:not(.more) p.brand-caption {
        font-size: 10px !important;
        line-height: 12px !important;
    }
}
/* телефон, главная: в свёрнутом блоке брендов 23 плитки, 24-я — «ЕЩЁ» (вместо кнопки «Показать ещё» на всю ширину);
   раскрыто — все бренды и плитка «СКРЫТЬ» в конце. Высота блока — по плиткам: в front/style.css
   свёрнутый блок обрезан под 3 ряда старых плиток (.items:not(.open)), здесь селектор сильнее */
@media screen and (max-width: 766px) {
    .selection-block.brands .items .item:not(.less-tile) {
        height: 74px !important;
    }
    .selection-block.brands .items:not(.open):not(.searching),
    .selection-block.brands .items.open:not(.searching) {
        height: auto !important;
        max-height: none !important;
    }
    .selection-block.brands .items:not(.open):not(.searching) .item.brand-photo:nth-child(n+24) {
        display: none !important;
    }
    .selection-block.brands .items:not(.open):not(.searching) .item.more:not(.less-tile) {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
    .selection-block.brands .items:not(.searching) .show-more,
    .selection-block.brands .items:not(.searching) .show-less {
        display: none !important;
    }
    .selection-block.brands .items.open:not(.searching) .item.less-tile {
        display: flex !important;
        align-items: center;
        justify-content: center;
        height: 74px !important;
    }
    .selection-block.brands .items .item.more span {
        font-size: 11px !important;   /* «СКРЫТЬ» — в плитку 84px */
        letter-spacing: .01em !important;
    }
}

/* телефон, каталог «Выбрать по бренду»: свёрнуто — 15 брендов и «Еще» шестнадцатой (как на главной);
   бренд перед «Еще» показывается после раскрытия */
@media screen and (max-width: 766px) {
    .catalog-container .main-container .block.choose-brand .icon-list:not(.show-more) .item.brand-photo:nth-child(16):has(+ .item.more) {
        display: none;
    }
}

/* Фильтр каталога: кнопка «Подобрать» внизу фильтра, прилипает к низу экрана (component_epilog.php) */
.catalog-container aside form .akum-filter-apply {
    position: sticky;
    bottom: 0;
    z-index: 6;
    margin-top: 14px;
    padding: 10px 0 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #fff 14px);
}

.catalog-container aside form .akum-filter-apply__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 48px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: var(--accent-color, #ffd633);
    color: #252525;
    font-family: Inter, sans-serif;
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color .15s, opacity .15s;
}

.catalog-container aside form .akum-filter-apply__btn:hover:not(:disabled) {
    background: #ffce05;
}

.catalog-container aside form .akum-filter-apply__btn:focus-visible {
    outline: 2px solid #252525;
    outline-offset: 2px;
}

/* ничего не выбрано — кнопка тоже жёлтая, текст приглушён */
.catalog-container aside form .akum-filter-apply__btn:disabled {
    background: var(--accent-color, #ffd633);
    color: rgba(37, 37, 37, .55);
    cursor: default;
}

.catalog-container aside form .akum-filter-apply__btn.is-busy {
    opacity: .75;
    cursor: progress;
}

.catalog-container aside form .akum-filter-apply__count {
    font-weight: 600;
}

/* телефон: внизу экрана закреплена панель с телефоном и мессенджерами (.mobile-menu, 40px) — кнопка над ней */
@media screen and (max-width: 767px) {
    .catalog-container aside form .akum-filter-apply {
        bottom: calc(40px + env(safe-area-inset-bottom, 0px));
    }
}

/* фильтр: без количества товаров напротив каждого значения (европейский, AGM, бренды…) */
.catalog-container aside form .block span.count {
    display: none !important;
}

/*
 * Страница «Аккумуляторы» (/catalog/, шаблон akum_catalog/sections.php): разделы плитками в оформлении главной.
 * Вид плиток (тёмная плитка с фото, иконка, на телефоне — жёлтые) — из index.css (section.promo .item.<класс>),
 * здесь — ровная сетка вместо сетки главной со слайдером и одинаковое положение фото.
 */
section.promo.catalog-promo {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: none !important;
    grid-auto-rows: 150px !important;
    gap: 14px !important;
    margin-top: 10px !important;
    margin-bottom: 60px !important;
}

section.promo.catalog-promo > .item {
    grid-area: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
}

section.promo.catalog-promo > .item > img {
    position: absolute !important;
    top: auto !important;
    left: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    max-width: 62% !important;
    height: 88% !important;
    object-fit: contain !important;
    object-position: right bottom;
}

section.promo.catalog-promo > .item > a {
    position: absolute;
    inset: 0;
    z-index: 4;
}

/* азиатский корпус — иконка легкового авто */
section.promo.catalog-promo > .item.asia::after {
    content: '\e049' !important;
}

/* компьютер: все плитки одного размера — подписи одинаковые (на главной у легковых крупнее) */
@media screen and (min-width: 1280px) {
    section.promo.catalog-promo > .item {
        padding: 22px 24px !important;
    }
    section.promo.catalog-promo > .item > span {
        font-size: 13px !important;
        line-height: 16px !important;
        margin-bottom: 5px !important;
    }
    section.promo.catalog-promo > .item > h2 {
        max-width: 58% !important;
        font-size: 18px !important;
        line-height: 22px !important;
    }
}

@media screen and (max-width: 1279px) {
    section.promo.catalog-promo {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-auto-rows: 96px !important;
        gap: 12px !important;
    }
}

@media screen and (max-width: 767px) {
    section.promo.catalog-promo {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-rows: auto !important;
        gap: 10px !important;
        margin-bottom: 36px !important;
    }
}

/* раздел без товаров (section_vertical.php, $sectionIsEmpty): сообщение вместо фильтра и списка */
.catalog-container--empty .main-container .result {
    display: none;
}

.catalog-container .main-container .catalog-empty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
    padding: 24px 28px;
    border-radius: 10px;
    background: #fff7d1;
    border: 1px solid #f3df8a;
}

.catalog-container .main-container .catalog-empty__title {
    margin: 0;
    font-size: 20px;
    line-height: 25px;
    font-weight: 700;
    color: #252525;
}

.catalog-container .main-container .catalog-empty__text {
    margin: 0;
    font-size: 15px;
    line-height: 22px;
    color: #3a3a3a;
}

.catalog-container .main-container .catalog-empty__text a {
    font-weight: 700;
    color: #252525;
    white-space: nowrap;
}

.catalog-container .main-container .catalog-empty__btn {
    margin-top: 4px;
    min-height: 44px;
    padding: 0 22px;
    border: 0;
    border-radius: 10px;
    background: var(--accent-color, #ffd633);
    color: #252525;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

@media screen and (max-width: 767px) {
    .catalog-container .main-container .catalog-empty {
        padding: 18px 16px;
    }

    .catalog-container .main-container .catalog-empty__title {
        font-size: 17px;
        line-height: 22px;
    }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/info-pages.css?179403315222570*/
/*
 * Информационные страницы: Контакты, Акции, Гарантия и возврат, О нас (классы ip-*).
 * Мобильная раскладка — основная; карточки, схемы на SVG, FAQ на <details>.
 * Глобальный сброс * задаёт шрифт и цвет каждому элементу — внутри .ip возвращаем наследование.
 */

.ip {
    --ip-dark: #1f1f1f;
    --ip-text: #333;
    --ip-muted: #6b6b6b;
    --ip-line: #e9e9e6;
    --ip-soft: #f5f5f2;
    --ip-yellow: var(--accent-color, #ffd633);
    --ip-yellow-soft: #fff6d6;
    --ip-green: var(--green, #2b9f5a);
    --ip-red: var(--important-info, #c8102e);
    --ip-radius: 14px;

    display: grid;
    gap: 14px;
    margin-bottom: 28px;
    font: 400 15px/1.55 'Inter', sans-serif;
    color: var(--ip-text);
}

:where(.ip) * {
    box-sizing: border-box;
    font: inherit;
    color: inherit;
}

:where(.ip) b,
:where(.ip) strong {
    font-weight: 700;
}

:where(.ip) :where(ul, ol, p, dl, dd, figure) {
    margin: 0;
    padding: 0;
    list-style: none;
}

:where(.ip) a {
    color: var(--ip-dark);
}

/* ---------- Блоки ---------- */
.ip-box {
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--ip-line);
    border-radius: var(--ip-radius);
    background: #fff;
}

.ip-box--soft {
    border-color: transparent;
    background: var(--ip-soft);
}

.ip-box--dark {
    border-color: transparent;
    background: var(--ip-dark);
    color: #fff;
}

.ip-title {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.25;
    color: var(--ip-dark);
}

.ip-box--dark .ip-title {
    color: #fff;
}

.ip-subtitle {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ip-dark);
}

.ip-lead {
    font-size: 16px;
    line-height: 1.6;
}

.ip-lead b {
    color: var(--ip-dark);
}

.ip-label {
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--ip-muted);
}

/* ---------- Цифры-факты ---------- */
.ip-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.ip-stat {
    min-width: 0;
    padding: 12px;
    border-radius: 12px;
    background: var(--ip-yellow-soft);
}

.ip-stat:first-child {
    background: var(--ip-yellow);
}

.ip-stat b {
    display: block;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.15;
    color: var(--ip-dark);
}

.ip-stat span {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    line-height: 1.35;
    color: var(--ip-text);
}

/* ---------- Карточки с иконкой ---------- */
.ip-cards {
    display: grid;
    gap: 10px;
}

.ip-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--ip-line);
    border-radius: var(--ip-radius);
    background: #fff;
}

.ip-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--ip-yellow);
}

.ip-card__icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: var(--ip-dark);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ip-card h3 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ip-dark);
}

.ip-card p {
    font-size: 14px;
    line-height: 1.5;
}

.ip-card p + p {
    margin-top: 4px;
}

.ip-card .ip-accent {
    font-weight: 800;
    text-transform: uppercase;
    color: var(--ip-red);
}

/* ---------- Схема шагов ---------- */
.ip-steps {
    display: grid;
    gap: 10px;
    counter-reset: ip-step;
}

.ip-step {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    min-width: 0;
    padding: 12px;
    border-radius: 12px;
    background: var(--ip-soft);
    counter-increment: ip-step;
}

.ip-step::before {
    content: counter(ip-step);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--ip-dark);
    font-size: 18px;
    font-weight: 800;
    color: var(--ip-yellow);
}

.ip-step h3 {
    margin: 0 0 2px;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ip-dark);
}

.ip-step p {
    font-size: 14px;
    line-height: 1.45;
}

/* ---------- Кнопки ---------- */
.ip-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.ip-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: var(--ip-yellow);
    font-size: 15px;
    font-weight: 700;
    color: var(--ip-dark) !important;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.ip-btn:hover {
    background: #ffce05;
}

.ip-btn--ghost {
    border: 2px solid currentColor;
    background: transparent;
}

.ip-box--dark .ip-btn--ghost {
    color: #fff !important;
}

.ip-btn--ghost:hover {
    background: rgba(0, 0, 0, .06);
}

/* ---------- FAQ ---------- */
.ip-faq {
    display: grid;
    gap: 6px;
}

.ip-faq details {
    border: 1px solid var(--ip-line);
    border-radius: 12px;
    background: #fff;
}

.ip-faq summary {
    position: relative;
    display: block;
    padding: 12px 44px 12px 14px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--ip-dark);
    cursor: pointer;
    list-style: none;
}

.ip-faq summary::-webkit-details-marker {
    display: none;
}

.ip-faq summary::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 16px;
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--ip-dark);
    border-bottom: 2px solid var(--ip-dark);
    transform: translateY(-70%) rotate(45deg);
    transition: transform .2s;
}

.ip-faq details[open] summary::after {
    transform: translateY(-30%) rotate(-135deg);
}

.ip-faq details > div {
    padding: 0 14px 14px;
    font-size: 14px;
    line-height: 1.55;
}

.ip-faq details > div p + p {
    margin-top: 6px;
}

/* ---------- SEO-текст ---------- */
.ip-text h2 {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ip-dark);
}

.ip-text h3 {
    margin: 14px 0 6px;
    font-size: 16px;
    font-weight: 800;
    color: var(--ip-dark);
}

.ip-text p {
    margin: 0 0 8px;
    font-size: 15px;
    line-height: 1.65;
}

.ip-text ul {
    margin: 0 0 8px;
}

.ip-text li {
    position: relative;
    padding-left: 18px;
    font-size: 15px;
    line-height: 1.6;
}

.ip-text li::before {
    content: '';
    position: absolute;
    left: 2px;
    top: .62em;
    width: 7px;
    height: 7px;
    border-radius: 2px;
    background: var(--ip-yellow);
}

/* ---------- Контакты ---------- */
.ip-contacts {
    display: grid;
    gap: 14px;
}

.ip-contact-list {
    display: grid;
    gap: 12px;
}

.ip-contact {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.ip-contact__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--ip-yellow);
}

.ip-contact__icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: var(--ip-dark);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ip-contact > div > span {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--ip-muted);
}

.ip-contact b,
.ip-contact a {
    font-size: 17px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--ip-dark);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.ip-contact a.ip-phone {
    color: var(--ip-red);
    white-space: nowrap;
}

.ip-contact small {
    margin-left: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--ip-muted);
}

.ip-messengers {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ip-messengers a {
    display: flex;
    width: 44px;
    height: 44px;
}

.ip-map {
    overflow: hidden;
    min-height: 260px;
    border-radius: var(--ip-radius);
    background: var(--ip-soft);
}

.ip-map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 260px;
    border: 0;
}

.ip-requisites summary {
    font-size: 15px;
}

.ip-requisites dl {
    display: grid;
    gap: 6px;
}

.ip-requisites dl div {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    font-size: 14px;
    line-height: 1.45;
}

.ip-requisites dt {
    font-size: 12px;
    font-weight: 600;
    color: var(--ip-muted);
}

.ip-requisites dd {
    font-weight: 600;
    color: var(--ip-dark);
    overflow-wrap: anywhere;
}

/* ---------- Фото и сертификат ---------- */
.ip-photos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.ip-photos a {
    display: block;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 4 / 3;
    background: var(--ip-soft);
}

.ip-photos img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}

.ip-photos a:hover img {
    transform: scale(1.04);
}

.ip-cert {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.ip-cert a {
    display: block;
    overflow: hidden;
    border: 1px solid var(--ip-line);
    border-radius: 8px;
}

.ip-cert img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---------- Схема-инфографика (SVG) ---------- */
.ip-scheme {
    display: block;
    width: 100%;
    height: auto;
}

/* ---------- ≥ 600px ---------- */
@media screen and (min-width: 600px) {
    .ip-box {
        padding: 20px 22px;
    }

    .ip-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ip-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ip-photos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ip-requisites dl div {
        grid-template-columns: 180px minmax(0, 1fr);
        gap: 12px;
    }
}

/* ---------- ≥ 900px ---------- */
@media screen and (min-width: 900px) {
    .ip-contacts {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
        align-items: stretch;
    }

    .ip-map,
    .ip-map iframe {
        min-height: 100%;
    }

    .ip-steps {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ip-step {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .ip-step:not(:last-child)::after {
        content: '';
        position: absolute;
        top: 34px;
        right: -10px;
        z-index: 1;
        width: 10px;
        height: 2px;
        background: var(--ip-dark);
    }

    .ip-split {
        display: grid;
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
        gap: 14px;
        align-items: start;
    }

    .ip-photos {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* ---------- ≥ 1200px ---------- */
@media screen and (min-width: 1200px) {
    .ip-cards--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ip-cards--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ip-card--column {
        grid-template-columns: 1fr;
    }
}

/* ---------- Узкие телефоны ---------- */
@media screen and (max-width: 374.98px) {
    .ip-box {
        padding: 14px 12px;
    }

    .ip-title {
        font-size: 18px;
    }

    .ip-stat b {
        font-size: 19px;
    }

    .ip-card {
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 12px;
    }

    .ip-card__icon {
        width: 44px;
        height: 44px;
    }

    .ip-contact b,
    .ip-contact a {
        font-size: 15px;
    }
}

/* Выдержки из законодательства (include/warranity/main.php) — внутри раскрывающегося блока */
.ip-legal .wrapper {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ip-legal h2 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 800;
    color: var(--ip-dark);
}

.ip-legal p,
.ip-legal div {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.ip-legal p {
    margin: 0 0 6px !important;
}

.ip-legal img {
    max-width: 100%;
    height: auto;
}

/* ===== Хиты продаж (/catalog/hity-prodazh/): бренды, о магазине, контакты — классы hp-* ===== */
.hp-brands {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
}
.hp-brand {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--ip-line);
    border-radius: var(--ip-radius);
    background: #fff;
    transition: border-color .2s, box-shadow .2s;
}
.hp-brand:hover {
    border-color: var(--ip-yellow);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .06);
}
.hp-brand__img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    margin-bottom: 10px;
    border-radius: 10px;
    background: var(--ip-soft);
}
.hp-brand__img img {
    max-width: 85%;
    max-height: 105px;
    object-fit: contain;
}
.hp-brand h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--ip-dark);
}
.hp-brand__tag {
    margin: 2px 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ip-muted);
}
.hp-brand p {
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 1.5;
}
.hp-brand ul {
    display: grid;
    gap: 3px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
    font-size: 13px;
    line-height: 1.4;
}
.hp-brand li {
    position: relative;
    padding-left: 16px;
}
.hp-brand li::before {
    content: '';
    position: absolute;
    top: .5em;
    left: 2px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ip-yellow);
}
.hp-brand .ip-btn {
    margin-top: auto;
    align-self: flex-start;
    min-height: 38px;
    font-size: 14px;
}
.hp-store {
    display: grid;
    gap: 14px;
}
.hp-store .ip-photos a {
    aspect-ratio: 4 / 3;
}
.hp-contacts {
    display: grid;
    gap: 14px;
}
.hp-contacts .ip-map {
    min-height: 300px;
}
@media screen and (min-width: 900px) {
    .hp-store {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: start;
    }
    .hp-contacts {
        grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    }
}
@media screen and (min-width: 1200px) {
    .hp-brands {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
.hp-store .ip-photos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* телефон: бренды — горизонтальная лента с прокруткой пальцем */
@media screen and (max-width: 599.98px) {
    .hp-brands {
        display: flex;
        gap: 10px;
        margin: 0 -16px;
        padding: 0 16px 6px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }
    .hp-brands::-webkit-scrollbar {
        display: none;
    }
    .hp-brand {
        flex: 0 0 80%;
        scroll-snap-align: start;
    }
}
/* лента брендов не должна растягивать колонку страницы */
.ip > section:has(> .hp-brands) {
    min-width: 0;
}
.hp-brands {
    min-width: 0;
}
@media screen and (min-width: 900px) {
    .hp-store {
        align-items: stretch;
    }
    .hp-store .ip-photos a {
        aspect-ratio: 3 / 2;
    }
}
@media screen and (min-width: 900px) {
    .hp-store > .ip-box {
        align-self: stretch;
    }
    .hp-store .ip-photos a {
        aspect-ratio: 16 / 10;
    }
}
/* статья в новостях с блоками «Хитов продаж» */
.hp-article {
    margin-top: 24px;
}
.akb-table-wrap {
    overflow-x: auto;
    margin: 0 0 16px;
}
.akb-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.4;
}
.akb-table th,
.akb-table td {
    padding: 8px 10px;
    border: 1px solid #e9e9e6;
    text-align: left;
    vertical-align: top;
}
.akb-table th {
    background: #fff6d6;
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .akb-table {
        min-width: 600px;
    }
}

/* 2026-11-06: /privacy/ — юридический текст: отступы, маркеры списков, ширина строки */
.ip-legal.ip-legal section > p { margin: 0 0 10px; max-width: 72em; font: 400 15px/1.6 Inter, sans-serif; color: #3a363c; }
.ip-legal.ip-legal section > p b { font: inherit; font-weight: 700; color: #1f1b20; }
.ip-legal.ip-legal section > p a { font: inherit; color: #1f1b20; text-decoration: underline; text-decoration-color: #ffd633; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ip-legal.ip-legal section > ul { margin: 0 0 12px; padding: 0 0 0 22px; max-width: 72em; }
.ip-legal.ip-legal section > ul > li { list-style: disc; margin: 0 0 6px; padding: 0; font: 400 15px/1.55 Inter, sans-serif; color: #3a363c; }
.ip-legal.ip-legal section > ul > li::marker { color: #e0b800; }
.ip-legal.ip-legal section > ul > li::before { content: none !important; display: none !important; }
.ip-legal.ip-legal section > ul > li b { font: inherit; font-weight: 700; color: #1f1b20; }
.ip-legal.ip-legal .ip-note { margin-top: 14px; font-size: 13px; color: #6b6870; }
@media (max-width: 767px) { .ip-legal.ip-legal section > p, .ip-legal.ip-legal section > ul > li { font-size: 14px; } }

/* 2026-11-06: /contacts/ — карта меньше, подпись магазина на карте, фото магазина и схема проезда */
.ip-map.ip-map--shop { position: relative; min-height: 220px; max-height: 320px; }
.ip-map.ip-map--shop iframe { min-height: 220px; height: 100%; max-height: 320px; }
.ip-map__label { position: absolute; left: 50%; top: calc(50% - 46px); transform: translateX(-50%); padding: 6px 12px; border-radius: 8px; background: #1f1b20; color: #fff; font: 600 14px/1.2 Inter, sans-serif; white-space: nowrap; pointer-events: none; box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.ip-map__label b { font: inherit; font-weight: 800; color: #ffd633; }
.ip-map__label::after { content: ''; position: absolute; left: 50%; bottom: -6px; margin-left: -6px; border: 6px solid transparent; border-bottom: 0; border-top-color: #1f1b20; }
.ip-shop__photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ip-shop__photos li { margin: 0; padding: 0; list-style: none; }
.ip-shop__photos li::before { content: none !important; display: none !important; }
.ip-shop__photos img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; background: #f2f0ea; }
.ip-shop__more { margin: 10px 0 0; font: 600 15px/1.4 Inter, sans-serif; }
.ip-shop__more a { font: inherit; color: #1f1b20; text-decoration: underline; text-decoration-color: #ffd633; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ip-route__img { display: block; border: 1px solid #e6e3da; border-radius: 12px; overflow: hidden; background: #fff; }
.ip-route__img img { display: block; width: 100%; height: auto; }
@media (min-width: 768px) {
    .ip-shop__photos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
}
@media (min-width: 1024px) {
    .ip-map.ip-map--shop, .ip-map.ip-map--shop iframe { min-height: 260px; max-height: 340px; }
    .ip-route__img { max-width: 1000px; }
}
.ip .ip-shop__photos img { height: auto !important; max-height: none !important; aspect-ratio: 4 / 3 !important; object-fit: cover !important; }

/* 2026-11-07: /contacts/ — справа от контактов: реквизиты (верх) и 4 карточки 2×2 (низ), высота = блок контактов */
.ip-side { display: grid; gap: 12px; min-width: 0; }
.ip-req { padding: 16px 18px; }
.ip-req__title { margin: 0 0 10px; font: 700 18px/1.25 Inter, sans-serif; color: #1f1b20; }
.ip-req__list { display: grid; gap: 6px; margin: 0; }
.ip-req__list > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 10px; }
.ip-req__list dt { margin: 0; font: 600 12px/1.45 Inter, sans-serif; color: #6b6870; }
.ip-req__list dd { margin: 0; font: 400 13px/1.45 Inter, sans-serif; color: #1f1b20; overflow-wrap: anywhere; }
.ip-cards.ip-cards--side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; height: 100%; }
.ip-cards.ip-cards--side .ip-card { height: 100%; box-sizing: border-box; }
@media (max-width: 599px) {
    .ip-req__list > div { grid-template-columns: 1fr; gap: 0; }
    .ip-cards.ip-cards--side { grid-template-columns: 1fr; }
}
@media (min-width: 1024px) {
    .ip-side { grid-template-rows: auto 1fr; contain: size; height: 100%; }
    .ip-contacts > .ip-box:first-child { min-height: 560px; }
}
/* компактные карточки 2×2 справа */
.ip .ip-cards.ip-cards--side .ip-card { display: grid !important; grid-template-columns: 36px minmax(0, 1fr); align-items: start; gap: 10px; padding: 12px 14px !important; }
.ip .ip-cards.ip-cards--side .ip-card__icon { width: 36px !important; height: 36px !important; border-radius: 10px; margin: 0 !important; }
.ip .ip-cards.ip-cards--side .ip-card__icon svg { width: 20px; height: 20px; }
.ip .ip-cards.ip-cards--side .ip-card h3 { margin: 0 0 4px !important; font-size: 15px !important; line-height: 1.25 !important; }
.ip .ip-cards.ip-cards--side .ip-card p { margin: 0 !important; font-size: 13px !important; line-height: 1.4 !important; }
.ip-req { padding: 14px 18px; }
.ip-req__title { font-size: 17px; margin-bottom: 8px; }
.ip-req__list { gap: 3px; }
@media (min-width: 1024px) {
    .ip-side { grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); }
    .ip-req { display: flex; flex-direction: column; justify-content: center; }
    .ip-cards.ip-cards--side { grid-template-rows: 1fr 1fr; }
    .ip-contacts > .ip-box:first-child { min-height: 0; }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/footer.css?179407548513002*/
/*
 * Подвал сайта (footer.php, классы .sf-*).
 * Подключается после style.css и responsive.css. Глобальный сброс шаблона
 * (* { font; color }) не даёт наследовать шрифт и цвет — они заданы у каждого элемента.
 */

.site-footer {
    --sf-bg: #1e1e1e;
    --sf-line: rgba(255, 255, 255, .1);
    --sf-text: #d4d4d4;
    --sf-muted: #9a9a9a;
    --sf-head: #fff;
    --sf-accent: #ffd633;

    padding-top: 48px !important;
    padding-bottom: 24px !important;
    background: var(--sf-bg) !important;
}

.site-footer a { transition: color .15s ease; }

/* ---------- Верх: бренд + разделы ---------- */

.sf-main {
    display: grid;
    grid-template-columns: 232px minmax(0, 1fr) 270px;
    gap: 40px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--sf-line);
}

/* Логотип, слоган и соцсети — по центру колонки бренда */
.sf-brand { display: flex; flex-direction: column; align-items: center; text-align: center; }

.sf-logo { display: inline-flex; }

.sf-logo img { display: block; width: 150px; height: auto; }

.sf-slogan {
    margin: 12px 0 0;
    font: 700 16px/1.3 'Inter', sans-serif;
    color: var(--sf-accent);
    text-align: center;
}

.sf-phones { display: flex; flex-direction: column; gap: 6px; }

.sf-phone {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    font: 700 19px/1.25 'Inter', sans-serif;
    color: var(--sf-head);
    text-decoration: none;
    white-space: nowrap;
}

.sf-phone span {
    min-width: 32px;
    font: 500 12px/1 'Inter', sans-serif;
    color: var(--sf-muted);
}

.sf-phone:hover { color: var(--sf-accent); }

.sf-callback {
    margin-top: 14px;
    padding: 11px 18px;
    border: 0;
    border-radius: 10px;
    background: var(--sf-accent);
    font: 700 14px/1.2 'Inter', sans-serif;
    color: #252525;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform .15s ease;
}

.sf-callback:hover { transform: translateY(-1px); }

.sf-facts {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 16px 0 0;
    padding: 0;
    list-style: none;
}

.sf-fact {
    position: relative;
    padding-left: 26px;
    font: 400 14px/1.4 'Inter', sans-serif;
    color: var(--sf-text);
}

.sf-fact a { font: inherit; color: var(--sf-text); text-decoration: none; }
.sf-fact a:hover { color: var(--sf-accent); }

.sf-fact::before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 18px;
    font-family: 'icon';
    font-size: 15px;
    line-height: 1.2;
    color: var(--sf-accent);
    text-align: center;
}

.sf-fact--time::before { content: '\e001'; }
.sf-fact--place::before { content: '\e005'; }
.sf-fact--mail::before { content: '\e022'; font-size: 13px; }

.sf-social { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px; }

.site-footer .sf-social a {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: var(--sf-head);
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease;
}

.site-footer .sf-social a::before { font-family: 'icon'; color: inherit !important; opacity: 1 !important; background: none !important; }
.sf-social a.tg::before { content: '\e023'; font-size: 18px; padding-right: 2px; }
.sf-social a.vb::before { content: '\e026'; font-size: 19px; }
.sf-social a.wa::before { content: '\e025'; font-size: 20px; }
/* Instagram и почта на сайте нарисованы масками (глифы шрифта для них не используются) */
.site-footer .sf-social a.inst::before,
.site-footer .sf-social a.mail::before {
    content: "" !important;
    display: block !important;
    width: 18px;
    height: 18px;
    background: currentColor !important;
}
.site-footer .sf-social a.inst::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat; }
.site-footer .sf-social a.mail::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat; }
.site-footer .sf-social a:hover { background: var(--sf-accent); color: #252525; }

/* ---------- Разделы (аккордеоны на телефоне) ---------- */

.sf-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.sf-acc > summary {
    display: block;
    margin-bottom: 14px;
    font: 700 15px/1.3 'Inter', sans-serif;
    color: var(--sf-head);
    text-transform: uppercase;
    letter-spacing: .04em;
    list-style: none;
    cursor: default;
}

.sf-acc > summary::-webkit-details-marker { display: none; }

.sf-links { display: flex; flex-direction: column; gap: 10px; }

.sf-links a,
.sf-city-list a {
    font: 400 15px/1.35 'Inter', sans-serif;
    color: var(--sf-text);
    text-decoration: none;
}

.sf-links a::first-letter { text-transform: uppercase; }

.sf-links a:hover,
.sf-city-list a:hover { color: var(--sf-accent); }

/* ---------- Города ---------- */

.sf-cities { padding: 28px 0; border-bottom: 1px solid var(--sf-line); }

.sf-city-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px 24px;
}

.sf-city-list a { font-size: 14px; color: var(--sf-muted); }

/* ---------- Низ: реквизиты, оплата, копирайт ---------- */

.sf-bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 16px 40px;
    padding-top: 24px;
}

.sf-requisites p {
    margin: 0;
    font: 400 12px/1.55 'Inter', sans-serif;
    color: var(--sf-muted);
    columns: 2;
    column-gap: 40px;
}

.sf-requisites > summary { margin-bottom: 8px; font-size: 13px; color: var(--sf-muted); }

.sf-pay {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    max-width: 420px;
}

.sf-pay-logo {
    display: inline-grid;
    place-items: center;
    height: 34px;
    padding: 6px 10px;
    border-radius: 8px;
    background: #fff;
}

.sf-pay-logo img { display: block; width: auto; height: 22px; max-width: 76px; object-fit: contain; }

.sf-copy {
    grid-column: 1 / -1;
    margin: 4px 0 0;
    font: 400 12px/1.4 'Inter', sans-serif;
    color: var(--sf-accent);
}

/* ---------- Ноутбук / планшет ---------- */

@media screen and (min-width: 1400px) {
    .sf-city-list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media screen and (max-width: 1199px) {
    .sf-main {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas: "brand contacts" "nav nav";
        gap: 28px 40px;
    }
    .sf-brand { grid-area: brand; }
    .sf-contacts { grid-area: contacts; }
    .sf-nav { grid-area: nav; padding-top: 24px; border-top: 1px solid var(--sf-line); }
    .sf-city-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sf-requisites p { columns: 1; }
}

@media screen and (max-width: 900px) {
    .sf-city-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sf-bottom { grid-template-columns: 1fr; }
    .sf-pay { justify-content: flex-start; max-width: none; }
}

/* ---------- Телефон ---------- */

@media screen and (max-width: 767px) {
    .site-footer { padding-top: 28px !important; padding-bottom: calc(var(--mobile-bar-h, 64px) + 16px) !important; }

    .sf-main { display: flex; flex-direction: column; gap: 0; padding-bottom: 0; border-bottom: 0; }
    .sf-brand { order: 1; }
    .sf-contacts { order: 2; padding: 18px 0 20px; border-bottom: 1px solid var(--sf-line); }
    .sf-nav { order: 3; padding-top: 0; border-top: 0; }
    .sf-social { margin-top: 14px; }
    .sf-phone { font-size: 19px; }
    .sf-callback { width: 100%; padding: 13px 18px; }

    .sf-nav { grid-template-columns: 1fr; gap: 0; }

    .sf-acc { border-bottom: 1px solid var(--sf-line); }

    .sf-acc > summary {
        position: relative;
        margin: 0;
        padding: 15px 32px 15px 0;
        cursor: pointer;
    }

    .sf-acc > summary::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 4px;
        width: 9px;
        height: 9px;
        margin-top: -7px;
        border-right: 2px solid var(--sf-accent);
        border-bottom: 2px solid var(--sf-accent);
        transform: rotate(45deg);
        transition: transform .2s ease;
    }

    .sf-acc[open] > summary::after { margin-top: -2px; transform: rotate(-135deg); }

    .sf-links { gap: 0; padding-bottom: 10px; }
    .sf-links a { padding: 8px 0; }

    .sf-cities { padding: 0; border-bottom: 0; }
    .sf-city-list { grid-template-columns: 1fr; gap: 0; padding-bottom: 12px; }
    .sf-city-list a { padding: 7px 0; font-size: 14px; }

    .sf-bottom { gap: 16px; padding-top: 0; }
    .sf-requisites p { columns: 1; padding-bottom: 14px; font-size: 12px; }
    .sf-requisites > summary { font-size: 15px; color: var(--sf-head); }
    .sf-pay { gap: 6px; }
    .sf-pay-logo { height: 30px; padding: 5px 8px; }
    .sf-pay-logo img { height: 20px; max-width: 64px; }
}

@media screen and (max-width: 359px) {
    .sf-phone { font-size: 17px; }
}

/* ---------- Города: 2026-11-05 — две группы, ссылки строкой ---------- */
.sf-cities { padding: 22px 0; }
.sf-cities .sf-acc > summary { margin-bottom: 12px; }
.sf-city-groups {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr);
    gap: 16px 48px;
}
.sf-city-label {
    margin: 0 0 8px;
    font: 600 12px/1.3 'Inter', sans-serif;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--sf-muted);
    opacity: .8;
}
.sf-city-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
}
.sf-city-list a {
    font: 400 14px/1.4 'Inter', sans-serif;
    color: var(--sf-text);
    white-space: nowrap;
}
.sf-city-list a.sf-city-hub { color: var(--sf-accent); }
.sf-city-list a:hover { color: var(--sf-accent); }
@media screen and (max-width: 900px) {
    .sf-city-groups { grid-template-columns: 1fr; gap: 14px; }
}
@media screen and (max-width: 767px) {
    .sf-cities .sf-acc > summary { margin: 0; }
    .sf-city-groups { padding-bottom: 14px; }
    .sf-city-list { gap: 4px 14px; padding-bottom: 0; }
    .sf-city-list a { padding: 3px 0; font-size: 14px; }
}

/* 2026-11-06: логотип по центру над слоганом. В logo-dark.svg справа плашка «ТОТ САМЫЙ!», значок и надпись
   AKKUMULYATOR.BY стоят на 39% ширины файла, а не на 50% — сдвиг на 10,6% ширины ставит их ровно по центру */
.sf-logo img { transform: translateX(10.6%); }

/* 2026-11-06: телефон в реквизитах — явной ссылкой в цвете подвала; автоссылки iOS/Android (синие на тёмном) — тем же цветом */
.sf-requisites p a,
.sf-requisites p a[x-apple-data-detectors],
.site-footer a[x-apple-data-detectors] {
    color: var(--sf-text) !important;
    text-decoration: none !important;
    font: inherit !important;
}
.sf-requisites p a.sf-req-phone { color: var(--sf-head) !important; font-weight: 600 !important; white-space: nowrap; }
.sf-requisites p a.sf-req-phone:hover { color: var(--sf-accent) !important; }

/* 2026-11-06: запись о регистрации в Торговом реестре РБ */
.sf-trade {
    grid-column: 1 / -1;
    margin: 4px 0 0;
    font: 400 12px/1.45 'Inter', sans-serif;
    color: var(--sf-muted);
}
@media screen and (max-width: 767px) {
    .sf-trade { margin: 0; }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/social-icons.css?17932019463168*/
/*
 * Иконки мессенджеров и соцсетей — единые для всего сайта.
 * Разметка: Classes\Content\Contacts::renderSocialIcons() — порядок Telegram, Viber, WhatsApp, Instagram, почта;
 * класс .soc .soc--<tg|vb|wa|ig|mail>. Размер и раскладку задаёт блок, где стоят иконки,
 * здесь — только картинка: цветная плитка с белым знаком (images/social/*.svg).
 * Старые иконки шрифтом 'icon' и цветные подложки перекрываем.
 */

.soc--tg { --soc-img: url("/local/templates/akumulyator_template/images/social/tg.svg"); }
.soc--vb { --soc-img: url("/local/templates/akumulyator_template/images/social/vb.svg"); }
.soc--wa { --soc-img: url("/local/templates/akumulyator_template/images/social/wa.svg"); }
.soc--ig { --soc-img: url("/local/templates/akumulyator_template/images/social/ig.svg"); }
.soc--mail { --soc-img: url("/local/templates/akumulyator_template/images/social/mail.svg"); }

/*
 * Класс .soc повторён трижды, чтобы перебить старые правила блоков вида
 * «.site-footer .sf-social a.inst::before { … !important }».
 */

/* Иконка без подписи: плитка на весь размер ссылки */
a.soc.soc.soc:not(.soc--inline),
span.soc.soc.soc {
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 24% !important;
    transition: transform .15s ease, opacity .15s ease;
}

a.soc.soc.soc:not(.soc--inline):hover {
    opacity: .88;
    transform: translateY(-1px);
}

a.soc.soc.soc:not(.soc--inline)::before,
span.soc.soc.soc::before {
    content: '' !important;
    display: block !important;
    position: static !important;
    flex: 0 0 auto;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    font-size: 0 !important;
    background: var(--soc-img) center / contain no-repeat !important;
    -webkit-mask: none !important;
    mask: none !important;
    transform: none !important;
}

a.soc.soc.soc:not(.soc--inline)::after,
span.soc.soc.soc::after {
    display: none !important;
}

/* Иконка с подписью («Telegram», «WhatsApp»…): плитка 24px слева от текста */
a.soc.soc.soc--inline {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    background: none !important;
}

a.soc.soc.soc--inline::before {
    content: '' !important;
    display: block !important;
    position: static !important;
    flex: 0 0 24px;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    font-size: 0 !important;
    border-radius: 6px;
    background: var(--soc-img) center / contain no-repeat !important;
    -webkit-mask: none !important;
    mask: none !important;
}

/* Страница и блок контактов: иконка-плитка слева от названия мессенджера */
.items .item > span.icon.soc.soc.soc {
    top: 6px;
    width: 32px;
    height: 32px;
}

/* End */


/* Start:/local/templates/akumulyator_template/css/header.css?179365413075362*/
/*
 * Шапка сайта — новая раскладка поверх старых правил (css/style.css, front/style.css).
 * Подключается последней (IncludeFiles::includeCss), разметка header.php не менялась.
 *
 * Компьютер (от 1280px), три полосы:
 *   жёлтая — преимущества и адрес;
 *   белая  — логотип, слоган, поле поиска, карточка контактов, сравнение/избранное/корзина;
 *   тёмная — каталог, услуги, доставка, магазины и ссылки разделов.
 * Контакты: виден один номер и статус под ним; по стрелке — все телефоны, сервис,
 * мессенджеры и часы работы (разметка header.php, поведение js/header-contacts.js).
 * Планшет и телефон: поиск — отдельной строкой во всю ширину под логотипом.
 */

header {
    --hd-dark: #1f1b20;
    --hd-yellow: #ffd633;
    --hd-red: #bb1303;
    --hd-line: #e6e3da;
    --hd-soft: #f6f5f0;
    --hd-muted: #6b6870;
}

/* ===== Поле поиска (везде) ===== */
header .container .center .form-wrapper button.open-form {
    display: none !important;
}
header .container .center .form-wrapper form {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    display: flex !important;
    align-items: center;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 46px;
    margin: 0 !important;
    padding: 0 4px 0 0 !important;
    background: var(--hd-soft) !important;
    border: 1.5px solid var(--hd-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    overflow: hidden;
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
/* старое выпадающее поле на телефоне сдвигалось через #title-search { left: 20px } */
header .container .center .form-wrapper #title-search {
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: none !important;
}
/* старая подложка-затемнение раскрывающегося поиска больше не нужна */
header .container .center .form-wrapper::before,
header .container .center .form-wrapper::after,
header .container .center .form-wrapper form::before,
header .container .center .form-wrapper form::after {
    display: none !important;
}
header .container .center .form-wrapper form:focus-within {
    background: #fff !important;
    border-color: var(--hd-yellow) !important;
    box-shadow: 0 0 0 3px rgba(255, 214, 51, .25) !important;
}
header .container .center .form-wrapper form input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    height: 100% !important;
    padding: 0 8px 0 14px !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 14px !important;
    font-weight: 500;
    color: var(--hd-dark);
    -webkit-appearance: none;
    appearance: none;
}
header .container .center .form-wrapper form input::placeholder {
    text-overflow: ellipsis;
    font-size: 14px !important;
    color: #8d8a92 !important;
}
header .container .center .form-wrapper form input::-webkit-search-cancel-button {
    -webkit-appearance: none;
}
header .container .center .form-wrapper form button {
    flex: 0 0 38px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    width: 38px !important;
    height: 38px !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 9px !important;
    background: var(--hd-yellow) !important;
    color: var(--hd-dark) !important;
    transition: background-color .2s ease;
}
header .container .center .form-wrapper form button:hover {
    background: #ffce05 !important;
}
header .container .center .form-wrapper form button::before {
    content: '\e007' !important;
    font-family: 'icon' !important;
    font-size: 17px !important;
    line-height: 1 !important;
    color: var(--hd-dark) !important;
}

/* ===== «Заказать звонок» (везде) =====
   кнопка: жёлтая, слева тёмный кружок с трубкой; при наведении — тёмная */
header .container .center .order-call .btn {
    justify-content: flex-start;
    gap: 10px !important;
    height: 36px;
    min-height: 0;
    padding: 0 16px 0 4px !important;
    border-radius: 6px !important; /* как у кнопок в плитках на главной */
    background: var(--hd-yellow) !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .07em;
    white-space: nowrap;
    color: var(--hd-dark) !important;
    transition: background-color .2s ease, color .2s ease;
}
header .container .center .order-call .btn::after {
    display: none !important;
}
header .container .center .order-call .btn::before {
    flex: 0 0 28px;
    width: 28px !important;
    height: 28px !important;
    border-radius: 4px;
    background: var(--hd-dark);
    font-size: 14px !important;
    color: var(--hd-yellow);
    transition: background-color .2s ease, color .2s ease;
}
header .container .center .order-call .btn:hover {
    background: var(--hd-dark) !important;
    color: #fff !important;
}
header .container .center .order-call .btn:hover::before {
    background: var(--hd-yellow);
    color: var(--hd-dark);
}
header .container .center .order-call .btn:focus-visible {
    outline: 2px solid var(--hd-dark);
    outline-offset: 2px;
}

/* ===== Компьютер ===== */
@media screen and (min-width: 1280px) {
    /* жёлтая полоса */
    header .container .top {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
    header .container .top .wrapper {
        padding: 0 !important;
    }
    header .container .top .wrapper p {
        font-size: 13px !important;
        line-height: 16px !important;
    }

    /* белая полоса */
    /* белая и тёмная полосы — ровно по ширине жёлтой (у неё margin: 0 -20px) */
    header .container .center {
        width: auto !important;
        max-width: none !important;
        margin: 0 -20px !important;
        /* по бокам отступов нет — их дают крайние пустые колонки сетки */
        padding: 13px 0 !important;
        border-bottom: 0 !important;
    }
    /* логотип ниже, чем в catalog-filter.css: шапка компактнее, плашка «Тот самый» читается */
    header .container .center a.logo img {
        height: 64px !important;
        /* ширина задана явно (пропорции логотипа 141.7 × 73): Safari считал колонку
           по исходной ширине SVG, и перед жёлтой чертой оставался лишний зазор */
        width: calc(64px * 141.7 / 73) !important;
        max-width: none !important;
    }
    header .container .center a.logo,
    header .container .center a.logo picture {
        width: max-content !important;
    }
    header .container .center .wrapper {
        display: grid !important;
        /* ⟷ | логотип+слоган | ⟷ | поиск | ⟷ | телефон | ⟷ | звонок | ⟷ | избранное и корзина | ⟷
           шесть одинаковых пустых колонок: блок логотипа ровно посередине между краем полосы
           и поиском, корзина — на том же расстоянии от правого края, что логотип от левого */
        grid-template-columns: minmax(0, 1fr) max-content max-content minmax(0, 1fr) var(--hd-search-w, 240px) minmax(0, 1fr) max-content minmax(0, 1fr) max-content minmax(0, 1fr) max-content minmax(0, 1fr);
        grid-template-rows: auto auto auto;
        column-gap: 0;
        justify-items: start;
        justify-content: stretch !important;
        row-gap: 2px;
        align-items: center;
        position: relative;
        z-index: 0;
    }
    header .container .center .wrapper > * {
        margin: 0 !important;
    }
    header .container .center .wrapper > a.logo {
        grid-column: 2;
        grid-row: 1 / 4;
    }

    /* слоган с жёлтой чертой */
    header .container .center .wrapper > .info {
        grid-column: 3;
        grid-row: 1 / 4;
        display: flex !important;
        flex-direction: column;
        align-items: flex-start !important;
        gap: 5px !important;
        /* ширина — точно по самой длинной строке («Оригинальные аккумуляторы»),
           чтобы видимый зазор до поиска совпадал с расчётным */
        max-width: 210px !important;
        margin-left: 6px !important; /* логотип вплотную к жёлтой черте */
        padding: 2px 0 2px 12px !important;
        border-left: 3px solid var(--hd-yellow);
    }
    header .container .center .wrapper > .info span {
        font-size: 14px !important;
        font-weight: 800 !important;
        line-height: 17px !important;
        letter-spacing: 0 !important;
        text-align: left !important;
        text-wrap: balance;
        color: var(--hd-red) !important;
    }
    header .container .center .wrapper > .info p {
        max-width: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 17px !important;
        text-align: left !important;
        text-wrap: balance;
        color: var(--hd-muted) !important;
    }

    /* поиск */
    header .container .center .wrapper > .form-wrapper {
        grid-column: 5;
        grid-row: 1 / 4;
        justify-self: stretch !important;
        display: block !important;
        position: relative !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0;
    }

    /* ===== контакты: один номер + статус, по стрелке — все телефоны и мессенджеры ===== */
    /* сетка блока: номер | стрелка, ниже — строка ровно по ширине номера */
    header .container .center .wrapper > .hd-contacts {
        grid-column: 7;
        grid-row: 1 / 4;
        position: relative;
        display: grid !important;
        grid-template-columns: max-content max-content;
        align-items: center;
        row-gap: 5px;
        /* блок с номером — белый, без контура (рамку 1px держим прозрачной, чтобы размеры не менялись) */
        padding: 7px 10px 8px 12px;
        border: 1px solid transparent;
        border-radius: 12px;
        background: #fff;
    }
    header .hd-contacts__main {
        display: contents;
    }
    /* в шаблоне у span свой размер 16px — внутри блока берём размер родителя */
    header .hd-contacts span {
        font-size: inherit !important;
        line-height: inherit !important;
    }
    /* номер: Inter, цифры одной ширины (tnum), скобки на высоте цифр (case), лёгкая разрядка;
       код — тот же цвет, но тоньше, сам номер — жирный */
    header .hd-contacts__phone {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 22px !important;
        letter-spacing: .01em !important;
        font-feature-settings: 'tnum' 1, 'case' 1;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
        color: var(--hd-dark) !important;
        transition: color .2s ease;
    }
    header .hd-contacts__phone span {
        margin-right: -4px;
        font-weight: 500 !important;
        color: #5c5862 !important;
        transition: color .2s ease;
    }
    header .hd-contacts__phone:hover span {
        color: inherit !important;
    }
    header .hd-contacts__phone:hover {
        color: var(--hd-red) !important;
    }
    /* значок оператора */
    header .hd-contacts__phone::before,
    header .hd-contacts__row::before {
        content: '';
        flex: 0 0 18px;
        width: 18px;
        height: 18px;
        background: center / contain no-repeat;
    }
    header .hd-contacts .mts::before {
        background-image: url(/local/templates/akumulyator_template/images/mts-logo.svg);
    }
    header .hd-contacts .a1::before {
        background-image: url(/local/templates/akumulyator_template/images/a1-logo.svg);
    }
    header .hd-contacts__toggle {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 28px;
        height: 28px;
        margin-left: 2px;
        border-radius: 6px;
        color: var(--hd-dark) !important;
        cursor: pointer;
        transition: background-color .2s ease;
    }
    header .hd-contacts__toggle::before {
        content: '';
        width: 7px;
        height: 7px;
        margin-top: -4px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        transition: transform .2s ease, margin .2s ease;
    }
    header .hd-contacts__toggle:hover,
    header .hd-contacts.is-open .hd-contacts__toggle {
        background: var(--hd-soft);
    }
    header .hd-contacts.is-open .hd-contacts__toggle::before {
        margin-top: 4px;
        transform: rotate(-135deg);
    }
    header .hd-contacts__toggle:focus-visible {
        outline: 2px solid var(--hd-dark);
        outline-offset: 2px;
    }
    /* под номером: бейдж «N на линии» и мессенджеры одной строкой */
    /* под номером — бейдж «N менеджеров готовы помочь» */
    header .hd-contacts__sub {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
    }
    header .hd-contacts__status {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 20px;
        margin: 0 !important;
        padding: 0 7px 0 6px;
        border-radius: 10px;
        background: #e8f6ee;
        font-size: 10.5px !important;
        font-weight: 600 !important;
        line-height: 20px !important;
        white-space: nowrap;
        color: #1a7f45 !important;
        cursor: default;
    }
    header .hd-contacts__status strong {
        font-size: inherit !important;
        line-height: inherit !important;
        font-weight: 800 !important;
    }
    header .hd-contacts__status b {
        font-size: inherit !important;
        line-height: inherit !important;
        font-weight: 800 !important;
        color: #136536 !important;
    }
    header .hd-contacts__status i {
        flex: 0 0 6px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #1fa85a;
        animation: hdPulse 2s ease-out infinite;
    }
    /* мессенджеры под кнопкой «Заказать звонок», на её ширину */
    header .hd-contacts__soc {
        display: flex !important;
        justify-content: center;
        gap: 6px !important;
        margin: 0 !important;
    }
    header .hd-contacts__soc a {
        width: 26px !important;
        height: 26px !important;
        border-radius: 6px !important;
        filter: saturate(.8);
        transition: filter .15s ease, transform .15s ease !important;
    }
    header .hd-contacts__soc a:hover,
    header .hd-contacts__soc a:focus-visible {
        filter: none;
        transform: translateY(-1px);
    }
    @keyframes hdPulse {
        0% { box-shadow: 0 0 0 0 rgba(31, 168, 90, .5); }
        100% { box-shadow: 0 0 0 4px rgba(31, 168, 90, 0); }
    }
    @media (prefers-reduced-motion: reduce) {
        header .hd-contacts__status i { animation: none; }
    }
    /* выпадающий список */
    header .hd-contacts__drop {
        position: absolute;
        top: calc(100% + 8px);
        left: -1px;
        z-index: 30;
        width: 300px;
        padding: 8px;
        box-sizing: border-box;
        background: #fff;
        border: 1px solid var(--hd-line);
        border-top: 3px solid var(--hd-yellow);
        border-radius: 12px;
        box-shadow: 0 16px 40px rgba(31, 27, 32, .14);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-6px);
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s linear .16s;
    }
    /* мостик над списком: курсор не теряет меню на пути вниз */
    header .hd-contacts__drop::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: -12px;
        height: 12px;
    }
    header .hd-contacts.is-open .hd-contacts__drop {
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s;
    }
    /* мышь: список открывается наведением на блок с номером, без клика */
    @media (hover: hover) and (pointer: fine) {
        header .hd-contacts:hover .hd-contacts__drop {
            opacity: 1;
            visibility: visible;
            transform: none;
            transition: opacity .16s ease-out .1s, transform .16s ease-out .1s, visibility 0s .1s;
        }
        header .hd-contacts:hover .hd-contacts__toggle { background: var(--hd-soft); }
        header .hd-contacts:hover .hd-contacts__toggle::before { margin-top: 4px; transform: rotate(-135deg); }
        header .hd-contacts__toggle { cursor: default; }
    }
    @media (prefers-reduced-motion: reduce) {
        header .hd-contacts__drop { transform: none !important; }
    }
    header .hd-contacts__row {
        display: grid;
        grid-template-columns: 24px 1fr;
        column-gap: 12px;
        align-items: center;
        padding: 8px 12px;
        border-radius: 8px;
        color: var(--hd-dark) !important;
        transition: background-color .15s ease;
    }
    header .hd-contacts__row::before {
        grid-row: 1 / span 3;
        width: 24px;
        height: 24px;
    }
    header .hd-contacts__row b {
        font-size: 16px !important;
        font-weight: 600 !important;
        letter-spacing: .01em !important;
        font-feature-settings: 'tnum' 1, 'case' 1;
        line-height: 20px !important;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
        transition: color .15s ease;
    }
    header .hd-contacts__row small {
        grid-column: 2;
        font-size: 12px !important;
        line-height: 16px !important;
        color: var(--hd-muted) !important;
    }
    /* сервисный центр и его часы — зелёным */
    header .hd-contacts__row small.hd-contacts__service {
        color: #136536 !important;
        font-weight: 500 !important;
    }
    header .hd-contacts__row:hover,
    header .hd-contacts__row:focus-visible {
        background: var(--hd-soft);
        outline: none;
    }
    header .hd-contacts__row:hover b,
    header .hd-contacts__row:focus-visible b {
        color: var(--hd-red) !important;
    }
    header .hd-contacts__hours {
        margin: 6px 12px 4px !important;
        padding-top: 10px;
        border-top: 1px solid var(--hd-line);
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 16px !important;
        color: var(--hd-dark) !important;
    }

    /* «Заказать звонок»: кнопка и под ней мессенджеры */
    header .container .center .wrapper > .order-call {
        grid-column: 9;
        grid-row: 1 / 4;
        display: flex !important;
        flex-direction: column;
        align-items: stretch !important;
        gap: 7px !important;
    }
    header .container .center .wrapper > .order-call > span {
        display: none !important;
    }
    /* сравнение, избранное, корзина */
    header .container .center .wrapper > .btns {
        grid-column: 11;
        grid-row: 1 / 4;
        display: flex !important;
        align-items: center;
        gap: 8px !important;
    }
    header .container .center .wrapper > .btns a.compare,
    header .container .center .wrapper > .btns a.favorite {
        position: relative;
        width: 46px !important;
        height: 46px !important;
        border-radius: 12px;
        border: 1.5px solid var(--hd-line);
        background: #fff;
        transition: border-color .2s ease, background-color .2s ease;
    }
    header .container .center .wrapper > .btns a.compare:hover,
    header .container .center .wrapper > .btns a.favorite:hover {
        border-color: var(--hd-yellow);
        background: #fffbea;
    }
    header .container .center .wrapper > .btns a.compare::before {
        font-size: 24px !important;
    }
    header .container .center .wrapper > .btns a.favorite::before {
        font-size: 22px !important;
    }
    /* «Избранное и сравнение»: число товаров в красном кружке */
    header .container .center .wrapper > .btns a.favorite.has-items::after {
        content: attr(data-count);
        position: absolute;
        top: -7px;
        right: -7px;
        min-width: 20px;
        height: 20px;
        padding: 0 5px;
        box-sizing: border-box;
        border-radius: 10px;
        background: var(--hd-red);
        box-shadow: 0 0 0 2px #fff;
        font: 700 11px/20px Inter, sans-serif;
        text-align: center;
        color: #fff;
    }
    header .container .center .wrapper > .btns a.cart {
        height: 46px;
        gap: 8px !important;
        padding: 0 16px 0 10px !important;
        border: 0 !important;
        border-radius: 12px !important;
        background: var(--hd-dark) !important;
        color: #fff !important;
        font-size: 14px !important;
        white-space: nowrap;
        transition: background-color .2s ease;
    }
    header .container .center .wrapper > .btns a.cart:hover {
        background: #000 !important;
    }
    header .container .center .wrapper > .btns a.cart::before {
        width: 28px !important;
        height: 28px !important;
        font-size: 24px !important;
        color: var(--hd-yellow) !important;
    }
    header .container .center .wrapper > .btns a.cart span {
        top: 4px !important;
        left: 26px !important;
        min-width: 18px;
        height: 18px;
        padding: 0 4px !important;
        border-radius: 9px !important;
        font-size: 11px !important;
        line-height: 18px !important;
        color: #fff !important;
        background: var(--hd-red) !important;
        box-shadow: 0 0 0 2px var(--hd-dark);
    }


    /* тёмная полоса меню */
    header .container .bottom {
        width: auto !important;
        max-width: none !important;
        gap: 6px !important;
        margin: 0 -20px 0 !important; /* до контента — только отступ под шапкой (10px, js/script.js) */
        /* воздух у крайних элементов: слева от «Каталога», справа от «О нас»; сверху и снизу поровну */
        padding: 7px 24px 7px 10px !important;
        border-radius: 14px;
        background: var(--hd-dark) !important;
    }
    header .container .bottom .catalog > button {
        padding: 9px 22px 9px 16px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
    }
    header .container .bottom .catalog > button::after {
        margin-left: 18px !important;
    }
    /* плашка «Акции и скидки» пока скрыта (по просьбе заказчика); положение ниже — на случай возврата */
    header .container .bottom .catalog > span {
        display: none !important;
        top: -9px !important;
        bottom: auto !important;
        /* середина плашки — над стыком «Каталога» и «Услуг» */
        right: -68px !important;
        padding: 2px 10px !important;
        border-radius: 4px;
        font-size: 11px !important;
        letter-spacing: .03em;
    }
    header .container .bottom .catalog > span::before {
        width: 10px !important;
        height: 10px !important;
        top: auto !important;
        bottom: -3px !important;
        left: 14px;
    }
    header .container .bottom .services > button,
    header .container .bottom .delivery > button,
    header .container .bottom .shops {
        padding: 9px 16px !important;
        border-radius: 10px !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #fff !important;
        font-size: 14px !important;
        transition: background-color .2s ease, color .2s ease;
    }
    header .container .bottom .services > button:hover,
    header .container .bottom .delivery > button:hover,
    header .container .bottom .shops:hover {
        background: rgba(255, 255, 255, .08) !important;
        color: var(--hd-yellow) !important;
    }
    header .container .bottom .services > button::before,
    header .container .bottom .delivery > button::before,
    header .container .bottom .shops::before {
        color: var(--hd-yellow) !important;
    }
    header .container .bottom .services > button::after,
    header .container .bottom .delivery > button::after {
        color: #fff !important;
    }
    header .container .bottom nav {
        margin-left: auto !important;
        align-items: center;
    }
    header .container .bottom > *,
    header .container .bottom nav a,
    header .container .bottom .shops {
        white-space: nowrap;
        flex-shrink: 0;
    }
    header .container .bottom nav {
        gap: clamp(16px, calc(1.7 * var(--dvw)), 28px) !important;
    }
    header .container .bottom nav a {
        color: #fff !important;
        font-size: 14px !important;
        transition: color .2s ease;
    }
    header .container .bottom nav a:hover {
        color: var(--hd-yellow) !important;
    }
    /* «Акции» и «Новости» были красными — на тёмном фоне они жёлтые */
    header .container .bottom nav > a:nth-child(2),
    header .container .bottom nav > a:nth-child(4) {
        color: var(--hd-yellow) !important;
    }
    header .container .bottom nav > a:nth-child(2):hover,
    header .container .bottom nav > a:nth-child(4):hover {
        color: #fff !important;
    }
}

/* компьютер, страница прокручена: тёмная строка меню сворачивается, на экране остаётся только
   белая строка с логотипом (класс is-compact ставит js/script.js; жёлтая уходит сдвигом шапки) */
@media screen and (min-width: 1280px) {
    header .container .bottom {
        max-height: 80px;
        transition: max-height .25s ease, padding .25s ease, opacity .2s ease, visibility .25s;
    }
    /* белая строка тоже ужимается: поля сверху и снизу почти убираем */
    header .container .center {
        transition: padding .25s ease;
    }
    header.is-compact .container .center {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
    }
    header.is-compact .container .bottom {
        max-height: 0;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
    }
}

/* узкий компьютер: ужимаем слоган, телефоны и кнопки, чтобы поиску осталось место */
@media screen and (min-width: 1280px) and (max-width: 1439.98px) {
    header .container .center .wrapper {
        --hd-search-w: 200px;
    }
    header .container .center .form-wrapper form input,
    header .container .center .form-wrapper form input::placeholder {
        font-size: 12.5px !important;
    }
    header .container .center .form-wrapper form input {
        padding-left: 12px !important;
    }
    header .container .center .wrapper > .info {
        max-width: 195px !important;
        padding-left: 12px !important;
    }
    header .container .center .wrapper > .info span {
        font-size: 13px !important;
        line-height: 16px !important;
    }
    header .container .center .wrapper > .info p {
        font-size: 12px !important;
        line-height: 15px !important;
    }


    header .container .center .wrapper > .btns a.compare,
    header .container .center .wrapper > .btns a.favorite {
        width: 42px !important;
        height: 42px !important;
    }
    header .container .center .wrapper > .btns a.cart {
        height: 42px;
        padding: 0 12px 0 8px !important;
    }
    header .container .bottom .services > button,
    header .container .bottom .delivery > button,
    header .container .bottom .shops {
        padding: 8px 12px !important;
        font-size: 13px !important;
    }
    header .container .bottom nav {
        gap: 14px !important;
    }

    header .container .bottom nav a {
        font-size: 13px !important;
    }
}

/* ===== Планшет и телефон: поиск и «Заказать звонок» — в строке с логотипом =====
   Элементы шапки здесь — прямые дети .container (у .center и .wrapper display: contents),
   порядок задаём явно, промежутки между ними одинаковые. */
@media screen and (max-width: 1279.98px) {
    header .container {
        column-gap: 12px !important;
        row-gap: 0 !important;
        align-items: center !important;
    }
    header .container > .top {
        order: 0 !important;
        flex: 0 0 auto;
        width: calc(100% + 40px);
    }
    header .container .center a.logo {
        order: 1 !important;
        flex: 0 0 auto !important;
        margin: 12px 0 !important;
    }
    header .container .center a.logo img {
        height: 56px !important;
    }
    /* блок контактов и слоган — только на компьютере */
    header .hd-contacts,
    header .container .center .info {
        display: none !important;
    }
    header .container .center .form-wrapper {
        order: 2 !important;
        display: block !important;
        position: relative !important;
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    header .container .center .form-wrapper form {
        height: 44px;
    }
    header .container .center .order-call {
        order: 3 !important;
        display: flex !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
    }
    header .container .center .order-call > span,
    header .container .center .order-call .hd-contacts__soc {
        display: none !important;
    }
    header .container .center .btns {
        order: 4 !important;
        gap: 12px !important;
        margin: 0 !important;
    }
    header .container .center .btns > * {
        margin: 0 !important;
    }
    header .container .center .nav-toggle {
        order: 5 !important;
        margin: 0 !important;
    }
    /* ссылки «Каталог / Услуги / Доставка / Наши магазины» — второй строкой, тёмной полосой */
    header .container > .bottom {
        order: 10 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 4px 20px !important;
        box-sizing: border-box;
        justify-content: flex-start !important;
        gap: 4px 22px !important;
        border-radius: 12px;
        background: var(--hd-dark) !important;
    }
    header .container > .bottom .catalog > button,
    header .container > .bottom .services > button,
    header .container > .bottom .delivery > button,
    header .container > .bottom .shops {
        padding: 9px 0 !important;
        background: transparent !important;
        color: #fff !important;
    }
    header .container > .bottom .catalog > button::after,
    header .container > .bottom .services > button::after,
    header .container > .bottom .delivery > button::after {
        color: var(--hd-yellow) !important;
    }
    header .container > .bottom .catalog > button:hover,
    header .container > .bottom .services > button:hover,
    header .container > .bottom .delivery > button:hover,
    header .container > .bottom .shops:hover {
        color: var(--hd-yellow) !important;
    }
    header .container > .bottom .catalog > button {
        color: var(--hd-yellow) !important;
    }
}
/* узкий планшет: «Заказать звонок» — круглой кнопкой-трубкой */
@media screen and (max-width: 999.98px) {
    /* кнопка-трубка уже есть — отдельный значок телефона не дублируем */
    header .container .center .btns a.phone-btn {
        display: none !important;
    }
    header .container .center .order-call .btn {
        width: 40px;
        height: 40px;
        padding: 0 !important;
        justify-content: center;
        border-radius: 6px !important;
        font-size: 0 !important;
        letter-spacing: 0;
    }
    header .container .center .order-call .btn::before {
        flex-basis: 40px;
        width: 40px !important;
        height: 40px !important;
        background: transparent;
        font-size: 17px !important;
        color: var(--hd-dark);
    }
}
/* телефон: одна строка — логотип, поиск, звонок, корзина, меню.
   Номер и мессенджеры — в закреплённой строке внизу экрана, значок телефона в шапке не нужен */
@media screen and (max-width: 767px) {
    header .container {
        column-gap: 8px !important;
    }
    header .container .center a.logo {
        margin: 10px 0 !important;
    }
    header .container .center a.logo img {
        height: 44px !important;
    }
    header .container .center .form-wrapper form {
        height: 40px;
    }
    header .container .center .form-wrapper form button {
        flex-basis: 32px;
        width: 32px !important;
        height: 32px !important;
    }
    header .container .center .form-wrapper form input,
    header .container .center .form-wrapper form input::placeholder {
        font-size: 16px !important; /* меньше 16px — iOS увеличивает страницу при фокусе */
    }
    header .container .center .form-wrapper form input {
        padding-left: 12px !important;
    }
    header .container .center .order-call .btn,
    header .container .center .order-call .btn::before {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px;
    }
    header .container .center .btns a.phone-btn,
    header .container .center .btns a.favorite {
        display: none !important;
    }
    header .container .center .btns a.cart,
    header .container .center .btns a.cart + * {
        order: 4 !important;
    }
    header .container .center .burger {
        order: 6 !important;
        margin: 0 !important;
    }
    /* «Услуги / Доставка» на узком экране — в меню, отдельной полосы нет */
    header .container > .bottom {
        flex-basis: 0 !important;
        width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: none !important;
    }
    header .container > .bottom > .services,
    header .container > .bottom > .delivery,
    header .container > .bottom > .shops {
        display: none !important;
    }
    /* открытое меню-бургер накрывает шапку своей — поиск и кнопка звонка не должны просвечивать */
    html.menu-open header .container .center .form-wrapper,
    html.menu-open header .container .center .form-wrapper form,
    html.menu-open header .container .center .order-call {
        visibility: hidden !important;
    }
    /* результаты поиска — на всю ширину экрана, а не по узкому полю */
    .title-search-result {
        left: 10px !important;
        width: calc(100vw - 20px) !important;
    }
}
/* результаты поиска не уже 360px (поле в шапке компактное) */
@media screen and (min-width: 768px) {
    .title-search-result {
        min-width: 360px;
    }
}

/* ===== Избранное и сравнение — один список =====
   Кнопки «К сравнению» на карточках и странице товара скрыты: сердечко добавляет товар
   в общий список, сравнение характеристик — таблицей на странице /favorites/. */
button.compare[data-product-id],
.goods-snippet button.compare,
.product button.compare {
    display: none !important;
}
header a.compare {
    display: none !important;
}
[data-favorites-page="Y"] ~ .compare-block .compare-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}
[data-favorites-page="Y"] ~ .compare-block .compare-head h2 {
    margin: 0;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.2;
}
@media screen and (max-width: 767px) {
    [data-favorites-page="Y"] ~ .compare-block .compare-head h2 {
        font-size: 20px;
    }
}

/* ===== Строка меню (Каталог / Услуги / Доставка / ссылки) — светлая: белый фон, серый контур =====
   перекрывает тёмное оформление выше и в css/menu.css (он подключается позже — отсюда префикс html) */
@media screen and (min-width: 768px) {
    html header .container .bottom {
        border: 1px solid var(--hd-line) !important;
        background: #fff !important;
    }
    html header .container .bottom .services > button,
    html header .container .bottom .delivery > button,
    html header .container .bottom .shops,
    html header .container .bottom nav a {
        color: var(--hd-dark) !important;
    }
    html header .container .bottom .services > button::before,
    html header .container .bottom .delivery > button::before,
    html header .container .bottom .shops::before,
    html header .container .bottom .services > button::after,
    html header .container .bottom .delivery > button::after {
        color: var(--hd-dark) !important;
    }
    /* у «Услуг» и «Доставки» была тёмная рамка 2px (style.css) — на белом она лишняя */
    html header .container .bottom .services > button,
    html header .container .bottom .delivery > button {
        border-color: transparent !important;
    }
    html header .container .bottom .services > button:hover,
    html header .container .bottom .delivery > button:hover,
    html header .container .bottom .shops:hover,
    html header .container .bottom > div:has(> .sub-menu.open) > button {
        border-color: transparent !important;
        background: var(--hd-soft) !important;
        color: var(--hd-dark) !important;
    }
    /* «Акции» и «Новости» — снова красные, как до тёмной строки */
    html header .container .bottom nav > a:nth-child(2),
    html header .container .bottom nav > a:nth-child(4),
    html header .container .bottom nav a:hover {
        color: var(--hd-red) !important;
    }
    html header .container .bottom nav > a:nth-child(2):hover,
    html header .container .bottom nav > a:nth-child(4):hover {
        color: var(--hd-dark) !important;
    }
    html header .container .bottom > div > button:focus-visible,
    html header .container .bottom .shops:focus-visible,
    html header .container .bottom nav a:focus-visible,
    html header .container .bottom .catalog > button:focus-visible {
        outline-color: var(--hd-dark) !important;
    }
}
@media screen and (min-width: 1280px) {
    html header.is-compact .container .bottom {
        border-color: transparent !important;
    }
}
/* планшет: «Каталог» здесь — текст без жёлтой кнопки */
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
    html header .container > .bottom .catalog > button,
    html header .container > .bottom .catalog > button::after,
    html header .container > .bottom :is(.catalog, .services, .delivery) > button:hover,
    html header .container > .bottom .shops:hover {
        color: var(--hd-dark) !important;
    }
    html header .container > .bottom .services > button:hover,
    html header .container > .bottom .delivery > button:hover,
    html header .container > .bottom .shops:hover {
        background: transparent !important;
    }
}

/* ===== «Заказать звонок» и корзина — белые с серым контуром, как «Избранное»; у звонка жёлтый фон, при наведении — светло-жёлтый с жёлтым контуром; трубка без кружка ===== */
html header .container .center .order-call .btn {
    border: 1.5px solid var(--hd-yellow) !important;
    background: var(--hd-yellow) !important;
    color: var(--hd-dark) !important;
    transition: border-color .2s ease, background-color .2s ease;
}
html header .container .center .order-call .btn:hover {
    border-color: var(--hd-yellow) !important;
    background: #fffbea !important;
    color: var(--hd-dark) !important;
}
html header .container .center .order-call .btn::before,
html header .container .center .order-call .btn:hover::before {
    background: transparent !important;
    color: var(--hd-dark) !important;
}
@media screen and (min-width: 1280px) {
    html header .container .center .wrapper > .btns a.cart {
        border: 1.5px solid var(--hd-line) !important;
        background: #fff !important;
        color: var(--hd-dark) !important;
        transition: border-color .2s ease, background-color .2s ease;
    }
    html header .container .center .wrapper > .btns a.cart:hover {
        border-color: var(--hd-yellow) !important;
        background: #fffbea !important;
    }
    html header .container .center .wrapper > .btns a.cart::before {
        color: var(--hd-dark) !important;
    }
    html header .container .center .wrapper > .btns a.cart span {
        box-shadow: 0 0 0 2px #fff;
    }
}

/* ===== Контакты в шапке, вариант 2 «Карточка»: блок в контуре, как поиск, «Избранное» и корзина =====
   Высота — как у поля поиска (46px). Слева белый квадрат с чёрной трубкой, значок оператора — перед номером,
   справа номер и статус в две строки, стрелка — отдельной ячейкой за тонкой чертой.
   Квадрат — псевдоэлемент ссылки, поэтому он тоже звонит. Разметка header.php не меняется. */
@media screen and (min-width: 1280px) {
    html header .container .center .wrapper > .hd-contacts {
        grid-template-columns: max-content max-content;
        grid-template-rows: auto auto;
        column-gap: 0;
        row-gap: 0;
        height: 46px;
        min-height: 0;
        box-sizing: border-box;
        padding: 4px 4px 4px 50px;
        border: 1.5px solid var(--hd-line);
        border-radius: 12px;
        background: #fff;
        transition: border-color .2s ease, background-color .2s ease;
    }
    html header .container .center .wrapper > .hd-contacts:hover,
    html header .container .center .wrapper > .hd-contacts.is-open,
    html header .container .center .wrapper > .hd-contacts:focus-within {
        border-color: var(--hd-yellow);
        background: #fffbea;
    }
    html header .hd-contacts__phone {
        grid-row: 1;
        grid-column: 1;
        position: static;
        gap: 0;
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 20px !important;
        letter-spacing: .005em !important;
        outline: none;
    }
    /* белый квадрат с чёрной трубкой — на всю высоту карточки */
    html header .hd-contacts .hd-contacts__phone::before {
        content: '\e013';
        background-image: none;
        position: absolute;
        left: 5px;
        top: 50%;
        width: 34px;
        height: 34px;
        margin-top: -17px;
        border-radius: 8px;
        box-sizing: border-box;
        border: 1.5px solid var(--hd-line);
        background: #fff;
        font: 16px/31px 'icon';
        text-align: center;
        color: var(--hd-dark);
        transition: box-shadow .2s ease;
    }
    /* значок оператора — перед номером (order: -1 ставит псевдоэлемент первым во flex-строке) */
    html header .hd-contacts__phone::after {
        content: '';
        order: -1;
        flex: 0 0 12px;
        width: 12px; /* = высота цифр номера: значок ровно по их верху и низу */
        height: 12px;
        margin-right: 4px;
        transform: translateY(-.25px); /* середина значка = середина цифр (замер по пикселям) */
        background: center / contain no-repeat;
    }
    /* свой вариант логотипа: в исходном mts-logo.svg красный квадрат меньше viewBox и яйцо смещено вверх */
    html header .hd-contacts .hd-contacts__phone.mts::after {
        background-image: url(/local/templates/akumulyator_template/images/mts-logo-hd.svg);
    }
    html header .hd-contacts .hd-contacts__phone.a1::after {
        background-image: url(/local/templates/akumulyator_template/images/a1-logo.svg);
    }
    html header .hd-contacts__phone:focus-visible::before {
        box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--hd-dark);
    }
    html header .hd-contacts__phone span {
        margin-right: 6px;
        font-weight: 500 !important;
        color: var(--hd-muted) !important;
    }
    html header .hd-contacts__phone:hover {
        color: var(--hd-red) !important;
    }
    /* стрелка — отдельная ячейка за чертой, на обе строки */
    html header .hd-contacts__toggle {
        grid-row: 1 / 3;
        grid-column: 2;
        align-self: stretch;
        width: 30px;
        height: auto;
        margin: 0 0 0 10px;
        border-left: 1px solid var(--hd-line);
        border-radius: 0 8px 8px 0;
    }
    html header .hd-contacts__toggle:hover,
    html header .hd-contacts.is-open .hd-contacts__toggle {
        background: transparent;
    }
    html header .hd-contacts__toggle::before {
        width: 6px;
        height: 6px;
        border-width: 0 1.75px 1.75px 0;
    }
    html header .hd-contacts__sub {
        grid-row: 2;
        grid-column: 1;
    }
    html header .hd-contacts__status {
        height: 15px;
        gap: 5px;
        padding: 0;
        background: transparent;
        font-size: 11.5px !important;
        font-weight: 500 !important;
        line-height: 15px !important;
        color: var(--hd-muted) !important;
    }
    html header .hd-contacts__status b {
        font-weight: 700 !important;
        color: var(--hd-dark) !important;
    }
    html header .hd-contacts__status strong {
        font-weight: 600 !important;
        color: #1a7f45 !important;
    }
    html header .hd-contacts__drop {
        top: calc(100% + 6px);
        left: -1.5px;
    }
    @media (hover: hover) and (pointer: fine) {
        html header .hd-contacts:hover .hd-contacts__toggle { background: transparent; }
    }
}
@media screen and (min-width: 1280px) and (max-width: 1439.98px) {
    html header .hd-contacts__phone {
        font-size: 16px !important;
    }
    html header .hd-contacts__status {
        font-size: 11px !important;
    }
}

/* ===== «Заказать звонок», вариант 1 «Карточка»: близнец карточки номера =====
   Белая карточка 46px в контуре, как поиск, номер и корзина. Слева жёлтый квадрат с трубкой,
   справа надпись и под ней строка значков мессенджеров в их фирменных цветах (как статус под номером).
   Кнопка занимает всю карточку — клик в любом месте, кроме значков, открывает форму звонка.
   Разметка header.php не меняется. */
@media screen and (min-width: 1280px) {
    html header .container .center .wrapper > .order-call {
        position: relative;
        display: block !important;
        height: 46px;
        box-sizing: border-box;
        border: 1.5px solid var(--hd-line);
        border-radius: 12px;
        background: #fff;
        transition: border-color .2s ease, background-color .2s ease;
    }
    html header .container .center .wrapper > .order-call:hover,
    html header .container .center .wrapper > .order-call:focus-within {
        border-color: var(--hd-yellow);
        background: #fffbea;
    }
    html header .container .center .wrapper > .order-call .btn {
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        position: static !important;
        width: auto;
        height: 100%;
        box-sizing: border-box;
        padding: 4px 14px 0 49px !important;
        border: 0 !important;
        border-radius: 10.5px !important;
        background: transparent !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 16px !important;
        letter-spacing: .06em;
        text-align: left;
        color: var(--hd-dark) !important;
        outline: none;
    }
    html header .container .center .wrapper > .order-call .btn:hover {
        background: transparent !important;
    }
    /* жёлтый квадрат с трубкой — на всю высоту карточки, как белый у номера */
    html header .container .center .wrapper > .order-call .btn::before,
    html header .container .center .wrapper > .order-call .btn:hover::before {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 5px;
        top: 50%;
        width: 34px !important;
        height: 34px !important;
        margin-top: -17px;
        border-radius: 8px;
        background: var(--hd-yellow) !important;
        font-size: 16px !important;
        color: var(--hd-dark) !important;
        transition: background-color .2s ease, box-shadow .2s ease;
    }
    html header .container .center .wrapper > .order-call:hover .btn::before {
        background: #ffce05 !important;
    }
    html header .container .center .wrapper > .order-call .btn:focus-visible::before {
        box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--hd-dark);
    }
    /* мессенджеры — второй строкой под чертой, раскинуты на всю длину надписи
       (у значка поле 24px, сам значок 15px — поля по краям компенсируем на 4.5px) */
    html header .container .center .wrapper > .order-call .hd-contacts__soc {
        position: absolute;
        left: 44.5px;
        right: 9.5px;
        top: 22px;
        z-index: 1;
        display: flex !important;
        gap: 0 !important;
        justify-content: space-between;
        padding-top: 2px;
    }
    /* черта между «Заказать звонок» и значками — по ширине надписи */
    html header .container .center .wrapper > .order-call .hd-contacts__soc::before {
        content: '';
        position: absolute;
        top: 0;
        left: 4.5px;
        right: 4.5px;
        border-top: 1px solid var(--hd-line);
    }
    html header .container .center .wrapper > .order-call .hd-contacts__soc a.soc.soc.soc {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 24px !important;
        height: 17px !important;
        border-radius: 5px !important;
        filter: none;
        opacity: 1;
        transform: none;
        color: var(--soc-c);
        transition: color .15s ease, background-color .15s ease !important;
    }
    html header .container .center .wrapper > .order-call .hd-contacts__soc a.soc.soc.soc::before {
        flex: 0 0 15px;
        width: 15px !important;
        height: 15px !important;
        background: currentColor !important;
        -webkit-mask: var(--soc-mask) center / contain no-repeat !important;
        mask: var(--soc-mask) center / contain no-repeat !important;
    }
    html header .container .center .wrapper > .order-call .hd-contacts__soc a.soc.soc.soc:hover,
    html header .container .center .wrapper > .order-call .hd-contacts__soc a.soc.soc.soc:focus-visible {
        background: color-mix(in srgb, var(--soc-c) 12%, #fff) !important;
        color: var(--soc-c);
        opacity: 1;
        transform: none;
    }
    html header .container .center .wrapper > .order-call .hd-contacts__soc a.soc.soc.soc:focus-visible {
        outline: 2px solid var(--hd-dark);
        outline-offset: 0;
    }
    html header :is(.order-call, .hd-contacts__msg) .soc--tg { --soc-c: #229ed9; }
    html header :is(.order-call, .hd-contacts__msg) .soc--vb { --soc-c: #7360f2; }
    html header :is(.order-call, .hd-contacts__msg) .soc--wa { --soc-c: #1faa53; }
    html header :is(.order-call, .hd-contacts__msg) .soc--ig { --soc-c: #e1306c; }
    html header :is(.order-call, .hd-contacts__msg) .soc--mail { --soc-c: #e07a14; }
    html header :is(.order-call, .hd-contacts__msg) .soc--tg { --soc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath d='M34.9 14.2 11.7 23.1c-1.6.6-1.6 1.5-.3 1.9l5.9 1.8 2.3 7c.3.8.5 1.1 1.1 1.1.5 0 .8-.2 1.1-.5l2.8-2.7 5.9 4.3c1.1.6 1.8.3 2.1-1l3.9-18.4c.4-1.6-.6-2.3-1.6-1.9Zm-14.7 13 10.9-6.9c.5-.3 1-.1.6.3l-9.3 8.4-.4 4-1.8-5.8Z'/%3E%3C/svg%3E"); }
    html header :is(.order-call, .hd-contacts__msg) .soc--vb { --soc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M24 11.5c-7.4 0-11.5 2.9-11.5 10.2 0 4.2 1.3 6.9 3.6 8.3v5.2l4.1-3.5c1.2.2 2.5.3 3.8.3 7.4 0 11.5-2.9 11.5-10.3S31.4 11.5 24 11.5Z'/%3E%3Cpath d='M25.2 16.6a5.4 5.4 0 0 1 4.9 4.9M25.2 19.4a2.5 2.5 0 0 1 2.1 2.1'/%3E%3C/g%3E%3Cpath d='M18.6 16.9c.4-.3.8-.3 1.1 0l1.7 2c.3.3.3.8 0 1.1l-.8.8c-.2.2-.2.5-.1.8.4.9 1 1.8 1.7 2.5.7.7 1.6 1.3 2.5 1.7.3.1.6.1.8-.1l.8-.8c.3-.3.8-.3 1.1 0l2 1.7c.3.3.3.7 0 1.1-.6.8-1.5 1.5-2.6 1.4-1.8-.2-3.9-1.4-5.6-3.1s-2.9-3.800-3.1-5.6c-.1-1.1.6-2 1.4-2.6Z'/%3E%3C/svg%3E"); }
    html header :is(.order-call, .hd-contacts__msg) .soc--wa { --soc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linejoin='round' d='M24 12.5a11.5 11.5 0 0 0-9.9 17.3L12.6 35.4l5.7-1.5A11.5 11.5 0 1 0 24 12.5Z'/%3E%3Cpath d='M19.8 18.1c.3-.6.6-.6.9-.6h.7c.2 0 .5 0 .7.6l1 2.3c.1.2.1.5 0 .7l-.6.8c-.2.2-.3.5-.1.8.4.8 1 1.6 1.7 2.2.8.7 1.6 1.2 2.4 1.5.3.1.5 0 .7-.2l.9-1.1c.2-.3.5-.3.8-.2l2.2 1.1c.3.1.5.2.5.4.1.4 0 1.4-.5 2-.6.6-1.6 1.1-2.5 1.1-1.4 0-3.600-.8-5.6-2.6-2.1-1.9-3.4-4.3-3.6-5.4-.2-1.3.2-2.5.4-3.4Z'/%3E%3C/svg%3E"); }
    html header :is(.order-call, .hd-contacts__msg) .soc--ig { --soc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.4'%3E%3Crect x='13' y='13' width='22' height='22' rx='6.5'/%3E%3Ccircle cx='24' cy='24' r='5.2'/%3E%3C/g%3E%3Ccircle cx='30.2' cy='17.8' r='1.6'/%3E%3C/svg%3E"); }
    html header :is(.order-call, .hd-contacts__msg) .soc--mail { --soc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.4' stroke-linejoin='round' stroke-linecap='round'%3E%3Crect x='12.5' y='15.5' width='23' height='17' rx='2.5'/%3E%3Cpath d='m13.5 17.5 10.5 8 10.5-8'/%3E%3C/g%3E%3C/svg%3E"); }
}
@media screen and (min-width: 1280px) and (max-width: 1439.98px) {
    html header .container .center .wrapper > .order-call .btn {
        padding-right: 12px !important;
        font-size: 11.5px !important;
        letter-spacing: .05em;
    }
}

/* ===== Мессенджеры в раскрывающемся списке телефонов: значок фирменного цвета + подпись ===== */
@media screen and (min-width: 1280px) {
    html header .hd-contacts__msg {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2px 6px;
        margin: 6px 4px 0;
        padding: 8px 0 2px;
        border-top: 1px solid var(--hd-line);
    }
    html header .hd-contacts__msg a.soc.soc.soc--inline {
        gap: 9px;
        padding: 7px 8px;
        border-radius: 8px;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 18px !important;
        color: var(--hd-dark) !important;
        transition: background-color .15s ease;
    }
    html header .hd-contacts__msg a.soc.soc.soc--inline::before {
        flex-basis: 18px;
        width: 18px !important;
        height: 18px !important;
        border-radius: 0;
        background: var(--soc-c) !important;
        -webkit-mask: var(--soc-mask) center / contain no-repeat !important;
        mask: var(--soc-mask) center / contain no-repeat !important;
    }
    html header .hd-contacts__msg a.soc.soc.soc--inline:hover,
    html header .hd-contacts__msg a.soc.soc.soc--inline:focus-visible {
        background: color-mix(in srgb, var(--soc-c) 10%, #fff) !important;
        outline: none;
    }
}

/* ===== Телефон: строка «логотип | ☰ Каталог … поиск-значок | корзина», ниже — «Заказать звонок» во всю ширину.
   Поиск — значком (button.open-form), по нажатию поле раскрывается отдельной строкой (класс .show, js/script.js) ===== */
@media screen and (max-width: 767px) {
    /* «Каталог» — кнопка с подписью сразу справа от логотипа, открывает меню */
    html header .container .center .burger {
        order: 2 !important;
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        width: auto !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 14px 0 12px !important;
        box-sizing: border-box;
        border: 1.5px solid var(--hd-line);
        border-radius: 10px;
        background: #fff;
        cursor: pointer;
    }
    html header .container .center .burger span {
        display: none !important;
    }
    html header .container .center .burger::before {
        content: '' !important;
        position: static !important;
        display: block !important;
        flex: 0 0 18px;
        width: 18px !important;
        height: 14px !important;
        margin: 0 !important;
        transform: none !important;
        border-radius: 0 !important;
        background:
            linear-gradient(var(--hd-dark), var(--hd-dark)) 0 0 / 100% 2px no-repeat,
            linear-gradient(var(--hd-dark), var(--hd-dark)) 0 6px / 100% 2px no-repeat,
            linear-gradient(var(--hd-dark), var(--hd-dark)) 0 12px / 100% 2px no-repeat !important;
    }
    html header .container .center .burger::after {
        content: 'Каталог' !important;
        position: static !important;
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        transform: none !important;
        background: none !important;
        font: 600 15px/1 Inter, sans-serif;
        color: var(--hd-dark);
    }

    /* поиск: значок справа, поле — строкой ниже, только когда раскрыто */
    html header .container .center .form-wrapper {
        display: contents !important;
    }
    html header .container .center .form-wrapper button.open-form {
        order: 3 !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 40px;
        width: 40px !important;
        height: 40px !important;
        margin: 0 0 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box;
        border: 1.5px solid var(--hd-line) !important;
        border-radius: 10px !important;
        background: #fff !important;
        zoom: 1 !important;
    }
    html header .container .center .form-wrapper button.open-form::before {
        content: '\e007' !important;
        font-family: 'icon' !important;
        font-size: 18px !important;
        line-height: 18px !important;
        width: 18px !important;
        height: 18px !important;
        color: var(--hd-dark) !important;
    }
    html header .container .center .form-wrapper.show button.open-form {
        border-color: var(--hd-yellow) !important;
        background: #fffbea !important;
    }
    html header .container .center .form-wrapper form {
        order: 7 !important;
        display: none !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 0 8px !important;
    }
    html header .container .center .form-wrapper.show form {
        display: flex !important;
    }
    html header .container .center .btns {
        order: 4 !important;
    }

    /* «Заказать звонок» — полноценная кнопка с надписью во всю ширину */
    html header .container .center .order-call {
        order: 8 !important;
        flex: 0 0 100% !important;
        margin: 0 0 10px !important;
    }
    html header .container .center .order-call .btn {
        display: flex !important;
        align-items: center;
        justify-content: center !important;
        gap: 8px !important;
        width: 100% !important;
        height: 42px !important;
        padding: 0 14px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        letter-spacing: .06em;
    }
    html header .container .center .order-call .btn::before {
        flex: 0 0 20px;
        width: 20px !important;
        height: 20px !important;
        font-size: 17px !important;
        line-height: 20px !important;
        text-align: center;
    }
}

/* ===== Меню (catalog-menu): на телефоне первый уровень — Каталог аккумуляторов (раскрывается в разделы),
   Услуги, Доставка, Наши магазины, Контакты, Акции, Новости, О нас (include/catalog_mega_menu.php) ===== */
@media screen and (min-width: 768px) {
    header .catalog-menu .tabs > .catalog-group {
        display: contents;
    }
    header .catalog-menu .tabs .phone-only {
        display: none !important;
    }
}
@media screen and (max-width: 767px) {
    html header .catalog-menu .window-body > .tabs > p[data-cat="catalog-group"] { order: 1; }
    html header .catalog-menu .window-body > .tabs > .catalog-group { order: 2; }
    html header .catalog-menu .window-body > .tabs > p[data-cat="services-info"] { order: 3; }
    html header .catalog-menu .window-body > .tabs > div[data-cat="services-info"] { order: 4; }
    html header .catalog-menu .window-body > .tabs > p[data-cat="delivery-info"] { order: 5; }
    html header .catalog-menu .window-body > .tabs > div[data-cat="delivery-info"] { order: 6; }
    html header .catalog-menu .window-body > .tabs > a[href="/store/"] { order: 7; }
    html header .catalog-menu .window-body > .tabs > a[href="/contacts/"] { order: 8; }
    html header .catalog-menu .window-body > .tabs > a.phone-only { order: 9; }
    /* в списке заказчика их нет: «Полезная информация» дублирует пункты, «Избранное» — отдельной страницей */
    /* p/div в селекторе — чтобы перебить display: flex !important из css/menu.css (он подключается позже) */
    html header .catalog-menu .window-body > .tabs > p.item[data-cat="useful-info"],
    html header .catalog-menu .window-body > .tabs > div.useful-block[data-cat="useful-info"],
    html header .catalog-menu .window-body > .tabs > a.mobile[href="/favorites/"] {
        display: none !important;
    }
    /* «Услуги», «Доставка», «Наши магазины» — на любой ширине телефона (раньше только до 470px) */
    html header .catalog-menu .window-body > .tabs > p.compact-only,
    html header .catalog-menu .window-body > .tabs > a.compact-only {
        display: flex !important;
    }
    html header .catalog-menu .window-body > .tabs > p.item.mobile + .mobile {
        margin-top: 0 !important;
    }
    /* пункты-ссылки — той же высоты, что пункты со списком (52px) */
    html header .catalog-menu .window-body > .tabs > a.mobile {
        flex: 0 0 auto !important; /* в css/menu.css у ссылок flex: 1 — растягивались на свободное место */
        min-height: 52px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 15px 4px !important;
        line-height: 21px !important;
    }
    /* плашка «Акции и скидки» у пункта «Каталог аккумуляторов» */
    html header .catalog-menu .window-body > .tabs > p[data-cat="catalog-group"] .mm-sale {
        display: table; /* своей строкой под названием: в одну строку на телефоне не помещается */
        margin: 5px 0 0;
        padding: 3px 7px;
        border-radius: 4px;
        background: var(--hd-red);
        font-size: 11px;
        font-weight: 700;
        line-height: 14px;
        letter-spacing: .02em;
        white-space: nowrap;
        color: #fff;
    }
    /* низ меню: мессенджеры и подпись — с воздухом до края экрана (было 10px) */
    html header .catalog-menu .window-body > .mobile-block {
        padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important;
    }
    html header .catalog-menu .window-body > .mobile-block .links {
        margin-bottom: 10px !important;
    }
    /* разделы каталога — раскрывающийся список с отступом */
    html header .catalog-menu .window-body > .tabs > .catalog-group {
        display: none;
        flex-direction: column;
        flex: 0 0 auto;
        padding: 0 0 6px 12px;
        border-bottom: 1px solid var(--mm-line);
    }
    html header .catalog-menu .window-body > .tabs > .catalog-group.show {
        display: flex;
    }
    html header .catalog-menu .window-body > .tabs > p.item.info:has(+ .catalog-group.show)::after {
        margin-top: -2px !important;
        transform: rotate(-135deg) !important;
    }
    html header .catalog-menu .window-body > .tabs > p.item.info:has(+ .catalog-group.show) {
        border-bottom-color: transparent !important;
    }
    html header .catalog-menu .window-body > .tabs > .catalog-group p.item {
        min-height: 48px !important;
    }
    html header .catalog-menu .window-body > .tabs > .catalog-group p.item:last-child {
        border-bottom: 0 !important;
    }
    html header .catalog-menu .window-body > .tabs > .catalog-group p.item > a {
        padding-top: 13px !important;
        padding-bottom: 13px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }
}

/* ===== Телефон: «Заказать звонок» — в одном ряду с логотипом, «Каталогом», поиском и корзиной (звонок перед поиском).
   Надпись в две строки («ЗАКАЗАТЬ / ЗВОНОК»); уже 375px — только трубка ===== */
@media screen and (max-width: 767px) {
    html header .container {
        column-gap: 5px !important;
    }
    html header .container .center a.logo img {
        height: 38px !important;
    }
    html header .container .center .burger {
        gap: 6px !important;
        padding: 0 9px 0 8px !important;
    }
    html header .container .center .burger::after {
        font-size: 14px;
    }
    /* порядок справа: «Заказать звонок», поиск, корзина */
    html header .container .center .order-call {
        order: 3 !important;
        flex: 0 0 auto !important;
        margin: 0 0 0 auto !important;
    }
    html header .container .center .form-wrapper button.open-form {
        order: 4 !important;
        margin: 0 !important;
    }
    html header .container .center .btns {
        order: 5 !important;
        margin-left: 1px !important;
    }
    html header .container .center .order-call .btn {
        width: min-content !important; /* по самому длинному слову — надпись встаёт в две строки */
        height: 40px !important;
        gap: 5px !important;
        padding: 0 8px 0 7px !important;
        justify-content: flex-start !important;
        font-size: 10.5px !important;
        line-height: 12px !important;
        letter-spacing: .01em;
        text-align: center; /* «ЗВОНОК» — по центру под «ЗАКАЗАТЬ» */
        white-space: normal !important;
    }
    html header .container .center .order-call .btn::before {
        flex: 0 0 16px;
        width: 16px !important;
        height: 16px !important;
        font-size: 15px !important;
        line-height: 16px !important;
    }
}
@media screen and (max-width: 374.98px) {
    html header .container .center .order-call .btn {
        width: 40px !important;
        padding: 0 !important;
        justify-content: center !important;
        font-size: 0 !important;
    }
}

/* ===== Телефон: резиновая строка шапки — «Каталог» и «Заказать звонок» делят свободное место,
   логотип, поиск и корзина своего размера; промежутки 6px, поля 10px ===== */
@media screen and (max-width: 767px) {
    html header .container {
        justify-content: flex-start !important;
        column-gap: 6px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    /* строка меню на телефоне пустая (ширина 0) — убираем из ряда, меню каталога внутри открывается как раньше */
    html header .container > .bottom {
        position: absolute !important;
        top: 0;
        left: 0;
    }
    /* делят свободное место от нуля; меньше своего содержимого не становятся */
    html header .container .center .burger {
        flex: 1 1 0 !important;
        min-width: max-content;
    }
    html header .container .center .order-call {
        flex: 1 1 0 !important;
        min-width: min-content;
        margin: 0 !important;
    }
    html header .container .center .order-call .btn {
        width: 100% !important;
        justify-content: center !important;
    }
    html header .container .center .btns {
        margin: 0 0 0 4px !important;
    }
    html header .container .center .form-wrapper form {
        flex: 0 0 100% !important;
        width: 100% !important;
    }
}
/* когда кнопке звонка хватает места — надпись в одну строку */
@media screen and (min-width: 480px) and (max-width: 767px) {
    html header .container .center .order-call .btn {
        white-space: nowrap !important;
        font-size: 12px !important;
        letter-spacing: .04em;
    }
}
/* узкие телефоны: промежутки и поля чуть меньше, чтобы ряд не переносился */
@media screen and (max-width: 389.98px) {
    html header .container {
        column-gap: 4px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    html header .container .center .btns {
        margin: 0 !important;
    }
}

/* ===== Планшет: пункты второй строки распределены на всю ширину ===== */
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
    html header .container > .bottom {
        justify-content: space-between !important;
    }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/menu.css?179389384555612*/
/*
 * Раскрывающиеся меню шапки: каталог (мега-меню), «Услуги», «Доставка», мобильное меню.
 * Подключается ПОСЛЕДНИМ, после css/header.css (IncludeFiles::includeCss).
 * Разметка — header.php и include/catalog_mega_menu.php, поведение — js/script.js.
 * Верхняя строка шапки (логотип, поиск, телефоны, корзина) здесь не меняется,
 * высота тёмной строки меню — тоже (на планшете кнопки лишь получают зону касания 44px
 * за счёт отрицательных полей).
 *
 * Компьютер (от 1280): каталог — белая панель от левого края тёмной строки, слева разделы,
 *   справа группы «по бренду / ёмкости / технологии» кнопками-чипами; фон страницы затемнён.
 *   «Услуги» и «Доставка» — карточка с иконками. Мышью меню открываются наведением (js/script.js).
 * Планшет (768–1279): те же панели под тёмной строкой, во всю её ширину, крупные зоны касания.
 * Телефон (до 767): полноэкранное меню, строки 52px, шрифт 16px; уровни 2 и 3 сменяют
 *   список на месте (без наложения), сверху — полоса «Назад» с заголовком уровня.
 */

header {
    --mm-dark: var(--hd-dark, #1f1b20);
    --mm-yellow: var(--hd-yellow, #ffd633);
    --mm-yellow-soft: #fff7d1;
    --mm-line: var(--hd-line, #e6e3da);
    --mm-soft: var(--hd-soft, #f6f5f0);
    --mm-muted: var(--hd-muted, #6b6870);
    --mm-shadow: 0 18px 48px rgba(31, 27, 32, .18), 0 2px 6px rgba(31, 27, 32, .06);
    /* иконка по умолчанию — стрелка */
    --mm-ico-default: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
}

/* ===== Иконки пунктов «Услуги», «Доставка», «Полезная информация» (по адресу ссылки) ===== */
header :is(.sub-menu, .useful-block) a[href*="/services/prikurit"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 3 14h9l-1 8 10-12h-9l1-8z'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href*="/services/diagnostika"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href*="/services/zaryadka"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 7h1a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 7H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h1'/%3E%3Cpath d='m11 7-3 5h4l-3 5'/%3E%3Cpath d='M22 11v2'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href*="/services/ustanovka"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/delivery/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'/%3E%3Cpath d='M15 18H9'/%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.62l-3.48-4.35A1 1 0 0 0 17.52 8H14'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/payment/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/installment/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M8 15h2M14 15h2M8 18h2'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/return/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/news/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/about/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E");
}
header :is(.sub-menu, .useful-block) a[href^="/privacy/"] {
    --mm-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
}

/* ===== Фокус с клавиатуры (везде) ===== */
header .container .bottom > div > button:focus-visible,
header .container .bottom .shops:focus-visible,
header .container .bottom nav a:focus-visible {
    outline: 2px solid var(--mm-yellow) !important;
    outline-offset: 2px !important;
}
header .container .bottom .catalog > button:focus-visible {
    outline-color: #fff !important;
}
header .container .bottom :is(.catalog-menu, .sub-menu) a:focus-visible,
header .container .bottom .catalog-menu .links > span:focus-visible,
header .container .bottom .catalog-menu .request-call-btn:focus-visible {
    outline: 2px solid var(--mm-dark) !important;
    outline-offset: -2px !important;
}

/* =====================================================================
   Компьютер и планшет (от 768): выпадающие панели под тёмной строкой
   ===================================================================== */
@media screen and (min-width: 768px) {
    /* панель каталога отсчитывается не от кнопки, а от тёмной строки (компьютер)
       или от .container, нижний край которого совпадает со строкой (планшет) */
    header .container .bottom .catalog {
        position: static !important;
    }

    /* ---- кнопки тёмной строки: открытое состояние ---- */
    header .container .bottom > div > button::after {
        transition: transform .2s ease !important;
    }
    header .container .bottom > .catalog:has(.catalog-menu.open) > button::after,
    header .container .bottom > div:has(> .sub-menu.open) > button::after {
        transform: rotate(180deg) !important;
    }
    header .container .bottom > div:has(> .sub-menu.open) > button {
        color: var(--mm-yellow) !important;
    }

    /* ---- каталог: контейнер ---- */
    header .container .bottom .catalog .catalog-menu {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        left: 0 !important;
        right: auto !important;
        width: min(100%, 1160px) !important;
        max-width: none !important;
        margin: 0 !important;
        display: block !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(-6px);
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s linear .16s !important;
        z-index: 210 !important;
    }
    header .container .bottom .catalog .catalog-menu.open {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none;
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s !important;
    }
    /* мостик над панелью: курсор не теряет меню по пути от кнопки вниз */
    header .container .bottom .catalog .catalog-menu::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: -16px;
        height: 16px;
    }

    /* ---- каталог: панель ---- */
    header .container .bottom .catalog .catalog-menu .window-body {
        display: grid !important;
        grid-template-columns: 300px minmax(0, 1fr) !important;
        grid-template-rows: minmax(0, 1fr) !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid var(--mm-line) !important;
        border-radius: 14px !important;
        background: #fff !important;
        box-shadow: var(--mm-shadow) !important;
        box-sizing: border-box !important;
    }

    /* левая колонка: разделы */
    header .container .bottom .catalog .catalog-menu .window-body .tabs {
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 12px !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        background: var(--mm-soft) !important;
        border-right: 1px solid var(--mm-line) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile) {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        transition: background-color .15s ease, box-shadow .15s ease !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile) > a {
        display: block !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 11px 36px 11px 14px !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
        letter-spacing: .02em !important;
        color: var(--mm-dark) !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere;
    }
    /* стрелка вправо */
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile)::after {
        content: '' !important;
        position: absolute !important;
        right: 16px !important;
        top: 50% !important;
        width: 7px !important;
        height: 7px !important;
        margin-top: -4px !important;
        border-right: 2px solid currentColor !important;
        border-bottom: 2px solid currentColor !important;
        font-size: 0 !important;
        color: #a7a3ab !important;
        transform: rotate(-45deg) !important;
        transition: color .15s ease, transform .15s ease !important;
        pointer-events: none;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item.selected:not(.mobile) {
        background: #fff !important;
        box-shadow: inset 3px 0 0 var(--mm-yellow), 0 1px 3px rgba(31, 27, 32, .08) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item.selected:not(.mobile) > a {
        color: var(--mm-dark) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item.selected:not(.mobile)::after {
        color: var(--mm-dark) !important;
        transform: translateX(2px) rotate(-45deg) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs .mobile,
    header .container .bottom .catalog .catalog-menu .window-body .mobile-head,
    header .container .bottom .catalog .catalog-menu .window-body .mobile-block,
    header .container .bottom .catalog .catalog-menu .window-body .block .mobile-title,
    header .container .bottom .catalog .catalog-menu .window-body .block .links .mobile-title {
        display: none !important;
    }

    /* правая часть: группы ссылок */
    header .container .bottom .catalog .catalog-menu .window-body .blocks {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block {
        display: none !important;
        flex-direction: column !important;
        gap: 22px !important;
        position: static !important;
        max-height: none !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 22px 28px 26px !important;
        opacity: 1 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        background: transparent !important;
        box-sizing: border-box !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block.active {
        display: flex !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter {
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }
    /* заголовок группы — строка-надпись с линией до края */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter p.title {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        margin: 0 0 12px !important;
        padding: 0 !important;
        border: 0 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 16px !important;
        letter-spacing: .08em !important;
        text-transform: uppercase !important;
        color: var(--mm-muted) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter p.title::after {
        content: '' !important;
        flex: 1 1 auto !important;
        height: 1px !important;
        background: var(--mm-line) !important;
        transform: none !important;
        font-size: 0 !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter p.title a {
        font: inherit !important;
        letter-spacing: inherit !important;
        color: inherit !important;
        white-space: nowrap !important;
        transition: color .15s ease !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter p.title a:hover {
        color: var(--mm-dark) !important;
    }

    /* ссылки — кнопки-чипы */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important;
        gap: 8px !important;
        position: static !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        min-height: 0 !important;
        max-height: none !important;
        background: transparent !important;
    }
    /* ёмкости короче — колонки уже */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links:has(> a[href*="capacity-"]) {
        grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > a {
        display: flex !important;
        align-items: center !important;
        min-height: 38px !important;
        width: auto !important;
        margin: 0 !important;
        padding: 8px 12px !important;
        border: 1px solid var(--mm-line) !important;
        border-radius: 9px !important;
        background: #fff !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.25 !important;
        color: var(--mm-dark) !important;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere;
        box-sizing: border-box !important;
        transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > a:hover {
        border-color: var(--mm-yellow) !important;
        background: var(--mm-yellow-soft) !important;
        box-shadow: inset 0 0 0 1px var(--mm-yellow) !important;
    }
    /* «Подробнее» / «Скрыть» — ссылка-кнопка со стрелкой */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.more,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.hide {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 8px 12px !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        color: var(--mm-dark) !important;
        text-decoration: underline !important;
        text-decoration-color: var(--mm-yellow) !important;
        text-decoration-thickness: 2px !important;
        text-underline-offset: 4px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        cursor: pointer !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.more::after,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.hide::after {
        content: '' !important;
        flex: 0 0 auto !important;
        width: 6px !important;
        height: 6px !important;
        margin-top: -3px !important;
        border-right: 2px solid currentColor !important;
        border-bottom: 2px solid currentColor !important;
        transform: rotate(45deg) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.hide::after {
        margin-top: 3px !important;
        transform: rotate(-135deg) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.more:hover,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.hide:hover {
        background: var(--mm-soft) !important;
    }
    /* скрытые ссылки до «Подробнее» (логика show-more из js/script.js) */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter:not(.show-more) .links > span.more ~ *,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter:not(.show-more) .links > span.hide,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter.show-more .links > span.more {
        display: none !important;
    }

    /* «Смотреть весь раздел» (необязательная ссылка из include/catalog_mega_menu.php) */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block > a.block-all {
        order: 10;
        align-self: flex-start;
        display: inline-flex !important;
        align-items: center;
        gap: 10px;
        min-height: 40px;
        padding: 9px 16px;
        border-radius: 10px;
        background: var(--mm-dark) !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        color: #fff !important;
        transition: background-color .15s ease, color .15s ease;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block > a.block-all::after {
        content: '';
        width: 7px;
        height: 7px;
        border-right: 2px solid var(--mm-yellow);
        border-bottom: 2px solid var(--mm-yellow);
        transform: rotate(-45deg);
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block > a.block-all:hover {
        background: #000 !important;
        color: var(--mm-yellow) !important;
    }

    /* «В этом разделе пока ничего нет» */
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .empty {
        min-height: 200px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .empty-title {
        font-size: 17px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .empty-text {
        font-size: 14px !important;
        color: var(--mm-muted) !important;
    }

    /* затемнение страницы под открытым каталогом (клик по нему закрывает меню — js/script.js) */
    body::after {
        content: '';
        position: fixed;
        inset: 0;
        z-index: 190;
        background: rgba(31, 27, 32, .42);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .2s ease-out, visibility 0s linear .2s;
    }
    html:has(header .bottom .catalog-menu.open) body::after {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity .2s ease-out, visibility 0s;
    }

    /* ---- «Услуги» и «Доставка»: карточка ---- */
    header .container .bottom .services,
    header .container .bottom .delivery {
        position: relative !important;
    }
    header .container .bottom .services .sub-menu,
    header .container .bottom .delivery .sub-menu {
        position: absolute !important;
        top: calc(100% + 15px) !important;
        left: 0 !important;
        right: auto !important;
        z-index: 220 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        width: max-content !important;
        min-width: 280px !important;
        max-width: calc(100vw - 40px) !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 8px !important;
        overflow: visible !important;
        border: 1px solid var(--mm-line) !important;
        border-top: 3px solid var(--mm-yellow) !important;
        border-radius: 12px !important;
        background: #fff !important;
        box-shadow: var(--mm-shadow) !important;
        box-sizing: border-box !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(-6px);
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s linear .16s !important;
    }
    header .container .bottom .services .sub-menu.open,
    header .container .bottom .delivery .sub-menu.open {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none;
        transition: opacity .16s ease-out, transform .16s ease-out, visibility 0s !important;
    }
    header .container .bottom .services .sub-menu::before,
    header .container .bottom .delivery .sub-menu::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: -19px;
        height: 16px;
    }
    header .container .bottom .services .sub-menu a,
    header .container .bottom .delivery .sub-menu a {
        position: relative !important;
        display: block !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 12px 18px 12px 56px !important;
        border: 0 !important;
        border-radius: 9px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        line-height: 20px !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
        color: var(--mm-dark) !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        transition: background-color .15s ease !important;
    }
    /* «ДОСТАВКА / ОПЛАТА / РАССРОЧКА» — обычным регистром */
    header .container .bottom .delivery .sub-menu a {
        text-transform: none !important;
    }
    header .container .bottom .delivery .sub-menu a::first-letter {
        text-transform: uppercase;
    }
    /* иконка в плашке */
    header .container .bottom .services .sub-menu a::before,
    header .container .bottom .delivery .sub-menu a::before {
        content: '' !important;
        position: absolute !important;
        left: 8px !important;
        top: 50% !important;
        width: 34px !important;
        height: 34px !important;
        margin-top: -17px !important;
        border-radius: 8px !important;
        background: var(--mm-soft) var(--mm-ico, var(--mm-ico-default)) center / 18px 18px no-repeat !important;
        transition: background-color .15s ease !important;
    }
    /* стрелок справа нет — только иконка и название */
    header .container .bottom .services .sub-menu a::after,
    header .container .bottom .delivery .sub-menu a::after {
        content: none !important;
        display: none !important;
    }
    header .container .bottom .services .sub-menu a:hover,
    header .container .bottom .delivery .sub-menu a:hover,
    header .container .bottom .services .sub-menu a:focus-visible,
    header .container .bottom .delivery .sub-menu a:focus-visible {
        background: var(--mm-soft) !important;
        color: var(--mm-dark) !important;
    }
    header .container .bottom .services .sub-menu a:hover::before,
    header .container .bottom .delivery .sub-menu a:hover::before,
    header .container .bottom .services .sub-menu a:focus-visible::before,
    header .container .bottom .delivery .sub-menu a:focus-visible::before {
        background-color: var(--mm-yellow) !important;
    }
}

/* ===== Компьютер (от 1280) ===== */
@media screen and (min-width: 1280px) {
    header .container .bottom {
        position: relative !important;
    }
    /* верхняя строка шапки — над тёмной строкой: список телефонов (.hd-contacts__drop) выпадает поверх неё */
    header .container .center .wrapper {
        z-index: 3 !important;
    }
    /* под тёмной строкой: её нижний отступ 7px + зазор 8px */
    header .container .bottom .services .sub-menu,
    header .container .bottom .delivery .sub-menu {
        top: calc(100% + 15px) !important;
    }
    header .container .bottom > div:has(> .sub-menu.open) > button {
        background: rgba(255, 255, 255, .08) !important;
    }
}

/* ===== Планшет (768–1279) ===== */
@media screen and (min-width: 768px) and (max-width: 1279.98px) {
    /* зона касания кнопок тёмной строки — 44px, высота строки прежняя (поля -4px) */
    header .container > .bottom .catalog > button,
    header .container > .bottom .services > button,
    header .container > .bottom .delivery > button,
    header .container > .bottom .shops {
        min-height: 44px !important;
        margin: -4px -6px !important;
        padding: 13px 6px !important;
        box-sizing: border-box !important;
    }
    /* старое правило светлой строки красило кнопку серым при касании */
    header .container > .bottom .catalog > button:hover,
    header .container > .bottom .services > button:hover,
    header .container > .bottom .delivery > button:hover,
    header .container > .bottom .shops:hover {
        background: transparent !important;
    }
    header .container .bottom .services .sub-menu,
    header .container .bottom .delivery .sub-menu {
        top: calc(100% + 12px) !important;
        left: -6px !important;
    }
    /* .container (position: relative) с полями 20px; тёмная строка — его последняя строка.
       Саму строку не делаем relative: от .container считает позицию меню правых ссылок (js/script.js, placeNav) */
    header .container .bottom .catalog .catalog-menu {
        left: 20px !important;
        right: 20px !important;
        width: auto !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body {
        grid-template-columns: minmax(230px, 32%) minmax(0, 1fr) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs {
        padding: 10px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile) {
        min-height: 48px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile) > a {
        padding: 12px 32px 12px 12px !important;
        font-size: 13px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .tabs p.item:not(.mobile)::after {
        right: 14px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block {
        padding: 18px 20px 22px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > a,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.more,
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block .links > span.hide {
        min-height: 44px !important;
        font-size: 15px !important;
    }
    header .container .bottom .catalog .catalog-menu .window-body .blocks .block > a.block-all {
        min-height: 44px;
    }
    header .container .bottom .services .sub-menu a,
    header .container .bottom .delivery .sub-menu a {
        min-height: 48px !important;
        padding-top: 14px !important;
        padding-bottom: 14px !important;
    }

    /* меню правых ссылок (кнопка-«гамбургер» справа) — пункты по 44px */
    header.nav-open .container .bottom nav > a {
        min-height: 44px;
        padding: 12px 14px !important;
        font-size: 15px !important;
        line-height: 20px !important;
        box-sizing: border-box;
    }
}

/* =====================================================================
   Телефон (до 767): полноэкранное меню
   ===================================================================== */
@media screen and (max-width: 767px) {
    header .catalog-menu .window-body {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        height: 100dvh !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 16px !important;
        overflow: hidden !important;
        background: #fff !important;
        box-sizing: border-box !important;
    }

    /* ---- шапка меню: логотип, крестик, слоган ---- */
    header .catalog-menu .window-body .mobile-head {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 44px !important;
        align-items: center !important;
        column-gap: 12px !important;
        flex: 0 0 auto !important;
        position: relative !important;
        margin: 0 -16px !important;
        padding: 10px 16px 12px !important;
        border-bottom: 1px solid var(--mm-line) !important;
        background: #fff !important;
    }
    header .catalog-menu .window-body .mobile-head a.logo {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: start !important;
        max-width: 130px !important;
        margin: 0 !important;
    }
    header .catalog-menu .window-body .mobile-head a.logo img {
        display: block !important;
        height: 44px !important;
        width: auto !important;
    }
    header .catalog-menu .window-body .mobile-head div.close {
        grid-column: 2 !important;
        grid-row: 1 !important;
        position: relative !important;
        inset: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        border-radius: 50% !important;
        background: var(--mm-soft) !important;
        color: var(--mm-dark) !important;
        cursor: pointer !important;
    }
    header .catalog-menu .window-body .mobile-head div.close::before {
        font-size: 16px !important;
        line-height: 16px !important;
    }
    header .catalog-menu .window-body .mobile-head h2 {
        grid-column: 1 / -1 !important;
        margin: 10px 0 2px !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 18px !important;
        color: var(--mm-dark) !important;
    }
    header .catalog-menu .window-body .mobile-head p {
        grid-column: 1 / -1 !important;
        margin: 0 !important;
        font-size: 13px !important;
        line-height: 17px !important;
        color: var(--mm-muted) !important;
    }
    /* на уровнях 2–3 слоган не нужен: остаются логотип и крестик */
    header .catalog-menu .window-body:has(.blocks .mobile-show) .mobile-head :is(h2, p) {
        display: none !important;
    }

    /* ---- уровень 1: список ---- */
    header .catalog-menu .window-body > .tabs {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
        gap: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 4px 0 16px !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    header .catalog-menu .window-body > .tabs p.item,
    header .catalog-menu .window-body > .tabs > a {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        min-height: 52px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid var(--mm-line) !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }
    header .catalog-menu .window-body > .tabs p.item > a,
    header .catalog-menu .window-body > .tabs p.item > span,
    header .catalog-menu .window-body > .tabs > a {
        display: block !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 15px 40px 15px 4px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 21px !important;
        letter-spacing: .01em !important;
        color: var(--mm-dark) !important;
        white-space: normal !important;
    }
    header .catalog-menu .window-body > .tabs > a {
        padding-right: 4px !important;
    }
    /* стрелка вправо — пункт ведёт на следующий уровень */
    header .catalog-menu .window-body > .tabs p.item::after {
        content: '' !important;
        position: absolute !important;
        right: 10px !important;
        top: 50% !important;
        width: 8px !important;
        height: 8px !important;
        margin-top: -5px !important;
        border-right: 2px solid currentColor !important;
        border-bottom: 2px solid currentColor !important;
        font-size: 0 !important;
        color: var(--mm-dark) !important;
        transform: rotate(-45deg) !important;
        transition: transform .2s ease !important;
        pointer-events: none;
    }
    /* без красного: выбранный и «мобильные» пункты — обычным цветом */
    header .catalog-menu .window-body > .tabs .selected a,
    header .catalog-menu .window-body > .tabs .selected::after,
    header .catalog-menu .window-body > .tabs .mobile,
    header .catalog-menu .window-body > .tabs .mobile span {
        color: var(--mm-dark) !important;
    }
    header .catalog-menu .window-body > .tabs p.item:active,
    header .catalog-menu .window-body > .tabs > a:active {
        background: var(--mm-soft) !important;
    }
    /* второй смысловой блок (услуги, доставка, магазины…) — отступом */
    header .catalog-menu .window-body > .tabs > p.item:not(.mobile) + .mobile {
        margin-top: 14px !important;
        border-top: 1px solid var(--mm-line) !important;
    }

    /* аккордеоны «Услуги / Доставка / Полезная информация»: стрелка вниз, раскрыт — вверх */
    header .catalog-menu .window-body > .tabs p.item.info::after {
        margin-top: -7px !important;
        transform: rotate(45deg) !important;
    }
    header .catalog-menu .window-body > .tabs p.item.info:has(+ .useful-block.show)::after {
        margin-top: -2px !important;
        transform: rotate(-135deg) !important;
    }
    header .catalog-menu .window-body > .tabs p.item.info:has(+ .useful-block.show) {
        border-bottom-color: transparent !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block {
        display: none !important;
        flex-direction: column !important;
        flex: 0 0 auto !important;
        gap: 2px !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 0 10px !important;
        overflow: visible !important;
        border-bottom: 1px solid var(--mm-line) !important;
        transition: none !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block.show {
        display: flex !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block + a.mobile {
        margin-top: 0 !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block a {
        position: relative !important;
        display: block !important;
        min-height: 48px !important;
        margin: 0 !important;
        padding: 14px 8px 14px 52px !important;
        border: 0 !important;
        border-radius: 10px !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        line-height: 20px !important;
        text-transform: none !important;
        color: var(--mm-dark) !important;
        box-sizing: border-box !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block a::before {
        content: '' !important;
        position: absolute !important;
        left: 4px !important;
        top: 50% !important;
        width: 34px !important;
        height: 34px !important;
        margin-top: -17px !important;
        border-radius: 8px !important;
        background: var(--mm-soft) var(--mm-ico, var(--mm-ico-default)) center / 18px 18px no-repeat !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block a:active {
        background: var(--mm-soft) !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block[data-cat="delivery-info"] a {
        text-transform: none !important;
    }
    header .catalog-menu .window-body > .tabs > .useful-block[data-cat="delivery-info"] a::first-letter {
        text-transform: uppercase;
    }

    /* ---- низ меню: «Заказать звонок» и мессенджеры ---- */
    header .catalog-menu .window-body > .mobile-block {
        flex: 0 0 auto !important;
        margin: 0 -16px !important;
        padding: 12px 16px calc(10px + env(safe-area-inset-bottom)) !important;
        border-top: 1px solid var(--mm-line) !important;
        background: #fff !important;
    }
    header .catalog-menu .window-body > .mobile-block .request-call-btn {
        height: 50px !important;
        margin-bottom: 6px !important;
        font-size: 16px !important;
    }

    /* ---- уровни 2 и 3 сменяют список на месте ---- */
    header .catalog-menu .window-body > .blocks {
        display: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    header .catalog-menu .window-body:has(.blocks .block.mobile-show) > .tabs,
    header .catalog-menu .window-body:has(.blocks .block.mobile-show) > .mobile-block {
        display: none !important;
    }
    header .catalog-menu .window-body:has(.blocks .block.mobile-show) > .blocks {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }
    header .catalog-menu .window-body > .blocks .block {
        display: none !important;
        position: static !important;
        inset: auto !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 0 24px !important;
        background: #fff !important;
        transform: none !important;
    }
    header .catalog-menu .window-body > .blocks .block.mobile-show {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
        gap: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    header .catalog-menu .window-body > .blocks .block::before {
        display: none !important;
    }

    /* полоса «Назад» + заголовок уровня; вся полоса — кнопка возврата */
    header .catalog-menu .window-body > .blocks .block .mobile-title {
        position: sticky !important;
        top: 0 !important;
        z-index: 2 !important;
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        column-gap: 12px !important;
        align-items: center !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding: 10px 0 !important;
        border: 0 !important;
        border-bottom: 1px solid var(--mm-line) !important;
        background: #fff !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 22px !important;
        letter-spacing: .01em !important;
        color: var(--mm-dark) !important;
        text-align: left !important;
        box-sizing: border-box !important;
        cursor: pointer;
    }
    header .catalog-menu .window-body > .blocks .block .mobile-title::before {
        content: 'Назад' !important;
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: block !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 16px !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
        color: var(--mm-muted) !important;
    }
    header .catalog-menu .window-body > .blocks .block .mobile-title span.close-window {
        grid-column: 1 !important;
        grid-row: 1 / span 2 !important;
        position: static !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        border-radius: 50% !important;
        background: var(--mm-soft) !important;
    }
    header .catalog-menu .window-body > .blocks .block .mobile-title span.close-window::before {
        content: '' !important;
        width: 9px !important;
        height: 9px !important;
        margin-left: 4px !important;
        border-left: 2px solid var(--mm-dark) !important;
        border-bottom: 2px solid var(--mm-dark) !important;
        font-size: 0 !important;
        transform: rotate(45deg) !important;
    }
    /* невидимая «накладка» на всю полосу — нажатие в любом её месте ведёт назад */
    header .catalog-menu .window-body > .blocks .block .mobile-title span.close-window::after {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
    }

    /* уровень 2: группы «По бренду / По ёмкости / По технологии» */
    header .catalog-menu .window-body > .blocks .block .chapter {
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid var(--mm-line) !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter p.title {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        min-height: 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter p.title a {
        display: block !important;
        flex: 1 1 auto !important;
        padding: 17px 40px 17px 4px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 22px !important;
        color: var(--mm-dark) !important;
        text-transform: lowercase !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter p.title a::first-letter {
        text-transform: uppercase;
    }
    header .catalog-menu .window-body > .blocks .block .chapter p.title::after {
        content: '' !important;
        position: absolute !important;
        right: 10px !important;
        top: 50% !important;
        width: 8px !important;
        height: 8px !important;
        margin-top: -5px !important;
        border-right: 2px solid var(--mm-dark) !important;
        border-bottom: 2px solid var(--mm-dark) !important;
        font-size: 0 !important;
        transform: rotate(-45deg) !important;
        pointer-events: none;
    }
    header .catalog-menu .window-body > .blocks .block .chapter p.title:active {
        background: var(--mm-soft) !important;
    }
    header .catalog-menu .window-body > .blocks .block > a.block-all {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 52px !important;
        margin: 14px 0 6px !important;
        padding: 14px 16px !important;
        border-radius: 12px !important;
        background: var(--mm-dark) !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 22px !important;
        color: #fff !important;
        order: 0;
    }
    header .catalog-menu .window-body > .blocks .block > a.block-all::after {
        content: '';
        width: 8px;
        height: 8px;
        border-right: 2px solid var(--mm-yellow);
        border-bottom: 2px solid var(--mm-yellow);
        transform: rotate(-45deg);
    }

    /* уровень 3: ссылки плиткой во весь экран, все сразу (без «Подробнее») */
    header .catalog-menu .window-body > .blocks .block .chapter .links {
        display: none !important;
    }
    header .catalog-menu .window-body > .blocks .block.mobile-show:has(.links.mobile-show) > .mobile-title,
    header .catalog-menu .window-body > .blocks .block.mobile-show:has(.links.mobile-show) > a.block-all,
    header .catalog-menu .window-body > .blocks .block.mobile-show:has(.links.mobile-show) > .chapter:not(:has(.links.mobile-show)),
    header .catalog-menu .window-body > .blocks .block.mobile-show:has(.links.mobile-show) .chapter p.title {
        display: none !important;
    }
    header .catalog-menu .window-body > .blocks .block.mobile-show .chapter:has(.links.mobile-show) {
        border: 0 !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        position: static !important;
        inset: auto !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #fff !important;
        transition: none !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show:has(> a[href*="capacity-"]) {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    /* легковые, азиатский корпус, AGM/EFB: диапазоны «100–110 Ач» длиннее — в 2 колонки */
    header .catalog-menu .window-body > .blocks .block:is([data-cat="car"], [data-cat="akb-v-aziatskom-korpuse"], [data-cat="akkumulyatory-agm-i-efb-start-stop"]) .chapter .links.mobile-show:has(> a[href*="capacity-"]) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > .mobile-title {
        grid-column: 1 / -1 !important;
        margin-bottom: 8px !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > a {
        display: flex !important;
        align-items: center !important;
        min-height: 48px !important;
        width: auto !important;
        margin: 0 !important;
        padding: 12px 14px !important;
        border: 1px solid var(--mm-line) !important;
        border-radius: 10px !important;
        background: #fff !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        line-height: 20px !important;
        color: var(--mm-dark) !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        box-sizing: border-box !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > a:active {
        border-color: var(--mm-yellow) !important;
        background: var(--mm-yellow-soft) !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > span.more,
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > span.hide {
        display: none !important;
    }
    header .catalog-menu .window-body > .blocks .block .chapter .links.mobile-show > span.more ~ a {
        display: flex !important;
    }
    /* бренды: избранные сразу, остальные — по кнопке «Еще» (show-more на .chapter — js/script.js) */
    header .catalog-menu .window-body > .blocks .block .chapter--brands:not(.show-more) .links.mobile-show > span.more,
    header .catalog-menu .window-body > .blocks .block .chapter--brands.show-more .links.mobile-show > span.hide {
        display: flex !important;
        grid-column: 1 / -1 !important;
        justify-content: center !important;
        align-items: center !important;
        min-height: 48px !important;
        margin: 0 !important;
        padding: 12px 14px !important;
        border: 1px solid var(--mm-line) !important;
        border-radius: 10px !important;
        background: var(--mm-soft) !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: var(--mm-dark) !important;
        cursor: pointer;
    }
    header .catalog-menu .window-body > .blocks .block .chapter--brands:not(.show-more) .links.mobile-show > span.more ~ a {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header .container .bottom .catalog .catalog-menu,
    header .container .bottom .sub-menu {
        transform: none !important;
    }
}

/* ===== Меню каталога: бренды — жирным и заглавными (все ширины) ===== */
header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter--brands .links > a {
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .02em !important;
}
/* ёмкости — жирным, как бренды */
header .container .bottom .catalog .catalog-menu .window-body .blocks .block .chapter .links > a[href*="/capacity-"] {
    font-weight: 700 !important;
}

/* End */


/* Start:/local/templates/akumulyator_template/css/popups.css?17938068587832*/
/*
 * Всплывающие окна (.window-background: «Заказать звонок», «Спасибо», «Купить в 1 клик», отзыв, подбор по VIN).
 * Подключается после css/menu.css (IncludeFiles::includeCss), перекрывает старые правила css/style.css и css/index.css.
 *
 * Компьютер: без тёмной подложки — окно отделено тенью и тонкой рамкой; прозрачная подложка остаётся,
 *   касание мимо окна его закрывает (js/script.js), Esc — тоже.
 * Телефон (до 767): фон слегка затемнён и не прокручивается; окно — «шторка» снизу во всю ширину: кнопки под большим пальцем, сверху ручка,
 *   содержимое прокручивается внутри, страница под окном не прокручивается.
 * Анимируются только transform и opacity — плавно и на слабых телефонах; без backdrop-filter.
 */

.window-background {
    background: transparent !important;
    transition: opacity .2s ease !important;
}
.window-background .window-body {
    border: 1px solid #e6e3da;
    box-shadow: 0 24px 64px rgba(31, 27, 32, .22), 0 2px 8px rgba(31, 27, 32, .08);
}

/* пока окно открыто, страница под ним не прокручивается */
html:has(.window-background.open) {
    overflow: hidden;
    scrollbar-gutter: stable; /* на компьютере страница не сдвигается, когда пропадает полоса прокрутки */
}

@media screen and (max-width: 767px) {
    /* телефон: фон под окном слегка затемнён и не прокручивается — свайп по затемнению гасится */
    .window-background {
        background: rgba(31, 27, 32, .35) !important;
        touch-action: none;
        overscroll-behavior: contain;
    }
    html:has(.window-background.open),
    html:has(.window-background.open) body {
        overflow: hidden !important;
    }
    .window-background {
        align-items: flex-end !important;
        justify-content: stretch !important;
        width: auto !important; /* у подложки были поля по 12px и ширина «экран − 24px» — шторка во всю ширину */
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .window-background .window-body {
        box-sizing: border-box;
        width: 100% !important;
        max-width: none !important;
        max-height: 90dvh !important;
        margin: 0 !important;
        padding: 30px 20px calc(24px + env(safe-area-inset-bottom)) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        border: 0;
        border-radius: 20px 20px 0 0 !important;
        box-shadow: 0 -10px 40px rgba(31, 27, 32, .2), 0 -1px 0 #e6e3da;
        transform: translateY(100%);
        transition: transform .26s cubic-bezier(.2, .8, .2, 1);
    }
    .window-background.open .window-body {
        transform: none;
    }
    /* ручка сверху — подсказка, что это шторка */
    .window-background .window-body::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        width: 40px;
        height: 4px;
        margin-left: -20px;
        border-radius: 2px;
        background: #d9d6cd;
    }
    /* крестик — 40px, удобно попасть пальцем */
    .window-background .window-body > div.close {
        display: flex;
        align-items: center;
        justify-content: center;
        top: 14px !important;
        right: 14px !important;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #f6f5f0;
        z-index: 2;
    }
    .window-background .window-body > div.close::before {
        font-size: 13px !important;
        line-height: 13px !important;
    }
    /* форма — во всю ширину шторки (в окне-флексе она сжималась до ширины полей ~240px) */
    .window-background .window-body > .akum-form-slot {
        flex: 1 1 auto;
        width: 100%;
        max-width: 480px;
        margin: 0 auto;
    }
    /* заголовок не залезает под крестик */
    .window-background .window-body > h2,
    .window-background .window-body h2:first-of-type {
        padding-right: 36px;
        padding-left: 36px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .window-background,
    .window-background .window-body {
        transition: none !important;
    }
}

/* 2026-11-04: формы — антиспам-ловушка, согласие на обработку ПД, сообщение об ошибке (Forms::guardSubmission) */
.akum-hp {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.akum-consent {
    display: flex !important;
    align-items: flex-start;
    gap: 8px;
    margin: 10px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    width: auto !important;
    height: auto !important;
    cursor: pointer;
    text-align: left;
}
.akum-consent input[type="checkbox"] {
    flex: none;
    width: 18px !important;
    height: 18px !important;
    min-height: 0 !important;
    margin: 1px 0 0 !important;
    padding: 0 !important;
    accent-color: #1f1b20;
    cursor: pointer;
    appearance: auto !important;
    -webkit-appearance: checkbox !important;
}
.akum-consent span,
.akum-consent a {
    font: 400 13px/1.4 Inter, sans-serif !important;
    color: inherit;
}
.akum-consent a { text-decoration: underline; }
.akum-form-errors {
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #fdecea;
    color: #bb1303;
    font: 500 14px/1.4 Inter, sans-serif;
}
form.is-sending button[type="submit"],
form.is-sending input[type="submit"] { opacity: .6; pointer-events: none; }
/* в формах-строках (поле + кнопка в ряд) галочка согласия — отдельной строкой под ними */
form > .akum-consent,
form > div > .akum-consent {
    flex: 1 1 100% !important;
    order: 99;
    grid-column: 1 / -1;
    max-width: none !important;
}
form:has(> .akum-consent),
form > div:has(> .akum-consent) { flex-wrap: wrap !important; }
/* форма «Задайте ваш вопрос» в подвале: у её label — флаг и фиксированная ширина (style.css .form-question),
   галочке согласия это не нужно; поле вопроса сжимается, чтобы поле + телефон + кнопка остались в ряд */
@media screen and (min-width: 1280px) {
    .form-question form > textarea { flex: 1 1 0; min-width: 0; }
}
.form-question form label.akum-consent {
    min-width: 0 !important;
    max-width: none !important;
    flex: 1 1 100% !important;
    color: var(--text-2, #fff);
}
.form-question form label.akum-consent::before { content: none !important; display: none !important; }
.form-question form label.akum-consent input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    padding: 0 !important;
    border-radius: 3px;
    background: #fff;
}
.form-question form label.akum-consent span,
.form-question form label.akum-consent a { color: var(--text-2, #fff) !important; }

/* End */


/* Start:/local/templates/akumulyator_template/css/mobile-bar.css?179365413011231*/
/*
 * Нижняя закреплённая полоса на телефоне (footer.php, .mobile-menu): тёмная капсула, в ней жёлтая кнопка
 * «позвонить» с номером и цветные плитки Viber, Telegram, WhatsApp. Почта и Instagram на телефоне скрыты.
 * Резиновая: кнопка и плитки делят свободное место (кнопке вдвое больше), на любой ширине до 767px.
 * Номер всегда в одну строку: на узких экранах шрифт уменьшается по ширине экрана.
 * Подключается последней (IncludeFiles::includeCss). От 768px не действует.
 */
/* ===== общее для всех вариантов: место под полосу, когда прятать, почта, тост, фильтр ===== */
@media screen and (max-width: 767px) {
    :root {
        --mobile-bar-h: calc(var(--mbar) + env(safe-area-inset-bottom, 0px)); /* уже используют footer.css, responsive.css */
    }
    /* место под полосу резервирует футер (footer.css: padding-bottom = --mobile-bar-h + 16px);
       старый body{padding-bottom:42px} давал второй пустой отступ */
    body {
        padding-bottom: 0 !important;
    }
    /* почта и Instagram на телефоне — только в меню «Каталог», в подвале и в контактах */
    html body .mobile-menu .social a.soc.soc.soc.soc--mail,
    html body .mobile-menu .social a.soc.soc.soc.soc--ig {
        display: none !important;
    }
    html body .mobile-menu {
        transition: transform .2s ease, visibility 0s;
        will-change: auto;
    }
    /* прячем: открыто меню «Каталог» (html.menu-open, js/script.js), открыта шторка-окно,
       в фокусе текстовое поле (открыта клавиатура — полоса не прыгает над ней и не закрывает поле) */
    html.menu-open body .mobile-menu,
    html:has(.window-background.open) body .mobile-menu,
    html:has(:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [type="hidden"]), textarea):focus) body .mobile-menu,
    html.mbar-off body .mobile-menu {
        transform: translateY(calc(100% + 16px));
        visibility: hidden;
        transition: transform .2s ease, visibility 0s linear .2s;
    }
    /* «Товар добавлен в корзину» — над полосой, а не поверх неё */
    .add-cart-success {
        right: 12px !important;
        bottom: calc(var(--mobile-bar-h) + 8px) !important;
    }
    /* кнопка «Подобрать» в фильтре прилипает над полосой (было 40px) */
    .catalog-container aside form .akum-filter-apply {
        bottom: var(--mobile-bar-h) !important;
    }
    html:has(:is(input:not([type="checkbox"], [type="radio"], [type="range"]), textarea):focus) .catalog-container aside form .akum-filter-apply {
        bottom: 0 !important;
    }
}
@keyframes mbar-ring {
    0%, 60%, 100% { transform: rotate(0); }
    66% { transform: rotate(-14deg); }
    72% { transform: rotate(12deg); }
    78% { transform: rotate(-10deg); }
    84% { transform: rotate(8deg); }
    90% { transform: rotate(-4deg); }
}
@media (prefers-reduced-motion: reduce) {
    html body .mobile-menu { transition: none !important; }
    html body .mobile-menu a.phone::before { animation: none !important; }
}
/* ===== Полоса: тёмная капсула; жёлтая кнопка звонка + 3 цветные плитки, всё растягивается ===== */
@media screen and (max-width: 767px) {
    :root { --mbar: 72px; } /* капсула 56 + отступ снизу 8 + воздух 8 */
    html body .mobile-menu {
        display: flex;
        align-items: center;
        gap: 4px;
        box-sizing: border-box;
        left: max(8px, env(safe-area-inset-left, 0px));
        right: max(8px, env(safe-area-inset-right, 0px));
        bottom: calc(8px + env(safe-area-inset-bottom, 0px));
        width: auto;
        height: 56px;
        min-height: 0;
        padding: 6px;
        border: 1px solid rgba(255, 255, 255, .14);
        border-radius: 18px;
        background: #1f1b20;
        box-shadow: 0 6px 18px rgba(31, 27, 32, .22); /* одна статичная тень — отделяет от светлого фона */
        z-index: 98;
    }
    /* «Позвонить»: жёлтая кнопка, берёт вдвое больше свободного места, чем каждая плитка */
    html body .mobile-menu a.phone {
        flex: 2 1 auto;
        min-width: 0;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0; /* интервалы — полями: в разметке перед номером уже есть пробел */
        padding: 0 10px;
        overflow: hidden;
        border-radius: 12px;
        background: #ffd633;
        color: #1f1b20;
        font: 700 16px/1 Inter, Arial, sans-serif;
        /* номер в одну строку: под текст ≈ ширина экрана − 220px (капсула, поля, трубка, 3 плитки по 44);
           «+375 (29) 266 55 66» при 16px ≈ 159px → шрифт = (100vw − 220px) × 0.0956, не больше 16px */
        font-size: min(16px, max(12px, calc((100vw - 220px) * .0956)));
        letter-spacing: -.01em;
        white-space: nowrap;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }
    html body .mobile-menu a.phone > span {
        display: inline;
        margin-right: .3em; /* пробел перед номером во flex-строке схлопывается */
        color: inherit;
        font-weight: 600;
    }
    html body .mobile-menu a.phone::before {
        content: '\e013';
        font-family: 'icon';
        font-size: 18px;
        line-height: 1;
        color: #1f1b20;
        margin: 0 8px 0 0;
    }
    /* трубка «звонит» — как у кнопки «Заказать звонок» в шапке: покачивание раз в 3 секунды */
    html body .mobile-menu a.phone::before {
        display: inline-block;
        transform-origin: 50% 50%;
        animation: mbar-ring 3s ease-in-out infinite;
    }
    html body .mobile-menu a.phone:active { background: #ffce05; }

    /* мессенджеры: плитки фирменного цвета с белым знаком (data:SVG-маски, без запросов), тянутся от 44px */
    html body .mobile-menu .social {
        display: contents;
    }
    html body .mobile-menu .soc--vb { order: 1; --mb-c: #7360f2; --mb-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M24 11.5c-7.4 0-11.5 2.9-11.5 10.2 0 4.2 1.3 6.9 3.6 8.3v5.2l4.1-3.5c1.2.2 2.5.3 3.8.3 7.4 0 11.5-2.9 11.5-10.3S31.4 11.5 24 11.5Z'/%3E%3Cpath d='M25.2 16.6a5.4 5.4 0 0 1 4.9 4.9M25.2 19.4a2.5 2.5 0 0 1 2.1 2.1'/%3E%3C/g%3E%3Cpath d='M18.6 16.9c.4-.3.8-.3 1.1 0l1.7 2c.3.3.3.8 0 1.1l-.8.8c-.2.2-.2.5-.1.8.4.9 1 1.8 1.7 2.5.7.7 1.6 1.3 2.5 1.7.3.1.6.1.8-.1l.8-.8c.3-.3.8-.3 1.1 0l2 1.7c.3.3.3.7 0 1.1-.6.8-1.5 1.5-2.6 1.4-1.8-.2-3.9-1.4-5.6-3.1s-2.9-3.800-3.1-5.6c-.1-1.1.6-2 1.4-2.6Z'/%3E%3C/svg%3E"); }
    html body .mobile-menu .soc--tg { order: 2; --mb-c: #229ed9; --mb-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath d='M34.9 14.2 11.7 23.1c-1.6.6-1.6 1.5-.3 1.9l5.9 1.8 2.3 7c.3.8.5 1.1 1.1 1.1.5 0 .8-.2 1.1-.5l2.8-2.7 5.9 4.3c1.1.6 1.8.3 2.1-1l3.9-18.4c.4-1.6-.6-2.3-1.6-1.9Zm-14.7 13 10.9-6.9c.5-.3 1-.1.6.3l-9.3 8.4-.4 4-1.8-5.8Z'/%3E%3C/svg%3E"); }
    html body .mobile-menu .soc--wa { order: 3; --mb-c: #1faa53; --mb-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linejoin='round' d='M24 12.5a11.5 11.5 0 0 0-9.9 17.3L12.6 35.4l5.7-1.5A11.5 11.5 0 1 0 24 12.5Z'/%3E%3Cpath d='M19.8 18.1c.3-.6.6-.6.9-.6h.7c.2 0 .5 0 .7.6l1 2.3c.1.2.1.5 0 .7l-.6.8c-.2.2-.3.5-.1.8.4.8 1 1.6 1.7 2.2.8.7 1.6 1.2 2.4 1.5.3.1.5 0 .7-.2l.9-1.1c.2-.3.5-.3.8-.2l2.2 1.1c.3.1.5.2.5.4.1.4 0 1.4-.5 2-.6.6-1.6 1.1-2.5 1.1-1.4 0-3.600-.8-5.6-2.6-2.1-1.9-3.4-4.3-3.6-5.4-.2-1.3.2-2.5.4-3.4Z'/%3E%3C/svg%3E"); }
    html body .mobile-menu .social a.soc.soc.soc {
        flex: 1 1 44px;
        display: grid !important;
        place-items: center;
        width: auto !important;
        min-width: 44px;
        height: 44px !important;
        margin: 0 !important;
        border-radius: 12px !important;
        background: var(--mb-c) !important;
        transform: none !important;
        -webkit-tap-highlight-color: transparent;
    }
    html body .mobile-menu .social a.soc.soc.soc::before {
        content: '' !important;
        position: static !important;
        width: 22px !important;
        height: 22px !important;
        margin: 0 !important;
        border-radius: 0 !important;
        background: #fff !important;
        -webkit-mask: var(--mb-mask) center / contain no-repeat !important;
        mask: var(--mb-mask) center / contain no-repeat !important;
    }
    html body .mobile-menu .social a.soc.soc.soc::after {
        display: none !important;
    }
    html body .mobile-menu .social a.soc.soc.soc:active { filter: brightness(.9); }
    html body .mobile-menu :is(a.phone, .social a.soc.soc.soc):focus-visible { outline: 2px solid #ffd633; outline-offset: 2px; }

    /* скрытие — капсула уезжает вниз целиком, вместе с отступом */
    html.menu-open body .mobile-menu,
    html:has(.window-background.open) body .mobile-menu,
    html:has(:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [type="hidden"]), textarea):focus) body .mobile-menu {
        transform: translateY(calc(100% + 24px + env(safe-area-inset-bottom, 0px)));
    }
}
/* узкие экраны (до 389): поуже поля и плитки 40px, чтобы номер оставался крупнее */
@media screen and (max-width: 389.98px) {
    html body .mobile-menu {
        left: max(6px, env(safe-area-inset-left, 0px));
        right: max(6px, env(safe-area-inset-right, 0px));
        gap: 3px;
        padding: 5px 4px;
    }
    html body .mobile-menu a.phone {
        padding: 0 8px;
        /* под текст ≈ ширина экрана − 191px */
        font-size: min(16px, max(11px, calc((100vw - 191px) * .0956)));
    }
    html body .mobile-menu a.phone::before { font-size: 16px; margin-right: 6px; }
    html body .mobile-menu .social a.soc.soc.soc { flex-basis: 40px; min-width: 40px; }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/fluid.css?17936541306198*/
/*
 * Резиновая вёрстка: блоки тянутся на свободное место на любой ширине, без пустых полей сбоку.
 * Точечные поправки поверх стилей блоков; подключается последней (IncludeFiles::includeCss).
 */

/* Главная, «О нашем магазине»: фото магазина на планшете было не шире 720px — справа оставалась пустота */
.ab-media {
    max-width: none !important;
}

/* Главная, «Подбор АКБ по ёмкости»: на планшете ряд уходил в прокрутку вбок —
   теперь кнопки переносятся и делят ширину поровну */
@media screen and (max-width: 1279.98px) {
    .selection-block:not(.brands) > .items.wrapper {
        grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)) !important;
        grid-auto-flow: row !important; /* было column — кнопки шли в один ряд */
        grid-template-rows: none !important;
        grid-auto-rows: auto !important;
        align-content: start !important;
        row-gap: 8px !important;
        overflow: visible !important;
    }
    .selection-block:not(.brands) > .items.wrapper > .item {
        width: auto !important;
        min-width: 0 !important;
    }
}

@media screen and (max-width: 767px) {
    /* Главная, плитки разделов: последняя одиночная плитка в ряду тянется на всю ширину */
    section.promo.wrapper > .item:not(.slider) {
        flex-grow: 1 !important; /* было flex: 0 0 calc(50% - 5px) */
    }
    /* Главная, заголовок слайдера: межстрочный интервал был меньше шрифта — строки наезжали */
    section.promo .big-slider .item.slider h1 {
        line-height: 1.15 !important;
    }
}

/* Каталог, «Выбор по ёмкости»: кнопки тянутся на ширину ряда, а не прижаты влево */
.catalog-container .main-container .filter.block > .list > a.item {
    flex: 1 1 auto;
    text-align: center;
}

/* Карточка товара, блок цены: мессенджеры — широкие плитки фирменного цвета с белым знаком на всю ширину блока */
.pp-social.pp-social--buy {
    gap: 8px !important;
    padding-left: 0 !important; /* был отступ слева ~22px — ряд не совпадал с краем остального блока */
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.pp-social.pp-social--buy > a.soc.soc.soc {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 40px;
    height: 40px !important;
    display: grid !important;
    place-items: center;
    border-radius: 10px !important;
    background: var(--fl-c) !important;
    transition: filter .15s ease;
}
.pp-social.pp-social--buy > a.soc.soc.soc::before {
    content: '' !important;
    position: static !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    -webkit-mask: var(--fl-mask) center / contain no-repeat !important;
    mask: var(--fl-mask) center / contain no-repeat !important;
}
.pp-social.pp-social--buy > a.soc.soc.soc:hover { filter: brightness(.92); }
.pp-social.pp-social--buy > .soc--tg { --fl-c: #229ed9; --fl-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath d='M34.9 14.2 11.7 23.1c-1.6.6-1.6 1.5-.3 1.9l5.9 1.8 2.3 7c.3.8.5 1.1 1.1 1.1.5 0 .8-.2 1.1-.5l2.8-2.7 5.9 4.3c1.1.6 1.8.3 2.1-1l3.9-18.4c.4-1.6-.6-2.3-1.6-1.9Zm-14.7 13 10.9-6.9c.5-.3 1-.1.6.3l-9.3 8.4-.4 4-1.8-5.8Z'/%3E%3C/svg%3E"); }
.pp-social.pp-social--buy > .soc--vb { --fl-c: #7360f2; --fl-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M24 11.5c-7.4 0-11.5 2.9-11.5 10.2 0 4.2 1.3 6.9 3.6 8.3v5.2l4.1-3.5c1.2.2 2.5.3 3.8.3 7.4 0 11.5-2.9 11.5-10.3S31.4 11.5 24 11.5Z'/%3E%3Cpath d='M25.2 16.6a5.4 5.4 0 0 1 4.9 4.9M25.2 19.4a2.5 2.5 0 0 1 2.1 2.1'/%3E%3C/g%3E%3Cpath d='M18.6 16.9c.4-.3.8-.3 1.1 0l1.7 2c.3.3.3.8 0 1.1l-.8.8c-.2.2-.2.5-.1.8.4.9 1 1.8 1.7 2.5.7.7 1.6 1.3 2.5 1.7.3.1.6.1.8-.1l.8-.8c.3-.3.8-.3 1.1 0l2 1.7c.3.3.3.7 0 1.1-.6.8-1.5 1.5-2.6 1.4-1.8-.2-3.9-1.4-5.6-3.1s-2.9-3.800-3.1-5.6c-.1-1.1.6-2 1.4-2.6Z'/%3E%3C/svg%3E"); }
.pp-social.pp-social--buy > .soc--wa { --fl-c: #25d366; --fl-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linejoin='round' d='M24 12.5a11.5 11.5 0 0 0-9.9 17.3L12.6 35.4l5.7-1.5A11.5 11.5 0 1 0 24 12.5Z'/%3E%3Cpath d='M19.8 18.1c.3-.6.6-.6.9-.6h.7c.2 0 .5 0 .7.6l1 2.3c.1.2.1.5 0 .7l-.6.8c-.2.2-.3.5-.1.8.4.8 1 1.6 1.7 2.2.8.7 1.6 1.2 2.4 1.5.3.1.5 0 .7-.2l.9-1.1c.2-.3.5-.3.8-.2l2.2 1.1c.3.1.5.2.5.4.1.4 0 1.4-.5 2-.6.6-1.6 1.1-2.5 1.1-1.4 0-3.600-.8-5.6-2.6-2.1-1.9-3.4-4.3-3.6-5.4-.2-1.3.2-2.5.4-3.4Z'/%3E%3C/svg%3E"); }
.pp-social.pp-social--buy > .soc--ig { --fl-c: linear-gradient(45deg, #f9a825, #e1306c 45%, #5b51d8); --fl-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.4'%3E%3Crect x='13' y='13' width='22' height='22' rx='6.5'/%3E%3Ccircle cx='24' cy='24' r='5.2'/%3E%3C/g%3E%3Ccircle cx='30.2' cy='17.8' r='1.6'/%3E%3C/svg%3E"); }
.pp-social.pp-social--buy > .soc--mail { --fl-c: #f28c28; --fl-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='11 11 26 26'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.4' stroke-linejoin='round' stroke-linecap='round'%3E%3Crect x='12.5' y='15.5' width='23' height='17' rx='2.5'/%3E%3Cpath d='m13.5 17.5 10.5 8 10.5-8'/%3E%3C/g%3E%3C/svg%3E"); }

/* End */


/* Start:/local/templates/akumulyator_template/css/mini-panel.css?17936541306323*/
/*
 * Окно «Корзина» / «Избранное» по клику на значок в шапке (js/mini-panel.js, HTML — local/ajax/mini.php).
 * Компьютер и планшет: окно под значком, справа по его краю. Телефон (до 767): шторка снизу во всю ширину.
 * Анимируются только opacity и transform.
 */
.mini-panel {
    position: fixed;
    z-index: 9990;
    display: flex;
    flex-direction: column;
    width: 380px;
    max-width: calc(100vw - 16px);
    max-height: min(560px, calc(100dvh - 140px));
    box-sizing: border-box;
    border: 1px solid #e6e3da;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(31, 27, 32, .18), 0 2px 6px rgba(31, 27, 32, .06);
    font-family: Inter, Arial, sans-serif;
    color: #1f1b20;
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity .16s ease-out, transform .16s ease-out;
}
.mini-panel.is-open {
    opacity: 1;
    transform: none;
}
.mini-panel[hidden] {
    display: none;
}

.mini-panel__head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 14px 52px 12px 16px;
    border-bottom: 1px solid #e6e3da;
    position: relative;
}
.mini-panel__head b {
    font-size: 17px;
    font-weight: 700;
}
.mini-panel__head span {
    font-size: 13px;
    color: #6b6870;
}
.mini-panel__close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #f6f5f0;
    cursor: pointer;
}
.mini-panel__close::before,
.mini-panel__close::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 2px;
    margin: -1px 0 0 -7px;
    border-radius: 1px;
    background: #1f1b20;
    transform: rotate(45deg);
}
.mini-panel__close::after {
    transform: rotate(-45deg);
}

.mini-panel__list {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0;
    padding: 6px 8px;
    list-style: none;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.mini-panel__item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 10px;
}
.mini-panel__item + .mini-panel__item {
    border-top: 1px solid #f0eee8;
}
.mini-panel__img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 8px;
    background: #f6f5f0;
    overflow: hidden;
}
.mini-panel__img img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.mini-panel__info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.mini-panel__name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    color: #1f1b20;
    text-decoration: none;
}
.mini-panel__name:hover {
    color: #bb1303;
}
.mini-panel__meta {
    font-size: 12px;
    line-height: 16px;
    color: #6b6870;
}
.mini-panel__price {
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

.mini-panel__foot {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 16px 16px;
    border-top: 1px solid #e6e3da;
}
.mini-panel__total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 15px;
}
.mini-panel__total b {
    font-size: 19px;
}
.mini-panel__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    border-radius: 10px;
    background: #ffd633;
    font-size: 15px;
    font-weight: 700;
    color: #1f1b20 !important;
    text-decoration: none;
    transition: background-color .15s ease;
}
.mini-panel__btn:hover {
    background: #ffce05;
}
.mini-panel__empty,
.mini-panel__loading {
    margin: 0;
    padding: 28px 16px;
    text-align: center;
    font-size: 15px;
    color: #6b6870;
}
.mini-panel__close:focus-visible,
.mini-panel__btn:focus-visible,
.mini-panel__name:focus-visible {
    outline: 2px solid #1f1b20;
    outline-offset: 2px;
}

/* Телефон: шторка снизу, как всплывающие окна (css/popups.css); нижняя полоса со звонком прячется */
@media screen and (max-width: 767px) {
    .mini-panel {
        top: auto !important;
        right: 0 !important;
        bottom: 0;
        left: 0;
        width: 100%;
        max-width: none;
        max-height: 85dvh;
        padding-bottom: env(safe-area-inset-bottom);
        border: 0;
        border-radius: 20px 20px 0 0;
        box-shadow: 0 -10px 40px rgba(31, 27, 32, .2), 0 -1px 0 #e6e3da;
        opacity: 1;
        transform: translateY(100%);
        transition: transform .26s cubic-bezier(.2, .8, .2, 1);
    }
    .mini-panel.is-open {
        transform: none;
    }
    .mini-panel__head {
        padding-top: 22px;
    }
    /* ручка сверху — как у шторок окон */
    .mini-panel__head::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        width: 40px;
        height: 4px;
        margin-left: -20px;
        border-radius: 2px;
        background: #d9d6cd;
    }
    .mini-panel__close {
        top: 14px;
        right: 14px;
        width: 40px;
        height: 40px;
    }
    .mini-panel__btn {
        height: 50px;
        font-size: 16px;
    }
    /* фон под шторкой слегка затемнён и не прокручивается; касание по нему закрывает окно (js/mini-panel.js) */
    html.mini-panel-open,
    html.mini-panel-open body {
        overflow: hidden !important;
    }
    html.mini-panel-open body::after {
        content: '';
        position: fixed;
        inset: 0;
        z-index: 9989;
        background: rgba(31, 27, 32, .35);
        touch-action: none;
    }
    .mini-panel__list {
        touch-action: pan-y;
    }
    html.mini-panel-open body .mobile-menu {
        transform: translateY(calc(100% + 24px + env(safe-area-inset-bottom, 0px)));
    }
}

@media (prefers-reduced-motion: reduce) {
    .mini-panel {
        transition: none !important;
    }
}

/* End */


/* Start:/local/templates/akumulyator_template/css/fixes.css?179405334520085*/
/*
 * fixes.css — правки по аудиту адаптивной вёрстки (2026-11-01).
 * Подключать ПОСЛЕДНИМ (после mini-panel.css) в IncludeFiles::includeCss,
 * либо разнести блоки по указанным файлам-источникам.
 * Только вёрстка, тексты не тронуты.
 */

/* ================= ВСЕ СТРАНИЦЫ: шапка ================= */

/* [1] Альбомная ориентация телефона (667×375, 844×390, 932×430): закреплённая шапка занимала
   28–39% высоты экрана (+ нижняя полоса 56px на 667) — для контента оставалось ~200px.
   На низких экранах шапка остаётся вверху страницы и уезжает при прокрутке.
   Отступ main под шапку не меняется (он рассчитан на ту же высоту), позвонить можно из нижней полосы (<768)
   или вернувшись наверх. Источник: css/header.css. */
@media screen and (orientation: landscape) and (max-height: 500px) {
    html body header {
        position: absolute !important;
        overflow-x: clip; /* бегущая строка .top шире экрана на ~20px: у fixed это было незаметно, у absolute дало бы горизонтальную прокрутку */
    }
}

/* [1a] Там же (низкий экран, телефон в альбомной): в открытом меню «Каталог» шапка меню (114px) и закреплённый
   низ «Заказать звонок + мессенджеры» (180px) оставляли списку пунктов 81px из 375 — виден один пункт.
   На низких экранах прокручивается всё меню целиком. Источник: css/menu.css (.catalog-menu .window-body). */
@media screen and (orientation: landscape) and (max-height: 500px) and (max-width: 767.98px) {
    header .catalog-menu .window-body {
        overflow-y: auto !important;
        overscroll-behavior: contain;
    }
    header .catalog-menu .window-body > .tabs {
        flex: 0 0 auto !important;
        overflow: visible !important;
    }
}

/* [2] ПК (≥1280): у кнопки «Заказать звонок» в шапке середина не нажималась — поверх кнопки лежит
   контейнер значков мессенджеров .hd-contacts__soc, клик в промежутки между значками попадал в него,
   и окно не открывалось. Пропускаем клики сквозь контейнер, сами значки остаются ссылками.
   Источник: css/header.css. */
header .order-call .hd-contacts__soc {
    pointer-events: none;
}
header .order-call .hd-contacts__soc a {
    pointer-events: auto;
}

/* [3] Телефон: значок корзины в шапке — зона нажатия 25×20 px. Расширяем невидимой областью
   до ~41×40 без сдвига вёрстки (::after у a.cart свободен). Источник: css/header.css. */
@media screen and (max-width: 767px) {
    header .btns a.cart::after {
        content: '';
        position: absolute;
        inset: -10px -8px;
    }
}

/* ================= ВСЕ СТРАНИЦЫ: карточки товаров ================= */

/* [4] Тач: «сердечко» на карточке — 28×28. Расширяем зону нажатия до 40×40 (::after свободен).
   Источник: css/card-compact.css / catalog-cards.css. */
@media (hover: none) and (pointer: coarse) {
    .goods-snippet button.favorite::after {
        content: '';
        position: absolute;
        inset: -6px;
    }
}

/* ================= ВСЕ СТРАНИЦЫ: хлебные крошки ================= */

/* [5] Телефон: последняя крошка (название страницы) в одну строку с overflow:auto обрезалась
   посреди буквы («что вы…» без многоточия) — видно на статье /news/populyarnye-akkumulyatory-2026/.
   Добавляем многоточие. Источник: css/style.css (.promo-block .bubbles). */
.promo-block .bubbles > p {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ================= /catalog/hity-prodazh/ и статья /news/populyarnye-akkumulyatory-2026/ ================= */

/* [6] Телефон (<600): лента брендов .hp-brands шире экрана на 12px (margin 0 -16px при отступе
   страницы 10px) → горизонтальная прокрутка всей страницы на 320–430. Подгоняем вынос под поле main.
   Источник: css/info-pages.css (блок «телефон: бренды — горизонтальная лента»). */
@media screen and (max-width: 599.98px) {
    .hp-brands {
        margin-left: -10px;
        margin-right: -10px;
        padding-left: 10px;
        padding-right: 10px;
        scroll-padding-inline: 10px;
    }
}

/* ================= /delivery/ ================= */

/* [7] 320–479: переключатель «Доставка | Самовывоз» (по 164 и 177px с полями 42px) шире экрана —
   «Самовывоз» уходит за правый край на 40px, появляется горизонтальная прокрутка.
   Делим ширину поровну (на телефоне у кнопок зазор 8px, без нахлёста). Источник: css/delivery.css. */
@media screen and (max-width: 479.98px) {
    main.diagnostics section.first .block:nth-child(2) > .bottom:has(> a[href="#pickup"]) {
        width: 100%;
    }
    main.diagnostics section.first .block:nth-child(2) > .bottom:has(> a[href="#pickup"]) > a {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
        padding-left: 8px;
        padding-right: 8px;
    }
}

/* [8] Планшет 1024 (и около): в жёлтой плашке под фото «AKKUMULYATOR.by | +375 (29) 266 55 66»
   номер не помещается и обрезается на последней цифре. Разрешаем перенос второй ссылки на новую строку.
   Источник: css/delivery.css. */
main.diagnostics section.first .block .bottom:has(> a[href^="tel:"]) {
    flex-wrap: wrap;
    row-gap: 6px;
}

/* ================= Страницы услуг (/services/…/) ================= */

/* [9] 320–479: в таблице «Стоимость услуг» колонка цены 26% (73px на 320) — «БЕСПЛАТНО» не влезает
   и обрезается краем таблицы (overflow:hidden у .items). Только таблицы с шапкой «Виды работ | Цены»
   (у таблицы доставки шапки нет и колонки другие). Источник: css/services.css. */
@media screen and (max-width: 479.98px) {
    section.first .block > .items:has(> .item.top) > .item:not(.bottom) {
        grid-template-columns: minmax(0, 1fr) 36%;
    }
    section.first .block > .items:has(> .item.top) > .item:not(.bottom) > p:last-child {
        padding-left: 8px;
    }
}

/* ================= Статьи (/news/…/) ================= */

/* [10] Телефон: дата у новостей в колонке «Последние новости» — font-size: 2px (опечатка,
   видна точка вместо даты). Источник: css/news-page.css, @media (max-width:767px) .last-news .item .date. */
@media screen and (max-width: 767px) {
    .news-content .last-news .items .item .date {
        font-size: 12px;
    }
}

/* ================= Главная ================= */

/* [11] Телефон: мелкий текст 10–11px в плитках подбора и блоке «Почему мы» → 12px. */
@media screen and (max-width: 767px) {
    .selection-block .items.wrapper > .item > p,                 /* «Ампер час» */
    .why-choose .items > .item > p,                              /* «АККУМУЛЯТОРЫ НАПРЯМУЮ С ЗАВОДА» */
    .why-choose .slider .slide > div > span {                    /* «415 отзывов» */
        font-size: 12px;
    }
}
/* [12] 1280–1439: подпись «415 отзывов» 10px и наезжает на цифру рейтинга (главная и /about/). */
@media screen and (min-width: 1280px) and (max-width: 1439.98px) {
    .why-choose .slider .slide > div > span,
    .reviews-slider .slides .slide > div > span {
        margin-top: 4px;
        font-size: 12px;
    }
}

/* ================= Каталог (разделы, бренды) ================= */

/* [13] <1280: закрытая панель фильтров стоит за левым краем (left:-400px), но остаётся видимой для фокуса —
   Tab с клавиатуры уходит в невидимые поля фильтра. Скрываем закрытую панель после анимации (0.4s),
   открытая (.show, js/catalog.js) показывается сразу. Источник: css/catalog-filter.css. */
@media screen and (max-width: 1279.98px) {
    .catalog-container aside:not(.show) {
        visibility: hidden;
        transition: all .4s, visibility 0s linear .4s;
    }
    .catalog-container aside.show {
        visibility: visible;
    }
}

/* «Каталог» в шапке — теперь <button> (header.php): убираем системный вид кнопки;
   на телефоне вид задают правила «html header .container .center .burger» (css/header.css) */
header .center button.burger {
    -webkit-appearance: none;
    appearance: none;
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

/* ==========================================================================
   2026-11-06: кнопки «ЕЩЁ» / «СКРЫТЬ» везде одинаковые — жёлтый фон, при наведении темнее (07.11, по просьбе заказчика)
   (бренды и марки на главной, «Выбрать по бренду» в каталоге, фильтр, мегаменю)
   ========================================================================== */
html body .selection-block.brands .items .item.more,
html body .selection-block.brands .items .item.less-tile,
html body .sublist .list .item.more,
html body .catalog-container .block.choose-brand .icon-list .item.more,
html body .catalog-container .block.choose-brand .icon-list .item.hide {
    background: #ffd633 !important;
    background-image: none !important;
    border: 1px solid #ffd633 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background-color .15s ease, border-color .15s ease !important;
}
html body .selection-block.brands .items .item.more::before,
html body .selection-block.brands .items .item.more::after,
html body .selection-block.brands .items .item.less-tile::before,
html body .selection-block.brands .items .item.less-tile::after,
html body .sublist .list .item.more::before,
html body .sublist .list .item.more::after,
html body .catalog-container .block.choose-brand .icon-list .item.more::before,
html body .catalog-container .block.choose-brand .icon-list .item.more::after,
html body .catalog-container .block.choose-brand .icon-list .item.hide::before,
html body .catalog-container .block.choose-brand .icon-list .item.hide::after { display: none !important; }
html body .selection-block.brands .items .item.more span,
html body .selection-block.brands .items .item.less-tile span,
html body .sublist .list .item.more span,
html body .catalog-container .block.choose-brand .icon-list .item.more a,
html body .catalog-container .block.choose-brand .icon-list .item.hide a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    color: #1f1b20 !important;
    background: none !important;
    font: 700 14px/1.1 Inter, sans-serif !important;
    font-style: normal !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    -webkit-text-fill-color: #1f1b20 !important;
}
html body .selection-block.brands .items .item.more:hover,
html body .selection-block.brands .items .item.less-tile:hover,
html body .sublist .list .item.more:hover,
html body .catalog-container .block.choose-brand .icon-list .item.more:hover,
html body .catalog-container .block.choose-brand .icon-list .item.hide:hover {
    background: #f5c400 !important;
    border-color: #f5c400 !important;
}
html body .selection-block.brands .items .item.more:hover span,
html body .selection-block.brands .items .item.less-tile:hover span,
html body .sublist .list .item.more:hover span,
html body .catalog-container .block.choose-brand .icon-list .item.more:hover a,
html body .catalog-container .block.choose-brand .icon-list .item.hide:hover a {
    color: #1f1b20 !important;
    -webkit-text-fill-color: #1f1b20 !important;
}

/* кнопки-строки: «Показать ещё / Скрыть» под брендами, «Еще / Свернуть» в фильтре */
html body .selection-block .show-more,
html body .selection-block .show-less,
html body .smartfilter .toggle-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px !important;
    padding: 0 20px !important;
    background: #ffd633 !important;
    background-image: none !important;
    border: 1.5px solid #ffd633 !important;
    border-radius: 10px !important;
    color: #1f1b20 !important;
    font: 700 13px/1.1 Inter, sans-serif !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background-color .15s ease !important;
}
html body .smartfilter .toggle-all span { font: inherit !important; color: inherit !important; text-transform: inherit !important; }
html body .selection-block .show-more::before, html body .selection-block .show-more::after,
html body .selection-block .show-less::before, html body .selection-block .show-less::after,
html body .smartfilter .toggle-all::before, html body .smartfilter .toggle-all::after { display: none !important; }
html body .selection-block .show-more:hover,
html body .selection-block .show-less:hover,
html body .smartfilter .toggle-all:hover { background: #f5c400 !important; border-color: #f5c400 !important; color: #1f1b20 !important; }

/* мегаменю: «Еще / Скрыть» в списках брендов и ёмкостей */
html body header .catalog-menu .chapter .links span.more,
html body header .catalog-menu .chapter .links span.hide {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    margin-top: 4px !important;
    padding: 6px 14px !important;
    background: #ffd633 !important;
    border: 1px solid #ffd633 !important;
    border-radius: 8px !important;
    color: #1f1b20 !important;
    font: 700 12px/1.2 Inter, sans-serif !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background-color .15s ease !important;
}
html body header .catalog-menu .chapter .links span.more:hover,
html body header .catalog-menu .chapter .links span.hide:hover { background: #f5c400 !important; border-color: #f5c400 !important; color: #1f1b20 !important; }

/* 07.11: «ЕЩЁ / Скрыть» в подборе по авто (марки, модели) — жёлтые, как остальные кнопки «ещё» (было чёрное, css/vehicle-finder.css) */
html body .selection-mark .step .list .item.more,
html body .selection-mark .step.mark .list[data-vehicle-brands] .item.more,
html body .selection-mark .step .list .show-less {
    background: #ffd633 !important;
    background-image: none !important;
    border-color: #ffd633 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background-color .15s ease, border-color .15s ease !important;
}
html body .selection-mark .step .list .item.more span,
html body .selection-mark .step.mark .list[data-vehicle-brands] .item.more span,
html body .selection-mark .step .list .show-less,
html body .selection-mark .step .list .show-less span {
    color: #1f1b20 !important;
    -webkit-text-fill-color: #1f1b20 !important;
}
html body .selection-mark .step .list .item.more:hover,
html body .selection-mark .step.mark .list[data-vehicle-brands] .item.more:hover,
html body .selection-mark .step .list .show-less:hover {
    background: #f5c400 !important;
    border-color: #f5c400 !important;
}
html body .selection-mark .step .list .item.more:hover span,
html body .selection-mark .step.mark .list[data-vehicle-brands] .item.more:hover span { color: #1f1b20 !important; }

/* 07.11: в фильтре каталога «Ещё / Свернуть» — без жёлтого фона (по просьбе заказчика: жёлтые все, кроме фильтра) */
html body .smartfilter .toggle-all {
    background: transparent !important;
    border-color: #1f1b20 !important;
}
html body .smartfilter .toggle-all:hover {
    background: #ffd633 !important;
    border-color: #ffd633 !important;
}

/* 07.11: ошибки заполнения форм — текст ВНУТРИ самого поля (js/form-validate.js), без всплывающих подсказок браузера */
html body .f-invalid:not([type="checkbox"]):not([type="radio"]),
html body .f-invalid-wrap {
    border-color: #d4121a !important;
    box-shadow: 0 0 0 1px #d4121a inset !important;
    background-color: #fff4f4 !important;
}
html body .f-invalid-wrap > .f-invalid { box-shadow: none !important; background-color: transparent !important; }
html body .f-inerr-on::placeholder { color: transparent !important; -webkit-text-fill-color: transparent !important; opacity: 0 !important; }
html body select.f-inerr-on { color: transparent !important; }
html body .f-inerr {
    position: absolute !important;
    z-index: 5;
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    color: #d4121a !important;
    -webkit-text-fill-color: #d4121a !important;
    text-align: left !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    width: auto !important;
    height: auto !important;
}
html body .f-inerr[hidden] { display: none !important; }
html body .f-inerr--area { white-space: normal; }
html body .f-inerr--end { font-weight: 600 !important; }
html body .f-invalid-check,
html body .f-invalid-check span,
html body .f-invalid-check a { color: #d4121a !important; }
html body .f-invalid-check input[type="checkbox"] { outline: 2px solid #d4121a !important; outline-offset: 1px; }
html body .f-cherr { font: inherit !important; font-weight: 700 !important; color: #d4121a !important; -webkit-text-fill-color: #d4121a !important; }
html body .akum-form-errors,
html body .akum-form-errors * { color: #c8102e !important; -webkit-text-fill-color: #c8102e !important; }
html body .akum-form-errors { background: #fdecec !important; border: 1px solid #f3b6b6 !important; font-weight: 600 !important; }

/* End */


/* Start:/local/templates/akumulyator_template/components/bitrix/search.title/akum/style.css?17876003271991*/
.title-search-result {
    display: none;
    overflow: hidden;
    z-index: 1100;
    background: var(--constraction-color, #fff);
    border: 1px solid var(--border-color, #d2d2d2);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.akum-title-search {
    display: flex;
    flex-direction: column;
    max-height: min(420px, 60vh);
    overflow: auto;
}

.akum-title-search__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    text-decoration: none;
    border-bottom: 1px solid var(--border-color, #d2d2d2);
    transition: background-color .2s linear;
}

.akum-title-search__item:hover,
.akum-title-search__more:hover,
.akum-title-search__all:hover {
    background: var(--text-bg, #ededed);
}

.akum-title-search__image {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    overflow: hidden;
    background: var(--text-bg, #ededed);
    border-radius: 6px;
}

.akum-title-search__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.akum-title-search__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.akum-title-search__name {
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    color: var(--text, #252525);
}

.akum-title-search__price {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.akum-title-search__price-current {
    font-size: 14px;
    font-weight: 700;
    color: var(--important-info, #bb1303);
}

.akum-title-search__price-old {
    font-size: 12px;
    color: var(--text-light, #6e6e6e);
    text-decoration: line-through;
}

.akum-title-search__more,
.akum-title-search__all {
    display: block;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    color: var(--text-nav, #000);
    text-decoration: none;
}

.akum-title-search__all {
    color: var(--important-info, #bb1303);
}

/* End */


/* Start:/local/templates/akumulyator_template/template_styles.css?17852719069089*/
.bx-yellow,
.bx-theme-yellow {
	--primary: #f9a91d;
	--theme-color-primary: #f9a91d;
	--theme-color-second: #faba4a;
	--theme-color-light: #fff;
	--theme-b-link: #f9a91d;
	--theme-b-link-hover: #faba4a;
	--theme-b-tx-primary: #fff;
	--theme-b-bg-primary: #f9a91d;
	--theme-b-bd-primary: #f9a91d;
	--theme-b-sd-primary: rgba(249, 169, 29, 0.5);
	--theme-b-tx-primary-hover: #fff;
	--theme-b-bg-primary-hover: #faba4a;
	--theme-b-bd-primary-hover: #daa53e;
	--theme-b-tx-primary-active: #fff;
	--theme-b-bg-primary-active: #faba4a;
	--theme-b-bd-primary-active: #daa53e;
	--theme-b-tx-primary-disabled: #fff;
	--theme-b-bg-primary-disabled: #daa53e;
	--theme-b-bd-primary-disabled: #b7853b;
}

.bx-blue,
.bx-theme-blue {
	--primary: #0083d1;
	--theme-color-primary: #0083d1;
	--theme-color-second: #5ca6e4;
	--theme-color-light: #f0f6f8;
	--theme-b-link: #44b1c9;
	--theme-b-link-hover: #5cc3d1;
	--theme-b-tx-primary: #fff;
	--theme-b-bg-primary: #0083d1;
	--theme-b-bd-primary: #0083d1;
	--theme-b-sd-primary: rgba(0, 131, 209, 0.5);
	--theme-b-tx-primary-hover: #fff;
	--theme-b-bg-primary-hover: #5ca6e4;
	--theme-b-bd-primary-hover: #5599d2;
	--theme-b-tx-primary-active: #fff;
	--theme-b-bg-primary-active: #5ca6e4;
	--theme-b-bd-primary-active: #5599d2;
	--theme-b-tx-primary-disabled: #fff;
	--theme-b-bg-primary-disabled: #5599d2;
	--theme-b-bd-primary-disabled: #4d8bbf;
}

.bx-red,
.bx-theme-red {
	--primary: #e22b2b;
	--theme-color-primary: #e22b2b;
	--theme-color-second: #e95c5c;
	--theme-color-light: #f0f0f0;
	--theme-b-link: #e22b2b;
	--theme-b-link-hover: #e95c5c;
	--theme-b-tx-primary: #fff;
	--theme-b-bg-primary: #e22b2b;
	--theme-b-bd-primary: #e22b2b;
	--theme-b-sd-primary: rgba(226, 43, 43, 0.5);
	--theme-b-tx-primary-hover: #fff;
	--theme-b-bg-primary-hover: #e95c5c;
	--theme-b-bd-primary-hover: #d05454;
	--theme-b-tx-primary-active: #fff;
	--theme-b-bg-primary-active: #e95c5c;
	--theme-b-bd-primary-active: #d05454;
	--theme-b-tx-primary-disabled: #fff;
	--theme-b-bg-primary-disabled: #d05454;
	--theme-b-bd-primary-disabled: #c04e4e;
}

.bx-green,
.bx-theme-green {
	--primary: #63aa28;
	--theme-color-primary: #63aa28;
	--theme-color-second: #5b9f0b;
	--theme-color-light: #a8d95b;
	--theme-b-link: #44b1c9;
	--theme-b-link-hover: #5cc3d1;
	--theme-b-tx-primary: #fff;
	--theme-b-bg-primary: #63aa28;
	--theme-b-bd-primary: #63aa28;
	--theme-b-sd-primary: rgba(99, 170, 40, 0.5);
	--theme-b-tx-primary-hover: #fff;
	--theme-b-bg-primary-hover: #5b9f0b;
	--theme-b-bd-primary-hover: #56940b;
	--theme-b-tx-primary-active: #fff;
	--theme-b-bg-primary-active: #5b9f0b;
	--theme-b-bd-primary-active: #56940b;
	--theme-b-tx-primary-disabled: #fff;
	--theme-b-bg-primary-disabled: #56940b;
	--theme-b-bd-primary-disabled: #497c09;
}

body {
	background-attachment: fixed;
	background-size: cover;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#pagetitle { margin-bottom: 35px; }

h1,h2,h3,h4,h5 {
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-regular, 400);
}

.bx-content-section,
.bx-header-section {
	padding-bottom: 2px;
	background-color: rgba(255, 255, 255, .95);
}

.bx-wrapper { }

.bx-header { }

.bx-header-section { }

.bx-header-logo { order: 1 }

.bx-header-personal { order: 3 }

.bx-header-contact { order: 2 }

.bx-logo-block {
	display: block;
	height: 50px;
	border-bottom: none;
}

.bx-logo-block img {
	max-height: 50px;
	width: auto;
}

@media (max-width: 767px) {
	.bx-logo-block img {
		max-width: 100%;
		max-height: 45px;
		width: auto;
		height: auto;
	}

	.bx-header-logo {
		padding: 5px 50px;
		height: 55px;
		background-color: var(--theme-color-primary);
	}

	.bx-logo-block { height: auto; }

	body.bx-theme-green .bx-store-logo { background: #33b111; }
}

.bx-header-phone-block {
	display: flex;
	align-items: center;
}

.bx-header-phone-number {
	color: #000;
	white-space: nowrap;
	font: 21px/28px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold, 600);
	transition: 250ms linear all;
}

.bx-header-phone-icon {
	display: block;
	margin-right: 10px;
	width: 26px;
	height: 26px;
	background: no-repeat center url(/local/templates/akumulyator_template/images/phone.svg);
}

@media (max-width: 991px) {
	.bx-header-phone-number {
		font: 15px/18px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
		font-weight: var(--ui-font-weight-semi-bold, 600);
	}
}

.bx-header-worktime {
	color: #000;
	font: 16px/22px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold, 600);
	transition: 250ms linear all;
}

.bx-worktime-title {
	color: #adadad;
	font: 12px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-regular, 400);
}

.bx-worktime-schedule {
	color: #000;
	font: 12px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-regular, 400);
}

@media (max-width: 991px) {
	.bx-header-worktime {
		font: 15px/18px var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
		font-weight: var(--ui-font-weight-regular, 400);
	}
}

.sidebar-block-title {
	color: #343434;
	text-transform: uppercase;
	font-size: 14px;
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold, 600);
}

.bx-footer { }

.bx-footer-section { }

.bx-footer-section .bx-block-title { }

.bx-footer-bg { background-color: #1f496a; }

.bx-footer-logo {
	border-bottom: none !important;
	text-decoration: none !important;
}

.bx-footer-logo img {
	max-width: 100%;
	height: auto;
}

.bx-inclinkspersonal-item.bx-theme-blue:hover { background: #0083d1; }

.bx-theme-blue.bx-inclinkspersonal-selected { background: #3398d7; }

.bx-inclinkspersonal-item.bx-theme-black:hover { background: #303030; }

.bx-theme-black.bx-inclinkspersonal-selected { background: #484848; }

.bx-inclinkspersonal-item.bx-theme-green:hover { background: #44b1c9; }

.bx-theme-green.bx-inclinkspersonal-selected { background: #5cc3d1; }

.bx-inclinkspersonal-item.bx-theme-red:hover { background: #e63c3c; }

.bx-theme-red.bx-inclinkspersonal-selected { background: #e95c5c; }

.bx-inclinkspersonal-item.bx-theme-yellow:hover { background: #f4a52e; }

.bx-theme-yellow.bx-inclinkspersonal-selected { background: #fbb859; }

.btn-primary,
.list-group-item.active {
	border-color: var(--theme-b-bd-primary);
	background-color: var(--theme-b-bg-primary);
	color: var(--theme-b-tx-primary);
}

.btn-primary:hover {
	border-color: var(--theme-b-bd-primary-hover);
	background-color: var(--theme-b-bg-primary-hover);
	color: var(--theme-b-tx-primary-hover);
}

.btn-primary:focus,
.btn-primary.focus {
	box-shadow: 0 0 0 0.2rem var(--theme-b-sd-primary);
}

.btn-primary.disabled,
.btn-primary:disabled {
	border-color: var(--theme-b-bg-primary);
	background-color: var(--theme-b-bg-primary);
	color: var(--theme-b-tx-primary);
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
	border-color: var(--theme-b-bd-primary-active);
	background-color: var(--theme-b-bg-primary-active);
	color: var(--theme-b-tx-primary-active);
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem var(--theme-b-sd-primary);
}

.form-control:focus {
	border-color: var(--theme-color-primary);
	box-shadow: 0 0 0 0.2rem var(--theme-b-sd-primary);
}

a,
.btn-link { color: #252525; }

a:hover,
.btn-link:hover { color: #252525; }

.g-font-size-15 { font-size: 15px; }

.g-font-size-17 { font-size: 17px; }

.g-font-size-20 { font-size: 20px; }

.text-primary { color: var(--primary) !important }

.bg-primary { background: var(--primary) !important }

.border-primary { border-color: var(--primary) !important }

.bx-sidebar-block { }

.sidebar h2,
.sidebar h3,
.sidebar h4,
.sidebar h5 {
	text-transform: uppercase;
	font-size: 14px;
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold, 600);
}

.sidebar li {
	font-size: 12px;
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold, 600);
}

.sidebar-icon {
	width: 27px;
	height: 27px;
	margin-right: 5px;
	border-radius:50%;
	background-color: var(--theme-color-primary);
	background-repeat: no-repeat;
	background-position: center;
}

.sidebar-icon-label {
	background-image:  url(/local/templates/akumulyator_template/images/label.svg);
	background-size: 19px auto;
}

.sidebar-icon-delivery {
	background-image: url(/local/templates/akumulyator_template/images/delivery.svg);
	background-size: 17px auto;
}

.sidebar-icon-sale {
	background-image: url(/local/templates/akumulyator_template/images/sale.svg);
	background-size: auto 17px ;
}

.sidebar-icon-self {
	background-image: url(/local/templates/akumulyator_template/images/self.svg);
	background-size: auto 17px ;
}

.sidebar-icon-phone {
	background-image: url(/local/templates/akumulyator_template/images/phone_white.svg);
	background-size: auto 21px ;
}
/* End */
/* /local/templates/akumulyator_template/css/style.css?1793654130191576 */
/* /local/templates/akumulyator_template/css/catalog-cards.css?179408147714547 */
/* /local/templates/akumulyator_template/css/responsive.css?17931952878256 */
/* /local/templates/akumulyator_template/front/style.css?1793654130122892 */
/* /local/templates/akumulyator_template/css/card-compact.css?179403911318857 */
/* /local/templates/akumulyator_template/css/catalog-filter.css?179397274022709 */
/* /local/templates/akumulyator_template/css/info-pages.css?179403315222570 */
/* /local/templates/akumulyator_template/css/footer.css?179407548513002 */
/* /local/templates/akumulyator_template/css/social-icons.css?17932019463168 */
/* /local/templates/akumulyator_template/css/header.css?179365413075362 */
/* /local/templates/akumulyator_template/css/menu.css?179389384555612 */
/* /local/templates/akumulyator_template/css/popups.css?17938068587832 */
/* /local/templates/akumulyator_template/css/mobile-bar.css?179365413011231 */
/* /local/templates/akumulyator_template/css/fluid.css?17936541306198 */
/* /local/templates/akumulyator_template/css/mini-panel.css?17936541306323 */
/* /local/templates/akumulyator_template/css/fixes.css?179405334520085 */
/* /local/templates/akumulyator_template/components/bitrix/search.title/akum/style.css?17876003271991 */
/* /local/templates/akumulyator_template/template_styles.css?17852719069089 */