/* new-hire-packet.trade-industrial -- generated by the motion moat. Edit the motion
   document, not this file. */

/* cta.press (feedback) -- confirm the press landed with a quick scale-down and back, matching the trade-quote-pdf set's own button-press shape across the portfolio */
@keyframes new-hire-packet-trade-industrial-cta-press {
  0% { transform: scale(1); }
  50% { transform: scale(0.96); }
  100% { transform: scale(1); }
}

.motion-new-hire-packet-trade-industrial-cta-press {
  animation-name: new-hire-packet-trade-industrial-cta-press;
  animation-duration: 140ms;
  animation-timing-function: cubic-bezier(0.4, 0.0, 0.6, 1);
  animation-delay: 0ms;
  animation-iteration-count: 1;
  animation-fill-mode: both;
}

@media (prefers-reduced-motion: reduce) {
  @keyframes new-hire-packet-trade-industrial-cta-press-reduced {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  .motion-new-hire-packet-trade-industrial-cta-press {
    animation-name: new-hire-packet-trade-industrial-cta-press-reduced;
    animation-iteration-count: 1;
  }
}

/* control.hover (state) -- a lift-and-brighten highlight -- more present than a form's quiet hover since this page is browsed, not filled out repeatedly. Disabled controls (none exist on this static hub) explicitly opt out rather than playing a dimmed version */
@keyframes new-hire-packet-trade-industrial-control-hover {
  0% { transform: translateY(0); filter: brightness(1); }
  100% { transform: translateY(-2px); filter: brightness(1.08); }
}

.motion-new-hire-packet-trade-industrial-control-hover {
  animation-name: new-hire-packet-trade-industrial-control-hover;
  animation-duration: 120ms;
  animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);
  animation-delay: 0ms;
  animation-iteration-count: 1;
  animation-fill-mode: both;
}

@media (prefers-reduced-motion: reduce) {
  .motion-new-hire-packet-trade-industrial-control-hover {
    animation-duration: 1ms;
    animation-iteration-count: 1;
  }
}

/* content.enter (transition) -- content settles in from slightly below and fades up, so the fetch-then-render sequence reads as the page arriving rather than an empty shell replaced by a flash of content */
@keyframes new-hire-packet-trade-industrial-content-enter {
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}

.motion-new-hire-packet-trade-industrial-content-enter {
  animation-name: new-hire-packet-trade-industrial-content-enter;
  animation-duration: 240ms;
  animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);
  animation-delay: 0ms;
  animation-iteration-count: 1;
  animation-fill-mode: both;
}

@media (prefers-reduced-motion: reduce) {
  @keyframes new-hire-packet-trade-industrial-content-enter-reduced {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  .motion-new-hire-packet-trade-industrial-content-enter {
    animation-name: new-hire-packet-trade-industrial-content-enter-reduced;
    animation-iteration-count: 1;
  }
}