/* ==========================================================================
   Pré-loader (abertura com o F)
   A classe has-intro é colocada no <html> pelo script do <head> em todo carregamento.
   Sem JavaScript, a camada nunca aparece.
   ========================================================================== */

.has-intro {
  overflow: hidden; /* a abertura revela a Hero; a rolagem volta logo depois */
}

.preloader {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  background: var(--void);
  cursor: pointer;
  /* garantia: mesmo se o JavaScript falhar, a camada some sozinha */
  animation: preloader-failsafe 0.4s ease 8s forwards;
}

.has-intro .preloader,
.preloader.is-active {
  display: block;
}

.preloader canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

/* durante a revelação, o canvas desenha o fundo com a janela em forma de F */
.preloader.is-revealing {
  background: transparent;
}

/* A Hero se forma dentro do F: durante a revelação, js/sections/preloader.js define no <html>
   valores de 0 a 1 para cada camada (céu, retrato, textos, botões, cabeçalho). O retrato se
   aproxima a partir do ponto entre os olhos (--rv-ox / --rv-oy) e perde o brilho excessivo. */
.is-intro-reveal .hero__atmos,
.is-intro-reveal .hero__mist {
  opacity: var(--rv-sky, 1);
}

.is-intro-reveal .hero__stage {
  opacity: var(--rv-stage, 1);
  transform: scale(var(--rv-zoom, 1));
  transform-origin: var(--rv-ox, 50%) var(--rv-oy, 40%);
  filter: brightness(calc(1 + var(--rv-glow, 0) * 1.2)) saturate(calc(1 + var(--rv-glow, 0) * 0.5));
}

.is-intro-reveal .hero__intro,
.is-intro-reveal .hero__title {
  opacity: var(--rv-text, 1);
  transform: translateY(calc((1 - var(--rv-text, 1)) * 1.25rem));
}

.is-intro-reveal .hero__lead {
  opacity: var(--rv-text2, 1);
  transform: translateY(calc((1 - var(--rv-text2, 1)) * 1.25rem));
}

.is-intro-reveal .hero__actions {
  opacity: var(--rv-actions, 1);
  transform: translateY(calc((1 - var(--rv-actions, 1)) * 1.25rem));
}

.is-intro-reveal .site-header {
  opacity: var(--rv-header, 1);
}

.preloader.is-done {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

@keyframes preloader-failsafe {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}