/* =========================================================
   Utilitários — classes de uso transversal.
   ========================================================= */

/* Rótulo pequeno em caixa-alta que abre as seções. */
.eyebrow {
  color: var(--gold-2);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

/* Entrada progressiva ao rolar. A classe .is-visible é aplicada
   por js/modules/reveal.js quando o elemento entra na viewport. */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: .65s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Sem JavaScript o conteúdo não pode ficar invisível. */
.no-js .reveal {
  opacity: 1;
  transform: none;
}

/* Trava a rolagem da página enquanto um diálogo modal está aberto.
   Aplicada por js/modules/portfolio.js a partir do estado do <dialog>. */
.is-dialog-open {
  overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}