/* 9senses Landing Circle — standalone [landing_circle] variant. */
.ns-landing-circle-v2{
  --ns-circle-v2-blue:#0c71c3;
  --ns-circle-v2-label:#f3f3f3;
  --ns-circle-v2-muted:rgba(255,255,255,.58);
  --ns-circle-v2-green:#30ce7c;
  --ns-circle-v2-indigo:#3b4fd8;
  --ns-circle-v2-gray:#cfcfcf;
  /* One source of truth. landing-135.css defines --ns-tw / --ns-body on :root;
     these defer to those so the two stylesheets cannot drift apart, and carry
     the full stack as a fallback for pages that load the circle on its own.
     Both families are hosted locally by the theme — nothing here requests a
     webfont, and nothing here should start. */
  --ns-circle-v2-tw:var(--ns-tw,'Special Elite','Courier New',monospace);
  --ns-circle-v2-body:var(--ns-body,'Open Sans',Arial,sans-serif);
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
  padding:0;
  overflow:visible;
}
.ns-landing-circle-v2,
.ns-landing-circle-v2 *{box-sizing:border-box}

/* The shortcode owns the heading. It is a distinct row above the circle, so
   the Divi layout needs only one shortcode/code module and no companion text
   module. */
.ns-circle-v2-headline{
  position:relative;
  z-index:15;
  width:min(100%,640px);
  max-width:640px;
  min-width:0;
  margin:0 0 clamp(32px,5vw,64px);
}
.ns-circle-v2-headline h1{
  font-family:var(--ns-circle-v2-tw)!important;
  font-weight:400!important;
  color:#dcdcdc!important;
  font-size:clamp(30px,4.4vw,56px);
  line-height:1.18!important;
  letter-spacing:.04em!important;
  white-space:nowrap;
  width:100%;
  max-width:640px;
  margin:0!important;
  padding:0!important;
}
.ns-circle-v2-headline h1 strong{font-weight:700!important;color:inherit!important}
.ns-circle-v2-work{
  position:relative;
  display:inline-block;
  white-space:nowrap;
  cursor:pointer;
  background:linear-gradient(100deg,#dcdcdc 38%,#aee9c8 50%,#b9c4f0 56%,#dcdcdc 68%);
  background-size:320% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:nsCircleV2WorkLive 16s linear infinite;
}
@keyframes nsCircleV2WorkLive{0%{background-position:0 0}13%{background-position:-320% 0}100%{background-position:-320% 0}}

/* The orbit uses the shortcode module's actual content column. It neither
   reserves artificial side tracks nor breaks out to the viewport. The square
   therefore starts at the column's left edge and occupies its full width. */
.ns-circle-v2-stage{
  position:relative;
  display:block;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
  padding:0;
  overflow:visible;
}
.ns-circle-v2-orbit{
  position:relative;
  aspect-ratio:1/1;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
  overflow:visible;
  container-type:inline-size;
}
.ns-circle-v2-rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ns-circle-v2-rings canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0!important;display:block!important}


/* Transformation story: the native 12 o'clock item still owns the bubble.
   The supporting vector model uses the circle's upper arc rather than a
   rectangular content row, leaving the centre wording readable. */
.ns-circle-v2-story{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:4;
  overflow:visible;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .42s ease,visibility 0s linear .44s;
}
.ns-circle-v2-story.is-visible{
  opacity:1;
  visibility:visible;
  transition:opacity .52s ease,visibility 0s linear 0s;
}
.ns-circle-v2-story-visual,
.ns-circle-v2-story-panels{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.ns-circle-v2-story-canvas{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  z-index:0;
  opacity:.98;
  pointer-events:none!important;
}
.ns-circle-v2-story-panels{z-index:2}
.ns-circle-v2-story-panel{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .32s ease,visibility 0s linear .36s;
}
.ns-circle-v2-story-panel.is-active{
  opacity:1;
  visibility:visible;
  transition-delay:0s;
}
.ns-circle-v2-story-detail{
  --ns-circle-v2-token-rgb:211,222,232;
  position:absolute;
  display:block;
  min-width:0;
  margin:0;
  padding:0;
  border:0;
  background:transparent!important;
  box-shadow:none!important;
  color:rgb(var(--ns-circle-v2-token-rgb))!important;
  text-decoration:none!important;
  text-align:center;
  opacity:0;
  transform:translate(-50%,-50%) translateY(8px) scale(.965);
  transition:opacity .32s ease,transform .55s cubic-bezier(.2,.8,.3,1),filter .25s ease;
  pointer-events:none;
}
/* Headings stay fully legible from the moment they appear. What lights and dims
   is the item's TOKEN on the canvas, not its text — dropping the copy to 46%
   made the arrival visible at the cost of making three quarters of the stage
   hard to read. */
.ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail{
  opacity:1;
  transform:translate(-50%,-50%) translateY(0) scale(1);
  pointer-events:auto;
  transition-delay:.10s;
}
.ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail:nth-child(2){transition-delay:.18s}
.ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail:nth-child(3){transition-delay:.26s}
.ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail:nth-child(4){transition-delay:.34s}
.ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail:nth-child(5){transition-delay:.42s}
.ns-circle-v2-story-detail-spin{
  position:relative;
  display:grid;
  grid-template-rows:auto auto auto;
  justify-items:center;
  align-content:start;
  gap:5px;
  width:100%;
  min-height:0;
  padding:1px 3px;
}
.ns-circle-v2-story-detail-marker{
  display:block;
  width:clamp(28px,3.15cqw,38px);
  aspect-ratio:1/1;
  opacity:0;
  pointer-events:none;
}
/* Item heading. Special Elite at weight 400, matching .ns-blog-title in
   landing-135.css — the plugin's existing pattern for a heading that sits above
   body copy. This was the one heading in the circle still set in the body face.
   Special Elite ships a single weight, so the emphasis comes from the face,
   size and glow rather than from a bold that the browser would have to
   synthesise. It also sets LARGER than the sans it replaced: the distressed
   typewriter strokes and modest x-height cost legibility, so matching the old
   Open Sans pixel sizes left these headings hard to read. Size goes up, the
   leading opens to suit the irregular baseline, and the extra width this costs
   is paid for in the token block widths (see arcSpecs in the JS) rather than by
   shrinking the type. */
.ns-circle-v2-story-detail-title{
  display:block;
  width:100%;
  color:rgb(var(--ns-circle-v2-token-rgb))!important;
  -webkit-text-fill-color:rgb(var(--ns-circle-v2-token-rgb))!important;
  font-family:var(--ns-circle-v2-tw)!important;
  font-size:clamp(15.5px,1.78cqw,19.5px)!important;
  font-weight:400!important;
  line-height:1.3!important;
  letter-spacing:.006em;
  text-align:center;
  text-shadow:0 2px 10px rgba(0,7,23,1),0 0 15px rgba(var(--ns-circle-v2-token-rgb),.22);
  overflow-wrap:break-word;
}
/* Configured <bold> inside a title would otherwise trigger synthetic bold on a
   single-weight face. The title is already the emphasis; keep the weight. */
.ns-circle-v2-story-detail-title strong,
.ns-circle-v2-story-detail-title b{
  font-weight:inherit!important;
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
}
.ns-circle-v2-story-detail-text{
  display:block;
  width:100%;
  max-width:25em;
  color:rgba(244,247,251,.95)!important;
  -webkit-text-fill-color:rgba(244,247,251,.95)!important;
  font-family:var(--ns-circle-v2-body)!important;
  /* Supporting copy sits under a Special Elite heading, so it carries the
     reading load and was set too small to do it. Weight drops to 400: at 500 it
     competed with the heading instead of sitting below it. */
  font-size:clamp(13.5px,1.36cqw,16px)!important;
  font-weight:400!important;
  line-height:1.42!important;
  text-align:center;
  text-shadow:0 2px 9px rgba(0,7,23,1);
  overflow-wrap:break-word;
}
.ns-circle-v2-story-panel-count-5 .ns-circle-v2-story-detail-title{font-size:clamp(13px,1.46cqw,16px)!important}
.ns-circle-v2-story-panel-count-5 .ns-circle-v2-story-detail-text{font-size:clamp(12px,1.18cqw,13.6px)!important;line-height:1.36!important}
/* A glow on the reached heading, no change in legibility either way. */
.ns-circle-v2-story-detail.is-vector-active .ns-circle-v2-story-detail-title{
  text-shadow:0 2px 10px rgba(0,7,23,1),0 0 26px rgba(var(--ns-circle-v2-token-rgb),.6);
  transition:text-shadow .55s ease;
}
.ns-circle-v2-story-detail-link{cursor:pointer}
.ns-circle-v2-story-detail-link:hover,
.ns-circle-v2-story-detail-link:focus-visible{
  filter:brightness(1.2);
  outline:none;
}
.ns-circle-v2-story-detail-link:focus-visible .ns-circle-v2-story-detail-title{
  text-decoration:underline!important;
  text-underline-offset:.2em;
}
.ns-circle-v2-story.is-final-hold .ns-circle-v2-story-panel[data-story-mode="substance"],
.ns-circle-v2-story.is-final-hold .ns-circle-v2-story-detail-link{pointer-events:auto!important}

/* Residual trace — the state the last step settles into once its hold expires.
   The linked tokens do not disappear: they fade to a faint mark that is still
   clickable, and come back under the pointer. Everything else in the stage
   (unlinked tokens, the body copy, the canvas) clears away. */
.ns-circle-v2-story.is-residual{
  opacity:1;
  visibility:visible;
  transition:opacity .6s ease,visibility 0s linear 0s;
}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-canvas{opacity:0;transition:opacity 1.8s ease}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-panel.is-active,
.ns-circle-v2-story.is-residual .ns-circle-v2-story-detail-link{pointer-events:none}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-detail-link{pointer-events:auto!important}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail{
  opacity:0;
  transition:opacity 2.2s ease,transform 2.2s ease;
}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail-link{
  opacity:.22;
  transform:translate(-50%,-50%) translateY(0) scale(.97);
  transition:opacity 2.2s ease,transform 2.2s ease,filter .3s ease;
}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-detail-text{opacity:0;transition:opacity 1.2s ease}
/* Reaching any one link raises the whole set to a findable level, so a faint
   mark is never something the visitor has to hunt for pixel by pixel. */
.ns-circle-v2-story.is-residual.is-residual-lit .ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail-link{
  opacity:.5;
  transition:opacity .4s ease;
}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail-link:hover,
.ns-circle-v2-story.is-residual .ns-circle-v2-story-panel.is-active .ns-circle-v2-story-detail-link:focus-visible{
  opacity:1;
  transform:translate(-50%,-50%) translateY(0) scale(1);
  transition:opacity .28s ease,transform .45s cubic-bezier(.2,.8,.3,1);
}
.ns-circle-v2-story.is-residual .ns-circle-v2-story-detail-link:hover .ns-circle-v2-story-detail-text,
.ns-circle-v2-story.is-residual .ns-circle-v2-story-detail-link:focus-visible .ns-circle-v2-story-detail-text{
  opacity:1;
  transition:opacity .4s ease .05s;
}
.ns-landing-circle-v2 .ns-circle-v2-story-live{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
@media(max-width:760px){
  .ns-circle-v2-story-detail-title{font-size:clamp(12.5px,1.9cqw,15.5px)!important}
  .ns-circle-v2-story-detail-text{font-size:clamp(11.5px,1.4cqw,13.5px)!important;line-height:1.36!important}
  .ns-circle-v2-story-detail-marker{width:clamp(22px,3.4cqw,30px)}
}
@media(max-width:640px){
  .ns-circle-v2-story-detail-spin{gap:2px;padding:0 1px}
  /* Typewriter faces need more leading than the sans did at these sizes: the
     irregular baseline reads as crowding when the lines are packed to 1.08. */
  .ns-circle-v2-story-detail-title{font-size:clamp(10.5px,3.1cqw,13px)!important;line-height:1.2!important}
  .ns-circle-v2-story-detail-text{display:none!important}
  .ns-circle-v2-story-detail-marker{width:clamp(15px,4.8cqw,22px)}
  .ns-circle-v2-story-panel-count-5 .ns-circle-v2-story-detail-title{font-size:clamp(9.2px,2.7cqw,11.4px)!important}
}

.ns-circle-v2-why,.ns-circle-v2-senses{
  position:absolute!important;
  left:50%;
  transform:translateX(-50%);
  pointer-events:none;
  z-index:1;
  width:auto;
  font-family:var(--ns-circle-v2-tw)!important;
  font-size:clamp(40px,10.6vw,120px)!important;
  font-size:clamp(40px,10.6cqw,120px)!important;
  line-height:1!important;
  color:#c9c9c9!important;
  opacity:.08;
  animation:nsCircleV2WordFade 24s ease-in-out infinite!important;
}
.ns-circle-v2-why{top:27%}
.ns-circle-v2-senses{top:60%}
@keyframes nsCircleV2WordFade{0%,100%{opacity:.08}50%{opacity:.58}}
/* The decorative word occupies the same band as the token arc. While the story
   is on screen it steps aside, so the arc never reads as sitting on top of it.
   Sibling selectors, because the story element precedes both words inside the
   orbit — this needs no class on the root and no JS. */
.ns-circle-v2-story.is-visible~.ns-circle-v2-why{
  opacity:0!important;
  animation:none!important;
  transition:opacity .8s ease!important;
}
.ns-circle-v2-story.is-residual~.ns-circle-v2-why{
  opacity:.04!important;
  animation:none!important;
  transition:opacity 1.8s ease!important;
}
.ns-circle-v2-orbit.ns-circle-v2-inside .ns-circle-v2-why,
.ns-circle-v2-orbit.ns-circle-v2-inside .ns-circle-v2-senses{animation:none!important;opacity:.58;transition:opacity 1.4s ease}

.ns-circle-v2-nine{
  position:absolute!important;
  left:50%;
  top:50%;
  transform:translate(-50%,-36%);
  z-index:2;
  width:auto;
  font-family:var(--ns-circle-v2-tw)!important;
  font-size:clamp(84px,21.75vw,250px)!important;
  font-size:clamp(84px,21.75cqw,250px)!important;
  line-height:1!important;
  color:#c9c9c9!important;
  transition:text-shadow .4s,color .4s;
}
.ns-circle-v2-nine a{color:inherit!important;text-decoration:none!important}
.ns-circle-v2-nine-value{
  position:relative;
  display:inline-block;
  cursor:pointer;
  background:linear-gradient(100deg,#c9c9c9 34%,#d7eee1 47%,#c8d0f4 53%,#c9c9c9 66%);
  background-size:360% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  animation:nsCircleV2NineLive 20s linear infinite;
  transition:filter .7s ease,text-shadow .7s ease;
}
@keyframes nsCircleV2NineLive{0%{background-position:0 0}10%{background-position:-360% 0}100%{background-position:-360% 0}}
/* Keyed to the numeral's own proximity class, not .ns-circle-v2-inside: that
   fires across the whole orbit, so the 9 glowed the entire time the pointer was
   anywhere in the graphic. The halo is tighter too — a 22px blur on a glyph
   this size read as a permanent aura rather than a response. */
.ns-circle-v2-orbit.ns-circle-v2-near-nine .ns-circle-v2-nine-value,
.ns-circle-v2-nine-value:hover,
.ns-circle-v2-nine-value:focus,
.ns-circle-v2-nine-value.ns-circle-v2-bubbling{
  filter:brightness(1.13);
  text-shadow:0 0 13px rgba(48,206,124,.28);
}
/* The centre interaction intentionally has no underline/seed animation. */
.ns-circle-v2-nine-value.ns-circle-v2-anchor::before,
.ns-circle-v2-nine-value.ns-circle-v2-anchor::after{display:none!important;content:none!important}
.ns-circle-v2-nine.ns-circle-v2-mount .ns-circle-v2-bubble{width:280px}
.ns-circle-v2-nine.ns-circle-v2-bubbling,
.ns-circle-v2-nine:hover,
.ns-circle-v2-nine:focus-within{z-index:14}
.ns-circle-v2-orbit.ns-circle-v2-near-nine .ns-circle-v2-nine{color:#fff!important;text-shadow:none}

/* Each generated item gets the same bounded text-block role that its Divi text
   module had on the live landing page. Long and translated labels wrap inside
   their own block instead of stretching across the circle or viewport. */
.ns-circle-v2-label{
  --ns-circle-v2-label-width:240px;
  --ns-circle-v2-label-cap:32cqw;
  position:absolute!important;
  transform:translate(-50%,-50%);
  z-index:5;
  width:min(var(--ns-circle-v2-label-width),32vw)!important;
  width:min(var(--ns-circle-v2-label-width),var(--ns-circle-v2-label-cap))!important;
  max-width:100%!important;
  min-width:0;
  margin:0!important;
  padding:0!important;
  font-family:var(--ns-circle-v2-tw)!important;
  font-size:clamp(15px,2.65vw,30px)!important;
  font-size:clamp(15px,3.1cqw,30px)!important;
  line-height:1.6!important;
  color:var(--ns-circle-v2-label)!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:auto;
  -webkit-hyphens:auto;
  transition:color .7s,filter .7s;
}
.ns-circle-v2-label h2{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  font:inherit!important;
  color:inherit!important;
  line-height:inherit!important;
  letter-spacing:inherit!important;
  text-align:inherit!important;
  white-space:normal!important;
  margin:0!important;
  padding:0!important;
}
.ns-circle-v2-label a{display:block;color:inherit!important;text-decoration:none!important;white-space:normal!important}
.ns-circle-v2-label strong{font-weight:700!important;color:inherit!important}
/* One configured item owns the 12 o’clock position. The upper semicircle is
   intentionally left free for the top item and future top-item animations. */
.ns-circle-v2-top-item{
  /* Keep the 12 o’clock label as a compact, centred text block. Long labels
     should wrap rather than stretching across the reserved upper semicircle. */
  --ns-circle-v2-label-width:300px;
  --ns-circle-v2-label-cap:34cqw;
  left:50%;
  top:10%;
}
/* All non-Top items are projected server-side onto the lower semicircle. Their
   configured sequence runs visually from 9 → 6 → 3 o’clock. */
.ns-circle-v2-lower-item{
  /* Wide enough for a two-word item to set on two lines rather than three.
     The 9 and 3 o'clock labels are the constraint: centred at 10% and 90% of
     the orbit, a 23cqw block reaches about 1.5% past the orbit edge, which the
     visible overflow absorbs. */
  --ns-circle-v2-label-width:230px;
  --ns-circle-v2-label-cap:23cqw;
  left:var(--ns-circle-v2-x,50%);
  /* Fallback matches the 6 o'clock position the shortcode computes, so an item
     rendered without its inline custom properties lands in the same place. */
  top:var(--ns-circle-v2-y,93%);
  line-height:1.45!important;
}

.ns-circle-v2-tip{display:none}
.ns-circle-v2-bubble .ns-circle-v2-tip{display:block}
.ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-bubble .ns-circle-v2-blink:hover,
.ns-circle-v2-bubble .ns-circle-v2-blink:focus,
.ns-circle-v2-bubble .ns-circle-v2-blink:visited{
  color:inherit!important;
  text-decoration:none!important;
  cursor:pointer;
  display:block;
  font-family:inherit!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  font-style:inherit!important;
  letter-spacing:inherit!important;
  line-height:inherit!important;
  text-transform:none!important;
}
.ns-circle-v2-label:hover,
.ns-circle-v2-label:focus-within,
.ns-circle-v2-label.ns-circle-v2-bubbling,
.ns-circle-v2-work:hover,
.ns-circle-v2-work:focus,
.ns-circle-v2-work.ns-circle-v2-bubbling{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(100deg,#cfeede 10%,#f2f8ff 35%,#bdc6f5 60%,#cfeede 90%);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  animation:nsCircleV2Shimmer 11s linear infinite;
}
@keyframes nsCircleV2Shimmer{0%{background-position:0 0}22%{background-position:-220% 0}100%{background-position:-220% 0}}
.ns-circle-v2-label:hover,.ns-circle-v2-label:focus-within,.ns-circle-v2-label.ns-circle-v2-bubbling{z-index:12}

.ns-circle-v2-anchor{position:relative}
.ns-circle-v2-anchor::after{
  content:"";
  position:absolute;
  left:6%;
  bottom:-7px;
  width:88%;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,rgba(207,207,207,.25),#cfcfcf);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 1.1s cubic-bezier(.2,.8,.3,1) 1.9s;
  box-shadow:0 0 7px rgba(207,207,207,.45);
}
.ns-circle-v2-anchor:hover::after,
.ns-circle-v2-anchor:focus::after,
.ns-circle-v2-anchor:focus-within::after,
.ns-circle-v2-anchor.ns-circle-v2-bubbling::after{transform:scaleX(1);transition:transform 1.1s cubic-bezier(.2,.8,.3,1) 0s}
.ns-circle-v2-anchor::before{
  content:"";
  position:absolute;
  left:calc(94% - 4px);
  bottom:-10px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--ns-circle-v2-gray);
  box-shadow:0 0 9px 3px rgba(207,207,207,.65);
  opacity:0;
  transform:scale(.2);
  pointer-events:none;
}
.ns-circle-v2-anchor:hover::before,
.ns-circle-v2-anchor:focus::before,
.ns-circle-v2-anchor:focus-within::before,
.ns-circle-v2-anchor.ns-circle-v2-bubbling::before{animation:nsCircleV2SeedIn 3.4s ease .95s forwards}
@keyframes nsCircleV2SeedIn{0%{opacity:0;transform:scale(.2)}32%{opacity:1;transform:scale(1)}58%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.55)}}
.ns-circle-v2-anchor.ns-circle-v2-closing::before{animation:nsCircleV2SeedOut 1.85s ease forwards}
@keyframes nsCircleV2SeedOut{0%{opacity:0;transform:scale(.5)}19%{opacity:1;transform:scale(1)}35%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.1)}}

.ns-circle-v2-bubble{
  position:absolute;
  width:250px;
  max-width:74vw;
  left:50%;
  top:58%;
  transform:translate(-50%,-46%) scale(.032);
  background:transparent;
  border:none;
  border-radius:10px;
  padding:0;
  font-family:var(--ns-circle-v2-body)!important;
  font-size:14px;
  line-height:1.6;
  color:#222b3f!important;
  letter-spacing:normal;
  text-align:left;
  white-space:normal;
  hyphens:auto;
  -webkit-hyphens:auto;
  -ms-hyphens:auto;
  overflow-wrap:break-word;
  word-wrap:break-word;
  word-break:normal;
  opacity:0;
  pointer-events:none;
  filter:blur(5px);
  transition:transform .45s cubic-bezier(.5,0,.7,.7) 0s,opacity 0s linear .43s,filter 0s linear .43s;
  z-index:20;
}
.ns-circle-v2-bubble .ns-circle-v2-bspin{display:block;position:relative;padding:9px 12px}
.ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-bubble .ns-circle-v2-blink{opacity:0;visibility:hidden;transition:opacity .16s ease 0s,visibility 0s linear .16s}
.ns-circle-v2-anchor.ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-anchor:hover .ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-anchor:focus-within .ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-mount.ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-mount:hover .ns-circle-v2-work~.ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-anchor.ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-anchor:hover .ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-anchor:focus-within .ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-mount.ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-mount:hover .ns-circle-v2-work~.ns-circle-v2-bubble .ns-circle-v2-blink{opacity:1;visibility:visible;transition:opacity .55s ease 2.08s,visibility 0s linear 2.08s}
.ns-circle-v2-bubble .ns-circle-v2-bfog{position:absolute;inset:-9px;z-index:-1;background:rgba(207,207,207,.88);border-radius:14px;filter:blur(10px)}
.ns-circle-v2-bubble strong{color:#0d1530!important;-webkit-text-fill-color:#0d1530!important;font-weight:700!important}
.ns-circle-v2-mount{position:relative}
.ns-circle-v2-headline .ns-circle-v2-bubble{width:300px}
.ns-circle-v2-mount.ns-circle-v2-bubbling .ns-circle-v2-bubble,
.ns-circle-v2-anchor.ns-circle-v2-bubbling .ns-circle-v2-bubble,
.ns-circle-v2-anchor:hover .ns-circle-v2-bubble,
.ns-circle-v2-anchor:focus-within .ns-circle-v2-bubble{
  opacity:1;
  pointer-events:auto;
  filter:blur(0);
  transform:translate(-50%,-46%) scale(1);
  transition:transform 1.9s cubic-bezier(.3,1.12,.35,1) 1.9s,opacity 1.1s ease 1.9s,filter 1.2s ease 2.1s;
}
.ns-circle-v2-bubble,
.ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-circle-v2-bubble .ns-circle-v2-tip *,
.ns-circle-v2-bubble .ns-circle-v2-blink,
.ns-circle-v2-bubble .ns-circle-v2-blink:hover,
.ns-circle-v2-bubble .ns-circle-v2-blink:focus,
.ns-circle-v2-bubble .ns-circle-v2-blink:visited{
  color:#222b3f!important;
  -webkit-text-fill-color:#222b3f!important;
  text-shadow:none!important;
  hyphens:auto!important;
  -webkit-hyphens:auto!important;
  -ms-hyphens:auto!important;
  overflow-wrap:break-word!important;
  word-wrap:break-word!important;
  word-break:normal!important;
}
.ns-circle-v2-bubble p,.ns-circle-v2-bubble div,.ns-circle-v2-bubble span{font-size:inherit;color:inherit!important;margin:0;padding:0}
/* Preserve configured <bold> emphasis even when Divi or a translation layer
   wraps/re-emits the bubble text. Standard <strong> is the normal output; the
   other selectors are defensive fallbacks for translated DOM. */
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-tip strong,
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-blink strong,
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-tip b,
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-blink b,
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-tip bold,
.ns-landing-circle-v2 .ns-circle-v2-bubble .ns-circle-v2-blink bold{
  color:#0d1530!important;
  -webkit-text-fill-color:#0d1530!important;
  font-family:inherit!important;
  font-size:inherit!important;
  font-style:inherit!important;
  font-weight:700!important;
}

@media(max-width:1100px){
  .ns-circle-v2-bubble{width:240px}
}
@media(max-width:760px){
  .ns-circle-v2-headline{margin-bottom:clamp(28px,8vw,48px)}
  .ns-circle-v2-label{
    width:min(var(--ns-circle-v2-label-width),36vw)!important;
    width:min(var(--ns-circle-v2-label-width),var(--ns-circle-v2-label-cap))!important;
    line-height:1.45!important
  }
  .ns-circle-v2-bubble{width:min(240px,72vw)}
  .ns-circle-v2-headline h1{font-size:clamp(30px,8.4vw,38px)!important}
}
@media(max-width:640px){
  .ns-circle-v2-headline{
    width:calc(100vw - 40px);
    max-width:640px;
    margin-left:calc(50% - 50vw + 20px);
  }
  /* Keep the mobile orbit inside the same Divi column as well. */
  .ns-circle-v2-stage{width:100%;max-width:none;margin:0;padding:0;left:auto}
  .ns-circle-v2-label{
    width:min(var(--ns-circle-v2-label-width),30vw)!important;
    width:min(var(--ns-circle-v2-label-width),38cqw)!important;
    font-size:clamp(12px,3.45vw,14px)!important;
    font-size:clamp(12px,4cqw,14px)!important;
    line-height:1.35!important
  }
  .ns-circle-v2-top-item{
    width:min(var(--ns-circle-v2-label-width),62cqw)!important;
  }
  .ns-circle-v2-lower-item{
    --ns-circle-v2-label-cap:24cqw;
    font-size:clamp(10px,3.15cqw,13px)!important;
    line-height:1.3!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .ns-circle-v2-work,.ns-circle-v2-nine-value{animation:none!important}
  .ns-circle-v2-why,.ns-circle-v2-senses{animation:none!important}
  .ns-circle-v2-story,.ns-circle-v2-story-panel,.ns-circle-v2-story-detail{transition:none!important}
}

/* Story bubble timing.
   The default bubble blooms on a 1.9s delay with its text at 2.08s, which is
   right for a label you hovered but wrong here: the tokens were up and animating
   for two seconds before the copy describing them arrived. Under the story the
   bloom is tightened so both land together, and the close is left on the default
   .45s, which already matches the token fade. */
.ns-landing-circle-v2.ns-circle-v2-story-running .ns-circle-v2-bubbling .ns-circle-v2-bubble{
  transition:transform .8s cubic-bezier(.3,1.12,.35,1) .06s,opacity .5s ease .06s,filter .55s ease .12s;
}
.ns-landing-circle-v2.ns-circle-v2-story-running .ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-tip,
.ns-landing-circle-v2.ns-circle-v2-story-running .ns-circle-v2-bubbling .ns-circle-v2-bubble .ns-circle-v2-blink{
  transition:opacity .42s ease .3s,visibility 0s linear .3s;
}
