/* A sentence as big as the screen, held in the middle while the scroll lights its words in turn. Needs ../base/base.css. */

/* ---------- a sentence as big as the screen, its words lit by the scroll (Star's frase) ---------- */
.frase{position:relative}
.fr-palco{height:180vh;height:180svh}
.fr-fissa{position:sticky;top:0;height:100vh;height:100svh;display:grid;align-items:center}
.fr-t{font-family:var(--serif);font-size:clamp(40px,5.6vw,88px);font-weight:400;line-height:1.02;letter-spacing:-.022em;text-align:center}
.fr-a,.fr-b,.fr-l{display:block}
.fr-b{margin-top:.36em;color:var(--blu-t)}
.fr-nw{white-space:nowrap}
.fr-p{display:inline-block}

.fr-vivo .fr-p{opacity:.24;will-change:opacity}
@media (max-width:759px){.fr-l{display:inline}.fr-t{text-wrap:balance}}
@media (max-width:640px){.fr-palco{height:165vh;height:165svh}.fr-t{font-size:clamp(32px,9vw,42px);line-height:1.08}}

@media (prefers-reduced-motion:reduce){
  .fr-palco{height:auto}
  .fr-fissa{position:static;height:auto;padding-block:calc(var(--sez) * 1.1)}
  .fr-vivo .fr-p{opacity:1}
}