/* Prospects Hive process styles. Selectors and declarations copied from the design export. */
.tl-line{position:absolute;left:50%;top:0;bottom:0;width:3px;margin-left:-1.5px;border-radius:3px;background-size:100% 200%;animation:flowv 5s linear infinite}
.step-img{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px -30px color-mix(in srgb, var(--ph-ink, #0B1620) 60%, transparent);background:var(--ph-ink, #0B1620);transition:transform .4s}
.step-img:hover{transform:scale(1.03)}
.step-img img{display:block;width:100%;height:auto}
.tl-line{background:linear-gradient(var(--ph-process-track-angle,180deg),var(--ph-process-track,rgba(11,22,32,.08)) var(--ph-process-track-start-stop,0%),var(--ph-process-track-end,rgba(11,22,32,.08)) var(--ph-process-track-end-stop,100%)) !important;animation:none !important}
.tl-fill{position:absolute;left:50%;top:0;bottom:0;width:3px;margin-left:-1.5px;border-radius:3px;transform-origin:top;box-shadow:0 0 14px color-mix(in srgb, var(--ph-accent, #F15E22) 45%, transparent)}
.tl-spark{position:absolute;left:50%;bottom:-7px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--ph-surface, #FFFFFF);box-shadow:0 0 0 4px color-mix(in srgb, var(--ph-accent, #F15E22) 35%, transparent),0 0 22px 6px color-mix(in srgb, var(--ph-accent, #F15E22) 55%, transparent)}
.tl-card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,border-color .45s ease}
.tl-card:hover{transform:translateY(-6px);border-color:var(--ph-process-step-hover-border, #F7B596);box-shadow:inset 0 1px 0 var(--ph-surface, #FFFFFF),0 0 0 4px color-mix(in srgb, var(--ph-accent, #F15E22) 7%, transparent),0 34px 60px -30px color-mix(in srgb, var(--ph-accent, #F15E22) 50%, transparent)}
.tl-row .step-img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tl-row .step-img img{transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.tl-row:hover .step-img img{transform:scale(1.05)}
.tl-row:hover .tl-dot{box-shadow:0 0 0 10px color-mix(in srgb, var(--ph-accent, #F15E22) 14%, transparent),0 14px 28px -8px color-mix(in srgb, var(--ph-accent, #F15E22) 80%, transparent) !important}
.tl-dot{transition:box-shadow .4s ease}
.tl-fill{transform:scaleY(var(--tlp,0));transition:transform .25s linear}
.tl-row>:first-child,.tl-row>:last-child{opacity:0;transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.tl-row>:first-child{transform:translateX(-80px) scale(.97)}
.tl-row>:last-child{transform:translateX(80px) scale(.97)}
.tl-row>:last-child{transition-delay:.12s}
.tl-row .tl-pop{opacity:0;transform:scale(.3);transition:opacity .5s ease .05s,transform .6s cubic-bezier(.34,1.56,.64,1) .05s,box-shadow .4s ease}
.tl-row.tl-in>:first-child,.tl-row.tl-in>:last-child{opacity:1;transform:none}
.tl-row.tl-in .tl-pop{opacity:1;transform:scale(1)}
.tl-row.tl-in .tl-pop{animation:tlRing 1.2s ease-out .35s 1}
.tl-fill{transform:none !important;bottom:auto !important;height:calc(var(--tlp,0) * 100%);transition:height .25s linear}
.tl-spark{bottom:-7px}
.tl-fill{background:linear-gradient(var(--ph-process-progress-angle,180deg),var(--ph-process-progress,#F15E22) var(--ph-process-progress-start-stop,0%),var(--ph-process-progress-mid,#FF9D72) 55%,var(--ph-process-progress-end,#F15E22) var(--ph-process-progress-end-stop,100%)) !important}
@media (max-width:1024px){.tl-line{left:24px}
.tl-row{grid-template-columns:1fr !important;padding-left:56px}
.tl-row>.tl-gap{display:none}
.tl-row>*{grid-column:auto !important}
.tl-fill{left:24px}
.tl-row>:first-child,.tl-row>:last-child{transform:translateY(46px)}}
@media (max-width:760px){.tl-row{padding-left:50px !important}
.tl-dot{left:22px !important;top:20px;width:34px !important;height:34px !important;margin-left:-17px !important;font-size:14px;box-shadow:0 0 0 5px var(--ph-process-dot-ring, #E9EDF1) !important;z-index:2}
.tl-fill{left:22px}}
@media (prefers-reduced-motion:reduce){.tl-fill{transform:none}
.tl-row>*,.tl-row .tl-pop{opacity:1 !important;transform:none !important}
.tl-fill{transform:none}}
@keyframes flowv{to{background-position:0 200%}}
@keyframes tlRing{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--ph-accent, #F15E22) 55%, transparent)}100%{box-shadow:0 0 0 22px color-mix(in srgb, var(--ph-accent, #F15E22) 0%, transparent)}}
