:root {
  /* Base Colors */
  --color-white: #FFFFFF;
  --color-black: #0D0D0D;
  --color-gray-light: #F2F2F2;
  --color-gray-dark: #1A1A1A;
  --color-gray-medium: #808080;
  --color-alert: #C5230A;

  /* Backgrounds */
  --background-primary: var(--color-gray-light);

  /* CTA Button */
  --cta-btn-default-background: var(--color-black);
  --cta-btn-default-typography: var(--color-white);
  --cta-btn-default-icon: var(--color-white);
  --cta-btn-hover-background: rgba(13, 13, 13, 0.8);
  --cta-btn-hover-typography: var(--color-white);
  --cta-btn-hover-icon: var(--color-white);
  --cta-btn-pressed-background: rgba(13, 13, 13, 0.6);
  --cta-btn-pressed-typography: var(--color-white);
  --cta-btn-pressed-icon: var(--color-white);
  --cta-btn-disable-background: rgba(13, 13, 13, 0.3);
  --cta-btn-disable-typography: rgba(13, 13, 13, 0.5);
  --cta-btn-disable-icon: rgba(13, 13, 13, 0.5);

  /* Secondary Button */
  --secondary-btn-default-background: rgba(13, 13, 13, 0.1);
  --secondary-btn-default-typography: var(--color-gray-dark);
  --secondary-btn-default-icon: var(--color-gray-dark);
  --secondary-btn-default-stroke: rgba(13, 13, 13, 0.4);
  --secondary-btn-hover-background: rgba(13, 13, 13, 0.3);
  --secondary-btn-hover-typography: var(--color-gray-dark);
  --secondary-btn-hover-icon: var(--color-gray-dark);
  --secondary-btn-hover-stroke: var(--color-gray-medium);
  --secondary-btn-pressed-background: rgba(13, 13, 13, 0.5);
  --secondary-btn-pressed-typography: var(--color-gray-dark);
  --secondary-btn-pressed-icon: var(--color-gray-dark);
  --secondary-btn-pressed-stroke: var(--color-gray-medium);
  --secondary-btn-disable-background: rgba(13, 13, 13, 0.2);
  --secondary-btn-disable-typography: rgba(13, 13, 13, 0.4);
  --secondary-btn-disable-icon: rgba(13, 13, 13, 0.4);
  --secondary-btn-disable-stroke: rgba(13, 13, 13, 0.4);

  /* Tertiary Button */
  --tertiary-btn-default-background: var(--color-gray-light);
  --tertiary-btn-default-typography: rgba(13, 13, 13, 0.95);
  --tertiary-btn-default-icon: rgba(13, 13, 13, 0.95);
  --tertiary-btn-default-stroke: rgba(13, 13, 13, 0.4);
  --tertiary-btn-hover-background: var(--color-gray-light);
  --tertiary-btn-hover-typography: rgba(13, 13, 13, 0.6);
  --tertiary-btn-hover-icon: rgba(13, 13, 13, 0.6);
  --tertiary-btn-hover-stroke: rgba(13, 13, 13, 0.6);
  --tertiary-btn-pressed-background: var(--color-gray-light);
  --tertiary-btn-pressed-typography: rgba(13, 13, 13, 0.3);
  --tertiary-btn-pressed-icon: rgba(13, 13, 13, 0.3);
  --tertiary-btn-pressed-stroke: rgba(13, 13, 13, 0.3);
  --tertiary-btn-disable-background: rgba(13, 13, 13, 0.05);
  --tertiary-btn-disable-typography: rgba(13, 13, 13, 0.2);
  --tertiary-btn-disable-icon: rgba(13, 13, 13, 0.2);
  --tertiary-btn-disable-stroke: rgba(13, 13, 13, 0.4);

  /* Input - Default States */
  --input-default-background: rgba(255, 255, 255, 0.6);
  --input-default-background-2: var(--color-gray-light);
  --input-default-placeholder: rgba(13, 13, 13, 0.4);
  --input-default-icons: rgba(13, 13, 13, 0.9);
  --input-default-border: rgba(13, 13, 13, 0.5);
  --input-default-label: rgba(13, 13, 13, 0.9);
  --input-default-obligatory: var(--color-alert);
  --input-default-hint: rgba(13, 13, 13, 0.7);

  /* Input - Hover */
  --input-hover-background: rgba(13, 13, 13, 0.05);
  --input-hover-background-2: var(--color-gray-light);
  --input-hover-placeholder: rgba(13, 13, 13, 0.5);
  --input-hover-icons: rgba(13, 13, 13, 0.9);
  --input-hover-border: rgba(13, 13, 13, 0.5);
  --input-hover-label: rgba(13, 13, 13, 0.9);
  --input-hover-obligatory: var(--color-alert);
  --input-hover-hint: rgba(13, 13, 13, 0.7);

  /* Input - Focus */
  --input-focus-background: rgba(13, 13, 13, 0.05);
  --input-focus-background-2: var(--color-gray-light);
  --input-focus-placeholder: rgba(13, 13, 13, 0.2);
  --input-focus-cursor: rgba(13, 13, 13, 0.9);
  --input-focus-icons: rgba(13, 13, 13, 0.9);
  --input-focus-border: rgba(13, 13, 13, 0.9);
  --input-focus-label: rgba(13, 13, 13, 0.9);
  --input-focus-obligatory: var(--color-alert);
  --input-focus-hint: rgba(13, 13, 13, 0.7);

  /* Input - Write */
  --input-write-background: rgba(13, 13, 13, 0.05);
  --input-write-background-2: var(--color-gray-light);
  --input-write-placeholder: rgba(13, 13, 13, 0.9);
  --input-write-cursor: rgba(13, 13, 13, 0.9);
  --input-write-icons: rgba(13, 13, 13, 0.9);
  --input-write-border: rgba(13, 13, 13, 0.9);
  --input-write-label: rgba(13, 13, 13, 0.9);
  --input-write-obligatory: var(--color-alert);
  --input-write-hint: rgba(13, 13, 13, 0.7);

  /* Input - Filled */
  --input-filled-background: var(--color-gray-light);
  --input-filled-background-2: var(--color-gray-light);
  --input-filled-placeholder: rgba(13, 13, 13, 0.9);
  --input-filled-icons: rgba(13, 13, 13, 0.9);
  --input-filled-border: rgba(13, 13, 13, 0.5);
  --input-filled-label: rgba(13, 13, 13, 0.9);
  --input-filled-obligatory: var(--color-alert);
  --input-filled-hint: rgba(13, 13, 13, 0.7);

  /* Input - Filled + Hover */
  --input-filled-hover-background: rgba(13, 13, 13, 0.1);
  --input-filled-hover-background-2: var(--color-gray-light);
  --input-filled-hover-placeholder: rgba(13, 13, 13, 0.9);
  --input-filled-hover-icons: rgba(13, 13, 13, 0.9);
  --input-filled-hover-border: rgba(13, 13, 13, 0.5);
  --input-filled-hover-label: rgba(13, 13, 13, 0.9);
  --input-filled-hover-obligatory: var(--color-alert);
  --input-filled-hover-hint: rgba(13, 13, 13, 0.7);

  /* Input - Disabled States */
  --input-disable-background: var(--color-gray-light);
  --input-disable-background-2: var(--color-gray-light);
  --input-disable-placeholder: rgba(13, 13, 13, 0.3);
  --input-disable-icons: rgba(13, 13, 13, 0.4);
  --input-disable-border: rgba(13, 13, 13, 0.4);
  --input-disable-label: rgba(13, 13, 13, 0.4);
  --input-disable-obligatory: rgba(13, 13, 13, 0.4);
  --input-disable-hint: rgba(13, 13, 13, 0.4);
  --input-disable-filled-background: var(--color-gray-light);
  --input-disable-filled-background-2: var(--color-gray-light);
  --input-disable-filled-placeholder: rgba(13, 13, 13, 0.9);
  --input-disable-filled-icons: rgba(13, 13, 13, 0.4);
  --input-disable-filled-border: rgba(13, 13, 13, 0.4);
  --input-disable-filled-label: rgba(13, 13, 13, 0.4);
  --input-disable-filled-obligatory: rgba(13, 13, 13, 0.4);
  --input-disable-filled-hint: rgba(13, 13, 13, 0.4);

  /* Input - Alert States */
  --input-alert-write-background: var(--color-gray-light);
  --input-alert-write-background-2: var(--color-gray-light);
  --input-alert-write-placeholder: var(--color-alert);
  --input-alert-write-cursor: rgba(13, 13, 13, 0.9);
  --input-alert-write-icons: var(--color-alert);
  --input-alert-write-border: var(--color-alert);
  --input-alert-write-label: var(--color-alert);
  --input-alert-write-obligatory: var(--color-alert);
  --input-alert-write-hint: var(--color-alert);
  --input-alert-filled-background: rgba(197, 35, 10, 0.05);
  --input-alert-filled-background-2: var(--color-gray-light);
  --input-alert-filled-placeholder: var(--color-alert);
  --input-alert-filled-cursor: rgba(13, 13, 13, 0.9);
  --input-alert-filled-icons: var(--color-alert);
  --input-alert-filled-border: var(--color-alert);
  --input-alert-filled-label: var(--color-alert);
  --input-alert-filled-obligatory: var(--color-alert);
  --input-alert-filled-hint: var(--color-alert);
  --input-alert-filled-hover-background: rgba(197, 35, 10, 0.2);
  --input-alert-filled-hover-background-2: var(--color-gray-light);
  --input-alert-filled-hover-placeholder: var(--color-alert);
  --input-alert-filled-hover-cursor: rgba(13, 13, 13, 0.9);
  --input-alert-filled-hover-icons: var(--color-alert);
  --input-alert-filled-hover-border: var(--color-alert);
  --input-alert-filled-hover-label: var(--color-alert);
  --input-alert-filled-hover-obligatory: var(--color-alert);
  --input-alert-filled-hover-hint: var(--color-alert);
}

/* Шрифтовые переменные */
:root {
  --font-family-primary: 'Segoe UI', sans-serif;
  --font-family-secondary: 'Neue Machina', sans-serif;
  --font-family-tertiary: 'Ubuntu Sans', sans-serif;
  --font-family-roboto: 'Roboto', sans-serif;
}

/* Подключение шрифтов */
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Ultralight.eot');
    src: local('Neue Machina Ultralight'), local('NeueMachina-Ultralight'), url('fonts/NeueMachina-Ultralight.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Ultralight.woff2') format('woff2'), url('fonts/NeueMachina-Ultralight.woff') format('woff'), url('fonts/NeueMachina-Ultralight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Light.eot');
    src: local('Neue Machina Light'), local('NeueMachina-Light'), url('fonts/NeueMachina-Light.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Light.woff2') format('woff2'), url('fonts/NeueMachina-Light.woff') format('woff'), url('fonts/NeueMachina-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('NeueMachina-Black.eot');
    src: local('Neue Machina Black'), local('NeueMachina-Black'), url('fonts/NeueMachina-Black.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Black.woff2') format('woff2'), url('fonts/NeueMachina-Black.woff') format('woff'), url('fonts/NeueMachina-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Regular.eot');
    src: local('Neue Machina Regular'), local('NeueMachina-Regular'), url('fonts/NeueMachina-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Regular.woff2') format('woff2'), url('fonts/NeueMachina-Regular.woff') format('woff'), url('fonts/NeueMachina-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Bold.eot');
    src: local('Neue Machina Bold'), local('NeueMachina-Bold'), url('fonts/fonts/NeueMachina-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Bold.woff2') format('woff2'), url('fonts/NeueMachina-Bold.woff') format('woff'), url('fonts/NeueMachina-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Medium.eot');
    src: local('Neue Machina Medium'), local('NeueMachina-Medium'), url('fonts/NeueMachina-Medium.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Medium.woff2') format('woff2'), url('fonts/NeueMachina-Medium.woff') format('woff'), url('fonts/NeueMachina-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Machina';
    src: url('fonts/NeueMachina-Ultrabold.eot');
    src: local('Neue Machina Ultrabold'), local('NeueMachina-Ultrabold'), url('fonts/NeueMachina-Ultrabold.eot?#iefix') format('embedded-opentype'), url('fonts/NeueMachina-Ultrabold.woff2') format('woff2'), url('fonts/NeueMachina-Ultrabold.woff') format('woff'), url('fonts/NeueMachina-Ultrabold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Ubuntu Sans';
    src: url('fonts/UbuntuSans-Regular.eot');
    src: local('fonts/Ubuntu Sans Regular'), local('fonts/UbuntuSans-Regular'),
        url('fonts/UbuntuSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/UbuntuSans-Regular.woff2') format('woff2'),
        url('fonts/UbuntuSans-Regular.woff') format('woff'),
        url('fonts/UbuntuSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Ubuntu Sans';
    src: url('fonts/UbuntuSans-Italic.eot');
    src: local('fonts/Ubuntu Sans Italic'), local('UbuntuSans-Italic'),
        url('fonts/UbuntuSans-Italic.eot?#iefix') format('embedded-opentype'),
        url('fonts/UbuntuSans-Italic.woff2') format('woff2'),
        url('fonts/UbuntuSans-Italic.woff') format('woff'),
        url('fonts/UbuntuSans-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/* This stylesheet generated by Transfonter (https://transfonter.org) on August 23, 2017 4:44 PM */

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI-Light.eot');
    src: local('Segoe UI Light'), local('SegoeUI-Light'), url('fonts/SegoeUI-Light.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI-Light.woff') format('woff'), url('fonts/SegoeUI-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI-BoldItalic.eot');
    src: local('Segoe UI Bold Italic'), local('SegoeUI-BoldItalic'), url('fonts/SegoeUI-BoldItalic.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI-BoldItalic.woff') format('woff'), url('fonts/SegoeUI-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI-SemiBold.eot');
    src: local('Segoe UI Semibold'), local('SegoeUI-SemiBold'), url('fonts/SegoeUI-SemiBold.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI-SemiBold.woff') format('woff'), url('fonts/SegoeUI-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI.eot');
    src: local('Segoe UI'), local('SegoeUI'), url('fonts/SegoeUI.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI.woff') format('woff'), url('fonts/SegoeUI.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI-Bold.eot');
    src: local('Segoe UI Bold'), local('SegoeUI-Bold'), url('fonts/SegoeUI-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI-Bold.woff') format('woff'), url('fonts/SegoeUI-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/SegoeUI-Italic.eot');
    src: local('Segoe UI Italic'), local('SegoeUI-Italic'), url('fonts/SegoeUI-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI-Italic.woff') format('woff'), url('fonts/SegoeUI-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

b,
strong {
    font-weight: 600;
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.svg-container {
    width: 120px;
    height: 42px;
    position: relative;
}

.frame {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.frame.active {
    opacity: 1;
}

#scrollToTop {
    position: fixed;
    bottom: 32px;
    left: 32px;
    display: none;
    border: none;
    z-index: 99;
    width: 44px;
    height: 44px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Color-White-80, rgba(242, 242, 242, 0.80));
}

#scrollToTop:hover {
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
}

path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: dash 5s linear forwards;
}

@keyframes dash {
    to {
        stroke-dashoffset: 0;
    }
}

body {
    display: grid;
    font-family: 'Segoe UI', -apple-system, Tahoma, Geneva, Verdana, "Roboto", Arial, sans-serif;
    width: 100%;
    background: var(--Background, #F2F2F2);
    grid-template-columns: repeat(12, 1fr);
}

.ymaps3x0--map-copyrights__container {
    display: none;
}

.ymaps3x0--map-copyrights__logo {
    display: none;
}

.cookieconsent {
    display: flex;
    position: fixed;
    justify-content: flex-end;
    flex-direction: row;
    align-items: center;
    right: 1%;
    bottom: 32px;
    z-index: 2;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);

}

body::-webkit-scrollbar {
    margin-top: 100px;
    width: 0.35em;
    background: var(--Secondary, #808080);
    border-radius: 0px;
    box-shadow: inset 0 0 0 2px #F2F2F2;
}

body::-webkit-scrollbar-thumb {
    background: var(--Primary, #0D0D0D);
    width: 4px;
    border-radius: 00px;
    position: relative;
}

.cookieconsenttext {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 18px */
    letter-spacing: 0.12px;
    margin-bottom: 16px;
}

.cookieconsenttext a {
    color: #0083C5;
    /* font-family: "Segoe UI"; */
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.cookieconsent .container {
    display: flex;
}

.cookieconsent_container {
    display: flex;
    width: 400px;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    /* border: 1px solid var(--Primary, #0D0D0D); */
    background: var(--Background, #F2F2F2);
    box-shadow: none;
}

.cookieButtons {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.cookieconsent_container .ok {
    display: flex;
    height: 44px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    margin-bottom: 8px;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    /* Desktop/Button Caps */
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer;
}

.cookieconsent_container .ok:hover {
    background: var(--CTA-BTN-Background, rgba(13, 13, 13, 0.80));
    backdrop-filter: blur(7.5px);
}

.cookieconsent_container .neok {
    display: flex;
    height: 44px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border: 0.5px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* Desktop/Button Caps */
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer;
}

.cookieconsent_container .neok:hover {
    background: var(--Secondary-BTN-Background, rgba(13, 13, 13, 0.30));
    backdrop-filter: blur(7.5px);
}

.catalogBody {
    overflow-x: hidden;
}

.hidden {
    display: none;
}

.ajax-container {
    position: relative;
}

.ajax-container .loading-block {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .7);
    height: 100%;
    width: 100%;
    text-align: center;
    z-index: 55;
}

.ajax-container._loading_ .loading-block {
    display: block;
}

.ajax-container .moreProds {
    display: flex;
    align-items: center;
}

.ajax-container .moreProds a {
    margin: auto;
}

header {
    z-index: 2;
    display: grid;
    grid-column: 1 / -1;
    grid-template-rows: repeat(3, 1fr);
    background: var(--Background, #F2F2F2);
}

header.catalog-header {
    display: grid;
    grid-column: 1 / span 12;
    grid-template-rows: repeat(7, 1fr);
    background: var(--Background, #F2F2F2);
}

header.product-header {
    display: grid;
    grid-column: 1 / span 12;
    grid-template-rows: repeat(6, 1fr);
    background: var(--Background, #F2F2F2);
}

.top-header {
    display: grid;
    grid-auto-flow: column;
    text-align: center;
    align-items: center;
    background: black;
    color: white;
    height: 28px;
    grid-column: 1 / span 12;
    grid-row: 1/2;
    /* transition: 0.2s; */
    position: fixed;
    z-index: 1;
    width: 100%;
    top: 0;
}

.adtext {
    color: var(--Typography-Typography-On-Color, #F2F2F2);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    justify-self: end;
}

#close-banner {
    background: #010101;
    border: none;
    height: 16px;
    width: 16px;
    margin: 0;
    padding: 0;
    justify-self: end;
    /* padding: 8px 0; */
    margin-right: 8px;
}

.bottom-header {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-row: 2 / 3;
    width: 100%;
    background: var(--Background, #F2F2F2);
    /* width: auto; */
    /* padding: 0 2% 0 2%; */
    border-bottom: 1px black solid;
    height: 64px;
    position: fixed;
    z-index: 3;
    /* transition: 0.25s; */
}

.bottom-mobile-header {
    display: none;
}

.bottom-header .logo {
    display: grid;
    grid-column: 1/2;
    align-items: center;
    justify-content: start;
    padding: 0;
    margin: 0;
    /* padding-left: 0px; */
    padding-left: 24px;
}

.nav {
    display: flex;
    display: -webkit-flex;
    grid-column: 2;
    /* grid-template-columns: repeat(7, auto); */
    align-items: center;
    justify-content: center;
}

.menu {
    display: -webkit-flex;
    grid-template-columns: repeat(6, auto);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    list-style: none;
    padding: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: max-content;
    gap: 16px;
    margin: 0;
    margin: 0;
}

.menu li {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    width: max-content;
    align-self: center;
    justify-self: center;
}

.menu li.up a {
    display: grid;
    display: -webkit-flex;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    align-items: center;
    height: 36px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border-bottom: 2px solid transparent;
}

.menu li.up a.menuitem:hover {
    color: black;
    border-bottom: 2px solid black;
    text-decoration-thickness: 2px;
    text-underline-offset: 12px;
}

.dropdown {
    display: none;
}

.dropdown.active {
    display: grid;
    padding: 0;
    position: fixed;
    grid-template-columns: repeat(3, 1fr);
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    left: 0;
    align-items: flex-start;
    height: auto;
    justify-content: space-between;
    background: var(--Background, #F2F2F2);
    border-top: 1px solid black;
    z-index: 4;
    border-bottom: 1px solid black;
    top: 64px;
}

#dropdown-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    z-index: 1;
}

.dropdown.active .item {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    grid-row: 1 / 2;
    border-bottom: solid 1px black;
    border-right: solid 1px black;
    padding: 16px;
}

.dropdown.active .item:nth-child(3) {
    border-left: none;
    border-right: none;
    padding: 16px;
}

.item p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    padding: 0 8px;
}

.item ul.second-item,
.item ul.third-item {
    display: flex;
    list-style: none;
    padding: 0;
    flex-direction: column;
}

.item li.cat {
    display: grid;
    flex-direction: column;
    align-items: start;
    width: 100%;
    height: 24px;
    gap: 2px;
    align-self: stretch;
}

.item li.cat a {
    display: flex;
    color: #0D0D0D;
    text-decoration: none;
    text-transform: none;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    height: 24px;
    padding: 0 8px;
}

.item li.cat a:hover {
    display: flex;
    color: #808080 !important;
    text-decoration: none !important;
}

.item li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    align-self: stretch;
    width: 100%;
    height: 24px;
}

.item ul.second-item li a,
.item ul.third-item li a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-decoration: none;
    text-transform: none;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    width: 100%;
}

.item ul.second-item li a:hover,
.item ul.third-item li a:hover {
    color: var(--Typography-Typography-Primary, #808080);
    
}

.personal li a {
    display: grid;
    align-self: center;
    justify-self: center;
    height: 100%;
    width: 100%;
    background: #F2F2F2;
    border-bottom: 2px solid transparent;
}

.personal li a:hover {
    color: black;
    border-bottom: 2px solid var(--Primary, #0D0D0D);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 12px;
}

.personal li a img {
    align-self: center;
    justify-self: center;
    height: 16px;
    width: 16px;
}

#login {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    height: 36px;
    margin-left: 8px;
    padding: 0px 24px;
    align-items: center;
    gap: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    cursor: pointer;
}

#loginMobile {
    background: var(--Background, #F2F2F2);
    margin-left: 8px;
    align-items: center;
    justify-self: center;
    gap: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    cursor: pointer;
}

#login:hover, #loginMobile:hover{
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
}

.tab {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column: 1/ -1;
    overflow: hidden;
    background: var(--Background, #F2F2F2);
}


/* Style the buttons that are used to open the tab content */

.tab button {
    display: grid;
    background: var(--Background, #F2F2F2);
    grid-row: 1/2;
    color: #808080;
    align-items: start;
    justify-content: start;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    transition: 0.3s;
    font-weight: 600;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 0.05em;
    transition: all 1s;
    text-transform: uppercase;
    text-align: left;
    padding: 8px;
}

.tab button:hover {
    color: #4D4D4D;
     background: var(--Background, #F2F2F2);
}

.tabcontent ul {
    display: grid;
    list-style: none;
    padding: 0;
}

.countryTab ul {
    list-style: none;
    padding: 0;
    width: 100%;
    margin: 0;
}


/* Change background color of buttons on hover */



/* Create an active/current tablink class */

.tab button.active {
    word-wrap: normal;
    color: black;
   
}

/* Style the tab content */

.tabcontent {
    display: none;
    padding: 0;
    grid-auto-columns: 100%;
    align-items: start;
    justify-content: start;
}

.countryTab {
    display: none;
    padding: 6px 12px;
}

.collection-uri {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-column: 1 / -1;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.collection-uri a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 8px;
}

.collection-uri a img {
    height: 20px;
    width: 20px;
}

.collection-uri a.all:hover {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-decoration: none !important;
    background: rgba(13, 13, 13, 0.20);
}

.col-url {
    display: flex;
}

.personal {
    display: grid;
    margin: 0;
}

.personal_buttons {
    display: grid;
    align-items: center;
    justify-content: end;
    padding-right: 24px;
}

.personal .auth {
    display: grid;
    list-style: none;
    align-items: center;
    grid-template-columns: 36px 36px 36px 36px 36px auto;
    /* grid-column: 12 / span 12; */
    justify-content: end;
    margin: 0;
}

.personal .no-auth {
    display: grid;
    list-style: none;
    align-items: center;
    grid-template-columns: 36px 36px auto;
    /* grid-column: 12 / span 12; */
    justify-content: end;
    margin: 0;
}

#searchButton {
    border: none;
    border-bottom: 2px solid transparent;
    background-color: transparent;
}

#searchButton:hover {
    cursor: pointer;
    border-bottom: 2px solid var(--Primary, #0D0D0D);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 12px;
}

#searchForm {
    display: none;
}

#searchFormMobile {
    display: none;
}

#searchForm.active {
    display: flex;
    position: absolute;
    height: 100%;
    background-color: white;
    width: 100%;
    z-index: 1;
}

#searchForm.active input {
    width: 96%;
    padding: 0 1%;
    border: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* Desktop/Button Caps */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.6px;
    text-transform: uppercase;
    -webkit-appearance: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.search-results {
    display: none;
    text-align: left;
    background: #F3F3F3;
    border: thin solid #ccc;
    position: absolute;
    top: 64px;
    width: 100%;
}

#searchForm.active input:focus {
    outline: none;
}

#searchForm.active input::placeholder {
    width: 96%;
    border: none;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

#searchForm.active input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    background: url(/assets/template/main/images/clear.svg) center center;
}

#searchForm.active input::-webkit-search-cancel-button:hover {
    background: url(/assets/template/main/images/typehover.svg) center center;
}

.search-results {
    overflow-y: auto;
    height: max-content;
}

.simplesearch-result {
    display: grid;
    padding: 4px 24px;
    border-bottom: 0.5px solid var(--Tertiary, #B2B2B2);
    height: 64px;
    grid-auto-flow: column;
    background: var(--Background, #F2F2F2);
}

.simplesearch-result:hover {
    grid-auto-flow: column;
    background: var(--Surfaces, #FFF);
}

.search-item #msGallery {
    display: grid;
    grid-column: 1;
}

.search-item p {
    display: grid;
    grid-column: 2;
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 21px */
    letter-spacing: 0.14px;
    padding: 0 24px;
    text-transform: uppercase;
    width: 130px;
}

.search-item p.sizes {
    color: #000;
    padding: 0 0px;
    grid-column: 1;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-transform: none;
    gap: 8px;
}

.search-item p.sizes-mobile {
    display: none;
}

.search-item .parent-mobile {
    display: none;
}

.search-item .inputs-search {
    display: grid;
    grid-column: 3;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
}

.search-item .inputs-search label {
    display: flex;
    flex-direction: row;
    height: 32px;
    padding: 0 10px;
    width: max-content;
    justify-content: center;
    align-items: center;
    margin-right: 0px;
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Secondary, #B2B2B2);
    gap: 0px;
}

.inputs-search label span {
    color: var(--Color-Black-100, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    text-align: center;
}

.simplesearch-result #msGallery img {
    height: 56px;
}

.simplesearch-result a.search-item {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
    text-decoration: none;
}

.simplesearch-result a.search-item .pagetitleParent-mobile {
    display: none;
}

.simplesearch-result a.parent {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: end;
    display: grid;
    grid-column: 2;
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
    text-transform: uppercase;
    text-decoration: none;
}

.simplesearch-result a.parent p {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
}

.empty-search {
    display: grid;
    position: relative;
    top: 145px;
    grid-column: 2 / 12;
    min-height: calc(100vh);
}

.personal li {
    display: grid;
    height: 34px;
    width: 36px;
    align-items: center;
    justify-content: center;
}

.banner {
    display: grid;
    grid-column: 1 / span 12;
    grid-template-columns: repeat(1, 1fr);
    position: relative;
    top: 61px;
    width: 100%;
}

.slider {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-column: 1 /-1;
    align-items: stretch;
}

.slider-mobile {
    display: none;
}

.slide {
    width: 100%;
    aspect-ratio: 16 / 9;
}

.banner .slick-slide img {
    display: grid;
    position: absolute;
    width: 100vw;
    aspect-ratio: 16 / 9;
    height: auto;
}

.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.slick-dots {
    bottom: 5%;
}

.slick-dots li.slick-active button:before {
    opacity: 1;
    color: #808080;
}


.slick-dots li {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 4px 0 4px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 8px;
    height: 8px;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 8px;
    line-height: 8px;
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 8px;
    content: '•';
    text-align: center;
    opacity: 1;
    color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-initialized .slick-slide {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(12, 1fr);
}

.collection-description {
    display: grid;
    grid-column: 1 / 5;
    grid-row: auto / -1;
    flex-direction: column;
    position: relative;
    justify-content: stretch;
    background: transparent;
    padding: 24px;
    padding-bottom: 64px;
    padding-top: 0px;
    padding-right: 0px;
}

.collection-description h1 {
    color: var(--Typography-Typography-On-Color, black);
    font-family: "Ubuntu Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 12px;
}

.collection-description p {
    color: var(--Typography-Typography-On-Color, black);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0;
    margin-bottom: 24px;
}

.desc-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.desc-buttons a {
    text-decoration: none;
}

a.more {
    background-color: black;
    border: solid 1px black;
    color: var(--CTA-BTN-Typography, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    margin-right: 8px;
    padding: 0 24px;
}

a.more:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: #0D0D0D;
    border: 1px solid var(--Primary, #0D0D0D);
}

a.more:active {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Primary-60, rgba(13, 13, 13, 0.60));
    color: #0D0D0D;
}

a.opt-price {
    background-color: white;
    color: var(--Secondary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: solid 1px black;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    padding: 0 24px;
    gap: 6px;
}

a.opt-price:hover {
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
    color: #0D0D0D;
}

.email-sender {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.email-sender input[type='email'] {
    display: grid;
    grid-column: 1 / span 2;
    height: 52px;
    padding: 0 16px;
    background-color: white;
    border: none;
    border-bottom: solid 1px #0D0D0D;
    border-radius: 0;
}

.email-sender button[type='submit'] {
    display: grid;
    grid-column: 3 / span 1;
    grid-auto-flow: column;
    text-align: center;
    align-items: center;
    padding: 0 16px;
    border-radius: 0;
}

.personal-dan {
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
    color: #808080;
}

button.close {
    background: white;
    border: none;
    border-left: 1px solid black;
    width: 176px;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    padding: 0 24px;
    gap: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;




}

button.close:hover {
    border-left: 1px solid var(--Primary, #0D0D0D);
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
}

.index-lookbook {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    position: relative;
    top: 61px;
}

.lookscollections {
    display: grid;
    height: 50vw;
    grid-template-columns: repeat(2, 1fr);
    overflow: hidden;
    border-top: 1px black solid;
}

.lookscollections a {
    display: block;
    position: relative;
    overflow: hidden;
    border-right: 1px solid #0D0D0D;
}

.lookscollections a .text {
    position: absolute;
    display: grid;
    padding-top: 24px;
    padding-left: 24px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.42px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 4px;
    z-index: 1;
}

.lookscollections a:nth-child(2) .text {
    right: 0;
          /* padding-left: 0сбросить, если не нужен */
    padding-right: 24px;  /* вместо левого отступа */
    /* z-index: 1; — добавь, если нужно (скорее всего, да) */
}

.lookscollections a .text p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: none;
    margin: 0;
    margin-top: 4px;
}

.lookscollections a:nth-child(2) .text p {
    text-align: end;
}

.lookscollections a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.lookscollections a img:hover {
    transform: scale(1.05);
}

.lastcollection-index {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    position: relative;
    top: 58px;
    border-top: solid 1px black;
}

.lastcollection-index.slick-initialized .slick-slide {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(1, 1fr);
}

.lastcollection-index .product-cart {
    border-bottom: none;

}

.lastcollection-index .product-cart p.sale {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.36px;
}

footer {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    top: 58px;
    position: relative;
    align-items: flex-start;
    border-top: 1px solid black;
    grid-column: 1 / span 12;
    grid-row: 6 / 7;
    background: rgb(255, 255, 255);
}

footer.desctop .up-footer {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: auto 66px;
    height: 240px;
    grid-auto-flow: column;
    grid-column: 1 / -1;
}

.little-menu {
    display: grid;
    grid-auto-flow: column;
    justify-content: stretch;
    padding-left: 24px;
    padding-top: 32px;
    grid-column: 1 / 8;
}

.footer-block.first {
    display: grid;
    grid-column: 2 / 3;
    height: 100%;
}

.first .social {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 20px;
}

.social-with-copiryght {
    display: grid;
}

.copyright {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: 0.1px;
    align-self: end;
}

footer .city {
    margin: 0;
    margin-bottom: 16px;
}

.city .country-city {
    display: flex;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin: 0;
    margin-bottom: 4px;
}

.city .address {
    display: flex;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin: 0;
    margin-bottom: 4px;
}

.city .mail {
    display: flex;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 12px;
    margin: 0;
    text-decoration: none;
}

.city .mail a {
    text-decoration: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
}

.opt h3 {
    display: flex;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    margin: 0;
    margin-bottom: 8px;
}

.opt p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    margin: 0;
    margin-bottom: 2px;
}

.opt p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

.opt p span {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
}

.opt span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

.opt span a:hover {
    color: #0083C5;
}

.footer-block.second {
    display: grid;
    grid-column: 8 / 12;
    grid-template-columns: auto auto;
    justify-content: space-between;
}

.tablet-mobile {
    display: none;
}

.footer-block.third {
    display: grid;
    grid-column: 10/13;
}

.lm-block h4 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 16px;
}


.lm-block ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.lm-block ul li {
    display: flex;
    height: 24px;
    align-items: center;
    flex-shrink: 0;
    align-self: stretch;
}

.lm-block ul li a {
    color: var(--Tertiary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    width: 100%;
    text-decoration: none;
}

.lm-block ul li a:hover {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    width: 100%;
}

.footer-subs {
    display: grid;
    grid-column: 9 / -1;
    padding-top: 32px;
    align-self: start;
}

.footer-subs h4 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 16px;
}

.desctop form.subscribe-form {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr;
    grid-column: 1 / -1;
    margin-right: 24px;
    margin-bottom: 8px;
}

.desctop form input {
    display: flex;
    height: 44px;
    padding: 0 12px;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    align-self: stretch;
    border: none;
    border-radius: 0px;
    border-bottom: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--Surfaces, #FFF);
}

.desctop form input:focus:not(:focus-visible) {
    outline: none;
}

.desctop form input:focus {
    outline: none;
}

.desctop form input:focus-visible {
    height: 43px;
    padding: 0px 12px;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    align-self: stretch;
    outline: none;
    border: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    border-radius: 0px;
    background: var(--Surfaces, #FFF);
}

.desctop form button {
    display: flex;
    height: 45px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    border: none;
    background: #FFF;
    color: var(--Tertiary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.12px;
    border-bottom: 1px solid #0D0D0D;
}

.desctop form button:hover {
    color: var(--Tertiary-BTN-Typography, #666);
    font-family: "Ubuntu Sans";
    cursor: pointer;
}

.desctop .footer-subs span {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.048px;
    padding-right: 24px;
}

.desctop .footer-subs a {
    color: var(--Link-Link, #333);
    font-family: "Segoe UI";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 5%;
    text-underline-offset: 25%;
    text-underline-position: from-font;
}

.desctop .bottom-footer {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    justify-content: space-between;
    padding: 16px 24px;
    border-top: 1px solid var(--Primary-Primary-30, #B2B2B2);
    background: #FFF;
}

.copyright {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    align-self: end;
    justify-self: end;
}

.bottom-footer .footer-contacts {
    display: grid;
    grid-auto-flow: column;
    gap: 64px;
}

.footer-contacts .country-block {
    display: grid;
    grid-auto-flow: column;
    gap: 8px;
}

.country-block p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0;
}

.country-block .phones {
    display: grid;
    margin: 0;
    border-left: 1px solid var(--Primary-Primary-30, #B2B2B2);
    padding-left: 8px;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.phones p {
    margin: 0;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

.phones p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

.phones p span,
.phones p span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}



.breadcrumbs {
    height: 64px;
    display: grid;
    position: fixed;
    grid-column: 1 / span 12;
    grid-row: 3 / 4;
    align-items: center;
    justify-content: start;
    border-bottom: 1px solid black;
    width: 100%;
    z-index: 1;
    background: var(--Background, #F2F2F2);
    border-top: 1px solid black;
}

.mobile-crumbs {
    width: 100%;
    display: none !important;
    padding: 8px 32px;
}

.mobile-category {
    width: 100%;
    display: none !important;
    padding: 8px 32px;
}

ul.breadcrumb {
    display: grid;
    grid-column: 2 / 4;
    grid-auto-flow: column;
    margin: 0;
    list-style: none;
    align-items: center;
    padding-left: 24px;
}

ul.breadcrumb li {
    display: inline;
    font-size: 18px;
}

ul.breadcrumb li+li:before {
    padding: 0 8px;
    color: black;
    content: "/";
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* font-family: "Segoe UI"; */
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

ul.breadcrumb li a {
    color: black;
    text-decoration: none;
    font-weight: 400;
    font-size: 13px;
    line-height: 13px;
    letter-spacing: 0.01em;
}

ul.breadcrumb li.current {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
}

ul.breadcrumb li a:hover {
    color: #01447e;
    text-decoration: underline;
}

.filters {
    display: grid;
    background-color: #F2F2F2;
    position: fixed;
    z-index: 1;
    height: 44px;
    grid-template-columns: 1fr auto;
    grid-row: 4 / 5;
    grid-column: 1 / -1;
    width: 100%;
    border-bottom: 1px solid black;
}

.button-container {
    display: grid;
    grid-column: 1 / 2;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
}

.chips {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: end;
    padding-right: 24px;

}

.chip {
    display: grid;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.chip:hover {
    background: var(--Secondary, #808080);
}

.chip.active {
    background: var(--Primary, #0D0D0D);
}

.chip a {
    display: inline-flex;
    color: var(--Typography-Typography-On-Color, #F2F2F2);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-decoration: none;
    gap: 8px;
}

.button-container button#openFIlter {
    display: grid;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    width: 100%;
    grid-column: 1 / 2;
    grid-auto-flow: column;
    height: 100%;
    justify-content: start;
    background: #F2F2F2;
    border: none;
    padding: 0 24px;
    align-items: center;
    justify-self: center;
    align-self: center;
    gap: 8px;
    font-size: 12px;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
}

.button-container button#openFIlter:hover {
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
    height: 44px;
    cursor: pointer;
    border-right: 1px solid black;
}


.wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: stretch;
    position: relative;
    top: calc(28px + 44px + 64px + 62px);
    width: 100%;
    grid-row: 5/6;
    grid-column: 1/-1;
    z-index: 0;
}

.wrapper h1 {
    display: grid;
    grid-column: 1 / -1;
    align-items: start;
    justify-content: center;

}

.sf_h1 {
    display: grid;
    grid-column: 2/12;
    grid-row: 6/7;
    position: relative;
    top: 205px;
    font-size: 17px;
}

.sf_content {
    display: grid;
    grid-column: 2/12;
    grid-row: 7/8;
    position: relative;
    top: 205px;
    margin-bottom: 32px;
    font-size: 14px;
}

.sf_content p {
    margin: 0;
    margin-bottom: 16px;
}

.wrapperFavorite {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: stretch;
    position: relative;
    top: calc(28px + 44px + 27px);
    width: 100%;
    grid-row: 5/6;
    grid-column: 1/-1;
    z-index: 0;
    min-height: calc(100vh - 385px);
}

.wrapperFavorite h1 {

    display: grid;
    grid-column: 1 / -1;
    align-items: start;
    justify-content: center;

}

.wrapper-search {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: stretch;
    position: relative;
    top: calc(28px + 44px + 42px);
    width: 100%;
    grid-row: 5 / 6;
    grid-column: 1 / -1;
    z-index: 0;
}

.product-cart {
    position: relative;
    /* height: -webkit-fill-available; */
    border-right: 1px solid var(--Neutral-5, #0D0D0D);
    border-bottom: 1px solid var(--Neutral-5, #0D0D0D);
    justify-self: auto;
}

.litle-products .product-cart {
    position: relative;
    /* height: -webkit-fill-available; */
    /* border-top: 1px solid var(--Neutral-5, #0D0D0D); */
    border-left: 1px solid var(--Neutral-5, #0D0D0D);
    border-right: none;
    border-bottom: 1px solid var(--Neutral-5, #0D0D0D);
    justify-self: auto;
}

.product-cart a {
    color: black;
}

.product-cart .img {
    display: block;
    overflow: hidden;
}

.product-cart .img img {

    width: 100%;
    transition: 1s;
    display: block;

}

#mse2_results {
    margin-bottom: 0px !important;
}

.product-cart .img img.logo-img {

    width: 100%;
    transition: 1s;
    display: block;
    aspect-ratio: 10/16;
}

.product-cart .img img:hover {
    transform: scale(1.05);
}

.like {
    position: absolute;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="16" viewBox="0 0 18 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.27243 1.85967e-05L5.28588 0C6.67804 0.00834153 8.01089 0.556198 8.99776 1.52507C9.48188 1.0452 10.0566 0.663654 10.6895 0.402098C11.3312 0.136948 12.0198 0.000403246 12.7153 0.000403246C13.4108 0.000403246 14.0994 0.136947 14.741 0.402098C15.3819 0.666947 15.9632 1.05483 16.451 1.54324C17.4431 2.52767 18 3.86 18 5.24888C18 6.63816 17.4427 7.97087 16.4502 8.95537C16.4499 8.95564 16.4496 8.95591 16.4494 8.95617L9.63683 15.7372C9.46782 15.9054 9.2378 16 8.99785 16C8.7579 16 8.52787 15.9054 8.35887 15.7372L1.54545 8.9553C1.54532 8.95518 1.54557 8.95543 1.54545 8.9553C0.808101 8.22208 0.30573 7.29002 0.1019 6.27645C-0.101963 5.26271 0.00150337 4.21211 0.399348 3.25616C0.797193 2.3002 1.47174 1.48138 2.33854 0.902196C3.20535 0.323008 4.22589 0.00918702 5.27243 1.85967e-05ZM5.28168 1.77779C4.59165 1.78514 3.91898 1.99266 3.34737 2.3746C2.7739 2.75779 2.32763 3.29951 2.06442 3.93196C1.8012 4.5644 1.73275 5.25948 1.86763 5.93016C2.0025 6.60084 2.33471 7.21733 2.82266 7.70246L8.99785 13.849L15.1739 7.70159C15.8309 7.0502 16.1998 6.16826 16.1998 5.24888C16.1998 4.32949 15.8309 3.44756 15.1739 2.79617L15.1706 2.79285C14.8498 2.47148 14.4676 2.21626 14.0461 2.04207C13.6246 1.86789 13.1722 1.77818 12.7153 1.77818C12.2584 1.77818 11.806 1.86789 11.3845 2.04207C10.963 2.21626 10.5807 2.47147 10.26 2.79284L10.2521 2.80076C10.0663 2.98228 9.9044 3.18611 9.77022 3.40755C9.60767 3.67579 9.31439 3.83999 8.99785 3.83999C8.68131 3.83999 8.38803 3.67579 8.22548 3.40755C8.09129 3.18611 7.92941 2.98223 7.74367 2.80071L7.73939 2.79654C7.08757 2.15101 6.20459 1.78507 5.28168 1.77779Z" fill="%230D0D0D"/></svg>');
    height: 16px;
    width: 18px;
    top: 24px;
    right: 24px;
    z-index: 1;
}

.like.is-actived {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="16" viewBox="0 0 18 16" fill="none"><path d="M16.4495 1.53853C15.9622 1.05115 15.3817 0.66419 14.7419 0.400091C14.102 0.135991 13.4155 0 12.722 0C12.0286 0 11.342 0.135991 10.7022 0.400091C10.0623 0.66419 9.48188 1.05115 8.99449 1.53853C8.50711 1.05115 7.92667 0.66419 7.28681 0.400091C6.64695 0.135991 5.96041 0 5.26697 0C4.57352 0 3.88698 0.135991 3.24712 0.400091C2.60727 0.66419 2.02682 1.05115 1.53944 1.53853C0.552996 2.52727 0 3.85987 0 5.24824C0 6.63662 0.552996 7.96921 1.53944 8.95795L8.35523 15.7369C8.43893 15.8202 8.53851 15.8864 8.64823 15.9316C8.75795 15.9767 8.87563 16 8.99449 16C9.11335 16 9.23104 15.9767 9.34075 15.9316C9.45047 15.8864 9.55005 15.8202 9.63376 15.7369L16.4495 8.95795C17.4425 7.97261 18 6.63874 18 5.24824C18 3.85775 17.4425 2.52387 16.4495 1.53853Z" fill="%230D0D0D"/></svg>');
}

.product-like.is-active {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="16" viewBox="0 0 18 16" fill="none"><path d="M16.4495 1.53853C15.9622 1.05115 15.3817 0.66419 14.7419 0.400091C14.102 0.135991 13.4155 0 12.722 0C12.0286 0 11.342 0.135991 10.7022 0.400091C10.0623 0.66419 9.48188 1.05115 8.99449 1.53853C8.50711 1.05115 7.92667 0.66419 7.28681 0.400091C6.64695 0.135991 5.96041 0 5.26697 0C4.57352 0 3.88698 0.135991 3.24712 0.400091C2.60727 0.66419 2.02682 1.05115 1.53944 1.53853C0.552996 2.52727 0 3.85987 0 5.24824C0 6.63662 0.552996 7.96921 1.53944 8.95795L8.35523 15.7369C8.43893 15.8202 8.53851 15.8864 8.64823 15.9316C8.75795 15.9767 8.87563 16 8.99449 16C9.11335 16 9.23104 15.9767 9.34075 15.9316C9.45047 15.8864 9.55005 15.8202 9.63376 15.7369L16.4495 8.95795C17.4425 7.97261 18 6.63874 18 5.24824C18 3.85775 17.4425 2.52387 16.4495 1.53853Z" fill="%230D0D0D"/></svg>');
    height: 38px;
    width: 38px;
    justify-self: start;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
    position: relative;
}

p.sale {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    position: absolute;
    top: 24px;
    left: 24px;
    z-index: 2;
    margin: 0;
}

.descr {
    position: absolute;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    bottom: 0;
}

.title-price {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    width: 100%;
}

.descr .title,
.descr .price {
    margin: 24px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.descr .price {
    text-align: right;
}

.filter-container {
    display: none;
}

.filter-container.filterActive {
    background-color: #F2F2F2;
    display: flex;
    flex-direction: column;
    width: 25%;
    z-index: 1;
    position: fixed;
    height: 100vh;
    top: -154px;
    bottom: 0;
    border-right: 1px solid #0d0d0d;
    transform: translateX(0);
    z-index: 2;
}

.fullscreen-filter {
    display: none;
}

.fullscreen-filter.opened {
    display: flex;
    position: fixed;
    top: -138px;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.2);
    z-index: 3;
}

.filter-content::-webkit-scrollbar {
    margin-top: 100px;
    width: 0.35em;
    background: var(--Secondary, #808080);
    border-radius: 0px;
    box-shadow: inset 0 0 0 2px #F2F2F2;
}

.filter-content::-webkit-scrollbar-thumb {
    background: var(--Primary, #0D0D0D);
    width: 4px;
    border-radius: 00px;
    position: relative;
}

.filter-header {
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: space-between;
    top: 0;
    background-color: #F2F2F2;
}

.filter-header .filter-title {
    background: var(--Background, #F2F2F2);
    display: flex;
    align-items: center;
    justify-content: start;
    height: fit-content;
    width: 100%;
    padding-left: 24px;
    padding: 14px 0;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border-bottom: solid 1px #0D0D0D;
    padding-left: 24px;
}

.filter-header .closeFilter {
    display: flex;
    height: 100%;
    padding: 0 24px;
    gap: 8px;
    align-items: center;
    justify-content: center;
    background-color: #F2F2F2;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: solid 1px #0D0D0D;
    border-top: none;
}

.filter-header .closeFilter:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    border-right: none;
    /* Опционально: улучшить читаемость */
    color: #FFFFFF; /* или другой светлый цвет */
}

.filter-header .closeFilter svg {
    position: relative;
    top: 1px;
}

#mse2_filters {
    margin-bottom: 48px;
}

#pdopage {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: stretch;
    position: relative;
    width: 100%;
    grid-row: 5 / 6;
    grid-column: 1 / -1;
    z-index: 0;
}




.filter-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    overflow-y: scroll;
    height: 100vh;
}

.accordion,
.widget {
    background: var(--Background, #F2F2F2);
    color: #0D0D0D;
    cursor: pointer;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.active-accordion,
.accordion:hover {
    background: var(--Background, #F2F2F2);
}

.sortHrefs {
    display: grid;
    gap: 16px;
    margin-bottom: 16px;
}

.sortHrefs a {
    display: flex;
    padding: 0px 16px;
    justify-content: flex-start;
    align-items: center;
    height: 44px;
    width: 100%;
    box-sizing: border-box;
    border: 0.5px solid var(--Secondary, #808080);
    gap: 8px;
    background: var(--Background, #F2F2F2);
    text-transform: uppercase;
    text-decoration: none;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #0D0D0D !important;

}

.widget__inner {
    background: var(--Background, #F2F2F2);
    max-height: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    gap: 16px;
    align-self: stretch;
    margin-bottom: 16px;
}

.ajax-disabled {
    display: none;
}

.accordion:after {
    width: 16px;
    height: 16px;
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.00008 2.6665C8.36827 2.6665 8.66675 2.96498 8.66675 3.33317V7.33317H12.6667C13.0349 7.33317 13.3334 7.63165 13.3334 7.99984C13.3334 8.36803 13.0349 8.6665 12.6667 8.6665H8.66675V12.6665C8.66675 13.0347 8.36827 13.3332 8.00008 13.3332C7.63189 13.3332 7.33341 13.0347 7.33341 12.6665V8.6665H3.33341C2.96522 8.6665 2.66675 8.36803 2.66675 7.99984C2.66675 7.63165 2.96522 7.33317 3.33341 7.33317H7.33341V3.33317C7.33341 2.96498 7.63189 2.6665 8.00008 2.6665Z" fill="%230D0D0D"/></svg>');
    font-size: 15px;
    color: #0D0D0D;
    float: right;
    margin-left: 5px;
}

.active-accordion:after {
    color: #0D0D0D;
    font-size: 24px;
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.66675 8.00016C2.66675 7.63197 2.96522 7.3335 3.33341 7.3335H12.6667C13.0349 7.3335 13.3334 7.63197 13.3334 8.00016C13.3334 8.36835 13.0349 8.66683 12.6667 8.66683H3.33341C2.96522 8.66683 2.66675 8.36835 2.66675 8.00016Z" fill="%230D0D0D"/></svg>');
}

.panel label {
    display: flex;
    gap: 8px;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.panel label span {
    border-radius: 100px;
    display: flex;
    width: 12px;
    height: 12px;
}

.filter-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.filter-group li {
    display: flex;
    align-items: center;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    padding: 0;
    margin: 0 0 10px !important;
    height: 44px;
}

.filter-group li:hover {
    background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
    cursor: pointer;
}

.filter-group li .control--checkbox:hover {
    cursor: pointer;
}

/* Изменение border у li при hover на label */
.filter-group li:hover {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background-Hover, #e0e0e0);

}

/* Плавный переход для всех изменений */
.filter-group li {
    transition: all 0.2s ease-in-out;
}

.filter-group li label {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 16px;
}

.panel .value {
    display: flex;
    height: 44px;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    gap: 8px;
    background: var(--Background, #F2F2F2);
}

#category .value,
#color .value {
    display: flex;
    height: 44px;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    flex-basis: 48%;
    background: var(--Background, #F2F2F2);
}

#size .value {
    display: flex;
    height: 44px;
    flex-basis: 48%;
    align-items: center;
    gap: 8px;
}

#size .value:last-child {
    display: flex;
    height: 44px;
    flex-basis: 100%;
    align-items: center;
    gap: 8px;
}

.ajax-start {
    display: flex;
    margin-top: 32px;
    height: 52px;
    width: 100%;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: none;
}

.resetFilter {
    display: flex;
    height: 52px;
    width: 100%;
    margin-top: 8px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #0D0D0D;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}

#catalog_sort_block .value {
    display: flex;
    height: 44px;
    align-items: center;
    padding: 0;
    margin-bottom: 16px;
    gap: 8px;
    background: var(--Background, #F2F2F2);

}


#catalog_sort_block .value label {
    display: flex;
    height: 44px;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Secondary, #808080);
    background: var(--Background, #F2F2F2);
}

#catalog_sort_block .value label._active_ {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}


/* Hover */


#catalog_sort_block .value label:hover {
    border: 1px solid var(--Primary, #0D0D0D);
}


/* Disabled */

.value input[type=radio]:disabled+label {
    background: #efefef;
    color: #666;
}

.value input[type=checkbox] {
    display: none;
}

.value label {
    display: flex;
    height: 44px;
    width: 100%;
    padding: 0px 16px;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Secondary, #808080);
    background: var(--Background, #F2F2F2);
}

.value label input[type=checkbox]:checked {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}


/* Hover */

.value label:hover {
    border-color: var(--Primary, #0D0D0D);
}

.filter-group li label:hover {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    display: flex;
    height: 44px;
    padding: 0px 16px;
    justify-content: start;
    align-items: center;
}

/* Disabled */
.filter-group li label input[type=checkbox]:checked {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}

.value input[type=checkbox]:disabled+li {
    background: #efefef;
    border: 1px solid var(--Primary, #0D0D0D);
    color: #666;
}

.selected-label {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}


.filter-group li .control--checkbox:hover {
    cursor: pointer;
    /* Указатель курсора */
}

/* Стиль для li, если чекбокс внутри него отмечен */
.filter-group li input[type="checkbox"]:checked+label {
    background: var(--Background-Active, #d0d0d0);
    color: var(--Primary, #0D0D0D);
    /* Цвет текста */
    font-weight: bold;
    /* Жирный шрифт */
    border: 2px solid var(--Primary, #0D0D0D);
    /* Граница вокруг li */
}

.filter-group li input[type="checkbox"]:checked+label .control__indicator {
    background: var(--Primary, #0D0D0D);
    /* Цвет индикатора */
    border-color: var(--Primary, #0D0D0D);
    /* Цвет границы индикатора */
}

/* Плавный переход для всех изменений */
.filter-group li {
    transition: all 0.2s ease-in-out;
}

.sortHrefs a:hover {
    background: var(--Background-Hover, #e0e0e0);
    border-color: var(--Primary, #0D0D0D);
    color: var(--Primary, #0D0D0D);
}

.sortHrefs a.active {
    background: var(--Background-Active, #d0d0d0);
    border-color: var(--Primary, #0D0D0D);
    color: var(--Primary, #0D0D0D);
    font-weight: bold;
}

/* Checkboxes */
.filter-group li label:hover {
    border-color: var(--Primary, #0D0D0D);
}

.filter-group li input[type="checkbox"]:checked+label {
    background: var(--Background-Active, #d0d0d0);
    border-color: var(--Primary, #0D0D0D);
    color: var(--Primary, #0D0D0D);
    font-weight: bold;
}

/* Buttons */
.ajax-start:hover {
    background: var(--Buttons-CTA-Hover, #2d2d2d);
    color: var(--Typography-Typography-CTA-Hover, #ffffff);
}

.ajax-start:active {
    background: var(--Buttons-CTA-Active, #000000);
    transform: scale(0.98);
}

.resetFilter:hover {
    background: var(--Background-Hover, #e0e0e0);
    border-color: var(--Primary, #0D0D0D);
    color: var(--Primary, #0D0D0D);
}

.resetFilter:active {
    background: var(--Background-Active, #d0d0d0);
    transform: scale(0.98);
}

.filter-group li.active {
    border: 1px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
}


.product-breadcrumbs {
    display: grid;
    grid-row: 4 / 5;
    width: 100%;
    grid-column: 1 / -1;
}

.back {
    display: grid;
    grid-column: 1 / 2;
    height: 64px;
}

#backButton {
    display: grid;
}

#backButtonBlog {
    display: grid;
}



#backButton button {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: none;
    padding: 0 24px;
    border-right: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    border-radius: 0;
}

#backButtonBlog button {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: none;
    display: flex;
    padding: 0px 32px 0px 20px;
    border-right: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    border-radius: 0;
    align-items: center;
}

#backButton button a,
#backButtonBlog button a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: black;
    gap: 8px;
}

.product-wrapper {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    position: relative;
    top: calc(28px + 44px + 64px + 17px);
    grid-column: 1 / -1;
    grid-row: 5 / 6;
}

.gallery-with-other {
    display: grid;
    grid-column: 1 / 9;
    grid-template-rows: auto auto;
    align-items: start;
    justify-content: start;
    border-right: 1px solid black;
}

.gallery-wrapper {
    display: grid;
    grid-column: 1/9;
    grid-template-columns: repeat(2, 1fr);
}

.mobile-gallery-wrapper {
    display: none;
}

.progress {
    display: none;
}

.img-container {
    overflow: hidden;
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    align-items: center;
    justify-content: center;
}

.img-container:nth-child(2n) {
    overflow: hidden;
    border-right: none;
    border-bottom: 1px solid black;
    align-items: center;
    justify-content: center;
}

.img-container img {
    display: flex;
    width: 100%;
    transition: 1s;
}

.img-container img:hover {
    transform: scale(1.2)
}

.upLine {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: minmax(max-content, 1px) 1fr;
    align-items: start;
    justify-content: stretch;
    gap: 8px;
    height: max-content;
    margin-bottom: 32px;
}

.info-wrapper {
    grid-column: 9 / -1;
    grid-template-columns: repeat(4, 1fr);
    height: max-content;
    align-items: start;
    justify-items: start;
    display: grid;
    flex-direction: column;
    align-self: stretch;
    padding: 40px;
    padding: 40px 24px 64px 24px;
}

.ms2_form {
    display: grid;
}

.product-head {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / 9;
    width: 100%;
    grid-template-rows: max-content;
}

.product-like {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.86112 3.00002L7.87605 3C9.42272 3.00938 10.9035 3.62572 11.9999 4.7157C12.5377 4.17585 13.1763 3.74661 13.8794 3.45236C14.5923 3.15407 15.3573 3.00045 16.13 3.00045C16.9027 3.00045 17.6677 3.15407 18.3805 3.45236C19.0926 3.75031 19.7383 4.18668 20.2804 4.73615C21.3825 5.84362 22.0012 7.34249 22.0012 8.90498C22.0012 10.4679 21.3821 11.9672 20.2794 13.0748C20.2791 13.0751 20.2788 13.0754 20.2785 13.0757L12.7099 20.7043C12.5221 20.8935 12.2666 21 12 21C11.7334 21 11.4779 20.8935 11.2901 20.7043L3.7205 13.0747C3.72037 13.0746 3.72064 13.0748 3.7205 13.0747C2.90133 12.2498 2.3432 11.2013 2.11675 10.061C1.89026 8.92054 2.00521 7.73861 2.44721 6.66317C2.88921 5.58773 3.63861 4.66656 4.60162 4.01497C5.56462 3.36338 6.69843 3.01034 7.86112 3.00002ZM7.87139 5.00002C7.10478 5.00828 6.35746 5.24173 5.7224 5.67142C5.08529 6.10251 4.58949 6.71194 4.29707 7.42345C4.00465 8.13495 3.9286 8.9169 4.07844 9.67142C4.22828 10.4259 4.59736 11.1195 5.13947 11.6653L12 18.5802L18.8615 11.6643C19.5914 10.9315 20.0012 9.93929 20.0012 8.90498C20.0012 7.87067 19.5914 6.8785 18.8615 6.14568L18.8578 6.14195C18.5014 5.78041 18.0768 5.4933 17.6085 5.29733C17.1402 5.10137 16.6376 5.00045 16.13 5.00045C15.6223 5.00045 15.1198 5.10137 14.6515 5.29733C14.1832 5.4933 13.7585 5.7804 13.4022 6.14194L13.3934 6.15086C13.1871 6.35506 13.0072 6.58437 12.8581 6.83349C12.6775 7.13526 12.3517 7.31998 12 7.31998C11.6483 7.31998 11.3225 7.13526 11.1419 6.83349C10.9928 6.58437 10.813 6.355 10.6066 6.1508L10.6019 6.1461C9.8777 5.41989 8.89673 5.0082 7.87139 5.00002Z' fill='%230D0D0D'/%3E%3C/svg%3E");
    height: 24px;
    width: 24px;
    justify-self: end;
}

.nighbors {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-self: end;
    gap: 8px;
}

.nighbors a {
    display: flex;
    width: 36px;
    height: 36px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--Secondary-BTN-Stroke, #0D0D0D);
}

.product-like {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.24099 2.00001L5.25095 2C6.28206 2.00626 7.26924 2.41715 8.00017 3.1438C8.35873 2.7839 8.78442 2.49774 9.2532 2.30157C9.72841 2.10271 10.2384 2.0003 10.7536 2.0003C11.2687 2.0003 11.7787 2.10271 12.2539 2.30157C12.7286 2.50021 13.1591 2.79112 13.5205 3.15743C14.2552 3.89575 14.6677 4.89499 14.6677 5.93665C14.6677 6.97862 14.255 7.97814 13.5198 8.71652C13.5196 8.71672 13.5194 8.71692 13.5192 8.71712L8.4735 13.8029C8.34832 13.929 8.17796 14 8.00023 14C7.82251 14 7.65215 13.929 7.52697 13.8029L2.48058 8.71647C2.48049 8.71638 2.48067 8.71656 2.48058 8.71647C1.93446 8.16656 1.56238 7.46751 1.41141 6.70733C1.26042 5.94703 1.33705 5.15908 1.63172 4.44211C1.92638 3.72515 2.42599 3.11104 3.06799 2.67665C3.70999 2.24226 4.46587 2.00689 5.24099 2.00001ZM5.24784 3.33334C4.73677 3.33885 4.23855 3.49449 3.81518 3.78095C3.39044 4.06834 3.0599 4.47463 2.86496 4.94896C2.67001 5.4233 2.61931 5.9446 2.7192 6.44761C2.8191 6.95062 3.06515 7.41299 3.42656 7.77684L8.00023 12.3868L12.5746 7.77619C13.0612 7.28764 13.3344 6.62619 13.3344 5.93665C13.3344 5.24711 13.0612 4.58567 12.5746 4.09712L12.5721 4.09464C12.3345 3.8536 12.0514 3.6622 11.7392 3.53155C11.427 3.40091 11.092 3.33364 10.7536 3.33364C10.4151 3.33364 10.0801 3.40091 9.7679 3.53155C9.45571 3.6622 9.17261 3.8536 8.93504 4.09463L8.92919 4.10057C8.79161 4.23671 8.67168 4.38958 8.57229 4.55566C8.4519 4.75684 8.23468 4.87999 8.00023 4.87999C7.76579 4.87999 7.54857 4.75684 7.42818 4.55566C7.32879 4.38958 7.20889 4.23667 7.07132 4.10053L7.06815 4.0974C6.58538 3.61326 5.9314 3.3388 5.24784 3.33334Z" fill="%230D0D0D"/></svg>');
    background-position: CENTER;
    background-repeat: no-repeat;
    display: flex;
    width: 38px;
    height: 38px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border: 0.5px solid var(--Secondary-BTN-Stroke, #0D0D0D);
}

.product-like.not-auth {
    background-position: CENTER;
    background-repeat: no-repeat;
    display: flex;
    width: 38px;
    height: 38px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border: 0.5px solid var(--Secondary-BTN-Stroke, #0D0D0D);
}

.info-wrapper h1 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 12px;
}

.tabProduct {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    justify-content: start;
    gap: 8px;
    margin-bottom: 8px;
}

.tablinksProduct {
    display: grid;
    align-items: center;
    justify-self: center;
    width: 100%; /* ← добавлено, чтобы все вкладки были одинаковой ширины */
    height: 44px;
    padding: 8px 16px;
    border: none;
    background: #f2f2f2;
    border-bottom: 2px solid #f2f2f2; /* неактивное состояние */
    cursor: pointer;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

/* Hover — как активное состояние */
.tablinksProduct:hover {
    border-bottom-color: #0D0D0D;
}

/* Active — фиксирует выделение */
.tablinksProduct.active {
    border-bottom-color: #0D0D0D;
}

.info-wrapper p {
    display: grid;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 10px;
}

.size-table {
    margin: 0;
    margin-bottom: 16px;
}

.size-table .size-descr {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.11px;
    margin: 0;
    margin-top: 6px;
    margin-bottom: 6px;
}

.size-table .size-list,
.size-table .size-full {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 4px;
}

.size-full span.size,
.size-list span.size {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    line-height: 100%;
    display: flex;
    padding: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    flex: 1 0 0;
}

.size-full span.size {
    font-weight: 400;
    background: var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}

.size-list span.size {
    font-weight: 600;
    background: var(--primary-transparent-primary-20, rgba(13, 13, 13, 0.20));
}

p.color-name {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    grid-column: 1 / 9;
    margin: 0;
    margin-bottom: 8px;
    gap: 8px;
}

p.price {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    display: grid;
    margin: 0;
    margin-bottom: 32px;
    /* grid-column: 2 / 8; */
}

.prices {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / 7;
    gap: 8px;
}

.mobile-prices {
    display: none;
}

p.price-one {
    color: var(--Typography-Alert-Typography, #C5230A);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    /* 14px */
    letter-spacing: 0.42px;
    margin: 0;
}

p.old-price {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    /* 14px */
    letter-spacing: 0.42px;
    text-decoration-line: line-through;
    margin: 0;
}

p.price span {
    color: var(--Secondary, #808080);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

p.price-one span {
    color: var(--Secondary, #808080);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.color-select {
    display: grid;
    flex-direction: column;
    width: 100%;
    margin-bottom: 32px;
    grid-template-columns: 1fr;
    grid-column: 1 / -1;
}

.rost-select {
    display: grid;
    grid-column: 1 / -1;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

.rost-select .title h3 {
    margin: 0 0 10px 0;
    font-size: 16px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.48px;
}

.rost-select .selects {
    display: grid;
    grid-column: 1 / 9;
    grid-auto-flow: column;
    gap: 8px;
}

.rost-select label {
    position: relative;
    display: flex;
    height: 40px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 0.5px solid var(--Secondary, #808080);
    border-radius: 0px;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
    overflow: hidden;
    z-index: 0;
    background-color: transparent;
}


/* Скрываем оригинальные input */

.rost-select input[type="radio"],
.rost-select input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
}


/* Основной текст — span заполняет весь label */

.rost-select label span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--Secondary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    z-index: 2;
    transition: color 0.3s ease;
    position: relative;
}


/* Фон при выбранном состоянии */

.rost-select input[type="radio"]:checked+span::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
    border-color: var(--Primary-Primary-100, #0D0D0D);
    z-index: 1;
}


/* Цвет текста при выбранном состоянии */

.rost-select input[type="radio"]:checked+span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}


/* Состояние "Выбрать всё" (если это чекбокс) */

.rost-select input[type="checkbox"]:checked+span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
    border: 0.5px solid var(--Secondary, #808080);
}


/* Эффект при наведении */

.rost-select label:hover {
    border: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
}

.rost-select label:hover span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}


/* Защита от hover при checked */

.rost-select input[type="radio"]:checked+span:hover {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

.color-select input[type=radio] {
    display: none;
}

.color-radio {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
}

.color-select label {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Background, #F2F2F2);
}



.color-select input[type=radio]:checked+label {
    border: 0.5px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    width: 29%;
}


/* Hover */
.color-select label:hover {
    border-color: var(--Primary, #0D0D0D);
}


/* Disabled */

.color-select input[type=radio]:disabled+label {
    background: #efefef;
    color: #666;
}

#color {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.color-select label img {
    display: flex;
    width: 80px;
    height: 120px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.subtitle {
    display: grid;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: 1fr; /* ← можно оставить, если внутри есть несколько элементов */
}

.subtitle .item-accordion {
    width: 100%;
    display: grid;
    grid-column: 1/ -1;
    margin-bottom: 32px;
}

.subtitle span {
    color: var(--Secondary, #808080);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.subtitle a {
    text-decoration: none;
    color: var(--Secondary, #808080);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.color-select label img {
    display: flex;
    width: 80px;
    height: 120px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.size-unit {
    display: grid;
    flex-direction: column;
    padding: 16px 0px;
    padding-bottom: 0;
    align-items: flex-start;
    width: 100%;
    gap: 40px;
    align-self: stretch;
    grid-column: 1 / -1;
    margin-bottom: 40px;
}

.size-unit.sizes {
    display: flex;
    flex-direction: column;
    width: 50%;
}

.sizes {
    display: grid;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

.sizes .litle-title {
    display: grid;
    grid-row: 1 / 2;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    justify-content: space-between;
}

.litle-title h3 {
    display: grid;
    grid-column: 1 / 2;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 8px;
}

.litle-title a {
    display: grid;
    grid-column: 2 / -1;
    justify-content: end;
}

.container-grid {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: auto 1fr;
    /* gap: 4px; */
    align-items: start;
    width: 100%;
}

.add-width-fav {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2 / 9;
    grid-template-columns: auto 40px;
    gap: 4px;
    top: 20px;
    width: 100%;
    justify-content: stretch;
    align-items: end;
    position: relative;
}

#addZakButton {
    display: flex;
    width: 100%;
}

.units {
    width: auto;
}

.not-auth-block {
    display: grid;
    grid-column: 1 / 9;
    width: 100%;
    grid-template-columns: 1fr 40px;
    gap: 8px;
}

.sizeTable {
    color: var(--Secondary, #808080);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    text-decoration: none;
}

#big-price {
    display: grid;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin-right: 8px;
}

.inputs {
    display: flex;
    grid-column: 1 / -1;
    align-items: start;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
}

.select-option {
    display: grid;
    flex-shrink: 0;
}


/* Стили для цифровых кнопок (фиксированный размер 40x40) */

.select-option:not(.select-all) label {
    display: flex;
    flex-direction: row;
    height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Secondary, #B2B2B2);
    gap: 8px;
    flex-shrink: 0;
}


/* Стили для кнопки "Выбрать все" - занимает всё пространство */

.select-option.select-all {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0;
}

.select-option.select-all label {
    display: flex;
    flex-direction: row;
    padding: 0 16px;
    height: 42px;
    width: 100%;
    justify-content: center;
    align-items: center;
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Secondary, #B2B2B2);
    gap: 0px;
    margin-right: 0;
    box-sizing: border-box;
}

.inputs label[for=all] {
    display: flex;
    flex-direction: row;
    padding: 0 16px;
    height: 42px;
    width: 100%;
}

.inputs input[type=radio] {
    display: none;
}


/* Общие стили для span */

/* === Общие стили для всех кнопок-лейблов === */
.inputs label {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Background, #F2F2F2);
    background: var(--Background, #F2F2F2);
    cursor: pointer;
    /* Переход для плавного hover (опционально) */
    transition: border-color 0.2s, background-color 0.2s;
}

/* Текст внутри всех label */
.inputs label span {
    color: var(--Secondary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-align: center;
}

/* === Состояние: disabled === */
.inputs label.disabled {
    border-color: var(--Background, #F2F2F2);
    background: var(--Background, #F2F2F2);
    cursor: not-allowed;
}
.inputs label.disabled span {
    color: var(--Secondary-BTN-Typography, #B2B2B2);
    font-family: "Segoe UI", sans-serif; /* оставить, только если требуется */
}

/* === Состояние: logout === */
.inputs label.logout {
    border-color: var(--Secondary-BTN-Stroke, #F2F2F2);
    background: var(--Secondary-BTN-Background, #F2F2F2);
}
.inputs label.logout span {
    color: var(--Typography-Typography-Secondary, #808080);
}

/* === Hover-состояния === */

/* Обычные кнопки (не disabled, не logout) */
.inputs label:not(.disabled):not(.logout):hover {
    border: 1px solid var(--Secondary, #808080);
    background: var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}

/* Hover для logout-кнопки */
.inputs label.logout:hover {
    border-color: var(--Primary, #0D0D0D);
    background: var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}
/* При необходимости можно изменить цвет текста при hover:
.inputs label.logout:hover span {
    color: #0D0D0D;
}
*/

/* === Примечание: 
   Состояние .inputs span.disabled и .inputs span.logout 
   не нужны отдельно — они наследуются от label.
   Hover на span (например, span.logout:hover) — избыточен и удалён.
*/


/* Checked состояние */

.inputs input[type=radio]:checked+label {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}


/* Для кнопки "Выбрать все" в checked состоянии */

.select-option.select-all input[type=radio]:checked+label {
    width: 100%;
}


/* Disabled состояние */

.inputs input[type=radio]:disabled+label {
    background: #efefef;
    color: #666;
}


/* Active класс */

label.sizes-label.active {
    border: 0.5px solid var(--Secondary, #808080);
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
}

.unit {
    display: grid;
    grid-template-columns: 132px;
    flex-direction: column;
    width: 100%;
}

.unit .counter-add {
    display: grid;
    align-items: center;
    width: 100%;
    grid-column: 1/2;
    grid-template-columns: 132px;
    gap: 4px;
}

.unit h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 8px;
}

label.color-label.active {
    border: 1px solid #0D0D0D;
}

.table-header {
    display: grid;
    grid-template-columns: 32px 1fr 1fr 1fr 2fr 32px;
    padding-bottom: 16px;
    border-bottom: 0.5px solid var(--Secondary, #808080);
}

.table-header #number {
    display: grid;
    text-align: start;
    gap: 8px;
}

.table-header #cart-color {
    display: grid;
    text-align: start;
    gap: 8px;
}

.header-cart-text {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    text-align: center;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

.unit .counter {
    display: flex;
    gap: 4px;
}



.unit #unitInput {
    display: flex;
    width: 36px;
    height: 38px;
    justify-content: center;
    text-align: center;
    align-items: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    border: none;
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
}

.unit #unitInput:focus-visible {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    text-align: center;
    align-items: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    border: none;
    outline: none;
}

.unit #unitInput:disabled {
    display: flex;
    width: 36px;
    height: 38px;
    justify-content: center;
    text-align: center;
    align-items: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    color: #B2B2B2;
    border: none;
}

/* === Общие стили для обеих кнопок === */
.unit #minus,
.unit #plus {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    border: none;
    background: #f2f2f2;
    padding: 0;
    margin: 0;
    cursor: pointer;
    /* Плавный переход при наведении/активации */
    transition: background-color 0.15s ease;
}

/* === Цвет иконок по умолчанию === */
.unit #minus svg,
.unit #plus svg {
    fill: #0D0D0D;
}

/* === Состояние: наведение (hover) === */
.unit #minus:hover,
.unit #plus:hover {
    background: #808080; /* или #808080 — как в твоём minus */
}

/* === Состояние: активное нажатие (active) === */
.unit #minus:active,
.unit #plus:active {
    background: #0D0D0D;
    outline: 0;
}

.unit #minus:active svg,
.unit #plus:active svg {
    fill: #F2F2F2;
}

/* === Состояние: disabled === */
.unit #minus:disabled,
.unit #plus:disabled {
    background: #f2f2f2;
    cursor: not-allowed;
}

.unit #minus:disabled svg,
.unit #plus:disabled svg {
    fill: #B3B3B3;
}

#addZak {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 16px 0 20px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase; /* ← задан один раз для всех состояний */
    border: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
    cursor: pointer;
}

/* Hover — только для активных кнопок */
#addZak:hover:not(:disabled) {
    background: var(--primary-transparent-primary-30, rgba(13, 13, 13, 0.30));
    font-weight: 600;
}

#addZak:hover:not(:disabled) svg path {
    fill: var(--Typography-Typography-CTA-Hover, #0D0D0D);
}

/* Вложенный элемент .left */
#addZak .left {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Disabled — основное неактивное состояние */
#addZak:disabled {
    background: var(--Secondary-BTN-Background, rgba(13, 13, 13, 0.05));
    color: var(--Secondary-BTN-Typography, #CCC);
    font-weight: 600;
    border: none;
    cursor: not-allowed;
}

#addZak:disabled svg path {
    fill: var(--Secondary-BTN-Typography, #CCC);
}

/* Disabled + hover (если поддерживается) */
#addZak:disabled:hover {
    background: var(--Disable, #B2B2B2);
    color: var(--Typography-Typography-CTA-Disable, #E6E6E6);
}

#addZak:disabled:hover svg path {
    fill: var(--Typography-Typography-CTA-Disable, #E6E6E6);
}

#addZakButtonMobile {
    display: none;
}

.notauth {
    display: grid;
    grid-column: auto;
    width: 100%;
    height: 38px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
    background: var(--CTA-BTN-Background, #0D0D0D);
    color: var(--CTA-BTN-Typography, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-decoration: none;
    text-transform: uppercase;
}

.precart-table {
    display: none;
}

.precart-table.added {
    display: grid;
    grid-column: 2 / 8;
    margin-top: 0;
}

.table-content .child {
    display: grid;
    grid-template-columns: 32px 1fr 1fr 1fr 2fr 32px;
}

.child div {
    display: grid;
    align-items: center;
    justify-content: center;
    /* padding: 16px 0; */
    border-bottom: 0.5px solid var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}

.child .number-this {
    align-items: center;
    height: 44px;
    justify-content: start;
    width: 16px;
    padding-right: 16px;
}

.child .color-this {
    align-items: center;
    justify-content: start;
}

.unit-container {
    grid-template-columns: repeat(3, 1fr);
}

/* Общие стили для обеих кнопок */
.minus-button-this,
.plus-button-this {
    display: flex;
    width: 28px;
    height: 28px;
    background: #f2f2f2;
    justify-self: center;
    justify-content: center;
    align-items: center;
    position: relative;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer; /* добавлено сюда — логично для интерактивных элементов */
}

/* Hover — одинаковый для обеих */
.minus-button-this:hover,
.plus-button-this:hover {
    background: #808080;
    /* border-radius: 0 — не нужно, если не задан ранее */
}

/* Active — одинаковый для обеих */
.minus-button-this:active,
.plus-button-this:active {
    background: #838383;
    outline: 0;
}

.unit-this {
    width: 40px;
    height: 28px;
    justify-self: center;
    text-align: center;
    border: none;
    background-color: #f2f2f2;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
}

.unit-this:focus-visible {
    width: 40px;
    height: 28px;
    text-align: center;
    border: none;
    background-color: #f2f2f2;
    outline: none;
}

.remove-this {
    border: none;
    border-bottom: 0.5px solid var(--Secondary, #808080);
    background-color: #f2f2f2;
    cursor: pointer;
}

.add-to-cart {
    display: flex;
    height: 40px;
    padding: 0 16px 0 20px;
    justify-content: space-between;
    align-items: center;
    background: var(--Primary-Primary-100, #0D0D0D);
    color: var(--Typography-Typography-On-Color, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin-top: 32px;
    border: none;
    cursor: pointer; /* ← рекомендуется для интерактивных элементов */
}

.add-to-cart:hover {
    background: var(--primary-transparent-primary-80, rgba(13, 13, 13, 0.80));
}

.add-to-cart .left {
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-to-cart .left span {
    margin-right: 8px;
}

.add-to-cart:hover svg path {
    fill: var(--Typography-Typography-CTA-Hover, #0D0D0D);
}

.textig {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.succes-block {
    display: none;
    grid-column: 1 / 9;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
}

.succes-block.active {
    display: grid;
}

.succes-block .cart-img {
    margin: 0;
    margin-bottom: 16px;
}

.succes-block .top {
    color: var(--Typography-Typography-Secondary, #808080);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.36px;
    margin: 0;
    margin-bottom: 4px;
}

.succes-block .bottom {
    color: var(--Typography-Typography-Secondary, #808080);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: 0.36px;
    margin: 0;
}

.with-this-product {
    display: grid;
    grid-column: 1 / 9;
    align-self: end;
    border-right: 1px solid black;
}

.with-this-product h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    padding: 0 24px;
    margin-top: 36px;
}

#cartAddModal .ok-svg {
    display: grid;
    align-items: start;
    justify-content: center;
    padding-bottom: 32px;
}

#cartAddModal h4 {
    color: #000;
    text-align: center;
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 32px;
}

#succes .modal-content {
    display: flex;
    padding: 32px 48px 48px 48px;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

#succes h2 {
    color: #000;

    text-align: center;
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
}

#succes p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-family: "Segoe UI";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
}

#mobloginPopUp {
    display: grid;
    position: absolute;
    width: 100%;
    bottom: 0;
    z-index: 3;
    padding: 0px;
    align-items: center;
    justify-content: stretch;
    gap: 0px;
}

#mobloginPopUp form {
    display: grid;
    padding: 16px 16px 16px 16px;

}

#mobileLoginClose {
    display: flex;
    height: 40px;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    border: none;
    padding-top: 16px;
}

#cartAddModal .links {
    display: grid;
    grid-auto-flow: row;
    align-items: center;
    justify-content: stretch;
    gap: 8px;
    width: 100%;
    grid-column: 1 / -1;
}

#cartAddModal .links div#closehref {
    display: flex;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    align-self: center;
    text-align: center;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer; /* ← рекомендуется для интерактивных элементов */
}

#cartAddModal .links div#closehref:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
}

#cartAddModal .links a#toCart {
    display: flex;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    align-self: center;
    text-align: center;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer; /* ← улучшает UX */
}

#cartAddModal .links a#toCart:hover {
    background: var(--Primary-20, rgba(13, 13, 13, 0.20));
}

.text-wrapper h1 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 16px;
}

.partner-wrapper {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(12, 1fr);
    position: relative;
    top: 170px;
    margin-top: 64px;
    min-height: calc(100vh - 265px);
    margin-bottom: 80px;
}

.partner-wrapper .text-wrapper {
    display: grid;
    grid-column: 1 / 2;
    align-items: start;
    padding-right: 32px;
    justify-content: start;
    grid-template-rows: repeat(9, max-content);
    margin-bottom: 64px;
}

.partner-wrapper .text-wrapper p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 13px;
}

.partner-wrapper .text-wrapper h2 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin: 0;
    margin-top: 19px;
    margin-bottom: 8px;

}

.partner-wrapper .text-wrapper h2 .svg {
    display: none;
}

.partner-wrapper .text-wrapper ul {
    counter-reset: subsection;
    list-style-type: none;
    margin: 0;
    padding: 0 0 0 26px;
}

.partner-wrapper .text-wrapper ol {
    counter-reset: subsection;
    list-style-type: disc;
    margin: 0;
    padding: 0 0 0 26px;
}

.partner-wrapper .text-wrapper ul li {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 8px;
}

.partner-wrapper .text-wrapper ul#firstUl li::before {
    counter-increment: subsection;
    content: "1."counter(subsection) ". ";
}

.partner-wrapper .text-wrapper ul#secondUl li::before {
    counter-increment: subsection;
    content: "2."counter(subsection) ". ";
}

.partner-wrapper .text-wrapper ul#secondUl ol li::before {
    counter-increment: subsection;
    content: none;
}

.mobile-wrapper-block {
    display: none;
}

.partner-wrapper .form-wrapper {
    display: grid;
    grid-column: 1 / -1;
    height: fit-content;
    padding-left: 0px;
}
.form-wrapper .two-in-one {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    gap: 8px;
}

.two-in-one .one {
    display: grid;
    grid-column: 1 / 2;
}

.two-in-one .two {
    display: grid;
    grid-column: 2 / 3;
}

.partner-wrapper .phone-container {
    position: relative;
}

.partner-wrapper h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);

    /* Large/H2 */
    font-family: "Segoe UI";
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 28px */
    letter-spacing: 0.28px;
    text-transform: uppercase;
}

.partner-wrapper h6 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* Large/H3 */
    font-family: "Segoe UI";
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 24px */
    letter-spacing: 0.24px;
    margin: 0;
    margin-bottom: 16px;
}

.partner-wrapper .accardion-container {
    display: grid;
    margin-bottom: 40px;
}

.partner-wrapper button.accardion-footer {
    display: grid;
    align-items: center;
    justify-content: space-between;
    grid-auto-flow: column;
    padding: 8px 0px;
    border-radius: 0;
    height: 32px;
    border: 0;
    border-top: 1px solid var(--Primary, #E6E6E6);
    border-bottom: 1px solid var(--Primary, #E6E6E6);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.39px;
}

.partner-wrapper .accardion-item p span,
.bx-im-message-default-content__text,
.partner-wrapper .accardion-item p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* Desktop/Body 150% */
    font-family: "Segoe UI";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
}

.partner-wrapper .custom-dropdown {
    display: none;
    position: absolute;
    background: white;
    border: 1px solid #ccc;
    z-index: 999;
    width: 100%;
}

.partner-wrapper .custom-dropdown div {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    cursor: pointer;
}

.partner-wrapper .custom-dropdown div:hover {
    background-color: #f0f0f0;
}

.partner-wrapper .flag-icon {
    font-size: 24px;
}

.form-wrapper h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: left;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 16px;
}

.form-wrapper form {
    display: grid;
}

.form-wrapper form label {
    display: grid;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
    margin-bottom: 4px;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
    gap: 4px;
}

.iti--allow-dropdown {
    margin-bottom: 8px;
}

.form-wrapper form label span {
    color: var(--Alert, #C5230A);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
}

.form-wrapper form input {
    display: grid;
    height: 48px;
    padding: 0px 16px;
    align-items: center;
    margin-bottom: 8px;
    align-self: stretch;
    border: none;
    border: 1px solid transparent;
    border-bottom: 1px solid var(--Primary, #0D0D0D);
    background: var(--Input-Field, #FFF);
}

.iti input,
.iti input[type=tel],
.iti input[type=text] {
    position: relative;
    z-index: 0;
    width: 100%;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-right: 36px;
    margin-right: 0;
}

.form-wrapper form input:focus-visible {
    outline: 0;
    border: 1px solid var(--Primary, #0D0D0D);
    border-radius: 0;
}

.form-wrapper form textarea {
    display: flex;
    padding: 16px;
    align-items: flex-start;
    gap: 4px;
    flex: 1 0 0;
    align-self: stretch;
    border: 1px solid transparent;
    border-bottom: 1px solid var(--Primary, #0D0D0D);
    background: var(--Input-Field, #FFF);
    resize: none;
}

.form-wrapper form textarea:focus-visible {
    outline: none;
    border: 1px solid var(--Primary, #0D0D0D);
}

.form-wrapper form button {
    display: grid;
    grid-auto-flow: column;
    height: 52px;
    padding: 0 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: #FFF;
    border: none;
    text-transform: uppercase;
    cursor: pointer; /* ← рекомендуется для кнопок */
}

.form-wrapper form button:hover {
    background: rgba(13, 13, 13, 0.20);
    color: #0D0D0D;
}

.form-wrapper form button:hover svg path {
    fill: #0D0D0D;
}

/* Основное состояние кнопки (уже есть у тебя) */
.form-wrapper form button {
    display: grid;
    grid-auto-flow: column;
    height: 52px;
    padding: 0 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: #FFF;
    border: none;
    text-transform: uppercase;
    cursor: pointer;
}

/* Hover для активных кнопок */
.form-wrapper form button:hover:not(:disabled) {
    background: rgba(13, 13, 13, 0.20);
    color: #0D0D0D;
}

/* Disabled — только отличия от основного состояния */
.form-wrapper form button:disabled {
    background: var(--Disable, #B2B2B2);
    color: #E6E6E6;
    cursor: not-allowed; /* ← важно для UX */
}

.form-wrapper form button:disabled:hover svg path {

    fill: #E6E6E6;

}

.partner-wrapper .link-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px 24px;
    margin-bottom: 40px;
}

.link-container a {
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.16px;
    color: #0D0D0D;
    text-decoration: underline; /* ← опционально, но рекомендуется для ссылок */
}

.link-container a:hover {
    color: #0083C5;
}

.partner-wrapper .about p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.16px;
    margin: 0;
    margin-bottom: 8px;
}

.textPage-wrapper {
    display: grid;
    position: relative;
    grid-column: 3 / 11;
    top: 205px;
    margin-bottom: 80px;
}

.textPage-wrapper h1 {
    color: #000;
    font-family: "Segoe UI";
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    margin: 0;
    margin-bottom: 32px;
}

.textPage-wrapper strong {
    color: #000;
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.2px;
    margin: 0;
    margin-bottom: 16px;
}

.textPage-wrapper p {
    color: #000;
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
    margin: 0;
    margin-bottom: 12px;
}

.textPage-wrapper span {
    color: #000;
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.textPage-wrapper a {
    color: #0083C5;
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.map-wrapper {
    display: grid;
    position: relative;
    top: 250px;
    grid-template-columns: repeat(12, 1fr);
    grid-column: 1/-1;
    margin-bottom: 64px;
}

.map-wrapper .select-country-mobile {
    display: none;
}

#fullscreen-button {
    display: none;
}

.map-wrapper #map {
    display: grid;
    height: 800px;
    grid-column: 1 / 10;
    width: calc(100% - 32px);
}

.map-wrapper .select-country {
    display: grid;
    height: 800px;
    grid-column: 10 / 12;
    grid-template-rows: 30px auto;
}

.map-wrapper .shops-container {
    display: none;
}

.select-country .tab {
    display: grid;
    grid-template-columns: repeat(3, auto);
    overflow: hidden;
    align-items: start;
    align-self: stretch;
    justify-content: start;
    grid-column: 1 / 3;
    background: #F2F2F2;
}

.select-country .countryTab {
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
    margin-top: 16px;
    padding: 0;
    grid-column: 10 / 1;
}

.city-list {
    display: flex;
    list-style: none;
    padding: 0;
    width: 100%;
    margin: 0;
    flex-direction: column;
}

.city-list li {
    display: flex;
    height: 24px;
    padding: 0 8px;
    align-items: center;
    align-self: stretch;

}

.shop-list {
    display: none;
}

.shop-list.active {
    display: flex;
    flex-direction: column;
}

.shop {
    cursor: pointer;
}

.shop p {
    display: none;
}

.tab .countryTabLinks {
    background-color: #F2F2F2;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.select-country .tab .countryTabLinks:first-child {
    display: flex;
    padding: 8px 8px 8px 0px;
    align-items: center;
}

.city {
    border: none;
    background-color: #F2F2F2;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    cursor: pointer; /* ← добавлено сюда, так как элемент интерактивный */
}

.city:hover {
    color: var(--Secondary, #808080);
}

.city:focus,
.city.active {
    font-weight: 600;
}

.popup-yandex {

    display: flex;
    width: max-content;
    align-items: start;
    justify-content: center;

}

.popup__close {
    display: grid;
    border-radius: 50%;
    border: none;
    padding: 8px;
    position: relative;
    top: -40px;
    align-items: center;
    padding: 8px;
    justify-content: center;
}

.countryTab::-webkit-scrollbar {
    margin-top: 100px;
    width: 0.35em;
    background: var(--Secondary, #808080);
    border-radius: 0px;
    box-shadow: inset 0 0 0 2px #F2F2F2;
}

.countryTab::-webkit-scrollbar-thumb {
    background: var(--Primary, #0D0D0D);
    width: 4px;
    border-radius: 00px;
    position: relative;
}

.contact-wrapper {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    grid-column: 2/12;
    position: relative;
    top: 170px;
    margin-top: 48px;
}

.contact-wrapper .title {
    display: grid;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    margin-bottom: 40px;
}

.contact-wrapper h1 {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
}

.logo-country {
    display: flex;
    margin-bottom: 16px;
    gap: 4px;
}

.logo-country img {
    height: 32px;
    width: 93px;
}

.logo-country span {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    white-space: nowrap;
}

.contact-belarus {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-column: 1 / 7;
    grid-row: 2 / 3;
}

.contact-belarus .departments {
    display: grid;
    grid-column: 1/4;
}

.contact-belarus .ved {
    display: grid;
    grid-column: 4/6;
}


.contact-russia {
    display: grid;
    grid-column: 7 / 12;
    grid-row: 2 / 3;
    align-items: start;
    justify-items: start;
    justify-content: start;
    height: max-content;
}

.preText {
    display: grid;
    grid-column: 1/4;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    /* Desktop/Headline */
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 4px;
    letter-spacing: 0.16px;
    margin-bottom: 24px;
}

.contact-city {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    gap: 4px;
}

.preText a {
    text-decoration: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

.preText p {
    margin: 0;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.department h5 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    margin: 0;
    margin-bottom: 12px;
}

.manager h5 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    gap: 12px;
}

.department {
    margin: 0;
    margin-bottom: 16px;
}

.department p {
    display: flex;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    gap: 4px;
    margin: 0;
    margin-bottom: 6px;
}

.department p a {
    text-decoration: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.ved h5 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.ved .department h5 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.department p span {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

/* Ссылка внутри span наследует стили, но можно явно уточнить цвет (если нужно) */
.department p span a {
    color: inherit; /* ← наследует цвет от родителя */
    text-decoration: underline; /* ← рекомендуется для ссылок */
}

.department p span a:hover {
    color: #0083C5;
}

.manager h5 {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.manager p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.manager p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-decoration: none;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.manager p span {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.manager p span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.contact-map-container {
    display: grid;
    grid-column: 2 / 12;
    position: relative;
    top: 170px;
}

.contact-map-container h2 {
    display: grid;
    grid-column: 2/4;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

#contact-map {
    width: 100%;
    height: 633px;
    grid-column: 2/12;
    margin: 0;
    margin-bottom: 64px;
}

.cart-wrapper {
    display: grid;
    grid-column: 1/12;
    position: relative;
    top: 170px;
}


.cart-wrapper h1 {
    color: var(--Color-Black-100, #0D0D0D);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
    margin-top: 80px;
    margin-bottom: 0px;
}

.filter-product-container {
    display: grid;
}

.cart-filter {
    display: grid;
    grid-template-columns: repeat(12, auto);
    grid-column: 1 / 12;
    align-items: center;
    justify-content: stretch;
    justify-items: stretch;
    text-align: center;
    padding: 64px 0;
}

.cart-filter input[type=radio] {
    display: none;
}

.cart-filter label {
    display: flex;
    flex-direction: row;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-transform: capitalize;
    width: auto;
    height: 32px;
    padding: 0 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-right: 4px;
    background: var(--Background, #F2F2F2);
    cursor: pointer; /* ← рекомендуется для интерактивных элементов */
}

.cart-filter label.active {
    background: var(--Primary, #0D0D0D);
    color: #F2F2F2;
}

.cart-filter input[type=radio]:checked+label {
    background: var(--Background, #0D0D0D);
    color: white;
    width: 29%;
}


/* Hover */

.cart-filter label:hover {
    background: var(--Secondary, #808080);
}


/* Disabled */

.cart-filter input[type=radio]:disabled+label {
    background: #efefef;
    color: #666;
}

.all-products {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column: 1 / 12;
}

.products-wrapper {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(12, 1fr);
    /* padding-bottom: 80px; */
}


.cart-product {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    padding: 24px 8px;
    height: 136px;
    align-self: stretch;
    align-items: start;
    justify-content: space-between;
    border-bottom: 1px solid var(--Primary-Primary-10, #E6E6E6);
}

.cart-product-mobile {
    display: none;
}

.cart-product-mobile-test {
    display: none;
}

.cart-product .left-block {
    display: grid;
    grid-column: 1 / 2;
    grid-row: 1 / -1;
    grid-auto-flow: column;
    grid-template-columns: max-content;
}

.cart-product .product-img {
    display: grid;
    place-items: center;
    padding-right: 32px;
    height: 136px;
    width: 90px;
    overflow: hidden;
    border-radius: 4px;
}

.cart-product .product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cart-product .product-description {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    width: 340px;
    grid-template-rows: minmax(0, 26px) auto auto;
}

.product-description .rost-title {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

.product-description .rost-group {
    display: grid;
    grid-auto-flow: column;
    gap: 8px;
    margin-bottom: 4px;
    align-items: center;
}

.product-description .size-group {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    gap: 4px;
}

.product-description .size-item {
    display: grid;
    width: 100%;
    height: 24px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    aspect-ratio: 1 / 1;
    background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    align-content: center;
    text-align: center;
    justify-items: center;
    justify-content: center;
}

.cart-product .product-description .alert {
    color: var(--Alert, #C5230A);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.11px;
    display: grid;
    grid-column: 2/5;
}

.cart-product .product-description .title {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.54px;
    display: grid;
    grid-column: 1 / 5;
    margin: 0;
    margin-bottom: 8px;
}

.title a {
    background-color: transparent;
    text-decoration: none;
    color: #0D0D0D;
}

.cart-product .product-description .description {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    display: grid;
    grid-column: 1/5;
}

.cart-product .product-description button {
    display: grid;
    width: 252.5px;
    height: 44px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    grid-column: 2 / 5;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

.cart-product .product-description button:hover {
    background: var(--Secondary, #808080);
}

.cart-product .sizes-units {
    display: grid;
    grid-column: 1 / 7;
    align-items: end;
    align-self: end;
    justify-self: start;
}

.sizes-units .sizes {
    display: grid;
    align-items: start;
    justify-content: center;
}

.sizes-units .sizes .title {
    display: grid;
    grid-column: 1 / -1;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin: 0;
    margin-bottom: 16px;
}

.sizes-units .sizes .selected-sizes {
    display: flex;
    justify-content: start;
}

.sizes-units .sizes .selected-sizes-test {
    display: flex;
    justify-content: start;
    flex-direction: column;
}

.selected-sizes div {
    display: flex;
    width: 32px;
    height: 32px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Secondary, #808080);
    background: var(--Background, #F2F2F2);
    margin-right: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.cart-product .right-block {
    display: grid;
    grid-column: 2 / -1;
    align-items: stretch;
    justify-content: end;
    height: 100%;
}

.cart-product .info-buttons {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-row: 2;
    align-self: end;
    align-items: stretch;
    justify-content: end;
    gap: 32px;
}

.cart-product .price_info {
    display: grid;
    grid-column: 11 / 13;
    text-align: right;
}

.price_info .fullprice {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    text-align: right;
    font-family: "Ubuntu Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.54px;
    margin: 0;
    margin-bottom: 8px;
}

.price_info .subinfo {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: right;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 16px;
}

.price_info .info-buttons {
    display: grid;
    grid-auto-flow: column;
    align-self: end;
    gap: 32px;
}

.subinfo span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.price_info .oneUnitprice {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 12px;
}

.price_info button {
    display: flex;
    height: 44px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

.info-buttons .remove {
    color: var(--Typography-Alert-Typography, #C5230A);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    border: none;
    text-transform: none;
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #f2f2f2;
    cursor: pointer;
 cursor: pointer;
}

.info-buttons .show-hide {
    color: var(--Tertiary-BTN-Default-Typpography, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    border: none;
    text-transform: none;
    text-decoration: none;
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.price_info button:hover {
    background: var(--Secondary, #808080);
}



.info-buttons .show-hide:hover {
    color: var(--Tertiary-BTN-Default-Typpography, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    border: none;
    text-transform: none;
    text-decoration: none;
    padding: 0;
}

.oneUnitprice span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.variant-accardion.active {
    display: grid;
    grid-column: 1 / -1;
    align-items: center;
}
.table-header-big {
    display: grid;
    padding: 16px 0;
    grid-column: 1 / -1;
    align-items: center;
    grid-template-columns: 32px 1fr 1fr 100px 1fr 32px;
    border-bottom: 0.5px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}

.table-header-big .number {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

/* Объединённые стили для заголовков таблицы */
.table-header-big .color,
.table-header-big .size,
.table-header-big .units,
.table-header-big .cash {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

/* Исправлена опечатка в названии класса (accardion → accordion) */
.variant-accordion {
    display: none;
}

/* Стили для строки варианта */
.product-option .variant {
    display: grid;
    padding: 16px 0;
    grid-column: 1 / -1;
    align-items: center;
    grid-template-columns: 32px 1fr 1fr 100px 1fr 32px;
    border-bottom: 0.5px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}

#product-form {
    display: grid;
    grid-column: 1 / 9;
    margin-top: 64px;
}

/* Общие типографические стили для значений */
.variant .number-value,
.variant .color-value,
.variant .size-value,
.variant .price-value {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}

/* Дополнительные стили для конкретных типов */
.variant .color-value {
    text-align: center;
    text-transform: capitalize;
}

.variant .size-value,
.variant .price-value {
    text-align: center;
}

/* Контейнер для кнопок +/- */
.variant .unit-value {
    display: flex;
    flex-direction: row;
    align-items: center; /* центрирует кнопки по вертикали */
    gap: 4px; /* отступ между кнопками и input */
}

/* Общие стили для кнопок +/- */
.variant .unit-value .minus-button,
.variant .unit-value .plus-button {
    width: 28px;
    height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    background: #F2F2F2;
    color: black;
    cursor: pointer;
}

/* Стили для input внутри unit-value */
.variant .unit-value input.unit {
    width: 40px;
    height: 28px; /* выровнял по высоте кнопок */
    text-align: center;
    background: transparent;
    border: none;
    font-family: "Ubuntu Sans";
    font-size: 13px;
    color: var(--Typography-Typography-Primary, #1A1A1A);
    -webkit-appearance: textfield; /* сброс стилей в Safari */
    padding: 0;
    margin: 0;
    text-align: center;
}

/* Стили для кнопки удаления */
.variant .remove-button button {
    border: none;
    background: #F2F2F2;
    cursor: pointer;
    padding: 4px; /* добавлено для лучшего тап-таргета */
}

.send-button {
    display: grid;
    grid-column: 12;
    padding-bottom: 84px;
    padding-top: 80px;
}

.sender-zakaz {
    line-height: 44px;
    display: flex;
    width: auto;
    height: 44px;
    padding: 0 20px 0 26px;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-shrink: 0;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.48px;
    border: none;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    right: 0;
}

.sender-zakaz svg {
    fill: #F2F2F2;
}

.sender-zakaz:hover {
    display: flex;

    background: var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-transform: uppercase;

}

.sender-zakaz:hover svg path {
    fill: #0D0D0D;
}

.sender-zakaz .left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sender-zakaz svg {
    height: 16px;
    width: auto;
    vertical-align: middle;
    margin-top: -1px;
}





.cart-empty {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(1, 1fr);
    justify-content: center;
    height: auto;
    padding-top: 40px;
    position: relative;
    top: 154px;
    align-items: center;
    align-self: center;
    justify-self: center;
    margin-bottom: 64px;
}

.cart-empty h1 {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.48px;
    margin: 0;
    margin-bottom: 24px;
}

.empty-img {
    display: flex;
    height: 300px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    margin-bottom: 24px;
}

.empty-img img {
    width: auto;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cart-empty h3 {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    text-align: center;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin: 0;
    margin-bottom: 40px;
}

.cart-empty .button {
    display: grid;
    align-items: start;
    justify-items: center;
}

.cart-empty a {
    display: flex;
    width: 646px;
    height: 52px;
    padding: 0 20px 0 26px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.42px;
    text-transform: uppercase;
    text-decoration: none;
}


.cart-filter-buttons {
    display: flex;
    gap: 16px;
    margin-bottom: 64px;
}

.cart-filter-button,
.cart-filter-button.active {
    display: flex;
    height: 32px;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-family: "Segoe UI";
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    border: none;
    outline: none;
    cursor: pointer;
}

.cart-filter-button {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    background: var(--Surfaces, #FFF);
}

.cart-filter-button.active {
    color: var(--Typography-Typography-On-Color, #F2F2F2);
    background: var(--Primary-Primary-100, #0D0D0D);
}

#block .modal-content {
    display: flex;
    padding: 32px 48px 48px 48px;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

#block .modal-content .ok-svg {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    margin-bottom: 32px;
}

#block .modal-content h4 {
    color: #000;
    text-align: center;
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    /* 26px */
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 32px;
}

#block .modal-content p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-family: "Segoe UI";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 48px;
}

#block .modal-content a.catalog-link {
    background: var(--Buttons-CTA-Default, #0D0D0D);
    text-decoration: none;
    display: flex;
    height: 44px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 8px;
}

#block .modal-content a.download {
    text-decoration: none;
    display: flex;
    height: 44px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.personal-wrapper {
    display: grid;
    grid-column: 1/-1;
    grid-template-columns: repeat(12, 1fr);
    position: relative;
    top: 170px;
    margin-top: 64px;
    min-height: calc(100vh - 265px);
}

.personal-tabs {
    display: grid;
    grid-column: 1 / 3;
    height: fit-content;
    padding: 32px;
    background: var(--Surfaces, #FFF);

}

.tab-vert {
    background: var(--Surfaces, #FFF);
    display: grid;
    border: none;
    padding: 16px;
    text-align: start;
    color: #808080;
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.tab-vert.active {
    background: var(--Primary, #0D0D0D);
    color: #F2F2F2;
}

.personal-tabs-content {
    display: grid;
    grid-column: 4/12;
    margin-bottom: 90px;
}

/* Скрытие неактивного контента */
.personal-content:not(.active) {
    display: none;
}

/* Активный контент */
.personal-content.active {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-column: 1 / 9;
    align-items: start;
    height: max-content; /* ← это свойство должно быть включено */
}

/* Контент вкладок */
.personal-tabs-content {
    display: grid;
    grid-column: 4 / 10;
    grid-template-columns: repeat(6, 1fr);
    margin-bottom: 90px;
}

.personal-content .personal-info {
    display: grid;
    grid-column: 1 / -1;
}

.personal-form {
    display: grid;

}

.personal-form p.color_error {
    margin: 0;
}

.personal-form form .fio-block-personal {
    display: grid;
    grid-column: 1 / -1;
    gap: 16px;
    grid-auto-flow: column;
    align-items: center;
    justify-content: stretch;
    margin: 0;
    margin-bottom: 16px;
}

.personal-form form .fio-block-personal .f-block,
.personal-form form .fio-block-personal .i-block,
.personal-form form .fio-block-personal .o-block {
    display: grid;
}

.personal-form form .yur_deat_block {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: stretch;
    gap: 16px;
    margin-bottom: 40px;
}

.personal-form form .yur_deat_block .reg-block {
    display: grid;
}

.personal-form form .yur_address_block {
    display: grid;
    grid-auto-flow: row;
    align-items: center;
    justify-content: stretch;
    grid-column: 1 / -1;
    gap: 16px;
    margin-bottom: 40px;
}

.personal-form form .yur_address_block .reg-block {
    display: grid;
    grid-column: span 1;
}

.personal-form form .yur_address_block .reg-block-big {
    display: grid;
    grid-column: span 2;
}

.personal-form form .password-block {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    justify-content: stretch;
    grid-column: 1 / -1;
    grid-template-columns: 2fr 2fr;
    gap: 16px;
    margin-bottom: 40px;
}

.old-pas,
.osn-pas,
.rep-pas {
    display: grid;
}

.password-block .input-container {
    position: relative;
    display: grid;
    align-items: center;
}

.personal-form form .contacts_block {
    display: grid;
    grid-auto-flow: row;
    align-items: center;
    justify-content: stretch;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 40px;
}

.personal-form form .contacts_block .reg-block {
    display: grid;
    grid-column: span 1;
}

.personal-form form .contacts_block .reg-block-big {
    display: grid;
    grid-column: span 3;
}

.personal-form form .send-block .reg-block {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    align-items: start;
    justify-content: stretch;
}

.personal-form form .send-block {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    margin-bottom: 40px;
}

.personal-form form .send-block .akcii-block {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    gap: 12px;
}

.personal-form form .send-block .text {
    display: grid;
    justify-content: start;
    align-items: start;

}

.personal-form form .send-block .text h5 {
    margin: 0;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
}

.personal-form form .send-block .text p {
    margin: 0;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.personal-form form .send-block .news-block {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    gap: 12px;
}

.personal-info h2 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.24px;
    text-transform: uppercase;
}

.akcii-block input[type="checkbox"],
.news-block input {
    height: 24px;
    width: 24px;
}

.personal-form .button-block {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    gap: 16px;
}

/* Общие стили для обеих кнопок */
.button-block .saveButton,
.button-block .reloadBUtton {
    display: flex;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.16px;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
.button-block .saveButton {
    flex: 1 0 0;
    background: var(--Primary-Primary-100, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    border: none;
}

.button-block .reloadBUtton {
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    border: 1px solid var(--Primary-Primary-100, #0D0D0D);
}

.name-block {
    display: grid;
    grid-column: 1/4;
    gap: 8px;
    padding-bottom: 32px;
}

.name-block .name {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 8px;
}

.name-block .dolznost {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.12px;
    margin: 0;
    margin-bottom: 8px;
}

.name-block .unp {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
}

.name-block .unp span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
}

.yur-adress-block {
    display: grid;
    grid-column: 1/4;
    gap: 8px;
    padding-bottom: 32px;
}

.yur-adress-block .name {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin: 0;
}

.yur-adress-block .country-city {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

.yur-adress-block .street {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

.yur-adress-block .build {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

.contact-personal {
    display: grid;
    padding-bottom: 43px;
    grid-column: 1 / 4;
}

.contact-personal .name {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin: 0;
    margin-bottom: 8px;
}

.contact-personal p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
    margin-bottom: 8px;
}

.contact-personal p span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

.personal-buttons {
    display: grid;
    grid-column: 1 / 4;
}

.edit-button {
    display: flex;
    width: 320px;
    height: 52px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.edit-button a {
    display: grid;
    grid-auto-flow: column;
    justify-content: center;
    align-items: center;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-decoration: none;
    align-self: center;
    justify-self: center;
}

.edit-button:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: #0D0D0D;
    border: 1px solid var(--Primary, #0D0D0D);
}

.edit-button:hover svg path {
    fill: #0D0D0D;
}

.change-button {
    display: flex;
    width: 320px;
    height: 52px;
    padding: 0px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: 1px solid transparent;
}

.change-button:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: #0D0D0D;
    border: 1px solid var(--Primary, #0D0D0D);
}

.change-button:hover svg path {
    fill: #0D0D0D;
}

.personal-content .subscribe-block {
    display: grid;
    grid-column: 4 / 7;
    grid-template-columns: 1fr;
    grid-row: 1 / 6;
}

.subscribe-block h2 {
    margin: 0;
    margin-bottom: 16px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.subscribe-block .personal-sub label {
    display: grid;
    grid-column: 1 / -1;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
    gap: 4px;

}

.personal-sub input[type=email] {
    display: grid;
    grid-column: 1/ -1;
    margin: 0;
    margin-bottom: 16px;
}

.personal-sub .checkboxes {
    display: grid;
    grid-auto-flow: row;
    align-items: center;
    justify-content: start;
    grid-row: 3 / 4;
    grid-column: 1 / -1;
    margin: 0;
    margin-bottom: calc(32px - 12px);
}

.personal-sub .checkboxes .check {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
    gap: 16px;
    margin-bottom: 12px;
}

.personal-sub .checkboxes .check .subCheck {
    display: grid;
    grid-column: 1/2;
    height: 16px;
    width: 16px;
}

.update-profile {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / 8;
}

.personal-sub .checkboxes .check .subLabel {
    display: grid;
    grid-column: 2 / 3;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px;
    align-self: center;
    justify-self: center;
    margin: 0;
}

.personal-sub .format {
    display: grid;
    grid-column: 1/-1;
}

.personal-sub .radio {
    display: grid;
}

.personal-sub .radio .radio-variant {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1/-1;
}

.personal-sub .radio .radio-variant input {
    display: grid;
    height: 20px;
    width: 20px;
    grid-column: 1/2;

}

.personal-sub .radio .radio-variant label {
    display: grid;
    grid-auto-flow: row;
    grid-column: 2 / 3;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}


.personal-sub .radio .radio-variant input {
    display: grid;
    height: 20px;
    width: 20px;
    grid-column: 1 / 2;
    margin-right: 12px;
}

.personal-content.active form {
    display: grid;
    grid-column: 1 / 8;
    grid-template-columns: repeat(7, 1fr);
    margin-bottom: 40px;
}

.personal-content.active form .osn-info {
    display: grid;
    grid-column: 1 / 4;
}

.personal-content.active form .osn-info input:last-child {
    margin-bottom: 32px;
}

.personal-content.active form .contact-info {
    display: grid;
    grid-auto-rows: max-content;
    grid-column: 5 / 9;
}

.osn-pas span.hint {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.personal-content.active form .contact-info input:last-child {
    margin-bottom: 32px;
}

.personal-content.active form .address-info {
    display: grid;
    grid-column: 1 / 4;
}

.personal-content.active form .address-info input:last-child {
    margin-bottom: 64px;
}



.personal-content.active form label {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
    margin: 0;
    margin-bottom: 4px;
    margin-right: 4px;
}

.personal-content.active form label span {
    color: var(--Alert, #C5230A);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
}

.personal-content.active form input {
    /* Убрано display: flex — не работает на <input> */
    height: 52px;
    padding: 0 16px;
    /* Убраны justify-content, align-items — не работают на <input> */
    align-self: stretch; /* ← работает, только если родитель — grid */
    outline: none;
    border: none;
    border-top: 0.5px solid transparent;
    border-left: 0.5px solid transparent;
    border-right: 0.5px solid transparent;
    border-bottom: 0.5px solid var(--Primary, #0D0D0D);
    background: var(--Input-Field, #FFF);
    color: var(--Typography-Typography-Primary, #0D0D0D); /* ← явно задан цвет по умолчанию */
    font-family: inherit; /* ← наследует шрифт от формы */
    box-sizing: border-box; /* ← важно для корректного размера */
}

.personal-content.active form input:hover {
    background: linear-gradient(0deg, var(--Primary-Primary-10, #E6E6E6) 0%, var(--Primary-Primary-10, #E6E6E6) 100%), var(--Surfaces, #FFF);
    color: var(--Typography-Typography-Tertiary, #B2B2B2); /* ← исправлена опечатка: Tertiart → Tertiary */
}

.personal-content.active form input:focus {
    border: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--Surfaces, #FFF);
    color: black;
}

.personal-content.active form input[type="checkbox"] {
    height: 24px;
    width: 24px;
}

.personal-content.active form input#mobilephone,
.personal-content.active form input#viber,
.personal-content.active form input#whatsaap {
    display: flex;
    height: 52px;
    padding: 0px 16px 0 46px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border: none;
    border-bottom: 1px solid var(--Primary, #0D0D0D);
    background: var(--Input-Field, #FFF);
}

.personal-content.active form input[type=submit] {
    display: grid;
    grid-row: 3;
    grid-column: 1 / 4;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.personal-content h3 {
    display: grid;
    grid-column: 1 / -1;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.24px;
    margin: 0;
    margin-bottom: 20px;
}

.zakaz-filters {
    display: grid;
    grid-column: 1/-1;
    grid-auto-flow: column;
    margin: 0;
    padding: 0;
    align-items: center;
    justify-content: start;
}

.zakaz-state {
    display: grid;
    grid-column: 1 / -1;
    grid-auto-flow: column;
    padding: 0;
    list-style: none;
    margin: 0;
    margin-top: 40px;
    margin-bottom: 40px;
}

.zakaz-state li {
    display: flex;
    height: 28px;
    padding: 4px 12px;
    justify-content: center;
    align-items: center;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    gap: 4px;
    cursor: pointer;
}

.zakaz-state li.active {
    background: var(--Primary, #0D0D0D);
    color: var(--Typography-Typography-On-Color, #F2F2F2);
}

.order-table {
    display: grid;
    grid-column: 1/9;
    grid-auto-rows: auto;
}

.personaltable-header {
    display: grid;
    grid-column: 1/4;
    grid-template-columns: repeat(5, 1fr);
    grid-row: 1/2;
    height: 44px;
    border-bottom: 0.5px solid var(--Primary, #0D0D0D);
}

.personaltable-header .number,
.personaltable-header .date,
.personaltable-header .price {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.table-content-personal {
    display: grid;
    grid-column: 1 / -1;
    grid-auto-flow: row;
    height: auto;
    padding: 12px 0;
    align-items: center;
    justify-content: space-between;
    border-bottom: 0.5px solid var(--Primary, #0D0D0D);
}

.table-content-personal .top {
    display: grid;
    grid-column: 1 / 3;
    grid-auto-flow: column;
    grid-template-columns: auto;
}

.table-content-personal .bottom {
    display: grid;
    grid-column: 1 / 3;
    grid-auto-flow: column;
    grid-template-columns: auto;
}

.table-content-personal .number,
.table-content-personal .date,
.table-content-personal .summa {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-decoration: none;
}

.table-content-personal .osn-info {
    display: grid;
    grid-template-columns: 110px 105px 100px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.table-content-personal .status {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    width: 88px;
    justify-content: end;
    gap: 4px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.table-content-personal .excell a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-decoration: none;
    gap: 8px;
    display: flex;
    align-items: center;
    grid-auto-flow: column;
    justify-content: end;
}

.table-content-personal .details {
    display: grid;
    justify-content: end;
}

.details button {
    background: transparent;
    border: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    background: #f2f2f2;
    cursor: pointer;
}

.accordion-content {
    grid-column: 1 / -1;
    
    padding: 0px;
    background-color: #f2f2f2;
    border-top: 1px solid #ddd;
    display: none;
    
}

.accordion-content ul {
    display: grid;
    list-style: none;
    padding: 0;
    margin: 0;
}

.accordion-content ul li {
    display: grid;
    grid-template-columns: auto;
    padding: 0;
    margin: 20px 0;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--Primary-Primary-10, #E6E6E6);
}

.accordion-content ul li .product-left {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1/2;
}

.accordion-content ul li .product-left #msGallery {
    margin-right: 32px;
}

.accordion-content ul li .product-left h4 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.2px;
    margin: 0;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.product-left .product-info {
    display: grid;
    justify-content: space-between;
    grid-auto-flow: row;
    align-items: stretch;
}

.product-left .product-info .up {
    display: grid;
    grid-auto-rows: max-content;
}

.product-left .product-info .down {
    display: grid;
    align-items: end;
    justify-content: start;
    grid-auto-rows: unset;
    align-self: end;
}

.product-right {
    display: grid;
    grid-column: 2/ -1;
    align-items: end;
    justify-content: end;
}

.accordion-content ul li .product-left p {
    color: var(--Typography-Typography-Primary, #0D0D0D);

    /* Medium/Caption */
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 18px */
    letter-spacing: 0.12px;
    margin: 0;
}

.accordion-content ul li .product-right {
    display: grid;
    grid-column: 2/-1;
}


.litle-products {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(1, 1fr);
    border-top: 1px solid black;
}

.litle-products.slick-initialized .slick-slide {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(1, 1fr);
}

.small-product {
    display: grid;
    border-top: 1px solid black;
    border-left: 1px solid black;
}

.small-product:last-child {
    display: grid;
    border-top: 1px solid black;
    border-right: none;
}

.small-product img {
    width: 100%;
    display: block;
    transition: transform 0.3s ease;
}

.small-product img:hover {
    transform: scale(1.03);
}

.title-with-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    bottom: 0%;
    padding: 0 16px 0 16px;
    width: 90%;
}

.title-with-price h2 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

.title-with-price .price {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: right;
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    margin: 0;
    display: grid;
    grid-column: 2 / 8;
    text-transform: uppercase;
}

.small-product a {
    display: block;
    position: relative;
    bottom: 0;
    overflow: hidden;
    text-decoration: none;
}

.blog-wrapper {
    display: grid;
    grid-column: 1/-1;
    grid-template-columns: repeat(12, 1fr);
    position: relative;
    top: 170px;
    margin-top: 64px;
    min-height: calc(100vh - 265px);
}

.blog-tabs {
    display: grid;
    grid-column: 1 / 3;
    height: fit-content;
    padding: 32px;
    background: var(--Surfaces, #FFF);

}



.blogtab {
    display: grid;
    padding: 8px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%; /* = 21px */
    letter-spacing: 0.14px;
    margin-bottom: 16px; /* ← задаём отступ всем */
}

.blogtab:last-child {
    margin-bottom: 0;
}

.blogtab.active {
    background: var(--Primary, #0D0D0D);
    color: #F2F2F2;
}

.tabs-content {
    display: grid;
    grid-column: 4/10;
}

.blogitems {
    display: grid;
}

.blogitems:not(.activeTab) {
    display: none;
}

.blog-item {
    display: grid;
    grid-column: 4 / 10;
    grid-template-columns: repeat(6, 1fr);
    padding-top: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid #E6E6E6;
    align-items: start;
    justify-content: start;
}

/* Увеличенный отступ снизу у первого и последнего */
.blog-item:first-child,
.blog-item:last-child {
    padding-bottom: 80px;
}

.tabs-content .blog-item .blog-img {
    display: grid;
    grid-column: 1 / 3;
    padding-right: 32px;
}

.blog-img img {
    width: 100%;
}


.item-info {
    display: grid;
    grid-column: 3 / -1;
    margin: 0;
    align-items: start;
    height: max-content;
    justify-content: start;
}

.blog-item a {
    text-decoration: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

.item-info h2 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 0px;
    margin-bottom: 12px;
}

.item-info .data {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0;
    margin-bottom: 0px;
    margin-bottom: 12px;
}

.item-info .preview {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
    margin: 0;
    margin-bottom: 0px;
    margin-bottom: 12px;
}

.item-info .tags {
    display: grid;
    grid-auto-flow: column;
    align-items: end;
    justify-content: start;
    gap: 8px;
}

.item-info .tags a {
    border-bottom: 1.2px solid #0083C5;
    color: #0083C5;
}

/* Общие стили для обеих обёрток */
.article-wrapper,
.article-wrapper-about {
    display: grid;
    position: relative;
    top: 170px;
    margin-top: 64px;
}

/* Специфичные настройки сетки */
.article-wrapper {
    grid-column: 3 / 11;
}

.article-wrapper-about {
    grid-column: 4 / 10;
    min-height: calc(100vh - 498px);
    grid-template-rows: 48px auto;
}

/* Изображения */
.article-wrapper img {
    width: 100%;
}

/* Блок с изображениями */
.article-wrapper .img-blog-block {
    display: grid;
    grid-auto-flow: column;
    gap: 8px;
}

/* Кнопки-ссылки */
.article-wrapper a {
    display: flex;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    text-decoration: none;
    margin: 24px 0;
}

/* Общие типографические стили для текста */
.article-wrapper .data,
.article-wrapper .preview,
.article-wrapper .text,
.article-wrapper-about .text,
.article-wrapper h1,
.article-wrapper-about h1,
.article-wrapper h2,
.article-wrapper ul li,
.article-wrapper ol li,
.caption {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    margin: 0;
}

/* Заголовки */
.article-wrapper h1,
.article-wrapper-about h1 {
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.article-wrapper h2 {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.72px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

/* Текстовые блоки */
.article-wrapper .data {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin-bottom: 24px;
}

.article-wrapper .preview {
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin-bottom: 24px;
}

.article-wrapper .text,
.article-wrapper-about .text {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    margin-bottom: 32px;
}

/* Последний параграф — без отступа снизу */
.article-wrapper .text:last-child {
    padding-bottom: 80px;
    margin-bottom: 0;
}

/* Списки */
.article-wrapper ul li,
.article-wrapper ol li {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    margin-bottom: 8px;
}

/* Подпись (caption) */
.caption {
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
    margin-top: 16px;
    margin-bottom: 32px;
}

.modalBackground {
    display: none;
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 1;
}

h2.modal-head {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 16px;
}


/* Modal Header */

.modal-header {
    padding: 2px 16px;
    background-color: #5cb85c;
    color: white;
}


/* Modal Body */


/* The Modal (background) */

.modal {
    display: none;
    position: fixed;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.4);
    align-items: center;
    justify-content: center;
}


/* Modal Content/Box */

.modal-header {
    background-color: #fff;
    display: flex;
    color: black;
    padding: 8px;
    align-items: center;
    gap: 8px;
    position: absolute;
    right: -48px;
    top: -48px;
    border-radius: 100px;
}

#closeForm {
    cursor: pointer;
}

.modal-content {
    width: 442px;
    padding: 48px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;
    background-color: #f2f2f2;
    position: absolute;
}

.modal-content form {
    display: flex;
    flex-direction: column;
}

.modal-content form label {
    padding-top: 8px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding-bottom: 4px;
    align-self: stretch;
    flex-wrap: nowrap;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
}

.modal-content form label span {
    color: red;
}

.modal-content form input {
    height: 48px;
    padding: 0 16px;
    align-self: stretch; /* работает, если родитель — CSS Grid */
    border: none;
    border-bottom: 1px solid var(--Primary, #0D0D0D);
    background: var(--Input-Field, #FFF);
    font-family: inherit;
    font-size: 16px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    box-sizing: border-box;
    outline: none;
}

/* Специфичные стили для поля логина */
.modal-content form input#login {
    margin-left: 0;
    text-transform: none;
}

#forPas {
    text-decoration: none;
    color: var(--Alert, #C5230A);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.11px;
    margin: 0;
    margin-top: 4px;
    margin-bottom: 4px;
}

#recovery-button {
    margin-top: 0;
}

.modal-content .pod-text {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
    margin: 0;
    margin-top: 4px;
    margin-bottom: 4px;
}

.modal-content .pod-pod-text {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.11px;
    margin: 0;
    margin-bottom: 24px;
}

.modal-content form button {
    display: flex;
    height: 52px;
    padding: 0px 24px;
    margin-top: 32px;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    border: none;
}

.check_with_text {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 16px auto;
    gap: 12px;
    margin-top: 32px;
}

#partnerForm .check_with_text {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 16px auto;
    gap: 12px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.check_with_text input[type=checkbox] {
    height: 16px;
    width: 16px;
}

.check_with_text h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-transform: uppercase;
    margin: 0;
    margin-bottom: 4px;

}

.check_with_text p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
    gap: 4px;
    margin: 0px;
}

.check_with_text p a {
    color: #0083C5;

    font-family: "Segoe UI";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
}

#recovery {
    display: flex;
    height: 52px;
    padding: 0px 24px;
    background-color: #F2F2F2;
    color: #0D0D0D;
    justify-content: center;
    align-items: center;
    margin-top: 8px;
    gap: 8px;
    align-self: stretch;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
    text-decoration: none;
    cursor: pointer;
}


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

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.marker-class {
    width: 40px;
    height: 40px;
}

.popup {
    display: flex;
    width: max-content;
}

.balloon {
    display: flex;
    position: relative;
    padding: 8px 8px 8px 8px;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
    border: 0.5px solid var(--Primary, #0D0D0D);
    background: var(--On-Color-Primary, #F2F2F2);
}

#widget {
    display: grid;
    position: relative;
    grid-column: 2 / 12;
    top: 175px;
    z-index: 1;
}

.balloon__address {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.13px;
}

.balloon__contacts {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
}

/* Единое правило для корзины */
#msMiniCart,
.msMiniCart {
    align-self: center;
    justify-self: center;
    height: auto; /* ← финальное значение */
    width: 100%;
    background: #F2F2F2;
    border-bottom: 2px solid transparent;
    margin-top: 1px; /* ← если нужно */
}

/* Состояние "пусто" */
#msMiniCart .empty,
.msMiniCart .empty {
    display: grid;
    align-self: center;
    justify-self: center;
    height: 100%;
    width: 100%;
    /* фон и border уже наследуются — можно убрать */
}

/* Остальной код без изменений */
.cart-conteiner {
    display: grid;
    grid-column: 2 / 12;
}

#msOrder {
    display: grid;
    grid-row: 3 / 5;
    grid-column: 2 / 12;
    justify-content: end;
    align-items: end;
    position: relative;
    top: 170px;
    margin-top: 0;
}

.wrapper404 {
    display: grid;
    position: relative;
    top: 188px;
    grid-column: 5/9;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    justify-content: center;
    margin-bottom: 150px;
}

.cihr404 {
    align-self: center;
    justify-self: center;
    align-items: center;
    width: 270px;
    justify-content: space-between;
    display: grid;
    grid-column: 1 / -1;
    grid-auto-flow: column;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
}

.text404 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    display: grid;
    grid-column: 1 / -1;
    margin-top: 24px;
    margin-bottom: 40px;
}

.description404 {
    display: grid;
    grid-column: 1/-1;
    text-align: center;

}

.description404 p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.2px;
    margin: 0;
    margin-bottom: 32px;
}

.buttons404 {
    display: grid;
    grid-column: 1 / -1;
}

/* Общие стили для обеих кнопок */
.buttons404 .cat,
.buttons404 .ind {
    display: flex;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
.buttons404 .cat {
    background: var(--Primary, #0D0D0D);
    border: none;
    margin-bottom: 16px;
}

.buttons404 .ind {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}

/* Общие стили для ссылок внутри */
.buttons404 .cat a,
.buttons404 .ind a {
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%; /* = 24px */
    letter-spacing: 0.16px;
    text-decoration: none;
    text-transform: uppercase;
}

/* Цвета текста */
.buttons404 .cat a {
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
}

.buttons404 .ind a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

.reg-wrapper {
    display: grid;
    grid-column: 4 / 10;
    position: relative;
    top: 64px;
}

.reg-wrapper .backLink a {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
    gap: 4px;
    text-decoration: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    margin: 0;
    margin-bottom: 16px;
}

.reg-wrapper h1 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.24px;
    margin: 0;
    margin-bottom: 24px;
}

.reg-form .fio-block,
.reg-form .yur-block,
.reg-form .contact-block,
.reg-form .password-block {
    display: grid;
    grid-auto-flow: column;
    gap: 16px;
    margin-bottom: 16px;
}

.reg-form .yur-block {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row;
}

.reg-form .iti--allow-dropdown {
    margin-bottom: 0px;
}

.reg-form .password-block,
.reg-form .contact-block {
    align-items: start;
    grid-template-columns: repeat(2, 1fr);
}

.reg-form .password-block {
    margin-bottom: 32px;
}

.reg-form .hint {
    color: var(--Typography-Typography-Secondary, #808080);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.reg-form .regUnit,
.reg-form .osn-pas,
.reg-form .rep-pas {
    display: grid;
    align-items: start;
    height: max-content;
}

.reg-form p {
    margin: 0;
}

.reg-form label {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
    letter-spacing: 0.14px;
}

.reg-form input {
    display: flex;
    height: 52px;
    padding: 0px 12px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border: none;
    border-bottom: 1px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--Surfaces, #FFF);
}

.reg-form .conf-block {
    display: grid;
    grid-auto-flow: column;
    align-items: start;
    gap: 12px;
    justify-content: start;
    margin-bottom: 32px;
}

.reg-form .conf-block input {
    width: 24px;
    height: 24px;
    border: 1px solid #1A1A1A;
    background: #F2F2F2;
}

.reg-form .conf-block h5 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    margin: 0;
    margin-bottom: 4px;
}

.reg-form .text p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.14px;
    margin: 0;
}

.reg-form .text p a {
    color: var(--Buttons-Link, #0083C5);
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
}

.reg-form .button-block {
    display: grid;
    grid-auto-flow: column;
    gap: 16px;
}

/* Общие стили для всех кнопок и submit-инпутов */
.reg-form .button-block input,
.reg-form .button-block button {
    height: 52px;
    padding: 0 24px;
    flex: 1 0 0;
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.16px;
    cursor: pointer;
    box-sizing: border-box;
}

/* Стили для обычного button */
.reg-form .button-block button {
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Primary-Primary-100, #0D0D0D);
    color: var(--Typography-Typography-Primary, #0D0D0D); /* ← добавлено для ясности */
}

/* Стили для submit-инпута (если используется как кнопка) */
.reg-form .button-block input {
    /* Убраны нерабочие Flexbox-свойства */
    background: var(--Primary-Primary-100, #0D0D0D);
    border: none;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
}

/* Специфичный стиль для register-button */
.reg-form .button-block button.register-button {
    border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
    background: var(--CTA-BTN-Background, #0D0D0D);
    color: var(--CTA-BTN-Typography, #F2F2F2);
    letter-spacing: 0.48px;
    text-transform: uppercase;
}

.reg-form .password-block .input-container {
    position: relative;
    display: grid;
    align-items: center;
}

.eye-icon {
    position: absolute;
    right: 10px;
    cursor: pointer;
    margin-right: 5px;
}


.lookswrapper {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column: 1/-1;
    position: relative;
    top: 154px;
}

.lookswrapper a {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1 / -1;
}

@media screen and (min-width: 1600px) and (max-width: 1919px) {
    a.opt-price {
        background-color: white;
        color: black;
        border: solid 1px black;
        font-weight: 600;
        height: 42px;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-left: 8px;
        padding: 0 24px;
    }

    a.more {
        background-color: black;
        color: white;
        border: solid 1px black;
        height: 42px;
        font-weight: 600;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-right: 8px;
        padding: 0 24px;
    }

    footer {
        border-top: solid 1px black;
        display: grid;
        grid-column: 1 / -1;
        grid-row: 6 / 7;
        grid-template-columns: repeat(12, 1fr);
        top: 58px;
        position: relative;
        align-items: flex-start;
        padding-top: 0;
        padding-bottom: 0;
    }

    footer.desctop .up-footer {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: auto 66px;
        height: 240px;
        grid-auto-flow: column;
    }

    .footer-block.first {
        display: grid;
        grid-column: 2 / 4;
        height: 100%;
    }

    .first .social {
        display: grid;
        grid-template-columns: repeat(4, auto);
        gap: 16px;
    }

    .first .social a svg {
        height: 24px;
        width: 24px;
    }

    .social-with-copiryght {
        display: grid;
        align-items: start;
        justify-content: start;
    }

    .copyright {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
        letter-spacing: 0.052px;
        align-self: end;
    }

    footer .city {
        margin: 0;
        margin-bottom: 12px;
    }

    /* Общие типографические стили */
.city .country-city,
.city .address,
.opt h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: 0.12px;
    margin: 0;
}

/* Отступы */
.city .country-city,
.opt h3 {
    margin-bottom: 4px;
}

.city .mail {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 12px;
    margin: 0;
    text-decoration: none;
    display: flex; /* оставить, если внутри иконка + текст */
}

.city .mail a {
    color: inherit; /* наследует цвет от родителя */
    text-decoration: none;
    /* остальное наследуется */
}

/* Стили для .opt */
.opt p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    margin: 0 0 2px 0;
}

.opt p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 400; /* только это отличается */
    text-decoration: none;
}

.opt p span,
.opt span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

.opt span a:hover {
    color: #0083C5;
}

    .footer-block.second {
        display: grid;
        grid-column: 8 / 12;
        grid-template-columns: repeat(2, auto);
        justify-content: space-between;
    }

    .footer-block.third {
        display: grid;
        grid-column: 10/13;
    }

    .little-menu {
        display: grid;
        grid-column: 1 / 8;
        grid-template-columns: repeat(3, 1fr);
        justify-content: stretch;
    }

    .lm-block h4 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.36px;
        margin: 0;
        margin-bottom: 12px;
    }

    .lm-block ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .lm-block ul li {
        display: flex;
        height: 24px;
        align-items: center;
        flex-shrink: 0;
        align-self: stretch;
        /* padding: 8px 0px; */
    }

   .lm-block ul li a {
    color: var(--Tertiary-BTN-Typography, #4D4D4D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    width: 100%;
    text-decoration: none;
}

.lm-block ul li a:hover {
    color: var(--Typography-Typography-Secondary, #808080);
}

   /* Общие стили для всех .value */
#category .value,
#color .value,
#size .value {
    display: flex;
    height: 44px;
    align-items: center;
    gap: 8px;
    flex-basis: 47.7%;
}

/* Стили для category и color */
#category .value,
#color .value {
    justify-content: flex-start;
    background: var(--Background, #F2F2F2);
}

/* Последний элемент в size — на всю ширину */
#size .value:last-child {
    flex-basis: 100%;
}

    .product-wrapper {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: calc(28px + 44px + 64px + 17px);
        grid-column: 1/ -1;
        grid-row: 5/6;
    }

    .product-wrapper .item-accordion {
        width: 100%;
        display: grid;
        grid-column: 1/ -1;
        margin-bottom: 32px;
    }

    .item-accordion .accordion {
        background-color: #f2f2f2;
        cursor: pointer;
        padding: 8px 0;
        width: 100%;
        text-align: left;
        outline: none;
        transition: 0.4s;
        display: flex;
        justify-content: space-between;
        align-items: center;
        box-sizing: border-box;
        border-top: 1px solid #B2B2B2;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }



    .item-accordion .panel {
        display: none;
        padding: 4px 0;
        background: #f2f2f2;
        overflow: hidden;
    }

    .item-accordion .panel.active {
        display: block;
    }

   

    .inputs label {
        display: flex;
        flex-direction: row;
        height: 38px;
        justify-content: center;
        align-items: center;
        background: var(--Background, #F2F2F2);
        border: 0.5px solid var(--Secondary, #B2B2B2);
        gap: 8px;
    }

    .inputs label[for=all] {
        display: flex;
        flex-direction: row;
        padding: 0 16px;
        height: 42px;
        width: 100%;
    }

    .unit .counter {
    display: flex;
    gap: 4px;
    margin-right: 4px;
}

/* Кнопки +/- */
.unit #minus,
.unit #plus {
    display: flex;
    width: 40px;
    height: 40px;
    /* Рекомендуется добавить (если нет глобально): */
    /* justify-content: center;
       align-items: center;
       background: #f2f2f2;
       border: 1px solid #ccc;
       cursor: pointer; */
}

/* Поле ввода количества */
.unit #unitInput {
    display: flex;
    width: 40px;
    height: 38px;
    /* Рекомендуется добавить (если нет глобально): */
    /* text-align: center;
       border: 1px solid #ccc;
       font-family: inherit;
       font-size: 14px;
       padding: 0; */
}

    .blog-tabs {
        display: grid;
        grid-column: 1 / 3;
        height: fit-content;
        padding: 24px;
        background: var(--Surfaces, #FFF);
    }

    /* Основное состояние */
#addZak {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 16px 0 24px; /* ← единый padding */
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: 0.5px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
    cursor: pointer;
}

/* Hover — только изменения */
#addZak:hover:not(:disabled) {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
    font-weight: 600;
}

/* Disabled — самое приоритетное состояние */
#addZak:disabled {
    background: var(--Disable, #B2B2B2);
    color: var(--Typography-Typography-CTA-Disable, #E6E6E6);
    font-weight: 600;
    border: none;
    cursor: not-allowed;
}

    .with-this-product h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        padding: 0 24px;
        margin-top: 36px;
    }

    .title-with-price {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 88%;
    }

    .map-wrapper .select-country {
        display: grid;
        height: 800px;
        grid-column: 10 / 12;
        grid-template-rows: 30px auto;
        margin-left: -50px;
    }

    .map-wrapper #map {
        display: grid;
        height: 800px;
        grid-column: 1 / 10;
        width: calc(100% - 82px);
    }

    .buttons404 .cat {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        background: var(--Primary, #0D0D0D);
        border: none;
        width: 100%;
        margin-bottom: 16px;
    }

    .buttons404 .cat a {
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .buttons404 .ind {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        width: 100%;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
    }

    .buttons404 .ind a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .personal-info h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.2px;
        text-transform: uppercase;
    }

    .personal-content.active form input {
        display: flex;
        height: 44px;
        padding: 0px 12px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .cart-empty a {
        display: flex;
        width: 534px;
        height: 44px;
        padding: 0 20px 0 26px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .cart-product {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        padding: 16px 8px;
        height: 128px;
        align-self: stretch;
        align-items: start;
        justify-content: space-between;
        border-bottom: 1px solid var(--Primary-Primary-10, #E6E6E6);
    }

    .cart-product .left-block {
        display: grid;
        grid-column: 1 / 2;
        grid-row: 1/ -1;
        grid-auto-flow: column;
        grid-template-columns: max-content;
    }

    .cart-product .product-img {
        display: grid;
        padding-right: 32px;
        height: 128px;
        width: 85px;
    }

    .cart-product .product-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .sender-zakaz {
        display: flex;
        width: auto;
        height: 44px;
        padding: 0 16px 0 22px;
        align-items: center;
        gap: 16px;
        flex-shrink: 0;
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-family: "Ubuntu Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        border: none;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        right: 0;
    }
}

@media screen and (min-width: 1440px) and (max-width: 1599px) {
    a.opt-price {
        background-color: white;
        color: black;
        border: solid 1px black;
        font-weight: 600;
        height: 42px;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-left: 8px;
        padding: 0 24px;
    }

    a.more {
        background-color: black;
        color: white;
        border: solid 1px black;
        height: 42px;
        font-weight: 600;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-right: 8px;
        padding: 0 24px;
    }

    footer {
        border-top: solid 1px black;
        display: grid;
        grid-column: 1 / span 12;
        grid-row: 6 / 7;
        grid-template-columns: repeat(12, 1fr);
        top: 58px;
        position: relative;
        align-items: flex-start;
    }

    .footer-block.first {
        display: grid;
        grid-column: 2 / 3;
        height: 100%;
    }

    .first .social {
        display: grid;
        grid-template-columns: repeat(4, auto);
        gap: 14px;
    }

    .social-with-copiryght {
        display: grid;
    }

    .first .social a svg {
        height: 20px;
        width: 20px;
    }

    .copyright {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
        align-self: end;
    }

   /* Отступы для города в футере */
footer .city {
    margin: 0 0 12px 0;
}

/* Общие стили для текстовых блоков в .city */
.city .country-city,
.city .address {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin: 0;
}

.city .country-city {
    margin-bottom: 4px;
}

/* Стили для .mail (если содержит иконку + ссылку) */
.city .mail {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 12px;
    margin: 0;
    text-decoration: none;
    display: flex; /* оставить, если есть иконка */
}

.city .mail a {
    color: inherit; /* наследует цвет от .mail */
    text-decoration: none;
    /* остальное наследуется */
}

/* Стили для .opt */
.opt h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* ← обрати внимание: отличается от .city */
    margin: 0 0 4px 0;
}

.opt p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    margin: 0 0 2px 0;
}

.opt p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 400; /* только это отличается от родителя */
    text-decoration: none;
}

/* Стили для вторичного текста */
.opt p span,
.opt span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

    .footer-block.second {
        display: grid;
        grid-column: 8 / 12;
        grid-template-columns: auto auto;
        justify-content: space-between;
    }

    .footer-block.third {
        display: grid;
        grid-column: 10/13;
    }

    .little-menu {
        display: grid;
        grid-column: 1 / 8;
        grid-template-columns: repeat(3, 1fr);
        justify-content: stretch;
    }

    .lm-block h4 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        display: grid;
        margin: 0;
        margin-bottom: 4px;
    }

    .lm-block ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .lm-block ul li {
        display: flex;
        height: 32px;

        align-items: center;
        flex-shrink: 0;
        align-self: stretch;
    }

   .lm-block ul li a {
    color: var(--Tertiary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    width: 100%;
    text-decoration: none;
    cursor: pointer; /* ← улучшает UX */
}

.lm-block ul li a:hover {
    color: var(--Typography-Typography-Secondary, #808080);
}

    .product-wrapper {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: calc(28px + 44px + 64px + 17px);
        grid-column: 1/ -1;
        grid-row: 5/6;
    }

    .gallery-with-other {
        display: grid;
        grid-column: 1 / 8;
        grid-template-rows: auto auto;
        align-items: start;
        justify-content: start;
        border-right: 1px solid black;
    }

    .gallery-wrapper {
        display: grid;
        grid-column: 1 / 8;
        grid-template-columns: repeat(2, 1fr);
    }

    .mobile-gallery-wrapper {
        display: none;
    }

    .progress {
        display: none;
    }

    .info-wrapper {
        grid-column: 8 / -1;
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 40px;
    }

    .product-like {
        background-repeat: no-repeat;
        background-position: center;
        height: 24px;
        width: 24px;
        margin-left: 32px;
        padding: 6px;
    }

    .inputs label {
        display: flex;
        flex-direction: row;
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
        margin-right: 0px;
        background: var(--Background, #F2F2F2);
        border: 0.5px solid var(--Secondary, #808080);
        gap: 8px;
    }

    .inputs label[for=all] {
        display: flex;
        flex-direction: row;
        padding: 0 16px;
        height: 42px;
        width: 100%;
        justify-content: center;
        align-items: center;
        background: var(--Background, #F2F2F2);
        border: 0.5px solid var(--Secondary, #808080);
        gap: 0px;
        margin-right: 0;
    }

   .unit .counter {
    display: flex;
    gap: 4px;
    margin-right: 4px;
}

/* Общие стили для кнопок +/- */
.unit #minus,
.unit #plus {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    border: none;
    padding: 0;
    margin: 0;
    background: #f2f2f2; /* ← добавлен общий фон */
    cursor: pointer;
}

/* Состояния для кнопок */
.unit #minus:hover,
.unit #plus:hover {
    /* Нет визуальных изменений → можно оставить пустым или добавить эффект */
}

.unit #minus:active,
.unit #plus:active {
    background: #838383;
    outline: 0;
}

.unit #minus:disabled,
.unit #plus:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

/* Стили для input */
.unit #unitInput {
    display: flex;
    width: 40px;
    height: 38px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    border: none;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    font-family: inherit;
    font-size: 14px;
    color: inherit;
}

.unit #unitInput:focus-visible {
    outline: none;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

.unit #unitInput:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

    #addZak {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 16px 0 20px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Color-White-100, #F2F2F2);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: none;
    outline: none;
    cursor: pointer; /* ← улучшает UX */
}

#addZak:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
}

    .product-like {
    width: 26px;
    height: 26px;
    margin-left: 0;
    padding: 6px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.24099 2.00001L5.25095 2C6.28206 2.00626 7.26924 2.41715 8.00017 3.1438C8.35873 2.7839 8.78442 2.49774 9.2532 2.30157C9.72841 2.10271 10.2384 2.0003 10.7536 2.0003C11.2687 2.0003 11.7787 2.10271 12.2539 2.30157C12.7286 2.50021 13.1591 2.79112 13.5205 3.15743C14.2552 3.89575 14.6677 4.89499 14.6677 5.93665C14.6677 6.97862 14.255 7.97814 13.5198 8.71652C13.5196 8.71672 13.5194 8.71692 13.5192 8.71712L8.4735 13.8029C8.34832 13.929 8.17796 14 8.00023 14C7.82251 14 7.65215 13.929 7.52697 13.8029L2.48058 8.71647C2.48049 8.71638 2.48067 8.71656 2.48058 8.71647C1.93446 8.16656 1.56238 7.46751 1.41141 6.70733C1.26042 5.94703 1.33705 5.15908 1.63172 4.44211C1.92638 3.72515 2.42599 3.11104 3.06799 2.67665C3.70999 2.24226 4.46587 2.00689 5.24099 2.00001ZM5.24784 3.33334C4.73677 3.33885 4.23855 3.49449 3.81518 3.78095C3.39044 4.06834 3.0599 4.47463 2.86496 4.94896C2.67001 5.4233 2.61931 5.9446 2.7192 6.44761C2.8191 6.95062 3.06515 7.41299 3.42656 7.77684L8.00023 12.3868L12.5746 7.77619C13.0612 7.28764 13.3344 6.62619 13.3344 5.93665C13.3344 5.24711 13.0612 4.58567 12.5746 4.09712L12.5721 4.09464C12.3345 3.8536 12.0514 3.6622 11.7392 3.53155C11.427 3.40091 11.092 3.33364 10.7536 3.33364C10.4151 3.33364 10.0801 3.40091 9.7679 3.53155C9.45571 3.6622 9.17261 3.8536 8.93504 4.09463L8.92919 4.10057C8.79161 4.23671 8.67168 4.38958 8.57229 4.55566C8.4519 4.75684 8.23468 4.87999 8.00023 4.87999C7.76579 4.87999 7.54857 4.75684 7.42818 4.55566C7.32879 4.38958 7.20889 4.23667 7.07132 4.10053L7.06815 4.0974C6.58538 3.61326 5.9314 3.3388 5.24784 3.33334Z" fill="%230D0D0D"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px; /* ← явно задаём размер иконки */
    cursor: pointer;
    border: none;
    outline: none;
    /* Убраны justify-self, position — добавим только при необходимости */
}

.product-like.is-active {
    /* Можно изменить иконку, если нужно: */
    /* background-image: url('...active-icon...'); */
    
    /* Если хочешь чуть другой размер — ок, но лучше одинаковый: */
    /* width: 26px;
       height: 26px; */
    
    /* z-index и position — только если требуется */
    position: relative;
    z-index: 1;
}

    .with-this-product {
        display: grid;
        grid-column: 1 / 8;
        align-self: end;
        border-right: 1px solid black;
    }

    .with-this-product h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        padding: 0 24px;
        margin-top: 36px;
    }

    .title-with-price {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 85%;
    }

    .title-with-price h2 {
        color: var(--Color-Black-100, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
    }

    .title-with-price .price {
        color: var(--Color-Black-100, #0D0D0D);
        text-align: right;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.48px;
        margin: 0;
        display: grid;
        grid-column: 2 / 8;
        text-transform: uppercase;
    }

    .cart-empty a {
        display: flex;
        width: 480px;
        height: 44px;
        padding: 0 16px 0 22px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .cart-product {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 2.1fr 0.8fr;
        padding: 16px 8px;
        height: 112px;
        border-bottom: 1px solid var(--Primary-Primary-10, #E6E6E6);
    }

    .cart-product .product-img {
        display: grid;
        padding-right: 24px;
        height: 112px;
        width: 74px;
        overflow: hidden;
    }

    .cart-product .product-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / 3;
        height: fit-content;
        padding: 24px;
        background: var(--Surfaces, #FFF);
    }

    .cart-conteiner {
        display: grid;
        grid-column: 2/12;
    }

    .sender-zakaz {
        display: flex;
        width: auto;
        height: 40px;
        padding: 0 16px 0 22px;
        align-items: center;
        gap: 16px;
        flex-shrink: 0;
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-family: "Ubuntu Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        border: none;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        right: 0;
    }

    .tabs-content .blog-item .blog-img {
        display: grid;
        grid-template-columns: 2.1fr;
        grid-column: 1 / 4;
        padding-right: 82px;
        height: 100%;
        margin-right: 0px;
    }

    .item-info {
        display: grid;
        grid-column: 4/-1;
        margin: 0;
        margin-left: 0px;
        margin-left: 0px;
        margin-left: -50px;
    }

    .map-wrapper #map {
        display: grid;
        height: 800px;
        grid-column: 1 / 9;
        width: calc(100%);
    }

    .map-wrapper .select-country {
        display: grid;
        height: 800px;
        grid-column: 9 / 12;
        grid-template-rows: 30px auto;
        padding-left: 32px;
    }

    .department h5 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        margin: 0;
        margin-bottom: 0px;
        margin-bottom: 12px;
        letter-spacing: 0.16px;
    }

    .contact-belarus {
        display: grid;
        grid-template-columns: repeat(10, 1fr);
        grid-column: 1 / 7;
        grid-row: 2 / 3;
    }

    .preText {
        display: grid;
        grid-column: 1/6;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        gap: 4px;
        letter-spacing: 0.16px;
        margin-bottom: 24px;
    }

    .contact-belarus .departments,
    .contact-russia .departments {
        display: grid;
        grid-column: 1/4;
    }

    .contact-belarus .ved {
        display: grid;
        grid-column: 5/10;
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / 3;
        height: fit-content;
        padding: 20px;
        background: var(--Surfaces, #FFF);
    }

   /* Общие стили для всех .value в фильтрах */
#category .value,
#color .value,
#size .value {
    display: flex;
    height: 44px;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Secondary, #808080);
}

/* Стили для category и color */
#category .value,
#color .value {
    padding: 0 16px;
    justify-content: flex-start;
    background: var(--Background, #F2F2F2);
    flex-basis: 47%;
    flex: 1 0 0;
}

/* Стили для size */
#size .value {
    flex-basis: 47.5%;
    /* padding и background не заданы — остаются по умолчанию */
}

/* Последний элемент в size — на всю ширину */
#size .value:last-child {
    flex-basis: 100%;
}

/* Стили для label внутри .value (например, в radio/checkbox) */
.value label {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 16px;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    border: none;
    background: var(--Background, #F2F2F2);
}

    .buttons404 .cat,
.buttons404 .ind {
    display: flex;
    height: 44px;
    padding: 0 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
.buttons404 .cat {
    background: var(--Primary, #0D0D0D);
    border: none;
    margin-bottom: 16px;
}

.buttons404 .ind {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}

/* Общие стили для ссылок внутри */
.buttons404 .cat a,
.buttons404 .ind a {
    font-family: "Segoe UI";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
    text-decoration: none;
    text-transform: uppercase;
}

/* Цвета текста */
.buttons404 .cat a {
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
}

.buttons404 .ind a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

    .personal-content.active form input {
        display: flex;
        height: 40px;
        padding: 0px 12px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

}

@media screen and (min-width: 1280px) and (max-width: 1439px) {
    a.opt-price {
        background-color: white;
        color: black;
        border: solid 1px black;
        font-weight: 600;
        height: 38px;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-left: 8px;
        padding: 0 24px;
    }

    a.more {
        background-color: black;
        color: white;
        border: solid 1px black;
        height: 38px;
        font-weight: 600;
        font-size: 12px;
        line-height: 12px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50%;
        margin-right: 8px;
        padding: 0 24px;
    }

    footer {
        border-top: solid 1px black;
        display: grid;
        grid-column: 1 / span 12;
        grid-row: 6 / 7;
        grid-template-columns: repeat(12, 1fr);
        top: 58px;
        position: relative;
        align-items: flex-start;
    }

    .footer-block.first {
        display: grid;
        grid-column: 2 / 3;
        height: 100%;
    }

    .first .social {
        display: grid;
        grid-template-columns: repeat(4, auto);
        gap: 12px;
    }

    .social-with-copiryght {
        display: grid;
    }

    .first .social a svg {
        width: 16px;
        height: 16px;
    }

    .copyright {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
        align-self: end;
    }

    footer .city {
        margin: 0;
        margin-bottom: 8px;
    }

    /* Общие стили для текстовых блоков в .city */
.city .country-city,
.city .address {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin: 0;
}

.city .country-city {
    margin-bottom: 2px;
}

/* Стили для .mail (если содержит иконку + ссылку) */
.city .mail {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 12px;
    margin: 0;
    text-decoration: none;
    display: flex; /* оставить, если есть иконка */
}

.city .mail a {
    color: inherit; /* наследует цвет от родителя */
    text-decoration: none;
    /* остальное наследуется */
}

/* Стили для .opt */
.opt h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin: 0 0 4px 0;
}

.opt p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    margin: 0 0 2px 0;
}

.opt p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 400; /* только это отличается от родителя */
    text-decoration: none;
}

/* Стили для вторичного текста */
.opt p span,
.opt span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
}

    .footer-block.second {
        display: grid;
        grid-column: 8 / 12;
        grid-template-columns: auto auto;
        justify-content: space-between;
    }

    .footer-block.third {
        display: grid;
        grid-column: 10/13;
    }

    .little-menu {
        display: grid;
        grid-column: 1 / 8;
        grid-auto-flow: column;
        justify-content: stretch;
        padding-left: 24px;
        padding-top: 32px;
    }

    .lm-block h4 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 12px;
    }

    .lm-block ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .lm-block ul li {
        display: flex;
        height: 24px;
        align-items: center;
        flex-shrink: 0;
        align-self: stretch;
    }

   .lm-block ul li a {
    color: var(--Tertiary-BTN-Typography, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.13px;
    width: 100%;
    text-decoration: none;
    cursor: pointer; /* улучшает UX */
}

.lm-block ul li a:hover {
    color: var(--Typography-Typography-Secondary, #808080);
}

    .product-wrapper {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: calc(28px + 44px + 64px + 18px);
        grid-column: 1/ -1;
        grid-row: 5/6;
    }

    .gallery-wrapper {
        display: grid;
        grid-column: 1/8;
        grid-template-columns: repeat(2, 1fr);
    }

    .mobile-gallery-wrapper {
        display: none;
    }

    .progress {
        display: none;
    }

    .gallery-with-other {
        display: grid;
        grid-column: 1 / 8;
        grid-template-rows: auto auto;
        align-items: start;
        justify-content: start;
        border-right: 1px solid black;
    }

    .info-wrapper {
        grid-column: 8 / -1;
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 40px;
    }

    .product-like {
        background-repeat: no-repeat;
        background-position: center;
        height: 24px;
        width: 24px;
        margin-left: 32px;
        padding: 6px;
    }

    .inputs label {
        display: flex;
        flex-direction: row;
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
        margin-right: 0;
        background: var(--Background, #F2F2F2);
        border: 0.5px solid var(--Secondary, #808080);
        gap: 8px;
    }

    .inputs label[for=all] {
        display: flex;
        flex-direction: row;
        padding: 0 16px;
        height: 42px;
        width: 100%;
        justify-content: center;
        align-items: center;
        background: var(--Background, #F2F2F2);
        border: 0.5px solid var(--Secondary, #808080);
        gap: 0px;
        margin-right: 0;
    }

    /* Общие стили для кнопок +/- */
.unit #minus,
.unit #plus {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    border: none;
    padding: 0;
    margin: 0;
    background: #f2f2f2; /* ← добавлен общий фон для согласованности */
    cursor: pointer;
}

/* Состояния для кнопок */
.unit #minus:hover,
.unit #plus:hover {
    /* Нет визуальных изменений → можно оставить пустым */
    /* Если нужен эффект — добавь background: #e0e0e0; */
}

.unit #minus:active,
.unit #plus:active {
    background: #838383;
    outline: 0;
}

.unit #minus:disabled,
.unit #plus:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

/* Стили для input */
.unit #unitInput {
    display: flex;
    width: 40px;
    height: 38px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    border: none;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    font-family: inherit;
    font-size: 14px;
    color: inherit;
}

.unit #unitInput:focus-visible {
    outline: none;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

.unit #unitInput:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

    #addZak {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 24px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Color-White-100, #F2F2F2);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: none;
    cursor: pointer; /* ← улучшает UX */
}

#addZak:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
}

    .with-this-product h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 0 40px;
        margin-top: 32px;
    }

    .title-with-price {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 85%;
    }

    .title-with-price h2 {
        color: var(--Color-Black-100, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .price {
        color: var(--Color-Black-100, #0D0D0D);
        text-align: right;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.36px;
        margin: 0;
        display: grid;
        grid-column: 2 / 8;
        text-transform: uppercase;
    }

    .cart-product {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 3fr 1fr;
        padding: 16px 8px;
        height: 108px;
        border-bottom: 1px solid var(--Primary-Primary-10, #E6E6E6);
    }

    .cart-product .product-img {
        display: grid;
        padding-right: 32px;
        height: 108px;
        width: 72px;
        overflow: hidden;
    }

    .cart-product .product-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .cart-product .product-description .title {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.48px;
        display: grid;
        grid-column: 1 / 5;
        margin: 0;
        margin-bottom: 8px;
    }

    .cart-empty a {
        display: flex;
        width: 423px;
        height: 44px;
        padding: 0 16px 0 22px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .cart-product .product-description .description {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        display: grid;
        grid-column: 1 / 5;
    }

    .product-description .rost-title {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
    }

    .product-description .size-item {
        display: grid;
        width: 100%;
        height: 24px;
        justify-content: center;
        align-items: center;
        gap: 4px;
        aspect-ratio: 1 / 1;
        background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        align-content: center;
        text-align: center;
        justify-items: center;
        justify-content: center;
    }

    .price_info .fullprice {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: right;
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.48px;
        margin: 0;
        margin-bottom: 8px;
    }

    .price_info .subinfo {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.12px;
        margin: 0;
        margin-bottom: 16px;
    }

    .product-option .variant {
        display: grid;
        padding: 9.5px 0;
        grid-column: 1 / -1;
        align-items: center;
        grid-template-columns: 32px 1fr 1fr 100px 1fr 32px;
        border-bottom: 0.5px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
    }

    .sender-zakaz {
        display: flex;
        width: auto;
        height: 40px;
        padding: 0 16px 0 22px;
        align-items: center;
        gap: 16px;
        flex-shrink: 0;
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-family: "Ubuntu Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        border: none;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        right: 0;
    }

    /* Общие стили для всех .value в фильтрах */
#category .value,
#color .value,
#size .value {
    display: flex;
    height: 44px;
    padding: 0 16px;
    align-items: center;
    gap: 8px;
    border: 0.5px solid var(--Secondary, #808080);
    flex-basis: 47%;
}

/* Стили для category и color */
#category .value,
#color .value {
    justify-content: flex-start;
    background: var(--Background, #F2F2F2);
    flex: 1 0 0;
}

/* Стили для label внутри .value (например, radio/checkbox) */
.value label {
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 16px;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    border: none;
    background: var(--Background, #F2F2F2);
}

    .with-this-product {
        display: grid;
        grid-column: 1 / 8;
        align-self: end;
        border-right: 1px solid black;
    }

    .map-wrapper #map {
        display: grid;
        height: 800px;
        grid-column: 1 / 9;
        width: calc(100% - 32px);
    }

    .map-wrapper .select-country {
        display: grid;
        height: 800px;
        grid-column: 9 / 12;
        grid-template-rows: 30px auto;
    }

    

    .contact-belarus {
        display: grid;
        grid-template-columns: repeat(10, 1fr);
        grid-column: 1 / 7;
        grid-row: 2 / 3;
    }

    .preText {
    display: grid;
    grid-column: 1 / 6; /* ← финальное значение (последнее в твоём коде) */
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    gap: 4px;
    letter-spacing: 0.16px;
    margin-bottom: 24px;
}

    .contact-belarus .departments,
    .contact-russia .departments {
        display: grid;
        grid-column: 1/4;
    }

    .contact-belarus .ved {
        display: grid;
        grid-column: 5/10;
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / 3;
        height: fit-content;
        padding: 16px;
        background: var(--Surfaces, #FFF);
    }

    .tabs-content .blog-item .blog-img {
        display: grid;
        grid-template-columns: 2fr;
        grid-column: 1 / 4;
        padding-right: 32px;
    }

    .item-info {
        display: grid;
        grid-column: 4/-1;
        margin: 0;
        margin-left: 32px;
    }

    .buttons404 .cat {
        display: flex;
        height: 40px;
        padding: 0px 16px;
        justify-content: center;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        background: var(--Primary, #0D0D0D);
        border: none;
        width: 100%;
        margin-bottom: 16px;
    }

    .buttons404 .cat a {
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .buttons404 .ind {
        display: flex;
        height: 40px;
        padding: 0px 16px;
        justify-content: center;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        width: 100%;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
    }

    .buttons404 .ind a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .personal-form form .fio-block-personal {
        display: grid;
        grid-column: 1 / -1;
        gap: 12px;
        grid-auto-flow: column;
        align-items: center;
        justify-content: stretch;
        margin: 0;
        margin-bottom: 16px;
    }

    .personal-content.active form input {
        display: flex;
        height: 40px;
        width: calc(100% - 24px);
        padding: 0px 12px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .personal-form form .yur_deat_block {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: stretch;
        gap: 12px;
        margin-bottom: 40px;
    }

    .personal-form form .yur_address_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        gap: 12px;
        margin-bottom: 40px;
    }

    .personal-form form .contacts_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
        margin-bottom: 40px;
    }

    .personal-form .button-block {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / -1;
        gap: 12px;
    }
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
    header {
        display: grid;
        grid-column: 1/13;
        grid-template-rows: 28px auto;
        background: #F2F2F2;
    }

    a.backer {
        text-decoration: none;
    }

    .bottom-header {
        display: none;
    }

    .bottom-mobile-header {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-row: 2 / 3;
        width: 100%;
        background: var(--Background, #F2F2F2);
        border-bottom: 1px black solid;
        height: 60px;
        position: fixed;
        z-index: 1;
    }

    .first-header-block {
        display: grid;
        grid-column: 1 / 2;
        grid-auto-flow: column;
        align-items: center;
        justify-content: start;
    }

    .hamburger {
        border: none;
        background: transparent;
    }

    #mobSearchButton {
        border: none;
        background: transparent;
        display: grid;
        align-self: center;
        justify-self: center;
    }

    #searchForm {
        display: none;
    }

    #searchFormMobile {
        display: none;
    }

    #searchFormMobile.active {
        display: flex;
        position: absolute;
        left: 0px;
        height: 100%;
        background-color: white;
        width: 100%;
        z-index: 1;
    }

    #searchFormMobile.active input {
    width: 96%;
    padding: 0 1%;
    border: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    -webkit-appearance: none;
    box-sizing: border-box;
}

#searchFormMobile.active input:focus {
    outline: none;
}

#searchFormMobile.active input::placeholder {
    color: var(--Typography-Typography-Primary, #0D0D0D); /* или другой цвет для placeholder */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.search-results {
    display: none;
    padding: 15px;
    text-align: left;
    background: #F3F3F3;
    border: thin solid #ccc;
    position: absolute;
    top: 60px;
    width: 100%;
}

   #searchFormMobile.active input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    background: url(/assets/template/main/images/clear.svg) center center no-repeat;
}

#searchFormMobile.active input::-webkit-search-cancel-button:hover {
    background-image: url(/assets/template/main/images/typehover.svg);
}

    .mobile-logo {
        display: grid;
        grid-column: 2/3;
        align-items: center;
        justify-content: center;
    }

    .third-header-block {
        display: grid;
        grid-column: 3/-1;
    }

    .third-header-block .personal {
        display: grid;
        align-items: center;
        justify-content: center;
    }

    .collection-description {
        display: grid;
        grid-column: 1 / 7;
        grid-row: auto / -1;
        flex-direction: column;
        position: relative;
        justify-content: stretch;
        background: transparent;
        padding: 24px;
        padding-bottom: 64px;
        padding-top: 0px;
        padding-right: 0px;
    }

    .collection-description h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 24px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.72px;
        margin: 0;
        margin-bottom: 12px;
    }

    .collection-description p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
        margin: 0;
        margin-bottom: 24px;
    }

    /* Общие стили для обеих ссылок-кнопок */
a.more,
a.opt-price {
    height: 44px;
    font-weight: 600;
    font-size: 12px;
    line-height: 12px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    padding: 0 24px;
    font-family: inherit; /* ← наследует шрифт от родителя */
    text-decoration: none; /* ← убирает подчёркивание ссылки */
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
a.more {
    background-color: black;
    color: #F2F2F2;
    border: 1px solid black;
    margin-right: 8px;
}

a.opt-price {
    background: var(--Background, #F2F2F2);
    color: black;
    border: 1px solid var(--Primary, #0D0D0D);
    margin-left: 8px;
}

    .mobile-container {
        display: grid;
        grid-template-rows: auto 1fr;
    }

    .main-menu.hidden {
        display: none;
    }

    .submenu {
        display: none;
    }

    .submenu.loaded {
        display: block;
    }

    .top-mobile {
        padding: 16px;
        background-color: #f2f2f2;
        display: flex;
        align-items: center;
    }

    .mobile_menu_overlay,
    .mobile_menu_container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
    }

    .mobile_menu_overlay {
        display: none;
        cursor: pointer;
        z-index: 10200;
        background: rgba(0, 0, 0, 0);
    }

    .mobile_menu_container {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        width: 42%;
        overflow: hidden;
        z-index: 10201;
        background: #F2F2F2;
        transition: all 200ms;
    }

    .mobile_menu_container.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        height: calc(100vh - 60px);
        top: 61px;
        overflow-y: scroll;
    }

    /* Стили для кнопки "Назад" */
    .mobile_menu_container ul li a.back {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        height: 52px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile_menu_container .mobile_menu_content {
        overflow: auto;
        max-height: 100%;
    }

    .mobile_menu_container ul {
        margin: 0;
        padding: 0;
    }

    .mobile_menu_container ul li {
        list-style: none;
        display: flex;
        height: 52px;
        padding: 0px 16px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
        transition: all 200ms;
        text-transform: uppercase;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile_menu_container ul li a {
        display: flex;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .mobile_menu_container ul li a.parent {
        padding-right: 50px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.56614 2.82701C5.28659 3.06663 5.25421 3.48749 5.49383 3.76704L9.12195 7.99985L5.49383 12.2327C5.25421 12.5122 5.28659 12.9331 5.56614 13.1727C5.84569 13.4123 6.26656 13.3799 6.50617 13.1004L10.8781 7.99985L6.50617 2.89932C6.26656 2.61977 5.84569 2.5874 5.56614 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
    }

    .mobile_menu_container ul li a.back {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
    }

    .mobile_menu_container ul li a:hover {
        background: #fff;
    }

    .mobile_menu_container ul li ul {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255);
        z-index: 2;
        transition: all 200ms;
    }

    .personal-mobile-menu ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
        display: grid;
        grid-auto-flow: column;
        align-items: center;
        justify-content: start;
        width: 100%;
    }

    .mobile_menu_container ul li ul.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }

    .bottom-content {
        padding: 16px;
        border-top: 1px solid #ddd;
        position: absolute;
        bottom: 0;
        width: 100%;
        background: #fff;
    }

    /* Скрываем основное меню */
    .main-menu.hidden {
        display: none;
    }

    /* Скрываем все подменю по умолчанию */
    .submenu {
        display: none;
    }

    /* Показываем активное подменю */
    .submenu.loaded {
        display: block;
    }

    .top-mobile {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .top-list {
        display: none;
    }

    .top-list-mobile {
        list-style: none;
        display: flex;
        align-items: center;
        font-size: 14px;
    }

    .top-list-mobile a {
        font-size: 0
    }

    .top-list-mobile a::after {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Форма подписки */
    .bottom-content {
        position: relative;
        /* bottom: 0; */
        left: 0;
        width: 100%;
        background: #f2f2f2;
        padding: 0;
        box-sizing: border-box;
        border-top: none;
    }

    .bottom-content .subscribe {
        display: grid;
        padding: 24px 16px;
    }

    .subscribe form {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .subscribe input[type="email"] {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        border: none;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .subscribe button[type="submit"] {
        display: flex;
        padding: 10px;
        background: #0D0D0D;
        color: #fff;
        height: 44px;
        border: none;
        border-radius: 0;
        cursor: pointer;
        margin-bottom: 8px;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 0 16px;
    }

    .subscribe input[type="submit"]:hover {
        background: #333;
    }

    .subscribe p {
        font-size: 14px;
        color: #555;
        margin: 0;
    }

    .burger {
        position: relative;
        border: none;
        background: transparent;
        width: 40px;
        height: 26px;
        margin-left: 2%
    }

   
    .personalMobile {
        display: grid;
        grid-auto-flow: column;
        list-style: none;
        align-items: center;
        justify-content: end;
        padding: 0;
        margin: 0;
        margin-right: 20px;
    }

    .personalMobile li {

        display: grid;
        height: 44px;
        width: 44px;
        align-items: center;
        justify-content: center;

    }

   
    .desctop {
        display: none;
    }

    .tablet-mobile {
        top: 58px;
        display: grid;
        padding: 0;
        margin: 0;
        grid-column: 1/ -1;
        grid-template-columns: 1fr;
    }

    .accardion-container {
        display: grid;
    }

    .tablet-mobile button.accardion-footer {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-auto-flow: column;
        padding: 14px 24px;
        border-radius: 0;
        border: 0;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .tablet-mobile button.accardion-footer:after {
        content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.99935 2.66667C8.36754 2.66667 8.66602 2.96515 8.66602 3.33334V7.33334H12.666C13.0342 7.33334 13.3327 7.63181 13.3327 8C13.3327 8.36819 13.0342 8.66667 12.666 8.66667H8.66602V12.6667C8.66602 13.0349 8.36754 13.3333 7.99935 13.3333C7.63116 13.3333 7.33268 13.0349 7.33268 12.6667V8.66667H3.33268C2.96449 8.66667 2.66602 8.36819 2.66602 8C2.66602 7.63181 2.96449 7.33334 3.33268 7.33334H7.33268V3.33334C7.33268 2.96515 7.63116 2.66667 7.99935 2.66667Z" fill="%230D0D0D"/></svg>');
        font-size: 16px;
        height: 16px;
        width: 16px;
        color: #0D0D0D;
        float: right;
        margin-left: 5px;
    }

    .bottom-block {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 24px 32px 32px 24px;
    }

    
    .tablet-mobile ul {
        padding: 0px 7px;
        margin: 0;
        list-style: none;
        text-decoration: none;
        background: #f2f2f2;
    }

    .tablet-mobile ul li {
        display: flex;
        height: 44px;
        align-items: center;
        gap: 8px;
        align-self: stretch;
    }

    .tablet-mobile ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
        text-decoration: none;
    }

    .bottom-block .left {
        display: grid;

        align-items: start;
        justify-content: start;
    }

    .bottom-block .left .copiryght {
        display: grid;
        align-self: end;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
        margin-top: 32px;
    }

    .bottom-block .right .title,
    .bottom-block .left .title {
        margin: 0;
        margin-bottom: 4px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
    }

    .bottom-block .first-block {
        margin: 0;
        margin-bottom: 16px;
    }

    .opt p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 11px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.11px;
    }

    .accardion-item {
        padding: 0 18px;
        background-color: #f2f2f2;
        display: none;
        overflow: hidden;
    }

    .breadcrumbs {
        height: 60px;
        display: grid;
        position: fixed;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, 1fr);
        grid-row: 3 / 4;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid black;
        width: 100vw;
        z-index: 1;
        background: var(--Background, #F2F2F2);
        border-top: 1px solid black;
    }

    .wrapper-search {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(28px + 34px);
        width: 100%;
        grid-row: 5/6;
        grid-column: 1/ -1;
        z-index: 0;
    }

    .wrapper {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(167px);
        width: 100%;
        grid-row: 5 / 6;
        grid-column: 1 / -1;
        z-index: 0;
        min-height: 100%;
    }

    .fullscreen-filter.opened {
        display: flex;
        position: fixed;
        top: -91px;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, 0.2);
        z-index: 3;
    }

    .filter-container.filterActive {
        background-color: #F2F2F2;
        display: flex;
        flex-direction: column;
        width: 50%;
        z-index: 1;
        position: fixed;
        height: 100vh;
        top: -122px;
        bottom: 0;
        border-right: 1px solid #0d0d0d;
        transform: translateX(0);
        z-index: 2;
    }

    .descr {
        position: relative;
        display: flex;
        width: 100%;
        align-items: start;
        flex-direction: column;

        justify-content: center;
        bottom: 0;
        height: 52px;
    }

    .product-cart a {
        color: black;
        text-decoration: none;
        position: relative;
        z-index: 1;
    }

    .title-price {
        display: grid;
        grid-auto-flow: row;
        justify-content: space-between;
        width: 100%;
    }

    .like {
        display: grid;
        justify-self: end;
        position: relative;
        
        height: 50px;
        width: 50px;
        bottom: 0px;
        top: 0%;
        right: 0px;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
    }

    .ajax-item .like {
        display: none;
        position: absolute;
       
        height: 16px;
        width: 18px;
        bottom: 0px;
        top: 24px;
        right: 24px;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
    }

    .title-like .like.is-actived {
        display: grid;
        justify-self: end;
        position: relative;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M20.28 4.74017C19.7387 4.19231 19.0941 3.75734 18.3834 3.46047C17.6727 3.16361 16.9102 3.01074 16.14 3.01074C15.3699 3.01074 14.6074 3.16361 13.8967 3.46047C13.186 3.75734 12.5414 4.19231 12 4.74017C11.4587 4.19231 10.8141 3.75734 10.1034 3.46047C9.39273 3.16361 8.63022 3.01074 7.86004 3.01074C7.08987 3.01074 6.32735 3.16361 5.61669 3.46047C4.90603 3.75734 4.26136 4.19231 3.72004 4.74017C2.62444 5.85159 2.01025 7.34953 2.01025 8.91017C2.01025 10.4708 2.62444 11.9687 3.72004 13.0802L11.29 20.7002C11.383 20.7939 11.4936 20.8683 11.6155 20.9191C11.7373 20.9698 11.868 20.996 12 20.996C12.1321 20.996 12.2628 20.9698 12.3846 20.9191C12.5065 20.8683 12.6171 20.7939 12.71 20.7002L20.28 13.0802C21.3829 11.9726 22.0021 10.4732 22.0021 8.91017C22.0021 7.34714 21.3829 5.84777 20.28 4.74017Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        height: 50px;
        width: 50px;
        bottom: 0;
        top: 0;
        right: 0;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
    }

    .like-mobile {
        position: absolute;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.24099 2.67482L5.25095 2.6748C6.28206 2.68106 7.26924 3.09195 8.00017 3.81861C8.35873 3.45871 8.78442 3.17254 9.2532 2.97638C9.72841 2.77752 10.2384 2.67511 10.7536 2.67511C11.2687 2.67511 11.7787 2.77752 12.2539 2.97638C12.7286 3.17501 13.1591 3.46593 13.5205 3.83223C14.2552 4.57055 14.6677 5.5698 14.6677 6.61146C14.6677 7.65342 14.255 8.65295 13.5198 9.39133C13.5196 9.39153 13.5194 9.39173 13.5192 9.39193L8.4735 14.4777C8.34832 14.6038 8.17796 14.6748 8.00023 14.6748C7.82251 14.6748 7.65215 14.6038 7.52697 14.4777L2.48058 9.39127C2.48049 9.39118 2.48067 9.39137 2.48058 9.39127C1.93446 8.84136 1.56238 8.14232 1.41141 7.38214C1.26042 6.62183 1.33705 5.83388 1.63172 5.11692C1.92638 4.39996 2.42599 3.78584 3.06799 3.35145C3.70999 2.91706 4.46587 2.68169 5.24099 2.67482ZM5.24784 4.00815C4.73677 4.01366 4.23855 4.16929 3.81518 4.45575C3.39044 4.74314 3.0599 5.14943 2.86496 5.62377C2.67001 6.0981 2.61931 6.61941 2.7192 7.12242C2.8191 7.62543 3.06515 8.0878 3.42656 8.45164L8.00023 13.0616L12.5746 8.45099C13.0612 7.96245 13.3344 7.301 13.3344 6.61146C13.3344 5.92192 13.0612 5.26047 12.5746 4.77193L12.5721 4.76944C12.3345 4.52841 12.0514 4.337 11.7392 4.20636C11.427 4.07572 11.092 4.00844 10.7536 4.00844C10.4151 4.00844 10.0801 4.07572 9.7679 4.20636C9.45571 4.337 9.17261 4.5284 8.93504 4.76943L8.92919 4.77538C8.79161 4.91151 8.67168 5.06438 8.57229 5.23047C8.4519 5.43164 8.23468 5.55479 8.00023 5.55479C7.76579 5.55479 7.54857 5.43164 7.42818 5.23047C7.32879 5.06438 7.20889 4.91147 7.07132 4.77534L7.06815 4.77221C6.58538 4.28806 5.9314 4.0136 5.24784 4.00815Z" fill="%230D0D0D"/></svg>');
        height: 17px;
        width: 16px;
        bottom: 24px;
        /* top: 91%; */
        right: 24px;
        z-index: 2;
    }

    .like-mobile.is-actived {
        position: absolute;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="18" viewBox="0 0 20 18" fill="none"><path d="M18.2796 1.74017C17.7382 1.19231 17.0936 0.757343 16.3829 0.460475C15.6722 0.163606 14.9097 0.0107422 14.1396 0.0107422C13.3694 0.0107422 12.6069 0.163606 11.8962 0.460475C11.1855 0.757343 10.5409 1.19231 9.99955 1.74017C9.45824 1.19231 8.81357 0.757343 8.1029 0.460475C7.39224 0.163606 6.62973 0.0107422 5.85955 0.0107422C5.08938 0.0107422 4.32686 0.163606 3.6162 0.460475C2.90554 0.757343 2.26087 1.19231 1.71955 1.74017C0.623954 2.85159 0.00976562 4.34953 0.00976562 5.91017C0.00976563 7.47081 0.623954 8.96875 1.71955 10.0802L9.28955 17.7002C9.38252 17.7939 9.49312 17.8683 9.61498 17.9191C9.73684 17.9698 9.86754 17.996 9.99955 17.996C10.1316 17.996 10.2623 17.9698 10.3841 17.9191C10.506 17.8683 10.6166 17.7939 10.7096 17.7002L18.2796 10.0802C19.3824 8.97257 20.0016 7.47319 20.0016 5.91017C20.0016 4.34714 19.3824 2.84777 18.2796 1.74017Z" fill="%230D0D0D"/></svg>');
        height: 18px;
        width: 20px;
        bottom: 24px;
        top: 15px;
        right: 24px;
        z-index: 2;
    }

    .like.is-actived {

        position: absolute;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="18" viewBox="0 0 20 18" fill="none"><path d="M18.2796 1.74017C17.7382 1.19231 17.0936 0.757343 16.3829 0.460475C15.6722 0.163606 14.9097 0.0107422 14.1396 0.0107422C13.3694 0.0107422 12.6069 0.163606 11.8962 0.460475C11.1855 0.757343 10.5409 1.19231 9.99955 1.74017C9.45824 1.19231 8.81357 0.757343 8.1029 0.460475C7.39224 0.163606 6.62973 0.0107422 5.85955 0.0107422C5.08938 0.0107422 4.32686 0.163606 3.6162 0.460475C2.90554 0.757343 2.26087 1.19231 1.71955 1.74017C0.623954 2.85159 0.00976562 4.34953 0.00976562 5.91017C0.00976563 7.47081 0.623954 8.96875 1.71955 10.0802L9.28955 17.7002C9.38252 17.7939 9.49312 17.8683 9.61498 17.9191C9.73684 17.9698 9.86754 17.996 9.99955 17.996C10.1316 17.996 10.2623 17.9698 10.3841 17.9191C10.506 17.8683 10.6166 17.7939 10.7096 17.7002L18.2796 10.0802C19.3824 8.97257 20.0016 7.47319 20.0016 5.91017C20.0016 4.34714 19.3824 2.84777 18.2796 1.74017Z" fill="%230D0D0D"/></svg>');
        height: 18px;
        width: 20px;
        bottom: 0px;
        top: 24px;
        right: 24px;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
        background-repeat: no-repeat;
        background-position: center;
    }

    .descr .title,
.descr .price {
    margin: 0;
    padding-left: 24px;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-style: normal;
    line-height: 100%;
    text-transform: uppercase;
    text-decoration: none;
}

/* Специфичные стили */
.descr .title {
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.36px;
}

.descr .price {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.3px;
    text-align: left — не нужно, это значение по умолчанию
}

    ul.breadcrumb {
        display: none;
    }

    .mobile-crumbs {
        width: 100%;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        grid-column: 1 / -1;
        padding: 0;
    }

    .mobile-crumbs h2 {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-align: right;
        margin: 0;
        margin-right: 16px;
    }

    .mobile-crumbs .sf_h1 {
        display: grid;
        grid-column: 1 / 12;
        grid-row: 6 / 7;
        position: relative;
        top: 0;
        font-size: 17px;
    }

    .mobile-crumbs .mobile-title {
        display: grid;
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        grid-auto-flow: column;
        margin-left: 16px;
        align-items: center;
        justify-content: start;
    }

   .mobile-crumbs .pagetitle,
.mobile-crumbs .pagetitle a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.mobile-crumbs .pagetitle a {
    text-decoration: none;
}

    .mobile-crumbs .allmodels {
        color: var(--Typography-Typography-Secondary, #808080);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .mobile-crumbs .mobile-title {
        display: grid;
        grid-column: 1 / 2;
        margin-left: 32px;
    }

    .mobile-crumbs .mobile-category {
        display: grid;
        grid-column: 2 / -1;
        justify-content: end;
        align-items: center;
        margin-right: 32px;
    }

    .mobile-crumbs .mobile-category a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-decoration: none;
    }

    .button-container {
        display: grid;
        grid-column: 1 / 2;
        grid-auto-flow: column;
        align-items: center;
        justify-content: center;
    }

    .chips {
        display: none;
    }

    .product-wrapper {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: calc(28px + 44px + 64px + 14px);
        grid-column: 1/ -1;
        grid-row: 5/6;
    }

    .gallery-with-other {
        display: grid;
        grid-column: 1 / 13;
        grid-template-rows: auto auto;
        align-items: start;
        justify-content: start;
        border-right: 1px solid black;
        margin-bottom: 32px;
    }

    .back {
        display: grid;
        grid-column: 1 / 2;
        height: 60px;
    }

    .info-wrapper {
        grid-column: 1 / -1;
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 40px;
    }

    .with-this-product {
        display: grid;
        grid-column: 1 / -1;
        align-self: end;
        border-right: 1px solid black;
    }

    .gallery-wrapper {
        display: none;
    }

    .mobile-gallery-wrapper {
        display: grid;
    }

    .mobile-gallery-wrapper.single-slide a {
        display: grid;

    }

    .mobile-gallery-wrapper.single-slide a img {
        display: grid;
        grid-column: 1 / -1;
        height: auto;
        width: 100%;
    }

    .mobile-gallery-wrapper.slick-initialized .slick-slide {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }

    .mobile-gallery-wrapper .slick-slide img {
        display: block;
        width: 50vw;
    }

    .progress {
        display: flex;
        margin: 0 16px;
        bottom: 18px;
        height: 2px;
        overflow: hidden;
        background-color: #f5f5f5;
        background-image: linear-gradient(to right, black, black);
        background-repeat: no-repeat;
        background-size: 0 100%;
        transition: background-size .4s ease-in-out;
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
    }

    .info-wrapper {
        grid-column: 1 / -1;
        grid-template-columns: 16px repeat(10, 1fr) 16px;
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 0px;
    }

    .product-head {
        display: grid;
        grid-auto-flow: column;
        grid-column: 2 / 12;
    }

    .subtitle {
        display: grid;
        grid-column: 2 / 12;
        grid-template-columns: repeat(5, 1fr);
        grid-row: 2 / 4;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .upLine {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: minmax(max-content, 1px) 1fr;
        align-items: center;
        justify-content: stretch;
        gap: 8px;
        margin-bottom: 40px;
        grid-column: 1 / -1;
    }

    .tabProduct {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-auto-flow: column;
        align-items: start;
        justify-content: stretch;
        gap: 8px;
        margin-bottom: 8px;
        grid-column: 1 / 5;
    }

    ./* Основное состояние */
.tablinksProduct {
    display: grid;
    align-items: center;
    justify-self: stretch;
    height: 44px;
    padding: 8px 16px;
    border: none;
    background: #f2f2f2;
    border-bottom: 2px solid #f2f2f2;
    cursor: pointer;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
}

/* Hover — как активное состояние */
.tablinksProduct:hover {
    border-bottom-color: #0D0D0D;
}

/* Active — фиксирует выделение */
.tablinksProduct.active {
    border-bottom-color: #0D0D0D;
}

    .subtitle .tabcontentProduct {
        grid-column: 1 / -1;
    }

    .color-select {
        display: grid;
        flex-direction: column;
        width: 100%;
        margin-bottom: 0;
        grid-column: 2 / 12;
        margin-bottom: 24px;
    }

    .not-auth-block {
        display: grid;
        grid-column: 2 / 12;
        width: 100%;
        grid-template-columns: 1fr 40px;
        gap: 8px;
        margin-bottom: 40px;
        align-items: end;
    }

    .container-grid {
        display: grid;
        grid-column: 2 / 12;
        grid-template-columns: auto 1fr;
        align-items: start;
        width: 100%;
    }

    .size-unit {
        display: grid;
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
        align-self: stretch;
        border-top: none;
        border-bottom: none;
        grid-row: auto;
    }

    .size-unit.with-rost-select {
        grid-column: 3 / 12;
    }

    .size-unit.without-rost-select {
        grid-column: 2 / 12;
    }

    .units {
        display: grid;
        grid-column: 1 / 2;
        width: 100%;
        justify-content: end;
    }

    .table-header-big .units {
        display: grid;
        grid-column: 4;

    }

    .rost-select {
        display: grid;
        grid-column: 2 / 4;
        width: 100%;
        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
        grid-auto-flow: row;
    }

    .rost-select .selects {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        gap: 8px;
        margin-right: 40px;
    }

    .unit {
        display: flex;
        width: 100%;
        flex-direction: column;
        margin-right: 4px;
    }

    .unit .counter {
        display: flex;
        gap: 4px;
    }

    .unit .counter-add {
        display: flex;
        align-items: start;
        justify-content: space-between;
        width: 100%;
        gap: 24px;
    }

   /* Форма и обёртка */
#product-form {
    display: grid;
    grid-column: 1 / -1;
    margin-top: 40px;
    width: 100%;
}

#addZakButton {
    display: grid;
    width: 100%;
}

/* Основное состояние кнопки */
#addZak {
    outline: none;
    display: flex;
    height: 40px;
    width: 100%;
    padding: 0 24px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Color-White-100, #F2F2F2);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
}

/* Disabled — самое приоритетное состояние */
#addZak:disabled {
    width: 100%; /* ← единая ширина */
    padding: 0 24px; /* ← единый padding */
    background: var(--Disable, #B2B2B2);
    color: var(--Typography-Typography-CTA-Disable, #E6E6E6);
    cursor: not-allowed;
}

    .add-to-cart {
        display: flex;
        height: 40px;
        padding: 0px 16px 0px 20px;
        justify-content: space-between;
        align-items: center;
        background: var(--Primary-Primary-100, #0D0D0D);
        color: var(--Typography-Typography-On-Color, #F2F2F2);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        margin-top: 32px;
        border: none;
        margin-bottom: 64px;
    }

    .with-this-product h3 {
        display: none;
    }

    .small-product a {
        display: block;
        position: relative;
        bottom: 0;
        overflow: hidden;
        text-decoration: none;
    }

    .back {
        display: none;
        height: 0px;
    }

    .prices {
        display: none;
    }

    .mobile-prices {
        display: grid;
        grid-column: 1 / 3;
        grid-auto-flow: column;
        grid-template-columns: auto auto;
    }

    .info-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        margin-bottom: 6px;
    }

    .info-wrapper p {
        display: grid;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
        margin: 0;
        margin-bottom: 0px;
    }

    /* Стили для цен */
p.price-one {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

p.old-price {
    color: var(--Typography-Typography-Tertiary, #B2B2B2); /* ← исправлена опечатка */
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.14px;
    text-decoration: line-through; /* ← короткая форма */
    margin: 0;
}

/* Стили для лайка */
.product-like {
    height: 38px;
    width: 38px;
    margin-left: 0;
    position: relative;
    cursor: pointer; /* ← улучшает UX */
}

/* Активное состояние — только если меняется внешний вид */
/* Если иконка меняется — задай background-image здесь */
.product-like.is-active {
    /* Например: */
    /* background-image: url('...'); */
}

    #color {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        margin-bottom: 12px;
    }

    .litle-title h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
    }

    .sizeTable {
        color: var(--Secondary, #808080);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .sizes .litle-title {
        display: grid;
        grid-row: 1 / 2;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .unit h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    #addZak:hover {
        display: flex;
        height: 44px;
        width: 100%;
        padding: 0px 24px;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        background: var(--Primary-40, rgba(13, 13, 13, 0.40));
        color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
    }

    #product-form {
        display: grid;
        position: relative;
        grid-column: 2 / 12;
        margin-top: 40px;
        width: 100%;
    }

    .precart-table.added {
        display: grid;
        grid-column: 1 / 8;
        margin-top: 0px;
    }

    .succes-block {
        margin-bottom: 32px;
        display: none;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: center;
        width: 100%;
        text-align: center;
    }

    .title-with-price {
        display: flex;
        align-items: start;
        flex-direction: column;
        justify-content: start;
        position: relative;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 90%;
        height: 50px;
        margin-top: 15px;
    }

    .title-with-price h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 6px;
    }

    .title-with-price .price {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .partner-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: -3px;
        padding: 0px;
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / 13;
        grid-auto-flow: column;
        height: fit-content;
        padding: 0;
        background: var(--Surfaces, #F2F2f2);
    }

    .blogtab {
        margin-bottom: 0px;
        justify-content: center;
    }

    .blogtab.active {
        background: var(--Primary, #FFF);
        color: #0D0D0D;
    }

    .partner-wrapper .tabs-content {
        display: grid;
        grid-column: 3 / 11;
    }

    .partner-wrapper .blogitems {
        display: grid;

    }

    .partner-wrapper .text-wrapper {
        display: grid;
        grid-column: 3 / 11;
        align-items: start;
        padding-right: 0;
        justify-content: start;
        margin-top: 40px;
        grid-template-rows: repeat(9, max-content);
    }

    .text-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    .partner-wrapper h3 {

        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.2px;
    }

    .partner-wrapper #blog-tab2 h3 {
        display: grid;
        grid-column: 1/ -1;
    }

    .partner-wrapper .text-wrapper p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        margin: 0;
        margin-bottom: 13px;
    }

    .partner-wrapper .form-wrapper {
        display: grid;
        grid-column: 3 / 11;
        height: fit-content;
        padding-left: 0px;
    }

    .partner-wrapper .faq {
        display: grid;
        grid-column: 3 / 11;
        margin-top: 40px;
    }

    .partner-wrapper h6 {

        margin: 0;
        margin-bottom: 16px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.16px;
    }

    .partner-wrapper .answer-block {
        display: grid;
        grid-column: 1 / -1;
    }

    .partner-wrapper button.accardion-footer {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-auto-flow: column;
        padding: 8px 0px;
        border-radius: 0;
        height: 32px;
        border: 0;
        border-top: 1px solid var(--Primary, #E6E6E6);
        border-bottom: 1px solid var(--Primary, #E6E6E6);
        background: var(--Background, #F2F2F2);
        color: var(--Typography-Typography-Primary, #0D0D0D);

        /* Small/Subheader */
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .partner-wrapper .link-container {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        gap: 16px;
        margin-bottom: 40px;
    }

    .link-container a {
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
        color: #0D0D0D;
    }

    .partner-wrapper .about p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.16px;
        margin: 0;
        margin-bottom: 8px;
    }

   .map-wrapper {
    display: grid;
    position: relative;
    top: 83px;
    grid-template-columns: repeat(12, 1fr);
    grid-column: 2 / 12;
    margin-bottom: 64px;
}

/* Блок выбора страны (мобильный) */
.map-wrapper .select-country-mobile {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(10, 1fr);
    grid-auto-flow: column;
    margin-bottom: 32px;
}

.select-country-mobile .buttons {
    display: grid;
    grid-column: 1 / 4;
    grid-auto-flow: column;
}

.buttons .countryGet {
    display: grid;
    height: 44px;
    padding: 8px 0;
    align-items: center;
    border: none;
    background: #f2f2f2;
}

/* Выбор города */
.select-country-mobile .city-select {
    display: none;
}

.select-country-mobile .city-select.grid {
    display: grid;
    grid-column: 4 / -1;
    align-items: center;
    height: 44px;
}

.city-list-select {
    display: grid;
    height: 44px;
    align-items: center;
    justify-content: start;
    padding: 0 16px;
}

/* Карта */
.map-wrapper #map {
    display: grid;
    height: 310px;
    grid-column: 1 / -1;
    width: 100%; /* calc() не нужен */
    margin-bottom: 32px;
}

/* Десктопный выбор страны (скрыт на мобилке) */
.map-wrapper .select-country {
    display: none;
    height: 800px;
    grid-column: 10 / 12;
    grid-template-rows: 30px auto;
}

/* Контейнер магазинов */
.map-wrapper .shops-container {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, 1fr);
}

.map-wrapper .yandexUrl {
    display: none;
}

/* Стили для nice-select (кастомный селект) */
.nice-select.open .list {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1) translateY(0);
    -webkit-transform: scale(1) translateY(0);
    -ms-transform: scale(1) translateY(0);
    height: 355px;
    width: 100%;
    overflow-y: scroll;
    border-radius: 0;
}

/* Заголовок магазинов */
.shops-container h3 {
    display: grid;
    grid-column: 1 / -1;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.45px;
    text-transform: uppercase;
    margin: 0;
}

/* Элемент магазина */
.shops-container .shopItem {
    display: grid;
    align-items: start;
    justify-content: start;
    grid-template-rows: max-content;
    margin: 0 0 12px 0;
}

.shopItem h4 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    margin: 0 0 4px 0;
}

.shopItem .shopDesc p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    margin: 0 0 4px 0;
}

    .cart-conteiner {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
    }

    .cart-wrapper {
        display: grid;
        grid-column: 2 / 12;
        position: relative;
    }

    .cart-wrapper h1 {
        display: none;
    }

    .cart-empty {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
        justify-content: center;
        height: auto;
        padding-top: 40px;
        position: relative;
        top: 122px;
        align-items: center;
        align-self: center;
        justify-self: center;
        margin-bottom: 64px;
    }

    .cart-empty a {
        display: flex;
        width: 423px;
        height: 44px;
        padding: 0 16px 0 22px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .cart-filter {
        display: none;
        grid-template-columns: repeat(12, auto);
        grid-column: 1 / 12;
        align-items: center;
        justify-content: stretch;
        justify-items: stretch;
        text-align: center;
        padding: 64px 0;
    }

    .price_info .info {
        display: none;
    }

    .products-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 1fr;
    }

    .cart-product {
        display: none;
    }

    .cart-product-mobile {
        display: grid;
        grid-template-columns: 1fr;
    }

    .cart-product-mobile .product-top-content {
        display: grid;
        grid-template-columns: 125px auto;
        margin-bottom: 16px;
    }

    .cart-product-mobile .right-mobile-block {
        display: grid;
    }

    .cart-product-mobile .product-title-remove .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 20px;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        align-self: center;
        justify-content: center;
    }

    .cart-product-mobile .descritpion p {
        margin: 0;
    }

    .cart-product-mobile .descritpion span {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
    }

    .cart-product-mobile .product-title-remove {
        display: grid;
        grid-template-columns: 1fr 40px;

    }

    .cart-product-mobile button.remove {
        display: flex;
        height: 36px;
        padding: 0px 8px;
        justify-content: center;
        align-items: center;
        border: none;
    }

    .cart-product-mobile .remove p {
        display: none;
    }

    .cart-product-mobile .description {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
    }

    .sizes .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 8px;
    }

    .sizes .selected-sizes {
        display: grid;
        grid-auto-flow: column;
        align-items: start;
        justify-content: start;
    }

    .selected-sizes div {
        display: flex;
        width: 26px;
        height: 26px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        background: var(--Primary, #0D0D0D);
        color: var(--Typography-Typography-On-Color, #F2F2F2);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.13px;
    }

    .show-hide-mobile {
        display: flex;
        height: 44px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        width: 100%;
        border: none;
        color: var(--Typography-Typography-Secondary, #808080);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        background-color: #f2f2f2;
    }

    .send-button {
        display: grid;
        grid-column: 1 / -1;
        padding-bottom: 80px;
        padding-top: 80px;
    }

    .sender-zakaz {
        display: flex;
        width: 100%;
        height: 52px;
        padding: 0px 24px;
        justify-content: space-between;
        align-items: center;
        flex-shrink: 0;
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        border: none;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        right: 0;
    }

    .personal-wrapper {
        display: grid;
        grid-column: 1/-1;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: 60px;
        margin-top: 64px;
    }

    .personal-tabs {
        display: grid;
        grid-column: 1 / 4;
        align-items: center;
        height: max-content;
    }

    .personal-tabs-content {
        display: grid;
        grid-column: 5 / 12;
        margin-bottom: 90px;
    }

    .personal-content.active {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-column: 1 / -1;
    }

    .wrapperFavorite {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(28px + 15px);
        width: 100%;
        grid-row: 5 / 6;
        grid-column: 1 / -1;
        z-index: 0;
        min-height: min-content;
    }

    .personal-content .subscribe-block {
        display: grid;
        grid-column: 4 / 7;
        grid-template-columns: 1fr;
        grid-row: 2 / 6;
        margin-top: 64px;
    }

    .textPage-wrapper {
        display: grid;
        position: relative;
        grid-column: 3 / 11;
        top: 108px;
        margin-bottom: 80px;
    }

    .textPage-wrapper h1 {
        margin: 0;
        margin-bottom: 24px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 28px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.28px;
    }

    .textPage-wrapper strong {

        margin: 0;
        margin-bottom: 12px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .textPage-wrapper span {
        color: #000;
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .contact-wrapper {
        display: grid;
        grid-template-columns: repeat(10, 1fr);
        grid-column: 2 / 12;
        position: relative;
        top: 108px;
        margin-top: 48px;
    }

    .contact-belarus {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        grid-column: 1 / -1;
        grid-row: 2 / 3;
    }

    .contact-russia {
        display: grid;
        grid-column: 1 / -1;
        grid-row: 3 / 4;
        align-items: start;
        justify-items: start;
        justify-content: start;
        height: max-content;
    }

    .contact-map-container h2 {
        display: grid;
        grid-column: 2 / 6;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .blog-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: max-content;
        position: relative;
        top: 90px;
        margin-top: 0;
        min-height: calc(100vh - 265px);
    }

    .tabs-content {
        display: grid;
        grid-column: 3 / 11;
    }

    .blog-item {
    display: grid;
    grid-column: 4 / 10;
    grid-template-columns: repeat(8, 1fr);
    padding-top: 32px;
    padding-bottom: 80px;
    border-bottom: 1px solid #E6E6E6;
    align-items: start;
    justify-content: start;
}

.blog-item:last-child {
    border-bottom: none;
}

    .tabs-content .blog-item .blog-img {
        display: grid;
        grid-column: 1 / 4;
        padding-right: 32px;
    }

    .item-info {
        display: grid;
        grid-column: 4 / -1;
        margin: 0;
    }

    .item-info h2 {

        margin: 0;
        margin-bottom: 12px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 15px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
    }

    .item-info .preview {

        margin: 0;
        margin-bottom: 12px;
        overflow: hidden;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        text-overflow: ellipsis;
        white-space: pre-wrap;
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.12px;
    }

    .article-wrapper {
        display: grid;
        grid-column: 3 / 11;
        position: relative;
        top: 128px;
        margin-top: 0;
    }

    .reg-wrapper {
        display: grid;
        grid-column: 3 / 11;
        position: relative;
        top: 32px;
    }

    .reg-form input {
        display: flex;
        height: 40px;
        padding: 0px 12px;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        border: none;
        border-bottom: 1px solid var(--Primary-Primary-100, #0D0D0D);
        background: var(--Surfaces, #FFF);
    }

    .reg-form .password-block {
        margin-bottom: 20px;
    }

    .reg-form .fio-block,
    .reg-form .yur-block,
    .reg-form .contact-block,
    .reg-form .password-block {
        display: grid;
        grid-auto-flow: column;
        gap: 8px;
        margin-bottom: 8px;
    }

    /* Общие стили для всех кнопок */
.reg-form .button-block button {
    display: flex;
    height: 44px;
    padding: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    flex: 1 0 0;
    border: 1px solid var(--Primary-Primary-100, #0D0D0D);
    background: var(--Background, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    color: var(--Typography-Typography-Primary, #0D0D0D); /* ← добавлено для ясности */
    cursor: pointer;
}

/* Специфичный стиль для register-button */
.reg-form .button-block button.register-button {
    padding: 0 12px;
    gap: 8px;
    flex: unset; /* ← отменяет flex: 1 0 0, если нужно */
    border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
    background: var(--CTA-BTN-Background, #0D0D0D);
    color: var(--CTA-BTN-Typography, #F2F2F2);
    letter-spacing: 0.48px;
    text-transform: uppercase;
}

   /* Общие стили для всех блоков формы */
.personal-form form .fio-block-personal,
.personal-form form .yur_deat_block,
.personal-form form .yur_address_block,
.personal-form form .contacts_block,
.personal-form form .send-block {
    display: grid;
    grid-column: 1 / -1;
    grid-auto-flow: row;
    align-items: center;
    justify-content: stretch;
}

/* Блоки с gap: 16px */
.personal-form form .fio-block-personal,
.personal-form form .yur_deat_block,
.personal-form form .yur_address_block,
.personal-form form .contacts_block {
    gap: 16px;
}

/* Отступы снизу */
.personal-form form .fio-block-personal {
    margin: 0 0 16px 0;
}

.personal-form form .yur_deat_block,
.personal-form form .yur_address_block,
.personal-form form .contacts_block,
.personal-form form .send-block {
    margin-bottom: 40px;
}

/* Специфичный стиль для contacts_block */
.personal-form form .contacts_block {
    grid-template-columns: 1fr;
}

/* Вложенные блоки в contacts_block */
.personal-form form .contacts_block .reg-block-big,
.personal-form form .contacts_block .reg-block {
    display: grid;
    grid-column: span 1;
}

    .notauth {
        display: grid;
        grid-column: 1 / -2;
        width: 100%;
        height: 38px;
        margin-top: 32px;
        /* padding: 0px 24px; */
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
        background: var(--CTA-BTN-Background, #0D0D0D);
        color: var(--CTA-BTN-Typography, #F2F2F2);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.16px;
        text-decoration: none;
        text-transform: uppercase;
    }
}







@media screen and (min-width: 768px) and (max-width: 1023px) {
    #searchForm {
        display: none;
    }

    #searchFormMobile {
        display: none;
    }

    #searchFormMobile.active {
    display: flex;
    left: 0;
    position: absolute;
    height: 100%;
    background-color: white;
    width: 100%;
    z-index: 1;
}

#searchFormMobile.active input {
    width: 96%;
    padding: 0 1%;
    border: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    -webkit-appearance: none;
    box-sizing: border-box; /* -moz-box-sizing не нужен */
}

#searchFormMobile.active input:focus {
    outline: none;
}

#searchFormMobile.active input::placeholder {
    color: var(--Typography-Typography-Primary, #0D0D0D); /* или другой цвет */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.search-results {
    display: none;
    padding: 15px;
    text-align: left;
    background: #F3F3F3;
    border: thin solid #ccc;
    position: absolute;
    top: 60px;
    width: 100%;
}

/* Стилизация кнопки очистки (только WebKit) */
#searchFormMobile.active input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    background: url(/assets/template/main/images/clear.svg) center center no-repeat;
}

#searchFormMobile.active input::-webkit-search-cancel-button:hover {
    background-image: url(/assets/template/main/images/typehover.svg);
}

    .slider {
        display: none;
    }

    .slider-mobile {
        display: grid;
    }

    .banner .slick-slide img {
        display: grid;
        position: absolute;
        width: 100vw;
        aspect-ratio: 2 / 3;
        height: auto;
    }

    .slide {
        width: 100%;
        aspect-ratio: 2/3;
    }

    .collection-description {
    display: grid;
    grid-column: 3 / 11;
    grid-row: auto / 12;
    position: relative;
    padding: 20px;
    /* justify-content: stretch — по умолчанию для grid, можно убрать */
}

.collection-description h1,
.collection-description p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-style: normal;
    text-align: center;
    margin: 0;
}

.collection-description h1 {
    font-size: 24px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.72px;
    margin-bottom: 12px;
}

.collection-description p {
    font-size: 12px;
    font-weight: 400;
    line-height: 160%;
    margin-bottom: 24px;
}

    header {
    display: grid;
    grid-template-columns: repeat(12, 1fr); /* ← добавлено для 12-колоночной сетки */
    grid-template-rows: 28px auto;
    background: var(--Background, #F2F2F2);
}

.bottom-header {
    display: none;
}

.bottom-mobile-header {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-row: 2 / 3;
    width: 100%;
    background: var(--Background, #F2F2F2);
    border-bottom: 1px solid black; /* ← порядок: ширина стиль цвет */
    height: 60px;
    position: fixed;
    z-index: 1;
}

.first-header-block {
    display: grid;
    grid-column: 1 / 2;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
}

    .hamburger {
        border: none;
        background: transparent;
    }

    #mobSearchButton {
        border: none;
        background: transparent;
    }

    .mobile-logo {
        display: grid;
        grid-column: 2/3;
        align-items: center;
        justify-content: center;
    }

    .third-header-block {
        display: grid;
        grid-column: 3/-1;
    }

    .third-header-block .personal {
        display: grid;
        align-items: center;
        justify-content: center;
    }

    
    .mobile-container {
        display: grid;
        grid-template-rows: auto 1fr;
    }

    .main-menu.hidden {
        display: none;
    }

    .submenu {
        display: none;
    }

    .submenu.loaded {
        display: block;
    }

    .top-mobile {
        padding: 16px;
        background-color: #f2f2f2;
        display: flex;
        align-items: center;
    }

    .mobile_menu_overlay,
    .mobile_menu_container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
    }

    .mobile_menu_overlay {
        display: none;
        cursor: pointer;
        z-index: 10200;
    }

    .mobile_menu_container {
        width: 50%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        width: 50%;
        overflow: hidden;
        z-index: 10201;
        background: #F2F2F2;
        transition: all 200ms;
    }

    .mobile_menu_container.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        height: calc(100vh - 64px);
        top: 61px;
        overflow-y: scroll;
    }

    /* Стили для кнопки "Назад" */
    .mobile_menu_container ul li a.back {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        height: 52px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile_menu_container .mobile_menu_content {
        overflow: auto;
        max-height: 100%;
        padding-bottom: 30px;
    }

    .mobile_menu_container ul {
        margin: 0;
        padding: 0;
    }

    
    .mobile_menu_container ul li {
        list-style: none;
        display: flex;
        height: 52px;
        padding: 0px 16px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
        transition: all 200ms;
        text-transform: uppercase;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }


   /* Общие типографические стили */
.mobile_menu_container ul li a,
.personal-mobile-menu ul li a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    text-decoration: none;
    width: 100%;
    align-items: center;
}

/* Специфичные layout-стили */
.mobile_menu_container ul li a {
    display: flex;
    justify-content: space-between;
}

.personal-mobile-menu ul li a {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
}

    .mobile_menu_container ul li a.parent {
        padding-right: 50px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.56614 2.82701C5.28659 3.06663 5.25421 3.48749 5.49383 3.76704L9.12195 7.99985L5.49383 12.2327C5.25421 12.5122 5.28659 12.9331 5.56614 13.1727C5.84569 13.4123 6.26656 13.3799 6.50617 13.1004L10.8781 7.99985L6.50617 2.89932C6.26656 2.61977 5.84569 2.5874 5.56614 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
    }

    .mobile_menu_container ul li a.back {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
    }

    .mobile_menu_container ul li a:hover {
        background: #fff;
    }

    .mobile_menu_container ul li ul {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255);
        z-index: 2;
        transition: all 200ms;
    }

    .personal-mobile-menu ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
        display: grid;
        grid-auto-flow: column;
        align-items: center;
        justify-content: start;
        width: 100%;
    }

    .mobile_menu_container ul li ul.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }

    .bottom-content {
        padding: 16px;
        border-top: 1px solid #ddd;
        position: absolute;
        bottom: 0;
        width: 100%;
        background: #fff;
    }

    .main-menu.hidden {
        display: none;
    }

    .submenu {
        display: none;
    }

    .submenu.loaded {
        display: block;
    }

    .top-mobile {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .top-list {
        display: none;
    }

    .top-list-mobile {
        list-style: none;
        display: flex;
        align-items: center;
        font-size: 14px;
    }

    .top-list-mobile a {
        font-size: 0
    }

    .top-list-mobile a::after {
        padding-left: 10px;
        padding-right: 10px;
    }

    .bottom-content {
        position: relative;
        left: 0;
        width: 100%;
        background: #f2f2f2;
        padding: 0;
        box-sizing: border-box;
        border-top: none;
    }

    .bottom-content .subscribe {
        display: grid;
        padding: 24px 16px;
    }

    .subscribe form {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .subscribe input[type="email"] {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        border: none;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .subscribe button[type="submit"] {
        display: flex;
        padding: 10px;
        background: #0D0D0D;
        color: #fff;
        height: 44px;
        border: none;
        border-radius: 0;
        cursor: pointer;
        margin-bottom: 8px;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 0 16px;
    }

    .subscribe input[type="submit"]:hover {
        background: #333;
    }

    .subscribe p {
        font-size: 14px;
        color: #555;
        margin: 0;
    }

    .burger {
        position: relative;
        border: none;
        background: transparent;
        width: 40px;
        height: 26px;
        margin-left: 2%
    }

    .desctop {
        display: none;
    }

    .tablet-mobile {
        top: 60px;
        display: grid;
        padding: 0;
        margin: 0;
        grid-column: 1 / -1;
        grid-template-columns: 1fr;
    }

    .personalMobile {
        display: grid;
        grid-auto-flow: column;
        list-style: none;
        align-items: center;
        justify-content: end;
        padding: 0;
        margin: 0;
        margin-right: 20px;
    }

    .personalMobile li {

        display: grid;
        height: 44px;
        width: 44px;
        align-items: center;
        justify-content: center;

    }

    .partner-wrapper {
        display: grid;
        grid-column: 2/12;
        position: relative;
        top: calc(92px + 78px);
        padding: 80px 0;
    }

    .wrapperFavorite {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(28px + 16px);
        width: 100%;
        grid-row: 5 / 6;
        grid-column: 1 / -1;
        z-index: 0;
        min-height: min-content;
    }

    .desctop {
        display: none;
    }

    .tablet-mobile {
        top: 58px;
        display: grid;
        padding: 0;
        margin: 0;
        grid-column: 1/ -1;
        grid-template-columns: 1fr;
    }

    .accardion-container {
        display: grid;
    }

    .tablet-mobile button.accardion-footer {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-auto-flow: column;
        padding: 14px 24px;
        border-radius: 0;
        border: 0;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .tablet-mobile button.accardion-footer:after {
        content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.99935 2.66667C8.36754 2.66667 8.66602 2.96515 8.66602 3.33334V7.33334H12.666C13.0342 7.33334 13.3327 7.63181 13.3327 8C13.3327 8.36819 13.0342 8.66667 12.666 8.66667H8.66602V12.6667C8.66602 13.0349 8.36754 13.3333 7.99935 13.3333C7.63116 13.3333 7.33268 13.0349 7.33268 12.6667V8.66667H3.33268C2.96449 8.66667 2.66602 8.36819 2.66602 8C2.66602 7.63181 2.96449 7.33334 3.33268 7.33334H7.33268V3.33334C7.33268 2.96515 7.63116 2.66667 7.99935 2.66667Z" fill="%230D0D0D"/></svg>');
        font-size: 16px;
        height: 16px;
        width: 16px;
        color: #0D0D0D;
        float: right;
        margin-left: 5px;
    }

    .bottom-block {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 24px 32px 32px 32px;
    }

    .tablet-mobile ul {
        margin: 0;
        list-style: none;
        text-decoration: none;
        background: #f2f2f2;
        padding-inline-start: 5px;
    }

    .tablet-mobile ul li {
        display: flex;
        height: 44px;
        align-items: center;
        gap: 8px;
        align-self: stretch;
    }

    .tablet-mobile ul li a {
        color: var(--Tertiary-BTN-Typography, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .bottom-block .left {
        display: grid;

        align-items: start;
        justify-content: start;
    }

    .bottom-block .left .social {
        display: grid;
        grid-auto-flow: column;
        gap: 20px;
        width: max-content;
    }

    .bottom-block .left .copiryght {
        display: grid;
        align-self: end;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
        margin-top: 40px;
    }

    .bottom-block .right .title,
    .bottom-block .left .title {
        margin: 0;
        margin-bottom: 4px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
        letter-spacing: 0.14px;
    }

    .bottom-block .first-block {
        margin: 0;
        margin-bottom: 16px;
    }

    .accardion-item {
        padding: 0 18px;
        background-color: #f2f2f2;
        display: none;
        overflow: hidden;
    }

    .breadcrumbs {
        height: 60px;
        display: grid;
        position: fixed;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, 1fr);
        grid-row: 3 / 4;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid black;
        width: 100vw;
        z-index: 1;
        background: var(--Background, #F2F2F2);
        border-top: 1px solid black;
    }

    .wrapper {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(167px);
        width: 100%;
        grid-row: 5 / 6;
        grid-column: 1 / -1;
        z-index: 0;
    }

    .fullscreen-filter.opened {
        display: flex;
        position: fixed;
        top: -91px;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, 0.2);
        z-index: 3;
    }

    .filter-container.filterActive {
        background-color: #F2F2F2;
        display: flex;
        flex-direction: column;
        width: 50%;
        z-index: 1;
        position: fixed;
        height: 100vh;
        top: -122px;
        bottom: 0;
        border-right: 1px solid #0d0d0d;
        transform: translateX(0);
        z-index: 2;
    }

    .descr {
        position: relative;
        display: flex;
        width: 100%;
        align-items: start;
        flex-direction: column;
        justify-content: center;
        bottom: 0;
        margin-top: 15px;
        height: 50px;
    }

    .product-cart a {
        color: black;
        text-decoration: none;
    }

    .title-price {
        display: grid;
        grid-auto-flow: row;
        justify-content: space-between;
        width: 100%;
    }

    .like {
        display: none;
        justify-self: end;
        position: relative;
        height: 50px;
        width: 50px;
        bottom: 0px;
        top: 0%;
        right: 0px;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
    }

    .like-mobile {
        position: absolute;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.24099 2.67482L5.25095 2.6748C6.28206 2.68106 7.26924 3.09195 8.00017 3.81861C8.35873 3.45871 8.78442 3.17254 9.2532 2.97638C9.72841 2.77752 10.2384 2.67511 10.7536 2.67511C11.2687 2.67511 11.7787 2.77752 12.2539 2.97638C12.7286 3.17501 13.1591 3.46593 13.5205 3.83223C14.2552 4.57055 14.6677 5.5698 14.6677 6.61146C14.6677 7.65342 14.255 8.65295 13.5198 9.39133C13.5196 9.39153 13.5194 9.39173 13.5192 9.39193L8.4735 14.4777C8.34832 14.6038 8.17796 14.6748 8.00023 14.6748C7.82251 14.6748 7.65215 14.6038 7.52697 14.4777L2.48058 9.39127C2.48049 9.39118 2.48067 9.39137 2.48058 9.39127C1.93446 8.84136 1.56238 8.14232 1.41141 7.38214C1.26042 6.62183 1.33705 5.83388 1.63172 5.11692C1.92638 4.39996 2.42599 3.78584 3.06799 3.35145C3.70999 2.91706 4.46587 2.68169 5.24099 2.67482ZM5.24784 4.00815C4.73677 4.01366 4.23855 4.16929 3.81518 4.45575C3.39044 4.74314 3.0599 5.14943 2.86496 5.62377C2.67001 6.0981 2.61931 6.61941 2.7192 7.12242C2.8191 7.62543 3.06515 8.0878 3.42656 8.45164L8.00023 13.0616L12.5746 8.45099C13.0612 7.96245 13.3344 7.301 13.3344 6.61146C13.3344 5.92192 13.0612 5.26047 12.5746 4.77193L12.5721 4.76944C12.3345 4.52841 12.0514 4.337 11.7392 4.20636C11.427 4.07572 11.092 4.00844 10.7536 4.00844C10.4151 4.00844 10.0801 4.07572 9.7679 4.20636C9.45571 4.337 9.17261 4.5284 8.93504 4.76943L8.92919 4.77538C8.79161 4.91151 8.67168 5.06438 8.57229 5.23047C8.4519 5.43164 8.23468 5.55479 8.00023 5.55479C7.76579 5.55479 7.54857 5.43164 7.42818 5.23047C7.32879 5.06438 7.20889 4.91147 7.07132 4.77534L7.06815 4.77221C6.58538 4.28806 5.9314 4.0136 5.24784 4.00815Z" fill="%230D0D0D"/></svg>');
        height: 16px;
        width: 17px;
        right: 24px;
        z-index: 2;
    }

    .like.is-actived {
        position: relative;
        height: 24px;
        width: 24px;
        bottom: 24px;
        top: 91%;
        right: 8.33px;
        z-index: 2;
    }

    .descr .title {
        margin: 0px;
        padding-left: 24px;
        margin-bottom: 6px;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .descr .price {
        margin: 0px;
        text-align: left;
        padding-left: 24px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    ul.breadcrumb {
        display: none;
    }

    .mobile-crumbs {
        width: 100%;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        grid-column: 1 / -1;
        padding: 0;
    }

    a.backer {
        text-decoration: none;
    }

    .mobile-crumbs .pagetitle {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .mobile-crumbs h2 {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-align: right;
        margin: 0;
        margin-right: 16px;
    }

    .mobile-crumbs .sf_h1 {
        display: grid;
        grid-column: 1 / 12;
        grid-row: 6 / 7;
        position: relative;
        top: 0;
        font-size: 17px;
    }

    .mobile-crumbs .pagetitle a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile-crumbs .allmodels {
        color: var(--Typography-Typography-Secondary, #808080);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .mobile-crumbs .mobile-title {
        display: grid;
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        grid-auto-flow: column;
        margin-left: 16px;
        align-items: center;
        justify-content: start;
    }

    .mobile-crumbs .mobile-category {
        display: grid;
        grid-column: 2 / -1;
        justify-content: end;
        align-items: center;
        margin-right: 32px;
    }

    .mobile-crumbs .mobile-category a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-decoration: none;
    }

    .button-container {
        display: grid;
        grid-column: 1 / 2;
        grid-auto-flow: column;
        align-items: center;
        justify-content: center;
    }

    .chips {
        display: none;
    }

    .product-wrapper {
        display: grid;
        grid-template-columns: 16px repeat(10, 1fr) 16px;
        position: relative;
        top: calc(28px + 44px + 64px + 14px);
        grid-column: 1 / -1;
        grid-row: 5 / 6;
    }

    .gallery-with-other {
        display: grid;
        grid-column: 1 / -1;
        grid-template-rows: auto auto;
        align-items: start;
        justify-content: start;
        border-right: 1px solid black;
        margin-bottom: 32px;
    }

    .size-unit {
        display: grid;
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
        align-self: stretch;
        border-top: none;
        border-bottom: none;
        grid-column: 2 / -1;
        grid-row: 1 / 3;
    }

    .unit {
        display: flex;
        width: 100%;
        flex-direction: column;
    }

    .unit .counter {
        display: flex;
        gap: 4px;
        margin-bottom: 16px;
    }

    .unit .counter-add {
        display: flex;
        gap: 24px;
        align-items: start;
        justify-content: space-between;
        width: 100%;
    }

    #addZakButton {
        display: grid;
        width: 100%;
    }

   /* Основное состояние кнопки */
#addZak {
    display: flex;
    height: 44px;
    width: 100%;
    padding: 0 24px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Color-White-100, #F2F2F2);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
}

/* Disabled — самое приоритетное состояние */
#addZak:disabled {
    background: var(--Disable, #B2B2B2);
    color: var(--Typography-Typography-CTA-Disable, #E6E6E6);
    cursor: not-allowed;
}

/* :disabled:hover — обычно не нужен, но если требуется — оставляем */
#addZak:disabled:hover {
    /* Нет изменений — можно оставить пустым или удалить */
}

    .back {
        display: grid;
        grid-column: 1 / 2;
        height: 60px;
    }

    .with-this-product {
        display: grid;
        grid-column: 1 / -1;
        align-self: end;
        border-right: 1px solid black;
    }

    .gallery-wrapper {
        display: none;
    }

    .mobile-gallery-wrapper {
        display: grid;
    }

    .mobile-gallery-wrapper.single-slide a {
        display: grid;

    }

    .mobile-gallery-wrapper.single-slide a img {
        display: grid;
        grid-column: 1 / -1;
        height: auto;
        width: 100%;
    }

    .mobile-gallery-wrapper.slick-initialized .slick-slide {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }

    .mobile-gallery-wrapper .slick-slide img {
        display: block;
        width: 50vw;
    }

    .progress {
        display: flex;
        margin: 0 16px;
        bottom: 18px;
        height: 2px;
        overflow: hidden;
        background-color: #f5f5f5;
        background-image: linear-gradient(to right, black, black);
        background-repeat: no-repeat;
        background-size: 0 100%;
        transition: background-size .4s ease-in-out;
    }

    #addZak:hover {
        display: flex;
        height: 44px;
        width: 100%;
        padding: 0px 24px;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        background: var(--Primary-40, rgba(13, 13, 13, 0.40));
        color: var(--Typography-Typography-CTA-Hover, #0D0D0D);
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
    }

    .info-wrapper {
        grid-column: 2 / 12;
        grid-template-columns: repeat(10, 1fr);
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 0px;
    }

    .product-head {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / -1;
    }

    .upLine {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: minmax(max-content, 1px);
        align-items: center;
        justify-content: stretch;
        gap: 8px;
        height: max-content;
        margin-bottom: 40px;
    }

    .subtitle {
        display: grid;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        grid-row: auto;
        margin-bottom: 0px;
    }

    .prices {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / 2;
        gap: 8px;
    }

    .color-select {
        display: grid;
        flex-direction: column;
        width: 100%;
        margin-bottom: 0;
        grid-column: 1 / -1;
        margin-bottom: 24px;
    }

    .not-auth-block {
        display: grid;
        grid-column: 1 / 12;
        width: 100%;
        grid-template-columns: 1fr 40px;
        gap: 8px;
    }

    .rost-select .selects {
        display: grid;
        grid-column: 1 / 9;
        grid-auto-flow: column;
        gap: 8px;
        margin-right: 40px;
    }

    .size-unit {
        display: grid;
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
        align-self: stretch;
        border-top: none;
        border-bottom: none;
        grid-row: auto;
    }

    .size-unit.with-rost-select {
        grid-column: 3 / 12;
    }

    .size-unit.without-rost-select {
        grid-column: 1 / 12;
    }

    .units {
        display: grid;
        grid-column: 1;
        width: 100%;
    }

    /* Общие стили для кнопок +/- */
.unit #minus,
.unit #plus {
    display: flex;
    width: 44px;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    border: none;
    background: #f2f2f2;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

/* Disabled-состояние для кнопок */
.unit #minus:disabled,
.unit #plus:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

/* Общие стили для input */
.unit #unitInput {
    display: flex;
    width: 40px;
    height: 42px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 0;
    gap: 8px;
    background: #f2f2f2;
    border: none;
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    color: var(--Typography-Typography-Primary, #0D0D0D); /* ← явно задан цвет */
}

/* Disabled-состояние для input */
.unit #unitInput:disabled {
    color: #B2B2B2;
    cursor: not-allowed;
}

    .inputs {
        display: flex;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        align-items: start;
        justify-content: start;
        gap: 8px;
    }

    .cart-conteiner {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
    }

    .cart-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
        position: relative;
        top: 100px;
    }

    .filter-product-container {
        display: grid;
        grid-column: 1 / -1;
    }

    .cart-empty a {
        display: flex;
        width: 384px;
        height: 44px;
        padding: 0 16px 0 22px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .cart-filter-buttons {
        display: grid;
        grid-column: 2 / 12;
        grid-auto-flow: column;
        gap: 16px;
        margin-bottom: 64px;
    }

    .table-header-big .units {
        display: grid;
        grid-column: 4;
        width: 100%;
    }

    .add-width-fav {
        display: grid;
        grid-auto-flow: column;
        grid-column: 2 / 11;
        grid-template-columns: auto 44px;
        gap: 16px;
        top: 29px;
        width: 100%;
        justify-content: stretch;
        align-items: end;
        position: relative;
        margin-bottom: 64px;
    }

    #msOrder {
        display: grid;
        grid-row: 3;
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
        grid-column: 1 / 13;
        justify-content: end;
        align-items: end;
        position: relative;
        top: 100px;
        margin-top: 0px;
        margin-top: 40px !important;
        margin-bottom: 40px;
    }

    .sender-zakaz {
    display: flex;
    width: 100%;
    height: 52px; /* ← единая высота */
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.42px;
    border: none;
    gap: 16px;
    text-transform: uppercase;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    cursor: pointer; /* ← улучшает UX */
}

.sender-zakaz:hover {
    background: var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

    .products-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
        /* padding-bottom: 80px; */
    }

    .cart-product {
        display: none;

    }

    .cart-product-mobile {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, 1fr);
        grid-column: 1 / -1;
        padding: 0 24px;
    }

    .cart-product-mobile-test {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column: 2 / 12;
    height: 133px;
    padding: 20px 0;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    border-bottom: 1px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
}

.cart-product-mobile-test .left-mobile-block {
    display: grid;
    grid-column: 1 / 2;
    grid-row: 1 / -1;
    grid-auto-flow: column;
    grid-template-columns: max-content 1fr; /* ← добавлено второе поле */
}

.cart-product-mobile-test .product-img {
    display: grid;
    place-items: center;
    padding-right: 24px;
    height: 133px;
    width: 88px;
    overflow: hidden;
    border-radius: 4px;
}

.cart-product-mobile-test .product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Общие типографические стили */
.cart-product-mobile-test .title,
.cart-product-mobile-test .description,
.cart-product-mobile-test .sizes .title,
.cart-product-mobile-test .sizes .rost-title,
.cart-product-mobile-test .sizes .size-item {
    font-family: "Ubuntu Sans";
    margin: 0;
}

.cart-product-mobile-test .center {
    display: grid;
    /* Убрано flex-direction — не работает в grid */
    align-items: flex-start;
    justify-content: space-between;
    grid-template-rows: 26px 36px auto;
    height: 100%;
}

.cart-product-mobile-test .center .title {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-size: 18px;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 8px;
}

.cart-product-mobile-test .center .description {
    color: var(--Typography-Typography-Secondary, #808080);
    font-size: 12px;
    font-weight: 400;
    line-height: 100%;
    margin-bottom: 24px;
}

.cart-product-mobile-test .center .sizes {
    display: grid;
    /* Убраны flex-свойства — не работают в grid */
    width: 100%;
    align-self: end;
}

.cart-product-mobile-test .center .sizes .title {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-size: 13px;
    font-weight: 600;
    line-height: 100%;
    margin-bottom: 8px;
}

.cart-product-mobile-test .center .sizes .rost-group {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.cart-product-mobile-test .center .sizes .rost-title {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-size: 12px;
    font-weight: 500;
    line-height: 160%;
}

.cart-product-mobile-test .center .sizes .size-group {
    display: flex;
    gap: 4px;
    flex-wrap: wrap; /* ← перенос размеров */
}

.cart-product-mobile-test .center .sizes .size-item {
    display: flex;
    height: 24px;
    padding: 0 8px; /* ← увеличен padding для лучшего тап-таргета */
    justify-content: center;
    align-items: center;
    background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-size: 12px;
    font-weight: 400;
    line-height: 100%;
    white-space: nowrap;
}

.cart-product-mobile-test .right-mobile-block {
    display: grid;
    grid-column: 2 / -1;
    align-items: stretch;
    justify-content: end;
    height: 100%;
}

.cart-product-mobile-test .info-buttons {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-row: 2;
    align-self: end;
    align-items: stretch;
    justify-content: end;
    gap: 24px;
}

.cart-product-mobile-test .right-mobile-block .price_info,
.cart-product-mobile-test .right-mobile-block .info {
    display: grid;
}

    .price_info .fullprice {
    color: var(--Typography-Typography-Primary, #1A1A1A);
    text-align: right;
    font-family: "Ubuntu Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.54px;
    margin: 0 0 4px 0;
}

.price_info .subinfo {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: right;
    font-family: "Ubuntu Sans"; /* ← добавлено для согласованности */
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.13px;
    margin: 0 0 16px 0;
}

.price_info .info-buttons {
    display: grid;
    grid-auto-flow: column;
    align-self: end;
    gap: 24px;
}

/* Общие стили для кнопок */
.price_info button {
    display: flex;
    height: 32px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: none;
    color: var(--Tertiary-BTN-Default-Typpography, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: none;
    cursor: pointer; /* ← улучшает UX */
}

/* Hover — только изменения */
.price_info button:hover {
    background: var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 600;
}

    .variant-accardion.active {
        display: grid;
        grid-column: 1 / -1;
        align-items: center;
        padding: 0 24px;
    }

    .product-option .variant {
        display: grid;
        padding: 5.5px 0;
        grid-column: 1 / -1;
        align-items: center;
        grid-template-columns: 32px 1fr 1fr 100px 1fr 32px;
        border-bottom: 0.5px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
    }

    .table-header-big .units {
        display: grid;
        grid-column: 4;
        width: 100%;
    }

    .cart-product-mobile .product-top-content {
        display: grid;
        grid-template-columns: 125px auto;
        margin-bottom: 16px;
    }

    .cart-product-mobile .right-mobile-block {
        display: grid;
    }

    .cart-product-mobile .product-title-remove .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 20px;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        align-self: center;
        justify-content: center;
    }

    .cart-product-mobile .descritpion p {
        margin: 0;
    }

    .cart-product-mobile .descritpion span {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        /* Mobile/Body 150% */
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        /* 18px */
    }

    .cart-product-mobile .product-title-remove {
        display: grid;
        grid-template-columns: 1fr 40px;

    }

    .cart-product-mobile button.remove {
        display: flex;
        height: 36px;
        padding: 0px 8px;
        justify-content: center;
        align-items: center;
        border: none;
    }

    .cart-product-mobile .remove p {
        display: none;
    }

    .cart-product-mobile .description {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
    }

    .sizes .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 8px;
    }

    .sizes .selected-sizes {
        display: grid;
        grid-auto-flow: column;
        align-items: start;
        justify-content: start;
    }

    .selected-sizes div {
        display: flex;
        width: 26px;
        height: 26px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        background: var(--Primary, #0D0D0D);
        color: var(--Typography-Typography-On-Color, #F2F2F2);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.13px;
    }

    .show-hide-mobile {
        display: flex;
        height: 44px;
        padding: 0px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        width: 100%;
        border: none;
        color: var(--Typography-Typography-Secondary, #808080);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: none;
        background-color: #f2f2f2;
    }

    .send-button {
        display: grid;
        grid-column: 2 / 12;
        padding-bottom: 0px;
        padding-top: 0px;
    }

    .sender-zakaz {
        display: flex;
        width: 100%;
        height: 52px;
        padding: 0px 24px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        border: none;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        right: 0;
    }

    .back {
        display: none;
        height: 0px;
    }

    .prices {
        display: none;
    }

    .subtitle .item-accordion {
        width: 100%;
        display: grid;
        grid-column: 1 / -1;
        margin-bottom: 24px;
    }

    .mobile-prices {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: max-content;
        gap: 16px;
    }

    .info-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        margin-bottom: 6px;
    }

    .info-wrapper p {
        display: grid;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
        margin: 0;
    }

    p.price-one,
p.old-price {
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    line-height: 100%;
    letter-spacing: 0.14px;
    margin: 0;
}

p.price-one {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 500;
}

p.old-price {
    color: var(--Typography-Typography-Tertiary, #B2B2B2); /* ← исправлена опечатка */
    font-weight: 400;
    text-decoration: line-through; /* ← короткая форма */
}

    .nighbors {
        display: flex;
        justify-content: space-between;
        gap: 10px;
    }

    .hover-text {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
        opacity: 0;
        transition: opacity 0.3s ease;
        background: #fff;
        padding: 2px 8px;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    .forwardarrow:hover~.hover-text,
    .backarrow:hover~.hover-text {
        opacity: 1;
    }

    .notauth {
        display: grid;
        grid-column: auto;
        width: 100%;
        height: 42px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
        background: var(--CTA-BTN-Background, #0D0D0D);
        color: var(--CTA-BTN-Typography, #F2F2F2);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .product-like {
        height: 42px;
        width: 42px;
        justify-self: center;
        margin-left: 0px;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
    }

    .product-like.is-active {
        height: 42px;
        width: 42px;
        margin-left: 0px;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
    }

    .litle-products {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
    }

    .litle-products.slick-initialized .slick-slide {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }

    .tabProduct {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        align-items: start;
        justify-content: stretch;
        gap: 8px;
        margin-bottom: 8px;
    }

    .tablinksProduct.active {
        display: grid;
        align-items: center;
        justify-self: stretch;
        height: 44px;
        padding: 8px 16px;
        border: none;
        background: #f2f2f2;
        border-bottom: 2px solid #0D0D0D;
        cursor: pointer;
    }

    #color {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .litle-title h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
    }

    .sizeTable {
        color: var(--Secondary, #808080);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .sizes .litle-title {
        display: grid;
        grid-row: 1 / 2;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .unit h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    #product-form {
        display: grid;
        grid-column: 1 / -1;
        margin-top: 0;
        width: 100%;
    }

    .succes-block {
        display: none;
        grid-column: 1 / 12;
        align-items: center;
        justify-content: center;
        width: 100%;
        text-align: center;
    }

    .precart-table.added {
        display: grid;
        grid-column: 1 / 8;
        margin-top: 0px;
    }

    .title-with-price {
        display: flex;
        align-items: start;
        flex-direction: column;
        position: relative;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 90%;
        margin-top: 15px;
    }

    .title-with-price h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 6px;
    }

    .title-with-price .price {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .partner-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: -3px;
        padding: 0px;
    }

    .partner-wrapper .blogtab {
        justify-content: center;
    }

    .partner-wrapper .text-wrapper {
        display: grid;
        grid-column: 2 / 12;
        align-items: start;
        padding-right: 0;
        justify-content: start;
        margin-top: 40px;
        grid-template-rows: repeat(9, max-content);
    }

    .text-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    .partner-wrapper .text-wrapper p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        margin: 0;
        margin-bottom: 13px;
    }

    .partner-wrapper h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
    }

    .partner-wrapper #blog-tab2 h3 {
        display: grid;
        grid-column: 2 / 11;
        margin-bottom: 24px;
    }

    .partner-wrapper h6 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.16px;
        margin-bottom: 16px;
    }

    .partner-wrapper button.accardion-footer {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-auto-flow: column;
        padding: 8px 0px;
        border-radius: 0;
        height: 32px;
        border: 0;
        border-top: 1px solid var(--Primary, #E6E6E6);
        border-bottom: 1px solid var(--Primary, #E6E6E6);
        background: var(--Background, #F2F2F2);
        color: var(--Typography-Typography-Primary, #0D0D0D);
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .partner-wrapper .link-container {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        gap: 16px 24px;
        margin-bottom: 40px;
    }

    .partner-wrapper .form-wrapper {
        display: grid;
        grid-column: 2 / 12;
        height: fit-content;
        padding-left: 0px;
    }

    .form-wrapper form button:hover {
        display: grid;
        grid-auto-flow: column;
        height: 52px;
        padding: 0px 24px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        background: var(--Disable, #B2B2B2);
        color: #E6E6E6;
        border: none;
        text-transform: uppercase;
    }

    .partner-wrapper .faq {
        display: grid;
        grid-column: 2 / 12;
        margin-top: 40px;
    }

    .partner-wrapper .answer-block {
        display: grid;
        grid-column: 2 / 12;
    }

    .map-wrapper {
        display: grid;
        position: relative;
        top: 83px;
        grid-template-columns: repeat(12, 1fr);
        grid-column: 2/12;
        margin-bottom: 64px;
    }

    .map-wrapper .select-country-mobile {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(10, 1fr);
        grid-auto-flow: column;
        margin-bottom: 32px;
    }

    .select-country-mobile .buttons {
        display: grid;
        grid-column: 1/4;
        grid-auto-flow: column;
    }

    .buttons .countryGet {
        display: grid;
        height: 44px;
        padding: 8px 0px;
        align-items: center;
        border: NONE;
        background: #f2f2f2;
    }

    .select-country-mobile .city-select {
        display: none;
    }

    .select-country-mobile .city-select.grid {
        display: grid;
        grid-column: 4 / -1;
        align-items: center;
        height: 44px;
    }

    .city-list-select {
        display: grid;
        height: 44px;
        align-items: center;
        justify-content: start;
        padding: 0 16px;
    }

    .map-wrapper #map {
        display: grid;
        height: 310px;
        grid-column: 1 / -1;
        width: calc(100%);
        margin-bottom: 32px;
    }

    .map-wrapper .select-country {
        display: none;
        height: 800px;
        grid-column: 10 / 12;
        grid-template-rows: 30px auto;
    }

    .map-wrapper .shops-container {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, 1fr);
    }

    .shops-container h3 {
        display: grid;
        grid-column: 1/ -1;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
    }

    .shops-container .shopItem {
        display: grid;
        align-items: start;
        justify-content: start;
        grid-template-rows: max-content;
        margin: 0;
        margin-bottom: 12px;
    }


    .shopItem h4 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        margin: 0;
        margin-bottom: 4px;
    }

    .shopItem .shopDesc p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        margin: 0;
        margin-bottom: 4px;
    }

    .shopItem a.yandexUrl {
        display: none;
    }

    .cart-filter {
        display: none;
        grid-template-columns: repeat(12, auto);
        grid-column: 1 / 12;
        align-items: center;
        justify-content: stretch;
        justify-items: stretch;
        text-align: center;
        padding: 64px 0;
    }

    .cart-wrapper h1 {
        color: var(--Color-Black-100, #0D0D0D);
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.72px;
        text-transform: uppercase;
        margin-top: 80px;
        margin-bottom: 0px;
        display: none;
    }


    .personal-wrapper {
        display: grid;
        grid-column: 1/ -1;
        grid-template-columns: repeat(12, 1fr);
        position: relative;
        top: 60px;
        margin-top: 0;
    }

    .personal-tabs {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 1fr 1fr;
        align-items: center;
        height: max-content;
    }

    .tab-vert {
        background: var(--Surfaces, #FFF);
        display: grid;
        border: none;
        padding: 16px;
        text-align: start;
        color: #808080;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        align-items: center;
        justify-content: center;
    }

    .personal-tabs-content {
        margin-top: 32px;
        display: grid;
        grid-column: 2 / 12;
        margin-bottom: 90px;
    }

    .personal-content.active {
        display: grid;
        grid-template-columns: 1fr;
        grid-column: 1 / 9;
    }

    .personal-content .personal-info {
        display: grid;
        grid-column: 1 / 9;
    }

    .personal-content .subscribe-block {
        display: grid;
        grid-column: 4 / 7;
        grid-template-columns: 1fr;
        grid-row: 2 / 6;
    }

    .select-country-mobile .buttons {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
    }

    .select-country-mobile .city-select.grid {
        display: grid;
        grid-column: 1 / -1;
        align-items: center;
        height: 44px;
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / 13;
        grid-auto-flow: column;
        height: fit-content;
        padding: 0;
        background: var(--Surfaces, #F2F2f2);
    }

    .blogtab.active {
        background: var(--Primary, #FFF);
        color: #0D0D0D;
    }

    .partner-wrapper .tabs-content {
        display: grid;
        grid-column: 3 / 11;
    }

    .partner-wrapper .blogitems {
        display: grid;
    }

    .partner-wrapper .blogitems #blog-tab2 {
        top: 40px;
        position: relative;
    }

    .textPage-wrapper {
        display: grid;
        position: relative;
        grid-column: 2 / 12;
        top: 108px;
        margin-bottom: 80px;
    }

    .textPage-wrapper h1 {
        margin: 0;
        margin-bottom: 24px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 28px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.28px;
    }

    .textPage-wrapper strong {
        margin: 0;
        margin-bottom: 12px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .textPage-wrapper span {
        color: #000;
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .contact-wrapper {
        display: grid;
        grid-template-columns: repeat(10, 1fr);
        grid-column: 2 / 12;
        position: relative;
        top: 108px;
        margin-top: 48px;
    }

    .contact-belarus {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        grid-column: 1 / -1;
        grid-row: 2 / 3;
    }

    .contact-russia {
        display: grid;
        grid-column: 1 / -1;
        grid-row: 3 / 4;
        align-items: start;
        justify-items: start;
        justify-content: start;
        height: max-content;
    }

    .blog-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: max-content;
        position: relative;
        top: 90px;
        margin-top: 0px;
        min-height: calc(100vh - 265px);
    }

    .blogtab {
        display: grid;
        padding: 8px;
        flex-direction: column;
        align-items: center;
        justify-items: center;
        gap: 8px;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .tabs-content {
        display: grid;
        grid-column: 2 / 12;

    }

    .tabs-content .blog-item .blog-img {
        display: grid;
        grid-column: 1 / 5;
        padding-right: 32px;
    }

    .item-info {
        display: grid;
        grid-column: 5 / -1;
        margin: 0;
    }

    .blog-item {
        display: grid;
        grid-column: 4 / 10;
        grid-template-columns: repeat(10, 1fr);
        padding-top: 32px;
        padding-bottom: 80px;
        border-bottom: #E6E6E6 1px solid;
        align-items: start;
        justify-content: start;
    }

    .blog-item:last-child {
        display: grid;
        grid-column: 4 / 10;
        grid-template-columns: repeat(10, 1fr);
        padding-top: 32px;
        padding-bottom: 80px;
        border-bottom: #E6E6E6 1px solid;
        align-items: start;
        justify-content: start;
    }

    .item-info h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 15px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 0px;
        margin-bottom: 12px;
    }

    .item-info .preview {

        margin: 0;
        margin-bottom: 12px;
        overflow: hidden;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        text-overflow: ellipsis;
        white-space: nowrap;
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.12px;
    }

    .article-wrapper {
        display: grid;
        grid-column: 2 / 12;
        position: relative;
        top: 128px;
        margin-top: 0;
    }

    .article-wrapper h1 {

        margin: 0;
        margin-bottom: 24px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.72px;
        text-transform: uppercase;
    }

    .article-wrapper .preview {

        margin: 0;
        margin-bottom: 24px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.16px;
    }

    .article-wrapper h2 {

        margin: 0;
        margin-bottom: 16px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .reg-wrapper {
        display: grid;
        grid-column: 2 / 12;
        position: relative;
        top: 32px;
    }

    .reg-form input {
        display: flex;
        height: 40px;
        padding: 0px 12px;
        width: calc(100% - 24px);
        align-items: center;
        align-self: stretch;
        border: none;
        border-bottom: 1px solid var(--Primary-Primary-100, #0D0D0D);
        background: var(--Surfaces, #FFF);
    }

    .reg-form .fio-block,
    .reg-form .yur-block,
    .reg-form .contact-block,
    .reg-form .password-block {
        display: grid;
        grid-auto-flow: column;
        gap: 8px;
        margin-bottom: 8px;
    }

    .personal-form form .fio-block-personal {
        display: grid;
        grid-column: 1 / -1;
        gap: 16px;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        margin: 0;
        margin-bottom: 16px;
    }

    .personal-form form .yur_deat_block {
        display: grid;
        grid-auto-flow: row;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: stretch;
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .yur_address_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .yur_address_block .reg-block-big {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .contacts_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .contacts_block .reg-block-big {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .contacts_block .reg-block {
        display: grid;
        grid-column: span 1;
    }
}


@media screen and (max-width: 767px) {
    #searchForm {
        display: none;
    }

    #searchFormMobile {
        display: none;
    }

    #searchFormMobile.active {
        display: flex;
        left: 0;
        position: absolute;
        height: 100%;
        background-color: white;
        width: 100%;
        z-index: 1;
    }

    #searchFormMobile.active input {
        width: 96%;
        padding: 0 1%;
        border: none;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 12px */
        letter-spacing: 0.6px;
        text-transform: uppercase;
        -webkit-appearance: none;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    .search-results {
        display: none;
        padding: 0px;
        text-align: left;
        background: #F3F3F3;
        border: thin solid #ccc;
        position: absolute;
        top: 60px;
        width: 100%;
        overflow-y: scroll;
        height: 100vh;
    }

    .simplesearch-result {
        display: grid;
        padding: 4px 16px;
        border-bottom: 0.5px solid var(--Tertiary, #B2B2B2);
        height: 64px;
        grid-auto-flow: column;
        background: var(--Background, #F2F2F2);
    }

    .search-item #msGallery {
        display: grid;
        grid-column: 1;
        margin-right: 8px;
    }

    .simplesearch-result a.search-item {
        display: grid;
        grid-template-columns: 48px auto 1fr;
        grid-auto-flow: column;
        align-items: center;
        justify-content: space-between;
        text-decoration: none;
    }

    .search-item p {
        display: grid;
        grid-column: 2;
        color: #000;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
        padding: 0;
        text-transform: uppercase;
        width: auto;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.12px;
    }

    .search-item p.sizes {
        display: none;
        color: #000;
        padding: 0 0px;
        grid-column: 1;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.13px;
        text-transform: none;
        gap: 8px;
    }

    .search-item p.sizes-mobile {
        display: grid;
        color: #000;
        padding: 0 0px;
        grid-column: 1;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.13px;
        text-transform: none;
        gap: 8px;
    }

    .inputs-search .sizes-mobile .select-option:not(.select-all) label {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        background: var(--Background, #F2F2F2);
        border: none;
        box-sizing: border-box;
        font-size: 14px;
        text-align: center;
        cursor: pointer;
        padding: 0;
    }

    .inputs-search .select-option:not(.select-all) label {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        background: transparent;
        border: none;
        box-sizing: border-box;
        font-size: 14px;
        text-align: center;
        cursor: default;
        padding: 0;
    }

    .simplesearch-result a.parent {
        display: none;
        grid-auto-flow: column;
        align-items: center;
        justify-content: end;
        grid-column: 2;
        color: #000;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .search-item .inputs-search {
        display: grid;
        grid-column: 3;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        grid-auto-flow: column;
        align-items: center;
        justify-content: end;
    }

    #searchFormMobile.active input:focus {
        width: 96%;
        padding: 0 1%;
        outline: none;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    #searchFormMobile.active input::placeholder {
        width: 96%;
        border: none;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 12px */
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    #searchFormMobile.active input::-webkit-search-cancel-button {
        -webkit-appearance: none;
        width: 18px;
        height: 18px;
        background: url(/assets/template/main/images/clear.svg) center center;
    }

    #searchFormMobile.active input::-webkit-search-cancel-button:hover {
        -webkit-appearance: none;
        width: 18px;
        height: 18px;
        background: url(/assets/template/main/images/typehover.svg) center center;
    }

    #msMiniCart img {
        height: 16px;
        width: 16px;
    }

    .slider {
        display: none;
    }

    .slider-mobile {
        display: grid;
    }

    .banner .slick-slide img {
        display: grid;
        position: absolute;
        width: 100vw;
        aspect-ratio: 2/3;
        height: auto;
    }

    .slide {
        width: 100%;
        aspect-ratio: 2/3;
    }

    .collection-description {
        display: grid;
        grid-column: 1 / -1;
        grid-row: 12 /;
        flex-direction: column;
        position: relative;
        justify-content: stretch;
        background: transparent;
        padding: 0px;
        margin: 0 16px;
        align-items: start;
        justify-content: stretch;
    }

    .collection-description h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 24px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.72px;
        margin-bottom: 8px;
        text-align: center;
    }

    header {
        display: grid;
        grid-column: 1/13;
        grid-template-rows: 28px auto;
        background: #F2F2F2;
    }

    .bottom-header {
        display: none;
    }

    .bottom-mobile-header {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-row: 2 / 3;
        width: 100%;
        background: var(--Background, #F2F2F2);
        border-bottom: 1px black solid;
        height: 60px;
        position: fixed;
        z-index: 1;
    }

    .first-header-block {
        display: grid;
        grid-column: 1 / 2;
        grid-auto-flow: column;
        align-items: center;
        justify-content: start;
    }

    .hamburger {
        border: none;
        background: transparent;
    }

    #mobSearchButton {
        border: none;
        background: transparent;
    }

    .mobile-logo {
        display: grid;
        grid-column: 2/3;
        align-items: center;
        justify-content: center;
    }

    .third-header-block {
        display: grid;
        grid-column: 3/-1;
    }

    .third-header-block .personal {
        display: grid;
        align-items: center;
        justify-content: center;
    }

    
    .mobile-container {
        display: grid;
        grid-template-rows: auto 1fr;
        /* height: 100vh; */
    }

    .main-menu.hidden {
        display: none;
    }

    .submenu {
        display: none;
    }

    .submenu.loaded {
        display: block;
    }

    .top-mobile {
        /* padding: 16px; */
        background-color: #f2f2f2;
        /* border-bottom: 1px solid #ddd; */
        display: flex;
        align-items: center;
        justify-content: center;
        height: 44px;
        width: 44px;
    }

    .mobile_menu_overlay,
    .mobile_menu_container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
    }

    .mobile_menu_overlay {
        display: none;
        cursor: pointer;
        z-index: 10200;
        background: rgba(0, 0, 0, 0);
    }

    .mobile_menu_container {
        width: 50%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        width: 100%;
        overflow: hidden;
        z-index: 10201;
        background: #F2F2F2;
        transition: all 200ms;
    }

    .mobile_menu_container.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        height: calc(100vh - 60px);
        top: 61px;
        overflow-y: scroll;
    }

    /* Стили для кнопки "Назад" */
    .mobile_menu_container ul li a.back {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%; 
        height: 52px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile_menu_container .mobile_menu_content {
        overflow: auto;
        max-height: 100%;
    }

    .mobile_menu_container ul {
        margin: 0;
        padding: 0;
    }

    .mobile_menu_container ul li {
        list-style: none;
        display: flex;
        height: 52px;
        padding: 0px 16px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Background, #F2F2F2);
        transition: all 200ms;
        text-transform: uppercase;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .personal-mobile-menu ul li {
        list-style: none;
        display: flex;
        height: 44px;
        padding: 0px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-bottom: none;
        background: var(--Background, #F2F2F2);
        transition: all 200ms;
    }

    .personal-mobile-menu ul li:last-child {
        margin-bottom: 40px;
    }

    .mobile_menu_container ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
        display: grid;
        grid-auto-flow: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 8px;
    }

    .personal-tabs {
        display: grid;
        grid-column: 1 / 3;
        height: fit-content;
        background: var(--Surfaces, #FFF);
    }

    .personal-mobile-menu ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
        display: grid;
        grid-auto-flow: column;
        align-items: center;
        justify-content: start;
        width: 100%;
    }

    .mobile_menu_container ul li a.parent {
        padding-right: 50px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.56614 2.82701C5.28659 3.06663 5.25421 3.48749 5.49383 3.76704L9.12195 7.99985L5.49383 12.2327C5.25421 12.5122 5.28659 12.9331 5.56614 13.1727C5.84569 13.4123 6.26656 13.3799 6.50617 13.1004L10.8781 7.99985L6.50617 2.89932C6.26656 2.61977 5.84569 2.5874 5.56614 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
    }

    .mobile_menu_container ul li a.back {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg ' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.4339 2.82701C10.7134 3.06663 10.7458 3.48749 10.5062 3.76704L6.87805 7.99985L10.5062 12.2327C10.7458 12.5122 10.7134 12.9331 10.4339 13.1727C10.1543 13.4123 9.73344 13.3799 9.49383 13.1004L5.12195 7.99985L9.49383 2.89932C9.73344 2.61977 10.1543 2.5874 10.4339 2.82701Z' fill='%230D0D0D'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: left 16px center;
    }


    .mobile_menu_container ul li ul {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255);
        z-index: 2;
        transition: all 200ms;
    }

    .mobile_menu_container ul li ul.loaded {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }

    .bottom-content {
        padding: 16px;
        border-top: none;
        position: absolute;
        width: 100%;
        background: #f2f2f2;
    }

    .main-menu.hidden {
        display: none;
    }

    .submenu {
        display: none;
    }

    .submenu.loaded {
        display: block;
    }

    .top-list {
        display: none;
    }

    .top-list-mobile {
        list-style: none;
        display: flex;
        align-items: center;
        font-size: 14px;
    }

    .top-list-mobile a {
        font-size: 0
    }

    .top-list-mobile a::after {
        padding-left: 10px;
        padding-right: 10px;
    }

    .bottom-content {
        position: absolute;
        left: 0;
        width: 100%;
        background: #f2f2f2;
        padding: 0;
        box-sizing: border-box;
        border-top: none;
    }

    .bottom-content .subscribe {
        display: grid;
        padding: 24px 16px;
    }

    .subscribe form {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .subscribe input[type="email"] {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        border: none;
        border-bottom: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .subscribe input[type="email"]:focus {
        display: flex;
        height: 44px;
        padding: 0px 16px;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        outline: none;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Input-Field, #FFF);
    }

    .subscribe .check-with-text {
        display: grid;
        grid-auto-flow: column;
        gap: 12px;
        grid-template-columns: 16px auto;
    }

    .subscribe .check-with-text .checbox {
        display: grid;
        align-items: start;
        justify-content: start;
        width: 16px;
    }

    .subscribe .check-with-text .checbox input {
        height: 16px;
        width: 16px;
    }

    .subscribe .check-with-text h5 {
        margin: 0;
        margin-bottom: 2px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 16px;
    }

    .subscribe .check-with-text p {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Segoe UI";
        font-size: 11px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        margin: 0;
    }

    .subscribe button[type="submit"] {
        display: flex;
        padding: 10px;
        background: #0D0D0D;
        color: #fff;
        height: 44px;
        border: none;
        border-radius: 0;
        cursor: pointer;
        margin-bottom: 8px;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 0 16px;
    }

    .subscribe button[type="submit"] p {
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .subscribe button[type="submit"]:hover {
        background: #333;
    }

    .subscribe p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 11px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
    }

    .burger {
        position: relative;
        border: none;
        background: transparent;
        width: 40px;
        height: 26px;
        margin-left: 2%
    }

    .personal-mobile-menu {
        display: grid;
        padding: 0 16px;
    }

    .personalMobile {
        display: grid;
        grid-auto-flow: column;
        list-style: none;
        align-items: center;
        justify-content: end;
        padding: 0;
        margin: 0;
    }

    .personalMobile li {
        display: grid;
        height: 44px;
        width: 44px;
        align-items: center;
        justify-content: center;

    }

    .personalMobile li a {
        display: grid;
        align-items: center;
        justify-content: center;
    }

    .collection-description h1 {
        font-size: 28px;
        letter-spacing: 0.28px;
        margin-bottom: 8px;
    }

    .collection-description p {

        margin: 0;
        margin-bottom: 24px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
    }

    .lookscollections {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        height: 100%;
    }

    .desc-buttons {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 0 24px 24px 24px;
    }

    .lookscollections a .text {
        position: absolute;
        display: grid;
        position: absolute;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 17px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.17px;
        margin: 0;
        margin-bottom: 4px;
    }

    .lookscollections a:nth-child(2) .text {
        display: grid;
        position: absolute;
        display: grid;
        position: absolute;
        right: auto;
        padding-top: 24px;
        padding-right: 24px;
        color: #0D0D0D;
        font-size: 17px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.17px;
        margin: 0;
        margin-bottom: 4px;
    }

    .lookscollections a:nth-child(2) .text p {
        text-align: left;
    }

    .partner-wrapper {
        display: grid;
        grid-column: 2/12;
        position: relative;
        top: calc(92px + 78px);
        padding: 80px 0;
    }

    /* Общие стили для обеих кнопок */
a.opt-price,
a.more {
    background-color: white;
    color: black;
    border: 1px solid black;
    font-weight: 600;
    height: 52px;
    font-size: 12px;
    line-height: 12px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0 24px;
    text-decoration: none; /* убирает подчёркивание */
    cursor: pointer; /* улучшает UX */
}

/* Специфичные стили */
a.opt-price {
    margin-left: 0;
}

a.more {
    background-color: black;
    color: white;
    margin-right: 0;
}

/* Hover только для a.more */
a.more:hover {
    background: var(--Primary-40, rgba(13, 13, 13, 0.40));
    color: #0D0D0D;
    border-color: var(--Primary, #0D0D0D); /* меняем только цвет */
    margin-right: 8px;
}

    .desctop {
        display: none;
    }

    .tablet-mobile {
        top: 58px;
        display: grid;
        padding: 0;
        margin: 0;
        grid-column: 1 / -1;
        grid-template-columns: 1fr;
    }

    .sf_h1 {
        display: grid;
        grid-column: 1 / -1;
        padding: 0 16px;
        grid-row: 6 / 7;
        position: relative;
        top: 205px;
        font-size: 17px;
    }

    .sf_content {
        display: grid;
        padding: 0 16px;
        grid-column: 1 / -1;
        grid-row: 7 / 8;
        position: relative;
        top: 205px;
        margin-bottom: 32px;
        font-size: 14px;
    }

    .accardion-container {
        display: grid;
    }

    .tablet-mobile button.accardion-footer {
    display: grid;
    align-items: center;
    justify-content: space-between;
    grid-auto-flow: column;
    padding: 14px 16px;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

.tablet-mobile button.accardion-footer.active {
    align-items: start;
}

    .accardion-footer.active+.accardion-item {
        border-bottom: 1px solid var(--Primary, #0D0D0D);

    }

    .bottom-block {
        display: grid;
        grid-auto-flow: dense;
        grid-template-columns: repeat(1, 1fr);
        padding: 24px 16px 32px 16px;
    }
    .tablet-mobile ul {
        margin: 0;
        list-style: none;
        text-decoration: none;
        background: #f2f2f2;
        padding: 0px;
    }

    .tablet-mobile ul li {
        display: flex;
        height: 44px;
        align-items: center;
        gap: 6px;
        align-self: stretch;
    }

    .tablet-mobile ul li a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-decoration: none;
    }

    .bottom-block .left {
        display: grid;
        align-items: start;
        justify-content: start;
        grid-row: 2;
    }

    .bottom-block .left .copiryght {
        display: grid;
        align-self: end;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
    }

    /* Общие типографические стили для всего блока .opt */
.opt p,
.opt p a,
.opt p span,
.opt span a {
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    line-height: 150%;
    letter-spacing: 0.1px; /* основное значение */
    margin: 0; /* если нужно */
}

/* Цвет и начертание */
.opt p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 600;
}

.opt p a,
.opt p span,
.opt span a {
    color: var(--Typography-Typography-Secondary, #808080);
    font-weight: 400;
}

/* Специфичные исключения */
.opt p a {
    color: var(--Typography-Typography-Primary, #0D0D0D); /* ← возвращаем основной цвет для ссылок внутри p */
}

.opt span a {
    letter-spacing: 0.11px; /* как в оригинале */
    text-decoration: none;
}
    .bottom-block .right .title,
    .bottom-block .left .title {
        margin: 0;
        margin-bottom: 4px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
    }

    .left .social {
        margin-bottom: 24px;
    }

    .left .social a {
        padding-right: 20px;
    }

    .bottom-block .block-first {
        margin: 0;
        margin-bottom: 24px;
    }

    .bottom-block .second-block {
        margin: 0;
        margin-bottom: 24px;
    }

    .accardion-footer .icon {
        display: inline-block;
        width: 16px;
        height: 16px;
        background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.00008 2.6665C8.36827 2.6665 8.66675 2.96498 8.66675 3.33317V7.33317H12.6667C13.0349 7.33317 13.3334 7.63165 13.3334 7.99984C13.3334 8.36803 13.0349 8.6665 12.6667 8.6665H8.66675V12.6665C8.66675 13.0347 8.36827 13.3332 8.00008 13.3332C7.63189 13.3332 7.33341 13.0347 7.33341 12.6665V8.6665H3.33341C2.96522 8.6665 2.66675 8.36803 2.66675 7.99984C2.66675 7.63165 2.96522 7.33317 3.33341 7.33317H7.33341V3.33317C7.33341 2.96498 7.63189 2.6665 8.00008 2.6665Z" fill="%230D0D0D"/></svg>') no-repeat center;
        background-size: contain;
        margin-left: 8px;
        transition: transform 0.3s;
    }

    .accardion-footer.active .icon {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.66675 8.00016C2.66675 7.63197 2.96522 7.3335 3.33341 7.3335H12.6667C13.0349 7.3335 13.3334 7.63197 13.3334 8.00016C13.3334 8.36835 13.0349 8.66683 12.6667 8.66683H3.33341C2.96522 8.66683 2.66675 8.36835 2.66675 8.00016Z" fill="%230D0D0D"/></svg>');
        transform: rotate(0deg);
    }

    .accardion-item {
        padding: 0 18px;
        background-color: #f2f2f2;
        display: none;
        overflow: hidden;
    }

    .breadcrumbs {
        height: 60px;
        display: grid;
        position: fixed;
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, 1fr);
        grid-row: 3 / 4;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid black;
        width: 100vw;
        z-index: 1;
        background: var(--Background, #F2F2F2);
        border-top: 1px solid black;
        transform: translateY(88px);
    }

   /* Общие стили */
.wrapper,
.wrapperFavorite {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
    justify-content: stretch;
    position: relative;
    width: 100%;
    grid-row: 5 / 6;
    grid-column: 1 / -1;
    z-index: 0;
    min-height: max-content;
}

/* Специфичные отступы */
.wrapper {
    top: 167px; /* calc() не нужен для простого числа */
}

.wrapperFavorite {
    top: 44px;
}

    .fullscreen-filter.opened {
        display: flex;
        position: fixed;
        top: -91px;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, 0);
        z-index: 3;
    }

    .filter-container.filterActive {
        background-color: #F2F2F2;
        display: flex;
        flex-direction: column;
        width: 100%;
        z-index: 1;
        position: fixed;
        height: 100vh;
        top: 0px;
        bottom: 0;
        border-right: 1px solid #0d0d0d;
        transform: translateX(0);
        z-index: 2;
    }

    .filter-content {
        display: flex;
        flex-direction: column;
        gap: 0px;
        padding: 20px;
        overflow-y: auto;
        max-height: 60vh;
    }

    #mse2_filters div {
        gap: 0px !important;
    }

    .accordion,
    .widget {
        background: var(--Background, #F2F2F2);
        color: #0D0D0D;
        cursor: pointer;
        width: 100%;
        text-align: left;
        border: none;
        outline: none;
        transition: 0.4s;

        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .sort-button {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
        padding: 0px;
    }

    .widget .widget {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 16px;
        padding: 0px;
    }

    #catalog_sort_block .value label {
        display: flex;
        height: 44px;
        width: 100%;
        justify-content: center;
        align-items: center;
        gap: 8px;
        border: 0.5px solid var(--Secondary, #808080);
        background: var(--Background, #F2F2F2);
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .filter-group li label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px; /* ← единая высота */
    padding: 0 16px; /* ← единый padding */
    gap: 8px; /* ← добавлено для согласованности */
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

.filter-group li label:hover {
    background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05)); /* ← добавлен визуальный фидбек */
}

    .descr {
        position: relative;
        display: flex;
        width: 100%;
        align-items: center;
        flex-direction: row;
        justify-content: space-between;
        bottom: 0;
        margin-top: 0px;
        height: 50px;
    }

    .title-price {
        display: grid;
        grid-auto-flow: row;
        justify-content: start;
        width: 100%;
    }

    .product-cart a {
        color: black;
        text-decoration: none;
        display: flex;
        flex-direction: column;
        height: 100%;
        align-items: stretch;
        justify-content: space-between;
    }

    .like {
        display: none;
        position: absolute;
        height: 24px;
        width: 24px;
        bottom: 24px;
        top: 94%;
        right: 8.33px;
        z-index: 1;
    }

    .like-mobile {
        display: grid;
        position: relative;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.24074 2.00001L5.2507 2C6.28181 2.00626 7.26899 2.41715 7.99993 3.1438C8.35849 2.7839 8.78418 2.49774 9.25295 2.30157C9.72817 2.10271 10.2382 2.0003 10.7533 2.0003C11.2685 2.0003 11.7785 2.10271 12.2537 2.30157C12.7284 2.50021 13.1589 2.79112 13.5202 3.15743C14.255 3.89575 14.6675 4.89499 14.6675 5.93665C14.6675 6.97862 14.2547 7.97814 13.5196 8.71652C13.5194 8.71672 13.5192 8.71692 13.519 8.71712L8.47325 13.8029C8.34808 13.929 8.17771 14 7.99999 14C7.82227 14 7.6519 13.929 7.52673 13.8029L2.48034 8.71647C2.48025 8.71638 2.48043 8.71656 2.48034 8.71647C1.93422 8.16656 1.56213 7.46751 1.41117 6.70733C1.26017 5.94703 1.33681 5.15908 1.63147 4.44211C1.92614 3.72515 2.42574 3.11104 3.06774 2.67665C3.70975 2.24226 4.46562 2.00689 5.24074 2.00001ZM5.24759 3.33334C4.73652 3.33885 4.2383 3.49449 3.81494 3.78095C3.39019 4.06834 3.05966 4.47463 2.86471 4.94896C2.66976 5.4233 2.61906 5.9446 2.71896 6.44761C2.81885 6.95062 3.06491 7.41299 3.42631 7.77684L7.99999 12.3868L12.5743 7.77619C13.0609 7.28764 13.3341 6.62619 13.3341 5.93665C13.3341 5.24711 13.0609 4.58567 12.5743 4.09712L12.5718 4.09464C12.3343 3.8536 12.0512 3.6622 11.739 3.53155C11.4268 3.40091 11.0917 3.33364 10.7533 3.33364C10.4149 3.33364 10.0799 3.40091 9.76766 3.53155C9.45547 3.6622 9.17236 3.8536 8.9348 4.09463L8.92894 4.10057C8.79137 4.23671 8.67144 4.38958 8.57205 4.55566C8.45166 4.75684 8.23444 4.87999 7.99999 4.87999C7.76554 4.87999 7.54833 4.75684 7.42793 4.55566C7.32855 4.38958 7.20865 4.23667 7.07107 4.10053L7.06791 4.0974C6.58514 3.61326 5.93115 3.3388 5.24759 3.33334Z" fill="%230D0D0D"/></svg>');
        background-position: center;
        background-repeat: no-repeat;
        height: 24px;
        width: 24px;
        right: 8px;
        z-index: 1;
    }

    .like-mobile.is-actived {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M20.28 4.74017C19.7387 4.19231 19.0941 3.75734 18.3834 3.46047C17.6727 3.16361 16.9102 3.01074 16.14 3.01074C15.3699 3.01074 14.6074 3.16361 13.8967 3.46047C13.186 3.75734 12.5414 4.19231 12 4.74017C11.4587 4.19231 10.8141 3.75734 10.1034 3.46047C9.39273 3.16361 8.63022 3.01074 7.86004 3.01074C7.08987 3.01074 6.32735 3.16361 5.61669 3.46047C4.90603 3.75734 4.26136 4.19231 3.72004 4.74017C2.62444 5.85159 2.01025 7.34953 2.01025 8.91017C2.01025 10.4708 2.62444 11.9687 3.72004 13.0802L11.29 20.7002C11.383 20.7939 11.4936 20.8683 11.6155 20.9191C11.7373 20.9698 11.868 20.996 12 20.996C12.1321 20.996 12.2628 20.9698 12.3846 20.9191C12.5065 20.8683 12.6171 20.7939 12.71 20.7002L20.28 13.0802C21.3829 11.9726 22.0021 10.4732 22.0021 8.91017C22.0021 7.34714 21.3829 5.84777 20.28 4.74017Z' fill='%230D0D0D'/%3E%3C/svg%3E");

    }

    .descr .title {
        margin: 0px;
        padding-left: 16px;
        margin-bottom: 6px;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .descr .price {
        margin: 0px;
        padding-left: 16px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
        text-align: left;
    }

    ul.breadcrumb {
        display: none;
    }

    .mobile-crumbs {
        width: 100%;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        grid-column: 1 / -1;
        padding: 0;
    }

    .mobile-crumbs h3.sf_h1 {
        position: static;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .mobile-crumbs .pagetitle {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .mobile-crumbs h2 {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-align: right;
        margin: 0;
        margin-right: 16px;
    }

    p.sale {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        position: absolute;
        top: 16px;
        left: 16px;
        z-index: 2;
        margin: 0;
    }

    .mobile-crumbs .pagetitle a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .mobile-crumbs .allmodels {
        color: var(--Typography-Typography-Secondary, #808080);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .mobile-crumbs .mobile-title {
        display: grid;
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        grid-auto-flow: column;
        margin-left: 16px;
        align-items: center;
        justify-content: start;
    }

    a.backer {
        display: grid;
        text-decoration: none;
        grid-row: 1 / 3;
        margin-right: 8px;
    }

    .mobile-crumbs .mobile-title a.backer {
        display: grid;
        grid-row: 1 / 3;
        margin-right: 8px;
    }

    .mobile-crumbs .mobile-title .text {
        display: grid;
        grid-row: 1 / 2;
    }

    .mobile-crumbs .mobile-category {
        display: grid;
        grid-column: 2 / -1;
        justify-content: end;
        align-items: center;
        margin-right: 16px;
    }

    .mobile-crumbs .mobile-category a {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-decoration: none;
    }

    .button-container {
        display: grid;
        grid-column: 1 / 2;
        grid-auto-flow: column;
        align-items: center;
        justify-content: center;
    }

    .button-container button#openFIlter {
    display: grid;
    place-items: center;
    place-content: center;
    width: 100vw;
    height: 100%;
    padding: 0 24px;
    gap: 8px;
    background: #F2F2F2;
    border: none;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-weight: 600;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    line-height: 100%;
    text-align: center;
    cursor: pointer; /* ← улучшает UX */
}

.button-container button#openFIlter:hover {
    background: rgba(13, 13, 13, 0.20);
}

    .chips {
        display: none;
    }

    .product-wrapper {
        display: grid;
        grid-template-columns: 16px repeat(10, 1fr) 16px;
        position: relative;
        top: calc(28px + 44px + 64px + 14px);
        grid-column: 1 / -1;
        grid-row: 5 / 6;
    }

    .slider-box {
        position: relative;
    }



    .gallery-with-other .prev,
    .gallery-with-other .next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 1;
    }

    .gallery-with-other .back {
        left: 0;
    }

    .gallery-with-other .next {
        right: 0;
    }

    .gallery-with-other {
        display: grid;
        grid-column: 1 / -1;
        grid-template-rows: auto auto;
        align-items: start;
        justify-content: start;
        border-right: 1px solid black;
        margin-bottom: 24px;
    }

    .size-unit {
        display: grid;
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
        align-self: stretch;
        border-top: none;
        border-bottom: none;
        grid-column: 2 / -1;
        grid-row: 1 / 3;
    }

    .unit {
        display: grid;
        width: 100%;
    }

    .unit .counter {
        display: grid;
        grid-auto-flow: column;
        margin-bottom: 16px;
        justify-content: start;
    }

    .unit .counter-add {
        display: grid;
        grid-column: 1;
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: start;
        justify-content: space-between;
        width: 100%;
    }

    /* Общие стили для обеих кнопок */
.unit #minus,
.unit #plus {
    display: flex;
    width: 44px;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    border: 1px solid var(--Primary, #0D0D0D);
    background: #f2f2f2;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

/* Hover-состояния */
.unit #minus:hover {
    background: #808080;
}

.unit #plus:hover {
    background: #838383;
}

/* Active-состояния */
.unit #minus:active,
.unit #plus:active {
    background: #0D0D0D;
    outline: 0;
}

/* Disabled-состояния */
.unit #minus:disabled,
.unit #plus:disabled {
    border-color: var(--Primary, #B2B2B2);
    color: #B2B2B2;
    cursor: not-allowed;
}

    .add-width-fav {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / 12;
        gap: 8px;
        top: 0px;
        width: 100%;
        justify-content: stretch;
        align-items: start;
        position: relative;
    }

    #addZakButton {
        display: none;
        width: 100%;
    }

    #addZak {
        display: flex;
        height: 44px;
        width: 100%;
        padding: 0px 24px;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Color-White-100, #F2F2F2);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        border: none;
    }

    .back {
        display: grid;
        grid-column: 1 / 2;
        height: 60px;
    }

    .info-wrapper {
        grid-column: 1 / -1;
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 40px;
    }

    .with-this-product {
        display: grid;
        grid-column: 1 / -1;
        align-self: end;
        border-right: 1px solid black;
    }

    .gallery-wrapper {
        display: none;
    }

    .mobile-gallery-wrapper {
        display: grid;
    }

    .mobile-gallery-wrapper.single-slide a {
        display: grid;

    }

    .mobile-gallery-wrapper.single-slide a img {
        display: grid;
        grid-column: 1 / -1;
        height: auto;
        width: 100%;
    }

    .mobile-gallery-wrapper.slick-initialized .slick-slide {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }

    .mobile-gallery-wrapper .slick-slide img {
        display: block;
        width: 100vw;
    }

    .progress {
        display: flex;
        margin: 0 16px;
        bottom: 18px;
        height: 2px;
        overflow: hidden;
        background-color: #f5f5f5;
        background-image: linear-gradient(to right, black, black);
        background-repeat: no-repeat;
        background-size: 0 100%;
        transition: background-size .4s ease-in-out;
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
    }

    .slick-next {
        right: 25px;
    }

    .info-wrapper {
        grid-column: 2 / 12;
        grid-template-columns: repeat(10, 1fr);
        height: max-content;
        align-items: start;
        justify-items: start;
        display: grid;
        flex-direction: column;
        align-self: stretch;
        padding: 0px;
    }


    .product-head {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / -1;
        grid-template-columns: auto 0px;
        width: 100%;
    }

    .subtitle {
        display: grid;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 0;
        margin-right: 0px;
    }

    .tabcontentProduct {
        grid-column: 1/-1;
    }

    .prices {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1 / 2;
        gap: 8px;
    }

    .with-this-product h3 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-transform: uppercase;
        padding: 0 16px;
        margin-top: 32px;
    }

    .color-select {
        display: flex;
        flex-direction: column;
        width: AUTO;
        margin-bottom: 0;
        grid-column: 1 / -1;
        margin-bottom: 16px;
    }

    .not-auth-block {
        display: grid;
        grid-column: 1 / 12;
        width: 100%;
        grid-template-columns: 1fr 40px;
        gap: 8px;
        align-items: end;
    }

    .size-unit {
        display: grid;
        flex-direction: column;
        padding: 0;
        align-items: flex-start;
        width: 100%;
        gap: 24px;
        align-self: stretch;
        border-top: none;
        border-bottom: none;
        grid-template-columns: repeat(1, 1fr);
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .sizes {
        display: grid;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }

    #addZakButtonMobile {
        display: grid;
        grid-column: 1 / -2;
    }

    #addZakMobile {
        display: flex;
        height: 44px;
        width: 100%;
        padding: 0px 24px;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        border: 0.5px solid var(--Secondary-BTN-Stroke, #0D0D0D);
        background: var(--Secondary-BTN-Background, rgba(13, 13, 13, 0.10));
        color: var(--Secondary-BTN-Typography, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        border: none;
    }

    #addZakMobile .left {
        display: flex;
        align-items: center;
        justify-content: center;
    }

   .inputs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
}

/* Общие стили для всех опций */
.inputs .select-option {
    height: 44px;
}

/* Обычные опции */
.inputs .select-option:not(.select-all) {
    flex: 1 1 0;
    min-width: 0;
}

/* Опция "Выбрать всё" */
.inputs .select-option.select-all {
    flex: 1 1 100%;
    order: 1;
}

/* Общие стили для всех label */
.select-option label,
.inputs label[for="all"],
label.sizes-label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: var(--Background, #F2F2F2);
    border: 1px solid var(--Secondary, #B2B2B2);
    box-sizing: border-box;
    font-size: 14px;
    text-align: center;
    cursor: pointer;
}

/* Специфичные исключения */
.inputs label[for="all"] {
    padding: 0 16px;
    flex-direction: row;
    gap: 0;
    margin-right: 0;
}

.select-all label {
    padding: 8px 16px;
    height: 48px; /* ← обрати внимание: 48px vs 44px */
    text-align: center;
}

/* Disabled состояние */
.inputs label.disabled {
    height: 44px;
    gap: 8px;
    border: 0.5px solid var(--Secondary-BTN-Stroke, #B2B2B2);
    background: var(--Secondary-BTN-Background, #E6E6E6);
}

/* Активное состояние */
label.sizes-label.active {
    border-color: #0D0D0D; /* ← меняем только цвет */
}

/* Стили для .select-all как grid-элемента (если родитель — grid) */
.select-all {
    grid-column: span 3;
}

    .units {
        display: grid;
        grid-column: 1;
        width: 100%;
        margin-right: 4px;
    }

    .litle-products {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(4, auto);
    }

    #cartAddModal .ok-svg {
        display: grid;
        align-items: start;
        justify-content: center;
        padding-top: 32px;
        padding-bottom: 32px;
    }

    
    .inputs .select-option.select-all {
        grid-column: 1 / -1;
    }

    .select-option:not(.select-all) {
        width: 100%;
        height: 44px;
    }

    .sizes .litle-title {
        display: grid;
        grid-row: 1 / 2;
        grid-template-columns: repeat(1, 1fr);
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .litle-title h3 {
        display: grid;
        grid-column: 1 / -1;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
    }

   .litle-title a {
    display: grid;
    grid-column: 2 / -1;
    justify-content: end;
    margin-bottom: 0;
    /* Убрано margin-bottom: 0px → 0 (стандарт) */
}

.litle-title a:focus-visible {
    border: none;
    outline: none;
}

    .cart-wrapper {
        display: grid;
        grid-column: 1 / -1;
        padding: 0 16px;
        position: relative;
        top: 132px;
    }

    .cart-empty {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
        justify-content: center;
        height: auto;
        width: auto;
        position: relative;
        top: 105px;
        align-items: start;
        justify-content: center;
    }

    .cart-empty .title {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.48px;
    }

    .cart-empty h3 {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
        margin: 0;
        margin-bottom: 24px;
    }

    .empty-img {
        display: flex;
        height: 180px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        margin-bottom: 24px;
    }

    .cart-empty a {
        display: flex;
        width: auto;
        height: 44px;
        padding: 0 16px 0 22px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.42px;
        text-decoration: none;
    }

    .cart-empty .button {
        display: grid;
        align-items: start;
        justify-items: center;
    }

    #msOrder {
        display: flex;
        padding: 0 16px;
        grid-row: 3 / 5;
        grid-column: 1 / -1;
        justify-content: center;
        align-items: center;
        position: relative;
        top: 72px;
    }

    .header-cart-text {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        text-align: center;
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .table-header {
        display: grid;
        grid-template-columns: 16px 1fr 1fr 1fr 2fr 16px;
        padding-bottom: 16px;
        border-bottom: 0.5px solid var(--Secondary, #808080);
    }

    .table-content .child {
        display: grid;
        grid-template-columns: 16px 1fr 1fr 1fr 2fr 16px;
    }

    .products-wrapper {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
    }

    .cart-product {
        display: none;

    }

    .cart-filter-buttons {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        gap: 16px;
        margin-bottom: 24px;
    }

    .cart-conteiner {
        display: grid;
        grid-column: 1 / -1;
    }

    .cart-product-mobile {
        display: grid;
        grid-template-columns: 1fr;
    }

   .cart-product-mobile-test {
        display: grid
;
        grid-auto-flow: column;
        height: 176px;
        padding: 16px 0;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        align-self: stretch;
        grid-column: 1/ -1;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
    }
.cart-product-mobile-test .left-mobile-block {
    display: grid
;
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        grid-auto-flow: column;
        grid-template-columns: max-content;
    }
        .cart-product-mobile-test .left-mobile-block .center {
        display: grid
;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        grid-template-rows: 26px 36px auto;
    }
        .cart-product-mobile-test .left-mobile-block .center .sizes {
        display: grid
;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        align-self: end;
        /* grid-template-columns: repeat(2, 1fr); */
    }
    .cart-product-mobile-test .left-mobile-block .center .selected-sizes-test{
        display: grid
;
    grid-auto-flow: column;
    gap: 8px;
    align-items: center;
    }
     .cart-product-mobile-test .left-mobile-block .center .rost-group{
         display: grid;
         grid-auto-flow: column;
         gap: 8px;
     }
     .cart-product-mobile-test .left-mobile-block .center .size-group {
        display: grid;
       grid-auto-flow: column;
        grid-template-columns: repeat(auto-fit, minmax(20px, 1fr)); /* ← ключевая строка */
        gap: 4px;
        width: 100%;
        align-items: center;
        justify-content: stretch; /* не обязателен, но для ясности */
    }

    .cart-product-mobile-test .left-mobile-block .center .size-item {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 20px; /* или как в дизайне */
        padding: 0 4px;
        text-align: center;
        white-space: nowrap;
        /* Убираем display: grid — он не нужен здесь */
    }
    .sizes  .title {
        color: var(--Typography-Typography-Primary, #1A1A1A);
font-family: "Ubuntu Sans";
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 100%; /* 12px */
    }
    .sizes .size-item{
        color: var(--Typography-Typography-Primary, #1A1A1A);
font-family: "Ubuntu Sans";
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 16.5px */
letter-spacing: 0.11px;
height: 20px;
padding: 0 4px;
justify-content: center;
align-items: center;
gap: 4px;
flex: 1 0 0;
background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
    } 
    .sizes .rost-title{
        color: var(--Typography-Typography-Primary, #1A1A1A);
font-family: "Ubuntu Sans";
font-size: 11px;
font-style: normal;
font-weight: 500;
line-height: 160%; /* 17.6px */
text-wrap: nowrap;
    }
.cart-product-mobile-test .right-mobile-block{
    display: grid
;
    grid-row: 1;
}
.cart-product-mobile-test .info-buttons{
    display: grid
;
    grid-auto-flow: column;
    grid-column: 1 / -1;
    grid-row: 2 / -1;
    justify-content: space-between;
    margin-top: 16px;
}
      .cart-product-mobile-test .product-img {
        display: grid
;
        place-items: center;
        padding-right: 16px;
        height: 120px;
        width: 80px;
        overflow: hidden;
        border-radius: 4px;
    }  
        .cart-product-mobile-test .product-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .price_info .fullprice {
    color: var(--Typography-Typography-Primary, #1A1A1A);
text-align: right;
font-family: "Ubuntu Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 100%; /* 14px */
    margin: 0;
    margin-bottom: 4px;
}
    
.cart-product-mobile .product-top-content {
        display: grid
;
        gap: 12px;
        grid-template-columns: 125px auto;
        margin-bottom: 16px;
    }
.cart-product-mobile-test .center .title{
    color: var(--Typography-Typography-Primary, #1A1A1A);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.54px;
    display: grid
;
    margin: 0;
    margin-bottom: 6px;
    text-wrap: nowrap;
}
.cart-product-mobile-test .center .description{
    color: var(--Typography-Typography-Secondary, #808080);
font-family: "Ubuntu Sans";
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: 100%; /* 11px */
text-wrap: nowrap;
}

.cart-product-mobile .right-mobile-block{
    display: grid;
}
.cart-product-mobile .product-title-remove .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 20px;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        align-self: center;
        justify-content: center;
    }
.cart-product-mobile .descritpion p{
    margin: 0;
}
.cart-product-mobile .descritpion span{
   color: var(--Typography-Typography-Primary, #0D0D0D);
/* Mobile/Body 150% */
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 18px */
}
.cart-product-mobile .product-title-remove{
    display: grid;
    grid-template-columns: 1fr 40px;
    
}
.cart-product-mobile button.remove {
    display: flex;
height: 36px;
padding: 0px 8px;
justify-content: center;
align-items: center;
border: none;
}
.cart-product-mobile .remove p {
    display: none;
}
.cart-product-mobile .description{
    color: var(--Typography-Typography-Primary, #0D0D0D);
/* Mobile/Body 150% */
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 18px */
}
    .sizes .title {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 8px;
    }
.sizes .selected-sizes{
        display: grid
;
    grid-auto-flow: column;
    align-items: start;
    justify-content: start;
}
.selected-sizes div {
    display: flex;
    width: 26px;
    height: 26px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    background: var(--Primary, #0D0D0D);
    color: var(--Typography-Typography-On-Color, #F2F2F2);
/* Desktop/Body 100% Emphasizes */
font-size: 13px;
font-style: normal;
font-weight: 600;
line-height: 100%; /* 13px */
letter-spacing: 0.13px;
}
.show-hide-mobile{
    display: flex
;
    height: 40px;
    padding: 0;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    border: none;
    color: var(--Tertiary-BTN-Default-Typpography, rgba(13, 13, 13, 0.95));
font-family: "Ubuntu Sans";
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 100%; /* 12px */
letter-spacing: 0.36px;
text-transform: none;
background-color: #f2f2f2;
}

    .send-button {
        display: grid;
        width: 100%;
        grid-column: 1 / -1;
        padding-bottom: 24px;
        padding-top: 24px;
    }

   .sender-zakaz {
    display: flex;
    width: 100%;
    height: 52px;
    padding: 0 24px;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: none;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    cursor: pointer; /* ← улучшает UX */
    /* Удалено right: 0 — не работает без position */
}

.sender-zakaz:hover {
    background: var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

    .back {
        display: none;
        height: 0px;
    }

    .prices {
        display: none;
    }

    .mobile-prices {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: max-content;
        gap: 8px;
        align-items: start;
        justify-content: start;
        margin-bottom: 16px;
    }

    .mobile-prices p.old-price {
        display: grid;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: 0.42px;
        margin: 0;
        margin-bottom: 24px;
    }

    .tabProduct {
        display: grid;
        grid-auto-flow: column;
        grid-column: 1/ -1;
        align-items: start;
        justify-content: stretch;
        gap: 8px;
        margin-bottom: 8px;
    }

    .info-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.48px;
        text-transform: uppercase;
    }

    .info-wrapper p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
    }

   p.price-one,
p.old-price {
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    line-height: 100%;
    letter-spacing: 0.14px;
}

p.price-one {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-weight: 500;
}

p.old-price {
    color: var(--Typography-Typography-Tertiary, #B2B2B2); /* ← исправлена опечатка */
    font-weight: 400;
    text-decoration: line-through; /* ← корректное свойство */
}

    .product-like, .product-like.is-active {
        height: 42px;
        width: 42px;
        justify-self: center;
        margin-left: 0px;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
    }

    #color,
#color span {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    line-height: 100%;
    letter-spacing: 0.36px;
    text-transform: capitalize;
}

#color {
    font-weight: 500;
}

#color span {
    font-weight: 400;
}

    .litle-title h3 {
        display: grid;
        grid-column: 1 / 2;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .sizeTable {
        color: var(--Secondary, #808080);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.16px;
        text-transform: uppercase;
    }

    .sizes .litle-title {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .unit h3 {
        display: none;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    #product-form {
        display: grid;
        grid-column: 1 / 12;
        margin-top: 0px;
        width: 100%;
    }

    .succes-block {
        display: none;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: center;
        width: 100%;
        text-align: center;
    }

    .precart-table.added {
        display: grid;
        grid-column: 1 / 20;
        margin-top: 32px;
    }

    .title-with-price {
        display: flex;
        align-items: start;
        flex-direction: column;
        justify-content: start;
        position: relative;
        bottom: 0%;
        padding: 0 16px 0 16px;
        width: 90%;
        margin-bottom: 15px;
        margin-top: 15px;
    }

    .remove-this {
        padding: 0;
        border: none;
        border-bottom: 0.5px solid var(--Secondary, #808080);
        background-color: #f2f2f2;
    }

    .litle-products.slick-initialized .slick-slide {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }

    .title-like {
        display: grid;
        grid-auto-flow: column;
    }

    .title-like .like {
        display: grid;
        justify-self: end;
        position: relative;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="16" viewBox="0 0 18 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.27243 1.85967e-05L5.28588 0C6.67804 0.00834153 8.01089 0.556198 8.99776 1.52507C9.48188 1.0452 10.0566 0.663654 10.6895 0.402098C11.3312 0.136948 12.0198 0.000403246 12.7153 0.000403246C13.4108 0.000403246 14.0994 0.136947 14.741 0.402098C15.3819 0.666947 15.9632 1.05483 16.451 1.54324C17.4431 2.52767 18 3.86 18 5.24888C18 6.63816 17.4427 7.97087 16.4502 8.95537C16.4499 8.95564 16.4496 8.95591 16.4494 8.95617L9.63683 15.7372C9.46782 15.9054 9.2378 16 8.99785 16C8.7579 16 8.52787 15.9054 8.35887 15.7372L1.54545 8.9553C1.54532 8.95518 1.54557 8.95543 1.54545 8.9553C0.808101 8.22208 0.30573 7.29002 0.1019 6.27645C-0.101963 5.26271 0.00150337 4.21211 0.399348 3.25616C0.797193 2.3002 1.47174 1.48138 2.33854 0.902196C3.20535 0.323008 4.22589 0.00918702 5.27243 1.85967e-05ZM5.28168 1.77779C4.59165 1.78514 3.91898 1.99266 3.34737 2.3746C2.7739 2.75779 2.32763 3.29951 2.06442 3.93196C1.8012 4.5644 1.73275 5.25948 1.86763 5.93016C2.0025 6.60084 2.33471 7.21733 2.82266 7.70246L8.99785 13.849L15.1739 7.70159C15.8309 7.0502 16.1998 6.16826 16.1998 5.24888C16.1998 4.32949 15.8309 3.44756 15.1739 2.79617L15.1706 2.79285C14.8498 2.47148 14.4676 2.21626 14.0461 2.04207C13.6246 1.86789 13.1722 1.77818 12.7153 1.77818C12.2584 1.77818 11.806 1.86789 11.3845 2.04207C10.963 2.21626 10.5807 2.47147 10.26 2.79284L10.2521 2.80076C10.0663 2.98228 9.9044 3.18611 9.77022 3.40755C9.60767 3.67579 9.31439 3.83999 8.99785 3.83999C8.68131 3.83999 8.38803 3.67579 8.22548 3.40755C8.09129 3.18611 7.92941 2.98223 7.74367 2.80071L7.73939 2.79654C7.08757 2.15101 6.20459 1.78507 5.28168 1.77779Z" fill="%230D0D0D"/></svg>');
        height: 50px;
        width: 50px;
        bottom: 0px;
        top: 0%;
        right: 0px;
        z-index: 3;
        background-repeat: no-repeat;
        background-position: center;
    }

    .title-with-price h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.39px;
        margin: 0;
        margin-bottom: 6px;
    }

    .title-with-price .price {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .partner-wrapper {
        display: grid;
        grid-column: 1/-1;
        grid-template-columns: 1fr;
        position: relative;
        top: -3px;
        padding: 0px;
    }

    .blogtab.active {
        background: var(--Primary, #FFF);
        color: #0D0D0D;
        margin-bottom: 0px;
    }

    .partner-wrapper .text-wrapper {
        display: grid;
        grid-column: 1 / -1;
        padding: 32px 16px 64px 16px;
        align-items: start;
        justify-content: start;
        grid-template-rows: repeat(9, max-content);
    }

    .text-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 25px;
        letter-spacing: 0.48px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 8px;
    }


    .partner-wrapper .text-wrapper p {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        margin: 0;
        margin-bottom: 16px;
    }

    .info-wrapper p:last-child {
        margin-bottom: 0px;
    }

    .text-wrapper p.first-child {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        margin: 0;
        margin-bottom: 16px;
    }

    .partner-wrapper .text-wrapper h2 {
        display: grid;
        grid-auto-flow: column;
        justify-content: space-between;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
        margin: 0;
        margin-top: 32px;
        margin-bottom: 32px;
        cursor: pointer;
    }

    .partner-wrapper .text-wrapper h2 .svg {
        display: block;
    }

    .partner-wrapper .text-wrapper ul {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
        padding: 0 15px;
        margin: 0;
        background-color: #f9f9f9;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }

    .partner-wrapper .text-wrapper ul.active {
        max-height: 500px;
    }

    strong {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
    }

    .mobile-wrapper-block {
        display: flex;
        padding: 8px;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        align-self: stretch;
        text-align: center;
        background: var(--Primary-20, rgba(13, 13, 13, 0.20));
        margin: 0 16px;
        margin-bottom: 32px;
    }

    ..mobile-wrapper-block p,
.mobile-wrapper-block p a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 12px;
    font-style: normal;
}

.mobile-wrapper-block p {
    font-weight: 400;
    line-height: 150%;
}

.mobile-wrapper-block p a {
    font-weight: 600;
    line-height: 100%;
    text-decoration: none;
    cursor: pointer; /* ← улучшает UX */
}

    .partner-wrapper .form-wrapper {
        display: grid;
        grid-column: 1 / -1;
        height: fit-content;
        padding-left: 0px;
        padding: 0 16px;
    }

    .form-wrapper form button {
    display: grid;
    grid-auto-flow: column;
    height: 52px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: none; /* ← добавлено для согласованности */
    cursor: pointer; /* ← улучшает UX */
}

.form-wrapper form button:hover {
    justify-content: space-between; /* ← единственное отличие в layout */
    background: var(--Disable, #B2B2B2);
    color: #E6E6E6;
}

    .two-in-one .one {
        display: grid;
        grid-column: 1 / -1;
    }

    .two-in-one .two {
        display: grid;
        grid-column: 1 / -1;
    }

    

    .form-wrapper form button:hover svg path {
        fill: #E6E6E6;
    }

    .map-wrapper {
        display: grid;
        position: relative;
        top: 62px;
        grid-template-columns: repeat(1, 1fr);
        grid-column: 1/-1;
        margin-bottom: 64px;
        background: var(--Surfaces, #FFF);
    }

    .map-wrapper .select-country-mobile {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(12, 1fr);
        grid-auto-flow: column;
        margin-bottom: 32px;
    }

    .map-wrapper .list {
        max-height: 361px;
        width: calc(100% + 2px);
        left: -1px;
        margin: 0px;
        overflow-y: scroll !important;
    }

    .select-country-mobile .buttons {
        display: grid;
        grid-column: 1/4;
        grid-auto-flow: column;
    }

    .buttons .countryGet {
    display: grid;
    height: 44px;
    padding: 8px 0;
    align-items: center;
    border: none; /* ← исправлено: none, а не NONE */
    background: #f2f2f2;
    color: #808080;
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.6px;
    text-transform: uppercase; /* ← убран дубль */
    cursor: pointer; /* ← улучшает UX */
}

.buttons .countryGet.activeCountry {
    background: #fff;
    color: #0d0d0d;
}

    .select-country-mobile .city-select {
        display: none;
    }

    .select-country-mobile .city-select.grid {
        display: grid;
        grid-column: 4 / -1;
        align-items: center;
        height: 44px;
    }

    .city-list-select {
        display: grid;
        height: 44px;
        align-items: center;
        justify-content: start;
        padding: 0 16px;
        border: solid 1px;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Surfaces, #FFF);
    }

    .map-wrapper #map {
        display: grid;
        height: 310px;
        grid-column: 1 / -1;
        margin-bottom: 32px;
        padding: 0 16px;
    }

    .map-wrapper .select-country {
        display: none;
        height: 800px;
        grid-column: 1 / -1;
        grid-template-rows: 30px auto;
    }

    .map-wrapper .shops-container {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(1, 1fr);
        padding: 0 16px;
    }

    .shops-container h3 {
        display: grid;
        grid-column: 1/ -1;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.45px;
        text-transform: uppercase;
    }

    .shops-container .shopItem {
        display: grid;
        align-items: start;
        justify-content: start;
        grid-template-rows: max-content;
        margin: 0;
        margin-bottom: 12px;
        grid-template-columns: repeat(2, 1fr);
    }

    .shopItem h4 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.12px;
        margin: 0;
        margin-bottom: 4px;
        grid-column: 1;
    }

    .shopItem .shopDesc {
        display: grid;
        grid-column: 1;
    }

    .shopItem .shopDesc p {
        display: flex;
        flex-direction: column;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        margin: 0;
        margin-bottom: 4px;
    }

    .shopItem .shopDesc p span {
        display: grid;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 16px;
        margin: 0;
    }

    .shopItem a.yandexUrl {
        display: grid;
        grid-row: 1 / 3;
        grid-column: 2;
        align-items: center;
        justify-self: end;
        align-self: center;
        grid-auto-flow: column;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        text-decoration: none;
    }

    .nice-select:after {
        border-bottom: 2px solid #0D0D0D;
        border-right: 2px solid #0D0D0D;
        content: '';
        display: block;
        height: 5px;
        margin-top: -4px;
        pointer-events: none;
        position: absolute;
        right: 12px;
        top: 50%;
        -webkit-transform-origin: 66% 66%;
        -ms-transform-origin: 66% 66%;
        transform-origin: 66% 66%;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
        width: 5px;
    }

    .cart-filter {
        display: none;
        grid-template-columns: repeat(12, auto);
        grid-column: 1 / 12;
        align-items: center;
        justify-content: stretch;
        justify-items: stretch;
        text-align: center;
        padding: 64px 0;
    }

    .cart-wrapper h1 {
        color: var(--Color-Black-100, #0D0D0D);
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.72px;
        text-transform: uppercase;
        margin-top: 80px;
        margin-bottom: 0px;
        display: none;
    }

    .cart-wrapper .info {
        display: none;
    }

    .cart-wrapper .right-mobile-block .info {
        display: grid;
    }

    .personal-wrapper {
        display: grid;
        grid-column: 1/ -1;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: 44px auto;
        position: relative;
        top: 60px;
        margin-top: 0;
    }

    .personal-tabs {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 1fr 1fr;
        align-items: center;
        height: max-content;
        padding: 0;
    }

    .partner-wrapper h3 {
        text-transform: uppercase;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.2px;
        padding: 0 16px;
    }
   .partner-wrapper .check_with_text h3 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    margin-bottom: 4px;
}

    .table-content-personal .bottom {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        grid-template-columns: auto;
    }

    .tab-vert {
        background: var(--Surfaces, #FFF);
        display: grid;
        border: none;
        padding: 16px;
        text-align: start;
        color: #808080;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        align-items: center;
        justify-content: center;
    }

    .personal-tabs-content {
        margin-top: 32px;
        align-items: start;
        justify-content: start;
        display: grid;
        grid-column: 1 / -1;
        margin-bottom: 90px;
        padding: 0 16px;
    }

    .personal-content .subscribe-block {
        display: grid;
        grid-column: 4 / 7;
        grid-template-columns: 1fr;
        grid-row: 6 / 7;
    }

    .personal-content.active {
        display: grid;
        grid-template-columns: 1fr;
        grid-column: 1 / 9;
    }

    #fullscreen-button {
        display: grid;
        grid-row: 2;
        position: absolute;
        right: 9%;
        z-index: 0;
        background: transparent;
        padding: 10px;
        border: none;
        cursor: pointer;
    }

    .personaltable-header .number,
    .personaltable-header .date,
    .personaltable-header .price {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.3px;
        text-transform: uppercase;
        display: grid;
        align-self: center;
        justify-self: start;
    }

    .table-content-personal {
        display: grid;
        grid-column: 1 / 4;
        grid-template-columns: 1fr 1fr 1fr 2fr;
        height: auto;
        padding: 12px 0;
        align-items: center;
        justify-content: space-between;
        border-bottom: 0.5px solid var(--Primary, #0D0D0D);
    }

    .personal-content.active form {
        display: grid;
        grid-column: 1 / -1;
    }

    .personal-content.active form .osn-info {
        display: grid;
        grid-column: 1 / -1;
    }

    .personal-content.active form .contact-info {
        display: grid;
        grid-auto-rows: max-content;
        grid-column: 1 / -1;
    }

    .personal-content.active form .address-info {
        display: grid;
        grid-column: 1 / -1;
    }

    .personal-content.active form input[type=submit] {
        display: grid;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: center;
        text-transform: uppercase;
        background: var(--Buttons-CTA-Default, #0D0D0D);
        color: var(--Typography-Typography-CTA-Default, #F2F2F2);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: uppercase;
    }

    .table-content-personal .number,
    .table-content-personal .date,
    .table-content-personal .summa {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.12px;
        text-decoration: none;
    }

    .table-content-personal .excell {
        display: none;
    }

    .map-wrapper #map.fullscreen {
        height: 100vh !important;
        margin-bottom: 0;
        grid-column: 1/ -1;
    }

    .select-country-mobile .buttons {
        display: grid;
        grid-column: 1 / -1;
        grid-auto-flow: column;
        margin-bottom: 24px;
    }

    .select-country-mobile .city-select.grid {
        display: grid;
        grid-column: 1 / -1;
        margin: 0 16px;
        align-items: center;
        height: 44px;
        border: 1px solid var(--Primary, #0D0D0D);
        background: var(--Surfaces, #FFF);
    }

    .contact-wrapper {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-column: 1/-1;
        position: relative;
        top: 120px;
        margin-top: 0px;
        padding: 0 16px;
    }

    .contact-wrapper .title {
        display: none;
    }

    .contact-belarus {
        display: grid;
        grid-column: 1 / -1;
    }

    .preText {
        display: grid;
        grid-column: 1 / -1;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        gap: 4px;
        letter-spacing: 0.16px;
        margin-bottom: 16px;
    }

    .contact-city {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: start;
        gap: 4px;
    }

    .preText p {
        margin: 0;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        /* font-family: "Segoe UI"; */
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .contact-belarus .departments {
        display: grid;
        grid-column: 1 / -1;
    }

    .department h5 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        /* 18px */
        letter-spacing: 0.12px;
        margin: 0;
        margin-bottom: 4px;
    }

    .department p {
        display: flex;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        /* 18px */
        letter-spacing: 0.12px;
        gap: 4px;
        margin: 0;
        margin-bottom: 4px;
    }

    .contact-belarus .ved {
        display: grid;
        grid-column: 1 / -1;
    }

    .contact-russia {
        display: grid;
        grid-column: 1 / -1;
        grid-row: 1 / 2;
        align-items: start;
        justify-items: start;
        justify-content: start;
        height: max-content;
        margin-bottom: 24px;
    }

    .contact-map-container h2 {
        display: none;
        grid-column: 2 / 4;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 130%;
        letter-spacing: 0.6px;
        text-transform: uppercase;
    }

    .contact-map-container {
        display: grid;
        grid-column: 1/ -1;
        position: relative;
        top: 150px;
        padding: 0 16px;
    }

    #contact-map {
        width: 100%;
        height: 330px;
        grid-column: 2 / 12;
        margin: 0;
    }



    .cookieconsent {
        display: grid;
        position: fixed;
        width: 100%;
        justify-content: stretch;
        bottom: 0;
        z-index: 2;
        right: 0;
    }

    .cookieconsent_container {
        display: flex;
        width: 100%;
        padding: 16px 16px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 0;
    }

    .cookieconsenttext {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.13px;
        margin-bottom: 32px;
    }

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

   /* Общие стили для обеих кнопок */
.cookieconsent_container .ok,
.cookieconsent_container .neok {
    display: flex;
    height: 44px;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    font-family: "Ubuntu Sans", sans-serif; /* ← рекомендуется явно указать */
    font-size: 14px; /* ← уточни размер из макета */
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
.cookieconsent_container .ok {
    margin-bottom: 8px;
    /* background и border по умолчанию (например, CTA-стиль) */
    background: var(--Buttons-CTA-Default, #0D0D0D);
    color: var(--Color-White-100, #F2F2F2);
    border: none;
}

.cookieconsent_container .neok {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

    .wrapper404 {
    display: grid;
    position: relative;
    top: 88px;
    grid-column: 2 / 12;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    justify-content: center;
    margin-bottom: 64px;
}

.text404 {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0.2px;
    display: grid;
    grid-column: 1 / -1;
    margin: 16px 0 32px 0;
}

.description404 p {
    color: var(--Typography-Typography-Primary, #0D0D0D);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.14px;
    margin: 0 0 24px 0;
}

/* Общие стили для кнопок */
.buttons404 .cat,
.buttons404 .ind {
    display: flex;
    height: 40px;
    padding: 0 16px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    align-self: stretch;
    width: 100%;
    cursor: pointer; /* ← улучшает UX */
}

/* Специфичные стили */
.buttons404 .cat {
    background: var(--Primary, #0D0D0D);
    border: none;
    margin-bottom: 8px;
}

.buttons404 .ind {
    border: 1px solid var(--Primary, #0D0D0D);
    background: var(--Background, #F2F2F2);
}

/* Общие стили для ссылок внутри кнопок */
.buttons404 .cat a,
.buttons404 .ind a {
    font-family: "Segoe UI";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.12px;
    text-decoration: none;
    text-transform: uppercase;
}

.buttons404 .cat a {
    color: var(--Typography-Typography-CTA-Default, #F2F2F2);
}

.buttons404 .ind a {
    color: var(--Typography-Typography-Primary, #0D0D0D);
}

    .article-wrapper {
        display: grid;
        grid-column: 1/-1;
        padding: 120px 16px 32px 16px;
        position: relative;
        top: 0px;
        margin-top: 0;
    }


    .article-wrapper-about {
        display: grid;
        grid-column: 1 / -1;
        padding: 0 16px;
        position: relative;
        top: 52px;
        margin-top: 64px;
        min-height: calc(100vh - 498px);
        grid-template-rows: 48px auto;
    }

    .article-wrapper h1 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.2px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 24px;
    }

    .article-wrapper .data {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
        margin: 0;
        margin-bottom: 24px;
    }

    .article-wrapper .preview {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
        margin: 0;
        margin-bottom: 24px;
    }

    .article-wrapper .text {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
        margin: 0;
        margin-bottom: 32px;
    }

    .caption {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: italic;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
        margin: 0;
        margin-top: 8px;
        margin-bottom: 32px;
    }

    .article-wrapper h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.16px;
        text-transform: uppercase;
        margin: 0;
        margin-bottom: 16px;
    }

    .modal-content {
        width: calc(100% - 64px);
        padding: 24px 16px 16px 16px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 32px;
        background-color: #f2f2f2;
        position: absolute;
    }

    #cartAddModal .modal-header {
        display: none;
    }

    .modal-content form input {
        display: flex;
        height: 48px;
        padding: 0px 16px;
        align-items: center;
        border: none;
        border-radius: 0px;
        gap: 4px;
        align-self: stretch;
    }

    .blog-wrapper {
        display: grid;
        grid-column: 1/-1;
        grid-template-columns: repeat(12, 1fr);
        grid-auto-rows: max-content;
        position: relative;
        margin-top: 0px;
        top: 90px;
        min-height: calc(100vh - 265px);
    }

    .blog-tabs {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-flow: column;
        height: 44px;
        padding: 0px;
        background: var(--Surfaces, #FFF);
        justify-content: space-between;
    }

    .blogtab {
        display: grid;
        padding: 8px 0px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        align-items: center;
        letter-spacing: 0.14px;
        margin-bottom: 0px;
        justify-content: center;
        background: #f2f2f2;
        margin-bottom: 0px;
    }

   
    .tabs-content {
        display: grid;
        grid-column: 1 / -1;
    }

    .tabs-content .blog-item .blog-img {
        display: grid;
        grid-column: 1 / -1;
        padding: 0 16px;
    }

    .item-info {
        display: grid;
        grid-column: 1 / -1;
        margin: 0;
        padding: 0 16px;
        margin-top: 16px;
    }

    .item-info h2 {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.16px;
        text-transform: uppercase;
        margin: 0;

        margin-bottom: 8px;
    }

    .item-info .data {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 10px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.1px;
        margin: 0;
        margin-bottom: 8px;
    }

    .item-info .preview {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
        margin: 0;
        margin-bottom: 8px;
    }

    .blog-item a.moreLink {
        text-decoration: none;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        /* 21px */
        letter-spacing: 0.14px;
        margin-top: 8px;
    }

    .partner-wrapper h3.faq {
        color: var(--Typography-Typography-Primary, #0D0D0D);
        font-family: "Segoe UI";
        font-size: 28px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.28px;
        text-transform: uppercase;
        padding: 0 16px;
    }

    .partner-wrapper .answer-block {
        display: grid;
        padding: 0 16px;
    }

    .wrapper-search {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        justify-content: stretch;
        position: relative;
        top: calc(28px + 15px);
        width: 100%;
        grid-row: 5 / 6;
        grid-column: 1 / -1;
        z-index: 0;
    }

    .table-header-big {
        display: grid;
        padding: 16px 0;
        grid-column: 1 / -1;
        align-items: center;
        border-bottom: 0.5px solid var(--Secondary, #808080);
    }

    .product-option {
        display: grid;
    }

    .table-header-big .number {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .table-header-big .color {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        /* 18px */
        letter-spacing: 0.12px;
    }

    .table-header-big .size {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        /* 18px */
        letter-spacing: 0.12px;
    }

    .table-header-big .units {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
        grid-column: 4;
    }

    .table-header-big .cash {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .product-option .variant {
        display: grid;
        padding: 5.5px 0;
        grid-column: 1 / -1;
        align-items: center;
        border-bottom: 0.5px solid var(--Secondary, #808080);
    }

    .variant .number-value {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .variant .color-value {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .variant .size-value {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .variant .unit-value {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }

    .variant .unit-value .minus-button {
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        border: none;
        background: #F2F2F2;
    }

    .variant .unit-value .minus-button {
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        border: none;
        background: #F2F2F2;
    }

    .variant .unit-value input.unit {
        display: flex;
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        text-align: center;
        background: transparent;
        border: none;
        gap: 8px;
        color: var(--Typography-Typography-Primary, #0D0D0D);
        text-align: center;
        font-family: "Ubuntu Sans";
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
    }

    .variant .unit-value .plus-button {
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        border: none;
        background: #F2F2F2;
    }

    .variant .price-value {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .textPage-wrapper {
        display: grid;
        position: relative;
        grid-column: 1 / -1;
        padding: 0 16px;
        top: 100px;
        margin-bottom: 80px;
    }

    .textPage-wrapper h1 {

        margin: 0;
        margin-bottom: 24px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 28px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        letter-spacing: 0.28px;
    }

    .textPage-wrapper strong {

        margin: 0;
        margin-bottom: 12px;
        color: #000;
        font-family: "Segoe UI";
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.14px;
    }

    .textPage-wrapper span {

        color: #000;
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        letter-spacing: 0.12px;
    }

    .reg-wrapper {
        display: grid;
        grid-column: 1 / -1;
        position: relative;
        top: 24px;
        margin-right: 16px;
        margin-left: 16px;
    }

    .reg-wrapper .reg-form .regUnit p {
        margin: 0;
    }

    .reg-form .fio-block,
    .reg-form .yur-block,
    .reg-form .contact-block,
    .reg-form .password-block {
        display: grid;
        grid-auto-flow: row;
        gap: 16px;
        margin-bottom: 16px;
    }

    .reg-form .password-block,
    .reg-form .contact-block {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .reg-form .button-block {
        display: grid;
        grid-auto-flow: row;
        gap: 16px;
    }

    .personal-form form .fio-block-personal {
        display: grid;
        grid-column: 1 / -1;
        gap: 16px;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        margin: 0;
        margin-bottom: 16px;
    }

    .personal-form form .yur_deat_block {
        display: grid;
        grid-auto-flow: row;
        grid-column: 1 / -1;
        align-items: center;
        justify-content: stretch;
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .yur_address_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .yur_address_block .reg-block {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .yur_address_block .reg-block-big {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .contacts_block {
        display: grid;
        grid-auto-flow: row;
        align-items: center;
        justify-content: stretch;
        grid-column: 1 / -1;
        grid-template-columns: 1fr;
        gap: 16px;
        margin-bottom: 40px;
    }

    .personal-form form .contacts_block .reg-block-big {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .contacts_block .reg-block {
        display: grid;
        grid-column: span 1;
    }

    .personal-form form .send-block {
        display: grid;
        grid-auto-flow: row;
        grid-column: 1 / -1;
        margin-bottom: 40px;
    }

    .personal-form .button-block {
        display: grid;
        grid-auto-flow: row;
        grid-column: 1 / -1;
        gap: 16px;
    }

    .personal-form form .password-block {
        display: grid;
        grid-auto-flow: row;
        align-items: start;
        justify-content: stretch;
        grid-column: 1 / -1;
        grid-template-columns: 1fr;
        gap: 16px;
        margin-bottom: 40px;
    }

    .notauth {
        display: grid;
        grid-column: 1 / -2;
        width: 100%;
        height: 42px;
        margin-top: 32px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        border: 1px solid var(--CTA-BTN-Stroke, #0D0D0D);
        background: var(--CTA-BTN-Background, #0D0D0D);
        color: var(--CTA-BTN-Typography, #F2F2F2);
        font-family: "Segoe UI";
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0.36px;
        text-decoration: none;
        text-transform: uppercase;
    }
}


.subtitle .accordion {
    background-color: #f2f2f2;
    cursor: pointer;
    padding: 8px 0;
    width: 100%;
    text-align: left;
    outline: none;
    transition: 0.4s;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    border-top: 1px solid #B2B2B2;
    color: var(--Typography-Typography-Primary, #0D0D0D);
    font-family: "Ubuntu Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    /* 12px */
    letter-spacing: 0.36px;
    text-transform: uppercase;
}


/* Нижняя граница ТОЛЬКО у второй кнопки при загрузке */

.subtitle .item-accordion .accordion:nth-child(4) {
    border-bottom: 1px solid #B2B2B2;
}

.subtitle .panel {
    display: none;
    padding: 0px 0;
    background: #f2f2f2;
    overflow: hidden;
}


/* Стиль для открытой панели */

.subtitle .panel.active {
    display: block;
}


/* Граница для контента второй панели */

.subtitle .accordion:nth-child(4)+.panel.active {
    border-bottom: 1px solid #B2B2B2;
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
    .subtitle .item-accordion {
        width: 100%;
        display: grid;
        grid-column: 1 / -1;
        margin-bottom: 24px;
    }

    .subtitle .nighbors {
        display: flex;
        justify-content: space-between;
        margin-bottom: 0px;
        gap: 10px;
    }

    .subtitle .nighbors a,
    .subtitle .nighbors span {
        display: flex;
        width: 44px;
        height: 44px;
        justify-content: center;
        align-items: center;
        gap: 6px;
        border: 1px solid var(--Secondary-BTN-Stroke, #0D0D0D);
        text-decoration: none;
        transition: all 0.3s ease;
    }

    .subtitle .nighbors a:hover {
        opacity: 0.7;
        background-color: #f5f5f5;
    }

    .cart-product-mobile-test {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        grid-column: 1 / -1;

        height: 133px;
        padding: 20px 0;
        justify-content: space-between;
        align-items: flex-start;
        align-self: stretch;
        border-bottom: 1px solid var(--primary-transparent-primary-10, rgba(13, 13, 13, 0.10));
    }

    .cart-product-mobile-test .left-mobile-block {
        display: grid;
        grid-column: 1 / 2;
        grid-row: 1 / -1;
        grid-auto-flow: column;
        grid-template-columns: max-content;
    }

    .cart-product-mobile-test .product-img {
        display: grid;
        place-items: center;
        padding-right: 24px;
        height: 133px;
        width: 88px;
        overflow: hidden;
        border-radius: 4px;
    }

    .cart-product-mobile-test .left-mobile-block .center {
        display: grid;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        grid-template-rows: 26px 36px auto;
    }

    .cart-product-mobile-test .product-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .cart-product-mobile-test .center .title {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        margin-bottom: 8px;
    }

    .cart-product-mobile-test .center .description {
        color: var(--Typography-Typography-Secondary, #808080);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        margin-bottom: 24px;
    }

    .cart-product-mobile-test .center .sizes {
        display: grid;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        align-self: end;
    }

    .cart-product-mobile-test .center .sizes .title {
        color: var(--Typography-Typography-Primary, #1A1A1A);

        font-family: "Ubuntu Sans";
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
    }

    .cart-product-mobile-test .center .sizes .rost-group {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .cart-product-mobile-test .center .sizes .rost-title {

        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
    }

    .cart-product-mobile-test .center .sizes .size-group {
        display: flex;
        gap: 4px;
    }

    .cart-product-mobile-test .center .sizes .size-item {
        display: flex;
        width: 100%;
        height: 24px;
        padding: 0 4px;
        justify-content: center;
        align-items: center;
        gap: 4px;
        background: var(--primary-transparent-primary-5, rgba(13, 13, 13, 0.05));
        color: var(--Typography-Typography-Primary, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
    }

    .cart-product-mobile-test .right-mobile-block .info {
        display: grid;
    }

    .cart-product-mobile-test .right-mobile-block {
        display: grid;
        grid-column: 2 / -1;
        align-items: stretch;
        justify-content: end;
        height: 100%;
    }

    .price_info .fullprice {
        color: var(--Typography-Typography-Primary, #1A1A1A);
        text-align: right;
        font-family: "Ubuntu Sans";
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.54px;
        margin: 0;
        margin-bottom: 4px;
    }

    .cart-product-mobile-test .right-mobile-block .price_info {
        display: grid;
    }

    .price_info .info-buttons {
        display: grid;
        grid-auto-flow: column;
        align-self: end;
        gap: 24px;
    }

    .cart-product-mobile-test .info-buttons {
        display: grid;
        grid-auto-flow: column;
        grid-column: 2;
        grid-row: 2;
        align-self: end;
        align-items: stretch;
        justify-content: end;
        gap: 32px;
    }

    .price_info button {
        display: flex;
        height: 32px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        padding: 0;
        border: none;
        color: var(--Tertiary-BTN-Default-Typpography, #1A1A1A);
        font-family: "Ubuntu Sans";
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        letter-spacing: 0.36px;
        text-transform: none;
    }

    #msOrder {
        display: grid;
        grid-row: 3;
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: 24px repeat(10, 1fr) 24px;
        grid-column: 1 / 13;
        justify-content: end;
        align-items: end;
        position: relative;
        top: 170px;
        margin-top: 0px;
        margin-top: 40px;
        margin-bottom: 40px;
    }

    #msOrder .send-button {
        display: grid;
        grid-column: 2 / 12;
        width: 100%;
        padding-bottom: 0px;
        padding-top: 0px;
    }

    .sender-zakaz {
    display: flex;
    width: 100%;
    height: 44px;
    padding: 0 24px; /* ← добавлен для согласованности */
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    color: var(--CTA-BTN-Default-Typpography, #F2F2F2);
    font-family: "Ubuntu Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.42px;
    text-transform: uppercase;
    background: var(--Buttons-CTA-Default, #0D0D0D);
    border: none; /* ← рекомендуется явно указать */
    cursor: pointer; /* ← улучшает UX */
    /* Удалено right: 0 — не работает без position */
}

.sender-zakaz:hover {
    background: var(--Secondary, #808080);
    color: var(--Typography-Typography-Primary, #0D0D0D);
}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .subtitle .nighbors {
        display: flex;
        justify-content: space-between;
        margin-bottom: 0px;
        gap: 10px;
    }

    .subtitle .nighbors a,
    .subtitle .nighbors span {
        display: flex;
        width: 42px;
        height: 42px;
        justify-content: center;
        align-items: center;
        gap: 6px;
        border: 1px solid var(--Secondary-BTN-Stroke, #0D0D0D);
        text-decoration: none;
        transition: all 0.3s ease;
    }

    .subtitle .subtitle .item-accordion {
        width: 100%;
        display: grid;
        grid-column: 1 / -1;
        margin-bottom: 24px;
    }
}