/* Load after the editorial and background sheets. The final, readable state is
   the default: JavaScript only adds bounded motion to elements already in view. */
.nl-studio.ns-scroll-scenes :is(.ns-mission-intro,.ns-mission-stats>div,.nv-work-card,.ns-steps>article,.ns-conditions-grid>li,.ns-cabinet-grid,.ns-contact-copy).ns-section-reveal{
  translate:0 0!important;
  transition:none!important;
}

.nl-studio.ns-scroll-scenes .ns-scene-mission-accent{
  position:relative;
  display:inline-block;
  color:#91adf8;
  background:linear-gradient(100deg,#d7e6ff 0%,#a8c7ff 40%,#91adf8 50%) 100% 0 / 220% 100% no-repeat;
  background-position-x:calc(100% - var(--ns-mission-sweep,100%));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.nl-studio.ns-scroll-scenes .ns-scene-mission-accent::after{
  content:'';
  position:absolute;
  left:.025em;
  right:.015em;
  bottom:-.09em;
  height:2px;
  border-radius:999px;
  pointer-events:none;
  background:linear-gradient(90deg,#76a2ff00,#a3c8ff,#76a2ff00);
  transform:scaleX(var(--ns-mission-rule,1));
  transform-origin:left center;
  opacity:.7;
}
.nl-studio.ns-scroll-scenes .ns-scene-counter{font-variant-numeric:tabular-nums}
.nl-studio.ns-scroll-scenes .ns-scene-product{transform-origin:50% 85%}
.nl-studio.ns-scroll-scenes .ns-scene-person{transform-origin:50% 90%}
.nl-studio.ns-scroll-scenes .ns-scene-person .nv-agent-avatar{transform-origin:50% 80%}

/* Desktop follows the section; stacked layouts follow each card's own position.
   The four method diagrams are drawn by the physical progress of the page.
   Text, numbers, boxes and points always remain available and readable. */
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-scene-step{
  position:relative;
}
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-scene-step::before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#5886eb,#bad8ff);
  transform:scaleX(var(--ns-step-progress,1));
  transform-origin:left center;
  pointer-events:none;
}
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-step-art{
  position:relative;
  isolation:isolate;
}
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-step-art::before{
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(ellipse at 25% 75%,#3c6cb43d,transparent 75%);
  opacity:var(--ns-step-progress,1);
  pointer-events:none;
}
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-step-art path{
  animation:none!important;
  stroke-dasharray:1!important;
  stroke-dashoffset:calc(1 - var(--ns-step-progress,1))!important;
}
.nl-studio.ns-scroll-scenes .ns-scene-method .ns-step-art svg{color:#bdd9ff}

/* Reduced motion and the site's explicit pause show complete illustrations.
   The pause also cancels active Web Animations in scroll-scenes.js. */
html.motion-paused .nl-studio.ns-scroll-scenes .ns-scene-mission-accent{
  background:none;
  -webkit-text-fill-color:currentColor;
}
html.motion-paused .nl-studio.ns-scroll-scenes .ns-scene-mission-accent::after,
html.motion-paused .nl-studio.ns-scroll-scenes .ns-scene-step::before{transform:none}
html.motion-paused .nl-studio.ns-scroll-scenes .ns-step-art path{stroke-dashoffset:0!important}
@media(prefers-reduced-motion:reduce){
 .nl-studio.ns-scroll-scenes .ns-scene-mission-accent{background:none;-webkit-text-fill-color:currentColor}
 .nl-studio.ns-scroll-scenes .ns-scene-mission-accent::after,.nl-studio.ns-scroll-scenes .ns-scene-step::before{transform:none}
 .nl-studio.ns-scroll-scenes .ns-step-art path{stroke-dashoffset:0!important}
}