html {
  scroll-behavior: smooth;
}

html {
  scroll-padding-top: 80px;
}

/* === Компактная шапка скрыта по умолчанию === */
.uc-compact-header {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 9990;
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* === Когда у body есть класс is-scrolled — показываем компактную === */
body.is-scrolled .uc-compact-header {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* === Когда пользователь в Stage-блоке — скрываем компактную шапку === */
body.is-in-stage .uc-compact-header {
  opacity: 0 !important;
  transform: translateY(-100%) !important;
  pointer-events: none !important;
}

/* === Плавная прокрутка к якорям с учётом компактной шапки === */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 70px;
}

@media (min-width: 960px) and (max-width: 1199px) {
  html { scroll-padding-top: 60px; }
}

@media (min-width: 640px) and (max-width: 959px) {
  html { scroll-padding-top: 65px; }
}

@media (max-width: 639px) {
  html { scroll-padding-top: 55px; }
}

/* Шапка растягивается под safe area iOS */
.uc-compact-header {
  padding-top: env(safe-area-inset-top);
  background-color: #161616; /* или какой у тебя фон шапки — чтобы зона под чёлкой была того же цвета */
}

/* Тоже для большой шапки чтобы не было разного фона */
#t-header {
  background-color: #161616;
}