/* faixa-tensa.css — tarefa 408 (escrito pelo auditor; copiar sem alterar).
   Faixa vermelha do topo (.promo-bar): as palavras chegam finas e vão pesando, 
   as palavras-chave ficam mais pesadas e "afundadas" (sombra). (Eletrocardiograma tirado na 413.) Só vale quando o faixa-tensa.js liga (.ft). */
.ft{overflow:hidden}
.ft__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ft .promo-bar__inner{position:relative;z-index:2}
.ft__p{display:inline-block;font-weight:400;opacity:.3;transform:translateY(-12px);
  transition:font-weight .8s ease,opacity .6s ease,transform .8s cubic-bezier(.5,0,.75,1)}
.ft.ft-on .ft__p{font-weight:800;opacity:1;transform:none}
.ft__p--pesa{transition-property:font-weight,opacity,transform,text-shadow}
.ft.ft-on .ft__p--pesa{font-weight:800;text-shadow:0 3px 0 rgba(0,0,0,.28),0 6px 14px rgba(0,0,0,.35)}

@media (prefers-reduced-motion:reduce){.ft__p{transition:none;opacity:1;transform:none;font-weight:inherit}}
