/* =========================================================================
   DUALITY — все стили корзины, оформления заказа и виджета доставки.
   КУДА: Настройки сайта -> Дополнительно -> «Пользовательские CSS-стили».
   Вставлять ЧИСТЫЙ CSS, без тегов style.

   ЧТО ВНУТРИ:
     0. Токены брендбука (:root) — дублируются в хэдер-блоке, менять синхронно.
     1. Оформление заказа (t706 cartpage) — типографика, поля, кнопка, ошибки.
     2. Карточка товара + сайдбар корзины (t706) — grid-раскладка по макету.
     3. Виджет расчёта доставки (dl-*) — свой неймспейс, конфликтов с Тильдой нет.
     4. Пустой стейт и модалка подтверждения (du-*) — свой неймспейс.
     5. Шапка / меню / поиск / кабинет-сайдбар (dl-header, tlk-userbar, t985) —
        вынесено из HTML-блока шапки; JS шапки остаётся в коде меню.
     6. Аккордеон на странице товара (t-catalog__prod-popup).
     7. Попап «Спасибо!» после отправки формы (t-form-success-popup) —
        приведён к виду модалки du-modal.

   КАНОН КОРЗИНЫ: кнопку «Оформить» и заголовок дровера корзины держит СЕКЦИЯ 2
   (чёрный #0A0A0A). Секция 5 (шапка) те же .t706__sidebar-* НЕ трогает —
   конфликт снят; за ней остались лишь .t706__cartpage-* (страница оформления).

   ЧЕГО ТУТ НЕТ И ПОЧЕМУ: стили ЛК (tmst-*, tlk-*) живут style-блоком в
   хэдере (HTML-блок T123). Тильда компилирует это поле в custom.css и
   подключает его в head; на /members/* стили виджетов ЛК
   (tilda-members-store*.css) она подгружает ПОЗЖЕ, в конец head, — они
   перебивали бы отсюда наши правила той же специфичности. style в body
   выигрывает у любого head-стиля по позиции в каскаде, поэтому ЛК — там.

   «HTML-код для HEAD» должен быть ПУСТ от этих стилей.
   ========================================================================= */

/* ---------- Токены брендбука ----------
   Объявляем на :root, а не на .tmst-wrap: на /members/ обёртки
   .tmst-wrap нет (там .tmst-main .tmst-container), и переменные
   не доезжали — letter-spacing молча падал в normal.
   ДУБЛЬ этих же токенов лежит в  хэдер-блока
   (tilda-header-block.html) — менять синхронно. */
:root {
  --du-black:  #0A0A0A;
  --du-white:  #FFFFFF;
  --du-grey:   #A8A8A8;              /* рамка карточки заказа — из макета ЛК_текущие */
  --du-fog:    #F8F8F8;              /* подложка картинки товара */
  --du-line:   rgba(10, 10, 10, .12);
  --du-muted:  rgba(10, 10, 10, .45);
  --du-font:   'Geist', Arial, Roboto, 'Open Sans', sans-serif;
  --du-ls:     .1em;   /* letter-spacing = 10% кегля — правило из макетов */
}

/* =========================================================
   1. ОФОРМЛЕНИЕ ЗАКАЗА (Tilda T706 cartpage)
   Проверено вживую на dualitybeauty.com (корзина с товаром).
   Карточка товара стилизуется секцией 2 — здесь только форма,
   плашки итога, ошибки и колонки.
   ========================================================= */
.t706__cartpage{ font-family:'Geist','Helvetica Neue',Arial,sans-serif !important; color:#0A0A0A !important; }
.t706__cartpage-top{ border-bottom:1px solid #e8e8e8 !important; }

/* ——— Сумма по товарам (плашка итога) ——— */
.t706__cartwin-prodamount-price,
.t706__cartwin-prodamount-currency{ font-weight:400 !important; font-size:18px !important; color:#0A0A0A !important; }

/* ——— Форма заказа: поля ——— */
.t706__cartpage-form .t-input-title{ color:rgba(10,10,10,.45) !important; font-size:12px !important; font-weight:300 !important; letter-spacing:.4px !important; }
.t706__cartpage-form .t-input{ border-bottom:1px solid #ddd !important; color:#0A0A0A !important; border-radius:0 !important; }

/* ——— Доставка / согласия: карточки и фирменный акцент ——— */
.t-radio__wrapper-delivery{ border:1px solid #e0e0e0 !important; border-radius:0 !important; padding:16px 20px !important; margin-bottom:12px !important; }
.t706__cartpage input[type="radio"],
.t706__cartpage input[type="checkbox"]{ accent-color:#0A0A0A !important; }

/* ——— Кнопка «Оформить заказ» — бордо, капс, острые углы ——— */
.t706__cartpage .t-submit{
  background:#0A0A0A !important; background-image:none !important; color:#fff !important;
  border-radius:0 !important; text-transform:uppercase !important;
  letter-spacing:1.1px !important; font-weight:300 !important; font-size:12px !important;
}
.t706__cartpage .t-submit .t-btnflex__icon{ display:none !important; }

/* ——— Вертикальный разделитель между колонками + отступы ——— */
.t706__cartpage-form{ border-right:1px solid #e8e8e8 !important; padding-right:48px !important; }
.t706__cartpage-info{ padding-left:48px !important; }

/* Итоговая сумма (строка товара стилизуется секцией «Карточка товара» ниже) */
.t706__cartpage-amount{ font-weight:400 !important; }

/* ——— Ошибки формы заказа — под бренд (бордо #0A0A0A вместо тильдовского красного/лососёвого) ———
   Классы Тильды: .t-form__errorbox-wrapper — большая плашка «заполните обязательные поля»;
   .t-input-error — текст «Обязательное поле»; .js-error-control-box — контейнер невалидного поля
   (внутри красная рамка на .t-input / .t-checkbox__control). */
.t-form__errorbox-wrapper{
  background:#f7f7f7 !important; border:1px solid #0A0A0A !important; border-radius:0 !important;
  box-shadow:none !important; padding:14px 20px !important;
}
.t-form__errorbox-wrapper a,
.t-form__errorbox-wrapper span,
.t-form__errorbox-link,
.t-form__errorbox-middle{
  color:#0A0A0A !important; text-decoration:none !important; border:0 !important;
  font-family:'Geist','Helvetica Neue',Arial,sans-serif !important; letter-spacing:.3px !important;
}
.t-input-error{
  color:#0A0A0A !important; opacity:1 !important;
  font-family:'Geist','Helvetica Neue',Arial,sans-serif !important;
  font-size:12px !important; letter-spacing:.3px !important;
}
.js-error-control-box .t-input,
.js-error-control-box .t-checkbox__control{ border-color:#0A0A0A !important; }

/* ——— Убираем подчёркивания ссылок в корзине ———
   1) Согласие «Я соглашаюсь с офертой…» — весь текст обёрнут в <a href="/help/documents">,
      Тильда рисует подчёркивание не через text-decoration, а через box-shadow:inset 0 -1px.
   2) Баннер авторизации .t706__auth__link (ссылка «Авторизуйтесь…» / имя+email
      «Вы авторизованы как …» в залогиненном виде) — обычный text-decoration:underline.
   Префикс body + !important — чтобы перебить поздние tilda-members-*.css. */
body .t706__cartpage .t-checkbox__control a,
body .t706__cartpage .t-checkbox__control span a,
body .t706__auth__link,
body .t706__auth a{
  box-shadow:none !important; text-decoration:none !important; border-bottom:none !important;
}
/* Ховер — ровно 1px-подчёркивание, БЕЗ box-shadow.
   Тильда глобально вешает на hover `#allrecords .t-text a:hover, #allrecords .t-descr a:hover
   { box-shadow: inset 0 -1px !important }` (с ID → селектор без ID его не перебивал; лейбл
   согласия имеет .t-text, баннер авторизации — .t-descr). В Safari анимация этого inset-
   box-shadow на 2-строчной инлайн-ссылке давала «две жирные черты → одна толстая».
   Поэтому берём вес через СВОЙ #allrecords, гасим box-shadow и рисуем чистое
   text-decoration-подчёркивание 1px (его нет в transition — появляется без анимации). */
#allrecords .t706__cartpage .t-checkbox__control span a:hover,
#allrecords .t706__cartpage .t-checkbox__control a:hover,
#allrecords .t706__auth.t-descr .t706__auth__link:hover,
#allrecords .t706__auth.t-descr a:hover{
  box-shadow:none !important; border-bottom:0 !important;
  text-decoration:underline !important; text-decoration-thickness:1px !important; text-underline-offset:2px !important;
}

/* ——— (ОПЦИЯ) Порядок колонок как в макете: КОРЗИНА слева, форма справа.
   По умолчанию у Тильды форма слева. Раскомментируй, если хочешь как в макете: ———
.t706__cartpage-content{ display:flex !important; align-items:flex-start !important; }
.t706__cartpage-info{ order:1 !important; }
.t706__cartpage-form{ order:2 !important; }
*/

/* ===== МОБАЙЛ (<=600px): узкий дровер/страница корзины =====
   На телефоне дровер = ~100vw, а десктопные размеры (картинка 90px, степпер ~160px,
   крестик, паддинг контейнера 40px) не влезают -> строки уезжали за правый край
   (горизонтальный скролл). Ужимаем картинку/степпер/крестик, режем паддинг, и снимаем
   десктопный вертикальный разделитель колонок на cartpage. */
@media (max-width: 600px){
  .t706__sidebar-content{ padding-left:16px !important; padding-right:16px !important; }
  .t706__cartwin-prodamount-price{ font-size:14px !important; }
  /* На узком экране колонки складываются в одну. Убираем десктопный вертикальный
     разделитель, но держим СИММЕТРИЧНЫЙ отступ 20px с ОБЕИХ сторон у ОБЕИХ колонок.
     Раньше зануляли только внутренние паддинги (form padding-right:0, info padding-left:0)
     -> форма (доставка/согласие) прижималась к правому краю, а товары к левому: текст
     согласия «Я соглашаюсь…» упирался в край экрана и обрезался (Safari, iPhone). */
  .t706__cartpage-form{ border-right:0 !important; padding-left:20px !important; padding-right:20px !important; }
  .t706__cartpage-info{ padding-left:20px !important; padding-right:20px !important; }
}

/* =========================================================
   КОРЗИНА: карточка товара + сайдбар (t706)
   Классы t706 живут на всём сайте — карточка ЕДИНАЯ для
   сайдбара, cartwin и страницы оформления (корзина везде одна).
   Макет: «Корзина» 1200, компонент «Товар в корзине».
   ВСЕ декларации с !important: этот файл Тильда подключает в
    (custom.css), а свои стили корзины она частью кладёт
   инлайном в  и грузит позже на /members/* — без
   !important они перебивали бы нас по позиции в каскаде.
   ========================================================= */
.t706__sidebar-heading {
  font-family: var(--du-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 20px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-black) !important;
}

/* ---------- Карточка товара: раскладка по макету «Товар в корзине» ----------
   Тильда рисует строку как display:table в одну линию
   (фото | название | счётчик | цена | крестик).
   В макете — фото слева, а справа колонка: название → описание →
   цена → счётчик, крестик в правом верхнем углу.
   Перекладываем на grid и раздаём каждому элементу свою ячейку,
   поэтому порядок в разметке не имеет значения. */
.t706__product {
  display: grid !important;
  grid-template-columns: 133px 1fr 20px !important;
  /* 4 ряда: название → цена → РАСПОРКА(1fr) → счётчик.
     Распорка съедает свободное место и прижимает счётчик к низу колонки,
     а фото тянется на всю высоту (grid-row 1/-1) — поэтому НИЖНИЙ КРАЙ
     счётчика всегда на уровне низа фото при любой длине описания и на любом
     экране (проверено live: без описания и с описанием, десктоп и 375px). */
  grid-template-rows: auto auto 1fr auto !important;
  column-gap: 24px !important;
  align-items: start !important;
  min-height: 160px !important;
  padding: 24px 0 !important;
  /* Разделителя между товарами нет (просьба 2026-07-20). Не просто убираем
     свою строку, а гасим: у Тильды на .t706__product есть собственный
     border-bottom — без none он бы проступил обратно. */
  border-bottom: none !important;
}
.t706__product-thumb {
  grid-column: 1 !important;
  grid-row: 1 / -1 !important;       /* фото спанит ВСЕ ряды колонки */
  align-self: stretch !important;    /* и тянется на их полную высоту */
  display: block !important;
  width: 133px !important;
  /* у Тильды тут жёсткие 100px — картинка 160 вылезала на соседний товар */
  height: auto !important;
  min-height: 160px !important;
  padding: 0 !important;
}
.t706__product-imgdiv {
  width: 133px !important;
  height: 100% !important;           /* заполняет тянущийся thumb */
  min-height: 160px !important;
  background-size: cover !important;
  background-position: center !important;
  border-radius: 0 !important;
}
.t706__product-del-wrapper {
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: block !important;
  width: auto !important;
  text-align: right !important;
}

.t706__product-title {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 0 20px !important;
  font-family: var(--du-font) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  line-height: 20px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-black) !important;
}
/* Подчёркивание Тильда вешает разными способами — гасим все три */
.t706__product-title,
.t706__product-title a,
.t706__product-title * {
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* Описание и объём. Тильда кладёт сюда характеристики товара
   (сейчас — только артикул). Как добавите описание и объём
   характеристиками в карточку товара, они встанут сюда сами. */
.t706__product-title__option {
  display: block !important;
  margin-top: 8px !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 10px !important;
  line-height: 20px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-muted) !important;
}

/* Счётчик «− N ШТ. +» — геометрия как у счётчика на карточке товара.
   Раз строка больше не table, рамку можно вешать прямо на элемент. */
.t706__product-plusminus {
  grid-column: 2 !important;
  grid-row: 4 !important;               /* последний ряд — прижат к низу распоркой (1fr) */
  align-self: end !important;
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 116px !important;
  height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid var(--du-black) !important;
  border-radius: 0 !important;
}

/* Плюс/минус/крестик у Тильды — img-картинки с нарисованными кружками.
   CSS кружок не уберёт, поэтому картинку прячем и рисуем знак сами. */
.t706__product-minus img,
.t706__product-plus img,
.t706__product-del img {
  display: none !important;
}
.t706__product-minus,
.t706__product-plus,
.t706__product-del {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 14px !important;
  height: 14px !important;
  border: 0 !important;
  background: transparent !important;
  opacity: 1 !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  color: var(--du-black) !important;
  cursor: pointer !important;
}
.t706__product-minus::before { content: '\2212' !important; font-size: 12px !important; }
.t706__product-plus::before  { content: '+' !important;     font-size: 12px !important; }
.t706__product-del { width: 16px !important; height: 16px !important; }
.t706__product-del::before   { content: '\2715' !important; font-size: 13px !important; color: var(--du-muted) !important; }
.t706__product-del:hover::before { color: var(--du-black) !important; }

.t706__product-quantity {
  flex: 1 1 auto !important;
  text-align: center !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 10px !important;
  letter-spacing: var(--du-ls) !important;
  color: var(--du-black) !important;
}
.t706__product-quantity::after { content: ' \0448\0442.' !important; text-transform: uppercase !important; }

.t706__product-amount {
  grid-column: 2 !important;
  grid-row: 2 !important;
  display: block !important;
  width: auto !important;
  text-align: left !important;
  margin: 0 0 20px !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 10px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-black) !important;
  white-space: nowrap !important;
}

.t706__sidebar-prodamount-label,
.t706__sidebar-prodamount,
.t706__sidebar-totalamount-label,
.t706__sidebar-totalamount {
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 12px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-black) !important;
}

/* Кнопка была бордовой — в брендбуке чёрная */
.t706__sidebar-continue {
  height: 48px !important;
  background: var(--du-black) !important;
  color: var(--du-white) !important;
  border: 1px solid var(--du-black) !important;
  border-radius: 0 !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 11px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
}


/* =========================================================
   3. ВИДЖЕТ РАСЧЁТА ДОСТАВКИ (dl-*)
   Неймспейс наш собственный — с Тильдой не пересекается.
   JS виджета — в HTML-блоке хэдера.
   ========================================================= */
  #dl-delivery{ font-family:'Geist','Helvetica Neue',Arial,sans-serif; color:#0A0A0A; display:flex; flex-direction:column; gap:16px; margin:14px 0; }
  #dl-delivery *{ box-sizing:border-box; }
  .dl-field{ display:flex; flex-direction:column; gap:6px; }
  .dl-label{ font-size:12px; letter-spacing:.4px; color:rgba(10,10,10,.45); }
  .dl-title{ font-size:12px; letter-spacing:1px; text-transform:uppercase; color:rgba(10,10,10,.45); }
  .dl-addr, .dl-zip{ width:100%; border:0; border-bottom:1px solid #ddd; padding:8px 0; font:inherit; font-size:15px; color:#0A0A0A; background:transparent; outline:none; }
  .dl-addr:focus, .dl-zip:focus{ border-bottom-color:#0A0A0A; }
  .dl-zip-row{ max-width:180px; }
  .dl-suggest-wrap{ position:relative; }
  .dl-suggest{ display:none; position:absolute; left:0; right:0; top:100%; z-index:30; background:#fff; border:1px solid #eee; box-shadow:0 10px 30px rgba(0,0,0,.08); max-height:280px; overflow:auto; }
  .dl-suggest-item{ padding:10px 14px; cursor:pointer; font-size:14px; display:flex; justify-content:space-between; gap:12px; }
  .dl-suggest-item:hover{ background:#f7f7f7; }
  .dl-suggest-zip{ color:rgba(10,10,10,.45); font-size:12px; flex:none; }
  .dl-hint{ font-size:13px; color:rgba(10,10,10,.45); }
  .dl-hint.err{ color:#0A0A0A; }
  .dl-options{ display:flex; flex-direction:column; gap:24px; }
  /* группа = один перевозчик; заголовок группы — цветной прямоугольник-бейдж с именем СД */
  .dl-group{ display:flex; flex-direction:column; gap:10px; }
  .dl-opt{ display:flex; align-items:center; gap:12px; border:1px solid #e0e0e0; padding:14px 16px; cursor:pointer; transition:border-color .15s; }
  .dl-opt:hover{ border-color:#c9c9c9; }
  .dl-opt input{ accent-color:#0A0A0A; flex:none; }
  .dl-opt-main{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; flex:1; }
  /* бейдж перевозчика — цветной прямоугольник, белый текст (лого не воспроизводим — товарный знак) */
  .dl-badge{
    align-self:flex-start;                 /* хаг по содержимому, не на всю ширину группы */
    display:inline-block;
    font-size:12px; letter-spacing:1px; text-transform:uppercase; font-weight:400;
    color:#fff; background:var(--c,#0A0A0A);
    padding:7px 14px; border-radius:0; white-space:nowrap;
  }
  .dl-opt-type{ font-size:13px; }
  .dl-opt-term{ font-size:12px; color:rgba(10,10,10,.45); }
  .dl-opt-price{ font-size:15px; font-weight:400; flex:none; }
  .dl-opt-pick{ font-size:12px; color:#0A0A0A; text-decoration:underline; cursor:pointer; flex:none; }
  .dl-picked{ font-size:13px; color:#0A0A0A; background:#f7f4f4; padding:10px 14px; margin-top:-4px; }
  /* ошибка обязательности выбора доставки — фирменный бордо, как поле-ошибка Тильды */
  .dl-required{ display:block; margin-top:8px; padding:12px 16px; border:1px solid #0A0A0A;
    font-size:12px; font-weight:400; letter-spacing:.06em; line-height:1.4; color:#0A0A0A; }
  /* модалка ПВЗ */
  /* z-index ВЫШЕ дровера корзины Тильды (.t706__sidebar = 10000000) и полноэкранной
     корзины — модалка ПВЗ открывается ВНУТРИ корзины, иначе уходит ПОД неё. Ниже
     тостов-ошибок (10000100/10000200), чтобы ошибки были видны поверх модалки. */
  .dl-modal{ position:fixed; inset:0; background:rgba(10,10,10,.4); z-index:10000050; display:flex; align-items:center; justify-content:center; padding:20px; }
  .dl-modal__card{ background:#fff; width:560px; max-width:100%; max-height:82vh; display:flex; flex-direction:column; position:relative; font-family:'Geist',Arial,sans-serif; }
  .dl-modal__close{ position:absolute; top:12px; right:14px; background:none; border:0; font-size:26px; line-height:1; cursor:pointer; color:#0A0A0A; }
  .dl-modal__title{ font-size:16px; letter-spacing:1px; text-transform:uppercase; padding:22px 24px 14px; }
  .dl-modal__bar{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin:0 24px 12px; }
  .dl-modal__search{ flex:1; min-width:180px; margin:0; border:0; border-bottom:1px solid #ddd; padding:8px 0; font:inherit; outline:none; }
  .dl-modal__search:focus{ border-bottom-color:#0A0A0A; }
  .dl-view{ display:flex; border:1px solid #0A0A0A; }
  .dl-view__btn{ background:#fff; color:#0A0A0A; border:0; font:inherit; font-size:11px; letter-spacing:.8px; text-transform:uppercase; padding:8px 14px; cursor:pointer; }
  .dl-view__btn.is-on{ background:#0A0A0A; color:#fff; }
  .dl-modal__note{ margin:0 24px 10px; font-size:11px; line-height:1.5; color:rgba(10,10,10,.45); }
  .dl-modal__map{ height:56vh; min-height:320px; }
  .dl-map-bal{ font-family:'Geist',Arial,sans-serif; font-size:13px; line-height:1.5; max-width:280px; white-space:normal; }
  /* кнопка по новой дизайн-системе: normal — контур, hover — чёрная заливка, active — приглушённая */
  .dl-map-pick{ margin-top:8px; background:#fff; color:#0A0A0A; border:1px solid #0A0A0A; padding:8px 14px; font-size:11px; letter-spacing:.8px; text-transform:uppercase; cursor:pointer; transition:background .15s, color .15s; }
  .dl-map-pick:hover{ background:#0A0A0A; color:#fff; }
  .dl-map-pick:active{ background:rgba(10,10,10,.45); border-color:transparent; color:#fff; }
  /* спиннер загрузки — единый для всех этапов ожидания */
  .dl-spin{ display:inline-block; width:12px; height:12px; border:1.5px solid rgba(10,10,10,.22); border-top-color:#0A0A0A; border-radius:50%; margin-right:8px; vertical-align:-2px; animation:dlspin .7s linear infinite; }
  @keyframes dlspin{ to{ transform:rotate(360deg); } }
  .dl-more{ display:flex; align-items:center; padding:12px 16px; font-size:12px; color:#0A0A0A; opacity:.55; }
  /* плашка «доставка бесплатна» над списком вариантов */
  .dl-free-note{ padding:10px 14px; margin-bottom:4px; border:1px solid #0A0A0A;
    font-size:11px; font-weight:400; letter-spacing:.1em; text-transform:uppercase; color:#0A0A0A; }
  .dl-modal__wait{ display:flex; align-items:center; padding:16px 24px; font-size:13px; color:#0A0A0A; opacity:.65; }
  /* кружок метро в цвет линии реальной схемы города; без данных — нейтральный */
  .dl-metro-dot{ display:inline-block; width:9px; height:9px; border-radius:50%; background:rgba(10,10,10,.25); margin-right:5px; }
  .dl-modal__list{ overflow:auto; padding:0 8px 16px; }
  .dl-pvz{ padding:12px 16px; cursor:pointer; border-bottom:1px solid #f2f2f2; }
  .dl-pvz:hover{ background:#f7f7f7; }
  .dl-pvz-addr{ font-size:14px; }
  .dl-pvz-meta{ font-size:12px; color:rgba(10,10,10,.45); margin-top:3px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }   /* страховка от гигантских графиков */
  /* доставка теперь нативная (tcart.delivery) — Tilda сама рисует её строку над итогом; своих классов доставки-товара больше нет */
  /* пустая корзина рисуется панелью .dl-empty-cart (секция 9) — прежней мигающей иконки больше нет */
  /* тост-ошибка вместо нативного alert() — цельная фирменная плашка бордо снизу по центру */
  .dl-toast{
    position:fixed; left:50%; bottom:32px; transform:translate(-50%,12px);
    z-index:10000100;                     /* ВЫШЕ дровера корзины Тильды (10000000) — иначе тост-ошибки виджета прятались за корзиной */
    max-width:90vw; box-sizing:border-box;
    background:#0A0A0A; color:#fff; border:0; border-radius:0;
    font-family:'Geist','Helvetica Neue',Arial,sans-serif; font-size:13px; letter-spacing:.3px; line-height:1.45;
    padding:14px 22px;
    box-shadow:0 12px 34px rgba(10,10,10,.28);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .22s ease, transform .22s ease, visibility .22s;
  }
  .dl-toast.is-show{ opacity:1; visibility:visible; transform:translate(-50%,0); }


/* =========================================================
   Пустой стейт
   Макет: ЛК_нет заказов — монограмма 56×56, отступ 15px,
   Geist Light 12 / ls .1em / uppercase
   ========================================================= */
.du-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 120px 20px;
  text-align: center;
}
.du-empty__icon {
  width: 56px;
  height: 56px;
  margin-bottom: 15px;
}
.du-empty__icon svg { display: block; width: 100%; height: 100%; }
.du-empty__text {
  font-family: var(--du-font);
  font-weight: 300;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: var(--du-ls);
  text-transform: uppercase;
  color: var(--du-black);
}
@media screen and (max-width: 640px) {
  .du-empty { padding: 80px 20px; }
}

/* =========================================================
   Модальное окно подтверждения
   ========================================================= */
/* Тильда местами держит content-box — принудительно нормализуем,
   иначе padding прибавляется к max-width и карточка расползается */
.du-modal, .du-modal *,
.du-empty, .du-empty * {
  box-sizing: border-box;
}

.du-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(10, 10, 10, .55);
  opacity: 0;
  transition: opacity .2s ease;
}
.du-modal_visible { opacity: 1; }

.du-modal__card {
  width: 100%;
  max-width: 420px;
  padding: 40px;
  background: var(--du-white);
  border-radius: 0;
  transform: translateY(8px);
  transition: transform .2s ease;
}
.du-modal_visible .du-modal__card { transform: none; }

.du-modal__title {
  margin: 0 0 12px;
  font-family: var(--du-font);
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: var(--du-ls);
  text-transform: uppercase;
  color: var(--du-black);
}
.du-modal__text {
  margin: 0 0 32px;
  font-family: var(--du-font);
  font-weight: 300;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: var(--du-ls);
  color: var(--du-muted);
}
.du-modal__actions {
  display: flex;
  gap: 10px;
}
.du-modal__btn {
  flex: 1;
  min-height: 48px;
  padding: 0 20px;
  font-family: var(--du-font);
  font-weight: 400;
  font-size: 12px;
  letter-spacing: var(--du-ls);
  text-transform: uppercase;
  border: 1px solid var(--du-black);
  border-radius: 0;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.du-modal__btn_ghost {
  background: transparent;
  color: var(--du-black);
}
.du-modal__btn_ghost:hover {
  background: var(--du-black);
  color: var(--du-white);
}
.du-modal__btn_primary {
  background: var(--du-black);
  color: var(--du-white);
}
.du-modal__btn_primary:hover {
  background: transparent;
  color: var(--du-black);
}
@media screen and (max-width: 480px) {
  .du-modal__card { padding: 30px 20px; }
  .du-modal__actions { flex-direction: column; }
  .du-modal__btn { min-height: 44px; }
}


/* =========================================================================
   5. ШАПКА / МЕНЮ / ПОИСК / КАБИНЕТ-САЙДБАР
   Вынесено из HTML-блока шапки (Zero Block T123). Разметка и  шапки
   остаются в коде меню — там только скрипты и HTML.
   Правки при переносе (см. решение «чёрный везде»):
     • бордо #4F0005 -> чёрный #0A0A0A (линия под шапкой);
     • конфликтные .t706__sidebar-continue / -heading убраны — их держит секция 2;
     • .t706__cartpage-* оставлены и перекрашены в чёрный.
   Почти все правила к классам Тильды идут с !important — так они держатся
   в head независимо от порядка подключения (см. шапку файла).
   ========================================================================= */
/* Geist уже подключён сайтом (Google Fonts) — @import не нужен. */

/* ===== ЕДИНЫЕ ТОКЕНЫ БОКОВЫХ ПАНЕЛЕЙ (бургер · корзина · кабинет) =====
   Крестик, ширина панели, тайминг выезда и затемнение — из одного места.
   Поменяешь здесь — изменится сразу во всех трёх панелях. */
:root{
  --dl-side-w: min(600px, 90vw);            /* ширина выезжающих панелей (десктоп/планшет) */
  --dl-side-dur: .38s;                       /* длительность выезда и закрытия */
  --dl-side-ease: cubic-bezier(.4,0,.2,1);   /* единая кривая анимации */
  --dl-scrim: rgba(10,10,10,.4);             /* затемнение фона за панелью */
  --dl-crest-inset: 22px;                    /* отступ крестика от верхнего/правого края панели */
  --dl-crest-hit: 40px;                      /* кликабельная область крестика (квадрат) */
  --dl-crest-icon: 18px;                     /* размер значка «X» */
}
@media (max-width: 480px){ :root{ --dl-side-w: 100vw; } }  /* на мобайле все панели во всю ширину */

/* Единый крестик закрытия: наши кнопки (бургер/кабинет) + штатный крестик корзины Тильды.
   Одинаковый размер кликабельной области, позиция (правый-верхний угол панели) и размер значка. */
.dl-drawer__close, .dl-profile-close, .t706__sidebar-close{
  top: var(--dl-crest-inset) !important; right: var(--dl-crest-inset) !important;
  left: auto !important; bottom: auto !important;
  width: var(--dl-crest-hit) !important; height: var(--dl-crest-hit) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  padding: 0 !important; margin: 0 !important; background: none !important; border: 0 !important;
  cursor: pointer; line-height: 0;
}
.dl-drawer__close svg, .dl-profile-close svg,
.t706__sidebar-close .t706__sidebar-close-icon{
  width: var(--dl-crest-icon) !important; height: var(--dl-crest-icon) !important; display: block !important;
}
/* штатная кнопка внутри крестика корзины — растягиваем на всю область, значок по центру */
.t706__sidebar-close .t706__sidebar-close-btn{
  width: 100% !important; height: 100% !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  background: none !important; border: 0 !important;
}

#dl-header{
  position: fixed;               /* зафиксировано вверху, накладывается на блоки */
  top: 0; left: 0; right: 0;
  width: 100%;
  z-index: 1000;
  /* Тема по умолчанию: белая подложка + линия 0.5px фирменного красного */
  background: #ffffff;
  border-bottom: 0.5px solid #0A0A0A;
  transition: background .25s ease, border-color .25s ease;
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
#dl-header *{ box-sizing: border-box; }

/* ===== ТЕМЫ ШАПКИ =====
   Светлая (по умолчанию) — тёмный текст/иконки на белой подложке.
   «Над тёмным» (html.dl-over-dark) — прозрачный фон, белый текст/иконки, без линии.
   Класс dl-over-dark ставит скрипт, когда под шапкой блок .dl-dark-section. */
#dl-header .dl-logo svg path{ fill: #0A0A0A; transition: fill .25s ease; }
#dl-header .dl-burger svg line{ stroke: #0A0A0A; transition: stroke .25s ease; }
#dl-header .dl-nav__link{ color: #0A0A0A; }
#dl-header .dl-iconbtn svg *{ stroke: #0A0A0A; transition: stroke .25s ease; }

html.dl-over-dark #dl-header{ background: transparent !important; border-bottom-color: transparent !important; }
html.dl-over-dark #dl-header .dl-logo svg path{ fill: #ffffff !important; }
html.dl-over-dark #dl-header .dl-burger svg line{ stroke: #ffffff !important; }
html.dl-over-dark #dl-header .dl-nav__link{ color: #ffffff !important; }
html.dl-over-dark #dl-header .dl-iconbtn svg *{ stroke: #ffffff !important; }
html.dl-over-dark #dl-header .dl-iconbtn .dl-cart-count{ background: #ffffff !important; color: #0A0A0A !important; }

/* ===== ТОКЕНЫ ТЕМЫ ШАПКИ =====
   Одна пара переменных на всё, что должно перекрашиваться вместе с меню
   (сейчас — строка поиска и её теги). --dl-head-ink — цвет «чернил»,
   --dl-head-paper — то, что под ними (нужен для инверсии на hover).
   Класс dl-over-dark ставит скрипт шапки по яркости фона под ней. */
:root{ --dl-head-ink: #0A0A0A; --dl-head-paper: #FFFFFF; }
html.dl-over-dark{ --dl-head-ink: #FFFFFF; --dl-head-paper: #0A0A0A; }

/* Штатный виджет профиля Тильлы (.tlk-userbar) — «Личный кабинет».
   ВАЖНО: НЕ прячем его за экран (left:-9999) — иначе ломается позиционирование
   всплывающей панели кабинета. Держим виджет в правом верхнем углу и измеримым,
   но саму иконку делаем прозрачной. Панель кабинета открывается по клику на «Профиль». */
.tlk-userbar{
  position: fixed !important;
  top: 16px !important; right: 24px !important; left: auto !important;
  width: auto !important; max-width: 60px !important;
  opacity: 1 !important; visibility: visible !important; z-index: 900 !important;
  pointer-events: none !important;   /* ВАЖНО: контейнер виджета широкий и перекрывал бы иконки шапки */
}
.tlk-userbar__user, .tlk-userbar__user_scale{
  width: auto !important; max-width: 60px !important;
  pointer-events: none !important;   /* иначе перехватывает клики по «Корзина»/«Поиск» */
}
/* прячем графику иконки, но оставляем элемент измеримым (нужно Тильде для попапа) */
.tlk-userbar__user-image{ opacity: 0 !important; pointer-events: none !important; }
/* ===== Кабинет как выезжающий сайдбар (по аналогии с корзиной) ===== */
.tlk-userbar__popup{
  position: fixed !important;
  top: 0 !important; right: 0 !important; bottom: 0 !important; left: auto !important;
  height: 100vh !important; max-height: none !important;   /* Тильда ставит max-height:500px — снимаем, иначе панель не во всю высоту */
  width: var(--dl-side-w) !important; max-width: none !important; margin: 0 !important;
  background: #fff !important; box-shadow: -14px 0 44px rgba(0,0,0,.10) !important;
  /* ВНИМАНИЕ: transform здесь и в правиле -show ниже — БЕЗ !important.
     Важные объявления автора перебивают значения из @keyframes (каскад CSS),
     поэтому с !important анимация числилась «running», но панель мгновенно
     стояла в конечной позиции — выезда не было видно. Тильда свой transform
     попапу не задаёт (только display/position), так что !important не нужен. */
  transform: translateX(100%);
  transition: transform var(--dl-side-dur) var(--dl-side-ease) !important;
  z-index: 100001 !important; padding: 78px 40px 44px !important; overflow-y: auto !important;
  border: 0 !important; border-radius: 0 !important; pointer-events: auto !important;
  font-family: 'Geist', -apple-system, Arial, sans-serif !important;
}
/* Тильда вставляет попап СРАЗУ с классом -show → transform-transition не проигрывается
   (панель появляется рывком, не как бургер-дровер). Keyframe играет при появлении
   элемента с этим классом независимо от исходного состояния → тот же слайд, что у бургера.
   transition на базовом .tlk-userbar__popup оставлен для анимации ЗАКРЫТИЯ (снятие -show). */
@keyframes dl-popup-slide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
.tlk-userbar__popup.tlk-userbar__popup-show{
  transform: translateX(0);   /* без !important — иначе гасит кадры анимации, см. выше */
  animation: dl-popup-slide-in var(--dl-side-dur) var(--dl-side-ease) !important;
}

/* затемнение фона */
.dl-profile-backdrop{
  position: fixed; inset: 0; background: var(--dl-scrim);
  opacity: 0; visibility: hidden; transition: opacity var(--dl-side-dur) var(--dl-side-ease); z-index: 100000;
}
body.dl-profile-open .dl-profile-backdrop{ opacity: 1; visibility: visible; }

/* заголовок внутри сайдбара (позиция/размер крестика — в общем блоке крестиков вверху) */
.dl-profile-close{ position: absolute; z-index: 2; }
/* ===== Единый заголовок боковых панелей — фирменный H1_Duality (по макету Figma) =====
   Geist Regular 400 · 20px · межбуквенный 2px · UPPERCASE · #0A0A0A.
   Одно правило и на наш кабинет (.dl-profile-title), и на штатный заголовок корзины Тильды. */
/* Заголовок дровера корзины отдан секции 2 (новые стили, 14px/600).
   Здесь остаётся заголовок кабинета и заголовок страницы оформления. */
.dl-profile-title,
.t706__cartpage-heading{
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 400 !important; font-size: 20px !important; line-height: 1 !important;
  letter-spacing: 2px !important; text-transform: uppercase !important; color: #0A0A0A !important;
}
.dl-profile-title{ margin: 0 0 26px !important; }

/* пункты меню кабинета — фирменный стиль (Geist Light · 16px · +1.6px · UPPERCASE), список с разделителями */
.tlk-userbar__popup .tlk-userbar__popup-courses-link{
  display: block !important;
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important; font-size: 16px !important; letter-spacing: 1.6px !important; text-transform: uppercase !important;
  padding: 16px 0 !important; border-bottom: 1px solid #eee !important;
  color: #0A0A0A !important; text-decoration: none !important; transition: opacity .2s ease;
}
/* сам текст пункта лежит во вложенном .tlk-userbar__popup-text с text-transform:none —
   поэтому капс/шрифт задаём и ему, иначе пункты остаются в исходном регистре */
.tlk-userbar__popup .tlk-userbar__popup-courses-link .tlk-userbar__popup-text{
  font: inherit !important; letter-spacing: inherit !important; text-transform: uppercase !important; color: inherit !important;
}
.tlk-userbar__popup .tlk-userbar__popup-courses-link:hover{ opacity: .55; }

/* Блок пользователя вверху попапа (имя + «Редактировать профиль») — Тильда даёт им
   свой размер/вес (Geist 700/14 и 400/12, mixed-case) → выбивались из ЛК-шкалы.
   Приводим к брендбуку: имя — SemiBold 600 uppercase, ссылка — muted Light uppercase. */
.tlk-userbar__popup .tlk-userbar__popup-name{
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 600 !important; font-size: 13px !important;
  letter-spacing: 1.3px !important; text-transform: uppercase !important; color: #0A0A0A !important;
}
.tlk-userbar__popup .tlk-userbar__popup-edit-profile{
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important; font-size: 11px !important;
  letter-spacing: 1.1px !important; text-transform: uppercase !important;
  color: rgba(10,10,10,.45) !important; transition: color .2s ease;
}
.tlk-userbar__popup .tlk-userbar__popup-edit-profile:hover{ color: #0A0A0A !important; }

/* ===== Строка поиска (T985) — выпадает ПОД меню, оформление как в макете =====
   Высоту шапки код кладёт в переменную --dl-header-h (см. JS ниже); фолбэк 64px. */
.t985__widgetheader{
  top: var(--dl-header-h, 64px) !important;
  background: transparent !important;   /* прозрачный фон */
  box-shadow: none !important;
  padding-top: 28px !important; padding-bottom: 28px !important;
}
/* прозрачный оверлей поиска (без затемнения) */
.t985__overlay{ background: transparent !important; }
.t985__inputcontainer{ position: relative !important; }

/* ---- Поиск на все 12 колонок ----
   Тильда кладёт поле и теги в .t-col_8.t-prefix_2 (8 колонок со сдвигом 2:
   сдвиг сделан padding-left:200px + margin-left:20px из сетки). Сам
   .t985__inputcontainer уже .t-container = 1200px, поэтому достаточно
   распрямить внутренние колонки — строка займёт всю ширину контейнера.
   Правило общее для всех ширин — иначе на планшете строка шла во всю ширину,
   а список результатов оставался в 8 колонках со сдвигом (не выровнены). */
.t985__widgetheader .t-search-widget__inputcontainer,
.t985__widgetheader .t985__searchvariants,
.t-search-widget__popup-container,
.t-search-widget__query-result{
  width: 100% !important; max-width: 100% !important;
  margin-left: 0 !important; margin-right: 0 !important;
  padding-left: 0 !important; padding-right: 0 !important;
}
/* Боковые поля страницы на узких экранах держит внешний контейнер (на десктопе
   их роль играет центрированный .t-container 1200px).
   ГРАБЛЯ: контейнер у Тильды content-box — padding прибавлялся к 100% ширины,
   контейнер становился 415px при экране 375, и крестик закрытия уезжал за край. */
@media screen and (max-width: 959px){
  .t985__inputcontainer,
  .t-search-widget__popup .t-container{
    box-sizing: border-box !important; max-width: 100% !important;
    padding-left: 20px !important; padding-right: 20px !important;
  }
}

/* Исключение: когда открыт список результатов, Тильда помечает панель классом
   t-search-widget__header_popup-opened, и ПОД строкой лежит белый попап выдачи.
   Тема меню тут ни при чём — на белом фоне строка обязана быть тёмной, иначе
   в «тёмной» теме получаем белый текст на белом (поле и теги пропадали). */
.t-search-widget__header_popup-opened{ --dl-head-ink: #0A0A0A; --dl-head-paper: #FFFFFF; }

/* поле ввода: подчёркивание, без рамок, без лупы; цвет — по теме шапки */
.t-search-widget__search-icon{ display: none !important; }
.t-search-widget__overlay .t-search-widget__input{ padding: 0 !important; color: var(--dl-head-ink) !important; }
.t985__input::placeholder{ color: var(--dl-head-ink) !important; opacity: .5 !important; }
.t-search-widget__blockinput{
  border: 0 !important;
  border-bottom: 1px solid var(--dl-head-ink) !important;
}
/* крестики: «очистить» (у Тильды серый кружок) и «закрыть» — тоже по теме */
.t985__clear-icon{ background: transparent !important; border-radius: 0 !important; }
.t985__clear-icon svg *,
.t985__close-icon svg *{ stroke: var(--dl-head-ink) !important; transition: stroke .25s ease; }

/* Теги-подсказки — фирменные кнопки: по умолчанию БЕЗ заливки, цвет по теме
   меню в этом месте; на наведении инверсия (заливка «чернилами»). */
.t985__searchvariant{
  border: 1px solid var(--dl-head-ink) !important;
  background: transparent !important;
  color: var(--dl-head-ink) !important;
  border-radius: 0 !important;
  font-family: var(--du-font) !important;
  font-weight: 400 !important; font-size: 11px !important; line-height: 1 !important;
  letter-spacing: var(--du-ls) !important; text-transform: uppercase !important;
  padding: 11px 14px !important;
  transition: background .2s ease, color .2s ease !important;
}
.t985__searchvariant:hover{
  background: var(--dl-head-ink) !important;
  color: var(--dl-head-paper) !important;
}

/* ---- ВЫДАЧА ПОИСКА (белый попап под строкой) ----
   ГРАБЛИ, из-за которых «ничего не было видно»:
   1) оверлей виджета z-index 999999 перекрывал шапку (z-index 1000) — на странице
      выдачи пропадали логотип и меню. Поднимаем шапку над оверлеем и опускаем сам
      оверлей под неё, чтобы белая подложка не заезжала на меню;
   2) список результатов лежит в потоке под fixed-строкой поиска, и штатного
      padding-top:60px не хватало — карточки уезжали под поле. Отступ берём из
      фактической высоты панели (--dl-search-h её пишет скрипт шапки). */
#dl-header{ z-index: 1000001 !important; }
/* ГРАБЛЯ (2026-07-21): подняв шапку над оверлеем поиска, мы одновременно
   подняли её над ПОЛНОЭКРАННОЙ корзиной (.t706__cartpage, z-index у Тильды
   всего 99999) — её крестик и «назад» лежат на top:11-17 и ушли ПОД шапку.
   Дровер корзины (.t706__sidebar) не задело: у него z-index 10000000.
   Корзина — модалка, она ДОЛЖНА перекрывать шапку, поэтому поднимаем её выше.
   То же и с бургер-дровером (.dl-drawer, z-index у него был 9999): до подъёма
   шапки он был НАД ней и его крестик работал; после — ушёл под шапку. Оба
   выезжающих меню — полноэкранные модалки, поэтому возвращаем их НАД шапку.
   Дровер корзины .t706__sidebar трогать не нужно — у него z-index 10000000.
   Порядок слоёв: строка поиска остаётся ПОД шапкой (логотип виден при поиске),
   а корзина и меню — НАД шапкой. */
.t706__cartpage{ z-index: 1000002 !important; }
.dl-drawer{ z-index: 1000002 !important; }
/* Панель кабинета — та же история: базовый z-index 100001 (секция 5) оказался
   под шапкой, крестик ушёл за неё. Поднимаем панель и её затемнение над шапкой.
   Затемнение (backdrop) чуть ниже панели, но выше шапки — гасит и шапку тоже,
   как у бургер-дровера. */
.dl-profile-backdrop{ z-index: 1000002 !important; }
.tlk-userbar__popup{ z-index: 1000003 !important; }
.t985__overlay{ top: var(--dl-header-h, 64px) !important; height: auto !important; bottom: 0 !important; }
.t-search-widget__popup{
  background: var(--du-white) !important;
  padding-top: calc(var(--dl-search-h, 125px) + 24px) !important;
}
/* результаты — на те же 12 колонок, что и строка ввода */
.t-search-widget__popup-container{
  width: 100% !important; max-width: 100% !important;
  margin-left: 0 !important; margin-right: 0 !important;
  padding-left: 0 !important; padding-right: 0 !important;
}

/* строка «N результатов по запросу: …» */
.t-search-widget__query-result{
  margin: 0 0 20px !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important; font-size: 11px !important; line-height: 18px !important;
  letter-spacing: var(--du-ls) !important; text-transform: uppercase !important;
  color: var(--du-muted) !important; opacity: 1 !important;
}

/* карточка результата */
.t-search-widget__result_product{
  padding: 18px 0 !important;
  border-bottom: 1px solid var(--du-line) !important;
}
.t-search-widget__result_product-link{ display: flex !important; align-items: flex-start !important; gap: 20px !important; }
.t-search-widget__result_product-img{ background-color: var(--du-fog) !important; border-radius: 0 !important; }
.t-search-widget__result_product-title{
  font-family: var(--du-font) !important;
  font-weight: 400 !important; font-size: 12px !important; line-height: 18px !important;
  letter-spacing: var(--du-ls) !important; text-transform: uppercase !important;
  color: var(--du-black) !important;
}
.t-search-widget__result_product-desc{
  margin-top: 4px !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important; font-size: 11px !important; line-height: 17px !important;
  letter-spacing: var(--du-ls) !important;
  color: var(--du-muted) !important;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.t-search-widget__result_product-price{
  margin-top: 8px !important;
  font-family: var(--du-font) !important;
  font-weight: 400 !important; font-size: 12px !important; line-height: 18px !important;
  letter-spacing: var(--du-ls) !important;
  color: var(--du-black) !important;
}
/* Тильда подсвечивает совпадение  — в брендбуке жирного нет,
   выделяем тем же весом, но цветом «чернил» */
.t-search-widget__result b, .t-search-widget__result strong{ font-weight: 400 !important; color: var(--du-black) !important; }
.t-search-widget__result_product-link:hover .t-search-widget__result_product-title{ opacity: .55; transition: opacity .2s ease; }

/* Иконка «ничего не найдено» — заменяем на кастомную (SVG вставляется из JS) */
.t-search-widget__notfound-img{ background-image: none !important; }
.dl-notfound-svg{ display: block !important; width: 56px; height: 56px; margin: 0 auto; }
.t-search-widget__notfound{ padding: 40px 0 !important; text-align: center !important; }
.t-search-widget__notfound .t-search-widget__result,
.t-search-widget__result.t-text{
  font-family: var(--du-font) !important;
  font-weight: 300 !important; font-size: 12px !important; line-height: 20px !important;
  letter-spacing: var(--du-ls) !important; text-transform: uppercase !important;
  color: var(--du-black) !important;
}

/* Прячем штатную плавающую иконку корзины Тильды (T706).
   Счётчик и открытие корзины переносим в пункт меню «КОРЗИНА».
   opacity+pointer-events (не display:none), чтобы корзина открывалась программно,
   и чтобы иконка не перехватывала тапы на планшете/мобайле. */
.t706 .t706__carticon,
.t706__carticon{ opacity: 0 !important; pointer-events: none !important; }

/* ===== Корзина как боковой дровер — единая ширина и тайминг (как у кабинета) =====
   Штатный правый дровер Тильды, но ширину и кривую/длительность анимации берём из токенов,
   чтобы корзина, кабинет и бургер выезжали одинаково. */
.t706__sidebar-content{
  width: var(--dl-side-w) !important; max-width: none !important;
  transition: transform var(--dl-side-dur) var(--dl-side-ease) !important;
}
.t706__sidebar{ transition: opacity var(--dl-side-dur) var(--dl-side-ease) !important; }

/* Счётчик корзины */
.dl-cart-count:empty{ display: none; }
.dl-nav__link .dl-cart-count{ font-weight: 300; }        /* десктоп: « (2)» рядом с текстом */
.dl-iconbtn .dl-cart-count{                              /* планшет/мобайл: бейдж на иконке */
  position: absolute; top: -6px; right: -8px;
  min-width: 15px; height: 15px; padding: 0 3px;
  font-size: 9px; line-height: 15px; text-align: center;
  background: #0A0A0A; color: #fff; border-radius: 9px;
  font-family: inherit; letter-spacing: 0;
}

/* ===== Кнопка «Оформить заказ» — фирменная кнопка по макету Figma =====
   #0A0A0A · белый текст · Geist Light 300 · 11px · +1.1px · UPPERCASE · острые углы.
   Кнопка дровера корзины отдана секции 2 (новый чёрный, 48px, рамка). */
.t706__cartpage-continue{
  background: #0A0A0A !important; color: #fff !important; border-radius: 0 !important;
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase !important; letter-spacing: 1.1px !important;
  font-weight: 300 !important; font-size: 11px !important; opacity: 1 !important;
}
.t706__submit_disable{ opacity: 1 !important; }         /* не приглушать в пустой корзине */
.t706__sidebar .t-btnflex__icon, .t706__cartpage .t-btnflex__icon{ display: none !important; }

/* ===== Пустая корзина — оформление ВНУТРИ стандартного правого дровера =====
   ВАЖНО: корзина остаётся обычным правым дровером во всех состояниях (пустая/с товарами).
   Раньше пустую корзину разворачивали на весь экран и поднимали шапку над ней
   (`#dl-header{ z-index: 10000001 }`) — из-за этого штатный крестик `.t706__sidebar-close`
   (Тильда ставит его на top:10px) попадал в зону фиксированной шапки, оказывался под ней
   и переставал нажиматься. Теперь ничего не репозиционируем и шапку не поднимаем —
   только оформляем пустое состояние внутри дровера: центрируем «Корзина пуста»,
   кнопку «Оформить заказ» прижимаем вниз. Крестик работает как в штатной корзине. */
html.dl-cart-empty .t706__sidebar-content,
html.dl-cart-empty .t706__cartpage{
  display: flex !important; flex-direction: column !important; min-height: 100% !important;
}
/* пустое состояние рисуем своей панелью .dl-empty-cart (монограмма + текст + «В каталог»);
   родное содержимое прячем целиком в обоих вариантах корзины:
   • дровер — список товаров + липкий низ (.dl-cart-foot / .t706__sidebar-bottom) с «Оформить заказ»;
   • полноэкранная корзина — весь .t706__cartpage-content (там своя кнопка .t706__cartpage-open-form).
   Панель .dl-empty-cart — сосед этих блоков, поэтому её display остаётся flex. */
html.dl-cart-empty .t706__sidebar-products,
html.dl-cart-empty .t706__sidebar-bottom,
html.dl-cart-empty .dl-cart-foot,
html.dl-cart-empty .t706__cartpage-content{ display: none !important; }

/* Панель пустой корзины: монограмма DUALITY + «Корзина пуста» по центру,
   кнопка «В каталог» прижата вниз (на месте, где была «Оформить заказ»). */
.dl-empty-cart{ display: none; }
html.dl-cart-empty .dl-empty-cart{
  display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; min-height: 0 !important;
}
.dl-empty-cart__mid{
  flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 22px;
}
.dl-empty-cart__logo svg{ display: block; width: 56px; height: 56px; }
.dl-empty-cart__logo svg path{ fill: #0A0A0A !important; }
/* ВАЖНО: явные hex + !important (без var()) — на страницах /members/* поздняя
   tilda-members-*.css перебивает наш custom.css, а токены брендбука там могут быть
   не определены → color:var(--du-white) обнулялся и текст кнопки «В каталог» пропадал. */
.dl-empty-cart__text{
  font-family: 'Geist','Helvetica Neue',Arial,sans-serif !important; font-weight: 400 !important;
  text-transform: uppercase !important; letter-spacing: 2px !important; font-size: 14px !important; color: #0A0A0A !important;
}
.dl-empty-cart__btn{
  display: flex !important; align-items: center !important; justify-content: center !important;
  height: 48px !important; margin-top: 16px !important;
  background: #0A0A0A !important; color: #FFFFFF !important;
  border: 1px solid #0A0A0A !important; border-radius: 0 !important;
  font-family: 'Geist','Helvetica Neue',Arial,sans-serif !important; font-weight: 300 !important; font-size: 11px !important;
  letter-spacing: 2px !important; text-transform: uppercase !important; text-decoration: none !important;
  transition: background .2s, color .2s !important;
}
.dl-empty-cart__btn:hover{ background: #FFFFFF !important; color: #0A0A0A !important; }

.dl-header__inner{
  display: grid;
  grid-template-columns: 1fr auto 1fr;   /* левый блок | логотип | правый блок */
  align-items: center;
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 22px 40px;
}

/* Левый блок */
.dl-left{ justify-self: start; display: flex; align-items: center; gap: 22px; }

/* Бургер */
.dl-burger{
  display: inline-flex; align-items: center;
  padding: 6px 0; background: none; border: 0; cursor: pointer; line-height: 0;
}

/* Кнопка-иконка (лупа/профиль/корзина) */
.dl-iconbtn{
  position: relative;               /* для бейджа-счётчика корзины */
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; background: none; border: 0; cursor: pointer; line-height: 0;
  color: #0A0A0A; text-decoration: none; transition: opacity .2s ease;
}
.dl-iconbtn:hover{ opacity: .55; }
.dl-iconbtn svg{ display: block; }

/* Логотип */
.dl-logo{ justify-self: center; display: block; line-height: 0; }
.dl-logo svg{ display: block; width: 124px; height: auto; }

/* Навигация справа (десктоп) */
.dl-nav{ justify-self: end; display: flex; align-items: center; gap: 26px; }
.dl-nav__link{
  font-family: inherit; font-weight: 300; font-size: 10px; letter-spacing: 1px;
  text-transform: uppercase; color: #0A0A0A;
  background: none; border: 0; padding: 0; cursor: pointer;
  text-decoration: none; white-space: nowrap; transition: opacity .2s ease;
}
.dl-nav__link:hover{ opacity: .55; }

/* Иконки справа (планшет/мобайл) */
.dl-icons{ justify-self: end; display: none; align-items: center; gap: 20px; }

/* Лупа слева видна только на планшете/мобайле */
.dl-search-mobile{ display: none; }

/* Выезжающая панель */
.dl-drawer{ position: fixed; inset: 0; z-index: 9999; visibility: hidden; pointer-events: none; }
.dl-drawer.is-open{ visibility: visible; pointer-events: auto; }
.dl-drawer__overlay{ position: absolute; inset: 0; background: var(--dl-scrim); opacity: 0; transition: opacity var(--dl-side-dur) var(--dl-side-ease); }
.dl-drawer.is-open .dl-drawer__overlay{ opacity: 1; }
.dl-drawer__panel{
  box-sizing: border-box;        /* чтобы var(--dl-side-w) = реальная ширина (как у корзины/кабинета) */
  position: absolute; top: 0; left: 0; height: 100%;
  width: var(--dl-side-w); background: #fff; padding: 34px 40px; overflow-y: auto;
  transform: translateX(-100%); transition: transform var(--dl-side-dur) var(--dl-side-ease);
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif;
}
.dl-drawer.is-open .dl-drawer__panel{ transform: translateX(0); }
.dl-drawer__close{ position: absolute; z-index: 2; }
.dl-drawer__nav{ display: flex; flex-direction: column; gap: 22px; margin-top: 40px; }
.dl-drawer__nav a{
  font-family: 'Geist', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  font-weight: 300; font-size: 16px; letter-spacing: 1.6px; text-transform: uppercase;
  color: #0A0A0A; text-decoration: none; transition: opacity .2s ease;
}
.dl-drawer__nav a:hover{ opacity: .55; }
.dl-drawer__nav--sub{ margin-top: 26px; padding-top: 22px; border-top: 1px solid #eee; gap: 16px; }
.dl-drawer__nav--sub a{ font-size: 12px; opacity: .8; }
.dl-drawer__nav--sub:empty{ display: none; }

/* ================= ПЛАНШЕТ + МОБАЙЛ (<=900px) ================= */
@media (max-width: 900px){
  .dl-header__inner{ padding: 18px 30px; gap: 14px; }
  .dl-nav{ display: none; }            /* убираем текстовую навигацию */
  .dl-icons{ display: flex; }          /* показываем иконки профиль+корзина */
  .dl-search-mobile{ display: inline-flex; }  /* показываем лупу слева */
  .dl-logo svg{ width: 112px; }
}

/* ================= МОБАЙЛ (<=480px) ================= */
@media (max-width: 480px){
  .dl-header__inner{ padding: 16px 20px; gap: 10px; }
  .dl-left{ gap: 16px; }
  .dl-icons{ gap: 16px; }
  .dl-logo svg{ width: 96px; }
  .dl-iconbtn svg, .dl-search-mobile svg{ width: 19px; height: 19px; }
  .dl-burger svg{ width: 26px; height: auto; }
}

/* =========================================================================
   6. АККОРДЕОН НА СТРАНИЦЕ ТОВАРА (t-catalog__prod-popup)
   Вынесено из отдельного блока правки аккордеонов (JS остаётся в блоке).
   На десктопе (>=960px) вкладки-аккордеон .js-catalog-tabs переносятся JS'ом
   в правую колонку карточки товара (.t-catalog__prod-popup__col-right);
   здесь — раскладка на всю ширину колонки + выравнивание тумблера.
   ========================================================================= */

/* Анти-FOUC (FAIL-OPEN): аккордеон скрыт, ТОЛЬКО пока JS (tilda-accordion-block)
   держит класс .t-tabs-hiding на .js-catalog-product. Иначе на долю секунды
   виден «развёрнутый вертикальный список» в дефолтном месте — до переноса в
   правую колонку и сворачивания Тильдой (см. скриншот FOUC). JS вешает класс
   сразу и СНИМАЕТ на window.load (+ страховочный таймаут). Если JS не отработал —
   класса нет, аккордеон ВИДЕН (лучше вспышка, чем навсегда скрытый блок).
   visibility:hidden, НЕ display:none — место резервируется, Тильда корректно
   меряет высоты вкладок; аккордеон внизу колонки → показ не двигает цену/кнопку. */
.js-catalog-product.t-tabs-hiding .js-catalog-tabs { visibility: hidden; }

@media screen and (min-width: 960px) {
  .t-catalog__prod-popup__col-right > .js-catalog-tabs {
    width: 100% !important;
    max-width: 100% !important;
    margin: 40px 0 0 0 !important;
    padding: 0 !important;
    float: none !important;
  }
  .t-catalog__prod-popup__col-right > .js-catalog-tabs .t-container,
  .t-catalog__prod-popup__col-right > .js-catalog-tabs [class*="t-col"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Тумблер +/× — к правому краю разделителя. У Тильды у кнопки-заголовка
     padding: 20px 20px 20px 0 → тумблер вжат на 20px внутрь, а заголовок
     прижат влево (асимметрия). Обнуляем правый паддинг, вертикальный оставляем. */
  .t-catalog__prod-popup__col-right > .js-catalog-tabs .t-catalog__tabs__item-button {
    padding-right: 0 !important;
  }
}


/* =========================================================================
   6.1. УБРАТЬ ВНЕШНИЙ ПАДДИНГ 20px СЛЕВА — карточка товара и каталог.
   ─────────────────────────────────────────────────────────────────────────
   СТРАНИЦА ТОВАРА (t-catalog__prod-popup, десктоп ≥1200px — 2 колонки):
   левой колонке-галерее Тильда задаёт margin: 0 20px (гаттер сетки) — из-за
   левого margin фото отступает на 20px от края экрана. Обнуляем левый margin
   и расширяем колонку ровно на эти 20px (width/max-width: 50% - 20px вместо
   штатных 50% - 40px), чтобы ПРАВАЯ колонка с текстом не сдвинулась: её отступ
   20px от правого края и гаттер 40px между фото и текстом сохраняются.
   Только ≥1200px: ниже prod-popup складывается в одну колонку (фото и так во
   всю ширину) — правило применять нельзя, иначе сожмёт фото до половины.

   СТРАНИЦА КАТАЛОГА (t-catalog__cont-w-filter): у обёртки сетки padding: 0 20px
   даёт по 20px с обеих сторон. Обнуляем — сетка карточек-изображений идёт во
   всю ширину (подписи под карточкой держит их собственный внутренний паддинг).
   ========================================================================= */
@media screen and (min-width: 1200px) {
  .t-catalog__prod-popup__col-left {
    margin-left: 0 !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
  }
  /* Фото — вплотную под фикс-меню (68px), а текстовую колонку с заголовком
     опускаем ниже отдельным отступом. Штатный контейнер даёт общий padding-top
     120px на обе колонки; уменьшаем его (фото поднимается к меню) и возвращаем
     отступ ТОЛЬКО правой колонке (доп. воздух над названием). */
  .t-catalog__prod-snippet__container { padding-top: 76px !important; }
  .t-catalog__prod-popup__info        { padding-top: 56px !important; }
}
.t-catalog__cont-w-filter {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Мобайл (страница товара): счётчик +/− и кнопка «Добавить в корзину» — ровно
   по низу и высоте, как на десктопе. Ряд .t-catalog__prod-popup__btn-wrapper —
   flex со stretch, но у счётчика фикс-высота (50 vs 52) → низ на 2px выше. Тянем. */
@media screen and (max-width: 640px) {
  .t-catalog__prod-popup__btn-wrapper { align-items: stretch !important; }
  .t-catalog__prod__quantity {
    height: auto !important;
    min-height: 0 !important;
    align-self: stretch !important;
  }
}

/* ─── Подпись карточки каталога — ритм и типографика под брендбук ───────────
   Штатная типографика приходит из настроек Тильда-блока каталога; здесь
   доводим до брендбука: трекинг 10% кегля (--du-ls, как в макетах, вместо
   плоских 1.1px), иерархия названием→описанием→ценой. Описание уводим в
   приглушённый серый (как brand/sku на странице товара — там #A8A8A8 под
   чёрным заголовком), цену выносим в отдельную группу отбивкой сверху.
   Горизонтальный отступ подписи (20px деск / 16px моб) НЕ трогаем — фото
   остаётся во всю ширину, текст с отступом (так и договаривались). */
.t-catalog__card__wrap_txt-and-btns {
  padding-top: 28px !important;
  padding-bottom: 0 !important;
}
.t-catalog__card__title {
  font-size: 16px !important;                 /* было 20 — уменьшили заголовок каталога */
  font-weight: 600 !important;
  letter-spacing: var(--du-ls) !important;   /* .1em = 10% кегля */
  line-height: 1.25 !important;
  color: var(--du-black) !important;
}
.t-catalog__card__descr {
  font-size: 13px !important;
  font-weight: 300 !important;
  letter-spacing: var(--du-ls) !important;
  line-height: 1.5 !important;
  color: var(--du-muted) !important;         /* rgba(10,10,10,.45) — вторичный уровень */
  margin-top: 6px !important;
}
.t-catalog__card__price-wrapper {
  margin-top: 16px !important;               /* цена — отдельная группа */
}
.t-catalog__card__price {
  font-size: 13px !important;                 /* было 16 — уменьшили цену пропорционально заголовку (16:13 ≈ 20:16) */
  font-weight: 300 !important;
  letter-spacing: var(--du-ls) !important;
  color: var(--du-black) !important;
}
/* Адаптив: на телефоне заголовок/цена ещё чуть меньше (та же пропорция). */
@media screen and (max-width: 480px) {
  .t-catalog__card__title { font-size: 14px !important; }
  .t-catalog__card__price { font-size: 12px !important; }
}

/* Кросс-селл на странице товара (блок relevants, «ВСЕ ПРОДУКТЫ»): Тильда
   скругляет фото карточек на 10px (штатное правило блока
   .t-catalog__relevants__container .t-catalog__card__bgimg{border-radius:10px}).
   Убираем — у бренда острые углы везде (главный каталог и карточка товара без
   скруглений). Правило без медиазапроса: скругление было и на десктопе. */
.t-catalog__relevants__container .t-catalog__card__bgimg {
  border-radius: 0 !important;
}

/* Кросс-селл на десктопе и планшете (≥960px): весь блок — в левые 50% ширины,
   выровнен по левому краю (примерно под колонкой фото карточки товара).
   Внутренний контейнер блока (.t-catalog__relevants__container > .t-container)
   штатно центрируется (margin:auto, max-width:1200) — сужаем до 50% и снимаем
   левый margin, правый оставляем auto. Слайдер (t-slds) — JS-карусель: ширину
   карточек и число видимых считает от ширины контейнера НА СТАРТЕ; т.к. этот
   CSS в head применяется до инициализации слайдера, карусель сразу считает по
   50% (на десктопе ~2–3 карточки, на планшете 2). Внутренние паддинги блока
   (~20px деск / ~10px планшет) НЕ трогаем — «оставить паддинги». Ниже 960px
   (мобайл) блок остаётся во всю ширину. */
@media screen and (min-width: 960px) {
  .t-catalog__relevants__container > .t-container {
    width: 50% !important;
    max-width: 50% !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .t-catalog__relevants__container .t-slds__main {
    max-width: 100% !important;
  }
}


/* =========================================================================
   7. ПОПАП «СПАСИБО!» ПОСЛЕ ОТПРАВКИ ФОРМЫ (Tilda t-form-success-popup)
   Приводим штатный попап Тильды к нашей модалке du-modal: белая карточка
   без скруглений, Geist, капс-заголовок, чёрная кнопка во всю ширину.
   Зелёная «ромашка» с галочкой — единственный цветной элемент на сайте,
   поэтому подложку прячем, остаётся только чёрная галочка.

   ГРАБЛИ: видимость попапа Тильда включает ИНЛАЙНОВЫМ style="display:block"
   (и display:none при закрытии). Поэтому display:flex вешаем ТОЛЬКО на
   .t-popup_show — иначе !important держал бы попап открытым всегда.
   Правила с !important: файл подключается в head раньше tilda-forms*.css.
   ========================================================================= */
.t-form-success-popup,
.t-form-success-popup * { box-sizing: border-box !important; }

.t-form-success-popup {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  padding: 20px !important;
  background: rgba(10, 10, 10, .55) !important;
  backdrop-filter: none !important;
}
.t-form-success-popup.t-popup_show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ---------- карточка ---------- */
.t-form-success-popup__wrapper {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 420px !important;
  padding: 40px !important;
  background: var(--du-white) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  animation: du-success-in .22s ease both;
}
@keyframes du-success-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}

/* ---------- крестик ---------- */
.t-form-success-popup__close-icon {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  opacity: .45;
  transition: opacity .2s ease;
}
.t-form-success-popup__close-icon:hover { opacity: 1; }
/* fill в разметке задан атрибутом — CSS его перебивает */
.t-form-success-popup__close-icon svg path {
  fill: var(--du-black) !important;
  opacity: 1 !important;
}

/* ---------- иконка: только чёрная галочка ---------- */
.t-form-success-popup__content-icon {
  display: block !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 0 20px 0 !important;
}
.t-form-success-popup__content-icon-background { display: none !important; }
.t-form-success-popup__content-icon-check {
  stroke: var(--du-black) !important;
  stroke-width: 16 !important;
}

/* ---------- текст ---------- */
.t-form-success-popup__title,
.t-form-success-popup__title.t-title {
  margin: 0 0 12px 0 !important;
  font-family: var(--du-font) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 20px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  color: var(--du-black) !important;
}
.t-form-success-popup__text,
.t-form-success-popup__text.t-text {
  margin: 0 0 32px 0 !important;
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 12px !important;
  line-height: 20px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: none !important;
  color: var(--du-muted) !important;
}

/* ---------- кнопка (и ссылка, и button — оба .t-btn) ---------- */
.t-form-success-popup__button,
.t-form-success-popup__button.t-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 48px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 20px !important;
  font-family: var(--du-font) !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: var(--du-ls) !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  background: var(--du-black) !important;
  color: var(--du-white) !important;
  border: 1px solid var(--du-black) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: background .2s ease, color .2s ease !important;
}
.t-form-success-popup__button:hover,
.t-form-success-popup__button.t-btn:hover {
  background: transparent !important;
  color: var(--du-black) !important;
}
/* Если Тильда показывает и ссылку, и кнопку — отбивка между ними */
.t-form-success-popup__button + .t-form-success-popup__button:not(.t-form-success-popup_hidden) {
  margin-top: 10px !important;
}
/* Скрытые элементы попапа. Специфичность ВЫШЕ, чем у правил кнопки
   (.t-form-success-popup__button.t-btn) — иначе спрятанная ссылка-кнопка
   вылезала бы чёрным блоком над «Хорошо». */
.t-form-success-popup .t-form-success-popup_hidden,
.t-form-success-popup .t-form-success-popup_hidden.t-btn { display: none !important; }

/* ---------- служебная строка с таймером ---------- */
.t-form-success-popup__info {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 16px 0 0 0 !important;
}
/* цифра и колечко таймера — по центру строки (у Тильды цифра съезжает вниз) */
.t-form-success-popup__info-timer {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.t-form-success-popup__info-timer svg { display: block !important; width: 14px !important; height: 14px !important; }
.t-form-success-popup__info-text,
.t-form-success-popup__info-digit,
.t-form-success-popup__info-timer {
  font-family: var(--du-font) !important;
  font-weight: 300 !important;
  font-size: 11px !important;
  line-height: 18px !important;
  letter-spacing: var(--du-ls) !important;
  color: var(--du-muted) !important;
}
.t-form-success-popup__info-timer svg path { stroke: var(--du-black) !important; }

@media screen and (max-width: 480px) {
  .t-form-success-popup__wrapper { padding: 30px 20px !important; }
  .t-form-success-popup__close-icon { top: 12px !important; right: 12px !important; }
  .t-form-success-popup__button,
  .t-form-success-popup__button.t-btn { min-height: 44px !important; }
}


/* =========================================================================
   8. ОШИБКИ ФОРМ = СНЕК-БАР (du-snack)
   Все ошибки Тильды (любая форма на сайте) показываются одной плашкой
   справа внизу, с крестиком и анимацией. Нативные места вывода прячем,
   текст собирает скрипт из хэдер-блока по событию `tildaform:aftererror`.

   ЧТО ПРЯЧЕМ И ЧЕМ ЭТО БЫЛО:
     • #tilda-popup-for-error / .tn-form__errorbox-popup — попап Тильды
       (у форм с data-error-popup="y", например подписка в футере);
     • .js-errorbox-all / .t-form__errorbox-wrapper — плашка внутри формы
       (её стили в секции 1 больше не работают — правила ниже их гасят,
       секция 8 идёт позже при равной специфичности);
     • .t-input-error — подпись «Обязательное поле» под полем.
   Подсветка невалидного поля (.js-error-control-box) ОСТАЁТСЯ — иначе при
   длинной форме непонятно, куда смотреть; в снеке дублируем список полей.
   ========================================================================= */
#tilda-popup-for-error,
.tn-form__errorbox-popup,
.js-errorbox-all,
.t-form__errorbox-wrapper,
.t-input-error { display: none !important; }

#du-snackbar {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 10000200;         /* ВЫШЕ дровера корзины (10000000) и тоста виджета — ошибки формы на оформлении не должны прятаться за корзиной */
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 340px;
  max-width: calc(100vw - 32px);
  pointer-events: none;       /* кликабельны только сами плашки */
}
#du-snackbar, #du-snackbar * { box-sizing: border-box; }

.du-snack {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  background: var(--du-black);
  color: var(--du-white);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 0;
  box-shadow: 0 12px 34px rgba(10, 10, 10, .28);
  font-family: var(--du-font);
  animation: du-snack-in .28s cubic-bezier(.2, .7, .3, 1) both;
}
.du-snack_out { animation: du-snack-out .2s ease both; }

@keyframes du-snack-in  { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@keyframes du-snack-out { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateX(28px); } }

.du-snack__body { flex: 1 1 auto; min-width: 0; }
.du-snack__title {
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: var(--du-ls);
  text-transform: uppercase;
}
.du-snack__list {
  margin: 6px 0 0;
  font-weight: 300;
  font-size: 11px;
  line-height: 17px;
  letter-spacing: var(--du-ls);
  color: rgba(255, 255, 255, .55);
}
.du-snack__close {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: 0;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  opacity: .5;
  transition: opacity .2s ease;
}
.du-snack__close:hover { opacity: 1; }
.du-snack__close svg { display: block; width: 10px; height: 10px; }

/* мобайл: плашка снизу во всю ширину */
@media screen and (max-width: 560px) {
  #du-snackbar { right: 16px; left: 16px; bottom: 16px; width: auto; max-width: none; }
  .du-snack { padding: 14px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .du-snack, .du-snack_out { animation-duration: .01ms !important; }
}


/* =========================================================================
   9. КОРЗИНА: ЛИПКИЙ НИЗ, ПРИЛИПШИЙ ИТОГ, ВЫПАДАЮЩИЕ СПИСКИ
   ========================================================================= */

/* ---- 9.1 Дровер корзины: сумма + кнопка всегда видны --------------------
   Скролл-контейнер — .t706__sidebar-content (у Тильды overflow:auto,
   padding:40px). Хвост (Сумма · Итоговая сумма · кнопка «Оформить заказ»)
   лежал в потоке и уезжал вверх. Скрипт из хэдер-блока складывает эти три
   блока в .dl-cart-foot, а здесь блок липнет к низу панели.

   ГРАБЛИ: sticky прилипает к нижней ГРАНИЦЕ КОНТЕНТА, а у панели снизу
   padding 40px — под кнопкой оставался просвет, сквозь который просвечивали
   товары. Поэтому bottom и отрицательный margin равны паддингу панели:
   плашка перекрывает его и доходит до края экрана. На мобайле паддинги
   другие (Тильда 0 0 20px, наши боковые 16px) — держим их в переменных. */
:root { --dl-cart-pad-x: 40px; --dl-cart-pad-b: 40px; }
@media (max-width: 600px) { :root { --dl-cart-pad-x: 16px; --dl-cart-pad-b: 20px; } }

.dl-cart-foot {
  position: sticky !important;
  bottom: calc(-1 * var(--dl-cart-pad-b)) !important;
  z-index: 5 !important;
  background: var(--du-white) !important;
  margin: 0 calc(-1 * var(--dl-cart-pad-x)) calc(-1 * var(--dl-cart-pad-b)) !important;
  padding: 16px var(--dl-cart-pad-x) var(--dl-cart-pad-b) !important;
  border-top: 1px solid var(--du-line) !important;
}
/* у Тильды на кнопочном блоке margin-bottom:64px — внутри плашки он лишний */
.dl-cart-foot .t706__sidebar-bottom { margin-bottom: 0 !important; padding: 0 !important; }
/* итог/сумма внутри плашки: без тильдовских отступов «в подвал» */
.dl-cart-foot .t706__cartwin-totalamount-wrap,
.dl-cart-foot .t706__sidebar-prodamount-wrap { padding-bottom: 12px !important; margin-top: 0 !important; }

/* ---- 9.2 Полноэкранная корзина: прилипший блок итогов -------------------
   Тильда рисует .t706__cartpage-totals как sticky-плашку со скруглением 7px
   и тенью через :after (opacity 0 -> 1 по классу is-pinned). В ч/б системе
   это чужеродно: убираем скругление и тень, отделяем линией.
   z-index: у .t706__product-plus/-minus стоит z-index:1, поэтому знаки
   «+»/«−» проступали ПОВЕРХ прилипшей плашки — поднимаем её над ними. */
.t706__cartpage-totals {
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 3 !important;
  background: var(--du-white) !important;
}
.t706__cartpage-totals:after { display: none !important; }
.t706__cartpage-totals.is-pinned { border-top: 1px solid var(--du-line) !important; }

/* ---- 9.3 Выпадающие списки (адреса и подсказки города) ------------------
   .tcart-select__options — «Сохранённые адреса» в оформлении;
   .t706 .searchbox-list — подсказки умного ввода адреса.
   У Тильды обоим задан box-shadow:0 4px 7px 0 gray (серый ореол) —
   заменяем на тонкую линию по контуру, без скруглений. */
.tcart-select__options,
.t706 .searchbox-list:not(:empty) {
  background: var(--du-white) !important;
  border: 1px solid var(--du-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* =========================================================================
   10. СТРАНИЦА «О БРЕНДЕ» — текстовые блоки (du-story)
   Нумерованные абзацы бренд-истории (левая/правая колонка) + заголовок.
   Разметка — отдельными HTML-блоками (T123), см. tilda-about-blocks.html;
   между абзацами юзер ставит свои блоки-картинки.
   Классы переименованы с исходных .dl-b/.dl-left/… → .du-story* (namespace):
   старые .dl-left/.dl-right заняты шапкой (конфликт), du-story* свободен.
   Шрифт наследуется из настроек страницы Тильды (inherit = Geist). ========= */
.du-story{ --pad:65px; --gutter:90px; --tw:440px; box-sizing:border-box; width:100%; margin:0 auto; padding:0 var(--pad); font-family:inherit; color:#0A0A0A; -webkit-font-smoothing:antialiased; }
.du-story *{ box-sizing:border-box; }
.du-story__row{ max-width:1070px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; column-gap:0; }
.du-story__cell{ display:grid; grid-template-columns:var(--gutter) minmax(0,var(--tw)); }
.du-story--left  .du-story__cell{ grid-column:1; }   /* абзац у левой колонки */
.du-story--right .du-story__cell{ grid-column:2; }   /* абзац у правой колонки */
.du-story__num{ font-size:12px; line-height:1.4; font-weight:400; }
.du-story__text{ font-size:12px; line-height:1.5; max-width:var(--tw); }
.du-story__text p{ margin:0 0 1.2em; }
.du-story__text p:last-child{ margin-bottom:0; }
/* планшет: одна колонка, абзацы по левому краю */
@media (max-width:959px){
  .du-story{ --pad:30px; --gutter:120px; }
  .du-story__row{ grid-template-columns:1fr; max-width:610px; }
  .du-story--left .du-story__cell, .du-story--right .du-story__cell{ grid-column:1; }
}
/* мобайл */
@media (max-width:479px){
  .du-story{ --pad:25px; }
  .du-story__row{ max-width:100%; }
  .du-story__cell{ grid-template-columns:1fr; }
  .du-story__num{ font-size:10px; line-height:12px; margin-bottom:12px; }
  .du-story__text{ font-size:10px; line-height:12px; max-width:100%; }
}
/* заголовок-разделитель «DUALITY: YES, BUT» */
.du-story-title{ font-family:inherit; color:#0A0A0A; text-align:center; font-size:20px; line-height:1; letter-spacing:2px; padding:24px 25px; font-weight:400; }
@media (max-width:479px){ .du-story-title{ font-size:18px; letter-spacing:1.5px; } }