.sysflow{--card:#0b0b0c;--line:rgba(255,255,255,.35);--txt:#f3f3f1;--muted:#8d8d8d;--phlx:#ff7a00;--amber:#ffb066;color:var(--txt);padding:var(--section-y) 0;border-top:1px solid rgba(255,255,255,.08);background-color:var(--dark-2);background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1.2px);background-size:26px 26px}.sysflow .readmore{color:#ffffff8c}.sysflow .readmore:hover{color:#fff}.sysflow .sysflow-heading{text-align:center;margin-bottom:var(--gap-head)}.sysflow .sysflow-heading .eyebrow{display:block;margin:0 auto var(--gap-eyebrow)}.sysflow .sysflow-heading .brand-logo{height:42px;width:auto;display:block;margin:0 auto}.sysflow .sf-explain{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1040px;margin:0 auto var(--gap-head)}.sysflow .sf-ex{padding-top:18px;border-top:1px solid rgba(255,255,255,.16);text-align:left}.sysflow .sf-ex h3{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--txt);margin-bottom:10px}.sysflow .sf-ex p{font-family:var(--sans);font-size:14.5px;line-height:1.6;color:var(--muted)}@media(max-width:900px){.sysflow .sf-explain{grid-template-columns:1fr;gap:22px}}.sysflow .sysflow-heading .s{font-family:var(--serif);font-weight:600;color:var(--txt);font-size:clamp(30px,3.4vw,42px);line-height:1.12;letter-spacing:-.015em;margin-top:14px;max-width:none;text-wrap:balance}.sysflow .frame{position:relative;width:min(1150px,92vw);margin-inline:auto;border:1px solid rgba(255,255,255,.14);border-radius:26px;padding:20px 22px;background:linear-gradient(180deg,#ffffff03,#fff0);box-shadow:0 0 0 1px #ffffff05}.sysflow .stage{position:relative;width:100%;aspect-ratio:3.2/1;min-height:264px;display:grid;grid-template-columns:1fr 1.55fr 1fr;align-items:stretch}.sysflow svg.wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;opacity:0;animation:sfFadeIn 1s ease .55s forwards}@keyframes sfFadeIn{to{opacity:1}}.sysflow .col{position:relative;display:flex;flex-direction:column;z-index:2}.sysflow .col.left,.sysflow .col.right{padding:0;justify-content:center}.sysflow .col.right{align-items:flex-end}.sysflow .col-cards{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;gap:18px;width:100%}.sysflow .col.right .col-cards{align-items:flex-end}.sysflow .col.mid{justify-content:center;align-items:center;padding-top:31px}.sysflow .col-label{font-family:var(--sans);font-size:13px;font-weight:600;height:19px;line-height:19px;margin-bottom:12px;letter-spacing:-.01em;white-space:nowrap;color:#ffffff9e}.sysflow .col.right .col-label{text-align:right}.sysflow .card{width:min(304px,94%);background:linear-gradient(180deg,#ffffff09,#ffffff03),var(--card);border:1px solid var(--line);border-radius:16px;padding:15px 16px;display:flex;align-items:center;gap:12px;box-shadow:0 0 0 1px #ffffff05;opacity:0;animation:sfRise .7s cubic-bezier(.2,.7,.2,1) forwards}@keyframes sfRise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.sysflow .col.left .card:nth-child(2){animation-delay:.05s}.sysflow .col.left .card:nth-child(3){animation-delay:.15s}.sysflow .col.left .card:nth-child(4){animation-delay:.25s}.sysflow .col.right .card:nth-child(2){animation-delay:.5s}.sysflow .col.right .card:nth-child(3){animation-delay:.6s}.sysflow .col.right .card:nth-child(4){animation-delay:.7s}.sysflow .icon{flex:0 0 40px;height:40px;border-radius:11px;background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff0d;display:flex;align-items:center;justify-content:center}.sysflow .icon svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sysflow .card .t{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--txt)}.sysflow .card .s{font-family:var(--sans);font-size:13px;color:var(--muted);margin-top:3px;letter-spacing:.01em}.sysflow .core{position:relative;width:min(300px,100%);flex-direction:column;justify-content:center;gap:0;padding:17px 16px;border:1px solid rgba(255,255,255,.18);border-radius:18px;box-shadow:0 0 0 1px #ffffff05;animation-delay:.35s;text-align:center}.sysflow .core:before{content:"";display:none;position:absolute;inset:-1px;border-radius:19px;padding:1.6px;pointer-events:none;background:conic-gradient(from var(--a),transparent 0deg,transparent 248deg,rgba(255,138,31,.18) 286deg,rgba(255,176,102,.85) 322deg,#ff7a00 348deg,rgba(255,210,160,1) 357deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:sfOrbit 4.6s linear infinite}@keyframes sfOrbit{to{--a:360deg}}.sysflow .wm-title{font-family:var(--sans);font-size:17px;font-weight:700;letter-spacing:-.01em;margin:0 auto 12px;width:fit-content;max-width:100%;text-align:center;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}.sysflow .chips{display:grid;grid-template-columns:1fr;gap:9px;width:100%}.sysflow .chip{font-family:var(--sans);font-size:13.5px;font-weight:600;letter-spacing:-.01em;color:var(--txt);line-height:1.4;border:1px solid rgba(255,255,255,.13);border-radius:10px;background:#ffffff05;padding:7px 8px;min-height:40px;display:flex;align-items:center;justify-content:center;text-align:center}.sysflow .sf-flow{position:relative;z-index:2;margin:0 0 18px}.sysflow .sf-flow-label{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:-.01em;color:#ffffff9e;margin-bottom:12px}.sysflow .sf-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:0;padding:0}.sysflow .sf-step+.sf-step:before{content:"";position:absolute;left:-22px;top:50%;width:14px;height:1px;background:#ffffff59}.sysflow .sf-step+.sf-step:after{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:1px solid rgba(255,255,255,.55);border-right:1px solid rgba(255,255,255,.55)}.sysflow .sf-step-n{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:-.01em;display:inline;margin-right:9px;color:#fff}.sysflow .sf-step{position:relative;background:linear-gradient(180deg,#ffffff09,#ffffff03),var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 14px}.sysflow .sf-step-t{display:inline;font-family:var(--sans);font-size:15px;font-weight:600;color:var(--txt);letter-spacing:-.01em}.sysflow .sf-step-m{display:block;font-family:var(--sans);font-size:12px;margin-top:5px;line-height:1.45;color:var(--muted)}@media(max-width:820px){.sysflow .sf-explain{margin-bottom:36px}.sysflow .sf-flow{display:none}}.sysflow .port{position:absolute;top:50%;transform:translateY(-50%);width:5px;height:18px;border-radius:3px;background:#fff;z-index:3;box-shadow:0 0 12px #ffffffe6;animation:sfPortPulse 2.6s ease-in-out infinite}.sysflow .port-l{left:-3px}.sysflow .port-r{right:-3px;animation-delay:1.3s}@keyframes sfPortPulse{0%,to{box-shadow:0 0 8px #fff9}50%{box-shadow:0 0 18px #fff}}.sysflow .more{text-align:center;margin-top:22px}@media(prefers-reduced-motion:reduce){.sysflow *,.sysflow *:before,.sysflow *:after{animation-duration:.01ms!important;animation-iteration-count:1!important}.sysflow svg.wires{opacity:1}.sysflow .card{opacity:1}}@media(max-width:980px){.sysflow .card{padding:14px;gap:11px}.sysflow .icon{flex-basis:38px;height:38px}.sysflow .card .t{font-size:14px}.sysflow .card .s{font-size:12px}.sysflow .core .t{font-size:24px}.sysflow .chip{font-size:12.5px;padding:9px 10px;min-height:0}}@media(max-width:820px){.sysflow{padding:64px 0}.sysflow .frame{padding:22px 18px;border-radius:20px}.sysflow .sysflow-heading{margin-bottom:36px}.sysflow .sysflow-heading .brand-logo{height:36px}.sysflow .sysflow-heading .s{margin-top:12px}.sysflow .stage{display:flex;flex-direction:column;aspect-ratio:auto;min-height:0}.sysflow svg.wires{display:none}.sysflow .col{padding:0;gap:12px}.sysflow .col.left,.sysflow .col.right{padding:0;align-items:stretch}.sysflow .col-cards{display:contents}.sysflow .col.mid{padding-top:0}.sysflow .col-label{height:auto;line-height:1.4}.sysflow .col-label{position:static;text-align:center;margin-bottom:4px;white-space:normal}.sysflow .col.right .col-label{right:auto}.sysflow .card{width:100%}.sysflow .col.mid:before,.sysflow .col.mid:after{content:"";width:1.5px;height:28px;margin:10px auto;background:linear-gradient(180deg,transparent,rgba(255,255,255,.45));display:block}.sysflow .col.mid:after{background:linear-gradient(180deg,rgba(255,255,255,.45),transparent)}.sysflow .core{width:100%;padding:20px 18px}.sysflow .port{width:18px;height:5px}.sysflow .port-l{top:-3px;left:50%;transform:translate(-50%)}.sysflow .port-r{inset:auto auto -3px 50%;transform:translate(-50%)}.sysflow .more{margin-top:28px}}