/* Section four: one project, three moments. All styles are section-scoped. */
#how-it-works .brain-dark-shell{gap:0;padding-top:112px}
#how-it-works .brain-dark-panel{width:100%}
#how-it-works .brain-hero{width:100%;max-width:860px}
#how-it-works .brain-hero>p{max-width:650px}
#how-it-works .kc-grid{--kc-line:rgba(255,255,255,.13);--kc-muted:#9d9fa5;--kc-green:#91dbb2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px;border:1px solid var(--kc-line);border-radius:18px;overflow:hidden;background:#090a0c}
#how-it-works .kc-card{min-width:0;padding:30px 26px 20px;color:#eee;position:relative;overflow:hidden}
#how-it-works .kc-card+.kc-card{border-left:1px solid var(--kc-line)}
#how-it-works .kc-copy h3{font-size:20px;font-weight:500;line-height:1.5;margin:0 0 12px;letter-spacing:0}
#how-it-works .kc-copy p{font-size:15px;line-height:1.75;margin:0;color:#a5a6ac;min-height:53px;text-wrap:pretty}
#how-it-works .kc-stage{position:relative;height:290px;margin-top:28px;isolation:isolate;user-select:none;pointer-events:none}
#how-it-works .kc-stage *{box-sizing:border-box}
#how-it-works .kc-stage:before{content:"";position:absolute;inset:22% 0 0;background:radial-gradient(ellipse at center,rgba(110,169,143,.08),transparent 70%);z-index:-1}
#how-it-works .kc-stage svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#how-it-works .kc-label{font-size:11px;letter-spacing:.04em;color:#96999f}
#how-it-works .kc-panel{background:linear-gradient(155deg,#1c1e22,#111215 75%);border:1px solid #ffffff17;box-shadow:0 18px 40px #0005;border-radius:15px}
#how-it-works .kc-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:middle}
#how-it-works .kc-text-swap{position:relative;display:inline-grid}
#how-it-works .kc-text-swap>span{grid-area:1/1;transition:opacity .35s}
#how-it-works .kc-text-swap .kc-before{opacity:0}
#how-it-works [data-stage="0"] .kc-text-swap .kc-before{opacity:1}
#how-it-works [data-stage="0"] .kc-text-swap .kc-after{opacity:0}
#how-it-works .kc-laptop{width:106px;position:absolute;top:4px;left:50%;transform:translateX(-50%);text-align:center;color:#777b82}
#how-it-works .kc-laptop-screen{height:58px;border:1.5px solid #62676e;border-radius:7px;background:#0d0e10;display:grid;place-items:center;transition:background .65s,border-color .65s}
#how-it-works .kc-laptop-screen svg{opacity:.15;transition:opacity .65s;color:var(--kc-green)}
#how-it-works [data-stage="0"] .kc-laptop-screen{background:#22322c;border-color:#92b8a3}
#how-it-works [data-stage="0"] .kc-laptop-screen svg{opacity:1}
#how-it-works .kc-laptop-base{height:4px;background:#5b6067;border-radius:1px 1px 6px 6px;margin:3px -10px 8px}
#how-it-works .kc-route{position:absolute;left:50%;top:100px;height:29px;border-left:1px dashed #ffffff23}
#how-it-works .kc-cloud-job{position:absolute;left:0;right:0;top:144px;padding:18px}
#how-it-works .kc-job-head{display:flex;align-items:center;gap:8px;color:var(--kc-green);font-size:12px}
#how-it-works .kc-job-name{font-size:17px;font-weight:500;margin:13px 0 16px;color:#efeff1}
#how-it-works .kc-progress{height:4px;border-radius:4px;background:#ffffff13;overflow:hidden}
#how-it-works .kc-progress i{display:block;width:100%;height:100%;background:var(--kc-green);transform-origin:left;transition:transform 1.5s ease;transform:scaleX(1)}
#how-it-works [data-stage="0"] .kc-progress i{transform:scaleX(.28);transition:none}
#how-it-works [data-stage="1"] .kc-progress i{transform:scaleX(.78)}
#how-it-works .kc-job-foot{display:flex;justify-content:space-between;margin-top:11px;font-size:11px;color:#96999f}
#how-it-works .kc-job-foot .kc-after{color:var(--kc-green)}
#how-it-works [data-stage="1"] .kc-job-foot .kc-before{opacity:1}
#how-it-works [data-stage="1"] .kc-job-foot .kc-after{opacity:0}
#how-it-works .kc-phone{position:absolute;left:50%;top:0;transform:translateX(-50%);width:172px;height:284px;background:linear-gradient(145deg,#22242a,#111215);border:1px solid #ffffff2b;border-radius:27px;padding:34px 12px 12px;box-shadow:0 22px 42px #0006}
#how-it-works .kc-phone:before{content:"";position:absolute;width:46px;height:5px;border-radius:5px;background:#050607;left:50%;top:13px;transform:translateX(-50%)}
#how-it-works .kc-phone:after{content:"";position:absolute;width:52px;height:3px;border-radius:3px;background:#ffffff4d;left:50%;bottom:8px;transform:translateX(-50%)}
#how-it-works .kc-phone-project{font-size:15px;font-weight:500;margin:9px 0 18px;display:flex;align-items:center;gap:7px}
#how-it-works .kc-phone-project svg{width:17px;height:17px;color:#a6b6c9}
#how-it-works .kc-phone-task{padding:13px 10px;background:#ffffff06;border:1px solid #ffffff12;border-radius:11px;font-size:12px}
#how-it-works .kc-phone-task strong{display:block;font-size:13px;font-weight:500;margin:8px 0 12px}
#how-it-works .kc-phone-status{color:var(--kc-green);font-size:10px;white-space:nowrap}
#how-it-works .kc-phone-note{font-size:10px;color:#a8adb3;line-height:1.65;margin:13px 2px 0;transition:opacity .5s,transform .5s}
#how-it-works [data-stage="0"] .kc-phone-note{opacity:0;transform:translateY(7px)}
#how-it-works .kc-sync-pill{position:absolute;right:-4px;bottom:40px;border:1px solid #8ab9a83d;background:#17241e;border-radius:20px;padding:9px 13px;color:var(--kc-green);font-size:11px;box-shadow:0 8px 24px #0006;transition:opacity .5s,transform .5s}
#how-it-works [data-stage="0"] .kc-sync-pill{opacity:0;transform:translateY(10px)}
#how-it-works .kc-project{position:absolute;top:21px;left:0;right:0;padding:17px}
#how-it-works .kc-project-heading{font-size:16px;font-weight:500;margin:0 0 19px;display:flex;align-items:center;gap:8px}
#how-it-works .kc-project-heading svg{color:#a6b6c9;width:19px;height:19px}
#how-it-works .kc-history{position:relative;padding-left:13px;margin-bottom:20px;border-left:1px solid #ffffff20}
#how-it-works .kc-history p{font-size:11px;color:#92979e;margin:0 0 11px;line-height:1.5}
#how-it-works .kc-history p:last-child{color:#c9cdcf;margin:0}
#how-it-works .kc-file{display:flex;gap:10px;align-items:center;padding:12px 10px;border:1px solid #91dbb229;background:#91dbb208;border-radius:9px;transition:transform .6s,border-color .6s}
#how-it-works .kc-file-icon{display:grid;place-items:center;width:29px;height:35px;background:#778faa24;color:#b7cce5;border-radius:5px;font-size:9px;letter-spacing:.03em}
#how-it-works .kc-file strong{display:block;font-size:13px;font-weight:500}
#how-it-works .kc-file small{display:block;font-size:10px;color:#9faaa5;margin-top:5px}
#how-it-works .kc-continue{margin-top:14px;font-size:11px;display:flex;align-items:center;gap:7px;color:var(--kc-green);opacity:1;transform:translateY(0);transition:opacity .5s,transform .5s}
#how-it-works .kc-continue svg{width:14px;height:14px}
#how-it-works [data-stage="0"] .kc-continue,#how-it-works [data-stage="1"] .kc-continue{opacity:0;transform:translateY(7px)}
#how-it-works [data-stage="2"] .kc-file{transform:translateY(-2px);border-color:#91dbb24d}
#how-it-works .kc-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;min-height:28px;color:#81858c;font-size:11px}
@media(max-width:1000px) and (min-width:741px){
  #how-it-works .kc-card{padding:24px 18px 18px}
  #how-it-works .kc-copy h3{font-size:18px}
  #how-it-works .kc-copy p{font-size:14px;min-height:74px}
  #how-it-works .kc-cloud-job,#how-it-works .kc-project{padding:13px}
  #how-it-works .kc-job-name{font-size:15px}
}
@media(max-width:740px){
  #how-it-works .brain-dark-shell{padding-top:72px;padding-bottom:0}
  #how-it-works .brain-dark-shell{width:calc(100% - 28px);margin-inline:auto}
  #how-it-works .kc-grid{grid-template-columns:1fr;margin-top:36px}
  #how-it-works .kc-card{padding:26px 24px 18px}
  #how-it-works .kc-card+.kc-card{border-left:0;border-top:1px solid var(--kc-line)}
  #how-it-works .kc-copy p{min-height:0}
  #how-it-works .kc-stage{max-width:310px;margin:26px auto 0;width:100%}
  #how-it-works .kc-foot{max-width:310px;margin:14px auto 0}
}
@media(prefers-reduced-motion:reduce){#how-it-works .kc-stage *{transition:none!important}}
