/* quem.css · #quem. Um parágrafo grande que acende com a rolagem.
   Com movimento: a seção fica alta e o parágrafo fica preso no meio da tela enquanto acende.
   Sem GSAP ou com movimento reduzido: bloco normal, todo aceso (.quem--aceso). */

.quem {
  position: relative;
  padding-block: var(--espaco-secao);
}
.quem__fixo { display: grid; align-items: center; }

/* altura de rolagem desde a 1ª pintura (sem salto quando o GSAP chega);
   .quem--aceso (sem GSAP) volta ao bloco normal */
.movimento .quem:not(.quem--aceso) {
  height: 250svh;
  padding-block: 0;
}
.movimento .quem:not(.quem--aceso) .quem__fixo {
  position: sticky; top: 0;
  height: 100svh;
  padding-bottom: var(--reserva-baixo);
}

.quem__texto {
  max-width: 21em;
  font-size: clamp(1.75rem, 4.5vw, 3.75rem);
  line-height: 1.12;
  letter-spacing: -.032em;
  font-weight: 600;
  color: var(--gelo);
  text-wrap: pretty;
}
.quem__palavra { will-change: opacity; }

@media (min-width: 980px) {
  .quem__texto { line-height: 1.1; }
}