/* Дополнительные стили для автономной версии сайта ЦФК */

html {
  scroll-behavior: smooth;
}

/* Прозрачная интеграция логотипа на кремовом фоне шапки */
.sb-logotype-wrapper__image {
  mix-blend-mode: multiply;
}

/* Анимация иконки +/- в аккордеоне Вопрос-ответ */
.s-faq-type-3__question:after {
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.s-faq-type-3__question_open:after {
  transform: rotate(90deg);
  opacity: 0;
}

/* Плавное наведение на карточки услуг на главной и блоки преимуществ на страницах услуг */
.s-product-services-type-5__image a {
  display: block;
  width: 100%;
  height: 100%;
}

.s-product-services-type-5__item .sb-image-crop,
.s-advantages-blocks-type-3__item .sb-image-crop {
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}

.s-product-services-type-5__item:hover .sb-image-crop,
.s-advantages-blocks-type-3__item:hover .sb-image-crop {
  transform: scale(1.03);
}

/* Бейдж этапа на карточках услуг */
.cfc-step-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  background: #F4F1EA;
  border: 1px solid rgba(17, 17, 17, 0.1);
  padding: 4px 12px;
  border-radius: 99px;
  margin-bottom: 10px;
}

.cfc-step-badge_flagship {
  background: #111111;
  color: #F7F0DE;
  border-color: #111111;
}

/* Плашка сквозного маршрута на главной и страницах услуг */
.cfc-contour-banner {
  background: #F7F0DE;
  border: 1px solid rgba(17, 17, 17, 0.12);
  border-radius: 16px;
  padding: 24px 28px;
  margin-top: 20px;
  margin-bottom: 36px;
}

.cfc-contour-banner__title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #111111;
  margin-bottom: 14px;
}

.cfc-contour-steps {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 12px;
}

.cfc-contour-step {
  background: #ffffff;
  border: 1px solid rgba(17, 17, 17, 0.1);
  border-radius: 12px;
  padding: 14px 16px;
  text-decoration: none;
  display: block;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.cfc-contour-step:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
  border-color: rgba(17, 17, 17, 0.3);
}

.cfc-contour-step_active {
  border: 2px solid #111111;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.07);
}

.cfc-contour-step__num {
  font-size: 11px;
  font-weight: 700;
  color: #64748B;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.cfc-contour-step_active .cfc-contour-step__num {
  color: #2563EB;
}

.cfc-contour-step__name {
  font-size: 15px;
  font-weight: 700;
  color: #111111;
  margin-bottom: 4px;
}

.cfc-contour-step__desc {
  font-size: 12.5px;
  color: rgba(17, 17, 17, 0.68);
  line-height: 1.35;
}

.cfc-contour-arrow {
  font-size: 20px;
  font-weight: 700;
  color: rgba(17, 17, 17, 0.45);
  text-align: center;
}

@media screen and (max-width: 959px) {
  .cfc-contour-steps {
    grid-template-columns: 1fr;
  }
  .cfc-contour-arrow {
    transform: rotate(90deg);
    margin: -4px 0;
  }
}

/* Выпадающий список выбора услуги в форме заявки */
.sb-input__select {
  cursor: pointer;
  padding-right: 36px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 16px !important;
}

/* Выпадающее подменю «Услуги» — показ полного текста без обрезки */
@media screen and (min-width: 960px) {
  .sb-submenu-wrapper {
    width: max-content;
  }
  .sb-submenu {
    max-width: none !important;
    width: max-content !important;
    min-width: 280px;
  }
  .sb-submenu-value {
    white-space: nowrap;
    overflow: visible !important;
    text-overflow: clip !important;
  }
}

@media screen and (max-width: 959px) {
  .sb-submenu-dropdown {
    display: block;
  }
  .sb-submenu-value {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}

/* Компактный верхний блок Hero (Вариант 1 — уменьшенная дуга в стиле Т-Банка) */
@media screen and (min-width: 960px) {
  .s-main-type-5,
  .s-main-type-5.sb-block_fullscreen {
    min-height: 480px !important;
    padding: 40px 0 !important;
  }
  .s-main-type-5_left .s-main-type-5__additional {
    width: 44% !important;
    border-radius: 0 0 0 180px !important;
  }
  .s-main-type-5__background {
    background-size: cover !important;
    background-position: center center !important;
  }
}

@media (min-width: 640px) and (max-width: 959px) {
  .s-main-type-5_left .s-main-type-5__additional {
    min-height: 340px !important;
    border-radius: 0 0 0 180px !important;
  }
}

@media screen and (max-width: 639px) {
  .s-main-type-5_left .s-main-type-5__additional {
    min-height: 260px !important;
    border-radius: 0 0 0 120px !important;
  }
}

/* Уменьшенные отступы между вопросами и разделительной полосой в блоке «Вопрос-ответ» */
.s-faq-type-3__question.sb-m-6-bottom.sb-p-6-bottom {
  padding-bottom: 14px !important;
  margin-bottom: 18px !important;
}

.s-faq-type-3 .sb-row.sb-m-3-bottom {
  margin-bottom: 36px !important;
}

.s-faq-type-3__answer-text.sb-p-18-top {
  padding-top: 10px !important;
}

/* Компактная вертикальная шкала в блоке «Этапы процесса» (Вариант 1) */
.s-steps-type-2 .sb-row.sb-m-3-bottom {
  margin-bottom: 36px !important;
}

@media screen and (min-width: 960px) {
  .s-steps-type-2__circle {
    width: 56px !important;
    height: 56px !important;
    margin-right: 28px !important;
    font-size: 22px !important;
  }
  .s-steps-type-2__line {
    top: 56px !important;
    left: 28px !important;
  }
}

.s-steps-type-2__block-wrapper.sb-p-2-bottom {
  padding-bottom: 26px !important;
}

.s-steps-type-2__block-wrapper:last-child {
  padding-bottom: 0 !important;
}

.s-steps-type-2__text h3.sb-font-h4 {
  font-size: 22px !important;
  line-height: 28px !important;
  margin-bottom: 4px !important;
}

.s-steps-type-2__text .sb-font-p2 {
  font-size: 16px !important;
  line-height: 24px !important;
  max-width: 860px;
}

/* Анимация появления картинок при скролле (Вариант 1 — Стиль Samolet: Fade-Up + Image Scale-Out)
   Действует только для картинок в «Услуги и решения» на главной и в «Преимуществах» на страницах услуг
*/
.cfc-reveal {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.cfc-reveal .sb-image-crop {
  transform: scale(1.09);
  transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}

.cfc-reveal.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

.s-product-services-type-5__item:not(:hover) .cfc-reveal.is-revealed .sb-image-crop,
.s-advantages-blocks-type-3__item:not(:hover) .cfc-reveal.is-revealed .sb-image-crop {
  transform: scale(1);
}

/* Легкая каскадная задержка для правой колонки картинок на главной */
@media screen and (min-width: 640px) {
  .s-product-services-type-5__item-wrapper:nth-child(2n) .cfc-reveal {
    transition-delay: 0.12s;
  }
  .s-product-services-type-5__item-wrapper:nth-child(2n) .cfc-reveal .sb-image-crop {
    transition-delay: 0.12s;
  }
}

/* Убираем отступ под бывший баннер конструктора Т-Банка */
@media screen and (max-width: 959px) {
  .sb-body_with-footer .site-wrapper {
    min-height: 100vh;
  }
}

@media screen and (min-width: 960px) {
  .sb-body_with-footer .site-wrapper {
    min-height: 100vh;
  }
}