#wordlist{
  position:relative;
  background:#F5F5F5;
  height:calc(404 * var(--vhu));
  border-bottom:1px solid #fff;
}
/* zona sticky: termina 91px abaixo do fundo da linha (unstick com section bottom em 462) */
.wl__zone{
  position:absolute; left:0; right:0; top:0;
  height:calc(312.5 * var(--vhu));
  pointer-events:none;
}
.wl__row{
  position:sticky; top:50%;
  margin-top:calc(98 * var(--vhu));
  height:calc(20 * var(--vhu));
  display:block;
}
.wl__label{
  position:absolute; left:var(--gutter); top:calc(4 * var(--vhu));
  color:#000; font-size:calc(8 * var(--u));
}
.wl__marker{
  position:absolute; top:calc(6 * var(--vhu));
  width:calc(8 * var(--u)); height:calc(8 * var(--u));
}
.wl__marker--left{left:calc(213.5 * var(--u))}
.wl__marker--right{left:calc(1190.75 * var(--u))}
.wl__marker svg{width:100%;height:100%;display:block}
.wl__phrase-mask{
  position:absolute; left:calc(325 * var(--u)); top:0;
  height:calc(20 * var(--vhu));
  overflow:hidden;
  width:calc(260 * var(--u));
}
.wl__phrase-strip{position:relative}
.wl__phrase{
  height:calc(20 * var(--vhu));
  display:flex; align-items:center;
  font-size:calc(18 * var(--u));
  letter-spacing:.01em;
  color:#000;
}
/* palavras */
.wl__words{
  position:absolute; left:calc(622.5 * var(--u)); top:calc(70 * var(--vhu));
}
.wl__word{
  font-size:calc(53 * var(--u));
  line-height:calc(66 * var(--vhu));
  color:#D6D6D6;
  transition:color .4s cubic-bezier(.45,0,.55,1);
}
.wl__word:not(.is-active){transition-delay:.08s}
.wl__word.is-active{color:#000}