/* ===== shrifty.css ===== */
/* Шрифты Onest, JetBrains Mono, Michroma, Material Symbols Rounded.
   Перенесены из дизайна вместе с поддиапазонами — лишние подмножества не грузятся. */
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-3.woff2") format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-4.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-5.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/jetbrains-mono-6.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-3.woff2") format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-4.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-5.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/jetbrains-mono-6.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Michroma'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/michroma-1.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Michroma'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/michroma-2.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-3.woff2") format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-4.woff2") format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-5.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-6.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap; src: url("../shrifty/onest-7.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-3.woff2") format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-4.woff2") format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-5.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-6.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap; src: url("../shrifty/onest-7.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-3.woff2") format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-4.woff2") format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-5.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-6.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap; src: url("../shrifty/onest-7.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-3.woff2") format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-4.woff2") format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-5.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-6.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap; src: url("../shrifty/onest-7.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-1.woff2") format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-2.woff2") format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-3.woff2") format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-4.woff2") format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-5.woff2") format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-6.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 800; font-display: swap; src: url("../shrifty/onest-7.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Material Symbols Rounded'; font-style: normal; font-weight: 300 500; font-display: block; src: url("../shrifty/material-symbols-rounded-1.woff2") format('woff2');
}


/* ===== tokens.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Переменные оформления Heat Climate.
   Цифры взяты замером из файла дизайна, а не на глаз.

   Три цвета по слову владельца:
     1) золотой  #C99A3B — главный, он же цвет логотипа;
     2) тёмно-синий      — второй: кнопки и тёмные полотна (в дизайне тут был
        чёрный #16171B; синий задаётся в админ-панели, «Внешний вид → Настройки»);
     3) чёрный   #16171B — третий: цвет текста.
   ────────────────────────────────────────────────────────────────────────── */
:root{
  /* ── главные ── */
  --zol:#C99A3B;            /* золото логотипа: 68 обращений в дизайне */
  --zol-tmn:#8F6A1E;        /* тёмное золото: наведение, ссылки */
  --zol-svt:#D9AE55;        /* светлое золото: подсветка */
  --zol-glb:#6A4C14;        /* глубокое золото: текст на золоте */
  --chern:#16171B;          /* чёрный — текст */
  --sin:#13294B;            /* тёмно-синий — кнопки и тёмные полотна */
  --sin-tmn:#0E1F39;        /* синий при нажатии */
  --sin-svt:#1B3155;        /* синий, полотно светлее */
  --sin-ram:#22395E;        /* рамки внутри тёмного */
  --sin-ram2:#2C476E;       /* рамки посветлее */

  /* ── текст ── */
  --tekst:#16171B;
  --tekst-2:#6B6A63;        /* вторичный: 125 обращений */
  --tekst-3:#8A887F;        /* третичный: 30 */
  --tekst-4:#8F8D84;
  --tekst-5:#9A988F;
  --tekst-tmn:#F5F3EF;      /* текст на тёмном */
  --tekst-tmn2:#CFCDC4;

  /* ── полотна ── */
  --bel:#FFFFFF;
  --fon:#F5F3EF;            /* тёплый фон страницы */
  --fon-2:#F1EEE8;
  --fon-3:#F0EEE8;
  --fon-4:#F6F3EE;
  --fon-5:#FAF9F6;
  --fon-6:#EFECE6;
  --zagl:#DAD7CD;           /* место под картинку */

  /* ── рамки ── */
  --ram:#E8E4DC;            /* основная: 108 обращений */
  --ram-2:#E0DDD3;
  --ram-3:#D9D6CC;
  --ram-4:#C9C6BC;
  --ram-5:#B9B6AC;
  --ram-6:#B4B1AA;
  --ram-7:#D8D3C9;

  /* ── смысловые ── */
  --zel:#1E7A45;            /* в наличии */
  --zel-fon:#E3F4EA;
  --zel-svt:#2E9E5B;
  --kras:#C23A1F;           /* нет / ошибка */
  --kras-2:#D93A2B;
  --kras-fon:#FDE8E4;
  --zol-fon:#F5EBD6;        /* плашка статуса */
  --zol-fon2:#EFE7D7;
  --zol-fon3:#F8F2E4;
  --sinij-ssl:#1F7FBF;      /* служебная ссылка */

  /* ── скругления ── */
  --r-xs:7px; --r-s:10px; --r-m:12px; --r-14:14px; --r-16:16px;
  --r-20:20px; --r-22:22px; --r-24:24px; --r-28:28px; --r-kr:999px;

  /* ── шрифты ── */
  --sh:'Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
  --sh-cif:'JetBrains Mono',ui-monospace,monospace;
  --sh-log:'Michroma',var(--sh);

  /* ── сетка ── */
  --shir:1440px;            /* полотно дизайна */
  --pad:40px;               /* отступ по краям на ПК */
  --sec:72px;               /* вертикальный шаг разделов */
  --ten:0 1px 2px rgba(22,23,27,.04);
  --ten-k:0 8px 28px rgba(22,23,27,.10);
  --ten-v:0 18px 48px rgba(22,23,27,.16);
}

/* Планшет: 834px — вторая опора дизайна */
@media (max-width:1099px){ :root{ --pad:28px; --sec:56px; } }
/* Телефон: 390px — третья опора дизайна */
@media (max-width:639px){  :root{ --pad:16px; --sec:44px; } }


/* ===== osnova.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Основа: сброс, печать, кнопки, поля, служебные классы.
   Базовые правила перенесены из дизайна дословно, кроме фона страницы:
   в дизайне стоял #0D0E10 — это фон стенда показа, а не сайта.
   ────────────────────────────────────────────────────────────────────────── */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0}
body{
  background:var(--fon);
  font-family:var(--sh);
  font-size:15px;
  line-height:1.5;
  color:var(--tekst);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
:root{color-scheme:light}
a{color:var(--tekst);text-decoration:none}
a:hover{color:var(--zol-tmn)}
button{font-family:inherit;color:var(--tekst)}
input,select,textarea{font-family:inherit;background-color:var(--bel);color:var(--tekst)}
input::placeholder,textarea::placeholder{color:var(--tekst-3)}
img{max-width:100%}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:800;letter-spacing:-.02em;line-height:1.15}
p{margin:0 0 14px}
p:last-child{margin-bottom:0}
ul,ol{margin:0 0 14px;padding-left:22px}
figure{margin:0}
table{border-collapse:collapse}
hr{border:0;border-top:1px solid var(--ram);margin:28px 0}

/* ── значки ── */
.hc-z{
  font-family:'Material Symbols Rounded';
  font-weight:normal;font-style:normal;font-size:24px;line-height:1;
  letter-spacing:normal;text-transform:none;display:inline-block;
  white-space:nowrap;word-wrap:normal;direction:ltr;
  -webkit-font-smoothing:antialiased;
  flex:none;
}

/* ── цифры моноширинным ── */
.hc-cif{font-family:var(--sh-cif);font-variant-numeric:tabular-nums}

/* ── полотно ── */
.hc-obol{max-width:var(--shir);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.hc-stranica{display:flex;flex-direction:column;gap:var(--sec);padding-bottom:var(--sec)}
.hc-razdel{display:flex;flex-direction:column;gap:18px}
.hc-zagolovok{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hc-zagolovok h1,.hc-zagolovok h2{font-size:30px}
.hc-podzag{font-size:15px;color:var(--tekst-2);margin-top:6px}
@media (max-width:1099px){.hc-zagolovok h1,.hc-zagolovok h2{font-size:26px}}
@media (max-width:639px){.hc-zagolovok h1,.hc-zagolovok h2{font-size:23px}.hc-podzag{font-size:14px}}

/* ── кнопки ──
   Главная кнопка — тёмно-синяя (второй цвет), золотая — для действий покупки. */
.hc-kn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:48px;padding:0 22px;border:none;border-radius:var(--r-14);
  font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;
  text-decoration:none;transition:background .15s,color .15s,border-color .15s;
  white-space:nowrap;
}
.hc-kn .hc-z{font-size:20px}
.hc-kn--sin{background:var(--sin);color:var(--tekst-tmn)}
.hc-kn--sin:hover{background:var(--sin-tmn);color:var(--tekst-tmn)}
.hc-kn--zol{background:var(--zol);color:var(--chern)}
.hc-kn--zol:hover{background:var(--zol-svt);color:var(--chern)}
.hc-kn--bel{background:var(--bel);color:var(--tekst);border:1px solid var(--ram)}
.hc-kn--bel:hover{background:var(--fon-2);color:var(--tekst);border-color:var(--ram-4)}
.hc-kn--prizrak{background:transparent;color:var(--tekst);border:1px solid var(--ram-4)}
.hc-kn--prizrak:hover{background:var(--fon-2);color:var(--tekst)}
.hc-kn--tihaya{background:var(--fon);color:var(--tekst)}
.hc-kn--tihaya:hover{background:var(--ram)}
.hc-kn--mal{height:36px;padding:0 12px;border-radius:var(--r-s);font-size:13px;font-weight:600}
.hc-kn--mal .hc-z{font-size:18px}
.hc-kn--bol{height:56px;padding:0 28px;border-radius:var(--r-16);font-size:16px;font-weight:800}
.hc-kn--vsyu{width:100%}
.hc-kn[disabled],.hc-kn.hc-kn--vykl{opacity:.5;pointer-events:none}

/* кругляш-кнопка (избранное, сравнение, закрыть) */
.hc-kr{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:50%;border:1px solid var(--ram);
  background:var(--bel);cursor:pointer;color:var(--tekst-2);flex:none;
  transition:background .15s,color .15s,border-color .15s;
}
.hc-kr:hover{background:var(--fon-2);color:var(--tekst)}
.hc-kr .hc-z{font-size:20px}
.hc-kr.hc-vkl{background:var(--zol);border-color:var(--zol);color:var(--chern)}

/* ── поля ── */
.hc-pole{
  width:100%;height:48px;padding:0 14px;border:1px solid var(--ram);
  border-radius:var(--r-m);font-size:15px;background:var(--bel);color:var(--tekst);
  transition:border-color .15s;
}
.hc-pole:focus{outline:none;border-color:var(--zol)}
textarea.hc-pole{height:auto;min-height:96px;padding:12px 14px;resize:vertical}
select.hc-pole{appearance:none;background-image:none;cursor:pointer}
.hc-metka{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--tekst-2)}

/* ── плашки ── */
.hc-plashka{
  display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;
  border-radius:var(--r-kr);font-size:12px;font-weight:700;white-space:nowrap;
}
.hc-plashka .hc-z{font-size:16px}
.hc-plashka--zel{background:var(--zel-fon);color:var(--zel)}
.hc-plashka--zol{background:var(--zol-fon);color:var(--zol-tmn)}
.hc-plashka--kras{background:var(--kras-fon);color:var(--kras)}
.hc-plashka--seraya{background:var(--fon-2);color:var(--tekst-2)}

/* ── карточка-полотно ── */
.hc-kart{background:var(--bel);border:1px solid var(--ram);border-radius:var(--r-24)}
.hc-kart--tmn{background:var(--sin);border-color:var(--sin-ram);color:var(--tekst-tmn)}
.hc-kart--tmn a{color:var(--tekst-tmn)}
.hc-kart--tmn a:hover{color:var(--zol)}

/* ── служебное ── */
.hc-skryt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Показ по ширине. Скрываем через медиа-условия, а не общим display:none —
   иначе собственное display:flex блока перебивает скрытие и часть для телефона
   остаётся видна на ПК. */
@media (min-width:640px){ .hc-tolko-tel{display:none!important} }
@media (max-width:639px){ .hc-tolko-pk{display:none!important} }
.hc-nitka{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--tekst-2);padding:14px 0}
.hc-nitka a{color:var(--tekst-2)}
.hc-nitka a:hover{color:var(--zol-tmn)}
.hc-nitka .hc-z{font-size:16px;color:var(--ram-5)}

/* ── движение ── */
@keyframes hcprog{from{width:0%}to{width:100%}}
@keyframes hcfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hc-poyav{animation:hcfade .22s ease-out both}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ── лента уведомлений ── */
.hc-toast{
  position:fixed;left:50%;transform:translateX(-50%);bottom:24px;z-index:900;
  display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);
  padding:14px 18px;border-radius:var(--r-14);background:var(--sin);
  color:var(--tekst-tmn);font-size:14px;font-weight:600;box-shadow:var(--ten-v);
  animation:hcfade .2s ease-out both;
}
@media (max-width:639px){.hc-toast{bottom:100px}}

/* Знаки социальных сетей — оригинальные файлы, им нужен только размер. */
.hc-znak-seti{display:block; width:18px; height:18px; flex:none; object-fit:contain}
.hc-kn .hc-znak-seti,.hc-podval__kn .hc-znak-seti{width:18px; height:18px}

/* ── полоса загрузки при переходе между страницами ── */
.hc-zagruzka{
  position:fixed; left:0; right:0; top:var(--adminbar,0px); height:3px;
  z-index:999; pointer-events:none; opacity:0; transition:opacity .25s ease;
}
.hc-zagruzka.hc-idyot{opacity:1}
.hc-zagruzka>span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg, var(--zol) 0%, var(--zol-svt) 60%, var(--zol) 100%);
  box-shadow:0 0 10px rgba(201,154,59,.6);
}
body.hc-perehod{cursor:progress}
body.hc-perehod .hc-glavnoe{opacity:.55; transition:opacity .18s ease}
.hc-glavnoe.hc-poyavlenie{animation:hcvhod .32s cubic-bezier(.22,.9,.26,1) both}
@keyframes hcvhod{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){
  .hc-glavnoe.hc-poyavlenie{animation:none}
  body.hc-perehod .hc-glavnoe{opacity:1}
}


/* ===== shapka.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Шапка и меню каталога. Числа — замером из дизайна.
   Чёрный #16171B там, где он был полотном кнопки, заменён на второй цвет.
   ────────────────────────────────────────────────────────────────────────── */

.hc-shapka{
  position:sticky; top:var(--adminbar,0px); z-index:40;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  color:var(--tekst);
  box-shadow:0 1px 0 var(--ram), 0 24px 40px -36px rgba(22,23,27,.35);
}

/* ── верхняя полоса ── */
.hc-shapka__polosa{border-bottom:1px solid var(--fon-6)}
.hc-shapka__polosa-ryad{
  height:38px; display:flex; align-items:center; gap:18px;
  font-size:12px; color:var(--tekst-2);
}
.hc-shapka__gorod{
  flex:none; height:26px; padding:0 10px 0 7px; border-radius:var(--r-kr);
  border:1px solid var(--ram); background:var(--bel); color:var(--tekst);
  font-size:12px; font-weight:600; display:flex; align-items:center; gap:4px; cursor:pointer;
}
.hc-shapka__gorod .hc-z{font-size:15px}
.hc-shapka__gorod .hc-z:first-child{color:var(--zol)}
.hc-shapka__gorod .hc-z:last-child{color:var(--tekst-4)}
.hc-shapka__akciya{
  flex:1; min-width:0; display:flex; align-items:center; gap:8px;
  overflow:hidden; white-space:nowrap;
}
.hc-shapka__tochka{
  width:6px; height:6px; border-radius:50%; background:#3FBF77;
  box-shadow:0 0 0 3px rgba(63,191,119,.18); flex:none;
}
.hc-shapka__akciya-tekst{overflow:hidden; text-overflow:ellipsis}
.hc-shapka__rastyazhka{flex:1; min-width:0}
.hc-shapka__chasy{white-space:nowrap}
.hc-shapka__tel{color:var(--tekst); font-weight:600; white-space:nowrap; letter-spacing:.02em}

.hc-perekl{
  display:flex; gap:2px; padding:2px; border-radius:var(--r-kr);
  background:var(--fon-2); border:1px solid var(--ram); flex:none;
}
.hc-perekl__kn{
  height:22px; padding:0 9px; border:none; border-radius:var(--r-kr);
  background:transparent; color:var(--tekst-2);
  font-size:11px; font-weight:700; cursor:pointer; line-height:22px;
  transition:background .2s, color .2s;
}
.hc-perekl__kn:hover{color:var(--tekst)}
.hc-perekl__kn.hc-vkl{background:var(--zol); color:var(--chern)}
.hc-perekl--val .hc-perekl__kn.hc-vkl{background:var(--sin); color:var(--bel)}

/* ── основной ряд ── */
.hc-shapka__ryad{
  padding-top:16px; padding-bottom:16px;
  display:flex; align-items:center; gap:20px; flex-wrap:wrap; row-gap:12px;
}
.hc-shapka__logo{flex:none; display:flex; align-items:center; gap:12px}
.hc-shapka__logo-kart{height:46px; width:auto; display:block}

.hc-shapka__katalog{
  flex:none; height:50px; padding:0 20px 0 16px; border:none; border-radius:var(--r-kr);
  background:var(--sin); color:var(--bel); font-size:14.5px; font-weight:600;
  letter-spacing:.01em; display:flex; align-items:center; gap:10px; cursor:pointer;
  transition:background .2s;
}
.hc-shapka__katalog:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-shapka__katalog-znak{font-size:20px; color:var(--zol-svt); font-variation-settings:'wght' 300}

/* ── поиск ── */
.hc-poisk__znak,.hc-poisk__pole,.hc-poisk__klavisha,.hc-poisk__dop,.hc-poisk__najti{flex:none}
.hc-poisk{
  position:relative; flex:1; min-width:260px; display:flex;
  height:52px; border-radius:var(--r-16); background:var(--fon); border:1px solid var(--ram);
  align-items:center; gap:10px; padding:0 6px 0 18px;
}
.hc-poisk:focus-within{border-color:var(--zol)}
.hc-poisk__znak{font-size:22px; color:var(--tekst-2)}
.hc-poisk__pole{
  flex:1 1 auto; min-width:0; border:none; background:transparent; outline:none;
  font-size:15px; color:var(--tekst); height:100%;
}
.hc-poisk__pole::-webkit-search-cancel-button{-webkit-appearance:none}
.hc-poisk__klavisha{
  height:22px; padding:0 7px; border-radius:6px; border:1px solid var(--ram-7);
  color:var(--tekst-4); font-size:11px; display:flex; align-items:center;
}
.hc-poisk__dop{
  width:38px; height:38px; border:none; border-radius:11px; background:transparent;
  color:#3A3C44; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.hc-poisk__dop:hover{background:var(--ram)}
.hc-poisk__dop .hc-z{font-size:20px}
.hc-poisk__najti{
  width:40px; height:40px; border:none; border-radius:var(--r-m);
  background:var(--sin); color:var(--bel); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.hc-poisk__najti:hover{background:var(--sin-tmn)}
.hc-poisk__najti .hc-z{font-size:20px}
.hc-poisk__podskazki{
  position:absolute; left:0; right:0; top:calc(100% + 8px); z-index:60;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-16);
  box-shadow:var(--ten-v); overflow:hidden; max-height:60vh; overflow-y:auto;
}
.hc-poisk__podskazka{
  display:flex; align-items:center; gap:12px; padding:10px 14px; cursor:pointer;
  border-bottom:1px solid var(--fon-6); color:var(--tekst);
}
.hc-poisk__podskazka:last-child{border-bottom:none}
.hc-poisk__podskazka:hover,.hc-poisk__podskazka.hc-vkl{background:var(--fon-2)}
.hc-poisk__podskazka-kart{
  width:44px; height:44px; flex:none; border-radius:var(--r-s); background:var(--fon) center/contain no-repeat;
}
.hc-poisk__podskazka-telo{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.hc-poisk__podskazka-imya{font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.hc-poisk__podskazka-niz{font-size:12px; color:var(--tekst-2)}
.hc-poisk__vse{display:block; padding:12px 14px; text-align:center; font-size:13px; font-weight:700; color:var(--zol-tmn); background:var(--fon-2)}

/* ── кнопки справа ── */
/* margin-left:auto прижимает кнопки к правому краю, когда поле поиска ушло
   на свою строку (телефон) или кнопки сами перенеслись (узкий планшет).
   На широком экране поиск забирает всё свободное место, и этот отступ
   обращается в ноль — там ничего не меняется. */
.hc-shapka__knopki{display:flex; align-items:center; gap:8px; flex:none; margin-left:auto}
.hc-shapka__kn{
  position:relative; width:48px; height:48px; border-radius:var(--r-16);
  border:1px solid var(--ram); background:var(--bel); color:var(--tekst);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .2s, border-color .2s;
}
.hc-shapka__kn:hover{background:var(--fon); border-color:var(--ram-7); color:var(--tekst)}
.hc-shapka__kn .hc-z{font-size:23px}
.hc-shapka__schet{
  position:absolute; top:-5px; right:-5px; min-width:20px; height:20px; border-radius:10px;
  background:var(--sin); color:var(--bel); font-size:10.5px; font-weight:800;
  display:flex; align-items:center; justify-content:center; padding:0 5px;
  border:2px solid var(--bel); font-family:var(--sh);
}
.hc-shapka__schet.hc-pusto{display:none}
.hc-shapka__schet--zol{background:var(--zol); color:var(--chern); top:-6px; left:30px; right:auto}

.hc-shapka__korzina{
  position:relative; height:52px; padding:0 16px 0 14px; border:none; border-radius:var(--r-16);
  background:var(--sin); color:var(--bel); display:flex; align-items:center; gap:10px;
  cursor:pointer; transition:background .2s;
}
.hc-shapka__korzina:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-shapka__korzina .hc-z{font-size:22px}
.hc-shapka__korzina-tekst{display:flex; flex-direction:column; align-items:flex-start; line-height:1.15}
.hc-shapka__korzina-podpis{font-size:11px; color:var(--ram-6)}
.hc-shapka__korzina-summa{font-size:13.5px; font-weight:700; white-space:nowrap}

/* ── ряд меню ── */
.hc-shapka__menyu{border-top:1px solid var(--fon-6)}
.hc-shapka__menyu-ryad{height:48px; display:flex; align-items:center; gap:6px; font-size:14px}
.hc-shapka__hity{
  height:34px; padding:0 12px 0 10px; border:none; border-radius:var(--r-s);
  background:var(--zol-fon); color:var(--zol-tmn); font-size:13.5px; font-weight:700;
  cursor:pointer; display:flex; align-items:center; gap:6px; white-space:nowrap;
}
.hc-shapka__hity:hover{background:var(--zol-fon2); color:var(--zol-glb)}
.hc-shapka__hity .hc-z{font-size:18px}
.hc-shapka__spisok{display:flex; align-items:center; gap:6px; margin:0; padding:0; list-style:none}
.hc-shapka__spisok li{list-style:none}
.hc-shapka__spisok a{
  height:34px; padding:0 12px; border-radius:var(--r-s); background:transparent;
  color:#3A3C44; font-size:13.5px; font-weight:500; display:flex; align-items:center;
  white-space:nowrap; transition:background .2s, color .2s;
}
.hc-shapka__spisok a:hover,
.hc-shapka__spisok .current-menu-item>a{background:var(--fon-2); color:var(--tekst)}
.hc-shapka__zvonok,.hc-shapka__tg{
  height:34px; padding:0 12px; border:none; border-radius:var(--r-s); background:transparent;
  color:var(--tekst); font-size:13.5px; font-weight:600; cursor:pointer;
  display:flex; align-items:center; gap:6px; white-space:nowrap;
}
.hc-shapka__zvonok:hover,.hc-shapka__tg:hover{background:var(--fon-2); color:var(--tekst)}
.hc-shapka__zvonok .hc-z,.hc-shapka__tg .hc-z{font-size:18px}
.hc-z.hc-zol{color:var(--zol)}
.hc-z.hc-tg{color:var(--sinij-ssl)}

/* ── лента на телефоне ── */
.hc-shapka__tel-poisk{flex-basis:100%; width:100%}
.hc-lenta{
  display:flex; gap:6px; overflow-x:auto; scrollbar-width:none;
  /* верхнее поле обязательно: без него кнопки разделов упирались в поле поиска */
  padding:10px var(--pad) 12px;
}
.hc-lenta::-webkit-scrollbar{display:none}
.hc-lenta__katalog{
  flex:none; height:34px; padding:0 12px 0 8px; border:none; border-radius:var(--r-kr);
  background:var(--zol); color:var(--chern); font-size:13px; font-weight:700;
  display:flex; align-items:center; gap:6px; cursor:pointer;
}
.hc-lenta__katalog .hc-z{font-size:18px}
.hc-lenta__kn{
  flex:none; height:34px; padding:0 12px; border:1px solid var(--ram); border-radius:var(--r-kr);
  background:transparent; color:#3A3C44; font-size:13px; font-weight:600;
  display:flex; align-items:center; white-space:nowrap;
}

/* ── меню каталога ── */
.hc-mega{
  position:absolute; left:0; right:0; top:100%; z-index:50;
  background:var(--bel); border-top:1px solid var(--ram);
  box-shadow:0 40px 80px -30px rgba(21,20,15,.4);
  animation:hcfade .18s ease;
}
.hc-mega[hidden]{display:none}
.hc-mega__setka{
  padding-top:20px; padding-bottom:28px;
  display:grid; grid-template-columns:340px minmax(0,1fr); gap:28px;
}
.hc-mega__spisok{
  display:flex; flex-direction:column; gap:2px;
  max-height:560px; overflow-y:auto; padding-right:6px;
}
.hc-mega__punkt{
  display:flex; align-items:center; gap:12px; padding:7px 10px;
  border-radius:var(--r-m); background:transparent; cursor:pointer; color:var(--tekst);
}
.hc-mega__punkt:hover,.hc-mega__punkt.hc-vkl{background:var(--fon); color:var(--tekst)}
.hc-mega__punkt.hc-vkl .hc-mega__imya{font-weight:700}
.hc-mega__znachok{
  display:block; flex:none; width:30px; height:30px;
  background:center/contain no-repeat;
}
.hc-mega__znachok--zapas{
  border-radius:50%; background:var(--zol);
  display:flex; align-items:center; justify-content:center; color:var(--chern);
}
.hc-mega__imya{flex:1; min-width:0; font-size:14px; font-weight:500; overflow:hidden; text-overflow:ellipsis}
.hc-mega__schet{font-size:12px; color:var(--tekst-3)}

.hc-mega__polotno{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:24px; align-content:start}
.hc-mega__polotno[hidden]{display:none}
.hc-mega__telo{display:flex; flex-direction:column; gap:18px}
.hc-mega__shapka{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.hc-mega__zag{font-size:28px; font-weight:700; letter-spacing:-.02em}
.hc-mega__vsego{font-size:14px; color:var(--tekst-2)}
.hc-mega__plitki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.hc-mega__plitka{
  display:flex; flex-direction:column; gap:10px; padding:14px;
  border-radius:var(--r-14); border:1px solid var(--ram); cursor:pointer;
  transition:border-color .2s; color:var(--tekst);
}
.hc-mega__plitka:hover{border-color:var(--sin); color:var(--tekst)}
.hc-mega__plitka-logo{height:44px; display:flex; align-items:center}
.hc-mega__logo{flex:none; display:block; height:44px; width:140px; background:left center/contain no-repeat}
.hc-mega__logo-tekst{font-size:17px; font-weight:800; letter-spacing:.03em; line-height:1.15}
.hc-mega__plitka-niz{display:flex; justify-content:space-between; gap:8px; font-size:12px; color:var(--tekst-2)}
.hc-mega__vse{align-self:flex-start; height:44px; padding:0 18px; border-radius:var(--r-m); font-size:14px; font-weight:600}
.hc-mega__foto{
  aspect-ratio:1/1.1; border-radius:var(--r-20); background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; padding:36px;
}
.hc-mega__foto-kart{
  flex:none; display:block; width:100%; height:100%;
  mix-blend-mode:multiply; background:center center/contain no-repeat;
}

/* ── планшет и телефон ── */
@media (max-width:1099px){
  .hc-shapka__ryad{gap:12px}
  .hc-mega__setka{grid-template-columns:280px minmax(0,1fr); gap:20px}
  .hc-mega__polotno{grid-template-columns:minmax(0,1fr)}
  .hc-mega__foto{display:none}
  .hc-mega__plitki{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-mega__zag{font-size:23px}
}
@media (max-width:639px){
  .hc-shapka__katalog{display:none}
  .hc-shapka__ryad{padding-top:12px; padding-bottom:0; gap:10px}
  .hc-shapka__logo-kart{height:38px}
  .hc-shapka__kn{width:44px; height:44px; border-radius:var(--r-14)}
  .hc-shapka__korzina{height:44px; padding:0 12px; border-radius:var(--r-14)}
  .hc-shapka__schet--zol{left:24px}
  .hc-poisk{height:48px; padding:0 6px 0 14px}
  .hc-shapka__polosa-ryad{gap:10px; font-size:11px}
  .hc-mega__setka{grid-template-columns:minmax(0,1fr); padding-top:14px; padding-bottom:18px}
  .hc-mega__spisok{max-height:none; overflow:visible}
  .hc-mega__polotno{display:none!important}
  .hc-mega{position:fixed; top:0; bottom:0; overflow-y:auto; border-radius:0}
}

/* Телефон: в верхней полосе остаются город и переключатели, остальное скрыто. */
@media (max-width:639px){
  .hc-shapka__polosa-ryad{height:auto; padding-top:8px; padding-bottom:8px; gap:8px}
  .hc-shapka__gorod{height:24px; padding:0 8px 0 6px; font-size:11.5px}
  .hc-perekl__kn{padding:0 7px}
  .hc-shapka__tel-poisk .hc-poisk{width:100%}
}

/* ──────────────────────────────────────────────────────────────────────────
   Сжатие шапки при прокрутке — только на телефоне.
   Во весь рост шапка занимает 205 точек из 664 видимых: треть экрана.
   При прокрутке вниз верхняя полоса и лента разделов убираются, ряд с
   логотипом и кнопками мельчает; поиск остаётся — он нужен на любой глубине.
   Класс ставит скрипт (assets/js/osnova.js); без скрипта шапка просто
   остаётся полной — ничего не ломается.
   ────────────────────────────────────────────────────────────────────────── */
@media (max-width:639px){
  .hc-shapka{transition:box-shadow .3s ease}

  .hc-shapka__polosa{
    max-height:64px; opacity:1; overflow:hidden;
    transition:max-height .34s cubic-bezier(.22,.9,.26,1),
               opacity .2s ease, transform .34s cubic-bezier(.22,.9,.26,1);
  }
  .hc-lenta{
    max-height:64px; opacity:1;
    transition:max-height .34s cubic-bezier(.22,.9,.26,1),
               opacity .2s ease, padding .34s cubic-bezier(.22,.9,.26,1),
               transform .34s cubic-bezier(.22,.9,.26,1);
  }
  .hc-shapka__ryad{transition:padding-top .3s cubic-bezier(.22,.9,.26,1),
                            padding-bottom .3s cubic-bezier(.22,.9,.26,1),
                            gap .3s cubic-bezier(.22,.9,.26,1)}
  .hc-shapka__logo-kart{transition:height .3s cubic-bezier(.22,.9,.26,1)}
  .hc-shapka__kn,
  .hc-shapka__korzina{transition:width .3s cubic-bezier(.22,.9,.26,1), height .3s cubic-bezier(.22,.9,.26,1),
                                 border-radius .3s ease, background .2s, border-color .2s}
  .hc-shapka__kn .hc-z,
  .hc-shapka__korzina .hc-z{transition:font-size .3s cubic-bezier(.22,.9,.26,1)}
  .hc-shapka__tel-poisk .hc-poisk{transition:height .3s cubic-bezier(.22,.9,.26,1)}

  .hc-shapka--szhata .hc-shapka__polosa{
    max-height:0; opacity:0; transform:translateY(-6px); border-bottom-color:transparent;
  }
  .hc-shapka--szhata .hc-lenta{
    max-height:0; opacity:0; padding-top:0; padding-bottom:0;
    transform:translateY(-6px); overflow:hidden;
  }
  .hc-shapka--szhata .hc-shapka__ryad{padding-top:7px; padding-bottom:8px; gap:8px}
  .hc-shapka--szhata .hc-shapka__logo-kart{height:29px}
  .hc-shapka--szhata .hc-shapka__kn{width:38px; height:38px; border-radius:var(--r-m)}
  .hc-shapka--szhata .hc-shapka__korzina{height:38px; padding:0 10px; border-radius:var(--r-m)}
  .hc-shapka--szhata .hc-shapka__kn .hc-z,
  .hc-shapka--szhata .hc-shapka__korzina .hc-z{font-size:20px}
  .hc-shapka--szhata .hc-shapka__schet--zol{left:19px; top:-5px}
  .hc-shapka--szhata .hc-shapka__tel-poisk .hc-poisk{height:42px}
  .hc-shapka--szhata{box-shadow:0 1px 0 var(--ram), 0 18px 30px -26px rgba(22,23,27,.5)}
}

/* Человеку, который просил убрать движение, показываем то же самое без него. */
@media (max-width:639px) and (prefers-reduced-motion:reduce){
  .hc-shapka,.hc-shapka__polosa,.hc-lenta,.hc-shapka__ryad,.hc-shapka__logo-kart,
  .hc-shapka__kn,.hc-shapka__korzina,.hc-shapka__kn .hc-z,.hc-shapka__korzina .hc-z,
  .hc-shapka__tel-poisk .hc-poisk{transition:none}
}

/* ── карусель товаров в меню каталога ──────────────────────────────────────
   Смена кадра: уход вверх с растворением, приход снизу. Движение плавное,
   с лёгким опережением — так слайд читается как один жест, а не как рывок. */
.hc-mkarusel{
  position:relative; aspect-ratio:1/1.1; border-radius:var(--r-20);
  background:var(--fon-2); overflow:hidden;
}
.hc-mkarusel__kadry{position:absolute; inset:0}
.hc-mkart{
  position:absolute; inset:0; display:flex; flex-direction:column; gap:10px;
  padding:18px; color:var(--tekst); opacity:0; pointer-events:none;
  transform:translateY(22px) scale(.97);
  transition:opacity .45s ease, transform .55s cubic-bezier(.22,.9,.26,1);
}
.hc-mkart.hc-vkl{opacity:1; transform:none; pointer-events:auto}
.hc-mkart.hc-uhodit{opacity:0; transform:translateY(-22px) scale(.97)}
.hc-mkart:hover{color:var(--tekst)}
.hc-mkart__foto{
  flex:1; min-height:0; display:block; border-radius:var(--r-14);
  background:var(--bel) center/contain no-repeat; mix-blend-mode:multiply;
  transition:transform .5s cubic-bezier(.22,.9,.26,1);
}
.hc-mkart:hover .hc-mkart__foto{transform:scale(1.05)}
.hc-mkart__telo{display:flex; flex-direction:column; gap:4px; flex:none}
.hc-mkart__brend{
  font-size:10.5px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--zol-tmn);
}
.hc-mkart__imya{
  font-size:13.5px; font-weight:600; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.hc-mkart__niz{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:2px}
.hc-mkart__cena{font-size:15px; font-weight:800; white-space:nowrap}
.hc-mkart__cena--zapros{font-size:13px; font-weight:600; color:var(--tekst-2)}
.hc-mkart__strelka{
  width:28px; height:28px; border-radius:9px; background:var(--sin); color:var(--bel);
  display:flex; align-items:center; justify-content:center; flex:none;
  transition:background .2s, transform .25s;
}
.hc-mkart:hover .hc-mkart__strelka{background:var(--zol); color:var(--chern); transform:translateX(2px)}
.hc-mkarusel__tochki{
  position:absolute; left:18px; right:18px; bottom:8px;
  display:flex; gap:4px; justify-content:center;
}
.hc-mkarusel__tochka{
  width:6px; height:6px; border-radius:3px; background:var(--ram-4);
  transition:width .35s cubic-bezier(.22,.9,.26,1), background .35s;
}
.hc-mkarusel__tochka.hc-vkl{width:18px; background:var(--zol)}
@media (prefers-reduced-motion:reduce){
  .hc-mkart,.hc-mkart__foto,.hc-mkarusel__tochka{transition:none}
}

/* Полотно, которое ещё подтягивается: три точки вместо пустоты. */
.hc-mega__zhdyom{
  grid-column:1 / -1; display:flex; align-items:center; justify-content:center;
  gap:6px; min-height:220px;
}
.hc-mega__zhdyom span{
  width:8px; height:8px; border-radius:50%; background:var(--ram-4);
  animation:hcmig 1s ease-in-out infinite;
}
.hc-mega__zhdyom span:nth-child(2){animation-delay:.15s}
.hc-mega__zhdyom span:nth-child(3){animation-delay:.3s}
@keyframes hcmig{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}


/* ===== podval.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Подвал и нижнее меню телефона.
   В дизайне полотно подвала было чёрным #16171B — по слову владельца тут
   стоит второй цвет, тёмно-синий; чёрный остался цветом текста.
   ────────────────────────────────────────────────────────────────────────── */
.hc-podval{margin-top:var(--sec); background:var(--sin); color:var(--zagl)}
.hc-podval__telo{
  padding-top:var(--sec); padding-bottom:28px;
  display:flex; flex-direction:column; gap:40px;
}
.hc-podval a{color:var(--zagl)}
.hc-podval a:hover{color:var(--zol)}
.hc-podval__setka{display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:32px}
.hc-podval__o-nas{display:flex; flex-direction:column; gap:18px; max-width:360px}
.hc-podval__logo img{height:46px; width:auto; display:block}
.hc-podval__logo-kart{height:46px; width:auto; display:block}
.hc-podval__opis{font-size:14px; line-height:1.55; color:var(--ram-6); margin:0}
.hc-podval__svyaz{display:flex; flex-direction:column; gap:4px}
.hc-podval__tel{font-size:20px; font-weight:700; color:var(--bel)}
.hc-podval__chasy{font-size:13px; color:var(--tekst-4)}
.hc-podval__knopki{display:flex; gap:8px; flex-wrap:wrap}
.hc-podval__kn{
  height:40px; padding:0 14px; border:none; border-radius:var(--r-m);
  background:var(--sin-ram); color:var(--bel); font-size:13px; font-weight:600;
  cursor:pointer; display:flex; align-items:center; gap:6px; font-family:inherit;
}
.hc-podval__kn:hover{background:var(--sin-ram2); color:var(--bel)}
.hc-podval__kn .hc-z{font-size:18px}
.hc-podval__kn .hc-znak-seti{width:18px; height:18px; flex:0 0 auto}
.hc-podval__kn--zol{background:var(--zol); color:var(--chern); font-weight:700}
.hc-podval__kn--zol:hover{background:var(--zol-svt); color:var(--chern)}
.hc-podval__stolbec{display:flex; flex-direction:column; gap:10px}
.hc-podval__stolbec a{font-size:14px}
.hc-podval__zag{
  font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--tekst-4); margin-bottom:4px;
}
.hc-podval__vse{color:var(--zol)!important; font-weight:600}
.hc-podval__pochta{color:var(--tekst-4)!important}
.hc-podval__niz{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-top:22px; border-top:1px solid var(--sin-ram);
  /* справа внизу окна висит кнопка чата (.hc-chat-kn, 56 точек + 24 отступ):
     без этого поля она накрывает последний знак оплаты */
  padding-right:64px;
}
.hc-podval__prava{font-size:12px; color:var(--tekst-4)}

/* ── знаки платёжных систем ──
   Чип один и тот же у всех: при разной ширине ряд выглядит рваным.
   Знаки же у систем разной формы — строчные (click, payme, uzum, visa, humo),
   круговой (mastercard) и стоячий (uzcard), — поэтому ровняем их не по
   рамке, а по высоте надписи: иначе стоячий Uzcard станет вдвое мельче
   соседей. Ширина знака ограничена полем чипа, выше предела не вылезет. */
.hc-znaki{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.hc-znak{
  width:66px; height:36px; flex:0 0 auto; box-sizing:border-box;
  padding:0 8px; border-radius:var(--r-xs);
  background:var(--bel); display:flex; align-items:center; justify-content:center;
}
.hc-znak img{max-width:50px; max-height:14px; width:auto; height:auto; object-fit:contain; display:block}
.hc-znak--mastercard img{max-height:22px}
.hc-znak--uzcard img{max-height:26px}
.hc-znaki--tmn .hc-znak{background:var(--sin-ram)}

/* ── нижнее меню телефона ── */
.hc-nizh{
  position:sticky; bottom:0; z-index:45;
  background:rgba(255,255,255,.94); backdrop-filter:blur(14px);
  border-top:1px solid var(--ram);
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); padding:6px 4px 14px;
}
.hc-nizh__kn{
  position:relative; height:52px; border:none; background:transparent;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  color:var(--tekst-2); font-size:10.5px; font-weight:600; cursor:pointer; text-align:center;
}
.hc-nizh__kn.hc-vkl{color:var(--tekst)}
.hc-nizh__kn.hc-vkl .hc-z{font-variation-settings:'FILL' 1}
.hc-nizh__podpis{line-height:1.1}
.hc-nizh__schet{
  position:absolute; top:4px; left:calc(50% + 6px); min-width:18px; height:18px; border-radius:9px;
  background:var(--zol); color:var(--chern); font-size:10px; font-weight:800;
  display:flex; align-items:center; justify-content:center; padding:0 4px;
}

@media (max-width:1099px){
  .hc-podval__setka{grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px}
}
@media (max-width:639px){
  .hc-podval__setka{grid-template-columns:minmax(0,1fr); gap:26px}
  .hc-podval__niz{flex-direction:column; align-items:flex-start; padding-right:0}
  .hc-podval{margin-bottom:0}
}


/* ===== tovary.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Карточка товара и сетки товаров. Числа — из части ProductCard дизайна.
   ────────────────────────────────────────────────────────────────────────── */
.hc-karta{
  position:relative; display:flex; flex-direction:column; height:100%;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
  overflow:hidden; color:var(--tekst);
  transition:box-shadow .25s ease, transform .25s ease, border-color .25s;
}
.hc-karta:hover{
  box-shadow:0 18px 40px -18px rgba(21,20,15,.28);
  transform:translateY(-3px); border-color:var(--ram-3);
}
.hc-karta__kart{
  position:relative; aspect-ratio:1/1; background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; padding:14%;
  overflow:hidden; cursor:pointer;
}
.hc-karta__foto{
  flex:none; display:block; width:100%; height:100%;
  object-fit:contain; mix-blend-mode:multiply; transition:transform .4s ease;
}
.hc-karta:hover .hc-karta__foto{transform:scale(1.06)}
.hc-karta__net-foto{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:var(--tekst-3); font-family:var(--sh-cif); font-size:11px; text-align:center;
}
.hc-karta__net-foto .hc-z{color:var(--ram-5)}
.hc-karta__metki{position:absolute; left:12px; top:12px; display:flex; flex-wrap:wrap; gap:6px}
.hc-karta__metka{
  display:inline-flex; align-items:center; gap:5px; height:24px; padding:0 9px;
  border-radius:var(--r-kr); background:var(--bel); font-size:11px; font-weight:600;
}
.hc-karta__metka--est{color:var(--zel)}
.hc-karta__metka--zakaz{color:var(--zol-tmn)}
.hc-karta__metka--net{color:var(--tekst-3)}
.hc-karta__metka--skidka{background:var(--kras); color:var(--bel)}
.hc-karta__tochka{width:6px; height:6px; border-radius:50%; background:var(--zel-svt)}
.hc-karta__kruzhki{position:absolute; right:10px; top:10px; display:flex; flex-direction:column; gap:6px; z-index:2}
.hc-karta__kruzhok{
  width:34px; height:34px; border-radius:50%; border:none; background:var(--bel);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  box-shadow:0 1px 3px rgba(0,0,0,.08); color:var(--tekst-3);
  transition:color .15s, background .15s;
}
.hc-karta__kruzhok:hover{color:var(--tekst)}
.hc-karta__kruzhok.hc-vkl{color:var(--chern)}
.hc-karta__kruzhok[data-vid="izb"].hc-vkl .hc-z{color:var(--kras); font-variation-settings:'FILL' 1}
.hc-karta__kruzhok[data-vid="sra"].hc-vkl{background:var(--zol)}
.hc-karta__telo{display:flex; flex-direction:column; gap:6px; padding:14px; flex:1}
.hc-karta__verh{display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:15px}
.hc-karta__brend{
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--tekst-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.hc-karta__brend:hover{color:var(--zol-tmn)}
.hc-karta__artikul{font-size:10px; color:var(--tekst-5); flex:none}
.hc-karta__imya{
  font-size:14px; line-height:1.35; font-weight:500; color:var(--tekst);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; min-height:38px;
}
.hc-karta__imya:hover{color:var(--zol-tmn)}
.hc-karta__rastyazhka{flex:1}
.hc-karta__ceny{display:flex; flex-direction:column; gap:2px; margin-top:4px}
.hc-karta__cena{font-size:18px; font-weight:700; letter-spacing:-.01em; white-space:nowrap; font-family:var(--sh)}
.hc-karta__cena-2{font-size:12px; color:var(--tekst-2)}
.hc-karta__zapros{font-size:15px; font-weight:600}
.hc-karta__rassrochka{
  align-self:flex-start; margin-top:4px; font-size:11px; font-weight:600;
  padding:3px 8px; border-radius:6px; background:var(--zol-fon); color:var(--zol-glb);
}
.hc-karta__kn{
  margin-top:10px; height:42px; border:none; border-radius:var(--r-m);
  background:var(--sin); color:var(--bel); font:600 14px var(--sh);
  display:flex; align-items:center; justify-content:center; gap:8px;
  cursor:pointer; transition:background .2s;
}
.hc-karta__kn:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-karta__kn--pustaya{
  border:1.5px solid var(--sin); background:transparent; color:var(--sin);
}
.hc-karta__kn--pustaya:hover{background:var(--zol); border-color:var(--zol); color:var(--chern)}
.hc-karta__kn.hc-dobavlen{background:var(--zel)}
.hc-karta.hc-zanyata{opacity:.6; pointer-events:none}

/* ── сетки ── */
.hc-setka-tovarov{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(212px,1fr)); gap:16px;
  margin:0; padding:0; list-style:none;
}
.hc-setka-tovarov>li{list-style:none}
.hc-ryad-tovarov{
  display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 64px)/5); gap:16px;
  overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:6px;
}
.hc-ryad-tovarov::-webkit-scrollbar{display:none}
.hc-ryad-tovarov__kletka{scroll-snap-align:start; min-width:0}
.hc-ssylka-strelka{
  flex:none; border:none; background:transparent; font-size:14px; font-weight:600;
  cursor:pointer; display:flex; align-items:center; gap:4px; padding:0; color:var(--tekst);
}
.hc-ssylka-strelka:hover{color:var(--zol-tmn)}

@media (max-width:1099px){
  .hc-setka-tovarov{grid-template-columns:repeat(auto-fill,minmax(196px,1fr))}
  .hc-ryad-tovarov{grid-auto-columns:calc((100% - 32px)/3.2)}
}
@media (max-width:639px){
  .hc-setka-tovarov{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
  .hc-ryad-tovarov{grid-auto-columns:46%; gap:10px}
  .hc-karta__telo{padding:10px}
  .hc-karta__cena{font-size:16px}
  .hc-karta__imya{font-size:13px; min-height:35px}
}


/* ===== korzina-panel.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Боковая панель корзины, нижняя полоса и счётчик «минус — число — плюс».
   Движение везде одно и то же: мягкое, с лёгким опережением.
   ────────────────────────────────────────────────────────────────────────── */

/* ── счётчик ── */
.hc-schyot{
  display:flex; align-items:center; gap:2px; padding:3px;
  border:1px solid var(--ram); border-radius:var(--r-m); background:var(--bel);
}
.hc-schyot__kn{
  width:30px; height:30px; border:none; border-radius:9px; background:var(--fon);
  color:var(--tekst); cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .15s, transform .12s;
}
.hc-schyot__kn:hover{background:var(--ram)}
.hc-schyot__kn:active{transform:scale(.9)}
.hc-schyot__chislo{
  min-width:30px; text-align:center; font-size:15px; font-weight:700;
  transition:transform .25s cubic-bezier(.22,.9,.26,1), color .25s;
}
.hc-schyot__chislo.hc-migaet{transform:scale(1.25); color:var(--zol-tmn)}
.hc-schyot--bol .hc-schyot__kn{width:38px; height:38px; border-radius:11px}
.hc-schyot--bol .hc-schyot__chislo{min-width:38px; font-size:17px}

/* карточка: кнопка превращается в счётчик */
.hc-karta__dejstvie{position:relative; margin-top:10px; height:42px}
.hc-karta__dejstvie .hc-karta__kn{
  margin-top:0; position:absolute; inset:0; width:100%;
  transition:opacity .22s ease, transform .3s cubic-bezier(.22,.9,.26,1);
}
.hc-karta__dejstvie .hc-schyot--karta{
  position:absolute; inset:0; justify-content:space-between; padding:4px;
  border-radius:var(--r-m); border-color:var(--zol); background:var(--zol-fon);
  opacity:0; transform:translateY(8px) scale(.96); pointer-events:none;
  transition:opacity .22s ease, transform .3s cubic-bezier(.22,.9,.26,1);
}
.hc-karta__dejstvie .hc-schyot--karta .hc-schyot__kn{background:var(--bel)}
.hc-karta__dejstvie .hc-schyot--karta .hc-schyot__chislo{flex:1; color:var(--zol-glb)}
.hc-karta__dejstvie.hc-v-korzine .hc-karta__kn{opacity:0; transform:translateY(-8px) scale(.96); pointer-events:none}
.hc-karta__dejstvie.hc-v-korzine .hc-schyot--karta{opacity:1; transform:none; pointer-events:auto}
.hc-karta__dejstvie.hc-zhdyot{opacity:.6; pointer-events:none}

/* ── затенение ── */
.hc-zaten{
  position:fixed; inset:0; z-index:300; background:rgba(14,14,12,.45);
  opacity:0; transition:opacity .3s ease; backdrop-filter:blur(2px);
}
.hc-zaten.hc-vidno{opacity:1}
.hc-zaten[hidden]{display:none}
body.hc-bez-prokrutki{overflow:hidden}

/* ── боковая панель ── */
.hc-panel{
  position:fixed; top:0; right:0; bottom:0; z-index:310; width:min(440px, 100vw);
  background:var(--bel); display:flex; flex-direction:column;
  box-shadow:-24px 0 60px -30px rgba(21,20,15,.5);
  transform:translateX(100%); transition:transform .34s cubic-bezier(.22,.9,.26,1);
}
.hc-panel.hc-otkryta{transform:none}
.hc-panel[hidden]{display:none}
.hc-panel__shapka{
  flex:none; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:18px 20px; border-bottom:1px solid var(--ram);
}
.hc-panel__zag{font-size:20px; font-weight:800; display:flex; align-items:center; gap:10px}
.hc-panel__schet{
  min-width:26px; height:26px; padding:0 8px; border-radius:var(--r-kr);
  background:var(--zol); color:var(--chern); font-size:13px;
  display:inline-flex; align-items:center; justify-content:center;
}
.hc-panel__zakryt{
  width:40px; height:40px; border-radius:50%; border:none; background:var(--fon);
  cursor:pointer; color:var(--tekst); display:flex; align-items:center; justify-content:center;
  transition:background .15s, transform .2s;
}
.hc-panel__zakryt:hover{background:var(--ram); transform:rotate(90deg)}

.hc-panel__progress{
  flex:none; margin:14px 20px 0; padding:12px 14px; border-radius:var(--r-14);
  background:var(--zol-fon); color:var(--zol-glb); font-size:13px;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.hc-panel__progress.hc-progress--gotovo{background:var(--zel-fon); color:var(--zel)}
.hc-panel__progress .hc-progress__polosa{
  flex:1 0 100%; height:5px; border-radius:3px; background:rgba(0,0,0,.08); overflow:hidden;
}
.hc-panel__progress .hc-progress__polosa>span{
  display:block; height:100%; background:currentColor; border-radius:3px;
  transition:width .45s cubic-bezier(.22,.9,.26,1);
}

.hc-panel__spisok{flex:1; min-height:0; overflow-y:auto; padding:14px 20px; display:flex; flex-direction:column; gap:10px}
.hc-panel__stroka{
  position:relative; display:grid; grid-template-columns:68px minmax(0,1fr); gap:12px;
  padding:12px; border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel);
  animation:hcfade .25s ease-out both;
}
.hc-panel__stroka.hc-uhodit{opacity:.4; transform:translateX(16px); transition:opacity .2s, transform .2s}
.hc-panel__kart{
  width:68px; height:68px; border-radius:var(--r-m); background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; padding:5px; overflow:hidden;
}
.hc-panel__kart img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; mix-blend-mode:multiply}
.hc-panel__telo{display:flex; flex-direction:column; gap:5px; min-width:0}
.hc-panel__brend{font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-panel__imya{
  font-size:13.5px; font-weight:600; line-height:1.3; color:var(--tekst);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.hc-panel__niz{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px}
.hc-panel__cena{font-size:15px; font-weight:800; white-space:nowrap}
.hc-panel__ubrat{
  position:absolute; top:8px; right:8px; width:26px; height:26px; border-radius:50%;
  border:none; background:transparent; color:var(--tekst-3); cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .15s, color .15s;
}
.hc-panel__ubrat:hover{background:var(--kras-fon); color:var(--kras)}

.hc-panel__itog{
  flex:none; padding:16px 20px 20px; border-top:1px solid var(--ram);
  display:flex; flex-direction:column; gap:10px; background:var(--fon-5);
}
.hc-panel__itog-stroka{display:flex; align-items:baseline; justify-content:space-between; gap:12px; font-size:14px; color:var(--tekst-2)}
.hc-panel__itog-summa{
  font-size:22px; font-weight:800; color:var(--tekst);
  transition:transform .3s cubic-bezier(.22,.9,.26,1), color .3s;
}
.hc-panel__itog-summa.hc-migaet{transform:scale(1.07); color:var(--zol-tmn)}
.hc-panel__pusto{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; padding:40px 20px; text-align:center; color:var(--tekst-2);
}
.hc-panel__pusto .hc-z{color:var(--ram-5)}
.hc-panel__pusto-zag{font-size:17px; font-weight:700; color:var(--tekst)}

/* ── нижняя полоса ── */
.hc-polosa{
  position:fixed; left:0; right:0; bottom:0; z-index:290;
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  padding:14px clamp(16px, 4vw, 40px);
  background:rgba(255,255,255,.92); backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-top:1px solid var(--ram); box-shadow:0 -18px 44px -28px rgba(21,20,15,.5);
  transform:translateY(100%); transition:transform .36s cubic-bezier(.22,.9,.26,1);
}
.hc-polosa.hc-vidna{transform:none}
.hc-polosa[hidden]{display:none}
.hc-polosa__levo{display:flex; align-items:center; gap:14px; min-width:0; flex:1}
.hc-polosa__galka{
  width:34px; height:34px; border-radius:50%; background:var(--zel-fon); color:var(--zel);
  display:flex; align-items:center; justify-content:center; flex:none;
  animation:hcgalka .45s cubic-bezier(.22,.9,.26,1) both;
}
@keyframes hcgalka{from{transform:scale(.4);opacity:0}60%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}
.hc-polosa__kart{
  width:52px; height:52px; border-radius:var(--r-m); background:var(--fon-2); flex:none;
  display:flex; align-items:center; justify-content:center; padding:5px; overflow:hidden;
}
.hc-polosa__kart img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; mix-blend-mode:multiply}
.hc-polosa__telo{display:flex; flex-direction:column; gap:2px; min-width:0}
.hc-polosa__podpis{font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--zel)}
.hc-polosa__imya{
  font-size:14.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:46ch;
}
.hc-polosa__pravo{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.hc-polosa__itog{display:flex; flex-direction:column; align-items:flex-end; gap:1px}
.hc-polosa__itog-podpis{font-size:11px; color:var(--tekst-2)}
.hc-polosa__itog-summa{font-size:18px; font-weight:800; white-space:nowrap}
.hc-polosa__zakryt{
  width:34px; height:34px; border-radius:50%; border:none; background:transparent;
  color:var(--tekst-3); cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.hc-polosa__zakryt:hover{background:var(--fon-2); color:var(--tekst)}

body.hc-korzina-zhdyot .hc-schyot__kn,
body.hc-korzina-zhdyot .hc-v-korzinu{pointer-events:none}

@media (max-width:1099px){
  .hc-polosa__panel{display:none}
}
@media (max-width:639px){
  .hc-panel{width:100vw}
  .hc-polosa{
    bottom:72px; padding:12px 16px; gap:10px;
    flex-direction:column; align-items:stretch;
  }
  .hc-polosa__levo{width:100%}
  .hc-polosa__pravo{width:100%; justify-content:space-between}
  .hc-polosa__imya{max-width:none}
  .hc-polosa__oformit{flex:1; justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .hc-panel,.hc-polosa,.hc-zaten,.hc-schyot__chislo,.hc-karta__dejstvie *{transition:none; animation:none}
}


/* ===== glavnaya.css ===== */
/* ──────────────────────────────────────────────────────────────────────────
   Главная страница. Числа — замером из дизайна.
   ────────────────────────────────────────────────────────────────────────── */
.hc-dom{padding-top:20px}

/* ── первый экран ── */
.hc-geroj__verh{display:grid; grid-template-columns:330px minmax(0,1fr); gap:16px; align-items:stretch}
.hc-geroj--ribbon .hc-geroj__verh{grid-template-columns:minmax(0,1fr)}
.hc-geroj__pravo{display:flex; flex-direction:column; gap:14px; min-width:0}

/* колонка разделов */
.hc-kolonka{
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-28);
  padding:10px; display:flex; flex-direction:column; gap:2px;
  box-shadow:0 24px 48px -36px rgba(22,23,27,.35);
}
.hc-kolonka__shapka{display:flex; align-items:center; justify-content:space-between; padding:8px 10px 10px}
.hc-kolonka__zag{font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--tekst-2)}
.hc-kolonka__schet{font-size:11px; color:var(--zol-tmn)}
.hc-kolonka__punkt{
  display:flex; align-items:center; gap:12px; padding:5px 8px 5px 6px;
  border-radius:var(--r-14); background:transparent; cursor:pointer;
  flex:1; min-height:40px; transition:background .15s; color:var(--tekst);
}
.hc-kolonka__punkt:hover{background:var(--fon); color:var(--tekst)}
.hc-kolonka__znachok{
  width:34px; height:34px; border-radius:11px; background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; flex:none; transition:background .15s;
}
.hc-kolonka__punkt:hover .hc-kolonka__znachok{background:var(--zol-fon)}
.hc-kolonka__kart{display:block; flex:none; width:26px; height:26px; filter:sepia(.35) saturate(.85); background:center/contain no-repeat}
.hc-kolonka__zapas{color:var(--zol-tmn)}
.hc-kolonka__imya{flex:1; min-width:0; font-size:14px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.hc-kolonka__punkt:hover .hc-kolonka__imya{font-weight:700}
.hc-kolonka__kolvo{font-size:10.5px; color:var(--tekst-5)}
.hc-kolonka__strelka{color:var(--ram-4); transition:color .15s}
.hc-kolonka__punkt:hover .hc-kolonka__strelka{color:var(--zol)}
.hc-kolonka__vse{
  margin-top:6px; height:44px; border:none; border-radius:var(--r-14);
  background:var(--sin); color:var(--bel); font-size:14px; font-weight:600;
  display:flex; align-items:center; justify-content:space-between; padding:0 8px 0 16px; cursor:pointer;
}
.hc-kolonka__vse:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-kolonka__vse-znak{
  width:30px; height:30px; border-radius:var(--r-s); background:var(--zol); color:var(--chern);
  display:flex; align-items:center; justify-content:center; flex:none;
}

/* лента баннеров */
.hc-lenta-ban{
  position:relative; border-radius:var(--r-28); overflow:hidden; width:100%;
  aspect-ratio:1100/500; flex:none; background:var(--ram);
  box-shadow:0 30px 60px -40px rgba(22,23,27,.55), 0 0 0 1px rgba(22,23,27,.04);
}
.hc-lenta-ban__kadr{
  position:absolute; inset:0; display:block; width:100%; height:100%;
  opacity:0; transform:scale(1.06); pointer-events:none;
  transition:opacity .9s ease, transform 7s ease-out;
  background:center center/cover no-repeat;
}
.hc-lenta-ban__kadr.hc-vkl{opacity:1; transform:scale(1); pointer-events:auto}
.hc-lenta-ban__ten{
  position:absolute; left:0; right:0; bottom:0; height:42%;
  background:linear-gradient(180deg, rgba(14,15,18,0) 0%, rgba(14,15,18,.55) 100%);
  pointer-events:none;
}
.hc-lenta-ban__polosy{position:absolute; left:18px; right:18px; top:16px; display:flex; gap:4px; pointer-events:none}
.hc-lenta-ban__polosa{
  flex:1; height:3px; border-radius:2px; background:rgba(255,255,255,.35);
  overflow:hidden; position:relative;
}
.hc-lenta-ban__polosa>span{position:absolute; left:0; top:0; bottom:0; width:0; background:var(--bel)}
.hc-lenta-ban__polosa.hc-vkl>span{animation:hcprog 6.5s linear forwards}
.hc-lenta-ban__niz{position:absolute; left:16px; right:16px; bottom:16px; display:flex; align-items:center; gap:12px}
.hc-lenta-ban__karta{
  display:none; flex:1; min-width:0; align-items:center; gap:12px; padding:6px;
  border-radius:var(--r-20); background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px) saturate(1.4); -webkit-backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:0 14px 34px -16px rgba(0,0,0,.5); cursor:pointer; max-width:440px; color:var(--tekst);
}
.hc-lenta-ban__karta.hc-vkl{display:flex}
.hc-lenta-ban__logo{
  width:76px; height:44px; border-radius:var(--r-14); background:var(--bel);
  display:flex; align-items:center; justify-content:center; padding:6px 8px; flex:none;
}
.hc-lenta-ban__logo>span[role="img"]{flex:none; display:block; width:100%; height:100%; background:center center/contain no-repeat}
.hc-lenta-ban__logo-tekst{font-size:10.5px; font-weight:800; letter-spacing:.06em; text-align:center}
.hc-lenta-ban__telo{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px}
.hc-lenta-ban__brend{font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--zol-tmn)}
.hc-lenta-ban__zag{font-size:14.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.hc-lenta-ban__smotret{
  height:44px; padding:0 6px 0 14px; border-radius:var(--r-14); background:var(--sin);
  color:var(--bel); font-size:13px; font-weight:600; display:flex; align-items:center; gap:8px; flex:none;
}
.hc-kvadrat{
  width:30px; height:30px; border-radius:var(--r-s); background:var(--zol); color:var(--chern);
  display:flex; align-items:center; justify-content:center; flex:none;
}
.hc-kvadrat--bol{width:36px; height:36px; border-radius:var(--r-m)}
.hc-lenta-ban__strelki{
  display:flex; align-items:center; gap:4px; padding:5px; border-radius:var(--r-kr);
  background:rgba(255,255,255,.82); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 14px 34px -16px rgba(0,0,0,.5); margin-left:auto;
}
.hc-lenta-ban__strelka{
  width:38px; height:38px; border-radius:50%; border:none; background:transparent; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:var(--tekst);
}
.hc-lenta-ban__strelka:hover{background:var(--fon-2)}
.hc-lenta-ban__strelka--vpered{background:var(--sin); color:var(--bel)}
.hc-lenta-ban__strelka--vpered:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-lenta-ban__nomer{padding:0 4px; font-size:12px}
.hc-tusklo{color:var(--tekst-3)}

/* три плитки */
.hc-tri{flex:1; min-height:120px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.hc-tri__plitka{
  position:relative; border-radius:var(--r-24); background:var(--bel); border:1px solid var(--ram);
  padding:18px 20px; display:flex; flex-direction:column; justify-content:space-between; gap:8px;
  cursor:pointer; overflow:hidden; transition:transform .25s; color:var(--tekst);
}
.hc-tri__plitka:hover{transform:translateY(-2px); color:var(--tekst)}
.hc-tri__plitka--zol{background:var(--zol-fon); border-color:transparent}
.hc-tri__plitka--tmn{background:var(--sin); border-color:transparent; color:var(--bel)}
.hc-tri__plitka--tmn:hover{color:var(--bel)}
.hc-tri__svechenie{
  position:absolute; inset:0;
  background:radial-gradient(240px 160px at 100% 0%, rgba(201,154,59,.35), transparent 70%);
}
.hc-tri__fon{
  position:absolute; right:-6px; bottom:-26px; font-size:104px; font-weight:800;
  letter-spacing:-.06em; color:rgba(143,106,30,.13); line-height:1;
}
.hc-tri__verh{display:flex; align-items:center; justify-content:space-between; position:relative; gap:8px}
.hc-tri__metka{
  font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--zol-tmn); position:relative;
}
.hc-tri__metka--seraya{color:var(--tekst-2)}
.hc-tri__metka--zol{color:var(--zol-svt)}
.hc-tri__segodnya{display:flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; color:var(--zel)}
.hc-tri__tochka{width:7px; height:7px; border-radius:50%; background:var(--zel-svt); box-shadow:0 0 0 3px rgba(46,158,91,.18)}
.hc-tri__znak{color:var(--tekst-2)}
.hc-tri__znak--zol{color:var(--zol-svt)}
.hc-tri__telo{display:flex; flex-direction:column; gap:2px; position:relative}
.hc-tri__telo--ryad{flex-direction:row; align-items:flex-end; justify-content:space-between; gap:10px}
.hc-tri__stolbec{display:flex; flex-direction:column; gap:2px}
.hc-tri__zag{font-size:19px; font-weight:700; letter-spacing:-.02em; line-height:1.15}
.hc-tri__pod{font-size:12.5px; color:var(--tekst-2)}
.hc-tri__plitka--zol .hc-tri__pod{color:var(--zol-glb)}
.hc-tri__pod--tmn{color:var(--ram-6)}

/* ── плитки разделов ── */
.hc-plitki-razd{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px}
.hc-plitka-razd{
  display:flex; flex-direction:column; gap:10px; padding:16px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-22);
  color:var(--tekst); transition:border-color .2s, transform .2s, box-shadow .2s;
}
.hc-plitka-razd:hover{border-color:var(--sin); transform:translateY(-2px); color:var(--tekst);
  box-shadow:0 14px 30px -18px rgba(22,23,27,.35)}
.hc-plitka-razd__kart{
  height:150px; background:var(--fon-2); border-radius:var(--r-16);
  display:flex; align-items:center; justify-content:center; padding:14%;
}
.hc-plitka-razd__kart img{
  display:block; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply;
}
.hc-plitka-razd__zapas{color:var(--zol-tmn)}
.hc-plitka-razd__imya{font-size:14.5px; font-weight:600; line-height:1.25}
.hc-plitka-razd__kolvo{font-size:11.5px; color:var(--tekst-3)}

/* ── подбор мощности и сервис ── */
.hc-para{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.hc-podbor{
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn);
  padding:var(--pad); display:flex; flex-direction:column; gap:22px;
}
.hc-podbor__shapka{display:flex; align-items:center; gap:10px}
.hc-podbor__znak{color:var(--zol)}
.hc-podbor__metka{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ram-6)}
.hc-podbor__cifra{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
.hc-podbor__kvt{font-size:64px; font-weight:800; letter-spacing:-.04em; line-height:1; color:var(--zol)}
.hc-podbor__ed{font-size:22px; font-weight:600}
.hc-podbor__dom{font-size:15px; color:var(--ram-6)}
.hc-podbor__polzun{display:flex; flex-direction:column; gap:8px}
.hc-podbor__polzun input[type=range]{width:100%; accent-color:var(--zol); height:28px; cursor:pointer}
.hc-podbor__shkala{display:flex; justify-content:space-between; font-size:12px; color:var(--tekst-4)}
.hc-podbor__sovet{margin:0; font-size:15px; line-height:1.5; color:var(--zagl); text-wrap:pretty}
.hc-podbor__knopki{display:flex; gap:10px; flex-wrap:wrap; margin-top:auto}
.hc-podbor__kn2{border:1px solid var(--sin-ram2); background:transparent; color:var(--bel)}
.hc-podbor__kn2:hover{background:var(--sin-ram); color:var(--bel)}

.hc-servis-blok{
  border-radius:var(--r-28); background:var(--bel); border:1px solid var(--ram);
  padding:var(--pad); display:flex; flex-direction:column; gap:22px;
}
.hc-servis-blok__shapka{display:flex; align-items:center; gap:10px}
.hc-servis-blok__metka{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-servis-blok__zag{font-size:30px; font-weight:700; letter-spacing:-.025em; line-height:1.1; text-wrap:pretty}
.hc-servis-blok__setka{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hc-servis-blok__plitka{display:flex; flex-direction:column; gap:4px; padding:14px; border-radius:var(--r-16); background:var(--fon)}
.hc-servis-blok__plitka-zag{font-size:14px; font-weight:700}
.hc-servis-blok__plitka-pod{font-size:13px; color:var(--tekst-2); line-height:1.4}
.hc-servis-blok__kn{margin-top:auto; align-self:flex-start}

/* ── полоса доверия ── */
.hc-doverie{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  border-radius:var(--r-24); background:var(--bel); border:1px solid var(--ram); overflow:hidden;
}
.hc-doverie__punkt{display:flex; align-items:center; gap:14px; padding:18px 20px; min-width:0}
.hc-doverie__znak{
  width:46px; height:46px; border-radius:var(--r-14); background:var(--zol-fon); color:var(--zol-tmn);
  display:flex; align-items:center; justify-content:center; flex:none;
}
.hc-doverie__telo{display:flex; flex-direction:column; gap:2px; min-width:0}
.hc-doverie__zag{font-size:14.5px; font-weight:700}
.hc-doverie__pod{font-size:12.5px; color:var(--tekst-2)}

/* ── бренды ── */
.hc-brendy-setka{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px}
.hc-brend-plitka{
  position:relative; aspect-ratio:16/10; border-radius:18px; background:var(--bel);
  border:1px solid var(--ram); display:flex; align-items:center; justify-content:center;
  padding:18% 16%; transition:border-color .2s, box-shadow .2s;
}
.hc-brend-plitka:hover{border-color:var(--sin); box-shadow:0 10px 30px -14px rgba(21,20,15,.3)}
.hc-brend-plitka__logo{flex:none; display:block; width:100%; height:100%; object-fit:contain}
.hc-brend-plitka__imya{font-size:14px; font-weight:800; letter-spacing:.03em; text-align:center}
.hc-brend-plitka__kolvo{position:absolute; left:10px; bottom:8px; font-size:10px; color:var(--tekst-3)}

/* ── полоса сервиса ── */
.hc-polosa-servis{
  display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:28px;
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn); padding:var(--pad);
}
.hc-polosa-servis__metka{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--zol-svt)}
.hc-polosa-servis__zag{font-size:30px; font-weight:800; letter-spacing:-.025em; line-height:1.1; margin:14px 0 10px; text-wrap:pretty}
.hc-polosa-servis__opis{margin:0 0 20px; font-size:15px; line-height:1.55; color:var(--zagl); max-width:560px}
.hc-polosa-servis__knopki{display:flex; gap:10px; flex-wrap:wrap}
.hc-polosa-servis__kn2{border:1px solid var(--sin-ram2); background:transparent; color:var(--bel)}
.hc-polosa-servis__kn2:hover{background:var(--sin-ram); color:var(--bel)}
.hc-polosa-servis__cifry{display:flex; flex-direction:column; gap:12px; justify-content:center}
.hc-polosa-servis__cifra{padding:14px 16px; border-radius:var(--r-16); background:var(--sin-svt)}
.hc-polosa-servis__cifra-zag{display:block; font-size:15px; font-weight:700}
.hc-polosa-servis__cifra-pod{display:block; font-size:12.5px; color:var(--ram-6)}

/* ── о компании ── */
.hc-o-nas{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0;
  border-radius:var(--r-28); overflow:hidden; background:var(--bel); border:1px solid var(--ram);
}
.hc-o-nas__foto{min-height:320px; background:var(--zagl); overflow:hidden}
.hc-o-nas__foto img{width:100%; height:100%; min-height:320px; object-fit:cover; display:block}
.hc-o-nas__telo{padding:var(--pad); display:flex; flex-direction:column; justify-content:center; gap:12px}
.hc-o-nas__metka{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-o-nas__zag{font-size:30px; font-weight:800; letter-spacing:-.025em; line-height:1.1}
.hc-o-nas__text{margin:0; font-size:15px; line-height:1.6; color:var(--tekst-2)}
.hc-o-nas__knopki{display:flex; gap:10px; flex-wrap:wrap; margin-top:8px}

/* ── партнёры ── */
.hc-partnery{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px}
.hc-partner{
  aspect-ratio:16/9; border-radius:18px; background:var(--bel); border:1px solid var(--ram);
  display:flex; align-items:center; justify-content:center; padding:16%;
}
.hc-partner img{display:block; width:100%; height:100%; object-fit:contain}
.hc-partner__imya{font-size:13px; font-weight:800; letter-spacing:.04em; text-align:center}

@media (max-width:1099px){
  .hc-geroj__verh{grid-template-columns:minmax(0,1fr)}
  .hc-kolonka{display:none}
  .hc-plitki-razd{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hc-para{grid-template-columns:minmax(0,1fr)}
  .hc-brendy-setka,.hc-partnery{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hc-doverie{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-polosa-servis,.hc-o-nas{grid-template-columns:minmax(0,1fr)}
  .hc-servis-blok__zag,.hc-polosa-servis__zag,.hc-o-nas__zag{font-size:26px}
}
@media (max-width:639px){
  .hc-dom{padding-top:12px}
  .hc-tri{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
  .hc-tri__plitka--tmn{grid-column:1 / -1}
  .hc-plitki-razd{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
  .hc-plitka-razd__kart{height:118px}
  .hc-brendy-setka,.hc-partnery{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hc-doverie{grid-template-columns:minmax(0,1fr)}
  .hc-lenta-ban__niz{left:10px; right:10px; bottom:10px}
  .hc-lenta-ban__karta{display:none!important}
  .hc-podbor__kvt{font-size:48px}
  .hc-servis-blok__zag,.hc-polosa-servis__zag,.hc-o-nas__zag{font-size:23px}
  .hc-o-nas__foto{min-height:220px}
}


/* ===== katalog.css ===== */
/* ── Список товаров: шапка, фильтры, подразделы, разбивка ───────────────── */
.hc-spisok{display:flex; flex-direction:column; gap:20px; padding-bottom:var(--sec)}
.hc-spisok__shapka{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap}
.hc-spisok__zag{font-size:48px; font-weight:800; letter-spacing:-.03em; line-height:1.05}
.hc-spisok__schet{font-size:14px; color:var(--tekst-2); margin-top:6px}
.hc-spisok__pravo{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.hc-spisok__filtry-kn{display:none; position:relative}
.hc-spisok__tochka{position:absolute; top:4px; right:4px; width:7px; height:7px; border-radius:50%; background:var(--zol)}

.hc-sort{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--tekst-2); flex-wrap:wrap}
.hc-sort__podpis{font-weight:600}
.hc-sort__spisok{display:flex; gap:2px; padding:2px; border-radius:var(--r-s); background:var(--fon-2); border:1px solid var(--ram)}
.hc-sort__punkt{
  height:28px; padding:0 10px; border-radius:8px; font-size:13px; font-weight:600;
  color:var(--tekst-2); display:flex; align-items:center; white-space:nowrap;
}
.hc-sort__punkt:hover{color:var(--tekst)}
.hc-sort__punkt.hc-vkl{background:var(--bel); color:var(--tekst); box-shadow:var(--ten)}

.hc-spisok__telo{display:grid; grid-template-columns:272px minmax(0,1fr); gap:24px; align-items:start}
.hc-spisok__tovary{display:flex; flex-direction:column; gap:18px; min-width:0}
.hc-spisok__opis{font-size:15px; line-height:1.6; color:var(--tekst-2); padding-top:10px; border-top:1px solid var(--ram)}

/* подразделы */
.hc-podrazdely{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px}
.hc-podrazdely::-webkit-scrollbar{display:none}
.hc-podrazdel{
  flex:none; display:flex; align-items:center; gap:10px; height:56px; padding:0 16px 0 10px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel); color:var(--tekst);
  transition:border-color .2s, transform .2s;
}
.hc-podrazdel:hover{border-color:var(--sin); transform:translateY(-2px); color:var(--tekst)}
.hc-podrazdel__logo{width:64px; height:34px; flex:none; background:left center/contain no-repeat}
.hc-podrazdel__imya{font-size:13.5px; font-weight:600; white-space:nowrap}
.hc-podrazdel__kolvo{font-size:11px; color:var(--tekst-3)}

/* фильтры */
.hc-filtry{
  display:flex; flex-direction:column; gap:18px; position:sticky; top:158px;
  max-height:calc(100vh - 180px); overflow-y:auto; padding-right:4px;
}
.hc-filtry__blok{
  display:flex; flex-direction:column; gap:10px; padding:16px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-filtry__zag{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-filtry__stolbiki{display:flex; align-items:flex-end; gap:4px; height:46px}
.hc-filtry__stolbik{flex:1; background:var(--ram-2); border-radius:3px 3px 0 0; min-height:4px}
.hc-filtry__stolbik.hc-vkl{background:var(--zol)}
.hc-filtry__polosy{display:flex; flex-direction:column; gap:4px}
.hc-filtry__polosa{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  height:34px; padding:0 10px; border-radius:var(--r-s); font-size:13px; font-weight:600;
  color:var(--tekst); background:transparent;
}
.hc-filtry__polosa:hover{background:var(--fon); color:var(--tekst)}
.hc-filtry__polosa.hc-vkl{background:var(--zol-fon); color:var(--zol-tmn)}
.hc-filtry__polosa.hc-pusta{opacity:.45}
.hc-filtry__polosa .hc-cif{font-size:11px; color:var(--tekst-3)}

.hc-perek{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:8px 4px; font-size:14px; color:var(--tekst); cursor:pointer;
}
.hc-perek:hover{color:var(--tekst)}
.hc-perek__ryl{
  width:40px; height:23px; border-radius:var(--r-kr); background:var(--ram-2);
  flex:none; position:relative; transition:background .2s;
}
.hc-perek__ryl>span{
  position:absolute; top:3px; left:3px; width:17px; height:17px; border-radius:50%;
  background:var(--bel); transition:transform .2s; box-shadow:0 1px 3px rgba(0,0,0,.18);
}
.hc-perek.hc-vkl .hc-perek__ryl{background:var(--zol)}
.hc-perek.hc-vkl .hc-perek__ryl>span{transform:translateX(17px)}
.hc-perek--mal{padding:0; font-size:13px; font-weight:600}

.hc-filtry__poisk{
  display:flex; align-items:center; gap:8px; height:38px; padding:0 10px;
  border:1px solid var(--ram); border-radius:var(--r-s); background:var(--fon);
}
.hc-filtry__poisk .hc-z{color:var(--tekst-2)}
.hc-filtry__poisk input{flex:1; min-width:0; border:none; background:transparent; outline:none; font-size:13.5px}
.hc-filtry__spisok{display:flex; flex-direction:column; gap:2px; max-height:300px; overflow-y:auto}
.hc-filtry__punkt{
  display:flex; align-items:center; gap:9px; padding:6px 8px; border-radius:var(--r-s);
  font-size:13.5px; color:var(--tekst);
}
.hc-filtry__punkt:hover{background:var(--fon); color:var(--tekst)}
.hc-filtry__galka{
  width:18px; height:18px; flex:none; border:1.5px solid var(--ram-4); border-radius:5px;
  display:flex; align-items:center; justify-content:center; color:transparent;
}
.hc-filtry__punkt.hc-vkl .hc-filtry__galka{background:var(--zol); border-color:var(--zol); color:var(--chern)}
.hc-filtry__logo{width:44px; height:18px; flex:none; background:left center/contain no-repeat}
.hc-filtry__imya{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.hc-filtry__kolvo{font-size:11px; color:var(--tekst-3)}
.hc-filtry__sbros{
  display:flex; align-items:center; justify-content:center; gap:8px; height:44px;
  border-radius:var(--r-m); border:1px solid var(--ram); background:var(--bel);
  font-size:14px; font-weight:600; color:var(--tekst);
}
.hc-filtry__sbros:hover{background:var(--fon); color:var(--tekst)}

/* выбранные фильтры */
.hc-vybrano{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.hc-vybrano__plashka{
  display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 8px 0 12px;
  border-radius:var(--r-kr); background:var(--zol-fon); color:var(--zol-tmn);
  font-size:13px; font-weight:600;
}
.hc-vybrano__plashka:hover{background:var(--zol-fon2); color:var(--zol-glb)}
.hc-vybrano__sbros{font-size:13px; font-weight:600; color:var(--tekst-2); text-decoration:underline}

/* шапка бренда */
.hc-brend-shapka{
  display:grid; grid-template-columns:220px minmax(0,1fr); gap:24px; align-items:center;
  padding:24px; background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-28);
  margin-bottom:20px;
}
/* Полотно белое по той же причине, что и в списке брендов: у части знаков
   белая подложка впечатана в файл (assets/css/stranicy.css). */
.hc-brend-shapka__logo{
  height:88px; background:var(--bel); border-radius:var(--r-16);
  display:flex; align-items:center; justify-content:center; padding:12px;
}
.hc-brend-shapka__logo span[role="img"]{display:block; width:100%; height:100%; background:center/contain no-repeat}
.hc-brend-shapka__imya{font-size:22px; font-weight:800; letter-spacing:.04em}
.hc-brend-shapka__telo{display:flex; flex-direction:column; gap:10px}
.hc-brend-shapka__zag{font-size:34px; font-weight:800; letter-spacing:-.025em}
.hc-brend-shapka__stroka{display:flex; gap:8px; flex-wrap:wrap}
.hc-brend-shapka__opis{margin:0; font-size:14.5px; line-height:1.55; color:var(--tekst-2)}

/* пусто */
.hc-pusto{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  padding:56px 20px; text-align:center;
  background:var(--bel); border:1px dashed var(--ram-4); border-radius:var(--r-24);
}
.hc-pusto__znak{color:var(--ram-5)}
.hc-pusto__cifra{font-size:64px; font-weight:800; color:var(--zol)}
.hc-pusto__zag{font-size:20px; font-weight:700}
.hc-pusto__pod{font-size:14.5px; color:var(--tekst-2); max-width:440px}
.hc-pusto__knopki{display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:8px}

/* разбивка */
.hc-stranicy{display:flex; gap:6px; flex-wrap:wrap; justify-content:center; padding:10px 0}
.hc-stranicy a,.hc-stranicy span{
  min-width:42px; height:42px; padding:0 12px; border-radius:var(--r-m);
  border:1px solid var(--ram); background:var(--bel); color:var(--tekst);
  display:flex; align-items:center; justify-content:center; gap:6px;
  font-size:14px; font-weight:600; font-family:var(--sh-cif);
}
.hc-stranicy a:hover{background:var(--fon); color:var(--tekst); border-color:var(--ram-4)}
.hc-stranicy .current{background:var(--sin); border-color:var(--sin); color:var(--bel)}
.hc-stranicy .dots{border:none; background:transparent}

/* сообщения WooCommerce */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  list-style:none; margin:0 0 16px; padding:14px 18px; border-radius:var(--r-14);
  font-size:14.5px; background:var(--fon-2); border:1px solid var(--ram); color:var(--tekst);
}
.woocommerce-message{background:var(--zel-fon); border-color:transparent; color:var(--zel)}
.woocommerce-error{background:var(--kras-fon); border-color:transparent; color:var(--kras)}
.woocommerce-message .button,.woocommerce-info .button{float:right; font-weight:700; text-decoration:underline}

@media (max-width:1099px){
  .hc-spisok__zag{font-size:38px}
  .hc-spisok__telo{grid-template-columns:minmax(0,1fr)}
  .hc-spisok__filtry-kn{display:inline-flex}
  .hc-filtry{
    position:fixed; left:0; right:0; bottom:0; top:auto; z-index:80;
    max-height:88vh; border-radius:var(--r-28) var(--r-28) 0 0; background:var(--bel);
    box-shadow:var(--ten-v); padding:18px; display:none; overflow-y:auto;
  }
  .hc-filtry.hc-otkryt{display:flex}
  .hc-brend-shapka{grid-template-columns:minmax(0,1fr)}
  .hc-brend-shapka__zag{font-size:28px}
}
@media (max-width:639px){
  .hc-spisok__zag{font-size:28px}
  .hc-sort__podpis{display:none}
}

/* ── «Умный подбор» в панели фильтров (экран 03) ───────────────────────── */
.hc-podbor-kart{
  display:flex; flex-direction:column; gap:8px; padding:16px;
  border-radius:var(--r-16); background:var(--chern); color:var(--bel);
}
.hc-podbor-kart__zag{
  display:flex; align-items:center; gap:7px; font-size:14px; font-weight:700;
}
.hc-podbor-kart__zag .hc-z{color:var(--zol)}
.hc-podbor-kart__pod{font-size:12.5px; line-height:1.4; color:rgba(255,255,255,.66)}
.hc-podbor-kart__pole{
  display:flex; align-items:center; gap:6px; padding:4px 4px 4px 12px; margin-top:2px;
  border-radius:var(--r-m); background:rgba(255,255,255,.1);
}
.hc-podbor-kart__pole input{
  flex:1; min-width:0; height:34px; border:0; background:none; outline:none;
  font:inherit; font-size:12.5px; color:var(--bel);
}
.hc-podbor-kart__pole input::placeholder{color:rgba(255,255,255,.5)}
.hc-podbor-kart__pole button{
  flex:none; width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  border:0; border-radius:9px; background:var(--zol); color:var(--chern); cursor:pointer;
}
.hc-podbor-kart__pole button:hover{background:var(--zol-svt)}
.hc-vybrano__podbor{
  display:inline-flex; align-items:center; gap:7px; padding:7px 12px; margin-right:4px;
  border-radius:var(--r-kr); background:var(--zol-fon); color:var(--zol-glb); font-size:13px;
}
.hc-vybrano__podbor b{color:var(--tekst)}


/* ===== tovar.css ===== */
/* ── Страница товара ─────────────────────────────────────────────────────── */
.hc-tovar-stranica{display:flex; flex-direction:column; gap:var(--sec); padding-bottom:var(--sec)}
.hc-tovar__verh{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:32px; align-items:start}

/* галерея */
.hc-gal{display:flex; flex-direction:column; gap:12px; position:sticky; top:158px}
.hc-gal__glavnoe{
  position:relative; aspect-ratio:1/1; background:var(--fon-2);
  border:1px solid var(--ram); border-radius:var(--r-28);
  display:flex; align-items:center; justify-content:center; padding:7%; overflow:hidden;
}
.hc-gal__glavnoe img{
  max-width:100%; max-height:100%; width:auto; height:auto; display:block;
  mix-blend-mode:multiply; transition:transform .35s ease;
}
.hc-gal__glavnoe.hc-uvelich img{transform:scale(1.8); cursor:zoom-out}
.hc-gal__net{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:var(--tekst-3); font-family:var(--sh-cif); font-size:12px;
}
.hc-gal__podskazka{
  position:absolute; right:16px; bottom:16px; display:inline-flex; align-items:center; gap:6px;
  height:28px; padding:0 11px; border-radius:var(--r-kr); background:rgba(255,255,255,.85);
  font-size:12px; color:var(--tekst-2);
}
.hc-gal__lenta{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none}
.hc-gal__lenta::-webkit-scrollbar{display:none}
.hc-gal__mal{
  flex:none; width:82px; height:82px; padding:6px; border-radius:var(--r-14);
  border:1px solid var(--ram); background:var(--bel); cursor:pointer; overflow:hidden;
}
.hc-gal__mal.hc-vkl{border-color:var(--sin); border-width:2px}
.hc-gal__mal img{width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply}

.hc-tovar__doverie{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:6px}
.hc-tovar__doverie-punkt{
  display:flex; align-items:center; gap:8px; padding:12px 14px;
  border-radius:var(--r-14); background:var(--bel); border:1px solid var(--ram);
  font-size:13px; font-weight:600;
}
.hc-tovar__doverie-punkt .hc-z{color:var(--zol-tmn)}

/* покупка */
.hc-pokupka{display:flex; flex-direction:column; gap:16px; min-width:0}
.hc-pokupka__verh{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap}
.hc-pokupka__brend{
  font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--zol-tmn);
}
.hc-pokupka__artikul{font-size:12px; color:var(--tekst-3)}
.hc-pokupka__zag{font-size:34px; font-weight:800; letter-spacing:-.03em; line-height:1.1; text-wrap:pretty}
.hc-pokupka__nalichie{display:flex; gap:8px; flex-wrap:wrap}
.hc-pokupka__korobka{
  display:flex; flex-direction:column; gap:14px; padding:22px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-24);
}
.hc-pokupka__ceny{display:flex; flex-direction:column; gap:2px}
.hc-pokupka__cena{font-size:34px; font-weight:800; letter-spacing:-.025em; line-height:1.1}
.hc-pokupka__cena2{font-size:13.5px; color:var(--tekst-2)}
.hc-pokupka__staraya{font-size:16px; color:var(--tekst-3)}
.hc-pokupka__zapros{font-size:24px; font-weight:700}
.hc-pokupka__rassrochka{
  display:flex; align-items:center; gap:8px; align-self:flex-start;
  padding:7px 12px; border-radius:var(--r-s); background:var(--zol-fon);
  color:var(--zol-glb); font-size:13px; font-weight:600;
}
.hc-pokupka__forma{display:flex; gap:10px; align-items:stretch}
.hc-pokupka__kn{flex:1}
.hc-kolvo{
  display:flex; align-items:center; gap:2px; height:56px; padding:4px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel); flex:none;
}
.hc-kolvo__kn{
  width:40px; height:48px; border:none; border-radius:var(--r-m); background:var(--fon);
  cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--tekst);
}
.hc-kolvo__kn:hover{background:var(--ram)}
.hc-kolvo__pole{
  width:54px; height:48px; border:none; text-align:center; font-size:16px; font-weight:700;
  background:transparent; outline:none; -moz-appearance:textfield;
}
.hc-kolvo__pole::-webkit-outer-spin-button,.hc-kolvo__pole::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}

.hc-pokupka__montazh input{margin-top:3px; width:18px; height:18px; accent-color:var(--zol)}
.hc-pokupka__montazh-telo{display:flex; flex-direction:column; gap:2px}
.hc-pokupka__montazh-zag{font-size:14px; font-weight:700}
.hc-pokupka__montazh-pod{font-size:12.5px; color:var(--tekst-2)}
.hc-pokupka__knopki{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.hc-pokupka__tg{margin-left:auto}

.hc-pokupka__dostavka{
  display:flex; flex-direction:column; gap:12px; padding:18px;
  border-radius:var(--r-20); border:1px solid var(--ram); background:var(--bel);
}
.hc-pokupka__stroka{display:flex; gap:12px; align-items:flex-start; font-size:14px}
.hc-pokupka__stroka>span{display:flex; flex-direction:column; gap:2px}
.hc-pokupka__stroka strong{font-weight:700}
.hc-pokupka__stroka span span{font-size:12.5px; color:var(--tekst-2)}
.hc-pokupka__napisat{
  align-self:flex-start; border:none; background:transparent; padding:0;
  font-size:13px; font-weight:700; color:var(--zol-tmn); cursor:pointer; text-decoration:underline;
}

/* вкладки */
.hc-vkladki{display:flex; flex-direction:column; gap:18px}
.hc-vkladki__shapka{display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid var(--ram); padding-bottom:10px}
.hc-vkladki__kn{
  height:40px; padding:0 16px; border:none; border-radius:var(--r-m); background:transparent;
  font-size:15px; font-weight:600; color:var(--tekst-2); cursor:pointer;
  display:flex; align-items:center; gap:7px;
}
.hc-vkladki__kn:hover{background:var(--fon-2); color:var(--tekst)}
.hc-vkladki__kn.hc-vkl{background:var(--sin); color:var(--bel)}
.hc-vkladki__kn .hc-cif{font-size:12px; opacity:.75}
.hc-vkladki__telo{display:none}
.hc-vkladki__telo.hc-vkl{display:block}

.hc-harakt{width:100%; font-size:14.5px}
.hc-harakt th{
  text-align:left; font-weight:500; color:var(--tekst-2); padding:11px 16px 11px 0;
  width:42%; vertical-align:top;
}
.hc-harakt td{padding:11px 0; font-weight:600; vertical-align:top}
.hc-harakt tr{border-bottom:1px solid var(--fon-6)}
.hc-harakt tr:last-child{border-bottom:none}

.hc-doki{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px}
.hc-dok{
  display:flex; align-items:center; gap:12px; padding:14px 16px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel); color:var(--tekst);
}
.hc-dok:hover{border-color:var(--sin); color:var(--tekst)}
.hc-dok>span{flex:1; font-size:14px; font-weight:600}
.hc-dok .hc-z:first-child{color:var(--kras)}
@media (max-width:1099px){
  .hc-tovar__verh{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px}
  .hc-gal,.hc-filtry{position:static; max-height:none}
  .hc-pokupka__zag{font-size:28px}
}
@media (max-width:639px){
  .hc-tovar__verh{grid-template-columns:minmax(0,1fr)}
  .hc-pokupka__zag{font-size:23px}
  .hc-pokupka__cena{font-size:28px}
  .hc-tovar__doverie{grid-template-columns:minmax(0,1fr)}
  .hc-pokupka__forma{flex-wrap:wrap}
  .hc-pokupka__kn{width:100%; flex:none}
  .hc-vkladki__kn{font-size:14px; padding:0 12px}
}

/* ── карточка бренда над названием ── */
.hc-brend-karta-tovara{
  display:flex; align-items:center; gap:14px; padding:12px 14px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel);
  color:var(--tekst); transition:border-color .2s, transform .2s;
}
.hc-brend-karta-tovara:hover{border-color:var(--sin); color:var(--tekst); transform:translateY(-1px)}
.hc-brend-karta-tovara__logo{
  width:96px; height:40px; flex:none; display:flex; align-items:center; justify-content:center;
}
.hc-brend-karta-tovara__logo span[role="img"]{
  display:block; width:100%; height:100%; background:left center/contain no-repeat;
}
.hc-brend-karta-tovara__imya{font-size:15px; font-weight:800; letter-spacing:.04em}
.hc-brend-karta-tovara__telo{flex:1; min-width:0; font-size:13.5px; color:var(--tekst-2)}
.hc-brend-karta-tovara .hc-z{color:var(--zol-tmn)}

/* ── строка сведений ── */
.hc-pokupka__svedeniya{display:flex; gap:8px; flex-wrap:wrap}
.hc-pokupka__svedenie{
  display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 11px;
  border-radius:var(--r-kr); background:var(--fon-2); color:var(--tekst-2);
  font-size:12.5px; font-weight:600; white-space:nowrap;
}
a.hc-pokupka__svedenie:hover{background:var(--zol-fon); color:var(--zol-tmn)}
.hc-pokupka__svedenie .hc-z{color:var(--tekst-3)}

/* ── цена во всех валютах ── */
.hc-pokupka__za-shtuku{font-size:13px; color:var(--tekst-3)}
.hc-pokupka__valyuty{display:flex; gap:6px; flex-wrap:wrap}
.hc-pokupka__valyuta{
  display:inline-flex; align-items:baseline; gap:6px; padding:5px 10px;
  border-radius:var(--r-s); background:var(--fon); font-size:12.5px; color:var(--tekst-2);
  font-family:var(--sh-cif);
}
.hc-pokupka__valyuta b{font-size:11px; font-weight:700; color:var(--tekst-3); letter-spacing:.06em}

/* ── рассрочка со сроками ── */
.hc-rassrochka{
  display:flex; flex-direction:column; gap:10px; padding:14px;
  border-radius:var(--r-16); background:var(--zol-fon);
}
.hc-rassrochka__verh{display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap}
.hc-rassrochka__zag{display:flex; align-items:center; gap:7px; font-size:14px; font-weight:700; color:var(--zol-glb)}
.hc-rassrochka__pod{font-size:12px; color:var(--zol-tmn)}
.hc-rassrochka__sroki{display:flex; gap:6px; flex-wrap:wrap}
.hc-rassrochka__srok{
  height:34px; padding:0 14px; border:1px solid var(--ram-2); border-radius:var(--r-s);
  background:var(--bel); color:var(--tekst); font-size:13px; font-weight:600;
  cursor:pointer; transition:background .18s, color .18s, border-color .18s, transform .12s;
}
.hc-rassrochka__srok:hover{border-color:var(--sin)}
.hc-rassrochka__srok:active{transform:scale(.96)}
.hc-rassrochka__srok.hc-vkl{background:var(--sin); border-color:var(--sin); color:var(--bel)}

/* ── монтаж галочкой ── */
.hc-pokupka__montazh{
  display:flex; align-items:flex-start; gap:11px; padding:14px;
  border-radius:var(--r-16); background:var(--fon); cursor:pointer;
  transition:background .18s;
}
.hc-pokupka__montazh:hover{background:var(--fon-6)}
.hc-pokupka__montazh input{position:absolute; opacity:0; width:0; height:0}
.hc-pokupka__montazh-galka{
  width:22px; height:22px; flex:none; border:1.5px solid var(--ram-4); border-radius:7px;
  display:flex; align-items:center; justify-content:center; color:transparent;
  transition:background .18s, border-color .18s, color .18s;
}
.hc-pokupka__montazh input:checked + .hc-pokupka__montazh-galka{
  background:var(--sin); border-color:var(--sin); color:var(--bel);
}
.hc-pokupka__ryad{display:flex; gap:10px; align-items:stretch}
.hc-pokupka__ryad .hc-pokupka__kn{flex:1}

/* ── быстрый запрос цены ── */
.hc-pokupka__zapros-blok{display:flex; flex-direction:column; gap:6px}
.hc-pokupka__zapros-pod{font-size:13.5px; line-height:1.5; color:var(--tekst-2)}
.hc-bystryj-zapros{
  display:flex; align-items:center; gap:8px; padding:5px 5px 5px 14px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel);
}
.hc-bystryj-zapros:focus-within{border-color:var(--zol)}
.hc-bystryj-zapros__kod{font-size:15px; font-weight:700; color:var(--tekst-2); flex:none}
.hc-bystryj-zapros__pole{
  flex:1; min-width:0; border:none; outline:none; background:transparent;
  font-size:15px; height:44px; font-family:var(--sh-cif);
}
.hc-bystryj-zapros .hc-kn{flex:none; height:44px}

/* ── знаки на галерее ── */
.hc-gal__metki{position:absolute; left:16px; top:16px; display:flex; gap:6px; flex-wrap:wrap}
.hc-gal__metka{
  display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 11px;
  border-radius:var(--r-kr); background:var(--bel); font-size:12px; font-weight:700; color:var(--tekst-2);
}
.hc-gal__metka--est{color:var(--zel)}
.hc-gal__metka--zakaz{color:var(--zol-tmn)}
.hc-gal__metka--orig{color:var(--zol-tmn)}
.hc-gal__tochka{width:6px; height:6px; border-radius:50%; background:var(--zel-svt)}
.hc-gal__kruzhki{position:absolute; right:16px; top:16px; display:flex; flex-direction:column; gap:8px; z-index:2}
.hc-gal__kruzhok{
  width:40px; height:40px; border-radius:50%; border:none; background:var(--bel);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.10); color:var(--tekst-3);
  transition:color .15s, background .15s, transform .15s;
}
.hc-gal__kruzhok:hover{color:var(--tekst); transform:scale(1.06)}
.hc-gal__kruzhok.hc-vkl{color:var(--chern)}
.hc-gal__kruzhok[data-vid="izb"].hc-vkl .hc-z{color:var(--kras); font-variation-settings:'FILL' 1}
.hc-gal__kruzhok[data-vid="sra"].hc-vkl{background:var(--zol)}

/* ── середина: вкладки и комплект рядом ── */
.hc-tovar__seredina{display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:28px; align-items:start}

.hc-komplekt{
  display:flex; flex-direction:column; gap:12px; padding:20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-24);
  position:sticky; top:158px;
}
.hc-komplekt__shapka{display:flex; align-items:center; gap:9px}
.hc-komplekt__shapka .hc-z{color:var(--zol-tmn)}
.hc-komplekt__zag{font-size:17px; font-weight:800}
.hc-komplekt__pod{font-size:13px; color:var(--tekst-2); margin-top:-6px}
.hc-komplekt__spisok{display:flex; flex-direction:column; gap:8px}
.hc-komplekt__stroka{
  display:flex; align-items:center; gap:10px; padding:9px;
  border:1px solid var(--ram); border-radius:var(--r-14); cursor:pointer;
  transition:border-color .18s, background .18s;
}
.hc-komplekt__stroka:hover{background:var(--fon-5)}
.hc-komplekt__stroka:has(input:checked){border-color:var(--sin)}
.hc-komplekt__flazhok{position:absolute; opacity:0; width:0; height:0}
.hc-komplekt__galka{
  width:20px; height:20px; flex:none; border:1.5px solid var(--ram-4); border-radius:6px;
  display:flex; align-items:center; justify-content:center; color:transparent;
  transition:background .18s, border-color .18s, color .18s;
}
.hc-komplekt__flazhok:checked + .hc-komplekt__galka{background:var(--sin); border-color:var(--sin); color:var(--bel)}
.hc-komplekt__kart{
  width:44px; height:44px; flex:none; border-radius:var(--r-s); background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; padding:3px; overflow:hidden;
}
.hc-komplekt__kart img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; mix-blend-mode:multiply}
.hc-komplekt__telo{display:flex; flex-direction:column; gap:2px; min-width:0}
.hc-komplekt__imya{
  font-size:13px; font-weight:600; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.hc-komplekt__cena{font-size:13px; font-weight:700; color:var(--zol-tmn)}
.hc-komplekt__itog{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  padding-top:10px; border-top:1px solid var(--ram); font-size:13.5px; color:var(--tekst-2);
}
.hc-komplekt__itog strong{font-size:19px; color:var(--tekst)}

/* ── пустые вкладки и документы ── */
.hc-vkladki__pusto{
  display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  padding:22px; border-radius:var(--r-16); background:var(--fon-2);
  font-size:14.5px; color:var(--tekst-2);
}
.hc-dok--zapros{
  border-style:dashed; cursor:pointer; text-align:left; background:transparent; width:100%;
  font-family:inherit;
}
.hc-dok--zapros span{display:flex; flex-direction:column; gap:1px}
.hc-dok--zapros small{font-size:12px; font-weight:500; color:var(--tekst-3)}
.hc-doki__poyasnenie{margin:12px 0 0; font-size:13px; color:var(--tekst-3)}
.hc-otzyvy-pusto{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  padding:22px; border-radius:var(--r-16); background:var(--fon-2);
}
.hc-otzyvy-pusto__zag{font-size:17px; font-weight:700; color:var(--tekst)}
.hc-otzyvy-pusto__pod{font-size:14px; color:var(--tekst-2); max-width:52ch; line-height:1.5}

/* ── отзывы: оценка звёздами ──
   Дробную долю показываем шириной золотого слоя поверх серого, а не
   округлением: 4,3 и 4,7 не должны выглядеть одинаково. */
/* width:max-content обязателен: в колоночном flex (карточка отзыва) элемент
   иначе растягивается на всю ширину, и доля золотого слоя считается от неё —
   звёзды горели все пять при оценке четыре. */
.hc-ocenka{position:relative; display:inline-flex; vertical-align:middle; line-height:0;
  width:max-content; flex:0 0 auto}
.hc-ocenka__fon{display:flex; gap:2px; line-height:0; color:var(--ram-4)}
.hc-ocenka__zol{
  display:flex; gap:2px; line-height:0;
  position:absolute; inset:0 auto 0 0; overflow:hidden; white-space:nowrap;
  color:var(--zol); pointer-events:none;
}
.hc-zvezda-z{flex:none; fill:currentColor; display:block}

/* ── отзывы: лента ── */
.hc-otzyvy{display:flex; flex-direction:column; gap:22px; margin-top:22px}
.hc-otzyvy__svod{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.hc-otzyvy__ball{font-size:26px; font-weight:800; color:var(--tekst); line-height:1}
.hc-otzyvy__skolko{font-size:13.5px; color:var(--tekst-3)}
.hc-otzyvy__lenta{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px}
.hc-otzyv{margin:0}
.hc-otzyv__telo{
  display:flex; gap:14px; padding:18px;
  border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel);
}
.hc-otzyv__bukva{
  width:40px; height:40px; flex:none; border-radius:50%;
  background:var(--fon-2); color:var(--tekst-2);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px;
}
.hc-otzyv__pravo{display:flex; flex-direction:column; gap:7px; min-width:0; flex:1}
.hc-otzyv__shapka{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.hc-otzyv__imya{font-size:14.5px; font-weight:700; color:var(--tekst)}
.hc-otzyv__kuplen{
  display:inline-flex; align-items:center; gap:4px;
  font-size:12px; font-weight:600; color:var(--zel);
}
.hc-otzyv__data{font-size:12.5px; color:var(--tekst-3); margin-left:auto}
.hc-otzyv__tekst{font-size:14.5px; line-height:1.6; color:var(--tekst-2)}
.hc-otzyv__tekst p{margin:0 0 8px}
.hc-otzyv__tekst p:last-child{margin-bottom:0}
.hc-otzyv__na-proverke{margin:0; font-size:12.5px; color:var(--tekst-3)}
.hc-otzyvy__stranicy ol{list-style:none; margin:0; padding:0; display:flex; gap:6px}
.hc-otzyvy__zapret{
  margin:0; padding:18px; border-radius:var(--r-16); background:var(--fon-2);
  font-size:14px; color:var(--tekst-2);
}

/* ── отзывы: окно отправки ── */
.hc-otzyv-forma{
  padding:22px; border:1px solid var(--ram); border-radius:var(--r-16); background:var(--bel);
}
.hc-otzyv-forma__zag{display:block; font-size:17px; font-weight:700; color:var(--tekst); margin-bottom:14px}
.hc-otzyv-forma form{display:flex; flex-direction:column; gap:14px; max-width:560px}
.hc-otzyv-forma p{margin:0}
.hc-otzyv-forma__niz{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.hc-otzyv-forma__snoska{font-size:12.5px; color:var(--tekst-3)}
.hc-otzyv-forma__kuki{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--tekst-2)}
.hc-otzyv-forma__kuki input{width:16px; height:16px; flex:none; accent-color:var(--sin)}


/* Выбор оценки: переключатели нарисованы звёздами. Порядок в разметке
   обратный (5…1), поэтому «залить до наведённой» делается соседом ~. */
.hc-ocenka-vybor{position:relative; display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:3px}
.hc-ocenka-vybor__pole{position:absolute; width:1px; height:1px; opacity:0}
.hc-ocenka-vybor__zvezda{
  color:var(--ram-4); cursor:pointer; line-height:0;
  transition:color .12s, transform .12s;
}
.hc-ocenka-vybor__zvezda:hover{transform:scale(1.12)}
.hc-ocenka-vybor__pole:checked ~ .hc-ocenka-vybor__zvezda,
.hc-ocenka-vybor__zvezda:hover,
.hc-ocenka-vybor__zvezda:hover ~ .hc-ocenka-vybor__zvezda{color:var(--zol)}
.hc-ocenka-vybor__pole:focus-visible + .hc-ocenka-vybor__zvezda{outline:2px solid var(--zol); outline-offset:2px; border-radius:4px}

/* ── нижняя полоса товара на телефоне ── */
.hc-tovar-polosa{
  position:fixed; left:0; right:0; bottom:72px; z-index:280;
  display:flex; align-items:center; gap:14px; padding:12px 16px;
  background:rgba(255,255,255,.94); backdrop-filter:blur(16px);
  border-top:1px solid var(--ram); box-shadow:0 -14px 36px -26px rgba(21,20,15,.5);
}
.hc-tovar-polosa__telo{display:flex; flex-direction:column; gap:1px; flex:1; min-width:0}
.hc-tovar-polosa__cena{font-size:18px; font-weight:800; white-space:nowrap}
.hc-tovar-polosa__pod{font-size:11.5px; color:var(--tekst-2)}
.hc-tovar-polosa .hc-kn{flex:none}

@media (max-width:1099px){
  .hc-tovar__seredina{grid-template-columns:minmax(0,1fr)}
  .hc-komplekt{position:static}
}
@media (max-width:639px){
  .hc-pokupka__ryad{flex-wrap:wrap}
  .hc-pokupka__ryad .hc-pokupka__kn{width:100%; flex:none}
  .hc-brend-karta-tovara__logo{width:72px; height:34px}
  .hc-rassrochka__srok{height:32px; padding:0 11px; font-size:12.5px}
}
.hc-vkladki__pometka{
  display:inline-flex; align-items:center; gap:6px; margin-bottom:12px; padding:5px 11px;
  border-radius:var(--r-kr); background:var(--fon); color:var(--tekst-2); font-size:12.5px;
}


/* ===== korzina.css ===== */
/* ── Корзина, оформление, спасибо ────────────────────────────────────────── */
.hc-korzina{display:flex; flex-direction:column; gap:18px; padding-bottom:var(--sec)}
.hc-korzina__schet{
  margin-left:10px; font-size:15px; font-weight:500; color:var(--tekst-2); vertical-align:middle;
}
.hc-zagolovok__kn{display:flex; align-items:center; gap:18px; flex-wrap:wrap}
.hc-korzina__ochistit{background:none; border:0; cursor:pointer; color:var(--tekst-2); font:inherit}
.hc-korzina__ochistit:hover{color:var(--krasn, #c0392b)}
.hc-progress{
  display:flex; align-items:center; gap:12px; padding:14px 18px; flex-wrap:wrap;
  border-radius:var(--r-16); background:var(--zol-fon); color:var(--zol-glb); font-size:14px;
}
.hc-progress--gotovo{background:var(--zel-fon); color:var(--zel)}
.hc-progress__polosa{flex:1; min-width:120px; height:6px; border-radius:3px; background:rgba(0,0,0,.08); overflow:hidden}
.hc-progress__polosa>span{display:block; height:100%; background:currentColor; border-radius:3px}

.hc-korzina__telo{display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:20px; align-items:start}
.hc-korzina__spisok{display:flex; flex-direction:column; gap:10px}
.hc-stroka-korziny{
  display:grid; grid-template-columns:96px minmax(0,1fr) auto auto auto; gap:16px; align-items:center;
  padding:14px; background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-stroka-korziny__kart{
  width:96px; height:96px; border-radius:var(--r-14); background:var(--fon-2);
  display:flex; align-items:center; justify-content:center; padding:8px; overflow:hidden;
}
.hc-stroka-korziny__kart img{max-width:100%; max-height:100%; width:auto; height:auto; mix-blend-mode:multiply}
.hc-stroka-korziny__telo{display:flex; flex-direction:column; gap:3px; min-width:0}
.hc-stroka-korziny__brend{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--tekst-2)}
.hc-stroka-korziny__imya{font-size:15px; font-weight:600; color:var(--tekst); line-height:1.3}
.hc-stroka-korziny__imya:hover{color:var(--zol-tmn)}
.hc-stroka-korziny__nalichie{font-size:12.5px; color:var(--zel)}
.hc-stroka-korziny__sht{font-size:12.5px; color:var(--tekst-2)}
.hc-stroka-korziny__kn{display:flex; gap:16px; margin-top:4px}
.hc-stroka-korziny__dejstvie{
  display:inline-flex; align-items:center; gap:5px; padding:0; border:0; background:none;
  cursor:pointer; font:inherit; font-size:12.5px; color:var(--tekst-2); transition:color .15s;
}
.hc-stroka-korziny__dejstvie:hover{color:var(--zol-tmn)}
.hc-stroka-korziny__dejstvie.hc-vkl{color:var(--zol-tmn)}
.hc-stroka-korziny__vtoraya{font-size:12.5px; color:var(--tekst-2)}
.hc-stroka-korziny__zapros{font-size:16px; font-weight:700}
.hc-stroka-korziny.hc-uhodit{opacity:.35; transform:translateX(12px); transition:opacity .2s, transform .2s}
.hc-stroka-korziny__cena{display:flex; flex-direction:column; align-items:flex-end; gap:2px; white-space:nowrap}
.hc-stroka-korziny__itog{font-size:17px; font-weight:700}
.hc-stroka-korziny .quantity{display:flex}
.hc-stroka-korziny .hc-kolvo__pole{
  width:64px; height:44px; border:1px solid var(--ram); border-radius:var(--r-m);
  text-align:center; font-size:15px; font-weight:700; -moz-appearance:textfield;
}
.hc-korzina__nizhnie-knopki{display:flex; gap:10px; flex-wrap:wrap; align-items:center; padding-top:4px}
.hc-korzina__itogi{position:sticky; top:158px; display:flex; flex-direction:column; gap:14px}
.hc-itogi{
  display:flex; flex-direction:column; gap:12px; padding:22px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-itogi__stroka{display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:14.5px}
.hc-itogi__stroka>span{color:var(--tekst-2)}
.hc-itogi__stroka>b{font-weight:700}
.hc-itogi__besplatno{color:var(--zel)}
.hc-itogi__pozzhe{font-weight:500; font-size:13px; color:var(--tekst-2); text-align:right}
.hc-itogi__vsego{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding-top:12px; border-top:1px solid var(--ram); font-size:17px; font-weight:700;
}
.hc-itogi__summa{display:flex; flex-direction:column; align-items:flex-end; gap:2px}
.hc-itogi__summa>b{font-size:26px; line-height:1.1; letter-spacing:-.01em}
.hc-itogi__summa>i{font-style:normal; font-size:13px; font-weight:500; color:var(--tekst-2)}
.hc-itogi__zametka{
  display:flex; gap:8px; margin:0; padding:12px 14px; border-radius:var(--r-m);
  background:var(--zol-fon); color:var(--zol-glb); font-size:13px; line-height:1.4;
}
.hc-itogi__zametka svg{flex:none; margin-top:1px}
.hc-itogi__kupon{font-size:13px}
.hc-itogi__snyat{color:var(--tekst-2)}
.hc-itogi__snyat:hover{color:var(--krasn, #c0392b)}
.hc-itogi__kn{width:100%; justify-content:center}
.hc-itogi__rassrochka{
  display:flex; align-items:center; gap:7px; margin:0; justify-content:center;
  font-size:13px; color:var(--tekst-2);
}
.hc-promo{
  display:flex; align-items:center; gap:8px; padding:4px 4px 4px 12px;
  border:1px solid var(--ram); border-radius:var(--r-m);
}
.hc-promo__znak{color:var(--tekst-2); flex:none}
.hc-promo__pole{flex:1; min-width:0; height:36px; border:0; background:none; font:inherit; font-size:13.5px; outline:none}
.hc-promo__kn{
  flex:none; height:36px; padding:0 14px; border:0; border-radius:10px; cursor:pointer;
  background:var(--fon); font:inherit; font-size:13.5px; font-weight:600; transition:background .15s;
}
.hc-promo__kn:hover{background:var(--ram)}
.hc-korzina__itogi .hc-znaki{justify-content:center; flex-wrap:wrap; gap:6px}
.hc-korzina__itogi .hc-znak{height:26px; padding:0 8px}
.hc-korzina__itogi .hc-znak img{max-height:14px}
.hc-korzina__schet b{font-weight:600; color:var(--tekst)}
.cart_totals{
  display:flex; flex-direction:column; gap:12px; padding:22px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-24);
}
.cart_totals h2{font-size:20px; margin-bottom:4px}
.cart_totals table{width:100%; font-size:14.5px}
.cart_totals th{text-align:left; font-weight:500; color:var(--tekst-2); padding:8px 0}
.cart_totals td{text-align:right; font-weight:700; padding:8px 0}
.cart_totals tr.order-total th,.cart_totals tr.order-total td{
  font-size:19px; padding-top:14px; border-top:1px solid var(--ram); color:var(--tekst);
}
.cart_totals .checkout-button{
  display:flex; align-items:center; justify-content:center; height:56px; border-radius:var(--r-16);
  background:var(--zol); color:var(--chern); font-size:16px; font-weight:800; margin-top:8px;
}
.cart_totals .checkout-button:hover{background:var(--zol-svt); color:var(--chern)}
.cart_totals .shipping-calculator-button{font-size:13px; color:var(--zol-tmn); text-decoration:underline}

.hc-korzina-pusta{
  display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center;
  padding:var(--sec) 20px;
}
.hc-korzina-pusta__znak{color:var(--ram-5)}
.hc-korzina-pusta h1{font-size:28px}
.hc-korzina-pusta p{color:var(--tekst-2); max-width:420px}
.hc-korzina-pusta__knopki{display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:8px}

/* оформление */
.hc-oformlenie{display:flex; flex-direction:column; gap:18px; padding-bottom:var(--sec)}
.hc-oformlenie__telo{display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:20px; align-items:start}
.hc-oformlenie__levo{display:flex; flex-direction:column; gap:14px; min-width:0}
.hc-oformlenie__pravo{position:sticky; top:158px}
.hc-blok{padding:22px; display:flex; flex-direction:column; gap:14px}
.hc-blok__zag{font-size:20px; font-weight:700}
.hc-blok__pod{margin:-6px 0 0; font-size:14px; color:var(--tekst-2)}

.hc-vybor{display:flex; flex-direction:column; gap:8px}
.hc-vybor__punkt{
  display:flex; align-items:center; gap:12px; padding:14px 16px;
  border:1px solid var(--ram); border-radius:var(--r-16); cursor:pointer;
  transition:border-color .15s, background .15s;
}
.hc-vybor__punkt:hover{background:var(--fon)}
.hc-vybor__punkt:has(input:checked){border-color:var(--sin); background:var(--fon-5)}
.hc-vybor__punkt input{width:20px; height:20px; accent-color:var(--zol); flex:none}
.hc-vybor__telo{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.hc-vybor__zag{font-size:15px; font-weight:700}
.hc-vybor__pod{font-size:13px; color:var(--tekst-2)}
.hc-vybor__logo{
  flex:none; height:34px; min-width:60px; padding:0 8px; border-radius:var(--r-s);
  background:var(--bel); border:1px solid var(--ram);
  display:flex; align-items:center; justify-content:center;
}
.hc-vybor__logo img{max-height:20px; max-width:72px; width:auto; height:auto; display:block}

/* поля WooCommerce в нашем виде */
.woocommerce-billing-fields__field-wrapper,.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.form-row{display:flex; flex-direction:column; gap:6px; margin:0}
.form-row-wide,.form-row.notes{grid-column:1 / -1}
.form-row label{font-size:13px; font-weight:600; color:var(--tekst-2)}
.form-row .required{color:var(--kras); text-decoration:none}
.form-row input.input-text,.form-row textarea,.form-row select,
.select2-container .select2-selection--single{
  width:100%; min-height:48px; padding:0 14px; border:1px solid var(--ram);
  border-radius:var(--r-m); font-size:15px; background:var(--bel); color:var(--tekst);
}
.form-row textarea{padding:12px 14px; min-height:92px; resize:vertical}
.form-row input.input-text:focus,.form-row textarea:focus,.form-row select:focus{outline:none; border-color:var(--zol)}
.woocommerce-invalid input.input-text{border-color:var(--kras)}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:46px; padding-left:0}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:46px}

.woocommerce-checkout-review-order-table{width:100%; font-size:14.5px}
.woocommerce-checkout-review-order-table th{text-align:left; font-weight:500; color:var(--tekst-2); padding:8px 0}
.woocommerce-checkout-review-order-table td{text-align:right; padding:8px 0; font-weight:600}
.woocommerce-checkout-review-order-table .product-name{text-align:left; font-weight:600}
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td{
  font-size:19px; font-weight:800; padding-top:14px; border-top:1px solid var(--ram);
}
#payment ul.payment_methods{list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:8px}
#payment ul.payment_methods li{padding:12px 14px; border:1px solid var(--ram); border-radius:var(--r-14)}
#payment .payment_box{font-size:13px; color:var(--tekst-2); margin-top:8px}
#place_order{
  width:100%; height:56px; border:none; border-radius:var(--r-16); background:var(--zol);
  color:var(--chern); font-size:16px; font-weight:800; cursor:pointer;
}
#place_order:hover{background:var(--zol-svt)}
/* спасибо */
.hc-spasibo__telo,.hc-spasibo__oshibka{
  max-width:720px; margin:0 auto; display:flex; flex-direction:column; align-items:center;
  gap:14px; text-align:center;
}
.hc-spasibo h1{font-size:34px}
.hc-spasibo__nomer{font-size:16px; color:var(--tekst-2); margin:0}
.hc-spasibo__svod{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; width:100%;
  padding:20px; border-radius:var(--r-20); background:var(--bel); border:1px solid var(--ram); margin-top:8px;
}
.hc-spasibo__svod>div{display:flex; flex-direction:column; gap:3px; text-align:left}
.hc-spasibo__svod span{font-size:12.5px; color:var(--tekst-2)}
.hc-spasibo__svod strong{font-size:15px}
.hc-spasibo__shagi{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; width:100%; margin-top:6px}
.hc-spasibo__shag{
  display:flex; gap:10px; align-items:flex-start; text-align:left; padding:14px;
  border-radius:var(--r-16); background:var(--fon-2); color:var(--tekst-3);
}
.hc-spasibo__shag.hc-vkl{background:var(--zel-fon); color:var(--zel)}
.hc-spasibo__shag>span{display:flex; flex-direction:column; gap:2px; color:var(--tekst)}
.hc-spasibo__shag span span{font-size:12.5px; color:var(--tekst-2)}
@media (max-width:1099px){
  .hc-korzina__telo,.hc-oformlenie__telo{grid-template-columns:minmax(0,1fr)}
  .hc-korzina__itogi,.hc-oformlenie__pravo{position:static}
}
@media (max-width:639px){
  .hc-stroka-korziny{grid-template-columns:72px minmax(0,1fr); grid-template-areas:'k t' 'c c' 'q n'; gap:10px}
  .hc-stroka-korziny__kart{width:72px; height:72px; grid-area:k}
  .hc-stroka-korziny__telo{grid-area:t}
  .hc-stroka-korziny__cena{grid-area:c; align-items:flex-start}
  .hc-stroka-korziny__kolvo{grid-area:q}
  .hc-stroka-korziny__kn{grid-area:n; justify-content:flex-end}
  .woocommerce-billing-fields__field-wrapper,.woocommerce-shipping-fields__field-wrapper{grid-template-columns:minmax(0,1fr)}
  .hc-spasibo__svod,.hc-spasibo__shagi{grid-template-columns:minmax(0,1fr)}
  .hc-spasibo h1{font-size:26px}
}

/* обёртка страниц WooCommerce внутри обычной страницы */
.hc-woo-stranica{display:block}
.hc-woo-stranica .woocommerce{display:block}
.hc-vhod__stroka{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap}
.hc-vhod__zabyl{font-size:13px; color:var(--zol-tmn)}
.hc-vhod__reg{margin-top:10px; font-size:14px}
.hc-vhod__reg summary{cursor:pointer; font-weight:600; color:var(--zol-tmn)}
.hc-vhod__reg form{margin-top:14px}

/* состав заказа и адреса на странице «Заказ оформлен» */
.hc-spasibo__podrobno{
  max-width:720px; margin:28px auto 0; text-align:left;
  display:flex; flex-direction:column; gap:18px;
}
.hc-spasibo__podrobno h2,.hc-spasibo__podrobno h3{font-size:18px; margin:0 0 10px}
.hc-spasibo__podrobno .woocommerce-order-details,
.hc-spasibo__podrobno .woocommerce-customer-details,
.hc-spasibo__podrobno .woocommerce-order-overview{
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20); padding:20px;
}
.hc-spasibo__podrobno table{width:100%; font-size:14.5px}
.hc-spasibo__podrobno th{text-align:left; font-weight:500; color:var(--tekst-2); padding:9px 0}
.hc-spasibo__podrobno td{text-align:right; padding:9px 0; font-weight:600}
.hc-spasibo__podrobno .product-name{text-align:left; font-weight:600}
.hc-spasibo__podrobno tfoot tr:last-child th,
.hc-spasibo__podrobno tfoot tr:last-child td{font-size:17px; border-top:1px solid var(--ram); padding-top:14px}
.hc-spasibo__podrobno address{font-style:normal; font-size:14.5px; line-height:1.6; color:var(--tekst-2)}
.hc-spasibo__podrobno .woocommerce-order-overview{
  list-style:none; margin:0; padding:20px; display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px;
}
.hc-spasibo__podrobno .woocommerce-order-overview li{display:flex; flex-direction:column; gap:3px; font-size:12.5px; color:var(--tekst-2)}
.hc-spasibo__podrobno .woocommerce-order-overview li strong{font-size:15px; color:var(--tekst)}
.hc-spasibo__podrobno>p{margin:0; font-size:14px; color:var(--tekst-2)}

/* ── оформление по экрану 09 ───────────────────────────────────────────── */
.hc-zagolovok__levo{display:flex; flex-direction:column; gap:6px}
.hc-oformlenie__nazad{font-size:13.5px; color:var(--tekst-2)}
.hc-shagi{display:flex; align-items:center; gap:0; list-style:none; margin:0; padding:0}
.hc-shagi__shag{
  display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--tekst-2);
}
.hc-shagi__shag+.hc-shagi__shag{margin-left:14px; padding-left:22px; position:relative}
.hc-shagi__shag+.hc-shagi__shag::before{
  content:''; position:absolute; left:0; top:50%; width:14px; height:1px; background:var(--ram);
}
.hc-shagi__shag b{
  display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px;
  border-radius:50%; background:var(--fon); color:var(--tekst-2); font-size:12px; font-weight:700;
}
.hc-shagi__shag.hc-vkl b{background:var(--sin); color:var(--bel)}
.hc-shagi__shag:last-child.hc-vkl b{background:var(--zol); color:var(--chern)}

.hc-blok__shapka{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap}
.hc-blok__nomer{
  display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px;
  margin-right:10px; border-radius:50%; background:var(--fon);
  font-size:13px; font-weight:700; color:var(--tekst-2); vertical-align:middle;
}
.hc-blok__pometka{display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--zel)}
.hc-blok__zamok{display:flex; align-items:center; gap:7px; margin:0; font-size:12.5px; color:var(--tekst-2)}

.hc-lico{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.hc-lico__punkt{position:relative; cursor:pointer}
.hc-lico__punkt input{position:absolute; opacity:0; width:0; height:0}
.hc-lico__telo{
  display:flex; align-items:center; gap:12px; padding:14px 16px; height:100%;
  border:1px solid var(--ram); border-radius:var(--r-16); transition:border-color .15s, box-shadow .15s;
}
.hc-lico__punkt input:checked+.hc-lico__telo{border-color:var(--sin); box-shadow:inset 0 0 0 1px var(--sin)}
.hc-lico__znak{color:var(--tekst-2); flex:none}
.hc-lico__telo b{display:block; font-size:14.5px}
.hc-lico__telo i{display:block; font-style:normal; font-size:12.5px; color:var(--tekst-2); margin-top:2px}

.hc-polya{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hc-polya[hidden],.hc-lico__punkt[hidden],.hc-vybor__punkt[hidden]{display:none}
.hc-polya .form-row{margin:0; display:flex; flex-direction:column; gap:6px}
.hc-polya label{font-size:12.5px; color:var(--tekst-2)}
.hc-polya .required{color:var(--zol-tmn); text-decoration:none}
.hc-polya input.input-text,.hc-polya textarea{
  width:100%; height:46px; padding:0 14px; border:1px solid var(--ram); border-radius:var(--r-m);
  background:var(--bel); font:inherit; font-size:14.5px; outline:none; transition:border-color .15s;
}
.hc-polya input.input-text:focus{border-color:var(--sin)}

.hc-dostavka-vybor{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.hc-dostavka-podrobno[hidden]{display:none!important}
.hc-dostavka-vybor__punkt{position:relative; cursor:pointer}
.hc-dostavka-vybor__punkt input{position:absolute; opacity:0; width:0; height:0}
.hc-dostavka-vybor__telo{
  display:flex; flex-direction:column; gap:4px; height:100%; padding:14px 16px;
  border:1px solid var(--ram); border-radius:var(--r-16); transition:border-color .15s, box-shadow .15s;
}
.hc-dostavka-vybor__punkt input:checked+.hc-dostavka-vybor__telo{
  border-color:var(--sin); box-shadow:inset 0 0 0 1px var(--sin);
}
.hc-dostavka-vybor__znak{color:var(--tekst-2); margin-bottom:4px}
.hc-dostavka-vybor__telo b{font-size:14.5px}
.hc-dostavka-vybor__telo i{font-style:normal; font-size:12.5px; color:var(--tekst-2)}
.hc-dostavka-vybor__telo em{font-style:normal; font-size:13px; font-weight:600; color:var(--zel); margin-top:auto}
.hc-dostavka-vybor__cena{color:var(--zol-tmn)!important}

.hc-dostavka-podrobno{display:flex; flex-direction:column; gap:14px}
.hc-dostavka-podrobno[hidden]{display:none}
.hc-okna__zag{display:block; font-size:12.5px; color:var(--tekst-2); margin-bottom:8px}
.hc-okna__spisok{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px}
.hc-slot{position:relative; cursor:pointer}
.hc-slot input{position:absolute; opacity:0; width:0; height:0}
.hc-slot span{
  display:flex; align-items:center; justify-content:center; height:42px;
  border:1px solid var(--ram); border-radius:var(--r-m); font-size:13.5px; transition:all .15s;
}
.hc-slot input:checked+span{background:var(--sin); border-color:var(--sin); color:var(--bel)}

/* правый столбец оформления */
.hc-zakaz{display:flex; flex-direction:column; gap:12px}
.hc-zakaz__zag{font-size:16px; font-weight:700}
.hc-zakaz__zag span{font-weight:500; color:var(--tekst-2)}
.hc-zakaz__spisok{display:flex; flex-direction:column; gap:10px; padding-bottom:12px; border-bottom:1px solid var(--ram)}
.hc-zakaz__stroka{display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:10px; align-items:center}
.hc-zakaz__kart{
  position:relative; width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border-radius:10px; background:var(--fon); overflow:visible;
}
.hc-zakaz__kart img{max-width:100%; max-height:100%; width:auto; height:auto; mix-blend-mode:multiply; border-radius:8px}
.hc-zakaz__kart b{
  position:absolute; top:-6px; left:-6px; min-width:18px; height:18px; padding:0 4px;
  display:flex; align-items:center; justify-content:center; border-radius:9px;
  background:var(--sin); color:var(--bel); font-size:11px; font-weight:700;
}
.hc-zakaz__imya{font-size:13px; line-height:1.3; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
.hc-zakaz__cena{font-size:13.5px; font-weight:700; white-space:nowrap}
.hc-zakaz__kn{width:100%; justify-content:center; margin-top:4px}
.hc-itog__oferta{margin:0; font-size:11.5px; line-height:1.4; color:var(--tekst-2); text-align:center}
.woocommerce-checkout-payment.hc-odin-shlyuz .wc_payment_methods{display:none}
.wc_payment_methods{list-style:none; margin:0 0 10px; padding:0; display:flex; flex-direction:column; gap:8px}
.wc_payment_methods li{font-size:13.5px}
.wc_payment_methods .payment_box{font-size:12.5px; color:var(--tekst-2); margin-top:4px}
.form-row.place-order{display:flex; flex-direction:column; gap:10px; margin:0}

@media (max-width:899px){
  .hc-dostavka-vybor{grid-template-columns:minmax(0,1fr)}
  .hc-lico,.hc-polya{grid-template-columns:minmax(0,1fr)}
  .hc-okna__spisok{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-shagi{display:none}
}

/* ── «Заказ оформлен» по экрану 10 ─────────────────────────────────────── */
.hc-spasibo{display:flex; flex-direction:column; gap:16px; padding-bottom:var(--sec); max-width:820px; margin:0 auto}
.hc-spasibo__shapka{
  display:flex; flex-direction:column; gap:14px; align-items:flex-start;
  padding:36px 38px; border-radius:var(--r-24); background:var(--sin); color:var(--bel);
}
.hc-spasibo__galka{
  display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px;
  border-radius:50%; background:var(--zol); color:var(--chern);
}
.hc-spasibo__shapka h1{font-size:34px; line-height:1.15; letter-spacing:-.02em; margin:0; color:var(--bel)}
.hc-spasibo__shapka h1 .hc-cif{color:var(--zol)}
.hc-spasibo__pod{margin:0; max-width:620px; font-size:15px; line-height:1.55; color:rgba(255,255,255,.72)}
.hc-spasibo__knopki{display:flex; gap:10px; flex-wrap:wrap; margin-top:6px}

.hc-sostoyanie{padding:24px 28px}
.hc-sostoyanie__zag{font-size:18px; margin:0 0 16px}
.hc-sostoyanie__spisok{list-style:none; margin:0; padding:0; display:flex; flex-direction:column}
.hc-sostoyanie__shag{display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; position:relative; padding-bottom:20px}
.hc-sostoyanie__shag:last-child{padding-bottom:0}
.hc-sostoyanie__shag::before{
  content:''; position:absolute; left:17px; top:34px; bottom:0; width:1px; background:var(--ram);
}
.hc-sostoyanie__shag:last-child::before{display:none}
.hc-sostoyanie__kruzhok{
  display:flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:50%; border:1px solid var(--ram); background:var(--bel); color:var(--ram-5);
}
.hc-sostoyanie__shag.hc-vkl .hc-sostoyanie__kruzhok{background:var(--sin); border-color:var(--sin); color:var(--zol)}
.hc-sostoyanie__telo b{display:block; font-size:15px}
.hc-sostoyanie__telo i{display:block; font-style:normal; font-size:13px; color:var(--tekst-2); margin-top:2px}

.hc-spasibo__plitki{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hc-plitka-spasibo{display:flex; align-items:center; gap:14px; padding:18px 20px}
.hc-plitka-spasibo__znak{color:var(--tekst-2); flex:none}
.hc-plitka-spasibo>span{flex:1; min-width:0}
.hc-plitka-spasibo b{display:block; font-size:14.5px}
.hc-plitka-spasibo i{display:block; font-style:normal; font-size:12.5px; color:var(--tekst-2); margin-top:2px}
.hc-plitka-spasibo__kn{color:var(--tekst-2)}
.hc-plitka-spasibo__kn:hover{color:var(--zol-tmn)}

.hc-spasibo__podrobno summary{
  cursor:pointer; padding:14px 18px; border:1px solid var(--ram); border-radius:var(--r-16);
  background:var(--bel); font-size:14.5px; font-weight:600;
}
@media (max-width:639px){
  .hc-spasibo__shapka{padding:26px 20px}
  .hc-spasibo__shapka h1{font-size:25px}
  .hc-spasibo__plitki{grid-template-columns:minmax(0,1fr)}
}


/* ===== kabinet.css ===== */
/* ── Личный кабинет ──────────────────────────────────────────────────────── */
.hc-kabinet{display:grid; grid-template-columns:260px minmax(0,1fr); gap:24px; align-items:start; padding-bottom:var(--sec)}
.woocommerce-MyAccount-navigation{
  padding:12px; background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.woocommerce-MyAccount-navigation ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px}
.woocommerce-MyAccount-navigation li a{
  display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:var(--r-m);
  font-size:14.5px; font-weight:600; color:var(--tekst-2);
}
.woocommerce-MyAccount-navigation li a:hover{background:var(--fon); color:var(--tekst)}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--sin); color:var(--bel)}
.woocommerce-MyAccount-content{min-width:0}
.woocommerce-MyAccount-content>p:first-child{font-size:16px}
.woocommerce-orders-table,.woocommerce-table{
  width:100%; font-size:14.5px; background:var(--bel);
  border:1px solid var(--ram); border-radius:var(--r-20); overflow:hidden;
}
.woocommerce-orders-table th,.woocommerce-table th{
  text-align:left; padding:14px 16px; font-size:12px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--tekst-2); background:var(--fon-2);
}
.woocommerce-orders-table td,.woocommerce-table td{padding:14px 16px; border-top:1px solid var(--fon-6)}
.woocommerce-orders-table .woocommerce-button,.woocommerce-button,.woocommerce-Button{
  display:inline-flex; align-items:center; justify-content:center; height:38px; padding:0 14px;
  border:1px solid var(--ram); border-radius:var(--r-s); background:var(--bel);
  font-size:13px; font-weight:700; color:var(--tekst); cursor:pointer;
}
.woocommerce-orders-table .woocommerce-button:hover,.woocommerce-button:hover{background:var(--fon); color:var(--tekst)}

/* вход */
.hc-vhod{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:start; padding:var(--sec) 0}
.hc-vhod__forma{
  padding:28px; background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-28);
  display:flex; flex-direction:column; gap:14px;
}
.hc-vhod__zag{font-size:28px; font-weight:800; letter-spacing:-.025em}
.hc-vhod__pod{font-size:14.5px; color:var(--tekst-2); margin:0}
.hc-vhod__spravo{
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn);
  padding:var(--pad); display:flex; flex-direction:column; gap:14px; min-height:420px; justify-content:flex-start;
  position:relative; overflow:hidden;
}
.hc-vhod__snimok{display:block; border-radius:var(--r-16); overflow:hidden; background:rgba(255,255,255,.06)}
.hc-vhod__snimok img{display:block; width:100%; height:auto; object-fit:cover; aspect-ratio:16/9}
.hc-vhod__metka{
  font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--zol);
}
.hc-vhod__spravo .hc-vhod__spisok{margin-top:-4px}
.hc-metka__tekst{display:inline-flex; align-items:baseline; gap:4px}
.hc-metka__tekst .hc-zvezda{font-style:normal}
.hc-vhod__spisok{display:flex; flex-direction:column; gap:10px; font-size:14.5px}
.hc-vhod__punkt{display:flex; gap:10px; align-items:flex-start}
.hc-vhod__punkt .hc-z{color:var(--zol)}
.woocommerce form.login,.woocommerce form.register{
  display:flex; flex-direction:column; gap:12px; border:none; padding:0; margin:0;
}
.woocommerce form.login .button,.woocommerce form.register .button{
  height:52px; border:none; border-radius:var(--r-14); background:var(--zol); color:var(--chern);
  font-size:15px; font-weight:800; cursor:pointer;
}
.woocommerce-form-login__rememberme{font-size:13px; color:var(--tekst-2)}
.woocommerce-LostPassword{font-size:13px}

@media (max-width:1099px){
  .hc-kabinet{grid-template-columns:minmax(0,1fr)}
  .hc-vhod{grid-template-columns:minmax(0,1fr)}
  .hc-vhod__spravo{display:none}
}

/* ── кабинет по дизайну ──────────────────────────────────────────────────── */
.hc-kab-menyu{padding:0; background:transparent; border:none}
.hc-kab-kto{
  display:flex; align-items:center; gap:12px; padding:16px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20); margin-bottom:12px;
}
.hc-kab-kto__bukvy{
  width:46px; height:46px; border-radius:50%; background:var(--zol); color:var(--chern);
  display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:800; flex:none;
}
.hc-kab-kto__telo{display:flex; flex-direction:column; gap:2px; min-width:0}
.hc-kab-kto__imya{font-size:15px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.hc-kab-kto__tel{font-size:12.5px; color:var(--tekst-2)}
.hc-kab-menyu ul{
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20); padding:10px;
}
.hc-kab__zag{font-size:34px; font-weight:800; letter-spacing:-.03em; margin-bottom:18px}
.hc-kab__podzag{font-size:20px; font-weight:700; margin:28px 0 14px}

.hc-kab-chisla{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:18px}
.hc-kab-chislo{
  display:flex; flex-direction:column; gap:4px; padding:18px 20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-kab-chislo--zol{background:var(--zol); border-color:transparent; color:var(--chern)}
.hc-kab-chislo--menedzher{flex-direction:row; align-items:flex-start; gap:12px}
.hc-kab-chislo--menedzher .hc-z{color:var(--zol-tmn)}
.hc-kab-chislo__telo{display:flex; flex-direction:column; gap:2px}
.hc-kab-chislo__podpis{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-kab-chislo--zol .hc-kab-chislo__podpis{color:rgba(0,0,0,.6)}
.hc-kab-chislo__znachenie{font-size:30px; font-weight:800; letter-spacing:-.03em; line-height:1.1}
.hc-kab-chislo__pod{font-size:12px; color:var(--tekst-2)}
.hc-kab-chislo--zol .hc-kab-chislo__pod{color:rgba(0,0,0,.6)}
.hc-kab-chislo__imya{font-size:16px; font-weight:700}
.hc-kab-chislo__tel{font-size:14px; font-weight:700; color:var(--zol-tmn)}

.hc-kab-zakaz{
  display:flex; flex-direction:column; gap:16px; padding:20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-24);
}
.hc-kab-zakaz__verh{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.hc-kab-zakaz__metka{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-kab-zakaz__nomer{font-size:16px; font-weight:700}
.hc-kab-zakaz__status{
  margin-left:auto; font-size:12.5px; font-weight:700; padding:5px 11px;
  border-radius:var(--r-kr); background:var(--zol-fon); color:var(--zol-glb);
}
.hc-kab-zakaz .hc-kn{align-self:flex-start; background:var(--sin); color:var(--bel)}
.hc-kab-zakaz .hc-kn:hover{background:var(--sin-tmn); color:var(--bel)}
.hc-kab-shagi{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px}
.hc-kab-shag{display:flex; flex-direction:column; gap:6px; opacity:.45}
.hc-kab-shag.hc-vkl{opacity:1}
.hc-kab-shag__tochka{
  display:flex; align-items:center; gap:8px; height:30px; padding:0 10px;
  border-radius:var(--r-kr); background:var(--fon); color:var(--tekst-2); width:fit-content;
}
.hc-kab-shag.hc-vkl .hc-kab-shag__tochka{background:var(--zol); color:var(--chern)}
.hc-kab-shag__podpis{font-size:12.5px}

.hc-kab-zakazy{display:flex; flex-direction:column; gap:10px}
.hc-kab-stroka{
  display:grid; grid-template-columns:minmax(0,1.2fr) auto auto auto auto; gap:14px; align-items:center;
  padding:14px 16px; background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-kab-stroka__levo{display:flex; flex-direction:column; gap:3px; min-width:0}
.hc-kab-stroka__nomer{font-size:15px; font-weight:700}
.hc-kab-stroka__data{font-size:12.5px; color:var(--tekst-2)}
.hc-kab-stroka__kartinki{display:flex; gap:4px; align-items:center}
.hc-kab-stroka__kart{
  width:40px; height:40px; border-radius:var(--r-s); background:var(--fon-2) center/contain no-repeat;
  border:1px solid var(--ram);
}
.hc-kab-stroka__eshchyo{font-size:12px; color:var(--tekst-2)}
.hc-kab-stroka__status{
  font-size:12.5px; font-weight:700; padding:5px 11px; border-radius:var(--r-kr);
  background:var(--fon-2); color:var(--tekst-2); white-space:nowrap;
}
.hc-kab-stroka__status--completed{background:var(--zel-fon); color:var(--zel)}
.hc-kab-stroka__status--processing{background:var(--zol-fon); color:var(--zol-tmn)}
.hc-kab-stroka__status--cancelled,.hc-kab-stroka__status--failed{background:var(--kras-fon); color:var(--kras)}
.hc-kab-stroka__summa{font-size:16px; font-weight:700; white-space:nowrap}
.hc-kab-stroka__knopki{display:flex; gap:6px}

.hc-kab-forma{display:flex; flex-direction:column; gap:14px; margin-bottom:22px}
.hc-kab-forma__ryad{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hc-kab-plitki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-kab-plitka{
  display:flex; flex-direction:column; gap:8px; padding:18px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-kab-plitka__znak{
  width:44px; height:44px; border-radius:var(--r-14); background:var(--zol-fon); color:var(--zol-tmn);
  display:flex; align-items:center; justify-content:center;
}
.hc-kab-plitka__zag{font-size:15px; font-weight:700}
.hc-kab-plitka__pod{font-size:13px; color:var(--tekst-2); line-height:1.45; flex:1}

.hc-kab-nastrojki{
  display:flex; flex-direction:column; background:var(--bel);
  border:1px solid var(--ram); border-radius:var(--r-20); overflow:hidden;
}
.hc-kab-nastrojka{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 20px; border-bottom:1px solid var(--fon-6); font-size:15px;
}
.hc-kab-nastrojka:last-of-type{border-bottom:none}
.hc-nastrojka-kn{border:none; background:transparent; cursor:pointer; padding:0}
.hc-kab-vyhod{margin:16px 20px 20px; align-self:flex-start}

@media (max-width:1099px){
  .hc-kab-chisla,.hc-kab-plitki{grid-template-columns:minmax(0,1fr)}
  .hc-kab-shagi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-kab-stroka{grid-template-columns:minmax(0,1fr) auto; row-gap:10px}
  .hc-kab-stroka__kartinki{grid-column:1 / -1}
  .hc-kab-stroka__knopki{grid-column:1 / -1}
  .hc-kab-forma__ryad{grid-template-columns:minmax(0,1fr)}
  .hc-kab__zag{font-size:26px}
}


/* ===== stranicy.css ===== */
/* ── Обычные страницы, бренды, сравнение, сервис, блог, окно заявки ─────── */
.hc-stat{max-width:900px; margin:0 auto; display:flex; flex-direction:column; gap:18px}
.hc-stat__zag{font-size:48px; font-weight:800; letter-spacing:-.03em; line-height:1.05}
.hc-stat__data{font-size:13px; color:var(--tekst-3)}
.hc-stat__kart img{width:100%; height:auto; border-radius:var(--r-24); display:block}

.hc-tekst{font-size:16px; line-height:1.65; color:var(--tekst)}
.hc-tekst h2{font-size:28px; margin:28px 0 12px}
.hc-tekst h3{font-size:22px; margin:22px 0 10px}
.hc-tekst h4{font-size:18px; margin:18px 0 8px}
.hc-tekst img{border-radius:var(--r-16); height:auto}
.hc-tekst a{color:var(--zol-tmn); text-decoration:underline}
.hc-tekst table{width:100%; font-size:14.5px; margin:16px 0}
.hc-tekst th,.hc-tekst td{padding:10px 12px; border:1px solid var(--ram); text-align:left}
.hc-tekst th{background:var(--fon-2); font-weight:700}
.hc-tekst blockquote{
  margin:18px 0; padding:14px 18px; border-left:3px solid var(--zol);
  background:var(--fon-2); border-radius:0 var(--r-m) var(--r-m) 0;
}
.hc-tekst-stranicy{max-width:900px}

/* страница брендов */
.hc-brendy-poisk{max-width:260px}
.hc-brendy-bukvy{display:flex; gap:4px; flex-wrap:wrap}
.hc-brendy-bukvy__kn{
  min-width:34px; height:34px; padding:0 8px; border-radius:var(--r-s);
  background:var(--bel); border:1px solid var(--ram); color:var(--tekst);
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;
}
.hc-brendy-bukvy__kn:hover{background:var(--zol-fon); color:var(--zol-tmn)}
.hc-brendy-gruppa{scroll-margin-top:170px}
.hc-brendy-gruppa__bukva{font-size:20px; color:var(--zol-tmn)}
.hc-brendy-spisok{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.hc-brend-karta{
  display:flex; flex-direction:column; gap:12px; padding:16px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20); color:var(--tekst);
  transition:border-color .2s, transform .2s, box-shadow .2s;
}
.hc-brend-karta:hover{border-color:var(--sin); transform:translateY(-2px); color:var(--tekst);
  box-shadow:0 12px 28px -18px rgba(22,23,27,.35)}
/* Полотно под знаком — белое, а не тёплое: у девяти знаков из двадцати одного
   белая подложка впечатана в сам файл, и на тёплом полотне они читались
   наклеенным прямоугольником. */
.hc-brend-karta__logo{
  height:72px; background:var(--bel); border-radius:var(--r-14);
  display:flex; align-items:center; justify-content:center; padding:10px;
}
.hc-brend-karta__logo span[role="img"]{display:block; width:100%; height:100%; background:center/contain no-repeat}
.hc-brend-karta__imya-bol{font-size:18px; font-weight:800; letter-spacing:.03em; text-align:center}
.hc-brend-karta__niz{display:flex; flex-direction:column; gap:3px}
.hc-brend-karta__imya{font-size:15px; font-weight:700}
.hc-brend-karta__opis{display:flex; gap:10px; font-size:12.5px; color:var(--tekst-2)}
.hc-brendy-spisok--vse{grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px}
.hc-brendy-spisok--vse .hc-brend-karta{padding:12px}
.hc-brendy-spisok--vse .hc-brend-karta__logo{height:74px}
.hc-brend-karta__stroka{display:flex; align-items:baseline; justify-content:space-between; gap:8px}
.hc-brend-karta__shtuk{flex:none; font-size:12px; color:var(--tekst-2)}
.hc-brendy-spisok--vse .hc-brend-karta__imya{font-size:13px; font-weight:700}
.hc-brend-karta__razdely{
  font-size:11.5px; line-height:1.35; color:var(--tekst-2);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.hc-brendy-pusto{margin:24px 0; text-align:center; color:var(--tekst-2)}

/* сравнение */
.hc-sravnenie{overflow-x:auto; padding-bottom:6px}
.hc-sravnenie__tablica{width:100%; min-width:720px; font-size:14px; border-collapse:separate; border-spacing:0; table-layout:fixed}
.hc-sravnenie__tablica th,.hc-sravnenie__tablica td{
  padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--fon-6);
}
.hc-sravnenie__tablica tbody th{
  width:220px; font-weight:500; color:var(--tekst-2); background:var(--fon-5);
  position:sticky; left:0; z-index:1;
}
.hc-sravnenie__ugol{width:220px; min-width:220px; background:transparent!important; border-bottom:none!important}
.hc-sravnenie__shapka{width:260px; min-width:240px; padding:0 8px 16px!important; border-bottom:none!important; vertical-align:top}
.hc-sr-dobavit{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  min-height:190px; border:1px dashed var(--ram); border-radius:var(--r-16);
  color:var(--tekst-2); font-size:13.5px; font-weight:600; transition:border-color .15s, color .15s;
}
.hc-sr-dobavit:hover{border-color:var(--zol); color:var(--zol-tmn)}
.hc-sr-kolonka{
  position:relative; display:flex; flex-direction:column; gap:10px; padding:14px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-16); height:100%;
}
.hc-sr-kolonka__krest{
  position:absolute; top:8px; right:8px; z-index:2; width:28px; height:28px; padding:0;
  display:flex; align-items:center; justify-content:center; border:1px solid var(--ram);
  border-radius:50%; background:var(--bel); color:var(--tekst-2); cursor:pointer; transition:all .15s;
}
.hc-sr-kolonka__krest:hover{border-color:var(--kras); color:var(--kras)}
.hc-sr-kolonka__kart{
  display:flex; align-items:center; justify-content:center; height:150px;
  border-radius:var(--r-m); background:var(--fon); overflow:hidden;
}
.hc-sr-kolonka__kart img{max-width:100%; max-height:100%; width:auto; height:auto; mix-blend-mode:multiply}
.hc-sr-kolonka__imya{
  font-size:13.5px; font-weight:600; line-height:1.35; color:var(--tekst);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:36px;
}
.hc-sr-kolonka__imya:hover{color:var(--zol-tmn)}
.hc-sr-kolonka .hc-karta__dejstvie{margin-top:auto}

/* сервис */
.hc-servis-geroj{
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn); padding:var(--pad);
}
.hc-servis-geroj__telo{max-width:720px; display:flex; flex-direction:column; gap:14px}
.hc-servis-geroj__metka{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--zol-svt)}
.hc-servis-geroj__zag{font-size:48px; font-weight:800; letter-spacing:-.03em; line-height:1.05}
.hc-servis-geroj__opis{margin:0; font-size:16px; line-height:1.6; color:var(--zagl)}
.hc-servis-geroj__knopki{display:flex; gap:10px; flex-wrap:wrap; margin-top:6px}
.hc-servis-geroj__kn2{border:1px solid var(--sin-ram2); background:transparent; color:var(--bel)}
.hc-servis-geroj__kn2:hover{background:var(--sin-ram); color:var(--bel)}

.hc-uslugi{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.hc-usluga{
  display:flex; flex-direction:column; gap:8px; padding:20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-usluga__znak{
  width:48px; height:48px; border-radius:var(--r-14); background:var(--zol-fon); color:var(--zol-tmn);
  display:flex; align-items:center; justify-content:center;
}
.hc-usluga__zag{font-size:16px; font-weight:700}
.hc-usluga__opis{font-size:13.5px; line-height:1.5; color:var(--tekst-2)}
.hc-forma-servis{display:flex; flex-direction:column; gap:12px}
.hc-pochemu{display:flex; flex-direction:column; gap:14px}
.hc-pochemu__punkt{display:flex; gap:12px; align-items:flex-start}
.hc-pochemu__galka{
  width:26px; height:26px; flex:none; border-radius:50%; background:var(--zel-fon); color:var(--zel);
  display:flex; align-items:center; justify-content:center;
}
.hc-pochemu__punkt>span{display:flex; flex-direction:column; gap:2px}
.hc-pochemu__punkt strong{font-size:15px}
.hc-pochemu__punkt span span{font-size:13.5px; color:var(--tekst-2); line-height:1.5}
.hc-zvezda{color:var(--kras)}

/* блог */
.hc-zapisi{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.hc-zapis{
  display:flex; flex-direction:column; gap:0; background:var(--bel);
  border:1px solid var(--ram); border-radius:var(--r-24); overflow:hidden; color:var(--tekst);
  transition:transform .2s, box-shadow .2s;
}
.hc-zapis:hover{transform:translateY(-3px); color:var(--tekst); box-shadow:0 16px 36px -22px rgba(22,23,27,.4)}
.hc-zapis__kart{display:block; aspect-ratio:16/10; background:var(--zagl) center/cover no-repeat}
.hc-zapis__telo{display:flex; flex-direction:column; gap:6px; padding:18px}
.hc-zapis__data{font-size:12px; color:var(--tekst-3)}
.hc-zapis__zag{font-size:17px; font-weight:700; line-height:1.3}
.hc-zapis__opis{font-size:14px; color:var(--tekst-2); line-height:1.5}

/* окно заявки */
.hc-okno{position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:20px}
.hc-okno[hidden]{display:none}
.hc-okno__fon{position:absolute; inset:0; background:rgba(14,14,12,.45); animation:hcfade .15s ease}
.hc-okno__telo{
  position:relative; width:100%; max-width:440px; max-height:92vh; overflow-y:auto;
  background:var(--bel); border-radius:var(--r-28); padding:28px;
  display:flex; flex-direction:column; gap:8px; box-shadow:var(--ten-v);
  animation:hcfade .2s ease;
}
.hc-okno__zakryt{
  position:absolute; right:14px; top:14px; width:40px; height:40px; border-radius:50%;
  border:none; background:var(--fon); cursor:pointer; color:var(--tekst);
  display:flex; align-items:center; justify-content:center;
}
.hc-okno__zakryt:hover{background:var(--ram)}
.hc-okno__zag{font-size:24px; font-weight:800; letter-spacing:-.02em; padding-right:44px}
.hc-okno__pod{margin:0 0 10px; font-size:14px; color:var(--tekst-2)}
.hc-okno__forma{display:flex; flex-direction:column; gap:12px}
.hc-okno__soglasie{margin:0; font-size:11.5px; color:var(--tekst-3); text-align:center}
.hc-toast--oshibka{background:var(--kras)}

/* подсказки поиска */
.hc-poisk__pusto{padding:16px; text-align:center; font-size:14px; color:var(--tekst-2)}

@media (max-width:1099px){
  .hc-stat__zag,.hc-servis-geroj__zag{font-size:38px}
  .hc-brendy-spisok{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hc-brendy-spisok--vse{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hc-uslugi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-zapisi{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:639px){
  .hc-stat__zag,.hc-servis-geroj__zag{font-size:28px}
  .hc-brendy-spisok,.hc-brendy-spisok--vse{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-uslugi,.hc-zapisi{grid-template-columns:minmax(0,1fr)}
  .hc-okno__telo{padding:22px; border-radius:var(--r-24)}
  .hc-tekst h2{font-size:23px}
}

/* ── Сервис: шапка с формой вызова мастера ────────────────────────────────── */
.hc-servis-verh{display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:28px; align-items:start}
.hc-servis-verh__telo{
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn);
  padding:var(--pad); display:flex; flex-direction:column; gap:14px; min-height:100%;
}
.hc-servis-verh__metka{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--zol-svt)}
.hc-servis-verh__zag{font-size:42px; font-weight:800; letter-spacing:-.03em; line-height:1.07; text-wrap:pretty}
.hc-servis-verh__opis{margin:0; font-size:16px; line-height:1.6; color:var(--zagl); max-width:56ch}
.hc-servis-verh__tel{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:auto; padding-top:14px}
.hc-servis-verh__tel-1{
  display:flex; align-items:center; gap:9px; font-size:22px; font-weight:800; color:var(--bel);
}
.hc-servis-verh__tel-1 .hc-z{color:var(--zol)}
.hc-servis-verh__tel-1:hover{color:var(--zol)}
.hc-servis-verh__tel-2{font-size:16px; font-weight:600; color:var(--ram-6)}
.hc-servis-verh__tel-2:hover{color:var(--zol)}

.hc-vyzov{
  display:flex; flex-direction:column; gap:12px; padding:24px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-28);
}
.hc-vyzov__zag{font-size:20px; font-weight:800}
.hc-vyzov__vidy{display:flex; gap:6px; flex-wrap:wrap}
.hc-vyzov__vid{
  height:32px; padding:0 12px; border:1px solid var(--ram); border-radius:var(--r-kr);
  background:var(--bel); color:var(--tekst-2); font-size:12.5px; font-weight:600;
  cursor:pointer; transition:background .15s, color .15s, border-color .15s;
}
.hc-vyzov__vid:hover{border-color:var(--ram-4); color:var(--tekst)}
.hc-vyzov__vid.hc-vkl{background:var(--sin); border-color:var(--sin); color:var(--bel)}
.hc-vyzov__ryad{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.hc-vyzov__foto{
  display:flex; align-items:center; gap:10px; padding:12px 14px; cursor:pointer;
  border:1px dashed var(--ram-4); border-radius:var(--r-14);
  font-size:12.5px; line-height:1.4; color:var(--tekst-2); transition:border-color .15s, background .15s;
}
.hc-vyzov__foto:hover{border-color:var(--zol); background:var(--fon-5)}
.hc-vyzov__foto.hc-vkl{border-style:solid; border-color:var(--zel); color:var(--zel)}
.hc-vyzov__foto .hc-z{color:var(--zol-tmn); flex:none}

.hc-servis-plitki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-servis-plitka{
  display:flex; flex-direction:column; gap:8px; padding:20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-servis-plitka__znak{
  width:48px; height:48px; border-radius:var(--r-14); background:var(--zol-fon); color:var(--zol-tmn);
  display:flex; align-items:center; justify-content:center;
}
.hc-servis-plitka__zag{font-size:16px; font-weight:700}
.hc-servis-plitka__opis{font-size:13.5px; line-height:1.5; color:var(--tekst-2)}
.hc-servis-plitka--garantiya{background:var(--fon-2); border-color:transparent; justify-content:space-between}
.hc-servis-plitka__logotipy{display:flex; gap:8px; flex-wrap:wrap}
.hc-servis-plitka__logo{
  flex:1; min-width:84px; height:52px; border-radius:var(--r-m); background:var(--bel);
  display:flex; align-items:center; justify-content:center; padding:8px;
}
.hc-servis-plitka__logo img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain}

.hc-uchebnyj{
  position:relative; border-radius:var(--r-28); overflow:hidden; min-height:320px;
  background:var(--zagl); display:flex; align-items:flex-end;
}
.hc-uchebnyj__foto{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hc-uchebnyj__telo{
  position:relative; padding:var(--pad); display:flex; flex-direction:column; gap:4px;
  color:var(--bel); width:100%;
  background:linear-gradient(180deg, rgba(14,15,18,0) 0%, rgba(14,15,18,.75) 100%);
}
.hc-uchebnyj__zag{font-size:24px; font-weight:800; letter-spacing:-.02em}
.hc-uchebnyj__pod{font-size:14.5px; color:var(--zagl)}

/* ── О компании ───────────────────────────────────────────────────────────── */
.hc-o-verh{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); gap:28px; align-items:center}
.hc-o-verh__telo{display:flex; flex-direction:column; gap:14px}
.hc-o-verh__metka{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-o-verh__zag{font-size:42px; font-weight:800; letter-spacing:-.03em; line-height:1.07; text-wrap:pretty}
.hc-o-verh__opis{margin:0; font-size:16px; line-height:1.65; color:var(--tekst-2)}
.hc-o-verh__cifry{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:8px}
.hc-o-verh__cifra{
  display:flex; flex-direction:column; gap:2px; padding:16px;
  border-radius:var(--r-20); background:var(--bel); border:1px solid var(--ram);
}
.hc-o-verh__cifra--zol{background:var(--zol); border-color:transparent}
.hc-o-verh__chislo{font-size:30px; font-weight:800; letter-spacing:-.03em; line-height:1}
.hc-o-verh__podpis{font-size:12.5px; color:var(--tekst-2)}
.hc-o-verh__cifra--zol .hc-o-verh__podpis{color:var(--zol-glb)}
.hc-o-verh__foto{border-radius:var(--r-28); overflow:hidden; background:var(--zagl); aspect-ratio:4/5; max-height:620px}
.hc-o-verh__foto img{width:100%; height:100%; object-fit:cover; display:block}

.hc-prichiny{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-prichina{
  display:flex; flex-direction:column; gap:7px; padding:20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-prichina__nomer{font-size:13px; font-weight:700; color:var(--zol-tmn)}
.hc-prichina__zag{font-size:16px; font-weight:700}
.hc-prichina__opis{font-size:13.5px; line-height:1.5; color:var(--tekst-2)}

.hc-snimki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-snimok{border-radius:var(--r-24); overflow:hidden; aspect-ratio:4/3; background:var(--zagl)}
.hc-snimok img{width:100%; height:100%; object-fit:cover; display:block}

.hc-optom{
  display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:28px; align-items:center;
  border-radius:var(--r-28); background:var(--sin); color:var(--tekst-tmn); padding:var(--pad);
}
.hc-optom__metka{font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--zol-svt)}
.hc-optom__zag{font-size:26px; font-weight:800; letter-spacing:-.025em; line-height:1.15; margin:10px 0 8px; text-wrap:pretty}
.hc-optom__pod{font-size:14.5px; color:var(--zagl)}
.hc-optom__forma{display:flex; flex-direction:column; gap:10px}

/* ── Контакты ─────────────────────────────────────────────────────────────── */
.hc-kontakty{display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:16px; align-items:start}
.hc-kontakty__karta{
  position:relative; border-radius:var(--r-28); overflow:hidden; min-height:380px;
  background:var(--fon-2); display:flex; flex-direction:column; justify-content:flex-end; padding:16px;
}
.hc-kontakty__karta-ssylka,.hc-kontakty__karta-pusto{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; color:var(--tekst-2); font-size:14px; text-align:center; padding:20px;
  background:repeating-linear-gradient(45deg, var(--fon-2) 0 14px, var(--fon-3) 14px 28px);
}
.hc-kontakty__karta-ssylka:hover{color:var(--zol-tmn)}
.hc-kontakty__karta-ssylka .hc-z,.hc-kontakty__karta-pusto .hc-z{color:var(--zol)}
.hc-kontakty__shourum{
  position:relative; display:flex; align-items:center; gap:14px; padding:16px;
  border-radius:var(--r-20); background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px); box-shadow:var(--ten-k);
}
.hc-kontakty__shourum .hc-z{color:var(--zol-tmn); flex:none}
.hc-kontakty__shourum-telo{display:flex; flex-direction:column; gap:2px; flex:1; min-width:0}
.hc-kontakty__shourum-zag{font-size:15px; font-weight:700}
.hc-kontakty__shourum-pod{font-size:13px; color:var(--tekst-2)}

.hc-kontakty__spisok{display:flex; flex-direction:column; gap:12px}
.hc-kontakty__blok{
  display:flex; flex-direction:column; gap:6px; padding:18px 20px;
  background:var(--bel); border:1px solid var(--ram); border-radius:var(--r-20);
}
.hc-kontakty__metka{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-kontakty__tel{font-size:16px; font-weight:600; color:var(--tekst)}
.hc-kontakty__tel--glavnyj{font-size:22px; font-weight:800}
.hc-kontakty__tel:hover,.hc-kontakty__pochta:hover{color:var(--zol-tmn)}
.hc-kontakty__pochta{font-size:15px; color:var(--tekst)}
.hc-kontakty__chasy{font-size:15px; font-weight:600}
.hc-kontakty__para{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hc-kontakty__tg{align-items:flex-start; color:var(--tekst)}
.hc-kontakty__tg:hover{color:var(--tekst); border-color:var(--sin)}
.hc-kontakty__tg-imya{font-size:15px; font-weight:700}
.hc-kontakty__tg-pod{font-size:12.5px; color:var(--tekst-2)}

.hc-svyaz{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:28px; align-items:start;
  padding:var(--pad); border-radius:var(--r-28); background:var(--bel); border:1px solid var(--ram);
}
.hc-svyaz__zag{font-size:30px; font-weight:800; letter-spacing:-.025em}
.hc-svyaz__pod{display:block; margin-top:10px; font-size:15px; line-height:1.6; color:var(--tekst-2)}
.hc-svyaz__forma{display:flex; flex-direction:column; gap:10px}
.hc-svyaz__ryad{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}

@media (max-width:1099px){
  .hc-servis-verh,.hc-o-verh,.hc-optom,.hc-kontakty,.hc-svyaz{grid-template-columns:minmax(0,1fr)}
  .hc-servis-plitki,.hc-prichiny,.hc-snimki{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-servis-verh__zag,.hc-o-verh__zag{font-size:34px}
  .hc-o-verh__foto{aspect-ratio:16/10; max-height:420px}
}
@media (max-width:639px){
  .hc-servis-plitki,.hc-prichiny,.hc-snimki,.hc-vyzov__ryad,.hc-svyaz__ryad,.hc-kontakty__para{
    grid-template-columns:minmax(0,1fr);
  }
  .hc-servis-verh__zag,.hc-o-verh__zag{font-size:26px}
  .hc-o-verh__cifry{grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px}
  .hc-o-verh__chislo{font-size:22px}
  .hc-svyaz__zag{font-size:23px}
  .hc-servis-verh__tel-1{font-size:19px}
}

/* ── полноэкранный поиск на телефоне ──────────────────────────────────────── */
.hc-poisk-ekran{
  position:fixed; inset:0; z-index:320; background:var(--bel);
  display:flex; flex-direction:column;
  opacity:0; transform:translateY(12px); transition:opacity .25s ease, transform .3s cubic-bezier(.22,.9,.26,1);
}
.hc-poisk-ekran.hc-vidno{opacity:1; transform:none}
.hc-poisk-ekran[hidden]{display:none}
.hc-poisk-ekran__shapka{flex:none; display:flex; align-items:center; gap:8px; padding:14px 14px 10px}
.hc-poisk-ekran__nazad{
  width:44px; height:44px; flex:none; border:none; border-radius:var(--r-m);
  background:var(--fon); cursor:pointer; color:var(--tekst);
  display:flex; align-items:center; justify-content:center;
}
.hc-poisk-ekran__pole{
  flex:1; min-width:0; height:46px; border-radius:var(--r-14); border:2px solid var(--sin);
  display:flex; align-items:center; gap:8px; padding:0 12px;
}
.hc-poisk-ekran__pole input{
  flex:1; min-width:0; border:none; outline:none; background:transparent; font-size:15px;
}
.hc-poisk-ekran__sterech{
  border:none; background:transparent; color:var(--tekst-3); cursor:pointer; padding:0;
  display:flex; align-items:center;
}
.hc-poisk-ekran__telo{flex:1; min-height:0; overflow-y:auto; padding:6px 14px 20px; display:flex; flex-direction:column; gap:18px}
.hc-poisk-ekran__sposoby{display:flex; gap:8px}
.hc-poisk-ekran__sposob{
  flex:1; height:48px; border:none; border-radius:var(--r-14); background:var(--fon);
  font-size:14px; font-weight:600; cursor:pointer; color:var(--tekst);
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.hc-poisk-ekran__sposob:hover{background:var(--ram)}
.hc-poisk-ekran__metka{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tekst-2)}
.hc-poisk-ekran__slova{display:flex; gap:7px; flex-wrap:wrap; margin-top:10px}
.hc-poisk-ekran__slovo{
  height:34px; padding:0 13px; border:1px solid var(--ram); border-radius:var(--r-kr);
  background:var(--bel); font-size:13px; color:var(--tekst); cursor:pointer;
}
.hc-poisk-ekran__slovo:hover{background:var(--fon-2)}
.hc-poisk-ekran__nahodki{display:flex; flex-direction:column}
.hc-poisk-ekran__nahodki .hc-poisk__podskazka{border-bottom:1px solid var(--fon-6)}
.hc-poisk-ekran__nahodki .hc-poisk__vse{border-radius:var(--r-m); margin-top:10px}

/* ── кнопка сравнения и кнопка чата ───────────────────────────────────────── */
.hc-sravnenie-kn{
  position:fixed; left:24px; bottom:24px; z-index:270;
  display:none; align-items:center; gap:9px; height:48px; padding:0 18px;
  border-radius:var(--r-kr); background:var(--sin); color:var(--bel);
  font-size:14px; font-weight:700; box-shadow:var(--ten-v);
  animation:hcfade .25s ease-out both;
}
.hc-sravnenie-kn.hc-vidna{display:flex}
.hc-sravnenie-kn:hover{background:var(--sin-tmn); color:var(--bel)}

.hc-chat-kn{
  position:fixed; right:24px; bottom:24px; z-index:270;
  width:56px; height:56px; border-radius:50%; background:var(--bel);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--ten-v); transition:transform .22s cubic-bezier(.22,.9,.26,1);
}
.hc-chat-kn:hover{transform:scale(1.08)}
.hc-chat-kn .hc-znak-seti{width:28px; height:28px}

/* ── лист фильтров: шапка и нижняя кнопка нужны только в листе ── */
.hc-filtry__shapka,.hc-filtry__niz{display:none}
.hc-filtry__shapka{align-items:center; justify-content:space-between; gap:12px; padding-bottom:10px;
  border-bottom:1px solid var(--fon-6); margin-bottom:4px}
.hc-filtry__shapka-zag{font-size:18px; font-weight:800}
.hc-filtry__zakryt{
  width:40px; height:40px; border-radius:50%; border:none; background:var(--fon);
  cursor:pointer; color:var(--tekst); display:flex; align-items:center; justify-content:center;
}

@media (max-width:1099px){
  .hc-filtry.hc-otkryt .hc-filtry__shapka{display:flex}
  .hc-filtry.hc-otkryt .hc-filtry__niz{
    display:block; position:sticky; bottom:0; padding:12px 0 2px;
    background:var(--bel); border-top:1px solid var(--fon-6);
  }
}
@media (max-width:639px){
  .hc-chat-kn{right:16px; bottom:150px; width:50px; height:50px}
  .hc-sravnenie-kn{left:16px; bottom:150px; height:44px; padding:0 14px; font-size:13px}
}

/* ── доставка и оплата ─────────────────────────────────────────────────── */
.hc-dostavka-str__plitki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-dost-plitka{display:flex; flex-direction:column; gap:5px; padding:20px}
.hc-dost-plitka__znak{color:var(--tekst-2); margin-bottom:4px}
.hc-dost-plitka b{font-size:16px}
.hc-dost-plitka i{font-style:normal; font-size:13.5px; color:var(--tekst-2)}
.hc-dost-plitka em{font-style:normal; font-size:14px; font-weight:700; color:var(--zel); margin-top:2px}
.hc-dost-plitka__cena{color:var(--zol-tmn)!important}
.hc-dost-plitka__pod{margin-top:8px; padding-top:8px; border-top:1px solid var(--ram); font-size:12.5px; color:var(--tekst-2)}
.hc-dostavka-str__oplata{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.hc-oplata-stroka{display:flex; align-items:center; gap:14px; padding:14px 18px}
.hc-oplata-stroka__logo{
  flex:none; width:64px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:8px; background:var(--fon);
}
.hc-oplata-stroka__logo img{max-width:52px; max-height:22px; width:auto; height:auto}
.hc-oplata-stroka__logo--znak{color:var(--tekst-2)}
.hc-oplata-stroka b{display:block; font-size:14.5px}
.hc-oplata-stroka i{display:block; font-style:normal; font-size:12.5px; color:var(--tekst-2)}
.hc-dostavka-str__zametka{
  display:flex; align-items:center; gap:9px; margin:14px 0 0; padding:14px 18px;
  border-radius:var(--r-16); background:var(--zol-fon); color:var(--zol-glb); font-size:13.5px;
}
.hc-dostavka-str__vopros{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; flex-wrap:wrap}
.hc-dostavka-str__vopros b{display:block; font-size:16px}
.hc-dostavka-str__vopros i{display:block; font-style:normal; font-size:13.5px; color:var(--tekst-2); margin-top:2px}

/* ── оптовикам ─────────────────────────────────────────────────────────── */
.hc-optom-str__shapka{
  display:flex; flex-direction:column; gap:12px; align-items:flex-start; padding:38px 40px;
  border-radius:var(--r-28); background:var(--zol); color:var(--chern); margin-top:var(--sec-m, 20px);
}
.hc-optom-str__metka{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(0,0,0,.6)}
.hc-optom-str__shapka h1{font-size:34px; line-height:1.15; letter-spacing:-.02em; margin:0; max-width:760px}
.hc-optom-str__shapka p{margin:0; max-width:680px; font-size:15px; line-height:1.55; color:rgba(0,0,0,.72)}
.hc-optom-str__plitki{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hc-optom-str__plitka{display:flex; flex-direction:column; gap:5px; padding:20px}
.hc-optom-str__znak{color:var(--zol-tmn); margin-bottom:4px}
.hc-optom-str__plitka b{font-size:15.5px}
.hc-optom-str__plitka i{font-style:normal; font-size:13px; color:var(--tekst-2); line-height:1.45}
.hc-optom-str__forma-kart{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; padding:28px}
.hc-optom-str__forma-telo h2{font-size:22px; margin:0 0 6px}
.hc-optom-str__forma-telo p{margin:0 0 14px; font-size:14px; color:var(--tekst-2)}
.hc-optom-str__tel{display:block; font-size:20px; font-weight:800; letter-spacing:-.02em}
.hc-optom-str__pochta{display:block; margin-top:4px; font-size:14px; color:var(--tekst-2)}
.hc-optom-str__forma-kart .hc-optom__forma{display:flex; flex-direction:column; gap:10px}

@media (max-width:899px){
  .hc-dostavka-str__plitki,.hc-dostavka-str__oplata,.hc-optom-str__plitki{grid-template-columns:minmax(0,1fr)}
  .hc-optom-str__forma-kart{grid-template-columns:minmax(0,1fr)}
  .hc-optom-str__shapka{padding:26px 20px}
  .hc-optom-str__shapka h1{font-size:25px}
}