.np .nav-inner .nav-links { align-self: stretch; align-items: stretch; }
.np .np-item { position: relative; align-self: stretch; }

.np .nav-inner .nav-links > a { display: inline-flex; align-items: center; align-self: center; }

.np .np-panel {
  left: 0;
  right: auto;
  width: var(--np-w, 600px);
  max-width: calc(100vw - 40px);
  border-left: 1px solid var(--rule);
  border-right: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule-strong);
  border-radius: 0 0 var(--r-2) var(--r-2);
  box-shadow: 0 18px 40px rgba(14, 31, 56, .12);
}

.np .np-item[data-key="insurance"] { --np-w: 560px; }
.np .np-item[data-key="platform"]  { --np-w: 560px; }
.np .np-item[data-key="who"]       { --np-w: 640px; }

.np .np-inner {
  max-width: none;
  margin: 0;
  padding: 22px 26px 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 212px;
  gap: var(--s-5);
  align-items: start;
}
.np .np-links { display: block; align-self: center; }


.np .np-row {
  padding: 9px 10px 10px;
  margin: 0 -10px;
  border-radius: var(--r-1);
  transition: background var(--t-fast) var(--ease);
}
.np .np-row + .np-row { box-shadow: 0 -1px 0 var(--rule); }
.np .np-row:hover, .np .np-row:focus-visible { background: rgba(14, 31, 56, .045); }
.np .np-sub { margin-top: 4px; max-width: 42ch; }


.np .np-band {
  align-self: stretch;
  padding-left: var(--s-4);
  border-left: 1px solid var(--rule-strong);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.np .np-band-k {
  font-family: var(--mono);
  font-size: var(--fs-nano);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink);
  opacity: .62;
  line-height: 1.4;
  white-space: nowrap;
}
.np .np-score { position: relative; width: 96px; height: 96px; margin-top: 12px; }
.np .np-ring { width: 96px; height: 96px; display: block; transform: rotate(-90deg); }
.np .np-ring circle { fill: none; }
.np .np-ring-bg  { stroke: rgba(14, 31, 56, .12); stroke-width: 5; }
.np .np-ring-arc {
  stroke: rgba(14, 31, 56, .80);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 257.6;
  stroke-dashoffset: 257.6;
}
.np .np-item.band-run .np-ring-arc {
  animation: npArc .95s cubic-bezier(.2, .65, .25, 1) .15s forwards;
}

.np .np-num {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif);
  font-size: var(--fs-display);
  line-height: 1;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.np .np-bars { display: flex; align-items: flex-end; gap: 5px; height: 30px; margin-top: 14px; }
.np .np-bars span { width: 6px; background: var(--ink); opacity: .48; border-radius: 2px 2px 0 0; }
.np .np-item.band-run .np-bars span {
  animation: npBarUp .55s cubic-bezier(.2, .8, .3, 1.2) both;
  transform-origin: bottom;
}
.np .np-item.band-run .np-bars span:nth-child(1) { animation-delay: .30s; }
.np .np-item.band-run .np-bars span:nth-child(2) { animation-delay: .38s; }
.np .np-item.band-run .np-bars span:nth-child(3) { animation-delay: .46s; }
.np .np-item.band-run .np-bars span:nth-child(4) { animation-delay: .54s; }
.np .np-item.band-run .np-bars span:nth-child(5) { animation-delay: .62s; }
.np .np-item.band-run .np-bars span:nth-child(6) { animation-delay: .70s; }

.np .np-band-line {
  margin-top: 14px;
  font-family: var(--serif);
  font-size: var(--fs-body);
  line-height: 1.3;
  color: var(--ink);
  opacity: .72;
  max-width: 24ch;
}

.np .np-band-note {
  margin-top: 9px;
  font-family: var(--mono);
  font-size: var(--fs-nano);
  letter-spacing: .14em;
  color: var(--ink);
  opacity: .34;
}


.np .np-band-art { margin-top: 12px; width: 100%; max-width: 188px; }

.np .np-band-art svg { display: block; width: 100%; height: auto; overflow: visible; }
.np .np-band-art svg text {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: .12em;
  fill: var(--ink);
  opacity: .5;
}
.np .np-band-art .np-stroke { fill: none; stroke: var(--ink); stroke-width: 1.4; opacity: .8; }
.np .np-band-art .np-soft   { fill: none; stroke: var(--ink); stroke-width: 1.2; opacity: .28; }
.np .np-band-art .np-ink    { fill: var(--ink); stroke: none; opacity: .62; }


.np .npc-axis { stroke-dasharray: 164; stroke-dashoffset: 164; }
.np .np-item.band-run .npc-axis { animation: npDraw .85s cubic-bezier(.2, .7, .2, 1) forwards; }
.np .npc-tick { transform-box: fill-box; transform-origin: bottom; transform: scaleY(0); }

.np .np-item.band-run .npc-tick { animation: npTick .3s cubic-bezier(.2, .8, .3, 1.1) both; }
.np .np-item.band-run .npc-tick[data-i="1"] { animation-delay: .26s; }
.np .np-item.band-run .npc-tick[data-i="2"] { animation-delay: .40s; }
.np .np-item.band-run .npc-tick[data-i="3"] { animation-delay: .54s; }
.np .np-item.band-run .npc-tick[data-i="4"] { animation-delay: .68s; }
.np .npc-drop { stroke-dasharray: 22; stroke-dashoffset: 22; }
.np .np-item.band-run .npc-drop { animation: npDraw .4s cubic-bezier(.3, .7, .3, 1) .84s forwards; }
.np .npc-dot { opacity: 0; }
.np .np-item.band-run .npc-dot { animation: npIn .3s ease-out 1.12s forwards; }


.np .npd-fill { opacity: 0; }
.np .np-item.band-run .npd-fill { animation: npIn .28s ease-out both; }
.np .np-item.band-run .npd-fill[data-i="1"] { animation-delay: .20s; }
.np .np-item.band-run .npd-fill[data-i="2"] { animation-delay: .34s; }
.np .np-item.band-run .npd-fill[data-i="3"] { animation-delay: .48s; }
.np .np-item.band-run .npd-fill[data-i="4"] { animation-delay: .62s; }
.np .np-item.band-run .npd-fill[data-i="5"] { animation-delay: .76s; }

@keyframes npArc   { to { stroke-dashoffset: 33.5; } }
@keyframes npBarUp { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes npDraw  { to { stroke-dashoffset: 0; } }
@keyframes npTick  { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes npIn    { to { opacity: 1; } }


@media (prefers-reduced-motion: reduce) {
  .np .np-ring-arc { stroke-dashoffset: 33.5 !important; animation: none !important; }
  .np .np-bars span { animation: none !important; transform: none !important; }
  .np .npc-axis, .np .npc-drop { stroke-dashoffset: 0 !important; animation: none !important; }
  .np .npc-tick { transform: none !important; animation: none !important; }
  .np .npc-dot, .np .npd-fill { opacity: 1 !important; animation: none !important; }
}


html[data-nav-treat="plain"] .np .np-item[data-key] { --np-w: 360px; }
html[data-nav-treat="plain"] .np .np-band { display: none; }
html[data-nav-treat="plain"] .np .np-inner {
  grid-template-columns: minmax(0, 1fr);
  padding: 18px 22px 20px;
}
html[data-nav-treat="plain"] .np .np-sub { max-width: 34ch; }




@media (max-width: 1080px) {
  .np .np-panel { display: none; }
}


.np .np-inner { height: 344px; box-sizing: border-box; }
.np .np-band > * { flex: 0 0 auto; }