/* =========================================================
   SEA LICENSING — DIGITAL CAREER JOURNEY V1
   Desktop enhancement only
   ========================================================= */

@media (min-width:1051px){

  /* ---------------------------------------------------------
     SECTION
     --------------------------------------------------------- */

  .sfw-career-journey-enhanced{
    position:relative;
    isolation:isolate;
    overflow:hidden;
  }

  /* very subtle digital / route atmosphere */
  .sfw-career-journey-enhanced::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;

    background:
      radial-gradient(
        circle at 77% 32%,
        rgba(48,169,215,.095) 0%,
        rgba(48,169,215,.035) 20%,
        transparent 44%
      ),
      radial-gradient(
        circle at 14% 78%,
        rgba(46,139,184,.055) 0%,
        transparent 34%
      ),
      linear-gradient(
        115deg,
        transparent 0%,
        transparent 47%,
        rgba(78,178,213,.022) 47.2%,
        rgba(78,178,213,.022) 47.5%,
        transparent 47.7%,
        transparent 100%
      );
  }

  .sfw-career-journey-enhanced > *{
    position:relative;
    z-index:1;
  }


  /* ---------------------------------------------------------
     HEADING ENTRANCE
     --------------------------------------------------------- */

  .sfw-career-main-heading{
    opacity:0;
    transform:translate3d(-22px,12px,0);

    transition:
      opacity .7s ease,
      transform .85s cubic-bezier(.16,1,.3,1);
  }

  .sfw-career-journey-enhanced.sfw-career-inview
  .sfw-career-main-heading{
    opacity:1;
    transform:none;
  }


  /* ---------------------------------------------------------
     CARD WRAPPER / JOURNEY LINE
     --------------------------------------------------------- */

  .sfw-career-steps{
    position:relative !important;
    isolation:isolate;
  }

  /* base route */
  .sfw-career-steps::before{
    content:"";
    position:absolute;

    left:15%;
    right:15%;
    top:47%;

    height:2px;

    z-index:-1;

    background:
      linear-gradient(
        90deg,
        rgba(63,159,198,.10),
        rgba(46,165,212,.28),
        rgba(63,159,198,.10)
      );

    box-shadow:
      0 0 18px rgba(43,170,217,.08);

    pointer-events:none;
  }

  /* animated route travelling left -> right */
  .sfw-career-steps::after{
    content:"";
    position:absolute;

    left:15%;
    top:47%;

    width:70%;
    height:2px;

    z-index:-1;

    transform:scaleX(0);
    transform-origin:left center;

    background:
      linear-gradient(
        90deg,
        transparent 0%,
        #46bde7 18%,
        #59d0ef 52%,
        #2698c4 88%,
        transparent 100%
      );

    box-shadow:
      0 0 18px rgba(50,187,231,.30);

    transition:
      transform 1.45s
      cubic-bezier(.16,1,.3,1)
      .22s;

    pointer-events:none;
  }

  .sfw-career-inview
  .sfw-career-steps::after{
    transform:scaleX(1);
  }


  /* ---------------------------------------------------------
     CARDS
     --------------------------------------------------------- */

  .sfw-career-card{
    --mx:50%;
    --my:50%;

    position:relative !important;
    overflow:hidden !important;
    isolation:isolate;

    opacity:0;

    transform:
      translate3d(0,24px,0)
      scale(.985);

    border:
      1px solid
      rgba(34,124,165,.16) !important;

    box-shadow:
      0 9px 25px rgba(10,45,66,.055),
      inset 0 1px 0 rgba(255,255,255,.72);

    transition:
      opacity .7s ease,
      transform .7s cubic-bezier(.16,1,.3,1),
      border-color .28s ease,
      box-shadow .32s ease,
      background .32s ease !important;
  }

  .sfw-career-card[data-sfw-step="1"]{
    background:
      linear-gradient(
        145deg,
        rgba(255,255,255,.98),
        rgba(246,252,255,.97)
      ) !important;
  }

  .sfw-career-card[data-sfw-step="2"]{
    background:
      linear-gradient(
        145deg,
        rgba(235,249,255,.98),
        rgba(210,241,252,.94)
      ) !important;

    border-color:
      rgba(45,158,202,.24) !important;
  }

  .sfw-career-card[data-sfw-step="3"]{
    background:
      linear-gradient(
        145deg,
        #123f5c 0%,
        #17648a 100%
      ) !important;

    border-color:
      rgba(109,208,238,.24) !important;

    box-shadow:
      0 14px 30px rgba(7,44,65,.14),
      inset 0 1px 0 rgba(255,255,255,.05);
  }


  /* mouse-follow spotlight */
  .sfw-career-card::after{
    content:"";

    position:absolute;
    inset:0;

    z-index:-1;

    opacity:0;

    background:
      radial-gradient(
        260px circle
        at var(--mx) var(--my),
        rgba(74,195,232,.16),
        transparent 62%
      );

    transition:opacity .3s ease;

    pointer-events:none;
  }

  .sfw-career-card:hover::after{
    opacity:1;
  }


  /* sequential scroll entrance */

  .sfw-career-inview
  .sfw-career-card{
    opacity:1;
    transform:none;
  }

  .sfw-career-inview
  .sfw-career-card[data-sfw-step="1"]{
    transition-delay:.12s;
  }

  .sfw-career-inview
  .sfw-career-card[data-sfw-step="2"]{
    transition-delay:.24s;
  }

  .sfw-career-inview
  .sfw-career-card[data-sfw-step="3"]{
    transition-delay:.36s;
  }


  /* hover depth */

  .sfw-career-inview
  .sfw-career-card:hover{
    transform:
      translateY(-7px)
      scale(1.008);

    border-color:
      rgba(46,170,215,.38) !important;

    box-shadow:
      0 20px 40px rgba(14,61,84,.12),
      0 0 0 1px rgba(74,192,229,.035) inset;
  }

  .sfw-career-inview
  .sfw-career-card[data-sfw-step="3"]:hover{
    box-shadow:
      0 22px 46px rgba(4,42,65,.24),
      0 0 36px rgba(64,190,229,.08);
  }


  /* ---------------------------------------------------------
     ICONS
     --------------------------------------------------------- */

  .sfw-career-icon{
    position:absolute;

    top:18px;
    right:18px;

    width:39px;
    height:39px;

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

    border-radius:12px;

    color:#1687b5;

    background:
      rgba(34,161,208,.075);

    border:
      1px solid
      rgba(33,152,197,.14);

    box-shadow:
      inset 0 1px 0
      rgba(255,255,255,.52);

    pointer-events:none;

    transition:
      transform .32s
      cubic-bezier(.16,1,.3,1),
      background .3s ease,
      border-color .3s ease;
  }

  .sfw-career-icon svg{
    width:19px;
    height:19px;

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

  .sfw-career-card[data-sfw-step="3"]
  .sfw-career-icon{
    color:#75d9f5;

    background:
      rgba(101,211,243,.08);

    border-color:
      rgba(116,216,244,.18);

    box-shadow:none;
  }

  .sfw-career-card:hover
  .sfw-career-icon{
    transform:
      translateY(-2px)
      rotate(-3deg)
      scale(1.07);

    border-color:
      rgba(61,184,225,.28);
  }


  /* ---------------------------------------------------------
     STEP DOTS / ROUTE NODES
     --------------------------------------------------------- */

  .sfw-career-route-dot{
    position:absolute;

    left:50%;
    bottom:-6px;

    width:12px;
    height:12px;

    transform:translateX(-50%);

    border-radius:50%;

    background:#fff;

    border:
      3px solid
      #43afd8;

    box-shadow:
      0 0 0 5px
      rgba(65,179,218,.09),
      0 0 17px
      rgba(67,188,228,.20);

    opacity:0;

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

    pointer-events:none;
  }

  .sfw-career-card[data-sfw-step="3"]
  .sfw-career-route-dot{
    background:#64d1f0;
    border-color:#d6f7ff;
  }

  .sfw-career-inview
  .sfw-career-route-dot{
    opacity:1;
    transform:
      translateX(-50%)
      translateY(-4px);
  }


  /* ---------------------------------------------------------
     DARK FINAL CARD TEXT SAFETY
     --------------------------------------------------------- */

  .sfw-career-card[data-sfw-step="3"],
  .sfw-career-card[data-sfw-step="3"] h1,
  .sfw-career-card[data-sfw-step="3"] h2,
  .sfw-career-card[data-sfw-step="3"] h3,
  .sfw-career-card[data-sfw-step="3"] h4,
  .sfw-career-card[data-sfw-step="3"] strong,
  .sfw-career-card[data-sfw-step="3"] b{
    color:#fff !important;
  }

  .sfw-career-card[data-sfw-step="3"] p{
    color:rgba(255,255,255,.72) !important;
  }


  /* ---------------------------------------------------------
     ANIMATED TOP ACCENT
     --------------------------------------------------------- */

  .sfw-career-card::before{
    content:"";

    position:absolute;
    left:0;
    top:0;

    width:100%;
    height:2px;

    transform:scaleX(0);
    transform-origin:left center;

    background:
      linear-gradient(
        90deg,
        #2a9dca,
        #5ed1ef,
        transparent
      );

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

    pointer-events:none;
  }

  .sfw-career-card:hover::before{
    transform:scaleX(1);
  }

}


/* -----------------------------------------------------------
   REDUCED MOTION
   ----------------------------------------------------------- */

@media (prefers-reduced-motion:reduce){

  .sfw-career-journey-enhanced *,
  .sfw-career-journey-enhanced::before,
  .sfw-career-journey-enhanced::after{
    animation:none !important;
    transition:none !important;
  }

  .sfw-career-main-heading,
  .sfw-career-card{
    opacity:1 !important;
    transform:none !important;
  }

}