
.proc{position:relative;overflow:hidden;padding:var(--sp-sec) 24px;
   background:radial-gradient(120% 80% at 50% 0%,var(--dark-lift),var(--dark) 60%)}
.proc .borb{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none}
.proc .borb.o1{width:400px;height:400px;right:4%;top:10%;background:radial-gradient(closest-side,rgba(25,92,255,.22),transparent 70%);animation:orb1 15s ease-in-out infinite alternate}
.proc .borb.o2{width:300px;height:300px;left:8%;bottom:8%;background:radial-gradient(closest-side,rgba(252,61,67,.12),transparent 70%);animation:orb2 19s ease-in-out infinite alternate}
.proc .pgrid{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.82;
   background-image:linear-gradient(rgba(95,141,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(95,141,255,.12) 1px,transparent 1px);
   background-size:46px 46px;
   -webkit-mask-image:radial-gradient(80% 70% at 50% 42%,#000,transparent 90%);mask-image:radial-gradient(80% 70% at 50% 42%,#000,transparent 90%)}
@keyframes orb1{to{transform:translate(-30px,24px)}}
@keyframes orb2{to{transform:translate(28px,-20px)}}
.proc .head{position:relative;z-index:2;text-align:center;max-width:var(--container-content);margin:0 auto var(--sp-12)}
.proc .peyebrow{direction:ltr;margin-bottom:16px}
.proc .peyebrow i{box-shadow:var(--sh-glow-red)}
.proc .head h2{font-weight:var(--fw-bold);font-size:var(--fs-h2);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);color:#fff}
.proc .head p{margin-top:16px;font-size:var(--fs-title);font-weight:var(--fw-body);color:var(--tx-on-dark-2)}
.proc .steps{position:relative;z-index:2;max-width:980px;margin:0 auto;display:grid;gap:24px}
.proc .steps::before{content:"";position:absolute;right:12px;top:52px;bottom:56px;width:1.5px;border-radius:var(--r-xs);z-index:0;
   background:linear-gradient(180deg,rgba(95,141,255,0),rgba(95,141,255,.35) 8%,rgba(95,141,255,.22) 88%,rgba(95,141,255,0))}

.steps .step{position:relative;display:grid;grid-template-columns:26px 1fr;gap:24px;align-items:stretch;z-index:1}
.step .dot{width:26px;margin-top:40px;display:flex;justify-content:center}
.step .dot i{position:relative;display:block;width:15px;height:15px;border-radius:50%;background:var(--dark-lift);
   border:1.5px solid color-mix(in srgb,var(--blue-soft) 55%,transparent);box-shadow:0 0 0 5px var(--dark)}
.step .dot i::after{content:"";position:absolute;inset:3.5px;border-radius:50%;background:var(--red);animation:u-blink 2.6s ease-in-out infinite}
.step .dot i::before{content:"";position:absolute;top:50%;left:100%;width:20px;height:1.5px;transform:translateY(-50%);
   background:linear-gradient(90deg,transparent,rgba(95,141,255,.35))}
.step .panel{position:relative;overflow:hidden;border-radius:var(--r-card);padding:32px;
   background:linear-gradient(158deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
   backdrop-filter:blur(16px) saturate(1.15);-webkit-backdrop-filter:blur(16px) saturate(1.15);
   border:1px solid rgba(255,255,255,.12);
   box-shadow:var(--sh-deep),inset 0 1px 0 rgba(255,255,255,.12)}
.step .panel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
   background:linear-gradient(158deg,rgba(95,141,255,.06),transparent 40%)}
.step .snum{position:absolute;left:32px;top:16px;font-family:var(--font-label);font-weight:var(--fw-bold);font-size:var(--fs-display);line-height:var(--lh-tight);
   color:transparent;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.06));
   -webkit-background-clip:text;background-clip:text;direction:ltr;z-index:1}
.step .body{position:relative;z-index:1}
.step .live{color:var(--blue-soft);gap:6px;direction:ltr;margin-bottom:8px}
.step .live i{box-shadow:var(--sh-glow-red)}
.step h3{font-weight:var(--fw-bold);font-size:var(--fs-feature);color:#fff;line-height:var(--lh-card);margin-bottom:16px;max-width:26ch}

.step .stext{font-size:var(--fs-body);color:var(--tx-on-photo);line-height:var(--lh-body);margin-top:var(--sp-4);max-width:58ch}
.step ul{list-style:none;display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-4)}
.step li{position:relative;padding-right:var(--sp-8);font-size:var(--fs-body);color:var(--tx-on-photo);line-height:var(--lh-body)}
.step li b{color:var(--tx-on-dark);font-weight:var(--fw-bold)}
.step li::before{content:"";position:absolute;right:0;top:2px;width:20px;height:20px;border-radius:50%;
   background:color-mix(in srgb,var(--blue-soft) 12%,transparent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F8DFF' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
@media(max-width:700px){.steps .step{gap:20px}}

