/* ==========================================================================
   INTRO DE CARREGAMENTO (10/11/2026) · em teste, so na homologacao
   Pedido do Claudio: o logo no centro surgindo esfumacado como os titulos
   do site, depois o X da marca girando devagar no preto com os raios da
   ShieldWP, o X gira, explode e abre o site.

   Uma vez por sessao do navegador (sessionStorage), na primeira pagina que a
   pessoa abre. Nas trocas de pagina seguintes quem trabalha e a transicao
   (transicao.css), com a mesma cortina preta.

   Quem faz o que:
   - um script de poucas linhas no <head> (impresso pelo mu-plugin) decide se
     a intro roda e poe a classe dp-intro no <html> ANTES da primeira pintura;
   - esta folha pinta a cortina preta so com essa classe, entao a pagina
     nunca pisca antes da intro;
   - o intro.js monta o palco (logo, o X em three.js da ShieldWP e a tela
     dos raios) e conduz o tempo.

   Seguranca: sem JavaScript nao existe classe, logo nao existe cortina. Se o
   intro.js nao chegar, a cortina some sozinha em 7s (dp-intro-some) e o
   script do <head> tira a classe no erro de carga.
   ========================================================================== */

/* a cortina de antes do palco: so cor, pintada na primeira pintura */
html.dp-intro::before {
  content: "";
  position: fixed; inset: 0; z-index: 2147483646;
  background: #0d0d0d;
  animation: dp-intro-some .4s 7s both;
}
/* com o palco montado a cortina passa a ser a tela dele */
html.dp-intro.dp-intro-palco::before { content: none; }

@keyframes dp-intro-some { to { opacity: 0; visibility: hidden; } }

/* o H1 da home espera a intro: as letras ficam no estado de partida e
   comecam a entrada delas no instante em que o X estoura */
html.dp-intro.td-ativo .td .td-letra {
  opacity: 0 !important; filter: blur(12px) !important; transition: none !important;
}

/* O palco (.dp-intro-el: a tela dos raios, o logo em tiras e o X em laminas)
   recebe a geometria em linha, pelo intro.js: o script pode rodar antes de
   esta folha chegar e nao pode medir elemento sem estilo. */

/* movimento reduzido: sem giro, sem raio e sem estouro. A cortina com o
   logo parado, um instante, e some */
html.dp-intro-calma::before {
  content: "";
  position: fixed; inset: 0; z-index: 2147483646;
  background: #0d0d0d url("../img/logo-dp-branco.webp") center / clamp(180px, 30vw, 420px) auto no-repeat;
  animation: dp-intro-some .3s .7s both;
}
