/* =========================================================
   SEAFARERS — CAREER JOURNEY FINAL REFINEMENT
   Desktop only
   ========================================================= */

@media (min-width:1051px){

  /* Remove radio-button-looking nodes */
  .sfw-career-route-dot{
    display:none !important;
  }

  /* Slightly tighter cards */
  .sfw-career-card{
    min-height:178px !important;
  }

  /* Keep journey line visually centered */
  .sfw-career-steps::before,
  .sfw-career-steps::after{
    top:50% !important;
  }

  /* Direction arrows between cards */
  .sfw-career-route-arrow{
    position:absolute;
    z-index:20;

    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#168fbd;

    background:
      rgba(244,252,255,.96);

    border:
      1px solid
      rgba(46,166,208,.25);

    box-shadow:
      0 7px 20px rgba(12,79,108,.12),
      0 0 0 4px rgba(80,185,222,.07);

    opacity:0;

    transform:
      translate(-50%,-50%)
      scale(.7);

    transition:
      opacity .45s ease,
      transform .65s
      cubic-bezier(.16,1,.3,1);

    pointer-events:none;
  }

  .sfw-career-route-arrow svg{
    width:14px;
    height:14px;

    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

  .sfw-career-inview
  .sfw-career-route-arrow{
    opacity:1;

    transform:
      translate(-50%,-50%)
      scale(1);
  }

  .sfw-career-route-arrow:nth-of-type(1){
    transition-delay:.42s;
  }

  .sfw-career-route-arrow:nth-of-type(2){
    transition-delay:.62s;
  }

  /* subtle pulse, not flashy */
  .sfw-career-inview
  .sfw-career-route-arrow{
    animation:
      sfwCareerArrowPulse
      3.6s ease-in-out
      1.3s infinite;
  }

  @keyframes sfwCareerArrowPulse{
    0%,100%{
      box-shadow:
        0 7px 20px rgba(12,79,108,.12),
        0 0 0 4px rgba(80,185,222,.07);
    }

    50%{
      box-shadow:
        0 8px 22px rgba(12,79,108,.14),
        0 0 0 7px rgba(80,185,222,.035);
    }
  }
}

@media (prefers-reduced-motion:reduce){
  .sfw-career-route-arrow{
    animation:none !important;
    transition:none !important;
    opacity:1 !important;
  }
}
