/* === Обычный фон страницы и защита от горизонтального скролла === */
html, body {
  background-color: #FAF4E1 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  width: 100vw !important;
}

/* === Zero-блоки по всей ширине === */
.t396__artboard,
.t396__carrier,
.t396__filter {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  overflow: hidden !important;
}

/* === Элементы внутри блоков не вылезают === */
.t396__elem {
  max-width: 100vw !important;
}

/* === Фон страницы при открытом меню — только на мобиле === */
/* На десктопе фон остаётся кремовым, потому что меню открывается сбоку,
   а контент справа виден. На мобиле меню разворачивается на весь экран,
   поэтому красим всё в оливковый, чтобы не было светлых краёв.
   Правило покрывает 4 варианта расположения класса .menu-open
   (на html, body, или обоих — JS Tilda может ставить по-разному).
   transition: 0s — чтобы переключение цвета было мгновенным,
   иначе при закрытии меню фон успевает окраситься в оливковый. */
@media (max-width: 768px){
  html.menu-open,
  html.menu-open body,
  body.menu-open,
  body.menu-open html {
    background-color: #777857 !important;
    transition: background-color 0s !important;
  }
}

/* === Исправление для Safari / iPhone === */
@supports (-webkit-touch-callout: none) {
  html, body {
    width: 100vw !important;
    overflow-x: hidden !important;
  }
}

/* === Окно "Спасибо" в попапах Тильды === */
/* Затемнение позади */
.t-form-success-popup {
  background: rgba(44, 44, 42, 0.55) !important;
}
/* Карточка */
.t-form-success-popup__wrapper {
  background-color: #FAF4E1 !important;
  border-radius: 20px !important;
  padding: 56px 40px 48px !important;
  max-width: 440px !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18) !important;
}
/* Заголовок "Спасибо!" */
.t-form-success-popup__title {
  color: #2C2C2A !important;
  font-family: 'futura', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 500 !important;
  font-size: 26px !important;
}
/* Текст */
.t-form-success-popup__text {
  color: #777857 !important;
  font-family: 'futura', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 400 !important;
  font-size: 15px !important;
}
/* Прячем кнопку "Хорошо" */
.t-form-success-popup__button {
  display: none !important;
}
/* Перекрашиваем зелёную галочку в оливковую */
.t-form-success-popup__icon svg circle,
.t-form-success-popup__icon svg path {
  fill: #777857 !important;
}

/* === Фикс для safe-area внизу iPhone: при открытом меню окрашиваем системную safe-area в оливковый === */
@media (max-width: 768px) {
  html.menu-open,
  body.menu-open {
    background-color: #777857 !important;
  }

  /* Принудительно красим страницу под body тоже */
  html.menu-open::before,
  html.menu-open::after {
    content: '';
    position: fixed;
    left: 0;
    right: 0;
    background-color: #777857 !important;
    z-index: -1;
  }
  html.menu-open::before {
    top: 0;
    height: env(safe-area-inset-top, 0);
  }
  html.menu-open::after {
    bottom: 0;
    height: env(safe-area-inset-bottom, 0);
  }
}