/* NOI stays together until the end of the page, then opens into NO. 1. */
.b-corner-base{position:relative;display:inline-block}
.b-corner-base::after{content:".";position:absolute;left:100%;top:0;opacity:0;transition:opacity .2s ease .35s}
.b-corner-slot{position:relative;display:inline-block}
.b-corner-traveler{position:relative;display:inline-block;transform:translateX(0);transition:transform 1s cubic-bezier(.65,0,.2,1);will-change:transform}
.b-corner-i{display:inline-block;opacity:1;transition:opacity .2s ease .4s}
.b-corner-one{position:absolute;left:0;top:0;opacity:0;transition:opacity .2s ease .4s}
.b-corner.is-number-one .b-corner-base::after{opacity:1}
.b-corner.is-number-one .b-corner-traveler{transform:translateX(var(--number-travel,0px))}
.b-corner.is-number-one .b-corner-i{opacity:0}
.b-corner.is-number-one .b-corner-one{opacity:1}
@media(prefers-reduced-motion:reduce){
  .b-corner-base::after,.b-corner-traveler,.b-corner-i,.b-corner-one{transition:none}
}