/* Keep the scroll viewport stable while the fixed header changes visibility. */
.recruit-mode.has-video-intro .swipe-container {
  height: 100dvh !important;
  margin-top: 0;
  scroll-padding-top: var(--header-height);
}
.recruit-mode .swipe-container #video-intro {
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden;
  background: #111;
  isolation: isolate;
}
.recruit-mode.video-intro-visible #header_calbeeroot {
  visibility: hidden;
  pointer-events: none;
}
.recruit-mode.video-intro-visible #back-top { display: none !important; }
.intro-video__media {
  position: absolute; inset: 0;
  display: block; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.intro-video__scroll {
  position: absolute; bottom: max(28px, calc(env(safe-area-inset-bottom) + 20px));
  left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 12px 18px; color: #fff; background: rgb(0 0 0 / 35%);
  font: 600 12px/1.3 var(--familyMurecho); letter-spacing: .18em;
  text-decoration: none; z-index: 2;
}
.intro-video__arrow { width: 12px; height: 12px; border-right: 2px solid; border-bottom: 2px solid; transform: rotate(45deg); }
.intro-video__status { position: absolute; bottom: 120px; left: 16px; right: 16px; padding: 10px; color: #fff; background: rgb(0 0 0 / 70%); font-size: 14px; }
.intro-video__scroll:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
  .intro-video__arrow { animation: intro-scroll-cue 1.8s ease-in-out infinite; }
  @keyframes intro-scroll-cue {
    0%, 100% { transform: translateY(-3px) rotate(45deg); }
    50% { transform: translateY(3px) rotate(45deg); }
  }
}
