/* style.css */
/* Переменные проекта */
:root {
  --color-primary: #0052FF;
  --color-dark: #0A1128;
  --color-muted: #7D8599;
  --color-border: #E2E8F0;
  --font-inter: 'Inter', sans-serif;
}

html {
  scroll-behavior: smooth;
}

/* ИСПРАВЛЕНИЕ СДВИГА ШАПКИ ПРИ ОТКРЫТИИ МОДАЛЬНЫХ ОКНО */
html, body {
  /* Резервирует место под полосу прокрутки. 
     Когда скролл исчезнет при открытии модалки, страница и шапка не шелохнутся */
  scrollbar-gutter: stable !important;
}

/* Дополнительная страховка для корректного поведения сетки Bootstrap */
body.modal-open {
  padding-right: 0 !important;
}

.modal-open .fixed-top {
  padding-right: 0 !important;
}
/* Опционально: отступ сверху, чтобы шапка не перекрывала заголовки блоков */
section {
  scroll-margin-top: 100px; 
}

/* Компенсация высоты фиксированной шапки, чтобы контент Hero-секции не перекрывался */
.wrapper {
  width: 100%;
  position: relative;
  /* На мобильных шапка 70px, сдвигаем контент вниз */
  padding-top: 70px; 
}

@media (min-width: 1200px) {
  .wrapper {
    /* На десктопе шапка 100px, увеличиваем сдвиг */
    padding-top: 100px; 
  }
}

/* Настройка точного скролла к секциям (чтобы заголовки не прятались под шапку) */
section {
  scroll-margin-top: 70px;
}

@media (min-width: 1200px) {
  section {
    scroll-margin-top: 100px;
  }
}


/* Мобильное меню должно открываться корректно относительно фиксированной шапки */
@media (max-width: 1199.98px) {
  .calc-chart-box{
    display: none !important;
  }
  .navbar-collapse {
    background-color: #ffffff;
    position: fixed;
    top: 69px;
    left: 0;
    right: 0;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 1050;
    border-bottom: 1px solid var(--color-border);
    max-height: calc(100vh - 70px);
    overflow-y: auto;
  }
}

/* Ограничитель контента по макету (1200px) */
.container-custom {
  max-width: 1200px;
  width: 100%;
}

/* Базовая высота шапки (мобильная версия) */
.header-height {
  height: 70px;
}

.border-bottom {
  border-bottom: 1px solid var(--color-border) !important;
}

/* Стили мобильного логотипа */
.logo-main {
  font-family: var(--font-inter);
  font-size: 24px;
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
}

.logo-text-gap {
  margin-left: 16px;
}

.logo-sub-title {
  font-family: var(--font-inter);
  font-size: 11px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.2;
}

.logo-sub-desc {
  font-family: var(--font-inter);
  font-size: 8px;
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.2;
  margin-top: 1px;
}

/* Мобильный паддинг по макету */
.px-mobile-16 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Стили кастомного SVG-бургера */
.burger-custom {
  width: 18px;
  height: 14px;
}

.burger-line {
  display: block;
  width: 18px;
  height: 2px;
  background-color: var(--color-dark);
  border-radius: 1px;
}

/* Стили навигационных ссылок (мобильные по умолчанию) */
.nav-link-custom {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-dark);
  transition: color 0.3s ease;
  display: inline-block;
}

.nav-link-custom:hover {
  color: var(--color-primary);
}

/* Стили кнопки */
.btn-custom {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  background-color: var(--color-primary);
  border: none;
  border-radius: 4px;
  height: 46px;
  letter-spacing: 0.5px;
  transition: opacity 0.3s ease;
}

.btn-custom:hover,
.btn-custom:focus,
.btn-custom:active {
  color: #ffffff !important;
  background-color: var(--color-primary) !important;
  opacity: 0.85;
  outline: none;
  box-shadow: none;
}

/* МЕДИА-ЗАПРОС ДЛЯ ДЕСКТОПА (Адаптация под первый SVG) */
@media (min-width: 1200px) {
  .header-height {
    height: 100px;
  }

  .logo-main {
    font-size: 32px;
  }

  .logo-divider {
    width: 1px;
    height: 28px;
    background-color: var(--color-muted);
    opacity: 0.5;
  }

  .logo-text-gap {
    margin-left: 0;
  }

  .logo-sub-title {
    font-size: 16px;
  }

  .logo-sub-desc {
    font-size: 11px;
    margin-top: 2px;
  }

  .navbar-nav {
    margin-left: 60px; /* Смещение для точного соответствия X=420 на десктопе */
  }
  
  .collapse.navbar-collapse {
    background-color: transparent;
    display: flex !important;
    flex-basis: auto;
  }
}


.logo-main, footer a img{
  width: 195px;
}
/* Коррекция раскрывающегося меню на мобильных устройствах */
@media (max-width: 1199.98px) {

  .logo-main {
    width: 130px;
}
  .navbar-collapse {
    background-color: #ffffff;
    position: absolute;
    top: 69px;
    left: 0;
    right: 0;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 1050;
    border-bottom: 1px solid var(--color-border);
  }
}


/* style.css */
/* Кастомные стили с поддержкой мобильной и ПК спецификаций SVG */

.rx-8 {
  border-radius: 8px !important;
}

/* Стили текстового контента главного экрана */
.hero-title {
  font-family: var(--font-inter);
  font-size: 34px; /* Мобильный размер */
  font-weight: 800;
  color: var(--color-dark);
}

.hero-subtitle {
  font-family: var(--font-inter);
  font-size: 16px; /* Мобильный размер */
  font-weight: 600;
  color: var(--color-primary);
}

.hero-list-title {
  font-family: var(--font-inter);
  font-size: 14px; /* Мобильный размер */
  font-weight: 600;
  color: var(--color-dark);
}

.hero-list-item {
  font-family: var(--font-inter);
  font-size: 13px; /* Мобильный размер */
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.3;
}

.hero-marker {
  width: 6px; /* Мобильный размер */
  height: 6px;
  background-color: var(--color-primary);
  border-radius: 50%;
  display: inline-block;
}

/* Стили центральной части (Фото / Заглушка) */
.min-photo-height {
  min-height: 240px;
}

.hero-bg-circle {
  width: 220px; /* Мобильный размер (r=110) */
  height: 220px;
  background-color: #F4F7FF;
  opacity: 0.8;
  border-radius: 50%;
  z-index: 1;
}

.hero-photo-placeholder {
  width: 230px; /* Мобильный размер */
  height: 240px;
  /* background-color: rgba(226, 232, 240, 0.6); */
  z-index: 2;
}

.hero-silhouette {
  width: 100%;
  height: auto;
}

/* Стили формы захвата */
.hero-form {
  width: 100%;
  max-width: 343px; /* Ограничение мобильной ширины */
  box-sizing: border-box;
  padding: 30px 20px; /* Мобильные отступы */
}

.shadow-custom {
  box-shadow: 0 6px 20px rgba(10, 17, 40, 0.05) !important; /* Легкая мобильная тень */
}

.form-title {
  font-family: var(--font-inter);
  font-size: 18px; /* Мобильный размер */
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.3;
}

.form-input-custom {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  height: 50px;
  color: var(--color-dark);
  border: 1px solid var(--color-border);
  border-radius: 4px;
}

.form-input-custom::placeholder {
  color: var(--color-muted);
}

.form-input-custom:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 0.25rem rgba(0, 82, 255, 0.1);
}

/* Чекбокс */
.form-checkbox-custom {
  user-select: none;
}





.form-checkbox-text {
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 400;
  color: var(--color-muted);
  line-height: 1.3;
}

/* Кнопка отправки в форме */
.btn-form-submit {
  font-family: var(--font-inter);
  font-size: 15px; /* Мобильный размер */
  font-weight: 600;
  color: #ffffff !important;
  background-color: var(--color-primary) !important;
  height: 50px; /* Мобильный размер */
  border-radius: 4px;
  transition: opacity 0.3s ease;
}

.btn-form-submit:hover,
.btn-form-submit:focus {
  opacity: 0.88;
  outline: none;
}

.form-secure-text {
  font-family: var(--font-inter);
  font-size: 11px; /* Мобильный размер */
  color: var(--color-muted);
}

/* МЕДИА-ЗАПРОС ДЛЯ ПЕРЕКЛЮЧЕНИЯ НА ДЕСКТОПНЫЕ ПАРАМЕТРЫ */
@media (min-width: 1200px) {
  .hero-title {
    font-size: 54px;
  }

  .hero-subtitle {
    font-size: 22px;
  }

  .hero-list-title {
    font-size: 18px;
  }

  .hero-list-item {
    font-size: 16px;
  }

  .hero-marker {
    width: 8px;
    height: 8px;
  }

  .min-photo-height {
    min-height: 520px;
  }

  .hero-bg-circle {
    width: 480px;
    height: 480px;
    opacity: 0.6;
  }

  .hero-photo-placeholder {
    width: 340px;
    height: 500px;
  }

  .hero-form {
    max-width: 380px;
    padding: 40px 30px;
  }

  .shadow-custom {
    box-shadow: 0 10px 30px rgba(10, 17, 40, 0.06) !important;
  }

  .form-title {
    font-size: 20px;
  }

  .btn-form-submit {
    font-size: 16px;
    height: 54px;
  }

  .form-secure-text {
    font-size: 12px;
  }
}


/* style.css */
/* Кастомные стили для секции преимуществ */

.rx-6 {
  border-radius: 6px !important;
}

/* Оформление карточки */
.feature-card {
  background-color: #F4F7FF;
  min-height: 200px;
  box-sizing: border-box;
}

/* Белая подложка для SVG-иконок */
.feature-icon-wrapper {
  width: 32px;
  height: 32px;
}

/* Стилизация текстовых элементов */
.feature-title {
  font-family: var(--font-inter);
  font-size: 22px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.3;
}

.feature-desc {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  color: var(--color-muted);
  line-height: 1.4;
  letter-spacing: 0.2px;
}


/* style.css */
/* Кастомные стили для секции таймлайна */

.section-title {
  font-family: var(--font-inter);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
}

/* Ограничение скролла для мобильных экранов */
.timeline-scroll-container {
  overflow-x: auto;
  scrollbar-width: none; /* Скрытие скроллбара для Firefox */
  -ms-overflow-style: none; /* Скрытие скроллбара для IE/Edge */
  padding-bottom: 15px;
}

.timeline-scroll-container::-webkit-scrollbar {
  display: none; /* Скрытие скроллбара для Chrome/Safari */
}

/* Обертка элементов таймлайна */
.timeline-wrapper {
  min-width: 1200px; /* Фиксация ширины для аккуратного шага по 128px */
  margin: 0 auto;
  padding-top: 12px;
}
@media (min-width: 1200px) {
 .timeline-wrapper::before {
    content: '';
    position: absolute;
    /* Ограничиваем линию от центра первого круга до центра последнего (карточка 90px / 2 = 45px) */
    left: 55px;
    right: 55px;
    /* Центрируем по вертикали относительно кружка (padding-top 12px + радиус 12px) */
    top: 24px;
    height: 2px;
    border-top: 2px dashed rgba(0, 82, 255, 0.3);
    z-index: 1;
  }
}



/* Карточка этапа */
.timeline-item {
  width: 100px;
  z-index: 2;
}

/* Синие кружки этапов */
.step-circle {
  width: 24px;
  height: 24px;
  background-color: var(--color-primary);
  border-radius: 50%;
}

/* Номера внутри кружков */
.step-number {
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

/* Подписи к шагам */
.step-text {
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.3;
}

/* Адаптивность для средних и маленьких экранов */
@media (max-width: 1199.98px) {
  /* Перевод таймлайна в формат аккуратной вертикальной цепочки на планшетах и смартфонах */
  .timeline-wrapper {
        min-width: auto;
    width: max-content; /* Сжимаем контейнер строго по ширине текста, чтобы mx-auto сработал корректно */
    max-width: 100%; /* Защита от вылета за границы экрана на очень узких дисплеях */
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    padding-left: 0 !important; /* Убираем лишние сдвиги для точного центрирования */
    padding-right: 0 !important;
  }
  
  .timeline-item {
    flex-direction: row !important;
    align-items: center !important;
    width: 100%;
    text-align: left;
  }
  
  /* Вертикальная пунктирная линия */
  .timeline-wrapper::before {
    content: '';
    position: absolute;
    left: 11px;
    top: 12px;
    bottom: 12px;
    width: 2px;
    border-left: 2px dashed rgba(0, 82, 255, 0.3);
    z-index: 1;
  }
  
  .step-text {
    margin-top: 0 !important;
    margin-left: 20px;
    font-size: 13px;
  }
  
  .step-text br {
    display: none; /* Превращаем текст в ровную строку без переносов на мобильных */
  }
}


/* style.css */
/* Кастомные стили для секции анализа причин */

.reason-card {
  background-color: #F4F7FF;
  box-sizing: border-box;
}

.column-title {
  font-family: var(--font-inter);
  font-size: 20px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.2;
}

.list-item-text {
  font-family: var(--font-inter);
  font-size: 16px;
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.4;
}

/* Иконка красного крестика (Что мешает продаже) */
.icon-cross {
  width: 12px;
  height: 16px;
  display: inline-block;
  position: relative;
}

.icon-cross::before,
.icon-cross::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 2px;
  height: 12px;
  width: 2px;
  background-color: #FF4D4D;
  border-radius: 1px;
}

.icon-cross::before {
  transform: rotate(45deg);
}

.icon-cross::after {
  transform: rotate(-45deg);
}

/* Иконка зеленой галочки (Что делаю я) */
.icon-check {
  width: 14px;
  height: 16px;
  display: inline-block;
  position: relative;
}

.icon-check::before {
  content: '';
  position: absolute;
  left: 1px;
  top: 7px;
  width: 5px;
  height: 2px;
  background-color: #00CC66;
  border-radius: 1px;
  transform: rotate(45deg);
}

.icon-check::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 3px;
  width: 10px;
  height: 2px;
  background-color: #00CC66;
  border-radius: 1px;
  transform: rotate(-55deg);
}

/* style.css */
/* Кастомные стили для интерактивного блока калькулятора */

.rx-12 {
  border-radius: 12px !important;
}

/* Фоновая плашка калькулятора */
.calc-card {
  background-color: #F4F7FF;
  width: 100%;
}

.calc-title {
  font-family: var(--font-inter);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.25;
}

.calc-subtitle {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-dark);
  line-height: 1.2;
}

/* Стили полей ввода и выпадающего списка */
.form-input-custom {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  height: 50px;
  color: var(--color-dark);
  border: 1px solid var(--color-border);
  border-radius: 4px;
  background-color: #ffffff;
}

.form-input-custom::placeholder {
  color: var(--color-muted);
}

.form-input-custom:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 0.25rem rgba(0, 82, 255, 0.1) !important;
}

/* Фикс для селекта, чтобы placeholder изначально был серым */
select.form-input-custom:invalid,
select.form-input-custom option[value=""] {
  color: var(--color-muted);
}

/* Кнопка */
.btn-calc-submit {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 600;
  color: #ffffff !important;
  background-color: var(--color-primary) !important;
  height: 54px;
  border-radius: 4px;
  transition: opacity 0.3s ease;
}

.btn-calc-submit:hover,
.btn-calc-submit:focus {
  opacity: 0.88;
  outline: none;
}

/* Блок иллюстрации отчета аналитики */
.calc-chart-box {
  width: 220px;
  height: 190px;
  box-sizing: border-box;
  border-color: var(--color-border) !important;
}

.chart-decor-line-1 {
  width: 100px;
  height: 12px;
  background-color: var(--color-dark);
  opacity: 0.1;
}

.chart-decor-line-2 {
  width: 60px;
  height: 8px;
  background-color: var(--color-dark);
  opacity: 0.05;
}

.chart-svg-height {
  height: 90px;
}

/* Адаптивный сброс стилей для мобильных разрешений */
@media (max-width: 575.98px) {
  .calc-title {
    font-size: 24px;
  }
  .calc-card {
    padding: 30px 16px !important;
  }
}

/* style.css */
/* Кастомная стилизация аккордеона FAQ с анимацией Плюс / Минус */

.faq-title {
  font-family: var(--font-inter);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
}

.accordion-custom {
  border-top-color: var(--color-border) !important;
}

.accordion-custom .accordion-item {
  border-bottom-color: var(--color-border) !important;
}

/* Базовые стили кнопок-вопросов */
.accordion-custom .accordion-button {
  font-family: var(--font-inter);
  font-size: 16px;
  font-weight: 500;
  color: var(--color-dark) !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding-right: 35px !important; /* Отступ справа под иконку */
}

/* Отключаем стандартный индикатор-стрелочку Bootstrap */
.accordion-custom .accordion-button::after {
  display: none !important;
}

/* ГОРИЗОНТАЛЬНАЯ ЛИНИЯ (Присутствует всегда) */
.accordion-custom .accordion-button::before {
  content: '';
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 2px;
  background-color: var(--color-primary);
  transition: transform 0.25s ease-in-out;
  z-index: 2;
}

/* ВЕРТИКАЛЬНАЯ ЛИНИЯ (Создает плюс вместе с горизонтальной) */
.accordion-custom .accordion-header {
  position: relative;
}

/* Используем псевдоэлемент на самой кнопке для создания вертикальной палочки */
.accordion-custom .accordion-button {
  --plus-after-display: block;
}

/* Прописываем наложение вертикальной линии через кастомный селектор */
.accordion-custom .accordion-button::after {
  content: '' !important;
  display: block !important;
  position: absolute;
  right: 12px; /* Находимся точно по центру горизонтальной линии (5px + 16px/2 - 2px/2) */
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 16px;
  background-color: var(--color-primary);
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease-in-out;
  z-index: 3;
}

/* ХОВЕР И АКТИВНОЕ СОСТОЯНИЕ: ТРАНСФОРМАЦИЯ ИКОНКИ ПРИ ОТКРЫТИИ */
/* Когда класс .collapsed отсутствует (блок ОТКРЫТ) -> превращаем ПЛЮС в МИНУС */
.accordion-custom .accordion-button:not(.collapsed)::after {
  transform: translateY(-50%) rotate(90deg); /* Поворачиваем вертикальную линию параллельно горизонтальной */
  opacity: 0; /* Плавно растворяем её, оставляя чистый минус */
}

/* Текст ответа */
.accordion-custom .accordion-body {
  font-family: var(--font-inter);
  font-size: 14px;
  line-height: 1.5;
}

@media (max-width: 575.98px) {
  .faq-title {
    font-size: 24px;
  }
  .accordion-custom .accordion-button {
    font-size: 14px;
  }
}


/* style.css */
/* Кастомные стили для финальной лид-формы и подвала */

.cta-title {
  font-family: var(--font-inter);
  font-size: 28px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.25;
}

.cta-desc {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  color: var(--color-dark);
}

/* Кнопка отправки формы в футере */
.btn-footer-submit {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 600;
  color: #ffffff !important;
  background-color: var(--color-primary) !important;
  height: 50px;
  border-radius: 4px;
  transition: opacity 0.3s ease;
}

.btn-footer-submit:hover,
.btn-footer-submit:focus {
  opacity: 0.88;
  outline: none;
}

/* Текст согласия */
.footer-checkbox-text {
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 400;
  color: var(--color-muted);
  line-height: 1.2;
}

/* Декоративное кресло */
.cta-armchair-decor {
  right: 40px;
  bottom: 0;
  z-index: 1;
}

.cta-armchair-decor img{
  width:320px;
}

/* Элементы инфо-подвала */
.logo-footer-main {
  font-family: var(--font-inter);
  font-size: 28px;
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
}

.footer-text-bold {
  font-family: var(--font-inter);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.2;
}

.footer-text-regular {
  font-family: var(--font-inter);
  font-size: 11px;
  font-weight: 400;
  color: var(--color-muted);
  line-height: 1.2;
  margin-top: 2px;
}

.footer-link-text {
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-dark);
  transition: color 0.3s ease;
}

.footer-phone-text {
  font-family: var(--font-inter);
  font-size: 18px;
  font-weight: 700;
  color: var(--color-dark);
  transition: color 0.3s ease;
}

.footer-link-block:hover .footer-link-text,
.footer-link-block:hover .footer-phone-text {
  color: var(--color-primary);
}

@media (max-width: 575.98px) {
  .cta-title {
    font-size: 22px;
  }
}

/* style.css */
/* Стили для юридических документов (кнопки-ссылки) */
.footer-legal-link {
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 400;
   color: var(--color-primary);
  text-decoration: none; /* Добавляем подчеркивание, выделяя как ссылку */
  text-underline-offset: 3px; /* Комфортный отступ подчеркивания от текста */
  cursor: pointer; /* Гарантируем курсор-указатель (палец) при наведении */
  transition: color 0.25s ease, text-decoration-color 0.25s ease;
  line-height: 1.4;
  display: inline !important;
  width:unset !important;
}

.footer-legal-link:hover,
.footer-legal-link:focus {

  text-decoration: underline !important; /* Сохраняем подчеркивание активным */
}

.footer-legal-text {
  font-family: var(--font-inter);
  font-size: 11px;
  font-weight: 400;
  color: var(--color-muted);
  line-height: 1.4;
}

/* Центрирование кнопок-ссылок исключительно в мобильной версии */
@media (max-width: 767.98px) {
  .text-center-mobile {
    text-align: center !important;
    display: block; /* Переводим в блочный режим на мобильных для точного центрирования */
    width: 100%;
  }
}




/* style.css */
/* Стили для нового информационного блока оплаты */

/* Рамка карточки скруглением 12px и фирменным нежным оттенком синего */
.payment-card {
  background-color: #ffffff;
  border: 1px solid rgba(0, 82, 255, 0.15); /* Деликатная синяя рамка по периметру картинки */
  box-shadow: 0 4px 24px rgba(10, 17, 40, 0.02);
}

/* Ограничение по цвету рамки */
.border-custom-blue {
  border-color: rgba(0, 82, 255, 0.15) !important;
}

/* Стили заголовка */
.payment-title {
  font-family: var(--font-inter);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-primary); /* Синий акцентный цвет текста заголовка */
  line-height: 1.3;
}

/* Стили основного текста описания */
.payment-desc {
  font-family: var(--font-inter);
  font-size: 18px;
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.5;
}

/* Фикс позиционирования иконки */
.payment-icon-wrapper {
  width: 64px;
  height: 64px;
}

/* Выравнивание текста описания под заголовком с учетом иконки на ПК */
@media (min-width: 576px) {
  .text-content-offset {
    padding-left: 28px !important;
  }
}

/* Адаптивное уменьшение шрифтов под мобильные устройства */
@media (max-width: 767.98px) {
  .payment-title {
    font-size: 22px;
  }
  .payment-desc {
    font-size: 15px;
  }
  .text-content-offset {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
}



/* ПЛАНШЕТНАЯ ВЕРСИЯ (Экраны меньше 1200px — ноутбуки, планшеты в альбомной и портретной ориентации) */
@media (max-width: 1199.98px) {
  .cta-armchair-decor {
     display: none !important;  
    /* Уменьшаем картинку на планшетах, чтобы освободить место для полей формы */
  }
}