.jumpstart-hero {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  color: #2e2e2e;
  background: #fff;
  overflow-x: hidden;
}
.hero-bg-img{
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1; 
}
.hero-bg-img img{
  max-width: 100%;
  height: auto;
}
.hero-body.max-570{
  max-width: 570px;
}

@media (min-width: 992px) {
  .hero-bg-img{
    top: -70px;
    right: -120px;
    width: 885px;
    height: 100%;
  }

}
@media (max-width: 991px) {
  .right-hero-col{
    margin-top: 40px;
  }

}
@media (max-width: 575px) {
  .hero-bg-img img{
    max-width: 120%;
  }
}
.hero-section .max-600{
  max-width: 630px;
}

.display-heading {
      font-family: 'Roboto Flex', sans-serif;
      font-weight: 700;
      font-variation-settings: "GRAD" 0, "XOPQ" 96, "XTRA" 468, "YOPQ" 79,
        "YTAS" 750, "YTDE" -203, "YTFI" 738, "YTLC" 514, "YTUC" 712, "wdth" 112;
      line-height: 1.2;
    }

.hero-section {
      padding: 80px 0 88px;
      overflow: hidden;
    }
@media (max-width: 1200px) and (min-width: 1400px) {
  .hero-bg-img{
    right: -240px;
  }
}
@media (max-width: 992px) and (min-width: 1200px) {
  .hero-bg-img{
    right: -290px;
  }
}
@media (max-width: 991px) {
      .hero-section { padding: 60px 0; }
    }

@media (max-width: 575px) {
      .hero-section { padding: 48px 0; }
    }

.hero-title {
      font-family: 'Roboto Flex', sans-serif;
      font-weight: 700;
      font-size: 64px;
      line-height: 1.2;
      font-variation-settings: "GRAD" 0, "XOPQ" 96, "XTRA" 468, "YOPQ" 79,
        "YTAS" 750, "YTDE" -203, "YTFI" 738, "YTLC" 514, "YTUC" 712, "wdth" 112;
      color: #000;
    }

@media (max-width: 991px) { .hero-title { font-size: 48px; } }

@media (max-width: 575px) { .hero-title { font-size: 36px; } }

.hero-title .accent { color: #1eb7fb; }

.hero-title .dot-accent {
      position: relative;
      display: inline-block;
    }

.hero-title .dot-accent::after {
      content: '';
      position: absolute;
      bottom: -4px;
      right: -8px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: #1eb7fb;
    }

.hero-body {
      font-size: 18px;
      line-height: 24px;
      color: #1e1e1e;
      max-width: 640px;
    }

.btn-cta-dark {
      background: #020b0f;
      color: #fff;
      border-radius: 50px;
      padding: 12px 16px 12px 24px;
      font-size: 18px;
      font-weight: 600;
      display: inline-flex;
      align-items: center;
      gap: 24px;
      white-space: nowrap;
      text-decoration: none;
      border: none;
    }

.btn-cta-dark:hover { background: #1a2630; color: #fff; }

.link-underline-cta {
    gap: 54px;
    min-width: 290px;
}
.link-underline-cta:hover p{
  color: #1eb7fb;
}
.link-underline-cta::after{
  transform: rotate(90deg);
  width: 16px;
  height: 16px;
  padding: 0.8rem;
}
@media only screen and (max-width: 767px) {
  .link-underline-cta {
    margin: 20px 0 0 0;
  }
}

/* Hero animated visual card (chip conveyor) */
.visual-card {
  --b-bg: #020b0f;
  --b-raised: #1a2630;
  --b-text: #f4f1e9;
  --b-muted: #a4a8b0;
  --b-soft: #82878f;
  --b-border: #2b303c;
  --a-text: #1a1d22;
  --a-muted: #5b5f66;
  --a-soft: #6a6e74;
  --a-border: #dcd5c4;
  --accent: #1eb7fb;
  --accent-strong: #1eb7fb;
  --shadow: 0 12px 32px -16px rgba(0,0,0,0.5);
  position: relative; overflow: hidden; 
  min-height: 560px;
  /* border-radius: 20px; */
  /*  box-shadow: var(--shadow);
  background: var(--b-bg) linear-gradient(150deg,#1b2030 0%,#12151c 55%,#191e28 100%); */
  --chip-w: 236px; --chip-h: 60px; --pitch: 80px;
}
@media (min-width: 992px){ .visual-card{ margin-right: -40px; } }
@media (max-width: 840px){ .visual-card{ min-height:460px; --chip-w:210px; --chip-h:58px; --pitch:70px; } }
@media (max-width: 640px){ .visual-card{ min-height:420px; --chip-w:200px; --chip-h:56px; --pitch:66px; } }

.visual-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:35% 50%; }
.visual-scrim{
  position:absolute; inset:0;
  /* background:linear-gradient(100deg, rgba(18,21,28,.10) 0%, rgba(18,21,28,.34) 62%, rgba(18,21,28,.46) 100%); */
}

.visual-pause{
  position:absolute; top:16px; right:16px; z-index:6;
  width:26px; height:26px; border-radius:50%; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(18,21,28,.46); border:1px solid rgba(244,241,233,.34);
  color:rgba(244,241,233,.85); backdrop-filter:blur(6px); cursor:pointer;
}
.visual-pause:hover{ color:#fff; border-color:rgba(244,241,233,.6); }
.visual-pause svg{ width:10px; height:10px; }

.visual-caption{
  position:absolute; left:0; right:0; bottom:0; z-index:5;
  padding:22px 26px; font-size:13.5px; color:rgba(244,241,233,.84);
  /* background:linear-gradient(to top, rgba(18,21,28,.82) 55%, rgba(18,21,28,0)); */
}
.visual-caption strong{ color:#fff; font-weight:600; }
@media (max-width: 640px){ .visual-caption{ padding:18px 20px; font-size:12.5px; } }

.chip-stage{ position:absolute; right:24px; top:8%; bottom:28%; width:var(--chip-w); z-index:3; }
@media (max-width: 640px){ .chip-stage{ right:16px; } }

.chip-anchor{
  position:absolute; right:0; bottom:0; width:100%;
  transform:translate3d(var(--x,0px), calc(var(--slot) * (0px - var(--pitch))), 0);
  opacity:var(--op,1);
  transition:transform var(--dur,.9s) cubic-bezier(.16,.84,.24,1) var(--delay,0s),
             opacity .75s ease var(--delay,0s);
  will-change:transform;
}
.chip-float{ display:block; animation:chip-drift var(--fdur,7s) ease-in-out var(--fdel,0s) infinite alternate; }
@keyframes chip-drift{ from{ transform:translate3d(0,-3px,0); } to{ transform:translate3d(0,3px,0); } }

.chip{
  display:flex; align-items:center; gap:11px;
  height:var(--chip-h); border-radius:16px; padding:0 13px;
  background:rgba(253,252,250,.93); border:1px solid rgba(255,255,255,.85); color:var(--a-text);
  backdrop-filter:blur(14px) saturate(1.1);
  transform:scale(var(--sc,1));
  transition:transform .7s cubic-bezier(.16,.84,.24,1), box-shadow .6s ease, border-color .6s ease;
  box-shadow:0 14px 34px -16px rgba(12,14,20,.55);
}
.chip.at-work{
  --sc:1.04;
  border-color:rgba(30,183,251,.55);
  box-shadow:0 16px 38px -14px rgba(12,14,20,.6), 0 0 0 3px rgba(30,183,251,.15);
}

.chip-tile{
  flex:none; width:36px; height:36px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(30,183,251,.13); color:var(--accent-strong);
}
.chip-tile svg{ width:18px; height:18px; }

.chip-body{ flex:1 1 auto; min-width:0; }
.chip-titles{ position:relative; display:block; height:19px; overflow:hidden; }
.chip-titles .t{
  position:absolute; left:0; top:0; white-space:nowrap;
  font-size:14px; font-weight:600; line-height:19px;
  transition:transform .6s cubic-bezier(.16,.84,.24,1), opacity .5s ease;
}
.chip-titles .t-b{ transform:translateY(105%); opacity:0; }
.chip.done .chip-titles .t-a{ transform:translateY(-105%); opacity:0; }
.chip.done .chip-titles .t-b{ transform:translateY(0); opacity:1; }

.chip-sub{
  display:block; height:16px; font-size:12px; line-height:16px; color:var(--a-muted);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  opacity:0; transform:translateY(4px);
  transition:opacity .5s ease .18s, transform .5s cubic-bezier(.16,.84,.24,1) .18s;
}
.chip.done .chip-sub{ opacity:1; transform:translateY(0); }

.chip-marker{ position:relative; flex:none; width:24px; height:24px; }
.chip-marker > *{ position:absolute; inset:0; width:24px; height:24px; }
.chip-marker .dot{ display:flex; align-items:center; justify-content:center; opacity:1; transition:opacity .5s ease; }
.chip-marker .dot::after{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; opacity:.35; }
.chip-marker .spin{ opacity:0; color:var(--accent-strong); transition:opacity .45s ease .08s; }
.chip.at-work .dot{ opacity:0; }
.chip.at-work .spin{ opacity:1; animation:chip-spin 1.15s linear infinite; }
.chip-marker .check{
  opacity:0; transform:scale(.55); border-radius:50%; background:var(--accent);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .45s ease .1s, transform .55s cubic-bezier(.16,.84,.24,1) .1s;
}
.chip-marker .check svg{ width:12px; height:12px; color:#fff; }
.chip.done .dot{ opacity:0; }
.chip.done .spin{ opacity:0; animation:none; }
.chip.done .check{ opacity:1; transform:scale(1); }
@keyframes chip-spin{ to{ transform:rotate(360deg); } }
.chip-stage.paused .spin, .chip-stage.paused .chip-float{ animation-play-state:paused; }

@media (prefers-reduced-motion: reduce){
  .chip-anchor, .chip, .chip-titles .t, .chip-sub, .chip-marker > *{ transition:none !important; }
  .chip-float{ animation:none; }
  .chip .spin{ animation:none; }
}