/* ======================================================
   МОБИЛЬНАЯ БИБЛИОТЕКА: широкая сетка без смещения
   ====================================================== */

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

  /* Контейнер потока Tilda уже имеет left: 10px.
     Полностью сбрасываем его и центрируем сетку заново. */
  body [data-fe-role="feed"] {
    left: 6px !important;
    width: calc(100% - 12px) !important;
    max-width: none !important;
    margin: 0 !important;
    transform: none !important;
  }

  /* Служебные элементы библиотеки центрируем отдельно. */
  body #kedro-library-status,
  body #kedro-no-fragrances,
  body .kedro-mobile-bar {
    width: calc(100% - 12px) !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  /* Две равные колонки. */
  body [data-fe-role="posts"] > .tn-molecule {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  /* Небольшой промежуток между карточками. */
  body a[data-fe-post-link="link"].kedro-card-ready {
    box-sizing: border-box !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  /* Названия карточек немного крупнее и темнее. */
  body .kedro-card-title {
    color: #181613 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
  }
}


/* ======================================================
   ВНУТРЕННЯЯ СТРАНИЦА: читаемые мобильные шрифты
   ====================================================== */

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

  /* Название аромата. */
  body #kedro-aroma-detail .kedro-detail-title {
    color: #181613 !important;
    font-size: 24px !important;
    line-height: 1.25 !important;
  }
  /* Основное описание и рекомендации. */
  body #kedro-aroma-detail .kedro-detail-content,
  body #kedro-aroma-detail .kedro-detail-description,
  body #kedro-aroma-detail .kedro-detail-recommendations-text,
  body #kedro-aroma-detail .kedro-detail-description *,
  body #kedro-aroma-detail .kedro-detail-recommendations-text * {
    color: #181613 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.68 !important;
  }

  /* Значения семейства и нот. */
  body #kedro-aroma-detail .kedro-info-value {
    color: #181613 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.58 !important;
  }

  /* Заголовки разделов и названия характеристик. */
  body #kedro-aroma-detail .kedro-section-label,
  body #kedro-aroma-detail .kedro-info-label,
  body #kedro-aroma-detail .kedro-rating-label {
    color: #332e29 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
  }

  /* Звёзды характеристик. */
  body #kedro-aroma-detail .kedro-rating-stars {
    font-size: 20px !important;
  }
}
/* ======================================================
   МОБИЛЬНАЯ ПАНЕЛЬ ФИЛЬТРОВ: немного крупнее и удобнее
   ====================================================== */

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

  /* Немного увеличиваем высоту панели. */
  body .kedro-mobile-filter-button,
  body .kedro-mobile-sort-button,
  body #kedro-mobile-search {
    height: 46px !important;
    min-height: 46px !important;
    font-size: 11px !important;
  }

  /* Кнопки «Фильтры» и «Сначала новые». */
  body .kedro-mobile-filter-button,
  body .kedro-mobile-sort-button {
    padding-right: 12px !important;
    padding-left: 12px !important;
    font-weight: 500 !important;
  }

  /* Поле поиска. */
  body #kedro-mobile-search {
    padding-right: 10px !important;
    padding-left: 34px !important;
  }

  body #kedro-mobile-search::placeholder {
    color: #5b554e !important;
    opacity: 1 !important;
  }

  /* Увеличиваем значок поиска. */
  body .kedro-mobile-search-wrap::before {
    left: 11px !important;
    font-size: 22px !important;
  }

  /* Подстраиваем промежутки между элементами панели. */
  body .kedro-mobile-bar {
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    gap: 7px !important;
  }

  /* Меню сортировки должно начинаться под увеличенной кнопкой. */
  body .kedro-mobile-sort-menu {
    top: 52px !important;
    width: 194px !important;
  }

  body .kedro-mobile-sort-option {
    padding: 11px 9px !important;
    font-size: 11px !important;
  }
}
/* ======================================================
   МОБИЛЬНАЯ ПАНЕЛЬ ФИЛЬТРОВ: закрепление при прокрутке
   ====================================================== */

@media screen and (max-width: 760px) {
  body .kedro-mobile-bar {
    position: sticky !important;
    z-index: 900 !important;
    top: 8px !important;

    padding: 6px !important;
    border: 1px solid rgba(45, 42, 37, 0.16) !important;
    border-radius: 9px !important;

    background: rgba(247, 245, 240, 0.94) !important;
    box-shadow: 0 5px 18px rgba(35, 31, 26, 0.12) !important;

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}
/* ======================================================
   ДЕСКТОПНАЯ ПАНЕЛЬ ФИЛЬТРОВ: закрепление при прокрутке
   ====================================================== */

@media screen and (min-width: 761px) {
  body #kedro-library-controls {
    position: sticky !important;
    z-index: 900 !important;
    top: 12px !important;

    padding: 12px !important;
    border: 1px solid rgba(45, 42, 37, 0.14) !important;
    border-radius: 10px !important;

    background: rgba(247, 245, 240, 0.94) !important;
    box-shadow: 0 6px 20px rgba(35, 31, 26, 0.1) !important;

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}
/* ======================================================
   КАТАЛОГ ST340A — СЕТКА И КАРТОЧКИ
   Блок: #rec3246199301
   ====================================================== */

/* Убираем избыточные вертикальные поля штатного блока */
#rec3246199301 {
  padding-top: 48px !important;
  padding-bottom: 80px !important;
}

/* Ограничиваем ширину каталога и центрируем его */
#rec3246199301 .t-catalog__cont-wrapper,
#rec3246199301 .t-catalog-parts-above__container,
#rec3246199301 .t-catalog__cont-w-filter {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1180px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

/* Основные боковые поля */
#rec3246199301 .t-catalog__cont-wrapper {
  padding-right: 20px !important;
  padding-left: 20px !important;
}

/* Сетка товаров */
#rec3246199301 .t-catalog__card-list,
#rec3246199301 .js-catalog-grid-cont {
  --t-catalog-col-gap: 20px !important;
  --t-catalog-row-gap: 38px !important;
}

/* Убираем рамку, фон и тень со всей карточки */
#rec3246199301 .t-catalog__card {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: none !important;
}

#rec3246199301 .t-catalog__card:hover {
  box-shadow: none !important;
}

/* Оформляем только изображение */
#rec3246199301 .t-catalog__card__imgwrapper,
#rec3246199301 [class*="t-catalog__card__imgwrapper"] {
  overflow: hidden !important;
  border-radius: 9px !important;
  background-color: #f2f0eb !important;
}

/* Изображение мягко увеличивается при наведении */
#rec3246199301 .t-catalog__card img,
#rec3246199301 .t-catalog__card .t-bgimg {
  transition: transform 0.35s ease !important;
}

@media (hover: hover) {
  #rec3246199301 .t-catalog__card:hover img,
  #rec3246199301 .t-catalog__card:hover .t-bgimg {
    transform: scale(1.025) !important;
  }
}

/* Убираем штатные большие внутренние поля текста */
#rec3246199301 .t-catalog__card__wrap_txt-and-btns {
  padding: 13px 2px 0 !important;
  background: transparent !important;
}

/* Название товара */
#rec3246199301 .t-catalog__card .t-typography__title {
  max-width: none !important;
  margin: 0 !important;
  color: #181613 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

/* Артикул и короткая подпись */
#rec3246199301 .t-catalog__card .t-typography__descr {
  margin-top: 5px !important;
  color: #5d5750 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  opacity: 1 !important;
}

/* Цена */
#rec3246199301 .t-catalog__card [class*="price"] {
  color: #181613 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

/* ======================================================
   ПЛАНШЕТ — 3 КАРТОЧКИ
   ====================================================== */

@media screen and (min-width: 761px) and (max-width: 1050px) {
  #rec3246199301 {
    padding-top: 40px !important;
    padding-bottom: 65px !important;
  }

  #rec3246199301 .t-catalog__cont-wrapper {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  #rec3246199301 .t-catalog__card-list,
  #rec3246199301 .js-catalog-grid-cont {
    --t-catalog-col-gap: 16px !important;
    --t-catalog-row-gap: 32px !important;
  }

  #rec3246199301 .t-catalog__card {
    width: calc((100% - 32px) / 3) !important;
    max-width: calc((100% - 32px) / 3) !important;
    flex-basis: calc((100% - 32px) / 3) !important;
  }
}

/* ======================================================
   МОБИЛЬНАЯ ВЕРСИЯ — 2 КАРТОЧКИ
   ====================================================== */

@media screen and (max-width: 760px) {
  #rec3246199301 {
    padding-top: 24px !important;
    padding-bottom: 55px !important;
  }

  #rec3246199301 .t-catalog__cont-wrapper {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }

  #rec3246199301 .t-catalog__card-list,
  #rec3246199301 .js-catalog-grid-cont {
    --t-catalog-col-gap: 8px !important;
    --t-catalog-row-gap: 26px !important;
  }

  #rec3246199301 .t-catalog__card__wrap_txt-and-btns {
    padding: 9px 2px 0 !important;
  }

  #rec3246199301 .t-catalog__card .t-typography__title {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
  }

  #rec3246199301 .t-catalog__card .t-typography__descr {
    margin-top: 4px !important;
    font-size: 10.5px !important;
    line-height: 1.4 !important;
  }

  #rec3246199301 .t-catalog__card [class*="price"] {
    font-size: 13px !important;
    line-height: 1.35 !important;
  }

  #rec3246199301 .t-catalog__card__imgwrapper,
  #rec3246199301 [class*="t-catalog__card__imgwrapper"] {
    border-radius: 8px !important;
  }
}
/* ======================================================
   КАТАЛОГ: ШИРИНА КАК В БИБЛИОТЕКЕ + РАЗДЕЛИТЕЛИ
   ====================================================== */

/* Снимаем ограничение 1180 px и убираем двойные поля Tilda */
#rec3246199301 .t-catalog__cont-wrapper,
#rec3246199301 .t-catalog-parts-above__container,
#rec3246199301 .t-catalog__cont-w-filter {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Единые внешние поля десктопного каталога */
#rec3246199301 .t-catalog__cont-wrapper {
  padding-right: 38px !important;
  padding-left: 38px !important;
}

/* У вложенных контейнеров убираем повторные отступы */
#rec3246199301 .t-catalog__cont-w-filter,
#rec3246199301 .js-catalog-grid-cont {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Сетка без штатных промежутков:
   пространство между карточками создаёт внутренний padding */
#rec3246199301 .t-catalog__card-list,
#rec3246199301 .js-catalog-grid-cont {
  --t-catalog-col-gap: 0px !important;
  --t-catalog-row-gap: 0px !important;
}

/* Карточка: разделительные линии справа и снизу */
#rec3246199301 .t-catalog__card {
  box-sizing: border-box !important;
  padding: 0 16px 28px !important;
  border: 0 !important;
  border-right: 1px solid rgba(55, 49, 43, 0.14) !important;
  border-bottom: 1px solid rgba(55, 49, 43, 0.14) !important;
  background: transparent !important;
}

/* Убираем правую линию у каждой четвёртой карточки */
#rec3246199301 .t-catalog__card:nth-child(4n) {
  border-right-color: transparent !important;
}

/* Добавляем расстояние перед следующим рядом */
#rec3246199301 .t-catalog__card:nth-child(n + 5) {
  padding-top: 28px !important;
}

/* Крайние карточки располагаем ближе к внешним полям */
#rec3246199301 .t-catalog__card:nth-child(4n + 1) {
  padding-left: 0 !important;
}

#rec3246199301 .t-catalog__card:nth-child(4n) {
  padding-right: 0 !important;
}


/* ======================================================
   ПЛАНШЕТ: 3 КАРТОЧКИ
   ====================================================== */

@media screen and (min-width: 761px) and (max-width: 1050px) {
  #rec3246199301 .t-catalog__cont-wrapper {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  #rec3246199301 .t-catalog__card {
    width: 33.333333% !important;
    max-width: 33.333333% !important;
    flex: 0 0 33.333333% !important;
    padding-right: 13px !important;
    padding-bottom: 25px !important;
    padding-left: 13px !important;
    border-right-color: rgba(55, 49, 43, 0.14) !important;
  }

  /* Сбрасываем десктопное правило четвёртой карточки */
  #rec3246199301 .t-catalog__card:nth-child(4n) {
    padding-right: 13px !important;
    border-right-color: rgba(55, 49, 43, 0.14) !important;
  }

  /* Убираем линию у каждой третьей карточки */
  #rec3246199301 .t-catalog__card:nth-child(3n) {
    padding-right: 0 !important;
    border-right-color: transparent !important;
  }

  #rec3246199301 .t-catalog__card:nth-child(3n + 1) {
    padding-left: 0 !important;
  }

  /* Второй и последующие ряды */
  #rec3246199301 .t-catalog__card:nth-child(n + 4) {
    padding-top: 25px !important;
  }
}


/* ======================================================
   МОБИЛЬНАЯ ВЕРСИЯ: 2 КАРТОЧКИ
   ====================================================== */

@media screen and (max-width: 760px) {
  /* Такие же узкие внешние поля, как в библиотеке ароматов */
  #rec3246199301 .t-catalog__cont-wrapper {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }

  #rec3246199301 .t-catalog__cont-w-filter,
  #rec3246199301 .js-catalog-grid-cont {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  #rec3246199301 .t-catalog__card {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
    padding: 0 4px 22px !important;
    border-right-color: rgba(55, 49, 43, 0.14) !important;
    border-bottom-color: rgba(55, 49, 43, 0.14) !important;
  }

  /* Сбрасываем правила десктопа и планшета */
  #rec3246199301 .t-catalog__card:nth-child(3n),
  #rec3246199301 .t-catalog__card:nth-child(4n) {
    padding-right: 4px !important;
    border-right-color: rgba(55, 49, 43, 0.14) !important;
  }

  #rec3246199301 .t-catalog__card:nth-child(3n + 1),
  #rec3246199301 .t-catalog__card:nth-child(4n + 1) {
    padding-left: 4px !important;
  }

  /* Левая карточка каждой пары */
  #rec3246199301 .t-catalog__card:nth-child(odd) {
    padding-right: 4px !important;
    padding-left: 0 !important;
  }

  /* Правая карточка каждой пары */
  #rec3246199301 .t-catalog__card:nth-child(even) {
    padding-right: 0 !important;
    padding-left: 4px !important;
    border-right-color: transparent !important;
  }

  /* Второй и последующие ряды */
  #rec3246199301 .t-catalog__card:nth-child(n + 3) {
    padding-top: 22px !important;
  }
}
/* ======================================================
   ИСПРАВЛЕНИЕ МОБИЛЬНОЙ СЕТКИ КАТАЛОГА
   ====================================================== */

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

  /* Убираем скрытый штатный зазор Tilda,
     из-за которого вторая карточка переносилась вниз */
  #rec3246199301 .t-catalog__card-list,
  #rec3246199301 .js-catalog-grid-cont {
    --t-catalog-col-gap: 0px !important;
    --t-catalog-mobile-col-gap: 0px !important;

    column-gap: 0 !important;
    row-gap: 0 !important;
  }

  /* Строго две равные колонки */
  #rec3246199301 .t-catalog__card {
    box-sizing: border-box !important;
    width: 50% !important;
    min-width: 0 !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
  }
}
/* ======================================================
   КАТАЛОГ: ВЕРТИКАЛЬНЫЕ ЛИНИИ С РАЗРЫВАМИ
   ====================================================== */

/* Убираем прежнюю сплошную вертикальную границу */
#rec3246199301 .t-catalog__card {
  position: relative !important;
  border-right: 0 !important;
}

/* Рисуем отдельный вертикальный разделитель */
#rec3246199301 .t-catalog__card::after {
  content: "" !important;
  position: absolute !important;
  z-index: 2 !important;

  top: 14px !important;
  right: 0 !important;
  bottom: 14px !important;

  width: 1px !important;
  background: rgba(55, 49, 43, 0.14) !important;

  pointer-events: none !important;
}

/* На десктопе убираем линию после каждой четвёртой карточки */
#rec3246199301 .t-catalog__card:nth-child(4n)::after {
  display: none !important;
}


/* ======================================================
   ПЛАНШЕТ: линия после первой и второй карточки
   ====================================================== */

@media screen and (min-width: 761px) and (max-width: 1050px) {
  /* Возвращаем разделитель, отключённый десктопным правилом */
  #rec3246199301 .t-catalog__card:nth-child(4n)::after {
    display: block !important;
  }

  /* Убираем разделитель после каждой третьей карточки */
  #rec3246199301 .t-catalog__card:nth-child(3n)::after {
    display: none !important;
  }
}


/* ======================================================
   МОБИЛЬНАЯ ВЕРСИЯ: линия только между двумя карточками
   ====================================================== */

@media screen and (max-width: 760px) {
  /* На мобильном сбрасываем правила десктопа и планшета */
  #rec3246199301 .t-catalog__card:nth-child(3n)::after,
  #rec3246199301 .t-catalog__card:nth-child(4n)::after {
    display: block !important;
  }

  /* Разделитель остаётся после левой карточки */
  #rec3246199301 .t-catalog__card:nth-child(odd)::after {
    display: block !important;
  }

  /* После правой карточки разделитель не нужен */
  #rec3246199301 .t-catalog__card:nth-child(even)::after {
    display: none !important;
  }

  /* На узком экране разрыв делаем немного компактнее */
  #rec3246199301 .t-catalog__card::after {
    top: 10px !important;
    bottom: 10px !important;
  }
}
/* Каталог: мобильный промежуток между двумя карточками 10 px */

@media screen and (max-width: 760px) {
  /* Левая карточка */
  #rec3246199301 .t-catalog__card:nth-child(odd) {
    padding-right: 6px !important;
  }

  /* Правая карточка */
  #rec3246199301 .t-catalog__card:nth-child(even) {
    padding-left: 6px !important;
  }
}
/* ======================================================
   КАТАЛОГ: ОДИНАКОВАЯ ШИРИНА КАРТОЧЕК НА ДЕСКТОПЕ
   ====================================================== */

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

  /* Компенсируем одинаковый внутренний отступ крайних карточек */
  #rec3246199301 .t-catalog__cont-wrapper {
    padding-right: 30px !important;
    padding-left: 30px !important;
  }

  /* У всех четырёх карточек одинаковая полезная ширина */
  #rec3246199301 .t-catalog__card,
  #rec3246199301 .t-catalog__card:nth-child(4n),
  #rec3246199301 .t-catalog__card:nth-child(4n + 1) {
    box-sizing: border-box !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
  }

  /* Сохраняем вертикальный отступ первого ряда */
  #rec3246199301 .t-catalog__card {
    padding-top: 0 !important;
    padding-bottom: 28px !important;
  }

  /* Отступ следующих рядов */
  #rec3246199301 .t-catalog__card:nth-child(n + 5) {
    padding-top: 28px !important;
  }
}
/* Навигация отдельной карточки аромата */
/* DESKTOP + MOBILE: навигация карточки аромата */
body #kedro-aroma-detail .kedro-detail-navigation{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:36px;
  margin:0 0 18px;
}

body #kedro-aroma-detail .kedro-detail-back{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  color:#53605a;
  font-family:inherit;
  font-size:16px;
  font-weight:500;
  line-height:1.2;
  text-decoration:none;
  transition:color .18s ease,opacity .18s ease;
}

body #kedro-aroma-detail .kedro-detail-back-arrow{
  font-family:Arial,sans-serif;
  font-size:18px;
  font-weight:400;
  line-height:1;
  transform:translateY(-1px);
}

body #kedro-aroma-detail .kedro-detail-back:hover{
  color:#09643d;
  opacity:.75;
}

body #kedro-aroma-detail .kedro-detail-close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#53605a;
  font-family:Arial,sans-serif;
  font-size:25px;
  font-weight:300;
  line-height:1;
  text-decoration:none;
  transition:color .18s ease,background-color .18s ease;
}

body #kedro-aroma-detail .kedro-detail-close:hover{
  color:#09643d;
  background:rgba(9,100,61,.08);
}

body #kedro-aroma-detail .kedro-detail-back:focus-visible,
body #kedro-aroma-detail .kedro-detail-close:focus-visible{
  outline:2px solid rgba(9,100,61,.35);
  outline-offset:3px;
}