/* P-120 Founder Distance Field micro-fix v1.1
   Scope: FND-03 only, RU + EN.
   Optical goal: labels and axis read as one coordinate object.
   Does not alter Founder copy or Noto display typography. */

#fnd-03 .founder-vo__distance{
  width:100%;
  max-width:none;
  grid-template-columns:max-content minmax(120px,1fr) max-content;
  align-items:center;
  gap:0;
}

#fnd-03 .founder-vo__distance > span{
  position:relative;
  z-index:2;
  font-family:"IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-weight:300!important;
  font-size:clamp(11px,.72vw,12px)!important;
  line-height:1!important;
  letter-spacing:.16em!important;
  text-transform:uppercase;
  white-space:nowrap;
  color:color-mix(in srgb,var(--fnd-muted) 78%,var(--fnd-ink) 22%);
  transform:translateY(-5px);
}

#fnd-03 .founder-vo__distance > span:first-child{padding-right:2px}
#fnd-03 .founder-vo__distance > span:last-child{padding-left:2px;text-align:right}

#fnd-03 .founder-vo__distance-line{
  position:relative;
  z-index:1;
  height:1px;
  margin-inline:-12px;
  background:color-mix(in srgb,var(--vo-line) 78%,var(--vo-signal) 22%);
}

/* The anchor dots sit slightly inside the span so the hairline visibly continues
   8–14 px beneath each label rather than stopping before the word. */
#fnd-03 .founder-vo__distance-line:before,
#fnd-03 .founder-vo__distance-line:after{
  width:6px;
  height:6px;
  opacity:.82;
}
#fnd-03 .founder-vo__distance-line:before{left:12px}
#fnd-03 .founder-vo__distance-line:after{right:12px}

#fnd-03 .founder-vo__distance-line i{
  left:17%;
  right:17%;
  opacity:.72;
}

@media(max-width:820px){
  #fnd-03 .founder-vo__distance{
    grid-template-columns:max-content minmax(48px,1fr) max-content!important;
    gap:0!important;
    margin-top:48px;
  }
  #fnd-03 .founder-vo__distance > span{
    font-size:10px!important;
    letter-spacing:.14em!important;
    transform:translateY(-4px);
  }
  #fnd-03 .founder-vo__distance > span:first-child{order:1;padding-right:1px}
  #fnd-03 .founder-vo__distance-line{order:2;margin-inline:-8px}
  #fnd-03 .founder-vo__distance > span:last-child{order:3;padding-left:1px;text-align:right}
  #fnd-03 .founder-vo__distance-line:before{left:8px}
  #fnd-03 .founder-vo__distance-line:after{right:8px}
}

@media(max-width:520px){
  #fnd-03 .founder-vo__distance > span{
    font-size:9.5px!important;
    letter-spacing:.125em!important;
  }
  #fnd-03 .founder-vo__distance-line{margin-inline:-7px}
  #fnd-03 .founder-vo__distance-line:before{left:7px}
  #fnd-03 .founder-vo__distance-line:after{right:7px}
}