/* Первый экран отдан фотографии целиком: шапка скрыта и выезжает при прокрутке.
   Класс is-scrolled ставит runtime.js после 40px скролла.
   Двигаем .header, а не .topbar: сам .topbar нулевой высоты, шапка внутри – fixed. */

.hero-page .topbar .header {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  transition: transform var(--t-reveal) var(--ease-out), opacity var(--t-surface) var(--ease);
}

/* Показываем от первого движения скролла (is-hero-visible ставит hero-topbar.js),
   при переходе по Tab и при открытом мобильном меню. */
.hero-page .topbar.is-hero-visible .header,
.hero-page .topbar.is-scrolled .header,
.hero-page .topbar:focus-within .header,
.hero-page.menu-open .topbar .header {
  transform: none;
  opacity: 1;
  pointer-events: auto;
}

/* Место под шапку в кадре больше не нужно – фото занимает экран от края до края. */
.hero-page .hero-full--full-frame > picture { inset: 0; }

@media (prefers-reduced-motion: reduce) {
  .hero-page .topbar .header { transition: none; }
}