/* PREDITE / PREMIUM V3 POLISH
   Dense editorial layouts, real visual anchors and intentional stage rhythm.
*/

/* Inner-page scrollytelling: replace the large empty viewport with a composed two-column scene. */
.scrollWorld{
  background:
    radial-gradient(circle at 78% 22%, rgba(47,159,244,.07), transparent 28%),
    linear-gradient(180deg,#f7fafc 0%,#edf3f7 52%,#f7fafc 100%);
}
.scrollStage{
  min-height:70svh;
  padding:7vh var(--gutter);
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.72fr);
  align-items:center;
  gap:clamp(38px,7vw,120px);
  isolation:isolate;
}
.scrollStage + .scrollStage{border-top:1px solid rgba(16,25,35,.055)}
.scrollStage:before{
  right:var(--gutter);
  top:30px;
  transform:none;
  padding:7px 9px;
  border:1px solid rgba(47,159,244,.2);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#168fe0;
  letter-spacing:.16em;
}
.scrollStage:after{
  right:var(--gutter);
  top:47px;
  width:clamp(110px,16vw,250px);
  opacity:.45;
}
.scrollStage .copy{
  z-index:2;
  width:min(700px,100%);
  padding:clamp(30px,3vw,46px);
  border:1px solid rgba(16,25,35,.105);
  border-radius:14px;
  background:rgba(255,255,255,.94);
  box-shadow:0 28px 80px rgba(16,25,35,.085),0 1px 0 rgba(255,255,255,.9) inset;
}
.scrollStage .copy:before{left:-6px;top:42px;width:11px;height:11px;box-shadow:0 0 0 7px rgba(47,159,244,.10),0 0 22px rgba(47,159,244,.2)}
.copyIndex{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;background:#eef8ff;border:1px solid rgba(47,159,244,.18);font-size:9px}
.copyTitle{max-width:12ch;margin:18px 0 17px;font-size:clamp(40px,4.5vw,68px);letter-spacing:-.065em}
.copyText{max-width:54ch;font-size:15px;line-height:1.75}
.copyMeta{margin-top:23px}
.scrollStage .tag{padding:8px 10px;background:#f1f8fd}

/* Right-hand system visual gives each stage a clear purpose instead of dead space. */
.stageVisual{
  position:relative;
  width:min(100%,520px);
  min-height:310px;
  justify-self:end;
  border:1px solid rgba(16,25,35,.11);
  border-radius:18px;
  background:rgba(255,255,255,.68);
  box-shadow:0 30px 90px rgba(16,25,35,.07);
  overflow:hidden;
  transform:translateY(calc((1 - var(--stage-focus,0)) * 18px));
  opacity:clamp(.45,var(--stage-focus,0),1);
  transition:opacity .45s ease,transform .55s var(--ease),border-color .35s ease;
}
.stageVisual:before{
  content:"";
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(16,25,35,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(16,25,35,.035) 1px,transparent 1px);
  background-size:28px 28px;
}
.stageVisual:after{
  content:"";
  position:absolute;
  left:0;right:0;top:48px;height:1px;
  background:rgba(16,25,35,.08);
}
.stageVisualTop{position:absolute;top:0;left:0;right:0;height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;z-index:2;font:8px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#71818e}
.stageVisualTop b{color:#168fe0;font-weight:500}
.stageVisualCanvas{position:absolute;inset:48px 0 0;z-index:1}
.stageNode{position:absolute;width:126px;min-height:62px;padding:12px;border:1px solid rgba(16,25,35,.13);border-radius:9px;background:rgba(255,255,255,.94);box-shadow:0 12px 28px rgba(16,25,35,.07);font:8px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:#60717f}
.stageNode strong{display:block;margin-top:5px;color:#101923;font:600 13px var(--display);letter-spacing:-.03em;text-transform:none}
.stageNode i{display:block;width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(47,159,244,.1);margin-bottom:7px}
.stageNode.n1{left:9%;top:20%}.stageNode.n2{right:9%;top:20%}.stageNode.n3{left:50%;bottom:15%;transform:translateX(-50%)}
.stageWire{position:absolute;height:1px;background:linear-gradient(90deg,rgba(47,159,244,.15),rgba(47,159,244,.8),rgba(47,159,244,.15));transform-origin:left center}
.stageWire.w1{left:34%;top:36%;width:32%;transform:rotate(0deg)}
.stageWire.w2{left:24%;top:39%;width:54%;transform:rotate(31deg)}
.stagePulse{position:absolute;left:50%;top:50%;width:54px;height:54px;border:1px solid rgba(47,159,244,.35);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 10px rgba(47,159,244,.035)}
.stagePulse:before{content:"";position:absolute;inset:13px;border-radius:50%;background:var(--blue);box-shadow:0 0 28px rgba(47,159,244,.35)}
.stageFoot{position:absolute;left:18px;right:18px;bottom:14px;display:flex;justify-content:space-between;color:#7a8994;font:8px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.stageFoot b{color:#168fe0;font-weight:500}

/* Work: the visual panels are products, not empty placeholders. */
.workGrid{gap:24px;margin-top:42px}
.workCard{border-radius:14px;box-shadow:0 18px 50px rgba(16,25,35,.07)}
.workVisual{height:330px;min-height:330px;background:#edf4f8;border-bottom:1px solid var(--dark-line)}
.workVisual:after{background:linear-gradient(100deg,transparent,rgba(47,159,244,.13),transparent)}
.workMock{position:absolute;inset:24px;border:1px solid rgba(16,25,35,.12);border-radius:11px;background:#fff;box-shadow:0 18px 45px rgba(16,25,35,.10);overflow:hidden;z-index:1}
.workMockBar{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid rgba(16,25,35,.08);font:7px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:#788793}
.workDots{display:flex;gap:4px}.workDots i{width:5px;height:5px;border-radius:50%;background:#c8d3db}
.leadLayout{display:grid;grid-template-columns:1.15fr .85fr;height:calc(100% - 34px)}
.leadChat{padding:18px;background:linear-gradient(180deg,#f8fbfd,#eef6fa);border-right:1px solid rgba(16,25,35,.08)}
.chatBubble{width:78%;padding:10px 11px;border-radius:9px;background:#fff;border:1px solid rgba(16,25,35,.08);font-size:10px;line-height:1.45;color:#3f505d;box-shadow:0 7px 16px rgba(16,25,35,.05)}
.chatBubble + .chatBubble{margin-top:9px}.chatBubble.ai{margin-left:auto;background:#e9f6ff;border-color:rgba(47,159,244,.18)}
.leadSide{padding:16px}.leadSide small,.systemNode small{font:7px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#168fe0}.leadSide strong{display:block;margin:7px 0 15px;font-size:18px;letter-spacing:-.04em}.miniRow{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(16,25,35,.07);font-size:9px;color:#61717d}.miniRow b{color:#101923}
.systemCanvas{height:calc(100% - 34px);position:relative;background:radial-gradient(circle at 50% 48%,rgba(47,159,244,.10),transparent 30%)}
.systemCard{position:absolute;padding:10px 12px;border:1px solid rgba(16,25,35,.11);border-radius:8px;background:#fff;box-shadow:0 10px 24px rgba(16,25,35,.07);font:7px var(--mono);text-transform:uppercase;color:#73828d}
.systemCard strong{display:block;margin-top:5px;font:600 12px var(--display);text-transform:none;color:#101923}
.systemCard.s1{left:7%;top:20%}.systemCard.s2{right:7%;top:20%}.systemCard.s3{left:50%;bottom:15%;transform:translateX(-50%);border-color:rgba(47,159,244,.3)}
.systemLine{position:absolute;height:1px;background:linear-gradient(90deg,rgba(47,159,244,.15),rgba(47,159,244,.65),rgba(47,159,244,.15));transform-origin:left center}
.systemLine.l1{left:28%;top:34%;width:45%}.systemLine.l2{left:27%;top:38%;width:48%;transform:rotate(28deg)}
.systemCore{position:absolute;left:50%;top:50%;width:58px;height:58px;border:1px solid rgba(47,159,244,.4);border-radius:50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:rgba(255,255,255,.75);box-shadow:0 0 0 10px rgba(47,159,244,.04)}
.systemCore:before{content:"";width:20px;height:20px;border-radius:50%;background:var(--blue);box-shadow:0 0 25px rgba(47,159,244,.35)}
.workMeta{padding:22px 24px 0}.workCard>h3{font-size:26px;letter-spacing:-.045em}.workCard>p{font-size:14px;line-height:1.65;max-width:58ch}.workCard>a{margin:0 24px 24px}

/* Light information sections: tighter vertical rhythm and stronger hierarchy. */
.afterInner,.plainInner,.pricingInner{padding:clamp(78px,7vw,108px) 0}
.plainGrid{margin-top:38px}
.plainCard{min-height:190px;padding:24px 22px}
.plainCard h3{margin:23px 0 10px}

/* Mobile: keep the composition, stack it cleanly. */
@media(max-width:900px){
  .scrollStage{min-height:auto;padding:72px 22px;grid-template-columns:1fr;gap:28px}
  .scrollStage .copy{width:100%;padding:27px 23px}
  .copyTitle{max-width:13ch}
  .stageVisual{width:100%;min-height:260px;justify-self:stretch;opacity:1;transform:none}
  .workVisual{height:280px;min-height:280px}
}
@media(max-width:600px){
  .scrollStage{padding:58px 20px}
  .scrollStage:before{right:20px;top:18px}
  .scrollStage:after{right:20px;top:35px;width:90px}
  .stageVisual{min-height:225px;border-radius:13px}
  .stageNode{width:100px;min-height:55px;padding:9px;font-size:7px}.stageNode strong{font-size:11px}
  .stageVisualTop{height:42px;padding:0 13px}.stageVisualCanvas{inset:42px 0 0}.stageVisual:after{top:42px}
  .workVisual{height:245px;min-height:245px}.workMock{inset:15px}.leadLayout{grid-template-columns:1fr}.leadSide{display:none}.leadChat{border-right:0}.systemCard{padding:8px 9px}.systemCard strong{font-size:10px}
  .workCard>h3{font-size:23px}
}

/* V4 WORK REBUILD — editorial product theatre, distinct visual language per case study. */
.workSection{overflow:hidden}
.workInner{position:relative}
.workSectionIntro{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.48fr);gap:70px;align-items:end;margin-bottom:42px}
.workSectionIntro .plainTitle{margin-bottom:0;max-width:12ch}
.workIntroNote{margin:0 0 7px;color:#647582;font-size:13px;line-height:1.7;max-width:38ch}
.workGrid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);gap:22px;margin-top:0;align-items:stretch}
.workCard{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid rgba(16,25,35,.105);border-radius:18px;background:#fff;box-shadow:0 22px 65px rgba(16,25,35,.075);transition:transform .45s cubic-bezier(.2,.75,.2,1),box-shadow .45s ease,border-color .35s ease}
.workCard:hover{transform:translateY(-8px);border-color:rgba(47,159,244,.42);box-shadow:0 32px 90px rgba(16,25,35,.13)}
.workCard--wide{min-height:650px}.workCard--system{min-height:650px}
.workVisual{position:relative;min-height:430px;height:430px;overflow:hidden;border:0;border-bottom:1px solid rgba(16,25,35,.10);isolation:isolate}
.workChrome{position:absolute;z-index:10;left:0;right:0;top:0;height:45px;display:flex;justify-content:space-between;align-items:center;padding:0 18px;border-bottom:1px solid rgba(16,25,35,.08);font:8px var(--mono);letter-spacing:.13em;text-transform:uppercase;color:#748591;background:rgba(255,255,255,.76);backdrop-filter:blur(10px)}
.workChrome span:last-child{color:#168fe0}
.workContent{display:flex;flex-direction:column;align-items:flex-start;padding:24px 26px 26px;flex:1}
.workContent .workMeta{padding:0;color:#168fe0;font:9px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.workContent h3{margin:9px 0 10px;color:#101923;font:650 clamp(25px,2.3vw,34px)/1.03 var(--display);letter-spacing:-.055em}
.workContent p{margin:0;max-width:58ch;color:#566573;font-size:14px;line-height:1.7}
.workContent .btn{margin-top:auto;margin-top:22px}

/* Case 01: signal desk — horizontal information flow, chat + extraction + route. */
.workVisual--signal{background:radial-gradient(circle at 62% 50%,rgba(47,159,244,.12),transparent 32%),linear-gradient(145deg,#edf6fa 0%,#f9fbfc 55%,#eaf4f8 100%)}
.workVisual--signal:before{content:"";position:absolute;inset:45px 0 0;background-image:linear-gradient(rgba(16,25,35,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(16,25,35,.028) 1px,transparent 1px);background-size:34px 34px;z-index:-1}
.signalNoise{position:absolute;inset:45px 0 0;background:radial-gradient(circle at 20% 25%,rgba(47,159,244,.08),transparent 18%),radial-gradient(circle at 82% 72%,rgba(47,159,244,.07),transparent 24%);opacity:.9}
.signalRail{position:absolute;left:18px;top:70px;bottom:56px;width:42px;border-right:1px solid rgba(16,25,35,.09);display:flex;align-items:center;flex-direction:column;gap:13px;padding-top:3px;z-index:3}
.railLabel,.railCount{font:7px var(--mono);letter-spacing:.12em;color:#8a98a2;writing-mode:vertical-rl;transform:rotate(180deg)}
.railDot{width:7px;height:7px;border-radius:50%;border:1px solid rgba(16,25,35,.16);background:#fff}.railDot.active{background:var(--blue);border-color:var(--blue);box-shadow:0 0 0 5px rgba(47,159,244,.1)}
.signalThread{position:absolute;left:78px;top:82px;width:42%;min-width:260px;padding:16px 17px 15px;border:1px solid rgba(16,25,35,.10);border-radius:13px;background:rgba(255,255,255,.9);box-shadow:0 18px 50px rgba(16,25,35,.08);z-index:3;animation:signalFloat 5s ease-in-out infinite}
.threadHead{display:flex;justify-content:space-between;margin-bottom:13px;font:7px var(--mono);letter-spacing:.11em;color:#74838e}.threadHead b{color:#168fe0;font-weight:500}
.threadBubble{max-width:88%;padding:9px 10px;margin-top:8px;border-radius:9px;background:#f2f6f8;border:1px solid rgba(16,25,35,.06);color:#42515d;font-size:9px;line-height:1.45}.threadBubble.agent{margin-left:auto;background:#eaf6ff;border-color:rgba(47,159,244,.16)}.threadBubble.short{max-width:65%}
.typing{display:flex;align-items:center;gap:4px;margin-top:12px;color:#8997a0;font:7px var(--mono);letter-spacing:.04em}.typing i{width:4px;height:4px;border-radius:50%;background:var(--blue);animation:typingPulse 1.2s ease-in-out infinite}.typing i:nth-child(2){animation-delay:.16s}.typing i:nth-child(3){animation-delay:.32s}.typing span{margin-left:5px}
.signalInsight{position:absolute;right:42px;top:102px;width:31%;min-width:190px;padding:18px;border:1px solid rgba(47,159,244,.23);border-radius:14px;background:rgba(16,25,35,.95);color:#fff;box-shadow:0 28px 65px rgba(16,25,35,.20);z-index:4;animation:insightFloat 5.5s ease-in-out infinite}
.insightTop{display:flex;justify-content:space-between;font:7px var(--mono);letter-spacing:.12em;color:#a7b7c2}.insightTop b{color:#66baff;font-weight:500}
.scoreRing{float:right;width:52px;height:52px;border:1px solid rgba(102,186,255,.45);border-radius:50%;display:grid;place-items:center;margin-top:5px;box-shadow:0 0 0 7px rgba(47,159,244,.06),0 0 30px rgba(47,159,244,.13)}.scoreRing span{font:600 15px var(--display)}.scoreRing small{display:none}
.insightTitle{margin-top:19px;font:600 18px var(--display);letter-spacing:-.035em}.insightRows{clear:both;margin-top:20px;border-top:1px solid rgba(255,255,255,.10)}.insightRows span{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08);font:8px var(--mono);color:#9bacb8}.insightRows b{color:#eaf6ff;font-weight:500}
.routeBar{display:flex;align-items:center;gap:7px;margin-top:13px;color:#78c8ff;font:7px var(--mono);letter-spacing:.08em}.routeBar i{width:5px;height:5px;border-radius:50%;background:#62c6ff;box-shadow:0 0 0 4px rgba(98,198,255,.12);animation:routeBlink 1.5s infinite}
.signalCursor{position:absolute;left:56%;top:58%;width:13px;height:18px;background:#101923;clip-path:polygon(0 0,100% 70%,62% 73%,45% 100%);z-index:8;filter:drop-shadow(0 3px 5px rgba(16,25,35,.2));animation:cursorTravel 6s ease-in-out infinite}
.signalSweep{position:absolute;z-index:7;left:-25%;top:45px;width:25%;height:calc(100% - 45px);background:linear-gradient(90deg,transparent,rgba(47,159,244,.12),transparent);transform:skewX(-12deg);animation:sweepAcross 6s ease-in-out infinite;pointer-events:none}
.visualFooter{position:absolute;left:18px;right:18px;bottom:16px;z-index:10;display:flex;justify-content:space-between;align-items:center;font:7px var(--mono);letter-spacing:.11em;color:#7c8c97}.visualFooter b{color:#168fe0;font-weight:500}

/* Case 02: system orbit — architectural, radial and deliberately unlike the first visual. */
.workVisual--orbit{background:radial-gradient(circle at 50% 51%,rgba(47,159,244,.14),transparent 17%),radial-gradient(circle at 50% 50%,rgba(16,25,35,.035),transparent 55%),#f5f9fb}
.orbitGrid{position:absolute;inset:45px 0 0;background-image:linear-gradient(rgba(16,25,35,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(16,25,35,.028) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(circle at center,black 20%,transparent 76%)}
.orbitCore{position:absolute;left:50%;top:51%;transform:translate(-50%,-50%);width:122px;height:122px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#101923;color:#fff;border:1px solid rgba(102,186,255,.5);box-shadow:0 0 0 12px rgba(47,159,244,.04),0 0 65px rgba(47,159,244,.16);z-index:5}.orbitCore:after{content:"";position:absolute;inset:-6px;border:1px dashed rgba(47,159,244,.42);border-radius:50%;animation:coreSpin 13s linear infinite}.orbitCore span{font:600 25px var(--display);letter-spacing:-.06em}.orbitCore small{margin-top:3px;color:#91a8b7;font:7px var(--mono);letter-spacing:.12em}
.orbitRing{position:absolute;left:50%;top:51%;border:1px solid rgba(47,159,244,.18);border-radius:50%;transform:translate(-50%,-50%);z-index:2}.ringA{width:190px;height:190px;animation:ringSpinA 12s linear infinite}.ringB{width:280px;height:160px;transform:translate(-50%,-50%) rotate(27deg);border-color:rgba(16,25,35,.12);animation:ringSpinB 16s linear infinite}.ringC{width:350px;height:240px;transform:translate(-50%,-50%) rotate(-34deg);border-color:rgba(47,159,244,.13);animation:ringSpinC 19s linear infinite}
.orbitNode{position:absolute;z-index:7;padding:11px 12px 10px;width:132px;border:1px solid rgba(16,25,35,.12);border-radius:10px;background:rgba(255,255,255,.94);box-shadow:0 14px 35px rgba(16,25,35,.08);animation:nodeHover 4.5s ease-in-out infinite}.orbitNode small{display:block;color:#168fe0;font:7px var(--mono);letter-spacing:.08em}.orbitNode strong{display:block;margin:4px 0;font:600 13px var(--display);letter-spacing:-.03em;color:#101923}.orbitNode i{font:7px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#8997a0;font-style:normal}.nodeWeb{left:8%;top:25%}.nodeChat{right:8%;top:21%;animation-delay:.8s}.nodeTeam{left:12%;bottom:18%;animation-delay:1.4s}.nodeFollow{right:10%;bottom:14%;animation-delay:2s}
.orbitBeam{position:absolute;height:1px;z-index:3;background:linear-gradient(90deg,transparent,rgba(47,159,244,.65),transparent);transform-origin:left center}.beamA{left:24%;top:34%;width:52%;transform:rotate(10deg)}.beamB{left:28%;top:66%;width:47%;transform:rotate(-17deg)}.beamC{left:43%;top:25%;width:30%;transform:rotate(70deg);opacity:.55}
.orbitParticle{position:absolute;width:6px;height:6px;border-radius:50%;background:#2f9ff4;box-shadow:0 0 0 4px rgba(47,159,244,.10),0 0 20px rgba(47,159,244,.35);z-index:8}.p1{left:26%;top:34%;animation:particleTravelA 5s linear infinite}.p2{left:72%;top:42%;animation:particleTravelB 4.4s linear infinite}.p3{left:48%;top:74%;animation:particleTravelC 5.8s linear infinite}
.orbitReadout{position:absolute;left:18px;bottom:53px;display:grid;grid-template-columns:auto auto;column-gap:9px;row-gap:5px;padding:10px 11px;border-left:2px solid var(--blue);background:rgba(255,255,255,.78);backdrop-filter:blur(7px);z-index:8;font:7px var(--mono);letter-spacing:.08em;color:#7b8b96}.orbitReadout b{color:#101923;font-weight:600}.orbitReadout i{grid-column:1/-1;width:72px;height:2px;background:linear-gradient(90deg,var(--blue) 98%,#dbe5eb 98%)}

@keyframes signalFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes insightFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(7px) rotate(.4deg)}}
@keyframes typingPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
@keyframes routeBlink{50%{opacity:.25;box-shadow:0 0 0 7px rgba(98,198,255,.04)}}
@keyframes cursorTravel{0%,15%{transform:translate(0,0)}35%{transform:translate(50px,-55px)}55%{transform:translate(110px,5px)}75%{transform:translate(40px,65px)}100%{transform:translate(0,0)}}
@keyframes sweepAcross{0%,20%{transform:translateX(0) skewX(-12deg);opacity:0}38%{opacity:1}72%{opacity:.5}100%{transform:translateX(520%) skewX(-12deg);opacity:0}}
@keyframes coreSpin{to{transform:rotate(360deg)}}
@keyframes ringSpinA{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes ringSpinB{to{transform:translate(-50%,-50%) rotate(387deg)}}
@keyframes ringSpinC{to{transform:translate(-50%,-50%) rotate(-394deg)}}
@keyframes nodeHover{0%,100%{translate:0 0}50%{translate:0 -5px}}
@keyframes particleTravelA{0%{transform:translate(0,0)}50%{transform:translate(130px,40px)}100%{transform:translate(0,0)}}
@keyframes particleTravelB{0%{transform:translate(0,0)}50%{transform:translate(-110px,-55px)}100%{transform:translate(0,0)}}
@keyframes particleTravelC{0%{transform:translate(0,0)}50%{transform:translate(70px,-90px)}100%{transform:translate(0,0)}}

@media(max-width:1050px){
  .workSectionIntro{grid-template-columns:1fr;gap:16px}.workIntroNote{margin:0;max-width:55ch}
  .workGrid{grid-template-columns:1fr}.workCard--wide,.workCard--system{min-height:0}
  .workVisual{height:410px;min-height:410px}
}
@media(max-width:650px){
  .workSectionIntro{margin-bottom:28px}.workGrid{gap:16px}.workVisual{height:365px;min-height:365px}.workChrome{padding:0 12px}.signalRail{left:11px}.signalThread{left:60px;top:76px;width:calc(100% - 82px);min-width:0;padding:13px}.signalInsight{right:18px;top:auto;bottom:65px;width:48%;min-width:0;padding:13px}.signalInsight .insightRows span:nth-child(3){display:none}.insightTitle{font-size:15px}.scoreRing{width:43px;height:43px}.orbitCore{width:92px;height:92px}.orbitCore span{font-size:20px}.orbitNode{width:108px;padding:8px}.orbitNode strong{font-size:11px}.nodeWeb{left:5%;top:22%}.nodeChat{right:5%;top:18%}.nodeTeam{left:5%;bottom:18%}.nodeFollow{right:5%;bottom:13%}.ringA{width:160px;height:160px}.ringB{width:230px;height:140px}.ringC{width:285px;height:205px}.orbitReadout{left:12px;bottom:49px}.workContent{padding:20px 20px 21px}.workContent h3{font-size:26px}.workContent p{font-size:13px}.workContent .btn{width:100%;justify-content:center}.visualFooter{left:12px;right:12px;font-size:6px}
}
@media(prefers-reduced-motion:reduce){.signalThread,.signalInsight,.typing i,.signalCursor,.signalSweep,.orbitCore:after,.orbitRing,.orbitNode,.orbitParticle{animation:none!important}}