/*
 * Jobs page entrance animations.
 *
 * Webflow exports set inline `opacity:0` on several elements, expecting
 * Interactions JS to reveal them. We replay the intent with CSS keyframes.
 *
 * Loaded only on `/about/jobs` by `app/(legacy)/about/jobs/page.tsx`.
 */

@keyframes wf-jobs-hero-fade-up {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.wf-body .career-banner-text-wrapper > .body-button-wrapper,
.wf-body .career-banner-image-wrapper {
  animation: wf-jobs-hero-fade-up 800ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.wf-body .career-banner-image-wrapper {
  animation-delay: 280ms;
  animation-duration: 1000ms;
}

.wf-body .career-banner-text-wrapper > .body-button-wrapper {
  animation-delay: 560ms;
}

@media (prefers-reduced-motion: reduce) {
  .wf-body .career-banner-text-wrapper > .body-button-wrapper,
  .wf-body .career-banner-image-wrapper {
    animation: none;
    opacity: 1 !important;
    transform: none;
  }
}

/* Hero CTA keeps one label — no vertical text swap on hover. */
.wf-body .career-banner-text-wrapper .button-font-1.veritcal-move-element {
  display: none;
}

.wf-body .career-banner-text-wrapper a.button.overflow-hidden:hover .animate-top-block,
.wf-body .career-banner-text-wrapper a.ads-animate-webflow-pill-cta:hover .animate-top-block {
  transform: none;
}