.card {
  position: relative;
  display: inline-block;
  width: 100%; /* или фиксированную ширину */
  background-color: #020A17;
  border-radius: 4px;
  cursor: pointer;
  transition: 
    box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: inset 0 0 0 0 #1B63E9;
}

.card:hover {
  box-shadow: inset 0 -500px 0 0 #1B63E9;
  border-radius: 16px; /* чуть округлим при ховере, можно менять */
}

.card-grey {
  position: relative;
  display: inline-block;
  width: 100%;
  background-color: #F7F7F7 !important;
  border-radius: 4px;
  cursor: pointer;
  transition:
    box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: inset 0 0 0 0 #1B63E9;
}

.card-grey .txt-card {
  color: #020A17 !important; /* задаём стартовый цвет */
  transition: color 0.4s ease;
}

.card-grey:hover {
  box-shadow: inset 0 -600px 0 0 #1B63E9;
  border-radius: 16px;
}

.card-grey:hover .txt-card {
  color: white !important; /* цвет при наведении */
}

.card-button {
  position: relative;
  display: inline-block;
  width: 100%; /* или задай конкретную ширину */
  background-color: #1B63E9;
  border-radius: 4px;
  cursor: pointer;
  transition: 
    box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: inset 0 0 0 0 #074FD5;
}

.card-button:hover {
  box-shadow: inset 0 -500px 0 0 #074FD5;
  border-radius: 16px; /* чуть округлим при ховере, можно менять */
}
.button-black,
.button-blue {
  position: relative;
  overflow: hidden;
  border-radius: 60px !important;
  transition: 
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    color 0.3s ease;
  z-index: 0;
  color: white !important;
}

.button-black::before,
.button-blue::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 100%;
  z-index: -1;
  transition: 
    height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 60px;
}

/* Черная кнопка: с чёрного на белый */
.button-black {
  background-color: #020A17 !important;
}

.button-black::before {
  background-color: white;
  border-radius: 60px;
}

.button-black:hover::before {
  height: 100%;
  border-radius: 4px;
}

.button-black:hover {
  border-radius: 4px !important;
  color: #020A17 !important; /* тёмный текст на белом фоне */
}

/* Синяя кнопка: с синего на #074FD5 */
.button-blue {
  background-color: #1B63E9 !important;
}

.button-blue::before {
  background-color: #074FD5;
  border-radius: 60px;
}

.button-blue:hover::before {
  height: 100%;
  border-radius: 4px;
}

.button-blue:hover {
  border-radius: 4px !important;
  color: white !important; /* остаётся белым */
}


/* === КНОПКА В ПОПАП-ФОРМЕ === */
#allrecords .t-form__submit {
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
  background-color: #1B63E9 !important;
  color: white !important;
  border: none !important;
  border-radius: 60px !important;
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-radius 0.3s ease;
}

/* Подложка для заливки */
#allrecords .t-form__submit::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: #074FD5;
  transform: scaleY(0);
  transform-origin: bottom;
  transition:
    transform 0.3s ease,
    border-radius 0.3s ease;
  border-radius: 60px;
  will-change: transform;
}

/* Ховер-состояние */
#allrecords .t-form__submit:hover {
  border-radius: 4px !important;
  background-color: #074FD5 !important; /* цвет фона меняется чтобы не было резких перепадов */
  color: white !important;
}

#allrecords .t-form__submit:hover::before {
  transform: scaleY(1);
  border-radius: 4px;
}




/* Кнопка формы: чёрная с белой заливкой при ховере */
.main-form button.t-submit {
  position: relative;
  overflow: hidden;
  background-color: #020A17 !important;
  color: white !important;
  border: none !important;
  border-radius: 60px !important;
  transition: border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1), color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  isolation: isolate;
}

/* Подложка для заливки */
.main-form button.t-submit::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: white;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ховер-состояние */
.main-form button.t-submit:hover::before {
  transform: scaleY(1);
}

.main-form button.t-submit:hover {
  border-radius: 4px !important;
  color: #020A17 !important;
}

@media screen and (max-width: 639px) {
  .H2-txt,
  .nabor-txt {
    height: auto !important;
  }
}

/* Коректим хлебные крошки */
.uc-kroshki .t-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 10px;  /* по умолчанию */
  padding-right: 10px; /* по умолчанию */
  box-sizing: border-box;
}

/* Для десктопов шире 1200px — увеличиваем отступы */
@media (min-width: 1200px) {
  .uc-kroshki .t-container {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}

.uc-kroshki .t-col {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0px !important;
}

/*Корректировка текста в кнопках, влезает все слово без обресзки*/
.t-store__card__btn-text {
    max-width: unset !important;
    overflow: visible !important;
    white-space: nowrap;
}



/* === КНОПКА В КОРЗИНЕ === */
/* === ОБЩЕЕ — ДЛЯ ВСЕХ КНОПОК (и , и ) === */
#allrecords a.js-store-prod-btn.t-store__card__btn,
#allrecords a.t-store__prod-popup__btn,
#allrecords .t706__sidebar-bottom .t-btn,
#allrecords button.t706__sidebar-continue.t-btn {
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  background-color: #1B63E9 !important;
  color: white !important;
  border: none !important;
  border-radius: 60px !important;
  line-height: 1.2;
  text-align: center;
  transition:
    background-color 0.3s ease,
    border-radius 0.3s ease,
    color 0.3s ease;
}

/* === ПОДЛОЖКА ::before === */
#allrecords a.js-store-prod-btn.t-store__card__btn::before,
#allrecords a.t-store__prod-popup__btn::before,
#allrecords .t706__sidebar-bottom .t-btn::before,
#allrecords button.t706__sidebar-continue.t-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: #074FD5;
  transform: scaleY(0);
  transform-origin: bottom;
  border-radius: inherit;
  transition:
    transform 0.3s ease,
    border-radius 0.3s ease;
}

/* === ХОВЕР === */
#allrecords a.js-store-prod-btn.t-store__card__btn:hover,
#allrecords a.t-store__prod-popup__btn:hover,
#allrecords .t706__sidebar-bottom .t-btn:hover,
#allrecords button.t706__sidebar-continue.t-btn:hover {
  border-radius: 4px !important;
}

#allrecords a.js-store-prod-btn.t-store__card__btn:hover::before,
#allrecords a.t-store__prod-popup__btn:hover::before,
#allrecords .t706__sidebar-bottom .t-btn:hover::before,
#allrecords button.t706__sidebar-continue.t-btn:hover::before {
  transform: scaleY(1);
  border-radius: 4px;
}


/*НОВЫЕ СТИЛИ ДЛЯ КНОПОК*/
/* === ОБЩИЕ СТИЛИ ДЛЯ ОБЕИХ КНОПОК === */
.js-store-prod-btn,
.t-btnflex.t-btnflex_type_button2 {
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
  border-radius: 60px;
  transition: border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s ease;
}

/* === ПСЕВДОЭЛЕМЕНТ ::before (подложка) === */
.js-store-prod-btn::before,
.t-btnflex.t-btnflex_type_button2::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 60px;
}

/* === ПЕРВАЯ КНОПКА (изначально белая → hover синяя) === */
.js-store-prod-btn,
a.js-store-prod-btn.t-store__card__btn.t-btn.t-btn_sm {
  background-color: #FFFFFF; /* белый фон */
  color: #020A17; /* тёмный текст */
  border: 1px solid #CDCED1; /* серая рамка */
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
  border-radius: 60px;
  transition:
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    color 0.3s ease,
    border-color 0.3s ease;
}

.js-store-prod-btn::before,
a.js-store-prod-btn.t-store__card__btn.t-btn.t-btn_sm::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: #1B63E9; /* синяя заливка */
  transform: scaleY(0);
  transform-origin: bottom;
  transition:
    transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 60px;
}

.js-store-prod-btn:hover,
a.js-store-prod-btn.t-store__card__btn.t-btn.t-btn_sm:hover {
  color: white !important; /* текст становится белым */
  border-color: transparent; /* рамка исчезает */
  border-radius: 4px; /* плавное уменьшение */
}

.js-store-prod-btn:hover::before,
a.js-store-prod-btn.t-store__card__btn.t-btn.t-btn_sm:hover::before {
  transform: scaleY(1); /* заливка */
  border-radius: 4px;
}


/* === ВТОРАЯ КНОПКА (темно-синяя → hover) === */
.js-store-grid-cont .t-item .t-btnflex_type_button2,
a.js-store-prod-btn2.t-store__card__btn.t-store__card__btn_second.t-btn.t-btn_sm {
  background-color: #1B63E9 !important;
  color: white !important;
  border: none !important;
  border-radius: 60px;
  transition:
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    background-color 0.3s ease;
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
}

/* Псевдоэлемент */
.js-store-grid-cont .t-item .t-btnflex_type_button2::before,
a.js-store-prod-btn2.t-store__card__btn.t-store__card__btn_second.t-btn.t-btn_sm::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: #074FD5;
  transform: scaleY(0);
  transform-origin: bottom;
  border-radius: 60px;
  transition:
    transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover */
.js-store-grid-cont .t-item .t-btnflex_type_button2:hover,
a.js-store-prod-btn2.t-store__card__btn.t-store__card__btn_second.t-btn.t-btn_sm:hover {
  border-radius: 4px !important;
}

.js-store-grid-cont .t-item .t-btnflex_type_button2:hover::before,
a.js-store-prod-btn2.t-store__card__btn.t-store__card__btn_second.t-btn.t-btn_sm:hover::before {
  transform: scaleY(1);
  border-radius: 4px;
}



/* Первая кнопка — изначально белая */
#allrecords a.js-store-prod-btn.t-store__card__btn {
  background-color: #FFFFFF !important; /* белый цвет */
  color: #020A17 !important;
  border: 1px solid #CDCED1 !important;
}

/*Убираем кнопку загрузиь еще в галерее*/
button.t-btn.t-btnflex.t-btnflex_type_button.t-btnflex_sm.js-store-load-more-btn.t-store__load-more-btn {
    display: none;
}
#allrecords a.js-store-prod-btn.t-store__card__btn:hover,
#allrecords a.js-store-prod-btn.t-store__card__btn:focus,
#allrecords a.js-store-prod-btn.t-store__card__btn:active {
  color: #FFFFFF !important;
}